mirror of https://github.com/halo-dev/halo-admin
Perfect count to function
johnniang
parent
3edf1af540
commit
4cdf634045
|
|
@ -1,58 +1,114 @@
|
|||
<template>
|
||||
<page-view>
|
||||
<a-row :gutter="12">
|
||||
<a-col :xl="6" :lg="6" :md="12" :sm="12" :xs="12"
|
||||
:style="{ marginBottom: '12px' }">
|
||||
<analysis-card :loading="countsLoading" title="文章" :number="countsData.postCount">
|
||||
<router-link :to="{ name:'PostList' }" slot="action">
|
||||
<a-icon type="link"/>
|
||||
<a-col
|
||||
:xl="6"
|
||||
:lg="6"
|
||||
:md="12"
|
||||
:sm="12"
|
||||
:xs="12"
|
||||
:style="{ marginBottom: '12px' }"
|
||||
>
|
||||
<analysis-card
|
||||
:loading="countsLoading"
|
||||
title="文章"
|
||||
:number="countsData.postCount"
|
||||
>
|
||||
<router-link
|
||||
:to="{ name:'PostList' }"
|
||||
slot="action"
|
||||
>
|
||||
<a-icon type="link" />
|
||||
</router-link>
|
||||
</analysis-card>
|
||||
</a-col>
|
||||
<a-col :xl="6" :lg="6" :md="12" :sm="12" :xs="12"
|
||||
:style="{ marginBottom: '12px' }">
|
||||
<analysis-card :loading="countsLoading" title="评论" :number="countsData.commentCount">
|
||||
<router-link :to="{ name:'Comments' }" slot="action">
|
||||
<a-icon type="link"/>
|
||||
<a-col
|
||||
:xl="6"
|
||||
:lg="6"
|
||||
:md="12"
|
||||
:sm="12"
|
||||
:xs="12"
|
||||
:style="{ marginBottom: '12px' }"
|
||||
>
|
||||
<analysis-card
|
||||
:loading="countsLoading"
|
||||
title="评论"
|
||||
:number="countsData.commentCount"
|
||||
>
|
||||
<router-link
|
||||
:to="{ name:'Comments' }"
|
||||
slot="action"
|
||||
>
|
||||
<a-icon type="link" />
|
||||
</router-link>
|
||||
</analysis-card>
|
||||
</a-col>
|
||||
<a-col :xl="6" :lg="6" :md="12" :sm="12" :xs="12"
|
||||
:style="{ marginBottom: '12px' }">
|
||||
<a-col
|
||||
:xl="6"
|
||||
:lg="6"
|
||||
:md="12"
|
||||
:sm="12"
|
||||
:xs="12"
|
||||
:style="{ marginBottom: '12px' }"
|
||||
>
|
||||
<!-- <analysis-card :loading="countsLoading" title="总访问" :number="countsData.visitCount">
|
||||
<a-tooltip slot="action">
|
||||
<template slot="title">文章总访问共 {{ countsData.visitCount }} 次</template>-->
|
||||
<analysis-card :loading="countsLoading" title="总访问" :number="countsData.visitCount">
|
||||
<analysis-card
|
||||
:loading="countsLoading"
|
||||
title="总访问"
|
||||
:number="countsData.visitCount"
|
||||
>
|
||||
<a-tooltip slot="action">
|
||||
<template slot="title">
|
||||
文章总访问共
|
||||
<countTo :startVal="0" :endVal="countsData.visitCount" :duration="3000"></countTo>次
|
||||
<countTo
|
||||
:startVal="0"
|
||||
:endVal="countsData.visitCount"
|
||||
:duration="3000"
|
||||
></countTo>次
|
||||
</template>
|
||||
<!-- <countTo :startVal="0" :endVal="countsData.visitCount" :duration="3000"></countTo> -->
|
||||
<!-- <template>
|
||||
<countTo :startVal="0" :endVal="countsData.visitCount" :duration="3000"></countTo>
|
||||
</template>-->
|
||||
<a href="javascript:void(0);">
|
||||
<a-icon type="info-circle-o"/>
|
||||
<a-icon type="info-circle-o" />
|
||||
</a>
|
||||
</a-tooltip>
|
||||
</analysis-card>
|
||||
</a-col>
|
||||
<a-col :xl="6" :lg="6" :md="12" :sm="12" :xs="12"
|
||||
:style="{ marginBottom: '12px' }">
|
||||
<analysis-card :loading="countsLoading" title="建立天数" :number="countsData.establishDays">
|
||||
<a-col
|
||||
:xl="6"
|
||||
:lg="6"
|
||||
:md="12"
|
||||
:sm="12"
|
||||
:xs="12"
|
||||
:style="{ marginBottom: '12px' }"
|
||||
>
|
||||
<analysis-card
|
||||
:loading="countsLoading"
|
||||
title="建立天数"
|
||||
:number="countsData.establishDays"
|
||||
>
|
||||
<a-tooltip slot="action">
|
||||
<template slot="title">博客建立于 {{ countsData.birthday | moment }}</template>
|
||||
<a href="javascript:void(0);">
|
||||
<a-icon type="info-circle-o"/>
|
||||
<a-icon type="info-circle-o" />
|
||||
</a>
|
||||
</a-tooltip>
|
||||
</analysis-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="12">
|
||||
<a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24"
|
||||
:style="{ marginBottom: '12px' }">
|
||||
<a-col
|
||||
:xl="8"
|
||||
:lg="8"
|
||||
:md="12"
|
||||
:sm="24"
|
||||
:xs="24"
|
||||
:style="{ marginBottom: '12px' }"
|
||||
>
|
||||
<a-card
|
||||
:loading="activityLoading"
|
||||
:bordered="false"
|
||||
|
|
@ -61,9 +117,16 @@
|
|||
>
|
||||
<div class="card-container">
|
||||
<a-tabs type="card">
|
||||
<a-tab-pane key="1" tab="最近文章">
|
||||
<a-tab-pane
|
||||
key="1"
|
||||
tab="最近文章"
|
||||
>
|
||||
<a-list :dataSource="postData">
|
||||
<a-list-item slot="renderItem" slot-scope="item, index" :key="index">
|
||||
<a-list-item
|
||||
slot="renderItem"
|
||||
slot-scope="item, index"
|
||||
:key="index"
|
||||
>
|
||||
<a-list-item-meta>
|
||||
<a
|
||||
slot="title"
|
||||
|
|
@ -75,13 +138,22 @@
|
|||
</a-list-item>
|
||||
</a-list>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="最近评论">
|
||||
<a-tab-pane
|
||||
key="2"
|
||||
tab="最近评论"
|
||||
>
|
||||
<div class="custom-tab-wrapper">
|
||||
<a-tabs>
|
||||
<a-tab-pane tab="文章" key="1">
|
||||
<a-tab-pane
|
||||
tab="文章"
|
||||
key="1"
|
||||
>
|
||||
<recent-comment-tab type="posts"></recent-comment-tab>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="页面" key="2">
|
||||
<a-tab-pane
|
||||
tab="页面"
|
||||
key="2"
|
||||
>
|
||||
<recent-comment-tab type="sheets"></recent-comment-tab>
|
||||
</a-tab-pane>
|
||||
<!-- <a-tab-pane
|
||||
|
|
@ -97,13 +169,26 @@
|
|||
</div>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24"
|
||||
:style="{ marginBottom: '12px' }">
|
||||
<a-card :bordered="false" :loading="writeLoading" :bodyStyle="{ padding: '16px' }">
|
||||
<a-col
|
||||
:xl="8"
|
||||
:lg="8"
|
||||
:md="12"
|
||||
:sm="24"
|
||||
:xs="24"
|
||||
:style="{ marginBottom: '12px' }"
|
||||
>
|
||||
<a-card
|
||||
:bordered="false"
|
||||
:loading="writeLoading"
|
||||
:bodyStyle="{ padding: '16px' }"
|
||||
>
|
||||
<template slot="title">
|
||||
速记
|
||||
<a-tooltip slot="action" title="内容将保存到页面/所有页面/日志页面">
|
||||
<a-icon type="info-circle-o"/>
|
||||
<a-tooltip
|
||||
slot="action"
|
||||
title="内容将保存到页面/所有页面/日志页面"
|
||||
>
|
||||
<a-icon type="info-circle-o" />
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-form layout="vertical">
|
||||
|
|
@ -116,24 +201,47 @@
|
|||
/>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-button type="primary" @click="handleCreateJournalClick">保存</a-button>
|
||||
<a-button
|
||||
type="primary"
|
||||
@click="handleCreateJournalClick"
|
||||
>保存</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24"
|
||||
:style="{ marginBottom: '12px' }">
|
||||
<a-card :loading="logLoading" :bordered="false" :bodyStyle="{ padding: '16px' }">
|
||||
<a-col
|
||||
:xl="8"
|
||||
:lg="8"
|
||||
:md="12"
|
||||
:sm="24"
|
||||
:xs="24"
|
||||
:style="{ marginBottom: '12px' }"
|
||||
>
|
||||
<a-card
|
||||
:loading="logLoading"
|
||||
:bordered="false"
|
||||
:bodyStyle="{ padding: '16px' }"
|
||||
>
|
||||
<template slot="title">
|
||||
操作记录
|
||||
<a-tooltip slot="action" title="更多">
|
||||
<a href="javascript:void(0);" @click="handleShowLogDrawer">
|
||||
<a-icon type="ellipsis"/>
|
||||
<a-tooltip
|
||||
slot="action"
|
||||
title="更多"
|
||||
>
|
||||
<a
|
||||
href="javascript:void(0);"
|
||||
@click="handleShowLogDrawer"
|
||||
>
|
||||
<a-icon type="ellipsis" />
|
||||
</a>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-list :dataSource="formattedLogDatas">
|
||||
<a-list-item slot="renderItem" slot-scope="item, index" :key="index">
|
||||
<a-list-item
|
||||
slot="renderItem"
|
||||
slot-scope="item, index"
|
||||
:key="index"
|
||||
>
|
||||
<a-list-item-meta :description="item.createTime | timeAgo">
|
||||
<span slot="title">{{ item.type }}</span>
|
||||
</a-list-item-meta>
|
||||
|
|
@ -152,10 +260,17 @@
|
|||
destroyOnClose
|
||||
@close="()=>this.logDrawerVisiable = false"
|
||||
>
|
||||
<a-row type="flex" align="middle">
|
||||
<a-row
|
||||
type="flex"
|
||||
align="middle"
|
||||
>
|
||||
<a-col :span="24">
|
||||
<a-list :dataSource="formattedLogsDatas">
|
||||
<a-list-item slot="renderItem" slot-scope="item, index" :key="index">
|
||||
<a-list-item
|
||||
slot="renderItem"
|
||||
slot-scope="item, index"
|
||||
:key="index"
|
||||
>
|
||||
<a-list-item-meta :description="item.createTime | timeAgo">
|
||||
<span slot="title">{{ item.type }}</span>
|
||||
</a-list-item-meta>
|
||||
|
|
@ -176,9 +291,14 @@
|
|||
</a-list>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-divider class="divider-transparent"/>
|
||||
<a-divider class="divider-transparent" />
|
||||
<div class="bottom-control">
|
||||
<a-popconfirm title="你确定要清空所有操作日志？" okText="确定" @confirm="handleClearLogs" cancelText="取消">
|
||||
<a-popconfirm
|
||||
title="你确定要清空所有操作日志？"
|
||||
okText="确定"
|
||||
@confirm="handleClearLogs"
|
||||
cancelText="取消"
|
||||
>
|
||||
<a-button type="danger">清空操作日志</a-button>
|
||||
</a-popconfirm>
|
||||
</div>
|
||||
|
|
@ -227,7 +347,8 @@ export default {
|
|||
page: 1,
|
||||
size: 50,
|
||||
sort: null
|
||||
}
|
||||
},
|
||||
interval: null
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
|
@ -235,6 +356,10 @@ export default {
|
|||
this.listLatestPosts()
|
||||
this.listLatestLogs()
|
||||
this.loadOptions()
|
||||
|
||||
// this.interval = setInterval(() => {
|
||||
// this.getCounts()
|
||||
// }, 5000)
|
||||
},
|
||||
computed: {
|
||||
formattedPostData() {
|
||||
|
|
@ -257,6 +382,21 @@ export default {
|
|||
})
|
||||
}
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.interval = setInterval(() => {
|
||||
vm.getCounts()
|
||||
}, 5000)
|
||||
})
|
||||
},
|
||||
beforeRouteLeave(to, from, next) {
|
||||
if (this.interval) {
|
||||
clearInterval(this.interval)
|
||||
this.interval = null
|
||||
this.$log.debug('Cleared interval')
|
||||
}
|
||||
next()
|
||||
},
|
||||
methods: {
|
||||
loadOptions() {
|
||||
optionApi.listAll(this.keys).then(response => {
|
||||
|
|
|
|||
|
|
@ -17,9 +17,9 @@
|
|||
<slot name="number">
|
||||
<!-- <span>{{ typeof number === 'function' && number() || number }}</span> -->
|
||||
<countTo
|
||||
:startVal="0"
|
||||
:startVal="startNumber"
|
||||
:endVal="typeof number === 'function' && number() || number"
|
||||
:duration="4000"
|
||||
:duration="3000"
|
||||
:autoplay="true"
|
||||
></countTo>
|
||||
</slot>
|
||||
|
|
@ -38,17 +38,29 @@ export default {
|
|||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: ''
|
||||
},
|
||||
number: {
|
||||
type: [Function, Number, String],
|
||||
type: Number,
|
||||
required: false,
|
||||
default: null
|
||||
default: 0
|
||||
},
|
||||
loading: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
startNumber: 0
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
number: function(newValue, oldValue) {
|
||||
this.startNumber = oldValue
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue