From 17efddc6a667670dca682bf36b51a43e99615e6d Mon Sep 17 00:00:00 2001
From: k94314517 <8417338+k94314517@user.noreply.gitee.com>
Date: 星期三, 16 十月 2024 15:59:38 +0800
Subject: [PATCH] 代码初始化

---
 admin/src/views/platform/queueUp.vue |  473 ++++++++++++++++++++++++++++++++++++----------------------
 1 files changed, 291 insertions(+), 182 deletions(-)

diff --git a/admin/src/views/platform/queueUp.vue b/admin/src/views/platform/queueUp.vue
index 9ad3106..eb4b0b1 100644
--- a/admin/src/views/platform/queueUp.vue
+++ b/admin/src/views/platform/queueUp.vue
@@ -1,213 +1,322 @@
 <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="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>
+      </div>
     </div>
+    <div class="df_sb">
+      <QueryForm v-model="filters" :query-form-config="queryQueueUpConfig" @handleQuery="getList(1)" @clear="clear">
+      </QueryForm>
+      <el-button @click="openSign" type="primary" style="align-self: flex-start;">杞﹁締绛惧埌</el-button>
+    </div>
+    <div class="main_content">
+      <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 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">
+        <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="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'
 export default {
-  data () {
+  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()
+    },
+    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_content {
+  background-color: #fff;
+  position: relative;
+  z-index: 999;
+  top: -10;
+  margin: -20px;
+  padding: 0 20px;
+
+  .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