浏览代码

Merge branch 'dev' of https://gitee.com/anji-plus/report into dev

qianlishi 1 年之前
父节点
当前提交
38cf8be2a8
共有 44 个文件被更改,包括 11538 次插入3923 次删除
  1. 15 0
      doc/docs/guide/question.md
  2. 二进制
      doc/docs/picture/qusetion/img_10.png
  3. 二进制
      doc/docs/picture/qusetion/img_11.png
  4. 二进制
      doc/docs/picture/qusetion/img_8.png
  5. 二进制
      doc/docs/picture/qusetion/img_9.png
  6. 4 4
      report-ui/src/views/bigscreenDesigner/designer/components/dynamicAddRadar.vue
  7. 490 228
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-compare.js
  8. 669 173
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-double-yaxis-chart.js
  9. 593 219
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-stack-more-show.js
  10. 583 220
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-stack.js
  11. 583 220
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-barchart.js
  12. 563 165
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-gradient-barchart.js
  13. 700 204
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/barlineCharts/widget-bar-line-stack.js
  14. 698 202
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/barlineCharts/widget-barlinechart.js
  15. 700 204
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/barlineCharts/widget-more-bar-line.js
  16. 287 76
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/funnelCharts/widget-funnel.js
  17. 595 177
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/lineCharts/widget-line-compare.js
  18. 578 215
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/lineCharts/widget-line-stack.js
  19. 578 215
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/lineCharts/widget-linechart.js
  20. 264 48
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/mapCharts/widget-bar-map.js
  21. 370 104
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/percentCharts/widget-gauge.js
  22. 58 4
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/percentCharts/widget-pie-percentage.js
  23. 542 55
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-pie-nightingale.js
  24. 530 55
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-piechart.js
  25. 165 14
      report-ui/src/views/bigscreenDesigner/designer/tools/configure/radarCharts/widget-radar.js
  26. 122 74
      report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarCompareChart.vue
  27. 130 62
      report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarDoubleYaxisChart.vue
  28. 110 52
      report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue
  29. 126 53
      report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackMoreShowChart.vue
  30. 114 53
      report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarchart.vue
  31. 87 38
      report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetGradientColorBarchart.vue
  32. 150 74
      report-ui/src/views/bigscreenDesigner/designer/widget/barline/widgetBarLineStackChart.vue
  33. 139 67
      report-ui/src/views/bigscreenDesigner/designer/widget/barline/widgetBarlinechart.vue
  34. 149 73
      report-ui/src/views/bigscreenDesigner/designer/widget/barline/widgetMoreBarLineChart.vue
  35. 50 33
      report-ui/src/views/bigscreenDesigner/designer/widget/funnel/widgetFunnel.vue
  36. 143 79
      report-ui/src/views/bigscreenDesigner/designer/widget/line/widgetLineCompareChart.vue
  37. 113 52
      report-ui/src/views/bigscreenDesigner/designer/widget/line/widgetLineStackChart.vue
  38. 113 52
      report-ui/src/views/bigscreenDesigner/designer/widget/line/widgetLinechart.vue
  39. 81 30
      report-ui/src/views/bigscreenDesigner/designer/widget/map/widgetBarMap.vue
  40. 52 6
      report-ui/src/views/bigscreenDesigner/designer/widget/percent/widgetGauge.vue
  41. 17 171
      report-ui/src/views/bigscreenDesigner/designer/widget/percent/widgetPiePercentageChart.vue
  42. 117 68
      report-ui/src/views/bigscreenDesigner/designer/widget/pie/widgetPieNightingaleRose.vue
  43. 116 58
      report-ui/src/views/bigscreenDesigner/designer/widget/pie/widgetPiechart.vue
  44. 44 26
      report-ui/src/views/bigscreenDesigner/designer/widget/radar/widgetRadar.vue

+ 15 - 0
doc/docs/guide/question.md

@@ -123,8 +123,23 @@
 
 <br>
 
+## V1.3.0版本
 
+V1.3.0为多张图表新增了配置项,有部分配置项直接和图表展示相关联,当旧版本升级至此版本后会有部分图表不能正常显示,可参考以下内容进行调整。<br>
+如果以下方案皆不能使图表正常显示,可选择删除原有图表重新拖出配置。<br>
 
+- 双Y柱图Y轴不显示 <br>
+  ![img8](../picture/qusetion/img_8.png) <br>
 
+解决方案:<br>
+打开Y轴配置项,左Y轴,右Y轴都可以,按图切换“显示”按钮,直到图表Y轴显示。<br>
+![img9](../picture/qusetion/img_9.png) <br>
+
+- 柱状图(全部)柱子不显示 <br>
+  ![img10](../picture/qusetion/img_10.png) <br>
+
+解决方案:<br>
+打开柱体设置,找到“间距”,来回拖动,直到图表柱体显示。<br>
+![img11](../picture/qusetion/img_11.png) <br>
 
 

二进制
doc/docs/picture/qusetion/img_10.png


二进制
doc/docs/picture/qusetion/img_11.png


二进制
doc/docs/picture/qusetion/img_8.png


二进制
doc/docs/picture/qusetion/img_9.png


+ 4 - 4
report-ui/src/views/bigscreenDesigner/designer/components/dynamicAddRadar.vue

@@ -9,10 +9,10 @@
     >新增</el-button
     >
     <el-table :data="formData" style="width: 100%">
-      <el-table-column prop="name" label="名称" width="100" />
-      <el-table-column prop="key" label="key值" width="100" />
-      <el-table-column prop="max" label="最大值" width="100" />
-      <el-table-column label="操作" width="100">
+      <el-table-column prop="name" label="名称" width="90" />
+      <el-table-column prop="key" label="key值" width="90" />
+      <el-table-column prop="max" label="最大值" width="70" />
+      <el-table-column label="操作" width="90">
         <template slot-scope="scope">
           <div class="button-group">
             <el-button

文件差异内容过多而无法显示
+ 490 - 228
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-compare.js


文件差异内容过多而无法显示
+ 669 - 173
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-double-yaxis-chart.js


文件差异内容过多而无法显示
+ 593 - 219
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-stack-more-show.js


文件差异内容过多而无法显示
+ 583 - 220
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-stack.js


文件差异内容过多而无法显示
+ 583 - 220
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-barchart.js


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

