This commit is contained in:
kbing1981 2024-08-01 11:48:00 +08:00
parent 6dd041e762
commit a764d8d74a
3 changed files with 141 additions and 101 deletions

View File

@ -1,13 +1,33 @@
<template>
<view class="content">
<view class="padding-bottom u-skeleton">
<view class="bgImg u-skeleton-fillet" style="padding: 0 29rpx;">
<view class="header-view header-padd header-margin flex justify-between">
<view>
<view class="Service-add">服务地址</view>
<view class="Service-Address">{{province}}/{{city}}/{{district}}/{{detailaddress}}</view>
<view v-if="!detailaddress">请选择地址</view>
<view class="Service-name" >
<span>{{name}}</span>
<span>{{mobile}}</span>
</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 class="Service-more" @click="getAddressList()"></view>
</view>
<view class="bgImg u-skeleton-fillet">
<view class="head-top">
<view class="pay-title">服务项目</view>
<view class="flex">
<view class="" style="width: 160upx;height: 160upx;">
<image :src="orderXm.massageImg"
style="width: 100%;height: 100%;border-radius: 19upx;"></image>
<view>
<image :src="orderXm.massageImg" class="detail-view-img"></image>
</view>
<view class="u-flex-1 margin-left-sm">
<view class="flex head-title-right">
@ -17,12 +37,12 @@
</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 class="flex justify-between">
<view style="justify-content: space-between; padding-top:6rpx;">
<text class="title-font-time">服务时长</text><text class="title-font-time">{{orderXm.duration}}分钟</text>
</view>
</view>
<view class="money-pay">
<view class="money-pay margin-tb-sm">
<view class="money-pay-zhen">
<text class="title-font">项目价格</text>
<span></span>
@ -44,40 +64,7 @@
</view>
</view>
</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: 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" >
@ -113,7 +100,7 @@
<view v-if="couponDataList" class="" style="margin-right: 5px;">
<span>-{{couponDataList}}</span>
</view>
<span v-else>选择优惠券</span>
<view v-else class="server-yuhui">选择优惠券</view>
<span class="view-more"></span>
</view>
</view>
@ -124,7 +111,7 @@
<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 class="flex justify-between" @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>-->
@ -1327,9 +1314,9 @@
.jusitify-line{
height: 78rpx;
padding: 20rpx 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.jusitify-line-end{
height:1px;
@ -1373,15 +1360,18 @@
justify-content: space-between;
}
.head-top{
width: 95%;
margin: 0 auto;
background-color: #ffffff;
border-radius: 24rpx;
padding: 29rpx;
margin-top: 10px;
}
.pay-title{
font-weight: bold;
font-size: 32rpx;
color: #333333;
margin-bottom: 12px;
margin-bottom: 10px;
}
.view-more{
display:inline-block;
@ -1402,7 +1392,7 @@
}
.header-bottom-money-zhen span{
color: #FF6000 !important;
font-size: 30rpx !important;
font-size:28rpx !important;
}
.header-bottom-money-zhen{
display: flex;
@ -1581,7 +1571,7 @@
background: linear-gradient(90deg, #029d88, #2fc094);
color: #ffffff;
margin-left: 5px;
border-radius: 15px;
border-radius:3px;
height: 25px;
line-height: 25px;
width: 50px;
@ -1614,10 +1604,10 @@
border-radius: 11px;
}
.header-padd{
padding: 36rpx;
padding:30rpx;
}
.header-margin{
margin: 26rpx;
margin:20rpx;
}
.head-foot span:nth-child(1){
margin-right: 5px;
@ -1684,13 +1674,6 @@
align-items: center;
justify-content: space-between;
}
.head-top{
width: 100%;
background-color: #ffffff;
border-radius: 24rpx;
padding: 29rpx;
margin-top: 10px;
}
.d-title{
font-weight: bold;
font-size: 32rpx;
@ -2026,7 +2009,7 @@
}
.head-title{
font-weight: bold;
font-size: 32rpx;
font-size:30rpx;
color: #333333;
}
.head-title-right{
@ -2037,11 +2020,69 @@
font-weight: bold;
}
.title-font{
font-size: 30rpx;
color: #666666;
}
.value-font{
font-size: 30rpx;
font-size:28rpx;
color: #333333;
}
.value-font{
font-size: 28rpx;
color: #333333;
}
.title-font-time{
font-size: 28rpx;
color: #019c88;
}
.detail-view-img{
width: 76px;
height: 76px;
border-radius: 9px;
}
.Service-Address{
font-size:34rpx;
font-weight: bold;
padding: 6rpx 0;
flex-direction: column;
}
.Service-name{
font-size: 26rpx;
color: #666;
display: flex;
align-items: flex-end;
padding:4rpx 0;
}
.Service-name span:nth-child(1){
font-size:28rpx;
color:#333;
margin-right: 15rpx;
}
.Service-name span:nth-child(2){
font-size:28rpx;
color:#666;
}
.Service-add{
width:130rpx;
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
font-size:24rpx;
color: #fff;
border-radius:5rpx;
text-align: center;
height:32rpx;
line-height:32rpx;
}
.Service-more{
display:inline-block;
border-top:1px solid;
border-right:1px solid;
width:18rpx;
height: 18rpx;
border-color:#333;
transform:rotate(45deg);
margin-top:50rpx;
}
.server-yuhui{
background: linear-gradient(90deg, #fc5f28, #fe3d24);
border-radius:6rpx;
color: #fff;
font-size: 24rpx;
padding: 3rpx;
}
</style>

View File

@ -547,7 +547,7 @@
margin-left: 5px;
}
.header-bottom-money-zhen span{
color: #FF1200;
color: #FF6000;
}
.header-bottom-money-zhen span:nth-child(1){
font-size: 28rpx;

View File

@ -270,36 +270,35 @@
font-size: 28rpx;
color: #FFFFFF;
}
.item-view-bottom-qian span:nth-child(5){
font-size: 28rpx;
color: #848484;
text-decoration-line: line-through;
}
.item-view-bottom-qian span:nth-child(4){
font-size: 26rpx;
color: #848484;
text-decoration-line: line-through;
margin-left: 5px;
}
.item-view-bottom-qian span:nth-child(3){
font-size: 28rpx;
color: #848484;
text-decoration-line: line-through;
margin-left: 5px;
.item-view-bottom-qian span:nth-child(5){
font-size: 28rpx;
color: #848484;
text-decoration-line: line-through;
}
.item-view-bottom-qian span:nth-child(2){
font-weight: bold;
font-size: 36.81rpx;
color: #FF1200;
}
.item-view-bottom-qian span:nth-child(1){
font-weight: 400;
font-size: 26rpx;
color: #FF1200;
}
.item-view-bottom-qian{
margin-top:2px;
.item-view-bottom-qian span:nth-child(4){
font-size: 26rpx;
color: #848484;
text-decoration-line: line-through;
margin-left: 5px;
}
.item-view-bottom-qian span:nth-child(3){
font-size: 26rpx;
color: #848484;
text-decoration-line: line-through;
}
.item-view-bottom-qian span:nth-child(2){
font-weight: bold;
font-size: 36.81rpx;
color: #FF6000;
}
.item-view-bottom-qian span:nth-child(1){
font-weight: 400;
font-size: 26rpx;
color: #FF6000;
}
.item-view-bottom-qian{
margin-top: 2px;
}
.item-view-bottom{
width: 100%;
display: flex;
@ -308,15 +307,15 @@
align-items: center;
}
.item-view-jianjie{
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin:5px 0px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2; /* 显示的行数,可以根据需要修改 */
overflow: hidden;
text-overflow: ellipsis;
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin:5px 0px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2; /* 显示的行数,可以根据需要修改 */
overflow: hidden;
text-overflow: ellipsis;
}
.item-view-biao{
border-radius: 15rpx 3rpx 15rpx 3rpx;