| <template>  | 
|     <view class="main_app">  | 
|         <view class="main_content">  | 
|             <view class="title" @click="showPlatformgroup = true">{{ activePlatformGroup.name  | 
|         }}<u-icon name="arrow-down" size="20" class="ml12" color="#999999"></u-icon></view>  | 
|             <view class="platform_list">  | 
|                 <view class="item" :class="{ active: item.id === activePlatform.id }"  | 
|                     v-for="(item, index) in activePlatformGroup.platformList" :key="index" @click="platformClick(item)">  | 
|                     {{ item.name }}  | 
|                 </view>  | 
|             </view>  | 
|             <view class="status_wrap">  | 
|                 <view class="status">作业:<text>{{ platformTaskInfo.workNum }}</text></view>  | 
|                 <view class="status">已叫:<text>{{ platformTaskInfo.callNum }}</text></view>  | 
|                 <view class="status">等待:<text>{{ platformTaskInfo.waitNum }}</text></view>  | 
|                 <view class="status">异常:<text>{{ platformTaskInfo.exceptionNum }}</text></view>  | 
|             </view>  | 
|         </view>  | 
|         <!--  -->  | 
|         <view style="padding-bottom: 140rpx">  | 
|             <view v-for="item in platformTaskInfo.platformJobList" :key="item.id" class="platform_ing">  | 
|                 <view class="head">  | 
|                     <view class="code">  | 
|                         <text>{{ item.carCodeFront.slice(0, 1) }}</text>  | 
|                         <text>{{ item.carCodeFront.slice(1, 2) }}</text>  | 
|                         <text>·</text>  | 
|                         <text>{{ item.carCodeFront.slice(2) }}</text>  | 
|                     </view>  | 
|                     <view class="status" v-if="item.status != 4 && item.status != 5" :class="{ red: item.status == 8 }">  | 
|                         {{ statusMap[item.status] }}  | 
|                     </view>  | 
|                     <view class="status" v-if="item.status == 4">叫号中 {{ item.callDateTemp }}</view>  | 
|                     <view class="status scs" v-if="item.status == 5">已作业 {{ item.startDateTemp }}</view>  | 
|                 </view>  | 
|                 <view class="line" v-if="item.code">  | 
|                     <text class="label">运输单号</text>  | 
|                     <text class="value">{{ item.code }}</text>  | 
|                     <text class="primaryColor" @click="handleDetail(item)">运单详情</text>  | 
|                 </view>  | 
|                 <view class="line" v-else>  | 
|                     <text class="label">合同单号</text>  | 
|                     <text class="value">{{ item.contractNum }}</text>  | 
|                 </view>  | 
|                 <view class="line">  | 
|                     <text class="label">驾驶员</text>  | 
|                     <text class="value">{{ item.driverName }} {{ item.drivierPhone }}</text>  | 
|                 </view>  | 
|                 <view class="line">  | 
|                     <text class="label">总运输量</text>  | 
|                     <text class="value">{{ item.totalNum }}万支</text>  | 
|                 </view>  | 
|                 <view class="line" v-if="item.type != 4">  | 
|                     <text class="label">运输公司</text>  | 
|                     <text class="value">{{ item.carrierName }}</text>  | 
|                 </view>  | 
|                 <view class="btns">  | 
|                     <view v-if="item.status == 4" class="btn" @click="handlePass(item)">过号</view>  | 
|                     <view v-if="item.status == 4" class="btn active" @click="handleWork(item)">开始作业</view>  | 
|   | 
|                     <view v-if="item.status == 5" class="btn" @click="handleErr(item)">异常挂起</view>  | 
|                     <view v-if="item.status == 5 || item.status == 8" class="btn" @click="handleTransform(item)">转移月台</view>  | 
|                     <view v-if="item.status == 5 || item.status == 8" class="btn active" @click="handleFinish(item)">作业完成</view>  | 
|                 </view>  | 
|             </view>  | 
|             <view v-if="!platformTaskInfo.platformJobList || platformTaskInfo.platformJobList.length == 0" class="empty_wrap">  | 
|                 <image src="@/static/default_nodata@2x.png" />  | 
|                 <text>暂无作业车辆</text>  | 
|             </view>  | 
|         </view>  | 
|         <!--  -->  | 
|         <view class="main_footer">  | 
|             <view class="btn" @click="PlatformCallClick(1)">入园叫号</view>  | 
|             <view class="btn active" @click="PlatformCallClick(2)">月台叫号</view>  | 
|         </view>  | 
|         <!-- 叫号 -->  | 
|         <u-popup :show="showPlatformCall" closeable safeAreaInsetTop round="10" @close="showPlatformCall = false">  | 
|             <view class="PlatformCallModal" :style="{ height: 'calc(100vh - ' + windowTop + 'px)' }">  | 
|                 <view class="title" v-if="callType == 2">月台叫号({{ activePlatform.name }})</view>  | 
|                 <view class="title" v-else>入园叫号</view>  | 
|                 <view class="input_wrap">  | 
|                     <u-icon name="search" class="mr12" size="19" color="#999999" />  | 
|                     <input v-model="platformCallSearch" type="text" placeholder="搜索车辆牌照" placeholder-class="placeholder9"  | 
|                         @confirm="callQuery" />  | 
|                 </view>  | 
|                 <view class="order_list">  | 
|                     <scroll-view scroll-y="true" @scrolltolower="callScrolltolower" class="scroll_view">  | 
|                         <view class="platform_ing" v-for="item in platformCallList" :key="item.id">  | 
|                             <view class="head">  | 
|                                 <view v-if="item.carCodeFront" class="code">  | 
|                                     <text>{{ item.carCodeFront.slice(0, 1) }}</text>  | 
|                                     <text>{{ item.carCodeFront.slice(1, 2) }}</text>  | 
|                                     <text>·</text>  | 
|                                     <text>{{ item.carCodeFront.slice(2) }}</text>  | 
|                                 </view>  | 
|                                 <view class="status" :class="{ scs: item.status == 4 }">{{  | 
|                   statusMap[item.status]  | 
|                 }}</view>  | 
|                             </view>  | 
|                             <view class="line" v-if="item.billCode">  | 
|                                 <text class="label">运输单号</text>  | 
|                                 <text class="value">{{ item.billCode }}</text>  | 
|                                 <text class="primaryColor" @click="handleDetail(item)">运单详情</text>  | 
|                             </view>  | 
|                             <view class="line" v-else>  | 
|                                 <text class="label">合同单号</text>  | 
|                                 <text class="value">{{ item.contractNum }}</text>  | 
|                             </view>  | 
|                             <view class="line">  | 
|                                 <text class="label">驾驶员</text>  | 
|                                 <text class="value">{{ item.driverName }} {{ item.drivierPhone }}</text>  | 
|                             </view>  | 
|                             <view class="line">  | 
|                                 <text class="label">总运输量</text>  | 
|                                 <text class="value">{{ item.totalNum }}万支</text>  | 
|                             </view>  | 
|                             <view class="line" v-if="item.type != 4">  | 
|                                 <text class="label">运输公司</text>  | 
|                                 <text class="value">{{ item.carrierName }}</text>  | 
|                             </view>  | 
|                             <view class="btns">  | 
|                                 <view class="btn active" @click="handleCall(item)">叫号</view>  | 
|                             </view>  | 
|                         </view>  | 
|                     </scroll-view>  | 
|                 </view>  | 
|             </view>  | 
|         </u-popup>  | 
|         <!-- 运单详情 -->  | 
|         <u-popup :show="showDetail" :round="10" :safeAreaInsetBottom="true" closeOnClickOverlay :closeable="true"  | 
|             mode="bottom" @close="showDetail = false">  | 
|             <view class="detail_modal">  | 
|                 <view class="modal_title">运单详情</view>  | 
|                 <view v-if="wmsInfo.plateNumber" class="id_card">  | 
|                     <text>{{ wmsInfo.plateNumber.slice(0, 1) }}</text>  | 
|                     <text>{{ wmsInfo.plateNumber.slice(1, 2) }}</text>  | 
|                     <text>·</text>  | 
|                     <text>{{ wmsInfo.plateNumber.slice(2) }}</text>  | 
|                 </view>  | 
|                 <!--  -->  | 
|                 <view class="info">  | 
|                     <view class="line">  | 
|                         <view class="label">运输单号</view>  | 
|                         <view class="value">{{ wmsInfo.carryBillCode }}</view>  | 
|                     </view>  | 
|                     <view class="line">  | 
|                         <view class="label">驾驶员</view>  | 
|                         <view class="value">{{ wmsInfo.driverName }} {{ wmsInfo.driverPhone }}</view>  | 
|                     </view>  | 
|                     <view class="line">  | 
|                         <view class="label">总运输量</view>  | 
|                         <view class="value">{{ wmsInfo.ioQty }}万支</view>  | 
|                     </view>  | 
|                     <view class="line">  | 
|                         <view class="label">运输公司</view>  | 
|                         <view class="value">{{ wmsInfo.carrierName }}</view>  | 
|                     </view>  | 
|                 </view>  | 
|                 <view class="contract_wrap">  | 
|                     <view class="contract_list" v-for="item in wmsInfo.wmsJobContractVOList">  | 
|                         <view class="title">合同号:{{ item.contractCode }}</view>  | 
|                         <view class="address">收货地:{{ item.address }}</view>  | 
|                         <view class="list">  | 
|                             <view class="item" v-for="line in item.platformWmsDetailList">  | 
|                                 <view class="line">  | 
|                                     <view class="label">物料:</view>  | 
|                                     <view class="value">{{ line.materialName }}</view>  | 
|                                 </view>  | 
|                                 <view class="line">  | 
|                                     <view class="label">数量:</view>  | 
|                                     <view class="value">{{ line.ioQty }}万支</view>  | 
|                                 </view>  | 
|                             </view>  | 
|                         </view>  | 
|                     </view>  | 
|                 </view>  | 
|             </view>  | 
|         </u-popup>  | 
|         <!-- 转移月台 -->  | 
|         <u-popup :show="showTransform" closeable safeAreaInsetTop round="10" @close="showTransform = false">  | 
|             <view class="TransformModal">  | 
|                 <view class="title">转移月台</view>  | 
|                 <view class="transform_list">  | 
|                     <view class="line" @click="transformPlatClick(item)" v-for="item in activePlatformGroup.platformList"  | 
|                         :key="item.id">  | 
|                         <view class="name">{{ item.name }}</view>  | 
|                         <view class="status" :class="{ green: item.workStatus == 1 }">({{ item.workStatus == 0 ? "空闲" : "作业中" }})  | 
|                         </view>  | 
|                         <image v-if="transformPlatId == item.id" src="@/static/ic_select@2x.png" class="checked" />  | 
|                     </view>  | 
|                 </view>  | 
|                 <view class="btns">  | 
|                     <view class="btn" @click="transformCancel">取消</view>  | 
|                     <view class="btn active" @click="transformSub">确定</view>  | 
|                 </view>  | 
|             </view>  | 
|         </u-popup>  | 
|         <!--  -->  | 
|         <u-picker :show="showPlatformgroup" keyName="name" :columns="[platformGroupList]"  | 
|             @cancel="showPlatformgroup = false" @confirm="platConfirm"></u-picker>  | 
|     </view>  | 
| </template>  | 
|   | 
| <script>  | 
|     import {  | 
|         getPlatformGroupList,  | 
|         getPlatformWorkData,  | 
|         platformCallList,  | 
|         platformCallNumber,  | 
|         platformInPark,  | 
|         beginWork,  | 
|         finishWork,  | 
|         platformMove,  | 
|         platformErr,  | 
|         platformOverNumber,  | 
|         wmsJobDetail  | 
|     } from '@/api'  | 
|     import {  | 
|         statusMap  | 
|     } from '@/utils/config.js'  | 
|     import dayjs from 'dayjs'  | 
|     import duration from 'dayjs/plugin/duration'  | 
|     dayjs.extend(duration)  | 
|   | 
|     export default {  | 
|         data() {  | 
|             return {  | 
|                 statusMap,  | 
|                 windowTop: 24,  | 
|                 showPlatformCall: false, // 月台叫号  | 
|                 showDetail: false,  | 
|                 showTransform: false, // 转移  | 
|                 showPlatformgroup: false,  | 
|   | 
|                 platformGroupList: [],  | 
|                 activePlatformGroup: {},  | 
|                 platformTaskInfo: {},  | 
|                 activePlatform: {},  | 
|   | 
|                 platformCallList: [], //叫号列表  | 
|                 platformCallSearch: '',  | 
|                 platformCallTotal: 0,  | 
|                 platformCallPage: 1,  | 
|                 callType: 1,  | 
|   | 
|                 transformPlatId: '', // 转移记录月台id  | 
|                 transformId: '', // 转移记录任务id  | 
|                 wmsInfo: {}  | 
|             }  | 
|         },  | 
|         onLoad() {  | 
|             this.getPlatformGroup()  | 
|             setInterval(() => {  | 
|                 this.getPlatformGroup()  | 
|             }, 1000 * 30)  | 
|         },  | 
|         methods: {  | 
|             getPlatformGroup() {  | 
|                 getPlatformGroupList({  | 
|                     queryData: 1,  | 
|                     queryType: 0  | 
|                 }).then(res => {  | 
|                     this.platformGroupList = res.data || []  | 
|                     if (this.platformGroupList.length > 0) {  | 
|                         this.activePlatformGroup = this.platformGroupList[0]  | 
|                         if (this.activePlatformGroup.platformList && this.activePlatformGroup.platformList.length > 0) {  | 
|                             this.activePlatform = this.activePlatformGroup.platformList[0]  | 
|                             this.getPlatformTask()  | 
|                         }  | 
|                     }  | 
|                 })  | 
|             },  | 
|             getPlatformTask() {  | 
|                 getPlatformWorkData({  | 
|                     platformId: this.activePlatform.id  | 
|                 }).then(res => {  | 
|                     this.platformTaskInfo = res.data  | 
|                     this.circulInitTaskList()  | 
|                     setInterval(() => {  | 
|                         this.circulInitTaskList()  | 
|                     }, 1000)  | 
|                 })  | 
|             },  | 
|             circulInitTaskList() {  | 
|                 if (this.platformTaskInfo && this.platformTaskInfo.platformJobList && this.platformTaskInfo.platformJobList  | 
|                     .length > 0) {  | 
|                     let time = new Date()  | 
|                     this.platformTaskInfo.platformJobList.forEach(item => {  | 
|                         if (item.newCallDate) {  | 
|                             let timeNum = time.getTime() - new Date(item.newCallDate).getTime()  | 
|                             if (timeNum > 3600000) {  | 
|                                 item.callDateTemp = dayjs.duration(timeNum).format('H小时m分s秒')  | 
|                             } else {  | 
|                                 item.callDateTemp = dayjs.duration(timeNum).format('m分s秒')  | 
|                             }  | 
|                         }  | 
|                         if (item.newStartDate) {  | 
|                             let timeNum = time.getTime() - new Date(item.newStartDate).getTime()  | 
|                             if (timeNum > 3600000) {  | 
|                                 item.startDateTemp = dayjs.duration(timeNum).format('H小时m分ss秒')  | 
|                             } else {  | 
|                                 item.startDateTemp = dayjs.duration(timeNum).format('m分s秒')  | 
|                             }  | 
|                         }  | 
|                     })  | 
|                     this.$forceUpdate()  | 
|                 }  | 
|             },  | 
|             platConfirm(e) {  | 
|                 const index = e.indexs[0]  | 
|                 this.activePlatformGroup = this.platformGroupList[index]  | 
|                 if (this.activePlatformGroup.platformList && this.activePlatformGroup.platformList.length > 0) {  | 
|                     this.activePlatform = this.activePlatformGroup.platformList[0]  | 
|                     this.getPlatformTask()  | 
|                 }  | 
|                 this.showPlatformgroup = false  | 
|             },  | 
|             platformClick(item) {  | 
|                 this.activePlatform = item  | 
|                 this.getPlatformTask()  | 
|             },  | 
|             handleDetail(param) {  | 
|                 wmsJobDetail({  | 
|                     id: param.id  | 
|                 }).then(res => {  | 
|                     this.wmsInfo = res.data  | 
|                     this.showDetail = true  | 
|                 })  | 
|             },  | 
|             handleFinish(item) {  | 
|                 finishWork({  | 
|                     jobId: item.id  | 
|                 }).then(res => {  | 
|                     this.showToast('完成作业')  | 
|                     this.getPlatformTask()  | 
|                 })  | 
|             },  | 
|             handleWork(item) { // 开始作业  | 
|                 beginWork({  | 
|                     jobId: item.id  | 
|                 }).then(res => {  | 
|                     this.showToast('已开始作业')  | 
|                     this.getPlatformTask()  | 
|                 })  | 
|             },  | 
|             handlePass(item) {  | 
|                 uni.showModal({  | 
|                     content: `确认 ${item.carCodeFront}置为过号吗?过号后,需要重新签到才能进入园区`,  | 
|                     success: (res) => {  | 
|                         if (res.confirm) {  | 
|                             platformOverNumber({  | 
|                                 jobId: item.id,  | 
|                                 platformId: this.activePlatform.id  | 
|                             }).then(res => {  | 
|                                 this.showToast('过号成功')  | 
|                                 this.getPlatformTask()  | 
|                             })  | 
|                         }  | 
|                     }  | 
|                 })  | 
|   | 
|             },  | 
|             handleCall(item) {  | 
|                 const {  | 
|                     callType,  | 
|                     activePlatform  | 
|                 } = this  | 
|                 this.platformCallList = []  | 
|                 this.platformCallPage = 1  | 
|                 if (callType == 1) { // 入园叫号  | 
|                     platformInPark({  | 
|                         jobId: item.id,  | 
|                         platformId: activePlatform.id  | 
|                     }).then(res => {  | 
|                         this.showToast('叫号成功')  | 
|                         this.getPlatformCallList()  | 
|                     })  | 
|                 } else { // 月台叫号  | 
|                     platformCallNumber({  | 
|                         platformId: activePlatform.id,  | 
|                         jobId: item.id  | 
|                     }).then(res => {  | 
|                         this.showToast('叫号成功')  | 
|                         this.getPlatformCallList()  | 
|                         this.getPlatformTask()  | 
|                     })  | 
|                 }  | 
|             },  | 
|             PlatformCallClick(callType) {  | 
|                 this.callType = callType  | 
|                 this.showPlatformCall = true  | 
|                 this.platformCallList = []  | 
|                 this.platformCallPage = 1  | 
|                 this.platformCallSearch = ''  | 
|                 this.getPlatformCallList()  | 
|             },  | 
|             callQuery() {  | 
|                 this.platformCallList = []  | 
|                 this.platformCallPage = 1  | 
|                 this.getPlatformCallList()  | 
|             },  | 
|             callScrolltolower() {  | 
|                 const {  | 
|                     platformCallTotal,  | 
|                     platformCallList  | 
|                 } = this  | 
|                 if (platformCallTotal > platformCallList.length) {  | 
|                     this.getPlatformCallList()  | 
|                 }  | 
|             },  | 
|             getPlatformCallList() {  | 
|                 const {  | 
|                     platformCallPage,  | 
|                     callType,  | 
|                     activePlatform,  | 
|                     platformCallSearch  | 
|                 } = this  | 
|                 platformCallList({  | 
|                     model: {  | 
|                         callType,  | 
|                         platformId: activePlatform.id,  | 
|                         carCodeFront: platformCallSearch  | 
|                     },  | 
|                     capacity: 10,  | 
|                     page: platformCallPage  | 
|                 }).then(res => {  | 
|                     if (res.data && res.data.records) {  | 
|                         this.platformCallList = [...this.platformCallList, ...res.data.records]  | 
|                         this.platformCallTotal = res.data.total  | 
|                     }  | 
|                 })  | 
|             },  | 
|             transformPlatClick(item) {  | 
|                 this.transformPlatId = item.id  | 
|             },  | 
|             transformCancel() {  | 
|                 this.transformPlatId = ''  | 
|                 this.showTransform = false  | 
|             },  | 
|             transformSub() {  | 
|                 const {  | 
|                     transformPlatId,  | 
|                     transformId  | 
|                 } = this  | 
|                 platformMove({  | 
|                     platformId: transformPlatId,  | 
|                     jobId: transformId  | 
|                 }).then(res => {  | 
|                     this.showToast('转移月台成功')  | 
|                     this.transformCancel()  | 
|                     this.getPlatformTask()  | 
|                 })  | 
|             },  | 
|             handleTransform(item) {  | 
|                 let {  | 
|                     activePlatform  | 
|                 } = this  | 
|                 this.transformId = item.id  | 
|                 this.transformPlatId = activePlatform.id  | 
|                 this.showTransform = true  | 
|             },  | 
|             handleErr(item) {  | 
|                 uni.showModal({  | 
|                     content: '您确认要对该任务进行异常挂起吗',  | 
|                     success: (res) => {  | 
|                         if (res.confirm) {  | 
|                             platformErr({  | 
|                                 jobId: item.id  | 
|                             }).then(ress => {  | 
|                                 this.showToast('异常挂起成功')  | 
|                                 this.getPlatformTask()  | 
|                             })  | 
|                         }  | 
|                     }  | 
|                 })  | 
|             }  | 
|         }  | 
|     }  | 
| </script>  | 
| <style lang="scss">  | 
|     .main_app {  | 
|         padding: 0rpx;  | 
|         height: calc(100vh - 44px);  | 
|         font-size: 30rpx;  | 
|         color: #333333;  | 
|         background: url("@/static/bg_yuetai@2x.png") no-repeat;  | 
|         background-size: 100% 100%;  | 
|   | 
|         .main_content {  | 
|             background-color: #fff;  | 
|             padding: 30rpx;  | 
|   | 
|             .platform_list {  | 
|                 display: flex;  | 
|                 flex-wrap: wrap;  | 
|   | 
|                 .item {  | 
|                     width: 210rpx;  | 
|                     height: 80rpx;  | 
|                     display: flex;  | 
|                     justify-content: center;  | 
|                     align-items: center;  | 
|                     background: #ffffff;  | 
|                     border-radius: 8rpx;  | 
|                     border: 1rpx solid #999999;  | 
|                     font-size: 30rpx;  | 
|                     color: #222222;  | 
|                     margin-bottom: 20rpx;  | 
|                     margin-right: 30rpx;  | 
|   | 
|                     &:nth-of-type(3n) {  | 
|                         margin-right: 0;  | 
|                     }  | 
|                 }  | 
|   | 
|                 .active {  | 
|                     color: #fff;  | 
|                     background-color: $uni-color-primary;  | 
|                     border-color: $uni-color-primary;  | 
|                 }  | 
|             }  | 
|   | 
|             .status_wrap {  | 
|                 display: flex;  | 
|                 align-items: center;  | 
|                 justify-content: space-evenly;  | 
|                 width: 690rpx;  | 
|                 height: 76rpx;  | 
|                 margin-top: 4rpx;  | 
|                 background: #ffffff;  | 
|                 box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0, 0, 0, 0.18);  | 
|                 border-radius: 8rpx;  | 
|   | 
|                 .status {  | 
|                     color: #666666;  | 
|   | 
|                     text {  | 
|                         color: #111111;  | 
|                     }  | 
|   | 
|                     &:nth-last-child(1) {  | 
|                         text {  | 
|                             color: #ed4545;  | 
|                         }  | 
|                     }  | 
|                 }  | 
|             }  | 
|   | 
|             .title {  | 
|                 font-weight: 500;  | 
|                 font-size: 32rpx;  | 
|                 color: #111111;  | 
|                 line-height: 44rpx;  | 
|                 margin-bottom: 30rpx;  | 
|                 display: flex;  | 
|                 justify-content: center;  | 
|             }  | 
|         }  | 
|   | 
|         .platform_ing {  | 
|             margin-top: 20rpx;  | 
|             padding: 30rpx;  | 
|             background-color: #fff;  | 
|   | 
|             .head {  | 
|                 display: flex;  | 
|                 justify-content: space-between;  | 
|                 align-items: center;  | 
|                 margin-bottom: 30rpx;  | 
|   | 
|                 .code {  | 
|                     font-weight: 600;  | 
|                     height: 60rpx;  | 
|                     display: flex;  | 
|                     justify-content: center;  | 
|                     align-items: center;  | 
|                     font-size: 32rpx;  | 
|                     color: #111111;  | 
|                     border-radius: 8rpx;  | 
|                     border: 1rpx solid #dfdede;  | 
|   | 
|                     text {  | 
|                         display: flex;  | 
|                         justify-content: center;  | 
|                         align-items: center;  | 
|                         height: 100%;  | 
|                         &:nth-of-type(1) {  | 
|                             background: #e9f5f6;  | 
|                             padding: 0 12rpx;  | 
|                         }  | 
|   | 
|                         &:nth-of-type(2) {  | 
|                             padding-left: 4rpx;  | 
|                         }  | 
|   | 
|                         &:nth-of-type(4) {  | 
|                             padding-right: 6rpx;  | 
|                         }  | 
|                     }  | 
|                 }  | 
|   | 
|                 .status {  | 
|                     font-size: 30rpx;  | 
|                     color: $uni-color-primary;  | 
|                 }  | 
|   | 
|                 .scs {  | 
|                     color: #00ba67;  | 
|                 }  | 
|             }  | 
|   | 
|             .line {  | 
|                 display: flex;  | 
|                 margin-bottom: 20rpx;  | 
|   | 
|                 .label {  | 
|                     width: 144rpx;  | 
|                     color: #666666;  | 
|                 }  | 
|   | 
|                 .value {  | 
|                     flex: 1;  | 
|                 }  | 
|             }  | 
|   | 
|             .btns {  | 
|                 display: flex;  | 
|                 justify-content: flex-end;  | 
|   | 
|                 .btn {  | 
|                     width: 210rpx;  | 
|                     height: 76rpx;  | 
|                     line-height: 76rpx;  | 
|                     text-align: center;  | 
|                     background: #ffffff;  | 
|                     border-radius: 40rpx;  | 
|                     border: 1rpx solid #999999;  | 
|                     margin-left: 20rpx;  | 
|                 }  | 
|   | 
|                 .active {  | 
|                     background-color: $uni-color-primary;  | 
|                     color: #fff;  | 
|                     border-color: $uni-color-primary;  | 
|                 }  | 
|             }  | 
|         }  | 
|   | 
|         .empty {  | 
|             width: 220rpx;  | 
|             margin: 160rpx auto;  | 
|         }  | 
|   | 
|         .main_footer {  | 
|             width: 750rpx;  | 
|             height: 136rpx;  | 
|             position: fixed;  | 
|             bottom: 0;  | 
|             left: 0;  | 
|             padding: 24rpx 30rpx;  | 
|             display: flex;  | 
|             justify-content: space-between;  | 
|             font-size: 32rpx;  | 
|             background-color: #fff;  | 
|   | 
|             .btn {  | 
|                 width: 224rpx;  | 
|                 height: 88rpx;  | 
|                 display: flex;  | 
|                 justify-content: center;  | 
|                 align-items: center;  | 
|                 background: #ffffff;  | 
|                 border-radius: 44rpx;  | 
|                 color: $uni-color-primary;  | 
|                 border: 1rpx solid $uni-color-primary;  | 
|             }  | 
|   | 
|             .active {  | 
|                 width: 436rpx;  | 
|                 background-color: $uni-color-primary;  | 
|                 color: #fff;  | 
|                 border-color: $uni-color-primary;  | 
|             }  | 
|         }  | 
|     }  | 
|   | 
|     .PlatformCallModal {  | 
|         height: calc(100vh - 44px);  | 
|         padding: 30rpx;  | 
|           | 
|         .title {  | 
|             text-align: center;  | 
|             margin: 0 0 30rpx;  | 
|         }  | 
|   | 
|         .input_wrap {  | 
|             display: flex;  | 
|             align-items: center;  | 
|             width: 690rpx;  | 
|             height: 76rpx;  | 
|             background: #f7f7f7;  | 
|             border-radius: 38rpx;  | 
|             padding: 0 30rpx;  | 
|         }  | 
|   | 
|         .order_list {  | 
|             height: calc(100% - 160rpx);  | 
|             margin-top: 20rpx;  | 
|             .scroll_view {  | 
|                 height: 100%;  | 
|             }  | 
|   | 
|             .platform_ing {  | 
|                 border-radius: 8rpx;  | 
|                 border: 1rpx solid #dfe2e8;  | 
|                 &:nth-of-type(1){  | 
|                     margin-top: 0;  | 
|                 }  | 
|             }  | 
|         }  | 
|   | 
|         .detail_list {  | 
|             border-top: 1rpx solid #e5e5e5;  | 
|             padding: 30rpx 0;  | 
|   | 
|             .orderId {  | 
|                 font-size: 30rpx;  | 
|                 color: $uni-color-primary;  | 
|                 margin-bottom: 14rpx;  | 
|             }  | 
|   | 
|             .addr {  | 
|                 font-size: 26rpx;  | 
|                 color: #666666;  | 
|                 margin-bottom: 20rpx;  | 
|             }  | 
|   | 
|             .content {  | 
|                 width: 100%;  | 
|                 padding: 20rpx;  | 
|                 background: #f7f7f7;  | 
|                 border-radius: 8rpx;  | 
|   | 
|                 .line {  | 
|                     display: flex;  | 
|                     margin-bottom: 20rpx;  | 
|   | 
|                     &:nth-of-type(2n) {  | 
|                         padding-bottom: 20rpx;  | 
|                         border-bottom: 1rpx solid #e5e5e5;  | 
|                     }  | 
|   | 
|                     &:last-child {  | 
|                         padding-bottom: 0rpx;  | 
|                         border-bottom: none;  | 
|                     }  | 
|   | 
|                     .label {  | 
|                         font-size: 28rpx;  | 
|                         color: #666666;  | 
|                         width: 88rpx;  | 
|                     }  | 
|   | 
|                     .value {  | 
|                         font-size: 28rpx;  | 
|                         color: #222222;  | 
|                     }  | 
|                 }  | 
|             }  | 
|         }  | 
|   | 
|         .btns {  | 
|             display: flex;  | 
|             align-items: center;  | 
|             justify-content: space-between;  | 
|   | 
|             .btn {  | 
|                 width: 336rpx;  | 
|                 height: 88rpx;  | 
|                 border-radius: 44rpx;  | 
|                 border: 1rpx solid $uni-color-primary;  | 
|                 color: $uni-color-primary;  | 
|                 font-size: 32rpx;  | 
|                 display: flex;  | 
|                 justify-content: center;  | 
|                 align-items: center;  | 
|             }  | 
|   | 
|             .active {  | 
|                 color: #fff;  | 
|                 background-color: $uni-color-primary;  | 
|             }  | 
|         }  | 
|     }  | 
|   | 
|     .TransformModal {  | 
|         height: 900rpx;  | 
|         padding: 30rpx;  | 
|         position: relative;  | 
|   | 
|         .title {  | 
|             text-align: center;  | 
|             margin: 0 0 30rpx;  | 
|         }  | 
|   | 
|         .btns {  | 
|             display: flex;  | 
|             align-items: center;  | 
|             justify-content: space-between;  | 
|             position: absolute;  | 
|             z-index: 999;  | 
|             left: 30rpx;  | 
|             bottom: 30rpx;  | 
|   | 
|             .btn {  | 
|                 width: 336rpx;  | 
|                 height: 88rpx;  | 
|                 border-radius: 44rpx;  | 
|                 border: 1rpx solid $uni-color-primary;  | 
|                 color: $uni-color-primary;  | 
|                 font-size: 32rpx;  | 
|                 display: flex;  | 
|                 justify-content: center;  | 
|                 align-items: center;  | 
|             }  | 
|   | 
|             .active {  | 
|                 color: #fff;  | 
|                 margin-left: 18rpx;  | 
|                 background-color: $uni-color-primary;  | 
|             }  | 
|         }  | 
|   | 
|         .transform_list {  | 
|             height: 660rpx;  | 
|             margin-bottom: 30rpx;  | 
|             overflow: auto;  | 
|   | 
|             .line {  | 
|                 display: flex;  | 
|                 align-items: center;  | 
|                 border-bottom: 1rpx solid #e5e5e5;  | 
|                 padding-bottom: 30rpx;  | 
|                 margin-bottom: 30rpx;  | 
|   | 
|                 .name {  | 
|                     font-size: 32rpx;  | 
|                     color: #111111;  | 
|                 }  | 
|   | 
|                 .status {  | 
|                     flex: 1;  | 
|                     font-size: 28rpx;  | 
|                     color: $uni-color-primary;  | 
|                     margin-left: 12rpx;  | 
|                 }  | 
|   | 
|                 .green {  | 
|                     color: #00ba67;  | 
|                 }  | 
|   | 
|                 .checked {  | 
|                     width: 40rpx;  | 
|                     height: 40rpx;  | 
|                 }  | 
|             }  | 
|         }  | 
|     }  | 
|   | 
|     .detail_modal {  | 
|         height: 100vh;  | 
|         padding: 36rpx 30rpx;  | 
|         border-radius: 12rpx;  | 
|         box-shadow: 0 0 6rpx rgba(0, 0, 0, 0.5);  | 
|         .modal_title {  | 
|             font-weight: 600;  | 
|             font-size: 32rpx;  | 
|             color: #222222;  | 
|             line-height: 44rpx;  | 
|             text-align: center;  | 
|             margin-bottom: 36rpx;  | 
|         }  | 
|         .contract_wrap{  | 
|             height: calc( 100% - 400rpx );  | 
|             overflow-y: auto;  | 
|         }  | 
|         .contract_list {  | 
|             border-top: 1rpx solid #E5E5E5;  | 
|             margin-bottom: 30rpx;  | 
|             padding-top: 30rpx;  | 
|             &:nth-last-child(1){  | 
|                 margin-bottom: 0;  | 
|             }  | 
|             .list {  | 
|                 background: #f7f7f7;  | 
|                 border-radius: 8rpx;  | 
|                 padding: 20rpx;  | 
|                 .item{  | 
|                     border-bottom: 1rpx solid #e5e5e5;  | 
|                     padding-bottom: 20rpx;  | 
|                     margin-bottom: 20rpx;  | 
|                     &:nth-last-child(1){  | 
|                         border: none;  | 
|                         padding-bottom: 0;  | 
|                         margin-bottom: 0;  | 
|                     }  | 
|                 }  | 
|                 .line {  | 
|                     display: flex;  | 
|                     margin-bottom: 20rpx;  | 
|                     &:nth-last-child(1){  | 
|                         margin-bottom: 0rpx;  | 
|                     }  | 
|                     .label {  | 
|                         color: #666666;  | 
|                         width: 92rpx;  | 
|                     }  | 
|   | 
|                     .value {  | 
|                         flex: 1;  | 
|                         color: #222222;  | 
|                     }  | 
|                 }  | 
|             }  | 
|   | 
|             .title {  | 
|                 font-weight: 600;  | 
|                 font-size: 30rpx;  | 
|                 color: $uni-color-primary;  | 
|                 margin-bottom: 12rpx;  | 
|             }  | 
|   | 
|             .address {  | 
|                 font-size: 26rpx;  | 
|                 color: #666666;  | 
|                 margin-bottom: 20rpx;  | 
|             }  | 
|         }  | 
|   | 
|         .info {  | 
|             .line {  | 
|                 display: flex;  | 
|                 margin-bottom: 20rpx;  | 
|   | 
|                 .label {  | 
|                     font-size: 30rpx;  | 
|                     color: #666666;  | 
|                     width: 150rpx;  | 
|                 }  | 
|   | 
|                 .value {  | 
|                     flex: 1;  | 
|                     font-size: 30rpx;  | 
|                     color: #222222;  | 
|                 }  | 
|             }  | 
|         }  | 
|   | 
|         .separate {  | 
|             width: 750rpx;  | 
|             height: 2rpx;  | 
|             margin: 30rpx -30rpx;  | 
|             border: 1rpx solid #e5e5e5;  | 
|         }  | 
|   | 
|         .id_card {  | 
|             display: flex;  | 
|             font-weight: 600;  | 
|             height: 60rpx;  | 
|             line-height: 60rpx;  | 
|             font-size: 32rpx;  | 
|             color: #111111;  | 
|             border-radius: 8rpx;  | 
|             border: 1rpx solid #dfdede;  | 
|             width: 220rpx;  | 
|             margin-bottom: 15rpx;  | 
|   | 
|             text {  | 
|                 &:nth-of-type(1) {  | 
|                     background: #e9f5f6;  | 
|                     padding: 0 12rpx;  | 
|                 }  | 
|   | 
|                 &:nth-of-type(2) {  | 
|                     padding-left: 10rpx;  | 
|                 }  | 
|   | 
|                 &:nth-of-type(4) {  | 
|                     padding-right: 6rpx;  | 
|                 }  | 
|             }  | 
|         }  | 
|     }  | 
| </style> |