sz-team/supervision-test-frontend-repo
15
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
237a5810cf589fe61af6d5b288d9993abc540f57
supervision-test-frontend-repo/qa-report/bqtakepulse/QA_REPORT_UX.md
T
wsm 237a5810cf !145 docs(xispeak): 归档前端页面 QA 审查报告（用户视角） 
* docs(xispeak): 归档前端页面 QA 审查报告（用户视角）
* docs(fixcontact): 归档前端页面 QA 审查报告（用户视角）
* docs(inspectTask): 归档前端页面 QA 审查报告（工程师+用户视角）
* docs(bqtakepulse): 归档前端页面 QA 审查报告（工程师+用户视角）
* docs(bgpartymatter): 归档前端页面 QA 审查报告（工程师+用户视角）
2026-08-11 07:27:58 +00:00

14 KiB
Raw Blame History

前端页面用户视角审查报告 — 我为四所把把脉（bg/bqtakepulse/BgTakepulseList）

审查信息

  • 页面/路由：http://127.0.0.1:3100/bg/bqtakepulse/BgTakepulseList
  • 审查日期：2026-08-11
  • 审查视角：业务用户（兼顾首次使用的新手）
  • 相关文件：src/views/bg/bqtakepulse/BgTakepulseList.vue、BgTakepulseForm.vue、BgTakepulseModal.vue、BgTakepulse.data.ts、BgTakepulse.api.ts
  • 证据目录：qa-tmp/bqtakepulse/（screenshots/ + walk*.log + new_modal_fields.json + scripts/probe_1920_log.json）

说明：本报告为"用户视角"审查，所有问题均来自浏览器实测（用户实际操作触发 + 截图/操作日志/后端响应为证）。涉及代码的部分仅用于定位根因，不替代实测。 视觉复核：P2-4 已用 claude-vision-skill 复核 1920×1080 截图 + DOM 实测。vision 只能确认可视区内内容，判断不了被横向滚动藏住的列（曾误判"右边没有未显示列"），溢出/隐藏列以 DOM 实测（probe_1920_log.json）为准。

总体结论

  • P0 × 0 ｜ P1 × 2 ｜ P2 × 6
  • 一句话总结：作为业务用户，这个页面"查台账、看详情、查流程、下载模板"这些日常动作基本能办成，搜索/筛选/校验提示都算顺；但核心工具栏里的"导出"点了毫无反应（后端 500 静默失败），且新建表单里"牵头部门"这项必填却不打星号、提交失败了才知道，这两处会让用户卡住或以为系统坏了——页面对新用户"一眼就能上手"还有距离，但主要流程可以走通、数据无损。

P0 - 用户办不成事 / 会出错

无（实测范围内未发现会导致任务完全无法进行或数据丢失/误导的 P0 项）。

P1 - 明显受阻 / 容易困惑

# 用户场景 用户会遇到什么 后果 证据 位置
1 台账要拿给领导，点工具栏的"导出" 点导出后没有任何反应：不弹保存、不下载文件、不转 loading、也没有任何成功或失败提示。连点两次都这样。 数据导不出去，用户不知道是没点中、是卡了、还是系统坏了，会反复点、找别的方式导出，耽误事 实测点击"导出"2 次，后端 exportXls 接口两次都返回 HTTP 500，页面无 toast/无下载；证据 qa-tmp/bqtakepulse/screenshots/63_after_export2.png、65_after_export_final.png；network 记录见 walk14_log.txt/walk15_log.txt（500×2，toasts 为空） 表头"导出"按钮（BgTakepulseList.vue:53，走 useListPage 的 onExportXls）；根因在后端 exportXls（500），前端未把失败反馈给用户
2 新建一条意见，看到必填项随手填 牵头部门这一栏页面上没有任何"必填"星号，看起来可填可不填；直接提交时却被拦下报"请选择牵头部门"。 必填项全靠用户"试错"才知道，提交一次失败一次，让人不耐烦；新手可能以为系统乱拦 空表单提交校验报错原文：请选择年份 / 请选择密级 / 请输入意见主题 / 请选择牵头部门（qa-tmp/bqtakepulse/screenshots/17_validation_empty.png）；而实测弹窗字段结构里牵头部门 required: false、无红色星号（new_modal_fields.json）；代码 BgTakepulseForm.vue:260-269 对 responDeptid 只写了自定义 validator、rule 里没有 required 新建弹窗表单项"牵头部门"（BgTakepulseForm.vue:68-71）

P2 - 体验细节

