Prechádzať zdrojové kódy

1.修改用户角色分配,改为下拉单选,并展示菜单项

wangt 1 rok pred
rodič
commit
6aa4d2bc99
1 zmenil súbory, kde vykonal 127 pridanie a 55 odobranie
  1. 127 55
      ui/src/views/sysManager/userManager/index.vue

+ 127 - 55
ui/src/views/sysManager/userManager/index.vue

@@ -139,7 +139,7 @@
                   v-if="scope.row.id !== 1 && scope.row.id !== 2"
                   size="mini"
                   type="text"
-                  icon="el-icon-delete"
+                  icon="el-icon-circle-check"
                   @click="handleAuthRole(scope.row)"
                   v-hasPermi="['system:user:role']"
                 >分配角色
@@ -245,26 +245,38 @@
             </el-form-item>
           </el-col>
         </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="角色类型" style="width: 100px">
+              <el-select style="width: 220px" v-model="userRoleId" placeholder="请选择类型" :disabled="edit" @change="getMenu(userRoleId)">
+                <el-option
+                  v-for="item in roleList"
+                  :key="item.roleId"
+                  :label="item.roleName"
+                  :value="item.roleId"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+        <el-form-item label="菜单权限">
+          <el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox>
+          <el-tree
+            class="tree-border"
+            :data="menuOptions"
+            ref="menu"
+            node-key="id"
+            empty-text="无数据,请选择字符标识!"
+            :props="defaultProps"
+          ></el-tree>
+        </el-form-item>
+
+        </el-col>
+        </el-row>
       </el-form>
-      <div style="padding-top: 10px">
-        <vxe-table
-          ref="xTable"
-          align="center"
-          :loading="loading"
-          class="mytable-style"
-          auto-resize
-          border
-          resizable
-          export-config
-          highlight-current-row
-          show-overflow
-          max-height="700"
-          :data="roleList"
-        >
-          <vxe-column type="selection" :reserve-selection="true" width="60"/>
-          <vxe-table-column field="roleName" title="角色名称"/>
-        </vxe-table>
-      </div>
+
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="jssubmitForm">确 定</el-button>
         <el-button @click="jscancel">取 消</el-button>
