<template>
|
<div class="flex flex-col h100">
|
<div class="mb-[10px] flex flex-shrink-0 items-center">
|
<el-button style="margin-left: 8px; width: 40px" text @click="handleExitFlow">
|
<el-icon style="font-size: 24px !important">
|
<ArrowLeft />
|
</el-icon>
|
</el-button>
|
<span class="text-[24px] text-[#26244c] font-[700]">{{ state.detailTitle }}</span>
|
</div>
|
<div class="set-form-height">
|
<el-form
|
:model="state.editKnowledgeForm"
|
label-width="120px"
|
label-position="left"
|
ref="editKnowledgeFormRef"
|
:rules="editKnowledgeFormRules"
|
>
|
<el-divider content-position="left"><span class="text-[18px] font-[500]">知识库基础信息</span></el-divider>
|
<el-form-item label="知识库名称:" prop="title">
|
<el-input
|
v-model="state.editKnowledgeForm.title"
|
style="width: 532px"
|
maxlength="20"
|
placeholder="请输入知识库名称"
|
show-word-limit
|
type="text"
|
/>
|
</el-form-item>
|
<el-form-item label="知识库描述:" prop="prompt">
|
<el-input
|
v-model="state.editKnowledgeForm.prompt"
|
maxlength="1000"
|
style="width: 532px"
|
placeholder="请输入知识库描述。对知识库包含的内容和数据的用途进行描述。"
|
show-word-limit
|
:rows="5"
|
type="textarea"
|
/>
|
</el-form-item>
|
<el-form-item label="数据类型:">
|
<label> 非结构化数据</label>
|
</el-form-item>
|
</el-form>
|
</div>
|
<div class="set-form-footer">
|
<el-button @click="saveKnowledgeBase" type="primary">保存</el-button>
|
<el-button @click="handleExitFlow">取消</el-button>
|
</div>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { ElMessage, type FormRules } from 'element-plus';
|
import { onMounted, reactive, ref } from 'vue';
|
import { useRoute, useRouter } from 'vue-router';
|
import { update_docvector_name } from '/@/api/knowledge/docvector';
|
// 定义变量内容
|
const state = reactive({
|
soliderValue: 0,
|
detailTitle: '编辑知识库',
|
editKnowledgeForm: {
|
title: '',
|
prompt: '',
|
id: '',
|
} as any,
|
knowledgeFile: {},
|
});
|
const editKnowledgeFormRules = reactive<FormRules>({
|
title: [
|
{
|
required: true,
|
message: '必填项',
|
trigger: 'blur',
|
},
|
],
|
prompt: [
|
{
|
required: true,
|
message: '必填项',
|
trigger: 'blur',
|
},
|
],
|
});
|
const editKnowledgeFormRef = ref();
|
const router = useRouter();
|
const route = useRoute();
|
//返回
|
const handleExitFlow = () => {
|
//是否显示返回
|
router.back();
|
};
|
//创建一个空知识库
|
const saveKnowledgeBase = async () => {
|
const valid = await editKnowledgeFormRef.value.validate().catch(() => {});
|
if (!valid) return;
|
const res = await update_docvector_name({
|
title: state.editKnowledgeForm.title,
|
prompt: state.editKnowledgeForm.prompt,
|
knowlg_id: state.editKnowledgeForm.id,
|
});
|
if (res.json_ok) {
|
ElMessage.success('更新成功');
|
router.push({ name: 'Knowledge' });
|
}
|
};
|
onMounted(() => {
|
const { knowledge_title, knowledge_id, knowledge_prompt } = route.query;
|
state.editKnowledgeForm.title = knowledge_title;
|
state.editKnowledgeForm.prompt = knowledge_prompt;
|
state.editKnowledgeForm.id = knowledge_id;
|
});
|
</script>
|
<style scoped lang="scss">
|
.set-form-height {
|
background: #fff;
|
border-radius: 12px 12px 0 0;
|
flex: 1;
|
margin: 0 24px;
|
overflow-y: auto;
|
padding: 20px 16px;
|
height: 100%;
|
}
|
.set-desc {
|
-webkit-line-clamp: 2;
|
display: -webkit-box;
|
-webkit-box-orient: vertical;
|
overflow: hidden;
|
word-break: break-word;
|
line-height: 1.5714285714285714;
|
font-family: PingFangSC;
|
box-sizing: border-box;
|
}
|
.set-form-footer {
|
align-items: center;
|
background: #fff;
|
bottom: 0;
|
box-shadow: 4px 0 5px 1px rgba(16, 9, 65, 0.06);
|
display: flex;
|
flex-shrink: 0;
|
gap: 8px;
|
height: 64px;
|
padding-left: 24px;
|
// position: fixed;
|
width: 100%;
|
left: 220px;
|
}
|
|
.activeColor {
|
border-color: #0062be;
|
background-color: #f6f5ff;
|
}
|
.set_model_desc {
|
background: #f7f8fe;
|
border-radius: 8px;
|
margin-top: 12px;
|
padding: 16px 24px;
|
}
|
.slider-demo-block {
|
max-width: 600px;
|
display: flex;
|
align-items: center;
|
}
|
</style>
|
<style>
|
.set_tooltip_demo {
|
max-width: 326px;
|
max-height: 150px;
|
min-width: 32px;
|
min-height: 32px;
|
padding: 6px 8px;
|
color: #26244c;
|
text-align: start;
|
text-decoration: none;
|
word-wrap: break-word;
|
background-color: #fff;
|
border-radius: 6px;
|
box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
|
box-sizing: border-box;
|
}
|
</style>
|
