From 6aa7afb555a9230a02f9999411a3d0ab71ab19f5 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 25 Nov 2022 09:25:03 +0800
Subject: [PATCH] =?UTF-8?q?update=20=E8=B4=A8=E9=87=8F=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/QualityManager/HomePage.vue         | 85 ++++++++++++-------
 .../charts/PlFaultAnalysisPieChart.vue        | 11 ++-
 .../components/charts/newLineStack.vue        | 60 ++++---------
 src/views/QualityManager/mockData.js          | 62 +++++++-------
 4 files changed, 110 insertions(+), 108 deletions(-)

diff --git a/src/views/QualityManager/HomePage.vue b/src/views/QualityManager/HomePage.vue
index 47eaea9..c14f912 100644
--- a/src/views/QualityManager/HomePage.vue
+++ b/src/views/QualityManager/HomePage.vue
@@ -137,7 +137,7 @@
                             :class="{ 'pl-select__active': plMode === 'a' }"
                             @click="
                               plMode = 'a'
-                              chosenDatalist = quexianDatalist[0]
+                              chosenDatalist = getFaultDataList()  
                             "
                           >
                             A
@@ -146,7 +146,7 @@
                             :class="{ 'pl-select__active': plMode === 'b' }"
                             @click="
                               plMode = 'b'
-                              chosenDatalist = quexianDatalist[1]
+                              chosenDatalist = getFaultDataList()
                             "
                           >
                             B
@@ -157,7 +157,7 @@
                             :class="{ 'date-select__active': dateMode === 'day' }"
                             @click="
                               dateMode = 'day'
-                              chosenDatalist = quexianDatalist[2]
+                              chosenDatalist = getFaultDataList()
                             "
                           >
                             日
@@ -166,7 +166,7 @@
                             :class="{ 'date-select__active': dateMode === 'month' }"
                             @click="
                               dateMode = 'month'
-                              chosenDatalist = quexianDatalist[3]
+                              chosenDatalist = getFaultDataList()
                             "
                           >
                             月
@@ -178,15 +178,26 @@
                       <span
                         style="display: inline-block; font-size: calc(10px * var(--beilv)); color: #fffc; position: absolute; top: calc(48px * var(--beilv)); left: calc(16px * var(--beilv));"
                       >
-                        单位: 千片
+                        <!--单位千片和单位片 -->
+                        {{ unit }}
                       </span>
-                      <pl-fault-analysis-pie-chart :data-list="chosenDatalist" />
+                      <!-- data-period 是指数据是月数据还是日数据 -->
+                      <pl-fault-analysis-pie-chart :data-list="chosenDatalist" :data-period="dateMode" />
                     </div>
                   </techy-box>
                 </div>
                 <div class="" style="width: calc(400px * var(--beilv)); flex: 1;">
                   <techy-box class="" style="padding: 0 calc(16px * var(--beilv));">
-                    <productionRateHeader @update-data="obj => { dataUpdateToken = obj.str; dateMode2 = obj.mode }">产品成品率</productionRateHeader>
+                    <productionRateHeader
+                      @update-data="
+                        obj => {
+                          dataUpdateToken = obj.str
+                          dateMode2 = obj.mode
+                        }
+                      "
+                    >
+                      产品成品率
+                    </productionRateHeader>
                     <div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">
                       <new-line-stack :data-update-token="dataUpdateToken" :mode="dateMode2" />
                     </div>
