柱状对比图功能更新

report-ui/src/views/report/bigscreen/designer/tools.js

@@ -7373,31 +7373,26 @@ const widgetTools = [
               },
             ],
           },
-          /*{
+          {
             name: '坐标轴边距设置',
             list: [
               {
                 type: 'el-slider',
-                label: '左边距(像素)',
-                name: 'marginLeft',
+                label: '左右边距(像素)',
+                name: 'marginLeftRight',
                 required: false,
                 placeholder: '',
                 value: 10,
-              }, {
+              },
+              {
                 type: 'el-slider',
                 label: '顶边距(像素)',
                 name: 'marginTop',
                 required: false,
                 placeholder: '',
-                value: 50,
-              }, {
-                type: 'el-slider',
-                label: '右边距(像素)',
-                name: 'marginRight',
-                required: false,
-                placeholder: '',
                 value: 40,
-              }, {
+              },
+              {
                 type: 'el-slider',
                 label: '底边距(像素)',
                 name: 'marginBottom',
@@ -7406,7 +7401,7 @@ const widgetTools = [
                 value: 10,
               },
             ],
-          },*/
+          },
           {
             name: '图例操作',
             list: [

report-ui/src/views/report/bigscreen/designer/widget/bar/widgetBarCompareChart.vue

@@ -23,8 +23,9 @@ export default {
             color: '#ffffff',
           },
         },
+        //边距
         grid: [
-          {
+          {//左
             show: false,
             left: '4%',
             top: 60,
@@ -36,10 +37,10 @@ export default {
             show: false,
             left: '50.5%',
             top: 60,
-            bottom: 80,
+            bottom: 25,
             width: '0%'
           },
-          {
+          {//右
             show: false,
             right: '4%',
             top: 60,
@@ -197,9 +198,9 @@ export default {
                 color: '#36c5e7',
                 barBorderRadius: [8, 0, 0, 8],
               },
-              /*emphasis: {
+              emphasis: {
                 show: false,
-              },*/
+              },
             },
             data: [],
           },
@@ -275,6 +276,8 @@ export default {
     editorOptions() {
       this.setOptionsTitle();
       this.setOptionsTop();
+      this.setOptionsTooltip();
+      this.setOptionsMargin();
       this.setOptionsLegend();
       this.setOptionsColor();
       this.setOptionsData();
@@ -334,6 +337,49 @@ export default {
       }
       this.options.series = series;
     },
+    // tooltip 提示语设置
+    setOptionsTooltip() {
+      const optionsSetup = this.optionsSetup;
+      const tooltip = {
+        trigger: "item",
+        show: true,
+        textStyle: {
+          color: optionsSetup.lineColor,
+          fontSize: optionsSetup.fontSize
+        }
+      };
+      this.options.tooltip = tooltip;
+    },
+    // 边距设置
+    setOptionsMargin() {
+      const optionsSetup = this.optionsSetup;
+      const grid = [
+        {//左
+          show: false,
+          left: optionsSetup.marginLeftRight,
+          top: optionsSetup.marginTop,
+          bottom: optionsSetup.marginBottom,
+          containLabel: true,
+          width: '40%'
+        },
+        {//中间字体位置
+          show: false,
+          left: "51%",
+          top: optionsSetup.marginTop,
+          bottom: optionsSetup.marginBottom + 15,
+          width: '0%'
+        },
+        {//右
+          show: false,
+          right: optionsSetup.marginLeftRight,
+          top: optionsSetup.marginTop,
+          bottom: optionsSetup.marginBottom,
+          containLabel: true,
+          width: '40%'
+        },
+      ]
+      this.options.grid = grid;
+    },
     // 图例操作
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;