From 8d83544ff6e123df4facf40c446e7d9bf4a522b6 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期二, 31 十二月 2024 18:07:54 +0800
Subject: [PATCH] 序号
---
src/views/project/yw/dataManage/knowledge/AddKnowledge.vue | 655 ++++++++++++++++++++++++++++++++++++++++++++++++++++-------
1 files changed, 577 insertions(+), 78 deletions(-)
diff --git a/src/views/project/yw/dataManage/knowledge/AddKnowledge.vue b/src/views/project/yw/dataManage/knowledge/AddKnowledge.vue
index cd627f8..d89123c 100644
--- a/src/views/project/yw/dataManage/knowledge/AddKnowledge.vue
+++ b/src/views/project/yw/dataManage/knowledge/AddKnowledge.vue
@@ -1,99 +1,249 @@
<template>
- <div class="h100 overflow-y-auto p-[16px]">
- <div class="mb-[10px] flex items-center">
- <el-button style="margin-left: 8px; width: 40px" text @click="handleExitFlow">
+ <div class="flex flex-col h100">
+ <div class="mb-[10px] flex flex-shrink-0 items-center">
+ <el-button style="margin-left: 8px; width: 40px" link @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="relative">
- <div class="relative transition-[opacity 0.3s]">
- <div class="set-form-height">
- <div class="flex flex-col">
- <el-divider content-position="left"><span class="text-[18px]">鐭ヨ瘑搴撳熀纭�淇℃伅</span></el-divider>
- <el-form :model="state.categoryForm" label-width="120px" label-position="left">
- <el-form-item label="鐭ヨ瘑搴撳悕绉�:">
- <el-input
- v-model="state.categoryForm.ImportCategory"
- style="width: 532px"
- maxlength="20"
- placeholder="璇疯緭鍏ョ煡璇嗗簱鍚嶇О"
- show-word-limit
- type="text"
- />
- </el-form-item>
- <el-form-item label="鐭ヨ瘑搴撴弿杩�:">
- <el-input
- v-model="state.categoryForm.CategoryType"
- maxlength="1000"
- style="width: 532px"
- placeholder="璇疯緭鍏ョ煡璇嗗簱鎻忚堪銆傚鐭ヨ瘑搴撳寘鍚殑鍐呭鍜屾暟鎹殑鐢ㄩ�旇繘琛屾弿杩般��"
- show-word-limit
- :rows="5"
- type="textarea"
- />
- </el-form-item>
- <el-form-item label="鏁版嵁绫诲瀷:">
- <div v-for="(item, index) in state.dataTypeList" :key="index">
- <div
- class="bg-[#f6f5ff] border-[1px] border-solid border-[#0062be] py-[12px] w-[215px] px-[16px] rounded-lg cursor-pointer"
- >
- <el-radio v-model="state.categoryForm.dataType" size="large">
- <span class="font-[700] text[14px]">{{ item.Name }}</span>
- </el-radio>
-
- <el-tooltip :content="item.DemoDesc" placement="top" effect="light" popper-class="set_tooltip_demo">
- <div class="text-[#878aab] text-[12px] mx-0 mt-[2px] mb-0 set-desc">
- {{ item.DemoDesc }}
- </div>
- </el-tooltip>
- </div>
+ <div class="set-form-height" v-show="!state.showKnowledgeForm">
+ <el-form
+ :model="state.knowledgeForm"
+ label-width="120px"
+ label-position="left"
+ ref="knowledgeFormRef"
+ :rules="knowledgeFormRules"
+ >
+ <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.knowledgeForm.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.knowledgeForm.prompt"
+ maxlength="1000"
+ style="width: 532px"
+ placeholder="璇疯緭鍏ョ煡璇嗗簱鎻忚堪銆傚鐭ヨ瘑搴撳寘鍚殑鍐呭鍜屾暟鎹殑鐢ㄩ�旇繘琛屾弿杩般��"
+ show-word-limit
+ :rows="5"
+ type="textarea"
+ />
+ </el-form-item>
+ <el-form-item label="绱㈠紩鍒嗘暟:" prop="scope">
+ <el-input v-model="state.knowledgeForm.scope" style="width: 532px" />
+ </el-form-item>
+ <el-form-item label="鏁版嵁绫诲瀷:">
+ <div v-for="(item, index) in state.dataTypeList" :key="index">
+ <div
+ class="bg-[#fff] border-[1px] border-solid border-[#d8d9e6] py-[12px] w-[215px] mr-[10px] px-[16px] rounded-lg cursor-pointer"
+ :class="{ activeColor: state.knowledgeForm.dataType === item.ID }"
+ @click="activeDataType(item.ID)"
+ >
+ <div class="flex items-center">
+ <div class="data_left">
+ <img :src="item.ImageURL" class="w-[40px] h-[40px] mr-[10px]" />
</div>
- </el-form-item>
- <!-- <el-form-item label="閰嶇疆妯″紡:">
- <div
- class="bg-[#f6f5ff] border-[1px] border-solid border-[#0062be] py-[12px] w-[215px] px-[16px] rounded-lg cursor-pointer"
- >
- <el-radio-group v-model="state.categoryForm.configurationMode">
- <el-radio value="1" size="large">
- <span class="font-[700] text[14px]">鏂囨。鏅鸿兘瑙ｆ瀽</span>
- </el-radio>
- </el-radio-group>
- <el-tooltip :content="state.demoDesc" placement="top" effect="light" popper-class="set_tooltip_demo">
+ <div class="data_right">
+ <el-radio v-model="state.knowledgeForm.dataType" size="large" :label="item.ID">
+ <span class="font-[500] text[16px]">{{ item.Name }}</span>
+ </el-radio>
+
+ <el-tooltip :content="item.DemoDesc" placement="top" effect="light" popper-class="set_tooltip_demo">
<div class="text-[#878aab] text-[12px] mx-0 mt-[2px] mb-0 set-desc">
- {{ state.demoDesc }}
+ {{ item.DemoDesc }}
</div>
</el-tooltip>
</div>
- </el-form-item> -->
- </el-form>
+ </div>
+ </div>
+ </div>
+ </el-form-item>
+ <el-divider content-position="left"><span class="text-[18px]">鐭ヨ瘑搴撻厤缃�</span></el-divider>
+ <el-form-item label="閰嶇疆妯″紡:">
+ <div class="flex-auto flex flex-col">
+ <div class="flex">
+ <div v-for="(item, index) in state.configurationList" :key="index">
+ <div
+ class="bg-[#fff] border-[1px] border-solid border-[#d8d9e6] py-[12px] w-[215px] mr-[10px] px-[16px] rounded-lg cursor-pointer"
+ :class="{ activeColor: state.knowledgeForm.configurationMode === item.ID }"
+ @click="activeConfigurationType(item.ID)"
+ >
+ <div class="flex items-center">
+ <div class="data_left">
+ <img :src="item.ImageURL" class="w-[40px] h-[40px] mr-[10px]" />
+ </div>
+ <div class="data_right">
+ <el-radio v-model="state.knowledgeForm.configurationMode" size="large" :label="item.ID">
+ <span class="font-[500] text[16px]">{{ item.Name }}</span>
+ </el-radio>
- <div class="set-form-footer">
- <el-button type="primary" @click="onSubmit">涓嬩竴姝�</el-button>
- <el-button>鍙栨秷</el-button>
+ <el-tooltip :content="item.DemoDesc" placement="top" effect="light" popper-class="set_tooltip_demo">
+ <div class="text-[#878aab] text-[12px] mx-0 mt-[2px] mb-0 set-desc">
+ {{ item.DemoDesc }}
+ </div>
+ </el-tooltip>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- <div class="set_model_desc">
+ <div v-for="(item, index) in state.modeList" :key="index">
+ <div class="flex items-center mb-[16px]">
+ <div class="relative w-[148px] text-[14px] text-[#26244c]">{{ item.Name }}</div>
+ <div class="text-[14px] text-[#26244c]" :class="`min-w-[${item.NameFnWidthStyle}]`">{{ item.NameFn }}</div>
+ <div v-show="item.ID == 3">
+ <div class="min-w-[148px] text-[14px] text-[#26244c]">{{ item.NameOrder }}</div>
+ </div>
+ </div>
+ </div>
+ </div> -->
+ </div>
+ </el-form-item>
+ </el-form>
+ </div>
+ <div class="set-form-height" v-show="state.showKnowledgeForm">
+ <el-form
+ :model="state.knowledgeFile"
+ label-width="120px"
+ label-position="left"
+ class="h100"
+ ref="knowledgeFileRef"
+ :rules="knowledgeFormRules"
+ >
+ <el-divider content-position="left"><span class="text-[18px] font-[500]">閫夋嫨鏂囦欢</span></el-divider>
+ <div class="flex items-start gap-[16px] max-h-[686px] min-h-[360px] set-file-height">
+ <div class="min-h-[360px] h100 set_file_left">
+ <div class="font-[500] mb-2">璇烽�夋嫨鏂囨。</div>
+ <div class="left_content">
+ <div class="file_menu">
+ <LeftTreeByMgr
+ title-name="绫荤洰"
+ ref="leftTreeRef"
+ :treedata="state.knowledgeBaseData"
+ :current-node-key="currentListID"
+ :defaultProps="{
+ id: 'group_id',
+ label: 'group_name',
+ children: 'Children',
+ }"
+ defaultExpandAll
+ @click="handleClickNode"
+ >
+ </LeftTreeByMgr>
+ </div>
+ <div class="file_table">
+ <el-table
+ :data="state.fileData"
+ border
+ @select="handleSelectItem"
+ highlight-current-row
+ ref="multipleTableRef"
+ @select-all="
+ (selection) => {
+ handleSelectAll(selection, state.fileData);
+ }
+ "
+ >
+ <el-table-column type="selection" width="55" />
+ <el-table-column prop="name" label="鏂囦欢鍚嶇О" />
+ </el-table>
+ </div>
+ </div>
+ </div>
+ <div class="set_file_right">
+ <div class="h100">
+ <div class="font-[500] mb-[12px]">宸查�夋枃妗{ multipleSelection.length }}/50涓�</div>
+ <div class="selected_file">
+ <div v-for="(item, index) in multipleSelection" :key="index" class="set_file_item">
+ <span class="set_file_name">{{ item.name }}</span>
+ <span class="ywifont ywicon-guanbi set_file_close" @click="handleRemoveItem(item)"></span>
+ </div>
+ </div>
</div>
</div>
</div>
+ <el-divider content-position="left"><span class="text-[18px]">鏁版嵁澶勭悊</span></el-divider>
+ <el-form-item label="鏂囨。鍒囧垎chunk:">
+ <div class="flex-auto flex flex-col">
+ <div class="flex">
+ <div v-for="(item, index) in state.segmentationList" :key="index">
+ <div
+ class="bg-[#fff] border-[1px] border-solid border-[#d8d9e6] py-[12px] w-[215px] mr-[10px] px-[16px] rounded-lg cursor-pointer"
+ :class="{ activeColor: state.knowledgeForm.segmentationMode === item.ID }"
+ @click="activeDataProcessType(item.ID)"
+ >
+ <div class="flex items-center">
+ <div class="data_left">
+ <img :src="item.ImageURL" class="w-[40px] h-[40px] mr-[10px]" />
+ </div>
+ <div class="data_right">
+ <el-radio v-model="state.knowledgeForm.segmentationMode" size="large" :label="item.ID">
+ <span class="font-[500] text[16px]">{{ item.Name }}</span>
+ </el-radio>
+
+ <el-tooltip :content="item.DemoDesc" placement="top" effect="light" popper-class="set_tooltip_demo">
+ <div class="text-[#878aab] text-[12px] mx-0 mt-[2px] mb-0 set-desc">
+ {{ item.DemoDesc }}
+ </div>
+ </el-tooltip>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </el-form-item>
+ </el-form>
+ </div>
+ <div class="set-form-footer">
+ <div v-show="!state.showKnowledgeForm">
+ <el-button type="primary" @click="nextKnowledge">涓嬩竴姝�</el-button>
</div>
+ <div v-show="state.showKnowledgeForm">
+ <el-button @click="importCompleted" type="primary">瀵煎叆瀹屾垚</el-button>
+ <el-button @click="backKnowledge" v-show="state.showKnowledgeForm">涓婁竴姝�</el-button>
+ </div>
+ <el-button @click="handleExitFlow">鍙栨秷</el-button>
</div>
</div>
</template>
<script setup lang="ts">
-import type { UploadUserFile } from 'element-plus';
-import { reactive, ref } from 'vue';
-import { useRouter } from 'vue-router';
+import { ElMessage, type FormRules } from 'element-plus';
+import moment from 'moment';
+import { computed, nextTick, onMounted, reactive, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { add_docvector_file, add_docvector_name } from '/@/api/knowledge/docvector';
+import { get_knowledge_group_list, list_knowledge_file } from '/@/api/knowledge/group';
+import LeftTreeByMgr from '/@/components/tree/leftTreeByMgr.vue';
+import mittBus from '/@/utils/mitt';
+import { verifiyNumberInteger } from '/@/utils/toolsValidate';
+import { convertListToTree } from '/@/utils/util';
+import { OptClassificationMap, classificationEnum } from '/@/views/types/metrics';
+const route = useRoute();
// 瀹氫箟鍙橀噺鍐呭
const state = reactive({
+ soliderValue: 0,
detailTitle: '鍒涘缓鐭ヨ瘑搴�',
- categoryForm: {
- ImportCategory: '',
- CategoryType: '鏈湴绫荤洰',
- dataType: '1',
- configurationMode: '1',
+ knowledgeForm: {
+ title: '',
+ prompt: '',
+ scope: null,
+ dataType: 1,
+ configurationMode: 1,
+ segmentationMode: 1,
},
+ knowledgeFile: {},
dataTypeList: [
{
ID: 1,
@@ -107,27 +257,294 @@
ImageURL: 'static/images/knowledge/data_type_2.png',
DemoDesc: '閫夋嫨鏁版嵁绠＄悊鍔熻兘涓凡鍒涘缓鐨勬暟鎹〃',
},
+ ], //鏁版嵁绫诲瀷
+ configurationList: [
+ {
+ ID: 1,
+ Name: '鎺ㄨ崘閰嶇疆',
+ ImageURL: 'static/images/knowledge/data_type_3.png',
+ DemoDesc: '鐧剧偧鎺ㄨ崘閰嶇疆锛屽湪鏁堟灉銆佹帹鐞嗘垚鏈�佹绱㈡椂寤剁瓑鏂归潰鐨勬渶浣冲疄璺�',
+ },
+ {
+ ID: 3,
+ Name: '鑷畾涔�',
+ ImageURL: 'static/images/knowledge/data_type_4.png',
+ DemoDesc: '瀹屽叏寮�鏀剧殑绂荤嚎鐭ヨ瘑搴撻厤缃紝鎸夌収妫�绱㈤渶姹傝嚜鐢遍厤缃紝鑾峰緱鎺ㄧ悊鏁堟灉鍜屾椂寤舵柟闈㈢殑涓嶅悓浣撻獙',
+ },
+ ], //閰嶇疆妯″紡
+ segmentationList: [
+ {
+ ID: 1,
+ Name: '鏅鸿兘鍒囧垎',
+ ImageURL: 'static/images/knowledge/data_type_3.png',
+ DemoDesc: '鍦ㄩ�氱敤鏂囨。涓婄殑鏈�浼榗hunk鍒囧垎鏂规硶锛岀粡杩囪瘎娴嬪彲鍦ㄥ鏁版枃妗ｄ笂鑾峰緱鏈�浣崇殑妫�绱㈡晥鏋�',
+ },
+ {
+ ID: 3,
+ Name: '鑷畾涔夊垏鍒�',
+ ImageURL: 'static/images/knowledge/data_type_4.png',
+ DemoDesc: '瀹屽叏寮�鏀剧殑chunk鍒囧垎閰嶇疆锛屾寜鐓у疄闄呮枃妗ｆ儏鍐佃嚜鐢遍厤缃紝閫氳繃璋冭瘯鑾峰緱鏇村ソ鐨勬绱㈡晥鏋�',
+ },
],
+ modeList: [
+ {
+ ID: 1,
+ Name: '澶氳疆瀵硅瘽鏀瑰啓',
+ NameFn: '寮�鍚�',
+ NameOrder: null,
+ NameFnWidthStyle: '380px',
+ },
+ {
+ ID: 2,
+ Name: 'Embedding妯″瀷',
+ NameFn: '瀹樻柟鍚戦噺',
+ NameOrder: null,
+ NameFnWidthStyle: '380px',
+ },
+ {
+ ID: 3,
+ Name: '鎺掑簭閰嶇疆',
+ NameFn: 'Rank妯″瀷',
+ NameOrder: '瀹樻柟鎺掑簭',
+ NameFnWidthStyle: '148px',
+ },
+ {
+ ID: 4,
+ Name: '',
+ NameFn: '鐩镐技搴﹂槇鍊�',
+ NameOrder: null,
+ NameFnWidthStyle: '148px',
+ },
+ ],
+ showKnowledgeForm: false,
+ knowledgeBaseData: [], //鐭ヨ瘑搴撶被鐩�
+ fileData: [], //鏂囦欢鏁版嵁婧�
+ isCreateIndex: false, //鏄惁璋冪敤鍒涘缓鐨勭储寮曠殑瀛楁
+ knowlg_id: '',
+ groupKnow_id: null,
});
-const fileList = ref<UploadUserFile[]>([]);
+//楠岃瘉scope瀛楁鍙兘杈撳叆姝ｆ暣鏁�
+const validateNumber = (rule, value, callback) => {
+ if (value < 31) {
+ callback(new Error('璇疯緭鍏ュぇ浜�30鐨勬鏁存暟'));
+ } else {
+ state.knowledgeForm.scope = verifiyNumberInteger(value);
+ callback();
+ }
+};
+const knowledgeFormRules = reactive<FormRules>({
+ title: [
+ {
+ required: true,
+ message: '蹇呭～椤�',
+ trigger: 'blur',
+ },
+ ],
+ prompt: [
+ {
+ required: true,
+ message: '蹇呭～椤�',
+ trigger: 'blur',
+ },
+ ],
+ scope: [{ validator: validateNumber, trigger: 'blur' }],
+});
+const knowledgeFormRef = ref();
const router = useRouter();
+
+//#region ====================== 鐭ヨ瘑搴撹〃鍗曟搷浣� ======================
//杩斿洖
const handleExitFlow = () => {
//鏄惁鏄剧ず杩斿洖
router.back();
+ //娓呯┖琛ㄥ崟
+ knowledgeFormRef.value.resetFields();
+ state.showKnowledgeForm = false;
+ state.isCreateIndex = false;
};
-//纭
-const onSubmit = () => {};
+//閫夋嫨鏁版嵁绫诲瀷
+const activeDataType = (id: number) => {
+ state.knowledgeForm.dataType = id;
+};
+//閫夋嫨閰嶇疆妯″紡
+const activeConfigurationType = (id: number) => {
+ state.knowledgeForm.configurationMode = id;
+};
+//閫夋嫨鏁版嵁鏂囨。鍒囧垎
+const activeDataProcessType = (id: number) => {
+ state.knowledgeForm.segmentationMode = id;
+};
+//涓嬩竴姝�
+const nextKnowledge = async () => {
+ const valid = await knowledgeFormRef.value.validate().catch(() => {});
+ if (!valid) return;
+ state.showKnowledgeForm = true;
+ if (!state.isCreateIndex) {
+ emptyKnowledgeBase();
+ state.isCreateIndex = true;
+ }
+};
+const backKnowledge = () => {
+ state.showKnowledgeForm = false;
+ state.isCreateIndex = true;
+};
+
+//#endregion
+//#region ====================== 绌虹煡璇嗗簱鐨勫垱寤� ======================
+
+//鍒涘缓涓�涓┖鐭ヨ瘑搴�
+const emptyKnowledgeBase = async () => {
+ const valid = await knowledgeFormRef.value.validate().catch(() => {});
+ if (!valid) return;
+ var currentTime = moment().format('YYYY-MM-DD HH:mm:ss');
+ const res = await add_docvector_name({
+ title: state.knowledgeForm.title,
+ prompt: state.knowledgeForm.prompt,
+ scope: state.knowledgeForm.scope,
+ group_id: state.groupKnow_id,
+ });
+ if (res.json_ok) {
+ state.knowlg_id = res.knowlg_id;
+ let obj = {
+ id: state.knowlg_id,
+ group_id: state.groupKnow_id,
+ title: state.knowledgeForm.title,
+ prompt: state.knowledgeForm.prompt,
+ publish: 'N',
+ create_time: currentTime,
+ user_name: '',
+ scope: state.knowledgeForm.scope,
+ };
+ mittBus.emit('addEmptyKnowledge', obj);
+ getFileTreeData(true);
+ state.isCreateIndex = false;
+ }
+};
+//瀵煎叆瀹屾垚
+const importCompleted = async () => {
+ var currentTime = moment().format('YYYY-MM-DD HH:mm:ss');
+ // 涓婁紶鏂囦欢
+ if (multipleSelection.value.length == 0) return ElMessage.warning('璇峰厛閫夋嫨鏂囦欢');
+ const file_id = multipleSelection.value.map((v) => v.id).join(',');
+ const res = await add_docvector_file({
+ knowlg_id: state.knowlg_id,
+ file_id: file_id,
+ });
+ if (res.json_ok) {
+ let obj = {
+ id: state.knowlg_id,
+ group_id: state.groupKnow_id,
+ title: state.knowledgeForm.title,
+ prompt: state.knowledgeForm.prompt,
+ publish: 'N',
+ create_time: currentTime,
+ user_name: '',
+ scope: state.knowledgeForm.scope,
+ };
+ mittBus.emit('updateKnowledgeBaseObj', obj);
+ router.push({ name: 'Knowledge' });
+ //娓呯┖琛ㄥ崟
+ knowledgeFormRef.value.resetFields();
+ state.showKnowledgeForm = false;
+ state.isCreateIndex = false;
+ }
+};
+//#endregion
+//#region ====================== 鐭ヨ瘑搴撴枃浠朵笂浼� ==========
+const currentTreeNode = ref(null);
+const leftTreeRef = ref(null);
+const currentListID = computed(() => currentTreeNode.value?.group_id);
+//鑾峰彇鏂囦欢鍒楄〃
+const getFileTreeData = async (selectFirst = false) => {
+ const res = await get_knowledge_group_list();
+ if (res?.json_ok) {
+ const resData = (res.groups || []) as [];
+ const byParentData = convertListToTree(resData, {
+ ID: 'group_id',
+ Children: 'Children',
+ ParentID: 'p_group_id',
+ });
+ const result = [];
+ byParentData.forEach((item) => {
+ if (item.group_type == OptClassificationMap[classificationEnum.Knowledge]) {
+ result.push(item);
+ }
+ });
+ state.knowledgeBaseData = result;
+ if (selectFirst) {
+ const firstListTreeNode = state.knowledgeBaseData[0];
+ if (firstListTreeNode) {
+ handleClickNode(firstListTreeNode);
+ } else {
+ state.fileData = [];
+ multipleSelection.value = [];
+ }
+ } else {
+ currentTreeNode.value && handleClickNode(currentTreeNode.value);
+ }
+ }
+};
+const handleClickNode = (data: any) => {
+ multipleSelection.value = [];
+ nextTick(() => {
+ leftTreeRef.value?.treeRef.setCurrentKey(data.group_id);
+ });
+ currentTreeNode.value = data;
+ getFileTableData();
+};
+//鑾峰彇鏂囦欢琛ㄦ牸鍒楄〃
+const getFileTableData = async () => {
+ const res = await list_knowledge_file({
+ group_id: currentListID.value,
+ }).finally(() => {});
+ if (res?.json_ok) {
+ const resData = (res.values || []) as [];
+ state.fileData = resData;
+ } else {
+ ElMessage.error('鑾峰彇鏂囨。鍒楄〃澶辫触' + (res?.json_msg ? `锛�${JSON.stringify(res.json_msg)}` : ''));
+ }
+};
+let multipleSelection = ref([]);
+const multipleTableRef = ref(null);
+//琛ㄦ牸鍗曢�夊拰澶氶��
+const handleSelectAll = (selection: any[], pageSelectionData: any[]) => {
+ let checked = selection.length ? true : false; // selection涓虹┖鏁扮粍鏃朵唬琛ㄥ彇娑堝叏閫�
+ if (checked) {
+ let mIds = multipleSelection.value.map((v) => v.id);
+ let filterData = pageSelectionData.filter((v) => {
+ // 绛涢�夊嚭闈為噸澶嶉」
+ return !mIds.includes(v.id);
+ });
+ multipleSelection.value = multipleSelection.value.concat(filterData);
+ } else {
+ let pIds = pageSelectionData.map((v) => v.id);
+ multipleSelection.value = multipleSelection.value.filter((v) => !pIds.includes(v.id));
+ }
+};
+
+const handleSelectItem = (selection: any[], row) => {
+ multipleSelection.value = selection;
+};
+// 绉婚櫎宸查�夋枃浠�
+const handleRemoveItem = (item) => {
+ multipleSelection.value = multipleSelection.value.filter((v) => v.id !== item.id);
+ multipleTableRef.value.toggleRowSelection(item, false);
+};
+//#endregion
+onMounted(() => {
+ const group_id = route.query.group_id;
+ state.groupKnow_id = group_id;
+});
</script>
<style scoped lang="scss">
.set-form-height {
- height: calc(100% - 62px);
background: #fff;
- border-radius: 16px 16px 0 0;
+ border-radius: 12px 12px 0 0;
flex: 1;
- margin: 0 24px 64px;
+ margin: 0 24px;
overflow-y: auto;
- padding: 20px;
+ padding: 20px 16px;
+ height: 100%;
}
.set-desc {
-webkit-line-clamp: 2;
@@ -149,10 +566,92 @@
gap: 8px;
height: 64px;
padding-left: 24px;
- position: fixed;
+ // 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;
+}
+.set-file-height {
+ height: calc(100% - 48px);
+}
+.set_file_left {
+ border: 1px solid #e7e8ee;
+ border-radius: 12px;
+ flex: 1;
+ padding: 12px 16px 16px;
+ box-sizing: border-box;
+ .left_content {
+ align-items: flex-start;
+ display: flex;
+ gap: 12px;
+ height: calc(100% - 29px);
+ .file_menu {
+ flex-shrink: 0;
+ height: 100%;
+ overflow-y: auto;
+ border: 1px solid #e7e8ee;
+ border-radius: 6px;
+ max-height: 627px;
+ padding: 20px;
+ width: 280px;
+ }
+ .file_table {
+ flex-shrink: 0;
+ height: 100%;
+ overflow-y: auto;
+ border-radius: 8px 8px 0 0;
+ flex: 1;
+ }
+ }
+}
+.set_file_right {
+ border: 1px solid #e7e8ee;
+ border-radius: 6px;
+ flex-shrink: 0;
+ height: 100%;
+ padding: 12px 16px 16px;
+ width: 417px;
+ min-height: 360px;
+}
+.selected_file {
+ max-height: calc(100% - 36px);
+ overflow-y: auto;
+ box-sizing: border-box;
+ .set_file_item {
+ align-items: center;
+ background: linear-gradient(0deg, #f7f8fe, #f7f8fe), #fff;
+ border-radius: 8px;
+ display: flex;
+ font-size: 12px;
+ gap: 8px;
+ height: 40px;
+ justify-content: space-between;
+ padding: 0 16px;
+ margin-bottom: 9px;
+ .set_file_name {
+ max-width: calc(100% - 22px);
+ }
+ .set_file_close {
+ color: #878aab;
+ cursor: pointer;
+ flex-shrink: 0;
+ font-size: 14px;
+ align-items: center;
+ display: inline-flex;
+ justify-content: center;
+ }
+ }
+}
</style>
<style>
.set_tooltip_demo {
--
Gitblit v1.9.3