From 8ed0802e1738a25ecde9fc231f1ac33dcbf3fe5e Mon Sep 17 00:00:00 2001
From: qianming <isqianming@163.com>
Date: Tue, 11 Jul 2023 09:27:25 +0800
Subject: [PATCH] =?UTF-8?q?bugfix--#I7K1RB=20=E4=BB=AA=E8=A1=A8=E7=9B=98?=
=?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../configure/percentCharts/widget-gauge.js | 54 ++++++++++++++++---
.../designer/widget/percent/widgetGauge.vue | 39 +++++++-------
2 files changed, 67 insertions(+), 26 deletions(-)
diff --git a/report-ui/src/views/bigscreenDesigner/designer/tools/configure/percentCharts/widget-gauge.js b/report-ui/src/views/bigscreenDesigner/designer/tools/configure/percentCharts/widget-gauge.js
index 69f00877..83c24aa9 100644
--- a/report-ui/src/views/bigscreenDesigner/designer/tools/configure/percentCharts/widget-gauge.js
+++ b/report-ui/src/views/bigscreenDesigner/designer/tools/configure/percentCharts/widget-gauge.js
@@ -233,6 +233,14 @@ export const widgetGauge = {
placeholder: '',
value: 0,
},
+ {
+ type: 'vue-color',
+ label: '颜色',
+ name: 'labelColor',
+ required: false,
+ placeholder: '',
+ value: '#fff',
+ },
{
type: 'el-input-number',
label: '字号',
@@ -242,12 +250,31 @@ export const widgetGauge = {
value: 10,
},
{
- type: 'vue-color',
- label: '颜色',
- name: 'labelColor',
+ type: 'el-select',
+ label: '字体粗细',
+ name: 'labelFontWeight',
required: false,
placeholder: '',
- value: '#fff',
+ selectOptions: [
+ { code: 'normal', name: '正常' },
+ { code: 'bold', name: '粗体' },
+ { code: 'bolder', name: '特粗体' },
+ { code: 'lighter', name: '细体' }
+ ],
+ value: 'normal'
+ },
+ {
+ type: 'el-select',
+ label: '字体风格',
+ name: 'labelFontStyle',
+ required: false,
+ placeholder: '',
+ selectOptions: [
+ { code: 'normal', name: '正常' },
+ { code: 'italic', name: 'italic斜体' },
+ { code: 'oblique', name: 'oblique斜体' },
+ ],
+ value: 'normal'
},
]
},
@@ -257,7 +284,7 @@ export const widgetGauge = {
{
type: 'vue-color',
label: '颜色',
- name: 'labelColor',
+ name: 'detailColor',
required: false,
placeholder: '',
value: '#fff',
@@ -265,7 +292,7 @@ export const widgetGauge = {
{
type: 'el-input-number',
label: '字号',
- name: 'labelFontSize',
+ name: 'detailFontSize',
require: false,
placeholder: '',
value: 14,
@@ -273,7 +300,7 @@ export const widgetGauge = {
{
type: 'el-select',
label: '字体粗细',
- name: 'labelFontWeight',
+ name: 'detailFontWeight',
required: false,
placeholder: '',
selectOptions: [
@@ -284,6 +311,19 @@ export const widgetGauge = {
],
value: 'normal'
},
+ {
+ type: 'el-select',
+ label: '字体风格',
+ name: 'detailFontStyle',
+ required: false,
+ placeholder: '',
+ selectOptions: [
+ { code: 'normal', name: '正常' },
+ { code: 'italic', name: 'italic斜体' },
+ { code: 'oblique', name: 'oblique斜体' },
+ ],
+ value: 'normal'
+ },
]
},
],
diff --git a/report-ui/src/views/bigscreenDesigner/designer/widget/percent/widgetGauge.vue b/report-ui/src/views/bigscreenDesigner/designer/widget/percent/widgetGauge.vue
index bd87eda0..977051fe 100644
--- a/report-ui/src/views/bigscreenDesigner/designer/widget/percent/widgetGauge.vue
+++ b/report-ui/src/views/bigscreenDesigner/designer/widget/percent/widgetGauge.vue
@@ -1,11 +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: {},
@@ -244,9 +245,27 @@ export default {
width: optionsSetup.splitWidth,
},
};
+ const axisLabel = {
+ show: optionsSetup.labelShow,
+ color: optionsSetup.labelColor,
+ distance: optionsSetup.labelDistance,
+ fontSize: optionsSetup.labelFontSize,
+ fontWeight: optionsSetup.labelFontWeight,
+ fontStyle: optionsSetup.labelFontStyle,
+ };
+ const detail = {
+ valueAnimation: true,
+ formatter: "{value} %",
+ color: optionsSetup.detailColor,
+ fontSize: optionsSetup.detailFontSize,
+ fontWeight: optionsSetup.detailFontWeight,
+ fontStyle: optionsSetup.detailFontStyle,
+ };
series[0].axisLine = axisLine;
series[0].axisTick = axisTick;
series[0].splitLine = splitLine;
+ series[0].axisLabel = axisLabel;
+ series[0].detail = detail;
}
},
setOptionsData() {
@@ -256,7 +275,6 @@ export default {
: this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
},
staticDataFn(val) {
- const optionsSetup = this.optionsSetup;
const series = this.options.series;
const num = val[0]["num"];
const data = [
@@ -264,15 +282,7 @@ export default {
value: num,
},
];
- 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;
@@ -292,22 +302,13 @@ export default {
});
},
renderingFn(val) {
- const optionsSetup = this.optionsSetup;
const series = this.options.series;
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;
},
},
};