Complate link update.

src/api/link.js

@@ -19,6 +19,14 @@ linkApi.create = (link) => {
   })
 }
 
+
+linkApi.get = linkId => {
+  return service({
+    url: `${baseUrl}/${linkId}`,
+    method: 'get'
+  })
+}
+
 linkApi.update = (linkId, link) => {
   return service({
     url: `${baseUrl}/${linkId}`,

src/views/page/internal/LinkList.vue

@@ -1,70 +1,35 @@
 <template>
   <div class="page-header-index-wide">
     <a-row :gutter="12">
-      <a-col
-        :xl="10"
-        :lg="10"
-        :md="10"
-        :sm="24"
-        :xs="24"
-        :style="{ 'padding-bottom': '12px' }"
-      >
+      <a-col :xl="10" :lg="10" :md="10" :sm="24" :xs="24" :style="{ 'padding-bottom': '12px' }">
         <a-card :title="title">
           <a-form layout="horizontal">
             <a-form-item label="网站名称：">
-              <a-input v-model="link.name" />
+              <a-input v-model="link.name"/>
             </a-form-item>
-            <a-form-item
-              label="网站地址："
-              help="* 需要加上 http://"
-            >
-              <a-input v-model="link.url" />
+            <a-form-item label="网站地址：" help="* 需要加上 http://">
+              <a-input v-model="link.url"/>
             </a-form-item>
             <a-form-item label="Logo：">
-              <a-input v-model="link.logo" />
+              <a-input v-model="link.logo"/>
             </a-form-item>
-            <a-form-item
-              label="分组："
-              help="* 非必填"
-            >
-              <a-input v-model="link.team" />
+            <a-form-item label="分组：" help="* 非必填">
+              <a-input v-model="link.team"/>
             </a-form-item>
             <a-form-item label="描述：">
-              <a-input
-                type="textarea"
-                :autosize="{ minRows: 5 }"
-                v-model="link.description"
-              />
+              <a-input type="textarea" :autosize="{ minRows: 5 }" v-model="link.description"/>
             </a-form-item>
             <a-form-item>
-              <a-button
-                type="primary"
-                @click="createLink"
-                v-if="formType==='create'"
-              >保存</a-button>
+              <a-button type="primary" @click="handleSaveClick" v-if="formType==='create'">保存</a-button>
               <a-button-group v-else>
-                <a-button
-                  type="primary"
-                  @click="updateLink"
-                >更新</a-button>
-                <a-button
-                  type="dashed"
-                  @click="addLink"
-                  v-if="formType==='update'"
-                >返回添加</a-button>
+                <a-button type="primary" @click="handleSaveClick">更新</a-button>
+                <a-button type="dashed" @click="addLink" v-if="formType==='update'">返回添加</a-button>
               </a-button-group>
             </a-form-item>
           </a-form>
         </a-card>
       </a-col>
-      <a-col
-        :xl="14"
-        :lg="14"
-        :md="14"
-        :sm="24"
-        :xs="24"
-        :style="{ 'padding-bottom': '12px' }"
-      >
+      <a-col :xl="14" :lg="14" :md="14" :sm="24" :xs="24" :style="{ 'padding-bottom': '12px' }">
         <a-card title="所有友情链接">
           <a-table
             :columns="columns"
@@ -72,30 +37,13 @@
             :loading="loading"
             :rowKey="link => link.id"
           >
-            <template
-              slot="url"
-              slot-scope="text"
-            >
-              <a
-                target="_blank"
-                :href="text"
-              >{{ text }}</a>
+            <template slot="url" slot-scope="text">
+              <a target="_blank" :href="text">{{ text }}</a>
             </template>
-            <ellipsis
-              :length="15"
-              tooltip
-              slot="name"
-              slot-scope="text"
-            >{{ text }}</ellipsis>
-            <span
-              slot="action"
-              slot-scope="text, record"
-            >
-              <a
-                href="javascript:;"
-                @click="editLink(record.id)"
-              >编辑</a>
-              <a-divider type="vertical" />
+            <ellipsis :length="15" tooltip slot="name" slot-scope="text">{{ text }}</ellipsis>
+            <span slot="action" slot-scope="text, record">
+              <a href="javascript:;" @click="editLink(record.id)">编辑</a>
+              <a-divider type="vertical"/>
               <a-popconfirm
                 :title="'你确定要删除【' + record.name + '】链接？'"
                 @confirm="deleteLink(record.id)"
@@ -161,11 +109,8 @@ export default {
         this.loading = false
       })
     },
-    createLink() {
-      linkApi.create(this.link).then(response => {
-        this.loadLinks()
-        this.link = {}
-      })
+    handleSaveClick() {
+      this.createOrUpdateLink()
     },
     updateLink() {
       this.$message.success('编辑')
@@ -175,14 +120,29 @@ export default {
       this.formType = 'create'
     },
     editLink(id) {
-      this.title = '编辑友情链接'
-      this.formType = 'update'
+      linkApi.get(id).then(response => {
+        this.link = response.data.data
+        this.title = '编辑友情链接'
+        this.formType = 'update'
+      })
     },
     deleteLink(id) {
       linkApi.delete(id).then(response => {
         this.$message.success('删除成功！')
         this.loadLinks()
       })
+    },
+    createOrUpdateLink() {
+      if (this.link.id) {
+        linkApi.update(this.link.id, this.link).then(response => {
+          this.loadLinks()
+        })
+      } else {
+        linkApi.create(this.link).then(response => {
+          this.loadLinks()
+        })
+      }
+      this.link = {}
     }
   }
 }