Nguon: /fable-clone frontend-designer ensemble 5 lane (wf_016b1bed-b85, 5/5 xong, 0 chet,
755K tok). Spec day du: runs/2026-08-05-S174-khkk-style-audit/spec-khkk-style-dong-bo-05-08-2026.md
=== DOT A — LOI THAT (khong phai style) ===
A1 🔴 Nut "Tai xuong" file dinh kem KHKK BI 401 — lane L1 bat, lead verify.
Cu: <a href="/api/contract-signing-plans/.../download"> TRAN.
JWT chi gan boi interceptor axios (lib/api.ts:18); the <a> KHONG di qua axios => request
toi [Authorize(Policy="KeHoachKyKet.Read")] (ContractSigningPlansController.cs:222-223)
di TAY KHONG => 401, nut khong tai duoc.
Moi: ham downloadAttachment() dung khuon PE (PeWorkflowPanel.tsx:327-342) —
api.get(responseType:'blob') -> createObjectURL -> click ngam -> revoke.
A2 🔴 REGRESSION DO CHINH LEAD GAY RA TRONG PHIEN NAY (lane L3 bat).
Man Thao tac dung <main className="hidden ... lg:block"> => duoi lg chi con panel-1,
KHONG co form => MOBILE KHONG TAO DUOC PHIEU (bam phieu xong khong co cho bam "Tao").
Va 2 ve: (1) <main> bo hidden, hien moi kho; (2) mobile xep DOC voi panel-1 chot tran
14rem — khong chot thi danh sach dai day form roi khoi man, dung cai ngo cut vua va.
A3 Tra no da khai voi owner: trang chi tiet KHKK tren mobile mat nut Gui duyet / Xoa phieu.
Giu KhkkWorkflowPanel o DUNG lg:hidden — desktop van sach (panel-3 lo), mobile thao tac duoc.
=== OWNER CHOT VONG NAY ===
O2 "Dung bo chu sap di" — go SoonChip().
Lane L4 do: KHONG giai doan nao con dung nghia "sap" (ca 4 deu fetch API that);
SoonChip KHONG export, 8 hit noi bo => 0 host ngoai phu thuoc.
🔴 Go != "thay het bang 0". BA ca, BA cach xu dung nghia:
· 2 ca dem-duoc -> luon in SO (ke ca 0)
· ca KHOA-QUYEN -> BO TRANG (in 0 la NOI DOI: co the day phieu, chi la khong duoc
xem, va cung khong duoc phep goi API de biet). O khoa + title du.
· ca FAILED (dau —) -> GIU NGUYEN ("khong tai duoc" khac "co 0 phieu", dung gop)
Cau-4 "vay thi bo luon tu choi ~ tuong tu PE" — go nut TU CHOI khoi KhkkWorkflowPanel.
PE co code tu-choi nhung THUC TE khong hien (BE go khoi nextPhases + FE loc, UAT S60).
🔴 Chi go DUONG BAM o UI. May BE (KhkkTransitionAction.Reject, phase TuChoi=99) GIU
NGUYEN: phieu cu da tu-choi van hien dung, mo lai sau chi la them nut.
B4 Grid man Thao tac 300/340 -> 260/320 dung so cua PE (PurchaseEvaluationWorkspacePage:80).
=== HAI GIA-DINH CUA LEAD BI LANE BAC (lead da tu verify, lane DUNG) ===
- O3 hang-muc N-dong KHONG can migration. ContractSigningPlanLineConfiguration.cs:37-38
unique index 3 COT (PlanId, SupplierId, CatalogEntryId) => 1 NCC DA duoc phep N dong x
N hang muc tu Mig 71. May rong san, chi UI hep. Lead tung bao owner "nang nhat, can
migration" — SAI, da dinh chinh.
- O4 shopdrawing dinh kem = FE-only 0-BE (rail dossierItemId da land du 6 tang tu Mig 69).
Verify: build 2 app PASS; mirror SHA256 4/4 cap KHOP; control-am: <SoonChip=0 · "> Tu choi"=0
· a-href=0; control-duong: responseType=2 + downloadAttachment=2 CA HAI app.
🔴 CHUA co screenshot — ca 5 lane deu khong chup duoc (dev-rig chan: chi :8080 LISTENING,
API :5443 khong co, trang sau ProtectedRoute — gotcha #3). Phai soi that 375/1366/1440 tren
prod sau deploy truoc khi tuyen PASS.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
1. Tang duoi man Thao tac: DANH-SACH-TRANG 3 trang-thai — anh: "cho thao tac chi hien tra
lai va nhap, tu choi thoi nhe" => {DangSoanThao, TraLai, TuChoi}. `ChoDuyet` CUNG bi loai
(khac vong-3 chi bo `DaDuyet`): phieu dang trinh duyet thi nguoi soan khong thao tac gi
duoc nua.
🔴 Doi tu LOAI-TRU sang DANH-SACH-TRANG la CO CHU DICH: loai-tru (`!== DaDuyet`) se tu
dong NHAN moi phase them ve sau; danh-sach-trang thi phase moi phai khai TUONG MINH moi
hien. O man chi nen chua viec CON SUA DUOC, im lang nhan them la hong => chon ve chat.
Tieu-de doi thanh "KHKK · nhap / tra lai / tu choi" — noi DUNG tap dang hien, de nguoi
dung biet ngay vi sao phieu vua gui duyet "bien mat".
2. Cay toan trinh trong man Danh sach KHKK: GO vo card — anh: "style cho no giong nhau dong
bo nhe, style ben KHKK co cai vien ben ngoai".
🔴 GOC RE + BAI HOC: truoc do da truyen `className="border-0 shadow-none"` voi Y DINH tat
vo card, nhung `.card-accent` khai o `index.css:112` NAM NGOAI `@layer` nen THANG utility
cua Tailwind v4 => lenh tat bi VO HIEU IM LANG. Day dung la gotcha #66 cua chinh repo
(rule tho ngoai @layer thang utility). Fix = GO CLASS theo dieu kien (`!hideHeader &&
'card-accent lg:sticky lg:top-4'`), KHONG de bang utility.
`hideHeader` nay mang dung nghia "dang NHUNG trong panel khac" => bo ca vo card lan sticky
cho lien mach voi host, y nhu cay ben Duyet NCC. 6 host con lai khong truyen => nguyen ven.
Verify: build 2 app PASS; mirror SHA256 3/3 cap KHOP; grep xac nhan `card-accent` nay nam
sau dieu kien `!hideHeader`.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Anh chot qua 6 anh khoanh do + 4 cau tra loi. 7 chinh, mirror SHA256 identical 8/8 cap.
Man DANH SACH KHKK (KhkkListPage / KhkkListPanel)
- Giu DUY NHAT header trang "Ke hoach ky ket HD / Giai doan 2".
- Bo o loc "Tat ca nhom": may loc GIU NGUYEN (query + stage2Content), nhom nay den
DUY NHAT tu URL ?group=n (8 leaf menu trai). Go luon prop onGroupChange (noUnusedLocals).
- Bo thanh "Cay toan trinh - N goi" qua prop MOI `hideHeader` opt-in tren PipelineTreePanel.
6 host con lai (PE / GD3 / GD4 / Inbox) KHONG truyen => hinh cu nguyen ven.
Nut "Hien/An cay" (mobile) song TRONG thanh vua an => hideHeader ep than cay `flex`,
neu khong `<lg` mat trang cai cay.
Man CHI TIET KHKK (KhkkDetailPage / KhkkDetailContent)
- Go khoi "Quy trinh duyet" (so-do Buoc/Cap + HANH DONG + 2 lich su) — day la BAN SAO
THU HAI, ban chinh o Panel-3 man danh sach. Anh: "bo het, no se hien thi o Menu duyet".
KHAI HE QUA: `<lg` dieu huong thang vao trang nay => mobile hien khong con Gui duyet /
Xoa phieu. Mo lai = boc `lg:hidden`.
- Section 5 "Y kien cap duyet" doi sang DUNG style Duyet NCC (PeDetailTabs.tsx:705-774):
card `rounded-lg p-3` + h4 ten cap + chip trang thai + y kien text-sm + chan ngay
border-t; thay o phang 1 dong text-[11px]. GIU o "Chua ky" (PE khong co) — vang o thi
nguoi doc khong biet con thieu chu ky cua ai.
Man TAO KHKK (KhkkCreatePage)
- Doi sang khuon "Tao phieu Duyet NCC moi" (PeWorkspaceCreateView): 1 card + divide-y,
thanh dau ke LUONG, thanh cuoi hint do liet ke DICH DANH truong con thieu thay vi chi
lam xam nut. Nut "Luu nhap" -> "Tao ke hoach".
- Ve "tao xong sang chi tiet" VON DA DUNG tu S161 (onSuccess -> navigate /khkk/:id);
dot nay KHONG dung luong do, chi doi hinh.
Man DUYET NCC — THAO TAC (PurchaseEvaluationWorkspacePage + PeKhkkSidePanel MOI)
- Them cot 3: 1 cot 2 TANG 50/50 — tren = PE da duyet CHUA lap KHKK gom theo DU AN,
duoi = KHKK da tao. Ti le 50/50 bang `min-h-0 flex-1` ca hai tang.
- 0 ENDPOINT MOI: dung lai approved-pe-awaiting-plan + contract-signing-plans.
"Chua co KHKK" = existingGroups RONG — tu K2/S164 BE KHONG con loc ho, loc o FE.
- GATE #85: ca 2 cua gac bang policy `KeHoachKyKet.Read` trong khi day la man PE =>
gate bang DUNG key policy cua endpoint (KHONG OR key menu Khkk_*), thieu quyen thi
NOI RA thay vi de cot trang (cot trang doc thanh "chua co gi").
- Cot chi moc tu `xl`; o `lg` bo cuc giu DUNG 2 panel nhu cu.
Con lai (chua lam, da khai voi anh): bam PE o tang tren moi mo /khkk/create chu chua
chon san dung phieu do — can them ?peId= vao man tao.
Verify: build 2 app PASS; mirror SHA256 8/8 cap KHOP; byte-level grep bundle xac nhan
chuoi moi co mat ca 2 app (khong tin dong "built" — bai gotcha #77).
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Dua man Ke hoach Ky ket HD ve dung lop kien-truc ma GD1 (PE) va GD3 (HD) dang
dung: 1 man 3-panel h-[calc(100vh-4rem)] grid [400px_1fr_360px], thay cho
list 2-panel + detail trang rieng co workflow xep chong. GD2 la mat-xich lech
duy nhat trong 4 giai-doan truoc dot nay.
BE (7/7):
- DetailDto +5 field: WorkflowVersion / EndedByLevelFinalize / FinalizeStepName
/ FinalizeLevelName / Approvals. 2 field Finalize* KHONG phai field append —
ContractSigningPlan chi co co bool, phai DAN XUAT (lam in-memory tu cay
workflow da nap, thay vi port 3 subquery cua PE).
- ContractSigningPlanApprovalDto de moi (truoc do 0 hit toan repo).
- StepDto +DepartmentName (nuoi chip phong panel 3 + header nhom Section 5).
- GET {id}/changelogs — policy KeHoachKyKet.Read.
- POST {id}/approval-attachments + enum +ApprovalAttachment=3 (append-only).
- approvals[] loc bo Decision=Pending de so (N) cung nghia voi (N) cua PE.
- KHONG chep khuon authz cua PurchaseEvaluationsController: file do la mot lo
gotcha #82 (class [Authorize] tran + changelogs khong policy).
FE (x2 app, SHA256 byte-identical 8/8):
- components/khkk/{KhkkListPanel,KhkkDetailContent,KhkkWorkflowPanel}.tsx;
KhkkWorkflowPanel doi tu pages/ sang components/.
- Panel 2: 5 Section danh so, Section 5 "Y kien cap duyet" duoi cung — khoi nay
DOI TU panel 3 sang panel 2 (owner khoanh do trong anh); luoi 2 cot + meta
"x/y cap da duyet · N NV tham gia" thay list phang 1 cot.
- Panel 3: banner ket-thuc-som, chip ten phong, badge Duyet thay CEO, lam mo
buoc sau finalize, khoi File dinh kem khi duyet, Lich su duyet, Lich su
thay doi. Chua chon phieu -> hop dashed y PE (QD owner).
4 mitigation cuong-hanh (owner chot panel 1 = PipelineTreePanel; chon HINH
khong phai chap-nhan VO):
- M-1 fallback !canPe -> danh-sach KHKK phang. Khong co no, user chi co quyen
KHKK (vd nguoi duyet nhom N5) MAT TRANG danh-sach du API van cho doc —
display-layer khoa authz-layer dang mo, mat con lai cua #82.
- M-2 onOpen thanh callback tu host; mac-dinh giu navigate cu => 0 hoi-quy
trang PE/GD3.
- B1 stage2Content di CAP voi stage2Count qua conditional-spread:
khong truyen => stage2 van nhan groups => trang PE GIU NGUYEN 8 ngan N1-N8.
- R-11 search/loc di server-side, KHONG loc-tren-cay; giu dong canh-bao
"Cay tai 200 phieu moi nhat".
Chong hoi-quy da do: build 3/3 PASS · acceptance tinh 20/20 x 2 app ·
mirror SHA256 8/8 · 0 hit path cam (components|pages)/(pe|contracts) ·
KHONG ghi filter/view/group vao URL (chong tai-sinh bug S155 sidebar sang
nham leaf) · giu set-state-in-render :97-101 (dung khuon React, refactor
thanh useEffect se tai-hien va-5).
Con no, khai thang:
- E-7 bang "cot nao chet, chuyen di dau" (8 cot + 6 KpiCard -> card 400px)
THIEU: lane FE chet o luot tra ve, ly-do bo cot mat theo. Phai soi diff
bang mat truoc UAT, neu khong dung ca M-7 mat-chuc-nang-im-lang.
- Test 643/644. 1 FLAKY Create_DifferentEvaluationType_DoesNotAffect_Other
(full-suite 2->1->1, chay rieng 0/0/0; PeWorkflowAdminTests tao
new SqliteDbFixture() rieng x6 test). Baseline tren HEAD sach CHUA do
(git worktree fail duong-dan Dropbox) => CHUA duoc noi "flake co san".
- 5 acceptance RUNTIME cho UAT: approvals co dong Tra lai + ten nguoi (DB dev
0 hang KHKK) · UAT fe-user:8080 an-danh · deep-link fe-admin:8082 (menu
KHKK bi an trong ADMIN_HIDDEN_KEYS) · negative-control go fallback canPe ·
khoi file tu-an khi rong.
- P3-12 4 return-mode = HOAN, khong phai buoc-khac: tien-de "KHKK 3 tram ngan"
do lai la SAI (DbInitializer:554 = 3 Buoc x <=2 Cap, seed tu ghi "sao tu
workflow Duyet NCC prod").
Spec + 6 artifact phan-bien: .claude/workflows/runs/2026-08-04-S171-khkk-ui-mirror-pe/
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Gate PASS 0-blocker 6/6 (sub-reviewer-gate-k5.md): 8 ngan nhom tu KHKK_APPROVAL_GROUPS
+ khkkGroupMenuLabel (single-source K4a), phieu vao ngan theo approvalGroup + fallback
"(chua phan nhom)" — bat-bien Σ bao dam bang CAU TRUC (1 mang nguon / 1 phep phan hoach
/ 1 cho dem); HIEN DU 8 ke ca rong; route ngan khop URL K4b /khkk/list?group=n; GD3/GD4
regression chung-duoc-la-khong (union pe.contractId giu, cho-cam lines[].contractId
danh dau — no K7 Line.ContractId ghi-luon). SHA-pair x2 byte-identical (diff rong).
tsc -b x2 = 0 (gate tu chay) + npm x2 PASS.
Treo khong chan (gate MINOR 1-6): chu "SAP" tren ngan rong (UX owner) · a11y button-
trong-summary (khuon moi) · FE 0 ha tang test (console.warn dev-only) · toKhkkLeaf x2
lan/phieu. UAT ngay dau: prod 0 phieu KHKK => 8 ngan "SAP" rong o moi goi = DUNG SPEC.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
