From 007f3d7272d8df1727c2f1fb26f3ee5179285a37 Mon Sep 17 00:00:00 2001
From: ZhangYong <zyqinghu@163.com>
Date: Wed, 23 Jul 2025 16:18:02 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=EF=BC=8C=E7=BC=96=E8=BE=91?=
 =?UTF-8?q?=E7=94=A8=E6=88=B7=E8=A1=A8=E5=8D=95=E6=A0=A1=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/permissions/permission.vue | 115 ++++++++++++++++++++++++-----------
 1 file changed, 80 insertions(+), 35 deletions(-)

diff --git a/src/views/permissions/permission.vue b/src/views/permissions/permission.vue
index 87eff17..67a7c31 100644
--- a/src/views/permissions/permission.vue
+++ b/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 ElMessageBox.confirm(
-      `确认修改权限角色？\n您正在将【${userName}】的权限角色从【${oldRole}】修改为【${newRole}】\n变更后，该用户的可操作权限将同步更新为新角色配置，涉及数据访问、功能操作等权限变化，请谨慎确认。`,
-      '警告',
-      {
-        confirmButtonText: '确认',
-        cancelButtonText: '取消',
-        type: "warning",
-        lockScroll: false
-      }
-    );
+    await new Promise((resolve, reject) => {
+      Ref.value.validate((valid) => {
+        if (valid) {
+          resolve(); // 验证通过，继续执行后续代码
+        } else {
+          reject(new Error('请检查并完善表单信息')); // 验证失败，抛出错误
+        }
+      });
+    });
+   await ElMessageBox.confirm(
+  `确认修改权限角色？<br>您正在将【${userName}】的权限角色从【${oldRole}】修改为【${newRole}】<br>变更后，该用户的可操作权限将同步更新为新角色配置，涉及数据访问、功能操作等权限变化，请谨慎确认。`,
+  '警告',
+  {
+    confirmButtonText: '确认',
+    cancelButtonText: '取消',
+    type: "warning",
+    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,8 +826,8 @@ const EdithandleMarketChange = (values) => {
     // 如果选择了总部，只保留总部
     permissionEditObj.value.market = ['总部'];
   }
-  console.log('看看现在的地区',permissionEditObj.value.market);
-  
+  console.log('看看现在的地区', permissionEditObj.value.market);
+
 };
 
 // 处理编辑角色权限时的勾选事件
@@ -983,7 +1028,7 @@ const permissionEditRoleInit = async function (row) {
     data.value = [];
     permissionEditRoleObj.value.checkedKeys = [];
   }
-  
+
 
   console.log('编辑角色', permissionEditRoleObj.value);
   permissionEditRoleVisible.value = true;
@@ -1248,9 +1293,9 @@ onMounted(async function () {
           </el-table-column> -->
           <el-table-column prop="operation" label="操作" width="200px">
             <template #default="scope">
-            <el-button type="warning" text @click="permissionEditRoleInit(scope.row)">
-            编辑
-          </el-button>
+              <el-button type="warning" text @click="permissionEditRoleInit(scope.row)">
+                编辑
+              </el-button>
             </template>
           </el-table-column>
         </el-table>
@@ -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,20 +1399,20 @@ 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;">
-            <span style="color: #999;">暂未分配权限</span>
-          </div>
+          <span style="color: #999;">暂未分配权限</span>
+        </div>
       </el-form-item>
       <el-form-item prop="machineIds" label="机器码:">
         <div style="display: flex; align-items: center; flex-wrap: wrap; gap: 10px;">
@@ -1399,7 +1445,7 @@ onMounted(async function () {
         <el-form-item prop="roleName" label="角色名称:" required>
           <el-input v-model="addRole.roleName" placeholder="请输入用户名" style="width: 220px" />
         </el-form-item>
-         <el-form-item prop="parentName" label="上级角色:">
+        <el-form-item prop="parentName" label="上级角色:">
           <el-select v-model="addRole.parentId" placeholder="请选择上级角色" style="width: 220px" @change="getLists" clearable>
             <el-option v-for="item in permissionList" :key="item.value" :label="item.label"
               :value="item.value"></el-option>
@@ -1460,16 +1506,15 @@ onMounted(async function () {
 
 
   <!-- 編輯角色彈窗 -->
-   <el-dialog v-model="permissionEditRoleVisible" title="编辑角色" width="800px" :close-on-click-modal="false">
+  <el-dialog v-model="permissionEditRoleVisible" title="编辑角色" width="800px" :close-on-click-modal="false">
     <template #footer>
       <el-form ref="Ref" :rules="Rolerules" :model="permissionEditRoleObj" label-width="auto"
         style="max-width: 600px; align-items: center">
         <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>