Files
TurboHR/docs/20260731-TurboHR完整优化与功能对照方案.md

43 KiB
Raw Permalink Blame History

TurboHR 完整优化与功能对照方案

版本:V2.0(整合版)
日期:2026-07-31
整合来源:UI/UX 完整优化方案 + 系统操作问题与功能对照分析
参考方向:Gusto 的任务驱动体验、温暖可信的视觉语言、员工自助和低门槛业务流程


目录


Part 1:项目概述与诊断

1. 项目目标

TurboHR 已具备员工、合同、考勤、薪酬、社保公积金、离职、制度、证据链、审批、通知、员工门户及 AI 顾问等较完整的后端能力。当前优化重点不应继续堆叠入口,而应将既有能力组织成更容易理解和完成的工作流,同时补齐功能短板。

本轮优化目标:

  1. 将产品从"模块型管理后台"升级为"任务型 HR 工作台"。
  2. 让非专业 HR 用户也能在清晰引导下完成发薪、入职、离职和月度社保等复杂业务。
  3. 建立可信、温暖但不过度装饰的品牌与视觉体系。
  4. 减少页面跳转、重复录入、操作犹豫和错误返工。
  5. 提高员工自助率,减少 HR 重复答疑和资料收集工作。
  6. 补齐用户反馈的功能短板:合同类型覆盖、导入导出对齐、社保灵活性、绩效分析看板、个税申报报表等。

1.1 核心设计原则

  • 任务优先:首先告诉用户现在要做什么,而不是先展示系统有哪些模块。
  • 渐进披露:日常信息优先,高级配置在需要时出现。
  • 一步一决策:复杂流程每一步只解决一个主要问题。
  • 状态透明:所有流程都能看见当前状态、负责人、截止时间和下一步。
  • 异常前置:尽量在提交、归档、发布之前发现问题。
  • 人物优先:HR 系统中的主体是员工,不是数据表和字段。
  • 一致可预测:同一类动作、状态和反馈在所有模块中保持一致。
  • 国际框架、本地语义:交互采用国际通行方式,劳动用工文案保持中国法律语义准确。

2. 当前产品诊断

2.1 信息架构问题

当前侧边栏包含工作台、员工管理、薪税社保、合规风控、AI 辅助和系统等多个分组,且默认展开。日常高频任务、高级配置、辅助工具和系统管理处于同一层级。

主要影响:新用户无法迅速判断从哪开始;低频工具占用导航空间;连续工作被拆散;缺乏统一的"我的工作"视角。

2.2 页面结构问题

  • Dashboard 同时承担概览、薪税、风险、待办、成本和人力分析,第一屏焦点不清。
  • Money、Termination、SocialInsurance 等页面体量过大,交互不一致。
  • 主要动作与次要动作区分不足。

2.3 视觉问题

  • 紫色主色有通用后台模板感;text-xs 密度高阅读压力大;缺少明确视觉层级。

2.4 交互问题

  • 用户需跨页面记忆上下文;批量操作入口常驻;AI 顾问与业务上下文分离。

2.5 功能差距总览

模块 用户反馈问题 系统实际状态 严重程度 修复难度
花名册 缺少劳务/承揽/临时工/非全合同类型 枚举缺 3 种,前端缺 2 种展示 🔴
花名册 导出字段不全、导入导出错位 导出 7 列 vs 导入 19 列 🔴
工资 缺少计件/计时计薪方式 无相关字段和批次类型 🟡
社保 无社保人员无法标记 入职自动创建社保记录 🟡
社保 商险/意外险无独立模块 后端有 extraInsurances 字段 🟡
社保 无公积金员工自动匹配 无条件创建公积金记录 🟡
考勤 无打卡功能 系统无打卡能力 🟡
考勤 第三方数据需手工导入 有 Excel 导入但无 API 对接 🟢
发薪 个税无法自动算税 已实现,用户可能未发现 🟢
发票 无发票模块 完全未实现 🟡
审批 无审批模块 仅解聘有状态流转 🟡
绩效 无绩效分析看板 有绩效记录但无统计分析 🟡
个税 无个税申报报表导出 有计算但无申报表 🟡

2.6 功能成熟度矩阵

功能领域 计算能力 线上化程度 分析看板 申报对接 综合评分
薪酬核算 4/5
个税 3/5
入职 3.5/5
合同签署 3.5/5
离职 3/5
绩效 1.5/5
社保 3/5

Part 2:目标产品框架

3. 目标一级导航

一级入口 主要内容 核心用户任务
首页 今日任务、审批、风险、截止日、快捷创建、近期动态 判断今天先做什么
团队 员工目录、入职、异动、合同、特殊状态、离职 管理员工全生命周期
薪酬 发薪、工资条、加班、社保公积金、专项扣除 完成每月薪酬工作
时间 考勤、排班、休假、月度确认 管理工时和出勤
合规 风险、制度、证据链、用工体检、审计 发现并处理用工风险

全局右上区域保留:全局搜索/命令面板、快速创建按钮、待审批入口、通知入口、帮助与 AI 助手、组织及个人菜单。

