Merge pull request #41 from ipti/featue/melhorias

Featue/melhorias
ipti · Dec 5, 2024 · 9b1507c · 9b1507c
2 parents 49df9e3 + d876887
commit 9b1507c
Show file tree

Hide file tree

Showing 24 changed files with 250 additions and 92 deletions.
diff --git a/.env b/.env
@@ -1,2 +1,2 @@
-# REACT_APP_API_PATH=http://localhost:3000/
-REACT_APP_API_PATH=https://br-ipti-beneficiarios.azurewebsites.net/
+REACT_APP_API_PATH=http://localhost:3000/
+# REACT_APP_API_PATH=https://br-ipti-beneficiarios.azurewebsites.net/
diff --git a/src/Components/Card/CardClassroom/index.tsx b/src/Components/Card/CardClassroom/index.tsx
@@ -10,19 +10,23 @@ import { Container } from "./style";
 
 import pessoas from "../../../Assets/images/pessoasgray.svg";
 import { AplicationContext } from "../../../Context/Aplication/context";
-import { ROLE } from "../../../Controller/controllerGlobal";
+import { ROLE, Status } from "../../../Controller/controllerGlobal";
 import { menuItem } from "../../../Services/localstorage";
 import styles from "../../../Styles";
 import { PropsAplicationContext } from "../../../Types/types";
