bugfix-装饰饼图，其他优化

report-ui/src/views/bigscreenDesigner/designer/index.vue

@@ -65,7 +65,7 @@
       :style="{ width: widthLeftForToolsHideButton + 'px' }"
       @click="toolIsShow = !toolIsShow"
     >
-      <i class="el-icon-arrow-right" />
+      <i class="el-icon-arrow-right"/>
     </div>
 
     <div
@@ -130,7 +130,7 @@
             content="缩小"
             placement="bottom"
           >
-            <i class="el-icon-minus" style="font-size: 16px" />
+            <i class="el-icon-minus" style="font-size: 16px"/>
           </el-tooltip>
         </span>
         <span
@@ -165,7 +165,7 @@
             content="放大"
             placement="bottom"
           >
-            <i class="el-icon-plus" style="font-size: 16px" />
+            <i class="el-icon-plus" style="font-size: 16px"/>
           </el-tooltip>
         </span>
 
@@ -349,7 +349,7 @@
 </template>
 
 <script>
-import { widgetTools, getToolByCode } from "./tools/index";
+import {widgetTools, getToolByCode} from "./tools/index";
 import mixin from "@/utils/screenMixins";
 import widget from "./widget/widget.vue";
 import dynamicForm from "./components/dynamicForm.vue";
@@ -598,18 +598,21 @@ export default {
       return widgetJson;
     },
     setWidgetConfigValue(config, configValue) {
-      config.forEach((item) => {
-        if (this.isObjectFn(item)) {
-          configValue[item.name] = item.value;
-        }
-        if (this.isArrayFn(item)) {
-          item.forEach((itemChild) => {
-            itemChild.list.forEach((ev) => {
-              configValue[ev.name] = ev.value;
+      // 循环遍历前非空判断
+      if (config) {
+        config.forEach((item) => {
+          if (this.isObjectFn(item)) {
+            configValue[item.name] = item.value;
+          }
+          if (this.isArrayFn(item)) {
+            item.forEach((itemChild) => {
+              itemChild.list.forEach((ev) => {
+                configValue[ev.name] = ev.value;
+              });
             });
-          });
-        }
-      });
+          }
+        });
+      }
     },
     layerClick(index) {
       this.widgetIndex = index;

report-ui/src/views/bigscreenDesigner/designer/tools/configure/styleWidget/widget-border.js

@@ -21,7 +21,7 @@ export const widgetBorder =  {
           name: 'layerName',
           required: false,
           placeholder: '',
-          value: '边框一',
+          value: '边框',
         },
         {
           type: 'el-select',

report-ui/src/views/bigscreenDesigner/designer/tools/configure/decorateCharts/widget-decorate-pie.js → report-ui/src/views/bigscreenDesigner/designer/tools/configure/styleWidget/widget-decorate-pie.js

@@ -8,8 +8,8 @@
  */
 export const widgetDecoratePie = {
   code: 'widgetDecoratePieChart',
-  type: 'decorate',
-  tabName: '装饰图',
+  type: 'border',
+  tabName: '样式组件',
   label: '装饰饼图',
   icon: 'iconicon_tubiao_bingtu',
   options: {
@@ -407,6 +407,7 @@ export const widgetDecoratePie = {
         },
       ],
     ],
+    data: [],
     // 坐标
     position: [
       {

report-ui/src/views/bigscreenDesigner/designer/tools/configure/styleWidget/widget-decoration.js

@@ -21,7 +21,7 @@ export const widgetDecoration =  {
           name: 'layerName',
           required: false,
           placeholder: '',
-          value: '装饰一',
+          value: '装饰',
         },
         {
           type: 'el-select',

report-ui/src/views/bigscreenDesigner/designer/tools/configure/texts/widget-time.js

@@ -73,7 +73,7 @@ export const widgetTime = {
         name: 'background',
         required: false,
         placeholder: '',
-        value: 'rgba(115,170,229,.5)'
+        value: ''
       },
       {
         type: 'el-select',

report-ui/src/views/bigscreenDesigner/designer/tools/main.js

@@ -32,7 +32,7 @@ import { widgetBarStack } from "./configure/barCharts/widget-bar-stack"
 import { widgetLineStack } from "./configure/lineCharts/widget-line-stack"
 import { widgetBarCompare } from "./configure/barCharts/widget-bar-compare"
 import { widgetLineCompare } from "./configure/lineCharts/widget-line-compare"
-import { widgetDecoratePie } from "./configure/decorateCharts/widget-decorate-pie";
+import { widgetDecoratePie } from "./configure/styleWidget/widget-decorate-pie";
 import { widgetMoreBarLine } from "./configure/barlineCharts/widget-more-bar-line";
 import { widgetWordCloud } from "./configure/wordcloudCharts/widget-word-cloud";
 import { widgetHeatmap } from "./configure/heatmap/widget-heatmap";

report-ui/src/views/bigscreenDesigner/designer/widget/styleWidget/widgetBorder.vue

@@ -1,46 +1,48 @@
 <template>
-    <div :style="styleObj" >
-        <component :is="value.setup.showtype" :value="value" />
-    </div>
+  <div :style="styleObj">
+    <component :is="value.setup.showtype" :value="value"/>
+  </div>
 </template>
 <script>
 export default ({
-    data() {
-        return {
-            optionsStyle: {}, // 样式
-        }
-    },
-    props: {
-        value: Object,
-        ispreview: Boolean,
-        widgetIndex: {
-            type: Number,
-            default: 0,
-        }, // 当前组件，在工作区变量widgetInWorkbench中的索引
+  name: "widgetBorder",
+  components: {},
+  data() {
+    return {
+      optionsStyle: {}, // 样式
+    }
+  },
+  props: {
+    value: Object,
+    ispreview: Boolean,
+    widgetIndex: {
+      type: Number,
+      default: 0,
+    }, // 当前组件，在工作区变量widgetInWorkbench中的索引
+  },
+  watch: {
+    value: {
+      handler(val) {
+        this.optionsStyle = val.position;
+        this.optionsData = val.data;
+        this.optionsCollapse = val.collapse;
+        this.optionsSetup = val.setup;
+      },
+      deep: true,
     },
-    watch: {
-        value: {
-            handler(val) {
-                this.optionsStyle = val.position;
-                this.optionsData = val.data;
-                this.optionsCollapse = val.collapse;
-                this.optionsSetup = val.setup;
-            },
-            deep: true,
-        },
+  },
+  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",
+      };
     },
-    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",
-            };
-        },
-    }
+  }
 })
 </script>
 <style scoped lang="scss">
-</style>
+</style>

report-ui/src/views/bigscreenDesigner/designer/widget/decorate/widgetDecoratePieChart.vue → report-ui/src/views/bigscreenDesigner/designer/widget/styleWidget/widgetDecoratePieChart.vue

@@ -1,6 +1,6 @@
 <template>
   <div :style="styleObj">
-    <v-chart :options="options" autoresize />
+    <v-chart ref="myVChart" :options="options" autoresize />
   </div>
 </template>
 

report-ui/src/views/bigscreenDesigner/designer/widget/styleWidget/widgetDecoration.vue

@@ -1,45 +1,47 @@
 <template>
-    <div :style="styleObj">
-        <component :is="value.setup.showtype" :value="value" :style="styleObj"/>
-    </div>
+  <div :style="styleObj">
+    <component :is="value.setup.showtype" :value="value" :style="styleObj"/>
+  </div>
 </template>
 <script>
 export default ({
-    data() {
-        return {
-            optionsStyle: {}, // 样式
-        }
-    },
-    props: {
-        value: Object,
-        ispreview: Boolean,
-        widgetIndex: {
-            type: Number,
-            default: 0,
-        }, // 当前组件，在工作区变量widgetInWorkbench中的索引
+  name: "widgetDecoration",
+  components: {},
+  data() {
+    return {
+      optionsStyle: {}, // 样式
+    }
+  },
+  props: {
+    value: Object,
+    ispreview: Boolean,
+    widgetIndex: {
+      type: Number,
+      default: 0,
+    }, // 当前组件，在工作区变量widgetInWorkbench中的索引
+  },
+  watch: {
+    value: {
+      handler(val) {
+        this.optionsStyle = val.position;
+        this.optionsData = val.data;
+        this.optionsCollapse = val.collapse;
+        this.optionsSetup = val.setup;
+      },
+      deep: true,
     },
-    watch: {
-        value: {
-            handler(val) {
-                this.optionsStyle = val.position;
-                this.optionsData = val.data;
-                this.optionsCollapse = val.collapse;
-                this.optionsSetup = val.setup;
-            },
-            deep: true,
-        },
+  },
+  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",
+      };
     },
-    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",
-            };
-        },
-    }
+  }
 })
 </script>
