82 lines
2.4 KiB
TypeScript
Executable File
82 lines
2.4 KiB
TypeScript
Executable File
// form
|
|
import { useFormContext, Controller } from 'react-hook-form';
|
|
import * as React from 'react';
|
|
|
|
// @mui
|
|
import { IconButton, TextField, TextFieldProps } from '@mui/material';
|
|
import { DesktopDatePicker, LocalizationProvider, MobileDatePicker } from '@mui/x-date-pickers';
|
|
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
|
|
|
|
import InputAdornment from '@mui/material/InputAdornment';
|
|
import EventIcon from '@mui/icons-material/Event';
|
|
import { fPostFormat } from '../../utils/formatTime';
|
|
|
|
// ----------------------------------------------------------------------
|
|
|
|
interface IProps {
|
|
name: string;
|
|
}
|
|
|
|
export default function RHFDatepicker({ name, ...other }: IProps & TextFieldProps) {
|
|
const { control } = useFormContext();
|
|
|
|
return (
|
|
<Controller
|
|
name={name}
|
|
control={control}
|
|
render={({ field, fieldState: { error } }) => (
|
|
<LocalizationProvider dateAdapter={AdapterDateFns}>
|
|
{/* <MobileDatePicker
|
|
inputFormat="yyyy-MM-dd"
|
|
value={field.value}
|
|
onChange={(value) => {
|
|
field.onChange(fPostFormat(value));
|
|
}}
|
|
renderInput={(field) => (
|
|
<TextField
|
|
{...field}
|
|
fullWidth
|
|
InputProps={{
|
|
endAdornment: (
|
|
<InputAdornment position="end">
|
|
<EventIcon />
|
|
</InputAdornment>
|
|
),
|
|
}}
|
|
error={!!error}
|
|
helperText={error?.message}
|
|
{...other}
|
|
/>
|
|
)}
|
|
/> */}
|
|
{/* <DesktopDatePicker
|
|
value={field.value}
|
|
inputFormat="dd/MM/yyyy"
|
|
onChange={(value) => {
|
|
field.onChange(value)
|
|
}}
|
|
renderInput={(params) => <TextField {...params} fullWidth />}
|
|
/> */}
|
|
|
|
<DesktopDatePicker
|
|
value={field.value}
|
|
inputFormat="dd/MM/yyyy"
|
|
onChange={(value) => {
|
|
field.onChange(value);
|
|
}}
|
|
renderInput={(params) => (
|
|
<TextField
|
|
{...params}
|
|
fullWidth
|
|
error={!!error}
|
|
helperText={error?.message}
|
|
{...other}
|
|
/>
|
|
)}
|
|
/>
|
|
</LocalizationProvider>
|
|
)}
|
|
/>
|
|
);
|
|
}
|