solution-erp/docs/changelog/sessions/2026-05-07-2100-pe-workspace-2panel.md

Session 2026-05-07 21:00 — PE "Thao tác" 2-panel workspace

Dev: Claude Duration: ~2h Base commit: b7a153e (sau Session 9+ housekeeping)

Bối cảnh

User chỉ thị Plan menu PE: leaf "Thao tác" (Pe_DuyetNcc_Create + Pe_DuyetNccPhuongAn_Create) cần restructure thành workspace 2-panel — Panel 1 list + Panel 2 đầy đủ data entry tables inline, KHÔNG còn page Create header riêng.

Reference pattern: HĐ Thầu phụ ContractCreatePage (đã có sẵn 2-panel + sticky "+ Thêm mới" + transition Panel 2 new→edit).

5 câu chốt spec trước code (tránh rework):

• Q1 Panel 2 chỉ data entry, KHÔNG render Workflow Panel + Approvals + History (Q1 phụ: Panel 1 = pure picker, KHÔNG inline edit/delete buttons).
• Q2 Mirror HĐ Thầu phụ pattern — sticky "+ Thêm mới" bottom Panel 1 + Panel 2 transition new (header form) → edit (full tables).
• Q3 Leaf "Danh sách" + "Duyệt" GIỮ 3-panel hiện tại (đã có readOnly mode "Duyệt" cho Drafter trình → TPB duyệt sign Section 5).
• Q4 Route mới /purchase-evaluations/workspace?type={1|2} (không reuse query flag).
• Q5 Section 5 Ý kiến 4 PB DISABLE trong workspace (vì người ta nhập khi duyệt phiếu, không phải lúc nhập liệu data entry).

Làm được

Chunk 1 — fe-admin (commit ee0d360, +571 LOC, 6 files)

File mới:

• fe-admin/src/components/pe/PeListPanel.tsx (~180 LOC) — pure picker reuse-able. Props typeFilter / pendingMe / selectedId / search / phase / onSelect / onSearchChange / onPhaseChange / showCreateButton / onCreate. Render search box + phase filter + list rows (click-to-pick, NO inline edit/delete) + sticky bottom "+ Thêm mới" button (mirror HĐ Thầu phụ).
• fe-admin/src/components/pe/PeHeaderForm.tsx (~210 LOC) — extract header form từ PurchaseEvaluationCreatePage. Props editId / defaultType / onSaved (id, type) / onCancel. Fetch projects + eligible budgets (Phase=DaDuyet + same project), POST/PUT /purchase-evaluations. Caller decide navigation sau save.
• fe-admin/src/pages/pe/PurchaseEvaluationWorkspacePage.tsx (~120 LOC) — 2-panel [320px_1fr]. Panel 1 <PeListPanel showCreateButton onCreate={() => setParams({ mode: 'new' })}>. Panel 2 3-state: empty | mode=new <PeHeaderForm onSaved={(id, t) => setParams({ id, mode: null, type: String(t) })}> | edit <PeDetailTabs evaluation={detail} mode="workspace">. URL state via useSearchParams (replace cho q, push cho id/mode).

File sửa:

• fe-admin/src/components/pe/PeDetailTabs.tsx — thêm prop mode?: 'detail' | 'workspace' default 'detail'. Khi mode='workspace': force opinionsReadOnly = readOnly || mode === 'workspace' (Section 5 OpinionBox luôn readOnly) + render hint banner amber "Ý kiến + chữ ký nhập khi duyệt phiếu — vào menu 'Duyệt' để ký". Section 1-4 không đổi. Workflow Panel + Approvals + History KHÔNG nằm trong PeDetailTabs (callsite control — workspace skip render <PeWorkflowPanel> luôn).
• fe-admin/src/components/Layout.tsx — resolver Pe_*_Create: /purchase-evaluations/new?type=N → /purchase-evaluations/workspace?type=N. Comment ghi rõ Q4 chốt + route /new giữ tồn tại cho deep-link "Sửa header" button.
• fe-admin/src/App.tsx — import PurchaseEvaluationWorkspacePage + thêm route /purchase-evaluations/workspace. Route /new + /:id giữ nguyên.

