From f79ab34dd38e0c3b1e4adc203465f5f6105d85b8 Mon Sep 17 00:00:00 2001 From: lijinke666 Date: Fri, 23 Feb 2024 14:23:49 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E7=BC=96=E8=BE=91=E5=90=8E=E4=B8=8D?= =?UTF-8?q?=E5=BA=94=E8=AF=A5=E5=86=8D=E6=AC=A1=E6=A0=BC=E5=BC=8F=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/s2-core/src/cell/data-cell.ts | 8 +++++-- .../s2-core/src/common/interface/basic.ts | 1 + .../s2-core/src/data-set/base-data-set.ts | 3 +++ .../sheets/editable-sheet/edit-cell/index.tsx | 21 +++++++++---------- .../docs/api/basic-class/base-data-set.zh.md | 3 ++- 5 files changed, 22 insertions(+), 14 deletions(-) diff --git a/packages/s2-core/src/cell/data-cell.ts b/packages/s2-core/src/cell/data-cell.ts index 7c77de9b25..8b79d136fd 100644 --- a/packages/s2-core/src/cell/data-cell.ts +++ b/packages/s2-core/src/cell/data-cell.ts @@ -293,12 +293,16 @@ export class DataCell extends BaseCell { formattedValue: EMPTY_PLACEHOLDER, }; } - const { rowId, valueField, fieldValue, data } = this.meta; + + const { rowId, valueField, fieldValue, data, id } = this.meta; + const displayFormattedValue = + this.spreadsheet.dataSet.displayFormattedValueMap.get(id); const rowMeta = this.spreadsheet.dataSet.getFieldMeta(rowId); const fieldId = rowMeta ? rowId : valueField; const formatter = this.spreadsheet.dataSet.getFieldFormatter(fieldId); // TODO: 这里只用 formatter(fieldValue, this.meta) 即可, 为了保持兼容, 暂时在第三个参入传入 meta 信息 - const formattedValue = formatter(fieldValue, data, this.meta); + const formattedValue = + displayFormattedValue ?? formatter(fieldValue, data, this.meta); return { value: fieldValue, diff --git a/packages/s2-core/src/common/interface/basic.ts b/packages/s2-core/src/common/interface/basic.ts index 3314d1e74b..6b83aa739b 100644 --- a/packages/s2-core/src/common/interface/basic.ts +++ b/packages/s2-core/src/common/interface/basic.ts @@ -452,6 +452,7 @@ export interface ViewMeta { label?: string; value?: string | number; query?: Query; + formattedValue?: string; [key: string]: unknown; } diff --git a/packages/s2-core/src/data-set/base-data-set.ts b/packages/s2-core/src/data-set/base-data-set.ts index 2b1dcfc2e2..335cc770a8 100644 --- a/packages/s2-core/src/data-set/base-data-set.ts +++ b/packages/s2-core/src/data-set/base-data-set.ts @@ -53,6 +53,9 @@ export abstract class BaseDataSet { // 透视表入口对象实例 public spreadsheet: SpreadSheet; + // 单元格所对应格式化后的值（用于编辑表） + public displayFormattedValueMap = new Map(); + public constructor(spreadsheet: SpreadSheet) { this.spreadsheet = spreadsheet; } diff --git a/packages/s2-react/src/components/sheets/editable-sheet/edit-cell/index.tsx b/packages/s2-react/src/components/sheets/editable-sheet/edit-cell/index.tsx index 67e4f31188..ba47b0338f 100644 --- a/packages/s2-react/src/components/sheets/editable-sheet/edit-cell/index.tsx +++ b/packages/s2-react/src/components/sheets/editable-sheet/edit-cell/index.tsx @@ -2,6 +2,7 @@ import type { Event as CanvasEvent } from '@antv/g-canvas'; import { S2Event, SpreadSheet, + customMerge, type DataType, type S2CellType, type TableDataCell, @@ -82,29 +83,27 @@ function EditCellComponent( return cellMeta; }, [cell, spreadsheet]); - const [inputVal, setInputVal] = React.useState(() => { - return cell.getFieldValue(); - }); + const [inputVal, setInputVal] = React.useState(() => cell.getFieldValue()); const inputRef = React.useRef(null); const containerRef = React.useRef(null); const onSave = () => { - const { rowIndex, valueField, fieldValue } = cell.getMeta(); + const { rowIndex, valueField, id } = cell.getMeta(); + const displayData = spreadsheet.dataSet.getDisplayDataSet(); + displayData[rowIndex][valueField] = inputVal; + // 编辑后的值作为格式化后的结果, formatter 不再触发, 避免二次格式化 + spreadsheet.dataSet.displayFormattedValueMap.set(id, inputVal); + spreadsheet.render(); - cell.setMeta({ + const editedMeta = customMerge(cell.getMeta(), { fieldValue: inputVal, - originalFieldValue: fieldValue, data: { [valueField]: inputVal, }, }); - const displayData = spreadsheet.dataSet.getDisplayDataSet(); - displayData[rowIndex][valueField] = inputVal; - spreadsheet.render(true); - - onDataCellEditEnd?.(cell.getMeta(), cell); + onDataCellEditEnd?.(editedMeta, cell); onChange?.(displayData); resolver(true); }; diff --git a/s2-site/docs/api/basic-class/base-data-set.zh.md b/s2-site/docs/api/basic-class/base-data-set.zh.md index 1d3d304ca1..90511ff21b 100644 --- a/s2-site/docs/api/basic-class/base-data-set.zh.md +++ b/s2-site/docs/api/basic-class/base-data-set.zh.md @@ -27,9 +27,10 @@ s2.dataSet.getFieldName('type') | getDimensionValues | 获取维值 | (filed: string, query?: [DataType](#datatype) ) => string[] | | | getCellData | 获取单个的单元格数据 | (params: [CellDataParams](#celldataparams)) => [DataType[]](#datatype) | | | getMultiData | 获取批量的单元格数据 | (query: [DataType](#datatype),params?: [MultiDataParams](#multidataparams)) => [DataType[]](#datatype) | | -| getMultiData (已废弃) | 获取批量的单元格数据 | (query: [DataType](#datatype), isTotals?: boolean, isRow?: boolean, drillDownFields?: string[], includeTotalData:boolean) => [DataType[]](#datatype) | | +| getMultiData （已废弃） | 获取批量的单元格数据 | (query: [DataType](#datatype), isTotals?: boolean, isRow?: boolean, drillDownFields?: string[], includeTotalData:boolean) => [DataType[]](#datatype) | | | moreThanOneValue | 是否超过 1 个数值 | () => [ViewMeta](#viewmeta) | | | isEmpty | 是否为空数据集 | () => `boolean` | `@antv/s2-v1.51.1` | +| displayFormattedValueMap | 单元格所对应格式化后的值（用于编辑表） | `Map` | `@antv/s2-v1.54.5` | ### DataType