|  |  | 
 |  |  | <template> | 
 |  |  |   <div class="main_app"> | 
 |  |  |   <div class="main_app" style="overflow: auto;height: calc(100% - 100px);"> | 
 |  |  |     <div class="mb20 main_header"> | 
 |  |  |       <div class="platgroup_tabs"> | 
 |  |  |         <div | 
 |  |  |           class="tab" | 
 |  |  |           :class="{ active: activeGroup.id === item.id }" | 
 |  |  |           @click="platgroupClick(item)" | 
 |  |  |           v-for="(item, i) in PlatGroupList" | 
 |  |  |           :key="i" | 
 |  |  |         > | 
 |  |  |         <div class="tab" :class="{ active: activeGroup.id === item.id }" @click="platgroupClick(item)" | 
 |  |  |           v-for="(item, i) in PlatGroupList" :key="i"> | 
 |  |  |           {{ item.name }} | 
 |  |  |         </div> | 
 |  |  |         <!-- <el-tabs v-model="activeGroup.id" @tab-click="platgroupClick"> | 
 |  |  |           <el-tab-pane | 
 |  |  |             v-for="item,i in PlatGroupList" | 
 |  |  |             :key="i" | 
 |  |  |             :label="item.name" | 
 |  |  |             :name="String(item.id)" | 
 |  |  |           /> | 
 |  |  |         </el-tabs> --> | 
 |  |  |       </div> | 
 |  |  |       <el-button type="primary" class="ml20" @click="handleSet" | 
 |  |  |         >配置月台</el-button | 
 |  |  |       > | 
 |  |  |       <div class="btns"> | 
 |  |  |         <!-- <el-button type="primary" @click="handleSet">刷新</el-button> --> | 
 |  |  |         <el-button type="primary" class="ml20" @click="handleSet">配置月台</el-button> | 
 |  |  |       </div> | 
 |  |  |     </div> | 
 |  |  |     <!--  --> | 
 |  |  |     <div v-if="activeGroup.platformList" class="platform_list"> | 
 |  |  | 
 |  |  |             </div> | 
 |  |  |             <div class="name">{{ item.name }}</div> | 
 |  |  |             <div class="ite"> | 
 |  |  |               <span class="placeholder9">作业:</span | 
 |  |  |               ><span>{{ item.platformWorkVO.workNum }}</span> | 
 |  |  |               <span class="placeholder9">作业:</span><span>{{ item.platformWorkVO.workNum }}</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="ite"> | 
 |  |  |               <span class="placeholder9">已叫:</span | 
 |  |  |               ><span>{{ item.platformWorkVO.callNum }}</span> | 
 |  |  |               <span class="placeholder9">已叫:</span><span>{{ item.platformWorkVO.callNum }}</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="ite"> | 
 |  |  |               <span class="placeholder9">等待:</span | 
 |  |  |               ><span>{{ item.platformWorkVO.waitNum }}</span> | 
 |  |  |               <span class="placeholder9">等待:</span><span>{{ item.platformWorkVO.waitNum }}</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="ite"> | 
 |  |  |               <span class="placeholder9">异常:</span | 
 |  |  |               ><span class="red">{{ item.platformWorkVO.exceptionNum }}</span> | 
 |  |  |               <span class="placeholder9">异常:</span><span class="red">{{ item.platformWorkVO.exceptionNum }}</span> | 
 |  |  |             </div> | 
 |  |  |           </div> | 
 |  |  |           <el-button type="primary" @click="handleQueuing(item)"> | 
 |  |  |             <div class="df_ac"> | 
 |  |  |               <img class="shengyin" src="@/assets/icons/shengyin.png" alt=""> | 
 |  |  |               <span>叫号</span> | 
 |  |  |             </div> | 
 |  |  |           </el-button> | 
 |  |  |           <el-button @click="handleQueuing(item, 1)">叫号入园</el-button> | 
 |  |  |           <el-button type="primary" @click="handleQueuing(item, 2)">月台叫号</el-button> | 
 |  |  |         </div> | 
 |  |  |         <div | 
 |  |  |           class="list" | 
 |  |  |           v-if="item.platformWorkVO && item.platformWorkVO.platformJobList" | 
 |  |  |         > | 
 |  |  |           <div | 
 |  |  |             class="info" | 
 |  |  |             v-for="task in item.platformWorkVO.platformJobList" | 
 |  |  |             :key="task.id" | 
 |  |  |           > | 
 |  |  |         <div class="list" v-if="item.platformWorkVO && item.platformWorkVO.platformJobList"> | 
 |  |  |           <div class="info" :class="{ err: task.status == 8 }" v-for="task in item.platformWorkVO.platformJobList" | 
 |  |  |             :key="task.id"> | 
 |  |  |             <div class="line"> | 
 |  |  |               <div class="left"> | 
 |  |  |                 <div v-if="task.carCodeFront" class="code"> | 
 |  |  | 
 |  |  |                 </div> | 
 |  |  |               </div> | 
 |  |  |               <div class="right"> | 
 |  |  |                 <div | 
 |  |  |                   class="status" | 
 |  |  |                   v-if="task.status != 4 && task.status != 5" | 
 |  |  |                   :class="{ red: task.status == 8 }" | 
 |  |  |                 > | 
 |  |  |                 <div class="status_item" v-if="task.status != 4 && task.status != 5" :class="{ red: task.status == 8 }"> | 
 |  |  |                   <span class="lab">{{ statusMap[task.status] }}</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="status" v-if="task.status == 4"> | 
 |  |  |                 <div class="status_item" v-if="task.status == 4"> | 
 |  |  |                   <span class="lab">叫号中</span> {{ task.callDateTemp }} | 
 |  |  |                 </div> | 
 |  |  |                 <div class="status scs" v-if="task.status == 5"> | 
 |  |  |                   <span class="lab">已作业</span> {{ task.startDateTemp }} | 
 |  |  |                 <div class="status_item scs" v-if="task.status == 5"> | 
 |  |  |                   <span class="lab">作业中</span> {{ task.startDateTemp }} | 
 |  |  |                 </div> | 
 |  |  |               </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="line"> | 
 |  |  |               <div v-if="task.type == 4" class="ite"> | 
 |  |  |               <div v-if="task.billCode" style="width: 40%;" class="ite"> | 
 |  |  |                 <span>运输单号:</span> | 
 |  |  |                 <span>{{ task.billCode }}</span> | 
 |  |  |               </div> | 
 |  |  |               <div v-else class="ite" style="width: 40%;"> | 
 |  |  |                 <span>合同单号:</span> | 
 |  |  |                 <span>{{ task.contractNum }}</span> | 
 |  |  |               </div> | 
 |  |  |               <div v-else class="ite"> | 
 |  |  |                 <span>运输单号:</span> | 
 |  |  |                 <span>{{ task.code }}</span> | 
 |  |  |               </div> | 
 |  |  |               <div class="ite"> | 
 |  |  |               <div class="ite jiashi"> | 
 |  |  |                 <span>驾驶员:</span> | 
 |  |  |                 <span>{{ task.driverName }}</span> | 
 |  |  |                 <span>{{ task.driverName }} {{ task.drivierPhone }}</span> | 
 |  |  |               </div> | 
 |  |  |               <div class="ite"> | 
 |  |  |               <!-- <div class="ite phone"> | 
 |  |  |                 <span>手机号:</span> | 
 |  |  |                 <span>{{ task.drivierPhone }}</span> | 
 |  |  |               </div> | 
 |  |  |               <div class="ite"> | 
 |  |  |               </div> --> | 
 |  |  |               <div class="ite" style="width: 40%"> | 
 |  |  |                 <span>总运输量:</span> | 
 |  |  |                 <span>{{ task.totalNum }}万支</span> | 
 |  |  |                 <span>{{ task.totalNum || task.ioQty }}万支</span> | 
 |  |  |               </div> | 
 |  |  |               <div v-if="task.type != 4" class="ite" style="width: 66.6%"> | 
 |  |  |               <div v-if="task.billCode" class="ite" style="width: 60%"> | 
 |  |  |                 <span>运输公司:</span> | 
 |  |  |                 <span>{{ task.carrierName }}</span> | 
 |  |  |               </div> | 
 |  |  |               <div class="ite"></div> | 
 |  |  |               <!-- <div class="ite"></div> --> | 
 |  |  |             </div> | 
 |  |  |             <div class="line"> | 
 |  |  |               <div v-if="task.type != 4" class="left"> | 
 |  |  |                 <span class="primaryColor pointer" @click="handleDetail" | 
 |  |  |                   >运单详情</span | 
 |  |  |                 > | 
 |  |  |               <div class="left"> | 
 |  |  |                 <span v-if="task.billCode" class="primaryColor pointer" @click="handleDetail(task)">运单详情</span> | 
 |  |  |                 <span v-else class="primaryColor pointer" @click="subDetail(task)">预约详情</span> | 
 |  |  |               </div> | 
 |  |  |               <div v-else></div> | 
 |  |  |               <div class="right"> | 
 |  |  |                 <el-button | 
 |  |  |                   v-if="task.status == 5" | 
 |  |  |                   plain | 
 |  |  |                   @click="handleErr(task)" | 
 |  |  |                   >异常挂起</el-button | 
 |  |  |                 > | 
 |  |  |                 <el-button | 
 |  |  |                   v-if="task.status == 5 || task.status == 8" | 
 |  |  |                   plain | 
 |  |  |                   @click="handleTransform(item, task)" | 
 |  |  |                   >转移月台</el-button | 
 |  |  |                 > | 
 |  |  |                 <el-button | 
 |  |  |                   v-if="task.status == 4" | 
 |  |  |                   plain | 
 |  |  |                   @click="handlePass(task)" | 
 |  |  |                   >过号</el-button | 
 |  |  |                 > | 
 |  |  |                 <el-button | 
 |  |  |                   v-if="task.status == 5 || task.status == 8" | 
 |  |  |                   type="primary" | 
 |  |  |                   @click="handleFinish(task)" | 
 |  |  |                   >作业完成</el-button | 
 |  |  |                 > | 
 |  |  |                 <el-button | 
 |  |  |                   v-if="task.status == 4" | 
 |  |  |                   type="primary" | 
 |  |  |                   @click="handleWork(task)" | 
 |  |  |                   >开始作业</el-button | 
 |  |  |                 > | 
 |  |  |                 <el-button v-if="task.status == 5" plain @click="handleErr(task)">异常挂起</el-button> | 
 |  |  |                 <el-button v-if="task.status == 5 || task.status == 8" plain | 
 |  |  |                   @click="handleTransform(item, task)">转移月台</el-button> | 
 |  |  |                 <el-button v-if="task.status == 4" plain @click="handlePass(task)">过号</el-button> | 
 |  |  |                 <el-button v-preventReClick :loading="loadingFinish" v-if="task.status == 5 || task.status == 8" | 
 |  |  |                   type="primary" @click="handleFinish(task)">作业完成</el-button> | 
 |  |  |                 <el-button v-preventReClick :loading="loadingOpen" v-if="task.status == 4" type="primary" | 
 |  |  |                   @click="handleWork(task)">开始作业</el-button> | 
 |  |  |               </div> | 
 |  |  |             </div> | 
 |  |  |           </div> | 
 |  |  |         </div> | 
 |  |  |         <div v-if="!item.platformWorkVO.platformJobList || item.platformWorkVO.platformJobList.length == 0" class="empty_plat"> | 
 |  |  |         <div v-if="!item.platformWorkVO.platformJobList || item.platformWorkVO.platformJobList.length == 0" | 
 |  |  |           class="empty_plat"> | 
 |  |  |           <img src="@/assets/images/default_nodata.png" alt=""> | 
 |  |  |           <div>暂无车辆</div> | 
 |  |  |         </div> | 
 |  |  |       </div> | 
 |  |  |     </div> | 
 |  |  |     <!-- 配置显示月台 --> | 
 |  |  |     <GlobalWindow | 
 |  |  |       title="配置显示月台" | 
 |  |  |       :visible.sync="isShowSet" | 
 |  |  |       :confirm-working="setLoading" | 
 |  |  |       @confirm="handleSetSub" | 
 |  |  |       width="560px" | 
 |  |  |     > | 
 |  |  |     <GlobalWindow title="配置显示月台" :visible.sync="isShowSet" :confirm-working="setLoading" @confirm="handleSetSub" | 
 |  |  |       width="560px"> | 
 |  |  |       <div class="set_modal"> | 
 |  |  |         <div class="mb10" v-for="group in PlatGroupList" :key="group.id"> | 
 |  |  |           <div class="title">{{group.name}}</div> | 
 |  |  |         <div class="mb10" v-for="group in PlatGroupListSet" :key="group.id"> | 
 |  |  |           <div class="title">{{ group.name }}</div> | 
 |  |  |           <div class="list"> | 
 |  |  |             <div class="item" @click="platformSetClick(item.id)" :class="{ active: item.showConfig }" v-for="item in group.platformList" :key="item.id"> | 
 |  |  |               <div>{{item.name}}</div> | 
 |  |  |             <div class="item" @click="platformSetClick(item.id)" :class="{ active: item.showConfig }" | 
 |  |  |               v-for="item in group.platformList" :key="item.id"> | 
 |  |  |               <div>{{ item.name }}</div> | 
 |  |  |               <div v-if="item.showConfig" class="bg"></div> | 
 |  |  |               <i v-if="item.showConfig" class="el-icon-check scs"></i> | 
 |  |  |             </div> | 
 |  |  | 
 |  |  |     <!-- 运单详情 --> | 
 |  |  |     <!--  --> | 
 |  |  |     <!-- 叫号 --> | 
 |  |  |     <PlatformQueuing | 
 |  |  |       ref="PlatformQueuingRef" | 
 |  |  |       v-if="isShowQueuing" | 
 |  |  |       @success="getPlatGroupList" | 
 |  |  |       @close="isShowQueuing = false" | 
 |  |  |     /> | 
 |  |  |     <WaybillDetail | 
 |  |  |       ref="WaybillDetailRef" | 
 |  |  |       v-if="isShowDetail" | 
 |  |  |       @success="getList" | 
 |  |  |       @close="isShowDetail = false" | 
 |  |  |     /> | 
 |  |  |     <el-dialog | 
 |  |  |       title="转移月台" | 
 |  |  |       :visible.sync="isShowTransform" | 
 |  |  |       width="500px" | 
 |  |  |       style="margin-top: 12vh" | 
 |  |  |     > | 
 |  |  |     <PlatformQueuing ref="PlatformQueuingRef" v-if="isShowQueuing" @success="getPlatGroupList" | 
 |  |  |       @close="isShowQueuing = false" /> | 
 |  |  |     <WaybillDetail ref="WaybillDetailRef" v-if="isShowDetail" @success="getList" @close="isShowDetail = false" /> | 
 |  |  |     <DriverDetail v-if="isShowDriver" ref="DriverDetailRef" /> | 
 |  |  |     <el-dialog title="转移月台" :visible.sync="isShowTransform" width="500px" style="margin-top: 12vh"> | 
 |  |  |       <div class="df_ac"> | 
 |  |  |         <span>选择转移到的月台:</span> | 
 |  |  |         <el-select v-model="activePlatId"> | 
 |  |  |           <el-option | 
 |  |  |             v-for="item in activeGroup.platformList" | 
 |  |  |             :key="item.id" | 
 |  |  |             :label="item.name" | 
 |  |  |             :value="item.id" | 
 |  |  |           > | 
 |  |  |           <el-option v-for="item in activeGroup.platformList" :key="item.id" :label="item.name" :value="item.id"> | 
 |  |  |           </el-option> | 
 |  |  |         </el-select> | 
 |  |  |       </div> | 
 |  |  |       <span slot="footer" class="dialog-footer"> | 
 |  |  |         <el-button @click="isShowTransform = false">取消</el-button> | 
 |  |  |         <el-button type="primary" @click="transformSub">确定</el-button> | 
 |  |  |         <el-button v-preventReClick type="primary" @click="transformSub">确定</el-button> | 
 |  |  |       </span> | 
 |  |  |     </el-dialog> | 
 |  |  |   </div> | 
 |  |  | 
 |  |  | } from '@/api' | 
 |  |  | import PlatformQueuing from './components/PlatformQueuing.vue' | 
 |  |  | import WaybillDetail from './components/WaybillDetail.vue' | 
 |  |  | import DriverDetail from "@/views/task/driverDetail.vue" | 
 |  |  | import GlobalWindow from '@/components/common/GlobalWindow' | 
 |  |  | import dayjs from 'dayjs' | 
 |  |  | import duration from 'dayjs/plugin/duration' | 
 |  |  | import { Message } from 'element-ui' | 
 |  |  | import { Loading, Message } from 'element-ui' | 
 |  |  | import { statusMap } from './config' | 
 |  |  | dayjs.extend(duration) | 
 |  |  | export default { | 
 |  |  |   components: { | 
 |  |  |     PlatformQueuing, | 
 |  |  |     WaybillDetail, | 
 |  |  |     DriverDetail, | 
 |  |  |     GlobalWindow | 
 |  |  |   }, | 
 |  |  |   data () { | 
 |  |  |   data() { | 
 |  |  |     return { | 
 |  |  |       statusMap, | 
 |  |  |       activeGroup: {}, | 
 |  |  |       PlatGroupList: [], | 
 |  |  |       PlatGroupListSet: [], | 
 |  |  |       platList: [], | 
 |  |  |       platCallList: [], | 
 |  |  |       isShowTransform: false, | 
 |  |  | 
 |  |  |  | 
 |  |  |       setParam: {}, | 
 |  |  |       isShowDetail: false, // 运单详情 | 
 |  |  |       isShowDriver: false, // 预约详情 | 
 |  |  |       detail: {}, | 
 |  |  |       isShowQueuing: false, | 
 |  |  |       timer: null | 
 |  |  |       timer: null, | 
 |  |  |       timer2: null, | 
 |  |  |  | 
 |  |  |       loadingOpen: false, | 
 |  |  |       loadingFinish: false, | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   created () { | 
 |  |  |   created() { | 
 |  |  |     this.timer2 = setInterval(() => { | 
 |  |  |       this.getPlatGroupList() | 
 |  |  |     }, 1000 * 20) | 
 |  |  |     this.getPlatGroupList() | 
 |  |  |     // this.getList() | 
 |  |  |   }, | 
 |  |  |   beforeDestroy() { | 
 |  |  |     if (this.timer2) { | 
 |  |  |       clearInterval(this.timer2) | 
 |  |  |     } | 
 |  |  |     if (this.timer) { | 
 |  |  |       clearInterval(this.timer) | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     handleWork (item) { | 
 |  |  |     handleWork(item) { | 
 |  |  |       this.loadingOpen = true | 
 |  |  |       platformBeginWork({ jobId: item.id }).then(res => { | 
 |  |  |         this.loadingOpen = false | 
 |  |  |         Message.success('已开始作业') | 
 |  |  |         this.getPlatGroupList() | 
 |  |  |       }, () => { | 
 |  |  |         this.loadingOpen = false | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     handleFinish (item) { | 
 |  |  |     handleFinish(item) { | 
 |  |  |       this.loadingFinish = true | 
 |  |  |       platformFinishWork({ jobId: item.id }).then(res => { | 
 |  |  |         this.loadingFinish = false | 
 |  |  |         Message.success('完成作业') | 
 |  |  |         this.getPlatGroupList() | 
 |  |  |       }, () => { | 
 |  |  |         this.loadingFinish = false | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     handleTransform (item, task) { | 
 |  |  |     handleTransform(item, task) { | 
 |  |  |       this.activePlatId = item.id | 
 |  |  |       this.activetaskId = task.id | 
 |  |  |       this.isShowTransform = true | 
 |  |  |     }, | 
 |  |  |     transformSub () { | 
 |  |  |     transformSub() { | 
 |  |  |       const { activePlatId, activetaskId } = this | 
 |  |  |       platformMove({ platformId: activePlatId, jobId: activetaskId }).then(res => { | 
 |  |  |         Message.success('转移月台成功') | 
 |  |  | 
 |  |  |         this.getPlatGroupList() | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     handlePass (item) { | 
 |  |  |       this.$confirm('您确认要对该任务进行过号吗', '温馨提示', { | 
 |  |  |     handlePass(item) { | 
 |  |  |       this.$confirm(`确认 ${item.carCodeFront}置为过号吗?过号后,需要重新签到才能进入园区`, '温馨提示', { | 
 |  |  |         confirmButtonText: '确定', | 
 |  |  |         cancelButtonText: '取消', | 
 |  |  |         type: 'warning' | 
 |  |  | 
 |  |  |         }) | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     handleErr (item) { | 
 |  |  |     handleErr(item) { | 
 |  |  |       this.$confirm('您确认要对该任务进行异常挂起吗', '温馨提示', { | 
 |  |  |         confirmButtonText: '确定', | 
 |  |  |         cancelButtonText: '取消', | 
 |  |  | 
 |  |  |         }) | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     platgroupClick (item) { | 
 |  |  |     platgroupClick(item) { | 
 |  |  |       this.activeGroup = { ...item } | 
 |  |  |       this.circulInitTaskList() | 
 |  |  |       this.timer = setInterval(() => { | 
 |  |  |         this.circulInitTaskList() | 
 |  |  |       }, 1000) | 
 |  |  |     }, | 
 |  |  |     getPlatGroupList () { | 
 |  |  |     getPlatGroupList() { | 
 |  |  |       getPlatformGroupList({ | 
 |  |  |         queryData: 1, | 
 |  |  |         queryType: 1 | 
 |  |  | 
 |  |  |         } | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     circulInitTaskList () { | 
 |  |  |     circulInitTaskList() { | 
 |  |  |       if (this.activeGroup && this.activeGroup.platformList && this.activeGroup.platformList.length > 0) { | 
 |  |  |         const time = new Date() | 
 |  |  |         this.activeGroup.platformList.forEach(plat => { | 
 |  |  |           if (plat.platformWorkVO.platformJobList && plat.platformWorkVO.platformJobList.length > 0) { | 
 |  |  |             plat.platformWorkVO.platformJobList.forEach(item => { | 
 |  |  |               if (item.callDate) { | 
 |  |  |                 const timeNum = time.getTime() - new Date(item.callDate).getTime() | 
 |  |  |               if (item.newCallDate) { | 
 |  |  |                 const 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.startDate) { | 
 |  |  |                 const timeNum = time.getTime() - new Date(item.startDate).getTime() | 
 |  |  |               if (item.newStartDate) { | 
 |  |  |                 const timeNum = time.getTime() - new Date(item.newStartDate).getTime() | 
 |  |  |                 if (timeNum > 3600000) { | 
 |  |  |                   item.startDateTemp = dayjs.duration(timeNum).format('H小时m分ss秒') | 
 |  |  |                   item.startDateTemp = dayjs.duration(timeNum).format('H小时m分s秒') | 
 |  |  |                 } else { | 
 |  |  |                   item.startDateTemp = dayjs.duration(timeNum).format('m分s秒') | 
 |  |  |                 } | 
 |  |  | 
 |  |  |         this.$forceUpdate() | 
 |  |  |       } | 
 |  |  |     }, | 
 |  |  |     handleQueuing (item) { | 
 |  |  |     handleQueuing(item, callType) { | 
 |  |  |       this.isShowQueuing = true | 
 |  |  |       this.$nextTick(() => { | 
 |  |  |         this.$refs.PlatformQueuingRef.isShowModal = true | 
 |  |  |         this.$refs.PlatformQueuingRef.callType = callType | 
 |  |  |         this.$refs.PlatformQueuingRef.carCodeFront = '' | 
 |  |  |         this.$refs.PlatformQueuingRef.pagination = { | 
 |  |  |           total: 0, | 
 |  |  |           pageSize: 10, | 
 |  |  |           page: 1 | 
 |  |  |         } | 
 |  |  |         this.$refs.PlatformQueuingRef.activePlat = { ...item } | 
 |  |  |         this.$refs.PlatformQueuingRef.getList() | 
 |  |  |         this.$refs.PlatformQueuingRef.title = item.name | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     handleDetail () { | 
 |  |  |     subDetail(row) { | 
 |  |  |       this.isShowDriver = true | 
 |  |  |       this.$nextTick(() => { | 
 |  |  |         this.$refs.DriverDetailRef.id = row.bookId | 
 |  |  |         this.$refs.DriverDetailRef.type = 6 | 
 |  |  |         this.$refs.DriverDetailRef.getDetail() | 
 |  |  |         this.$refs.DriverDetailRef.isShowModal = true | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     handleDetail(row) { | 
 |  |  |       this.isShowDetail = true | 
 |  |  |       this.$nextTick(() => { | 
 |  |  |         this.$refs.WaybillDetailRef.isShowModal = true | 
 |  |  |         this.$refs.WaybillDetailRef.id = row.id | 
 |  |  |         this.$refs.WaybillDetailRef.getDetail() | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     getList () { | 
 |  |  |     getList() { | 
 |  |  |       const { groupId } = this | 
 |  |  |       listByGroupId(groupId).then(res => { | 
 |  |  |         this.platList = res | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     handleSet () { | 
 |  |  |     handleSet() { | 
 |  |  |       this.isShowSet = true | 
 |  |  |       getPlatformGroupList({ | 
 |  |  |         queryData: 0, | 
 |  |  |         queryType: 1 | 
 |  |  |       }).then(res => { | 
 |  |  |         this.PlatGroupListSet = res || [] | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     handleSetSub () { | 
 |  |  |       const { PlatGroupList } = this | 
 |  |  |     handleSetSub() { | 
 |  |  |       const { PlatGroupListSet } = this | 
 |  |  |       const ids = [] | 
 |  |  |       PlatGroupList.forEach(item => { | 
 |  |  |       PlatGroupListSet.forEach(item => { | 
 |  |  |         item.platformList.forEach(platform => { | 
 |  |  |           if (platform.showConfig) { | 
 |  |  |             ids.push(platform.id) | 
 |  |  | 
 |  |  |         this.setLoading = false | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     platformSetClick (id) { | 
 |  |  |       const { PlatGroupList } = this | 
 |  |  |       PlatGroupList.forEach(item => { | 
 |  |  |     platformSetClick(id) { | 
 |  |  |       const { PlatGroupListSet } = this | 
 |  |  |       PlatGroupListSet.forEach(item => { | 
 |  |  |         item.platformList.forEach(platform => { | 
 |  |  |           if (platform.id === id) { | 
 |  |  |             platform.showConfig = !platform.showConfig | 
 |  |  | 
 |  |  |  | 
 |  |  | <style lang="scss" scoped> | 
 |  |  | @import "@/assets/style/variables.scss"; | 
 |  |  |  | 
 |  |  | .platform_list { | 
 |  |  |   width: 100%; | 
 |  |  |  | 
 |  |  |   .item { | 
 |  |  |     /* padding: 16px 24px; */ | 
 |  |  |     background: #ffffff; | 
 |  |  | 
 |  |  |     border: 1px solid #dfe2e8; | 
 |  |  |     margin-bottom: 12px; | 
 |  |  |     width: 100%; | 
 |  |  |  | 
 |  |  |     .head { | 
 |  |  |       display: flex; | 
 |  |  |       justify-content: space-between; | 
 |  |  |       align-items: center; | 
 |  |  |       height: 50px; | 
 |  |  |       background: linear-gradient( 270deg, #FFFFFF 0%, #EBF6F7 100%); | 
 |  |  |       background: linear-gradient(270deg, #FFFFFF 0%, #EBF6F7 100%); | 
 |  |  |       border-radius: 2px 2px 0px 0px; | 
 |  |  |       padding: 0 20px; | 
 |  |  |       .shengyin{ | 
 |  |  |  | 
 |  |  |       .shengyin { | 
 |  |  |         width: 12px; | 
 |  |  |         height: 12px; | 
 |  |  |         margin-right: 3px; | 
 |  |  |       } | 
 |  |  |  | 
 |  |  |       .left { | 
 |  |  |         flex: 1; | 
 |  |  |         display: flex; | 
 |  |  |         align-items: center; | 
 |  |  |  | 
 |  |  |         .name { | 
 |  |  |           font-size: 16px; | 
 |  |  |           margin-right: 50px; | 
 |  |  |         } | 
 |  |  |  | 
 |  |  |         .status { | 
 |  |  |           line-height: 25px; | 
 |  |  |           height: 25px; | 
 |  |  | 
 |  |  |           color: #ffffff; | 
 |  |  |           padding: 0 6px; | 
 |  |  |         } | 
 |  |  |  | 
 |  |  |         .ite { | 
 |  |  |           margin-right: 30px; | 
 |  |  |         } | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     .list { | 
 |  |  |       display: flex; | 
 |  |  |       flex-wrap: wrap; | 
 |  |  |       justify-content: space-between; | 
 |  |  |       margin-top: 10px; | 
 |  |  |       padding: 16px; | 
 |  |  |       width: calc( 100% - 48px ); | 
 |  |  |       width: calc(100% - 0); | 
 |  |  |  | 
 |  |  |       .info { | 
 |  |  |         background: #f4fafb; | 
 |  |  |         border-radius: 2px; | 
 |  |  | 
 |  |  |         padding: 16px; | 
 |  |  |         border-radius: 2px; | 
 |  |  |         margin-bottom: 10px; | 
 |  |  |         width: calc( 31.6% - 16px ); | 
 |  |  |         .status { | 
 |  |  |         width: calc(31.6% - 22px); | 
 |  |  |         margin-right: 10px; | 
 |  |  |  | 
 |  |  |         &:nth-of-type(3n) { | 
 |  |  |           margin-right: 0; | 
 |  |  |         } | 
 |  |  |  | 
 |  |  |         .status_item { | 
 |  |  |           .lab { | 
 |  |  |             font-weight: 500; | 
 |  |  |           } | 
 |  |  |  | 
 |  |  |           color: #00ba67; | 
 |  |  |         } | 
 |  |  |  | 
 |  |  |         .line { | 
 |  |  |           display: flex; | 
 |  |  |           align-items: center; | 
 |  |  |           justify-content: space-between; | 
 |  |  |           flex-wrap: wrap; | 
 |  |  |           margin-bottom: 6px; | 
 |  |  |  | 
 |  |  |           .ite { | 
 |  |  |             width: 33.3%; | 
 |  |  |             width: 50%; | 
 |  |  |             margin-top: 8px; | 
 |  |  |           } | 
 |  |  |  | 
 |  |  |           .jiashi { | 
 |  |  |             width: 60%; | 
 |  |  |           } | 
 |  |  |  | 
 |  |  |           .phone { | 
 |  |  |             width: 37.6%; | 
 |  |  |           } | 
 |  |  |  | 
 |  |  |           .left { | 
 |  |  |             .code { | 
 |  |  |               display: flex; | 
 |  |  | 
 |  |  |               border-radius: 4px; | 
 |  |  |               border: 1px solid $primaryColor; | 
 |  |  |               padding-right: 4px; | 
 |  |  |  | 
 |  |  |               span { | 
 |  |  |                 &:nth-of-type(1) { | 
 |  |  |                   background: $primaryColor; | 
 |  |  |                   padding: 0 8px; | 
 |  |  |                   color: #fff; | 
 |  |  |                 } | 
 |  |  |  | 
 |  |  |                 &:nth-of-type(2) { | 
 |  |  |                   padding-left: 4px; | 
 |  |  |                 } | 
 |  |  |               } | 
 |  |  |             } | 
 |  |  |           } | 
 |  |  |  | 
 |  |  |           .right { | 
 |  |  |             display: flex; | 
 |  |  |             align-items: center; | 
 |  |  |           } | 
 |  |  |         } | 
 |  |  |       } | 
 |  |  |  | 
 |  |  |       .jobing { | 
 |  |  |         background: #effbf5; | 
 |  |  |  | 
 |  |  |         .status { | 
 |  |  |           color: #00ba67; | 
 |  |  |         } | 
 |  |  |       } | 
 |  |  |  | 
 |  |  |       .err { | 
 |  |  |         background: #fef6f6; | 
 |  |  |  | 
 |  |  |         .status { | 
 |  |  |           color: #ed4545; | 
 |  |  |         } | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  |     .empty_plat{ | 
 |  |  |  | 
 |  |  |     .empty_plat { | 
 |  |  |       width: 100%; | 
 |  |  |       height: 170px; | 
 |  |  |       display: flex; | 
 |  |  | 
 |  |  |       align-items: center; | 
 |  |  |       font-size: 12px; | 
 |  |  |       color: #B2B2B2; | 
 |  |  |       img{ | 
 |  |  |  | 
 |  |  |       img { | 
 |  |  |         width: 110px; | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  |   .emyty{ | 
 |  |  |     .head{ | 
 |  |  |       background: linear-gradient( 270deg, #FFFFFF 0%, #F7F7F7 100%) !important; | 
 |  |  |  | 
 |  |  |   .emyty { | 
 |  |  |     .head { | 
 |  |  |       background: linear-gradient(270deg, #FFFFFF 0%, #F7F7F7 100%) !important; | 
 |  |  |     } | 
 |  |  |     .status{ | 
 |  |  |  | 
 |  |  |     .status { | 
 |  |  |       background: #CCCCCC !important; | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  | } | 
 |  |  |  | 
 |  |  | .main_header { | 
 |  |  |   display: flex; | 
 |  |  |   position: relative; | 
 |  |  |  | 
 |  |  |   .platgroup_tabs { | 
 |  |  |     flex: 1; | 
 |  |  |     display: flex; | 
 |  |  |     border-bottom: 1px solid #dfe2e8; | 
 |  |  |  | 
 |  |  |     .tab { | 
 |  |  |       color: #666666; | 
 |  |  |       margin-right: 40px; | 
 |  |  | 
 |  |  |       padding-bottom: 18px; | 
 |  |  |       border-bottom: 2px solid #fff; | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     .active { | 
 |  |  |       font-weight: 500; | 
 |  |  |       font-size: 15px; | 
 |  |  | 
 |  |  |       border-bottom: 2px solid $primary-color; | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  |   .ml20 { | 
 |  |  |  | 
 |  |  |   .btns { | 
 |  |  |     position: absolute; | 
 |  |  |     width: 120px; | 
 |  |  |     width: 180px; | 
 |  |  |     height: 36px; | 
 |  |  |     right: 0; | 
 |  |  |     top: -4px; | 
 |  |  |     display: flex; | 
 |  |  |     justify-content: flex-end; | 
 |  |  |   } | 
 |  |  | } | 
 |  |  |  | 
 |  |  | /*  */ | 
 |  |  | .set_modal { | 
 |  |  |   .title { | 
 |  |  | 
 |  |  |     font-weight: 600; | 
 |  |  |     margin-bottom: 16px; | 
 |  |  |   } | 
 |  |  |  | 
 |  |  |   .list { | 
 |  |  |     display: flex; | 
 |  |  |     flex-wrap: wrap; | 
 |  |  |  | 
 |  |  |     .item { | 
 |  |  |       cursor: pointer; | 
 |  |  |       padding: 0 36px; | 
 |  |  | 
 |  |  |       margin-right: 13px; | 
 |  |  |       position: relative; | 
 |  |  |       overflow: hidden; | 
 |  |  |       .bg{ | 
 |  |  |  | 
 |  |  |       .bg { | 
 |  |  |         position: absolute; | 
 |  |  |         right: -12px; | 
 |  |  |         bottom: -12px; | 
 |  |  | 
 |  |  |         background: $primaryColor; | 
 |  |  |         transform: rotate(45deg); | 
 |  |  |       } | 
 |  |  |       .scs{ | 
 |  |  |  | 
 |  |  |       .scs { | 
 |  |  |         position: absolute; | 
 |  |  |         right: -1px; | 
 |  |  |         bottom: -1px; | 
 |  |  |         color: #fff; | 
 |  |  |         z-index: 99999; | 
 |  |  |         transform:scale(.8) | 
 |  |  |         transform: scale(.8) | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     .active { | 
 |  |  |       background: rgba(39,155,170,0.06); | 
 |  |  |       background: rgba(39, 155, 170, 0.06); | 
 |  |  |       border: 1px solid $primaryColor; | 
 |  |  |       color: $primaryColor; | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  | } | 
 |  |  |  | 
 |  |  | /*  */ | 
 |  |  | /*  */ | 
 |  |  | </style> |