This commit is contained in:
aaron 2025-03-18 22:53:50 +08:00
parent 665ed9cf67
commit 20f94f9618
2 changed files with 70 additions and 33 deletions

View File

@ -221,9 +221,19 @@ export default defineComponent({
}
const res = await request.get('/api/community-time-periods/group_by_community', { params })
if (res.code === 200) {
tableData.value = res.data.items || res.data
pagination.value.total = res.data.total || res.data.length
if (res.code === 200 && res.data) {
//
if (Array.isArray(res.data.items)) {
tableData.value = res.data.items
pagination.value.total = res.data.total || res.data.items.length
} else if (Array.isArray(res.data)) {
//
tableData.value = res.data
pagination.value.total = res.data.length
} else {
tableData.value = []
pagination.value.total = 0
}
} else {
message.error(res.message || '获取数据失败')
}

View File

@ -3,16 +3,16 @@
<div class="dashboard">
<a-row :gutter="24" class="data-overview">
<!-- 小区数据卡片 -->
<a-col :span="6">
<a-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
<a-card class="data-card community-card">
<template #title>
<span class="card-title">
<span class="icon-wrapper community-icon">
<svg class="icon" viewBox="0 0 1024 1024" width="24" height="24">
<svg class="icon" viewBox="0 0 1024 1024" width="20" height="20">
<path d="M946.5 505L560.1 118.8l-25.9-25.9c-12.3-12.2-32.1-12.2-44.4 0L77.5 505c-12.3 12.3-18.9 28.6-18.8 46 0.4 35.2 29.7 63.3 64.9 63.3h42.5V940h691.8V614.3h43.4c17.1 0 33.2-6.7 45.3-18.8 12.1-12.1 18.7-28.2 18.7-45.3 0-17-6.7-33.1-18.8-45.2zM568 868H456V664h112v204z m217.9-325.7V868H632V640c0-22.1-17.9-40-40-40H432c-22.1 0-40 17.9-40 40v228H238.1V542.3h-96l370-369.7 23.1 23.1L882 542.3h-96.1z" fill="currentColor"></path>
</svg>
</span>
小区数据
开通小区
</span>
</template>
<a-statistic
@ -25,16 +25,16 @@
</a-col>
<!-- 用户数据卡片 -->
<a-col :span="6">
<a-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
<a-card class="data-card user-card">
<template #title>
<span class="card-title">
<span class="icon-wrapper user-icon">
<svg class="icon" viewBox="0 0 1024 1024" width="24" height="24">
<svg class="icon" viewBox="0 0 1024 1024" width="20" height="20">
<path d="M858.5 763.6c-18.9-44.8-46.1-85-80.6-119.5-34.5-34.5-74.7-61.6-119.5-80.6-0.4-0.2-0.8-0.3-1.2-0.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-0.4 0.2-0.8 0.3-1.2 0.5-44.8 18.9-85 46-119.5 80.6-34.5 34.5-61.6 74.7-80.6 119.5C146.9 807.5 137 854 136 901.8c-0.1 4.5 3.5 8.2 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c0.1 4.4 3.6 7.8 8 7.8h60c4.5 0 8.1-3.7 8-8.2-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z" fill="currentColor"></path>
</svg>
</span>
用户数据
用户
</span>
</template>
<a-statistic
@ -64,16 +64,16 @@
</a-col>
<!-- 配送订单数据卡片 -->
<a-col :span="6">
<a-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
<a-card class="data-card order-card">
<template #title>
<span class="card-title">
<span class="icon-wrapper order-icon">
<svg class="icon" viewBox="0 0 1024 1024" width="24" height="24">
<svg class="icon" viewBox="0 0 1024 1024" width="20" height="20">
<path d="M832 312H696v-16c0-101.6-82.4-184-184-184s-184 82.4-184 184v16H192c-17.7 0-32 14.3-32 32v536c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V344c0-17.7-14.3-32-32-32z m-432-16c0-61.9 50.1-112 112-112s112 50.1 112 112v16H400v-16z m392 544H232V384h96v88c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-88h224v88c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-88h96v456z" fill="currentColor"></path>
</svg>
</span>
配送订单
配送订单
</span>
</template>
<div class="main-stat-row">
@ -113,12 +113,12 @@
</a-col>
<!-- 订单金额数据卡片 -->
<a-col :span="6">
<a-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
<a-card class="data-card amount-card">
<template #title>
<span class="card-title">
<span class="icon-wrapper amount-icon">
<svg class="icon" viewBox="0 0 1024 1024" width="24" height="24">
<svg class="icon" viewBox="0 0 1024 1024" width="20" height="20">
<path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64z m0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" fill="currentColor"></path>
<path d="M426.6 599.7V521H344c-4.4 0-8-3.6-8-8v-48c0-4.4 3.6-8 8-8h82.6v-78.7c0-4.4 3.6-8 8-8h52c4.4 0 8 3.6 8 8V457H592c4.4 0 8 3.6 8 8v48c0 4.4-3.6 8-8 8h-97.4v78.7c0 4.4-3.6 8-8 8h-52c-4.4 0-8-3.6-8-8z" fill="currentColor"></path>
</svg>
@ -425,18 +425,19 @@ export default defineComponent({
}
:deep(.ant-card-head) {
min-height: 48px;
padding: 0 16px;
min-height: 42px;
padding: 0 12px;
border-bottom: none;
.ant-card-head-title {
padding: 16px 0;
padding: 12px 0;
font-weight: 600;
font-size: 15px;
}
}
:deep(.ant-card-body) {
padding: 0 20px 20px;
padding: 0 15px 15px;
}
&::before {
@ -517,8 +518,8 @@ export default defineComponent({
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
width: 34px;
height: 34px;
border-radius: 50%;
}
@ -548,20 +549,20 @@ export default defineComponent({
}
.icon {
font-size: 24px;
font-size: 20px;
}
.main-stat {
margin-bottom: 16px;
margin-bottom: 12px;
:deep(.ant-statistic-title) {
font-size: 14px;
font-size: 13px;
color: rgba(0, 0, 0, 0.65);
margin-bottom: 8px;
margin-bottom: 6px;
}
:deep(.ant-statistic-content) {
font-size: 30px;
font-size: 26px;
font-weight: 600;
}
}
@ -569,13 +570,13 @@ export default defineComponent({
.main-stat-row {
display: flex;
justify-content: space-between;
margin-bottom: 16px;
margin-bottom: 12px;
.main-stat {
margin-bottom: 0;
:deep(.ant-statistic-content) {
font-size: 24px;
font-size: 22px;
}
}
}
@ -584,11 +585,11 @@ export default defineComponent({
display: flex;
justify-content: space-between;
border-top: 1px solid #f0f0f0;
padding-top: 16px;
margin-top: 8px;
padding-top: 12px;
margin-top: 6px;
:deep(.ant-statistic) {
padding: 0 12px;
padding: 0 8px;
&:first-child {
padding-left: 0;
@ -599,13 +600,13 @@ export default defineComponent({
}
.ant-statistic-title {
font-size: 14px;
margin-bottom: 4px;
font-size: 13px;
margin-bottom: 3px;
color: rgba(0, 0, 0, 0.65);
}
.ant-statistic-content {
font-size: 20px;
font-size: 18px;
font-weight: 500;
}
}
@ -681,4 +682,30 @@ export default defineComponent({
transition: background 0.3s;
}
}
@media (max-width: 768px) {
.data-overview {
margin-bottom: 16px;
}
.data-card {
margin-bottom: 16px;
}
.main-stat-row {
.main-stat {
:deep(.ant-statistic-content) {
font-size: 20px;
}
}
}
.sub-stats {
:deep(.ant-statistic) {
.ant-statistic-content {
font-size: 16px;
}
}
}
}
</style>