admin-ui/src/views/knowledge/dataset/component/editDataset.vue

<template>
<el-dialog :title="isEdit ? '编辑数据集' : '新增数据集'" v-model="isShowDialog" width="600px" :close-on-click-modal="false" @close="onCancel">
	<el-form ref="formRef" :model="ruleForm" :rules="rules" label-width="100px">
		<el-row :gutter="20">
			<el-col :span="24">
				<el-form-item label="数据集名称" prop="name">
					<el-input v-model="ruleForm.name" placeholder="请输入数据集名称" clearable />
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="12">
				<el-form-item label="数据集类型" prop="datasetType">
					<el-select v-model="ruleForm.datasetType" placeholder="请选择类型" clearable style="width: 100%">
						<el-option label="文本" :value="1" />
						<el-option label="视频" :value="2" />
					</el-select>
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="向量模型" prop="embeddingModel">
					<el-select v-model="ruleForm.embeddingModel" placeholder="请选择向量模型" clearable style="width: 100%">
						<el-option label="text-embedding-ada-002" value="text-embedding-ada-002" />
						<el-option label="text-embedding-3-small" value="text-embedding-3-small" />
						<el-option label="text-embedding-3-large" value="text-embedding-3-large" />
						<el-option label="bge-large-zh" value="bge-large-zh" />
						<el-option label="m3e-base" value="m3e-base" />
					</el-select>
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="24">
				<el-form-item label="描述" prop="description">
					<el-input v-model="ruleForm.description" type="textarea" :rows="4" placeholder="请输入数据集描述" />
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20" v-if="isEdit">
			<el-col :span="12">
				<el-form-item label="文档数量">
					<el-input :value="ruleForm.documentCount" disabled />
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="字符数量">
					<el-input :value="ruleForm.charCount" disabled />
				</el-form-item>
			</el-col>
		</el-row>
	</el-form>
	<template #footer>
		<span class="dialog-footer">
			<el-button @click="onCancel">取 消</el-button>
			<el-button type="primary" @click="onSubmit" :loading="submitLoading">{{ isEdit ? '保 存' : '创 建' }}</el-button>
		</span>
	</template>
</el-dialog>
</template>

<script lang="ts">
export default {
	name: 'editknowledge',
};
</script>

<script setup lang="ts">
import { ref, reactive } from 'vue';
import { ElMessage } from 'element-plus';
import type { FormInstance, FormRules } from 'element-plus';
import { createknowledge, updateknowledge, getknowledge } from '/@/api/knowledge/dataset';

// 定义事件
const emit = defineEmits(['getknowledgeList']);

// 表单ref
const formRef = ref<FormInstance>();

// 弹窗状态
const isShowDialog = ref(false);
const isEdit = ref(false);
const submitLoading = ref(false);

// 表单数据
const ruleForm = reactive({
	id: '',
	name: '',
	datasetType: 1 as number,
	description: '',
	embeddingModel: 'text-embedding-ada-002',
	documentCount: 0,
	charCount: 0,
});

// 表单验证规则
const rules = reactive<FormRules>({
	name: [{ required: true, message: '请输入数据集名称', trigger: 'blur' }],
	datasetType: [{ required: true, message: '请选择数据集类型', trigger: 'change' }],
	embeddingModel: [{ required: true, message: '请选择向量模型', trigger: 'change' }],
});

// 重置表单
const resetForm = () => {
	ruleForm.id = '';
	ruleForm.name = '';
	ruleForm.datasetType = 1;
	ruleForm.description = '';
	ruleForm.embeddingModel = 'text-embedding-ada-002';
	ruleForm.documentCount = 0;
	ruleForm.charCount = 0;
};

// 打开弹窗
const openDialog = async (row?: any) => {
	resetForm();
	isEdit.value = !!row;

	if (row) {
		try {
			const res: any = await getknowledge(row.id);
			const data = res.data || row;
			ruleForm.id = data.id || '';
			ruleForm.name = data.name || '';
			ruleForm.datasetType = data.datasetType || 1;
			ruleForm.description = data.description || '';
			ruleForm.embeddingModel = data.embeddingModel || 'text-embedding-ada-002';
			ruleForm.documentCount = data.documentCount || 0;
			ruleForm.charCount = data.charCount || 0;
		} catch (_error) {
			ElMessage.error('获取数据集详情失败');
			// 使用传入的row数据
			ruleForm.id = row.id || '';
			ruleForm.name = row.name || '';
			ruleForm.datasetType = row.datasetType || 1;
			ruleForm.description = row.description || '';
			ruleForm.embeddingModel = row.embeddingModel || 'text-embedding-ada-002';
			ruleForm.documentCount = row.documentCount || 0;
			ruleForm.charCount = row.charCount || 0;
		}
	}

	isShowDialog.value = true;
};

// 取消
const onCancel = () => {
	isShowDialog.value = false;
	formRef.value?.resetFields();
};

// 提交
const onSubmit = async () => {
	const form = formRef.value;
	if (!form) return;

	form.validate(async (valid: boolean) => {
		if (valid) {
			submitLoading.value = true;
			try {
				const data = {
					id: ruleForm.id || undefined,
					name: ruleForm.name,
					datasetType: ruleForm.datasetType,
					description: ruleForm.description,
					embeddingModel: ruleForm.embeddingModel,
					status: 'enable',
				};

				if (isEdit.value) {
					await updateknowledge(data);
					ElMessage.success('保存成功');
				} else {
					await createknowledge(data);
					ElMessage.success('创建成功');
				}

				isShowDialog.value = false;
				emit('getknowledgeList');
			} catch (_error) {
				ElMessage.error(isEdit.value ? '保存失败，请重试' : '创建失败，请重试');
			} finally {
				submitLoading.value = false;
			}
		}
	});
};

// 暴露方法
defineExpose({
	openDialog,
});
</script>

<style scoped lang="scss"></style>