| 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; | |
| 81c155 | 48 | archiveGroup({ |
| I | 49 | year: this.year, |
| 50 | month: this.month | |
| 51 | }).then((res) => { | |
| 52 | this.list = res.data; | |
| 53 | }) | |
| 63f511 | 54 | }, |
| aab811 | 55 | watch: { |
| I | 56 | '$route'(to, from) { |
| 63f511 | 57 | if ("tagTime" === to.name) { |
| I | 58 | this.year = this.$route.query.year; |
| 59 | this.month = this.$route.query.month; | |
| 81c155 | 60 | this.$message.info('loading', 0.3); |
| 63f511 | 61 | archiveGroup({ |
| I | 62 | year: this.year, |
| 63 | month: this.month | |
| 64 | }).then((res) => { | |
| 65 | this.list = res.data; | |
| 66 | }) | |
| 41b36f | 67 | } |
| 63f511 | 68 | }, |
| aab811 | 69 | }, |
| 41b36f | 70 | } |
| I | 71 | </script> |
| 72 | ||
| 73 | ||
| 74 | <style lang="less"> | |
| b1336e | 75 | |
| 41b36f | 76 | .ant-timeline-item-content { |
| b1336e | 77 | |
| 63f511 | 78 | a { |
| I | 79 | color: #555; |
| 80 | } | |
| b1336e | 81 | |
| 41b36f | 82 | span { |
| I | 83 | line-height: 30px; |
| 84 | } | |
| 85 | } | |
| 86 | </style> | |
