agilebuilder-ui 1.0.0

package/packages/department-user-tree/src/department-user-multiple-tree.vue

@@ -0,0 +1,133 @@
+<template>
+	<div>
+		<el-dialog
+				ref="userDialog"
+				:close-on-click-modal="false"
+				:title="myTitle"
+				:width="width"
+				append-to-body
+				class="user-tree"
+				model-value
+				@close="$emit('closeDialog')"
+				@closed="$emit('closedDialog')"
+				@open="$emit('openDialog')"
+				@opend="$emit('opendDialog')"
+		>
+			<inline-department-user-multi-tree
+					ref="inlineDepartmentUser"
+					:department-info="departmentInfo"
+					:height="height"
+					:is-need-virtual-user="isNeedVirtualUser"
+					:search-field="searchField"
+					:select-user-info="selectUserInfo"
+					:separator="separator"
+					@result="result"
+			/>
+			<template v-slot:footer>
+				<div class="dialog-footer">
+					<el-button size="default" @click="$emit('closeDialog')">
+						{{ $t('imatrixUIPublicModel.cancel') }}
+					</el-button>
+					<el-button size="default" type="primary" @click="confirmSelectUser">
+						{{ $t('imatrixUIPublicModel.sure') }}
+					</el-button>
+				</div>
+			</template>
+		</el-dialog>
+	</div>
+</template>
+
+<script>
+import {$emit} from '../../utils/gogocodeTransfer'
+import InlineDepartmentUserMultiTree
+	from '../../department-user-tree-inline/src/department-user-multiple-tree-inline.vue'
+
+export default {
+	name: 'DepartmentUserMultiTree',
+	components: {
+		InlineDepartmentUserMultiTree,
+	},
+	props: {
+		// 显示指定部门节点及其子节点，不传该属性，表示显示整个组织结构树
+		departmentInfo: {
+			type: Array,
+			default: null,
+		},
+		// 弹框的标题
+		title: {
+			type: String,
+			default: null,
+		},
+		// 弹框的宽度
+		width: {
+			type: String,
+			default: '920px',
+		},
+		// 弹框的高度
+		height: {
+			type: String,
+			default: '300px',
+		},
+		// 是否需要显示虚拟用户
+		isNeedVirtualUser: {
+			type: Boolean,
+			default: false,
+		},
+		// 多选用户树时，已选择用户id或登录名集合，多个之间以逗号隔开
+		selectUserInfo: {
+			type: [String, Number],
+			default: null,
+		},
+		// 移除用户时，用户属性名称：id、loginName、email、telephone，默认是loginName
+		searchField: {
+			type: String,
+			default: 'loginName',
+		},
+		// 多选树时结果之间的分隔符，默认是逗号分隔
+		separator: {
+			type: String,
+			default: ',',
+		}
+	},
+	data() {
+		let myTitle = this.$t('imatrixUIMessage.pleaseSelectPersonnel')
+		if (this.title) {
+			myTitle = this.title
+		}
+		return {
+			myTitle,
+		}
+	},
+	methods: {
+		result(selectNodeInfo) {
+			$emit(this, 'closeDialog', selectNodeInfo)
+		},
+		confirmSelectUser() {
+			this.$refs.inlineDepartmentUser.confirmSelectUser()
+		},
+	},
+	emits: [
+		'openDialog',
+		'opendDialog',
+		'closeDialog',
+		'closedDialog',
+		'opendDialog',
+		'closeDialog',
+		'closedDialog',
+	],
+}
+</script>
+
+<style>
+.searchResult {
+	color: red;
+}
+
+.inline-select-custom {
+	width: 100px;
+}
+
+.inline-input-custom {
+	width: 98%;
+}
+</style>

package/packages/department-user-tree/src/department-user-single-tree.vue

