From ea694c15fd938bb9f0926c0df81e21ce49f71b0f Mon Sep 17 00:00:00 2001 From: liudong <liudong> Date: 星期二, 13 八月 2024 10:32:29 +0800 Subject: [PATCH] 知识库列表解析逻辑修改 --- src/views/dmx/knowledgeLib/index.vue | 269 ++++++++++++++++++++++++++++++++--------------------- 1 files changed, 164 insertions(+), 105 deletions(-) diff --git a/src/views/dmx/knowledgeLib/index.vue b/src/views/dmx/knowledgeLib/index.vue index b61853d..4e850b3 100644 --- a/src/views/dmx/knowledgeLib/index.vue +++ b/src/views/dmx/knowledgeLib/index.vue @@ -8,10 +8,10 @@ :placeholder="$t('cardList.searchInput.placeholder')" style="width: 130px;" /> - <addKnow @getknowledge="getknowledge"></addKnow> + <addKnow @getknowledge="getknowledge" @getKbdetail="getKbdetail"></addKnow> </div> - <div class="lf-container-down"> - <a-scrollbar style="height:56rem;overflow: auto;"> + <a-spin :loading="listloading" class="lf-container-down"> + <a-scrollbar style="height: calc(100vh - 300px); overflow: auto"> <div class="tab" v-for="(tab, index) in tabs" @@ -21,21 +21,22 @@ > {{ tab.name }} <a-popover position="bl"> - <icon-more :style="{position: 'absolute',top:'10px',right:'20px'}"/> + <icon-more :style="{position: 'absolute',top:'10px',right:'10px'}"/> <template #content> - <a-popconfirm content="纭畾鍒犻櫎鍚�?" @ok="deleteKnowledge(tab.id)" type="warning"> - <span style="cursor: pointer;color: #0960bd;font-size: 12px"><icon-delete />鍒犻櫎</span> - </a-popconfirm> +<!-- <a-popconfirm content="纭畾鍒犻櫎鍚�?" @ok="deleteKnowledge(tab.id)" type="warning">--> +<!-- <span style="cursor: pointer;color: #4977ba;font-size: 12px"><icon-delete style="font-size: 14px"/>鍒犻櫎</span>--> +<!-- </a-popconfirm>--> + <span style="cursor: pointer;color: #4977ba;font-size: 12px" @click="deleteKnowledge(tab.id)"><icon-delete style="font-size: 14px" />鍒犻櫎</span> </template> </a-popover> </div> </a-scrollbar> - </div> + </a-spin> </div> - <div class="rt-container"> - <a-tabs default-active-key="1"> + <div class="rt-container" v-if="tabs.length > 0" > + <a-tabs :active-key="activeKey" @change="handleTabChange"> <a-tab-pane key="1" :title= "t('dmx.list.DataSet')"> - <div class="rt-container-main"> + <a-scrollbar class="rt-container-main" :style="{height: documentHeight + 70 + 'px'}" style="overflow: auto"> <a-card ref="account" class="general-card" title="" style="padding-top: 20px"> <a-row> <a-col :flex="1" :span="12"> @@ -54,7 +55,7 @@ @change="search" /> <!--鏂板缓--> - <span v-if="tabs.length > 0"> + <span> <add :kbobj="kbobj" @changeFetchData="changeFetchData"/> </span> </a-col> @@ -156,7 +157,9 @@ :bordered="false" :size="size" @page-change="onPageChange" - :scroll="{ y: 580 }" + :max-height='documentHeight' + :scroll="{x: 1000, y: documentHeight }" + > <template #name="{ record }"> <!-- <icon-file style="color: #0960bd;margin-right: 4px;" />--> @@ -191,7 +194,7 @@ </template> </a-popover> <a-popover title="Title" v-if="record.run == '1'"> - <a-tag :loading="record.loading" :color="'blue'" border>{{$t('dmx.list.complete')}}</a-tag> + <a-tag :loading="record.loading" :color="'blue'" border>瑙f瀽涓�...</a-tag> <template #content> <p></p> </template> @@ -214,8 +217,10 @@ <template #icon> <icon-sync v-if="record.run == '4'"/> <icon-sync v-if="record.run == '3'"/> - <icon-sync v-if="record.run == '2'"/> - <icon-sync style="color: green" v-if="record.run == '1'"/> + <icon-sync style="color: green" v-if="record.run == '2'"/> + <a-button status="warning" shape="circle" v-if="record.run == '1'" size="small"> + <icon-close /> + </a-button> <icon-play-circle style="color: green" v-if="record.run == '0'"/> </template> </a-button> @@ -238,7 +243,7 @@ </template> </a-button> - <a-button type="text" size="small" @click="seeload(record)"> + <a-button type="text" size="small" @click="previewArea(record)"> <template #icon> <icon-eye /> </template> @@ -247,17 +252,17 @@ </template> </a-table> </a-card> - </div> + </a-scrollbar> </a-tab-pane> <a-tab-pane key="2" :title="t('dmx.list.test')"> - <div class="rt-container-main"> + <a-scrollbar class="rt-container-main" :style="{height: documentHeight + 70 + 'px'}" style="overflow: auto"> <test ref="testForm"></test> - </div> + </a-scrollbar> </a-tab-pane> <a-tab-pane key="3" :title="t('dmx.list.disposition')"> - <div class="rt-container-main"> - <config ref="configForm" :kbtenantInfo="kbtenantInfo" :kbobj="kbobj"></config> - </div> + <a-scrollbar class="rt-container-main" :style="{height: documentHeight + 70 + 'px'}" style="overflow: auto"> + <config ref="configForm" :kbtenantInfo="kbtenantInfo" @cancleConfig="cancleConfig" @saveConfig="saveConfig"></config> + </a-scrollbar> </a-tab-pane> </a-tabs> <!-- <div v-if="detailsShow" class="details">--> @@ -299,7 +304,7 @@ </div> </div> <a-modal title=" " v-model:visible="visible" :footer="false" fullscreen> -<!-- <docx v-if="documenttype=='docx'" previewSrc="http://192.168.20.116:1080/v1/document/get/405c3efa4d8c11ef97560242ac120006"></docx>--> +<!-- <docx previewSrc="http://192.168.20.116:1080/v1/document/get/405c3efa4d8c11ef97560242ac120006"></docx>--> <docx v-if="documenttype=='docx'" :previewSrc="previewSrc"></docx> <excel v-if="documenttype=='excel'" :previewSrc="previewSrc"></excel> <txtPdf v-if="documenttype=='txtPdf'" :previewSrc="previewSrc"></txtPdf> @@ -334,8 +339,12 @@ import docx from '@/views/dmx/knowledgeLib/components/docx.vue' import excel from '@/views/dmx/knowledgeLib/components/excel.vue' import txtPdf from '@/views/dmx/knowledgeLib/components/txtPdf.vue' - import { Message } from "@arco-design/web-vue"; - import { parseTime } from "@/utils"; + import { Message, Modal } from "@arco-design/web-vue"; + import { documentHeight, parseTime } from "@/utils"; + import { deleteLlm } from "@/api/model"; + import { userModelState } from "@/store" + let modelStore = userModelState(); + const httpUrl = modelStore.hrefUrl; type SizeProps = 'mini' | 'small' | 'medium' | 'large'; type Column = TableColumnData & { checked?: true }; const account = ref(null) @@ -358,7 +367,9 @@ const size = ref<SizeProps>('medium'); let visible = ref(false) + let listloading = ref(false) let keywords = ref('') + let activeKey = ref('1') let detailsShow = ref(false) let selectedTab = ref(0) let testForm = ref(null) @@ -371,15 +382,15 @@ let parser_ids = reactive({}) let seeObj = reactive({}) let kbtenantInfo = reactive({ - "asr_id": "paraformer-realtime-8k-v1", - "embd_id": "BAAI/bge-large-zh-v1.5", - "img2txt_id": "qwen-vl-max", - "llm_id": "qwen-plus", - "name": "wanghao鈥榮 Kingdom", - "parser_ids": "naive:General,qa:Q&A,resume:Resume,manual:Manual,table:Table,paper:Paper,book:Book,laws:Laws,presentation:Presentation,picture:Picture,one:One", - "rerank_id": "BAAI/bge-reranker-v2-m3", - "role": "owner", - "tenant_id": "948fc6fa41ab11ef8fb80242ac120004", + asr_id: "paraformer-realtime-8k-v1", + embd_id: "BAAI/bge-large-zh-v1.5", + img2txt_id: "qwen-vl-max", + llm_id: "qwen-plus", + name: "wanghao鈥榮 Kingdom", + parser_ids: "naive:General,qa:Q&A,resume:Resume,manual:Manual,table:Table,paper:Paper,book:Book,laws:Laws,presentation:Presentation,picture:Picture,one:One", + rerank_id: "BAAI/bge-reranker-v2-m3", + role: "owner", + tenant_id: "948fc6fa41ab11ef8fb80242ac120004", parser_idObj:{} }) let tabs = ref([]) @@ -389,13 +400,12 @@ // console.log(item.id); kbobj= item; kbId = kbobj.id; - testForm.value.changekbid(kbId); - configForm.value.changekbObj(kbobj); fetchData({ kb_id: kbobj.id, page: 1, page_size: 20 }) + getKbdetail(kbobj.id) } const basePagination: Pagination = { @@ -500,10 +510,7 @@ setLoading(true); try { const data = await queryKbDocumentList(params); - console.log(data, 'data'); if(data.code=='0'){ - // 璇︽儏 - // const kbtenantInfo = await queryKbtenantInfo(); parser_ids = kbtenantInfo.parser_ids.split(',').reduce((acc, pair) => { const [key, value] = pair.split(':'); acc[key] = value; @@ -519,14 +526,10 @@ parser_id: parser_ids[item.parser_id], }; }); - console.log(renderData.value, 'renderData'); + // console.log(renderData.value, 'renderData'); pagination.current = params.page; pagination.total = data.data.total; - // 鏌ヨ鐭ヨ瘑搴撹鎯� - // kbdetail = await queryKbdetail({ - // kb_id:params.kb_id, - // }); } } catch (err) { @@ -556,22 +559,24 @@ const knowledgeData = async ( params = { page: 1, page_size: 20 } ) => { - setLoading(true); + listloading.value = true; try { const { data } = await queryKbList(params); - console.log(data, 'data'); + // console.log(data, 'data'); tabs.value = data; - console.log(tabs.value, 'tabs'); + // console.log(tabs.value, 'tabs'); if(tabs.value.length>0 && tabs.value[0]){ kbobj = tabs.value[0] kbId = kbobj.id; - testForm.value.changekbid(kbId); - configForm.value.changekbObj(kbobj); + activeKey.value = '1'; fetchData({ kb_id: kbobj.id, page: 1, page_size: 20 }) + getKbdetail(kbobj.id) + }else{ + } // renderData.value = data.list; // console.log(renderData, 'renderData'); @@ -580,27 +585,35 @@ } catch (err) { // you can report use errorHandler or other } finally { - setLoading(false); + listloading.value = false; } }; -const getknowledge = async ( - params = { page: 1, page_size: 20 } -) => { + + + const getKbdetail = async (kb_id) => { + // 鏌ヨ鐭ヨ瘑搴撹鎯� + const data = await queryKbdetail({ + kb_id:kb_id, + }); + kbdetail = data.data; + testForm.value.changekbid(kbdetail.id); + configForm.value.changekbObj(kbdetail); + }; + + + + +const getknowledge = async (id) => { setLoading(true); try { - const { data } = await queryKbList(params); + const { data } = await queryKbList({ page: 1, page_size: 20 }); console.log(data, '鏌ヨ鐭ヨ瘑搴撳垪琛�'); tabs.value = data; - if(tabs.value.length>0 && tabs.value[0]){ - kbobj = tabs.value[0] - kbId = kbobj.id; - testForm.value.changekbid(kbId); - configForm.value.changekbObj(kbobj); - // fetchData({ - // kb_id: kbobj.id, - // page: 1, - // page_size: 20 - // }) + if(tabs.value.length>0){ + // 瀹氫綅鍒版柊澧炵殑鐭ヨ瘑搴撳崟鍏� + selectedTab.value = tabs.value.findIndex(item=>item.id==id); + getKbdetail(id) // 鑾峰彇璇︽儏 + activeKey.value = '3'; } @@ -615,25 +628,63 @@ } }; - const deleteKnowledge = async (id) => { - let data = await deleteKnow({ - kb_id:id - }) - if(data.code == 0){ - Message.success('鍒犻櫎鎴愬姛'); - knowledgeData() - } + const deleteKnowledge = (id) => { + Modal.confirm({ + title: '鎻愮ず淇℃伅', + content: '纭鍒犻櫎鍚�', + okText: '纭畾', + cancelText: '鍙栨秷', + hideTitle: true, + onOk: async () => { + let data = await deleteKnow({ + kb_id:id + }) + if(data.code == 0){ + Message.success('鍒犻櫎鎴愬姛'); + knowledgeData() + } + }, + onCancel: () => {}, + }); } const reset = () => { formModel.value = generateFormModel(); }; - + function handleTabChange(key) { + // 澶勭悊鏍囩鏀瑰彉浜嬩欢 + console.log('Changed to tab:', key); + activeKey.value=key; + } const handleSelectDensity = ( val: string | number | Record<string, any> | undefined, e: Event ) => { size.value = val as SizeProps; }; + + const cancleConfig = () => { + activeKey.value = '1'; + let id = tabs.value[selectedTab.value].id; + fetchData({ + kb_id: id, + page: 1, + page_size: 20 + }) + } + + const saveConfig = async () => { + activeKey.value = '1'; + let id = tabs.value[selectedTab.value].id; + const { data } = await queryKbList({ page: 1, page_size: 20 }); + tabs.value = data; + fetchData({ + kb_id: id, + page: 1, + page_size: 20 + }) + getKbdetail(id) // 鑾峰彇璇︽儏 + } + const handleChange = ( checked: boolean | (string | boolean | number)[], @@ -704,7 +755,7 @@ let data = await kbdocumentrm({doc_id: row.id}) if(data.code == 0){ Message.success('鍒犻櫎鎴愬姛'); - console.log(kbobj, 'kbobj'); + // console.log(kbobj, 'kbobj'); fetchData({ kb_id: kbobj.id, page: 1, @@ -719,7 +770,7 @@ filename: record.name, }); } -const seeload = async (row)=>{ +const previewArea = async (row)=>{ Object.assign(seeObj, row) // console.log(seeObj.name, 'seeObj'); let type = row.name.split('.')[1]; @@ -736,6 +787,7 @@ return false } previewSrc.value = `${import.meta.env.VITE_API_BASE_URL}/v1/document/get/${row.id}` + // previewSrc.value = `${ httpUrl }/v1/document/get/${row.id}` visible.value = true; } @@ -753,25 +805,32 @@ const run = async (row)=>{ - console.log(row); row.loading = true; - let run = '1' - if(row.run!='2'){ + let run; + if(row.run=='0'){ run = '1' - }else { + }else if(row.run=='1'){ run = '2' + }else if(row.run=='2'){ + run = '1' + }else{ + run = '1' } let data = await kbdocumentrun({ doc_ids: [row.id], run: run }) if(data.code == 0){ - Message.success('瑙f瀽鎴愬姛'); - row.run = '3'; + fetchData({ + kb_id: tabs.value[selectedTab.value].id, + page: 1, + page_size: 20 + }) }else{ - Message.error('瑙f瀽澶辫触'); - row.run = '1'; + // Message.error('瑙f瀽澶辫触'); + // row.run = '1'; } + row.loading = false; } @@ -795,7 +854,10 @@ { deep: true, immediate: true } ); - onBeforeMount(()=>{ + onBeforeMount(async()=>{ + // const {data} = await queryKbtenantInfo(); + // Object.assign(kbtenantInfo,data); + // console.log(kbtenantInfo,'kbtenantInfo鐨勬暟鎹�'); }) onMounted(()=>{ @@ -804,28 +866,18 @@ </script> -<script lang="ts"> - export default { - name: 'SearchTable', - methods: { - - } - }; -</script> - <style scoped lang="less"> .container { padding: 0 20px 20px 20px; .main-container{ display: flex; width: 100%; - height: 100%; .lf-container{ display: flex; flex-direction: column; align-items: center; - justify-content: space-evenly; - //background: #ffffff; + //justify-content: space-evenly; + border-radius: 8px; background: var(--color-bg-2); width: 200px; .lf-container-top{ @@ -837,8 +889,9 @@ flex-direction: column; box-sizing: border-box; width: 90%; - //height: 56rem; + height: calc(100% - 80px); border: 1px solid var(--color-fill-3); + border-radius: 8px; //padding: 10px; margin-bottom: 10px; //.tabs{ @@ -851,23 +904,29 @@ box-sizing: border-box; margin: 10px 10px; padding:0 10px; - color: rgba(0, 0, 0, 0.88); + padding-right: 20%; font-size: 14px; height: 40px; line-height: 40px; list-style: none; position: relative; - background: #ffffff; - border: 1px solid #f0f0f0; + color: var(--color-text-1); + border: 1px solid var(--color-neutral-3); + background: var(--color-bg-2); border-radius: 8px; + overflow: hidden; /* 纭繚瓒呭嚭瀹瑰櫒鐨勬枃鏈闅愯棌 */ + white-space: nowrap; /* 闃叉鏂囨湰鎹㈣ */ + text-overflow: ellipsis; /* 瓒呭嚭閮ㄥ垎鏄剧ず鐪佺暐鍙� */ } .tab:hover { - border: 1px solid #ffffff; + color: #2a2a2b; + border: 1px solid var(--color-neutral-3); background: #e8e8ea; box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09); } .tab.active { - border: 1px solid #e8e8ea; + color: #2a2a2b; + border: 1px solid var(--color-neutral-1); background: #e8e8ea; cursor: pointer; } @@ -878,9 +937,9 @@ //background: #626aea; margin-left: 20px; width: calc(100% - 200px); - height: 56rem; + overflow: hidden; .rt-container-main{ - height: 76vh; + overflow: auto; } .details{ position: absolute; -- Gitblit v1.8.0