订单页面调整

This commit is contained in:
曹磊 2024-07-22 23:50:15 +08:00
parent 47399a7647
commit fd95ca0fca
6 changed files with 3477 additions and 3233 deletions

File diff suppressed because it is too large Load Diff

View File

@ -44,7 +44,7 @@
</view>
</view>
</view>
<view class="header-view header-padd header-margin ">
<view class="header-view header-padd header-margin">
<view v-if="!detailaddress">请选择地址</view>
<view class="margin-right-xs">
<view class="jusitify-line">
@ -78,7 +78,7 @@
</view>
</view>
</view>
<view class="header-view header-padd header-margin ">
<view class="header-view header-padd header-margin">
<view class="jusitify-line" @click="liliaoshi">
<view class="line-word title-font" >
<span v-if="jishiName">{{jishiName.technicianTypeName}}</span>
@ -1811,21 +1811,6 @@
text-decoration-line: line-through;
margin-left: 5px;
}
.money-pay-zhen span{
color: #FF6000;
}
.money-pay-zhen span:nth-child(1){
font-size: 25rpx;
}
.money-pay-zhen span:nth-child(2){
font-size: 31.25rpx;
font-weight: bold;
}
.money-pay-zhen{
display: flex;
flex-direction: row;
align-items: center;
}
.money-pay{
width: 100%;
display: flex;

View File

@ -3,14 +3,14 @@
<view class="padding-bottom u-skeleton">
<view class="bgImg u-skeleton-fillet" style="padding: 0 29rpx;">
<view class="head-top">
<view class="pay-title" style="">服务项目</view>
<view class="pay-title">服务项目</view>
<view class="flex">
<view class="" style="width: 160upx;height: 160upx;">
<image :src="(orderXm.ordersMassageList && orderXm.ordersMassageList.length > 0 && orderXm.ordersMassageList[0].massageType && orderXm.ordersMassageList[0].massageType.massageImg)?orderXm.ordersMassageList[0].massageType.massageImg: '../../static/logo.png'"
style="width: 100%;height: 100%;border-radius: 19upx;"></image>
</view>
<view class="head-bottom margin-left-sm">
<view class="u-flex-1 margin-left-sm">
<view class="flex head-title-right">
<view class="margin-right-xs text-df u-skeleton-fillet head-title">
{{orderXm.entryName}}
@ -19,14 +19,14 @@
</view>
<view class="flex align-center">
<view style="width: 100%;">
<view class="flex justify-between margin-tb-sm" style="color: #999999;">
<view class="flex justify-between margin-tb-sm">
<view style="justify-content: space-between;">
{{orderXm.duration}}分钟
<text class="title-font">服务时长</text><text class="value-font">{{orderXm.duration}}分钟</text>
</view>
</view>
<view class="money-pay">
<view class="money-pay-zhen" v-if="orderXm.userPackageDetailId==null">
<text class="title-font">项目价格</text>
<span></span>
<span v-if="jishiName!=null||jishiName==''">
{{technicianRate}}
@ -34,6 +34,7 @@
<span v-else>{{orderXm.priceMarkup}}</span>
</view>
<view class="money-pay-zhen" v-else>
<text class="title-font">项目价格</text>
<span></span>
<span>{{orderXm.priceMarkup}}</span>
</view>
@ -46,105 +47,116 @@
</view>
</view>
</view>
<view class="padding margin-top-sm header-view">
<view v-if="!detailaddress">请选择地址</view>
<view class="margin-right-xs">
<view class="jusitify-line">
<view class="line-word">联系人</view>
<view class="line-word-r">
<text>{{name}}</text>
<text class="xuanzhe" @click="getAddressList()">修改</text>
</view>
<view class="header-view header-padd header-margin">
<view v-if="!detailaddress">请选择地址</view>
<view class="margin-right-xs">
<view class="jusitify-line">
<view class="line-word title-font">客户姓名</view>
<view class="line-word-r value-font">
<text>{{name}}</text>
<text class="xuanzhe" @click="getAddressList()">更换</text>
</view>
</view>
<view class="jusitify-line">
<view class="line-word title-font">联系方式</view>
<view class="line-word-r value-font">
{{mobile}}
</view>
</view>
<view class="jusitify-line" style="align-items: center;">
<view class="line-word title-font">服务地址</view>
<view class="line-word-r value-font" style="width: 75%; text-align: right;">
<span>
{{province}}/{{city}}/{{district}}/{{detailaddress}}
</span>
</view>
</view>
<!-- <view class="jusitify-line" v-if="order.remark">
<view style="width: 170rpx;">备注内容</view>
<view class="flex">
<view class="">
{{order.remark}}
</view>
</view>
<view class="jusitify-line">
<view class="line-word">手机号码</view>
<view class="line-word-r">
{{mobile}}
</view>
</view>
<view class="jusitify-line" style="align-items: center;">
<view class="line-word">详细地址</view>
<view class="line-word-r" style="width: 73%; text-align: right;">
<span>
{{province}}/{{city}}/{{district}}/{{detailaddress}}
</span>
</view>
</view>
<!-- <view class="jusitify-line" v-if="order.remark">
<view style="width: 170rpx;">备注内容</view>
<view class="flex">
<view class="">
{{order.remark}}
</view>
</view>
</view> -->
</view> -->
</view>
</view>
<view class="header-view header-padd header-margin">
<view class="jusitify-line" @click="liliaoshi(orderXm)">
<view class="line-word title-font">
<span>技师</span>
<span v-if="jishiName">{{jishiName.technicianTypeName}}</span>
</view>
<view>
<span class="line-word-r value-font" v-if="jishiName">{{jishiName.artificerName}}</span>
<span class="line-word-r value-font" v-else>选择不同等级的技师价格不同哦~</span>
<span class="view-more"></span>
</view>
</view>
<view class="padding margin-top-sm header-view">
<view class="jusitify-line" @click="liliaoshi(orderXm)">
<view class="line-word" >
<span>技师</span>
<span v-if="jishiName">{{jishiName.technicianTypeName}}</span>
</view>
<view>
<span class="line-word-r" v-if="jishiName">{{jishiName.artificerName}}</span>
<span class="line-word-r" v-else>选择不同技师价格可能不一样哦~</span>
<span class="view-more"></span>
</view>
</view>
<view v-if="orderXm.userPackageDetailId==null">
<view class="jusitify-line" v-if="jishiName">
<view class="line-word" >
<view class="line-word title-font">
<span >项目原价</span>
</view>
<view >
<span class="line-word-r">{{orderXm.price}}</span>
<span class="line-word-r value-font">{{orderXm.price}}</span>
</view>
</view>
<view class="jusitify-line" v-if="jishiName">
<view class="line-word" >
<view class="line-word title-font">
<span>{{jishiName.technicianTypeName}}</span>
<span >价格</span>
</view>
<view >
<span class="line-word-r" style="color: #FF6000">{{technicianRate}}</span>
<span class="line-word-r value-font" style="color: #019c88">{{technicianRate}}</span>
</view>
</view>
<!-- <view class="liliao">
<view class="liliao-top" style="width: 30%;">
<span>平台优惠劵</span>
</view>
<view v-else>
<view class="jusitify-line" v-if="jishiName">
<view class="line-word title-font">
<span >项目价格</span>
</view>
<view class="header-bottom-money-zhen">
<view class="" style="margin-right: 5px;">
<span>-{{orderXm.couponMoney}}</span>
</view>
<view >
<span class="line-word-r value-font">{{orderXm.price}}</span>
</view>
</view>
</view>
<!-- <view class="liliao">
<view class="liliao-top" style="width: 30%;">
<span>平台优惠劵</span>
</view>
<view class="header-bottom-money-zhen">
<view class="" style="margin-right: 5px;">
<span>-{{orderXm.couponMoney}}</span>
</view>
</view>
</view> -->
<view class="jusitify-line">
<view class="line-word title-font">
服务时间
</view>
<!-- <view class="fuwu-time-view" @change="changeLog">
<uni-datetime-picker :hide-second='true' v-model="single" type="datetime">{{single==''?order.serveTime:single}}</uni-datetime-picker>
<image style="margin-left: 5px;" class="fuwu-img" src="../../static/images/my/jiantou.png" mode=""></image>
</view> -->
<view class="jusitify-line">
<view class="line-word">
服务时间
</view>
<!-- <view class="fuwu-time-view" @change="changeLog">
<uni-datetime-picker :hide-second='true' v-model="single" type="datetime">{{single==''?order.serveTime:single}}</uni-datetime-picker>
<image style="margin-left: 5px;" class="fuwu-img" src="../../static/images/my/jiantou.png" mode=""></image>
</view> -->
<view>
<view class="line-word-r" @click="openData()" style="align-items: center;">
<view v-if="startTime">{{startTime}}</view>
<view class="line-word-r" v-else>请选择预约时间<span class="view-more"></span></view>
</view>
<view>
<view class="line-word-r value-font" @click="openData()" style="align-items: center;">
<view v-if="startTime">{{startTime}}</view>
<view class="line-word-r value-font" v-else>请选择预约时间<span class="view-more"></span></view>
</view>
</view>
</view>
<view class="margin-top-xl pay-ding">
<view class="d-title">备注</view>
<view class="list-pay">
<view class="textarea-pay-list">
<textarea @input="textareaChange" class="textarea-pay" v-model="textareaData" placeholder="请输入备注" name="" maxlength="100"></textarea>
</view>
</view>
<view class="header-view header-padd header-margin">
<view class="d-title title-font">备注</view>
<view class="list-pay">
<view class="textarea-pay-list">
<textarea @input="textareaChange" class="textarea-pay" v-model="textareaData" placeholder="请输入备注" name="" maxlength="100"></textarea>
</view>
</view>
</view>
<!-- <view class="margin-top-xl pay-ding">
<view class="d-title" style="margin-bottom: 5px;">服务保障</view>
<view class="list-pay">
@ -165,7 +177,6 @@
<uni-data-checkbox v-model="radio1" :localdata="sex"></uni-data-checkbox>
</view>
</view> -->
</view>
<view class="push-button">
@ -1395,12 +1406,7 @@
}
.money-pay-zhen span{
color: #FF6000;
}
.money-pay-zhen span:nth-child(1){
font-size: 25rpx;
}
.money-pay-zhen span:nth-child(2){
font-size: 31.25rpx;
font-size: 32rpx;
font-weight: bold;
}
.money-pay-zhen{
@ -1606,11 +1612,15 @@
}
.xuanzhe{
background: linear-gradient(90deg, #029d88, #2fc094);
color: #ffffff;
margin-left: 5px;
border-radius: 15px;
padding: 3px 8px;
font-size: 13px;
color: #ffffff;
margin-left: 5px;
border-radius: 15px;
height: 25px;
line-height: 25px;
width: 50px;
text-align: center;
font-size: 14px;
padding:6rpx 16rpx
}
.header-view-data{
display: flex;
@ -1639,14 +1649,19 @@
}
.header-view-text{
width: 170rpx;
font-size: 30rpx;
color: #999999;
font-size: 29rpx;
color: #222222;
}
.header-view{
background-color: #fff;
margin-bottom: 10px;
border-radius: 11px;
}
.header-padd{
padding: 36rpx;
}
.header-margin{
margin: 26rpx;
}
.head-foot span:nth-child(1){
margin-right: 5px;
}
@ -1717,6 +1732,7 @@
background-color: #ffffff;
border-radius: 24rpx;
padding: 29rpx;
margin-top: 10px;
}
.d-title{
font-weight: bold;
@ -1741,7 +1757,6 @@
}
.list-pay{
width: 100%;
padding: 0px 29rpx;
}
.pay-ding-top{
width: 100%;
@ -1828,9 +1843,10 @@
}
.d-touxiang{
width: 46rpx;
height: 46rpx;
width: 55rpx;
height: 55rpx;
border-radius: 50%;
border: 1px solid #f2fffd;
}
.money-pay-jia{
font-weight: 400;
@ -1839,21 +1855,6 @@
text-decoration-line: line-through;
margin-left: 5px;
}
.money-pay-zhen span{
color: #FF6000;
}
.money-pay-zhen span:nth-child(1){
font-size: 25rpx;
}
.money-pay-zhen span:nth-child(2){
font-size: 31.25rpx;
font-weight: bold;
}
.money-pay-zhen{
display: flex;
flex-direction: row;
align-items: center;
}
.money-pay{
width: 100%;
display: flex;
@ -1868,9 +1869,9 @@
}
.pay-title{
font-weight: bold;
font-size: 30rpx;
font-size: 32rpx;
color: #333333;
margin-bottom: 8px;
margin-bottom: 12px;
}
page {
background: #f7f7f7;
@ -2061,4 +2062,17 @@
justify-content: space-between;
align-items: center;
}
.head-title{
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.title-font{
font-size: 30rpx;
color: #666666;
}
.value-font{
font-size: 30rpx;
color: #333333;
}
</style>

File diff suppressed because it is too large Load Diff

View File

@ -233,8 +233,8 @@
<view class="value-font" style="font-weight: bold;"><text>{{order.payMoney}}</text></view>
</view>
</view>
<view class="jusitify-line-end"></view>
<view v-if="order.addNum!=null">
<view class="jusitify-line-end"></view>
<view class="justify-title-nav">
<view class="justify-title">加钟信息</view>
<view class="justify-title-nav-bor"></view>
@ -439,8 +439,8 @@
<view class="value-font" style="font-weight: bold;"><text>{{order.payMoney}}</text></view>
</view>
</view>
<view class="jusitify-line-end"></view>
<view v-if="order.addNum!=null">
<view class="jusitify-line-end"></view>
<view class="justify-title-nav">
<view class="justify-title">加钟信息</view>
<view class="justify-title-nav-bor"></view>
@ -2341,7 +2341,7 @@
color: #7D7D7D;
margin-left: 26rpx;
}
.showBtn,.hideBtn{
width: 100%;
display: flex;

View File

@ -61,23 +61,23 @@
</view>
</view>
</view>
<view class="" style="background-color: #ffffff;border-radius: 24rpx;margin-top: 24rpx;padding: 29rpx;">
<view class="add-content">
<view class="" v-if="order.artificer">
<view class="flex justify-between add-lin">
<view class="add-con-title title-font">客户姓名</view>
<view class="add-con-cont value-font">
<view class="flex align-center justify-between jusitify-line">
<view class="line-word title-font">客户姓名</view>
<view class="line-word-r value-font">
{{order.userName}}
</view>
</view>
<view class="flex justify-between add-lin">
<view class="add-con-title title-font">联系方式</view>
<view class="add-con-cont value-font">
<view class="flex align-center justify-between jusitify-line">
<view class="line-word title-font">联系方式</view>
<view class="line-word-r value-font">
{{order.phone ? order.phone.substring(0,3) + '****' + order.phone.substring(7,11) : ''}}
</view>
</view>
<view class="serverAddress">
<view class="add-con-title title-font">服务地址</view>
<view class="value-font" style="width: 73%; text-align: right;">{{order.address}}</view>
<view class="serverAddress jusitify-line">
<view class="line-word title-font">服务地址</view>
<view class="line-word-r value-font" style="width: 75%; text-align: right;">{{order.address}}</view>
</view>
</view>
</view>
@ -85,8 +85,8 @@
<view class="margin-top-xl pay-ding">
<view class="flex align-center pay-ding-top">
<image :src="order.artificer.artificerImg" class="d-touxiang"></image>
<view class="margin-left-sm flex" style="width: 90%;justify-content: space-between;flex-direction: row;align-items: center;">
<view class="flex align-center" style="width: 80%;justify-content: space-between;">
<view class="margin-left-sm" style="width: 90%;">
<view class="flex align-center" style="width: 100%;justify-content: space-between;">
<view class="d-title">{{order.artificer.artificerName}}</view>
<!-- <image
v-if="order.status !=1 && order.status !=5 && order.status !=3 && order.status !=4 && order.status !=2"
@ -94,8 +94,8 @@
@click="bindphone(order.artificer.phone)"></image> -->
<!-- <image src="../../static/img/phone.png" class="phone-pay"
@click="bindphone(order.artificer.phone)"></image> -->
<view class="level_button">{{order.technicianTypeName}}</view>
</view>
<view class="level_button">{{order.technicianTypeName}}</view>
</view>
</view>
<view class="list-pay">
@ -152,7 +152,7 @@
<view class="add-con-cont value-font">{{order.massagePrice}}</view>
</view>
<view class="flex justify-between add-lin" style="justify-content: flex-end;">
<view class="title-font">实付金额</view>
<view class="title-font title-font">实付金额</view>
<view class="add-con-cont value-font" style="font-weight: bold;">
<text>0</text>
</view>
@ -1811,11 +1811,11 @@
}
.pay-ding-top{
width: 100%;
height: 50px;
height: 100rpx;
background-image: linear-gradient(to bottom, rgba(219, 242, 238, 0.9), #fff);
border-top-left-radius: 12px;
border-top-right-radius: 12px;
padding: 0px 14px;
border-top-left-radius: 24rpx;
border-top-right-radius: 24rpx;
padding: 0px 29rpx;
}
.pay-ding,.feiuong{
background-color: #ffffff;
@ -1828,14 +1828,15 @@
height: 44rpx;
}
.d-title{
font-weight: bold;
font-size: 32rpx;
color: #333333;
font-weight: bold;
}
.d-touxiang{
width: 60rpx;
height: 60rpx;
width: 55rpx;
height: 55rpx;
border-radius: 50%;
border: 1px solid #f2fffd;
}
.money-pay-jia{
font-weight: 400;
@ -2055,6 +2056,14 @@
justify-content: space-between;
align-items: center;
}
.add-content {
background: #fff;
padding: 30rpx;
border-radius: 24rpx;
margin-top: 24rpx;
}
.head-text{
font-size:30rpx;
}
@ -2073,11 +2082,12 @@
text-align:right;
}
.level_button{
padding: 3rpx 13rpx;
background: linear-gradient(to right, #fe9131, #ff9869);
border-radius: 16rpx 16rpx 16rpx 1rpx ;
color: #fff;
padding: 4rpx 20rpx;
background: linear-gradient(to right, #ffc1a9, #fedec9, #fdbb9f);
border-radius: 16rpx 16rpx 16rpx 1rpx;
color: #e95c3b;
font-size: 12px;
border: 1px solid #fd967c;
}
.justify-title-nav{
width: 90%;
@ -2099,6 +2109,13 @@
font-size: 32rpx;
color: #333;
}
.jusitify-line {
height: 78rpx;
padding: 20rpx 0;
font-size: 30rpx;
}
.jusitify-line-end{
height:1px;
border-bottom: 1px #e5e5e5 solid;