Merge pull request #256 from markalbrand56/front_searchbar

translations and css
markalbrand56 · Nov 17, 2023 · 5858c70 · 5858c70
2 parents 8dfb31f + 538a35f
commit 5858c70
Show file tree

Hide file tree

Showing 9 changed files with 85 additions and 59 deletions.
diff --git a/uniEmpleos/src/components/Chat/Chat.module.css b/uniEmpleos/src/components/Chat/Chat.module.css
@@ -54,10 +54,8 @@
 }
 
 .pfp img {
-  width: 100%;
-  height: 100%;
-  max-width: 60px;
-  max-height: 60px;
+  width: 60px;
+  height: 60px;
   min-width: 30px;
   min-height: 30px;
   border-radius: 50%;

diff --git a/uniEmpleos/src/components/Header/Header.jsx b/uniEmpleos/src/components/Header/Header.jsx
@@ -27,10 +27,10 @@ export const Header = () => {
         navigate("/profile")
         break
       case "enterprise":
-        navigate("/profilecompany")
+        navigate("/postulacionempresa")
         break
       case "admin":
-        navigate("/profile")
+        navigate("/profileadmin")
         break
       default:
         navigate("/jobs")

diff --git a/uniEmpleos/src/locales/en/translation.json b/uniEmpleos/src/locales/en/translation.json
@@ -101,7 +101,8 @@
       "career": "Career",
       "university": "University",
       "semester": "Semester",
-      "register": "Register"
+      "register": "Register",
+      "age": "Age"
     }
   },
   "editProfileEnterprise": {

diff --git a/uniEmpleos/src/locales/es/translation.json b/uniEmpleos/src/locales/es/translation.json
@@ -102,7 +102,8 @@
       "career": "Carrera",
       "university": "Universidad",
       "semester": "Semestre",
-      "register": "Registrarse"
+      "register": "Registrarse",
+      "age": "Edad"
     }
   },
   "editProfileEnterprise": {

diff --git a/uniEmpleos/src/pages/EditProfileEmpresas/EditProfileEmpresa.jsx b/uniEmpleos/src/pages/EditProfileEmpresas/EditProfileEmpresa.jsx
@@ -199,7 +199,12 @@ const EditProfileEmpresa = () => {
               </div>
             </div>
             <div className={style.buttonContainer}>
-              <Button label={t("editProfileEnterprise.page.save")} onClick={handleButton} />
+              <Button
+                label={t("editProfileEnterprise.page.save")}
+                onClick={handleButton}
+                backgroundColor="#a08ae5"
+                noborder
+              />
             </div>
           </div>
         </div>

diff --git a/uniEmpleos/src/pages/PostulantesPage/PostulantesPage.jsx b/uniEmpleos/src/pages/PostulantesPage/PostulantesPage.jsx
@@ -51,30 +51,32 @@ const PostulantesPage = ({ id }) => {
         close={() => setWarning(false)}
       />
       <h1>Postulantes</h1>
-      {loading ? (
-        <Loader size={100} />
-      ) : (
-        <div className={style.infoStudentContainer}>
-          {response.data ? (
-            response.data.map((postulante) => (
-              <InfoStudent
-                key={postulante.id_estudiante}
-                nombre={postulante.nombre}
-                apellido={postulante.apellido}
-                universidad={postulante.universidad}
-                pfp={
-                  postulante.foto === ""
-                    ? fotoPFP
-                    : `${API_URL}/api/uploads/${postulante.foto}`
-                }
-                onClick={() => handleClickUsuario(postulante.id_estudiante)}
-              />
-            ))
-          ) : (
-            <span className={style.sinPostulantes}>No hay postulantes</span>
-          )}
-        </div>
-      )}
+      <div className={style.containerPostulants}>
+        {loading ? (
+          <Loader size={100} />
+        ) : (
+          <div className={style.infoStudentContainer}>
+            {response.data ? (
+              response.data.map((postulante) => (
+                <InfoStudent
+                  key={postulante.id_estudiante}
+                  nombre={postulante.nombre}
+                  apellido={postulante.apellido}
+                  universidad={postulante.universidad}
+                  pfp={
+                    postulante.foto === ""
+                      ? fotoPFP
+                      : `${API_URL}/api/uploads/${postulante.foto}`
+                  }
+                  onClick={() => handleClickUsuario(postulante.id_estudiante)}
+                />
+              ))
+            ) : (
+              <span className={style.sinPostulantes}>No hay postulantes</span>
+            )}
+          </div>
+        )}
+      </div>
     </div>
   )
 }

diff --git a/uniEmpleos/src/pages/PostulantesPage/PostulantesPage.module.css b/uniEmpleos/src/pages/PostulantesPage/PostulantesPage.module.css
@@ -9,14 +9,14 @@
     font-weight: 700;
     margin-bottom: 20px;
     color: #333333;
-    text-align: left;
+    text-align: center;
     padding: 20px;
 }
 
 .infoStudentContainer {
     display: flex;
     flex-wrap: wrap;
-    justify-content: start;
+    justify-content: center;
     gap: 30px;
     margin-top: 20px;
     padding: 10px;

diff --git a/uniEmpleos/src/pages/PublicProfile/PublicProfile.jsx b/uniEmpleos/src/pages/PublicProfile/PublicProfile.jsx
@@ -7,14 +7,16 @@ import { PiBooksLight } from "react-icons/pi"
 import { LiaUniversitySolid, LiaBirthdayCakeSolid } from "react-icons/lia"
 import { AiTwotoneCalendar } from "react-icons/ai"
 import { HiOutlineMailOpen, HiOutlineDocumentDownload } from "react-icons/hi"
-import { LuFileSpreadsheet } from "react-icons/lu"
+import { useTranslation } from "react-i18next"
 import useApi from "../../Hooks/useApi"
 import Popup from "../../components/Popup/Popup"
 import { navigate } from "../../store"
 import style from "./PublicProfile.module.css"
 import API_URL from "../../api"
+import Loader from "../../components/Loader/Loader"
 
 const PublicProfile = ({ params }) => {
+  const { t } = useTranslation()
   const correo = params.split("-")[0]
   const idOferta = params.split("-")[1]
   const api = useApi()
@@ -25,6 +27,7 @@ const PublicProfile = ({ params }) => {
   const [usuario, setUsuario] = useState([])
   const [carrera, setCarrera] = useState("")
   const [edad, setEdad] = useState("")
+  const [loading, setLoading] = useState(false)
 
   const obtenerCarrera = async () => {
     const datos = await carreraApi.handleRequest("GET", "/careers")
@@ -45,8 +48,8 @@ const PublicProfile = ({ params }) => {
     setEdad(edadActual)
   }
 
-  console.log("-->", usuario)
   const obtenerPostulante = async () => {
+    setLoading(true)
     const datos = await api.handleRequest("POST", "/users/details", {
       correo,
     })
@@ -56,6 +59,7 @@ const PublicProfile = ({ params }) => {
       } else {
         setUsuario(datos.data.company)
       }
+      setLoading(false)
     } else {
       setTypeError(1)
       setError("Ups, algo salio mal al obtener el perfil")
@@ -100,10 +104,12 @@ const PublicProfile = ({ params }) => {
         }}
         onClick={() => navigate(`/postulantes/${idOferta}`)}
       />
-      {usuario ? (
+      {loading ? (
+        <Loader size={100} />
+      ) : (
         <div className={style.infoContainer}>
           <h1 className={style.title}>
-            Perfil de {usuario.nombre} {usuario.apellido}
+            {usuario.nombre} {usuario.apellido}
           </h1>
           <div className={style.tipoContainer}>
             {usuario.foto && (
@@ -116,47 +122,47 @@ const PublicProfile = ({ params }) => {
               </div>
             )}
             <div className={style.subInfoContainer}>
-              <div className={style.profileli}>
-                <BiUser size={30} />
-                <span className={style.profileSpan}>
-                  Nombre: {`${usuario.nombre} ${usuario.apellido}`}
-                </span>
-              </div>
               <div className={style.profileli}>
                 <HiOutlineMailOpen size={30} />
-                <span className={style.correo}>Correo: {usuario.correo}</span>
+                <span className={style.correo}>
+                  {t("signUpStudent.page.email")}: {usuario.correo}
+                </span>
               </div>
               <div className={style.profileli}>
                 <BsPhone size={30} />
                 <span className={style.profileSpan}>
-                  Telefono: {usuario.telefono}
+                  {t("signUpStudent.page.phone")}: {usuario.telefono}
                 </span>
               </div>
               {usuario.universidad && (
                 <div className={style.profileli}>
                   <LiaUniversitySolid size={30} />
                   <span className={style.profileSpan}>
-                    Universidad: {usuario.universidad}
+                    {t("signUpStudent.page.university")}: {usuario.universidad}
                   </span>
                 </div>
               )}
               {usuario.carrera && (
                 <div className={style.profileli}>
                   <PiBooksLight size={30} />
-                  <span className={style.profileSpan}>Carrera: {carrera}</span>
+                  <span className={style.profileSpan}>
+                    {t("signUpStudent.page.career")}: {carrera}
+                  </span>
                 </div>
               )}
               {usuario.nacimiento && (
                 <div className={style.profileli}>
                   <LiaBirthdayCakeSolid size={30} />
-                  <span className={style.profileSpan}>Edad: {edad}</span>
+                  <span className={style.profileSpan}>
+                    {t("signUpStudent.page.age")}: {edad}
+                  </span>
                 </div>
               )}
               {usuario.semestre && (
                 <div className={style.profileli}>
                   <AiTwotoneCalendar size={30} />
                   <span className={style.profileSpan}>
-                    Semestre: {usuario.semestre}
+                    {t("signUpStudent.page.semester")}: {usuario.semestre}
                   </span>
                 </div>
               )}
@@ -173,8 +179,6 @@ const PublicProfile = ({ params }) => {
             </div>
           </div>
         </div>
-      ) : (
-        <div>Cargando</div>
       )}
     </div>
   )

diff --git a/uniEmpleos/src/pages/PublicProfile/PublicProfile.module.css b/uniEmpleos/src/pages/PublicProfile/PublicProfile.module.css
@@ -23,7 +23,6 @@
     justify-content: end;
     align-items: end;
     width: 50%;
-    height: 50%;
 }
 
 .tipoContainer {
@@ -36,8 +35,9 @@
 
 .pfp {
     display: flex;
-    width: 60%;
-    height: 60%;
+    width: 400px;
+    height: 400px;
+    object-fit: cover;
     border-radius: 10%;
     box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
 }
@@ -77,6 +77,15 @@
     gap: 10px;
 }
 
+.mainContainer {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+}
+
 
 @media screen and (max-width: 768px) {
     .pfpContainer {
@@ -87,8 +96,8 @@
     }
 
     .pfp {
-        width: 100%;
-        height: 100%;
+        width: 300px;
+        height: 300px;
     }
 
     .profileSpan {
@@ -114,10 +123,16 @@
         width: 100%;
         gap: 0;
         align-items: start;
-        margin-top: 10%;
+        margin-top: 5%;
+        gap: 10px;
     }
 
     .subInfoContainer>* {
         gap: 10px;
     }
+
+    .mainContainer{
+        justify-content: center;
+    }
+
 }