Commit cce9a6c8 authored by Ermolaev Timur's avatar Ermolaev Timur

#28 реализовал создание таска через бекенд

parent 6a7323c0
......@@ -36,9 +36,9 @@ import {
description!: string
@CreateDateColumn({ name: 'created_at', type: Date, default: new Date() })
createdAt!: Date;
@Column({ name: 'dateTimeStart', type: Date,nullable: true })
@Column({ name: 'dateTimeStart', type: 'varchar',nullable: true })
dateTimeStart!: Date | null;
@Column({ name: 'dateTimeDue', type: Date,nullable: true })
@Column({ name: 'dateTimeDue', type: 'varchar',nullable: true })
dateTimeDue!: Date | null;
@Column({
type: "enum",
......
import { Grid, TextField } from "@mui/material";
import { useEffect, useState } from "react";
import { useDispatch } from "react-redux";
import { setNewTasksForCells } from "../../store/actions/tasksActions";
function MonthCalendarBody({month, year, tasks, createTaskInCellHandler}) {
function MonthCalendarBody({month, year, tasks, createTaskInCellHandler, onChangeCellTaskTitle, setCurrentTask}) {
const [hoursInDay, setHoursInDay] = useState(['8:00', '10:00', '12:00', '14:00', '16:00', '18:00', '20:00', '22:00', '6:00'])
const [daysInMonth, setDaysInMonth] = useState([])
......@@ -38,7 +36,7 @@ function MonthCalendarBody({month, year, tasks, createTaskInCellHandler}) {
if (year === task.infoForCell.startYear) {
if (month + 1 === task.infoForCell.startMonth) {
if (day.dayNumber === task.infoForCell.startDay && task.infoForCell.startDayOfWeek === day.dayOfWeek ) {
if ((task.infoForCell.endHour <= parseInt(hours.split(':')[0]) || task.infoForCell.startHour <= parseInt(hours.split(':')[0])) && (task.infoForCell.endHour >= parseInt(hours.split(':')[0]))) {
if ((task.infoForCell.endHour <= parseInt(hours.split(':')[0]) || task.infoForCell.startHour <= parseInt(hours.split(':')[0])) && (task.infoForCell.endHour > parseInt(hours.split(':')[0]))) {
return task
}
}
......@@ -48,19 +46,6 @@ function MonthCalendarBody({month, year, tasks, createTaskInCellHandler}) {
return task
}
const onChangeCellTaskTitle = (e, task) => {
const value = e.target.value;
const name = e.target.name;
const { id } = task;
const newTasks = tasks.map(task => {
if (task.id === id) {
return { ...task, [name]: value };
}
return task;
});
setNewTasksForCells(newTasks)
}
return (
<>
<Grid
......@@ -103,7 +88,7 @@ function MonthCalendarBody({month, year, tasks, createTaskInCellHandler}) {
key={i}
item xs={1.2222}
sx={{borderRight: '1px solid black'}}
onClick={()=>{createTaskInCellHandler(day.dayOfWeek, day.dayNumber, hours)}}>
onClick={()=>{createTaskInCellHandler(day.dayNumber, hours)}}>
{ task ?
<Grid key={i} sx={{backgroundColor: 'lightgreen'}}>
<TextField
......@@ -111,7 +96,8 @@ function MonthCalendarBody({month, year, tasks, createTaskInCellHandler}) {
variant="standard"
value={task.title}
name='title'
onChange={(e)=>{onChangeCellTaskTitle(e, task)}}></TextField>
onClick={(e)=>{e.stopPropagation(); setCurrentTask(task)}}
onChange={(e)=>{onChangeCellTaskTitle(e)}}></TextField>
</Grid> : null}
</Grid>
)
......
import { Container } from '@mui/material';
import moment from 'moment';
import { useEffect, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import MonthCalendarBody from '../../components/MonthCalendarBody/MonthCalendarBody';
import MonthCalendarHeader from '../../components/MonthCalendarHeader/MonthCalendarHeader';
import { fetchTasks} from '../../store/actions/tasksActions';
import { addTask, fetchTasks} from '../../store/actions/tasksActions';
function MonthCalendar() {
const dispatch = useDispatch();
......@@ -13,13 +14,14 @@ function MonthCalendar() {
const [year, setYear] = useState('')
const [worker, setWorker] = useState('');
const [calendarType, setCalendarType] = useState('Месяц');
const [currentTask, setCurrentTask] = useState({})
useEffect(()=>{
setMonth(new Date().getMonth())
setYear(new Date().getFullYear())
dispatch(fetchTasks())
}, [dispatch])
console.log(tasks)
const onChangeWorkerHandler = (event) => {
setWorker(event.target.value);
};
......@@ -52,24 +54,29 @@ function MonthCalendar() {
})
}
const createTaskInCellHandler = (dayOfWeek, dayNumber, dayHour) => {
// const newTasks = [...tasksForCell]
// const newTask = {
// id: Date.now(),
// user:"first",
// title:"Новая",
// description:"описание задачи11111",
// priority:"A",
// author:"Ivan",
// executor:"Arman",
// dateTimeStart:`${dayNumber}.${month+1}.${year} ${parseInt(dayHour.split(':')[0])}:00:00`,
// dateTimeDue:`${dayNumber}.${month+1}.${year} ${parseInt(dayHour.split(':')[0]) + 1}:00:00`,
// }
// newTasks.push(newTask)
// exampleTasks.push(newTask)
// setNewTasksWithInfoForCell(newTasks)
function dateToISOButLocal(date) {
return date.toLocaleString('sv').replace(' ', 'T');
}
const createTaskInCellHandler = (dayNumber, dayHour) => {
const hour = parseInt(dayHour.split(':')[0])
const newTask = {
title:"Задача",
description:"описание",
dateTimeStart: dateToISOButLocal(new Date(year, month, dayNumber, hour)),
dateTimeDue: dateToISOButLocal(new Date(year, month, dayNumber, hour + 2)),
}
dispatch(addTask(newTask))
setCurrentTask((newTask))
}
const onChangeCellTaskTitle = (e) => {
e.stopPropagation()
const value = e.target.value;
const name = e.target.name;
setCurrentTask({ ...currentTask, [name]: value })
}
console.log(tasks)
return (
<>
<Container>
......@@ -89,6 +96,8 @@ function MonthCalendar() {
year={year}
tasks={tasks}
createTaskInCellHandler={createTaskInCellHandler}
onChangeCellTaskTitle={onChangeCellTaskTitle}
setCurrentTask={setCurrentTask}
/>
</Container>
</>
......
......@@ -2,4 +2,6 @@ export const FETCH_TASKS_REQUEST = "FETCH_TASKS_REQUEST";
export const FETCH_TASKS_SUCCESS = "FETCH_TASKS_SUCCESS";
export const FETCH_TASKS_FAILURE = "FETCH_TASKS_FAILURE";
export const SET_NEW_TASKS_FOR_CELLS = "SET_NEW_TASKS_FOR_CELLS";
\ No newline at end of file
export const ADD_NEW_TASK_REQUEST = "ADD_NEW_TASK_REQUEST";
export const ADD_NEW_TASK_SUCCESS = "ADD_NEW_TASK_SUCCESS";
export const ADD_NEW_TASK_FAILURE = "ADD_NEW_TASK_FAILURE";
\ No newline at end of file
import { FETCH_TASKS_FAILURE, FETCH_TASKS_REQUEST, FETCH_TASKS_SUCCESS, SET_NEW_TASKS_FOR_CELLS } from "../actionTypes/tasksTypes";
import { ADD_NEW_TASK_FAILURE, ADD_NEW_TASK_REQUEST, ADD_NEW_TASK_SUCCESS, FETCH_TASKS_FAILURE, FETCH_TASKS_REQUEST, FETCH_TASKS_SUCCESS} from "../actionTypes/tasksTypes";
import axios from '../../axiosPlanner'
const fetchTasksRequest = () => {
......@@ -12,40 +12,45 @@ const fetchTasksSuccess = (tasks) => {
const fetchTasksFailure = (error) => {
return {type: FETCH_TASKS_FAILURE, error}
};
export const setNewTasksForCells = (tasks) => {
return {type: SET_NEW_TASKS_FOR_CELLS, tasks}
}
export const fetchTasks = () => {
return async (dispatch) => {
dispatch(fetchTasksRequest());
try {
const response = await axios.get("/tasks");
const arr = [
{
accomplish: "opened",
author: {id: 'f0e4a3bf-78fb-465b-9f28-620790750418', name: 'timur', surname: 'ermolaev', displayName: 'ermolaev t.', email: 'loool@mail.ru'},
createdAt: "2022-11-07T11:35:30.937Z",
dateTimeDue: "2022-11-11T14:35:30.937Z",
dateTimeStart: "2022-11-11T11:35:30.937Z",
description: "lol",
id: "2fd828a2-3778-45fd-a11a-00d799db9142",
title : "task1",
}, {
accomplish: "opened",
author: {id: 'f0e4a3bf-78fb-465b-9f28-620790750418', name: 'timur', surname: 'ermolaev', displayName: 'ermolaev t.', email: 'loool@mail.ru'},
createdAt: "2022-11-07T11:35:30.937Z",
dateTimeDue: "2022-11-25T16:00:00.937Z",
dateTimeStart: "2022-11-25T15:35:30.937Z",
description: "lol",
id: "2fd828a2-3778-45fd-a11a-00d799db9142",
title : "task2",
},
]
dispatch(fetchTasksSuccess(arr))
setNewTasksForCells()
dispatch(fetchTasksSuccess(response.data.tasks))
} catch (error) {
dispatch(fetchTasksFailure(error.response.data));
}
}
}
const addTaskRequest = () => {
return {type: ADD_NEW_TASK_REQUEST}
};
const addTaskSuccess = () => {
return {type: ADD_NEW_TASK_SUCCESS}
};
const addTaskFailure = (error) => {
return {type: ADD_NEW_TASK_FAILURE, error}
};
export const addTask = (task) => {
return async (dispatch, getState) => {
dispatch(addTaskRequest());
const token = getState().users?.user?.token;
try {
await axios.post("/tasks", task, {
headers: {
'Authorization': 'aBhHYW8kXUUzjXlxOwGmg'
}
});
dispatch(addTaskSuccess())
dispatch(fetchTasks())
} catch (error) {
dispatch(addTaskFailure(error.response.data));
}
}
}
\ No newline at end of file
import { FETCH_TASKS_FAILURE, FETCH_TASKS_REQUEST, FETCH_TASKS_SUCCESS, SET_NEW_TASKS_FOR_CELLS } from "../actionTypes/tasksTypes";
import { FETCH_TASKS_FAILURE, FETCH_TASKS_REQUEST, FETCH_TASKS_SUCCESS} from "../actionTypes/tasksTypes";
const initialState = {
tasks: [],
......@@ -11,7 +11,8 @@ const tasksReduсer = (state = initialState, action) => {
case FETCH_TASKS_REQUEST:
return {...state, loading: true};
case FETCH_TASKS_SUCCESS:
const newArr = action.tasks.map((task)=>{
const newArr = []
action.tasks.forEach((task)=>{
if (task.dateTimeStart && task.dateTimeDue) {
const dateStart = task.dateTimeStart.split('T')[0]
const timeStart = task.dateTimeStart.split('T')[1]
......@@ -23,7 +24,7 @@ const tasksReduсer = (state = initialState, action) => {
const yearStartNumber = parseInt(dateStart.split('-')[0])
const timeStartHour = parseInt(timeStart.split(':')[0])
const timeEndHour = parseInt(timeEnd.split(':')[0])
return {...task, infoForCell: {
newArr.push({...task, infoForCell: {
startDay: dayStart,
startDayOfWeek: dayOfWeekStartString,
startHour: timeStartHour,
......@@ -31,16 +32,12 @@ const tasksReduсer = (state = initialState, action) => {
startYear: yearStartNumber,
endHour: timeEndHour,
}
}
} else {
return null
} )
}
})
return {...state, loading: false, tasks: newArr};
case FETCH_TASKS_FAILURE:
return {...state, loading: false, error: action.error};
case SET_NEW_TASKS_FOR_CELLS:
return {...state, tasks: action.tasks}
default:
return state;
}
......
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