From a11bc1bed7953b88213330582c2085f60b5a73b1 Mon Sep 17 00:00:00 2001
From: liukangdong <898885815@qq.com>
Date: 星期三, 12 六月 2024 15:01:56 +0800
Subject: [PATCH] Merge branch 'master' of http://139.186.142.91:10010/r/productDev/dmvisit

---
 admin/src/views/platform/index.vue |  487 +++++++++++++++++++++++++++++++++++++++++------------
 1 files changed, 371 insertions(+), 116 deletions(-)

diff --git a/admin/src/views/platform/index.vue b/admin/src/views/platform/index.vue
index d25f751..85fa291 100644
--- a/admin/src/views/platform/index.vue
+++ b/admin/src/views/platform/index.vue
@@ -1,8 +1,8 @@
 <template>
   <div class="main_app">
-    <div class="df_ac mb20">
-      <el-select v-model="currentPlatform" class="w300">
-        <el-option v-for="item in platformList" :key="item.id"></el-option>
+    <div class="mb20">
+      <el-select v-model="platformId" @change="getList()">
+        <el-option v-for="item in PlatformList" :key="item.id" :value="item.id" :label="item.name" />
       </el-select>
       <el-button type="primary" class="ml20" @click="handleSet"
         >閰嶇疆鏈堝彴</el-button
@@ -12,47 +12,68 @@
     <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 class="left">
+            <div class="status mr10">浣滀笟涓�</div>
+            <div class="name">6鍙锋湀鍙�</div>
+            <div class="ite">
+              <span class="placeholder9">浣滀笟锛�</span><span>1</span>
+            </div>
+            <div class="ite">
+              <span class="placeholder9">浣滀笟锛�</span><span>1</span>
+            </div>
+            <div class="ite">
+              <span class="placeholder9">浣滀笟锛�</span><span class="red">1</span>
+            </div>
           </div>
-          <el-button type="primary">鍙彿</el-button>
+          <el-button type="primary" @click="handleQueuing()">鍙彿</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 class="list">
+          <div class="info" v-for="j in 3">
+            <div class="line">
+              <div class="left">
+                <span class="plate">鐨朅12122</span>
               </div>
-              <div>
-                <span>鎬昏繍杈撻噺</span
-                ><span class="ml10 placeholder9">3000涓囨敮</span
-                ><span class="primaryColor ml10 pointer" @click="isShowDetail = true">杩愬崟璇︽儏</span>
+              <div class="right">
+                <span class="green">浣滀笟涓�</span>
+                <span class="green ml20">23鍒嗛挓26绉�</span>
               </div>
             </div>
-            <div class="right">
-              <el-button type="primary" @click="handleFinish()"
-                >浣滀笟瀹屾垚</el-button
-              >
-              <el-button plain>杞Щ鏈堝彴</el-button>
-              <el-button plain>寮傚父鎸傝捣</el-button>
+            <div class="line">
+              <div class="ite">
+                <span>杩愯緭鍗曞彿锛�</span>
+                <span>202020</span>
+              </div>
+              <div class="ite">
+                <span>椹鹃┒鍛橈細</span>
+                <span>202020</span>
+              </div>
+              <div class="ite">
+                <span>鎵嬫満鍙凤細</span>
+                <span>202020</span>
+              </div>
+              <div class="ite">
+                <span>鎬昏繍杈撻噺锛�</span>
+                <span>202020</span>
+              </div>
+              <div class="ite" style="width: 66.6%">
+                <span>杩愯緭鍏徃锛�</span>
+                <span>20202dasd鐜╁効鐜╁効鐜╁効棰濆 棰濆0</span>
+              </div>
+              <div class="ite"></div>
+            </div>
+            <div class="line">
+              <div class="left">
+                <span class="primaryColor pointer" @click="isShowDetail = true"
+                  >杩愬崟璇︽儏</span
+                >
+              </div>
+              <div class="right">
+                <el-button type="primary" @click="handleFinish()"
+                  >浣滀笟瀹屾垚</el-button
+                >
+                <el-button plain>杞Щ鏈堝彴</el-button>
+                <el-button plain>寮傚父鎸傝捣</el-button>
+              </div>
             </div>
           </div>
         </div>
