1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
| <script lang="ts" setup>
| import type { AnalysisOverviewItem } from '@vben/common-ui';
|
| import { computed } from 'vue';
|
| import { AnalysisOverview } from '@vben/common-ui';
| import {
| SvgBellIcon,
| SvgCakeIcon,
| SvgCardIcon,
| SvgDownloadIcon,
| } from '@vben/icons';
|
| interface Props {
| saleSummary?: {
| monthPrice?: number;
| todayPrice?: number;
| yearPrice?: number;
| yesterdayPrice?: number;
| };
| purchaseSummary?: {
| monthPrice?: number;
| todayPrice?: number;
| yearPrice?: number;
| yesterdayPrice?: number;
| };
| }
|
| const props = withDefaults(defineProps<Props>(), {
| saleSummary: () => ({}),
| purchaseSummary: () => ({}),
| });
|
| /** 概览数据 */
| const overviewItems = computed<AnalysisOverviewItem[]>(() => [
| {
| icon: SvgCardIcon,
| title: '今日销售',
| totalTitle: '今日采购',
| totalValue: props.purchaseSummary?.todayPrice || 0,
| value: props.saleSummary?.todayPrice || 0,
| },
| {
| icon: SvgCakeIcon,
| title: '昨日销售',
| totalTitle: '昨日采购',
| totalValue: props.purchaseSummary?.yesterdayPrice || 0,
| value: props.saleSummary?.yesterdayPrice || 0,
| },
| {
| icon: SvgDownloadIcon,
| title: '本月销售',
| totalTitle: '本月采购',
| totalValue: props.purchaseSummary?.monthPrice || 0,
| value: props.saleSummary?.monthPrice || 0,
| },
| {
| icon: SvgBellIcon,
| title: '今年销售',
| totalTitle: '今年采购',
| totalValue: props.purchaseSummary?.yearPrice || 0,
| value: props.saleSummary?.yearPrice || 0,
| },
| ]);
| </script>
|
| <template>
| <AnalysisOverview :items="overviewItems" />
| </template>
|
|
