lxm_front/AJ-Report
1
0
Fork 0
mirror of synced 2025-12-08 06:26:46 +08:00
Code Issues Projects Releases Wiki Activity

feat--柱状图提示语/数值设定优化

Browse Source
This commit is contained in:
qianming
2023-11-21 14:24:57 +08:00
parent 6092d41dec
commit 79c3e1a8e3
12 changed files with 355 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-compare.js
View File

@@ -702,6 +702,40 @@ export const widgetBarCompare = {
{
name: '提示语设置',
list: [
{
type: 'el-switch',
label: '显示',
name: 'isShowTooltip',
required: false,
placeholder: '',
value: true
},
{
type: 'el-select',
label: '触发类型',
name: 'tooltipTrigger',
required: false,
placeholder: '',
selectOptions: [
{ code: 'item', name: '数据项' },
{ code: 'axis', name: '坐标轴' },
],
value: 'axis'
},
{
type: 'el-select',
label: '指示器类型',
name: 'tooltipAxisPointerType',
required: false,
placeholder: '',
selectOptions: [
{ code: 'none', name: '无' },
{ code: 'line', name: '直线' },
{ code: 'shadow', name: '阴影' },
{ code: 'cross', name: '十字准星' },
],
value: 'shadow'
},
{
type: 'el-input-number',
label: '字体字号',

60
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-double-yaxis-chart.js
View File

@@ -743,12 +743,30 @@ export const widgetBarDoubleYaxis = {
value: false
},
{
type: 'el-input-number',
label: '距离',
name: 'distance',
type: 'el-select',
label: '位置',
name: 'fontPosition',
required: false,
placeholder: '',
value: 5
selectOptions: [
{ code: 'top', name: '上' },
{ code: 'left', name: '左' },
{ code: 'right', name: '右' },
{ code: 'inside', name: '里' },
{ code: 'insideTop', name: '里顶' },
{ code: 'insideLeft', name: '里左' },
{ code: 'insideRight', name: '里右' },
{ code: 'insideBottom', name: '里底' },
],
value: 'insideTop'
},
{
type: 'el-input-number',
label: '距离',
name: 'fontDistance',
required: false,
placeholder: '',
value: 0
},
{
type: 'el-input-number',
@@ -785,6 +803,40 @@ export const widgetBarDoubleYaxis = {
{
name: '提示语设置',
list: [
{
type: 'el-switch',
label: '显示',
name: 'isShowTooltip',
required: false,
placeholder: '',
value: true
},
{
type: 'el-select',
label: '触发类型',
name: 'tooltipTrigger',
required: false,
placeholder: '',
selectOptions: [
{ code: 'item', name: '数据项' },
{ code: 'axis', name: '坐标轴' },
],
value: 'axis'
},
{
type: 'el-select',
label: '指示器类型',
name: 'tooltipAxisPointerType',
required: false,
placeholder: '',
selectOptions: [
{ code: 'none', name: '无' },
{ code: 'line', name: '直线' },
{ code: 'shadow', name: '阴影' },
{ code: 'cross', name: '十字准星' },
],
value: 'shadow'
},
{
type: 'el-input-number',
label: '字体字号',

34
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-stack-more-show.js
View File

@@ -671,6 +671,40 @@ export const widgetBarStackMoreShow = {
{
name: '提示语设置',
list: [
{
type: 'el-switch',
label: '显示',
name: 'isShowTooltip',
required: false,
placeholder: '',
value: true
},
{
type: 'el-select',
label: '触发类型',
name: 'tooltipTrigger',
required: false,
placeholder: '',
selectOptions: [
{ code: 'item', name: '数据项' },
{ code: 'axis', name: '坐标轴' },
],
value: 'axis'
},
{
type: 'el-select',
label: '指示器类型',
name: 'tooltipAxisPointerType',
required: false,
placeholder: '',
selectOptions: [
{ code: 'none', name: '无' },
{ code: 'line', name: '直线' },
{ code: 'shadow', name: '阴影' },
{ code: 'cross', name: '十字准星' },
],
value: 'shadow'
},
{
type: 'el-input-number',
label: '字体字号',

68
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-bar-stack.js
View File

@@ -71,6 +71,14 @@ export const widgetBarStack = {
placeholder: '',
value: 5,
},
{
type: 'el-slider',
label: '间距',
name: 'barGap',
required: false,
placeholder: '',
value: 0,
},
{
type: 'el-switch',
label: '背景显示',
@@ -637,6 +645,32 @@ export const widgetBarStack = {
placeholder: '',
value: false
},
{
type: 'el-select',
label: '位置',
name: 'fontPosition',
required: false,
placeholder: '',
selectOptions: [
{ code: 'top', name: '上' },
{ code: 'left', name: '左' },
{ code: 'right', name: '右' },
{ code: 'inside', name: '里' },
{ code: 'insideTop', name: '里顶' },
{ code: 'insideLeft', name: '里左' },
{ code: 'insideRight', name: '里右' },
{ code: 'insideBottom', name: '里底' },
],
value: 'insideTop'
},
{
type: 'el-input-number',
label: '距离',
name: 'fontDistance',
required: false,
placeholder: '',
value: 0
},
{
type: 'el-input-number',
label: '字体字号',
@@ -672,6 +706,40 @@ export const widgetBarStack = {
{
name: '提示语设置',
list: [
{
type: 'el-switch',
label: '显示',
name: 'isShowTooltip',
required: false,
placeholder: '',
value: true
},
{
type: 'el-select',
label: '触发类型',
name: 'tooltipTrigger',
required: false,
placeholder: '',
selectOptions: [
{ code: 'item', name: '数据项' },
{ code: 'axis', name: '坐标轴' },
],
value: 'axis'
},
{
type: 'el-select',
label: '指示器类型',
name: 'tooltipAxisPointerType',
required: false,
placeholder: '',
selectOptions: [
{ code: 'none', name: '无' },
{ code: 'line', name: '直线' },
{ code: 'shadow', name: '阴影' },
{ code: 'cross', name: '十字准星' },
],
value: 'shadow'
},
{
type: 'el-input-number',
label: '字体字号',

60
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-barchart.js
View File

@@ -646,12 +646,30 @@ export const widgetBarchart = {
value: false
},
{
type: 'el-input-number',
label: '距离',
name: 'distance',
type: 'el-select',
label: '位置',
name: 'fontPosition',
required: false,
placeholder: '',
value: 5
selectOptions: [
{ code: 'top', name: '上' },
{ code: 'left', name: '左' },
{ code: 'right', name: '右' },
{ code: 'inside', name: '里' },
{ code: 'insideTop', name: '里顶' },
{ code: 'insideLeft', name: '里左' },
{ code: 'insideRight', name: '里右' },
{ code: 'insideBottom', name: '里底' },
],
value: 'insideTop'
},
{
type: 'el-input-number',
label: '距离',
name: 'fontDistance',
required: false,
placeholder: '',
value: 0
},
{
type: 'el-input-number',
@@ -688,6 +706,40 @@ export const widgetBarchart = {
{
name: '提示语设置',
list: [
{
type: 'el-switch',
label: '显示',
name: 'isShowTooltip',
required: false,
placeholder: '',
value: true
},
{
type: 'el-select',
label: '触发类型',
name: 'tooltipTrigger',
required: false,
placeholder: '',
selectOptions: [
{ code: 'item', name: '数据项' },
{ code: 'axis', name: '坐标轴' },
],
value: 'axis'
},
{
type: 'el-select',
label: '指示器类型',
name: 'tooltipAxisPointerType',
required: false,
placeholder: '',
selectOptions: [
{ code: 'none', name: '无' },
{ code: 'line', name: '直线' },
{ code: 'shadow', name: '阴影' },
{ code: 'cross', name: '十字准星' },
],
value: 'shadow'
},
{
type: 'el-input-number',
label: '字体字号',

60
report-ui/src/views/bigscreenDesigner/designer/tools/configure/barCharts/widget-gradient-barchart.js
View File

@@ -528,12 +528,30 @@ export const widgetGradientBarchart = {
value: false
},
{
type: 'el-input-number',
label: '距离',
name: 'distance',
type: 'el-select',
label: '位置',
name: 'fontPosition',
required: false,
placeholder: '',
value: 5
selectOptions: [
{ code: 'top', name: '上' },
{ code: 'left', name: '左' },
{ code: 'right', name: '右' },
{ code: 'inside', name: '里' },
{ code: 'insideTop', name: '里顶' },
{ code: 'insideLeft', name: '里左' },
{ code: 'insideRight', name: '里右' },
{ code: 'insideBottom', name: '里底' },
],
value: 'insideTop'
},
{
type: 'el-input-number',
label: '距离',
name: 'fontDistance',
required: false,
placeholder: '',
value: 0
},
{
type: 'el-input-number',
@@ -570,6 +588,40 @@ export const widgetGradientBarchart = {
{
name: '提示语设置',
list: [
{
type: 'el-switch',
label: '显示',
name: 'isShowTooltip',
required: false,
placeholder: '',
value: true
},
{
type: 'el-select',
label: '触发类型',
name: 'tooltipTrigger',
required: false,
placeholder: '',
selectOptions: [
{ code: 'item', name: '数据项' },
{ code: 'axis', name: '坐标轴' },
],
value: 'axis'
},
{
type: 'el-select',
label: '指示器类型',
name: 'tooltipAxisPointerType',
required: false,
placeholder: '',
selectOptions: [
{ code: 'none', name: '无' },
{ code: 'line', name: '直线' },
{ code: 'shadow', name: '阴影' },
{ code: 'cross', name: '十字准星' },
],
value: 'shadow'
},
{
type: 'el-input-number',
label: '字体字号',

7
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarCompareChart.vue
View File

@@ -477,8 +477,11 @@ export default {
setOptionsTooltip() {
const optionsSetup = this.optionsSetup;
const tooltip = {
trigger: "item",
show: true,
show: optionsSetup.isShowTooltip,
trigger: optionsSetup.tooltipTrigger,
axisPointer: {
type: optionsSetup.tooltipAxisPointerType,
},
textStyle: {
color: optionsSetup.tipsColor,
fontSize: optionsSetup.tipsFontSize,

11
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarDoubleYaxisChart.vue
View File

@@ -314,8 +314,8 @@ export default {
if (series[key].type == "bar") {
series[key].label = {
show: optionsSetup.isShow,
position: "top",
distance: optionsSetup.distance,
position: optionsSetup.fontPosition,
distance: optionsSetup.fontDistance,
fontSize: optionsSetup.fontSize,
color: optionsSetup.dataColor,
fontWeight: optionsSetup.fontWeight,
@@ -342,8 +342,11 @@ export default {
setOptionsTooltip() {
const optionsSetup = this.optionsSetup;
const tooltip = {
trigger: "item",
show: true,
show: optionsSetup.isShowTooltip,
trigger: optionsSetup.tooltipTrigger,
axisPointer: {
type: optionsSetup.tooltipAxisPointerType,
},
textStyle: {
color: optionsSetup.tipsColor,
fontSize: optionsSetup.tipsFontSize,

19
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackChart.vue
View File

@@ -222,8 +222,11 @@ export default {
setOptionsTooltip() {
const optionsSetup = this.optionsSetup;
const tooltip = {
trigger: "item",
show: true,
show: optionsSetup.isShowTooltip,
trigger: optionsSetup.tooltipTrigger,
axisPointer: {
type: optionsSetup.tooltipAxisPointerType,
},
textStyle: {
color: optionsSetup.tipsColor,
fontSize: optionsSetup.tipsFontSize,
@@ -359,13 +362,13 @@ export default {
name: yAxisList[i],
type: "bar",
data: data,
barGap: "0%",
barGap: optionsSetup.barGap + "%",
stack: this.getStackStyle(),
barWidth: optionsSetup.maxWidth,
label: {
show: optionsSetup.isShow,
position: "top",
distance: 10,
position: optionsSetup.fontPosition,
distance: optionsSetup.fontDistance,
fontSize: optionsSetup.fontSize,
color: optionsSetup.dataColor,
fontWeight: optionsSetup.fontWeight,
@@ -466,13 +469,13 @@ export default {
name: val.series[i].name,
type: "bar",
data: val.series[i].data,
barGap: "0%",
barGap: optionsSetup.barGap + "%",
stack: this.getStackStyle(),
barWidth: optionsSetup.maxWidth,
label: {
show: optionsSetup.isShow,
position: "top",
distance: 10,
position: optionsSetup.fontPosition,
distance: optionsSetup.fontDistance,
fontSize: optionsSetup.fontSize,
color: optionsSetup.dataColor,
fontWeight: optionsSetup.fontWeight,

7
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarStackMoreShowChart.vue
View File

@@ -222,8 +222,11 @@ export default {
setOptionsTooltip() {
const optionsSetup = this.optionsSetup;
const tooltip = {
trigger: "item",
show: true,
show: optionsSetup.isShowTooltip,
trigger: optionsSetup.tooltipTrigger,
axisPointer:{
type: optionsSetup.tooltipAxisPointerType,
},
textStyle: {
color: optionsSetup.tipsColor,
fontSize: optionsSetup.tipsFontSize,

26
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetBarchart.vue
View File

@@ -229,8 +229,11 @@ export default {
setOptionsTooltip() {
const optionsSetup = this.optionsSetup;
const tooltip = {
trigger: "item",
show: true,
show: optionsSetup.isShowTooltip,
trigger: optionsSetup.tooltipTrigger,
axisPointer:{
type: optionsSetup.tooltipAxisPointerType,
},
textStyle: {
color: optionsSetup.tipsColor,
fontSize: optionsSetup.tipsFontSize,
@@ -293,17 +296,6 @@ export default {
}
return style;
},
// 获得位置
getOptionsPosition() {
const optionsSetup = this.optionsSetup;
let position = "";
if (optionsSetup.verticalShow) {
position = "right";
} else {
position = "top";
}
return position;
},
// 数据解析
setOptionsData(e, paramsConfig) {
const optionsData = this.optionsData; // 数据类型 静态 or 动态
@@ -354,8 +346,8 @@ export default {
series[i].barMinHeight = optionsSetup.minHeight;
series[i].label = {
show: optionsSetup.isShow,
position: this.getOptionsPosition(),
distance: optionsSetup.distance,
position: optionsSetup.fontPosition,
distance: optionsSetup.fontDistance,
fontSize: optionsSetup.fontSize,
color: optionsSetup.dataColor,
fontWeight: optionsSetup.fontWeight,
@@ -475,8 +467,8 @@ export default {
obj.barMinHeight = optionsSetup.minHeight;
obj.label = {
show: optionsSetup.isShow,
position: this.getOptionsPosition(),
distance: optionsSetup.distance,
position: optionsSetup.fontPosition,
distance: optionsSetup.fontDistance,
fontSize: optionsSetup.fontSize,
color: optionsSetup.dataColor,
fontWeight: optionsSetup.fontWeight,

37
report-ui/src/views/bigscreenDesigner/designer/widget/bar/widgetGradientColorBarchart.vue
View File

@@ -306,27 +306,15 @@ export default {
const optionsSetup = this.optionsSetup;
const series = this.options.series;
if (series[0].type == "bar") {
if (optionsSetup.verticalShow) {
series[0].label = {
show: optionsSetup.isShow,
position: "right",
distance: optionsSetup.distance,
fontSize: optionsSetup.fontSize,
color: optionsSetup.dataColor,
fontWeight: optionsSetup.fontWeight,
formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
};
} else {
series[0].label = {
show: optionsSetup.isShow,
position: "top",
distance: optionsSetup.distance,
fontSize: optionsSetup.fontSize,
color: optionsSetup.dataColor,
fontWeight: optionsSetup.fontWeight,
formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
};
}
series[0].label = {
show: optionsSetup.isShow,
position: optionsSetup.fontPosition,
distance: optionsSetup.fontDistance,
fontSize: optionsSetup.fontSize,
color: optionsSetup.dataColor,
fontWeight: optionsSetup.fontWeight,
formatter: !!optionsSetup.percentSign ? '{c}%' : '{c}'
};
series[0].barWidth = optionsSetup.maxWidth;
//柱体背景属性
series[0].showBackground = optionsSetup.isShowBackground;
@@ -345,8 +333,11 @@ export default {
setOptionsTooltip() {
const optionsSetup = this.optionsSetup;
const tooltip = {
trigger: "item",
show: true,
show: optionsSetup.isShowTooltip,
trigger: optionsSetup.tooltipTrigger,
axisPointer: {
type: optionsSetup.tooltipAxisPointerType,
},
textStyle: {
color: optionsSetup.tipsColor,
fontSize: optionsSetup.tipsFontSize,