工单报备，工单详情
This commit is contained in:
@ -1,80 +1,107 @@
|
||||
<template>
|
||||
<div class="wrap">
|
||||
<div class="baseInfo common">
|
||||
<div class="title">基本信息:</div>
|
||||
<div class="line"></div>
|
||||
<div class="infoWrap fontColor">
|
||||
<div class="leftTitle">
|
||||
<div class="leftItem">工单编号:</div>
|
||||
<div class="leftItem">合同:</div>
|
||||
<div class="leftItem">结算方式:</div>
|
||||
<div class="leftItem">客户姓名:</div>
|
||||
<div class="leftItem">客户电话:</div>
|
||||
<div class="leftItem">车牌号:</div>
|
||||
<div class="leftItem">车型品牌:</div>
|
||||
</div>
|
||||
<div class="rightContent">
|
||||
<div class="rightItem" style="display: flex;align-items: center;">
|
||||
<span id="copyText">ZD23097890987</span>
|
||||
<img @click="copyText" src="@/assets/copy.png" style="width: 35px;height: 15px;margin-left: 10px"/>
|
||||
<div class="wrap">
|
||||
<div class="baseInfo common">
|
||||
<div class="title">基本信息:</div>
|
||||
<div class="line"></div>
|
||||
<div class="infoWrap fontColor">
|
||||
<div class="leftTitle">
|
||||
<div class="leftItem">工单编号:</div>
|
||||
<div class="leftItem">合同:</div>
|
||||
<div class="leftItem">结算方式:</div>
|
||||
<div class="leftItem">客户姓名:</div>
|
||||
<div class="leftItem">客户电话:</div>
|
||||
<div class="leftItem">车牌号:</div>
|
||||
<div class="leftItem">车型品牌:</div>
|
||||
</div>
|
||||
<div class="rightContent">
|
||||
<div class="rightItem" style="display: flex;align-items: center;">
|
||||
<span id="copyText">{{orderCode}}</span>
|
||||
<img @click="copyText" src="@/assets/copy.png" style="width: 35px;height: 15px;margin-left: 10px"/>
|
||||
</div>
|
||||
<div class="rightItem">{{ orderDetailInfo.contractName }}</div>
|
||||
<div class="rightItem">{{ orderDetailInfo.contractSettleType.label }}</div>
|
||||
<div class="rightItem">{{ orderDetailInfo.userName }}</div>
|
||||
<div class="rightItem">{{ orderDetailInfo.userPhone }}</div>
|
||||
<div class="rightItem">{{ orderDetailInfo.plateNumber }}</div>
|
||||
<div class="rightItem">{{orderDetailInfo.model}} {{ orderDetailInfo.brand }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="serviceInfo common">
|
||||
<div class="title">服务信息:</div>
|
||||
<div class="line"></div>
|
||||
<div class="infoContent">
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">服务类型:</span><span class="rightContent">{{ orderDetailInfo.taskServiceName }}</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">车辆位于:</span><span class="rightContent">{{ orderDetailInfo.positionEnvironment.label }}</span>
|
||||
</div>
|
||||
<div class="item" style="align-items: baseline">
|
||||
<span class="leftTitle fontColor">事发地:</span><span class="rightContent" style="flex: 1">{{ orderDetailInfo.vehiclePointAddress }}</span>
|
||||
</div>
|
||||
<div class="item" style="align-items: baseline">
|
||||
<span class="leftTitle fontColor">事发地补充:</span><span class="rightContent vehicleRemark" >{{orderDetailInfo.vehiclePointRemark}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="item" style="align-items: baseline">
|
||||
<span class="leftTitle fontColor">目的地:</span><span class="rightContent" style="flex: 1">{{ orderDetailInfo.destinationAddress }}</span>
|
||||
</div>
|
||||
<div class="item" style="align-items: baseline">
|
||||
<span class="leftTitle fontColor">目的地补充:</span><span class="rightContent vehicleRemark">{{orderDetailInfo.destinationRemark}}</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">工单状态:</span><span class="rightContent orderStatus">{{ orderDetailInfo.taskOrderStatusString }}</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">服务车辆:</span><span class="rightContent">{{ orderDetailInfo.taskVehicleName }}</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">服务师傅:</span><span class="rightContent">{{ orderDetailInfo.driverName }} {{orderDetailInfo.drivePhone ? '/' : ''}} {{orderDetailInfo.drivePhone }}</span>
|
||||
</div>
|
||||
<div class="rightItem">平安产险</div>
|
||||
<div class="rightItem">合同月结</div>
|
||||
<div class="rightItem">万女士</div>
|
||||
<div class="rightItem">15234447878</div>
|
||||
<div class="rightItem">沪A123456</div>
|
||||
<div class="rightItem">奥迪 A6L</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="serviceInfo common">
|
||||
<div class="title">服务信息:</div>
|
||||
<div class="line"></div>
|
||||
<div class="infoContent">
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">服务类型:</span><span class="rightContent">故障——拖车</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">车辆位于:</span><span class="rightContent">地面</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">事发地:</span><span class="rightContent">上海市高科西路650号</span>
|
||||
</div>
|
||||
<div class="item" style="align-items: baseline">
|
||||
<span class="leftTitle fontColor">事发地补充:</span><span class="rightContent vehicleRemark" style="flex: 1">50公里免拖，超出部分费用按照市场价格由客户现场支付，原始手机号：15088752478,客户承担背车段路桥费。目的地不明确请师傅到现场核实清楚并回电反馈</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">目的地:</span><span class="rightContent">浙江省杭州市富阳区比亚迪海洋4s店</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">目的地补充:</span><span class="rightContent vehicleRemark">无</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">工单状态:</span><span class="rightContent orderStatus">师傅接单，待发车</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">服务车辆:</span><span class="rightContent">沪A123456</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="leftTitle fontColor">服务师傅:</span><span class="rightContent">周师傅/15234345656</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {myMixins} from '@/utils/myMixins'
|
||||
import {getOrderDetail} from "@/api/order"
|
||||
export default {
|
||||
name: "workOrderDetail",
|
||||
mixins:[myMixins],
|
||||
data(){
|
||||
return{
|
||||
|
||||
userOrderId:'',
|
||||
queryType:'',
|
||||
orderCode:'',
|
||||
taskOrderId:'',
|
||||
orderDetailInfo:{}
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
// 获取当前 URL
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
// 获取指定参数的值
|
||||
this.queryType=urlParams.get('queryType');
|
||||
this.userOrderId = urlParams.get('userOrderId');
|
||||
this.orderCode=urlParams.get('orderCode');
|
||||
this.taskOrderId=urlParams.get('taskOrderId') ? urlParams.get('taskOrderId') : '';
|
||||
// console.log(this.queryType)
|
||||
await this.getDetail();
|
||||
},
|
||||
methods:{
|
||||
|
||||
async getDetail(){
|
||||
let result=await getOrderDetail({
|
||||
queryType:this.queryType,
|
||||
userOrderId:this.userOrderId,
|
||||
orderCode:this.orderCode,
|
||||
taskOrderId:this.taskOrderId ? this.taskOrderId : ''
|
||||
})
|
||||
if(result.code === 200){
|
||||
this.orderDetailInfo=result.data;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -118,6 +145,7 @@ export default {
|
||||
.item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 27px;
|
||||
}
|
||||
.infoContent{
|
||||
.leftTitle{
|
||||
@ -135,6 +163,7 @@ export default {
|
||||
opacity: 0.55;
|
||||
color: #121212;
|
||||
line-height: 14px;
|
||||
flex: 1;
|
||||
}
|
||||
.orderStatus{
|
||||
color: #E69B0B;
|
||||
@ -142,7 +171,7 @@ export default {
|
||||
}
|
||||
}
|
||||
.title{
|
||||
@include fontWeightSize(500,14px);
|
||||
@include fontWeightSize(500,14px);
|
||||
color: #323643;
|
||||
line-height: 20px;
|
||||
opacity: .6;
|
||||
|
||||
Reference in New Issue
Block a user