Commit 9171ead8 authored by “Yevgeniy's avatar “Yevgeniy

Merge branch 'development' of…

Merge branch 'development' of ssh://git.attractor-school.com:30022/apollo64/crm-team-one into task-32-fix/fix_date_login_role
parents bc2a0170 d10cdbd9
...@@ -36,9 +36,9 @@ import { ...@@ -36,9 +36,9 @@ import {
description!: string description!: string
@CreateDateColumn({ name: 'created_at', type: Date, default: new Date() }) @CreateDateColumn({ name: 'created_at', type: Date, default: new Date() })
createdAt!: Date; createdAt!: Date;
@Column({ name: 'dateTimeStart', type: Date,nullable: true }) @Column({ name: 'dateTimeStart', type: 'varchar',nullable: true })
dateTimeStart!: Date | null; dateTimeStart!: Date | null;
@Column({ name: 'dateTimeDue', type: Date,nullable: true }) @Column({ name: 'dateTimeDue', type: 'varchar',nullable: true })
dateTimeDue!: Date | null; dateTimeDue!: Date | null;
@Column({ @Column({
type: "enum", type: "enum",
......
import { Grid } from "@mui/material";
const CalendarRow = ({children}) => {
return <>
<Grid
container
align='center'
sx={{borderBottom: '1px solid black', borderRight: '1px solid black', borderLeft: '1px solid black'}}
>
{children}
</Grid>
</>
};
export default CalendarRow;
import { Grid } from "@mui/material";
const CalendarSmallCell = ({children, xs}) => {
return <>
<Grid align='center' item xs={xs} sx={{borderRight: '1px solid black'}}>
{children}
</Grid>
</>
};
export default CalendarSmallCell;
\ No newline at end of file
import { Grid } from "@mui/material";
const CalendarStandartCell = ({children, xs, onClick}) => {
return <>
<Grid
item xs={xs}
sx={{borderRight: '1px solid black'}}
onClick={onClick}>
{children}
</Grid>
</>
};
export default CalendarStandartCell;
\ No newline at end of file
import { Grid, TextField } from "@mui/material";
import { useEffect, useState } from "react";
const CalendarTask = ({year, month, tasks, day, hours, setCurrentTask, onChange}) => {
const getTaskInDayCell = (tasks, day, hours) => {
const task = tasks.find(task=> {
if (year === task.infoForCell.startYear) {
if (month + 1 === task.infoForCell.startMonth) {
if (day.dayNumber === task.infoForCell.startDay) {
if ((task.infoForCell.endHour <= parseInt(hours.split(':')[0]) || task.infoForCell.startHour <= parseInt(hours.split(':')[0])) && (task.infoForCell.endHour > parseInt(hours.split(':')[0]))) {
return task
}
}
}
}
})
return task
}
let task = getTaskInDayCell(tasks, day, hours)
return (<>
{task ?
<Grid sx={{backgroundColor: 'lightgreen'}}>
<TextField
id={task.title}
variant="standard"
value={task.title}
name='title'
onClick={(e)=>{e.stopPropagation(); setCurrentTask(task)}}
onChange={onChange}>
</TextField>
</Grid>
: null }
</>)
};
export default CalendarTask;
\ No newline at end of file
import { Grid, TextField } from "@mui/material";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import CalendarRow from "./CalendarRow/CalendarRow";
import CalendarSmallCell from "./CalendarSmallCell/CalendarSmallCell";
import CalendarStandartCell from "./CalendarStandartCell.js/CalendarStandartCell";
import CalendarTask from "./CalendarTask/CalendarTask";
const exampleTasks=[ function MonthCalendarBody({month, year, tasks, createTaskInCellHandler, onChangeCellTaskTitle, setCurrentTask}) {
{
user:"first",
title:"задача1",
description:"описание задачи11111",
priority:"A",
author:"Ivan",
executor:"Arman",
dateTimeStart:"26.12.2022 20:00:00",
dateTimeDue:"27.10.2022 14:20:00",
id:1,
dateCreated:"26.10.2022"
}, {
user:"first",
title:"задача2",
description:"описание задачи11111",
priority:"A",
author:"Ivan",
executor:"Arman",
dateTimeStart:"1.12.2022 9:00:00",
dateTimeDue:"27.10.2022 15:20:00",
id:1,
dateCreated:"26.10.2022"
},{
user:"first",
title:"first",
description:"описание задачи11111",
priority:"A",
author:"Ivan",
executor:"Arman",
dateTimeStart:"5.11.2022 16:00:00",
dateTimeDue:"5.11.2022 17:00:00",
id:1,
dateCreated:"26.10.2022"
},{
user:"first",
title:"second",
description:"описание задачи11111",
priority:"A",
author:"Ivan",
executor:"Arman",
dateTimeStart:"5.11.2022 16:00:00",
dateTimeDue:"5.11.2022 17:00:00",
id:1,
dateCreated:"26.10.2022"
}
]
function MonthCalendarBody({month, year}) {
const [hoursInDay, setHoursInDay] = useState(['8:00', '10:00', '12:00', '14:00', '16:00', '18:00', '20:00', '22:00', '6:00']) 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([]) const [daysInMonth, setDaysInMonth] = useState([])
const [tasksForCell, setTasksForCell] = useState([]) const [cellSizes, setCellSizes] = useState({})
useEffect(()=>{ useEffect(()=>{
setNewMonthDays(month, year) const cells = hoursInDay.length
setNewTasksWithInfoForCell(exampleTasks, month, year) const xs = 11/cells
}, [month, year]) setCellSizes(()=>{
return {smallCell: 0.5, standarCell: xs}
})
}, [])
useEffect(()=>{
setNewMonthDays()
}, [month])
const getDaysInMonth = () => { const getDaysInMonth = () => {
return new Date(year, month + 1, 0).getDate(); return new Date(year, month + 1, 0).getDate();
...@@ -69,147 +30,60 @@ function MonthCalendarBody({month, year}) { ...@@ -69,147 +30,60 @@ function MonthCalendarBody({month, year}) {
return ["ВС","ПН","ВТ","СР","ЧТ","ПТ","СБ"][day]; return ["ВС","ПН","ВТ","СР","ЧТ","ПТ","СБ"][day];
} }
const getDayOfWeekNumber = (month, year, day) => { const getDayOfWeekNumber = (day) => {
return new Date(year, month, day).getDay() return new Date(year, month, day).getDay()
} }
const setNewTasksWithInfoForCell = (tasks, month, year) => { const setNewMonthDays = () => {
const newArr = tasks.map((task)=>{
const dateStart = task.dateTimeStart.split(' ')[0]
const timeStart = task.dateTimeStart.split(' ')[1]
const timeEnd = task.dateTimeDue.split(' ')[1]
const dayStart = parseInt(dateStart.split('.')[0])
const dayOfWeekStartNumber = getDayOfWeekNumber(month, year, dayStart)
const dayOfWeekStartString = getDayOfWeekString(dayOfWeekStartNumber)
const monthStartNumber = parseInt(dateStart.split('.')[1])
const yearStartNumber = parseInt(dateStart.split('.')[2])
const timeStartHour = parseInt(timeStart.split(':')[0])
const timeEndHour = parseInt(timeEnd.split(':')[0])
return {...task,
startDay: dayStart,
startDayOfWeek: dayOfWeekStartString,
startHour: timeStartHour,
startMonth: monthStartNumber,
startYear: yearStartNumber,
endHour: timeEndHour,
}
})
setTasksForCell(newArr)
}
const createTaskInCellHandler = (month, year, 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, month, year)
}
const getTaskInDayCell = (tasks, day, hours, month, year) => {
const task = tasks.find(task=> {
if (year === task.startYear) {
if (month + 1 === task.startMonth) {
if (day.dayNumber === task.startDay && task.startDayOfWeek === day.dayOfWeek ) {
if ((task.endHour <= parseInt(hours.split(':')[0]) || task.startHour <= parseInt(hours.split(':')[0])) && (task.endHour >= parseInt(hours.split(':')[0]))) {
return task
}
}
}
}
})
return task
}
const setNewMonthDays = (month, year) => {
const newDaysInMonth = [] const newDaysInMonth = []
for (let i = 1; i <= getDaysInMonth(month, year); i++) { for (let i = 1; i <= getDaysInMonth(); i++) {
const dayOfWeekNumber = getDayOfWeekNumber(month, year, i) const dayOfWeekNumber = getDayOfWeekNumber(i)
newDaysInMonth.push({dayNumber: i, dayOfWeek: getDayOfWeekString(dayOfWeekNumber)}) newDaysInMonth.push({dayNumber: i, dayOfWeek: getDayOfWeekString(dayOfWeekNumber)})
} }
setDaysInMonth(newDaysInMonth) setDaysInMonth(prevState=>newDaysInMonth)
}
const onChangeCellTaskTitle = (e, task) => {
const value = e.target.value;
const name = e.target.name;
const { id } = task;
const newTasks = tasksForCell.map(task => {
if (task.id === id) {
return { ...task, [name]: value };
}
return task;
});
setTasksForCell(newTasks);
exampleTasks = [...newTasks]
} }
return ( return (
<> <>
<Grid <CalendarRow
container
align='center'
sx={{borderBottom: '1px solid black', borderRight: '1px solid black', borderLeft: '1px solid black'}}
> >
<Grid align='center' item xs={0.5} sx={{borderRight: '1px solid black'}}> <CalendarSmallCell xs={cellSizes.smallCell} />
{' '} <CalendarSmallCell xs={cellSizes.smallCell}/>
</Grid>
<Grid align='center' item xs={0.5} sx={{borderRight: '1px solid black'}}>
{' '}
</Grid>
{hoursInDay.map((hours, i)=>{ {hoursInDay.map((hours, i)=>{
return ( return (
<Grid key={i} item xs={1.2222} sx={{borderRight: '1px solid black'}}> <CalendarStandartCell key={i} xs={cellSizes.standarCell}>
{hours} {hours}
</Grid> </CalendarStandartCell>
) )
})} })}
</Grid> </CalendarRow>
{daysInMonth.map((day, i)=>{ {daysInMonth.map((day, i)=>{
return ( return (
<Grid <CalendarRow
key={i} key={i}
container
align='center'
sx={{borderBottom: '1px solid black', borderRight: '1px solid black', borderLeft: '1px solid black'}}
> >
<Grid align='center' item xs={0.5} sx={{borderRight: '1px solid black'}}> <CalendarSmallCell xs={cellSizes.smallCell}>{day.dayNumber}</CalendarSmallCell>
{day.dayNumber} <CalendarSmallCell xs={cellSizes.smallCell}>{day.dayOfWeek}</CalendarSmallCell>
</Grid>
<Grid align='center' item xs={0.5} sx={{borderRight: '1px solid black'}}>
{day.dayOfWeek}
</Grid>
{hoursInDay.map((hours, i)=>{ {hoursInDay.map((hours, i)=>{
const task = getTaskInDayCell(tasksForCell, day, hours, month, year)
return ( return (
<Grid <CalendarStandartCell
key={i} key={i}
item xs={1.2222} item xs={cellSizes.standarCell}
sx={{borderRight: '1px solid black'}} onClick={()=>{createTaskInCellHandler(day.dayNumber, hours)}}
onClick={()=>{createTaskInCellHandler(month, year, day.dayOfWeek, day.dayNumber, hours)}}> >
{ task ? <CalendarTask
<Grid key={i} sx={{backgroundColor: 'lightgreen'}}> setCurrentTask={setCurrentTask}
<TextField onChange={(e)=>{onChangeCellTaskTitle(e)}}
id={task.title} year={year}
variant="standard" month={month}
value={task.title} tasks={tasks}
name='title' day={day}
onChange={(e)=>{onChangeCellTaskTitle(e, task)}}></TextField> hours={hours}
</Grid> : null} />
</Grid> </CalendarStandartCell>
) )
})} })}
</Grid> </CalendarRow>
) )
})} })}
</> </>
......
import { Container } from '@mui/material'; import { Container } from '@mui/material';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import MonthCalendarBody from '../../components/MonthCalendarBody/MonthCalendarBody'; import MonthCalendarBody from '../../components/MonthCalendarBody/MonthCalendarBody';
import MonthCalendarHeader from '../../components/MonthCalendarHeader/MonthCalendarHeader'; import MonthCalendarHeader from '../../components/MonthCalendarHeader/MonthCalendarHeader';
import { addTask, fetchTasks} from '../../store/actions/tasksActions';
function MonthCalendar() { function MonthCalendar() {
const dispatch = useDispatch();
const { tasks } = useSelector(state => state.tasks);
const [month, setMonth] = useState('') const [month, setMonth] = useState('')
const [year, setYear] = useState('') const [year, setYear] = useState('')
const [worker, setWorker] = useState(''); const [worker, setWorker] = useState('');
const [calendarType, setCalendarType] = useState('Месяц'); const [calendarType, setCalendarType] = useState('Месяц');
const [currentTask, setCurrentTask] = useState({})
useEffect(()=>{ useEffect(()=>{
setMonth(new Date().getMonth()) setMonth(new Date().getMonth())
setYear(new Date().getFullYear()) setYear(new Date().getFullYear())
},[]) dispatch(fetchTasks())
}, [dispatch])
const onChangeWorkerHandler = (event) => { const onChangeWorkerHandler = (event) => {
setWorker(event.target.value); setWorker(event.target.value);
}; };
...@@ -46,6 +53,29 @@ function MonthCalendar() { ...@@ -46,6 +53,29 @@ function MonthCalendar() {
}) })
} }
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 })
}
return ( return (
<> <>
<Container> <Container>
...@@ -63,6 +93,10 @@ function MonthCalendar() { ...@@ -63,6 +93,10 @@ function MonthCalendar() {
<MonthCalendarBody <MonthCalendarBody
month={month} month={month}
year={year} year={year}
tasks={tasks}
createTaskInCellHandler={createTaskInCellHandler}
onChangeCellTaskTitle={onChangeCellTaskTitle}
setCurrentTask={setCurrentTask}
/> />
</Container> </Container>
</> </>
......
...@@ -5,6 +5,7 @@ import App from './App'; ...@@ -5,6 +5,7 @@ import App from './App';
import { configureStore } from '@reduxjs/toolkit'; import { configureStore } from '@reduxjs/toolkit';
import { Provider } from 'react-redux'; import { Provider } from 'react-redux';
import usersReducer from './store/reducers/usersReducer'; import usersReducer from './store/reducers/usersReducer';
import tasksReducer from './store/reducers/tasksReducer';
import axios from 'axios'; import axios from 'axios';
const localStorageMiddleware = ({getState}) => (next) => (action) => { const localStorageMiddleware = ({getState}) => (next) => (action) => {
...@@ -31,6 +32,7 @@ axios.interceptors.request.use(config=>{ ...@@ -31,6 +32,7 @@ axios.interceptors.request.use(config=>{
const store = configureStore({ const store = configureStore({
reducer: { reducer: {
users: usersReducer, users: usersReducer,
tasks: tasksReducer
}, },
preloadedState: loadFromLocalStorage(), preloadedState: loadFromLocalStorage(),
middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(localStorageMiddleware) middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(localStorageMiddleware)
......
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 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 { 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 = () => {
return {type: FETCH_TASKS_REQUEST}
};
const fetchTasksSuccess = (tasks) => {
return {type: FETCH_TASKS_SUCCESS, tasks}
};
const fetchTasksFailure = (error) => {
return {type: FETCH_TASKS_FAILURE, error}
};
export const fetchTasks = () => {
return async (dispatch) => {
dispatch(fetchTasksRequest());
try {
const response = await axios.get("/tasks");
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} from "../actionTypes/tasksTypes";
const initialState = {
tasks: [],
loading: false,
error: null
};
const tasksReduсer = (state = initialState, action) => {
switch(action.type) {
case FETCH_TASKS_REQUEST:
return {...state, loading: true};
case FETCH_TASKS_SUCCESS:
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]
const timeEnd = task.dateTimeDue.split('T')[1]
const dayStart = parseInt(dateStart.split('-')[2])
const monthStartNumber = parseInt(dateStart.split('-')[1])
const yearStartNumber = parseInt(dateStart.split('-')[0])
const timeStartHour = parseInt(timeStart.split(':')[0])
const timeEndHour = parseInt(timeEnd.split(':')[0])
newArr.push({...task, infoForCell: {
startDay: dayStart,
startHour: timeStartHour,
startMonth: monthStartNumber,
startYear: yearStartNumber,
endHour: timeEndHour,
}
} )
}
})
return {...state, loading: false, tasks: newArr};
case FETCH_TASKS_FAILURE:
return {...state, loading: false, error: action.error};
default:
return state;
}
};
export default tasksReduсer;
\ No newline at end of file
...@@ -5,14 +5,14 @@ const initialState = { ...@@ -5,14 +5,14 @@ const initialState = {
name: 'Ivan', name: 'Ivan',
surname: 'Petrov', surname: 'Petrov',
email: 'test@gmail.com', email: 'test@gmail.com',
role: 'user' role: 'superuser'
}, },
registerError: null, registerError: null,
loginError: null, loginError: null,
loading: false loading: false
}; };
const usersReduser = (state = initialState, action) => { const usersReducer = (state = initialState, action) => {
switch(action.type) { switch(action.type) {
case REGISTER_USER_REQUEST: case REGISTER_USER_REQUEST:
return {...state, loading: true}; return {...state, loading: true};
...@@ -31,4 +31,4 @@ const usersReduser = (state = initialState, action) => { ...@@ -31,4 +31,4 @@ const usersReduser = (state = initialState, action) => {
} }
}; };
export default usersReduser; export default usersReducer;
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