diff options
Diffstat (limited to 'lib/vendor-investigation/table')
4 files changed, 280 insertions, 5 deletions
diff --git a/lib/vendor-investigation/table/change-qm-manager-dialog.tsx b/lib/vendor-investigation/table/change-qm-manager-dialog.tsx new file mode 100644 index 00000000..11f59937 --- /dev/null +++ b/lib/vendor-investigation/table/change-qm-manager-dialog.tsx @@ -0,0 +1,183 @@ +"use client" + +import * as React from "react" +import { useForm } from "react-hook-form" +import { zodResolver } from "@hookform/resolvers/zod" +import { z } from "zod" + +import { Button } from "@/components/ui/button" +import { + Dialog, + DialogContent, + DialogDescription, + DialogFooter, + DialogHeader, + DialogTitle, +} from "@/components/ui/dialog" +import { + Form, + FormControl, + FormField, + FormItem, + FormLabel, + FormMessage, +} from "@/components/ui/form" +import { UserCombobox } from "../../pq/pq-review-table-new/user-combobox" +import { getQMManagers } from "@/lib/pq/service" +import { updateQMManagerAction } from "../service" +import { toast } from "sonner" + +// QM 사용자 타입 +interface QMUser { + id: number + name: string + email: string + department?: string +} + +const changeQMSchema = z.object({ + qmManagerId: z.number({ + required_error: "QM 담당자를 선택해주세요.", + }), +}) + +type ChangeQMFormValues = z.infer<typeof changeQMSchema> + +interface ChangeQMManagerDialogProps { + isOpen: boolean + onClose: () => void + investigationId: number + currentQMManagerId?: number + currentQMManagerName?: string + onSuccess?: () => void +} + +export function ChangeQMManagerDialog({ + isOpen, + onClose, + investigationId, + currentQMManagerId, + currentQMManagerName, + onSuccess, +}: ChangeQMManagerDialogProps) { + const [isPending, setIsPending] = React.useState(false) + const [qmManagers, setQMManagers] = React.useState<QMUser[]>([]) + const [isLoadingManagers, setIsLoadingManagers] = React.useState(false) + + // form 객체 생성 + const form = useForm<ChangeQMFormValues>({ + resolver: zodResolver(changeQMSchema), + defaultValues: { + qmManagerId: currentQMManagerId || undefined, + }, + }) + + // Dialog가 열릴 때마다 초기값으로 폼 재설정 + React.useEffect(() => { + if (isOpen) { + form.reset({ + qmManagerId: currentQMManagerId || undefined, + }); + } + }, [isOpen, currentQMManagerId, form]); + + // Dialog가 열릴 때 QM 담당자 목록 로드 + React.useEffect(() => { + if (isOpen && qmManagers.length === 0) { + const loadQMManagers = async () => { + setIsLoadingManagers(true) + try { + const result = await getQMManagers() + if (result.success && result.data) { + setQMManagers(result.data) + } + } catch (error) { + console.error("QM 담당자 로드 오류:", error) + } finally { + setIsLoadingManagers(false) + } + } + + loadQMManagers() + } + }, [isOpen, qmManagers.length]) + + async function handleSubmit(data: ChangeQMFormValues) { + setIsPending(true) + try { + const result = await updateQMManagerAction({ + investigationId, + qmManagerId: data.qmManagerId, + }) + + if (result.success) { + toast.success(result.message || "QM 담당자가 변경되었습니다.") + onClose() + onSuccess?.() + } else { + toast.error(result.error || "QM 담당자 변경에 실패했습니다.") + } + } catch (error) { + console.error("QM 담당자 변경 오류:", error) + toast.error("QM 담당자 변경 중 오류가 발생했습니다.") + } finally { + setIsPending(false) + } + } + + return ( + <Dialog open={isOpen} onOpenChange={(open) => !open && onClose()}> + <DialogContent className="sm:max-w-[500px]"> + <DialogHeader> + <DialogTitle>QM 담당자 변경</DialogTitle> + <DialogDescription> + 실사의 QM 담당자를 변경합니다. + {currentQMManagerName && ( + <div className="mt-2 text-sm text-muted-foreground"> + 현재 담당자: {currentQMManagerName} + </div> + )} + </DialogDescription> + </DialogHeader> + <Form {...form}> + <form onSubmit={form.handleSubmit(handleSubmit)} className="space-y-4"> + <FormField + control={form.control} + name="qmManagerId" + render={({ field }) => ( + <FormItem> + <FormLabel>QM 담당자</FormLabel> + <FormControl> + <UserCombobox + users={qmManagers} + value={field.value} + onChange={field.onChange} + placeholder={isLoadingManagers ? "담당자 로딩 중..." : "담당자 선택..."} + disabled={isPending || isLoadingManagers} + /> + </FormControl> + <FormMessage /> + </FormItem> + )} + /> + + <DialogFooter> + <Button + type="button" + variant="outline" + onClick={onClose} + disabled={isPending} + > + 취소 + </Button> + <Button type="submit" disabled={isPending || isLoadingManagers}> + {isPending ? "변경 중..." : "변경"} + </Button> + </DialogFooter> + </form> + </Form> + </DialogContent> + </Dialog> + ) +} + diff --git a/lib/vendor-investigation/table/investigation-table-columns.tsx b/lib/vendor-investigation/table/investigation-table-columns.tsx index 9f4944c3..03e66076 100644 --- a/lib/vendor-investigation/table/investigation-table-columns.tsx +++ b/lib/vendor-investigation/table/investigation-table-columns.tsx @@ -5,7 +5,7 @@ import { ColumnDef } from "@tanstack/react-table" import { Checkbox } from "@/components/ui/checkbox" import { Button } from "@/components/ui/button" import { Badge } from "@/components/ui/badge" -import { Edit, Ellipsis, AlertTriangle, FileEdit, Eye } from "lucide-react" +import { Edit, Ellipsis, AlertTriangle, FileEdit, Eye, FileText } from "lucide-react" import { DropdownMenu, DropdownMenuContent, @@ -145,7 +145,7 @@ export function getColumns({ <DropdownMenuItem onSelect={async () => { - if (isCanceled || row.original.investigationStatus !== "IN_PROGRESS") return + if (isCanceled || (row.original.investigationStatus !== "IN_PROGRESS" && row.original.investigationStatus !== "SUPPLEMENT_REQUIRED")) return // 구매자체평가일 경우 결과입력 비활성화 if (row.original.investigationMethod === "PURCHASE_SELF_EVAL") { return @@ -170,7 +170,7 @@ export function getColumns({ }} disabled={ isCanceled || - row.original.investigationStatus !== "IN_PROGRESS" || + (row.original.investigationStatus !== "IN_PROGRESS" && row.original.investigationStatus !== "SUPPLEMENT_REQUIRED") || row.original.investigationMethod === "PURCHASE_SELF_EVAL" } > @@ -178,6 +178,19 @@ export function getColumns({ 실사 결과 입력 </DropdownMenuItem> + {/* 실사 실시 확정 정보 버튼 - 제품검사평가 또는 방문실사평가인 경우 */} + {(row.original.investigationMethod === "PRODUCT_INSPECTION" || + row.original.investigationMethod === "SITE_VISIT_EVAL") && ( + <DropdownMenuItem + onSelect={() => { + (setRowAction as any)?.({ type: "vendor-info-view", row }) + }} + > + <FileText className="mr-2 h-4 w-4" /> + 실사 실시 확정 정보 + </DropdownMenuItem> + )} + {canRequestSupplement && ( <> <DropdownMenuSeparator /> @@ -331,6 +344,11 @@ export function getColumns({ return value ? `#${value}` : "" } + // Handle pqNumber + if (column.id === "pqNumber") { + return value ? (value as string) : <span className="text-muted-foreground">-</span> + } + // Handle file attachment status if (column.id === "hasAttachments") { return ( diff --git a/lib/vendor-investigation/table/investigation-table-toolbar-actions.tsx b/lib/vendor-investigation/table/investigation-table-toolbar-actions.tsx index 991c1ad6..371873e4 100644 --- a/lib/vendor-investigation/table/investigation-table-toolbar-actions.tsx +++ b/lib/vendor-investigation/table/investigation-table-toolbar-actions.tsx @@ -2,13 +2,14 @@ import * as React from "react" import { type Table } from "@tanstack/react-table" -import { Download, RotateCcw } from "lucide-react" +import { Download, RotateCcw, UserCog } from "lucide-react" import { toast } from "sonner" import { exportTableToExcel } from "@/lib/export" import { Button } from "@/components/ui/button" import { VendorInvestigationsViewWithContacts } from "@/config/vendorInvestigationsColumnsConfig" import { InvestigationCancelPlanButton } from "./investigation-cancel-plan-button" +import { ChangeQMManagerDialog } from "./change-qm-manager-dialog" interface VendorsTableToolbarActionsProps { @@ -16,13 +17,46 @@ interface VendorsTableToolbarActionsProps { } export function VendorsTableToolbarActions({ table }: VendorsTableToolbarActionsProps) { - // 파일 input을 숨기고, 버튼 클릭 시 참조해 클릭하는 방식 + // 선택된 행 분석 + const selectedRows = table.getFilteredSelectedRowModel().rows + const selectedData = selectedRows.map(row => row.original) + // QM 담당자 변경 가능 여부 체크 (선택된 항목이 1개이고 상태가 PLANNED) + const canChangeQM = selectedData.length === 1 && selectedData[0].investigationStatus === "PLANNED" + const selectedInvestigation = canChangeQM ? selectedData[0] : null + + // QM 담당자 변경 다이얼로그 상태 + const [showChangeQMDialog, setShowChangeQMDialog] = React.useState(false) + + const handleChangeQMClick = () => { + if (canChangeQM) { + setShowChangeQMDialog(true) + } + } + + const handleChangeQMSuccess = () => { + // 테이블 선택 초기화 + table.toggleAllPageRowsSelected(false) + setShowChangeQMDialog(false) + } return ( <div className="flex items-center gap-2"> <InvestigationCancelPlanButton table={table} /> + {/* QM 담당자 변경 버튼 - 계획 상태이고 단일 선택일 때만 활성화 */} + {canChangeQM && ( + <Button + variant="outline" + size="sm" + onClick={handleChangeQMClick} + className="gap-2" + > + <UserCog className="size-4" aria-hidden="true" /> + <span className="hidden sm:inline">QM 담당자 변경</span> + </Button> + )} + {/** 4) Export 버튼 */} <Button variant="outline" @@ -38,6 +72,18 @@ export function VendorsTableToolbarActions({ table }: VendorsTableToolbarActions <Download className="size-4" aria-hidden="true" /> <span className="hidden sm:inline">Export</span> </Button> + + {/* QM 담당자 변경 다이얼로그 */} + {selectedInvestigation && ( + <ChangeQMManagerDialog + isOpen={showChangeQMDialog} + onClose={() => setShowChangeQMDialog(false)} + investigationId={selectedInvestigation.investigationId} + currentQMManagerId={selectedInvestigation.qmManagerId} + currentQMManagerName={selectedInvestigation.qmManagerName} + onSuccess={handleChangeQMSuccess} + /> + )} </div> ) }
\ No newline at end of file diff --git a/lib/vendor-investigation/table/investigation-table.tsx b/lib/vendor-investigation/table/investigation-table.tsx index ee122f04..2179669f 100644 --- a/lib/vendor-investigation/table/investigation-table.tsx +++ b/lib/vendor-investigation/table/investigation-table.tsx @@ -20,6 +20,7 @@ import { InvestigationResultSheet } from "./investigation-result-sheet" import { InvestigationProgressSheet } from "./investigation-progress-sheet" import { VendorDetailsDialog } from "./vendor-details-dialog" import { SupplementRequestDialog } from "@/components/investigation/supplement-request-dialog" +import { VendorInfoViewDialog } from "@/lib/site-visit/vendor-info-view-dialog" interface VendorsTableProps { promises: Promise< @@ -52,6 +53,16 @@ export function VendorsInvestigationTable({ promises }: VendorsTableProps) { // Add state for row actions const [rowAction, setRowAction] = React.useState<DataTableRowAction<VendorInvestigationsViewWithContacts> | null>(null) + // Handle row actions + React.useEffect(() => { + if (rowAction?.type === "vendor-info-view") { + // 협력업체 정보 조회 다이얼로그 열기 + setSelectedInvestigationId(rowAction.row.original.investigationId) + setIsVendorInfoViewDialogOpen(true) + setRowAction(null) + } + }, [rowAction]) + // Add state for vendor details dialog const [vendorDetailsOpen, setVendorDetailsOpen] = React.useState(false) const [selectedVendorId, setSelectedVendorId] = React.useState<number | null>(null) @@ -64,6 +75,11 @@ export function VendorsInvestigationTable({ promises }: VendorsTableProps) { vendorName: string } | null>(null) + // Add state for vendor info view dialog + const [isVendorInfoViewDialogOpen, setIsVendorInfoViewDialogOpen] = React.useState(false) + const [selectedSiteVisitRequestId, setSelectedSiteVisitRequestId] = React.useState<number | null>(null) + const [selectedInvestigationId, setSelectedInvestigationId] = React.useState<number | null>(null) + // Create handler for opening vendor details modal const openVendorDetailsModal = React.useCallback((vendorId: number) => { setSelectedVendorId(vendorId) @@ -226,6 +242,18 @@ export function VendorsInvestigationTable({ promises }: VendorsTableProps) { investigationMethod={supplementRequestData?.investigationMethod || ""} vendorName={supplementRequestData?.vendorName || ""} /> + + {/* Vendor Info View Dialog */} + <VendorInfoViewDialog + isOpen={isVendorInfoViewDialogOpen} + onClose={() => { + setIsVendorInfoViewDialogOpen(false) + setSelectedSiteVisitRequestId(null) + setSelectedInvestigationId(null) + }} + siteVisitRequestId={selectedSiteVisitRequestId} + investigationId={selectedInvestigationId} + /> </> ) }
\ No newline at end of file |