gxwebsoft/pc-10584
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(router): 更新路由结构并优化页面组件

Browse Source 
- 移除经营范围按钮，精简导航栏
- 实现文章标题链接功能，提升用户体验
- 添加商品详情页面包屑导航，支持分类跳转
- 引入配送管理相关页面（区域、接单台、配送员、派单）
- 替换控制台布局为站点头部和底部组件
- 重构商品分类页面，集成CMS导航功能
- 新增文章详情页面，支持多种访问方式
- 删除已迁移的创建应用和空应用页面
- 优化样式和组件导入，提升代码质量
This commit is contained in:
赵忠林
2026-01-29 16:21:22 +08:00
parent 26c236041f
commit 682e264a6f
22 changed files with 1309 additions and 881 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
app/pages/delivery/areas.vue Normal file
View File

@@ -0,0 +1,23 @@
<template>
<div class="mx-auto max-w-screen-md px-4 py-16">
<a-result status="info" title="配送范围（地图划区）" sub-title="该模块正在建设中：配送点范围绘制/编辑/保存与地址落点校验。">
<template #extra>
<a-space>
<a-button type="primary" @click="navigateTo('/delivery')">返回配送管理</a-button>
<a-button @click="navigateTo('/')">返回首页</a-button>
</a-space>
</template>
</a-result>
</div>
</template>
<script setup lang="ts">
import { usePageSeo } from '@/composables/usePageSeo'
usePageSeo({
title: '配送范围（地图划区）',
description: '配送点范围绘制/编辑/保存与地址落点校验（建设中）。',
path: '/delivery/areas'
})
</script>

27
app/pages/delivery/board.vue Normal file
View File

@@ -0,0 +1,27 @@
<template>
<div class="mx-auto max-w-screen-md px-4 py-16">
<a-result
status="info"
title="接单台"
sub-title="该模块正在建设中：可接订单列表、超时标签、按日期筛选与接单操作。"
>
<template #extra>
<a-space>
<a-button type="primary" @click="navigateTo('/delivery')">返回配送管理</a-button>
<a-button @click="navigateTo('/')">返回首页</a-button>
</a-space>
</template>
</a-result>
</div>
</template>
<script setup lang="ts">
import { usePageSeo } from '@/composables/usePageSeo'
usePageSeo({
title: '接单台',
description: '可接订单列表、超时标签、按日期筛选与接单操作（建设中）。',
path: '/delivery/board'
})
</script>

27
app/pages/delivery/couriers.vue Normal file
View File

@@ -0,0 +1,27 @@
<template>
<div class="mx-auto max-w-screen-md px-4 py-16">
<a-result
status="info"
title="配送员"
sub-title="该模块正在建设中：配送员管理、负责小区配置、自动派单/人工派单与工资统计。"
>
<template #extra>
<a-space>
<a-button type="primary" @click="navigateTo('/delivery')">返回配送管理</a-button>
<a-button @click="navigateTo('/')">返回首页</a-button>
</a-space>
</template>
</a-result>
</div>
</template>
<script setup lang="ts">
import { usePageSeo } from '@/composables/usePageSeo'
usePageSeo({
title: '配送员',
description: '配送员管理、负责小区配置、自动派单/人工派单与工资统计（建设中）。',
path: '/delivery/couriers'
})
</script>

27
app/pages/delivery/dispatch.vue Normal file
View File

@@ -0,0 +1,27 @@
<template>
<div class="mx-auto max-w-screen-md px-4 py-16">
<a-result
status="info"
title="人工派单"
sub-title="该模块正在建设中：配送点管理员查看待派单订单、选择配送员并通知配送员端。"
>
<template #extra>
<a-space>
<a-button type="primary" @click="navigateTo('/delivery')">返回配送管理</a-button>
<a-button @click="navigateTo('/')">返回首页</a-button>
</a-space>
</template>
</a-result>
</div>
</template>
<script setup lang="ts">
import { usePageSeo } from '@/composables/usePageSeo'
usePageSeo({
title: '人工派单',
description: '配送点管理员派单与通知配送员端（建设中）。',
path: '/delivery/dispatch'
})
</script>

