src/routers/routes.jsx

@@ -30,6 +30,7 @@ import { Municipios, MunicipioDetalle } from "../views/catalogos/municipios";
 import { TipoMovilizaciones, TipoMovilizacionDetalle } from "../views/catalogos/tipoMovilizaciones";
 import { FinMovilizaciones, FinMovilizacionDetalle } from "../views/catalogos/finMovilizaciones";
 import { Condicionantes, CondicionanteDetalle } from "../views/condicionantes";
+import { Nivel, NivelDetalle} from '../views/catalogos/nivel'
 /* CATÁLOGOS */
 import { Perfil } from "../views/perfil";
 import { Modulos } from "../views/admin/permisos/modulos";
@@ -245,6 +246,28 @@ const dashboardRoutes = [
           },
           {
             layout: "dashboard",
+            path: "/nivel",
+            name: "Nivel",
+            icon: <ApartmentOutlined />,
+            sidebar: "single",
+            ver: "MENU-ADMIN",
+            routes: [
+              {
+                path: "/",
+                element: Nivel,
+              },
+              {
+                path: "/agregar",
+                element: NivelDetalle,
+              },
+              {
+                path: "/editar",
+                element: NivelDetalle,
+              },
+            ],
+          },
+          {
+            layout: "dashboard",
             path: "/tipoMovilizaciones",
             name: "Tipos de Movilización",
             icon: <ApartmentOutlined />,

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}
             />

src/views/catalogos/nivel/Detalle.jsx

@@ -0,0 +1,53 @@
+import { useState, useMemo, useEffect } from 'react'
+import { DefaultLayout } from '../../../components/layouts'
+import { useQuery, useModel } from '../../../hooks'
+import { Formulario } from './Formulario'
+
+const Detalle = ({ endPoint, expand, url, orden, idModelo, media }) => {
+  const q = useQuery()
+  const id = q.get('id')
+  const editando = Boolean(id)
+
+  const [request, setRequest] = useState({})
+
+  const requestParams = useMemo(() => ({
+    name: endPoint,
+    id: id,
+    ordenar: orden,
+    expand: expand,
+  }), [id])
+
+  const {
+    model,
+    modelLoading
+  } = useModel(request)
+
+  useEffect(() => {
+    setRequest(requestParams)
+    return () => {
+      setRequest({})
+    }
+  }, [requestParams])
+
+  return (
+    <DefaultLayout
+      viewLoading={{
+        text: 'Cargando ...',
+        spinning: modelLoading
+      }}
+    >
+      <Formulario
+        id={id}
+        url={url}
+        model={model}
+        idModelo={idModelo}
+        expand={expand}
+        endPoint={endPoint}
+        media={media}
+        editando={editando}
+      />
+    </DefaultLayout>
+  )
+}
+
+export default Detalle

src/views/catalogos/nivel/Formulario.jsx

@@ -0,0 +1,101 @@
+import React, { useState } from 'react'
+import { Input, Form, Row, Col, Button } from 'antd'
+import HttpService from '../../../services/httpService'
+import { respuestas } from '../../../utilities'
+import { SaveOutlined } from '@ant-design/icons'
+import { useNavigate } from 'react-router-dom'
+
+
+export const Formulario = ({ model = null, id, alTerminar, endPoint, url, idModelo, media }) => {
+  const [form] = Form.useForm()
+  const navigate = useNavigate()
+
+  const [guardando, setGuardando] = useState(false)
+
+  const handleFinish = async (values) => {
+
+    try {
+      setGuardando(true)
+
+      let body = {
+        ...values,
+      }
+
+      if (id) {
+        body[idModelo] = id
+      }
+
+      const res = await HttpService.post(`${endPoint}/guardar`, body)
+      if (respuestas(res)) {
+        navigate(url)
+      }
+    } catch (e) {
+      console.log(e)
+    } finally {
+      setGuardando(false)
+    }
+
+  }
+
+  React.useEffect(() => {
+    if (model || model !== null) {
+      form.setFieldsValue({
+        ...model,
+      })
+    } else {
+      form.resetFields()
+    }
+  }, [form, model])
+
+  return (<Form
+      layout="vertical"
+      form={form}
+      onFinish={handleFinish}
+    >
+      <Row gutter={[10, 0]}>
+        <Col xs={24} lg={12}>
+          <Form.Item
+            label="Clave"
+            name="clave"
+            rules={[{
+              required: true,
+              message: 'Por favor ingresa una clave'
+            }]}
+          >
+            <Input/>
+          </Form.Item>
+        </Col>
+        <Col xs={24} lg={12}>
+          <Form.Item
+            label="Nombre"
+            name="nombre"
+            rules={[{
+              required: true,
+              message: 'Por favor ingresa un nombre'
+            }]}
+          >
+            <Input/>
+          </Form.Item>
+        </Col>
+      </Row>
+      <br/>
+      <Row justify="end">
+        <Col xs={24} lg={6}>
+          <Form.Item>
+            <Button
+              type="primary"
+              htmlType="submit"
+              size="large"
+              block
+              icon={<SaveOutlined/>}
+              loading={guardando}
+            >
+              Guardar
+            </Button>
+          </Form.Item>
+        </Col>
+      </Row>
+    </Form>
+  )
+
+}

src/views/catalogos/nivel/Listado.jsx

