{extends file="$layouts_admin"}
{block name="head"}




{/block}

{block name="content"}

<style type="text/css">

    .list-group{
        max-height: 150px;
        margin-bottom: 10px;
        overflow:scroll;
        -webkit-overflow-scrolling: touch;
    }    

</style>
<div class="row">

    <div class="col-md-12">

         <input type="text" readonly hidden  class="form-control tener_url_base" value="{$url_base}">
         
 
        <div class="panel">
            <div class="panel-hdr">
                <h2><span></span>Webhooks Whatsapp/SMS</h2>

            </div>

            <div class="panel-container show" id="ibox_form">

                <div class="panel-content">

                    <div class="px-2">
                        <div class="alert alert-danger" id="emsg" style="display: none;">
                            <span id="emsgbody"></span>
                        </div>

                        <div class="alert alert-success" id="emsgSuccess" style="display: none;">
                            <span id="emsgbodySuccess"></span>
                        </div>

                        <form id="rform">

                            <div class="row">

                                <div class="col-md-12 col-sm-12 p-4">
                                    <span class="h3">WebHooks Whatsapp</span>
                                    <hr>

                                    <div class="mb-3 row">
                                        <label for="ws" class="col-sm-3"><span class="h6">Whatsapp</span><span class="text-danger">*</span></label>
                                        <div class="col-sm-9">
                                           {* <input type="text" readonly id="ws" value="{$ws_url}" name="ws" class="form-control tener_ws"  > *}
                                            <textarea class="form-control" readonly>{$ws_url}</textarea>
                                        </div>
                                    </div>

                                    <div class="mb-3 row">
                                        <label for="verificacion_ws" class="col-sm-3"><span class="h6">Verification token</span><span class="text-danger">*</span></label>
                                        <div class="col-sm-9">
                                            <input type="text" value="{$ws_verificacion}" readonly id="verificacion_ws" name="verificacion_ws" class="form-control tener_verificacion_ws"  >
                                            
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-12 col-sm-12 p-4">
                                    <span class="h3">WebHooks SMS</span>
                                    <hr>

                                    <div class="mb-3 row">
                                        <label for="ws" class="col-sm-3"><span class="h6">SMS</span><span class="text-danger">*</span></label>
                                        <div class="col-sm-9">
                                           {* <input type="text" readonly id="ws" name="ws" value="{$tw_url}" class="form-control tener_ws"  > *}

                                            <textarea class="form-control" readonly>{$tw_url}</textarea>

                                        </div>
                                    </div>
                                </div>

                           
 
                        </form>

                       
                    </div>

                  

                </div>
 
                <div class="block bloqueo_v1" style="display:none" hidden></div>
                <div class="block blockOverlay bloqueo_v2" hidden style="z-index: 1000; border: none; margin: 0px; padding: 0px; width: 100%; height: 100%; top: 0px; left: 0px; background-color: rgb(0, 0, 0); opacity: 0.6; cursor: wait; position: absolute;" ></div>
                <div
                    class="block blockMsg blockElement bloqueo_v3"
                    hidden
                    style="
                        z-index: 1011;
                        position: absolute;
                        padding: 0px;
                        margin: 0px;
                        width: 100%;
                        top: 370px;
                         
                        text-align: center;
                        color: rgb(0, 0, 0);
                        cursor: wait;
                    "
                    >
                     
                    <div class="md-preloader text-center">
                        <svg
                            xmlns="http://www.w3.org/2000/svg"
                            version="1.1"
                            height="32"
                            width="32"
                            viewBox="0 0 75 75"
                        >
                            <circle cx="37.5" cy="37.5" r="33.5" stroke-width="6"></circle>
                        </svg>
                    </div>

                     <div class="text-center mt-6" style="
                                                                color: white;
                                                                font-weight: 600;
                                                                font-size: 15px;
                                                            ">
                                    No actualice ni cierre la ventana. Espere el mensaje de confirmación. No actualice ni cierre la ventana.                    
                        </div>
                </div>

               
            </div>
        </div>
    </div>
</div>




{/block}

