agilebuilder-ui 1.1.36 → 1.1.37-sit1

package/packages/department-tree-inline/src/department-multi-tree-inline.vue

@@ -1,112 +1,96 @@
 <template>
-	<div>
-		<el-container style="height: 395px">
-			<el-aside width="350px">
-				<el-container style="height: 390px">
-					<el-header style="text-align: right; font-size: 12px; height: 35px">
-						<el-autocomplete
-								v-model="filterText"
-								:fetch-suggestions="querySearch"
-								:placeholder="
-                $t('departmentTreeInline.pleaseEnterDepartmentName')
-              "
-								class="inline-input inline-input-custom"
-								size="default"
-								@select="handleSelect"
-								@keyup.enter="clickSearch"
-						>
-							<template v-slot:append>
-								<el-button
-										:icon="ElIconSearch"
-										size="default"
-										@click="clickSearch"
-								/>
-							</template>
-						</el-autocomplete>
-					</el-header>
-					<el-main style="padding: 10px">
-						<div
-								v-if="!searchValue"
-								style="
-                padding-top: 5px;
-                overflow: auto;
-                width: 100%;
-                display: inline-block !important;
-              "
-						>
-							<el-tree
-									ref="deparmentTree"
-									:filter-node-method="filterNode"
-									:load="loadNode"
-									:props="defaultProps"
-									:show-checkbox="true"
-									check-strictly
-									lazy
-									node-key="id"
-									@check="handleCheckNode"
-									@check-change="handleCheckChange"
-									@node-expand="handleNodeExpand"
-									@node-click="handleNodeClick"
-							>
-								<template #default="{ node, data }">
-									<span>
-										<el-icon>
-											<Menu v-if="node.data.id === -1 || node.data.branch"/>
-										  <Tickets v-else-if="node.data.id === -2 || node.data.id === -3"/>
-											<Calendar v-else/>
-										</el-icon>
-										<span :title="node.label">
-											{{ node.label }}
-										</span>
-									</span>
-								</template>
-							</el-tree>
-						</div>
+  <div>
+    <el-container style="height: 395px">
+      <el-aside width="350px">
+        <el-container style="height: 390px">
+          <el-header style="text-align: right; font-size: 12px; height: 35px">
+            <el-autocomplete
+              v-model="filterText"
+              :fetch-suggestions="querySearch"
+              :placeholder="$t('departmentTreeInline.pleaseEnterDepartmentName')"
+              class="inline-input inline-input-custom"
+              size="default"
+              @select="handleSelect"
+              @keyup.enter="clickSearch"
+            >
+              <template v-slot:append>
+                <el-button :icon="ElIconSearch" size="default" @click="clickSearch" />
+              </template>
+            </el-autocomplete>
+          </el-header>
+          <el-main style="padding: 10px">
+            <div
+              v-if="!searchValue"
+              style="padding-top: 5px; overflow: auto; width: 100%; display: inline-block !important"
+            >
+              <el-tree
+                ref="deparmentTree"
+                :filter-node-method="filterNode"
+                :load="loadNode"
+                :props="defaultProps"
+                :show-checkbox="true"
+                check-strictly
+                lazy
+                node-key="id"
+                @check="handleCheckNode"
+                @check-change="handleCheckChange"
+                @node-expand="handleNodeExpand"
+                @node-click="handleNodeClick"
+              >
+                <template #default="{ node, data }">
+                  <span>
+                    <el-icon>
+                      <Menu v-if="node.data.id === -1 || node.data.branch" />
+                      <Tickets v-else-if="node.data.id === -2 || node.data.id === -3" />
+                      <Calendar v-else />
+                    </el-icon>
+                    <span :title="node.label">
+                      {{ node.label }}
+                    </span>
+                  </span>
+                </template>
+              </el-tree>
+            </div>
 
-						<div
-								v-if="searchValue && searchValue.length > 0"
-								style="height: 100%; overflow: hidden"
-						>
-							<user-result
-									:grid-data="searchResult"
-									:height="height"
-									:is-search-result="true"
-									:multiple="true"
-									:select-result="selectResult"
-									@addUser="selectUser"
-							/>
-						</div>
-					</el-main>
-				</el-container>
-			</el-aside>
+            <div v-if="searchValue && searchValue.length > 0" style="height: 100%; overflow: hidden">
+              <user-result
+                :grid-data="searchResult"
+                :height="height"
+                :is-search-result="true"
+                :multiple="true"
+                :select-result="selectResult"
+                @addUser="selectUser"
+              />
+            </div>
+          </el-main>
+        </el-container>
+      </el-aside>
 
