<?php $__env->startSection('content'); ?>

    <!-- BEGIN PAGE CONTENT BODY -->
    <div class="page-content">
        <div class="container-fluid">

            <!-- BEGIN PAGE BREADCRUMBS -->
            <ul class="page-breadcrumb breadcrumb">
                <li>
                    <a href="<?php echo e(route('dashboard')); ?>">Dashboard</a>
                    <i class="fa fa-circle"></i>
                </li>
                <li>
                    <span>Números Virtuais</span>
                </li>
            </ul>
            <!-- END PAGE BREADCRUMBS -->

            <!-- BEGIN PAGE CONTENT INNER -->
            <div class="page-content-inner">
                <div class="row">
                    <div class="col-md-12">
                        <div class="portlet">
                            <div class="portlet-body">

                                <?php if(session('messageError')): ?>
                                    <div class="alert alert-success alert-dismissable">
                                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                                        <?php echo e(session('messageError')); ?>

                                    </div>
                                <?php endif; ?>

                                <div class="mt-element-step">
                                    <div class="row step-thin">
                                        <div class="mt-step-desc">
                                            <div id="number" style="cursor: pointer;" class="col-md-6 mt-step-col bg-blue-madison bg-font-blue-madison">
                                                <div id="number-title" class="mt-step-title uppercase font-white">
                                                    Números Virtuais
                                                </div>
                                                <div id="number-description" class="mt-step-content font-white">
                                                    Escolha os números disponíveis
                                                </div>
                                            </div>

                                            <div id="portability" style="cursor: pointer;" class="col-md-6 mt-step-col bg-grey">
                                                <div id="portability-title" class="mt-step-title uppercase font-grey-cascade">
                                                    Portabilidade
                                                </div>
                                                <div id="portability-description" class="mt-step-content font-grey-cascade">
                                                    Escolha os DDD's disponíveis
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <?php echo Form::open(['route' => 'number.storage', 'method' => 'post', 'files' => true]); ?>


                    <?php if(!isset($item_plan->plan_id)): ?>
                        <input type="hidden" name="plan_id" value="<?php echo e($item_plan->plan_id); ?>">
                    <?php else: ?>
                            <input type="hidden" name="plan_id" value="">
                    <?php endif; ?>
                    <div class="row" id="tab-number">
                        <div class="col-md-12">
                            <div class="portlet light">

                                <div class="portlet-title">
                                    <div class="caption caption-md">
                                        <span class="caption-subject bold">Números Virtuais</span>
                                        <span class="caption-helper hide"></span>
                                    </div>
                                </div>

                                <div class="alert alert-success alert-dismissable" id="warning-plan" style="display:none;">
                                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                                    Não é possível adicionar mais números no plano atual, caso deseje migrar de plano <a href="<?php echo e(route('voice.plan')); ?>" style="text-decoration:none; color:#fff;">Clique aqui</a>.
                                </div>

                                <div class="portlet-body hide-maximum">
                                    <div class="note note-info">Contrate serviços adicionais para a sua linha voip. É fácil e seguro.
                                    <br><br>

                                        <?php if(count($customer) <= 0): ?>
                                            <div class="alert alert-warning">
                                                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                                                <strong>Aviso:</strong><br>
                                                Você precisa completar o seu <a href="<?php echo e(route('profile')); ?>">cadastro</a>, para comprar números virtuais.
                                            </div>
                                        <?php else: ?>
                                            <p style="display:none;">Valor Total de Ativação: <strong id="amount-number">R$ 15,00</strong></p>
                                            <p style="display:none;">Valor Total de Mensalidade: <strong id="amount-monthly">R$ 20,00</strong></p>
                                        <?php endif; ?>

                                        <?php if(!empty($free_plan)): ?>
                                            <div class="alert alert-warning">
                                                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                                                <strong>Aviso:</strong><br>
                                                Você precisa ativar o seu <a href="<?php echo e(route('voice.plan')); ?>">Plano</a>, para comprar números virtuais.
                                            </div>
                                        <?php endif; ?>

                                    </div>

                                    <?php if((isset($customer->id)) && (!$free_plan) && Auth::user()->active == 'yes'): ?>
                                        <?php for($i = 0; $i+$totalNumbers < $item_plan->number_maximum; $i++): ?>
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <select name="virtualDDD[]" id="virtualDDD_<?php echo e($i); ?>" class="form-control" onchange="selNumber(this.value, <?php echo e($i); ?>); return false;">
                                                            <option value="0">Escolha um DDD</option>
                                                            <?php foreach($dids as $did): ?>
                                                                <option value="<?php echo e($did->ddd); ?>" <?php echo e(old('virtualDDD')[$i] == $did->ddd ? 'selected' : ''); ?>><?php echo e($did->ddd); ?></option>
                                                            <?php endforeach; ?>
                                                        </select>
                                                    </div>
                                                </div>

                                                <div class="col-md-6">
                                                    <div class="form-group" id="editNumber-<?php echo e($i); ?>">
                                                        <select name="" id="virtual_number_<?php echo e($i); ?>" class="form-control">
                                                            <option value="">Escolha seu Número Virtual</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                        <?php endfor; ?>
                                    <?php endif; ?>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row" id="tab-portability" style="display:none;">
                        <div class="col-md-12">
                            <div class="portlet light">
                                <div class="portlet-title">
                                    <div class="caption caption-md">
                                        <span class="caption-subject bold">Portabilidade</span>
                                        <span class="caption-helper hide"></span>
                                    </div>
                                </div>

                                <div class="alert alert-success alert-dismissable" id="warning-plan-portability" style="display:none;">
                                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                                    Não é possível adicionar mais números no plano atual, caso deseje migrar de plano <a href="<?php echo e(route('voice.plan')); ?>" style="text-decoration:none; color:#fff;">Clique aqui</a>.
                                </div>

                                <div class="portlet-body hide-maximum">
                                    <div class="note note-info">Preencha corretamente os campos abaixo, para não ocorrer erros no processo de portabilidade.
                                    <br><br>

                                        <?php if(count($customer) <= 0): ?>
                                            <div class="alert alert-warning">
                                                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                                                <strong>Aviso:</strong><br>
                                                Você precisa completar o seu <a href="<?php echo e(route('profile')); ?>">cadastro</a>, para solicitar portabilidade.
                                            </div>
                                        <?php endif; ?>

                                        <?php if(!empty($free_plan)): ?>
                                            <div class="alert alert-warning">
                                                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                                                <strong>Aviso:</strong><br>
                                                Você precisa ativar o seu <a href="<?php echo e(route('voice.plan')); ?>">Plano</a>, para realizar portabilidade.
                                            </div>
                                        <?php endif; ?>
                                    </div>

                                    <?php if(session('messagePortability')): ?>
                                        <div class="alert alert-success alert-dismissable">
                                            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                                            <?php echo e(session('messagePortability')); ?>

                                        </div>
                                    <?php endif; ?>

                                    <?php if((isset($customer->id)) && (!$free_plan) && Auth::user()->active == 'yes'): ?>)
                                        <div class="portability">
                                        <?php for($i = 0; $i+$totalNumbers < $item_plan->number_maximum; $i++): ?>
                                            <div class="note note-info">
                                                <h3>Portabilidade <?php echo e($i+1); ?></h3>
                                            </div>
                                            <div class="row">

                                                <div class="form-group col-md-2">
                                                    <select name="ddd[]" id="ddd_<?php echo e($i); ?>" value="<?php echo e(old('ddd')[$i]); ?>" class="form-control">
                                                        <option value="0">DDD</option>
                                                        <?php foreach($ddds as $key => $ddd): ?>
                                                            <option value="<?php echo e($ddd); ?>" <?php echo e(old('ddd')[$i] == $ddd ? 'selected' : ''); ?>><?php echo e($ddd); ?></option>
                                                        <?php endforeach; ?>
                                                    </select>
                                                </div>

                                                <div class="form-group col-md-2">
                                                    <input type="text" name="number_portability[]" id="number_portability_<?php echo e($i); ?>" value="<?php echo e(old('number_portability')[$i]); ?>" class="form-control" placeholder="Número" >
                                                </div>

                                                <div class="form-group col-md-2">
                                                    <input type="text" name="origin_operator[]" id="origin_operator_<?php echo e($i); ?>" value="<?php echo e(old('origin_operator')[$i]); ?>" class="form-control" placeholder="Operadora Origem">
                                                </div>

                                                <div class="form-group col-md-2">
                                                    <input type="text" name="company_name[]" id="company_name_<?php echo e($i); ?>" value="<?php echo e(old('company_name')[$i]); ?>" class="form-control" placeholder="Razão Social/No  me">
                                                </div>

                                                <div class="form-group col-md-2">
                                                    <input type="text" name="cpf_cnpj[]" id="cpf_cnpj_<?php echo e($i); ?>" value="<?php echo e(old('cpf_cnpj')[$i]); ?>" class="form-control cpf_cnpj" placeholder="CPF/CNPJ"  >
                                                </div>

                                                <div class="form-group col-md-2">
                                                    <input type="text" name="zip_code[]" id="zip_code_<?php echo e($i); ?>" value="<?php echo e(old('zip_code')[$i]); ?>" class="form-control" placeholder="CEP" onblur="zip_code(<?php echo e($i); ?>); return false;">
                                                </div>

                                                <div class="form-group col-md-2">
                                                    <input type="text" name="address[]" id="address_<?php echo e($i); ?>" value="<?php echo e(old('address')[$i]); ?>" class="form-control" placeholder="Endereço">
                                                </div>

                                                <div class="form-group col-md-2">
                                                    <input type="text" name="number[]" id="number_<?php echo e($i); ?>" value="<?php echo e(old('number')[$i]); ?>" class="form-control" placeholder="Número Residência">
                                                </div>

                                                <div class="form-group col-md-2">
                                                    <input type="text" name="complement[]" id="complement_<?php echo e($i); ?>" value="<?php echo e(old('complement')[$i]); ?>" class="form-control" placeholder="Complemento">
                                                </div>

                                                <div class="form-group col-md-2">
                                                    <input type="text" name="neighborhood[]" id="neighborhood_<?php echo e($i); ?>" value="<?php echo e(old('neighborhood')[$i]); ?>" class="form-control" placeholder="Bairro">
                                                </div>

                                                <div class="form-group col-md-2">
                                                    <input type="text" name="city[]" id="city_<?php echo e($i); ?>" value="<?php echo e(old('city')[$i]); ?>" class="form-control" placeholder="Cidade">
                                                </div>

                                                <div class="form-group col-md-2">
                                                    <select name="state[]" id="state_<?php echo e($i); ?>"  class="form-control">
                                                        <option value="0">Estado</option>
                                                        <?php foreach($states as $key => $state): ?>
                                                            <option value="<?php echo e($key); ?>" <?php echo e(old('state')[$i] == $key ? 'selected' : ''); ?>><?php echo e($state); ?></option>
                                                        <?php endforeach; ?>
                                                    </select>
                                                </div>
                                            </div>
                                        <?php endfor; ?>
                                        </div>
                                    <?php endif; ?>
                                </div>
                            </div>
                        </div>
                    </div>

                    <?php if((isset($customer->id)) && (!$free_plan) && Auth::user()->active == 'yes'): ?>
                        <div class="col-md-12">
                            <div class="portlet light">
                                <div class="form-actions right">
                                    <button id="submit-button" class="btn blue-madison">Prosseguir</button>
                                </div><br>

                                <div class="portlet-title">
                                    <div class="caption caption-md">
                                        <span class="caption-subject bold">Números adquiridos</span>
                                        <span class="caption-helper hide"></span>
                                    </div>
                                </div>

                                <div class="portlet">
                                    <div class="">
                                        <div class="table-scrollable table-scrollable-borderless">
                                            <?php if(count($numbers) <= 0 and count($portabilities) <= 0): ?>
                                                <div class="note note-danger">Você não tem números contratados</div>
                                            <?php else: ?>
                                                <table class="table table-striped table-hover table-light" id="table-number">
                                                    <thead>
                                                        <tr class="uppercase">
                                                            <th class="col-md-6 bg-default">DDD</th>
                                                            <th class="col-md-6 bg-default">Número</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <?php foreach($numbers as $number): ?>
                                                            <tr>
                                                                <td><?php echo e($number->ddd); ?></td>
                                                                <td><?php echo e($number->number); ?></td>
                                                            </tr>
                                                        <?php endforeach; ?>
                                                        <?php foreach($portabilities as $portabilitie): ?>
                                                            <tr>
                                                                <td><?php echo e($portabilitie->ddd); ?></td>
                                                                <td><?php echo e($portabilitie->number_portability); ?></td>
                                                            </tr>
                                                        <?php endforeach; ?>
                                                    </tbody>
                                                </table>
                                            <?php endif; ?>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    <?php endif; ?>

                <?php echo Form::close(); ?>

            </div>
            <!-- END PAGE CONTENT INNER -->
        </div>
    </div>
    <!-- END PAGE CONTENT BODY -->
