Skip to content

Commit f71cd3d

Browse files
committed
AYS-283: (wip) good progress, TODO change some css
1 parent 75f6183 commit f71cd3d

File tree

3 files changed

+224
-70
lines changed

3 files changed

+224
-70
lines changed

src/app/(private)/emergency-evacuation-applications/[id]/page.tsx

Lines changed: 199 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import { Permission } from '@/constants/permissions'
2323
import { FormSchema } from '@/modules/emergencyEvacuationApplications/constants/formSchema'
2424
import { EmergencyEvacuationApplication } from '@/modules/emergencyEvacuationApplications/constants/types'
2525
import { getEmergencyEvacuationApplication } from '@/modules/emergencyEvacuationApplications/service'
26+
import { Checkbox } from '@/components/ui/checkbox'
2627

2728
const Page = ({ params }: { params: { slug: string; id: string } }) => {
2829
const { t } = useTranslation()
@@ -118,10 +119,14 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
118119
{...field}
119120
disabled
120121
defaultValue={
121-
emergencyEvacuationApplicationDetails.firstName ??
122-
'' +
123-
emergencyEvacuationApplicationDetails.lastName ??
124-
''
122+
(emergencyEvacuationApplicationDetails.firstName ??
123+
'') +
124+
(emergencyEvacuationApplicationDetails.firstName &&
125+
emergencyEvacuationApplicationDetails.lastName
126+
? ' '
127+
: '') +
128+
(emergencyEvacuationApplicationDetails.lastName ??
129+
'')
125130
}
126131
/>
127132
</FormControl>
@@ -154,48 +159,106 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
154159
)}
155160
/>
156161
{emergencyEvacuationApplicationDetails.isInPerson ? null : (
157-
<FormField
158-
control={control}
159-
name="applicantNameSurname"
160-
render={({ field }) => (
161-
<FormItem className="sm:col-span-1">
162-
<FormLabel>
163-
{t('emergencyEvacuationApplications.applicantNameSurname')}
164-
</FormLabel>
165-
<FormControl>
162+
<>
163+
<FormField
164+
control={control}
165+
name="applicantNameSurname"
166+
render={({ field }) => (
167+
<FormItem className="sm:col-span-1">
168+
<FormLabel>
169+
{t(
170+
'emergencyEvacuationApplications.applicantNameSurname',
171+
)}
172+
</FormLabel>
173+
<FormControl>
174+
<Input
175+
{...field}
176+
disabled
177+
defaultValue={
178+
emergencyEvacuationApplicationDetails.applicantFirstName ??
179+
'' +
180+
emergencyEvacuationApplicationDetails.applicantLastName ??
181+
''
182+
}
183+
/>
184+
</FormControl>
185+
</FormItem>
186+
)}
187+
/>
188+
<FormField
189+
control={control}
190+
name="applicantPhoneNumber"
191+
render={({ field }) => (
192+
<FormItem className="sm:col-span-1">
193+
<FormLabel>
194+
{t(
195+
'emergencyEvacuationApplications.applicantPhoneNumber',
196+
)}
197+
</FormLabel>
198+
<FormControl>
199+
<Input
200+
{...field}
201+
disabled
202+
defaultValue={
203+
emergencyEvacuationApplicationDetails
204+
?.applicantPhoneNumber?.countryCode &&
205+
emergencyEvacuationApplicationDetails
206+
?.applicantPhoneNumber?.lineNumber
207+
? formatPhoneNumber(
208+
emergencyEvacuationApplicationDetails.applicantPhoneNumber,
209+
)
210+
: ''
211+
}
212+
/>
213+
</FormControl>
214+
</FormItem>
215+
)}
216+
/>
217+
</>
218+
)}
219+
<FormField
220+
control={control}
221+
name="sourcecityAndDistrict"
222+
render={({ field }) => (
223+
<FormItem className="sm:col-span-1">
224+
<FormLabel>
225+
{t(
226+
'emergencyEvacuationApplications.sourceCityAndDistrict',
227+
)}
228+
</FormLabel>
229+
<FormControl>
166230
<Input
167231
{...field}
168232
disabled
169233
defaultValue={
170-
emergencyEvacuationApplicationDetails.applicantFirstName ??
171-
'' +
172-
emergencyEvacuationApplicationDetails.applicantLastName ??
173-
''
234+
(emergencyEvacuationApplicationDetails.sourceCity ??
235+
'') +
236+
(emergencyEvacuationApplicationDetails.sourceCity &&
237+
emergencyEvacuationApplicationDetails.sourceDistrict
238+
? ' / '
239+
: '') +
240+
(emergencyEvacuationApplicationDetails.sourceDistrict ??
241+
'')
174242
}
175243
/>
176-
</FormControl>
177-
</FormItem>
178-
)}
179-
/>
180-
)}
181-
182-
183-
{/* GO ON FROM HERE */}
184-
185-
186-
244+
</FormControl>
245+
</FormItem>
246+
)}
247+
/>
187248
<FormField
188249
control={control}
189-
name="createdUser"
250+
name="address"
190251
render={({ field }) => (
191252
<FormItem className="sm:col-span-1">
192-
<FormLabel>{t('applicationCreatedUser')}</FormLabel>
253+
<FormLabel>
254+
{t('emergencyEvacuationApplications.address')}
255+
</FormLabel>
193256
<FormControl>
194257
<Input
195258
{...field}
196259
disabled
197260
defaultValue={
198-
emergencyEvacuationApplicationDetails.createdUser ??
261+
emergencyEvacuationApplicationDetails.address ??
199262
''
200263
}
201264
/>
@@ -205,20 +268,27 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
205268
/>
206269
<FormField
207270
control={control}
208-
name="createDate"
271+
name="targetCityAndDistrict"
209272
render={({ field }) => (
210273
<FormItem className="sm:col-span-1">
211-
<FormLabel>{t('createDate')}</FormLabel>
274+
<FormLabel>
275+
{t(
276+
'emergencyEvacuationApplications.targetCityAndDistrict',
277+
)}
278+
</FormLabel>
212279
<FormControl>
213280
<Input
214281
{...field}
215282
disabled
216283
defaultValue={
217-
emergencyEvacuationApplicationDetails.createdAt
218-
? formatDateTime(
219-
emergencyEvacuationApplicationDetails.createdAt,
220-
)
221-
: ''
284+
(emergencyEvacuationApplicationDetails.targetCity ??
285+
'') +
286+
(emergencyEvacuationApplicationDetails.targetCity &&
287+
emergencyEvacuationApplicationDetails.targetDistrict
288+
? ' / '
289+
: '') +
290+
(emergencyEvacuationApplicationDetails.targetDistrict ??
291+
'')
222292
}
223293
/>
224294
</FormControl>
@@ -227,16 +297,16 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
227297
/>
228298
<FormField
229299
control={control}
230-
name="updatedUser"
300+
name="seatCount"
231301
render={({ field }) => (
232302
<FormItem className="sm:col-span-1">
233-
<FormLabel>{t('updatedUser')}</FormLabel>
303+
<FormLabel>{t('seatingCount')}</FormLabel>
234304
<FormControl>
235305
<Input
236306
{...field}
237307
disabled
238308
defaultValue={
239-
emergencyEvacuationApplicationDetails.updatedUser ??
309+
emergencyEvacuationApplicationDetails.seatingCount ??
240310
''
241311
}
242312
/>
@@ -246,18 +316,64 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
246316
/>
247317
<FormField
248318
control={control}
249-
name="updateDate"
319+
name="isInPerson"
250320
render={({ field }) => (
251321
<FormItem className="sm:col-span-1">
252-
<FormLabel>{t('updateDate')}</FormLabel>
322+
<div className="flex items-center">
323+
<FormLabel className="mr-2">
324+
{t('emergencyEvacuationApplications.isInPerson')}
325+
</FormLabel>
326+
<FormControl>
327+
<Checkbox
328+
{...field}
329+
disabled
330+
checked={
331+
emergencyEvacuationApplicationDetails.isInPerson
332+
}
333+
/>
334+
</FormControl>
335+
</div>
336+
</FormItem>
337+
)}
338+
/>
339+
<FormField
340+
control={control}
341+
name="status"
342+
render={({ field }) => (
343+
<FormItem className="sm:col-span-1">
344+
<FormLabel>
345+
{t('emergencyEvacuationApplications.status')}
346+
</FormLabel>
347+
<FormControl>
348+
<Input
349+
{...field}
350+
disabled
351+
value={
352+
t(
353+
emergencyEvacuationApplicationDetails.status.toLowerCase(),
354+
) ?? ''
355+
}
356+
/>
357+
</FormControl>
358+
</FormItem>
359+
)}
360+
/>
361+
<FormField
362+
control={control}
363+
name="createdAt"
364+
render={({ field }) => (
365+
<FormItem className="sm:col-span-1">
366+
<FormLabel>
367+
{t('emergencyEvacuationApplications.createdAt')}
368+
</FormLabel>
253369
<FormControl>
254370
<Input
255371
{...field}
256372
disabled
257373
defaultValue={
258-
emergencyEvacuationApplicationDetails.updatedAt
374+
emergencyEvacuationApplicationDetails.createdAt
259375
? formatDateTime(
260-
emergencyEvacuationApplicationDetails.updatedAt,
376+
emergencyEvacuationApplicationDetails.createdAt,
261377
)
262378
: ''
263379
}
@@ -266,29 +382,45 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
266382
</FormItem>
267383
)}
268384
/>
269-
</div>
270-
</CardContent>
271-
</Card>
272-
273-
<Card>
274-
<CardHeader>
275-
<CardTitle>{t('userInformation')}</CardTitle>
276-
</CardHeader>
277-
<CardContent>
278-
<div className="grid grid-cols-1 gap-y-6 sm:grid-cols-3 sm:gap-x-6 mb-6">
279385
<FormField
280386
control={control}
281-
name="firstName"
387+
name="anyHandicap"
282388
render={({ field }) => (
283-
<FormItem>
284-
<FormLabel>{t('firstName')}</FormLabel>
389+
<FormItem className="sm:col-span-1">
390+
<div className="flex items-center">
391+
<FormLabel className="mr-2">
392+
{t('emergencyEvacuationApplications.anyHandicap')}
393+
</FormLabel>
394+
<FormControl>
395+
<Checkbox
396+
{...field}
397+
disabled
398+
checked={
399+
emergencyEvacuationApplicationDetails.hasObstaclePersonExist
400+
}
401+
/>
402+
</FormControl>
403+
</div>
404+
</FormItem>
405+
)}
406+
/>
407+
<FormField
408+
control={control}
409+
name="confirmedSeatCount"
410+
render={({ field }) => (
411+
<FormItem className="sm:col-span-1">
412+
<FormLabel>
413+
{t(
414+
'emergencyEvacuationApplications.confirmedSeatCount',
415+
)}
416+
</FormLabel>
285417
<FormControl>
286418
<Input
287419
{...field}
288420
disabled
289421
defaultValue={
290-
emergencyEvacuationApplicationDetails
291-
?.firstName ?? ''
422+
// emergencyEvacuationApplicationDetails.confirmedSeatCount ??
423+
''
292424
}
293425
/>
294426
</FormControl>
@@ -297,26 +429,26 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
297429
/>
298430
<FormField
299431
control={control}
300-
name="lastName"
432+
name="operatorNotes"
301433
render={({ field }) => (
302-
<FormItem>
303-
<FormLabel>{t('lastName')}</FormLabel>
434+
<FormItem className="sm:col-span-1">
435+
<FormLabel>
436+
{t('emergencyEvacuationApplications.notes')}
437+
</FormLabel>
304438
<FormControl>
305439
<Input
306440
{...field}
307441
disabled
308442
defaultValue={
309-
emergencyEvacuationApplicationDetails
310-
?.lastName ?? ''
443+
emergencyEvacuationApplicationDetails.notes ??
444+
''
311445
}
312446
/>
313447
</FormControl>
314448
</FormItem>
315449
)}
316450
/>
317451
</div>
318-
<div className="grid grid-cols-1 gap-y-6 sm:grid-cols-2 sm:gap-x-6">
319-
</div>
320452
</CardContent>
321453
</Card>
322454
</form>

0 commit comments

Comments
 (0)