添加角色管理

src/components/Sidebar.vue

@@ -125,6 +125,10 @@ export default {
               index: "/roleManagement",
               title: "角色管理",
             },
+            {
+              index: "/menuManagement",
+              title: "菜单功能管理",
+            },
             {
               index: "/deviceUpgrade",
               title: "升级管理",

src/router/index.js

@@ -77,6 +77,17 @@ const routes = [
         name: "roleManagement",
         meta: { title: "角色管理", icon: "el-icon-monitor", keepAlive: true },
       },
+      {
+        path: "/menuManagement",
+        component: () => import("../views/system/menuManagement/index.vue"),
+        name: "menuManagement",
+        meta: {
+          title: "菜单功能管理",
+          icon: "el-icon-monitor",
+          keepAlive: true,
+        },
+      },
+
       {
         path: "/deviceUpgrade",
         component: () => import("../views/system/deviceUpgrade/index.vue"),

src/utils/api/index.js

@@ -899,3 +899,56 @@ export function deleteApkApi(data) {
     data,
   });
 }
+
+//获取菜单功能列表
+export function getMenuListApi(data) {
+  return request({
+    url: "/xymanager/resource/listAll",
+    method: "get",
+    params: data,
+  });
+}
+//新增菜单功能
+export function addResourceApi(data) {
+  return request({
+    url: "/xymanager/resource/add",
+    method: "post",
+    data,
+  });
+}
+//修改菜单功能
+export function updateResourceApi(data) {
+  return request({
+    url: "/xymanager/resource/update",
+    method: "post",
+    data,
+  });
+}
+//删除菜单功能
+export function deleteResourceApi(data) {
+  return request({
+    url: "/xymanager/resource/delete",
+    method: "post",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+
+//查询角色权限数结构
+export function getRolePermissionApi(data) {
+  return request({
+    url: "/xymanager/role/getPermission",
+    method: "get",
+    params: data,
+  });
+}
+//@Api0peration("修改角色杈限")
+export function getRolechangePermissionApi(data) {
+  return request({
+    url: "/xymanager/role/changePermission",
+    method: "post",
+    data,
+  });
+}

src/views/system/menuManagement/components/addMenu.vue

@@ -1,6 +1,6 @@
 <template>
   <el-dialog
-    class="addUserDialog"
+    class="addMenuDialog"
     :title="title"
     :visible.sync="isShow"
     :close-on-click-modal="false"
@@ -14,10 +14,17 @@
       :rules="title == '新增' ? rules : xgrules"
       :model="formdata"
     >
-      <el-form-item label="角色名称：" prop="name">
+      <el-form-item label="key：" prop="key">
         <el-input
-          placeholder="请输入角色名称"
+          placeholder="请输入key"
-          v-model="formdata.name"
+          v-model="formdata.key"
+          autocomplete="off"
+        ></el-input>
+      </el-form-item>
+      <el-form-item label="desc：" prop="desc">
+        <el-input
+          placeholder="请输入desc"
+          v-model="formdata.desc"
           autocomplete="off"
         ></el-input>
       </el-form-item>
@@ -29,7 +36,7 @@
   </el-dialog>
 </template>
 <script>
-import { addRole, updateRole } from "@/utils/api/index";
+import { addResourceApi, updateResourceApi } from "@/utils/api/index";
 export default {
   props: {
     title: String,
@@ -41,10 +48,12 @@ export default {
 
       formdata: {},
       rules: {
-        name: [{ required: true, message: "请输入用户名", trigger: "blur" }],
+        key: [{ required: true, message: "请输入key", trigger: "blur" }],
+        desc: [{ required: true, message: "请输入desc", trigger: "blur" }],
       },
       xgrules: {
-        name: [{ required: true, message: "请输入用户名", trigger: "blur" }],
+        key: [{ required: true, message: "请输入key", trigger: "blur" }],
+        desc: [{ required: true, message: "请输入desc", trigger: "blur" }],
       },
     };
   },
@@ -54,7 +63,8 @@ export default {
       console.log(val);
       if (val == null) {
         return (this.formdata = {
-          name: "",
+          key: "",
+          desc: "",
         });
       }
       //this.formdata = val;
@@ -65,7 +75,7 @@ export default {
       this.$refs.formInfo.validate((valid) => {
         if (valid) {
           if (this.title == "新增") {
-            addRole(this.formdata)
+            addResourceApi(this.formdata)
               .then((res) => {
                 if (res.code == 200) {
                   this.$message({
@@ -81,7 +91,7 @@ export default {
               })
               .catch((err) => {});
           } else {
-            updateRole(this.formdata)
+            updateResourceApi(this.formdata)
               .then((res) => {
                 if (res.code == 200) {
                   this.$message.success("修改成功");
@@ -106,14 +116,14 @@ export default {
       this.isShow = false;
     },
     handleclose() {
-      this.$parent.roleListAll();
+      this.$parent.menuListAll();
     },
   },
   mounted() {},
 };
 </script>
 <style lang="less">
-.addUserDialog {
+.addMenuDialog {
   .el-form-item {
     .el-input,
     .el-select,

src/views/system/menuManagement/index.vue

@@ -1,8 +1,8 @@
 <template>
-  <div class="rolemanagement">
+  <div class="menumanagement">
     <div class="deviceBox">
       <div class="deviceBtnGroup">
-        <h4>角色管理</h4>
+        <h4>菜单功能管理</h4>
         <el-button type="primary" icon="el-icon-plus" @click="handleAdddevice()"
           >新增</el-button
         >
@@ -10,7 +10,7 @@
       <div class="deviceTable">
         <el-table
           ref="multipleTable"
-          :data="roleTableData"
+          :data="menuTableData"
           stripe
           tooltip-effect="dark"
           style="width: 100%"
@@ -26,11 +26,15 @@
             prop="id"
           ></el-table-column>
           <el-table-column
-            label="角色"
+            label="key"
             show-overflow-tooltip
-            prop="name"
+            prop="key"
+          ></el-table-column>
+          <el-table-column
+            label="desc"
+            show-overflow-tooltip
+            prop="desc"
           ></el-table-column>
-
           <el-table-column
             label="创建时间"
             show-overflow-tooltip
@@ -57,38 +61,26 @@
             </template>
           </el-table-column>
         </el-table>
-        <!-- <div class="pageNation">
-          <el-pagination
-            @current-change="handleCurrentChange"
-            @size-change="handleSizeChange"
-            :current-page="page"
-            :page-size="pageSize"
-            layout="sizes, prev, pager, next, jumper,total"
-            :total="total"
-            background
-          >
-          </el-pagination>
-        </div> -->
       </div>
     </div>
     <!-- 新增 -->
-    <addRole :title="title" ref="adduserref"></addRole>
+    <addMenu :title="title" ref="menuref"></addMenu>
   </div>
 </template>
 <script>
-import addRole from "./components/addRole.vue";
+import addMenu from "./components/addMenu.vue";
 
-import { getRoleList, deleteRole } from "@/utils/api/index";
+import { getMenuListApi, deleteResourceApi } from "@/utils/api/index";
 
 export default {
-  name: "roleManagement",
+  name: "menuManagement",
   components: {
-    addRole,
+    addMenu,
   },
   data() {
     return {
       title: "", //弹窗标题
-      roleTableData: [],
+      menuTableData: [],
       //multipleSelection: [], //获取当前选中
       page: 1, // 当前页数
       pageSize: 20, // 每页数量
@@ -96,14 +88,14 @@ export default {
     };
   },
   created() {
-    this.roleListAll();
+    this.menuListAll();
   },
   methods: {
     //获取线路列表数据
-    roleListAll() {
+    menuListAll() {
-      getRoleList()
+      getMenuListApi()
         .then((res) => {
-          this.roleTableData = res.data;
+          this.menuTableData = res.data;
           this.total = res.data.total;
         })
         .catch((err) => {});
@@ -119,15 +111,15 @@ export default {
     // 新建
     handleAdddevice() {
       this.title = "新增";
-      this.$refs.adduserref.display();
+      this.$refs.menuref.display();
-      this.$refs.adduserref.getdataform(null);
+      this.$refs.menuref.getdataform(null);
     },
 
     //修改
     handleResive(data) {
       this.title = "修改";
-      this.$refs.adduserref.display();
+      this.$refs.menuref.display();
-      this.$refs.adduserref.getdataform(data);
+      this.$refs.menuref.getdataform(data);
     },
 
     //删除数据
@@ -139,11 +131,11 @@ export default {
         type: "warning",
       })
         .then(() => {
-          deleteRole({ id: data.id }).then((res) => {
+          deleteResourceApi({ id: data.id }).then((res) => {
             console.log(res.code);
             if (res.code == 200) {
               this.$message.success("删除成功");
-              this.roleListAll(); //刷新
+              this.menuListAll(); //刷新
             } else if (res.code == 400) {
               this.$message.error(res.msg);
             }
@@ -161,18 +153,18 @@ export default {
     //点击分页
     handleCurrentChange(val) {
       this.page = val;
-      this.roleListAll();
+      this.menuListAll();
     },
     //每页条数
     handleSizeChange(val) {
       this.pageSize = val;
-      this.roleListAll();
+      this.menuListAll();
     },
   },
 };
 </script>
 <style lang="less">
-.rolemanagement {
+.menumanagement {
   width: calc(100% - 24px);
   height: calc(100% - 24px);
   padding: 12px 12px;
@@ -197,4 +189,4 @@ export default {
   }
 }
 </style>
-../user/components/blindPermiss.vue
+../user/components/blindPermiss.vue./components/addMenu.vue

src/views/system/roleManagement/components/blindMenuPermiss.vue

@@ -1,13 +1,22 @@
 <template>
   <el-dialog
-    class="blindDialog"
+    class="blindMenuDialog"
     title="菜单功能绑定"
     :visible.sync="isShow"
     :close-on-click-modal="false"
     width="470px"
     @close="handleclose"
   >
-    <div class="treeBoxList" v-loading="treeLoading">菜单</div>
+    <div class="treeBoxList" v-loading="treeLoading">
+      <el-checkbox-group v-model="checkedMenu">
+        <el-checkbox
+          v-for="item in menuCheckOption"
+          :label="item"
+          :key="item.id"
+          >{{ item.desc }}</el-checkbox
+        >
+      </el-checkbox-group>
+    </div>
     <div slot="footer" class="dialog-footer">
       <el-button @click="isShow = false">取 消</el-button>
       <el-button type="primary" @click="submitForm()">确 定</el-button>
@@ -16,9 +25,9 @@
 </template>
 <script>
 import {
-  getPermissionTree,
+  getMenuListApi,
-  getPermission,
+  getRolePermissionApi,
-  changePermission,
+  getRolechangePermissionApi,
 } from "@/utils/api/index";
 export default {
   props: {},
@@ -26,24 +35,12 @@ export default {
     return {
       roleUser: "",
       isShow: false,
-      treeData: [],
-      defaultProps: {
-        //指定参数格式回显数据
-        children: "list",
-        label: "name",
-        key: "compositeKey", // 确保这里使用的是 uniqueKey
-      },
       treeLoading: false,
       rowData: "",
-      premissData: [],
+      menuList: [],
-      selectTreeNode: [],
+      checkedMenu: [],
-      defaultExpandedArr: [],
+      menuCheckOption: [],
-      rules: {
+      checkedIds: [], //权限返回的内容id
-        name: [{ required: true, message: "请输入用户名", trigger: "blur" }],
-      },
-      xgrules: {
-        name: [{ required: true, message: "请输入用户名", trigger: "blur" }],
-      },
     };
   },
   methods: {
@@ -51,70 +48,27 @@ export default {
     getdataform(val) {
       this.rowData = JSON.parse(JSON.stringify(val));
     },
-    //获取权限树结构
+    getMenuList() {
-    getPermissionList() {
+      getMenuListApi()
-      this.treeLoading = true;
-      getPermissionTree()
         .then((res) => {
           if (res.code == 200) {
             console.log(res);
-            // this.treeLoading = false;
+            this.menuCheckOption = res.data;
-            //this.treeData = res.data.list;
+            this.getRolePermission();
-            this.treeData = this.processData(res.data);
-            console.log(this.treeData);
-            // this.treeData.forEach((item) => {
-            //   this.defaultExpandedArr.push(item.id);
-            // });
-            this.defaultExpandedArr.push(this.treeData[0].compositeKey);
-            // console.log("我是默认展开的id", this.defaultExpandedArr);
-            this.getPermissionRole();
           } else {
             this.$message.error(res.msg);
           }
         })
         .catch((err) => {});
     },
-    processData(data, level = 0) {
+    getRolePermission() {
-      return data.map((node) => {
-        const compositeKey = `${level}-${node.id}`; // 创建复合标识符
-        node.compositeKey = compositeKey; // 将复合标识符添加到节点属性中
-        if (node.list) {
-          node.list = this.processData(node.list, level + 1); // 递归处理子节点
-        }
-        return node;
-      });
-    },
-    //获取查询杈限
-    getPermissionRole() {
       console.log(this.rowData);
-      getPermission({ id: this.rowData.uid })
+      getRolePermissionApi({ id: this.rowData.id })
         .then((res) => {
           if (res.code == 200) {
             console.log(res);
-            this.premissData = res.data;
+            this.checkedIds = res.data;
-            // let setCheckedKeysList = this.premissData.map(function (item) {
+            console.log(this.checkedIds);
-            //   return item.resourceId;
-            // });
-            let setCheckedKeysList = [];
-            this.premissData.forEach((node) => {
-              if (node.resourceType == 1) {
-                console.log(node);
-                setCheckedKeysList.push("0-" + node.resourceId);
-              } else if (node.resourceType == 2) {
-                setCheckedKeysList.push("1-" + node.resourceId);
-              } else if (node.resourceType == 3) {
-                setCheckedKeysList.push("2-" + node.resourceId);
-              } else if (node.resourceType == 4) {
-                setCheckedKeysList.push("3-" + node.resourceId);
-              }
-            });
-            console.log(setCheckedKeysList);
-            this.$refs.tree.setCheckedKeys(setCheckedKeysList);
-            this.treeLoading = false;
-            // this.$nextTick(() => {
-            //   this.$refs.tree.setCheckedKeys(setCheckedKeysList);
-            //   this.treeLoading = false;
-            // });
           } else {
             this.$message.error(res.msg);
           }
@@ -123,42 +77,14 @@ export default {
     },
     // 保存确定操作
     submitForm() {
-      //获取勾选的父节点和子节点
+      console.log(this.checkedMenu);
-      let originData = this.$refs.tree.store;
-      // 定义数组
-      const checkedNodeIds = [];
-      // 判断是否为全选，若为全选状态返回被选中的父节点数据，不为全选状态正常返回被选中的子节点的数据
-      const isAllChecked = function (node) {
-        const childNodes = node.root ? node.root.childNodes : node.childNodes;
-        childNodes.forEach((child) => {
-          if (child.checked) {
-            checkedNodeIds.push(child.data);
-          }
-          if (child.indeterminate) {
-            isAllChecked(child);
-          }
-        });
-      };
-      isAllChecked(originData);
-      console.log(checkedNodeIds);
-      //把获取到的节点遍历 组成想要的内容
       let paramsList = [];
-      checkedNodeIds.forEach((node) => {
+      this.checkedMenu.forEach((node) => {
-        if ("dyValue" in node) {
+        paramsList.push({ resourceId: node.id });
-          console.log(node);
-          paramsList.push({ resourceType: 1, resourceId: node.id });
-        } else if ("bsManufacturer" in node) {
-          paramsList.push({ resourceType: 2, resourceId: node.id });
-        } else if ("lineid" in node) {
-          paramsList.push({ resourceType: 3, resourceId: node.id });
-        } else if ("towerid" in node) {
-          paramsList.push({ resourceType: 4, resourceId: node.id });
-        }
       });
-      console.log(paramsList);
+      getRolechangePermissionApi({
-      changePermission({
         list: paramsList,
-        userId: this.rowData.uid,
+        roleId: this.rowData.id,
       })
         .then((res) => {
           if (res.code == 200) {
@@ -176,27 +102,31 @@ export default {
         })
         .catch((err) => {});
     },
+
     display() {
       this.isShow = true;
-      this.getPermissionList();
+      this.getMenuList();
     },
     hide() {
       this.isShow = false;
     },
-    handleclose() {
+    handleclose() {},
-      this.treeData = [];
-    },
   },
   mounted() {},
 };
 </script>
 <style lang="less">
-.blindDialog {
+.blindMenuDialog {
   .treeBoxList {
     height: 600px;
     overflow: auto;
-    .el-dialog__body {
+    .el-checkbox-group {
-      overflow: auto;
+      display: flex;
+      flex-direction: column;
+      .el-checkbox {
+        height: 32px;
+        line-height: 32px;
+      }
     }
   }
 }

src/views/system/roleManagement/index.vue

@@ -140,7 +140,7 @@ export default {
     handleMenuBlind(row) {
       console.log(row);
       this.$refs.blindMenuPermissRef.display();
-      this.$refs.blindMenuPermissRef.getdataform(data);
+      this.$refs.blindMenuPermissRef.getdataform(row);
     },
 
     //删除数据