bugfix--刻度尺动态数据预览不显示

report-ui/src/views/bigscreenDesigner/designer/widget/scale/widgetScaleHorizontal.vue

@@ -11,8 +11,8 @@ import {eventBusParams} from "@/utils/screen";
 let scale = [];
 let max;
 let min;
-let Gradient = [];
 
+// 横刻度尺
 export default {
   name: "widgetScaleHorizontal",
   components: {},
@@ -92,11 +92,11 @@ export default {
           {
             name: "值",
             type: "bar",
-            yAxisIndex : 0,
+            yAxisIndex: 0,
             barWidth: 35,
             itemStyle: {
               normal: {
-                color: new echarts.graphic.LinearGradient(0, 0, 1, 0, Gradient),
+                color: '#0C2F6F',
                 barBorderRadius: 50,
               }
             },
@@ -126,7 +126,7 @@ export default {
           {
             name: '白框',
             type: 'bar',
-            yAxisIndex : 1,
+            yAxisIndex: 1,
             barGap: '-100%',
             data: [max - 1],
             barWidth: 35,
@@ -305,7 +305,7 @@ export default {
       // 显示
       if (optionsSetup.isShowScale) {
         series.data = scale;
-      }else {
+      } else {
         series.data = 0;
       }
       series.barWidth = optionsSetup.scaleBarWidth;
@@ -351,29 +351,21 @@ export default {
     // 内框设置
     setOptionsInBar() {
       const optionsSetup = this.optionsSetup;
-      const series1 = this.options.series[1];
-      series1.barWidth = optionsSetup.inBarWidth;
-      series1.itemStyle = {
+      const series = this.options.series[1];
+      series.barWidth = optionsSetup.inBarWidth;
+      series.itemStyle = {
         normal: {
           color: optionsSetup.inBarColor,
           barBorderRadius: optionsSetup.inBarRadius,
         }
       };
-      series1.data = [max - 1];
-      const series0 = this.options.series[0];
-      series0.barWidth = optionsSetup.inBarWidth;
-      series0.itemStyle = {
-        normal: {
-          color: new echarts.graphic.LinearGradient(0, 0, 1, 0, Gradient),
-          barBorderRadius: optionsSetup.inBarRadius,
-        }
-      };
+      series.data = [max - 1];
     },
     // 渐变色设置
-    setOptionsColor(inputValue, max) {
+    setOptionsColor(inputValue, inputMax) {
       const optionsSetup = this.optionsSetup;
       let gradient = [];
-      if (inputValue > (max * 0.7)) {
+      if (inputValue > (inputMax * 0.7)) {
         gradient.push(
           {
             offset: 0,
@@ -391,7 +383,7 @@ export default {
             offset: 1,
             color: optionsSetup.bar100Color,
           })
-      } else if (inputValue > (max * 0.3)) {
+      } else if (inputValue > (inputMax * 0.3)) {
         gradient.push(
           {
             offset: 0,
@@ -418,10 +410,10 @@ export default {
       }
       return gradient;
     },
-    setShowValue(inputValue, max) {
+    setShowValue(inputValue, inputMax) {
       let showValue = inputValue;
-      if (inputValue > max) {
-        showValue = max
+      if (inputValue > inputMax) {
+        showValue = inputMax
       } else {
         if (inputValue < 0) {
           showValue = 0
@@ -468,7 +460,6 @@ export default {
       const num = val[0]["num"];
       // 渐变色
       const gradient = this.setOptionsColor(num, optionsSetup.maxScale);
-      Gradient = gradient;
       // 数值设定
       const series = this.options.series[0];
       const data = {
@@ -493,6 +484,13 @@ export default {
           }
         }
       }
+      series.barWidth = optionsSetup.inBarWidth;
+      series.itemStyle = {
+        normal: {
+          color: new echarts.graphic.LinearGradient(0, 0, 1, 0, gradient),
+          barBorderRadius: optionsSetup.inBarRadius,
+        }
+      };
       series.data[0] = data;
     },
     dynamicDataFn(val, refreshTime) {
@@ -517,9 +515,8 @@ export default {
       const num = val[0].value;
       // 渐变色
       const gradient = this.setOptionsColor(num, optionsSetup.maxScale);
-      Gradient = gradient;
       // 数值设定
-      const series = this.options.series;
+      const series = this.options.series[0];
       const data = {
         value: this.setShowValue(num, optionsSetup.maxScale),
         label: {
@@ -542,7 +539,14 @@ export default {
           }
         }
       }
-      series[0].data[0] = data;
+      series.barWidth = optionsSetup.inBarWidth;
+      series.itemStyle = {
+        normal: {
+          color: new echarts.graphic.LinearGradient(0, 0, 1, 0, gradient),
+          barBorderRadius: optionsSetup.inBarRadius,
+        }
+      };
+      series.data[0] = data;
     },
   },
 };

report-ui/src/views/bigscreenDesigner/designer/widget/scale/widgetScaleVertical.vue

@@ -10,10 +10,10 @@ import echarts from "echarts";
 let scale = [];
 let max;
 let min;
-let Gradient = [];
 
+// 竖刻度尺
 export default {
-  name: "widgetScale",
+  name: "widgetScaleVertical",
   components: {},
   props: {
     value: Object,
@@ -93,7 +93,7 @@ export default {
             xAxisIndex: 0,
             itemStyle: {
               normal: {
-                color: new echarts.graphic.LinearGradient(0, 1, 0, 0, Gradient),
+                color: "#0C2F6F",
                 barBorderRadius: 50,
               }
             },
@@ -234,7 +234,6 @@ export default {
       this.setOptionsMargin();
       this.setOptionsData();
       this.setOptionsInBar();
-
     },
     // 标题设置
     setOptionsTitle() {
@@ -339,29 +338,21 @@ export default {
     // 内框设置
     setOptionsInBar() {
       const optionsSetup = this.optionsSetup;
-      const series1 = this.options.series[1];
-      series1.barWidth = optionsSetup.inBarWidth;
-      series1.itemStyle = {
+      const series = this.options.series[1];
+      series.barWidth = optionsSetup.inBarWidth;
+      series.itemStyle = {
         normal: {
           color: optionsSetup.inBarColor,
           barBorderRadius: optionsSetup.inBarRadius,
         }
       };
-      series1.data = [max - 1];
-      const series0 = this.options.series[0];
-      series0.barWidth = optionsSetup.inBarWidth;
-      series0.itemStyle = {
-        normal: {
-          color: new echarts.graphic.LinearGradient(0, 1, 0, 0, Gradient),
-          barBorderRadius: optionsSetup.inBarRadius,
-        }
-      };
+      series.data = [max - 1];
     },
     // 渐变色设置
-    setOptionsColor(inputValue, max) {
+    setOptionsColor(inputValue, inputMax) {
       const optionsSetup = this.optionsSetup;
       let gradient = [];
-      if (inputValue > (max * 0.7)) {
+      if (inputValue > (inputMax * 0.7)) {
         gradient.push(
           {
             offset: 0,
@@ -379,7 +370,7 @@ export default {
             offset: 1,
             color: optionsSetup.bar100Color,
           })
-      } else if (inputValue > (max * 0.3)) {
+      } else if (inputValue > (inputMax * 0.3)) {
         gradient.push(
           {
             offset: 0,
@@ -406,10 +397,10 @@ export default {
       }
       return gradient;
     },
-    setShowValue(inputValue, max) {
+    setShowValue(inputValue, inputMax) {
       let showValue = inputValue;
-      if (inputValue > max) {
-        showValue = max
+      if (inputValue > inputMax) {
+        showValue = inputMax
       } else {
         if (inputValue < 0) {
           showValue = 0
@@ -456,7 +447,6 @@ export default {
       const num = val[0]["num"];
       // 渐变色
       const gradient = this.setOptionsColor(num, optionsSetup.maxScale);
-      Gradient = gradient;
       // 数值设定
       const series = this.options.series[0];
       const data = {
@@ -481,6 +471,13 @@ export default {
           }
         }
       }
+      series.barWidth = optionsSetup.inBarWidth;
+      series.itemStyle = {
+        normal: {
+          color: new echarts.graphic.LinearGradient(0, 1, 0, 0, gradient),
+          barBorderRadius: optionsSetup.inBarRadius,
+        }
+      };
       series.data[0] = data;
     },
     dynamicDataFn(val, refreshTime) {
@@ -505,9 +502,8 @@ export default {
       const num = val[0].value;
       // 渐变色
       const gradient = this.setOptionsColor(num, optionsSetup.maxScale);
-      Gradient = gradient;
       // 数值设定
-      const series = this.options.series;
+      const series = this.options.series[0];
       const data = {
         value: this.setShowValue(num, optionsSetup.maxScale),
         label: {
@@ -530,7 +526,14 @@ export default {
           }
         }
       }
-      series[0].data[0] = data;
+      series.barWidth = optionsSetup.inBarWidth;
+      series.itemStyle = {
+        normal: {
+          color: new echarts.graphic.LinearGradient(0, 1, 0, 0, gradient),
+          barBorderRadius: optionsSetup.inBarRadius,
+        }
+      };
+      series.data[0] = data;
     },
   },
 };