blob: ae5add41b08e19580d7a30146a417195bd46352c (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
|
// lib/tbe-last/table/dialogs/session-detail-dialog.tsx
"use client"
import * as React from "react"
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
DialogDescription
} from "@/components/ui/dialog"
import { Badge } from "@/components/ui/badge"
import { formatDate } from "@/lib/utils"
interface SessionDetailDialogProps {
open: boolean
onOpenChange: (open: boolean) => void
sessionDetail: any
isLoading: boolean
}
export function SessionDetailDialog({
open,
onOpenChange,
sessionDetail,
isLoading
}: SessionDetailDialogProps) {
return (
<Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent className="max-w-4xl max-h-[80vh] overflow-y-auto">
<DialogHeader>
<DialogTitle>TBE Session Detail</DialogTitle>
<DialogDescription>
{sessionDetail?.session?.sessionCode} - {sessionDetail?.session?.vendorName}
</DialogDescription>
</DialogHeader>
{isLoading ? (
<div className="p-8 text-center">Loading...</div>
) : sessionDetail ? (
<div className="space-y-4">
{/* Session info */}
<div className="grid grid-cols-2 gap-4">
<div>
<p className="text-sm font-medium">RFQ Code</p>
<p className="text-sm text-muted-foreground">{sessionDetail.session.rfqCode}</p>
</div>
<div>
<p className="text-sm font-medium">Status</p>
<Badge>{sessionDetail.session.sessionStatus}</Badge>
</div>
<div>
<p className="text-sm font-medium">Project</p>
<p className="text-sm text-muted-foreground">
{sessionDetail.session.projectCode} - {sessionDetail.session.projectName}
</p>
</div>
<div>
<p className="text-sm font-medium">Package</p>
<p className="text-sm text-muted-foreground">
{sessionDetail.session.packageNo} - {sessionDetail.session.packageName}
</p>
</div>
</div>
{/* PR Items */}
{sessionDetail.prItems?.length > 0 && (
<div>
<h3 className="font-medium mb-2">PR Items</h3>
<div className="border rounded-lg">
<table className="w-full text-sm">
<thead>
<tr className="border-b">
<th className="text-left p-2">PR No</th>
<th className="text-left p-2">Material Code</th>
<th className="text-left p-2">Description</th>
<th className="text-left p-2">Qty</th>
<th className="text-left p-2">Delivery</th>
</tr>
</thead>
<tbody>
{sessionDetail.prItems.map((item: any) => (
<tr key={item.id} className="border-b">
<td className="p-2">{item.prNo}</td>
<td className="p-2">{item.materialCode}</td>
<td className="p-2">{item.materialDescription}</td>
<td className="p-2">{item.quantity} {item.uom}</td>
<td className="p-2">
{item.deliveryDate ? formatDate(item.deliveryDate, "KR") : "-"}
</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
)}
</div>
) : null}
</DialogContent>
</Dialog>
)
}
|
