update：完善README说明文件

Author: geekape

README.md

@@ -1,40 +1,43 @@
-#  极客猿梦导航
+# 极客猿梦导航
 
-> 面向独立开发者的导航站
+> 致力于打造一个互联网更为全面的导航站点！
 
-## 简介
-极客猿梦导航，致力于方便独立开发者/程序员寻找各种网络资源。
+预览: [➡️ http://navigation.zcbing.cn/](http://navigation.zcbing.cn/)
 
-以前，我有很多导航资源，我都把它们收集在浏览器收藏夹中，可到一定量后，我发现想找一些网站不容易，因为当时添加它也没有做明确的备注，现在我将导航添加到**极客猿梦导航站**中，每个网站都包含一些子信息，尽管你不添加，还是会比收藏夹里面的更好找一点。
-
-## V1.0版本
+## V1.0 版本
 
 - [老版本纯静态导航版](https://github.com/geekape/geek-navigation/tree/master)：最初的一版静态页面，数据都写在页面里的。
 
-- [JSON静态导航版](https://github.com/geekape/geek-navigation/tree/json-navigation)：数据和页面分享，可以部署在`github`或`gitee`上使用，将dist目录下的文件上传到远程仓库里访问。
+- [JSON 静态导航版](https://github.com/geekape/geek-navigation/tree/json-navigation)：数据和页面分享，可以部署在`github`或`gitee`上使用，将 dist 目录下的文件上传到远程仓库里访问。
 
 - [数据库动态导航版](https://github.com/geekape/geek-navigation/tree/vue2)：功能最全的版本，后续会增加更多功能
 
 ## v2.0
-- vue全家桶
+
+- vue 全家桶
 - elementUI
 
-⚠️ 用户提交网站，只需要填写网站url和分类，提交后爬虫会补信息，如logo，标题和描述。
+⚠️ 用户提交网站，只需要填写网站 url 和分类，提交后爬虫会补信息，如 logo，标题和描述。
 
 ### TODO
-- [ ] mongoose联表优化
-- [x] 首页加keep-live
+
+- [ ] mongoose 联表优化
+- [x] 首页加 keep-live
 - [ ] 增加喜欢和浏览量
 - [ ] 增加提交作者名，信息
 - [ ] 增加搜索
 - [ ] 分页等接口优化
 - [ ] 审核列表状态切换
 - [ ] 提交排除重复网站
 - [ ] 自动化部署
+- [ ] 常用分类
+- [ ] 最近添加
+- [ ] 优化 README 文档
+
 - [x] 一键拒绝审核列表
 - [x] 后台网站编辑更新
 - [x] 爬虫爬取失败手动填写
-- [x] 验证url
+- [x] 验证 url
 - [x] websitelist
 - [x] 审核网站爬虫自动补全信息
 - [x] 用户登录，默认第一次登录账号为管理员
@@ -47,28 +50,29 @@
 
 ![分类页](./images/navigation_category.jpg)
 
-
 ## 友情提示
 
-- 如果你对这个项目有兴趣，可点`star`保持关注，当然，你也可以`Fork`代码，自己完善这个项目，你愿意的话可以`pull`到我仓库来合并。
-
-- 你如果遇到什么困难或bug，随时可以在[issues](https://github.com/geekape/geek-navigation/issues)提出，我会尽快解决。
-
+> 一个好的产品，是需要不断打磨和完善的。
 
+- 如果你对这个项目有兴趣，可点`star`保持关注。
+- 有什么建议和问题都可提[issues](https://github.com/geekape/geek-navigation/issues)或者加 qq 群
 
 ## 常见问题
+
 - [已解决的问题列表](https://github.com/geekape/geek-navigation/issues?q=is%3Aissue+is%3Aclosed)
 
-### 1. 什么是数据库版？什么是静态JSON版本？
-为了方便无需配置数据库的小白，提供了静态[JSON版本的导航](https://github.com/geekape/geek-navigation/tree/json-navigation)，静态版本只能本地修改JSON添加导航，没有管理后台。
+### 1. 什么是数据库版？什么是静态 JSON 版本？
+
+为了方便无需配置数据库的小白，提供了静态[JSON 版本的导航](https://github.com/geekape/geek-navigation/tree/json-navigation)，静态版本只能本地修改 JSON 添加导航，没有管理后台。
 
-而相对于静态版的××数据库版本**，它提供了管理导航的界面，用户可在线提交网站，后台审核，并管理所有网站（推荐）
+而相对于静态版的 ×× 数据库版本\*\*，它提供了管理导航的界面，用户可在线提交网站，后台审核，并管理所有网站（推荐）
 
+### 2. 本地 mongodb 没导航数据？
 
-### 2. 本地mongodb没导航数据？
-运行爬虫文件`node reptile.js`,确保你已经开启了本地Mongodb数据库，就可以爬导航到本地的数据库了
+运行爬虫文件`node reptile.js`,确保你已经开启了本地 Mongodb 数据库，就可以爬导航到本地的数据库了
 
 ### 3. 本地运行
+
 ```js
 // 1. 下载代码
 git clone git@github.com:geekape/geek-navigation.git
@@ -77,7 +81,7 @@ git clone [email protected]:geekape/geek-navigation.git
 npm i 或者 cnpm i
 
 // 3.假设已启动mongodb，启动本地服务器
-node server/app.js
+nodemon server/app.js
 
 // 4. 运行项目
 npm run serve
@@ -86,6 +90,10 @@ npm run serve
 http://localhost:8080
 ```
 
+## 前端交流学习
 
+---
 
-
+| 个人微信号(zcb861013016)         | QQ 交流群(361979424)        |
+| -------------------------------- | --------------------------- |
+| ![](./images/wechat_qrcode.jpeg) | ![](./images/qq_qrcode.jpg) |

images/qq_qrcode.jpg

@@ -0,0 +1,52 @@
+@font-face {font-family: "iconfont";
+  src: url('//at.alicdn.com/t/font_552690_usafnl8v0n.eot?t=1577611984754'); /* IE9 */
+  src: url('//at.alicdn.com/t/font_552690_usafnl8v0n.eot?t=1577611984754#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
+  url('//at.alicdn.com/t/font_552690_usafnl8v0n.woff?t=1577611984754') format('woff'),
+  url('//at.alicdn.com/t/font_552690_usafnl8v0n.ttf?t=1577611984754') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
+  url('//at.alicdn.com/t/font_552690_usafnl8v0n.svg?t=1577611984754#iconfont') format('svg'); /* iOS 4.1- */
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-appreciate:before {
+  content: "\e644";
+}
+
+.icon-search:before {
+  content: "\e65c";
+}
+
+.icon-add:before {
+  content: "\e6da";
+}
+
+.icon-appreciatefill:before {
+  content: "\e6e3";
+}
+
+.icon-rank:before {
+  content: "\e722";
+}
+
+.icon-attentionfill:before {
+  content: "\e73c";
+}
+
+.icon-attention:before {
+  content: "\e73d";
+}
+
+.icon-my_light:before {
+  content: "\e7d5";
+}
+
+.icon-daohang1:before {
+  content: "\e63d";
+}

images/wechat_qrcode.jpeg

@@ -24,10 +24,6 @@
     // -webkit-box-pack: center;
     // justify-content: center;
     margin-left: 248px;
-    .iconfont {
-      font-size: 18px;
-      color: #000000;
-    }
   }
 }
 

src/assets/StrawberryIcon-pro.ttf

@@ -137,11 +137,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.add-classify-btn {
-  color: $color-blue;
-  cursor: pointer;
-  max-width: 200px;
-}
+
 .el-icon-folder-add {
   margin-right: 5px;
 }

src/assets/font.css

@@ -9,8 +9,8 @@ const Storage = new localStorage('NAV')
 Vue.config.productionTip = false
 import './app.scss';
 
-import './assets/styles/iconfont.css';
-import './assets/styles/font.css';
+import './assets/styles/style.scss';
+import './assets/font.css';
 import ElementUI from 'element-ui';
 import 'element-ui/lib/theme-chalk/index.css';
 Vue.use(ElementUI);

src/assets/img/favicon.ico

@@ -13,7 +13,6 @@
             text-color="#6b7386"
             active-text-color="#fff"
             :default-openeds="defaultOpeneds"
-            @open="defaultOpeneds=[$event, ...defaultOpeneds]"
             default-active="0-0"
           >
             <el-submenu

src/assets/img/not-website.png

@@ -7,6 +7,10 @@
       </div>
       <div class="desc">{{ data.desc || '这个网站什么描述也没有...' }}</div>
     </a>
+    <!-- <div class="website-item__footer">
+      <span class="iconfont icon-attentionfill"></span>123
+      <span class="iconfont icon-appreciatefill"></span>123
+    </div> -->
   </el-col>
 </template>
 
@@ -25,8 +29,20 @@ export default {
 
 <style lang="scss" scoped>
 .website-item {
-  font-size: 16px;
+  font-size: 12px;
   margin-bottom: 10px;
+  color: #999;
+
+  .iconfont {
+    margin-left: 15px;
+  }
+
+  &__footer {
+    border-top: 1px solid #f2f2f2;
+    background: #fff;
+    padding: 10px 15px;
+    text-align: right;
+  }
 }
 
 .info {
@@ -69,11 +85,11 @@ export default {
 .title {
   color: #3273dc;
   @include text-overflow;
+  font-size: 16px;
 }
 
 .desc {
   color: gray;
-  font-size: 12px;
   padding-top: 10px;
   @include text-overflow;
 }

src/assets/styles/_common.scss

@@ -18,7 +18,7 @@ module.exports = {
             sass: {
                 // @/ is an alias to src/
                 // so this assumes you have a file named `src/variables.scss`
-                data: `@import "@/assets/styles/style.scss";`
+                // data: `@import "@/assets/styles/style.scss";`
             }
 
         }