@@ -40,6 +40,178 @@ export const widgetGradientBarchart = {
         value: ''
       },
       [
+        {
+          name: '标题设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '标题显示',
+              name: 'isShowTitle',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-text',
+              label: '标题名',
+              name: 'text',
+              required: false,
+              placeholder: '',
+              value: '',
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'textColor',
+              required: false,
+              placeholder: '',
+              value: '#FFD700'
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'textFontSize',
+              required: false,
+              placeholder: '',
+              value: 20
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'textFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'textFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'textFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'el-input-text',
+              label: '副标题名',
+              name: 'subtext',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'subtextColor',
+              required: false,
+              placeholder: '',
+              value: 'rgba(30, 144, 255, 1)'
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'subtextFontSize',
+              required: false,
+              placeholder: '',
+              value: 20
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'subtextFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'subtextFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'subtextFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'el-select',
+              label: '左右位置',
+              name: 'titleLeft',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'center', name: '居中'},
+                {code: 'left', name: '左对齐'},
+                {code: 'right', name: '右对齐'},
+              ],
+              value: 'center'
+            },
+            {
+              type: 'el-slider',
+              label: '上下间距',
+              name: 'titleTop',
+              required: false,
+              placeholder: '',
+              value: 5,
+            },
+            {
+              type: 'el-input-number',
+              label: '主副标题间距',
+              name: 'titleItemGap',
+              required: false,
+              placeholder: '',
+              value: 0
+            },
+          ],
+        },
         {
           name: '柱体设置',
           list: [
@@ -147,44 +319,64 @@ export const widgetGradientBarchart = {
           ],
         },
         {
-          name: '标题设置',
+          name: 'X轴设置',
           list: [
             {
               type: 'el-switch',
-              label: '标题显示',
-              name: 'isNoTitle',
+              label: 'X轴显示',
+              name: 'isShowX',
               required: false,
               placeholder: '',
               value: true,
             },
             {
-              type: 'el-input-text',
-              label: '标题名',
-              name: 'titleText',
+              type: 'el-switch',
+              label: '数值显示',
+              name: 'isShowAxisLabelX',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-select',
+              label: '数值位置',
+              name: 'positionX',
               required: false,
               placeholder: '',
-              value: '',
+              selectOptions: [
+                {code: 'top', name: '上'},
+                {code: 'bottom', name: '下'},
+              ],
+              value: 'bottom'
+            },
+            {
+              type: 'el-input-number',
+              label: '数值距离',
+              name: 'offsetX',
+              required: false,
+              placeholder: '',
+              value: 0
             },
             {
               type: 'vue-color',
-              label: '字体颜色',
-              name: 'textColor',
+              label: '数值颜色',
+              name: 'textColorX',
               required: false,
               placeholder: '',
-              value: '#FFD700'
+              value: '#fff',
             },
             {
               type: 'el-input-number',
-              label: '字体字号',
-              name: 'textFontSize',
+              label: '数值字号',
+              name: 'textFontSizeX',
               required: false,
               placeholder: '',
-              value: 20
+              value: 14,
             },
             {
               type: 'el-select',
-              label: '字体粗细',
-              name: 'textFontWeight',
+              label: '数值粗细',
+              name: 'textFontWeightX',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -197,8 +389,8 @@ export const widgetGradientBarchart = {
             },
             {
               type: 'el-select',
-              label: '字体风格',
-              name: 'textFontStyle',
+              label: '数值风格',
+              name: 'textFontStyleX',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -210,176 +402,159 @@ export const widgetGradientBarchart = {
             },
             {
               type: 'el-select',
-              label: '字体位置',
-              name: 'textAlign',
+              label: '数值字体',
+              name: 'textFontFamilyX',
               required: false,
               placeholder: '',
               selectOptions: [
-                {code: 'center', name: '居中'},
-                {code: 'left', name: '左对齐'},
-                {code: 'right', name: '右对齐'},
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
               ],
-              value: 'center'
+              value: 'sans-serif'
             },
             {
-              type: 'el-input-text',
-              label: '副标题名',
-              name: 'subText',
+              type: 'el-switch',
+              label: '数值自动换行',
+              name: 'textRowsBreakAuto',
               required: false,
               placeholder: '',
-              value: ''
+              value: false,
             },
             {
-              type: 'vue-color',
-              label: '字体颜色',
-              name: 'subTextColor',
+              type: 'el-input-text',
+              label: '数值行数',
+              name: 'textRowsNum',
               required: false,
               placeholder: '',
-              value: 'rgba(30, 144, 255, 1)'
+              value: '',
             },
             {
               type: 'el-input-number',
-              label: '字体字号',
-              name: 'subTextFontSize',
-              required: false,
-              placeholder: '',
-              value: 20
-            },
-            {
-              type: 'el-select',
-              label: '字体粗细',
-              name: 'subTextFontWeight',
+              label: '数值间隔',
+              name: 'textIntervalX',
               required: false,
               placeholder: '',
-              selectOptions: [
-                {code: 'normal', name: '正常'},
-                {code: 'bold', name: '粗体'},
-                {code: 'bolder', name: '特粗体'},
-                {code: 'lighter', name: '细体'}
-              ],
-              value: 'normal'
+              value: ''
             },
             {
-              type: 'el-select',
-              label: '字体风格',
-              name: 'subTextFontStyle',
+              type: 'el-input-number',
+              label: '数值角度',
+              name: 'textAngleX',
               required: false,
               placeholder: '',
-              selectOptions: [
-                {code: 'normal', name: '正常'},
-                {code: 'italic', name: 'italic斜体'},
-                {code: 'oblique', name: 'oblique斜体'},
-              ],
-              value: 'normal'
+              value: 0
             },
-          ],
-        },
-        {
-          name: 'X轴设置',
-          list: [
             {
               type: 'el-switch',
-              label: '显示',
-              name: 'hideX',
-              required: false,
+              label: '坐标轴显示',
+              name: 'isShowAxisLineX',
+              require: false,
               placeholder: '',
               value: true,
             },
             {
-              type: 'el-input-text',
-              label: '坐标名',
-              name: 'nameX',
-              required: false,
-              placeholder: '',
-              value: ''
-            },
-            {
-              type: 'vue-color',
-              label: '坐标名颜色',
-              name: 'nameColorX',
-              required: false,
-              placeholder: '',
-              value: '#fff'
-            },
-            {
-              type: 'el-input-number',
-              label: '坐标名字号',
-              name: 'nameFontSizeX',
+              type: 'el-switch',
+              label: '坐标轴反转',
+              name: 'reversalX',
               required: false,
               placeholder: '',
-              value: 14
+              value: false
             },
             {
               type: 'vue-color',
-              label: '数值颜色',
-              name: 'colorX',
+              label: '坐标轴颜色',
+              name: 'lineColorX',
               required: false,
               placeholder: '',
               value: '#fff',
             },
             {
               type: 'el-input-number',
-              label: '数值字号',
-              name: 'fontSizeX',
+              label: '坐标轴宽度',
+              name: 'lineWidthX',
               required: false,
               placeholder: '',
-              value: 14,
+              value: 1,
             },
             {
-              type: 'el-switch',
-              label: '数值自动换行',
-              name: 'textRowsBreakAuto',
+              type: 'el-input-text',
+              label: '坐标名',
+              name: 'nameX',
               required: false,
               placeholder: '',
-              value: false,
+              value: ''
             },
-            {
-              type: 'el-input-text',
-              label: '数值行数',
-              name: 'textRowsNum',
+            {
+              type: 'el-select',
+              label: '坐标名位置',
+              name: 'nameLocationX',
               required: false,
               placeholder: '',
-              value: '',
+              selectOptions: [
+                {code: 'start', name: '起点'},
+                {code: 'center', name: '中间'},
+                {code: 'end', name: '终点'},
+              ],
+              value: 'end'
             },
             {
-              type: 'el-input-number',
-              label: '数值间隔',
-              name: 'textInterval',
+              type: 'vue-color',
+              label: '坐标名颜色',
+              name: 'nameColorX',
               required: false,
               placeholder: '',
-              value: ''
+              value: '#fff'
             },
             {
-              type: 'el-slider',
-              label: '数值角度',
-              name: 'textAngleX',
+              type: 'el-input-number',
+              label: '坐标名字号',
+              name: 'nameFontSizeX',
               required: false,
               placeholder: '',
-              value: 0
+              value: 14
             },
             {
-              type: 'el-switch',
-              label: '坐标轴反转',
-              name: 'reversalX',
+              type: 'el-select',
+              label: '坐标名粗细',
+              name: 'nameFontWeightX',
               required: false,
               placeholder: '',
-              value: false
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
             },
             {
-              type: 'vue-color',
-              label: '坐标轴颜色',
-              name: 'lineColorX',
+              type: 'el-select',
+              label: '坐标名风格',
+              name: 'nameFontStyleX',
               required: false,
               placeholder: '',
-              value: '#fff',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
             },
             {
-              type: 'el-input-number',
-              label: '坐标轴宽度',
-              name: 'lineWidthX',
+              type: 'el-select',
+              label: '坐标名字体',
+              name: 'nameFontFamilyX',
               required: false,
               placeholder: '',
-              value: 1,
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
             },
             {
               type: 'el-switch',
@@ -412,12 +587,20 @@ export const widgetGradientBarchart = {
           list: [
             {
               type: 'el-switch',
-              label: '显示',
+              label: 'Y轴显示',
               name: 'isShowY',
               require: false,
               placeholder: '',
               value: true,
             },
+            {
+              type: 'el-switch',
+              label: '数值显示',
+              name: 'isShowAxisLabelY',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
             {
               type: 'el-input-text',
               label: '最大值',
@@ -427,33 +610,29 @@ export const widgetGradientBarchart = {
               value: '',
             },
             {
-              type: 'el-input-text',
-              label: '坐标名',
-              name: 'textNameY',
-              require: false,
-              placeholder: '',
-              value: ''
-            },
-            {
-              type: 'vue-color',
-              label: '坐标名颜色',
-              name: 'nameColorY',
+              type: 'el-select',
+              label: '数值位置',
+              name: 'positionY',
               required: false,
               placeholder: '',
-              value: '#fff',
+              selectOptions: [
+                {code: 'left', name: '左'},
+                {code: 'right', name: '右'},
+              ],
+              value: 'left'
             },
             {
               type: 'el-input-number',
-              label: '坐标名字号',
-              name: 'nameFontSizeY',
+              label: '数值距离',
+              name: 'offsetY',
               required: false,
               placeholder: '',
-              value: 14,
+              value: 0
             },
             {
               type: 'vue-color',
               label: '数值颜色',
-              name: 'colorY',
+              name: 'textColorY',
               required: false,
               placeholder: '',
               value: '#fff',
@@ -461,11 +640,60 @@ export const widgetGradientBarchart = {
             {
               type: 'el-input-number',
               label: '数值字号',
-              name: 'fontSizeY',
+              name: 'textFontSizeY',
               required: false,
               placeholder: '',
               value: 14,
             },
+            {
+              type: 'el-select',
+              label: '数值粗细',
+              name: 'textFontWeightY',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '数值风格',
+              name: 'textFontStyleY',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '数值字体',
+              name: 'textFontFamilyY',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            /*            {
+                          type: 'el-input-number',
+                          label: '数值间隔',
+                          name: 'textIntervalY',
+                          required: false,
+                          placeholder: '',
+                          value: 0
+                        },*/
             {
               type: 'el-switch',
               label: '缩放',
@@ -483,7 +711,7 @@ export const widgetGradientBarchart = {
               value: ''
             },
             {
-              type: 'el-slider',
+              type: 'el-input-number',
               label: '数值角度',
               name: 'textAngleY',
               required: false,
@@ -492,7 +720,15 @@ export const widgetGradientBarchart = {
             },
             {
               type: 'el-switch',
-              label: '轴反转',
+              label: '坐标轴显示',
+              name: 'isShowAxisLineY',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '坐标轴反转',
               name: 'reversalY',
               required: false,
               placeholder: '',
@@ -500,12 +736,98 @@ export const widgetGradientBarchart = {
             },
             {
               type: 'vue-color',
-              label: '轴颜色',
+              label: '坐标轴颜色',
               name: 'lineColorY',
               required: false,
               placeholder: '',
               value: '#fff',
             },
+            {
+              type: 'el-input-number',
+              label: '坐标轴宽度',
+              name: 'lineWidthY',
+              required: false,
+              placeholder: '',
+              value: 1,
+            },
+            {
+              type: 'el-input-text',
+              label: '坐标名',
+              name: 'textNameY',
+              require: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'el-select',
+              label: '坐标名位置',
+              name: 'nameLocationY',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'start', name: '起点'},
+                {code: 'center', name: '中间'},
+                {code: 'end', name: '终点'},
+              ],
+              value: 'end'
+            },
+            {
+              type: 'vue-color',
+              label: '坐标名颜色',
+              name: 'nameColorY',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '坐标名字号',
+              name: 'nameFontSizeY',
+              required: false,
+              placeholder: '',
+              value: 14,
+            },
+            {
+              type: 'el-select',
+              label: '坐标名粗细',
+              name: 'nameFontWeightY',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '坐标名风格',
+              name: 'nameFontStyleY',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '坐标名字体',
+              name: 'nameFontFamilyY',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
             {
               type: 'el-switch',
               label: '分割线显示',
@@ -522,6 +844,14 @@ export const widgetGradientBarchart = {
               placeholder: '',
               value: '#fff',
             },
+            {
+              type: 'el-input-number',
+              label: '分割线宽度',
+              name: 'splitLineWidthY',
+              required: false,
+              placeholder: '',
+              value: 1,
+            },
           ],
         },
         {
@@ -550,14 +880,14 @@ export const widgetGradientBarchart = {
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'top', name: '上' },
-                { code: 'left', name: '左' },
-                { code: 'right', name: '右' },
-                { code: 'inside', name: '里' },
-                { code: 'insideTop', name: '里顶' },
-                { code: 'insideLeft', name: '里左' },
-                { code: 'insideRight', name: '里右' },
-                { code: 'insideBottom', name: '里底' },
+                {code: 'top', name: '上'},
+                {code: 'left', name: '左'},
+                {code: 'right', name: '右'},
+                {code: 'inside', name: '里'},
+                {code: 'insideTop', name: '里顶'},
+                {code: 'insideLeft', name: '里左'},
+                {code: 'insideRight', name: '里右'},
+                {code: 'insideBottom', name: '里底'},
               ],
               value: 'insideTop'
             },
@@ -570,20 +900,20 @@ export const widgetGradientBarchart = {
               value: 0
             },
             {
-              type: 'el-input-number',
-              label: '字体字号',
-              name: 'fontSize',
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'fontColor',
               required: false,
               placeholder: '',
-              value: 14
+              value: ''
             },
             {
-              type: 'vue-color',
-              label: '字体颜色',
-              name: 'dataColor',
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'fontSize',
               required: false,
               placeholder: '',
-              value: '#fff'
+              value: 12
             },
             {
               type: 'el-select',
@@ -599,6 +929,33 @@ export const widgetGradientBarchart = {
               ],
               value: 'normal'
             },
+            {
+              type: 'el-select',
+              label: '数值风格',
+              name: 'fontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '数值字体',
+              name: 'fontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
           ],
         },
         {
@@ -619,8 +976,8 @@ export const widgetGradientBarchart = {
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'item', name: '数据项' },
-                { code: 'axis', name: '坐标轴' },
+                {code: 'item', name: '数据项'},
+                {code: 'axis', name: '坐标轴'},
               ],
               value: 'axis'
             },
@@ -631,17 +988,17 @@ export const widgetGradientBarchart = {
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'none', name: '无' },
-                { code: 'line', name: '直线' },
-                { code: 'shadow', name: '阴影' },
-                { code: 'cross', name: '十字准星' },
+                {code: 'none', name: '无'},
+                {code: 'line', name: '直线'},
+                {code: 'shadow', name: '阴影'},
+                {code: 'cross', name: '十字准星'},
               ],
               value: 'shadow'
             },
             {
               type: 'el-input-number',
               label: '字体字号',
-              name: 'tipsFontSize',
+              name: 'tooltipFontSize',
               required: false,
               placeholder: '',
               value: 16
@@ -649,11 +1006,52 @@ export const widgetGradientBarchart = {
             {
               type: 'vue-color',
               label: '字体颜色',
-              name: 'tipsColor',
+              name: 'tooltipColor',
               required: false,
               placeholder: '',
               value: '#00FEFF'
             },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'tooltipFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'tooltipFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'tooltipFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
           ],
         },
         {
@@ -673,7 +1071,7 @@ export const widgetGradientBarchart = {
               name: 'marginRight',
               required: false,
               placeholder: '',
-              value: 10,
+              value: 50,
             },
             {
               type: 'el-slider',

文件差异内容过多而无法显示
+ 700 - 204
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barlineCharts/widget-bar-line-stack.js


文件差异内容过多而无法显示
+ 698 - 202
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barlineCharts/widget-barlinechart.js


文件差异内容过多而无法显示
+ 700 - 204
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barlineCharts/widget-more-bar-line.js


+ 287 - 76
report-ui/src/views/bigscreenDesigner/designer/tools/configure/funnelCharts/widget-funnel.js

@@ -46,7 +46,7 @@ export const widgetFunnel = {
             {
               type: 'el-switch',
               label: '标题显示',
-              name: 'isNoTitle',
+              name: 'isShowTitle',
               required: false,
               placeholder: '',
               value: true,
@@ -54,7 +54,7 @@ export const widgetFunnel = {
             {
               type: 'el-input-text',
               label: '标题名',
-              name: 'titleText',
+              name: 'text',
               required: false,
               placeholder: '',
               value: '',
@@ -82,10 +82,10 @@ export const widgetFunnel = {
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'normal', name: '正常' },
-                { code: 'bold', name: '粗体' },
-                { code: 'bolder', name: '特粗体' },
-                { code: 'lighter', name: '细体' }
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
               ],
               value: 'normal'
             },
@@ -96,29 +96,30 @@ export const widgetFunnel = {
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'normal', name: '正常' },
-                { code: 'italic', name: 'italic斜体' },
-                { code: 'oblique', name: 'oblique斜体' },
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
               ],
               value: 'normal'
             },
             {
               type: 'el-select',
-              label: '字体位置',
-              name: 'textAlign',
+              label: '字体系列',
+              name: 'textFontFamily',
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'center', name: '居中' },
-                { code: 'left', name: '左对齐' },
-                { code: 'right', name: '右对齐' },
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
               ],
-              value: 'center'
+              value: 'sans-serif'
             },
             {
               type: 'el-input-text',
               label: '副标题名',
-              name: 'subText',
+              name: 'subtext',
               required: false,
               placeholder: '',
               value: ''
@@ -126,7 +127,7 @@ export const widgetFunnel = {
             {
               type: 'vue-color',
               label: '字体颜色',
-              name: 'subTextColor',
+              name: 'subtextColor',
               required: false,
               placeholder: '',
               value: 'rgba(30, 144, 255, 1)'
@@ -134,7 +135,7 @@ export const widgetFunnel = {
             {
               type: 'el-input-number',
               label: '字体字号',
-              name: 'subTextFontSize',
+              name: 'subtextFontSize',
               required: false,
               placeholder: '',
               value: 20
@@ -142,72 +143,72 @@ export const widgetFunnel = {
             {
               type: 'el-select',
               label: '字体粗细',
-              name: 'subTextFontWeight',
+              name: 'subtextFontWeight',
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'normal', name: '正常' },
-                { code: 'bold', name: '粗体' },
-                { code: 'bolder', name: '特粗体' },
-                { code: 'lighter', name: '细体' }
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
               ],
               value: 'normal'
             },
             {
               type: 'el-select',
               label: '字体风格',
-              name: 'subTextFontStyle',
+              name: 'subtextFontStyle',
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'normal', name: '正常' },
-                { code: 'italic', name: 'italic斜体' },
-                { code: 'oblique', name: 'oblique斜体' },
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
               ],
               value: 'normal'
             },
-          ],
-        },
-        {
-          name: '数值设置',
-          list: [
             {
-              type: 'el-switch',
-              label: '显示',
-              name: 'isShow',
-              require: false,
+              type: 'el-select',
+              label: '字体系列',
+              name: 'subtextFontFamily',
+              required: false,
               placeholder: '',
-              value: true,
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
             },
             {
-              type: 'el-input-number',
-              label: '字体字号',
-              name: 'fontSize',
-              require: false,
+              type: 'el-select',
+              label: '左右位置',
+              name: 'titleLeft',
+              required: false,
               placeholder: '',
-              value: 14,
+              selectOptions: [
+                {code: 'center', name: '居中'},
+                {code: 'left', name: '左对齐'},
+                {code: 'right', name: '右对齐'},
+              ],
+              value: 'center'
             },
             {
-              type: 'vue-color',
-              label: '字体颜色',
-              name: 'color',
-              require: false,
+              type: 'el-slider',
+              label: '上下间距',
+              name: 'titleTop',
+              required: false,
               placeholder: '',
-              value: '#fff',
+              value: 5,
             },
             {
-              type: 'el-select',
-              label: '字体粗细',
-              name: 'fontWeight',
-              require: false,
+              type: 'el-input-number',
+              label: '主副标题间距',
+              name: 'titleItemGap',
+              required: false,
               placeholder: '',
-              selectOptions: [
-                { code: 'normal', name: '正常' },
-                { code: 'bold', name: '粗体' },
-                { code: 'bolder', name: '特粗体' },
-                { code: 'lighter', name: '细体' }
-              ],
-              value: 'normal'
+              value: 0
             },
           ],
         },
@@ -216,12 +217,20 @@ export const widgetFunnel = {
           list: [
             {
               type: 'el-switch',
-              label: '显示',
+              label: '图例显示',
               name: 'isShowLegend',
               required: false,
               placeholder: '',
               value: true,
             },
+            {
+              type: 'el-input-text',
+              label: '名称( | 分隔)',
+              name: 'legendName',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
             {
               type: 'vue-color',
               label: '字体颜色',
@@ -236,7 +245,48 @@ export const widgetFunnel = {
               name: 'legendFontSize',
               required: false,
               placeholder: '',
-              value: 16,
+              value: 12,
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'legendFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'legendFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'legendFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
             },
             {
               type: 'el-input-number',
@@ -244,7 +294,15 @@ export const widgetFunnel = {
               name: 'legendWidth',
               required: false,
               placeholder: '',
-              value: 15,
+              value: 12,
+            },
+            {
+              type: 'el-input-number',
+              label: '图例高度',
+              name: 'legendHeight',
+              required: false,
+              placeholder: '',
+              value: 12,
             },
             {
               type: 'el-select',
@@ -253,9 +311,9 @@ export const widgetFunnel = {
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'center', name: '居中' },
-                { code: 'left', name: '左对齐' },
-                { code: 'right', name: '右对齐' },
+                {code: 'center', name: '居中'},
+                {code: 'left', name: '左对齐'},
+                {code: 'right', name: '右对齐'},
               ],
               value: 'center'
             },
@@ -266,8 +324,8 @@ export const widgetFunnel = {
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'top', name: '顶部' },
-                { code: 'bottom', name: '底部' },
+                {code: 'top', name: '顶部'},
+                {code: 'bottom', name: '底部'},
               ],
               value: 'top'
             },
@@ -278,20 +336,132 @@ export const widgetFunnel = {
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'vertical', name: '竖排' },
-                { code: 'horizontal', name: '横排' },
+                {code: 'vertical', name: '竖排'},
+                {code: 'horizontal', name: '横排'},
               ],
               value: 'horizontal'
             },
           ],
         },
+        {
+          name: '数值设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShow',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '百分比符号显示',
+              name: 'percentSign',
+              required: false,
+              placeholder: '',
+              value: false
+            },
+            {
+              type: 'el-select',
+              label: '位置',
+              name: 'fontPosition',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'top', name: '上'},
+                {code: 'left', name: '左'},
+                {code: 'right', name: '右'},
+                {code: 'inside', name: '里'},
+                {code: 'insideTop', name: '里顶'},
+                {code: 'insideLeft', name: '里左'},
+                {code: 'insideRight', name: '里右'},
+                {code: 'insideBottom', name: '里底'},
+              ],
+              value: 'inside'
+            },
+            {
+              type: 'el-input-number',
+              label: '距离',
+              name: 'fontDistance',
+              required: false,
+              placeholder: '',
+              value: 0
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'fontColor',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'fontSize',
+              required: false,
+              placeholder: '',
+              value: 12
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'fontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '数值风格',
+              name: 'fontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '数值字体',
+              name: 'fontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+          ],
+        },
         {
           name: '提示语设置',
           list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShowTooltip',
+              required: false,
+              placeholder: '',
+              value: true
+            },
             {
               type: 'el-input-number',
               label: '字体字号',
-              name: 'tipsFontSize',
+              name: 'tooltipFontSize',
               required: false,
               placeholder: '',
               value: 16
@@ -299,11 +469,52 @@ export const widgetFunnel = {
             {
               type: 'vue-color',
               label: '字体颜色',
-              name: 'tipsColor',
+              name: 'tooltipColor',
               required: false,
               placeholder: '',
               value: '#00FEFF'
             },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'tooltipFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'tooltipFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'tooltipFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
           ],
         },
         {
@@ -314,7 +525,7 @@ export const widgetFunnel = {
               label: '',
               name: 'customColor',
               required: false,
-              value: [{ color: '#0CD2E6' }, { color: '#00BFA5' }, { color: '#FFC722' }, { color: '#886EFF' }, { color: '#008DEC' }],
+              value: [{color: '#0CD2E6'}, {color: '#00BFA5'}, {color: '#FFC722'}, {color: '#886EFF'}, {color: '#008DEC'}],
             },
           ],
         },
@@ -358,11 +569,11 @@ export const widgetFunnel = {
         relactiveDom: 'dataType',
         relactiveDomValue: 'staticData',
         value: [
-          { "value": 2, "name": "访问" },
-          { "value": 5, "name": "咨询" },
-          { "value": 20, "name": "订单" },
-          { "value": 40, "name": "点击" },
-          { "value": 125, "name": "展现" }
+          {"value": 2, "name": "访问"},
+          {"value": 5, "name": "咨询"},
+          {"value": 20, "name": "订单"},
+          {"value": 40, "name": "点击"},
+          {"value": 125, "name": "展现"}
         ],
       },
       {

文件差异内容过多而无法显示
+ 595 - 177
report-ui/src/views/bigscreenDesigner/designer/tools/configure/lineCharts/widget-line-compare.js


文件差异内容过多而无法显示
+ 578 - 215
report-ui/src/views/bigscreenDesigner/designer/tools/configure/lineCharts/widget-line-stack.js


文件差异内容过多而无法显示
+ 578 - 215
report-ui/src/views/bigscreenDesigner/designer/tools/configure/lineCharts/widget-linechart.js


+ 264 - 48
report-ui/src/views/bigscreenDesigner/designer/tools/configure/mapCharts/widget-bar-map.js

@@ -1,7 +1,7 @@
 export const widgetBarMap = {
   code: 'widgetBarMap',
   type: 'mapChart',
-  tabName: '中国地图',
+  tabName: '地图',
   label: '柱形地图',
   icon: 'iconzhongguoditu',
   options: {
@@ -13,7 +13,7 @@ export const widgetBarMap = {
         name: 'layerName',
         required: false,
         placeholder: '',
-        value: '中国地图-柱形图',
+        value: '柱形图',
       },
       {
         type: 'vue-color',
@@ -23,6 +23,52 @@ export const widgetBarMap = {
         placeholder: '',
         value: ''
       },
+      {
+        type: 'el-select',
+        label: '地图名称',
+        name: 'mapName',
+        required: false,
+        placeholder: '',
+        selectOptions: [
+          { code: 'world', name: '世界' },
+          { code: 'china', name: '中国' },
+          { code: '安徽', name: '安徽' },
+          { code: '澳门', name: '澳门' },
+          { code: '北京', name: '北京' },
+          { code: '重庆', name: '重庆' },
+          { code: '福建', name: '福建' },
+          { code: '甘肃', name: '甘肃' },
+          { code: '广东', name: '广东' },
+          { code: '广西', name: '广西' },
+          { code: '贵州', name: '贵州' },
+          { code: '海南', name: '海南' },
+          { code: '河北', name: '河北' },
+          { code: '黑龙江', name: '黑龙江' },
+          { code: '河南', name: '河南' },
+          { code: '湖北', name: '湖北' },
+          { code: '湖南', name: '湖南' },
+          { code: '江苏', name: '江苏' },
+          { code: '江西', name: '江西' },
+          { code: '吉林', name: '吉林' },
+          { code: '辽宁', name: '辽宁' },
+          { code: '内蒙古', name: '内蒙古' },
+          { code: '宁夏', name: '宁夏' },
+          { code: '青海', name: '青海' },
+          { code: '山东', name: '山东' },
+          { code: '上海', name: '上海' },
+          { code: '山西', name: '山西' },
+          { code: '陕西', name: '陕西' },
+          { code: '四川', name: '四川' },
+          { code: '台湾', name: '台湾' },
+          { code: '天津', name: '天津' },
+          { code: '香港', name: '香港' },
+          { code: '新疆', name: '新疆' },
+          { code: '西藏', name: '西藏' },
+          { code: '云南', name: '云南' },
+          { code: '浙江', name: '浙江' },
+        ],
+        value: 'china'
+      },
       [
         {
           name: '标题设置',
@@ -30,7 +76,7 @@ export const widgetBarMap = {
             {
               type: 'el-switch',
               label: '标题显示',
-              name: 'isNoTitle',
+              name: 'isShowTitle',
               required: false,
               placeholder: '',
               value: true,
@@ -38,7 +84,7 @@ export const widgetBarMap = {
             {
               type: 'el-input-text',
               label: '标题名',
-              name: 'titleText',
+              name: 'text',
               required: false,
               placeholder: '',
               value: '',
@@ -88,21 +134,22 @@ export const widgetBarMap = {
             },
             {
               type: 'el-select',
-              label: '字体位置',
-              name: 'textAlign',
+              label: '字体系列',
+              name: 'textFontFamily',
               required: false,
               placeholder: '',
               selectOptions: [
-                {code: 'center', name: '居中'},
-                {code: 'left', name: '左对齐'},
-                {code: 'right', name: '右对齐'},
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
               ],
-              value: 'center'
+              value: 'sans-serif'
             },
             {
               type: 'el-input-text',
               label: '副标题名',
-              name: 'subText',
+              name: 'subtext',
               required: false,
               placeholder: '',
               value: ''
@@ -110,7 +157,7 @@ export const widgetBarMap = {
             {
               type: 'vue-color',
               label: '字体颜色',
-              name: 'subTextColor',
+              name: 'subtextColor',
               required: false,
               placeholder: '',
               value: 'rgba(30, 144, 255, 1)'
@@ -118,7 +165,7 @@ export const widgetBarMap = {
             {
               type: 'el-input-number',
               label: '字体字号',
-              name: 'subTextFontSize',
+              name: 'subtextFontSize',
               required: false,
               placeholder: '',
               value: 20
@@ -126,7 +173,7 @@ export const widgetBarMap = {
             {
               type: 'el-select',
               label: '字体粗细',
-              name: 'subTextFontWeight',
+              name: 'subtextFontWeight',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -140,7 +187,7 @@ export const widgetBarMap = {
             {
               type: 'el-select',
               label: '字体风格',
-              name: 'subTextFontStyle',
+              name: 'subtextFontStyle',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -150,6 +197,49 @@ export const widgetBarMap = {
               ],
               value: 'normal'
             },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'subtextFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'el-select',
+              label: '左右位置',
+              name: 'titleLeft',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'center', name: '居中'},
+                {code: 'left', name: '左对齐'},
+                {code: 'right', name: '右对齐'},
+              ],
+              value: 'center'
+            },
+            {
+              type: 'el-slider',
+              label: '上下间距',
+              name: 'titleTop',
+              required: false,
+              placeholder: '',
+              value: 5,
+            },
+            {
+              type: 'el-input-number',
+              label: '主副标题间距',
+              name: 'titleItemGap',
+              required: false,
+              placeholder: '',
+              value: 0
+            },
           ],
         },
         {
@@ -157,66 +247,86 @@ export const widgetBarMap = {
           list: [
             {
               type: 'el-switch',
-              label: '省市区显示',
+              label: '文字显示',
               name: 'isShowMap',
               required: false,
               placeholder: '',
-              value: false,
+              value: false
             },
             {
               type: 'el-input-number',
               label: '文字大小',
-              name: 'fontSizeMap',
+              name: 'fontSize',
               required: false,
               placeholder: '',
-              value: 20,
+              value: 12,
             },
             {
               type: 'vue-color',
               label: '文字颜色',
-              name: 'colorMap',
+              name: 'fontColor',
               required: false,
               placeholder: '',
-              value: '#53D9FF'
-            }
-          ]
-        },
-        {
-          name: '地图块颜色',
-          list: [
+              value: '#D4EEFF'
+            },
             {
-              type: 'vue-color',
-              label: '0%处颜色',
-              name: 'font0PreColor',
+              type: 'el-select',
+              label: '文字粗细',
+              name: 'fontWeight',
               required: false,
               placeholder: '',
-              value: '#073684'
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
             },
             {
-              type: 'vue-color',
-              label: '100%颜色',
-              name: 'font100PreColor',
+              type: 'el-select',
+              label: '文字风格',
+              name: 'fontStyle',
               required: false,
               placeholder: '',
-              value: '#061E3D'
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
             },
             {
-              type: 'vue-color',
-              label: '高亮渐变色',
-              name: 'fontHighlightColor',
+              type: 'el-select',
+              label: '文字字体',
+              name: 'fontFamily',
               required: false,
               placeholder: '',
-              value: '#2B91B7'
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'el-input-number',
+              label: '边界线宽度',
+              name: 'borderWidth',
+              required: false,
+              placeholder: '',
+              value: 0
             },
             {
               type: 'vue-color',
-              label: '边界颜色',
+              label: '边界线颜色',
               name: 'borderColor',
               required: false,
               placeholder: '',
-              value: '#061E3D'
+              value: '#fff'
             },
-          ],
+          ]
         },
         {
           name: '柱形设置',
@@ -264,7 +374,7 @@ export const widgetBarMap = {
               name: 'fontTextSize',
               required: false,
               placeholder: '',
-              value: 15,
+              value: 16,
             },
             {
               type: 'el-select',
@@ -282,7 +392,7 @@ export const widgetBarMap = {
             },
             {
               type: 'el-select',
-              label: '字风格',
+              label: '字风格',
               name: 'fontTextStyle',
               required: false,
               placeholder: '',
@@ -293,6 +403,20 @@ export const widgetBarMap = {
               ],
               value: 'normal'
             },
+            {
+              type: 'el-select',
+              label: '文字字体',
+              name: 'fontTextFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
             {
               type: 'el-switch',
               label: '数值显示',
@@ -307,7 +431,7 @@ export const widgetBarMap = {
               name: 'fontDataSize',
               required: false,
               placeholder: '',
-              value: 15,
+              value: 16,
             },
             {
               type: 'el-select',
@@ -336,15 +460,66 @@ export const widgetBarMap = {
               ],
               value: 'normal'
             },
+            {
+              type: 'el-select',
+              label: '数值字体',
+              name: 'fontDataFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+          ],
+        },
+        {
+          name: '地图块颜色',
+          list: [
+            {
+              type: 'vue-color',
+              label: '0%处颜色',
+              name: 'font0PreColor',
+              required: false,
+              placeholder: '',
+              value: '#073684'
+            },
+            {
+              type: 'vue-color',
+              label: '100%颜色',
+              name: 'font100PreColor',
+              required: false,
+              placeholder: '',
+              value: '#061E3D'
+            },
+            {
+              type: 'vue-color',
+              label: '高亮渐变色',
+              name: 'fontHighlightColor',
+              required: false,
+              placeholder: '',
+              value: '#2B91B7'
+            },
           ],
         },
         {
           name: '提示语设置',
           list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShowTooltip',
+              required: false,
+              placeholder: '',
+              value: true
+            },
             {
               type: 'el-input-number',
               label: '字体字号',
-              name: 'tipsFontSize',
+              name: 'tooltipFontSize',
               required: false,
               placeholder: '',
               value: 16
@@ -352,11 +527,52 @@ export const widgetBarMap = {
             {
               type: 'vue-color',
               label: '字体颜色',
-              name: 'tipsColor',
+              name: 'tooltipColor',
               required: false,
               placeholder: '',
               value: '#00FEFF'
             },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'tooltipFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'tooltipFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'tooltipFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
           ],
         },
         {
@@ -471,7 +687,7 @@ export const widgetBarMap = {
         name: 'height',
         required: false,
         placeholder: '该容器在1080px大屏中的高度',
-        value: 400,
+        value: 450,
       },
     ]
   }

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

@@ -31,142 +31,261 @@ export const widgetGauge = {
         placeholder: '',
         value: ''
       },
-      {
-        type: 'el-input-number',
-        label: '最大值',
-        name: 'maxValue',
-        require: false,
-        placeholder: '',
-        value: 100,
-      },
       [
         {
-          name: "圆环设置",
+          name: '标题设置',
           list: [
             {
               type: 'el-switch',
-              label: '显示',
-              name: 'ringShow',
+              label: '标题显示',
+              name: 'isShowTitle',
               required: false,
               placeholder: '',
               value: true,
             },
             {
-              type: 'el-input-number',
-              label: '圆环宽度',
-              name: 'pieWeight',
-              require: false,
+              type: 'el-input-text',
+              label: '标题名',
+              name: 'text',
+              required: false,
               placeholder: '',
-              value: 10,
+              value: '',
             },
-          ]
-        },
-        {
-          name: '0%~30%渐变色',
-          list: [
             {
               type: 'vue-color',
-              label: '0处颜色',
-              name: 'color30p0',
+              label: '字体颜色',
+              name: 'textColor',
               required: false,
               placeholder: '',
-              value: 'rgba(0, 237, 3,0.1)'
+              value: '#FFD700'
             },
             {
-              type: 'vue-color',
-              label: '0.5处颜色',
-              name: 'color30p5',
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'textFontSize',
               required: false,
               placeholder: '',
-              value: 'rgba(0, 237, 3,0.6)'
+              value: 20
             },
             {
-              type: 'vue-color',
-              label: '1处颜色',
-              name: 'color30p10',
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'textFontWeight',
               required: false,
               placeholder: '',
-              value: 'rgba(0, 237, 3,1)'
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
             },
-          ]
-        },
-        {
-          name: '30%~70%渐变色',
-          list: [
             {
-              type: 'vue-color',
-              label: '0处颜色',
-              name: 'color70p0',
+              type: 'el-select',
+              label: '字体风格',
+              name: 'textFontStyle',
               required: false,
               placeholder: '',
-              value: 'rgba(255, 184, 0,0.1)'
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
             },
             {
-              type: 'vue-color',
-              label: '0.5处颜色',
-              name: 'color70p5',
+              type: 'el-select',
+              label: '字体系列',
+              name: 'textFontFamily',
               required: false,
               placeholder: '',
-              value: 'rgba(255, 184, 0,0.6)'
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'el-input-text',
+              label: '副标题名',
+              name: 'subtext',
+              required: false,
+              placeholder: '',
+              value: ''
             },
             {
               type: 'vue-color',
-              label: '1处颜色',
-              name: 'color70p10',
+              label: '字体颜色',
+              name: 'subtextColor',
               required: false,
               placeholder: '',
-              value: 'rgba(255, 184, 0,1)'
+              value: 'rgba(30, 144, 255, 1)'
             },
-          ]
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'subtextFontSize',
+              required: false,
+              placeholder: '',
+              value: 20
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'subtextFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'subtextFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'subtextFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'el-select',
+              label: '左右位置',
+              name: 'titleLeft',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'center', name: '居中'},
+                {code: 'left', name: '左对齐'},
+                {code: 'right', name: '右对齐'},
+              ],
+              value: 'center'
+            },
+            {
+              type: 'el-slider',
+              label: '上下间距',
+              name: 'titleTop',
+              required: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-input-number',
+              label: '主副标题间距',
+              name: 'titleItemGap',
+              required: false,
+              placeholder: '',
+              value: 0
+            },
+          ],
         },
         {
-          name: '70%~100%渐变色',
+          name: "仪表盘设置",
           list: [
             {
-              type: 'vue-color',
-              label: '0处颜色',
-              name: 'color100p0',
+              type: 'el-switch',
+              label: '顺时针渲染',
+              name: 'clockwise',
               required: false,
               placeholder: '',
-              value: 'rgba(175, 36, 74,0.1)'
+              value: true,
             },
             {
-              type: 'vue-color',
-              label: '0.5处颜色',
-              name: 'color100p5',
+              type: 'el-input-number',
+              label: '起始角度',
+              name: 'startAngle',
               required: false,
               placeholder: '',
-              value: 'rgba(255, 36, 74,0.6)'
+              selectOptions: '',
+              value: 225
             },
             {
-              type: 'vue-color',
-              label: '1处颜色',
-              name: 'color100p10',
+              type: 'el-input-number',
+              label: '结束角度',
+              name: 'endAngle',
               required: false,
               placeholder: '',
-              value: 'rgba(255, 36, 74,1)'
+              selectOptions: '',
+              value: -45
+            },
+            {
+              type: 'el-input-number',
+              label: '最大值',
+              name: 'maxValue',
+              require: false,
+              placeholder: '',
+              value: 100,
             },
           ]
         },
         {
-          name: "刻度线",
+          name: "圆环设置",
           list: [
             {
               type: 'el-switch',
-              label: '显示',
+              label: '圆环显示',
+              name: 'ringShow',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-number',
+              label: '圆环宽度',
+              name: 'pieWeight',
+              require: false,
+              placeholder: '',
+              value: 10,
+            },
+            {
+              type: 'el-switch',
+              label: '刻度线显示',
               name: 'tickShow',
               required: false,
               placeholder: '',
               value: true,
             },
             {
+              type: 'el-input-number',
+              label: '刻度数',
+              name: 'tickSplitNumber',
+              required: false,
+              placeholder: '',
+              value: 5,
+            },
+            /*            {
               type: 'el-input-number',
               label: '距离',
               name: 'tickDistance',
               require: false,
               placeholder: '',
               value: 0,
-            },
+            },*/
             {
               type: 'el-input-number',
               label: '长度',
@@ -183,27 +302,35 @@ export const widgetGauge = {
               placeholder: '',
               value: 2,
             },
-          ]
-        },
-        {
-          name: "指标线",
-          list: [
+            {
+              type: 'el-select',
+              label: '刻度线类型',
+              name: 'tickType',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'solid', name: '实线'},
+                {code: 'dashed', name: '虚线'},
+                {code: 'dotted', name: '斑点'},
+              ],
+              value: 'solid'
+            },
             {
               type: 'el-switch',
-              label: '显示',
+              label: '指标线显示',
               name: 'splitShow',
               required: false,
               placeholder: '',
               value: true,
             },
-            {
+/*            {
               type: 'el-input-number',
               label: '距离',
               name: 'splitDistance',
               require: false,
               placeholder: '',
               value: 0,
-            },
+            },*/
             {
               type: 'el-input-number',
               label: '长度',
@@ -220,47 +347,60 @@ export const widgetGauge = {
               placeholder: '',
               value: 4,
             },
+            {
+              type: 'el-select',
+              label: '指标线类型',
+              name: 'splitType',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'solid', name: '实线'},
+                {code: 'dashed', name: '虚线'},
+                {code: 'dotted', name: '斑点'},
+              ],
+              value: 'solid'
+            },
           ]
         },
         {
-          name: "指标",
+          name: "数值设定",
           list: [
             {
               type: 'el-switch',
-              label: '显示',
-              name: 'labelShow',
+              label: '数值显示',
+              name: 'isShow',
               required: false,
               placeholder: '',
               value: true,
             },
+            {
+              type: 'el-switch',
+              label: '百分比显示',
+              name: 'percentage',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
             {
               type: 'el-input-number',
-              label: '距离',
-              name: 'labelDistance',
+              label: '数值字号',
+              name: 'detailFontSize',
               require: false,
               placeholder: '',
-              value: 0,
+              value: 24,
             },
             {
               type: 'vue-color',
-              label: '颜色',
-              name: 'labelColor',
+              label: '数值颜色',
+              name: 'detailColor',
               required: false,
               placeholder: '',
               value: '#fff',
             },
-            {
-              type: 'el-input-number',
-              label: '字号',
-              name: 'labelFontSize',
-              require: false,
-              placeholder: '',
-              value: 10,
-            },
             {
               type: 'el-select',
               label: '字体粗细',
-              name: 'labelFontWeight',
+              name: 'detailFontWeight',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -274,7 +414,7 @@ export const widgetGauge = {
             {
               type: 'el-select',
               label: '字体风格',
-              name: 'labelFontStyle',
+              name: 'detailFontStyle',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -284,31 +424,56 @@ export const widgetGauge = {
               ],
               value: 'normal'
             },
-          ]
-        },
-        {
-          name: "数值",
-          list: [
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'detailFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'el-switch',
+              label: '指标显示',
+              name: 'labelShow',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-number',
+              label: '距离',
+              name: 'labelDistance',
+              require: false,
+              placeholder: '',
+              value: 5,
+            },
             {
               type: 'vue-color',
-              label: '颜色',
-              name: 'detailColor',
+              label: '指标颜色',
+              name: 'labelColor',
               required: false,
               placeholder: '',
               value: '#fff',
             },
             {
               type: 'el-input-number',
-              label: '字号',
-              name: 'detailFontSize',
+              label: '指标字号',
+              name: 'labelFontSize',
               require: false,
               placeholder: '',
-              value: 14,
+              value: 10,
             },
             {
               type: 'el-select',
               label: '字体粗细',
-              name: 'detailFontWeight',
+              name: 'labelFontWeight',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -322,7 +487,7 @@ export const widgetGauge = {
             {
               type: 'el-select',
               label: '字体风格',
-              name: 'detailFontStyle',
+              name: 'labelFontStyle',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -332,6 +497,107 @@ export const widgetGauge = {
               ],
               value: 'normal'
             },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'labelFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+          ]
+        },
+        {
+          name: '0%~30%渐变色',
+          list: [
+            {
+              type: 'vue-color',
+              label: '0处颜色',
+              name: 'color30p0',
+              required: false,
+              placeholder: '',
+              value: 'rgba(0, 237, 3,0.1)'
+            },
+            {
+              type: 'vue-color',
+              label: '0.5处颜色',
+              name: 'color30p5',
+              required: false,
+              placeholder: '',
+              value: 'rgba(0, 237, 3,0.6)'
+            },
+            {
+              type: 'vue-color',
+              label: '1处颜色',
+              name: 'color30p10',
+              required: false,
+              placeholder: '',
+              value: 'rgba(0, 237, 3,1)'
+            },
+          ]
+        },
+        {
+          name: '30%~70%渐变色',
+          list: [
+            {
+              type: 'vue-color',
+              label: '0处颜色',
+              name: 'color70p0',
+              required: false,
+              placeholder: '',
+              value: 'rgba(255, 184, 0,0.1)'
+            },
+            {
+              type: 'vue-color',
+              label: '0.5处颜色',
+              name: 'color70p5',
+              required: false,
+              placeholder: '',
+              value: 'rgba(255, 184, 0,0.6)'
+            },
+            {
+              type: 'vue-color',
+              label: '1处颜色',
+              name: 'color70p10',
+              required: false,
+              placeholder: '',
+              value: 'rgba(255, 184, 0,1)'
+            },
+          ]
+        },
+        {
+          name: '70%~100%渐变色',
+          list: [
+            {
+              type: 'vue-color',
+              label: '0处颜色',
+              name: 'color100p0',
+              required: false,
+              placeholder: '',
+              value: 'rgba(175, 36, 74,0.1)'
+            },
+            {
+              type: 'vue-color',
+              label: '0.5处颜色',
+              name: 'color100p5',
+              required: false,
+              placeholder: '',
+              value: 'rgba(255, 36, 74,0.6)'
+            },
+            {
+              type: 'vue-color',
+              label: '1处颜色',
+              name: 'color100p10',
+              required: false,
+              placeholder: '',
+              value: 'rgba(255, 36, 74,1)'
+            },
           ]
         },
       ],
@@ -422,7 +688,7 @@ export const widgetGauge = {
         name: 'height',
         required: false,
         placeholder: '该容器在1080px大屏中的高度',
-        value: 200,
+        value: 300,
       },
     ],
   }

+ 58 - 4
report-ui/src/views/bigscreenDesigner/designer/tools/configure/percentCharts/widget-pie-percentage.js

@@ -53,7 +53,7 @@ export const widgetPiePercentage = {
             },
             {
               type: 'el-select',
-              label: '字体粗细',
+              label: '数值粗细',
               name: 'textNumFontWeight',
               required: false,
               placeholder: '',
@@ -65,6 +65,33 @@ export const widgetPiePercentage = {
               ],
               value: 'normal'
             },
+            {
+              type: 'el-select',
+              label: '数值风格',
+              name: 'textNumFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '数值字体',
+              name: 'textNumFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
             {
               type: 'vue-color',
               label: '%号颜色',
@@ -94,7 +121,34 @@ export const widgetPiePercentage = {
                 { code: 'lighter', name: '细体' }
               ],
               value: 'normal'
-            }
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'textPerFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'italic', name: 'italic斜体'},
+                {code: 'oblique', name: 'oblique斜体'},
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'textPerFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
           ],
         },
         {
@@ -106,7 +160,7 @@ export const widgetPiePercentage = {
               name: 'lineNumber',
               required: false,
               placeholder: '',
-              value: 8
+              value: 12
             },
             {
               type: 'el-input-number',
@@ -114,7 +168,7 @@ export const widgetPiePercentage = {
               name: 'lineLength',
               required: false,
               placeholder: '',
-              value: 19
+              value: 20
             },
             {
               type: 'el-input-number',

+ 542 - 55
report-ui/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-pie-nightingale.js

@@ -31,18 +31,6 @@ export const widgetPieNightingale = {
         placeholder: '',
         value: ''
       },
-      {
-        type: 'el-select',
-        label: '饼图模式',
-        name: 'nightingleRosetype',
-        required: false,
-        placeholder: '',
-        selectOptions: [
-          { code: 'area', name: '面积模式' },
-          { code: 'radius', name: '半径模式' },
-        ],
-        value: 'area'
-      },
       [
         {
           name: '标题设置',
@@ -50,7 +38,7 @@ export const widgetPieNightingale = {
             {
               type: 'el-switch',
               label: '标题显示',
-              name: 'isNoTitle',
+              name: 'isShowTitle',
               required: false,
               placeholder: '',
               value: true,
@@ -58,7 +46,7 @@ export const widgetPieNightingale = {
             {
               type: 'el-input-text',
               label: '标题名',
-              name: 'titleText',
+              name: 'text',
               required: false,
               placeholder: '',
               value: '',
@@ -108,21 +96,22 @@ export const widgetPieNightingale = {
             },
             {
               type: 'el-select',
-              label: '字体位置',
-              name: 'textAlign',
+              label: '字体系列',
+              name: 'textFontFamily',
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'center', name: '居中' },
-                { code: 'left', name: '左对齐' },
-                { code: 'right', name: '右对齐' },
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
               ],
-              value: 'center'
+              value: 'sans-serif'
             },
             {
               type: 'el-input-text',
               label: '副标题名',
-              name: 'subText',
+              name: 'subtext',
               required: false,
               placeholder: '',
               value: ''
@@ -130,7 +119,7 @@ export const widgetPieNightingale = {
             {
               type: 'vue-color',
               label: '字体颜色',
-              name: 'subTextColor',
+              name: 'subtextColor',
               required: false,
               placeholder: '',
               value: 'rgba(30, 144, 255, 1)'
@@ -138,7 +127,7 @@ export const widgetPieNightingale = {
             {
               type: 'el-input-number',
               label: '字体字号',
-              name: 'subTextFontSize',
+              name: 'subtextFontSize',
               required: false,
               placeholder: '',
               value: 20
@@ -146,7 +135,7 @@ export const widgetPieNightingale = {
             {
               type: 'el-select',
               label: '字体粗细',
-              name: 'subTextFontWeight',
+              name: 'subtextFontWeight',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -160,7 +149,7 @@ export const widgetPieNightingale = {
             {
               type: 'el-select',
               label: '字体风格',
-              name: 'subTextFontStyle',
+              name: 'subtextFontStyle',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -170,47 +159,154 @@ export const widgetPieNightingale = {
               ],
               value: 'normal'
             },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'subtextFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'el-select',
+              label: '左右位置',
+              name: 'titleLeft',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'center', name: '居中' },
+                { code: 'left', name: '左对齐' },
+                { code: 'right', name: '右对齐' },
+              ],
+              value: 'center'
+            },
+            {
+              type: 'el-slider',
+              label: '上下间距',
+              name: 'titleTop',
+              required: false,
+              placeholder: '',
+              value: 5,
+            },
+            {
+              type: 'el-input-number',
+              label: '主副标题间距',
+              name: 'titleItemGap',
+              required: false,
+              placeholder: '',
+              value: 0
+            },
           ],
         },
         {
-          name: '数值设定',
-          list: [
+          name: '饼图设置',
+          list : [
+            {
+              type: 'el-select',
+              label: '饼图模式',
+              name: 'nightingaleRoseType',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'area', name: '面积模式' },
+                { code: 'radius', name: '半径模式' },
+              ],
+              value: 'area'
+            },
+            {
+              type: 'el-slider',
+              label: '内半径',
+              name: 'innerNumber',
+              required: false,
+              placeholder: '',
+              value: 10,
+            },
+            {
+              type: 'el-slider',
+              label: '外半径',
+              name: 'outerNumber',
+              required: false,
+              placeholder: '',
+              value: 60,
+            },
             {
               type: 'el-switch',
-              label: '显示',
-              name: 'isShow',
+              label: '顺时针排布',
+              name: 'clockwise',
               required: false,
               placeholder: '',
               value: true,
             },
             {
-              type: 'el-switch',
-              label: '数值',
-              name: 'numberValue',
+              type: 'el-select',
+              label: '起始角度',
+              name: 'startAngle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 0, name: '0度' },
+                { code: 30, name: '30度' },
+                { code: 90, name: '90度' },
+                { code: 180, name: '180度' },
+                { code: 360, name: '360度' }
+              ],
+              value: 90
+            },
+            {
+              type: 'el-slider',
+              label: '最小角度',
+              name: 'minAngle',
               require: false,
               placeholder: '',
-              value: true,
+              value: 0,
             },
             {
-              type: 'el-switch',
-              label: '百分比',
-              name: 'percentage',
+              type: 'el-slider',
+              label: '不显示标签角度',
+              name: 'minShowLabelAngle',
               require: false,
               placeholder: '',
-              value: false,
+              value: 0,
+            },
+/*            {
+              type: 'el-slider',
+              label: '圆角属性',
+              name: 'borderRadius',
+              required: false,
+              placeholder: '',
+              value: 10,
+            },*/
+          ]
+        },
+        {
+          name: '扇区设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '文字高亮',
+              name: 'isShowEmphasisLabel',
+              required: false,
+              placeholder: '',
+              value: true,
             },
             {
               type: 'el-input-number',
               label: '字体字号',
-              name: 'fontSize',
+              name: 'emphasisLabelFontSize',
               required: false,
               placeholder: '',
-              value: 14,
+              value: 24,
             },
             {
               type: 'vue-color',
               label: '字体颜色',
-              name: 'dataColor',
+              name: 'emphasisLabelFontColor',
               required: false,
               placeholder: '',
               value: ''
@@ -218,7 +314,7 @@ export const widgetPieNightingale = {
             {
               type: 'el-select',
               label: '字体粗细',
-              name: 'fontWeight',
+              name: 'emphasisLabelFontWeight',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -227,28 +323,79 @@ export const widgetPieNightingale = {
                 { code: 'bolder', name: '特粗体' },
                 { code: 'lighter', name: '细体' }
               ],
+              value: 'bold'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'emphasisLabelFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
               value: 'normal'
             },
-          ],
-        },
-        {
-          name: '提示语设置',
-          list: [
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'emphasisLabelFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'vue-color',
+              label: '描边颜色',
+              name: 'borderColor',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
             {
               type: 'el-input-number',
-              label: '字体字号',
-              name: 'tipsFontSize',
+              label: '描边宽度',
+              name: 'borderWidth',
               required: false,
               placeholder: '',
-              value: 16
+              value: 1
+            },
+            {
+              type: 'el-select',
+              label: '描边类型',
+              name: 'borderType',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'solid', name: '实线' },
+                { code: 'dashed', name: '虚线' },
+                { code: 'dotted', name: '斑点' },
+              ],
+              value: 'solid'
+            },
+            {
+              type: 'el-input-number',
+              label: '阴影系数',
+              name: 'shadowBlur',
+              required: false,
+              placeholder: '',
+              value: 10
             },
             {
               type: 'vue-color',
-              label: '字体颜色',
-              name: 'tipsColor',
+              label: '阴影颜色',
+              name: 'shadowColor',
               required: false,
               placeholder: '',
-              value: '#00FEFF'
+              value: 'rgba(0, 0, 0, 0.5)'
             },
           ],
         },
@@ -257,7 +404,7 @@ export const widgetPieNightingale = {
           list: [
             {
               type: 'el-switch',
-              label: '图例',
+              label: '图例显示',
               name: 'isShowLegend',
               required: false,
               placeholder: '',
@@ -279,13 +426,62 @@ export const widgetPieNightingale = {
               placeholder: '',
               value: 12,
             },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'legendFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'legendFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'legendFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
             {
               type: 'el-input-number',
               label: '图例宽度',
               name: 'legendWidth',
               required: false,
               placeholder: '',
-              value: 15,
+              value: 12,
+            },
+            {
+              type: 'el-input-number',
+              label: '图例高度',
+              name: 'legendHeight',
+              required: false,
+              placeholder: '',
+              value: 12,
             },
             {
               type: 'el-select',
@@ -326,6 +522,297 @@ export const widgetPieNightingale = {
             },
           ],
         },
+        {
+          name: '数值设定',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShow',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '数值显示',
+              name: 'numberValue',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '百分比显示',
+              name: 'percentage',
+              require: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'el-input-number',
+              label: '小数点位数',
+              name: 'percentPrecision',
+              required: false,
+              placeholder: '',
+              value: 2,
+            },
+            {
+              type: 'el-select',
+              label: '位置',
+              name: 'position',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'outside', name: '扇区外侧' },
+                { code: 'inside', name: '扇区内侧' },
+                { code: 'center', name: '扇区中心' }
+              ],
+              value: 'outside'
+            },
+            {
+              type: 'el-input-number',
+              label: '边距',
+              name: 'padding',
+              require: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-input-number',
+              label: '角度',
+              name: 'rotate',
+              require: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'fontSize',
+              required: false,
+              placeholder: '',
+              value: 12,
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'fontColor',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'fontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'fontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'fontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'el-switch',
+              label: '引导线显示',
+              name: 'isShowLabelLine',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '平滑引导线',
+              name: 'labelLineSmooth',
+              required: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'el-input-number',
+              label: '第一段长度',
+              name: 'labelLineLength',
+              required: false,
+              placeholder: '',
+              value: 5,
+            },
+            {
+              type: 'el-input-number',
+              label: '第二段长度',
+              name: 'labelLineLength2',
+              required: false,
+              placeholder: '',
+              value: 15,
+            },
+            {
+              type: 'vue-color',
+              label: '线条颜色',
+              name: 'lineStyleColor',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'el-input-number',
+              label: '线条宽度',
+              name: 'lineStyleWidth',
+              required: false,
+              placeholder: '',
+              value: 1
+            },
+            {
+              type: 'el-select',
+              label: '线条类型',
+              name: 'lineStyleType',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'solid', name: '实线' },
+                { code: 'dashed', name: '虚线' },
+                { code: 'dotted', name: '斑点' },
+              ],
+              value: 'solid'
+            },
+          ],
+        },
+        {
+          name: '提示语设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShowTooltip',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'tipsFontSize',
+              required: false,
+              placeholder: '',
+              value: 16
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'tipsColor',
+              required: false,
+              placeholder: '',
+              value: '#00FEFF'
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'tipsFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'tipsFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'tipsFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+          ],
+        },
+        {
+          name: '边距设置',
+          list: [
+            {
+              type: 'el-slider',
+              label: '左边距(像素)',
+              name: 'left',
+              required: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-slider',
+              label: '右边距(像素)',
+              name: 'right',
+              required: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-slider',
+              label: '顶边距(像素)',
+              name: 'top',
+              required: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-slider',
+              label: '底边距(像素)',
+              name: 'bottom',
+              required: false,
+              placeholder: '',
+              value: 0,
+            },
+          ],
+        },
         {
           name: '自定义配色',
           list: [
@@ -436,7 +923,7 @@ export const widgetPieNightingale = {
         name: 'height',
         required: false,
         placeholder: '该容器在1080px大屏中的高度',
-        value: 200,
+        value: 300,
       },
     ],
   }

+ 530 - 55
report-ui/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-piechart.js

@@ -31,18 +31,6 @@ export const widgetPiechart = {
         placeholder: '',
         value: ''
       },
-      {
-        type: 'el-select',
-        label: '饼图样式',
-        name: 'piechartStyle',
-        required: false,
-        placeholder: '',
-        selectOptions: [
-          { code: 'shixin', name: '实心饼图' },
-          { code: 'kongxin', name: '空心饼图' },
-        ],
-        value: 'shixin'
-      },
       [
         {
           name: '标题设置',
@@ -50,7 +38,7 @@ export const widgetPiechart = {
             {
               type: 'el-switch',
               label: '标题显示',
-              name: 'isNoTitle',
+              name: 'isShowTitle',
               required: false,
               placeholder: '',
               value: true,
@@ -58,7 +46,7 @@ export const widgetPiechart = {
             {
               type: 'el-input-text',
               label: '标题名',
-              name: 'titleText',
+              name: 'text',
               required: false,
               placeholder: '',
               value: '',
@@ -108,21 +96,22 @@ export const widgetPiechart = {
             },
             {
               type: 'el-select',
-              label: '字体位置',
-              name: 'textAlign',
+              label: '字体系列',
+              name: 'textFontFamily',
               required: false,
               placeholder: '',
               selectOptions: [
-                { code: 'center', name: '居中' },
-                { code: 'left', name: '左对齐' },
-                { code: 'right', name: '右对齐' },
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
               ],
-              value: 'center'
+              value: 'sans-serif'
             },
             {
               type: 'el-input-text',
               label: '副标题名',
-              name: 'subText',
+              name: 'subtext',
               required: false,
               placeholder: '',
               value: ''
@@ -130,7 +119,7 @@ export const widgetPiechart = {
             {
               type: 'vue-color',
               label: '字体颜色',
-              name: 'subTextColor',
+              name: 'subtextColor',
               required: false,
               placeholder: '',
               value: 'rgba(30, 144, 255, 1)'
@@ -138,7 +127,7 @@ export const widgetPiechart = {
             {
               type: 'el-input-number',
               label: '字体字号',
-              name: 'subTextFontSize',
+              name: 'subtextFontSize',
               required: false,
               placeholder: '',
               value: 20
@@ -146,7 +135,7 @@ export const widgetPiechart = {
             {
               type: 'el-select',
               label: '字体粗细',
-              name: 'subTextFontWeight',
+              name: 'subtextFontWeight',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -160,7 +149,7 @@ export const widgetPiechart = {
             {
               type: 'el-select',
               label: '字体风格',
-              name: 'subTextFontStyle',
+              name: 'subtextFontStyle',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -170,47 +159,142 @@ export const widgetPiechart = {
               ],
               value: 'normal'
             },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'subtextFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'el-select',
+              label: '左右位置',
+              name: 'titleLeft',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'center', name: '居中' },
+                { code: 'left', name: '左对齐' },
+                { code: 'right', name: '右对齐' },
+              ],
+              value: 'center'
+            },
+            {
+              type: 'el-slider',
+              label: '上下间距',
+              name: 'titleTop',
+              required: false,
+              placeholder: '',
+              value: 5,
+            },
+            {
+              type: 'el-input-number',
+              label: '主副标题间距',
+              name: 'titleItemGap',
+              required: false,
+              placeholder: '',
+              value: 0
+            },
           ],
         },
         {
-          name: '数值设定',
-          list: [
+          name: '饼图设置',
+          list : [
+            {
+              type: 'el-slider',
+              label: '内半径',
+              name: 'innerNumber',
+              required: false,
+              placeholder: '',
+              value: 30,
+            },
+            {
+              type: 'el-slider',
+              label: '外半径',
+              name: 'outerNumber',
+              required: false,
+              placeholder: '',
+              value: 60,
+            },
             {
               type: 'el-switch',
-              label: '显示',
-              name: 'isShow',
+              label: '顺时针排布',
+              name: 'clockwise',
               required: false,
               placeholder: '',
               value: true,
             },
             {
-              type: 'el-switch',
-              label: '数值',
-              name: 'numberValue',
+              type: 'el-select',
+              label: '起始角度',
+              name: 'startAngle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 0, name: '0度' },
+                { code: 30, name: '30度' },
+                { code: 90, name: '90度' },
+                { code: 180, name: '180度' },
+                { code: 360, name: '360度' }
+              ],
+              value: 90
+            },
+            {
+              type: 'el-slider',
+              label: '最小角度',
+              name: 'minAngle',
               require: false,
               placeholder: '',
-              value: true,
+              value: 0,
             },
             {
-              type: 'el-switch',
-              label: '百分比',
-              name: 'percentage',
+              type: 'el-slider',
+              label: '不显示标签角度',
+              name: 'minShowLabelAngle',
               require: false,
               placeholder: '',
-              value: false,
+              value: 0,
+            },
+/*            {
+              type: 'el-slider',
+              label: '圆角属性',
+              name: 'borderRadius',
+              required: false,
+              placeholder: '',
+              value: 10,
+            },*/
+          ]
+        },
+        {
+          name: '扇区设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '文字高亮',
+              name: 'isShowEmphasisLabel',
+              required: false,
+              placeholder: '',
+              value: true,
             },
             {
               type: 'el-input-number',
               label: '字体字号',
-              name: 'fontSize',
+              name: 'emphasisLabelFontSize',
               required: false,
               placeholder: '',
-              value: 12,
+              value: 24,
             },
             {
               type: 'vue-color',
               label: '字体颜色',
-              name: 'dataColor',
+              name: 'emphasisLabelFontColor',
               required: false,
               placeholder: '',
               value: ''
@@ -218,7 +302,7 @@ export const widgetPiechart = {
             {
               type: 'el-select',
               label: '字体粗细',
-              name: 'fontWeight',
+              name: 'emphasisLabelFontWeight',
               required: false,
               placeholder: '',
               selectOptions: [
@@ -227,28 +311,79 @@ export const widgetPiechart = {
                 { code: 'bolder', name: '特粗体' },
                 { code: 'lighter', name: '细体' }
               ],
+              value: 'bold'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'emphasisLabelFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
               value: 'normal'
             },
-          ],
-        },
-        {
-          name: '提示语设置',
-          list: [
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'emphasisLabelFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'vue-color',
+              label: '描边颜色',
+              name: 'borderColor',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
             {
               type: 'el-input-number',
-              label: '字体字号',
-              name: 'tipsFontSize',
+              label: '描边宽度',
+              name: 'borderWidth',
               required: false,
               placeholder: '',
-              value: 16
+              value: 1
+            },
+            {
+              type: 'el-select',
+              label: '描边类型',
+              name: 'borderType',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'solid', name: '实线' },
+                { code: 'dashed', name: '虚线' },
+                { code: 'dotted', name: '斑点' },
+              ],
+              value: 'solid'
+            },
+            {
+              type: 'el-input-number',
+              label: '阴影系数',
+              name: 'shadowBlur',
+              required: false,
+              placeholder: '',
+              value: 10
             },
             {
               type: 'vue-color',
-              label: '字体颜色',
-              name: 'tipsColor',
+              label: '阴影颜色',
+              name: 'shadowColor',
               required: false,
               placeholder: '',
-              value: '#00FEFF'
+              value: 'rgba(0, 0, 0, 0.5)'
             },
           ],
         },
@@ -257,7 +392,7 @@ export const widgetPiechart = {
           list: [
             {
               type: 'el-switch',
-              label: '图例',
+              label: '图例显示',
               name: 'isShowLegend',
               required: false,
               placeholder: '',
@@ -279,13 +414,62 @@ export const widgetPiechart = {
               placeholder: '',
               value: 12,
             },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'legendFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'legendFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'legendFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
             {
               type: 'el-input-number',
               label: '图例宽度',
               name: 'legendWidth',
               required: false,
               placeholder: '',
-              value: 15,
+              value: 12,
+            },
+            {
+              type: 'el-input-number',
+              label: '图例高度',
+              name: 'legendHeight',
+              required: false,
+              placeholder: '',
+              value: 12,
             },
             {
               type: 'el-select',
@@ -326,6 +510,297 @@ export const widgetPiechart = {
             },
           ],
         },
+        {
+          name: '数值设定',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShow',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '数值显示',
+              name: 'numberValue',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '百分比显示',
+              name: 'percentage',
+              require: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'el-input-number',
+              label: '小数点位数',
+              name: 'percentPrecision',
+              required: false,
+              placeholder: '',
+              value: 2,
+            },
+            {
+              type: 'el-select',
+              label: '位置',
+              name: 'position',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'outside', name: '扇区外侧' },
+                { code: 'inside', name: '扇区内侧' },
+                { code: 'center', name: '扇区中心' }
+              ],
+              value: 'outside'
+            },
+            {
+              type: 'el-input-number',
+              label: '边距',
+              name: 'padding',
+              require: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-input-number',
+              label: '角度',
+              name: 'rotate',
+              require: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'fontSize',
+              required: false,
+              placeholder: '',
+              value: 12,
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'fontColor',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'fontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'fontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'fontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+            {
+              type: 'el-switch',
+              label: '引导线显示',
+              name: 'isShowLabelLine',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '平滑引导线',
+              name: 'labelLineSmooth',
+              required: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'el-input-number',
+              label: '第一段长度',
+              name: 'labelLineLength',
+              required: false,
+              placeholder: '',
+              value: 5,
+            },
+            {
+              type: 'el-input-number',
+              label: '第二段长度',
+              name: 'labelLineLength2',
+              required: false,
+              placeholder: '',
+              value: 15,
+            },
+            {
+              type: 'vue-color',
+              label: '线条颜色',
+              name: 'lineStyleColor',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'el-input-number',
+              label: '线条宽度',
+              name: 'lineStyleWidth',
+              required: false,
+              placeholder: '',
+              value: 1
+            },
+            {
+              type: 'el-select',
+              label: '线条类型',
+              name: 'lineStyleType',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'solid', name: '实线' },
+                { code: 'dashed', name: '虚线' },
+                { code: 'dotted', name: '斑点' },
+              ],
+              value: 'solid'
+            },
+          ],
+        },
+        {
+          name: '提示语设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShowTooltip',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'tooltipFontSize',
+              required: false,
+              placeholder: '',
+              value: 16
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'tooltipColor',
+              required: false,
+              placeholder: '',
+              value: '#00FEFF'
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'tooltipFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'tooltipFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'tooltipFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'sans-serif', name: 'sans-serif'},
+                {code: 'serif', name: 'serif'},
+                {code: 'Arial', name: 'Arial'},
+                {code: 'Courier New', name: 'Courier New'},
+              ],
+              value: 'sans-serif'
+            },
+          ],
+        },
+        {
+          name: '边距设置',
+          list: [
+            {
+              type: 'el-slider',
+              label: '左边距(像素)',
+              name: 'left',
+              required: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-slider',
+              label: '右边距(像素)',
+              name: 'right',
+              required: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-slider',
+              label: '顶边距(像素)',
+              name: 'top',
+              required: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-slider',
+              label: '底边距(像素)',
+              name: 'bottom',
+              required: false,
+              placeholder: '',
+              value: 0,
+            },
+          ],
+        },
         {
           name: '自定义配色',
           list: [
@@ -436,7 +911,7 @@ export const widgetPiechart = {
         name: 'height',
         required: false,
         placeholder: '该容器在1080px大屏中的高度',
-        value: 200,
+        value: 300,
       },
     ],
   }

+ 165 - 14
report-ui/src/views/bigscreenDesigner/designer/tools/configure/radarCharts/widget-radar.js

@@ -294,14 +294,6 @@ export const widgetRadar = {
               placeholder: '',
               value: true,
             },
-            {
-              type: 'el-input-text',
-              label: '名称( | 分隔)',
-              name: 'legendName',
-              required: false,
-              placeholder: '多值以' | '隔开',
-              value: ''
-            },
             {
               type: 'vue-color',
               label: '字体颜色',
@@ -318,6 +310,47 @@ export const widgetRadar = {
               placeholder: '',
               value: 12,
             },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'legendFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'legendFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'legendFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'Microsoft YaHei', name: '微软雅黑' },
+                { code: 'serif', name: 'serif字体' },
+                { code: 'Arial', name: 'Arial字体' },
+                { code: 'Courier New', name: 'Courier New字体' },
+              ],
+              value: 'Microsoft YaHei'
+            },
             {
               type: 'el-input-number',
               label: '图例宽度',
@@ -326,6 +359,14 @@ export const widgetRadar = {
               placeholder: '',
               value: 12,
             },
+            {
+              type: 'el-input-number',
+              label: '图例高度',
+              name: 'legendHeight',
+              required: false,
+              placeholder: '',
+              value: 12,
+            },
             {
               type: 'el-select',
               label: '横向位置',
@@ -376,6 +417,32 @@ export const widgetRadar = {
               placeholder: '',
               value: false
             },
+            {
+              type: 'el-select',
+              label: '位置',
+              name: 'fontPosition',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'top', name: '上' },
+                { code: 'left', name: '左' },
+                { code: 'right', name: '右' },
+                { code: 'inside', name: '里' },
+                { code: 'insideTop', name: '里顶' },
+                { code: 'insideLeft', name: '里左' },
+                { code: 'insideRight', name: '里右' },
+                { code: 'insideBottom', name: '里底' },
+              ],
+              value: 'insideTop'
+            },
+            {
+              type: 'el-input-number',
+              label: '距离',
+              name: 'fontDistance',
+              required: false,
+              placeholder: '',
+              value: 0
+            },
             {
               type: 'el-input-number',
               label: '字体字号',
@@ -387,10 +454,10 @@ export const widgetRadar = {
             {
               type: 'vue-color',
               label: '字体颜色',
-              name: 'dataColor',
+              name: 'fontColor',
               required: false,
               placeholder: '',
-              value: '#fff'
+              value: ''
             },
             {
               type: 'el-select',
@@ -406,6 +473,33 @@ export const widgetRadar = {
               ],
               value: 'normal'
             },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'fontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'fontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'Microsoft YaHei', name: '微软雅黑' },
+                { code: 'serif', name: 'serif字体' },
+                { code: 'Arial', name: 'Arial字体' },
+                { code: 'Courier New', name: 'Courier New字体' },
+              ],
+              value: 'Microsoft YaHei'
+            },
             {
               type: 'el-input-number',
               label: '点大小',
@@ -414,6 +508,14 @@ export const widgetRadar = {
               placeholder: '',
               value: 5
             },
+            {
+              type: 'el-input-number',
+              label: '线条宽度',
+              name: 'lineWidth',
+              required: false,
+              placeholder: '',
+              value: 1,
+            },
             {
               type: 'el-select',
               label: '线型效果',
@@ -422,8 +524,8 @@ export const widgetRadar = {
               placeholder: '',
               selectOptions: [
                 { code: 'solid', name: '实线' },
-                { code: 'dashed', name: '线型虚线' },
-                { code: 'dotted', name: '点型虚线' },
+                { code: 'dashed', name: '虚线' },
+                { code: 'dotted', name: '点' },
               ],
               value: 'solid'
             },
@@ -440,10 +542,18 @@ export const widgetRadar = {
         {
           name: '提示语设置',
           list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShowTooltip',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
             {
               type: 'el-input-number',
               label: '字体字号',
-              name: 'tipsFontSize',
+              name: 'tooltipFontSize',
               required: false,
               placeholder: '',
               value: 16
@@ -451,11 +561,52 @@ export const widgetRadar = {
             {
               type: 'vue-color',
               label: '字体颜色',
-              name: 'tipsColor',
+              name: 'tooltipColor',
               required: false,
               placeholder: '',
               value: '#00FEFF'
             },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'tooltipFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'tooltipFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体系列',
+              name: 'tooltipFontFamily',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'Microsoft YaHei', name: '微软雅黑' },
+                { code: 'serif', name: 'serif字体' },
+                { code: 'Arial', name: 'Arial字体' },
+                { code: 'Courier New', name: 'Courier New字体' },
+              ],
+              value: 'Microsoft YaHei'
+            },
           ],
         },
         {

+ 122 - 74
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarCompareChart.vue

@@ -308,22 +308,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -332,35 +337,45 @@ export default {
       const optionsSetup = this.optionsSetup;
       const xAxisLeft = {
         max: optionsSetup.maxXLeft !== "" ? optionsSetup.maxXLeft : null,
-        splitNumber: optionsSetup.splitNumberLeft,
+        splitNumber: optionsSetup.splitNumberXLeft,
         type: "value",
-        show: optionsSetup.hideXLeft,
+        show: optionsSetup.isShowXLeft,
         inverse: true,
+        position: optionsSetup.positionXLeft,
+        axisLabel: {
+          // x轴
+          show: optionsSetup.isShowAxisLabelXLeft,
+          //interval: optionsSetup.textIntervalXLeft,
+          textStyle: {
+            color: optionsSetup.textColorXLeft,
+            fontSize: optionsSetup.textFontSizeXLeft,
+            fontWeight: optionsSetup.textFontWeightXLeft,
+            fontStyle: optionsSetup.textFontStyleXLeft,
+            fontFamily: optionsSetup.textFontFamilyXLeft,
+          },
+        },
         //X轴线
         axisLine: {
-          show: optionsSetup.lineXLeft,
+          show: optionsSetup.isShowAxisLineXLeft,
           lineStyle: {
             color: optionsSetup.lineColorXLeft,
+            width: optionsSetup.lineWidthXLeft,
           },
         },
+        // X轴刻度线
         axisTick: {
-          show: optionsSetup.tickLineLeft,
-        },
-        position: optionsSetup.positionXLeft,
-        axisLabel: {
-          // x轴
-          show: true,
-          textStyle: {
-            color: optionsSetup.colorXLeft,
-            fontSize: optionsSetup.fontSizeXLeft,
+          show: optionsSetup.isShowAxisLineXLeft,
+          lineStyle: {
+            color: optionsSetup.lineColorXLeft,
+            width: optionsSetup.lineWidthXLeft,
           },
         },
         splitLine: {
           // 分割线
-          show: optionsSetup.isShowSplitLineLeft,
+          show: optionsSetup.isShowSplitLineXLeft,
           lineStyle: {
-            color: optionsSetup.splitLineColorLeft,
-            width: optionsSetup.splitLineFontWidthLeft,
+            color: optionsSetup.splitLineColorXLeft,
+            width: optionsSetup.splitLineWidthXLeft,
             type: "solid",
           },
         },
@@ -374,33 +389,41 @@ export default {
         max: optionsSetup.maxXRight !== "" ? optionsSetup.maxXRight : null,
         gridIndex: 2,
         splitNumber: optionsSetup.splitNumberRight,
-        show: optionsSetup.hideXRight,
+        show: optionsSetup.isShowXRight,
         type: "value",
+        position: optionsSetup.positionXRight,
+        axisLabel: {
+          // x轴
+          show: optionsSetup.isShowAxisLabelXRight,
+          textStyle: {
+            color: optionsSetup.textColorXRight,
+            fontSize: optionsSetup.textFontSizeXRight,
+            fontWeight: optionsSetup.textFontWeightXRight,
+            fontStyle: optionsSetup.textFontStyleXRight,
+            fontFamily: optionsSetup.textFontFamilyXRight,
+          },
+        },
         axisLine: {
           //X轴线
-          show: optionsSetup.lineXRight,
+          show: optionsSetup.isShowAxisLineXLeft,
           lineStyle: {
             color: optionsSetup.lineColorXRight,
+            width: optionsSetup.lineWidthXRight,
           },
         },
         axisTick: {
-          show: optionsSetup.tickLineRight,
-        },
-        position: optionsSetup.positionXRight,
-        axisLabel: {
-          // x轴
-          show: true,
-          textStyle: {
-            color: optionsSetup.colorXRight,
-            fontSize: optionsSetup.fontSizeXRight,
+          show: optionsSetup.isShowAxisLineXLeft,
+          lineStyle: {
+            color: optionsSetup.lineColorXRight,
+            width: optionsSetup.lineWidthXRight,
           },
         },
         splitLine: {
           // 分割线
-          show: optionsSetup.isShowSplitLineRight,
+          show: optionsSetup.isShowSplitLineXRight,
           lineStyle: {
-            color: optionsSetup.splitLineColorRight,
-            width: optionsSetup.splitLineFontWidthRight,
+            color: optionsSetup.splitLineColorXRight,
+            width: optionsSetup.splitLineWidthXRight,
             type: "solid",
           },
         },
@@ -410,26 +433,41 @@ export default {
     // Y轴设置
     setOptionsY() {
       const optionsSetup = this.optionsSetup;
-      const axisLine = {
-        show: optionsSetup.lineY,
-        lineStyle: {
-          color: optionsSetup.lineColorY,
+      const yAxis = {
+        //处理轴数据
+        gridIndex: 1,
+        type: "category",
+        inverse: true,
+        position: "left",
+        show: optionsSetup.isShowY,
+        axisLabel: {
+          show: optionsSetup.isShowAxisLabelY,
+          interval: optionsSetup.textIntervalY,
+          textStyle: {
+            align: "center",
+            color: optionsSetup.textColorY,
+            fontSize: optionsSetup.textFontSizeY,
+            fontWeight: optionsSetup.textFontWeightY,
+            fontStyle: optionsSetup.textFontStyleY,
+            fontFamily: optionsSetup.textFontFamilyY,
+          },
         },
-      };
-      const axisTick = {
-        show: optionsSetup.tickLineY,
-      };
-      const axisLabel = {
-        show: optionsSetup.hideY,
-        textStyle: {
-          align: optionsSetup.textAlignY,
-          color: optionsSetup.colorY,
-          fontSize: optionsSetup.fontSizeY,
+        axisLine: {
+          show: optionsSetup.isShowAxisLineY,
+          lineStyle: {
+            color: optionsSetup.lineColorY,
+            width: optionsSetup.lineWidthY,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.isShowAxisLineY,
+          lineStyle: {
+            color: optionsSetup.lineColorY,
+            width: optionsSetup.lineWidthY,
+          },
         },
       };
-      this.options.yAxis[1]["axisLine"] = axisLine;
-      this.options.yAxis[1]["axisTick"] = axisTick;
-      this.options.yAxis[1]["axisLabel"] = axisLabel;
+      this.options.yAxis[1] = yAxis;
     },
     // 数值设定、柱体设置
     setOptionsTop() {
@@ -490,8 +528,11 @@ export default {
           type: optionsSetup.tooltipAxisPointerType,
         },
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -536,17 +577,24 @@ export default {
     // 图例操作
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例名称设置
     setOptionsLegendName(name) {

+ 130 - 62
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarDoubleYaxisChart.vue

@@ -151,22 +151,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -176,28 +181,44 @@ export default {
       const xAxis = {
         type: "category",
         // 坐标轴是否显示
-        show: optionsSetup.hideX,
+        show: optionsSetup.isShowX,
+        position: optionsSetup.positionX,
+        offset: optionsSetup.offsetX,
         // 坐标轴名称
         name: optionsSetup.nameX,
+        nameLocation: optionsSetup.nameLocationX,
         nameTextStyle: {
           color: optionsSetup.nameColorX,
           fontSize: optionsSetup.nameFontSizeX,
+          fontWeight: optionsSetup.nameFontWeightX,
+          fontStyle: optionsSetup.nameFontStyleX,
+          fontFamily: optionsSetup.nameFontFamilyX,
         },
         // 轴反转
         inverse: optionsSetup.reversalX,
         axisLabel: {
-          show: true,
-          interval: optionsSetup.textInterval,
+          show: optionsSetup.isShowAxisLabelX,
+          interval: optionsSetup.textIntervalX,
           // 文字角度
           rotate: optionsSetup.textAngleX,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorX,
-            fontSize: optionsSetup.fontSizeX,
+            color: optionsSetup.textColorX,
+            fontSize: optionsSetup.textFontSizeX,
+            fontWeight: optionsSetup.textFontWeightX,
+            fontStyle: optionsSetup.textFontStyleX,
+            fontFamily: optionsSetup.textFontFamilyX,
           },
         },
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
             width: optionsSetup.lineWidthX,
@@ -220,33 +241,47 @@ export default {
         {
           max: optionsSetup.maxYLeft !== "" ? optionsSetup.maxYLeft : null,
           type: "value",
+          scale: optionsSetup.scaleYLeft,
           // 均分
-          splitNumber: optionsSetup.splitNumberLeft,
+          splitNumber: optionsSetup.splitNumberYLeft,
           // 坐标轴是否显示
           show: optionsSetup.isShowYLeft,
+          position: optionsSetup.positionYLeft,
+          offset: optionsSetup.offsetYLeft,
           // 坐标轴名称
           name: optionsSetup.textNameYLeft,
+          nameLocation: optionsSetup.nameLocationYLeft,
           // 别名
           nameTextStyle: {
             color: optionsSetup.nameColorYLeft,
             fontSize: optionsSetup.nameFontSizeYLeft,
+            fontWeight: optionsSetup.nameFontWeightYLeft,
+            fontStyle: optionsSetup.nameFontStyleYLeft,
+            fontFamily: optionsSetup.nameFontFamilyYLeft,
           },
           axisLabel: {
-            show: true,
+            show: optionsSetup.isShowAxisLabelYLeft,
             // 文字角度
             rotate: optionsSetup.textAngleYLeft,
             textStyle: {
               // 坐标文字颜色
-              color: optionsSetup.colorYLeft,
-              fontSize: optionsSetup.fontSizeYLeft,
+              color: optionsSetup.textColorYLeft,
+              fontSize: optionsSetup.textFontSizeYLeft,
+              fontWeight: optionsSetup.textFontWeightYLeft,
+              fontStyle: optionsSetup.textFontStyleYLeft,
+              fontFamily: optionsSetup.textFontFamilyYLeft,
+            },
+          },
+          axisLine: {
+            show: optionsSetup.isShowAxisLineYLeft,
+            lineStyle: {
+              width: optionsSetup.lineWidthYLeft,
+              color: optionsSetup.lineColorYLeft,
             },
           },
           axisTick: {
             // 刻度
-            show: optionsSetup.tickLineYLeft,
-          },
-          axisLine: {
-            show: optionsSetup.lineYLeft,
+            show: optionsSetup.isShowAxisLineYLeft,
             lineStyle: {
               width: optionsSetup.lineWidthYLeft,
               color: optionsSetup.lineColorYLeft,
@@ -263,38 +298,52 @@ export default {
         {
           max: optionsSetup.maxYRight !== "" ? optionsSetup.maxYRight : null,
           type: "value",
+          scale: optionsSetup.scaleYRight,
           // 均分
-          splitNumber: optionsSetup.splitNumberRight,
+          splitNumber: optionsSetup.splitNumberYRight,
           // 坐标轴是否显示
           show: optionsSetup.isShowYRight,
+          position: optionsSetup.positionYRight,
+          offset: optionsSetup.offsetYRight,
           // 坐标轴名称
           name: optionsSetup.textNameYRight,
+          nameLocation: optionsSetup.nameLocationYRight,
           // 别名
           nameTextStyle: {
             color: optionsSetup.nameColorYRight,
             fontSize: optionsSetup.nameFontSizeYRight,
+            fontWeight: optionsSetup.nameFontWeightYRight,
+            fontStyle: optionsSetup.nameFontStyleYRight,
+            fontFamily: optionsSetup.nameFontFamilyYRight,
           },
           axisLabel: {
-            show: true,
+            show: optionsSetup.isShowAxisLabelYRight,
             // 文字角度
             rotate: optionsSetup.textAngleYRight,
             textStyle: {
               // 坐标文字颜色
-              color: optionsSetup.colorYRight,
-              fontSize: optionsSetup.fontSizeYRight,
+              color: optionsSetup.textColorYRight,
+              fontSize: optionsSetup.textFontSizeYRight,
+              fontWeight: optionsSetup.textFontWeightYRight,
+              fontStyle: optionsSetup.textFontStyleYRight,
+              fontFamily: optionsSetup.textFontFamilyYRight,
             },
           },
-          axisTick: {
-            // 刻度
-            show: optionsSetup.tickLineYRight,
-          },
           axisLine: {
-            show: optionsSetup.lineYRight,
+            show: optionsSetup.isShowAxisLineYRight,
             lineStyle: {
               width: optionsSetup.lineWidthYRight,
               color: optionsSetup.lineColorYRight,
             },
           },
+          axisTick: {
+            // 刻度
+            show: optionsSetup.isShowAxisLineYRight,
+            lineStyle: {
+              width: optionsSetup.lineWidthYRight,
+              color: optionsSetup.lineColorYRight,
+            }
+          },
           splitLine: {
             show: optionsSetup.isShowSplitLineYRight,
             lineStyle: {
@@ -318,8 +367,11 @@ export default {
             position: optionsSetup.fontPosition,
             distance: optionsSetup.fontDistance,
             fontSize: optionsSetup.fontSize,
-            color: optionsSetup.dataColor,
+            color: optionsSetup.fontColor,
             fontWeight: optionsSetup.fontWeight,
+            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyle,
+            fontFamily: optionsSetup.fontFamily,
           };
           series[key].barWidth = optionsSetup.maxWidth;
           series[key].barMinHeight = optionsSetup.minHeight;
@@ -349,8 +401,11 @@ export default {
           type: optionsSetup.tooltipAxisPointerType,
         },
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -369,17 +424,24 @@ export default {
     },
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例名称设置
     setOptionsLegendName(name) {
@@ -457,16 +519,19 @@ export default {
       legendName.push("bar1");
       legendName.push("bar2");
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {
@@ -518,16 +583,19 @@ export default {
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
       const xAxisDataLength = val.length !== 0 ? val.xAxis.length : 1;
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {

+ 110 - 52
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue

@@ -110,22 +110,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -135,28 +140,44 @@ export default {
       const xAxis = {
         type: "category",
         // 坐标轴是否显示
-        show: optionsSetup.hideX,
+        show: optionsSetup.isShowX,
+        position: optionsSetup.positionX,
+        offset: optionsSetup.offsetX,
         // 坐标轴名称
         name: optionsSetup.nameX,
+        nameLocation: optionsSetup.nameLocationX,
         nameTextStyle: {
           color: optionsSetup.nameColorX,
           fontSize: optionsSetup.nameFontSizeX,
+          fontWeight: optionsSetup.nameFontWeightX,
+          fontStyle: optionsSetup.nameFontStyleX,
+          fontFamily: optionsSetup.nameFontFamilyX,
         },
         // 轴反转
         inverse: optionsSetup.reversalX,
         axisLabel: {
-          show: true,
-          interval: optionsSetup.textInterval,
+          show: optionsSetup.isShowAxisLabelX,
+          interval: optionsSetup.textIntervalX,
           // 文字角度
           rotate: optionsSetup.textAngleX,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorX,
-            fontSize: optionsSetup.fontSizeX,
+            color: optionsSetup.textColorX,
+            fontSize: optionsSetup.textFontSizeX,
+            fontWeight: optionsSetup.textFontWeightX,
+            fontStyle: optionsSetup.textFontStyleX,
+            fontFamily: optionsSetup.textFontFamilyX,
           },
         },
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
             width: optionsSetup.lineWidthX,
@@ -183,26 +204,43 @@ export default {
         splitNumber: optionsSetup.splitNumberY,
         // 坐标轴是否显示
         show: optionsSetup.isShowY,
+        position: optionsSetup.positionY,
+        offset: optionsSetup.offsetY,
         // 坐标轴名称
         name: optionsSetup.textNameY,
+        nameLocation: optionsSetup.nameLocationY,
         nameTextStyle: {
           color: optionsSetup.nameColorY,
           fontSize: optionsSetup.nameFontSizeY,
+          fontWeight: optionsSetup.nameFontWeightY,
+          fontStyle: optionsSetup.nameFontStyleY,
+          fontFamily: optionsSetup.nameFontFamilyY,
         },
         // 轴反转
         inverse: optionsSetup.reversalY,
         axisLabel: {
-          show: true,
+          show: optionsSetup.isShowAxisLabelY,
           // 文字角度
           rotate: optionsSetup.textAngleY,
+          //interval: optionsSetup.textIntervalY,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorY,
-            fontSize: optionsSetup.fontSizeY,
+            color: optionsSetup.textColorY,
+            fontSize: optionsSetup.textFontSizeY,
+            fontWeight: optionsSetup.textFontWeightY,
+            fontStyle: optionsSetup.textFontStyleY,
+            fontFamily: optionsSetup.textFontFamilyY,
           },
         },
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineY,
+          lineStyle: {
+            color: optionsSetup.lineColorY,
+            width: optionsSetup.lineWidthY,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.isShowAxisLineY,
           lineStyle: {
             color: optionsSetup.lineColorY,
             width: optionsSetup.lineWidthY,
@@ -228,8 +266,11 @@ export default {
           type: optionsSetup.tooltipAxisPointerType,
         },
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -249,17 +290,24 @@ export default {
     // 图例操作 legend
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例名称设置
     setOptionsLegendName(name) {
@@ -371,9 +419,11 @@ export default {
             position: optionsSetup.fontPosition,
             distance: optionsSetup.fontDistance,
             fontSize: optionsSetup.fontSize,
-            color: optionsSetup.dataColor,
+            color: optionsSetup.fontColor,
             fontWeight: optionsSetup.fontWeight,
-            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyle,
+            fontFamily: optionsSetup.fontFamily,
           },
           //颜色,圆角属性
           itemStyle: {
@@ -398,16 +448,19 @@ export default {
       }
       this.options.series = series;
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisList.length) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisList.length) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {
@@ -479,9 +532,11 @@ export default {
               position: optionsSetup.fontPosition,
               distance: optionsSetup.fontDistance,
               fontSize: optionsSetup.fontSize,
-              color: optionsSetup.dataColor,
+              color: optionsSetup.fontColor,
               fontWeight: optionsSetup.fontWeight,
-              formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
+              formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+              fontStyle: optionsSetup.fontStyle,
+              fontFamily: optionsSetup.fontFamily,
             },
             //颜色,圆角属性
             itemStyle: {
@@ -507,16 +562,19 @@ export default {
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
       const xAxisDataLength = val.length !== 0 ? val.xAxis.length : 1;
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {

+ 126 - 53
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackMoreShowChart.vue

@@ -110,22 +110,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -135,33 +140,52 @@ export default {
       const xAxis = {
         type: "category",
         // 坐标轴是否显示
-        show: optionsSetup.hideX,
+        show: optionsSetup.isShowX,
+        position: optionsSetup.positionX,
+        offset: optionsSetup.offsetX,
         // 坐标轴名称
         name: optionsSetup.nameX,
+        nameLocation: optionsSetup.nameLocationX,
         nameTextStyle: {
           color: optionsSetup.nameColorX,
           fontSize: optionsSetup.nameFontSizeX,
+          fontWeight: optionsSetup.nameFontWeightX,
+          fontStyle: optionsSetup.nameFontStyleX,
+          fontFamily: optionsSetup.nameFontFamilyX,
         },
         // 轴反转
         inverse: optionsSetup.reversalX,
         axisLabel: {
-          show: true,
-          interval: optionsSetup.textInterval,
+          show: optionsSetup.isShowAxisLabelX,
+          interval: optionsSetup.textIntervalX,
           // 文字角度
           rotate: optionsSetup.textAngleX,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorX,
-            fontSize: optionsSetup.fontSizeX,
+            color: optionsSetup.textColorX,
+            fontSize: optionsSetup.textFontSizeX,
+            fontWeight: optionsSetup.textFontWeightX,
+            fontStyle: optionsSetup.textFontStyleX,
+            fontFamily: optionsSetup.textFontFamilyX,
           },
         },
+        // X轴线
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
             width: optionsSetup.lineWidthX,
           },
         },
+        // X轴刻度线
+        axisTick: {
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
+          },
+        },
+        // X轴分割线
         splitLine: {
           show: optionsSetup.isShowSplitLineX,
           lineStyle: {
@@ -169,6 +193,7 @@ export default {
             width: optionsSetup.splitLineWidthX,
           },
         },
+
       };
       this.options.xAxis = xAxis;
     },
@@ -183,26 +208,43 @@ export default {
         splitNumber: optionsSetup.splitNumberY,
         // 坐标轴是否显示
         show: optionsSetup.isShowY,
+        position: optionsSetup.positionY,
+        offset: optionsSetup.offsetY,
         // 坐标轴名称
         name: optionsSetup.textNameY,
+        nameLocation: optionsSetup.nameLocationY,
         nameTextStyle: {
           color: optionsSetup.nameColorY,
           fontSize: optionsSetup.nameFontSizeY,
+          fontWeight: optionsSetup.nameFontWeightY,
+          fontStyle: optionsSetup.nameFontStyleY,
+          fontFamily: optionsSetup.nameFontFamilyY,
         },
         // 轴反转
         inverse: optionsSetup.reversalY,
         axisLabel: {
-          show: true,
+          show: optionsSetup.isShowAxisLabelY,
           // 文字角度
           rotate: optionsSetup.textAngleY,
+          //interval: optionsSetup.textIntervalY,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorY,
-            fontSize: optionsSetup.fontSizeY,
+            color: optionsSetup.textColorY,
+            fontSize: optionsSetup.textFontSizeY,
+            fontWeight: optionsSetup.textFontWeightY,
+            fontStyle: optionsSetup.textFontStyleY,
+            fontFamily: optionsSetup.textFontFamilyY,
           },
         },
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineY,
+          lineStyle: {
+            color: optionsSetup.lineColorY,
+            width: optionsSetup.lineWidthY,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.isShowAxisLineY,
           lineStyle: {
             color: optionsSetup.lineColorY,
             width: optionsSetup.lineWidthY,
@@ -224,12 +266,15 @@ export default {
       const tooltip = {
         show: optionsSetup.isShowTooltip,
         trigger: optionsSetup.tooltipTrigger,
-        axisPointer:{
+        axisPointer: {
           type: optionsSetup.tooltipAxisPointerType,
         },
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -249,17 +294,24 @@ export default {
     // 图例操作 legend
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例名称设置
     setOptionsLegendName(name) {
@@ -280,6 +332,15 @@ export default {
         this.options.legend["data"] = arr;
       }
     },
+    //获取堆叠样式
+    getStackStyle() {
+      const optionsSetup = this.optionsSetup;
+      let style = "";
+      if (optionsSetup.stackStyle == "upDown") {
+        style = "total";
+      }
+      return style;
+    },
     // 数据解析
     setOptionsData(e, paramsConfig) {
       const optionsSetup = this.optionsSetup;
@@ -347,6 +408,7 @@ export default {
         return {
           name: item.name,
           type: "bar",
+          stack: this.getStackStyle(),
           data: item.list.map((item) => item.data),
           barGap: optionsSetup.barGap + "%",
           barMinHeight: optionsSetup.minHeight,
@@ -356,12 +418,14 @@ export default {
             position: optionsSetup.fontPosition,
             distance: optionsSetup.fontDistance,
             fontSize: optionsSetup.fontSize,
-            color: optionsSetup.dataColor,
+            color: optionsSetup.fontColor,
             fontWeight: optionsSetup.fontWeight,
             formatter: (row) => {
               const dataIndex = row.dataIndex;
               return `${fontDataName[0]}:${item.list[dataIndex].plan}\n${fontDataName[1]}:${item.list[dataIndex].real}\n${fontDataName[2]}:${item.list[dataIndex].data}%`;
-            }
+            },
+            fontStyle: optionsSetup.fontStyle,
+            fontFamily: optionsSetup.fontFamily,
           },
           //颜色,圆角属性
           itemStyle: {
@@ -385,16 +449,19 @@ export default {
       })
       this.options.series = series;
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axisList.length) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axisList.length) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {
@@ -449,6 +516,7 @@ export default {
         return {
           name: item.name,
           type: "bar",
+          stack: this.getStackStyle(),
           data: item.list.map((item) => item.data),
           barGap: optionsSetup.barGap + "%",
           barMinHeight: optionsSetup.minHeight,
@@ -458,12 +526,14 @@ export default {
             position: optionsSetup.fontPosition,
             distance: optionsSetup.fontDistance,
             fontSize: optionsSetup.fontSize,
-            color: optionsSetup.dataColor,
+            color: optionsSetup.fontColor,
             fontWeight: optionsSetup.fontWeight,
             formatter: (row) => {
               const dataIndex = row.dataIndex;
               return `${fontDataName[0]}:${item.list[dataIndex].display1}\n${fontDataName[1]}:${item.list[dataIndex].display2}\n${fontDataName[2]}:${item.list[dataIndex].data}%`;
-            }
+            },
+            fontStyle: optionsSetup.fontStyle,
+            fontFamily: optionsSetup.fontFamily,
           },
           //颜色,圆角属性
           itemStyle: {
@@ -487,16 +557,19 @@ export default {
       })
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
       const xAxisDataLength = val.length !== 0 ? val.xAxis.length : 1;
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {

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

@@ -124,22 +124,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -149,33 +154,52 @@ export default {
       const xAxis = {
         type: "category",
         // 坐标轴是否显示
-        show: optionsSetup.hideX,
+        show: optionsSetup.isShowX,
+        position: optionsSetup.positionX,
+        offset: optionsSetup.offsetX,
         // 坐标轴名称
         name: optionsSetup.nameX,
+        nameLocation: optionsSetup.nameLocationX,
         nameTextStyle: {
           color: optionsSetup.nameColorX,
           fontSize: optionsSetup.nameFontSizeX,
+          fontWeight: optionsSetup.nameFontWeightX,
+          fontStyle: optionsSetup.nameFontStyleX,
+          fontFamily: optionsSetup.nameFontFamilyX,
         },
         // 轴反转
         inverse: optionsSetup.reversalX,
         axisLabel: {
-          show: true,
-          interval: optionsSetup.textInterval,
+          show: optionsSetup.isShowAxisLabelX,
+          interval: optionsSetup.textIntervalX,
           // 文字角度
           rotate: optionsSetup.textAngleX,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorX,
-            fontSize: optionsSetup.fontSizeX,
+            color: optionsSetup.textColorX,
+            fontSize: optionsSetup.textFontSizeX,
+            fontWeight: optionsSetup.textFontWeightX,
+            fontStyle: optionsSetup.textFontStyleX,
+            fontFamily: optionsSetup.textFontFamilyX,
           },
         },
+        // X轴线
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
+          },
+        },
+        // X轴刻度线
+        axisTick: {
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
             width: optionsSetup.lineWidthX,
           },
         },
+        // X轴分割线
         splitLine: {
           show: optionsSetup.isShowSplitLineX,
           lineStyle: {
@@ -197,26 +221,43 @@ export default {
         splitNumber: optionsSetup.splitNumberY,
         // 坐标轴是否显示
         show: optionsSetup.isShowY,
+        position: optionsSetup.positionY,
+        offset: optionsSetup.offsetY,
         // 坐标轴名称
         name: optionsSetup.textNameY,
+        nameLocation: optionsSetup.nameLocationY,
         nameTextStyle: {
           color: optionsSetup.nameColorY,
           fontSize: optionsSetup.nameFontSizeY,
+          fontWeight: optionsSetup.nameFontWeightY,
+          fontStyle: optionsSetup.nameFontStyleY,
+          fontFamily: optionsSetup.nameFontFamilyY,
         },
         // 轴反转
         inverse: optionsSetup.reversalY,
         axisLabel: {
-          show: true,
+          show: optionsSetup.isShowAxisLabelY,
           // 文字角度
           rotate: optionsSetup.textAngleY,
+          //interval: optionsSetup.textIntervalY,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorY,
-            fontSize: optionsSetup.fontSizeY,
+            color: optionsSetup.textColorY,
+            fontSize: optionsSetup.textFontSizeY,
+            fontWeight: optionsSetup.textFontWeightY,
+            fontStyle: optionsSetup.textFontStyleY,
+            fontFamily: optionsSetup.textFontFamilyY,
           },
         },
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineY,
+          lineStyle: {
+            color: optionsSetup.lineColorY,
+            width: optionsSetup.lineWidthY,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.isShowAxisLineY,
           lineStyle: {
             color: optionsSetup.lineColorY,
             width: optionsSetup.lineWidthY,
@@ -238,12 +279,15 @@ export default {
       const tooltip = {
         show: optionsSetup.isShowTooltip,
         trigger: optionsSetup.tooltipTrigger,
-        axisPointer:{
+        axisPointer: {
           type: optionsSetup.tooltipAxisPointerType,
         },
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -263,17 +307,24 @@ export default {
     // 图例
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例名称设置
     setOptionsLegendName(name) {
@@ -356,9 +407,11 @@ export default {
             position: optionsSetup.fontPosition,
             distance: optionsSetup.fontDistance,
             fontSize: optionsSetup.fontSize,
-            color: optionsSetup.dataColor,
+            color: optionsSetup.fontColor,
             fontWeight: optionsSetup.fontWeight,
-            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyle,
+            fontFamily: optionsSetup.fontFamily,
           };
           // 获取颜色样式
           if (optionsSetup.colorStyle == 'same') {
@@ -393,16 +446,19 @@ export default {
         }
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.fontSizeX)
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.textFontSizeX)
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {
@@ -477,9 +533,11 @@ export default {
             position: optionsSetup.fontPosition,
             distance: optionsSetup.fontDistance,
             fontSize: optionsSetup.fontSize,
-            color: optionsSetup.dataColor,
+            color: optionsSetup.fontColor,
             fontWeight: optionsSetup.fontWeight,
-            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyle,
+            fontFamily: optionsSetup.fontFamily,
           };
           // 获取颜色样式
           if (optionsSetup.colorStyle == 'same') {
@@ -516,16 +574,19 @@ export default {
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
       const xAxisDataLength = val.length !== 0 ? val.xAxis.length : 1;
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {

+ 87 - 38
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetGradientColorBarchart.vue

@@ -193,22 +193,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -218,28 +223,44 @@ export default {
       const xAxis = {
         type: "category",
         // 坐标轴是否显示
-        show: optionsSetup.hideX,
+        show: optionsSetup.isShowX,
+        position: optionsSetup.positionX,
+        offset: optionsSetup.offsetX,
         // 坐标轴名称
         name: optionsSetup.nameX,
+        nameLocation: optionsSetup.nameLocationX,
         nameTextStyle: {
           color: optionsSetup.nameColorX,
           fontSize: optionsSetup.nameFontSizeX,
+          fontWeight: optionsSetup.nameFontWeightX,
+          fontStyle: optionsSetup.nameFontStyleX,
+          fontFamily: optionsSetup.nameFontFamilyX,
         },
         // 轴反转
         inverse: optionsSetup.reversalX,
         axisLabel: {
-          show: true,
-          interval: optionsSetup.textInterval,
+          show: optionsSetup.isShowAxisLabelX,
+          interval: optionsSetup.textIntervalX,
           // 文字角度
           rotate: optionsSetup.textAngleX,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorX,
-            fontSize: optionsSetup.fontSizeX,
+            color: optionsSetup.textColorX,
+            fontSize: optionsSetup.textFontSizeX,
+            fontWeight: optionsSetup.textFontWeightX,
+            fontStyle: optionsSetup.textFontStyleX,
+            fontFamily: optionsSetup.textFontFamilyX,
           },
         },
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
             width: optionsSetup.lineWidthX,
@@ -266,26 +287,43 @@ export default {
         splitNumber: optionsSetup.splitNumberY,
         // 坐标轴是否显示
         show: optionsSetup.isShowY,
+        position: optionsSetup.positionY,
+        offset: optionsSetup.offsetY,
         // 坐标轴名称
         name: optionsSetup.textNameY,
+        nameLocation: optionsSetup.nameLocationY,
         nameTextStyle: {
           color: optionsSetup.nameColorY,
           fontSize: optionsSetup.nameFontSizeY,
+          fontWeight: optionsSetup.nameFontWeightY,
+          fontStyle: optionsSetup.nameFontStyleY,
+          fontFamily: optionsSetup.nameFontFamilyY,
         },
         // 轴反转
         inverse: optionsSetup.reversalY,
         axisLabel: {
-          show: true,
+          show: optionsSetup.isShowAxisLabelY,
           // 文字角度
           rotate: optionsSetup.textAngleY,
+          //interval: optionsSetup.textIntervalY,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorY,
-            fontSize: optionsSetup.fontSizeY,
+            color: optionsSetup.textColorY,
+            fontSize: optionsSetup.textFontSizeY,
+            fontWeight: optionsSetup.textFontWeightY,
+            fontStyle: optionsSetup.textFontStyleY,
+            fontFamily: optionsSetup.textFontFamilyY,
           },
         },
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineY,
+          lineStyle: {
+            color: optionsSetup.lineColorY,
+            width: optionsSetup.lineWidthY,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.isShowAxisLineY,
           lineStyle: {
             color: optionsSetup.lineColorY,
             width: optionsSetup.lineWidthY,
@@ -313,9 +351,11 @@ export default {
           position: optionsSetup.fontPosition,
           distance: optionsSetup.fontDistance,
           fontSize: optionsSetup.fontSize,
-          color: optionsSetup.dataColor,
+          color: optionsSetup.fontColor,
           fontWeight: optionsSetup.fontWeight,
-          formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
+          formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+          fontStyle: optionsSetup.fontStyle,
+          fontFamily: optionsSetup.fontFamily,
         };
         series[0].barWidth = optionsSetup.maxWidth;
         //柱体背景属性
@@ -341,8 +381,11 @@ export default {
           type: optionsSetup.tooltipAxisPointerType,
         },
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -434,16 +477,19 @@ export default {
         data[i] = val[i].data;
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.textFontSizeX);
       const axisLabel = {
         show: true,
-        interval: optionsSetup.textInterval,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {
@@ -499,16 +545,19 @@ export default {
     renderingFn(optionsSetup, val) {
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
       const xAxisDataLength = val.length !== 0 ? val.xAxis.length : 1;
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.textFontSizeX);
       const axisLabel = {
         show: true,
-        interval: optionsSetup.textInterval,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {

+ 150 - 74
report-ui/src/views/bigscreenDesigner/designer/widget/barline/widgetBarLineStackChart.vue

@@ -145,22 +145,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -170,33 +175,52 @@ export default {
       const xAxis = {
         type: "category",
         // 坐标轴是否显示
-        show: optionsSetup.hideX,
+        show: optionsSetup.isShowX,
+        position: optionsSetup.positionX,
+        offset: optionsSetup.offsetX,
         // 坐标轴名称
         name: optionsSetup.nameX,
+        nameLocation: optionsSetup.nameLocationX,
         nameTextStyle: {
           color: optionsSetup.nameColorX,
           fontSize: optionsSetup.nameFontSizeX,
+          fontWeight: optionsSetup.nameFontWeightX,
+          fontStyle: optionsSetup.nameFontStyleX,
+          fontFamily: optionsSetup.nameFontFamilyX,
         },
         // 轴反转
         inverse: optionsSetup.reversalX,
         axisLabel: {
-          show: true,
-          interval: optionsSetup.textInterval,
+          show: optionsSetup.isShowAxisLabelX,
+          interval: optionsSetup.textIntervalX,
           // 文字角度
           rotate: optionsSetup.textAngleX,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorX,
-            fontSize: optionsSetup.fontSizeX,
+            color: optionsSetup.textColorX,
+            fontSize: optionsSetup.textFontSizeX,
+            fontWeight: optionsSetup.textFontWeightX,
+            fontStyle: optionsSetup.textFontStyleX,
+            fontFamily: optionsSetup.textFontFamilyX,
           },
         },
+        // X轴线
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
+          },
+        },
+        // X轴刻度线
+        axisTick: {
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
             width: optionsSetup.lineWidthX,
           },
         },
+        // X轴分割线
         splitLine: {
           show: optionsSetup.isShowSplitLineX,
           lineStyle: {
@@ -214,36 +238,50 @@ export default {
         {
           max: optionsSetup.maxYLeft !== "" ? optionsSetup.maxYLeft : null,
           type: "value",
+          scale: optionsSetup.scaleYLeft,
           // 均分
-          splitNumber: optionsSetup.splitNumberLeft,
+          splitNumber: optionsSetup.splitNumberYLeft,
           // 坐标轴是否显示
           show: optionsSetup.isShowYLeft,
+          position: optionsSetup.positionYLeft,
+          offset: optionsSetup.offsetYLeft,
           // 坐标轴名称
           name: optionsSetup.textNameYLeft,
+          nameLocation: optionsSetup.nameLocationYLeft,
           // 别名
           nameTextStyle: {
             color: optionsSetup.nameColorYLeft,
             fontSize: optionsSetup.nameFontSizeYLeft,
+            fontWeight: optionsSetup.nameFontWeightYLeft,
+            fontStyle: optionsSetup.nameFontStyleYLeft,
+            fontFamily: optionsSetup.nameFontFamilyYLeft,
           },
           axisLabel: {
-            show: true,
+            show: optionsSetup.isShowAxisLabelYLeft,
             // 文字角度
             rotate: optionsSetup.textAngleYLeft,
             textStyle: {
               // 坐标文字颜色
-              color: optionsSetup.colorYLeft,
-              fontSize: optionsSetup.fontSizeYLeft,
+              color: optionsSetup.textColorYLeft,
+              fontSize: optionsSetup.textFontSizeYLeft,
+              fontWeight: optionsSetup.textFontWeightYLeft,
+              fontStyle: optionsSetup.textFontStyleYLeft,
+              fontFamily: optionsSetup.textFontFamilyYLeft,
             },
           },
-          axisTick: {
-            // 刻度
-            show: optionsSetup.tickLineYLeft,
-          },
           axisLine: {
-            show: optionsSetup.lineYLeft,
+            show: optionsSetup.isShowAxisLineYLeft,
             lineStyle: {
+              width: optionsSetup.lineWidthYLeft,
               color: optionsSetup.lineColorYLeft,
+            },
+          },
+          axisTick: {
+            // 刻度
+            show: optionsSetup.isShowAxisLineYLeft,
+            lineStyle: {
               width: optionsSetup.lineWidthYLeft,
+              color: optionsSetup.lineColorYLeft,
             },
           },
           splitLine: {
@@ -257,38 +295,52 @@ export default {
         {
           max: optionsSetup.maxYRight !== "" ? optionsSetup.maxYRight : null,
           type: "value",
+          scale: optionsSetup.scaleYRight,
           // 均分
-          splitNumber: optionsSetup.splitNumberRight,
+          splitNumber: optionsSetup.splitNumberYRight,
           // 坐标轴是否显示
           show: optionsSetup.isShowYRight,
+          position: optionsSetup.positionYRight,
+          offset: optionsSetup.offsetYRight,
           // 坐标轴名称
           name: optionsSetup.textNameYRight,
+          nameLocation: optionsSetup.nameLocationYRight,
           // 别名
           nameTextStyle: {
             color: optionsSetup.nameColorYRight,
             fontSize: optionsSetup.nameFontSizeYRight,
+            fontWeight: optionsSetup.nameFontWeightYRight,
+            fontStyle: optionsSetup.nameFontStyleYRight,
+            fontFamily: optionsSetup.nameFontFamilyYRight,
           },
           axisLabel: {
-            show: true,
+            show: optionsSetup.isShowAxisLabelYRight,
             // 文字角度
             rotate: optionsSetup.textAngleYRight,
             textStyle: {
               // 坐标文字颜色
-              color: optionsSetup.colorYRight,
-              fontSize: optionsSetup.fontSizeYRight,
+              color: optionsSetup.textColorYRight,
+              fontSize: optionsSetup.textFontSizeYRight,
+              fontWeight: optionsSetup.textFontWeightYRight,
+              fontStyle: optionsSetup.textFontStyleYRight,
+              fontFamily: optionsSetup.textFontFamilyYRight,
             },
           },
-          axisTick: {
-            // 刻度
-            show: optionsSetup.tickLineYRight,
-          },
           axisLine: {
-            show: optionsSetup.lineYRight,
+            show: optionsSetup.isShowAxisLineYRight,
             lineStyle: {
               width: optionsSetup.lineWidthYRight,
               color: optionsSetup.lineColorYRight,
             },
           },
+          axisTick: {
+            // 刻度
+            show: optionsSetup.isShowAxisLineYRight,
+            lineStyle: {
+              width: optionsSetup.lineWidthYRight,
+              color: optionsSetup.lineColorYRight,
+            }
+          },
           splitLine: {
             show: optionsSetup.isShowSplitLineYRight,
             lineStyle: {
@@ -310,8 +362,11 @@ export default {
           type: optionsSetup.tooltipAxisPointerType,
         },
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -331,17 +386,24 @@ export default {
     // 图例操作 legend
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例名称设置
     setOptionsLegendName(name) {
@@ -458,11 +520,13 @@ export default {
           label: {
             show: optionsSetup.isShowBar,
             position: optionsSetup.fontPositionBar,
-            distance: optionsSetup.distanceBar,
+            distance: optionsSetup.fontDistanceBar,
             fontSize: optionsSetup.fontSizeBar,
-            color: optionsSetup.subTextColorBar,
+            color: optionsSetup.fontColorBar,
             fontWeight: optionsSetup.fontWeightBar,
-            formatter: !!optionsSetup.percentSignBar ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSignBar ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyleBar,
+            fontFamily: optionsSetup.fontFamilyBar,
           },
           //颜色,圆角属性
           itemStyle: {
@@ -516,25 +580,30 @@ export default {
           label: {
             show: optionsSetup.isShowLine,
             position: optionsSetup.fontPositionLine,
-            distance: optionsSetup.distanceLine,
+            distance: optionsSetup.fontDistanceLine,
             fontSize: optionsSetup.fontSizeLine,
-            color: optionsSetup.subTextColorLine,
+            color: optionsSetup.fontColorLine,
             fontWeight: optionsSetup.fontWeightLine,
-            formatter: !!optionsSetup.percentSignLine ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSignLine ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyleLine,
+            fontFamily: optionsSetup.fontFamilyLine,
           },
         });
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisList.length) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisList.length) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {
@@ -606,11 +675,13 @@ export default {
           label: {
             show: optionsSetup.isShowBar,
             position: optionsSetup.fontPositionBar,
-            distance: optionsSetup.distanceBar,
+            distance: optionsSetup.fontDistanceBar,
             fontSize: optionsSetup.fontSizeBar,
-            color: optionsSetup.subTextColorBar,
+            color: optionsSetup.fontColorBar,
             fontWeight: optionsSetup.fontWeightBar,
-            formatter: !!optionsSetup.percentSignBar ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSignBar ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyleBar,
+            fontFamily: optionsSetup.fontFamilyBar,
           },
           //颜色,圆角属性
           itemStyle: {
@@ -663,26 +734,31 @@ export default {
           label: {
             show: optionsSetup.isShowLine,
             position: optionsSetup.fontPositionLine,
-            distance: optionsSetup.distanceLine,
+            distance: optionsSetup.fontDistanceLine,
             fontSize: optionsSetup.fontSizeLine,
-            color: optionsSetup.subTextColorLine,
+            color: optionsSetup.fontColorLine,
             fontWeight: optionsSetup.fontWeightLine,
-            formatter: !!optionsSetup.percentSignLine ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSignLine ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyleLine,
+            fontFamily: optionsSetup.fontFamilyLine,
           },
         });
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
       const xAxisDataLength = val.length !== 0 ? val.xAxis.length : 1;
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {

+ 139 - 67
report-ui/src/views/bigscreenDesigner/designer/widget/barline/widgetBarlinechart.vue

@@ -152,22 +152,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -177,33 +182,52 @@ export default {
       const xAxis = {
         type: "category",
         // 坐标轴是否显示
-        show: optionsSetup.hideX,
+        show: optionsSetup.isShowX,
+        position: optionsSetup.positionX,
+        offset: optionsSetup.offsetX,
         // 坐标轴名称
         name: optionsSetup.nameX,
+        nameLocation: optionsSetup.nameLocationX,
         nameTextStyle: {
           color: optionsSetup.nameColorX,
           fontSize: optionsSetup.nameFontSizeX,
+          fontWeight: optionsSetup.nameFontWeightX,
+          fontStyle: optionsSetup.nameFontStyleX,
+          fontFamily: optionsSetup.nameFontFamilyX,
         },
         // 轴反转
         inverse: optionsSetup.reversalX,
         axisLabel: {
-          show: true,
-          interval: optionsSetup.textInterval,
+          show: optionsSetup.isShowAxisLabelX,
+          interval: optionsSetup.textIntervalX,
           // 文字角度
           rotate: optionsSetup.textAngleX,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorX,
-            fontSize: optionsSetup.fontSizeX,
+            color: optionsSetup.textColorX,
+            fontSize: optionsSetup.textFontSizeX,
+            fontWeight: optionsSetup.textFontWeightX,
+            fontStyle: optionsSetup.textFontStyleX,
+            fontFamily: optionsSetup.textFontFamilyX,
           },
         },
+        // X轴线
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
+          },
+        },
+        // X轴刻度线
+        axisTick: {
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
             width: optionsSetup.lineWidthX,
           },
         },
+        // X轴分割线
         splitLine: {
           show: optionsSetup.isShowSplitLineX,
           lineStyle: {
@@ -221,33 +245,47 @@ export default {
         {
           max: optionsSetup.maxYLeft !== "" ? optionsSetup.maxYLeft : null,
           type: "value",
+          scale: optionsSetup.scaleYLeft,
           // 均分
-          splitNumber: optionsSetup.splitNumberLeft,
+          splitNumber: optionsSetup.splitNumberYLeft,
           // 坐标轴是否显示
           show: optionsSetup.isShowYLeft,
+          position: optionsSetup.positionYLeft,
+          offset: optionsSetup.offsetYLeft,
           // 坐标轴名称
           name: optionsSetup.textNameYLeft,
+          nameLocation: optionsSetup.nameLocationYLeft,
           // 别名
           nameTextStyle: {
             color: optionsSetup.nameColorYLeft,
             fontSize: optionsSetup.nameFontSizeYLeft,
+            fontWeight: optionsSetup.nameFontWeightYLeft,
+            fontStyle: optionsSetup.nameFontStyleYLeft,
+            fontFamily: optionsSetup.nameFontFamilyYLeft,
           },
           axisLabel: {
-            show: true,
+            show: optionsSetup.isShowAxisLabelYLeft,
             // 文字角度
             rotate: optionsSetup.textAngleYLeft,
             textStyle: {
               // 坐标文字颜色
-              color: optionsSetup.colorYLeft,
-              fontSize: optionsSetup.fontSizeYLeft,
+              color: optionsSetup.textColorYLeft,
+              fontSize: optionsSetup.textFontSizeYLeft,
+              fontWeight: optionsSetup.textFontWeightYLeft,
+              fontStyle: optionsSetup.textFontStyleYLeft,
+              fontFamily: optionsSetup.textFontFamilyYLeft,
+            },
+          },
+          axisLine: {
+            show: optionsSetup.isShowAxisLineYLeft,
+            lineStyle: {
+              width: optionsSetup.lineWidthYLeft,
+              color: optionsSetup.lineColorYLeft,
             },
           },
           axisTick: {
             // 刻度
-            show: optionsSetup.tickLineYLeft,
-          },
-          axisLine: {
-            show: optionsSetup.lineYLeft,
+            show: optionsSetup.isShowAxisLineYLeft,
             lineStyle: {
               width: optionsSetup.lineWidthYLeft,
               color: optionsSetup.lineColorYLeft,
@@ -264,38 +302,52 @@ export default {
         {
           max: optionsSetup.maxYRight !== "" ? optionsSetup.maxYRight : null,
           type: "value",
+          scale: optionsSetup.scaleYRight,
           // 均分
-          splitNumber: optionsSetup.splitNumberRight,
+          splitNumber: optionsSetup.splitNumberYRight,
           // 坐标轴是否显示
           show: optionsSetup.isShowYRight,
+          position: optionsSetup.positionYRight,
+          offset: optionsSetup.offsetYRight,
           // 坐标轴名称
           name: optionsSetup.textNameYRight,
+          nameLocation: optionsSetup.nameLocationYRight,
           // 别名
           nameTextStyle: {
             color: optionsSetup.nameColorYRight,
             fontSize: optionsSetup.nameFontSizeYRight,
+            fontWeight: optionsSetup.nameFontWeightYRight,
+            fontStyle: optionsSetup.nameFontStyleYRight,
+            fontFamily: optionsSetup.nameFontFamilyYRight,
           },
           axisLabel: {
-            show: true,
+            show: optionsSetup.isShowAxisLabelYRight,
             // 文字角度
             rotate: optionsSetup.textAngleYRight,
             textStyle: {
               // 坐标文字颜色
-              color: optionsSetup.colorYRight,
-              fontSize: optionsSetup.fontSizeYRight,
+              color: optionsSetup.textColorYRight,
+              fontSize: optionsSetup.textFontSizeYRight,
+              fontWeight: optionsSetup.textFontWeightYRight,
+              fontStyle: optionsSetup.textFontStyleYRight,
+              fontFamily: optionsSetup.textFontFamilyYRight,
             },
           },
-          axisTick: {
-            // 刻度
-            show: optionsSetup.tickLineYRight,
-          },
           axisLine: {
-            show: optionsSetup.lineYRight,
+            show: optionsSetup.isShowAxisLineYRight,
             lineStyle: {
               width: optionsSetup.lineWidthYRight,
               color: optionsSetup.lineColorYRight,
             },
           },
+          axisTick: {
+            // 刻度
+            show: optionsSetup.isShowAxisLineYRight,
+            lineStyle: {
+              width: optionsSetup.lineWidthYRight,
+              color: optionsSetup.lineColorYRight,
+            }
+          },
           splitLine: {
             show: optionsSetup.isShowSplitLineYRight,
             lineStyle: {
@@ -333,11 +385,13 @@ export default {
           series[key].label = {
             show: optionsSetup.isShowLine,
             position: optionsSetup.fontPositionLine,
-            distance: optionsSetup.distanceLine,
+            distance: optionsSetup.fontDistanceLine,
             fontSize: optionsSetup.fontSizeLine,
-            color: optionsSetup.subTextColorLine,
+            color: optionsSetup.fontColorLine,
             fontWeight: optionsSetup.fontWeightLine,
-            formatter: !!optionsSetup.percentSignLine ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSignLine ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyleLine,
+            fontFamily: optionsSetup.fontFamilyLine,
           };
         }
       }
@@ -352,11 +406,13 @@ export default {
           series[key].label = {
             show: optionsSetup.isShowBar,
             position: optionsSetup.fontPositionBar,
-            distance: optionsSetup.distanceBar,
+            distance: optionsSetup.fontDistanceBar,
             fontSize: optionsSetup.fontSizeBar,
-            color: optionsSetup.subTextColorBar,
+            color: optionsSetup.fontColorBar,
             fontWeight: optionsSetup.fontWeightBar,
-            formatter: !!optionsSetup.percentSignBar ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSignBar ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyleBar,
+            fontFamily: optionsSetup.fontFamilyBar,
           };
           //柱体背景属性
           series[key].showBackground = optionsSetup.isShowBackground;
@@ -386,8 +442,11 @@ export default {
           type: optionsSetup.tooltipAxisPointerType,
         },
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -406,17 +465,24 @@ export default {
     },
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例名称设置
     setOptionsLegendName(name) {
@@ -498,16 +564,19 @@ export default {
       legendName.push("line");
       const optionsSetup = this.optionsSetup;
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {
@@ -559,16 +628,19 @@ export default {
       const optionsSetup = this.optionsSetup;
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
       const xAxisDataLength = val.length !== 0 ? val.xAxis.length : 1;
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {

+ 149 - 73
report-ui/src/views/bigscreenDesigner/designer/widget/barline/widgetMoreBarLineChart.vue

@@ -212,22 +212,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -237,33 +242,52 @@ export default {
       const xAxis = {
         type: "category",
         // 坐标轴是否显示
-        show: optionsSetup.hideX,
+        show: optionsSetup.isShowX,
+        position: optionsSetup.positionX,
+        offset: optionsSetup.offsetX,
         // 坐标轴名称
         name: optionsSetup.nameX,
+        nameLocation: optionsSetup.nameLocationX,
         nameTextStyle: {
           color: optionsSetup.nameColorX,
           fontSize: optionsSetup.nameFontSizeX,
+          fontWeight: optionsSetup.nameFontWeightX,
+          fontStyle: optionsSetup.nameFontStyleX,
+          fontFamily: optionsSetup.nameFontFamilyX,
         },
         // 轴反转
         inverse: optionsSetup.reversalX,
         axisLabel: {
-          show: true,
-          interval: optionsSetup.textInterval,
+          show: optionsSetup.isShowAxisLabelX,
+          interval: optionsSetup.textIntervalX,
           // 文字角度
           rotate: optionsSetup.textAngleX,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorX,
-            fontSize: optionsSetup.fontSizeX,
+            color: optionsSetup.textColorX,
+            fontSize: optionsSetup.textFontSizeX,
+            fontWeight: optionsSetup.textFontWeightX,
+            fontStyle: optionsSetup.textFontStyleX,
+            fontFamily: optionsSetup.textFontFamilyX,
           },
         },
+        // X轴线
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
+          },
+        },
+        // X轴刻度线
+        axisTick: {
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
             width: optionsSetup.lineWidthX,
           },
         },
+        // X轴分割线
         splitLine: {
           show: optionsSetup.isShowSplitLineX,
           lineStyle: {
@@ -281,33 +305,47 @@ export default {
         {
           max: optionsSetup.maxYLeft !== "" ? optionsSetup.maxYLeft : null,
           type: "value",
+          scale: optionsSetup.scaleYLeft,
           // 均分
-          splitNumber: optionsSetup.splitNumberLeft,
+          splitNumber: optionsSetup.splitNumberYLeft,
           // 坐标轴是否显示
           show: optionsSetup.isShowYLeft,
+          position: optionsSetup.positionYLeft,
+          offset: optionsSetup.offsetYLeft,
           // 坐标轴名称
           name: optionsSetup.textNameYLeft,
+          nameLocation: optionsSetup.nameLocationYLeft,
           // 别名
           nameTextStyle: {
             color: optionsSetup.nameColorYLeft,
             fontSize: optionsSetup.nameFontSizeYLeft,
+            fontWeight: optionsSetup.nameFontWeightYLeft,
+            fontStyle: optionsSetup.nameFontStyleYLeft,
+            fontFamily: optionsSetup.nameFontFamilyYLeft,
           },
           axisLabel: {
-            show: true,
+            show: optionsSetup.isShowAxisLabelYLeft,
             // 文字角度
             rotate: optionsSetup.textAngleYLeft,
             textStyle: {
               // 坐标文字颜色
-              color: optionsSetup.colorYLeft,
-              fontSize: optionsSetup.fontSizeYLeft,
+              color: optionsSetup.textColorYLeft,
+              fontSize: optionsSetup.textFontSizeYLeft,
+              fontWeight: optionsSetup.textFontWeightYLeft,
+              fontStyle: optionsSetup.textFontStyleYLeft,
+              fontFamily: optionsSetup.textFontFamilyYLeft,
+            },
+          },
+          axisLine: {
+            show: optionsSetup.isShowAxisLineYLeft,
+            lineStyle: {
+              width: optionsSetup.lineWidthYLeft,
+              color: optionsSetup.lineColorYLeft,
             },
           },
           axisTick: {
             // 刻度
-            show: optionsSetup.tickLineYLeft,
-          },
-          axisLine: {
-            show: optionsSetup.lineYLeft,
+            show: optionsSetup.isShowAxisLineYLeft,
             lineStyle: {
               width: optionsSetup.lineWidthYLeft,
               color: optionsSetup.lineColorYLeft,
@@ -324,38 +362,52 @@ export default {
         {
           max: optionsSetup.maxYRight !== "" ? optionsSetup.maxYRight : null,
           type: "value",
+          scale: optionsSetup.scaleYRight,
           // 均分
-          splitNumber: optionsSetup.splitNumberRight,
+          splitNumber: optionsSetup.splitNumberYRight,
           // 坐标轴是否显示
           show: optionsSetup.isShowYRight,
+          position: optionsSetup.positionYRight,
+          offset: optionsSetup.offsetYRight,
           // 坐标轴名称
           name: optionsSetup.textNameYRight,
+          nameLocation: optionsSetup.nameLocationYRight,
           // 别名
           nameTextStyle: {
             color: optionsSetup.nameColorYRight,
             fontSize: optionsSetup.nameFontSizeYRight,
+            fontWeight: optionsSetup.nameFontWeightYRight,
+            fontStyle: optionsSetup.nameFontStyleYRight,
+            fontFamily: optionsSetup.nameFontFamilyYRight,
           },
           axisLabel: {
-            show: true,
+            show: optionsSetup.isShowAxisLabelYRight,
             // 文字角度
             rotate: optionsSetup.textAngleYRight,
             textStyle: {
               // 坐标文字颜色
-              color: optionsSetup.colorYRight,
-              fontSize: optionsSetup.fontSizeYRight,
+              color: optionsSetup.textColorYRight,
+              fontSize: optionsSetup.textFontSizeYRight,
+              fontWeight: optionsSetup.textFontWeightYRight,
+              fontStyle: optionsSetup.textFontStyleYRight,
+              fontFamily: optionsSetup.textFontFamilyYRight,
             },
           },
-          axisTick: {
-            // 刻度
-            show: optionsSetup.tickLineYRight,
-          },
           axisLine: {
-            show: optionsSetup.lineYRight,
+            show: optionsSetup.isShowAxisLineYRight,
             lineStyle: {
               width: optionsSetup.lineWidthYRight,
               color: optionsSetup.lineColorYRight,
             },
           },
+          axisTick: {
+            // 刻度
+            show: optionsSetup.isShowAxisLineYRight,
+            lineStyle: {
+              width: optionsSetup.lineWidthYRight,
+              color: optionsSetup.lineColorYRight,
+            }
+          },
           splitLine: {
             show: optionsSetup.isShowSplitLineYRight,
             lineStyle: {
@@ -377,8 +429,11 @@ export default {
           type: optionsSetup.tooltipAxisPointerType,
         },
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -397,17 +452,24 @@ export default {
     },
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例名称设置
     setOptionsLegendName(name) {
@@ -497,11 +559,13 @@ export default {
           series[i].label = {
             show: optionsSetup.isShowBar,
             position: optionsSetup.fontPositionBar,
-            distance: optionsSetup.distanceBar,
+            distance: optionsSetup.fontDistanceBar,
             fontSize: optionsSetup.fontSizeBar,
-            color: optionsSetup.subTextColorBar,
+            color: optionsSetup.fontColorBar,
             fontWeight: optionsSetup.fontWeightBar,
-            formatter: !!optionsSetup.percentSignBar ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSignBar ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyleBar,
+            fontFamily: optionsSetup.fontFamilyBar,
           };
           //柱体背景属性
           series[i].showBackground = optionsSetup.isShowBackground;
@@ -546,11 +610,13 @@ export default {
           series[i].label = {
             show: optionsSetup.isShowLine,
             position: optionsSetup.fontPositionLine,
-            distance: optionsSetup.distanceLine,
+            distance: optionsSetup.fontDistanceLine,
             fontSize: optionsSetup.fontSizeLine,
-            color: optionsSetup.subTextColorLine,
+            color: optionsSetup.fontColorLine,
             fontWeight: optionsSetup.fontWeightLine,
-            formatter: !!optionsSetup.percentSignLine ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSignLine ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyleLine,
+            fontFamily: optionsSetup.fontFamilyLine,
           };
         }
       }
@@ -558,16 +624,19 @@ export default {
       series[1].data = bar2;
       series[2].data = line;
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {
@@ -626,11 +695,13 @@ export default {
           obj.label = {
             show: optionsSetup.isShowBar,
             position: optionsSetup.fontPositionBar,
-            distance: optionsSetup.distanceBar,
+            distance: optionsSetup.fontDistanceBar,
             fontSize: optionsSetup.fontSizeBar,
-            color: optionsSetup.subTextColorBar,
+            color: optionsSetup.fontColorBar,
             fontWeight: optionsSetup.fontWeightBar,
-            formatter: !!optionsSetup.percentSignBar ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSignBar ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyleBar,
+            fontFamily: optionsSetup.fontFamilyBar,
           };
           obj.barWidth = optionsSetup.maxWidth;
           obj.itemStyle = {
@@ -681,11 +752,13 @@ export default {
           obj.label = {
             show: optionsSetup.isShowLine,
             position: optionsSetup.fontPositionLine,
-            distance: optionsSetup.distanceLine,
+            distance: optionsSetup.fontDistanceLine,
             fontSize: optionsSetup.fontSizeLine,
-            color: optionsSetup.subTextColorLine,
+            color: optionsSetup.fontColorLine,
             fontWeight: optionsSetup.fontWeightLine,
-            formatter: !!optionsSetup.percentSignLine ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSignLine ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyleLine,
+            fontFamily: optionsSetup.fontFamilyLine,
           };
           obj.data = val.series[i].data;
           series.push(obj);
@@ -693,16 +766,19 @@ export default {
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
       const xAxisDataLength = val.length !== 0 ? val.xAxis.length : 1;
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {

+ 50 - 33
report-ui/src/views/bigscreenDesigner/designer/widget/funnel/widgetFunnel.vue

@@ -141,12 +141,15 @@ export default {
       const optionsSetup = this.optionsSetup;
       const normal = {
         show: optionsSetup.isShow,
-        position: "inside",
-        formatter: "{c}",
+        position: optionsSetup.fontPosition,
+        distance: optionsSetup.fontDistance,
+        formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
         textStyle: {
-          color: optionsSetup.color,
+          color: optionsSetup.fontColor,
           fontSize: optionsSetup.fontSize,
           fontWeight: optionsSetup.fontWeight,
+          fontStyle: optionsSetup.fontStyle,
+          fontFamily: optionsSetup.fontFamily,
         },
       };
       this.options.series[0].label["normal"] = normal;
@@ -154,22 +157,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -178,10 +186,13 @@ export default {
       const optionsSetup = this.optionsSetup;
       const tooltip = {
         trigger: "item",
-        show: true,
+        show: optionsSetup.isShowTooltip,
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -189,18 +200,24 @@ export default {
     // 图例操作 legend
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.right = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例颜色修改
     setOptionsColor() {

+ 143 - 79
report-ui/src/views/bigscreenDesigner/designer/widget/line/widgetLineCompareChart.vue

@@ -1,6 +1,6 @@
 <template>
   <div :style="styleObj">
-    <v-chart ref="myVChart" :options="options" autoresize />
+    <v-chart ref="myVChart" :options="options" autoresize/>
   </div>
 </template>
 
@@ -302,22 +302,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -326,32 +331,44 @@ export default {
       const optionsSetup = this.optionsSetup;
       const xAxis0 = {
         gridIndex: 0,
+        type: "category",
         show: optionsSetup.isShowX,
         name: optionsSetup.nameX, // 坐标轴名称
+        nameLocation: optionsSetup.nameLocationX,
         nameTextStyle: {
           color: optionsSetup.nameColorX,
           fontSize: optionsSetup.nameFontSizeX,
+          fontWeight: optionsSetup.nameFontWeightX,
+          fontStyle: optionsSetup.nameFontStyleX,
+          fontFamily: optionsSetup.nameFontFamilyX,
+        },
+        boundaryGap: true, // 值居中
+        axisLabel: {
+          // X轴数据
+          show: optionsSetup.isShowAxisLabelX,
+          interval: optionsSetup.textIntervalX,
+          textStyle: {
+            color: optionsSetup.textColorX,
+            fontSize: optionsSetup.textFontSizeX,
+            fontWeight: optionsSetup.textFontWeightX,
+            fontStyle: optionsSetup.textFontStyleX,
+            fontFamily: optionsSetup.textFontFamilyX,
+          },
         },
-        type: "category",
-        boundaryGap: optionsSetup.boundaryX, // 值居中
         axisLine: {
           //x轴线
-          show: optionsSetup.lineX,
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
           },
         },
         axisTick: {
           // 刻度
-          show: optionsSetup.tickLineX,
-        },
-        axisLabel: {
-          // X轴数据
-          show: true,
-          interval: optionsSetup.splitNumberX,
-          textStyle: {
-            color: optionsSetup.colorX,
-            fontSize: optionsSetup.fontSizeX,
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
           },
         },
       };
@@ -360,21 +377,25 @@ export default {
         show: optionsSetup.isShowX,
         type: "category",
         position: "top",
-        boundaryGap: optionsSetup.boundaryX, // 值居中
+        boundaryGap: true, // 值居中
+        axisLabel: {
+          show: false,
+        },
         axisLine: {
-          // x轴线
-          show: optionsSetup.lineX,
+          //x轴线
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
           },
         },
         axisTick: {
           // 刻度
-          show: optionsSetup.tickLineX,
-        },
-        axisLabel: {
-          show: false,
-          interval: optionsSetup.splitNumberX,
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
+          },
         },
       };
       this.options.xAxis[0] = xAxis0;
@@ -388,35 +409,52 @@ export default {
         gridIndex: 0,
         splitNumber: optionsSetup.splitNumberYTop,
         show: optionsSetup.isShowYTop,
-        scale: optionsSetup.scaleYTop, // 缩放
-        name: optionsSetup.textNameY, // 坐标轴名称
+        // 缩放
+        scale: optionsSetup.scaleYTop,
+        position: optionsSetup.positionYTop,
+        offset: optionsSetup.offsetYTop,
+        // 坐标轴名称
+        name: optionsSetup.textNameY,
+        nameLocation: "end",
         nameTextStyle: {
           color: optionsSetup.nameColorY,
           fontSize: optionsSetup.nameFontSizeY,
+          fontWeight: optionsSetup.nameFontWeightY,
+          fontStyle: optionsSetup.nameFontStyleY,
+          fontFamily: optionsSetup.nameFontFamilyY,
         },
         axisLabel: {
-          show: true,
+          show: optionsSetup.isShowAxisLabelYTop,
+          rotate: optionsSetup.textAngleYTop,
           textStyle: {
-            color: optionsSetup.colorYTop,
-            fontSize: optionsSetup.fontSizeYTop,
+            color: optionsSetup.textColorYTop,
+            fontSize: optionsSetup.textFontSizeYTop,
+            fontWeight: optionsSetup.textFontWeightYTop,
+            fontStyle: optionsSetup.textFontStyleYTop,
+            fontFamily: optionsSetup.textFontFamilyYTop,
           },
         },
-        axisTick: {
-          // 刻度
-          show: optionsSetup.tickLineYTop,
-        },
         axisLine: {
           // 轴线
-          show: optionsSetup.lineYTop,
+          show: optionsSetup.isShowAxisLineYTop,
+          lineStyle: {
+            color: optionsSetup.lineColorYTop,
+            width: optionsSetup.lineWidthYTop,
+          },
+        },
+        axisTick: {
+          // 刻度
+          show: optionsSetup.isShowAxisLineYTop,
           lineStyle: {
             color: optionsSetup.lineColorYTop,
+            width: optionsSetup.lineWidthYTop,
           },
         },
         splitLine: {
-          show: optionsSetup.splitLineYTop,
+          show: optionsSetup.isShowSplitLineYTop,
           lineStyle: {
-            width: optionsSetup.splitLineFontWidthYTop,
             color: optionsSetup.splitLineColorYTop,
+            width: optionsSetup.splitLineWidthYTop,
           },
         },
         axisPointer: {
@@ -433,36 +471,51 @@ export default {
         gridIndex: 1,
         splitNumber: optionsSetup.splitNumberYBottom,
         show: optionsSetup.isShowYBottom,
-        scale: optionsSetup.scaleYBottom, // 缩放
-        name: optionsSetup.textNameY, // 坐标轴名称
+        // 缩放
+        scale: optionsSetup.scaleYBottom,
+        // 坐标轴名称
+        name: optionsSetup.textNameY,
+        nameLocation: "end",
         nameTextStyle: {
           color: optionsSetup.nameColorY,
           fontSize: optionsSetup.nameFontSizeY,
+          fontWeight: optionsSetup.nameFontWeightY,
+          fontStyle: optionsSetup.nameFontStyleY,
+          fontFamily: optionsSetup.nameFontFamilyY,
         },
         inverse: true, // 翻转
         axisLabel: {
-          show: true,
+          show: optionsSetup.isShowAxisLabelYBottom,
+          rotate: optionsSetup.textAngleYBottom,
           textStyle: {
-            color: optionsSetup.colorYBottom,
-            fontSize: optionsSetup.fontSizeYBottom,
+            color: optionsSetup.textColorYBottom,
+            fontSize: optionsSetup.textFontSizeYBottom,
+            fontWeight: optionsSetup.textFontWeightYBottom,
+            fontStyle: optionsSetup.textFontStyleYBottom,
+            fontFamily: optionsSetup.textFontFamilyYBottom,
           },
         },
-        axisTick: {
-          // 刻度
-          show: optionsSetup.tickLineYBottom,
-        },
         axisLine: {
           // 轴线
-          show: optionsSetup.lineYBottom,
+          show: optionsSetup.isShowAxisLineYBottom,
+          lineStyle: {
+            color: optionsSetup.lineColorYBottom,
+            width: optionsSetup.lineWidthYBottom,
+          },
+        },
+        axisTick: {
+          // 刻度
+          show: optionsSetup.isShowAxisLineYBottom,
           lineStyle: {
             color: optionsSetup.lineColorYBottom,
+            width: optionsSetup.lineWidthYBottom,
           },
         },
         splitLine: {
-          show: optionsSetup.splitLineYBottom,
+          show: optionsSetup.isShowSplitLineYTop,
           lineStyle: {
-            width: optionsSetup.splitLineFontWidthYBottom,
             color: optionsSetup.splitLineColorYBottom,
+            width: optionsSetup.splitLineWidthYBottom,
           },
         },
         axisPointer: {
@@ -497,19 +550,23 @@ export default {
           position: "top",
           distance: optionsSetup.fontDistance,
           show: optionsSetup.isShow,
-          color: optionsSetup.dataColor,
+          color: optionsSetup.fontColor,
           fontSize: optionsSetup.fontSize,
           fontWeight: optionsSetup.fontWeight,
-          formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
+          formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+          fontStyle: optionsSetup.fontStyle,
+          fontFamily: optionsSetup.fontFamily,
         };
         series[1].label = {
           position: "bottom",
           distance: optionsSetup.fontDistance,
           show: optionsSetup.isShow,
-          color: optionsSetup.dataColor,
+          color: optionsSetup.fontColor,
           fontSize: optionsSetup.fontSize,
           fontWeight: optionsSetup.fontWeight,
-          formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
+          formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+          fontStyle: optionsSetup.fontStyle,
+          fontFamily: optionsSetup.fontFamily,
         };
       }
     },
@@ -573,17 +630,24 @@ export default {
     // 图例操作
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例名称设置
     setOptionsLegendName(name) {
@@ -650,10 +714,10 @@ export default {
       optionsData.dataType == "staticData"
         ? this.staticDataFn(optionsData.staticData, optionsSetup)
         : this.dynamicDataFn(
-            optionsData.dynamicData,
-            optionsData.refreshTime,
-            optionsSetup
-          );
+          optionsData.dynamicData,
+          optionsData.refreshTime,
+          optionsSetup
+        );
     },
     //去重
     setUnique(arr) {

+ 113 - 52
report-ui/src/views/bigscreenDesigner/designer/widget/line/widgetLineStackChart.vue

@@ -110,22 +110,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -135,33 +140,52 @@ export default {
       const xAxis = {
         type: "category",
         // 坐标轴是否显示
-        show: optionsSetup.hideX,
+        show: optionsSetup.isShowX,
+        position: optionsSetup.positionX,
+        offset: optionsSetup.offsetX,
         // 坐标轴名称
         name: optionsSetup.nameX,
+        nameLocation: optionsSetup.nameLocationX,
         nameTextStyle: {
           color: optionsSetup.nameColorX,
           fontSize: optionsSetup.nameFontSizeX,
+          fontWeight: optionsSetup.nameFontWeightX,
+          fontStyle: optionsSetup.nameFontStyleX,
+          fontFamily: optionsSetup.nameFontFamilyX,
         },
         // 轴反转
         inverse: optionsSetup.reversalX,
         axisLabel: {
-          show: true,
-          interval: optionsSetup.textInterval,
+          show: optionsSetup.isShowAxisLabelX,
+          interval: optionsSetup.textIntervalX,
           // 文字角度
           rotate: optionsSetup.textAngleX,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorX,
-            fontSize: optionsSetup.fontSizeX,
+            color: optionsSetup.textColorX,
+            fontSize: optionsSetup.textFontSizeX,
+            fontWeight: optionsSetup.textFontWeightX,
+            fontStyle: optionsSetup.textFontStyleX,
+            fontFamily: optionsSetup.textFontFamilyX,
           },
         },
+        // X轴线
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
+          },
+        },
+        // X轴刻度线
+        axisTick: {
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
             width: optionsSetup.lineWidthX,
           },
         },
+        // X轴分割线
         splitLine: {
           show: optionsSetup.isShowSplitLineX,
           lineStyle: {
@@ -183,26 +207,43 @@ export default {
         splitNumber: optionsSetup.splitNumberY,
         // 坐标轴是否显示
         show: optionsSetup.isShowY,
+        position: optionsSetup.positionY,
+        offset: optionsSetup.offsetY,
         // 坐标轴名称
         name: optionsSetup.textNameY,
+        nameLocation: optionsSetup.nameLocationY,
         nameTextStyle: {
           color: optionsSetup.nameColorY,
           fontSize: optionsSetup.nameFontSizeY,
+          fontWeight: optionsSetup.nameFontWeightY,
+          fontStyle: optionsSetup.nameFontStyleY,
+          fontFamily: optionsSetup.nameFontFamilyY,
         },
         // 轴反转
         inverse: optionsSetup.reversalY,
         axisLabel: {
-          show: true,
+          show: optionsSetup.isShowAxisLabelY,
           // 文字角度
           rotate: optionsSetup.textAngleY,
+          //interval: optionsSetup.textIntervalY,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorY,
-            fontSize: optionsSetup.fontSizeY,
+            color: optionsSetup.textColorY,
+            fontSize: optionsSetup.textFontSizeY,
+            fontWeight: optionsSetup.textFontWeightY,
+            fontStyle: optionsSetup.textFontStyleY,
+            fontFamily: optionsSetup.textFontFamilyY,
           },
         },
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineY,
+          lineStyle: {
+            color: optionsSetup.lineColorY,
+            width: optionsSetup.lineWidthY,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.isShowAxisLineY,
           lineStyle: {
             color: optionsSetup.lineColorY,
             width: optionsSetup.lineWidthY,
@@ -243,8 +284,11 @@ export default {
           type: optionsSetup.tooltipAxisPointerType,
         },
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -264,17 +308,24 @@ export default {
     // 图例操作 legend
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例名称设置
     setOptionsLegendName(name) {
@@ -401,9 +452,11 @@ export default {
             position: optionsSetup.fontPosition,
             distance: optionsSetup.fontDistance,
             fontSize: optionsSetup.fontSize,
-            color: optionsSetup.dataColor,
+            color: optionsSetup.fontColor,
             fontWeight: optionsSetup.fontWeight,
-            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyle,
+            fontFamily: optionsSetup.fontFamily,
           },
         });
         legendName.push(yAxisList[i]);
@@ -421,16 +474,19 @@ export default {
         this.options.yAxis.type = "value";
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisList.length) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisList.length) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {
@@ -516,9 +572,11 @@ export default {
               position: optionsSetup.fontPosition,
               distance: optionsSetup.fontDistance,
               fontSize: optionsSetup.fontSize,
-              color: optionsSetup.dataColor,
+              color: optionsSetup.fontColor,
               fontWeight: optionsSetup.fontWeight,
-              formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
+              formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+              fontStyle: optionsSetup.fontStyle,
+              fontFamily: optionsSetup.fontFamily,
             },
           });
         }
@@ -526,16 +584,19 @@ export default {
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
       const xAxisDataLength = val.length !== 0 ? val.xAxis.length : 1;
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {

+ 113 - 52
report-ui/src/views/bigscreenDesigner/designer/widget/line/widgetLinechart.vue

@@ -124,22 +124,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -149,33 +154,52 @@ export default {
       const xAxis = {
         type: "category",
         // 坐标轴是否显示
-        show: optionsSetup.hideX,
+        show: optionsSetup.isShowX,
+        position: optionsSetup.positionX,
+        offset: optionsSetup.offsetX,
         // 坐标轴名称
         name: optionsSetup.nameX,
+        nameLocation: optionsSetup.nameLocationX,
         nameTextStyle: {
           color: optionsSetup.nameColorX,
           fontSize: optionsSetup.nameFontSizeX,
+          fontWeight: optionsSetup.nameFontWeightX,
+          fontStyle: optionsSetup.nameFontStyleX,
+          fontFamily: optionsSetup.nameFontFamilyX,
         },
         // 轴反转
         inverse: optionsSetup.reversalX,
         axisLabel: {
-          show: true,
-          interval: optionsSetup.textInterval,
+          show: optionsSetup.isShowAxisLabelX,
+          interval: optionsSetup.textIntervalX,
           // 文字角度
           rotate: optionsSetup.textAngleX,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorX,
-            fontSize: optionsSetup.fontSizeX,
+            color: optionsSetup.textColorX,
+            fontSize: optionsSetup.textFontSizeX,
+            fontWeight: optionsSetup.textFontWeightX,
+            fontStyle: optionsSetup.textFontStyleX,
+            fontFamily: optionsSetup.textFontFamilyX,
           },
         },
+        // X轴线
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+            width: optionsSetup.lineWidthX,
+          },
+        },
+        // X轴刻度线
+        axisTick: {
+          show: optionsSetup.isShowAxisLineX,
           lineStyle: {
             color: optionsSetup.lineColorX,
             width: optionsSetup.lineWidthX,
           },
         },
+        // X轴分割线
         splitLine: {
           show: optionsSetup.isShowSplitLineX,
           lineStyle: {
@@ -197,26 +221,43 @@ export default {
         splitNumber: optionsSetup.splitNumberY,
         // 坐标轴是否显示
         show: optionsSetup.isShowY,
+        position: optionsSetup.positionY,
+        offset: optionsSetup.offsetY,
         // 坐标轴名称
         name: optionsSetup.textNameY,
+        nameLocation: optionsSetup.nameLocationY,
         nameTextStyle: {
           color: optionsSetup.nameColorY,
           fontSize: optionsSetup.nameFontSizeY,
+          fontWeight: optionsSetup.nameFontWeightY,
+          fontStyle: optionsSetup.nameFontStyleY,
+          fontFamily: optionsSetup.nameFontFamilyY,
         },
         // 轴反转
         inverse: optionsSetup.reversalY,
         axisLabel: {
-          show: true,
+          show: optionsSetup.isShowAxisLabelY,
           // 文字角度
           rotate: optionsSetup.textAngleY,
+          //interval: optionsSetup.textIntervalY,
           textStyle: {
             // 坐标文字颜色
-            color: optionsSetup.colorY,
-            fontSize: optionsSetup.fontSizeY,
+            color: optionsSetup.textColorY,
+            fontSize: optionsSetup.textFontSizeY,
+            fontWeight: optionsSetup.textFontWeightY,
+            fontStyle: optionsSetup.textFontStyleY,
+            fontFamily: optionsSetup.textFontFamilyY,
           },
         },
         axisLine: {
-          show: true,
+          show: optionsSetup.isShowAxisLineY,
+          lineStyle: {
+            color: optionsSetup.lineColorY,
+            width: optionsSetup.lineWidthY,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.isShowAxisLineY,
           lineStyle: {
             color: optionsSetup.lineColorY,
             width: optionsSetup.lineWidthY,
@@ -242,8 +283,11 @@ export default {
           type: optionsSetup.tooltipAxisPointerType,
         },
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -263,17 +307,24 @@ export default {
     // 图例
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom = optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例名称设置
     setOptionsLegendName(name) {
@@ -365,24 +416,29 @@ export default {
             position: optionsSetup.fontPosition,
             distance: optionsSetup.fontDistance,
             fontSize: optionsSetup.fontSize,
-            color: optionsSetup.dataColor,
+            color: optionsSetup.fontColor,
             fontWeight: optionsSetup.fontWeight,
-            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyle,
+            fontFamily: optionsSetup.fontFamily,
           };
           series[i].data = data;
         }
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / axis.length) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {
@@ -462,9 +518,11 @@ export default {
             position: optionsSetup.fontPosition,
             distance: optionsSetup.fontDistance,
             fontSize: optionsSetup.fontSize,
-            color: optionsSetup.dataColor,
+            color: optionsSetup.fontColor,
             fontWeight: optionsSetup.fontWeight,
-            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
+            formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}',
+            fontStyle: optionsSetup.fontStyle,
+            fontFamily: optionsSetup.fontFamily,
           };
           obj.data = val.series[i].data;
           series.push(obj);
@@ -472,16 +530,19 @@ export default {
       }
       // 根据图表的宽度 x轴的字体大小、长度来估算X轴的label能展示多少个字
       const xAxisDataLength = val.length !== 0 ? val.xAxis.length : 1;
-      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.fontSizeX);
+      const rowsNum = optionsSetup.textRowsNum !== "" ? optionsSetup.textRowsNum : parseInt((this.optionsStyle.width / xAxisDataLength) / optionsSetup.textFontSizeX);
       const axisLabel = {
-        show: true,
-        interval: optionsSetup.textInterval,
+        show: optionsSetup.isShowAxisLabelX,
+        interval: optionsSetup.textIntervalX,
         // 文字角度
         rotate: optionsSetup.textAngleX,
         textStyle: {
           // 坐标文字颜色
-          color: optionsSetup.colorX,
-          fontSize: optionsSetup.fontSizeX,
+          color: optionsSetup.textColorX,
+          fontSize: optionsSetup.textFontSizeX,
+          fontWeight: optionsSetup.textFontWeightX,
+          fontStyle: optionsSetup.textFontStyleX,
+          fontFamily: optionsSetup.textFontFamilyX,
         },
         // 自动换行
         formatter: function (value, index) {

+ 81 - 30
report-ui/src/views/bigscreenDesigner/designer/widget/map/widgetBarMap.vue

@@ -7,6 +7,42 @@
 import {targetWidgetLinkageLogic} from "@/views/bigscreenDesigner/designer/linkageLogic";
 
 import "../../../../../../node_modules/echarts/map/js/china.js";
+import "../../../../../../node_modules/echarts/map/js/world.js";
+import "../../../../../../node_modules/echarts/map/js/province/anhui";
+import "../../../../../../node_modules/echarts/map/js/province/aomen";
+import "../../../../../../node_modules/echarts/map/js/province/beijing";
+import "../../../../../../node_modules/echarts/map/js/province/chongqing";
+import "../../../../../../node_modules/echarts/map/js/province/fujian";
+import "../../../../../../node_modules/echarts/map/js/province/gansu";
+import "../../../../../../node_modules/echarts/map/js/province/guangxi";
+import "../../../../../../node_modules/echarts/map/js/province/guizhou";
+import "../../../../../../node_modules/echarts/map/js/province/hainan";
+import "../../../../../../node_modules/echarts/map/js/province/hebei";
+import "../../../../../../node_modules/echarts/map/js/province/heilongjiang";
+import "../../../../../../node_modules/echarts/map/js/province/henan";
+import "../../../../../../node_modules/echarts/map/js/province/hubei";
+import "../../../../../../node_modules/echarts/map/js/province/hunan";
+import "../../../../../../node_modules/echarts/map/js/province/jiangsu";
+import "../../../../../../node_modules/echarts/map/js/province/jiangxi";
+import "../../../../../../node_modules/echarts/map/js/province/jilin";
+import "../../../../../../node_modules/echarts/map/js/province/liaoning";
+import "../../../../../../node_modules/echarts/map/js/province/neimenggu";
+import "../../../../../../node_modules/echarts/map/js/province/ningxia";
+import "../../../../../../node_modules/echarts/map/js/province/qinghai";
+import "../../../../../../node_modules/echarts/map/js/province/shandong";
+import "../../../../../../node_modules/echarts/map/js/province/shanghai";
+import "../../../../../../node_modules/echarts/map/js/province/shanxi";
+import "../../../../../../node_modules/echarts/map/js/province/shanxi1";
+import "../../../../../../node_modules/echarts/map/js/province/sichuan";
+import "../../../../../../node_modules/echarts/map/js/province/taiwan";
+import "../../../../../../node_modules/echarts/map/js/province/tianjin";
+import "../../../../../../node_modules/echarts/map/js/province/xianggang";
+import "../../../../../../node_modules/echarts/map/js/province/xinjiang";
+import "../../../../../../node_modules/echarts/map/js/province/xizang";
+import "../../../../../../node_modules/echarts/map/js/province/yunnan";
+import "../../../../../../node_modules/echarts/map/js/province/zhejiang";
+
+
 import {conversionProvince} from "@/utils/china";
 import echarts from "echarts";
 
@@ -73,7 +109,7 @@ export default {
                   ],
                   false
                 ),
-                borderWidth: 3,
+                borderWidth: 1,
                 shadowColor: "rgba(10,76,139,1)",
                 shadowOffsetY: 0,
                 shadowBlur: 60,
@@ -318,6 +354,7 @@ export default {
     // 修改图标options属性
     editorOptions() {
       this.setOptionsTitle();
+      this.setOptionsGeo();
       this.setOptionsTooltip();
       this.setOptionsMap();
       this.setOptionsData();
@@ -325,22 +362,27 @@ export default {
     // 标题设置
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -349,11 +391,13 @@ export default {
       const optionsSetup = this.optionsSetup;
       const tooltip = {
         trigger: "item",
-        show: true,
-        enterable: true,
+        show: optionsSetup.isShowTooltip,
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
         formatter: function (params) {
           if (params.seriesType == 'scatter') {
@@ -365,6 +409,10 @@ export default {
       };
       this.options.tooltip = tooltip;
     },
+    setOptionsGeo(){
+      this.options.geo[0]['map'] = this.optionsSetup.mapName == ''? "china" : this.optionsSetup.mapName;
+      this.options.series[0]['map'] = this.optionsSetup.mapName == ''? "china" : this.optionsSetup.mapName;
+    },
     // 地图设置
     setOptionsMap() {
       const optionsSetup = this.optionsSetup;
@@ -374,8 +422,11 @@ export default {
           position: "right",
           // 地图省市区显隐
           show: optionsSetup.isShowMap,
-          color: optionsSetup.colorMap,
-          fontSize: optionsSetup.fontSizeMap,
+          color: optionsSetup.fontColor,
+          fontSize: optionsSetup.fontSize,
+          fontWeight: optionsSetup.fontWeight,
+          fontStyle: optionsSetup.fontStyle,
+          fontFamily: optionsSetup.fontFamily,
         },
         emphasis: {
           show: false,
@@ -401,7 +452,7 @@ export default {
             ],
           },
           borderColor: optionsSetup.borderColor,
-          borderWidth: 1,
+          borderWidth: optionsSetup.borderWidth,
         },
         //鼠标放置颜色加深
         emphasis: {
@@ -500,6 +551,7 @@ export default {
               },
               fontWeight: optionsSetup.fontDataWeight,
               fontStyle: optionsSetup.fontDataStyle,
+              fontFamily: optionsSetup.fontDataFamily,
             },
           },
           position: "top"
@@ -538,6 +590,7 @@ export default {
           },
           fontWeight: optionsSetup.fontTextWeight,
           fontStyle: optionsSetup.fontTextStyle,
+          fontFamily: optionsSetup.fontTextFamily,
           distance: 10,
         },
         symbol: 'circle',
@@ -653,7 +706,6 @@ export default {
       for (const i in val) {
         arrColor.push(customColor[i % customColor.length].color)
       }
-
       this.options.series[1] = this.getOptionsBarTrunk(optionsSetup, arrColor, allData, heightRate);
       this.options.series[2] = this.getOptionsBarTop(optionsSetup, arrColor, allData, heightRate);
       this.options.series[3] = this.getOptionsBarBottom(optionsSetup, arrColor, allData);
@@ -711,11 +763,10 @@ export default {
       for (const i in val) {
         arrColor.push(customColor[i % customColor.length].color)
       }
-
-      this.$set(this.options.series,1,this.getOptionsBarTrunk(optionsSetup, arrColor, allData, heightRate))
-      this.$set(this.options.series,2,this.getOptionsBarTop(optionsSetup, arrColor, allData, heightRate))
-      this.$set(this.options.series,3,this.getOptionsBarBottom(optionsSetup, arrColor, allData))
-      this.$set(this.options.series,4,this.getOptionsBarBottomOut(optionsSetup, arrColor, allData))
+      this.$set(this.options.series, 1, this.getOptionsBarTrunk(optionsSetup, arrColor, allData, heightRate))
+      this.$set(this.options.series, 2, this.getOptionsBarTop(optionsSetup, arrColor, allData, heightRate))
+      this.$set(this.options.series, 3, this.getOptionsBarBottom(optionsSetup, arrColor, allData))
+      this.$set(this.options.series, 4, this.getOptionsBarBottomOut(optionsSetup, arrColor, allData))
     },
   },
 };

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

@@ -111,7 +111,7 @@ export default {
             },
             detail: {
               valueAnimation: true,
-              formatter: function(value) {
+              formatter: function (value) {
                 const max = series[0].max; // 获取最大值
                 const formattedValue = (value / max * 100).toFixed(0); // 计算格式化后的数值
                 return formattedValue + ' %'; // 拼接百分号
@@ -173,13 +173,42 @@ export default {
   },
   methods: {
     editorOptions() {
+      this.setOptionsTitle();
       this.setOptions();
       this.setOptionsData();
     },
+    // 标题修改
+    setOptionsTitle() {
+      const optionsSetup = this.optionsSetup;
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
+      };
+      this.options.title = title;
+    },
     setOptions() {
       const optionsSetup = this.optionsSetup;
       const series = this.options.series;
       if (series[0].type == "gauge") {
+        // 轴线相关
         const axisLine = {
           show: optionsSetup.ringShow,
           lineStyle: {
@@ -239,24 +268,30 @@ export default {
             ],
           },
         };
+        // 刻度线
         const axisTick = {
           show: optionsSetup.tickShow,
-          distance: optionsSetup.tickDistance,
+          splitNumber: optionsSetup.tickSplitNumber,
+          //distance: optionsSetup.tickDistance, echartsV5.0.0开始支持
           length: optionsSetup.tickLength,
           lineStyle: {
             color: "auto",
             width: optionsSetup.tickWidth,
+            type: optionsSetup.tickType,
           },
         };
+        // 分隔线-指标线
         const splitLine = {
           show: optionsSetup.splitShow,
-          distance: optionsSetup.splitDistance,
+          // distance: optionsSetup.splitDistance,echartsV5.0.0开始支持
           length: optionsSetup.splitLength,
           lineStyle: {
             color: "auto",
             width: optionsSetup.splitWidth,
+            type: optionsSetup.splitType,
           },
         };
+        // 刻度标签
         const axisLabel = {
           show: optionsSetup.labelShow,
           color: optionsSetup.labelColor,
@@ -264,18 +299,26 @@ export default {
           fontSize: optionsSetup.labelFontSize,
           fontWeight: optionsSetup.labelFontWeight,
           fontStyle: optionsSetup.labelFontStyle,
+          fontFamily: optionsSetup.labelFontFamily,
         };
         const detail = {
-          valueAnimation: true,
-          formatter: function(value) {
+          show: optionsSetup.isShow,
+          //valueAnimation: true, echartsV5.0.0开始支持
+          formatter: function (value) {
             const max = series[0].max; // 获取最大值
             const formattedValue = (value / max * 100).toFixed(0); // 计算格式化后的数值
-            return formattedValue + ' %'; // 拼接百分号
+            // 拼接百分号
+            if (optionsSetup.percentage) {
+              return formattedValue + ' %';
+            } else {
+              return formattedValue;
+            }
           },
           color: optionsSetup.detailColor,
           fontSize: optionsSetup.detailFontSize,
           fontWeight: optionsSetup.detailFontWeight,
           fontStyle: optionsSetup.detailFontStyle,
+          fontFamily: optionsSetup.detailFontFamily,
         };
         series[0].axisLine = axisLine;
         series[0].axisTick = axisTick;
@@ -283,6 +326,9 @@ export default {
         series[0].axisLabel = axisLabel;
         series[0].detail = detail;
         series[0].max = optionsSetup.maxValue;
+        series[0].startAngle = optionsSetup.startAngle;
+        series[0].endAngle = optionsSetup.endAngle;
+        series[0].clockwise = optionsSetup.clockwise;
       }
     },
     setOptionsData(e, paramsConfig) {

+ 17 - 171
report-ui/src/views/bigscreenDesigner/designer/widget/percent/widgetPiePercentageChart.vue

@@ -1,11 +1,12 @@
 <template>
   <div :style="styleObj">
-    <v-chart ref="myVChart" :options="options" autoresize />
+    <v-chart ref="myVChart" :options="options" autoresize/>
   </div>
 </template>
 
 <script>
-import { targetWidgetLinkageLogic } from "@/views/bigscreenDesigner/designer/linkageLogic";
+import {targetWidgetLinkageLogic} from "@/views/bigscreenDesigner/designer/linkageLogic";
+
 let per = 60;
 export default {
   name: "widgetPiePercentageChart", //百分比图参考:https://www.makeapie.com/editor.html?c=xFkzKG-bpl
@@ -71,152 +72,6 @@ export default {
           selectedMode: false,
         },
         series: [
-          {
-            //name: '环1',
-            type: "custom",
-            coordinateSystem: "none",
-            renderItem: (params, api) => {
-              return {
-                type: "arc",
-                shape: {
-                  cx: api.getWidth() / 2,
-                  cy: api.getHeight() / 2,
-                  r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.6,
-                  startAngle: ((0 + this.angle) * Math.PI) / 180,
-                  endAngle: ((90 + this.angle) * Math.PI) / 180,
-                },
-                style: {
-                  stroke: "#0CD3DB",
-                  fill: "transparent",
-                  lineWidth: 1.5,
-                },
-                silent: true,
-              };
-            },
-            data: [0],
-          },
-          {
-            //name: '环2',
-            type: "custom",
-            coordinateSystem: "none",
-            renderItem: (params, api) => {
-              return {
-                type: "arc",
-                shape: {
-                  cx: api.getWidth() / 2,
-                  cy: api.getHeight() / 2,
-                  r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.6,
-                  startAngle: ((180 + this.angle) * Math.PI) / 180,
-                  endAngle: ((270 + this.angle) * Math.PI) / 180,
-                },
-                style: {
-                  stroke: "#0CD3DB",
-                  fill: "transparent",
-                  lineWidth: 1.5,
-                },
-                silent: true,
-              };
-            },
-            data: [0],
-          },
-          {
-            //name: '环3',
-            type: "custom",
-            coordinateSystem: "none",
-            renderItem: (params, api) => {
-              return {
-                type: "arc",
-                shape: {
-                  cx: api.getWidth() / 2,
-                  cy: api.getHeight() / 2,
-                  r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65,
-                  startAngle: ((270 + -this.angle) * Math.PI) / 180,
-                  endAngle: ((40 + -this.angle) * Math.PI) / 180,
-                },
-                style: {
-                  stroke: "#0CD3DB",
-                  fill: "transparent",
-                  lineWidth: 1.5,
-                },
-                silent: true,
-              };
-            },
-            data: [0],
-          },
-          {
-            //name: '环4',
-            type: "custom",
-            coordinateSystem: "none",
-            renderItem: (params, api) => {
-              return {
-                type: "arc",
-                shape: {
-                  cx: api.getWidth() / 2,
-                  cy: api.getHeight() / 2,
-                  r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65,
-                  startAngle: ((90 + -this.angle) * Math.PI) / 180,
-                  endAngle: ((220 + -this.angle) * Math.PI) / 180,
-                },
-                style: {
-                  stroke: "#0CD3DB",
-                  fill: "transparent",
-                  lineWidth: 1.5,
-                },
-                silent: true,
-              };
-            },
-            data: [0],
-          },
-          {
-            //name: '绿点1',
-            type: "custom",
-            coordinateSystem: "none",
-            renderItem: (params, api) => {
-              let x0 = api.getWidth() / 2;
-              let y0 = api.getHeight() / 2;
-              let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65;
-              let point = this.getCirlPoint(x0, y0, r, 90 + -this.angle);
-              return {
-                type: "circle",
-                shape: {
-                  cx: point.x,
-                  cy: point.y,
-                  r: 4,
-                },
-                style: {
-                  stroke: "#0CD3DB", //粉
-                  fill: "#0CD3DB",
-                },
-                silent: true,
-              };
-            },
-            data: [0],
-          },
-          {
-            //name: '绿点2',
-            type: "custom",
-            coordinateSystem: "none",
-            renderItem: (params, api) => {
-              let x0 = api.getWidth() / 2;
-              let y0 = api.getHeight() / 2;
-              let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65;
-              let point = this.getCirlPoint(x0, y0, r, 270 + -this.angle);
-              return {
-                type: "circle",
-                shape: {
-                  cx: point.x,
-                  cy: point.y,
-                  r: 4,
-                },
-                style: {
-                  stroke: "#0CD3DB", //绿
-                  fill: "#0CD3DB",
-                },
-                silent: true,
-              };
-            },
-            data: [0],
-          },
           {
             //name: '圆环',
             type: "pie",
@@ -354,22 +209,9 @@ export default {
     this.editorOptions();
   },
   mounted() {
-    /*        setInterval(() => {
-              this.angle = this.angle + 3
-              myChart.setOption(options,true)
-            }, 1000);*/
     targetWidgetLinkageLogic(this); // 联动-目标组件逻辑
   },
   methods: {
-    //轴point设置
-    getCirlPoint(x0, y0, r, x) {
-      let x1 = x0 + r * Math.cos((x * Math.PI) / 180);
-      let y1 = y0 + r * Math.sin((x * Math.PI) / 180);
-      return {
-        x: x1,
-        y: y1,
-      };
-    },
     editorOptions() {
       this.setOptionsTitle();
       this.setOptionsColor();
@@ -384,14 +226,18 @@ export default {
       title.y = "center";
       const rich = {
         nums: {
-          fontSize: optionsSetup.textNumFontSize,
           color: optionsSetup.textNumColor,
+          fontSize: optionsSetup.textNumFontSize,
           fontWeight: optionsSetup.textNumFontWeight,
+          fontStyle: optionsSetup.textNumFontStyle,
+          fontFamily: optionsSetup.textNumFontFamily,
         },
         percent: {
-          fontSize: optionsSetup.textPerFontSize,
           color: optionsSetup.textPerColor,
+          fontSize: optionsSetup.textPerFontSize,
           fontWeight: optionsSetup.textPerFontWeight,
+          fontStyle: optionsSetup.textPerFontStyle,
+          fontFamily: optionsSetup.textPerFontFamily,
         },
       };
       title.textStyle["rich"] = rich;
@@ -400,7 +246,7 @@ export default {
     //圆环0-100%颜色
     setOptionsColor() {
       const optionsSetup = this.optionsSetup;
-      const itemStyle = this.options.series[6]["data"][0]["itemStyle"];
+      const itemStyle = this.options.series[0]["data"][0]["itemStyle"];
       const normal = {
         color: {
           // 完成的圆环的颜色
@@ -419,7 +265,7 @@ export default {
       itemStyle["normal"] = normal;
     },
     setOptionSurplusColor() {
-      const itemStyle = this.options.series[6]["data"][1]["itemStyle"];
+      const itemStyle = this.options.series[0]["data"][1]["itemStyle"];
       const normal = {
         color: this.optionsSetup.colorsurplus,
       };
@@ -427,8 +273,8 @@ export default {
     },
     setOptionLine() {
       const optionsSetup = this.optionsSetup;
-      const line = this.options.series[7]["splitLine"];
-      const num = this.options.series[7];
+      const line = this.options.series[1]["splitLine"];
+      const num = this.options.series[1];
       num.splitNumber = optionsSetup.lineNumber;
       line.length = optionsSetup.lineLength;
       const lineStyle = {
@@ -465,8 +311,8 @@ export default {
       const title = this.options.title;
       const num = val[0]["num"];
       title.text = "{nums|" + num + "}{percent|%}";
-      this.options.series[6]["data"][0]["value"] = num;
-      this.options.series[6]["data"][1]["value"] = 100 - num;
+      this.options.series[0]["data"][0]["value"] = num;
+      this.options.series[0]["data"][1]["value"] = 100 - num;
     },
     dynamicDataFn(val, refreshTime) {
       if (!val) return;
@@ -483,8 +329,8 @@ export default {
       const data = this.queryEchartsData(val);
       data.then((res) => {
         this.options.title.text = "{nums|" + res[0].value + "}{percent|%}";
-        this.options.series[6]["data"][0]["value"] = res[0].value;
-        this.options.series[6]["data"][1]["value"] = 100 - res[0].value;
+        this.options.series[0]["data"][0]["value"] = res[0].value;
+        this.options.series[0]["data"][1]["value"] = 100 - res[0].value;
       });
     },
   },

+ 117 - 68
report-ui/src/views/bigscreenDesigner/designer/widget/pie/widgetPieNightingaleRose.vue

@@ -1,6 +1,6 @@
 <template>
   <div :style="styleObj">
-    <v-chart ref="myVChart" :options="options" autoresize />
+    <v-chart ref="myVChart" :options="options" autoresize/>
   </div>
 </template>
 
@@ -26,7 +26,7 @@ export default {
         toolbox: {
           show: true,
           feature: {
-            mark: { show: true },
+            mark: {show: true},
           },
         },
         series: [
@@ -90,108 +90,157 @@ export default {
     // 修改图标options属性
     editorOptions() {
       this.setOptionsTitle();
+      this.setOptionsPie();
       this.setOptionsValue();
       this.setOptionsTooltip();
       this.setOptionsLegend();
       this.setOptionsColor();
       this.setOptionsData();
-      this.setOptionsRosetype();
-    },
-    // 饼图模式 面积模式"area" 半径模式"radius"
-    setOptionsRosetype() {
-      this.options.series[0]["roseType"] = this.optionsSetup.nightingleRosetype;
     },
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
+    // 饼图设置
+    setOptionsPie() {
+      const optionsSetup = this.optionsSetup;
+      const series = {
+        type: "pie",
+        center: ["50%", "50%"],
+        left: optionsSetup.left,
+        top: optionsSetup.top,
+        right: optionsSetup.right,
+        bottom: optionsSetup.bottom,
+        // 饼图模式 面积模式"area" 半径模式"radius"//name: "面积模式",
+        roseType: optionsSetup.nightingaleRoseType,
+        radius: [optionsSetup.innerNumber + "%", optionsSetup.outerNumber + "%"],
+        clockwise: optionsSetup.clockwise,
+        startAngle: optionsSetup.startAngle,
+        minAngle: optionsSetup.minAngle,
+        minShowLabelAngle: optionsSetup.minShowLabelAngle,
+        percentPrecision: optionsSetup.percentPrecision,
+        // echarts v5.0.0开始支持
+        /*        itemStyle: {
+                  borderRadius: [optionsSetup.borderRadius + "%", optionsSetup.borderRadius + "%"],
+                },*/
+        // 高亮的扇区
+        emphasis: {
+          label: {
+            show: optionsSetup.isShowEmphasisLabel,
+            color: optionsSetup.emphasisLabelFontColor == '' ? null : optionsSetup.EmphasisLabelFontColor,
+            fontSize: optionsSetup.emphasisLabelFontSize,
+            fontWeight: optionsSetup.emphasisLabelFontWeight,
+            fontStyle: optionsSetup.emphasisLabelFontStyle,
+            fontFamily: optionsSetup.emphasisLabelFontFamily,
+          },
+          // 视觉引导线
+          labelLine: {
+            show: false,
+          },
+          // 色块描边
+          itemStyle: {
+            borderColor: optionsSetup.borderColor == '' ? null : optionsSetup.borderColor,
+            borderWidth: optionsSetup.borderWidth,
+            borderType: optionsSetup.borderType,
+            shadowBlur: optionsSetup.shadowBlur,
+            shadowColor: optionsSetup.shadowColor,
+          },
+        },
+      };
+      this.options.series[0] = series;
+    },
     // 数值设定
     setOptionsValue() {
       const optionsSetup = this.optionsSetup;
-      const series = this.options.series;
-      const numberValue = optionsSetup.numberValue ? "{c}" : "";
-      const percentage = optionsSetup.percentage ? "({d})%" : "";
+      const numberValue = optionsSetup.numberValue ? "\n{c}" : "";
+      const percentage = optionsSetup.percentage ? "\n({d}%)" : "";
       const label = {
         show: optionsSetup.isShow,
-        formatter: `{a|{b}:${numberValue} ${percentage}}`,
-        rich: {
-          a: {
-            padding: [-30, 15, -20, 15],
-            color: optionsSetup.dataColor,
-            fontSize: optionsSetup.fontSize,
-            fontWeight: optionsSetup.fontWeight,
-          },
-        },
+        position: optionsSetup.position,
+        rotate: optionsSetup.rotate,
+        formatter: `{b}${numberValue}${percentage}`,
+        padding: optionsSetup.padding,
         fontSize: optionsSetup.fontSize,
-
-        fontWeight: optionsSetup.optionsSetup,
+        color: optionsSetup.fontColor == '' ? null : optionsSetup.fontColor,
+        fontWeight: optionsSetup.fontWeight,
+        fontStyle: optionsSetup.fontStyle,
+        fontFamily: optionsSetup.fontFamily,
       };
-      for (const key in series) {
-        if (series[key].type == "pie") {
-          series[key].label = label;
-          series[key].labelLine = { show: optionsSetup.isShow };
+      // 引导线
+      const labelLine = {
+        show: optionsSetup.isShowLabelLine,
+        length: optionsSetup.labelLineLength,
+        length2: optionsSetup.labelLineLength2,
+        smooth: optionsSetup.labelLineSmooth,
+        lineStyle: {
+          color: optionsSetup.lineStyleColor == '' ? null : optionsSetup.lineStyleColor,
+          width: optionsSetup.lineStyleWidth,
+          type: optionsSetup.lineStyleType,
         }
       }
+      this.options.series[0].label = label;
+      this.options.series[0].labelLine = labelLine;
     },
     // tooltip 设置
     setOptionsTooltip() {
       const optionsSetup = this.optionsSetup;
       const tooltip = {
         trigger: "item",
-        show: true,
+        show: optionsSetup.isShowTooltip,
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
     },
-    // 边距设置
-    setOptionsMargin() {
-      const optionsSetup = this.optionsSetup;
-      const grid = {
-        left: optionsSetup.marginLeft,
-        right: optionsSetup.marginRight,
-        bottom: optionsSetup.marginBottom,
-        top: optionsSetup.marginTop,
-        containLabel: true,
-      };
-      this.options.grid = grid;
-    },
     // 图例操作 legend
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.right = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom =
-        optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例颜色修改
     setOptionsColor() {

+ 116 - 58
report-ui/src/views/bigscreenDesigner/designer/widget/pie/widgetPiechart.vue

@@ -1,6 +1,6 @@
 <template>
   <div :style="styleObj">
-    <v-chart ref="myVChart" :options="options" autoresize />
+    <v-chart ref="myVChart" :options="options" autoresize/>
   </div>
 </template>
 
@@ -9,6 +9,7 @@ import {
   originWidgetLinkageLogic,
   targetWidgetLinkageLogic,
 } from "@/views/bigscreenDesigner/designer/linkageLogic";
+
 export default {
   name: "WidgetPiechart",
   components: {},
@@ -95,79 +96,131 @@ export default {
     // 修改图标options属性
     editorOptions() {
       this.setOptionsTitle();
+      this.setOptionsPie();
       this.setOptionsValue();
       this.setOptionsTooltip();
       this.setOptionsLegend();
       this.setOptionsColor();
       this.setOptionsData();
-      this.setOptionsPiechartStyle();
-    },
-    // 饼图样式
-    setOptionsPiechartStyle() {
-      if (this.optionsSetup.piechartStyle == "shixin") {
-        this.options.series[0]["radius"] = "50%";
-      } else if (this.optionsSetup.piechartStyle == "kongxin") {
-        this.options.series[0]["radius"] = ["40%", "70%"];
-      } else {
-      }
     },
     // 标题设置
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
+    // 饼图设置
+    setOptionsPie() {
+      const optionsSetup = this.optionsSetup;
+      const series = {
+        type: "pie",
+        center: ["50%", "50%"],
+        left: optionsSetup.left,
+        top: optionsSetup.top,
+        right: optionsSetup.right,
+        bottom: optionsSetup.bottom,
+        radius: [optionsSetup.innerNumber + "%", optionsSetup.outerNumber + "%"],
+        clockwise: optionsSetup.clockwise,
+        startAngle: optionsSetup.startAngle,
+        minAngle: optionsSetup.minAngle,
+        minShowLabelAngle: optionsSetup.minShowLabelAngle,
+        percentPrecision: optionsSetup.percentPrecision,
+        // echarts v5.0.0开始支持
+        /*        itemStyle: {
+                  borderRadius: [optionsSetup.borderRadius + "%", optionsSetup.borderRadius + "%"],
+                },
+                */
+        // 高亮的扇区
+        emphasis: {
+          label: {
+            show: optionsSetup.isShowEmphasisLabel,
+            color: optionsSetup.emphasisLabelFontColor == '' ? null : optionsSetup.EmphasisLabelFontColor,
+            fontSize: optionsSetup.emphasisLabelFontSize,
+            fontWeight: optionsSetup.emphasisLabelFontWeight,
+            fontStyle: optionsSetup.emphasisLabelFontStyle,
+            fontFamily: optionsSetup.emphasisLabelFontFamily,
+          },
+          // 视觉引导线
+          labelLine: {
+            show: false,
+          },
+          // 色块描边
+          itemStyle: {
+            borderColor: optionsSetup.borderColor == '' ? null : optionsSetup.borderColor,
+            borderWidth: optionsSetup.borderWidth,
+            borderType: optionsSetup.borderType,
+            shadowBlur: optionsSetup.shadowBlur,
+            shadowColor: optionsSetup.shadowColor,
+          },
+        },
+      };
+      this.options.series[0] = series;
+    },
     // 数值设定
     setOptionsValue() {
       const optionsSetup = this.optionsSetup;
-      const series = this.options.series;
-      const numberValue = optionsSetup.numberValue ? "{c}" : "";
-      const percentage = optionsSetup.percentage ? "({d})%" : "";
+      const numberValue = optionsSetup.numberValue ? "\n{c}" : "";
+      const percentage = optionsSetup.percentage ? "\n({d}%)" : "";
       const label = {
         show: optionsSetup.isShow,
-        formatter: `{a|{b}:${numberValue} ${percentage}}`,
-        rich: {
-          a: {
-            padding: [-30, 15, -20, 15],
-            color: optionsSetup.dataColor,
-            fontSize: optionsSetup.fontSize,
-            fontWeight: optionsSetup.fontWeight,
-          },
-        },
+        position: optionsSetup.position,
+        rotate: optionsSetup.rotate,
+        formatter: `{b}${numberValue}${percentage}`,
+        padding: optionsSetup.padding,
         fontSize: optionsSetup.fontSize,
-        fontWeight: optionsSetup.optionsSetup,
+        color: optionsSetup.fontColor == '' ? null : optionsSetup.fontColor,
+        fontWeight: optionsSetup.fontWeight,
+        fontStyle: optionsSetup.fontStyle,
+        fontFamily: optionsSetup.fontFamily,
       };
-      for (const key in series) {
-        if (series[key].type == "pie") {
-          series[key].label = label;
-          series[key].labelLine = { show: optionsSetup.isShow };
+      // 引导线
+      const labelLine = {
+        show: optionsSetup.isShowLabelLine,
+        length: optionsSetup.labelLineLength,
+        length2: optionsSetup.labelLineLength2,
+        smooth: optionsSetup.labelLineSmooth,
+        lineStyle: {
+          color: optionsSetup.lineStyleColor == '' ? null : optionsSetup.lineStyleColor,
+          width: optionsSetup.lineStyleWidth,
+          type: optionsSetup.lineStyleType,
         }
       }
+      this.options.series[0].label = label;
+      this.options.series[0].labelLine = labelLine;
     },
     // 提示语设置 tooltip
     setOptionsTooltip() {
       const optionsSetup = this.optionsSetup;
       const tooltip = {
         trigger: "item",
+        show: optionsSetup.isShowTooltip,
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -175,19 +228,24 @@ export default {
     // 图例操作 legend
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
-      const legend = this.options.legend;
-      legend.show = optionsSetup.isShowLegend;
-      legend.left = optionsSetup.lateralPosition;
-      legend.right = optionsSetup.lateralPosition;
-      legend.top = optionsSetup.longitudinalPosition;
-      legend.bottom =
-        optionsSetup.longitudinalPosition;
-      legend.orient = optionsSetup.layoutFront;
-      legend.textStyle = {
-        color: optionsSetup.legendColor,
-        fontSize: optionsSetup.legendFontSize,
+      const legend = {
+        show: optionsSetup.isShowLegend,
+        left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
+        top: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
+        orient: optionsSetup.layoutFront,
+        textStyle: {
+          color: optionsSetup.legendColor,
+          fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
+        },
+        itemHeight: optionsSetup.legendHeight,
+        itemWidth: optionsSetup.legendWidth,
       };
-      legend.itemWidth = optionsSetup.legendWidth;
+      this.options.legend = legend;
     },
     // 图例颜色修改
     setOptionsColor() {

+ 44 - 26
report-ui/src/views/bigscreenDesigner/designer/widget/radar/widgetRadar.vue

@@ -78,22 +78,27 @@ export default {
     // 标题修改
     setOptionsTitle() {
       const optionsSetup = this.optionsSetup;
-      const title = {};
-      title.text = optionsSetup.titleText;
-      title.show = optionsSetup.isNoTitle;
-      title.left = optionsSetup.textAlign;
-      title.textStyle = {
-        color: optionsSetup.textColor,
-        fontSize: optionsSetup.textFontSize,
-        fontWeight: optionsSetup.textFontWeight,
-        fontStyle: optionsSetup.textFontStyle,
-      };
-      title.subtext = optionsSetup.subText;
-      title.subtextStyle = {
-        color: optionsSetup.subTextColor,
-        fontWeight: optionsSetup.subTextFontWeight,
-        fontSize: optionsSetup.subTextFontSize,
-        fontStyle: optionsSetup.subTextFontStyle,
+      const title = {
+        text: optionsSetup.text,
+        show: optionsSetup.isShowTitle,
+        left: optionsSetup.titleLeft,
+        top: optionsSetup.titleTop + "%",
+        itemGap: optionsSetup.titleItemGap,
+        textStyle: {
+          color: optionsSetup.textColor,
+          fontSize: optionsSetup.textFontSize,
+          fontWeight: optionsSetup.textFontWeight,
+          fontStyle: optionsSetup.textFontStyle,
+          fontFamily: optionsSetup.textFontFamily,
+        },
+        subtext: optionsSetup.subtext,
+        subtextStyle: {
+          color: optionsSetup.subtextColor,
+          fontWeight: optionsSetup.subtextFontWeight,
+          fontSize: optionsSetup.subtextFontSize,
+          fontStyle: optionsSetup.subtextFontStyle,
+          fontFamily: optionsSetup.subtextFontFamily
+        },
       };
       this.options.title = title;
     },
@@ -134,13 +139,18 @@ export default {
       const legend = {
         show: optionsSetup.isShowLegend,
         left: optionsSetup.lateralPosition,
+        //right: optionsSetup.lateralPosition,
         top: optionsSetup.longitudinalPosition,
-        bottom: optionsSetup.longitudinalPosition,
+        //bottom: optionsSetup.longitudinalPosition,
         orient: optionsSetup.layoutFront,
         textStyle: {
           color: optionsSetup.legendColor,
           fontSize: optionsSetup.legendFontSize,
+          fontWeight: optionsSetup.legendFontWeight,
+          fontStyle: optionsSetup.legendFontStyle,
+          fontFamily: optionsSetup.legendFontFamily,
         },
+        itemHeight: optionsSetup.legendHeight,
         itemWidth: optionsSetup.legendWidth,
       };
       this.options.legend = legend;
@@ -169,10 +179,13 @@ export default {
       const optionsSetup = this.optionsSetup;
       const tooltip = {
         trigger: "item",
-        show: true,
+        show: optionsSetup.isShowTooltip,
         textStyle: {
-          color: optionsSetup.tipsColor,
-          fontSize: optionsSetup.tipsFontSize,
+          color: optionsSetup.tooltipColor,
+          fontSize: optionsSetup.tooltipFontSize,
+          fontWeight: optionsSetup.tooltipFontWeight,
+          fontStyle: optionsSetup.tooltipFontStyle,
+          fontFamily: optionsSetup.tooltipFontFamily,
         },
       };
       this.options.tooltip = tooltip;
@@ -249,14 +262,17 @@ export default {
           value: values,
           label: {
             show: optionsSetup.isShow,
-            position: "top",
-            distance: 10,
+            position: optionsSetup.fontPosition,
+            distance: optionsSetup.fontDistance,
             fontSize: optionsSetup.fontSize,
-            color: optionsSetup.dataColor,
+            color: optionsSetup.fontColor == '' ? null : optionsSetup.fontColor,
             fontWeight: optionsSetup.fontWeight,
+            fontStyle: optionsSetup.fontStyle,
+            fontFamily: optionsSetup.fontFamily,
           },
           lineStyle: {
             normal: {
+              width: optionsSetup.lineWidth,
               type: optionsSetup.lineType,
               color: arrColor[i],
             },
@@ -331,11 +347,13 @@ export default {
           value: values,
           label: {
             show: optionsSetup.isShow,
-            position: "top",
-            distance: 10,
+            position: optionsSetup.fontPosition,
+            distance: optionsSetup.fontDistance,
             fontSize: optionsSetup.fontSize,
-            color: optionsSetup.dataColor,
+            color: optionsSetup.fontColor == '' ? null : optionsSetup.fontColor,
             fontWeight: optionsSetup.fontWeight,
+            fontStyle: optionsSetup.fontStyle,
+            fontFamily: optionsSetup.fontFamily,
           },
           lineStyle: {
             normal: {

部分文件因为文件数量过多而无法显示