bugfix--#I7K1RB 仪表盘更新

report-ui/src/views/bigscreenDesigner/designer/tools/configure/percentCharts/widget-gauge.js

@@ -233,6 +233,14 @@ export const widgetGauge = {
               placeholder: '',
               value: 0,
             },
+            {
+              type: 'vue-color',
+              label: '颜色',
+              name: 'labelColor',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
             {
               type: 'el-input-number',
               label: '字号',
@@ -242,12 +250,31 @@ export const widgetGauge = {
               value: 10,
             },
             {
-              type: 'vue-color',
+              type: 'el-select',
-              label: '颜色',
+              label: '字体粗细',
-              name: 'labelColor',
+              name: 'labelFontWeight',
               required: false,
               placeholder: '',
-              value: '#fff',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'labelFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
             },
           ]
         },
@@ -257,7 +284,7 @@ export const widgetGauge = {
             {
               type: 'vue-color',
               label: '颜色',
-              name: 'labelColor',
+              name: 'detailColor',
               required: false,
               placeholder: '',
               value: '#fff',
@@ -265,7 +292,7 @@ export const widgetGauge = {
             {
               type: 'el-input-number',
               label: '字号',
-              name: 'labelFontSize',
+              name: 'detailFontSize',
               require: false,
               placeholder: '',
               value: 14,
@@ -273,7 +300,7 @@ export const widgetGauge = {
             {
               type: 'el-select',
               label: '字体粗细',
-              name: 'labelFontWeight',
+              name: 'detailFontWeight',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -284,6 +311,19 @@ export const widgetGauge = {
               ],
               value: 'normal'
             },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'detailFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
           ]
         },
       ],

report-ui/src/views/bigscreenDesigner/designer/widget/percent/widgetGauge.vue

@@ -1,11 +1,12 @@
 <template>
   <div :style="styleObj">
-    <v-chart :options="options" autoresize />
+    <v-chart :options="options" autoresize/>
   </div>
 </template>
 
 <script>
 import echarts from "echarts";
+
 export default {
   name: "WidgetGauge",
   components: {},
@@ -244,9 +245,27 @@ export default {
             width: optionsSetup.splitWidth,
           },
         };
+        const axisLabel = {
+          show: optionsSetup.labelShow,
+          color: optionsSetup.labelColor,
+          distance: optionsSetup.labelDistance,
+          fontSize: optionsSetup.labelFontSize,
+          fontWeight: optionsSetup.labelFontWeight,
+          fontStyle: optionsSetup.labelFontStyle,
+        };
+        const detail = {
+          valueAnimation: true,
+          formatter: "{value} %",
+          color: optionsSetup.detailColor,
+          fontSize: optionsSetup.detailFontSize,
+          fontWeight: optionsSetup.detailFontWeight,
+          fontStyle: optionsSetup.detailFontStyle,
+        };
         series[0].axisLine = axisLine;
         series[0].axisTick = axisTick;
         series[0].splitLine = splitLine;
+        series[0].axisLabel = axisLabel;
+        series[0].detail = detail;
       }
     },
     setOptionsData() {
@@ -256,7 +275,6 @@ export default {
         : this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
     },
     staticDataFn(val) {
-      const optionsSetup = this.optionsSetup;
       const series = this.options.series;
       const num = val[0]["num"];
       const data = [
@@ -264,15 +282,7 @@ export default {
           value: num,
         },
       ];
-      const detail = {
-        valueAnimation: true,
-        formatter: "{value} %",
-        color: optionsSetup.labelColor,
-        fontSize: optionsSetup.labelFontSize,
-        fontWeight: optionsSetup.labelFontWeight,
-      };
       series[0].data = data;
-      series[0].detail = detail;
     },
     dynamicDataFn(val, refreshTime) {
       if (!val) return;
@@ -292,22 +302,13 @@ export default {
       });
     },
     renderingFn(val) {
-      const optionsSetup = this.optionsSetup;
       const series = this.options.series;
       const data = [
         {
           value: val[0].value,
         },
       ];
-      const detail = {
-        valueAnimation: true,
-        formatter: "{value} %",
-        color: optionsSetup.labelColor,
-        fontSize: optionsSetup.labelFontSize,
-        fontWeight: optionsSetup.labelFontWeight,
-      };
       series[0].data = data;
-      series[0].detail = detail;
     },
   },
 };