inleft
2022-02-22 c23efbe2832d1a9eecd4ef5d20d984661b24dd22
commit | author | age
41b36f 1 <template>
I 2     <div class="swichTag">
3
4         <a-page-header title="归档时间线" style="padding: 0px;" @back="() => this.$router.go(-1)" />
5
6         <a-timeline pending="没有更多了...">
7             <a-icon slot="pendingDot" type="close-circle" style="font-size: 18px;" />
8             <div v-for="yearData in list">
9                 <a-divider orientation="left">
10                     {{yearData.year}}年
11                 </a-divider>
12
63f511 13                 <a-timeline-item v-for="monthData in yearData.list" color="white">
41b36f 14                     <a-icon slot="dot" type="clock-circle-o" style="font-size: 18px;" />
I 15                     <h3>{{monthData.month}}</h3>
16                     <div v-for="article in monthData.list">
63f511 17                         <router-link :to="{path:'/mdDetail',query:{id:article.id}}" class="article-title">
I 18                             <span>
19                                 {{article.name}}
20                             </span>
21                             <a-icon type="lock" style="color:rgba(0,0,0,.25)" v-if="article.authStatus==3" />
22                             <a-icon type="stop" style="color:rgba(0,0,0,.25)" v-if="article.authStatus==2" />
23
24                         </router-link>
41b36f 25                     </div>
I 26                 </a-timeline-item>
27             </div>
28         </a-timeline>
29     </div>
30 </template>
31
32 <script>
63f511 33     import {
I 34         archiveGroup
35     } from '../../api/blogStatistics.js'
41b36f 36
63f511 37     export default {
I 38         data() {
39             return {
40                 year: "",
41                 month: "",
42                 list: []
43             }
44         },
45         created() {
46             this.year = this.$route.query.year;
47             this.month = this.$route.query.month;
48         },
aab811 49         watch: {
I 50             '$route'(to, from) {
63f511 51                 if ("tagTime" === to.name) {
I 52                     this.year = this.$route.query.year;
53                     this.month = this.$route.query.month;
54                     this.$message.info('loading',0.3);
55                     archiveGroup({
56                         year: this.year,
57                         month: this.month
58                     }).then((res) => {
59                         this.list = res.data;
60                     })
41b36f 61                 }
63f511 62             },
aab811 63         },
41b36f 64     }
I 65 </script>
66
67
68 <style lang="less">
69     .ant-timeline-item-content {
63f511 70         a {
I 71             color: #555;
72         }
73
41b36f 74         span {
I 75             line-height: 30px;
76         }
77     }
78 </style>