# 用户场景 用户会遇到什么 后果 证据 位置
1 想看一下某条意见的详细内容，点意见主题 点标题看详情的同时，下面的"办理情况"反馈区也被一起展开了，关掉详情弹窗后多出一个我没让打开的展开区，还得手动再收起 多一步多余动作，页面状态和用户意图不符，轻微困惑 实测点击标题前展开图标为 collapsed，点击后变 expanded 且页面同时出现"办理情况"区（qa-tmp/bqtakepulse/screenshots/15_title_click_expand.png；walk3_log.txt A 段） 标题链接 @click="handleDetail" 未阻止冒泡，与 expandRowByClick: true（BgTakepulseList.vue:220,84-88）叠加触发
2 要发起督办流程，选"所办领导" 流程发起弹窗里"所办领导"的选项显示的是内部编码 bg_ld_01、dd_ld_02 而不是人名，看不出是谁 用户无法识别审批人是谁，可能选错人或不敢选；此为流程关键字段 实测发起流程弹窗文案含 所办领导 bg_ld_01 dd_ld_02（qa-tmp/bqtakepulse/screenshots/59_process_modal.png） 流程发起弹窗"所办领导"选项（DeptRoleUserSelectRadioGroup 渲染；疑似用户表缺可读姓名，根因待后端确认）
3 填部门相关的字段（牵头/协办部门） 部门选择树里显示的是缩写编码：QLS、SLD、BG部、DQ部、SZHZX、RH、JJ、DD，新用户看不懂哪个部门是哪个 选部门靠猜，容易选错 实测部门树节点即这些缩写（qa-tmp/bqtakepulse/screenshots/25_dept_picker.png、50_dept_picker.png；walk9_log.txt） 部门选择组件数据源（部门树本身的数据/编码）
4 台账很多列，想看看某条"完成状态/完成时间" 表格有 25 列且很多宽列，第一屏只看到前 10 列左右，"完成状态"（第 24 列）在很右边，要一直往右拖才看得到；"操作"列固定在最右始终可见，反而容易让人以为就这些列 每看一条都要大量横向滚动才能看到关键状态，效率低 1920×1080 视口 DOM 实测：表格 .ant-table-content 总宽 3848px、可视区仅 1680px（qa-tmp/bqtakepulse/scripts/probe_1920_log.json；截图 66_list_1920_viewport.png、66_list_1920_full.png）；列配置 25 列、完成状态 为第 24 列未固定（BgTakepulse.data.ts:8-160）；vision 复核截图确认视口内约 10 列、右端为固定"操作"列 表格列配置 BgTakepulse.data.ts（"完成状态"第 24 列，未固定；"操作"为固定右列）
5 搜不到想找的记录 空结果显示一张空表 + "暂无数据"，没有"没有匹配数据，去清除筛选"之类的引导，用户得自己去找上方的"重置" 轻度困惑，新手可能以为数据丢了 实测搜索不存在关键词显示"暂无数据"（qa-tmp/bqtakepulse/screenshots/06_empty_search.png） 列表空态（BgTakepulseList.vue 未配置空态引导文案）
6 删除一条记录 删除有二次确认（好），但确认框只写"是否确认删除"，没说删的是哪条、也没提示删除是否可恢复；且对正在督办中的记录同样允许删 误删后无法撤销，确认信息不足以让用户做出正确判断 实测删除 popconfirm 文案 是否确认删除（qa-tmp/bqtakepulse/screenshots/64_delete_popconfirm.png）；代码推断：删除接口不校验 bpmStatus，督办中记录也可删（代码推断，待实测，未对真实督办中记录执行删除以免破坏数据） 删除 popconfirm（BgTakepulse.api.ts:65-69 的 deleteOne）

用户会觉得顺的地方

  • 顶部统计标签很直观：未开始 / 督办中（已逾期 n）/ 已完成 一眼看清整体进度，用户不用数表格就能知道大概情况。
  • 空表单提交的校验提示具体、标红："请选择年份 / 请选择密级 / 请输入意见主题 / 请选择牵头部门"，指哪错哪，比笼统的"请检查必填项"好很多。
  • 搜索顺手：意见主题输入框支持回车即查、提示了"支持模糊查询"；四个筛选条件（主题/分管所领导/牵头部门/协办部门）+ 查询/重置，够用。
  • 点标题看详情符合直觉；**行内展开看"办理情况"**并带状态统计标签（未开始/进行中/已完成 + 共 N 条），信息组织清晰。
  • 下载模板可用（实测下载"把把脉-导入模板.xls"成功）。
  • 删除有二次确认，不会一点就没了。
  • 行按完成状态着色（黄/红/绿），状态一眼区分（注：实测配色为浅粉彩，单行浅红 #fff1f0 与白行区分度中等，快速扫视可能忽略）；"操作"列固定在最右始终可见。

12 维度核对结果汇总