@@ -289,37 +300,37 @@ export default {
   },
   data() {
     const quexianDatalist = [
-      [
+      [ // 月a
+        { value: 5.21, name: '破片' },
+        { value: 3.2, name: '崩边' },
+        { value: 4.12, name: '脏污' },
+        { value: 2.61, name: '划擦伤' },
+        { value: 0.96, name: '崩孔' },
+        { value: 2.2, name: '其他' }
+      ],
+      [ // 月b
         { value: 4.34, name: '破片' },
         { value: 3.4, name: '崩边' },
         { value: 4.1, name: '脏污' },
         { value: 2.4, name: '划擦伤' },
-        { value: 0.23, name: '崩孔' },
+        { value: 0.32, name: '崩孔' },
         { value: 2.14, name: '其他' }
       ],
-      [
-        { value: 4.17, name: '破片' },
-        { value: 3.6, name: '崩边' },
-        { value: 4, name: '脏污' },
-        { value: 2.2, name: '划擦伤' },
-        { value: 0.2, name: '崩孔' },
-        { value: 1.9, name: '其他' }
+      [ // 日a
+        { value: 184, name: '破片' },
+        { value: 110, name: '崩边' },
+        { value: 163, name: '脏污' },
+        { value: 96, name: '划擦伤' },
+        { value: 22, name: '崩孔' },
+        { value: 74, name: '其他' }
       ],
-      [
-        { value: 3.33, name: '破片' },
-        { value: 3, name: '崩边' },
-        { value: 4.3, name: '脏污' },
-        { value: 2.1, name: '划擦伤' },
-        { value: 1, name: '崩孔' },
-        { value: 1.8, name: '其他' }
-      ],
-      [
-        { value: 2.7, name: '破片' },
-        { value: 1.56, name: '崩边' },
-        { value: 2.3, name: '脏污' },
-        { value: 1.2, name: '划擦伤' },
-        { value: 0.23, name: '崩孔' },
-        { value: 2, name: '其他' }
+      [ // 日b
+        { value: 172, name: '破片' },
+        { value: 122, name: '崩边' },
+        { value: 162, name: '脏污' },
+        { value: 82, name: '划擦伤' },
+        { value: 15, name: '崩孔' },
+        { value: 74, name: '其他' }
       ]
     ]
 
@@ -385,7 +396,10 @@ export default {
     }
   },
   computed: {
-    ...mapGetters(['sidebar'])
+    ...mapGetters(['sidebar']),
+    unit() {
+      return this.dateMode === 'month' ? '单位: 千片' : '单位: 片'
+    }
   },
   methods: {
     changeFullScreen() {
@@ -397,6 +411,13 @@ export default {
         return false
       }
       screenfull.toggle(this.$refs['cockpit-container-quality'])
+    },
+    getFaultDataList() {
+      const { dateMode, plMode, quexianDatalist } = this
+      if (dateMode === 'month' && plMode === 'a') return quexianDatalist[0]
+      else if (dateMode === 'month' && plMode === 'b') return quexianDatalist[1]
+      else if (dateMode === 'day' && plMode === 'a') return quexianDatalist[2]
+      else if (dateMode === 'day' && plMode === 'b') return quexianDatalist[3]
     }
   }
 }
diff --git a/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue b/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue
index 04e401f..52304ef 100644
--- a/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue
+++ b/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue
@@ -17,6 +17,10 @@ export default {
     dataList: {
       type: Array,
       required: true
+    },
+    dataPeriod: {
+      type: String,
+      default: 'month'
     }
   },
   data() {
@@ -309,7 +313,12 @@ export default {
       const legnedTop = this.calcFontsize(64 /** px*/)
       const legendTopRate = this.calcFontsize(30 /** % */)
 
-      this.configs.title.text = this.dataList.reduce((prev, curr) => prev + curr.value * 1000, 0)
+      this.configs.title.text =
+        this.dataPeriod === 'month'
+          ? // 如果是月数据，单位为 千片
+            this.dataList.reduce((prev, curr) => prev + curr.value * 1000, 0)
+          : // 如果是日数据，单位为 片
+            this.dataList.reduce((prev, curr) => prev + curr.value, 0)
       this.configs.title.textStyle.fontSize = fs20
       this.configs.title.subtextStyle.fontSize = fs13
 
diff --git a/src/views/QualityManager/components/charts/newLineStack.vue b/src/views/QualityManager/components/charts/newLineStack.vue
index 6b3e80d..567b187 100644
--- a/src/views/QualityManager/components/charts/newLineStack.vue
+++ b/src/views/QualityManager/components/charts/newLineStack.vue
@@ -5,6 +5,7 @@
 <script>
 import echarts from 'echarts'
 import resize from '@/views/OperationalOverview/components/mixins/resize'
+import { Random } from 'mockjs'
 
 class ChartOption {
   constructor() {
@@ -66,7 +67,7 @@ class ChartOption {
       {
         name: '成品率          ',
         type: 'value',
-        min: 'dataMin',
+        min: '80',
         splitNumber: 4,
         nameGap: 16,
         nameTextStyle: {
@@ -106,6 +107,7 @@ class ChartOption {
         name: 'A1下片机',
         type: 'line',
         symbol: 'none',
+        smooth: true,
         areaStyle: {
           // color: 'rgba(50,145,152,0.5)'
           color: {
@@ -134,26 +136,16 @@ class ChartOption {
           this.mode === 'month'
             ? Array(30)
                 .fill(1)
-                .map(_ => {
-                  let v = Math.floor(Math.random() * 100)
-                  while (v < 80) {
-                    v = Math.floor(Math.random() * 100)
-                  }
-                  return v
-                })
-            : [11, 199, 140, 63, 185, 5, 78].map(_ => {
-                let v = Math.floor(Math.random() * 100)
-                while (v < 80) {
-                  v = Math.floor(Math.random() * 100)
-                }
-                return v
-              })
+                .map(_ => Random.integer(94, 99))
+            : Array(7)
+                .fill(1)
+                .map(_ => Random.integer(94, 99))
       },
       {
         name: '磨边机',
         type: 'line',
         symbol: 'none',
-
+        smooth: true,
         areaStyle: {
           // color: 'rgba(50,145,152,0.5)'
           color: {
@@ -182,20 +174,10 @@ class ChartOption {
           this.mode === 'month'
             ? Array(30)
                 .fill(1)
-                .map(_ => {
-                  let v = Math.floor(Math.random() * 100)
-                  while (v < 80) {
-                    v = Math.floor(Math.random() * 100)
-                  }
-                  return v
-                })
-            : [11, 199, 140, 63, 185, 5, 78].map(_ => {
-                let v = Math.floor(Math.random() * 100)
-                while (v < 80) {
-                  v = Math.floor(Math.random() * 100)
-                }
-                return v
-              })
+                .map(_ => Random.integer(94, 99))
+            : Array(7)
+                .fill(1)
+                .map(_ => Random.integer(94, 99))
       }
     ]
   }
@@ -278,20 +260,10 @@ export default {
           this.mode === 'month'
             ? Array(30)
                 .fill(1)
-                .map(_ => {
-                  let v = Math.floor(Math.random() * 100)
-                  while (v < 80) {
-                    v = Math.floor(Math.random() * 100)
-                  }
-                  return v
-                })
-            : [11, 199, 140, 63, 185, 5, 78].map(_ => {
-                let v = Math.floor(Math.random() * 100)
-                while (v < 80) {
-                  v = Math.floor(Math.random() * 100)
-                }
-                return v
-              })
+                .map(_ => Random.integer(94, 99))
+            : Array(7)
+                .fill(1)
+                .map(_ => Random.integer(94, 99))
       })
 
       if (this.chart) this.chart.setOption(this.configs)
diff --git a/src/views/QualityManager/mockData.js b/src/views/QualityManager/mockData.js
index 6bdbbdb..ea4da53 100644
--- a/src/views/QualityManager/mockData.js
+++ b/src/views/QualityManager/mockData.js
@@ -39,34 +39,34 @@ console.log('is component?', PriorityComponent)
 
 export const qualityTableProps = [
   { label: '工序名称', prop: 'wsName', align: 'center', 'min-width': 55 },
-  { label: '所属产线', prop: 'pl', align: 'center', 'min-width': 55 },
+  { label: '所属产线', prop: 'pl', align: 'center', 'min-width': 50 },
   { label: '异常内容', align: 'center', prop: 'content', 'min-width': 50 },
   { label: '班组', prop: 'team', align: 'center', 'min-width': 45 },
   { label: '时间', prop: 'time', align: 'center' },
-  { label: '优先级', prop: 'priority', align: 'center', subcomponent: PriorityComponent, 'min-width': 55 }
+  { label: '优先级', prop: 'priority', align: 'center', subcomponent: PriorityComponent, 'min-width': 50 }
 ]
 
 export const qualityDatalist = [
-  { 'wsName': '原片', 'pl': 'B', 'content': '透过率', 'team': '白班', 'time': '2022-11-18 13:36:26', 'priority': 3 },
-  { 'wsName': '下片铺纸', 'pl': 'B', 'content': '完整性', 'team': '白班', 'time': '2022-11-18 11:35:02', 'priority': 2 },
-  { 'wsName': '镀膜', 'pl': 'A', 'content': '完整性', 'team': '夜班', 'time': '2022-11-18 13:10:02', 'priority': 1 },
-  { 'wsName': '丝印', 'pl': 'A', 'content': '透过率', 'team': '白班', 'time': '2022-11-18 02:16:20', 'priority': 2 },
-  { 'wsName': '上片磨边', 'pl': 'A', 'content': '透过率', 'team': '夜班', 'time': '2022-11-18 00:03:54', 'priority': 3 },
-  { 'wsName': '丝印', 'pl': 'B', 'content': '完整性', 'team': '夜班', 'time': '2022-11-18 09:25:49', 'priority': 1 },
-  { 'wsName': '上片磨边', 'pl': 'A', 'content': '完整性', 'team': '夜班', 'time': '2022-11-18 13:54:45', 'priority': 3 },
-  { 'wsName': '包装', 'pl': 'B', 'content': '完整性', 'team': '白班', 'time': '2022-11-18 03:47:23', 'priority': 1 },
-  { 'wsName': '包装', 'pl': 'B', 'content': '透过率', 'team': '夜班', 'time': '2022-11-18 02:46:21', 'priority': 1 },
-  { 'wsName': '上片磨边', 'pl': 'B', 'content': '完整性', 'team': '夜班', 'time': '2022-11-18 06:31:10', 'priority': 1 },
-  { 'wsName': '下片铺纸', 'pl': 'A', 'content': '完整性', 'team': '白班', 'time': '2022-11-18 10:22:55', 'priority': 3 },
-  { 'wsName': '原片', 'pl': 'A', 'content': '完整性', 'team': '白班', 'time': '2022-11-18 03:29:08', 'priority': 2 },
-  { 'wsName': '丝印', 'pl': 'B', 'content': '透过率', 'team': '白班', 'time': '2022-11-18 09:47:06', 'priority': 1 },
-  { 'wsName': '包装', 'pl': 'B', 'content': '完整性', 'team': '夜班', 'time': '2022-11-18 06:17:27', 'priority': 1 },
-  { 'wsName': '原片', 'pl': 'A', 'content': '完整性', 'team': '夜班', 'time': '2022-11-18 00:29:26', 'priority': 2 },
-  { 'wsName': '清洗', 'pl': 'B', 'content': '完整性', 'team': '白班', 'time': '2022-11-18 10:14:27', 'priority': 2 },
-  { 'wsName': '包装', 'pl': 'A', 'content': '透过率', 'team': '白班', 'time': '2022-11-18 13:50:39', 'priority': 3 },
-  { 'wsName': ' 物流仓储', 'pl': 'A', 'content': '完整性', 'team': '夜班', 'time': '2022-11-18 09:37:44', 'priority': 2 },
-  { 'wsName': '清洗', 'pl': 'A', 'content': '透过率', 'team': '白班', 'time': '2022-11-18 03:53:47', 'priority': 2 },
-  { 'wsName': '原片', 'pl': 'A', 'content': '透过率', 'team': '白班', 'time': '2022-11-18 08:01:02', 'priority': 3 }]
+  { 'wsName': '原片', 'pl': 'B', 'content': '透光率', 'team': '白班', 'time': '2022-11-18 13:36:26', 'priority': 3 },
+  { 'wsName': '下片铺纸', 'pl': 'B', 'content': '抗压抗冲击测试', 'team': '白班', 'time': '2022-11-18 11:35:02', 'priority': 2 },
+  { 'wsName': '镀膜', 'pl': 'A', 'content': '抗压抗冲击测试', 'team': '夜班', 'time': '2022-11-18 13:10:02', 'priority': 1 },
+  { 'wsName': '丝印', 'pl': 'A', 'content': '透光率', 'team': '白班', 'time': '2022-11-18 02:16:20', 'priority': 2 },
+  { 'wsName': '上片磨边', 'pl': 'A', 'content': '透光率', 'team': '夜班', 'time': '2022-11-18 00:03:54', 'priority': 3 },
+  { 'wsName': '丝印', 'pl': 'B', 'content': '抗压抗冲击测试', 'team': '夜班', 'time': '2022-11-18 09:25:49', 'priority': 1 },
+  { 'wsName': '上片磨边', 'pl': 'A', 'content': '抗压抗冲击测试', 'team': '夜班', 'time': '2022-11-18 13:54:45', 'priority': 3 },
+  { 'wsName': '包装', 'pl': 'B', 'content': '抗压抗冲击测试', 'team': '白班', 'time': '2022-11-18 03:47:23', 'priority': 1 },
+  { 'wsName': '包装', 'pl': 'B', 'content': '透光率', 'team': '夜班', 'time': '2022-11-18 02:46:21', 'priority': 1 },
+  { 'wsName': '上片磨边', 'pl': 'B', 'content': '抗压抗冲击测试', 'team': '夜班', 'time': '2022-11-18 06:31:10', 'priority': 1 },
+  { 'wsName': '下片铺纸', 'pl': 'A', 'content': '抗压抗冲击测试', 'team': '白班', 'time': '2022-11-18 10:22:55', 'priority': 3 },
+  { 'wsName': '原片', 'pl': 'A', 'content': '抗压抗冲击测试', 'team': '白班', 'time': '2022-11-18 03:29:08', 'priority': 2 },
+  { 'wsName': '丝印', 'pl': 'B', 'content': '透光率', 'team': '白班', 'time': '2022-11-18 09:47:06', 'priority': 1 },
+  { 'wsName': '包装', 'pl': 'B', 'content': '抗压抗冲击测试', 'team': '夜班', 'time': '2022-11-18 06:17:27', 'priority': 1 },
+  { 'wsName': '原片', 'pl': 'A', 'content': '抗压抗冲击测试', 'team': '夜班', 'time': '2022-11-18 00:29:26', 'priority': 2 },
+  { 'wsName': '清洗', 'pl': 'B', 'content': '抗压抗冲击测试', 'team': '白班', 'time': '2022-11-18 10:14:27', 'priority': 2 },
+  { 'wsName': '包装', 'pl': 'A', 'content': '透光率', 'team': '白班', 'time': '2022-11-18 13:50:39', 'priority': 3 },
+  { 'wsName': ' 物流仓储', 'pl': 'A', 'content': '抗压抗冲击测试', 'team': '夜班', 'time': '2022-11-18 09:37:44', 'priority': 2 },
+  { 'wsName': '清洗', 'pl': 'A', 'content': '透光率', 'team': '白班', 'time': '2022-11-18 03:53:47', 'priority': 2 },
+  { 'wsName': '原片', 'pl': 'A', 'content': '透光率', 'team': '白班', 'time': '2022-11-18 08:01:02', 'priority': 3 }]
 
 /** 质量异常报警 */
 
@@ -115,22 +115,22 @@ export const qualityExceptionTableProps = [
 
 export const qualityExceptionDatalist = [
   { 'pl': 'A', 'eq': '打孔', 'wsName': '打孔', 'content': '完整性', 'time': '2022-11-18 11:30:01', 'priority': 3 },
-  { 'pl': 'B', 'eq': '固化', 'wsName': '固化', 'content': '透过率', 'time': '2022-11-18 07:20:35', 'priority': 1 },
-  { 'pl': 'B', 'eq': '钢后清洗机', 'wsName': '钢后清洗机', 'content': '透过率', 'time': '2022-11-18 09:16:21', 'priority': 2 },
-  { 'pl': 'A', 'eq': '一镀', 'wsName': '一镀', 'content': '透过率', 'time': '2022-11-18 04:57:10', 'priority': 3 },
+  { 'pl': 'B', 'eq': '固化', 'wsName': '固化', 'content': '透光率', 'time': '2022-11-18 07:20:35', 'priority': 1 },
+  { 'pl': 'B', 'eq': '钢后清洗机', 'wsName': '钢后清洗机', 'content': '透光率', 'time': '2022-11-18 09:16:21', 'priority': 2 },
+  { 'pl': 'A', 'eq': '一镀', 'wsName': '一镀', 'content': '透光率', 'time': '2022-11-18 04:57:10', 'priority': 3 },
   { 'pl': 'B', 'eq': '固化', 'wsName': '固化', 'content': '完整性', 'time': '2022-11-18 08:26:43', 'priority': 2 },
   { 'pl': 'B', 'eq': '磨边后清洗机', 'wsName': '磨边后清洗机', 'content': '完整性', 'time': '2022-11-18 04:09:39', 'priority': 2 },
-  { 'pl': 'B', 'eq': '下片', 'wsName': '下片', 'content': '透过率', 'time': '2022-11-18 01:06:05', 'priority': 2 },
-  { 'pl': 'A', 'eq': '一镀', 'wsName': '一镀', 'content': '透过率', 'time': '2022-11-18 05:06:36', 'priority': 1 },
+  { 'pl': 'B', 'eq': '下片', 'wsName': '下片', 'content': '透光率', 'time': '2022-11-18 01:06:05', 'priority': 2 },
+  { 'pl': 'A', 'eq': '一镀', 'wsName': '一镀', 'content': '透光率', 'time': '2022-11-18 05:06:36', 'priority': 1 },
   { 'pl': 'B', 'eq': '冷却', 'wsName': '冷却', 'content': '完整性', 'time': '2022-11-18 07:11:45', 'priority': 3 },
   { 'pl': 'A', 'eq': '磨边后清洗机', 'wsName': '磨边后清洗机', 'content': '完整性', 'time': '2022-11-18 11:40:37', 'priority': 3 },
   { 'pl': 'A', 'eq': '冷却', 'wsName': '冷却', 'content': '完整性', 'time': '2022-11-18 10:41:54', 'priority': 1 },
-  { 'pl': 'B', 'eq': '预热', 'wsName': '预热', 'content': '透过率', 'time': '2022-11-18 04:10:00', 'priority': 1 },
+  { 'pl': 'B', 'eq': '预热', 'wsName': '预热', 'content': '透光率', 'time': '2022-11-18 04:10:00', 'priority': 1 },
   { 'pl': 'B', 'eq': '钢化', 'wsName': '钢化', 'content': '完整性', 'time': '2022-11-18 09:23:40', 'priority': 1 },
-  { 'pl': 'A', 'eq': '冷却', 'wsName': '冷却', 'content': '透过率', 'time': '2022-11-18 05:28:05', 'priority': 2 },
+  { 'pl': 'A', 'eq': '冷却', 'wsName': '冷却', 'content': '透光率', 'time': '2022-11-18 05:28:05', 'priority': 2 },
   { 'pl': 'B', 'eq': '上片', 'wsName': '上片', 'content': '完整性', 'time': '2022-11-18 06:24:57', 'priority': 3 },
   { 'pl': 'B', 'eq': '固化', 'wsName': '固化', 'content': '完整性', 'time': '2022-11-18 02:48:28', 'priority': 3 },
   { 'pl': 'B', 'eq': '磨边后清洗机', 'wsName': '磨边后清洗机', 'content': '完整性', 'time': '2022-11-18 13:06:35', 'priority': 1 },
-  { 'pl': 'B', 'eq': '打孔', 'wsName': '打孔', 'content': '透过率', 'time': '2022-11-18 11:49:59', 'priority': 1 },
-  { 'pl': 'B', 'eq': '一镀', 'wsName': '一镀', 'content': '透过率', 'time': '2022-11-18 12:32:20', 'priority': 2 },
+  { 'pl': 'B', 'eq': '打孔', 'wsName': '打孔', 'content': '透光率', 'time': '2022-11-18 11:49:59', 'priority': 1 },
+  { 'pl': 'B', 'eq': '一镀', 'wsName': '一镀', 'content': '透光率', 'time': '2022-11-18 12:32:20', 'priority': 2 },
   { 'pl': 'B', 'eq': '丝印', 'wsName': '丝印', 'content': '完整性', 'time': '2022-11-18 12:45:49', 'priority': 3 }]