话题页面对接完成

action/config.js

@@ -77,7 +77,7 @@ export default  {
         search:'/api/topic/search',//检索话题
         list:'/api/topics' , //话题列表
         postList:'/api/topic/' ,//获取话题下的所有动态 +{topicName}/posts
-        hotList:'/api/topic/hots',//获取热门动态
+        hotList:'/api/topic/hots',//获取热门话题
         hotSearch:'/api/topic/hotSearch',//获取热搜话题
         recommendsPost:'/api/topic/',//获取话题下的推荐动态 +{topicName}/post/recommends
         contributes:'/api/topic/',//话题贡献榜 +{topicId}/contributes

components/pc/alertsMessage/alertsCard.vue

@@ -15,7 +15,7 @@
           v-if="reload"
         ></alerts-content>
       </div>
-      <div class="alerts-card__footer" v-if="false">
+      <div class="alerts-card__footer">
         <nuxt-link to="/personal-center/message">查看全部 （ {{ unread }} ） </nuxt-link>
       </div>
     </div>

pages/topic/index.vue

@@ -12,10 +12,12 @@
           width="816px"
           :title="labelTitle"
         >
+          <!--<empty-card v-if="topicList.length === 0" height="556px"></empty-card>-->
+
           <topic-card v-for="(val,index) in topicList" :key="val.topicId" :info="val"></topic-card>
         </card-container>
         <div class="pagination">
-          <pagination style="margin: 0 auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
+          <pagination style="margin: 0 auto;" ref="pagination" :pages="pages" v-on:listenPageChange="changePage"></pagination>
         </div>
       </div>
       <div class="topic-container__right">
@@ -42,9 +44,10 @@ import CardContainer from "../../components/pc/cardContainer";
 import Pagination from "../../components/pc/pagination";
 import TopicCard from "../../components/pc/topicCard";
 import config from '../../action/config';
+import EmptyCard from "../../components/pc/emptyCard";
 
 export default {
-  components: {TopicCard, Pagination, CardContainer, NavWrap},
+  components: {EmptyCard, TopicCard, Pagination, CardContainer, NavWrap},
   data(){
     return{
       list: [
@@ -70,7 +73,6 @@ export default {
         }
       ],
       topicList:[],
-      currentPage:1,
       pages:1,
       hotTopicList:[],
     }
@@ -84,19 +86,20 @@ export default {
 
     });
     this.dataGetHotTopic();
-
   },
   computed: {
     labelTitle: function () {
       return this.$route.query.type + '话题'
     }
   },
-  mounted(){
-
+  watch: {
+    $route: function (val) {
+      this.restartPagination();
+    }
   },
   methods:{
+    // 最新的话题列表
     dataGetTopicList(currentPage){
-
       this.$axios.$get(config.api.get.Topic.list,{
         params:{
           page:currentPage,
@@ -108,6 +111,45 @@ export default {
       })
 
     },
+    // 推荐话题
+    dataGetRecommendTopicList(currentPage){
+      this.$axios.$get(config.api.get.Topic.hotSearch,{
+        params:{
+          page:currentPage,
+          size:10
+        }
+      }).then((response)=>{
+        this.topicList = response.data.dataList;
+        this.pages = response.data.totalPage;
+      })
+    },
+    // 关注的话题
+    dataGetFollowedTopicList(currentPage) {
+      this.$axios.$get(config.api.get.Topic.myfollowedList,{
+        params:{
+          page:currentPage,
+          size:10
+        }
+      }).then((response)=>{
+        this.topicList = response.data.records;
+        this.topicList.forEach(item => {
+          item.followedTopic = item.userId !== this.$store.state.userProfile.userId;
+        });
+        this.pages = response.data.pages;
+      })
+    },
+    // 热门话题
+    dataGetHotTopicList(currentPage) {
+      this.$axios.$get(config.api.get.Topic.hotList,{
+        params:{
+          page:currentPage,
+          size:10
+        }
+      }).then((response)=>{
+        this.topicList = response.data.dataList;
+        this.pages = response.data.totalPage;
+      })
+    },
 
     dataGetHotTopic(){
       this.$axios.$get(config.api.get.Topic.hotSearch,{
@@ -119,9 +161,22 @@ export default {
         this.hotTopicList = response.data.dataList;
       })
     },
+    restartPagination(){
+      if(process.browser){
+        this.$refs.pagination.setCurrentPage(1)
+      }
+    },
     changePage(currentPage){
       //返回页数 请求新的数据
-      this.dataGetTopicList(currentPage);
+      if (this.$route.query.type === '最新') {
+        this.dataGetTopicList(currentPage);
+      } else if (this.$route.query.type === '热门') {
+        this.dataGetHotTopicList(currentPage);
+      } else if (this.$route.query.type === '关注') {
+        this.dataGetFollowedTopicList(currentPage);
+      } else if (this.$route.query.type === '推荐') {
+        this.dataGetRecommendTopicList(currentPage);
+      }
     }
   },
 }