Skip to content

Commit 42c0317

Browse files
author
Madalynn Nenninger
committed
#3991 reordered stuff to make it more balanced
1 parent da95268 commit 42c0317

1 file changed

Lines changed: 92 additions & 92 deletions

File tree

‎src/frontend/src/pages/FinancePage/ReimbursementRequestForm/ReimbursementFormView.tsx‎

Lines changed: 92 additions & 92 deletions
Original file line numberDiff line numberDiff line change
@@ -378,67 +378,6 @@ const ReimbursementRequestFormView: React.FC<ReimbursementRequestFormViewProps>
378378
/>
379379
</FormControl>
380380

381-
{/* Date of Expense */}
382-
{(isHead(user.role) || (isEditing && isLeadershipApproved)) && (
383-
<FormControl sx={{ borderRadius: '25px', width: '100%' }}>
384-
<Box style={{ display: 'flex', verticalAlign: 'middle', alignItems: 'center' }}>
385-
<FormLabel
386-
sx={{
387-
color: '#dd524c',
388-
textShadow: '1.5px 0 #dd524c',
389-
letterSpacing: '0.5px',
390-
textDecoration: 'underline',
391-
textUnderlineOffset: '3.5px',
392-
textDecorationThickness: '0.6px',
393-
paddingBottom: '2px',
394-
fontSize: 'x-large',
395-
fontWeight: 'bold'
396-
}}
397-
>
398-
Date of Expense{isLeadershipApproved ? '*' : ''}
399-
</FormLabel>
400-
<Tooltip
401-
title="Reimbursements with Different Purchase Dates Should be on Different Requests. Leave Empty for Not Yet Purchased Items"
402-
placement="right"
403-
>
404-
<HelpIcon style={{ fontSize: 'medium', marginLeft: '5px' }} />
405-
</Tooltip>
406-
</Box>
407-
<Controller
408-
name="dateOfExpense"
409-
control={control}
410-
render={({ field: { onChange, value } }) => (
411-
<DatePicker
412-
value={value}
413-
open={datePickerOpen}
414-
onClose={() => setDatePickerOpen(false)}
415-
onOpen={() => setDatePickerOpen(true)}
416-
onChange={(newValue) => {
417-
onChange(newValue ?? new Date());
418-
}}
419-
slotProps={{
420-
textField: {
421-
error: !!errors.dateOfExpense,
422-
helperText: errors.dateOfExpense?.message,
423-
variant: 'outlined',
424-
fullWidth: true,
425-
size: 'small',
426-
InputProps: {
427-
onClick: (e) => {
428-
const target = e.target as HTMLElement;
429-
if (target.closest('button')) {
430-
setDatePickerOpen(true);
431-
}
432-
}
433-
}
434-
}
435-
}}
436-
/>
437-
)}
438-
/>
439-
</FormControl>
440-
)}
441-
442381
{/* Account Code */}
443382
<FormControl sx={{ borderRadius: '25px', width: '100%' }}>
444383
<FormLabel
@@ -682,6 +621,98 @@ const ReimbursementRequestFormView: React.FC<ReimbursementRequestFormViewProps>
682621
{/* Right Column */}
683622
<Grid item xs={12} md={6}>
684623
<Stack spacing={2}>
624+
{/* Date of Expense */}
625+
{(isHead(user.role) || (isEditing && isLeadershipApproved)) && (
626+
<FormControl sx={{ borderRadius: '25px', width: '100%' }}>
627+
<Box style={{ display: 'flex', verticalAlign: 'middle', alignItems: 'center' }}>
628+
<FormLabel
629+
sx={{
630+
color: '#dd524c',
631+
textShadow: '1.5px 0 #dd524c',
632+
letterSpacing: '0.5px',
633+
textDecoration: 'underline',
634+
textUnderlineOffset: '3.5px',
635+
textDecorationThickness: '0.6px',
636+
paddingBottom: '2px',
637+
fontSize: 'x-large',
638+
fontWeight: 'bold'
639+
}}
640+
>
641+
Date of Expense{isLeadershipApproved ? '*' : ''}
642+
</FormLabel>
643+
<Tooltip
644+
title="Reimbursements with Different Purchase Dates Should be on Different Requests. Leave Empty for Not Yet Purchased Items"
645+
placement="right"
646+
>
647+
<HelpIcon style={{ fontSize: 'medium', marginLeft: '5px' }} />
648+
</Tooltip>
649+
</Box>
650+
<Controller
651+
name="dateOfExpense"
652+
control={control}
653+
render={({ field: { onChange, value } }) => (
654+
<DatePicker
655+
value={value}
656+
open={datePickerOpen}
657+
onClose={() => setDatePickerOpen(false)}
658+
onOpen={() => setDatePickerOpen(true)}
659+
onChange={(newValue) => {
660+
onChange(newValue ?? new Date());
661+
}}
662+
slotProps={{
663+
textField: {
664+
error: !!errors.dateOfExpense,
665+
helperText: errors.dateOfExpense?.message,
666+
variant: 'outlined',
667+
fullWidth: true,
668+
size: 'small',
669+
InputProps: {
670+
onClick: (e) => {
671+
const target = e.target as HTMLElement;
672+
if (target.closest('button')) {
673+
setDatePickerOpen(true);
674+
}
675+
}
676+
}
677+
}
678+
}}
679+
/>
680+
)}
681+
/>
682+
</FormControl>
683+
)}
684+
685+
{/* Description */}
686+
<FormControl sx={{ borderRadius: '25px', width: '100%' }}>
687+
<FormLabel
688+
sx={{
689+
color: '#dd524c',
690+
textShadow: '1.5px 0 #dd524c',
691+
letterSpacing: '0.5px',
692+
textDecoration: 'underline',
693+
textUnderlineOffset: '3.5px',
694+
textDecorationThickness: '0.6px',
695+
fontSize: 'x-large',
696+
fontWeight: 'bold'
697+
}}
698+
>
699+
Description
700+
</FormLabel>
701+
<Controller
702+
name="description"
703+
control={control}
704+
render={({ field: { onChange, value } }) => (
705+
<TextField
706+
value={value || ''}
707+
onChange={onChange}
708+
placeholder="Enter Description"
709+
multiline
710+
rows={3}
711+
/>
712+
)}
713+
/>
714+
</FormControl>
715+
685716
{/* Upload Receipts */}
686717
<FormControl sx={{ display: 'flex', borderRadius: '25px', width: '100%' }}>
687718
<FormLabel
@@ -857,37 +888,6 @@ const ReimbursementRequestFormView: React.FC<ReimbursementRequestFormViewProps>
857888
</Box>
858889
</Box>
859890
</FormControl>
860-
861-
{/* Description */}
862-
<FormControl sx={{ borderRadius: '25px', width: '100%' }}>
863-
<FormLabel
864-
sx={{
865-
color: '#dd524c',
866-
textShadow: '1.5px 0 #dd524c',
867-
letterSpacing: '0.5px',
868-
textDecoration: 'underline',
869-
textUnderlineOffset: '3.5px',
870-
textDecorationThickness: '0.6px',
871-
fontSize: 'x-large',
872-
fontWeight: 'bold'
873-
}}
874-
>
875-
Description
876-
</FormLabel>
877-
<Controller
878-
name="description"
879-
control={control}
880-
render={({ field: { onChange, value } }) => (
881-
<TextField
882-
value={value || ''}
883-
onChange={onChange}
884-
placeholder="Enter Description"
885-
multiline
886-
rows={3}
887-
/>
888-
)}
889-
/>
890-
</FormControl>
891891
</Stack>
892892
</Grid>
893893
</Grid>

0 commit comments

Comments
 (0)