added store modal tracker
This commit is contained in:
parent
e1ac3bc70e
commit
83f0c67017
@ -8,6 +8,7 @@ import {
|
|||||||
setProject,
|
setProject,
|
||||||
setProjectBoardFetch,
|
setProjectBoardFetch,
|
||||||
editProjectName,
|
editProjectName,
|
||||||
|
getColumnTitle,
|
||||||
} from "../../../redux/projectsTrackerSlice";
|
} from "../../../redux/projectsTrackerSlice";
|
||||||
|
|
||||||
import "./trackerModal.scss";
|
import "./trackerModal.scss";
|
||||||
@ -19,16 +20,18 @@ export const TrackerModal = ({
|
|||||||
defautlInput,
|
defautlInput,
|
||||||
titleProject,
|
titleProject,
|
||||||
projectId,
|
projectId,
|
||||||
titleColumn,
|
|
||||||
}) => {
|
}) => {
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
const projectBoard = useSelector(getProjectBoard);
|
const projectBoard = useSelector(getProjectBoard);
|
||||||
|
|
||||||
const modalType = useSelector(getValueModalType);
|
const modalType = useSelector(getValueModalType);
|
||||||
|
|
||||||
|
const titleColumn = useSelector(getColumnTitle);
|
||||||
|
|
||||||
const [emailWorker, setEmailWorker] = useState("");
|
const [emailWorker, setEmailWorker] = useState("");
|
||||||
const [projectName, setProjectName] = useState(defautlInput);
|
const [projectName, setProjectName] = useState(defautlInput);
|
||||||
const [editTitleColumn, setEditTitleColumn] = useState(titleColumn);
|
const [editTitleColumn, setEditTitleColumn] = useState("");
|
||||||
|
|
||||||
const [valueColumn, setValueColumn] = useState("");
|
const [valueColumn, setValueColumn] = useState("");
|
||||||
const [nameProject, setNameProject] = useState("");
|
const [nameProject, setNameProject] = useState("");
|
||||||
|
|
||||||
@ -239,8 +242,19 @@ export const TrackerModal = ({
|
|||||||
<div className="title-project">
|
<div className="title-project">
|
||||||
<h4>Введите новое название</h4>
|
<h4>Введите новое название</h4>
|
||||||
<div className="input-container">
|
<div className="input-container">
|
||||||
|
{/* {Boolean(projectBoard?.columns) &&
|
||||||
|
Boolean(projectBoard.columns.length) &&
|
||||||
|
projectBoard.columns.map((column) => {
|
||||||
|
// console.log(column.title);
|
||||||
|
// console.log("Lol" + titleColumn.title);
|
||||||
|
if (column.title === titleColumn) {
|
||||||
|
console.log(column.title);
|
||||||
|
|
||||||
|
}
|
||||||
|
})} */}
|
||||||
<input
|
<input
|
||||||
className="name-project"
|
className="name-project"
|
||||||
|
placeholder={titleColumn}
|
||||||
value={editTitleColumn}
|
value={editTitleColumn}
|
||||||
onChange={(e) => setEditTitleColumn(e.target.value)}
|
onChange={(e) => setEditTitleColumn(e.target.value)}
|
||||||
/>
|
/>
|
||||||
|
@ -16,6 +16,7 @@ import {
|
|||||||
setProjectBoardFetch,
|
setProjectBoardFetch,
|
||||||
setToggleTab,
|
setToggleTab,
|
||||||
activeLoader,
|
activeLoader,
|
||||||
|
setColumnTitle,
|
||||||
} from "../../redux/projectsTrackerSlice";
|
} from "../../redux/projectsTrackerSlice";
|
||||||
|
|
||||||
import ModalTicket from "../../components/UI/ModalTicket/ModalTicket";
|
import ModalTicket from "../../components/UI/ModalTicket/ModalTicket";
|
||||||
@ -191,6 +192,12 @@ export const ProjectTracker = () => {
|
|||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
<div className="tracker__tabs__content">
|
<div className="tracker__tabs__content">
|
||||||
|
<TrackerModal
|
||||||
|
active={modalAdd}
|
||||||
|
setActive={setModalAdd}
|
||||||
|
selectedTab={selectedTab}
|
||||||
|
/>
|
||||||
|
|
||||||
{loader && <Loader style="green" />}
|
{loader && <Loader style="green" />}
|
||||||
{!loader && (
|
{!loader && (
|
||||||
<div className="tracker__tabs__content__tasks tasks active__content">
|
<div className="tracker__tabs__content__tasks tasks active__content">
|
||||||
@ -263,12 +270,6 @@ export const ProjectTracker = () => {
|
|||||||
wrapperHover[column.id] ? "tasks__board__hover" : ""
|
wrapperHover[column.id] ? "tasks__board__hover" : ""
|
||||||
}`}
|
}`}
|
||||||
>
|
>
|
||||||
<TrackerModal
|
|
||||||
active={modalAdd}
|
|
||||||
setActive={setModalAdd}
|
|
||||||
selectedTab={selectedTab}
|
|
||||||
titleColumn={column.title}
|
|
||||||
/>
|
|
||||||
<div className="board__head">
|
<div className="board__head">
|
||||||
{/*<span className={wrapperIndex === 3 ? "done" : ""}>*/}
|
{/*<span className={wrapperIndex === 3 ? "done" : ""}>*/}
|
||||||
<span>{column.title}</span>
|
<span>{column.title}</span>
|
||||||
@ -302,6 +303,7 @@ export const ProjectTracker = () => {
|
|||||||
[column.id]: false,
|
[column.id]: false,
|
||||||
}));
|
}));
|
||||||
dispatch(modalToggle("editColumn"));
|
dispatch(modalToggle("editColumn"));
|
||||||
|
dispatch(setColumnTitle(column.title));
|
||||||
setModalAdd(true);
|
setModalAdd(true);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
@ -6,7 +6,8 @@ const initialState = {
|
|||||||
projectBoard: {},
|
projectBoard: {},
|
||||||
toggleTab: 1,
|
toggleTab: 1,
|
||||||
modalType: "",
|
modalType: "",
|
||||||
boardLoader: false
|
titleColumn: "",
|
||||||
|
boardLoader: false,
|
||||||
};
|
};
|
||||||
|
|
||||||
export const setProjectBoardFetch = createAsyncThunk("userInfo", (id) =>
|
export const setProjectBoardFetch = createAsyncThunk("userInfo", (id) =>
|
||||||
@ -29,12 +30,12 @@ export const projectsTrackerSlice = createSlice({
|
|||||||
deleteProject: (state, action) => {
|
deleteProject: (state, action) => {
|
||||||
state.projects.forEach((project) => {
|
state.projects.forEach((project) => {
|
||||||
if (project.id === action.payload.id) {
|
if (project.id === action.payload.id) {
|
||||||
project.status = 10
|
project.status = 10;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
activeLoader: (state) => {
|
activeLoader: (state) => {
|
||||||
state.boardLoader = true
|
state.boardLoader = true;
|
||||||
},
|
},
|
||||||
moveProjectTask: (state, action) => {
|
moveProjectTask: (state, action) => {
|
||||||
state.projectBoard.columns.forEach((column, index) => {
|
state.projectBoard.columns.forEach((column, index) => {
|
||||||
@ -58,18 +59,21 @@ export const projectsTrackerSlice = createSlice({
|
|||||||
editProjectName: (state, action) => {
|
editProjectName: (state, action) => {
|
||||||
state.projects.forEach((project) => {
|
state.projects.forEach((project) => {
|
||||||
if (project.id === action.payload.id) {
|
if (project.id === action.payload.id) {
|
||||||
project.name = action.payload.name
|
project.name = action.payload.name;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
modalToggle: (state, action) => {
|
modalToggle: (state, action) => {
|
||||||
state.modalType = action.payload;
|
state.modalType = action.payload;
|
||||||
},
|
},
|
||||||
|
setColumnTitle: (state, action) => {
|
||||||
|
state.titleColumn = action.payload;
|
||||||
|
},
|
||||||
},
|
},
|
||||||
extraReducers: {
|
extraReducers: {
|
||||||
[setProjectBoardFetch.fulfilled]: (state, action) => {
|
[setProjectBoardFetch.fulfilled]: (state, action) => {
|
||||||
state.projectBoard = action.payload;
|
state.projectBoard = action.payload;
|
||||||
state.boardLoader = false
|
state.boardLoader = false;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@ -82,13 +86,15 @@ export const {
|
|||||||
setToggleTab,
|
setToggleTab,
|
||||||
modalToggle,
|
modalToggle,
|
||||||
activeLoader,
|
activeLoader,
|
||||||
editProjectName
|
editProjectName,
|
||||||
|
setColumnTitle,
|
||||||
} = projectsTrackerSlice.actions;
|
} = projectsTrackerSlice.actions;
|
||||||
|
|
||||||
export const getProjects = (state) => state.tracker.projects;
|
export const getProjects = (state) => state.tracker.projects;
|
||||||
export const getProjectBoard = (state) => state.tracker.projectBoard;
|
export const getProjectBoard = (state) => state.tracker.projectBoard;
|
||||||
export const getToggleTab = (state) => state.tracker.toggleTab;
|
export const getToggleTab = (state) => state.tracker.toggleTab;
|
||||||
export const getValueModalType = (state) => state.tracker.modalType;
|
export const getValueModalType = (state) => state.tracker.modalType;
|
||||||
export const getBoarderLoader = (state) => state.tracker.boardLoader
|
export const getColumnTitle = (state) => state.tracker.titleColumn;
|
||||||
|
export const getBoarderLoader = (state) => state.tracker.boardLoader;
|
||||||
|
|
||||||
export default projectsTrackerSlice.reducer;
|
export default projectsTrackerSlice.reducer;
|
||||||
|
Loading…
Reference in New Issue
Block a user