front/src/views/home/workplace/composables/useWorkplaceFulfillPickupStats.ts
zzh b5edbb8447 feat: 页面背景预设与工作台增强,优化官网与登录体验
新增石米等淡色背景预设并设为默认,修复页面配置抽屉偶发不弹出问题,移除登录欢迎卡;同步 IDE 官网导航与背景样式,并扩展管理端工作台统计展示。

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-28 10:59:10 +08:00

172 lines
4.5 KiB
TypeScript

import { computed, onMounted, ref } from 'vue'
import { useRouter } from 'vue-router'
import {
getOrderWorkplaceStats,
type FulfillWorkplaceStats,
type PickupWorkplaceStats,
} from '@/api/workplace'
import iconStorePending from '@/assets/icons/workplace/order-store-pending.svg?url'
import iconPendingShip from '@/assets/icons/workplace/order-pending-ship.svg?url'
import iconPendingOnline from '@/assets/icons/workplace/order-pending-online.svg?url'
import iconShipped from '@/assets/icons/workplace/order-shipped.svg?url'
import iconNew from '@/assets/icons/workplace/order-new.svg?url'
export type WorkplaceStatTone = 'neutral' | 'primary' | 'warning' | 'danger' | 'success'
export type WorkplaceStatItem = {
key: string
titleKey: string
value: number
icon: string
tone: WorkplaceStatTone
alert?: boolean
path: string
query: Record<string, string>
}
const FULFILL_PATH = '/order/fulfillOrders'
const PICKUP_PATH = '/order/pickupOrder'
const defaultFulfill = (): FulfillWorkplaceStats => ({
pendingBind: 0,
domesticInTransit: 0,
arrivedPendingPick: 0,
outboundDone: 0,
})
const defaultPickup = (): PickupWorkplaceStats => ({
pendingPayment: 0,
pendingSchedule: 0,
pendingPickup: 0,
pendingInbound: 0,
})
const fulfill = ref<FulfillWorkplaceStats>(defaultFulfill())
const pickup = ref<PickupWorkplaceStats>(defaultPickup())
const loading = ref(false)
let loadPromise: Promise<void> | null = null
async function loadStats() {
if (loadPromise) return loadPromise
loading.value = true
loadPromise = (async () => {
try {
const stats = await getOrderWorkplaceStats()
fulfill.value = stats.fulfill
pickup.value = stats.pickup
} catch {
fulfill.value = defaultFulfill()
pickup.value = defaultPickup()
} finally {
loading.value = false
}
})()
return loadPromise
}
export function useWorkplaceFulfillPickupStats() {
const router = useRouter()
const fulfillItems = computed<WorkplaceStatItem[]>(() => [
{
key: 'pendingBind',
titleKey: 'workplace.admin.fulfill.pendingBind',
value: fulfill.value.pendingBind,
icon: iconStorePending,
tone: 'warning',
alert: true,
path: FULFILL_PATH,
query: { progress: 'pendingBind' },
},
{
key: 'domesticInTransit',
titleKey: 'workplace.admin.fulfill.domesticInTransit',
value: fulfill.value.domesticInTransit,
icon: iconPendingOnline,
tone: 'neutral',
path: FULFILL_PATH,
query: { progress: 'domesticInTransit' },
},
{
key: 'arrivedPendingPick',
titleKey: 'workplace.admin.fulfill.arrivedPendingPick',
value: fulfill.value.arrivedPendingPick,
icon: iconPendingShip,
tone: 'warning',
alert: true,
path: FULFILL_PATH,
query: { progress: 'arrivedPendingPick' },
},
{
key: 'outboundDone',
titleKey: 'workplace.admin.fulfill.outboundDone',
value: fulfill.value.outboundDone,
icon: iconShipped,
tone: 'success',
path: FULFILL_PATH,
query: { progress: 'outboundDone' },
},
])
const pickupItems = computed<WorkplaceStatItem[]>(() => [
{
key: 'pendingPayment',
titleKey: 'workplace.admin.pickup.pendingPayment',
value: pickup.value.pendingPayment,
icon: iconPendingOnline,
tone: 'warning',
alert: true,
path: PICKUP_PATH,
query: { status: 'pendingPayment' },
},
{
key: 'pendingSchedule',
titleKey: 'workplace.admin.pickup.pendingSchedule',
value: pickup.value.pendingSchedule,
icon: iconNew,
tone: 'neutral',
path: PICKUP_PATH,
query: { status: 'draft' },
},
{
key: 'pendingPickup',
titleKey: 'workplace.admin.pickup.pendingPickup',
value: pickup.value.pendingPickup,
icon: iconPendingShip,
tone: 'warning',
alert: true,
path: PICKUP_PATH,
query: { status: 'scheduled' },
},
{
key: 'pendingInbound',
titleKey: 'workplace.admin.pickup.pendingInbound',
value: pickup.value.pendingInbound,
icon: iconShipped,
tone: 'primary',
path: PICKUP_PATH,
query: { status: 'picked' },
},
])
function formatValue(n: number) {
return Math.round(Number(n) || 0).toLocaleString('zh-CN')
}
function go(item: WorkplaceStatItem) {
router.push({ path: item.path, query: item.query }).catch(() => undefined)
}
onMounted(() => {
void loadStats()
})
return {
loading,
fulfillItems,
pickupItems,
formatValue,
go,
}
}