Commit f9ec068f authored by Ermolaev Timur's avatar Ermolaev Timur

#134 исправил кнопку копирования

parent d5fb9f2c
...@@ -11,7 +11,7 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell ...@@ -11,7 +11,7 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell
height: linesInDay?.length ? `${heightCell * linesInDay.length + 5}px` : `${45}px`, height: linesInDay?.length ? `${heightCell * linesInDay.length + 5}px` : `${45}px`,
borderRight: '1px solid black', borderRight: '1px solid black',
borderBottom: week ? '1px solid black' : null, borderBottom: week ? '1px solid black' : null,
transition: '0.3s', transition: week ? '0.3s' : null,
'&:hover': { '&:hover': {
transition: '0.3s', transition: '0.3s',
cursor: children ? null : '#d6d2d2', cursor: children ? null : '#d6d2d2',
......
...@@ -2,9 +2,8 @@ ...@@ -2,9 +2,8 @@
import React, { memo} from "react"; import React, { memo} from "react";
import ContentCopyIcon from '@mui/icons-material/ContentCopy'; import ContentCopyIcon from '@mui/icons-material/ContentCopy';
const styles = { width: '20px', cursor: 'pointer', marginLeft: 'auto' } const CopyIcon = ({onClick, tasksLength}) => {
const CopyIcon = ({onClick}) => { const styles = { width: '20px', cursor: 'pointer', marginLeft: tasksLength > 2 ? '5px' : 'auto', marginTop: tasksLength ? '5px' : 0 }
return ( return (
<ContentCopyIcon sx={styles} onClick={onClick}> <ContentCopyIcon sx={styles} onClick={onClick}>
</ContentCopyIcon>) </ContentCopyIcon>)
......
...@@ -43,6 +43,7 @@ function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat ...@@ -43,6 +43,7 @@ function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat
{boxes.map((task) => { {boxes.map((task) => {
const { width, left, zIndex } = getWidthLeftZIndex(task, columnDaySize.width, i) const { width, left, zIndex } = getWidthLeftZIndex(task, columnDaySize.width, i)
const step = columnDaySize.height / hours.length const step = columnDaySize.height / hours.length
const tasksLength = task.tasksInHour
return ( return (
<CalendarWeekTask <CalendarWeekTask
key={task.task.id} key={task.task.id}
...@@ -59,6 +60,7 @@ function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat ...@@ -59,6 +60,7 @@ function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat
setCopyTask={setCopyTask} setCopyTask={setCopyTask}
dragTaskHandler={dragTaskHandler} dragTaskHandler={dragTaskHandler}
step={step} step={step}
tasksLength={tasksLength}
hourFormat={hourFormat} hourFormat={hourFormat}
> >
</CalendarWeekTask> </CalendarWeekTask>
......
...@@ -4,7 +4,7 @@ import { getColorTaskByPriority } from "../../../../../../helpers/CalendarHelper ...@@ -4,7 +4,7 @@ import { getColorTaskByPriority } from "../../../../../../helpers/CalendarHelper
import CopyIcon from "../../../../UI/CopyIcon/CopyIcon"; import CopyIcon from "../../../../UI/CopyIcon/CopyIcon";
function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen, setCurrentTask, modal, setCopyTask, month, dragTaskHandler, step, hourFormat}) { function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen, setCurrentTask, modal, setCopyTask, month, dragTaskHandler, step, hourFormat, tasksLength }) {
const [zIndexStyle, setZIndexStyle] = useState(10) const [zIndexStyle, setZIndexStyle] = useState(10)
const color = useMemo(() => { const color = useMemo(() => {
return getColorTaskByPriority(task.priority) return getColorTaskByPriority(task.priority)
...@@ -79,9 +79,9 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen, ...@@ -79,9 +79,9 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen,
e.preventDefault(); e.preventDefault();
let hour let hour
if (hourFormat) { if (hourFormat) {
hour = task.infoForCell.startHour + (Math.ceil(e.nativeEvent.offsetY/step)-1) hour = task.infoForCell.startHour + (Math.ceil(e.nativeEvent.offsetY / step) - 1)
} else { } else {
hour = task.infoForCell.startHour + (Math.ceil(e.nativeEvent.offsetY/step)-1 + Math.ceil(e.nativeEvent.offsetY/step)-1) hour = task.infoForCell.startHour + (Math.ceil(e.nativeEvent.offsetY / step) - 1 + Math.ceil(e.nativeEvent.offsetY / step) - 1)
} }
dragTaskHandler(task.infoForCell.startDay, hour, task.infoForCell.startMonth - 1, task.infoForCell.startYear) dragTaskHandler(task.infoForCell.startDay, hour, task.infoForCell.startMonth - 1, task.infoForCell.startYear)
} }
...@@ -90,28 +90,38 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen, ...@@ -90,28 +90,38 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen,
e.preventDefault(); e.preventDefault();
} }
const onClickCopyIconHandler = useCallback((e) => { const onClickCopyIconHandler = useCallback((e) => {
e.stopPropagation(); e.stopPropagation();
setCopyTask(task) setCopyTask(task)
},[task, setCopyTask]) }, [task, setCopyTask])
console.log(tasksLength)
return ( return (
<Box <Box
draggable={true} draggable={true}
onDragStart={(e) => { dragStartHandler(e, task) }} onDragStart={(e) => { dragStartHandler(e, task) }}
onDragEnd={(e) => { dragEndHandler(e) }} onDragEnd={(e) => { dragEndHandler(e) }}
onDrop={(e) => { dropHandler(e, task) }} onDrop={(e) => { dropHandler(e, task) }}
onDragOver ={(e) => { dragOverHandler(e) }} onDragOver={(e) => { dragOverHandler(e) }}
onDragLeave={(e) => { dragLeaveHandler(e) }} onDragLeave={(e) => { dragLeaveHandler(e) }}
onClick={(e) => { onClickTaskHandler(e, task) }} onClick={(e) => { onClickTaskHandler(e, task) }}
className='calendar_task_block' className='calendar_task_block'
sx={styles}> sx={styles}>
<span style={{ textOverflow: 'ellipsis', padding: '5px 0 0 5px' }}> {tasksLength > 2 ? <>
{task.title} <CopyIcon
</span> tasksLength={tasksLength}
<CopyIcon onClick={(e) => { onClickCopyIconHandler(e) }}
onClick={(e) => { onClickCopyIconHandler(e)}} />
/> <span style={{ textOverflow: 'ellipsis', padding: '5px 0 0 5px' }}>
{task.title}
</span>
</>
: <>
<span style={{ textOverflow: 'ellipsis', padding: '5px 0 0 5px' }}>
{task.title}
</span>
<CopyIcon
onClick={(e) => { onClickCopyIconHandler(e) }}
/> </>}
</Box>); </Box>);
} }
......
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