From 9e12e80b4813ec828e5ec75bd99668c55023144f Mon Sep 17 00:00:00 2001
From: pqhuy1987 <pqhuy1987@gmail.com>
Date: Wed, 1 Jul 2026 20:52:17 +0700
Subject: [PATCH] =?UTF-8?q?[CLAUDE]=20FE-Admin=C2=B7FE-User:=20badge=20"?=
 =?UTF-8?q?=E2=9C=85=20=C4=90=C3=A3=20=C4=91=C6=B0=E1=BB=A3c=20CEO=20duy?=
 =?UTF-8?q?=E1=BB=87t"=20cho=20phi=E1=BA=BFu=20=C4=91i=20h=E1=BA=BFt=20l?=
 =?UTF-8?q?=C3=AAn=20CEO=20(anh=20Ki=E1=BB=87t=20FDC=20UAT)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- PeFinalizeChip (single-source-of-truth pill): +nhánh phase===DaDuyet && !endsBeforeCeo → "✅ Đã được CEO duyệt" (đối xứng chip "⚑ Kết thúc · X" cho endsBeforeCeo=true)
- Wire phase ở 6 call-site (PeListPanel + PurchaseEvaluationsListPage ×2 app + Inbox + Dashboard user)
- FE-only, tận dụng endsBeforeCeo runtime (Mig 60 fix-3), no BE/mig; mirror 2-app SHA da9c3ed9, build ×2 PASS 0-TS-err

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 fe-admin/src/components/pe/PeFinalizeChip.tsx | 29 +++++++++++++++----
 fe-admin/src/components/pe/PeListPanel.tsx    |  2 +-
 .../pages/pe/PurchaseEvaluationsListPage.tsx  |  2 +-
 fe-user/src/components/pe/PeFinalizeChip.tsx  | 29 +++++++++++++++----
 fe-user/src/components/pe/PeListPanel.tsx     |  2 +-
 fe-user/src/pages/InboxPage.tsx               |  2 +-
 fe-user/src/pages/UserDashboardPage.tsx       |  2 +-
 .../pages/pe/PurchaseEvaluationsListPage.tsx  |  2 +-
 8 files changed, 52 insertions(+), 18 deletions(-)

