1xiny
46 lines
3.1 KiB
Markdown
46 lines
3.1 KiB
Markdown
# Design QA: Client Handler Issue Detail
|
|
|
|
final result: passed
|
|
|
|
## Evidence
|
|
|
|
- source visual truth path: `docs/design/images2/client-03-issue-detail-handler.png`
|
|
- implementation screenshot path: `docs/design/implementation-screenshots/client-03-issue-detail-handler.png`
|
|
- viewport: desktop 1600x1000
|
|
- route/state: `/#/handler-detail`, platform admin role, selected assigned issue
|
|
- full-view comparison evidence: opened the source design and refreshed implementation screenshots in the same QA pass.
|
|
- focused region comparison evidence: checked left issue summary, risk/SLA/status metadata, problem description, attachments, middle process tabs, timeline, comment composer, linked task, right AI recommendation, similar history, and next action stack.
|
|
|
|
## Findings
|
|
|
|
- No actionable P0/P1/P2 findings remain for this screen.
|
|
- Typography: selected issue title, metadata labels, timeline events, AI recommendations, and action labels now use a dense handler-workspace hierarchy instead of the previous sparse summary/time-line/action split.
|
|
- Spacing and layout rhythm: implementation now follows the target's three-column handler detail surface: issue context rail, process workspace, and AI/action rail.
|
|
- Colors and visual tokens: high-risk/SLA states, timeline nodes, AI confidence, similar issue tags, and primary handler actions stay inside the existing semantic token system.
|
|
- Image and asset fidelity: this screen is pure app UI; no raster assets are required. Timeline, comment, task, attachment, AI, and action icons use `lucide-react`.
|
|
- Copy/content: visible labels match the product domain: 问题详情, 处理过程, 关联信息, SLA 详情, AI 处理建议, 相似历史问题, 下一步动作, 接单处理, 请求协作, 转派, 提交处理结果.
|
|
|
|
## Patches Made Since Previous QA Pass
|
|
|
|
- Split handler issue detail UI into focused components under `src/features/client/components/handler`.
|
|
- Added `HandlerIssueSummaryAside` for left-side issue context, metadata, description, and attachments.
|
|
- Added `HandlerTimelineWorkspace` for process tabs, event timeline, comment composer, linked task, and submit result action.
|
|
- Added `HandlerInsightPanel` for AI recommendation, root-cause notes, similar history, and next actions.
|
|
- Reworked `HandlerIssueDetailPage` so it coordinates selected issue data, triage data, permissions, and existing action handlers.
|
|
- Fixed AI confidence display to normalize both ratio-style and percent-style values.
|
|
- Refreshed implementation screenshots with `npm run capture:pages`.
|
|
|
|
## Open Questions
|
|
|
|
- The linked task and attachment rows are currently demo metadata. Production task/attachment collections can be wired into the same layout components later.
|
|
|
|
## Implementation Checklist
|
|
|
|
- Keep handler-specific UI under `components/handler` to avoid returning to a single large detail page.
|
|
- Preserve action button labels because browser smoke verifies the handler workflow by text: 接单处理, 请求协作, 转派, 提交处理结果.
|
|
- Continue the next fidelity pass on the remaining client workbench density.
|
|
|
|
## Follow-Up Polish
|
|
|
|
- P3: add a mobile-specific capture for handler detail after the client workbench pass is finalized.
|