{"id":1119,"date":"2024-08-07T05:19:44","date_gmt":"2024-08-07T05:19:44","guid":{"rendered":"https:\/\/site.japami.gob.mx\/?page_id=1119"},"modified":"2024-08-22T21:12:41","modified_gmt":"2024-08-22T21:12:41","slug":"consulta-pago","status":"publish","type":"page","link":"https:\/\/www.japami.gob.mx\/index.php\/consulta-pago\/","title":{"rendered":"Consulta Recibo"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1119\" class=\"elementor elementor-1119\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-049483f e-flex e-con-boxed e-con e-parent\" data-id=\"049483f\" 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-e54dee4 elementor-widget elementor-widget-shortcode\" data-id=\"e54dee4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\t<section class=\"container my-5\">\r\n    <div class=\"row m-2\">\r\n        <p class=\"fw-bolder fs-5\">Consulta de recibo<\/p>\r\n       <div class=\"col-md-4 fondomenu borderstart col-12\">\r\n                <ul class=\"menu\">\r\n                    <li class=\"mt-4 fw-bolder  fs-4\">\u00a1Bienvenido!<\/li>\r\n                    <li class=\"mb-5\" id=\"nombre_usuario\"><\/li>\r\n                <\/ul>\r\n                \r\n                <ul class=\"menu\">\r\n                    <li class=\"my-2\"><i class=\"fa-solid fa-house mx-2\"><\/i><a  id=\"inicio\">Inicio<\/a><\/li>\r\n\t\t\t\t\t<li class=\"my-2\"><i class=\"fa-solid fa-magnifying-glass mx-2\"><\/i><a  id=\"consulta\">Consultar recibo<\/a><\/li>\r\n\t\t\t\t\t<li class=\"my-2\"><i class=\"fa-solid fa-laptop mx-2\"><\/i><a id=\"pago\">Pago en linea<\/a><\/li>\r\n\t\t\t\t\t<li class=\"my-2\"><i class=\"fa-solid fa-file mx-2\"><\/i><a  id=\"factura\">Factura electr\u00f3nica<\/a><\/li>\r\n\t\t\t\t\t<!--<li class=\"my-2\"><i class=\"fa-solid fa-phone mx-2\"><\/i><a  id=\"aquatel\">Aquatel 073<\/a><\/li>-->\r\n\t\t\t\t\t<li class=\"my-2\"><i class=\"fa-solid fa-circle-info mx-2\"><\/i><a  id=\"ayuda\">Ayuda<\/a><\/li>\r\n                <\/ul>\r\n                <ul class=\"menu\">\r\n                    <p>Mis datos<\/p>\r\n                    <li><i class=\"fa-solid fa-inbox mx-2\"><\/i><a id=\"datosp\">Datos personales<\/a><\/li>\r\n                \t<li><i class=\"fa-solid fa-user mx-2\"><\/i><a id=\"datosi\">Datos de inicio de sesi\u00f3n<\/a><\/li>\r\n                <\/ul>\r\n                <ul class=\"menu\">\r\n                    <p>Mis cuentas<\/p>\r\n                    <li><i class=\"fa-solid fa-user-plus mx-2\"><\/i><a  id=\"agregar\">Agregar cuenta<\/a><\/li>\r\n\t\t\t\t\t<li><i class=\"fa-solid fa-arrow-right-from-bracket mx-2\"><\/i><a href=\"\" id=\"cerrar\">Cerrar Sesi\u00f3n<\/a><\/li>\r\n                <\/ul>\r\n                <ul class=\"menu  mb-4\">\r\n                    <li class=\"fw-bolder\">\u00daltima conexi\u00f3n<\/li>\r\n                    <li id=\"Conexion\">29 de Julio de 2024 - 1:40 p.m.<\/li>\r\n                <\/ul>\r\n            <\/div>\r\n        <div class=\"col-md-8 fondo_gris col-12 borderend px-4\">\r\n            <div class=\"my-5\"><\/div>\r\n            <a href=\"https:\/\/www.japami.gob.mx\/index.php\/inicio-2\/\" class=\"enlaces\" id=\"regresarmenu\"><i class=\"fa-solid fa-arrow-left-long enlaces\"><\/i><\/a>\r\n            <p class=\"my-3 text-center\">Estimado usuario, por este medio ponemos a su disposici\u00f3n la descarga de su recibo y el pago electr\u00f3nico con tarjeta.<\/p>\r\n            <div>\r\n                <select class=\"select3\" id=\"cuentas\">\r\n                    <option value=\"\">Elige tu cuenta<\/option>\r\n                <\/select>\r\n            <\/div>\r\n            <p class=\"p fw-bolder my-3\">Busca por Cuenta <i class=\"fa-solid fa-circle-info mx-2\"><\/i><\/p>\r\n            <form id=\"consultaReciboForm\">\r\n\t\t\t\t<p id=\"error-message\" style=\"color:red;\"><\/p>\r\n\t\t\t\t<div class=\"row\">\r\n\t\t\t\t\t<div class=\"col-md-3 col-12 my-3 my-md-2\">\r\n\t\t\t\t\t\t<div class=\"fondo_azul py-3 ps-3 w-100 rounded-top-2 border border-bottom-0 border-black\">\r\n\t\t\t\t\t\t\t<p>*Cuenta<\/p>\r\n\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t<div class=\"fondo_blanco w-100 rounded-bottom-2 border border-top-0 border-black\">\r\n\t\t\t\t\t\t\t<input type=\"text\" placeholder=\"\" class=\"input\" id=\"input_cuenta\" required>\r\n\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t<\/div>\r\n\t\t\t\t\t<div class=\"col-md-3 col-12 my-3 my-md-2\">\r\n\t\t\t\t\t\t<div class=\"fondo_azul py-3 ps-3 w-100 rounded-top-2 border border-bottom-0 border-black\">\r\n\t\t\t\t\t\t\t<p>*Region<\/p>\r\n\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t<div class=\"fondo_blanco w-100 rounded-bottom-2 border border-top-0 border-black\">\r\n\t\t\t\t\t\t\t<input type=\"text\" placeholder=\"\" class=\"input\" id=\"input_region\" required>\r\n\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t<\/div>\r\n\t\t\t\t\t<div class=\"col-md-3 col-12 my-3 my-md-2\">\r\n\t\t\t\t\t\t<div class=\"fondo_azul py-3 ps-3 w-100 rounded-top-2 border border-bottom-0 border-black\">\r\n\t\t\t\t\t\t\t<p>*Sector<\/p>\r\n\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t<div class=\"fondo_blanco w-100 rounded-bottom-2 border border-top-0 border-black\">\r\n\t\t\t\t\t\t\t<input type=\"text\" placeholder=\"\" class=\"input\" id=\"input_sector\" required>\r\n\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t<\/div>\r\n\t\t\t\t\t<div class=\"col-md-3 col-12 my-3 my-md-2\">\r\n\t\t\t\t\t\t<div class=\"fondo_azul py-3 ps-3 w-100 rounded-top-2 border border-bottom-0 border-black\">\r\n\t\t\t\t\t\t\t<p>*Reparto<\/p>\r\n\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t<div class=\"fondo_blanco w-100 rounded-bottom-2 border border-top-0 border-black\">\r\n\t\t\t\t\t\t\t<input type=\"text\" placeholder=\"\" class=\"input\" id=\"input_reparto\" required>\r\n\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t<\/div>\r\n\t\t\t\t\t<div class=\"col-md-12 col-6 my-3 my-md-2\">\r\n\t\t\t\t\t\t<button type=\"submit\" class=\"button\">Consultar Recibo<\/button>\r\n\t\t\t\t\t<\/div>\r\n\t\t\t\t<\/div>\r\n\t\t\t<\/form>\r\n            <form action=\"\"><!--\r\n                <div class=\"row\">\r\n                    <div class=\"col-md-10 col-12 row my-3 my-md-2\">\r\n                        <div class=\"col-md-4 col-12 pe-md-0 d-flex align-items-stretch\">\r\n                            <div class=\"fondo_azul py-3 ps-3 w-100 rounded-md-start-4 border border-md-end-0 border-black\">\r\n                                <p>*C\u00f3digo de barras<\/p>\r\n                            <\/div>\r\n                        <\/div>\r\n                        <div class=\"col-md-8 col-12 ps-md-0 d-flex align-items-stretch\">\r\n                            <div class=\"fondo_blanco w-100 rounded-md-end-4 border border-md-start-0 border-black\">\r\n                                <input type=\"text\" placeholder=\"\" class=\"input\" id=\"input_codigo_barras\">\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                    <div class=\"col-md-2 col-6 my-3 my-md-2 d-md-flex align-items-center\">\r\n                        <button class=\"button\">Consultar Recibo<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n-->            \r\n<\/form>\r\n            <p class=\"my-4\">Los campos con el s\u00edmbolo \u201c * \u201c, son obligatorios de capturar.<\/p>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\t<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    const token = localStorage.getItem('token');\r\n\r\n    if (token) {\r\n        fetch('https:\/\/webapi.japami.gob.mx\/siac\/accounts', {\r\n            method: 'GET',\r\n            headers: {\r\n                'Accept': 'application\/json',\r\n                'Authorization': `Bearer ${token}`, \r\n            }\r\n        })\r\n        .then(response => {\r\n            if (response.status === 401) {\r\n                console.error('Error de token');\r\n            } else if (response.status === 200) {\r\n                return response.json();\r\n            } else {\r\n                console.error('Error inesperado:', response.status);\r\n            }\r\n        })\r\n        .then(data => {\r\n            if (data && Array.isArray(data.accounts)) {\r\n                const selectElement = document.getElementById('cuentas');\r\n\t\t\t\t\r\n                data.accounts.forEach(item => {\r\n                    const option = document.createElement('option');\r\n                    option.value = item.account;\r\n\t\t\t\t\t\/\/console.log(item.account);\r\n                    encontrarCuentas(item.account)\r\n                    .then(accountData => {\r\n                        if (accountData) {\r\n                            option.textContent = `${accountData.owner} - ${accountData.ownerAddress}`;\r\n                        } else {\r\n                            option.textContent = item.account; \/\/ Fallback por si falla\r\n                        }\r\n                    });\r\n\r\n                    selectElement.appendChild(option);\r\n                });\r\n\r\n                selectElement.addEventListener('change', function() {\r\n                    const selectedAccount = selectElement.value;\r\n\r\n                    if (!selectedAccount) {\r\n                        document.getElementById('input_cuenta').value = '';\r\n                        document.getElementById('input_region').value = '';\r\n                        document.getElementById('input_sector').value = '';\r\n                        document.getElementById('input_reparto').value = '';\r\n                        document.getElementById('input_cuenta').disabled = false;\r\n                        document.getElementById('input_region').disabled = false;\r\n                        document.getElementById('input_sector').disabled = false;\r\n                        document.getElementById('input_reparto').disabled = false;\r\n                    } else {\r\n                        const selectedData = data.accounts.find(item => item.account === selectedAccount);\r\n\r\n                        if (selectedData) {\r\n                            encontrarCuenta(selectedData.account);\r\n                        }\r\n                    }\r\n                });\r\n            } else {\r\n                console.error('El array \"accounts\" no est\u00e1 presente o no es un array:', data);\r\n            }\r\n        })\r\n        .catch(error => {\r\n            console.error('Error en la petici\u00f3n:', error);\r\n        });\r\n    } else {\r\n        console.error('No se encontr\u00f3 token en localStorage');\r\n    }\r\n});\r\n\r\nfunction encontrarCuentas(id) {\r\n    const token = localStorage.getItem('token');\r\n    \r\n    if (!token) {\r\n        console.error('Token no encontrado');\r\n        return Promise.resolve(null);\r\n    }\r\n    \r\n    const data = {\r\n        accountId: id\r\n    };\r\n\r\n    return fetch('https:\/\/webapi.japami.gob.mx\/siac\/fetch', {\r\n        method: 'POST',\r\n        headers: {\r\n            'Accept': 'application\/json',\r\n            'Authorization': `Bearer ${token}`,\r\n            'Content-Type': 'application\/json'\r\n        },\r\n        body: JSON.stringify(data)\r\n    })\r\n    .then(response => {\r\n        if (!response.ok) {\r\n            throw new Error(`Error: ${response.status} ${response.statusText}`);\r\n        }\r\n        return response.json();\r\n    })\r\n    .then(accountData => {\r\n        return {\r\n            owner: accountData.account.ownerName,\r\n            ownerAddress: accountData.account.ownerAddress\r\n        };\r\n    })\r\n    .catch(error => {\r\n        console.error('Error:', error);\r\n        return null;\r\n    });\r\n}\r\n\r\nfunction encontrarCuenta(id) {\r\n    const token = localStorage.getItem('token');\r\n    \r\n    if (!token) {\r\n        console.error('Token no encontrado');\r\n        return Promise.resolve(null);\r\n    }\r\n    \r\n    const data = {\r\n        accountId: id\r\n    };\r\n\r\n    return fetch('https:\/\/webapi.japami.gob.mx\/siac\/fetch', {\r\n        method: 'POST',\r\n        headers: {\r\n            'Accept': 'application\/json',\r\n            'Authorization': `Bearer ${token}`,\r\n            'Content-Type': 'application\/json'\r\n        },\r\n        body: JSON.stringify(data)\r\n    })\r\n    .then(response => {\r\n        if (!response.ok) {\r\n            throw new Error(`Error: ${response.status} ${response.statusText}`);\r\n        }\r\n        return response.json();\r\n    })\r\n    .then(accountData => {\r\n        document.getElementById('input_cuenta').value = accountData.account.accountId || '';\r\n        document.getElementById('input_region').value = accountData.account.region || '';\r\n        document.getElementById('input_sector').value = accountData.account.sector || '';\r\n        document.getElementById('input_reparto').value = accountData.account.department || '';\r\n        document.getElementById('input_cuenta').disabled = true;\r\n        document.getElementById('input_region').disabled = true;\r\n        document.getElementById('input_sector').disabled = true;\r\n        document.getElementById('input_reparto').disabled = true;\r\n    })\r\n    .catch(error => {\r\n        console.error('Error:', error);\r\n        return null;\r\n    });\r\n}\r\ndocument.getElementById('consultaReciboForm').addEventListener('submit', function(event) {\r\n    event.preventDefault();\r\n\tconst token = localStorage.getItem('token');\r\n\tconst errorMessage = document.getElementById('error-message');\r\n\terrorMessage.style.display = 'none';\r\n    \r\n    if (!token) {\r\n        console.error('Token no encontrado');\r\n        return;\r\n    }\r\n\t\r\n    const accountId = document.getElementById('input_cuenta').value;\r\n    const region = document.getElementById('input_region').value;\r\n    const sector = document.getElementById('input_sector').value;\r\n    const department = document.getElementById('input_reparto').value;\r\n\r\n    const data = {\r\n        accountId: accountId,\r\n        region: region,\r\n        sector: sector,\r\n        department: department\r\n    };\r\n\r\n    fetch('https:\/\/webapi.japami.gob.mx\/siac\/find', {\r\n        method: 'POST',\r\n        headers: {\r\n            'accept': 'application\/json',\r\n\t\t\t'Authorization': `Bearer ${token}`, \/\/ A\u00f1adir el token en el header\r\n            'Content-Type': 'application\/json'\r\n        },\r\n        body: JSON.stringify(data)\r\n    })\r\n    .then(response => {\r\n        if (response.status === 401) {\r\n            console.log('Token incorrecto');\r\n        } else if (response.status === 404) {\r\n            errorMessage.textContent = 'No se encuentra la cuenta';\r\n\t\t\terrorMessage.style.display = 'block';\r\n        } else if (response.status === 503) {\r\n            console.log('Error de servidor');\r\n        } else if (response.status === 200) {\r\n            return response.json();\r\n        } else {\r\n            console.log('Error inesperado:', response.status);\r\n        }\r\n    })\r\n    .then(data => {\r\n        if (data) {\r\n            \/\/console.log('Data:', data.account);\r\n\t\t\tconst informacionC = sessionStorage.getItem('cuenta');\r\n\t\t\tif(informacionC){\r\n\t\t\t\t\/\/Eliminar dato guardado anterior mente\r\n\t\t\t\tsessionStorage.removeItem('cuenta');\r\n\t\t\t\t\/\/ Verificar que la sesi\u00f3n fue guardada correctamente antes de redirigir\r\n\t\t\t\tconst debug = sessionStorage.getItem('cuenta');\r\n\t\t\t\tif (debug) {\r\n\t\t\t\t\twindow.location.href = 'https:\/\/www.japami.gob.mx\/index.php\/informacion-consulta\/';\r\n\t\t\t\t} else {\r\n\t\t\t\t\tconsole.log(\"Error al guardar en sessionStorage\");\r\n\t\t\t\t\tsessionStorage.setItem('cuenta', JSON.stringify(data.account));\t\r\n\t\t\t\t\twindow.location.href = 'https:\/\/www.japami.gob.mx\/index.php\/informacion-consulta\/';\r\n\t\t\t\t}\r\n\t\t\t}else{\r\n\t\t\t\t\/\/console.log('Se guardo consulta');\r\n\t\t\t\tsessionStorage.setItem('cuenta', JSON.stringify(data.account));\r\n\t\t\t\tconst debug = sessionStorage.getItem('cuenta');\r\n\t\t\t\tif (debug) {\r\n\t\t\t\t\twindow.location.href = 'https:\/\/www.japami.gob.mx\/index.php\/informacion-consulta\/';\r\n\t\t\t\t} else {\r\n\t\t\t\t\tconsole.log(\"Error al guardar en sessionStorage\");\r\n\t\t\t\t\tsessionStorage.setItem('cuenta', JSON.stringify(data.account));\t\r\n\t\t\t\t\twindow.location.href = 'https:\/\/www.japami.gob.mx\/index.php\/informacion-consulta\/';\r\n\t\t\t\t}\r\n\t\t\t}\r\n        }else{\r\n\t\t\tconsole.log(\"No habia data\");\r\n\t\t}\r\n    })\r\n    .catch(error => {\r\n        console.log('Error en la solicitud:', error);\r\n    });\r\n});\r\n\r\n\r\n\t<\/script>\r\n    <\/div>\n\t\t\t\t\t\t<\/div>\n\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":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-1119","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.japami.gob.mx\/index.php\/wp-json\/wp\/v2\/pages\/1119","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.japami.gob.mx\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.japami.gob.mx\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.japami.gob.mx\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.japami.gob.mx\/index.php\/wp-json\/wp\/v2\/comments?post=1119"}],"version-history":[{"count":5,"href":"https:\/\/www.japami.gob.mx\/index.php\/wp-json\/wp\/v2\/pages\/1119\/revisions"}],"predecessor-version":[{"id":2004,"href":"https:\/\/www.japami.gob.mx\/index.php\/wp-json\/wp\/v2\/pages\/1119\/revisions\/2004"}],"wp:attachment":[{"href":"https:\/\/www.japami.gob.mx\/index.php\/wp-json\/wp\/v2\/media?parent=1119"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}