agilebuilder-ui 1.0.92 → 1.0.93-temp2

package/packages/organization-input/src/organization-input.vue

@@ -2,81 +2,79 @@
   <span style="width: 100%">
     <template v-if="disabled">
       <el-input
-		      :disabled="true"
-		      :model-value="value"
-		      :readonly="true"
-		      :size="size"
-		      type="text"
-			  :placeholder="$t('imatrixUIMessage.pleaseSelect')"
+        :disabled="true"
+        :model-value="value"
+        :readonly="true"
+        :size="size"
+        type="text"
+        :placeholder="$t('imatrixUIMessage.pleaseSelect')"
       >
         <template v-slot:append>
-	        <el-icon v-slot:suffix class="el-input__icon"><el-icon-search/></el-icon>
-	        <el-icon v-slot:suffix class="el-input__icon"><el-icon-delete/></el-icon>
+          <el-icon v-slot:suffix class="el-input__icon"><el-icon-search /></el-icon>
+          <el-icon v-slot:suffix class="el-input__icon"><el-icon-delete /></el-icon>
         </template>
       </el-input>
     </template>
     <template v-else>
       <el-input
-		      :model-value="value"
-		      :readonly="true"
-		      :size="size"
-		      type="text"
-			  :placeholder="$t('imatrixUIMessage.pleaseSelect')"
-		      @click="showOrganizationTree(false)"
-			  @change="changeEvent"
+        :model-value="value"
+        :readonly="true"
+        :size="size"
+        type="text"
+        :placeholder="$t('imatrixUIMessage.pleaseSelect')"
+        @click="showOrganizationTree(false)"
+        @change="changeEvent"
       >
         <template v-slot:append>
-          <el-icon class="el-input__icon" @click="showOrganizationTree(false)"><el-icon-search/></el-icon>
-          <el-icon class="el-input__icon" @click="emptyOrganizationResult()"><el-icon-delete/></el-icon>
+          <el-icon class="el-input__icon" @click="showOrganizationTree(false)"><el-icon-search /></el-icon>
+          <el-icon class="el-input__icon" @click="emptyOrganizationResult()"><el-icon-delete /></el-icon>
         </template>
       </el-input>
     </template>
-	  <!-- 部门人员树 -->
+    <!-- 部门人员树 -->
     <department-user-tree
-		    v-if="treeType && treeType === 'DeptUserTree' && showOrganizationTreeFlag"
-		    :department-info="departmentInfo"
-		    :multiple="typeof multiple === 'undefined' ? false : multiple"
-		    :search-field="searchField"
-		    :select-user-info="selectOrganizationInfo"
-		    :separator="separator"
-		    @close="closeOrganizationTree"
+      v-if="treeType && treeType === 'DeptUserTree' && showOrganizationTreeFlag"
+      :department-info="departmentInfo"
+      :multiple="typeof multiple === 'undefined' ? false : multiple"
+      :search-field="searchField"
+      :select-user-info="selectOrganizationInfo"
+      :separator="separator"
+      @close="closeOrganizationTree"
     />
-	  <!-- 部门树 -->
+    <!-- 部门树 -->
     <department-tree
-		    v-if="treeType && treeType === 'DeptTree' && showOrganizationTreeFlag"
-		    :check-strictly="
-        typeof checkStrictly === 'undefined' ? false : checkStrictly
-      "
-		    :multiple="typeof multiple === 'undefined' ? false : multiple"
-		    :search-field="searchField"
-		    :select-department-info="selectOrganizationInfo"
-		    :separator="separator"
-		    width="30%"
-		    @close="closeOrganizationTree"
+      v-if="treeType && treeType === 'DeptTree' && showOrganizationTreeFlag"
+      :check-strictly="typeof checkStrictly === 'undefined' ? false : checkStrictly"
+      :multiple="typeof multiple === 'undefined' ? false : multiple"
+      :search-field="searchField"
+      :select-department-info="selectOrganizationInfo"
+      :separator="separator"
+      width="30%"
+      @close="closeOrganizationTree"
     />
-	  <!-- 工作组树 -->
+    <!-- 工作组树 -->
     <workgroup-tree
-		    v-if="treeType && treeType === 'WgTree' && showOrganizationTreeFlag"
-		    :multiple="typeof multiple === 'undefined' ? false : multiple"
-		    :branch-info="departmentInfo"
-		    :search-field="searchField"
-		    :select-workgroup-info="selectOrganizationInfo"
-		    :separator="separator"
-		    width="30%"
-		    @close="closeOrganizationTree"
+      v-if="treeType && treeType === 'WgTree' && showOrganizationTreeFlag"
+      :multiple="typeof multiple === 'undefined' ? false : multiple"
+      :branch-info="departmentInfo"
+      :search-field="searchField"
+      :select-workgroup-info="selectOrganizationInfo"
+      :separator="separator"
+      width="30%"
+      @close="closeOrganizationTree"
     />
