1 files changed, 79 insertions, 0 deletions
diff --git a/lib/tech-vendor-rfq-response/vendor-cbe-table/rfq-detail-dialog.tsx b/lib/tech-vendor-rfq-response/vendor-cbe-table/rfq-detail-dialog.tsx
new file mode 100644
index 00000000..a6ec6072
--- /dev/null
+++ b/lib/tech-vendor-rfq-response/vendor-cbe-table/rfq-detail-dialog.tsx
@@ -0,0 +1,79 @@
+"use client"
+
+import * as React from "react"
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog"
+import { Badge } from "@/components/ui/badge"
+import { VendorWithCbeFields } from "@/config/vendorCbeColumnsConfig"
+import { RfqItemsTable } from "./rfq-items-table/rfq-items-table"
+import { formatDateTime } from "@/lib/utils"
+import { CalendarClock } from "lucide-react"
+
+interface RfqDeailDialogProps {
+  isOpen: boolean
+  onOpenChange: (open: boolean) => void
+  rfqId: number | null
+  rfq: VendorWithCbeFields | null
+}
+
+export function RfqDeailDialog({
+  isOpen,
+  onOpenChange,
+  rfqId,
+  rfq,
+}: RfqDeailDialogProps) {
+  return (
+    <Dialog open={isOpen} onOpenChange={onOpenChange}>
+      <DialogContent className="max-w-[90wv] sm:max-h-[80vh] overflow-auto" style={{ maxWidth: 1000, height: 480 }}>
+        <DialogHeader>
+          <div className="flex flex-col space-y-2">
+            <DialogTitle>프로젝트: {rfq && rfq.projectName}({rfq && rfq.projectCode}) / RFQ: {rfq && rfq.rfqCode} Detail</DialogTitle>
+            {rfq && (
+              <div className="flex flex-col space-y-3 mt-2">
+                <div className="text-sm text-muted-foreground">
+                  <span className="font-medium text-foreground">{rfq.rfqDescription && rfq.rfqDescription}</span>
+                </div>
+
+                {/* 정보를 두 행으로 나누어 표시 */}
+                <div className="flex flex-col space-y-2 sm:space-y-0 sm:flex-row sm:justify-between sm:items-center">
+                  {/* 첫 번째 행: 상태 배지 */}
+                  <div className="flex items-center flex-wrap gap-2">
+
+
+
+                    {rfq.vendorStatus && (
+                      <Badge variant="outline">
+                        RFQ 상태: {rfq.rfqStatus}
+                      </Badge>
+                    )}
+
+                  </div>
+
+                  {/* 두 번째 행: Due Date를 강조 표시 */}
+                  {rfq.rfqDueDate && (
+                    <div className="flex items-center">
+                      <Badge variant="secondary" className="flex gap-1 text-xs py-1 px-3">
+                        <CalendarClock className="h-3.5 w-3.5" />
+                        <span className="font-semibold">Due Date:</span>
+                        <span>{formatDateTime(rfq.rfqDueDate)}</span>
+                      </Badge>
+                    </div>
+                  )}
+                </div>
+              </div>
+            )}
+          </div>
+        </DialogHeader>
+        {rfqId && (
+          <div className="py-4">
+            <RfqItemsTable rfqId={rfqId} />
+          </div>
+        )}
+      </DialogContent>
+    </Dialog>
+  )
+}
+\ No newline at end of file