From c80a7698101d3a27f5e40fe83ba1302758c55dd5 Mon Sep 17 00:00:00 2001
From: liukangdong <898885815@qq.com>
Date: 星期三, 12 三月 2025 16:37:30 +0800
Subject: [PATCH] ll
---
admin/src/views/platform/queueUp.vue | 495 ++++++++++++++++++++++++++++++++++--------------------
1 files changed, 313 insertions(+), 182 deletions(-)
diff --git a/admin/src/views/platform/queueUp.vue b/admin/src/views/platform/queueUp.vue
index 9ad3106..2a367f4 100644
--- a/admin/src/views/platform/queueUp.vue
+++ b/admin/src/views/platform/queueUp.vue
@@ -1,213 +1,344 @@
<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="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>
+ <!-- <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
+} 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()
+ })
+ },
+ 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