Skip to content

P
planner-team-one
Commit e2fdc5e2 authored by Нелли Ибрагимова's avatar Нелли Ибрагимова
Browse files
Options

Merge branch 'development' of… 

Merge branch 'development' of ssh://git.attractor-school.com:30022/apollo64/crm-team-one into task-27-fixing_bags_page_my_tasks
parents 458bbbc0 fa05180f
Expand all Show whitespace changes
Inline Side-by-side
Showing with 804 additions and 318 deletions
planner-api/package-lock.json
View file @ e2fdc5e2
This diff is collapsed.
planner-api/package.json
View file @ e2fdc5e2
......@@ -15,6 +15,7 @@
"license": "ISC",
"devDependencies": {
"@faker-js/faker": "^7.6.0",
"@types/multer": "^1.4.7",
"@types/node": "^18.11.8",
"@typescript-eslint/eslint-plugin": "^5.41.0",
"@typescript-eslint/parser": "^5.41.0",
......@@ -34,7 +35,9 @@
"cors": "^2.8.5",
"express": "^4.18.2",
"mongoose": "^6.7.0",
"multer": "^1.4.5-lts.1",
"nanoid": "^3.3.4",
"path": "^0.12.7",
"pg": "^8.8.0",
"reflect-metadata": "^0.1.13",
"typeorm": "^0.3.10"
......
planner-api/public/uploads/.gitignore 0 → 100644
View file @ e2fdc5e2
*
!.gitignore
\ No newline at end of file
planner-api/src/config.ts 0 → 100644
View file @ e2fdc5e2
import path = require('path');
const rootPath = __dirname;
export const config = {
rootPath,
uploadPath: path.join(rootPath, "public", "uploads"),
db: {
url: "mongodb://localhost/",
name: "planner"
}
};
planner-api/src/routers/users.ts
View file @ e2fdc5e2
......@@ -2,10 +2,29 @@ import express,{Router, Request, Response} from 'express';
import {User} from '../models/User';
import {myDataSource} from '../app-data-source';
import { nanoid } from 'nanoid';
import multer from 'multer';
import path from 'path';
import {config} from "../config"
const router:Router = express.Router();
const dataSource = myDataSource;
type DestinationCallback = (error: Error | null, destination: string) => void
type FileNameCallback = (error: Error | null, filename: string) => void
const storage = multer.diskStorage({
destination: (req:Request, file: Express.Multer.File, cb:DestinationCallback) => {
cb(null, config.uploadPath);
},
filename: (req:Request, file: Express.Multer.File, cb:FileNameCallback) => {
cb(null, nanoid() + path.extname(file.originalname));
}
})
const upload = multer({ storage })
router.get('/', async (req : Request, res : Response):Promise<object> => {
const users = await dataSource
.getRepository(User)
......@@ -15,9 +34,10 @@ return res.send({users})
})
router.post('/', async (req : Request, res : Response):Promise<object> => {
router.post('/', upload.single("avatar"), async (req : Request, res : Response):Promise<object> => {
console.log(req.body)
const {name,surname,password,email, role} = req.body;
console.log(req.body)
const displayName = surname+' '+name[0]+'.'
const user = new User();
user.name = name;
......@@ -27,16 +47,20 @@ router.post('/', async (req : Request, res : Response):Promise<object> => {
user.email = email;
user.role = role;
user.generateToken()
console.log("user " + user)
await user.save();
console.log("saved")
const userToFront:User|null = await dataSource.manager.findOneBy(User, {
email: user.email
})
console.log("userToFront " + userToFront)
return res.send({userToFront})
})
router.post('/sessions/', async (req : Request, res : Response):Promise<object> => {
const {email, password} = req.body;
console.log("email" + email, "password" + password )
const user = await dataSource
.createQueryBuilder()
.select("user")
......@@ -46,6 +70,7 @@ router.post('/sessions/', async (req : Request, res : Response):Promise<object>
.getOne()
if(!user) return res.status(404).send({Message:'user not found'})
const isMatch:boolean = await user.checkPassword(password);
console.log("123")
if (!isMatch) return res.status(400).send({
error: "Wrong Password"
})
......
planner-front/src/App.js
View file @ e2fdc5e2
......@@ -6,6 +6,7 @@ import MyTasks from './containers/MyTasks/MyTasks';
import Login from './containers/Login/Login';
import Register from './containers/Register/Register';
import MonthCalendar from './containers/MonthCalendar/MonthCalendar';
import ForgottenPassword from "./containers/ForgottenPassword/ForgottenPassword";
const ProtectedRoute = ({isAllowed, roles, redirectUrl, children}) => {
const user = useSelector(state => state.users?.user);
......@@ -95,6 +96,7 @@ const App = () => {
}/>
<Route path={"/sign-in"} element={<Login/>}/>
<Route path={"/forgottenpassword"} element={<ForgottenPassword/>}/>
<Route path='*' element={<h1>404</h1>}/>
</Route>
</Routes>
......
planner-front/src/components/Menus/AdminMenu/AdminMenu.js
View file @ e2fdc5e2
import {Button} from "@mui/material";
import {NavLink} from "react-router-dom";
import {Button, Menu, MenuItem} from "@mui/material";
import { useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import {NavLink, useNavigate} from "react-router-dom";
import { logoutUser } from "../../../store/actions/usersActions";
const AdminMenu = () => {
const dispatch = useDispatch();
const navigate = useNavigate()
const [anchorEl, setAnchorEl] = useState(null);
const open = Boolean(anchorEl);
const user = useSelector(state => state.users.user)
console.log(user)
const handleClick = (event) => {
setAnchorEl(event.currentTarget);
};
const handleClose = () => {
setAnchorEl(null);
};
const logout = () => {
dispatch(logoutUser(navigate));
handleClose()
}
return <>
<Button
component={NavLink}
......@@ -44,13 +64,20 @@ const AdminMenu = () => {
Создать сотрудника
</Button>
<Button
component={NavLink}
to="/profile/test"
color="inherit"
size="large"
onClick={handleClick}
>
Профиль
Hello, {user?.displayName}
</Button>
<Menu
anchorEl={anchorEl}
open={open}
onClose={handleClose}
>
<MenuItem component={NavLink} to="/profile/test" color="inherit" onClick={handleClose}>Profile</MenuItem>
<MenuItem onClick={logout}>Logout</MenuItem>
</Menu>
</>
};
......
planner-front/src/components/Menus/WorkerMenu/WorkerMenu.js
View file @ e2fdc5e2
import {Button} from "@mui/material";
import {NavLink} from "react-router-dom";
import {Button, Menu, MenuItem} from "@mui/material";
import { useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import {NavLink, useNavigate} from "react-router-dom";
import { logoutUser } from "../../../store/actions/usersActions";
const WorkerMenu = ({user}) => {
const WorkerMenu = () => {
const dispatch = useDispatch();
const navigate = useNavigate()
const [anchorEl, setAnchorEl] = useState(null);
const open = Boolean(anchorEl);
const user = useSelector(state => state.users.user)
console.log(user)
const handleClick = (event) => {
setAnchorEl(event.currentTarget);
};
const handleClose = () => {
setAnchorEl(null);
};
const logout = () => {
dispatch(logoutUser(navigate));
handleClose()
}
return <>
<Button
component={NavLink}
......@@ -28,13 +48,20 @@ const WorkerMenu = ({user}) => {
Мои задачи
</Button>
<Button
component={NavLink}
to="/profile/test"
color="inherit"
size="large"
onClick={handleClick}
>
Профиль
Hello, {user?.displayName}
</Button>
<Menu
anchorEl={anchorEl}
open={open}
onClose={handleClose}
>
<MenuItem component={NavLink} to="/profile/test" color="inherit" onClick={handleClose}>Profile</MenuItem>
<MenuItem onClick={logout}>Logout</MenuItem>
</Menu>
</>
};
......
planner-front/src/components/MonthCalendarBody/CalendarRow/CalendarRow.js
View file @ e2fdc5e2
import { Grid } from "@mui/material";
import { memo } from "react";
const CalendarRow = ({children}) => {
return <>
......@@ -12,6 +13,6 @@ const CalendarRow = ({children}) => {
</>
};
export default CalendarRow;
export default memo(CalendarRow);
planner-front/src/components/MonthCalendarBody/CalendarSmallCell/CalendarSmallCell.js
View file @ e2fdc5e2
import { Grid } from "@mui/material";
import { memo } from "react";
const CalendarSmallCell = ({children, xs}) => {
return <>
......@@ -8,4 +9,4 @@ const CalendarSmallCell = ({children, xs}) => {
</>
};
export default CalendarSmallCell;
\ No newline at end of file
export default memo(CalendarSmallCell);
\ No newline at end of file
planner-front/src/components/MonthCalendarBody/CalendarStandartCell.js/CalendarStandartCell.js
View file @ e2fdc5e2
import { Grid, TextField, Typography } from "@mui/material";
import { useEffect, useState } from "react";
import { memo, useEffect, useState } from "react";
const CalendarStandartCell = ({children, xs, currentTask, hours, dayNumber, createTaskInCellHandler, handleOpen, modal}) => {
const CalendarStandartCell = ({children, xs, hours, dayNumber, createTaskInCellHandler, handleOpen, modal}) => {
const [isThisCell, setIsThisCell] = useState(false)
useEffect(()=>{
if(!modal) {
......@@ -19,11 +19,14 @@ const CalendarStandartCell = ({children, xs, currentTask, hours, dayNumber, cre
sx={{backgroundColor: 'lightgreen', padding: '10px', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis'}}
>
<span>
{currentTask.title}
Задача
</span>
</Grid> : null}
</Grid>
</>
};
export default CalendarStandartCell;
\ No newline at end of file
export default memo(CalendarStandartCell, (prevProps, nextProps)=>{
if(!prevProps.modal) return false
if(nextProps.modal) return true
});
\ No newline at end of file
planner-front/src/components/MonthCalendarBody/CalendarTask/CalendarTask.js
View file @ e2fdc5e2
import { Grid, TextField, Typography } from "@mui/material";
import React, { useEffect, useState } from "react";
import React, { memo, useState, useEffect} from "react";
const CalendarTask = ({year, month, tasks, day, hours, setCurrentTask, hourFormat, handleOpen, currentTask}) => {
const [thisCellCurrentTask, setThisCellCurrentTask] = useState({})
......@@ -34,13 +34,6 @@ const CalendarTask = ({year, month, tasks, day, hours, setCurrentTask, hourForma
}
}, [currentTask])
const renderText = (i, task) => {
if (thisCellCurrentTask && i === thisCellCurrentTask.i) {
return (<>{currentTask.title}</>)
} else {
return (<>{task.title}</>)
}
}
return (<>
{tasksCell.length ? tasksCell.map((task, i)=>
......@@ -49,9 +42,9 @@ const CalendarTask = ({year, month, tasks, day, hours, setCurrentTask, hourForma
<Grid
key={task.id}
sx={{backgroundColor: 'lightgreen', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis', padding: '10px', borderBottom: '1px solid rgb(29, 161, 51);;'}}
onClick={(e)=>{e.stopPropagation(); setCurrentTask(task); handleOpen(e); setThisCellCurrentTask({...task, i: i})}}
onClick={(e)=>{e.stopPropagation(); setCurrentTask(task); handleOpen(e)}}
>
{renderText(i, task)}
{task.title}
</Grid>
)}
)
......@@ -59,4 +52,4 @@ const CalendarTask = ({year, month, tasks, day, hours, setCurrentTask, hourForma
</>)
};
export default CalendarTask;
\ No newline at end of file
export default memo(CalendarTask);
\ No newline at end of file
planner-front/src/components/MonthCalendarBody/MonthCalendarBody.js
View file @ e2fdc5e2
import { FormControlLabel, Switch} from "@mui/material";
import { useEffect, useState } from "react";
import { memo, useEffect, useState } from "react";
import CalendarRow from "./CalendarRow/CalendarRow";
import CalendarSmallCell from "./CalendarSmallCell/CalendarSmallCell";
import CalendarStandartCell from "./CalendarStandartCell.js/CalendarStandartCell";
......@@ -7,11 +7,8 @@ import CalendarTask from "./CalendarTask/CalendarTask";
import ModalTask from "../UI/ModalTask/ModalTask";
import MonthCalendarModalContent from "../MonthCalendarModalContent/MonthCalendarModalContent";
function MonthCalendarBody({month, year, tasks, createTaskInCellHandler, currentTask, setCurrentTask, hourFormat, setHourFormat, onChangeCurrentTaskHandler, sendNewTaskHandler, deleteTaskHandler}) {
function MonthCalendarBody({month, year, tasks, createTaskInCellHandler, currentTask, setCurrentTask, hourFormat, setHourFormat, onChangeCurrentTaskHandler, sendNewTaskHandler, deleteTaskHandler, cellSizes, hoursInDay, daysInMonth}) {
const [hoursInDay, setHoursInDay] = useState(['8:00', '10:00', '12:00', '14:00', '16:00', '18:00', '20:00', '22:00'])
const [daysInMonth, setDaysInMonth] = useState([])
const [cellSizes, setCellSizes] = useState({})
const [modal, setModal] = useState({open:false, y: 0, x: 0,});
const handleOpen = (e) => {
setModal( {
......@@ -30,58 +27,6 @@ function MonthCalendarBody({month, year, tasks, createTaskInCellHandler, current
};
useEffect(()=>{
const cells = hoursInDay.length
const xs = 10.8/cells
setCellSizes(()=>{
return {smallCell: 0.6, standarCell: xs}
})
}, [])
useEffect(()=>{
if (hourFormat) {
const arr = ['8:00', '9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00','21:00','22:00']
const cells = arr.length
const xs = 10.8/cells
setCellSizes(()=>{
return {smallCell: 0.6, standarCell: xs}
})
setHoursInDay(()=>arr)
} else {
const arr = ['8:00', '10:00', '12:00', '14:00', '16:00', '18:00', '20:00', '22:00']
const cells = arr.length
const xs = 10.8/cells
setCellSizes(()=>{
return {smallCell: 0.6, standarCell: xs}
})
setHoursInDay(()=>arr)
}
}, [hourFormat])
useEffect(()=>{
setNewMonthDays()
}, [month])
const getDaysInMonth = () => {
return new Date(year, month + 1, 0).getDate();
}
const getDayOfWeekString = (day) => {
return ["ВС","ПН","ВТ","СР","ЧТ","ПТ","СБ"][day];
}
const getDayOfWeekNumber = (day) => {
return new Date(year, month, day).getDay()
}
const setNewMonthDays = () => {
const newDaysInMonth = []
for (let i = 1; i <= getDaysInMonth(); i++) {
const dayOfWeekNumber = getDayOfWeekNumber(i)
newDaysInMonth.push({dayNumber: i, dayOfWeek: getDayOfWeekString(dayOfWeekNumber)})
}
setDaysInMonth(prevState=>newDaysInMonth)
}
return (
<>
......@@ -94,7 +39,7 @@ function MonthCalendarBody({month, year, tasks, createTaskInCellHandler, current
labelPlacement="end"
/>
</CalendarSmallCell>
{hoursInDay.map((hours, i)=>{
{hoursInDay?.map((hours, i)=>{
return (
<CalendarStandartCell key={i} xs={cellSizes.standarCell}>
{hours}
......@@ -102,7 +47,7 @@ function MonthCalendarBody({month, year, tasks, createTaskInCellHandler, current
)
})}
</CalendarRow>
{daysInMonth.map((day, i)=>{
{daysInMonth?.map((day, i)=>{
return (
<CalendarRow
key={i}
......
planner-front/src/components/MonthCalendarHeader/MonthAndYearInfo/MonthAndYearInfo.js 0 → 100644
View file @ e2fdc5e2
import { Box, Typography } from '@mui/material';
import { memo } from 'react';
import MonthDecrementButton from './MonthDecrementButton/MonthDecrementButton';
import MonthIncrementButton from './MonthIncrementButton/MonthIncrementButton';
function MonthAndYearInfo({getCurrentMonthString, year, incrementMonth, decrementMonth}) {
return (
<>
<Box
sx={{
flexGrow: 1,
display: 'flex',
alignItems: 'center',
gap: '10px'
}}
>
<MonthDecrementButton
decrementMonth={decrementMonth}
/>
<Box sx={{ flexBasis: '150px' }}>
<Typography
variant="h6"
sx={{
display: 'flex',
justifyContent: 'center',
}}
>
{getCurrentMonthString}
</Typography>
<Typography align='center'>{year}</Typography>
</Box>
<MonthIncrementButton
incrementMonth={incrementMonth}
/>
</Box>
</> );
}
export default memo(MonthAndYearInfo);
\ No newline at end of file
planner-front/src/components/MonthCalendarHeader/MonthAndYearInfo/MonthDecrementButton/MonthDecrementButton.js 0 → 100644
View file @ e2fdc5e2
import ArrowBackIcon from '@mui/icons-material/ArrowBack';
import { memo } from 'react';
const arrowClass = {
borderRadius: '50%',
cursor: 'pointer',
transition: '0.5s',
"&:hover": {
background: 'rgb(48, 154, 252, 0.65)',
transition: '0.5s',
transform: 'scale(1.2)'
}
}
function MonthDecrementButton({decrementMonth}) {
return (
<>
<ArrowBackIcon
sx={arrowClass}
onClick={decrementMonth}
/>
</> );
}
export default memo(MonthDecrementButton);
\ No newline at end of file
planner-front/src/components/MonthCalendarHeader/MonthAndYearInfo/MonthIncrementButton/MonthIncrementButton.js 0 → 100644
View file @ e2fdc5e2
import ArrowForwardIcon from '@mui/icons-material/ArrowForward';
import { memo } from 'react';
const arrowClass = {
borderRadius: '50%',
cursor: 'pointer',
transition: '0.5s',
"&:hover": {
background: 'rgb(48, 154, 252, 0.65)',
transition: '0.5s',
transform: 'scale(1.2)'
}
}
function MonthIncrementButton({incrementMonth}) {
return (
<>
<ArrowForwardIcon
sx={arrowClass}
onClick={incrementMonth}
/>
</> );
}
export default memo(MonthIncrementButton);
\ No newline at end of file
planner-front/src/components/MonthCalendarHeader/MonthCalendarHeader.js
View file @ e2fdc5e2
import { AppBar, FormControl, InputLabel, MenuItem, Select, Toolbar, Typography } from '@mui/material';
import ArrowBackIcon from '@mui/icons-material/ArrowBack';
import ArrowForwardIcon from '@mui/icons-material/ArrowForward';
import { AppBar, Toolbar} from '@mui/material';
import { Box } from '@mui/system';
import MonthAndYearInfo from './MonthAndYearInfo/MonthAndYearInfo';
import СustomSelect from '../UI/СustomSelect/СustomSelect'
const arrowClass = {
borderRadius: '50%',
cursor: 'pointer',
transition: '0.5s',
"&:hover": {
const workers = [{value: '', text: '--выберите сотрудника'}, {value: 'Василий', text: 'Василий'}, {value: 'Никита', text: 'Никита'}]
const types = [{value: 'Месяц', text: 'Месяц'}, {value: 'Неделя', text: 'Неделя'}]
background: 'rgb(48, 154, 252, 0.65)',
transition: '0.5s',
transform: 'scale(1.2)'
}
}
function MonthCalendarHeader({month, getCurrentMonthString, decrementMonth, incrementMonth, calendarType, onChangeWorkerHandler, onChangeCalendarTypeHandler, worker, year}) {
function MonthCalendarHeader({ getCurrentMonthString, decrementMonth, incrementMonth, calendarType, onChangeWorkerHandler, onChangeCalendarTypeHandler, worker, year}) {
return (
<>
<Box sx={{ flexGrow: 1 }}>
<AppBar position="static">
<Toolbar>
<Box
sx={{
flexGrow: 1,
display: 'flex',
alignItems: 'center',
gap: '10px'
}}
>
<ArrowBackIcon
onClick={()=>{decrementMonth()}}
sx={arrowClass}
/>
<Box sx={{ flexBasis: '150px' }}>
<Typography
variant="h6"
sx={{
display: 'flex',
justifyContent: 'center',
}}
>
{getCurrentMonthString(month)}
</Typography>
<Typography align='center'>{year}</Typography>
</Box>
<ArrowForwardIcon
sx={arrowClass}
onClick={()=>{incrementMonth()}}
/>
</Box>
<FormControl variant="standard" sx={{ m: 1, minWidth: 120 }}>
<InputLabel id="worker-select-label">Сотрудник</InputLabel>
<Select
labelId="worker-select-label"
id="worker-select"
<MonthAndYearInfo
getCurrentMonthString={getCurrentMonthString}
decrementMonth={decrementMonth}
incrementMonth={incrementMonth}
year={year}
/>
<СustomSelect
value={worker}
onChange={(e)=>{onChangeWorkerHandler(e)}}
label="Worker"
>
<MenuItem value="">
<em>-- Выберите сотрудника --</em>
</MenuItem>
<MenuItem value={"Василий"}>Василий</MenuItem>
<MenuItem value={"Никита"}>Никита</MenuItem>
<MenuItem value={"Артем"}>Артем</MenuItem>
</Select>
</FormControl>
label={'Сотрудник'}
id={'worker'}
items={workers}
/>
<FormControl variant="standard" sx={{ m: 1, minWidth: 120 }}>
<InputLabel id="calendar-type-label">Календарь</InputLabel>
<Select
labelId="calendar-type-label"
id="calendar-type"
<СustomSelect
value={calendarType}
onChange={(e)=>{onChangeCalendarTypeHandler(e)}}
label="Type"
>
<MenuItem value={"Месяц"}>Месяц</MenuItem>
<MenuItem value={"Неделя"}>Неделя</MenuItem>
</Select>
</FormControl>
label={'Календарь'}
id={'calendar-type'}
items={types}
/>
</Toolbar>
</AppBar>
</Box>
......
planner-front/src/components/UI/СustomSelect/СustomSelect.js 0 → 100644
View file @ e2fdc5e2
import { FormControl, InputLabel, MenuItem, Select} from '@mui/material';
import { memo } from 'react';
function СustomSelect({value, onChange, label, variant='standard', items, id}) {
return (
<>
<FormControl variant={variant} sx={{ m: 1, minWidth: 120 }}>
<InputLabel id={id + '-select' + '-label'}>{label}</InputLabel>
<Select
labelId={id + '-select'+ '-label'}
id={id + '-select'}
value={value}
onChange={onChange}
label={label}
>
{items.map((item, i)=>{
return (
<MenuItem
key={i}
value={item?.value}
>{item?.text}</MenuItem>
)
})}
</Select>
</FormControl>
</> );
}
export default memo(СustomSelect, (prevProps, nextProps)=>{
if(prevProps.value !== nextProps.value) {
return false
} else {
return true
}
});
\ No newline at end of file
planner-front/src/components/UserForm/ResetPasswordForm.js 0 → 100644
View file @ e2fdc5e2
import { Button, Grid} from "@mui/material";
import { NavLink } from "react-router-dom";
import FormElement from "../UI/Form/FormElement/FormElement";
const ResetPasswordForm = ({ state, onChange, onSubmit, getFieldError, buttonText }) => {
return <form onSubmit={onSubmit}>
<Grid container spacing={2}>
<FormElement
onChange={onChange}
name="email"
label="Enter your email address"
state={state}
error={getFieldError?.("email")}
/>
</Grid>
<Button
sx={{ mt: "15px" }}
type="submit"
fullWidth
variant="contained"
color="primary"
>
{buttonText}
</Button>
</form>
}
export default ResetPasswordForm;
\ No newline at end of file
planner-front/src/components/UserForm/UserForm.js
View file @ e2fdc5e2
import { Button, Grid} from "@mui/material";
// import { NavLink } from "react-router-dom";
import { NavLink } from "react-router-dom";
import FormElement from "../UI/Form/FormElement/FormElement";
const UserForm = ({ state, onChange, onSubmit, getFieldError, buttonText, resetPassword }) => {
......@@ -30,17 +30,17 @@ const UserForm = ({ state, onChange, onSubmit, getFieldError, buttonText, resetP
>
{buttonText}
</Button>
{/* <Button
<Button
component={NavLink}
to={"/forgottenpassword"}
sx={{ mt: "15px" }}
sx={{ mt: "15px", color: "red" }}
type="submit"
fullWidth
variant="contained"
color="primary"
color="inherit"
>
{resetPassword}
</Button> */}
</Button>
</form>
}
......
planner-front/src/components/UserForm/UserRegistrationForm.js
View file @ e2fdc5e2
......@@ -25,13 +25,13 @@ const UserRegistrationForm = ({ state, onChange, onSubmit, getFieldError, button
state={state}
error={getFieldError?.("email")}
/>
<FormElement
{/* <FormElement
onChange={onChange}
name="number"
label="Number"
state={state}
error={getFieldError?.("number")}
/>
/> */}
<FormElement
onChange={onChange}
name="password"
......@@ -40,12 +40,14 @@ const UserRegistrationForm = ({ state, onChange, onSubmit, getFieldError, button
state={state}
error={getFieldError?.("password")}
/>
{/* <FormElement
<FormElement
onChange={onChange}
name="displayName"
label="DisplayName"
name="confirmPassword"
label="Confirm password"
type="password"
state={state}
/> */}
error={getFieldError?.("password")}
/>
{/* <FormElement
onChange={fileChangeHandler}
name="avatar"
......
planner-front/src/containers/ForgottenPassword/ForgottenPassword.js
View file @ e2fdc5e2
// import { useState } from "react";
// import { useDispatch, useSelector } from "react-redux";
// import { useNavigate } from "react-router-dom";
// import Loader from "../../components/UI/Loader/Loader";
// import UserForm from "../../components/UserForm/UserForm";
// import { loginUser } from "../../store/actions/usersActions";
// import PersonIcon from '@mui/icons-material/Person';
// import styled from "@emotion/styled";
// import { Alert, Avatar, Container, Typography } from "@mui/material";
import { useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { useNavigate } from "react-router-dom";
import Loader from "../../components/UI/Loader/Loader";
import { loginUser } from "../../store/actions/usersActions";
import PersonIcon from '@mui/icons-material/Person';
import styled from "@emotion/styled";
import { Alert, Avatar, Container, Typography } from "@mui/material";
import ResetPasswordForm from "../../components/UserForm/ResetPasswordForm";
// const StyledContainer = styled(Container)`
// padding-top: 30px;
// padding-bottom: 30px;
// box-shadow: 0 18px 30px 0 rgba(0, 0, 0, 0.6);
// border-radius: 6px;
// `;
const StyledContainer = styled(Container)`
padding-top: 30px;
padding-bottom: 30px;
box-shadow: 0 18px 30px 0 rgba(0, 0, 0, 0.6);
border-radius: 6px;
`;
// const StyledTitle = styled(Typography)`
// text-align: center;
// font-size: 30px;
// margin-bottom: 30px;
// `;
const StyledTitle = styled(Typography)`
text-align: center;
font-size: 30px;
margin-bottom: 30px;
`;
// const ForgottenPassword = () => {
// const [state, setState] = useState({
// email: '',
// redirectUrl: 'http://localhost:3000/passwordreset'
// });
const ForgottenPassword = () => {
const [state, setState] = useState({
email: '',
redirectUrl: 'http://localhost:3000/passwordreset'
});
// const dispatch = useDispatch();
// const { loginError, loading } = useSelector(state => state.users);
// console.log(loginError)
// const navigate = useNavigate("/")
const dispatch = useDispatch();
const { loginError, loading } = useSelector(state => state.users);
console.log(loginError)
const navigate = useNavigate("/")
// const inputChangeHandler = (e) => {
// const { name, value } = e.target;
// setState((prevState) => {
// return {
// ...prevState,
// [name]: value
// }
// });
// };
const inputChangeHandler = (e) => {
const { name, value } = e.target;
setState((prevState) => {
return {
...prevState,
[name]: value
}
});
};
// const submitHandler = async (e) => {
// e.preventDefault();
// await dispatch(loginUser(state, navigate));
// };
const submitHandler = async (e) => {
e.preventDefault();
await dispatch(loginUser(state, navigate));
};
// return <>
// <StyledContainer component={"section"} maxWidth={"xs"}>
// {!!loginError && <Alert color="error">{loginError}</Alert>}
// <Avatar sx={{ m: "0 auto 30px" }}>
// <PersonIcon />
// </Avatar>
// <StyledTitle variant={"h1"}>
// Password Reset
// </StyledTitle>
// <UserForm
// onSubmit={submitHandler}
// state={state}
// onChange={inputChangeHandler}
// buttonText={"Sign In"}
// resetPassword={"Forgot your password?"}
// />
// </StyledContainer>
// <Loader loading={loading} />
// </>
// };
return <>
<StyledContainer component={"section"} maxWidth={"xs"}>
{!!loginError && <Alert color="error">{loginError}</Alert>}
<Avatar sx={{ m: "0 auto 30px" }}>
<PersonIcon />
</Avatar>
<StyledTitle variant={"h1"}>
Password Reset
</StyledTitle>
<ResetPasswordForm
onSubmit={submitHandler}
state={state}
onChange={inputChangeHandler}
buttonText={"Submit"}
resetPassword={"Forgot your password?"}
/>
</StyledContainer>
<Loader loading={loading} />
</>
};
// export default ForgottenPassword;
\ No newline at end of file
export default ForgottenPassword;
\ No newline at end of file
planner-front/src/containers/Login/Login.js
View file @ e2fdc5e2
......@@ -62,7 +62,7 @@ const Login = () => {
state={state}
onChange={inputChangeHandler}
buttonText={"Sign In"}
// resetPassword={"Forgot your password?"}
resetPassword={"Forgot your password?"}
/>
</StyledContainer>
<Loader loading={loading} />
......
planner-front/src/containers/MonthCalendar/MonthCalendar.js
View file @ e2fdc5e2
import { useEffect, useState } from 'react';
import { useEffect, useCallback, useState, useMemo } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import MonthCalendarBody from '../../components/MonthCalendarBody/MonthCalendarBody';
import MonthCalendarHeader from '../../components/MonthCalendarHeader/MonthCalendarHeader';
......@@ -9,58 +9,84 @@ function MonthCalendar() {
const { calendarTasks } = useSelector(state => state.tasks);
const [hourFormat, setHourFormat] = useState(false);
const [month, setMonth] = useState('')
const [year, setYear] = useState('')
const [dateNow, setDateNow] = useState({month: '', year: ''})
const [worker, setWorker] = useState('');
const [calendarType, setCalendarType] = useState('Месяц');
const [currentTask, setCurrentTask] = useState({title: '', description: '', priority: null, dateTimeStart: '', dateTimeDue:''})
const [currentTask, setCurrentTask] = useState({title: '', description: '', priority: ''})
const [cellSizes, setCellSizes] = useState({})
useEffect(()=>{
setMonth(new Date().getMonth())
setYear(new Date().getFullYear())
setDateNow({
month: new Date().getMonth(),
year: new Date().getFullYear(),
})
dispatch(fetchCalendarTasks())
}, [dispatch])
const onChangeWorkerHandler = (event) => {
const hoursInDay = useMemo(()=>{
if (hourFormat) {
const arr = ['8:00', '9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00','21:00','22:00']
const cells = arr.length
const xs = 10.8/cells
setCellSizes(()=>{
return {smallCell: 0.6, standarCell: xs}
})
return arr
} else {
const arr = ['8:00', '10:00', '12:00', '14:00', '16:00', '18:00', '20:00', '22:00']
const cells = arr.length
const xs = 10.8/cells
setCellSizes(()=>{
return {smallCell: 0.6, standarCell: xs}
})
return arr
}
}, [hourFormat])
const daysInMonth = useMemo(() => {
const newDaysInMonth = []
const daysInMonthNumber = new Date(dateNow.year, dateNow.month + 1, 0).getDate()
for (let i = 1; i <= daysInMonthNumber; i++) {
const dayOfWeekNumber = new Date(dateNow.year, dateNow.month, i).getDay()
const getDayOfWeekString = ["ВС","ПН","ВТ","СР","ЧТ","ПТ","СБ"][dayOfWeekNumber]
newDaysInMonth.push({dayNumber: i, dayOfWeek: getDayOfWeekString})
}
return newDaysInMonth
}, [dateNow.month, dateNow.year])
const onChangeWorkerHandler = useCallback((event) => {
setWorker(event.target.value);
};
}, []);
const onChangeCalendarTypeHandler = (event) => {
const onChangeCalendarTypeHandler = useCallback((event) => {
setCalendarType(event.target.value);
};
}, []);
const getCurrentMonthString = (month) => {
return ["Январь","Февраль","Март","Апрель","Май","Июнь","Июль","Август","Сентябрь","Октябрь","Ноябрь", "Декабрь"][month];
}
const getCurrentMonthString = useMemo(() => {
return ["Январь","Февраль","Март","Апрель","Май","Июнь","Июль","Август","Сентябрь","Октябрь","Ноябрь", "Декабрь"][dateNow.month];
}, [dateNow.month])
const incrementMonth = () => {
setMonth((prevState)=>{
if (prevState + 1 === 12 ) {
setYear(prevState=>prevState+1)
return 0
const incrementMonth = useCallback(() => {
setDateNow((prevState)=>{
if (prevState.month + 1 === 12 ) {
return { month: 0, year: prevState.year + 1}
}
return prevState + 1
return {...prevState, month: prevState.month + 1}
})
}
}, [])
const decrementMonth = () => {
setMonth((prevState)=>{
if (prevState - 1 === -1) {
setYear(prevState=>prevState-1)
return 11
const decrementMonth = useCallback(() => {
setDateNow((prevState)=>{
if (prevState.month - 1 === -1) {
return { month: 11, year: prevState.year - 1}
}
return prevState - 1
return {...prevState, month: prevState.month - 1}
})
}
}, [])
function dateToISOLikeButLocal(date) {
const offsetMs = date.getTimezoneOffset() * 60 * 1000;
const msLocal = date.getTime() - offsetMs;
const dateLocal = new Date(msLocal);
const iso = dateLocal.toISOString();
return iso;
}
const onChangeCurrentTaskHandler = (e) => {
const onChangeCurrentTaskHandler = useCallback((e) => {
const {name, value} = e.target;
setCurrentTask((prevState) => {
return {
......@@ -68,8 +94,14 @@ function MonthCalendar() {
[name]: value
}
});
};
}, []);
function dateToISOLikeButLocal(date) {
const offsetMs = date.getTimezoneOffset() * 60 * 1000;
const msLocal = date.getTime() - offsetMs;
const dateLocal = new Date(msLocal);
const iso = dateLocal.toISOString();
return iso;
}
const createTaskInCellHandler = (dayNumber, dayHour) => {
const hour = parseInt(dayHour.split(':')[0])
let hourDue
......@@ -82,14 +114,13 @@ function MonthCalendar() {
title:"Задача",
description:"описание",
priority: null,
dateTimeStart: dateToISOLikeButLocal(new Date(year, month, dayNumber, hour, 0)),
dateTimeDue: dateToISOLikeButLocal(new Date(year, month, dayNumber, hourDue, 59)),
dateTimeStart: dateToISOLikeButLocal(new Date(dateNow.year, dateNow.month, dayNumber, hour, 0)),
dateTimeDue: dateToISOLikeButLocal(new Date(dateNow.year, dateNow.month, dayNumber, hourDue, 59)),
}
setCurrentTask((newTask))
}
const sendNewTaskHandler = async () => {
if (currentTask.id) {
setCurrentTask(() => {
return{
......@@ -104,6 +135,7 @@ function MonthCalendar() {
...currentTask,
}}
)
console.log(currentTask)
delete currentTask.infoForCell
await dispatch(addTask(currentTask))
}
......@@ -116,8 +148,7 @@ function MonthCalendar() {
return (
<>
<MonthCalendarHeader
month={month}
year={year}
year={dateNow.year}
getCurrentMonthString={getCurrentMonthString}
decrementMonth={decrementMonth}
incrementMonth={incrementMonth}
......@@ -127,8 +158,8 @@ function MonthCalendar() {
calendarType={calendarType}
/>
<MonthCalendarBody
month={month}
year={year}
month={dateNow.month}
year={dateNow.year}
tasks={calendarTasks}
createTaskInCellHandler={createTaskInCellHandler}
setCurrentTask={setCurrentTask}
......@@ -138,7 +169,11 @@ function MonthCalendar() {
onChangeCurrentTaskHandler={onChangeCurrentTaskHandler}
sendNewTaskHandler={sendNewTaskHandler}
deleteTaskHandler={deleteTaskHandler}
cellSizes={cellSizes}
hoursInDay={hoursInDay}
daysInMonth={daysInMonth}
/>
</>
);
}
......
planner-front/src/containers/Register/Register.js
View file @ e2fdc5e2
......@@ -3,7 +3,7 @@ import { useDispatch, useSelector } from "react-redux";
import { useNavigate } from "react-router-dom";
import Loader from "../../components/UI/Loader/Loader";
import UserForm from "../../components/UserForm/UserRegistrationForm";
import { loginUser, registerUser } from "../../store/actions/usersActions";
import { registerUser } from "../../store/actions/usersActions";
import styled from "@emotion/styled";
import { Avatar, Container, Typography } from "@mui/material";
import LockIcon from "@mui/icons-material/Lock";
......@@ -26,8 +26,9 @@ const Register = () => {
name: '',
surname: "",
email: "",
number: "",
// number: "",
password: '',
confirmPassword: "",
// avatar: "",
});
......@@ -62,9 +63,14 @@ const Register = () => {
const formData = new FormData();
Object.keys(state).forEach(key => {
formData.append(key, state[key]);
console.log("key " + key + "state " + state[key])
})
if (state["password"] === state["confirmPassword"]) {
await dispatch(registerUser(formData, navigate));
await dispatch(loginUser(state, navigate))
} else {
alert("Пароли не совпадают")
}
};
const getFieldError = (fieldname) => {
......
planner-front/src/store/actions/usersActions.js
View file @ e2fdc5e2
......@@ -18,7 +18,9 @@ export const registerUser = (userData, navigate) => {
return async (dispatch) => {
dispatch(registerUserRequest());
try {
console.log("register " + userData)
const response = await axios.post("/users", userData);
console.log(response)
dispatch(registerUserSuccess())
navigate("/")
} catch (error) {
......@@ -49,7 +51,25 @@ const logoutUserFailure = (error) => {
export const loginUser = (userData, navigate) => {
return async (dispatch) => {
try {
console.log(userData)
const response = await axios.post("users/sessions", userData);
console.log(response)
dispatch(loginUserSuccess(response.data.user));
navigate("/")
} catch (e) {
dispatch(loginUserFailure(e?.response?.data?.err))
}
}
}
export const forgottenPassword = (userData, navigate) => {
return async (dispatch) => {
try {
console.log(userData)
const response = await axios.post("users/requestPasswordReset", userData);
// if (userData.email === response.data.email) {
// }
dispatch(loginUserSuccess(response.data));
navigate("/")
} catch (e) {
......
planner-front/src/store/reducers/usersReducer.js
View file @ e2fdc5e2
import { REGISTER_USER_REQUEST, REGISTER_USER_SUCCESS, REGISTER_USER_FAILURE, LOGIN_USER_SUCCESS, LOGIN_USER_FAILURE, LOGOUT_USER_SUCCESS } from "../actionTypes/actionTypes";
const initialState = {
user: {
name: 'Ivan',
surname: 'Petrov',
email: 'test@gmail.com',
role: 'superuser'
},
user: null,
registerError: null,
loginError: null,
loading: false
......@@ -17,12 +12,15 @@ const usersReducer = (state = initialState, action) => {
case REGISTER_USER_REQUEST:
return {...state, loading: true};
case REGISTER_USER_SUCCESS:
console.log("register.user " + action)
return {...state, loading: false};
case REGISTER_USER_FAILURE:
return {...state, loading: false, registerError: action.error};
case LOGIN_USER_SUCCESS:
console.log("action.user " + action)
return {...state, user: action.user};
case LOGIN_USER_FAILURE:
console.log("action.error" + action.error)
return {...state, loginError: action.error};
case LOGOUT_USER_SUCCESS:
return {...state, user: null};
......
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