|  |  | 
 |  |  |   <GlobalWindow | 
 |  |  |     title="月台叫号-xx号月台" | 
 |  |  |     :visible.sync="isShowModal" | 
 |  |  |     :showConfirm="false" | 
 |  |  |     width="800px" | 
 |  |  |     :confirm-working="subLoading" | 
 |  |  |     @confirm="handleSub" | 
 |  |  |   > | 
 |  |  |     <div class="queuing_modal"> | 
 |  |  |       <div class="df_ac mb20"> | 
 |  |  |         <span>搜索车辆:</span> | 
 |  |  |         <el-input | 
 |  |  |           class="flex1 mr20" | 
 |  |  |           v-model="param.aa" | 
 |  |  |           v-model="carCodeFront" | 
 |  |  |           placeholder="请输入车牌号" | 
 |  |  |         ></el-input> | 
 |  |  |         <el-button type="primary">查找</el-button> | 
 |  |  |         <el-button>重置</el-button> | 
 |  |  |         <el-button type="primary" @click="getList">查找</el-button> | 
 |  |  |         <el-button @click="reset">重置</el-button> | 
 |  |  |       </div> | 
 |  |  |       <div class="list"> | 
 |  |  |         <div class="item"> | 
 |  |  |         <div class="item" v-for="item in dataList" :key="item.id"> | 
 |  |  |           <div class="head df_sb"> | 
 |  |  |             <div class="plate">皖A12122</div> | 
 |  |  |             <div class="status">已签到</div> | 
 |  |  |             <div v-if="item.carCodeFront" class="code"> | 
 |  |  |               <span>{{ item.carCodeFront.slice(0, 1) }}</span> | 
 |  |  |               <span>{{ item.carCodeFront.slice(1, 2) }}</span> | 
 |  |  |               <span>·</span> | 
 |  |  |               <span>{{ item.carCodeFront.slice(2) }}</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="status">{{ statusMap[item.status] }}</div> | 
 |  |  |           </div> | 
 |  |  |           <div class="info"> | 
 |  |  |             <div class="ite"> | 
 |  |  |             <div v-if="item.type == 4" class="ite"> | 
 |  |  |               <span>合同单号:</span> | 
 |  |  |               <span>{{ item.contractNum }}</span> | 
 |  |  |             </div> | 
 |  |  |             <div v-else class="ite"> | 
 |  |  |               <span>运输单号:</span> | 
 |  |  |               <span>12312</span> | 
 |  |  |               <span>{{ item.code }}</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="ite"> | 
 |  |  |               <span>驾驶员:</span> | 
 |  |  |               <span>12312</span> | 
 |  |  |               <span>{{ item.driverName }}</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="ite"> | 
 |  |  |               <span>手机号:</span> | 
 |  |  |               <span>12312</span> | 
 |  |  |               <span>{{ item.drivierPhone }}</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="ite"> | 
 |  |  |               <span>总运输量:</span> | 
 |  |  |               <span>12312</span> | 
 |  |  |               <span>{{ item.totalNum }}万支</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="ite" style="width: 66%"> | 
 |  |  |             <div v-if="item.type != 4" class="ite" style="width: 66%"> | 
 |  |  |               <span>运输公司:</span> | 
 |  |  |               <span>12312</span> | 
 |  |  |               <span>{{ item.carrierName }}</span> | 
 |  |  |             </div> | 
 |  |  |           </div> | 
 |  |  |           <div class="footer df_sb"> | 
 |  |  |             <div class="detail">运单详情</div> | 
 |  |  |             <el-button type="primary">叫号</el-button> | 
 |  |  |             <div v-if="item.type != 4" class="detail">运单详情</div> | 
 |  |  |             <div v-else></div> | 
 |  |  |             <el-button type="primary" @click="handleCall(item)">叫号</el-button> | 
 |  |  |           </div> | 
 |  |  |         </div> | 
 |  |  |       </div> | 
 |  |  |       <pagination | 
 |  |  |         @size-change="handleSizeChange" | 
 |  |  |         @current-change="handlePageChange" | 
 |  |  |         :pagination="pagination" | 
 |  |  |       > | 
 |  |  |       </pagination> | 
 |  |  |     </div> | 
 |  |  |   </GlobalWindow> | 
 |  |  | </template> | 
 |  |  |  | 
 |  |  | <script> | 
 |  |  | import GlobalWindow from '@/components/common/GlobalWindow' | 
 |  |  | import { getPlatform, PlatformEdit, PlatformDel } from '@/api' | 
 |  |  | import Pagination from '@/components/common/Pagination' | 
 |  |  | import { platformCallList, platformCallNumber } from '@/api' | 
 |  |  | import { statusMap } from '../config' | 
 |  |  | import { Message } from 'element-ui' | 
 |  |  | export default { | 
 |  |  |   components: { | 
 |  |  |     GlobalWindow | 
 |  |  |     GlobalWindow, | 
 |  |  |     Pagination | 
 |  |  |   }, | 
 |  |  |   data () { | 
 |  |  |     return { | 
 |  |  |       statusMap, | 
 |  |  |       isShowModal: false, | 
 |  |  |       subLoading: false, | 
 |  |  |       param: {} | 
 |  |  |       pagination: { | 
 |  |  |         total: 0, | 
 |  |  |         pageSize: 10, | 
 |  |  |         page: 1 | 
 |  |  |       }, | 
 |  |  |       carCodeFront: '', | 
 |  |  |       activePlat: {}, | 
 |  |  |       dataList: [] | 
 |  |  |  | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     handleCall (item) { | 
 |  |  |       const activePlatform = this.activePlat | 
 |  |  |       platformCallNumber({ platformId: activePlatform.id, jobId: item.id }).then(res => { | 
 |  |  |         Message.success('叫号成功') | 
 |  |  |         this.$emit('success') | 
 |  |  |         this.getList() | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     getList () { | 
 |  |  |       const { activePlat, pagination, carCodeFront } = this | 
 |  |  |       platformCallList({ | 
 |  |  |         model: { callType: '2', platformId: activePlat.id, carCodeFront }, | 
 |  |  |         page: pagination.page, | 
 |  |  |         capacity: pagination.pageSize | 
 |  |  |       }).then(res => { | 
 |  |  |         this.dataList = res.records | 
 |  |  |         this.pagination.total = res.total | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     reset () { | 
 |  |  |       this.carCodeFront = '' | 
 |  |  |       this.pagination.page = 1 | 
 |  |  |       this.pagination.pageSize = 10 | 
 |  |  |       this.getList() | 
 |  |  |     }, | 
 |  |  |     handleSizeChange (e) { | 
 |  |  |       this.pagination.pageSize = e | 
 |  |  |       this.getList() | 
 |  |  |     }, | 
 |  |  |     handlePageChange (e) { | 
 |  |  |       this.pagination.page = e | 
 |  |  |       this.getList() | 
 |  |  |     }, | 
 |  |  |     handleSub () { | 
 |  |  |       const { param } = this | 
 |  |  |       this.subLoading = true | 
 |  |  | 
 |  |  |       }, () => { | 
 |  |  |         this.subLoading = false | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  |  | 
 |  |  | } | 
 |  |  | 
 |  |  |         .status { | 
 |  |  |           color: $primaryColor; | 
 |  |  |         } | 
 |  |  |         .code { | 
 |  |  |           display: flex; | 
 |  |  |           font-weight: 600; | 
 |  |  |           height: 30px; | 
 |  |  |           line-height: 30px; | 
 |  |  |           font-size: 15px; | 
 |  |  |           color: #111111; | 
 |  |  |           background-color: #fff; | 
 |  |  |           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; | 
 |  |  |             } | 
 |  |  |           } | 
 |  |  |         } | 
 |  |  |       } | 
 |  |  |       .info { | 
 |  |  |         display: flex; |