以下内容移入"设置"或"更多":文本模板、数据导入导出、用户与权限、企业信息、通知规则、社保公积金基础配置、审计配置。

3.1 导航行为

  • 默认只展开当前一级导航对应的二级菜单。
  • 记住用户最近访问的页面和分组状态。
  • 桌面端侧边栏 224–240px,可折叠为 64px 图标栏。
  • 移动端使用"首页、团队、待办、我的"四入口底栏。

3.2 全局搜索和命令面板

快捷键 Cmd/Ctrl + K,搜索范围:员工、发薪批次、合同、页面与功能、可执行命令。结果按"人员、任务、记录、功能"分组,敏感信息不出现在未授权摘要中。


Part 3:模块设计与功能对照

4. 首页:从数据看板升级为任务中心

4.1 页面目标

首页第一屏必须回答:今天最需要处理什么?最近一个重要截止日是什么?哪些流程或员工存在异常?

4.2 推荐布局

顶部区域:问候语 + 日期 + + 快速创建 主按钮。

主任务卡:只展示当前最重要的一项任务,主操作 + 次操作。选择规则:已逾期 → 高风险 → 需审批 → 三日内到期 → 月度流程下一步。

待办队列:分段控制器切换"需要我处理 / 等待他人 / 即将到期 / 已完成"。每条包含事项、关联对象、截止时间、风险级别、负责人、直接操作。

人员动态:待入职、本周入职、合同即将到期、试用期即将结束、特殊状态、离职交接中。

数据洞察(第二屏):本月人力成本、年度成本趋势、部门人数变化、风险分布、员工完成率。新增:入离职趋势图(近 12 个月离职率)、绩效概览(等级分布、部门均分)。

4.3 空状态

今天没有待处理事项。下一次发薪准备将在 8 月 1 日开始。

提供 查看日历创建任务 入口。


5. 团队与员工管理

5.1 功能对照

合同类型覆盖问题

用户反馈 系统现状 差距分析
只有标准劳动合同界面,劳务/承揽/临时工/非全日制无法录入 ContractType 枚举 5 种:FIXED、UNFIXED、UNSIGNED、LABOR、INTERNSHIP 后端已支持 LABOR/INTERNSHIP 但前端未暴露;承揽合同、临时工、非全日制 3 种完全缺失

花名册导入导出错位

用户反馈 系统现状 差距分析
导出只能导出部分基本信息 export.routes.ts 仅 7 列 导入 19 字段 vs 导出 7 字段,严重不对齐

现有功能

功能项 支持情况 实现位置
单个员工录入 Roster.tsxAddEmployeeModal
批量导入 import.routes.ts/import/excel
花名册导出 ⚠️ 仅 7 列 export.routes.ts/export/roster
全量数据导出 export.routes.ts/export/all
员工详情 10 个 Tab roster/EmployeeProfile.tsx
批量续签/解聘 Roster.tsx
调薪/部门变更 roster/modals.tsx

5.2 员工目录优化

默认列表列:员工(头像/姓名/职位)、状态、入职日期、合同、薪酬状态、下一项任务、操作。

优化要求:点击整行进入详情;搜索与筛选同一工具栏;筛选条件为可移除标签;支持保存视图;选中后才出现批量操作栏;危险操作显示影响范围。

5.3 员工 Profile Shell

头部固定:头像、姓名、职位、部门、在职状态、联系方式、入职日期、编辑资料 主按钮。

推荐 Tab:概览、工作信息、薪酬福利、考勤休假、文件合同、绩效与事件、历史记录。

隐私要求:身份证/银行卡/工资默认遮罩;查看敏感信息需权限并写审计日志。

5.4 入职流程

统一五阶段:发送邀请 → 员工填写 → HR 审核 → 合同确认 → 完成配置

功能项 支持情况 说明
入职线上化 OnboardingLink + portal.routes.ts,HR 生成链接 → 员工填写 → 上传附件 → HR 审核
入职附件上传 /onboarding/:token/upload
入职信息 PDF 导出 建议补充
入职材料清单勾选 建议补充

每位待入职员工显示:总完成度、当前阶段、缺失资料、最后操作时间、预计入职日期、可执行动作。

5.5 合同签署线上化

功能项 支持情况 说明
合同签署线上化 ContractConfirmLink,HR 发送链接 → 员工验证码验证 → 确认签署
签署证据链 自动记录 IP/时间/验证码
第三方电子签 ⚠️ 有 ELECTRONIC 字段但未对接 e签宝/法大大

现有流程:HR 创建合同 → 生成确认链接 → 员工验证码验证 → 确认签署 → 自动生成证据链

5.6 离职流程

统一六步:选择员工 → 确认原因日期 → 合规检查 → 费用结算 → 工作交接 → 复核审批执行。

功能项 支持情况 说明
离职线上化 ⚠️ 部分 HR 端可发起,员工端无离职申请入口
离职确认 员工无法在线确认
离职交接清单 建议增加
解聘审批流 ⚠️ 有 7 种状态字段但前端无审批界面

