3.5 KiB
3.5 KiB
成熟企业页面参照调研
目的
为 hyb-oa 重新统一页面设计规则选择稳定参照。重点不是复制视觉品牌，而是借鉴成熟中文企业协作/OA 系统在信息架构、按钮命名、动作区位置、列表和详情页处理方式上的共识。
参照候选
1. 飞书审批/飞书工作台 + Ant Design Pro/Ant Design 组件规范（推荐）
适配原因：
- 飞书审批小组件公开说明中使用
待办、抄送我、已发起、发起申请四类常见入口，且强调从工作台快速查看审批信息并进入处理页面，适合 hyb-oa 工作台和待处理入口收敛。 - 飞书开放平台审批页协议中也按
待审批、已审批等常见分类表达，符合中文用户心智。 - Ant Design/Ant Design Pro 是中文企业后台常用设计系统，官方文档有列表页、详情页、按钮区、文案、数据展示等成熟规则，可作为页面结构和组件行为的执行基线。
- Ant Design 按钮规则明确“一个操作区域最多一个主按钮”、行内操作适合文字按钮/链接按钮、危险操作需要二次确认，这能直接纠正当前审批动作区和工作台口号型按钮问题。
需要注意：
- 飞书本身偏协同工具，hyb-oa 是轻 OA/财务/资产系统，不能照搬飞书的信息流和营销化协作入口。
- Ant Design 是组件/模式系统，不是业务系统；产品入口和业务边界仍以 hyb-oa 现有事实源为准。
参考链接：
- 飞书审批小组件使用手册：https://www.feishu.cn/hc/zh-CN/articles/633391673719-%E9%A3%9E%E4%B9%A6%E5%AE%A1%E6%89%B9-%E5%B0%8F%E7%BB%84%E4%BB%B6%E4%BD%BF%E7%94%A8%E6%89%8B%E5%86%8C
- 飞书打开审批页协议：https://open.feishu.cn/document/applink-protocol/supported-protocol/open-an-approval-page?lang=zh-CN
- Ant Design 设计模式概览：https://ant.design/docs/spec/overview-cn
- Ant Design 按钮规范：https://ant.design/docs/spec/buttons-cn
- Ant Design 数据列表规范：https://ant.design/docs/spec/data-list-cn
- Ant Design 文案规范：https://ant.design/docs/spec/copywriting-cn
2. 企业微信审批/工作台
适配原因：
- hyb-oa 当前已集成企业微信，HR/考勤边界由企业微信主办，用户可能熟悉企业微信入口。
不推荐作为唯一参照：
- 企业微信更偏移动端和消息入口，PC 业务台账、财务/合同/资产详情页模式不足。
- 业务上已明确企业微信主办 HR/考勤，OA 主办报销、采购、合同、资产、付款等；如果完全仿企业微信，容易继续混淆 OA 和企业微信边界。
3. 钉钉 OA/审批
适配原因：
- 国内企业对
待办、已处理、发起申请、审批详情等命名熟悉。
不推荐作为唯一参照：
- 钉钉偏大型组织和平台入口，容易把 hyb-oa 带回模块多、入口多、说明多的方向。
- hyb-oa 面向小于 10 人的小团队，不需要钉钉式全平台工作台。
初步结论
推荐锁定：
- 产品心智参照：飞书审批/飞书工作台。
- 组件和页面模式参照：Ant Design Pro/Ant Design。
落地方式：
- 入口命名采用成熟中文系统常规词，不再用口号式按钮。
- 工作台只展示摘要和真实行动，不再解释普通入口。
- 列表页采用标题 + 常用筛选 + 表格/列表 + 操作列。
- 详情页采用摘要/证据/历史 + 右侧或底部动作区。
- 审批动作采用一个主按钮、少量次按钮和更多菜单，禁止多个动作纵向铺成大卡片。