#131 Добавил ховер эффекты

planner-front/src/components/Calendars/MonthCalendar/MonthCalendarBody/CalendarRowDay/CalendarRowDay.js

@@ -87,8 +87,5 @@ const CalendarRowDay = ({ xs, hoursInDay, createTaskInCellHandler, currentTask,
   </>
 };
 
-export default memo(CalendarRowDay, (prevProps, nextProps) => {
-  if (!prevProps.modal) return false
-  if (nextProps.modal) return true
-});
+export default memo(CalendarRowDay);
 

planner-front/src/components/Calendars/MonthCalendar/MonthCalendarBody/CalendarRowDay/EmptyBox/EmptyBox.js

-import { Grid } from "@mui/material";
-import React, { memo, useEffect, useState } from "react";
-import DefaultTask from "../../../../UI/DefaultTask/DefaultTask";
-
-const EmptyBox = ({ hourNumber, handleOpen, dayNumber, xs, dragTaskHandler, modal, createTaskInCellHandler, copyTask, createCopyTask }) => {
-
-  const [isThisCell, setIsThisCell] = useState(false)
-  useEffect(() => {
-    if (!modal) {
-      setIsThisCell(false);
-    }
-  }, [modal])
-
-  const onClickHandler = (e, dayNumber, hour) => {
-    if (copyTask) {
-      createCopyTask(dayNumber, hour)
-    } else {
-      createTaskInCellHandler(dayNumber, hour);
-      setIsThisCell(true);
-      handleOpen(e)
-    }
-  }
-  const dragOverHandler = (e) => {
-    e.preventDefault();
-  }
-
-  const dropHandler = (e) => {
-    e.stopPropagation()
-    e.preventDefault();
-    dragTaskHandler(dayNumber, hourNumber)
-  }
-
-  return (<Grid
-    onDragOver={(e) => { dragOverHandler(e) }}
-    onDrop={(e) => { dropHandler(e) }}
-    onClick={(e) => { onClickHandler(e, dayNumber, hourNumber) }}
-    className='test_empty_box'
-    item xs={xs} sx={{
-      height: '40px',
-      backgroundColor: 'rgb(0,0,0,0)',
-      zIndex: '6',
-      cursor: copyTask ? 'pointer' : 'default'
-    }}>
-    {isThisCell ?
-      <DefaultTask /> : ' '}
-  </Grid>)
-};
-
-export default memo(EmptyBox, (prevProps, nextProps) => {
-  if (!prevProps.modal) return false
-  if (nextProps.modal) return true
-});
\ No newline at end of file

planner-front/src/components/Calendars/MonthCalendar/MonthCalendarBody/CalendarTask/CalendarTask.js

@@ -54,7 +54,7 @@ const CalendarTask = ({ setCurrentTask, handleOpen, task, line, setCopyTask, wid
   const dragLeaveHandler = (e) => {
     e.target.style.boxShadow = 'none'
   }
-  
+
   const dragStartHandler = (e, line, task) => {
     setCurrentTask(task);
   }
@@ -63,6 +63,11 @@ const CalendarTask = ({ setCurrentTask, handleOpen, task, line, setCopyTask, wid
     e.target.style.boxShadow = 'none'
   }
 
+  const onClickCopyIconHandler = (e) => {
+    e.stopPropagation(); 
+    setCopyTask(task)
+  }
+
 
   return (<>
     <Grid
@@ -76,7 +81,7 @@ const CalendarTask = ({ setCurrentTask, handleOpen, task, line, setCopyTask, wid
       <span style={{ maxWidth: '60%', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>
         {task.title}
       </span>
-      <ContentCopyIcon sx={{ width: '20px', cursor: 'pointer', marginLeft: 'auto' }} onClick={(e) => { e.stopPropagation(); setCopyTask(task) }}>
+      <ContentCopyIcon sx={{ width: '20px', cursor: 'pointer', marginLeft: 'auto' }} onClick={(e) => { onClickCopyIconHandler(e) }}>
       </ContentCopyIcon>
 
 

planner-front/src/components/Calendars/UI/CalendarStandartCell/CalendarStandartCell.js

@@ -14,7 +14,7 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell
         borderRight: '1px solid black',
         borderBottom: week ? '1px solid black' : null,
         '&:hover': {
-            cursor: 'pointer',
+            cursor: children ? null :'#d6d2d2',
             background: children ? null :'#d6d2d2'
         },
     }
@@ -27,12 +27,17 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell
 
     const dragOverHandler = (e) => {
         e.preventDefault();
+        e.target.style.background = children ? null :'#d6d2d2'
+    }
+    const dragLeaveHandler = (e) => {
+        e.preventDefault();
+        e.target.style.background =  null
     }
 
     const dropHandler = (e) => {
         e.stopPropagation()
         e.preventDefault();
-        console.log(dayNumber, parseInt(hours.split(':')[0]))
+        e.target.style.background =  null
         dragTaskHandler(dayNumber, parseInt(hours.split(':')[0]), month, year)
     }
 
@@ -52,6 +57,7 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell
             sx={cellClass}
             onClick={(e) => { onClickHandler(e) }}
             onDragOver={(e) => { dragOverHandler(e) }}
+            onDragLeave={(e)=>{dragLeaveHandler(e)}}
             onDrop={(e) => { dropHandler(e) }}
         >
             {children}