#135 Полностью реализовал возможность создание множество копий в недельном календаре

planner-api/src/routers/copyTasks.ts

@@ -108,10 +108,11 @@ router.delete('/:dateTimeTaskId',authAuthorOrExecutorOfDateTimeTask, async(req:R
     }
 }
 
-    if (dateTimeTasks.length ===1  ) {
+    if (dateTimeTasks.length === 1  ) {
         if ( authorStatus) {
-            Task.remove(task)
-            return res.send({message:"task delete succesfully"})
+            task.dateTimeTasks = []
+            await task.save()
+            return res.send({message:"copyTask delete succesfully"})
         } else{
             return res.send({message:"not uathorized to delete task"})
         }

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

@@ -49,7 +49,7 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell
                 setTop(40 * Math.ceil((e.nativeEvent.offsetY - 5) / 40 - 1))
             }
         }
-        if (copyTask || copyMode.working) {
+        if (copyTask || copyMode) {
             createCopyTask(dayNumber, parseInt(hours.split(':')[0]), month, year)
         } else {
             createTaskInCellHandler(dayNumber, hours, month, year);

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

+
+import React, { memo} from "react";
+import DeleteIcons from '@mui/icons-material/Delete';
+
+const DeleteIcon = ({onClick}) => {
+  const styles = { width: '20px', cursor: 'pointer', marginLeft: 'auto', marginTop: '5px', marginRight: '5px'}
+  return (
+      <DeleteIcons sx={styles} onClick={onClick}>
+      </DeleteIcons>)
+};
+
+export default memo(DeleteIcon);
\ No newline at end of file

planner-front/src/components/Calendars/WeekCalendar/WeekCalendarBody/CalendarColumnDayWeek/CalendarColumnDayWeek.js

@@ -8,7 +8,7 @@ import { getTasksWithInfoForPosition, getWidthLeftZIndex } from "./Helpers";
 
 
 
-function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat, handleOpen, setCurrentTask, copyTask, setCopyTask, createCopyTask, createTaskInCellHandler, modal, dragTaskHandler, copyMode }) {
+function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat, handleOpen, setCurrentTask, copyTask, setCopyTask, createCopyTask, createTaskInCellHandler, modal, dragTaskHandler, copyMode, deleteTaskHandler }) {
 
   const [columnDaySize, setColumnDaySize] = useState({ width: 0, height: 0 })
 
@@ -62,6 +62,8 @@ function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat
                 step={step}
                 tasksLength={tasksLength}
                 hourFormat={hourFormat}
+                copyModeTask={copyMode.task}
+                deleteTaskHandler={deleteTaskHandler}
               >
               </CalendarWeekTask>
             )
@@ -84,7 +86,7 @@ function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat
             month={month}
             year={year}
             dragTaskHandler={dragTaskHandler}
-            copyMode={copyMode}
+            copyMode={copyMode.working}
           >
           </CalendarStandartCell>
         )

planner-front/src/components/Calendars/WeekCalendar/WeekCalendarBody/CalendarColumnDayWeek/CalendarWeekTask/CalendarWeekTask.js

@@ -2,9 +2,10 @@ import { Box } from "@mui/material"
 import { useEffect, useState, memo, useCallback, useMemo } from "react"
 import { getColorTaskByPriority } from "../../../../../../helpers/CalendarHelpers"
 import CopyIcon from "../../../../UI/CopyIcon/CopyIcon";
