Complate Link and Menu manage.

src/api/menu.js

@@ -26,4 +26,19 @@ menuApi.delete = menuId => {
   })
 }
 
+menuApi.get = menuId => {
+  return service({
+    url: `${baseUrl}/${menuId}`,
+    method: 'get'
+  })
+}
+
+menuApi.update = (menuId, menu) => {
+  return service({
+    url: `${baseUrl}/${menuId}`,
+    data: menu,
+    method: 'put'
+  })
+}
+
 export default menuApi

src/views/interface/MenuList.vue

@@ -9,7 +9,7 @@
         :xs="24"
         :style="{ 'padding-bottom': '12px' }"
       >
-        <a-card title="添加菜单">
+        <a-card :title="title">
           <a-form layout="horizontal">
             <a-form-item
               label="名称："
@@ -57,8 +57,20 @@
             <a-form-item>
               <a-button
                 type="primary"
-                @click="createMenu"
+                @click="handleSaveClick"
+                v-if="formType==='create'"
               >保存</a-button>
+              <a-button-group v-else>
+                <a-button
+                  type="primary"
+                  @click="handleSaveClick"
+                >更新</a-button>
+                <a-button
+                  type="dashed"
+                  @click="handleAddMenu"
+                  v-if="formType==='update'"
+                >返回添加</a-button>
+              </a-button-group>
               <a
                 :style="{ marginLeft: '8px'}"
                 @click="toggleExpand"
@@ -97,12 +109,12 @@
             >
               <a
                 href="javascript:;"
-                @click="editMenu(record.id)"
+                @click="handleEditMenu(record.id)"
               >编辑</a>
               <a-divider type="vertical" />
               <a-popconfirm
                 :title="'你确定要删除【' + record.name + '】菜单？'"
-                @confirm="deleteMenu(record.id)"
+                @confirm="handleDeleteMenu(record.id)"
                 okText="确定"
                 cancelText="取消"
               >
@@ -147,8 +159,10 @@ export default {
   components: { MenuSelectTree },
   data() {
     return {
+      title: '添加菜单',
       data: [],
-      loading: true,
+      formType: 'create',
+      loading: false,
       columns,
       menus: [],
       menuToCreate: {},
@@ -160,25 +174,46 @@ export default {
   },
   methods: {
     loadMenus() {
+      this.loading = true
       menuApi.listAll().then(response => {
         this.menus = response.data.data
         this.loading = false
       })
     },
-    createMenu() {
+    handleSaveClick() {
-      menuApi.create(this.menuToCreate).then(response => {
+      this.createOrUpdateMenu()
-        this.loadMenus()
+    },
+    handleAddMenu() {
+      this.title = '添加菜单'
+      this.formType = 'create'
+      this.menuToCreate = {}
+    },
+    handleEditMenu(id) {
+      menuApi.get(id).then(response => {
+        this.menuToCreate = response.data.data
+        this.title = '编辑菜单'
+        this.formType = 'update'
       })
     },
-    editMenu(id) {
+    handleDeleteMenu(id) {
-      this.$message.success('编辑' + id)
-    },
-    deleteMenu(id) {
       menuApi.delete(id).then(response => {
         this.$message.success('删除成功！')
         this.loadMenus()
       })
     },
+    createOrUpdateMenu() {
+      if (this.menuToCreate.id) {
+        menuApi.update(this.menuToCreate.id, this.menuToCreate).then(response => {
+          this.$message.success('更新成功！')
+        })
+      } else {
+        menuApi.create(this.menuToCreate).then(response => {
+          this.$message.success('保存成功！')
+        })
+      }
+      this.handleAddMenu()
+      this.loadMenus()
+    },
     toggleExpand() {
       this.fieldExpand = !this.fieldExpand
     }

src/views/sheet/internal/LinkList.vue

@@ -49,7 +49,7 @@
                 >更新</a-button>
                 <a-button
                   type="dashed"
-                  @click="addLink"
+                  @click="handleAddLink"
                   v-if="formType==='update'"
                 >返回添加</a-button>
               </a-button-group>
@@ -93,12 +93,12 @@
             >
               <a
                 href="javascript:;"
-                @click="editLink(record.id)"
+                @click="handleEditLink(record.id)"
               >编辑</a>
               <a-divider type="vertical" />
               <a-popconfirm
                 :title="'你确定要删除【' + record.name + '】链接？'"
-                @confirm="deleteLink(record.id)"
+                @confirm="handleDeleteLink(record.id)"
                 okText="确定"
                 cancelText="取消"
               >
@@ -141,7 +141,7 @@ export default {
       title: '添加友情链接',
       formType: 'create',
       data: [],
-      loading: true,
+      loading: false,
       columns,
       links: [],
       link: {}
@@ -152,6 +152,7 @@ export default {
   },
   methods: {
     loadLinks() {
+      this.loading = true
       linkApi.listAll().then(response => {
         this.links = response.data.data
         this.loading = false
@@ -160,21 +161,19 @@ export default {
     handleSaveClick() {
       this.createOrUpdateLink()
     },
-    updateLink() {
+    handleAddLink() {
-      this.$message.success('编辑')
-    },
-    addLink() {
       this.title = '添加友情链接'
       this.formType = 'create'
+      this.link = {}
     },
-    editLink(id) {
+    handleEditLink(id) {
       linkApi.get(id).then(response => {
         this.link = response.data.data
         this.title = '编辑友情链接'
         this.formType = 'update'
       })
     },
-    deleteLink(id) {
+    handleDeleteLink(id) {
       linkApi.delete(id).then(response => {
         this.$message.success('删除成功！')
         this.loadLinks()
@@ -190,9 +189,8 @@ export default {
           this.$message.success('保存成功！')
         })
       }
-      this.addLink()
+      this.handleAddLink()
       this.loadLinks()
-      this.link = {}
     }
   }
 }