From 14101bd42ce17dfb9d951d0738abe9d303fb3fe5 Mon Sep 17 00:00:00 2001
From: yangfeng <wanwan926_4@163.com>
Date: 星期一, 11 十二月 2023 10:41:39 +0800
Subject: [PATCH] 机器开机率、人员技能比饼图优化

---
 src/views/cockpitPage/components/WorkOrderProgress.vue |  231 ++++++++++++---------------------------------------------
 1 files changed, 49 insertions(+), 182 deletions(-)

diff --git a/src/views/cockpitPage/components/WorkOrderProgress.vue b/src/views/cockpitPage/components/WorkOrderProgress.vue
index 0763725..9553515 100644
--- a/src/views/cockpitPage/components/WorkOrderProgress.vue
+++ b/src/views/cockpitPage/components/WorkOrderProgress.vue
@@ -5,7 +5,7 @@
         <img src="/cockpitPage/work-order-top.png" alt="" />
         <div class="top-title">
           <span>宸ュ崟杩涘害缁熻</span>
-          <span class="top-rate">{{ "60%" }}</span>
+          <span class="top-rate">{{ workOrderFinishRate + "%" }}</span>
         </div>
       </div>
       <div class="table-box">
@@ -16,46 +16,47 @@
           height="100%"
         >
           <el-table-column
-            prop="workOrderId"
+            prop="Number"
             label="宸ュ崟缂栧彿"
             align="center"
             show-overflow-tooltip
           >
           </el-table-column>
           <el-table-column
-            prop="product"
+            prop="Product"
             label="浜у搧"
             align="center"
+            min-width="100"
             show-overflow-tooltip
           >
           </el-table-column>
           <el-table-column
-            prop="productSpecs"
+            prop="Scale"
             label="浜у搧瑙勬牸"
             align="center"
             show-overflow-tooltip
           >
           </el-table-column>
           <el-table-column
-            prop="amount"
+            prop="Amount"
             label="鐢熶骇鏁伴噺"
             align="center"
             show-overflow-tooltip
           >
           </el-table-column>
           <el-table-column
-            prop="planTime"
+            prop="PlanTime"
             label="璁″垝鏃堕棿"
             align="center"
             min-width="100"
             show-overflow-tooltip
           >
           </el-table-column>
-          <el-table-column label="瀹屾垚杩涘害" align="center" min-width="160">
+          <el-table-column label="瀹屾垚杩涘害" align="center" min-width="130">
             <template slot-scope="scope">
               <div class="progerss-bg">
                 <div
-                  v-for="item in scope.row.completeProgerss"
+                  v-for="(item, index) in scope.row.completeProgerss"
                   class="progerss"
                   :class="
                     item.status == 1
@@ -71,11 +72,20 @@
               </div>
             </template>
           </el-table-column>
-          <el-table-column label="寤舵湡棰勮" align="center">
+          <el-table-column label="寤舵湡棰勮" align="center" width="90">
             <template slot-scope="scope">
-              <div v-show="scope.row.delayWarning > 0" class="round-view">
-                <div class="round"></div>
-                <div class="title">{{ scope.row.delayWarning + "澶�" }}</div>
+              <div v-show="scope.row.DelayDays > 0" class="round-view">
+                <div class="round red-bg"></div>
+                <div class="title red-color">
+                  {{ scope.row.DelayDays > 10 ? ">10" : scope.row.DelayDays
+                  }}{{ "澶�" }}
+                </div>
+              </div>
+              <div v-show="scope.row.DelayDays < 0" class="round-view">
+                <div class="round green-bg"></div>
+                <div class="title green-color">
+                  {{ Math.abs(scope.row.DelayDays) + "澶�" }}
+                </div>
               </div>
             </template>
           </el-table-column>
