refactor(KnowledgeItemEditor): 重构知识项编辑器组件结构

- 提取创建模式判断逻辑为独立变量 isCreateMode
- 使用条件渲染替代原有的 data?.id 判断
- 将表单字段按照创建和编辑模式进行分组重构
- 优化文件上传和替换功能的显示逻辑
- 改进代码可读性和维护性
This commit is contained in:
2026-01-29 14:37:05 +08:00
parent f77fd99c31
commit 0dba604cd3

View File

@@ -51,7 +51,8 @@ export default function KnowledgeItemEditor({
const isFileItem =
data?.contentType === KnowledgeContentType.FILE ||
data?.sourceType === KnowledgeSourceType.FILE_UPLOAD;
const contentTypeLabel = !data?.id
const isCreateMode = !data?.id;
const contentTypeLabel = isCreateMode
? "文件"
: data?.contentType === KnowledgeContentType.MARKDOWN
? "Markdown"
@@ -294,22 +295,7 @@ export default function KnowledgeItemEditor({
okButtonProps={{ disabled: readOnly }}
>
<Form form={form} layout="vertical" disabled={readOnly}>
<div className="grid grid-cols-2 gap-4">
<Form.Item
label="标题"
name="title"
rules={[{ required: !isMultiFile, message: "请输入标题" }]}
>
<Input
placeholder={isMultiFile ? "多文件将按文件名自动生成" : "请输入标题"}
disabled={readOnly || (!data?.id && isMultiFile)}
/>
</Form.Item>
<Form.Item label="状态" name="status">
<Select options={knowledgeStatusOptions} />
</Form.Item>
</div>
{!data?.id && (
{isCreateMode && (
<Form.Item label="上传文件" required>
<Upload
beforeUpload={handleFileBeforeUpload}
@@ -326,6 +312,23 @@ export default function KnowledgeItemEditor({
</div>
</Form.Item>
)}
{!isCreateMode && (
<>
<div className="grid grid-cols-2 gap-4">
<Form.Item
label="标题"
name="title"
rules={[{ required: !isMultiFile, message: "请输入标题" }]}
>
<Input
placeholder={isMultiFile ? "多文件将按文件名自动生成" : "请输入标题"}
disabled={readOnly || (!data?.id && isMultiFile)}
/>
</Form.Item>
<Form.Item label="状态" name="status">
<Select options={knowledgeStatusOptions} />
</Form.Item>
</div>
{data?.id && isFileItem && (
<Form.Item label="文件">
<div className="flex items-center gap-2">
@@ -397,6 +400,8 @@ export default function KnowledgeItemEditor({
<div>{data.sourceFileId || "-"}</div>
</div>
)}
</>
)}
</Form>
</Modal>
);