28 lines
995 B
React
28 lines
995 B
React
|
import { useState, useEffect } from 'react';
|
||
|
|
import _ from 'lodash';
|
||
|
|
import { useForm } from 'react-hook-form';
|
||
|
|
import DateInput from './components/DateInput';
|
||
|
|
|
||
|
|
const AddBudgetPeriodForm = ({ requestClose }) => {
|
||
|
|
const [tmp, setTmp] = useState(0),
|
||
|
|
{ handleSubmit, register, formState: { errors }, trigger } = useForm({ mode: 'onChange' }),
|
||
|
|
onSubmit = (data) => { console.log(data); requestClose() };
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
trigger();
|
||
|
|
});
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="budget-period-form">
|
||
|
|
<h1>Choose Budget Period</h1>
|
||
|
|
<form onSubmit={handleSubmit(onSubmit)}>
|
||
|
|
<DateInput label='Start Date' fieldName='startDate' required={true} form={{ register, errors }} />
|
||
|
|
<DateInput label='End Date' fieldName='endDate' required={true} form={{ register, errors }} />
|
||
|
|
<button type='submit' disabled={!_.isEmpty(errors)}>Create</button>
|
||
|
|
</form>
|
||
|
|
<button onClick={requestClose}>Cancel</button>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
export default AddBudgetPeriodForm;
|