From 30a501961cae4909f0f54d9ca17c381fd0d39d80 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B0=B4=E8=90=BD=28YangLei=29?= <lzi.love@icloud.com>
Date: Wed, 30 Jun 2021 23:54:03 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=A7=92=E8=89=B2=E6=9D=83=E9=99=90?=
 =?UTF-8?q?=E7=9B=B8=E5=85=B3=E9=97=AE=E9=A2=98=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/menu.js                     | 10 +++++++++-
 src/components/menu_tree/index.vue  | 12 ++++++++++++
 src/pages/system/view/role/form.vue | 22 ++++++++++++++++++----
 src/router/async/router.map.js      |  4 ----
 4 files changed, 39 insertions(+), 9 deletions(-)

diff --git a/src/api/menu.js b/src/api/menu.js
index 9b64f2d..8cc8ca6 100644
--- a/src/api/menu.js
+++ b/src/api/menu.js
@@ -1,4 +1,4 @@
-import { delReq, getReq, postReq } from '@/utils';
+import { delReq, getReq, postReq, putReq } from '@/utils';
 
 export function delMenuApi(id) {
     return delReq(`/api/v1/menus/${id}`);
@@ -15,3 +15,11 @@ export function addMenuApi(data) {
 export function addRoleApi(data) {
     return postReq('/api/v1/roles', data);
 }
+
+export function getRoleApi(id) {
+    return getReq(`/api/v1/roles/${id}`);
+}
+
+export function updateRoleApi(data) {
+    return putReq('/api/v1/roles', data);
+}
diff --git a/src/components/menu_tree/index.vue b/src/components/menu_tree/index.vue
index 269625f..020365e 100644
--- a/src/components/menu_tree/index.vue
+++ b/src/components/menu_tree/index.vue
@@ -7,6 +7,7 @@
         :tree-data="treeData"
         style="max-height:400px"
         class="tw-overflow-y-auto"
+        :expandedKeys.sync="expandedKeys"
         v-bind="$attrs"
         v-on="$listeners"
     />
@@ -24,6 +25,7 @@ export default {
     props: {
         value: [Object, Array],
         showMenu: Boolean,
+        defaultCheckedKeys: Array,
     },
     data() {
         return {
@@ -32,11 +34,21 @@ export default {
                 title: 'menuName',
                 key: 'menuId',
             },
+            expandedKeys: [],
         };
     },
     async mounted() {
         this.rawData = await getMenuDataApi();
         this.treeData = convertListToTree(this.rawData, !this.showMenu);
+        this.$emit('check', this.defaultCheckedKeys);
+        this.expandedKeys = this.defaultCheckedKeys;
+    },
+
+    watch: {
+        defaultCheckedKeys(val) {
+            this.$emit('check', val);
+            this.expandedKeys = val;
+        },
     },
 
     methods: {
diff --git a/src/pages/system/view/role/form.vue b/src/pages/system/view/role/form.vue
index 41b3a61..61d9165 100644
--- a/src/pages/system/view/role/form.vue
+++ b/src/pages/system/view/role/form.vue
@@ -11,14 +11,20 @@
         </a-form-model-item>
 
         <a-form-model-item label="菜单权限">
-            <MenuTree v-model="checkedKeys" showMenu ref="menuTree" :disabled="isView" />
+            <MenuTree
+                v-model="checkedKeys"
+                :defaultCheckedKeys="defaultCheckedKeys"
+                showMenu
+                ref="menuTree"
+                :disabled="isView"
+            />
         </a-form-model-item>
     </a-form-model>
 </template>
 
 <script>
 import MenuTree from '@/components/menu_tree/index.vue';
-import { addRoleApi } from '@/api';
+import { addRoleApi, getRoleApi, updateRoleApi } from '@/api';
 
 export default {
     components: { MenuTree },
@@ -28,6 +34,7 @@ export default {
             form: {},
             rules: {},
             checkedKeys: [],
+            defaultCheckedKeys: [],
         };
     },
     computed: {
@@ -40,12 +47,19 @@ export default {
     },
     methods: {
         submit() {
-            return addRoleApi({ ...this.form, authorityList: this.$refs['menuTree'].get() });
+            const query = { ...this.form, authorityList: this.$refs['menuTree'].get() };
+            console.log(query);
+            return this.isEdit ? updateRoleApi(query) : addRoleApi(query);
         },
         setData(data, type) {
-            this.form = data;
+            this.getData(data.roleId);
             this.type = type;
         },
+        async getData(id) {
+            const res = await getRoleApi(id);
+            this.form = res;
+            this.defaultCheckedKeys = res.menuComponentKeys.map(i => parseInt(i.split('-')[0]));
+        },
     },
 };
 </script>
diff --git a/src/router/async/router.map.js b/src/router/async/router.map.js
index 4249088..b781cff 100644
--- a/src/router/async/router.map.js
+++ b/src/router/async/router.map.js
@@ -59,10 +59,6 @@ const routerMap = {
         name: '组织管理',
         component: () => import('@/pages/system/view/organization'),
     },
-    user_management: {
-        name: '用户管理',
-        component: () => import('@/pages/system/view/user'),
-    },
     role_management: {
         name: '角色管理',
         component: () => import('@/pages/system/view/role'),
-- 
GitLab