DriverForm update

This commit is contained in:

View File

@ -6,6 +6,7 @@ import {
Table,
ActionIcon,
Modal,
Checkbox,
} from "@mantine/core";
import { DateInput } from "@mantine/dates";
import { useForm } from "@mantine/form";
@ -41,10 +42,10 @@ const DriverForm = () => {
const driverForm = useForm({
initialValues: {
fullname: "Попов Спиридон Семенович",
snils: "11122233344",
fullname: "",
snils: "",
birthday: null,
iin: "123456789123",
iin: "",
},
});
@ -166,6 +167,52 @@ const DriverForm = () => {
return new Date(year, month - 1, day); // Month is 0-indexed in Date
}
const Driver = ({ driver }: { driver: any }) => {
const [opened, setOpened] = useState(false)
return (
<>
<Table.Tr onClick={() => setOpened(!opened)}>
<Table.Td>{driver.fullname}</Table.Td>
<Table.Td>{driver.snils}</Table.Td>
<Table.Td>{driver.birthday}</Table.Td>
<Table.Td>{driver.iin}</Table.Td>
<Table.Td>
<ActionIcon color="blue" onClick={() => handleEditDriver(driver)} style={{ marginRight: "10px" }}>
<IconEdit />
</ActionIcon>
<ActionIcon color="red" onClick={() => handleDeleteDriver(driver.id)}>
<IconTrash />
</ActionIcon>
</Table.Td>
</Table.Tr>
{driver.license && Array.isArray(driver.license) && driver.license.map(dr => (
<Table.Tr>
<Table.Td>{dr}</Table.Td>
</Table.Tr>
))}
</>
)
return (
<Table.Tr onClick={() => setOpened(!opened)}>
<Table.Td>{driver.fullname}</Table.Td>
<Table.Td>{driver.snils}</Table.Td>
<Table.Td>{driver.birthday}</Table.Td>
<Table.Td>{driver.iin}</Table.Td>
<Table.Td>
<ActionIcon color="blue" onClick={() => handleEditDriver(driver)} style={{ marginRight: "10px" }}>
<IconEdit />
</ActionIcon>
<ActionIcon color="red" onClick={() => handleDeleteDriver(driver.id)}>
<IconTrash />
</ActionIcon>
</Table.Td>
</Table.Tr>
)
}
return (
<div>
<h2>Водители</h2>
@ -182,20 +229,7 @@ const DriverForm = () => {
</Table.Thead>
<Table.Tbody>
{drivers.map((driver) => (
<Table.Tr key={driver.id}>
<Table.Td>{driver.fullname}</Table.Td>
<Table.Td>{driver.snils}</Table.Td>
<Table.Td>{driver.birthday}</Table.Td>
<Table.Td>{driver.iin}</Table.Td>
<Table.Td>
<ActionIcon color="blue" onClick={() => handleEditDriver(driver)} style={{ marginRight: "10px" }}>
<IconEdit />
</ActionIcon>
<ActionIcon color="red" onClick={() => handleDeleteDriver(driver.id)}>
<IconTrash />
</ActionIcon>
</Table.Td>
</Table.Tr>
<Driver key={driver.id} driver={driver} />
))}
</Table.Tbody>
</Table>
@ -233,21 +267,11 @@ const DriverForm = () => {
</Table.Tbody>
</Table>
<Modal opened={modalOpened} onClose={() => setModalOpened(false)} title="Добавить/Редактировать водителя">
<Modal opened={modalOpened} onClose={() => setModalOpened(false)} title="Добавить / Редактировать водителя">
<form onSubmit={driverForm.onSubmit(handleAddDriver)}>
<TextInput label="ФИО" {...driverForm.getInputProps("fullname")} required />
<TextInput label="СНИЛС" {...driverForm.getInputProps("snils")} required />
<TextInput label="ИНН" {...driverForm.getInputProps("iin")} required />
{/* <DateInput
label="Дата рождения"
placeholder="ДД.MM.ГГГГ"
defaultLevel='month'
valueFormat='DD.MM.YYYY'
required
dateParser={parseDDMMYYYY}
locale="ru"
{...driverForm.getInputProps("birthday")}
/> */}
<MaskedDateInput
label="Дата рождения"
required
@ -258,6 +282,26 @@ const DriverForm = () => {
</Button>
</form>
</Modal>
<Modal opened={licenseModalOpened} onClose={() => setLicenseModalOpened(false)} title="Добавить / Редактировать водительские права">
<form onSubmit={licenseForm.onSubmit(handleAddLicense)}>
<TextInput label="Серия и номер" {...licenseForm.getInputProps("series_number")} required />
<MaskedDateInput
label="Дата выдачи"
required
{...licenseForm.getInputProps("form_date")}
/>
<MaskedDateInput
label="Срок действия"
required
{...licenseForm.getInputProps("to_date")}
/>
<Checkbox defaultChecked label="Действующее" {...licenseForm.getInputProps("is_actual")} style={{ marginTop: "10px" }}/>
<Button fullWidth mt="md" type="submit">
Сохранить
</Button>
</form>
</Modal>
</div>
);
};