This commit is contained in:
aaron 2025-03-28 09:06:14 +08:00
parent 32ac4e2fc2
commit e778472ae7

View File

@ -204,6 +204,36 @@
</a-col> </a-col>
</a-row> </a-row>
<!-- 每日统计列表 -->
<div class="daily-stats-section">
<div class="section-header">
<h2 class="section-title">
<span class="icon-wrapper stats-icon">
<svg class="icon" viewBox="0 0 1024 1024" width="26" height="26">
<path d="M888 792H200V168c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v688c0 4.4 3.6 8 8 8h752c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8z" fill="currentColor"></path>
<path d="M288 712h56c4.4 0 8-3.6 8-8V550c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v154c0 4.4 3.6 8 8 8zM440 712h56c4.4 0 8-3.6 8-8V426c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v278c0 4.4 3.6 8 8 8zM592 712h56c4.4 0 8-3.6 8-8V302c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v402c0 4.4 3.6 8 8 8zM744 712h56c4.4 0 8-3.6 8-8V178c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v526c0 4.4 3.6 8 8 8z" fill="currentColor"></path>
</svg>
</span>
每日统计列表
</h2>
</div>
<a-table
:columns="dailyStatsColumns"
:data-source="dailyStatsList"
:pagination="dailyStatsPagination"
:loading="dailyStatsLoading"
row-key="stats_date"
class="daily-stats-table"
@change="handleDailyStatsTableChange"
>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'total_original_amount' || column.key === 'total_final_amount'">
¥{{ record[column.key].toFixed(2) }}
</template>
</template>
</a-table>
</div>
<!-- 配送员列表 --> <!-- 配送员列表 -->
<div class="deliveryman-list-section"> <div class="deliveryman-list-section">
<div class="section-header"> <div class="section-header">
@ -350,6 +380,54 @@ export default defineComponent({
} }
] ]
const dailyStatsList = ref([])
const dailyStatsLoading = ref(false)
const dailyStatsPagination = ref({
current: 1,
pageSize: 10,
total: 0,
showSizeChanger: true,
showTotal: (total) => `${total} 条记录`
})
const dailyStatsColumns = [
{
title: '日期',
dataIndex: 'stats_date',
key: 'stats_date',
width: 120,
align: 'center'
},
{
title: '订单数',
dataIndex: 'total_order_count',
key: 'total_order_count',
width: 100,
align: 'center'
},
{
title: '订单金额',
dataIndex: 'total_original_amount',
key: 'total_original_amount',
width: 120,
align: 'right'
},
{
title: '支付金额',
dataIndex: 'total_final_amount',
key: 'total_final_amount',
width: 120,
align: 'right'
},
{
title: '小区数',
dataIndex: 'total_communities',
key: 'total_communities',
width: 100,
align: 'center'
}
]
const greeting = computed(() => { const greeting = computed(() => {
const hour = new Date().getHours() const hour = new Date().getHours()
if (hour < 6) return '夜深了,请注意休息' if (hour < 6) return '夜深了,请注意休息'
@ -418,6 +496,26 @@ export default defineComponent({
} }
} }
const fetchDailyStats = async () => {
dailyStatsLoading.value = true
try {
const params = {
skip: (dailyStatsPagination.value.current - 1) * dailyStatsPagination.value.pageSize,
limit: dailyStatsPagination.value.pageSize
}
const res = await request.get('/api/dashboard/order_stats', { params })
if (res.code === 200) {
dailyStatsList.value = res.data.items || []
dailyStatsPagination.value.total = res.data.total || 0
}
} catch (error) {
console.error('获取每日统计数据失败:', error)
} finally {
dailyStatsLoading.value = false
}
}
const handleCommunityChange = (value) => { const handleCommunityChange = (value) => {
if (value === 0) { if (value === 0) {
fetchDeliverymanList() fetchDeliverymanList()
@ -426,10 +524,17 @@ export default defineComponent({
} }
} }
const handleDailyStatsTableChange = (pagination) => {
dailyStatsPagination.value.current = pagination.current
dailyStatsPagination.value.pageSize = pagination.pageSize
fetchDailyStats()
}
onMounted(() => { onMounted(() => {
fetchDashboardData() fetchDashboardData()
fetchDeliverymanList() fetchDeliverymanList()
fetchCommunityList() fetchCommunityList()
fetchDailyStats()
}) })
return { return {
@ -442,7 +547,12 @@ export default defineComponent({
communityList, communityList,
selectedCommunity, selectedCommunity,
handleCommunityChange, handleCommunityChange,
paymentRate paymentRate,
dailyStatsList,
dailyStatsColumns,
dailyStatsPagination,
dailyStatsLoading,
handleDailyStatsTableChange
} }
} }
}) })
@ -658,6 +768,47 @@ export default defineComponent({
} }
} }
.daily-stats-section {
background: white;
border-radius: 8px;
padding: 20px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
position: relative;
margin-bottom: 24px;
&::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 6px;
background-color: #722ed1;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}
}
.stats-icon {
background-color: rgba(114, 46, 209, 0.2);
color: #722ed1;
}
.daily-stats-table {
:deep(.ant-table-thead > tr > th) {
background-color: #f5f5f5;
font-weight: 500;
}
:deep(.ant-table-tbody > tr:hover > td) {
background-color: #f0e6fa;
}
:deep(.ant-table-tbody > tr > td) {
transition: background 0.3s;
}
}
.deliveryman-list-section { .deliveryman-list-section {
background: white; background: white;
border-radius: 8px; border-radius: 8px;