拆分客户/员工工作台,落地登录关怀、待办统计、公告双栏布局;同步接口映射 AI、H5 订单与相关页面优化。 Co-authored-by: Cursor <cursoragent@cursor.com>
15 KiB
管理端人文关怀设计方案
文档状态:P0 / P1 / P2(本机配置页)已落地;租户服务端配置待接
编写日期:2026-08-09
最近更新:2026-08-09(双工作台:员工 AdminWorkplace / 客户 CustomerWorkplace)
范围:管理端(OmsLoginType.User)登录关怀与工作台「今日关照」;不含 H5 客户侧对客安抚
关联代码:src/utils/admin-login-care.ts、LoginCareBanner.vue、AdminLoginCareToast.vue、src/views/home/workplace/*
关联规范:docs/前端页面设计规范.md
目标读者:产品、前端、后端(轻量)、运营
0 阅读指引
| 角色 | 优先阅读 |
|---|---|
| 产品 / 运营 | §1~§4、§8 |
| 前端 | §3~§7、§9 |
| 后端 | §6、§7 |
| 测试 | §8、§9 |
分期对照(务必先对齐)
| 阶段 | 名称 | 是否独立菜单页 | 交付物 |
|---|---|---|---|
| 已完成 | 登录瞬间关怀 | 否 | 登录横幅 + 登录成功液态卡片 |
| P0 | 工作台「今日关照」 | 否(工作台模块) | 右侧卡片:减压文案 + 待办摘要 + 快捷入口 |
| P1 | 关照增强 | 否 | 交接提示、旺季条、收工仪式、周一/五语气 |
| P2 | 运营配置 | 是(设置子页) | 开关、旺季区间、生日墙隐私、文案覆盖 |
| 不做 | 「关怀中心」一级菜单 | — | 易空、与 OMS 主路径脱节 |
1 背景与目标
1.1 为什么要做
物流中后台一线长期面对:预警、超时、客诉、非工作时间值守。产品若只堆 KPI,容易「系统很忙、人很累」。人文关怀的目标不是鸡汤,而是:
- 被看见:非工作时间、节假日、入职周年、好久不见等,用轻提示确认「系统知道你还在」。
- 减压力:把「今天最该先做的」说清楚,避免一上来面对整屏数字。
- 可关闭、可配置:不骚扰;敏感信息(同事生日)默认克制。
1.2 建设目标
- 分层触达:登录瞬间(低频、仪式感)≠ 工作台日常(高频、可行动)。
- 跟业务挂钩:P0 起接入真实待办/预警数量,文案服务于「先做什么」。
- 视觉统一:沿用登录关怀液态暖色卡片质感,工作台卡片与现有 workplace 风格协调。
- 先模块后配置页:员工侧不新增一级菜单;管理员配置进 P2 设置子页。
1.3 设计原则
- 一事一触达:同一天同类关怀不重复轰炸(登录卡与工作台可互补,不复制全文)。
- 减压优先于激励:待办很高时,文案侧重「按优先级、不必一次清完」,禁止催促口吻。
- 无数据不硬猜:没有员工档案 / 待办接口时,降级为通用欢迎,不编造。
- 隐私默认关:同事生日墙、部门曝光需显式开启。
- 不做成考勤:禁止「你又迟到登录」类话术;深夜提醒只关心身体,不考核。
2 现状(已完成)
2.1 登录页横幅 LoginCareBanner
- 挂载:管理端登录页(
shellReady后)。 - 优先级:节假日 → 非工作时间 → 时段问候。
- 视觉:右上液态暖色卡片(模糊色斑 + 轻微形变)。
2.2 登录成功卡片 AdminLoginCareToast
- 挂载:
App.vue全局 Teleport,进系统后再弹出(避免登录页卸载冲掉)。 - 能力:生日 / 即将生日、入职周年、节假日 Toast、好久不见(≥7 天)、司龄里程碑、连续深夜(近 7 天 ≥3 个深夜日)、非工作时间致谢。
- 本地存储(按 userId):
oms-admin-care-last-login:{userId}oms-admin-care-late-night:{userId}
2.3 主题色液态预设
- 页面配置抽屉中「暖色液态质感」小卡片(蜜桃/暖杏/…/雾蓝/焰红等),与关怀视觉同源,不改变关怀业务逻辑。
2.4 明确不在「已完成」内
| 项 | 说明 |
|---|---|
| 工作台日常关照 | 未做 |
| 待办减压文案 | 未做 |
| 交接班 / 旺季 / 收工 | 未做 |
| 运营配置页 | 未做 |
| 客户侧安抚话术 | 另案,不在本文 |
3 信息架构与落点决策
3.1 三层落点
登录瞬间(低频仪式)
├─ LoginCareBanner(未登录)
└─ AdminLoginCareToast(刚进系统)
日常工作(高频可行动) ← P0 / P1 主战场
└─ 工作台右侧「今日关照」模块
运营治理(低频配置) ← P2
└─ 系统设置 / 页面配置旁「人文关怀」子页
(或「系统管理 → 人文关怀」;禁止一级业务菜单)
3.2 为什么不要独立「关怀中心」页
| 问题 | 说明 |
|---|---|
| 路径空 | 关怀不是每天要「打开办理」的业务单 |
| 与主任务脱节 | 员工主路径是订单 / 预警 / 轨迹,不是关怀列表 |
| 内容易鸡汤化 | 没有待办挂钩时,页面只剩文案 |
| 维护成本 | 多一套路由、权限、空态 |
结论:员工侧 = 工作台模块;配置侧 = 设置子页(P2)。
3.3 能力 × 落点矩阵
| 能力 | 登录横幅 | 登录成功卡 | 工作台「今日关照」 | 设置页 |
|---|---|---|---|---|
| 时段 / 非工作时间 | ✓ | ✓ | 可摘要一行 | 开关 |
| 节假日 | ✓ | ✓ | 当日条 | 日历/文案 |
| 生日 / 入职周年 | ✓ | 当日高亮一行 | ||
| 好久不见 / 连续深夜 | ✓ | 可选弱提示 | 阈值 | |
| 待办减压 + 数量 | ✓ 主 | |||
| 交接班标红摘要 | ✓ P1 | |||
| 旺季提示 | ✓ P1 | ✓ 区间 | ||
| 今日收工 | ✓ P1 按钮 | |||
| 同事生日墙 | ✓ P2(可关) | ✓ 隐私 | ||
| 首次成就 | 一次弹 |
4 P0 工作台「今日关照」(开工首选)
4.1 位置与布局
- 页面:
src/views/home/workplace/index.vue - 位置:右侧栏,
MarketingShortcuts与QuickOperation之间。 - 组件:
CareTodayPanel.vue - 交互原则(P0 已落实):
- 可收起,记住本机偏好,默认不强迫;
- 只给一条角色相关待办 + 一条「看一眼轨迹预警」软入口;
- 高压时文案减压(「不必一次清完」),禁止催促;
- 无待办时平静空态,不堆数字;
- 客户门户不展示。
- 视觉:液态暖色轻卡片,贴合工作台 panel,不抢主任务区。
建议信息结构(上 → 下):
┌─────────────────────────────┐
│ 今日关照 · 日期 [收起] │
│ 一句主文案(减压 / 节假日) │
│ 一句附注 │
│ [看一眼轨迹预警] │
│ [待发货 12 · 可点进去] │ ← 按角色最多一条
└─────────────────────────────┘
4.2 文案优先级(工作台主句)
同一时刻只展示 一条主文案(可另附数据行):
- 生日当天(若有档案)
- 入职周年当天
- 节假日
- 待办高压(如超时预警 ≥ 阈值,默认 5)→ 减压句
- 非工作时间
- 周一 / 周五语气(P1,可先留 hook)
- 默认:「稳稳推进就好」+ 时段
登录成功卡已说过的「好久不见 / 深夜」:工作台当天不再重复全文,最多以极短弱提示或干脆省略。
4.3 待办数据(P0 最小集)
优先复用已有工作台/订单统计,避免新造大接口。
| 字段 | 含义 | 来源建议 |
|---|---|---|
pendingCount |
待处理(定义需产品拍板:待审 / 待打单 / 待预报等) | 扩展 GET /order/workplace-stats 或现有字段映射 |
overdueWarningCount |
超时/标红预警数 | 轨迹预警或现有 warning API |
jumpPending |
待办列表路由 | 前端常量 |
jumpWarning |
预警列表路由 | 前端常量 |
拍板项(实施前确认)
pendingCount具体统计口径(按租户角色是否不同)。- 无权限或接口失败时:隐藏数字行,只保留文案(不报错打断工作台)。
4.4 前端状态
- 模块可本地折叠(
localStorage:oms-admin-care-panel-collapsed)。 - 不依赖登录卡是否已弹;工作台独立拉数。
- 管理端用户可见;客户登录进工作台时 不展示(与现有 Marketing 等客户模块区分)。
4.5 P0 明确不做
- 收工写库、交接班详情、旺季配置后台、生日墙、独立路由页。
5 P1 关照增强(工作台内演进)
| 项 | 状态 | 说明 |
|---|---|---|
| 周一 / 周五语气 | 已做 | 无更高优先级时微调主文案 |
| 旺季条 | 已做 | 前端常量:11–12 月;春节前后窗口(复用节假日表) |
| 开班引导 | 已做 | 上午 + 问题件 > 0:轻提示(不伪称精确「上一班」统计) |
| 今日收工 | 已做 | 本机仪式 + 可撤销;不写服务端、非考勤 |
| 角色口吻 | 已做 | 财务 / 客服 / 操作 / 轨迹 / 销售附注分支 |
6 P2 运营配置页(此时才「有页面」)
6.1 何时需要独立页
当出现以下任一需求时开工 P2,否则继续只用代码常量 + 本地存储:
- 运营要配旺季起止、而不发版;
- 要开关「同事生日墙」「深夜提醒」;
- 要覆盖默认文案(多语言仍走 i18n,覆盖存租户配置)。
6.2 页面定位
- 名称:人文关怀
- 路由:
/system/humanCare(SystemHumanCare) - 入口:系统管理菜单(若开启「菜单来自后端」,需在 RBAC 菜单中补一条指向该路由)
- 受众:租户管理员 / 运营,不是一线每人打开的页。
- 存储(首版):
localStorage键oms-admin-care-settings;页面已提示多设备不同步。后续换GET/PUT /system/care-settings。
6.3 配置项草案
| 键 | 类型 | 默认 | 说明 |
|---|---|---|---|
careEnabled |
bool | true | 总开关 |
loginBannerEnabled |
bool | true | 登录横幅 |
loginToastEnabled |
bool | true | 登录成功卡 |
workplacePanelEnabled |
bool | true | 今日关照 |
longAbsenceDays |
int | 7 | 好久不见阈值 |
lateNightThreshold |
int | 3 | 近 7 日深夜天数阈值 |
overdueCareThreshold |
int | 5 | 触发减压文案的超时数 |
peakSeason |
{start,end}? |
null | 旺季窗口 |
birthdayWallEnabled |
bool | false | 同事生日墙 |
clockOutEnabled |
bool | true | 收工按钮 |
存储:租户级配置表或现有系统参数;前端缓存到内存,变更后刷新。
7 接口与数据(分期)
7.1 P0
| 接口 | 用途 |
|---|---|
现有 getEmployeeByUser |
生日、入职、姓名(工作台主文案可选) |
现有 / 扩展 workplace-stats |
pending / overdue 数量 |
建议响应扩展(示意):
{
"pendingCount": 12,
"overdueWarningCount": 3
}
若短期不能改后端:前端用已有 stats 字段做最佳映射,并在模块注释标明「口径待对齐」。
7.2 P1~P2
| 接口 | 用途 |
|---|---|
GET /system/care-settings |
读配置 |
PUT /system/care-settings |
写配置(权限) |
GET /system/care/team-birthdays?days=7 |
生日墙(P2,需隐私) |
8 交互与文案规范
- 语气:平视、具体、可执行;避免「加油冲」「打工人」网络烂梗。
- 长度:主文案 ≤ 28 字;附注 ≤ 40 字。
- 频率:登录成功卡每登录一次;工作台主文案随数据刷新,不额外弹窗。
- 关闭:卡片右上可折叠;P2 提供总开关。
- i18n:
workplace.care.*/ 既有login.care.*;配置覆盖仅中文首版可接受,英文回落默认。
9 验收标准
9.1 P0
- 管理端工作台右侧出现「今日关照」,客户账号不出现。
- 有待办/预警数据时展示数字且可跳转;失败时优雅降级。
- 节假日 / 生日 / 周年当日主文案正确(可与登录卡并存但不重复堆砌)。
- 高压待办时出现减压文案,无催促措辞。
- 视觉不破坏现有 workplace 布局;符合前端规范主色变量。
9.2 P1
- 收工仅仪式或本地防抖,不误写考勤。
- 旺季条可关。
- 交接提示有数据才显示。
9.3 P2
- 无权限不可进配置页。
- 总开关关闭后登录卡与工作台模块均不展示。
- 生日墙默认关闭。
10 实施顺序(评审通过后)
- 文档评审(本文)——确认 pending 口径、模块摆放、是否跳过 P1 直接并行。
- P0 前端:
CareTodayPanel+ i18n + workplace 接入;stats 映射。 - P0 后端(若需):
workplace-stats补字段。 - P1:收工 / 旺季 / 交接 / 周一口吻。
- P2:配置页 + 权限 + 生日墙。
11 开放问题(已拍板)
| # | 问题 | 结论 |
|---|---|---|
| 1 | pendingCount 统计口径与角色差异? |
有角色差异:数据沿用 workplace-stats 的数据权限范围;展示时按角色偏好只引导 一条 待办(财务→待支付、客服→问题件优先、操作→待发货等),避免堆指标。 |
| 2 | 超时预警跳转? | /track/warningOrder |
| 3 | P2 入口? | 系统管理菜单(人文关怀配置页,P2 再做) |
| 4 | 管理端子角色是否全开? | 先全部开放(仅隐藏客户门户) |
13 双工作台(客户 / 员工)
客户门户 isCustomerPortal() |
管理端员工 | |
|---|---|---|
| 组件 | CustomerWorkplace.vue |
AdminWorkplace.vue |
| 入口判断 | home/workplace/index.vue |
同上 |
| 问候 Banner | ✓(含余额) | ✓(无余额) |
| 统计 / 订单分析 / 费用分析 | ✓ | 不展示 |
| 开始业务卡片 / 营销入口 | ✓ | 不展示 |
| 公告列表 | ✓ | 不展示 |
| 今日关照 | 不展示 | 左下左列(节奏标签并入;仅一个主行动) |
| 常用入口 | 下单流程 | 左下右列,按角色 3~4 个 |
| 世界时间 | 统计卡底部可折叠 | 融进今日待办底部,默认展开,小卡片网格 |
| 公告 | 右侧栏 | 右侧栏公告卡(与客户工作台同组件) |
布局:左右双栏(对齐客户工作台比例)。
左:问候 + 今日待办(stat-card)+ 世界时间小卡 → 关照 | 快捷入口。
右:公告(撑满高度)。
待办有量按紧急度排序;收工仅本页仪式,不影响考勤。
12 附录:与登录关怀的边界
| 登录瞬间 | 今日关照 | |
|---|---|---|
| 时机 | 进系统前后 10 秒内 | 整天可看 |
| 目的 | 仪式、被看见 | 减压、行动 |
| 数据 | 员工档案 + 本地访问记录 | 业务待办 + 档案 |
| 失败策略 | 有通用欢迎即可 | 隐藏数字、保留一句 |
两者共用 admin-login-care.ts 的节假日 / 周年 / 时段工具函数,避免两套日期逻辑。