-			<el-container>
-				<!-- <el-aside width="2px">
+      <el-container>
+        <!-- <el-aside width="2px">
 								<table border="1px" cellpadding="0" cellspacing="0" style="height:100%;border-left-style:solid; border-bottom-style:none;border-right-style:none;border-top-style:none;border-left-color: #cccccc" />
 							</el-aside> -->
-				<el-main style="padding: 10px">
-					<div style="text-align: left; font-size: 16px">
-						{{ $t('departmentTreeInline.selectedDept') }}:
-					</div>
-					<div :style="'padding-top: 5px;height:90%;overflow: hidden;'">
-						<user-result
-								v-loading="isloading"
-								:grid-data="selectResult"
-								:height="height"
-								:is-search-result="false"
-								:multiple="true"
-								@removeUser="removeUser"
-						/>
-					</div>
-				</el-main>
-			</el-container>
-		</el-container>
-	</div>
+        <el-main style="padding: 10px">
+          <div style="text-align: left; font-size: 16px">{{ $t('departmentTreeInline.selectedDept') }}:</div>
+          <div :style="'padding-top: 5px;height:90%;overflow: hidden;'">
+            <user-result
+              v-loading="isloading"
+              :grid-data="selectResult"
+              :height="height"
+              :is-search-result="false"
+              :multiple="true"
+              @removeUser="removeUser"
+            />
+          </div>
+        </el-main>
+      </el-container>
+    </el-container>
+  </div>
 </template>
 
 <script>
-import {Search as ElIconSearch} from '@element-plus/icons-vue'
-import {$emit} from '../../utils/gogocodeTransfer'
+import { Search as ElIconSearch } from '@element-plus/icons-vue'
+import { $emit } from '../../utils/gogocodeTransfer'
 import localStorage from '../../../src/utils/local-storage'
 import utils from '../../utils/utils'
 import departmentTreeService from './department-tree-service'
@@ -114,381 +98,366 @@ import UserResult from './search-result.vue'
 import memoryCacheUtils from '../../utils/memory-cache-utils'
 
 export default {
-	data() {
-		return {
-			filterText: '',
-			defaultProps: {
-				id: 'id',
-				label: 'showName',
-				children: 'childDepartments',
-				isLeaf: 'leaf',
-			},
-			searchParam: {
-				searchValue: null,
-				treeType: 'DEPARTMENT_TREE',
-				departmentInfo: null,
-			},
-			count: 0,
-			// 当前租户内是否包含分支机构。获得当前选中部门名称时，如果有分支，则需要将分支名称返回给用户，例如：部门1(分支1)
-			containBranch: false,
-			// 公司节点的id
-			tenantNodeId: -1,
-			// 用于保存所有查询出的节点id
-			allSearchNodeIds: [],
-			// 用于保存allSearchNodeIds中所有已加载子节点的id集合
-			allExpandNodeIds: [],
-			isClickNode: false,
-			// 查询的备选值
-			restaurants: [],
-			// 查询条件
-			searchValue: null,
-			searchStoreKey: 'searchDepartment',
-			// 单选时，选择的部门信息
-			selectNodeInfo: null,
-			// 公司根节点信息
-			tenantInfo: {},
-			searchResult: [],
-			selectResult: [],
-			// 控制右侧选择区的loading状态
-			isloading: false,
-			multiple: true,
-			memoryCacheKey: 'DEPARTMENT_MEMORY_KEY',
-			// 记忆选择数据, 搜索框获得焦点后，下拉显示最近选中的10个人，倒序排列，最后选中的在最上面显示。
-			memoryCacheData: [],
-			ElIconSearch,
-		}
-	},
-	name: 'InlineDepartmentMultiTree',
-	components: {
-		UserResult,
-	},
-	props: {
-		checkStrictly: {
-			type: Boolean,
-			default: false,
-		},
-		// 显示指定部门节点及其子节点，不传该属性，表示显示整个组织结构树
-		departmentInfo: {
-			type: Array,
-			default: null,
-		},
-		// 弹框的高度
-		height: {
-			type: String,
-			default: '300px',
-		},
-		// 多选部门树时，已选择部门id或部门名称或编码集合，多个之间以逗号隔开
-		selectDepartmentInfo: {
-			type: [String, Number],
-			default: null,
-		},
-		// 移除部门时，部门属性名称：id、name、code，默认是id
-		searchField: {
-			type: String,
-			default: 'id',
-		},
-		// 多选树时结果之间的分隔符，默认是逗号分隔
-		separator: {
-			type: String,
-			default: ',',
-		},
-	},
-	computed: {},
-	watch: {
-		filterText(val) {
-			if (!val) {
-				this.searchValue = val
-				// 清空查询内容时，重新加载整个树
-				if (this.departmentInfo && this.departmentInfo.length > 0) {
-					// 加载指定部门时，展开公司节点
-					this.loadPointDepartments()
-				} else {
-					// 加载整个组织结构树时，展开公司节点
-					this.loadDepartment(this.tenantNodeId)
-				}
-			}
-		},
-	},
-	created() {
-		this.initSelectDepts(
-				this.searchField,
-				this.selectDepartmentInfo,
-				this.separator
-		).then((selectUsers) => {
-			if (selectUsers) {
-				this.selectResult = selectUsers
-			}
-		})
-	},
-	mounted() {
-		var searchDepartment = localStorage.getObject(this.searchStoreKey)
-		if (searchDepartment) {
-			this.restaurants = searchDepartment
-		} else {
-			this.restaurants = []
-		}
-		this.getMemoryCacheData('department')
-	},
-	methods: {
-		...utils,
-		...departmentTreeService,
-		...memoryCacheUtils,
-		filterNode(value, data, node) {
-			if (!value) {
-				return true
-			} else {
-				return data.name.indexOf(value) !== -1
-			}
-		},
-		// 选中当前节点及其子节点
-		checkedNodeAndChildren(data) {
-			// 取消选中状态时，保持节点是展开的状态，不要折叠
-			// this.$refs.deparmentTree.store.nodesMap[data.id].expanded = true
-			let department = data
-			if (data.data) {
-				department = JSON.parse(data.data)
-			}
-			this.selectUser(null, department)
-			// 获得所有应该选中的节点
-			this.$refs.deparmentTree.setChecked(data.id, true)
-			const childDepartments = data.childDepartments
-			if (childDepartments && !this.checkStrictly) {
-				// 递归设置子子节点的选中状态
-				childDepartments.forEach((nodeData) => {
-					this.checkedNodeAndChildren(nodeData)
-				})
-			}
-		},
-		// 取消当前节点的子节点的选中状态
-		cancelChildCheckedNodes(data) {
-			const department = JSON.parse(data.data)
-			this.selectResult = this.removeRow(this.selectResult, department)
-			if (data.id !== this.tenantNodeId) {
-				// 如果当前节点不是公司节点，需要将公司节点的选中状态去掉
-				this.$refs.deparmentTree.setChecked(this.tenantNodeId, false)
-			}
-			const childDepartments = data.childDepartments
-			if (childDepartments && !this.checkStrictly) {
-				childDepartments.forEach((nodeData) => {
-					// 取消节点的选中状态
-					this.$refs.deparmentTree.setChecked(nodeData.id, false)
-					// 递归取消子子节点的选中状态
-					this.cancelChildCheckedNodes(nodeData)
-				})
-			}
-		},
-		handleCheckChange(data, checked, indeterminate) {
-		},
-		handleNodeExpand(data, node, nodeTree) {
-		},
-		handleNodeClick(data, node, nodeTree) {
-			// 多选部门树时，处理点击节点事件
-			this.clickNodeWhenMultiple(data)
-		},
-		// 多选树时，点击节点处理复选框的选中状态
-		clickNodeWhenMultiple(data) {
-			var checkedKeys = []
-			if (this.$refs.deparmentTree) {
-				checkedKeys = this.$refs.deparmentTree.getCheckedKeys()
-			}
-			if (checkedKeys && checkedKeys.indexOf(data.id) > -1) {
-				// 表示当前节点是选中状态，则需要取消其选中状态
-				// 取消当前节点的勾选状态
-				this.$refs.deparmentTree.setChecked(data.id, false)
-				// 取消当前节点的子节点的勾选状态
-				if (!this.checkStrictly) {
-					this.cancelChildCheckedNodes(data)
-				}
-				// 取消选中状态时，保持节点是展开的状态，不要折叠
-				this.$refs.deparmentTree.store.nodesMap[data.id].expanded = true
-			} else {
-				// 表示当前节点不是选中的状态，需要勾选该节点
-				if (data.nodeType && data.nodeType === 'DEPARTMENT' && data.data) {
-					// 表示当前选中的节点是部门
-					const department = JSON.parse(data.data)
-					this.selectUser(null, department)
-				}
-				this.$refs.deparmentTree.setChecked(data.id, true)
-				// 点击树节点时添加并展开节点会走loadNode方法，因为设置了树组件的expand-on-click-node属性为true
-				const children = data.childDepartments
-				if (children && children.length > 0) {
-					// 表示加载过该节点，直接选中即可
-					if (!this.checkStrictly) {
-						this.checkedNodeAndChildren(data)
-					}
-				} else {
-					// 表示没有加载过该节点，是首次加载，需要走后台
-					// 会走loadNode方法，因为设置了树组件的expand-on-click-node属性为true
-					this.isClickNode = true
-				}
-			}
-		},
-		isDepartmentNode(data) {
-			// 当前节点不是公司节点，也不是分支机构节点，表示是部门节点
-			return (
-					data.id !== this.tenantNodeId &&
-					data.nodeType &&
-					data.nodeType === 'DEPARTMENT' &&
-					!data.branch
-			)
-		},
-		selectDepartment() {
-			// 是否需要显示提示框，默认不显示
-			var showTip = false
-			var leafSelectNodeInfo = {
-				ids: [],
-				names: [],
-				codes: [],
-				zhNames: [],
-				enNames: [],
-				departments: [],
-			}
-			if (this.selectResult.length === 0) {
-				// 没有选择任何节点
-				showTip = true
-			} else {
-				for (var i = 0; i < this.selectResult.length; i++) {
-					var userData = this.selectResult[i]
-					// 不存在该用户则放到结果集合中，去掉重复使用
-					leafSelectNodeInfo.ids.push(userData.id)
-					leafSelectNodeInfo.codes.push(userData.code)
-					if (userData.enName) {
-						leafSelectNodeInfo.enNames.push(userData.enName)
-					} else {
-						leafSelectNodeInfo.enNames.push('')
-					}
-					if (userData.department) {
-						leafSelectNodeInfo.departments.push(userData.department)
-					} else {
-						leafSelectNodeInfo.departments.push(userData)
-					}
-					const name = userData.showName
-					leafSelectNodeInfo.names.push(name)
-					leafSelectNodeInfo.zhNames.push(userData.name)
-				}
-			}
-			if (leafSelectNodeInfo.ids.length > 0) {
-				leafSelectNodeInfo.containBranch = this.containBranch
-				$emit(this, 'result', leafSelectNodeInfo)
-			} else {
-				showTip = true
-			}
-			if (showTip) {
-				this.$alert(
-						this.$t('imatrixUIMessage.pleaseSelectDepartment'),
-						this.$t('imatrixUIMessage.tips'),
-						{
-							confirmButtonText: this.$t('imatrixUIPublicModel.sure'),
-						}
-				)
-			}
-		},
-		// 是否选中了公司节点
-		isSelectTenantNode(dataId) {
-			return (
-					dataId === this.tenantNodeId &&
-					(!this.departmentInfo || this.departmentInfo.length === 0)
-			)
-		},
-		// 给节点添加自定义图标
-		// renderContent(h, {node, data, store}) {
-		// 	var className
-		// 	if (node.data.id === -1 || node.data.branch) {
-		// 		// node.id ===-1表示公司节点，node.branch表示是分支机构节点
-		// 		className = 'Menu'
-		// 	} else if (node.data.id === -2 || node.data.id === -3) {
-		// 		// node.id ===-2表示集团公司无部门用户节点,node.id ===-3表示是分支机构无部门用户节点
-		// 		className = 'Tickets'
-		// 	} else {
-		// 		// 表示是部门节点
-		// 		className = 'Date'
-		// 	}
-		// 	return h(
-		// 			'span',
-		// 			h('el-icon', h(className)),
-		// 			h('span', {title: node.label}, node.label)
-		// 	)
-		// 	// return (
-		// 	//   `<span>
-		// 	//     <i class={className}></i>
-		// 	//     <span title={node.label}>{node.label}</span>
-		// 	//   </span>`
-		// 	// )
-		// },
-		// 将查询结果中指定用户添加到已选择用户集合中
-		selectUser(index, dept) {
-			// if (!this.isContainAllUser()) {
-			const containUsers = this.selectResult.filter(this.filterDept(dept))
-			if (containUsers && containUsers.length === 0) {
-				// 如果已选结果中不包含当前用户，则添加
-				// 将查询结果中的用户复制到已选择用户集合中
-				dept.tenantCode = this.tenantInfo.code
-				dept.tenantName = this.tenantInfo.tenantName
-				this.selectResult.push(dept)
-				// 搜索选中记忆
-				this.setMemoryCacheData(dept, 'department')
-			}
-			// } else {
-			//   this.alertByAllUser()
-			// }
-		},
-		// 判断用户是否存在的过滤器
-		filterDept(queryDept) {
-			return (dept) => {
-				return dept.id === queryDept.id
-			}
-		},
-		filterDeptNode(queryDept) {
-			return (deptNodeId) => {
-				return deptNodeId + '' === queryDept.id + ''
-			}
-		},
-		// 从已选择用户集合中移除指定用户，并添加到查询结果集合中
-		removeUser(index, dept) {
-			// 表示是在组织结构树页面，需要将树的人员节点的选中状态去掉
-			if (dept.nodeId) {
-				const nodeId = dept.nodeId
-				if (this.$refs.deparmentTree && nodeId) {
-					this.$refs.deparmentTree.setChecked(nodeId, false)
-				}
-			} else {
-				if (this.$refs.deparmentTree) {
-					// 通过查询结果添加的用户，在返回到组织结构树时，也选中了该用户，在移除该用户时，需要去掉复选框的选中状态
-					const checkedKeys = this.$refs.deparmentTree.getCheckedKeys()
-					const currentCheckedUserNodeIds = checkedKeys.filter(
-							this.filterDeptNode(dept)
-					)
-					if (currentCheckedUserNodeIds.length > 0) {
-						// 表示当前用户是选中的状态，需要去掉
-						currentCheckedUserNodeIds.forEach((userNodeId) => {
-							this.$refs.deparmentTree.setChecked(userNodeId, false)
-						})
-					}
-				}
-			}
-			this.selectResult = this.removeRow(this.selectResult, dept)
-			if (!this.selectResult || this.selectResult.length === 0) {
-				// 已选结果面板没有内容，则左侧树节点也不要有选中节点了
-				if (this.$refs.deparmentTree) {
-					this.$refs.deparmentTree.setCheckedKeys([])
-				}
-			}
-		},
-	},
-	emits: ['result'],
+  data() {
+    return {
+      filterText: '',
+      defaultProps: {
+        id: 'id',
+        label: 'showName',
+        children: 'childDepartments',
+        isLeaf: 'leaf'
+      },
+      searchParam: {
+        searchValue: null,
+        treeType: 'DEPARTMENT_TREE',
+        departmentInfo: null
+      },
+      count: 0,
+      // 当前租户内是否包含分支机构。获得当前选中部门名称时，如果有分支，则需要将分支名称返回给用户，例如：部门1(分支1)
+      containBranch: false,
+      // 公司节点的id
+      tenantNodeId: -1,
+      // 用于保存所有查询出的节点id
+      allSearchNodeIds: [],
+      // 用于保存allSearchNodeIds中所有已加载子节点的id集合
+      allExpandNodeIds: [],
+      isClickNode: false,
+      // 查询的备选值
+      restaurants: [],
+      // 查询条件
+      searchValue: null,
+      searchStoreKey: 'searchDepartment',
+      // 单选时，选择的部门信息
+      selectNodeInfo: null,
+      // 公司根节点信息
+      tenantInfo: {},
+      searchResult: [],
+      selectResult: [],
+      // 控制右侧选择区的loading状态
+      isloading: false,
+      multiple: true,
+      memoryCacheKey: 'DEPARTMENT_MEMORY_KEY',
+      // 记忆选择数据, 搜索框获得焦点后，下拉显示最近选中的10个人，倒序排列，最后选中的在最上面显示。
+      memoryCacheData: [],
+      ElIconSearch
+    }
+  },
+  name: 'InlineDepartmentMultiTree',
+  components: {
+    UserResult
+  },
+  props: {
+    checkStrictly: {
+      type: Boolean,
+      default: false
+    },
+    // 显示指定部门节点及其子节点，不传该属性，表示显示整个组织结构树
+    departmentInfo: {
+      type: Array,
+      default: null
+    },
+    // 弹框的高度
+    height: {
+      type: String,
+      default: '300px'
+    },
+    // 多选部门树时，已选择部门id或部门名称或编码集合，多个之间以逗号隔开
+    selectDepartmentInfo: {
+      type: [String, Number],
+      default: null
+    },
+    // 移除部门时，部门属性名称：id、name、code，默认是id
+    searchField: {
+      type: String,
+      default: 'id'
+    },
+    // 多选树时结果之间的分隔符，默认是逗号分隔
+    separator: {
+      type: String,
+      default: ','
+    },
+    // 根据变量限制部门时，根据部门表的哪个字段进行过滤，默认是code
+    limitFilterColumn: {
+      type: String,
+      default: 'code'
+    }
+  },
+  computed: {},
+  watch: {
+    filterText(val) {
+      if (!val) {
+        this.searchValue = val
+        // 清空查询内容时，重新加载整个树
+        if (this.departmentInfo && this.departmentInfo.length > 0) {
+          // 加载指定部门时，展开公司节点
+          this.loadPointDepartments()
+        } else {
+          // 加载整个组织结构树时，展开公司节点
+          this.loadDepartment(this.tenantNodeId)
+        }
+      }
+    }
+  },
+  created() {
+    this.initSelectDepts(this.searchField, this.selectDepartmentInfo, this.separator).then((selectUsers) => {
+      if (selectUsers) {
+        this.selectResult = selectUsers
+      }
+    })
+  },
+  mounted() {
+    var searchDepartment = localStorage.getObject(this.searchStoreKey)
+    if (searchDepartment) {
+      this.restaurants = searchDepartment
+    } else {
+      this.restaurants = []
+    }
+    this.getMemoryCacheData('department')
+  },
+  methods: {
+    ...utils,
+    ...departmentTreeService,
+    ...memoryCacheUtils,
+    filterNode(value, data, node) {
+      if (!value) {
+        return true
+      } else {
+        return data.name.indexOf(value) !== -1
+      }
+    },
+    // 选中当前节点及其子节点
+    checkedNodeAndChildren(data) {
+      // 取消选中状态时，保持节点是展开的状态，不要折叠
+      // this.$refs.deparmentTree.store.nodesMap[data.id].expanded = true
+      let department = data
+      if (data.data) {
+        department = JSON.parse(data.data)
+      }
+      this.selectUser(null, department)
+      // 获得所有应该选中的节点
+      this.$refs.deparmentTree.setChecked(data.id, true)
+      const childDepartments = data.childDepartments
+      if (childDepartments && !this.checkStrictly) {
+        // 递归设置子子节点的选中状态
+        childDepartments.forEach((nodeData) => {
+          this.checkedNodeAndChildren(nodeData)
+        })
+      }
+    },
+    // 取消当前节点的子节点的选中状态
+    cancelChildCheckedNodes(data) {
+      const department = JSON.parse(data.data)
+      this.selectResult = this.removeRow(this.selectResult, department)
+      if (data.id !== this.tenantNodeId) {
+        // 如果当前节点不是公司节点，需要将公司节点的选中状态去掉
+        this.$refs.deparmentTree.setChecked(this.tenantNodeId, false)
+      }
+      const childDepartments = data.childDepartments
+      if (childDepartments && !this.checkStrictly) {
+        childDepartments.forEach((nodeData) => {
+          // 取消节点的选中状态
+          this.$refs.deparmentTree.setChecked(nodeData.id, false)
+          // 递归取消子子节点的选中状态
+          this.cancelChildCheckedNodes(nodeData)
+        })
+      }
+    },
+    handleCheckChange(data, checked, indeterminate) {},
+    handleNodeExpand(data, node, nodeTree) {},
+    handleNodeClick(data, node, nodeTree) {
+      // 多选部门树时，处理点击节点事件
+      this.clickNodeWhenMultiple(data)
+    },
+    // 多选树时，点击节点处理复选框的选中状态
+    clickNodeWhenMultiple(data) {
+      var checkedKeys = []
+      if (this.$refs.deparmentTree) {
+        checkedKeys = this.$refs.deparmentTree.getCheckedKeys()
+      }
+      if (checkedKeys && checkedKeys.indexOf(data.id) > -1) {
+        // 表示当前节点是选中状态，则需要取消其选中状态
+        // 取消当前节点的勾选状态
+        this.$refs.deparmentTree.setChecked(data.id, false)
+        // 取消当前节点的子节点的勾选状态
+        if (!this.checkStrictly) {
+          this.cancelChildCheckedNodes(data)
+        }
+        // 取消选中状态时，保持节点是展开的状态，不要折叠
+        this.$refs.deparmentTree.store.nodesMap[data.id].expanded = true
+      } else {
+        // 表示当前节点不是选中的状态，需要勾选该节点
+        if (data.nodeType && data.nodeType === 'DEPARTMENT' && data.data) {
+          // 表示当前选中的节点是部门
+          const department = JSON.parse(data.data)
+          this.selectUser(null, department)
+        }
+        this.$refs.deparmentTree.setChecked(data.id, true)
+        // 点击树节点时添加并展开节点会走loadNode方法，因为设置了树组件的expand-on-click-node属性为true
+        const children = data.childDepartments
+        if (children && children.length > 0) {
+          // 表示加载过该节点，直接选中即可
+          if (!this.checkStrictly) {
+            this.checkedNodeAndChildren(data)
+          }
+        } else {
+          // 表示没有加载过该节点，是首次加载，需要走后台
+          // 会走loadNode方法，因为设置了树组件的expand-on-click-node属性为true
+          this.isClickNode = true
+        }
+      }
+    },
+    isDepartmentNode(data) {
+      // 当前节点不是公司节点，也不是分支机构节点，表示是部门节点
+      return data.id !== this.tenantNodeId && data.nodeType && data.nodeType === 'DEPARTMENT' && !data.branch
+    },
+    selectDepartment() {
+      // 是否需要显示提示框，默认不显示
+      var showTip = false
+      var leafSelectNodeInfo = {
+        ids: [],
+        names: [],
+        codes: [],
+        zhNames: [],
+        enNames: [],
+        departments: []
+      }
+      if (this.selectResult.length === 0) {
+        // 没有选择任何节点
+        showTip = true
+      } else {
+        for (var i = 0; i < this.selectResult.length; i++) {
+          var userData = this.selectResult[i]
+          // 不存在该用户则放到结果集合中，去掉重复使用
+          leafSelectNodeInfo.ids.push(userData.id)
+          leafSelectNodeInfo.codes.push(userData.code)
+          if (userData.enName) {
+            leafSelectNodeInfo.enNames.push(userData.enName)
+          } else {
+            leafSelectNodeInfo.enNames.push('')
+          }
+          if (userData.department) {
+            leafSelectNodeInfo.departments.push(userData.department)
+          } else {
+            leafSelectNodeInfo.departments.push(userData)
+          }
+          const name = userData.showName
+          leafSelectNodeInfo.names.push(name)
+          leafSelectNodeInfo.zhNames.push(userData.name)
+        }
+      }
+      if (leafSelectNodeInfo.ids.length > 0) {
+        leafSelectNodeInfo.containBranch = this.containBranch
+        $emit(this, 'result', leafSelectNodeInfo)
+      } else {
+        showTip = true
+      }
+      if (showTip) {
+        this.$alert(this.$t('imatrixUIMessage.pleaseSelectDepartment'), this.$t('imatrixUIMessage.tips'), {
+          confirmButtonText: this.$t('imatrixUIPublicModel.sure')
+        })
+      }
+    },
+    // 是否选中了公司节点
+    isSelectTenantNode(dataId) {
+      return dataId === this.tenantNodeId && (!this.departmentInfo || this.departmentInfo.length === 0)
+    },
+    // 给节点添加自定义图标
+    // renderContent(h, {node, data, store}) {
+    // 	var className
+    // 	if (node.data.id === -1 || node.data.branch) {
+    // 		// node.id ===-1表示公司节点，node.branch表示是分支机构节点
+    // 		className = 'Menu'
+    // 	} else if (node.data.id === -2 || node.data.id === -3) {
+    // 		// node.id ===-2表示集团公司无部门用户节点,node.id ===-3表示是分支机构无部门用户节点
+    // 		className = 'Tickets'
+    // 	} else {
+    // 		// 表示是部门节点
+    // 		className = 'Date'
+    // 	}
+    // 	return h(
+    // 			'span',
+    // 			h('el-icon', h(className)),
+    // 			h('span', {title: node.label}, node.label)
+    // 	)
+    // 	// return (
+    // 	//   `<span>
+    // 	//     <i class={className}></i>
+    // 	//     <span title={node.label}>{node.label}</span>
+    // 	//   </span>`
+    // 	// )
+    // },
+    // 将查询结果中指定用户添加到已选择用户集合中
+    selectUser(index, dept) {
+      // if (!this.isContainAllUser()) {
+      const containUsers = this.selectResult.filter(this.filterDept(dept))
+      if (containUsers && containUsers.length === 0) {
+        // 如果已选结果中不包含当前用户，则添加
+        // 将查询结果中的用户复制到已选择用户集合中
+        dept.tenantCode = this.tenantInfo.code
+        dept.tenantName = this.tenantInfo.tenantName
+        this.selectResult.push(dept)
+        // 搜索选中记忆
+        this.setMemoryCacheData(dept, 'department')
+      }
+      // } else {
+      //   this.alertByAllUser()
+      // }
+    },
+    // 判断用户是否存在的过滤器
+    filterDept(queryDept) {
+      return (dept) => {
+        return dept.id === queryDept.id
+      }
+    },
+    filterDeptNode(queryDept) {
+      return (deptNodeId) => {
+        return deptNodeId + '' === queryDept.id + ''
+      }
+    },
+    // 从已选择用户集合中移除指定用户，并添加到查询结果集合中
+    removeUser(index, dept) {
+      // 表示是在组织结构树页面，需要将树的人员节点的选中状态去掉
+      if (dept.nodeId) {
+        const nodeId = dept.nodeId
+        if (this.$refs.deparmentTree && nodeId) {
+          this.$refs.deparmentTree.setChecked(nodeId, false)
+        }
+      } else {
+        if (this.$refs.deparmentTree) {
+          // 通过查询结果添加的用户，在返回到组织结构树时，也选中了该用户，在移除该用户时，需要去掉复选框的选中状态
+          const checkedKeys = this.$refs.deparmentTree.getCheckedKeys()
+          const currentCheckedUserNodeIds = checkedKeys.filter(this.filterDeptNode(dept))
+          if (currentCheckedUserNodeIds.length > 0) {
+            // 表示当前用户是选中的状态，需要去掉
+            currentCheckedUserNodeIds.forEach((userNodeId) => {
+              this.$refs.deparmentTree.setChecked(userNodeId, false)
+            })
+          }
+        }
+      }
+      this.selectResult = this.removeRow(this.selectResult, dept)
+      if (!this.selectResult || this.selectResult.length === 0) {
+        // 已选结果面板没有内容，则左侧树节点也不要有选中节点了
+        if (this.$refs.deparmentTree) {
+          this.$refs.deparmentTree.setCheckedKeys([])
+        }
+      }
+    }
+  },
+  emits: ['result']
 }
 </script>
 
 <style>
 .searchResult {
-	color: red;
+  color: red;
 }
 
 .inline-input-custom {
-	width: 90%;
+  width: 90%;
 }
 
 .el-autocomplete-suggestion.el-popper {
-	min-width: 300px;
+  min-width: 300px;
 }
 </style>