From d4ab8daa939334d634c5ccfe2ccac7d61d17a467 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期五, 28 十月 2022 15:07:35 +0800
Subject: [PATCH] 权限菜单加载--未完

---
 src/views/systemSetting/baseSetting/role/updateUser/index.vue |  336 ++++++++++++++++++++++++++++---------------------------
 1 files changed, 173 insertions(+), 163 deletions(-)

diff --git a/src/views/systemSetting/baseSetting/role/updateUser/index.vue b/src/views/systemSetting/baseSetting/role/updateUser/index.vue
index c7940b3..28c9738 100644
--- a/src/views/systemSetting/baseSetting/role/updateUser/index.vue
+++ b/src/views/systemSetting/baseSetting/role/updateUser/index.vue
@@ -1,189 +1,199 @@
 <template>
-    <div class="updateUser">
-        <main>
-            <div class="mainContent">
-                <div class="my-tree">
-                    <div class="my-tree__wrap">
-                        <el-tree ref="tree" :data="roleList" :props="defaultProps" show-checkbox @check="handleCheck"
-                            :default-checked-keys="checkedIds" default-expand-all node-key="id">
-                        </el-tree>
-                    </div>
-                    <!-- <div class="my-tree__bottom"></div> -->
-                    <!-- <div class="my-tree__right"></div> -->
-                </div>
-                <div class="selection">
-                    <el-button class="cancel" @click="resetRole">鍙栨秷</el-button>
-                    <el-button class="save" @click="saveRole">淇濆瓨</el-button>
-                </div>
-            </div>
-        </main>
-    </div>
+  <div class="updateUser">
+    <main>
+      <div class="mainContent">
+        <div class="my-tree">
+          <div class="my-tree__wrap">
+            <el-tree
+              ref="tree"
+              :data="roleList"
+              :props="defaultProps"
+              show-checkbox
+              :default-checked-keys="checkedIds"
+              default-expand-all
+              node-key="id"
+            >
+            </el-tree>
+          </div>
+          <!-- <div class="my-tree__bottom"></div> -->
+          <!-- <div class="my-tree__right"></div> -->
+        </div>
+        <div class="selection">
+          <el-button class="cancel" @click="resetRole">鍙栨秷</el-button>
+          <el-button class="save" @click="saveRole">淇濆瓨</el-button>
+        </div>
+      </div>
+    </main>
+  </div>
 </template>
 <script>
 export default {
-    data() {
-        return {
-            role: {
-                name: '',
-                sort: '',
-                description: '',
-            },
-            roleList: [],
-            defaultProps: {
-                children: 'children',
-                label: 'title'
-            },
-            treeLabel: '',
-            treeId: 23,
-            checkedIds: [],
-            resCheckedIds: [],
+  data() {
+    return {
+      role: {
+        name: "",
+        sort: "",
+        description: "",
+      },
+      roleList: [],
+      defaultProps: {
+        children: "children",
+        label: "title",
+      },
+      treeLabel: "",
+      treeId: 23,
+      checkedIds: [],
+      resCheckedIds: [],
+    };
+  },
+  created() {
+    const that = this;
+    this.getRoleMenus(this.userInfo.id);
+    this.getMenuList();
+  },
+  methods: {
+    // 鑾峰彇绯荤粺鑿滃崟
+    getMenuList() {
+      this.$axios({
+        method: "get",
+        url: "sccg/menu/treeList",
+      }).then((res) => {
+        this.roleList = res.data;
+      });
+    },
+    // 鏍戝舰鎺т欢澶嶉�夋鐐瑰嚮浜嬩欢
+    handleCheck(data, checked) {
+    //   console.log(checked.checkedKeys);
+    //   this.checkedIds = checked.checkedKeys;
+    //   console.log(this.checkedIds);
+    },
+    // 淇濆瓨role
+    saveRole() {
+      let nodes = this.$refs.tree.getCheckedNodes(false, true);
+   
+      const { userInfo } = this;
+      this.checkedIds = nodes.map((n) => n.id);
+
+      this.$axios({
+        method: "post",
+        url:
+          "sccg/role/allocMenu?roleId=" +
+          userInfo.id +
+          "&menuIds=" +
+          this.checkedIds,
+      }).then((res) => {
+        if (res.code === 200) {
+          this.$message({
+            type: "success",
+            message: "淇敼瑙掕壊鏉冮檺鎴愬姛",
+          });
+          this.getRoleMenus(userInfo.id);
+          this.$emit("changeDialog", { flag: false });
+        //   this.getUserList();
+        } else {
+          this.$message({
+            type: "warning",
+            message: res.message,
+          });
         }
+      });
+      // this.$emit('changeDialog',{dialogUpdate:false});
     },
-    created() {
-        const that = this;
-        this.getRoleMenus(this.userInfo.id);
-        this.getMenuList();
+    // 娑堥櫎role
+    resetRole() {
+      this.resCheckedIds = [];
+      this.$emit("changeDialog", { dialogUpdate: false });
     },
-    methods: {
-        // 鑾峰彇绯荤粺鑿滃崟
-        getMenuList() {
-            this.$axios({
-                method: 'get',
-                url: 'sccg/menu/treeList',
-            })
-                .then(res => {
-                    this.roleList = res.data;
-                })
-        },
-        // 鏍戝舰鎺т欢澶嶉�夋鐐瑰嚮浜嬩欢
-        handleCheck(data, checked) {
-            console.log(checked.checkedKeys);
-            this.checkedIds = checked.checkedKeys;
-            console.log(this.checkedIds);
-        },
-        // 淇濆瓨role
-        saveRole() {
-            this.resCheckedIds = [];
-            const { userInfo } = this;
-            this.resCheckedIds = this.checkedIds;
-            this.$axios({
-                method: 'post',
-                url: 'sccg/role/allocMenu?roleId=' + userInfo.id + '&menuIds=' + this.checkedIds,
-            })
-                .then(res => {
-                    if (res.code === 200) {
-                        this.$message({
-                            type: 'success',
-                            message: '淇敼瑙掕壊鏉冮檺鎴愬姛',
-                        })
-                        this.getRoleMenus(userInfo.id);
-                        this.$emit('changeDialog', { flag: false });
-                        this.getUserList();
-                    } else {
-                        this.$message({
-                            type: 'warning',
-                            message: res.message
-                        })
-                    }
-                })
-            // this.$emit('changeDialog',{dialogUpdate:false});
-        },
-        // 娑堥櫎role
-        resetRole() {
-            this.resCheckedIds = [];
-            this.$emit('changeDialog', { dialogUpdate: false });
-        },
-        // 鑾峰彇瑙掕壊鑿滃崟
-        getRoleMenus(roleId) {
-            this.$axios({
-                method: 'get',
-                url: `sccg/role/listMenu/${roleId}`
-            })
-                .then(res => {
-                    this.checkedIds = [];
-                    res.data.forEach(item => {
-                        this.checkedIds.push(item.id);
-                    })
-                })
-        }
+    // 鑾峰彇瑙掕壊鑿滃崟
+    getRoleMenus(roleId) {
+      this.$axios({
+        method: "get",
+        url: `sccg/role/listMenu/${roleId}`,
+      }).then((res) => {
+        this.checkedIds = [];
+        res.data.forEach((item) => {
+          this.checkedIds.push(item.id);
+        });
+      });
     },
-    props: ['userInfo', 'updateFlag', 'getUserList', 'changeDialog']
-}
+  },
+  props: ["userInfo", "updateFlag", "getUserList", "changeDialog"],
+};
 </script>
 <style lang="scss" scoped>
 .updateUser {
-    border-radius: 1px;
+  border-radius: 1px;
+  background-color: #09152f;
+
+  main {
+    text-align: left;
+    padding: 50px 55px;
     background-color: #09152f;
 
-    main {
-        text-align: left;
-        padding: 50px 55px;
-        background-color: #09152f;
+    .mainContent {
+      .my-tree {
+        height: 200px;
+        overflow: hidden;
+        background-color: #17324c;
+        position: relative;
+        border-radius: 4px;
 
-        .mainContent {
-            .my-tree {
-                height: 200px;
-                overflow: hidden;
-                background-color: #17324c;
-                position: relative;
-                border-radius: 4px;
-
-                .my-tree__wrap {
-                    overflow-y: scroll;
-                    height: 200px;
-                }
-
-                .my-tree__bottom {
-                    position: absolute;
-                    left: 0px;
-                    bottom: 0px;
-                    background-color: #09152f;
-                    width: 100%;
-                    height: 20px;
-                    border-bottom-left-radius: 4px;
-                }
-
-                .my-tree__right {
-                    position: absolute;
-                    right: 0px;
-                    top: 0px;
-                    background-color: #09152f;
-                    width: 20px;
-                    height: 100%;
-                }
-            }
+        .my-tree__wrap {
+          overflow-y: scroll;
+          height: 200px;
         }
-    }
 
-    &::v-deep .el-textarea__inner {
-        background-color: #09152f;
-        border: 1px solid #17324c;
-    }
+        .my-tree__bottom {
+          position: absolute;
+          left: 0px;
+          bottom: 0px;
+          background-color: #09152f;
+          width: 100%;
+          height: 20px;
+          border-bottom-left-radius: 4px;
+        }
 
-    ::v-deep .el-input__inner {
-        background-color: #09152f;
-        border: 1px solid #17324c;
+        .my-tree__right {
+          position: absolute;
+          right: 0px;
+          top: 0px;
+          background-color: #09152f;
+          width: 20px;
+          height: 100%;
+        }
+      }
     }
+  }
+
+  &::v-deep .el-textarea__inner {
+    background-color: #09152f;
+    border: 1px solid #17324c;
+  }
+
+  ::v-deep .el-input__inner {
+    background-color: #09152f;
+    border: 1px solid #17324c;
+  }
 }
 
 .selection {
-    margin-top: 10px;
-    display: flex;
-    justify-content: space-between;
+  margin-top: 10px;
+  display: flex;
+  justify-content: space-between;
 
-    .el-button {
-        padding: 10px 20px;
-        border-radius: 4px;
-    }
+  .el-button {
+    padding: 10px 20px;
+    border-radius: 4px;
+  }
 
-    .save {
-        background-color: #409eff;
-        color: #fff;
-    }
+  .save {
+    background-color: #409eff;
+    color: #fff;
+  }
 
-    .cancel {
-        background-color: #09152f;
-        color: #4b9bb7;
-    }
+  .cancel {
+    background-color: #09152f;
+    color: #4b9bb7;
+  }
 }
 </style>
\ No newline at end of file

--
Gitblit v1.8.0