diff --git a/api/v1/friendlink.proto b/api/v1/friendlink.proto
index 46782d7..94db35a 100644
--- a/api/v1/friendlink.proto
+++ b/api/v1/friendlink.proto
@@ -36,6 +36,7 @@ message ListFriendlinkRequest {
     int32 size = 2;
     string wd = 3;
     repeated bool enable = 4;
+    repeated string field = 5;
 }
 
 message ListFriendlinkReply {
diff --git a/biz/friendlink.go b/biz/friendlink.go
index 7397981..75d8906 100644
--- a/biz/friendlink.go
+++ b/biz/friendlink.go
@@ -107,9 +107,10 @@ func (s *FriendlinkAPIService) GetFriendlink(ctx context.Context, req *pb.GetFri
 
 func (s *FriendlinkAPIService) ListFriendlink(ctx context.Context, req *pb.ListFriendlinkRequest) (*pb.ListFriendlinkReply, error) {
 	opt := &model.OptionGetFriendlinkList{
-		WithCount: true,
-		Page:      int(req.Page),
-		Size:      int(req.Size_),
+		WithCount:    true,
+		Page:         int(req.Page),
+		Size:         int(req.Size_),
+		SelectFields: req.Field,
 	}
 
 	_, err := s.checkPermission(ctx)
diff --git a/model/banner.go b/model/banner.go
index f68c518..db59542 100644
--- a/model/banner.go
+++ b/model/banner.go
@@ -37,11 +37,12 @@ func (m *DBModel) CreateBanner(banner *Banner) (err error) {
 // UpdateBanner 更新Banner，如果需要更新指定字段，则请指定updateFields参数
 func (m *DBModel) UpdateBanner(banner *Banner, updateFields ...string) (err error) {
 	db := m.db.Model(banner)
-
-	updateFields = m.FilterValidFields(Banner{}.TableName(), updateFields...)
-	if len(updateFields) > 0 { // 更新指定字段
-		db = db.Select(updateFields)
+	tableName := Banner{}.TableName()
+	updateFields = m.FilterValidFields(tableName, updateFields...)
+	if len(updateFields) == 0 {
+		updateFields = m.GetTableFields(tableName)
 	}
+	db = db.Select(updateFields)
 
 	err = db.Where("id = ?", banner.Id).Updates(banner).Error
 	if err != nil {
diff --git a/web/components/FormCategory.vue b/web/components/FormCategory.vue
index a51251d..48731df 100644
--- a/web/components/FormCategory.vue
+++ b/web/components/FormCategory.vue
@@ -159,7 +159,11 @@ export default {
         }
 
         if (this.category.id > 0) {
-          if (category.parent_id > 0 || category.parent_id.length > 0) {
+          if (
+            category.parent_id > 0 ||
+            (typeof category.parent_id === 'object' &&
+              category.parent_id.length > 0)
+          ) {
             category.cover = ''
           }
 
diff --git a/web/layouts/default.vue b/web/layouts/default.vue
index 70f6df2..db58939 100644
--- a/web/layouts/default.vue
+++ b/web/layouts/default.vue
@@ -57,11 +57,15 @@
           <div slot="header" class="clearfix">
             <strong>友情链接</strong>
           </div>
-          <el-link :underline="false" href="/article/about">书栈网</el-link>
-          <el-link :underline="false" href="/article/about"
-            >摩枫网络科技</el-link
+          <a
+            v-for="link in friendlinks"
+            :key="'fl-' + link.id"
+            :underline="false"
+            :href="link.link"
+            class="el-link el-link--default"
+            target="_blank"
+            >{{ link.title }}</a
           >
-          <el-link :underline="false" href="/article/about">卓一信息</el-link>
         </el-card>
       </div>
       <div class="footer-links">
@@ -112,16 +116,15 @@
   </el-container>
 </template>
 <script>
-import {
-  mapGetters,
-  //  mapActions,
-} from 'vuex'
+import { mapGetters, mapActions } from 'vuex'
+import { listFriendlink } from '~/api/friendlink'
 export default {
   data() {
     return {
       search: {
         wd: '',
       },
+      friendlinks: [],
     }
   },
   head() {
@@ -132,9 +135,22 @@ export default {
   computed: {
     ...mapGetters('user', ['user', 'token']),
   },
-  created() {},
+  async created() {
+    const [res] = await Promise.all([
+      listFriendlink({
+        enable: true,
+        field: ['id', 'title', 'link'],
+      }),
+      this.getCategories(),
+    ])
+    if (res.status === 200) {
+      this.friendlinks = res.data.friendlink
+    }
+  },
   mounted() {},
-  methods: {},
+  methods: {
+    ...mapActions('category', ['getCategories']),
+  },
 }
 </script>
 <style lang="scss">
diff --git a/web/pages/category.vue b/web/pages/category.vue
index 1a36b98..d215d6b 100644
--- a/web/pages/category.vue
+++ b/web/pages/category.vue
@@ -125,6 +125,7 @@
 </template>
 
 <script>
+import { mapGetters } from 'vuex'
 import { listCategory } from '~/api/category'
 import { categoryToTrees } from '~/utils/utils'
 export default {
@@ -146,6 +147,9 @@ export default {
       title: 'MOREDOC · 魔刀文库，开源文库系统',
     }
   },
+  computed: {
+    ...mapGetters('category', ['categories', 'categoryTrees']),
+  },
   watch: {
     filterText(val) {
       this.$refs.tree.filter(val)
diff --git a/web/pages/index.vue b/web/pages/index.vue
index c32eeaf..427655d 100644
--- a/web/pages/index.vue
+++ b/web/pages/index.vue
@@ -37,11 +37,17 @@
               <el-button class="btn-block" type="primary">立即登录</el-button>
             </el-form-item>
             <el-form-item style="margin-bottom: 5px">
-              <nuxt-link to="/" class="el-link el-link--info"
+              <nuxt-link
+                to="/findpassword"
+                title="找回密码"
+                class="el-link el-link--info"
                 ><small>忘记密码？</small></nuxt-link
               >
-              <nuxt-link to="/" class="float-right el-link el-link--info"
-                ><small>注册会员</small></nuxt-link
+              <nuxt-link
+                to="/register"
+                title="注册用户"
+                class="float-right el-link el-link--info"
+                ><small>注册用户</small></nuxt-link
               >
             </el-form-item>
           </el-form>
@@ -57,121 +63,58 @@
     </el-row>
     <div class="categories mgt-20px">
       <el-row :gutter="20">
-        <el-col :span="6">
-          <el-card class="box-card" shadow="never">
-            <div slot="header" class="clearfix">
-              <strong>编程开发</strong>
-            </div>
-            <nuxt-link class="el-link el-link--default" to="/"
-              >前端开发</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >后端开发</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >移动开发</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >游戏开发</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >硬件开发</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >开发工具</nuxt-link
-            >
-          </el-card>
-        </el-col>
-
-        <el-col :span="6">
-          <el-card class="box-card" shadow="never">
-            <div slot="header" class="clearfix">
-              <strong>设计·创作</strong>
-            </div>
-            <nuxt-link class="el-link el-link--default" to="/"
-              >云计算</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >大数据</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >数据库</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >云平台</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >网络/安全</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >人工智能</nuxt-link
-            >
-          </el-card>
-        </el-col>
-
-        <el-col :span="6">
-          <el-card class="box-card" shadow="never">
-            <div slot="header" class="clearfix">
-              <strong>系统运维</strong>
-            </div>
-            <nuxt-link class="el-link el-link--default" to="/">架构</nuxt-link>
-            <nuxt-link class="el-link el-link--default" to="/"
-              >服务器</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >操作系统</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >游戏开发</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >网络/安全</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >考试认证</nuxt-link
-            >
-          </el-card>
-        </el-col>
-
-        <el-col :span="6">
-          <el-card class="box-card" shadow="never">
-            <div slot="header" class="clearfix">
-              <strong>云计算·大数据</strong>
-            </div>
-            <nuxt-link class="el-link el-link--default" to="/"
-              >云计算</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >大数据</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >数据库</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >云平台</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >网络/安全</nuxt-link
-            >
-            <nuxt-link class="el-link el-link--default" to="/"
-              >人工智能</nuxt-link
-            >
-          </el-card>
-        </el-col>
+        <div
+          v-for="(category, index) in categoryTrees"
+          :key="'tree-' + category.id"
+        >
+          <el-col v-if="index < 4" :span="6">
+            <el-card class="box-card" shadow="never">
+              <div slot="header" class="clearfix">
+                <strong>{{ category.title }}</strong>
+              </div>
+              <nuxt-link
+                v-for="child in category.children"
+                :key="'child-' + child.id"
+                class="el-link el-link--default"
+                :to="{ path: '/category', query: { id: child.id } }"
+                >{{ child.title }}</nuxt-link
+              >
+            </el-card>
+          </el-col>
+        </div>
       </el-row>
     </div>
     <el-row :gutter="20" class="category-item">
-      <el-col v-for="i in 6" :key="'card-' + i" :md="12" :sm="12" :xs="24">
+      <el-col
+        v-for="category in categoryTrees"
+        :key="'card-cate-' + category.id"
+        :md="12"
+        :sm="12"
+        :xs="24"
+      >
         <el-card class="box-card mgt-20px" shadow="never">
           <div slot="header" class="clearfix">
-            <strong>卡片名称</strong>
-            <el-button style="float: right; padding: 3px 0" type="text"
-              >更多</el-button
+            <strong>{{ category.title }}</strong>
+            <nuxt-link :to="{ path: '/category', query: { id: category.id } }"
+              ><el-button style="float: right; padding: 3px 0" type="text"
+                >更多</el-button
+              ></nuxt-link
             >
           </div>
           <div>
             <div class="card-body-left hidden-xs-only">
-              <img src="/static/images/cover-news.png" alt="" />
+              <nuxt-link
+                :to="{ path: '/category', query: { id: category.id } }"
+              >
+                <el-image :src="category.cover">
+                  <div slot="error" class="image-slot">
+                    <img
+                      src="/static/images/cover-news.png"
+                      :alt="category.title"
+                    />
+                  </div>
+                </el-image>
+              </nuxt-link>
             </div>
             <div class="card-body-right">
               <nuxt-link class="el-link el-link--default" to="/document/"
@@ -198,6 +141,7 @@
 </template>
 
 <script>
+import { mapGetters } from 'vuex'
 export default {
   name: 'IndexPage',
   data() {
@@ -213,6 +157,9 @@ export default {
       title: 'MOREDOC · 魔刀文库，开源文库系统',
     }
   },
+  computed: {
+    ...mapGetters('category', ['categoryTrees']),
+  },
   async created() {},
   methods: {},
 }
@@ -255,13 +202,13 @@ export default {
         padding-bottom: 0;
       }
       .el-card__body {
-        padding: 20px 0;
+        padding: 15px 0;
       }
       a {
         display: inline-block;
         padding: 5px 0;
         text-decoration: none;
-        margin-right: 5px;
+        margin-right: 10px;
       }
     }
   }
@@ -295,8 +242,13 @@ export default {
       .card-body-left {
         width: 180px;
         padding-right: 20px;
+        .image-slot {
+          height: 145px;
+          overflow: hidden;
+        }
         img {
           width: 180px;
+          height: 145px;
         }
       }
       .card-body-right {
diff --git a/web/store/index.js b/web/store/index.js
index d548d93..95d4c42 100644
--- a/web/store/index.js
+++ b/web/store/index.js
@@ -2,12 +2,13 @@ import Vue from 'vue'
 import Vuex from 'vuex'
 import VuexPersistence from 'vuex-persist'
 import { user } from '~/store/module/user'
+import { category } from '~/store/module/category'
 
 Vue.use(Vuex)
 
 const vuexLocal = new VuexPersistence({
   storage: window.localStorage,
-  modules: ['user'],
+  modules: ['user', 'category'],
   key: 'moredoc',
 })
 
@@ -15,6 +16,7 @@ const store = () =>
   new Vuex.Store({
     modules: {
       user,
+      category,
     },
     plugins: [vuexLocal.plugin],
   })
diff --git a/web/store/module/category.js b/web/store/module/category.js
new file mode 100644
index 0000000..ecf92c3
--- /dev/null
+++ b/web/store/module/category.js
@@ -0,0 +1,32 @@
+import { listCategory } from '~/api/category'
+import { categoryToTrees } from '~/utils/utils'
+export const category = {
+  namespaced: true,
+  state: {
+    categories: [],
+  },
+  mutations: {
+    setCategories(state, categories) {
+      state.categories = categories
+    },
+  },
+  actions: {
+    async getCategories({ commit }) {
+      const res = await listCategory({
+        field: ['id', 'title', 'parent_id', 'cover', 'doc_count', 'enable'],
+      })
+      if (res.status === 200) {
+        commit('setCategories', res.data.category)
+      }
+      return res
+    },
+  },
+  getters: {
+    categories(state) {
+      return state.categories
+    },
+    categoryTrees(state) {
+      return categoryToTrees(state.categories)
+    },
+  },
+}