桌面端使用"主内容 + 右侧摘要"布局,底部固定操作栏。


6. 薪酬与发薪体验

6.1 功能对照

计薪方式覆盖

用户反馈 系统现状 差距分析
只有标准工时工资,计件/计时无法录入 BatchEntry 有基本工资/加班费/津贴/奖金等 缺少计件工资字段(件数/单价/时薪/工时)和对应批次类型

个税自动算税

用户反馈 系统现状 差距分析
无法实现个税自动算税 已实现 calcCumulativeTax() 累计预扣法 + calcBonusTax() 年终奖单独计税 用户反馈与系统现状不符,可能未发现该功能

现有功能清单

功能项 支持情况 说明
薪酬核算 calcBatchEntry() 自动计算全流程
社保公积金自动计算 按城市配置比例
个税自动计算 累计预扣法,7 级超额累进
年终奖单独计税 calcBonusTax()
多批次发薪 4 种批次类型
薪酬模板 PayslipItem 自定义薪资项
工资条在线发放 支持定时发送、员工端确认
Excel 导入/导出 /import/payroll + /export/payroll
个税预览 /payroll/tax-preview
个税跳档预警 归档时检测
薪资项手工覆盖 社保/公积金可 override
计件/计时工资 无相关字段
薪酬分析看板 缺少薪酬分布/趋势/部门对比

6.2 月度发薪中心

连续流程:准备数据 → 异常检查 → 复核工资 → 归档 → 发布工资条 → 完成

页面顶部显示:月份、批次名称、流程步骤、当前负责人、计划发布时间、员工数量、预计总额、自动保存状态。

6.3 准备数据

集中呈现数据源完成情况:员工薪酬结构、考勤、加班、请假、社保公积金、专项附加扣除、奖金/补偿。每个数据源显示"已同步/存在异常/尚未导入/无需处理"。

6.4 异常检查

异常分三级:阻断(未配置薪资/计算失败)、警告(变化显著/实发为负)、提示(新员工/离职结算)。每条异常提供员工、字段、当前值/参考值、影响、建议操作、立即修复 入口。

6.5 工资复核表

固定姓名列和实发列;工资项目分组展开;修改单元格标识并支持撤销;显示与上月变化;支持筛选"仅看异常/已修改/新增";表尾固定合计;大数据量虚拟滚动。

6.6 归档与发布

归档前弹出复核摘要(人数/总额/未解决警告/后续影响/可撤销性)。归档后主操作变为 发布工资条,支持立即/定时发布,展示员工查看确认进度。


7. 个税申报线上化

7.1 现状

功能项 支持情况 说明
个税计算 累计预扣法,7 级超额累进
个税预览 /payroll/tax-preview
个税累计数据 Payslip.ytdTaxDeducted
个税申报提醒 每月申报日提醒
申报日配置 NotificationSetting.taxDay
专项附加扣除导入 /import/special-deduction
个税申报报表 无导出功能
个税批量申报 未对接税务系统

7.2 实施路径

阶段一(低成本):
  ✅ 个税自动计算 → 已实现
  ✅ 申报日提醒 → 已实现
  📋 申报表 Excel 导出 → 新增 /export/tax-declaration 接口

阶段二(中等成本):
  📋 申报数据校验 → 导出前校验完整性
  📋 年度汇算提醒 → 每年 3 月推送

阶段三(高成本):
  📋 对接自然人电子税务局 API → 在线批量申报

8. 时间、考勤和排班

8.1 功能对照

用户反馈 系统现状 差距分析
无法实现打卡 无打卡接口 系统定位为 HR 管理后台非考勤终端
第三方数据需手工导入 有 Excel 导入 缺少钉钉/企微/飞书 API 对接

现有功能:考勤确认、班次管理、排班、每日出勤、月度报表、休假记录、Excel 批量导入、员工端考勤查看 — 全部

8.2 模块优化

二级导航建议:月度概览、每日出勤、排班、休假、规则设置。高级班次设置放入次级入口。

月度确认流程:导入/同步 → 识别异常 → 员工确认 → HR 锁定 → 同步发薪

排班:周视图默认;色块+缩写表达班次;支持复制上周/批量排班/冲突检测。

第三方对接建议:钉钉/企微/飞书 API(🟡 中预算)。


9. 社保公积金体验

9.1 功能对照

用户反馈 系统现状 差距分析
全部正规五险一金,无社保人员模块 固定 5 险 缺少「无社保」选项,入职自动创建
纯商险/意外险无法录入 extraInsurances JSON 字段 后端支持但前端无独立商险模块
无公积金员工自动匹配 无条件创建公积金记录 缺少「是否缴纳公积金」开关
基数自动为应发工资 未填写时默认使用月工资 无法设为 0 或不缴

现有功能:社保配置(多城市多版本)、公积金配置、附加险种配置、基数调整、月度办理、专项附加扣除导入、版本管理、社保导出 — 全部

9.2 体验优化

日常办理与配置分离:日常用户默认进入"月度办理",配置放入"规则与配置"。