@@ -300,6 +312,7 @@ export default {
       roleList: [],
       jsusername: '',
       jsnickname: '',
+      userRoleId: '',
       jsusertype: '',
       statusOptions: [
         {value: '0', label: '正常'},
@@ -345,6 +358,13 @@ export default {
         phonenumber: undefined,
         status: undefined
       },
+      menuExpand: false,
+      // 菜单列表
+      menuOptions: [],
+      defaultProps: {
+        children: "children",
+        label: "label"
+      },
       edit: false,
       // 表单校验
       rules: {
@@ -376,6 +396,16 @@ export default {
     this.getList()
   },
   methods: {
+    // 树权限(展开/折叠)
+    handleCheckedTreeExpand(value, type) {
+      if (type == 'menu') {
+        let treeList = this.menuOptions;
+        for (let i = 0; i < treeList.length; i++) {
+          this.$refs.menu.store.nodesMap[treeList[i].id].expanded = value;
+        }
+      }
+    },
+
     setRowClass({row, rowIndex}){
       if(row.signstr === '1'){
         return "background: #FFEFD5";
@@ -986,8 +1016,43 @@ export default {
         this.loading = false
       })
     }, 1000),
+
+    /**
+     * 角色类型改变时更改权限列表
+     * @param rowRoleId
+     * @returns {Promise<unknown>}
+     */
+    getMenu(rowRoleId){
+      console.log("rowRoleId="+rowRoleId)
+      const a = this.$axios
+      const _this = this
+      return new Promise(async function (resolve, reject) {
+        let sysTime
+        let lk
+        await a.get('/sysPolicyController/getLicenseKey').then((res) => {
+          sysTime = res.data.sysTime
+          lk = res.data.lk
+        }).catch((error) => {
+        })
+
+
+        var param1 = {
+          roleId: rowRoleId,
+          sysTime: sysTime,
+          lk: lk
+        }
+
+        await a.get('/sysMenuController/roleMenuTreeselect',
+          {params: param1}).then((res) => {
+          _this.menuOptions = res.data.menus;
+        })
+      }).catch((error) => {
+        console.error('获取用户角色出错' + error)
+      })
+    },
     getUserRole(userid) {
       const a = this.$axios
+      const _this = this
       return new Promise(async function (resolve, reject) {
         let sysTime
         let lk
@@ -1004,11 +1069,31 @@ export default {
         }
         await a.get('/sysUserController/getUserRole',
           {params: userRoleParams}).then(res => {
+
+          _this.userRoleId = res.data.roleId
+
           // 返回userRole对象
           resolve(res.data)
         })
+
+        let sysTime1
+        let lk1
+        await  a.get('/sysPolicyController/getLicenseKey').then((res) => {
+          sysTime1 = res.data.sysTime
+          lk1 = res.data.lk
+        }).catch((error) => {
+        })
+        var param1 = {
+          roleId: _this.userRoleId,
+          sysTime: sysTime1,
+          lk: lk1
+        }
+
+        await a.get('/sysMenuController/roleMenuTreeselect',
+          {params: param1}).then((res) => {
+          _this.menuOptions = res.data.menus;
+        })
       }).catch((error) => {
-        this.loading = false
         console.error('获取用户角色出错' + error)
       })
     },
@@ -1079,47 +1164,34 @@ export default {
         });
         return
       }
+
       this.jsuserid = row.id
       this.jsusername = row.username
       this.jsnickname = row.nickname
+
+      this.getRoleByType(row.usertype)
+      this.getUserRole(this.jsuserid)
       this.jsopen = true;
       this.title = "分配角色";
-
-      Promise.all([this.getRoleByType(row.usertype), this.getUserRole(this.jsuserid)]).then((res) => {
-        if (res[1] != '' && res[1] != undefined) {
-          const roleTable = this.$refs.xTable.getTableData()
-          for (var i = 0; i < roleTable.tableData.length; i++) {
-            if (res[1].roleId == roleTable.tableData[i].roleId) {
-              // 将原有的角色勾选上
-              this.$refs.xTable.setCheckboxRow(roleTable.tableData[i], true)
-            }
-          }
-        }
-      }).catch(e => {
-        this.loading = false
-        this.$message.error("获取分配角色异常:" + e)
-      })
+      // Promise.all([this.getRoleByType(row.usertype), this.getUserRole(this.jsuserid)]).then((res) => {
+      //   if (res[1] != '' && res[1] != undefined) {
+      //     const roleTable = this.$refs.xTable.getTableData()
+      //     for (var i = 0; i < roleTable.tableData.length; i++) {
+      //       if (res[1].roleId == roleTable.tableData[i].roleId) {
+      //         // 将原有的角色勾选上
+      //         this.$refs.xTable.setCheckboxRow(roleTable.tableData[i], true)
+      //       }
+      //     }
+      //   }
+      // }).catch(e => {
+      //   this.loading = false
+      //   this.$message.error("获取分配角色异常:" + e)
+      // })
     }, 1000),
+
+
     /** 角色分配提交按钮 */
     jssubmitForm: debounce(async function () {
-      const _selectData = this.$refs.xTable.getCheckboxRecords(true)
-      if (_selectData.length > 1) {
-        this.$message({
-          type: 'warning',
-          message: '每个用户只能分配一个角色!'
-        });
-        return
-      }
-      let roleid = '';
-      if (_selectData.length == 1) {
-        roleid = _selectData[0].roleId
-      } else {
-        this.$message({
-          type: 'warning',
-          message: '请选择角色!'
-        });
-        return
-      }
 
       let sysTime
       let lk
@@ -1132,7 +1204,7 @@ export default {
       // 提交后台角色分配
       const param = {
         userId: this.jsuserid,
-        roleId: roleid,
+        roleId: this.userRoleId,
         sysTime: sysTime,
         lk: lk
       }