{block name="script"}
<script>

     var url_base   = $(".tener_url_base").val();

 
    var baseImagen = "";

    $(document).ready(function () {


        $("#submit").click(function (e) {
            e.preventDefault();

            let tener_identificador     = $(".tener_identificador").val();
            let tener_phone_ws          = $(".tener_phone_ws").val();
            let tener_whatsapp_business_account_identifier = $(".tener_whatsapp_business_account_identifier").val();
            let tener_version_ws       = $(".tener_version_ws").val();
            let tener_token_ws         = $(".tener_token_ws").val();
            let tener_phone_identifier = $(".tener_phone_identifier").val();
            let tener_app_Identifier   = $(".tener_app_Identifier").val();

            let tener_sms_account_sid   = $(".tener_sms_account_sid").val();
            let tener_sms_phone_number   = $(".tener_sms_phone_number").val();
            let tener_sms_auth_token   = $(".tener_sms_auth_token").val();
            let tener_version_sms   = $(".tener_version_sms").val();

            if(isEmpty(tener_identificador) == true)
            {
                toastr.error("!The identifier is required¡");
                return;
            }     

            if(isEmpty(tener_phone_ws) == true)
            {
                toastr.error("!WhatsApp phone is required¡");
                return;
            }      

            if(isEmpty(tener_whatsapp_business_account_identifier) == true)
            {
                toastr.error("!The WhatsApp Business Account is required¡");
                return;
            }   

            if(isEmpty(tener_version_ws) == true)
            {
                toastr.error("!The WhatsApp version is required¡");
                return;
            }   

            if(isEmpty(tener_token_ws) == true)
            {
                toastr.error("!WhatsApp token is required¡");
                return;
            } 

            if(isEmpty(tener_phone_identifier) == true)
            {
                toastr.error("!WhatsApp phone identifier is required¡");
                return;
            } 

            if(isEmpty(tener_app_Identifier) == true)
            {
                toastr.error("!The WhatsApp app identifier is required¡");
                return;
            } 

            if(isEmpty(tener_sms_account_sid) == true)
            {
                toastr.error("!The sms account sid is required¡");
                return;
            } 

            if(isEmpty(tener_sms_phone_number) == true)
            {
                toastr.error("!SMS phone number is required¡");
                return;
            } 

            if(isEmpty(tener_sms_auth_token) == true)
            {
                toastr.error("!SMS Auth token is required¡");
                return;
            } 

            if(isEmpty(tener_version_sms) == true)
            {
                toastr.error("!The SMS version is required¡");
                return;
            } 
 

  
            
            //$('#ibox_form').block({ message:block_msg });

            $(".bloqueo_v1").removeAttr("hidden");
            $(".bloqueo_v2").removeAttr("hidden");
            $(".bloqueo_v3").removeAttr("hidden");
            
            //console.log(base_url + 'parnerts/add-parnert-post/');
            //console.log($( "#rform" ).serialize());

 
                
            var informacionEnviar = {
                identificador:             tener_identificador,
                phone_ws:                  tener_phone_ws,
                whatsapp_business_account_identifier:          tener_whatsapp_business_account_identifier,
                tener_version_ws:          tener_version_ws,
                token_ws:                  tener_token_ws,
                phone_identifier:          tener_phone_identifier,
                app_Identifier:            tener_app_Identifier,
                //
                sms_account_sid:            tener_sms_account_sid,
                sms_phone_number:           tener_sms_phone_number,
                sms_auth_token:             tener_sms_auth_token,
                version_sms:                tener_version_sms,
                status:                $(".tener_status").val(),
            }; 
    
    
            //console.log(JSON.stringify(informacionEnviar));
            //return;

            //return;

            $.post(url_base + 'social/post-add-config-whatsapp-sms/', JSON.stringify(informacionEnviar)  ) //$( "#rform" ).serialize()
            .done(function (data) {
                 
                    //console.log(data);
                    //console.log(data);
                    //return;


                    $(".bloqueo_v1").attr("hidden", true);
                    $(".bloqueo_v2").attr("hidden", true);
                    $(".bloqueo_v3").attr("hidden", true);

                     try {
                         const info = JSON.parse(data);
                       
                        if( info.type == "success")
                        {
                            //$('#ibox_form').unblock();
                            toastr.success(info.message);
 
                           setTimeout(function() {
                                window.location = info.redirect;
                            }, 1000);
                        }else{
                            //$('#ibox_form').unblock();
                            var body = $("html, body");
                            body.animate({ scrollTop:0 }, '1000', 'swing');
                            $("#emsgbody").html(info.message);
                            $("#emsg").show("slow");
                        }
                    } catch (error) {
                        //$('#ibox_form').unblock();
                        var body = $("html, body");
                        body.animate({ scrollTop:0 }, '1000', 'swing');
                        $("#emsgbody").html(data);
                        $("#emsg").show("slow");
                    }
            });
        });


    });

 
    function isEmpty(value) {
        // Verificar si es null o undefined
        if (value == null) return true;

        // Verificar si es una cadena vacía
        if (typeof value === "string" && value.trim() === "") return true;

        // Verificar si es un array vacío
        if (Array.isArray(value) && value.length === 0) return true;

        // Verificar si es un objeto vacío
        if (typeof value === "object" && Object.keys(value).length === 0) return true;

        return false;
    }

 
    function validarSoloNumeros(input) {
        const number = parseInt(input, 10);
        return !isNaN(number) && number.toString() === input;
    }

 
 
</script>
{/block}