204
app/pages/delivery/index.vue Normal file
View File

@@ -0,0 +1,204 @@
<template>
<main class="delivery">
<section class="delivery-hero">
<div class="delivery-hero-mask">
<div class="mx-auto max-w-screen-xl px-4 py-10">
<a-breadcrumb class="delivery-breadcrumb">
<a-breadcrumb-item>
<NuxtLink to="/">首页</NuxtLink>
</a-breadcrumb-item>
<a-breadcrumb-item>配送</a-breadcrumb-item>
</a-breadcrumb>
<div class="delivery-hero-title">配送管理</div>
<div class="delivery-hero-sub">
配送区域划分、配送员自动派单/人工派单、工资统计与接单台（原型/规划页）
</div>
<div class="mt-4 flex flex-wrap items-center gap-2">
<a-button type="primary" @click="navigateTo('/delivery/areas')">配送范围（地图划区）</a-button>
<a-button @click="navigateTo('/delivery/couriers')">配送员</a-button>
<a-button @click="navigateTo('/delivery/board')">接单台</a-button>
<a-button @click="navigateTo('/delivery/settings')">设置</a-button>
</div>
</div>
</div>
</section>
<section class="mx-auto max-w-screen-xl px-4 py-10">
<a-row :gutter="[16, 16]">
<a-col :xs="24" :sm="12" :lg="6">
<a-card :bordered="false" class="kpi-card">
<a-statistic title="配送点" :value="kpi.points" />
</a-card>
</a-col>
<a-col :xs="24" :sm="12" :lg="6">
<a-card :bordered="false" class="kpi-card">
<a-statistic title="配送员" :value="kpi.couriers" />
</a-card>
</a-col>
<a-col :xs="24" :sm="12" :lg="6">
<a-card :bordered="false" class="kpi-card">
<a-statistic title="待派单" :value="kpi.pendingDispatch" />
</a-card>
</a-col>
<a-col :xs="24" :sm="12" :lg="6">
<a-card :bordered="false" class="kpi-card">
<a-statistic title="今日配送单" :value="kpi.todayOrders" />
</a-card>
</a-col>
</a-row>
<a-alert
class="mt-4"
show-icon
type="info"
message="说明"
description="当前页面用于梳理配送相关需求与页面入口，后续再逐步落地：地图划区、自动派单、工资统计、确认收货与接单台。"
/>
<a-row class="mt-6" :gutter="[24, 24]">
<a-col :xs="24" :lg="12">
<a-card title="配送范围（配送点维度）" class="module-card" :bordered="false">
<a-list size="small" :data-source="deliveryAreaItems">
<template #renderItem="{ item }">
<a-list-item>{{ item }}</a-list-item>
</template>
</a-list>
<div class="mt-4 flex flex-wrap gap-2">
<a-button type="primary" @click="navigateTo('/delivery/areas')">进入地图划区</a-button>
<a-button @click="navigateTo('/delivery/settings')">配置配送点</a-button>
</div>
</a-card>
</a-col>
<a-col :xs="24" :lg="12">
<a-card title="配送员（站点维度）" class="module-card" :bordered="false">
<a-list size="small" :data-source="courierItems">
<template #renderItem="{ item }">
<a-list-item>{{ item }}</a-list-item>
</template>
</a-list>
<div class="mt-4 flex flex-wrap gap-2">
<a-button type="primary" @click="navigateTo('/delivery/couriers')">配送员管理</a-button>
<a-button @click="navigateTo('/delivery/settings')">工资/自动确认设置</a-button>
</div>
</a-card>
</a-col>
<a-col :xs="24">
<a-card title="接单台（配送员端）" class="module-card" :bordered="false">
<a-row :gutter="[24, 24]">
<a-col :xs="24" :lg="12">
<a-list size="small" :data-source="boardItems">
<template #renderItem="{ item }">
<a-list-item>{{ item }}</a-list-item>
</template>
</a-list>
<div class="mt-4 flex flex-wrap gap-2">
<a-button type="primary" @click="navigateTo('/delivery/board')">进入接单台</a-button>
<a-button @click="navigateTo('/delivery/dispatch')">人工派单</a-button>
</div>
</a-col>
<a-col :xs="24" :lg="12">
<a-typography-title :level="5" class="!mb-3">配送完成链路（建议流程）</a-typography-title>
<a-timeline>
<a-timeline-item>下单 → 生成配送订单</a-timeline-item>
<a-timeline-item>地址落点 → 判断配送点范围</a-timeline-item>
<a-timeline-item>若属于某配送员负责小区 → 自动派单</a-timeline-item>
<a-timeline-item>否则 → 配送点管理员人工派单（通知配送员端）</a-timeline-item>
<a-timeline-item>配送员接单 → 配送中</a-timeline-item>
<a-timeline-item>送达 → 可选拍照 → 配送员确认送达</a-timeline-item>
<a-timeline-item>客户确认收货；若未确认，按配置自动确认（默认 24h）</a-timeline-item>
</a-timeline>
</a-col>
</a-row>
</a-card>
</a-col>
</a-row>
</section>
</main>
</template>
<script setup lang="ts">
import { usePageSeo } from '@/composables/usePageSeo'
usePageSeo({
title: '配送管理',
description: '配送范围划区、配送员派单规则、工资统计与接单台需求梳理。',
path: '/delivery'
})
const kpi = reactive({
points: 0,
couriers: 0,
pendingDispatch: 0,
todayOrders: 0
})
const deliveryAreaItems = [
'每个配送点的配送范围可独立设置',
'在地图上划分区域（多边形/多个区域/禁配送区等）',
'订单地址落点后判断是否在范围内（点-in-多边形）'
]
const courierItems = [
'每个配送点可配置 N 个配送员',
'可设置配送员负责的小区；属于该小区的订单自动派给对应配送员',
'收货地址不属于任何小区：配送点管理员人工派单（需同步到配送员端）',
'工资统计：水按桶计提成；其它商品按金额/规则计提成；默认当月，可选时间段查询；线下结算',
'第三方配送点：不计算配送员工资',
'送达后：配送员可选拍照并确认送达；客户确认收货；未确认则按配置自动确认（默认 24h）'
]
const boardItems = [
'配送员可查看所属站点的配送订单列表',
'按配送时间降序排序',
'按配送日期筛选查询可接订单',
'超时订单也可接单，并显示“超时”标签提醒'
]
</script>
<style scoped>
.delivery {
background: #f4f6f8;
}
.delivery-hero {
background:
radial-gradient(circle at 15% 20%, rgba(22, 163, 74, 0.22), transparent 60%),
radial-gradient(circle at 85% 10%, rgba(59, 130, 246, 0.18), transparent 55%),
linear-gradient(180deg, #ffffff, #f8fafc);
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.delivery-hero-mask {
background: linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.92));
}
.delivery-breadcrumb {
color: rgba(0, 0, 0, 0.6);
}
.delivery-hero-title {
margin-top: 10px;
font-size: 30px;
font-weight: 900;
color: rgba(0, 0, 0, 0.88);
line-height: 1.2;
}
.delivery-hero-sub {
margin-top: 10px;
color: rgba(0, 0, 0, 0.6);
line-height: 1.6;
}
.kpi-card,
.module-card {
border-radius: 12px;
overflow: hidden;
box-shadow: 0 10px 28px rgba(0, 0, 0, 0.06);
}
</style>

27
app/pages/delivery/settings.vue Normal file
View File

@@ -0,0 +1,27 @@
<template>
<div class="mx-auto max-w-screen-md px-4 py-16">
<a-result
status="info"
title="配送设置"
sub-title="该模块正在建设中：自动确认收货时长、工资规则（按桶/按金额）、第三方配送点开关等。"
>
<template #extra>
<a-space>
<a-button type="primary" @click="navigateTo('/delivery')">返回配送管理</a-button>
<a-button @click="navigateTo('/')">返回首页</a-button>
</a-space>
</template>
</a-result>
</div>
</template>
<script setup lang="ts">
import { usePageSeo } from '@/composables/usePageSeo'
usePageSeo({
title: '配送设置',
description: '自动确认收货时长、工资规则、第三方配送点开关（建设中）。',
path: '/delivery/settings'
})
</script>