From bd7247878bf5258bf5c1f9deefbfa6c9ade066e3 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期四, 05 九月 2024 15:38:10 +0800
Subject: [PATCH] Merge branch 'master' of http://47.103.154.90:83/r/WI/Web.Admin.V1.0

---
 src/views/project/yw/dataManage/knowledge/AddKnowledge.vue |  250 +++++++++++++++++++++++++++++++++++++++++++++++--
 1 files changed, 239 insertions(+), 11 deletions(-)

diff --git a/src/views/project/yw/dataManage/knowledge/AddKnowledge.vue b/src/views/project/yw/dataManage/knowledge/AddKnowledge.vue
index c2f84ac..c15c905 100644
--- a/src/views/project/yw/dataManage/knowledge/AddKnowledge.vue
+++ b/src/views/project/yw/dataManage/knowledge/AddKnowledge.vue
@@ -113,19 +113,70 @@
 				: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="{
+										children: 'Children',
+										label: 'title',
+										id: 'id',
+									}"
+									@click="handleClickNode"
+								>
+								</LeftTreeByMgr>
+							</div>
+							<div class="file_table">
+								<el-table
+									:data="state.fileData"
+									border
+									@select="handleSelectItem"
+									highlight-current-row
+									ref="multipleTableRef"
+									:class="{ 'hidden-checkbox-all': state.isRadio }"
+									@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="閰嶇疆妯″紡:">
+				<el-form-item label="鏂囨。鍒囧垎chunk:">
 					<div class="flex-auto flex flex-col">
 						<div class="flex">
-							<div v-for="(item, index) in state.configurationList" :key="index">
+							<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.configurationMode === item.ID }"
+									:class="{ activeColor: state.knowledgeForm.segmentationMode === item.ID }"
 									@click="activeConfigurationType(item.ID)"
 								>
 									<div class="flex items-center">
@@ -133,7 +184,7 @@
 											<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">
+											<el-radio v-model="state.knowledgeForm.segmentationMode" size="large" :label="item.ID">
 												<span class="font-[500] text[16px]">{{ item.Name }}</span>
 											</el-radio>
 
@@ -168,10 +219,13 @@
 <script setup lang="ts">
 import { ElMessage, type FormRules } from 'element-plus';
 import moment from 'moment';
-import { reactive, ref } from 'vue';
+import { computed, nextTick, reactive, ref } from 'vue';
 import { useRouter } from 'vue-router';
 import { 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 { convertListToTree } from '/@/utils/util';
 // 瀹氫箟鍙橀噺鍐呭
 const state = reactive({
 	soliderValue: 0,
@@ -181,6 +235,7 @@
 		prompt: '',
 		dataType: 1,
 		configurationMode: 1,
+		segmentationMode: 1,
 	},
 	knowledgeFile: {},
 	dataTypeList: [
@@ -196,7 +251,7 @@
 			ImageURL: 'static/images/knowledge/data_type_2.png',
 			DemoDesc: '閫夋嫨鏁版嵁绠$悊鍔熻兘涓凡鍒涘缓鐨勬暟鎹〃',
 		},
-	],
+	], //鏁版嵁绫诲瀷
 	configurationList: [
 		{
 			ID: 1,
@@ -209,6 +264,20 @@
 			Name: '鑷畾涔�',
 			ImageURL: 'static/images/knowledge/data_type_4.png',
 			DemoDesc: '瀹屽叏寮�鏀剧殑绂荤嚎鐭ヨ瘑搴撻厤缃紝鎸夌収妫�绱㈤渶姹傝嚜鐢遍厤缃紝鑾峰緱鎺ㄧ悊鏁堟灉鍜屾椂寤舵柟闈㈢殑涓嶅悓浣撻獙',
+		},
+	], //閰嶇疆妯″紡
+	segmentationList: [
+		{
+			ID: 1,
+			Name: '鏅鸿兘鍒囧垎',
+			ImageURL: 'static/images/knowledge/data_type_3.png',
+			DemoDesc: '鍦ㄩ�氱敤鏂囨。涓婄殑鏈�浼榗hunk鍒囧垎鏂规硶锛岀粡杩囪瘎娴嬪彲鍦ㄥ鏁版枃妗d笂鑾峰緱鏈�浣崇殑妫�绱㈡晥鏋�',
+		},
+		{
+			ID: 3,
+			Name: '鑷畾涔夊垏鍒�',
+			ImageURL: 'static/images/knowledge/data_type_4.png',
+			DemoDesc: '瀹屽叏寮�鏀剧殑chunk鍒囧垎閰嶇疆锛屾寜鐓у疄闄呮枃妗f儏鍐佃嚜鐢遍厤缃紝閫氳繃璋冭瘯鑾峰緱鏇村ソ鐨勬绱㈡晥鏋�',
 		},
 	],
 	modeList: [
@@ -242,6 +311,9 @@
 		},
 	],
 	showKnowledgeForm: false,
