权限编辑提示优化

src/views/permissions/permission.vue

@@ -487,17 +487,22 @@ const permissionEdit = async function () {
         remark: permissionEditObj.value.remark//备注
       }
     });
+    if (result.code == 200) {
+      await ElMessageBox.alert(
+        `用户${userName}的权限角色已更改为【${newRole}】`,
+        '成功',
+        {
+          confirmButtonText: '确定',
+          type: 'success' // 设置为 success 类型
+        }
+      );
+      get();
+    }else{
+      ElMessage.error(result.msg)
+    }
     console.log('编辑最后提交数据', permissionEditObj.value);
 
-    await ElMessageBox.alert(
-      `用户${userName}的权限角色已更改为【${newRole}】`,
-      '成功',
-      {
-        confirmButtonText: '确定',
-        type: 'success' // 设置为 success 类型
-      }
-    );
-    get();
+
   } catch (error) {
     console.log('编辑用户权限失败', error)
     ElMessage.error('编辑用户权限失败')
@@ -593,7 +598,7 @@ const editStatus = async function (row) {
     })
     console.log('请求成功2', result)
     ElMessage.success(
-        permissionEditObj.value.adminStatus == 1 ? '启用成功' : '禁用成功'
+      permissionEditObj.value.adminStatus == 1 ? '启用成功' : '禁用成功'
     )
     permissionEditObj.value = {}
     get()
@@ -725,7 +730,7 @@ const resetPassword = async function (row) {
       url: '/admin/reset',
       data: { account: row.account }
     })
-    if(res.code==200){
+    if (res.code == 200) {
       ElMessage.success(res.data)
     }
   } catch (error) {
@@ -930,42 +935,42 @@ const resetPassword = async function (row) {
 
       <el-form ref="Ref" :model="addAdmin" label-width="auto" style="max-width: 600px; align-items: center">
         <el-form-item prop="account" label="OA号:" required>
-          <el-input v-model="addAdmin.account" placeholder="请输入OA号" style="width: 220px"/>
+          <el-input v-model="addAdmin.account" placeholder="请输入OA号" style="width: 220px" />
         </el-form-item>
 
         <el-form-item prop="name" label="用户名:" required>
-          <el-input v-model="addAdmin.name" placeholder="请输入用户名" style="width: 220px"/>
+          <el-input v-model="addAdmin.name" placeholder="请输入用户名" style="width: 220px" />
         </el-form-item>
 
         <el-form-item prop="market" label="所属地区:" required>
           <el-select v-model="addAdmin.market" placeholder="请选择所属地区" style="width: 220px"
-                     @change="() => Ref.value.validateField('market')">
-            <el-option v-for="item in market" :key="item" :label="item" :value="item"/>
+            @change="() => Ref.value.validateField('market')">
+            <el-option v-for="item in market" :key="item" :label="item" :value="item" />
           </el-select>
         </el-form-item>
         <el-form-item prop="permission" label="权限类别:" required>
           <el-select v-model="addAdmin.permission" placeholder="请选择权限" style="width: 220px"
-                     @change="() => Ref.value.validateField('permission')">
+            @change="() => Ref.value.validateField('permission')">
             <el-option v-for="item in permissionList" :key="item.value" :label="item.label"
-                       :value="item.value"></el-option>
+              :value="item.value"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item prop="postiton" label="职位:" required>
-          <el-input v-model="addAdmin.postiton" placeholder="请输入职称" style="width: 220px"/>
+          <el-input v-model="addAdmin.postiton" placeholder="请输入职称" style="width: 220px" />
         </el-form-item>
         <el-form-item prop="machineIds" label="机器码:" required>
           <div style="display: flex; align-items: center; flex-wrap: wrap; gap: 10px;">
             <!-- 动态添加的机器码输入框 -->
             <div v-for="(item, index) in addAdmin.machineIds" :key="index" style="margin-left: 10px;">
               <el-input v-model="addAdmin.machineIds[index]" placeholder="请输入机器码"
-                        style="width: 180px; margin-right: 10px;"/>
+                style="width: 180px; margin-right: 10px;" />
             </div>
             <el-button type="primary" @click="addMachineIdInput">添加</el-button>
           </div>
         </el-form-item>
         <el-form-item prop="remark" label="备注">
           <el-input v-model="addAdmin.remark" style="width: 300px" :rows="2" maxlength="100" show-word-limit
-                    type="textarea"/>
+            type="textarea" />
         </el-form-item>
       </el-form>
 
@@ -1037,6 +1042,45 @@ const resetPassword = async function (row) {
     </template>
   </el-dialog>
 
+  <!-- 新增角色 -->
+  <el-dialog v-model="permissionAddVisible" title="新增角色" width="800px" :close-on-click-modal="false">
+    <template #footer>
+      <el-form ref="Ref" :model="addRole" label-width="auto" style="max-width: 600px; align-items: center">
+        <el-form-item prop="roleName" label="角色名称:" required>
+          <el-input v-model="addRole.roleName" placeholder="请输入用户名" style="width: 220px" />
+        </el-form-item>
+        <el-form-item prop="market" label="所属地区:" required>
+          <el-select v-model="addRole.market" placeholder="请选择所属地区" style="width: 240px" clearable>
+            <el-option v-for="item in market" :key="item" :label="item" :value="item" />
+          </el-select>
+        </el-form-item>
+        <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>
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="checkedKeys" label="权限列表:" required>
+          <el-tree :data="data" show-checkbox node-key="id" :props="{ label: 'menuName', children: 'children' }"
+            :checked-keys="addRole.checkedKeys" @check="handleCheckChange">
+            <template #default="{ node, data }">
+              <span>{{ node.label }}</span>
+            </template>
+          </el-tree>
+        </el-form-item>
+        <el-form-item prop="grade" label="优先级:" required>
+          <el-input v-model="addRole.grade" placeholder="数字1~999" style="width: 220px" />
+        </el-form-item>
+      </el-form>
+
+      <div>
+        <el-button @click="closePermissionAddVisible()">取消</el-button>
+        <el-button type="primary" @click="handleAddRole">
+          提交
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
 </template>
 
 
@@ -1060,6 +1104,7 @@ const resetPassword = async function (row) {
 .head-card-btn {
   margin-left: auto;
 }
+
 /* ceshi */
 /* 新增样式让弹窗内容居中 */
 .el-dialog__body {