From 1c20c8231980a8d4b91688ff8641a06d3b2f68ab Mon Sep 17 00:00:00 2001 From: MrShi <1878285526@qq.com> Date: 星期二, 14 十月 2025 16:34:22 +0800 Subject: [PATCH] 改bug --- admin/src/views/platform/queueUp.vue | 507 ++++++++++++++++++++++++++++++++++++-------------------- 1 files changed, 325 insertions(+), 182 deletions(-) diff --git a/admin/src/views/platform/queueUp.vue b/admin/src/views/platform/queueUp.vue index 9ad3106..14057e8 100644 --- a/admin/src/views/platform/queueUp.vue +++ b/admin/src/views/platform/queueUp.vue @@ -1,213 +1,356 @@ <template> <div class="main_app"> - <div class="df_ac mb20"> - <el-select v-model="filters.currentPlatform" class="w300"> - <el-option v-for="item in platformList" :key="item.id"></el-option> - </el-select> - <el-input v-model="filters.id" placeholder="杞︾墝鍙�" class="ml20 w200" /> - <el-button type="primary" class="ml20" @click="getList()">鏌ヨ</el-button> - <el-button class="ml20" @click="clear">閲嶇疆</el-button> + <div class="main_header"> + <div class="platgroup_tabs pt20"> + <div class="tab" :class="{ active: activeGroup.id === item.id }" @click="platgroupClick(item)" + v-for="(item, i) in PlatGroupList" :key="i"> + {{ item.name }} + </div> + </div> </div> + <div class="df_sb"> + <QueryForm v-model="filters" :query-form-config="queryQueueUpConfig" @handleQuery="getList(1)" @clear="clear"> + </QueryForm> + <div> + <el-button @click="openSign" type="primary" style="align-self: flex-start;">杞﹁締绛惧埌</el-button> + </div> + </div> + <div class="common-header"> + <div class="static_wrap"> + <span>绛夊緟锛�<span class="num">{{ staticParam.waitNum }}</span></span> + <span class="mr30">{{ }}</span> + <span>鎸傝捣锛�<span class="red">{{ staticParam.exceptionNum }}</span></span> + <span></span> + </div> + </div> + <el-table :height="tableHeightNew" v-loading="loading" :data="dataList" stripe row-key="id" default-expand-all> + <el-table-column type="index" label="搴忓彿" width="80" /> + <el-table-column label="杞︾墝鍙�" width="130"> + <template slot-scope="{ row }"> + <div class="plate_id"> + <span>{{ row.carCodeFront.slice(0, 1) }}</span> + <span>{{ row.carCodeFront.slice(1, 2) }}</span> + <span>路</span> + <span>{{ row.carCodeFront.slice(2) }}</span> + </div> + </template> + </el-table-column> + <el-table-column prop="carrierName" label="杩愯緭鍏徃" show-overflow-tooltip min-width="140"> + <template v-slot="scope"> + <span>{{ scope.row.carrierName || '-' }}</span> + </template> + </el-table-column> + <el-table-column prop="contractNum" label="杩愯緭鍗曞彿/鍚堝悓鍙�" min-width="120"> + <template v-slot="scope"> + <span>{{ scope.row.billCode || scope.row.contractNum || '-' }}</span> + </template> + </el-table-column> + <el-table-column prop="totalNum" label="鎬昏繍杈撻噺(涓囨敮)" min-width="110"> + <template v-slot="scope"> + <span>{{ scope.row.totalNum || '-' }}</span> + </template> + </el-table-column> + <el-table-column label="椹鹃┒鍛�" min-width="130"> + <template slot-scope="{ row }"> + <span class="mr10">{{ row.driverName }}</span> + <span>{{ row.drivierPhone }}</span> + </template> + </el-table-column> + <el-table-column prop="signDate" label="绛惧埌鏃堕棿" min-width="150" /> + <el-table-column label="鐘舵��" align="center" width="80"> + <template slot-scope="{ row }"> + <!-- <span v-if="row.status == 2" class="red">鏈堝彴绛夊緟</span> --> + <span v-if="row.status == 2" class="red">绛夊緟鍙彿</span> + <span v-if="row.status == 3" class="primaryColor">鍏ュ洯绛夊緟</span> + <span v-if="row.status == 7" class="primaryColor">杞Щ涓�</span> + </template> + </el-table-column> + <el-table-column label="鎿嶄綔" align="center" width="200" fixed="right"> + <template slot-scope="{ row }"> + <el-button v-if="row.billCode" type="text" @click="handleDetail(row)" + v-permissions="['business:company:update']">杩愬崟璇︽儏</el-button> + <el-button v-else type="text" @click="subDetail(row)">棰勭害璇︽儏</el-button> + <el-button type="text" @click="jiaji(row.id)">鍔犳��</el-button> + </template> + </el-table-column> + </el-table> + <!-- <el-table v-else class="mb20" v-loading="loading" :data="dataList" stripe row-key="id" default-expand-all> + <el-table-column type="index" label="搴忓彿" width="80" /> + <el-table-column label="杞︾墝鍙�" width="130"> + <template slot-scope="{ row }"> + <div class="plate_id"> + <span>{{ row.carCodeFront.slice(0, 1) }}</span> + <span>{{ row.carCodeFront.slice(1, 2) }}</span> + <span>路</span> + <span>{{ row.carCodeFront.slice(2) }}</span> + </div> + </template> + </el-table-column> + <el-table-column prop="carrierName" label="杩愯緭鍏徃" min-width="120" /> + <el-table-column prop="totalNum" label="鎬昏繍杈撻噺(涓囨敮)" min-width="110" /> + <el-table-column label="椹鹃┒鍛�" min-width="130"> + <template slot-scope="{ row }"> + <span class="mr10">{{ row.driverName }}</span> + <span>{{ row.drivierPhone }}</span> + </template> + </el-table-column> + <el-table-column prop="signDate" label="绛惧埌鏃堕棿" min-width="150" /> + <el-table-column label="鎿嶄綔" align="center" width="100" fixed="right"> + <template slot-scope="{ row }"> + <el-button v-if="row.billCode" type="text" @click="handleDetail(row)" + v-permissions="['business:company:update']">杩愬崟璇︽儏</el-button> + <el-button v-else type="text" @click="subDetail(row)">棰勭害璇︽儏</el-button> + </template> + </el-table-column> + </el-table> --> + <pagination @size-change="handleSizeChange" @current-change="handlePageChange" :pagination="pagination" /> + <!-- --> - <div class="platform_list"> - <div class="item" v-for="i in 2"> - <div class="head"> - <div class="name">6鍙锋湀鍙�</div> - <div class="status"> - <span class="green">浣滀笟涓�</span> - <span class="">浣滀笟锛�1</span> - <span>鍙彿锛�1</span> - <span>绛夊緟锛�1</span> - <span class="red">寮傚父锛�1</span> - </div> - <!-- <el-button type="primary">鍙彿</el-button> --> - </div> - <div class="info" v-for="j in 3"> - <div class="line"> - <div class="left"> - <span class="plate mr20">鐨朅12122</span> - <span class="placeholder9">椹鹃┒鍛�</span> - <span>鐜嬫煇鏌�</span> - <span>18888888888</span> - </div> - <div class="right"> - <span class="green">浣滀笟涓�</span> - <span class="placeholder9 ml20">浣滀笟鏃堕暱锛�23鍒嗛挓26绉�</span> - </div> - </div> - <div class="line"> - <div class="left"> - <div> - <span>杩愯緭鍗曞彿</span - ><span class="ml10 placeholder9">1231231</span> - </div> - <div> - <span>鎬昏繍杈撻噺</span - ><span class="ml10 placeholder9">3000涓囨敮</span - ><span class="primaryColor ml10 pointer">杩愬崟璇︽儏</span> - </div> - </div> - </div> - </div> - </div> - </div> - <!-- 閰嶇疆鏄剧ず鏈堝彴 --> - <el-dialog - title="閰嶇疆鏄剧ず鏈堝彴" - :visible.sync="isShowSet" - center - width="420px" - > - <div class="set_modal"> - <div class="mb20"> - <div class="title">鍏ュ簱鏈堝彴缁�</div> - <div class="list"> - <div class="item">1鍙锋湀鍙�</div> - <div class="item">2鍙锋湀鍙�</div> - <div class="item">1鍙锋湀鍙�</div> - <div class="item">2鍙锋湀鍙�</div> - </div> - </div> - <div> - <div class="title">鍏ュ簱鏈堝彴缁�</div> - <div class="list"> - <div class="item">1鍙锋湀鍙�</div> - <div class="item">2鍙锋湀鍙�</div> - <div class="item">1鍙锋湀鍙�</div> - <div class="item">2鍙锋湀鍙�</div> - </div> - </div> - </div> - <span slot="footer" class="dialog-footer"> - <el-button @click="setReset">閲嶇疆</el-button> - <el-button type="primary" @click="setSub">纭畾</el-button> - </span> - </el-dialog> - <!-- 杩愬崟璇︽儏 --> - <el-dialog - title="閰嶇疆鏄剧ず鏈堝彴" - :visible.sync="isShowSet" - center - width="420px" - > - <div class="set_modal"> - <div class="mb20"> - <div class="title">鍏ュ簱鏈堝彴缁�</div> - <div class="list"> - <div class="item">1鍙锋湀鍙�</div> - <div class="item">2鍙锋湀鍙�</div> - <div class="item">1鍙锋湀鍙�</div> - <div class="item">2鍙锋湀鍙�</div> - </div> - </div> - <div> - <div class="title">鍏ュ簱鏈堝彴缁�</div> - <div class="list"> - <div class="item">1鍙锋湀鍙�</div> - <div class="item">2鍙锋湀鍙�</div> - <div class="item">1鍙锋湀鍙�</div> - <div class="item">2鍙锋湀鍙�</div> - </div> - </div> - </div> - <span slot="footer" class="dialog-footer"> - <el-button @click="setReset">閲嶇疆</el-button> - <el-button type="primary" @click="setSub">纭畾</el-button> - </span> - </el-dialog> + <PlatformSign ref="PlatformSignRef" v-if="isPlatformSign" @success="getPlatGroupList" + @close="isPlatformSign = false" /> + <WaybillDetail ref="WaybillDetailRef" v-if="isShowDetail" @success="getList" @close="isShowDetail = false" /> + <DriverDetail v-if="isShowDriver" ref="DriverDetailRef" /> </div> </template> <script> +import Pagination from '@/components/common/Pagination' +import QueryForm from '@/components/common/QueryForm' +import { + getPlatformGroupList, + platformLineUpPage, + getPlatformGroupWork, + jobUrge +} from '@/api' +import { queryQueueUpConfig } from './config' +import WaybillDetail from './components/WaybillDetail.vue' +import DriverDetail from '@/views/task/driverDetail.vue' +import PlatformSign from './components/PlatformSign.vue' +import BaseComputHeight from '@/components/base/BaseComputHeight' export default { - data () { + extends: BaseComputHeight, + components: { + Pagination, + QueryForm, + PlatformSign, + WaybillDetail, + DriverDetail + }, + data() { return { filters: {}, - platformList: [], - - isShowSet: false, // 鏈堝彴閰嶇疆 - setParam: {}, + activeGroup: { + type: 2 + }, + PlatGroupList: [], + staticParam: {}, + dataList: [], + loading: false, + isShowDriver: false, + isPlatformSign: false, + pagination: { + pageSize: 10, + page: 1, + total: 0, + }, + queryQueueUpConfig, isShowDetail: false, // 杩愬崟璇︽儏 detail: {} } }, + created() { + this.getPlatGroupList() + }, methods: { - getList () { }, - clear () { } + openSign() { + this.isPlatformSign = true + this.$nextTick(() => { + this.$refs.PlatformSignRef.isShowModal = true + this.$refs.PlatformSignRef.activePlat = this.activeGroup + this.$refs.PlatformSignRef.carCodeFront = '' + this.$refs.PlatformSignRef.pagination = { + total: 0, + pageSize: 10, + page: 1 + } + this.$refs.PlatformSignRef.getList() + }) + }, + jiaji(id) { + this.$dialog.exportConfirm('纭鍔犳�ュ悧锛�') + .then(() => { + jobUrge({ id }) + .then(res => { + this.getPlatGroupList() + }) + }) + .catch(() => {}) + }, + getPlatGroupList() { + getPlatformGroupList({ + queryData: 1, + queryType: 1 + }).then(res => { + this.PlatGroupList = res || [] + if (res && res.length > 0) { + if (this.activeGroup && this.activeGroup.id) { + this.activeGroup = res.find(item => item.id === this.activeGroup.id) + } else { + this.activeGroup = res[0] + } + + this.getPlatformGroupWork() + this.getList() + } + }) + }, + getList() { + const { activeGroup, pagination, filters } = this + this.loading = true + platformLineUpPage({ + model: { platformGroupId: activeGroup.id, ...filters, callType: 3 }, + capacity: pagination.pageSize, + page: pagination.page, + }).then(res => { + this.loading = false + this.dataList = res.records || [] + this.pagination.total = res.total || 0 + }, () => { + this.loading = false + }) + }, + getPlatformGroupWork() { + const { activeGroup } = this + getPlatformGroupWork(activeGroup.id).then(res => { + this.staticParam = res || {} + }) + }, + handleSizeChange(e) { + this.pagination.pageSize = e + this.getList(1) + }, + handlePageChange(e) { + this.pagination.page = e + this.getList() + }, + platgroupClick(item) { + this.activeGroup = { ...item } + this.pagination.page = 1 + this.filters = {} + this.getPlatformGroupWork() + this.getList() + }, + clear() { + this.pagination.page = 1 + this.filters = {} + this.getList() + }, + subDetail(row) { + this.isShowDriver = true + this.$nextTick(() => { + this.$refs.DriverDetailRef.id = row.bookId + this.$refs.DriverDetailRef.type = row.objType + 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() + }) + }, } } </script> <style lang="scss" scoped> -.platform_list { - .item { - padding: 16px 24px; - border-radius: 2px; - border: 2px solid #cccccc; - margin-bottom: 12px; - .head { - display: flex; - justify-content: space-between; - .name { - font-size: 16px; - } - .status { - flex: 1; - margin-left: 50px; - span { - margin-right: 30px; - } - } - } - .info { - margin-top: 10px; - border: 1px solid #999999; - padding: 6px 8px; - border-radius: 2px; - margin-bottom: 10px; - .line { - display: flex; - align-items: center; - justify-content: space-between; - margin-bottom: 6px; - .left { - .plate { - border: 1px solid #4969f6; - border-radius: 2px; - padding: 0 5px; - } - } - .right { - display: flex; - align-items: center; - } - } +@import "@/assets/style/variables.scss"; + +.main_app { + padding: 0 20px; + + .doumee-filter { + padding-top: 20px; + border: 0; + } +} + +.common-header { + background-color: #fff; + /* position: relative; */ + /* z-index: 999; */ + /* top: -10; */ + /* margin: -20px; */ + padding: 0 20px; + + /* border: 1px solid red; */ + .static_wrap { + height: 50px; + line-height: 50px; + color: #666666; + font-size: 15px; + padding: 0 20px; + background: #F4FAFB; + border-radius: 2px 2px 0px 0px; + /* margin-bottom: 36px; */ + + .num { + color: #111111; } } } -/* */ -.set_modal { - .title { - font-size: 16px; - font-weight: 600; - margin-bottom: 16px; +.plate_id { + display: flex; + width: 120px; + font-weight: 600; + height: 30px; + line-height: 30px; + font-size: 16px; + color: #111111; + border-radius: 4px; + border: 1px solid #dfdede; + + span { + &:nth-of-type(1) { + background: $primary-color; + padding: 0 6px; + color: #fff + } + + &:nth-of-type(2) { + padding-left: 2px; + } + + &:nth-of-type(4) { + padding-right: 3px; + } } - .list { +} + + +.main_header { + .platgroup_tabs { + flex: 1; display: flex; - justify-content: space-between; - flex-wrap: wrap; - .item { + border-bottom: 1px solid #dfe2e8; + + .tab { + color: #666666; + margin-right: 40px; cursor: pointer; - width: 30%; - height: 32px; - background-color: #d9d9d9; - border: 1px solid #4d99a7; - display: flex; - justify-content: center; - align-items: center; - border-radius: 6px; - margin-bottom: 12px; + padding-bottom: 14px; + border-bottom: 2px solid #fff; + } + + .active { + font-weight: 500; + font-size: 15px; + color: #222222; + border-bottom: 2px solid $primary-color; } } } -- Gitblit v1.9.3