noah/noahspan-flying
1
0
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects Releases 8 Wiki Activity

Feature/49 add medical certificate to pilot form (#55)

Browse Source 
* adding medical certificate to pilot form

* adding medical certificate to pilot form
This commit was merged in pull request #55.
This commit is contained in:
noahspannbauer
2025-03-01 02:56:36 +00:00
committed by GitHub
parent 99019ddeef
commit 032cd4665f
4 changed files with 100 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
app/src/components/pilotForm/PilotForm.tsx
View File

@@ -1,12 +1,15 @@
import { useEffect, useState } from 'react';
import { useForm, Controller, FormProvider } from 'react-hook-form';
import {
Accordion,
Button,
DatePicker,
Drawer,
Grid,
IconButton,
PeoplePicker,
SaveIcon,
Select,
StateSelect,
TextField,
Typography,
@@ -19,6 +22,7 @@ import { useAccessToken } from '../../hooks/accessToken/UseAcessToken';
import { useIsAuthenticated } from '@azure/msal-react';
import { FormMode } from '../../enums/formMode';
import { Person } from '@microsoft/microsoft-graph-types';
import PilotFormMedical from '../pilotFormMedical/PilotFormMedical';
const PilotForm: React.FC<IPilotFormProps> = ({
pilotId,
@@ -47,7 +51,9 @@ const PilotForm: React.FC<IPilotFormProps> = ({
state: '',
postalCode: '',
email: '',
phone: ''
phone: '',
medicalClass: '',
medicalExpiration: ''
};
const methods = useForm({
defaultValues: defaultValues
@@ -103,6 +109,7 @@ const PilotForm: React.FC<IPilotFormProps> = ({
};
const onSubmit = async (data: unknown) => {
console.log(data)
try {
setIsLoading(true);
@@ -363,6 +370,11 @@ const PilotForm: React.FC<IPilotFormProps> = ({
)}
/>
</Grid>
<Grid size={12}>
<PilotFormMedical
isDisabled={isDisabled}
/>
</Grid>
<Grid display="flex" gap={2} justifyContent="right" size={12}>
<Button
disabled={
@@ -392,6 +404,7 @@ const PilotForm: React.FC<IPilotFormProps> = ({
)}
</Grid>
</Grid>
{/* {pilotId && (
<>
<div className="col-span-1">
@@ -417,69 +430,8 @@ const PilotForm: React.FC<IPilotFormProps> = ({
</div>
</>
)} */}
{/* {pilotId && (
<>
<div className="col-span-4">
<Typography variant="h5">Medical</Typography>
<hr className="my-3" />
</div>
<div className="col-span-1">
<Typography variant="h6">Class</Typography>
</div>
<div className="col-span-3">
<Controller
name="medicalClass"
control={methods.control}
render={({ field }) => {
return (
<Select
labelProps={{
className:
'before:content-none after:content-none'
}}
{...field}
>
<Option key="first" value="First">
First
</Option>
<Option key="second" value="Second">
Second
</Option>
<Option key="third" value="Third">
Third
</Option>
<Option key="basicMed" value="Basic Med">
Basic Med
</Option>
</Select>
);
}}
/>
</div>
<div className="col-span-1">
<Typography variant="h6">Expiration Date</Typography>
</div>
<div className="col-span-3">
<Controller
name="medicalExpiration"
control={methods.control}
render={({ field }) => {
return (
<DatePicker
handleDateChanged={(date: string) => {
methods.setValue('medicalExpiration', date);
}}
inputProps={{
value: field.value
}}
/>
);
}}
/>
</div>
</>
)}
{pilotId && (
{/* {pilotId && (
<>
<div className="col-span-4">
<Typography variant="h5">Certificates</Typography>

77
app/src/components/pilotFormMedical/PilotFormMedical.tsx Normal file
View File

@@ -0,0 +1,77 @@
import { DatePicker, Grid, Select, Typography } from "@noahspan/noahspan-components";
import { Controller, useFormContext } from "react-hook-form"
import { PilotFormMedicalProps } from "./PilotFormMedicalProps.interface";
const PilotFormMedical = ({ isDisabled }: PilotFormMedicalProps) => {
const {
control,
formState: { errors },
setValue
} = useFormContext()
return (
<Grid container spacing={2}>
<Grid size={12}>
<Typography variant="h5">Medical</Typography>
</Grid>
<Grid size={3}>
<Typography variant="h6">Class</Typography>
</Grid>
<Grid size={9}>
<Controller
name="medicalClass"
control={control}
render={({ field: { onChange, value } }) => {
return (
<Select
disabled={isDisabled}
fullWidth
onChange={onChange}
options={
[
{
label: 'First',
value: 'first'
},
{
label: 'Second',
value: 'second'
},
{
label: 'Third',
value: 'third'
},
{
label: 'Basic Med',
value: 'basicMed'
}
]
}
/>
);
}}
/>
</Grid>
<Grid size={3}>
<Typography variant="h6">Expiration</Typography>
</Grid>
<Grid size={9}>
<Controller
name="medicalExpiration"
control={control}
render={({ field: { onChange, value } }) => {
return (
<DatePicker
disabled={isDisabled}
onChange={onChange}
value={value}
/>
);
}}
/>
</Grid>
</Grid>
)
}
export default PilotFormMedical

3
app/src/components/pilotFormMedical/PilotFormMedicalProps.interface.ts Normal file
View File

@@ -0,0 +1,3 @@
export interface PilotFormMedicalProps {
isDisabled: boolean;
}