From 14f61e24947fb92dd71ec0a7196a6e815f8e66da Mon Sep 17 00:00:00 2001 From: dujinkim Date: Mon, 21 Jul 2025 07:54:26 +0000 Subject: (최겸)기술영업 RFQ 담당자 초대, 요구사항 반영 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../vendor-response/detail/communication-tab.tsx | 416 ++++++++++----------- 1 file changed, 208 insertions(+), 208 deletions(-) (limited to 'lib/techsales-rfq/vendor-response/detail/communication-tab.tsx') diff --git a/lib/techsales-rfq/vendor-response/detail/communication-tab.tsx b/lib/techsales-rfq/vendor-response/detail/communication-tab.tsx index 3f2a5280..5bed179e 100644 --- a/lib/techsales-rfq/vendor-response/detail/communication-tab.tsx +++ b/lib/techsales-rfq/vendor-response/detail/communication-tab.tsx @@ -1,209 +1,209 @@ -"use client" - -import * as React from "react" -import { useState, useEffect } from "react" -import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" -import { Button } from "@/components/ui/button" -import { Badge } from "@/components/ui/badge" -import { ScrollArea } from "@/components/ui/scroll-area" -import { Skeleton } from "@/components/ui/skeleton" -import { MessageSquare, Paperclip } from "lucide-react" -import { fetchTechSalesVendorCommentsClient, TechSalesComment } from "../buyer-communication-drawer" -import { BuyerCommunicationDrawer } from "../buyer-communication-drawer" - -interface CommunicationTabProps { - quotation: { - id: number - rfqId: number - vendorId: number - quotationCode: string | null - rfq: { - id: number - rfqCode: string | null - createdByUser?: { - id: number - name: string | null - email: string | null - } | null - } | null - vendor: { - vendorName: string - } | null - } -} - -export function CommunicationTab({ quotation }: CommunicationTabProps) { - const [comments, setComments] = useState([]); - const [unreadCount, setUnreadCount] = useState(0); - const [loadingComments, setLoadingComments] = useState(false); - const [communicationDrawerOpen, setCommunicationDrawerOpen] = useState(false); - - // 컴포넌트 마운트 시 메시지 미리 로드 - useEffect(() => { - if (quotation) { - loadCommunicationData(); - } - }, [quotation]); - - // 메시지 데이터 로드 함수 - const loadCommunicationData = async () => { - try { - setLoadingComments(true); - const commentsData = await fetchTechSalesVendorCommentsClient(quotation.rfqId, quotation.vendorId); - setComments(commentsData); - - // 읽지 않은 메시지 수 계산 (구매자가 보낸 메시지 중 읽지 않은 것) - const unread = commentsData.filter( - comment => !comment.isVendorComment && !comment.isRead - ).length; - setUnreadCount(unread); - } catch (error) { - console.error("메시지 데이터 로드 오류:", error); - } finally { - setLoadingComments(false); - } - }; - - // 커뮤니케이션 드로어가 닫힐 때 데이터 새로고침 - const handleCommunicationDrawerChange = (open: boolean) => { - setCommunicationDrawerOpen(open); - if (!open) { - loadCommunicationData(); // 드로어가 닫힐 때 데이터 새로고침 - } - }; - - return ( -
- {/* 헤더 */} - - -
- - - 커뮤니케이션 - {unreadCount > 0 && ( - - 새 메시지 {unreadCount} - - )} - - - RFQ {quotation.rfq?.rfqCode || "미할당"}에 대한 구매담당자와의 커뮤니케이션 - -
- - - -
- 구매담당자: {quotation.rfq?.createdByUser?.name || "N/A"} - • - 벤더: {quotation.vendor?.vendorName} -
- - - - {/* 메시지 미리보기 */} - - - 메시지 ({comments.length}) - - - {loadingComments ? ( -
-
- - -
-
- ) : comments.length === 0 ? ( -
-
-
- -
-

아직 메시지가 없습니다

-

- 견적서에 대한 질문이나 의견이 있으신가요? 구매자와 메시지를 주고받으세요. -

- -
-
- ) : ( -
- {/* 최근 메시지 3개 미리보기 */} -
-

최근 메시지

- - {comments.slice(-3).map(comment => ( -
-
- - {comment.isVendorComment - ? '나' - : comment.userName || '구매 담당자'} - - - {new Date(comment.createdAt).toLocaleDateString()} - -
-

{comment.content}

- {comment.attachments.length > 0 && ( -
- - 첨부파일 {comment.attachments.length}개 -
- )} -
- ))} - -
- -
- -
-
- )} - - - - {/* 커뮤니케이션 드로어 */} - -
- ) +"use client" + +import * as React from "react" +import { useState, useEffect } from "react" +import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" +import { Button } from "@/components/ui/button" +import { Badge } from "@/components/ui/badge" +import { ScrollArea } from "@/components/ui/scroll-area" +import { Skeleton } from "@/components/ui/skeleton" +import { MessageSquare, Paperclip } from "lucide-react" +import { fetchTechSalesVendorCommentsClient, TechSalesComment } from "../buyer-communication-drawer" +import { BuyerCommunicationDrawer } from "../buyer-communication-drawer" + +interface CommunicationTabProps { + quotation: { + id: number + rfqId: number + vendorId: number + quotationCode: string | null + rfq: { + id: number + rfqCode: string | null + createdByUser?: { + id: number + name: string | null + email: string | null + } | null + } | null + vendor: { + vendorName: string + } | null + } +} + +export function CommunicationTab({ quotation }: CommunicationTabProps) { + const [comments, setComments] = useState([]); + const [unreadCount, setUnreadCount] = useState(0); + const [loadingComments, setLoadingComments] = useState(false); + const [communicationDrawerOpen, setCommunicationDrawerOpen] = useState(false); + + // 컴포넌트 마운트 시 메시지 미리 로드 + useEffect(() => { + if (quotation) { + loadCommunicationData(); + } + }, [quotation]); + + // 메시지 데이터 로드 함수 + const loadCommunicationData = async () => { + try { + setLoadingComments(true); + const commentsData = await fetchTechSalesVendorCommentsClient(quotation.rfqId, quotation.vendorId); + setComments(commentsData); + + // 읽지 않은 메시지 수 계산 (구매자가 보낸 메시지 중 읽지 않은 것) + const unread = commentsData.filter( + comment => !comment.isVendorComment && !comment.isRead + ).length; + setUnreadCount(unread); + } catch (error) { + console.error("메시지 데이터 로드 오류:", error); + } finally { + setLoadingComments(false); + } + }; + + // 커뮤니케이션 드로어가 닫힐 때 데이터 새로고침 + const handleCommunicationDrawerChange = (open: boolean) => { + setCommunicationDrawerOpen(open); + if (!open) { + loadCommunicationData(); // 드로어가 닫힐 때 데이터 새로고침 + } + }; + + return ( +
+ {/* 헤더 */} + + +
+ + + 커뮤니케이션 + {unreadCount > 0 && ( + + 새 메시지 {unreadCount} + + )} + + + RFQ {quotation.rfq?.rfqCode || "미할당"}에 대한 구매담당자와의 커뮤니케이션 + +
+ + + +
+ 구매담당자: {quotation.rfq?.createdByUser?.name || "N/A"} + • + 벤더: {quotation.vendor?.vendorName} +
+ + + + {/* 메시지 미리보기 */} + + + 메시지 ({comments.length}) + + + {loadingComments ? ( +
+
+ + +
+
+ ) : comments.length === 0 ? ( +
+
+
+ +
+

아직 메시지가 없습니다

+

+ 견적서에 대한 질문이나 의견이 있으신가요? 구매자와 메시지를 주고받으세요. +

+ +
+
+ ) : ( +
+ {/* 최근 메시지 3개 미리보기 */} +
+

최근 메시지

+ + {comments.slice(-3).map(comment => ( +
+
+ + {comment.isVendorComment + ? '나' + : comment.userName || '구매 담당자'} + + + {new Date(comment.createdAt).toLocaleDateString()} + +
+

{comment.content}

+ {comment.attachments.length > 0 && ( +
+ + 첨부파일 {comment.attachments.length}개 +
+ )} +
+ ))} + +
+ +
+ +
+
+ )} + + + + {/* 커뮤니케이션 드로어 */} + +
+ ) } \ No newline at end of file -- cgit v1.2.3