diff --git a/core/core-frontend/src/custom-component/picture-group/Component.vue b/core/core-frontend/src/custom-component/picture-group/Component.vue index d079064179..8fe9c9944c 100644 --- a/core/core-frontend/src/custom-component/picture-group/Component.vue +++ b/core/core-frontend/src/custom-component/picture-group/Component.vue @@ -214,7 +214,7 @@ const conditionAdaptor = (chart: Chart) => { defaultValueColor, field, 'url' - ) + ).color if (checkResult) { state.showUrl = checkResult } diff --git a/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue b/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue index 885be34fb4..e0c0add4ec 100644 --- a/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue +++ b/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue @@ -711,6 +711,18 @@ const conditionAdaptor = (chart: Chart) => { if (!threshold.enable) { return } + + const idNameMapping = {} + if (chart.xAxis && Array.isArray(chart.xAxis)) { + chart.xAxis.forEach(item => { + idNameMapping[item.id] = item.name + }) + } + if (chart.yAxis && Array.isArray(chart.yAxis)) { + chart.yAxis.forEach(item => { + idNameMapping[item.id] = item.name + }) + } const res = {} const conditions = threshold.tableThreshold ?? [] if (conditions?.length > 0) { @@ -718,19 +730,21 @@ const conditionAdaptor = (chart: Chart) => { const field = conditions[i] let defaultValueColor = 'none' let defaultBgColor = 'none' - res[field.field.name] = { - color: mappingColorCustom( - dataRowNameSelectSource.value[field.field.name], - defaultValueColor, - field, - 'color' - ), - backgroundColor: mappingColorCustom( - dataRowNameSelectSource.value[field.field.name], - defaultBgColor, - field, - 'backgroundColor' - ) + const colorCondition = mappingColorCustom( + dataRowNameSelectSource.value[field.field.name], + defaultValueColor, + field, + 'color' + ) + const backgroundColorCondition = mappingColorCustom( + dataRowNameSelectSource.value[field.field.name], + defaultBgColor, + field, + 'backgroundColor' + ) + res[idNameMapping[colorCondition.targetFieldId] || field.field.name] = { + color: colorCondition.color, + backgroundColor: backgroundColorCondition.color } } } diff --git a/core/core-frontend/src/views/chart/components/editor/editor-senior/components/dialog/TableThresholdEdit.vue b/core/core-frontend/src/views/chart/components/editor/editor-senior/components/dialog/TableThresholdEdit.vue index 2f0383edda..f9e160cd07 100644 --- a/core/core-frontend/src/views/chart/components/editor/editor-senior/components/dialog/TableThresholdEdit.vue +++ b/core/core-frontend/src/views/chart/components/editor/editor-senior/components/dialog/TableThresholdEdit.vue @@ -2,7 +2,7 @@ import icon_info_filled from '@/assets/svg/icon_info_filled.svg' import icon_deleteTrash_outlined from '@/assets/svg/icon_delete-trash_outlined.svg' import icon_add_outlined from '@/assets/svg/icon_add_outlined.svg' -import { PropType, reactive } from 'vue' +import { computed, PropType, reactive } from 'vue' import { useI18n } from '@/hooks/web/useI18n' import { COLOR_PANEL } from '../../../util/chart' import { fieldType } from '@/utils/attr' @@ -12,6 +12,7 @@ import { transDateFormat, transDatePickerType } from '@/views/chart/components/editor/util/DateFormatUtil' +import { TableThreshold } from '@/models/chart/chart-senior' const { t } = useI18n() @@ -203,11 +204,20 @@ const valueOptions = [ ] const predefineColors = COLOR_PANEL -const targetOptions = [ - { label: t('chart.self'), value: 'self' }, - { label: t('chart.total_row'), value: 'total_row' }, - { label: t('chart.custom'), value: 'custom' } -] +const targetOptions = computed(() => { + if (props.chart.type === 'rich-text') { + return [ + { label: t('chart.self'), value: 'self' }, + { label: t('chart.custom'), value: 'custom' } + ] + } else { + return [ + { label: t('chart.self'), value: 'self' }, + { label: t('chart.total_row'), value: 'total_row' }, + { label: t('chart.custom'), value: 'custom' } + ] + } +}) const state = reactive({ thresholdArr: [] as TableThreshold[], @@ -435,7 +445,7 @@ init() - {{ t('chart.table_threshold_tip') }} + {{ t('chart.table_threshold_tip') }}2
diff --git a/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts b/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts index b181cd2a28..c1156afab3 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts @@ -796,6 +796,7 @@ export function getConditions(chart: Chart) { export function mappingColorCustom(value, defaultColor, field, type, filedValueMap?, rowData?) { let color = null + let hitCondition = null; for (let i = 0; i < field.conditions.length; i++) { let flag = false const t = field.conditions[i] @@ -867,6 +868,7 @@ export function mappingColorCustom(value, defaultColor, field, type, filedValueM } } if (flag) { + hitCondition = t break } else if (i === field.conditions.length - 1) { color = defaultColor @@ -907,6 +909,7 @@ export function mappingColorCustom(value, defaultColor, field, type, filedValueM flag = true } if (flag) { + hitCondition = t break } else if (i === field.conditions.length - 1) { color = defaultColor @@ -925,6 +928,7 @@ export function mappingColorCustom(value, defaultColor, field, type, filedValueM } } if (flag) { + hitCondition = fc break } // time @@ -968,13 +972,25 @@ export function mappingColorCustom(value, defaultColor, field, type, filedValueM flag = true } if (flag) { + hitCondition = fc break } else if (i === field.conditions.length - 1) { color = defaultColor } } } - return color + if(hitCondition && hitCondition.target === 'custom'){ + return { + targetFieldId: hitCondition.targetFieldId, + color + } + }else{ + return { + targetFieldId: field.fieldId, + color + } + } + } export function mappingColor(value, defaultColor, rules, type, filedValueMap?, rowData?) { @@ -1233,7 +1249,7 @@ export function getPivotConditions(chart: Chart) { : hexColorToRGBA(tableHeader.tableHeaderColBgColor, basicStyle.alpha) const filedValueMap = getFieldValueMap(chart) - + const targetRulesMap = {} // columnName -> Array<{ rule, sourceField }> const xFields = chart.xAxis.map(f => f.dataeaseName) @@ -1318,7 +1334,7 @@ export function getPivotConditions(chart: Chart) { if (rowData.cornerType) { return null } - + const fill = mappingPivotColor( value, defaultBgColor,