aaron/dman-web-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

uipdate

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/views/community/TimePeriodList.vue
View File

@ -221,9 +221,19 @@ export default defineComponent({
} }
const res = await request.get('/api/community-time-periods/group_by_community', { params }) const res = await request.get('/api/community-time-periods/group_by_community', { params })
if (res.code === 200) { if (res.code === 200 && res.data) {
tableData.value = res.data.items || res.data // 确保从正确的路径获取数据
pagination.value.total = res.data.total || res.data.length 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 { } else {
message.error(res.message || '获取数据失败') message.error(res.message || '获取数据失败')
} }

87
src/views/dashboard/Dashboard.vue
View File

@ -3,16 +3,16 @@
<div class="dashboard"> <div class="dashboard">
<a-row :gutter="24" class="data-overview"> <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"> <a-card class="data-card community-card">
<template #title> <template #title>
<span class="card-title"> <span class="card-title">
<span class="icon-wrapper community-icon"> <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> <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> </svg>
</span> </span>
小区数据 开通小区
</span> </span>
</template> </template>
<a-statistic <a-statistic
@ -25,16 +25,16 @@
</a-col> </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"> <a-card class="data-card user-card">
<template #title> <template #title>
<span class="card-title"> <span class="card-title">
<span class="icon-wrapper user-icon"> <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> <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> </svg>
</span> </span>
用户数据 总用户
</span> </span>
</template> </template>
<a-statistic <a-statistic
@ -64,16 +64,16 @@
</a-col> </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"> <a-card class="data-card order-card">
<template #title> <template #title>
<span class="card-title"> <span class="card-title">
<span class="icon-wrapper order-icon"> <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> <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> </svg>
</span> </span>
配送订单数 配送订单
</span> </span>
</template> </template>
<div class="main-stat-row"> <div class="main-stat-row">
@ -113,12 +113,12 @@
</a-col> </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"> <a-card class="data-card amount-card">
<template #title> <template #title>
<span class="card-title"> <span class="card-title">
<span class="icon-wrapper amount-icon"> <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="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> <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> </svg>
@ -425,18 +425,19 @@ export default defineComponent({
} }
:deep(.ant-card-head) { :deep(.ant-card-head) {
min-height: 48px; min-height: 42px;
padding: 0 16px; padding: 0 12px;
border-bottom: none; border-bottom: none;
.ant-card-head-title { .ant-card-head-title {
padding: 16px 0; padding: 12px 0;
font-weight: 600; font-weight: 600;
font-size: 15px;
} }
} }
:deep(.ant-card-body) { :deep(.ant-card-body) {
padding: 0 20px 20px; padding: 0 15px 15px;
} }
&::before { &::before {
@ -517,8 +518,8 @@ export default defineComponent({
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
width: 40px; width: 34px;
height: 40px; height: 34px;
border-radius: 50%; border-radius: 50%;
} }
@ -548,20 +549,20 @@ export default defineComponent({
} }
.icon { .icon {
font-size: 24px; font-size: 20px;
} }
.main-stat { .main-stat {
margin-bottom: 16px; margin-bottom: 12px;
:deep(.ant-statistic-title) { :deep(.ant-statistic-title) {
font-size: 14px; font-size: 13px;
color: rgba(0, 0, 0, 0.65); color: rgba(0, 0, 0, 0.65);
margin-bottom: 8px; margin-bottom: 6px;
} }
:deep(.ant-statistic-content) { :deep(.ant-statistic-content) {
font-size: 30px; font-size: 26px;
font-weight: 600; font-weight: 600;
} }
} }
@ -569,13 +570,13 @@ export default defineComponent({
.main-stat-row { .main-stat-row {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-bottom: 16px; margin-bottom: 12px;
.main-stat { .main-stat {
margin-bottom: 0; margin-bottom: 0;
:deep(.ant-statistic-content) { :deep(.ant-statistic-content) {
font-size: 24px; font-size: 22px;
} }
} }
} }
@ -584,11 +585,11 @@ export default defineComponent({
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
border-top: 1px solid #f0f0f0; border-top: 1px solid #f0f0f0;
padding-top: 16px; padding-top: 12px;
margin-top: 8px; margin-top: 6px;
:deep(.ant-statistic) { :deep(.ant-statistic) {
padding: 0 12px; padding: 0 8px;
&:first-child { &:first-child {
padding-left: 0; padding-left: 0;
@ -599,13 +600,13 @@ export default defineComponent({
} }
.ant-statistic-title { .ant-statistic-title {
font-size: 14px; font-size: 13px;
margin-bottom: 4px; margin-bottom: 3px;
color: rgba(0, 0, 0, 0.65); color: rgba(0, 0, 0, 0.65);
} }
.ant-statistic-content { .ant-statistic-content {
font-size: 20px; font-size: 18px;
font-weight: 500; font-weight: 500;
} }
} }
@ -681,4 +682,30 @@ export default defineComponent({
transition: background 0.3s; 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> </style>