月度办理流程:确认增减员 → 检查基数变化 → 生成申报名单 → 导出/办理 → 标记完成

配置版本:时间线展示历史版本;新建版本时显示差异;调基前展示影响人数和成本变化。

9.3 灵活性改进

需求 建议方案 预算
「无社保」选项 入职增加「是否参保」开关 🟢
「不缴纳公积金」选项 入职增加开关 🟢
商险独立管理 社保页面增加「商险管理」Tab 🟡

10. 合规、制度与证据链

10.1 统一风险中心

将风险、用工体检、合同提醒、特殊状态汇总为统一风险中心。风险列表字段:事项、关联对象、等级、截止时间、负责人、建议动作、证据完整度、处理状态。详情使用三栏结构:问题说明、法律依据、处理动作与证据。

10.2 规章制度

发布流程:起草 → 审核 → 公示 → 发布 → 员工阅读确认 → 归档。列表优先展示状态、覆盖人数、已读率、未读人员。

10.3 证据链

时间线表达,按事件展示时间、类型、操作者、文件、完整性。支持按离职/违纪/考勤/合同等场景生成证据包。


11. 绩效分析与统计看板

11.1 现状

功能项 支持情况 说明
绩效记录录入 roster/PerformanceInfo.tsx,考核周期/得分/等级/评语/改进计划
绩效员工确认 PerformanceRecord.employeeAck
绩效看板 无独立统计看板
绩效趋势分析 无趋势/部门对比/等级分布
绩效与薪酬联动 未与奖金分配关联

11.2 建议方案

需求 建议方案 预算
绩效统计看板 新增 /tools/performance-dashboard,等级分布饼图/部门对比柱状图/趋势折线图/Top-Bottom 排名 🟢
绩效与薪酬联动 发薪批次增加「绩效奖金」列,关联绩效等级计算系数 🟡
绩效改进追踪 增加改进目标/完成度/复评得分字段 🟢

11.3 可复用基础设施

Dashboard 看板组件、/dashboard/workforce-stats 聚合 API 模式、年度价值报告、recharts 图表库。


12. AI 顾问优化

从独立聊天升级为上下文助手:业务页面提供"询问 AI"入口,自动附带当前员工/批次/风险上下文。发送前显示带入的上下文并允许取消。

AI 输出结构化:结论、风险级别、依据、建议步骤、可生成材料、需人工确认部分。AI 建议不能直接执行高风险操作。


13. 员工门户

移动端首页优先展示:我的待办、最新工资条、考勤休假、合同文件、制度阅读确认、个人资料。底部导航:首页|时间|文件|我的

第一屏显示需要员工完成的动作,每项展示截止时间、完成要求、明确按钮。

自助数据维护:手机号/地址/紧急联系人/银行卡/专项附加扣除/证件附件。敏感变更进入 HR 审核,展示完整状态。


14. 发票与审批模块

用户反馈 系统现状 差距分析
无发票模块 完全未实现 需从零开发
无审批模块 仅解聘有 7 种状态字段,无通用审批引擎 需从零开发通用审批流

现有相关:解聘审批流(⚠️ 有状态无界面)、操作日志审计()、合同确认链接()。

建议:发票模块从零设计(🔴 高);通用审批引擎支持请假/调薪/合同等多场景(🔴 高);解聘审批界面前端补充(🟢 低)。


Part 4:视觉设计系统

15. 品牌气质

关键词:可信、温暖、清晰、专业、有人情味。避免通用紫色 SaaS 模板感、大面积单一色调、过多装饰卡片。

16. 建议色彩

Token 建议色值 用途
brand-600 #C7442E 主按钮、当前导航、品牌强调
brand-700 #A93625 Hover、Active
ink-900 #202622 主要文字
ink-600 #59615C 次要文字
surface-page #F7F8F6 页面背景
surface-card #FFFFFF 内容背景
border #DDE1DD 边框和分隔线
success-600 #237A57 成功、完成
warning-600 #A76113 警告、临期
danger-600 #B83232 高风险、危险操作
info-600 #356A8A 信息、进行中

颜色不能单独表达状态,必须同时包含文字。

17. 字体

font-family: Inter, "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
font-variant-numeric: tabular-nums;
层级 字号 字重 用途
Page title 24px 600 页面主标题
Section title 1618px 600 页面分区
Card title 1416px 600 小型内容块
Body 14px 400 默认正文和表格
Metadata 1213px 400 时间、辅助信息
KPI 2432px 600 关键数字

18. 间距和尺寸

4px 基础单位;页面水平内边距移动端 16px / 桌面端 24–32px;主内容最大宽度 1440px;常规区块垂直间距 24px;表单字段间距 16px;按钮高度 32/40/48px;卡片圆角不超过 8px。

19. 页面标准结构

  1. PageHeader:标题、说明、状态、主要动作。
  2. Tabs/SegmentedControl:只在确有同级视图时使用。
  3. FilterBar:搜索、筛选、视图、导出。
  4. Content:列表、表格、流程或详情。
  5. BulkActionBar:仅选择数据后出现。
  6. Pagination/Footer:分页、总数、显示密度。

