<template>
|
<view class="list">
|
<view class="list-item">
|
<view class="list-header">
|
<text>服务单信息</text>
|
</view>
|
<view class="list-content">
|
<view class="flex justify-between">
|
<text>会员姓名</text>
|
<text class="gray">{{orderInfo.vipName}}</text>
|
</view>
|
<view class="flex justify-between">
|
<text>联系方式</text>
|
<text class="gray">{{orderInfo.phone}}</text>
|
</view>
|
<view class="flex justify-between">
|
<text>服务单号</text>
|
<text class="gray">{{orderInfo.serviceNo}}</text>
|
</view>
|
<view class="flex justify-between">
|
<text>预约时间</text>
|
<text class="gray">{{orderInfo.yyTime}}</text>
|
</view>
|
<view class="flex justify-between">
|
<text>预约床位</text>
|
<text class="gray">{{orderInfo.bedName || '-'}}</text>
|
</view>
|
<view class="flex justify-between">
|
<text>服务总时间</text>
|
<text class="gray">{{orderInfo.totalTime}}分钟</text>
|
</view>
|
<view class="flex justify-between">
|
<text>配料师</text>
|
<text class="gray">{{orderInfo.plsName || '-'}}</text>
|
</view>
|
<view class="flex justify-between">
|
<text>下单总顾问</text>
|
<text class="gray">{{orderInfo.staffName}}</text>
|
</view>
|
</view>
|
</view>
|
<view class="list-item">
|
<view class="list-header">
|
<text>服务明细</text>
|
</view>
|
<view class="list-content">
|
<view class="list-content-row" v-for="item in orderList">
|
<view class="flex justify-between align-center font-15">
|
<view class="list-content-name">
|
<text class="mr-20 font-14">{{item.name}}</text>
|
<text>x{{item.count}}</text>
|
</view>
|
<text class="blue font-16">￥{{item.price}}</text>
|
</view>
|
<view class="flex justify-between mt-5 gray">
|
<text>服务开始时间</text>
|
<text>{{item.beginTime || '-'}}</text>
|
</view>
|
<view class="flex justify-between gray">
|
<text>服务结束时间</text>
|
<text>{{item.endTime || '-'}}</text>
|
</view>
|
<view class="flex justify-between gray">
|
<text>服务时长</text>
|
<text>{{item.timeLength}}分钟</text>
|
</view>
|
<view class="flex justify-between gray">
|
<text>美疗师</text>
|
<text>{{item.beautyName || '-'}}</text>
|
</view>
|
<view class="flex justify-between gray">
|
<text>提成</text>
|
<text>￥{{item.commission || 0}}</text>
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="list-item">
|
<view class="list-header">
|
<text>客户评价</text>
|
</view>
|
<view class="list-content gray">
|
{{orderInfo.comment}}
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
orderInfo: {},
|
orderList: []
|
}
|
},
|
onLoad(options) {
|
this.loadServiceOrderDetail(options.id);
|
},
|
methods:{
|
loadServiceOrderDetail(id){
|
console.log(id)
|
this.$httpUtils.request('/api/serviceOrder/findServiceOrderDetail/'+id).then((res) => {
|
if(res.status == 200){
|
console.log(res)
|
let result = res.mapInfo.detail;
|
this.orderInfo = result;
|
this.orderList = result.items;
|
}
|
})
|
}
|
}
|
}
|
</script>
|
|
<style>
|
page{
|
background: #F6F6F8;
|
}
|
.list-item{
|
background: #FFFFFF;
|
border-radius: 4px;
|
margin: 10px;
|
}
|
.list-header{
|
padding: 12px 15px;
|
font-size: 16px;
|
font-weight: bold;
|
border-bottom: 1px solid #EDEAF4;
|
}
|
.list-content{
|
padding: 12px 15px;
|
font-size: 14px;
|
line-height: 28px;
|
}
|
.list-content-row{
|
border-bottom: 1px solid #EDEAF4;
|
padding: 8px 0;
|
}
|
.list-content-row:nth-child(1){
|
padding-top: 0;
|
}
|
.list-content-row:nth-last-child(1){
|
border-bottom: 0;
|
padding-bottom: 0;
|
}
|
.list-content-name{
|
max-width: 550rpx;
|
}
|
.font-through{
|
text-decoration: line-through;
|
}
|
</style>
|
