|
@@ -1,13 +1,79 @@
|
|
|
<template>
|
|
|
<div class="dashboard-container">
|
|
|
+ <div class="scoped-num">
|
|
|
+ <dv-border-box-8>
|
|
|
+ <div class="sn-wrap">
|
|
|
+ <div class="sn-item">
|
|
|
+ <dv-border-box-13>
|
|
|
+ <div class="sn-label">用户数</div>
|
|
|
+ <dv-digital-flop :config="config1" style="width:200px;height:50px;" />
|
|
|
+ </dv-border-box-13>
|
|
|
+ </div>
|
|
|
+ <div class="sn-item">
|
|
|
+ <dv-border-box-13>
|
|
|
+ <div class="sn-label">楼盘数</div>
|
|
|
+ <dv-digital-flop :config="config2" style="width:200px;height:50px;" />
|
|
|
+ </dv-border-box-13>
|
|
|
+ </div>
|
|
|
+ <div class="sn-item">
|
|
|
+ <dv-border-box-13>
|
|
|
+ <div class="sn-label">学校数</div>
|
|
|
+ <dv-digital-flop :config="config3" style="width:200px;height:50px;" />
|
|
|
+ </dv-border-box-13>
|
|
|
+ </div>
|
|
|
+ <div class="sn-item">
|
|
|
+ <dv-border-box-13>
|
|
|
+ <div class="sn-label">文章数</div>
|
|
|
+ <dv-digital-flop :config="config4" style="width:200px;height:50px;" />
|
|
|
+ </dv-border-box-13>
|
|
|
+ </div>
|
|
|
+ <div class="sn-item">
|
|
|
+ <dv-border-box-13>
|
|
|
+ <div class="sn-label">土拍数</div>
|
|
|
+ <dv-digital-flop :config="config5" style="width:200px;height:50px;" />
|
|
|
+ </dv-border-box-13>
|
|
|
+ </div>
|
|
|
+ <!-- <div class="sn-item">
|
|
|
+ <div class="sn-label">楼盘数</div>
|
|
|
+ <dv-digital-flop :config="config2" style="width:200px;height:50px;" />
|
|
|
+ </div>
|
|
|
+ <div class="sn-item">
|
|
|
+ <div class="sn-label">学校数</div>
|
|
|
+ <dv-digital-flop :config="config3" style="width:200px;height:50px;" />
|
|
|
+ </div>
|
|
|
+ <div class="sn-item">
|
|
|
+ <div class="sn-label">文章数</div>
|
|
|
+ <dv-digital-flop :config="config4" style="width:200px;height:50px;" />
|
|
|
+ </div>
|
|
|
+ <div class="sn-item">
|
|
|
+ <div class="sn-label">土拍数</div>
|
|
|
+ <dv-digital-flop :config="config5" style="width:200px;height:50px;" />
|
|
|
+ </div> -->
|
|
|
+ </div>
|
|
|
+ </dv-border-box-8>
|
|
|
+ </div>
|
|
|
<div class="scoped-count">
|
|
|
- <dv-border-box-1>
|
|
|
+ <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;" />
|
|
|
<div class="t">{{timeTips}}{{sysUser.nickname}}</div>
|
|
|
</div>
|
|
|
+ <div class="sc-col" v-if="configClickTotal.data.length > 0">
|
|
|
+ <dv-border-box-11 title="昨日搜索榜">
|
|
|
+ <div class="sc-wrap">
|
|
|
+ <dv-capsule-chart :config="configSearchYesterday" style="width:360px;height:300px" />
|
|
|
+ </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="configSearchToday" style="width:360px;height:300px" />
|
|
|
+ </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">
|
|
@@ -51,7 +117,7 @@
|
|
|
</dv-border-box-11>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </dv-border-box-1>
|
|
|
+ </dv-border-box-10>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
@@ -62,6 +128,26 @@ export default {
|
|
|
name: 'Dashboard',
|
|
|
data () {
|
|
|
return {
|
|
|
+ config1: {
|
|
|
+ number: [0],
|
|
|
+ content: '{nt}人',
|
|
|
+ },
|
|
|
+ config2: {
|
|
|
+ number: [0],
|
|
|
+ content: '{nt}个',
|
|
|
+ },
|
|
|
+ config3: {
|
|
|
+ number: [0],
|
|
|
+ content: '{nt}个',
|
|
|
+ },
|
|
|
+ config4: {
|
|
|
+ number: [0],
|
|
|
+ content: '{nt}篇',
|
|
|
+ },
|
|
|
+ config5: {
|
|
|
+ number: [0],
|
|
|
+ content: '{nt}个',
|
|
|
+ },
|
|
|
configClickTotal: {
|
|
|
data: [],
|
|
|
unit: '次',
|
|
@@ -103,7 +189,18 @@ export default {
|
|
|
// showValue: true,
|
|
|
colors: ['#37a2da', '#32c5e9', '#67e0e3', '#9fe6b8', '#f1a124', '#ffdb5c', '#ff9f7f', '#fb7293', '#22f294', '#e300ff'],
|
|
|
},
|
|
|
+ configSearchYesterday: {
|
|
|
+ data: [],
|
|
|
+ unit: '次',
|
|
|
+ colors: ['#37a2da', '#32c5e9', '#67e0e3', '#9fe6b8', '#f1a124', '#ffdb5c', '#ff9f7f', '#fb7293', '#22f294', '#e300ff'],
|
|
|
+ },
|
|
|
+ configSearchToday: {
|
|
|
+ data: [],
|
|
|
+ unit: '次',
|
|
|
+ colors: ['#37a2da', '#32c5e9', '#67e0e3', '#9fe6b8', '#f1a124', '#ffdb5c', '#ff9f7f', '#fb7293', '#22f294', '#e300ff'],
|
|
|
+ },
|
|
|
timeTips: '',
|
|
|
+ numObj: {},
|
|
|
}
|
|
|
},
|
|
|
created () {
|
|
@@ -118,12 +215,20 @@ export default {
|
|
|
else if (hour < 22){this.timeTips = '晚上好!'}
|
|
|
this.$api.other.admindexrank().then(res => {
|
|
|
console.log(res)
|
|
|
+ this.numObj = res.total_data || {}
|
|
|
+ this.formatData2(this.numObj.wechat_user_num, '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')
|
|
|
})
|
|
|
},
|
|
|
computed: {
|
|
@@ -132,6 +237,12 @@ export default {
|
|
|
])
|
|
|
},
|
|
|
methods: {
|
|
|
+ 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 = 1
|
|
@@ -170,10 +281,35 @@ export default {
|
|
|
background-color: #1f2d3d;
|
|
|
}
|
|
|
|
|
|
-
|
|
|
+.scoped-num {
|
|
|
+ min-width: 1280px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 20px 20px 0;
|
|
|
+ .sn-wrap {
|
|
|
+ padding: 10px;
|
|
|
+ display: flex;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ .sn-item {
|
|
|
+ padding: 10px;
|
|
|
+ flex: 1;
|
|
|
+ text-align: center;
|
|
|
+ .sn-label {
|
|
|
+ padding-top: 20px;
|
|
|
+ color: #8cdacc;
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+ .dv-digital-flop {
|
|
|
+ display: inline-block;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
.scoped-count {
|
|
|
- padding-top: 20px;
|
|
|
+ padding: 20px;
|
|
|
display: inline-block;
|
|
|
+ min-width: 1280px;
|
|
|
+ box-sizing: border-box;
|
|
|
.sc-row {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|