From 7df64634d3d7b292713eebfa008c40b3f5f9f65f Mon Sep 17 00:00:00 2001
From: shj <1790240199@qq.com>
Date: 星期二, 20 九月 2022 15:57:03 +0800
Subject: [PATCH] 修改

---
 src/components/DailogSearchUser/index.vue |  223 +++++++++++++++++++++++++++----------------------------
 1 files changed, 108 insertions(+), 115 deletions(-)

diff --git a/src/components/DailogSearchUser/index.vue b/src/components/DailogSearchUser/index.vue
index a1e722b..7345d2e 100644
--- a/src/components/DailogSearchUser/index.vue
+++ b/src/components/DailogSearchUser/index.vue
@@ -4,57 +4,56 @@
 		<el-row>
 			<el-col :span="6">
 				<div class="userTree">
-					<el-input v-model="names" placeholder="请输入组织机构过滤"></el-input>
+					<el-input v-model="filterText" placeholder="请输入组织机构过滤"></el-input>
 					<div class="tree">
-						<el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" />
+						<el-tree ref="treeRef" :data="data" :props="propse" @node-click="handleNodeClick" :filter-node-method="filterNode" />
 					</div>
 				</div>
 			</el-col>
 			<el-col :span="14" style="padding: 20px">
 				<el-form ref="ruleFormRef" :model="ruleForm" status-icon>
 					<el-row>
-						<el-col :span="10" :offset="1">
+						<!-- <el-col :span="10" :offset="1">
 							<el-form-item size="default">
 								<el-input v-model="ruleForm.pass" placeholder="登录名" />
 							</el-form-item>
-						</el-col>
+						</el-col> -->
 						<el-col :span="8" :offset="1">
 							<el-form-item>
-								<el-button size="default" type="primary" @click="submitForm(ruleFormRef)">查询</el-button>
-								<el-button size="default" @click="resetForm(ruleFormRef)">重置</el-button>
+								<!-- <el-button size="default" type="primary" >查询</el-button> -->
+								<el-button size="default" @click="clear">清除选择</el-button>
 							</el-form-item>
 						</el-col>
 					</el-row>
 				</el-form>
-				<el-table :data="tableData" style="width: 100%; margin-top: 20px" @cell-click="radio">
-					<el-table-column align="center">
+				<el-table :data="tableData" style="width: 100%; margin-top: 20px" ref="clearAll"  @selection-change="handleSelectionChange">
+				<el-table-column type="selection" width="55" v-if="types==0"/>
+					<el-table-column align="center"  v-if="types!=0">
 						<template #default="scope">
 							<el-radio-group v-model="radio1">
-								<el-radio :label="scope.row.id" size="large">{{ null }}</el-radio>
+								<el-radio :label="scope.row.uid" @click="radio(scope.row)" size="large">{{ null }}</el-radio>
 							</el-radio-group>
 						</template>
 					</el-table-column>
-					<el-table-column align="center" prop="date" label="登录名" />
-					<el-table-column align="center" prop="name" label="用户名" />
+					<el-table-column align="center" prop="realName" label="登录名" />
+					<el-table-column align="center" prop="username" label="用户名" />
 					<el-table-column align="center" prop="address" label="所属机构" />
 					<el-table-column align="center" prop="address" label="所属部门" />
-					<el-table-column align="center" prop="address" label="状态" />
+					<el-table-column align="center" prop="type" label="状态" />
 				</el-table>
 				<el-pagination
 					style="padding: 20px 0; border-bottom: 1px solid #dedede"
 					v-model:currentPage="currentPage4"
 					v-model:page-size="pageSize4"
-					:page-sizes="[100, 200, 300, 400]"
-					:small="small"
-					:disabled="disabled"
-					:background="background"
+					:page-sizes="[10, 20, 30, 40]"
 					layout="total, sizes, prev, pager, next, jumper"
-					:total="400"
+					:total="total"
 					@size-change="handleSizeChange"
 					@current-change="handleCurrentChange"
 				/>
 			</el-col>
 			<el-col :span="4">
+			<div v-if="dynamicTags[0]==''?false:true">
 				<el-tag
 					v-for="tag in dynamicTags"
 					:key="tag"
@@ -64,8 +63,9 @@
 					:disable-transitions="false"
 					@close="handleClose(tag)"
 				>
-					{{ tag.name }}
+					{{ tag.realName }}
 				</el-tag>
+				</div>
 			</el-col>
 		</el-row>
 		<template #footer>
@@ -77,77 +77,62 @@
 	</el-dialog>
 </template>
 <script lang="ts">
-import { defineComponent, ref, reactive } from 'vue';
+import { defineComponent, ref, onMounted, reactive, watch } from 'vue';
 import { FullScreen } from '@element-plus/icons-vue';
