forked from github/dataease
fix(图表-指标卡): 修复指标卡同比计算不生效的问题
This commit is contained in:
parent
6c17e14de0
commit
4a0cd02138
@ -10,6 +10,7 @@ import org.springframework.stereotype.Component;
|
||||
|
||||
import java.util.List;
|
||||
import java.util.Map;
|
||||
import java.util.Objects;
|
||||
|
||||
@Component
|
||||
public class IndicatorHandler extends YoyChartHandler {
|
||||
@ -36,23 +37,19 @@ public class IndicatorHandler extends YoyChartHandler {
|
||||
var xAxis = formatResult.getAxisMap().get(ChartAxis.xAxis);
|
||||
var yAxis = formatResult.getAxisMap().get(ChartAxis.yAxis);
|
||||
var allFields = (List<ChartViewFieldDTO>) filterResult.getContext().get("allFields");
|
||||
ChartViewFieldDTO chartViewFieldDTO = yAxis.get(0);
|
||||
ChartFieldCompareDTO compareCalc = chartViewFieldDTO.getCompareCalc();
|
||||
ChartViewFieldDTO yAxisChartViewFieldDTO = yAxis.get(0);
|
||||
ChartFieldCompareDTO compareCalc = yAxisChartViewFieldDTO.getCompareCalc();
|
||||
boolean isYoy = org.apache.commons.lang3.StringUtils.isNotEmpty(compareCalc.getType())
|
||||
&& !org.apache.commons.lang3.StringUtils.equalsIgnoreCase(compareCalc.getType(), "none");
|
||||
if (isYoy) {
|
||||
xAxis.clear();
|
||||
// 设置维度字段,从同环比中获取用户选择的字段
|
||||
xAxis.addAll(allFields.stream().filter(i -> org.springframework.util.StringUtils.endsWithIgnoreCase(i.getId().toString(), yAxis.get(0).getCompareCalc().getField().toString())).toList());
|
||||
xAxis.addAll(allFields.stream().filter(i -> org.springframework.util.StringUtils.endsWithIgnoreCase(i.getId().toString(), compareCalc.getField().toString())).toList());
|
||||
xAxis.get(0).setSort("desc");
|
||||
if (org.springframework.util.StringUtils.endsWithIgnoreCase("month_mom", compareCalc.getType())) {
|
||||
xAxis.get(0).setDateStyle("y_M");
|
||||
}
|
||||
if (org.springframework.util.StringUtils.endsWithIgnoreCase("day_mom", compareCalc.getType())) {
|
||||
if(Objects.isNull(compareCalc.getCustom())){
|
||||
xAxis.get(0).setDateStyle("y_M_d");
|
||||
}
|
||||
if (org.springframework.util.StringUtils.endsWithIgnoreCase("year_mom", compareCalc.getType())) {
|
||||
xAxis.get(0).setDateStyle("y");
|
||||
}else{
|
||||
xAxis.get(0).setDateStyle(compareCalc.getCustom().getTimeType());
|
||||
}
|
||||
}
|
||||
formatResult.getAxisMap().put(ChartAxis.xAxis, xAxis);
|
||||
|
@ -28,20 +28,48 @@ const props = defineProps({
|
||||
}
|
||||
})
|
||||
|
||||
const { compareItem, chart } = toRefs(props)
|
||||
const {compareItem, chart} = toRefs(props)
|
||||
|
||||
const state = reactive({
|
||||
fieldList: [],
|
||||
compareList: []
|
||||
compareList: [],
|
||||
dateFormatter: 'y_M_d'
|
||||
})
|
||||
|
||||
const dateFormatterList = [
|
||||
{name: '年', value: 'y'},
|
||||
{name: '年月', value: 'y_M'},
|
||||
{name: '年月日', value: 'y_M_d'}
|
||||
]
|
||||
|
||||
const changeDateFormatter = () => {
|
||||
const checkedField = state.fieldList.filter(ele => ele.id === compareItem.value.compareCalc.field)
|
||||
if (checkedField && checkedField.length > 0) {
|
||||
checkedField[0].dateStyle = state.dateFormatter
|
||||
if (!compareItem.value.compareCalc.custom) {
|
||||
compareItem.value.compareCalc.custom = {timeType: 'y_M_d'}
|
||||
}
|
||||
compareItem.value.compareCalc.custom.timeType = state.dateFormatter
|
||||
}
|
||||
initCompareType()
|
||||
}
|
||||
|
||||
const initDateFormatter = () => {
|
||||
const timeType = compareItem.value.compareCalc.custom?.timeType
|
||||
if (isIndicator.value && timeType) {
|
||||
state.dateFormatter = timeType
|
||||
changeDateFormatter()
|
||||
}
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.chart,
|
||||
() => {
|
||||
initFieldList()
|
||||
initCompareType()
|
||||
initDateFormatter()
|
||||
},
|
||||
{ deep: true }
|
||||
{deep: true}
|
||||
)
|
||||
|
||||
const isIndicator = computed(() => {
|
||||
@ -109,15 +137,6 @@ const initCompareType = () => {
|
||||
} else {
|
||||
state.compareList = []
|
||||
}
|
||||
if (isIndicator.value) {
|
||||
state.compareList = [
|
||||
{ name: 'day_mom', value: 'day_mom' },
|
||||
{ name: 'month_mom', value: 'month_mom' },
|
||||
{ name: 'year_mom', value: 'year_mom' },
|
||||
{ name: 'month_yoy', value: 'month_yoy' },
|
||||
{ name: 'year_yoy', value: 'year_yoy' }
|
||||
]
|
||||
}
|
||||
// 如果没有选中一个同环比类型,则默认选中第一个
|
||||
if (
|
||||
(!compareItem.value.compareCalc.type ||
|
||||
@ -136,9 +155,9 @@ const fieldFormatter = field => {
|
||||
return field.name + '(' + t('chart.' + field.dateStyle) + ')'
|
||||
}
|
||||
}
|
||||
|
||||
initFieldList()
|
||||
initCompareType()
|
||||
initDateFormatter()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -158,12 +177,26 @@ initCompareType()
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-if="isIndicator" :label="t('chart.datePattern')">
|
||||
<el-select
|
||||
v-model="state.dateFormatter"
|
||||
:placeholder="t('chart.date_format')"
|
||||
@change="changeDateFormatter"
|
||||
>
|
||||
<el-option
|
||||
v-for="field in dateFormatterList"
|
||||
:key="field.value"
|
||||
:label="field.name"
|
||||
:value="field.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="t('chart.compare_type')">
|
||||
<el-radio-group v-model="compareItem.compareCalc.type">
|
||||
<el-radio v-for="radio in state.compareList" :key="radio.value" :label="radio.value">{{
|
||||
t('chart.' + radio.value)
|
||||
}}</el-radio>
|
||||
t('chart.' + radio.value)
|
||||
}}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
@ -176,10 +209,10 @@ initCompareType()
|
||||
|
||||
<el-form-item :label="t('chart.compare_calc_expression')">
|
||||
<span v-if="compareItem.compareCalc.resultData === 'sub'" class="exp-style"
|
||||
>本期数据 - 上期数据</span
|
||||
>本期数据 - 上期数据</span
|
||||
>
|
||||
<span v-else-if="compareItem.compareCalc.resultData === 'percent'" class="exp-style"
|
||||
>(本期数据 / |上期数据| - 1) * 100%</span
|
||||
>(本期数据 / |上期数据| - 1) * 100%</span
|
||||
>
|
||||
</el-form-item>
|
||||
|
||||
@ -196,18 +229,22 @@ initCompareType()
|
||||
.ed-form-item {
|
||||
margin-bottom: 10px !important;
|
||||
}
|
||||
|
||||
.compare-form :deep(.ed-form-item__label) {
|
||||
font-size: 12px !important;
|
||||
font-weight: 400 !important;
|
||||
padding-top: 8px !important;
|
||||
}
|
||||
|
||||
.compare-form :deep(.ed-radio__label) {
|
||||
font-size: 12px !important;
|
||||
font-weight: 400 !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown__item :deep(span) {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
|
||||
.exp-style {
|
||||
color: #c0c4cc;
|
||||
font-size: 12px;
|
||||
|
Loading…
Reference in New Issue
Block a user