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/index.vue | 113 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 113 insertions(+), 0 deletions(-)
diff --git a/src/views/mall/home/index.vue b/src/views/mall/home/index.vue
new file mode 100644
index 0000000..89baf33
--- /dev/null
+++ b/src/views/mall/home/index.vue
@@ -0,0 +1,113 @@
+<template>
+ <doc-alert title="鍟嗗煄鎵嬪唽锛堝姛鑳藉紑鍚級" url="https://doc.iocoder.cn/mall/build/" />
+
+ <div class="flex flex-col">
+ <!-- 鏁版嵁瀵圭収 -->
+ <el-row :gutter="16" class="row">
+ <el-col :md="6" :sm="12" :xs="24" :loading="loading">
+ <ComparisonCard
+ tag="浠婃棩"
+ title="閿�鍞"
+ prefix="锟�"
+ :decimals="2"
+ :value="fenToYuan(orderComparison?.value?.orderPayPrice || 0)"
+ :reference="fenToYuan(orderComparison?.reference?.orderPayPrice || 0)"
+ />
+ </el-col>
+ <el-col :md="6" :sm="12" :xs="24" :loading="loading">
+ <ComparisonCard
+ tag="浠婃棩"
+ title="鐢ㄦ埛璁块棶閲�"
+ :value="userComparison?.value?.visitUserCount || 0"
+ :reference="userComparison?.reference?.visitUserCount || 0"
+ />
+ </el-col>
+ <el-col :md="6" :sm="12" :xs="24" :loading="loading">
+ <ComparisonCard
+ tag="浠婃棩"
+ title="璁㈠崟閲�"
+ :value="orderComparison?.value?.orderPayCount || 0"
+ :reference="orderComparison?.reference?.orderPayCount || 0"
+ />
+ </el-col>
+ <el-col :md="6" :sm="12" :xs="24" :loading="loading">
+ <ComparisonCard
+ tag="浠婃棩"
+ title="鏂板鐢ㄦ埛"
+ :value="userComparison?.value?.registerUserCount || 0"
+ :reference="userComparison?.reference?.registerUserCount || 0"
+ />
+ </el-col>
+ </el-row>
+ <el-row :gutter="16" class="row">
+ <el-col :md="12">
+ <!-- 蹇嵎鍏ュ彛 -->
+ <ShortcutCard />
+ </el-col>
+ <el-col :md="12">
+ <!-- 杩愯惀鏁版嵁 -->
+ <OperationDataCard />
+ </el-col>
+ </el-row>
+ <el-row :gutter="16" class="mb-4">
+ <el-col :md="18" :sm="24">
+ <!-- 浼氬憳姒傝 -->
+ <MemberFunnelCard />
+ </el-col>
+ <el-col :md="6" :sm="24">
+ <!-- 浼氬憳缁堢 -->
+ <MemberTerminalCard />
+ </el-col>
+ </el-row>
+ <!-- 浜ゆ槗閲忚秼鍔� -->
+ <TradeTrendCard class="mb-4" />
+ <!-- 浼氬憳缁熻 -->
+ <MemberStatisticsCard />
+ </div>
+</template>
+<script lang="ts" setup>
+import * as TradeStatisticsApi from '@/api/mall/statistics/trade'
+import * as MemberStatisticsApi from '@/api/mall/statistics/member'
+import { DataComparisonRespVO } from '@/api/mall/statistics/common'
+import { TradeOrderSummaryRespVO } from '@/api/mall/statistics/trade'
+import { MemberCountRespVO } from '@/api/mall/statistics/member'
+import { fenToYuan } from '@/utils'
+import ComparisonCard from './components/ComparisonCard.vue'
+import MemberStatisticsCard from './components/MemberStatisticsCard.vue'
+import OperationDataCard from './components/OperationDataCard.vue'
+import ShortcutCard from './components/ShortcutCard.vue'
+import TradeTrendCard from './components/TradeTrendCard.vue'
+import MemberTerminalCard from '@/views/mall/statistics/member/components/MemberTerminalCard.vue'
+import MemberFunnelCard from '@/views/mall/statistics/member/components/MemberFunnelCard.vue'
+
+/** 鍟嗗煄棣栭〉 */
+defineOptions({ name: 'MallHome' })
+
+const loading = ref(true) // 鍔犺浇涓�
+const orderComparison = ref<DataComparisonRespVO<TradeOrderSummaryRespVO>>() // 浜ゆ槗瀵圭収鏁版嵁
+const userComparison = ref<DataComparisonRespVO<MemberCountRespVO>>() // 鐢ㄦ埛瀵圭収鏁版嵁
+
+/** 鏌ヨ浜ゆ槗瀵圭収鍗＄墖鏁版嵁 */
+const getOrderComparison = async () => {
+ orderComparison.value = await TradeStatisticsApi.getOrderComparison()
+}
+
+/** 鏌ヨ浼氬憳鐢ㄦ埛鏁伴噺瀵圭収鍗＄墖鏁版嵁 */
+const getUserCountComparison = async () => {
+ userComparison.value = await MemberStatisticsApi.getUserCountComparison()
+}
+
+/** 鍒濆鍖� **/
+onMounted(async () => {
+ loading.value = true
+ await Promise.all([getOrderComparison(), getUserCountComparison()])
+ loading.value = false
+})
+</script>
+<style lang="scss" scoped>
+.row {
+ .el-col {
+ margin-bottom: 1rem;
+ }
+}
+</style>
--
Gitblit v1.8.0