fix(dashboard): correct overview data and states
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<script lang="tsx">
|
||||
import { compile, computed, defineComponent, h, ref } from 'vue';
|
||||
import { compile, computed, defineComponent, h, ref, watch } from 'vue';
|
||||
import type { RouteMeta } from 'vue-router';
|
||||
import { type RouteRecordRaw, useRoute, useRouter } from 'vue-router';
|
||||
import { useAppStore } from '@/store';
|
||||
@@ -67,21 +67,24 @@ export default defineComponent({
|
||||
});
|
||||
return result;
|
||||
};
|
||||
listenerRouteChange((newRoute) => {
|
||||
const syncMenuSelection = (newRoute: typeof route) => {
|
||||
const { requiresAuth, activeMenu, hideInMenu } = newRoute.meta;
|
||||
if (requiresAuth && (!hideInMenu || activeMenu)) {
|
||||
const target = (activeMenu || newRoute.name) as string;
|
||||
const menuOpenKeys = findMenuOpenKeys(
|
||||
(activeMenu || newRoute.name) as string,
|
||||
target,
|
||||
);
|
||||
|
||||
if (!menuOpenKeys.length) return;
|
||||
|
||||
const keySet = new Set([...menuOpenKeys, ...openKeys.value]);
|
||||
openKeys.value = [...keySet];
|
||||
|
||||
selectedKey.value = [
|
||||
activeMenu || menuOpenKeys[menuOpenKeys.length - 1],
|
||||
];
|
||||
selectedKey.value = [target];
|
||||
}
|
||||
}, true);
|
||||
};
|
||||
listenerRouteChange(syncMenuSelection, true);
|
||||
watch(menuTree, () => syncMenuSelection(route), { deep: true, flush: 'post' });
|
||||
const setCollapse = (val: boolean) => {
|
||||
if (appStore.device === 'desktop')
|
||||
appStore.updateSettings({ menuCollapse: val });
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
{{ errorMessage }}
|
||||
<template #action><a-button size="small" @click="loadOverview">重新加载</a-button></template>
|
||||
</a-alert>
|
||||
<div class="dashboard-meta">统计口径以服务端为准 · 更新时间:{{ updatedAt || '尚未加载' }}</div>
|
||||
<div class="dashboard-meta">统计口径以服务端为准 · 更新时间:{{ updatedAtLabel }}</div>
|
||||
<a-grid :cols="{ xs: 1, sm: 2, lg: 4 }" :col-gap="16" :row-gap="16">
|
||||
<a-grid-item v-for="item in cards" :key="item.key">
|
||||
<a-card :bordered="false" class="metric-card">
|
||||
@@ -65,16 +65,15 @@ const emptyOverview = (): DashboardOverview => ({
|
||||
const loading = ref(false);
|
||||
const errorMessage = ref('');
|
||||
const updatedAt = ref('');
|
||||
const updatedAtLabel = computed(() => updatedAt.value || (errorMessage.value ? '加载失败' : '加载中…'));
|
||||
const overview = ref<DashboardOverview>(emptyOverview());
|
||||
const router = useRouter();
|
||||
const userStore = useUserStore();
|
||||
const cards: { key: CountKey; label: string; hint: string; money?: boolean }[] = [
|
||||
{ key: 'gas_basic_count', label: '启用气站', hint: '当前正常运营' },
|
||||
{ key: 'delivery_basic_count', label: '启用配送点', hint: '跨组织汇总' },
|
||||
{ key: 'staff_count', label: '在岗人员', hint: '当前可接单' },
|
||||
{ key: 'user_count', label: '启用客户', hint: '有效业主账户' },
|
||||
{ key: 'product_count', label: '智能气阀', hint: '已启用资产' },
|
||||
{ key: 'active_contract_count', label: '生效合同', hint: '当前履约中' },
|
||||
{ key: 'gas_basic_count', label: '气站总数', hint: '正常运营气站总数' },
|
||||
{ key: 'delivery_basic_count', label: '配送点总数', hint: '正常运营配送点总数' },
|
||||
{ key: 'user_count', label: '客户总数', hint: '有效客户账户总数' },
|
||||
{ key: 'product_count', label: '智能气阀', hint: '平台智能气阀总数' },
|
||||
{ key: 'today_order_count', label: '今日订单', hint: '自然日新增' },
|
||||
{ key: 'today_order_amount', label: '今日应付金额', hint: '订单口径', money: true },
|
||||
{ key: 'pending_ticket_count', label: '待受理工单', hint: '客服待办' },
|
||||
@@ -149,8 +148,8 @@ onMounted(loadOverview);
|
||||
.dashboard-spin { width: 100%; }
|
||||
.dashboard-alert { margin-bottom: 16px; }
|
||||
.dashboard-meta { margin-bottom: 12px; color: var(--color-text-3); font-size: 12px; text-align: right; }
|
||||
.metric-card { min-height: 120px; }
|
||||
.metric-hint { margin-top: 8px; color: var(--color-text-3); font-size: 12px; }
|
||||
.metric-card { min-height: 132px; }
|
||||
.metric-hint { margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--color-border-2); color: var(--color-text-2); font-size: 13px; line-height: 20px; }
|
||||
.section-card { margin-top: 16px; }
|
||||
.quick-action { height: 52px; justify-content: flex-start; padding: 0 18px; }
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user