diff --git a/fe-admin/src/components/pe/PeFinalizeChip.tsx b/fe-admin/src/components/pe/PeFinalizeChip.tsx
index 9b4db25..8e43901 100644
--- a/fe-admin/src/components/pe/PeFinalizeChip.tsx
+++ b/fe-admin/src/components/pe/PeFinalizeChip.tsx
@@ -1,17 +1,34 @@
-// PE — chip "Quy trình kết thúc tại cấp này" (không trình CEO). Hiện khi quy
-// trình của phiếu có cấp bật AllowApproverFinalize (Mig 58, anh Kiệt FDC S89).
-// SINGLE SOURCE OF TRUTH cho pill này dùng ở MỌI danh sách phiếu (cây danh sách
-// + picker workspace/chờ-duyệt + inbox) để mọi người NẮM ngay "phiếu này duyệt
-// đến đây là xong, không lên CEO" mà KHÔNG cần mở phiếu. Shape khớp PeUrgentChips.
+// PE — chip trạng thái cuối phiếu ở MỌI danh sách (cây danh sách + picker + inbox):
+// [S89] "⚑ Kết thúc · X" khi quy trình có cấp AllowApproverFinalize (kết thúc, không lên CEO).
+// [S97 anh Kiệt FDC] "✅ Đã được CEO duyệt" khi phiếu ĐÃ DUYỆT đi HẾT lên CEO (endsBeforeCeo=false).
+// SINGLE SOURCE OF TRUTH — mọi người NẮM ngay trạng thái mà KHÔNG cần mở phiếu.
+
+import { PurchaseEvaluationPhase } from '@/types/purchaseEvaluation'
 
 export function PeFinalizeChip({
   endsBeforeCeo,
   finalizeStepName,
+  phase,
 }: {
   endsBeforeCeo: boolean
   finalizeStepName: string | null
+  // PeListItem.phase là number (mirror BE) → prop nhận number, so khớp literal DaDuyet.
+  phase?: number
 }) {
-  if (!endsBeforeCeo) return null
+  // [S97 anh Kiệt FDC] Phiếu đã duyệt KHÔNG kết thúc sớm = đi hết lên CEO/Ban Giám đốc.
+  if (!endsBeforeCeo) {
+    if (phase === PurchaseEvaluationPhase.DaDuyet) {
+      return (
+        <span
+          className="inline-flex shrink-0 items-center rounded bg-emerald-100 px-1.5 py-0.5 text-[11px] font-semibold text-emerald-800"
+          title="Phiếu đã được CEO / Ban Giám đốc duyệt (đi hết quy trình, không kết thúc sớm ở cấp dưới)"
+        >
+          ✅ Đã được CEO duyệt
+        </span>
+      )
+    }
+    return null
+  }
   return (
     <span
       className="inline-flex shrink-0 items-center rounded bg-violet-100 px-1.5 py-0.5 text-[11px] font-semibold text-violet-800"
diff --git a/fe-admin/src/components/pe/PeListPanel.tsx b/fe-admin/src/components/pe/PeListPanel.tsx
index 39f3ce2..56de4b7 100644
--- a/fe-admin/src/components/pe/PeListPanel.tsx
+++ b/fe-admin/src/components/pe/PeListPanel.tsx
@@ -159,7 +159,7 @@ export function PeListPanel({
                   <div className="min-w-0 flex-1">
                     <div className="flex min-w-0 items-center gap-1 text-[13px] font-medium text-slate-900">
                       <PeUrgentChips isUrgentByPro={p.isUrgentByPro} isUrgentByCcm={p.isUrgentByCcm} />
-                      <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} />
+                      <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} phase={p.phase} />
                       <span className="truncate">{p.tenGoiThau}</span>
                     </div>
                     <div className="mt-0.5 flex items-center gap-1.5 text-[11px] text-slate-500">
diff --git a/fe-admin/src/pages/pe/PurchaseEvaluationsListPage.tsx b/fe-admin/src/pages/pe/PurchaseEvaluationsListPage.tsx
index 694ddd2..c0599ba 100644
--- a/fe-admin/src/pages/pe/PurchaseEvaluationsListPage.tsx
+++ b/fe-admin/src/pages/pe/PurchaseEvaluationsListPage.tsx
@@ -489,7 +489,7 @@ export function PurchaseEvaluationsListPage() {
                                                 <div className="flex min-w-0 flex-1 items-center gap-1 truncate text-[13px] font-medium text-slate-900">
                                                   {/* S77 — cờ gấp PILL đồng bộ mọi danh sách: 🔴 GẤP (PRO) / 🟢 GẤP (CCM). */}
                                                   <PeUrgentChips isUrgentByPro={p.isUrgentByPro} isUrgentByCcm={p.isUrgentByCcm} />
-                                                  <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} />
+                                                  <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} phase={p.phase} />
                                                   <span className="truncate">{p.tenGoiThau}</span>
                                                 </div>
                                                 <span
diff --git a/fe-user/src/components/pe/PeFinalizeChip.tsx b/fe-user/src/components/pe/PeFinalizeChip.tsx
index 9b4db25..8e43901 100644
--- a/fe-user/src/components/pe/PeFinalizeChip.tsx
+++ b/fe-user/src/components/pe/PeFinalizeChip.tsx
@@ -1,17 +1,34 @@
-// PE — chip "Quy trình kết thúc tại cấp này" (không trình CEO). Hiện khi quy
-// trình của phiếu có cấp bật AllowApproverFinalize (Mig 58, anh Kiệt FDC S89).
-// SINGLE SOURCE OF TRUTH cho pill này dùng ở MỌI danh sách phiếu (cây danh sách
-// + picker workspace/chờ-duyệt + inbox) để mọi người NẮM ngay "phiếu này duyệt
-// đến đây là xong, không lên CEO" mà KHÔNG cần mở phiếu. Shape khớp PeUrgentChips.
+// PE — chip trạng thái cuối phiếu ở MỌI danh sách (cây danh sách + picker + inbox):
+// [S89] "⚑ Kết thúc · X" khi quy trình có cấp AllowApproverFinalize (kết thúc, không lên CEO).
+// [S97 anh Kiệt FDC] "✅ Đã được CEO duyệt" khi phiếu ĐÃ DUYỆT đi HẾT lên CEO (endsBeforeCeo=false).
+// SINGLE SOURCE OF TRUTH — mọi người NẮM ngay trạng thái mà KHÔNG cần mở phiếu.
+
+import { PurchaseEvaluationPhase } from '@/types/purchaseEvaluation'
 
 export function PeFinalizeChip({
   endsBeforeCeo,
   finalizeStepName,
+  phase,
 }: {
   endsBeforeCeo: boolean
   finalizeStepName: string | null
+  // PeListItem.phase là number (mirror BE) → prop nhận number, so khớp literal DaDuyet.
+  phase?: number
 }) {
-  if (!endsBeforeCeo) return null
+  // [S97 anh Kiệt FDC] Phiếu đã duyệt KHÔNG kết thúc sớm = đi hết lên CEO/Ban Giám đốc.
+  if (!endsBeforeCeo) {
+    if (phase === PurchaseEvaluationPhase.DaDuyet) {
+      return (
+        <span
+          className="inline-flex shrink-0 items-center rounded bg-emerald-100 px-1.5 py-0.5 text-[11px] font-semibold text-emerald-800"
+          title="Phiếu đã được CEO / Ban Giám đốc duyệt (đi hết quy trình, không kết thúc sớm ở cấp dưới)"
+        >
+          ✅ Đã được CEO duyệt
+        </span>
+      )
+    }
+    return null
+  }
   return (
     <span
       className="inline-flex shrink-0 items-center rounded bg-violet-100 px-1.5 py-0.5 text-[11px] font-semibold text-violet-800"
diff --git a/fe-user/src/components/pe/PeListPanel.tsx b/fe-user/src/components/pe/PeListPanel.tsx
index 39f3ce2..56de4b7 100644
--- a/fe-user/src/components/pe/PeListPanel.tsx
+++ b/fe-user/src/components/pe/PeListPanel.tsx
@@ -159,7 +159,7 @@ export function PeListPanel({
                   <div className="min-w-0 flex-1">
                     <div className="flex min-w-0 items-center gap-1 text-[13px] font-medium text-slate-900">
                       <PeUrgentChips isUrgentByPro={p.isUrgentByPro} isUrgentByCcm={p.isUrgentByCcm} />
-                      <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} />
+                      <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} phase={p.phase} />
                       <span className="truncate">{p.tenGoiThau}</span>
                     </div>
                     <div className="mt-0.5 flex items-center gap-1.5 text-[11px] text-slate-500">
diff --git a/fe-user/src/pages/InboxPage.tsx b/fe-user/src/pages/InboxPage.tsx
index 3337a07..6d747db 100644
--- a/fe-user/src/pages/InboxPage.tsx
+++ b/fe-user/src/pages/InboxPage.tsx
@@ -289,7 +289,7 @@ export function InboxPage() {
                             <div className="min-w-0 flex-1">
                               <div className="flex min-w-0 items-center gap-1 text-[13px] font-medium text-slate-900">
                                 <PeUrgentChips isUrgentByPro={p.isUrgentByPro} isUrgentByCcm={p.isUrgentByCcm} />
-                                <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} />
+                                <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} phase={p.phase} />
                                 <span className="truncate">{p.tenGoiThau}</span>
                               </div>
                               <div className="mt-0.5 flex items-center gap-1.5 text-[11px] text-slate-500">
diff --git a/fe-user/src/pages/UserDashboardPage.tsx b/fe-user/src/pages/UserDashboardPage.tsx
index 9cb3c0b..8b72838 100644
--- a/fe-user/src/pages/UserDashboardPage.tsx
+++ b/fe-user/src/pages/UserDashboardPage.tsx
@@ -283,7 +283,7 @@ export function UserDashboardPage() {
                     <span className="truncate text-sm font-medium text-slate-900">
                       {p.tenGoiThau}
                     </span>
-                    <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} />
+                    <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} phase={p.phase} />
                     <span
                       className={cn(
                         'shrink-0 rounded-full px-2 py-0.5 text-[10px] font-semibold ring-1 ring-inset ring-current/15',
diff --git a/fe-user/src/pages/pe/PurchaseEvaluationsListPage.tsx b/fe-user/src/pages/pe/PurchaseEvaluationsListPage.tsx
index 694ddd2..c0599ba 100644
--- a/fe-user/src/pages/pe/PurchaseEvaluationsListPage.tsx
+++ b/fe-user/src/pages/pe/PurchaseEvaluationsListPage.tsx
@@ -489,7 +489,7 @@ export function PurchaseEvaluationsListPage() {
                                                 <div className="flex min-w-0 flex-1 items-center gap-1 truncate text-[13px] font-medium text-slate-900">
                                                   {/* S77 — cờ gấp PILL đồng bộ mọi danh sách: 🔴 GẤP (PRO) / 🟢 GẤP (CCM). */}
                                                   <PeUrgentChips isUrgentByPro={p.isUrgentByPro} isUrgentByCcm={p.isUrgentByCcm} />
-                                                  <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} />
+                                                  <PeFinalizeChip endsBeforeCeo={p.endsBeforeCeo} finalizeStepName={p.finalizeStepName} phase={p.phase} />
                                                   <span className="truncate">{p.tenGoiThau}</span>
                                                 </div>
                                                 <span