@@ -88,172 +98,18 @@
 <script>
 export default {
   components: {},
-  props: {},
+  props: {
+    tableData: {
+      type: Array,
+      default: () => [],
+    },
+    workOrderFinishRate: {
+      type: String,
+      default: "",
+    },
+  },
   data() {
-    return {
-      tableData: [
-        {
-          workOrderId: "A5435",
-          product: "浜у搧1",
-          productSpecs: "瑙勬牸",
-          amount: "2000",
-          planTime: "02-23~05-23",
-          completeProgerss: [
-            { status: 1 },
-            { status: 1 },
-            { status: 2 },
-            { status: 0 },
-          ],
-          delayWarning: 3,
-        },
-        {
-          workOrderId: "A5435",
-          product: "浜у搧1",
-          productSpecs: "瑙勬牸",
-          amount: "2000",
-          planTime: "02-23~05-23",
-          completeProgerss: [
-            { status: 1 },
-            { status: 1 },
-            { status: 2 },
-            { status: 0 },
-          ],
-          delayWarning: 0,
-        },
-        {
-          workOrderId: "A5435",
-          product: "浜у搧1",
-          productSpecs: "瑙勬牸",
-          amount: "2000",
-          planTime: "02-23~05-23",
-          completeProgerss: [
-            { status: 1 },
-            { status: 1 },
-            { status: 1 },
-            { status: 1 },
-            { status: 1 },
-            { status: 1 },
-            { status: 1 },
-            { status: 1 },
-            { status: 2 },
-            { status: 0 },
-          ],
-          delayWarning: 2,
-        },
-        {
-          workOrderId: "A5435",
-          product: "浜у搧1",
-          productSpecs: "瑙勬牸",
-          amount: "2000",
-          planTime: "02-23~05-23",
-          completeProgerss: [
-            { status: 1 },
-            { status: 1 },
-            { status: 2 },
-            { status: 0 },
-          ],
-          delayWarning: 0,
-        },
-        {
-          workOrderId: "A5435",
-          product: "浜у搧1",
-          productSpecs: "瑙勬牸",
-          amount: "2000",
-          planTime: "02-23~05-23",
-          completeProgerss: [
-            { status: 1 },
-            { status: 1 },
-            { status: 2 },
-            { status: 0 },
-          ],
-          delayWarning: 0,
-        },
-        {
-          workOrderId: "A5435",
-          product: "浜у搧1",
-          productSpecs: "瑙勬牸",
-          amount: "2000",
-          planTime: "02-23~05-23",
-          completeProgerss: [
-            { status: 1 },
-            { status: 1 },
-            { status: 2 },
-            { status: 0 },
-          ],
-          delayWarning: 0,
-        },
-        {
-          workOrderId: "A5435",
-          product: "浜у搧1",
-          productSpecs: "瑙勬牸",
-          amount: "2000",
-          planTime: "02-23~05-23",
-          completeProgerss: [
-            { status: 1 },
-            { status: 1 },
-            { status: 2 },
-            { status: 0 },
-          ],
-          delayWarning: 0,
-        },
-        {
-          workOrderId: "A5435",
-          product: "浜у搧1",
-          productSpecs: "瑙勬牸",
-          amount: "2000",
-          planTime: "02-23~05-23",
-          completeProgerss: [
-            { status: 1 },
-            { status: 1 },
-            { status: 2 },
-            { status: 0 },
-          ],
-          delayWarning: 0,
-        },
-        {
-          workOrderId: "A5435",
-          product: "浜у搧1",
-          productSpecs: "瑙勬牸",
-          amount: "2000",
-          planTime: "02-23~05-23",
-          completeProgerss: [
-            { status: 1 },
-            { status: 1 },
-            { status: 2 },
-            { status: 0 },
-          ],
-          delayWarning: 0,
-        },
-        {
-          workOrderId: "BA5435",
-          product: "浜у搧1",
-          productSpecs: "瑙勬牸",
-          amount: "2000",
-          planTime: "02-23~05-23",
-          completeProgerss: [
-            { status: 1 },
-            { status: 1 },
-            { status: 2 },
-            { status: 0 },
-          ],
-          delayWarning: 0,
-        },
-        {
-          workOrderId: "BA5435",
-          product: "浜у搧1",
-          productSpecs: "瑙勬牸",
-          amount: "2000",
-          planTime: "02-23~05-23",
-          completeProgerss: [
-            { status: 1 },
-            { status: 1 },
-            { status: 2 },
-            { status: 0 },
-          ],
-          delayWarning: 0,
-        },
-      ],
-    };
+    return {};
   },
   mounted() {
     this.setAutoScroll();
@@ -344,14 +200,25 @@
       .round-view {
         display: flex;
         justify-content: center;
-        color: #ff0000;
+        align-items: center;
         .round {
-          width: 22px;
-          height: 22px;
-          border-radius: 11px;
-          background: #ff0000;
+          width: 16px;
+          height: 16px;
+          border-radius: 8px;
           margin-right: 5px;
         }
+        .red-bg {
+          background: #ff0000;
+        }
+        .green-bg {
+          background: #00cc00;
+        }
+        .red-color {
+          color: #ff0000;
+        }
+        .green-color {
+          color: #00cc00;
+        }
       }
     }
   }

--
Gitblit v1.8.0