派生自 web/flow_web
src/views/dmx/knowledgeLib/config.vue
@@ -7,18 +7,15 @@ </div> <div class="main-container-lf"> <div class="main-container-lf-down"> <a-form ref="formRef" :size="form.size" :model="form" :style="{width:'100%'}" layout="vertical" <a-form ref="formRef" :rules="rules" :model="form" :style="{width:'100%'}" layout="vertical" @submit="handleSubmit"> <a-form-item field="name" label="知识库名称" :rules="[{required:true,message:'name is required'},{minLength:5,message:'must be greater than 5 characters'}]" :validate-trigger="['change','input']" > <a-form-item field="name" label="知识库名称"> <a-input v-model="form.name" placeholder="请输入" /> </a-form-item> <a-form-item field="section" label="知识库图片"> <a-space direction="vertical" :style="{ width: '100%' }"> <a-upload action="/" :auto-upload="false" :fileList="file ? [file] : []" :show-file-list="false" @change="onChange" @@ -27,8 +24,8 @@ <template #upload-button> <div :class="`arco-upload-list-item${ file && file.status === 'error' ? ' arco-upload-list-item-error' : '' }`" file && file.status === 'error' ? ' arco-upload-list-item-error' : '' }`" > <div class="arco-upload-list-picture custom-upload-avatar" @@ -44,11 +41,11 @@ type="circle" size="mini" :style="{ position: 'absolute', left: '50%', top: '50%', transform: 'translateX(-50%) translateY(-50%)', }" position: 'absolute', left: '50%', top: '50%', transform: 'translateX(-50%) translateY(-50%)', }" /> </div> <div class="arco-upload-picture-card" v-else> @@ -65,74 +62,69 @@ <a-form-item field="section" label="描述"> <a-textarea placeholder="" allow-clear /> </a-form-item> <a-form-item field="section" label="语言" :rules="[{match:/section one/,message:'请选择'}]"> <a-select v-model="form.section" placeholder="请选择" allow-clear> <a-option value="0">中文</a-option> <a-option value="1">英文</a-option> </a-select> </a-form-item> <!-- <a-form-item field="section" label="语言" :rules="[{match:/section one/,message:'请选择'}]">--> <!-- <a-select v-model="form.section" placeholder="请选择" allow-clear>--> <!-- <a-option value="0">中文</a-option>--> <!-- <a-option value="1">英文</a-option>--> <!-- </a-select>--> <!-- </a-form-item>--> <a-form-item field="section" label="嵌入模型" :rules="[{match:/section one/,message:'请选择'}]"> <a-select v-model="form.section" placeholder="请选择" allow-clear> <a-option value="section one">Section One</a-option> <a-option value="section two">Section Two</a-option> <a-option value="section three">Section Three</a-option> </a-select> <a-space direction="vertical" size="large"> <a-select :size="'large'" v-model="form.embd_id" :style="{width:'100%'}" placeholder="请选择 ..." disabled allow-clear> <a-optgroup :label="index" v-for="(item,index) in modelList" :key=index> <a-option v-for="(obj) in item" :key='obj.fid' :value="obj.llm_name" > {{obj.llm_name}} </a-option> </a-optgroup> </a-select> </a-space> </a-form-item> <a-form-item field="section" label="解析方法" :rules="[{match:/section one/,message:'请选择'}]"> <a-select v-model="form.section" placeholder="请选择" allow-clear> <a-option value="section one">Section One</a-option> <a-option value="section two">Section Two</a-option> <a-option value="section three">Section Three</a-option> <a-select v-model="form.parser_id" placeholder="请选择" disabled allow-clear> <a-option v-for="item in parser_ids" :key="item.value" :label="item.name" :value="item.value"></a-option> </a-select> </a-form-item> <a-form-item field="slider" label="块Token数" :rules="[{type:'number', min:5,message:'slider is min than 5'}]"> <a-slider v-model="form.score" :max="10" /> <a-input-number v-model="form.score" :style="{width:'100px',marginLeft:'2rem',borderRadius:'4px'}" placeholder="Please Enter" class="input-demo" :min="10" :max="1000" /> <a-form-item field="slider" label="块Token数"> <a-slider v-model="form.chunk_token_num" :max="1000" show-input /> </a-form-item> <a-form-item field="slider" label="布局识别" :rules="[{type:'number', min:5,message:'slider is min than 5'}]"> <a-form-item label="布局识别" > <a-space direction="vertical" size="large"> <a-switch v-model="form.score" checked-value="yes" unchecked-value="no" /> <a-switch v-model="form.layout_recognize" /> </a-space> </a-form-item> <a-form-item field="raptor" label="使用召回增强RAPTOR策略"> <a-space direction="vertical" size="large"> <a-switch v-model="form.raptor" @change="onChangeRAPTOR" /> <a-switch v-model="form.use_raptor" /> </a-space> </a-form-item> <div v-if="form.raptor"> <a-form-item field="section" label="提示词"> <div v-if="form.use_raptor"> <a-form-item field="prompt" label="提示词"> <a-textarea v-model="form.prompt" style="height: 10rem;border: 1px solid var(--color-fill-3);border-radius: 4px" placeholder="" allow-clear /> style="height: 10rem;border: 1px solid var(--color-fill-3);border-radius: 4px" placeholder="请填写提示词" /> </a-form-item> <a-form-item field="slider" label="最大token数" :rules="[{type:'number', min:5,message:'slider is min than 5'}]"> <a-slider v-model="form.score" :max="10" /> <a-input-number v-model="form.score" :style="{width:'100px',marginLeft:'2rem',borderRadius:'4px'}" placeholder="Please Enter" class="input-demo" :min="10" :max="1000" /> <a-slider v-model="form.max_token" :min="1" :max="1000" show-input/> </a-form-item> <a-form-item field="slider" label="阈值" :rules="[{type:'number', min:5,message:'slider is min than 5'}]"> <a-slider v-model="form.score" :max="10" /> <a-input-number v-model="form.score" :style="{width:'100px',marginLeft:'2rem',borderRadius:'4px'}" placeholder="Please Enter" class="input-demo" :min="10" :max="1000" /> <a-slider v-model="form.threshold" show-tooltip show-input/> </a-form-item> <a-form-item field="slider" label="最大聚类数" :rules="[{type:'number', min:5,message:'slider is min than 5'}]"> <a-slider v-model="form.score" :max="10" /> <a-input-number v-model="form.score" :style="{width:'100px',marginLeft:'2rem',borderRadius:'4px'}" placeholder="Please Enter" class="input-demo" :min="10" :max="1000" /> <a-slider v-model="form.max_cluster" :max="1000" show-input/> </a-form-item> <a-form-item field="slider" label="随机种子" <a-form-item field="slider" label="随机种子" v-model="form.random_seed" :rules="[{type:'number', min:5,message:'slider is min than 5'}]"> <a-input-number v-model="form.score" :style="{width:'300px',marginRight:'1rem',borderRadius:'4px'}" <a-input-number v-model="form.random_seed" :style="{width:'300px',marginRight:'1rem',borderRadius:'4px'}" placeholder="请输入" class="input-demo" :min="10" :max="100" /> <a-button type="primary" @click=""> <a-button type="primary" @click="randomNumber"> <icon-plus /> </a-button> </a-form-item> </div> @@ -152,7 +144,7 @@ <div class="main-container-rt"> <section data-inspector-line="34" data-inspector-column="4" data-inspector-relative-path="src\pages\add-knowledge\components\knowledge-setting\category-panel.tsx" class="categoryPanelWrapper___yI4rY" ><h4 class="categoryPanelWrapper___yI4rY"><h4 class="ant-typography topTitle___tNiB9 css-dev-only-do-not-override-1wxecgq" data-inspector-line="37" data-inspector-column="10" data-inspector-relative-path="src\pages\add-knowledge\components\knowledge-setting\category-panel.tsx">"General" @@ -202,115 +194,141 @@ <script lang="ts" setup> import { onMounted, onBeforeMount, reactive, ref } from "vue"; import { Message } from "@arco-design/web-vue"; import { queryModelList,kbUpdate } from "@/api/kbList"; const props = defineProps({ record: { type: Object, default: () => { return {}; } } const props = defineProps(['kbtenantInfo']) // const emit = defineEmits(['upTabdateItem']) const kbtenantInfo = props.kbtenantInfo; let parser_ids = kbtenantInfo.parser_ids.split(",").map((item) => { const [value1, value2] = item.split(":"); return { name: value2, value: value1 }; }); const visible = ref(false); const configIsShow = ref(false); const loading = ref(false); const formRef = ref(null); let kbObj = reactive({}); const form = reactive({ size: "medium", name: "", age: undefined, section: "0", province: "haidian", options: [], date: "", time: "", radio: "radio one", slider: 5, score: 5, switch: false, multiSelect: ["section one"], treeSelect: "", raptor: false, prompt: '请总结以下段落。 小心数字，不要编造。 段落如下：\n' + ' {cluster_content}\n' + '以上就是你需要总结的内容。', name: kbObj.name, avatar: '',// max_token: 600, threshold: 0.32, max_cluster: 233, random_seed: 1500, chunk_token_num: 128, use_raptor: false, pages: {}, prompt: "请总结以下段落。 小心数字，不要编造。 段落如下：\n" + " {cluster_content}\n" + "以上就是你需要总结的内容。", description: "", language: "English", permission: "", embd_id: "BAAI/bge-large-zh-v1.5", parser_id: kbObj.parser_id, layout_recognize: true }); const options = [ { value: "beijing", label: "Beijing", children: [ { value: "chaoyang", label: "ChaoYang", children: [ { value: "datunli", label: "Datunli" } ] }, { value: "haidian", label: "Haidian" }, { value: "dongcheng", label: "Dongcheng" }, { value: "xicheng", label: "XiCheng" } ] }, { value: "shanghai", label: "Shanghai", children: [ { value: "shanghaishi", label: "Shanghai", children: [ { value: "huangpu", label: "Huangpu" } ] } ] } ]; const rules = { name: [ { required: true, message:'知识库名称不允许为空', }, ], } const sayHello = () => { Message.info("hello"); }; let visible = ref(false); let loading = ref(false); const formRef = ref(null); const modelList = ref({}); const file = ref(); const onChange = (_, currentFile) => { file.value = { ...currentFile // url: URL.createObjectURL(currentFile.file), }; file.value = currentFile; convertImageToBase64(file.value.file).then((result)=>{ form.avatar = result; }) }; function convertImageToBase64(file) { return new Promise((resolve, reject) => { const reader = new FileReader(); reader.onloadend = function() { resolve(reader.result); }; reader.onerror = reject; reader.readAsDataURL(file); }); } const onProgress = (currentFile) => { file.value = currentFile; }; const handleSubmit = ({ values, errors }) => { console.log("values:", values, "\nerrors:", errors); const handleSubmit = async ({ values, errors }) => { if (errors){ return; } console.log(form); let parms = { name: form.name, avatar: form.avatar, description: form.description, language: form.language, permission: form.permission, embd_id: form.embd_id, parser_id: form.parser_id, parser_config: { chunk_token_num: form.chunk_token_num, layout_recognize: form.layout_recognize, }, kb_id: kbObj.id, } if(form.layout_recognize){ parms.parser_config.raptor = { use_raptor: form.use_raptor, prompt: form.prompt, max_token: form.max_token, threshold: form.threshold, max_cluster: form.max_cluster, random_seed: form.random_seed, }; } try { const data = await kbUpdate(parms); if(data.code == '0'){ Message.success("配置成功"); window.location.reload(); } // visible.value = false; // emit('upTabdateItem') } catch (err) { // you can report use errorHandler or other } }; function randomNumber() { // 生成一个介于min和max之间的随机整数（包含min和max） const min = 1; // 最小值 const max = 10000; // 最大值 form.random_seed = Math.floor(Math.random() * (max - min + 1)) + min; } const onChangeRAPTOR = () => { console.log(form.raptor); console.log(form); }; @@ -332,27 +350,69 @@ visible.value = false; }; const handleOpened = (el) => { Object.assign(form, { name: "",// 用户名 nameJoin: "",// 昵称 post: "",// 岗位 txt: ""// 备注 const handleOpened =(el) => { Object.assign(form,{ }); formRef.value.resetFields(); console.log(props.record, "record"); // if(props.edit == 'edit'){ // Object.assign(form,props.record); // } } const queryModel = async (params) => { try { const data = await queryModelList(params); // console.log(data.data, '大模型列表'); modelList.value = data.data } catch (err) { // you can report use errorHandler or other } finally { } }; onBeforeMount(() => { const changekbObj = (value) => { kbObj = value; console.log(kbObj, 'kbObj'); // if(kbObj.avatar){ // file.value.url = kbObj.avatar // } let configObj = { name: kbObj.name, avatar: kbObj.avatar, chunk_token_num: kbObj.parser_config ? kbObj.parser_config.chunk_token_num : 128, pages: kbObj.pages, description: kbObj.description, language: "English", permission: kbObj.permission, embd_id: "BAAI/bge-large-zh-v1.5", parser_id: kbObj.parser_id, layout_recognize: kbObj.parser_config ? kbObj.parser_config.layout_recognize:false, } let raptor = {} if(kbObj.parser_config && kbObj.parser_config.raptor){ raptor = kbObj.parser_config.raptor; Object.assign(form,{ ...configObj, ...raptor, }); }else{ Object.assign(form,configObj); } }); onMounted(() => { } defineExpose({ changekbObj }) }); onBeforeMount(()=>{ queryModel({}) }) onMounted(()=>{ }) </script> <script lang="ts"> @@ -374,6 +434,7 @@ //background: #626aea; background: #ffffff; padding-top: 80px; &-lf { width: 40%; //height: 100%; @@ -432,7 +493,8 @@ border-radius: 10px; overflow: hidden; padding: 20px; section{ section { width: 100%; color: #333333; }
