Commit a495d104 authored by Ermolaev Timur's avatar Ermolaev Timur

Merge branch 'task-113-feature/create_copy_tasks' into 'development'

#113 Пофиксил баги, реализовал копирование задачи

See merge request !91
parents 0b83e0ac d2e218f1
...@@ -5,7 +5,7 @@ import DefaultTask from "../DefaultTask/DefaultTask"; ...@@ -5,7 +5,7 @@ import DefaultTask from "../DefaultTask/DefaultTask";
const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCellHandler, handleOpen, modal, dragTaskHandler, linesInDay, week }) => { const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCellHandler, handleOpen, modal, dragTaskHandler, linesInDay, week, copyTask, createCopyTask, month}) => {
const [isThisCell, setIsThisCell] = useState(false) const [isThisCell, setIsThisCell] = useState(false)
const cellClass = { const cellClass = {
...@@ -30,6 +30,7 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell ...@@ -30,6 +30,7 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell
e.preventDefault(); e.preventDefault();
dragTaskHandler(dayNumber, parseInt(hours.split(':')[0])) dragTaskHandler(dayNumber, parseInt(hours.split(':')[0]))
} }
const onClickHandler = (e) => { const onClickHandler = (e) => {
if (linesInDay?.length) { if (linesInDay?.length) {
createTaskInCellHandler(dayNumber, hours); createTaskInCellHandler(dayNumber, hours);
...@@ -37,9 +38,13 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell ...@@ -37,9 +38,13 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell
handleOpen(e) handleOpen(e)
} }
if (week) { if (week) {
createTaskInCellHandler(dayNumber, hours); if (copyTask) {
setIsThisCell(true); createCopyTask(dayNumber, parseInt(hours.split(':')[0]), month)
handleOpen(e) } else {
createTaskInCellHandler(dayNumber, hours, month);
setIsThisCell(true);
handleOpen(e)
}
} }
} }
...@@ -53,7 +58,7 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell ...@@ -53,7 +58,7 @@ const CalendarStandartCell = ({ children, xs, hours, dayNumber, createTaskInCell
> >
{children} {children}
{isThisCell ? {isThisCell ?
<DefaultTask week={week}/> : null} <DefaultTask week={week} /> : null}
</Grid> </Grid>
</> </>
......
...@@ -8,10 +8,9 @@ import { getTasksWithInfoForPosition, getWidthLeftZIndex } from "./Helpers"; ...@@ -8,10 +8,9 @@ import { getTasksWithInfoForPosition, getWidthLeftZIndex } from "./Helpers";
function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat, handleOpen, setCurrentTask, copyTask, createCopyTask, createTaskInCellHandler, modal }) { function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat, handleOpen, setCurrentTask, copyTask, setCopyTask, createCopyTask, createTaskInCellHandler, modal }) {
const [columnDaySize, setColumnDaySize] = useState({ width: 0, height: 0 }) const [columnDaySize, setColumnDaySize] = useState({ width: 0, height: 0 })
const dayColumnRef = useRef('') const dayColumnRef = useRef('')
useEffect(() => { useEffect(() => {
setColumnDaySize(prev => { return { height: dayColumnRef.current.offsetHeight, width: dayColumnRef.current.offsetWidth } }) setColumnDaySize(prev => { return { height: dayColumnRef.current.offsetHeight, width: dayColumnRef.current.offsetWidth } })
...@@ -54,6 +53,8 @@ function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat ...@@ -54,6 +53,8 @@ function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat
handleOpen={handleOpen} handleOpen={handleOpen}
setCurrentTask={setCurrentTask} setCurrentTask={setCurrentTask}
modal={modal} modal={modal}
month={month}
setCopyTask={setCopyTask}
> >
</CalendarWeekTask> </CalendarWeekTask>
) )
...@@ -71,6 +72,9 @@ function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat ...@@ -71,6 +72,9 @@ function CalendarColumnDayWeek({ hoursInDay, tasks, month, year, day, hourFormat
dayNumber={day} dayNumber={day}
hours={hour} hours={hour}
modal={modal} modal={modal}
copyTask={copyTask}
createCopyTask={createCopyTask}
month={month}
> >
</CalendarStandartCell> </CalendarStandartCell>
) )
......
import { Box } from "@mui/material" import { Box } from "@mui/material"
import { useEffect, useState, memo, useCallback, useMemo } from "react" import { useEffect, useState, memo, useCallback, useMemo } from "react"
import { getColorTaskByPriority } from "../../../../../../helpers/CalendarHelpers" import { getColorTaskByPriority } from "../../../../../../helpers/CalendarHelpers"
import ContentCopyIcon from '@mui/icons-material/ContentCopy';
function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen, setCurrentTask, modal }) { function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen, setCurrentTask, modal, setCopyTask, month }) {
const [zIndexStyle, setZIndexStyle] = useState(10) const [zIndexStyle, setZIndexStyle] = useState(10)
const color = useMemo(() => { const color = useMemo(() => {
return getColorTaskByPriority(task.priority) return getColorTaskByPriority(task.priority)
...@@ -22,7 +23,8 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen, ...@@ -22,7 +23,8 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen,
...task, ...task,
infoForCell: { infoForCell: {
...task.infoForCell, ...task.infoForCell,
endHour: task.infoForCell.endHour + 1 endHour: task.infoForCell.endHour + 1,
month: month
} }
} }
}); });
...@@ -38,6 +40,7 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen, ...@@ -38,6 +40,7 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen,
height: `${height - 1}px`, height: `${height - 1}px`,
width: `${width - 1}px`, width: `${width - 1}px`,
position: 'absolute', position: 'absolute',
display: 'flex',
left: left, left: left,
top: top, top: top,
zIndex: zIndexStyle, zIndex: zIndexStyle,
...@@ -57,6 +60,8 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen, ...@@ -57,6 +60,8 @@ function CalendarWeekTask({ height, width, left, top, task, zIndex, handleOpen,
<span style={{ textOverflow: 'ellipsis', padding: '5px 0 0 5px' }}> <span style={{ textOverflow: 'ellipsis', padding: '5px 0 0 5px' }}>
{task.title} {task.title}
</span> </span>
<ContentCopyIcon sx={{ marginLeft: 'auto', marginTop: '5px'}} onClick={(e) => { e.stopPropagation(); setCopyTask(task) }}>
</ContentCopyIcon>
</Box>); </Box>);
} }
......
...@@ -10,7 +10,7 @@ import HourFormatSwitch from "../../HourFormatSwitch/HourFormatSwitch"; ...@@ -10,7 +10,7 @@ import HourFormatSwitch from "../../HourFormatSwitch/HourFormatSwitch";
import CalendarColumnDayWeek from "./CalendarColumnDayWeek/CalendarColumnDayWeek"; import CalendarColumnDayWeek from "./CalendarColumnDayWeek/CalendarColumnDayWeek";
import { getCurrentWeekDayString, getMonthToDayColumn } from "./Helpers"; import { getCurrentWeekDayString, getMonthToDayColumn } from "./Helpers";
function WeekCalendarBody({ week, hoursInDay, hourFormat, setHourFormat, date, tasks, currentTask, setCurrentTask, onChangeCurrentTaskHandler, deleteTaskHandler, sendNewTaskHandler, createTaskInCellHandler }) { function WeekCalendarBody({ week, hoursInDay, hourFormat, setHourFormat, date, tasks, currentTask, setCurrentTask, onChangeCurrentTaskHandler, deleteTaskHandler, sendNewTaskHandler, createTaskInCellHandler, copyTask, setCopyTask, createCopyTask }) {
const [modal, setModal] = useState({ open: false, y: 0, x: 0, }); const [modal, setModal] = useState({ open: false, y: 0, x: 0, });
const handleOpen = useCallback((e) => { const handleOpen = useCallback((e) => {
setModal({ setModal({
...@@ -79,6 +79,9 @@ function WeekCalendarBody({ week, hoursInDay, hourFormat, setHourFormat, date, t ...@@ -79,6 +79,9 @@ function WeekCalendarBody({ week, hoursInDay, hourFormat, setHourFormat, date, t
handleOpen={handleOpen} handleOpen={handleOpen}
createTaskInCellHandler={createTaskInCellHandler} createTaskInCellHandler={createTaskInCellHandler}
modal={modal.open} modal={modal.open}
copyTask={copyTask}
setCopyTask={setCopyTask}
createCopyTask={createCopyTask}
/> />
) )
})} })}
......
import { useEffect, useCallback, useState, useMemo } from 'react'; import { useEffect, useCallback, useState, useMemo } from 'react';
import { useDispatch, useSelector } from 'react-redux'; import { useDispatch, useSelector } from 'react-redux';
import { useNavigate } from 'react-router-dom';
import CalendarModalWorkerContent from '../../components/Calendars/CalendarModalWorkerContent/CalendarModalWorkerContent'; import CalendarModalWorkerContent from '../../components/Calendars/CalendarModalWorkerContent/CalendarModalWorkerContent';
import MonthCalendarBody from '../../components/Calendars/MonthCalendar/MonthCalendarBody/MonthCalendarBody'; import MonthCalendarBody from '../../components/Calendars/MonthCalendar/MonthCalendarBody/MonthCalendarBody';
import MonthCalendarHeader from '../../components/Calendars/MonthCalendar/MonthCalendarHeader/MonthCalendarHeader'; import MonthCalendarHeader from '../../components/Calendars/MonthCalendar/MonthCalendarHeader/MonthCalendarHeader';
...@@ -245,9 +244,9 @@ function MonthCalendar() { ...@@ -245,9 +244,9 @@ function MonthCalendar() {
const onChangeCalendarUser = useCallback(() => { const onChangeCalendarUser = useCallback(() => {
setModal(false) setModal(false)
dispatch(setUserCalendarId(workerInfo.worker.user.id)) setUserCalendarId(workerInfo.worker.user.id)
setWorkerInfo({ project: '', worker: '' }) setWorkerInfo({ project: '', worker: '' })
}, [dispatch, workerInfo?.worker?.user?.id]) }, [workerInfo?.worker?.user?.id])
return ( return (
<> <>
......
...@@ -4,12 +4,13 @@ import { useDispatch, useSelector } from 'react-redux'; ...@@ -4,12 +4,13 @@ import { useDispatch, useSelector } from 'react-redux';
import WeekCalendarBody from '../../components/Calendars/WeekCalendar/WeekCalendarBody/WeekCalendarBody'; import WeekCalendarBody from '../../components/Calendars/WeekCalendar/WeekCalendarBody/WeekCalendarBody';
import WeekCalendarHeader from '../../components/Calendars/WeekCalendar/WeekCalendarHeader/WeekCalendarHeader'; import WeekCalendarHeader from '../../components/Calendars/WeekCalendar/WeekCalendarHeader/WeekCalendarHeader';
import { getWeekInfoString, getWeekFromCurrentDate, dateToISOLikeButLocal } from '../../helpers/CalendarHelpers'; import { getWeekInfoString, getWeekFromCurrentDate, dateToISOLikeButLocal } from '../../helpers/CalendarHelpers';
import { addCalendarTask, deleteCalendarTask, editCalendarTask, fetchCalendarTasks } from '../../store/actions/tasksActions'; import { addCalendarTask, addCopyCalendarTask, deleteCalendarTask, editCalendarTask, fetchCalendarTasks } from '../../store/actions/tasksActions';
function WeekCalendar() { function WeekCalendar() {
const dispatch = useDispatch(); const dispatch = useDispatch();
const { calendarTasks } = useSelector(state => state.tasks); const { calendarTasks } = useSelector(state => state.tasks);
const [copyTask, setCopyTask] = useState(null)
const user = useSelector(state => state.users?.user); const user = useSelector(state => state.users?.user);
const [dateNow, setDateNow] = useState({ year: '', month: '', currentDay: '' }) const [dateNow, setDateNow] = useState({ year: '', month: '', currentDay: '' })
const [currentTask, setCurrentTask] = useState({ title: '', description: '', priority: null, infoForCell: { startHour: null, endHour: null } }) const [currentTask, setCurrentTask] = useState({ title: '', description: '', priority: null, infoForCell: { startHour: null, endHour: null } })
...@@ -77,7 +78,7 @@ function WeekCalendar() { ...@@ -77,7 +78,7 @@ function WeekCalendar() {
} }
}, []); }, []);
const createTaskInCellHandler = useCallback((dayNumber, dayHour) => { const createTaskInCellHandler = useCallback((dayNumber, dayHour, month) => {
let hour let hour
if (!isNaN(dayHour)) { if (!isNaN(dayHour)) {
hour = dayHour hour = dayHour
...@@ -94,23 +95,25 @@ function WeekCalendar() { ...@@ -94,23 +95,25 @@ function WeekCalendar() {
title: "Задача", title: "Задача",
description: "описание", description: "описание",
priority: null, priority: null,
dateTimeStart: dateToISOLikeButLocal(new Date(dateNow.year, dateNow.month, dayNumber, hour, 0)), dateTimeStart: dateToISOLikeButLocal(new Date(dateNow.year, month, dayNumber, hour, 0)),
dateTimeDue: dateToISOLikeButLocal(new Date(dateNow.year, dateNow.month, dayNumber, hourDue, 59)), dateTimeDue: dateToISOLikeButLocal(new Date(dateNow.year, month, dayNumber, hourDue, 59)),
infoForCell: { infoForCell: {
startHour: hour, startHour: hour,
endHour: hourDue, endHour: hourDue,
startDay: dayNumber startDay: dayNumber,
month: month
} }
} }
setCurrentTask((newTask)) setCurrentTask((newTask))
},[dateNow.month, dateNow.year, hourFormat]) }, [dateNow.month, dateNow.year, hourFormat])
const sendNewTaskHandler = useCallback(async () => { const sendNewTaskHandler = useCallback(async () => {
const timeEndHour = currentTask.infoForCell.endHour const timeEndHour = currentTask.infoForCell.endHour
const timeStartHour = currentTask.infoForCell.startHour const timeStartHour = currentTask.infoForCell.startHour
const month = currentTask.infoForCell.month
const day = currentTask.infoForCell.startDay const day = currentTask.infoForCell.startDay
const due = dateToISOLikeButLocal(new Date(dateNow.year, dateNow.month, day, timeEndHour - 1, 59)) const due = dateToISOLikeButLocal(new Date(dateNow.year, month, day, timeEndHour - 1, 59))
const start = dateToISOLikeButLocal(new Date(dateNow.year, dateNow.month, day, timeStartHour, 0)) const start = dateToISOLikeButLocal(new Date(dateNow.year, month, day, timeStartHour, 0))
if (currentTask.id) { if (currentTask.id) {
const newTask = { const newTask = {
...currentTask, ...currentTask,
...@@ -135,6 +138,28 @@ function WeekCalendar() { ...@@ -135,6 +138,28 @@ function WeekCalendar() {
} }
}, [currentTask, dateNow.month, dateNow.year, dispatch, user.id, userId]) }, [currentTask, dateNow.month, dateNow.year, dispatch, user.id, userId])
const createCopyTask = useCallback(async (dayNumber, hour, month) => {
const hourDiff = copyTask.infoForCell.endHour - copyTask.infoForCell.startHour
const lastHour = hoursInDay[hoursInDay.length - 1].split(':')[0]
let due
if (hour + hourDiff >= lastHour) {
due = dateToISOLikeButLocal(new Date(dateNow.year, month, dayNumber, lastHour, 59))
} else {
due = dateToISOLikeButLocal(new Date(dateNow.year, month, dayNumber, hour + hourDiff, 59))
}
const start = dateToISOLikeButLocal(new Date(dateNow.year, month, dayNumber, hour, 0))
const newTask = {
...copyTask,
dateTimeStart: start,
dateTimeDue: due,
taskId: copyTask.mainTaskId
}
delete newTask.infoForCell
delete newTask.id
await dispatch(addCopyCalendarTask(newTask, userId))
setCopyTask(null)
}, [copyTask, dateNow.month, dateNow.year, dispatch, hoursInDay, userId])
const deleteTaskHandler = useCallback(async (taskId) => { const deleteTaskHandler = useCallback(async (taskId) => {
dispatch(deleteCalendarTask(taskId, userId)) dispatch(deleteCalendarTask(taskId, userId))
},[dispatch, userId]) },[dispatch, userId])
...@@ -159,6 +184,9 @@ function WeekCalendar() { ...@@ -159,6 +184,9 @@ function WeekCalendar() {
setHourFormat={setHourFormat} setHourFormat={setHourFormat}
hoursInDay={hoursInDay} hoursInDay={hoursInDay}
createTaskInCellHandler={createTaskInCellHandler} createTaskInCellHandler={createTaskInCellHandler}
createCopyTask={createCopyTask}
copyTask={copyTask}
setCopyTask={setCopyTask}
/> />
</> </>
); );
......
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