{"id":5528,"date":"2024-06-20T14:24:14","date_gmt":"2024-06-20T12:24:14","guid":{"rendered":"https:\/\/macketi.com\/shopengine-template\/checkout\/"},"modified":"2026-04-04T02:58:13","modified_gmt":"2026-04-04T00:58:13","slug":"checkout","status":"publish","type":"shopengine-template","link":"https:\/\/macketi.com\/en\/shopengine-template\/checkout\/","title":{"rendered":"CheckOut"},"content":{"rendered":"<div data-elementor-type=\"wp-post\" data-elementor-id=\"5528\" class=\"elementor elementor-5528\" data-elementor-post-type=\"shopengine-template\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5dea8e2 e-grid e-con-full e-con e-parent\" data-id=\"5dea8e2\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e23510c elementor-widget elementor-widget-shortcode\" data-id=\"e23510c\" 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\"><div class=\"macketi-v2-container\">\n\t<div id=\"macketi-success-overlay\" style=\"display:none;\">\n        <div class=\"macketi-success-content\">\n            <div class=\"success-icon\">\u2705<\/div>\n            <h2>\u00a1Tu pedido fue realizado correctamente!<\/h2>\n            <p>Gracias por confiar en nosotros. En breve ser\u00e1s redirigido.<\/p>\n            <div class=\"loader-bar\"><\/div>\n        <\/div>\n    <\/div>\n    <div class=\"macketi-v2-card\">\n\t\t<!-- formulario de envio-->\n\t\t <div class=\"macketi-v2-step\" id=\"step-data\" style=\"display:block;\">\n            <h2 class=\"macketi-v2-title\">Carga tus datos<\/h2>\n            <div class=\"macketi-v2-form\">\n                <div class=\"macketi-v2-field\">\n                    <label>Nombre <span class=\"red\">*<\/span><\/label>\n                    <input type=\"text\" id=\"m_first_name\" value=\"\">\n                <\/div>\n                <div class=\"macketi-v2-field\">\n                    <label>Apellidos <span class=\"red\">*<\/span><\/label>\n                    <input type=\"text\" id=\"m_last_name\" value=\"\">\n                <\/div>\n                <div class=\"macketi-v2-field\">\n                    <label>Telefono <span class=\"red\">*<\/span><\/label>\n                    <input type=\"tel\" id=\"m_phone\" value=\"\">\n                <\/div>\n                <div class=\"macketi-v2-field\">\n                    <label>Direccion <span class=\"red\">*<\/span><\/label>\n                    <input type=\"text\" id=\"m_address\" value=\"\">\n                <\/div>\n                <div class=\"macketi-v2-field\">\n                    <label>Hora de entrega <span class=\"red\">*<\/span><\/label>\n                    <input type=\"text\" id=\"m_note\" placeholder=\"Ej: 18:00\">\n                <\/div>\n<!--                 <label class=\"macketi-v2-checkbox\">\n                     <input type=\"checkbox\" id=\"m_create_account\"> Crear cuenta al finalizar\n                 <\/label> -->\n                 \t\t\t\t\t<label class=\"macketi-v2-checkbox\">\n\t\t\t\t\t\t<input type=\"checkbox\" id=\"m_create_account\"> Crear cuenta al finalizar\n\t\t\t\t\t<\/label>\n\t\t\t\t            <\/div>\n\t\t\t<p class=\"msj-error\" style=\"display:none;\"><\/p>\n            <button type=\"button\" class=\"macketi-v2-btn-primary\" id=\"btn-goto-confirm\">Confirmar datos<\/button>\n            <button type=\"button\" class=\"macketi-v2-btn-link\" id=\"btn-back-to-shipping-list\">Volver atras<\/button>\n        <\/div>\n\t\t<!-- selector de envios -->\n        <div class=\"macketi-v2-step\" id=\"step-shipping\" style=\"display:none;\">\n            <h2 class=\"macketi-v2-title\">Selecciona tu metodo de envio<\/h2>\n            <div class=\"macketi-v2-grid\">\n                            <\/div>\n            <input type=\"hidden\" id=\"selected-shipping-method\" value=\"\">\n\t\t\t<p class=\"msj-error\" style=\"display:none;\"><\/p>\n            <button type=\"button\" class=\"macketi-v2-btn-primary\" id=\"btn-goto-data\">Confirmar envio<\/button>\n            <button type=\"button\" class=\"macketi-v2-btn-link btn-back-to-shipping\">Volver atras<\/button>\n        <\/div>\n\t\t<!-- Confirmacion check -->\n        <div class=\"macketi-v2-step\" id=\"step-confirm\" style=\"display:none;\">\n            <h2 class=\"macketi-v2-title\">Confirma tu pedido<\/h2>\n            \n            <div class=\"macketi-v2-review-section\">\n                <p class=\"section-label\">Direccion de envio<\/p>\n                <div class=\"review-box\">\n                    <span id=\"rev-shipping-text\"><\/span>\n                    <button class=\"btn-edit btn-edit-shopping\">Editar envio<\/button>\n                <\/div>\n            <\/div>\n\n            <div class=\"macketi-v2-review-section\">\n                <p class=\"section-label\">Datos de comprador<\/p>\n                <div class=\"review-box data-review\">\n                    <div>\n                        <p>Nombre: <strong id=\"rev-name\"><\/strong><\/p>\n                        <p>Apellidos: <strong id=\"rev-last\"><\/strong><\/p>\n                        <p>Telefono: <strong id=\"rev-phone\"><\/strong><\/p>\n                        <p>Direccion: <strong id=\"rev-addr\"><\/strong><\/p>\n                        <p>Horario de entrega: <strong id=\"rev-note\"><\/strong><\/p>\n                    <\/div>\n                    <button class=\"btn-edit\" id=\"btn-edit-data\">Editar datos del comprador<\/button>\n                <\/div>\n            <\/div>\n\t\t\t<div class=\"macketi-v2-totals-section\">\n\t\t\t\t<div class=\"macketi-total-row\">\n\t\t\t\t\t<span>Subtotal<\/span>\n\t\t\t\t\t<span id=\"rev-subtotal\"><span class=\"woocommerce-Price-amount amount\"><bdi>0<span class=\"woocommerce-Price-currencySymbol\">CFA<\/span><\/bdi><\/span><\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"macketi-total-row\">\n\t\t\t\t\t<span>Env\u00edo<\/span>\n\t\t\t\t\t<span id=\"rev-shipping-cost\">$0.00 CFA<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<hr class=\"macketi-divider\">\n\t\t\t\t<div class=\"macketi-total-row total-bold\">\n\t\t\t\t\t<span>Total<\/span>\n\t\t\t\t\t<span id=\"rev-total-final\"><span class=\"woocommerce-Price-amount amount\"><bdi>0<span class=\"woocommerce-Price-currencySymbol\">CFA<\/span><\/bdi><\/span><\/span>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n            <button type=\"button\" class=\"macketi-v2-btn-primary\" id=\"confirm-order-final\">Confirmar<\/button>\n        <\/div>\n    <\/div>\n<\/div>\n<style>\n.macketi-v2-container {\n    padding: 40px 20px;\n    font-family: 'Poppins', sans-serif;\n}\n.macketi-v2-card {\n    background: #fff;\n    max-width: 1089px;\n    margin: 0 auto;\n    border-radius: 20px;\n    padding: 40px;\n    box-shadow: 0 10px 30px rgba(0,0,0,0.05);\n}\n.macketi-v2-title {\n    text-align: center;\n    font-size: 24px;\n    font-weight: 700;\n    margin-bottom: 30px;\n}\n\/* Grid Env\u00edo *\/\n.macketi-v2-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 15px;\n    margin-bottom: 30px;\n}\n.macketi-v2-option {\n    border: 1px solid #e0e0e0;\n    padding: 20px 15px;\n    border-radius: 12px;\n    cursor: pointer;\n    text-align: center;\n    font-size: 14px;\n    transition: all 0.3s;\n}\n.macketi-v2-option.active {\n    border-color: #28a745;\n    background: #e8f5e9;\n}\n\/* Formulario *\/\n.macketi-v2-field { \n\tmargin-bottom: 20px; \n}\n.macketi-v2-field label { \n\tdisplay: block; \n\tfont-weight: 600; \n\tmargin-bottom: 8px; \n\tfont-size: 14px; \n}\n.macketi-v2-field input { \n    width: 100%; border: 1px solid #ddd; \n\tborder-radius: 10px; \n\tpadding: 12px; \n\tfont-size: 15px; \n}\n.red { color: red; }\n\/* Botones *\/\n.macketi-v2-btn-primary {\n    width: 100%; \n\tbackground: #1a3ab7; \n\tcolor: #fff; \n\tborder: none; \n\tpadding: 16px; \n    border-radius: 12px; \n\tfont-weight: 600; \n\tcursor: pointer; \n\tmargin-top: 10px;\n}\n.macketi-v2-btn-link {\n    width: 100%; \n\tbackground: transparent; \n\tcolor: #1a3ab7; \n\tborder: 1px solid #1a3ab7; \n    padding: 12px; \n\tborder-radius: 12px; \n\tmargin-top: 15px; \n\tcursor: pointer;\n}\n\/* Review Paso 3 *\/\n.macketi-v2-review-section { \n\tmargin-bottom: 25px; \n}\n.section-label { \n\tfont-weight: 600; \n\tmargin-bottom: 10px; \n}\n.review-box { \n    border: 1px solid #ddd; \n\tborder-radius: 12px; \n\tpadding: 15px; \n    display: flex; \n\tjustify-content: space-between; \n\talign-items: center;\n}\n\/\/ .review-box.data-review { \n\/\/ \talign-items: flex-start; \n\/\/ }\n.btn-edit { \n    background: #f0f0f0; \n\tborder: 1px solid #ccc; \n\tpadding: 8px 15px; \n    border-radius: 8px;\n\tcursor: pointer; \n\tfont-size: 13px;\n}\n.msj-error{\n\tbackground-color: #e9848438;\n\tpadding: 6px;\n\ttext-align: center;\n\tborder: 1px solid #d0011b;\n\tfont-weight: bold;\n}\n.macketi-v2-totals-section {\n    margin-top: 20px;\n    padding: 15px 5px;\n    border-top: 1px solid #f0f0f0;\n}\n.macketi-total-row {\n    display: flex;\n    justify-content: space-between;\n    margin-bottom: 10px;\n    font-size: 16px;\n    color: #333;\n}\n.macketi-divider {\n    border: 0;\n    border-top: 1px solid #eee;\n    margin: 15px 0;\n}\n.total-bold {\n    font-weight: 700;\n    font-size: 20px;\n}\n.total-bold span:last-child {\n    font-size: 22px;\n}\n.macketi-product-row span:first-child {\n    color: #666;\n    max-width: 70%;\n}\n.macketi-product-row span:last-child {\n    font-weight: 600;\n    color: #333;\n}\n.review-box-products {\n    background-color: #fafafa;\n}\n\t#macketi-success-overlay {\n    position: fixed;\n    top: 0; left: 0; width: 100%; height: 100%;\n    background: rgba(255, 255, 255, 0.95);\n    z-index: 9999;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n}\n.macketi-success-content {\n    max-width: 500px;\n    padding: 40px;\n    background: white;\n    border-radius: 20px;\n    box-shadow: 0 20px 50px rgba(0,0,0,0.1);\n}\n.success-icon { font-size: 60px; margin-bottom: 20px; }\n.loader-bar {\n    height: 4px;\n    width: 100%;\n    background: #f0f0f0;\n    margin-top: 20px;\n    position: relative;\n    overflow: hidden;\n}\n.loader-bar::after {\n    content: '';\n    position: absolute;\n    left: 0; top: 0; height: 100%; width: 100%;\n    background: #28a745;\n    animation: progress 15s linear forwards; \/* 15 segundos de carga visual *\/\n}\n@keyframes progress {\n    from { width: 0; }\n    to { width: 100%; }\n}\n@media (max-width: 600px) {\n\t.macketi-v2-grid{\n\t\tgrid-template-columns: 1fr ;\n\t}\n\t.macketi-v2-container{\n\t\tpadding: 0px;\n\t}\n\t.macketi-v2-card{\n\t\tmargin: 0 auto 60px;\n\t}\n\t.review-box{\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\t.btn-edit{\n\t\twidth: 100%;\n\t}\n}\n<\/style>\n<script>\njQuery(document).ready(function($){\n\tvar isUserLogged = false;\n\tvar $msjError = $('.msj-error');\n\t$('#btn-goto-confirm').click(function(){\n        const fn = $('#m_first_name').val();\n        const ln = $('#m_last_name').val();\n        if(!fn || !ln || !$('#m_phone').val() || !$('#m_address').val()){\n            $msjError.text('Todos los campos son obligatorios').addClass('msj-error');\n\t\t\t$msjError.show();\n\t\t\treturn;\n        }\n        \/\/ Llenar revisi\u00f3n\n        $('#rev-name').text(fn);\n        $('#rev-last').text(ln);\n        $('#rev-phone').text($('#m_phone').val());\n        $('#rev-addr').text($('#m_address').val());\n        $('#rev-note').text($('#m_note').val());\n\t\t$msjError.hide();\n        $('#step-data').hide(); \n\t\t$('#step-shipping').show();\n    });\n    \/\/ Selecci\u00f3n de Env\u00edo\n    $('.macketi-v2-option').click(function(){\n        $('.macketi-v2-option').removeClass('active');\n        $(this).addClass('active');\n        $('#selected-shipping-method').val($(this).data('id'));\n        $('#rev-shipping-text').text($(this).text());\n    });\n    \/\/ Navegaci\u00f3n\n    $('#btn-goto-data').click(function(){\n        if(!$('#selected-shipping-method').val()) {\n\/\/ \t\t\talert('Selecciona un m\u00e9todo');\n\t\t\t$msjError.text('Debes de seleccionar un metodo antes de seguir').addClass('msj-error');\n\t\t\t$msjError.show();\n\t\t\treturn; \n\t\t}\n\t\t$msjError.hide();\n        $('#step-shipping').hide(); \n\t\t$('#step-confirm').show();\n    });\n\t\/\/ ---- botones de volver -----\n\t$('#btn-back-to-shipping-list').click(function(){\n\t\twindow.history.back();\n\t});\n\t\/\/ boton editar vendedor\n\t$('#btn-edit-data').click(function(){\n        $('#step-confirm').hide(); \n\t\t$('#step-data').show();\n    });\n\t\/\/ editar boton enviar \n\t$('.btn-edit-shopping').click(function(){\n        $('#step-data, #step-confirm').hide(); \n\t\t$('#step-shipping').show();\n    });\n\t\/\/volver atras desde el btn editar\n    $('.btn-back-to-shipping').click(function(){\n        $('#step-shipping, #step-confirm').hide(); \n\t\t$('#step-data').show();\n    });\n\t\/\/ Variables para c\u00e1lculos\n\tvar cartSubtotal = 0;\n\t$('.macketi-v2-option').click(function(){\n\t\t$('.macketi-v2-option').removeClass('active');\n\t\t$(this).addClass('active');\n\t\tconst methodId = $(this).data('id');\n\t\tconst label = $(this).data('label');\n\t\tconst cost = parseFloat($(this).data('cost'));\n\t\t$('#selected-shipping-method').val(methodId);\n\t\t$('#rev-shipping-text').text(label);\n\t\tconst formatCFA = (val) => {\n\t\t\treturn val.toLocaleString('de-DE') + ' CFA'; \n\t\t};\n\t\t$('#rev-shipping-cost').text(formatCFA(cost));\n\n\t\tconst finalTotal = cartSubtotal + cost;\n\t\t$('#rev-total-final').text(formatCFA(finalTotal));\n\t});\n    \/\/ Finalizar\n    $('#confirm-order-final').click(function(){\n        $(this).text('Procesando...').prop('disabled', true);\n        $.ajax({\n            url: 'https:\/\/macketi.com\/wp-admin\/admin-ajax.php',\n            method: 'POST',\n            data: {\n                action: 'macketi_submit_checkout',\n                first_name: $('#m_first_name').val(),\n                last_name: $('#m_last_name').val(),\n                phone: $('#m_phone').val(),\n                address: $('#m_address').val(),\n                order_note: $('#m_note').val(),\n                shipping_method: $('#selected-shipping-method').val(),\n                create_account: $('#m_create_account').is(':checked') ? 1 : 0\n            },\n\t\t\tsuccess: function(res) {\n                const respuesta = res.trim();\n                \/\/ Si el usuario NO est\u00e1 logueado, mostramos el mensaje de 15 segundos\n                if (!isUserLogged) {\n                    $('#macketi-success-overlay').fadeIn();\n                    setTimeout(function(){\n                        if (respuesta === 'nuevo_usuario') {\n                            location.href = \"https:\/\/macketi.com\/crear-cuenta\/\";\n                        } else {\n                            location.href = \"https:\/\/macketi.com\/my-orders\/\";\n                        }\n                    }, 15000);\n                } else {\n                    \/\/ Si ya est\u00e1 logueado, redirecci\u00f3n inmediata (o puedes bajarlo a 2s)\n                    location.href = \"https:\/\/macketi.com\/my-orders\/\";\n                }\n            }\n\/\/ \t\t\tsuccess: function(res) {\n\/\/ \t\t\t\t\/\/ Limpiamos espacios en blanco accidentales\n\/\/ \t\t\t\tconst respuesta = res.trim();\n\/\/ \/\/ \t\t\t\tconsole.log(\"Respuesta del servidor:\", respuesta);\n\/\/ \t\t\t\tif (respuesta === 'nuevo_usuario') {\n\/\/ \t\t\t\t\t\/\/ Redirigir al formulario especial para nuevos registros\n\/\/ \t\t\t\t\tlocation.href = \"https:\/\/macketi.com\/crear-cuenta\/\"; \n\/\/ \t\t\t\t} \n\/\/ \t\t\t\telse if (respuesta.includes('usuario_existente') || respuesta === 'ok') {\n\/\/ \t\t\t\t\t\/\/ Redirigir a la lista de pedidos si ya era usuario\n\/\/ \t\t\t\t\tlocation.href = \"https:\/\/macketi.com\/my-orders\/\";\n\/\/ \t\t\t\t} \n\/\/ \t\t\t}\n        });\n    });\n});\n<\/script>\n\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"template":"elementor_header_footer","class_list":["post-5528","shopengine-template","type-shopengine-template","status-publish","hentry","thunk-woo-product-list","th-shop-mania-woo-hover-","open-single-product-tab-horizontal","open-shadow-","open-shadow-hover-","th-shop-mania-single-product-content-left"],"_links":{"self":[{"href":"https:\/\/macketi.com\/en\/wp-json\/wp\/v2\/shopengine-template\/5528","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/macketi.com\/en\/wp-json\/wp\/v2\/shopengine-template"}],"about":[{"href":"https:\/\/macketi.com\/en\/wp-json\/wp\/v2\/types\/shopengine-template"}],"version-history":[{"count":34,"href":"https:\/\/macketi.com\/en\/wp-json\/wp\/v2\/shopengine-template\/5528\/revisions"}],"predecessor-version":[{"id":16504,"href":"https:\/\/macketi.com\/en\/wp-json\/wp\/v2\/shopengine-template\/5528\/revisions\/16504"}],"wp:attachment":[{"href":"https:\/\/macketi.com\/en\/wp-json\/wp\/v2\/media?parent=5528"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}