Files
tests/frontend_reactjs/src/components/modals/CreateCompanyModal.tsx
cracklesparkle e3af090119 Build & serve
2024-07-19 16:13:29 +09:00

125 lines
4.0 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { SubmitHandler, useForm } from 'react-hook-form';
import RoleService from '../../services/RoleService';
import { Box, Button, Modal, Select, TextField, Typography } from '@mui/material';
import { ICompany } from '../../interfaces/documents';
import { useCompanies } from '../../hooks/swrHooks';
interface Props {
open: boolean;
setOpen: (state: boolean) => void;
}
const style = {
position: 'absolute',
top: '50%',
left: '50%',
transform: 'translate(-50%, -50%)',
width: 400,
bgcolor: 'background.paper',
boxShadow: 24,
borderRadius: 2,
p: 4,
display: "flex",
flexDirection: "column",
gap: "8px"
}
export default function CreateCompanyModal({
open,
setOpen
}: Props) {
const { companies } = useCompanies()
const { register, handleSubmit, formState: { errors } } = useForm<ICompany>({
defaultValues: {
name: '',
fullname: '',
description: '',
}
})
const onSubmit: SubmitHandler<ICompany> = async (data) => {
try {
await RoleService.createRole(data)
} catch (error) {
console.error(error)
}
}
return (
<Modal
open={open}
onClose={() => setOpen(false)}
aria-labelledby="modal-modal-title"
aria-describedby="modal-modal-description"
>
<form onSubmit={handleSubmit(onSubmit)}>
<Box sx={style}>
<Typography variant="h6" component="h6" gutterBottom>
Создание компании
</Typography>
<TextField
fullWidth
margin="normal"
label="Наименование"
required
{...register('name', { required: 'Наименование обязательно' })}
error={!!errors.name}
helperText={errors.name?.message}
/>
<TextField
fullWidth
margin="normal"
label="Полное наименование"
required
{...register('fullname', { required: 'Полное наименование обязательно' })}
error={!!errors.fullname}
helperText={errors.fullname?.message}
/>
<TextField
fullWidth
margin="normal"
label="Описание"
{...register('description')}
error={!!errors.description}
helperText={errors.description?.message}
/>
{companies}
<Select
label="owner_id"
{...register('owner_id', { required: '' })}
error={!!errors.owner_id}
>
{/* {companies &&
companies.map((item, index) => {
<MenuItem>
{index}
</MenuItem>
})
} */}
</Select>
<Box sx={{
display: "flex",
justifyContent: "space-between",
gap: "8px"
}}>
<Button type="submit" variant="contained" color="primary">
Добавить роль
</Button>
<Button type="button" variant="outlined" color="primary" onClick={() => setOpen(false)}>
Отмена
</Button>
</Box>
</Box>
</form>
</Modal>
)
}