[CLAUDE] Contract: UAT S174 vong-3 — 5 chinh KHKK theo anh chot (FE-only, 0-mig)
1. Ho thu: GO `PipelineTreePanel` khoi `/inbox` — anh: "cho hop thu vut panel nay vao lam j, tap trung vao KHKK thoi". Ho thu = hang-doi-viec-cua-toi, cay toan trinh = ban-do-toan-he => sai the loai. Cho trong nay tra ve dung vai: cho quy trinh duyet cua HD dang chon. 🔸 HAI trang GD3/GD4 con lai (`MyContractsPage` · `HardCopiesPage`) GIU NGUYEN — anh chi dich danh Ho thu, khong noi go het; khong tu suy rong. (Lineage: panel vao day @S168 GD3-D theo owner slot (63) + "mo rong = ca 3 trang"; nay owner thu lai DUNG trang nay.) 2. Panel KHKK: BO nut "+ Them moi". Man nay KHONG co duong "tao tu so 0" — ke hoach LUON sinh tu mot phieu Duyet NCC, ma cac phieu du dieu kien da nam nguyen o tang tren => nut chi xoa form chu khong tao them duoc gi. Khac CO CHU DICH voi `PeListPanel`. 3. Tang duoi CHI giu ke hoach DANG XU LY — an phieu `DaDuyet` (anh: "da duyet bo di luon"). 🔴 KHAI GIOI-HAN: loc o FE vi endpoint chi nhan `phase` DON, khong co tham so "loai tru" => (a) KHONG dung `total` cua server lam so hien thi (da gom phieu DaDuyet) — dem tu mang da loc; (b) cua-so 30 phieu moi nhat co the TOAN DaDuyet => tang duoi rong du con phieu nhap cu hon. Chap nhan o UAT; muon chuan thi BE them tham so loai-tru. Doi luon dong chu "x/total" -> "Da an ke hoach Da duyet": ti so cu doc thanh "dang cat bot" trong khi that ra la "dang loc bo". 4. Nhom duyet + Quy trinh duyet GAN CUNG theo leaf menu — anh: "gan cung luon theo tung nhom ko cho User dieu chinh cho nay luon". - `approvalGroup` khong con la state, DAN XUAT thang tu `?group=n`. Bo luon khoi dong-bo `lastPresetGroup` + ham `firstFreeGroup()` (chung chi ton tai de tu nhay nhom = dung hanh-vi vua bi cam). - Quy trinh: match theo ma tu NGUON BE, khong suy tu man hinh — `DbInitializer.cs:609` `var code = $"KHKK-N{n}"`. Khong khop => CHAN tao + noi ro thieu ma nao, TUYET DOI khong tu roi ve quy trinh nhom khac (gan nham = phieu di sai duong duyet). - UI: hien gia-tri co dinh, CO Y khong dung `<Select disabled>` (o xam van trong nhu "bam duoc nhung dang khoa" va van trong tab-order). 5. Panel giua: GO Section 5 "Y kien cap duyet" (anh: "bo luon cai nay ra luon"). So-do Buoc/Cap + chu ky da song o Panel 3 => de ca hai la ke mot chuyen hai lan tren cung man. DTO giu nguyen (`levelOpinions`/`workflowSteps` panel 3 van dung) — chi bo cho VE. Verify: build 2 app PASS; mirror SHA256 3/3 cap KHOP. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
@ -21,7 +21,7 @@
|
||||
import { useState, type ReactNode } from 'react'
|
||||
import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
|
||||
import {
|
||||
Check, ClipboardList, FileCheck, MessageSquare, Paperclip, Pencil, Plus, Save, Trash2, Upload, Users,
|
||||
ClipboardList, FileCheck, Paperclip, Pencil, Plus, Save, Trash2, Upload, Users,
|
||||
} from 'lucide-react'
|
||||
import { toast } from 'sonner'
|
||||
import { PePipelineStrip } from '@/components/pe/PePipelineStrip'
|
||||
@ -255,9 +255,10 @@ export function KhkkDetailContent({
|
||||
// File "đính kèm khi duyệt" thuộc panel 3 (mục 5) — Section 4 chỉ liệt kê hồ-sơ của phiếu.
|
||||
const planAttachments = plan.attachments.filter(a => a.purpose !== KhkkAttachmentPurpose.ApprovalAttachment)
|
||||
|
||||
// ── Section 5: ý-kiến cấp duyệt, gom theo BƯỚC (Phòng) → CẤP → NV ──────────────────
|
||||
const opinions = plan.levelOpinions ?? []
|
||||
const steps = plan.workflowSteps ?? []
|
||||
// 🧊 [S174 owner] Section 5 "Ý kiến cấp duyệt" ĐÃ GỠ khỏi panel giữa — anh: "bỏ luôn cái
|
||||
// này ra luôn". Sơ-đồ Bước/Cấp + chữ ký đã sống ở PANEL 3 (`KhkkWorkflowPanel`), để cả hai
|
||||
// là kể một chuyện hai lần trên cùng màn hình. Dữ-liệu `plan.levelOpinions` /
|
||||
// `plan.workflowSteps` VẪN có trong DTO (panel 3 dùng) — chỉ bỏ chỗ VẼ ở đây.
|
||||
|
||||
return (
|
||||
<div className="card-accent overflow-hidden" style={{ ['--accent' as string]: 'var(--color-brand-500)' }}>
|
||||
@ -569,112 +570,6 @@ export function KhkkDetailContent({
|
||||
</ul>
|
||||
)}
|
||||
</Section>
|
||||
|
||||
{/* ─────────────── 5 — Ảnh 3 khoanh đỏ ───────────────
|
||||
Gom theo BƯỚC (kèm PHÒNG) → lưới 2 cột các ô ý-kiến của từng CẤP, đúng khuôn
|
||||
Section "Ý kiến cấp duyệt" V2 của Duyệt NCC (`PeDetailTabs.tsx:705-774`):
|
||||
forEach Bước → forEach Cấp → 1 ô. Ô chưa ký vẫn HIỆN (chỗ trống có tên người) —
|
||||
vắng ô là người đọc không biết còn thiếu chữ ký của ai. */}
|
||||
<Section
|
||||
title="5. Ý kiến cấp duyệt"
|
||||
icon={<MessageSquare className="h-4 w-4" />}
|
||||
accent="var(--color-violet-500)"
|
||||
head="text-violet-700"
|
||||
chipBg="var(--color-violet-50)"
|
||||
chipFg="var(--color-violet-700)"
|
||||
count={opinions.length}
|
||||
>
|
||||
{steps.length === 0 ? (
|
||||
<div className="text-sm text-muted-foreground">
|
||||
Phiếu chưa pin quy trình duyệt — chưa có cấp nào để ghi ý kiến.
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-3">
|
||||
{steps.map((step) => {
|
||||
const signedCount = step.levels.filter(lv =>
|
||||
opinions.some(o => o.approvalWorkflowLevelId === lv.id)).length
|
||||
return (
|
||||
<div key={step.id} className="rounded-lg border border-slate-200 bg-slate-50/40">
|
||||
<div className="flex flex-wrap items-center gap-2 border-b border-slate-200 bg-slate-50/80 px-3 py-2">
|
||||
<span className="text-[12px] font-bold uppercase tracking-wide text-slate-700">
|
||||
Bước {step.order} — {step.name}
|
||||
</span>
|
||||
{step.departmentName && (
|
||||
<span className="rounded bg-emerald-50 px-1.5 py-0.5 text-[10px] font-medium text-emerald-700">
|
||||
{step.departmentName}
|
||||
</span>
|
||||
)}
|
||||
<span
|
||||
className="ml-auto text-[10px] text-slate-500"
|
||||
title={`Tổng ${step.levels.length} NV tham gia (mỗi cấp chỉ cần 1 NV ký — OR-of-N)`}
|
||||
>
|
||||
{signedCount}/{step.levels.length} cấp đã duyệt · {step.levels.length} NV tham gia
|
||||
</span>
|
||||
</div>
|
||||
<div className="p-3">
|
||||
{step.levels.length === 0 ? (
|
||||
<div className="text-[12px] italic text-slate-400">— Bước này chưa cấu hình cấp duyệt.</div>
|
||||
) : (
|
||||
<div className="grid grid-cols-1 gap-3 md:grid-cols-2">
|
||||
{step.levels.map((lv) => {
|
||||
const signed = opinions.find(o => o.approvalWorkflowLevelId === lv.id)
|
||||
return (
|
||||
<div
|
||||
key={lv.id}
|
||||
className={cn(
|
||||
'rounded-lg border bg-white p-3',
|
||||
signed ? 'border-emerald-200' : 'border-dashed border-slate-200',
|
||||
)}
|
||||
>
|
||||
<div className="mb-2 flex items-start justify-between gap-2">
|
||||
<div className="min-w-0 flex-1">
|
||||
<h4 className="text-[13px] font-semibold text-slate-700">
|
||||
{lv.name || `Cấp ${lv.order}`} —{' '}
|
||||
<span className="text-slate-900">{lv.approverFullName ?? '(chưa cấu hình)'}</span>
|
||||
</h4>
|
||||
{/* Không dùng `signed!` — thu hẹp bằng chính `signed &&` để
|
||||
khỏi mượn null-forgiving trên dữ-liệu từ API (gotcha #80). */}
|
||||
{signed && signed.approverUserId
|
||||
&& signed.approverUserId !== signed.signedByUserId && (
|
||||
<div className="mt-1 inline-flex items-center gap-1 rounded bg-amber-50 px-1.5 py-0.5 text-[10px] font-medium text-amber-700">
|
||||
⚠ Admin <strong>{signed.signedByFullName}</strong> duyệt thay
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{signed ? (
|
||||
<span className="inline-flex shrink-0 items-center gap-1 rounded-full bg-emerald-100 px-2 py-0.5 text-[10px] font-medium text-emerald-700">
|
||||
<Check className="h-3 w-3" /> Đã duyệt
|
||||
</span>
|
||||
) : (
|
||||
<span className="inline-flex shrink-0 items-center rounded-full bg-slate-100 px-2 py-0.5 text-[10px] font-medium text-slate-500">
|
||||
Chưa ký
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
{signed ? (
|
||||
<>
|
||||
<div className="whitespace-pre-wrap text-sm text-slate-800">
|
||||
{signed.comment?.trim() || '(duyệt — không ý kiến)'}
|
||||
</div>
|
||||
<div className="mt-2 border-t border-slate-100 pt-1.5 text-[11px] text-slate-500">
|
||||
{formatDateTime(signed.signedAt)}
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<div className="text-sm italic text-slate-400">Chưa có ý kiến duyệt.</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
</Section>
|
||||
</div>
|
||||
|
||||
{/* Dialog thêm/sửa căn cứ */}
|
||||
|
||||
@ -31,6 +31,7 @@ import { cn } from '@/lib/cn'
|
||||
import {
|
||||
KHKK_PHASE_BADGE,
|
||||
KHKK_PHASE_LABELS,
|
||||
KhkkPhase,
|
||||
type KhkkListItemDto,
|
||||
type KhkkPeCandidateDto,
|
||||
type PagedResult,
|
||||
@ -78,7 +79,6 @@ export function KhkkWorkListPanel({
|
||||
onPickPlan,
|
||||
selectedPeId,
|
||||
selectedPlanId,
|
||||
footer,
|
||||
}: {
|
||||
/** Bấm PE ở tầng trên → host nạp phiếu đó vào form tạo (Ở LẠI màn, không điều hướng). */
|
||||
onPickPe: (peId: string) => void
|
||||
@ -87,8 +87,6 @@ export function KhkkWorkListPanel({
|
||||
onPickPlan: (planId: string) => void
|
||||
selectedPeId?: string | null
|
||||
selectedPlanId?: string | null
|
||||
/** Nút "+ Thêm mới" dính đáy — mirror `PeListPanel` của màn Duyệt NCC — Thao tác. */
|
||||
footer?: React.ReactNode
|
||||
}) {
|
||||
const { can } = usePermission()
|
||||
// 🔴 ĐÚNG key policy của endpoint — KHÔNG dùng `Khkk_*` (đó là key MENU, tầng hiển thị).
|
||||
@ -126,7 +124,14 @@ export function KhkkWorkListPanel({
|
||||
else byProject.set(key, [pe])
|
||||
}
|
||||
|
||||
const planItems = plans.data?.items ?? []
|
||||
// [S174 owner] "đã duyệt bỏ đi luôn" — tầng dưới chỉ giữ kế hoạch CHƯA xong việc
|
||||
// (nháp / chờ duyệt / trả lại / từ chối). Phiếu `DaDuyet` đã hết việc ở màn Thao tác.
|
||||
// 🔴 KHAI GIỚI-HẠN (lọc ở FE): endpoint chỉ nhận `phase` ĐƠN, không có tham số "loại trừ"
|
||||
// ⇒ (1) `plans.data.total` của server ĐÃ GỒM phiếu DaDuyet nên KHÔNG được dùng làm số
|
||||
// hiển thị — đếm từ chính mảng đã lọc; (2) cửa-sổ 30 phiếu mới nhất có thể TOÀN DaDuyet,
|
||||
// khi đó tầng dưới rỗng dù còn phiếu nháp cũ hơn. Chấp nhận ở UAT; muốn chuẩn thì BE thêm
|
||||
// tham số loại-trừ rồi lọc SERVER-SIDE.
|
||||
const planItems = (plans.data?.items ?? []).filter((k) => k.phase !== KhkkPhase.DaDuyet)
|
||||
|
||||
return (
|
||||
<aside className="flex min-h-0 flex-col overflow-hidden border-r border-slate-200 bg-white">
|
||||
@ -209,8 +214,9 @@ export function KhkkWorkListPanel({
|
||||
<div className="shrink-0 border-t-2 border-slate-200" />
|
||||
|
||||
<Tier
|
||||
title="Kế hoạch ký kết đã tạo"
|
||||
count={plans.data?.total ?? null}
|
||||
title="Kế hoạch ký kết đang xử lý"
|
||||
// Đếm từ mảng ĐÃ LỌC, KHÔNG lấy `total` của server (xem khối lọc phía trên).
|
||||
count={plans.data ? planItems.length : null}
|
||||
accent="bg-violet-50 text-violet-600"
|
||||
icon={<FileSignature className="h-3 w-3" />}
|
||||
>
|
||||
@ -228,7 +234,10 @@ export function KhkkWorkListPanel({
|
||||
</div>
|
||||
)}
|
||||
{!plans.isLoading && !plans.isError && planItems.length === 0 && (
|
||||
<p className="p-3 text-[11px] italic text-slate-400">Chưa có kế hoạch ký kết nào.</p>
|
||||
<p className="p-3 text-[11px] italic text-slate-400">
|
||||
Không còn kế hoạch nào đang xử lý. Phiếu đã duyệt không hiện ở đây — xem tại
|
||||
menu Kế hoạch ký kết HĐ.
|
||||
</p>
|
||||
)}
|
||||
<ul className="divide-y divide-slate-100">
|
||||
{planItems.map((k) => (
|
||||
@ -267,19 +276,23 @@ export function KhkkWorkListPanel({
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
{plans.data && plans.data.total > planItems.length && (
|
||||
{/* 🔴 KHÔNG in "x/total" nữa: `total` gồm cả phiếu đã duyệt vừa bị lọc ⇒ tỉ số đó
|
||||
sẽ đọc thành "đang cắt bớt" trong khi thật ra là "đang lọc bỏ". Nói đúng việc
|
||||
đang làm, và chỉ nói khi thật sự có cái bị giấu. */}
|
||||
{plans.data && plans.data.items.length > planItems.length && (
|
||||
<p className="border-t border-slate-100 px-3 py-1.5 text-[10px] italic text-slate-400">
|
||||
Hiện {planItems.length}/{plans.data.total} kế hoạch mới nhất — xem đủ ở menu Kế hoạch ký kết HĐ.
|
||||
Đã ẩn kế hoạch ở trạng thái “Đã duyệt” — xem đủ ở menu Kế hoạch ký kết HĐ.
|
||||
</p>
|
||||
)}
|
||||
</Tier>
|
||||
</>
|
||||
)}
|
||||
|
||||
{/* Nút hành-động dính ĐÁY, ngoài vùng cuộn của 2 tầng — mirror "+ Thêm mới" của
|
||||
`PeListPanel` (màn Duyệt NCC — Thao tác). Hiện KỂ CẢ khi thiếu quyền KHKK: cột
|
||||
không dựng được thì vẫn phải còn đường bấm, không thì màn thành ngõ cụt. */}
|
||||
{footer && <div className="shrink-0 border-t border-slate-200 p-2">{footer}</div>}
|
||||
{/* 🧊 [S174] KHÔNG có nút "+ Thêm mới" ở đáy — anh chốt bỏ. Lý do đứng vững: màn này
|
||||
KHÔNG có đường "tạo từ số 0". Một kế hoạch LUÔN sinh ra từ một phiếu Duyệt NCC, mà
|
||||
các phiếu đủ điều kiện đã nằm nguyên ở tầng trên ⇒ nút chỉ xoá form chứ không tạo
|
||||
thêm được gì. Đây là chỗ khác CÓ CHỦ ĐÍCH với `PeListPanel` (bên đó tạo phiếu PE
|
||||
mới là việc có thật). Ai định thêm lại: phải trả lời được "thêm mới CÁI GÌ". */}
|
||||
</aside>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user