(대표님) 20250611 21시 15분 OCR 등

1 files changed, 191 insertions, 136 deletions

diff --git a/lib/vendor-document-list/table/enhanced-documents-table.tsx b/lib/vendor-document-list/table/enhanced-documents-table.tsx
index 3bd6668d..cb49f796 100644
--- a/lib/vendor-document-list/table/enhanced-documents-table.tsx
+++ b/lib/vendor-document-list/table/enhanced-documents-table.tsx
@@ -1,6 +1,7 @@
+// enhanced-documents-table-with-drawing-filter.tsx
 "use client"
 
-import * as React from "react"
+import React from "react"
 import type {
   DataTableAdvancedFilterField,
   DataTableFilterField,
@@ -10,7 +11,6 @@ import type {
 import { useDataTable } from "@/hooks/use-data-table"
 import { StageRevisionExpandedContent } from "./stage-revision-expanded-content"
 import { RevisionUploadDialog } from "./revision-upload-dialog"
-// ✅ UpdateDocumentSheet import 추가
 import { EnhancedDocTableToolbarActions } from "./enhanced-doc-table-toolbar-actions"
 import { getEnhancedDocuments } from "../enhanced-document-service"
 import type { EnhancedDocument } from "@/types/enhanced-documents"
@@ -23,69 +23,102 @@ import {
   TrendingUp, 
   Target, 
   Users,
+  Settings,
+  Filter
 } from "lucide-react"
 import { getUpdatedEnhancedColumns } from "./enhanced-doc-table-columns"
 import { ExpandableDataTable } from "@/components/data-table/expandable-data-table"
 import { toast } from "sonner"
 import { UpdateDocumentSheet } from "./update-doc-sheet"
+import { 
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select"
+import { Label } from "@/components/ui/label"
 
 interface FinalIntegratedDocumentsTableProps {
   promises: Promise<[Awaited<ReturnType<typeof getEnhancedDocuments>>]>
   selectedPackageId: number
   projectType: "ship" | "plant"
-  // ✅ contractId 추가 (AddDocumentListDialog에서 필요)
   contractId: number
+  initialDrawingKind?: string
 }
 
+// ✅ Drawing Kind 옵션 정의
+const DRAWING_KIND_OPTIONS = [
+  { value: "all", label: "전체 문서" },
+  { value: "B3", label: "B3: Vendor" },
+  { value: "B4", label: "B4: GTT" },
+  { value: "B5", label: "B5: FMEA" },
+] as const
+
 export function EnhancedDocumentsTable({
   promises,
   selectedPackageId,
   projectType,
-  contractId, // ✅ contractId 추가
+  contractId,
+  initialDrawingKind = "all"
 }: FinalIntegratedDocumentsTableProps) {
-  // 데이터 로딩
   const [{ data, pageCount, total }] = React.use(promises)
 
-
-  // 상태 관리
+  // ✅ Drawing Kind 필터 상태 추가
+  const [drawingKindFilter, setDrawingKindFilter] = React.useState<string>(initialDrawingKind)
+  
+  // 기존 상태들
   const [rowAction, setRowAction] = React.useState<DataTableRowAction<EnhancedDocument> | null>(null)
   const [expandedRows, setExpandedRows] = React.useState<Set<string>>(new Set())
   const [quickFilter, setQuickFilter] = React.useState<'all' | 'overdue' | 'due_soon' | 'in_progress' | 'high_priority'>('all')
-  
-  // ✅ 스테이지 확장 상태 관리 (문서별로 관리)
   const [expandedStages, setExpandedStages] = React.useState<Record<string, Record<number, boolean>>>({})
-  
-  // ✅ 다이얼로그 상태들 - editDialogOpen -> editSheetOpen으로 변경
   const [uploadDialogOpen, setUploadDialogOpen] = React.useState(false)
-  const [editSheetOpen, setEditSheetOpen] = React.useState(false) // Sheet로 변경
+  const [editSheetOpen, setEditSheetOpen] = React.useState(false)
   const [selectedDocument, setSelectedDocument] = React.useState<EnhancedDocument | null>(null)
   const [selectedStage, setSelectedStage] = React.useState<string>("")
   const [selectedRevision, setSelectedRevision] = React.useState<string>("")
   const [uploadMode, setUploadMode] = React.useState<'new' | 'append'>('new')
 
+  // ✅ Drawing Kind별 데이터 필터링
+  const filteredByDrawingKind = React.useMemo(() => {
+    if (drawingKindFilter === "all") return data
+    return data.filter(doc => doc.drawingKind === drawingKindFilter)
+  }, [data, drawingKindFilter])
+
+  // ✅ Drawing Kind별 통계 계산
+  const drawingKindStats = React.useMemo(() => {
+    const stats = DRAWING_KIND_OPTIONS.reduce((acc, option) => {
+      if (option.value === "all") {
+        acc[option.value] = data.length
+      } else {
+        acc[option.value] = data.filter(doc => doc.drawingKind === option.value).length
+      }
+      return acc
+    }, {} as Record<string, number>)
+    
+    return stats
+  }, [data])
+
   // 다음 리비전 계산 함수
   const getNextRevision = React.useCallback((currentRevision: string): string => {
     if (!currentRevision) return "A"
     
-    // 알파벳 리비전 (A, B, C...)
     if (/^[A-Z]$/.test(currentRevision)) {
       const charCode = currentRevision.charCodeAt(0)
-      if (charCode < 90) { // Z가 아닌 경우
+      if (charCode < 90) {
         return String.fromCharCode(charCode + 1)
       }
-      return "AA" // Z 다음은 AA
+      return "AA"
     }
     
-    // 숫자 리비전 (1, 2, 3...)
     if (/^\d+$/.test(currentRevision)) {
       return String(parseInt(currentRevision) + 1)
     }
     
-    // 기타 복잡한 리비전 형태는 그대로 반환
     return currentRevision
   }, [])
 
-  // 컬럼 정의
+  // ✅ 컬럼 정의 - drawingKindFilter 추가
   const columns = React.useMemo(
     () => getUpdatedEnhancedColumns({ 
       setRowAction: (action) => {
@@ -93,17 +126,15 @@ export function EnhancedDocumentsTable({
         if (action) {
           setSelectedDocument(action.row.original)
           
-          // 액션 타입에 따른 다이얼로그 열기
           switch (action.type) {
             case "update":
-              setEditSheetOpen(true) // ✅ Sheet 열기로 변경
+              setEditSheetOpen(true)
               break
             case "upload":
               setSelectedStage(action.row.original.currentStageName || "")
               setUploadDialogOpen(true)
               break
             case "view":
-              // 상세보기는 확장된 행으로 대체
               const rowId = action.row.id
               const newExpanded = new Set(expandedRows)
               if (newExpanded.has(rowId)) {
@@ -116,24 +147,25 @@ export function EnhancedDocumentsTable({
           }
         }
       },
-      projectType
+      projectType,
+      drawingKindFilter // ✅ 추가
     }),
-    [expandedRows, projectType]
+    [expandedRows, projectType, drawingKindFilter]
   )
 
-  // 통계 계산
+  // 기존 통계 계산
   const stats = React.useMemo(() => {
-    const totalDocs = data.length
-    const overdue = data.filter(doc => doc.isOverdue).length
-    const dueSoon = data.filter(doc => 
+    const totalDocs = filteredByDrawingKind.length
+    const overdue = filteredByDrawingKind.filter(doc => doc.isOverdue).length
+    const dueSoon = filteredByDrawingKind.filter(doc => 
       doc.daysUntilDue !== null && 
       doc.daysUntilDue >= 0 && 
       doc.daysUntilDue <= 3
     ).length
-    const inProgress = data.filter(doc => doc.currentStageStatus === 'IN_PROGRESS').length
-    const highPriority = data.filter(doc => doc.currentStagePriority === 'HIGH').length
+    const inProgress = filteredByDrawingKind.filter(doc => doc.currentStageStatus === 'IN_PROGRESS').length
+    const highPriority = filteredByDrawingKind.filter(doc => doc.currentStagePriority === 'HIGH').length
     const avgProgress = totalDocs > 0 
-      ? Math.round(data.reduce((sum, doc) => sum + (doc.progressPercentage || 0), 0) / totalDocs)
+      ? Math.round(filteredByDrawingKind.reduce((sum, doc) => sum + (doc.progressPercentage || 0), 0) / totalDocs)
       : 0
     
     return { 
@@ -144,66 +176,60 @@ export function EnhancedDocumentsTable({
       highPriority, 
       avgProgress 
     }
-  }, [data])
+  }, [filteredByDrawingKind])
 
   // 빠른 필터링
   const filteredData = React.useMemo(() => {
     switch (quickFilter) {
       case 'overdue':
-        return data.filter(doc => doc.isOverdue)
+        return filteredByDrawingKind.filter(doc => doc.isOverdue)
       case 'due_soon':
-        return data.filter(doc => 
+        return filteredByDrawingKind.filter(doc => 
           doc.daysUntilDue !== null && 
           doc.daysUntilDue >= 0 && 
           doc.daysUntilDue <= 3
         )
       case 'in_progress':
-        return data.filter(doc => doc.currentStageStatus === 'IN_PROGRESS')
+        return filteredByDrawingKind.filter(doc => doc.currentStageStatus === 'IN_PROGRESS')
       case 'high_priority':
-        return data.filter(doc => doc.currentStagePriority === 'HIGH')
+        return filteredByDrawingKind.filter(doc => doc.currentStagePriority === 'HIGH')
       default:
-        return data
+        return filteredByDrawingKind
     }
-  }, [data, quickFilter])
+  }, [filteredByDrawingKind, quickFilter])
 
-  // ✅ 핸들러 함수 수정: 모드 매개변수 추가
+  // 나머지 핸들러 함수들
   const handleUploadRevision = React.useCallback((document: EnhancedDocument, stageName?: string, currentRevision?: string, mode: 'new' | 'append' = 'new') => {
     setSelectedDocument(document)
     setSelectedStage(stageName || document.currentStageName || "")
-    setUploadMode(mode) // ✅ 모드 설정
+    setUploadMode(mode)
     
     if (mode === 'new') {
-      // 새 리비전 생성: currentRevision이 있으면 다음 리비전을 자동 계산
       if (currentRevision) {
         const nextRevision = getNextRevision(currentRevision)
         setSelectedRevision(nextRevision)
       } else {
-        // 스테이지의 최신 리비전을 찾아서 다음 리비전 계산
         const latestRevision = findLatestRevisionInStage(document, stageName || document.currentStageName || "")
         if (latestRevision) {
           setSelectedRevision(getNextRevision(latestRevision))
         } else {
-          setSelectedRevision("A") // 첫 번째 리비전
+          setSelectedRevision("A")
         }
       }
     } else {
-      // 기존 리비전에 파일 추가: 같은 리비전 번호 사용
       setSelectedRevision(currentRevision || "")
     }
     
     setUploadDialogOpen(true)
   }, [getNextRevision])
 
-  // ✅ 스테이지에서 최신 리비전을 찾는 헬퍼 함수
   const findLatestRevisionInStage = React.useCallback((document: EnhancedDocument, stageName: string) => {
     const stage = document.allStages?.find(s => s.stageName === stageName)
     if (!stage || !stage.revisions || stage.revisions.length === 0) {
       return null
     }
     
-    // 리비전들을 정렬해서 최신 것 찾기 (간단한 알파벳/숫자 정렬)
     const sortedRevisions = [...stage.revisions].sort((a, b) => {
-      // 알파벳과 숫자를 구분해서 정렬
       const aIsAlpha = /^[A-Z]+$/.test(a.revision)
       const bIsAlpha = /^[A-Z]+$/.test(b.revision)
       
@@ -212,20 +238,17 @@ export function EnhancedDocumentsTable({
       } else if (!aIsAlpha && !bIsAlpha) {
         return parseInt(a.revision) - parseInt(b.revision)
       } else {
-        return aIsAlpha ? -1 : 1 // 알파벳이 숫자보다 먼저
+        return aIsAlpha ? -1 : 1
       }
     })
     
     return sortedRevisions[sortedRevisions.length - 1]?.revision || null
   }, [])
 
-  // ✅ 새 문서 추가 핸들러 - EnhancedDocTableToolbarActions에서 AddDocumentListDialog를 직접 렌더링하므로 별도 상태 관리 불필요
   const handleNewDocument = () => {
     // AddDocumentListDialog는 자체적으로 Dialog trigger를 가지므로 별도 처리 불필요
-    // EnhancedDocTableToolbarActions에서 처리됨
   }
 
-  // ✅ 스테이지 토글 핸들러 추가
   const handleStageToggle = React.useCallback((documentId: string, stageId: number) => {
     setExpandedStages(prev => ({
       ...prev,
@@ -239,17 +262,14 @@ export function EnhancedDocumentsTable({
   const handleBulkAction = async (action: string, selectedRows: any[]) => {
     try {
       if (action === 'bulk_approve') {
-        // 일괄 승인 로직
         const stageIds = selectedRows
           .map(row => row.original.currentStageId)
           .filter(Boolean)
         
         if (stageIds.length > 0) {
-          // await bulkUpdateStageStatus(stageIds, 'APPROVED')
           toast.success(`${stageIds.length}개 항목이 승인되었습니다.`)
         }
       } else if (action === 'bulk_upload') {
-        // 일괄 업로드 로직
         toast.info("일괄 업로드 기능은 준비 중입니다.")
       }
     } catch (error) {
@@ -257,27 +277,25 @@ export function EnhancedDocumentsTable({
     }
   }
 
-  // ✅ 다이얼로그 닫기 함수 수정
   const closeAllDialogs = () => {
     setUploadDialogOpen(false)
-    setEditSheetOpen(false) // editDialogOpen -> editSheetOpen
+    setEditSheetOpen(false)
     setSelectedDocument(null)
     setSelectedStage("")
     setSelectedRevision("")
-    setUploadMode('new') // ✅ 모드 초기화
+    setUploadMode('new')
     setRowAction(null)
   }
 
-  // ✅ EnhancedDocument를 UpdateDocumentSheet의 document 형식으로 변환하는 함수
   const convertToUpdateFormat = React.useCallback((doc: EnhancedDocument | null) => {
     if (!doc) return null
     
     return {
       id: doc.documentId,
-      contractId: contractId, // contractId 사용
+      contractId: contractId,
       docNumber: doc.docNumber,
       title: doc.title,
-      status: doc.status || "pending", // 기본값 설정
+      status: doc.status || "pending",
       description: doc.description || null,
       remarks: doc.remarks || null,
     }
@@ -309,6 +327,16 @@ export function EnhancedDocumentsTable({
       type: "text",
     },
     {
+      id: "drawingKind",
+      label: "문서종류",
+      type: "select",
+      options: [
+        { label: "B3", value: "B3" },
+        { label: "B4", value: "B4" },
+        { label: "B5", value: "B5" },
+      ],
+    },
+    {
       id: "currentStageStatus",
       label: "스테이지 상태",
       type: "select",
@@ -351,7 +379,6 @@ export function EnhancedDocumentsTable({
     },
   ]
 
-  // 데이터 테이블 훅
   const { table } = useDataTable({
     data: filteredData,
     columns,
@@ -371,11 +398,15 @@ export function EnhancedDocumentsTable({
 
   return (
     <div className="space-y-6">
+
+
       {/* 통계 대시보드 */}
       <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
         <Card className="cursor-pointer hover:shadow-md transition-shadow" onClick={() => setQuickFilter('all')}>
           <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
-            <CardTitle className="text-sm font-medium">전체 문서</CardTitle>
+            <CardTitle className="text-sm font-medium">
+              {drawingKindFilter === "all" ? "전체 문서" : `${DRAWING_KIND_OPTIONS.find(o => o.value === drawingKindFilter)?.label} 문서`}
+            </CardTitle>
             <TrendingUp className="h-4 w-4 text-muted-foreground" />
           </CardHeader>
           <CardContent>
@@ -420,80 +451,107 @@ export function EnhancedDocumentsTable({
         </Card>
       </div>
 
-      {/* 빠른 필터 */}
-      <div className="flex gap-2 overflow-x-auto pb-2">
-        <Badge 
-          variant={quickFilter === 'all' ? 'default' : 'outline'}
-          className="cursor-pointer hover:bg-primary hover:text-primary-foreground whitespace-nowrap"
-          onClick={() => setQuickFilter('all')}
-        >
-          전체 ({stats.total})
-        </Badge>
-        <Badge 
-          variant={quickFilter === 'overdue' ? 'destructive' : 'outline'}
-          className="cursor-pointer hover:bg-destructive hover:text-destructive-foreground whitespace-nowrap"
-          onClick={() => setQuickFilter('overdue')}
-        >
-          <AlertTriangle className="w-3 h-3 mr-1" />
-          지연 ({stats.overdue})
-        </Badge>
-        <Badge 
-          variant={quickFilter === 'due_soon' ? 'default' : 'outline'}
-          className="cursor-pointer hover:bg-orange-500 hover:text-white whitespace-nowrap"
-          onClick={() => setQuickFilter('due_soon')}
-        >
-          <Clock className="w-3 h-3 mr-1" />
-          마감임박 ({stats.dueSoon})
-        </Badge>
-        <Badge 
-          variant={quickFilter === 'in_progress' ? 'default' : 'outline'}
-          className="cursor-pointer hover:bg-blue-500 hover:text-white whitespace-nowrap"
-          onClick={() => setQuickFilter('in_progress')}
-        >
-          <Users className="w-3 h-3 mr-1" />
-          진행중 ({stats.inProgress})
-        </Badge>
-        <Badge 
-          variant={quickFilter === 'high_priority' ? 'destructive' : 'outline'}
-          className="cursor-pointer hover:bg-destructive hover:text-destructive-foreground whitespace-nowrap"
-          onClick={() => setQuickFilter('high_priority')}
-        >
-          <Target className="w-3 h-3 mr-1" />
-          높은우선순위 ({stats.highPriority})
-        </Badge>
+      {/* 빠른 필터 + 문서 종류 필터 */}
+      <div className="flex flex-col sm:flex-row gap-4 justify-between items-start sm:items-center">
+        {/* 왼쪽: 빠른 필터 */}
+        <div className="flex gap-2 overflow-x-auto pb-2">
+          <Badge 
+            variant={quickFilter === 'all' ? 'default' : 'outline'}
+            className="cursor-pointer hover:bg-primary hover:text-primary-foreground whitespace-nowrap"
+            onClick={() => setQuickFilter('all')}
+          >
+            전체 ({stats.total})
+          </Badge>
+          <Badge 
+            variant={quickFilter === 'overdue' ? 'destructive' : 'outline'}
+            className="cursor-pointer hover:bg-destructive hover:text-destructive-foreground whitespace-nowrap"
+            onClick={() => setQuickFilter('overdue')}
+          >
+            <AlertTriangle className="w-3 h-3 mr-1" />
+            지연 ({stats.overdue})
+          </Badge>
+          <Badge 
+            variant={quickFilter === 'due_soon' ? 'default' : 'outline'}
+            className="cursor-pointer hover:bg-orange-500 hover:text-white whitespace-nowrap"
+            onClick={() => setQuickFilter('due_soon')}
+          >
+            <Clock className="w-3 h-3 mr-1" />
+            마감임박 ({stats.dueSoon})
+          </Badge>
+          <Badge 
+            variant={quickFilter === 'in_progress' ? 'default' : 'outline'}
+            className="cursor-pointer hover:bg-blue-500 hover:text-white whitespace-nowrap"
+            onClick={() => setQuickFilter('in_progress')}
+          >
+            <Users className="w-3 h-3 mr-1" />
+            진행중 ({stats.inProgress})
+          </Badge>
+          <Badge 
+            variant={quickFilter === 'high_priority' ? 'destructive' : 'outline'}
+            className="cursor-pointer hover:bg-destructive hover:text-destructive-foreground whitespace-nowrap"
+            onClick={() => setQuickFilter('high_priority')}
+          >
+            <Target className="w-3 h-3 mr-1" />
+            높은우선순위 ({stats.highPriority})
+          </Badge>
+        </div>
+
+        {/* 오른쪽: 문서 종류 필터 */}
+        <div className="flex items-center gap-2 flex-shrink-0">
+          <Select value={drawingKindFilter} onValueChange={setDrawingKindFilter}>
+            <SelectTrigger className="w-[140px]">
+              <SelectValue placeholder="문서 종류" />
+            </SelectTrigger>
+            <SelectContent>
+              {DRAWING_KIND_OPTIONS.map(option => (
+                <SelectItem key={option.value} value={option.value}>
+                  <div className="flex items-center justify-between w-full">
+                    <span>{option.label}</span>
+                    <Badge variant="outline" className="ml-2 text-xs">
+                      {drawingKindStats[option.value] || 0}
+                    </Badge>
+                  </div>
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+          
+          {/* B4 필드 표시 안내 (아이콘만) */}
+          {drawingKindFilter === "B4" && (
+            <div className="flex items-center gap-1 text-blue-600 bg-blue-50 px-2 py-1 rounded text-xs">
+              <Settings className="h-3 w-3" />
+              <span className="hidden sm:inline">상세정보 확장가능</span>
+            </div>
+          )}
+        </div>
       </div>
 
-      {/* 메인 테이블 - 가로스크롤 문제 해결을 위한 구조 개선 */}
+      {/* 메인 테이블 */}
       <div className="space-y-4">
         <div className="rounded-md border bg-white overflow-hidden">
-        <ExpandableDataTable 
-          table={table}
-          expandable={true}
-          expandedRows={expandedRows}
-          setExpandedRows={setExpandedRows}
-          renderExpandedContent={(document) => (
-            <div className="">
-              <StageRevisionExpandedContent 
-                document={document}
-                onUploadRevision={handleUploadRevision}
-                projectType={projectType}
-                expandedStages={expandedStages[String(document.documentId)] || {}}
-                onStageToggle={(stageId) => handleStageToggle(String(document.documentId), stageId)}
-              />
-            </div>
-          )}
-          expandedRowClassName="!p-0"
-          // clickableColumns={[
-          //   'docNumber',    
-          //   'title',        
-          //   'currentStageStatus', 
-          //   'progressPercentage', 
-          // ]}
-          excludeFromClick={[
-            'actions',      
-            'select'        
-          ]}
-        >
+          <ExpandableDataTable 
+            table={table}
+            expandable={true}
+            expandedRows={expandedRows}
+            setExpandedRows={setExpandedRows}
+            renderExpandedContent={(document) => (
+              <div className="">
+                <StageRevisionExpandedContent 
+                  document={document}
+                  onUploadRevision={handleUploadRevision}
+                  projectType={projectType}
+                  expandedStages={expandedStages[String(document.documentId)] || {}}
+                  onStageToggle={(stageId) => handleStageToggle(String(document.documentId), stageId)}
+                  // showB4Fields={document.drawingKind === "B4"}
+                />
+              </div>
+            )}
+            expandedRowClassName="!p-0"
+            excludeFromClick={[
+              'actions',      
+              'select'        
+            ]}
+          >
             <DataTableAdvancedToolbar
               table={table}
               filterFields={advancedFilterFields}
@@ -503,7 +561,7 @@ export function EnhancedDocumentsTable({
                 table={table}
                 projectType={projectType}
                 selectedPackageId={selectedPackageId}
-                contractId={contractId} // ✅ contractId 추가
+                contractId={contractId}
                 onNewDocument={handleNewDocument}
                 onBulkAction={handleBulkAction}
               />
@@ -512,9 +570,7 @@ export function EnhancedDocumentsTable({
         </div>
       </div>
 
-      {/* ✅ 분리된 다이얼로그들 - UpdateDocumentSheet와 AddDocumentListDialog로 교체 */}
-      
-      {/* 리비전 업로드 다이얼로그 - mode props 추가 */}
+      {/* 다이얼로그들 */}
       <RevisionUploadDialog
         open={uploadDialogOpen}
         onOpenChange={(open) => {
@@ -528,7 +584,6 @@ export function EnhancedDocumentsTable({
         mode={uploadMode}
       />
 
-      {/* ✅ 문서 편집 Sheet로 교체 */}
       <UpdateDocumentSheet
         open={editSheetOpen}
         onOpenChange={(open) => {