4.1 hu codificacion queries

GomezMorinFrontEnd/src/components/EditModal.jsx

@@ -6,29 +6,34 @@ import { FormProvider, useForm } from "react-hook-form";
 import { Dialog, Transition } from "@headlessui/react";
 import { ModeEditOutline } from "@mui/icons-material";
 import DropdownInput from "./DropdownInput";
+import { updateForms } from "../queries/queryRequestForm";
 
 /**
  *  A React component that renders a modal with a form
- * 
+ *
  * @returns {Jsx.Element} - A React JSX element representing a modal with a form
  */
-const EditModal = () => {
+const EditModal = ({ idForm }) => {
   const methods = useForm();
   const [isOpen, setIsOpen] = useState(false);
 
   /**
    *  Handles the submit of the form
-   * 
+   *
    * @param {object} data
    */
-  const onSubmit = (data) => {
-
+  const onSubmit = async (data) => {
+    try {
+      await updateForms({ ...data, idForm: idForm });
+    } catch (err) {
+      alert(err.response.data.message);
+    }
     setIsOpen(false);
   };
 
   /**
    * Handles the closing of the modal
-   * 
+   *
    * @returns {void}
    */
 
@@ -38,7 +43,7 @@ const EditModal = () => {
 
   /**
    * Handles the opening of the modal
-   * 
+   *
    * @returns {void}
    */
   const openModal = () => {
@@ -92,7 +97,9 @@ const EditModal = () => {
                     <FormProvider {...methods}>
                       <div className="flex flex-col justify-between h-full gap-4">
                         <form
-                          onSubmit={methods.handleSubmit(onSubmit)}
+                          onSubmit={methods.handleSubmit((data) =>
+                            onSubmit(data, idForm)
+                          )}
                           className="flex flex-col justify-between h-full gap-4"
                         >
                           <InputForm

GomezMorinFrontEnd/src/pages/RequestAll/index.jsx

@@ -24,7 +24,7 @@ const RequestAll = () => {
       field: "actions",
       headerName: "",
       width: 200,
-      renderCell: () => <EditModal />,
+      renderCell: ({ row }) => <EditModal idForm={row.id} />,
     },
   ];
 
@@ -41,7 +41,9 @@ const RequestAll = () => {
         ? item.membretatedLetterDoc
         : item.nameEvent,
       estatus: item.status,
-      renderCell: () => <EditModal id={item.id} />,
+      renderCell: ({ id }) => {
+        return <EditModal idForm={id} />;
+      },
     }));
   };
 

GomezMorinFrontEnd/src/queries/queryRequestForm.js

@@ -222,3 +222,24 @@ export const getAllForms = async (userId) => {
     return Promise.reject(err);
   }
 };
+
+/**
+ * Updates the form with the given ID by sending a PATCH request to the server with the specified data.
+ *
+ * @param data an object containing the data to update the form with, including the form's folio number, status, and ID.
+ * @return a Promise that resolves with the updated form data if the request succeeds, or rejects with an error if the request fails.
+ */
+
+export const updateForms = async (data) => {
+  try {
+    const { folio, tipoDocumento, idForm } = data;
+    const response = await axios.patch(
+      `${baseURL}/solicitudes/updateRequest/${idForm}`,
+      { folio, tipoDocumento }
+    );
+
+    return response.data;
+  } catch (err) {
+    return Promise.reject(err);
+  }
+};