feat(用户管理): 优化用户管理界面和功能

- 添加用户查询条件：昵称和角色筛选
- 修复用户编辑表单中岗位类型和资质等级的联动逻辑
- 调整用户列表和部门树的布局样式
- 修正表单验证规则和字段标签
- 优化用户编辑时的数据初始化逻辑

src/views/system/user/components/UserInfoEdit.vue

@@ -109,7 +109,7 @@
           <el-col :span="12">
             <el-form-item label="资质等级" prop="qualificationLevel"
               :rules="(form.roleIds || []).includes(101) || (form.roleIds || []).includes(102) ? [{ required: true, message: '请选择资质等级', trigger: 'blur' }] : []">
-              <el-select v-model="form.qualificationLevel" placeholder="请选择资质等级">
+              <el-select v-model="form.qualificationLevel" placeholder="请选择资质等级" @change="handleQualificationLevelChange">
                 <el-option v-for="item in sys_user_qualification_level" :key="item.value" :label="item.label"
                   :value="item.value" />
               </el-select>
@@ -118,7 +118,7 @@
           <el-col :span="12">
             <el-form-item label="岗位类型" prop="postIds"
               :rules="(form.roleIds || []).includes(101) || (form.roleIds || []).includes(102) ? [{ required: true, message: '请选择岗位类型', trigger: 'blur' }] : []">
-              <el-cascader v-model="form.postIds" :options="treeData" :props="treeNodeProps" filterable
+              <el-cascader v-model="form.postIds" :options="filteredTreeData" :props="treeNodeProps" filterable
                 style="width: 100%" />
             </el-form-item>
           </el-col>
@@ -152,7 +152,7 @@
             </el-form-item>
           </el-col>
           <el-col :span="24">
-            <el-form-item label="身体健康情况" prop="physicalHealthStatus">
+            <el-form-item label="健康异常情况" prop="physicalHealthStatus">
               <el-input v-model="form.physicalHealthStatus" type="textarea" placeholder="请输入内容"></el-input>
             </el-form-item>
           </el-col>
@@ -162,12 +162,14 @@
         <el-row :gutter="16">
           <el-col :span="12">
             <el-form-item label="开始工作时间" prop="startWorkingDate">
-              <el-date-picker v-model="form.startWorkingDate" type="date" placeholder="请选择开始工作时间" value-format="YYYY-MM-DD" style="width: 100%;" />
+              <el-date-picker v-model="form.startWorkingDate" type="date" placeholder="请选择开始工作时间"
+                value-format="YYYY-MM-DD" style="width: 100%;" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="开始安检工作时间" prop="securityCheckStartDate" label-width="140px">
-              <el-date-picker v-model="form.securityCheckStartDate" type="date" placeholder="请选择开始安检工作时间" value-format="YYYY-MM-DD" style="width: 100%;" />
+              <el-date-picker v-model="form.securityCheckStartDate" type="date" placeholder="请选择开始安检工作时间"
+                value-format="YYYY-MM-DD" style="width: 100%;" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -373,7 +375,7 @@
 </template>
 
 <script setup>
-import { onMounted, reactive, computed } from 'vue';
+import { onMounted, reactive, computed, watch, nextTick, ref } from 'vue';
 import { useDict } from '@/utils/dict'
 import { listAllTree } from '@/api/system/post'
 import UserSelect from '@/components/UserSelect/index.vue'
@@ -427,7 +429,7 @@ const rules = computed(() => ({
   nickName: [{ required: true, message: "用户昵称不能为空", trigger: "blur" }],
   password: [{ required: true, message: "用户密码不能为空", trigger: "blur" }, { min: 5, max: 20, message: "用户密码长度必须介于 5 和 20 之间", trigger: "blur" }, { pattern: /^[^<>"'|\\]+$/, message: "不能包含非法字符：< > \" ' \\\ |", trigger: "blur" }],
   email: [{ type: "email", message: "请输入正确的邮箱地址", trigger: ["blur", "change"] }],
-  phonenumber: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }],
+  phonenumber: [{ required: true, message: "手机号码不能为空", trigger: "blur" }, { pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }],
   emergencyContactPhone: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }],
   roleIds: [{ required: true, message: '请选择角色', trigger: "blur" }],
   status: [{ required: true, message: '请选择账号状态', trigger: "blur" }]
