解决合并冲突

pages/blog/index.vue

+<template>
+  <div class="blog-container">
+    <div class="blog-container__main">
+      <div class="blog-container__left">
+        <nav-wrap
+          width="106px"
+          :list="list"
+        ></nav-wrap>
+      </div>
+      <div class="blog-container__center">
+        <card-container
+          width="816px"
+          height="1012px"
+          :title="labelTitle"
+        >
+
+          <blog-card v-for="(val,index) in blogList" :key="val.blogId" :info="val"></blog-card>
+
+        </card-container>
+        <div class="pagination">
+          <pagination style="margin: 0 auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
+        </div>
+      </div>
+      <div class="blog-container__right">
+        <div class="right__write-blog" @click="toRelease">写文章</div>
+        <card-container
+          title="热门博主"
+          label="换一换"
+          more="更多"
+          width="302px"
+          height="446px"
+          style="margin-top: 16px"
+        ></card-container>
+        <card-container
+          title="热门标签"
+          width="302px"
+          height="446px"
+          style="margin-top: 16px"
+        ></card-container>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import NavWrap from "../../components/pc/nav/navWrap";
+import CardContainer from "../../components/pc/cardContainer";
+
+import Pagination from "../../components/pc/pagination";
+import config from '../../action/config';
+import BlogCard from "../../components/pc/projectCard";
+export default {
+
+  components: {Pagination, CardContainer, NavWrap,BlogCard},
+  data(){
+    return{
+      blogList:[],
+      currentPage:1,
+      pages:1,
+      list: [
+
+        {
+          label: '全部类型',
+          address: '/blog',
+          id: '全部类型'
+        },
+        {
+          label: '程序人生',
+          address: '/blog',
+          id: '程序人生'
+        },
+        {
+          label: '移动开发',
+          address: '/blog',
+          id: '移动开发'
+        },
+        {
+          label: '前端',
+          address: '/blog',
+          id: '前端'
+        },
+        {
+          label: '其他',
+          address: '/blog',
+          id: '其他'
+        }
+      ]
+    }
+  },
+  created() {
+    this.$router.replace({
+      path: '/blog',
+      query: {
+        id: '全部类型'
+      }
+    });
+  },
+  computed: {
+    labelTitle: function () {
+      return this.$route.query.id
+    }
+  },
+  methods: {
+
+    dataGetBlogList(currentPage){
+      this.$axios.$get(config.api.get.Blog.list,{
+        params:{
+          page:currentPage,
+          size:7,
+        }
+      }).then((response)=>{
+        this.blogList=response.data.dataList;
+        this.pages = response.data.totalPage;
+      })
+    },
+
+    toRelease(){
+      this.$router.push('/blog/release')
+    },
+    changePage(currentPage){
+      //返回页数 请求新的数据
+      this.dataGetBlogList(currentPage)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.blog-container{
+  > .blog-container__main{
+    width: $pageWidth;
+    margin: 0 auto;
+    padding-top: 16*$length;
+    padding-bottom: 32*$length;
+    @extend %flex-row-spb;
+    align-items: start;
+    .blog-container__left{}
+    .blog-container__center{
+      .pagination{
+        margin: 32*$length;
+      }
+    }
+    .blog-container__right{
+      .right__write-blog{
+        width: 302*$length;
+        background-color: #fff;
+        @include fontStyle(14,56,500,#00AAE6,center);
+        @include border-radius(4*$length);
+        @extend %animate-transition;
+        @extend %cursorPointer;
+        &:hover {
+          color: #fff;
+          background-color: #00AAE6;
+        }
+      }
+    }
+  }
+}
+</style>