Selaa lähdekoodia

Merge remote-tracking branch 'origin/devexcel' into devexcel

Raod 4 vuotta sitten
vanhempi
sitoutus
0c1a50212b
57 muutettua tiedostoa jossa 10265 lisäystä ja 7843 poistoa
  1. 1 0
      doc/docs/.vuepress/config.js
  2. 12 6
      doc/docs/guide/dashboard.md
  3. 17 0
      doc/docs/guide/importexport.md
  4. BIN
      doc/docs/picture/dashboard/img_14.png
  5. BIN
      doc/docs/picture/dashboard/img_18.png
  6. BIN
      doc/docs/picture/dashboard/img_19.png
  7. BIN
      doc/docs/picture/dashboard/img_20.png
  8. BIN
      doc/docs/picture/dashboard/img_21.png
  9. BIN
      doc/docs/picture/imexport/img.png
  10. BIN
      doc/docs/picture/imexport/img_1.png
  11. 3 0
      report-core/src/main/java/com/anjiplus/template/gaea/business/modules/dashboard/service/impl/ReportDashboardServiceImpl.java
  12. 1 1
      report-core/src/main/resources/db/migration/V1.0.10__create_report_share.sql
  13. 21 0
      report-core/src/main/resources/db/migration/V1.0.11__create_compare_table.sql
  14. 7 0
      report-ui/src/assets/styles/index.scss
  15. 3 5
      report-ui/src/mixins/queryform.js
  16. 17 12
      report-ui/src/views/report/bigscreen/designer/form/dynamicAddTable.vue
  17. 52 43
      report-ui/src/views/report/bigscreen/designer/index.vue
  18. 0 7612
      report-ui/src/views/report/bigscreen/designer/tools.js
  19. 382 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-airbubble-map.js
  20. 650 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-bar-compare.js
  21. 652 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-bar-stack.js
  22. 654 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-barchart.js
  23. 665 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-barlinechart.js
  24. 383 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-funnel.js
  25. 378 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-gauge.js
  26. 606 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-gradient-barchart.js
  27. 157 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-href.js
  28. 72 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-iframe.js
  29. 103 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-image.js
  30. 775 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-line-compare.js
  31. 672 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-line-stack.js
  32. 674 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-linechart.js
  33. 61 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-map.js
  34. 176 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-marquee.js
  35. 403 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-pie-nightingale.js
  36. 255 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-pie-percentage.js
  37. 403 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-piechart.js
  38. 87 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-slider.js
  39. 268 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-table.js
  40. 182 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-text.js
  41. 143 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-time.js
  42. 14 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-universal.js
  43. 72 0
      report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-video.js
  44. 85 0
      report-ui/src/views/report/bigscreen/designer/tools/index.js
  45. 63 0
      report-ui/src/views/report/bigscreen/designer/tools/main.js
  46. 161 75
      report-ui/src/views/report/bigscreen/designer/widget/bar/widgetBarCompareChart.vue
  47. 10 1
      report-ui/src/views/report/bigscreen/designer/widget/bar/widgetGradientColorBarchart.vue
  48. 662 0
      report-ui/src/views/report/bigscreen/designer/widget/line/widgetLineCompareChart.vue
  49. 0 1
      report-ui/src/views/report/bigscreen/designer/widget/line/widgetLineStackChart.vue
  50. 3 1
      report-ui/src/views/report/bigscreen/designer/widget/temp.vue
  51. 3 1
      report-ui/src/views/report/bigscreen/designer/widget/widget.vue
  52. 5 2
      report-ui/src/views/report/bigscreen/designer/widget/widgetBarchart.vue
  53. 19 24
      report-ui/src/views/report/bigscreen/designer/widget/widgetBarlinechart.vue
  54. 209 44
      report-ui/src/views/report/bigscreen/designer/widget/widgetGauge.vue
  55. 10 9
      report-ui/src/views/report/bigscreen/designer/widget/widgetLinechart.vue
  56. 13 5
      report-ui/src/views/report/bigscreen/designer/widget/widgetTable.vue
  57. 1 1
      report-ui/src/views/report/bigscreen/designer/widget/widgetTime.vue

+ 1 - 0
doc/docs/.vuepress/config.js

@@ -51,6 +51,7 @@ module.exports = {
                         {title: '数据源', path: '/guide/datasource'},
                         {title: '数据集', path: '/guide/dataset'},
                         {title: '大屏设计', path: '/guide/dashboard'},
+                        {title: '导入导出', path: '/guide/importexport'},
                     ]
                 },
                 {

+ 12 - 6
doc/docs/guide/dashboard.md

@@ -73,7 +73,7 @@
 
 ### 仪表盘
 数据集只能有一个字段,且字典选择“文本数字” <br>
-![img14](../picture/dashboard/img_14.png) <br>
+![img21](../picture/dashboard/img_21.png) <br>
 **如有问题,请提交 [Issue](https://gitee.com/anji-plus/report/issues) <br>**
 
 ### 中国地图
@@ -81,14 +81,20 @@
 气泡地图动态数据集,和饼图一样,对应字典值需要选择一个“Name”、“Value”,且name的字段值要和echarts图表里面的值能对应上,可参考静态数据 <br>
 ![img15](../picture/dashboard/img_15.png) <br>
 
-
 ### 百分百图
 数据集只能有一个字段,且字典选择“文本数字” <br>
 ![img16](../picture/dashboard/img_16.png) <br>
 **如有问题,请提交 [Issue](https://gitee.com/anji-plus/report/issues) <br>**
 
-### 散点图
-**开发中** <br>
-
 ### 对比图
-**开发中** <br>
+柱状对比图: <br>
+数据集需要3个字段,其中一个作为对比的字段只能为2种值,只有2种值作为对比的字段要选择“y轴字段”字典。因为底层的解析用的是堆叠图的解析,这里的y轴字段并不是指的图表上面的y轴,还请注意,有强迫症可以自行修改源码的解析,剩下的2个字段对应字典看图<br>
+![img18](../picture/dashboard/img_18.png) <br>
+**如有问题,请提交 [Issue](https://gitee.com/anji-plus/report/issues) <br>**
+
+折线对比图: <br>
+数据集需要3个字段,其中一个作为对比的字段只能为2种值,只有2种值作为对比的字段要选择“y轴字段”字典,剩下的字典对应看图<br>
+![img19](../picture/dashboard/img_19.png) <br>
+**注**:如果提示语设置选择“十字形”,请注意需要选择 “X轴颜色、上Y轴颜色、下Y轴颜色”,不然预览图表鼠标选择是全白色,还请注意。<br>
+![img20](../picture/dashboard/img_20.png)
+**如有问题,请提交 [Issue](https://gitee.com/anji-plus/report/issues) <br>**

+ 17 - 0
doc/docs/guide/importexport.md

@@ -0,0 +1,17 @@
+**注:导入导出目前是初始版本,报错没有细化,如果导入导出过程中页面无反应,请F12**
+**注:“导入成功/失败”的提示不一定对应当前真实导入导出情况,请根据实际导入导出的结果进行判断**
+
+## 导出
+![img](../picture/imexport/img.png) <br>
+导出会生成zip文件,包含图表、样式、图片等,不会带有该大屏的名称和code。<br>
+
+### 导出数据集
+适用于同一系统内部使用
+
+### 导出不含有数据集
+导出的图表会使用默认的静态数据集,适用于跨系统,请注意,如果你的大屏图表有部分图表是在对方系统不存在的,那么目前整个大屏是不会显示出来的,后续会进行兼容,不存在的图表留空。<br>
+
+## 导入
+![img1](../picture/imexport/img_1.png) <br>
+选择一个导出的zip文件导入即可。注意,导入会覆盖当前大屏,请新建一张空白的大屏进行导入。<br>
+**注:如果你导入的大屏中含有你当前系统不存在的图表,整个大屏是不会显示的。** <br>

BIN
doc/docs/picture/dashboard/img_14.png


BIN
doc/docs/picture/dashboard/img_18.png


BIN
doc/docs/picture/dashboard/img_19.png


BIN
doc/docs/picture/dashboard/img_20.png


BIN
doc/docs/picture/dashboard/img_21.png


BIN
doc/docs/picture/imexport/img.png


BIN
doc/docs/picture/imexport/img_1.png


+ 3 - 0
report-core/src/main/java/com/anjiplus/template/gaea/business/modules/dashboard/service/impl/ReportDashboardServiceImpl.java

@@ -348,6 +348,9 @@ public class ReportDashboardServiceImpl implements ReportDashboardService, Initi
 
 
     private String replaceUrl(String imageAddress, Map<String, String> fileMap) {
+        if (StringUtils.isBlank(imageAddress)) {
+            return "";
+        }
         String fileId = imageAddress.substring(imageAddress.trim().length() - 36);
         String orDefault = fileMap.getOrDefault(fileId, null);
         if (StringUtils.isBlank(orDefault)) {

+ 1 - 1
report-core/src/main/resources/db/migration/V1.0.10__create_report_share.sql

@@ -66,7 +66,7 @@ INSERT INTO `aj_report`.`gaea_report_data_set`(`set_code`, `set_name`, `set_desc
 
 use
 aj_report_init;
-CREATE TABLE `aj_report_barstack`
+CREATE TABLE if not exists `aj_report_barstack`
 (
     `id`   int(11) NOT NULL AUTO_INCREMENT,
     `time` date         DEFAULT NULL,

+ 21 - 0
report-core/src/main/resources/db/migration/V1.0.11__create_compare_table.sql

@@ -0,0 +1,21 @@
+use aj_report_init;
+CREATE TABLE if not exists `aj_report_comparestack` (
+  `id` int(11) NOT NULL AUTO_INCREMENT,
+  `time` date DEFAULT NULL,
+  `type` varchar(255) DEFAULT NULL,
+  `nums` bigint(11) DEFAULT NULL,
+  PRIMARY KEY (`id`)
+) ENGINE=InnoDB AUTO_INCREMENT=11 DEFAULT CHARSET=utf8;
+
+INSERT INTO `aj_report_init`.`aj_report_comparestack`(`id`, `time`, `type`, `nums`) VALUES (1, '2021-08-23', '成功', 12);
+INSERT INTO `aj_report_init`.`aj_report_comparestack`(`id`, `time`, `type`, `nums`) VALUES (2, '2021-08-23', '失败', 1);
+INSERT INTO `aj_report_init`.`aj_report_comparestack`(`id`, `time`, `type`, `nums`) VALUES (3, '2021-08-24', '成功', 24);
+INSERT INTO `aj_report_init`.`aj_report_comparestack`(`id`, `time`, `type`, `nums`) VALUES (4, '2021-08-24', '失败', 5);
+INSERT INTO `aj_report_init`.`aj_report_comparestack`(`id`, `time`, `type`, `nums`) VALUES (5, '2021-08-25', '成功', 13);
+INSERT INTO `aj_report_init`.`aj_report_comparestack`(`id`, `time`, `type`, `nums`) VALUES (6, '2021-08-25', '失败', 8);
+INSERT INTO `aj_report_init`.`aj_report_comparestack`(`id`, `time`, `type`, `nums`) VALUES (7, '2021-08-26', '成功', 19);
+INSERT INTO `aj_report_init`.`aj_report_comparestack`(`id`, `time`, `type`, `nums`) VALUES (8, '2021-08-26', '失败', 3);
+INSERT INTO `aj_report_init`.`aj_report_comparestack`(`id`, `time`, `type`, `nums`) VALUES (9, '2021-08-27', '成功', 9);
+INSERT INTO `aj_report_init`.`aj_report_comparestack`(`id`, `time`, `type`, `nums`) VALUES (10, '2021-08-27', '失败', 15);
+
+INSERT INTO `aj_report`.`gaea_report_data_set`(`set_code`, `set_name`, `set_desc`, `source_code`, `dyn_sentence`, `case_result`, `enable_flag`, `delete_flag`, `create_by`, `create_time`, `update_by`, `update_time`, `version`) VALUES ('compare_ajreport', '柱状对比图示例数据', '', 'mysql_ajreport', 'SELECT time,type,nums from aj_report_comparestack', '[{\"time\":\"2021-08-23\",\"type\":\"成功\",\"nums\":12},{\"time\":\"2021-08-23\",\"type\":\"失败\",\"nums\":1},{\"time\":\"2021-08-24\",\"type\":\"成功\",\"nums\":24},{\"time\":\"2021-08-24\",\"type\":\"失败\",\"nums\":5},{\"time\":\"2021-08-25\",\"type\":\"成功\",\"nums\":13},{\"time\":\"2021-08-25\",\"type\":\"失败\",\"nums\":8},{\"time\":\"2021-08-26\",\"type\":\"成功\",\"nums\":19},{\"time\":\"2021-08-26\",\"type\":\"失败\",\"nums\":3},{\"time\":\"2021-08-27\",\"type\":\"成功\",\"nums\":9},{\"time\":\"2021-08-27\",\"type\":\"失败\",\"nums\":15}]', 1, 0, 'admin', '2021-08-27 13:48:33', 'admin', '2021-08-27 13:48:33', 1);

+ 7 - 0
report-ui/src/assets/styles/index.scss

@@ -13,6 +13,13 @@ body {
   font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
     Microsoft YaHei, Arial, sans-serif;
 }
+ul,
+li,
+ol,
+li {
+  margin: 0;
+  padding: 0;
+}
 
 html {
   height: 100%;

+ 3 - 5
report-ui/src/mixins/queryform.js

@@ -122,9 +122,7 @@ export default {
         chartType == "widget-funnel"
       ) {
         return this.piechartFn(params.chartProperties, data);
-      } else if (chartType == "widget-gauge") {
-        return this.gaugeFn(params.chartProperties, data);
-      } else if (chartType == "widget-text") {
+      }  else if (chartType == "widget-text") {
         return this.widgettext(params.chartProperties, data)
       } else if (chartType == "widget-stackchart") {
         return this.stackChartFn(params.chartProperties, data)
@@ -210,7 +208,7 @@ export default {
       }
       return ananysicData;
     },
-    gaugeFn(chartProperties, data) {
+    /*gaugeFn(chartProperties, data) {
       const ananysicData = [];
       for (let i = 0; i < data.length; i++) {
         const obj = {};
@@ -228,7 +226,7 @@ export default {
         ananysicData.push(obj);
       }
       return ananysicData[0];
-    },
+    },*/
     widgettext(chartProperties, data) {
       const ananysicData = [];
       for (let i = 0; i < data.length; i++) {

+ 17 - 12
report-ui/src/views/report/bigscreen/designer/form/dynamicAddTable.vue

@@ -13,18 +13,20 @@
       <el-table-column prop="key" label="key值" width="80" />
       <el-table-column label="操作" width="100">
         <template slot-scope="scope">
-          <el-button
-            @click="handleEditorClick(scope.$index, scope.row)"
-            type="text"
-            size="small"
-            >编辑</el-button
-          >
-          <el-button
-            type="text"
-            size="small"
-            @click="handleDeleteClick(scope.$index, scope.row)"
-            >删除</el-button
-          >
+          <div class="button-group">
+            <el-button
+              @click="handleEditorClick(scope.$index, scope.row)"
+              type="text"
+              size="small"
+              >编辑</el-button
+            >
+            <el-button
+              type="text"
+              size="small"
+              @click="handleDeleteClick(scope.$index, scope.row)"
+              >删除</el-button
+            >
+          </div>
         </template>
       </el-table-column>
     </el-table>
@@ -161,4 +163,7 @@ export default {
 /deep/.el-table::before {
   height: 0;
 }
+.button-group .el-button {
+  padding: 0;
+}
 </style>

+ 52 - 43
report-ui/src/views/report/bigscreen/designer/index.vue

@@ -59,7 +59,7 @@
       :style="{ width: widthLeftForToolsHideButton + 'px' }"
       @click="toolIsShow = !toolIsShow"
     >
-      <i class="el-icon-arrow-right"/>
+      <i class="el-icon-arrow-right" />
     </div>
 
     <div
@@ -94,24 +94,26 @@
             content="导入"
             placement="bottom"
           >
-
-            <el-upload class="el-upload"
-                       ref="upload"
-                       :action="uploadUrl"
-                       :headers="headers"
-                       accept=".zip"
-                       :on-success="handleUpload"
-                       :on-error="handleError"
-                       :show-file-list="false"
-                       :limit="1">
+            <el-upload
+              class="el-upload"
+              ref="upload"
+              :action="uploadUrl"
+              :headers="headers"
+              accept=".zip"
+              :on-success="handleUpload"
+              :on-error="handleError"
+              :show-file-list="false"
+              :limit="1"
+            >
               <i class="iconfont icondaoru"></i>
-          </el-upload>
+            </el-upload>
           </el-tooltip>
         </span>
         <span class="btn border-left">
           <ul class="nav">
             <li>
-              <i class="iconfont icondaochu"></i><i class="el-icon-arrow-down"></i>
+              <i class="iconfont icondaochu"></i
+              ><i class="el-icon-arrow-down"></i>
               <ul>
                 <li>
                   <el-tooltip
@@ -120,9 +122,8 @@
                     content="适合当前系统"
                     placement="right"
                   >
-                       <div @click="exportDashboard(1)">导出(包含数据集)</div>
+                    <div @click="exportDashboard(1)">导出(包含数据集)</div>
                   </el-tooltip>
-
                 </li>
                 <li>
                   <el-tooltip
@@ -131,7 +132,7 @@
                     content="适合跨系统"
                     placement="right"
                   >
-                       <div @click="exportDashboard(0)">导出(不包含数据集)</div>
+                    <div @click="exportDashboard(0)">导出(不包含数据集)</div>
                   </el-tooltip>
                 </li>
               </ul>
@@ -277,14 +278,19 @@
 </template>
 
 <script>
-import {insertDashboard, detailDashboard, importDashboard, exportDashboard} from "@/api/bigscreen";
-import {widgetTools, getToolByCode} from "./tools";
+import {
+  insertDashboard,
+  detailDashboard,
+  importDashboard,
+  exportDashboard
+} from "@/api/bigscreen";
+import { widgetTools, getToolByCode } from "./tools/index";
 import widget from "./widget/widget.vue";
 import dynamicForm from "./form/dynamicForm.vue";
 import draggable from "vuedraggable";
 import VueRulerTool from "vue-ruler-tool"; // 大屏设计页面的标尺插件
 import contentMenu from "./form/contentMenu";
-import {getToken} from "@/utils/auth";
+import { getToken } from "@/utils/auth";
 
 export default {
   name: "Login",
@@ -297,7 +303,10 @@ export default {
   },
   data() {
     return {
-      uploadUrl: process.env.BASE_API + '/reportDashboard/import/' + this.$route.query.reportCode,
+      uploadUrl:
+        process.env.BASE_API +
+        "/reportDashboard/import/" +
+        this.$route.query.reportCode,
       grade: false,
       layerWidget: [],
       widgetTools: widgetTools, // 左侧工具栏的组件图标,将js变量加入到当前作用域
@@ -366,8 +375,8 @@ export default {
   computed: {
     headers() {
       return {
-        Authorization: getToken(), // 直接从本地获取token就行
-      }
+        Authorization: getToken() // 直接从本地获取token就行
+      };
     },
     // 左侧折叠切换时,动态计算中间区的宽度
     middleWidth() {
@@ -441,7 +450,7 @@ export default {
     },
     async initEchartData() {
       const reportCode = this.$route.query.reportCode;
-      const {code, data} = await detailDashboard(reportCode);
+      const { code, data } = await detailDashboard(reportCode);
       if (code != 200) return;
       const processData = this.handleInitEchartsData(data);
       const screenData = this.handleBigScreen(data.dashboard);
@@ -541,7 +550,7 @@ export default {
         },
         widgets: this.widgets
       };
-      const {code, data} = await insertDashboard(screenData);
+      const { code, data } = await insertDashboard(screenData);
       if (code == "200") {
         this.$message.success("保存成功!");
       }
@@ -550,31 +559,31 @@ export default {
     viewScreen() {
       var routeUrl = this.$router.resolve({
         path: "/bigscreen/viewer",
-        query: {reportCode: this.$route.query.reportCode}
+        query: { reportCode: this.$route.query.reportCode }
       });
       window.open(routeUrl.href, "_blank");
     },
     //  导出
     async exportDashboard(val) {
-      const fileName = this.$route.query.reportCode + ".zip"
+      const fileName = this.$route.query.reportCode + ".zip";
 
       const param = {
-        reportCode:this.$route.query.reportCode,
-        showDataSet:val
-      }
+        reportCode: this.$route.query.reportCode,
+        showDataSet: val
+      };
       exportDashboard(param).then(res => {
-        const blob = new Blob([res], {type: "application/octet-stream"});
-        if (window.navigator.msSaveOrOpenBlob) {//msSaveOrOpenBlob方法返回bool值
-          navigator.msSaveBlob(blob, fileName);//本地保存
+        const blob = new Blob([res], { type: "application/octet-stream" });
+        if (window.navigator.msSaveOrOpenBlob) {
+          //msSaveOrOpenBlob方法返回bool值
+          navigator.msSaveBlob(blob, fileName); //本地保存
         } else {
-          const link = document.createElement('a');//a标签下载
+          const link = document.createElement("a"); //a标签下载
           link.href = window.URL.createObjectURL(blob);
           link.download = fileName;
           link.click();
           window.URL.revokeObjectURL(link.href);
         }
-      })
-
+      });
     },
     // 上传成功的回调
     handleUpload(response, file, fileList) {
@@ -583,15 +592,15 @@ export default {
       //刷新大屏页面
       this.initEchartData();
       this.$message({
-        message: '导入成功!',
-        type: 'success',
-      })
+        message: "导入成功!",
+        type: "success"
+      });
     },
     handleError() {
       this.$message({
-        message: '上传失败!',
-        type: 'error',
-      })
+        message: "上传失败!",
+        type: "error"
+      });
     },
 
     // 在缩放模式下的大小
@@ -1028,8 +1037,8 @@ export default {
         background-image: linear-gradient(
             hsla(0, 0%, 100%, 0.1) 1px,
             transparent 0
-        ),
-        linear-gradient(90deg, hsla(0, 0%, 100%, 0.1) 1px, transparent 0);
+          ),
+          linear-gradient(90deg, hsla(0, 0%, 100%, 0.1) 1px, transparent 0);
         // z-index: 2;
       }
     }

+ 0 - 7612
report-ui/src/views/report/bigscreen/designer/tools.js

@@ -1,7612 +0,0 @@
-const screenConfig = {
-  code: 'screen',
-  type: 'screen',
-  label: '大屏设置',
-  icon: '',
-  options: {
-    setup: [
-      {
-        type: 'el-input-number',
-        label: '大屏宽度',
-        name: 'width',
-        required: false,
-        placeholder: 'px',
-        value: '1920',
-      },
-      {
-        type: 'el-input-number',
-        label: '大屏高度',
-        name: 'height',
-        required: false,
-        placeholder: 'px',
-        value: '1080',
-      },
-      {
-        type: 'el-input-text',
-        label: '标题',
-        name: 'title',
-        require: false,
-        placeholder: '',
-        value: '大屏',
-      },
-      {
-        type: 'el-input-textarea',
-        label: '大屏简介',
-        name: 'description',
-        required: false,
-        placeholder: '',
-      },
-      {
-        type: 'vue-color',
-        label: '背景颜色',
-        name: 'backgroundColor',
-        required: false,
-        placeholder: '',
-        value: '#000',
-      },
-      {
-        type: 'custom-upload',
-        label: '图片地址',
-        name: 'backgroundImage',
-        required: false,
-        placeholder: '',
-        value: 'https://report.anji-plus.com/file/download/bf566e48-ccad-40e1-8ee9-228427e5466b',
-      },
-    ],
-    data: [],
-    position: [],
-  },
-}
-
-const widgetTools = [
-  // type=html类型的组件
-  {
-    code: 'widget-text',
-    type: 'html',
-    label: '文本',
-    icon: 'iconziyuan',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '文本框',
-        },
-        {
-          type: 'el-input-text',
-          label: '文本内容',
-          name: 'text',
-          required: false,
-          placeholder: '',
-          value: '文本框',
-        },
-        {
-          type: 'el-input-number',
-          label: '字体大小',
-          name: 'fontSize',
-          required: false,
-          placeholder: '',
-          value: '26',
-        },
-        {
-          type: 'vue-color',
-          label: '字体颜色',
-          name: 'color',
-          required: false,
-          placeholder: '',
-          value: '#FAD400',
-        },
-        {
-          type: 'el-input-number',
-          label: '字体间距',
-          name: 'letterSpacing',
-          required: false,
-          placeholder: '',
-          value: '0',
-        },
-        {
-          type: 'vue-color',
-          label: '字体背景',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: 'rgba(115,170,229,.0)',
-        },
-        {
-          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: 'textAlign',
-          required: false,
-          placeholder: '',
-          selectOptions: [
-            {code: 'center', name: '居中'},
-            {code: 'left', name: '左对齐'},
-            {code: 'right', name: '右对齐'},
-          ],
-          value: 'center'
-        },
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: '文本框',
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          chartType: 'widget-text',
-          dictKey: 'TEXT_PROPERTIES',
-          value: '',
-        }
-      ],
-
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 100,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 40
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-marquee',
-    type: 'html',
-    label: '滚动文本',
-    icon: 'iconhengxiangwenzi',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '跑马灯',
-        },
-        {
-          type: 'el-input-text',
-          label: '文本内容',
-          name: 'text',
-          required: false,
-          placeholder: '',
-          value: '滚动文本',
-        },
-        {
-          type: 'el-input-number',
-          label: '字体大小',
-          name: 'fontSize',
-          required: false,
-          placeholder: '',
-          value: '26',
-        },
-        {
-          type: 'vue-color',
-          label: '字体颜色',
-          name: 'color',
-          required: false,
-          placeholder: '',
-          value: '#FAD400',
-        },
-        {
-          type: 'el-input-number',
-          label: '字体间距',
-          name: 'letterSpacing',
-          required: false,
-          placeholder: '',
-          value: '0',
-        },
-        {
-          type: 'vue-color',
-          label: '字体背景',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: 'rgba(115,170,229,.5)',
-        },
-        {
-          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-input-number',
-          label: '滚动速度',
-          name: 'jScrollPane',
-          //required: false,
-          placeholder: '',
-          value: '50',
-        }*/
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: '文本框',
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          chartType: 'widget-text',
-          dictKey: 'TEXT_PROPERTIES',
-          value: '',
-        }
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 100,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 40,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-href',
-    type: 'html',
-    label: '超链接',
-    icon: 'iconchaolianjie',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '超链接',
-        },
-        {
-          type: 'el-input-text',
-          label: '文本内容',
-          name: 'text',
-          required: false,
-          placeholder: '',
-          value: '超链接',
-        },
-        {
-          type: 'el-input-number',
-          label: '字体大小',
-          name: 'fontSize',
-          required: false,
-          placeholder: '',
-          value: '26',
-        },
-        {
-          type: 'vue-color',
-          label: '字体颜色',
-          name: 'color',
-          required: false,
-          placeholder: '',
-          value: '#FAD400',
-        },
-        {
-          type: 'el-input-number',
-          label: '字体间距',
-          name: 'letterSpacing',
-          required: false,
-          placeholder: '',
-          value: '0',
-        },
-        {
-          type: 'vue-color',
-          label: '字体背景',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: 'rgba(115,170,229,.5)',
-        },
-        {
-          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: 'textAlign',
-          required: false,
-          placeholder: '',
-          selectOptions: [
-            {code: 'center', name: '居中'},
-            {code: 'left', name: '左对齐'},
-            {code: 'right', name: '右对齐'},
-          ],
-          value: 'center'
-        },
-        {
-          type: 'el-radio-group',
-          label: '跳转方式',
-          name: 'jumpMode',
-          required: false,
-          placeholder: '',
-          selectOptions: [
-            {
-              code: 'self',
-              name: '本窗口',
-            },
-            {
-              code: 'other',
-              name: '新窗口',
-            },
-          ],
-          value: 'self',
-        },
-        {
-          type: 'el-input-text',
-          label: '超链地址',
-          name: 'linkAdress',
-          required: false,
-          placeholder: '',
-          value: 'http://www.baidu.com',
-        },
-      ],
-      // 数据
-      data: [],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 100,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 40,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-time',
-    type: 'html',
-    label: '当前时间',
-    icon: 'iconshijian',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '当前时间',
-        },
-        {
-          type: 'el-select',
-          label: '时间格式',
-          name: 'timeFormat',
-          required: false,
-          placeholder: '',
-          selectOptions: [
-            {code: 'yyyy-MM-dd', name: '日期'},
-            {code: 'yyyy-MM-dd hh:mm', name: '日期+时分'},
-            {code: 'yyyy-MM-dd hh:mm:ss', name: '日期+时分秒'},
-            {code: 'MM-dd', name: '日期无年'},
-            {code: 'hh:mm', name: '时分'},
-            {code: 'hh:mm:ss', name: '时分秒'},
-            {code: 'year-week', name: '日期+星期'},
-            {code: 'year-h-m-week', name: '日期+时分+星期'},
-            {code: 'year-h-m-s-week', name: '日期+时分秒+星期'},
-            {code: 'week', name: '星期'}
-          ],
-          value: 'yyyy-MM-dd hh:mm:ss'
-        },
-        {
-          type: 'el-input-number',
-          label: '字体间距',
-          name: 'letterSpacing',
-          required: false,
-          placeholder: '',
-          value: '0'
-        },
-        {
-          type: 'el-input-number',
-          label: '字体大小',
-          name: 'fontSize',
-          required: false,
-          placeholder: '',
-          value: '26'
-        },
-        {
-          type: 'vue-color',
-          label: '字体颜色',
-          name: 'color',
-          required: false,
-          placeholder: '',
-          value: '#FAD400'
-        },
-        {
-          type: 'vue-color',
-          label: '字体背景',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: 'rgba(115,170,229,.5)'
-        },
-        {
-          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: 'textAlign',
-          required: false,
-          placeholder: '',
-          selectOptions: [
-            {code: 'center', name: '居中'},
-            {code: 'left', name: '左对齐'},
-            {code: 'right', name: '右对齐'},
-          ],
-          value: 'left'
-        },
-      ],
-      // 数据
-      data: [],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 300,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 100,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-image',
-    type: 'html',
-    label: '图片',
-    icon: 'icontupian',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '图片',
-        },
-        {
-          type: 'el-switch',
-          label: '开启旋转',
-          name: 'startRotate',
-          required: false,
-          placeholder: '',
-          value: false,
-        },
-        {
-          type: 'el-slider',
-          label: '透明度',
-          name: 'transparency',
-          required: false,
-          placeholder: '',
-          value: 100
-        },
-        {
-          type: 'el-input-number',
-          label: '圆角',
-          name: 'borderRadius',
-          required: false,
-          placeholder: '',
-          value: '0'
-        },
-        {
-          type: 'custom-upload',
-          label: '图片地址',
-          name: 'imageAdress',
-          required: false,
-          placeholder: '',
-          value: 'http://10.108.26.197:9095/file/download/fd20d563-00aa-45e2-b5db-aff951f814ec',
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-        },
-      ],
-      // 数据
-      data: [],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 300,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  // {
-  //   code: 'widget-slider',
-  //   type: 'html',
-  //   label: '轮播图片',
-  //   icon: 'slider',
-  //   options: {
-  //     // 配置
-  //     setup: [
-  //       {
-  //         type: 'el-input-text',
-  //         label: '图层名称',
-  //         name: 'layerName',
-  //         required: false,
-  //         placeholder: '',
-  //       },
-  //       {
-  //         type: 'el-switch',
-  //         label: '隐藏图层',
-  //         name: 'hideLayer',
-  //         required: false,
-  //         placeholder: '',
-  //       },
-  //       {
-  //         type: 'el-select',
-  //         label: '轮播方向',
-  //         name: 'tabDirection',
-  //         required: false,
-  //         placeholder: '',
-  //       },
-  //       {
-  //         type: 'el-select',
-  //         label: '选择器',
-  //         name: 'tabSelector',
-  //         required: false,
-  //         placeholder: '',
-  //       },
-  //       {
-  //         type: 'el-input-number',
-  //         label: '轮播时间',
-  //         name: 'tabTime',
-  //         required: false,
-  //         placeholder: '',
-  //       },
-  //     ],
-  //     // 数据
-  //     data: [],
-  //     // 坐标
-  //     position: [
-  //       {
-  //         type: 'el-input-number',
-  //         label: '左边距',
-  //         name: 'left',
-  //         required: true,
-  //         placeholder: 'px',
-  //       },
-  //       {
-  //         type: 'el-input-number',
-  //         label: '上边距',
-  //         name: 'top',
-  //         required: true,
-  //         placeholder: 'px',
-  //       },
-  //       {
-  //         type: 'el-input-number',
-  //         label: '宽度',
-  //         name: 'width',
-  //         required: true,
-  //         placeholder: '该容器在1920px大屏中的宽度',
-  //       },
-  //       {
-  //         type: 'el-input-number',
-  //         label: '高度',
-  //         name: 'height',
-  //         required: true,
-  //         placeholder: '该容器在1080px大屏中的高度',
-  //       },
-  //     ],
-  //   },
-  // },
-  {
-    code: 'widget-video',
-    type: 'html',
-    label: '视频',
-    icon: 'iconshipin',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: 'video',
-        },
-        {
-          type: 'el-input-text',
-          label: '地址',
-          name: 'videoAdress',
-          required: false,
-          placeholder: '',
-          value: 'https://www.w3school.com.cn//i/movie.ogg',
-        },
-      ],
-      // 数据
-      data: [],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 300,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-table',
-    type: 'html',
-    label: '表格',
-    icon: 'iconbiaoge',
-    options: {
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '表格',
-        },
-        {
-          type: 'el-select',
-          label: '字体位置',
-          name: 'textAlign',
-          required: false,
-          placeholder: '',
-          selectOptions: [
-            {code: 'center', name: '居中'},
-            {code: 'left', name: '左对齐'},
-            {code: 'right', name: '右对齐'},
-          ],
-          value: 'center'
-        },
-        {
-          type: 'el-input-number',
-          label: '字体大小',
-          name: 'fontSize',
-          required: false,
-          placeholder: '',
-          value: '16'
-        },
-        {
-          type: 'el-switch',
-          label: '开启滚动',
-          name: 'isRoll',
-          required: false,
-          placeholder: '',
-          value: true
-        },
-        {
-          type: 'el-input-number',
-          label: '滚动时间(毫秒)',
-          name: 'rollTime',
-          required: false,
-          placeholder: '',
-          value: 1000
-        },
-        {
-          type: 'el-input-number',
-          label: '滚动个数',
-          name: 'rollNumber',
-          required: false,
-          placeholder: '',
-          value: 1
-        },
-        {
-          type: 'el-switch',
-          label: '线条',
-          name: 'isLine',
-          required: false,
-          placeholder: '',
-          value: false
-        },
-        {
-          type: 'el-input-number',
-          label: '边框宽度',
-          name: 'borderWidth',
-          required: false,
-          placeholder: '',
-          value: 1
-        },
-        {
-          type: 'vue-color',
-          label: '边框颜色',
-          name: 'borderColor',
-          required: false,
-          placeholder: '',
-          value: '#fff'
-        },
-        [
-          {
-            name: '表头设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '表头显隐',
-                name: 'isHeader',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '表头颜色',
-                name: 'headColor',
-                require: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'vue-color',
-                label: '表头背景',
-                name: 'headBackColor',
-                require: false,
-                placeholder: '',
-                value: '#0a73ff',
-              },
-            ],
-          },
-          {
-            name: '表体设置',
-            list: [
-              {
-                type: 'vue-color',
-                label: '文字颜色',
-                name: 'bodyColor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'vue-color',
-                label: '表格背景',
-                name: 'tableBgColor',
-                require: false,
-                placeholder: '',
-                value: '',
-              },
-              {
-                type: 'vue-color',
-                label: '奇行颜色',
-                name: 'oldColor',
-                require: false,
-                placeholder: '',
-                value: '#0a2732',
-              },
-              {
-                type: 'vue-color',
-                label: '偶行颜色',
-                name: 'eventColor',
-                required: false,
-                placeholder: '',
-                value: '#003b51'
-              }
-            ],
-          },
-        ],
-        {
-          type: 'dynamic-add-table',
-          label: '',
-          name: 'dynamicAddTable',
-          required: false,
-          placeholder: '',
-          value: [{name: '日期', key: 'date', width: 200}, {name: '姓名', key: 'name', width: 200}, {
-            name: '地址',
-            key: 'address',
-            width: '200'
-          }]
-        }
-      ],
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: [
-            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
-            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
-            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
-            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
-            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
-            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
-            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
-          ],
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          chartType: 'widget-table',
-          dictKey: 'TEXT_PROPERTIES', //表格的暂不起作用
-          value: '',
-        },
-      ],
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 600,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 300,
-        },
-      ]
-    }
-  },
-  {
-    code: 'widget-iframe',
-    type: 'html',
-    label: '内联框架',
-    icon: 'iconkuangjia',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: 'iframe',
-        },
-        {
-          type: 'el-input-text',
-          label: '地址',
-          name: 'iframeAdress',
-          required: false,
-          placeholder: '',
-          value: 'https://report.anji-plus.com/index.html',
-        },
-      ],
-      // 数据
-      data: [],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 300,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  // {
-  //   code: 'widget-universal',
-  //   type: 'html',
-  //   label: '全能组件',
-  //   icon: 'univresal',
-  // },
-  // type=chart类型的组件
-  {
-    code: 'widget-barchart',
-    type: 'chart',
-    label: '柱形图',
-    icon: 'iconzhuzhuangtu',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '柱状图',
-        },
-        {
-          type: 'el-switch',
-          label: '竖展示',
-          name: 'verticalShow',
-          required: false,
-          placeholder: '',
-          value: false,
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-        [
-          {
-            name: '柱体设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '最大宽度',
-                name: 'maxWidth',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-              {
-                type: 'el-slider',
-                label: '圆角',
-                name: 'radius',
-                require: false,
-                placeholder: '',
-                value: 5,
-              },
-              {
-                type: 'el-slider',
-                label: '最小高度',
-                name: 'minHeight',
-                require: false,
-                placeholder: '',
-                value: 0,
-              },
-            ],
-          },
-          {
-            name: '标题设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标题',
-                name: 'isNoTitle',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-text',
-                label: '标题',
-                name: 'titleText',
-                required: false,
-                placeholder: '',
-                value: '',
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'textColor',
-                required: false,
-                placeholder: '',
-                value: '#FFD700'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'textFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-              {
-                type: 'el-select',
-                label: '字体位置',
-                name: 'textAlign',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'center'
-              },
-              {
-                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-text',
-                label: '字体粗细',
-                name: 'subTextFontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'subTextFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-            ],
-          },
-          {
-            name: 'X轴设置',
-            list: [
-              {
-                type: 'el-input-text',
-                label: '名称',
-                name: 'xName',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'hideX',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '坐标名颜色',
-                name: 'xNameColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'xNameFontSize',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-              {
-                type: 'el-slider',
-                label: '文字角度',
-                name: 'textAngle',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'el-input-number',
-                label: '文字间隔',
-                name: 'textInterval',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'el-switch',
-                label: '轴反转',
-                name: 'reversalX',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'vue-color',
-                label: '颜色',
-                name: 'Xcolor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字号',
-                name: 'fontSizeX',
-                required: false,
-                placeholder: '',
-                value: 12,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineX',
-                require: false,
-                placeholder: '',
-                value: false,
-              },
-              {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },
-          {
-            name: 'Y轴设置',
-            list: [
-              {
-                type: 'el-input-text',
-                label: '名称',
-                name: 'textNameY',
-                require: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShowY',
-                require: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '坐标名颜色',
-                name: 'NameColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'NameFontSizeY',
-                required: false,
-                placeholder: '',
-                value: 12,
-              },
-              {
-                type: 'el-switch',
-                label: '轴反转',
-                name: 'reversalY',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'vue-color',
-                label: '颜色',
-                name: 'colorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字号',
-                name: 'fontSizeY',
-                required: false,
-                placeholder: '',
-                value: 12,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              }, {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineY',
-                require: false,
-                placeholder: '',
-                value: false,
-              }, {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },
-          {
-            name: '数值设定',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShow',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: 14
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-select',
-                label: '字体粗细',
-                name: 'fontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-            ],
-          },
-          {
-            name: '提示语设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lineColor',
-                required: false,
-                placeholder: '',
-              },
-            ],
-          },
-          {
-            name: '坐标轴边距设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '左边距(像素)',
-                name: 'marginLeft',
-                required: false,
-                placeholder: '',
-                value: 10,
-              }, {
-                type: 'el-slider',
-                label: '顶边距(像素)',
-                name: 'marginTop',
-                required: false,
-                placeholder: '',
-                value: 50,
-              }, {
-                type: 'el-slider',
-                label: '右边距(像素)',
-                name: 'marginRight',
-                required: false,
-                placeholder: '',
-                value: 40,
-              }, {
-                type: 'el-slider',
-                label: '底边距(像素)',
-                name: 'marginBottom',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-            ],
-          },
-          {
-            name: '图例操作',
-            list: [
-              {
-                type: 'el-switch',
-                label: '图例',
-                name: 'isShowLegend',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lengedColor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'lengedFontSize',
-                required: false,
-                placeholder: '',
-                value: 16,
-              },
-              {
-                type: 'el-input-number',
-                label: '图例宽度',
-                name: 'lengedWidth',
-                required: false,
-                placeholder: '',
-                value: 15,
-              },
-              {
-                type: 'el-select',
-                label: '横向位置',
-                name: 'lateralPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: ''
-              },
-              {
-                type: 'el-select',
-                label: '纵向位置',
-                name: 'longitudinalPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'top', name: '顶部'},
-                  {code: 'bottom', name: '底部'},
-                ],
-                value: ''
-              },
-              {
-                type: 'el-select',
-                label: '布局前置',
-                name: 'layoutFront',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'vertical', name: '竖排'},
-                  {code: 'horizontal', name: '横排'},
-                ],
-                value: ''
-              },
-            ],
-          },
-          {
-            name: '自定义配色',
-            list: [
-              {
-                type: 'customColor',
-                label: '',
-                name: 'customColor',
-                required: false,
-                value: [{color: '#ff7f50'}, {color: '#87cefa'}, {color: '#da70d6'}, {color: '#32cd32'}, {color: '#6495ed'}],
-              },
-            ],
-          },
-        ],
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: {"categories": ["苹果","三星","小米","oppo","vivo"],"series": [{"name": "手机品牌","data": [1000,2229,3879,2379,4079]}]},
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          chartType: 'widget-barchart',
-          dictKey: 'BAR_PROPERTIES',
-          value: '',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-gradient-color-barchart',
-    type: 'chart',
-    label: '柱形图-渐变色',
-    icon: 'iconzhuzhuangtu',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '柱形图-渐变色',
-        },
-        {
-          type: 'el-switch',
-          label: '竖展示',
-          name: 'verticalShow',
-          required: false,
-          placeholder: '',
-          value: false,
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-        [
-          {
-            name: '柱体设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '最大宽度',
-                name: 'maxWidth',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-              {
-                type: 'el-slider',
-                label: '圆角',
-                name: 'radius',
-                require: false,
-                placeholder: '',
-                value: 5,
-              },
-/*              {
-                type: 'el-slider',
-                label: '最小高度',
-                name: 'minHeight',
-                require: false,
-                placeholder: '',
-                value: 0,
-              },*/
-            ],
-          },
-          {
-            name: '标题设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标题',
-                name: 'isNoTitle',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-text',
-                label: '标题',
-                name: 'titleText',
-                required: false,
-                placeholder: '',
-                value: '',
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'textColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'textFontSize',
-                required: false,
-                placeholder: '',
-                value: 22
-              },
-              {
-                type: 'el-select',
-                label: '字体位置',
-                name: 'textAlign',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'center'
-              },
-              {
-                type: 'el-input-text',
-                label: '副标题',
-                name: 'subText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: '#90979c'
-              },
-              {
-                type: 'el-input-text',
-                label: '字体粗细',
-                name: 'subTextFontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'subTextFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-            ],
-          },
-          {
-            name: 'X轴设置',
-            list: [
-              {
-                type: 'el-input-text',
-                label: '名称',
-                name: 'xName',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'hideX',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-number',
-                label: '字号',
-                name: 'fontSizeX',
-                required: false,
-                placeholder: '',
-                value: 12,
-              },
-              {
-                type: 'vue-color',
-                label: '颜色',
-                name: 'Xcolor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-slider',
-                label: '文字角度',
-                name: 'textAngle',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'el-input-number',
-                label: '文字间隔',
-                name: 'textInterval',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'el-switch',
-                label: '轴反转',
-                name: 'reversalX',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineX',
-                require: false,
-                placeholder: '',
-                value: false,
-              },
-              {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              }
-            ],
-          },
-          {
-            name: 'Y轴设置',
-            list: [
-              {
-                type: 'el-input-text',
-                label: '名称',
-                name: 'textNameY',
-                require: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShowY',
-                require: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '颜色',
-                name: 'colorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字号',
-                name: 'fontSizeY',
-                required: false,
-                placeholder: '',
-                value: 12,
-              },
-              {
-                type: 'el-slider',
-                label: '文字角度',
-                name: 'ytextAngle',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'el-input-number',
-                label: '文字间隔',
-                name: 'ytextInterval',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'el-switch',
-                label: '轴反转',
-                name: 'reversalY',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineY',
-                require: false,
-                placeholder: '',
-                value: false,
-              }, {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },
-          {
-            name: '数值设定',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShow',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: 14
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-select',
-                label: '字体粗细',
-                name: 'fontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-            ],
-          },
-          {
-            name: '提示语设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'tipsFontSize',
-                required: false,
-                placeholder: '',
-                value: 16
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lineColor',
-                required: false,
-                placeholder: '',
-              },
-            ],
-          },
-          {
-            name: '坐标轴边距设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '左边距(像素)',
-                name: 'marginLeft',
-                required: false,
-                placeholder: '',
-                value: 10,
-              }, {
-                type: 'el-slider',
-                label: '顶边距(像素)',
-                name: 'marginTop',
-                required: false,
-                placeholder: '',
-                value: 50,
-              }, {
-                type: 'el-slider',
-                label: '右边距(像素)',
-                name: 'marginRight',
-                required: false,
-                placeholder: '',
-                value: 40,
-              }, {
-                type: 'el-slider',
-                label: '底边距(像素)',
-                name: 'marginBottom',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-            ],
-          },
-          {
-            name: '渐变色',
-            list: [
-              {
-                type: 'vue-color',
-                label: '0%处',
-                name: 'bar0color',
-                required: false,
-                placeholder: '',
-                value: '#00F4FF'
-              },
-              {
-                type: 'vue-color',
-                label: '100%处',
-                name: 'bar100color',
-                required: false,
-                placeholder: '',
-                value: '#004DA7'
-              },
-              {
-                type: 'vue-color',
-                label: '阴影颜色',
-                name: 'shadowColor',
-                required: false,
-                placeholder: '',
-                value: '#00A0DD'
-              },
-              {
-                type: 'el-input-number',
-                label: '模糊系数',
-                name: 'shadowBlur',
-                required: false,
-                placeholder: '',
-                value: 4,
-              },
-            ],
-          },
-        ],
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: {"categories": ["苹果","三星","小米","oppo","vivo"],"series": [{"name": "手机品牌","data": [1000,2229,3879,2379,4079]}]},
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          chartType: 'widget-barchart',
-          dictKey: 'BAR_PROPERTIES',
-          value: '',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-linechart',
-    type: 'chart',
-    label: '折线图',
-    icon: 'icontubiaozhexiantu',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '折线图',
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-        [
-          {
-            name: '折线设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标记点',
-                name: 'markPoint',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-slider',
-                label: '点大小',
-                name: 'pointSize',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-              {
-                type: 'el-switch',
-                label: '平滑曲线',
-                name: 'smoothCurve',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-switch',
-                label: '面积堆积',
-                name: 'area',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-slider',
-                label: '面积厚度',
-                name: 'areaThickness',
-                required: false,
-                placeholder: '',
-                value: 5,
-              },
-              {
-                type: 'el-slider',
-                label: '线条宽度',
-                name: 'lineWidth',
-                required: false,
-                placeholder: '',
-                value: 4,
-              },
-            ],
-          },
-          {
-            name: '标题设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标题',
-                name: 'isNoTitle',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-input-text',
-                label: '标题',
-                name: 'titleText',
-                required: false,
-                placeholder: '',
-                value: '',
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'textColor',
-                required: false,
-                placeholder: '',
-                value: '##FFD700'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'textFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-              {
-                type: 'el-select',
-                label: '字体位置',
-                name: 'textAlign',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'center'
-              },
-              {
-                type: 'el-input-text',
-                label: '副标题',
-                name: 'subText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'subTextFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-            ],
-          },
-          {
-            name: 'X轴设置',
-            list: [
-              {
-                type: 'el-input-text',
-                label: '名称',
-                name: 'xName',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'hideX',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '坐标名颜色',
-                name: 'xNameColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'xNameFontSize',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-              {
-                type: 'el-slider',
-                label: '文字角度',
-                name: 'textAngle',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'el-input-number',
-                label: '文字间隔',
-                name: 'textInterval',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'el-switch',
-                label: '轴反转',
-                name: 'reversalX',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'vue-color',
-                label: '颜色',
-                name: 'Xcolor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-text',
-                label: '字号',
-                name: 'fontSizeX',
-                required: false,
-                placeholder: '',
-                value: 12,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineX',
-                require: false,
-                placeholder: '',
-                value: false,
-              },
-              {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },
-          {
-            name: 'Y轴设置',
-            list: [
-              {
-                type: 'el-input-text',
-                label: '名称',
-                name: 'textNameY',
-                require: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShowY',
-                require: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '坐标名颜色',
-                name: 'NameColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-input-text',
-                label: '字体大小',
-                name: 'NameFontSizeY',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-              {
-                type: 'el-switch',
-                label: '轴反转',
-                name: 'reversalY',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'vue-color',
-                label: '颜色',
-                name: 'colorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-text',
-                label: '字号',
-                name: 'fontSizeY',
-                required: false,
-                placeholder: '',
-                value: 12,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineY',
-                require: false,
-                placeholder: '',
-                value: false,
-              }, {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },
-          {
-            name: '数值设定',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShow',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-select',
-                label: '字体粗细',
-                name: 'fontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-            ],
-          },
-          {
-            name: '提示语设置',
-            list: [
-              {
-                type: 'el-input-text',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lineColor',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-            ],
-          },
-          {
-            name: '坐标轴边距设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '左边距(像素)',
-                name: 'marginLeft',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-              {
-                type: 'el-slider',
-                label: '顶边距(像素)',
-                name: 'marginTop',
-                required: false,
-                placeholder: '',
-                value: 50,
-              },
-              {
-                type: 'el-slider',
-                label: '右边距(像素)',
-                name: 'marginRight',
-                required: false,
-                placeholder: '',
-                value: 40,
-              },
-              {
-                type: 'el-slider',
-                label: '底边距(像素)',
-                name: 'marginBottom',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-            ],
-          },
-          {
-            name: '图例操作',
-            list: [
-              {
-                type: 'el-switch',
-                label: '图例',
-                name: 'isShowLegend',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lengedColor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'lengedFontSize',
-                required: false,
-                placeholder: '',
-                value: 16,
-              },
-              {
-                type: 'el-input-number',
-                label: '图例宽度',
-                name: 'lengedWidth',
-                required: false,
-                placeholder: '',
-                value: 15,
-              },
-              {
-                type: 'el-select',
-                label: '横向位置',
-                name: 'lateralPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'left'
-              },
-              {
-                type: 'el-select',
-                label: '纵向位置',
-                name: 'longitudinalPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'top', name: '顶部'},
-                  {code: 'bottom', name: '底部'},
-                ],
-                value: ''
-              },
-              {
-                type: 'el-select',
-                label: '布局前置',
-                name: 'layoutFront',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'vertical', name: '竖排'},
-                  {code: 'horizontal', name: '横排'},
-                ],
-                value: ''
-              },
-            ],
-          },
-          {
-            name: '自定义配色',
-            list: [
-              {
-                type: 'customColor',
-                label: '',
-                name: 'customColor',
-                required: false,
-                value: [{color: '#1E90FF'}],
-              },
-            ],
-          },
-        ],
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: {"categories": ["苹果","三星","小米","oppo","vivo"],"series": [{"name": "手机品牌","data": [1009,3409,2309,5409,3409]}]},
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          chartType: 'widget-linechart',
-          dictKey: 'LINE_PROPERTIES',
-          relactiveDomValue: 'dynamicData',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-barlinechart',
-    type: 'chart',
-    label: '柱线图',
-    icon: 'iconzhuxiantu',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '柱线图',
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-        [
-          {
-            name: '折线设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标记点',
-                name: 'markPoint',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-slider',
-                label: '点大小',
-                name: 'pointSize',
-                required: false,
-                placeholder: '',
-                value: 5,
-              },
-              {
-                type: 'el-switch',
-                label: '平滑曲线',
-                name: 'smoothCurve',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-switch',
-                label: '面积堆积',
-                name: 'area',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-slider',
-                label: '面积厚度',
-                name: 'areaThickness',
-                required: false,
-                placeholder: '',
-                value: 5,
-              },
-              {
-                type: 'el-slider',
-                label: '线条宽度',
-                name: 'lineWidth',
-                required: false,
-                placeholder: '',
-                value: 3,
-              },
-            ],
-          },
-          {
-            name: '柱体设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '最大宽度',
-                name: 'maxWidth',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-              {
-                type: 'el-slider',
-                label: '圆角',
-                name: 'radius',
-                require: false,
-                placeholder: '',
-                value: 5,
-              },
-              {
-                type: 'el-slider',
-                label: '最小高度',
-                name: 'minHeight',
-                require: false,
-                placeholder: '',
-                value: 0,
-              },
-            ],
-          },
-          {
-            name: '标题设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标题',
-                name: 'isNoTitle',
-                required: false,
-                placeholder: '',
-                value: true
-              },
-              {
-                type: 'el-input-text',
-                label: '标题',
-                name: 'titleText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'textColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'textFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-              {
-                type: 'el-select',
-                label: '字体位置',
-                name: 'textAlign',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'left'
-              },
-              {
-                type: 'el-input-text',
-                label: '副标题',
-                name: 'subText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'subTextFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-            ],
-          },
-          {
-            name: 'X轴设置',
-            list: [
-              {
-                type: 'el-input-text',
-                label: '名称',
-                name: 'xName',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'hideX',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '坐标名颜色',
-                name: 'xNameColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'xNameFontSize',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-              {
-                type: 'el-slider',
-                label: '文字角度',
-                name: 'textAngle',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'el-input-number',
-                label: '文字间隔',
-                name: 'textInterval',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'el-switch',
-                label: '轴反转',
-                name: 'reversalX',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'vue-color',
-                label: '颜色',
-                name: 'Xcolor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字号',
-                name: 'fontSizeX',
-                required: false,
-                placeholder: '',
-                value: 16,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineX',
-                require: false,
-                placeholder: '',
-                value: false,
-              },
-              {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },
-          {
-            name: 'Y轴设置',
-            list: [
-              {
-                type: 'el-input-text',
-                label: '名称',
-                name: 'textNameY',
-                require: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShowY',
-                require: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '坐标名颜色',
-                name: 'NameColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'NameFontSizeY',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-              {
-                type: 'el-switch',
-                label: '轴反转',
-                name: 'reversalY',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'vue-color',
-                label: '颜色',
-                name: 'colorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字号',
-                name: 'fontSizeY',
-                required: false,
-                placeholder: '',
-                value: 12,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineY',
-                require: false,
-                placeholder: '',
-                value: false,
-              }, {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },
-          {
-            name: '提示语设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lineColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-            ],
-          },
-          {
-            name: '坐标轴边距设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '左边距(像素)',
-                name: 'marginLeft',
-                required: false,
-                placeholder: '',
-                value: 10,
-              }, {
-                type: 'el-slider',
-                label: '顶边距(像素)',
-                name: 'marginTop',
-                required: false,
-                placeholder: '',
-                value: 50,
-              }, {
-                type: 'el-slider',
-                label: '右边距(像素)',
-                name: 'marginRight',
-                required: false,
-                placeholder: '',
-                value: 40,
-              }, {
-                type: 'el-slider',
-                label: '底边距(像素)',
-                name: 'marginBottom',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-            ],
-          },
-          {
-            name: '图例操作',
-            list: [
-              {
-                type: 'el-switch',
-                label: '图例',
-                name: 'isShowLegend',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lengedColor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-text',
-                label: '字体大小',
-                name: 'lengedFontSize',
-                required: false,
-                placeholder: '',
-                value: 16,
-              },
-              {
-                type: 'el-input-number',
-                label: '图例宽度',
-                name: 'lengedWidth',
-                required: false,
-                placeholder: '',
-                value: 15,
-              },
-              {
-                type: 'el-select',
-                label: '横向位置',
-                name: 'lateralPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: ''
-              },
-              {
-                type: 'el-select',
-                label: '纵向位置',
-                name: 'longitudinalPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'top', name: '顶部'},
-                  {code: 'bottom', name: '底部'},
-                ],
-                value: ''
-              },
-              {
-                type: 'el-select',
-                label: '布局前置',
-                name: 'layoutFront',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'vertical', name: '竖排'},
-                  {code: 'horizontal', name: '横排'},
-                ],
-                value: ''
-              },
-            ],
-          },
-          {
-            name: '自定义配色',
-            list: [
-              {
-                type: 'customColor',
-                label: '',
-                name: 'customColor',
-                required: false,
-                value: [{color: '#00F4FFFF'}, {color: '#42fffd'}],
-              },
-            ],
-          },
-        ],
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: {"xAxis": ["1月", "2月", "3月", "4月", "5月","6月", "7月", "8月","9月","10月","11月","12月"],"series": [{"type": "bar","name": "货运量","data": [2.6,5.9,9,26.4,28.7,70.7,175.6,182.2,48.7,18.8,6,2.3]},{"type": "line","name": "货运总量","yAxisIndex": 1,"data": [2,2.2,3.3,4.5,6.3,10.2,20.3,23.4,23,16.5,12,6.2]}]},
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          chartType: 'widget-barlinechart',
-          dictKey: 'BAR_LINE_PROPERTIES',
-          relactiveDomValue: 'dynamicData',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-piechart',
-    type: 'chart',
-    label: '饼图',
-    icon: 'iconicon_tubiao_bingtu',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '饼图',
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-        {
-          type: 'el-select',
-          label: '饼图样式',
-          name: 'piechartStyle',
-          required: false,
-          placeholder: '',
-          selectOptions: [
-            {code: 'shixin', name: '实心饼图'},
-            {code: 'kongxin', name: '空心饼图'},
-          ],
-          value: 'shixin'
-        },
-        [
-          {
-            name: '标题设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标题',
-                name: 'isNoTitle',
-                required: false,
-                placeholder: '',
-                value: true
-              },
-              {
-                type: 'el-input-text',
-                label: '标题',
-                name: 'titleText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'textColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'textFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-              {
-                type: 'el-select',
-                label: '字体位置',
-                name: 'textAlign',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'left'
-              },
-              {
-                type: 'el-input-text',
-                label: '副标题',
-                name: 'subText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'subTextFontSize',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-            ],
-          },
-          {
-            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: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: 14,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                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'
-              },
-            ],
-          },
-          {
-            name: '提示语设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-              {
-                type: 'vue-color',
-                label: '网格线颜色',
-                name: 'lineColor',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-            ],
-          },
-          {
-            name: '图例操作',
-            list: [
-              {
-                type: 'el-switch',
-                label: '图例',
-                name: 'isShowLegend',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lengedColor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-text',
-                label: '字体大小',
-                name: 'lengedFontSize',
-                required: false,
-                placeholder: '',
-                value: 16,
-              },
-              {
-                type: 'el-input-number',
-                label: '图例宽度',
-                name: 'lengedWidth',
-                required: false,
-                placeholder: '',
-                value: 15,
-              },
-              {
-                type: 'el-select',
-                label: '横向位置',
-                name: 'lateralPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: ''
-              },
-              {
-                type: 'el-select',
-                label: '纵向位置',
-                name: 'longitudinalPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'top', name: '顶部'},
-                  {code: 'bottom', name: '底部'},
-                ],
-                value: ''
-              },
-              {
-                type: 'el-select',
-                label: '布局前置',
-                name: 'layoutFront',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'vertical', name: '竖排'},
-                  {code: 'horizontal', name: '横排'},
-                ],
-                value: ''
-              },
-            ],
-          },
-          {
-            name: '自定义配色',
-            list: [
-              {
-                type: 'customColor',
-                label: '',
-                name: 'customColor',
-                required: false,
-                value: [{color: '#0CD2E6'}, {color: '#00BFA5'}, {color: '#FFC722'}, {color: '#886EFF'}, {color: '#008DEC'}],
-              },
-            ],
-          },
-        ],
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: [{"value": 1048,"name": "搜索引擎"},{"value": 735, "name": "直接访问"},{"value": 580, "name": "邮件营销"},{"value": 484,"name":"联盟广告"},{"value":300,"name":"视频广告"}]
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          chartType: 'widget-piechart',
-          relactiveDomValue: 'dynamicData',
-          dictKey: 'PIE_PROPERTIES',
-          value: '',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-funnel',
-    type: 'chart',
-    label: '漏斗图',
-    icon: 'iconloudoutu',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '漏斗图',
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-        [
-          {
-            name: '文字设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShow',
-                require: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                require: false,
-                placeholder: '',
-                value: 12,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'color',
-                require: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-select',
-                label: '字体粗细',
-                name: 'fontWeight',
-                require: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-              {
-                type: 'el-switch',
-                label: '反转',
-                name: 'reversal',
-                require: false,
-                placeholder: '',
-                value: 0
-              },
-            ],
-          },
-          {
-            name: '标题设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标题',
-                name: 'isNoTitle',
-                required: false,
-                placeholder: '',
-                value: true
-              },
-              {
-                type: 'el-input-text',
-                label: '标题',
-                name: 'titleText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'textColor',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'textFontSize',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-              {
-                type: 'el-select',
-                label: '字体位置',
-                name: 'textAlign',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'left'
-              },
-              {
-                type: 'el-input-text',
-                label: '副标题',
-                name: 'subText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'subTextFontSize',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-            ],
-          },
-          {
-            name: '提示语设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '网格线颜色',
-                name: 'lineColor',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-            ],
-          },
-          {
-            name: '图例操作',
-            list: [
-              {
-                type: 'el-switch',
-                label: '图例',
-                name: 'isShowLegend',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lengedColor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'lengedFontSize',
-                required: false,
-                placeholder: '',
-                value: 16,
-              },
-              {
-                type: 'el-input-number',
-                label: '图例宽度',
-                name: 'lengedWidth',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-              {
-                type: 'el-select',
-                label: '横向位置',
-                name: 'lateralPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: ''
-              },
-              {
-                type: 'el-select',
-                label: '纵向位置',
-                name: 'longitudinalPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'top', name: '顶部'},
-                  {code: 'bottom', name: '底部'},
-                ],
-                value: ''
-              },
-              {
-                type: 'el-select',
-                label: '布局前置',
-                name: 'layoutFront',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'vertical', name: '竖排'},
-                  {code: 'horizontal', name: '横排'},
-                ],
-                value: ''
-              },
-            ],
-          },
-          {
-            name: '自定义配色',
-            list: [
-              {
-                type: 'customColor',
-                label: '',
-                name: 'customColor',
-                required: false,
-                value: [{color: '#0CD2E6'}, {color: '#00BFA5'}, {color: '#FFC722'}, {color: '#886EFF'}, {color: '#008DEC'}],
-              },
-            ],
-          },
-        ],
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: [{"value": 60,"name": "访问"},{"value": 40, "name": "咨询"},{"value": 20, "name": "订单"},{"value": 80,"name":"点击"},{"value":100,"name":"展现"}],
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          chartType: 'widget-funnel',
-          relactiveDomValue: 'dynamicData',
-          dictKey: 'PIE_PROPERTIES',
-          value: '',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-gauge',
-    type: 'chart',
-    label: '仪表盘',
-    icon: 'iconyibiaopan',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '仪表盘',
-        },
-        {
-          type: 'el-input-number',
-          label: '刻度线粗度',
-          name: 'tickMarkWeight',
-          require: false,
-          placeholder: '',
-          value: 10,
-        },
-        {
-          type: 'el-switch',
-          label: '显示刻度值',
-          name: 'showScaleValue',
-          require: false,
-          placeholder: '',
-          value: true,
-        },
-        {
-          type: 'el-switch',
-          label: '显示刻度线',
-          name: 'showTickMarks',
-          require: false,
-          placeholder: '',
-          value: true,
-        },
-        {
-          type: 'el-input-number',
-          label: '刻度字号',
-          name: 'scaleFontSize',
-          require: false,
-          placeholder: '',
-          value: 16,
-        },
-        {
-          type: 'el-input-number',
-          label: '指标字号',
-          name: 'targetFontSize',
-          require: false,
-          placeholder: '',
-          value: 20,
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: {value: 50, name: "名称", unit: "%"},
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          chartType: 'widget-gauge',
-          dictKey: 'TEXT_PROPERTIES',
-          relactiveDomValue: 'dynamicData',
-          value: '',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widget-map',
-    type: 'chart',
-    label: '中国地图',
-    icon: 'iconzhongguoditu',
-    options: {
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '迁徙图',
-        },
-      ],
-      data: [],
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 600,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 400,
-        },
-      ]
-    }
-  },
-  {
-    code: 'WidgetPieNightingaleRoseArea',
-    type: 'chart',
-    label: '南丁格尔玫瑰图',
-    icon: 'iconnandinggeermeiguitu',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '南丁格尔玫瑰图',
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-        {
-          type: 'el-select',
-          label: '饼图模式',
-          name: 'nightingleRosetype',
-          required: false,
-          placeholder: '',
-          selectOptions: [
-            {code: 'area', name: '面积模式'},
-            {code: 'radius', name: '半径模式'},
-          ],
-          value: 'area'
-        },
-        [
-          {
-            name: '标题设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标题',
-                name: 'isNoTitle',
-                required: false,
-                placeholder: '',
-                value: true
-              },
-              {
-                type: 'el-input-text',
-                label: '标题',
-                name: 'titleText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'textColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'textFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-              {
-                type: 'el-select',
-                label: '字体位置',
-                name: 'textAlign',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'left'
-              },
-              {
-                type: 'el-input-text',
-                label: '副标题',
-                name: 'subText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'subTextFontSize',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-            ],
-          },
-          {
-            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: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: 14,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                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'
-              },
-            ],
-          },
-          {
-            name: '提示语设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-              {
-                type: 'vue-color',
-                label: '网格线颜色',
-                name: 'lineColor',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-            ],
-          },
-          {
-            name: '图例操作',
-            list: [
-              {
-                type: 'el-switch',
-                label: '图例',
-                name: 'isShowLegend',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lengedColor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'lengedFontSize',
-                required: false,
-                placeholder: '',
-                value: 16,
-              },
-              {
-                type: 'el-input-number',
-                label: '图例宽度',
-                name: 'lengedWidth',
-                required: false,
-                placeholder: '',
-                value: 15,
-              },
-              {
-                type: 'el-select',
-                label: '横向位置',
-                name: 'lateralPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: ''
-              },
-              {
-                type: 'el-select',
-                label: '纵向位置',
-                name: 'longitudinalPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'top', name: '顶部'},
-                  {code: 'bottom', name: '底部'},
-                ],
-                value: ''
-              },
-              {
-                type: 'el-select',
-                label: '布局前置',
-                name: 'layoutFront',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'vertical', name: '竖排'},
-                  {code: 'horizontal', name: '横排'},
-                ],
-                value: ''
-              },
-            ],
-          },
-          {
-            name: '自定义配色',
-            list: [
-              {
-                type: 'customColor',
-                label: '',
-                name: 'customColor',
-                required: false,
-                value: [{color: '#FF801C'}, {color: '#F5FF46'}, {color: '#00FE65'}, {color: '#00FEFF'}, {color: '#ffa800'}]
-              },
-            ],
-          },
-        ],
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: [{"value": 1048,"name": "搜索引擎"},{"value": 735, "name": "直接访问"},{"value": 580, "name": "邮件营销"},{"value": 484,"name":"联盟广告"},{"value":300,"name":"视频广告"}],
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          chartType: 'widget-piechart',
-          dictKey: 'PIE_PROPERTIES',
-          relactiveDomValue: 'dynamicData',
-          value: '',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widgetPiePercentageChart',
-    type: 'chart',
-    label: '百分比图',
-    icon: 'iconbaifenbi',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '百分比图',
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-        [
-          {
-            name: '数值设置',
-            list: [
-              {
-                type: 'vue-color',
-                label: '数值颜色',
-                name: 'textNumColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-input-number',
-                label: '数值字体',
-                name: 'textNumFontSize',
-                required: false,
-                placeholder: '',
-                value: 40
-              },
-              {
-                type: 'el-select',
-                label: '字体粗细',
-                name: 'textNumFontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-              {
-                type: 'vue-color',
-                label: '%号颜色',
-                name: 'textPerColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-input-number',
-                label: '%号字体',
-                name: 'textPerFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-              {
-                type: 'el-select',
-                label: '字体粗细',
-                name: 'textPerFontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              }
-            ],
-          },
-          {
-            name: '圆环设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '刻度数量',
-                name: 'lineNumber',
-                required: false,
-                placeholder: '',
-                value: 8
-              },
-              {
-                type: 'el-input-number',
-                label: '刻度长度',
-                name: 'lineLength',
-                required: false,
-                placeholder: '',
-                value: 15
-              },
-              {
-                type: 'el-input-number',
-                label: '刻度宽度',
-                name: 'lineWidth',
-                required: false,
-                placeholder: '',
-                value: 5
-              },
-              {
-                type: 'vue-color',
-                label: '刻度颜色',
-                name: 'lineColor',
-                required: false,
-                placeholder: '',
-                value: '#061740'
-              },
-            ]
-          },
-          {
-            name: '渐变色',
-            list: [
-              {
-                type: 'vue-color',
-                label: '0%处颜色',
-                name: 'color0Start',
-                required: false,
-                placeholder: '',
-                value: '#4FADFD'
-              },
-              {
-                type: 'vue-color',
-                label: '100%颜色',
-                name: 'color100End',
-                required: false,
-                placeholder: '',
-                value: '#28E8FA'
-              },
-              {
-                type: 'vue-color',
-                label: '余处颜色',
-                name: 'colorsurplus',
-                required: false,
-                placeholder: '',
-                value: '#173164'
-              },
-            ]
-          }
-        ],
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: 60,
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          chartType: 'widget-piechart',
-          dictKey: 'TEXT_PROPERTIES',
-          relactiveDomValue: 'dynamicData',
-          value: '',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widgetAirBubbleMap',
-    type: 'chart',
-    label: '气泡地图',
-    icon: 'iconzhongguoditu',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '气泡地图',
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: '#0F1C3C'
-        },
-        [
-          {
-            name: '标题设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标题',
-                name: 'isNoTitle',
-                required: false,
-                placeholder: '',
-                value: true
-              },
-              {
-                type: 'el-input-text',
-                label: '标题',
-                name: 'titleText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'textColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'textFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-              {
-                type: 'el-select',
-                label: '字体位置',
-                name: 'textAlign',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'left'
-              },
-              {
-                type: 'el-input-text',
-                label: '副标题',
-                name: 'subText',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'subTextFontSize',
-                required: false,
-                placeholder: '',
-                value: 12
-              },
-            ],
-          },
-          {
-            name: '字体设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '文字大小',
-                name: 'fontTextSize',
-                required: false,
-                placeholder: '',
-                value: 15,
-              },
-              {
-                type: 'vue-color',
-                label: '文字颜色',
-                name: 'fontTextColor',
-                required: false,
-                placeholder: '',
-                value: '#D4EEFF'
-              },
-              {
-                type: 'el-select',
-                label: '文字粗细',
-                name: 'fontTextWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-              {
-                type: 'el-input-number',
-                label: '数值大小',
-                name: 'fontDataSize',
-                required: false,
-                placeholder: '',
-                value: 15,
-              },
-              {
-                type: 'vue-color',
-                label: '数值颜色',
-                name: 'fontDataColor',
-                required: false,
-                placeholder: '',
-                value: '#D4EEFF'
-              },
-              {
-                type: 'el-select',
-                label: '数值粗细',
-                name: 'fontDataWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-            ],
-          },
-          {
-            name: '气泡设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '最小半径',
-                name: 'fontminSize4Pin',
-                required: false,
-                placeholder: '',
-                value: 20,
-              },
-              {
-                type: 'el-input-number',
-                label: '最大半径',
-                name: 'fontmaxSize4Pin',
-                required: false,
-                placeholder: '',
-                value: 100,
-              },
-              /*{
-                type: 'vue-color',
-                label: '气泡颜色',
-                name: 'fontPieColor',
-                required: false,
-                placeholder: '',
-                value: ''
-              },*/
-            ],
-          },
-          {
-            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'
-              },
-            ],
-          },
-        ],
-      ],
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: [
-            {"name":"南海诸岛","value":1},
-            {"name":"北京","value":524},
-            {"name":"天津","value":14},
-            {"name":"上海","value":150},
-            {"name":"重庆","value":75},
-            {"name":"河北","value":13},
-            {"name":"河南","value":83},
-            {"name":"云南","value":11},
-            {"name":"辽宁","value":19},
-            {"name":"黑龙江","value":15},
-            {"name":"湖南","value":69},
-            {"name":"安徽","value":260},
-            {"name":"山东","value":39},
-            {"name":"新疆","value":4},
-            {"name":"江苏","value":31},
-            {"name":"浙江","value":104},
-            {"name":"江西","value":36},
-            {"name":"湖北","value":1052},
-            {"name":"广西","value":33},
-            {"name":"甘肃","value":347},
-            {"name":"山西","value":8},
-            {"name":"内蒙古","value":157},
-            {"name":"陕西","value":22},
-            {"name":"吉林","value":4},
-            {"name":"福建","value":36},
-            {"name":"贵州","value":39},
-            {"name":"广东","value":996},
-            {"name":"青海","value":27},
-            {"name":"西藏","value":31},
-            {"name":"四川","value":46},
-            {"name":"宁夏","value":16},
-            {"name":"海南","value":22},
-            {"name":"台湾","value":6},
-            {"name":"香港","value":2},
-            {"name":"澳门","value":9}],
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          chartType: 'widget-piechart',
-          dictKey: 'MAP_PROPERTIES',
-          relactiveDomValue: 'dynamicData',
-          value: '',
-        },
-      ],
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 600,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 400,
-        },
-      ]
-    }
-  },
-  {
-    code: 'widgetBarStackChart',
-    type: 'chart',
-    label: '柱状堆叠图',
-    icon: 'iconbianzu23',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '柱状堆叠图',
-        },
-        {
-          type: 'el-switch',
-          label: '竖展示',
-          name: 'verticalShow',
-          required: false,
-          placeholder: '',
-          value: false,
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-        {
-          type: 'el-select',
-          label: '堆叠样式',
-          name: 'stackStyle',
-          required: false,
-          placeholder: '',
-          selectOptions: [
-            {code: 'leftRight', name: '左右堆叠'},
-            {code: 'upDown', name: '上下堆叠'},
-          ],
-          value: 'leftRight'
-        },
-        [
-          {
-            name: '柱体设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '最大宽度',
-                name: 'maxWidth',
-                required: false,
-                placeholder: '',
-                value: 20,
-              },
-              {
-                type: 'el-slider',
-                label: '圆角',
-                name: 'radius',
-                require: false,
-                placeholder: '',
-                value: 5,
-              },
-            ],
-          },
-          {
-            name: '标题设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标题',
-                name: 'isNoTitle',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-text',
-                label: '标题',
-                name: 'titleText',
-                required: false,
-                placeholder: '',
-                value: '',
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'textColor',
-                required: false,
-                placeholder: '',
-                value: '#FFD700'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'textFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-              {
-                type: 'el-select',
-                label: '字体位置',
-                name: 'textAlign',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'center'
-              },
-              {
-                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-select',
-                label: '字体粗细',
-                name: 'subTextFontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'subTextFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-            ],
-          },
-          {
-            name: 'X轴设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'hideX',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-text',
-                label: 'X轴别名',
-                name: 'xName',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '别名颜色',
-                name: 'xNameColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-input-number',
-                label: '别名字号',
-                name: 'xNameFontSize',
-                required: false,
-                placeholder: '',
-                value: 14
-              },
-              {
-                type: 'el-switch',
-                label: '轴反转',
-                name: 'reversalX',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-slider',
-                label: '文字角度',
-                name: 'textAngleX',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'el-input-number',
-                label: '文字间隔',
-                name: 'textInterval',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '文字颜色',
-                name: 'Xcolor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '文字字号',
-                name: 'fontSizeX',
-                required: false,
-                placeholder: '',
-                value: 14,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineX',
-                require: false,
-                placeholder: '',
-                value: false,
-              },
-              {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },
-          {
-            name: 'Y轴设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShowY',
-                require: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-text',
-                label: 'Y轴别名',
-                name: 'textNameY',
-                require: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                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-switch',
-                label: '轴反转',
-                name: 'reversalY',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-slider',
-                label: '文字角度',
-                name: 'textAngleY',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'vue-color',
-                label: '文字颜色',
-                name: 'colorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '文字字号',
-                name: 'fontSizeY',
-                required: false,
-                placeholder: '',
-                value: 14,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              }, {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineY',
-                require: false,
-                placeholder: '',
-                value: false,
-              }, {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },
-          {
-            name: '数值设定',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShow',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: 14
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-select',
-                label: '字体粗细',
-                name: 'fontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-            ],
-          },
-          {
-            name: '提示语设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'tipsFontSize',
-                required: false,
-                placeholder: '',
-                value: 16
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lineColor',
-                required: false,
-                placeholder: '',
-              },
-            ],
-          },
-          {
-            name: '坐标轴边距设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '左边距(像素)',
-                name: 'marginLeft',
-                required: false,
-                placeholder: '',
-                value: 10,
-              }, {
-                type: 'el-slider',
-                label: '顶边距(像素)',
-                name: 'marginTop',
-                required: false,
-                placeholder: '',
-                value: 50,
-              }, {
-                type: 'el-slider',
-                label: '右边距(像素)',
-                name: 'marginRight',
-                required: false,
-                placeholder: '',
-                value: 40,
-              }, {
-                type: 'el-slider',
-                label: '底边距(像素)',
-                name: 'marginBottom',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-            ],
-          },
-          {
-            name: '图例操作',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShowLegend',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lengedColor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'lengedFontSize',
-                required: false,
-                placeholder: '',
-                value: 16,
-              },
-              {
-                type: 'el-input-number',
-                label: '图例宽度',
-                name: 'lengedWidth',
-                required: false,
-                placeholder: '',
-                value: 15,
-              },
-              {
-                type: 'el-select',
-                label: '横向位置',
-                name: 'lateralPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'center'
-              },
-              {
-                type: 'el-select',
-                label: '纵向位置',
-                name: 'longitudinalPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'top', name: '顶部'},
-                  {code: 'bottom', name: '底部'},
-                ],
-                value: 'top'
-              },
-              {
-                type: 'el-select',
-                label: '布局前置',
-                name: 'layoutFront',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'vertical', name: '竖排'},
-                  {code: 'horizontal', name: '横排'},
-                ],
-                value: 'horizontal'
-              },
-            ],
-          },
-          {
-            name: '自定义配色',
-            list: [
-              {
-                type: 'customColor',
-                label: '',
-                name: 'customColor',
-                required: false,
-                value: [{color: '#ff7f50'}, {color: '#87cefa'}, {color: '#da70d6'}, {color: '#32cd32'}, {color: '#6495ed'}],
-              },
-            ],
-          },
-        ],
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: [
-            {"axis":"2021-07-25","name":"A","data":"12"},
-            {"axis":"2021-07-25","name":"B","data":"20"},
-            {"axis":"2021-07-26","name":"B","data":"5"},
-            {"axis":"2021-07-26","name":"C","data":"20"},
-            {"axis":"2021-07-27","name":"A","data":"15"},
-            {"axis":"2021-07-27","name":"B","data":"30"},
-            {"axis":"2021-07-27","name":"C","data":"5"}
-          ],
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          chartType: 'widget-stackchart',
-          dictKey: 'STACK_PROPERTIES',
-          value: '',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widgetLineStackChart',
-    type: 'chart',
-    label: '折线堆叠图',
-    icon: 'iconduidietu',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '折线堆叠图',
-        },
-        {
-          type: 'el-switch',
-          label: '竖展示',
-          name: 'verticalShow',
-          required: false,
-          placeholder: '',
-          value: false,
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-        [
-          {
-            name: '折线设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标记点',
-                name: 'markPoint',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-slider',
-                label: '点大小',
-                name: 'pointSize',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-              {
-                type: 'el-switch',
-                label: '平滑曲线',
-                name: 'smoothCurve',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-switch',
-                label: '面积堆积',
-                name: 'area',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-slider',
-                label: '面积厚度',
-                name: 'areaThickness',
-                required: false,
-                placeholder: '',
-                value: 5,
-              },
-              {
-                type: 'el-slider',
-                label: '线条宽度',
-                name: 'lineWidth',
-                required: false,
-                placeholder: '',
-                value: 4,
-              },
-            ],
-          },
-          {
-            name: '标题设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标题',
-                name: 'isNoTitle',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-text',
-                label: '标题',
-                name: 'titleText',
-                required: false,
-                placeholder: '',
-                value: '',
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'textColor',
-                required: false,
-                placeholder: '',
-                value: '#FFD700'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'textFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-              {
-                type: 'el-select',
-                label: '字体位置',
-                name: 'textAlign',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'center'
-              },
-              {
-                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-select',
-                label: '字体粗细',
-                name: 'subTextFontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'subTextFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-            ],
-          },
-          {
-            name: 'X轴设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'hideX',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-text',
-                label: 'X轴别名',
-                name: 'xName',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '别名颜色',
-                name: 'xNameColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-input-number',
-                label: '别名字号',
-                name: 'xNameFontSize',
-                required: false,
-                placeholder: '',
-                value: 14
-              },
-              {
-                type: 'el-switch',
-                label: '轴反转',
-                name: 'reversalX',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-slider',
-                label: '文字角度',
-                name: 'textAngleX',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'el-input-number',
-                label: '文字间隔',
-                name: 'textInterval',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '文字颜色',
-                name: 'Xcolor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '文字字号',
-                name: 'fontSizeX',
-                required: false,
-                placeholder: '',
-                value: 14,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineX',
-                require: false,
-                placeholder: '',
-                value: false,
-              },
-              {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },
-          {
-            name: 'Y轴设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShowY',
-                require: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-text',
-                label: 'Y轴别名',
-                name: 'textNameY',
-                require: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                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-switch',
-                label: '轴反转',
-                name: 'reversalY',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-slider',
-                label: '文字角度',
-                name: 'textAngleY',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'vue-color',
-                label: '文字颜色',
-                name: 'colorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '文字字号',
-                name: 'fontSizeY',
-                required: false,
-                placeholder: '',
-                value: 14,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              }, {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineY',
-                require: false,
-                placeholder: '',
-                value: false,
-              }, {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },
-          {
-            name: '数值设定',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShow',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: 14
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-select',
-                label: '字体粗细',
-                name: 'fontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-            ],
-          },
-          {
-            name: '提示语设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'tipsFontSize',
-                required: false,
-                placeholder: '',
-                value: 16
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lineColor',
-                required: false,
-                placeholder: '',
-              },
-            ],
-          },
-          {
-            name: '坐标轴边距设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '左边距(像素)',
-                name: 'marginLeft',
-                required: false,
-                placeholder: '',
-                value: 10,
-              }, {
-                type: 'el-slider',
-                label: '顶边距(像素)',
-                name: 'marginTop',
-                required: false,
-                placeholder: '',
-                value: 50,
-              }, {
-                type: 'el-slider',
-                label: '右边距(像素)',
-                name: 'marginRight',
-                required: false,
-                placeholder: '',
-                value: 40,
-              }, {
-                type: 'el-slider',
-                label: '底边距(像素)',
-                name: 'marginBottom',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-            ],
-          },
-          {
-            name: '图例操作',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShowLegend',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lengedColor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'lengedFontSize',
-                required: false,
-                placeholder: '',
-                value: 16,
-              },
-              {
-                type: 'el-input-number',
-                label: '图例宽度',
-                name: 'lengedWidth',
-                required: false,
-                placeholder: '',
-                value: 15,
-              },
-              {
-                type: 'el-select',
-                label: '横向位置',
-                name: 'lateralPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'center'
-              },
-              {
-                type: 'el-select',
-                label: '纵向位置',
-                name: 'longitudinalPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'top', name: '顶部'},
-                  {code: 'bottom', name: '底部'},
-                ],
-                value: 'top'
-              },
-              {
-                type: 'el-select',
-                label: '布局前置',
-                name: 'layoutFront',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'vertical', name: '竖排'},
-                  {code: 'horizontal', name: '横排'},
-                ],
-                value: 'horizontal'
-              },
-            ],
-          },
-          {
-            name: '自定义配色',
-            list: [
-              {
-                type: 'customColor',
-                label: '',
-                name: 'customColor',
-                required: false,
-                value: [{color: '#ff7f50'}, {color: '#87cefa'}, {color: '#da70d6'}, {color: '#32cd32'}, {color: '#6495ed'}],
-              },
-            ],
-          },
-        ],
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: [
-            {"axis":"2021-07-25","name":"A","data":"12"},
-            {"axis":"2021-07-25","name":"B","data":"20"},
-            {"axis":"2021-07-26","name":"B","data":"5"},
-            {"axis":"2021-07-26","name":"C","data":"20"},
-            {"axis":"2021-07-27","name":"A","data":"15"},
-            {"axis":"2021-07-27","name":"B","data":"30"},
-            {"axis":"2021-07-27","name":"C","data":"5"}
-          ],
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          chartType: 'widget-stackchart',
-          dictKey: 'STACK_PROPERTIES',
-          value: '',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-  {
-    code: 'widgetBarCompareChart',
-    type: 'chart',
-    label: '柱状对比图',
-    icon: 'iconduibitupu',
-    options: {
-      // 配置
-      setup: [
-        {
-          type: 'el-input-text',
-          label: '图层名称',
-          name: 'layerName',
-          required: false,
-          placeholder: '',
-          value: '柱状对比图',
-        },
-        {
-          type: 'vue-color',
-          label: '背景颜色',
-          name: 'background',
-          required: false,
-          placeholder: '',
-          value: ''
-        },
-        [
-          {
-            name: '柱体设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '最大宽度',
-                name: 'maxWidth',
-                required: false,
-                placeholder: '',
-                value: 15,
-              },
-              {
-                type: 'el-slider',
-                label: '圆角',
-                name: 'radius',
-                require: false,
-                placeholder: '',
-                value: 5,
-              },
-            ],
-          },
-          {
-            name: '标题设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '标题',
-                name: 'isNoTitle',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-text',
-                label: '标题',
-                name: 'titleText',
-                required: false,
-                placeholder: '',
-                value: '',
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'textColor',
-                required: false,
-                placeholder: '',
-                value: '#FFD700'
-              },
-              {
-                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-input-number',
-                label: '字体大小',
-                name: 'textFontSize',
-                required: false,
-                placeholder: '',
-                value: 20
-              },
-              {
-                type: 'el-select',
-                label: '字体位置',
-                name: 'textAlign',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'center'
-              },
-            ],
-          },
-          /*{
-            name: 'X轴设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'hideX',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-text',
-                label: 'X轴别名',
-                name: 'xName',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '别名颜色',
-                name: 'xNameColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-input-number',
-                label: '别名字号',
-                name: 'xNameFontSize',
-                required: false,
-                placeholder: '',
-                value: 14
-              },
-              {
-                type: 'el-switch',
-                label: '轴反转',
-                name: 'reversalX',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-slider',
-                label: '文字角度',
-                name: 'textAngleX',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'el-input-number',
-                label: '文字间隔',
-                name: 'textInterval',
-                required: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                type: 'vue-color',
-                label: '文字颜色',
-                name: 'Xcolor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '文字字号',
-                name: 'fontSizeX',
-                required: false,
-                placeholder: '',
-                value: 14,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineX',
-                require: false,
-                placeholder: '',
-                value: false,
-              },
-              {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorX',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },*/
-          /*{
-            name: 'Y轴设置',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShowY',
-                require: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'el-input-text',
-                label: 'Y轴别名',
-                name: 'textNameY',
-                require: false,
-                placeholder: '',
-                value: ''
-              },
-              {
-                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-switch',
-                label: '轴反转',
-                name: 'reversalY',
-                required: false,
-                placeholder: '',
-                value: false
-              },
-              {
-                type: 'el-slider',
-                label: '文字角度',
-                name: 'textAngleY',
-                required: false,
-                placeholder: '',
-                value: 0
-              },
-              {
-                type: 'vue-color',
-                label: '文字颜色',
-                name: 'colorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '文字字号',
-                name: 'fontSizeY',
-                required: false,
-                placeholder: '',
-                value: 14,
-              },
-              {
-                type: 'vue-color',
-                label: '轴颜色',
-                name: 'lineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              }, {
-                type: 'el-switch',
-                label: '分割线显示',
-                name: 'isShowSplitLineY',
-                require: false,
-                placeholder: '',
-                value: false,
-              }, {
-                type: 'vue-color',
-                label: '分割线颜色',
-                name: 'splitLineColorY',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-
-              }
-            ],
-          },*/
-          {
-            name: '数值设定',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShow',
-                required: false,
-                placeholder: '',
-                value: true
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'fontSize',
-                required: false,
-                placeholder: '',
-                value: 14
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'subTextColor',
-                required: false,
-                placeholder: '',
-                value: '#fff'
-              },
-              {
-                type: 'el-select',
-                label: '字体粗细',
-                name: 'fontWeight',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'normal', name: '正常'},
-                  {code: 'bold', name: '粗体'},
-                  {code: 'bolder', name: '特粗体'},
-                  {code: 'lighter', name: '细体'}
-                ],
-                value: 'normal'
-              },
-            ],
-          },
-          {
-            name: '提示语设置',
-            list: [
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'tipsFontSize',
-                required: false,
-                placeholder: '',
-                value: 16
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lineColor',
-                required: false,
-                placeholder: '',
-              },
-            ],
-          },
-          /*{
-            name: '坐标轴边距设置',
-            list: [
-              {
-                type: 'el-slider',
-                label: '左边距(像素)',
-                name: 'marginLeft',
-                required: false,
-                placeholder: '',
-                value: 10,
-              }, {
-                type: 'el-slider',
-                label: '顶边距(像素)',
-                name: 'marginTop',
-                required: false,
-                placeholder: '',
-                value: 50,
-              }, {
-                type: 'el-slider',
-                label: '右边距(像素)',
-                name: 'marginRight',
-                required: false,
-                placeholder: '',
-                value: 40,
-              }, {
-                type: 'el-slider',
-                label: '底边距(像素)',
-                name: 'marginBottom',
-                required: false,
-                placeholder: '',
-                value: 10,
-              },
-            ],
-          },*/
-          {
-            name: '图例操作',
-            list: [
-              {
-                type: 'el-switch',
-                label: '显示',
-                name: 'isShowLegend',
-                required: false,
-                placeholder: '',
-                value: true,
-              },
-              {
-                type: 'vue-color',
-                label: '字体颜色',
-                name: 'lengedColor',
-                required: false,
-                placeholder: '',
-                value: '#fff',
-              },
-              {
-                type: 'el-input-number',
-                label: '字体大小',
-                name: 'lengedFontSize',
-                required: false,
-                placeholder: '',
-                value: 16,
-              },
-              {
-                type: 'el-input-number',
-                label: '图例宽度',
-                name: 'lengedWidth',
-                required: false,
-                placeholder: '',
-                value: 15,
-              },
-              {
-                type: 'el-select',
-                label: '横向位置',
-                name: 'lateralPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'center', name: '居中'},
-                  {code: 'left', name: '左对齐'},
-                  {code: 'right', name: '右对齐'},
-                ],
-                value: 'center'
-              },
-              {
-                type: 'el-select',
-                label: '纵向位置',
-                name: 'longitudinalPosition',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'top', name: '顶部'},
-                  {code: 'bottom', name: '底部'},
-                ],
-                value: 'top'
-              },
-              {
-                type: 'el-select',
-                label: '布局前置',
-                name: 'layoutFront',
-                required: false,
-                placeholder: '',
-                selectOptions: [
-                  {code: 'vertical', name: '竖排'},
-                  {code: 'horizontal', name: '横排'},
-                ],
-                value: 'horizontal'
-              },
-            ],
-          },
-          {
-            name: '自定义配色',
-            list: [
-              {
-                type: 'customColor',
-                label: '',
-                name: 'customColor',
-                required: false,
-                value: [{color: '#36c5e7'}, {color: '#e68b55'}],
-              },
-            ],
-          },
-        ],
-      ],
-      // 数据
-      data: [
-        {
-          type: 'el-radio-group',
-          label: '数据类型',
-          name: 'dataType',
-          require: false,
-          placeholder: '',
-          selectValue: true,
-          selectOptions: [
-            {
-              code: 'staticData',
-              name: '静态数据',
-            },
-            {
-              code: 'dynamicData',
-              name: '动态数据',
-            },
-          ],
-          value: 'staticData',
-        },
-        {
-          type: 'el-input-number',
-          label: '刷新时间(毫秒)',
-          name: 'refreshTime',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          value: 5000
-        },
-        {
-          type: 'el-button',
-          label: '静态数据',
-          name: 'staticData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'staticData',
-          value: [
-            {"axis":"07-25","name":"success","data":"2"},
-            {"axis":"07-25","name":"fail","data":"10"},
-            {"axis":"07-26","name":"success","data":"5"},
-            {"axis":"07-26","name":"fail","data":"20"},
-            {"axis":"07-27","name":"success","data":"15"},
-            {"axis":"07-27","name":"fail","data":"30"},
-            {"axis":"07-28","name":"success","data":"10"},
-            {"axis":"07-28","name":"fail","data":"12"},
-            {"axis":"07-29","name":"success","data":"9"},
-            {"axis":"07-29","name":"fail","data":"16"},
-          ],
-        },
-        {
-          type: 'dycustComponents',
-          label: '',
-          name: 'dynamicData',
-          required: false,
-          placeholder: 'px',
-          relactiveDom: 'dataType',
-          relactiveDomValue: 'dynamicData',
-          chartType: 'widget-stackchart',
-          dictKey: 'STACK_PROPERTIES',
-          value: '',
-        },
-      ],
-      // 坐标
-      position: [
-        {
-          type: 'el-input-number',
-          label: '左边距',
-          name: 'left',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '上边距',
-          name: 'top',
-          required: false,
-          placeholder: 'px',
-          value: 0,
-        },
-        {
-          type: 'el-input-number',
-          label: '宽度',
-          name: 'width',
-          required: false,
-          placeholder: '该容器在1920px大屏中的宽度',
-          value: 400,
-        },
-        {
-          type: 'el-input-number',
-          label: '高度',
-          name: 'height',
-          required: false,
-          placeholder: '该容器在1080px大屏中的高度',
-          value: 200,
-        },
-      ],
-    },
-  },
-]
-
-const getToolByCode = function (code) {
-  // 获取大屏底层设置属性
-  if (code == 'screen') {
-    return screenConfig
-  }
-  // 获取组件
-  var item = widgetTools.find(function (item, index, arrs) {
-    return item.code === code
-  })
-  return item
-}
-
-export {widgetTools, getToolByCode}

+ 382 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-airbubble-map.js

@@ -0,0 +1,382 @@
+/*
+ * @Descripttion: 气泡地图json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:35:32
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:36:47
+ */
+export const widgetAirbubbleMap =   {
+    code: 'widgetAirBubbleMap',
+    type: 'chart',
+    label: '气泡地图',
+    icon: 'iconzhongguoditu',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '气泡地图',
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: '#0F1C3C'
+        },
+        [
+          {
+            name: '标题设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标题',
+                name: 'isNoTitle',
+                required: false,
+                placeholder: '',
+                value: true
+              },
+              {
+                type: 'el-input-text',
+                label: '标题',
+                name: 'titleText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'textColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'textFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+              {
+                type: 'el-select',
+                label: '字体位置',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'left'
+              },
+              {
+                type: 'el-input-text',
+                label: '副标题',
+                name: 'subText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'subTextFontSize',
+                required: false,
+                placeholder: '',
+                value: 12
+              },
+            ],
+          },
+          {
+            name: '字体设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '文字大小',
+                name: 'fontTextSize',
+                required: false,
+                placeholder: '',
+                value: 15,
+              },
+              {
+                type: 'vue-color',
+                label: '文字颜色',
+                name: 'fontTextColor',
+                required: false,
+                placeholder: '',
+                value: '#D4EEFF'
+              },
+              {
+                type: 'el-select',
+                label: '文字粗细',
+                name: 'fontTextWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+              {
+                type: 'el-input-number',
+                label: '数值大小',
+                name: 'fontDataSize',
+                required: false,
+                placeholder: '',
+                value: 15,
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'fontDataColor',
+                required: false,
+                placeholder: '',
+                value: '#D4EEFF'
+              },
+              {
+                type: 'el-select',
+                label: '数值粗细',
+                name: 'fontDataWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+            ],
+          },
+          {
+            name: '气泡设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '最小半径',
+                name: 'fontminSize4Pin',
+                required: false,
+                placeholder: '',
+                value: 20,
+              },
+              {
+                type: 'el-input-number',
+                label: '最大半径',
+                name: 'fontmaxSize4Pin',
+                required: false,
+                placeholder: '',
+                value: 100,
+              },
+              /*{
+                type: 'vue-color',
+                label: '气泡颜色',
+                name: 'fontPieColor',
+                required: false,
+                placeholder: '',
+                value: ''
+              },*/
+            ],
+          },
+          {
+            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'
+              },
+            ],
+          },
+        ],
+      ],
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: [
+            {"name":"南海诸岛","value":1},
+            {"name":"北京","value":524},
+            {"name":"天津","value":14},
+            {"name":"上海","value":150},
+            {"name":"重庆","value":75},
+            {"name":"河北","value":13},
+            {"name":"河南","value":83},
+            {"name":"云南","value":11},
+            {"name":"辽宁","value":19},
+            {"name":"黑龙江","value":15},
+            {"name":"湖南","value":69},
+            {"name":"安徽","value":260},
+            {"name":"山东","value":39},
+            {"name":"新疆","value":4},
+            {"name":"江苏","value":31},
+            {"name":"浙江","value":104},
+            {"name":"江西","value":36},
+            {"name":"湖北","value":1052},
+            {"name":"广西","value":33},
+            {"name":"甘肃","value":347},
+            {"name":"山西","value":8},
+            {"name":"内蒙古","value":157},
+            {"name":"陕西","value":22},
+            {"name":"吉林","value":4},
+            {"name":"福建","value":36},
+            {"name":"贵州","value":39},
+            {"name":"广东","value":996},
+            {"name":"青海","value":27},
+            {"name":"西藏","value":31},
+            {"name":"四川","value":46},
+            {"name":"宁夏","value":16},
+            {"name":"海南","value":22},
+            {"name":"台湾","value":6},
+            {"name":"香港","value":2},
+            {"name":"澳门","value":9}],
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          chartType: 'widget-piechart',
+          dictKey: 'MAP_PROPERTIES',
+          relactiveDomValue: 'dynamicData',
+          value: '',
+        },
+      ],
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 600,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 400,
+        },
+      ]
+    }
+  }

+ 650 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-bar-compare.js

@@ -0,0 +1,650 @@
+/*
+ * @Descripttion: 柱状对比图 json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:39:35
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:39:35
+ */
+export const widgetBarCompare = {
+    code: 'widgetBarCompareChart',
+    type: 'chart',
+    label: '柱状对比图',
+    icon: 'iconduibitupu',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '柱状对比图',
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: ''
+        },
+        [
+          {
+            name: '柱体设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '最大宽度',
+                name: 'maxWidth',
+                required: false,
+                placeholder: '',
+                value: 15,
+              },
+              {
+                type: 'el-slider',
+                label: '圆角',
+                name: 'radius',
+                require: false,
+                placeholder: '',
+                value: 5,
+              },
+            ],
+          },
+          {
+            name: '标题设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标题',
+                name: 'isNoTitle',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '标题',
+                name: 'titleText',
+                required: false,
+                placeholder: '',
+                value: '',
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'textColor',
+                required: false,
+                placeholder: '',
+                value: '#FFD700'
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'textFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+              {
+                type: 'el-select',
+                label: '字体位置',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'center'
+              },
+            ],
+          },
+          {
+            name: '左X轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'hideXLeft',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-number',
+                label: '数值间隔',
+                name: 'splitNumberLeft',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'XcolorLeft',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeXLeft',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-switch',
+                label: '刻度线',
+                name: 'tickLineLeft',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'el-switch',
+                label: 'X轴线',
+                name: 'xLineLeft',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorXLeft',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: '竖分割线',
+                name: 'SplitLineLeft',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'SplitLineColorLeft',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '分割线宽度',
+                name: 'SplitLinefontSizeLeft',
+                required: false,
+                placeholder: '',
+                value: 1,
+              },
+              {
+                type: 'el-switch',
+                label: '边框线',
+                name: 'frameLineLeft',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+            ],
+          },
+          {
+            name: '右X轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'hideXRight',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-number',
+                label: '数值间隔',
+                name: 'splitNumberRight',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'XcolorRight',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeXRight',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-switch',
+                label: '刻度线',
+                name: 'tickLineRight',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'el-switch',
+                label: 'X轴线',
+                name: 'xLineRight',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorXRight',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: '竖分割线',
+                name: 'SplitLineRight',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'SplitLineColorRight',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '分割线宽度',
+                name: 'SplitLinefontSizeRight',
+                required: false,
+                placeholder: '',
+                value: 1,
+              },
+              {
+                type: 'el-switch',
+                label: '边框线',
+                name: 'frameLineRight',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+            ],
+          },
+          {
+            name: 'Y轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'hideY',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'colorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeY',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-select',
+                label: '数值对齐',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'center'
+              },
+              {
+                type: 'el-switch',
+                label: '刻度线',
+                name: 'tickLineY',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'el-switch',
+                label: 'Y轴线',
+                name: 'lineY',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+            ],
+          },
+          {
+            name: '数值设定',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShow',
+                required: false,
+                placeholder: '',
+                value: true
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: 14
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                type: 'el-select',
+                label: '字体粗细',
+                name: 'fontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+            ],
+          },
+          {
+            name: '提示语设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'tipsFontSize',
+                required: false,
+                placeholder: '',
+                value: 16
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lineColor',
+                required: false,
+                placeholder: '',
+              },
+            ],
+          },
+          {
+            name: '坐标轴边距设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '左右边距(像素)',
+                name: 'marginLeftRight',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+              {
+                type: 'el-slider',
+                label: '顶边距(像素)',
+                name: 'marginTop',
+                required: false,
+                placeholder: '',
+                value: 40,
+              },
+              {
+                type: 'el-slider',
+                label: '底边距(像素)',
+                name: 'marginBottom',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+            ],
+          },
+          {
+            name: '图例操作',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShowLegend',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lengedColor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'lengedFontSize',
+                required: false,
+                placeholder: '',
+                value: 16,
+              },
+              {
+                type: 'el-input-number',
+                label: '图例宽度',
+                name: 'lengedWidth',
+                required: false,
+                placeholder: '',
+                value: 15,
+              },
+              {
+                type: 'el-select',
+                label: '横向位置',
+                name: 'lateralPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'center'
+              },
+              {
+                type: 'el-select',
+                label: '纵向位置',
+                name: 'longitudinalPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'top', name: '顶部'},
+                  {code: 'bottom', name: '底部'},
+                ],
+                value: 'top'
+              },
+              {
+                type: 'el-select',
+                label: '布局前置',
+                name: 'layoutFront',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'vertical', name: '竖排'},
+                  {code: 'horizontal', name: '横排'},
+                ],
+                value: 'horizontal'
+              },
+            ],
+          },
+          {
+            name: '自定义配色',
+            list: [
+              {
+                type: 'customColor',
+                label: '',
+                name: 'customColor',
+                required: false,
+                value: [{color: '#36c5e7'}, {color: '#e68b55'}],
+              },
+            ],
+          },
+        ],
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: [
+            {"axis":"07-25","name":"success","data":"2"},
+            {"axis":"07-25","name":"fail","data":"10"},
+            {"axis":"07-26","name":"success","data":"5"},
+            {"axis":"07-26","name":"fail","data":"20"},
+            {"axis":"07-27","name":"success","data":"15"},
+            {"axis":"07-27","name":"fail","data":"30"},
+            {"axis":"07-28","name":"success","data":"10"},
+            {"axis":"07-28","name":"fail","data":"12"},
+            {"axis":"07-29","name":"success","data":"9"},
+            {"axis":"07-29","name":"fail","data":"16"},
+          ],
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          chartType: 'widget-stackchart',
+          dictKey: 'STACK_PROPERTIES',
+          value: '',
+        },
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 400,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 652 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-bar-stack.js

@@ -0,0 +1,652 @@
+/*
+ * @Descripttion: 柱状堆叠图
+ * @version:
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:37:09
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:37:09
+ */
+export const widgetBarStack =  {
+    code: 'widgetBarStackChart',
+    type: 'chart',
+    label: '柱状堆叠图',
+    icon: 'iconbianzu23',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '柱状堆叠图',
+        },
+        {
+          type: 'el-switch',
+          label: '竖展示',
+          name: 'verticalShow',
+          required: false,
+          placeholder: '',
+          value: false,
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: ''
+        },
+        {
+          type: 'el-select',
+          label: '堆叠样式',
+          name: 'stackStyle',
+          required: false,
+          placeholder: '',
+          selectOptions: [
+            {code: 'leftRight', name: '左右堆叠'},
+            {code: 'upDown', name: '上下堆叠'},
+          ],
+          value: 'leftRight'
+        },
+        [
+          {
+            name: '柱体设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '最大宽度',
+                name: 'maxWidth',
+                required: false,
+                placeholder: '',
+                value: 20,
+              },
+              {
+                type: 'el-slider',
+                label: '圆角',
+                name: 'radius',
+                require: false,
+                placeholder: '',
+                value: 5,
+              },
+            ],
+          },
+          {
+            name: '标题设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标题',
+                name: 'isNoTitle',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '标题',
+                name: 'titleText',
+                required: false,
+                placeholder: '',
+                value: '',
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'textColor',
+                required: false,
+                placeholder: '',
+                value: '#FFD700'
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'textFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+              {
+                type: 'el-select',
+                label: '字体位置',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'center'
+              },
+              {
+                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-select',
+                label: '字体粗细',
+                name: 'subTextFontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'subTextFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+            ],
+          },
+          {
+            name: 'X轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'hideX',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: 'X轴别名',
+                name: 'xName',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '别名颜色',
+                name: 'xNameColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                type: 'el-input-number',
+                label: '别名字号',
+                name: 'xNameFontSize',
+                required: false,
+                placeholder: '',
+                value: 14
+              },
+              {
+                type: 'el-switch',
+                label: '轴反转',
+                name: 'reversalX',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'el-slider',
+                label: '文字角度',
+                name: 'textAngleX',
+                required: false,
+                placeholder: '',
+                value: 0
+              },
+              {
+                type: 'el-input-number',
+                label: '文字间隔',
+                name: 'textInterval',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '文字颜色',
+                name: 'Xcolor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '文字字号',
+                name: 'fontSizeX',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: '分割线显示',
+                name: 'isShowSplitLineX',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'splitLineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+
+              }
+            ],
+          },
+          {
+            name: 'Y轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShowY',
+                require: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: 'Y轴别名',
+                name: 'textNameY',
+                require: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                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-switch',
+                label: '轴反转',
+                name: 'reversalY',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'el-slider',
+                label: '文字角度',
+                name: 'textAngleY',
+                required: false,
+                placeholder: '',
+                value: 0
+              },
+              {
+                type: 'vue-color',
+                label: '文字颜色',
+                name: 'colorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '文字字号',
+                name: 'fontSizeY',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: '分割线显示',
+                name: 'isShowSplitLineY',
+                require: false,
+                placeholder: '',
+                value: false,
+              }, {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'splitLineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              }
+            ],
+          },
+          {
+            name: '数值设定',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShow',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: 14
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                type: 'el-select',
+                label: '字体粗细',
+                name: 'fontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+            ],
+          },
+          {
+            name: '提示语设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'tipsFontSize',
+                required: false,
+                placeholder: '',
+                value: 16
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lineColor',
+                required: false,
+                placeholder: '',
+              },
+            ],
+          },
+          {
+            name: '坐标轴边距设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '左边距(像素)',
+                name: 'marginLeft',
+                required: false,
+                placeholder: '',
+                value: 10,
+              }, {
+                type: 'el-slider',
+                label: '顶边距(像素)',
+                name: 'marginTop',
+                required: false,
+                placeholder: '',
+                value: 50,
+              }, {
+                type: 'el-slider',
+                label: '右边距(像素)',
+                name: 'marginRight',
+                required: false,
+                placeholder: '',
+                value: 40,
+              }, {
+                type: 'el-slider',
+                label: '底边距(像素)',
+                name: 'marginBottom',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+            ],
+          },
+          {
+            name: '图例操作',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShowLegend',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lengedColor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'lengedFontSize',
+                required: false,
+                placeholder: '',
+                value: 16,
+              },
+              {
+                type: 'el-input-number',
+                label: '图例宽度',
+                name: 'lengedWidth',
+                required: false,
+                placeholder: '',
+                value: 15,
+              },
+              {
+                type: 'el-select',
+                label: '横向位置',
+                name: 'lateralPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'center'
+              },
+              {
+                type: 'el-select',
+                label: '纵向位置',
+                name: 'longitudinalPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'top', name: '顶部'},
+                  {code: 'bottom', name: '底部'},
+                ],
+                value: 'top'
+              },
+              {
+                type: 'el-select',
+                label: '布局前置',
+                name: 'layoutFront',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'vertical', name: '竖排'},
+                  {code: 'horizontal', name: '横排'},
+                ],
+                value: 'horizontal'
+              },
+            ],
+          },
+          {
+            name: '自定义配色',
+            list: [
+              {
+                type: 'customColor',
+                label: '',
+                name: 'customColor',
+                required: false,
+                value: [{color: '#ff7f50'}, {color: '#87cefa'}, {color: '#da70d6'}, {color: '#32cd32'}, {color: '#6495ed'}],
+              },
+            ],
+          },
+        ],
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: [
+            {"axis":"2021-07-25","name":"A","data":"12"},
+            {"axis":"2021-07-25","name":"B","data":"20"},
+            {"axis":"2021-07-26","name":"B","data":"5"},
+            {"axis":"2021-07-26","name":"C","data":"20"},
+            {"axis":"2021-07-27","name":"A","data":"15"},
+            {"axis":"2021-07-27","name":"B","data":"30"},
+            {"axis":"2021-07-27","name":"C","data":"5"}
+          ],
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          chartType: 'widget-stackchart',
+          dictKey: 'STACK_PROPERTIES',
+          value: '',
+        },
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 400,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 654 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-barchart.js

@@ -0,0 +1,654 @@
+/*
+ * @Descripttion: 柱状图json
+ * @version:
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:21:45
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:21:46
+ */
+export const widgetBarchart = {
+    code: 'widget-barchart',
+    type: 'chart',
+    label: '柱形图',
+    icon: 'iconzhuzhuangtu',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '柱状图',
+        },
+        {
+          type: 'el-switch',
+          label: '竖展示',
+          name: 'verticalShow',
+          required: false,
+          placeholder: '',
+          value: false,
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: ''
+        },
+        [
+          {
+            name: '柱体设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '最大宽度',
+                name: 'maxWidth',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+              {
+                type: 'el-slider',
+                label: '圆角',
+                name: 'radius',
+                require: false,
+                placeholder: '',
+                value: 5,
+              },
+              {
+                type: 'el-slider',
+                label: '最小高度',
+                name: 'minHeight',
+                require: false,
+                placeholder: '',
+                value: 0,
+              },
+            ],
+          },
+          {
+            name: '标题设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标题',
+                name: 'isNoTitle',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '标题',
+                name: 'titleText',
+                required: false,
+                placeholder: '',
+                value: '',
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'textColor',
+                required: false,
+                placeholder: '',
+                value: '#FFD700'
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'textFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+              {
+                type: 'el-select',
+                label: '字体位置',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'center'
+              },
+              {
+                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-text',
+                label: '字体粗细',
+                name: 'subTextFontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'subTextFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+            ],
+          },
+          {
+            name: 'X轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'hideX',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '坐标名',
+                name: 'xName',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '坐标名颜色',
+                name: 'nameColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                type: 'el-input-number',
+                label: '坐标字号',
+                name: 'nameFontSizeX',
+                required: false,
+                placeholder: '',
+                value: 12
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'Xcolor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeX',
+                required: false,
+                placeholder: '',
+                value: 12,
+              },
+              {
+                type: 'el-slider',
+                label: '数值角度',
+                name: 'textAngle',
+                required: false,
+                placeholder: '',
+                value: 0
+              },
+              {
+                type: 'el-input-number',
+                label: '数值间隔',
+                name: 'textInterval',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'el-switch',
+                label: '轴反转',
+                name: 'reversalX',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: '分割线显示',
+                name: 'isShowSplitLineX',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'splitLineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+
+              }
+            ],
+          },
+          {
+            name: 'Y轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShowY',
+                require: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '坐标名',
+                name: 'textNameY',
+                require: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '坐标名颜色',
+                name: 'nameColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '坐标字号',
+                name: 'nameFontSizeY',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'colorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeY',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-slider',
+                label: '数值角度',
+                name: 'ytextAngle',
+                required: false,
+                placeholder: '',
+                value: 0
+              },
+              {
+                type: 'el-switch',
+                label: '缩放',
+                name: 'scale',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'el-input-number',
+                label: '均分',
+                name: 'splitNumber',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'el-switch',
+                label: '轴反转',
+                name: 'reversalY',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              }, {
+                type: 'el-switch',
+                label: '分割线显示',
+                name: 'isShowSplitLineY',
+                require: false,
+                placeholder: '',
+                value: false,
+              }, {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'splitLineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+
+              }
+            ],
+          },
+          {
+            name: '数值设定',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShow',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: 14
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                type: 'el-select',
+                label: '字体粗细',
+                name: 'fontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+            ],
+          },
+          {
+            name: '提示语设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lineColor',
+                required: false,
+                placeholder: '',
+              },
+            ],
+          },
+          {
+            name: '坐标轴边距设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '左边距(像素)',
+                name: 'marginLeft',
+                required: false,
+                placeholder: '',
+                value: 10,
+              }, {
+                type: 'el-slider',
+                label: '顶边距(像素)',
+                name: 'marginTop',
+                required: false,
+                placeholder: '',
+                value: 50,
+              }, {
+                type: 'el-slider',
+                label: '右边距(像素)',
+                name: 'marginRight',
+                required: false,
+                placeholder: '',
+                value: 40,
+              }, {
+                type: 'el-slider',
+                label: '底边距(像素)',
+                name: 'marginBottom',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+            ],
+          },
+          {
+            name: '图例操作',
+            list: [
+              {
+                type: 'el-switch',
+                label: '图例',
+                name: 'isShowLegend',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lengedColor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'lengedFontSize',
+                required: false,
+                placeholder: '',
+                value: 16,
+              },
+              {
+                type: 'el-input-number',
+                label: '图例宽度',
+                name: 'lengedWidth',
+                required: false,
+                placeholder: '',
+                value: 15,
+              },
+              {
+                type: 'el-select',
+                label: '横向位置',
+                name: 'lateralPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: ''
+              },
+              {
+                type: 'el-select',
+                label: '纵向位置',
+                name: 'longitudinalPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'top', name: '顶部'},
+                  {code: 'bottom', name: '底部'},
+                ],
+                value: ''
+              },
+              {
+                type: 'el-select',
+                label: '布局前置',
+                name: 'layoutFront',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'vertical', name: '竖排'},
+                  {code: 'horizontal', name: '横排'},
+                ],
+                value: ''
+              },
+            ],
+          },
+          {
+            name: '自定义配色',
+            list: [
+              {
+                type: 'customColor',
+                label: '',
+                name: 'customColor',
+                required: false,
+                value: [{color: '#ff7f50'}, {color: '#87cefa'}, {color: '#da70d6'}, {color: '#32cd32'}, {color: '#6495ed'}],
+              },
+            ],
+          },
+        ],
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: {"categories": ["苹果","三星","小米","oppo","vivo"],"series": [{"name": "手机品牌","data": [1000,2229,3879,2379,4079]}]},
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          chartType: 'widget-barchart',
+          dictKey: 'BAR_PROPERTIES',
+          value: '',
+        },
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 400,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 665 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-barlinechart.js

@@ -0,0 +1,665 @@
+/*
+ * @Descripttion: 主线图
+ * @version:
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:26:48
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:26:49
+ */
+export const widgetBarlinechart = {
+    code: 'widget-barlinechart',
+    type: 'chart',
+    label: '柱线图',
+    icon: 'iconzhuxiantu',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '柱线图',
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: ''
+        },
+        [
+          {
+            name: '折线设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标记点',
+                name: 'markPoint',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-slider',
+                label: '点大小',
+                name: 'pointSize',
+                required: false,
+                placeholder: '',
+                value: 5,
+              },
+              {
+                type: 'el-switch',
+                label: '平滑曲线',
+                name: 'smoothCurve',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-switch',
+                label: '面积堆积',
+                name: 'area',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-slider',
+                label: '面积厚度',
+                name: 'areaThickness',
+                required: false,
+                placeholder: '',
+                value: 5,
+              },
+              {
+                type: 'el-slider',
+                label: '线条宽度',
+                name: 'lineWidth',
+                required: false,
+                placeholder: '',
+                value: 3,
+              },
+            ],
+          },
+          {
+            name: '柱体设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '最大宽度',
+                name: 'maxWidth',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+              {
+                type: 'el-slider',
+                label: '圆角',
+                name: 'radius',
+                require: false,
+                placeholder: '',
+                value: 5,
+              },
+              {
+                type: 'el-slider',
+                label: '最小高度',
+                name: 'minHeight',
+                require: false,
+                placeholder: '',
+                value: 0,
+              },
+            ],
+          },
+          {
+            name: '标题设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标题',
+                name: 'isNoTitle',
+                required: false,
+                placeholder: '',
+                value: true
+              },
+              {
+                type: 'el-input-text',
+                label: '标题',
+                name: 'titleText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'textColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'textFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+              {
+                type: 'el-select',
+                label: '字体位置',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'left'
+              },
+              {
+                type: 'el-input-text',
+                label: '副标题',
+                name: 'subText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'subTextFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+            ],
+          },
+          {
+            name: 'X轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'hideX',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '坐标名',
+                name: 'xName',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '坐标名颜色',
+                name: 'nameColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '坐标字号',
+                name: 'nameFontSizeX',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'Xcolor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeX',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-slider',
+                label: '数值角度',
+                name: 'textAngle',
+                required: false,
+                placeholder: '',
+                value: 0
+              },
+              {
+                type: 'el-input-number',
+                label: '数值间隔',
+                name: 'textInterval',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'el-switch',
+                label: '轴反转',
+                name: 'reversalX',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: '分割线显示',
+                name: 'isShowSplitLineX',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'splitLineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              }
+            ],
+          },
+          {
+            name: 'Y轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '左显示',
+                name: 'isShowYLeft',
+                require: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '左坐标名',
+                name: 'textNameYLeft',
+                require: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '左坐标名颜色',
+                name: 'nameColorYLeft',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '左坐标字号',
+                name: 'namefontSizeYLeft',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-input-number',
+                label: '左均分',
+                name: 'splitNumberLeft',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'el-switch',
+                label: '右显示',
+                name: 'isShowYRight',
+                require: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '右坐标名',
+                name: 'textNameYRight',
+                require: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '右坐标名颜色',
+                name: 'nameColorYRight',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '右坐标字号',
+                name: 'namefontSizeYRight',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-input-number',
+                label: '右均分',
+                name: 'splitNumberRight',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'colorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeY',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-switch',
+                label: '轴反转',
+                name: 'reversalY',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+            ],
+          },
+          {
+            name: '提示语设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: 12
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lineColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+            ],
+          },
+          {
+            name: '坐标轴边距设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '左边距(像素)',
+                name: 'marginLeft',
+                required: false,
+                placeholder: '',
+                value: 10,
+              }, {
+                type: 'el-slider',
+                label: '顶边距(像素)',
+                name: 'marginTop',
+                required: false,
+                placeholder: '',
+                value: 50,
+              }, {
+                type: 'el-slider',
+                label: '右边距(像素)',
+                name: 'marginRight',
+                required: false,
+                placeholder: '',
+                value: 40,
+              }, {
+                type: 'el-slider',
+                label: '底边距(像素)',
+                name: 'marginBottom',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+            ],
+          },
+          {
+            name: '图例操作',
+            list: [
+              {
+                type: 'el-switch',
+                label: '图例',
+                name: 'isShowLegend',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lengedColor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-text',
+                label: '字体大小',
+                name: 'lengedFontSize',
+                required: false,
+                placeholder: '',
+                value: 16,
+              },
+              {
+                type: 'el-input-number',
+                label: '图例宽度',
+                name: 'lengedWidth',
+                required: false,
+                placeholder: '',
+                value: 15,
+              },
+              {
+                type: 'el-select',
+                label: '横向位置',
+                name: 'lateralPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: ''
+              },
+              {
+                type: 'el-select',
+                label: '纵向位置',
+                name: 'longitudinalPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'top', name: '顶部'},
+                  {code: 'bottom', name: '底部'},
+                ],
+                value: ''
+              },
+              {
+                type: 'el-select',
+                label: '布局前置',
+                name: 'layoutFront',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'vertical', name: '竖排'},
+                  {code: 'horizontal', name: '横排'},
+                ],
+                value: ''
+              },
+            ],
+          },
+          {
+            name: '自定义配色',
+            list: [
+              {
+                type: 'customColor',
+                label: '',
+                name: 'customColor',
+                required: false,
+                value: [{color: '#00F4FFFF'}, {color: '#e68b55'}],
+              },
+            ],
+          },
+        ],
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: {"xAxis": ["1月", "2月", "3月", "4月", "5月","6月", "7月", "8月","9月","10月","11月","12月"],"series": [{"type": "bar","name": "货运量","data": [2.6,5.9,9,26.4,28.7,70.7,175.6,182.2,48.7,18.8,6,2.3]},{"type": "line","name": "货运总量","yAxisIndex": 1,"data": [2,2.2,3.3,4.5,6.3,10.2,20.3,23.4,23,16.5,12,6.2]}]},
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          chartType: 'widget-barlinechart',
+          dictKey: 'BAR_LINE_PROPERTIES',
+          relactiveDomValue: 'dynamicData',
+        },
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 400,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 383 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-funnel.js

@@ -0,0 +1,383 @@
+/*
+ * @Descripttion: 漏斗图 json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:29:23
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:29:23
+ */
+export const widgetFunnel = {
+    code: 'widget-funnel',
+    type: 'chart',
+    label: '漏斗图',
+    icon: 'iconloudoutu',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '漏斗图',
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: ''
+        },
+        [
+          {
+            name: '文字设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShow',
+                require: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                require: false,
+                placeholder: '',
+                value: 12,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'color',
+                require: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-select',
+                label: '字体粗细',
+                name: 'fontWeight',
+                require: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+              {
+                type: 'el-switch',
+                label: '反转',
+                name: 'reversal',
+                require: false,
+                placeholder: '',
+                value: 0
+              },
+            ],
+          },
+          {
+            name: '标题设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标题',
+                name: 'isNoTitle',
+                required: false,
+                placeholder: '',
+                value: true
+              },
+              {
+                type: 'el-input-text',
+                label: '标题',
+                name: 'titleText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'textColor',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'textFontSize',
+                required: false,
+                placeholder: '',
+                value: 12
+              },
+              {
+                type: 'el-select',
+                label: '字体位置',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'left'
+              },
+              {
+                type: 'el-input-text',
+                label: '副标题',
+                name: 'subText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'subTextFontSize',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+            ],
+          },
+          {
+            name: '提示语设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '网格线颜色',
+                name: 'lineColor',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+            ],
+          },
+          {
+            name: '图例操作',
+            list: [
+              {
+                type: 'el-switch',
+                label: '图例',
+                name: 'isShowLegend',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lengedColor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'lengedFontSize',
+                required: false,
+                placeholder: '',
+                value: 16,
+              },
+              {
+                type: 'el-input-number',
+                label: '图例宽度',
+                name: 'lengedWidth',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+              {
+                type: 'el-select',
+                label: '横向位置',
+                name: 'lateralPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: ''
+              },
+              {
+                type: 'el-select',
+                label: '纵向位置',
+                name: 'longitudinalPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'top', name: '顶部'},
+                  {code: 'bottom', name: '底部'},
+                ],
+                value: ''
+              },
+              {
+                type: 'el-select',
+                label: '布局前置',
+                name: 'layoutFront',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'vertical', name: '竖排'},
+                  {code: 'horizontal', name: '横排'},
+                ],
+                value: ''
+              },
+            ],
+          },
+          {
+            name: '自定义配色',
+            list: [
+              {
+                type: 'customColor',
+                label: '',
+                name: 'customColor',
+                required: false,
+                value: [{color: '#0CD2E6'}, {color: '#00BFA5'}, {color: '#FFC722'}, {color: '#886EFF'}, {color: '#008DEC'}],
+              },
+            ],
+          },
+        ],
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: [{"value": 60,"name": "访问"},{"value": 40, "name": "咨询"},{"value": 20, "name": "订单"},{"value": 80,"name":"点击"},{"value":100,"name":"展现"}],
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          chartType: 'widget-funnel',
+          relactiveDomValue: 'dynamicData',
+          dictKey: 'PIE_PROPERTIES',
+          value: '',
+        },
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 400,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 378 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-gauge.js

@@ -0,0 +1,378 @@
+/*
+ * @Descripttion: 仪表盘 json
+ * @version:
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:30:25
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:30:25
+ */
+export const widgetGauge = {
+  code: 'widget-gauge',
+  type: 'chart',
+  label: '仪表盘',
+  icon: 'iconyibiaopan',
+  options: {
+    // 配置
+    setup: [
+      {
+        type: 'el-input-text',
+        label: '图层名称',
+        name: 'layerName',
+        required: false,
+        placeholder: '',
+        value: '仪表盘',
+      },
+      {
+        type: 'vue-color',
+        label: '背景颜色',
+        name: 'background',
+        required: false,
+        placeholder: '',
+        value: ''
+      },
+      [
+        {
+          name: "圆环设置",
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'ringShow',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-number',
+              label: '圆环宽度',
+              name: 'pieWeight',
+              require: false,
+              placeholder: '',
+              value: 10,
+            },
+          ]
+        },
+        {
+          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)'
+            },
+          ]
+        },
+        {
+          name: "刻度线",
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'tickShow',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-number',
+              label: '距离',
+              name: 'tickDistance',
+              require: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-input-number',
+              label: '长度',
+              name: 'tickLength',
+              require: false,
+              placeholder: '',
+              value: 10,
+            },
+            {
+              type: 'el-input-number',
+              label: '宽度',
+              name: 'tickWidth',
+              require: false,
+              placeholder: '',
+              value: 2,
+            },
+          ]
+        },
+        {
+          name: "指标线",
+          list: [
+            {
+              type: 'el-switch',
+              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: '长度',
+              name: 'splitLength',
+              require: false,
+              placeholder: '',
+              value: 14,
+            },
+            {
+              type: 'el-input-number',
+              label: '宽度',
+              name: 'splitWidth',
+              require: false,
+              placeholder: '',
+              value: 4,
+            },
+          ]
+        },
+        {
+          name: "指标",
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'labelShow',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-number',
+              label: '距离',
+              name: 'labelDistance',
+              require: false,
+              placeholder: '',
+              value: 0,
+            },
+            {
+              type: 'el-input-number',
+              label: '字号',
+              name: 'labelFontSize',
+              require: false,
+              placeholder: '',
+              value: 10,
+            },
+            {
+              type: 'vue-color',
+              label: '颜色',
+              name: 'labelColor',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+          ]
+        },
+        {
+          name: "数值",
+          list: [
+            {
+              type: 'vue-color',
+              label: '颜色',
+              name: 'labelColor',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '字号',
+              name: 'labelFontSize',
+              require: false,
+              placeholder: '',
+              value: 14,
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'labelFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+          ]
+        },
+      ],
+    ],
+    // 数据
+    data: [
+      {
+        type: 'el-radio-group',
+        label: '数据类型',
+        name: 'dataType',
+        require: false,
+        placeholder: '',
+        selectValue: true,
+        selectOptions: [
+          {
+            code: 'staticData',
+            name: '静态数据',
+          },
+          {
+            code: 'dynamicData',
+            name: '动态数据',
+          },
+        ],
+        value: 'staticData',
+      },
+      {
+        type: 'el-input-number',
+        label: '刷新时间(毫秒)',
+        name: 'refreshTime',
+        relactiveDom: 'dataType',
+        relactiveDomValue: 'dynamicData',
+        value: 5000
+      },
+      {
+        type: 'el-button',
+        label: '静态数据',
+        name: 'staticData',
+        required: false,
+        placeholder: 'px',
+        relactiveDom: 'dataType',
+        relactiveDomValue: 'staticData',
+        value: 50,
+      },
+      {
+        type: 'dycustComponents',
+        label: '',
+        name: 'dynamicData',
+        required: false,
+        placeholder: 'px',
+        relactiveDom: 'dataType',
+        chartType: 'widget-text',
+        dictKey: 'TEXT_PROPERTIES',
+        relactiveDomValue: 'dynamicData',
+        value: '',
+      },
+    ],
+    // 坐标
+    position: [
+      {
+        type: 'el-input-number',
+        label: '左边距',
+        name: 'left',
+        required: false,
+        placeholder: 'px',
+        value: 0,
+      },
+      {
+        type: 'el-input-number',
+        label: '上边距',
+        name: 'top',
+        required: false,
+        placeholder: 'px',
+        value: 0,
+      },
+      {
+        type: 'el-input-number',
+        label: '宽度',
+        name: 'width',
+        required: false,
+        placeholder: '该容器在1920px大屏中的宽度',
+        value: 400,
+      },
+      {
+        type: 'el-input-number',
+        label: '高度',
+        name: 'height',
+        required: false,
+        placeholder: '该容器在1080px大屏中的高度',
+        value: 200,
+      },
+    ],
+  }
+}

+ 606 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-gradient-barchart.js

@@ -0,0 +1,606 @@
+/*
+ * @Descripttion: 柱状图渐变色 json
+ * @version:
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:23:41
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:23:42
+ */
+export const widgetGradientBarchart =  {
+    code: 'widget-gradient-color-barchart',
+    type: 'chart',
+    label: '柱形图-渐变色',
+    icon: 'iconzhuzhuangtu',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '柱形图-渐变色',
+        },
+        {
+          type: 'el-switch',
+          label: '竖展示',
+          name: 'verticalShow',
+          required: false,
+          placeholder: '',
+          value: false,
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: ''
+        },
+        [
+          {
+            name: '柱体设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '最大宽度',
+                name: 'maxWidth',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+              {
+                type: 'el-slider',
+                label: '圆角',
+                name: 'radius',
+                require: false,
+                placeholder: '',
+                value: 5,
+              },
+/*              {
+                type: 'el-slider',
+                label: '最小高度',
+                name: 'minHeight',
+                require: false,
+                placeholder: '',
+                value: 0,
+              },*/
+            ],
+          },
+          {
+            name: '标题设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标题',
+                name: 'isNoTitle',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '标题',
+                name: 'titleText',
+                required: false,
+                placeholder: '',
+                value: '',
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'textColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'textFontSize',
+                required: false,
+                placeholder: '',
+                value: 22
+              },
+              {
+                type: 'el-select',
+                label: '字体位置',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'center'
+              },
+              {
+                type: 'el-input-text',
+                label: '副标题',
+                name: 'subText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: '#90979c'
+              },
+              {
+                type: 'el-input-text',
+                label: '字体粗细',
+                name: 'subTextFontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'subTextFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+            ],
+          },
+          {
+            name: 'X轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'hideX',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '坐标名',
+                name: 'xName',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '坐标名颜色',
+                name: 'nameColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '坐标字号',
+                name: 'nameFontSizeX',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'Xcolor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeX',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-slider',
+                label: '数值角度',
+                name: 'textAngle',
+                required: false,
+                placeholder: '',
+                value: 0
+              },
+              {
+                type: 'el-input-number',
+                label: '数值间隔',
+                name: 'textInterval',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'el-switch',
+                label: '轴反转',
+                name: 'reversalX',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: '分割线显示',
+                name: 'isShowSplitLineX',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'splitLineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              }
+            ],
+          },
+          {
+            name: 'Y轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShowY',
+                require: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '坐标名',
+                name: 'textNameY',
+                require: false,
+                placeholder: '',
+                value: ''
+              },{
+                type: 'vue-color',
+                label: '坐标名颜色',
+                name: 'nameColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '坐标字号',
+                name: 'namefontSizeY',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'colorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeY',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-slider',
+                label: '数值角度',
+                name: 'ytextAngle',
+                required: false,
+                placeholder: '',
+                value: 0
+              },
+              {
+                type: 'el-switch',
+                label: '缩放',
+                name: 'scale',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'el-input-number',
+                label: '均分',
+                name: 'splitNumber',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'el-switch',
+                label: '轴反转',
+                name: 'reversalY',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: '分割线显示',
+                name: 'isShowSplitLineY',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'splitLineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              }
+            ],
+          },
+          {
+            name: '数值设定',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShow',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: 14
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                type: 'el-select',
+                label: '字体粗细',
+                name: 'fontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+            ],
+          },
+          {
+            name: '提示语设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'tipsFontSize',
+                required: false,
+                placeholder: '',
+                value: 16
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lineColor',
+                required: false,
+                placeholder: '',
+              },
+            ],
+          },
+          {
+            name: '坐标轴边距设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '左边距(像素)',
+                name: 'marginLeft',
+                required: false,
+                placeholder: '',
+                value: 10,
+              }, {
+                type: 'el-slider',
+                label: '顶边距(像素)',
+                name: 'marginTop',
+                required: false,
+                placeholder: '',
+                value: 50,
+              }, {
+                type: 'el-slider',
+                label: '右边距(像素)',
+                name: 'marginRight',
+                required: false,
+                placeholder: '',
+                value: 40,
+              }, {
+                type: 'el-slider',
+                label: '底边距(像素)',
+                name: 'marginBottom',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+            ],
+          },
+          {
+            name: '渐变色',
+            list: [
+              {
+                type: 'vue-color',
+                label: '0%处',
+                name: 'bar0color',
+                required: false,
+                placeholder: '',
+                value: '#00F4FF'
+              },
+              {
+                type: 'vue-color',
+                label: '100%处',
+                name: 'bar100color',
+                required: false,
+                placeholder: '',
+                value: '#004DA7'
+              },
+              {
+                type: 'vue-color',
+                label: '阴影颜色',
+                name: 'shadowColor',
+                required: false,
+                placeholder: '',
+                value: '#00A0DD'
+              },
+              {
+                type: 'el-input-number',
+                label: '模糊系数',
+                name: 'shadowBlur',
+                required: false,
+                placeholder: '',
+                value: 4,
+              },
+            ],
+          },
+        ],
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: {"categories": ["苹果","三星","小米","oppo","vivo"],"series": [{"name": "手机品牌","data": [1000,2229,3879,2379,4079]}]},
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          chartType: 'widget-barchart',
+          dictKey: 'BAR_PROPERTIES',
+          value: '',
+        },
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 400,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 157 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-href.js

@@ -0,0 +1,157 @@
+/*
+ * @Descripttion: 超链接文本
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:03:58
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:05:04
+ */
+export const widgetHref =  {
+    code: 'widget-href',
+    type: 'html',
+    label: '超链接',
+    icon: 'iconchaolianjie',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '超链接',
+        },
+        {
+          type: 'el-input-text',
+          label: '文本内容',
+          name: 'text',
+          required: false,
+          placeholder: '',
+          value: '超链接',
+        },
+        {
+          type: 'el-input-number',
+          label: '字体大小',
+          name: 'fontSize',
+          required: false,
+          placeholder: '',
+          value: '26',
+        },
+        {
+          type: 'vue-color',
+          label: '字体颜色',
+          name: 'color',
+          required: false,
+          placeholder: '',
+          value: '#FAD400',
+        },
+        {
+          type: 'el-input-number',
+          label: '字体间距',
+          name: 'letterSpacing',
+          required: false,
+          placeholder: '',
+          value: '0',
+        },
+        {
+          type: 'vue-color',
+          label: '字体背景',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: 'rgba(115,170,229,.5)',
+        },
+        {
+          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: 'textAlign',
+          required: false,
+          placeholder: '',
+          selectOptions: [
+            {code: 'center', name: '居中'},
+            {code: 'left', name: '左对齐'},
+            {code: 'right', name: '右对齐'},
+          ],
+          value: 'center'
+        },
+        {
+          type: 'el-radio-group',
+          label: '跳转方式',
+          name: 'jumpMode',
+          required: false,
+          placeholder: '',
+          selectOptions: [
+            {
+              code: 'self',
+              name: '本窗口',
+            },
+            {
+              code: 'other',
+              name: '新窗口',
+            },
+          ],
+          value: 'self',
+        },
+        {
+          type: 'el-input-text',
+          label: '超链地址',
+          name: 'linkAdress',
+          required: false,
+          placeholder: '',
+          value: 'http://www.baidu.com',
+        },
+      ],
+      // 数据
+      data: [],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 100,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 40,
+        },
+      ],
+    }
+  }

+ 72 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-iframe.js

@@ -0,0 +1,72 @@
+/*
+ * @Descripttion: iframe json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:17:55
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:19:02
+ */
+export const widgetIframe =  {
+    code: 'widget-iframe',
+    type: 'html',
+    label: '内联框架',
+    icon: 'iconkuangjia',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: 'iframe',
+        },
+        {
+          type: 'el-input-text',
+          label: '地址',
+          name: 'iframeAdress',
+          required: false,
+          placeholder: '',
+          value: 'https://report.anji-plus.com/index.html',
+        },
+      ],
+      // 数据
+      data: [],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 300,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 103 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-image.js

@@ -0,0 +1,103 @@
+/*
+ * @Descripttion: 图片json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:07:23
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:07:24
+ */
+export const widgetImage = {
+    code: 'widget-image',
+    type: 'html',
+    label: '图片',
+    icon: 'icontupian',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '图片',
+        },
+        {
+          type: 'el-switch',
+          label: '开启旋转',
+          name: 'startRotate',
+          required: false,
+          placeholder: '',
+          value: false,
+        },
+        {
+          type: 'el-slider',
+          label: '透明度',
+          name: 'transparency',
+          required: false,
+          placeholder: '',
+          value: 100
+        },
+        {
+          type: 'el-input-number',
+          label: '圆角',
+          name: 'borderRadius',
+          required: false,
+          placeholder: '',
+          value: '0'
+        },
+        {
+          type: 'custom-upload',
+          label: '图片地址',
+          name: 'imageAdress',
+          required: false,
+          placeholder: '',
+          value: 'http://10.108.26.197:9095/file/download/fd20d563-00aa-45e2-b5db-aff951f814ec',
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+        },
+      ],
+      // 数据
+      data: [],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 300,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 775 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-line-compare.js

@@ -0,0 +1,775 @@
+/*
+ * @Descripttion: 折线对比图 json
+ * @version:
+ * @Author: foming
+ * @Date: 2021-08-29 07:39:35
+ * @LastEditors: foming
+ * @LastEditTime: 2021-08-30
+ */
+export const widgetLineCompare = {
+  code: 'widgetLineCompareChart',
+  type: 'chart',
+  label: '折线对比图',
+  icon: 'iconzhexian',
+  options: {
+    // 配置
+    setup: [
+      {
+        type: 'el-input-text',
+        label: '图层名称',
+        name: 'layerName',
+        required: false,
+        placeholder: '',
+        value: '折线对比图',
+      },
+      {
+        type: 'vue-color',
+        label: '背景颜色',
+        name: 'background',
+        required: false,
+        placeholder: '',
+        value: ''
+      },
+      [
+        {
+          name: '折线设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '标记点',
+              name: 'markPoint',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-slider',
+              label: '点大小',
+              name: 'pointSize',
+              required: false,
+              placeholder: '',
+              value: 5,
+            },
+            {
+              type: 'el-switch',
+              label: '平滑曲线',
+              name: 'smoothCurve',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '面积堆积',
+              name: 'area',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-slider',
+              label: '面积厚度',
+              name: 'areaThickness',
+              required: false,
+              placeholder: '',
+              value: 5,
+            },
+            {
+              type: 'el-slider',
+              label: '线条宽度',
+              name: 'lineWidth',
+              required: false,
+              placeholder: '',
+              value: 2,
+            },
+          ],
+        },
+        {
+          name: '标题设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '标题',
+              name: 'isNoTitle',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-text',
+              label: '标题',
+              name: 'titleText',
+              required: false,
+              placeholder: '',
+              value: '',
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'textColor',
+              required: false,
+              placeholder: '',
+              value: '#FFD700'
+            },
+            {
+              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-input-number',
+              label: '字体大小',
+              name: 'textFontSize',
+              required: false,
+              placeholder: '',
+              value: 20
+            },
+            {
+              type: 'el-select',
+              label: '字体位置',
+              name: 'textAlign',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'center', name: '居中'},
+                {code: 'left', name: '左对齐'},
+                {code: 'right', name: '右对齐'},
+              ],
+              value: 'center'
+            },
+          ],
+        },
+        {
+          name: 'X轴设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShowX',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-text',
+              label: '坐标名',
+              name: 'xName',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'vue-color',
+              label: '坐标名颜色',
+              name: 'nameColorX',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '坐标字号',
+              name: 'nameFontSizeX',
+              required: false,
+              placeholder: '',
+              value: 14,
+            },
+            {
+              type: 'el-switch',
+              label: '数值居中',
+              name: 'boundaryX',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'vue-color',
+              label: '数值颜色',
+              name: 'colorX',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '数值字号',
+              name: 'fontSizeX',
+              required: false,
+              placeholder: '',
+              value: 14,
+            },
+            {
+              type: 'el-input-number',
+              label: '数值间隔',
+              name: 'splitNumberX',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'el-switch',
+              label: '刻度线',
+              name: 'tickLineX',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: 'X轴线',
+              name: 'lineX',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'vue-color',
+              label: '轴颜色',
+              name: 'lineColorX',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+          ],
+        },
+        {
+          name: '上y轴设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShowYTop',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-text',
+              label: '坐标名',
+              name: 'textNameYTop',
+              require: false,
+              placeholder: '',
+              value: ''
+            },{
+              type: 'vue-color',
+              label: '坐标名颜色',
+              name: 'nameColorYTop',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '坐标字号',
+              name: 'namefontSizeYTop',
+              required: false,
+              placeholder: '',
+              value: 14,
+            },
+            {
+              type: 'el-switch',
+              label: '缩放',
+              name: 'scaleYTop',
+              required: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'el-input-number',
+              label: '数值切分',
+              name: 'splitNumberYTop',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'vue-color',
+              label: '数值颜色',
+              name: 'colorYTop',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '数值字号',
+              name: 'fontSizeYTop',
+              required: false,
+              placeholder: '',
+              value: 14,
+            },
+            {
+              type: 'el-switch',
+              label: '刻度线',
+              name: 'tickLineYTop',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: 'y轴线',
+              name: 'lineYTop',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'vue-color',
+              label: '轴颜色',
+              name: 'lineColorYTop',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-switch',
+              label: '分割线',
+              name: 'splitLineYTop',
+              require: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'vue-color',
+              label: '分割线颜色',
+              name: 'splitLineColorYTop',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '分割线宽度',
+              name: 'splitLinefontSizeYTop',
+              required: false,
+              placeholder: '',
+              value: 1,
+            },
+          ],
+        },
+        {
+          name: '下y轴设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShowYBottom',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-text',
+              label: '坐标名',
+              name: 'textNameYBottom',
+              require: false,
+              placeholder: '',
+              value: ''
+            },{
+              type: 'vue-color',
+              label: '坐标名颜色',
+              name: 'nameColorYBottom',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '坐标字号',
+              name: 'namefontSizeYBottom',
+              required: false,
+              placeholder: '',
+              value: 14,
+            },
+            {
+              type: 'el-switch',
+              label: '缩放',
+              name: 'scaleYBottom',
+              required: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'el-input-number',
+              label: '数值切分',
+              name: 'splitNumberYBottom',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'vue-color',
+              label: '数值颜色',
+              name: 'colorYBottom',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '数值字号',
+              name: 'fontSizeYBottom',
+              required: false,
+              placeholder: '',
+              value: 14,
+            },
+            {
+              type: 'el-switch',
+              label: '刻度线',
+              name: 'tickLineYBottom',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: 'y轴线',
+              name: 'lineYBottom',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'vue-color',
+              label: '轴颜色',
+              name: 'lineColorYBottom',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-switch',
+              label: '分割线',
+              name: 'splitLineYBottom',
+              require: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'vue-color',
+              label: '分割线颜色',
+              name: 'splitLineColorYBottom',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '分割线宽度',
+              name: 'splitLinefontSizeYBottom',
+              required: false,
+              placeholder: '',
+              value: 1,
+            },
+          ],
+        },
+        {
+          name: '数值设定',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShow',
+              required: false,
+              placeholder: '',
+              value: true
+            },
+            {
+              type: 'el-input-number',
+              label: '字体大小',
+              name: 'fontSize',
+              required: false,
+              placeholder: '',
+              value: 14
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'subTextColor',
+              required: false,
+              placeholder: '',
+              value: '#fff'
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'fontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'normal', name: '正常'},
+                {code: 'bold', name: '粗体'},
+                {code: 'bolder', name: '特粗体'},
+                {code: 'lighter', name: '细体'}
+              ],
+              value: 'normal'
+            },
+          ],
+        },
+        {
+          name: '提示语设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'tipShow',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-select',
+              label: '类型',
+              name: 'tipType',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'line', name: '线形'},
+                {code: 'cross', name: '十字形'},
+              ],
+              value: 'line'
+            },
+            {
+              type: 'vue-color',
+              label: '颜色',
+              name: 'tipColor',
+              required: false,
+              placeholder: '#e68b55',
+            },
+          ],
+        },
+        {
+          name: '坐标轴边距设置',
+          list: [
+            {
+              type: 'el-slider',
+              label: '左边距(像素)',
+              name: 'marginLeft',
+              required: false,
+              placeholder: '',
+              value: 20,
+            },
+            {
+              type: 'el-slider',
+              label: '右边距(像素)',
+              name: 'marginRight',
+              required: false,
+              placeholder: '',
+              value: 50,
+            },
+            {
+              type: 'el-slider',
+              label: '顶边距(像素)',
+              name: 'marginTop',
+              required: false,
+              placeholder: '',
+              value: 40,
+            },
+            {
+              type: 'el-slider',
+              label: '底边距(像素)',
+              name: 'marginBottom',
+              required: false,
+              placeholder: '',
+              value: 40,
+            },
+          ],
+        },
+        {
+          name: '图例操作',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShowLegend',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'lengedColor',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '字体大小',
+              name: 'lengedFontSize',
+              required: false,
+              placeholder: '',
+              value: 16,
+            },
+            {
+              type: 'el-input-number',
+              label: '图例宽度',
+              name: 'lengedWidth',
+              required: false,
+              placeholder: '',
+              value: 15,
+            },
+            {
+              type: 'el-select',
+              label: '横向位置',
+              name: 'lateralPosition',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'center', name: '居中'},
+                {code: 'left', name: '左对齐'},
+                {code: 'right', name: '右对齐'},
+              ],
+              value: 'center'
+            },
+            {
+              type: 'el-select',
+              label: '纵向位置',
+              name: 'longitudinalPosition',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'top', name: '顶部'},
+                {code: 'bottom', name: '底部'},
+              ],
+              value: 'top'
+            },
+            {
+              type: 'el-select',
+              label: '布局前置',
+              name: 'layoutFront',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                {code: 'vertical', name: '竖排'},
+                {code: 'horizontal', name: '横排'},
+              ],
+              value: 'horizontal'
+            },
+          ],
+        },
+        {
+          name: '自定义配色',
+          list: [
+            {
+              type: 'customColor',
+              label: '',
+              name: 'customColor',
+              required: false,
+              value: [{color: '#36c5e7'}, {color: '#e68b55'}],
+            },
+          ],
+        },
+      ],
+    ],
+    // 数据
+    data: [
+      {
+        type: 'el-radio-group',
+        label: '数据类型',
+        name: 'dataType',
+        require: false,
+        placeholder: '',
+        selectValue: true,
+        selectOptions: [
+          {
+            code: 'staticData',
+            name: '静态数据',
+          },
+          {
+            code: 'dynamicData',
+            name: '动态数据',
+          },
+        ],
+        value: 'staticData',
+      },
+      {
+        type: 'el-input-number',
+        label: '刷新时间(毫秒)',
+        name: 'refreshTime',
+        relactiveDom: 'dataType',
+        relactiveDomValue: 'dynamicData',
+        value: 5000
+      },
+      {
+        type: 'el-button',
+        label: '静态数据',
+        name: 'staticData',
+        required: false,
+        placeholder: 'px',
+        relactiveDom: 'dataType',
+        relactiveDomValue: 'staticData',
+        value: [
+          {"axis":"07-25","name":"success","data":"2"},
+          {"axis":"07-25","name":"fail","data":"10"},
+          {"axis":"07-26","name":"success","data":"5"},
+          {"axis":"07-26","name":"fail","data":"20"},
+          {"axis":"07-27","name":"success","data":"15"},
+          {"axis":"07-27","name":"fail","data":"30"},
+          {"axis":"07-28","name":"success","data":"10"},
+          {"axis":"07-28","name":"fail","data":"12"},
+          {"axis":"07-29","name":"success","data":"9"},
+          {"axis":"07-29","name":"fail","data":"16"},
+        ],
+      },
+      {
+        type: 'dycustComponents',
+        label: '',
+        name: 'dynamicData',
+        required: false,
+        placeholder: 'px',
+        relactiveDom: 'dataType',
+        relactiveDomValue: 'dynamicData',
+        chartType: 'widget-stackchart',
+        dictKey: 'STACK_PROPERTIES',
+        value: '',
+      },
+    ],
+    // 坐标
+    position: [
+      {
+        type: 'el-input-number',
+        label: '左边距',
+        name: 'left',
+        required: false,
+        placeholder: 'px',
+        value: 0,
+      },
+      {
+        type: 'el-input-number',
+        label: '上边距',
+        name: 'top',
+        required: false,
+        placeholder: 'px',
+        value: 0,
+      },
+      {
+        type: 'el-input-number',
+        label: '宽度',
+        name: 'width',
+        required: false,
+        placeholder: '该容器在1920px大屏中的宽度',
+        value: 400,
+      },
+      {
+        type: 'el-input-number',
+        label: '高度',
+        name: 'height',
+        required: false,
+        placeholder: '该容器在1080px大屏中的高度',
+        value: 200,
+      },
+    ],
+  }
+}

+ 672 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-line-stack.js

@@ -0,0 +1,672 @@
+/*
+ * @Descripttion: 折线堆叠图 json
+ * @version:
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:38:17
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:38:18
+ */
+export const widgetLineStack =   {
+    code: 'widgetLineStackChart',
+    type: 'chart',
+    label: '折线堆叠图',
+    icon: 'iconduidietu',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '折线堆叠图',
+        },
+        {
+          type: 'el-switch',
+          label: '竖展示',
+          name: 'verticalShow',
+          required: false,
+          placeholder: '',
+          value: false,
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: ''
+        },
+        [
+          {
+            name: '折线设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标记点',
+                name: 'markPoint',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-slider',
+                label: '点大小',
+                name: 'pointSize',
+                required: false,
+                placeholder: '',
+                value: 5,
+              },
+              {
+                type: 'el-switch',
+                label: '平滑曲线',
+                name: 'smoothCurve',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-switch',
+                label: '面积堆积',
+                name: 'area',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-slider',
+                label: '面积厚度',
+                name: 'areaThickness',
+                required: false,
+                placeholder: '',
+                value: 5,
+              },
+              {
+                type: 'el-slider',
+                label: '线条宽度',
+                name: 'lineWidth',
+                required: false,
+                placeholder: '',
+                value: 4,
+              },
+            ],
+          },
+          {
+            name: '标题设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标题',
+                name: 'isNoTitle',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '标题',
+                name: 'titleText',
+                required: false,
+                placeholder: '',
+                value: '',
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'textColor',
+                required: false,
+                placeholder: '',
+                value: '#FFD700'
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'textFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+              {
+                type: 'el-select',
+                label: '字体位置',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'center'
+              },
+              {
+                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-select',
+                label: '字体粗细',
+                name: 'subTextFontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'subTextFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+            ],
+          },
+          {
+            name: 'X轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'hideX',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: 'X轴别名',
+                name: 'xName',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '别名颜色',
+                name: 'xNameColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                type: 'el-input-number',
+                label: '别名字号',
+                name: 'xNameFontSize',
+                required: false,
+                placeholder: '',
+                value: 14
+              },
+              {
+                type: 'el-switch',
+                label: '轴反转',
+                name: 'reversalX',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'el-slider',
+                label: '文字角度',
+                name: 'textAngleX',
+                required: false,
+                placeholder: '',
+                value: 0
+              },
+              {
+                type: 'el-input-number',
+                label: '文字间隔',
+                name: 'textInterval',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '文字颜色',
+                name: 'Xcolor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '文字字号',
+                name: 'fontSizeX',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: '分割线显示',
+                name: 'isShowSplitLineX',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'splitLineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+
+              }
+            ],
+          },
+          {
+            name: 'Y轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShowY',
+                require: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: 'Y轴别名',
+                name: 'textNameY',
+                require: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                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-switch',
+                label: '轴反转',
+                name: 'reversalY',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'el-slider',
+                label: '文字角度',
+                name: 'textAngleY',
+                required: false,
+                placeholder: '',
+                value: 0
+              },
+              {
+                type: 'vue-color',
+                label: '文字颜色',
+                name: 'colorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '文字字号',
+                name: 'fontSizeY',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              }, {
+                type: 'el-switch',
+                label: '分割线显示',
+                name: 'isShowSplitLineY',
+                require: false,
+                placeholder: '',
+                value: false,
+              }, {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'splitLineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+
+              }
+            ],
+          },
+          {
+            name: '数值设定',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShow',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: 14
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                type: 'el-select',
+                label: '字体粗细',
+                name: 'fontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+            ],
+          },
+          {
+            name: '提示语设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'tipsFontSize',
+                required: false,
+                placeholder: '',
+                value: 16
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lineColor',
+                required: false,
+                placeholder: '',
+              },
+            ],
+          },
+          {
+            name: '坐标轴边距设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '左边距(像素)',
+                name: 'marginLeft',
+                required: false,
+                placeholder: '',
+                value: 10,
+              }, {
+                type: 'el-slider',
+                label: '顶边距(像素)',
+                name: 'marginTop',
+                required: false,
+                placeholder: '',
+                value: 50,
+              }, {
+                type: 'el-slider',
+                label: '右边距(像素)',
+                name: 'marginRight',
+                required: false,
+                placeholder: '',
+                value: 40,
+              }, {
+                type: 'el-slider',
+                label: '底边距(像素)',
+                name: 'marginBottom',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+            ],
+          },
+          {
+            name: '图例操作',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShowLegend',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lengedColor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'lengedFontSize',
+                required: false,
+                placeholder: '',
+                value: 16,
+              },
+              {
+                type: 'el-input-number',
+                label: '图例宽度',
+                name: 'lengedWidth',
+                required: false,
+                placeholder: '',
+                value: 15,
+              },
+              {
+                type: 'el-select',
+                label: '横向位置',
+                name: 'lateralPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'center'
+              },
+              {
+                type: 'el-select',
+                label: '纵向位置',
+                name: 'longitudinalPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'top', name: '顶部'},
+                  {code: 'bottom', name: '底部'},
+                ],
+                value: 'top'
+              },
+              {
+                type: 'el-select',
+                label: '布局前置',
+                name: 'layoutFront',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'vertical', name: '竖排'},
+                  {code: 'horizontal', name: '横排'},
+                ],
+                value: 'horizontal'
+              },
+            ],
+          },
+          {
+            name: '自定义配色',
+            list: [
+              {
+                type: 'customColor',
+                label: '',
+                name: 'customColor',
+                required: false,
+                value: [{color: '#ff7f50'}, {color: '#87cefa'}, {color: '#da70d6'}, {color: '#32cd32'}, {color: '#6495ed'}],
+              },
+            ],
+          },
+        ],
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: [
+            {"axis":"2021-07-25","name":"A","data":"12"},
+            {"axis":"2021-07-25","name":"B","data":"20"},
+            {"axis":"2021-07-26","name":"B","data":"5"},
+            {"axis":"2021-07-26","name":"C","data":"20"},
+            {"axis":"2021-07-27","name":"A","data":"15"},
+            {"axis":"2021-07-27","name":"B","data":"30"},
+            {"axis":"2021-07-27","name":"C","data":"5"}
+          ],
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          chartType: 'widget-stackchart',
+          dictKey: 'STACK_PROPERTIES',
+          value: '',
+        },
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 400,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 674 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-linechart.js

@@ -0,0 +1,674 @@
+/*
+ * @Descripttion: 折线图json
+ * @version:
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:24:48
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:24:49
+ */
+export const widgetLinechart = {
+    code: 'widget-linechart',
+    type: 'chart',
+    label: '折线图',
+    icon: 'icontubiaozhexiantu',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '折线图',
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: ''
+        },
+        [
+          {
+            name: '折线设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标记点',
+                name: 'markPoint',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-slider',
+                label: '点大小',
+                name: 'pointSize',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+              {
+                type: 'el-switch',
+                label: '平滑曲线',
+                name: 'smoothCurve',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-switch',
+                label: '面积堆积',
+                name: 'area',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-slider',
+                label: '面积厚度',
+                name: 'areaThickness',
+                required: false,
+                placeholder: '',
+                value: 5,
+              },
+              {
+                type: 'el-slider',
+                label: '线条宽度',
+                name: 'lineWidth',
+                required: false,
+                placeholder: '',
+                value: 4,
+              },
+            ],
+          },
+          {
+            name: '标题设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标题',
+                name: 'isNoTitle',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'el-input-text',
+                label: '标题',
+                name: 'titleText',
+                required: false,
+                placeholder: '',
+                value: '',
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'textColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                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-input-number',
+                label: '字体字号',
+                name: 'textFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+              {
+                type: 'el-select',
+                label: '字体位置',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'center'
+              },
+              {
+                type: 'el-input-text',
+                label: '副标题',
+                name: 'subText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                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-input-number',
+                label: '字体字号',
+                name: 'subTextFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+            ],
+          },
+          {
+            name: 'X轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'hideX',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '坐标名',
+                name: 'xName',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '坐标名颜色',
+                name: 'nameColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '坐标字号',
+                name: 'nameFontSizeX',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'Xcolor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeX',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-slider',
+                label: '数值角度',
+                name: 'textAngle',
+                required: false,
+                placeholder: '',
+                value: 0
+              },
+              {
+                type: 'el-input-number',
+                label: '数值间隔',
+                name: 'textInterval',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'el-switch',
+                label: '轴反转',
+                name: 'reversalX',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: '分割线显示',
+                name: 'isShowSplitLineX',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'splitLineColorX',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              }
+            ],
+          },
+          {
+            name: 'Y轴设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShowY',
+                require: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'el-input-text',
+                label: '坐标名',
+                name: 'textNameY',
+                require: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '坐标名颜色',
+                name: 'nameColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '坐标字号',
+                name: 'namefontSizeY',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'colorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字号',
+                name: 'fontSizeY',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'el-slider',
+                label: '数值角度',
+                name: 'ytextAngle',
+                required: false,
+                placeholder: '',
+                value: 0
+              },
+              {
+                type: 'el-switch',
+                label: '缩放',
+                name: 'scale',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'el-input-number',
+                label: '均分',
+                name: 'splitNumber',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'el-switch',
+                label: '轴反转',
+                name: 'reversalY',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'vue-color',
+                label: '轴颜色',
+                name: 'lineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-switch',
+                label: '分割线显示',
+                name: 'isShowSplitLineY',
+                require: false,
+                placeholder: '',
+                value: false,
+              },
+              {
+                type: 'vue-color',
+                label: '分割线颜色',
+                name: 'splitLineColorY',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              }
+            ],
+          },
+          {
+            name: '数值设定',
+            list: [
+              {
+                type: 'el-switch',
+                label: '显示',
+                name: 'isShow',
+                required: false,
+                placeholder: '',
+                value: false
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: 12
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                type: 'el-select',
+                label: '字体粗细',
+                name: 'fontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+            ],
+          },
+          {
+            name: '提示语设置',
+            list: [
+              {
+                type: 'el-input-text',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lineColor',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+            ],
+          },
+          {
+            name: '坐标轴边距设置',
+            list: [
+              {
+                type: 'el-slider',
+                label: '左边距(像素)',
+                name: 'marginLeft',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+              {
+                type: 'el-slider',
+                label: '顶边距(像素)',
+                name: 'marginTop',
+                required: false,
+                placeholder: '',
+                value: 50,
+              },
+              {
+                type: 'el-slider',
+                label: '右边距(像素)',
+                name: 'marginRight',
+                required: false,
+                placeholder: '',
+                value: 40,
+              },
+              {
+                type: 'el-slider',
+                label: '底边距(像素)',
+                name: 'marginBottom',
+                required: false,
+                placeholder: '',
+                value: 10,
+              },
+            ],
+          },
+          {
+            name: '图例操作',
+            list: [
+              {
+                type: 'el-switch',
+                label: '图例',
+                name: 'isShowLegend',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lengedColor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'lengedFontSize',
+                required: false,
+                placeholder: '',
+                value: 16,
+              },
+              {
+                type: 'el-input-number',
+                label: '图例宽度',
+                name: 'lengedWidth',
+                required: false,
+                placeholder: '',
+                value: 15,
+              },
+              {
+                type: 'el-select',
+                label: '横向位置',
+                name: 'lateralPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'left'
+              },
+              {
+                type: 'el-select',
+                label: '纵向位置',
+                name: 'longitudinalPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'top', name: '顶部'},
+                  {code: 'bottom', name: '底部'},
+                ],
+                value: ''
+              },
+              {
+                type: 'el-select',
+                label: '布局前置',
+                name: 'layoutFront',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'vertical', name: '竖排'},
+                  {code: 'horizontal', name: '横排'},
+                ],
+                value: ''
+              },
+            ],
+          },
+          {
+            name: '自定义配色',
+            list: [
+              {
+                type: 'customColor',
+                label: '',
+                name: 'customColor',
+                required: false,
+                value: [{color: '#1E90FF'}],
+              },
+            ],
+          },
+        ],
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: {"categories": ["苹果","三星","小米","oppo","vivo"],"series": [{"name": "手机品牌","data": [1009,3409,2309,5409,3409]}]},
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          chartType: 'widget-linechart',
+          dictKey: 'LINE_PROPERTIES',
+          relactiveDomValue: 'dynamicData',
+        },
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 400,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 61 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-map.js

@@ -0,0 +1,61 @@
+/*
+ * @Descripttion: 中国地图 json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:31:21
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:31:21
+ */
+export const widgetMap = {
+    code: 'widget-map',
+    type: 'chart',
+    label: '中国地图',
+    icon: 'iconzhongguoditu',
+    options: {
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '迁徙图',
+        },
+      ],
+      data: [],
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 600,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 400,
+        },
+      ]
+    }
+  }

+ 176 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-marquee.js

@@ -0,0 +1,176 @@
+/*
+ * @Descripttion: 滚动文件json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:00:00
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:04:32
+ */
+export const widgetMarquee = {
+    code: 'widget-marquee',
+    type: 'html',
+    label: '滚动文本',
+    icon: 'iconhengxiangwenzi',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '跑马灯',
+        },
+        {
+          type: 'el-input-text',
+          label: '文本内容',
+          name: 'text',
+          required: false,
+          placeholder: '',
+          value: '滚动文本',
+        },
+        {
+          type: 'el-input-number',
+          label: '字体大小',
+          name: 'fontSize',
+          required: false,
+          placeholder: '',
+          value: '26',
+        },
+        {
+          type: 'vue-color',
+          label: '字体颜色',
+          name: 'color',
+          required: false,
+          placeholder: '',
+          value: '#FAD400',
+        },
+        {
+          type: 'el-input-number',
+          label: '字体间距',
+          name: 'letterSpacing',
+          required: false,
+          placeholder: '',
+          value: '0',
+        },
+        {
+          type: 'vue-color',
+          label: '字体背景',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: 'rgba(115,170,229,.5)',
+        },
+        {
+          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-input-number',
+          label: '滚动速度',
+          name: 'jScrollPane',
+          //required: false,
+          placeholder: '',
+          value: '50',
+        }*/
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: '文本框',
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          chartType: 'widget-text',
+          dictKey: 'TEXT_PROPERTIES',
+          value: '',
+        }
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 100,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 40,
+        },
+      ],
+    }
+  }

+ 403 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-pie-nightingale.js

@@ -0,0 +1,403 @@
+/*
+ * @Descripttion: 南丁格尔玫瑰图 json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:32:40
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:32:40
+ */
+export const WidgetPieNightingale = {
+    code: 'WidgetPieNightingaleRoseArea',
+    type: 'chart',
+    label: '南丁格尔玫瑰图',
+    icon: 'iconnandinggeermeiguitu',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '南丁格尔玫瑰图',
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: ''
+        },
+        {
+          type: 'el-select',
+          label: '饼图模式',
+          name: 'nightingleRosetype',
+          required: false,
+          placeholder: '',
+          selectOptions: [
+            {code: 'area', name: '面积模式'},
+            {code: 'radius', name: '半径模式'},
+          ],
+          value: 'area'
+        },
+        [
+          {
+            name: '标题设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标题',
+                name: 'isNoTitle',
+                required: false,
+                placeholder: '',
+                value: true
+              },
+              {
+                type: 'el-input-text',
+                label: '标题',
+                name: 'titleText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'textColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'textFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+              {
+                type: 'el-select',
+                label: '字体位置',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'left'
+              },
+              {
+                type: 'el-input-text',
+                label: '副标题',
+                name: 'subText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'subTextFontSize',
+                required: false,
+                placeholder: '',
+                value: 12
+              },
+            ],
+          },
+          {
+            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: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                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'
+              },
+            ],
+          },
+          {
+            name: '提示语设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: 12
+              },
+              {
+                type: 'vue-color',
+                label: '网格线颜色',
+                name: 'lineColor',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+            ],
+          },
+          {
+            name: '图例操作',
+            list: [
+              {
+                type: 'el-switch',
+                label: '图例',
+                name: 'isShowLegend',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lengedColor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'lengedFontSize',
+                required: false,
+                placeholder: '',
+                value: 16,
+              },
+              {
+                type: 'el-input-number',
+                label: '图例宽度',
+                name: 'lengedWidth',
+                required: false,
+                placeholder: '',
+                value: 15,
+              },
+              {
+                type: 'el-select',
+                label: '横向位置',
+                name: 'lateralPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: ''
+              },
+              {
+                type: 'el-select',
+                label: '纵向位置',
+                name: 'longitudinalPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'top', name: '顶部'},
+                  {code: 'bottom', name: '底部'},
+                ],
+                value: ''
+              },
+              {
+                type: 'el-select',
+                label: '布局前置',
+                name: 'layoutFront',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'vertical', name: '竖排'},
+                  {code: 'horizontal', name: '横排'},
+                ],
+                value: ''
+              },
+            ],
+          },
+          {
+            name: '自定义配色',
+            list: [
+              {
+                type: 'customColor',
+                label: '',
+                name: 'customColor',
+                required: false,
+                value: [{color: '#FF801C'}, {color: '#F5FF46'}, {color: '#00FE65'}, {color: '#00FEFF'}, {color: '#ffa800'}]
+              },
+            ],
+          },
+        ],
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: [{"value": 1048,"name": "搜索引擎"},{"value": 735, "name": "直接访问"},{"value": 580, "name": "邮件营销"},{"value": 484,"name":"联盟广告"},{"value":300,"name":"视频广告"}],
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          chartType: 'widget-piechart',
+          dictKey: 'PIE_PROPERTIES',
+          relactiveDomValue: 'dynamicData',
+          value: '',
+        },
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 400,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 255 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-pie-percentage.js

@@ -0,0 +1,255 @@
+/*
+ * @Descripttion: 百分比图 json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:34:01
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:34:02
+ */
+export const widgetPiePercentage = {
+    code: 'widgetPiePercentageChart',
+    type: 'chart',
+    label: '百分比图',
+    icon: 'iconbaifenbi',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '百分比图',
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: ''
+        },
+        [
+          {
+            name: '数值设置',
+            list: [
+              {
+                type: 'vue-color',
+                label: '数值颜色',
+                name: 'textNumColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                type: 'el-input-number',
+                label: '数值字体',
+                name: 'textNumFontSize',
+                required: false,
+                placeholder: '',
+                value: 40
+              },
+              {
+                type: 'el-select',
+                label: '字体粗细',
+                name: 'textNumFontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              },
+              {
+                type: 'vue-color',
+                label: '%号颜色',
+                name: 'textPerColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                type: 'el-input-number',
+                label: '%号字体',
+                name: 'textPerFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+              {
+                type: 'el-select',
+                label: '字体粗细',
+                name: 'textPerFontWeight',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'normal', name: '正常'},
+                  {code: 'bold', name: '粗体'},
+                  {code: 'bolder', name: '特粗体'},
+                  {code: 'lighter', name: '细体'}
+                ],
+                value: 'normal'
+              }
+            ],
+          },
+          {
+            name: '圆环设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '刻度数量',
+                name: 'lineNumber',
+                required: false,
+                placeholder: '',
+                value: 8
+              },
+              {
+                type: 'el-input-number',
+                label: '刻度长度',
+                name: 'lineLength',
+                required: false,
+                placeholder: '',
+                value: 15
+              },
+              {
+                type: 'el-input-number',
+                label: '刻度宽度',
+                name: 'lineWidth',
+                required: false,
+                placeholder: '',
+                value: 5
+              },
+              {
+                type: 'vue-color',
+                label: '刻度颜色',
+                name: 'lineColor',
+                required: false,
+                placeholder: '',
+                value: '#061740'
+              },
+            ]
+          },
+          {
+            name: '渐变色',
+            list: [
+              {
+                type: 'vue-color',
+                label: '0%处颜色',
+                name: 'color0Start',
+                required: false,
+                placeholder: '',
+                value: '#4FADFD'
+              },
+              {
+                type: 'vue-color',
+                label: '100%颜色',
+                name: 'color100End',
+                required: false,
+                placeholder: '',
+                value: '#28E8FA'
+              },
+              {
+                type: 'vue-color',
+                label: '余处颜色',
+                name: 'colorsurplus',
+                required: false,
+                placeholder: '',
+                value: '#173164'
+              },
+            ]
+          }
+        ],
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: 60,
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          chartType: 'widget-piechart',
+          dictKey: 'TEXT_PROPERTIES',
+          relactiveDomValue: 'dynamicData',
+          value: '',
+        },
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 400,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 403 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-piechart.js

@@ -0,0 +1,403 @@
+/*
+ * @Descripttion: 饼图
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:28:20
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:28:20
+ */
+export const widgetPiechart =   {
+    code: 'widget-piechart',
+    type: 'chart',
+    label: '饼图',
+    icon: 'iconicon_tubiao_bingtu',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '饼图',
+        },
+        {
+          type: 'vue-color',
+          label: '背景颜色',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: ''
+        },
+        {
+          type: 'el-select',
+          label: '饼图样式',
+          name: 'piechartStyle',
+          required: false,
+          placeholder: '',
+          selectOptions: [
+            {code: 'shixin', name: '实心饼图'},
+            {code: 'kongxin', name: '空心饼图'},
+          ],
+          value: 'shixin'
+        },
+        [
+          {
+            name: '标题设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '标题',
+                name: 'isNoTitle',
+                required: false,
+                placeholder: '',
+                value: true
+              },
+              {
+                type: 'el-input-text',
+                label: '标题',
+                name: 'titleText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'textColor',
+                required: false,
+                placeholder: '',
+                value: '#fff'
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'textFontSize',
+                required: false,
+                placeholder: '',
+                value: 20
+              },
+              {
+                type: 'el-select',
+                label: '字体位置',
+                name: 'textAlign',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'center', name: '居中'},
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: 'left'
+              },
+              {
+                type: 'el-input-text',
+                label: '副标题',
+                name: 'subText',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+              {
+                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-input-number',
+                label: '字体大小',
+                name: 'subTextFontSize',
+                required: false,
+                placeholder: '',
+                value: 12
+              },
+            ],
+          },
+          {
+            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: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: 14,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'subTextColor',
+                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'
+              },
+            ],
+          },
+          {
+            name: '提示语设置',
+            list: [
+              {
+                type: 'el-input-number',
+                label: '字体大小',
+                name: 'fontSize',
+                required: false,
+                placeholder: '',
+                value: 12
+              },
+              {
+                type: 'vue-color',
+                label: '网格线颜色',
+                name: 'lineColor',
+                required: false,
+                placeholder: '',
+                value: ''
+              },
+            ],
+          },
+          {
+            name: '图例操作',
+            list: [
+              {
+                type: 'el-switch',
+                label: '图例',
+                name: 'isShowLegend',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'vue-color',
+                label: '字体颜色',
+                name: 'lengedColor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'el-input-text',
+                label: '字体大小',
+                name: 'lengedFontSize',
+                required: false,
+                placeholder: '',
+                value: 16,
+              },
+              {
+                type: 'el-input-number',
+                label: '图例宽度',
+                name: 'lengedWidth',
+                required: false,
+                placeholder: '',
+                value: 15,
+              },
+              {
+                type: 'el-select',
+                label: '横向位置',
+                name: 'lateralPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'left', name: '左对齐'},
+                  {code: 'right', name: '右对齐'},
+                ],
+                value: ''
+              },
+              {
+                type: 'el-select',
+                label: '纵向位置',
+                name: 'longitudinalPosition',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'top', name: '顶部'},
+                  {code: 'bottom', name: '底部'},
+                ],
+                value: ''
+              },
+              {
+                type: 'el-select',
+                label: '布局前置',
+                name: 'layoutFront',
+                required: false,
+                placeholder: '',
+                selectOptions: [
+                  {code: 'vertical', name: '竖排'},
+                  {code: 'horizontal', name: '横排'},
+                ],
+                value: ''
+              },
+            ],
+          },
+          {
+            name: '自定义配色',
+            list: [
+              {
+                type: 'customColor',
+                label: '',
+                name: 'customColor',
+                required: false,
+                value: [{color: '#0CD2E6'}, {color: '#00BFA5'}, {color: '#FFC722'}, {color: '#886EFF'}, {color: '#008DEC'}],
+              },
+            ],
+          },
+        ],
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: [{"value": 1048,"name": "搜索引擎"},{"value": 735, "name": "直接访问"},{"value": 580, "name": "邮件营销"},{"value": 484,"name":"联盟广告"},{"value":300,"name":"视频广告"}]
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          chartType: 'widget-piechart',
+          relactiveDomValue: 'dynamicData',
+          dictKey: 'PIE_PROPERTIES',
+          value: '',
+        },
+      ],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 400,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 87 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-slider.js

@@ -0,0 +1,87 @@
+/*
+ * @Descripttion: 轮播图
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:08:53
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:08:55
+ */
+export const widgetSliders =  {
+    code: 'widget-slider',
+    type: 'html',
+    label: '轮播图片',
+    icon: 'slider',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+        },
+        {
+          type: 'el-switch',
+          label: '隐藏图层',
+          name: 'hideLayer',
+          required: false,
+          placeholder: '',
+        },
+        {
+          type: 'el-select',
+          label: '轮播方向',
+          name: 'tabDirection',
+          required: false,
+          placeholder: '',
+        },
+        {
+          type: 'el-select',
+          label: '选择器',
+          name: 'tabSelector',
+          required: false,
+          placeholder: '',
+        },
+        {
+          type: 'el-input-number',
+          label: '轮播时间',
+          name: 'tabTime',
+          required: false,
+          placeholder: '',
+        },
+      ],
+      // 数据
+      data: [],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: true,
+          placeholder: 'px',
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: true,
+          placeholder: 'px',
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: true,
+          placeholder: '该容器在1920px大屏中的宽度',
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: true,
+          placeholder: '该容器在1080px大屏中的高度',
+        },
+      ],
+    }
+  }

+ 268 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-table.js

@@ -0,0 +1,268 @@
+/*
+ * @Descripttion: 表格json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:16:10
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:17:17
+ */
+export const widgetTable = {
+    code: 'widget-table',
+    type: 'html',
+    label: '表格',
+    icon: 'iconbiaoge',
+    options: {
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '表格',
+        },
+        {
+          type: 'el-select',
+          label: '字体位置',
+          name: 'textAlign',
+          required: false,
+          placeholder: '',
+          selectOptions: [
+            {code: 'center', name: '居中'},
+            {code: 'left', name: '左对齐'},
+            {code: 'right', name: '右对齐'},
+          ],
+          value: 'center'
+        },
+        {
+          type: 'el-input-number',
+          label: '字体大小',
+          name: 'fontSize',
+          required: false,
+          placeholder: '',
+          value: '16'
+        },
+        {
+          type: 'el-switch',
+          label: '开启滚动',
+          name: 'isRoll',
+          required: false,
+          placeholder: '',
+          value: true
+        },
+        {
+          type: 'el-input-number',
+          label: '滚动时间(毫秒)',
+          name: 'rollTime',
+          required: false,
+          placeholder: '',
+          value: 1000
+        },
+        {
+          type: 'el-input-number',
+          label: '滚动个数',
+          name: 'rollNumber',
+          required: false,
+          placeholder: '',
+          value: 1
+        },
+        {
+          type: 'el-switch',
+          label: '线条',
+          name: 'isLine',
+          required: false,
+          placeholder: '',
+          value: false
+        },
+        {
+          type: 'el-input-number',
+          label: '边框宽度',
+          name: 'borderWidth',
+          required: false,
+          placeholder: '',
+          value: 1
+        },
+        {
+          type: 'vue-color',
+          label: '边框颜色',
+          name: 'borderColor',
+          required: false,
+          placeholder: '',
+          value: '#fff'
+        },
+        [
+          {
+            name: '表头设置',
+            list: [
+              {
+                type: 'el-switch',
+                label: '表头显隐',
+                name: 'isHeader',
+                required: false,
+                placeholder: '',
+                value: true,
+              },
+              {
+                type: 'vue-color',
+                label: '表头颜色',
+                name: 'headColor',
+                require: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'vue-color',
+                label: '表头背景',
+                name: 'headBackColor',
+                require: false,
+                placeholder: '',
+                value: '#0a73ff',
+              },
+            ],
+          },
+          {
+            name: '表体设置',
+            list: [
+              {
+                type: 'vue-color',
+                label: '文字颜色',
+                name: 'bodyColor',
+                required: false,
+                placeholder: '',
+                value: '#fff',
+              },
+              {
+                type: 'vue-color',
+                label: '表格背景',
+                name: 'tableBgColor',
+                require: false,
+                placeholder: '',
+                value: '',
+              },
+              {
+                type: 'vue-color',
+                label: '奇行颜色',
+                name: 'oldColor',
+                require: false,
+                placeholder: '',
+                value: '#0a2732',
+              },
+              {
+                type: 'vue-color',
+                label: '偶行颜色',
+                name: 'eventColor',
+                required: false,
+                placeholder: '',
+                value: '#003b51'
+              }
+            ],
+          },
+        ],
+        {
+          type: 'dynamic-add-table',
+          label: '',
+          name: 'dynamicAddTable',
+          required: false,
+          placeholder: '',
+          value: [{name: '日期', key: 'date', width: 200}, {name: '姓名', key: 'name', width: 200}, {
+            name: '地址',
+            key: 'address',
+            width: '200'
+          }]
+        }
+      ],
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: [
+            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
+            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
+            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
+            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
+            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
+            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
+            {date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'},
+          ],
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          chartType: 'widget-table',
+          dictKey: 'TEXT_PROPERTIES', //表格的暂不起作用
+          value: '',
+        },
+      ],
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 600,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 300,
+        },
+      ]
+    }
+  }

+ 182 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-text.js

@@ -0,0 +1,182 @@
+/*
+ * @Descripttion: 文本json文件
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 06:52:13
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:01:07
+ */
+export const widgetText =  {
+    code: 'widget-text',
+    type: 'html',
+    label: '文本',
+    icon: 'iconziyuan',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '文本框',
+        },
+        {
+          type: 'el-input-text',
+          label: '文本内容',
+          name: 'text',
+          required: false,
+          placeholder: '',
+          value: '文本框',
+        },
+        {
+          type: 'el-input-number',
+          label: '字体大小',
+          name: 'fontSize',
+          required: false,
+          placeholder: '',
+          value: '26',
+        },
+        {
+          type: 'vue-color',
+          label: '字体颜色',
+          name: 'color',
+          required: false,
+          placeholder: '',
+          value: '#FAD400',
+        },
+        {
+          type: 'el-input-number',
+          label: '字体间距',
+          name: 'letterSpacing',
+          required: false,
+          placeholder: '',
+          value: '0',
+        },
+        {
+          type: 'vue-color',
+          label: '字体背景',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: 'rgba(115,170,229,.0)',
+        },
+        {
+          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: 'textAlign',
+          required: false,
+          placeholder: '',
+          selectOptions: [
+            {code: 'center', name: '居中'},
+            {code: 'left', name: '左对齐'},
+            {code: 'right', name: '右对齐'},
+          ],
+          value: 'center'
+        },
+      ],
+      // 数据
+      data: [
+        {
+          type: 'el-radio-group',
+          label: '数据类型',
+          name: 'dataType',
+          require: false,
+          placeholder: '',
+          selectValue: true,
+          selectOptions: [
+            {
+              code: 'staticData',
+              name: '静态数据',
+            },
+            {
+              code: 'dynamicData',
+              name: '动态数据',
+            },
+          ],
+          value: 'staticData',
+        },
+        {
+          type: 'el-input-number',
+          label: '刷新时间(毫秒)',
+          name: 'refreshTime',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          value: 5000
+        },
+        {
+          type: 'el-button',
+          label: '静态数据',
+          name: 'staticData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'staticData',
+          value: '文本框',
+        },
+        {
+          type: 'dycustComponents',
+          label: '',
+          name: 'dynamicData',
+          required: false,
+          placeholder: 'px',
+          relactiveDom: 'dataType',
+          relactiveDomValue: 'dynamicData',
+          chartType: 'widget-text',
+          dictKey: 'TEXT_PROPERTIES',
+          value: '',
+        }
+      ],
+
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 100,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 40
+        },
+      ],
+    }
+  }

+ 143 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-time.js

@@ -0,0 +1,143 @@
+/*
+ * @Descripttion: 时间控件json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:05:52
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:05:53
+ */
+export const widgetTime =  {
+    code: 'widget-time',
+    type: 'html',
+    label: '当前时间',
+    icon: 'iconshijian',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: '当前时间',
+        },
+        {
+          type: 'el-select',
+          label: '时间格式',
+          name: 'timeFormat',
+          required: false,
+          placeholder: '',
+          selectOptions: [
+            {code: 'yyyy-MM-dd', name: '日期'},
+            {code: 'yyyy-MM-dd hh:mm', name: '日期+时分'},
+            {code: 'yyyy-MM-dd hh:mm:ss', name: '日期+时分秒'},
+            {code: 'MM-dd', name: '日期无年'},
+            {code: 'hh:mm', name: '时分'},
+            {code: 'hh:mm:ss', name: '时分秒'},
+            {code: 'year-week', name: '日期+星期'},
+            {code: 'year-h-m-week', name: '日期+时分+星期'},
+            {code: 'year-h-m-s-week', name: '日期+时分秒+星期'},
+            {code: 'week', name: '星期'}
+          ],
+          value: 'yyyy-MM-dd hh:mm:ss'
+        },
+        {
+          type: 'el-input-number',
+          label: '字体间距',
+          name: 'letterSpacing',
+          required: false,
+          placeholder: '',
+          value: '0'
+        },
+        {
+          type: 'el-input-number',
+          label: '字体大小',
+          name: 'fontSize',
+          required: false,
+          placeholder: '',
+          value: '26'
+        },
+        {
+          type: 'vue-color',
+          label: '字体颜色',
+          name: 'color',
+          required: false,
+          placeholder: '',
+          value: '#FAD400'
+        },
+        {
+          type: 'vue-color',
+          label: '字体背景',
+          name: 'background',
+          required: false,
+          placeholder: '',
+          value: 'rgba(115,170,229,.5)'
+        },
+        {
+          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: 'textAlign',
+          required: false,
+          placeholder: '',
+          selectOptions: [
+            {code: 'center', name: '居中'},
+            {code: 'left', name: '左对齐'},
+            {code: 'right', name: '右对齐'},
+          ],
+          value: 'left'
+        },
+      ],
+      // 数据
+      data: [],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 300,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 100,
+        },
+      ],
+    }
+  }

+ 14 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-universal.js

@@ -0,0 +1,14 @@
+/*
+ * @Descripttion: 全能组件json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:20:11
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:26:02
+ */
+export const widgetUniversal = {
+    code: 'widget-universal',
+    type: 'html',
+    label: '全能组件',
+    icon: 'univresal',
+  }

+ 72 - 0
report-ui/src/views/report/bigscreen/designer/tools/componentsJSON/widget-video.js

@@ -0,0 +1,72 @@
+/*
+ * @Descripttion: 视频json
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:10:22
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:10:23
+ */
+export const widgetVideo =  {
+    code: 'widget-video',
+    type: 'html',
+    label: '视频',
+    icon: 'iconshipin',
+    options: {
+      // 配置
+      setup: [
+        {
+          type: 'el-input-text',
+          label: '图层名称',
+          name: 'layerName',
+          required: false,
+          placeholder: '',
+          value: 'video',
+        },
+        {
+          type: 'el-input-text',
+          label: '地址',
+          name: 'videoAdress',
+          required: false,
+          placeholder: '',
+          value: 'https://www.w3school.com.cn//i/movie.ogg',
+        },
+      ],
+      // 数据
+      data: [],
+      // 坐标
+      position: [
+        {
+          type: 'el-input-number',
+          label: '左边距',
+          name: 'left',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '上边距',
+          name: 'top',
+          required: false,
+          placeholder: 'px',
+          value: 0,
+        },
+        {
+          type: 'el-input-number',
+          label: '宽度',
+          name: 'width',
+          required: false,
+          placeholder: '该容器在1920px大屏中的宽度',
+          value: 300,
+        },
+        {
+          type: 'el-input-number',
+          label: '高度',
+          name: 'height',
+          required: false,
+          placeholder: '该容器在1080px大屏中的高度',
+          value: 200,
+        },
+      ],
+    }
+  }

+ 85 - 0
report-ui/src/views/report/bigscreen/designer/tools/index.js

@@ -0,0 +1,85 @@
+/*
+ * @Descripttion: 主文件
+ * @version: 
+ * @Author: qianlishi
+ * @Date: 2021-08-29 06:43:07
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 08:00:59
+ */
+import { widgetTool } from "./main"
+const screenConfig = {
+  code: 'screen',
+  type: 'screen',
+  label: '大屏设置',
+  icon: '',
+  options: {
+    setup: [
+      {
+        type: 'el-input-number',
+        label: '大屏宽度',
+        name: 'width',
+        required: false,
+        placeholder: 'px',
+        value: '1920',
+      },
+      {
+        type: 'el-input-number',
+        label: '大屏高度',
+        name: 'height',
+        required: false,
+        placeholder: 'px',
+        value: '1080',
+      },
+      {
+        type: 'el-input-text',
+        label: '标题',
+        name: 'title',
+        require: false,
+        placeholder: '',
+        value: '大屏',
+      },
+      {
+        type: 'el-input-textarea',
+        label: '大屏简介',
+        name: 'description',
+        required: false,
+        placeholder: '',
+      },
+      {
+        type: 'vue-color',
+        label: '背景颜色',
+        name: 'backgroundColor',
+        required: false,
+        placeholder: '',
+        value: '#000',
+      },
+      {
+        type: 'custom-upload',
+        label: '图片地址',
+        name: 'backgroundImage',
+        required: false,
+        placeholder: '',
+        value: 'https://report.anji-plus.com/file/download/bf566e48-ccad-40e1-8ee9-228427e5466b',
+      },
+    ],
+    data: [],
+    position: [],
+  }
+}
+const widgetTools = [
+  ...widgetTool
+]
+
+const getToolByCode = function (code) {
+  // 获取大屏底层设置属性
+  if (code == 'screen') {
+    return screenConfig
+  }
+  // 获取组件
+  var item = widgetTools.find(function (item, index, arrs) {
+    return item.code === code
+  })
+  return item
+}
+
+export {widgetTools, getToolByCode}

+ 63 - 0
report-ui/src/views/report/bigscreen/designer/tools/main.js

@@ -0,0 +1,63 @@
+/*
+ * @Descripttion: json 入口文件
+ * @version:
+ * @Author: qianlishi
+ * @Date: 2021-08-29 07:46:46
+ * @LastEditors: qianlishi
+ * @LastEditTime: 2021-08-29 07:54:41
+ */
+
+import { widgetText } from "./componentsJSON/widget-text"
+import { widgetMarquee } from "./componentsJSON/widget-marquee"
+import { widgetHref } from "./componentsJSON/widget-href"
+import { widgetTime } from "./componentsJSON/widget-time"
+import { widgetImage } from "./componentsJSON/widget-image"
+import { widgetSliders } from "./componentsJSON/widget-slider"
+import { widgetVideo } from "./componentsJSON/widget-video"
+import { widgetTable } from "./componentsJSON/widget-table"
+import { widgetIframe } from "./componentsJSON/widget-iframe"
+import { widgetUniversal } from "./componentsJSON/widget-universal"
+import { widgetBarchart } from "./componentsJSON/widget-barchart"
+import { widgetGradientBarchart } from "./componentsJSON/widget-gradient-barchart"
+import { widgetLinechart } from "./componentsJSON/widget-linechart"
+import { widgetBarlinechart } from "./componentsJSON/widget-barlinechart"
+import { widgetPiechart } from "./componentsJSON/widget-piechart"
+import { widgetFunnel } from "./componentsJSON/widget-funnel"
+import { widgetGauge } from "./componentsJSON/widget-gauge"
+import { widgetMap } from "./componentsJSON/widget-map"
+import { WidgetPieNightingale } from "./componentsJSON/widget-pie-nightingale"
+import { widgetPiePercentage } from "./componentsJSON/widget-pie-percentage"
+import { widgetAirbubbleMap } from "./componentsJSON/widget-airbubble-map"
+import { widgetBarStack } from "./componentsJSON/widget-bar-stack"
+import { widgetLineStack } from "./componentsJSON/widget-line-stack"
+import { widgetBarCompare } from "./componentsJSON/widget-bar-compare"
+import { widgetLineCompare } from "./componentsJSON/widget-line-compare"
+
+export const widgetTool = [
+  // type=html类型的组件
+  widgetText,
+  widgetMarquee,
+  widgetHref,
+  widgetTime,
+  widgetImage,
+  //  widgetSliders,
+  widgetVideo,
+  widgetTable,
+  widgetIframe,
+  //  widgetUniversal,
+  widgetBarchart,
+  widgetGradientBarchart,
+  widgetLinechart,
+  widgetBarlinechart,
+  widgetPiechart,
+  widgetFunnel,
+  widgetGauge,
+  widgetMap,
+  WidgetPieNightingale,
+  widgetPiePercentage,
+  widgetAirbubbleMap,
+  widgetBarStack,
+  widgetLineStack,
+  widgetBarCompare,
+  widgetLineCompare
+]

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

@@ -23,9 +23,10 @@ export default {
             color: '#ffffff',
           },
         },
+        //边距
         grid: [
-          {
-            show: false,
+          {//左
+            show: false,//边框线
             left: '4%',
             top: 60,
             bottom: 10,
@@ -36,10 +37,10 @@ export default {
             show: false,
             left: '50.5%',
             top: 60,
-            bottom: 80,
+            bottom: 25,
             width: '0%'
           },
-          {
+          {//右
             show: false,
             right: '4%',
             top: 60,
@@ -50,9 +51,6 @@ export default {
         ],
         //图例
         legend: {
-          data: ['success', 'fail'],
-          bottom: 10,
-          center: true,
           textStyle: {
             color: '#fff',
             textAlign: 'center'
@@ -63,9 +61,10 @@ export default {
         xAxis: [
           {// 左
             splitNumber: 2,
+            show: true,
             type: 'value',
             inverse: true,
-            axisLine: {
+            axisLine: {//底分割线
               show: false,
             },
             axisTick: {
@@ -79,7 +78,7 @@ export default {
                 fontSize: 12
               }
             },
-            splitLine: { // 分割线
+            splitLine: { // 分割线
               show: true,
               lineStyle: {
                 color: '#57617f',
@@ -94,6 +93,7 @@ export default {
           },
           {// 右
             gridIndex: 2,
+            show: true,
             type: 'value',
             axisLine: {
               show: false,
@@ -197,9 +197,9 @@ export default {
                 color: '#36c5e7',
                 barBorderRadius: [8, 0, 0, 8],
               },
-              /*emphasis: {
+              emphasis: {
                 show: false,
-              },*/
+              },
             },
             data: [],
           },
@@ -274,7 +274,12 @@ export default {
     // 修改图标options属性
     editorOptions() {
       this.setOptionsTitle();
+      this.setOptionsXLeft();
+      this.setOptionsXRight();
+      this.setOptionsY();
       this.setOptionsTop();
+      this.setOptionsTooltip();
+      this.setOptionsGrid();
       this.setOptionsLegend();
       this.setOptionsColor();
       this.setOptionsData();
@@ -293,6 +298,102 @@ export default {
       };
       this.options.title = title;
     },
+    // 左X轴设置
+    setOptionsXLeft() {
+      const optionsSetup = this.optionsSetup;
+      const xAxisLeft = {
+        splitNumber: optionsSetup.splitNumberLeft,
+        type: 'value',
+        show : optionsSetup.hideXLeft,
+        inverse: true,
+        axisLine: {//X轴线
+          show: optionsSetup.xLineLeft,
+          lineStyle: {
+            color: optionsSetup.lineColorXLeft,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.tickLineLeft,
+        },
+        position: 'bottom',
+        axisLabel: { // x轴
+          show: true,
+          textStyle: {
+            color: optionsSetup.XcolorLeft,
+            fontSize: optionsSetup.fontSizeXLeft
+          }
+        },
+        splitLine: { // 分割线
+          show: optionsSetup.SplitLineLeft,
+          lineStyle: {
+            color: optionsSetup.SplitLineColorLeft,
+            width: optionsSetup.SplitLinefontSizeLeft,
+            type: 'solid'
+          }
+        }
+      }
+      this.options.xAxis[0] = xAxisLeft;
+    },
+    // 右X轴设置
+    setOptionsXRight() {
+      const optionsSetup = this.optionsSetup;
+      const xAxisRight = {
+        gridIndex: 2,
+        splitNumber: optionsSetup.splitNumberRight,
+        show : optionsSetup.hideXRight,
+        type: 'value',
+        axisLine: {//X轴线
+          show: optionsSetup.xLineRight,
+          lineStyle: {
+            color: optionsSetup.lineColorXRight,
+          },
+        },
+        axisTick: {
+          show: optionsSetup.tickLineRight,
+        },
+        position: 'bottom',
+        axisLabel: { // x轴
+          show: true,
+          textStyle: {
+            color: optionsSetup.XcolorRight,
+            fontSize: optionsSetup.fontSizeXRight
+          }
+        },
+        splitLine: { // 分割线
+          show: optionsSetup.SplitLineRight,
+          lineStyle: {
+            color: optionsSetup.SplitLineColorRight,
+            width: optionsSetup.SplitLinefontSizeRight,
+            type: 'solid'
+          }
+        }
+      }
+      this.options.xAxis[2] = xAxisRight;
+    },
+    // Y轴设置
+    setOptionsY() {
+      const optionsSetup = this.optionsSetup;
+      const axisLine = {
+        show: optionsSetup.lineY,
+        lineStyle: {
+          color: optionsSetup.lineColorY
+        }
+      };
+      const axisTick = {
+        show: optionsSetup.tickLineY
+      };
+      const axisLabel = {
+        show: optionsSetup.hideY,
+        textStyle: {
+          align: optionsSetup.textAlign,
+          color: optionsSetup.colorY,
+          fontSize: optionsSetup.fontSizeY,
+        }
+      };
+      this.options.yAxis[1]['axisLine'] = axisLine;
+      this.options.yAxis[1]['axisTick'] = axisTick;
+      this.options.yAxis[1]['axisLabel'] = axisLabel;
+    },
     // 数值设定、柱体设置
     setOptionsTop() {
       const optionsSetup = this.optionsSetup;
@@ -302,7 +403,6 @@ export default {
           series[0].label = {
             normal: {
               show: optionsSetup.isShow,
-              //color: 'red',
               position: 'insideLeft',
               textStyle: {
                 fontSize: optionsSetup.fontSize,
@@ -334,6 +434,49 @@ export default {
       }
       this.options.series = series;
     },
+    // tooltip 提示语设置
+    setOptionsTooltip() {
+      const optionsSetup = this.optionsSetup;
+      const tooltip = {
+        trigger: "item",
+        show: true,
+        textStyle: {
+          color: optionsSetup.lineColor,
+          fontSize: optionsSetup.fontSize
+        }
+      };
+      this.options.tooltip = tooltip;
+    },
+    // 边距设置
+    setOptionsGrid() {
+      const optionsSetup = this.optionsSetup;
+      const grid = [
+        {//左
+          show: optionsSetup.frameLineLeft,
+          left: optionsSetup.marginLeftRight,
+          top: optionsSetup.marginTop,
+          bottom: optionsSetup.marginBottom,
+          containLabel: true,
+          width: '40%'
+        },
+        {//中间字体位置
+          show: false,
+          left: "51%",
+          top: optionsSetup.marginTop,
+          bottom: optionsSetup.marginBottom + 15,
+          width: '0%'
+        },
+        {//右
+          show: optionsSetup.frameLineRight,
+          right: optionsSetup.marginLeftRight,
+          top: optionsSetup.marginTop,
+          bottom: optionsSetup.marginBottom,
+          containLabel: true,
+          width: '40%'
+        },
+      ]
+      this.options.grid = grid;
+    },
     // 图例操作
     setOptionsLegend() {
       const optionsSetup = this.optionsSetup;
@@ -398,13 +541,6 @@ export default {
     },
     //静态数据
     staticDataFn(val) {
-      const optionsSetup = this.optionsSetup;
-      //颜色
-      const customColor = optionsSetup.customColor;
-      const arrColor = [];
-      for (let i = 0; i < customColor.length; i++) {
-        arrColor.push(customColor[i].color);
-      }
       //数据
       let xAxisList = [];
       let yAxisList = [];
@@ -436,17 +572,6 @@ export default {
       this.options.series[1]['name'] = arrayList[1].name
       this.options.series[1]['data'] = arrayList[1].data
       this.options.yAxis[1]['data'] = xAxisList
-      /*if (optionsSetup.verticalShow) {
-        this.options.xAxis.data = [];
-        this.options.yAxis.data = xAxisList;
-        this.options.xAxis.type = "value";
-        this.options.yAxis.type = "category";
-      } else {
-        this.options.xAxis.data = xAxisList;
-        this.options.yAxis.data = [];
-        this.options.xAxis.type = "category";
-        this.options.yAxis.type = "value";
-      }*/
     },
     // 动态数据
     dynamicDataFn(val, refreshTime, optionsSetup) {
@@ -467,52 +592,13 @@ export default {
       });
     },
     renderingFn(optionsSetup, val) {
-      //颜色
-      const customColor = optionsSetup.customColor;
-      const arrColor = [];
-      for (let i = 0; i < customColor.length; i++) {
-        arrColor.push(customColor[i].color);
-      }
-      // x轴
-      if (optionsSetup.verticalShow) {
-        this.options.xAxis.data = [];
-        this.options.yAxis.data = val.xAxis;
-        this.options.xAxis.type = "value";
-        this.options.yAxis.type = "category";
-      } else {
-        this.options.xAxis.data = val.xAxis;
-        this.options.yAxis.data = [];
-        this.options.xAxis.type = "category";
-        this.options.yAxis.type = "value";
-      }
-      const series = [];
-      for (const i in val.series) {
-        if (val.series[i].type == "bar") {
-          series.push({
-            name: val.series[i].name,
-            type: "bar",
-            data: val.series[i].data,
-            barGap: "0%",
-            barWidth: optionsSetup.maxWidth,
-            label: {
-              show: optionsSetup.isShow,
-              position: "top",
-              distance: 10,
-              fontSize: optionsSetup.fontSize,
-              color: optionsSetup.subTextColor,
-              fontWeight: optionsSetup.fontWeight
-            },
-            //颜色,圆角属性
-            itemStyle: {
-              normal: {
-                color: arrColor[i],
-                barBorderRadius: optionsSetup.radius,
-              }
-            }
-          })
-        }
+      this.options.yAxis[1]['data'] = val.xAxis
+      if (val.series[0].type == "bar"){
+        this.options.series[0]['name'] = val.series[0].name
+        this.options.series[0]['data'] = val.series[0].data
+        this.options.series[1]['name'] = val.series[1].name
+        this.options.series[1]['data'] = val.series[1].data
       }
-      this.options.series = series
     }
   }
 };

+ 10 - 1
report-ui/src/views/report/bigscreen/designer/widget/bar/widgetGradientColorBarchart.vue

@@ -210,6 +210,10 @@ export default {
         type: "category",
         show: optionsCollapse.hideX, // 坐标轴是否显示
         name: optionsCollapse.xName, // 坐标轴名称
+        nameTextStyle: {
+          color: optionsCollapse.nameColorX,
+          fontSize: optionsCollapse.nameFontSizeX
+        },
         nameRotate: optionsCollapse.textAngle, // 文字角度
         inverse: optionsCollapse.reversalX, // 轴反转
         axisLabel: {
@@ -241,12 +245,17 @@ export default {
       const optionsCollapse = this.optionsSetup;
       const yAxis = {
         type: "value",
+        scale : optionsCollapse.scale,
+        splitNumber: optionsCollapse.splitNumber,// 均分
         show: optionsCollapse.isShowY, // 坐标轴是否显示
         name: optionsCollapse.textNameY, // 坐标轴名称
+        nameTextStyle: { // 别名
+          color: optionsCollapse.nameColorY,
+          fontSize: optionsCollapse.namefontSizeY
+        },
         inverse: optionsCollapse.reversalY, // 轴反转
         axisLabel: {
           show: true,
-          interval: optionsCollapse.ytextInterval, // 文字间隔
           rotate: optionsCollapse.ytextAngle, // 文字角度
           textStyle: {
             color: optionsCollapse.colorY, // y轴 坐标文字颜色

+ 662 - 0
report-ui/src/views/report/bigscreen/designer/widget/line/widgetLineCompareChart.vue

@@ -0,0 +1,662 @@
+<template>
+  <div :style="styleObj">
+    <v-chart :options="options" autoresize/>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "WidgetBarCompareChart",
+  //参考 https://www.makeapie.com/editor.html?c=xOjLyozu2W
+  components: {},
+  props: {
+    value: Object,
+    ispreview: Boolean
+  },
+  data() {
+    return {
+      options: {
+        axisPointer: {
+          link: {
+            xAxisIndex: "all",
+          },
+        },
+        title: {
+          x: 'center',
+          textStyle: {
+            color: '#ffffff',
+          },
+        },
+        tooltip: {
+          show: true,
+          trigger: 'axis',
+          axisPointer: {
+            type: 'line',
+            lineStyle: {
+              color: '#ffffff',
+              type: 'dashed',
+            },
+          },
+          /*axisPointer: {
+              type: 'cross',
+              lineStyle: {
+                  color: '#ffffff',
+                  type: 'dashed',
+              },
+              crossStyle: {
+                  color: '#ffffff',
+              }
+          },*/
+        },
+        //边距
+        grid: [
+          {// 上
+            left: 30,
+            right: 20,
+            top: '60px',
+            containLabel: true,
+            bottom: '50%',
+          },
+          { // 下
+            left: 30,
+            containLabel: true,
+            right: 20,
+            top: '51%',
+          },
+        ],
+        //图例
+        legend: {
+          textStyle: {
+            color: '#fff',
+            textAlign: 'center'
+          },
+          //itemGap:80,
+          //itemWidth: 0
+        },
+        xAxis: [
+          {//
+            gridIndex: 0,
+            show: true,
+            type: 'category',
+            boundaryGap: true, // 居中
+            axisLine: { //x轴线
+              show: true,
+              lineStyle: {
+                color: '#ffffff',
+              }
+            },
+            axisTick: { // 刻度
+              show: true,
+            },
+            axisLabel: { // X轴数据
+              show: true,
+              textStyle: {
+                interval: 0,
+                color: '#ffffff',
+                fontSize: 14
+              }
+            },
+            data: [],
+          },
+          {//
+            gridIndex: 1,
+            show: true,
+            type: 'category',
+            position: 'top',
+            boundaryGap: true, // 居中
+            axisLine: { // x轴线
+              show: true,
+              lineStyle: {
+                color: '#ffffff',
+              }
+            },
+            axisTick: { // 刻度
+              show: true,
+            },
+            axisLabel: {
+              show: false,
+              interval: 0,
+            },
+            data: [],
+          },
+        ],
+        yAxis: [
+          {
+            gridIndex: 0,
+            show: true,
+            scale: true, // 是否不从0开始,false从0开始
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: '#ffffff',
+                fontSize: 14,
+              },
+            },
+            axisLine: { // 轴线
+              show: true,
+              lineStyle: {
+                color: '#ffffff',
+              },
+            },
+            splitLine: {
+              show: false,
+              lineStyle: {
+                color: '#ffffff',
+              },
+            },
+            axisPointer: {
+              snap: true
+            },
+          },
+          {
+            gridIndex: 1,
+            scale: false, // 是否从0开始
+            inverse: true, // 翻转
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: '#ffffff',
+                fontSize: 14,
+              },
+            },
+            axisLine: { // 轴线
+              show: true,
+              lineStyle: {
+                color: '#ffffff',
+              },
+            },
+            splitLine: {
+              show: false,
+              lineStyle: {
+                color: '#ffffff',
+              },
+            },
+            axisPointer: {
+              snap: true
+            },
+          },
+        ],
+        series: [
+          {
+            name: '',
+            type: 'line',
+            xAxisIndex: 0,
+            yAxisIndex: 0,
+            showSymbol: true,// 标记点
+            symbol: 'circle',
+            symbolSize: 5,
+            smooth: true, // 曲线,折线
+            itemStyle: {
+              color: '#36c5e7',
+            },
+            lineStyle: {
+              color: '#36c5e7',
+              width: 2,
+            },
+            label: { // 数值
+              position: 'top',
+              distance: 10,
+              show: true,
+              color: '#36c5e7',
+              fontSize: 14,
+            },
+            data: [],
+          },
+          {
+            name: '',
+            type: 'line',
+            xAxisIndex: 1,
+            yAxisIndex: 1,
+            showSymbol: true,// 标记点
+            symbol: 'circle',
+            symbolSize: 5,
+            smooth: true, // 曲线,折线
+            itemStyle: {
+              color: '#e68b55',
+            },
+            lineStyle: {
+              color: '#e68b55',
+              width: 2,
+            },
+            label: {// 数值
+              position: 'bottom',
+              distance: 10,
+              show: true,
+              color: '#e68b55',
+              fontSize: 16,
+            },
+            data: [],
+          },
+        ]
+      },
+      optionsStyle: {},
+      optionsData: {},
+      optionsSetup: {},
+      flagInter: null
+    };
+  },
+  computed: {
+    styleObj() {
+      return {
+        position: this.ispreview ? "absolute" : "static",
+        width: this.optionsStyle.width + "px",
+        height: this.optionsStyle.height + "px",
+        left: this.optionsStyle.left + "px",
+        top: this.optionsStyle.top + "px",
+        background: this.optionsSetup.background
+      };
+    }
+  },
+  watch: {
+    value: {
+      handler(val) {
+        this.optionsStyle = val.position;
+        this.optionsData = val.data;
+        this.optionsSetup = val.setup;
+        this.optionsSetup = val.setup;
+        this.editorOptions();
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    this.optionsStyle = this.value.position;
+    this.optionsData = this.value.data;
+    this.optionsCollapse = this.value.setup;
+    this.optionsSetup = this.value.setup;
+    this.editorOptions();
+  },
+  methods: {
+    // 修改图标options属性
+    editorOptions() {
+      this.setOptionsTitle();
+      this.setOptionsX();
+      this.setOptionsYTop();
+      this.setOptionsYBottom();
+      this.setOptionsTop();
+      this.setOptionsTooltip();
+      this.setOptionsGrid();
+      this.setOptionsLegend();
+      this.setOptionsColor();
+      this.setOptionsData();
+    },
+    // 标题修改
+    setOptionsTitle() {
+      const optionsCollapse = this.optionsSetup;
+      const title = {};
+      title.text = optionsCollapse.titleText;
+      title.show = optionsCollapse.isNoTitle;
+      title.left = optionsCollapse.textAlign;
+      title.textStyle = {
+        color: optionsCollapse.textColor,
+        fontSize: optionsCollapse.textFontSize,
+        fontWeight: optionsCollapse.textFontWeight
+      };
+      this.options.title = title;
+    },
+    // X轴设置
+    setOptionsX() {
+      const optionsSetup = this.optionsSetup;
+      const xAxis0 = {
+        gridIndex: 0,
+        show: optionsSetup.isShowX,
+        name: optionsSetup.xName, // 坐标轴名称
+        nameTextStyle: {
+          color: optionsSetup.nameColorX,
+          fontSize: optionsSetup.nameFontSizeX
+        },
+        type: 'category',
+        boundaryGap: optionsSetup.boundaryX, // 值居中
+        axisLine: { //x轴线
+          show: optionsSetup.lineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+          }
+        },
+        axisTick: { // 刻度
+          show: optionsSetup.tickLineX,
+        },
+        axisLabel: { // X轴数据
+          show: true,
+          interval: optionsSetup.splitNumberX,
+          textStyle: {
+            color: optionsSetup.colorX,
+            fontSize: optionsSetup.fontSizeX
+          }
+        },
+      }
+      const xAxis1 = {
+        gridIndex: 1,
+        show: optionsSetup.isShowX,
+        type: 'category',
+        position: 'top',
+        boundaryGap: optionsSetup.boundaryX, // 值居中
+        axisLine: { // x轴线
+          show: optionsSetup.lineX,
+          lineStyle: {
+            color: optionsSetup.lineColorX,
+          }
+        },
+        axisTick: { // 刻度
+          show: optionsSetup.tickLineX,
+        },
+        axisLabel: {
+          show: false,
+          interval: optionsSetup.splitNumberX,
+        },
+      }
+      this.options.xAxis[0] = xAxis0;
+      this.options.xAxis[1] = xAxis1;
+    },
+    // 上y轴设置
+    setOptionsYTop() {
+      const optionsSetup = this.optionsSetup;
+      const yAxis = {
+        gridIndex: 0,
+        splitNumber: optionsSetup.splitNumberYTop,
+        show: optionsSetup.isShowYTop,
+        scale: optionsSetup.scaleYTop, // 缩放
+        name: optionsSetup.textNameYTop, // 坐标轴名称
+        nameTextStyle: {
+          color: optionsSetup.nameColorYTop,
+          fontSize: optionsSetup.namefontSizeYTop
+        },
+        axisLabel: {
+          show: true,
+          textStyle: {
+            color: optionsSetup.colorYTop,
+            fontSize: optionsSetup.fontSizeYTop,
+          },
+        },
+        axisTick: { // 刻度
+          show: optionsSetup.tickLineYTop,
+        },
+        axisLine: { // 轴线
+          show: optionsSetup.lineYTop,
+          lineStyle: {
+            color: optionsSetup.lineColorYTop,
+          },
+        },
+        splitLine: {
+          show: optionsSetup.splitLineYTop,
+          lineStyle: {
+            width: optionsSetup.splitLinefontSizeYTop,
+            color: optionsSetup.splitLineColorYTop,
+          },
+        },
+        axisPointer: {
+          snap: true
+        },
+      }
+      this.options.yAxis[0] = yAxis
+    },
+    // 下Y轴设置
+    setOptionsYBottom() {
+      const optionsSetup = this.optionsSetup;
+      const yAxis = {
+        gridIndex: 1,
+        splitNumber: optionsSetup.splitNumberYBottom,
+        show: optionsSetup.isShowYBottom,
+        scale: optionsSetup.scaleYBottom, // 缩放
+        name: optionsSetup.textNameYBottom, // 坐标轴名称
+        nameTextStyle: {
+          color: optionsSetup.nameColorYBottom,
+          fontSize: optionsSetup.namefontSizeYBottom
+        },
+        inverse: true, // 翻转
+        axisLabel: {
+          show: true,
+          textStyle: {
+            color: optionsSetup.colorYBottom,
+            fontSize: optionsSetup.fontSizeYBottom,
+          },
+        },
+        axisTick: { // 刻度
+          show: optionsSetup.tickLineYBottom,
+        },
+        axisLine: { // 轴线
+          show: optionsSetup.lineYBottom,
+          lineStyle: {
+            color: optionsSetup.lineColorYBottom,
+          },
+        },
+        splitLine: {
+          show: optionsSetup.splitLineYBottom,
+          lineStyle: {
+            width: optionsSetup.splitLinefontSizeYBottom,
+            color: optionsSetup.splitLineColorYBottom,
+          },
+        },
+        axisPointer: {
+          snap: true
+        },
+      }
+      this.options.yAxis[1] = yAxis
+    },
+    // 数值设定 折线设置
+    setOptionsTop() {
+      const optionsSetup = this.optionsSetup;
+      const series = this.options.series
+      // 折线
+      for (const key in series) {
+        series[key].showSymbol = optionsSetup.markPoint
+        series[key].symbolSize = optionsSetup.pointSize
+        series[key].smooth = optionsSetup.smoothCurve
+        if (optionsSetup.area) {
+          series[key].areaStyle = {
+            opacity: optionsSetup.areaThickness / 100
+          }
+        } else {
+          series[key].areaStyle = {
+            opacity: 0
+          }
+        }
+      }
+      // 数值
+      if (series[0].type == 'line') {
+        series[0].label = {
+          position: 'top',
+          distance: 10,
+          show: optionsSetup.isShow,
+          color: optionsSetup.subTextColor,
+          fontSize: optionsSetup.fontSize,
+          fontWeight: optionsSetup.fontWeight
+        }
+        series[1].label = {
+          position: 'bottom',
+          distance: 10,
+          show: optionsSetup.isShow,
+          color: optionsSetup.subTextColor,
+          fontSize: optionsSetup.fontSize,
+          fontWeight: optionsSetup.fontWeight
+        }
+      }
+    },
+    // tooltip 提示语设置
+    setOptionsTooltip() {
+      const optionsSetup = this.optionsSetup;
+      let tooltip = {}
+      if (optionsSetup.tipType == "line") {
+        tooltip = {
+          show: optionsSetup.tipShow,
+          trigger: 'axis',
+          axisPointer: {
+            type: optionsSetup.tipType,
+            lineStyle: {
+              color: optionsSetup.tipColor,
+              type: 'dashed',
+            },
+          },
+        }
+      } else {
+        tooltip = {
+          show: optionsSetup.tipShow,
+          trigger: 'axis',
+          axisPointer: {
+            type: optionsSetup.tipType,
+            lineStyle: {
+              color: optionsSetup.tipColor,
+              type: 'dashed',
+            },
+            crossStyle: {
+              color: optionsSetup.tipColor,
+            }
+          },
+        }
+      }
+      this.options.tooltip = tooltip;
+    },
+    // 边距设置
+    setOptionsGrid() {
+      const optionsSetup = this.optionsSetup;
+      const grid = [
+        {// 上
+          left: optionsSetup.marginLeft,
+          right: optionsSetup.marginRight,
+          top: optionsSetup.marginTop,
+          containLabel: true,
+          bottom: '50%',
+        },
+        { // 下
+          left: optionsSetup.marginLeft,
+          right: optionsSetup.marginRight,
+          containLabel: true,
+          top: '51%',
+          bottom: optionsSetup.marginBottom,
+        },
+      ]
+      this.options.grid = grid;
+    },
+    // 图例操作
+    setOptionsLegend() {
+      const optionsSetup = this.optionsSetup;
+      const legend = this.options.legend;
+      legend.show = optionsSetup.isShowLegend;
+      legend.left = optionsSetup.lateralPosition;
+      legend.top = optionsSetup.longitudinalPosition == "top" ? 0 : "auto";
+      legend.bottom =
+        optionsSetup.longitudinalPosition == "bottom" ? 0 : "auto";
+      legend.orient = optionsSetup.layoutFront;
+      legend.textStyle = {
+        color: optionsSetup.lengedColor,
+        fontSize: optionsSetup.lengedFontSize
+      };
+      legend.itemWidth = optionsSetup.lengedWidth;
+    },
+    // 颜色修改、宽度修改
+    setOptionsColor() {
+      const optionsSetup = this.optionsSetup;
+      const customColor = optionsSetup.customColor;
+      const series = this.options.series
+      const arrColor = [];
+      for (let i = 0; i < customColor.length; i++) {
+        arrColor.push(customColor[i].color);
+      }
+      if (!customColor) return;
+      for (const key in series) {
+        const itemStyle = {
+          color: arrColor[key],
+        }
+        const lineStyle = {
+          color: arrColor[key],
+          width: optionsSetup.lineWidth,
+        }
+        this.options.series[key].itemStyle = itemStyle
+        this.options.series[key].lineStyle = lineStyle
+      }
+    },
+    // 数据解析
+    setOptionsData() {
+      const optionsSetup = this.optionsSetup;
+      const optionsData = this.optionsData; // 数据类型 静态 or 动态
+      optionsData.dataType == "staticData"
+        ? this.staticDataFn(optionsData.staticData, optionsSetup)
+        : this.dynamicDataFn(
+        optionsData.dynamicData,
+        optionsData.refreshTime,
+        optionsSetup
+        );
+    },
+    //去重
+    setUnique(arr) {
+      let newArr = [];
+      arr.forEach(item => {
+        return newArr.includes(item) ? '' : newArr.push(item);
+      });
+      return newArr;
+    },
+    //静态数据
+    staticDataFn(val) {
+      //数据
+      let xAxisList = [];
+      let yAxisList = [];
+      let arrayList = [];
+      for (const i in val) {
+        xAxisList[i] = val[i].axis
+        yAxisList[i] = val[i].name
+      }
+      xAxisList = this.setUnique(xAxisList)
+      yAxisList = this.setUnique(yAxisList)
+      for (const i in yAxisList) {
+        const data = new Array(yAxisList.length).fill(0)
+        for (const j in xAxisList) {
+          for (const k in val) {
+            if (val[k].name == yAxisList[i]) {
+              if (val[k].axis == xAxisList[j]) {
+                data[j] = val[k].data
+              }
+            }
+          }
+        }
+        arrayList.push({
+          name: yAxisList[i],
+          data: data
+        })
+      }
+      this.options.series[0]['name'] = arrayList[0].name
+      this.options.series[0]['data'] = arrayList[0].data
+      this.options.series[1]['name'] = arrayList[1].name
+      this.options.series[1]['data'] = arrayList[1].data
+      this.options.xAxis[0]['data'] = xAxisList
+      this.options.xAxis[1]['data'] = xAxisList
+    },
+    // 动态数据
+    dynamicDataFn(val, refreshTime, optionsSetup) {
+      if (!val) return;
+      if (this.ispreview) {
+        this.getEchartData(val, optionsSetup);
+        this.flagInter = setInterval(() => {
+          this.getEchartData(val, optionsSetup);
+        }, refreshTime);
+      } else {
+        this.getEchartData(val, optionsSetup);
+      }
+    },
+    getEchartData(val, optionsSetup) {
+      const data = this.queryEchartsData(val);
+      data.then(res => {
+        this.renderingFn(optionsSetup, res);
+      });
+    },
+    renderingFn(optionsSetup, val) {
+      this.options.xAxis[0]['data'] = val.xAxis
+      this.options.xAxis[1]['data'] = val.xAxis
+      if (val.series[0].type == "line") {
+        this.options.series[0]['name'] = val.series[0].name
+        this.options.series[0]['data'] = val.series[0].data
+        this.options.series[1]['name'] = val.series[1].name
+        this.options.series[1]['data'] = val.series[1].data
+      }
+    }
+  }
+};
+</script>
+
+<style scoped lang="scss">
+.echarts {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+</style>

+ 0 - 1
report-ui/src/views/report/bigscreen/designer/widget/line/widgetLineStackChart.vue

@@ -319,7 +319,6 @@ export default {
           symbol: 'circle',
           showSymbol: optionsSetup.markPoint,
           symbolSize: optionsSetup.pointSize,
-          symbolColor: arrColor[i],
           smooth: optionsSetup.smoothCurve,
           // 线条
           lineStyle: {

+ 3 - 1
report-ui/src/views/report/bigscreen/designer/widget/temp.vue

@@ -34,6 +34,7 @@ import widgetAirBubbleMap from "./map/widgetAirBubbleMap";
 import widgetBarStackChart from "./bar/widgetBarStackChart";
 import widgetLineStackChart from "./line/widgetLineStackChart";
 import widgetBarCompareChart from "./bar/widgetBarCompareChart";
+import widgetLineCompareChart from "./line/widgetLineCompareChart";
 
 export default {
   name: "WidgetTemp",
@@ -60,7 +61,8 @@ export default {
     widgetAirBubbleMap,
     widgetBarStackChart,
     widgetLineStackChart,
-    widgetBarCompareChart
+    widgetBarCompareChart,
+    widgetLineCompareChart
   },
   model: {
     prop: "value",

+ 3 - 1
report-ui/src/views/report/bigscreen/designer/widget/widget.vue

@@ -44,6 +44,7 @@ import widgetAirBubbleMap from "./map/widgetAirBubbleMap";
 import widgetBarStackChart from "./bar/widgetBarStackChart";
 import widgetLineStackChart from "./line/widgetLineStackChart";
 import widgetBarCompareChart from "./bar/widgetBarCompareChart";
+import widgetLineCompareChart from "./line/widgetLineCompareChart";
 
 export default {
   name: "Widget",
@@ -70,7 +71,8 @@ export default {
     widgetAirBubbleMap,
     widgetBarStackChart,
     widgetLineStackChart,
-    widgetBarCompareChart
+    widgetBarCompareChart,
+    widgetLineCompareChart
   },
   model: {
     prop: "value",

+ 5 - 2
report-ui/src/views/report/bigscreen/designer/widget/widgetBarchart.vue

@@ -165,15 +165,18 @@ export default {
       const optionsCollapse = this.optionsSetup;
       const yAxis = {
         type: "value",
+        scale : optionsCollapse.scale,
+        splitNumber: optionsCollapse.splitNumber,// 均分
         show: optionsCollapse.isShowY, // 坐标轴是否显示
         name: optionsCollapse.textNameY, // 坐标轴名称
         nameTextStyle: {
-          color: optionsCollapse.NameColorY,
-          fontSize: optionsCollapse.NameFontSizeY
+          color: optionsCollapse.nameColorY,
+          fontSize: optionsCollapse.nameFontSizeY
         },
         inverse: optionsCollapse.reversalY, // 轴反转
         axisLabel: {
           show: true,
+          rotate: optionsCollapse.ytextAngle, // 文字角度
           textStyle: {
             color: optionsCollapse.colorY, // x轴 坐标文字颜色
             fontSize: optionsCollapse.fontSizeY

+ 19 - 24
report-ui/src/views/report/bigscreen/designer/widget/widgetBarlinechart.vue

@@ -171,14 +171,14 @@ export default {
         show: optionsCollapse.hideX, // 坐标轴是否显示
         name: optionsCollapse.xName, // 坐标轴名称
         nameTextStyle: {
-          color: optionsCollapse.xNameColor,
-          fontSize: optionsCollapse.xNameFontSize
+          color: optionsCollapse.nameColorX,
+          fontSize: optionsCollapse.nameFontSizeX
         },
         nameRotate: optionsCollapse.textAngle, // 文字角度
         inverse: optionsCollapse.reversalX, // 轴反转
         axisLabel: {
           show: true,
-          interval: optionsCollapse.textInterval, // 文字角度
+          interval: optionsCollapse.textInterval, // 文字间隔
           rotate: optionsCollapse.textAngle, // 文字角度
           textStyle: {
             color: optionsCollapse.Xcolor, // x轴 坐标文字颜色
@@ -206,46 +206,45 @@ export default {
       const yAxis = [
         {
           type: "value",
-          show: optionsCollapse.isShowY, // 坐标轴是否显示
-          name: optionsCollapse.textNameY, // 坐标轴名称
-          nameTextStyle: {
-            color: optionsCollapse.NameColorY,
-            fontSize: optionsCollapse.NameFontSizeY
+          splitNumber: optionsCollapse.splitNumberLeft,// 均分
+          show: optionsCollapse.isShowYLeft, // 坐标轴是否显示
+          name: optionsCollapse.textNameYLeft, // 坐标轴名称
+          nameTextStyle: { // 别名
+            color: optionsCollapse.nameColorYLeft,
+            fontSize: optionsCollapse.namefontSizeYLeft
           },
           inverse: optionsCollapse.reversalY, // 轴反转
           axisLabel: {
             show: true,
             textStyle: {
-              color: optionsCollapse.colorY, // x轴 坐标文字颜色
+              color: optionsCollapse.colorY, // y轴 坐标文字颜色
               fontSize: optionsCollapse.fontSizeY
             }
           },
           axisLine: {
             show: true,
             lineStyle: {
-              color: "#fff"
+              color: optionsCollapse.lineColorY
             }
           },
           splitLine: {
-            show: optionsCollapse.isShowSplitLineY,
-            lineStyle: {
-              color: optionsCollapse.splitLineColorY
-            }
+            show: false,
           }
         },
         {
           type: "value",
-          show: optionsCollapse.isShowY, // 坐标轴是否显示
-          name: optionsCollapse.textNameY, // 坐标轴名称
-          nameTextStyle: {
-            color: optionsCollapse.NameColorY,
-            fontSize: optionsCollapse.NameFontSizeY
+          splitNumber: optionsCollapse.splitNumberRight,// 均分
+          show: optionsCollapse.isShowYRight, // 坐标轴是否显示
+          name: optionsCollapse.textNameYRight, // 坐标轴名称
+          nameTextStyle: { // 别名
+            color: optionsCollapse.nameColorYRight,
+            fontSize: optionsCollapse.namefontSizeYRight
           },
           inverse: optionsCollapse.reversalY, // 轴反转
           axisLabel: {
             show: true,
             textStyle: {
-              color: optionsCollapse.colorY, // x轴 坐标文字颜色
+              color: optionsCollapse.colorY, // y轴 坐标文字颜色
               fontSize: optionsCollapse.fontSizeY
             }
           },
@@ -257,13 +256,9 @@ export default {
           },
           splitLine: {
             show: false,
-            lineStyle: {
-              color: optionsCollapse.splitLineColorY
-            }
           }
         }
       ];
-
       this.options.yAxis = yAxis;
     },
     // 折线设置

+ 209 - 44
report-ui/src/views/report/bigscreen/designer/widget/widgetGauge.vue

@@ -1,10 +1,12 @@
 <template>
   <div :style="styleObj">
-    <v-chart :options="options" autoresize />
+    <v-chart :options="options" autoresize/>
   </div>
 </template>
 
 <script>
+import echarts from "echarts";
+
 export default {
   name: "WidgetGauge",
   components: {},
@@ -17,35 +19,108 @@ export default {
       options: {
         series: [
           {
-            name: "Pressure",
-            type: "gauge",
-            detail: {
-              formatter: "{value}",
-              textStyle: {
-                fontSize: 12
-              }
-            },
+            type: 'gauge',
+            z: 100,
             axisLine: {
+              lineStyle: {
+                width: 10,
+                color: [
+                  [
+                    0.3,
+                    new echarts.graphic.LinearGradient(0, 1, 1, 0, [
+                      {
+                        offset: 0,
+                        color: 'rgba(0, 237, 3,0.1)',
+                      },
+                      {
+                        offset: 0.5,
+                        color: 'rgba(0, 237, 3,0.6)',
+                      },
+                      {
+                        offset: 1,
+                        color: 'rgba(0, 237, 3,1)',
+                      },
+                    ]),
+                  ],
+                  [
+                    0.7,
+                    new echarts.graphic.LinearGradient(0, 1, 1, 0, [
+                      {
+                        offset: 0,
+                        color: 'rgba(255, 184, 0,0.1)',
+                      },
+                      {
+                        offset: 0.5,
+                        color: 'rgba(255, 184, 0,0.6)',
+                      },
+                      {
+                        offset: 1,
+                        color: 'rgba(255, 184, 0,1)',
+                      },
+                    ]),
+                  ],
+                  [
+                    1,
+                    new echarts.graphic.LinearGradient(0, 1, 1, 0, [
+                      {
+                        offset: 0,
+                        color: 'rgba(175, 36, 74,0.1)',
+                      },
+                      {
+                        offset: 0.5,
+                        color: 'rgba(255, 36, 74,0.6)',
+                      },
+                      {
+                        offset: 1,
+                        color: 'rgba(255, 36, 74,1)',
+                      },
+                    ]),
+                  ],
+                ],
+              },
+            },
+            pointer: {
+              itemStyle: {
+                color: 'auto',
+              },
+            },
+            axisTick: {
+              show: true,
+              distance: 0,
+              length: 10,
+              lineStyle: {
+                color: 'auto',
+                width: 2,
+              },
+            },
+            splitLine: {
               show: true,
+              distance: 0,
+              length: 14,
               lineStyle: {
-                width: 10
-              }
+                color: 'auto',
+                width: 4,
+              },
             },
             axisLabel: {
               show: true,
-              fontSize: 12
+              color: 'white',
+              distance: 2,
+              fontSize: 10,
             },
-            axisTick: {
-              show: true
+            detail: {
+              valueAnimation: true,
+              formatter: '{value} %',
+              color: 'white',
+              fontSize: 18,
             },
             data: [
               {
-                value: 50,
-                name: ""
-              }
-            ]
-          }
-        ]
+                value: 70,
+              },
+            ],
+          },
+        ],
       },
       optionsStyle: {}, // 样式
       optionsData: {}, // 数据
@@ -72,8 +147,7 @@ export default {
         this.optionsData = val.data; // 数据
         this.optionsCollapse = val.collapse; // 折叠数据
         this.optionsSetup = val.setup; // 样式
-        this.setOptions();
-        this.setOptionsData();
+        this.editorOptions();
       },
       deep: true
     }
@@ -83,21 +157,97 @@ export default {
     this.optionsData = this.value.data;
     this.optionsCollapse = this.value.collapse;
     this.optionsSetup = this.value.setup;
-    this.setOptions();
-    this.setOptionsData();
+    this.editorOptions();
   },
   methods: {
+    editorOptions() {
+      this.setOptions()
+      this.setOptionsData()
+    },
     setOptions() {
       const optionsSetup = this.optionsSetup;
       const series = this.options.series;
-      for (const key in series) {
-        if (series[key].type == "gauge") {
-          series[key].axisLine.lineStyle.width = optionsSetup.tickMarkWeight;
-          series[key].axisLabel.show = optionsSetup.showScaleValue;
-          series[key].axisLabel.fontSize = optionsSetup.scaleFontSize;
-          series[key].axisTick.show = optionsSetup.showTickMarks;
-          series[key].detail.textStyle.fontSize = optionsSetup.targetFontSize;
+      if (series[0].type == 'gauge') {
+        const axisLine = {
+          show: optionsSetup.ringShow,
+          lineStyle: {
+            width: optionsSetup.pieWeight,
+            color: [
+              [
+                0.3,
+                new echarts.graphic.LinearGradient(0, 1, 1, 0, [
+                  {
+                    offset: 0,
+                    color: optionsSetup.color30p0,
+                  },
+                  {
+                    offset: 0.5,
+                    color: optionsSetup.color30p5,
+                  },
+                  {
+                    offset: 1,
+                    color: optionsSetup.color30p10,
+                  },
+                ]),
+              ],
+              [
+                0.7,
+                new echarts.graphic.LinearGradient(0, 1, 1, 0, [
+                  {
+                    offset: 0,
+                    color: optionsSetup.color70p0,
+                  },
+                  {
+                    offset: 0.5,
+                    color: optionsSetup.color70p5,
+                  },
+                  {
+                    offset: 1,
+                    color: optionsSetup.color70p10,
+                  },
+                ]),
+              ],
+              [
+                1,
+                new echarts.graphic.LinearGradient(0, 1, 1, 0, [
+                  {
+                    offset: 0,
+                    color: optionsSetup.color100p0,
+                  },
+                  {
+                    offset: 0.5,
+                    color: optionsSetup.color100p5,
+                  },
+                  {
+                    offset: 1,
+                    color: optionsSetup.color100p10,
+                  },
+                ]),
+              ],
+            ],
+          },
+        }
+        const axisTick = {
+          show: optionsSetup.tickShow,
+          distance: optionsSetup.tickDistance,
+          length: optionsSetup.tickLength,
+          lineStyle: {
+            color: 'auto',
+            width: optionsSetup.tickWidth,
+          },
+        }
+        const splitLine = {
+          show: optionsSetup.splitShow,
+          distance: optionsSetup.splitDistance,
+          length: optionsSetup.splitLength,
+          lineStyle: {
+            color: 'auto',
+            width: optionsSetup.splitWidth,
+          },
         }
+        series[0].axisLine = axisLine
+        series[0].axisTick = axisTick
+        series[0].splitLine = splitLine
       }
     },
     setOptionsData() {
@@ -107,15 +257,22 @@ export default {
         : this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
     },
     staticDataFn(val) {
-      const staticData = typeof val == "string" ? JSON.parse(val) : val;
+      const optionsSetup = this.optionsSetup;
       const series = this.options.series;
-      for (const key in series) {
-        series[key].detail.formatter = `{value}${staticData.unit}`;
-        series[key].data[0] = {
-          value: staticData.value,
-          name: staticData.name
-        };
+      const data = [
+        {
+          value: val
+        }
+      ]
+      const detail = {
+        valueAnimation: true,
+        formatter: '{value} %',
+        color: optionsSetup.labelColor,
+        fontSize: optionsSetup.labelFontSize,
+        fontWeight: optionsSetup.labelFontWeight,
       }
+      series[0].data = data
+      series[0].detail = detail
     },
     dynamicDataFn(val, refreshTime) {
       if (!val) return;
@@ -135,14 +292,22 @@ export default {
       });
     },
     renderingFn(val) {
+      const optionsSetup = this.optionsSetup;
       const series = this.options.series;
-      for (const key in series) {
-        series[key].detail.formatter = `{value}${val.unit}`;
-        series[key].data[0] = {
-          value: val.value,
-          name: val.name || ""
-        };
+      const data = [
+        {
+          value: val[0].value
+        }
+      ]
+      const detail = {
+        valueAnimation: true,
+        formatter: '{value} %',
+        color: optionsSetup.labelColor,
+        fontSize: optionsSetup.labelFontSize,
+        fontWeight: optionsSetup.labelFontWeight,
       }
+      series[0].data = data
+      series[0].detail = detail
     }
   }
 };

+ 10 - 9
report-ui/src/views/report/bigscreen/designer/widget/widgetLinechart.vue

@@ -136,14 +136,14 @@ export default {
         show: optionsCollapse.hideX, // 坐标轴是否显示
         name: optionsCollapse.xName, // 坐标轴名称
         nameTextStyle: {
-          color: optionsCollapse.xNameColor,
-          fontSize: optionsCollapse.xNameFontSize
+          color: optionsCollapse.nameColorX,
+          fontSize: optionsCollapse.nameFontSizeX
         },
         nameRotate: optionsCollapse.textAngle, // 文字角度
         inverse: optionsCollapse.reversalX, // 轴反转
         axisLabel: {
           show: true,
-          interval: optionsCollapse.textInterval, // 文字角度
+          interval: optionsCollapse.textInterval, // 文字间隔
           rotate: optionsCollapse.textAngle, // 文字角度
           textStyle: {
             color: optionsCollapse.Xcolor, // x轴 坐标文字颜色
@@ -170,17 +170,20 @@ export default {
       const optionsCollapse = this.optionsSetup;
       const yAxis = {
         type: "value",
+        scale : optionsCollapse.scale,
+        splitNumber: optionsCollapse.splitNumber,// 均分
         show: optionsCollapse.isShowY, // 坐标轴是否显示
         name: optionsCollapse.textNameY, // 坐标轴名称
-        nameTextStyle: {
-          color: optionsCollapse.NameColorY,
-          fontSize: optionsCollapse.NameFontSizeY
+        nameTextStyle: { // 别名
+          color: optionsCollapse.nameColorY,
+          fontSize: optionsCollapse.namefontSizeY
         },
         inverse: optionsCollapse.reversalY, // 轴反转
         axisLabel: {
           show: true,
+          rotate: optionsCollapse.ytextAngle, // 文字角度
           textStyle: {
-            color: optionsCollapse.colorY, // x轴 坐标文字颜色
+            color: optionsCollapse.colorY, // y轴 坐标文字颜色
             fontSize: optionsCollapse.fontSizeY
           }
         },
@@ -197,7 +200,6 @@ export default {
           }
         }
       };
-
       this.options.yAxis = yAxis;
     },
     // 折线设置
@@ -275,7 +277,6 @@ export default {
         fontSize: optionsCollapse.fontSize
       };
       legend.itemWidth = optionsCollapse.lengedWidth;
-      console.log(legend);
     },
     // 图例颜色修改
     setOptionsColor() {

+ 13 - 5
report-ui/src/views/report/bigscreen/designer/widget/widgetTable.vue

@@ -1,6 +1,7 @@
 <template>
   <div :style="styleObj">
     <superslide v-if="hackReset" :options="options" class="txtScroll-top">
+      <!--表头-->
       <div class="title">
         <div
           v-for="(item, index) in header"
@@ -10,6 +11,7 @@
           {{ item.name }}
         </div>
       </div>
+      <!--数据-->
       <div class="bd">
         <ul class="infoList">
           <li v-for="(item, index) in list" :key="index">
@@ -27,11 +29,11 @@
   </div>
 </template>
 <script>
+import vue from "vue";
 import VueSuperSlide from "vue-superslide";
+
+vue.use(VueSuperSlide);
 export default {
-  components: {
-    VueSuperSlide
-  },
   props: {
     value: Object,
     ispreview: Boolean
@@ -44,7 +46,7 @@ export default {
         mainCell: ".bd ul",
         effect: "topLoop",
         autoPage: true,
-        effect: "top",
+        //effect: "top",
         autoPlay: true,
         vis: 5
       },
@@ -130,7 +132,6 @@ export default {
     },
     handlerData() {
       const tableData = this.optionsData;
-      console.log(tableData);
       tableData.dataType == "staticData"
         ? this.handlerStaticData(tableData.staticData)
         : this.handlerDymaicData(tableData.dynamicData, tableData.refreshTime);
@@ -183,31 +184,38 @@ export default {
   overflow: hidden;
   position: relative;
 }
+
 .title {
   display: flex;
   flex-direction: row;
   width: 100%;
 }
+
 .title > div {
   height: 50px;
   line-height: 50px;
   width: 100%;
 }
+
 .txtScroll-top .bd {
   width: 100%;
 }
+
 .txtScroll-top .infoList li {
   height: 50px;
   line-height: 50px;
   display: flex;
   flex-direction: row;
 }
+
 .txtScroll-top .infoList li > div {
   width: 100%;
 }
+
 .txtScroll-top .infoList li:nth-child(n) {
   background: rgb(0, 59, 81);
 }
+
 .txtScroll-top .infoList li:nth-child(2n) {
   background: rgb(10, 39, 50);
 }

+ 1 - 1
report-ui/src/views/report/bigscreen/designer/widget/widgetTime.vue

@@ -103,7 +103,7 @@ export default {
       const dayCycleArray = ["日", "一", "二", "三", "四", "五", "六"];
       for (let i = 0; i < 7; i++) {
         if (dayCycle == i) {
-          dayCycle = "星期" + dayCycleArray[i];
+          dayCycle = " 星期" + dayCycleArray[i];
         }
       }
       if (fmt == "year-week") {