User feedback 2026-05-07: bấm pencil cho phiếu khác KHÔNG sáng + KHÔNG vào edit
mode (do useState init mount-time only, ev.id thay đổi không re-trigger).
Cũng cần visual feedback "sáng lên" để user biết đang edit phiếu nào.
Implementation:
~ PeDetailTabs.tsx (× 2 app)
+ import useEffect
~ InfoTab: thêm useEffect watch [autoEdit, canEdit, ev.id, ev.tenGoiThau,
ev.diaDiem, ev.moTa, ev.paymentTerms]. Khi autoEdit && canEdit → setEditing(true)
+ sync values từ ev mới (tránh stale state khi switch giữa 2 phiếu khác id).
Note: Dự án disabled đã có sẵn (line 458 `<Input value={ev.projectName}
disabled className="bg-slate-100" />`) — verify hỏi user, KHÔNG thay đổi.
~ PeListPanel.tsx (× 2 app)
+ Prop `editingRowId?: string | null` — row đang edit (URL editHeader=1)
~ Pencil icon: thêm `isEditingThis = editable && editingRowId === p.id` state
→ bg-brand-100 + text-brand-700 + ring-brand-300 + shadow-sm khi active
→ tooltip đổi "✎ Đang sửa phiếu này — click để toggle / xem khác"
~ PurchaseEvaluationWorkspacePage.tsx (× 2 app)
+ Pass `editingRowId={autoEditHeader ? selectedId : null}` xuống PeListPanel
Verify: npm run build fe-admin + fe-user pass · 0 TS error · áp rule strict
verify khi add new prop chain + useEffect.
UAT mode: skip dotnet test (FE-only), push ngay.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
User feedback 2026-05-07: thêm 2 trạng thái meta hiển thị "Bản nháp" + "Đã
gửi duyệt". Bản nháp chỉ hiện ở Thao tác workspace, không hiện ở Duyệt menu.
Implementation:
~ types/purchaseEvaluation.ts
+ PeDisplayStatus enum (BanNhap / DaGuiDuyet / DaDuyet / TuChoi)
+ PeDisplayStatusLabel + PeDisplayStatusColor
+ getPeDisplayStatus(phase) helper:
DangSoanThao → BanNhap
DaDuyet → DaDuyet
TuChoi → TuChoi
else (any middle phase) → DaGuiDuyet
~ components/pe/PeListPanel.tsx
- Phase Select filter → Display status Select (4 option, "Đã gửi duyệt"
KHÔNG filter exact phase do multi-phase, để client-side TODO BE)
- Row badge dùng display status (gọn 4 màu)
+ Prop forcedPhase?: number — workspace dùng để khóa filter Bản nháp
(DangSoanThao). Khi forcedPhase set: ẩn Select, show "Lọc cố định: Bản
nháp" indicator.
~ components/pe/PeDetailTabs.tsx
- Header badge dùng display status meta + secondary text "(Phase chi tiết)"
nhỏ bên cạnh để approver/dev vẫn biết phase exact
~ pages/pe/PurchaseEvaluationsListPage.tsx
- Phase filter Select → display status options
- Row badge → display status
~ pages/pe/PurchaseEvaluationWorkspacePage.tsx
- PeListPanel forcedPhase={PurchaseEvaluationPhase.DangSoanThao}
→ workspace chỉ list Bản nháp (đúng UX user yêu cầu)
Workflow timeline Panel 3 + workflow service BE KHÔNG đổi (giữ phase chi tiết
DangSoanThao/ChoPurchasing/ChoCCM/etc cho approval logic).
Pe_*_Pending Duyệt: dùng /inbox endpoint vốn đã filter chỉ phiếu cần user duyệt
→ DangSoanThao auto-không xuất hiện (không có active approver). Nên Bản nháp
auto-hidden từ Duyệt menu, không cần filter thêm.
UAT mode: skip verify, push ngay.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
