From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/views/mall/home/components/MemberStatisticsCard.vue | 91 +++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 91 insertions(+), 0 deletions(-)
diff --git a/src/views/mall/home/components/MemberStatisticsCard.vue b/src/views/mall/home/components/MemberStatisticsCard.vue
new file mode 100644
index 0000000..2f9d7ab
--- /dev/null
+++ b/src/views/mall/home/components/MemberStatisticsCard.vue
@@ -0,0 +1,91 @@
+<template>
+ <el-card shadow="never">
+ <template #header>
+ <CardTitle title="鐢ㄦ埛缁熻" />
+ </template>
+ <!-- 鎶樼嚎鍥� -->
+ <Echart :height="300" :options="lineChartOptions" />
+ </el-card>
+</template>
+<script lang="ts" setup>
+import dayjs from 'dayjs'
+import { EChartsOption } from 'echarts'
+import * as MemberStatisticsApi from '@/api/mall/statistics/member'
+import { formatDate } from '@/utils/formatTime'
+import { CardTitle } from '@/components/Card'
+
+/** 浼氬憳鐢ㄦ埛缁熻鍗＄墖 */
+defineOptions({ name: 'MemberStatisticsCard' })
+
+const loading = ref(true) // 鍔犺浇涓�
+/** 鎶樼嚎鍥鹃厤缃� */
+const lineChartOptions = reactive<EChartsOption>({
+ dataset: {
+ dimensions: ['date', 'count'],
+ source: []
+ },
+ grid: {
+ left: 20,
+ right: 20,
+ bottom: 20,
+ top: 80,
+ containLabel: true
+ },
+ legend: {
+ top: 50
+ },
+ series: [{ name: '娉ㄥ唽閲�', type: 'line', smooth: true, areaStyle: {} }],
+ toolbox: {
+ feature: {
+ // 鏁版嵁鍖哄煙缂╂斁
+ dataZoom: {
+ yAxisIndex: false // Y杞翠笉缂╂斁
+ },
+ brush: {
+ type: ['lineX', 'clear'] // 鍖哄煙缂╂斁鎸夐挳銆佽繕鍘熸寜閽�
+ },
+ saveAsImage: { show: true, name: '浼氬憳缁熻' } // 淇濆瓨涓哄浘鐗�
+ }
+ },
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'cross'
+ },
+ padding: [5, 10]
+ },
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ axisTick: {
+ show: false
+ },
+ axisLabel: {
+ formatter: (date: string) => formatDate(date, 'MM-DD')
+ }
+ },
+ yAxis: {
+ axisTick: {
+ show: false
+ }
+ }
+}) as EChartsOption
+
+const getMemberRegisterCountList = async () => {
+ loading.value = true
+ // 鏌ヨ鏈�杩戜竴鏈堟暟鎹�
+ const beginTime = dayjs().subtract(30, 'd').startOf('d')
+ const endTime = dayjs().endOf('d')
+ const list = await MemberStatisticsApi.getMemberRegisterCountList(beginTime, endTime)
+ // 鏇存柊 Echarts 鏁版嵁
+ if (lineChartOptions.dataset && lineChartOptions.dataset['source']) {
+ lineChartOptions.dataset['source'] = list
+ }
+ loading.value = false
+}
+
+/** 鍒濆鍖� **/
+onMounted(() => {
+ getMemberRegisterCountList()
+})
+</script>
--
Gitblit v1.8.0