@@ -435,6 +437,52 @@ const rules = computed(() => ({
 
 const treeNodeProps = { multiple: true, expandTrigger: 'hover', label: 'postName', value: 'postId', emitPath: false, checkOnClickNode: true }
 const treeData = ref([])
+
+// 过滤后的岗位类型选项
+const filteredTreeData = computed(() => {
+  if (!treeData.value || treeData.value.length === 0) {
+    return []
+  }
+
+  // 如果资质等级为五级，过滤掉value为9或10的选项
+  // 其他级别显示完整的选项列表
+  if (form.value.qualificationLevel === 'LEVEL_FIVE') {
+    return filterTreeData(JSON.parse(JSON.stringify(treeData.value)))
+  }
+
+  // 其他级别返回完整的选项列表
+  return treeData.value
+})
+
+// 递归过滤树形数据
+const filterTreeData = (data) => {
+  return data.filter(item => {
+
+    // 过滤掉value为9或10的选项
+    if (item.postId == 9 || item.postId == 10) {
+
+      return false
+    }
+
+    // 如果有子节点，递归过滤
+    if (item.children && item.children.length > 0) {
+      item.children = filterTreeData(item.children)
+    }
+
+    return true
+  })
+}
+
+// 资质等级变化处理函数
+const handleQualificationLevelChange = (newVal) => {
+  console.log('资质等级变化', newVal)
+  form.value.postIds = []
+  // 触发验证
+  nextTick(() => {
+    userRef.value && userRef.value.validateField('postIds')
+  })
+}
+
 onMounted(() => {
   listAllTree().then(res => {
     treeData.value = res.data || []

src/views/system/user/index.vue

@@ -4,12 +4,12 @@
       <splitpanes :horizontal="appStore.device === 'mobile'" class="default-theme">
         <!--部门数据-->
         <pane size="16">
-          <el-col>
+          <el-col style="height: calc(100vh - 130px); display: flex; flex-direction: column;">
             <div class="head-container">
               <el-input v-model="deptName" placeholder="请输入部门名称" clearable prefix-icon="Search"
                 style="margin-bottom: 20px" />
             </div>
-            <div class="head-container">
+            <div class="head-container" style="height: 100%; overflow-y: auto; flex: 1;">
               <el-tree :data="deptOptions" :props="{ label: 'label', children: 'children' }"
                 :expand-on-click-node="false" :filter-node-method="filterNode" ref="deptTreeRef" node-key="id"
                 highlight-current default-expand-all @node-click="handleNodeClick" />
@@ -18,12 +18,21 @@
         </pane>
         <!--用户数据-->
         <pane size="84">
-          <el-col>
+          <el-col style="height: calc(100vh - 130px); overflow-y: auto;">
             <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
               <el-form-item label="用户名称" prop="userName">
                 <el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px"
                   @keyup.enter="handleQuery" />
               </el-form-item>
+              <el-form-item label="用户昵称" prop="nickName">
+                <el-input v-model="queryParams.nickName" placeholder="请输入用户名称" clearable style="width: 240px"
+                  @keyup.enter="handleQuery" />
+              </el-form-item>
+              <el-form-item label="角色" prop="roleName">
+                <el-select v-model="queryParams.roleName" placeholder="请选择角色" clearable style="width: 240px">
+                  <el-option v-for="role in roleOptions" :key="role.roleName" :label="role.roleName" :value="role.roleName" />
+                </el-select>
+              </el-form-item>
               <el-form-item label="手机号码" prop="phonenumber">
                 <el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 240px"
                   @keyup.enter="handleQuery" />
@@ -123,7 +132,7 @@
     </el-row>
 
     <!-- 添加或修改用户配置对话框 -->
-    <el-dialog :title="title" v-model="open" width="75vw" hei append-to-body destroy-on-close>
+    <el-dialog :title="title" v-model="open" width="75vw"  append-to-body destroy-on-close>
       <UserInfoEdit ref="userRef" v-model:form="form" :sys_user_sex="sys_user_sex"
         :enabledDeptOptions="enabledDeptOptions"
         :sys_normal_disable="sys_normal_disable" :postOptions="postOptions" :roleOptions="roleOptions" />
@@ -227,7 +236,9 @@ const data = reactive({
     userName: undefined,
     phonenumber: undefined,
     status: undefined,
-    deptId: undefined
+    deptId: undefined,
+    nickName: undefined,
+    roleName: undefined
   }
 })
 
@@ -462,15 +473,18 @@ function handleUpdate (row) {
     reset()
     form.value = {
       ...response.data,
-      teamCooperation:response.data.teamCooperation?response.data.teamCooperation.split(",").map(Number) : []
+      teamCooperation:response.data.teamCooperation?response.data.teamCooperation.split(",").map(Number) : [],
+      postIds: response.postIds || [],
+      roleIds: response.roleIds || [],
+      password:""
     }
     
     postOptions.value = response.posts
     roleOptions.value = response.roles
-    form.value.postIds = response.postIds || []
-    form.value.roleIds = response.roleIds || []
+    // form.value.postIds = response.postIds || []
+    // form.value.roleIds = response.roleIds || []
     title.value = "修改用户"
-    form.password = ""
+    // form.password = ""
   })
 }
 
@@ -521,6 +535,10 @@ function submitForm () {
 onMounted(() => {
   getDeptTree()
   getList()
+  // 获取角色选项数据
+  getUser().then(response => {
+    roleOptions.value = response.roles
+  })
   proxy.getConfigKey("sys.user.initPassword").then(response => {
     initPassword.value = response.msg
   })