20. 组件补齐

AppShell、PageHeader、GlobalSearch/CommandPalette、FilterBar/FilterChip、DataTable、Stepper、TaskItem、Timeline、StatBlock、InlineAlert、Drawer、SplitPane、StickyActionBar、SensitiveValue、PermissionGate、FormSection、SaveStatus、UndoToast。

21. 表单、反馈和可访问性

表单:标签始终可见;校验错误在字段附近说明修复方法;长表单按语义分区支持草稿;格式化输入(身份证/手机/银行卡/金额/日期);自动保存显示状态。

操作反馈:成功 Toast 可撤销;失败 Toast + 区域错误;页面加载失败 Error State + 重试;危险操作确认对话框说明后果;长耗时任务显示进度。

可访问性:WCAG AA 对比度;键盘访问和可见焦点;图标按钮 aria-labelModal 焦点锁定;prefers-reduced-motion;移动端触控目标 ≥ 44×44px。


Part 5:工程与技术

22. 文案与表达规范

  • 文案使用动作导向表达("复核 7 月工资"而非"薪税管理功能")。
  • 按钮描述结果("发布工资条"而非"确定")。
  • 空状态提供下一步,不使用无帮助的"暂无数据"。
  • 日期/数字/百分比/货币通过 Intl 格式化。
  • 内部存储使用 ISO 日期和明确时区。

23. 后端能力与前端映射

现有能力 推荐前端体验 优先级
Dashboard todos、风险评分 首页任务排序、统一风险中心 P0
Calendar 和提醒 首页截止日、月度日历 P0
Payroll batch pre-check 发薪异常质量门禁 P0
归档/撤销/定时发布 发薪 Stepper 和发布中心 P0
Termination draft/审批 离职流程及审批收件箱 P0
个税计算 + 申报提醒 个税申报表导出 P0
Onboarding link 入职进度面板 P1
Contract confirm 合同确认闭环 P1
WorkProcess 跨模块统一审批中心 P1
Policy read records 制度已读率、未读提醒 P1
Attendance publish/confirm 月度确认流程 P1
Evidence chain 员工时间线、证据包 P1
Audit log 敏感字段查看追踪 P1
Portal APIs Employee Hub P1
PerformanceRecord 绩效统计看板 P1
RAG/AI conversation 上下文 AI P2
Notification settings 统一通知中心 P2
Platform org/user APIs 多组织管理工作台 P2

23.1 建议补充的聚合接口

  • GET /workspace/next-actions:当前用户下一步任务。
  • GET /workspace/deadlines:统一截止日。
  • GET /employees/:id/summary:员工 Profile 首屏摘要。
  • GET /payroll2/batches/:id/workflow:发薪步骤和异常。
  • GET /approvals/inbox:跨模块审批收件箱。
  • GET /search:全局搜索。
  • GET /performance/dashboard:绩效统计聚合。
  • GET /dashboard/turnover:入离职统计聚合。
  • GET /export/tax-declaration?month=YYYY-MM:个税申报表导出。

24. 响应式策略

桌面端:1280px+ 侧边栏与主内容布局;超宽屏限制主要内容宽度。

平板:侧边栏默认折叠;表格保留关键列;复杂流程摘要可折叠。

手机端:管理员端仅支持查看待办/审批/员工摘要/通知/发薪状态;员工门户完整支持。

25. 技术重构建议

页面拆分:按领域拆分大型页面(payroll/termination/social 等子目录)。

状态与数据React Query key 工厂化;复杂流程用 reducer/状态机;筛选/Tab/分页写入 URL;乐观更新提供撤销。