-	  <!-- 工作组人员树 -->
+    <!-- 工作组人员树 -->
     <workgroup-user-tree
-		    v-if="treeType && treeType === 'WgUserTree' && showOrganizationTreeFlag"
-		    :branch-info="departmentInfo"
-		    :multiple="typeof multiple === 'undefined' ? false : multiple"
-		    :search-field="searchField"
-		    :select-user-info="selectOrganizationInfo"
-		    :separator="separator"
-		    width="30%"
-		    @close="closeOrganizationTree"
+      v-if="treeType && treeType === 'WgUserTree' && showOrganizationTreeFlag"
+      :branch-info="departmentInfo"
+      :multiple="typeof multiple === 'undefined' ? false : multiple"
+      :search-field="searchField"
+      :select-user-info="selectOrganizationInfo"
+      :separator="separator"
+      width="30%"
+      @close="closeOrganizationTree"
     />
-	  <!-- <remove-user
+    <!-- <remove-user
 						v-if="treeType && (treeType === 'DeptUserTree' || treeType === 'WgUserTree') && showRemoveComponent"
 						:select-user-info="selectOrganizationInfo"
 						:search-field="searchField"
@@ -90,7 +88,7 @@
 						:separator="separator"
 						@close="closeRemoveComponent"
 					/> -->
-	  <!-- <remove-workgroup
+    <!-- <remove-workgroup
 						v-if="treeType && treeType === 'WgTree' && showRemoveComponent"
 						:select-workgroup-info="selectOrganizationInfo"
 						:search-field="searchField"
@@ -101,494 +99,447 @@
 </template>
 
 <script>
-import {Delete as ElIconDelete, Search as ElIconSearch,} from '@element-plus/icons-vue'
+import { Delete as ElIconDelete, Search as ElIconSearch } from '@element-plus/icons-vue'
 // import Vue from 'vue'
-import {getPropNameWhenJoinTable, setEntityFieldValue,} from '../../../src/utils/util'
+import { getPropNameWhenJoinTable, setEntityFieldValue } from '../../../src/utils/util'
 
 export default {
-	components: {
-		ElIconSearch,
-		ElIconDelete,
-	},
-	name: 'OrganizationInput',
-	model: {
-		prop: 'value',
-		event: 'input',
-	},
-	props: {
-		value: {
-			type: String,
-			default: '',
-		},
-		// 是否多选
-		multiple: {
-			type: Boolean,
-			default: false,
-		},
-		// 是否 “不选中” 子部门
-		checkStrictly: {
-			type: Boolean,
-			default: false,
-		},
-		// 树类型 部门人员树DeptUserTree、部门树DeptTree、工作组树WgTree、工作组人员树WgUserTree
-		treeType: {
-			type: String,
-			default: 'DeptUserTree',
-		},
-		// 是否禁用
-		disabled: {
-			type: Boolean,
-			default: false,
-		},
-		// 字段与组织结构对应信息集合，格式为：[{type:'loginName',model:'字段名'}]
-		// 人员树时，type的可选值有：id、name、loginName、email、telephone、mainDeptName、mainDeptId、subCompanyName、subCompanyId
-		// 部门/工作组树时：type的可选值有：id、name、code
-		fields: {
-			type: Array,
-			default: null,
-		},
-		// 当前表单数据信息
-		models: {
-			type: Object,
-			default: null,
-		},
-		// 文本框大小large/medium/small/mini
-		size: {
-			type: String,
-			default: '',
-		},
-		// 列表组件行编辑使用，sql查询时数据表名称，用于自定义系统中列表组件中字段多表查询带有别名时，将点"."改成两个下划线"__"时使用
-		tableName: {
-			type: String,
-			default: null,
-		},
-		// 列表组件行编辑使用，是否是关联表，用于确定属性名是否需要拼接tableName
-		isJoinTable: {
-			type: Boolean,
-			default: false,
-		},
-		// 指定部门或者工作组
-		departmentInfo: {
-			type: Array,
-			default: null,
-		},
-		// 多选树时结果之间的分隔符，默认是逗号分隔
-		separator: {
-			type: String,
-			default: ',',
-		},
-			// 是否打开树
-		openTree:{
-				type: Boolean,
-				default: true,
-		}
-	},
-	data() {
-		return {
-			showOrganizationTreeFlag: false, // 选择组织树所用
-			isAppendResult: false, // 是否添加用户、部门、工作组，默认是替换，false表示替换选择的结果，true表示追加选择的结果
-			showRemoveComponent: false, // 实现显示移除用户、部门、工作组组件
-			selectOrganizationInfo: null, // 已选择集合，多个信息之间以逗号隔开
-			searchField: null, // 已选的集合是什么内容，id、loginName(登录名)、name(用户名称/部门名称/工作组名称)、code(部门编码/工作组编码)、email(邮箱)、telephone(电话)等等
-			selectOrganizationAllInfo: {}, // 选择的所有信息,{id:'xx',name:'xx',loginName:'xx',code:'xx',email:'xx',telephone:'xx'}
-		}
-	},
-	created() {
-	},
-	methods: {
-		// change事件
-		changeEvent(value) {
-			this.$emit('change', value)
-		},
-		// 打开组织树
-		showOrganizationTree() {
-				if (this.openTree){
-						let isMulti = this.multiple
-						if (typeof isMulti === 'undefined') {
-								isMulti = false
-						}
-						if (isMulti === true) {
-								// 多选时才需要显示结果集合
-								this.getSelectInfo()
-						}
-						this.$emit('focus')
-						this.showOrganizationTreeFlag = true
-						this.$emit('show-tree')
-				}
-		},
-		getPropName(prop, isJoinTable, tableName) {
-			return getPropNameWhenJoinTable(prop, isJoinTable, tableName)
-		},
-		// 清空已选的结果
-		emptyOrganizationResult() {
-			const orgFields = this.fields
-			if (orgFields && orgFields.length > 0) {
-				orgFields.forEach((orgField) => {
-					// orgDataType的值：
-					// 人员时：id、name、loginName、email、telephone
-					// 部门或工作组时：id、name
-					const model = this.getPropName(orgField.model)
-					this.setValue(model, null)
-				})
-				this.selectOrganizationAllInfo = {}
-				this.selectOrganizationInfo = null
-				this.searchField = null
-			}
-		},
-		// 关闭组织树
-		closeOrganizationTree(selectNodeInfo) {
-			if (selectNodeInfo) {
-				// 是否是多选树
-				this.setOrganizationData(selectNodeInfo)
-			}
-			this.showOrganizationTreeFlag = false
-		},
-		setOrganizationData(orgData, isRemove, removeItems) {
-			let isMulti = this.multiple
-			if (typeof isMulti === 'undefined') {
-				isMulti = false
-			}
-			const treeType = this.treeType
-			const orgFields = this.fields
-			if (orgFields && orgFields.length > 0) {
-				orgFields.forEach((orgField) => {
-					// orgDataType的值：
-					// 人员时：id、name、loginName、email、telephone
-					// 部门或工作组时：id、name、code
-					const orgDataType = orgField.type
-					const orgSelectData = this.getOrgSelectData(
-							orgDataType,
-							orgData,
-							this.isUserTree(treeType),
-							isMulti
-					)
-					const model = this.getPropName(orgField.model)
-					this.getOrgDataModel(
-							model,
-							orgSelectData,
-							isMulti,
-							orgDataType,
-							isRemove,
-							removeItems
-					)
-				})
-			}
-		},
-		/**
-		 * @param orgDataType 字段属性：id、name、loginName、code、email、telephone
-		 */
-		getOrgDataModel(
-				model,
-				orgSelectData,
-				isMulti,
-				orgDataType,
-				isRemove,
-				removeItems
-		) {
-			if (isMulti) {
-				// 表示是替换或添加操作
-				const orgResult = this.getModelValue(model)
-				// 表示替换结果
-				this.selectOrganizationAllInfo[orgDataType] = orgSelectData
-				this.setValue(model, orgSelectData)
-				// 参数分别为：属性名、原来的值、新替换的值
-				this.$emit('replace', model, orgResult, orgSelectData)
-			} else {
-				this.setValue(model, orgSelectData)
-			}
-		},
-		getModelValue(model) {
-			let modelValue = ''
-			if (this.isJoinTable === false && model && model.indexOf('.') > 0) {
-				const parentObj = this.getParentObject(model, this.models)
-				modelValue = parentObj[model.substring(model.lastIndexOf('.') + 1)]
-			} else {
-				model = this.getPropName(model)
-				modelValue = this.models[model]
-			}
-			return modelValue
-		},
-		// 是否是人员树
-		isUserTree(treeType) {
-			return treeType === 'DeptUserTree' || treeType === 'WgUserTree'
-		},
-		// 获得组织树选择的结果
-		getOrgSelectData(orgDataType, selectNodeInfo, isUserTree, isMulti) {
-			if (isMulti === true) {
-				// 多选树时
-				if (orgDataType === 'id') {
-					if (isUserTree) {
-						return selectNodeInfo.userIds.join(this.separator)
-					} else {
-						return selectNodeInfo.ids.join(this.separator)
-					}
-				} else if (orgDataType === 'name') {
-					if (isUserTree) {
-						return selectNodeInfo.userNames.join(this.separator)
-					} else {
-						return selectNodeInfo.names.join(this.separator)
-					}
-				} else if (orgDataType === 'code') {
-					if (!isUserTree) {
-						return selectNodeInfo.codes.join(this.separator)
-					}
-				} else if (orgDataType === 'loginName') {
-					return selectNodeInfo.loginNames.join(this.separator)
-				} else if (orgDataType === 'email') {
-					return selectNodeInfo.emails.join(this.separator)
-				} else if (orgDataType === 'telephone') {
-					return selectNodeInfo.telephones.join(this.separator)
-				} else if (orgDataType === 'mainDeptName') {
-					// 正职部门名称
-					const mainDeptNames = []
-					if (isUserTree) {
-						const users = selectNodeInfo.users
-						if (users) {
-							users.forEach((user) => {
-								mainDeptNames.push(user.mainDepartmentName)
-							})
-						}
-					}
-					return mainDeptNames.join(this.separator)
-				} else if (orgDataType === 'mainDeptId') {
-					// 正职部门id
-					const mainDeptIds = []
-					if (isUserTree) {
-						const users = selectNodeInfo.users
-						if (users) {
-							users.forEach((user) => {
-								if (user.mainDepartmentId) {
-									mainDeptIds.push(user.mainDepartmentId)
-								}
-							})
-						}
-					}
-					return mainDeptIds.join(this.separator)
-				} else if (orgDataType === 'mainDeptCode') {
-					// 正职部门code
-					const mainDeptCodes = []
-					if (isUserTree) {
-						const users = selectNodeInfo.users
-						if (users) {
-							users.forEach((user) => {
-								if (user.mainDepartmentCode) {
-									mainDeptCodes.push(user.mainDepartmentCode)
-								}
-							})
-						}
-					}
-					return mainDeptCodes.join(this.separator)
-				} else if (orgDataType === 'subCompanyName') {
-					// 分支名称
-					const branchNames = []
-					if (isUserTree) {
-						const users = selectNodeInfo.users
-						if (users) {
-							users.forEach((user) => {
-								if (user.subCompanyName) {
-									branchNames.push(user.subCompanyName)
-								}
-							})
-						}
-					}
-					return branchNames.join(this.separator)
-				} else if (orgDataType === 'subCompanyId') {
-					// 分支id
-					const branchDeptIds = []
-					if (isUserTree) {
-						const users = selectNodeInfo.users
-						if (users) {
-							users.forEach((user) => {
-								if (user.subCompanyId) {
-									branchDeptIds.push(user.subCompanyId)
-								}
-							})
-						}
-					}
-					return branchDeptIds.join(this.separator)
-				}
-			} else {
-				// 单选树时
-				if (orgDataType === 'mainDeptName') {
-					// 正职部门名称
-					let mainDeptName = null
-					if (isUserTree) {
-						const user = selectNodeInfo.user
-						if (user) {
-							mainDeptName = user.mainDepartmentName
-						}
-					}
-					return mainDeptName
-				} else if (orgDataType === 'mainDeptId') {
-					// 正职部门id
-					let mainDeptId = null
-					if (isUserTree) {
-						const user = selectNodeInfo.user
-						if (user) {
-							mainDeptId = user.mainDepartmentId
-						}
-					}
-					return mainDeptId
-				} else if (orgDataType === 'mainDeptCode') {
-					// 正职部门code
-					let mainDeptCode = null
-					if (isUserTree) {
-						const user = selectNodeInfo.user
-						if (user) {
-							mainDeptCode = user.mainDepartmentCode
-						}
-					}
-					return mainDeptCode
-				} else if (orgDataType === 'subCompanyName') {
-					// 分支名称
-					let branchName = null
-					if (isUserTree) {
-						const user = selectNodeInfo.user
-						if (user) {
-							branchName = user.subCompanyName
-						}
-					}
-					return branchName
-				} else if (orgDataType === 'subCompanyId') {
-					// 分支id
-					let branchId = null
-					if (isUserTree) {
-						const user = selectNodeInfo.user
-						if (user) {
-							branchId = user.subCompanyId
-						}
-					}
-					return branchId
-				} else {
-					return selectNodeInfo[orgDataType]
-				}
-			}
-		},
-		// 显示移除用户、部门、工作组组件
-		showMyRemoveComponent() {
-			this.getSelectInfo()
-			if (
-					!this.selectOrganizationInfo ||
-					this.selectOrganizationInfo === null ||
-					this.selectOrganizationInfo === ''
-			) {
-				this.$message({
-					showClose: true,
-					type: 'warning',
-					message: this.$t(
-							'imatrixUIMessage.organizationTreeNoResultNotRemove'
-					),
-				})
-			} else {
-				this.showRemoveComponent = true
-			}
-		},
-		getSelectInfo() {
-			const searchFields = [
-				'id',
-				'code',
-				'loginName',
-				'email',
-				'telephone',
-				'name',
-			]
-			const keys = Object.keys(this.selectOrganizationAllInfo)
-			if (keys.length === 0) {
-				// 表示是初始化时，从表单对象中获得信息
-				for (let i = 0; i < searchFields.length; i++) {
-					const prop = searchFields[i]
-					const fieldSettings = this.fields.filter((field) => {
-						return field.type === prop
-					})
-					if (fieldSettings && fieldSettings.length > 0) {
-						const fieldSetting = fieldSettings[0]
-						if (fieldSetting) {
-							const model = this.getPropName(fieldSetting.model)
-							const selectInfo = this.getModelValue(model)
-							if (selectInfo && selectInfo !== null && selectInfo !== '') {
-								this.selectOrganizationInfo = selectInfo
-								this.searchField = prop
-								break
-							}
-						}
-					}
-				}
-			} else {
-				// 表示是选择用户后
-				for (let i = 0; i < searchFields.length; i++) {
-					const prop = searchFields[i]
-					const selectInfo = this.selectOrganizationAllInfo[prop]
-					if (selectInfo && selectInfo !== null && selectInfo !== '') {
-						this.selectOrganizationInfo = selectInfo
-						this.searchField = prop
-						break
-					}
-				}
-			}
-		},
-		setValue(model, finallyOrgResult) {
-			if (this.models) {
-				if (this.isJoinTable === false && model && model.indexOf('.') > 0) {
-					const parentObj = this.getParentObject(model, this.models)
-					if (parentObj) {
-						setEntityFieldValue(
-								parentObj,
-								model.substring(model.lastIndexOf('.') + 1),
-								finallyOrgResult
-						)
-						// Vue.set(parentObj, model.substring(model.lastIndexOf('.') + 1), finallyOrgResult)
-					}
-				} else {
-					model = this.getPropName(model)
-					setEntityFieldValue(this.models, model, finallyOrgResult)
-					// Vue.set(this.models, model, finallyOrgResult)
-				}
-				console.log('this.value', this.models)
-				// 调用setValue事件
-				this.$emit('setValue', model, finallyOrgResult)
-				if (
-						finallyOrgResult === undefined ||
-						finallyOrgResult === null ||
-						finallyOrgResult === ''
-				) {
-					this.$emit( 'clear', model)
-				}
-			}
-		},
-		getParentObject(prop, models) {
-			const nestedProp = prop.split('.')
-			// 属性只有一个时父对象就是models
-			if (nestedProp.length === 1) {
-				return models
-			} else {
-				let parentObject
-				// 属性超过2个时先找到最后一层属性的父对象
-				for (let i = 0; i < nestedProp.length - 1; i++) {
-					if (i === 0) {
-						parentObject = this.getParentModelProp(nestedProp[i], models)
-					} else {
-						parentObject = this.getParentModelProp(nestedProp[i], parentObject)
-					}
-				}
-				return parentObject
-			}
-		},
-		getParentModelProp(prop, parentObj) {
-			if (!parentObj) {
-				parentObj = {}
-			}
-			if (!parentObj[prop]) {
-				parentObj[prop] = {}
-			}
-			return parentObj[prop]
-		},
-	},
-	emits: [
-		'replace',
-		'setValue',
-		'clear',
-		'focus',
-		'update:value',
-	],
+  components: {
+    ElIconSearch,
+    ElIconDelete
+  },
+  name: 'OrganizationInput',
+  model: {
+    prop: 'value',
+    event: 'input'
+  },
+  props: {
+    value: {
+      type: String,
+      default: ''
+    },
+    // 是否多选
+    multiple: {
+      type: Boolean,
+      default: false
+    },
+    // 是否 “不选中” 子部门
+    checkStrictly: {
+      type: Boolean,
+      default: false
+    },
+    // 树类型 部门人员树DeptUserTree、部门树DeptTree、工作组树WgTree、工作组人员树WgUserTree
+    treeType: {
+      type: String,
+      default: 'DeptUserTree'
+    },
+    // 是否禁用
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    // 字段与组织结构对应信息集合，格式为：[{type:'loginName',model:'字段名'}]
+    // 人员树时，type的可选值有：id、name、loginName、email、telephone、mainDeptName、mainDeptId、subCompanyName、subCompanyId
+    // 部门/工作组树时：type的可选值有：id、name、code
+    fields: {
+      type: Array,
+      default: null
+    },
+    // 当前表单数据信息
+    models: {
+      type: Object,
+      default: null
+    },
+    // 文本框大小large/medium/small/mini
+    size: {
+      type: String,
+      default: ''
+    },
+    // 列表组件行编辑使用，sql查询时数据表名称，用于自定义系统中列表组件中字段多表查询带有别名时，将点"."改成两个下划线"__"时使用
+    tableName: {
+      type: String,
+      default: null
+    },
+    // 列表组件行编辑使用，是否是关联表，用于确定属性名是否需要拼接tableName
+    isJoinTable: {
+      type: Boolean,
+      default: false
+    },
+    // 指定部门或者工作组
+    departmentInfo: {
+      type: Array,
+      default: null
+    },
+    // 多选树时结果之间的分隔符，默认是逗号分隔
+    separator: {
+      type: String,
+      default: ','
+    },
+    // 是否打开树
+    openTree: {
+      type: Boolean,
+      default: true
+    }
+  },
+  data() {
+    return {
+      showOrganizationTreeFlag: false, // 选择组织树所用
+      isAppendResult: false, // 是否添加用户、部门、工作组，默认是替换，false表示替换选择的结果，true表示追加选择的结果
+      showRemoveComponent: false, // 实现显示移除用户、部门、工作组组件
+      selectOrganizationInfo: null, // 已选择集合，多个信息之间以逗号隔开
+      searchField: null, // 已选的集合是什么内容，id、loginName(登录名)、name(用户名称/部门名称/工作组名称)、code(部门编码/工作组编码)、email(邮箱)、telephone(电话)等等
+      selectOrganizationAllInfo: {} // 选择的所有信息,{id:'xx',name:'xx',loginName:'xx',code:'xx',email:'xx',telephone:'xx'}
+    }
+  },
+  created() {},
+  methods: {
+    // change事件
+    changeEvent(value) {
+      this.$emit('change', value)
+    },
+    // 打开组织树
+    showOrganizationTree() {
+      if (this.openTree) {
+        let isMulti = this.multiple
+        if (typeof isMulti === 'undefined') {
+          isMulti = false
+        }
+        if (isMulti === true) {
+          // 多选时才需要显示结果集合
+          this.getSelectInfo()
+        }
+        this.$emit('focus')
+        this.showOrganizationTreeFlag = true
+        this.$emit('show-tree')
+      }
+    },
+    getPropName(prop, isJoinTable, tableName) {
+      return getPropNameWhenJoinTable(prop, isJoinTable, tableName)
+    },
+    // 清空已选的结果
+    emptyOrganizationResult() {
+      const orgFields = this.fields
+      if (orgFields && orgFields.length > 0) {
+        orgFields.forEach((orgField) => {
+          // orgDataType的值：
+          // 人员时：id、name、loginName、email、telephone
+          // 部门或工作组时：id、name
+          const model = this.getPropName(orgField.model)
+          this.setValue(model, null)
+        })
+        this.selectOrganizationAllInfo = {}
+        this.selectOrganizationInfo = null
+        this.searchField = null
+      }
+    },
+    // 关闭组织树
+    closeOrganizationTree(selectNodeInfo) {
+      if (selectNodeInfo) {
+        // 是否是多选树
+        this.setOrganizationData(selectNodeInfo)
+      }
+      this.showOrganizationTreeFlag = false
+    },
+    setOrganizationData(orgData, isRemove, removeItems) {
+      let isMulti = this.multiple
+      if (typeof isMulti === 'undefined') {
+        isMulti = false
+      }
+      const treeType = this.treeType
+      const orgFields = this.fields
+      if (orgFields && orgFields.length > 0) {
+        orgFields.forEach((orgField) => {
+          // orgDataType的值：
+          // 人员时：id、name、loginName、email、telephone
+          // 部门或工作组时：id、name、code
+          const orgDataType = orgField.type
+          const orgSelectData = this.getOrgSelectData(orgDataType, orgData, this.isUserTree(treeType), isMulti)
+          const model = this.getPropName(orgField.model)
+          this.getOrgDataModel(model, orgSelectData, isMulti, orgDataType, isRemove, removeItems)
+        })
+      }
+    },
+    /**
+     * @param orgDataType 字段属性：id、name、loginName、code、email、telephone
+     */
+    getOrgDataModel(model, orgSelectData, isMulti, orgDataType, isRemove, removeItems) {
+      if (isMulti) {
+        // 表示是替换或添加操作
+        const orgResult = this.getModelValue(model)
+        // 表示替换结果
+        this.selectOrganizationAllInfo[orgDataType] = orgSelectData
+        this.setValue(model, orgSelectData)
+        // 参数分别为：属性名、原来的值、新替换的值
+        this.$emit('replace', model, orgResult, orgSelectData)
+      } else {
+        this.setValue(model, orgSelectData)
+      }
+    },
+    getModelValue(model) {
+      let modelValue = ''
+      if (this.isJoinTable === false && model && model.indexOf('.') > 0) {
+        const parentObj = this.getParentObject(model, this.models)
+        modelValue = parentObj[model.substring(model.lastIndexOf('.') + 1)]
+      } else {
+        model = this.getPropName(model)
+        modelValue = this.models[model]
+      }
+      return modelValue
+    },
+    // 是否是人员树
+    isUserTree(treeType) {
+      return treeType === 'DeptUserTree' || treeType === 'WgUserTree'
+    },
+    // 获得组织树选择的结果
+    getOrgSelectData(orgDataType, selectNodeInfo, isUserTree, isMulti) {
+      if (isMulti === true) {
+        // 多选树时
+        if (orgDataType === 'id') {
+          if (isUserTree) {
+            return selectNodeInfo.userIds.join(this.separator)
+          } else {
+            return selectNodeInfo.ids.join(this.separator)
+          }
+        } else if (orgDataType === 'name') {
+          if (isUserTree) {
+            return selectNodeInfo.userNames.join(this.separator)
+          } else {
+            return selectNodeInfo.names.join(this.separator)
+          }
+        } else if (orgDataType === 'code') {
+          if (!isUserTree) {
+            return selectNodeInfo.codes.join(this.separator)
+          }
+        } else if (orgDataType === 'loginName') {
+          return selectNodeInfo.loginNames.join(this.separator)
+        } else if (orgDataType === 'email') {
+          return selectNodeInfo.emails.join(this.separator)
+        } else if (orgDataType === 'telephone') {
+          return selectNodeInfo.telephones.join(this.separator)
+        } else if (orgDataType === 'mainDeptName') {
+          // 正职部门名称
+          const mainDeptNames = []
+          if (isUserTree) {
+            const users = selectNodeInfo.users
+            if (users) {
+              users.forEach((user) => {
+                mainDeptNames.push(user.mainDepartmentName)
+              })
+            }
+          }
+          return mainDeptNames.join(this.separator)
+        } else if (orgDataType === 'mainDeptId') {
+          // 正职部门id
+          const mainDeptIds = []
+          if (isUserTree) {
+            const users = selectNodeInfo.users
+            if (users) {
+              users.forEach((user) => {
+                if (user.mainDepartmentId) {
+                  mainDeptIds.push(user.mainDepartmentId)
+                }
+              })
+            }
+          }
+          return mainDeptIds.join(this.separator)
+        } else if (orgDataType === 'mainDeptCode') {
+          // 正职部门code
+          const mainDeptCodes = []
+          if (isUserTree) {
+            const users = selectNodeInfo.users
+            if (users) {
+              users.forEach((user) => {
+                if (user.mainDepartmentCode) {
+                  mainDeptCodes.push(user.mainDepartmentCode)
+                }
+              })
+            }
+          }
+          return mainDeptCodes.join(this.separator)
+        } else if (orgDataType === 'subCompanyName') {
+          // 分支名称
+          const branchNames = []
+          if (isUserTree) {
+            const users = selectNodeInfo.users
+            if (users) {
+              users.forEach((user) => {
+                if (user.subCompanyName) {
+                  branchNames.push(user.subCompanyName)
+                }
+              })
+            }
+          }
+          return branchNames.join(this.separator)
+        } else if (orgDataType === 'subCompanyId') {
+          // 分支id
+          const branchDeptIds = []
+          if (isUserTree) {
+            const users = selectNodeInfo.users
+            if (users) {
+              users.forEach((user) => {
+                if (user.subCompanyId) {
+                  branchDeptIds.push(user.subCompanyId)
+                }
+              })
+            }
+          }
+          return branchDeptIds.join(this.separator)
+        }
+      } else {
+        // 单选树时
+        if (orgDataType === 'mainDeptName') {
+          // 正职部门名称
+          let mainDeptName = null
+          if (isUserTree) {
+            const user = selectNodeInfo.user
+            if (user) {
+              mainDeptName = user.mainDepartmentName
+            }
+          }
+          return mainDeptName
+        } else if (orgDataType === 'mainDeptId') {
+          // 正职部门id
+          let mainDeptId = null
+          if (isUserTree) {
+            const user = selectNodeInfo.user
+            if (user) {
+              mainDeptId = user.mainDepartmentId
+            }
+          }
+          return mainDeptId
+        } else if (orgDataType === 'mainDeptCode') {
+          // 正职部门code
+          let mainDeptCode = null
+          if (isUserTree) {
+            const user = selectNodeInfo.user
+            if (user) {
+              mainDeptCode = user.mainDepartmentCode
+            }
+          }
+          return mainDeptCode
+        } else if (orgDataType === 'subCompanyName') {
+          // 分支名称
+          let branchName = null
+          if (isUserTree) {
+            const user = selectNodeInfo.user
+            if (user) {
+              branchName = user.subCompanyName
+            }
+          }
+          return branchName
+        } else if (orgDataType === 'subCompanyId') {
+          // 分支id
+          let branchId = null
+          if (isUserTree) {
+            const user = selectNodeInfo.user
+            if (user) {
+              branchId = user.subCompanyId
+            }
+          }
+          return branchId
+        } else {
+          return selectNodeInfo[orgDataType]
+        }
+      }
+    },
+    // 显示移除用户、部门、工作组组件
+    showMyRemoveComponent() {
+      this.getSelectInfo()
+      if (!this.selectOrganizationInfo || this.selectOrganizationInfo === null || this.selectOrganizationInfo === '') {
+        this.$message({
+          showClose: true,
+          type: 'warning',
+          message: this.$t('imatrixUIMessage.organizationTreeNoResultNotRemove')
+        })
+      } else {
+        this.showRemoveComponent = true
+      }
+    },
+    getSelectInfo() {
+      const searchFields = ['id', 'code', 'loginName', 'email', 'telephone', 'name']
+      const keys = Object.keys(this.selectOrganizationAllInfo)
+      if (keys.length === 0) {
+        // 表示是初始化时，从表单对象中获得信息
+        for (let i = 0; i < searchFields.length; i++) {
+          const prop = searchFields[i]
+          const fieldSettings = this.fields.filter((field) => {
+            return field.type === prop
+          })
+          if (fieldSettings && fieldSettings.length > 0) {
+            const fieldSetting = fieldSettings[0]
+            if (fieldSetting) {
+              const model = this.getPropName(fieldSetting.model)
+              const selectInfo = this.getModelValue(model)
+              if (selectInfo && selectInfo !== null && selectInfo !== '') {
+                this.selectOrganizationInfo = selectInfo
+                this.searchField = prop
+                break
+              }
+            }
+          }
+        }
+      } else {
+        // 表示是选择用户后
+        for (let i = 0; i < searchFields.length; i++) {
+          const prop = searchFields[i]
+          const selectInfo = this.selectOrganizationAllInfo[prop]
+          if (selectInfo && selectInfo !== null && selectInfo !== '') {
+            this.selectOrganizationInfo = selectInfo
+            this.searchField = prop
+            break
+          }
+        }
+      }
+    },
+    setValue(model, finallyOrgResult) {
+      if (this.models) {
+        if (this.isJoinTable === false && model && model.indexOf('.') > 0) {
+          const parentObj = this.getParentObject(model, this.models)
+          if (parentObj) {
+            setEntityFieldValue(parentObj, model.substring(model.lastIndexOf('.') + 1), finallyOrgResult)
+            // Vue.set(parentObj, model.substring(model.lastIndexOf('.') + 1), finallyOrgResult)
+          }
+        } else {
+          model = this.getPropName(model)
+          setEntityFieldValue(this.models, model, finallyOrgResult)
+          // Vue.set(this.models, model, finallyOrgResult)
+        }
+        console.log('this.value', this.models)
+        // 调用setValue事件
+        this.$emit('setValue', model, finallyOrgResult)
+        if (finallyOrgResult === undefined || finallyOrgResult === null || finallyOrgResult === '') {
+          this.$emit('clear', model)
+        }
+      }
+    },
+    getParentObject(prop, models) {
+      const nestedProp = prop.split('.')
+      // 属性只有一个时父对象就是models
+      if (nestedProp.length === 1) {
+        return models
+      } else {
+        let parentObject
+        // 属性超过2个时先找到最后一层属性的父对象
+        for (let i = 0; i < nestedProp.length - 1; i++) {
+          if (i === 0) {
+            parentObject = this.getParentModelProp(nestedProp[i], models)
+          } else {
+            parentObject = this.getParentModelProp(nestedProp[i], parentObject)
+          }
+        }
+        return parentObject
+      }
+    },
+    getParentModelProp(prop, parentObj) {
+      if (!parentObj) {
+        parentObj = {}
+      }
+      if (!parentObj[prop]) {
+        parentObj[prop] = {}
+      }
+      return parentObj[prop]
+    }
+  },
+  emits: ['replace', 'setValue', 'clear', 'focus', 'update:value', 'change']
 }
 </script>