:bugs: 返回上一页丢失分页信息问题修复

components/common/topic/main.vue

@@ -31,7 +31,7 @@
     methods: {
       handleSelectTopic(item) {
         this.$router.push({
-          path: '/topic/' + item
+          path: `/topic/${item}?page=1`
         });
       }
     }

components/layouts/pc/header.vue

@@ -182,7 +182,7 @@ export default {
         switch (item) {
           case 'topic':
             _ts.$router.push({
-              path: '/topic/news'
+              path: '/topic/news?page=1'
             })
             break;
           case 'github':

pages/index.vue

@@ -9,8 +9,15 @@
 
 export default {
   name: 'Index',
-    fetch() {
-      return this.$store.dispatch('article/fetchList', {page: 1})
+  fetch({store, query}) {
+    return Promise.all([
+      store.dispatch('article/fetchList', {page: query.page || 1})
+    ])
+  },
+  watch: {
+    '$route.query': function () {
+      this.$store.dispatch('article/fetchList', {page: this.$route.query.page || 1})
+    }
   },
   components: {
     ArticleList
@@ -22,7 +29,12 @@
   },
   methods: {
     currentChangeArticle(page) {
-        this.$store.dispatch('article/fetchList', {page: page})
+      this.$router.push({
+        name: 'index',
+        query: {
+          page: page
+        }
+      })
     }
   },
   mounted() {

pages/portfolio/_portfolio_id.vue

@@ -43,7 +43,8 @@
     validate({params, store}) {
       return params.portfolio_id && !isNaN(Number(params.portfolio_id))
     },
-    fetch({store, params, error}) {
+    fetch({store, params, query, error}) {
+      params.page = query.page || 1
       return Promise.all([
         store
           .dispatch('portfolio/fetchDetail', params)
@@ -51,6 +52,14 @@
         store.dispatch('portfolio/fetchArticleList', params)
       ])
     },
+    watch: {
+      '$route.query': function () {
+        this.$store.dispatch('portfolio/fetchArticleList', {
+          page: this.$route.query.page || 1,
+          portfolio_id: this.routePortfolioId
+        })
+      }
+    },
     computed: {
       ...mapState({
         portfolio: state => state.portfolio.detail.data,
@@ -134,7 +143,11 @@
         )
       },
       currentChangeArticle(page) {
-        this.$store.dispatch('portfolio/fetchArticleList', {page: page, portfolio_id: this.routePortfolioId})
+        this.$router.push(
+          {
+            path: `/portfolio/${this.routePortfolioId}?page=${page}`
+          }
+        )
       }
     },
     mounted() {

pages/topic/_topic_uri.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="topic-archive-page">
     <topic-nav :currentTopic="defaultParams.topic_uri"></topic-nav>
-    <article-list :articles="articles" @currentChange="currentChangeArticle"/>
+    <article-list :articles="articles" @currentChange="currentChangeArticle"></article-list>
   </div>
 </template>
 
@@ -22,8 +22,20 @@
       topic => topic.topicUri === params.topic_uri
     )
   },
-    fetch({store, params}) {
-      return store.dispatch('article/fetchList', params)
+  fetch({store, params, query}) {
+    params.page = query.page || 1
+    return Promise.all([
+      store.dispatch('article/fetchList', params)
+    ])
+  },
+  watch: {
+    '$route.query': function () {
+      let _ts = this
+      _ts.$store.dispatch('article/fetchList', {
+        topic_uri: _ts.defaultParams.topic_uri,
+        page: _ts.defaultParams.page || 1
+      })
+    }
   },
   computed: {
     ...mapState({
@@ -39,13 +51,16 @@
     },
     defaultParams() {
       return {
-          topic_uri: this.$route.params.topic_uri
+        topic_uri: this.$route.params.topic_uri,
+        page: this.$route.query.page || 1
       }
     }
   },
   methods: {
     currentChangeArticle(page) {
-        this.$store.dispatch('article/fetchList', {page: page, topic_uri: this.defaultParams.topic_uri})
+      this.$router.push({
+        path: `/topic/${this.defaultParams.topic_uri}?page=${page}`
+      })
     }
   },
   mounted() {

pages/user/_nickname.vue

@@ -12,11 +12,24 @@
           <h3 class="mb-3">{{ user.nickname }}</h3>
           <p class="mb-4" v-html="user.signature"></p>
           <div v-if="userExtend" style="margin-bottom: 1rem;">
-            <el-link v-if="userExtend.blog" class="user-link" title="博客" :underline="false" :href="userExtend.blog" target="_blank"><font-awesome-icon :icon="['fas', 'link']"></font-awesome-icon></el-link>
-            <el-link v-if="userExtend.github" class="user-link" title="github" :underline="false" :href="'https://github.com/' + userExtend.github" target="_blank"><font-awesome-icon :icon="['fab', 'github']"></font-awesome-icon></el-link>
-            <el-link v-if="userExtend.weibo" class="user-link" title="微博" :underline="false" :href="'https://weibo.com/n/' + userExtend.weibo" target="_blank"><font-awesome-icon :icon="['fab', 'weibo']"></font-awesome-icon></el-link>
-            <el-link v-if="userExtend.weixin" class="user-link" title="微信" :underline="false" :href="userExtend.weixin"><font-awesome-icon :icon="['fab', 'weixin']" target="_blank"></font-awesome-icon></el-link>
-            <el-link v-if="userExtend.qq" class="user-link" title="QQ" :underline="false" :href="userExtend.qq"><font-awesome-icon :icon="['fab', 'qq']" target="_blank"></font-awesome-icon></el-link>
+            <el-link v-if="userExtend.blog" class="user-link" title="博客" :underline="false" :href="userExtend.blog"
+                     target="_blank">
+              <font-awesome-icon :icon="['fas', 'link']"></font-awesome-icon>
+            </el-link>
+            <el-link v-if="userExtend.github" class="user-link" title="github" :underline="false"
+                     :href="'https://github.com/' + userExtend.github" target="_blank">
+              <font-awesome-icon :icon="['fab', 'github']"></font-awesome-icon>
+            </el-link>
+            <el-link v-if="userExtend.weibo" class="user-link" title="微博" :underline="false"
+                     :href="'https://weibo.com/n/' + userExtend.weibo" target="_blank">
+              <font-awesome-icon :icon="['fab', 'weibo']"></font-awesome-icon>
+            </el-link>
+            <el-link v-if="userExtend.weixin" class="user-link" title="微信" :underline="false" :href="userExtend.weixin">
+              <font-awesome-icon :icon="['fab', 'weixin']" target="_blank"></font-awesome-icon>
+            </el-link>
+            <el-link v-if="userExtend.qq" class="user-link" title="QQ" :underline="false" :href="userExtend.qq">
+              <font-awesome-icon :icon="['fab', 'qq']" target="_blank"></font-awesome-icon>
+            </el-link>
           </div>
           <div v-if="oauth">
             <div v-if="oauth.idUser !== user.idUser">
@@ -72,7 +85,8 @@ export default {
   validate({params, store}) {
     return params.nickname
   },
-  fetch({store, params, error}) {
+  fetch({store, params, query, error}) {
+    params.page = query.page || 1
     return Promise.all([
       store
         .dispatch('user/fetchDetail', params)
@@ -84,6 +98,38 @@ export default {
       store.dispatch('user/fetchFollowingList', params)
     ])
   },
+  watch: {
+    '$route.query': function () {
+      let _ts = this;
+      _ts.$set(_ts, 'activeTab', _ts.$route.query.tab)
+      switch (_ts.activeTab) {
+        case "0":
+          _ts.$store.dispatch('user/fetchArticleList', {
+            nickname: this.$route.params.nickname,
+            page: this.$route.query.page || 1
+          })
+          break;
+        case "1":
+          _ts.$store.dispatch('user/fetchPortfolioList', {
+            nickname: this.$route.params.nickname,
+            page: this.$route.query.page || 1
+          })
+          break;
+        case "2":
+          _ts.$store.dispatch('user/fetchFollowerList', {
+            nickname: this.$route.params.nickname,
+            page: this.$route.query.page || 1
+          })
+          break;
+        default:
+          _ts.$store.dispatch('user/fetchFollowingList', {
+            nickname: this.$route.params.nickname,
+            page: this.$route.query.page || 1
+          })
+          break
+      }
+    }
+  },
   computed: {
     ...mapState({
       user: state => state.user.data,
@@ -103,19 +149,25 @@ export default {
   },
   methods: {
     currentChangeArticle(page) {
-      this.$store.dispatch('user/fetchArticleList', {page: page, nickname: this.$route.params.nickname})
+      this.onRouter(0, page)
     },
     currentChangePortfolio(page) {
-      this.$store.dispatch('user/fetchPortfolioList', {page: page, nickname: this.$route.params.nickname})
+      this.onRouter(1, page)
     },
     currentChangeFollowing(page) {
-      this.$store.dispatch('user/fetchFollowingList', {page: page, nickname: this.$route.params.nickname})
+      this.onRouter(2, page)
     },
     currentChangeFollower(page) {
-      this.$store.dispatch('user/fetchFollowerList', {page: page, nickname: this.$route.params.nickname})
+      this.onRouter(3, page)
     },
     handleToggleTab(key) {
-      this.$set(this, 'activeTab', key);
+      this.onRouter(key, 1)
+    },
+    onRouter(key, page) {
+      this.$router.push({
+        path: `/user/${this.$route.params.nickname}?tab=${key}&page=${page}`
+      })
+
     },
     gotoChats() {
       let _ts = this;