Merge branch 'development' of…

Merge branch 'development' of ssh://git.attractor-school.com:30022/apollo64/crm-team-one into task-36-fix/fix_back_put_task

planner-front/src/components/Menus/AdminMenu/AdminMenu.js

-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

-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/MyTasksCompoments/CustomTableCell.js

-import * as React from 'react';
-import TableCell from '@mui/material/TableCell';
-import IconButton from '@mui/material/IconButton';
-import Input from '@mui/material/Input';
-import { Done, CalendarToday } from '@mui/icons-material';
-import MaterialUIPickers from '../UI/DateTimePicker/DateTimePicker';
+import * as React from "react";
+import TableCell from "@mui/material/TableCell";
+import Input from "@mui/material/Input";
 
+const CustomTableCell = ({ task, name, value, onChange, onModalOpen }) => {
+  const styles = { width: "auto", height: "10px"};
 
-const  CustomTableCell = ({ task, name, onChange, onModalOpen }) => {
-
-  const styles = { width: "auto", height: "40px" };
-
-  return (
-    <>
-{task.isEditMode && name === "title" ? (
-    <TableCell 
-    onClick={(e) => onModalOpen(e, task)} align="left" style={styles}>
-        <Input
-          value={task[name]}
-          name={name}
-          onChange={(e) => onChange(e, task)}
+  if (task) {
+    return (
+      <>
+        <TableCell
+          onClick={(e) => (onModalOpen ? onModalOpen(e, task) : null)}
+          align="left"
           style={styles}
-        />
-    </TableCell>
-      ) : task.isEditMode && name !== "title"? (
-        <TableCell align="left" style={styles}>
-        <Input
-          value={task[name]}
-          name={name}
-          onChange={(e) => onChange(e, task)}
-          style={styles}
-        />
-        </TableCell>
-      ) : onModalOpen ? (
-        <TableCell align="left" style={styles} onClick={(e) => onModalOpen(e, task)}>
-        <span style={{ width: "100%" }} >
-          {task[name]}
-        </span>
+        >
+          {task.isEditMode && onChange ? (
+            <Input
+              value={value}
+              name={name}
+              onChange={(e) => onChange(e, task)}
+              style={styles}
+            />
+          ) : (
+            <span>{value}</span>
+          )}
         </TableCell>
-      ) : (
-        <TableCell align="left" style={styles}>
-        {task[name]}
-        
-        </TableCell>
-      )}
-</>
-  );
+      </>
+    );
+  }
 };
 
-
-export default  CustomTableCell;
-
- 
\ No newline at end of file
+export default CustomTableCell;

planner-front/src/components/MyTasksCompoments/DateTimePicker/DateTimePicker.js

+import * as React from "react";
+import TextField from "@mui/material/TextField";
+import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
+import { DateTimePicker } from "@mui/x-date-pickers/DateTimePicker";
+import { AdapterMoment } from "@mui/x-date-pickers/AdapterMoment";
+
+export default function MaterialUIPickers(props) {
+  return (
+    <LocalizationProvider
+      dateAdapter={AdapterMoment}
+      sx={{ width: "auto", fontSize: 5, fontWeight: "200" }}
+    >
+      <DateTimePicker
+        disabled={props.task.readOnly}
+        renderInput={(params) => (
+          <TextField
+            {...params}
+            sx={{ width: "auto", fontWeight: "200", fontSize: 5 }}
+            name={props.name}
+          />
+        )}
+        value={props.task[props.name]}
+        onChange={(newValue) => {
+          props.onChange(props.task.id, newValue, props.name);
+        }}
+      />
+    </LocalizationProvider>
+  );
+}

planner-front/src/components/MyTasksCompoments/TaskModal/TaskModal.js

-import { Modal, IconButton } from '@mui/material';
-import './TaskModal.css';
-import { Done } from '@mui/icons-material';
-import Input from '@mui/material/Input';
-import { useState, useEffect } from "react";
+import { Modal, IconButton } from "@mui/material";
+import "./TaskModal.css";
+import { Done } from "@mui/icons-material";
+import Input from "@mui/material/Input";
 
 const TaskModal = (props) => {
-
-  const [taskContent, setTaskContent] = useState();
-  
-  useEffect(() => {
-    if (props.task !== null) {
-      setTaskContent({
-        title: props.task.title,
-        description: props.task.description,
-      });
-    }
-  }, [props.task]);
-  
-
-  const inputChangeHandler = (e) => {
-    const { name, value } = e.target;
-    setTaskContent((prevState) => {
-      return { ...prevState, [name]: value };
-    });
-    props.onChange(e, props.task);
-  };
-
-  const saveModalData=()=>{
-      props.handleClose()
-  };
- 
-    return (
-        <Modal
-        aria-labelledby="transition-modal-title"
-        aria-describedby="transition-modal-description"
-        className={"modal"}
-        closeAfterTransition
-        onClose={props.handleClose}
-        open={props.open}
-      >
-{ props?.task?.isEditMode ? 
-
+  return (
+    <Modal
+      aria-labelledby="transition-modal-title"
+      aria-describedby="transition-modal-description"
+      className={"modal"}
+      closeAfterTransition
+      onClose={props.handleClose}
+      open={props.open}
+    >
+      {props?.task?.isEditMode ? (
         <div className="modalBox">
-        <Input
-               value={taskContent?.title}
-               name={"title"}
-               onChange={inputChangeHandler}
-               style={{ width: "auto", fontSize:"12px",color: "white",fontWeight: "600" }}
-                />
           <Input
-                value={taskContent?.description}
-                name={"description"}
-                onChange={inputChangeHandler}
-                style={{ width: "auto", fontSize:"12px",color: "white" }}
-                />   
-            <IconButton
-              aria-label="done"
-              onClick={saveModalData}
-            >
-              <Done/>
-            </IconButton>        
-        </div>:
-        
+            value={props.task.title}
+            name="title"
+            onChange={(e) => props.onChange(e, props.task)}
+            style={{
+              width: "auto",
+              fontSize: "12px",
+              color: "white",
+              fontWeight: "600",
+            }}
+          />
+          <Input
+            value={props.task.description}
+            name="description"
+            onChange={(e) => props.onChange(e, props.task)}
+            style={{ width: "auto", fontSize: "12px", color: "white" }}
+          />
+          <IconButton aria-label="done" onClick={props.handleClose}>
+            <Done />
+          </IconButton>
+        </div>
+      ) : (
         <div className="modalBox">
-          { props.task && props.task.title && (
+          {props.task && props.task.title && (
             <div
               style={{
                 width: "200px",
                 height: "200px",
                 color: "white",
-                fontWeight: "600"
+                fontWeight: "600",
               }}
             >
               {props.task.title}
@@ -88,9 +63,9 @@ const TaskModal = (props) => {
             X
           </IconButton>
         </div>
-  }
-      </Modal>
-    );
-  };
-  
-export default TaskModal;
\ No newline at end of file
+      )}
+    </Modal>
+  );
+};
+
+export default TaskModal;

planner-front/src/components/UI/DateTimePicker/DateTimePicker.js

-import * as React from 'react';
-import TextField from '@mui/material/TextField';
-import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
-import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
-import { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';
-import { useState, useEffect } from "react";
-import dayjs from 'dayjs';
-import { AdapterMoment } from "@mui/x-date-pickers/AdapterMoment";
-
-export default function MaterialUIPickers(props) {
- 
-console.log(props)
- 
-if (props.task.dateTimeStart!==undefined)
-  return (
-    <LocalizationProvider dateAdapter={AdapterMoment}>
-    <DateTimePicker
-      renderInput={(params) => (
-        <TextField {...params} name="dateCreated" />
-      )}
-      value={
-        props.newStartedDate && props.newStartedDate.id === props.task.id? props.newStartedDate.date
-          : props.task.dateTimeStart
-      }
-      onChange={(newValue) => {
-        props.setNewStartedDate({
-          id: props.task.id,
-          date: newValue,
-        });
-      }}
-    />
-  </LocalizationProvider>
-  );
-
-else if(props.task.dateTimeDue!==undefined) {
-  return (
-    <LocalizationProvider dateAdapter={AdapterMoment}>
-    <DateTimePicker
-      renderInput={(params) => (
-        <TextField {...params} name="dateCreated" />
-      )}
-      value={
-        props.newDueDate && props.newDueDate.id === props.task.id? props.newDueDate.date
-          : props.task.dateTimeDue
-      }
-      onChange={(newValue) => {
-        props.setNewDueDate({
-          id: props.task.id,
-          date: newValue,
-        });
-      }}
-    />
-  </LocalizationProvider>
-  );
-}
-}
\ No newline at end of file

planner-front/src/components/UI/Select/Select.js

+import * as React from "react";
+import Box from "@mui/material/Box";
+import InputLabel from "@mui/material/InputLabel";
+import MenuItem from "@mui/material/MenuItem";
+import FormControl from "@mui/material/FormControl";
+import Select from "@mui/material/Select";
+
+export default function BasicSelect(props) {
+  return (
+    <Box sx={{ minWidth: 60 }}>
+      <FormControl fullWidth>
+        <InputLabel id="demo-simple-select-label"></InputLabel>
+        <Select
+          labelId="demo-simple-select-label"
+          id="demo-simple-select"
+          value={props.task.accomplish}
+          label=""
+          name={"accomplish"}
+          onChange={(e) => props.onChange(e, props.task)}
+          sx={{ marginTop: 2 }}
+        >
+          {props.items.map((item) => (
+            <MenuItem value={item}>{item}</MenuItem>
+          ))}
+        </Select>
+      </FormControl>
+    </Box>
+  );
+}

planner-front/src/components/UserForm/UserRegistrationForm.js

@@ -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/MyTasks/MyTasksHeader/MyTasksHeader.js

@@ -22,41 +22,41 @@ const headCells = [
     label: 'Приоритет',
   },
   {
-    id: 'date',
+    id: 'createdAt',
     numeric: true,
     disablePadding: false,
-    label: 'Дата',
+    label: 'Дата создания',
   },
   {
-    id: 'task',
+    id: 'title',
     numeric: true,
     disablePadding: false,
-    label: 'Задача',
+    label: 'Заголовок',
   },
   {
-    id: 'author',
+    id: 'authorDisplayName',
     numeric: true,
     disablePadding: false,
     label: 'Автор',
   },
   
   {
-    id: 'startDate',
+    id: 'dateTimeStart',
     numeric: true,
     disablePadding: false,
     label: 'Дата начала',
   },
   {
-    id: 'endDate',
+    id: 'dateTimeDue',
     numeric: true,
     disablePadding: false,
     label: 'Дата завершения',
   },
   {
-    id: 'done',
+    id: 'accomplish',
     numeric: true,
     disablePadding: false,
-    label: 'Выполнено',
+    label: 'Статус',
   },
   {
     id: 'change',
@@ -115,4 +115,3 @@ EnhancedTableHead.propTypes = {
   orderBy: PropTypes.string.isRequired,
   rowCount: PropTypes.number.isRequired,
 };
-

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

@@ -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"; 
@@ -28,6 +28,7 @@ const Register = () => {
         email: "",
         // number: "",
         password: '',
+        confirmPassword: "",
         // avatar: "",
     });
 
@@ -64,8 +65,12 @@ const Register = () => {
             formData.append(key, state[key]);
             console.log("key " + key + "state " + state[key])
         })
-        await dispatch(registerUser(formData, navigate));
-        //  dispatch(loginUser(state, navigate))
+        if (state["password"] === state["confirmPassword"]) {
+            await dispatch(registerUser(formData, navigate));
+        } else {
+            alert("Пароли не совпадают")
+        }
+       
     };
 
     const getFieldError = (fieldname) => {

planner-front/src/store/actionTypes/tasksTypes.js

@@ -2,6 +2,8 @@ export const FETCH_CALENDAR_TASKS_REQUEST = "FETCH_CALENDAR_TASKS_REQUEST";
 export const FETCH_CALENDAR_TASKS_SUCCESS = "FETCH_CALENDAR_TASKS_SUCCESS";
 export const FETCH_CALENDAR_TASKS_FAILURE = "FETCH_CALENDAR_TASKS_FAILURE";
 
+export const FETCH_ALL_TASKS_SUCCESS = "FETCH_ALL_TASKS_SUCCESS";
+
 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";

planner-front/src/store/actions/tasksActions.js

@@ -10,7 +10,8 @@ import {
   EDIT_TASK_SUCCESS, 
   FETCH_CALENDAR_TASKS_FAILURE, 
   FETCH_CALENDAR_TASKS_REQUEST, 
-  FETCH_CALENDAR_TASKS_SUCCESS} from "../actionTypes/tasksTypes";
+  FETCH_CALENDAR_TASKS_SUCCESS,
+  FETCH_ALL_TASKS_SUCCESS} from "../actionTypes/tasksTypes";
 import axios from '../../axiosPlanner'
 
 const fetchCalendarTasksRequest = () => {
@@ -21,6 +22,11 @@ const fetchCalendarTasksSuccess = (tasks) => {
   return {type: FETCH_CALENDAR_TASKS_SUCCESS, tasks}
 };
 
+const fetchAllTasksSuccess = (tasks) => {
+  return {type: FETCH_ALL_TASKS_SUCCESS, tasks}
+};
+
+
 const fetchCalendarTasksFailure = (error) => {
   return {type: FETCH_CALENDAR_TASKS_FAILURE, error}
 };
@@ -35,8 +41,18 @@ export const fetchCalendarTasks = () => {
         dispatch(fetchCalendarTasksFailure(error.response.data));
       }
   }
-}
-
+};
+export const fetchAllTasks = () => {
+  return async (dispatch) => {
+      dispatch(fetchCalendarTasksRequest());
+      try {
+        const response = await axios.get("/tasks");
+           dispatch(fetchAllTasksSuccess(response.data.tasks))
+      } catch (error) {
+        dispatch(fetchCalendarTasksFailure(error.response.data));
+      }
+  }
+};
 const addTaskRequest = () => {
   return {type: ADD_NEW_TASK_REQUEST}
 };
@@ -84,12 +100,15 @@ export const editTask = (task) => {
       dispatch(editTaskRequest());
       const token = getState().users?.user?.token;
       try {
-        await axios.put("/tasks", task, {
+        console.log(task)
+        const r=await axios.put("/tasks", task, {
           headers: {
             'Authorization': 'IwGVRaksGTWtnKlOZd7zJ'
           }
         });
+        console.log(r)
         dispatch(editTaskSuccess())
+        dispatch(fetchAllTasks())
         dispatch(fetchCalendarTasks())
       } catch (error) {
         dispatch(editTaskFailure(error.response.data));
@@ -100,7 +119,7 @@ export const editTask = (task) => {
 const deleteTaskRequest = () => {
   return {type: DELETE_TASK_REQUEST}
 };
-
+ 
 const deleteTaskSuccess = () => {
   return {type: DELETE_TASK_SUCCESS}
 };
@@ -121,6 +140,7 @@ export const deleteTask = (taskId) => {
         });
         dispatch(deleteTaskSuccess())
         dispatch(fetchCalendarTasks())
+        dispatch(fetchAllTasks())
       } catch (error) {
         dispatch(deleteTaskFailure(error.response.data));
       }

planner-front/src/store/actions/usersActions.js

@@ -20,6 +20,7 @@ export const registerUser = (userData, navigate) => {
         try {
             console.log("register " + userData)
            const response = await axios.post("/users", userData);
+           console.log(response)
             dispatch(registerUserSuccess())
             navigate("/")
         } catch (error) {

planner-front/src/store/reducers/tasksReducer.js

@@ -10,7 +10,8 @@ import {
   FETCH_CALENDAR_TASKS_SUCCESS,
   DELETE_TASK_SUCCESS,
   DELETE_TASK_REQUEST,
-  DELETE_TASK_FAILURE} from "../actionTypes/tasksTypes";
+  DELETE_TASK_FAILURE,
+  FETCH_ALL_TASKS_SUCCESS} from "../actionTypes/tasksTypes";
 
 const initialState = {
     calendarTasks: [],
@@ -24,7 +25,7 @@ const tasksReduсer = (state = initialState, action) => {
         return {...state, loading: true};
     case FETCH_CALENDAR_TASKS_SUCCESS:
         const newArr = []
-        action.tasks.forEach((task)=>{
+          action.tasks.forEach((task)=>{
             if (task.dateTimeStart && task.dateTimeDue) {
               if (new Date(task.dateTimeDue).getTime() - new Date(task.dateTimeStart).getTime() < (10 * 3600000)) {
               const dateStart = task.dateTimeStart.split('T')[0]
@@ -51,6 +52,8 @@ const tasksReduсer = (state = initialState, action) => {
             }
           })
         return {...state, loading: false, calendarTasks: newArr};
+    case FETCH_ALL_TASKS_SUCCESS:
+        return {...state, loading: false, tasks: action.tasks}; 
     case FETCH_CALENDAR_TASKS_FAILURE:
         return {...state, loading: false, error: action.error};
     case ADD_NEW_TASK_SUCCESS: