(최겸) 기술영업 조선,해양RFQ 수정

1 files changed, 594 insertions, 0 deletions

diff --git a/lib/techsales-rfq/table/create-rfq-top-dialog.tsx b/lib/techsales-rfq/table/create-rfq-top-dialog.tsx
new file mode 100644
index 00000000..70f56ebd
--- /dev/null
+++ b/lib/techsales-rfq/table/create-rfq-top-dialog.tsx
@@ -0,0 +1,594 @@
+"use client"
+
+import * as React from "react"
+import { toast } from "sonner"
+import { ArrowUpDown, CheckSquare, Plus, Search, Square, X, Loader2 } from "lucide-react"
+import { Input } from "@/components/ui/input"
+import { Calendar } from "@/components/ui/calendar"
+import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"
+import { CalendarIcon } from "lucide-react"
+import { format } from "date-fns"
+import { ko } from "date-fns/locale"
+
+import { Button } from "@/components/ui/button"
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "@/components/ui/dialog"
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+  FormDescription,
+} from "@/components/ui/form"
+import { zodResolver } from "@hookform/resolvers/zod"
+import { useForm } from "react-hook-form"
+import * as z from "zod"
+import { EstimateProjectSelector } from "@/components/BidProjectSelector"
+import { type Project } from "@/lib/rfqs/service"
+import { createTechSalesTopRfq } from "@/lib/techsales-rfq/service"
+import { useSession } from "next-auth/react"
+import { Separator } from "@/components/ui/separator"
+import {
+  DropdownMenu,
+  DropdownMenuCheckboxItem,
+  DropdownMenuContent,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu"
+import { cn } from "@/lib/utils"
+import { ScrollArea } from "@/components/ui/scroll-area"
+
+// 공종 타입 import
+import { 
+  getOffshoreTopWorkTypes,
+  getAllOffshoreTopItemsForCache,
+  type OffshoreTopWorkType,
+  type OffshoreTopTechItem
+} from "@/lib/items-tech/service"
+
+// 해양 TOP 아이템 타입 정의 (이미 service에서 import하므로 제거)
+
+// 유효성 검증 스키마
+const createTopRfqSchema = z.object({
+  biddingProjectId: z.number({
+    required_error: "프로젝트를 선택해주세요.",
+  }),
+  itemIds: z.array(z.number()).min(1, {
+    message: "적어도 하나의 아이템을 선택해야 합니다.",
+  }),
+  dueDate: z.date({
+    required_error: "마감일을 선택해주세요.",
+  }),
+  description: z.string().optional(),
+})
+
+// 폼 데이터 타입
+type CreateTopRfqFormValues = z.infer<typeof createTopRfqSchema>
+
+// 공종 타입 정의
+interface WorkTypeOption {
+  code: OffshoreTopWorkType
+  name: string
+  description: string
+}
+
+interface CreateTopRfqDialogProps {
+  onCreated?: () => void;
+}
+
+export function CreateTopRfqDialog({ onCreated }: CreateTopRfqDialogProps) { 
+  const { data: session } = useSession()
+  const [isProcessing, setIsProcessing] = React.useState(false)
+  const [isDialogOpen, setIsDialogOpen] = React.useState(false)
+  const [selectedProject, setSelectedProject] = React.useState<Project | null>(null)
+  
+  // 검색 및 필터링 상태
+  const [itemSearchQuery, setItemSearchQuery] = React.useState("")
+  const [selectedWorkType, setSelectedWorkType] = React.useState<OffshoreTopWorkType | null>(null)
+  const [selectedItems, setSelectedItems] = React.useState<OffshoreTopTechItem[]>([])
+  
+  // 데이터 상태
+  const [workTypes, setWorkTypes] = React.useState<WorkTypeOption[]>([])
+  const [allItems, setAllItems] = React.useState<OffshoreTopTechItem[]>([])
+  const [isLoadingItems, setIsLoadingItems] = React.useState(false)
+  const [dataLoadError, setDataLoadError] = React.useState<string | null>(null)
+  const [retryCount, setRetryCount] = React.useState(0)
+
+  // 데이터 로딩 함수
+  const loadData = React.useCallback(async (isRetry = false) => {
+    try {
+      if (!isRetry) {
+        setIsLoadingItems(true)
+        setDataLoadError(null)
+      }
+      
+      console.log(`해양 TOP RFQ 데이터 로딩 시작... ${isRetry ? `(재시도 ${retryCount + 1}회)` : ''}`)
+      
+      const [workTypesResult, topItemsResult] = await Promise.all([
+        getOffshoreTopWorkTypes(),
+        getAllOffshoreTopItemsForCache()
+      ])
+      
+      console.log("TOP - WorkTypes 결과:", workTypesResult)
+      console.log("TOP - Items 결과:", topItemsResult)
+      
+      // WorkTypes 설정
+      if (Array.isArray(workTypesResult)) {
+        setWorkTypes(workTypesResult)
+      } else {
+        throw new Error("공종 데이터를 불러올 수 없습니다.")
+      }
+      
+      // TOP Items 설정
+      if (topItemsResult.data && Array.isArray(topItemsResult.data)) {
+        setAllItems(topItemsResult.data as OffshoreTopTechItem[])
+        console.log("TOP 아이템 설정 완료:", topItemsResult.data.length, "개")
+      } else {
+        throw new Error("TOP 아이템 데이터를 불러올 수 없습니다.")
+      }
+      
+      // 성공 시 재시도 카운터 리셋
+      setRetryCount(0)
+      setDataLoadError(null)
+      console.log("해양 TOP RFQ 데이터 로딩 완료")
+      
+    } catch (error) {
+      const errorMessage = error instanceof Error ? error.message : '알 수 없는 오류가 발생했습니다.'
+      console.error("해양 TOP RFQ 데이터 로딩 오류:", errorMessage)
+      
+      setDataLoadError(errorMessage)
+      
+      // 3회까지 자동 재시도 (500ms 간격)
+      if (retryCount < 2) {
+        console.log(`${500 * (retryCount + 1)}ms 후 재시도...`)
+        setTimeout(() => {
+          setRetryCount(prev => prev + 1)
+          loadData(true)
+        }, 500 * (retryCount + 1))
+      } else {
+        // 재시도 실패 시 사용자에게 알림
+        toast.error(`데이터 로딩에 실패했습니다: ${errorMessage}`)
+      }
+    } finally {
+      if (!isRetry) {
+        setIsLoadingItems(false)
+      }
+    }
+  }, [retryCount])
+
+  // 다이얼로그가 열릴 때마다 데이터 로딩
+  React.useEffect(() => {
+    if (isDialogOpen) {
+      setDataLoadError(null)
+      setRetryCount(0)
+      loadData()
+    }
+  }, [isDialogOpen, loadData])
+
+  // 수동 새로고침 함수
+  const handleRefreshData = React.useCallback(() => {
+    setDataLoadError(null)
+    setRetryCount(0)
+    loadData()
+  }, [loadData])
+
+  // RFQ 생성 폼
+  const form = useForm<CreateTopRfqFormValues>({
+    resolver: zodResolver(createTopRfqSchema),
+    defaultValues: {
+      biddingProjectId: undefined,
+      itemIds: [],
+      dueDate: undefined,
+      description: "",
+    }
+  })
+
+  // 필터링된 아이템 목록 가져오기
+  const availableItems = React.useMemo(() => {
+    let filtered = [...allItems]
+
+    // 공종 필터  
+    if (selectedWorkType) {
+      filtered = filtered.filter(item => item.workType === selectedWorkType as OffshoreTopTechItem['workType'])
+    }
+
+    // 검색어 필터
+    if (itemSearchQuery && itemSearchQuery.trim()) {
+      const query = itemSearchQuery.toLowerCase().trim()
+      filtered = filtered.filter(item => 
+        item.itemCode.toLowerCase().includes(query) ||
+        (item.itemList && item.itemList.toLowerCase().includes(query)) ||
+        (item.subItemList && item.subItemList.toLowerCase().includes(query))
+      )
+    }
+
+    return filtered
+  }, [allItems, itemSearchQuery, selectedWorkType])
+
+  // 프로젝트 선택 처리
+  const handleProjectSelect = (project: Project) => {
+    setSelectedProject(project)
+    form.setValue("biddingProjectId", project.id)
+    // 선택 초기화
+    setSelectedItems([])
+    setSelectedWorkType(null)
+    setItemSearchQuery("")
+    form.setValue("itemIds", [])
+  }
+
+  // 아이템 선택/해제 처리
+  const handleItemToggle = (item: OffshoreTopTechItem) => {
+    const isSelected = selectedItems.some(selected => selected.id === item.id)
+    
+    if (isSelected) {
+      const newSelectedItems = selectedItems.filter(selected => selected.id !== item.id)
+      setSelectedItems(newSelectedItems)
+      form.setValue("itemIds", newSelectedItems.map(item => item.id))
+    } else {
+      const newSelectedItems = [...selectedItems, item]
+      setSelectedItems(newSelectedItems)
+      form.setValue("itemIds", newSelectedItems.map(item => item.id))
+    }
+  }
+
+  // RFQ 생성 함수
+  const handleCreateRfq = async (data: CreateTopRfqFormValues) => {
+    try {
+      setIsProcessing(true)
+      
+      // 사용자 인증 확인
+      if (!session?.user?.id) {
+        throw new Error("로그인이 필요합니다")
+      }
+
+      // 해양 TOP RFQ 생성 - 1:N 관계로 한 번에 생성
+      const result = await createTechSalesTopRfq({
+        biddingProjectId: data.biddingProjectId,
+        itemIds: data.itemIds,
+        dueDate: data.dueDate,
+        description: data.description,
+        createdBy: Number(session.user.id),
+      })
+      
+      if (result.error) {
+        throw new Error(result.error)
+      }
+      
+      // 성공적으로 생성되면 다이얼로그 닫기 및 메시지 표시
+      toast.success(`${selectedItems.length}개 아이템으로 해양 TOP RFQ가 성공적으로 생성되었습니다`)
+      
+      setIsDialogOpen(false)
+      form.reset({
+        biddingProjectId: undefined,
+        itemIds: [],
+        dueDate: undefined,
+        description: "",
+      })
+      setSelectedProject(null)
+      setItemSearchQuery("")
+      setSelectedWorkType(null)
+      setSelectedItems([])
+      setDataLoadError(null)
+      setRetryCount(0)
+      
+      // 생성 후 콜백 실행
+      if (onCreated) {
+        onCreated()
+      }
+      
+    } catch (error) {
+      console.error("해양 TOP RFQ 생성 오류:", error)
+      toast.error(`해양 TOP RFQ 생성 중 오류가 발생했습니다: ${error instanceof Error ? error.message : '알 수 없는 오류'}`)
+    } finally {
+      setIsProcessing(false)
+    }
+  }
+
+  return (
+    <Dialog
+      open={isDialogOpen}
+      onOpenChange={(open) => {
+        setIsDialogOpen(open)
+        if (!open) {
+          form.reset({
+            biddingProjectId: undefined,
+            itemIds: [],
+            dueDate: undefined,
+            description: "",
+          })
+          setSelectedProject(null)
+          setItemSearchQuery("")
+          setSelectedWorkType(null)
+          setSelectedItems([])
+          setDataLoadError(null)
+          setRetryCount(0)
+        }
+      }}
+    >
+      <DialogTrigger asChild>
+        <Button
+          variant="default"
+          size="sm"
+          className="gap-2"
+          disabled={isProcessing}
+        >
+          <Plus className="size-4" aria-hidden="true" />
+          <span className="hidden sm:inline">해양 TOP RFQ 생성</span>
+        </Button>
+      </DialogTrigger>
+      <DialogContent 
+        className="max-w-none h-[90vh] overflow-y-auto flex flex-col"
+        style={{ width: '1200px' }}
+      >
+        <DialogHeader className="border-b pb-4">
+          <DialogTitle>해양 TOP RFQ 생성</DialogTitle>
+        </DialogHeader>
+        
+        <div className="space-y-6 p-1 overflow-y-auto">
+          <Form {...form}>
+            <form onSubmit={form.handleSubmit(handleCreateRfq)} className="space-y-6">
+              {/* 프로젝트 선택 */}
+              <div className="space-y-4">
+                <FormField
+                  control={form.control}
+                  name="biddingProjectId"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>입찰 프로젝트</FormLabel>
+                      <FormControl>
+                        <EstimateProjectSelector
+                          selectedProjectId={field.value}
+                          onProjectSelect={handleProjectSelect}
+                          placeholder="입찰 프로젝트를 선택하세요"
+                        />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+                
+                <Separator className="my-4" />
+                
+                {/* 마감일 설정 */}
+                <FormField
+                  control={form.control}
+                  name="dueDate"
+                  render={({ field }) => (
+                    <FormItem className="flex flex-col">
+                      <FormLabel>마감일</FormLabel>
+                      <Popover>
+                        <PopoverTrigger asChild>
+                          <FormControl>
+                            <Button
+                              variant="outline"
+                              className={cn(
+                                "w-full pl-3 text-left font-normal",
+                                !field.value && "text-muted-foreground"
+                              )}
+                            >
+                              {field.value ? (
+                                format(field.value, "PPP", { locale: ko })
+                              ) : (
+                                <span>마감일을 선택하세요</span>
+                              )}
+                              <CalendarIcon className="ml-auto h-4 w-4 opacity-50" />
+                            </Button>
+                          </FormControl>
+                        </PopoverTrigger>
+                        <PopoverContent className="w-auto p-0" align="start">
+                          <Calendar
+                            mode="single"
+                            selected={field.value}
+                            onSelect={field.onChange}
+                            disabled={(date) =>
+                              date < new Date() || date < new Date("1900-01-01")
+                            }
+                            initialFocus
+                          />
+                        </PopoverContent>
+                      </Popover>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+                
+                <Separator className="my-4" />
+                
+                <div className="space-y-6">
+                  {/* 아이템 선택 영역 */}
+                  <div className="space-y-4">
+                    <div>
+                      <FormLabel>아이템 선택</FormLabel>
+                      <FormDescription>
+                        해양 TOP RFQ를 생성하려면 아이템을 선택하세요
+                      </FormDescription>
+                    </div>
+                    
+                    {/* 아이템 검색 및 필터 */}
+                    <div className="space-y-2">
+                      <div className="flex space-x-2">
+                        <div className="relative flex-1">
+                          <Search className="absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
+                          <Input
+                            placeholder="아이템 검색..."
+                            value={itemSearchQuery}
+                            onChange={(e) => setItemSearchQuery(e.target.value)}
+                            className="pl-8 pr-8"
+                            disabled={isLoadingItems || dataLoadError !== null}
+                          />
+                          {itemSearchQuery && (
+                            <Button
+                              variant="ghost"
+                              size="sm"
+                              className="absolute right-0 top-0 h-full px-3"
+                              onClick={() => setItemSearchQuery("")}
+                              disabled={isLoadingItems || dataLoadError !== null}
+                            >
+                              <X className="h-4 w-4" />
+                            </Button>
+                          )}
+                        </div>
+                        
+                        {/* 공종 필터 */}
+                        <DropdownMenu>
+                          <DropdownMenuTrigger asChild>
+                            <Button 
+                              variant="outline" 
+                              className="gap-1"
+                              disabled={isLoadingItems || dataLoadError !== null}
+                            >
+                              {selectedWorkType ? workTypes.find(wt => wt.code === selectedWorkType)?.name : "전체 공종"}
+                              <ArrowUpDown className="ml-2 h-4 w-4 opacity-50" />
+                            </Button>
+                          </DropdownMenuTrigger>
+                          <DropdownMenuContent align="end">
+                            <DropdownMenuCheckboxItem
+                              checked={selectedWorkType === null}
+                              onCheckedChange={() => setSelectedWorkType(null)}
+                            >
+                              전체 공종
+                            </DropdownMenuCheckboxItem>
+                            {workTypes.map(workType => (
+                              <DropdownMenuCheckboxItem
+                                key={workType.code}
+                                checked={selectedWorkType === workType.code}
+                                onCheckedChange={() => setSelectedWorkType(workType.code)}
+                              >
+                                {workType.name}
+                              </DropdownMenuCheckboxItem>
+                            ))}
+                          </DropdownMenuContent>
+                        </DropdownMenu>
+                      </div>
+                    </div>
+                      
+                    {/* 아이템 목록 */}
+                    <div className="border rounded-md">
+                      <ScrollArea className="h-[300px]">
+                        <div className="p-2 space-y-1">
+                          {dataLoadError ? (
+                            <div className="text-center py-8">
+                              <div className="p-4 bg-destructive/10 border border-destructive/20 rounded-md mx-4">
+                                <div className="flex flex-col items-center gap-3">
+                                  <X className="h-8 w-8 text-destructive" />
+                                  <div className="text-center">
+                                    <p className="text-sm text-destructive font-medium">데이터 로딩에 실패했습니다</p>
+                                    <p className="text-xs text-muted-foreground mt-1">{dataLoadError}</p>
+                                  </div>
+                                  <Button
+                                    variant="outline"
+                                    size="sm"
+                                    onClick={handleRefreshData}
+                                    disabled={isLoadingItems}
+                                    className="h-8"
+                                  >
+                                    {isLoadingItems ? (
+                                      <>
+                                        <Loader2 className="h-3 w-3 animate-spin mr-1" />
+                                        재시도 중...
+                                      </>
+                                    ) : (
+                                      "다시 시도"
+                                    )}
+                                  </Button>
+                                </div>
+                              </div>
+                            </div>
+                          ) : isLoadingItems ? (
+                            <div className="text-center py-8 text-muted-foreground">
+                              <Loader2 className="h-6 w-6 animate-spin mx-auto mb-2" />
+                              아이템을 불러오는 중...
+                              {retryCount > 0 && (
+                                <p className="text-xs mt-1">재시도 {retryCount}회</p>
+                              )}
+                            </div>
+                          ) : availableItems.length > 0 ? (
+                            [...availableItems]
+                              .sort((a, b) => {
+                                const aName = a.itemList || 'zzz'
+                                const bName = b.itemList || 'zzz'
+                                return aName.localeCompare(bName, 'ko', { numeric: true })
+                              })
+                              .map((item) => {
+                                const isSelected = selectedItems.some(selected => selected.id === item.id)
+                                
+                                return (
+                                  <div
+                                    key={item.id}
+                                    className={cn(
+                                      "flex items-center space-x-2 p-2 rounded-md cursor-pointer hover:bg-muted",
+                                      isSelected && "bg-muted"
+                                    )}
+                                    onClick={() => handleItemToggle(item)}
+                                  >
+                                    <div className="flex items-center space-x-2 flex-1">
+                                      {isSelected ? (
+                                        <CheckSquare className="h-4 w-4" />
+                                      ) : (
+                                        <Square className="h-4 w-4" />
+                                      )}
+                                      <div className="flex-1">
+                                        <div className="font-medium">
+                                          {item.itemList || '아이템명 없음'}
+                                          {item.subItemList && ` / ${item.subItemList}`}
+                                        </div>
+                                        <div className="text-sm text-muted-foreground">
+                                          {item.itemCode || '아이템코드 없음'}
+                                        </div>
+                                        <div className="text-xs text-muted-foreground">
+                                          공종: {item.workType}
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                )
+                              })
+                          ) : (
+                            <div className="text-center py-8 text-muted-foreground">
+                              {itemSearchQuery ? "검색 결과가 없습니다" : "아이템이 없습니다"}
+                            </div>
+                          )}
+                        </div>
+                      </ScrollArea>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </form>
+          </Form>
+        </div>
+        
+        {/* Footer - Sticky 버튼 영역 */}
+        <div className="sticky bottom-0 left-0 z-20 bg-background border-t pt-4 mt-4">
+          <div className="flex justify-end space-x-2">
+            <Button
+              type="button"
+              variant="outline"
+              onClick={() => setIsDialogOpen(false)}
+              disabled={isProcessing}
+            >
+              취소
+            </Button>
+            <Button 
+              type="button"
+              onClick={form.handleSubmit(handleCreateRfq)}
+              disabled={
+                isProcessing || 
+                !selectedProject || 
+                selectedItems.length === 0
+              }
+            >
+              {isProcessing ? "처리 중..." : `${selectedItems.length}개 아이템으로 해양 TOP RFQ 생성하기`}
+            </Button>
+          </div>
+        </div>
+      </DialogContent>
+    </Dialog>
+  )
+} 
\ No newline at end of file