feat: 新增运营数据展示组件,优化商城首页数据处理逻辑

- 在商城首页引入 WorkbenchQuickDataShow 组件,展示关键运营数据
- 增加数据获取方法,包括订单、商品和钱包充值数据
- 更新 AnalysisOverview 组件以支持双向绑定
- 优化数据加载逻辑,提升用户体验
This commit is contained in:
lrl
2025-07-15 15:49:48 +08:00
parent e88c17f7e2
commit 5edccd3efe
5 changed files with 253 additions and 37 deletions

View File

@@ -1,6 +1,8 @@
<script setup lang="ts">
import type { AnalysisOverviewItem } from '../typing';
import { computed } from 'vue';
import {
Card,
CardContent,
@@ -13,20 +15,29 @@ import {
interface Props {
items?: AnalysisOverviewItem[];
modelValue?: AnalysisOverviewItem[];
}
defineOptions({
name: 'AnalysisOverview',
});
withDefaults(defineProps<Props>(), {
const props = withDefaults(defineProps<Props>(), {
items: () => [],
modelValue: () => [],
});
const emit = defineEmits(['update:modelValue']);
const itemsData = computed({
get: () => (props.modelValue?.length ? props.modelValue : props.items),
set: (value) => emit('update:modelValue', value),
});
</script>
<template>
<div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-4">
<template v-for="item in items" :key="item.title">
<template v-for="item in itemsData" :key="item.title">
<Card :title="item.title" class="w-full">
<CardHeader>
<CardTitle class="text-xl">{{ item.title }}</CardTitle>