@@ -0,0 +1,96 @@
+<template>
+	<div>
+		<el-dialog
+				:close-on-click-modal="false"
+				:title="myTitle"
+				:width="width"
+				append-to-body
+				class="user-tree"
+				model-value
+				@close="$emit('closeDialog')"
+				@closed="$emit('closedDialog')"
+				@open="$emit('openDialog')"
+				@opend="$emit('opendDialog')"
+		>
+			<inline-department-user-single-tree
+					ref="inlineDepartmentUser"
+					:department-info="departmentInfo"
+					:is-need-virtual-user="isNeedVirtualUser"
+					@result="result"
+			/>
+			<template v-slot:footer>
+				<div class="dialog-footer">
+					<el-button size="default" @click="$emit('closeDialog')">
+						{{ $t('imatrixUIPublicModel.cancel') }}
+					</el-button>
+					<el-button size="default" type="primary" @click="confirmSelectUser">
+						{{ $t('imatrixUIPublicModel.sure') }}
+					</el-button>
+				</div>
+			</template>
+		</el-dialog>
+	</div>
+</template>
+
+<script>
+import {$emit} from '../../utils/gogocodeTransfer'
+import InlineDepartmentUserSingleTree
+	from '../../department-user-tree-inline/src/department-user-single-tree-inline.vue'
+
+export default {
+	name: 'DepartmentUserSingleTree',
+	components: {
+		InlineDepartmentUserSingleTree,
+	},
+	props: {
+		// 显示指定部门节点及其子节点，不传该属性，表示显示整个组织结构树
+		departmentInfo: {
+			type: Array,
+			default: null,
+		},
+		// 弹框的标题
+		title: {
+			type: String,
+			default: null,
+		},
+		// 弹框的宽度
+		width: {
+			type: String,
+			default: '30%',
+		},
+		// 是否需要显示虚拟用户
+		isNeedVirtualUser: {
+			type: Boolean,
+			default: false,
+		},
+	},
+	data() {
+		let myTitle = this.$t('imatrixUIMessage.pleaseSelectPersonnel')
+		if (this.title) {
+			myTitle = this.title
+		}
+		return {
+			myTitle,
+		}
+	},
+	methods: {
+		result(selectNodeInfo) {
+			$emit(this, 'closeDialog', selectNodeInfo)
+		},
+		confirmSelectUser() {
+			// this.$refs.inlineDepartmentUser.confirmSelectUser()
+			// selectNodeInfo
+			$emit(this, 'closeDialog', this.$refs.inlineDepartmentUser.selectNodeInfo)
+		},
+	},
+	emits: [
+		'openDialog',
+		'opendDialog',
+		'closeDialog',
+		'closedDialog',
+		'opendDialog',
+		'closeDialog',
+		'closedDialog',
+	],
+}
+</script>

package/packages/department-user-tree/src/department-user-tree.vue

@@ -0,0 +1,115 @@
+<template>
+	<div>
+		<department-user-multi-tree
+				v-if="multiple"
+				:department-info="departmentInfo"
+				:height="height"
+				:is-need-virtual-user="isNeedVirtualUser"
+				:search-field="searchField"
+				:select-user-info="selectUserInfo"
+				:separator="separator"
+				:title="title"
+				:width="width ? width : '920px'"
+				@closeDialog="closeDialog"
+				@closedDialog="closedDialog"
+				@openDialog="openDialog"
+				@opendDialog="opendDialog"
+		/>
+		<department-user-single-tree
+				v-if="!multiple"
+				:department-info="departmentInfo"
+				:is-need-virtual-user="isNeedVirtualUser"
+				:title="title"
+				:width="width ? width : '509px'"
+				@closeDialog="closeDialog"
+				@closedDialog="closedDialog"
+				@openDialog="openDialog"
+				@opendDialog="opendDialog"
+		/>
+	</div>
+</template>
+
+<script>
+import {$emit} from '../../utils/gogocodeTransfer'
+import DepartmentUserSingleTree from './department-user-single-tree.vue'
+import DepartmentUserMultiTree from './department-user-multiple-tree.vue'
+
+export default {
+	name: 'DepartmentUserTree',
+	components: {
+		DepartmentUserSingleTree,
+		DepartmentUserMultiTree,
+	},
+	props: {
+		// 是否是多选树，默认是true
+		multiple: {
+			type: Boolean,
+			default: true,
+		},
+		// 显示指定部门节点及其子节点，不传该属性，表示显示整个组织结构树
+		departmentInfo: {
+			type: Array,
+			default: null,
+		},
+		// 弹框的标题
+		title: {
+			type: String,
+			default: null,
+		},
+		// 弹框的宽度
+		width: {
+			type: String,
+			default: null,
+		},
+		// 弹框的高度
+		height: {
+			type: String,
+			default: '300px',
+		},
+		// 是否需要显示虚拟用户
+		isNeedVirtualUser: {
+			type: Boolean,
+			default: false,
+		},
+		// 多选用户树时，已选择用户id或登录名集合，多个之间以逗号隔开
+		selectUserInfo: {
+			type: [String, Number],
+			default: null,
+		},
+		// 移除用户时，用户属性名称：id、loginName、email、telephone，默认是loginName
+		searchField: {
+			type: String,
+			default: 'loginName',
+		},
+		// 多选树时结果之间的分隔符，默认是逗号分隔
+		separator: {
+			type: String,
+			default: ',',
+		}
+	},
+	data() {
+		let myTitle = this.$t('imatrixUIMessage.pleaseSelectPersonnel')
+		if (this.title) {
+			myTitle = this.title
+		}
+		return {
+			myTitle,
+		}
+	},
+	methods: {
+		closeDialog(selectNodeInfo) {
+			$emit(this, 'close', selectNodeInfo)
+		},
+		closedDialog() {
+			$emit(this, 'closed')
+		},
+		openDialog() {
+			$emit(this, 'open')
+		},
+		opendDialog() {
+			$emit(this, 'opend')
+		},
+	},
+	emits: ['close', 'closed', 'open', 'opend'],
+}
+</script>

package/packages/department-user-tree-inline/index.js

@@ -0,0 +1,9 @@
+import InlineDepartmentUserTree from './src/department-user-tree-inline.vue'
+InlineDepartmentUserTree.install = function (Vue) {
+  Vue.component(
+    InlineDepartmentUserTree.name,
+    InlineDepartmentUserTree
+  )
+}
+
+export default InlineDepartmentUserTree