From bfe893e818c75815b249fbfaed954458930d5600 Mon Sep 17 00:00:00 2001 From: wujingjing <gersonwu@qq.com> Date: 星期日, 29 九月 2024 10:53:29 +0800 Subject: [PATCH] recordSetTable group --- src/views/project/yw/dataManage/knowledge/Knowledge.vue | 253 +++++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 216 insertions(+), 37 deletions(-) diff --git a/src/views/project/yw/dataManage/knowledge/Knowledge.vue b/src/views/project/yw/dataManage/knowledge/Knowledge.vue index 4eeb723..478cab6 100644 --- a/src/views/project/yw/dataManage/knowledge/Knowledge.vue +++ b/src/views/project/yw/dataManage/knowledge/Knowledge.vue @@ -3,69 +3,248 @@ <div class="flex flex-col h100"> <div class="text-[16px] font-[500] h-[22px]">鐭ヨ瘑搴撶鐞�</div> <div class="mx-0 mt-[12px] mb-[16px] flex justify-between items-center"> - <el-input - v-model="state.knowledgeBaseForm.Name" - style="width: 230px; margin-right: 10px; background: #ffffff; border-radius: 6px; transition: all 0.2s" - placeholder="鎼滅储鐭ヨ瘑搴撳悕绉�" - clearable - :suffix-icon="Search" - ></el-input> + <div class="flex-col"> + <el-input + v-model="knowledgeBaseForm.title" + style="width: 230px; margin-right: 10px; background: #ffffff; border-radius: 6px; transition: all 0.2s" + placeholder="鎼滅储鐭ヨ瘑搴撳悕绉�" + clearable + ></el-input> + <el-button type="primary" icon="ele-Search" @click="handleQueryTable"> 鏌ヨ </el-button> + <el-button icon="ele-Refresh" @click="resetQuery">閲嶇疆 </el-button> + </div> <el-button icon="ele-Plus" @click="createKnowledgeBase()" type="primary"> 鍒涘缓鐭ヨ瘑搴� </el-button> </div> - <div class="flex flex-wrap gap-3 overflow-x-auto set_item_jel"> - <img :src="knowledgeLeft" class="set_item_img" /> - <div class="set_item_content"> - <div class="flex items-center"> - <div class="mr-[10px] text-[14px] font-[500] h-[22px]">鐭ヨ瘑搴撳悕绉�</div> - <span class="set_desc_text"> - <span class="set_desc_icon ywifont ywicon-wendang"> </span> - 1涓煡璇� - </span> - <span class="set_desc_text"> - <span class="set_desc_icon ywifont ywicon-wendang"> </span> - {{ state.currentKnowledgeBaseTime }}鏇存柊 - </span> + <div class="flex flex-wrap gap-[12px]"> + <div class="flex flex-wrap gap-3 overflow-x-auto set_item_jel" v-for="item in displayTableData" :key="item.id"> + <img :src="knowledgeLeft" class="set_item_img" /> + <div class="set_item_content"> + <div class="flex items-center"> + <div class="mr-[10px] text-[14px] font-[500] h-[22px]">{{ item.title }}</div> + <span class="set_desc_text"> + <span class="set_desc_icon ywifont ywicon-wendang"> </span> + 1涓煡璇� + </span> + <span class="set_desc_text"> + <span class="set_desc_icon ywifont ywicon-fenshu_an"> </span> + {{ item.scope }} + </span> + <span class="set_desc_text"> + <span class="set_desc_icon ywifont ywicon-cshy-shizhong"> </span> + {{ item.create_time }}鏇存柊 + </span> + <span + :class="{ + 'text-orange-500': item.publish === SupervisorPublished.N, + 'text-green-500': item.publish === SupervisorPublished.Y, + }" + class="text-[12px]" + > + {{ supervisorPublishedMap[item.publish] }} + </span> + </div> + </div> + <div class="set_btn_group"> + <el-button + link + class="text-[12px]" + @click="publishKnowledgeBase(item)" + :style="{ color: item.publish === SupervisorPublished.Y ? '#f97316' : '#22c55e' }" + >{{ item.publish === SupervisorPublished.Y ? '涓嬫灦' : '鍙戝竷' }} + </el-button> + <el-divider direction="vertical" /> + <el-button link class="text-[12px] text-[#686682]" @click="viewKnowledgeBase(item)">鏌ョ湅 </el-button> + <el-divider direction="vertical" /> + <el-button link class="text-[12px] text-[#686682]" @click="openChatTest(item)">瀵硅瘽娴嬭瘯 </el-button> + <el-divider direction="vertical" /> + <el-button link class="text-[12px] text-[#686682]" @click="editKnowledgeBase(item)">缂栬緫 </el-button> + <el-divider direction="vertical" /> + <el-button link class="text-[12px]" @click="deleteKnowledgeBase(item)" style="color: #f00">鍒犻櫎 </el-button> </div> </div> - <div class="set_btn_group"> - <el-button link class="text-[12px] text-[#686682]">鏌ョ湅 </el-button> - <el-divider direction="vertical" /> - <el-button link class="text-[12px] text-[#686682]">鍛戒腑娴嬭瘯 </el-button> - <el-divider direction="vertical" /> - <el-button link class="text-[12px] text-[#686682]">缂栬緫 </el-button> - <el-divider direction="vertical" /> - <el-button link class="text-[12px] text-[#686682]">鍒犻櫎 </el-button> + </div> + </div> + <div + v-if="chatTestIsShow" + ref="draggableChatRef" + :style="style" + class="fixed z-50 w-[700px] h-[800px] flex flex-col bg-[rgb(239,244,253)] right-0 bottom-0 rounded-lg" + > + <div ref="chatDragHandlerRef" class="flex-0"> + <div class="flex items-center justify-between py-2 px-4"> + <div class="font-bold cursor-move"> + WI姘村姟鏅鸿兘绠″鈥斺�斻�恵{ chatTestMapRow?.title }}銆戞祴璇� + <!-- <img src="/static/images/logo/logo-mini.svg" width="10" height="10" /> --> + </div> + <i class="ywifont ywicon-guanbi font-[10px] font-bold cursor-pointer" @click="closeChatTest"></i> </div> </div> + <Chat ref="chatRef" class="flex-auto px-2" :questionApi="questionAi"> </Chat> </div> </div> </template> <script setup lang="ts"> -import { Search } from '@element-plus/icons-vue'; -import { reactive } from 'vue'; +import { useDraggable } from '@vueuse/core'; +import axios, { CancelTokenSource } from 'axios'; +import { ElMessage, ElMessageBox } from 'element-plus'; +import { nextTick, onMounted, ref } from 'vue'; import { useRouter } from 'vue-router'; +import { + check_docvector_validate, + delete_docvector_name, + get_docvector_list, + publish_docvector_name, +} from '/@/api/knowledge/docvector'; +import Chat from '/@/components/chat/Chat.vue'; +import { useQueryTable } from '/@/hooks/useQueryTable'; +import mittBus from '/@/utils/mitt'; +import { useCompRef } from '/@/utils/types'; +import { SupervisorPublished, supervisorPublishedMap } from '/@/views/project/yw/lowCode/sqlAmis/types'; import knowledgeLeft from '/static/images/knowledge/data_type_1.png'; const router = useRouter(); -const state = reactive({ - knowledgeBaseForm: { - Name: '', - }, - currentKnowledgeBaseTime: '2024-08-29 14:22:14', -}); +//#region ====================== 鑾峰彇鐭ヨ瘑搴搒heet鍒楄〃 ====================== +const knowledgeBaseList = ref([]); //鍒涘缓鐭ヨ瘑搴� const createKnowledgeBase = () => { router.push({ name: 'AddKnowledge', }); }; +//鑾峰彇鐭ヨ瘑搴撳垪琛� +const docvectorList = async () => { + const res = await get_docvector_list(); + if (res.json_ok) { + res.values.forEach((item) => { + item.create_time = new Date(item.create_time).toLocaleString(); + }); + knowledgeBaseList.value = res.values; + } else { + return ElMessage.error('鑾峰彇鍒楄〃绱㈠紩澶辫触' + (res?.json_msg ? `锛�${JSON.stringify(res.json_msg)}` : '')); + } +}; +const deleteKnowledgeBase = async (row) => { + ElMessageBox.confirm(`纭畾鍒犻櫎褰撳墠鐨勭煡璇嗗簱锛氥��${row.title}銆�?`, '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning', + }).then(async () => { + const res = await delete_docvector_name({ + knowlg_id: row.id, + }); + if (res.json_ok) { + ElMessage.success('鍒犻櫎鐭ヨ瘑搴撴垚鍔�'); + const index = knowledgeBaseList.value.findIndex((d) => d.id === row.id); + knowledgeBaseList.value.splice(index, 1); + } + }); +}; +//#endregion +//#region ====================== 瀵圭煡璇嗗簱杩涜缂栬緫鏌ョ湅鎿嶄綔 ====================== +const editKnowledgeBase = (row) => { + router.push({ + name: 'EditKnowledge', + query: { + knowledge_id: row.id, + knowledge_title: row.title, + knowledge_desc: row.desc, + knowledge_prompt: row.prompt, + knowledge_scope: row.scope, + }, + }); +}; +const viewKnowledgeBase = (row) => { + router.push({ + name: 'ViewKnowledge', + query: { + knowledge_id: row.id, + knowledge_title: row.title, + }, + }); +}; +//鍙戝竷 +const publishKnowledgeBase = async (row) => { + const res = await publish_docvector_name({ + knowlg_id: row.id, + publish: row.publish === SupervisorPublished.Y ? SupervisorPublished.N : SupervisorPublished.Y, + }); + if (res.json_ok) { + row.publish = row.publish === SupervisorPublished.Y ? SupervisorPublished.N : SupervisorPublished.Y; + ElMessage.success('鍚屾鎴愬姛'); + } +}; +//#endregion + +//#region ====================== 鎼滅储琛ㄦ牸锛屽琛ㄦ牸鎺掑簭 ====================== +const knowledgeBaseForm = ref({ + title: '', +}); +const { resetQuery, handleQueryTable, displayTableData } = useQueryTable(knowledgeBaseList, knowledgeBaseForm, () => { + displayTableData.value = knowledgeBaseList.value; +}); +//#endregion +//#region ====================== Chat 娴嬭瘯 ====================== + +const chatRef = useCompRef(Chat); +const chatTestMapRow = ref(null); +const chatTestIsShow = ref(false); +const openChatTest = (row) => { + chatTestMapRow.value = row; + chatTestIsShow.value = true; + nextTick(() => { + chatRef.value.clear(); + // setTimeout(() => { + // chatRef.value.autoSend(row.title); + // }, 30); + }); +}; + +const closeChatTest = () => { + chatTestMapRow.value = null; + chatTestIsShow.value = false; +}; + +const draggableChatRef = ref<HTMLElement | null>(null); +const chatDragHandlerRef = ref<HTMLDivElement>(null); +const chatDragContainerRef = ref<HTMLDivElement>(null); + +// `style` will be a helper computed for `left: ?px; top: ?px;` +const { x, y, style } = useDraggable(draggableChatRef, { + handle: chatDragHandlerRef, + initialValue: { + x: document.body.clientWidth / 2 - 350, + y: document.body.clientHeight / 2 - 400, + }, +}); + +const questionAi = async (text, sourceObj: { source: CancelTokenSource }) => { + const currentSource = axios.CancelToken.source(); + sourceObj.source = currentSource; + const res = await check_docvector_validate( + { + knowlg_id: chatTestMapRow.value.id, + question: text, + }, + { + loading: false, + cancelToken: currentSource.token, + } + ); + return res; +}; +onMounted(() => { + docvectorList(); + mittBus.on('addKnowledgeBaseObj', (obj) => { + knowledgeBaseList.value.push(obj); + }); +}); </script> <style scoped lang="scss"> .set_item_jel { align-items: center; background: #fff; border-radius: 16px; - max-width: 700px; + max-width: calc(50% - 6px); padding: 16px 20px; width: 100%; box-sizing: border-box; -- Gitblit v1.9.3