summaryrefslogtreecommitdiff
path: root/lib/techsales-rfq/table
diff options
context:
space:
mode:
Diffstat (limited to 'lib/techsales-rfq/table')
-rw-r--r--lib/techsales-rfq/table/create-rfq-dialog.tsx244
-rw-r--r--lib/techsales-rfq/table/detail-table/rfq-detail-column.tsx17
-rw-r--r--lib/techsales-rfq/table/detail-table/rfq-detail-table.tsx91
-rw-r--r--lib/techsales-rfq/table/detail-table/update-vendor-sheet.tsx449
-rw-r--r--lib/techsales-rfq/table/detail-table/vendor-communication-drawer.tsx22
-rw-r--r--lib/techsales-rfq/table/rfq-table-column.tsx178
-rw-r--r--lib/techsales-rfq/table/rfq-table.tsx117
-rw-r--r--lib/techsales-rfq/table/tech-sales-rfq-attachments-sheet.tsx540
8 files changed, 920 insertions, 738 deletions
diff --git a/lib/techsales-rfq/table/create-rfq-dialog.tsx b/lib/techsales-rfq/table/create-rfq-dialog.tsx
index cc652b44..5faa3a0b 100644
--- a/lib/techsales-rfq/table/create-rfq-dialog.tsx
+++ b/lib/techsales-rfq/table/create-rfq-dialog.tsx
@@ -197,20 +197,60 @@ export function CreateRfqDialog({ onCreated }: CreateRfqDialogProps) {
throw new Error("로그인이 필요합니다")
}
- // 자재코드(item_code) 배열을 materialGroupCodes로 전달
- const result = await createTechSalesRfq({
- biddingProjectId: data.biddingProjectId,
- materialGroupCodes: data.materialCodes, // item_code를 자재코드로 사용
- createdBy: Number(session.user.id),
- dueDate: data.dueDate,
+ // 선택된 아이템들을 아이템명(itemList)으로 그룹핑
+ const groupedItems = selectedItems.reduce((groups, item) => {
+ const actualItemName = item.itemList // 실제 조선 아이템명
+ if (!actualItemName) {
+ throw new Error(`아이템 "${item.itemCode}"의 아이템명(itemList)이 없습니다.`)
+ }
+ if (!groups[actualItemName]) {
+ groups[actualItemName] = []
+ }
+ groups[actualItemName].push(item)
+ return groups
+ }, {} as Record<string, typeof selectedItems>)
+
+ const rfqGroups = Object.entries(groupedItems).map(([actualItemName, items]) => {
+ const itemCodes = items.map(item => item.itemCode) // 자재그룹코드들
+ const joinedItemCodes = itemCodes.join(',')
+ return {
+ actualItemName,
+ items,
+ itemCodes,
+ joinedItemCodes,
+ codeLength: joinedItemCodes.length,
+ isOverLimit: joinedItemCodes.length > 255
+ }
})
+
+ // 255자 초과 그룹 확인
+ const overLimitGroups = rfqGroups.filter(group => group.isOverLimit)
+ if (overLimitGroups.length > 0) {
+ const groupNames = overLimitGroups.map(g => `"${g.actualItemName}" (${g.codeLength}자)`).join(', ')
+ throw new Error(`다음 아이템 그룹의 자재코드가 255자를 초과합니다: ${groupNames}`)
+ }
+
+ // 각 그룹별로 RFQ 생성
+ const createPromises = rfqGroups.map(group =>
+ createTechSalesRfq({
+ biddingProjectId: data.biddingProjectId,
+ materialGroupCodes: [group.joinedItemCodes], // 그룹화된 자재코드들
+ createdBy: Number(session.user.id),
+ dueDate: data.dueDate,
+ })
+ )
+
+ const results = await Promise.all(createPromises)
- if (result.error) {
- throw new Error(result.error)
+ // 오류 확인
+ const errors = results.filter(result => result.error)
+ if (errors.length > 0) {
+ throw new Error(errors.map(e => e.error).join(', '))
}
// 성공적으로 생성되면 다이얼로그 닫기 및 메시지 표시
- toast.success(`${result.data?.length || 0}개의 RFQ가 성공적으로 생성되었습니다`)
+ const totalRfqs = results.reduce((sum, result) => sum + (result.data?.length || 0), 0)
+ toast.success(`${rfqGroups.length}개 아이템 그룹으로 총 ${totalRfqs}개의 RFQ가 성공적으로 생성되었습니다`)
setIsDialogOpen(false)
form.reset({
biddingProjectId: undefined,
@@ -423,38 +463,45 @@ export function CreateRfqDialog({ onCreated }: CreateRfqDialogProps) {
아이템을 불러오는 중...
</div>
) : availableItems.length > 0 ? (
- availableItems.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" />
+ [...availableItems]
+ .sort((a, b) => {
+ // itemList 기준으로 정렬 (없는 경우 itemName 사용, 둘 다 없으면 맨 뒤로)
+ const aName = a.itemList || a.itemName || 'zzz'
+ const bName = b.itemList || b.itemName || '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"
)}
- <div className="flex-1">
- <div className="font-medium">
- {item.itemList || item.itemName}
- </div>
- <div className="text-sm text-muted-foreground">
- {item.itemCode} • {item.description || '설명 없음'}
- </div>
- <div className="text-xs text-muted-foreground">
- 공종: {item.workType} • 선종: {item.shipTypes}
+ 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.itemName || '아이템명 없음'}
+ </div>
+ <div className="text-sm text-muted-foreground">
+ {item.itemCode} • {item.description || '설명 없음'}
+ </div>
+ <div className="text-xs text-muted-foreground">
+ 공종: {item.workType} • 선종: {item.shipTypes}
+ </div>
</div>
</div>
</div>
- </div>
- )
- })
+ )
+ })
) : (
<div className="text-center py-8 text-muted-foreground">
{itemSearchQuery ? "검색 결과가 없습니다" : "아이템이 없습니다"}
@@ -480,7 +527,7 @@ export function CreateRfqDialog({ onCreated }: CreateRfqDialogProps) {
variant="secondary"
className="flex items-center gap-1"
>
- {item.itemList || item.itemName} ({item.itemCode})
+ {item.itemList || item.itemName || '아이템명 없음'} ({item.itemCode})
<X
className="h-3 w-3 cursor-pointer hover:text-destructive"
onClick={() => handleRemoveItem(item.id)}
@@ -498,19 +545,93 @@ export function CreateRfqDialog({ onCreated }: CreateRfqDialogProps) {
</FormItem>
)}
/>
+
+ {/* RFQ 그룹핑 미리보기 */}
+ {selectedItems.length > 0 && (
+ <div className="space-y-3">
+ <FormLabel>생성될 RFQ 그룹 미리보기</FormLabel>
+ <div className="border rounded-md p-3 bg-background">
+ {(() => {
+ // 아이템명(itemList)으로 그룹핑
+ const groupedItems = selectedItems.reduce((groups, item) => {
+ const actualItemName = item.itemList // 실제 조선 아이템명
+ if (!actualItemName) {
+ return groups // itemList가 없는 경우 제외
+ }
+ if (!groups[actualItemName]) {
+ groups[actualItemName] = []
+ }
+ groups[actualItemName].push(item)
+ return groups
+ }, {} as Record<string, typeof selectedItems>)
+
+ const rfqGroups = Object.entries(groupedItems).map(([actualItemName, items]) => {
+ const itemCodes = items.map(item => item.itemCode) // 자재그룹코드들
+ const joinedItemCodes = itemCodes.join(',')
+ return {
+ actualItemName,
+ items,
+ itemCodes,
+ joinedItemCodes,
+ codeLength: joinedItemCodes.length,
+ isOverLimit: joinedItemCodes.length > 255
+ }
+ })
+
+ return (
+ <div className="space-y-3">
+ <div className="text-sm text-muted-foreground">
+ 총 {rfqGroups.length}개의 RFQ가 생성됩니다 (아이템명별로 그룹핑)
+ </div>
+ {rfqGroups.map((group, index) => (
+ <div
+ key={group.actualItemName}
+ className={cn(
+ "p-3 border rounded-md space-y-2",
+ group.isOverLimit && "border-destructive bg-destructive/5"
+ )}
+ >
+ <div className="flex items-center justify-between">
+ <div className="font-medium">
+ RFQ #{index + 1}: {group.actualItemName}
+ </div>
+ <Badge variant={group.isOverLimit ? "destructive" : "secondary"}>
+ {group.itemCodes.length}개 자재코드 ({group.codeLength}/255자)
+ </Badge>
+ </div>
+ <div className="text-sm text-muted-foreground">
+ 자재코드: {group.joinedItemCodes}
+ </div>
+ {group.isOverLimit && (
+ <div className="text-sm text-destructive">
+ ⚠️ 자재코드 길이가 255자를 초과합니다. 일부 아이템을 제거해주세요.
+ </div>
+ )}
+ <div className="text-xs text-muted-foreground">
+ 포함된 아이템: {group.items.map(item => `${item.itemCode}`).join(', ')}
+ </div>
+ </div>
+ ))}
+ </div>
+ )
+ })()}
+ </div>
+ </div>
+ )}
</div>
</div>
)}
{/* 안내 메시지 */}
- {selectedProject && (
+ {/* {selectedProject && (
<div className="text-sm text-muted-foreground bg-muted p-3 rounded-md">
<p>• 공종별 조선 아이템을 선택하세요.</p>
- <p>• 선택된 아이템의 자재코드(item_code)별로 개별 RFQ가 생성됩니다.</p>
- <p>• 아이템 코드가 자재 그룹 코드로 사용됩니다.</p>
+ <p>• <strong>같은 아이템명의 다른 자재코드들은 하나의 RFQ로 그룹핑됩니다.</strong></p>
+ <p>• 그룹핑된 자재코드들은 comma로 구분되어 저장됩니다.</p>
+ <p>• 자재코드 길이는 최대 255자까지 가능합니다.</p>
<p>• 마감일은 벤더가 견적을 제출해야 하는 날짜입니다.</p>
</div>
- )}
+ )} */}
<div className="flex justify-end space-x-2 pt-4">
<Button
@@ -523,9 +644,44 @@ export function CreateRfqDialog({ onCreated }: CreateRfqDialogProps) {
</Button>
<Button
type="submit"
- disabled={isProcessing || !selectedProject || selectedItems.length === 0}
+ disabled={
+ isProcessing ||
+ !selectedProject ||
+ selectedItems.length === 0 ||
+ // 255자 초과 그룹이 있는지 확인
+ (() => {
+ const groupedItems = selectedItems.reduce((groups, item) => {
+ const actualItemName = item.itemList // 실제 조선 아이템명
+ if (!actualItemName) {
+ return groups // itemList가 없는 경우 제외
+ }
+ if (!groups[actualItemName]) {
+ groups[actualItemName] = []
+ }
+ groups[actualItemName].push(item.itemCode)
+ return groups
+ }, {} as Record<string, string[]>)
+
+ return Object.values(groupedItems).some(itemCodes => itemCodes.join(',').length > 255)
+ })()
+ }
>
- {isProcessing ? "처리 중..." : `${selectedItems.length}개 자재코드로 생성하기`}
+ {isProcessing ? "처리 중..." : (() => {
+ const groupedItems = selectedItems.reduce((groups, item) => {
+ const actualItemName = item.itemList // 실제 조선 아이템명
+ if (!actualItemName) {
+ return groups // itemList가 없는 경우 제외
+ }
+ if (!groups[actualItemName]) {
+ groups[actualItemName] = []
+ }
+ groups[actualItemName].push(item.itemCode)
+ return groups
+ }, {} as Record<string, string[]>)
+
+ const groupCount = Object.keys(groupedItems).length
+ return `${groupCount}개 아이템 그룹으로 생성하기`
+ })()}
</Button>
</div>
</form>
diff --git a/lib/techsales-rfq/table/detail-table/rfq-detail-column.tsx b/lib/techsales-rfq/table/detail-table/rfq-detail-column.tsx
index c4a7edde..cfae0bd7 100644
--- a/lib/techsales-rfq/table/detail-table/rfq-detail-column.tsx
+++ b/lib/techsales-rfq/table/detail-table/rfq-detail-column.tsx
@@ -14,10 +14,11 @@ import { Checkbox } from "@/components/ui/checkbox";
import { Ellipsis, MessageCircle } from "lucide-react";
import { Button } from "@/components/ui/button";
import { Badge } from "@/components/ui/badge";
+import { useRouter } from "next/navigation";
export interface DataTableRowAction<TData> {
row: Row<TData>;
- type: "delete" | "update" | "communicate";
+ type: "delete" | "communicate";
}
// 벤더 견적 데이터 타입 정의
@@ -232,6 +233,13 @@ export function getRfqDetailColumns({
cell: function Cell({ row }) {
const vendorId = row.original.vendorId;
const unreadCount = vendorId ? unreadMessages[vendorId] || 0 : 0;
+ const router = useRouter();
+
+ const handleViewDetails = () => {
+ if (vendorId) {
+ router.push(`/ko/evcp/vendors/${vendorId}/info`);
+ }
+ };
return (
<div className="text-right flex items-center justify-end gap-1">
@@ -269,9 +277,12 @@ export function getRfqDetailColumns({
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="w-[160px]">
<DropdownMenuItem
- onClick={() => setRowAction({ row, type: "update" })}
+ onClick={handleViewDetails}
+ disabled={!vendorId}
+ className="gap-2"
>
- 벤더 수정
+ {/* <Eye className="h-4 w-4" /> */}
+ 벤더 상세정보
</DropdownMenuItem>
<DropdownMenuItem
onClick={() => setRowAction({ row, type: "delete" })}
diff --git a/lib/techsales-rfq/table/detail-table/rfq-detail-table.tsx b/lib/techsales-rfq/table/detail-table/rfq-detail-table.tsx
index 4f8ac37b..a2f012ad 100644
--- a/lib/techsales-rfq/table/detail-table/rfq-detail-table.tsx
+++ b/lib/techsales-rfq/table/detail-table/rfq-detail-table.tsx
@@ -12,11 +12,10 @@ import { toast } from "sonner"
import { Skeleton } from "@/components/ui/skeleton"
import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
-import { Loader2, UserPlus, BarChart2, Send, Trash2, MessageCircle } from "lucide-react"
+import { Loader2, UserPlus, BarChart2, Send, Trash2 } from "lucide-react"
import { ClientDataTable } from "@/components/client-data-table/data-table"
import { AddVendorDialog } from "./add-vendor-dialog"
import { DeleteVendorDialog } from "./delete-vendor-dialog"
-import { UpdateVendorSheet } from "./update-vendor-sheet"
import { VendorCommunicationDrawer } from "./vendor-communication-drawer"
import { VendorQuotationComparisonDialog } from "./vendor-quotation-comparison-dialog"
@@ -41,28 +40,6 @@ interface RfqDetailTablesProps {
maxHeight?: string | number
}
-// 데이터 타입 정의
-interface Vendor {
- id: number;
- vendorName: string;
- vendorCode: string;
- // 기타 필요한 벤더 속성들
-}
-
-interface Currency {
- code: string;
- name: string;
-}
-
-interface PaymentTerm {
- code: string;
- description: string;
-}
-
-interface Incoterm {
- code: string;
- description: string;
-}
export function RfqDetailTables({ selectedRfq, maxHeight }: RfqDetailTablesProps) {
// console.log("selectedRfq", selectedRfq)
@@ -71,14 +48,9 @@ export function RfqDetailTables({ selectedRfq, maxHeight }: RfqDetailTablesProps
const [isLoading, setIsLoading] = useState(false)
const [details, setDetails] = useState<RfqDetailView[]>([])
const [vendorDialogOpen, setVendorDialogOpen] = React.useState(false)
- const [updateSheetOpen, setUpdateSheetOpen] = React.useState(false)
const [deleteDialogOpen, setDeleteDialogOpen] = React.useState(false)
const [selectedDetail, setSelectedDetail] = React.useState<RfqDetailView | null>(null)
- const [vendors, setVendors] = React.useState<Vendor[]>([])
- const [currencies, setCurrencies] = React.useState<Currency[]>([])
- const [paymentTerms, setPaymentTerms] = React.useState<PaymentTerm[]>([])
- const [incoterms, setIncoterms] = React.useState<Incoterm[]>([])
const [isAdddialogLoading, setIsAdddialogLoading] = useState(false)
const [rowAction, setRowAction] = React.useState<DataTableRowAction<RfqDetailView> | null>(null)
@@ -159,21 +131,6 @@ export function RfqDetailTables({ selectedRfq, maxHeight }: RfqDetailTablesProps
const handleAddVendor = useCallback(async () => {
try {
setIsAdddialogLoading(true)
-
- // TODO: 기술영업용 벤더, 통화, 지불조건, 인코텀즈 데이터 로드 함수 구현 필요
- // const [vendorsData, currenciesData, paymentTermsData, incotermsData] = await Promise.all([
- // fetchVendors(),
- // fetchCurrencies(),
- // fetchPaymentTerms(),
- // fetchIncoterms()
- // ])
-
- // 임시 데이터
- setVendors([])
- setCurrencies([])
- setPaymentTerms([])
- setIncoterms([])
-
setVendorDialogOpen(true)
} catch (error) {
console.error("데이터 로드 오류:", error)
@@ -417,39 +374,16 @@ export function RfqDetailTables({ selectedRfq, maxHeight }: RfqDetailTablesProps
return;
}
- // 다른 액션들은 기존과 동일하게 처리
- setIsAdddialogLoading(true);
-
- // TODO: 필요한 데이터 로드 (벤더, 통화, 지불조건, 인코텀즈)
- // const [vendorsData, currenciesData, paymentTermsData, incotermsData] = await Promise.all([
- // fetchVendors(),
- // fetchCurrencies(),
- // fetchPaymentTerms(),
- // fetchIncoterms()
- // ]);
-
- // 임시 데이터
- setVendors([]);
- setCurrencies([]);
- setPaymentTerms([]);
- setIncoterms([]);
-
- // 이제 데이터가 로드되었으므로 필요한 작업 수행
- if (rowAction.type === "update") {
- setSelectedDetail(rowAction.row.original);
- setUpdateSheetOpen(true);
- } else if (rowAction.type === "delete") {
+ // 삭제 액션인 경우
+ if (rowAction.type === "delete") {
setSelectedDetail(rowAction.row.original);
setDeleteDialogOpen(true);
+ setRowAction(null);
+ return;
}
} catch (error) {
- console.error("데이터 로드 오류:", error);
- toast.error("데이터를 불러오는 중 오류가 발생했습니다");
- } finally {
- // communicate 타입이 아닌 경우에만 로딩 상태 변경
- if (rowAction && rowAction.type !== "communicate") {
- setIsAdddialogLoading(false);
- }
+ console.error("액션 처리 오류:", error);
+ toast.error("작업을 처리하는 중 오류가 발생했습니다");
}
};
@@ -615,17 +549,6 @@ export function RfqDetailTables({ selectedRfq, maxHeight }: RfqDetailTablesProps
onSuccess={handleRefreshData}
/>
- <UpdateVendorSheet
- open={updateSheetOpen}
- onOpenChange={setUpdateSheetOpen}
- detail={selectedDetail}
- vendors={vendors}
- currencies={currencies}
- paymentTerms={paymentTerms}
- incoterms={incoterms}
- onSuccess={handleRefreshData}
- />
-
<DeleteVendorDialog
open={deleteDialogOpen}
onOpenChange={setDeleteDialogOpen}
diff --git a/lib/techsales-rfq/table/detail-table/update-vendor-sheet.tsx b/lib/techsales-rfq/table/detail-table/update-vendor-sheet.tsx
deleted file mode 100644
index 0399f4df..00000000
--- a/lib/techsales-rfq/table/detail-table/update-vendor-sheet.tsx
+++ /dev/null
@@ -1,449 +0,0 @@
-"use client"
-
-import * as React from "react"
-import { zodResolver } from "@hookform/resolvers/zod"
-import { Check, ChevronsUpDown, Loader } from "lucide-react"
-import { useForm } from "react-hook-form"
-import { toast } from "sonner"
-import { z } from "zod"
-
-import { cn } from "@/lib/utils"
-import { Button } from "@/components/ui/button"
-import {
- Command,
- CommandEmpty,
- CommandGroup,
- CommandInput,
- CommandItem,
-} from "@/components/ui/command"
-import {
- Form,
- FormControl,
- FormField,
- FormItem,
- FormLabel,
- FormMessage,
-} from "@/components/ui/form"
-import { Input } from "@/components/ui/input"
-import {
- Popover,
- PopoverContent,
- PopoverTrigger,
-} from "@/components/ui/popover"
-import {
- Select,
- SelectContent,
- SelectItem,
- SelectTrigger,
- SelectValue,
-} from "@/components/ui/select"
-import {
- Sheet,
- SheetClose,
- SheetContent,
- SheetDescription,
- SheetFooter,
- SheetHeader,
- SheetTitle,
-} from "@/components/ui/sheet"
-import { Checkbox } from "@/components/ui/checkbox"
-import { ScrollArea } from "@/components/ui/scroll-area"
-
-import { RfqDetailView } from "./rfq-detail-column"
-import { updateRfqDetail } from "@/lib/procurement-rfqs/services"
-
-// 폼 유효성 검증 스키마
-const updateRfqDetailSchema = z.object({
- vendorId: z.string().min(1, "벤더를 선택해주세요"),
- currency: z.string().min(1, "통화를 선택해주세요"),
- paymentTermsCode: z.string().min(1, "지불 조건을 선택해주세요"),
- incotermsCode: z.string().min(1, "인코텀즈를 선택해주세요"),
- incotermsDetail: z.string().optional(),
- deliveryDate: z.string().optional(),
- taxCode: z.string().optional(),
- placeOfShipping: z.string().optional(),
- placeOfDestination: z.string().optional(),
- materialPriceRelatedYn: z.boolean().default(false),
-})
-
-type UpdateRfqDetailFormValues = z.infer<typeof updateRfqDetailSchema>
-
-// 데이터 타입 정의
-interface Vendor {
- id: number;
- vendorName: string;
- vendorCode: string;
-}
-
-interface Currency {
- code: string;
- name: string;
-}
-
-interface PaymentTerm {
- code: string;
- description: string;
-}
-
-interface Incoterm {
- code: string;
- description: string;
-}
-
-interface UpdateRfqDetailSheetProps
- extends React.ComponentPropsWithRef<typeof Sheet> {
- detail: RfqDetailView | null;
- vendors: Vendor[];
- currencies: Currency[];
- paymentTerms: PaymentTerm[];
- incoterms: Incoterm[];
- onSuccess?: () => void;
-}
-
-export function UpdateVendorSheet({
- detail,
- vendors,
- currencies,
- paymentTerms,
- incoterms,
- onSuccess,
- ...props
-}: UpdateRfqDetailSheetProps) {
- const [isUpdatePending, startUpdateTransition] = React.useTransition()
- const [vendorOpen, setVendorOpen] = React.useState(false)
-
- const form = useForm<UpdateRfqDetailFormValues>({
- resolver: zodResolver(updateRfqDetailSchema),
- defaultValues: {
- vendorId: detail?.vendorName ? String(vendors.find(v => v.vendorName === detail.vendorName)?.id || "") : "",
- currency: detail?.currency || "",
- paymentTermsCode: detail?.paymentTermsCode || "",
- incotermsCode: detail?.incotermsCode || "",
- incotermsDetail: detail?.incotermsDetail || "",
- deliveryDate: detail?.deliveryDate ? new Date(detail.deliveryDate).toISOString().split('T')[0] : "",
- taxCode: detail?.taxCode || "",
- placeOfShipping: detail?.placeOfShipping || "",
- placeOfDestination: detail?.placeOfDestination || "",
- materialPriceRelatedYn: detail?.materialPriceRelatedYn || false,
- },
- })
-
- // detail이 변경될 때 form 값 업데이트
- React.useEffect(() => {
- if (detail) {
- const vendorId = vendors.find(v => v.vendorName === detail.vendorName)?.id
-
- form.reset({
- vendorId: vendorId ? String(vendorId) : "",
- currency: detail.currency || "",
- paymentTermsCode: detail.paymentTermsCode || "",
- incotermsCode: detail.incotermsCode || "",
- incotermsDetail: detail.incotermsDetail || "",
- deliveryDate: detail.deliveryDate ? new Date(detail.deliveryDate).toISOString().split('T')[0] : "",
- taxCode: detail.taxCode || "",
- placeOfShipping: detail.placeOfShipping || "",
- placeOfDestination: detail.placeOfDestination || "",
- materialPriceRelatedYn: detail.materialPriceRelatedYn || false,
- })
- }
- }, [detail, form, vendors])
-
- function onSubmit(values: UpdateRfqDetailFormValues) {
- if (!detail) return
-
- startUpdateTransition(async () => {
- try {
- const result = await updateRfqDetail(detail.detailId, values)
-
- if (!result.success) {
- toast.error(result.message || "수정 중 오류가 발생했습니다")
- return
- }
-
- props.onOpenChange?.(false)
- toast.success("RFQ 벤더 정보가 수정되었습니다")
- onSuccess?.()
- } catch (error) {
- console.error("RFQ 벤더 수정 오류:", error)
- toast.error("수정 중 오류가 발생했습니다")
- }
- })
- }
-
- return (
- <Sheet {...props}>
- <SheetContent className="flex w-full flex-col gap-6 sm:max-w-xl">
- <SheetHeader className="text-left">
- <SheetTitle>RFQ 벤더 정보 수정</SheetTitle>
- <SheetDescription>
- 벤더 정보를 수정하고 저장하세요
- </SheetDescription>
- </SheetHeader>
- <ScrollArea className="flex-1 pr-4">
- <Form {...form}>
- <form
- id="update-rfq-detail-form"
- onSubmit={form.handleSubmit(onSubmit)}
- className="flex flex-col gap-4"
- >
- {/* 검색 가능한 벤더 선택 필드 */}
- <FormField
- control={form.control}
- name="vendorId"
- render={({ field }) => (
- <FormItem className="flex flex-col">
- <FormLabel>벤더 <span className="text-red-500">*</span></FormLabel>
- <Popover open={vendorOpen} onOpenChange={setVendorOpen}>
- <PopoverTrigger asChild>
- <FormControl>
- <Button
- variant="outline"
- role="combobox"
- aria-expanded={vendorOpen}
- className={cn(
- "w-full justify-between",
- !field.value && "text-muted-foreground"
- )}
- >
- {field.value
- ? vendors.find((vendor) => String(vendor.id) === field.value)
- ? `${vendors.find((vendor) => String(vendor.id) === field.value)?.vendorName} (${vendors.find((vendor) => String(vendor.id) === field.value)?.vendorCode})`
- : "벤더를 선택하세요"
- : "벤더를 선택하세요"}
- <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
- </Button>
- </FormControl>
- </PopoverTrigger>
- <PopoverContent className="w-[400px] p-0">
- <Command>
- <CommandInput placeholder="벤더 검색..." />
- <CommandEmpty>검색 결과가 없습니다</CommandEmpty>
- <ScrollArea className="h-60">
- <CommandGroup>
- {vendors.map((vendor) => (
- <CommandItem
- key={vendor.id}
- value={`${vendor.vendorName} ${vendor.vendorCode}`}
- onSelect={() => {
- form.setValue("vendorId", String(vendor.id), {
- shouldValidate: true,
- })
- setVendorOpen(false)
- }}
- >
- <Check
- className={cn(
- "mr-2 h-4 w-4",
- String(vendor.id) === field.value
- ? "opacity-100"
- : "opacity-0"
- )}
- />
- {vendor.vendorName} ({vendor.vendorCode})
- </CommandItem>
- ))}
- </CommandGroup>
- </ScrollArea>
- </Command>
- </PopoverContent>
- </Popover>
- <FormMessage />
- </FormItem>
- )}
- />
-
- <FormField
- control={form.control}
- name="currency"
- render={({ field }) => (
- <FormItem>
- <FormLabel>통화 <span className="text-red-500">*</span></FormLabel>
- <Select onValueChange={field.onChange} value={field.value}>
- <FormControl>
- <SelectTrigger>
- <SelectValue placeholder="통화를 선택하세요" />
- </SelectTrigger>
- </FormControl>
- <SelectContent>
- {currencies.map((currency) => (
- <SelectItem key={currency.code} value={currency.code}>
- {currency.name} ({currency.code})
- </SelectItem>
- ))}
- </SelectContent>
- </Select>
- <FormMessage />
- </FormItem>
- )}
- />
-
- <div className="grid grid-cols-2 gap-4">
- <FormField
- control={form.control}
- name="paymentTermsCode"
- render={({ field }) => (
- <FormItem>
- <FormLabel>지불 조건 <span className="text-red-500">*</span></FormLabel>
- <Select onValueChange={field.onChange} value={field.value}>
- <FormControl>
- <SelectTrigger>
- <SelectValue placeholder="지불 조건 선택" />
- </SelectTrigger>
- </FormControl>
- <SelectContent>
- {paymentTerms.map((term) => (
- <SelectItem key={term.code} value={term.code}>
- {term.description}
- </SelectItem>
- ))}
- </SelectContent>
- </Select>
- <FormMessage />
- </FormItem>
- )}
- />
-
- <FormField
- control={form.control}
- name="incotermsCode"
- render={({ field }) => (
- <FormItem>
- <FormLabel>인코텀즈 <span className="text-red-500">*</span></FormLabel>
- <Select onValueChange={field.onChange} value={field.value}>
- <FormControl>
- <SelectTrigger>
- <SelectValue placeholder="인코텀즈 선택" />
- </SelectTrigger>
- </FormControl>
- <SelectContent>
- {incoterms.map((incoterm) => (
- <SelectItem key={incoterm.code} value={incoterm.code}>
- {incoterm.description}
- </SelectItem>
- ))}
- </SelectContent>
- </Select>
- <FormMessage />
- </FormItem>
- )}
- />
- </div>
-
- <FormField
- control={form.control}
- name="incotermsDetail"
- render={({ field }) => (
- <FormItem>
- <FormLabel>인코텀즈 세부사항</FormLabel>
- <FormControl>
- <Input {...field} placeholder="인코텀즈 세부사항" />
- </FormControl>
- <FormMessage />
- </FormItem>
- )}
- />
-
- <div className="grid grid-cols-2 gap-4">
- <FormField
- control={form.control}
- name="deliveryDate"
- render={({ field }) => (
- <FormItem>
- <FormLabel>납품 예정일</FormLabel>
- <FormControl>
- <Input {...field} type="date" />
- </FormControl>
- <FormMessage />
- </FormItem>
- )}
- />
-
- <FormField
- control={form.control}
- name="taxCode"
- render={({ field }) => (
- <FormItem>
- <FormLabel>세금 코드</FormLabel>
- <FormControl>
- <Input {...field} placeholder="세금 코드" />
- </FormControl>
- <FormMessage />
- </FormItem>
- )}
- />
- </div>
-
- <div className="grid grid-cols-2 gap-4">
- <FormField
- control={form.control}
- name="placeOfShipping"
- render={({ field }) => (
- <FormItem>
- <FormLabel>선적지</FormLabel>
- <FormControl>
- <Input {...field} placeholder="선적지" />
- </FormControl>
- <FormMessage />
- </FormItem>
- )}
- />
-
- <FormField
- control={form.control}
- name="placeOfDestination"
- render={({ field }) => (
- <FormItem>
- <FormLabel>도착지</FormLabel>
- <FormControl>
- <Input {...field} placeholder="도착지" />
- </FormControl>
- <FormMessage />
- </FormItem>
- )}
- />
- </div>
-
- <FormField
- control={form.control}
- name="materialPriceRelatedYn"
- render={({ field }) => (
- <FormItem className="flex flex-row items-start space-x-3 space-y-0 rounded-md border p-4">
- <FormControl>
- <Checkbox
- checked={field.value}
- onCheckedChange={field.onChange}
- />
- </FormControl>
- <div className="space-y-1 leading-none">
- <FormLabel>자재 가격 관련 여부</FormLabel>
- </div>
- </FormItem>
- )}
- />
- </form>
- </Form>
- </ScrollArea>
- <SheetFooter className="gap-2 pt-2 sm:space-x-0">
- <SheetClose asChild>
- <Button type="button" variant="outline">
- 취소
- </Button>
- </SheetClose>
- <Button
- type="submit"
- form="update-rfq-detail-form"
- disabled={isUpdatePending}
- >
- {isUpdatePending && (
- <Loader
- className="mr-2 size-4 animate-spin"
- aria-hidden="true"
- />
- )}
- 저장
- </Button>
- </SheetFooter>
- </SheetContent>
- </Sheet>
- )
-} \ No newline at end of file
diff --git a/lib/techsales-rfq/table/detail-table/vendor-communication-drawer.tsx b/lib/techsales-rfq/table/detail-table/vendor-communication-drawer.tsx
index 51ef7b38..958cc8d1 100644
--- a/lib/techsales-rfq/table/detail-table/vendor-communication-drawer.tsx
+++ b/lib/techsales-rfq/table/detail-table/vendor-communication-drawer.tsx
@@ -37,7 +37,7 @@ import {
} from "@/components/ui/dialog"
import { formatDateTime } from "@/lib/utils"
import { formatFileSize } from "@/lib/utils" // formatFileSize 유틸리티 임포트
-import { fetchVendorComments, markMessagesAsRead } from "@/lib/procurement-rfqs/services"
+import { fetchTechSalesVendorComments, markTechSalesMessagesAsRead } from "@/lib/techsales-rfq/service"
// 타입 정의
interface Comment {
@@ -59,7 +59,7 @@ interface Attachment {
id: number;
fileName: string;
fileSize: number;
- fileType: string;
+ fileType: string | null;
filePath: string;
uploadedAt: Date;
}
@@ -99,8 +99,8 @@ async function sendComment(params: {
});
}
- // API 엔드포인트 구성
- const url = `/api/procurement-rfqs/${params.rfqId}/vendors/${params.vendorId}/comments`;
+ // API 엔드포인트 구성 - techSales용으로 변경
+ const url = `/api/tech-sales-rfqs/${params.rfqId}/vendors/${params.vendorId}/comments`;
// API 호출
const response = await fetch(url, {
@@ -169,11 +169,11 @@ export function VendorCommunicationDrawer({
setIsLoading(true);
// Server Action을 사용하여 코멘트 데이터 가져오기
- const commentsData = await fetchVendorComments(selectedRfq.id, selectedVendor.vendorId || 0);
+ const commentsData = await fetchTechSalesVendorComments(selectedRfq.id, selectedVendor.vendorId || 0);
setComments(commentsData as Comment[]); // 구체적인 타입으로 캐스팅
// Server Action을 사용하여 읽지 않은 메시지를 읽음 상태로 변경
- await markMessagesAsRead(selectedRfq.id, selectedVendor.vendorId || 0);
+ await markTechSalesMessagesAsRead(selectedRfq.id, selectedVendor.vendorId || 0);
} catch (error) {
console.error("코멘트 로드 오류:", error);
toast.error("메시지를 불러오는 중 오류가 발생했습니다");
@@ -269,15 +269,15 @@ export function VendorCommunicationDrawer({
const renderAttachmentPreviewDialog = () => {
if (!selectedAttachment) return null;
- const isImage = selectedAttachment.fileType.startsWith("image/");
- const isPdf = selectedAttachment.fileType.includes("pdf");
+ const isImage = selectedAttachment.fileType?.startsWith("image/");
+ const isPdf = selectedAttachment.fileType?.includes("pdf");
return (
<Dialog open={previewDialogOpen} onOpenChange={setPreviewDialogOpen}>
<DialogContent className="max-w-3xl">
<DialogHeader>
<DialogTitle className="flex items-center gap-2">
- {getFileIcon(selectedAttachment.fileType)}
+ {getFileIcon(selectedAttachment.fileType || '')}
{selectedAttachment.fileName}
</DialogTitle>
<DialogDescription>
@@ -300,7 +300,7 @@ export function VendorCommunicationDrawer({
/>
) : (
<div className="flex flex-col items-center gap-4 p-8">
- {getFileIcon(selectedAttachment.fileType)}
+ {getFileIcon(selectedAttachment.fileType || '')}
<p className="text-muted-foreground text-sm">미리보기를 지원하지 않는 파일 형식입니다.</p>
<Button
variant="outline"
@@ -398,7 +398,7 @@ export function VendorCommunicationDrawer({
className="flex items-center text-xs gap-2 mb-1 p-1 rounded hover:bg-black/5 cursor-pointer"
onClick={() => handleAttachmentPreview(attachment)}
>
- {getFileIcon(attachment.fileType)}
+ {getFileIcon(attachment.fileType || '')}
<span className="flex-1 truncate">{attachment.fileName}</span>
<span className="text-xs opacity-70">
{formatFileSize(attachment.fileSize)}
diff --git a/lib/techsales-rfq/table/rfq-table-column.tsx b/lib/techsales-rfq/table/rfq-table-column.tsx
index caaa1c97..125e800b 100644
--- a/lib/techsales-rfq/table/rfq-table-column.tsx
+++ b/lib/techsales-rfq/table/rfq-table-column.tsx
@@ -6,10 +6,8 @@ import { formatDate, formatDateTime } from "@/lib/utils"
import { Checkbox } from "@/components/ui/checkbox"
import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"
import { DataTableRowAction } from "@/types/table"
-import { Check, Pencil, X, Info } from "lucide-react"
+import { Info, Paperclip } from "lucide-react"
import { Button } from "@/components/ui/button"
-import { toast } from "sonner"
-import { Input } from "@/components/ui/input"
// 기본적인 RFQ 타입 정의 (rfq-table.tsx 파일과 일치해야 함)
type TechSalesRfq = {
@@ -32,8 +30,8 @@ type TechSalesRfq = {
updatedByName: string
sentBy: number | null
sentByName: string | null
- projectSnapshot: any
- seriesSnapshot: any
+ projectSnapshot: Record<string, unknown>
+ seriesSnapshot: Record<string, unknown>
pspid: string
projNm: string
sector: string
@@ -42,28 +40,22 @@ type TechSalesRfq = {
attachmentCount: number
quotationCount: number
// 나머지 필드는 사용할 때마다 추가
- [key: string]: any
+ [key: string]: unknown
}
+// 프로젝트 상세정보 타입 추가를 위한 확장
+// interface ExtendedDataTableRowAction<TData> extends DataTableRowAction<TData> {
+// type: DataTableRowAction<TData>["type"] | "project-detail"
+// }
+
interface GetColumnsProps {
setRowAction: React.Dispatch<React.SetStateAction<DataTableRowAction<TechSalesRfq> | null>>;
- // 상태와 상태 설정 함수를 props로 받음
- editingCell: EditingCellState | null;
- setEditingCell: (state: EditingCellState | null) => void;
- updateRemark: (rfqId: number, remark: string) => Promise<void>;
-}
-
-export interface EditingCellState {
- rowId: string | number;
- value: string;
+ openAttachmentsSheet: (rfqId: number) => void;
}
-
export function getColumns({
setRowAction,
- editingCell,
- setEditingCell,
- updateRemark,
+ openAttachmentsSheet,
}: GetColumnsProps): ColumnDef<TechSalesRfq>[] {
return [
{
@@ -81,7 +73,7 @@ export function getColumns({
// Then select just this row
row.toggleSelected(true)
// Trigger the same action that was in the "Select" button
- setRowAction({ row, type: "select" })
+ setRowAction({ row, type: "select" as const })
} else {
// Just deselect this row
row.toggleSelected(false)
@@ -142,7 +134,10 @@ export function getColumns({
header: ({ column }) => (
<DataTableColumnHeaderSimple column={column} title="자재명" />
),
- cell: ({ row }) => <div>{row.getValue("itemName")}</div>,
+ cell: ({ row }) => {
+ const itemName = row.getValue("itemName");
+ return <div>{itemName || "자재명 없음"}</div>;
+ },
meta: {
excelHeader: "자재명"
},
@@ -211,6 +206,48 @@ export function getColumns({
size: 80,
},
{
+ id: "attachments",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="첨부파일" />
+ ),
+ cell: ({ row }) => {
+ const rfq = row.original
+ const attachmentCount = rfq.attachmentCount || 0
+
+ const handleClick = () => {
+ openAttachmentsSheet(rfq.id)
+ }
+
+ return (
+ <Button
+ variant="ghost"
+ size="sm"
+ className="relative h-8 w-8 p-0 group"
+ onClick={handleClick}
+ aria-label={
+ attachmentCount > 0 ? `View ${attachmentCount} attachments` : "Add attachments"
+ }
+ >
+ <Paperclip className="h-4 w-4 text-muted-foreground group-hover:text-primary transition-colors" />
+ {attachmentCount > 0 && (
+ <span className="pointer-events-none absolute -top-1 -right-1 inline-flex h-4 min-w-[1rem] items-center justify-center rounded-full bg-primary px-1 text-[0.625rem] font-medium leading-none text-primary-foreground">
+ {attachmentCount}
+ </span>
+ )}
+ <span className="sr-only">
+ {attachmentCount > 0 ? `${attachmentCount} 첨부파일` : "첨부파일 추가"}
+ </span>
+ </Button>
+ )
+ },
+ enableSorting: false,
+ enableResizing: true,
+ size: 80,
+ meta: {
+ excelHeader: "첨부파일"
+ },
+ },
+ {
accessorKey: "rfqSendDate",
header: ({ column }) => (
<DataTableColumnHeaderSimple column={column} title="RFQ 전송일" />
@@ -283,103 +320,6 @@ export function getColumns({
enableResizing: true,
size: 160,
},
- // {
- // accessorKey: "remark",
- // header: ({ column }) => (
- // <DataTableColumnHeaderSimple column={column} title="비고" />
- // ),
- // cell: ({ row }) => {
- // const id = row.original.id;
- // const value = row.getValue("remark") as string;
-
- // const isEditing =
- // editingCell?.rowId === row.id &&
- // editingCell.value !== undefined;
-
- // const startEditing = () => {
- // setEditingCell({
- // rowId: row.id,
- // value: value || ""
- // });
- // };
-
- // const cancelEditing = () => {
- // setEditingCell(null);
- // };
-
- // const saveChanges = async () => {
- // if (!editingCell) return;
-
- // try {
- // await updateRemark(id, editingCell.value);
- // setEditingCell(null);
- // } catch (error) {
- // toast.error("비고 업데이트 중 오류가 발생했습니다.");
- // console.error("Error updating remark:", error);
- // }
- // };
-
- // const handleKeyDown = (e: React.KeyboardEvent) => {
- // if (e.key === "Enter") {
- // saveChanges();
- // } else if (e.key === "Escape") {
- // cancelEditing();
- // }
- // };
-
- // if (isEditing) {
- // return (
- // <div className="flex items-center gap-1">
- // <Input
- // value={editingCell?.value || ""}
- // onChange={(e) => setEditingCell({
- // rowId: row.id,
- // value: e.target.value
- // })}
- // onKeyDown={handleKeyDown}
- // autoFocus
- // className="h-8 w-full"
- // />
- // <Button
- // variant="ghost"
- // size="icon"
- // onClick={saveChanges}
- // className="h-8 w-8"
- // >
- // <Check className="h-4 w-4" />
- // </Button>
- // <Button
- // variant="ghost"
- // size="icon"
- // onClick={cancelEditing}
- // className="h-8 w-8"
- // >
- // <X className="h-4 w-4" />
- // </Button>
- // </div>
- // );
- // }
-
- // return (
- // <div className="flex items-center gap-1 group">
- // <span className="truncate">{value || ""}</span>
- // <Button
- // variant="ghost"
- // size="icon"
- // onClick={startEditing}
- // className="h-6 w-6 opacity-0 group-hover:opacity-100 transition-opacity"
- // >
- // <Pencil className="h-3 w-3" />
- // </Button>
- // </div>
- // );
- // },
- // meta: {
- // excelHeader: "비고"
- // },
- // enableResizing: true,
- // size: 200,
- // },
{
id: "actions",
header: ({ column }) => (
@@ -390,7 +330,7 @@ export function getColumns({
<Button
variant="ghost"
size="sm"
- onClick={() => setRowAction({ row, type: "project-detail" })}
+ onClick={() => setRowAction({ row, type: "view" as const })}
className="h-8 px-2 gap-1"
>
<Info className="h-4 w-4" />
diff --git a/lib/techsales-rfq/table/rfq-table.tsx b/lib/techsales-rfq/table/rfq-table.tsx
index 3139b1a3..496d7901 100644
--- a/lib/techsales-rfq/table/rfq-table.tsx
+++ b/lib/techsales-rfq/table/rfq-table.tsx
@@ -16,11 +16,11 @@ import {
import { useDataTable } from "@/hooks/use-data-table"
import { DataTable } from "@/components/data-table/data-table"
-import { getColumns, EditingCellState } from "./rfq-table-column"
-import { useEffect, useCallback, useMemo } from "react"
+import { getColumns } from "./rfq-table-column"
+import { useEffect, useMemo } from "react"
import { DataTableAdvancedToolbar } from "@/components/data-table/data-table-advanced-toolbar"
import { RFQTableToolbarActions } from "./rfq-table-toolbar-actions"
-import { getTechSalesRfqsWithJoin } from "@/lib/techsales-rfq/service"
+import { getTechSalesRfqsWithJoin, getTechSalesRfqAttachments } from "@/lib/techsales-rfq/service"
import { toast } from "sonner"
import { useTablePresets } from "@/components/data-table/use-table-presets"
import { TablePresetManager } from "@/components/data-table/data-table-preset"
@@ -28,6 +28,7 @@ import { RfqDetailTables } from "./detail-table/rfq-detail-table"
import { cn } from "@/lib/utils"
import { ProjectDetailDialog } from "./project-detail-dialog"
import { RFQFilterSheet } from "./rfq-filter-sheet"
+import { TechSalesRfqAttachmentsSheet, ExistingTechSalesAttachment } from "./tech-sales-rfq-attachments-sheet"
// 기본적인 RFQ 타입 정의 (repository selectTechSalesRfqsWithJoin 반환 타입에 맞춤)
interface TechSalesRfq {
@@ -50,8 +51,8 @@ interface TechSalesRfq {
updatedByName: string
sentBy: number | null
sentByName: string | null
- projectSnapshot: any
- seriesSnapshot: any
+ projectSnapshot: Record<string, unknown>
+ seriesSnapshot: Record<string, unknown>
pspid: string
projNm: string
sector: string
@@ -61,7 +62,7 @@ interface TechSalesRfq {
quotationCount: number
// 필요에 따라 다른 필드들 추가
// eslint-disable-next-line @typescript-eslint/no-explicit-any
- [key: string]: any
+ [key: string]: unknown
}
interface RFQListTableProps {
@@ -87,6 +88,11 @@ export function RFQListTable({
const [isProjectDetailOpen, setIsProjectDetailOpen] = React.useState(false)
const [projectDetailRfq, setProjectDetailRfq] = React.useState<TechSalesRfq | null>(null)
+ // 첨부파일 시트 상태
+ const [attachmentsOpen, setAttachmentsOpen] = React.useState(false)
+ const [selectedRfqForAttachments, setSelectedRfqForAttachments] = React.useState<TechSalesRfq | null>(null)
+ const [attachmentsDefault, setAttachmentsDefault] = React.useState<ExistingTechSalesAttachment[]>([])
+
// 패널 collapse 상태
const [panelHeight, setPanelHeight] = React.useState<number>(55)
@@ -112,7 +118,6 @@ export function RFQListTable({
const tableData = promiseData
const [rowAction, setRowAction] = React.useState<DataTableRowAction<TechSalesRfq> | null>(null)
- const [editingCell, setEditingCell] = React.useState<EditingCellState | null>(null)
// 초기 설정 정의
const initialSettings = React.useMemo(() => ({
@@ -148,20 +153,6 @@ export function RFQListTable({
getCurrentSettings,
} = useTablePresets<TechSalesRfq>('rfq-list-table', initialSettings)
- // 비고 업데이트 함수
- const updateRemark = useCallback(async (rfqId: number, remark: string) => {
- try {
- // 기술영업 RFQ 비고 업데이트 함수 구현 필요
- // const result = await updateTechSalesRfqRemark(rfqId, remark);
- console.log("Update remark for RFQ:", rfqId, "with:", remark);
-
- toast.success("비고가 업데이트되었습니다");
- } catch (error) {
- console.error("비고 업데이트 오류:", error);
- toast.error("업데이트 중 오류가 발생했습니다");
- }
- }, [])
-
// 조회 버튼 클릭 핸들러
const handleSearch = () => {
setIsFilterPanelOpen(false)
@@ -205,7 +196,7 @@ export function RFQListTable({
quotationCount: rfqData.quotationCount,
});
break;
- case "project-detail":
+ case "view":
// 프로젝트 상세정보 다이얼로그 열기
const projectRfqData = rowAction.row.original;
setProjectDetailRfq({
@@ -228,8 +219,8 @@ export function RFQListTable({
updatedByName: projectRfqData.updatedByName,
sentBy: projectRfqData.sentBy,
sentByName: projectRfqData.sentByName,
- projectSnapshot: projectRfqData.projectSnapshot,
- seriesSnapshot: projectRfqData.seriesSnapshot,
+ projectSnapshot: projectRfqData.projectSnapshot || {},
+ seriesSnapshot: projectRfqData.seriesSnapshot || {},
pspid: projectRfqData.pspid,
projNm: projectRfqData.projNm,
sector: projectRfqData.sector,
@@ -251,14 +242,75 @@ export function RFQListTable({
}
}, [rowAction])
+ // 첨부파일 시트 열기 함수
+ const openAttachmentsSheet = React.useCallback(async (rfqId: number) => {
+ try {
+ // 선택된 RFQ 찾기
+ const rfq = tableData?.data?.find(r => r.id === rfqId)
+ if (!rfq) {
+ toast.error("RFQ를 찾을 수 없습니다.")
+ return
+ }
+
+ // 실제 첨부파일 목록 조회 API 호출
+ const result = await getTechSalesRfqAttachments(rfqId)
+
+ if (result.error) {
+ toast.error(result.error)
+ return
+ }
+
+ // API 응답을 ExistingTechSalesAttachment 형식으로 변환
+ const attachments: ExistingTechSalesAttachment[] = result.data.map(att => ({
+ id: att.id,
+ techSalesRfqId: att.techSalesRfqId || rfqId, // null인 경우 rfqId 사용
+ fileName: att.fileName,
+ originalFileName: att.originalFileName,
+ filePath: att.filePath,
+ fileSize: att.fileSize || undefined,
+ fileType: att.fileType || undefined,
+ attachmentType: att.attachmentType as "RFQ_COMMON" | "VENDOR_SPECIFIC",
+ description: att.description || undefined,
+ createdBy: att.createdBy,
+ createdAt: att.createdAt,
+ }))
+
+ setAttachmentsDefault(attachments)
+ setSelectedRfqForAttachments({
+ ...rfq,
+ projectSnapshot: rfq.projectSnapshot || {},
+ seriesSnapshot: rfq.seriesSnapshot || {},
+ })
+ setAttachmentsOpen(true)
+ } catch (error) {
+ console.error("첨부파일 조회 오류:", error)
+ toast.error("첨부파일 조회 중 오류가 발생했습니다.")
+ }
+ }, [tableData?.data])
+
+ // 첨부파일 업데이트 콜백
+ const handleAttachmentsUpdated = React.useCallback((rfqId: number, newAttachmentCount: number) => {
+ // TODO: 실제로는 테이블 데이터를 다시 조회하거나 상태를 업데이트해야 함
+ // 현재는 로그만 출력하고 토스트 메시지로 피드백 제공
+ console.log(`RFQ ${rfqId}의 첨부파일 개수가 ${newAttachmentCount}개로 업데이트됨`)
+
+ // 성공 피드백 (중복되지 않도록 짧은 지연 후 표시)
+ setTimeout(() => {
+ toast.success(`첨부파일 개수가 업데이트되었습니다. (${newAttachmentCount}개)`, {
+ duration: 3000
+ })
+ }, 500)
+
+ // TODO: 나중에 실제 테이블 데이터 업데이트 로직 구현
+ // 예: setTableData() 또는 데이터 재조회
+ }, [])
+
const columns = React.useMemo(
() => getColumns({
setRowAction,
- editingCell,
- setEditingCell,
- updateRemark
+ openAttachmentsSheet
}),
- [editingCell, setEditingCell, updateRemark]
+ [openAttachmentsSheet]
)
// 고급 필터 필드 정의
@@ -519,6 +571,15 @@ export function RFQListTable({
// eslint-disable-next-line @typescript-eslint/no-explicit-any
selectedRfq={projectDetailRfq as any}
/>
+
+ {/* 첨부파일 관리 시트 */}
+ <TechSalesRfqAttachmentsSheet
+ open={attachmentsOpen}
+ onOpenChange={setAttachmentsOpen}
+ defaultAttachments={attachmentsDefault}
+ rfq={selectedRfqForAttachments}
+ onAttachmentsUpdated={handleAttachmentsUpdated}
+ />
</div>
)
} \ No newline at end of file
diff --git a/lib/techsales-rfq/table/tech-sales-rfq-attachments-sheet.tsx b/lib/techsales-rfq/table/tech-sales-rfq-attachments-sheet.tsx
new file mode 100644
index 00000000..ecdf6d81
--- /dev/null
+++ b/lib/techsales-rfq/table/tech-sales-rfq-attachments-sheet.tsx
@@ -0,0 +1,540 @@
+"use client"
+
+import * as React from "react"
+import { z } from "zod"
+import { useForm, useFieldArray } from "react-hook-form"
+import { zodResolver } from "@hookform/resolvers/zod"
+
+import {
+ Sheet,
+ SheetContent,
+ SheetHeader,
+ SheetTitle,
+ SheetDescription,
+ SheetFooter,
+ SheetClose,
+} from "@/components/ui/sheet"
+import { Button } from "@/components/ui/button"
+import {
+ Form,
+ FormControl,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
+ FormDescription
+} from "@/components/ui/form"
+import { Loader, Download, X, Eye, AlertCircle } from "lucide-react"
+import { toast } from "sonner"
+import { Badge } from "@/components/ui/badge"
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
+
+import {
+ Dropzone,
+ DropzoneDescription,
+ DropzoneInput,
+ DropzoneTitle,
+ DropzoneUploadIcon,
+ DropzoneZone,
+} from "@/components/ui/dropzone"
+import {
+ FileList,
+ FileListAction,
+ FileListDescription,
+ FileListHeader,
+ FileListIcon,
+ FileListInfo,
+ FileListItem,
+ FileListName,
+} from "@/components/ui/file-list"
+
+import prettyBytes from "pretty-bytes"
+import { formatDate } from "@/lib/utils"
+import { processTechSalesRfqAttachments, getTechSalesRfqAttachments } from "@/lib/techsales-rfq/service"
+
+const MAX_FILE_SIZE = 6e8 // 600MB
+
+/** 기존 첨부 파일 정보 (techSalesAttachments 테이블 구조) */
+export interface ExistingTechSalesAttachment {
+ id: number
+ techSalesRfqId: number
+ fileName: string
+ originalFileName: string
+ filePath: string
+ fileSize?: number
+ fileType?: string
+ attachmentType: "RFQ_COMMON" | "VENDOR_SPECIFIC"
+ description?: string
+ createdBy: number
+ createdAt: Date
+}
+
+/** 새로 업로드할 파일 */
+const newUploadSchema = z.object({
+ fileObj: z.any().optional(), // 실제 File
+ attachmentType: z.enum(["RFQ_COMMON", "VENDOR_SPECIFIC"]).default("RFQ_COMMON"),
+ description: z.string().optional(),
+})
+
+/** 기존 첨부 (react-hook-form에서 관리) */
+const existingAttachSchema = z.object({
+ id: z.number(),
+ techSalesRfqId: z.number(),
+ fileName: z.string(),
+ originalFileName: z.string(),
+ filePath: z.string(),
+ fileSize: z.number().optional(),
+ fileType: z.string().optional(),
+ attachmentType: z.enum(["RFQ_COMMON", "VENDOR_SPECIFIC"]),
+ description: z.string().optional(),
+ createdBy: z.number(),
+ createdAt: z.custom<Date>(),
+})
+
+/** RHF 폼 전체 스키마 */
+const attachmentsFormSchema = z.object({
+ techSalesRfqId: z.number().int(),
+ existing: z.array(existingAttachSchema),
+ newUploads: z.array(newUploadSchema),
+})
+
+type AttachmentsFormValues = z.infer<typeof attachmentsFormSchema>
+
+// TechSalesRfq 타입 (간단 버전)
+interface TechSalesRfq {
+ id: number
+ rfqCode: string | null
+ status: string
+ // 필요한 다른 필드들...
+}
+
+interface TechSalesRfqAttachmentsSheetProps
+ extends React.ComponentPropsWithRef<typeof Sheet> {
+ defaultAttachments?: ExistingTechSalesAttachment[]
+ rfq: TechSalesRfq | null
+ /** 업로드/삭제 후 상위 테이블에 attachmentCount 등을 업데이트하기 위한 콜백 */
+ onAttachmentsUpdated?: (rfqId: number, newAttachmentCount: number) => void
+ /** 강제 읽기 전용 모드 (파트너/벤더용) */
+ readOnly?: boolean
+}
+
+export function TechSalesRfqAttachmentsSheet({
+ defaultAttachments = [],
+ onAttachmentsUpdated,
+ rfq,
+ readOnly = false,
+ ...props
+}: TechSalesRfqAttachmentsSheetProps) {
+ const [isPending, setIsPending] = React.useState(false)
+
+ // RFQ 상태에 따른 편집 가능 여부 결정 (readOnly prop이 true면 항상 false)
+ const isEditable = React.useMemo(() => {
+ if (!rfq || readOnly) return false
+ // RFQ Created, RFQ Vendor Assignned 상태에서만 편집 가능
+ return ["RFQ Created", "RFQ Vendor Assignned"].includes(rfq.status)
+ }, [rfq, readOnly])
+
+ const form = useForm<AttachmentsFormValues>({
+ resolver: zodResolver(attachmentsFormSchema),
+ defaultValues: {
+ techSalesRfqId: rfq?.id || 0,
+ existing: defaultAttachments.map(att => ({
+ id: att.id,
+ techSalesRfqId: att.techSalesRfqId,
+ fileName: att.fileName,
+ originalFileName: att.originalFileName,
+ filePath: att.filePath,
+ fileSize: att.fileSize || undefined,
+ fileType: att.fileType || undefined,
+ attachmentType: att.attachmentType,
+ description: att.description || undefined,
+ createdBy: att.createdBy,
+ createdAt: att.createdAt,
+ })),
+ newUploads: [],
+ },
+ })
+
+ // useFieldArray for existing and new uploads
+ const {
+ fields: existingFields,
+ remove: removeExisting,
+ } = useFieldArray({
+ control: form.control,
+ name: "existing",
+ })
+
+ const {
+ fields: newUploadFields,
+ append: appendNewUpload,
+ remove: removeNewUpload,
+ } = useFieldArray({
+ control: form.control,
+ name: "newUploads",
+ })
+
+ // Reset form when defaultAttachments changes
+ React.useEffect(() => {
+ if (defaultAttachments) {
+ form.reset({
+ techSalesRfqId: rfq?.id || 0,
+ existing: defaultAttachments.map(att => ({
+ id: att.id,
+ techSalesRfqId: att.techSalesRfqId,
+ fileName: att.fileName,
+ originalFileName: att.originalFileName,
+ filePath: att.filePath,
+ fileSize: att.fileSize || undefined,
+ fileType: att.fileType || undefined,
+ attachmentType: att.attachmentType,
+ description: att.description || undefined,
+ createdBy: att.createdBy,
+ createdAt: att.createdAt,
+ })),
+ newUploads: [],
+ })
+ }
+ }, [defaultAttachments, rfq?.id, form])
+
+ // Handle dropzone accept
+ const handleDropAccepted = React.useCallback((acceptedFiles: File[]) => {
+ acceptedFiles.forEach((file) => {
+ appendNewUpload({
+ fileObj: file,
+ attachmentType: "RFQ_COMMON",
+ description: "",
+ })
+ })
+ }, [appendNewUpload])
+
+ // Handle dropzone reject
+ const handleDropRejected = React.useCallback(() => {
+ toast.error("파일 크기가 너무 크거나 지원하지 않는 파일 형식입니다.")
+ }, [])
+
+ // Handle remove existing attachment
+ const handleRemoveExisting = React.useCallback((index: number) => {
+ removeExisting(index)
+ }, [removeExisting])
+
+ // Handle form submission
+ const onSubmit = async (data: AttachmentsFormValues) => {
+ if (!rfq) {
+ toast.error("RFQ 정보를 찾을 수 없습니다.")
+ return
+ }
+
+ setIsPending(true)
+ try {
+ // 삭제할 첨부파일 ID 수집
+ const deleteAttachmentIds = defaultAttachments
+ .filter((original) => !data.existing.find(existing => existing.id === original.id))
+ .map(attachment => attachment.id)
+
+ // 새 파일 정보 수집
+ const newFiles = data.newUploads
+ .filter(upload => upload.fileObj)
+ .map(upload => ({
+ file: upload.fileObj as File,
+ attachmentType: upload.attachmentType,
+ description: upload.description,
+ }))
+
+ // 실제 API 호출
+ const result = await processTechSalesRfqAttachments({
+ techSalesRfqId: rfq.id,
+ newFiles,
+ deleteAttachmentIds,
+ createdBy: 1, // TODO: 실제 사용자 ID로 변경
+ })
+
+ if (result.error) {
+ toast.error(result.error)
+ return
+ }
+
+ // 성공 메시지 표시 (업로드된 파일 수 포함)
+ const uploadedCount = newFiles.length
+ const deletedCount = deleteAttachmentIds.length
+
+ let successMessage = "첨부파일이 저장되었습니다."
+ if (uploadedCount > 0 && deletedCount > 0) {
+ successMessage = `${uploadedCount}개 파일 업로드, ${deletedCount}개 파일 삭제 완료`
+ } else if (uploadedCount > 0) {
+ successMessage = `${uploadedCount}개 파일이 업로드되었습니다.`
+ } else if (deletedCount > 0) {
+ successMessage = `${deletedCount}개 파일이 삭제되었습니다.`
+ }
+
+ toast.success(successMessage)
+
+ // 즉시 첨부파일 목록 새로고침
+ const refreshResult = await getTechSalesRfqAttachments(rfq.id)
+ if (refreshResult.error) {
+ console.error("첨부파일 목록 새로고침 실패:", refreshResult.error)
+ toast.warning("첨부파일 목록 새로고침에 실패했습니다. 시트를 다시 열어주세요.")
+ } else {
+ // 새로운 첨부파일 목록으로 폼 업데이트
+ const refreshedAttachments = refreshResult.data.map(att => ({
+ id: att.id,
+ techSalesRfqId: att.techSalesRfqId || rfq.id,
+ fileName: att.fileName,
+ originalFileName: att.originalFileName,
+ filePath: att.filePath,
+ fileSize: att.fileSize,
+ fileType: att.fileType,
+ attachmentType: att.attachmentType as "RFQ_COMMON" | "VENDOR_SPECIFIC",
+ description: att.description,
+ createdBy: att.createdBy,
+ createdAt: att.createdAt,
+ }))
+
+ // 폼을 새로운 데이터로 리셋 (새 업로드 목록은 비움)
+ form.reset({
+ techSalesRfqId: rfq.id,
+ existing: refreshedAttachments.map(att => ({
+ ...att,
+ fileSize: att.fileSize || undefined,
+ fileType: att.fileType || undefined,
+ description: att.description || undefined,
+ })),
+ newUploads: [],
+ })
+
+ // 즉시 UI 업데이트를 위한 추가 피드백
+ if (uploadedCount > 0) {
+ toast.success("첨부파일 목록이 업데이트되었습니다.", { duration: 2000 })
+ }
+ }
+
+ // 콜백으로 상위 컴포넌트에 변경사항 알림
+ const newAttachmentCount = refreshResult.error ?
+ (data.existing.length + newFiles.length - deleteAttachmentIds.length) :
+ refreshResult.data.length
+ onAttachmentsUpdated?.(rfq.id, newAttachmentCount)
+
+ } catch (error) {
+ console.error("첨부파일 저장 오류:", error)
+ toast.error("첨부파일 저장 중 오류가 발생했습니다.")
+ } finally {
+ setIsPending(false)
+ }
+ }
+
+ return (
+ <Sheet {...props}>
+ <SheetContent className="flex flex-col gap-6 sm:max-w-md">
+ <SheetHeader className="text-left">
+ <SheetTitle>첨부파일 관리</SheetTitle>
+ <SheetDescription>
+ RFQ: {rfq?.rfqCode || "N/A"}
+ {!isEditable && (
+ <div className="mt-2 flex items-center gap-2 text-amber-600">
+ <AlertCircle className="h-4 w-4" />
+ <span className="text-sm">현재 상태에서는 편집할 수 없습니다</span>
+ </div>
+ )}
+ </SheetDescription>
+ </SheetHeader>
+
+ <Form {...form}>
+ <form onSubmit={form.handleSubmit(onSubmit)} className="flex flex-1 flex-col gap-6">
+ {/* 1) Existing attachments */}
+ <div className="grid gap-4">
+ <h6 className="font-semibold leading-none tracking-tight">
+ 기존 첨부파일 ({existingFields.length}개)
+ </h6>
+ {existingFields.map((field, index) => {
+ const typeLabel = field.attachmentType === "RFQ_COMMON" ? "공통" : "벤더별"
+ const sizeText = field.fileSize ? prettyBytes(field.fileSize) : "알 수 없음"
+ const dateText = field.createdAt ? formatDate(field.createdAt) : ""
+
+ return (
+ <div key={field.id} className="flex items-start justify-between p-3 border rounded-md gap-3">
+ <div className="flex-1 min-w-0 overflow-hidden">
+ <div className="flex items-center gap-2 mb-1 flex-wrap">
+ <p className="text-sm font-medium break-words leading-tight">
+ {field.originalFileName || field.fileName}
+ </p>
+ <Badge variant="outline" className="text-xs shrink-0">
+ {typeLabel}
+ </Badge>
+ </div>
+ <p className="text-xs text-muted-foreground">
+ {sizeText} • {dateText}
+ </p>
+ {field.description && (
+ <p className="text-xs text-muted-foreground mt-1 break-words">
+ {field.description}
+ </p>
+ )}
+ </div>
+
+ <div className="flex items-center gap-1 shrink-0">
+ {/* Download button */}
+ {field.filePath && (
+ <a
+ href={`/api/tech-sales-rfq-download?path=${encodeURIComponent(field.filePath)}`}
+ download={field.originalFileName || field.fileName}
+ className="inline-block"
+ >
+ <Button variant="ghost" size="icon" type="button" className="h-8 w-8">
+ <Download className="h-4 w-4" />
+ </Button>
+ </a>
+ )}
+ {/* Remove button - 편집 가능할 때만 표시 */}
+ {isEditable && (
+ <Button
+ type="button"
+ variant="ghost"
+ size="icon"
+ className="h-8 w-8"
+ onClick={() => handleRemoveExisting(index)}
+ >
+ <X className="h-4 w-4" />
+ </Button>
+ )}
+ </div>
+ </div>
+ )
+ })}
+ </div>
+
+ {/* 2) Dropzone for new uploads - 편집 가능할 때만 표시 */}
+ {isEditable ? (
+ <>
+ <Dropzone
+ maxSize={MAX_FILE_SIZE}
+ onDropAccepted={handleDropAccepted}
+ onDropRejected={handleDropRejected}
+ >
+ {({ maxSize }) => (
+ <FormField
+ control={form.control}
+ name="newUploads"
+ render={() => (
+ <FormItem>
+ <FormLabel>새 파일 업로드</FormLabel>
+ <DropzoneZone className="flex justify-center">
+ <FormControl>
+ <DropzoneInput />
+ </FormControl>
+ <div className="flex items-center gap-6">
+ <DropzoneUploadIcon />
+ <div className="grid gap-0.5">
+ <DropzoneTitle>파일을 드래그하거나 클릭하세요</DropzoneTitle>
+ <DropzoneDescription>
+ 최대 크기: {maxSize ? prettyBytes(maxSize) : "600MB"}
+ </DropzoneDescription>
+ </div>
+ </div>
+ </DropzoneZone>
+ <FormDescription>파일을 여러 개 선택할 수 있습니다.</FormDescription>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
+ )}
+ </Dropzone>
+
+ {/* newUpload fields -> FileList */}
+ {newUploadFields.length > 0 && (
+ <div className="grid gap-4">
+ <h6 className="font-semibold leading-none tracking-tight">
+ 새 파일 ({newUploadFields.length}개)
+ </h6>
+ <FileList>
+ {newUploadFields.map((field, idx) => {
+ const fileObj = form.getValues(`newUploads.${idx}.fileObj`)
+ if (!fileObj) return null
+
+ const fileName = fileObj.name
+ const fileSize = fileObj.size
+ return (
+ <FileListItem key={field.id}>
+ <FileListHeader>
+ <FileListIcon />
+ <FileListInfo>
+ <FileListName>{fileName}</FileListName>
+ <FileListDescription>
+ {prettyBytes(fileSize)}
+ </FileListDescription>
+ </FileListInfo>
+ <FileListAction onClick={() => removeNewUpload(idx)}>
+ <X />
+ <span className="sr-only">제거</span>
+ </FileListAction>
+ </FileListHeader>
+
+ {/* 파일별 설정 */}
+ <div className="px-4 pb-3 space-y-3">
+ <FormField
+ control={form.control}
+ name={`newUploads.${idx}.attachmentType`}
+ render={({ field: formField }) => (
+ <FormItem>
+ <FormLabel className="text-xs">파일 타입</FormLabel>
+ <Select onValueChange={formField.onChange} defaultValue={formField.value}>
+ <FormControl>
+ <SelectTrigger className="h-8">
+ <SelectValue placeholder="파일 타입 선택" />
+ </SelectTrigger>
+ </FormControl>
+ <SelectContent>
+ <SelectItem value="RFQ_COMMON">공통 파일</SelectItem>
+ {/* <SelectItem value="VENDOR_SPECIFIC">벤더별 파일</SelectItem> */}
+ </SelectContent>
+ </Select>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
+ </div>
+ </FileListItem>
+ )
+ })}
+ </FileList>
+ </div>
+ )}
+ </>
+ ) : (
+ <div className="p-3 bg-muted rounded-md flex items-center justify-center">
+ <div className="text-center text-sm text-muted-foreground">
+ <Eye className="h-4 w-4 mx-auto mb-2" />
+ <p>보기 모드에서는 파일 첨부를 할 수 없습니다.</p>
+ </div>
+ </div>
+ )}
+
+ <SheetFooter className="gap-2 pt-2 sm:space-x-0">
+ <SheetClose asChild>
+ <Button type="button" variant="outline">
+ {isEditable ? "취소" : "닫기"}
+ </Button>
+ </SheetClose>
+ {isEditable && (
+ <Button
+ type="submit"
+ disabled={
+ isPending ||
+ (
+ form.getValues().newUploads.length === 0 &&
+ form.getValues().existing.length === defaultAttachments.length &&
+ form.getValues().existing.every(existing =>
+ defaultAttachments.some(original => original.id === existing.id)
+ )
+ )
+ }
+ >
+ {isPending && <Loader className="mr-2 h-4 w-4 animate-spin" />}
+ {isPending ? "저장 중..." : "저장"}
+ </Button>
+ )}
+ </SheetFooter>
+ </form>
+ </Form>
+ </SheetContent>
+ </Sheet>
+ )
+} \ No newline at end of file
generated by cgit v1.2.3 (git 2.39.1) at 2025-12-07 10:51:38 +0000