Commit b71bb344 by 姜雷

Merge branch 'develop' into 'test'

首页图表添加注册和活跃人数统计 See merge request !135
parents 1f109dfd 3930f8f7
...@@ -31,7 +31,10 @@ ...@@ -31,7 +31,10 @@
class="Dashboard-CampusItem" class="Dashboard-CampusItem"
v-loading="loading.regist" v-loading="loading.regist"
> >
<div class="Dashboard-title">{{ reportYear }}年每月注册数据</div> <div class="Dashboard-title">
<span>{{ reportYear }}年每月注册数据</span>
<span class="more-info">{{ reportYear }}年注册人数为: {{ registeYearTotal }}人;截止到目前为止注册会员总数: {{ registeTotal }}</span>
</div>
<RegisterByMonth <RegisterByMonth
:data="registePerMonth" :data="registePerMonth"
:changeReportMonthHandle="changeReportMonthHandle" :changeReportMonthHandle="changeReportMonthHandle"
...@@ -54,7 +57,10 @@ ...@@ -54,7 +57,10 @@
class="Dashboard-CampusItem" class="Dashboard-CampusItem"
v-loading="loading.regist" v-loading="loading.regist"
> >
<div class="Dashboard-title">{{ reportYear }}年每月活跃数据</div> <div class="Dashboard-title">
<span>{{ reportYear }}年每月活跃数据</span>
<span class="more-info">截止{{ today }},系统总活跃人数为:{{ activeTotal }}</span>
</div>
<ActiveUserByMonth :data="activeUser" /> <ActiveUserByMonth :data="activeUser" />
</div> </div>
</div> </div>
...@@ -79,11 +85,9 @@ export default { ...@@ -79,11 +85,9 @@ export default {
isAdmin: Boolean, isAdmin: Boolean,
}, },
data() { data() {
let today = this.$formatDate(new Date(), 'yyyy-MM-dd');
return { return {
campusFilters: { today: today,
year: '',
areaId: undefined,
},
}; };
}, },
computed: { computed: {
...@@ -96,7 +100,18 @@ export default { ...@@ -96,7 +100,18 @@ export default {
'loading', 'loading',
'reportMounted', 'reportMounted',
'filters', 'filters',
'registeTotal',
]), ]),
registeYearTotal() {
return this.registePerMonth.reduce((pre, curItem) => {
return pre + curItem.count;
}, 0);
},
activeTotal() {
return this.activeUser.reduce((pre, curItem) => {
return pre + curItem.count;
}, 0);
},
}, },
mounted() { mounted() {
if (!this.reportMounted) { if (!this.reportMounted) {
...@@ -148,44 +163,52 @@ export default { ...@@ -148,44 +163,52 @@ export default {
.Dashboard { .Dashboard {
.Dashboard-Row.Dashboard-Register { .Dashboard-Row.Dashboard-Register {
height: auto; height: auto;
} .Dashboard-DataCard {
.Dashboard-DataCard { background-color: #fff;
background-color: #fff; border-radius: 8px;
border-radius: 8px; margin-right: 8px;
margin-right: 8px; &:last-child {
&:last-child { margin-right: 0;
margin-right: 0;
}
}
.Dashboard-SearchBar {
display: flex;
padding: 10px 0 20px;
.filter-item-input {
width: 200px;
.el-input {
width: 100%;
} }
} }
} .Dashboard-SearchBar {
.Dashboard-CampusData { display: flex;
display: flex; padding: 10px 0 20px;
padding: 0 15px; .filter-item-label {
.Dashboard-title { min-width: auto;
position: relative; width: auto;
} }
.Dashboard-title::before { .filter-item-input {
content: ''; width: 200px;
position: absolute; .el-input {
bottom: -12px; width: 100%;
left: 0; }
width: 32px; }
height: 4px;
background-color: #4e82fb;
} }
.Dashboard-CampusItem { .Dashboard-CampusData {
flex: 1; display: flex;
&:nth-child(2) { padding: 0 15px;
flex: 1.4; .Dashboard-title {
position: relative;
.more-info {
margin-left: 20px;
font-weight: normal;
}
}
.Dashboard-title::before {
content: '';
position: absolute;
bottom: -12px;
left: 0;
width: 32px;
height: 4px;
background-color: #4e82fb;
}
.Dashboard-CampusItem {
flex: 1;
&:nth-child(2) {
flex: 1.4;
}
} }
} }
} }
......
...@@ -32,6 +32,12 @@ export default { ...@@ -32,6 +32,12 @@ export default {
}, },
count: { count: {
alias: '人数', alias: '人数',
formatter: val => {
if (/\./.test(val)) {
return '';
}
return val;
},
}, },
}) })
.tooltip({ .tooltip({
......
...@@ -30,6 +30,12 @@ export default { ...@@ -30,6 +30,12 @@ export default {
.source(this.data, { .source(this.data, {
count: { count: {
alias: '人数', alias: '人数',
formatter: val => {
if (/\./.test(val)) {
return '';
}
return val;
},
}, },
}) })
.axis('month', { .axis('month', {
......
...@@ -61,6 +61,7 @@ const state = () => ({ ...@@ -61,6 +61,7 @@ const state = () => ({
registePerDay: [], registePerDay: [],
registePerMonth: [], registePerMonth: [],
activeUser: [], activeUser: [],
customerCount: 0,
}, },
title: { title: {
activeCount: 0, activeCount: 0,
...@@ -75,6 +76,7 @@ const getters = { ...@@ -75,6 +76,7 @@ const getters = {
reportMonth: state => state.report.month, reportMonth: state => state.report.month,
registePerDay: state => state.report.registePerDay, registePerDay: state => state.report.registePerDay,
registePerMonth: state => state.report.registePerMonth, registePerMonth: state => state.report.registePerMonth,
registeTotal: state => state.report.customerCount,
activeUser: state => state.report.activeUser, activeUser: state => state.report.activeUser,
titleData: state => state.title, titleData: state => state.title,
areaInfo: state => state.consume.areaInfo, areaInfo: state => state.consume.areaInfo,
...@@ -162,7 +164,7 @@ const actions = { ...@@ -162,7 +164,7 @@ const actions = {
entity.year = filters.reportYear; entity.year = filters.reportYear;
} }
if (filters.reportAreaId) { if (filters.reportAreaId) {
entity.year = filters.reportAreaId; entity.areaId = filters.reportAreaId;
} }
if (entity && entity.updateRegisteByDay) { if (entity && entity.updateRegisteByDay) {
commit(LOADING_REGIST_BY_DAY, true); commit(LOADING_REGIST_BY_DAY, true);
...@@ -233,6 +235,8 @@ const mutations = { ...@@ -233,6 +235,8 @@ const mutations = {
: []; : [];
}, },
[GET_REPORT_DATA]: (state, data) => { [GET_REPORT_DATA]: (state, data) => {
state.report.customerCount = data.customerCount ? data.customerCount : 0;
state.report.year = data.year; state.report.year = data.year;
state.report.month = data.month; state.report.month = data.month;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment