|
|
@@ -1,8 +1,29 @@
|
|
|
<template>
|
|
|
<el-dialog :title="title" :visible.sync="dialogVisible" :width="width" :top="top" append-to-body
|
|
|
@close="handleClose">
|
|
|
+ <!-- 用户类型选择 -->
|
|
|
+ <div class="user-type-filter">
|
|
|
+ <el-form :inline="true" size="small">
|
|
|
+ <el-form-item label="用户类型">
|
|
|
+ <el-select
|
|
|
+ v-model="selectedUserType"
|
|
|
+ placeholder="请选择用户类型"
|
|
|
+ clearable
|
|
|
+ style="width: 240px"
|
|
|
+ @change="handleUserTypeChange"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in userTypeOptions"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
<div class="user-select-container">
|
|
|
- <div class="department-panel">
|
|
|
+ <div class="department-panel" v-if="showDepartmentPanel">
|
|
|
<div class="panel-header">
|
|
|
<h4>请选择部门</h4>
|
|
|
</div>
|
|
|
@@ -12,7 +33,7 @@
|
|
|
class="department-tree"></el-tree>
|
|
|
</div>
|
|
|
|
|
|
- <div class="user-panel">
|
|
|
+ <div class="user-panel" :class="{ 'full-width': !showDepartmentPanel }">
|
|
|
<div class="selected-users" v-if="selectedUsers && selectedUsers.length > 0">
|
|
|
<div class="selected-header">
|
|
|
<span>{{ selectMode === 'single' ? '已选中' : '已选中人员' }} ({{ selectedUsers.length }})</span>
|
|
|
@@ -69,7 +90,7 @@
|
|
|
<p>未找到匹配的用户</p>
|
|
|
</div> -->
|
|
|
|
|
|
- <div class="user-table" v-if="currentDepartment">
|
|
|
+ <div class="user-table" v-if="shouldShowUserTable">
|
|
|
<el-table v-loading="userLoading" @row-click="clickRow" ref="table" :data="userList"
|
|
|
@selection-change="handleSelectionChange" style="flex: 1">
|
|
|
<!-- 根据选择模式显示不同的选择列 -->
|
|
|
@@ -99,9 +120,9 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
- <div class="empty-state" v-if="!currentDepartment">
|
|
|
+ <div class="empty-state" v-if="!shouldShowUserTable">
|
|
|
<i class="el-icon-warning"></i>
|
|
|
- <p>请先选择一个部门</p>
|
|
|
+ <p>{{ emptyStateMessage }}</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -170,7 +191,8 @@ export default {
|
|
|
pageNum: 1,
|
|
|
pageSize: 10,
|
|
|
userName: undefined,
|
|
|
- deptId: undefined
|
|
|
+ deptId: undefined,
|
|
|
+ userType: undefined
|
|
|
},
|
|
|
// 加载状态标识
|
|
|
deptLoading: false,
|
|
|
@@ -183,7 +205,15 @@ export default {
|
|
|
// searchTotal: 0,
|
|
|
// 单选模式下的选中用户ID
|
|
|
selectedUserId: null,
|
|
|
- isDialogClosing: false
|
|
|
+ isDialogClosing: false,
|
|
|
+ // 用户类型选择
|
|
|
+ selectedUserType: undefined,
|
|
|
+ userTypeOptions: [
|
|
|
+ { value: '1', label: '系统用户' },
|
|
|
+ { value: '2', label: '慧项管第三方用户' },
|
|
|
+ { value: '3', label: '慧监理第三方用户' },
|
|
|
+ { value: '4', label: '建科用户' }
|
|
|
+ ]
|
|
|
};
|
|
|
},
|
|
|
computed: {
|
|
|
@@ -191,6 +221,36 @@ export default {
|
|
|
departmentData() {
|
|
|
return this.departments.length > 0 ? this.departments : this.internalDepartments;
|
|
|
},
|
|
|
+ // 是否显示部门面板（只有建科用户需要选择部门）
|
|
|
+ showDepartmentPanel() {
|
|
|
+ return this.selectedUserType === '4';
|
|
|
+ },
|
|
|
+ // 是否需要选择部门
|
|
|
+ needDepartmentSelection() {
|
|
|
+ return this.selectedUserType === '4';
|
|
|
+ },
|
|
|
+ // 是否应该显示用户表格
|
|
|
+ shouldShowUserTable() {
|
|
|
+ if (!this.selectedUserType) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ // 建科用户需要选择部门后才显示
|
|
|
+ if (this.needDepartmentSelection) {
|
|
|
+ return !!this.currentDepartment;
|
|
|
+ }
|
|
|
+ // 其他类型用户直接显示
|
|
|
+ return true;
|
|
|
+ },
|
|
|
+ // 空状态提示信息
|
|
|
+ emptyStateMessage() {
|
|
|
+ if (!this.selectedUserType) {
|
|
|
+ return '请先选择用户类型';
|
|
|
+ }
|
|
|
+ if (this.needDepartmentSelection && !this.currentDepartment) {
|
|
|
+ return '请先选择一个部门';
|
|
|
+ }
|
|
|
+ return '暂无数据';
|
|
|
+ },
|
|
|
// 以下计算属性搜索相关
|
|
|
// filteredUsers() {
|
|
|
// if (!this.searchText) return [];
|
|
|
@@ -250,6 +310,58 @@ export default {
|
|
|
// }
|
|
|
},
|
|
|
methods: {
|
|
|
+ // 用户类型变化处理
|
|
|
+ handleUserTypeChange(value) {
|
|
|
+ this.selectedUserType = value;
|
|
|
+ this.queryParams.userType = value;
|
|
|
+
|
|
|
+ // 清空之前的选择
|
|
|
+ this.currentDepartment = null;
|
|
|
+ this.userList = [];
|
|
|
+ this.total = 0;
|
|
|
+ this.queryParams.deptId = undefined;
|
|
|
+ this.queryParams.pageNum = 1;
|
|
|
+
|
|
|
+ if (!value) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 如果不是建科用户（1,2,3），直接加载该类型的所有用户
|
|
|
+ if (value !== '4') {
|
|
|
+ this.getUsersByType();
|
|
|
+ }
|
|
|
+ // 如果是建科用户（4），需要加载部门树供选择
|
|
|
+ else if (this.departmentData.length === 0) {
|
|
|
+ this.loadDepartmentData();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 根据用户类型加载用户（不需要部门）
|
|
|
+ async getUsersByType() {
|
|
|
+ this.userLoading = true;
|
|
|
+ try {
|
|
|
+ const response = await listUser({
|
|
|
+ pageNum: this.queryParams.pageNum,
|
|
|
+ pageSize: this.queryParams.pageSize,
|
|
|
+ userType: this.queryParams.userType
|
|
|
+ });
|
|
|
+
|
|
|
+ if (response.code === 200) {
|
|
|
+ this.userList = response.rows || [];
|
|
|
+ this.total = response.total || 0;
|
|
|
+ } else {
|
|
|
+ this.$modal.msgError("获取用户数据失败: " + response.msg);
|
|
|
+ this.userList = [];
|
|
|
+ this.total = 0;
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ this.$modal.msgError("获取用户数据失败");
|
|
|
+ console.error("获取用户数据失败:", error);
|
|
|
+ this.userList = [];
|
|
|
+ this.total = 0;
|
|
|
+ } finally {
|
|
|
+ this.userLoading = false;
|
|
|
+ }
|
|
|
+ },
|
|
|
// 加载部门数据
|
|
|
async loadDepartmentData() {
|
|
|
this.deptLoading = true;
|
|
|
@@ -338,15 +450,28 @@ export default {
|
|
|
},
|
|
|
|
|
|
async getUsers() {
|
|
|
+ // 如果不需要部门选择（非建科用户），使用类型筛选
|
|
|
+ if (!this.needDepartmentSelection) {
|
|
|
+ return this.getUsersByType();
|
|
|
+ }
|
|
|
+
|
|
|
+ // 建科用户需要选择部门
|
|
|
if (!this.queryParams.deptId) return Promise.resolve();
|
|
|
|
|
|
this.userLoading = true;
|
|
|
try {
|
|
|
- const response = await listUser({
|
|
|
+ const params = {
|
|
|
pageNum: this.queryParams.pageNum,
|
|
|
pageSize: this.queryParams.pageSize,
|
|
|
deptId: this.queryParams.deptId
|
|
|
- });
|
|
|
+ };
|
|
|
+
|
|
|
+ // 如果有用户类型，添加到参数中
|
|
|
+ if (this.queryParams.userType) {
|
|
|
+ params.userType = this.queryParams.userType;
|
|
|
+ }
|
|
|
+
|
|
|
+ const response = await listUser(params);
|
|
|
|
|
|
if (response.code === 200) {
|
|
|
this.userList = response.rows || [];
|
|
|
@@ -461,6 +586,11 @@ export default {
|
|
|
// },
|
|
|
// 确认选择
|
|
|
handleConfirm() {
|
|
|
+ if (!this.selectedUserType) {
|
|
|
+ this.$modal.msgError("请先选择用户类型");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
if (this.selectedUserIds.length === 0) {
|
|
|
this.$modal.msgError("请选择要分配的用户");
|
|
|
return;
|
|
|
@@ -474,6 +604,7 @@ export default {
|
|
|
this.$emit('confirm', {
|
|
|
userIds: this.selectedUserIds,
|
|
|
users: actualSelectedUsers,
|
|
|
+ userType: this.selectedUserType,
|
|
|
deptId: this.queryParams.deptId,
|
|
|
deptName: this.currentDepartment ? this.currentDepartment.label : '',
|
|
|
...this.extraParams
|
|
|
@@ -532,15 +663,33 @@ export default {
|
|
|
this.selectedUsers = [];
|
|
|
this.selectedUserIds = [];
|
|
|
this.selectedUserId = null;
|
|
|
+ this.selectedUserType = undefined;
|
|
|
+ this.queryParams.userType = undefined;
|
|
|
}
|
|
|
// this.searchText = '';
|
|
|
this.queryParams.pageNum = 1;
|
|
|
+ this.queryParams.deptId = undefined;
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
+.user-type-filter {
|
|
|
+ padding: 15px;
|
|
|
+ background-color: #f5f7fa;
|
|
|
+ border-bottom: 2px solid #e4e7ed;
|
|
|
+ margin-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.user-type-filter .el-form {
|
|
|
+ margin-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.user-type-filter .el-form-item {
|
|
|
+ margin-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
.user-select-container {
|
|
|
display: flex;
|
|
|
height: 500px;
|
|
|
@@ -565,6 +714,10 @@ export default {
|
|
|
padding: 10px;
|
|
|
}
|
|
|
|
|
|
+.user-panel.full-width {
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
.panel-header {
|
|
|
padding-bottom: 10px;
|
|
|
border-bottom: 1px solid #e4e7ed;
|
刘博博