diff --git a/report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-stack.js b/report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-stack.js index 978f5d32..7a4e52d1 100644 --- a/report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-stack.js +++ b/report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-stack.js @@ -71,6 +71,75 @@ export const widgetBarStack = { placeholder: '', value: 5, }, + { + type: 'el-switch', + label: '背景显示', + name: 'isShowBackground', + require: false, + placeholder: '', + value: true, + }, + { + type: 'vue-color', + label: '背景颜色', + name: 'backgroundStyleColor', + required: false, + placeholder: '', + value: 'rgba(180, 180, 180, 0.2)', + }, + { + type: 'vue-color', + label: '描边颜色', + name: 'backgroundStyleBorderColor', + required: false, + placeholder: '', + value: '#000', + }, + { + type: 'el-input-number', + label: '描边宽度', + name: 'backgroundStyleBorderWidth', + required: false, + placeholder: '', + value: 0, + }, + { + type: 'el-select', + label: '描边类型', + name: 'backgroundStyleBorderType', + required: false, + placeholder: '', + selectOptions: [ + { code: 'solid', name: '实线' }, + { code: 'dashed', name: '虚线' }, + { code: 'dotted', name: '斑点' }, + ], + value: 'dashed' + }, + { + type: 'el-input-number', + label: '阴影模糊', + name: 'backgroundStyleShadowBlur', + required: false, + placeholder: '', + value: 10, + }, + { + type: 'vue-color', + label: '阴影颜色', + name: 'backgroundStyleShadowColor', + required: false, + placeholder: '', + value: 'rgba(0, 0, 0, 0.5)', + }, + { + type: 'el-slider', + label: '透明度', + name: 'backgroundStyleOpacity', + require: false, + placeholder: '', + value: 100, + }, ], }, { @@ -419,14 +488,6 @@ export const widgetBarStack = { placeholder: '', value: '100', }, - { - type: 'el-switch', - label: '阴影显示', - name: 'isShowBackground', - require: false, - placeholder: '', - value: true, - }, { type: 'el-input-text', label: '坐标名', diff --git a/report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue b/report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue index d43bc7c8..3b099354 100644 --- a/report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue +++ b/report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue @@ -312,10 +312,10 @@ export default { optionsData.dataType == "staticData" ? this.staticDataFn(optionsData.staticData, optionsSetup) : this.dynamicDataFn( - optionsData.dynamicData, - optionsData.refreshTime, - optionsSetup - ); + optionsData.dynamicData, + optionsData.refreshTime, + optionsSetup + ); }, //去重 setUnique(arr) { @@ -367,7 +367,6 @@ export default { } series.push({ name: yAxisList[i], - showBackground: optionsSetup.isShowBackground, type: "bar", data: data, barGap: "0%", @@ -389,9 +388,21 @@ export default { barBorderRadius: optionsSetup.radius, }, }, + //柱体背景属性 + showBackground: optionsSetup.isShowBackground, + backgroundStyle: { + color: optionsSetup.backgroundStyleColor, + borderColor: optionsSetup.backgroundStyleBorderColor, + borderWidth: optionsSetup.backgroundStyleBorderWidth, + borderType: optionsSetup.backgroundStyleBorderType, + shadowBlur: optionsSetup.backgroundStyleShadowBlur, + shadowColor: optionsSetup.backgroundStyleShadowColor, + opacity: optionsSetup.backgroundStyleOpacity / 100, + } }); legendName.push(yAxisList[i]); } + console.log(series) this.options.series = series; if (optionsSetup.verticalShow) { this.options.xAxis.data = []; @@ -471,6 +482,17 @@ export default { barBorderRadius: optionsSetup.radius, }, }, + //柱体背景属性 + showBackground: optionsSetup.isShowBackground, + backgroundStyle: { + color: optionsSetup.backgroundStyleColor, + borderColor: optionsSetup.backgroundStyleBorderColor, + borderWidth: optionsSetup.backgroundStyleBorderWidth, + borderType: optionsSetup.backgroundStyleBorderType, + shadowBlur: optionsSetup.backgroundStyleShadowBlur, + shadowColor: optionsSetup.backgroundStyleShadowColor, + opacity: optionsSetup.backgroundStyleOpacity / 100, + } }); } legendName.push(val.series[i].name);