Merge pull request #16 from ipti/new/registration

logo report
ipti · May 29, 2024 · 80c2294 · 80c2294
2 parents 4b3b1bc + b317426
commit 80c2294
Show file tree

Hide file tree

Showing 6 changed files with 87 additions and 66 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/Assets/images/lateralFile.svg b/src/Assets/images/lateralFile.svg
diff --git a/src/Assets/images/thplogo.svg b/src/Assets/images/thplogo.svg
diff --git a/src/Pages/Classroom/ClassroomOne/Report/Pdf/index.tsx b/src/Pages/Classroom/ClassroomOne/Report/Pdf/index.tsx
@@ -7,6 +7,8 @@ import {
   ReportClassroomType,
 } from "../../../../../Services/Classroom/type";
 import { useEffect, useRef, useState } from "react";
+import img from "../../../../../Assets/images/thplogo.svg";
+import imgLateral from "../../../../../Assets/images/lateralFile.svg";
 
 import html2canvas from "html2canvas";
 import jsPDF from "jspdf";
@@ -75,63 +77,68 @@ const ReportClassroom = () => {
           data-pr-tooltip="PDF"
         />
       </Row>
-      <Container ref={contentRef} style={{ width: "100%" }}>
-        <Padding padding="16px" />
-        <Row className="flex justify-content-center">
-          <Column>
-            {/* <h2 style={{ textAlign: "center" }}>
-              TS: {report?.project.social_technology.name}
-            </h2> */}
-            <h3 style={{ textAlign: "center" }}>{report?.project.name}</h3>
-          </Column>
-        </Row>
-        <Padding padding="8px" />
-        <Row style={{ justifyContent: "center" }}>
-          <div
-            style={{ height: 1, width: "80%", backgroundColor: "black" }}
-          ></div>
-        </Row>
-        <Padding padding="8px" />
-        <Row className="flex justify-content-center">
-          <h2>Relatório de frequência</h2>
-        </Row>
-        <Padding padding="8px" />
-        <Padding padding="0 48px">
-          <Table>
-            <thead>
-              <tr>
-                <Th className="flex row justify-content-center">{report?.name}</Th>
-              </tr>
-            </thead>
-          </Table>
-          <Table>
-            <thead>
-              <tr>
-                <Th>Beneficiarios</Th>
-                <Th>Encontros</Th>
-                <Th>Faltas</Th>
-                <Th>Frequência</Th>
-              </tr>
-            </thead>
-            <tbody>
-              {report?.register_classroom?.map(
-                (item: RegisterClassroom, index: number) => {
-                  return (
-                    <tr key={index}>
-                      <Td>{item.registration.name}</Td>
-                      <Td>{report.meeting.length}</Td>
-                      <Td>{bodyTotal(item).count}</Td>
-                      <Td>{bodyTotal(item).percentage}%</Td>
-                    </tr>
-                  );
-                }
-              )}
-
-              {/* Adicione as linhas para os demais alunos aqui */}
-            </tbody>
-          </Table>
-        </Padding>
-      </Container>
+      <Row ref={contentRef}>
+        <Column className="flex justify-content-end" style={{marginLeft: "16px", marginTop: "256px"}}>
+          <img alt="" src={imgLateral} style={{ width: "80%" }} />
+        </Column>
+        <Container >
+          <Padding padding="16px" />
+          <Row className="flex justify-content-center">
+            <img alt="" src={img} style={{ width: "80%" }} />
+          </Row>
+          <Padding padding="16px" />
+          <Row className="flex justify-content-center">
+            <Column>
+              <h2 style={{ textAlign: "center" }}>THE HUMAN PROJECT - THP </h2>
+              <h2 style={{ textAlign: "center", fontWeight: "400" }}>
+                {report?.project.name.toUpperCase()}
+              </h2>
+            </Column>
+          </Row>
+          <Padding padding="16px" />
+          <Row className="flex justify-content-center">
+            <h3>Relatório de frequência</h3>
+          </Row>
+          <Padding padding="8px" />
+          <Padding padding="0 4%">
+            <Table>
+              <thead>
+                <tr>
+                  <Td style={{ width: "60%" }}>Facilitador: </Td>
+                  <Td style={{ width: "40%" }}>Turma: {report?.name}</Td>
+                </tr>
+              </thead>
+            </Table>
+            <Padding padding="8px" />
+            <Table>
+              <thead>
+                <tr>
+                  <Th>Beneficiarios</Th>
+                  <Th>Encontros</Th>
+                  <Th>Faltas</Th>
+                  <Th>Frequência</Th>
+                </tr>
+              </thead>
+              <tbody>
+                {report?.register_classroom?.map(
+                  (item: RegisterClassroom, index: number) => {
+                    return (
+                      <tr key={index}>
+                        <Td>{item.registration.name}</Td>
+                        <Td>{report.meeting.length}</Td>
+                        <Td>{bodyTotal(item).count}</Td>
+                        <Td>{bodyTotal(item).percentage}%</Td>
+                      </tr>
+                    );
+                  }
+                )}
+              </tbody>
+            </Table>
+          </Padding>
+        </Container>
+      </Row>
+
+      <Padding padding="16px" />
     </>
   );
 };

diff --git a/src/Pages/Classroom/ClassroomOne/Report/Pdf/style.ts b/src/Pages/Classroom/ClassroomOne/Report/Pdf/style.ts
@@ -1,13 +1,11 @@
 import styled from "styled-components";
 import styles from "../../../../../Styles";
 
-
 export const Container = styled.div`
-    font-family: ${styles.typography.types.inter};
-
-   
-        font-size: 3vh;
-    
+  font-family: ${styles.typography.types.inter};
+  width: 100%;
+  height: 100%;
+  font-size: 3vh;
 `;
 
 export const Table = styled.table`
@@ -25,4 +23,4 @@ export const Td = styled.td`
   border: 1px solid #ddd;
 
   padding: 8px;
-`;
+`;
diff --git a/src/Router/privaterouternotlayout.tsx b/src/Router/privaterouternotlayout.tsx
@@ -8,7 +8,9 @@ const PrivateRouteNotLayout = ({ Component }: { Component: React.ReactNode }) =>
 
   return isAuthenticated() ?
     <AplicationProvider>
+      <div style={{overflowY: "auto", height: "100%"}}>
         {Component}
+      </div>
     </AplicationProvider>
     : <Navigate to="/register" />
 }