设计 Token:颜色/圆角/阴影/字号/层级统一定义为 Token,不使用 bg-[#...] 任意值。


Part 6:实施计划与指标

26. 综合优先级清单

P0 — 立即修复(影响日常使用)

序号 功能项 预算 来源
1 花名册导出字段扩充(对齐 19 字段) 🟢 功能对照
2 社保「无社保」选项 🟢 功能对照
3 公积金「不缴纳」选项 🟢 功能对照
4 个税申报表 Excel 导出 🟢 功能对照
5 入离职统计看板 🟢 功能对照
6 绩效统计看板 🟢 功能对照
7 新导航和 AppShell 🟡 UI/UX
8 首页任务中心 🟡 UI/UX
9 发薪工作流 Stepper 🟡 UI/UX
10 离职流程及审批 🟡 UI/UX

P1 — 近期优化

序号 功能项 预算 来源
11 合同类型扩充(承揽/临时工/非全日制) 🟡 功能对照
12 导入模板合同类型对齐 🟢 功能对照
13 商险/意外险独立管理 🟡 功能对照
14 员工离职申请入口 🟢 功能对照
15 离职交接清单 🟢 功能对照
16 薪酬分析看板 🟢 功能对照
17 员工 Profile Shell 🟡 UI/UX
18 入职进度面板 🟡 UI/UX
19 月度社保办理流程 🟡 UI/UX
20 月度考勤确认流程 🟡 UI/UX
21 统一风险中心 🟡 UI/UX
22 Employee Hub(员工门户) 🟡 UI/UX

P2 — 中期规划

序号 功能项 预算 来源
23 计件/计时工资 🔴 功能对照
24 考勤第三方对接(钉钉/企微/飞书) 🟡 功能对照
25 合同电子签对接(e签宝/法大大) 🟡 功能对照
26 个税申报数据校验 🟢 功能对照
27 绩效与薪酬联动 🟡 功能对照
28 上下文 AI 🟡 UI/UX
29 全局搜索和命令面板 🟡 UI/UX

P3 — 远期规划

序号 功能项 预算 来源
30 发票模块 🔴 功能对照
31 通用审批引擎 🔴 功能对照
32 对接税务系统在线申报 🔴 功能对照

27. 分阶段实施计划

Phase 0:基线和验证(3–5 天)

  • 建立核心任务可用性基线(发薪/入职/离职点击数及完成时间)。
  • 整理角色和权限矩阵。
  • 确认品牌策略。
  • 建立桌面/平板/手机测试视口。

Phase 1:全局框架 + P0 功能修复(2–3 周)

  • 新导航和 AppShell。
  • PageHeader、FilterBar、DataTable 基础组件。
  • 新色彩/字体/间距/状态体系。
  • 首页任务中心。
  • 花名册导出扩充、社保/公积金开关、个税申报表导出。
  • 入离职统计看板、绩效统计看板。
  • WCAG AA 基础整改。

验收:一级导航不超过五项;首页第一屏存在唯一主任务;导出字段对齐;统计看板上线。

Phase 2:核心业务流程(3–5 周)

  • 发薪工作流(Stepper + 异常门禁 + 复核表 + 归档发布)。
  • 离职工作流(六步 + 右侧摘要 + 审批)。
  • 月度社保办理。
  • 月度考勤确认。
  • 员工 Profile Shell。
  • 合同类型扩充、商险管理。

验收:核心任务无需跨模块寻找下一步;所有流程显示当前步骤/阻断项/负责人;危险操作说明影响。

Phase 3:员工自助与协作(3–4 周)

  • Employee Hub。
  • 入职进度中心。
  • 审批收件箱。
  • 制度阅读追踪。
  • 通知中心。
  • 员工离职申请入口。

验收:员工可手机端完成主要自助任务;HR 统一查看员工响应状态;审批不再分散。

Phase 4:智能化(34 周)

  • 上下文 AI。
  • 全局搜索和命令面板。
  • 保存视图和个性化工作台。

验收:AI 自动识别业务上下文;全局搜索覆盖人员、任务、记录和功能。

27.5 详细 Sprint 实施安排

以下将上述 Phase 04 细化为 5 个 Sprint(每个 Sprint 2 周),明确每项工作的类型、工作量、涉及文件和执行策略。

现状判断

当前代码基础(Sprint 1 前):

  • 布局AdminLayoutSidebarNav + TopNav + PageContainer + MobileTabBar)已存在但结构简单。
  • 组件:无 AppShellPageHeaderDataTableFilterBar 等抽象组件,各页面自行实现。
  • 导航:6 个分组全部默认展开,未按任务优先级组织。
  • 色彩:使用 Tailwind primary(紫色系),无设计 Token 系统。
  • 页面Dashboard.tsxMoney.tsxRoster.tsx 等均为大文件单页面。

Sprint 1:基础设施 + 快速修复(第 1–2 周) 已完成

目标:搭建新框架骨架,同时完成 6 项低成本功能修复,让用户立刻感知改善。

状态:已于 2026-07-31 完成全部 10 项任务,代码已提交(821a62ee7dfe3c)并部署至 https://on.hr8ai.top

工作项 类型 工作量 涉及文件 状态
设计 Token 系统 UI/UX 1 天 tailwind.config.ts + index.css 已完成
新导航 5 分组 UI/UX 1 天 SidebarNav.tsx + MobileTabBar.tsx 已完成
AppShell + PageHeader 组件 UI/UX 2 天 新建 src/components/layout/AppShell.tsx 已完成
FilterBar + DataTable 组件 UI/UX 2 天 新建 src/components/ui/FilterBar.tsxDataTable.tsx 已完成
花名册导出字段扩充 功能修复 0.5 天 export.routes.ts7 列 → 19 列) 已完成
社保「无社保」选项 功能修复 1 天 import.routes.ts(导入时填「无」或「不缴」跳过参保) 已完成
公积金「不缴纳」选项 功能修复 0.5 天 import.routes.ts(同上逻辑) 已完成
个税申报表 Excel 导出 功能修复 1 天 export.routes.ts 新增 /tax-declaration 路由(24 列) 已完成
入离职统计看板 功能修复 1.5 天 dashboard.routes.ts + TurnoverStats.tsx 已完成
绩效统计看板 功能修复 1.5 天 dashboard.routes.ts + PerformanceStats.tsx 已完成

执行策略:功能修复(后端为主)与 UI 基础设施(前端为主)可并行,互不阻塞。

