{"id":110,"date":"2026-06-02T00:04:00","date_gmt":"2026-06-02T00:04:00","guid":{"rendered":"https:\/\/citlaltepetl.gob.mx\/portal\/?page_id=110"},"modified":"2026-06-02T00:08:28","modified_gmt":"2026-06-02T00:08:28","slug":"menu-transparencia","status":"publish","type":"page","link":"https:\/\/citlaltepetl.gob.mx\/portal\/transparencia\/menu-transparencia\/","title":{"rendered":"MENU TRANSPARENCIA"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"110\" class=\"elementor elementor-110\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1cbb7c6 e-flex e-con-boxed e-con e-parent\" data-id=\"1cbb7c6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4d1f401 elementor-widget elementor-widget-shortcode\" data-id=\"4d1f401\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><div id=\"transparencia\"><\/div>\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\">\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/PapaParse\/5.4.1\/papaparse.min.js\"><\/script>\r\n\r\n<style>\r\n:root{\r\n  --guinda:#611232;\r\n  --guinda-oscuro:#4A0D25;\r\n  --dorado:#BC955C;\r\n  --crema:#F8F3E8;\r\n  --gris:#f5f5f5;\r\n}\r\n\r\n*{box-sizing:border-box;}\r\n\r\n#transparencia{\r\n  font-family:Arial,sans-serif;\r\n  padding:18px;\r\n  color:#333;\r\n}\r\n\r\n.titulo{\r\n  text-align:center;\r\n  font-size:24px;\r\n  color:var(--guinda);\r\n  font-weight:700;\r\n  margin-bottom:10px;\r\n}\r\n\r\n.titulo::after{\r\n  content:\"\";\r\n  width:90px;\r\n  height:4px;\r\n  background:linear-gradient(90deg,var(--guinda),var(--dorado));\r\n  display:block;\r\n  margin:10px auto 0;\r\n  border-radius:20px;\r\n}\r\n\r\n.resumen{\r\n  display:grid;\r\n  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));\r\n  gap:12px;\r\n  margin:18px 0;\r\n}\r\n\r\n.res-card{\r\n  background:#fff;\r\n  border:1px solid #eadcc8;\r\n  border-left:5px solid var(--guinda);\r\n  border-radius:14px;\r\n  padding:14px;\r\n  box-shadow:0 8px 22px rgba(97,18,50,.08);\r\n}\r\n\r\n.res-card span{\r\n  display:block;\r\n  font-size:13px;\r\n  color:#666;\r\n}\r\n\r\n.res-card b{\r\n  font-size:24px;\r\n  color:var(--guinda);\r\n}\r\n\r\n.controls{\r\n  display:grid;\r\n  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));\r\n  gap:10px;\r\n  margin-bottom:12px;\r\n}\r\n\r\n.controls input,\r\n.controls select{\r\n  padding:10px;\r\n  border:1px solid #ddd;\r\n  border-radius:8px;\r\n  font-size:15px;\r\n  width:100%;\r\n  background:#fff;\r\n}\r\n\r\n.controls input:focus,\r\n.controls select:focus{\r\n  outline:none;\r\n  border-color:var(--dorado);\r\n  box-shadow:0 0 0 3px rgba(188,149,92,.20);\r\n}\r\n\r\n.info-bar{\r\n  display:flex;\r\n  justify-content:space-between;\r\n  align-items:center;\r\n  gap:10px;\r\n  flex-wrap:wrap;\r\n  margin-bottom:12px;\r\n  font-size:14px;\r\n  color:#555;\r\n}\r\n\r\n.btn{\r\n  background:var(--guinda);\r\n  color:#fff;\r\n  padding:8px 12px;\r\n  border-radius:8px;\r\n  font-size:13px;\r\n  cursor:pointer;\r\n  text-decoration:none;\r\n  display:inline-block;\r\n  text-align:center;\r\n  border:none;\r\n  transition:.2s;\r\n}\r\n\r\n.btn:hover{\r\n  background:var(--dorado);\r\n  color:#fff;\r\n  transform:translateY(-1px);\r\n}\r\n\r\n.btn-sec{\r\n  background:var(--dorado);\r\n}\r\n\r\n.table-box{\r\n  border:1px solid #e3d8c8;\r\n  border-radius:14px;\r\n  overflow-x:auto;\r\n  background:#fff;\r\n  box-shadow:0 8px 24px rgba(97,18,50,.08);\r\n}\r\n\r\ntable{\r\n  width:100%;\r\n  border-collapse:collapse;\r\n}\r\n\r\nth{\r\n  background:linear-gradient(90deg,var(--guinda),var(--guinda-oscuro));\r\n  color:#fff;\r\n  padding:13px;\r\n  font-size:14px;\r\n  cursor:pointer;\r\n}\r\n\r\ntd{\r\n  padding:11px;\r\n  font-size:14px;\r\n  border-top:1px solid #eee;\r\n}\r\n\r\ntr:hover{\r\n  background:#fbf8f2;\r\n}\r\n\r\n.badge{\r\n  padding:5px 11px;\r\n  border-radius:20px;\r\n  font-size:12px;\r\n  color:#fff;\r\n  display:inline-block;\r\n  font-weight:600;\r\n}\r\n\r\n.comun{background:var(--guinda);}\r\n.especifica{background:var(--dorado);}\r\n\r\n#transparencia a,\r\n#transparencia a:visited{\r\n  color:#fff !important;\r\n}\r\n\r\n.paginacion{\r\n  display:flex;\r\n  justify-content:center;\r\n  flex-wrap:wrap;\r\n  gap:5px;\r\n  margin-top:15px;\r\n}\r\n\r\n.paginacion button{\r\n  padding:7px 11px;\r\n  border:none;\r\n  background:#eee;\r\n  border-radius:6px;\r\n  cursor:pointer;\r\n}\r\n\r\n.paginacion .active{\r\n  background:var(--guinda);\r\n  color:#fff;\r\n}\r\n\r\n.detalle{\r\n  padding:18px;\r\n  background:#fff;\r\n  border-radius:16px;\r\n  box-shadow:0 10px 30px rgba(97,18,50,.08);\r\n  border-left:6px solid var(--dorado);\r\n}\r\n\r\n.volver-sticky{\r\n  position:sticky;\r\n  top:10px;\r\n  z-index:5;\r\n  margin-bottom:15px;\r\n}\r\n\r\n.detalle h2{\r\n  font-size:20px;\r\n  color:var(--guinda);\r\n  margin-bottom:10px;\r\n  border-bottom:2px solid var(--crema);\r\n  padding-bottom:8px;\r\n}\r\n\r\n.meta{\r\n  display:flex;\r\n  flex-wrap:wrap;\r\n  gap:10px;\r\n  margin-bottom:15px;\r\n}\r\n\r\n.meta div{\r\n  background:var(--crema);\r\n  border:1px solid #eadcc8;\r\n  padding:8px 12px;\r\n  border-radius:8px;\r\n  font-size:13px;\r\n}\r\n\r\n.acordeon{\r\n  margin-top:15px;\r\n  border-radius:12px;\r\n  border:1px solid #eadcc8;\r\n  background:#fff;\r\n  box-shadow:0 6px 18px rgba(97,18,50,.06);\r\n  border-left:5px solid var(--guinda);\r\n  overflow:hidden;\r\n}\r\n\r\n.acordeon-header{\r\n  padding:13px;\r\n  display:flex;\r\n  justify-content:space-between;\r\n  cursor:pointer;\r\n  background:var(--crema);\r\n  font-weight:600;\r\n  color:var(--guinda);\r\n}\r\n\r\n.acordeon-body{\r\n  display:none;\r\n  padding:12px;\r\n}\r\n\r\n.acordeon.active .acordeon-body{\r\n  display:block;\r\n}\r\n\r\n.detalle-tabla{\r\n  width:100%;\r\n  border-collapse:collapse;\r\n  font-size:14px;\r\n}\r\n\r\n.detalle-tabla th{\r\n  background:var(--guinda);\r\n  color:#fff;\r\n  padding:10px;\r\n}\r\n\r\n.detalle-tabla td{\r\n  padding:10px;\r\n  border-top:1px solid #ddd;\r\n}\r\n\r\n.loading{\r\n  text-align:center;\r\n  padding:35px;\r\n  color:var(--guinda);\r\n  font-weight:700;\r\n}\r\n\r\n.loading i{\r\n  animation:girar 1s linear infinite;\r\n}\r\n\r\n@keyframes girar{\r\n  from{transform:rotate(0deg);}\r\n  to{transform:rotate(360deg);}\r\n}\r\n\r\n@media(max-width:768px){\r\n  table,thead,tbody,th,td,tr{\r\n    display:block;\r\n    width:100%;\r\n  }\r\n\r\n  th{display:none;}\r\n\r\n  tr{\r\n    background:#fff;\r\n    margin-bottom:12px;\r\n    border-radius:12px;\r\n    box-shadow:0 4px 10px rgba(97,18,50,.08);\r\n    padding:10px;\r\n  }\r\n\r\n  td{\r\n    border:none;\r\n    padding:7px 0;\r\n    display:flex;\r\n    justify-content:space-between;\r\n    gap:12px;\r\n    font-size:13px;\r\n  }\r\n\r\n  td::before{\r\n    content:attr(data-label);\r\n    font-weight:700;\r\n    color:var(--guinda);\r\n  }\r\n\r\n  .btn{\r\n    width:100%;\r\n    margin-top:8px;\r\n  }\r\n\r\n  .meta{\r\n    flex-direction:column;\r\n  }\r\n\r\n  .detalle-tabla th{\r\n    display:none;\r\n  }\r\n\r\n  .detalle-tabla td{\r\n    display:flex;\r\n    justify-content:space-between;\r\n    border:none;\r\n    padding:8px 0;\r\n  }\r\n\r\n  .detalle-tabla td::before{\r\n    content:attr(data-label);\r\n    font-weight:bold;\r\n    color:var(--guinda);\r\n  }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function(){\r\n\r\nconst CSV_URL = \"https:\/\/docs.google.com\/spreadsheets\/d\/e\/2PACX-1vSuP9de8e51pSxXNHWXHsmC8hSQESMoWaAz3wJRLIPNklZHZHE-H_NMAq2tJlmd9A\/pub?output=csv\";\r\n\r\nlet DATA = [];\r\nlet FILTRADO = [];\r\nlet PAGE = 1;\r\nlet SORT = \"fraccion-asc\";\r\nconst PER_PAGE = 10;\r\n\r\nfunction limpiar(v){\r\n  return (v || \"\").toString().trim();\r\n}\r\n\r\nfunction numeroFraccion(v){\r\n  const n = limpiar(v).match(\/\\d+\/);\r\n  return n ? parseInt(n[0]) : 9999;\r\n}\r\n\r\nasync function init(){\r\n  const cont = document.getElementById(\"transparencia\");\r\n  cont.innerHTML = `<div class=\"loading\"><i class=\"fa-solid fa-circle-notch\"><\/i> Cargando informaci\u00f3n...<\/div>`;\r\n\r\n  const r = await fetch(CSV_URL);\r\n  const text = await r.text();\r\n  const parsed = Papa.parse(text,{header:true,skipEmptyLines:true});\r\n\r\n  DATA = parsed.data.filter(r=>r.Fracci\u00f3n);\r\n  FILTRADO = [...DATA];\r\n\r\n  render();\r\n  checkURL();\r\n}\r\n\r\nfunction aplicarFiltros(){\r\n  const busqueda = document.getElementById(\"busqueda\")?.value.toLowerCase() || \"\";\r\n  const tipo = document.getElementById(\"tipo\")?.value || \"\";\r\n  const anio = document.getElementById(\"anio\")?.value || \"\";\r\n  const trimestre = document.getElementById(\"trimestre\")?.value || \"\";\r\n\r\n  FILTRADO = DATA.filter(r=>{\r\n    const texto = `\r\n      ${r.Descripci\u00f3n || \"\"}\r\n      ${r.\u00c1rea || \"\"}\r\n      ${r.Fracci\u00f3n || \"\"}\r\n      ${r.Tipo || \"\"}\r\n      ${r[\"Tipo de Ley\"] || \"\"}\r\n      ${r.Vigencia || \"\"}\r\n      ${r.A\u00f1o || \"\"}\r\n      ${r.Trimestre || \"\"}\r\n    `.toLowerCase();\r\n\r\n    return texto.includes(busqueda)\r\n      && (!tipo || r.Tipo === tipo)\r\n      && (!anio || r.A\u00f1o === anio)\r\n      && (!trimestre || r.Trimestre === trimestre);\r\n  });\r\n\r\n  ordenarDatos();\r\n  PAGE = 1;\r\n  render();\r\n}\r\n\r\nfunction ordenarDatos(){\r\n  FILTRADO.sort((a,b)=>{\r\n    if(SORT === \"fraccion-asc\") return numeroFraccion(a.Fracci\u00f3n) - numeroFraccion(b.Fracci\u00f3n);\r\n    if(SORT === \"fraccion-desc\") return numeroFraccion(b.Fracci\u00f3n) - numeroFraccion(a.Fracci\u00f3n);\r\n    if(SORT === \"area-asc\") return limpiar(a.\u00c1rea).localeCompare(limpiar(b.\u00c1rea));\r\n    if(SORT === \"area-desc\") return limpiar(b.\u00c1rea).localeCompare(limpiar(a.\u00c1rea));\r\n    return 0;\r\n  });\r\n}\r\n\r\nfunction opcionesUnicas(campo){\r\n  return [...new Set(DATA.map(r=>limpiar(r[campo])).filter(Boolean))].sort((a,b)=>b.localeCompare(a));\r\n}\r\n\r\nfunction renderResumen(){\r\n  const comunes = DATA.filter(r=>r.Tipo===\"Com\u00fan\").length;\r\n  const especificas = DATA.filter(r=>r.Tipo===\"Espec\u00edfica\").length;\r\n\r\n  return `\r\n    <div class=\"resumen\">\r\n      <div class=\"res-card\">\r\n        <span>Total de registros<\/span>\r\n        <b>${DATA.length}<\/b>\r\n      <\/div>\r\n      <div class=\"res-card\">\r\n        <span>Obligaciones comunes<\/span>\r\n        <b>${comunes}<\/b>\r\n      <\/div>\r\n      <div class=\"res-card\">\r\n        <span>Obligaciones espec\u00edficas<\/span>\r\n        <b>${especificas}<\/b>\r\n      <\/div>\r\n      <div class=\"res-card\">\r\n        <span>Resultados visibles<\/span>\r\n        <b>${FILTRADO.length}<\/b>\r\n      <\/div>\r\n    <\/div>\r\n  `;\r\n}\r\n\r\nfunction render(){\r\n  const cont = document.getElementById(\"transparencia\");\r\n\r\n  ordenarDatos();\r\n\r\n  const inicio = (PAGE-1)*PER_PAGE;\r\n  const dataPage = FILTRADO.slice(inicio,inicio+PER_PAGE);\r\n  const totalPaginas = Math.ceil(FILTRADO.length\/PER_PAGE);\r\n\r\n  const anios = opcionesUnicas(\"A\u00f1o\");\r\n  const trimestres = opcionesUnicas(\"Trimestre\");\r\n\r\n  cont.innerHTML = `\r\n    <div class=\"titulo\">Men\u00fa de Transparencia<\/div>\r\n\r\n    ${renderResumen()}\r\n\r\n    <div class=\"controls\">\r\n      <input id=\"busqueda\" placeholder=\"Buscar por descripci\u00f3n, \u00e1rea, fracci\u00f3n, ley, vigencia, a\u00f1o o trimestre...\">\r\n\r\n      <select id=\"tipo\">\r\n        <option value=\"\">Todos los tipos<\/option>\r\n        <option value=\"Com\u00fan\">Com\u00fan<\/option>\r\n        <option value=\"Espec\u00edfica\">Espec\u00edfica<\/option>\r\n      <\/select>\r\n\r\n      <select id=\"anio\">\r\n        <option value=\"\">Todos los a\u00f1os<\/option>\r\n        ${anios.map(a=>`<option value=\"${a}\">${a}<\/option>`).join(\"\")}\r\n      <\/select>\r\n\r\n      <select id=\"trimestre\">\r\n        <option value=\"\">Todos los trimestres<\/option>\r\n        ${trimestres.map(t=>`<option value=\"${t}\">${t}<\/option>`).join(\"\")}\r\n      <\/select>\r\n\r\n      <select id=\"orden\">\r\n        <option value=\"fraccion-asc\">Fracci\u00f3n: menor a mayor<\/option>\r\n        <option value=\"fraccion-desc\">Fracci\u00f3n: mayor a menor<\/option>\r\n        <option value=\"area-asc\">\u00c1rea: A-Z<\/option>\r\n        <option value=\"area-desc\">\u00c1rea: Z-A<\/option>\r\n      <\/select>\r\n    <\/div>\r\n\r\n    <div class=\"info-bar\">\r\n      <div>\r\n        Mostrando <b>${dataPage.length}<\/b> de <b>${FILTRADO.length}<\/b> resultados\r\n      <\/div>\r\n      <button class=\"btn btn-sec\" id=\"limpiarFiltros\">\r\n        <i class=\"fa-solid fa-rotate-left\"><\/i> Limpiar filtros\r\n      <\/button>\r\n    <\/div>\r\n\r\n    <div class=\"table-box\">\r\n      <table>\r\n        <tr>\r\n          <th data-sort=\"tipo\">Tipo<\/th>\r\n          <th data-sort=\"area\">\u00c1rea<\/th>\r\n          <th data-sort=\"fraccion\">Fracci\u00f3n<\/th>\r\n          <th>Descripci\u00f3n<\/th>\r\n          <th><\/th>\r\n        <\/tr>\r\n\r\n        ${\r\n          dataPage.length ? dataPage.map(r=>`\r\n            <tr>\r\n              <td data-label=\"Tipo\">\r\n                <span class=\"badge ${r.Tipo===\"Espec\u00edfica\"?\"especifica\":\"comun\"}\">\r\n                  ${r.Tipo||\"-\"}\r\n                <\/span>\r\n              <\/td>\r\n              <td data-label=\"\u00c1rea\">${r.\u00c1rea||\"-\"}<\/td>\r\n              <td data-label=\"Fracci\u00f3n\">${r.Fracci\u00f3n}<\/td>\r\n              <td data-label=\"Descripci\u00f3n\">${r.Descripci\u00f3n}<\/td>\r\n              <td data-label=\"\">\r\n                <a href=\"?fraccion=${encodeURIComponent(r.Fracci\u00f3n)}\"\r\n                   class=\"btn link-ver\"\r\n                   data-f=\"${r.Fracci\u00f3n}\">\r\n                   <i class=\"fa-solid fa-eye\"><\/i> Ver\r\n                <\/a>\r\n              <\/td>\r\n            <\/tr>\r\n          `).join(\"\") : `\r\n            <tr>\r\n              <td colspan=\"5\" style=\"text-align:center;padding:24px;\">\r\n                No se encontraron resultados.\r\n              <\/td>\r\n            <\/tr>\r\n          `\r\n        }\r\n      <\/table>\r\n    <\/div>\r\n\r\n    <div class=\"paginacion\">\r\n      ${\r\n        Array.from({length:totalPaginas},(_,i)=>\r\n          `<button class=\"${PAGE==i+1?'active':''}\" data-p=\"${i+1}\">${i+1}<\/button>`\r\n        ).join(\"\")\r\n      }\r\n    <\/div>\r\n  `;\r\n\r\n  restaurarValores();\r\n}\r\n\r\nfunction restaurarValores(){\r\n  const busqueda = sessionStorage.getItem(\"busqueda\") || \"\";\r\n  const tipo = sessionStorage.getItem(\"tipo\") || \"\";\r\n  const anio = sessionStorage.getItem(\"anio\") || \"\";\r\n  const trimestre = sessionStorage.getItem(\"trimestre\") || \"\";\r\n  const orden = sessionStorage.getItem(\"orden\") || SORT;\r\n\r\n  if(document.getElementById(\"busqueda\")) document.getElementById(\"busqueda\").value = busqueda;\r\n  if(document.getElementById(\"tipo\")) document.getElementById(\"tipo\").value = tipo;\r\n  if(document.getElementById(\"anio\")) document.getElementById(\"anio\").value = anio;\r\n  if(document.getElementById(\"trimestre\")) document.getElementById(\"trimestre\").value = trimestre;\r\n  if(document.getElementById(\"orden\")) document.getElementById(\"orden\").value = orden;\r\n}\r\n\r\nfunction guardarValores(){\r\n  sessionStorage.setItem(\"busqueda\", document.getElementById(\"busqueda\")?.value || \"\");\r\n  sessionStorage.setItem(\"tipo\", document.getElementById(\"tipo\")?.value || \"\");\r\n  sessionStorage.setItem(\"anio\", document.getElementById(\"anio\")?.value || \"\");\r\n  sessionStorage.setItem(\"trimestre\", document.getElementById(\"trimestre\")?.value || \"\");\r\n  sessionStorage.setItem(\"orden\", document.getElementById(\"orden\")?.value || SORT);\r\n}\r\n\r\nfunction showDetail(f){\r\n  const cont = document.getElementById(\"transparencia\");\r\n  const datos = DATA.filter(r=>r.Fracci\u00f3n==f);\r\n  const base = datos[0];\r\n\r\n  if(!base){\r\n    render();\r\n    return;\r\n  }\r\n\r\n  let html = `\r\n  <div class=\"detalle\">\r\n    <div class=\"volver-sticky\">\r\n      <button class=\"btn\" id=\"btnVolver\">\r\n        <i class=\"fa-solid fa-arrow-left\"><\/i> Volver\r\n      <\/button>\r\n    <\/div>\r\n\r\n    <h2>${base.Descripci\u00f3n}<\/h2>\r\n\r\n    <div class=\"meta\">\r\n      <div><b>Fracci\u00f3n:<\/b> ${base.Fracci\u00f3n}<\/div>\r\n      <div><b>\u00c1rea:<\/b> ${base.\u00c1rea||\"-\"}<\/div>\r\n      <div><b>Tipo:<\/b> ${base.Tipo||\"-\"}<\/div>\r\n      <div><b>Ley:<\/b> ${base[\"Tipo de Ley\"]||\"-\"}<\/div>\r\n      <div><b>Vigencia:<\/b> ${base.Vigencia||\"-\"}<\/div>\r\n    <\/div>\r\n  `;\r\n\r\n  const g={};\r\n  datos.forEach(d=>{\r\n    const a=d.A\u00f1o||\"Sin a\u00f1o\";\r\n    if(!g[a])g[a]=[];\r\n    g[a].push(d);\r\n  });\r\n\r\n  const a\u00f1os = Object.keys(g).sort((a,b)=>b-a);\r\n\r\n  a\u00f1os.forEach((a,index)=>{\r\n    html+=`\r\n    <div class=\"acordeon ${index===0?'active':''}\">\r\n      <div class=\"acordeon-header\">\r\n        <span>${a} (${g[a].length})<\/span>\r\n        <i class=\"fa fa-chevron-down\"><\/i>\r\n      <\/div>\r\n\r\n      <div class=\"acordeon-body\">\r\n        <table class=\"detalle-tabla\">\r\n          <tr>\r\n            <th>Periodo<\/th>\r\n            <th>Fecha<\/th>\r\n            <th>Documento<\/th>\r\n          <\/tr>\r\n\r\n          ${\r\n            g[a].map(i=>`\r\n              <tr>\r\n                <td data-label=\"Periodo\">${i.Trimestre||\"General\"}<\/td>\r\n                <td data-label=\"Fecha\">${i.Fecha||\"-\"}<\/td>\r\n                <td data-label=\"Documento\">\r\n                  ${\r\n                    i.Enlace\r\n                    ? `<a href=\"${i.Enlace}\" target=\"_blank\" class=\"btn\">\r\n                         <i class=\"fa-solid fa-file-pdf\"><\/i> Ver\r\n                       <\/a>`\r\n                    : \"No disponible\"\r\n                  }\r\n                <\/td>\r\n              <\/tr>\r\n            `).join(\"\")\r\n          }\r\n        <\/table>\r\n      <\/div>\r\n    <\/div>\r\n    `;\r\n  });\r\n\r\n  html+=\"<\/div>\";\r\n  cont.innerHTML = html;\r\n\r\n  document.getElementById(\"btnVolver\").onclick = ()=>{\r\n    history.pushState({}, \"\", window.location.pathname);\r\n    render();\r\n  };\r\n}\r\n\r\ndocument.addEventListener(\"input\", e=>{\r\n  if(e.target.id===\"busqueda\"){\r\n    guardarValores();\r\n    aplicarFiltros();\r\n  }\r\n});\r\n\r\ndocument.addEventListener(\"change\", e=>{\r\n  if([\"tipo\",\"anio\",\"trimestre\",\"orden\"].includes(e.target.id)){\r\n    if(e.target.id===\"orden\") SORT = e.target.value;\r\n    guardarValores();\r\n    aplicarFiltros();\r\n  }\r\n});\r\n\r\ndocument.addEventListener(\"click\", e=>{\r\n  const link = e.target.closest(\".link-ver\");\r\n\r\n  if(link){\r\n    e.preventDefault();\r\n    const f = link.dataset.f;\r\n    history.pushState({f}, \"\", \"?fraccion=\"+encodeURIComponent(f));\r\n    showDetail(f);\r\n  }\r\n\r\n  if(e.target.dataset.p){\r\n    PAGE=parseInt(e.target.dataset.p);\r\n    render();\r\n  }\r\n\r\n  if(e.target.id===\"limpiarFiltros\"){\r\n    sessionStorage.clear();\r\n    SORT=\"fraccion-asc\";\r\n    FILTRADO=[...DATA];\r\n    PAGE=1;\r\n    render();\r\n  }\r\n\r\n  const header = e.target.closest(\".acordeon-header\");\r\n  if(header){\r\n    header.parentElement.classList.toggle(\"active\");\r\n  }\r\n\r\n  if(e.target.dataset.sort===\"fraccion\"){\r\n    SORT = SORT===\"fraccion-asc\" ? \"fraccion-desc\" : \"fraccion-asc\";\r\n    aplicarFiltros();\r\n  }\r\n\r\n  if(e.target.dataset.sort===\"area\"){\r\n    SORT = SORT===\"area-asc\" ? \"area-desc\" : \"area-asc\";\r\n    aplicarFiltros();\r\n  }\r\n});\r\n\r\nfunction checkURL(){\r\n  const p = new URLSearchParams(window.location.search);\r\n  const f = p.get(\"fraccion\");\r\n  if(f) showDetail(f);\r\n}\r\n\r\nwindow.addEventListener(\"popstate\", checkURL);\r\ndocument.addEventListener(\"DOMContentLoaded\", init);\r\n\r\n})();\r\n<\/script><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":84,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-110","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/citlaltepetl.gob.mx\/portal\/wp-json\/wp\/v2\/pages\/110","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/citlaltepetl.gob.mx\/portal\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/citlaltepetl.gob.mx\/portal\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/citlaltepetl.gob.mx\/portal\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/citlaltepetl.gob.mx\/portal\/wp-json\/wp\/v2\/comments?post=110"}],"version-history":[{"count":0,"href":"https:\/\/citlaltepetl.gob.mx\/portal\/wp-json\/wp\/v2\/pages\/110\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/citlaltepetl.gob.mx\/portal\/wp-json\/wp\/v2\/pages\/84"}],"wp:attachment":[{"href":"https:\/\/citlaltepetl.gob.mx\/portal\/wp-json\/wp\/v2\/media?parent=110"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}