<?php $__env->stopSection(); ?>

<?php $__env->startSection('js-virtualnumber'); ?>

    <script src="<?php echo e(asset('/assets/global/scripts/valida-cpf-cnpj.js')); ?>" type="text/javascript"></script>
    <script src="<?php echo e(asset('/assets/global/scripts/valida-celular.js')); ?>" type="text/javascript"></script>
<script type="text/javascript">
    <?php if(count($customer) > 0): ?>
        $(document).ready(function() {
            <?php if(session('trataError')): ?>

                var trataError = '<?php echo e(session('trataError')); ?>';
                trataError = JSON.parse(trataError.replace(/&quot;/g,'"'));
                var old = '<?php echo e(json_encode(old())); ?>';
                old = JSON.parse(old.replace(/&quot;/g,'"'));
                console.log(old);
                console.log(trataError);
                for(tipoForm in trataError){
                    // console.log(tipoForm);
                    for(form in trataError[tipoForm]){
                        // console.log(form);
                        for(campo in trataError[tipoForm][form]){
                            var tooltip = trataError[tipoForm][form][campo];
                            // console.log(campo,tooltip);
                            if(tipoForm == "number"){
                                selNumber(old.virtualDDD[form], form,true);

                            }else{
                                $("#"+campo+"_"+form).css("border-color","#f2784b").attr("title",tooltip);

                            }

                        }
                    }
                }
            <?php endif; ?>
            var countNumbers = '<?php echo e(count($numbers)); ?>';
            var countPortabilities = '<?php echo e(count($portabilities)); ?>';


            var countNumbersCurrency = parseInt(countNumbers) + parseInt(countPortabilities);

            var value = '<?php echo e($item_plan->number_maximum); ?>';

            var max_fields = value - countNumbersCurrency;

            if (max_fields <= 0) {
                $("button").css('display', 'none');
                $("input").css('display', 'none');
                $(".hide-maximum").css('display', 'none');

                $("#warning-plan").css('display', 'block');
                $("#warning-plan-portability").css('display', 'block');
            }

            $("#portability").click(function() {
                // Mostra ou esconde tab
                $("#tab-number").css('display', 'none');
                $("#tab-portability").css('display', 'block');

                // Removendo classe atual da aba
                $("#number").removeClass('col-md-4 mt-step-col bg-blue-madison bg-font-blue-madison');
                $("#number-number").removeClass('mt-step-number bg-white font-blue-madison');
                $("#number-title").removeClass('mt-step-title uppercase font-white');
                $("#number-description").removeClass('mt-step-content font-white');

                $("#portability").removeClass('col-md-6 mt-step-col bg-grey');
                $("#portability-number").removeClass('mt-step-number bg-white font-grey-cascade');
                $("#portability-title").removeClass('mt-step-title uppercase font-grey-cascade');
                $("#portability-description").removeClass('mt-step-content font-grey-cascade');

                // Adicionando classe atual da aba
                $("#number").addClass('col-md-4 mt-step-col bg-grey');
                $("#number-number").addClass('mt-step-number bg-white font-grey-cascade');
                $("#number-title").addClass('mt-step-title uppercase font-grey-cascade');
                $("#number-description").addClass('mt-step-content font-grey-cascade');

                $("#portability").addClass('col-md-6 mt-step-col bg-blue-madison bg-font-blue-madison');
                $("#portability-number").addClass('mt-step-number bg-white font-blue-madison');
                $("#portability-title").addClass('mt-step-title uppercase font-white');
                $("#portability-description").addClass('mt-step-content font-white');
            });

            $("#number").click(function() {
                // Mostra ou esconde tab
                $("#tab-number").css('display', 'block');
                $("#tab-portability").css('display', 'none');

                // Removendo classe atual da aba
                $("#portability").removeClass('col-md-4 mt-step-col bg-blue-madison bg-font-blue-madison');
                $("#portability-number").removeClass('mt-step-number bg-white font-blue-madison');
                $("#portability-title").removeClass('mt-step-title uppercase font-white');
                $("#portability-description").removeClass('mt-step-content font-white');

                $("#number").removeClass('col-md-6 mt-step-col bg-grey');
                $("#number-number").removeClass('mt-step-number bg-white font-grey-cascade');
                $("#number-title").removeClass('mt-step-title uppercase font-grey-cascade');
                $("#number-description").removeClass('mt-step-content font-grey-cascade');

                // Adicionando classe atual da aba
                $("#portability").addClass('col-md-4 mt-step-col bg-grey');
                $("#portability-number").addClass('mt-step-number bg-white font-grey-cascade');
                $("#portability-title").addClass('mt-step-title uppercase font-grey-cascade');
                $("#portability-description").addClass('mt-step-content font-grey-cascade');

                $("#number").addClass('col-md-6 mt-step-col bg-blue-madison bg-font-blue-madison');
                $("#number-number").addClass('mt-step-number bg-white font-blue-madison');
                $("#number-title").addClass('mt-step-title uppercase font-white');
                $("#number-description").addClass('mt-step-content font-white');
            });

            $('.cpf_cnpj').blur(function(){
                if(this.value != ""){
                    if(formata_cpf_cnpj(this.value)){
                        this.value = formata_cpf_cnpj(this.value);
                    }else{
                        swal({"title":"Atenção!","text":"CPF ou CNPJ inválido!","showConfirmButton":true,"type":"error"});
                    }
                }
            });
        });


        function selNumber(ddd, line, retorno) {
            if(ddd>0){
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                    }
                })

                $("#editNumber-"+line).html("<p>Por favor aguarde enquanto os procuramos os números disponíveis <img src='<?php echo e(asset('/assets/global/img/loading.gif')); ?>'></p>");

                $.ajax({
                    type: "GET",
                    url: '<?php echo e(route('virtualnumber.did')); ?>',
                    data: {ddd: ddd},
                    success: function(data) {
                        $("#editNumber-"+line).html(data);
                        $("#editNumber-"+line+" #virtual_number").attr("id","virtual_number_"+(line));
                        if(retorno){
                            console.log($("#virtualDDD_"+line).val());
                            if($("#virtualDDD_"+line).val() > 0){
                                $("#editNumber-"+line+" #virtual_number_"+line).css("border-color","#f2784b").attr("title","Campo obrigatório");
                            }
                        }else{
                            $("#editNumber-"+line+" #virtual_number_"+line).css("border-color","#c2cad8");
                        }

                    }
                });
            }else{
                $("#editNumber_"+line).html('<select id="virtualnumber-default" class="form-control" name=""><option value="">Escolha seu Número Virtual</option></select>');
            }
        }
        // function dynamicHtml(tipo,signal,max){
        //     $.ajaxSetup({
        //         headers: {
        //             'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
        //         }
        //     });

        //     var varCount = tipo == "portability" ? countPortabilities : countNumbers;
        //     if(signal == "+"){
        //         varCount++;
        //         if( max > ((countNumbers + countPortabilities)+1) ){// Compara se não excede a quantidade de numeros disponiveis por plano

        //         }else{

        //         }
        //     }else{
        //         varCount--;
        //         if(0 <= ((countNumbers + countPortabilities)-1)){
        //             return false;
        //         }
        //     }


        //     $.ajax({
        //         type: "GET",
        //         url: '<?php echo e(route('virtualnumber.dynamic')); ?>',
        //         data: {tipo: tipo,qtd: varCount,max: max},
        //         success: function(data) {
        //             countNumbers - countPortabilities
        //             console.log("dynamicHtml",data);
        //             $("#dynamic-"+tipo).html(data);
        //         }
        //     });
        // }
        function zip_code(line) {
            var zip_code = $('#zip_code_'+line).val() ? $('#zip_code_'+line).val() : "";
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                }
            })

            $.ajax({
                type: "GET",
                url: '<?php echo e(route('search.zipcode')); ?>',
                data: {zip_code:zip_code },
                success: function(data) {
                    var json = JSON.parse(data);
                    console.log(json);

                    $("#address_"+line).val(json.logradouro);
                    $("#complement_"+line).val(json.complemento);
                    $("#neighborhood_"+line).val(json.bairro);
                    $("#city_"+line).val(json.localidade);
                    $("#state_"+line).val(json.uf);
                }
            });
        }
    <?php endif; ?>
</script>
    <?php if(Auth::user()->chat): ?>
        <!-- BEGIN JIVOSITE CODE {literal} -->
            <script type='text/javascript'>
            (function(){ var widget_id = 'o6gDGQPyK5';var d=document;var w=window;function l(){
            var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = '//code.jivosite.com/script/widget/'+widget_id; var ss = document.getElementsByTagName('script')[0]; ss.parentNode.insertBefore(s, ss);}if(d.readyState=='complete'){l();}else{if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})();</script>
        <!-- {/literal} END JIVOSITE CODE -->
        <!-- <script type="text/javascript">
            var __tw_omni_args__ = { channel: 'widget', link: 'https://app.omnismart.io:3000/', sk: '1591185964576', lang: 'pt-BR' }; 
            var script = document.createElement('script'); script.type = 'text/javascript'; script.src = __tw_omni_args__.link + 'chat/index.js'; 
            document.head.appendChild(script); 
        </script> -->
    <?php endif; ?>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('template', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>