4.7 KiB
4.7 KiB
R93 主区域深度视觉审计报告
生成日期：2026-05-05
范围
- 环境：
https://oa.hyinda.com - 员工视角路由：27 个
- 视口：mobile360、mobile390、desktop1440
- 页面结果：84
- 发现项：19
- 补充数据探针：
artifacts/r93/live-data-probe-2026-05-05.json - 修复复测：
artifacts/r93/remediation-report.md - 部署后视觉复测：
artifacts/r93/post-deploy-visual-check-2026-05-05.json - 原始 JSON：
artifacts/r93/main-region-audit-2026-05-05.json - 问题 CSV：
artifacts/r93/main-region-issue-log.csv - 截图目录：
output/playwright/r93-main-region-audit/
自动化检查项
- 主区域横向溢出与可见表格
- 首屏可交互控件是否跑出手机视口
- 移动端触控目标尺寸
- 主区域文本裁切
- 票据中心/报销列表移动卡片 test id 是否在公网可见
- 移动票据上传是否支持多文件选择
- 票据池与草稿报销只读 API 状态探针
说明：主区域审计 JSON 内的逐页 api 字段由浏览器原生 fetch 采集，未复用前端运行态 Bearer token，出现 401 时不作为业务接口失败证据。已用 live-data-probe-2026-05-05.json 重新执行带 token 的只读探针。
汇总
| 类型 | 数量 |
|---|---|
| MOBILE_VISIBLE_TABLE_MAIN | 8 |
| SMALL_TOUCH_TARGET_CLUSTER | 4 |
| API_403_IN_PAGE | 3 |
| OFFSCREEN_INTERACTIVE_MAIN | 2 |
| SOURCE_LIVE_PARITY_INVOICE_MOBILE | 1 |
| SOURCE_LIVE_PARITY_REIMBURSEMENT_MOBILE | 1 |
补充人工归类：
| 类型 | 数量 |
|---|---|
| SOURCE_LIVE_PARITY_MOBILE_CAPTURE_MULTIPLE | 1 |
高优先级样本
- VA-D001 /assets mobile360+mobile390 MOBILE_VISIBLE_TABLE_MAIN：主区域首屏仍可见 1 个表格。
- VA-D002 /contracts-registry mobile360+mobile390+desktop1440 API_403_IN_PAGE：页面可进入但存在 API 403 请求。
- VA-D003 /invoice-pool mobile360+mobile390 MOBILE_VISIBLE_TABLE_MAIN：主区域首屏仍可见 1 个表格。
- VA-D004 /invoice-pool mobile360+mobile390 OFFSCREEN_INTERACTIVE_MAIN：主区域可交互控件跑出视口：more_horiz {"left":779,"top":641,"right":807,"bottom":674,"width":28,"height":33}。
- VA-D006 /notifications mobile360+mobile390 MOBILE_VISIBLE_TABLE_MAIN：主区域首屏仍可见 1 个表格。
- VA-D008 /purchase-requests mobile360+mobile390 MOBILE_VISIBLE_TABLE_MAIN：主区域首屏仍可见 1 个表格。
- VA-D009 /invoice-pool mobile390 SOURCE_LIVE_PARITY_INVOICE_MOBILE：源码已有 invoice-pool-mobile-list，但公网 mobile390 可见数=0，table 可见数=1。
- VA-D010 /reimbursements mobile390 SOURCE_LIVE_PARITY_REIMBURSEMENT_MOBILE：源码已有 reimbursements-mobile-list，但公网 mobile390 可见数=0，table 可见数=1。
- VA-D011 /mobile/capture mobile390 SOURCE_LIVE_PARITY_MOBILE_CAPTURE_MULTIPLE：源码文件选择器已支持 multiple，但公网 DOM 中 multiple=false，解释了“手机端一次只能选一张”的现象。
数据探针结论
- 票据池：
/api/invoice-pool?page=1&pageSize=20&ownerScope=own返回 200；当前共 1 张票据，状态为available，OCR provider 为tencent，没有pending_ocr或ocr_failed样本。 - 草稿报销：
/api/reimbursements?status=draft&page=1&pageSize=20&scope=own返回 200；当前员工账号草稿数为 0，因此本轮无法用真实草稿复现“再次编辑”链路。 - 合同台账依赖：
/api/employees?page=1&pageSize=100&status=active返回 403，确认不是截图误报，而是员工视角页面内请求了无权限接口。 - 移动上传：本地源码的
mobile-capture-file已有multiple，公网 DOM 缺失multiple，优先按部署/缓存不一致处理；若确认是企业微信内置浏览器限制，则需要改成“连续添加到待上传队列”的交互。
关键结论
- 公网页面的移动端问题在 360px 下更明显，应把 360px 纳入后续视觉回归门槛。
- 票据中心和报销列表源码中已经存在移动卡片 test id，但公网 mobile390 仍可能显示桌面表格，优先怀疑部署产物或缓存，而不是先重写组件。
- 移动票据上传源码已支持
multiple，但公网 DOM 没有multiple，这是明确的源码/公网差异。 - 合同台账员工视角仍有 API 403 噪声，应纳入权限一致性专项。
修复状态
2026-05-05 已重新构建并重启公网 server 镜像，以下问题已由部署一致性修复：
/invoice-poolmobile390：移动列表可见，桌面表格不可见，无出屏操作按钮。/reimbursementsmobile390：移动列表可见，桌面表格不可见。/mobile/capturemobile390：文件 input 的multiple=true。
保留后续专项：
- R94：资产、通知、采购等移动端表格清零。
- R95：合同台账员工视角 API 403 与多角色权限一致性。