@@ -0,0 +1,79 @@
+import React, { useState, useEffect, useMemo } from 'react'
+import { useNavigate } from 'react-router-dom'
+import { PlusOutlined } from '@ant-design/icons'
+import { SimpleTableLayout } from '../../../components/layouts'
+import { Tabla, ActionsButton } from '../../../components'
+import { eliminarRegistro, } from '../../../utilities'
+
+const Listado = ({ endPoint, columnas, idModelo, orden, expand }) => {
+
+  const tablaRef = React.useRef(null)
+
+  const navigate = useNavigate()
+
+  const [reqConvenio, setReqConvenio] = useState({})
+  const [buscar, setBuscar] = useState('')
+
+  const btnGroup = [
+    {
+      onClick: () => navigate('agregar'),
+      props: { disabled: false, type: 'primary', block: false },
+      text: 'Agregar',
+      icon: <PlusOutlined/>,
+    }
+  ]
+
+  const columns = [
+    {
+      width: '5%',
+      title: '',
+      render: (_, item) =>
+        <ActionsButton
+          data={[
+            {
+              label: 'Editar',
+              onClick: () => {
+                setReqConvenio(item)
+                navigate(`editar?id=${item[idModelo]}`)
+              }
+            },
+            {
+              label: "Eliminar",
+              onClick: () => {
+                eliminarRegistro(item?.nombre, item?.id, `${endPoint}/eliminar`, () =>
+                  tablaRef?.current?.refresh()
+                );
+              },
+              danger: true,
+            },
+          ]}
+        />
+    },
+    ...columnas
+  ]
+
+  const handleSearch = (buscar) => {
+    setBuscar(buscar)
+  }
+
+  return (
+    <SimpleTableLayout
+      onSearch={handleSearch}
+      btnGroup={
+        { btnGroup }
+      }
+    >
+      <Tabla
+        nameURL={endPoint}
+        order={orden}
+        extraParams={{buscar: buscar}}
+        columns={columns}
+        ref={tablaRef}
+        idModelo={idModelo}
+        expand={expand}
+      />
+    </SimpleTableLayout>
+  )
+}
+
+export default Listado

src/views/catalogos/nivel/index.jsx

@@ -0,0 +1,49 @@
+import Detalle from './Detalle'
+import Listado from './Listado'
+import { Link } from 'react-router-dom'
+import React from 'react'
+
+const endPoint = 'nivel'
+const url = '/administracion/catalogos/nivel'
+const orden = 'nombre-desc'
+const idModelo = 'id'
+
+const columnas = [
+  {
+    title: 'Nombre',
+    index: 'nombre',
+    key: 'nombre',
+    dataIndex: 'nombre',
+    render: (_, item) =>
+      <Link to={`${url}/editar?id=${item[idModelo]}`} style={{ color: 'black' }}>
+        {item?.nombre}
+      </Link>
+  },
+  {
+    title: 'Clave',
+    index: 'clave',
+    key: 'clave',
+    dataIndex: 'clave',
+    render: (_, item) =>
+      <Link to={`${url}/editar?id=${item[idModelo]}`} style={{ color: 'black' }}>
+        {item?.clave}
+      </Link>
+  }, 
+]
+
+const Nivel = () => (<Listado
+  endPoint={endPoint}
+  url={url}
+  orden={orden}
+  columnas={columnas}
+  idModelo={idModelo}
+/>)
+
+const NivelDetalle = () => (<Detalle
+  endPoint={endPoint}
+  url={url}
+  orden={orden}
+  idModelo={idModelo}
+/>)
+
+export { Nivel, NivelDetalle }

src/views/condicionantes/CondicionanteDetalle.jsx

@@ -5,6 +5,7 @@ import { respuestas } from '../../utilities';
 import { useNavigate } from 'react-router-dom';
 import { useQuery, useModel } from '../../hooks';
 import { Select } from '../../components';
+import EditorTexto from "../../components/EditorTexto";
 import { DefaultLayout } from '../../components/layouts';
 
 const { Text } = Typography;
@@ -327,7 +328,7 @@ const CondicionanteDetalle = () => {
                 { required: true, message: 'La descripción es obligatoria.' }
               ]}
             >
-              <Input.TextArea rows={3} />
+              <EditorTexto altura={200} />
             </Form.Item>
           </Col>
           <Col md={12} xs={24}>

src/views/condicionantes/Condicionantes.jsx

@@ -1,6 +1,6 @@
 import { useRef, useState, useCallback, useMemo } from "react";
-import { Form, Modal, Tooltip, notification } from "antd";
-import { DeleteOutlined, PlusOutlined } from "@ant-design/icons";
+import { Form, Tooltip } from "antd";
+import { PlusOutlined } from "@ant-design/icons";
 import { Tabla } from "../../components";
 import { SimpleTableLayout } from "../../components/layouts";
 import { ActionsButton } from "../../components";
@@ -48,8 +48,6 @@ const Condicionantes = () => {
     </Link>
   );
 
-
-
   const columns = [
     {
       title: "Acciones",
@@ -88,7 +86,9 @@ const Condicionantes = () => {
       title: "Descripción",
       key: "descripcion",
       dataIndex: "descripcion",
-      render: linkText,
+      render: (text) => (
+        <div dangerouslySetInnerHTML={{ __html: text }} />
+      ),
     },
     {
       title: "Activa",