From 8df0af8f07765d4e6bdd339d641ab3c93c543f27 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B0=B4=E8=90=BD=28YangLei=29?= <lzi.love@icloud.com>
Date: Thu, 1 Jul 2021 17:29:01 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=8F=9C=E5=8D=95=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E6=96=B0=E5=A2=9E=E7=BB=84=E4=BB=B6=E5=AE=8C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/index.js                       |  3 +-
 src/components/table/tableDrawer.vue          | 22 ++++++++++++++
 src/pages/system/view/menu/MenuManagement.vue | 30 +++++++++++++++----
 src/pages/system/view/menu/add_com.vue        |  3 ++
 src/plugins/index.js                          |  3 +-
 5 files changed, 53 insertions(+), 8 deletions(-)
 create mode 100644 src/components/table/tableDrawer.vue
 create mode 100644 src/pages/system/view/menu/add_com.vue

diff --git a/src/components/index.js b/src/components/index.js
index 3f08fbf..b0976f5 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -2,5 +2,6 @@ import Table from './table/index.vue';
 import WhiteCard from './white_card/index.vue';
 import Upload from './upload/index.vue';
 import MyFormItem from './table/my_item.vue';
+import ActionButoon from './action_button/index.vue';
 
-export { Table, WhiteCard, Upload, MyFormItem };
+export { Table, WhiteCard, Upload, MyFormItem, ActionButoon };
diff --git a/src/components/table/tableDrawer.vue b/src/components/table/tableDrawer.vue
new file mode 100644
index 0000000..b143587
--- /dev/null
+++ b/src/components/table/tableDrawer.vue
@@ -0,0 +1,22 @@
+<template>
+    <div>
+        <Drawer />
+        
+        <Table>
+            <template #search="query">
+                <slot name="search" :query="query" />
+            </template>
+
+            <slot name="table" />
+        </Table>
+    </div>
+</template>
+
+<script>
+import Table from './table.vue';
+import Drawer from './drawer.vue';
+
+export default {
+    components: { Table, Drawer },
+};
+</script>
diff --git a/src/pages/system/view/menu/MenuManagement.vue b/src/pages/system/view/menu/MenuManagement.vue
index 8c0c507..dce01ed 100644
--- a/src/pages/system/view/menu/MenuManagement.vue
+++ b/src/pages/system/view/menu/MenuManagement.vue
@@ -8,7 +8,8 @@
         ref="table"
     >
         <template #drawer>
-            <Form ref="addForm" />
+            <AddCom v-if="addCom" />
+            <Form ref="addForm" v-else />
         </template>
 
         <a-table-column title="名称" data-index="menuName" />
@@ -18,9 +19,7 @@
         <a-table-column title="模块URL" data-index="menuUrl" />
         <a-table-column title="操作">
             <template #default="row">
-                <a @click="() => edit(row)">编辑</a>
-                <a-divider type="vertical" />
-                <PopconfirmDelete :url="`/api/v1/menus/${row.menuId}`" :cb="refreshTable" />
+                <my-ac-btn :row="row" :buttons="buttons" />
             </template>
         </a-table-column>
     </my-table>
@@ -28,21 +27,37 @@
 
 <script>
 import { convertListToTree } from '@/utils';
-import PopconfirmDelete from '@/components/popconfirm_delete/index.vue';
 import Form from './form.vue';
+import AddCom from './add_com.vue';
 
 export default {
     data: vm => ({
+        addCom: false,
         addBtn: {
             text: '新建',
             onOk() {
                 return vm.$refs['addForm']?.submit();
             },
+            onCancel() {
+                vm.addCom = false;
+            },
         },
         sortOrder: 'ascend',
+        buttons: [
+            {
+                label: '新增组件',
+                click() {
+                    vm.show();
+                    vm.addCom = true;
+                },
+                isHidden: row => row.menuType === 'MENU',
+            },
+            { label: '编辑', click: vm.edit },
+            { type: 'confirm', url: row => `/api/v1/menus/${row.menuId}`, after: vm.refreshTable },
+        ],
     }),
 
-    components: { PopconfirmDelete, Form },
+    components: { Form, AddCom },
 
     methods: {
         formatData: convertListToTree,
@@ -58,6 +73,9 @@ export default {
                 this.$refs['addForm'].setEdit({ ...data });
             });
         },
+        show() {
+            this.$refs['table'].show();
+        },
     },
 };
 </script>
diff --git a/src/pages/system/view/menu/add_com.vue b/src/pages/system/view/menu/add_com.vue
new file mode 100644
index 0000000..bc74c1c
--- /dev/null
+++ b/src/pages/system/view/menu/add_com.vue
@@ -0,0 +1,3 @@
+<template>
+    <h1>addCom</h1>
+</template>
diff --git a/src/plugins/index.js b/src/plugins/index.js
index 7353a29..6f217c4 100644
--- a/src/plugins/index.js
+++ b/src/plugins/index.js
@@ -1,7 +1,7 @@
 import VueI18nPlugin from './vueI18nPlugin';
 import AuthorityPlugin from './authorityPlugin';
 import TabsPagePlugin from './tabsPagePlugin';
-import { Table, WhiteCard, Upload, MyFormItem } from '@/components';
+import { Table, WhiteCard, Upload, MyFormItem, ActionButoon } from '@/components';
 
 const Plugins = {
     install: function(Vue) {
@@ -12,6 +12,7 @@ const Plugins = {
         Vue.component('my-card', WhiteCard);
         Vue.component('my-upload', Upload);
         Vue.component('my-form-item', MyFormItem);
+        Vue.component('my-ac-btn', ActionButoon);
     },
 };
 export default Plugins;
-- 
GitLab