|
@@ -1,5 +1,5 @@
|
|
|
<template>
|
|
|
- <div class="dashboard-container">
|
|
|
+ <div :class="isFull ? 'dashboard-container full' : 'dashboard-container' ">
|
|
|
<div class="scoped-num" v-if="configClickTotal.data.length > 0">
|
|
|
<dv-border-box-8>
|
|
|
<div class="sn-wrap">
|
|
@@ -40,63 +40,64 @@
|
|
|
<dv-border-box-10>
|
|
|
<div class="sc-row">
|
|
|
<div class="sc-user">
|
|
|
- <dv-decoration-12 style="width:150px;height:150px;display: inline-block;" />
|
|
|
- <dv-decoration-3 style="width:300px;height:30px;display: inline-block;" />
|
|
|
+ <dv-decoration-12 style="width:150px;height:150px;display: block;margin: 0 auto;" @click.native="fullHandle()" />
|
|
|
+ <dv-decoration-3 style="width:300px;height:30px;display: inline-block; overflow: hidden;" />
|
|
|
<div class="t">{{timeTips}}{{sysUser.nickname}}</div>
|
|
|
+ <div class="t">{{curTime}}</div>
|
|
|
</div>
|
|
|
<div class="sc-col" v-if="configClickTotal.data.length > 0">
|
|
|
- <dv-border-box-11 title="昨日搜索榜">
|
|
|
+ <dv-border-box-11 title="今日搜索榜">
|
|
|
<div class="sc-wrap">
|
|
|
- <dv-capsule-chart :config="configSearchYesterday" style="width:360px;height:300px" />
|
|
|
+ <dv-capsule-chart :config="configSearchToday" style="width:390px;height:350px" />
|
|
|
</div>
|
|
|
</dv-border-box-11>
|
|
|
</div>
|
|
|
<div class="sc-col" v-if="configClickTotal.data.length > 0">
|
|
|
- <dv-border-box-11 title="昨日点击榜">
|
|
|
+ <dv-border-box-11 title="昨日搜索榜">
|
|
|
<div class="sc-wrap">
|
|
|
- <dv-capsule-chart :config="configClickYesterday" style="width:360px;height:300px" />
|
|
|
+ <dv-capsule-chart :config="configSearchYesterday" style="width:390px;height:350px" />
|
|
|
</div>
|
|
|
</dv-border-box-11>
|
|
|
</div>
|
|
|
<div class="sc-col" v-if="configClickTotal.data.length > 0">
|
|
|
- <dv-border-box-11 title="今日搜索榜">
|
|
|
+ <dv-border-box-11 title="搜索总榜">
|
|
|
<div class="sc-wrap">
|
|
|
- <dv-capsule-chart :config="configSearchToday" style="width:360px;height:300px" />
|
|
|
+ <dv-capsule-chart :config="configSearchTotal" style="width:390px;height:350px" />
|
|
|
</div>
|
|
|
</dv-border-box-11>
|
|
|
</div>
|
|
|
<div class="sc-col" v-if="configClickTotal.data.length > 0">
|
|
|
- <dv-border-box-11 title="今日点击榜">
|
|
|
+ <dv-border-box-11 title="近七天点击榜">
|
|
|
<div class="sc-wrap">
|
|
|
- <dv-capsule-chart :config="configClickToday" style="width:360px;height:300px" />
|
|
|
+ <dv-capsule-chart :config="configClickWeek" style="width:390px;height:350px" />
|
|
|
</div>
|
|
|
</dv-border-box-11>
|
|
|
</div>
|
|
|
<div class="sc-col" v-if="configClickTotal.data.length > 0">
|
|
|
- <dv-border-box-11 title="搜索总榜">
|
|
|
+ <dv-border-box-11 title="今日点击榜">
|
|
|
<div class="sc-wrap">
|
|
|
- <dv-capsule-chart :config="configSearchTotal" style="width:360px;height:300px" />
|
|
|
+ <dv-capsule-chart :config="configClickToday" style="width:390px;height:350px" />
|
|
|
</div>
|
|
|
</dv-border-box-11>
|
|
|
</div>
|
|
|
<div class="sc-col" v-if="configClickTotal.data.length > 0">
|
|
|
- <dv-border-box-11 title="点击总榜">
|
|
|
+ <dv-border-box-11 title="昨日点击榜">
|
|
|
<div class="sc-wrap">
|
|
|
- <dv-capsule-chart :config="configClickTotal" style="width:360px;height:300px" />
|
|
|
+ <dv-capsule-chart :config="configClickYesterday" style="width:390px;height:350px" />
|
|
|
</div>
|
|
|
</dv-border-box-11>
|
|
|
</div>
|
|
|
<div class="sc-col" v-if="configClickTotal.data.length > 0">
|
|
|
- <dv-border-box-11 title="近七天点击榜">
|
|
|
+ <dv-border-box-11 title="点击总榜">
|
|
|
<div class="sc-wrap">
|
|
|
- <dv-capsule-chart :config="configClickWeek" style="width:360px;height:300px" />
|
|
|
+ <dv-capsule-chart :config="configClickTotal" style="width:390px;height:350px" />
|
|
|
</div>
|
|
|
</dv-border-box-11>
|
|
|
</div>
|
|
|
<div class="sc-col" v-if="configClickTotal.data.length > 0">
|
|
|
<dv-border-box-11 title="近一月点击榜">
|
|
|
<div class="sc-wrap">
|
|
|
- <dv-capsule-chart :config="configClickMonth" style="width:360px;height:300px" />
|
|
|
+ <dv-capsule-chart :config="configClickMonth" style="width:390px;height:350px" />
|
|
|
</div>
|
|
|
</dv-border-box-11>
|
|
|
</div>
|
|
@@ -107,6 +108,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import { comGetTime } from '@/utils'
|
|
|
import { mapGetters } from 'vuex'
|
|
|
export default {
|
|
|
name: 'Dashboard',
|
|
@@ -185,37 +187,21 @@ export default {
|
|
|
},
|
|
|
timeTips: '',
|
|
|
numObj: {},
|
|
|
+ isFull: false,
|
|
|
+ timer: null,
|
|
|
+ curTime: ''
|
|
|
}
|
|
|
},
|
|
|
created () {
|
|
|
- let now = new Date()
|
|
|
- let hour = now.getHours()
|
|
|
- if(hour < 6){this.timeTips = '凌晨好!'}
|
|
|
- else if (hour < 9){this.timeTips = '早上好!'}
|
|
|
- else if (hour < 12){this.timeTips = '上午好!'}
|
|
|
- else if (hour < 14){this.timeTips = '中午好!'}
|
|
|
- else if (hour < 17){this.timeTips = '下午好!'}
|
|
|
- else if (hour < 19){this.timeTips = '傍晚好!'}
|
|
|
- else if (hour < 22){this.timeTips = '晚上好!'}
|
|
|
- this.$api.other.admindexrank().then(res => {
|
|
|
- this.numObj = res.total_data || {}
|
|
|
- const fpUser = window.sessionStorage.getItem('fp_user') ? JSON.parse(window.sessionStorage.getItem('fp_user')) : {}
|
|
|
- let isAdmin = 2
|
|
|
- if (fpUser.username === 'admin') isAdmin = 1
|
|
|
- this.formatData2(isAdmin === 1 ? this.numObj.wechat_user_num : this.numObj.wechat_user_num + 10000, 'config1')
|
|
|
- this.formatData2(this.numObj.estate_num, 'config2')
|
|
|
- this.formatData2(this.numObj.school_num, 'config3')
|
|
|
- this.formatData2(this.numObj.information_num, 'config4')
|
|
|
- this.formatData2(this.numObj.land_auction_num, 'config5')
|
|
|
- this.formatData(res.estate_click_rank, 'configClickTotal')
|
|
|
- this.formatData(res.estate_week_rank, 'configClickWeek')
|
|
|
- this.formatData(res.estate_month_rank, 'configClickMonth')
|
|
|
- this.formatData(res.estate_yesterday_rank, 'configClickYesterday')
|
|
|
- this.formatData(res.estate_today_rank, 'configClickToday')
|
|
|
- this.formatData(res.estate_search_rank, 'configSearchTotal')
|
|
|
- this.formatData(res.estate_yesterday_search_rank, 'configSearchYesterday')
|
|
|
- this.formatData(res.estate_today_search_rank, 'configSearchToday')
|
|
|
- })
|
|
|
+ const fpUser = window.sessionStorage.getItem('fp_user') ? JSON.parse(window.sessionStorage.getItem('fp_user')) : {}
|
|
|
+ let isAdmin = 2
|
|
|
+ if (fpUser.username === 'admin') isAdmin = 1
|
|
|
+ this.getData(isAdmin)
|
|
|
+ if (fpUser.username === 'daping') {
|
|
|
+ window.setInterval(() => {
|
|
|
+ this.getData(isAdmin)
|
|
|
+ }, 1000 * 60 * 60 * 2)
|
|
|
+ }
|
|
|
},
|
|
|
computed: {
|
|
|
...mapGetters([
|
|
@@ -223,16 +209,62 @@ export default {
|
|
|
])
|
|
|
},
|
|
|
methods: {
|
|
|
+ getTime () {
|
|
|
+ let date = new Date()
|
|
|
+ let year = date.getFullYear()
|
|
|
+ let month = date.getMonth() + 1
|
|
|
+ month = month > 9 ? month : '0' + month
|
|
|
+ let day = date.getDate()
|
|
|
+ day = day > 9 ? day : '0' + day
|
|
|
+ let hour = date.getHours()
|
|
|
+ hour = hour > 9 ? hour : '0' + hour
|
|
|
+ let min = date.getMinutes()
|
|
|
+ min = min > 9 ? min : '0' + min
|
|
|
+ let second = date.getSeconds()
|
|
|
+ second = second > 9 ? second : '0' + second
|
|
|
+ return `${year}-${month}-${day} ${hour}:${min}:${second}`
|
|
|
+ },
|
|
|
+ getData (isAdmin) {
|
|
|
+ this.timer = null
|
|
|
+ this.timer = window.setInterval(() => {
|
|
|
+ this.curTime = this.getTime()
|
|
|
+ }, 1000)
|
|
|
+ let now = new Date()
|
|
|
+ let hour = now.getHours()
|
|
|
+ if(hour < 6){this.timeTips = '凌晨好!'}
|
|
|
+ else if (hour < 9){this.timeTips = '早上好!'}
|
|
|
+ else if (hour < 12){this.timeTips = '上午好!'}
|
|
|
+ else if (hour < 14){this.timeTips = '中午好!'}
|
|
|
+ else if (hour < 17){this.timeTips = '下午好!'}
|
|
|
+ else if (hour < 19){this.timeTips = '傍晚好!'}
|
|
|
+ else if (hour < 22){this.timeTips = '晚上好!'}
|
|
|
+ this.$api.other.admindexrank().then(res => {
|
|
|
+ this.numObj = res.total_data || {}
|
|
|
+ this.formatData2(isAdmin === 1 ? this.numObj.wechat_user_num : this.numObj.wechat_user_num + 10000, 'config1')
|
|
|
+ this.formatData2(this.numObj.estate_num, 'config2')
|
|
|
+ this.formatData2(this.numObj.school_num, 'config3')
|
|
|
+ this.formatData2(this.numObj.information_num, 'config4')
|
|
|
+ this.formatData2(this.numObj.land_auction_num, 'config5')
|
|
|
+ this.formatData(res.estate_click_rank, 'configClickTotal', isAdmin)
|
|
|
+ this.formatData(res.estate_week_rank, 'configClickWeek', isAdmin)
|
|
|
+ this.formatData(res.estate_month_rank, 'configClickMonth', isAdmin)
|
|
|
+ this.formatData(res.estate_yesterday_rank, 'configClickYesterday', isAdmin)
|
|
|
+ this.formatData(res.estate_today_rank, 'configClickToday', isAdmin)
|
|
|
+ this.formatData(res.estate_search_rank, 'configSearchTotal', isAdmin)
|
|
|
+ this.formatData(res.estate_yesterday_search_rank, 'configSearchYesterday', isAdmin)
|
|
|
+ this.formatData(res.estate_today_search_rank, 'configSearchToday', isAdmin)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ fullHandle () {
|
|
|
+ this.isFull = !this.isFull
|
|
|
+ },
|
|
|
formatData2 (num, str) {
|
|
|
let config = this[str]
|
|
|
config.number = [num]
|
|
|
config.animationFrame = 300
|
|
|
this[str] = {...config}
|
|
|
},
|
|
|
- formatData (list, str) {
|
|
|
- const fpUser = window.sessionStorage.getItem('fp_user') ? JSON.parse(window.sessionStorage.getItem('fp_user')) : {}
|
|
|
- let isAdmin = 2
|
|
|
- if (fpUser.username === 'admin') isAdmin = 1
|
|
|
+ formatData (list, str, isAdmin) {
|
|
|
const nList = list.splice(0, 10)
|
|
|
const newArr = nList.map((item, itemIndex) => {
|
|
|
return {
|
|
@@ -266,10 +298,19 @@ export default {
|
|
|
overflow-y: auto;
|
|
|
// background: url(./bg.jpg) no-repeat center;
|
|
|
background-color: #1f2d3d;
|
|
|
+ &.full {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ z-index: 9999999;
|
|
|
+ min-height: 100%;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.scoped-num {
|
|
|
- min-width: 1280px;
|
|
|
+ min-width: 1400px;
|
|
|
box-sizing: border-box;
|
|
|
padding: 20px 20px 0;
|
|
|
.sn-wrap {
|
|
@@ -295,7 +336,7 @@ export default {
|
|
|
.scoped-count {
|
|
|
padding: 20px;
|
|
|
display: inline-block;
|
|
|
- min-width: 1280px;
|
|
|
+ min-width: 1400px;
|
|
|
box-sizing: border-box;
|
|
|
&.t2 {
|
|
|
display: inline-block;
|
|
@@ -305,19 +346,20 @@ export default {
|
|
|
.sc-row {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
|
- padding: 10px 20px;
|
|
|
+ padding: 10px 0;
|
|
|
+ justify-content: center;
|
|
|
}
|
|
|
.sc-col {
|
|
|
- width: 400px;
|
|
|
+ width: 450px;
|
|
|
padding: 10px;
|
|
|
}
|
|
|
.sc-wrap {
|
|
|
padding: 50px 20px 20px;
|
|
|
}
|
|
|
.sc-user {
|
|
|
- width: 400px;
|
|
|
- height: 300px;
|
|
|
- padding-top: 60px;
|
|
|
+ width: 450px;
|
|
|
+ height: 320px;
|
|
|
+ padding-top: 80px;
|
|
|
text-align: center;
|
|
|
.t {
|
|
|
color: #fff;
|