From 97ee3a9a4c4dd3b62b780084451da4cb7e9d606e Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Wed, 23 Nov 2022 09:55:29 +0800
Subject: [PATCH 01/28] =?UTF-8?q?update=203d=20=E5=AE=8C=E6=88=90=E5=BA=A6?=
 =?UTF-8?q?=E9=A2=9C=E8=89=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/LeftContentOrder.vue           |  6 +--
 .../RightContentRealtimeProduction.vue        | 44 ++++++++++++++++++-
 2 files changed, 44 insertions(+), 6 deletions(-)

diff --git a/src/views/3DOverview/components/LeftContentOrder.vue b/src/views/3DOverview/components/LeftContentOrder.vue
index d6d4909..677a7ae 100644
--- a/src/views/3DOverview/components/LeftContentOrder.vue
+++ b/src/views/3DOverview/components/LeftContentOrder.vue
@@ -15,9 +15,6 @@ const ProcessCircle = {
       default: () => ({})
     }
   },
-  mounted() {
-    console.log('finished', this.injectData.finished)
-  },
   methods: {},
   render: function(h) {
     return h('el-progress', {
@@ -29,7 +26,8 @@ const ProcessCircle = {
         percentage: this.injectData.finished,
         width: 14,
         'stroke-width': 2,
-        color: '#47FF27'
+        color: '#47FF27',
+        'define-back-color': '#6e6e6e' // 背景色
       },
       style: {
         color: 'blue'
diff --git a/src/views/3DOverview/components/RightContentRealtimeProduction.vue b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
index d60cf22..a647828 100644
--- a/src/views/3DOverview/components/RightContentRealtimeProduction.vue
+++ b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
@@ -187,7 +187,27 @@ export default {
               focus: 'series'
             },
             data: dianliu,
-            symbol: 'none'
+            symbol: 'none',
+            areaStyle: {
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  {
+                    offset: 0,
+                    color: '#1A99FF66' // 0% 处的颜色
+                  },
+                  {
+                    offset: 1,
+                    color: 'transparent' // 100% 处的颜色
+                  }
+                ],
+                global: false // 缺省为 false
+              }
+            }
           },
           {
             name: '产线2',
@@ -198,7 +218,27 @@ export default {
               focus: 'series'
             },
             data: dianya,
-            symbol: 'none'
+            symbol: 'none',
+            areaStyle: {
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  {
+                    offset: 0,
+                    color: '#F0D63C66' // 0% 处的颜色
+                  },
+                  {
+                    offset: 1,
+                    color: 'transparent' // 100% 处的颜色
+                  }
+                ],
+                global: false // 缺省为 false
+              }
+            }
           }
         ]
       }

From 779a771bb5d2c095d651940f499ab06227f8bfd2 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Wed, 23 Nov 2022 14:03:56 +0800
Subject: [PATCH 02/28] =?UTF-8?q?update=20=E5=85=AC=E7=94=A8=E5=B7=A5?=
 =?UTF-8?q?=E7=A8=8B=E6=B6=88=E8=80=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/3DOverview/components/DianChart.vue | 67 +++++++++----------
 .../3DOverview/components/FadianChart.vue     | 43 ++++--------
 .../components/LeftContentEquipmentCheck.vue  |  2 +-
 .../components/LeftContentMonitor.vue         |  2 +-
 .../components/LeftContentOrder.vue           | 12 ++--
 .../components/LeftContentPublicConsume.vue   | 12 ++--
 .../components/RightContentAlert.vue          |  2 +-
 .../components/RightContentFaultAnalysis.vue  |  3 +-
 .../RightContentQualityAnalysis.vue           |  2 +-
 .../RightContentRealtimeProduction.vue        |  1 +
 src/views/3DOverview/index.vue                |  7 +-
 11 files changed, 68 insertions(+), 85 deletions(-)

diff --git a/src/views/3DOverview/components/DianChart.vue b/src/views/3DOverview/components/DianChart.vue
index a4ec652..45fb162 100644
--- a/src/views/3DOverview/components/DianChart.vue
+++ b/src/views/3DOverview/components/DianChart.vue
@@ -15,19 +15,7 @@ export default {
   props: {
     id: {
       type: String,
-      default: 'default-dian-id'
-    },
-    title: {
-      type: String,
-      default: 'default-title'
-    },
-    xData: {
-      type: Array,
-      default: () => []
-    },
-    seriesData: {
-      type: Array,
-      default: () => []
+      default: 'default-dian-line-chart'
     }
   },
   data() {
@@ -69,29 +57,35 @@ export default {
       option: {
         color: colors,
         legend: {
-          top: 4,
-          right: 50,
+          top: 16,
+          right: 64,
           itemWidth: 8,
           itemHeight: 8,
           textStyle: {
             color: '#fff9',
-            fontSize: 8
+            fontSize: 12
           }
           // data: ['ABC三相电压/v', 'ABC三相电流/a', '电缆温度']
         },
         grid: {
-          top: 32,
+          top: 48,
           left: 64,
-          bottom: 28
+          bottom: 36
         },
         tooltip: {
           show: true,
           trigger: 'axis',
           axisPointer: {
             type: 'line',
-            axis: 'x'
+            axis: 'x',
+            lineStyle: {
+              color: '#41888F90',
+              shadowColor: '#41888F',
+              shadowBlur: 10,
+              width: 2
+            }
           },
-          extraCssText: 'width: 152px !important; height: 100px !important;'
+          extraCssText: 'position: absolute !important; top: 0, left: 0; width: 152px !important; height: 100px !important;'
         },
         xAxis: [
           {
@@ -99,7 +93,8 @@ export default {
             data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
             axisTick: { show: false },
             axisLabel: {
-              color: '#fff9'
+              color: '#fff9',
+              fontSize: 14
             },
             axisLine: {
               lineStyle: {
@@ -110,13 +105,13 @@ export default {
         ],
         yAxis: [
           {
-            name: '电流/A',
-            nameTextStyle: { align: 'right', fontSize: 9, color: '#fff9' },
+            name: '电流/A    ',
+            nameTextStyle: { align: 'right', fontSize: 12, color: '#fff9' },
             type: 'value',
-            splitNumber: 3,
+            splitNumber: 4,
             onZero: true,
             position: 'left',
-            offset: 40,
+            offset: 32,
             axisTick: { show: false },
             axisLine: {
               show: true,
@@ -127,7 +122,7 @@ export default {
             },
             axisLabel: {
               color: '#fff9',
-              fontSize: 10
+              fontSize: 12
             },
             splitLine: {
               show: true,
@@ -138,10 +133,10 @@ export default {
             }
           },
           {
-            name: '电压/V',
-            nameTextStyle: { align: 'right', fontSize: 9, color: '#fff9' },
+            name: '  电压/V  ',
+            nameTextStyle: { align: 'right', fontSize: 12, color: '#fff9' },
             type: 'value',
-            splitNumber: 3,
+            splitNumber: 4,
             axisTick: { show: false },
             onZero: true,
             position: 'left',
@@ -155,7 +150,7 @@ export default {
             },
             axisLabel: {
               color: '#fff9',
-              fontSize: 10
+              fontSize: 12
             },
             splitLine: {
               show: true,
@@ -166,8 +161,8 @@ export default {
             }
           },
           {
-            name: '温度',
-            nameTextStyle: { align: 'left', color: '#fff9', fontSize: 9 },
+            name: '        温度',
+            nameTextStyle: { align: 'left', color: '#fff9', fontSize: 12 },
             axisTick: { show: false },
             axisLine: {
               show: false,
@@ -177,7 +172,7 @@ export default {
               }
             },
             type: 'value',
-            splitNumber: 3,
+            splitNumber: 4,
             splitLine: {
               show: true,
               lineStyle: {
@@ -187,7 +182,7 @@ export default {
             },
             axisLabel: {
               color: '#fff9',
-              fontSize: 10
+              fontSize: 12
             }
           }
         ],
@@ -251,7 +246,9 @@ export default {
     if (this.chart) this.chart.dispose()
     this.chart = null
   },
-  methods: {}
+  methods: {
+    initOption(legendSize, labelSize, axisLabelSize, splitLineNumber) {}
+  }
 }
 </script>
 <style scoped>
diff --git a/src/views/3DOverview/components/FadianChart.vue b/src/views/3DOverview/components/FadianChart.vue
index 22fa8a4..1a6015c 100644
--- a/src/views/3DOverview/components/FadianChart.vue
+++ b/src/views/3DOverview/components/FadianChart.vue
@@ -1,5 +1,5 @@
 <template>
-  <div :id="id" ref="techy-line-chart" class="techy-chart" />
+  <div id="techy-line-chart" ref="techy-line-chart" class="techy-chart" />
 </template>
 
 <script>
@@ -13,22 +13,7 @@ export default {
   inject: ['resizeStatus'],
   /** End Fn.1 */
   props: {
-    id: {
-      type: String,
-      default: 'default-fadian-id'
-    },
-    title: {
-      type: String,
-      default: 'default-title'
-    },
-    xData: {
-      type: Array,
-      default: () => []
-    },
-    seriesData: {
-      type: Array,
-      default: () => []
-    }
+
   },
   data() {
     return {
@@ -46,20 +31,20 @@ export default {
         color: ['#E02094', '#F0D63C', '#1A99FF'],
         grid: {
           top: '30%',
-          left: 0,
+          left: '120%',
           right: '5%',
           bottom: 0,
           containLabel: true
         },
-        tooltip: {
-          show: true,
-          trigger: 'axis',
-          axisPointer: {
-            type: 'line',
-            axis: 'x'
-          },
-          extraCssText: 'width: 152px !important; height: 100px !important;'
-        },
+        // tooltip: {
+        //   show: true,
+        //   trigger: 'axis',
+        //   axisPointer: {
+        //     type: 'line',
+        //     axis: 'x'
+        //   },
+        //   extraCssText: 'position: absolute; width: 152px !important; height: 100px !important;'
+        // },
         xAxis: {
           type: 'category',
           boundaryGap: false,
@@ -71,7 +56,7 @@ export default {
             show: false
           },
           axisLabel: {
-            fontSize: 8,
+            fontSize: 10,
             color: '#fffa'
           },
           axisLine: {
@@ -92,7 +77,7 @@ export default {
             show: false
           },
           axisLabel: {
-            fontSize: 8,
+            fontSize: 10,
             color: '#fffa'
             // formatter: '{value} %'
           },
diff --git a/src/views/3DOverview/components/LeftContentEquipmentCheck.vue b/src/views/3DOverview/components/LeftContentEquipmentCheck.vue
index 82e0b46..c4d6a14 100644
--- a/src/views/3DOverview/components/LeftContentEquipmentCheck.vue
+++ b/src/views/3DOverview/components/LeftContentEquipmentCheck.vue
@@ -100,7 +100,7 @@ export default {
 }
 
 .left-content-equipment-check {
-  height: calc(100% - 32px);
+  height: calc(100% - calc(32px * var(--beilv)));
   display: flex;
   gap: calc(100vmin / 1920 * 36);
   overflow: hidden;
diff --git a/src/views/3DOverview/components/LeftContentMonitor.vue b/src/views/3DOverview/components/LeftContentMonitor.vue
index 1f8ff56..fa81ad6 100644
--- a/src/views/3DOverview/components/LeftContentMonitor.vue
+++ b/src/views/3DOverview/components/LeftContentMonitor.vue
@@ -27,7 +27,7 @@ export default {
 .left-content-monitoring {
   flex: 1;
   width: 100%;
-  height: calc(100% - 32px);
+  height: calc(100% - calc(32px * var(--beilv)));
   display: flex;
   gap: calc(100vw / 1920 * 16);
 }
diff --git a/src/views/3DOverview/components/LeftContentOrder.vue b/src/views/3DOverview/components/LeftContentOrder.vue
index 677a7ae..281437d 100644
--- a/src/views/3DOverview/components/LeftContentOrder.vue
+++ b/src/views/3DOverview/components/LeftContentOrder.vue
@@ -18,19 +18,13 @@ const ProcessCircle = {
   methods: {},
   render: function(h) {
     return h('el-progress', {
-      class: {
-        'lb-progress-bar': true
-      },
       props: {
         type: 'circle',
         percentage: this.injectData.finished,
         width: 14,
         'stroke-width': 2,
         color: '#47FF27',
-        'define-back-color': '#6e6e6e' // 背景色
-      },
-      style: {
-        color: 'blue'
+        'define-back-color': '#ffffff' // 背景色, 该选项不起作用，可能和 element ui 版本相关
       }
     })
   }
@@ -97,4 +91,8 @@ export default {
   left: calc(-2px * var(--beilv));
   color: #ffffffb3 !important;
 }
+
+.left-content-order >>> .el-progress-circle__track {
+  stroke: #283851;
+}
 </style>
diff --git a/src/views/3DOverview/components/LeftContentPublicConsume.vue b/src/views/3DOverview/components/LeftContentPublicConsume.vue
index 8a16050..b3595c5 100644
--- a/src/views/3DOverview/components/LeftContentPublicConsume.vue
+++ b/src/views/3DOverview/components/LeftContentPublicConsume.vue
@@ -73,8 +73,8 @@
           <img src="./assets/consume/d.png" width="32" height="32" alt="dian" />
           <span>电</span>
         </div>
-        <div style="height: 100%; flex: 1;">
-          <DianChart />
+        <div style="height: 100%; flex: 1; overflow: hidden">
+          <DianChart id="dian" key="dian" />
         </div>
       </TechyBox>
     </div>
@@ -85,9 +85,9 @@
           <img src="./assets/consume/fad.png" width="32" height="32" alt="fadian" />
           <span>发电</span>
         </div>
-        <div style="height: 100%; flex: 1;  ">
+        <div style="height: 100%; flex: 1; overflow: hidden">
           <!-- <FadianChart /> -->
-          <DianChart />
+          <DianChart id="fa-dian" key="fa-dian" />
         </div>
       </TechyBox>
     </div>
@@ -116,7 +116,7 @@ export default {
 .public-consume__inner {
   overflow: hidden;
   overflow-y: auto;
-  height: calc(100% - 32px);
+  height: calc(100% - calc(32px * var(--beilv)));
   width: 100%;
   display: flex;
   flex-direction: column;
@@ -161,7 +161,7 @@ export default {
   flex-direction: column;
   font-size: calc(12px * var(--beilv));
   color: #fff9;
-  height: 10px;
+  height: calc(48px * var(--beilv));
   flex: 1 1;
   gap: calc(4px * var(--beilv));
 }
diff --git a/src/views/3DOverview/components/RightContentAlert.vue b/src/views/3DOverview/components/RightContentAlert.vue
index 37bb346..826a944 100644
--- a/src/views/3DOverview/components/RightContentAlert.vue
+++ b/src/views/3DOverview/components/RightContentAlert.vue
@@ -114,7 +114,7 @@ export default {
 }
 
 .right-content-alert {
-  height: calc(100% - 32px);
+  height: calc(100% - calc(32px * var(--beilv)));
   display: flex;
   gap: calc(100vw / 1920 * 16);
   overflow: hidden;
diff --git a/src/views/3DOverview/components/RightContentFaultAnalysis.vue b/src/views/3DOverview/components/RightContentFaultAnalysis.vue
index 4e7ef0d..d07bcc1 100644
--- a/src/views/3DOverview/components/RightContentFaultAnalysis.vue
+++ b/src/views/3DOverview/components/RightContentFaultAnalysis.vue
@@ -301,7 +301,8 @@ export default {
       this.configs.title.textStyle.fontSize = titleSize
       this.configs.title.subtextStyle.fontSize = subtitleSize
 
-      this.configs.legend.top = '24%'
+      this.configs.legend.top = '26%'
+      this.configs.legend.left = fs8
       this.configs.legend.itemGap = fs8
       this.configs.legend.itemWidth = fs8
 
diff --git a/src/views/3DOverview/components/RightContentQualityAnalysis.vue b/src/views/3DOverview/components/RightContentQualityAnalysis.vue
index 919cf20..145e7d5 100644
--- a/src/views/3DOverview/components/RightContentQualityAnalysis.vue
+++ b/src/views/3DOverview/components/RightContentQualityAnalysis.vue
@@ -47,7 +47,7 @@ export default {
 
 <style scoped>
 .right-content-quality-analysis {
-  height: calc(100% - 32px);
+  height: calc(100% - calc(32px * var(--beilv)));
   overflow: hidden;
   overflow-y: auto; /** 右边会有多的padding给滑道 */
   display: grid;
diff --git a/src/views/3DOverview/components/RightContentRealtimeProduction.vue b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
index a647828..607ee39 100644
--- a/src/views/3DOverview/components/RightContentRealtimeProduction.vue
+++ b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
@@ -251,6 +251,7 @@ export default {
   },
   watch: {
     shouldResize(val, oldVal) {
+      console.log('should resize')
       setTimeout(() => {
         this.chart.resize()
       }, 250)
diff --git a/src/views/3DOverview/index.vue b/src/views/3DOverview/index.vue
index b045d5f..bf8c671 100644
--- a/src/views/3DOverview/index.vue
+++ b/src/views/3DOverview/index.vue
@@ -1,9 +1,9 @@
 <template>
   <div id="v3d-outter" ref="v3d-outter">
-    <div id="V3DData" style="position: fixed; top: 0; left: 0; display: hidden;" rel=""></div>
+    <!-- <div id="V3DData" style="position: fixed; top: 0; left: 0; display: hidden;" rel=""></div>
     <V3DApp @3d-loaded="handle3DLoaded" @click.native="handle3DClick" />
-    <div v-if="showPage" id="v3d-main-content">
-      <!-- <div v-if="true" id="v3d-main-content"> -->
+    <div v-if="showPage" id="v3d-main-content"> -->
+      <div v-if="true" id="v3d-main-content">
       <techy-header :head-title="'合肥新能源数字工厂总览'" @toggle-full-screen="toggleFullScreen" />
 
       <section id="techy-body-part">
@@ -204,6 +204,7 @@ export default {
 }
 
 #v3d-outter *::-webkit-scrollbar-button {
+  display: none;
   width: calc(8px * var(--beilv));
   height: calc(8px * var(--beilv));
   background: #5bc4bf9f;

From 59b40fefe994f8b51c355ae3dfb6042f9e19ec55 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Wed, 23 Nov 2022 16:21:09 +0800
Subject: [PATCH 03/28] =?UTF-8?q?update=20=E5=AE=9E=E6=97=B6=E4=BA=A7?=
 =?UTF-8?q?=E9=87=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../RightContentRealtimeProduction.vue        | 452 +++++++++---------
 src/views/3DOverview/index.vue                |   4 +-
 .../components/mixins/resize.js               |   8 +-
 3 files changed, 241 insertions(+), 223 deletions(-)

diff --git a/src/views/3DOverview/components/RightContentRealtimeProduction.vue b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
index 607ee39..78b72b9 100644
--- a/src/views/3DOverview/components/RightContentRealtimeProduction.vue
+++ b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
@@ -15,6 +15,224 @@
 <script>
 import echarts from 'echarts'
 import resize from '@/views/OperationalOverview/components/mixins/resize'
+import { Random } from 'mockjs'
+import { debounce } from '@/utils'
+
+class ChartOption {
+  constructor() {
+    const wenduData = Array(12)
+      .fill(1)
+      .map(_ => Random.integer(30, 100))
+    const dianyaData = Array(12)
+      .fill(1)
+      .map(_ => Random.integer(30, 100))
+    const dianliuData = Array(12)
+      .fill(1)
+      .map(_ => Random.integer(30, 100))
+
+    this.color = ['#1A99FF', '#F0D63C', '#E02094']
+
+    this.legend = {
+      top: 28,
+      right: 40,
+      itemWidth: 10,
+      itemHeight: 10,
+      textStyle: {
+        color: '#fff9',
+        fontSize: 10
+      }
+    }
+
+    this.grid = {
+      top: 80,
+      left: 88,
+      right: 24,
+      bottom: 32
+    }
+
+    this.tooltip = {
+      show: true,
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 12
+      },
+      axisPointer: {
+        type: 'line',
+        axis: 'x'
+      },
+      extraCssText: 'width: calc(100px*var(--beilv)) !important;'
+    }
+
+    this.xAxis = {
+      type: 'category',
+      data: ['01:00', '02:00', '03:00', '04:00', '05:00', '06:00', '07:00', '08:00', '09:00', '10:00'],
+      axisTick: { show: false },
+      axisLabel: {
+        color: '#fff9',
+        fontSize: 12
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#fff3'
+        }
+      }
+    }
+
+    this.yAxis = [
+      {
+        name: '能耗        ',
+        nameTextStyle: { align: 'right', fontSize: 10, lineHeight: 14, color: '#fff9' },
+        type: 'value',
+        splitNumber: 4,
+        onZero: true,
+        position: 'left',
+        offset: 40,
+        axisTick: { show: false },
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: '#5982B2',
+            width: 1
+          }
+        },
+        axisLabel: {
+          color: '#fff9',
+          fontSize: 10
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: '#fff1',
+            type: 'dotted'
+          }
+        }
+      },
+      {
+        name: '产量        ',
+        nameTextStyle: { align: 'right', fontSize: 10, lineHeight: 14, color: '#fff9' },
+        type: 'value',
+        splitNumber: 4,
+        axisTick: { show: false },
+        onZero: true,
+        position: 'left',
+        offset: 0,
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: '#5982B2',
+            width: 1
+          }
+        },
+        axisLabel: {
+          color: '#fff9',
+          fontSize: 10
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: '#fff1',
+            type: 'dotted'
+          }
+        }
+      }
+    ]
+
+    this.series = [
+      {
+        name: '产线1',
+        type: 'line',
+        yAxisIndex: 0,
+        // smooth: true,
+        emphasis: {
+          focus: 'series'
+        },
+        data: dianliuData,
+        symbol: 'none',
+        areaStyle: {
+          color: {
+            type: 'linear',
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: '#1A99FF66' // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: 'transparent' // 100% 处的颜色
+              }
+            ],
+            global: false // 缺省为 false
+          }
+        }
+      },
+      {
+        name: '产线2',
+        type: 'line',
+        yAxisIndex: 1,
+        // smooth: true,
+        emphasis: {
+          focus: 'series'
+        },
+        data: dianyaData,
+        symbol: 'none',
+        areaStyle: {
+          color: {
+            type: 'linear',
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: '#F0D63C66' // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: 'transparent' // 100% 处的颜色
+              }
+            ],
+            global: false // 缺省为 false
+          }
+        }
+      }
+    ]
+  }
+
+  get option() {
+    return this
+  }
+
+  optionFilter(option, calcSize = () => {} /** callback */) {
+    let newOption
+    if (Array.isArray(option)) {
+      newOption = []
+      option.forEach(item => {
+        newOption.push(this.optionFilter(item, calcSize))
+      })
+      return newOption
+    } else if (typeof option === 'object') {
+      newOption = {}
+      for (const key in option) {
+        if (key === 'colorStops') newOption[key] = option[key]
+        else if (
+          typeof option[key] === 'number' /** 过滤不做变化的属性 */ &&
+          ['splitNumber', 'x', 'x2', 'y', 'y2', 'yAxisIndex', 'xAxisIndex'].indexOf(key) === -1
+        ) {
+          newOption[key] = calcSize(option[key])
+        } else newOption[key] = this.optionFilter(option[key], calcSize)
+      }
+      return newOption
+    } else {
+      newOption = calcSize(option)
+      return option
+    }
+  }
+}
 
 export default {
   name: 'RealtimeLineChart',
@@ -22,226 +240,11 @@ export default {
   /** Fn.1: 保证全屏切换时也刷新图表 ，应该在每个父组件为flex:1的echarts组件里都加上，以确保能正确地伸缩 */
   inject: ['resizeStatus'],
   /** End Fn.1 */
-  props: {
-    id: {
-      type: String,
-      default: 'default-dian-id'
-    },
-    title: {
-      type: String,
-      default: 'default-title'
-    },
-    xData: {
-      type: Array,
-      default: () => []
-    },
-    seriesData: {
-      type: Array,
-      default: () => []
-    }
-  },
+  props: {},
   data() {
-    const colors = ['#1A99FF', '#F0D63C', '#E02094']
-
-    // const computeInterval = numArr => Math.floor(numArr.reduce((p, c) => p + c, 0) / numArr.length / 10) * 10
-    let data = [
-      // 温度走势
-      [90, 93, 95, 96, 95, 90, 89, 84, 60, 77, 93, 93.5].map(_ => {
-        let v = Math.floor(Math.random() * 100)
-        while (v < 30) {
-          v = Math.floor(Math.random() * 100)
-        }
-        return v
-      }),
-      // 电流走势
-      [60, 72, 69, 77, 72, 70, 71, 69.5, 55, 60, 70.5, 71].map(_ => {
-        let v = Math.floor(Math.random() * 100)
-        while (v < 30) {
-          v = Math.floor(Math.random() * 100)
-        }
-        return v
-      }),
-      // 电压走势
-      [45, 50, 55, 60, 65, 78, 63, 66, 54, 62, 72, 73].map(_ => {
-        let v = Math.floor(Math.random() * 100)
-        while (v < 30) {
-          v = Math.floor(Math.random() * 100)
-        }
-        return v
-      })
-    ]
-    let wendu = data[0]
-    let dianliu = data[1]
-    let dianya = data[2]
-
     return {
       chart: null,
-      option: {
-        color: colors,
-        legend: {
-          top: 28,
-          right: 40,
-          itemWidth: 10,
-          itemHeight: 10,
-          textStyle: {
-            color: '#fff9',
-            fontSize: 10
-          }
-          // data: ['ABC三相电压/v', 'ABC三相电流/a', '电缆温度']
-        },
-        grid: {
-          top: 80,
-          left: 88,
-          right: 24,
-          bottom: 32
-        },
-        tooltip: {
-          show: true,
-          trigger: 'axis',
-          axisPointer: {
-            type: 'line',
-            axis: 'x'
-          },
-          extraCssText: 'width: 100px !important;'
-        },
-        xAxis: [
-          {
-            type: 'category',
-            data: ['01:00', '02:00', '03:00', '04:00', '05:00', '05:00', '06:00', '07:00', '08:00', '09:00', '10:00'],
-            axisTick: { show: false },
-            axisLabel: {
-              color: '#fff9'
-            },
-            axisLine: {
-              lineStyle: {
-                color: '#fff3'
-              }
-            }
-          }
-        ],
-        yAxis: [
-          {
-            name: '能耗        ',
-            nameTextStyle: { align: 'right', fontSize: 10, color: '#fff9' },
-            type: 'value',
-            splitNumber: 4,
-            onZero: true,
-            position: 'left',
-            offset: 40,
-            axisTick: { show: false },
-            axisLine: {
-              show: true,
-              lineStyle: {
-                color: '#5982B2',
-                width: 1
-              }
-            },
-            axisLabel: {
-              color: '#fff9',
-              fontSize: 10
-            },
-            splitLine: {
-              show: true,
-              lineStyle: {
-                color: '#fff1',
-                type: 'dotted'
-              }
-            }
-          },
-          {
-            name: '产量        ',
-            nameTextStyle: { align: 'right', fontSize: 10, color: '#fff9' },
-            type: 'value',
-            splitNumber: 4,
-            axisTick: { show: false },
-            onZero: true,
-            position: 'left',
-            offset: 0,
-            axisLine: {
-              show: true,
-              lineStyle: {
-                color: '#5982B2',
-                width: 1
-              }
-            },
-            axisLabel: {
-              color: '#fff9',
-              fontSize: 10
-            },
-            splitLine: {
-              show: true,
-              lineStyle: {
-                color: '#fff1',
-                type: 'dotted'
-              }
-            }
-          }
-        ],
-        series: [
-          {
-            name: '产线1',
-            type: 'line',
-            yAxisIndex: 0,
-            // smooth: true,
-            emphasis: {
-              focus: 'series'
-            },
-            data: dianliu,
-            symbol: 'none',
-            areaStyle: {
-              color: {
-                type: 'linear',
-                x: 0,
-                y: 0,
-                x2: 0,
-                y2: 1,
-                colorStops: [
-                  {
-                    offset: 0,
-                    color: '#1A99FF66' // 0% 处的颜色
-                  },
-                  {
-                    offset: 1,
-                    color: 'transparent' // 100% 处的颜色
-                  }
-                ],
-                global: false // 缺省为 false
-              }
-            }
-          },
-          {
-            name: '产线2',
-            type: 'line',
-            yAxisIndex: 1,
-            // smooth: true,
-            emphasis: {
-              focus: 'series'
-            },
-            data: dianya,
-            symbol: 'none',
-            areaStyle: {
-              color: {
-                type: 'linear',
-                x: 0,
-                y: 0,
-                x2: 0,
-                y2: 1,
-                colorStops: [
-                  {
-                    offset: 0,
-                    color: '#F0D63C66' // 0% 处的颜色
-                  },
-                  {
-                    offset: 1,
-                    color: 'transparent' // 100% 处的颜色
-                  }
-                ],
-                global: false // 缺省为 false
-              }
-            }
-          }
-        ]
-      }
+      option: null
     }
   },
   computed: {
@@ -251,7 +254,7 @@ export default {
   },
   watch: {
     shouldResize(val, oldVal) {
-      console.log('should resize')
+      console.log('fullscreen resize')
       setTimeout(() => {
         this.chart.resize()
       }, 250)
@@ -260,14 +263,23 @@ export default {
   mounted() {
     this.$nextTick(() => {
       if (!this.chart) this.chart = echarts.init(this.$refs['realtimeLineChart'])
-      this.chart.setOption(this.option)
+      this.setChartOption()
     })
   },
   beforeDestroy() {
     if (this.chart) this.chart.dispose()
     this.chart = null
   },
-  methods: {}
+  methods: {
+    calcSize(num) {
+      const beilv = document.documentElement.style.getPropertyValue('--beilv')
+      return num * beilv
+    },
+    setChartOption() {
+      let chartOption = new ChartOption()
+      this.chart.setOption(chartOption.optionFilter(chartOption.option, this.calcSize))
+    }
+  }
 }
 </script>
 
diff --git a/src/views/3DOverview/index.vue b/src/views/3DOverview/index.vue
index bf8c671..cd70f2f 100644
--- a/src/views/3DOverview/index.vue
+++ b/src/views/3DOverview/index.vue
@@ -258,7 +258,7 @@ export default {
 
 /* 实时产量和能耗 */
 .realtime {
-  height: calc(256px * var(--beilv));
+  height: calc(240px * var(--beilv));
 }
 /* 工序质量分析 */
 .ws-quality {
@@ -268,7 +268,7 @@ export default {
 }
 /* 产线成品率 */
 .production {
-  height: calc(256px * var(--beilv));
+  height: calc(220px * var(--beilv));
   position: relative;
 }
 
diff --git a/src/views/OperationalOverview/components/mixins/resize.js b/src/views/OperationalOverview/components/mixins/resize.js
index 234953b..945aef6 100644
--- a/src/views/OperationalOverview/components/mixins/resize.js
+++ b/src/views/OperationalOverview/components/mixins/resize.js
@@ -10,7 +10,13 @@ export default {
   mounted() {
     this.$_resizeHandler = debounce(() => {
       if (this.chart) {
-        this.chart.resize()
+        if (this.setChartOption) {
+          this.setChartOption()
+          this.$nextTick(() => {
+            this.chart.resize()
+          })
+        } else
+          this.chart.resize()
       }
     }, 100)
     this.$_initResizeEvent()

From e9ac894a4ad2f7790e1a35ff081c20263d7b265b Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Wed, 23 Nov 2022 16:57:30 +0800
Subject: [PATCH 04/28] =?UTF-8?q?update=20=E4=BA=A7=E7=BA=BF=E6=88=90?=
 =?UTF-8?q?=E5=93=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/RightContentProductRate.vue    | 456 ++++++++----------
 .../RightContentRealtimeProduction.vue        |   1 -
 src/views/3DOverview/index.vue                |   3 +-
 3 files changed, 209 insertions(+), 251 deletions(-)

diff --git a/src/views/3DOverview/components/RightContentProductRate.vue b/src/views/3DOverview/components/RightContentProductRate.vue
index ec06e40..0f7bf3c 100644
--- a/src/views/3DOverview/components/RightContentProductRate.vue
+++ b/src/views/3DOverview/components/RightContentProductRate.vue
@@ -1,276 +1,234 @@
 <template>
-  <div :id="id" ref="techy-line-chart" style="position: absolute; top: 0; left: 0; height: 100%; width: 100%; " />
+  <div ref="techy-line-chart" style="position: absolute; top: 0; left: 0; height: 100%; width: 100%; " />
 </template>
 
 <script>
 import echarts from 'echarts'
 import resize from '@/views/OperationalOverview/components/mixins/resize'
 
+class ChartOption {
+  constructor() {
+    // const wenduData = Array(12)
+    //   .fill(1)
+    //   .map(_ => Random.integer(30, 100))
+    // const dianyaData = Array(12)
+    //   .fill(1)
+    //   .map(_ => Random.integer(30, 100))
+    // const dianliuData = Array(12)
+    //   .fill(1)
+    //   .map(_ => Random.integer(30, 100))
+
+    this.color = ['#1A99FF', '#E02094', '#F0D63C']
+
+    this.legend = {
+      top: 24,
+      right: 40,
+      itemWidth: 18,
+      itemHeight: 12,
+      textStyle: {
+        fontSize: 12,
+        color: '#fffc'
+      }
+    }
+
+    this.grid = {
+      top: 72,
+      left: 26,
+      right: 24,
+      bottom: 16,
+      containLabel: true
+    }
+
+    this.tooltip = {
+      show: true,
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 12
+      },
+      axisPointer: {
+        type: 'line'
+      },
+      formatter: '{b}<br/>{a0}: {c}%<br />{a1}: {c1}%'
+    }
+
+    this.xAxis = {
+      type: 'category',
+      boundaryGap: false,
+      // data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+      data: Array(12)
+        .fill(0)
+        .map((_, idx) => (idx >= 10 ? idx : '0' + idx) + ':00'),
+      axisTick: {
+        show: false
+      },
+      axisLabel: {
+        fontSize: 12,
+        color: '#fffa'
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#fff3'
+        }
+      }
+    }
+    this.yAxis = {
+      type: 'value',
+      name: '成品率              ',
+      min: 'dataMin',
+      splitNumber: 3,
+      nameTextStyle: {
+        color: '#fff9',
+        fontSize: 12
+      },
+      axisLine: {
+        show: false
+      },
+      axisLabel: {
+        fontSize: 12,
+        color: '#fffa',
+        formatter: '{value} %'
+      },
+      axisTick: { show: false },
+      splitLine: {
+        lineStyle: {
+          color: '#fff3'
+        }
+      }
+    }
+
+    this.series = [
+      {
+        name: 'A',
+        type: 'line',
+        symbol: 'none',
+        areaStyle: {
+          color: {
+            type: 'linear',
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: '#59CBE866' // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: 'transparent' // 100% 处的颜色
+              }
+            ],
+            global: false // 缺省为 false
+          }
+        },
+        data: Array(12)
+          .fill(0)
+          .map(_ => {
+            let v = Math.floor(Math.random() * 100)
+            while (v < 80) {
+              v = Math.floor(Math.random() * 100)
+            }
+            return v
+          })
+      },
+      {
+        name: 'B',
+        type: 'line',
+        symbol: 'none',
+        areaStyle: {
+          color: {
+            type: 'linear',
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: '#E93CAC66' // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: 'transparent' // 100% 处的颜色
+              }
+            ],
+            global: false // 缺省为 false
+          }
+        },
+        data: Array(12)
+          .fill(0)
+          .map(_ => {
+            let v = Math.floor(Math.random() * 100)
+            while (v < 80) {
+              v = Math.floor(Math.random() * 100)
+            }
+            return v
+          })
+      }
+    ]
+  }
+
+  get option() {
+    return this
+  }
+
+  optionFilter(option, calcSize = () => {} /** callback */) {
+    let newOption
+    if (Array.isArray(option)) {
+      newOption = []
+      option.forEach(item => {
+        newOption.push(this.optionFilter(item, calcSize))
+      })
+      return newOption
+    } else if (typeof option === 'object') {
+      newOption = {}
+      for (const key in option) {
+        if (key === 'colorStops') newOption[key] = option[key]
+        else if (
+          typeof option[key] === 'number' /** 过滤不做变化的属性 */ &&
+          ['splitNumber', 'x', 'x2', 'y', 'y2', 'yAxisIndex', 'xAxisIndex'].indexOf(key) === -1
+        ) {
+          newOption[key] = calcSize(option[key])
+        } else newOption[key] = this.optionFilter(option[key], calcSize)
+      }
+      return newOption
+    } else {
+      newOption = calcSize(option)
+      return option
+    }
+  }
+}
+
 export default {
   name: 'ProductRateLineChart',
   mixins: [resize],
-  props: {
-    id: {
-      type: String,
-      default: 'default-id'
-    },
-    title: {
-      type: String,
-      default: 'default-title'
-    },
-    xData: {
-      type: Array,
-      default: () => []
-    },
-    seriesData: {
-      type: Array,
-      default: () => []
-    }
-  },
+  props: {},
   data() {
     return {
       chart: null,
-      option: {
-        color: ['#59CBE8', '#FF7345', '#E93CAC', '#9452FF', '#6A6E87', '#52FFF1'],
-        grid: {
-          top: '40%',
-          left: '5%',
-          right: '6%',
-          bottom: '10%',
-          containLabel: true
-        },
-        tooltip: {
-          show: true,
-          trigger: 'axis',
-          axisPointer: {
-            type: 'cross'
-          },
-          formatter: '{b}<br/>{a0}: {c}%<br />{a1}: {c1}%'
-        },
-        legend: {
-          width: '72%',
-          top: '20%',
-          right: '6%',
-          itemWidth: 12,
-          itemHeight: 8,
-          textStyle: {
-            color: '#fffc'
-          }
-        },
-        xAxis: {
-          type: 'category',
-          boundaryGap: false,
-          // data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
-          data: Array(12)
-            .fill(0)
-            .map((_, idx) => (idx >= 10 ? idx : '0' + idx) + ':00'),
-          axisTick: {
-            show: false
-          },
-          axisLabel: {
-            fontSize: 10,
-            color: '#fffa'
-          },
-          axisLine: {
-            lineStyle: {
-              color: '#fff3'
-            }
-          }
-        },
-        yAxis: {
-          type: 'value',
-          name: '成品率              ',
-          min: 'dataMin',
-          splitNumber: 3,
-          nameTextStyle: {
-            color: '#fffc',
-            align: 'right',
-            verticalAlign: 'bottom',
-            fontSize: 12
-          },
-          axisLine: {
-            show: false
-          },
-          axisLabel: {
-            fontSize: 11,
-            color: '#fffa',
-            formatter: '{value} %'
-          },
-          axisTick: { show: false },
-          splitLine: {
-            lineStyle: {
-              color: '#fff3'
-            }
-          }
-        },
-        series: [
-          {
-            name: 'A',
-            type: 'line',
-            symbol: 'none',
-            areaStyle: {
-              color: {
-                type: 'linear',
-                x: 0,
-                y: 0,
-                x2: 0,
-                y2: 1,
-                colorStops: [
-                  {
-                    offset: 0,
-                    color: '#59CBE866' // 0% 处的颜色
-                  },
-                  {
-                    offset: 1,
-                    color: 'transparent' // 100% 处的颜色
-                  }
-                ],
-                global: false // 缺省为 false
-              }
-            },
-            data: Array(12)
-              .fill(0)
-              .map(_ => {
-                let v = Math.floor(Math.random() * 100)
-                while (v < 80) {
-                  v = Math.floor(Math.random() * 100)
-                }
-                return v
-              })
-          },
-          {
-            name: 'B',
-            type: 'line',
-            symbol: 'none',
-            areaStyle: {
-              color: {
-                type: 'linear',
-                x: 0,
-                y: 0,
-                x2: 0,
-                y2: 1,
-                colorStops: [
-                  {
-                    offset: 0,
-                    color: '#E93CAC66' // 0% 处的颜色
-                  },
-                  {
-                    offset: 1,
-                    color: 'transparent' // 100% 处的颜色
-                  }
-                ],
-                global: false // 缺省为 false
-              }
-            },
-            data: Array(12)
-              .fill(0)
-              .map(_ => {
-                let v = Math.floor(Math.random() * 100)
-                while (v < 80) {
-                  v = Math.floor(Math.random() * 100)
-                }
-                return v
-              })
-          }
-          // {
-          //   name: '产线3',
-          //   type: 'line',
-          //   symbol: 'none',
-          //   areaStyle: {
-          //     color: {
-          //       type: 'linear',
-          //       x: 0,
-          //       y: 0,
-          //       x2: 0,
-          //       y2: 1,
-          //       colorStops: [
-          //         {
-          //           offset: 0,
-          //           color: '#FF734566' // 0% 处的颜色
-          //         },
-          //         {
-          //           offset: 1,
-          //           color: 'transparent' // 100% 处的颜色
-          //         }
-          //       ],
-          //       global: false // 缺省为 false
-          //     }
-          //   },
-          //   data: Array(12)
-          //     .fill(0)
-          //     .map(_ => Math.floor(Math.random() * 100))
-          // },
-          // {
-          //   name: '产线4',
-          //   type: 'line',
-          //   symbol: 'none',
-          //   areaStyle: {
-          //     color: {
-          //       type: 'linear',
-          //       x: 0,
-          //       y: 0,
-          //       x2: 0,
-          //       y2: 1,
-          //       colorStops: [
-          //         {
-          //           offset: 0,
-          //           color: '#9452FF66' // 0% 处的颜色
-          //         },
-          //         {
-          //           offset: 1,
-          //           color: 'transparent' // 100% 处的颜色
-          //         }
-          //       ],
-          //       global: false // 缺省为 false
-          //     }
-          //   },
-          //   data: Array(12)
-          //     .fill(0)
-          //     .map(_ => Math.floor(Math.random() * 100))
-          // },
-          // {
-          //   name: '产线5',
-          //   type: 'line',
-          //   symbol: 'none',
-          //   areaStyle: {
-          //     color: {
-          //       type: 'linear',
-          //       x: 0,
-          //       y: 0,
-          //       x2: 0,
-          //       y2: 1,
-          //       colorStops: [
-          //         {
-          //           offset: 0,
-          //           color: '#6A6E8766' // 0% 处的颜色
-          //         },
-          //         {
-          //           offset: 1,
-          //           color: 'transparent' // 100% 处的颜色
-          //         }
-          //       ],
-          //       global: false // 缺省为 false
-          //     }
-          //   },
-          //   data: Array(12)
-          //     .fill(0)
-          //     .map(_ => Math.floor(Math.random() * 100))
-          // }
-        ]
-      }
+      option: null
     }
   },
   mounted() {
     this.$nextTick(() => {
       if (!this.chart) this.chart = echarts.init(this.$refs['techy-line-chart'])
-      this.chart.setOption(this.option)
+      this.setChartOption()
     })
   },
   beforeDestroy() {
     if (this.chart) this.chart.dispose()
     this.chart = null
   },
-  methods: {}
+  methods: {
+    calcSize(num) {
+      const beilv = document.documentElement.style.getPropertyValue('--beilv')
+      return num * beilv
+    },
+    setChartOption() {
+      let chartOption = new ChartOption()
+      this.chart.setOption(chartOption.optionFilter(chartOption.option, this.calcSize))
+    }
+  }
 }
 </script>
 <style scoped>
diff --git a/src/views/3DOverview/components/RightContentRealtimeProduction.vue b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
index 78b72b9..63c8e2f 100644
--- a/src/views/3DOverview/components/RightContentRealtimeProduction.vue
+++ b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
@@ -16,7 +16,6 @@
 import echarts from 'echarts'
 import resize from '@/views/OperationalOverview/components/mixins/resize'
 import { Random } from 'mockjs'
-import { debounce } from '@/utils'
 
 class ChartOption {
   constructor() {
diff --git a/src/views/3DOverview/index.vue b/src/views/3DOverview/index.vue
index cd70f2f..311c1d0 100644
--- a/src/views/3DOverview/index.vue
+++ b/src/views/3DOverview/index.vue
@@ -268,7 +268,8 @@ export default {
 }
 /* 产线成品率 */
 .production {
-  height: calc(220px * var(--beilv));
+  height: calc(200px * var(--beilv));
+  flex: 1 0;
   position: relative;
 }
 

From d8592611b67ce2235b889ac7036177e969494d72 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Wed, 23 Nov 2022 17:00:25 +0800
Subject: [PATCH 05/28] =?UTF-8?q?update=20=E7=BC=BA=E9=99=B7=E5=88=86?=
 =?UTF-8?q?=E6=9E=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/RightContentFaultAnalysis.vue     | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/views/3DOverview/components/RightContentFaultAnalysis.vue b/src/views/3DOverview/components/RightContentFaultAnalysis.vue
index d07bcc1..5abfcd8 100644
--- a/src/views/3DOverview/components/RightContentFaultAnalysis.vue
+++ b/src/views/3DOverview/components/RightContentFaultAnalysis.vue
@@ -106,8 +106,8 @@ export default {
       configs: {
         title: {
           textAlign: 'center',
-          left: '64%',
-          top: '48%',
+          left: '67%',
+          top: '50%',
           text: demoData.reduce((prev, curr) => prev + curr.value, 0),
           textStyle: {
             color: '#fff',
@@ -210,7 +210,7 @@ export default {
           {
             name: 'PieForm',
             type: 'pie',
-            center: ['65%', '60%'],
+            center: ['68%', '61%'],
             radius: ['42%', '60%'],
             avoidLabelOverlap: true,
             label: {
@@ -326,11 +326,11 @@ export default {
       this.configs.legend.textStyle.rich.g.height = fs8
       this.configs.legend.textStyle.rich.g.borderRadius = fs5
 
-      this.configs.series[0].label.rich.first.fontSize = fs12
-      this.configs.series[0].label.rich.second.fontSize = fs12
-      this.configs.series[0].label.rich.third.fontSize = fs12
-      this.configs.series[0].label.rich.fourth.fontSize = fs12
-      this.configs.series[0].label.rich.fifth.fontSize = fs12
+      this.configs.series[0].label.rich.first.fontSize = fs10
+      this.configs.series[0].label.rich.second.fontSize = fs10
+      this.configs.series[0].label.rich.third.fontSize = fs10
+      this.configs.series[0].label.rich.fourth.fontSize = fs10
+      this.configs.series[0].label.rich.fifth.fontSize = fs10
 
       this.chart.setOption(this.configs)
     }

From 539235fcfb8d1e33ab342dd5c7c158d3fb2d9f80 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 09:45:11 +0800
Subject: [PATCH 06/28] =?UTF-8?q?update=203d=20=E5=85=AC=E7=94=A8=E5=B7=A5?=
 =?UTF-8?q?=E7=A8=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/3DOverview/components/DianChart.vue | 425 +++++++++---------
 .../RightContentQualityAnalysis.vue           |  20 +-
 2 files changed, 232 insertions(+), 213 deletions(-)

diff --git a/src/views/3DOverview/components/DianChart.vue b/src/views/3DOverview/components/DianChart.vue
index 45fb162..6a9c73e 100644
--- a/src/views/3DOverview/components/DianChart.vue
+++ b/src/views/3DOverview/components/DianChart.vue
@@ -5,6 +5,218 @@
 <script>
 import echarts from 'echarts'
 import resize from '@/views/OperationalOverview/components/mixins/resize'
+import { Random } from 'mockjs'
+
+class ChartOption {
+  constructor() {
+    this.color = ['#E02094', '#F0D63C', '#1A99FF']
+
+    this.legend = {
+      top: 11,
+      right: 32,
+      itemWidth: 8,
+      itemHeight: 8,
+      textStyle: {
+        color: '#fff9',
+        fontSize: 10
+      }
+    }
+
+    this.grid = {
+      top: 36,
+      left: 64,
+      bottom: 36
+    }
+
+    this.tooltip = {
+      show: true,
+      trigger: 'axis',
+      axisPointer: {
+        type: 'line',
+        axis: 'x',
+        lineStyle: {
+          color: '#41888F90',
+          shadowColor: '#41888F',
+          shadowBlur: 10,
+          width: 2
+        }
+      },
+      extraCssText: 'position: absolute !important; top: 0, left: 0; width: 152px !important; height: 100px !important;'
+    }
+
+    this.xAxis = {
+      type: 'category',
+      data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
+      axisTick: { show: false },
+      axisLabel: {
+        color: '#fff9',
+        fontSize: 12,
+        margin: 10
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#fff3'
+        }
+      }
+    }
+
+    this.yAxis = [
+      {
+        name: '电流/A    ',
+        nameTextStyle: { align: 'right', fontSize: 10, color: '#fff9' },
+        type: 'value',
+        splitNumber: 4,
+        onZero: true,
+        position: 'left',
+        offset: 28,
+        axisTick: { show: false },
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: '#5982B2',
+            width: 1
+          }
+        },
+        axisLabel: {
+          color: '#fff9',
+          fontSize: 10
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: '#fff1',
+            type: 'dotted'
+          }
+        }
+      },
+      {
+        name: '  电压/V  ',
+        nameTextStyle: { align: 'right', fontSize: 10, color: '#fff9' },
+        type: 'value',
+        splitNumber: 4,
+        axisTick: { show: false },
+        onZero: true,
+        position: 'left',
+        offset: 0,
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: '#5982B2',
+            width: 1
+          }
+        },
+        axisLabel: {
+          color: '#fff9',
+          fontSize: 10
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: '#fff1',
+            type: 'dotted'
+          }
+        }
+      },
+      {
+        name: '        温度',
+        nameTextStyle: { align: 'left', color: '#fff9', fontSize: 10 },
+        axisTick: { show: false },
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: '#fff9',
+            width: 1
+          }
+        },
+        type: 'value',
+        splitNumber: 4,
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: '#fff1',
+            type: 'dotted'
+          }
+        },
+        axisLabel: {
+          color: '#fff9',
+          fontSize: 10
+        }
+      }
+    ]
+
+    this.series = [
+      {
+        name: 'ABC三相电压/v',
+        type: 'line',
+        yAxisIndex: 0,
+        // smooth: true,
+        emphasis: {
+          focus: 'series'
+        },
+        data: Array(12)
+          .fill(1)
+          .map(_ => Random.integer(30, 100)),
+        symbol: 'none'
+      },
+      {
+        name: 'ABC三相电流/a',
+        type: 'line',
+        yAxisIndex: 1,
+        // smooth: true,
+        emphasis: {
+          focus: 'series'
+        },
+        data: Array(12)
+          .fill(1)
+          .map(_ => Random.integer(30, 100)),
+        symbol: 'none'
+      },
+      {
+        name: '电缆温度',
+        type: 'line',
+        yAxisIndex: 2,
+        // smooth: true,
+        emphasis: {
+          focus: 'series'
+        },
+        data: Array(12)
+          .fill(1)
+          .map(_ => Random.integer(30, 100)),
+        symbol: 'none'
+      }
+    ]
+  }
+
+  get option() {
+    return this
+  }
+
+  optionFilter(option, calcSize = () => {} /** callback */) {
+    let newOption
+    if (Array.isArray(option)) {
+      newOption = []
+      option.forEach(item => {
+        newOption.push(this.optionFilter(item, calcSize))
+      })
+      return newOption
+    } else if (typeof option === 'object') {
+      newOption = {}
+      for (const key in option) {
+        if (key === 'colorStops') newOption[key] = option[key]
+        else if (
+          typeof option[key] === 'number' /** 过滤不做变化的属性 */ &&
+          ['splitNumber', 'x', 'x2', 'y', 'y2', 'yAxisIndex', 'xAxisIndex'].indexOf(key) === -1
+        ) {
+          newOption[key] = calcSize(option[key])
+        } else newOption[key] = this.optionFilter(option[key], calcSize)
+      }
+      return newOption
+    } else {
+      newOption = calcSize(option)
+      return option
+    }
+  }
+}
 
 export default {
   name: 'DianLineChart',
@@ -19,209 +231,9 @@ export default {
     }
   },
   data() {
-    const colors = ['#E02094', '#F0D63C', '#1A99FF']
-
-    // const computeInterval = numArr => Math.floor(numArr.reduce((p, c) => p + c, 0) / numArr.length / 10) * 10
-    let data = [
-      // 温度走势
-      [90, 93, 95, 96, 95, 90, 89, 84, 60, 77, 93, 93.5].map(_ => {
-        let v = Math.floor(Math.random() * 100)
-        while (v < 30) {
-          v = Math.floor(Math.random() * 100)
-        }
-        return v
-      }),
-      // 电流走势
-      [60, 72, 69, 77, 72, 70, 71, 69.5, 55, 60, 70.5, 71].map(_ => {
-        let v = Math.floor(Math.random() * 100)
-        while (v < 30) {
-          v = Math.floor(Math.random() * 100)
-        }
-        return v
-      }),
-      // 电压走势
-      [45, 50, 55, 60, 65, 78, 63, 66, 54, 62, 72, 73].map(_ => {
-        let v = Math.floor(Math.random() * 100)
-        while (v < 30) {
-          v = Math.floor(Math.random() * 100)
-        }
-        return v
-      })
-    ]
-    let wendu = data[0]
-    let dianliu = data[1]
-    let dianya = data[2]
-
     return {
       chart: null,
-      option: {
-        color: colors,
-        legend: {
-          top: 16,
-          right: 64,
-          itemWidth: 8,
-          itemHeight: 8,
-          textStyle: {
-            color: '#fff9',
-            fontSize: 12
-          }
-          // data: ['ABC三相电压/v', 'ABC三相电流/a', '电缆温度']
-        },
-        grid: {
-          top: 48,
-          left: 64,
-          bottom: 36
-        },
-        tooltip: {
-          show: true,
-          trigger: 'axis',
-          axisPointer: {
-            type: 'line',
-            axis: 'x',
-            lineStyle: {
-              color: '#41888F90',
-              shadowColor: '#41888F',
-              shadowBlur: 10,
-              width: 2
-            }
-          },
-          extraCssText: 'position: absolute !important; top: 0, left: 0; width: 152px !important; height: 100px !important;'
-        },
-        xAxis: [
-          {
-            type: 'category',
-            data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
-            axisTick: { show: false },
-            axisLabel: {
-              color: '#fff9',
-              fontSize: 14
-            },
-            axisLine: {
-              lineStyle: {
-                color: '#fff3'
-              }
-            }
-          }
-        ],
-        yAxis: [
-          {
-            name: '电流/A    ',
-            nameTextStyle: { align: 'right', fontSize: 12, color: '#fff9' },
-            type: 'value',
-            splitNumber: 4,
-            onZero: true,
-            position: 'left',
-            offset: 32,
-            axisTick: { show: false },
-            axisLine: {
-              show: true,
-              lineStyle: {
-                color: '#5982B2',
-                width: 1
-              }
-            },
-            axisLabel: {
-              color: '#fff9',
-              fontSize: 12
-            },
-            splitLine: {
-              show: true,
-              lineStyle: {
-                color: '#fff1',
-                type: 'dotted'
-              }
-            }
-          },
-          {
-            name: '  电压/V  ',
-            nameTextStyle: { align: 'right', fontSize: 12, color: '#fff9' },
-            type: 'value',
-            splitNumber: 4,
-            axisTick: { show: false },
-            onZero: true,
-            position: 'left',
-            offset: 0,
-            axisLine: {
-              show: true,
-              lineStyle: {
-                color: '#5982B2',
-                width: 1
-              }
-            },
-            axisLabel: {
-              color: '#fff9',
-              fontSize: 12
-            },
-            splitLine: {
-              show: true,
-              lineStyle: {
-                color: '#fff1',
-                type: 'dotted'
-              }
-            }
-          },
-          {
-            name: '        温度',
-            nameTextStyle: { align: 'left', color: '#fff9', fontSize: 12 },
-            axisTick: { show: false },
-            axisLine: {
-              show: false,
-              lineStyle: {
-                color: '#fff9',
-                width: 1
-              }
-            },
-            type: 'value',
-            splitNumber: 4,
-            splitLine: {
-              show: true,
-              lineStyle: {
-                color: '#fff1',
-                type: 'dotted'
-              }
-            },
-            axisLabel: {
-              color: '#fff9',
-              fontSize: 12
-            }
-          }
-        ],
-        series: [
-          {
-            name: 'ABC三相电压/v',
-            type: 'line',
-            yAxisIndex: 0,
-            // smooth: true,
-            emphasis: {
-              focus: 'series'
-            },
-            data: dianliu,
-            symbol: 'none'
-          },
-          {
-            name: 'ABC三相电流/a',
-            type: 'line',
-            yAxisIndex: 1,
-            // smooth: true,
-            emphasis: {
-              focus: 'series'
-            },
-            data: dianya,
-            symbol: 'none'
-          },
-          {
-            name: '电缆温度',
-            type: 'line',
-            yAxisIndex: 2,
-            // smooth: true,
-            emphasis: {
-              focus: 'series'
-            },
-            data: wendu,
-            symbol: 'none'
-          }
-        ]
-      }
+      option: null
     }
   },
   computed: {
@@ -239,7 +251,7 @@ export default {
   mounted() {
     this.$nextTick(() => {
       if (!this.chart) this.chart = echarts.init(this.$refs['techy-line-chart'])
-      this.chart.setOption(this.option)
+      this.setChartOption()
     })
   },
   beforeDestroy() {
@@ -247,7 +259,14 @@ export default {
     this.chart = null
   },
   methods: {
-    initOption(legendSize, labelSize, axisLabelSize, splitLineNumber) {}
+    calcSize(num) {
+      const beilv = document.documentElement.style.getPropertyValue('--beilv')
+      return num * beilv
+    },
+    setChartOption() {
+      let chartOption = new ChartOption()
+      this.chart.setOption(chartOption.optionFilter(chartOption.option, this.calcSize))
+    }
   }
 }
 </script>
diff --git a/src/views/3DOverview/components/RightContentQualityAnalysis.vue b/src/views/3DOverview/components/RightContentQualityAnalysis.vue
index 145e7d5..db9bc6b 100644
--- a/src/views/3DOverview/components/RightContentQualityAnalysis.vue
+++ b/src/views/3DOverview/components/RightContentQualityAnalysis.vue
@@ -26,16 +26,16 @@ export default {
   data() {
     return {
       datalist: [
-        { name: '热端', value: 2023233, color: '#0b88ff' },
-        { name: '丝印', value: 2023233, color: '#0bffa6' },
-        { name: '原片', value: 20, color: '#0bffa6' },
-        { name: '钢化', value: 20, color: '#e3ff0b' },
-        { name: '上片磨边', value: 20, color: '#e3ff0b' },
-        { name: '下片铺纸', value: 202324, color: '#950bff' },
-        { name: '镀膜', value: 20, color: '#950bff' },
-        { name: '物流仓储', value: 202324, color: '#ff7d0b' },
-        { name: '清洗', value: 20, color: '#0bffa6' },
-        { name: '包装', value: 2, color: '#ff0bc2' }
+        { name: '热端', value: 66, color: '#0b88ff' },
+        { name: '丝印', value: 93, color: '#0bffa6' },
+        { name: '原片', value: 121, color: '#0bffa6' },
+        { name: '钢化', value: 2, color: '#e3ff0b' },
+        { name: '上片磨边', value: 211, color: '#e3ff0b' },
+        { name: '下片铺纸', value: 27, color: '#950bff' },
+        { name: '镀膜', value: 44, color: '#950bff' },
+        { name: '物流仓储', value: 3, color: '#ff7d0b' },
+        { name: '清洗', value: 2, color: '#0bffa6' },
+        { name: '包装', value: 22, color: '#ff0bc2' }
       ]
     }
   },

From f37dfbb328c7494199c889797a7605d832118561 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 10:28:11 +0800
Subject: [PATCH 07/28] =?UTF-8?q?update=20=E4=BA=A7=E5=93=81=E6=88=90?=
 =?UTF-8?q?=E5=93=81=E7=8E=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/QualityManager/HomePage.vue         |  33 +-
 .../components/TechyAnalysisHeader.vue        | 126 +++-
 .../components/charts/newLineStack.vue        | 568 ++++++++----------
 3 files changed, 389 insertions(+), 338 deletions(-)

diff --git a/src/views/QualityManager/HomePage.vue b/src/views/QualityManager/HomePage.vue
index d360bba..455a33b 100644
--- a/src/views/QualityManager/HomePage.vue
+++ b/src/views/QualityManager/HomePage.vue
@@ -186,7 +186,7 @@
                 </div>
                 <div class="grow">
                   <techy-box class="" style="padding: calc(16px * var(--beilv));">
-                    <techy-analysis-header class="production-rate">
+                    <techy-analysis-header type="production-rate" class="production-rate">
                       产品成品率
                       <template v-slot:dateSelect>
                         <div class="date-select">
@@ -627,13 +627,38 @@ export default {
   width: calc(375px * var(--beilv));
 }
 
-@media all and (max-width: 2040px) {
+/* @media all and (max-width: 1680px) {
   .production-rate {
-    /* text-align: left; */
+    text-align: center;
   }
 
-  .production-rate >>> .top-icon:last-of-type {
+  .production-rate >>> .top-icon,
+  .production-rate >>> .date-select {
     display: none;
   }
 }
+
+@media all and (min-width: 1680px) {
+  .production-rate {
+    text-align: left;
+  }
+
+  .production-rate >>> .top-icon {
+    display: none;
+  }
+}
+
+@media all and (min-width: 2048px) {
+  .production-rate {
+    text-align: center;
+  }
+
+  .production-rate >>> .date-select > span {
+    background-color: #568588;
+  }
+
+  .production-rate >>> .date-select > span.date-select__active {
+    background-color: #42bbb7;
+  }
+} */
 </style>
diff --git a/src/views/QualityManager/components/TechyAnalysisHeader.vue b/src/views/QualityManager/components/TechyAnalysisHeader.vue
index 8b2eb85..d54c7b6 100644
--- a/src/views/QualityManager/components/TechyAnalysisHeader.vue
+++ b/src/views/QualityManager/components/TechyAnalysisHeader.vue
@@ -55,7 +55,131 @@
               </g>
             </svg>
           </span>
-          <span class="techy-analysis-header__title" style="display: inline-block; transform: translateX(-4px) skewX(-32deg); ">
+          <span
+            class="techy-analysis-header__title"
+            style="display: inline-block; transform: translateX(-4px) skewX(-32deg); "
+          >
+            <slot />
+          </span>
+          <span class="top-icon" style="transform: skewX(-32deg); ">
+            <svg
+              width="100%"
+              height="100%"
+              viewBox="0 0 56 13"
+              version="1.1"
+              xmlns="http://www.w3.org/2000/svg"
+              xmlns:xlink="http://www.w3.org/1999/xlink"
+            >
+              <title>right</title>
+              <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                <g id="2-5质量管理" transform="translate(-653.000000, -808.000000)" fill="#31A6AE">
+                  <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+                    <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
+                      <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
+                        <g
+                          id="编组-2备份-2"
+                          transform="translate(262.000000, 8.500000) scale(-1, -1) translate(-262.000000, -8.500000) translate(234.000000, 2.000000)"
+                        >
+                          <polygon id="路径-11" points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"></polygon>
+                          <polygon
+                            id="路径-11备份"
+                            opacity="0.8"
+                            points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
+                          ></polygon>
+                          <polygon
+                            id="路径-11备份-3"
+                            opacity="0.4"
+                            points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
+                          ></polygon>
+                          <polygon
+                            id="路径-11备份-2"
+                            opacity="0.601434"
+                            points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
+                          ></polygon>
+                          <polygon
+                            id="路径-11备份-4"
+                            opacity="0.201434"
+                            points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
+                          ></polygon>
+                        </g>
+                      </g>
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </svg>
+          </span>
+        </div>
+
+        <div
+          class="legend legend-right"
+          style="transform: skewX(-32deg); background: #fff0; width: calc(126px * var(--beilv)); padding-left: calc(8px * var(--beilv));"
+        >
+          <div class="legend-item pla" style=" margin-right: calc(8px * var(--beilv));">产线A</div>
+          <div class="legend-item plb" style=" ">产线B</div>
+        </div>
+      </div>
+    </template>
+
+    <template v-else-if="type === 'production-rate'">
+      <div
+        style="transform: skewX(32deg); background: #fff0; width: 100%; height: calc(22px * var(--beilv)); display: flex; justify-content: center; align-items: center;"
+      >
+        <div class="legend" style="background: #fff0; width: calc(126px * var(--beilv));"></div>
+
+        <div style="flex: 1; white-space: nowrap; overflow: hidden;">
+          <span class="top-icon" style="transform: skewX(-32deg); ">
+            <svg
+              width="100%"
+              height="100%"
+              viewBox="0 0 56 13"
+              version="1.1"
+              xmlns="http://www.w3.org/2000/svg"
+              xmlns:xlink="http://www.w3.org/1999/xlink"
+            >
+              <title>left</title>
+              <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                <g id="2-5质量管理" transform="translate(-419.000000, -808.000000)" fill="#31A6AE">
+                  <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+                    <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
+                      <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
+                        <g
+                          id="编组-2备份"
+                          transform="translate(28.000000, 8.500000) scale(1, -1) translate(-28.000000, -8.500000) translate(0.000000, 2.000000)"
+                        >
+                          <polygon id="路径-11" points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"></polygon>
+                          <polygon
+                            id="路径-11备份"
+                            opacity="0.8"
+                            points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
+                          ></polygon>
+                          <polygon
+                            id="路径-11备份-3"
+                            opacity="0.4"
+                            points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
+                          ></polygon>
+                          <polygon
+                            id="路径-11备份-2"
+                            opacity="0.601434"
+                            points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
+                          ></polygon>
+                          <polygon
+                            id="路径-11备份-4"
+                            opacity="0.201434"
+                            points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
+                          ></polygon>
+                        </g>
+                      </g>
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </svg>
+          </span>
+          <span
+            class="techy-analysis-header__title"
+            style="display: inline-block; transform: translateX(-4px) skewX(-32deg); "
+          >
             <slot />
           </span>
           <span class="top-icon" style="transform: skewX(-32deg); ">
diff --git a/src/views/QualityManager/components/charts/newLineStack.vue b/src/views/QualityManager/components/charts/newLineStack.vue
index b9531bf..9da6a59 100644
--- a/src/views/QualityManager/components/charts/newLineStack.vue
+++ b/src/views/QualityManager/components/charts/newLineStack.vue
@@ -6,6 +6,230 @@
 import echarts from 'echarts'
 import resize from '@/views/OperationalOverview/components/mixins/resize'
 
+class ChartOption {
+  constructor() {
+    this.color = ['#DDB112', '#1A99FF', '#FB418C', '#A691FF', '#49FBD6']
+
+    // this.legend = {
+    //   top: 11,
+    //   right: 32,
+    //   itemWidth: 8,
+    //   itemHeight: 8,
+    //   textStyle: {
+    //     color: '#fff9',
+    //     fontSize: 10
+    //   }
+    // }
+
+    this.grid = {
+      top: 64,
+      left: 12,
+      right: 28,
+      bottom: 20,
+      containLabel: true
+    }
+
+    this.tooltip = {
+      trigger: 'axis',
+      extraCssText: 'width: 180px !important; ',
+      axisPointer: {
+        type: 'cross',
+        label: {
+          backgroundColor: '#6a7985'
+        }
+      }
+    }
+
+    this.xAxis = {
+      type: 'category',
+      boundaryGap: false,
+      axisLine: {
+        lineStyle: {
+          color: '#fff3'
+        }
+      },
+      axisTick: { show: false },
+      axisLabel: {
+        textStyle: {
+          fontSize: 12,
+          color: '#fff8' //
+        },
+        margin: 12
+      },
+      data:
+        this.mode === 'month'
+          ? [1, 2, 3, 4, 5, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20]
+          : ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
+    }
+
+    this.yAxis = [
+      {
+        name: '成品率          ',
+        type: 'value',
+        min: 'dataMin',
+        splitNumber: 4,
+        nameTextStyle: {
+          color: 'rgba(255,255,255,0.7)',
+          fontSize: 12,
+          align: 'left',
+          verticalAlign: 'bottom'
+        },
+        axisLine: {
+          lineStyle: {
+            type: 'solid',
+            color: 'rgba(119, 255, 242, 0.6)', // 左边线的颜色
+            width: '1' // 坐标线的宽度
+          }
+        },
+        axisTick: {
+          show: false
+        },
+        axisLabel: {
+          formatter: '{value} %',
+          textStyle: {
+            fontSize: 12,
+            color: 'rgba(255,255,255,0.5)' // 坐标值得具体的颜色
+          }
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dotted',
+            color: 'rgba(119, 255, 242, 0.2)'
+          }
+        }
+      }
+    ]
+
+    this.series = [
+      {
+        name: 'A1下片机',
+        type: 'line',
+        symbol: 'none',
+        areaStyle: {
+          // color: 'rgba(50,145,152,0.5)'
+          color: {
+            type: 'linear',
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: '#DDB11266' // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: 'transparent' // 100% 处的颜色
+              }
+            ],
+            global: false // 缺省为 false
+          }
+        },
+        emphasis: {
+          focus: 'series'
+        },
+        data:
+          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
+              })
+      },
+      {
+        name: '磨边机',
+        type: 'line',
+        symbol: 'none',
+
+        areaStyle: {
+          // color: 'rgba(50,145,152,0.5)'
+          color: {
+            type: 'linear',
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: '#1A99FFCC' // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: 'transparent' // 100% 处的颜色
+              }
+            ],
+            global: false // 缺省为 false
+          }
+        },
+        emphasis: {
+          focus: 'series'
+        },
+        data:
+          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
+              })
+      }
+    ]
+  }
+
+  get option() {
+    return this
+  }
+
+  optionFilter(option, calcSize = () => {} /** callback */) {
+    let newOption
+    if (Array.isArray(option)) {
+      newOption = []
+      option.forEach(item => {
+        newOption.push(this.optionFilter(item, calcSize))
+      })
+      return newOption
+    } else if (typeof option === 'object') {
+      newOption = {}
+      for (const key in option) {
+        if (key === 'colorStops') newOption[key] = option[key]
+        else if (
+          typeof option[key] === 'number' /** 过滤不做变化的属性 */ &&
+          ['splitNumber', 'x', 'x2', 'y', 'y2', 'yAxisIndex', 'xAxisIndex'].indexOf(key) === -1
+        ) {
+          newOption[key] = calcSize(option[key])
+        } else newOption[key] = this.optionFilter(option[key], calcSize)
+      }
+      return newOption
+    } else {
+      newOption = calcSize(option)
+      return option
+    }
+  }
+}
+
 export default {
   name: 'PlFaultAnalysisPieChart',
   mixins: [resize],
@@ -23,329 +247,7 @@ export default {
   data() {
     return {
       chart: null,
-      configs: {
-        color: ['#DDB112', '#1A99FF', '#FB418C', '#A691FF', '#49FBD6'],
-        tooltip: {
-          trigger: 'axis',
-          extraCssText: 'width: 180px !important; ',
-          axisPointer: {
-            type: 'cross',
-            label: {
-              backgroundColor: '#6a7985'
-            }
-          }
-        },
-        grid: {
-          top: 56,
-          left: '2%',
-          right: '5%',
-          bottom: '5%',
-          containLabel: true
-        },
-        xAxis: {
-          type: 'category',
-          boundaryGap: false,
-          axisLine: {
-            lineStyle: {
-              color: '#ffffff66'
-            }
-          },
-          axisTick: { show: false },
-          axisLabel: {
-            textStyle: {
-              fontSize: 10,
-              color: '#fff8' //
-            },
-            margin: 12
-          },
-          data:
-            this.mode === 'month'
-              ? [1, 2, 3, 4, 5, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20]
-              : ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
-        },
-
-        yAxis: [
-          {
-            name: '成品率            ',
-            type: 'value',
-            min: 'dataMin',
-            splitNumber: 4,
-            nameTextStyle: {
-              color: 'rgba(255,255,255,0.7)',
-              fontSize: 10,
-              align: 'left',
-              verticalAlign: 'bottom'
-            },
-            axisLine: {
-              lineStyle: {
-                type: 'solid',
-                color: 'rgba(119, 255, 242, 0.6)', // 左边线的颜色
-                width: '1' // 坐标线的宽度
-              }
-            },
-            axisTick: {
-              show: false
-            },
-            axisLabel: {
-              formatter: '{value} %',
-              textStyle: {
-                color: 'rgba(255,255,255,0.5)' // 坐标值得具体的颜色
-              }
-            },
-            splitLine: {
-              lineStyle: {
-                type: 'dotted',
-                color: 'rgba(119, 255, 242, 0.2)'
-              }
-            }
-          }
-        ],
-        series: [
-          {
-            name: 'A1下片机',
-            type: 'line',
-            symbol: 'none',
-            areaStyle: {
-              // color: 'rgba(50,145,152,0.5)'
-              color: {
-                type: 'linear',
-                x: 0,
-                y: 0,
-                x2: 0,
-                y2: 1,
-                colorStops: [
-                  {
-                    offset: 0,
-                    color: '#FB418C66' // 0% 处的颜色
-                  },
-                  {
-                    offset: 1,
-                    color: 'transparent' // 100% 处的颜色
-                  }
-                ],
-                global: false // 缺省为 false
-              }
-            },
-            emphasis: {
-              focus: 'series'
-            },
-            data:
-              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
-                  })
-          },
-          {
-            name: '磨边机',
-            type: 'line',
-            symbol: 'none',
-
-            areaStyle: {
-              // color: 'rgba(50,145,152,0.5)'
-              color: {
-                type: 'linear',
-                x: 0,
-                y: 0,
-                x2: 0,
-                y2: 1,
-                colorStops: [
-                  {
-                    offset: 0,
-                    color: '#DDB11266' // 0% 处的颜色
-                  },
-                  {
-                    offset: 1,
-                    color: 'transparent' // 100% 处的颜色
-                  }
-                ],
-                global: false // 缺省为 false
-              }
-            },
-            emphasis: {
-              focus: 'series'
-            },
-            data:
-              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
-                  })
-          }
-          // {
-          //   name: '镀膜机',
-          //   type: 'line',
-          //   symbol: 'none',
-
-          //   areaStyle: {
-          //     // color: 'rgba(50,145,152,0.5)'
-          //     color: {
-          //       type: 'linear',
-          //       x: 0,
-          //       y: 0,
-          //       x2: 0,
-          //       y2: 1,
-          //       colorStops: [
-          //         {
-          //           offset: 0,
-          //           color: '#1A99FF66' // 0% 处的颜色
-          //         },
-          //         {
-          //           offset: 1,
-          //           color: 'transparent' // 100% 处的颜色
-          //         }
-          //       ],
-          //       global: false // 缺省为 false
-          //     }
-          //   },
-          //   emphasis: {
-          //     focus: 'series'
-          //   },
-          //   data:
-          //     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
-          //         })
-          // },
-          // {
-          //   name: '包装纸',
-          //   type: 'line',
-          //   symbol: 'none',
-
-          //   areaStyle: {
-          //     // color: 'rgba(50,145,152,0.5)'
-          //     color: {
-          //       type: 'linear',
-          //       x: 0,
-          //       y: 0,
-          //       x2: 0,
-          //       y2: 1,
-          //       colorStops: [
-          //         {
-          //           offset: 0,
-          //           color: '#A691FF66' // 0% 处的颜色
-          //         },
-          //         {
-          //           offset: 1,
-          //           color: 'transparent' // 100% 处的颜色
-          //         }
-          //       ],
-          //       global: false // 缺省为 false
-          //     }
-          //   },
-          //   emphasis: {
-          //     focus: 'series'
-          //   },
-          //   data:
-          //     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
-          //         })
-          // },
-          // {
-          //   name: '丝印',
-          //   type: 'line',
-          //   symbol: 'none',
-
-          //   label: {
-          //     show: true,
-          //     position: 'top'
-          //   },
-          //   areaStyle: {
-          //     // color: 'rgba(50,145,152,0.5)'
-          //     color: {
-          //       type: 'linear',
-          //       x: 0,
-          //       y: 0,
-          //       x2: 0,
-          //       y2: 1,
-          //       colorStops: [
-          //         {
-          //           offset: 0,
-          //           color: '#49FBD666' // 0% 处的颜色
-          //         },
-          //         {
-          //           offset: 1,
-          //           color: 'transparent' // 100% 处的颜色
-          //         }
-          //       ],
-          //       global: false // 缺省为 false
-          //     }
-          //   },
-          //   emphasis: {
-          //     focus: 'series'
-          //   },
-          //   data:
-          //     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
-          //         })
-          // }
-        ]
-      }
+      configs: null
     }
   },
 
@@ -356,18 +258,9 @@ export default {
   },
 
   mounted() {
-    window.addEventListener('resize', function() {
-      if (this.chart) {
-        this.chart.resize()
-      }
-    })
-
     this.$nextTick(() => {
-      // if (!this.chart) this.chart = echarts.init(this.$refs.chartContainer, { width: '100%', height: '100%' })
       if (!this.chart) this.chart = echarts.init(this.$refs.chartContainer)
-
-      this.chart.setOption(this.configs)
-      this.chart.resize()
+      this.setChartOption()
     })
   },
   methods: {
@@ -401,6 +294,15 @@ export default {
       })
 
       if (this.chart) this.chart.setOption(this.configs)
+    },
+    calcSize(num) {
+      const beilv = document.documentElement.style.getPropertyValue('--beilv')
+      return num * beilv
+    },
+    setChartOption() {
+      let chartOption = new ChartOption()
+      this.configs = chartOption.optionFilter(chartOption.option, this.calcSize)
+      this.chart.setOption(this.configs)
     }
   }
 }

From 3db6ac92fe4905fdf58c90a6e9d2f565a286525b Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 13:38:53 +0800
Subject: [PATCH 08/28] =?UTF-8?q?update=20=E4=BA=A7=E7=BA=BF=E7=BC=BA?=
 =?UTF-8?q?=E9=99=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/QualityManager/HomePage.vue         |  14 +-
 .../components/TechyAnalysisHeader.vue        | 135 +-----------------
 .../components/charts/TechyBar.vue            |   9 +-
 3 files changed, 19 insertions(+), 139 deletions(-)

diff --git a/src/views/QualityManager/HomePage.vue b/src/views/QualityManager/HomePage.vue
index 455a33b..caae065 100644
--- a/src/views/QualityManager/HomePage.vue
+++ b/src/views/QualityManager/HomePage.vue
@@ -38,8 +38,8 @@
             <!-- 第一行 -->
             <div class="quality-analysis__body__row-1">
               <!-- 第一列 -->
-              <div class="flex gap-16">
-                <div class="grow" style="max-width: 24vw;">
+              <div class="flex gap-16" style="flex: 1;">
+                <div style="width: calc(400px * var(--beilv)); flex: 1;">
                   <techy-box class="" style="padding: calc(8px * var(--beilv));">
                     <techy-analysis-header type="special">产线缺陷日对比</techy-analysis-header>
                     <div
@@ -80,7 +80,7 @@
                     </div>
                   </techy-box>
                 </div>
-                <div class="grow" style="max-width: 24vw;">
+                <div style="width: calc(400px * var(--beilv)); flex: 1;">
                   <techy-box class="" style="padding: calc(8px * var(--beilv));">
                     <techy-analysis-header type="special">产线缺陷月对比</techy-analysis-header>
                     <div
@@ -126,8 +126,8 @@
               </div>
 
               <!-- 第二列 -->
-              <div class="grow flex gap-16">
-                <div class="width-222">
+              <div class="flex gap-16" style="flex: 1; width: 1px;">
+                <div class="" style="width: calc(380px * var(--beilv)); flex: 1;">
                   <techy-box class="" style="padding: calc(16px * var(--beilv));">
                     <techy-analysis-header :show-top-icon="false">
                       产线缺陷分析
@@ -184,9 +184,9 @@
                     </div>
                   </techy-box>
                 </div>
-                <div class="grow">
+                <div class="" style="width: calc(400px * var(--beilv)); flex: 1;">
                   <techy-box class="" style="padding: calc(16px * var(--beilv));">
-                    <techy-analysis-header type="production-rate" class="production-rate">
+                    <techy-analysis-header class="production-rate">
                       产品成品率
                       <template v-slot:dateSelect>
                         <div class="date-select">
diff --git a/src/views/QualityManager/components/TechyAnalysisHeader.vue b/src/views/QualityManager/components/TechyAnalysisHeader.vue
index d54c7b6..3300f13 100644
--- a/src/views/QualityManager/components/TechyAnalysisHeader.vue
+++ b/src/views/QualityManager/components/TechyAnalysisHeader.vue
@@ -4,10 +4,10 @@
       <div
         style="transform: skewX(32deg); background: #fff0; width: 100%; height: calc(22px * var(--beilv)); display: flex; justify-content: center; align-items: center;"
       >
-        <div class="legend" style="background: #fff0; width: calc(126px * var(--beilv));"></div>
+        <div class="legend" style="background: #fff0; width: calc(84px * var(--beilv));"></div>
 
         <div style="flex: 1; white-space: nowrap; overflow: hidden;">
-          <span class="top-icon" style="transform: skewX(-32deg); ">
+          <span class="top-icon" style="transform: translateY(1px) skewX(-32deg); ">
             <svg
               width="100%"
               height="100%"
@@ -57,11 +57,11 @@
           </span>
           <span
             class="techy-analysis-header__title"
-            style="display: inline-block; transform: translateX(-4px) skewX(-32deg); "
+            style="display: inline-block; transform: translateX(-1px) skewX(-32deg); "
           >
             <slot />
           </span>
-          <span class="top-icon" style="transform: skewX(-32deg); ">
+          <span class="top-icon" style="transform:  translateY(1px)  skewX(-32deg); ">
             <svg
               width="100%"
               height="100%"
@@ -113,130 +113,9 @@
 
         <div
           class="legend legend-right"
-          style="transform: skewX(-32deg); background: #fff0; width: calc(126px * var(--beilv)); padding-left: calc(8px * var(--beilv));"
+          style="transform: skewX(-32deg); background: #fff0; width: calc(100px * var(--beilv)); padding-left: calc(6px * var(--beilv));"
         >
-          <div class="legend-item pla" style=" margin-right: calc(8px * var(--beilv));">产线A</div>
-          <div class="legend-item plb" style=" ">产线B</div>
-        </div>
-      </div>
-    </template>
-
-    <template v-else-if="type === 'production-rate'">
-      <div
-        style="transform: skewX(32deg); background: #fff0; width: 100%; height: calc(22px * var(--beilv)); display: flex; justify-content: center; align-items: center;"
-      >
-        <div class="legend" style="background: #fff0; width: calc(126px * var(--beilv));"></div>
-
-        <div style="flex: 1; white-space: nowrap; overflow: hidden;">
-          <span class="top-icon" style="transform: skewX(-32deg); ">
-            <svg
-              width="100%"
-              height="100%"
-              viewBox="0 0 56 13"
-              version="1.1"
-              xmlns="http://www.w3.org/2000/svg"
-              xmlns:xlink="http://www.w3.org/1999/xlink"
-            >
-              <title>left</title>
-              <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <g id="2-5质量管理" transform="translate(-419.000000, -808.000000)" fill="#31A6AE">
-                  <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
-                    <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
-                      <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
-                        <g
-                          id="编组-2备份"
-                          transform="translate(28.000000, 8.500000) scale(1, -1) translate(-28.000000, -8.500000) translate(0.000000, 2.000000)"
-                        >
-                          <polygon id="路径-11" points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"></polygon>
-                          <polygon
-                            id="路径-11备份"
-                            opacity="0.8"
-                            points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-3"
-                            opacity="0.4"
-                            points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-2"
-                            opacity="0.601434"
-                            points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-4"
-                            opacity="0.201434"
-                            points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
-                          ></polygon>
-                        </g>
-                      </g>
-                    </g>
-                  </g>
-                </g>
-              </g>
-            </svg>
-          </span>
-          <span
-            class="techy-analysis-header__title"
-            style="display: inline-block; transform: translateX(-4px) skewX(-32deg); "
-          >
-            <slot />
-          </span>
-          <span class="top-icon" style="transform: skewX(-32deg); ">
-            <svg
-              width="100%"
-              height="100%"
-              viewBox="0 0 56 13"
-              version="1.1"
-              xmlns="http://www.w3.org/2000/svg"
-              xmlns:xlink="http://www.w3.org/1999/xlink"
-            >
-              <title>right</title>
-              <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <g id="2-5质量管理" transform="translate(-653.000000, -808.000000)" fill="#31A6AE">
-                  <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
-                    <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
-                      <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
-                        <g
-                          id="编组-2备份-2"
-                          transform="translate(262.000000, 8.500000) scale(-1, -1) translate(-262.000000, -8.500000) translate(234.000000, 2.000000)"
-                        >
-                          <polygon id="路径-11" points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"></polygon>
-                          <polygon
-                            id="路径-11备份"
-                            opacity="0.8"
-                            points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-3"
-                            opacity="0.4"
-                            points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-2"
-                            opacity="0.601434"
-                            points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-4"
-                            opacity="0.201434"
-                            points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
-                          ></polygon>
-                        </g>
-                      </g>
-                    </g>
-                  </g>
-                </g>
-              </g>
-            </svg>
-          </span>
-        </div>
-
-        <div
-          class="legend legend-right"
-          style="transform: skewX(-32deg); background: #fff0; width: calc(126px * var(--beilv)); padding-left: calc(8px * var(--beilv));"
-        >
-          <div class="legend-item pla" style=" margin-right: calc(8px * var(--beilv));">产线A</div>
+          <div class="legend-item pla" style=" margin-right: calc(2px * var(--beilv));">产线A</div>
           <div class="legend-item plb" style=" ">产线B</div>
         </div>
       </div>
@@ -410,7 +289,7 @@ export default {
   width: calc(8px * var(--beilv));
   height: calc(8px * var(--beilv));
   background: #fffc;
-  margin-right: calc(8px * var(--beilv));
+  margin-right: calc(4px * var(--beilv));
 }
 
 .pla::before {
diff --git a/src/views/QualityManager/components/charts/TechyBar.vue b/src/views/QualityManager/components/charts/TechyBar.vue
index 4255c99..09c043c 100644
--- a/src/views/QualityManager/components/charts/TechyBar.vue
+++ b/src/views/QualityManager/components/charts/TechyBar.vue
@@ -159,7 +159,7 @@ export default {
       option: {
         grid: {
           left: '10%',
-          top: 48,
+          top: 72,
           bottom: 28
         },
         xAxis: {
@@ -195,13 +195,14 @@ export default {
           type: 'value',
           // min: -25,
           min: this.extraSpaceBetweenZero * -1,
-          name: this.unitName,
+          name: this.unitName + '        ',
           nameTextStyle: {
             color: '#fff8',
-            fontSize: 8,
+            fontSize: 12,
             verticalAlign: 'top',
             align: 'right'
           },
+          nameGap: 20,
           axisLine: {
             show: true,
             lineStyle: {
@@ -210,7 +211,7 @@ export default {
           },
           axisLabel: {
             color: '#fff8',
-            fontSize: 10,
+            fontSize: 12,
             /** y轴不从0开始，也可以用 xAxis 向下 offset 的方式模拟 **/
             formatter: function(value, index) {
               if (value < 0) {

From 9e48b2103a4e3d8b87c536bec68ec63065ed44df Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 13:43:45 +0800
Subject: [PATCH 09/28] update

---
 src/views/QualityManager/HomePage.vue | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/views/QualityManager/HomePage.vue b/src/views/QualityManager/HomePage.vue
index caae065..76f0ce4 100644
--- a/src/views/QualityManager/HomePage.vue
+++ b/src/views/QualityManager/HomePage.vue
@@ -425,23 +425,26 @@ export default {
 </script>
 
 <style scoped>
-::-webkit-scrollbar {
+.visual-container >>> ::-webkit-scrollbar {
   width: calc(8px * var(--beilv));
 }
 
-::-webkit-scrollbar-track {
+.visual-container >>> ::-webkit-scrollbar-track {
   background-color: #14243f;
   border-radius: 0;
 }
 
-::-webkit-scrollbar-button {
-  width: calc(8px * var(--beilv));
-  height: calc(8px * var(--beilv));
+.visual-container >>> ::-webkit-scrollbar-button {
+  /* width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv)); */
+  display: none;
+  width: 0;
+  height: 0;
   background: #5bc4bf9f;
   position: relative;
 }
 
-::-webkit-scrollbar-thumb {
+.visual-container >>> ::-webkit-scrollbar-thumb {
   border-radius: calc(8px * var(--beilv));
   background: #5bc4bf9f;
 }

From 899b9fa87993d8ed360ddbf9e69787ceccaf9aef Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 14:57:18 +0800
Subject: [PATCH 10/28] =?UTF-8?q?update=20=E8=B4=A8=E9=87=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/QualityManager/HomePage.vue         |  32 +-
 .../components/TechyAnalysisHeader.vue        | 273 +++++++++++-------
 .../components/charts/newLineStack.vue        |   1 +
 .../components/productionRateHeader.vue       | 243 ++++++++++++++++
 4 files changed, 414 insertions(+), 135 deletions(-)
 create mode 100644 src/views/QualityManager/components/productionRateHeader.vue

diff --git a/src/views/QualityManager/HomePage.vue b/src/views/QualityManager/HomePage.vue
index 76f0ce4..7956494 100644
--- a/src/views/QualityManager/HomePage.vue
+++ b/src/views/QualityManager/HomePage.vue
@@ -185,32 +185,8 @@
                   </techy-box>
                 </div>
                 <div class="" style="width: calc(400px * var(--beilv)); flex: 1;">
-                  <techy-box class="" style="padding: calc(16px * var(--beilv));">
-                    <techy-analysis-header class="production-rate">
-                      产品成品率
-                      <template v-slot:dateSelect>
-                        <div class="date-select">
-                          <span
-                            :class="{ 'date-select__active': dateMode2 === 'day' }"
-                            @click="
-                              dateMode2 = 'day'
-                              dataUpdateToken = '' + Math.random()
-                            "
-                          >
-                            日
-                          </span>
-                          <span
-                            :class="{ 'date-select__active': dateMode2 === 'month' }"
-                            @click="
-                              dateMode2 = 'month'
-                              dataUpdateToken = '' + Math.random()
-                            "
-                          >
-                            月
-                          </span>
-                        </div>
-                      </template>
-                    </techy-analysis-header>
+                  <techy-box class="" style="padding: 0 calc(16px * var(--beilv));">
+                    <productionRateHeader @update-data="str => dataUpdateToken = str">产品成品率</productionRateHeader>
                     <div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">
                       <new-line-stack :data-update-token="dataUpdateToken" :mode="dateMode2" />
                     </div>
@@ -285,6 +261,7 @@ import TechyBox from './components/TechyBox.vue'
 import TechyTable from './components/TechyTable.vue'
 import TechyAnalysisBar from './components/TechyAnalysisBar.vue'
 import TechyAnalysisHeader from './components/TechyAnalysisHeader.vue'
+import productionRateHeader from './components/productionRateHeader.vue'
 // import FaultCategoryChart from './components/charts/FaultCategoryChart.vue'
 import PlFaultAnalysisPieChart from './components/charts/PlFaultAnalysisPieChart.vue'
 import { mapGetters } from 'vuex'
@@ -307,7 +284,8 @@ export default {
     // FaultCategoryChart,
     PlFaultAnalysisPieChart,
     TechyBar,
-    NewLineStack
+    NewLineStack,
+    productionRateHeader
   },
   data() {
     const quexianDatalist = [
diff --git a/src/views/QualityManager/components/TechyAnalysisHeader.vue b/src/views/QualityManager/components/TechyAnalysisHeader.vue
index 3300f13..da99412 100644
--- a/src/views/QualityManager/components/TechyAnalysisHeader.vue
+++ b/src/views/QualityManager/components/TechyAnalysisHeader.vue
@@ -1,122 +1,125 @@
 <template>
   <div class="techy-analysis-header">
     <template v-if="type === 'special'">
-      <div
-        style="transform: skewX(32deg); background: #fff0; width: 100%; height: calc(22px * var(--beilv)); display: flex; justify-content: center; align-items: center;"
-      >
-        <div class="legend" style="background: #fff0; width: calc(84px * var(--beilv));"></div>
-
-        <div style="flex: 1; white-space: nowrap; overflow: hidden;">
-          <span class="top-icon" style="transform: translateY(1px) skewX(-32deg); ">
-            <svg
-              width="100%"
-              height="100%"
-              viewBox="0 0 56 13"
-              version="1.1"
-              xmlns="http://www.w3.org/2000/svg"
-              xmlns:xlink="http://www.w3.org/1999/xlink"
-            >
-              <title>left</title>
-              <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <g id="2-5质量管理" transform="translate(-419.000000, -808.000000)" fill="#31A6AE">
-                  <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
-                    <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
-                      <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
-                        <g
-                          id="编组-2备份"
-                          transform="translate(28.000000, 8.500000) scale(1, -1) translate(-28.000000, -8.500000) translate(0.000000, 2.000000)"
-                        >
-                          <polygon id="路径-11" points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"></polygon>
-                          <polygon
-                            id="路径-11备份"
-                            opacity="0.8"
-                            points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-3"
-                            opacity="0.4"
-                            points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-2"
-                            opacity="0.601434"
-                            points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-4"
-                            opacity="0.201434"
-                            points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
-                          ></polygon>
+      <div class="special-wrapper">
+        <div class="special-wrapper__left"></div>
+        <div class="special-wrapper__middle">
+          <div class="special-wrapper__middle--inner">
+            <div style="transform: translateX(12%)">
+              <span class="top-icon">
+                <svg
+                  width="100%"
+                  height="100%"
+                  viewBox="0 0 56 13"
+                  version="1.1"
+                  xmlns="http://www.w3.org/2000/svg"
+                  xmlns:xlink="http://www.w3.org/1999/xlink"
+                >
+                  <title>left</title>
+                  <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                    <g id="2-5质量管理" transform="translate(-419.000000, -808.000000)" fill="#31A6AE">
+                      <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+                        <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
+                          <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
+                            <g
+                              id="编组-2备份"
+                              transform="translate(28.000000, 8.500000) scale(1, -1) translate(-28.000000, -8.500000) translate(0.000000, 2.000000)"
+                            >
+                              <polygon
+                                id="路径-11"
+                                points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"
+                              ></polygon>
+                              <polygon
+                                id="路径-11备份"
+                                opacity="0.8"
+                                points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
+                              ></polygon>
+                              <polygon
+                                id="路径-11备份-3"
+                                opacity="0.4"
+                                points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
+                              ></polygon>
+                              <polygon
+                                id="路径-11备份-2"
+                                opacity="0.601434"
+                                points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
+                              ></polygon>
+                              <polygon
+                                id="路径-11备份-4"
+                                opacity="0.201434"
+                                points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
+                              ></polygon>
+                            </g>
+                          </g>
                         </g>
                       </g>
                     </g>
                   </g>
-                </g>
-              </g>
-            </svg>
-          </span>
-          <span
-            class="techy-analysis-header__title"
-            style="display: inline-block; transform: translateX(-1px) skewX(-32deg); "
-          >
-            <slot />
-          </span>
-          <span class="top-icon" style="transform:  translateY(1px)  skewX(-32deg); ">
-            <svg
-              width="100%"
-              height="100%"
-              viewBox="0 0 56 13"
-              version="1.1"
-              xmlns="http://www.w3.org/2000/svg"
-              xmlns:xlink="http://www.w3.org/1999/xlink"
-            >
-              <title>right</title>
-              <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <g id="2-5质量管理" transform="translate(-653.000000, -808.000000)" fill="#31A6AE">
-                  <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
-                    <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
-                      <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
-                        <g
-                          id="编组-2备份-2"
-                          transform="translate(262.000000, 8.500000) scale(-1, -1) translate(-262.000000, -8.500000) translate(234.000000, 2.000000)"
-                        >
-                          <polygon id="路径-11" points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"></polygon>
-                          <polygon
-                            id="路径-11备份"
-                            opacity="0.8"
-                            points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-3"
-                            opacity="0.4"
-                            points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-2"
-                            opacity="0.601434"
-                            points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
-                          ></polygon>
-                          <polygon
-                            id="路径-11备份-4"
-                            opacity="0.201434"
-                            points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
-                          ></polygon>
+                </svg>
+              </span>
+              <span class="techy-analysis-header__title">
+                <slot />
+              </span>
+              <span class="top-icon">
+                <svg
+                  width="100%"
+                  height="100%"
+                  viewBox="0 0 56 13"
+                  version="1.1"
+                  xmlns="http://www.w3.org/2000/svg"
+                  xmlns:xlink="http://www.w3.org/1999/xlink"
+                >
+                  <title>right</title>
+                  <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                    <g id="2-5质量管理" transform="translate(-653.000000, -808.000000)" fill="#31A6AE">
+                      <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+                        <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
+                          <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
+                            <g
+                              id="编组-2备份-2"
+                              transform="translate(262.000000, 8.500000) scale(-1, -1) translate(-262.000000, -8.500000) translate(234.000000, 2.000000)"
+                            >
+                              <polygon
+                                id="路径-11"
+                                points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"
+                              ></polygon>
+                              <polygon
+                                id="路径-11备份"
+                                opacity="0.8"
+                                points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
+                              ></polygon>
+                              <polygon
+                                id="路径-11备份-3"
+                                opacity="0.4"
+                                points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
+                              ></polygon>
+                              <polygon
+                                id="路径-11备份-2"
+                                opacity="0.601434"
+                                points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
+                              ></polygon>
+                              <polygon
+                                id="路径-11备份-4"
+                                opacity="0.201434"
+                                points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
+                              ></polygon>
+                            </g>
+                          </g>
                         </g>
                       </g>
                     </g>
                   </g>
-                </g>
-              </g>
-            </svg>
-          </span>
+                </svg>
+              </span>
+            </div>
+          </div>
         </div>
 
-        <div
-          class="legend legend-right"
-          style="transform: skewX(-32deg); background: #fff0; width: calc(100px * var(--beilv)); padding-left: calc(6px * var(--beilv));"
-        >
-          <div class="legend-item pla" style=" margin-right: calc(2px * var(--beilv));">产线A</div>
-          <div class="legend-item plb" style=" ">产线B</div>
+        <div class="special-wrapper__right">
+          <div class="special-wrapper__right--inner">
+            <div class="pla" style="margin-right: calc(2px * var(--beilv));">产线A</div>
+            <div class="plb">产线B</div>
+          </div>
         </div>
       </div>
     </template>
@@ -292,10 +295,64 @@ export default {
   margin-right: calc(4px * var(--beilv));
 }
 
-.pla::before {
+.special-wrapper {
+  position: absolute;
+  top: 0;
+  left: 0;
+  transform: skewX(35deg);
+  background: #fff0;
+  width: 100%;
+  height: calc(22px * var(--beilv));
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.special-wrapper__left {
+  width: 1px;
+  flex: 1;
+}
+.special-wrapper__middle {
+  overflow: hidden;
+}
+
+.special-wrapper__middle--inner {
+  transform: skewX(-35deg);
+  white-space: nowrap;
+  display: flex;
+  height: 100%;
+  align-items: center;
+}
+
+.special-wrapper__right {
+  padding-left: calc(8px * var(--beilv));
+  padding-right: calc(8px * var(--beilv));
+}
+
+.special-wrapper__right--inner {
+  transform: skewX(-35deg);
+  display: flex;
+  align-items: center;
+  gap: calc(4px * var(--beilv));
+  height: 100%;
+  width: calc(100px * var(--beilv));
+  padding-left: calc(6px * var(--beilv));
+  font-size: calc(12px * var(--beilv));
+  color: #fff9;
+}
+
+.special-wrapper__right--inner > div::before {
+  content: '';
+  display: inline-block;
+  margin-right: calc(2px * var(--beilv));
+  width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv));
+}
+
+.plb::before {
   background: linear-gradient(to top, #49fbd6, transparent);
 }
-.plb::before {
+.pla::before {
   background: linear-gradient(to top, #49b2ff, transparent);
 }
 </style>
diff --git a/src/views/QualityManager/components/charts/newLineStack.vue b/src/views/QualityManager/components/charts/newLineStack.vue
index 9da6a59..6b3e80d 100644
--- a/src/views/QualityManager/components/charts/newLineStack.vue
+++ b/src/views/QualityManager/components/charts/newLineStack.vue
@@ -68,6 +68,7 @@ class ChartOption {
         type: 'value',
         min: 'dataMin',
         splitNumber: 4,
+        nameGap: 16,
         nameTextStyle: {
           color: 'rgba(255,255,255,0.7)',
           fontSize: 12,
diff --git a/src/views/QualityManager/components/productionRateHeader.vue b/src/views/QualityManager/components/productionRateHeader.vue
new file mode 100644
index 0000000..f75b755
--- /dev/null
+++ b/src/views/QualityManager/components/productionRateHeader.vue
@@ -0,0 +1,243 @@
+<template>
+  <div class="techy-analysis-header">
+    <div class="special-wrapper">
+      <div class="special-wrapper__left"></div>
+      <div class="special-wrapper__middle">
+        <div class="special-wrapper__middle--inner">
+          <div style="transform: translateX(4%)">
+            <span class="top-icon">
+              <svg
+                width="100%"
+                height="100%"
+                viewBox="0 0 56 13"
+                version="1.1"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+              >
+                <title>left</title>
+                <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                  <g id="2-5质量管理" transform="translate(-419.000000, -808.000000)" fill="#31A6AE">
+                    <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+                      <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
+                        <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
+                          <g
+                            id="编组-2备份"
+                            transform="translate(28.000000, 8.500000) scale(1, -1) translate(-28.000000, -8.500000) translate(0.000000, 2.000000)"
+                          >
+                            <polygon id="路径-11" points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"></polygon>
+                            <polygon
+                              id="路径-11备份"
+                              opacity="0.8"
+                              points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
+                            ></polygon>
+                            <polygon
+                              id="路径-11备份-3"
+                              opacity="0.4"
+                              points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
+                            ></polygon>
+                            <polygon
+                              id="路径-11备份-2"
+                              opacity="0.601434"
+                              points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
+                            ></polygon>
+                            <polygon
+                              id="路径-11备份-4"
+                              opacity="0.201434"
+                              points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
+                            ></polygon>
+                          </g>
+                        </g>
+                      </g>
+                    </g>
+                  </g>
+                </g>
+              </svg>
+            </span>
+            <span class="techy-analysis-header__title">
+              <slot />
+            </span>
+            <span class="top-icon">
+              <svg
+                width="100%"
+                height="100%"
+                viewBox="0 0 56 13"
+                version="1.1"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+              >
+                <title>right</title>
+                <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                  <g id="2-5质量管理" transform="translate(-653.000000, -808.000000)" fill="#31A6AE">
+                    <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+                      <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
+                        <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
+                          <g
+                            id="编组-2备份-2"
+                            transform="translate(262.000000, 8.500000) scale(-1, -1) translate(-262.000000, -8.500000) translate(234.000000, 2.000000)"
+                          >
+                            <polygon id="路径-11" points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"></polygon>
+                            <polygon
+                              id="路径-11备份"
+                              opacity="0.8"
+                              points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
+                            ></polygon>
+                            <polygon
+                              id="路径-11备份-3"
+                              opacity="0.4"
+                              points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
+                            ></polygon>
+                            <polygon
+                              id="路径-11备份-2"
+                              opacity="0.601434"
+                              points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
+                            ></polygon>
+                            <polygon
+                              id="路径-11备份-4"
+                              opacity="0.201434"
+                              points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
+                            ></polygon>
+                          </g>
+                        </g>
+                      </g>
+                    </g>
+                  </g>
+                </g>
+              </svg>
+            </span>
+          </div>
+        </div>
+      </div>
+
+      <div class="special-wrapper__right">
+        <div class="special-wrapper__right--inner">
+          <span
+            :class="{ 'date-select__active': dateMode === 'day' }"
+            @click="
+              dateMode = 'day'
+              $emit('update-data', '' + Math.random())
+            "
+          >
+            日
+          </span>
+          <span
+            :class="{ 'date-select__active': dateMode === 'month' }"
+            @click="
+              dateMode = 'month'
+              $emit('update-data', '' + Math.random())
+            "
+          >
+            月
+          </span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'TechyAnalysisHeader',
+  props: {
+    type: {
+      type: String,
+      default: 'dafault-type'
+    },
+    showTopIcon: {
+      type: Boolean,
+      default: true
+    }
+  },
+  data() {
+    return {
+      dateMode: 'day'
+    }
+  }
+}
+</script>
+
+<style scoped>
+.techy-analysis-header {
+  text-align: center;
+  margin-bottom: calc(16px * var(--beilv));
+  position: relative;
+  white-space: nowrap;
+  z-index: 1;
+}
+
+.techy-analysis-header__title {
+  color: #01cfcc;
+  font-size: calc(15px * var(--beilv));
+  line-height: calc(18px * var(--beilv));
+}
+
+.top-icon {
+  display: inline-block;
+  width: calc(56px * var(--beilv));
+  height: calc(12px * var(--beilv));
+  margin-bottom: calc(2px * var(--beilv));
+}
+
+.special-wrapper {
+  position: absolute;
+  top: calc(12px * var(--beilv));
+  left: 0;
+  transform: skewX(35deg);
+  background: #fff0;
+  width: 100%;
+  height: calc(22px * var(--beilv));
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.special-wrapper__left {
+  flex: 1;
+  min-width: calc(56px * var(--beilv));
+}
+
+.special-wrapper__middle {
+  overflow: hidden;
+}
+
+.special-wrapper__middle--inner {
+  transform: skewX(-35deg);
+  white-space: nowrap;
+  display: flex;
+  height: 100%;
+  align-items: center;
+}
+
+.special-wrapper__right {
+  width: calc(100px * var(--beilv));
+  padding-left: calc(8px * var(--beilv));
+  padding-right: calc(8px * var(--beilv));
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+
+.special-wrapper__right--inner {
+  transform: skewX(-35deg);
+  border-radius: calc(2px * var(--beilv));
+  overflow: hidden;
+  display: flex;
+  align-items: center;
+  height: 100%;
+  cursor: pointer;
+}
+
+.special-wrapper__right--inner > span {
+  display: inline-block;
+  width: calc(40px * var(--beilv));
+  text-align: center;
+  font-size: calc(12px * var(--beilv));
+  line-height: calc(18px * var(--beilv));
+  color: white;
+  background-color: #31878c94;
+}
+
+.special-wrapper__right--inner span.pl-select__active,
+.special-wrapper__right--inner span.date-select__active {
+  background-color: #42bbb7;
+}
+</style>

From eb525fce24d4475d42179809648dcf80780a14a3 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 15:17:15 +0800
Subject: [PATCH 11/28] =?UTF-8?q?update=20=E8=AE=BE=E5=A4=87=E5=B7=A1?=
 =?UTF-8?q?=E6=A3=80=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../inspectionManage/inspectionRecord.vue     | 106 ++++++++++++------
 src/views/EquipmentManager/mockData.js        |  10 +-
 2 files changed, 74 insertions(+), 42 deletions(-)

diff --git a/src/views/EquipmentManager/inspectionManage/inspectionRecord.vue b/src/views/EquipmentManager/inspectionManage/inspectionRecord.vue
index 694b9b8..267ffe8 100644
--- a/src/views/EquipmentManager/inspectionManage/inspectionRecord.vue
+++ b/src/views/EquipmentManager/inspectionManage/inspectionRecord.vue
@@ -33,7 +33,10 @@
     </div>
     <!-- right -->
     <div class="right-container">
-      <top-title :base-title="this.$t('module.equipmentManager.inspectionManage.inspectionItem')" style="font-size: 14px; padding-bottom: 14px;" />
+      <top-title
+        :base-title="this.$t('module.equipmentManager.inspectionManage.inspectionItem')"
+        style="font-size: 14px; padding-bottom: 14px;"
+      />
       <base-table
         :page="1"
         :limit="999"
@@ -64,13 +67,22 @@ import BaseTable from '@/components/BaseTable'
 import Pagination from '@/components/Pagination'
 import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
 import { tableHeight } from '@/utils/index'
-import { equipmentList, inspectionLog, einspectionLogD, einspectionItList, einspectionItemLogU } from '@/api/equipment/inspectionManager'
+import {
+  equipmentList,
+  inspectionLog,
+  einspectionLogD,
+  einspectionItList,
+  einspectionItemLogU
+} from '@/api/equipment/inspectionManager'
 import einspectionitemAdd from './components/einspectionitemAdd.vue'
 import einspectionitemlogAdd from './components/einspectionitemlogAdd.vue'
 import { timeFormatter } from '@/filters'
 import StatusBtn from './components/statusBtn.vue'
 import statusTag from './components/statusTag.vue'
 // import newBasicData from '@/filters/newBasicData'
+
+import { Random } from 'mockjs'
+
 const topBtnConfig = [
   {
     type: 'add',
@@ -246,21 +258,23 @@ export default {
             cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
             type: 'warning'
           }
-        ).then(() => {
-          einspectionLogD({
-            id: raw.data.id
-          }).then(res => {
-            this.$message({
-              message: this.$t('module.basicData.visual.success'),
-              type: 'success',
-              duration: 1500,
-              onClose: () => {
-                this.listQuery.current = 1
-                this.getList()
-              }
+        )
+          .then(() => {
+            einspectionLogD({
+              id: raw.data.id
+            }).then(res => {
+              this.$message({
+                message: this.$t('module.basicData.visual.success'),
+                type: 'success',
+                duration: 1500,
+                onClose: () => {
+                  this.listQuery.current = 1
+                  this.getList()
+                }
+              })
             })
           })
-        }).catch(() => { })
+          .catch(() => {})
       } else if (raw.type === 'detail') {
         this.addNew(raw.data.id, 'detail')
       } else if (raw.type === 'edit') {
@@ -274,8 +288,25 @@ export default {
       this.listQuery.endTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[1] + 'T23:59:59' : ''
       inspectionLog(this.listQuery).then(res => {
         if (res.data.records) {
-          this.list = res.data.records
+          // this.list = res.data.records
+          // 11-mes 修改模拟时间
+          this.list = res.data.records.map(item => {
+            let startDate = 2022 + '-' + '11-' + Random.integer(1, 29)
+            let startHour = Random.integer(1, 22)
+            return {
+              ...item,
+              inspectionStartTime:
+                startDate + ' ' + (startHour < 10 ? '0' + startHour : '' + startHour) + Random.datetime(':mm:ss'),
+              inspectionEndTime:
+                startDate +
+                ' ' +
+                (startHour + 1 < 10 ? +'0' + (startHour + 1) : 1 + startHour + '') +
+                Random.datetime(':mm:ss')
+            }
+          })
+          // console.log('list;', this.list)
           this.equipmentInspectionId = this.list[0].id
+
           this.getInspectionItem()
         } else {
           this.list = []
@@ -299,7 +330,8 @@ export default {
         })
       }
     },
-    selectRow(val) { // 点击左侧列表
+    selectRow(val) {
+      // 点击左侧列表
       this.equipmentInspectionId = val.id
       this.getInspectionItem()
     },
@@ -340,7 +372,7 @@ export default {
       })
     },
     handleClickR(raw) {
-      if ((raw.type === 'detail') || (raw.type === 'edit')) {
+      if (raw.type === 'detail' || raw.type === 'edit') {
         this.addOrUpdateVisibleR = true
         this.$nextTick(() => {
           this.$refs.addOrUpdateR.init(raw.data.id, raw.type)
@@ -351,23 +383,23 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-  .app-container {
-    padding-top: 0;
-    .left-container {
-      display: inline-block;
-      // width: 500px;
-      width: 50%;
-      border-right: 8px solid #f2f4f9;
-      height: 100%;
-      padding-top: 16px;
-    }
-    .right-container {
-      display: inline-block;
-      // width: calc(100% - 510px);
-      width: 49%;
-      vertical-align: top;
-      height: 100%;
-      padding-top: 23px;
-    }
+.app-container {
+  padding-top: 0;
+  .left-container {
+    display: inline-block;
+    // width: 500px;
+    width: 50%;
+    border-right: 8px solid #f2f4f9;
+    height: 100%;
+    padding-top: 16px;
   }
-  </style>
+  .right-container {
+    display: inline-block;
+    // width: calc(100% - 510px);
+    width: 49%;
+    vertical-align: top;
+    height: 100%;
+    padding-top: 23px;
+  }
+}
+</style>
diff --git a/src/views/EquipmentManager/mockData.js b/src/views/EquipmentManager/mockData.js
index 0f31e6f..93899ab 100644
--- a/src/views/EquipmentManager/mockData.js
+++ b/src/views/EquipmentManager/mockData.js
@@ -258,9 +258,9 @@ export const wwwOrderProps = [
 ]
 
 export const rightSideDatalist = [
-  { "orderId": "WOD20200807030135", "time": "2021-02-12 14:08:04", "eq": "磨边", "status": 3, "team": "白班", "duration": "26min" },
-  { "orderId": "WOD20200413103728", "time": "2020-11-26 20:11:39", "eq": "固化", "status": 1, "team": "夜班", "duration": "24min" },
-  { "orderId": "WOD20210217143647", "time": "2021-08-15 18:48:40", "eq": "预热", "status": 2, "team": "白班", "duration": "27min" },
+  { "orderId": "WOD20200807030135", "time": "2022-11-12 14:08:04", "eq": "磨边", "status": 3, "team": "白班", "duration": "26min" },
+  { "orderId": "WOD20210217143647", "time": "2022-11-15 18:48:40", "eq": "预热", "status": 2, "team": "白班", "duration": "27min" },
+  { "orderId": "WOD20200413103728", "time": "2022-11-26 20:11:39", "eq": "固化", "status": 1, "team": "夜班", "duration": "24min" },
 ]
 export const rightSideDatalist2 = [
   { "orderId": "WOD20220403013343", "pl": "A", "status": 3, "team": "白班", "duration": "24min" },
@@ -273,9 +273,9 @@ export const rightSideDatalist3 = [
   { "orderId": "WOD20220915050149", "eq": "磨边后清洗机", "status": 3, "team": "白班", "duration": "21min" },
 ]
 export const rightSideDatalist4 = [
-  { "orderId": "WOD20210522165229", "pl": "A", "status": 2, "team": "夜班", "time": "2021-12-17 13:31:24" },
-  { "orderId": "WOD20211205183921", "pl": "B", "status": 1, "team": "白班", "time": "2022-06-27 10:52:19" },
+  { "orderId": "WOD20210522165229", "pl": "A", "status": 2, "team": "夜班", "time": "2022-12-17 13:31:24" },
   { "orderId": "WOD20210114183705", "pl": "A", "status": 1, "team": "夜班", "time": "2022-11-22 02:59:50" },
+  { "orderId": "WOD20211205183921", "pl": "B", "status": 1, "team": "白班", "time": "2022-11-27 10:52:19" },
 ]
 
 

From be18358b9c66186b3f1e49a9378c9e6fbf8d4d3c Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 15:19:13 +0800
Subject: [PATCH 12/28] =?UTF-8?q?update=20=E8=AE=BE=E5=A4=87=E5=BD=93?=
 =?UTF-8?q?=E5=89=8D=E7=8A=B6=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../EquipmentManager/equipmentMonitoring/currentState.vue    | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/views/EquipmentManager/equipmentMonitoring/currentState.vue b/src/views/EquipmentManager/equipmentMonitoring/currentState.vue
index 1f8ec69..1ca4c44 100644
--- a/src/views/EquipmentManager/equipmentMonitoring/currentState.vue
+++ b/src/views/EquipmentManager/equipmentMonitoring/currentState.vue
@@ -185,7 +185,10 @@ export default {
 
       list({ ...this.listQuery, pdlId, name }).then(response => {
         if (response.data.records) {
-          this.dataList = response.data.records
+          // this.dataList = response.data.records
+          // 11-mes 修改模拟数据
+          this.dataList = response.data.records.map(item => ({...item, error: '无故障'}))
+          
         } else {
           this.dataList.splice(0)
         }

From 123cdd59a5234f3eedd3234d0f0d45202ef6c7ff Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 15:30:56 +0800
Subject: [PATCH 13/28] =?UTF-8?q?update=20=E7=8F=AD=E7=BB=84=E4=BA=A4?=
 =?UTF-8?q?=E6=8E=A5=E7=8F=AD=E8=AE=B0=E5=BD=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/FactoryManage/TeamInfo.vue | 49 +++++++++++++++++-----------
 1 file changed, 30 insertions(+), 19 deletions(-)

diff --git a/src/views/FactoryManage/TeamInfo.vue b/src/views/FactoryManage/TeamInfo.vue
index 7d81e12..d2eb3da 100644
--- a/src/views/FactoryManage/TeamInfo.vue
+++ b/src/views/FactoryManage/TeamInfo.vue
@@ -8,10 +8,7 @@
 -->
 <template>
   <div class="app-container">
-    <head-form
-      :form-config="headFormConfig"
-      @headBtnClick="btnClick"
-    />
+    <head-form :form-config="headFormConfig" @headBtnClick="btnClick" />
     <base-table
       :top-btn-config="topBtnConfig"
       :page="listQuery.current"
@@ -21,12 +18,7 @@
       :is-loading="listLoading"
       @clickTopBtn="clickTopBtn"
     >
-      <method-btn
-        slot="handleBtn"
-        :width="trueWidth"
-        :method-list="tableBtn"
-        @clickBtn="handleClick"
-      />
+      <method-btn slot="handleBtn" :width="trueWidth" :method-list="tableBtn" @clickBtn="handleClick" />
     </base-table>
     <pagination
       v-show="total > 0"
@@ -35,11 +27,7 @@
       :limit.sync="listQuery.size"
       @pagination="getList()"
     />
-    <team-info-detail
-      v-if="addOrUpdateVisible"
-      ref="addOrUpdate"
-      @refreshDataList="getList"
-    />
+    <team-info-detail v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getList" />
     <team-info-add
       v-if="addVisible"
       ref="addNew"
@@ -61,6 +49,7 @@ import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
 import { timeFormatter } from '@/filters'
 import i18n from '@/lang'
 // import data from '../pdf/content'
+import { Random } from 'mockjs'
 
 /**
  * 表格表头配置项 TypeScript接口注释
@@ -218,9 +207,31 @@ export default {
       this.listQuery.planHandoverEndTime = this.headFormValue.timeSlot ? this.headFormValue.timeSlot[1] : ''
       this.$nextTick(() => {
         this.listLoading = true
-        list(this.listQuery).then((response) => {
+        list(this.listQuery).then(response => {
           if (response.data.records) {
-            this.list = response.data.records
+            // this.list = response.data.records
+            // 11-mes 数据模拟修改
+
+            this.list = response.data.records.map(item => {
+              let startDate = 2022 + '-' + '11-' + Random.integer(1, 29)
+              let endDate = startDate.split('-')
+              endDate[2] = +endDate[2] + Random.integer(0, 3)
+
+              let startHour = Random.integer(1, 22)
+
+              return {
+                ...item,
+                planHandoverTime:
+                  startDate + ' ' + (startHour < 10 ? '0' + startHour : '' + startHour) + Random.datetime(':mm:ss'),
+                planOfflineTime:
+                  endDate.join('-') +
+                  ' ' +
+                  (startHour + 1 < 10 ? +'0' + (startHour + 1) : 1 + startHour + '') +
+                  Random.datetime(':mm:ss')
+              }
+            })
+
+            console.log("list;', ", this.list)
           } else {
             this.list.splice(0, this.list.length)
           }
@@ -263,7 +274,7 @@ export default {
           const blob = new Blob([response.data])
           const reader = new FileReader()
           reader.readAsDataURL(blob)
-          reader.onload = (e) => {
+          reader.onload = e => {
             const a = document.createElement('a')
             a.download = fileName
             a.href = e.target.result
@@ -285,7 +296,7 @@ export default {
     },
     clickTopBtn(val) {
       if (val === 'add') {
-        this.addNewInfo()// 新增
+        this.addNewInfo() // 新增
       }
     }
   }

From e756b39e6c69a1aecaad76fa5a6db294a4c22329 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 15:33:08 +0800
Subject: [PATCH 14/28] =?UTF-8?q?update=20=E7=94=9F=E4=BA=A7=E7=9B=91?=
 =?UTF-8?q?=E6=8E=A7=E5=AE=9E=E6=97=B6=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../FactoryManage/RealtimeDataOfOrder.vue     | 31 ++++++++++---------
 1 file changed, 16 insertions(+), 15 deletions(-)

diff --git a/src/views/FactoryManage/RealtimeDataOfOrder.vue b/src/views/FactoryManage/RealtimeDataOfOrder.vue
index 6ac26d6..95bc4a3 100644
--- a/src/views/FactoryManage/RealtimeDataOfOrder.vue
+++ b/src/views/FactoryManage/RealtimeDataOfOrder.vue
@@ -147,21 +147,22 @@ export default {
       fetchList('order').then(response => {
         if (response.data) {
           this.dataList = response.data
-          this.dataList.push({
-            orderName: '22订单',
-            productName: 'xxx光伏玻璃2.0B',
-            productSize: '2*1128*2272',
-            productionLine: 'C线 D线 A线',
-            det: Array(3).fill({
-              inputNum: '-259730',
-              outputNum: '-772443',
-              passRate: 100,
-              recordTime: '2022-09-06T14:00:00',
-              scrapNum: '0',
-              sumInputNum: '259730',
-              sumOutputNum: '772443'
-            })
-          })
+          // 11-mes:
+          // this.dataList.push({
+          //   orderName: '22订单',
+          //   productName: 'xxx光伏玻璃2.0B',
+          //   productSize: '2*1128*2272',
+          //   productionLine: 'C线 D线 A线',
+          //   det: Array(3).fill({
+          //     inputNum: '-259730',
+          //     outputNum: '-772443',
+          //     passRate: 100,
+          //     recordTime: '2022-09-06T14:00:00',
+          //     scrapNum: '0',
+          //     sumInputNum: '259730',
+          //     sumOutputNum: '772443'
+          //   })
+          // })
           this.transformData()
         } else {
           this.dataList.splice(0)

From df8ffa3676fa8b4914ccc7f121f09f43cab463f0 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 16:08:20 +0800
Subject: [PATCH 15/28] =?UTF-8?q?update=203d=20=E8=AE=BE=E5=A4=87=E6=95=B0?=
 =?UTF-8?q?=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/LeftContentEquipmentCheck.vue  |  44 +++---
 src/views/3DOverview/v3dApp/data.js           | 132 +++++++++---------
 2 files changed, 88 insertions(+), 88 deletions(-)

diff --git a/src/views/3DOverview/components/LeftContentEquipmentCheck.vue b/src/views/3DOverview/components/LeftContentEquipmentCheck.vue
index c4d6a14..f4a2e85 100644
--- a/src/views/3DOverview/components/LeftContentEquipmentCheck.vue
+++ b/src/views/3DOverview/components/LeftContentEquipmentCheck.vue
@@ -53,31 +53,31 @@ const PriorityComponent = {
 
 const tableProps = [
   { prop: 'eqName', label: '设备名称', align: 'center', 'min-width': 120 },
-  { prop: 'pl', label: '所属产线', align: 'center', 'min-width': 100 },
-  { prop: 'warningLevel', label: '提示等级', align: 'center', 'min-width': 100, subcomponent: PriorityComponent },
+  // { prop: 'pl', label: '所属产线', align: 'center', 'min-width': 100 },
+  { prop: 'warningLevel', label: '提示等级', align: 'center', 'min-width': 70, subcomponent: PriorityComponent },
   { prop: 'checkContent', label: '巡检内容', align: 'center', 'min-width': 120 }
 ]
 const tableData = [
-  { eqName: '钢化', pl: 'A', priority: 1, checkContent: '表面检测光源和相机的卫生' },
-  { eqName: '一镀', pl: 'A', priority: 1, checkContent: '辊道下方的碎玻璃清理' },
-  { eqName: '钢化', pl: 'B', priority: 3, checkContent: '边角检测设备水平的校正' },
-  { eqName: '冷却', pl: 'B', priority: 2, checkContent: '表面检测光源和相机的卫生' },
-  { eqName: '预热', pl: 'A', priority: 1, checkContent: '辊道下方的碎玻璃清理' },
-  { eqName: '钢后清洗机', pl: 'B', priority: 3, checkContent: '检查每日不良是否存在误检' },
-  { eqName: '磨边', pl: 'B', priority: 3, checkContent: '设备表面的卫生' },
-  { eqName: '打孔', pl: 'B', priority: 2, checkContent: '边角检测光源和相机的卫生' },
-  { eqName: '磨边后清洗机', pl: 'B', priority: 1, checkContent: '边角检测光源和相机的卫生' },
-  { eqName: '冷却', pl: 'B', priority: 1, checkContent: '辊道下方的碎玻璃清理' },
-  { eqName: '丝印', pl: 'B', priority: 3, checkContent: '操作台保持整洁' },
-  { eqName: '丝印', pl: 'A', priority: 2, checkContent: '检查每日不良是否存在误检' },
-  { eqName: '钢化', pl: 'B', priority: 2, checkContent: '检查每日不良是否存在误检' },
-  { eqName: '冷却', pl: 'A', priority: 2, checkContent: '辊道下方的碎玻璃清理' },
-  { eqName: '下片', pl: 'A', priority: 1, checkContent: '水冷机内水量充足并且清洁' },
-  { eqName: '钢化', pl: 'A', priority: 2, checkContent: '操作台保持整洁' },
-  { eqName: '预热', pl: 'B', priority: 3, checkContent: '水冷机内水量充足并且清洁' },
-  { eqName: '磨边后清洗机', pl: 'A', priority: 2, checkContent: '水冷机内水量充足并且清洁' },
-  { eqName: '上片', pl: 'B', priority: 3, checkContent: '边角检测光源和相机的卫生' },
-  { eqName: '预热', pl: 'A', priority: 2, checkContent: '表面检测光源和相机的卫生' }
+  { eqName: 'A1钢化', pl: 'A', priority: 1, checkContent: '表面检测光源和相机的卫生' },
+  // { eqName: '一镀', pl: 'A', priority: 1, checkContent: '辊道下方的碎玻璃清理' },
+  { eqName: 'B2钢化', pl: 'B', priority: 3, checkContent: '边角检测设备水平的校正' },
+  { eqName: 'B1冷却机', pl: 'B', priority: 2, checkContent: '表面检测光源和相机的卫生' },
+  // { eqName: '预热', pl: 'A', priority: 1, checkContent: '辊道下方的碎玻璃清理' },
+  { eqName: 'B1钢后清洗机', pl: 'B', priority: 3, checkContent: '检查每日不良是否存在误检' },
+  { eqName: 'B2磨边', pl: 'B', priority: 3, checkContent: '设备表面的卫生' },
+  { eqName: 'B1打孔', pl: 'B', priority: 2, checkContent: '边角检测光源和相机的卫生' },
+  { eqName: 'B1磨边后清洗机', pl: 'B', priority: 1, checkContent: '边角检测光源和相机的卫生' },
+  // { eqName: '冷却', pl: 'B', priority: 1, checkContent: '辊道下方的碎玻璃清理' },
+  // { eqName: '丝印', pl: 'B', priority: 3, checkContent: '操作台保持整洁' },
+  // { eqName: '丝印', pl: 'A', priority: 2, checkContent: '检查每日不良是否存在误检' },
+  { eqName: 'B1钢化', pl: 'B', priority: 2, checkContent: '检查每日不良是否存在误检' },
+  // { eqName: '冷却', pl: 'A', priority: 2, checkContent: '辊道下方的碎玻璃清理' },
+  { eqName: 'A1下片', pl: 'A', priority: 1, checkContent: '水冷机内水量充足并且清洁' },
+  { eqName: 'A2钢化', pl: 'A', priority: 2, checkContent: '操作台保持整洁' },
+  // { eqName: '预热', pl: 'B', priority: 3, checkContent: '水冷机内水量充足并且清洁' },
+  { eqName: 'A3磨边后清洗机', pl: 'A', priority: 2, checkContent: '水冷机内水量充足并且清洁' },
+  { eqName: 'B3上片', pl: 'B', priority: 3, checkContent: '边角检测光源和相机的卫生' },
+  // { eqName: '预热', pl: 'A', priority: 2, checkContent: '表面检测光源和相机的卫生' }
 ]
 
 export default {
diff --git a/src/views/3DOverview/v3dApp/data.js b/src/views/3DOverview/v3dApp/data.js
index b171d3c..886fab9 100644
--- a/src/views/3DOverview/v3dApp/data.js
+++ b/src/views/3DOverview/v3dApp/data.js
@@ -1,73 +1,73 @@
 export default [
-  { id: 'C1-0', pl: 'A', name: '上片', amount: 32, status: '生产中' },
-  { id: 'C1-1', pl: 'A', name: '磨边', amount: 32, status: '生产中' },
-  { id: 'C1-2', pl: 'A', name: '磨边', amount: 32, status: '调试中' },
-  { id: 'C1-3', pl: 'A', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C1-4', pl: 'A', name: '打孔', amount: 32, status: '生产中' },
-  { id: 'C1-5', pl: 'A', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C1-6', pl: 'A', name: '丝印', amount: 32, status: '生产中' },
-  { id: 'C1-7', pl: 'A', name: '固化', amount: 32, status: '生产中' },
-  { id: 'C1-8', pl: 'A', name: '储片', amount: 32, status: '生产中' },
-  { id: 'C1-9', pl: 'A', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C1-10', pl: 'A', name: '下片', amount: 32, status: '生产中' },
+  { id: 'C1-0', pl: 'A1', name: 'A1上片', amount: 32, status: '生产中' },
+  { id: 'C1-1', pl: 'A1', name: 'A1磨边', amount: 32, status: '生产中' },
+  { id: 'C1-2', pl: 'A1', name: 'A1磨边后清洗', amount: 32, status: '调试中' },
+  { id: 'C1-3', pl: 'A1', name: 'A1打孔', amount: 32, status: '生产中' },
+  { id: 'C1-4', pl: 'A1', name: 'A1打孔后清洗', amount: 32, status: '生产中' },
+  { id: 'C1-5', pl: 'A1', name: 'A1丝印', amount: 32, status: '生产中' },
+  { id: 'C1-6', pl: 'A1', name: 'A1固化', amount: 32, status: '生产中' },
+  { id: 'C1-7', pl: 'A1', name: 'A1储片', amount: 32, status: '生产中' },
+  { id: 'C1-8', pl: 'A1', name: 'A1钢化', amount: 32, status: '生产中' },
+  { id: 'C1-9', pl: 'A1', name: 'A1钢化后清洗', amount: 32, status: '生产中' },
+  { id: 'C1-10', pl: 'A1', name: 'A1下片', amount: 32, status: '生产中' },
 
-  { id: 'C2-0', pl: 'B', name: '上片', amount: 32, status: '调试中' },
-  { id: 'C2-1', pl: 'B', name: '磨边', amount: 32, status: '生产中' },
-  { id: 'C2-2', pl: 'B', name: '磨边', amount: 32, status: '调试中' },
-  { id: 'C2-3', pl: 'B', name: '清洗', amount: 32, status: '调试中' },
-  { id: 'C2-4', pl: 'B', name: '打孔', amount: 32, status: '调试中' },
-  { id: 'C2-5', pl: 'B', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C2-6', pl: 'B', name: '丝印', amount: 32, status: '生产中' },
-  { id: 'C2-7', pl: 'B', name: '固化', amount: 32, status: '生产中' },
-  { id: 'C2-8', pl: 'B', name: '储片', amount: 32, status: '生产中' },
-  { id: 'C2-9', pl: 'B', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C2-10', pl: 'B', name: '下片', amount: 32, status: '生产中' },
+  { id: 'C2-0', pl: 'A2', name: 'A2上片', amount: 32, status: '调试中' },
+  { id: 'C2-1', pl: 'A2', name: 'A2磨边', amount: 32, status: '生产中' },
+  { id: 'C2-2', pl: 'A2', name: 'A2磨边后清洗', amount: 32, status: '调试中' },
+  { id: 'C2-3', pl: 'A2', name: 'A2打孔', amount: 32, status: '调试中' },
+  { id: 'C2-4', pl: 'A2', name: 'A2打孔后清洗', amount: 32, status: '调试中' },
+  { id: 'C2-5', pl: 'A2', name: 'A2丝印', amount: 32, status: '生产中' },
+  { id: 'C2-6', pl: 'A2', name: 'A2固化', amount: 32, status: '生产中' },
+  { id: 'C2-7', pl: 'A2', name: 'A2储片', amount: 32, status: '生产中' },
+  { id: 'C2-8', pl: 'A2', name: 'A2钢化', amount: 32, status: '生产中' },
+  { id: 'C2-9', pl: 'A2', name: 'A2钢化后清洗', amount: 32, status: '生产中' },
+  { id: 'C2-10', pl: 'A2', name: 'A2下片', amount: 32, status: '生产中' },
 
-  { id: 'C3-0', pl: 'C', name: '上片', amount: 32, status: '生产中' },
-  { id: 'C3-1', pl: 'C', name: '磨边', amount: 32, status: '生产中' },
-  { id: 'C3-2', pl: 'C', name: '磨边', amount: 32, status: '生产中' },
-  { id: 'C3-3', pl: 'C', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C3-4', pl: 'C', name: '打孔', amount: 32, status: '生产中' },
-  { id: 'C3-5', pl: 'C', name: '清洗', amount: 32, status: '故障' },
-  { id: 'C3-6', pl: 'C', name: '丝印', amount: 32, status: '生产中' },
-  { id: 'C3-7', pl: 'C', name: '固化', amount: 32, status: '生产中' },
-  { id: 'C3-8', pl: 'C', name: '储片', amount: 32, status: '生产中' },
-  { id: 'C3-9', pl: 'C', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C3-10', pl: 'C', name: '下片', amount: 32, status: '生产中' },
+  { id: 'C3-0', pl: 'A3', name: 'A1上片', amount: 32, status: '生产中' },
+  { id: 'C3-1', pl: 'A3', name: 'A1磨边', amount: 32, status: '生产中' },
+  { id: 'C3-2', pl: 'A3', name: 'A1磨边后清洗', amount: 32, status: '生产中' },
+  { id: 'C3-3', pl: 'A3', name: 'A1打孔', amount: 32, status: '生产中' },
+  { id: 'C3-4', pl: 'A3', name: 'A1打孔后清洗', amount: 32, status: '生产中' },
+  { id: 'C3-5', pl: 'A3', name: 'A1丝印', amount: 32, status: '故障' },
+  { id: 'C3-6', pl: 'A3', name: 'A1固化', amount: 32, status: '生产中' },
+  { id: 'C3-7', pl: 'A3', name: 'A1储片', amount: 32, status: '生产中' },
+  { id: 'C3-8', pl: 'A3', name: 'A1钢化', amount: 32, status: '生产中' },
+  { id: 'C3-9', pl: 'A3', name: 'A1钢化后清洗', amount: 32, status: '生产中' },
+  { id: 'C3-10', pl: 'A3', name: 'A1下片', amount: 32, status: '生产中' },
 
-  { id: 'C4-0', pl: 'D', name: '上片', amount: 32, status: '故障' },
-  { id: 'C4-1', pl: 'D', name: '磨边', amount: 32, status: '生产中' },
-  { id: 'C4-2', pl: 'D', name: '磨边', amount: 32, status: '生产中' },
-  { id: 'C4-3', pl: 'D', name: '清洗', amount: 32, status: '故障' },
-  { id: 'C4-4', pl: 'D', name: '打孔', amount: 32, status: '故障' },
-  { id: 'C4-5', pl: 'D', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C4-6', pl: 'D', name: '丝印', amount: 32, status: '生产中' },
-  { id: 'C4-7', pl: 'D', name: '固化', amount: 32, status: '生产中' },
-  { id: 'C4-8', pl: 'D', name: '储片', amount: 32, status: '生产中' },
-  { id: 'C4-9', pl: 'D', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C4-10', pl: 'D', name: '下片', amount: 32, status: '生产中' },
+  { id: 'C4-0', pl: 'D', name: 'A1上片', amount: 32, status: '故障' },
+  { id: 'C4-1', pl: 'D', name: 'A1磨边', amount: 32, status: '生产中' },
+  { id: 'C4-2', pl: 'D', name: 'A1磨边后清洗', amount: 32, status: '生产中' },
+  { id: 'C4-3', pl: 'D', name: 'A1打孔', amount: 32, status: '故障' },
+  { id: 'C4-4', pl: 'D', name: 'A1打孔后清洗', amount: 32, status: '故障' },
+  { id: 'C4-5', pl: 'D', name: 'A1丝印', amount: 32, status: '生产中' },
+  { id: 'C4-6', pl: 'D', name: 'A1固化', amount: 32, status: '生产中' },
+  { id: 'C4-7', pl: 'D', name: 'A1储片', amount: 32, status: '生产中' },
+  { id: 'C4-8', pl: 'D', name: 'A1钢化', amount: 32, status: '生产中' },
+  { id: 'C4-9', pl: 'D', name: 'A1钢化后清洗', amount: 32, status: '生产中' },
+  { id: 'C4-10', pl: 'D', name: 'A1下片', amount: 32, status: '生产中' },
 
-  { id: 'C5-0', pl: 'E', name: '上片', amount: 32, status: '生产中' },
-  { id: 'C5-1', pl: 'E', name: '磨边', amount: 32, status: '生产中' },
-  { id: 'C5-2', pl: 'E', name: '磨边', amount: 32, status: '生产中' },
-  { id: 'C5-3', pl: 'E', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C5-4', pl: 'E', name: '打孔', amount: 32, status: '生产中' },
-  { id: 'C5-5', pl: 'E', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C5-6', pl: 'E', name: '丝印', amount: 32, status: '生产中' },
-  { id: 'C5-7', pl: 'E', name: '固化', amount: 32, status: '生产中' },
-  { id: 'C5-8', pl: 'E', name: '储片', amount: 32, status: '生产中' },
-  { id: 'C5-9', pl: 'E', name: '清洗', amount: 32, status: '生产中' },
-  // { id: 'C5-10', pl: 'E', name: '下片', amount: 32, status: '生产中' },
+  { id: 'C5-0', pl: 'E', name: 'A1上片', amount: 32, status: '生产中' },
+  { id: 'C5-1', pl: 'E', name: 'A1磨边', amount: 32, status: '生产中' },
+  { id: 'C5-2', pl: 'E', name: 'A1磨边后清洗', amount: 32, status: '生产中' },
+  { id: 'C5-3', pl: 'E', name: 'A1打孔', amount: 32, status: '生产中' },
+  { id: 'C5-4', pl: 'E', name: 'A1打孔后清洗', amount: 32, status: '生产中' },
+  { id: 'C5-5', pl: 'E', name: 'A1丝印', amount: 32, status: '生产中' },
+  { id: 'C5-6', pl: 'E', name: 'A1固化', amount: 32, status: '生产中' },
+  { id: 'C5-7', pl: 'E', name: 'A1储片', amount: 32, status: '生产中' },
+  { id: 'C5-8', pl: 'E', name: 'A1钢化', amount: 32, status: '生产中' },
+  { id: 'C5-9', pl: 'E', name: 'A1钢化后清洗', amount: 32, status: '生产中' },
+  // { id: 'C5-10', pl: 'E', name: 'A1下片', amount: 32, status: '生产中' },
 
-  { id: 'C6-0', pl: 'F', name: '上片', amount: 32, status: '生产中' },
-  { id: 'C6-1', pl: 'F', name: '磨边', amount: 32, status: '生产中' },
-  { id: 'C6-2', pl: 'F', name: '磨边', amount: 32, status: '生产中' },
-  { id: 'C6-3', pl: 'F', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C6-4', pl: 'F', name: '打孔', amount: 32, status: '生产中' },
-  { id: 'C6-5', pl: 'F', name: '清洗', amount: 32, status: '生产中' },
-  { id: 'C6-6', pl: 'F', name: '丝印', amount: 32, status: '生产中' },
-  { id: 'C6-7', pl: 'F', name: '固化', amount: 32, status: '故障' },
-  { id: 'C6-8', pl: 'F', name: '储片', amount: 32, status: '故障' },
-  // { id: 'C6-9', pl: 'F', name: '清洗', amount: 32, status: '生产中' },
-  // { id: 'C6-10', pl: 'F', name: '下片', amount: 32, status: '生产中' },
+  { id: 'C6-0', pl: 'F', name: 'A1上片', amount: 32, status: '生产中' },
+  { id: 'C6-1', pl: 'F', name: 'A1磨边', amount: 32, status: '生产中' },
+  { id: 'C6-2', pl: 'F', name: 'A1磨边后清洗', amount: 32, status: '生产中' },
+  { id: 'C6-3', pl: 'F', name: 'A1打孔', amount: 32, status: '生产中' },
+  { id: 'C6-4', pl: 'F', name: 'A1打孔后清洗', amount: 32, status: '生产中' },
+  { id: 'C6-5', pl: 'F', name: 'A1丝印', amount: 32, status: '生产中' },
+  { id: 'C6-6', pl: 'F', name: 'A1固化', amount: 32, status: '生产中' },
+  { id: 'C6-7', pl: 'F', name: 'A1储片', amount: 32, status: '故障' },
+  { id: 'C6-8', pl: 'F', name: 'A1钢化', amount: 32, status: '故障' },
+  // { id: 'C6-9', pl: 'F', name: 'A1钢化后清洗', amount: 32, status: '生产中' },
+  // { id: 'C6-10', pl: 'F', name: 'A1下片', amount: 32, status: '生产中' },
 ]
\ No newline at end of file

From c94348182628d2e3d22693d90805480faec4b600 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 16:11:48 +0800
Subject: [PATCH 16/28] =?UTF-8?q?update=20=E8=B4=A8=E9=87=8F=EF=BC=8C?=
 =?UTF-8?q?=E4=BA=A7=E5=93=81=E6=88=90=E5=93=81=E7=8E=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/QualityManager/HomePage.vue                        | 2 +-
 src/views/QualityManager/components/productionRateHeader.vue | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/views/QualityManager/HomePage.vue b/src/views/QualityManager/HomePage.vue
index 7956494..47eaea9 100644
--- a/src/views/QualityManager/HomePage.vue
+++ b/src/views/QualityManager/HomePage.vue
@@ -186,7 +186,7 @@
                 </div>
                 <div class="" style="width: calc(400px * var(--beilv)); flex: 1;">
                   <techy-box class="" style="padding: 0 calc(16px * var(--beilv));">
-                    <productionRateHeader @update-data="str => dataUpdateToken = str">产品成品率</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>
diff --git a/src/views/QualityManager/components/productionRateHeader.vue b/src/views/QualityManager/components/productionRateHeader.vue
index f75b755..7302b59 100644
--- a/src/views/QualityManager/components/productionRateHeader.vue
+++ b/src/views/QualityManager/components/productionRateHeader.vue
@@ -114,7 +114,7 @@
             :class="{ 'date-select__active': dateMode === 'day' }"
             @click="
               dateMode = 'day'
-              $emit('update-data', '' + Math.random())
+              $emit('update-data', { str: '' + Math.random(), mode: dateMode })
             "
           >
             日
@@ -123,7 +123,7 @@
             :class="{ 'date-select__active': dateMode === 'month' }"
             @click="
               dateMode = 'month'
-              $emit('update-data', '' + Math.random())
+              $emit('update-data', { str: '' + Math.random(), mode: dateMode })
             "
           >
             月

From 705da46633d9b6131143a4610c6132e94347bee6 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 16:31:23 +0800
Subject: [PATCH 17/28] =?UTF-8?q?update=203d=EF=BC=8C=E5=AE=9E=E6=97=B6?=
 =?UTF-8?q?=E4=BA=A7=E9=87=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/RightContentAlert.vue          |  2 +-
 .../components/RightContentProductRate.vue    | 31 +++---
 .../RightContentRealtimeProduction.vue        | 97 ++++++++++++++++---
 3 files changed, 94 insertions(+), 36 deletions(-)

diff --git a/src/views/3DOverview/components/RightContentAlert.vue b/src/views/3DOverview/components/RightContentAlert.vue
index 826a944..a90acb2 100644
--- a/src/views/3DOverview/components/RightContentAlert.vue
+++ b/src/views/3DOverview/components/RightContentAlert.vue
@@ -53,7 +53,7 @@ const PriorityComponent = {
 
 const tableProps = [
   { prop: 'eqName', label: '设备名称', align: 'center', 'min-width': 90 },
-  { prop: 'plName', label: '所属产线', align: 'center', 'min-width': 90 },
+  // { prop: 'plName', label: '所属产线', align: 'center', 'min-width': 90 },
   { prop: 'priority', label: '提示等级', align: 'center', 'min-width': 90, subcomponent: PriorityComponent },
   { prop: 'content', label: '巡检内容', align: 'center', 'min-width': 120 },
   { prop: 'duration', label: '累计时间(min)', align: 'center', 'min-width': 125 }
diff --git a/src/views/3DOverview/components/RightContentProductRate.vue b/src/views/3DOverview/components/RightContentProductRate.vue
index 0f7bf3c..2f6c9f7 100644
--- a/src/views/3DOverview/components/RightContentProductRate.vue
+++ b/src/views/3DOverview/components/RightContentProductRate.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() {
@@ -51,13 +52,16 @@ class ChartOption {
       formatter: '{b}<br/>{a0}: {c}%<br />{a1}: {c1}%'
     }
 
+    let d = new Date()
     this.xAxis = {
       type: 'category',
       boundaryGap: false,
       // data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
-      data: Array(12)
+      data: Array(7)
         .fill(0)
-        .map((_, idx) => (idx >= 10 ? idx : '0' + idx) + ':00'),
+        .map((_, idx) => {
+          return d.getMonth() + 1 + '-' + (d.getDate() + idx)
+        }),
       axisTick: {
         show: false
       },
@@ -74,7 +78,8 @@ class ChartOption {
     this.yAxis = {
       type: 'value',
       name: '成品率              ',
-      min: 'dataMin',
+      // min: 'dataMin',
+      min: 50,
       splitNumber: 3,
       nameTextStyle: {
         color: '#fff9',
@@ -121,15 +126,9 @@ class ChartOption {
             global: false // 缺省为 false
           }
         },
-        data: Array(12)
+        data: Array(7)
           .fill(0)
-          .map(_ => {
-            let v = Math.floor(Math.random() * 100)
-            while (v < 80) {
-              v = Math.floor(Math.random() * 100)
-            }
-            return v
-          })
+          .map(_ => Random.integer(93, 98))
       },
       {
         name: 'B',
@@ -155,15 +154,9 @@ class ChartOption {
             global: false // 缺省为 false
           }
         },
-        data: Array(12)
+        data: Array(7)
           .fill(0)
-          .map(_ => {
-            let v = Math.floor(Math.random() * 100)
-            while (v < 80) {
-              v = Math.floor(Math.random() * 100)
-            }
-            return v
-          })
+          .map(_ => Random.integer(93, 98))
       }
     ]
   }
diff --git a/src/views/3DOverview/components/RightContentRealtimeProduction.vue b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
index 63c8e2f..3541f64 100644
--- a/src/views/3DOverview/components/RightContentRealtimeProduction.vue
+++ b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
@@ -19,17 +19,7 @@ import { Random } from 'mockjs'
 
 class ChartOption {
   constructor() {
-    const wenduData = Array(12)
-      .fill(1)
-      .map(_ => Random.integer(30, 100))
-    const dianyaData = Array(12)
-      .fill(1)
-      .map(_ => Random.integer(30, 100))
-    const dianliuData = Array(12)
-      .fill(1)
-      .map(_ => Random.integer(30, 100))
-
-    this.color = ['#1A99FF', '#F0D63C', '#E02094']
+    this.color = ['#1A99FF', '#F0D63C', '#E02094', '#559833']
 
     this.legend = {
       top: 28,
@@ -62,9 +52,14 @@ class ChartOption {
       extraCssText: 'width: calc(100px*var(--beilv)) !important;'
     }
 
+    let d = new Date()
     this.xAxis = {
       type: 'category',
-      data: ['01:00', '02:00', '03:00', '04:00', '05:00', '06:00', '07:00', '08:00', '09:00', '10:00'],
+      data: Array(7)
+        .fill(1)
+        .map((_, idx) => {
+          return d.getMonth() + 1 + '-' + (d.getDate() + idx)
+        }),
       axisTick: { show: false },
       axisLabel: {
         color: '#fff9',
@@ -138,14 +133,16 @@ class ChartOption {
 
     this.series = [
       {
-        name: '产线1',
+        name: 'A能耗',
         type: 'line',
         yAxisIndex: 0,
         // smooth: true,
         emphasis: {
           focus: 'series'
         },
-        data: dianliuData,
+        data: Array(7)
+          .fill(0)
+          .map(_ => Random.integer(30, 100)),
         symbol: 'none',
         areaStyle: {
           color: {
@@ -169,14 +166,16 @@ class ChartOption {
         }
       },
       {
-        name: '产线2',
+        name: 'A产量',
         type: 'line',
         yAxisIndex: 1,
         // smooth: true,
         emphasis: {
           focus: 'series'
         },
-        data: dianyaData,
+        data: Array(7)
+          .fill(0)
+          .map(_ => Random.integer(30, 100)),
         symbol: 'none',
         areaStyle: {
           color: {
@@ -198,6 +197,72 @@ class ChartOption {
             global: false // 缺省为 false
           }
         }
+      },
+      {
+        name: 'B能耗',
+        type: 'line',
+        yAxisIndex: 0,
+        // smooth: true,
+        emphasis: {
+          focus: 'series'
+        },
+        data: Array(7)
+          .fill(0)
+          .map(_ => Random.integer(30, 100)),
+        symbol: 'none',
+        areaStyle: {
+          color: {
+            type: 'linear',
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: '#E0209466' // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: 'transparent' // 100% 处的颜色
+              }
+            ],
+            global: false // 缺省为 false
+          }
+        }
+      },
+      {
+        name: 'B产量',
+        type: 'line',
+        yAxisIndex: 1,
+        // smooth: true,
+        emphasis: {
+          focus: 'series'
+        },
+        data: Array(7)
+          .fill(0)
+          .map(_ => Random.integer(30, 100)),
+        symbol: 'none',
+        areaStyle: {
+          color: {
+            type: 'linear',
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: '#55983366' // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: 'transparent' // 100% 处的颜色
+              }
+            ],
+            global: false // 缺省为 false
+          }
+        }
       }
     ]
   }

From 71e6f2eb85fc0218e418e806e934a35851719cf5 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 16:36:51 +0800
Subject: [PATCH 18/28] =?UTF-8?q?update=203d=20=E8=AE=BE=E5=A4=87=E6=95=B0?=
 =?UTF-8?q?=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/3DOverview/v3dApp/data.js | 89 +++++++++++++----------------
 1 file changed, 41 insertions(+), 48 deletions(-)

diff --git a/src/views/3DOverview/v3dApp/data.js b/src/views/3DOverview/v3dApp/data.js
index 886fab9..8388e62 100644
--- a/src/views/3DOverview/v3dApp/data.js
+++ b/src/views/3DOverview/v3dApp/data.js
@@ -7,7 +7,7 @@ export default [
   { id: 'C1-5', pl: 'A1', name: 'A1丝印', amount: 32, status: '生产中' },
   { id: 'C1-6', pl: 'A1', name: 'A1固化', amount: 32, status: '生产中' },
   { id: 'C1-7', pl: 'A1', name: 'A1储片', amount: 32, status: '生产中' },
-  { id: 'C1-8', pl: 'A1', name: 'A1钢化', amount: 32, status: '生产中' },
+  { id: 'C1-8', pl: 'A1', name: 'A钢化', amount: 32, status: '生产中' },
   { id: 'C1-9', pl: 'A1', name: 'A1钢化后清洗', amount: 32, status: '生产中' },
   { id: 'C1-10', pl: 'A1', name: 'A1下片', amount: 32, status: '生产中' },
 
@@ -19,55 +19,48 @@ export default [
   { id: 'C2-5', pl: 'A2', name: 'A2丝印', amount: 32, status: '生产中' },
   { id: 'C2-6', pl: 'A2', name: 'A2固化', amount: 32, status: '生产中' },
   { id: 'C2-7', pl: 'A2', name: 'A2储片', amount: 32, status: '生产中' },
-  { id: 'C2-8', pl: 'A2', name: 'A2钢化', amount: 32, status: '生产中' },
-  { id: 'C2-9', pl: 'A2', name: 'A2钢化后清洗', amount: 32, status: '生产中' },
-  { id: 'C2-10', pl: 'A2', name: 'A2下片', amount: 32, status: '生产中' },
+  { id: 'C2-8', pl: 'A2', name: 'A2钢化后清洗', amount: 32, status: '生产中' },
+  { id: 'C2-9', pl: 'A2', name: 'A2下片', amount: 32, status: '生产中' },
 
-  { id: 'C3-0', pl: 'A3', name: 'A1上片', amount: 32, status: '生产中' },
-  { id: 'C3-1', pl: 'A3', name: 'A1磨边', amount: 32, status: '生产中' },
-  { id: 'C3-2', pl: 'A3', name: 'A1磨边后清洗', amount: 32, status: '生产中' },
-  { id: 'C3-3', pl: 'A3', name: 'A1打孔', amount: 32, status: '生产中' },
-  { id: 'C3-4', pl: 'A3', name: 'A1打孔后清洗', amount: 32, status: '生产中' },
-  { id: 'C3-5', pl: 'A3', name: 'A1丝印', amount: 32, status: '故障' },
-  { id: 'C3-6', pl: 'A3', name: 'A1固化', amount: 32, status: '生产中' },
-  { id: 'C3-7', pl: 'A3', name: 'A1储片', amount: 32, status: '生产中' },
-  { id: 'C3-8', pl: 'A3', name: 'A1钢化', amount: 32, status: '生产中' },
-  { id: 'C3-9', pl: 'A3', name: 'A1钢化后清洗', amount: 32, status: '生产中' },
-  { id: 'C3-10', pl: 'A3', name: 'A1下片', amount: 32, status: '生产中' },
+  { id: 'C3-0', pl: 'A3', name: 'A3上片', amount: 32, status: '生产中' },
+  { id: 'C3-1', pl: 'A3', name: 'A3磨边', amount: 32, status: '生产中' },
+  { id: 'C3-2', pl: 'A3', name: 'A3磨边后清洗', amount: 32, status: '生产中' },
+  { id: 'C3-3', pl: 'A3', name: 'A3打孔', amount: 32, status: '生产中' },
+  { id: 'C3-4', pl: 'A3', name: 'A3打孔后清洗', amount: 32, status: '生产中' },
+  { id: 'C3-5', pl: 'A3', name: 'A3丝印', amount: 32, status: '故障' },
+  { id: 'C3-6', pl: 'A3', name: 'A3固化', amount: 32, status: '生产中' },
+  { id: 'C3-7', pl: 'A3', name: 'A3储片', amount: 32, status: '生产中' },
+  { id: 'C3-8', pl: 'A3', name: 'A3钢化后清洗', amount: 32, status: '生产中' },
+  { id: 'C3-9', pl: 'A3', name: 'A3下片', amount: 32, status: '生产中' },
 
-  { id: 'C4-0', pl: 'D', name: 'A1上片', amount: 32, status: '故障' },
-  { id: 'C4-1', pl: 'D', name: 'A1磨边', amount: 32, status: '生产中' },
-  { id: 'C4-2', pl: 'D', name: 'A1磨边后清洗', amount: 32, status: '生产中' },
-  { id: 'C4-3', pl: 'D', name: 'A1打孔', amount: 32, status: '故障' },
-  { id: 'C4-4', pl: 'D', name: 'A1打孔后清洗', amount: 32, status: '故障' },
-  { id: 'C4-5', pl: 'D', name: 'A1丝印', amount: 32, status: '生产中' },
-  { id: 'C4-6', pl: 'D', name: 'A1固化', amount: 32, status: '生产中' },
-  { id: 'C4-7', pl: 'D', name: 'A1储片', amount: 32, status: '生产中' },
-  { id: 'C4-8', pl: 'D', name: 'A1钢化', amount: 32, status: '生产中' },
-  { id: 'C4-9', pl: 'D', name: 'A1钢化后清洗', amount: 32, status: '生产中' },
-  { id: 'C4-10', pl: 'D', name: 'A1下片', amount: 32, status: '生产中' },
+  { id: 'C4-0', pl: 'B1', name: 'B1上片', amount: 32, status: '故障' },
+  { id: 'C4-1', pl: 'B1', name: 'B1磨边', amount: 32, status: '生产中' },
+  { id: 'C4-2', pl: 'B1', name: 'B1磨边后清洗', amount: 32, status: '生产中' },
+  { id: 'C4-3', pl: 'B1', name: 'B1打孔', amount: 32, status: '故障' },
+  { id: 'C4-4', pl: 'B1', name: 'B1打孔后清洗', amount: 32, status: '故障' },
+  { id: 'C4-5', pl: 'B1', name: 'B1丝印', amount: 32, status: '生产中' },
+  { id: 'C4-6', pl: 'B1', name: 'B1固化', amount: 32, status: '生产中' },
+  { id: 'C4-7', pl: 'B1', name: 'B1储片', amount: 32, status: '生产中' },
+  { id: 'C4-8', pl: 'B1', name: 'B钢化', amount: 32, status: '生产中' },
+  { id: 'C4-9', pl: 'B1', name: 'B1钢化后清洗', amount: 32, status: '生产中' },
+  { id: 'C4-10', pl: 'B1', name: 'B下片', amount: 32, status: '生产中' },
 
-  { id: 'C5-0', pl: 'E', name: 'A1上片', amount: 32, status: '生产中' },
-  { id: 'C5-1', pl: 'E', name: 'A1磨边', amount: 32, status: '生产中' },
-  { id: 'C5-2', pl: 'E', name: 'A1磨边后清洗', amount: 32, status: '生产中' },
-  { id: 'C5-3', pl: 'E', name: 'A1打孔', amount: 32, status: '生产中' },
-  { id: 'C5-4', pl: 'E', name: 'A1打孔后清洗', amount: 32, status: '生产中' },
-  { id: 'C5-5', pl: 'E', name: 'A1丝印', amount: 32, status: '生产中' },
-  { id: 'C5-6', pl: 'E', name: 'A1固化', amount: 32, status: '生产中' },
-  { id: 'C5-7', pl: 'E', name: 'A1储片', amount: 32, status: '生产中' },
-  { id: 'C5-8', pl: 'E', name: 'A1钢化', amount: 32, status: '生产中' },
-  { id: 'C5-9', pl: 'E', name: 'A1钢化后清洗', amount: 32, status: '生产中' },
-  // { id: 'C5-10', pl: 'E', name: 'A1下片', amount: 32, status: '生产中' },
+  { id: 'C5-0', pl: 'B2', name: 'B2上片', amount: 32, status: '生产中' },
+  { id: 'C5-1', pl: 'B2', name: 'B2磨边', amount: 32, status: '生产中' },
+  { id: 'C5-2', pl: 'B2', name: 'B2磨边后清洗', amount: 32, status: '生产中' },
+  { id: 'C5-3', pl: 'B2', name: 'B2打孔', amount: 32, status: '生产中' },
+  { id: 'C5-4', pl: 'B2', name: 'B2打孔后清洗', amount: 32, status: '生产中' },
+  { id: 'C5-5', pl: 'B2', name: 'B2丝印', amount: 32, status: '生产中' },
+  { id: 'C5-6', pl: 'B2', name: 'B2固化', amount: 32, status: '生产中' },
+  { id: 'C5-7', pl: 'B2', name: 'B2储片', amount: 32, status: '生产中' },
+  { id: 'C5-8', pl: 'B2', name: 'B2钢化后清洗', amount: 32, status: '生产中' },
 
-  { id: 'C6-0', pl: 'F', name: 'A1上片', amount: 32, status: '生产中' },
-  { id: 'C6-1', pl: 'F', name: 'A1磨边', amount: 32, status: '生产中' },
-  { id: 'C6-2', pl: 'F', name: 'A1磨边后清洗', amount: 32, status: '生产中' },
-  { id: 'C6-3', pl: 'F', name: 'A1打孔', amount: 32, status: '生产中' },
-  { id: 'C6-4', pl: 'F', name: 'A1打孔后清洗', amount: 32, status: '生产中' },
-  { id: 'C6-5', pl: 'F', name: 'A1丝印', amount: 32, status: '生产中' },
-  { id: 'C6-6', pl: 'F', name: 'A1固化', amount: 32, status: '生产中' },
-  { id: 'C6-7', pl: 'F', name: 'A1储片', amount: 32, status: '故障' },
-  { id: 'C6-8', pl: 'F', name: 'A1钢化', amount: 32, status: '故障' },
-  // { id: 'C6-9', pl: 'F', name: 'A1钢化后清洗', amount: 32, status: '生产中' },
-  // { id: 'C6-10', pl: 'F', name: 'A1下片', amount: 32, status: '生产中' },
+  { id: 'C6-0', pl: 'B3', name: 'B3上片', amount: 32, status: '生产中' },
+  { id: 'C6-1', pl: 'B3', name: 'B3磨边', amount: 32, status: '生产中' },
+  { id: 'C6-2', pl: 'B3', name: 'B3磨边后清洗', amount: 32, status: '生产中' },
+  { id: 'C6-3', pl: 'B3', name: 'B3打孔', amount: 32, status: '生产中' },
+  { id: 'C6-4', pl: 'B3', name: 'B3打孔后清洗', amount: 32, status: '生产中' },
+  { id: 'C6-5', pl: 'B3', name: 'B3丝印', amount: 32, status: '生产中' },
+  { id: 'C6-6', pl: 'B3', name: 'B3固化', amount: 32, status: '生产中' },
+  { id: 'C6-7', pl: 'B3', name: 'B3储片', amount: 32, status: '故障' },
 ]
\ No newline at end of file

From 2f9f9f90bc05d2bed28fdb4a39277952c587a169 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 16:46:18 +0800
Subject: [PATCH 19/28] =?UTF-8?q?update=203d=20=E6=8A=A5=E8=AD=A6=E6=8F=90?=
 =?UTF-8?q?=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/RightContentAlert.vue          | 43 ++++++++-----------
 1 file changed, 18 insertions(+), 25 deletions(-)

diff --git a/src/views/3DOverview/components/RightContentAlert.vue b/src/views/3DOverview/components/RightContentAlert.vue
index a90acb2..c6adc72 100644
--- a/src/views/3DOverview/components/RightContentAlert.vue
+++ b/src/views/3DOverview/components/RightContentAlert.vue
@@ -54,44 +54,37 @@ const PriorityComponent = {
 const tableProps = [
   { prop: 'eqName', label: '设备名称', align: 'center', 'min-width': 90 },
   // { prop: 'plName', label: '所属产线', align: 'center', 'min-width': 90 },
-  { prop: 'priority', label: '提示等级', align: 'center', 'min-width': 90, subcomponent: PriorityComponent },
-  { prop: 'content', label: '巡检内容', align: 'center', 'min-width': 120 },
+  { prop: 'priority', label: '提示等级', align: 'center', 'min-width': 70, subcomponent: PriorityComponent },
+  { prop: 'content', label: '报警内容', align: 'center', 'min-width': 120 },
   { prop: 'duration', label: '累计时间(min)', align: 'center', 'min-width': 125 }
 ]
 
 const tableData = [
-  { eqName: '磨边', plName: 'B', content: '表面检测光源和相机的卫生', priority: 1, duration: '30 min' },
-  { eqName: '冷却', plName: 'A', content: '辊道下方的碎玻璃清理', priority: 3, duration: '1 min' },
-  { eqName: '丝印', plName: 'A', content: '边角检测设备水平的校正', priority: 2, duration: '57 min' },
-  { eqName: '打孔后清洗机', plName: 'B', content: '设备表面的卫生', priority: 3, duration: '17 min' },
-  { eqName: '固化', plName: 'B', content: '操作台保持整洁', priority: 2, duration: '22 min' },
-  { eqName: '一镀', plName: 'B', content: '辊道下方的碎玻璃清理', priority: 3, duration: '2 min' },
-  { eqName: '钢化', plName: 'A', content: '检查每日不良是否存在误检', priority: 2, duration: '23 min' },
-  { eqName: '磨边', plName: 'B', content: '水冷机内水量充足并且清洁', priority: 3, duration: '6 min' },
-  { eqName: '磨边', plName: 'B', content: '表面检测光源和相机的卫生', priority: 2, duration: '23 min' },
+  { eqName: 'B1磨边', plName: 'B', content: '磨轮过载', priority: 1, duration: '30 min' },
+  { eqName: 'A2丝印', plName: 'A', content: '网版推出异常', priority: 2, duration: '57 min' },
+  { eqName: 'B1打孔后清洗', plName: 'B', content: '毛刷过载', priority: 3, duration: '17 min' },
+  { eqName: 'B1固化', plName: 'B', content: '传动变频器故障', priority: 2, duration: '22 min' },
+  { eqName: 'A钢化', plName: 'A', content: '加热炉体超温报警', priority: 2, duration: '23 min' },
+  { eqName: 'B2磨边', plName: 'B', content: '磨轮过载', priority: 3, duration: '6 min' },
+  { eqName: 'B1磨边', plName: 'B', content: '磨轮过载', priority: 2, duration: '23 min' },
   {
-    eqName: '磨边后清洗机',
+    eqName: 'A2磨边后清洗',
     plName: 'A',
-    content: '马华部地般平感为转出形就特务把提存。',
+    content: '进料检测异常',
     priority: 2,
     duration: '18 min'
   },
-  { eqName: '预热', plName: 'B', content: '米织类劳约相查个而美五千老。', priority: 3, duration: '24 min' },
-  { eqName: '打孔后清洗机', plName: 'A', content: '历红群色务口史验话备必工少光。', priority: 1, duration: '48 min' },
-  { eqName: '磨边', plName: 'A', content: '三其由体管严能习使为已身月。', priority: 3, duration: '29 min' },
-  { eqName: '钢后清洗机', plName: 'A', content: '什近率期开构产府收由制期周。', priority: 1, duration: '47 min' },
-  { eqName: '下片', plName: 'A', content: '花公建了办间话个做直志利更在于。', priority: 2, duration: '49 min' },
-  { eqName: '一镀', plName: 'B', content: '术任该石代并战面广西处面住王规从他算。', priority: 3, duration: '42 min' },
-  { eqName: '二镀', plName: 'A', content: '体才眼自造统六识进后历定因受国。', priority: 2, duration: '42 min' },
+  { eqName: 'A3打孔后清洗', plName: 'A', content: '进料检测异常', priority: 1, duration: '48 min' },
+  { eqName: 'A3磨边', plName: 'A', content: '磨轮过载', priority: 3, duration: '29 min' },
+  { eqName: 'A2钢化后清洗', plName: 'A', content: '进料检测异常', priority: 1, duration: '47 min' },
+  { eqName: 'A2下片', plName: 'A', content: '磨轮过载', priority: 2, duration: '49 min' },
   {
-    eqName: '钢后清洗机',
+    eqName: 'A3钢化后清洗',
     plName: 'A',
-    content: '就门务程过志率难每维原就快没省为满候。',
+    content: '输送变频报警',
     priority: 2,
     duration: '33 min'
-  },
-  { eqName: '预热', plName: 'A', content: '金单能信较生七族接处人门例图取之。', priority: 2, duration: '34 min' },
-  { eqName: '预热', plName: 'B', content: '会带给山气己进相构位节采调而音集。', priority: 3, duration: '6 min' }
+  }
 ]
 
 export default {

From 0b9dfa27ab509e8e1153b88226a445792d75c9a8 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Thu, 24 Nov 2022 17:01:30 +0800
Subject: [PATCH 20/28] update data

---
 .../components/charts/pl-JDL-Chart.vue        | 140 +++++++++---------
 src/views/EquipmentManager/mockData.js        |  96 ++++++------
 src/views/report-manage/ReportSortChoise.vue  |   3 +
 3 files changed, 121 insertions(+), 118 deletions(-)

diff --git a/src/views/EquipmentManager/components/charts/pl-JDL-Chart.vue b/src/views/EquipmentManager/components/charts/pl-JDL-Chart.vue
index 911ba96..bf915a0 100644
--- a/src/views/EquipmentManager/components/charts/pl-JDL-Chart.vue
+++ b/src/views/EquipmentManager/components/charts/pl-JDL-Chart.vue
@@ -32,7 +32,7 @@ export default {
         },
         xAxis: {
           type: 'category',
-          data: ['A', 'B', 'C', 'D', 'E'],
+          data: ['A', 'B' ],
           axisTick: {
             alignWithLabel: true
           },
@@ -116,75 +116,75 @@ export default {
                   }
                 }
               },
-              {
-                value: 200,
-                itemStyle: {
-                  color: {
-                    type: 'linear',
-                    x: 0,
-                    y: 0,
-                    x2: 0,
-                    y2: 1,
-                    colorStops: [
-                      {
-                        offset: 0,
-                        color: '#85F6E9'
-                      },
-                      {
-                        offset: 1,
-                        color: '#2EC6B4'
-                      }
-                    ],
-                    global: false
-                  }
-                }
-              },
-              {
-                value: 320,
-                itemStyle: {
-                  color: {
-                    type: 'linear',
-                    x: 0,
-                    y: 0,
-                    x2: 0,
-                    y2: 1,
-                    colorStops: [
-                      {
-                        offset: 0,
-                        color: '#C79DFF'
-                      },
-                      {
-                        offset: 1,
-                        color: '#A490FF'
-                      }
-                    ],
-                    global: false
-                  }
-                }
-              },
-              {
-                value: 95,
-                itemStyle: {
-                  color: {
-                    type: 'linear',
-                    x: 0,
-                    y: 0,
-                    x2: 0,
-                    y2: 1,
-                    colorStops: [
-                      {
-                        offset: 0,
-                        color: '#FFE873'
-                      },
-                      {
-                        offset: 1,
-                        color: '#E7AE2A'
-                      }
-                    ],
-                    global: false
-                  }
-                }
-              }
+              // {
+              //   value: 200,
+              //   itemStyle: {
+              //     color: {
+              //       type: 'linear',
+              //       x: 0,
+              //       y: 0,
+              //       x2: 0,
+              //       y2: 1,
+              //       colorStops: [
+              //         {
+              //           offset: 0,
+              //           color: '#85F6E9'
+              //         },
+              //         {
+              //           offset: 1,
+              //           color: '#2EC6B4'
+              //         }
+              //       ],
+              //       global: false
+              //     }
+              //   }
+              // },
+              // {
+              //   value: 320,
+              //   itemStyle: {
+              //     color: {
+              //       type: 'linear',
+              //       x: 0,
+              //       y: 0,
+              //       x2: 0,
+              //       y2: 1,
+              //       colorStops: [
+              //         {
+              //           offset: 0,
+              //           color: '#C79DFF'
+              //         },
+              //         {
+              //           offset: 1,
+              //           color: '#A490FF'
+              //         }
+              //       ],
+              //       global: false
+              //     }
+              //   }
+              // },
+              // {
+              //   value: 95,
+              //   itemStyle: {
+              //     color: {
+              //       type: 'linear',
+              //       x: 0,
+              //       y: 0,
+              //       x2: 0,
+              //       y2: 1,
+              //       colorStops: [
+              //         {
+              //           offset: 0,
+              //           color: '#FFE873'
+              //         },
+              //         {
+              //           offset: 1,
+              //           color: '#E7AE2A'
+              //         }
+              //       ],
+              //       global: false
+              //     }
+              //   }
+              // }
             ]
           }
         ]
diff --git a/src/views/EquipmentManager/mockData.js b/src/views/EquipmentManager/mockData.js
index 93899ab..cff0dbd 100644
--- a/src/views/EquipmentManager/mockData.js
+++ b/src/views/EquipmentManager/mockData.js
@@ -34,7 +34,7 @@ const PriorityComponent = {
 
 export const equipmentExceptionProps = [
   { label: '设备名称', prop: 'eqName', align: 'center', 'min-width': 55 },
-  { label: '所属产线', prop: 'pl', align: 'center', 'min-width': 55 },
+  // { label: '所属产线', prop: 'pl', align: 'center', 'min-width': 55 },
   { label: '报修/异常内容', prop: 'content', align: 'center', 'min-width': 80 },
   { label: '报修/发现人', prop: 'creator', align: 'center', 'min-width': 60 },
   { label: '时间', prop: 'time', align: 'center', 'min-width': 80 },
@@ -42,26 +42,26 @@ export const equipmentExceptionProps = [
 ]
 
 export const equipmentExceptionDatalist = [
-  { "eqName": "丝印机", "pl": "A", "content": "网版推出异常", "creator": "马磊", "time": "2022-11-20 22:00:34", "priority": 3 },
-  { "eqName": "清洗机", "pl": "B", "content": "毛刷过载", "creator": "贺刚", "time": "2022-11-20 06:30:01", "priority": 2 },
-  { "eqName": "磨边机", "pl": "B", "content": "磨轮过载", "creator": "冯丽", "time": "2022-11-20 07:09:16", "priority": 2 },
-  { "eqName": "镀膜", "pl": "A", "content": "胶辊变频异常", "creator": "梁秀兰", "time": "2022-11-20 08:21:36", "priority": 3 },
-  { "eqName": "丝印机", "pl": "B", "content": "印刷轴异常", "creator": "卢敏", "time": "2022-11-20 04:45:00", "priority": 2 },
-  { "eqName": "磨边机", "pl": "A", "content": "磨轮过载", "creator": "方勇", "time": "2022-11-20 06:41:06", "priority": 2 },
-  { "eqName": "清洗机", "pl": "B", "content": "毛刷过载", "creator": "赵静", "time": "2022-11-20 03:36:47", "priority": 2 },
-  { "eqName": "镀膜", "pl": "A", "content": "胶辊变频异常", "creator": "姜洋", "time": "2022-11-20 07:56:26", "priority": 3 },
-  { "eqName": "磨边机", "pl": "A", "content": "磨轮过载", "creator": "赖艳", "time": "2022-11-20 12:01:14", "priority": 1 },
-  { "eqName": "丝印机", "pl": "A", "content": "进气压力过低", "creator": "熊静", "time": "2022-11-20 03:24:33", "priority": 1 },
-  { "eqName": "清洗机", "pl": "B", "content": "进料检测异常", "creator": "龚明", "time": "2022-11-21 16:26:11", "priority": 2 },
-  { "eqName": "钢化炉", "pl": "A", "content": "传动变频器故障", "creator": "万娟", "time": "2022-11-21 08:44:41", "priority": 2 },
-  { "eqName": "丝印机", "pl": "B", "content": "进气压力过低", "creator": "徐丽", "time": "2022-11-21 21:15:10", "priority": 2 },
-  { "eqName": "镀膜", "pl": "A", "content": "固化变频异常", "creator": "叶娜", "time": "2022-11-21 22:45:13", "priority": 1 },
-  { "eqName": "钢化炉", "pl": "A", "content": "传动变频器故障", "creator": "田磊", "time": "2022-11-21 07:24:59", "priority": 2 },
-  { "eqName": "钢化炉", "pl": "A", "content": "加热炉体超温报警", "creator": "邱平", "time": "2022-11-21 17:53:18", "priority": 2 },
-  { "eqName": "磨边机", "pl": "B", "content": "磨轮过载", "creator": "赵艳", "time": "2022-11-21 18:10:32", "priority": 2 },
-  { "eqName": "钢化炉", "pl": "B", "content": "传动变频器故障", "creator": "江伟", "time": "2022-11-21 17:29:44", "priority": 2 },
-  { "eqName": "清洗机", "pl": "B", "content": "输送变频报警", "creator": "周洋", "time": "2022-11-21 02:49:09", "priority": 3 },
-  { "eqName": "磨边机", "pl": "A", "content": "磨轮过载", "creator": "邱超", "time": "2022-11-21 20:41:53", "priority": 1 },
+  { "eqName": "A1丝印", "pl": "A", "content": "网版推出异常", "creator": "马磊", "time": "2022-11-20 22:00:34", "priority": 3 },
+  { "eqName": "B1磨边后清洗", "pl": "B", "content": "毛刷过载", "creator": "贺刚", "time": "2022-11-20 06:30:01", "priority": 2 },
+  { "eqName": "B1磨边", "pl": "B", "content": "磨轮过载", "creator": "冯丽", "time": "2022-11-20 07:09:16", "priority": 2 },
+  // { "eqName": "镀膜", "pl": "A", "content": "胶辊变频异常", "creator": "梁秀兰", "time": "2022-11-20 08:21:36", "priority": 3 },
+  { "eqName": "B2丝印", "pl": "B", "content": "印刷轴异常", "creator": "卢敏", "time": "2022-11-20 04:45:00", "priority": 2 },
+  { "eqName": "A3磨边", "pl": "A", "content": "磨轮过载", "creator": "方勇", "time": "2022-11-20 06:41:06", "priority": 2 },
+  { "eqName": "B2打孔后清洗", "pl": "B", "content": "毛刷过载", "creator": "赵静", "time": "2022-11-20 03:36:47", "priority": 2 },
+  // { "eqName": "镀膜", "pl": "A", "content": "胶辊变频异常", "creator": "姜洋", "time": "2022-11-20 07:56:26", "priority": 3 },
+  { "eqName": "A2磨边", "pl": "A", "content": "磨轮过载", "creator": "赖艳", "time": "2022-11-20 12:01:14", "priority": 1 },
+  { "eqName": "A2丝印", "pl": "A", "content": "进气压力过低", "creator": "熊静", "time": "2022-11-20 03:24:33", "priority": 1 },
+  { "eqName": "B1打孔后清洗", "pl": "B", "content": "进料检测异常", "creator": "龚明", "time": "2022-11-21 16:26:11", "priority": 2 },
+  { "eqName": "A钢化", "pl": "A", "content": "传动变频器故障", "creator": "万娟", "time": "2022-11-21 08:44:41", "priority": 2 },
+  { "eqName": "B3丝印", "pl": "B", "content": "进气压力过低", "creator": "徐丽", "time": "2022-11-21 21:15:10", "priority": 2 },
+  // { "eqName": "镀膜", "pl": "A", "content": "固化变频异常", "creator": "叶娜", "time": "2022-11-21 22:45:13", "priority": 1 },
+  { "eqName": "A钢化", "pl": "A", "content": "传动变频器故障", "creator": "田磊", "time": "2022-11-21 07:24:59", "priority": 2 },
+  { "eqName": "A钢化", "pl": "A", "content": "加热炉体超温报警", "creator": "邱平", "time": "2022-11-21 17:53:18", "priority": 2 },
+  { "eqName": "B2磨边后清洗", "pl": "B", "content": "磨轮过载", "creator": "赵艳", "time": "2022-11-21 18:10:32", "priority": 2 },
+  { "eqName": "B钢化", "pl": "B", "content": "传动变频器故障", "creator": "江伟", "time": "2022-11-21 17:29:44", "priority": 2 },
+  { "eqName": "B3磨边后清洗", "pl": "B", "content": "输送变频报警", "creator": "周洋", "time": "2022-11-21 02:49:09", "priority": 3 },
+  { "eqName": "A1磨边", "pl": "A", "content": "磨轮过载", "creator": "邱超", "time": "2022-11-21 20:41:53", "priority": 1 },
 ]
 
 /** 设备异常报警 */
@@ -100,42 +100,42 @@ const LifeRemainComponent = {
 export const equipmentAlarmProps = [
   { label: '设备名称', prop: 'eqName', align: 'center', 'min-width': 100 },
   { label: '设备编码', prop: 'eqCode', align: 'center', 'min-width': 100 },
-  { label: '所属产线', prop: 'pl', align: 'center' },
+  // { label: '所属产线', prop: 'pl', align: 'center' },
   { label: '报警级别', prop: 'priority', align: 'center', subcomponent: PriorityComponent, 'min-width': 85 },
   { label: '报警内容', prop: 'content', align: 'center' }
 ]
 
 export const equipmentAlarmDatalist = [
   {
-    "pl": "B", "eqName": "丝印机", "eqCode": "B5SP20200109025453", "content": "网版推出异常", "priority": 3
+    "pl": "B", "eqName": "B1丝印", "eqCode": "B5SP20200109025453", "content": "网版推出异常", "priority": 3
   },
-  { "pl": "A", "eqName": "磨边后清洗机", "eqCode": "A2CAE20210605043851", "content": "输送变频报警", "priority": 2 },
-  { "pl": "B", "eqName": "磨边机", "eqCode": "B4ED20200328154356", "content": "磨轮过载", "priority": 1 },
-  { "pl": "B", "eqName": "镀膜", "eqCode": "B5FC20220307070115", "content": "胶辊变频异常", "priority": 2 },
-  { "pl": "B", "eqName": "丝印机", "eqCode": "B7SP20190927110003", "content": "印刷轴异常", "priority": 2 },
+  { "pl": "A", "eqName": "A2磨边后清洗", "eqCode": "A2CAE20210605043851", "content": "输送变频报警", "priority": 2 },
+  { "pl": "B", "eqName": "B2磨边", "eqCode": "B4ED20200328154356", "content": "磨轮过载", "priority": 1 },
+  // { "pl": "B", "eqName": "镀膜", "eqCode": "B5FC20220307070115", "content": "胶辊变频异常", "priority": 2 },
+  { "pl": "B", "eqName": "B2丝印", "eqCode": "B7SP20190927110003", "content": "印刷轴异常", "priority": 2 },
   {
-    "pl": "A", "eqName": "清洗机", "eqCode": "A3CAP20200727075125", "content": "进料检测异常", "priority": 3
+    "pl": "A", "eqName": "A1磨边后清洗", "eqCode": "A3CAP20200727075125", "content": "进料检测异常", "priority": 3
   },
-  { "pl": "A", "eqName": "丝印机", "eqCode": "A7SP20200512213432", "content": "进气压力过低", "priority": 3 },
+  { "pl": "A", "eqName": "A3丝印", "eqCode": "A7SP20200512213432", "content": "进气压力过低", "priority": 3 },
   {
-    "pl": "A", "eqName": "磨边机", "eqCode": "A4ED20220608145053", "content": "磨轮过载", "priority": 2
+    "pl": "A", "eqName": "A2磨边", "eqCode": "A4ED20220608145053", "content": "磨轮过载", "priority": 2
   },
-  { "pl": "B", "eqName": "钢化炉", "eqCode": "B4CO20200526045602", "content": "传动变频器故障", "priority": 1 },
+  { "pl": "B", "eqName": "B钢化", "eqCode": "B4CO20200526045602", "content": "传动变频器故障", "priority": 1 },
   {
-    "pl": "B", "eqName": "清洗机", "eqCode": "B6CAP20220326162041", "content": "毛刷过载", "priority": 2
+    "pl": "B", "eqName": "B1磨边后清洗", "eqCode": "B6CAP20220326162041", "content": "毛刷过载", "priority": 2
   },
-  { "pl": "A", "eqName": "磨边机", "eqCode": "A4ED20200325081934", "content": "磨轮过载", "priority": 2 },
+  { "pl": "A", "eqName": "A1磨边", "eqCode": "A4ED20200325081934", "content": "磨轮过载", "priority": 2 },
   {
-    "pl": "B", "eqName": "丝印机", "eqCode": "B1SP20201220183649", "content": "印刷轴异常", "priority": 2
+    "pl": "B", "eqName": "B1丝印", "eqCode": "B1SP20201220183649", "content": "印刷轴异常", "priority": 2
   },
-  { "pl": "A", "eqName": "镀膜", "eqCode": "A3SC20220414054819", "content": "固化变频异常", "priority": 2 },
-  { "pl": "A", "eqName": "磨边机", "eqCode": "A8ED20200704010549", "content": "磨轮过载", "priority": 2 },
-  { "pl": "B", "eqName": "清洗机", "eqCode": "B1CAT20200323134700", "content": "进料检测异常", "priority": 3 },
-  { "pl": "A", "eqName": "丝印机", "eqCode": "A1SP20200513020427", "content": "网版推出异常", "priority": 1 },
-  { "pl": "A", "eqName": "钢化炉", "eqCode": "A7CO20210928172616", "content": "加热炉体超温报警", "priority": 2 },
-  { "pl": "A", "eqName": "镀膜", "eqCode": "A5SC20210104132647", "content": "固化变频异常", "priority": 1 },
-  { "pl": "A", "eqName": "钢化炉", "eqCode": "A4ED20210225140150", "content": "加热炉体超温报警", "priority": 1 },
-  { "pl": "B", "eqName": "清洗机", "eqCode": "B6CAP20200831083210", "content": "进料检测异常", "priority": 2 },
+  // { "pl": "A", "eqName": "镀膜", "eqCode": "A3SC20220414054819", "content": "固化变频异常", "priority": 2 },
+  { "pl": "A", "eqName": "A3磨边", "eqCode": "A8ED20200704010549", "content": "磨轮过载", "priority": 2 },
+  { "pl": "B", "eqName": "B3磨边后清洗", "eqCode": "B1CAT20200323134700", "content": "进料检测异常", "priority": 3 },
+  { "pl": "A", "eqName": "A3丝印", "eqCode": "A1SP20200513020427", "content": "网版推出异常", "priority": 1 },
+  { "pl": "A", "eqName": "A钢化", "eqCode": "A7CO20210928172616", "content": "加热炉体超温报警", "priority": 2 },
+  // { "pl": "A", "eqName": "镀膜", "eqCode": "A5SC20210104132647", "content": "固化变频异常", "priority": 1 },
+  { "pl": "A", "eqName": "A钢化", "eqCode": "A4ED20210225140150", "content": "加热炉体超温报警", "priority": 1 },
+  { "pl": "B", "eqName": "B2磨边后清洗", "eqCode": "B6CAP20200831083210", "content": "进料检测异常", "priority": 2 },
 ]
 
 /** 设备分析 */
@@ -258,9 +258,9 @@ export const wwwOrderProps = [
 ]
 
 export const rightSideDatalist = [
-  { "orderId": "WOD20200807030135", "time": "2022-11-12 14:08:04", "eq": "磨边", "status": 3, "team": "白班", "duration": "26min" },
-  { "orderId": "WOD20210217143647", "time": "2022-11-15 18:48:40", "eq": "预热", "status": 2, "team": "白班", "duration": "27min" },
-  { "orderId": "WOD20200413103728", "time": "2022-11-26 20:11:39", "eq": "固化", "status": 1, "team": "夜班", "duration": "24min" },
+  { "orderId": "WOD20200807030135", "time": "2022-11-12 14:08:04", "eq": "A1磨边", "status": 3, "team": "白班", "duration": "26min" },
+  { "orderId": "WOD20210217143647", "time": "2022-11-15 18:48:40", "eq": "A1打孔", "status": 2, "team": "白班", "duration": "27min" },
+  { "orderId": "WOD20200413103728", "time": "2022-11-26 20:11:39", "eq": "A1固化", "status": 1, "team": "夜班", "duration": "24min" },
 ]
 export const rightSideDatalist2 = [
   { "orderId": "WOD20220403013343", "pl": "A", "status": 3, "team": "白班", "duration": "24min" },
@@ -268,9 +268,9 @@ export const rightSideDatalist2 = [
   { "orderId": "WOD20210902180855", "pl": "A", "status": 2, "team": "夜班", "duration": "23min" },
 ]
 export const rightSideDatalist3 = [
-  { "orderId": "WOD20210829073921", "eq": "钢后清洗机", "status": 2, "team": "白班", "duration": "29min" },
-  { "orderId": "WOD20220429180823", "eq": "丝印", "status": 2, "team": "夜班", "duration": "26min" },
-  { "orderId": "WOD20220915050149", "eq": "磨边后清洗机", "status": 3, "team": "白班", "duration": "21min" },
+  { "orderId": "WOD20210829073921", "eq": "A3钢化后清洗", "status": 2, "team": "白班", "duration": "29min" },
+  { "orderId": "WOD20220429180823", "eq": "A3丝印", "status": 2, "team": "夜班", "duration": "26min" },
+  { "orderId": "WOD20220915050149", "eq": "A3磨边后清洗", "status": 3, "team": "白班", "duration": "21min" },
 ]
 export const rightSideDatalist4 = [
   { "orderId": "WOD20210522165229", "pl": "A", "status": 2, "team": "夜班", "time": "2022-12-17 13:31:24" },
diff --git a/src/views/report-manage/ReportSortChoise.vue b/src/views/report-manage/ReportSortChoise.vue
index fc7af8d..dc5e9c3 100644
--- a/src/views/report-manage/ReportSortChoise.vue
+++ b/src/views/report-manage/ReportSortChoise.vue
@@ -227,7 +227,10 @@ export default {
             return { ...item, reportNames: ['班组加工数量统计'] }
           } else if (item.name === '产线') {
             return { ...item, reportNames: ['产线日产量统计', '产线历史产量记录'] }
+          } else if (item.name === '质量') {
+            return { ...item, quantity: 1, reportNames: ['质量缺陷分析'] }
           } else {
+            // mock
             return item
           }
         })

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 21/28] =?UTF-8?q?update=20=E8=B4=A8=E9=87=8F=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=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 }]

From f96854fa2919c6821c7d420b6409dbd44f18df04 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 25 Nov 2022 11:09:24 +0800
Subject: [PATCH 22/28] =?UTF-8?q?update=20=E8=B4=A8=E9=87=8Ftooltip?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/charts/TechyBar.vue            | 51 ++++++++++++++-----
 .../components/charts/newLineStack.vue        |  2 +-
 2 files changed, 38 insertions(+), 15 deletions(-)

diff --git a/src/views/QualityManager/components/charts/TechyBar.vue b/src/views/QualityManager/components/charts/TechyBar.vue
index 09c043c..8884863 100644
--- a/src/views/QualityManager/components/charts/TechyBar.vue
+++ b/src/views/QualityManager/components/charts/TechyBar.vue
@@ -162,6 +162,29 @@ export default {
           top: 72,
           bottom: 28
         },
+        tooltip: {
+          show: true,
+          trigger: 'axis',
+          axisPointer: {
+            type: 'shadow'
+          },
+          padding: 10,
+          extraCssText: 'width: 128px !important; height: auto !important;',
+          formatter: params => {
+            const [, a, , , b] = params 
+            return `<div style="display: flex; flex-direction: column; gap: 2px; align-items: flex-start; ">
+                      <h2 style="font-size: calc(14px * var(--beilv)); margin: 0 0 4px; font-weight: normal; color: white;">${a.name}</h2>
+                      <div style="display: flex; align-items: center; gap: 8px;">
+                        <span style="width: 12px; height: 12px; background: linear-gradient(to top, ${a.color.colorStops[0].color}, transparent);"></span>
+                        <span style="font-size: calc(10px * var(--beilv));">${a.seriesName}: ${a.data}</span>
+                      </div>
+                      <div style="display: flex; align-items: center; gap: 8px;">
+                        <span style="width: 12px; height: 12px; background: linear-gradient(to top, ${b.color.colorStops[0].color}, transparent);"></span>
+                        <span style="font-size: calc(10px * var(--beilv));">${b.seriesName}: ${b.data}</span>
+                      </div>
+                    </div>`
+          }
+        },
         xAxis: {
           type: 'category',
           axisTick: {
@@ -176,20 +199,20 @@ export default {
             color: '#fff8',
             fontSize: 12
           },
-          data: ['脏污', '破片', '崩边', '崩孔', '划擦伤', '其他'],
-          axisPointer: {
-            show: true,
-            type: 'shadow',
-            label: {
-              show: true,
-              formatter: params => {
-                let info_arr = params.seriesData.filter(item => item.seriesType === 'bar')
-                let v = [`<${info_arr[0].name}>详细数据: \n`]
-                info_arr.map(item => { v.push(`${item.seriesName}: ${item.data}`) })
-                return v.join('\n')
-              }
-            }
-          }
+          data: ['脏污', '破片', '崩边', '崩孔', '划擦伤', '其他']
+          // axisPointer: {
+          //   show: true,
+          //   type: 'shadow',
+          //   label: {
+          //     show: true,
+          //     formatter: params => {
+          //       let info_arr = params.seriesData.filter(item => item.seriesType === 'bar')
+          //       let v = [`<${info_arr[0].name}>详细数据: \n`]
+          //       info_arr.map(item => { v.push(`${item.seriesName}: ${item.data}`) })
+          //       return v.join('\n')
+          //     }
+          //   }
+          // }
         },
         yAxis: {
           type: 'value',
diff --git a/src/views/QualityManager/components/charts/newLineStack.vue b/src/views/QualityManager/components/charts/newLineStack.vue
index 567b187..3fe64a0 100644
--- a/src/views/QualityManager/components/charts/newLineStack.vue
+++ b/src/views/QualityManager/components/charts/newLineStack.vue
@@ -34,7 +34,7 @@ class ChartOption {
       trigger: 'axis',
       extraCssText: 'width: 180px !important; ',
       axisPointer: {
-        type: 'cross',
+        type: 'line',
         label: {
           backgroundColor: '#6a7985'
         }

From 7c2aadc19aad33391af9061624d66849b4092fc3 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 25 Nov 2022 11:57:22 +0800
Subject: [PATCH 23/28] =?UTF-8?q?update=20=E5=90=84=E4=B8=AAtooltip?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/3DOverview/components/DianChart.vue | 25 ++++++++++++-----
 .../components/RightContentProductRate.vue    | 23 +++++++++++----
 .../RightContentRealtimeProduction.vue        | 28 +++++++++++++++----
 .../components/charts/TechyBar.vue            | 20 +++++++++----
 .../components/charts/newLineStack.vue        | 24 +++++++++++-----
 5 files changed, 90 insertions(+), 30 deletions(-)

diff --git a/src/views/3DOverview/components/DianChart.vue b/src/views/3DOverview/components/DianChart.vue
index 6a9c73e..19010b8 100644
--- a/src/views/3DOverview/components/DianChart.vue
+++ b/src/views/3DOverview/components/DianChart.vue
@@ -31,16 +31,21 @@ class ChartOption {
     this.tooltip = {
       show: true,
       trigger: 'axis',
+      // position: [200,10],
+      // position: ['25%', '25%'],
+      position: pointer => {
+        return [pointer[1], 0]
+      },
       axisPointer: {
         type: 'line',
         axis: 'x',
         lineStyle: {
-          color: '#41888F90',
-          shadowColor: '#41888F',
-          shadowBlur: 10,
-          width: 2
+          color: '#7BFFFB',
+          type: 'dotted'
         }
       },
+      padding: 10,
+      backgroundColor: 'rgba(13, 29, 53, 0.8)',
       extraCssText: 'position: absolute !important; top: 0, left: 0; width: 152px !important; height: 100px !important;'
     }
 
@@ -156,7 +161,9 @@ class ChartOption {
         data: Array(12)
           .fill(1)
           .map(_ => Random.integer(30, 100)),
-        symbol: 'none'
+        symbol: 'circle',
+        symbolSize: 0.2,
+        showSymbol: false
       },
       {
         name: 'ABC三相电流/a',
@@ -169,7 +176,9 @@ class ChartOption {
         data: Array(12)
           .fill(1)
           .map(_ => Random.integer(30, 100)),
-        symbol: 'none'
+        symbol: 'circle',
+        symbolSize: 0.2,
+        showSymbol: false
       },
       {
         name: '电缆温度',
@@ -182,7 +191,9 @@ class ChartOption {
         data: Array(12)
           .fill(1)
           .map(_ => Random.integer(30, 100)),
-        symbol: 'none'
+        symbol: 'circle',
+        symbolSize: 0.2,
+        showSymbol: false
       }
     ]
   }
diff --git a/src/views/3DOverview/components/RightContentProductRate.vue b/src/views/3DOverview/components/RightContentProductRate.vue
index 2f6c9f7..f707c24 100644
--- a/src/views/3DOverview/components/RightContentProductRate.vue
+++ b/src/views/3DOverview/components/RightContentProductRate.vue
@@ -47,9 +47,16 @@ class ChartOption {
         fontSize: 12
       },
       axisPointer: {
-        type: 'line'
+        type: 'line',
+        lineStyle: {
+          color: '#7BFFFB',
+          type: 'dotted'
+        }
       },
-      formatter: '{b}<br/>{a0}: {c}%<br />{a1}: {c1}%'
+      padding: 10,
+      backgroundColor: 'rgba(13, 29, 53, 0.8)',
+      formatter: '{b}<br/>{a0}: {c}%<br />{a1}: {c1}%',
+      extraCssText: 'width: calc(100px*var(--beilv)) !important;'
     }
 
     let d = new Date()
@@ -79,7 +86,7 @@ class ChartOption {
       type: 'value',
       name: '成品率              ',
       // min: 'dataMin',
-      min: 50,
+      min: 80,
       splitNumber: 3,
       nameTextStyle: {
         color: '#fff9',
@@ -105,7 +112,9 @@ class ChartOption {
       {
         name: 'A',
         type: 'line',
-        symbol: 'none',
+        symbol: 'circle',
+        symbolSize: 1,
+        showSymbol: false,
         areaStyle: {
           color: {
             type: 'linear',
@@ -133,7 +142,9 @@ class ChartOption {
       {
         name: 'B',
         type: 'line',
-        symbol: 'none',
+        symbol: 'circle',
+        symbolSize: 1,
+        showSymbol: false,
         areaStyle: {
           color: {
             type: 'linear',
@@ -179,7 +190,7 @@ class ChartOption {
         if (key === 'colorStops') newOption[key] = option[key]
         else if (
           typeof option[key] === 'number' /** 过滤不做变化的属性 */ &&
-          ['splitNumber', 'x', 'x2', 'y', 'y2', 'yAxisIndex', 'xAxisIndex'].indexOf(key) === -1
+          ['splitNumber', 'x', 'x2', 'y', 'y2', 'min', 'max', 'yAxisIndex', 'xAxisIndex'].indexOf(key) === -1
         ) {
           newOption[key] = calcSize(option[key])
         } else newOption[key] = this.optionFilter(option[key], calcSize)
diff --git a/src/views/3DOverview/components/RightContentRealtimeProduction.vue b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
index 3541f64..0692dce 100644
--- a/src/views/3DOverview/components/RightContentRealtimeProduction.vue
+++ b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
@@ -47,8 +47,14 @@ class ChartOption {
       },
       axisPointer: {
         type: 'line',
-        axis: 'x'
+        axis: 'x',
+        lineStyle: {
+          color: '#7BFFFB',
+          type: 'dotted'
+        }
       },
+      padding: 10,
+      backgroundColor: 'rgba(13, 29, 53, 0.8)',
       extraCssText: 'width: calc(100px*var(--beilv)) !important;'
     }
 
@@ -136,6 +142,10 @@ class ChartOption {
         name: 'A能耗',
         type: 'line',
         yAxisIndex: 0,
+        // symbol: 'none',
+        symbol: 'circle',
+        symbolSize: 1,
+        showSymbol: false,
         // smooth: true,
         emphasis: {
           focus: 'series'
@@ -143,7 +153,6 @@ class ChartOption {
         data: Array(7)
           .fill(0)
           .map(_ => Random.integer(30, 100)),
-        symbol: 'none',
         areaStyle: {
           color: {
             type: 'linear',
@@ -176,7 +185,10 @@ class ChartOption {
         data: Array(7)
           .fill(0)
           .map(_ => Random.integer(30, 100)),
-        symbol: 'none',
+        // symbol: 'none',
+        symbol: 'circle',
+        symbolSize: 1,
+        showSymbol: false,
         areaStyle: {
           color: {
             type: 'linear',
@@ -209,7 +221,10 @@ class ChartOption {
         data: Array(7)
           .fill(0)
           .map(_ => Random.integer(30, 100)),
-        symbol: 'none',
+        // symbol: 'none',
+        symbol: 'circle',
+        symbolSize: 1,
+        showSymbol: false,
         areaStyle: {
           color: {
             type: 'linear',
@@ -242,7 +257,10 @@ class ChartOption {
         data: Array(7)
           .fill(0)
           .map(_ => Random.integer(30, 100)),
-        symbol: 'none',
+        // symbol: 'none',
+        symbol: 'circle',
+        symbolSize: 1,
+        showSymbol: false,
         areaStyle: {
           color: {
             type: 'linear',
diff --git a/src/views/QualityManager/components/charts/TechyBar.vue b/src/views/QualityManager/components/charts/TechyBar.vue
index 8884863..da11ae0 100644
--- a/src/views/QualityManager/components/charts/TechyBar.vue
+++ b/src/views/QualityManager/components/charts/TechyBar.vue
@@ -166,20 +166,30 @@ export default {
           show: true,
           trigger: 'axis',
           axisPointer: {
-            type: 'shadow'
+            type: 'shadow',
+            shadowStyle: {
+              color: 'rgba(255,255,255,0.1)'
+            }
           },
           padding: 10,
+          backgroundColor: 'rgba(13, 29, 53, 0.8)',
           extraCssText: 'width: 128px !important; height: auto !important;',
           formatter: params => {
-            const [, a, , , b] = params 
+            const [, a, , , b] = params
             return `<div style="display: flex; flex-direction: column; gap: 2px; align-items: flex-start; ">
-                      <h2 style="font-size: calc(14px * var(--beilv)); margin: 0 0 4px; font-weight: normal; color: white;">${a.name}</h2>
+                      <h2 style="font-size: calc(14px * var(--beilv)); margin: 0 0 4px; font-weight: normal; color: white;">${
+                        a.name
+                      }</h2>
                       <div style="display: flex; align-items: center; gap: 8px;">
-                        <span style="width: 12px; height: 12px; background: linear-gradient(to top, ${a.color.colorStops[0].color}, transparent);"></span>
+                        <span style="width: 12px; height: 12px; background: linear-gradient(to top, ${
+                          a.color.colorStops[0].color
+                        }, transparent);"></span>
                         <span style="font-size: calc(10px * var(--beilv));">${a.seriesName}: ${a.data}</span>
                       </div>
                       <div style="display: flex; align-items: center; gap: 8px;">
-                        <span style="width: 12px; height: 12px; background: linear-gradient(to top, ${b.color.colorStops[0].color}, transparent);"></span>
+                        <span style="width: 12px; height: 12px; background: linear-gradient(to top, ${
+                          b.color.colorStops[0].color
+                        }, transparent);"></span>
                         <span style="font-size: calc(10px * var(--beilv));">${b.seriesName}: ${b.data}</span>
                       </div>
                     </div>`
diff --git a/src/views/QualityManager/components/charts/newLineStack.vue b/src/views/QualityManager/components/charts/newLineStack.vue
index 3fe64a0..acd0d2e 100644
--- a/src/views/QualityManager/components/charts/newLineStack.vue
+++ b/src/views/QualityManager/components/charts/newLineStack.vue
@@ -32,11 +32,14 @@ class ChartOption {
 
     this.tooltip = {
       trigger: 'axis',
+      padding: 10,
+      backgroundColor: 'rgba(13, 29, 53, 0.8)',
       extraCssText: 'width: 180px !important; ',
       axisPointer: {
         type: 'line',
-        label: {
-          backgroundColor: '#6a7985'
+        lineStyle: {
+          type: 'dotted',
+          color: '#7BFFFB'
         }
       }
     }
@@ -106,8 +109,11 @@ class ChartOption {
       {
         name: 'A1下片机',
         type: 'line',
-        symbol: 'none',
-        smooth: true,
+        // symbol: 'none',
+        symbol: 'circle',
+        symbolSize: 1,
+        showSymbol: false,
+        // smooth: true,
         areaStyle: {
           // color: 'rgba(50,145,152,0.5)'
           color: {
@@ -130,7 +136,8 @@ class ChartOption {
           }
         },
         emphasis: {
-          focus: 'series'
+          focus: 'series',
+          scale: 1.2
         },
         data:
           this.mode === 'month'
@@ -144,8 +151,11 @@ class ChartOption {
       {
         name: '磨边机',
         type: 'line',
-        symbol: 'none',
-        smooth: true,
+        // symbol: 'none',
+        symbol: 'circle',
+        symbolSize: 1,
+        showSymbol: false,
+        // smooth: true,
         areaStyle: {
           // color: 'rgba(50,145,152,0.5)'
           color: {

From 7f79481a350e1aeb08faf204aa84b5469dc9fad3 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 25 Nov 2022 13:11:36 +0800
Subject: [PATCH 24/28] =?UTF-8?q?update=20=E8=B4=A8=E9=87=8F=EF=BC=8C?=
 =?UTF-8?q?=E4=BA=A7=E7=BA=BF=E7=BC=BA=E9=99=B7=E5=88=86=E6=9E=90=E5=B1=85?=
 =?UTF-8?q?=E4=B8=AD=E4=B8=80=E7=82=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/QualityManager/HomePage.vue                     | 2 +-
 .../components/charts/PlFaultAnalysisPieChart.vue         | 8 ++++----
 src/views/QualityManager/mockData.js                      | 4 ++--
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/views/QualityManager/HomePage.vue b/src/views/QualityManager/HomePage.vue
index c14f912..5bb4dc3 100644
--- a/src/views/QualityManager/HomePage.vue
+++ b/src/views/QualityManager/HomePage.vue
@@ -176,7 +176,7 @@
                     </techy-analysis-header>
                     <div style="position: absolute;  top: 0; left:0; width: 100%; height: 100%;">
                       <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));"
+                        style="display: inline-block; font-size: calc(10px * var(--beilv)); color: #fffc; position: absolute; top: calc(48px * var(--beilv)); left: calc(28px * var(--beilv));"
                       >
                         <!--单位千片和单位片 -->
                         {{ unit }}
diff --git a/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue b/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue
index 52304ef..0c83c3c 100644
--- a/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue
+++ b/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue
@@ -113,7 +113,7 @@ export default {
         title: {
           textAlign: 'center',
           textVerticalAlign: 'middle',
-          left: '69%',
+          left: '65%',
           top: '46%',
           text: '',
           textStyle: {
@@ -213,7 +213,7 @@ export default {
           {
             name: 'PieForm',
             type: 'pie',
-            center: ['70%', '56%'],
+            center: ['66%', '56%'],
             radius: ['45%', '65%'],
             avoidLabelOverlap: true,
             label: {
@@ -309,7 +309,7 @@ export default {
       const fs13 = this.calcFontsize(13 /** px*/)
       const fs18 = this.calcFontsize(18 /** px*/)
       const fs20 = this.calcFontsize(20 /** px*/)
-      const legendTextFixWidth = this.calcFontsize(56 /** px*/)
+      const legendTextFixWidth = this.calcFontsize(48 /** px*/)
       const legnedTop = this.calcFontsize(64 /** px*/)
       const legendTopRate = this.calcFontsize(30 /** % */)
 
@@ -324,7 +324,7 @@ export default {
 
       // this.configs.legend.top = legendTopRate + '%'
       this.configs.legend.top = legnedTop
-      this.configs.legend.left = 0 + '%'
+      this.configs.legend.left = 3 + '%'
       this.configs.legend.itemGap = fs8
       this.configs.legend.itemWidth = fs8
 
diff --git a/src/views/QualityManager/mockData.js b/src/views/QualityManager/mockData.js
index ea4da53..a385127 100644
--- a/src/views/QualityManager/mockData.js
+++ b/src/views/QualityManager/mockData.js
@@ -27,7 +27,7 @@ const PriorityComponent = {
     }
   },
   mounted() {
-    console.log(this.injectData.priority)
+    // console.log(this.injectData.priority)
   },
   methods: {},
   render: function (h) {
@@ -35,7 +35,7 @@ const PriorityComponent = {
   }
 }
 
-console.log('is component?', PriorityComponent)
+// console.log('is component?', PriorityComponent)
 
 export const qualityTableProps = [
   { label: '工序名称', prop: 'wsName', align: 'center', 'min-width': 55 },

From 582ac98a523fcf6dc855b7fa31772fea545ca311 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 25 Nov 2022 13:53:30 +0800
Subject: [PATCH 25/28] =?UTF-8?q?update=20=E8=B4=A8=E9=87=8Ftooltip?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/QualityManager/HomePage.vue         | 66 +++++++++++++---
 .../components/charts/newLineStack.vue        | 77 +++++++++++++++----
 2 files changed, 120 insertions(+), 23 deletions(-)

diff --git a/src/views/QualityManager/HomePage.vue b/src/views/QualityManager/HomePage.vue
index 5bb4dc3..71309b8 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 = getFaultDataList()  
+                              chosenDatalist = getFaultDataList()
                             "
                           >
                             A
@@ -187,8 +187,8 @@
                   </techy-box>
                 </div>
                 <div class="" style="width: calc(400px * var(--beilv)); flex: 1;">
-                  <techy-box class="" style="padding: 0 calc(16px * var(--beilv));">
-                    <productionRateHeader
+                  <techy-box class="" style="padding: calc(16px * var(--beilv));">
+                    <!-- <productionRateHeader
                       @update-data="
                         obj => {
                           dataUpdateToken = obj.str
@@ -197,7 +197,42 @@
                       "
                     >
                       产品成品率
-                    </productionRateHeader>
+                    </productionRateHeader> -->
+
+                    <techy-analysis-header :show-top-icon="false">
+                      产线成品率
+                      <template v-slot:dateSelect>
+                        <div class="pl-select">
+                          <span
+                            :class="{ 'pl-select__active': dateMode2 === 'day' }"
+                            @click="
+                              dateMode2 = 'day'
+                              dataUpdateToken = Math.random()+''
+                            "
+                          >
+                            日
+                          </span>
+                          <span
+                            :class="{ 'pl-select__active': dateMode2 === 'month' }"
+                            @click="
+                              dateMode2 = 'month'
+                              dataUpdateToken = Math.random()+''
+                            "
+                          >
+                            月
+                          </span>
+                        </div>
+                        <div class="date-select fake-legend">
+                          <span>
+                            <!-- 产线A -->
+                          </span>
+                          <span>
+                            <!-- 产线B -->
+                          </span>
+                        </div>
+                      </template>
+                    </techy-analysis-header>
+
                     <div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">
                       <new-line-stack :data-update-token="dataUpdateToken" :mode="dateMode2" />
                     </div>
@@ -300,7 +335,8 @@ export default {
   },
   data() {
     const quexianDatalist = [
-      [ // 月a
+      [
+        // 月a
         { value: 5.21, name: '破片' },
         { value: 3.2, name: '崩边' },
         { value: 4.12, name: '脏污' },
@@ -308,7 +344,8 @@ export default {
         { value: 0.96, name: '崩孔' },
         { value: 2.2, name: '其他' }
       ],
-      [ // 月b
+      [
+        // 月b
         { value: 4.34, name: '破片' },
         { value: 3.4, name: '崩边' },
         { value: 4.1, name: '脏污' },
@@ -316,7 +353,8 @@ export default {
         { value: 0.32, name: '崩孔' },
         { value: 2.14, name: '其他' }
       ],
-      [ // 日a
+      [
+        // 日a
         { value: 184, name: '破片' },
         { value: 110, name: '崩边' },
         { value: 163, name: '脏污' },
@@ -324,7 +362,8 @@ export default {
         { value: 22, name: '崩孔' },
         { value: 74, name: '其他' }
       ],
-      [ // 日b
+      [
+        // 日b
         { value: 172, name: '破片' },
         { value: 122, name: '崩边' },
         { value: 162, name: '脏污' },
@@ -338,7 +377,7 @@ export default {
       dataUpdateToken: 'xx-token',
       plMode: 'a',
       dateMode: 'month',
-      dateMode2: 'month',
+      dateMode2: 'day',
       qualityTableProps,
       qualityDatalist,
       qualityExceptionDatalist,
@@ -629,6 +668,15 @@ export default {
   width: calc(375px * var(--beilv));
 }
 
+.fake-legend{
+  cursor: unset;
+}
+
+.fake-legend span {
+  background: none;
+  cursor: none;
+  color: #DFF1FE;
+}
 /* @media all and (max-width: 1680px) {
   .production-rate {
     text-align: center;
diff --git a/src/views/QualityManager/components/charts/newLineStack.vue b/src/views/QualityManager/components/charts/newLineStack.vue
index acd0d2e..85b7dfd 100644
--- a/src/views/QualityManager/components/charts/newLineStack.vue
+++ b/src/views/QualityManager/components/charts/newLineStack.vue
@@ -11,19 +11,19 @@ class ChartOption {
   constructor() {
     this.color = ['#DDB112', '#1A99FF', '#FB418C', '#A691FF', '#49FBD6']
 
-    // this.legend = {
-    //   top: 11,
-    //   right: 32,
-    //   itemWidth: 8,
-    //   itemHeight: 8,
-    //   textStyle: {
-    //     color: '#fff9',
-    //     fontSize: 10
-    //   }
-    // }
+    this.legend = {
+      top: 14,
+      right: 22,
+      itemWidth: 6,
+      itemHeight: 8,
+      textStyle: {
+        color: '#DFF1FECC',
+        fontSize: 12
+      }
+    }
 
     this.grid = {
-      top: 64,
+      top: 72,
       left: 12,
       right: 28,
       bottom: 20,
@@ -44,6 +44,7 @@ class ChartOption {
       }
     }
 
+    let today = new Date()
     this.xAxis = {
       type: 'category',
       boundaryGap: false,
@@ -62,13 +63,15 @@ class ChartOption {
       },
       data:
         this.mode === 'month'
-          ? [1, 2, 3, 4, 5, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20]
+          ? Array(new Date(today.getFullYear(), today.getMonth() + 1, 0).getDate())
+              .fill(1)
+              .map((_, idx) => idx + 1)
           : ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
     }
 
     this.yAxis = [
       {
-        name: '成品率          ',
+        name: '成品率            ',
         type: 'value',
         min: '80',
         splitNumber: 4,
@@ -259,11 +262,57 @@ export default {
   methods: {
     refreshData() {
       // update xaxis
+      let today = new Date()
       this.configs.xAxis.data =
         this.mode === 'month'
-          ? [1, 2, 3, 4, 5, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20]
+          ? Array(new Date(today.getFullYear(), today.getMonth() + 1, 0).getDate())
+              .fill(1)
+              .map((_, idx) => idx + 1)
           : ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
 
+      // update tooltip
+      if (this.mode === 'month') {
+        this.configs.tooltip = {
+          trigger: 'axis',
+          padding: 10,
+          backgroundColor: 'rgba(13, 29, 53, 0.8)',
+          extraCssText: 'width: 180px !important; ',
+          axisPointer: {
+            type: 'line',
+            lineStyle: {
+              type: 'dotted',
+              color: '#7BFFFB'
+            }
+          },
+          formatter: params => {
+            const currentMonth = new Date().getMonth() + 1 
+            return `
+            <div style="display: flex; flex-direction: column; gap: calc(4px * var(--beilv));">
+              <h2 style="margin: 0; font-size: calc(14px * var(--beilv)); ">${currentMonth}-${params[0].axisValue}</h2>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${this.configs.color[0]}"></span><span>${params[0].seriesName}: ${params[0].value}</span></span>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${this.configs.color[1]}"></span><span>${params[1].seriesName}: ${params[1].value}</span></span>
+            </div>
+            `
+          }
+        }
+      } else if (this.mode === 'day') {
+        this.configs.tooltip = null
+        this.configs.tooltip = {
+          trigger: 'axis',
+          padding: 10,
+          backgroundColor: 'rgba(13, 29, 53, 0.8)',
+          extraCssText: 'width: 180px !important; ',
+          axisPointer: {
+            type: 'line',
+            lineStyle: {
+              type: 'dotted',
+              color: '#7BFFFB'
+            }
+          },
+          formatter: undefined
+        } 
+      }
+
       // update series
       this.configs.series.forEach(item => {
         item.data =

From ff0bda0dbad9c65c688c7c0a1e4714fe77f6e2d6 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 25 Nov 2022 15:10:35 +0800
Subject: [PATCH 26/28] update

---
 src/views/3DOverview/components/RightContentFaultAnalysis.vue | 2 ++
 .../3DOverview/components/RightContentRealtimeProduction.vue  | 4 ++--
 .../components/charts/PlFaultAnalysisPieChart.vue             | 4 +++-
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/views/3DOverview/components/RightContentFaultAnalysis.vue b/src/views/3DOverview/components/RightContentFaultAnalysis.vue
index 5abfcd8..4242da3 100644
--- a/src/views/3DOverview/components/RightContentFaultAnalysis.vue
+++ b/src/views/3DOverview/components/RightContentFaultAnalysis.vue
@@ -124,6 +124,7 @@ export default {
         },
 
         legend: {
+          selectedMode: false,
           top: 0,
           bottom: 0,
           left: 0,
@@ -208,6 +209,7 @@ export default {
 
         series: [
           {
+            silent: true,
             name: 'PieForm',
             type: 'pie',
             center: ['68%', '61%'],
diff --git a/src/views/3DOverview/components/RightContentRealtimeProduction.vue b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
index 0692dce..19def8a 100644
--- a/src/views/3DOverview/components/RightContentRealtimeProduction.vue
+++ b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
@@ -19,7 +19,7 @@ import { Random } from 'mockjs'
 
 class ChartOption {
   constructor() {
-    this.color = ['#1A99FF', '#F0D63C', '#E02094', '#559833']
+    this.color = ['#1A99FF', '#F0D63C', '#E02094', '#52FFF1']
 
     this.legend = {
       top: 28,
@@ -271,7 +271,7 @@ class ChartOption {
             colorStops: [
               {
                 offset: 0,
-                color: '#55983366' // 0% 处的颜色
+                color: '#52FFF166' // 0% 处的颜色
               },
               {
                 offset: 1,
diff --git a/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue b/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue
index 0c83c3c..89259ee 100644
--- a/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue
+++ b/src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue
@@ -129,6 +129,7 @@ export default {
           }
         },
         legend: {
+          selectedMode: false,
           top: '12%',
           bottom: 0,
           left: 0,
@@ -213,6 +214,7 @@ export default {
           {
             name: 'PieForm',
             type: 'pie',
+            silent: true,
             center: ['66%', '56%'],
             radius: ['45%', '65%'],
             avoidLabelOverlap: true,
@@ -310,7 +312,7 @@ export default {
       const fs18 = this.calcFontsize(18 /** px*/)
       const fs20 = this.calcFontsize(20 /** px*/)
       const legendTextFixWidth = this.calcFontsize(48 /** px*/)
-      const legnedTop = this.calcFontsize(64 /** px*/)
+      const legnedTop = this.calcFontsize(72 /** px*/)
       const legendTopRate = this.calcFontsize(30 /** % */)
 
       this.configs.title.text =

From fbe6cf41e4177e64314dabf9683c7f87df90edfc Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 25 Nov 2022 15:43:03 +0800
Subject: [PATCH 27/28] update tooltip for all

---
 src/views/3DOverview/components/DianChart.vue | 18 +++++++-
 .../components/RightContentProductRate.vue    | 19 +++++++-
 .../RightContentRealtimeProduction.vue        | 21 ++++++++-
 .../components/charts/newLineStack.vue        | 45 ++++++++++++++++---
 4 files changed, 93 insertions(+), 10 deletions(-)

diff --git a/src/views/3DOverview/components/DianChart.vue b/src/views/3DOverview/components/DianChart.vue
index 19010b8..c92d2c3 100644
--- a/src/views/3DOverview/components/DianChart.vue
+++ b/src/views/3DOverview/components/DianChart.vue
@@ -46,7 +46,23 @@ class ChartOption {
       },
       padding: 10,
       backgroundColor: 'rgba(13, 29, 53, 0.8)',
-      extraCssText: 'position: absolute !important; top: 0, left: 0; width: 152px !important; height: 100px !important;'
+      extraCssText: 'width: auto !important; height: auto !important;',
+      formatter: params => {
+        return `
+            <div style="display: flex; flex-direction: column; gap: calc(4px * var(--beilv));">
+              <h2 style="font-size: calc(14px * var(--beilv)); margin: 0 0 4px; font-weight: normal; color: white;">${params[0].axisValue}</h2>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.color[0]
+              }"></span><span>${params[0].seriesName}: ${params[0].value}</span></span>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.color[1]
+              }"></span><span>${params[1].seriesName}: ${params[1].value}</span></span>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.color[2]
+              }"></span><span>${params[2].seriesName}: ${params[2].value}</span></span>
+            </div>
+            `
+      }
     }
 
     this.xAxis = {
diff --git a/src/views/3DOverview/components/RightContentProductRate.vue b/src/views/3DOverview/components/RightContentProductRate.vue
index f707c24..b93ed6e 100644
--- a/src/views/3DOverview/components/RightContentProductRate.vue
+++ b/src/views/3DOverview/components/RightContentProductRate.vue
@@ -55,8 +55,23 @@ class ChartOption {
       },
       padding: 10,
       backgroundColor: 'rgba(13, 29, 53, 0.8)',
-      formatter: '{b}<br/>{a0}: {c}%<br />{a1}: {c1}%',
-      extraCssText: 'width: calc(100px*var(--beilv)) !important;'
+      // formatter: '{b}<br/>{a0}: {c}%<br />{a1}: {c1}%',
+      extraCssText: 'width: calc(100px*var(--beilv)) !important;',
+      formatter: params => {
+        return `
+            <div style="display: flex; flex-direction: column; gap: calc(4px * var(--beilv));">
+              <h2 style="font-size: calc(14px * var(--beilv)); margin: 0 0 4px; font-weight: normal; color: white;">${
+                params[0].axisValue
+              }</h2>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.color[0]
+              }"></span><span>${params[0].seriesName}: ${params[0].value}</span></span>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.color[1]
+              }"></span><span>${params[1].seriesName}: ${params[1].value}</span></span>
+            </div>
+            `
+      }
     }
 
     let d = new Date()
diff --git a/src/views/3DOverview/components/RightContentRealtimeProduction.vue b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
index 19def8a..f6d299b 100644
--- a/src/views/3DOverview/components/RightContentRealtimeProduction.vue
+++ b/src/views/3DOverview/components/RightContentRealtimeProduction.vue
@@ -55,7 +55,26 @@ class ChartOption {
       },
       padding: 10,
       backgroundColor: 'rgba(13, 29, 53, 0.8)',
-      extraCssText: 'width: calc(100px*var(--beilv)) !important;'
+      extraCssText: 'width: calc(100px*var(--beilv)) !important;',
+      formatter: params => {
+        return `
+            <div style="display: flex; flex-direction: column; gap: calc(4px * var(--beilv));">
+              <h2 style="font-size: calc(14px * var(--beilv)); margin: 0 0 4px; font-weight: normal; color: white;">${params[0].axisValue}</h2>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.color[0]
+              }"></span><span>${params[0].seriesName}: ${params[0].value}</span></span>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.color[1]
+              }"></span><span>${params[1].seriesName}: ${params[1].value}</span></span>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.color[2]
+              }"></span><span>${params[2].seriesName}: ${params[2].value}</span></span>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.color[3]
+              }"></span><span>${params[3].seriesName}: ${params[3].value}</span></span>
+            </div>
+            `
+      }
     }
 
     let d = new Date()
diff --git a/src/views/QualityManager/components/charts/newLineStack.vue b/src/views/QualityManager/components/charts/newLineStack.vue
index 85b7dfd..79cc6af 100644
--- a/src/views/QualityManager/components/charts/newLineStack.vue
+++ b/src/views/QualityManager/components/charts/newLineStack.vue
@@ -41,6 +41,19 @@ class ChartOption {
           type: 'dotted',
           color: '#7BFFFB'
         }
+      },
+      formatter: params => {
+        return `
+            <div style="display: flex; flex-direction: column; gap: calc(4px * var(--beilv));">
+              <h2 style="font-size: calc(14px * var(--beilv)); margin: 0 0 4px; font-weight: normal; color: white;">${params[0].axisValue}</h2>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.color[0]
+              }"></span><span>${params[0].seriesName}: ${params[0].value}</span></span>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.color[1]
+              }"></span><span>${params[1].seriesName}: ${params[1].value}</span></span>
+            </div>
+            `
       }
     }
 
@@ -285,12 +298,18 @@ export default {
             }
           },
           formatter: params => {
-            const currentMonth = new Date().getMonth() + 1 
+            const currentMonth = new Date().getMonth() + 1
             return `
             <div style="display: flex; flex-direction: column; gap: calc(4px * var(--beilv));">
-              <h2 style="margin: 0; font-size: calc(14px * var(--beilv)); ">${currentMonth}-${params[0].axisValue}</h2>
-              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${this.configs.color[0]}"></span><span>${params[0].seriesName}: ${params[0].value}</span></span>
-              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${this.configs.color[1]}"></span><span>${params[1].seriesName}: ${params[1].value}</span></span>
+              <h2 style="font-size: calc(14px * var(--beilv)); margin: 0 0 4px; font-weight: normal; color: white;">${currentMonth}-${
+              params[0].axisValue
+            }</h2>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.configs.color[0]
+              }"></span><span>${params[0].seriesName}: ${params[0].value}</span></span>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.configs.color[1]
+              }"></span><span>${params[1].seriesName}: ${params[1].value}</span></span>
             </div>
             `
           }
@@ -309,8 +328,22 @@ export default {
               color: '#7BFFFB'
             }
           },
-          formatter: undefined
-        } 
+          formatter: params => {
+            return `
+            <div style="display: flex; flex-direction: column; gap: calc(4px * var(--beilv));">
+              <h2 style="font-size: calc(14px * var(--beilv)); margin: 0 0 4px; font-weight: normal; color: white;">${
+                params[0].axisValue
+              }</h2>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.configs.color[0]
+              }"></span><span>${params[0].seriesName}: ${params[0].value}</span></span>
+              <span style="display: flex; align-items: center; gap: 8px;"><span style="width: 10px; height: 10px; border-radius: 5px; background: ${
+                this.configs.color[1]
+              }"></span><span>${params[1].seriesName}: ${params[1].value}</span></span>
+            </div>
+            `
+          }
+        }
       }
 
       // update series

From 70b47b1ec0a02154c0d0d228cb3233534c43ba11 Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Fri, 25 Nov 2022 16:12:40 +0800
Subject: [PATCH 28/28] update 3d index

---
 src/views/3DOverview/index.vue | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/views/3DOverview/index.vue b/src/views/3DOverview/index.vue
index 311c1d0..1298e55 100644
--- a/src/views/3DOverview/index.vue
+++ b/src/views/3DOverview/index.vue
@@ -1,9 +1,9 @@
 <template>
   <div id="v3d-outter" ref="v3d-outter">
-    <!-- <div id="V3DData" style="position: fixed; top: 0; left: 0; display: hidden;" rel=""></div>
+    <div id="V3DData" style="position: fixed; top: 0; left: 0; display: hidden;" rel="" />
     <V3DApp @3d-loaded="handle3DLoaded" @click.native="handle3DClick" />
-    <div v-if="showPage" id="v3d-main-content"> -->
-      <div v-if="true" id="v3d-main-content">
+    <div v-if="showPage" id="v3d-main-content">
+      <!-- <div v-if="true" id="v3d-main-content"> -->
       <techy-header :head-title="'合肥新能源数字工厂总览'" @toggle-full-screen="toggleFullScreen" />
 
       <section id="techy-body-part">
@@ -20,7 +20,7 @@
               </techy-container>
             </div>
 
-            <div class="techy-body-part__middle" v-if="currentEquipment">
+            <div v-if="currentEquipment" class="techy-body-part__middle">
               <TechyBox>
                 <div class="techy-body-part__middle__inner">
                   <p>
@@ -45,7 +45,7 @@
                           'red-dot': currentEquipment.status === '故障',
                           'yellow-dot': currentEquipment.status === '调试中'
                         }"
-                      ></span>
+                      />
                       {{ currentEquipment.status }}
                     </span>
                   </p>