Parcourir la source

feat--柱状图数据设定增加是否显示百分比符号

qianming il y a 1 an
Parent
commit
234ff615ba

+ 9 - 1
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-stack.js

@@ -536,6 +536,14 @@ export const widgetBarStack = {
               placeholder: '',
               value: false
             },
+            {
+              type: 'el-switch',
+              label: '百分比符号显示',
+              name: 'percentSign',
+              required: false,
+              placeholder: '',
+              value: false
+            },
             {
               type: 'el-input-number',
               label: '字体字号',
@@ -550,7 +558,7 @@ export const widgetBarStack = {
               name: 'dataColor',
               required: false,
               placeholder: '',
-              value: '#fff'
+              value: ''
             },
             {
               type: 'el-select',

+ 1 - 1
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-barchart.js

@@ -574,7 +574,7 @@ export const widgetBarchart = {
               name: 'dataColor',
               required: false,
               placeholder: '',
-              value: '#fff'
+              value: ''
             },
             {
               type: 'el-select',

+ 9 - 1
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-gradient-barchart.js

@@ -426,6 +426,14 @@ export const widgetGradientBarchart = {
               placeholder: '',
               value: true
             },
+            {
+              type: 'el-switch',
+              label: '百分比符号显示',
+              name: 'percentSign',
+              required: false,
+              placeholder: '',
+              value: false
+            },
             {
               type: 'el-input-number',
               label: '距离',
@@ -538,7 +546,7 @@ export const widgetGradientBarchart = {
               name: 'bar100color',
               required: false,
               placeholder: '',
-              value: 'rgba(0,77,167,1)'
+              value: 'rgba(255, 69, 0, 1)'
             },
             {
               type: 'vue-color',

+ 2 - 0
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue

@@ -369,6 +369,7 @@ export default {
             fontSize: optionsSetup.fontSize,
             color: optionsSetup.dataColor,
             fontWeight: optionsSetup.fontWeight,
+            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
           },
           //颜色,圆角属性
           itemStyle: {
@@ -450,6 +451,7 @@ export default {
               fontSize: optionsSetup.fontSize,
               color: optionsSetup.dataColor,
               fontWeight: optionsSetup.fontWeight,
+              formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
             },
             //颜色,圆角属性
             itemStyle: {

+ 2 - 2
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarchart.vue

@@ -392,10 +392,10 @@ export default {
             };
           }
           series[i].data = data;
-          this.options.legend["data"] = legendName;
-          this.setOptionsLegendName(legendName);
         }
       }
+      this.options.legend["data"] = legendName;
+      this.setOptionsLegendName(legendName);
     },
     // 动态数据
     dynamicDataFn(refreshTime) {

+ 4 - 3
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetGradientColorBarchart.vue

@@ -314,6 +314,7 @@ export default {
             fontSize: optionsSetup.fontSize,
             color: optionsSetup.dataColor,
             fontWeight: optionsSetup.fontWeight,
+            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
           };
         } else {
           series[0].label = {
@@ -323,6 +324,7 @@ export default {
             fontSize: optionsSetup.fontSize,
             color: optionsSetup.dataColor,
             fontWeight: optionsSetup.fontWeight,
+            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
           };
         }
         series[0].barWidth = optionsSetup.maxWidth;
@@ -360,7 +362,7 @@ export default {
       let normal = {};
       if (optionsSetup.verticalShow) {
         normal = {
-          color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [
+          color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
             {
               offset: 0,
               color: optionsSetup.bar0color, // 0% 处的颜色
@@ -376,7 +378,7 @@ export default {
         };
       } else {
         normal = {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+          color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
             {
               offset: 0,
               color: optionsSetup.bar0color, // 0% 处的颜色
@@ -395,7 +397,6 @@ export default {
     },
     // 数据解析
     setOptionsData(e, paramsConfig) {
-      const optionsSetup = this.optionsSetup;
       const optionsData = this.optionsData; // 数据类型 静态 or 动态
       // 联动接收者逻辑开始
       optionsData.dynamicData = optionsData.dynamicData || {}; // 兼容 dynamicData undefined