Chunk 2 — fe-user mirror (commit ecf3c59, +571 LOC, 6 files)

Y hệt Chunk 1 (rule §3.9 duplicate có chủ đích — copy + sync tay khi breaking). Content 100% identical 3 file mới (chỉ path khác fe-user/src/...). 3 file sửa cùng diff.

Chunk 3 — Docs (commit current, ~150 dòng)

• docs/STATUS.md — header "Last updated" + "Phase hiện tại" cập nhật count FE pages 31→32. Recently Done thêm 1 row tại đầu bảng (rule §6.5 KEEP — không cắt narrative cũ, chỉ thêm).
• docs/HANDOFF.md — TL;DR Session 10 thêm trên cùng + 6 bullet cảnh báo session 11+ + giữ nguyên Session 9 narrative.
• docs/changelog/sessions/2026-05-07-2100-pe-workspace-2panel.md — file này.

E2E verified

• npm run build (fe-admin) pass — 16.25s, 1922 modules.
• npm run build (fe-user) pass — 6.80s, 1904 modules.
• dotnet test SolutionErp.slnx — 83 pass / 0 fail (54 Domain / 29 Infra), 5s.
• Manual smoke (chưa chạy live UAT — defer cho user thử):
  • Click menu "Quy trình chọn Thầu phụ - NCC" → "Duyệt NCC" → "Thao tác" → workspace 2-panel ra.
  • Bấm "+ Thêm mới" sticky bottom → Panel 2 đổi sang <PeHeaderForm>. Save → Panel 1 refresh, phiếu mới highlighted, Panel 2 đổi sang <PeDetailTabs mode="workspace"> đầy đủ 5 section.
  • Section 5: hint banner amber + 4 OpinionBox readOnly (text input không hiện, button "Lưu & Ký" không hiện).
  • Click phiếu khác Panel 1 → Panel 2 fetch + render mới.
  • Click "Đóng" → Panel 2 về empty state.

Bug gặp + fix

Bug	Fix
(none — pattern HĐ Thầu phụ extract clean)	—

Docs updates

• STATUS.md (1 row Recently Done + count FE pages)
• HANDOFF.md (TL;DR Session 10 prepend + cảnh báo)
• session log (file này)
• KHÔNG update skill (rule §9.5 anti-pattern "viết skill chỉ để có thêm" — không drift đáng audit, chỉ FE refactor)
• KHÔNG update gotchas (không phát sinh bẫy mới)

Handoff

Phase 9 active. Hard blockers user/ops vẫn pending (UAT thật / SMTP / Rotate creds / SQL backup). Workspace là optional polish item từ HANDOFF Session 9 — đã đóng. Còn lại trong Phase 9:

• Test live workspace với UAT user — đặc biệt Section 5 hint clarity + transition new→edit.
• Optional polish chưa làm: Budget MaNganSach atomic seq · Budget versioned WF · Payment terms tách field · Auto-map PE→Contract Details · Matrix Quotes bulk paste Excel.
• Tests Phase 3-5 vẫn pending (rule §7 — làm khi gặp bug recurring).

Cron audit kế: 2026-06-01 (~25 ngày).

Thông số cumulative (sau Session 10)

	Trước S10	Sau S10
BE LOC	~14400	~14400 (no change)
API endpoints	~133	~133 (no change)
Migrations	16	16
FE pages	31	32 (+1 PurchaseEvaluationWorkspacePage)
FE components mới	—	+2 (PeListPanel + PeHeaderForm reuse-able)
Tests	83	83 (no change — FE refactor không cần BE test)
Docs	~52	~53 (+session log này)
Commits	(after S9+)	+3 (C1 + C2 + C3)