feat(统计业务): 新增全部用户统计页面及相关功能
- 新增用户统计页面,支持按日、月、年统计用户数据 - 引入用户统计基础组件,包含数据展示和导出功能 - 更新主统计页面以集成新的统计选项
This commit is contained in:
@@ -0,0 +1,14 @@
|
||||
<template>
|
||||
<userStatisticsBase mode="null" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import userStatisticsBase from './userStatisticsBase'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
userStatisticsBase
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,9 +1,10 @@
|
||||
<template>
|
||||
<div class="mod-config">
|
||||
<el-tabs v-model="activeTab" type="card">
|
||||
<el-tab-pane label="首页" name="homeUser" />
|
||||
<el-tab-pane label="当日" name="dayUser" />
|
||||
<el-tab-pane label="月度" name="monthUser" />
|
||||
<el-tab-pane label="年度" name="yearUser" />
|
||||
<el-tab-pane label="全部" name="allUser" />
|
||||
<el-tab-pane label="留存率" name="retainUser" />
|
||||
</el-tabs>
|
||||
<keep-alive>
|
||||
@@ -13,21 +14,23 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import homeUser from './homeUser'
|
||||
import allUser from './allUser'
|
||||
import dayUser from './dayUser'
|
||||
import monthUser from './monthUser'
|
||||
import yearUser from './yearUser'
|
||||
import retainUser from './retainUser'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
homeUser,
|
||||
dayUser,
|
||||
monthUser,
|
||||
yearUser,
|
||||
allUser,
|
||||
retainUser
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeTab: 'homeUser'
|
||||
activeTab: 'dayUser'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="user-statistics-page" v-loading="loading">
|
||||
<div v-if="mode !== 'day'" class="query-section">
|
||||
<div v-if="mode !== 'null'" class="query-section">
|
||||
<el-form :inline="true" @keyup.enter.native="getDataList">
|
||||
<el-form-item :label="queryLabel">
|
||||
<el-date-picker
|
||||
@@ -50,7 +50,7 @@
|
||||
<el-table
|
||||
:data="tableData"
|
||||
border
|
||||
:height="mode !== 'day' ? 470 : 520"
|
||||
:height="mode !== 'null' ? 470 : 520"
|
||||
:header-cell-style="{ textAlign: 'center', padding: '6px 0' }"
|
||||
:cell-style="{ textAlign: 'center', padding: '6px 0' }"
|
||||
>
|
||||
@@ -158,20 +158,23 @@ export default {
|
||||
pickerType() {
|
||||
if (this.mode === 'day') return 'date'
|
||||
if (this.mode === 'month') return 'month'
|
||||
return 'year'
|
||||
if (this.mode === 'year') return 'year'
|
||||
return ''
|
||||
},
|
||||
displayFormat() {
|
||||
if (this.mode === 'day') return 'yyyy-MM-dd'
|
||||
if (this.mode === 'month') return 'yyyy-MM'
|
||||
return 'yyyy'
|
||||
if (this.mode === 'year') return 'yyyy'
|
||||
return ''
|
||||
},
|
||||
valueFormat() {
|
||||
return this.displayFormat
|
||||
},
|
||||
timePrefix() {
|
||||
if (this.mode === 'day') return '当日'
|
||||
if (this.mode === 'month') return '当月'
|
||||
return '当年'
|
||||
// if (this.mode === 'day') return '当日'
|
||||
// if (this.mode === 'month') return '当月'
|
||||
// if (this.mode === 'year') return '当年'
|
||||
return '当日'
|
||||
},
|
||||
pickerOptions() {
|
||||
return {
|
||||
@@ -213,7 +216,8 @@ export default {
|
||||
const now = new Date()
|
||||
if (this.mode === 'day') return formatDate(now)
|
||||
if (this.mode === 'month') return formatMonth(now)
|
||||
return formatYear(now)
|
||||
if (this.mode === 'year') return formatYear(now)
|
||||
return null
|
||||
},
|
||||
normalizeRows(userList = []) {
|
||||
return userList.map((item) => ({
|
||||
@@ -281,12 +285,13 @@ export default {
|
||||
data: http.adornData({
|
||||
date: this.currentDate
|
||||
}),
|
||||
responseType: 'blob'
|
||||
responseType: 'blob',
|
||||
timeout: 0
|
||||
}).then((response) => {
|
||||
const blob = new Blob([response.data])
|
||||
const link = document.createElement('a')
|
||||
link.href = URL.createObjectURL(blob)
|
||||
link.download = `用户统计报表-${this.currentDate}.xlsx`
|
||||
link.download = `用户统计报表-${this.currentDate || '全部'}.xlsx`
|
||||
link.click()
|
||||
URL.revokeObjectURL(link.href)
|
||||
}).catch(() => {
|
||||
|
||||
Reference in New Issue
Block a user