Edición municipios

src/views/catalogos/municipios/MunicipioDetalle.jsx

@@ -1,6 +1,7 @@
 import { Form, Input, Button, Spin, Row, Col } from 'antd';
-import { useEffect, useMemo, useState } from 'react';
+import { useEffect, useMemo, useState, useCallback } from 'react';
 import { useNavigate } from 'react-router-dom';
+import { respuestas } from '../../../utilities'
 import HttpService from '../../../services/httpService';
 import { useQuery, useModel } from '../../../hooks';
 import { commonRules } from '../../../constants/rules';
@@ -18,55 +19,42 @@ const MunicipioDetalle = () => {
   const id = query.get("id");
   const [estado, setEstado] = useState("");
   const [timer, setTimer] = useState(null);
+  const [request, setRequest] = useState({})
 
-  const extraParams = useMemo(() => ({
-    idMunicipio: id,
+  const estadoExtraParams = useMemo(() => ({
     idEstado: id,
-  }), [id]);
-
-  const estadoExtraParams = useMemo(() => {
-    let params = {};
-    if (estado !== "") {
-      params.nombre = estado;
-    }
-    return params;
-  }, [estado]);
+  }), [id])
 
   const requestParams = useMemo(() => ({
     name: endpoints.municipio,
-    id: id,
-    extraParams: extraParams,
-    expand: 'estado',
-  }), [id, extraParams]);
-
-  const { model, modelLoading } = useModel(requestParams);
+    id,
+  }), [id])
 
-  useEffect(() => {
-    if (model) {
-      form.setFieldsValue({
-        ...model,
-        idEstado: model.estado?.id,
-      });
-    }
-  }, [form, model]);
+  const { model, modelLoading } = useModel(request)
 
   const onFinish = async (values) => {
     try {
       setLoading(true);
-      const body = { ...values, id };
+
+      let body = {
+        ...values,
+      };
+
+      if (id) {
+        body.id = id
+      }
+
       const res = await HttpService.post(`${endpoints.municipio}/guardar`, body);
+      respuestas(res);
       if (res?.status === 200) {
-        navigate('/administracion/catalogos/municipios');
+        navigate('/administracion/catalogos/municipios')
       }
     } catch (error) {
       console.log(error);
+      setLoading(false);
     } finally {
       setLoading(false);
     }
-  };
-
-  if (modelLoading) {
-    return <Spin size="large" style={{ display: "block", margin: "auto", marginTop: "50px" }} />;
   }
 
   const onSearch = (value) => {
@@ -77,6 +65,24 @@ const MunicipioDetalle = () => {
     setTimer(newTimer);
   };
 
+
+  useEffect(() => {
+    if (id) {
+      setRequest(requestParams)
+    }
+    return () => {
+      setRequest({})
+    }
+  }, [id, requestParams])
+
+  useEffect(() => {
+    if (model) {
+      form.setFieldsValue({ 
+        ...model,
+      })
+    }
+  }, [form, model])
+
   return (
     <Form
       layout="vertical"
@@ -108,7 +114,7 @@ const MunicipioDetalle = () => {
               modelsParams={{ name: 'estado', ordenar: 'nombre' }}
               labelProp="nombre"
               valueProp="id"
-              append={[model?.estado]}
+              append={form.getFieldValue('idEstado') ? [{ id: form.getFieldValue('idEstado'), nombre: form.getFieldValue('estado') }] : []}
               onSearch={onSearch}
               extraParams={estadoExtraParams}
             />