@@ -69,7 +90,7 @@
         <div class="mb20">
           <div class="title">鍏ュ簱鏈堝彴缁�</div>
           <div class="list">
-            <div class="item">1鍙锋湀鍙�</div>
+            <div class="item active">1鍙锋湀鍙�</div>
             <div class="item">2鍙锋湀鍙�</div>
             <div class="item">1鍙锋湀鍙�</div>
             <div class="item">2鍙锋湀鍙�</div>
@@ -93,42 +114,38 @@
     <!-- 杩愬崟璇︽儏 -->
     <el-dialog
       title="杩愬崟璇︽儏"
+      center
       :visible.sync="isShowDetail"
       width="420px"
     >
       <div class="detail_modal">
         <div class="head">
-          <div class="line">
-            <span class="ccc">杩愯緭鍗曞彿</span>
-            <span>28282</span>
-          </div>
-          <div class="line">
-            <span class="ccc">杩愯緭杞﹁締</span>
-            <span>鐨朅12122</span>
-          </div>
-          <div class="line">
-            <span class="ccc">椹鹃┒鍛�</span>
-            <span>鐜嬪痉鍙�</span>
-            <span>1888888</span>
-          </div>
-          <div class="line">
-            <span class="ccc">鎬昏繍杈撻噺</span>
-            <span>28282涓囨敮</span>
+          <div class="plate">鐨朅12122</div>
+          <div class="list">
+            <div class="item">
+              <span>杩愯緭鍗曞彿锛�</span>
+              <span>22222</span>
+            </div>
+            <div class="item">
+              <span>鎬昏繍杈撻噺锛�</span>
+              <span>22222</span>
+            </div>
+            <div class="item">
+              <span>椹鹃┒鍛橈細</span>
+              <span>22222</span>
+            </div>
           </div>
         </div>
+        <div class="title">鍚堝悓鍒楄〃</div>
         <div class="content">
           <div class="item">
-            <div class="line">
-              <div>鍚堝悓鍙凤細1292992</div>
-              <div class="address">鏀惰揣鍦帮細address</div>
-            </div>
-            <div class="line">
-              <div>鐗╂枡鍚嶇О锛氶粍灞�</div>
-              <div>鏁伴噺锛�700</div>
-            </div>
-            <div class="line">
-              <div>鐗╂枡鍚嶇О锛氶粍灞�</div>
-              <div>鏁伴噺锛�200</div>
+            <div class="contract">鍚堝悓鍙凤細1292992</div>
+            <div class="placeholder6">鏀惰揣鍦帮細address</div>
+            <div class="list">
+              <div class="line">
+                <div class="left"><span>鐗╂枡鍚嶇О锛�</span><span>榛勫北</span></div>
+                <div class="right"><span>鏁伴噺锛�</span><span>100</span></div>
+              </div>
             </div>
           </div>
         </div>
@@ -137,87 +154,214 @@
         <el-button @click="isShowDetail = false">鍏抽棴</el-button>
       </span>
     </el-dialog>
+    <!--  -->
+    <el-drawer
+      title="鏈堝彴鍙彿-xx鍙锋湀鍙�"
+      :visible.sync="isShowQueuing"
+      size="720px"
+    >
+      <div class="queuing_modal">
+        <div class="df_ac mb20">
+          <span>鎼滅储杞﹁締锛�</span>
+          <el-input
+            class="flex1 mr20"
+            v-model="queuingForm.aa"
+            placeholder="璇疯緭鍏ヨ溅鐗屽彿"
+          ></el-input>
+          <el-button type="primary">鏌ユ壘</el-button>
+          <el-button>閲嶇疆</el-button>
+        </div>
+        <div class="list">
+          <div class="item">
+            <div class="head df_sb">
+              <div class="plate">鐨朅12122</div>
+              <div class="status">宸茬鍒�</div>
+            </div>
+            <div class="info">
+              <div class="ite">
+                <span>杩愯緭鍗曞彿锛�</span>
+                <span>12312</span>
+              </div>
+              <div class="ite">
+                <span>椹鹃┒鍛橈細</span>
+                <span>12312</span>
+              </div>
+              <div class="ite">
+                <span>鎵嬫満鍙凤細</span>
+                <span>12312</span>
+              </div>
+              <div class="ite">
+                <span>鎬昏繍杈撻噺锛�</span>
+                <span>12312</span>
+              </div>
+              <div class="ite" style="width: 66%">
+                <span>杩愯緭鍏徃锛�</span>
+                <span>12312</span>
+              </div>
+            </div>
+            <div class="footer df_sb">
+              <div class="detail">杩愬崟璇︽儏</div>
+              <el-button type="primary">鍙彿</el-button>
+            </div>
+          </div>
+        </div>
+        <el-button class="mt30" @click="isShowQueuing = false">鍏抽棴</el-button>
+      </div>
+    </el-drawer>
   </div>
 </template>
 
 <script>
