Merge remote-tracking branch 'origin/master'

components/common/comment/main.vue

@@ -136,10 +136,7 @@
       onRouter(name, data) {
         this.$router.push(
           {
-            name: name,
+            path: '/user/' + data
-            params: {
-              id: data
-            }
           }
         )
       },

package.json

@@ -11,18 +11,18 @@
   },
   "dependencies": {
     "@chenfengyuan/vue-qrcode": "^1.0.2",
-    "@nuxtjs/axios": "^5.12.1",
+    "@nuxtjs/axios": "^5.12.2",
     "babel-plugin-lodash": "^3.3.4",
     "cookieparser": "^0.1.0",
-    "echarts": "^4.8.0",
+    "echarts": "^4.9.0",
     "element-ui": "^2.13.2",
     "express": "^4.17.1",
     "js-cookie": "^2.2.1",
-    "nuxt": "^2.14.1",
+    "nuxt": "^2.14.5",
     "save-svg-as-png": "^1.4.17",
     "socket.io": "^2.3.0",
     "socket.io-client": "^2.3.0",
-    "vditor": "^3.4.6",
+    "vditor": "^3.5.3",
     "vuejs-avataaars": "^4.0.1"
   },
   "devDependencies": {

pages/notification.vue

@@ -13,6 +13,7 @@
 
   export default {
     name: "Notification",
+    middleware: 'authenticated',
     components: {
       NotificationList
     },

pages/user/_nickname.vue

@@ -7,13 +7,19 @@
         <div v-else class="card-header"
              :style="{backgroundImage:'url(https://static.rymcu.com/article/1574441651963.jpg)', backgroundSize:'cover', backgroundPosition:'50%'}"></div>
         <div class="card-body text-center">
-          <img v-if="user.avatarUrl" class="card-profile-img" :src="user.avatarUrl">
+          <img v-if="user.avatarUrl" class="card-profile-img-avatar" :src="user.avatarUrl">
           <img v-else class="card-profile-img" src="https://static.rymcu.com/article/1578475481946.png">
-          <h3 class="mb-3">{{user.nickname}}</h3>
+          <h3 class="mb-3">{{ user.nickname }}</h3>
           <p class="mb-4" v-html="user.signature"></p>
           <div v-if="oauth && oauth.idUser !== user.idUser">
+            <el-button type="primary" v-if="isFollow" @click="cancelFollowUser(user.idUser)">取消关注</el-button>
+            <el-button type="primary" v-else @click="followUser(user.idUser)">关注</el-button>
             <el-button @click="gotoChats">聊天</el-button>
           </div>
+          <div v-else>
+            <el-button type="primary" @click="login">关注</el-button>
+            <el-button @click="login">聊天</el-button>
+          </div>
         </div>
       </div>
     </el-col>
@@ -38,11 +44,11 @@
 </template>
 
 <script>
-  import {mapState} from 'vuex';
+import {mapState} from 'vuex';
-  import ArticleList from "~/components/archive/list";
+import ArticleList from "~/components/archive/list";
-  import PortfolioList from "~/components/common/portfolio/list";
+import PortfolioList from "~/components/common/portfolio/list";
 
-  export default {
+export default {
   name: "User",
   components: {ArticleList, PortfolioList},
   validate({params, store}) {
@@ -67,7 +73,8 @@
   },
   data() {
     return {
-        activeTab: '0'
+      activeTab: '0',
+      isFollow: false
     }
   },
   methods: {
@@ -85,24 +92,69 @@
       _ts.$router.push({
         path: `/chats/${_ts.user.nickname}`
       })
+    },
+    followUser(idUser) {
+      let _ts = this;
+      if (_ts.oauth) {
+        _ts.$axios.$post('/api/follow', {
+          followingId: idUser,
+          followingType: 0
+        }).then(function (res) {
+          _ts.$set(_ts, 'isFollow', res);
+        })
+      } else {
+        _ts.login()
+      }
+    },
+    cancelFollowUser(idUser) {
+      let _ts = this;
+      if (_ts.oauth) {
+        _ts.$axios.$post('/api/follow/cancel-follow', {
+          followingId: idUser,
+          followingType: 0
+        }).then(function (res) {
+          _ts.$set(_ts, 'isFollow', res);
+        })
+      } else {
+        _ts.login()
+      }
+    },
+    login() {
+      this.$router.push({
+        path: '/login'
+      })
+    }
+  },
+  mounted() {
+    let _ts = this;
+    this.$store.commit('setActiveMenu', 'user')
+    if (_ts.oauth) {
+      _ts.$axios.$get('/api/follow/is-follow', {
+        params: {
+          followingId: _ts.user.idUser,
+          followingType: 0
+        }
+      }).then(function (res) {
+        _ts.$set(_ts, 'isFollow', res);
+      })
     }
   }
-  }
+}
 </script>
 
 <style scoped>
-  body {
+body {
   overflow-x: hidden;
-  }
+}
 
-  .card {
+.card {
   box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
   position: relative;
   margin-bottom: 1.5rem;
   width: 100%;
-  }
+}
 
-  .card {
+.card {
   position: relative;
   display: -ms-flexbox;
   display: flex;
@@ -114,18 +166,18 @@
   background-clip: border-box;
   border: 1px solid rgba(0, 40, 100, 0.12);
   border-radius: 3px;
-  }
+}
 
-  .card-profile .card-header {
+.card-profile .card-header {
   height: 20rem;
   background-size: cover;
-  }
+}
 
-  .card-header:first-child {
+.card-header:first-child {
   border-radius: calc(3px - 1px) calc(3px - 1px) 0 0;
-  }
+}
 
-  .card-header {
+.card-header {
   background: none;
   padding: 0.5rem 1.5rem;
   display: -ms-flexbox;
@@ -133,77 +185,88 @@
   min-height: 3.5rem;
   -ms-flex-align: center;
   align-items: center;
-  }
+}
 
-  .card-header {
+.card-header {
   padding: 1.5rem 1.5rem;
   margin-bottom: 0;
   background-color: rgba(0, 0, 0, 0.03);
   border-bottom: 1px solid rgba(0, 40, 100, 0.12);
-  }
+}
 
-  .card-body {
+.card-body {
   -ms-flex: 1;
   flex: 1;
   margin: 0;
   padding: 1.5rem 1.5rem;
   position: relative;
-  }
+}
 
-  .card-profile-img {
+.card-profile-img {
-    max-width: 6rem;
+  max-width: 16rem;
-    margin-top: -5rem;
+  margin-top: -7rem;
   margin-bottom: 1rem;
   border: 3px solid #fff;
   border-radius: 100%;
   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
   background-color: #ffffff;
-  }
+}
 
-  .card-img-top {
+.card-profile-img-avatar {
+  max-width: 16rem;
+  height: auto;
+  margin-top: -10rem;
+  margin-bottom: 1rem;
+  border: 3px solid #fff;
+  border-radius: 100%;
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
+  background-color: #ffffff;
+}
+
+.card-img-top {
   border-top-left-radius: 3px;
   border-top-right-radius: 3px;
-  }
+}
 
-  .card-img-top {
+.card-img-top {
   width: 100%;
   border-top-left-radius: calc(3px - 1px);
   border-top-right-radius: calc(3px - 1px);
-  }
+}
 
-  .mb-3, .my-3 {
+.mb-3, .my-3 {
   margin-bottom: 0.75rem !important;
-  }
+}
 
-  h3, .h3 {
+h3, .h3 {
   font-size: 1.5rem;
-  }
+}
 
-  .mb-4, .my-4 {
+.mb-4, .my-4 {
   margin-bottom: 1rem !important;
-  }
+}
 
-  .article-header-md {
+.article-header-md {
   position: relative;
   line-height: 1.4em;
   height: 1.4em;
   overflow: hidden;
-  }
+}
 
-  .article-header-md a {
+.article-header-md a {
   font-weight: bold;
   font-size: 1em;
-  }
+}
 
-  .article-summary-md {
+.article-summary-md {
   position: relative;
   line-height: 1.4em;
   height: 4.2em;
   overflow: hidden;
-  }
+}
 
-  .el-col-6 {
+.el-col-6 {
   padding-right: 0.75rem;
   padding-left: 0.75rem;
-  }
+}
 </style>

pages/user/settings/account.vue

@@ -119,7 +119,7 @@
         if (res && res.data && res.data.url) {
           let user = _ts.user;
           user.avatarUrl = res.data.url;
-          user.avatarType = '';
+          user.avatarType = '0';
           _ts.$set(_ts, 'user', user);
           _ts.$set(_ts, 'svgShow', false);
           _ts.$set(_ts, 'avatarUrl', res.data.url);
@@ -149,6 +149,7 @@
             } else {
               _ts.$set(_ts, 'user', res.user);
               _ts.$set(_ts, 'avatarUrl', res.user.avatarUrl);
+              _ts.$set(_ts, 'svgShow', false);
             }
           }
         })