From a78f6ae9b480f1f86f1a07d551585f5f0cac07fd Mon Sep 17 00:00:00 2001 From: charles <981744753@qq.com> Date: 星期一, 29 七月 2024 16:48:56 +0800 Subject: [PATCH] feat:新增会话,会话记录模块 --- src/views/dmx/knowledgeLib/index.vue | 523 +++++++++++++++++++++++++++++++++++++++------------------ 1 files changed, 358 insertions(+), 165 deletions(-) diff --git a/src/views/dmx/knowledgeLib/index.vue b/src/views/dmx/knowledgeLib/index.vue index 7680fec..04e8c58 100644 --- a/src/views/dmx/knowledgeLib/index.vue +++ b/src/views/dmx/knowledgeLib/index.vue @@ -1,26 +1,41 @@ <template> <div class="container"> - <Breadcrumb :items="['澶фā鍨�', '鐭ヨ瘑搴撶鐞�']" /> + <Breadcrumb :items="['dmx.list.index', 'dmx.list.kbm']" /> <div class="main-container"> <div class="lf-container"> <div class="lf-container-top"> <a-input-search :placeholder="$t('cardList.searchInput.placeholder')" - style="width: 110px;" + style="width: 130px;" /> - <a-button type="primary" @click="add" style="margin-left: 10px"> - <template #icon> - <icon-plus /> - </template> - </a-button> + <addKnow @knowledgeData="knowledgeData"></addKnow> </div> <div class="lf-container-down"> + <div class="tabs"> + <div + class="tab" + v-for="(tab, index) in tabs" + :key="index" + @click="selectTab(index,tab)" + :class="{ 'active': selectedTab === index }" + > + {{ tab.name }} + <a-popover position="bl"> + <icon-more :style="{position: 'absolute',top:'10px',right:'20px'}"/> + <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> + </template> + </a-popover> + </div> + </div> </div> </div> <div class="rt-container"> <a-tabs default-active-key="1"> - <a-tab-pane key="1" title="鏁版嵁闆�"> + <a-tab-pane key="1" :title= "t('dmx.list.DataSet')"> <div class="rt-container-main"> <a-card ref="account" class="general-card" :title="$t('')" style="padding-top: 20px"> <a-row> @@ -38,81 +53,11 @@ style="width: 200px;margin-right: 10px" /> <!-- 鏂板缓--> - <add edit="add" /> + <add :kbobj="kbobj" @changeFetchData="changeFetchData"/> </a-col> - <!-- <a-col :span="8">--> - <!-- <a-form-item field="name" :label="$t('searchTable.form.name')">--> - <!-- <a-input--> - <!-- v-model="formModel.name"--> - <!-- :placeholder="$t('searchTable.form.name.placeholder')"--> - <!-- />--> - <!-- </a-form-item>--> - <!-- </a-col>--> - <!-- <a-col :span="8">--> - <!-- <a-form-item--> - <!-- field="contentType"--> - <!-- :label="$t('searchTable.form.contentType')"--> - <!-- >--> - <!-- <a-select--> - <!-- v-model="formModel.contentType"--> - <!-- :options="contentTypeOptions"--> - <!-- :placeholder="$t('searchTable.form.selectDefault')"--> - <!-- />--> - <!-- </a-form-item>--> - <!-- </a-col>--> - <!-- <a-col :span="8">--> - <!-- <a-form-item--> - <!-- field="filterType"--> - <!-- :label="$t('searchTable.form.filterType')"--> - <!-- >--> - <!-- <a-select--> - <!-- v-model="formModel.filterType"--> - <!-- :options="filterTypeOptions"--> - <!-- :placeholder="$t('searchTable.form.selectDefault')"--> - <!-- />--> - <!-- </a-form-item>--> - <!-- </a-col>--> - <!-- <a-col :span="8">--> - <!-- <a-form-item--> - <!-- field="createdTime"--> - <!-- :label="$t('searchTable.form.createdTime')"--> - <!-- >--> - <!-- <a-range-picker--> - <!-- v-model="formModel.createdTime"--> - <!-- style="width: 100%"--> - <!-- />--> - <!-- </a-form-item>--> - <!-- </a-col>--> - <!-- <a-col :span="8">--> - <!-- <a-form-item--> - <!-- field="status"--> - <!-- :label="$t('searchTable.form.status')"--> - <!-- >--> - <!-- <a-select--> - <!-- v-model="formModel.status"--> - <!-- :options="statusOptions"--> - <!-- :placeholder="$t('searchTable.form.selectDefault')"--> - <!-- />--> - <!-- </a-form-item>--> - <!-- </a-col>--> </a-row> </a-form> </a-col> - <!-- <a-divider style="height: 40px" direction="vertical" />--> - <!-- <a-col :flex="'200px'" style="text-align: right">--> - <!-- <a-button @click="reset" style="margin-right: 20px">--> - <!-- <template #icon>--> - <!-- <icon-refresh />--> - <!-- </template>--> - <!-- {{ $t('searchTable.form.reset') }}--> - <!-- </a-button>--> - <!-- <a-button type="primary" @click="search">--> - <!-- <template #icon>--> - <!-- <icon-search />--> - <!-- </template>--> - <!-- {{ $t('searchTable.form.search') }}--> - <!-- </a-button>--> - <!-- </a-col>--> </a-row> <a-divider style="margin-top: 0" /> <a-row style="margin-bottom: 16px"> @@ -210,87 +155,160 @@ @page-change="onPageChange" :scroll="{ y: 580 }" > - <template #contentType="{ record }"> - <a-space> - <a-avatar - v-if="record.contentType === 'img'" - :size="16" - shape="square" - > - <img - alt="avatar" - src="//p3-armor.byteimg.com/tos-cn-i-49unhts6dw/581b17753093199839f2e327e726b157.svg~tplv-49unhts6dw-image.image" - /> - </a-avatar> - <a-avatar - v-else-if="record.contentType === 'horizontalVideo'" - :size="16" - shape="square" - > - <img - alt="avatar" - src="//p3-armor.byteimg.com/tos-cn-i-49unhts6dw/77721e365eb2ab786c889682cbc721c1.svg~tplv-49unhts6dw-image.image" - /> - </a-avatar> - <a-avatar v-else :size="16" shape="square"> - <img - alt="avatar" - src="//p3-armor.byteimg.com/tos-cn-i-49unhts6dw/ea8b09190046da0ea7e070d83c5d1731.svg~tplv-49unhts6dw-image.image" - /> - </a-avatar> - {{ $t(`searchTable.form.contentType.${record.contentType}`) }} - </a-space> + <template #name="{ record }"> +<!-- <icon-file style="color: #0960bd;margin-right: 4px;" />--> + <icon-file style="margin-right: 4px;" /> +<!-- <span style="color: #0960bd;cursor: pointer" @click="fileClick">--> +<!-- {{record.name}}--> +<!-- </span>--> + {{record.name}} </template> - <template #filterType="{ record }"> - {{ $t(`searchTable.form.filterType.${record.filterType}`) }} + <template #create_time="{ record }"> + <span>{{parseTime(record.create_time)}}</span> </template> <template #status="{ record }"> - <span v-if="record.status === 'offline'" class="circle"></span> - <span v-else class="circle pass"></span> - {{ $t(`searchTable.form.status.${record.status}`) }} + <a-switch v-model="record.status" checked-value="0" unchecked-value="1"/> </template> - <template #operations="{ record }"> - <add edit="edit" :record = 'record' /> - <a-popconfirm content="纭畾鍒犻櫎鍚楋紵" type="warning" @ok="deleteItem(record)"> - <a-button v-permission="['admin']" type="text" size="small"> - {{ $t('鍒犻櫎') }} + <template #run="{ record }"> + <div style="display: flex;align-items: center;"> + <div style="width: 100px"> + <a-popover title="Title" v-if="record.run == '3'"> + <a-tag :loading="record.loading" :color="'blue'" border>{{$t('dmx.list.complete')}}</a-tag> + <template #content> + <p>Here is the text content</p> + </template> + </a-popover> + <a-popover title="Title" v-if="record.run == '2'"> + <a-tag :loading="record.loading" :color="'blue'" border>{{$t('dmx.list.complete')}}</a-tag> + <template #content> + <p>Here is the text content</p> + </template> + </a-popover> + <a-popover title="Title" v-if="record.run == '1'"> + <a-tag :loading="record.loading" :color="'gold'" border>{{$t('dmx.list.cancel')}}</a-tag> + <template #content> + <p>Here is the text content</p> + </template> + </a-popover> + <a-popover title="Title" v-if="record.run == '0'"> + <a-tag :loading="record.loading" :color="'green'" border>{{$t('dmx.list.NotStarted')}}</a-tag> + <template #content> + <p>Here is the text content</p> + </template> + </a-popover> + </div> + <div > + <a-button type="text" size="large" @click="run(record)" :loading="record.loading"> + <template #icon> + <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-play-circle style="color: green" v-if="record.run == '0'"/> + </template> + </a-button> + </div> + </div> + </template> + <template #action="{ record }" > + <tool/> + <edit :item="record" @upTabdateItem="upTabdateItem"/> + <a-popconfirm :content="t('纭畾鍒犻櫎鍚�')" type="warning" @ok="deleteItem(record)"> + <a-button type="text" size="small"> + <template #icon> + <icon-delete /> + </template> </a-button> </a-popconfirm> + <a-button type="text" size="small"> + <template #icon> + <icon-download /> + </template> + </a-button> </template> </a-table> </a-card> </div> </a-tab-pane> - <a-tab-pane key="2" title="娴嬭瘯"> + <a-tab-pane key="2" :title="t('dmx.list.test')"> <div class="rt-container-main"> <test ></test> </div> </a-tab-pane> - <a-tab-pane key="3" title="閰嶇疆"> + <a-tab-pane key="3" :title="t('dmx.list.disposition')"> <div class="rt-container-main"> <config ></config> </div> </a-tab-pane> </a-tabs> + <div v-if="detailsShow" class="details"> + <div class="details-header"> + <div style="display: flex;align-items: center"> + <span><icon-arrow-left size="20px" style="cursor: pointer;color: #0960bd;margin: 10px" @click="goBackClick" /></span> + <icon-file style="color: #0960bd;margin-right: 4px;" /> + <span style="">123.docx</span> + </div> + <div style="display: flex; align-items: center;"> + <a-radio-group v-model="position" type="button" style="margin-right: 10px"> + <a-radio value="top">{{'dmx.list.EntireArticle'}}</a-radio> + <a-radio value="right">{{'dmx.list.omit'}}</a-radio> + </a-radio-group> + <a-popover position="bottom"> + <a-button type="outline" class="button" style="margin-right: 10px">{{'dmx.list.batch'}} <icon-down style="margin-left: 4px" /></a-button> + <template #content> + <p>Here is the text content</p> + <p>Here is the text content</p> + </template> + </a-popover> + <a-button type="outline" class="button" style="margin-right: 10px"> + <template #icon> + <icon-search /> + </template> + </a-button> + <a-popover position="bottom"> + <a-button type="outline" class="button" style="margin-right: 10px"><icon-sort /></a-button> + <template #content> + <p>Here is the text content</p> + <p>Here is the text content</p> + </template> + </a-popover> + <addDetails></addDetails> + </div> + </div> + <a-divider style="margin-top: 10px" /> + </div> </div> </div> </div> </template> <script lang="ts" setup> - import { computed, ref, reactive, watch, nextTick } from 'vue'; +import { computed, ref, reactive, watch, nextTick, onBeforeMount } from "vue"; import { useI18n } from 'vue-i18n'; import useLoading from '@/hooks/loading'; - import { queryPolicyList, PolicyRecord, PolicyParams } from '@/api/list'; +import { + queryKbList, + PolicyRecord, + PolicyParams, + queryKbDocumentList, + deleteKnow, + queryKbdetail, + queryKbtenantInfo, kbdocumentrm, kbdocumentchangeparser, kbdocumentrun +} from "@/api/kbList"; import { Pagination } from '@/types/global'; import type { SelectOptionData } from '@arco-design/web-vue/es/select/interface'; import type { TableColumnData } from '@arco-design/web-vue/es/table/interface'; import cloneDeep from 'lodash/cloneDeep'; import Sortable from 'sortablejs'; import add from '@/views/dmx/knowledgeLib/add.vue' + import edit from '@/views/dmx/knowledgeLib/edit.vue' + import addKnow from '@/views/dmx/knowledgeLib/addKnow.vue' import config from '@/views/dmx/knowledgeLib/config.vue' import test from '@/views/dmx/knowledgeLib/test.vue' + import tool from '@/views/dmx/knowledgeLib/tool.vue' + import addDetails from '@/views/dmx/knowledgeLib/addDetails.vue' import { deleteAccount } from "@/api/account"; +import { Message } from "@arco-design/web-vue"; +import { parseTime } from "@/utils"; type SizeProps = 'mini' | 'small' | 'medium' | 'large'; type Column = TableColumnData & { checked?: true }; const account = ref(null) @@ -306,14 +324,28 @@ }; const { loading, setLoading } = useLoading(true); const { t } = useI18n(); - const renderData = ref<PolicyRecord[]>([]); + const renderData = ref([]); const formModel = ref(generateFormModel()); - const cloneColumns = ref<Column[]>([]); + const cloneColumns = ref([]); const showColumns = ref<Column[]>([]); - const edit = ref('add'); const size = ref<SizeProps>('medium'); let visible = ref(false) + let detailsShow = ref(false) + let selectedTab = ref(0) + let kbobj = reactive({}) + let tabs = ref([]) + + const selectTab = (index,item) => { + selectedTab.value= index; + console.log(item.id); + kbobj= item + fetchData({ + kb_id: kbobj.id, + page: 1, + page_size: 20 + }) + } const basePagination: Pagination = { current: 1, @@ -341,36 +373,43 @@ }, ]); const columns = computed<TableColumnData[]>(() => [ - // { - // title: t('搴忓彿'), - // dataIndex: 'index', - // slotName: 'index', - // }, { - title: t('鍚嶇О'), + title: t('dmx.column.name'), dataIndex: 'name', + slotName: 'name', }, { title: t('鍒嗗揩鏁�'), - dataIndex: 'contentType', - slotName: 'contentType', + dataIndex: 'chunk_num', }, { - title: t('涓婁紶鏃堕棿'), - dataIndex: 'filterType', + title: t('dmx.column.UploadTime'), + dataIndex: 'create_time', + slotName: 'create_time', + width:200 }, { - title: t('鍒涘缓浜�'), - dataIndex: 'count', + title: t('瑙f瀽鏂规硶'), + dataIndex: 'parser_id', + slotName: 'parser_id', + }, + { + title: t('鍚敤'), + dataIndex: 'status', + slotName: 'status', + slotName: 'status', }, { title: t('瑙f瀽鐘舵��'), - dataIndex: 'createdTime', + dataIndex: 'run', + slotName: 'run', }, { - title: t('鎿嶄綔'), - dataIndex: 'operations', - slotName: 'operations', + title: t('dmx.column.Operate'), + dataIndex: 'action', + slotName: 'action', + width: 150, + minWidth: 150, }, ]); const contentTypeOptions = computed<SelectOptionData[]>(() => [ @@ -407,16 +446,34 @@ value: 'offline', }, ]); - const fetchData = async ( - params: PolicyParams = { current: 1, pageSize: 20 } - ) => { + const fetchData = async (params) => { setLoading(true); try { - const { data } = await queryPolicyList(params); - renderData.value = data.list; - console.log(renderData); - pagination.current = params.current; - pagination.total = data.total; + const data = await queryKbDocumentList(params); + console.log(data, 'data'); + if(data.code=='0'){ + renderData.value = data.data.docs||[]; + renderData.value = renderData.value.map((item) => { + return { + ...item, + loading: false, + }; + }); + console.log(renderData.value, 'renderData.value'); + + pagination.current = params.page; + pagination.total = data.data.total; + // 鏌ヨ鐭ヨ瘑搴撹鎯� + const kbdetail = await queryKbdetail({ + kb_id:params.kb_id, + }); + // 璇︽儏 + // const kbtenantInfo = await queryKbtenantInfo(); + + + + + } } catch (err) { // you can report use errorHandler or other } finally { @@ -425,10 +482,11 @@ }; const search = () => { - fetchData({ - ...basePagination, - ...formModel.value, - } as unknown as PolicyParams); + alert(1) + // fetchData({ + // ...basePagination, + // ...formModel.value, + // }); }; const handleClick = ()=>{ @@ -439,7 +497,43 @@ fetchData({ ...basePagination, current }); }; - fetchData(); + const knowledgeData = async ( + params = { page: 1, page_size: 20 } + ) => { + setLoading(true); + try { + const { data } = await queryKbList(params); + console.log(data, 'data'); + tabs.value = data; + console.log(tabs.value, 'tabs'); + if(tabs.value.length>0 && tabs.value[0]){ + kbobj = tabs.value[0] + fetchData({ + kb_id: kbobj.id, + page: 1, + page_size: 20 + }) + } + // renderData.value = data.list; + // console.log(renderData, 'renderData'); + // pagination.current = params.current; + // pagination.total = data.total; + } catch (err) { + // you can report use errorHandler or other + } finally { + setLoading(false); + } + }; + + const deleteKnowledge = async (id) => { + let data = await deleteKnow({ + kb_id:id + }) + if(data.code == 0){ + Message.success('鍒犻櫎鎴愬姛'); + knowledgeData() + } + } const reset = () => { formModel.value = generateFormModel(); }; @@ -498,16 +592,66 @@ } }; - const deleteItem = async (row)=>{ - console.log(row); - // let data = await deleteAccount({id: row.number}) - account.value.$messageSuccess('鍒犻櫎鎴愬姛') - // - // if(data.code == 200){ - // this.$messageSuccess('鍒犻櫎鎴愬姛') - // } + const fileClick = ()=>{ + detailsShow.value = true + } + const goBackClick = ()=>{ + detailsShow.value = false + + } + function upTabdateItem(id, newName) { + console.log(id, newName); + const itemToUpdate = renderData.value.find(item => item.id === id); + if (itemToUpdate) { + itemToUpdate.name = newName; + } + } + +const deleteItem = async (row)=>{ + console.log(row); + let data = await kbdocumentrm({doc_id: row.id}) + if(data.code == 0){ + Message.success('鍒犻櫎鎴愬姛'); + console.log(kbobj, 'kbobj'); + fetchData({ + kb_id: kbobj.id, + page: 1, + page_size: 20 + }) + } + } + +const run = async (row)=>{ + console.log(row); + row.loading = true; + let data = await kbdocumentrun({ + doc_ids: [row.id], + run: '1' + }) + // let data = await kbdocumentchangeparser({ + // parser_id: row.parser_id, + // doc_id: row.id, + // parser_config: row.parser_config, + // }) + if(data.code == 0){ + Message.success('瑙f瀽鎴愬姛'); + row.run = '3'; + }else{ + Message.error('瑙f瀽澶辫触'); + row.run = '1'; + } + row.loading = false; +} + +const changeFetchData = async (row)=>{ + fetchData({ + kb_id: kbobj.id, + page: 1, + page_size: 20 + }) +} watch( () => columns.value, (val) => { @@ -520,6 +664,11 @@ }, { deep: true, immediate: true } ); + + onBeforeMount(()=>{ + knowledgeData() + }) + </script> <script lang="ts"> @@ -547,12 +696,42 @@ display: flex; } .lf-container-down{ - width: 80%; + display: flex; + flex-direction: column; + width: 90%; height: calc(100% - 5rem); - border: 1px solid #cccccc; + border: 1px solid #eeeeee; + overflow: auto; + padding: 10px; + .tabs .tab { + cursor: pointer; + box-sizing: border-box; + margin: 10px 0; + padding:0 10px; + color: rgba(0, 0, 0, 0.88); + font-size: 14px; + height: 40px; + line-height: 40px; + list-style: none; + position: relative; + background: #ffffff; + border: 1px solid #f0f0f0; + border-radius: 8px; + } + .tabs .tab:hover { + border: 1px solid #ffffff; + 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); + } + .tabs .tab.active { + border: 1px solid #e8e8ea; + background: #e8e8ea; + cursor: pointer; + } } } .rt-container{ + position: relative; //background: #626aea; margin-left: 20px; width: calc(100% - 200px); @@ -560,6 +739,20 @@ .rt-container-main{ height: 76vh; } + .details{ + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: #ffffff; + .details-header{ + display: flex; + justify-content: space-between; + margin-top: 10px; + padding-right: 20px; + } + } } } } -- Gitblit v1.8.0