+import IconStatus from "./../../../Assets/images/published_with_changes.svg";
+
 
 const CardClassroom = ({
   title,
   meetingCount,
   registrationCount,
   id,
+  status
 }: {
   title: string;
   meetingCount?: number;
+  status?: string
   registrationCount?: number;
   id: number;
 }) => {
@@ -56,28 +60,47 @@ const CardClassroom = ({
           </Row>
           {(propsAplication.user?.role === ROLE.ADMIN ||
             propsAplication.user?.role === ROLE.COORDINATORS) && (
-            <div
-              className="cursor-pointer"
-              onClick={(e) => {
-                e.stopPropagation();
-                setVisible(true);
-              }}
-            >
-              <Icon
-                icon="pi pi-trash"
-                color={styles.colors.colorGrayElephant}
-                size="1rem"
-                fontWeight="900"
-              />
-            </div>
-          )}
+              <div
+                className="cursor-pointer"
+                onClick={(e) => {
+                  e.stopPropagation();
+                  setVisible(true);
+                }}
+              >
+                <Icon
+                  icon="pi pi-trash"
+                  color={styles.colors.colorGrayElephant}
+                  size="1rem"
+                  fontWeight="900"
+                />
+              </div>
+            )}
         </Row>
         <Padding padding="8px" />
         <Row style={{ gap: 16 }}>
           <Row style={{ gap: 8, alignItems: "center" }}>
             <img src={pessoas} alt="" style={{ width: 24 }} />
             <p>Participantes: {registrationCount}</p>
           </Row>
+          <Column id="center">
+            <Row>
+              <img
+                src={IconStatus}
+                alt=""
+                style={{ height: 16, marginRight: 2 }}
+              />
+              <Row style={{ fontSize: "14px" }}>
+                Status: {" "}<Padding padding="2px" />
+                {status === Status.PENDING ? (
+                  <p style={{ fontWeight: "600" }}> Pendente</p>
+                ) : status === Status.APPROVED ? (
+                  <p style={{ fontWeight: "600" }}> Finalizado</p>
+                ) : status === Status.REPROVED ? (
+                  <p style={{ fontWeight: "600" }}> Reprovado</p>
+                ) : null}
+              </Row>
+            </Row>
+          </Column>
         </Row>
       </Container>
       <ConfirmDialog

diff --git a/src/Components/Card/CardClassroom/style.tsx b/src/Components/Card/CardClassroom/style.tsx
@@ -10,6 +10,10 @@ export const Container = styled.div`
   background: ${styles.colors.colorCard};
   
   border-radius: 16px;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
 
   .boxQuantity {
     display: flex;

diff --git a/src/Components/Card/CardMeeting/style.tsx b/src/Components/Card/CardMeeting/style.tsx
@@ -7,6 +7,10 @@ export const Container = styled.div`
 
   border: 1.22px solid rgba(219, 230, 255, 1);
   background: ${styles.colors.colorCard};
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
   
   border-radius: 16px;
 

diff --git a/src/Components/Card/CardProject/style.tsx b/src/Components/Card/CardProject/style.tsx
@@ -8,6 +8,10 @@ export const Container = styled.div`
 
   border: 1.22px solid rgba(219, 230, 255, 1);
   background: ${styles.colors.colorCard};
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
   
   border-radius: 16px;
 

diff --git a/src/Components/Card/CardRegistration/index.tsx b/src/Components/Card/CardRegistration/index.tsx
@@ -4,7 +4,7 @@ import { useNavigate, useParams } from "react-router-dom";
 import avatar from "../../../Assets/images/avatar.svg"
 import { RegistrationClassroomContext } from "../../../Context/Classroom/RegistrationsList/context";
 import { RegistrationClassroomTypes } from "../../../Context/Classroom/RegistrationsList/type";
-import { ROLE, Status } from "../../../Controller/controllerGlobal";
+import { ROLE, Status, StatusEnum } from "../../../Controller/controllerGlobal";
 import { Column, Padding, Row } from "../../../Styles/styles";
 import Icon from "../../Icon";
 import { Container } from "./style";
@@ -80,22 +80,16 @@ const CardRegistration = ({
           </div>
           <Padding />
           <Column>
-            <div style={{fontWeight: "500",
-              padding: 4, textAlign: "center", width: "96px", color: "white", borderRadius: "16px", backgroundColor: `${status === statuGlobal.APPROVED
+            <div className="status" style={{fontWeight: "500",
+              padding: 4, textAlign: "center", minWidth: "96px", maxWidth: "128px", color: "white", borderRadius: "16px", backgroundColor: `${status === statuGlobal.APPROVED
                 ? color.green
                 : status === statuGlobal.PENDING
                   ? color.colorCardOrange
                   : status === statuGlobal.REPROVED
                     ? color.red
-                    : ""}`
+                    : color.colorCardOrange}`
             }}>
-              {status === statuGlobal.APPROVED
-                ? "Aprovado"
-                : status === statuGlobal.PENDING
-                  ? "Pendente"
-                  : status === statuGlobal.REPROVED
-                    ? "Reprovado"
-                    : ""}
+              {StatusEnum[status]}
             </div>
             <Padding />
             <h4>{subtitle}</h4>

diff --git a/src/Components/Card/CardRegistration/style.tsx b/src/Components/Card/CardRegistration/style.tsx
@@ -8,6 +8,10 @@ export const Container = styled.div`
 
   border: 1.22px solid rgba(219, 230, 255, 1);
   background: ${styles.colors.colorCard};
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
   
   border-radius: 16px;
 
@@ -17,6 +21,16 @@ export const Container = styled.div`
     font-size: ${styles.typography.font.extraSmall};
   }
 
+  .status {
+    display: inline-block; /* Permite que a largura seja ajustada pelo conteúdo */
+      padding: 10px; /* Espaçamento interno */
+      border: 1px solid #ccc; /* Borda para destacar o div */
+      min-width: 150px; /* Largura mínima */
+      max-width: 300px; /* Largura máxima */
+      word-wrap: break-word; /* Quebra o texto se ele ultrapassar a largura máxima */
+      text-align: center;
+  }
+
 `;
 
 interface StatusProps {

diff --git a/src/Components/Card/CardSchedule/style.tsx b/src/Components/Card/CardSchedule/style.tsx
@@ -5,6 +5,10 @@ export const Container = styled.div`
   color: ${styles.colors.grayClear};
   font-size: ${styles.typography.font.extraSmall};
   justify-content: space-between;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
 
   .boxQuantity {
     display: flex;

diff --git a/src/Components/Card/CardTs/style.tsx b/src/Components/Card/CardTs/style.tsx
@@ -8,6 +8,10 @@ export const Container = styled.div`
 
   border: 1.22px solid rgba(219, 230, 255, 1);
   background: ${styles.colors.colorCard};
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
   
   border-radius: 16px;
 

diff --git a/src/Context/Classroom/state.tsx b/src/Context/Classroom/state.tsx
@@ -29,7 +29,7 @@ export const ClassroomState = () => {
 
     const { requestCreateClassroomMutation, requestChangeClassroomMutation, requestDeleteClassroomMutation, requestUpdateClassroomMutation } = ControllerClassroom()
 
-    const UpdateClassroom = (body: {name: string}, id: number) => {
+    const UpdateClassroom = (body: {name: string, status: string}, id: number) => {
         requestUpdateClassroomMutation.mutate({data: body, id: id})
     }
 

diff --git a/src/Context/Classroom/type.ts b/src/Context/Classroom/type.ts
@@ -8,6 +8,7 @@ export interface ClassroomTypes {
   UpdateClassroom: (
     body: {
       name: string;
+      status: string
     },
     id: number
   ) => void;

diff --git a/src/Context/Project/ProjectOne/context.tsx b/src/Context/Project/ProjectOne/context.tsx
@@ -5,11 +5,11 @@ import { ProjectOneTypes } from "./type";
 export const ProjectOneContext = createContext<ProjectOneTypes | null>(null);
 
 const ProjectOneProvider = ({ children }: { children: React.ReactNode }) => {
-  const { isLoading, project, updateProject, rulerProject } = ProjectOneState();
+  const { isLoading, project, updateProject, rulerProject, deleteProject } = ProjectOneState();
 
   return (
     <ProjectOneContext.Provider
-      value={{ isLoading, project, updateProject, rulerProject }}
+      value={{ isLoading, project, updateProject, rulerProject, deleteProject }}
     >
       {children}
     </ProjectOneContext.Provider>

diff --git a/src/Context/Project/ProjectOne/state.tsx b/src/Context/Project/ProjectOne/state.tsx
@@ -8,7 +8,7 @@ export const ProjectOneState = () => {
   const { id } = useParams();
   const { data, isLoading } = useFetchRequestProjectOne(parseInt(id!));
   const [project, setProject] = useState();
-  const { requestUpdateprojectMutation, requestRulerprojectMutation } =
+  const { requestUpdateprojectMutation, requestRulerprojectMutation, requestDeleteprojectMutation } =
     ProjectController();
 
   useEffect(() => {
@@ -21,6 +21,10 @@ export const ProjectOneState = () => {
     requestUpdateprojectMutation.mutate({ data: data, id: id });
   };
 
+  const deleteProject = (id: number) => {
+    requestDeleteprojectMutation.mutate({ id: id });
+  };
+
   const rulerProject = (file: File, id: number) => {
     const formData = new FormData();
 
@@ -32,6 +36,7 @@ export const ProjectOneState = () => {
     project,
     isLoading,
     updateProject,
-    rulerProject
+    rulerProject,
+    deleteProject
   };
 };
diff --git a/src/Context/Project/ProjectOne/type.tsx b/src/Context/Project/ProjectOne/type.tsx
@@ -5,6 +5,7 @@ export interface ProjectOneTypes {
   isLoading: boolean;
   updateProject: (data: UpdateProject, id: number) => void;
   rulerProject: (file: File, id: number) => void
+  deleteProject: (id: number) => void
 }
 
 export interface ApiProject {

diff --git a/src/Controller/controllerGlobal.tsx b/src/Controller/controllerGlobal.tsx
@@ -1,5 +1,5 @@
 import axios from "axios";
-import { Buffer } from 'buffer'; 
+import { Buffer } from 'buffer';
 
 
 export const gerarIdAleatorio = (tamanho: number) => {
@@ -24,15 +24,15 @@ export function formatarData(data: string): string {
 export function converterData(data: string) {
   // Divide a string pelo separador "/"
   const partes = data.split('/');
-  
+
   // As partes serão: partes[0] = dia, partes[1] = mês, partes[2] = ano
   const dia = partes[0];
   const mes = partes[1];
   const ano = partes[2];
-  
+
   // Reorganiza no formato YYYY-MM-DD
   const dataFormatada = `${ano}-${mes}-${dia}`;
-  
+
   return dataFormatada;
 }
 
@@ -51,12 +51,29 @@ export const VerifyColor = (color_race_number: number) => {
 };
 
 export const getStatus = (id: string) => {
+  const status = getStatusList();
+  return status.find((props) => props.id === id);
+};
+
+export const getStatusList = () => {
   const status = [
     { id: Status.APPROVED, name: "Aprovado" },
     { id: Status.REPROVED, name: "Reprovado" },
-    { id: Status.PENDING, name: "Pedente" },
+    { id: Status.PENDING, name: "Pendente" },
+    { id: Status.PENDING_DOCUMENTATION, name: "Pendente de documentação" },
+    { id: Status.PENDING_TERM, name: "Pendente de termo" },
+
   ];
-  return status.find((props) => props.id === id);
+  return status;
+};
+
+
+export const getStatusClassroomList = () => {
+  const status = [
+    { id: Status.APPROVED, name: "Aprovado" },
+    { id: Status.PENDING, name: "Pendente" },
+  ];
+  return status;
 };
 
 export var typesex = [
@@ -78,6 +95,17 @@ export const Status = {
   APPROVED: "APPROVED",
   PENDING: "PENDING",
   REPROVED: "REPROVED",
+  PENDING_TERM: "PENDING_TERM",
+  PENDING_DOCUMENTATION: "PENDING_DOCUMENTATION"
+};
+
+
+export const StatusEnum: any = {
+  APPROVED: "Aprovado",
+  PENDING: "Pendente",
+  REPROVED: "Reprovado",
+  PENDING_TERM: "Pend. de termo",
+  PENDING_DOCUMENTATION: "Pend. de documentação"
 };
 
 export const ROLE = {

diff --git a/src/Pages/Classroom/ClassroomOne/RegistrationList/Registration/index.tsx b/src/Pages/Classroom/ClassroomOne/RegistrationList/Registration/index.tsx
@@ -2,6 +2,7 @@ import { Form, Formik } from "formik";
 import { Button } from "primereact/button";
 import { useContext } from "react";
 import { useParams } from "react-router-dom";
+import avatar from "../../../../../Assets/images/avatar.svg";
 import ContentPage from "../../../../../Components/ContentPage";
 import DropdownComponent from "../../../../../Components/Dropdown";
 import MaskInput from "../../../../../Components/InputMask";
@@ -12,14 +13,13 @@ import RegistartionDetailsProvider, {
 } from "../../../../../Context/Classroom/Registration/context";
 import { RegistrationDetailsTypes } from "../../../../../Context/Classroom/Registration/type";
 import {
-  Status,
   color_race,
-  typesex,
+  getStatusList,
+  typesex
 } from "../../../../../Controller/controllerGlobal";
 import { useFetchRequestClassroomOne } from "../../../../../Services/Classroom/query";
 import { Padding } from "../../../../../Styles/styles";
 import { Avatar } from "../../../../Beneficiaries/BeneficiariesEdit";
-import avatar from "../../../../../Assets/images/avatar.svg"
 
 
 const Registration = () => {
@@ -70,11 +70,9 @@ const RegistrationPage = () => {
                       name="status"
                       placerholder="Status"
                       optionsLabel="name"
-                      options={[
-                        { id: Status.APPROVED, name: "Aprovado" },
-                        { id: Status.REPROVED, name: "Reprovado" },
-                        { id: Status.PENDING, name: "Pedente" },
-                      ]}
+                      options={
+                        getStatusList()
+                      }
                     />
                   </div>
                 </div>{" "}