yangjun
/
sadjv3_user
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

订单页面调整

This commit is contained in:
曹磊 2024-07-22 15:36:15 +08:00
parent 9f452d2752
commit d4cb7a9b62
5 changed files with 216 additions and 168 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/colorui/main.css
View File

@ -3134,7 +3134,7 @@ scroll-view.cu-steps .cu-item {
.margin-tb-sm {
margin-top: 20upx;
margin-bottom: 20upx;
margin-bottom: 13upx;
}
.margin-tb {

3
my/order/pay.vue
View File

@ -294,8 +294,7 @@
</view>
<view class="flex justify-between jusitify-line" >
<view class="line-word title-font">出行费用</view>
<view class="line-word-r value-font" v-if="order.taxiMoney">￥{{order.taxiMoney}}</view>
<view class="line-word-r value-font" v-else>-</view>
<view class="line-word-r value-font">￥{{order.taxiMoney}}</view>
</view>
<view class="jusitify-line-end jusitify-line"></view>
<view class="justify-title-nav">

235
my/order/payModify.vue
View File

@ -9,19 +9,19 @@
<image :src="orderXm.massageImg"
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">
<view class="margin-right-xs u-skeleton-fillet head-title">
{{orderXm.title}}
</view>
</view>
<view class="flex align-center">
<view style="justify-content: space-between;">
<text class="title-font">服务时长：</text><text class="value-font">{{orderXm.duration}}分钟</text>
</view>
</view>
<view class="flex align-center">
<view style="width: 100%;">
<view class="flex justify-between margin-tb-sm">
<view style="justify-content: space-between;">
<text class="title-font">服务时长：</text><text class="value-font">{{orderXm.duration}}分钟</text>
</view>
</view>
<view class="money-pay">
<view class="money-pay-zhen">
<text class="title-font">项目价格：</text>
@ -43,113 +43,107 @@
</view>
</view>
</view>
<view class="ske-padding margin-top-sm header-view">
<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: 73%; text-align: right; ">
<span>
{{province}}/{{city}}/{{district}}/{{detailaddress}}
</span>
</view>
</view>
<view class="jusitify-line" v-if="order.remark">
<view class="line-word title-font">备注内容</view>
<view class="flex">
<view class="value-font">
{{order.remark}}
</view>
</view>
</view>
</view>
</view>
<view class="ske-padding margin-top-sm header-view">
<view class="jusitify-line" @click="liliaoshi">
<view class="line-word title-font" >
<span v-if="jishiName">{{jishiName.technicianTypeName}}</span>
<span >技师</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="jusitify-line" v-if="jishiName">
<view class="line-word title-font" >
<span >项目原价</span>
</view>
<view >
<span class="line-word-r value-font">￥{{orderXm.price}}</span>
</view>
</view>
<view class="jusitify-line" v-if="jishiName">
<view class="line-word title-font" >
<span>{{jishiName.technicianTypeName}}</span>
<span >价格</span>
</view>
<view >
<span class="line-word-r value-font" style="color: #019c88">￥{{technicianRate}}</span>
</view>
</view>
<view class="jusitify-line" @click="youhuijuan">
<view class="line-word title-font">优惠券</view>
<view class="header-bottom-money-zhen">
<view v-if="couponDataList" class="" style="margin-right: 5px;">
<span>-￥{{couponDataList}}</span>
</view>
<span v-else>选择优惠券</span>
<span class="view-more"></span>
</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="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="flex align-center justify-between value-font" style="margin-top: 15rpx;">
<view class="flex justify-between margin-tb-sm" @click="openData()">
<view v-if="startTime">{{startTime}}</view>
<view class="line-word-r" v-else>选择预约时间<span class="view-more"></span></view>
<!---<u-icon name="arrow-right" color="#999999"></u-icon>-->
</view>
<view class="line-word title-font">联系方式</view>
<view class="line-word-r value-font">
{{mobile}}
</view>
</view>
</view>
<view class="margin-top-xl pay-ding">
<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 class="jusitify-line" style="align-items: center;">
<view class="line-word title-font">服务地址</view>
<view class="line-word-r value-font" style="width: 73%; text-align: right; ">
<span>
{{province}}/{{city}}/{{district}}/{{detailaddress}}
</span>
</view>
</view>
<view class="jusitify-line" v-if="order.remark">
<view class="line-word title-font">备注内容</view>
<view class="flex">
<view class="value-font">
{{order.remark}}
</view>
</view>
</view>
</view>
</view>
<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>
<span >技师</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="jusitify-line" v-if="jishiName">
<view class="line-word title-font" >
<span >项目原价</span>
</view>
<view >
<span class="line-word-r value-font">￥{{orderXm.price}}</span>
</view>
</view>
<view class="jusitify-line" v-if="jishiName">
<view class="line-word title-font" >
<span>{{jishiName.technicianTypeName}}</span>
<span >价格</span>
</view>
<view >
<span class="line-word-r value-font" style="color: #019c88">￥{{technicianRate}}</span>
</view>
</view>
<view class="jusitify-line" @click="youhuijuan">
<view class="line-word title-font">优惠券</view>
<view class="header-bottom-money-zhen">
<view v-if="couponDataList" class="" style="margin-right: 5px;">
<span>-￥{{couponDataList}}</span>
</view>
<span v-else>选择优惠券</span>
<span class="view-more"></span>
</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="flex align-center justify-between value-font" style="margin-top: 15rpx;">
<view class="flex justify-between margin-tb-sm" @click="openData()">
<view v-if="startTime">{{startTime}}</view>
<view class="line-word-r value-font" v-else>选择预约时间<span class="view-more"></span></view>
<!---<u-icon name="arrow-right" color="#999999"></u-icon>-->
</view>
</view>
</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="push-button">
<view class="pay_btn" @click="openpay()">去支付</view>
</view>
</view>
<!-- <u-skeleton :loading="loading" :animation="true" bgColor="#FFF"></u-skeleton> -->
<u-popup v-model="showorder" mode="bottom" :closeable="closeable">
@ -1387,7 +1381,7 @@
font-weight: bold;
font-size: 32rpx;
color: #333333;
margin-bottom: 8px;
margin-bottom: 12px;
}
.view-more{
display:inline-block;
@ -1585,15 +1579,15 @@
}
.xuanzhe{
background: linear-gradient(90deg, #029d88, #2fc094);
color: #ffffff;
margin-left: 5px;
border-radius: 15px;
height: 25px;
line-height: 25px;
width: 50px;
text-align: center;
font-size: 14px;
padding:6rpx 16rpx
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;
@ -1617,9 +1611,14 @@
}
.header-view{
background-color: #fff;
margin-bottom: 12px;
border-radius: 11px;
}
.header-padd{
padding: 36rpx;
}
.header-margin{
margin: 26rpx;
}
.head-foot span:nth-child(1){
margin-right: 5px;
}
@ -1690,12 +1689,12 @@
background-color: #ffffff;
border-radius: 24rpx;
padding: 29rpx;
margin-top: 10px;
}
.d-title{
font-weight: 400;
font-size: 29rpx;
color: #222;
padding: 16px 15px 0px 15px;
width: 100%;
}
.checkbox-data{
@ -1716,7 +1715,6 @@
}
.list-pay{
width: 100%;
padding: 0px 29rpx;
}
.pay-ding-top{
width: 100%;
@ -2012,7 +2010,7 @@
flex-direction: column;
align-items: center;
margin: 0 auto;
}
}
.pay_btn{
display: inline-block;
width: 92%;
@ -2047,6 +2045,13 @@
font-size: 32rpx;
color: #333333;
}
.head-title-right{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
font-weight: bold;
}
.title-font{
font-size: 30rpx;
color: #666666;

142
my/order/payModifyTcMy.vue
View File

@ -9,19 +9,25 @@
<image :src="orderXm.massageImg"
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 u-skeleton-fillet head-title">
{{orderXm.title}}
</view>
</view>
</view>
<view class="flex align-center">
<view style="width: 100%;">
<view class="flex justify-between margin-tb-sm">
<view style="justify-content: space-between;">
<text class="title-font">服务时长：</text><text class="value-font">{{orderXm.duration}}分钟</text>
</view>
</view>
<view class="money-pay">
<view class="money-pay-zhen">
<text class="title-font">项目价格：</text>
<span>￥</span>
<span>{{orderXm.packagePrice}}/次</span>
<span>{{orderXm.packagePrice}}</span>
</view>
<view>
<uni-number-box :disabled="true" :width='27' :min="1" :value='1' @change="changeValue" />
@ -37,57 +43,56 @@
<view class="header-padd header-view header-margin">
<view v-if="!detailaddress">请选择地址</view>
<view class="margin-right-xs">
<view class="flex justify-between heaer-height">
<view class="header-view-text">联系人</view>
<view class="header-view-data">
<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>
<text class="xuanzhe" @click="getAddressList()">更换</text>
</view>
</view>
<view class="flex justify-between heaer-height">
<view class="header-view-text">手机号码</view>
<view class="header-view-data">
<view class="jusitify-line">
<view class="line-word title-font">联系方式</view>
<view class="line-word-r value-font">
{{mobile}}
</view>
</view>
<view class="flex justify-between heaer-height">
<view class="header-view-text">详细地址</view>
<view class="flex adders-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: 73%; text-align: right; ">
<span>
{{province}}/{{city}}/{{district}}/{{detailaddress}}
</span>
<span class="view-more"></span>
</view>
</view>
</view>
</view>
<view class="header-view header-padd header-margin ">
<view class="fuwu-time heaer-height" @click="liliaoshi">
<view class="fuwu-title" >
<view class="jusitify-line" @click="liliaoshi">
<view class="line-word title-font" >
<span>技师</span>
<!-- <span v-if="jishiName">{{jishiName.technicianTypeName}}</span> -->
</view>
<view class="liliao-bottom" >
<span v-if="jishiName.artificerId">{{jishiName.artificerName}}</span>
<span v-else>请选择技师</span>
<view >
<span class="line-word-r value-font" v-if="jishiName.artificerId">{{jishiName.artificerName}}</span>
<span class="line-word-r value-font" v-else>选择技师</span>
<span class="view-more"></span>
</view>
</view>
<view class="fuwu-time heaer-height">
<view class="fuwu-title">
<view class="jusitify-line">
<view class="line-word title-font">
服务时间
</view>
<view class="flex align-center justify-between" style="ppadding: 0rpx 10rpx;">
<view class="flex align-center justify-between value-font" style="margin-top: 15rpx;">
<view class="flex justify-between margin-tb-sm" @click="openData()">
<view v-if="startTime">{{startTime}}</view>
<view class="tetx-sm" v-else>请选择预约时间<span class="view-more"></span></view>
<view class="line-word-r value-font" v-else>请选择预约时间<span class="view-more"></span></view>
</view>
</view>
</view>
</view>
<view class="header-view header-padd header-margin">
<view class="d-title">备注</view>
<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>
@ -95,8 +100,9 @@
</view>
</view>
<view class="pay_btn" style="margin-top: 30px;" @click="openpay()">去支付</view>
<view class="push-button">
<view class="pay_btn" @click="openpay()">去支付</view>
</view>
</view>
<!-- <u-skeleton :loading="loading" :animation="true" bgColor="#FFF"></u-skeleton> -->
<u-popup v-model="showorder" mode="bottom" :closeable="closeable">
@ -1392,12 +1398,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{
@ -1708,12 +1709,13 @@
background: linear-gradient(90deg, #029d88, #2fc094);
color: #ffffff;
margin-left: 5px;
border-radius: 30rpx;
height:50rpx;
line-height: 50rpx;
width: 100rpx;
text-align:center;
font-size: 26rpx;
border-radius: 15px;
height: 25px;
line-height: 25px;
width: 50px;
text-align: center;
font-size: 14px;
padding:6rpx 16rpx
}
.header-view-data{
display: flex;
@ -1959,10 +1961,10 @@
background-color: #f7f7f7;
}
.pay-title{
font-weight: bold;
font-size: 31rpx;
color: #333333;
margin-bottom: 8px;
font-weight: bold;
font-size: 32rpx;
color: #333333;
margin-bottom: 12px;
}
page {
background: #f7f7f7;
@ -2125,16 +2127,27 @@
}
.pay_btn {
width: 90%;
.push-button{
width: 100%;
height: 48px;
position: fixed;
bottom: 0px;
display: flex;
flex-direction: column;
align-items: center;
margin: 0 auto;
}
.pay_btn {
display: inline-block;
width: 92%;
text-align: center;
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
height:80rpx;
border-radius: 80rpx;
height: 40px;
border-radius: 28px;
color: #ffffff;
line-height: 80rpx;
font-size: 32rpx;
line-height: 40px;
margin-top: 4px;
font-size: 34rpx;
}
.serverAddress {
display: flex;
@ -2151,4 +2164,35 @@
height: 80rpx;
align-items: center;
}
.head-title{
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.head-title-right{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
font-weight: bold;
}
.title-font{
font-size: 30rpx;
color: #666666;
}
.value-font{
font-size: 30rpx;
color: #333333;
}
.jusitify-line{
height: 78rpx;
padding: 20rpx 0;
display: flex;
justify-content: space-between;
}
.jusitify-line-end{
height:1px;
border-bottom: 1px #e5e5e5 solid;
margin: 30rpx 0;
}
</style>

2
my/order/payShengji.vue
View File

@ -2478,7 +2478,7 @@
padding: 29rpx;
}
.content{
padding-top: 20px;
padding-top: 11px;
width: 100%;
background-color: #f7f7f7;
}