@extends('layout')
@section('title', 'BDME Reporte Semestral')
@section('content')
    <div class="col-sm-12 col-md-10 col-lg-10 col-xl-10">
        <h3 class="text-center titulo">BDME Reporte Semestral</h3>
        <div class="borde-forma">
            <form id="form-inline" class="forma" method="post" accept-charset="utf-8" action="">
                <p class="parrafo-forma">Los campos marcados con <strong class="requerido">*</strong> son obligatorios.</p>
                {{ csrf_field() }}
                <div class="form-group row">
                    <label for="txtBuscarPre" class="col-form-label col-sm-5 col-md-5 col-lg-5 col-xl-5 text-right"><strong class="requerido">*</strong>Cuantia Minima:</label>
                    <div class="col-sm-5 col-md-5 col-lg-5">
                        <input type="text" class="form-control" title="Ingrese cuantia minima" placeholder="Cuantia Minima" name="txtValor"  autocomplete="off" id="txtValor" onkeyup="MASK(this, this.value, '##,###,###,###,###,###,###', 1)">
                    </div>
                </div>
                <div class="form-group row">
                    <label for="sltPeriodo" class="col-form-label col-sm-5 col-md-5 col-lg-5 col-xl-5 text-right"><strong class="requerido">*</strong>Fechas Cartera Generada:</label>
                    <div class="col-sm-5 col-md-5 col-lg-5">
                        <select name="sltPeriodo" id="sltPeriodo" class="form-control select">
                            <option value="">Fechas Cartera Generada</option>
                            @foreach($carteras as $row)
                                <option value="{{ $row->normf }}">{{ $row->fecha }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label for="sltTipoA" class="col-form-label col-sm-5 col-md-5 col-lg-5 col-xl-5 text-right"><strong class="requerido">*</strong>Generar a:</label>
                    <div class="col-sm-5 col-md-5 col-lg-5">
                        <select name="sltTipoA" id="sltTipoA" class="form-control select" required>
                            <?php
                            $html = "";
                            $html .= "<option value=''>Generar a..</option>";
                            $html .= "<option value='1'>.xls</option>";
                            $html .= "<option value='2'>.csv</option>";
                            $html .= "<option value='3'>.txt</option>";
                            echo $html;
                            ?>
                        </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label for="txtSeparador" class="col-form-label col-sm-5 col-md-5 col-lg-5 col-xl-5 text-right text-muted"><strong class="requerido">*</strong>Separador:</label>
                    <div class="col-sm-5 col-md-5 col-lg-5">
                        <input type="text" name="txtSeparador" id="txtSeparador" class="form-control" placeholder="Separador" readonly>
                    </div>
                </div>
                <div class="form-group row">
                    <div class="col-sm-5 col-md-5 col-lg-5 text-right"></div>
                    <div class="col-sm-5 col-md-5 col-lg-5 text-left">
                        <a href="#" id="btnEnviar" class="btn btn-primary sombra"><span class="fa fa-cloud-download"></span></a>
                    </div>
                </div>
            </form>
        </div>
    </div>
@stop
@section('script')
    <script>
        $("#sltTipoPeriodo").change(function (e) {
            var tipo = e.target.value;

            if(!isNaN(tipo)){
                var html = "";
                var date = new Date();
                switch (tipo){
                    case '1':
                        html += "<option value=''>Periodo</option>";
                        var $mes = [ 'no','Enero','Febrero', 'Marzo', 'Abril', 'Mayo','Junio','Julio', 'Agosto','Septiembre','Octubre','Noviembre','Diciembre'];
                        for (i = 1; i <= 12; i++){
                            var nmes  = (i < 10)?"0"+i:i;
                            var dia   = new Date(date.getFullYear(), nmes, 0);
                            var fecha = date.getFullYear()+'-'+nmes+'-'+dia.getDate();
                            html += "<option value='"+fecha+"'>"+$mes[i]+"</option>";
                        }
                        break;
                    case '2':
                        html += "<option value=''>Periodo</option>";
                        html += "<option value='"+date.getFullYear()+"-01-31;"+date.getFullYear()+"-03-31"+"'>Primer Trimestre</option>";
                        html += "<option value='"+date.getFullYear()+"-04-30;"+date.getFullYear()+"-06-30"+"'>Segundo Trimestre</option>";
                        html += "<option value='"+date.getFullYear()+"-07-31;"+date.getFullYear()+"-09-30"+"'>Tercer Trimestre</option>";
                        html += "<option value='"+date.getFullYear()+"-10-31;"+date.getFullYear()+"-12-31"+"'>Cuarto Trimestre</option>";
                        break;
                    case '3':
                        html += "<option value=''>Periodo</option>";
                        html += "<option value='"+date.getFullYear()+"-01-31;"+date.getFullYear()+"-06-30"+"'>Primer Semestre</option>";
                        html += "<option value='"+date.getFullYear()+"-07-31;"+date.getFullYear()+"-12-31"+"'>Segundo Semestre</option>";
                        break;
                }
                $("#sltPeriodo").html(html).trigger("chosen:updated");
            }
        });

        $("#sltTipoA").change(function (e) {
            var tipo = e.target.value;
            if(!isNaN(tipo)){
                switch (tipo){
                    case '2':
                    case '3':
                        $("#txtSeparador").attr('readonly', false);
                        $("label[for='txtSeparador']").removeClass('text-muted').removeAttr('required');
                        break;
                    default:
                        $("#txtSeparador").attr('readonly', true);
                        $("label[for='txtSeparador']").addClass('text-muted');
                        break;
                }
            }
        });

        $("#txtValor").focus();

        $("#btnEnviar").click(function(){
            var valor = $("#txtValor").val();
            var tipoP = $("#sltTipoPeriodo").val();
            var perdo = $("#sltPeriodo").val();
            var tipoA = $("#sltTipoA").val();
            var sep   = $("#txtSeparador").val();
            var token = $("input[name='_token']").val();
            $.post('{{ route("ProcesarInforme") }}', { txtValor: valor, sltPeriodo: perdo, sltTipoA: tipoA, txtSeparador: sep, _token: token}, function(data){
                var res = JSON.parse(data);
                if(res.mensaje == "OK"){
                    var html = "";
                    html += "<div id='html' class='text-center'>";
                    html += "<label class='control-label col-sm-12 col-md-12 col-lg-12'>El archivo a sido creado correctamente</label>";
                    html += "<a href='"+res.ruta+"'>Descargar <span class='glyphicon glyphicon-download'></span></a>";
                    html += "</div>";
                    $("#html").html(html);
                    $("#modalArchivo").modal("show");
                }else{
                    var html = "<div id='html' class='text-center'><h1>+res.mensaje+</h1></div>";
                    $("#html").html(html);
                    $("#modalArchivo").modal("show");
                }
            });
        });
    </script>
@stop
@include('cartera.archivo')