验收标准(全部通过 ):

  • 导航从 6 分组变为 5 分组(首页/团队/薪酬/时间/合规)+「更多」收纳低频功能。
  • 花名册导出包含 19 字段,非 ADMIN 用户强制脱敏。
  • 社保/公积金导入时填「无」或「不缴」可跳过参保。
  • 个税申报表可导出 Excel(24 列对齐自然人电子税务局模板)。
  • Dashboard 新增入离职趋势柱状图和绩效分布饼图/柱状图。

实际变更文件清单

  • frontend/tailwind.config.ts — brand 色系/ink 文字色/surface 表面色/状态色/border 色/字体/圆角
  • frontend/src/index.css — 基础样式和组件类更新为新 Token
  • frontend/src/components/layout/SidebarNav.tsx — 5+1 分组 + 默认只展开当前分组
  • frontend/src/components/layout/MobileTabBar.tsx — 5 项 Tab 对齐新分组
  • frontend/src/components/layout/AppShell.tsx — 新建,页面布局容器 + PageHeader
  • frontend/src/components/ui/FilterBar.tsx — 新建,搜索+筛选条件+工具区
  • frontend/src/components/ui/DataTable.tsx — 新建,排序+行点击+空状态+固定列
  • frontend/src/pages/dashboard/TurnoverStats.tsx — 新建,入离职趋势看板
  • frontend/src/pages/dashboard/PerformanceStats.tsx — 新建,绩效分布看板
  • frontend/src/pages/Dashboard.tsx — 集成两个新看板组件
  • backend/src/routes/export.routes.ts — 花名册 19 列 + 个税申报表 24 列
  • backend/src/routes/import.routes.ts — 社保/公积金 opt-out 逻辑
  • backend/src/routes/dashboard.routes.ts — turnover-stats + performance-stats API

Sprint 2:首页 + 薪酬流程(第 3–4 周) 已完成

目标:首页从数据看板升级为任务中心,发薪流程串联为 Stepper。

状态:已于 2026-07-31 完成,代码已提交(55b6867)。

工作项 类型 工作量 涉及文件 状态
首页任务中心重构 UI/UX 3 天 Dashboard.tsx 重写 + 新增 /workspace/next-actions API 已完成
待办队列 + 人员动态 UI/UX 2 天 同上 已完成
Stepper 组件 UI/UX 1 天 新建 src/components/ui/Stepper.tsx 已完成
发薪工作流页面拆分 UI/UX 4 天 Money.tsx 拆分为 PayrollHome/Workflow/ReviewTable/Exceptions/Publish 已完成
发薪异常质量门禁 UI/UX 2 天 对接已有 pre-check API + InlineAlert 组件 已完成

执行策略:先做 Stepper 组件,再做首页,最后拆分发薪页面。Money.tsx 拆分时保持路由兼容(/money 仍可用)。

Sprint 3:团队 + 离职 + 社保流程(第 5–6 周) 已完成

目标:员工全生命周期管理体验统一。

状态:已于 2026-07-31 完成,代码已提交(9946197)。

工作项 类型 工作量 涉及文件 状态
员工目录优化 UI/UX 2 天 Roster.tsx 重构列表部分 已完成
员工 Profile Shell UI/UX 3 天 新建 src/pages/roster/EmployeeProfileShell.tsx 已完成
离职工作流重构 UI/UX 3 天 Termination.tsx 拆分 + 右侧摘要面板 已完成
合同类型扩充 功能 1 天 schema.prisma 枚举 + 前端选择器 + 导入模板 已完成
月度社保办理流程 UI/UX 2 天 SocialInsurance.tsx 重构月度办理部分 已完成
商险管理 Tab 功能 1 天 SocialInsurance.tsx 新增 Tab 已完成

Sprint 4:员工自助 + 考勤 + 合规(第 7–8 周) 已完成

状态:已于 2026-08-01 完成,代码已提交(a88c962)。

工作项 类型 工作量 涉及文件 状态
Employee Hub 首页 UI/UX 2 天 新建 src/pages/portal/EmployeeHome.tsx 已完成
入职进度面板 UI/UX 2 天 新建 src/pages/portal/OnboardingProgress.tsx 已完成
员工离职申请入口 功能 1.5 天 portal.routes.ts + 前端表单 已完成
离职交接清单 功能 1 天 TerminationRecord 模型扩展 + 前端 已完成
月度考勤确认流程 UI/UX 2 天 Attendance.tsx 重构 已完成
统一风险中心 UI/UX 2.5 天 新建 src/pages/compliance/RiskCenter.tsx 已完成
薪酬分析看板 功能 1 天 新建 SalaryDashboard.tsx + 后端 API 已完成

Sprint 5AI + 搜索 + 收尾(第 9–10 周) 已完成

状态:已于 2026-08-01 完成,代码已提交(a88c962)。

