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
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
|
import { Bidding } from '@/db/schema/bidding'
import { Building2, User, DollarSign, Calendar, FileText } from 'lucide-react'
import { contractTypeLabels, biddingTypeLabels, awardCountLabels } from '@/db/schema/bidding'
import { formatDate } from '@/lib/utils'
interface BiddingInfoHeaderProps {
bidding: Bidding | null
}
export function BiddingInfoHeader({ bidding }: BiddingInfoHeaderProps) {
if (!bidding) {
return (
<div className="bg-white border rounded-lg p-6 mb-6 shadow-sm">
<div className="text-center text-gray-500">입찰 정보를 불러오는 중...</div>
</div>
)
}
return (
<div className="bg-white border rounded-lg p-6 mb-6 shadow-sm">
{/* 4개 섹션을 Grid로 배치 */}
<div className="grid grid-cols-1 lg:grid-cols-4 gap-6">
{/* 1. 프로젝트 및 품목 정보 */}
<div className="w-full space-y-4">
<div className="flex items-center gap-2 text-sm font-semibold text-gray-700 mb-3">
<Building2 className="w-4 h-4" />
<span>기본 정보</span>
</div>
{bidding.projectName && (
<div>
<div className="text-xs text-gray-500 mb-1">프로젝트</div>
<div className="font-medium text-gray-900 text-sm">{bidding.projectName}</div>
</div>
)}
{bidding.itemName && (
<div>
<div className="text-xs text-gray-500 mb-1">품목</div>
<div className="font-medium text-gray-900 text-sm">{bidding.itemName}</div>
</div>
)}
{bidding.prNumber && (
<div>
<div className="text-xs text-gray-500 mb-1">PR No.</div>
<div className="font-mono text-sm font-medium text-gray-900">{bidding.prNumber}</div>
</div>
)}
{bidding.purchasingOrganization && (
<div>
<div className="text-xs text-gray-500 mb-1">구매조직</div>
<div className="font-medium text-gray-900 text-sm">{bidding.purchasingOrganization}</div>
</div>
)}
</div>
{/* 2. 담당자 및 예산 정보 */}
<div className="w-full border-l border-gray-100 pl-6 space-y-4">
<div className="flex items-center gap-2 text-sm font-semibold text-gray-700 mb-3">
<User className="w-4 h-4" />
<span>담당자 정보</span>
</div>
{bidding.bidPicName && (
<div>
<div className="text-xs text-gray-500 mb-1">입찰담당자</div>
<div className="font-medium text-gray-900 text-sm">
{bidding.bidPicName}
{bidding.bidPicCode && (
<span className="ml-2 text-xs text-gray-500">({bidding.bidPicCode})</span>
)}
</div>
</div>
)}
{bidding.supplyPicName && (
<div>
<div className="text-xs text-gray-500 mb-1">조달담당자</div>
<div className="font-medium text-gray-900 text-sm">
{bidding.supplyPicName}
{bidding.supplyPicCode && (
<span className="ml-2 text-xs text-gray-500">({bidding.supplyPicCode})</span>
)}
</div>
</div>
)}
{bidding.budget && (
<div>
<div className="flex items-center gap-1.5 text-xs text-gray-500 mb-1">
<DollarSign className="w-3 h-3" />
<span>예산</span>
</div>
<div className="font-semibold text-gray-900 text-sm">
{new Intl.NumberFormat('ko-KR', {
style: 'currency',
currency: bidding.currency || 'KRW',
minimumFractionDigits: 0,
maximumFractionDigits: 0,
}).format(Number(bidding.budget))}
</div>
</div>
)}
</div>
{/* 3. 계약 정보 */}
<div className="w-full border-l border-gray-100 pl-6 space-y-4">
<div className="flex items-center gap-2 text-sm font-semibold text-gray-700 mb-3">
<FileText className="w-4 h-4" />
<span>계약 정보</span>
</div>
<div className="grid grid-cols-2 gap-3">
<div>
<div className="text-xs text-gray-500 mb-1">계약구분</div>
<div className="font-medium text-sm text-gray-900">{contractTypeLabels[bidding.contractType]}</div>
</div>
<div>
<div className="text-xs text-gray-500 mb-1">입찰유형</div>
<div className="font-medium text-sm text-gray-900">{biddingTypeLabels[bidding.biddingType]}</div>
</div>
<div>
<div className="text-xs text-gray-500 mb-1">낙찰수</div>
<div className="font-medium text-sm text-gray-900">
{bidding.awardCount ? awardCountLabels[bidding.awardCount] : '-'}
</div>
</div>
<div>
<div className="text-xs text-gray-500 mb-1">통화</div>
<div className="font-mono font-medium text-sm text-gray-900">{bidding.currency}</div>
</div>
</div>
{(bidding.contractStartDate || bidding.contractEndDate) && (
<div>
<div className="text-xs text-gray-500 mb-1">계약기간</div>
<div className="font-medium text-sm text-gray-900">
{bidding.contractStartDate && formatDate(bidding.contractStartDate, 'KR')}
{bidding.contractStartDate && bidding.contractEndDate && ' ~ '}
{bidding.contractEndDate && formatDate(bidding.contractEndDate, 'KR')}
</div>
</div>
)}
</div>
{/* 4. 일정 정보 */}
<div className="w-full border-l border-gray-100 pl-6 space-y-4">
<div className="flex items-center gap-2 text-sm font-semibold text-gray-700 mb-3">
<Calendar className="w-4 h-4" />
<span>일정 정보</span>
</div>
{bidding.biddingRegistrationDate && (
<div>
<div className="text-xs text-gray-500 mb-1">입찰등록일</div>
<div className="font-medium text-sm text-gray-900">{formatDate(bidding.biddingRegistrationDate, 'KR')}</div>
</div>
)}
{bidding.preQuoteDate && (
<div>
<div className="text-xs text-gray-500 mb-1">사전견적일</div>
<div className="font-medium text-sm text-gray-900">{formatDate(bidding.preQuoteDate, 'KR')}</div>
</div>
)}
{bidding.submissionStartDate && bidding.submissionEndDate && (
<div>
<div className="text-xs text-gray-500 mb-1">제출기간</div>
<div className="font-medium text-sm text-gray-900">
{formatDate(bidding.submissionStartDate, 'KR')}
<div className="text-xs text-gray-400">~</div>
{formatDate(bidding.submissionEndDate, 'KR')}
</div>
</div>
)}
{bidding.evaluationDate && (
<div>
<div className="text-xs text-gray-500 mb-1">평가일</div>
<div className="font-medium text-sm text-gray-900">{formatDate(bidding.evaluationDate, 'KR')}</div>
</div>
)}
</div>
</div>
</div>
)
}
|
