快捷备注

This commit is contained in:
Mr.jiang 2024-08-13 16:22:58 +08:00
parent 2d128b3c7d
commit d8bc69d8b1
4 changed files with 97 additions and 52 deletions

View File

@ -120,7 +120,13 @@
<view class="header-view header-padd header-margin" style="margin-bottom: 100px;"> <view class="header-view header-padd header-margin" style="margin-bottom: 100px;">
<view class="d-title title-font"> <view class="d-title title-font">
<span>给技师捎句话</span> <span>给技师捎句话</span>
<span style="color: rgb(9, 111, 75);" @click="kuaijie">快捷输入</span> <!-- <span style="color: rgb(9, 111, 75);" @click="kuaijie">快捷输入</span> -->
</view>
<view class="guke-list">
<view class="guke-btn huiBtn" :class="{ lanBtn: selected.includes(item) }"
@click="gukeBtn(item)" v-for="(item,index) in fuwuBtn" :key="index">
{{item.title}}
</view>
</view> </view>
<view class="list-pay"> <view class="list-pay">
<view class="textarea-pay-list"> <view class="textarea-pay-list">
@ -302,9 +308,9 @@
selected:[], selected:[],
selectedString:'', selectedString:'',
fuwuBtn: [ fuwuBtn: [
{'title':'请速回电确认服务时间地点'}, {'title':'请速回电'},
{'title':'到达后请先电话联系,切勿大声敲门'}, {'title':'切勿大声敲门'},
{'title':'时间紧张,请尽快到达服务位置'}, {'title':'请尽快上门服务'},
{'title':'直接来即可'}, {'title':'直接来即可'},
], ],
} }
@ -1367,35 +1373,40 @@
font-weight: bold; font-weight: bold;
font-size: 14px; font-size: 14px;
margin-top: 10px; margin-top: 10px;
background: #fff;
// color: #049F89; // color: #049F89;
} }
.huiBtn { .huiBtn {
color: #333333; color:#333;
background: #ccc;
// color: #333333;
} }
.lanBtn { .lanBtn {
color: #049F89; color:#fff;
background: #049F89;
} }
.guke-btn { .guke-btn {
width: 100%; width: 45%;
height: 40px; // height: 40px;
line-height: 40px; line-height: 40px;
margin-left: 5px; // margin-left: 5px;
text-align: center; text-align: center;
line-height: 40px; // line-height: 40px;
font-weight: bold; font-weight: bold;
font-size: 12px; font-size: 12px;
border-radius: 6px; border-radius: 6px;
border-bottom: 1px solid #ccc; margin-top:5px;
// border-bottom: 1px solid #ccc;
} }
.guke-list { .guke-list {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: row;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
box-sizing: border-box; box-sizing: border-box;
background-color: #fff; background-color: #fff;
justify-content: space-between;
} }
.jusitify-line{ .jusitify-line{
height: 76rpx; height: 76rpx;

View File

@ -146,7 +146,13 @@
<view class="header-view header-padd" style="margin-bottom: 100px;"> <view class="header-view header-padd" style="margin-bottom: 100px;">
<view class="d-title"> <view class="d-title">
<span>给技师捎句话</span> <span>给技师捎句话</span>
<span style="color: rgb(9, 111, 75);" @click="kuaijie">快捷输入</span> <!-- <span style="color: rgb(9, 111, 75);" @click="kuaijie">快捷输入</span> -->
</view>
<view class="guke-list">
<view class="guke-btn huiBtn" :class="{ lanBtn: selected.includes(item) }"
@click="gukeBtn(item)" v-for="(item,index) in fuwuBtn" :key="index">
{{item.title}}
</view>
</view> </view>
<view class="list-pay"> <view class="list-pay">
<view class="textarea-pay-list"> <view class="textarea-pay-list">
@ -268,9 +274,9 @@
data() { data() {
return { return {
fuwuBtn: [ fuwuBtn: [
{'title':'请速回电确认服务时间地点'}, {'title':'请速回电'},
{'title':'到达后请先电话联系,切勿大声敲门'}, {'title':'切勿大声敲门'},
{'title':'时间紧张,请尽快到达服务位置'}, {'title':'请尽快上门服务'},
{'title':'直接来即可'}, {'title':'直接来即可'},
], ],
selected:[], selected:[],
@ -1436,6 +1442,7 @@
.header-margin{ .header-margin{
margin:20rpx; margin:20rpx;
} }
.kuaijie-btn{ .kuaijie-btn{
width: 100%; width: 100%;
height: 40px; height: 40px;
@ -1444,35 +1451,40 @@
font-weight: bold; font-weight: bold;
font-size: 14px; font-size: 14px;
margin-top: 10px; margin-top: 10px;
background: #fff;
// color: #049F89; // color: #049F89;
} }
.huiBtn { .huiBtn {
color: #333333; color:#333;
background: #ccc;
// color: #333333;
} }
.lanBtn { .lanBtn {
color: #049F89; color:#fff;
background: #049F89;
} }
.guke-btn { .guke-btn {
width: 100%; width: 45%;
height: 40px; // height: 40px;
line-height: 40px; line-height: 40px;
margin-left: 5px; // margin-left: 5px;
text-align: center; text-align: center;
line-height: 40px; // line-height: 40px;
font-weight: bold; font-weight: bold;
font-size: 12px; font-size: 12px;
border-radius: 6px; border-radius: 6px;
border-bottom: 1px solid #ccc; margin-top:5px;
// border-bottom: 1px solid #ccc;
} }
.guke-list { .guke-list {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: row;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
box-sizing: border-box; box-sizing: border-box;
background-color: #fff; background-color: #fff;
justify-content: space-between;
} }
.title-font{ .title-font{
font-size:30rpx; font-size:30rpx;

View File

@ -122,7 +122,13 @@
<view class="header-view header-padd header-margin" style="margin-bottom: 100px;"> <view class="header-view header-padd header-margin" style="margin-bottom: 100px;">
<view class="d-title title-font"> <view class="d-title title-font">
<span>给技师捎句话</span> <span>给技师捎句话</span>
<span style="color: rgb(9, 111, 75);" @click="kuaijie">快捷输入</span> <!-- <span style="color: rgb(9, 111, 75);" @click="kuaijie">快捷输入</span> -->
</view>
<view class="guke-list">
<view class="guke-btn huiBtn" :class="{ lanBtn: selected.includes(item) }"
@click="gukeBtn(item)" v-for="(item,index) in fuwuBtn" :key="index">
{{item.title}}
</view>
</view> </view>
<view class="list-pay"> <view class="list-pay">
<view class="textarea-pay-list"> <view class="textarea-pay-list">
@ -304,9 +310,9 @@
selected:[], selected:[],
selectedString:'', selectedString:'',
fuwuBtn: [ fuwuBtn: [
{'title':'请速回电确认服务时间地点'}, {'title':'请速回电'},
{'title':'到达后请先电话联系,切勿大声敲门'}, {'title':'切勿大声敲门'},
{'title':'时间紧张,请尽快到达服务位置'}, {'title':'请尽快上门服务'},
{'title':'直接来即可'}, {'title':'直接来即可'},
], ],
} }
@ -1382,35 +1388,40 @@
font-weight: bold; font-weight: bold;
font-size: 14px; font-size: 14px;
margin-top: 10px; margin-top: 10px;
background: #fff;
// color: #049F89; // color: #049F89;
} }
.huiBtn { .huiBtn {
color: #333333; color:#333;
background: #ccc;
// color: #333333;
} }
.lanBtn { .lanBtn {
color: #049F89; color:#fff;
background: #049F89;
} }
.guke-btn { .guke-btn {
width: 100%; width: 45%;
height: 40px; // height: 40px;
line-height: 40px; line-height: 40px;
margin-left: 5px; // margin-left: 5px;
text-align: center; text-align: center;
line-height: 40px; // line-height: 40px;
font-weight: bold; font-weight: bold;
font-size: 12px; font-size: 12px;
border-radius: 6px; border-radius: 6px;
border-bottom: 1px solid #ccc; margin-top:5px;
// border-bottom: 1px solid #ccc;
} }
.guke-list { .guke-list {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: row;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
box-sizing: border-box; box-sizing: border-box;
background-color: #fff; background-color: #fff;
justify-content: space-between;
} }
.head-bottom{ .head-bottom{
width: 100%; width: 100%;

View File

@ -101,7 +101,13 @@
<view class="header-view header-padd header-margin" style="margin-bottom: 100px;"> <view class="header-view header-padd header-margin" style="margin-bottom: 100px;">
<view class="d-title title-font"> <view class="d-title title-font">
<span>给技师捎句话</span> <span>给技师捎句话</span>
<span style="color: rgb(9, 111, 75);" @click="kuaijie">快捷输入</span> <!-- <span style="color: rgb(9, 111, 75);" @click="kuaijie">快捷输入</span> -->
</view>
<view class="guke-list">
<view class="guke-btn huiBtn" :class="{ lanBtn: selected.includes(item) }"
@click="gukeBtn(item)" v-for="(item,index) in fuwuBtn" :key="index">
{{item.title}}
</view>
</view> </view>
<view class="list-pay"> <view class="list-pay">
<view class="textarea-pay-list"> <view class="textarea-pay-list">
@ -283,9 +289,9 @@
selected:[], selected:[],
selectedString:'', selectedString:'',
fuwuBtn: [ fuwuBtn: [
{'title':'请速回电确认服务时间地点'}, {'title':'请速回电'},
{'title':'到达后请先电话联系,切勿大声敲门'}, {'title':'切勿大声敲门'},
{'title':'时间紧张,请尽快到达服务位置'}, {'title':'请尽快上门服务'},
{'title':'直接来即可'}, {'title':'直接来即可'},
], ],
} }
@ -1397,35 +1403,40 @@
font-weight: bold; font-weight: bold;
font-size: 14px; font-size: 14px;
margin-top: 10px; margin-top: 10px;
background: #fff;
// color: #049F89; // color: #049F89;
} }
.huiBtn { .huiBtn {
color: #333333; color:#333;
background: #ccc;
// color: #333333;
} }
.lanBtn { .lanBtn {
color: #049F89; color:#fff;
background: #049F89;
} }
.guke-btn { .guke-btn {
width: 100%; width: 45%;
height: 40px; // height: 40px;
line-height: 40px; line-height: 40px;
margin-left: 5px; // margin-left: 5px;
text-align: center; text-align: center;
line-height: 40px; // line-height: 40px;
font-weight: bold; font-weight: bold;
font-size: 12px; font-size: 12px;
border-radius: 6px; border-radius: 6px;
border-bottom: 1px solid #ccc; margin-top:5px;
// border-bottom: 1px solid #ccc;
} }
.guke-list { .guke-list {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: row;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
box-sizing: border-box; box-sizing: border-box;
background-color: #fff; background-color: #fff;
justify-content: space-between;
} }
.textarea-pay-list{ .textarea-pay-list{
width: 100%; width: 100%;