工作项 类型 工作量 涉及文件 状态
CommandPalette 全局搜索 UI/UX 3 天 新建 src/components/ui/CommandPalette.tsx + /search API 已完成
上下文 AI UI/UX 3 天 业务页面嵌入"询问 AI"入口 + 上下文传递 已完成
保存视图 UI/UX 1.5 天 FilterBar 扩展 + localStorage 持久化 已完成
WCAG AA 整体审查 UI/UX 1 天 全局对比度/键盘/aria 审查 已完成
页面验收清单走查 QA 2 天 8 个关键页面逐一验证 已完成

关键执行原则

  1. 先后端后前端:功能修复项(社保开关、导出扩充、个税报表)先改后端 API,前端再对接,避免阻塞。
  2. 大页面拆分保持路由兼容Money.tsx 拆分后 /money 路由保留,内部用子路由导航。
  3. 组件先行:每个 Sprint 开始先完成该 Sprint 需要的新组件(StepperPageHeader 等),再做页面。
  4. 并行策略:后端改动(schema 迁移、新 API)与前端组件开发可并行,前端用 mock 数据先行。
  5. 每个 Sprint 末尾部署验证:在 https://on.hr8ai.top 上验证,使用 Playwright 跑关键路径。

人力建议

角色 人数 职责
全栈开发 12 后端 API + Prisma 迁移 + 前端页面
前端开发 1 组件库 + 页面重构
产品/设计 0.5 原型确认 + 验收

最小可行配置:1 名全栈开发 + 按需前端协助,10 周完成全部 P0–P1 内容。如果只做 P0(Sprint 1–2),4 周即可见效。

28. 成功指标

28.1 效率指标

  • 首次创建员工到入职完成的时间。
  • 创建发薪批次到发布工资条的时间。
  • 每次发薪的点击数和页面跳转数。
  • 异常发现到修复的平均时间。
  • 离职流程平均完成时长。

28.2 质量指标

  • 发薪归档后撤销率。
  • 工资条发布错误率。
  • 入职资料一次通过率。
  • 逾期合同和未处理高风险数量。
  • 高风险操作误触和取消率。

28.3 体验指标

  • 首页待办完成率。
  • 员工自助完成率。
  • 员工制度阅读确认率。
  • 移动端任务完成率。

28.4 建议目标

  • 发薪操作时间下降 30%。
  • 核心流程页面跳转下降 40%。
  • 入职资料一次通过率提升至 85%+。
  • 员工自助完成率达到 80%+。
  • 高风险事项逾期数量下降 50%。

29. 页面验收清单

每个页面发布前至少验证:

  • 用户能否在 5 秒内理解页面目的。
  • 是否存在唯一且明确的主要动作。
  • 是否说明当前状态和下一步。
  • 加载/空/错误/无权限状态是否完整。
  • 危险操作是否说明对象/数量/后果/可恢复性。
  • 文字和状态对比度是否达到 WCAG AA。
  • 仅使用键盘是否能完成主要操作。
  • 360px/768px/1280px/1440px/1920px 是否无溢出。
  • 敏感信息是否按权限遮罩并留审计记录。

30. 建议优先制作的高保真原型

第一轮只需设计以下八个关键页面:

  1. 新首页任务中心。
  2. 新导航和全局搜索。
  3. 员工目录。
  4. 员工概览详情。
  5. 发薪流程总览。
  6. 发薪异常和工资复核表。
  7. 离职流程。
  8. 员工门户首页。

31. 系统现有完整模块清单

分类 模块 路由 核心功能
工作台 总览 / 数据看板、风险提醒、月度任务、价值报告
工作台 工作日历 /calendar 月度 HR 事项日历
员工管理 花名册 /roster 员工 CRUD、批量导入/导出、合同管理、调薪、部门变更
员工管理 用工办理 /work-process 入职/离职流程管理
员工管理 考勤确认 /attendance 班次/排班/出勤/月度报表/休假
员工管理 解聘补偿 /termination 解聘记录、补偿金计算
员工管理 特殊状态 /special-status 孕期/哺乳期/工伤/医疗期
薪税社保 薪税管理 /money 发薪批次、薪酬模板、加班费、工资条
薪税社保 社保公积金 /social 五险配置、公积金配置、基数调整、月度办理
合规风控 证据链 /evidence 入职/合同/培训/违纪证据管理
合规风控 规章制度 /policies 制度发布、员工签收
合规风控 用工体检 /tools/health-check 5 维度合规健康度评分
合规风控 医疗期计算 /tools/medical-period 医疗期期限计算器
合规风控 年度价值 /tools/annual-value 年度 HR 价值报告
AI 辅助 AI 顾问 /ai-assistant 劳动法 AI 问答
AI 辅助 文本模板 /templates 合同/通知/制度模板管理
系统 通知管理 /notifications 风险提醒通知配置
系统 操作日志 /audit 操作审计日志
系统 设置 /settings 企业信息、导入配置
员工端 门户 /portal/* 工资条查看、合同确认、考勤确认、制度签收、入职办理

32. 参考资料

这些参考体现的共同方向:减少专业门槛、围绕下一步组织界面、让异常在提交前出现、强化员工自助、跨模块数据自然衔接。TurboHR 应保留自身在中国劳动用工合规、证据链和离职处理方面的差异化能力,在此基础上建立优秀的产品体验。