+import { ElMessageBox, ElTree, ElMessage, ElButton, ElInput, TabsPaneContext } from 'element-plus';
+import { goalManagementApi } from '/@/api/goalManagement';
 interface Tree {
 	label: string;
 	children?: Tree[];
 }
 export default defineComponent({
-	setup(props,{emit}) {
-		//左边树形部分
+	setup(props, { emit }) {
+		//部门树
+		const department = () => {
+			goalManagementApi()
+				.getTreedepartment()
+				.then((res) => {
+					if (res.data.code == 200) {
+						data.value = res.data.data;
+					} else {
+						ElMessage.error(res.data.msg);
+					}
+				});
+		};
+		const propse = {
+			label: 'depName',
+			children: 'children',
+			value: 'depId',
+		};
+		//部门树查询
+		const filterText = ref('');
+		const treeRef = ref<InstanceType<typeof ElTree>>();
+		watch(filterText, (val) => {
+			treeRef.value!.filter(val);
+		});
+		const filterNode = (depName: string, data: Tree) => {
+			if (!depName) return true;
+			return data.depName.includes(depName);
+		};
+		onMounted(() => {
+			department();
+		});
+		//左边树形部分点击获取回调
 		const names = ref<any>();
 		const handleNodeClick = (data: Tree) => {
-			console.log(data);
+			goalManagementApi()
+				.getManName(data.depId)
+				.then((res) => {
+					if (res.data.code == 200) {
+						tableData.value=res.data.data
+						total.value=tableData.value.length
+					}else{
+						ElMessage.error(res.data.msg);
+					}
+				});
 		};
 
-		const data: Tree[] = [
-			{
-				label: 'Level one 1',
-				children: [
-					{
-						label: 'Level two 1-1',
-						children: [
-							{
-								label: 'Level three 1-1-1',
-							},
-						],
-					},
-				],
-			},
-			{
-				label: 'Level one 2',
-				children: [
-					{
-						label: 'Level two 2-1',
-						children: [
-							{
-								label: 'Level three 2-1-1',
-							},
-						],
-					},
-					{
-						label: 'Level two 2-2',
-						children: [
-							{
-								label: 'Level three 2-2-1',
-							},
-						],
-					},
-				],
-			},
-			{
-				label: 'Level one 3',
-				children: [
-					{
-						label: 'Level two 3-1',
-						children: [
-							{
-								label: 'Level three 3-1-1',
-							},
-						],
-					},
-					{
-						label: 'Level two 3-2',
-						children: [
-							{
-								label: 'Level three 3-2-1',
-							},
-						],
-					},
-				],
-			},
-		];
+		const data = ref();
 		//中间表格
 		// 搜索条件
 		const ruleForm = reactive({
@@ -155,49 +140,36 @@
 			checkPass: '',
 		});
 		// 表格
-		const tableData = [
-			{   id:1,
-				date: '2016-05-03',
-				name: 'Tom',
-				address: 'No. 189, Grove St, Los Angeles',
-			},
-			{	
-				id:2,
-				date: '2016-05-02',
-				name: 'Tom',
-				address: 'No. 189, Grove St, Los Angeles',
-			},
-			{	id:3,
-				date: '2016-05-04',
-				name: 'Tom',
-				address: 'No. 189, Grove St, Los Angeles',
-			},
-			{	id:4,
-				date: '2016-05-01',
-				name: 'Tom',
-				address: 'No. 189, Grove St, Los Angeles',
-			},
-		];
-		const pageSize4 = ref(100);
+		const tableData = ref();
+		const currentPage4 = ref(1);
+		const pageSize4 = ref(10);
+		const total=ref()
 		const handleSizeChange = (val: number) => {
-			console.log(`${val} items per page`);
+			// console.log(`${val} items per page`);
+			pageSize4.value=val
 		};
 		const handleCurrentChange = (val: number) => {
-			console.log(`current page: ${val}`);
+			// console.log(`current page: ${val}`);
+			currentPage4.value=val
 		};
-	// 右方点击添加后显示标签
+		// 右方点击添加后显示标签
 		const dynamicTags = ref(['']);
-		const handleClose = (tag: string) => {
+		const handleClose = (tag: any) => {
 			dynamicTags.value.splice(dynamicTags.value.indexOf(tag), 1);
 			radio1.value = '';
 		};
 		const radio1 = ref('');
-		const radio = (event: any) => {
-			dynamicTags.value[0] = event;
+		const radio = (data: any) => {
+			dynamicTags.value[0] = data;
 		};
+		const handleSelectionChange = (val:any) => {
+             dynamicTags.value=val
+        }
+		const types=ref()
 		// 开启弹窗
 		const dialogVisible = ref(false);
-		const openDailog = () => {
+		const openDailog = (type:any) => {
+			types.value=type
 			dialogVisible.value = true;
 		};
 		//全屏
@@ -209,12 +181,31 @@
 				full.value = false;
 			}
 		};
-		const submitForm=()=>{
-			let obj=JSON.parse(JSON.stringify(dynamicTags.value))
-			emit("SearchUser",obj[0])
-			dialogVisible.value = false
+		const submitForm = () => {
+			if(types.value==0){
+				emit('SearchUser', dynamicTags.value,types.value);
+			}else {
+				emit('SearchUser', dynamicTags.value[0],types.value);
+			}
+
+			dialogVisible.value = false;
+			clear()
+		};
+		const clearAll=ref()
+		const clear=()=>{
+           dynamicTags.value=[]
+		   radio1.value=""
+		  clearAll.value.clearSelection()
 		}
 		return {
+			clear,
+			clearAll,
+			total,
+			types,
+			filterText,
+			treeRef,
+			filterNode,
+			propse,
 			dialogVisible,
 			names,
 			data,
@@ -222,9 +213,11 @@
 			openDailog,
 			ruleForm,
 			tableData,
+			currentPage4,
 			pageSize4,
 			handleSizeChange,
 			handleCurrentChange,
+			handleSelectionChange,
 			radio1,
 			dynamicTags,
 			handleClose,
@@ -232,7 +225,7 @@
 			full,
 			toggleFullscreen,
 			radio,
-			submitForm
+			submitForm,
 		};
 	},
 });

--
Gitblit v1.9.2