+import DeleteIcon from "../../../../UI/DeleteIcon/DeleteIcon";
 
 
-function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen, setCurrentTask, modal, setCopyTask, month, dragTaskHandler, step, hourFormat, tasksLength }) {
+function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen, setCurrentTask, modal, setCopyTask, month, dragTaskHandler, step, hourFormat, tasksLength, copyModeTask, deleteTaskHandler }) {
   const [zIndexStyle, setZIndexStyle] = useState(10)
   const color = useMemo(() => {
     return getColorTaskByPriority(task.priority)
@@ -95,18 +96,19 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen,
     setCopyTask(task)
   }, [task, setCopyTask])
 
-  return (
-    <Box
-      draggable={true}
-      onDragStart={(e) => { dragStartHandler(e, task) }}
-      onDragEnd={(e) => { dragEndHandler(e) }}
-      onDrop={(e) => { dropHandler(e, task) }}
-      onDragOver={(e) => { dragOverHandler(e) }}
-      onDragLeave={(e) => { dragLeaveHandler(e) }}
-      onClick={(e) => { onClickTaskHandler(e, task) }}
-      className='calendar_task_block'
-      sx={styles}>
-      {tasksLength > 2 ? <>
+  const returnTask = useMemo(() => {
+    if (copyModeTask?.id === task?.mainTaskId) {
+      return (<>
+        <span style={{ textOverflow: 'ellipsis', padding: '5px 0 0 5px' }}>
+          {task.title}
+        </span>
+        <DeleteIcon
+          onClick={(e) => { deleteTaskHandler(e, task.id) }}
+        />
+      </>)
+    }
+    if (tasksLength > 2) {
+      return (<>
         <CopyIcon
           tasksLength={tasksLength}
           onClick={(e) => { onClickCopyIconHandler(e) }}
@@ -114,14 +116,31 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen,
         <span style={{ textOverflow: 'ellipsis', padding: '5px 0 0 5px' }}>
           {task.title}
         </span>
-       </>
-        : <>
+      </>)
+    } else {
+      return (<>
         <span style={{ textOverflow: 'ellipsis', padding: '5px 0 0 5px' }}>
           {task.title}
         </span>
         <CopyIcon
           onClick={(e) => { onClickCopyIconHandler(e) }}
-          /> </>}
+        />
+      </>)
+    }
+  }, [tasksLength, task.title, onClickCopyIconHandler, copyModeTask?.id, deleteTaskHandler, task?.id, task?.mainTaskId])
+
+  return (
+    <Box
+      draggable={true}
+      onDragStart={(e) => { dragStartHandler(e, task) }}
+      onDragEnd={(e) => { dragEndHandler(e) }}
+      onDrop={(e) => { dropHandler(e, task) }}
+      onDragOver={(e) => { dragOverHandler(e) }}
+      onDragLeave={(e) => { dragLeaveHandler(e) }}
+      onClick={(e) => { onClickTaskHandler(e, task) }}
+      className='calendar_task_block'
+      sx={styles}>
+      {returnTask}
     </Box>);
 }
 

planner-front/src/components/Calendars/WeekCalendar/WeekCalendarBody/WeekCalendarBody.js

@@ -85,6 +85,7 @@ function WeekCalendarBody({ week, hoursInDay, hourFormat, setHourFormat, date, t
                       createCopyTask={createCopyTask}
                       dragTaskHandler={dragTaskHandler}
                       copyMode={copyMode}
+                      deleteTaskHandler={deleteTaskHandler}
                     />
                   )
                 })}
@@ -110,7 +111,7 @@ function WeekCalendarBody({ week, hoursInDay, hourFormat, setHourFormat, date, t
           project={currentTask.project}
           onChangeCurrentTaskHandler={(e) => { onChangeCurrentTaskHandler(e) }}
           sendNewTaskHandler={() => { sendNewTaskHandler(); handleClose() }}
-          deleteTaskHandler={() => { deleteTaskHandler(currentTask.id); handleClose() }}
+          deleteTaskHandler={(e) => { deleteTaskHandler(e, currentTask.id); handleClose() }}
         />
       </ModalTask>
     </>

planner-front/src/containers/WeekCalendar/WeekCalendar.js

@@ -239,7 +239,7 @@ function WeekCalendar() {
       await dispatch(addCopyCalendarTask(newTask, userId))
       setCopyTask(null)
     }
-  }, [copyTask, dispatch, hoursInDay, userId])
+  }, [copyTask, dispatch, hoursInDay, userId, copyMode.task, copyMode.working, hourFormat])
 
   const dragTaskHandler = useCallback(async (dayNumber, hour, month, year) => {
     const hourDiff = currentTask.infoForCell.endHour - currentTask.infoForCell.startHour
@@ -263,8 +263,10 @@ function WeekCalendar() {
     setCurrentTask({})
   }, [currentTask, dispatch, hoursInDay, userId])
 
-  const deleteTaskHandler = useCallback(async (taskId) => {
-    dispatch(deleteCalendarTask(taskId, userId))
+  const deleteTaskHandler = useCallback(async (e, taskId) => {
+    console.log(e)
+    e.stopPropagation();
+    await dispatch(deleteCalendarTask(taskId, userId))
   }, [dispatch, userId])
 
   const handleClose = useCallback(() => {
@@ -287,7 +289,7 @@ function WeekCalendar() {
 
   const copyModeReturn = useCallback(async () => {
     navigate('/my-tasks')
-  }, [dispatch])
+  }, [navigate])
 
   return (
     <>