Commit 1611ef67 authored by Ermolaev Timur's avatar Ermolaev Timur

#66 Небольшие поправки

parent 8b6c5d95
import { Button, FormControl, InputLabel, MenuItem, Select, TextField } from "@mui/material";
import { Button, TextField } from "@mui/material";
import { memo } from "react";
import CustomSelect from '../UI/СustomSelect/СustomSelect'
......@@ -38,8 +38,28 @@ function MonthCalendarModalContent({title, onChangeCurrentTaskHandler, descripti
id={'priority-type'}
items={priorities}
/>
<Button sx={{marginRight: '40px'}} onClick={sendNewTaskHandler}>Сохранить</Button>
<div style={{display: 'flex', gap: '20px', margin: '20px 0'}}>
<TextField
id="task-description-title"
value={title}
label="От"
variant="outlined"
name='title'
onChange={(e)=>{onChangeCurrentTaskHandler(e)}}
/>
<TextField
id="task-description-title"
value={title}
label="До"
variant="outlined"
name='title'
onChange={(e)=>{onChangeCurrentTaskHandler(e)}}
/>
</div>
<div style={{display: 'flex', gap: '20px', margin: '10px 0'}}>
<Button onClick={sendNewTaskHandler}>Сохранить</Button>
<Button onClick={deleteTaskHandler}>Удалить</Button>
</div>
</>);
}
......
import Box from '@mui/material/Box';
import Modal from '@mui/material/Modal';
import { useEffect, useState } from 'react';
import { useEffect, useRef, useState } from 'react';
export default function ModalTask({modal, handleClose, children}) {
......@@ -19,32 +19,35 @@ export default function ModalTask({modal, handleClose, children}) {
useEffect(() => {
window.addEventListener('resize', detectSize)
return () => {
window.removeEventListener('resize', detectSize)
}
}, [windowDimenion])
const modalRef = useRef('')
const getYCordinatesToModal = () => {
if (windowDimenion.winHeight > modal.yClickСordinates + 350) {
if (windowDimenion.winHeight > modal.yClickСordinates + 450) {
return modal.yClickСordinates - modal.yDiv - modal.yDivClick
} else {
return modal.yClickСordinates - modal.yDiv - modal.yDivClick - ((modal.yClickСordinates + 350) - windowDimenion.winHeight) - 10
return modal.yClickСordinates - modal.yDiv - modal.yDivClick - ((modal.yClickСordinates + 450) - windowDimenion.winHeight) - 30
}
}
const getXCordinatesToModal = () => {
if (windowDimenion.winWidth > modal.xClickСordinates + modal.xDiv + 250 + modal.xDivClick) {
if (windowDimenion.winWidth > modal.xClickСordinates + 270 + modal.xDiv) {
return modal.xClickСordinates + modal.xDiv - modal.xDivClick + 10
} else {
return modal.xClickСordinates - modal.xDiv - ((modal.xClickСordinates + 250) - windowDimenion.winWidth) - 120
return modal.xClickСordinates - modal.xDivClick - ((modal.yClickСordinates + 270) - windowDimenion.winHeight)
}
}
const style = {
display: 'flex',
flexDirection: 'column',
position: 'absolute',
top: getYCordinatesToModal(),
left: getXCordinatesToModal(),
width: 250,
height: 350,
width: 270,
height: 450,
bgcolor: 'background.paper',
border: '2px solid #000',
boxShadow: 24,
......@@ -59,7 +62,7 @@ export default function ModalTask({modal, handleClose, children}) {
aria-describedby="modal-modal-description"
BackdropProps={{ style: { backgroundColor: 'rgba(255,255,255, 0)' } }}
>
<Box sx={style}>
<Box sx={style} ref={modalRef}>
{children}
</Box>
</Modal>
......
......@@ -8,7 +8,7 @@ import Select from "@mui/material/Select";
export default function BasicSelect({value,label,name,onChange,task,items}) {
return (
<Box sx={{ minWidth: 60 }}>
<Box sx={{ minWidth: 60, m: 0}}>
<FormControl fullWidth>
<InputLabel id="demo-simple-select-label"></InputLabel>
<Select
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment