Merge branch 'main' of https://git.itguild.info/apuc/guild_front

src/components/Modal/Tracker/ListEmployees/ListEmployees.jsx

@@ -6,7 +6,7 @@ import {
   modalToggle
 } from "@redux/projectsTrackerSlice";
 
-import { caseOfNum, urlForLocal } from "@utils/helper";
+import { caseOfNum, removeLast, urlForLocal } from "@utils/helper";
 
 import { apiRequest } from "@api/request";
 
@@ -67,7 +67,7 @@ const ListEmployees = ({
                   }
                   alt="avatar"
                 />
-                <span>{person.user.fio}</span>
+                <span>{removeLast(person.user.fio)}</span>
                 <img
                   className="delete"
                   src={close}

src/components/Modal/Tracker/ModalTicket/ModalTicket.jsx

@@ -11,10 +11,10 @@ import { getProfileInfo } from "@redux/outstaffingSlice";
 import { setProjectBoardFetch } from "@redux/projectsTrackerSlice";
 
 import {
-  backendImg,
   caseOfNum,
   getCorrectRequestDate,
   getToken,
+  removeLast,
   urlForLocal
 } from "@utils/helper";
 
@@ -771,12 +771,12 @@ export const ModalTiсket = ({
           <div className="workers_box task__info">
             <span className="exit" onClick={() => closeModal()}></span>
             <h5>Создатель: </h5>
-            <p className="workers__creator">{task.user?.fio}</p>
+            <p className="workers__creator">{removeLast(task.user?.fio)}</p>
             {executor ? (
               <>
                 <h5>Исполнитель: </h5>
                 <div className="executor">
-                  <p>{executor.fio}</p>
+                  <p>{removeLast(executor.fio)}</p>
                   <img
                     src={
                       executor?.avatar
@@ -815,7 +815,7 @@ export const ModalTiсket = ({
                           key={person.user_id}
                           onClick={() => taskExecutor(person)}
                         >
-                          <span>{person.user.fio}</span>
+                          <span>{removeLast(person.user.fio)}</span>
                           <img
                             src={
                               person.user?.avatar
@@ -838,7 +838,7 @@ export const ModalTiсket = ({
                   {members.map((member) => {
                     return (
                       <div className="worker" key={member.user_id}>
-                        <p>{member.fio}</p>
+                        <p>{removeLast(member.fio)}</p>
                         <img
                           src={
                             member?.avatar
@@ -881,7 +881,7 @@ export const ModalTiсket = ({
                           key={person.user_id}
                           onClick={() => addMember(person)}
                         >
-                          <span>{person.user.fio}</span>
+                          <span>{removeLast(person.user.fio)}</span>
                           <img
                             src={
                               person.user?.avatar
@@ -907,7 +907,7 @@ export const ModalTiсket = ({
                 className="dead-line__container"
                 onClick={() => setDatePickerOpen(!datePickerOpen)}
               >
-                <img src={calendarIcon} alt="calendar" />
+                <p>⌛</p>
                 <span>
                   {deadLine ? getCorrectDate(deadLine) : "Срок исполнения"}
                 </span>

src/components/Modal/Tracker/TicketFullScreen/TicketFullScreen.jsx

@@ -950,7 +950,7 @@ export const TicketFullScreen = () => {
                       className="dead-line__container"
                       onClick={() => setDatePickerOpen(!datePickerOpen)}
                     >
-                      <img src={calendarIcon} alt="calendar" />
+                      <p>⌛</p>
                       <span>
                         {deadLine
                           ? getCorrectDate(deadLine)

src/components/Modal/Tracker/TrackerModal/TrackerModal.jsx

@@ -23,7 +23,7 @@ import {
 } from "@redux/projectsTrackerSlice";
 
 import { getCorrectDate } from "@utils/calendarHelper";
-import { getCorrectRequestDate, urlForLocal } from "@utils/helper";
+import { getCorrectRequestDate, removeLast, urlForLocal } from "@utils/helper";
 
 import { apiRequest } from "@api/request";
 
@@ -488,7 +488,7 @@ export const TrackerModal = ({
                   >
                     <p>
                       {selectedWorker
-                        ? selectedWorker.employee.fio
+                        ? removeLast(selectedWorker.employee.fio)
                         : "Выберите пользователя"}
                     </p>
                     <img className="arrow" src={arrowDown} alt="arrow" />
@@ -507,7 +507,7 @@ export const TrackerModal = ({
                                   setSelectedWorker(worker);
                                 }}
                               >
-                                <span>{worker.employee.fio}</span>
+                                <span>{removeLast(worker.employee.fio)}</span>
                                 <img
                                   src={urlForLocal(worker.employee.avatar)}
                                   alt="avatar"
@@ -562,7 +562,6 @@ export const TrackerModal = ({
             </div>
             <div className="create-task-body">
               <div className="create-task-body__left">
-                <h4>Введите название и описание задачи</h4>
                 <div className="input-container">
                   <input
                     maxLength="100"
@@ -740,7 +739,7 @@ export const TrackerModal = ({
                                 }
                                 alt="avatar"
                               />
-                              <span>{person.user.fio}</span>
+                              <span>{removeLast(person.user.fio)}</span>
                             </div>
                           );
                         })
@@ -751,7 +750,7 @@ export const TrackerModal = ({
                   )}
                 </div>
                 <div className="create-task-body__right__dead-line">
-                  <img src={calendarImg} alt="calendar" />
+                  <p>⌛</p>
                   <p onClick={() => setDatePickerOpen(!datePickerOpen)}>
                     {deadLineDate
                       ? getCorrectDate(deadLineDate)
@@ -775,7 +774,7 @@ export const TrackerModal = ({
               <Loader style={"green"} />
             ) : (
               <BaseButton styles={"button-add"} onClick={createTicket}>
-                Создать
+                Создать задачу
               </BaseButton>
             )}
           </div>

src/components/Modal/Tracker/TrackerModal/trackerModal.scss

@@ -263,7 +263,7 @@
       position: absolute;
       width: 100%;
       padding: 9.5px 12px;
-      top: 48px;
+      top: 45px;
       left: 0;
       background: white;
       border-radius: 5px;
@@ -338,7 +338,7 @@
   }
 
   .create-task-body {
-    padding: 15px 20px;
+    padding: 15px 30px;
     display: flex;
     column-gap: 20px;
 
@@ -374,8 +374,8 @@
       }
 
       .ck-editor__editable.ck-rounded-corners {
-        min-height: 150px;
+        min-height: 180px;
-        max-height: 150px;
+        max-height: 180px;
       }
     }
 
@@ -384,6 +384,7 @@
       flex-direction: column;
       align-items: start;
       justify-content: end;
+      row-gap: 10px;
 
       &__owner {
         display: flex;
@@ -715,6 +716,11 @@
       }
     }
   }
+
+  .button-add {
+    margin: 0 30px;
+    align-self: flex-end;
+  }
 }
 
 .name-project {

src/components/Navigation/Navigation.jsx

@@ -97,7 +97,7 @@ export const Navigation = () => {
 
         <div className="profile-header__personal-info">
           <h3 className="profile-header__personal-info-name">
-            {profileInfo?.fio ? profileInfo?.fio : profileInfo?.username}
+            {profileInfo?.fio || profileInfo?.username}
           </h3>
           <NavLink end to={"/profile"}>
             <img

src/components/ProfileCalendar/ProfileCalendar.jsx

@@ -95,7 +95,7 @@ export const ProfileCalendar = () => {
               alt="avatar"
             />
             <p className="summary__name">
-              {profileInfo?.fio ? profileInfo?.fio : profileInfo?.username},{" "}
+              {profileInfo?.fio || profileInfo?.username},{" "}
               {profileInfo.specification} разработчик
             </p>
           </div>

src/components/ProfileHeader/ProfileHeader.jsx

@@ -150,7 +150,7 @@ export const ProfileHeader = () => {
         <nav className="auth-body__navigation">
           <div className="profile-header__personal-info">
             <h3 className="profile-header__personal-info-name">
-              {profileInfo?.fio ? profileInfo?.fio : profileInfo?.username}
+              {profileInfo?.fio || profileInfo?.username}
             </h3>
             <NavLink end to={"/profile"}>
               <img

src/components/features/quiz/quiz.scss

@@ -566,7 +566,6 @@ $maxWidthContainer: 1123;
     align-items: center;
     width: 100%;
     height: 100%;
-    flex-wrap: wrap;
     @media (max-width: 600px) {
       display: block;
     }

src/pages/PartnerSettings/partnerSettings.scss

@@ -225,7 +225,7 @@
 
     &__report,
     &__login {
-      width: 60%;
+      width: 100%;
     }
 
     &__report {

src/pages/Profile/Profile.jsx

@@ -103,12 +103,12 @@ export const Profile = () => {
           {user === "developer" ? (
             <span>
               <p>Добрый день,&nbsp;</p>
-              {profileInfo?.fio ? profileInfo?.fio : profileInfo?.username}
+              {profileInfo?.fio || profileInfo?.username}
             </span>
           ) : (
             <span>
               <p>Добрый день,&nbsp;</p>
-              {profileInfo?.fio ? profileInfo?.fio : profileInfo?.username}
+              {profileInfo?.fio || profileInfo?.username}
             </span>
           )}
         </h2>
@@ -124,13 +124,11 @@ export const Profile = () => {
             <p className="summary__name">
               {user === "developer" ? (
                 <span>
-                  {profileInfo?.fio ? profileInfo?.fio : profileInfo?.username},{" "}
+                  {profileInfo?.fio || profileInfo?.username},{" "}
                   {profileInfo?.specification} разработчик
                 </span>
               ) : (
-                <span>
+                <span>{profileInfo?.fio || profileInfo?.username}</span>
-                  {profileInfo?.fio ? profileInfo?.fio : profileInfo?.username}
-                </span>
               )}
             </p>
           </div>

src/pages/ProjectTracker/ProjectTracker.jsx

@@ -23,8 +23,7 @@ import {
   setToggleTab
 } from "@redux/projectsTrackerSlice";
 
-import { urlForLocal } from "@utils/helper";
+import { removeLast, urlForLocal } from "@utils/helper";
-import { caseOfNum } from "@utils/helper";
 
 import { apiRequest } from "@api/request";
 
@@ -44,7 +43,6 @@ import TrackerSelectColumn from "@components/TrackerSelectColumn/TrackerSelectCo
 
 import arrow from "assets/icons/arrows/arrowCalendar.png";
 import arrowDown from "assets/icons/arrows/selectArrow.png";
-import calendarIcon from "assets/icons/calendar.svg";
 import category from "assets/icons/category.svg";
 import close from "assets/icons/close.png";
 import commentsBoard from "assets/icons/commentsBoard.svg";
@@ -64,7 +62,6 @@ export const ProjectTracker = () => {
   const dispatch = useDispatch();
   const projectId = useParams();
 
-  const currentDate = new Date().getFullYear();
   const [openColumnSelect, setOpenColumnSelect] = useState({});
   const [selectedTab, setSelectedTab] = useState(0);
   const [priorityTask, setPriorityTask] = useState(0);
@@ -610,7 +607,7 @@ export const ProjectTracker = () => {
                                 key={user.user_id}
                                 onClick={() => executorFilter(user)}
                               >
-                                <p>{user.user?.fio}</p>
+                                <p>{removeLast(user.user?.fio)}</p>
                                 <img
                                   src={
                                     user.user?.avatar
@@ -908,10 +905,7 @@ export const ProjectTracker = () => {
                                     }
                                   }}
                                 >
-                                  <p
+                                  <p className="task__board__item__title">
-                                    className="task__board__item__title"
-                                    style={{ color: titleColor }}
-                                  >
                                     {task.title}
                                   </p>
                                 </div>
@@ -953,7 +947,7 @@ export const ProjectTracker = () => {
                                   {task.dead_line && (
                                     <div className="tasks__board__item__dead-line">
                                       <p>⌛</p>
-                                      <span>
+                                      <span style={{ color: titleColor }}>
                                         {getCorrectDate(task.dead_line)}
                                       </span>
                                     </div>
@@ -971,7 +965,7 @@ export const ProjectTracker = () => {
                                       alt="avatar"
                                     />
                                     <span>
-                                      {task.executor?.fio ||
+                                      {removeLast(task.executor?.fio) ||
                                         "Исполнитель не назначен"}
                                     </span>
                                   </div>

src/pages/Statistics/Statistics.jsx

@@ -1,12 +1,16 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { useDispatch } from "react-redux";
-import { Link } from "react-router-dom";
+import { Link, useParams } from "react-router-dom";
 
 import { setToggleTab } from "@redux/projectsTrackerSlice";
 
 import { copyProjectLink } from "@utils/helper";
+import { urlForLocal } from "@utils/helper";
+
+import { apiRequest } from "@api/request";
 
 import { Footer } from "@components/Common/Footer/Footer";
+import { Loader } from "@components/Common/Loader/Loader";
 import { Navigation } from "@components/Navigation/Navigation";
 import { ProfileBreadcrumbs } from "@components/ProfileBreadcrumbs/ProfileBreadcrumbs";
 import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
@@ -23,6 +27,21 @@ import "./statistics.scss";
 
 const Statistics = () => {
   const dispatch = useDispatch();
+  const params = useParams();
+
+  const [projectStatistic, setProjectStatistic] = useState(null);
+  const [projectInfo, setProjectInfo] = useState(null);
+  const [loader, setLoader] = useState(true);
+
+  useEffect(() => {
+    apiRequest(`/project/get-project?project_id=${params.id}`).then((res) => {
+      setProjectInfo(res);
+    });
+    apiRequest(`/project/statistic?project_id=${params.id}`).then((res) => {
+      setProjectStatistic(res);
+      setLoader(false);
+    });
+  }, []);
 
   const teams = [
     {
@@ -72,6 +91,9 @@ const Statistics = () => {
           />
           <h2 className="tracker__title">Управление проектами с трекером</h2>
         </div>
+        {loader ? (
+          <Loader />
+        ) : (
           <div className="tracker__tabs">
             <div className="tracker__tabs__head">
               <Link
@@ -124,29 +146,42 @@ const Statistics = () => {
                 <div className="statistics-info">
                   <div className="statistics-info__head">
                     <p>Проект: </p>
-                  <h1>{"Разработка трекера"}</h1>
+                    <h1>{projectInfo?.name}</h1>
                   </div>
                   <div className="statistics-info__team">
                     <div className="project-info">
                       <div className="project-info__creator">
                         <span className="return-text">Создатель проекта:</span>
                         <div>
-                        <p>{"Василий Тарасов"}</p>{" "}
+                          <p>{projectInfo?.owner_info?.fio}</p>{" "}
-                        <img src={mockAvatar} alt="#" />
+                          <img
+                            src={
+                              projectInfo?.owner_info?.avatar
+                                ? urlForLocal(projectInfo.owner_info.avatar)
+                                : mockAvatar
+                            }
+                            alt="#"
+                          />
                         </div>
                       </div>
                       <div className="project-info__tasks">
                         <div className="task-quantity">
                           <p>Открытые задачи</p>
-                        <span className="task-quantity_open">{4}</span>
+                          <span className="task-quantity_open">
+                            {projectStatistic?.open_tasks_count}
+                          </span>
                         </div>
                         <div className="task-quantity">
                           <p>Задач в работе</p>
-                        <span className="task-quantity_work">{5}</span>
+                          <span className="task-quantity_work">
+                            {projectStatistic?.task_on_work_count}
+                          </span>
                         </div>
                         <div className="task-quantity">
                           <p>Закрыто задач</p>
-                        <span className="task-quantity_closed">{434}</span>
+                          <span className="task-quantity_closed">
+                            {projectStatistic?.closed_task_count}
+                          </span>
                         </div>
                       </div>
                     </div>
@@ -155,36 +190,45 @@ const Statistics = () => {
                         <span className="return-text">Участники проекта:</span>
                       </div>
                       <div className="list-team__head">
-                      <p>Имя</p>
+                        <p className="head__name">Имя</p>
-                      <p>Почта</p>
+                        <p className="head__email">Почта</p>
-                      <p>Роль</p>
+                        <p className="head__role">Роль</p>
-                      <p>Статус</p>
+                        <p className="head__status">Статус</p>
                       </div>
                       <div className="list-team__body">
-                      {teams.map((item) => {
+                        {projectStatistic?.participants.map((person, index) => {
                           return (
                             <>
-                            <div className="list-team__item">
+                              <div className="list-team__item" key={index}>
                                 <div className="person-name">
-                                <img src={item.avatar} alt="#" />
+                                  <img
-                                <p>{item.name}</p>
+                                    src={
+                                      person.avatar
+                                        ? urlForLocal(person.avatar)
+                                        : mockAvatar
+                                    }
+                                    alt="avatar"
+                                  />
+                                  <p>{person.username}</p>
                                 </div>
                                 <div className="person-email">
                                   <img src={emailImg} alt="#" />
-                                <p>{item.email}</p>
+                                  <p>{person.email}</p>
                                 </div>
 
-                              <p className="person-type">{item.role}</p>
+                                <p className="person-type">
+                                  {person.role ? person.role : "-"}
+                                </p>
                                 {/* <span className="status status-active"> */}
 
                                 <span
                                   className={
-                                  item.status
+                                    person.status
                                       ? "status status-active"
                                       : "status status-none"
                                   }
                                 >
-                                {item.status ? "Активно" : "Не активно"}
+                                  {person.status ? "Активно" : "Не активно"}
                                 </span>
                               </div>
                             </>
@@ -201,6 +245,7 @@ const Statistics = () => {
               </div>
             </div>
           </div>
+        )}
       </div>
       <Footer />
     </div>

src/pages/Statistics/statistics.scss

@@ -144,6 +144,11 @@
               line-height: 32px;
               margin-right: 19px;
             }
+
+            img {
+              max-width: 36px;
+              max-height: 36px;
+            }
           }
         }
 
@@ -240,7 +245,7 @@
         &__head {
           display: flex;
           justify-content: space-between;
-          margin-right: 123px;
+          margin-right: 55px;
 
           p {
             color: #5b6871;
@@ -255,6 +260,30 @@
           @media (max-width: 650px) {
             display: none;
           }
+
+          .head {
+            &__name {
+              max-width: 270px;
+              width: 100%;
+            }
+
+            &__email {
+              max-width: 270px;
+              width: 100%;
+            }
+
+            &__role {
+              max-width: 168px;
+              width: 100%;
+              text-align: center;
+            }
+
+            &__status {
+              text-align: center;
+              max-width: 152px;
+              width: 100%;
+            }
+          }
         }
 
         &__item {
@@ -270,14 +299,18 @@
             &-name {
               display: flex;
               align-items: center;
-              width: 202px;
+              max-width: 270px;
+              width: 100%;
               img {
                 margin-right: 10px;
+                max-width: 36px;
+                max-height: 36px;
               }
             }
 
             &-email {
-              width: 235px;
+              max-width: 270px;
+              width: 100%;
               align-items: center;
               display: flex;
 
@@ -292,6 +325,7 @@
 
             &-type {
               width: 168px;
+              text-align: center;
             }
 
             @media (max-width: 850px) {

src/pages/Summary/Summary.jsx

@@ -107,7 +107,7 @@ export const Summary = () => {
                 alt="avatar"
               />
               <p className="summary__name">
-                {profileInfo?.fio ? profileInfo?.fio : profileInfo?.username},{" "}
+                {profileInfo?.fio || profileInfo?.username},{" "}
                 {profileInfo.specification} разработчик
               </p>
             </div>

src/utils/helper.js

@@ -91,3 +91,11 @@ export function copyProjectLink(projectId) {
     `https://itguild.info/tracker/project/${projectId}`
   );
 }
+
+export function removeLast(string = " ") {
+  let arr = string.trim().split(" ");
+  if (arr.length > 2) {
+    return arr.slice(0, -1).join(" ");
+  }
+  return string;
+}