DriverForm update
This commit is contained in:
@ -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>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user