From 09fd0452749e7faae2c39b0b5a6b21cabbc95cf2 Mon Sep 17 00:00:00 2001 From: wisonic-s Date: Thu, 5 Mar 2026 20:21:57 +0800 Subject: [PATCH] =?UTF-8?q?fix(=E5=9B=BE=E8=A1=A8)=EF=BC=9A=E4=BF=AE?= =?UTF-8?q?=E5=A4=8D=E9=80=8F=E8=A7=86=E8=A1=A8=E5=9C=A8=E5=A4=A7=E5=B1=8F?= =?UTF-8?q?=E4=B8=AD=E8=A1=8C=E5=A4=B4=E5=AE=BD=E5=BA=A6=E6=B8=B2=E6=9F=93?= =?UTF-8?q?=E9=94=99=E8=AF=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/models/chart/chart-attr.d.ts | 4 +++ core/core-frontend/src/utils/canvasStyle.ts | 3 +- .../components/BasicStyleSelector.vue | 31 ++++++++++++++----- .../chart/components/editor/util/chart.ts | 3 +- .../js/panel/charts/table/table-pivot.ts | 15 ++++++--- 5 files changed, 42 insertions(+), 14 deletions(-) diff --git a/core/core-frontend/src/models/chart/chart-attr.d.ts b/core/core-frontend/src/models/chart/chart-attr.d.ts index e00292cd07..147d822037 100644 --- a/core/core-frontend/src/models/chart/chart-attr.d.ts +++ b/core/core-frontend/src/models/chart/chart-attr.d.ts @@ -389,6 +389,10 @@ declare interface ChartBasicStyle { * 透视表行头宽度 */ tableRowHeaderWidth: number + /** + * 透视表行头宽度百分比 + */ + tableRowHeaderWidthPercent: number } /** * 表头属性 diff --git a/core/core-frontend/src/utils/canvasStyle.ts b/core/core-frontend/src/utils/canvasStyle.ts index b567b832b1..986cd1e0a9 100644 --- a/core/core-frontend/src/utils/canvasStyle.ts +++ b/core/core-frontend/src/utils/canvasStyle.ts @@ -121,7 +121,8 @@ export const customAttrTrans = { 'lineSymbolSize', 'leftLineWidth', 'leftLineSymbolSize', - 'tableColumnWidth' + 'tableColumnWidth', + 'tableRowHeaderWidth' ], tableHeader: [ 'tableTitleFontSize', diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue index ed45938aac..93cf315ff0 100644 --- a/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue +++ b/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue @@ -65,12 +65,27 @@ const state = reactive({ fieldId: '', width: 0 }, - fileList: [] + fileList: [], + treeRowWidth: 10 }) const emit = defineEmits(['onBasicStyleChange', 'onMiscChange']) const changeBasicStyle = (prop?: string, requestData = false, render = true) => { emit('onBasicStyleChange', { data: state.basicStyleForm, requestData, render }, prop) } + +const changeTreeRowWidth = () => { + if (state.basicStyleForm.tableRowHeaderMode === 'percent') { + state.basicStyleForm.tableRowHeaderWidthPercent = state.treeRowWidth + } + if (state.basicStyleForm.tableRowHeaderMode === 'fixed') { + state.basicStyleForm.tableRowHeaderWidth = state.treeRowWidth + } + changeBasicStyle( + state.basicStyleForm.tableRowHeaderMode === 'percent' + ? 'tableRowHeaderWidthPercent' + : 'tableRowHeaderWidth' + ) +} const onAlphaChange = v => { const _v = parseInt(v) if (_v >= 0 && _v <= 100) { @@ -146,13 +161,15 @@ const init = () => { tableExpandLevelOptions.push({ name, value: i }) } if (basicStyle.tableRowHeaderMode === 'percent') { - if (basicStyle.tableRowHeaderWidth > 50) { - state.basicStyleForm.tableRowHeaderWidth = 20 + state.treeRowWidth = basicStyle.tableRowHeaderWidthPercent + if (basicStyle.tableRowHeaderWidthPercent > 80) { + state.treeRowWidth = 80 } } if (basicStyle.tableRowHeaderMode === 'fixed') { + state.treeRowWidth = basicStyle.tableRowHeaderWidth if (basicStyle.tableRowHeaderWidth < 10) { - state.basicStyleForm.tableRowHeaderWidth = 120 + state.treeRowWidth = 120 } } } @@ -1029,11 +1046,11 @@ onMounted(async () => { > diff --git a/core/core-frontend/src/views/chart/components/editor/util/chart.ts b/core/core-frontend/src/views/chart/components/editor/util/chart.ts index 7a18937324..67af08570c 100644 --- a/core/core-frontend/src/views/chart/components/editor/util/chart.ts +++ b/core/core-frontend/src/views/chart/components/editor/util/chart.ts @@ -1733,7 +1733,8 @@ export const DEFAULT_BASIC_STYLE: ChartBasicStyle = { quotaPosition: 'col', quotaColLabel: t('dataset.value'), tableRowHeaderMode: 'adapt', - tableRowHeaderWidth: 10 + tableRowHeaderWidth: 120, + tableRowHeaderWidthPercent: 20 } export const BASE_VIEW_CONFIG = { diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-pivot.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-pivot.ts index 370257b055..9640d5f259 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-pivot.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-pivot.ts @@ -267,7 +267,12 @@ export class TablePivot extends S2ChartView { // options s2Options.style = this.configStyle(chart, s2DataConfig) if (basicStyle.tableLayoutMode === 'tree') { - const { defaultExpandLevel, tableRowHeaderMode, tableRowHeaderWidth } = basicStyle + const { + defaultExpandLevel, + tableRowHeaderMode, + tableRowHeaderWidth, + tableRowHeaderWidthPercent + } = basicStyle // 默认展开层级 if (isNumeric(defaultExpandLevel)) { if ((defaultExpandLevel as number) >= chart.xAxis.length) { @@ -292,11 +297,11 @@ export class TablePivot extends S2ChartView { s2Options.style.treeRowsWidth = treeRowsWidth } if (tableRowHeaderMode === 'percent') { - let treeRowsWidth = tableRowHeaderWidth - if (treeRowsWidth > 50) { - treeRowsWidth = 20 + let treeRowsWidthPercent = tableRowHeaderWidthPercent + if (treeRowsWidthPercent > 80) { + treeRowsWidthPercent = 20 } - const width = containerDom.offsetWidth * (treeRowsWidth / 100) + const width = containerDom.offsetWidth * (treeRowsWidthPercent / 100) s2Options.style.treeRowsWidth = width } }