Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: update editingEditor's validate method to support asynchronous #2061

Merged
merged 2 commits into from
Jul 9, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions docs/assets/guide/en/edit/edit_cell.md
Original file line number Diff line number Diff line change
Expand Up @@ -273,6 +273,8 @@ If verification is required, please customize the editor to implement the verifi

If this interface is not defined, the editing value will not be verified by default, and the interface will return false. If the verification fails, it will remain in the editing state.

If asynchronous verification is needed, you can return a Promise object. This Promise object should resolve to true upon successful verification and false upon verification failure.

## 9. Related APIs

```ts
Expand Down
4 changes: 3 additions & 1 deletion docs/assets/guide/zh/edit/edit_cell.md
Original file line number Diff line number Diff line change
Expand Up @@ -275,7 +275,9 @@ interface ListTableConstructorOptions {

需要校验的情况 请自定义编辑器实现校验函数`validateValue`

如未定义该接口则编辑值值默认不做校验,接口返回 false,校验失败则保留在编辑状态。
如未定义该接口则编辑值值默认不做校验,接口返回 false,校验失败则保留在编辑状态;

若需要实现异步校验,可以返回一个Promise对象,该Promise对象在校验成功时以真值解析,校验失败时以假值解析。

## 9. 相关 api

Expand Down
2 changes: 1 addition & 1 deletion packages/vtable-editors/src/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export interface IEditor<V = any> {
* Before set new value to table, use it to validate value.
* If the interface returns true, the value takes effect; otherwise, it does not take effect.
*/
validateValue?: () => boolean;
validateValue?: () => boolean | Promise<boolean>;
/**
* Called when editor mode is exited by any means.
* Expected to return the current value of the cell.
Expand Down
60 changes: 43 additions & 17 deletions packages/vtable/src/edit/edit-manager.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import type { BaseTableAPI } from '../ts-types/base-table';
import type { ListTableAPI, ListTableConstructorOptions } from '../ts-types';
import { getCellEventArgsSet } from '../event/util';
import type { SimpleHeaderLayoutMap } from '../layout';
import { isPromise } from '../tools/helper';

export class EditManeger {
table: BaseTableAPI;
Expand Down Expand Up @@ -109,7 +110,7 @@ export class EditManeger {
}

/** 如果是事件触发调用该接口 请传入原始事件对象 将判断事件对象是否在编辑器本身上面 来处理是否结束编辑 返回值如果为false说明没有退出编辑状态*/
completeEdit(e?: Event): boolean {
completeEdit(e?: Event): boolean | Promise<boolean> {
if (!this.editingEditor) {
return true;
}
Expand All @@ -132,25 +133,50 @@ export class EditManeger {
if (!this.editingEditor.getValue) {
console.warn('VTable Warn: `getValue` is not provided, did you forget to implement it?');
}
if (!this.editingEditor.validateValue || this.editingEditor.validateValue?.()) {
const changedValue = this.editingEditor.getValue?.();
const range = this.table.getCellRange(this.editCell.col, this.editCell.row);
const changedValues: any[] = [];
for (let row = range.start.row; row <= range.end.row; row++) {
const rowChangedValues = [];
for (let col = range.start.col; col <= range.end.col; col++) {
rowChangedValues.push(changedValue);
}
changedValues.push(rowChangedValues);
if (this.editingEditor.validateValue) {
const maybePromiseOrValue = this.editingEditor.validateValue?.();
if (isPromise(maybePromiseOrValue)) {
return new Promise((resolve, reject)=>{
maybePromiseOrValue
.then(result => {
if (result) {
this.doExit();
resolve(true);
}else{
resolve(false);
}
})
.catch((err: Error) => {
console.error('VTable Error:', err);
reject(err);
});
})
} else if (maybePromiseOrValue) {
this.doExit();
return true;
}
(this.table as ListTableAPI).changeCellValues(range.start.col, range.start.row, changedValues);
this.editingEditor.exit && console.warn('VTable Warn: `exit` is deprecated, please use `onEnd` instead.');
this.editingEditor.exit?.();
this.editingEditor.onEnd?.();
this.editingEditor = null;
} else {
this.doExit();
return true;
}
return false;
}

private doExit() {
const changedValue = this.editingEditor.getValue?.();
const range = this.table.getCellRange(this.editCell.col, this.editCell.row);
const changedValues: any[] = [];
for (let row = range.start.row; row <= range.end.row; row++) {
const rowChangedValues = [];
for (let col = range.start.col; col <= range.end.col; col++) {
rowChangedValues.push(changedValue);
}
changedValues.push(rowChangedValues);
}
(this.table as ListTableAPI).changeCellValues(range.start.col, range.start.row, changedValues);
this.editingEditor.exit && console.warn('VTable Warn: `exit` is deprecated, please use `onEnd` instead.');
this.editingEditor.exit?.();
this.editingEditor.onEnd?.();
this.editingEditor = null;
}

cancelEdit() {
Expand Down
Loading
Loading