From e269ddca855fa617354ac991f0bcc0def1c0ad76 Mon Sep 17 00:00:00 2001
From: qianming <qianming@anji-plus.com>
Date: Thu, 26 Aug 2021 17:54:25 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9F=B1=E7=8A=B6=E5=AF=B9=E6=AF=94=E5=9B=BE?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/report/bigscreen/designer/tools.js  | 79 +++++++++++++++++--
 .../widget/bar/widgetBarCompareChart.vue      | 43 ++++++++--
 2 files changed, 112 insertions(+), 10 deletions(-)

diff --git a/report-ui/src/views/report/bigscreen/designer/tools.js b/report-ui/src/views/report/bigscreen/designer/tools.js
index 380da8b9..7cbded00 100644
--- a/report-ui/src/views/report/bigscreen/designer/tools.js
+++ b/report-ui/src/views/report/bigscreen/designer/tools.js
@@ -7116,8 +7116,77 @@ const widgetTools = [
               },
             ],
           },
-          /*{
-            name: 'X轴设置',
+          {
+            name: '左X轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'hideXLeft',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-number',
+                label: '数值间隔',
+                name: 'splitNumberLeft',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'XcolorLeft',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeXLeft',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorXLeft',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: 'X轴线',
+                name: 'downSplitLineXLeft',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'el-switch',
+                label: '竖分割线',
+                name: 'SplitLineXLeft',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'el-switch',
+                label: '边框线',
+                name: 'upSplitLineXLeft',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+            ],
+          },
+          {
+            name: '右X轴设置',
             list: [
               {
                 type: 'el-switch',
@@ -7217,8 +7286,8 @@ const widgetTools = [
 
               }
             ],
-          },*/
-          /*{
+          },
+          {
             name: 'Y轴设置',
             list: [
               {
@@ -7309,7 +7378,7 @@ const widgetTools = [
 
               }
             ],
-          },*/
+          },
           {
             name: '数值设定',
             list: [
diff --git a/report-ui/src/views/report/bigscreen/designer/widget/bar/widgetBarCompareChart.vue b/report-ui/src/views/report/bigscreen/designer/widget/bar/widgetBarCompareChart.vue
index b1b8ed6f..4c398abc 100644
--- a/report-ui/src/views/report/bigscreen/designer/widget/bar/widgetBarCompareChart.vue
+++ b/report-ui/src/views/report/bigscreen/designer/widget/bar/widgetBarCompareChart.vue
@@ -26,7 +26,7 @@ export default {
         //边距
         grid: [
           {//左
-            show: false,
+            show: false,//边框线
             left: '4%',
             top: 60,
             bottom: 10,
@@ -66,7 +66,7 @@ export default {
             splitNumber: 2,
             type: 'value',
             inverse: true,
-            axisLine: {
+            axisLine: {//底分割线
               show: false,
             },
             axisTick: {
@@ -80,7 +80,7 @@ export default {
                 fontSize: 12
               }
             },
-            splitLine: { // 分割线
+            splitLine: { // 竖分割线
               show: true,
               lineStyle: {
                 color: '#57617f',
@@ -275,9 +275,10 @@ export default {
     // 修改图标options属性
     editorOptions() {
       this.setOptionsTitle();
+      this.setOptionsXLeft();
       this.setOptionsTop();
       this.setOptionsTooltip();
-      this.setOptionsMargin();
+      this.setOptionsGrid();
       this.setOptionsLegend();
       this.setOptionsColor();
       this.setOptionsData();
@@ -296,6 +297,38 @@ export default {
       };
       this.options.title = title;
     },
+    // 左X轴设置
+    setOptionsXLeft() {
+      const optionsSetup = this.optionsSetup;
+      const xAxisLeft = {
+        splitNumber: optionsSetup.splitNumberLeft,
+        type: 'value',
+        inverse: true,
+        axisLine: {//X轴线
+          show: false,
+        },
+        axisTick: {
+          show: false,
+        },
+        position: 'bottom',
+        axisLabel: { // x轴
+          show: optionsSetup.hideXLeft,
+          textStyle: {
+            color : optionsSetup.lineColorXLeft,
+            fontSize: optionsSetup.fontSizeXLeft
+          }
+        },
+        splitLine: { // 分割线
+          show: false,
+          lineStyle: {
+            color: '#57617f',
+            width: 1,
+            type: 'solid'
+          }
+        }
+      }
+      this.options.xAxis[0] = xAxisLeft;
+    },
     // 数值设定、柱体设置
     setOptionsTop() {
       const optionsSetup = this.optionsSetup;
@@ -351,7 +384,7 @@ export default {
       this.options.tooltip = tooltip;
     },
     // 边距设置
-    setOptionsMargin() {
+    setOptionsGrid() {
       const optionsSetup = this.optionsSetup;
       const grid = [
         {//左