fix: quick edit

This commit is contained in:
chenos 2025-06-29 16:58:14 +08:00
parent a521faee7b
commit 97186d72ce
3 changed files with 35 additions and 22 deletions

View File

@ -20,12 +20,14 @@ import {
FlowModelRenderer, FlowModelRenderer,
SingleRecordResource, SingleRecordResource,
} from '@nocobase/flow-engine'; } from '@nocobase/flow-engine';
import { InputRef, Skeleton } from 'antd'; import { Button, InputRef, Skeleton } from 'antd';
import _ from 'lodash';
import React, { createRef } from 'react'; import React, { createRef } from 'react';
import { DataBlockModel } from '../../base/BlockModel'; import { DataBlockModel } from '../../base/BlockModel';
export class QuickEditForm extends DataBlockModel { export class QuickEditForm extends DataBlockModel {
form: Form; form: Form;
fieldPath: string;
declare resource: SingleRecordResource; declare resource: SingleRecordResource;
declare collection: Collection; declare collection: Collection;
@ -56,7 +58,7 @@ export class QuickEditForm extends DataBlockModel {
async open({ target, filterByTk }: { target: any; filterByTk: string }) { async open({ target, filterByTk }: { target: any; filterByTk: string }) {
await this.applyFlow('initial', { filterByTk }); await this.applyFlow('initial', { filterByTk });
return new Promise((resolve) => { return new Promise((resolve, reject) => {
const inputRef = createRef<InputRef>(); const inputRef = createRef<InputRef>();
const popover = this.ctx.globals.popover.open({ const popover = this.ctx.globals.popover.open({
target, target,
@ -67,7 +69,12 @@ export class QuickEditForm extends DataBlockModel {
onSubmit={async (e) => { onSubmit={async (e) => {
e.preventDefault(); e.preventDefault();
await this.form.submit(); await this.form.submit();
await this.resource.save(this.form.values); await this.resource.save(
{
[this.fieldPath]: this.form.values[this.fieldPath],
},
{ refresh: false },
);
popover.destroy(); popover.destroy();
resolve(this.form.values); resolve(this.form.values);
}} }}
@ -85,17 +92,18 @@ export class QuickEditForm extends DataBlockModel {
); );
})} })}
</FormLayout> </FormLayout>
<FormButtonGroup> <FormButtonGroup align="right">
<Submit <Button
htmlType="submit" onClick={() => {
onClick={async () => {
await this.resource.save(this.form.values);
popover.destroy(); popover.destroy();
resolve(this.form.values); // 在 close 之后 resolve reject(null); // 在 close 之后 resolve
}} }}
> >
{this.ctx.globals.flowEngine.translate('Submit')} {this.translate('Cancel')}
</Submit> </Button>
<Button type="primary" htmlType="submit">
{this.translate('Submit')}
</Button>
</FormButtonGroup> </FormButtonGroup>
</FormProvider> </FormProvider>
</FlowEngineProvider> </FlowEngineProvider>
@ -126,6 +134,7 @@ QuickEditForm.registerFlow({
if (!dataSourceKey || !collectionName || !fieldPath) { if (!dataSourceKey || !collectionName || !fieldPath) {
throw new Error('dataSourceKey, collectionName and fieldPath are required parameters'); throw new Error('dataSourceKey, collectionName and fieldPath are required parameters');
} }
ctx.model.fieldPath = fieldPath;
ctx.model.collection = ctx.globals.dataSourceManager.getCollection(dataSourceKey, collectionName); ctx.model.collection = ctx.globals.dataSourceManager.getCollection(dataSourceKey, collectionName);
ctx.model.form = createForm(); ctx.model.form = createForm();
const resource = new SingleRecordResource(); const resource = new SingleRecordResource();

View File

@ -156,15 +156,19 @@ export class TableModel extends DataBlockModel<TableModelStructure> {
<EditOutlined <EditOutlined
className="edit-icon" className="edit-icon"
onClick={async (e) => { onClick={async (e) => {
await QuickEditForm.open({ try {
target: ref.current, await QuickEditForm.open({
flowEngine: this.flowEngine, target: ref.current,
dataSourceKey: this.collection.dataSourceKey, flowEngine: this.flowEngine,
collectionName: this.collection.name, dataSourceKey: this.collection.dataSourceKey,
fieldPath: dataIndex, collectionName: this.collection.name,
filterByTk: record.id, fieldPath: dataIndex,
}); filterByTk: record.id,
await this.resource.refresh(); });
await this.resource.refresh();
} catch (error) {
// console.error('Error stopping event propagation:', error);
}
}} }}
/> />
<div <div

View File

@ -15,7 +15,7 @@ export class SingleRecordResource<TData = any> extends BaseRecordResource<TData>
return this; return this;
} }
async save(data: TData): Promise<void> { async save(data: TData, config: { refresh?: boolean } = {}): Promise<void> {
const options: any = { const options: any = {
headers: this.request.headers, headers: this.request.headers,
params: {}, params: {},
@ -29,7 +29,7 @@ export class SingleRecordResource<TData = any> extends BaseRecordResource<TData>
...options, ...options,
data, data,
}); });
if (this.request.params.filterByTk) { if (config.refresh !== false && this.request.params.filterByTk) {
await this.refresh(); await this.refresh();
} }
} }