PingChuan
126 lines
4.8 KiB
TypeScript
126 lines
4.8 KiB
TypeScript
import { Form, Input, Button, Card, Spin } from 'antd';
|
||
import { SaveOutlined } from '@ant-design/icons';
|
||
import { useDatasetSettings } from '~/hooks/dify-dataset-manager/dataset-settings';
|
||
import type { DatasetSettingsProps } from '~/types/dify-dataset-manager/dataset-settings';
|
||
|
||
const { TextArea } = Input;
|
||
|
||
/**
|
||
* 知识库设置组件
|
||
* 用于修改知识库名称和描述
|
||
*/
|
||
export default function DatasetSettings({
|
||
dataset,
|
||
onDatasetUpdated,
|
||
}: DatasetSettingsProps) {
|
||
const [form] = Form.useForm();
|
||
|
||
const {
|
||
saving,
|
||
hasChanges,
|
||
handleValuesChange,
|
||
handleSave,
|
||
handleReset,
|
||
} = useDatasetSettings(dataset, form, onDatasetUpdated);
|
||
|
||
if (!dataset) {
|
||
return (
|
||
<div className="settings-loading">
|
||
<Spin size="large" />
|
||
</div>
|
||
);
|
||
}
|
||
|
||
return (
|
||
<div className="dataset-settings-page">
|
||
{/* 页面标题 */}
|
||
<div className="page-header">
|
||
<h1>设置</h1>
|
||
<p className="page-description">
|
||
管理知识库的基本信息
|
||
</p>
|
||
</div>
|
||
|
||
{/* 设置表单 */}
|
||
<Card className="settings-card">
|
||
<Form
|
||
form={form}
|
||
layout="vertical"
|
||
onValuesChange={handleValuesChange}
|
||
>
|
||
<Form.Item
|
||
name="name"
|
||
label="知识库名称"
|
||
rules={[
|
||
{ required: true, message: '请输入知识库名称' },
|
||
{ max: 100, message: '名称不能超过100个字符' },
|
||
]}
|
||
>
|
||
<Input placeholder="请输入知识库名称" maxLength={100} />
|
||
</Form.Item>
|
||
|
||
<Form.Item
|
||
name="description"
|
||
label="知识库描述"
|
||
extra="描述知识库的用途和内容（仅展示，暂不支持修改）"
|
||
>
|
||
<TextArea
|
||
placeholder="请输入知识库描述"
|
||
rows={4}
|
||
maxLength={500}
|
||
showCount
|
||
disabled
|
||
/>
|
||
</Form.Item>
|
||
|
||
{/* 只读信息 */}
|
||
<div className="readonly-info">
|
||
<div className="info-item">
|
||
<span className="info-label">索引方式：</span>
|
||
<span className="info-value">
|
||
{dataset.indexing_technique === 'high_quality' ? '高质量' : '经济'}
|
||
</span>
|
||
</div>
|
||
{/* <div className="info-item">
|
||
<span className="info-label">Embedding 模型：</span>
|
||
<span className="info-value">
|
||
{dataset.embedding_model || '默认模型'}
|
||
</span>
|
||
</div> */}
|
||
<div className="info-item">
|
||
<span className="info-label">文档数量：</span>
|
||
<span className="info-value">{dataset.document_count}</span>
|
||
</div>
|
||
<div className="info-item">
|
||
<span className="info-label">总字符数：</span>
|
||
<span className="info-value">{dataset.word_count?.toLocaleString()}</span>
|
||
</div>
|
||
<div className="info-item">
|
||
<span className="info-label">创建时间：</span>
|
||
<span className="info-value">
|
||
{new Date(dataset.created_at * 1000).toLocaleString('zh-CN')}
|
||
</span>
|
||
</div>
|
||
</div>
|
||
|
||
{/* 操作按钮 */}
|
||
<div className="form-actions">
|
||
<Button onClick={handleReset} disabled={!hasChanges}>
|
||
重置
|
||
</Button>
|
||
<Button
|
||
type="primary"
|
||
icon={<SaveOutlined />}
|
||
onClick={handleSave}
|
||
loading={saving}
|
||
disabled={!hasChanges}
|
||
>
|
||
保存
|
||
</Button>
|
||
</div>
|
||
</Form>
|
||
</Card>
|
||
</div>
|
||
);
|
||
}
|