executor filter tasks
This commit is contained in:
@@ -7,7 +7,7 @@ import { Link } from "react-router-dom";
|
||||
import { getProfileInfo } from "@redux/outstaffingSlice";
|
||||
import { setProjectBoardFetch } from "@redux/projectsTrackerSlice";
|
||||
|
||||
import { getCorrectRequestDate, urlForLocal } from "@utils/helper";
|
||||
import { caseOfNum, getCorrectRequestDate, urlForLocal } from "@utils/helper";
|
||||
|
||||
import { apiRequest } from "@api/request";
|
||||
|
||||
@@ -429,7 +429,7 @@ export const ModalTiсket = ({
|
||||
Загрузить файл
|
||||
</button>
|
||||
<span>{0}</span>
|
||||
Файлов
|
||||
{caseOfNum(0, "files")}
|
||||
</p>
|
||||
</div>
|
||||
<div className="content__input">
|
||||
|
||||
@@ -11,7 +11,7 @@ import {
|
||||
setToggleTab,
|
||||
} from "@redux/projectsTrackerSlice";
|
||||
|
||||
import { getCorrectRequestDate, urlForLocal } from "@utils/helper";
|
||||
import { caseOfNum, getCorrectRequestDate, urlForLocal } from "@utils/helper";
|
||||
|
||||
import { apiRequest } from "@api/request";
|
||||
|
||||
@@ -585,7 +585,7 @@ export const TicketFullScreen = () => {
|
||||
Загрузить файл
|
||||
</BaseButton>
|
||||
<span>{0}</span>
|
||||
Файлов
|
||||
{caseOfNum(0, "files")}
|
||||
</p>
|
||||
</div>
|
||||
<div className="content__input">
|
||||
|
||||
@@ -99,6 +99,8 @@
|
||||
cursor: pointer;
|
||||
|
||||
img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-left: 20px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
@@ -6,6 +6,7 @@ import {
|
||||
activeLoader,
|
||||
deletePersonOnProject,
|
||||
filterCreatedByMe,
|
||||
filteredExecutorTasks,
|
||||
filteredParticipateTasks,
|
||||
getBoarderLoader,
|
||||
getProjectBoard,
|
||||
@@ -44,6 +45,7 @@ import project from "assets/icons/trackerProject.svg";
|
||||
import tasks from "assets/icons/trackerTasks.svg";
|
||||
import accept from "assets/images/accept.png";
|
||||
import avatarMok from "assets/images/avatarMok.png";
|
||||
import arrowDown from "assets/icons/arrows/selectArrow.png";
|
||||
|
||||
export const ProjectTracker = () => {
|
||||
const dispatch = useDispatch();
|
||||
@@ -61,6 +63,8 @@ export const ProjectTracker = () => {
|
||||
const [checkBoxParticipateTasks, setCheckBoxParticipateTasks] =
|
||||
useState(false);
|
||||
const [checkBoxMyTasks, setCheckBoxMyTasks] = useState(false);
|
||||
const [selectedExecutor, setSelectedExecutor] = useState(null);
|
||||
const [selectExecutorOpen, setSelectedExecutorOpen] = useState(false)
|
||||
const startWrapperIndexTest = useRef({});
|
||||
const projectBoard = useSelector(getProjectBoard);
|
||||
const loader = useSelector(getBoarderLoader);
|
||||
@@ -243,6 +247,16 @@ export const ProjectTracker = () => {
|
||||
setCheckBoxMyTasks(!checkBoxMyTasks);
|
||||
}
|
||||
|
||||
function executorFilter(user) {
|
||||
dispatch(filteredExecutorTasks(user.user_id))
|
||||
setSelectedExecutor(user)
|
||||
}
|
||||
|
||||
function deleteSelectedExecutorFilter() {
|
||||
setSelectedExecutor(null)
|
||||
dispatch(setProjectBoardFetch(projectId.id));
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="tracker">
|
||||
<ProfileHeader />
|
||||
@@ -423,6 +437,47 @@ export const ProjectTracker = () => {
|
||||
{checkBoxMyTasks && <img src={accept} alt="accept" />}
|
||||
</div>
|
||||
</div>
|
||||
{selectedExecutor ?
|
||||
<div className='tasks__head__executorSelected'>
|
||||
<p>{selectedExecutor.user.fio}</p>
|
||||
<img
|
||||
className='avatar'
|
||||
src={
|
||||
selectedExecutor.user?.avatar
|
||||
? urlForLocal(selectedExecutor.user.avatar)
|
||||
: avatarMok
|
||||
}
|
||||
alt='avatar' />
|
||||
<img
|
||||
className="delete"
|
||||
src={close}
|
||||
alt="delete"
|
||||
onClick={deleteSelectedExecutorFilter}
|
||||
/>
|
||||
</div>
|
||||
:
|
||||
<div className="tasks__head__executor" onClick={() => setSelectedExecutorOpen(!selectExecutorOpen)}>
|
||||
<p>Выберите исполнитель</p>
|
||||
<img className={selectExecutorOpen ? "open" : ""} src={arrowDown} alt="arrow" />
|
||||
{selectExecutorOpen &&
|
||||
<div className='tasks__head__executorDropdown'>
|
||||
{projectBoard.projectUsers.map((user) => {
|
||||
return <div className='executorDropdown__person' key={user.user_id} onClick={() => executorFilter(user)}>
|
||||
<p>{user.user?.fio}</p>
|
||||
<img
|
||||
src={
|
||||
user.user?.avatar
|
||||
? urlForLocal(user.user.avatar)
|
||||
: avatarMok
|
||||
}
|
||||
alt='avatar' />
|
||||
</div>
|
||||
})
|
||||
}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
<Link to="/profile/tracker" className="tasks__head__back">
|
||||
<p>Вернуться на проекты</p>
|
||||
<img src={arrow} alt="arrow" />
|
||||
|
||||
@@ -208,7 +208,8 @@
|
||||
|
||||
&__wrapper {
|
||||
display: flex;
|
||||
max-width: 1160px;
|
||||
max-width: 1260px;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
justify-content: space-between;
|
||||
padding: 0 10px;
|
||||
@@ -466,6 +467,107 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__executor {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
cursor: pointer;
|
||||
margin-right: 10px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #e3e2e2;
|
||||
padding: 2px 6px;
|
||||
position: relative;
|
||||
max-width: 220px;
|
||||
width: 100%;
|
||||
|
||||
&Selected {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 8px;
|
||||
max-width: 220px;
|
||||
width: 100%;
|
||||
margin-right: 10px;
|
||||
justify-content: center;
|
||||
|
||||
p {
|
||||
color: #252c32;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
max-width: 155px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.delete {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
img {
|
||||
display: flex;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
p {
|
||||
color: #252c32;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
img {
|
||||
transition: all 0.15s ease;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.open {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
&Dropdown {
|
||||
position: absolute;
|
||||
top: 33px;
|
||||
background: white;
|
||||
border-radius: 8px;
|
||||
z-index: 5;
|
||||
padding: 10px 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 7px;
|
||||
width: 100%;
|
||||
|
||||
|
||||
.executorDropdown__person {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
p {
|
||||
max-width: 155px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
p {
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__back {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
|
||||
@@ -122,6 +122,11 @@ export const projectsTrackerSlice = createSlice({
|
||||
);
|
||||
});
|
||||
},
|
||||
filteredExecutorTasks: (state, action) => {
|
||||
state.projectBoard.columns.forEach((column) => {
|
||||
column.tasks = column.tasks.filter((task) => task.executor_id === action.payload);
|
||||
});
|
||||
},
|
||||
setColumnName: (state, action) => {
|
||||
state.columnName = action.payload;
|
||||
},
|
||||
@@ -174,6 +179,7 @@ export const {
|
||||
addPersonToProject,
|
||||
filterCreatedByMe,
|
||||
filteredParticipateTasks,
|
||||
filteredExecutorTasks,
|
||||
movePositionProjectTask,
|
||||
} = projectsTrackerSlice.actions;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user