-<style scoped lang="scss"></style>
+<style scoped lang="scss"></style>

report-ui/src/views/bigscreenDesigner/designer/widget/temp.vue

@@ -34,7 +34,7 @@ import widgetBarStackChart from "./bar/widgetBarStackChart";
 import widgetLineStackChart from "./line/widgetLineStackChart";
 import widgetBarCompareChart from "./bar/widgetBarCompareChart";
 import widgetLineCompareChart from "./line/widgetLineCompareChart";
-import widgetDecoratePieChart from "./decorate/widgetDecoratePieChart";
+import widgetDecoratePieChart from "./styleWidget/widgetDecoratePieChart.vue";
 import widgetMoreBarLineChart from "./barline/widgetMoreBarLineChart";
 import widgetWordCloud from "./wordcloud/widgetWordCloud";
 import widgetHeatmap from "./heatmap/widgetHeatmap";
@@ -46,12 +46,16 @@ import widgetFormTime from "./form/widgetFormTime.vue";
 import widgetScaleVertical from "./scale/widgetScaleVertical.vue";
 import widgetScaleHorizontal from "./scale/widgetScaleHorizontal.vue";
 import widgetBarDoubleYaxisChart from "./bar/widgetBarDoubleYaxisChart.vue";
+import widgetBorder from "./styleWidget/widgetBorder.vue";
+import widgetDecoration from "./styleWidget/widgetDecoration.vue";
 
 export default {
   name: "WidgetTemp",
   components: {
     widgetHref,
     widgetText,
+    widgetBorder,
+    widgetDecoration,
     WidgetMarquee,
     widgetTime,
     widgetImage,

report-ui/src/views/bigscreenDesigner/designer/widget/widget.vue

@@ -41,7 +41,7 @@ import widgetBarStackChart from "./bar/widgetBarStackChart";
 import widgetLineStackChart from "./line/widgetLineStackChart";
 import widgetBarCompareChart from "./bar/widgetBarCompareChart";
 import widgetLineCompareChart from "./line/widgetLineCompareChart";
-import widgetDecoratePieChart from "./decorate/widgetDecoratePieChart";
+import widgetDecoratePieChart from "./styleWidget/widgetDecoratePieChart.vue";
 import widgetMoreBarLineChart from "./barline/widgetMoreBarLineChart";
 import widgetWordCloud from "./wordcloud/widgetWordCloud";
 import widgetHeatmap from "./heatmap/widgetHeatmap";