ohctechv3/.svn/pristine/0f/0f38a938aa42c947311077440cbd38cfbc0e6056.svn-base

237 lines
7.3 KiB
Plaintext
Raw Normal View History

2024-10-28 15:03:36 +05:30
import { FormControl, Grid } from "@mui/material";
import PropTypes from "prop-types";
import Input from "../common/Input";
import SingleSelect from "../common/SingleSelect";
//import TextArea from "../TextArea";
const TrainingDetailForm = ({
values,
touched,
handleBlur,
errors,
handleChange,
setFieldValue,
handleSubmit,
modeOptions,
}) => {
TrainingDetailForm.propTypes = {
values: PropTypes.object.isRequired,
touched: PropTypes.object.isRequired,
errors: PropTypes.object.isRequired,
handleBlur: PropTypes.func.isRequired,
handleChange: PropTypes.func.isRequired,
setFieldValue: PropTypes.func.isRequired,
handleSubmit: PropTypes.func.isRequired,
};
const Type = ["online","offline"];
return (
<div style={{ display: "flex", justifyContent: "center" }}>
<form onSubmit={handleSubmit}>
<Grid
container
spacing={2}
justifyContent="center"
alignItems="center"
sx={{ width: 570 }}
>
<Grid item xs={12} justifyContent="center" alignItems="center">
<FormControl fullWidth>
<Grid
container
spacing={2}
justifyContent="center"
alignItems="center"
>
<Grid
item
xs={12}
sm={6}
container
spacing={1}
justifyContent="center"
alignItems="center"
>
<Input
label="Program Name "
name="trainingName"
type="text"
size="large"
value={values.trainingName}
onChange={handleChange}
onBlur={handleBlur}
helperText={
errors.trainingName && touched.trainingName ? (
<span style={{ color: "red" }}>
{errors.trainingName}
</span>
) : null
}
/>
</Grid>
<Grid
item
xs={12}
sm={6}
container
spacing={1}
justifyContent="center"
alignItems="center"
>
<Input
label="Programe Description "
name="description"
type="text"
size="large"
value={values.description}
onChange={handleChange}
onBlur={handleBlur}
helperText={
errors.description && touched.description ? (
<span style={{ color: "red" }}>
{errors.description}
</span>
) : null
}
/>
</Grid>
<Grid
item
xs={12}
sm={6}
container
spacing={1}
justifyContent="center"
alignItems="center"
>
<Input
label="Programe Duration(in Days)"
name="duration"
type="text"
size="large"
value={values.duration}
onChange={handleChange}
onBlur={handleBlur}
helperText={
errors.duration && touched.duration ? (
<span style={{ color: "red" }}>{errors.duration}</span>
) : null
}
/>
</Grid>
<Grid
item
xs={12}
sm={6}
container
spacing={1}
justifyContent="center"
alignItems="center"
>
<SingleSelect
arr={modeOptions}
label="Select Program Mode"
name="modeId"
value={values.modeId}
onChange={(event, newValue) => {
const syntheticEvent = {
target: {
name: "modeId",
value: newValue,
},
};
handleChange(syntheticEvent);
}}
// onChange={handleChange}
onBlur={handleBlur}
type="text"
helperText={
errors.modeId && touched.modeId ? (
<span style={{ color: "red" }}>{errors.modeId}</span>
) : null
}
/>
</Grid>
<Grid
item
xs={12}
sm={6}
container
spacing={1}
justifyContent="center"
alignItems="center"
>
<SingleSelect
arr={Type}
label="Program Type"
name="typeOfTraining"
value={values.typeOfTraining}
onChange={(event, newValue) => {
const syntheticEvent = {
target: {
name: "typeOfTraining",
value: newValue,
},
};
handleChange(syntheticEvent);
}}
onBlur={handleBlur}
type="text"
helperText={
errors.typeOfTraining && touched.typeOfTraining ? (
<span style={{ color: "red" }}>
{errors.typeOfTraining}
</span>
) : null
}
/>
</Grid>
<Grid
item
xs={12}
sm={6}
container
spacing={1}
justifyContent="center"
alignItems="center"
>
<Input
label="Program Key Health Parameters"
name="keyHealthParameterId"
type="text"
size="large"
value={values.keyHealthParameterId}
onChange={handleChange}
onBlur={handleBlur}
helperText={
errors.keyHealthParameterId &&
touched.keyHealthParameterId ? (
<span style={{ color: "red" }}>
{errors.keyHealthParameterId}
</span>
) : null
}
/>
</Grid>
</Grid>
</FormControl>
</Grid>
</Grid>
</form>
</div>
);
};
export default TrainingDetailForm;