tracker tasks

src/components/FileTracker/FileTracker.jsx

@@ -0,0 +1,47 @@
+import React, {useState} from "react";
+import { backendImg } from "@utils/helper";
+import close from "assets/icons/closeProjectPersons.svg";
+
+import {apiRequest} from "@api/request";
+
+const FileTracker = ({ file, setDeletedTask, taskId }) => {
+    const [openImg, setOpenImg] = useState(false)
+    function deleteFile(file) {
+        apiRequest("/file/detach", {
+            method: "DELETE",
+            data: {
+                file_id: file.id,
+                entity_type: 2,
+                entity_id: taskId,
+                status: 0,
+            },
+        }).then(() => {
+            setDeletedTask(file);
+        });
+    }
+
+    return (
+        <div className={openImg ? "taskFile ImgOpened" : "taskFile"} key={file.id}
+             onClick={() =>
+             {if(openImg) setOpenImg(!openImg)}}
+        >
+            <img
+                className="imgFile"
+                src={backendImg(file.file?.url)}
+                alt="img"
+                onClick={() =>
+                {if(!openImg) setOpenImg(!openImg)}}
+            />
+            {!openImg &&
+                <div
+                    className="deleteFile"
+                    onClick={() => deleteFile(file)}
+                >
+                    <img src={close} alt="delete" />
+                </div>
+            }
+        </div>
+    );
+};
+
+export default FileTracker;

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

@@ -25,6 +25,7 @@ import { useNotification } from "@hooks/useNotification";
 import AcceptModal from "@components/Modal/AcceptModal/AcceptModal";
 import TrackerModal from "@components/Modal/Tracker/TrackerModal/TrackerModal";
 import TrackerTaskComment from "@components/TrackerTaskComment/TrackerTaskComment";
+import FileTracker from "@components/FileTracker/FileTracker";
 
 import archive from "assets/icons/archive.svg";
 import arrow from "assets/icons/arrows/arrowStart.png";
@@ -52,6 +53,7 @@ export const ModalTiсket = ({
   projectId,
   projectName,
   projectUsers,
+  projectOwnerId
 }) => {
   const dispatch = useDispatch();
   const [addSubtask, setAddSubtask] = useState(false);
@@ -371,19 +373,9 @@ export const ModalTiсket = ({
   }
 
   function deleteFile(file) {
-    apiRequest("/file/detach", {
+     setTaskFiles((prevValue) =>
-      method: "DELETE",
-      data: {
-        file_id: file.id,
-        entity_type: 2,
-        entity_id: task.id,
-        status: 0,
-      },
-    }).then(() => {
-      setTaskFiles((prevValue) =>
         prevValue.filter((item) => item.id !== file.id)
       );
-    });
   }
 
   function startTimer() {
@@ -533,19 +525,12 @@ export const ModalTiсket = ({
               <div className="task__files">
                 {taskFiles.map((file) => {
                   return (
-                    <div className="taskFile" key={file.id}>
+                      <FileTracker
-                      <img
+                        key={file.id}
-                        className="imgFile"
+                        file={file}
-                        src={backendImg(file.file?.url)}
+                        setDeletedTask={deleteFile}
-                        alt="img"
+                        taskId={task.id}
                       />
-                      <div
-                        className="deleteFile"
-                        onClick={() => deleteFile(file)}
-                      >
-                        <img src={close} alt="delete" />
-                      </div>
-                    </div>
                   );
                 })}
               </div>
@@ -838,11 +823,12 @@ export const ModalTiсket = ({
               <img src={link}></img>
               <p onClick={copyTicketLink}>ссылка на задачу</p>
             </div>
-            <div onClick={archiveTask}>
+            <div onClick={archiveTask} className={(profileInfo.id_user === projectOwnerId) || (profileInfo.id_user === task.user_id) ? '' : 'disable'}>
               <img src={archive}></img>
               <p>в архив</p>
             </div>
-            <div onClick={deleteTask}>
+            <div onClick={deleteTask} className={
+              (profileInfo.id_user === projectOwnerId) || (profileInfo.id_user === task.user_id) ? '' : 'disable'}>
               <img src={del}></img>
               <p>удалить</p>
             </div>

src/components/Modal/Tracker/ModalTicket/modalTicket.scss

@@ -367,6 +367,7 @@
       }
 
       .taskFile {
+        cursor: pointer;
         position: relative;
         .imgFile {
           max-width: 170px;
@@ -400,6 +401,26 @@
           }
         }
       }
+
+      .ImgOpened {
+        position: fixed;
+        width: 100vw;
+        height: 100vh;
+        top: 0;
+        left: 0;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        z-index: 100;
+        background-color: rgba(0, 0, 0, 0.2);
+
+        .imgFile {
+          width: 90vw;
+          height: 90vh;
+          max-width: none;
+          max-height: none;
+        }
+      }
     }
 
     .fileLoaded {

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

@@ -13,6 +13,8 @@ import {
   setToggleTab,
 } from "@redux/projectsTrackerSlice";
 
+import { getProfileInfo } from "@redux/outstaffingSlice";
+
 import {
   backendImg,
   caseOfNum,
@@ -75,6 +77,7 @@ export const TicketFullScreen = () => {
     minute: 0,
     seconds: 0,
   });
+  const profileInfo = useSelector(getProfileInfo);
   const [timerId, setTimerId] = useState(null);
   const [dropListOpen, setDropListOpen] = useState(false);
   const [correctProjectUsers, setCorrectProjectUsers] = useState([]);
@@ -997,11 +1000,14 @@ export const TicketFullScreen = () => {
                     <img src={link} alt="link"></img>
                     <p onClick={copyTicketLink}>ссылка на задачу</p>
                   </div>
-                  <div onClick={archiveTask}>
+                  <div onClick={archiveTask}
+                       className={(profileInfo.id_user === projectInfo.owner_id) || (profileInfo.id_user === taskInfo.user_id) ? '' : 'disable'}>
                     <img src={archive} alt="arch"></img>
                     <p>в архив</p>
                   </div>
-                  <div onClick={deleteTask}>
+                  <div onClick={deleteTask}
+                       className={(profileInfo.id_user === projectInfo.owner_id) || (profileInfo.id_user === taskInfo.user_id) ? '' : 'disable'}
+                  >
                     <img src={del} alt="delete"></img>
                     <p>удалить</p>
                   </div>

src/components/Navigation/Navigation.jsx

@@ -17,6 +17,7 @@ export const Navigation = () => {
   const [user] = useState(
     localStorage.getItem("role_status") === "18" ? "partner" : "developer"
   );
+
   const [navInfo] = useState({
     developer: [
       {

src/pages/ProjectTracker/ProjectTracker.js

@@ -546,6 +546,7 @@ export const ProjectTracker = () => {
                   projectId={projectBoard.id}
                   projectName={projectBoard.name}
                   projectUsers={projectBoard.projectUsers}
+                  projectOwnerId={projectBoard.owner_id}
                 />
               )}