Develop

GomezMorinFrontEnd/package.json

@@ -31,6 +31,7 @@
     "react-hook-form": "^7.43.8",
     "react-icons": "^4.8.0",
     "react-loader-spinner": "^5.3.4",
+    "react-pdf": "^6.2.2",
     "react-redux": "^8.0.5",
     "react-responsive-carousel": "^3.2.23",
     "react-router-dom": "^6.10.0"

GomezMorinFrontEnd/src/App.jsx

@@ -2,7 +2,8 @@ import { BrowserRouter, Route, Routes } from "react-router-dom";
 import Layout from "./components/Layout";
 import Register from "./pages/Register";
 import Login from "./pages/Login";
-import { useSelector } from "react-redux";
+import RequestForm from "./pages/RequestForm";
+import PageRequest from "./pages/PageRequest";
 
 const App = () => {
   return (
@@ -12,6 +13,8 @@ const App = () => {
           <Route path="/" element={<Layout />}>
             <Route path="/register" element={<Register />} />
             <Route path="/login" element={<Login />} />
+            <Route path="/request-form" element={<RequestForm />} />
+            <Route path="/request" element={<PageRequest />} />
           </Route>
         </Routes>
       </BrowserRouter>

GomezMorinFrontEnd/src/components/Button.jsx

@@ -8,22 +8,23 @@ import React from "react";
  * @param {string} colorBg - The color of the background of the button. Example: bg-red-600
  * @param {string} colorHoverBg- The color of the background of the button when hover. Example: hover:bg-red-700
  * @param {function} action- The path that will navigate to.
+ * @param {boolean} disabled - Boolean to enable/disable the button
  * @returns {JSX.Element} The JSX element displaying a button.
  */
 
-const Button = ({ text, type, colorBg, colorHoverBg, action }) => {
+const Button = ({ text, type, colorBg, colorHoverBg, action, disabled = false }) => {
   const styles = [
     "w-full",
     colorBg,
     "text-white",
     "text-sm",
     "p-2",
     "rounded-lg",
-    colorHoverBg,
+    `hover:${colorHoverBg}`,
   ];
 
   return (
-    <button className={styles.join(" ")} type={type} onClick={action}>
+    <button className={styles.join(" ")} type={type} onClick={action} disabled={disabled}>
       {text}
     </button>
   );

GomezMorinFrontEnd/src/components/DropdownInput.jsx

@@ -24,9 +24,9 @@ const DropdownInput = ({ name, label, id, options }) => {
         name={name}
         id={id}
       >
-        <option key={""}>- Select -</option>
+        <option key={""} value={""}>- Selecciona -</option>
         {options.map((option) => (
-          <option key={option._id}>{option.value}</option>
+          <option key={option._id} value={option.value}>{option.value}</option>
         ))}
       </select>
     </div>

GomezMorinFrontEnd/src/components/Footer.jsx

@@ -8,29 +8,27 @@ import React from "react";
  */
 const Footer = () => {
   return (
-    <div className="sticky -bottom-full w-full h-16 bg-gray-blue-500 drop-shadow-lg">
-      <div className="flex justify-between items-center">
-        <div className="px-4 pt-2">
-          <img
-            className="object-scale-down h-12"
-            src="/images/gomez_morin_blanco.png"
-          />
-        </div>
-        <div className="px-3 pt-2 text-white">
-          <p className="text-[#ffffff]">(442) 251 9600 Ext. 9613</p>
-        </div>
-        <div className="px-3 pt-2">
-          <p className="text-white">
-            Av. Constituyentes Esq. Luis Pasteur S/N Col. Villa del Sur,
-            C.P.76000. Santiago de Querétaro.
-          </p>
-        </div>
-        <div className="px-4 pt-2">
-          <img
-            className="object-scale-down h-12"
-            src="/images/gomez_morin_blanco.png"
-          />
-        </div>
+    <div className="flex w-full h-16 justify-between items-center bg-gray-blue-500 drop-shadow-lg">
+      <div className="px-4 pt-2">
+        <img
+          className="object-scale-down h-12"
+          src="/images/gomez_morin_blanco.png"
+        />
+      </div>
+      <div className="px-3 pt-2 text-white">
+        <p className="text-[#ffffff]">(442) 251 9600 Ext. 9613</p>
+      </div>
+      <div className="px-3 pt-2">
+        <p className="text-white">
+          Av. Constituyentes Esq. Luis Pasteur S/N Col. Villa del Sur,
+          C.P.76000. Santiago de Querétaro.
+        </p>
+      </div>
+      <div className="px-4 pt-2">
+        <img
+          className="object-scale-down h-12"
+          src="/images/gomez_morin_blanco.png"
+        />
       </div>
     </div>
   );