+	knowledgeBaseData: [], //鐭ヨ瘑搴撶被鐩�
+	fileData: [], //鏂囦欢鏁版嵁婧�
+	isRadio: false, //鏄惁鍗曢��
 });
 const knowledgeFormRules = reactive<FormRules>({
 	title: [
@@ -261,6 +333,8 @@
 });
 const knowledgeFormRef = ref();
 const router = useRouter();
+
+//#region ====================== 鐭ヨ瘑搴撹〃鍗曟搷浣� ======================
 //杩斿洖
 const handleExitFlow = () => {
 	//鏄惁鏄剧ず杩斿洖
@@ -282,10 +356,14 @@
 	const valid = await knowledgeFormRef.value.validate().catch(() => {});
 	if (!valid) return;
 	state.showKnowledgeForm = true;
+	getFileTreeData(true);
 };
 const backKnowledge = () => {
 	state.showKnowledgeForm = false;
 };
+//#endregion
+//#region ====================== 绌虹煡璇嗗簱鐨勫垱寤� ======================
+
 //鍒涘缓涓�涓┖鐭ヨ瘑搴�
 const emptyKnowledgeBase = async () => {
 	var currentTime = moment().format('YYYY-MM-DD HH:mm:ss');
@@ -306,11 +384,91 @@
 		router.push({ name: 'Knowledge' });
 	}
 };
+//瀵煎叆瀹屾垚
 const importCompleted = () => {
 	return;
 	ElMessage.success('瀵煎叆瀹屾垚');
 	router.push({ name: 'Knowledge' });
 };
+//#endregion
+//#region ====================== 鐭ヨ瘑搴撴枃浠朵笂浼� ==========
+const treeLoading = ref(false);
+const currentTreeNode = ref(null);
+const leftTreeRef = ref(null);
+const currentListID = computed(() => currentTreeNode.value?.id);
+//鑾峰彇鏂囦欢鍒楄〃
+const getFileTreeData = async (selectFirst = false) => {
+	treeLoading.value = true;
+	const res = await get_knowledge_group_list().finally(() => {
+		treeLoading.value = false;
+	});
+	if (res?.json_ok) {
+		const resData = (res.values || []) as [];
+		state.knowledgeBaseData = convertListToTree(resData, {
+			ID: 'id',
+			Children: 'Children',
+			ParentID: 'parent',
+		});
+		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.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
 </script>
 <style scoped lang="scss">
 .set-form-height {
@@ -357,10 +515,80 @@
 	margin-top: 12px;
 	padding: 16px 24px;
 }
-.slider-demo-block {
-	max-width: 600px;
-	display: flex;
-	align-items: center;
+.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;
+		}
+	}
+}
+.hidden-checkbox-all :deep(.el-table__header .el-table-column--selection .el-checkbox) {
+	// 闅愯棌鍏ㄩ�塩heckbox
+	display: none;
 }
 </style>
 <style>

--
Gitblit v1.9.3