diff --git a/report-ui/src/views/report/bigscreen/designer/tools/echartsConfigJson/widget-decorate-pie.js b/report-ui/src/views/report/bigscreen/designer/tools/echartsConfigJson/widget-decorate-pie.js
new file mode 100644
index 00000000..cf713149
--- /dev/null
+++ b/report-ui/src/views/report/bigscreen/designer/tools/echartsConfigJson/widget-decorate-pie.js
@@ -0,0 +1,339 @@
+/*
+ * @Descripttion: 装饰饼图
+ * @version:
+ * @Author: foming
+ * @Date:
+ * @LastEditors:
+ * @LastEditTime:
+ */
+export const widgetDecoratePie = {
+ code: 'widgetDecoratePieChart',
+ 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: ''
+ },
+ [
+ {
+ 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'}],
+ },
+ ],
+ },
+ ],
+ ],
+ // 坐标
+ position: [
+ {
+ type: 'el-input-number',
+ label: '左边距',
+ name: 'left',
+ required: false,
+ placeholder: '',
+ value: 0,
+ },
+ {
+ type: 'el-input-number',
+ label: '上边距',
+ name: 'top',
+ required: false,
+ placeholder: '',
+ 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: 300,
+ },
+ ],
+ }
+}
diff --git a/report-ui/src/views/report/bigscreen/designer/tools/main.js b/report-ui/src/views/report/bigscreen/designer/tools/main.js
index 2bce8560..d0e81f0f 100644
--- a/report-ui/src/views/report/bigscreen/designer/tools/main.js
+++ b/report-ui/src/views/report/bigscreen/designer/tools/main.js
@@ -7,31 +7,32 @@
* @LastEditTime: 2021-09-28 13:33:47
*/
-import { widgetText } from "./echartsConfigJson/widget-text"
-import { widgetMarquee } from "./echartsConfigJson/widget-marquee"
-import { widgetHref } from "./echartsConfigJson/widget-href"
-import { widgetTime } from "./echartsConfigJson/widget-time"
-import { widgetImage } from "./echartsConfigJson/widget-image"
-import { widgetSliders } from "./echartsConfigJson/widget-slider"
-import { widgetVideo } from "./echartsConfigJson/widget-video"
-import { widgetTable } from "./echartsConfigJson/widget-table"
-import { widgetIframe } from "./echartsConfigJson/widget-iframe"
-import { widgetUniversal } from "./echartsConfigJson/widget-universal"
-import { widgetBarchart } from "./echartsConfigJson/widget-barchart"
-import { widgetGradientBarchart } from "./echartsConfigJson/widget-gradient-barchart"
-import { widgetLinechart } from "./echartsConfigJson/widget-linechart"
-import { widgetBarlinechart } from "./echartsConfigJson/widget-barlinechart"
-import { widgetPiechart } from "./echartsConfigJson/widget-piechart"
-import { widgetFunnel } from "./echartsConfigJson/widget-funnel"
-import { widgetGauge } from "./echartsConfigJson/widget-gauge"
-import { widgetMap } from "./echartsConfigJson/widget-map"
-import { WidgetPieNightingale } from "./echartsConfigJson/widget-pie-nightingale"
-import { widgetPiePercentage } from "./echartsConfigJson/widget-pie-percentage"
-import { widgetAirbubbleMap } from "./echartsConfigJson/widget-airbubble-map"
-import { widgetBarStack } from "./echartsConfigJson/widget-bar-stack"
-import { widgetLineStack } from "./echartsConfigJson/widget-line-stack"
-import { widgetBarCompare } from "./echartsConfigJson/widget-bar-compare"
-import { widgetLineCompare } from "./echartsConfigJson/widget-line-compare"
+import {widgetText} from "./echartsConfigJson/widget-text"
+import {widgetMarquee} from "./echartsConfigJson/widget-marquee"
+import {widgetHref} from "./echartsConfigJson/widget-href"
+import {widgetTime} from "./echartsConfigJson/widget-time"
+import {widgetImage} from "./echartsConfigJson/widget-image"
+import {widgetSliders} from "./echartsConfigJson/widget-slider"
+import {widgetVideo} from "./echartsConfigJson/widget-video"
+import {widgetTable} from "./echartsConfigJson/widget-table"
+import {widgetIframe} from "./echartsConfigJson/widget-iframe"
+import {widgetUniversal} from "./echartsConfigJson/widget-universal"
+import {widgetBarchart} from "./echartsConfigJson/widget-barchart"
+import {widgetGradientBarchart} from "./echartsConfigJson/widget-gradient-barchart"
+import {widgetLinechart} from "./echartsConfigJson/widget-linechart"
+import {widgetBarlinechart} from "./echartsConfigJson/widget-barlinechart"
+import {widgetPiechart} from "./echartsConfigJson/widget-piechart"
+import {widgetFunnel} from "./echartsConfigJson/widget-funnel"
+import {widgetGauge} from "./echartsConfigJson/widget-gauge"
+import {widgetMap} from "./echartsConfigJson/widget-map"
+import {WidgetPieNightingale} from "./echartsConfigJson/widget-pie-nightingale"
+import {widgetPiePercentage} from "./echartsConfigJson/widget-pie-percentage"
+import {widgetAirbubbleMap} from "./echartsConfigJson/widget-airbubble-map"
+import {widgetBarStack} from "./echartsConfigJson/widget-bar-stack"
+import {widgetLineStack} from "./echartsConfigJson/widget-line-stack"
+import {widgetBarCompare} from "./echartsConfigJson/widget-bar-compare"
+import {widgetLineCompare} from "./echartsConfigJson/widget-line-compare"
+import {widgetDecoratePie} from "./echartsConfigJson/widget-decorate-pie";
export const widgetTool = [
// type=html类型的组件
@@ -59,5 +60,6 @@ export const widgetTool = [
widgetBarStack,
widgetLineStack,
widgetBarCompare,
- widgetLineCompare
+ widgetLineCompare,
+ widgetDecoratePie
]
diff --git a/report-ui/src/views/report/bigscreen/designer/widget/decorate/widgetDecoratePieChart.vue b/report-ui/src/views/report/bigscreen/designer/widget/decorate/widgetDecoratePieChart.vue
new file mode 100644
index 00000000..7f3b2937
--- /dev/null
+++ b/report-ui/src/views/report/bigscreen/designer/widget/decorate/widgetDecoratePieChart.vue
@@ -0,0 +1,399 @@
+
+
+
+
+
+
+
+
+
diff --git a/report-ui/src/views/report/bigscreen/designer/widget/pie/widgetPieNightingaleRose.vue b/report-ui/src/views/report/bigscreen/designer/widget/pie/widgetPieNightingaleRose.vue
index fabaa6f4..fccb7274 100644
--- a/report-ui/src/views/report/bigscreen/designer/widget/pie/widgetPieNightingaleRose.vue
+++ b/report-ui/src/views/report/bigscreen/designer/widget/pie/widgetPieNightingaleRose.vue
@@ -59,7 +59,6 @@ export default {
watch: {
value: {
handler(val) {
- console.log(val);
this.optionsStyle = val.position;
this.optionsData = val.data;
this.optionsCollapse = val.setup;
diff --git a/report-ui/src/views/report/bigscreen/designer/widget/temp.vue b/report-ui/src/views/report/bigscreen/designer/widget/temp.vue
index b0efa8bd..3029be83 100644
--- a/report-ui/src/views/report/bigscreen/designer/widget/temp.vue
+++ b/report-ui/src/views/report/bigscreen/designer/widget/temp.vue
@@ -35,6 +35,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";
export default {
name: "WidgetTemp",
@@ -62,7 +63,8 @@ export default {
widgetBarStackChart,
widgetLineStackChart,
widgetBarCompareChart,
- widgetLineCompareChart
+ widgetLineCompareChart,
+ widgetDecoratePieChart
},
model: {
prop: "value",
diff --git a/report-ui/src/views/report/bigscreen/designer/widget/widget.vue b/report-ui/src/views/report/bigscreen/designer/widget/widget.vue
index 00a827c0..94e73be4 100644
--- a/report-ui/src/views/report/bigscreen/designer/widget/widget.vue
+++ b/report-ui/src/views/report/bigscreen/designer/widget/widget.vue
@@ -46,6 +46,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";
export default {
name: "Widget",
@@ -73,7 +74,8 @@ export default {
widgetBarStackChart,
widgetLineStackChart,
widgetBarCompareChart,
- widgetLineCompareChart
+ widgetLineCompareChart,
+ widgetDecoratePieChart
},
model: {
prop: "value",