Files
supervision-test-frontend-repo/qa-report/bgpartymatter/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

15 KiB
Raw Blame History

前端页面用户视角审查报告 — 党委会/所务会事项(bgpartymatter

审查信息

  • 页面/路由:/bg/bgpartymatter/BgPartymatterList(党委会台账,菜单名「党委会决策事项」);所务会复用 BgOfficematterListmeetingType=office,菜单名「所务会决策事项」)
  • 审查日期:2026-08-11
  • 审查视角:业务用户(主视角,兼顾首次使用新手)
  • 相关文件:src/views/bg/bgpartymatter/BgPartymatterList.vuecomponents/BgPartymatterForm.vueBgPartymatter.data.tsBgPartymatter.api.ts
  • 证据目录:qa-tmp/bgpartymatter/screenshots/(截图 0122)、qa-tmp/bgpartymatter/scripts/*.json(网络/表单/交互证据)
  • 测试账号:admin(仅 1 个账号,多角色/多部门对比场景未覆盖)
  • 说明:审查全程无头浏览器实测(Playwrightdev 端口 3100,登录走 mock,其余接口走真实后端 8080)。视觉复核已用 claude-vision-skill 实读截图(如 08_detail_modal_closeup.png+ DOM 实测互补。

总体结论

  • P0 × 1 P1 × 2 P2 × 6
  • 一句话总结:搜索、查看详情、展开办理情况、发起/查询流程、新增、删除这些核心流程都能走通,但工具栏的「导出」按钮完全不可用且点击后毫无反应(后端 500 静默失败),是用户日常办事最大的拦路虎;顶部统计标签不随筛选/搜索/增删改刷新、详情弹窗字段「看似可编辑实则点不动」,会让用户误读数据、反复操作。

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

# 用户场景 用户会遇到什么 后果 证据 位置
1 我要把党委会台账导成 Excel 交上去 点击工具栏「导出」按钮,没有任何反应——不弹窗、不下载、不报错,页面静悄悄 台账无法导出,用户以为在下载/以为卡了,反复点也没用;后端每次返回 500(POI ExcelExportException),但前端吞掉异常不提示 实测:点击导出后 downloads 列表为空、无任何 toast;后端响应 exportXls?meetingType=party 返回 HTTP 500body 为 org.jeecgframework.poi.exception.excel.ExcelExportException: Excel导出错误(见 qa-tmp/bgpartymatter/scripts/06_crud.json export_resp、05_flow.json api 日志;截图 13_export.png BgPartymatterList.vueuseListPage exportConfigline 303-307+ 后端 bgPartymatter/exportXls

P1 - 明显受阻 / 容易困惑

# 用户场景 用户会遇到什么 后果 证据 位置
1 我想看看「督办中」还有几件事,于是用事项名称/完成状态筛选 筛选后下面列表变了(比如 0 条),但顶部三个统计标签(未开始 0 / 督办中 1(已逾期 1)/ 已完成 0)始终不变,还是全台账的全局数字 列表与统计对不上,用户不知道哪个才对,可能误以为还有未完成事项没人管、或以为自己筛选没生效;增删改后统计也不刷新 实测:搜索无关关键词后列表 0 条,统计仍显示「督办中 1(已逾期 1)」;搜索命中后仍不变(qa-tmp/bgpartymatter/scripts 运行输出 / 02_list_overview.png 初始态);fetchStatusStats 仅在 onMounted 调用一次,searchQuery/searchReset/handleSuccess 均未刷新统计(BgPartymatterList.vue:446-465 BgPartymatterList.vue:100-104(统计标签)、:463onMounted 仅一次)
2 我在详情弹窗里想顺手改一下某字段再确认 详情弹窗里字段看起来都能点(光标是手型、颜色正常),但点下去毫无反应——实际被一层看不见的透明遮罩拦住,保存按钮也被隐藏 用户以为系统坏了/自己没点中,反复尝试浪费时间;看不清到底能不能编辑(视觉上无明确只读提示) 实测:详情模式 .jeecg-form-detail-effect 遮罩层存在并拦截 pointer 事件;表单项 cursor=not-allowed、pointer-events=none,但下拉控件 opacity=1、cursor=pointer 显示为可点;主按钮带 jee-hidden 类隐藏(qa-tmp/bgpartymatter/scripts/04_detail2.json;截图 08_detail_modal_closeup.png);已用 vision 实读 08_detail_modal_closeup.png 确认截图视觉上下拉控件未灰化、呈可点外观,与点击无反应形成反差 BgPartymatterList.vue:486-490handleDetail 设 disableSubmit+ JFormContainer 详情遮罩

P2 - 体验细节

# 用户场景 用户会遇到什么 后果 证据 位置
1 我填完新增表单点「确认」 弹窗关掉、列表里出现了新记录,但没有任何"保存成功"提示 用户不确定存没存上,容易重复提交或去别处找;删除却有"删除成功!"提示,前后反馈不一致 实测:新增 QA_UX_BGPM_003 后列表出现该行,但 ADD TOASTS=[];删除时出现「删除成功!」toast12_adddel_final.json BgPartymatterForm.vue:403-411createMessage.success(res.message)res.message 为空则不显示)
2 我填主办部门时漏选了,直接提交 校验提示显示「请选择责任部门」,可这个字段明明叫「主办部门」 用户对不上号,以为提示说的是另一个字段 实测:空表单提交后,主办部门字段下报错文案为「请选择责任部门」(02_modal.json form_item_errors;截图 10_add_validation_dupe.png BgPartymatterForm.vue:232-241(校验 rule message 写死"责任部门",字段 label 为"主办部门"
3 我只填了会议时间、没填议题序号就提交 「序号」字段提示「请输入序号」,可这个输入框是只读的(自动生成),我根本没法手动输入 用户不知道怎么消除这个错(实际上要回去填"议题序号"才会自动带出),提示指向了错误的操作对象 实测:序号输入框 readonlyplaceholder 为"填写会议时间和议题序号后自动生成",但校验文案是「请输入序号」(02_modal.json07_formmap.json BgPartymatterForm.vue:23-26(只读输入)+ :228(校验"请输入序号"
4 我想看某条记录后面的完成状态、密级等字段 表格有 21 列,宽度约 2808px,可视区只有约 1200px,中部字段(序目录编码、抄告单编号、密级等)要一直横拖才能看到 反复左右拖动才能看完一条记录,看漏字段的风险高 实测:.ant-table-body scrollWidth=2808、clientWidth=1200,存在横向滚动(scripts 测量输出;截图 02_list_overview.png BgPartymatter.data.ts:7-15321 列)
5 我想按"完成状态"筛一下在办的 「完成状态」筛选条件默认藏在「展开」折叠里,不点开看不到 首次用户以为只能按年份/领导/名称/决议筛,找不到状态筛选 实测:页面初始工具栏无"完成状态",点「展开」后才出现(04_expand_filter.pngtoggle 文案由"展开"变"收起");toggleSearchStatus 默认 falseBgPartymatterList.vue:39 BgPartymatterList.vue:39-52
6 我搜了个没结果的关键词 表格显示「暂无数据」四个字,没有"换个条件试试/清除筛选"的引导 用户不知道是没数据还是搜错了,也没有一键清空入口(只能自己点重置) 实测:搜索无结果后表格空态为纯「暂无数据」(03b_search_empty.png BgPartymatterList.vue 空态(BasicTable 默认)

用户会觉得顺的地方

  • 搜索即输即查(输入事项名称/会议决议时自动查询),「查询/重置」按钮位置和文案清楚,实测有效。
  • 事项名称可点击进详情,详情弹窗字段回显完整(年份/会议时间/议题序号/密级/事项名称/会议决议/主办协办部门/完成状态/督办次数/要求完成日期/是否急件/需所办领导审批等 19 项)。
  • 行首「展开」能看每条记录的责任部门办理情况子表,子表自带 未开始/进行中(含逾期)/已完成 统计,层级清晰。
  • 新增表单「序号」会根据会议时间+议题序号自动生成(如 20260811-9),少填一项(实测自动带出)。
  • 发起流程弹窗标题明确(如「发起流程(清空后测试 第二次督办)」),被督办部门已按主办/协办部门预填,发起类型/截止时间/是否急件/审批意见齐全。
  • 「查询督办流程」弹窗能列出该事项的流程列表(含流程图/审批历史/修改/删除入口)。
  • 删除有二次确认(「是否确认删除」),删除成功有 toast「删除成功!」。
  • 行状态着色(未开始黄 / 督办中红 / 已完成绿)+ 顶部统计标签帮助扫读(注:配色为浅粉彩 #fff1f0 系,单行时区分度中等;统计标签不随筛选刷新见 P1-1)。
  • 党委会/所务会数据严格分流(实测所务会页显示独立的"assacas"记录,不串台)。
  • 校验错误信息具体(请选择年份/请输入事项名称/请输入会议决议),能定位到字段。

12 维度核对结果汇总

# 维度 通过 问题(简写+证据位置)
1 目标达成 部分 导出任务完全无法完成(P0-1);其余核心任务走通
2 可发现性 部分 完成状态筛选藏在"展开"折叠(P2-5);导出/下载模板/模板校验/模板导入等按钮集中在工具栏,一眼可见
3 可学习性 部分 序号只读但报"请输入序号"(P2-3);校验文案"主办部门/责任部门"不一致(P2-2)
4 效率 通过 搜索即输即查、序号自动生成、部门预填;无需多余确认
5 认知负荷 部分 表格 21 列过宽需横拖(P2-4);统计与筛选不一致增加理解负担(P1-1)
6 文案清晰度 部分 校验文案字段名不一致(P2-2);导出失败无任何文案(P0-1);多数提示文案业务化、可读
7 反馈及时性 部分 导出静默失败无反馈(P0-1);新增无成功 toast(P2-1);删除有 toast;列表增删后自动刷新
8 误操作防护 通过 删除有二次确认;详情模式保存按钮隐藏(不可误提交);提交前必填校验明确
9 空态/加载/错误态 部分 空态仅"暂无数据"无引导(P2-6);后端 500 被吞成静默(P0-1);加载中正常
10 无障碍细节 部分 详情字段"看似可点实则被遮罩拦截",光标/颜色与行为不一致(P1-2,已 vision 复核 08_detail_modal_closeup.png 确认下拉控件未灰化、cursor=pointer、肉眼无只读提示);Tab 键盘流未专项验证
11 视觉一致性 通过 按钮、标签、状态色与平台其他台账页一致(参照 xispeak/inspectTask 风格);无错位溢出(此前 BGPARTYMATTER_CHECKLIST 已核)
12 边界场景 部分 搜索空结果有"暂无数据";超长文本/连点/刷新丢数据等未逐项实测(见待实测)

用户任务走查记录

  • 任务 1:登录进入台账
    • 打开 /user/login 输入 admin/123456 回车 → 进入流程门户;直接访问 `/bg/bgpartymatter/BgPartymatte
  • 任务 2:搜索一条记录rList打开党委会台账。截图01_login_home.png02_list_overview.png`。顺畅。
    • 事项名称输入"督办"→ 0 条(空态"暂无数据");输入"清空"→ 1 条命中;点「重置」恢复全部。搜索即输即查+查询按钮均可用。截图 03_search_title.png03b_search_empty.png。顺畅;但发现统计标签不随搜索变化(P1-1)。
  • 任务 3:查看详情 / 展开办理情况
    • 点事项名称打开详情弹窗(标题"详情",19 字段回显)→ 点行首箭头展开"办理情况"子表(含统计与附件下载列)→ 收起。截图 05_expand_feedback.png06_detail_modal.png08_detail_modal_closeup.png。顺畅;发现详情字段被透明遮罩拦截点击(P1-2)。
  • 任务 4:筛选(含展开"完成状态")
    • 点工具栏「展开」→ 出现"完成状态"筛选 → 折叠。截图 04_expand_filter.png。发现状态筛选藏折叠里(P2-5)。
  • 任务 5:导出 / 下载模板 / 模板校验 / 模板导入
    • 「下载模板」成功下载"党委会-导入模板.xls"(截图 12_template_download.png);「导出」点击后无任何反应,后端 500(截图 13_export.png,证据见 05/06 json)→ P0-1;「模板校验/模板导入」点开是文件选择(headless 无法完成真实选文件,见待实测)。
  • 任务 6:流程操作(发起/查询)
    • 行内"更多"→「再次督办」打开发起流程弹窗「发起流程(清空后测试 第二次督办)」,部门已预填(截图 16_flow_modal.png07_row_dropdown.png);「查询督办流程」打开流程列表(含流程图/审批历史等,截图 17_query_process.png)。顺畅。
  • 任务 7:新增→校验→删除(建数实测)
    • 新增弹窗空表单提交 → 8 个必填校验(截图 10_add_validation_dupe.png);填全(含部门"选择"弹窗选 DD、密级选"非密")后提交 → 列表出现 QA_UX_BGPM_003 测试(序号自动生成 20260811-9,完成状态默认"未开始")→ 无成功 toastP2-1);删除该记录 → toast「删除成功!」→ 列表无残留。截图 19_add_filled.png20_list_after_add.png21_list_after_delete.png已建数实测并清理,无残留。

待实测 / 代码推断项(不列入 P0/P1)

# 项目 为什么没实测 现有线索
1 「模板校验」「模板导入」完整流程(选真实 Excel → 校验通过/报错提示) 两者是文件上传按钮,headless 无头浏览器无法模拟系统文件选择框;实测对隐藏 input 设置一个 .txt 文件后无任何 toast,结果不明确 BgPartymatterList.vue:746-784;后端 getCheckExcelByEasyExcelUrl/getImportExcelByEasyExcelUrl
2 详情模式字段的视觉"只读感" 已用 vision 实读 08_detail_modal_closeup.png 确认:下拉控件未灰化、cursor=pointer,截图视觉上无任何只读/不可编辑提示 → "看似可编辑"从 DOM 推断升级为实测确认(即 P1-2),不再待实测 DOM:遮罩 .jeecg-form-detail-effect 拦截点击、表单项 cursor=not-allowed、下拉控件 opacity=1/cursor=pointer
3 所务会(office)页「导出」是否同样 500 所务会与党委会是同一组件复用(meetingType=office),未单独实测导出 同一 exportConfig 与后端 exportXls 接口,推断大概率同错(P0-1 同源),待实测
4 表格过宽的中部列是否需要"冻结/固定"常用列 业务上哪些列最常用需人工确认 实测 scrollWidth 2808 vs 可视 1200,仅"操作"列固定右侧
5 键盘 Tab/回车完整走查、超长文本/快速连点等边界 时间盒内未逐项执行 未发现专项问题,列为常规复核项
6 BgPartymatterFeedbackList.vue 独立反馈页的用户可达性 菜单 SQLV20260416_1__menu_insert_BgPartymatter.sql)只注册了"党委会",反馈功能在主列表"办理情况"展开面板内操作 独立路由 /bg/bgpartymatter/BgPartymatterFeedbackList 能打开(渲染了应用壳),但未见独立菜单入口