新增，编辑用户表单校验

src/views/permissions/permission.vue

@@ -336,10 +336,13 @@ const permissionAdd = async function () {
 }
 const addUserRules = {
   account: [
-    { required: true, message: '请输入OA号', trigger: 'blur' }
+    { required: true, message: '请输入OA号', trigger: 'blur' },
+    { pattern: /^\d+$/, message: 'OA号必须为数字', trigger: 'blur' },
+    { max: 20, message: '长度不能超过20位', trigger: 'blur' }
   ],
   name: [
-    { required: true, message: '请输入用户名', trigger: 'blur' }
+    { required: true, message: '请输入用户名', trigger: 'blur' },
+    { max: 20, message: '长度不能超过20位', trigger: 'blur' }
   ],
   market: [
     { required: true, message: '请选择所属地区', trigger: 'change' }
@@ -348,7 +351,8 @@ const addUserRules = {
     { required: true, message: '请选择角色名称', trigger: 'change' }
   ],
   postiton: [
-    { required: true, message: '请输入职位', trigger: 'blur' }
+    { required: true, message: '请输入职位', trigger: 'blur' },
+    { max: 20, message: '长度不能超过20位', trigger: 'blur' }
   ],
   machineIds: [
     {
@@ -429,7 +433,7 @@ const permissionEditInit = async function (row) {
   permissionEditObj.value.parentName = result.data?.fatherName
   console.log('get前', permissionEditObj.value.roleId);
   permissionEditObj.value.roleName = row.roleName
-  if(permissionEditObj.value.roleId==0){
+  if (permissionEditObj.value.roleId == 0) {
     permissionEditObj.value.roleId = ''
   }
   getUserLists(row.roleId)
@@ -518,21 +522,62 @@ const getUserLists = async function (selectedRoleId) {
     console.log('请求失败', error)
   }
 }
+//编辑用户表单校验
+const editAdminRules = {
+  market: [
+    { required: true, message: '请选择所属地区', trigger: 'change' }
+  ],
+  postiton: [
+    { required: true, message: '请输入职位', trigger: 'blur' },
+    { max: 20, message: '长度不能超过20位', trigger: 'blur' }
+  ],
+  machineIds: [
+    {
+      required: true,
+      message: '请至少输入一个机器码',
+      trigger: 'change',
+      validator: (rule, value, callback) => {
+        // 检查是否有非空的机器码
+        const hasValid = value.some(item => item.trim() !== '');
+        if (!hasValid) {
+          callback(new Error('请至少输入一个机器码'));
+        } else {
+          callback();
+        }
+      }
+    }
+  ]
+};
 // 编辑用户权限提交
 const permissionEdit = async function () {
-  const { adminName: userName, roleName: oldRole, roleId: newRoleId } = permissionEditObj.value;
+  let { adminName: userName, roleName: oldRole, roleId: newRoleId } = permissionEditObj.value;
+  console.log('oldRole', oldRole);
+
+  if (oldRole == null) {
+    oldRole = '未分配权限'
+  }
   const newRole = permissionList.value.find(item => item.value === newRoleId)?.label || '未知角色';
   try {
+    await new Promise((resolve, reject) => {
+      Ref.value.validate((valid) => {
+        if (valid) {
+          resolve(); // 验证通过，继续执行后续代码
+        } else {
+          reject(new Error('请检查并完善表单信息')); // 验证失败，抛出错误
+        }
+      });
+    });
    await ElMessageBox.confirm(
-      `确认修改权限角色？\n您正在将【${userName}】的权限角色从【${oldRole}】修改为【${newRole}】\n变更后，该用户的可操作权限将同步更新为新角色配置，涉及数据访问、功能操作等权限变化，请谨慎确认。`,
+  `确认修改权限角色？<br>您正在将【${userName}】的权限角色从【${oldRole}】修改为【${newRole}】<br>变更后，该用户的可操作权限将同步更新为新角色配置，涉及数据访问、功能操作等权限变化，请谨慎确认。`,
   '警告',
   {
     confirmButtonText: '确认',
     cancelButtonText: '取消',
     type: "warning",
-        lockScroll: false
+    lockScroll: false,
+    dangerouslyUseHTMLString: true //允许解析 HTML 标签
   }
-    );
+);
     closeUserEditVisible();
     const result = await request({
       url: '/permission/updateAdmin',
@@ -559,6 +604,7 @@ const permissionEdit = async function () {
         }
       );
       get();
+      closeUserEditVisible()
     } else {
       ElMessage.error(result.msg)
     }
@@ -566,7 +612,6 @@ const permissionEdit = async function () {
   } catch (error) {
     console.log('编辑用户权限失败', error)
     ElMessage.error('编辑用户权限失败')
-    closeUserEditVisible()
   }
 }
 const throttledPermissionEdit = _.throttle(permissionEdit, 5000, {
@@ -781,7 +826,7 @@ const EdithandleMarketChange = (values) => {
     // 如果选择了总部，只保留总部
     permissionEditObj.value.market = ['总部'];
   }
-  console.log('看看现在的地区',permissionEditObj.value.market);
+  console.log('看看现在的地区', permissionEditObj.value.market);
 
 };
 
@@ -1330,7 +1375,8 @@ onMounted(async function () {
 
   <!-- 这是编辑用户权限弹窗 -->
   <el-dialog v-model="userEditVisible" title="编辑用户权限" width="800px" :close-on-click-modal="false">
-    <el-form ref="Ref" :model="permissionEditObj" label-width="auto" style="max-width: 600px; align-items: center">
+    <el-form ref="Ref" :rules="editAdminRules" :model="permissionEditObj" label-width="auto"
+      style="max-width: 600px; align-items: center">
       <el-form-item prop="account" label="用户账号:" clearable>
         <el-input v-model="permissionEditObj.account" placeholder="请输入OA号" style="width: 220px" disabled />
       </el-form-item>
@@ -1353,15 +1399,15 @@ onMounted(async function () {
         </el-select>
       </el-form-item>
       <el-form-item prop="parentName" label="上级角色:">
-        <el-select v-model="permissionEditObj.parentId" :placeholder="permissionEditObj.parentName ||'无上级角色'" :disabled="!!parentRoleTip"
-          style="width: 220px">
+        <el-select v-model="permissionEditObj.parentId" :placeholder="permissionEditObj.parentName || '无上级角色'"
+          :disabled="!!parentRoleTip" style="width: 220px">
           <el-option v-if="parentRoleTip" :key="0" :label="parentRoleTip" :value="null" disabled />
           <el-option v-else v-for="item in permissionList" :key="item.value" :label="item.label" disabled
             :value="item.value"></el-option>
         </el-select>
       </el-form-item>
       <el-form-item prop="permissionSelect" label="权限列表:">
-        <el-tree v-if="data.length>0" :data="data" :disabled="true" show-checkbox node-key="id"
+        <el-tree v-if="data.length > 0" :data="data" :disabled="true" show-checkbox node-key="id"
           :props="{ label: 'menuName', children: 'children' }" :default-checked-keys="permissionEditObj.checkedKeys">
         </el-tree>
         <div v-else style="display: flex; align-items: center; gap: 8px;">
@@ -1467,9 +1513,8 @@ onMounted(async function () {
         <el-form-item prop="roleName" label="角色名称:" required>
           <el-input v-model="permissionEditRoleObj.roleName" placeholder="请输入角色名称" style="width: 220px" />
         </el-form-item>
-        <el-form-item prop="parentName" label="上级角色:" >
-          <el-input v-model="permissionEditRoleObj.parentName" placeholder="无上级角色" disabled
-            style="width: 220px">
+        <el-form-item prop="parentName" label="上级角色:">
+          <el-input v-model="permissionEditRoleObj.parentName" placeholder="无上级角色" disabled style="width: 220px">
             <el-option v-for="item in permissionList" :key="item.value" :label="item.label"
               :value="item.value"></el-option>
           </el-input>
@@ -1479,8 +1524,8 @@ onMounted(async function () {
         </el-form-item>
         <el-form-item prop="checkedKeys" label="权限列表:" required>
           <el-tree v-if="data.length > 0" :data="data" show-checkbox node-key="id"
-            :props="{ label: 'menuName', children: 'children' }" :default-checked-keys="permissionEditRoleObj.checkedKeys"
-            @check="handleEditRolePermissionCheck">
+            :props="{ label: 'menuName', children: 'children' }"
+            :default-checked-keys="permissionEditRoleObj.checkedKeys" @check="handleEditRolePermissionCheck">
             <template #default="{ node, data }">
               <span>{{ node.label }}</span>
             </template>