fix: 编辑回显问题 - setFieldsValue 改为 useEffect 在 Modal 打开后执行
- destroyOnClose 导致 Form 在 Modal 关闭时销毁,setFieldsValue 提前调用无效 - 改为 useEffect 监听 modalOpen,Modal 打开后延迟设置表单值
This commit is contained in:
parent
3a184742dc
commit
e2133165b0
|
|
@ -1,7 +1,7 @@
|
||||||
import { useEffect, useState, useCallback } from "react";
|
import { useEffect, useState, useCallback } from "react";
|
||||||
import {
|
import {
|
||||||
Table, Button, Modal, Form, Input, Select, Switch,
|
Table, Button, Modal, Form, Input, Select, Switch,
|
||||||
Space, message, Popconfirm, Tag, Tooltip,
|
Space, message, Popconfirm, Tag,
|
||||||
} from "antd";
|
} from "antd";
|
||||||
import { PlusOutlined, EditOutlined, DeleteOutlined } from "@ant-design/icons";
|
import { PlusOutlined, EditOutlined, DeleteOutlined } from "@ant-design/icons";
|
||||||
import type { AIModel } from "../types";
|
import type { AIModel } from "../types";
|
||||||
|
|
@ -38,21 +38,28 @@ export default function ModelList() {
|
||||||
|
|
||||||
const handleCreate = () => {
|
const handleCreate = () => {
|
||||||
setEditingModel(null);
|
setEditingModel(null);
|
||||||
form.resetFields();
|
|
||||||
form.setFieldsValue({ provider: "openai", is_enabled: true, extra_params: "{}" });
|
|
||||||
setModalOpen(true);
|
setModalOpen(true);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleEdit = (model: AIModel) => {
|
const handleEdit = (model: AIModel) => {
|
||||||
setEditingModel(model);
|
setEditingModel(model);
|
||||||
form.setFieldsValue({
|
|
||||||
...model,
|
|
||||||
extra_params: JSON.stringify(model.extra_params, null, 2),
|
|
||||||
api_key: "",
|
|
||||||
});
|
|
||||||
setModalOpen(true);
|
setModalOpen(true);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!modalOpen) return;
|
||||||
|
if (editingModel) {
|
||||||
|
form.setFieldsValue({
|
||||||
|
...editingModel,
|
||||||
|
extra_params: JSON.stringify(editingModel.extra_params, null, 2),
|
||||||
|
api_key: "",
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
form.resetFields();
|
||||||
|
form.setFieldsValue({ provider: "openai", is_enabled: true, extra_params: "{}" });
|
||||||
|
}
|
||||||
|
}, [modalOpen, editingModel]);
|
||||||
|
|
||||||
const handleSubmit = async () => {
|
const handleSubmit = async () => {
|
||||||
try {
|
try {
|
||||||
const values = await form.validateFields();
|
const values = await form.validateFields();
|
||||||
|
|
|
||||||
|
|
@ -114,25 +114,32 @@ export default function TemplateEditor() {
|
||||||
|
|
||||||
const handleCreatePoint = () => {
|
const handleCreatePoint = () => {
|
||||||
setEditingPoint(null);
|
setEditingPoint(null);
|
||||||
|
setPointModalOpen(true);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleEditPoint = (point: GenerationPoint) => {
|
||||||
|
setEditingPoint(point);
|
||||||
|
setPointModalOpen(true);
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!pointModalOpen) return;
|
||||||
|
if (editingPoint) {
|
||||||
|
pointForm.setFieldsValue({
|
||||||
|
prompt: editingPoint.prompt,
|
||||||
|
model_id: editingPoint.model_id,
|
||||||
|
need_ref_file: editingPoint.need_ref_file,
|
||||||
|
remark: editingPoint.remark,
|
||||||
|
});
|
||||||
|
} else {
|
||||||
pointForm.resetFields();
|
pointForm.resetFields();
|
||||||
if (selectionRef.current) {
|
if (selectionRef.current) {
|
||||||
pointForm.setFieldsValue({
|
pointForm.setFieldsValue({
|
||||||
prompt: `根据上下文生成关于「${selectionRef.current.text.slice(0, 20)}...」的内容`,
|
prompt: `根据上下文生成关于「${selectionRef.current.text.slice(0, 20)}...」的内容`,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
setPointModalOpen(true);
|
}
|
||||||
};
|
}, [pointModalOpen]);
|
||||||
|
|
||||||
const handleEditPoint = (point: GenerationPoint) => {
|
|
||||||
setEditingPoint(point);
|
|
||||||
pointForm.setFieldsValue({
|
|
||||||
prompt: point.prompt,
|
|
||||||
model_id: point.model_id,
|
|
||||||
need_ref_file: point.need_ref_file,
|
|
||||||
remark: point.remark,
|
|
||||||
});
|
|
||||||
setPointModalOpen(true);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handlePointSubmit = async () => {
|
const handlePointSubmit = async () => {
|
||||||
if (!id) return;
|
if (!id) return;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue