Commit ef008f9f authored by Ermolaev Timur's avatar Ermolaev Timur

#61 Чуть улучшил код, добавил запросы для страницы календаря

parent 27c4fb66
import { Box } from "@mui/material"; import { Box } from "@mui/material";
import { memo } from "react"; import { memo } from "react";
const DefaultTask = ({}) => { const DefaultTaskStyles = {
position: 'relative',
height: '30px',
backgroundColor: 'lightgreen',
whiteSpace: 'nowrap',
overflow: 'hidden',
textOverflow: 'ellipsis',
borderRadius: '10px',
margin: '5px 10px',
display: 'flex',
justifyContent: 'flex-start',
alignItems: 'center',
paddingLeft: '5px',
zIndex: '5'
}
const DefaultTask = ({}) => {
return (<> return (<>
<Box <Box
sx={{ position: 'relative', height: '30px', backgroundColor: 'lightgreen', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis', borderRadius: '10px', margin: '5px 10px', display: 'flex', justifyContent: 'flex-start', alignItems: 'center', paddingLeft: '5px', zIndex: '5'}} sx={DefaultTaskStyles}
> >
<span> <span>
Задача Задача
......
...@@ -3,7 +3,7 @@ import { Box } from '@mui/system'; ...@@ -3,7 +3,7 @@ import { Box } from '@mui/system';
import MonthAndYearInfo from './MonthAndYearInfo/MonthAndYearInfo'; import MonthAndYearInfo from './MonthAndYearInfo/MonthAndYearInfo';
import СustomSelect from '../UI/СustomSelect/СustomSelect' import СustomSelect from '../UI/СustomSelect/СustomSelect'
const workers = [{value: '', text: '--выберите сотрудника'}, {value: 'Василий', text: 'Василий'}, {value: 'Никита', text: 'Никита'}] const workers = [{value: '', text: '--выберите сотрудника--'}, {value: 'Василий', text: 'Василий'}, {value: 'Никита', text: 'Никита'}]
const types = [{value: 'Месяц', text: 'Месяц'}, {value: 'Неделя', text: 'Неделя'}] const types = [{value: 'Месяц', text: 'Месяц'}, {value: 'Неделя', text: 'Неделя'}]
function MonthCalendarHeader({ currentMonthString, decrementMonth, incrementMonth, calendarType, onChangeWorkerHandler, onChangeCalendarTypeHandler, worker, year}) { function MonthCalendarHeader({ currentMonthString, decrementMonth, incrementMonth, calendarType, onChangeWorkerHandler, onChangeCalendarTypeHandler, worker, year}) {
......
import { Button, FormControl, InputLabel, MenuItem, Select, TextField } from "@mui/material"; import { Button, FormControl, InputLabel, MenuItem, Select, TextField } from "@mui/material";
import { memo } from "react";
import CustomSelect from '../UI/СustomSelect/СustomSelect'
const priorities = [{value: '', text: '--Приоритет--'}, {value: 'A', text: 'A'}, {value: 'B', text: 'B'}, {value: 'C', text: 'C'}]
function MonthCalendarModalContent({title, onChangeCurrentTaskHandler, description, priority, sendNewTaskHandler, deleteTaskHandler}) { function MonthCalendarModalContent({title, onChangeCurrentTaskHandler, description, priority, sendNewTaskHandler, deleteTaskHandler}) {
return (<> return (<>
...@@ -22,28 +27,20 @@ function MonthCalendarModalContent({title, onChangeCurrentTaskHandler, descripti ...@@ -22,28 +27,20 @@ function MonthCalendarModalContent({title, onChangeCurrentTaskHandler, descripti
name='description' name='description'
onChange={(e)=>{onChangeCurrentTaskHandler(e)}} onChange={(e)=>{onChangeCurrentTaskHandler(e)}}
/> />
<FormControl variant="outlined" sx={{width: '160px', marginBottom: '30px'}}>
<InputLabel id="priority-type-label">Приоритет</InputLabel> <CustomSelect
<Select defaultValue={''}
labelId="priority-type-label"
id="priority-type"
label="Приоритет"
sx={{width: '160px'}}
value={priority} value={priority}
name='priority' name={'priority'}
onChange={onChangeCurrentTaskHandler} variant={'outlined'}
> onChange={(e)=>{onChangeCurrentTaskHandler(e)}}
<MenuItem value={null}> label={'Приоритет'}
<em>-- Выберите Приоритет --</em> id={'priority-type'}
</MenuItem> items={priorities}
<MenuItem value={"A"}>A</MenuItem> />
<MenuItem value={"B"}>B</MenuItem>
<MenuItem value={"C"}>C</MenuItem>
</Select>
</FormControl>
<Button sx={{marginRight: '40px'}} onClick={sendNewTaskHandler}>Сохранить</Button> <Button sx={{marginRight: '40px'}} onClick={sendNewTaskHandler}>Сохранить</Button>
<Button onClick={deleteTaskHandler}>Удалить</Button> <Button onClick={deleteTaskHandler}>Удалить</Button>
</>); </>);
} }
export default MonthCalendarModalContent; export default memo(MonthCalendarModalContent);
\ No newline at end of file \ No newline at end of file
import { FormControl, InputLabel, MenuItem, Select} from '@mui/material'; import { FormControl, InputLabel, MenuItem, Select} from '@mui/material';
import { memo } from 'react'; import { memo } from 'react';
function СustomSelect({value, onChange, label, variant='standard', items, id}) { function СustomSelect({value, onChange, label, variant='standard', items, id, defaultValue, name}) {
return ( return (
<> <>
...@@ -13,6 +13,8 @@ function СustomSelect({value, onChange, label, variant='standard', items, id}) ...@@ -13,6 +13,8 @@ function СustomSelect({value, onChange, label, variant='standard', items, id})
value={value} value={value}
onChange={onChange} onChange={onChange}
label={label} label={label}
name={name}
defaultValue={defaultValue}
> >
{items.map((item, i)=>{ {items.map((item, i)=>{
return ( return (
......
...@@ -3,7 +3,7 @@ import { useDispatch, useSelector } from 'react-redux'; ...@@ -3,7 +3,7 @@ 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 { dateToISOLikeButLocal, getCurrentMonthString, getDaysInMonth } from '../../helpers/CalendarHelpers'; import { dateToISOLikeButLocal, getCurrentMonthString, getDaysInMonth } from '../../helpers/CalendarHelpers';
import { addTask, deleteTask, editTask, fetchCalendarTasks} from '../../store/actions/tasksActions'; import { addCalendarTask, deleteCalendarTask, editCalendarTask, fetchCalendarTasks} from '../../store/actions/tasksActions';
function MonthCalendar() { function MonthCalendar() {
const dispatch = useDispatch(); const dispatch = useDispatch();
...@@ -124,7 +124,7 @@ function MonthCalendar() { ...@@ -124,7 +124,7 @@ function MonthCalendar() {
dateTimeDue: due dateTimeDue: due
} }
delete newObj.infoForCell delete newObj.infoForCell
await dispatch(editTask(newObj)) await dispatch(editCalendarTask(newObj))
setCurrentTask({}) setCurrentTask({})
} }
...@@ -152,7 +152,7 @@ function MonthCalendar() { ...@@ -152,7 +152,7 @@ function MonthCalendar() {
dateTimeDue: due dateTimeDue: due
} }
delete newObj.infoForCell delete newObj.infoForCell
await dispatch(editTask(newObj)) await dispatch(editCalendarTask(newObj))
setCurrentTask({}) setCurrentTask({})
} }
...@@ -185,7 +185,7 @@ function MonthCalendar() { ...@@ -185,7 +185,7 @@ function MonthCalendar() {
dateTimeDue: due dateTimeDue: due
} }
delete newObj.infoForCell delete newObj.infoForCell
await dispatch(editTask(newObj)) await dispatch(editCalendarTask(newObj))
setCurrentTask({}) setCurrentTask({})
} }
} }
...@@ -198,7 +198,7 @@ function MonthCalendar() { ...@@ -198,7 +198,7 @@ function MonthCalendar() {
...currentTask, ...currentTask,
}} }}
) )
await dispatch(editTask(currentTask)) await dispatch(editCalendarTask(currentTask))
} else { } else {
setCurrentTask(() => { setCurrentTask(() => {
return{ return{
...@@ -206,7 +206,7 @@ function MonthCalendar() { ...@@ -206,7 +206,7 @@ function MonthCalendar() {
}} }}
) )
delete currentTask.infoForCell delete currentTask.infoForCell
await dispatch(addTask(currentTask)) await dispatch(addCalendarTask(currentTask))
} }
} }
...@@ -227,12 +227,12 @@ function MonthCalendar() { ...@@ -227,12 +227,12 @@ function MonthCalendar() {
} }
delete newTask.infoForCell delete newTask.infoForCell
delete newTask.id delete newTask.id
await dispatch(addTask(newTask)) await dispatch(addCalendarTask(newTask))
setCopyTask(null) setCopyTask(null)
} }
const deleteTaskHandler = async (taskId) => { const deleteTaskHandler = async (taskId) => {
dispatch(deleteTask(taskId)) dispatch(deleteCalendarTask(taskId))
} }
return ( return (
......
...@@ -46,6 +46,7 @@ export const fetchCalendarTasks = () => { ...@@ -46,6 +46,7 @@ export const fetchCalendarTasks = () => {
} }
} }
}; };
export const fetchAllTasks = () => { export const fetchAllTasks = () => {
return async (dispatch) => { return async (dispatch) => {
dispatch(fetchCalendarTasksRequest()); dispatch(fetchCalendarTasksRequest());
...@@ -69,34 +70,26 @@ const addTaskFailure = (error) => { ...@@ -69,34 +70,26 @@ const addTaskFailure = (error) => {
return {type: ADD_NEW_TASK_FAILURE, error} return {type: ADD_NEW_TASK_FAILURE, error}
}; };
// export const addTask = (task) => { export const addCalendarTask = (task) => {
// return async (dispatch, getState) => { return async (dispatch, getState) => {
// dispatch(addTaskRequest()); dispatch(addTaskRequest());
// const token = getState().users?.user?.token; try {
// try { await axios.post("/tasks", task);
// await axios.post("/tasks", task, { dispatch(addTaskSuccess())
// headers: { dispatch(fetchCalendarTasks())
// Authorization: token, } catch (error) {
// }, dispatch(addTaskFailure(error.response.data));
// }); }
// dispatch(addTaskSuccess()); }
// dispatch(fetchCalendarTasks()); }
// } catch (error) {
// dispatch(addTaskFailure(error.response.data));
// }
// };
// };
export const addTask = (task) => { export const addTask = (task) => {
return async (dispatch, getState) => { return async (dispatch, getState) => {
dispatch(addTaskRequest()); dispatch(addTaskRequest());
// const token = getState().users?.user?.token;
try { try {
await axios.post("/tasks", task); await axios.post("/tasks", task);
dispatch(addTaskSuccess()) dispatch(addTaskSuccess())
dispatch(fetchAllTasks()) dispatch(fetchAllTasks())
dispatch(fetchCalendarTasks())
} catch (error) { } catch (error) {
dispatch(addTaskFailure(error.response.data)); dispatch(addTaskFailure(error.response.data));
} }
...@@ -122,6 +115,18 @@ export const editTask = (task) => { ...@@ -122,6 +115,18 @@ export const editTask = (task) => {
await axios.put("/tasks", task); await axios.put("/tasks", task);
dispatch(editTaskSuccess()) dispatch(editTaskSuccess())
dispatch(fetchAllTasks()) dispatch(fetchAllTasks())
} catch (error) {
dispatch(editTaskFailure(error.response.data));
}
}
}
export const editCalendarTask = (task) => {
return async (dispatch, getState) => {
dispatch(editTaskRequest());
try {
await axios.put("/tasks", task);
dispatch(editTaskSuccess())
dispatch(fetchCalendarTasks()) dispatch(fetchCalendarTasks())
} catch (error) { } catch (error) {
dispatch(editTaskFailure(error.response.data)); dispatch(editTaskFailure(error.response.data));
...@@ -144,11 +149,9 @@ const deleteTaskFailure = (error) => { ...@@ -144,11 +149,9 @@ const deleteTaskFailure = (error) => {
export const deleteTask = (taskId) => { export const deleteTask = (taskId) => {
return async (dispatch, getState) => { return async (dispatch, getState) => {
dispatch(deleteTaskRequest()); dispatch(deleteTaskRequest());
// const token = getState().users?.user?.token;
try { try {
await axios.delete(`/tasks/${taskId}`); await axios.delete(`/tasks/${taskId}`);
dispatch(deleteTaskSuccess()) dispatch(deleteTaskSuccess())
dispatch(fetchCalendarTasks())
dispatch(fetchAllTasks()) dispatch(fetchAllTasks())
} catch (error) { } catch (error) {
dispatch(deleteTaskFailure(error.response.data)); dispatch(deleteTaskFailure(error.response.data));
...@@ -156,6 +159,20 @@ export const deleteTask = (taskId) => { ...@@ -156,6 +159,20 @@ export const deleteTask = (taskId) => {
} }
} }
export const deleteCalendarTask = (taskId) => {
return async (dispatch, getState) => {
dispatch(deleteTaskRequest());
try {
await axios.delete(`/tasks/${taskId}`);
dispatch(deleteTaskSuccess())
dispatch(fetchCalendarTasks())
} catch (error) {
dispatch(deleteTaskFailure(error.response.data));
}
}
}
const fetchTasksByProjectRequest = () => { const fetchTasksByProjectRequest = () => {
return {type: FETCH_TASKS_BY_PROJECT_REQUEST} return {type: FETCH_TASKS_BY_PROJECT_REQUEST}
......
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