| | |
| | | {{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> |
| | |
| | | </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; |
| | | archiveGroup({ |
| | | year: this.year, |
| | | month: this.month |
| | | }).then((res) => { |
| | | this.list = res.data; |
| | | }) |
| | | }, |
| | | 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; |
| | | } |