solution-erp/.claude/workflows/runs/2026-08-05-S174-khkk-style-audit/sub-frontend-designer-L3.md

sub-frontend-designer-L3 — LĂNG-KÍNH: HOST / BỐ CỤC

Run: 2026-08-05-S174-khkk-style-audit · Lane L3 (ensemble /fable-clone frontend-designer, 5 lane cùng vai) Mục tiêu: quét style/UX host+bố-cục của KHKK (GĐ2) đối chiếu Duyệt NCC (GĐ1, golive = CHUẨN). Đầu ra: spec thi-hành-được cho Opus 5 MAX.

0. KHUNG RỖNG (ghi @lượt 1, TRƯỚC khi đọc file) — append-as-I-read

0.1 File trong lăng-kính (3 chính)

• A. fe-admin/src/pages/pe/PurchaseEvaluationWorkspacePage.tsx — CHUẨN (host 2-panel "Thao tác" GĐ1)
• B. fe-admin/src/pages/khkk/KhkkCreatePage.tsx — màn "Thao tác" GĐ2, VỪA dựng lại 2-panel trong phiên này
• C. fe-admin/src/pages/khkk/KhkkListPage.tsx — màn "Danh sách" GĐ2 (host 3-panel)
• (đối chiếu nếu CẦN, ≤1 file) fe-admin/src/pages/pe/PurchaseEvaluationsListPage.tsx

0.2 Trục so sánh (6 trục bắt buộc — điền khi đọc)

• T1. Header trang: icon · cỡ chữ title · badge · dòng hint bên phải
• T2. Chiều cao host: h-[calc(100vh-4rem)] (hay khác) · overflow · min-h-0
• T3. Grid cột + breakpoint (lg/xl/2xl) · gap · width panel trái
• T4. EmptyState (khi chưa chọn / chưa có data): icon, chữ, canh giữa, chiều cao
• T5. Hành vi <lg (mobile): panel nào ẩn/hiện, toggle, thứ tự
• T6. Cách truyền readOnly xuống panel/form

0.3 Bảng kết (điền dần)

#	Trục	PE (chuẩn)	KHKK Create	KHKK List	Verdict	Sửa
(chưa đọc)

0.4 Spec thi-hành-được (viết ở §4, sau khi đọc xong)

• Mỗi lệch = 1 mục: file:line · hiện-trạng · đích · patch cụ thể · rủi-ro

0.5 Nhật ký đọc (append theo thứ tự tool-call)

• (trống — sẽ append)

---

1. FILE A — PurchaseEvaluationWorkspacePage.tsx (CHUẨN)

(chưa đọc)

2. FILE B — KhkkCreatePage.tsx

(chưa đọc)

3. FILE C — KhkkListPage.tsx

(chưa đọc)

4. SPEC THI-HÀNH-ĐƯỢC

(chưa viết)

5. TỰ ĐÁNH GIÁ + GIỚI HẠN

(chưa viết)