src/components/mini/tagTime.vue

@@ -10,11 +10,18 @@
               {{yearData.year}}年
            </a-divider>

            <a-timeline-item v-for="monthData in yearData.monthList" color="green">
            <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,155 +30,55 @@
</template>

<script>
   import {
      archiveGroup
   } from '../../api/blogStatistics.js'

   export default {
      props: {
         'type': Number,
      },
      mounted() {
         console.log(this.$route.query)
      },
		
      data() {
         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"
                        }
                     ]
                  }
               ]
            },
            {
               "year": "2021",
               "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"
                        }
                     ]
                  }
               ]
            },
            {
               "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"
                        }
                     ]
                  }
               ]
            }
         ]

         var list = [];
         var type = this.$route.query.type;
         if (type == 1) {
            list = tempList;
         } else if (type == 2) {
            list.push(tempList[0]);
            list.push(tempList[1]);
         } else if (type == 3) {
            list.push(tempList[1]);
         }

         return {
            list: list
            year: "",
            month: "",
            list: []
         }
      }
      },
      created() {
         this.year = this.$route.query.year;
         this.month = this.$route.query.month;
         archiveGroup({
            year: this.year,
            month: this.month
         }).then((res) => {
            this.list = res.data;
         })
      },
      watch: {
         '$route'(to, from) {
            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;
               })
            }
         },
      },
   }
</script>


<style lang="less">
	
   .ant-timeline-item-content {
	 
      a {
         color: #555;
      }
		
      span {
         line-height: 30px;
      }