| | |
| | | <template> |
| | | <div class="main_app"> |
| | | <div class="main_app" style="overflow-y: 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"> |
| | | {{ 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"> |
| | |
| | | <el-button type="primary" @click="handleQueuing(item, 2)">月台叫号</el-button> |
| | | </div> |
| | | <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="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="line"> |
| | | <div v-if="task.type == 4" class="ite"> |
| | | <span>合同单号:</span> |
| | | <span>{{ task.contractNum }}</span> |
| | | </div> |
| | | <div v-else class="ite"> |
| | | <div v-if="task.billCode" style="width: 40%;" class="ite"> |
| | | <span>运输单号:</span> |
| | | <span>{{ task.billCode }}</span> |
| | | </div> |
| | | <div class="ite siji"> |
| | | <span>驾驶员:</span> |
| | | <span>{{ task.driverName }}</span> |
| | | <div v-else class="ite" style="width: 40%;"> |
| | | <span>合同单号:</span> |
| | | <span>{{ task.contractNum }}</span> |
| | | </div> |
| | | <div class="ite phone"> |
| | | <div class="ite jiashi"> |
| | | <span>驾驶员:</span> |
| | | <span>{{ task.driverName }} {{ task.drivierPhone }}</span> |
| | | </div> |
| | | <!-- <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(task)">运单详情</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-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> |
| | |
| | | <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="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 }" |
| | |
| | | <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> |
| | |
| | | </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() { |
| | |
| | | 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() { |
| | | 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) { |
| | | this.loadingOpen = true |
| | | platformBeginWork({ jobId: item.id }).then(res => { |
| | | this.loadingOpen = false |
| | | Message.success('已开始作业') |
| | | this.getPlatGroupList() |
| | | }, () => { |
| | | this.loadingOpen = false |
| | | }) |
| | | }, |
| | | handleFinish(item) { |
| | | this.loadingFinish = true |
| | | platformFinishWork({ jobId: item.id }).then(res => { |
| | | this.loadingFinish = false |
| | | Message.success('完成作业') |
| | | this.getPlatGroupList() |
| | | }, () => { |
| | | this.loadingFinish = false |
| | | }) |
| | | }, |
| | | handleTransform(item, task) { |
| | |
| | | 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.$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 |
| | | }) |
| | | }, |
| | | 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) { |
| | |
| | | }, |
| | | handleSet() { |
| | | this.isShowSet = true |
| | | getPlatformGroupList({ |
| | | queryData: 0, |
| | | queryType: 1 |
| | | }).then(res => { |
| | | this.PlatGroupListSet = res || [] |
| | | }) |
| | | }, |
| | | handleSetSub() { |
| | | const { PlatGroupList } = this |
| | | const { PlatGroupListSet } = this |
| | | const ids = [] |
| | | PlatGroupList.forEach(item => { |
| | | PlatGroupListSet.forEach(item => { |
| | | item.platformList.forEach(platform => { |
| | | if (platform.showConfig) { |
| | | ids.push(platform.id) |
| | |
| | | }) |
| | | }, |
| | | platformSetClick(id) { |
| | | const { PlatGroupList } = this |
| | | PlatGroupList.forEach(item => { |
| | | const { PlatGroupListSet } = this |
| | | PlatGroupListSet.forEach(item => { |
| | | item.platformList.forEach(platform => { |
| | | if (platform.id === id) { |
| | | platform.showConfig = !platform.showConfig |
| | |
| | | margin-top: 10px; |
| | | padding: 16px; |
| | | width: calc(100% - 0); |
| | | |
| | | .info { |
| | | background: #f4fafb; |
| | | border-radius: 2px; |
| | |
| | | margin-bottom: 6px; |
| | | |
| | | .ite { |
| | | width: 33.3%; |
| | | width: 50%; |
| | | margin-top: 8px; |
| | | } |
| | | |
| | | .siji { |
| | | width: 29%; |
| | | .jiashi { |
| | | width: 60%; |
| | | } |
| | | |
| | | .phone { |
| | |
| | | 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; |
| | | } |
| | |
| | | } |
| | | } |
| | | } |
| | | |
| | | .jobing { |
| | | background: #effbf5; |
| | | |
| | |
| | | } |
| | | } |
| | | |
| | | .ml20 { |
| | | .btns { |
| | | position: absolute; |
| | | width: 120px; |
| | | width: 180px; |
| | | height: 36px; |
| | | right: 0; |
| | | top: -4px; |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | } |
| | | } |
| | | |