src/components/layouts/DashboardLayout.jsx

@@ -70,7 +70,7 @@ const DashboardLayout = ({ children }) => {
     },
     header: {
       padding: 0,
-      backgroundColor: '#fff',
+      backgroundColor: '#F6F6F4',
     },
     trigger: {
       color: '#333',
@@ -234,6 +234,7 @@ const DashboardLayout = ({ children }) => {
           openKeys={openKeys}
           onOpenChange={onOpenChange}
           selectedKeys={selectedKey}
+          style={{background: "#F6F6F4"}}
           items={[
             ...dashboardRoutes.map(sidebarMapper),
             {
@@ -266,7 +267,7 @@ const DashboardLayout = ({ children }) => {
                 style={dashStyles.breadcrumb}
                 items={breadcrumbItems?.map((item, index) => ({
                   title: (
-                    <Link to={item?.to}>
+                    <Link to={item?.to} style={{color: "#242424"}}>
                       {item?.icon}
                       <span> {item?.name} </span>
                     </Link>
@@ -300,7 +301,9 @@ const DashboardLayout = ({ children }) => {
           className="site-layout-background"
           style={{
             margin: 10,
+            marginRight: 10,
             minHeight: 280,
+            background: "#ffffff"
           }}
           children={children}
         />

src/views/catalogos/estados/EstadoDetalle.jsx

@@ -5,6 +5,7 @@ import { respuestas } from '../../../utilities'
 import { useNavigate } from 'react-router-dom'
 import { useQuery, useModel } from '../../../hooks'
 import { commonRules } from '../../../constants/rules'
+import DefaultLayout from '../../../components/layouts/DefaultLayout'
 
 
 const endpoints = {
@@ -83,7 +84,8 @@ const EstadoDetalle = () => {
 
 
   return (
-    <Form
+    <DefaultLayout>
+      <Form
       layout="vertical"
       name="basic"
       form={form}
@@ -116,6 +118,11 @@ const EstadoDetalle = () => {
             <Input />
           </Form.Item>
         </Col>
+        <Col span={6}>
+            <Form.Item label="ID Sagarhpa" name="idSagarhpa">
+              <Input type="number"/>
+            </Form.Item>
+          </Col>
         <Col span={24}>
           <Form.Item>
             <Button
@@ -130,6 +137,7 @@ const EstadoDetalle = () => {
         </Col>
       </Row>
     </Form>
+    </DefaultLayout>
   )
 }
 

src/views/catalogos/estados/Estados.jsx

@@ -1,6 +1,6 @@
 import { useRef, useState } 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";

src/views/catalogos/municipios/MunicipioDetalle.jsx

@@ -157,8 +157,8 @@ const MunicipioDetalle = () => {
               />
             </Form.Item>
           </Col>
-          <Col span={24}>
-            <Form.Item label="Estado" name="niveles">
+          <Col span={12}>
+            <Form.Item label="Nivel" name="niveles">
               <AntSelect
                 style={{ width: "100%" }}
                 options={niveles}
@@ -166,6 +166,11 @@ const MunicipioDetalle = () => {
               />
             </Form.Item>
           </Col>
+          <Col span={12}>
+            <Form.Item label="ID Sagarhpa" name="idSagarhpa">
+              <Input type="number"/>
+            </Form.Item>
+          </Col>
           <Col span={24}>
             <Form.Item>
               <Button

src/views/catalogos/nivel/Formulario.jsx

@@ -4,6 +4,8 @@ import HttpService from '../../../services/httpService'
 import { respuestas } from '../../../utilities'
 import { SaveOutlined } from '@ant-design/icons'
 import { useNavigate } from 'react-router-dom'
+import DefaultLayout from '../../../components/layouts/DefaultLayout'
+import { commonRules } from '../../../constants/rules'
 
 
 export const Formulario = ({ model = null, id, alTerminar, endPoint, url, idModelo, media }) => {
@@ -47,55 +49,49 @@ export const Formulario = ({ model = null, id, alTerminar, endPoint, url, idMode
     }
   }, [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}
+  return (
+    <DefaultLayout>
+      <Form
+        layout="vertical"
+        name="basic"
+        form={form}
+        onFinish={handleFinish}
+        onFinishFailed={() => {}}
+      >
+        <Row gutter={[10, 10]}>
+          <Col span={24}>
+            <h2>Información de Nivel</h2>
+          </Col>
+          <Col span={24} md={12}>
+            <Form.Item
+              label="Clave"
+              name="clave"
+              rules={[commonRules.requerido]}
             >
-              Guardar
-            </Button>
-          </Form.Item>
-        </Col>
-      </Row>
-    </Form>
-  )
+              <Input size="large" />
+            </Form.Item>
+          </Col>
+          <Col span={12}>
+            <Form.Item label="Nombre" name="nombre">
+              <Input/>
+            </Form.Item>
+          </Col>
+          <Col span={24}>
+            <Form.Item>
+              <Button
+                size="large"
+                type="primary"
+                htmlType="submit"
+                loading={guardando}
+                style={{ marginTop: "30px" }}
+              >
+                Guardar
+              </Button>
+            </Form.Item>
+          </Col>
+        </Row>
+      </Form>
+    </DefaultLayout>
+  );
 
 }

src/views/catalogos/nivel/index.jsx

@@ -10,16 +10,6 @@ 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',
@@ -28,6 +18,16 @@ const columnas = [
       <Link to={`${url}/editar?id=${item[idModelo]}`} style={{ color: 'black' }}>
         {item?.clave}
       </Link>
+  },
+  {
+    title: 'Nombre',
+    index: 'nombre',
+    key: 'nombre',
+    dataIndex: 'nombre',
+    render: (_, item) =>
+      <Link to={`${url}/editar?id=${item[idModelo]}`} style={{ color: 'black' }}>
+        {item?.nombre}
+      </Link>
   }, 
 ]
 

src/views/catalogos/productos/ProductoDetalle.jsx

@@ -6,6 +6,7 @@ import { useNavigate } from "react-router-dom";
 import { useQuery, useModel } from "../../../hooks";
 import { commonRules } from "../../../constants/rules";
 import { MinusCircleOutlined, PlusOutlined } from "@ant-design/icons";
+import DefaultLayout from "../../../components/layouts/DefaultLayout";
 
 const endpoints = {
   producto: "producto",
@@ -94,7 +95,8 @@ const ProductoDetalle = () => {
   };
 
   return (
-    <Form
+    <DefaultLayout>
+      <Form
       layout="vertical"
       name="basic"
       form={form}
@@ -190,6 +192,7 @@ const ProductoDetalle = () => {
         </Col>
       </Row>
     </Form>
+    </DefaultLayout>  
   );
 };