+import { getPlatform, getPlatformJob } from '@/api'
 export default {
-  data() {
+  data () {
     return {
-      currentPlatform: '',
-      platformList: [],
+      platformId: '',
+      PlatformList: [],
+      dataList: [],
 
       isShowSet: false, // 鏈堝彴閰嶇疆
       setParam: {},
       isShowDetail: false, // 杩愬崟璇︽儏
-      detail: {}
+      detail: {},
+      isShowQueuing: false,
+      queuingForm: {}
     }
   },
+  created () {
+    this.getPlatList()
+    this.getList()
+  },
   methods: {
-    handleFinish(item) {
+    handleQueuing (row) {
+      this.isShowQueuing = true
+    },
+    getList () {
+      const { platformId } = this
+      getPlatformJob({
+        model: { platformId }
+      }).then(res => {
+        this.dataList = res.records
+      })
+    },
+    handleFinish (item) {
       this.$confirm('楂樻灦搴�6鍙锋湀鍙� 鐨朅12345 浣滀笟缁撴潫', '娓╅Θ鎻愮ず', {
         confirmButtonText: '纭畾',
         cancelButtonText: '鍙栨秷',
         type: 'warning'
       })
     },
-    handleSet() {
+    getPlatList () {
+      getPlatform({
+        model: {}
+      }).then(res => {
+        this.PlatformList = res.records
+      })
+    },
+    handleSet () {
       this.isShowSet = true
     },
-    setReset() { },
-    setSub() { }
+    setReset () { },
+    setSub () { }
   }
 }
 </script>
 
 <style lang="scss" scoped>
+@import "@/assets/style/variables.scss";
 .platform_list {
   .item {
-    padding: 16px 24px;
+    /* padding: 16px 24px; */
+    background: #ffffff;
     border-radius: 2px;
-    border: 2px solid #cccccc;
+    border: 1px solid #dfe2e8;
     margin-bottom: 12px;
     .head {
       display: flex;
       justify-content: space-between;
-      .name {
-        font-size: 16px;
-      }
-      .status {
+      align-items: center;
+      height: 50px;
+      background: linear-gradient(270deg, #ffffff 0%, #ebf6f7 100%);
+      border-radius: 2px 2px 0px 0px;
+      padding: 0 28px;
+      .left {
         flex: 1;
-        margin-left: 50px;
-        span {
+        display: flex;
+        align-items: center;
+        .name {
+          font-size: 16px;
+          margin-right: 50px;
+        }
+        .status {
+          line-height: 25px;
+          height: 25px;
+          padding: 0 4px;
+          background: #00ba67;
+          border-radius: 2px;
+          color: #ffffff;
+        }
+        .ite {
           margin-right: 30px;
         }
       }
     }
-    .info {
+    .list {
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: space-between;
       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 {
+      padding: 16px;
+      .info {
+        background: #effbf5;
+        border-radius: 2px;
+        border: 1px solid #dfe2e8;
+        padding: 16px;
+        border-radius: 2px;
+        margin-bottom: 10px;
+        width: 30%;
+        .line {
           display: flex;
           align-items: center;
+          justify-content: space-between;
+          flex-wrap: wrap;
+          margin-bottom: 6px;
+          span {
+            &:nth-child(1) {
+              color: #999999;
+            }
+          }
+          .ite {
+            width: 33.3%;
+            margin-top: 8px;
+          }
+          .left {
+            .plate {
+              font-size: 15px;
+              color: #111111;
+              padding: 4px 5px;
+              font-weight: 700;
+              border: 1px solid #279baa;
+              background-color: #fff;
+            }
+          }
+          .right {
+            display: flex;
+            align-items: center;
+          }
         }
       }
     }
   }
 }
 
+.main_head {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  .tabs {
+    flex: 1;
+  }
+}
 /*  */
 .set_modal {
   .title {
@@ -233,33 +377,144 @@
       cursor: pointer;
       width: 30%;
       height: 32px;
-      background-color: #d9d9d9;
-      border: 1px solid #4d99a7;
+      border: 1px solid #dfe2e8;
       display: flex;
       justify-content: center;
       align-items: center;
-      border-radius: 6px;
+      border-radius: 2px;
       margin-bottom: 12px;
+    }
+    .active {
+      background: rgba(39, 155, 170, 0.06);
+      border: 1px solid #279baa;
+      color: #279baa;
     }
   }
 }
 /*  */
 .detail_modal {
   font-size: 12px;
+  color: #282828;
   .head {
-    border-bottom: 1px solid #999999;
-  }
-  .item {
-    border-bottom: 1px solid #999999;
-  }
-  .line {
-    display: flex;
-    justify-content: space-between;
-    .ccc{
-      color: #999999;
+    background: rgba(39, 155, 170, 0.05);
+    border-radius: 4px;
+    border: 1px solid #dfe2e8;
+    padding: 16px;
+    .plate {
+      width: 90px;
+      text-align: center;
+      font-size: 15px;
+      color: #111111;
+      padding: 4px 5px;
+      font-weight: 700;
+      border: 1px solid #279baa;
+      background-color: #fff;
     }
-    .address {
-      margin-right: 30px;
+    .list {
+      display: flex;
+      flex-wrap: wrap;
+      margin-top: 16px;
+      .item {
+        width: 50%;
+        margin-bottom: 8px;
+        span {
+          &:nth-child(1) {
+            color: #666666;
+          }
+        }
+      }
+    }
+  }
+  .title {
+    margin: 16px 0;
+    font-weight: 500;
+    font-size: 16px;
+    color: #222222;
+  }
+  .content {
+    .item {
+      border-radius: 4px;
+      border: 1px solid #dfe2e8;
+      padding: 16px;
+      .list {
+        background: #f7f7f7;
+        border-radius: 4px;
+        padding: 12px 16px;
+        margin-top: 10px;
+      }
+      .contract {
+        font-weight: 500;
+        font-size: 15px;
+        color: #279baa;
+        margin-bottom: 4px;
+      }
+      .line {
+        display: flex;
+        margin-bottom: 8px;
+        &:nth-last-child(1) {
+          margin: 0;
+        }
+        div {
+          span {
+            &:nth-child(1) {
+              color: #666666;
+            }
+          }
+        }
+        .left {
+          flex: 6;
+        }
+        .right {
+          flex: 4;
+        }
+      }
+    }
+  }
+}
+/*  */
+.queuing_modal {
+  padding: 10px 30px;
+  .list {
+    .item {
+      background: #f4fafb;
+      border-radius: 2px;
+      border: 1px solid #dfe2e8;
+      margin-bottom: 10px;
+      padding: 16px;
+      .head {
+        margin-bottom: 15px;
+        .plate {
+          width: 90px;
+          text-align: center;
+          font-size: 15px;
+          color: #111111;
+          padding: 4px 5px;
+          font-weight: 700;
+          border: 1px solid #279baa;
+          background-color: #fff;
+        }
+        .status {
+          color: $primaryColor;
+        }
+      }
+      .info {
+        display: flex;
+        flex-wrap: wrap;
+        .ite {
+          width: 33.3%;
+          margin-bottom: 8px;
+          span {
+            &:nth-child(1) {
+              color: #666666;
+            }
+          }
+        }
+      }
+      .footer {
+        .detail {
+          color: $primaryColor;
+        }
+      }
     }
   }
 }

--
Gitblit v1.9.3