# 维度 通过 问题（简写+证据位置）
1 目标达成 部分 搜索/详情/查流程/下载模板可用；导出失败无果（P1-1）；新建成功保存链路未能完整实测（见"待实测"）
2 可发现性 通过 新增/导出/下载模板/模板校验/模板导入/高级查询都在表头一眼可见；行操作在"更多"下拉
3 可学习性 问题 牵头部门必填无星标（P1-2）；部门树缩写看不懂（P2-3）；所办领导显示编码（P2-2）
4 效率 问题 25 列超宽表大量横向滚动（P2-4）；新建需填 4 项必填
5 认知负荷 问题 25 列同屏信息过载；统计标签+工具栏+查询区较满
6 文案清晰度 部分 校验文案具体；但所办领导编码/部门缩写看不懂（P2-2/3）；删除确认文案笼统（P2-6）
7 反馈及时性 问题 导出静默失败无任何提示（P1-1）；保存成功是否有提示未实测（见"待实测"）
8 误操作防护 部分 删除有确认；但确认信息不点明记录与后果（P2-6）；督办中记录删除未做防护（代码推断，待实测）
9 空态/加载/错误态 部分 空搜索"暂无数据"但无清除筛选引导（P2-5）；导出失败无错误态（P1-1）
10 无障碍细节 待实测 未用键盘走查关键流程；长文本在宽列内正常换行未发现撑爆
11 视觉一致性 通过 与平台其他页面（jeecg 风格）一致；行状态配色、操作列固定均正常
12 边界场景 部分 空表单校验友好；超长文本/特殊字符/快速连点等未专项实测（见"待实测"）

用户任务走查记录

  • 任务 1：搜索/筛选台账记录 → 登录后进列表，用"意见主题"输入框模糊查 assac 命中 1 条；查不存在的词显示"暂无数据"；点"重置"恢复全量。各步截图 01_login → 05_search_assac → 06_empty_search → 07_after_reset。顺畅。
  • 任务 2：查看详情 / 展开办理情况 → 点意见主题标题打开"详情"弹窗（只读）；同时行被连带展开出现"办理情况"区（P2-1）。显式点展开图标也能看到反馈表（该记录暂无反馈数据）。截图 08_detail_modal、12_expand_feedback、15_title_click_expand。基本顺畅，有 1 处多余展开。
  • 任务 3：新建一条意见记录 → 点"新增"打开表单；空表单点"确 认"被 4 项校验拦下（报错明确、标红字段清晰，见 P2 维度）；依次填年份/密级/意见主题并尝试选牵头部门。自动化未能驱动"部门选择"弹窗把值写回表单（多次尝试未果，属测试手段限制，非用户侧证据），因此"成功保存"这一步未实测到；牵头部门必填但无星标为实测发现（P1-2）。截图 16_new_modal、17_validation_empty、41_secret_dropdown、50_dept_picker。
  • 任务 4：查询/发起督办流程 → 在"更多"下拉见"详情/删除/查询督办流程/再次督办"（该记录为督办中，故显示"再次督办"而非"发起督办流程"，符合业务）；"查询督办流程"打开流程列表（含流程图/审批历史等）；"再次督办"打开流程发起弹窗（标题正确、字段齐全，但"所办领导"显示编码——P2-2）。全部只打开未提交，无数据变更。截图 57_dropdown_assac、58_query_process、59_process_modal。顺畅。
  • 任务 5：导出 / 下载模板 / 删除确认 → "下载模板"成功下载 xls；"导出"点击后无文件下载、无任何提示，后端 exportXls 返回 500（P1-1，实测 2 次）；删除弹 popconfirm"是否确认删除"后取消（未删真实数据）。截图 61_after_template、63_after_export2、65_after_export_final、64_delete_popconfirm。

待实测 / 代码推断（未进 P0/P1/P2 分级）

以下项因无法在本次实测中完成，按纪律只列在待实测区，不参与级别判定：

  1. 新建记录的"成功保存"全链路：自动化无法驱动"部门选择"弹窗将选择值写回表单，导致表单始终缺"牵头部门"而被校验拦截，未能实测到"保存成功→列表新增→成功反馈"。从代码看保存逻辑（BgTakepulseModal.handleSubmit → submitForm → saveOrUpdate）完整，无证据表明真实用户无法创建记录，需人工或换一种自动化方式实测确认（包括保存成功后是否有"保存成功"提示——代码中 submitSuccess 仅关闭弹窗，未见显式 toast，待实测）。
  2. 删除正在督办中（有运行中流程）的记录：代码中 deleteOne 不校验 bpmStatus，理论上可直接删掉有流程的记录（可能造成流程与台账脱节）。因会破坏真实数据，未实测，仅代码推断（BgTakepulse.api.ts:65-69）。
  3. 导出失败的根因归属：实测页面"导出"触发后端 exportXls 返回 HTTP 500（复现 2 次）。这是后端异常；前端未把失败反馈给用户。属后端问题还是环境问题需后端确认，用户侧影响已按 P1-1 记录。
  4. 键盘走查 / 特殊字符 / 超长文本 / 快速连点 等边界场景未专项实测。
  5. 测试数据卫生：本次尝试创建 QA_UX_PULSE_* 记录均未成功（未发送任何新增请求），无 QA_UX 残留；实测前后台账记录数均为 1（assac），已确认无污染。
Reference in New Issue View Git Blame Copy Permalink