inleft
2022-02-21 63f5119bcc714c36fe8db21e5461d73eb5a0eaa0
src/components/mini/tagTime.vue
@@ -10,11 +10,18 @@
               {{yearData.year}}年
            </a-divider>
            <a-timeline-item v-for="monthData in yearData.monthList" color="white">
            <a-timeline-item v-for="monthData in yearData.list" color="white">
               <a-icon slot="dot" type="clock-circle-o" style="font-size: 18px;" />
               <h3>{{monthData.month}}</h3>
               <div v-for="article in monthData.list">
                  <span>{{article.name}} </span>{{article.remark}}
                  <router-link :to="{path:'/mdDetail',query:{id:article.id}}" class="article-title">
                     <span>
                        {{article.name}}
                     </span>
                     <a-icon type="lock" style="color:rgba(0,0,0,.25)" v-if="article.authStatus==3" />
                     <a-icon type="stop" style="color:rgba(0,0,0,.25)" v-if="article.authStatus==2" />
                  </router-link>
               </div>
            </a-timeline-item>
         </div>
@@ -23,185 +30,47 @@
</template>
<script>
   var tempList = [{
         "year": "2022",
         "monthList": [{
               "month": "9月18日",
               "list": [{
                     "name": "陈奕迅-Body Song 歌词1",
                     "remark": "随笔"
                  },
                  {
                     "name": "vue动态路由异步加载",
                  }
               ]
            },
            {
               "month": "9月08日",
               "list": [{
                  "name": "陈奕迅-Body Song 歌词1",
                  "remark": "111"
               }]
            },
            {
               "month": "8月16日",
               "list": [{
                     "name": "陈奕迅-Body Song 歌词1",
                     "remark": "111"
                  },
                  {
                     "name": "陈奕迅-Body Song 歌词1",
                  },
                  {
                     "name": "陈奕迅-Body Song 歌词2",
                     "remark": "22"
                  }
               ]
            },
            {
               "month": "4月09日",
               "list": [{
                  "name": "陈奕迅-Body Song 歌词1",
                  "remark": "111"
               }]
            },
            {
               "month": "3月18日",
               "list": [{
                  "name": "陈奕迅-Body Song 歌词1",
                  "remark": "111"
               }]
            },
         ]
      },
      {
         "year": "2021",
         "monthList": [{
               "month": "9月18日",
               "list": [{
                     "name": "陈奕迅-Body Song 歌词1",
                     "remark": "随笔"
                  },
                  {
                     "name": "vue动态路由异步加载",
                  }
               ]
            },
            {
               "month": "9月12日",
               "list": [{
                  "name": "陈奕迅-Body Song 歌词1",
                  "remark": "111"
               }]
            },
            {
               "month": "9月09日",
               "list": [{
                  "name": "陈奕迅-Body Song 歌词1",
                  "remark": "111"
               }]
            },
            {
               "month": "9月08日",
               "list": [{
                  "name": "陈奕迅-Body Song 歌词1",
                  "remark": "111"
               }]
            },
         ]
      },
      {
         "year": "2020",
         "monthList": [{
               "month": "9月18日",
               "list": [{
                     "name": "陈奕迅-Body Song 歌词1",
                     "remark": "随笔"
                  },
                  {
                     "name": "vue动态路由异步加载",
                  }
               ]
            },
            {
               "month": "9月08日",
               "list": [{
                  "name": "陈奕迅-Body Song 歌词1",
                  "remark": "111"
               }]
            },
            {
               "month": "8月16日",
               "list": [{
                     "name": "陈奕迅-Body Song 歌词1",
                     "remark": "111"
                  },
                  {
                     "name": "陈奕迅-Body Song 歌词1",
                  },
                  {
                     "name": "陈奕迅-Body Song 歌词2",
                     "remark": "22"
                  }
               ]
            }
         ]
      }
   ]
   export default {
      props: {
         'type': Number,
      },
      mounted() {
         console.log(this.$route.query)
      },
   import {
      archiveGroup
   } from '../../api/blogStatistics.js'
   export default {
      data() {
         return {
            year: "",
            month: "",
            list: []
         }
      },
      created() {
         this.year = this.$route.query.year;
         this.month = this.$route.query.month;
      },
      watch: {
         '$route'(to, from) {
            var type = this.$route.query.type;
            var list = [];
            if (type == 1) {
               list = tempList;
            } else if (type == 2) {
               list.push(tempList[0]);
            } else if (type == 3) {
               list.push(tempList[1]);
            if ("tagTime" === to.name) {
               this.year = this.$route.query.year;
               this.month = this.$route.query.month;
               this.$message.info('loading',0.3);
               archiveGroup({
                  year: this.year,
                  month: this.month
               }).then((res) => {
                  this.list = res.data;
               })
            }
            this.list = list
         }
         },
      },
      data() {
         var list = [];
         var type = this.$route.query.type;
         if (type == 1) {
            list = tempList;
         } else if (type == 2) {
            list.push(tempList[0]);
         } else if (type == 3) {
            list.push(tempList[1]);
         }
         return {
            list: list
         }
      }
   }
</script>
<style lang="less">
   .ant-timeline-item-content {
      a {
         color: #555;
      }
      span {
         line-height: 30px;
      }