@include('layouts.breadcumb')
@section('header')
    <link rel="stylesheet" href="/plugins/datatables/jquery.dataTables.min.css">
    <link rel="stylesheet" href="/plugins/datatables/dataTables.bootstrap.min.css">
@endsection

<div class="row">

    <div class="panel panel-warning panel-border">

        <!-- panel head -->
        <div class="panel-heading">
            @if (Session::has('message'))
            @section('scripts')
                <script>
                    swal("Registered!", "It was created right mind!", "success")
                </script>
            @endsection
            @endif

        </div>
        <div id="div-content" class="panel-body">

            <div class="form-group">
                <label class="col-sm-10"><strong>Importar EXCEL</strong></label>

                {{ Form::open( array( 'method' => 'POST', 'files' => true, 'id' => 'frmProductos' )) }}
                    <div class="form-group">
                        <div class="col-sm-3">
                            {{ Form::file('productos', array( 'class'=>'form-control', 'id' => 'productos', 'required' )) }}

                        </div>
                        <div class="col-sm-3">
                            <button id="subir" name="subir" type="submit" data-loading-text="Subiendo..."  class="btn btn-rounded waves-effect waves-light btn-primary btn-lg btn-icon "><i class="fa fa-cloud-upload"></i> SUBIR ARCHIVO</button>
                        </div>
                    </div>

                    {{ Form::hidden('id_evento',$id) }}
                    {{ Form::hidden('acc', 'upload-productos') }}
                {{Form::close()}}


                <div clasS="form-group col-md-4">

                    <button id="procesarBtn" onclick="location.href='/mercadeo/eventos/administrar-eventos/excel/{{ $id }}';showMessage('GENERANDO REPORTE, ESPERE POR FAVOR');" type="button" data-loading-text="<i class='fa fa-file-excel-o'></i> Procesando ..." class="btn btn-rounded waves-effect waves-light btn-success btn-icon btn-lg">
                        <i class="fa fa-file-excel-o"></i> GENERAR REPORTE EXCEL                    </button>
                </div>

            </div>



            <form method="post" role="form" id="productos-evento-form">


                <table class="table table-striped table-colored-bordered table-bordered-inverse table-hover table-responsive" id="table-1">
                    <thead>

                    <tr>

                        <th width="7%"><center><button type="button" id="selectAll" class="main"><span class="sub"></span> Todos </button></center> </th>
                        <th >ID</th>
                        <th >PRODUCTO</th>
                        <th >CODIGO PRODUCTO</th>
                        <th >DESCUENTO</th>
                        <th >ESTADO</th>
                    </tr>
                    <tr class="filter-column-tr">
                        <th></th>
                        <th></th>
                        <th></th>
                        <th></th>
                        <th></th>
                        <th></th>
                    </tr>
                    </thead>
                    <tbody id="load-dtl">
                    @foreach($productos as $producto)
                        <tr>
                            <td align="center"><input type="checkbox" value="{{ $producto->producto_codigo  }}" name="productos[]"></td>
                            <td width="5%">{{$producto->id}}</td>
                            <td>{{$producto->descripcion}}</td>
                            <td>{{$producto->producto_codigo}}</td>
                            <td>{{$producto->descuento}}</td>
                            <td width="6%" align="center">
                                @if( $producto->status == 1 )
                                    <input type="hidden" value="{{$producto->status}}">
                                    <a class="btn btn-primary" rel="tooltip" data-original-title="ACTIVO">
                                        <i class="fa fa-2x fa-check-square-o"></i>
                                    </a>
                                @else
                                    <input type="hidden" value="{{$producto->status}}">
                                    <a class="btn btn-primary" rel="tooltip" data-original-title="INACTIVO">
                                        <i class="fa fa-2x fa-square-o"></i>
                                    </a>
                                @endif</td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
                <a id="abajo"></a>
            </form>

                <div class="clearfix"></div>
                <div class="modal-footer">

                    <div clasS="form-group col-md-3">
                        <button id="eliminar" name="eliminar" type="button" data-loading-text="Eliminando..."  class="btn btn-rounded waves-effect waves-ligth btn-danger btn-lg btn-icon "><i class="fa fa-trash"></i> ELIMINAR</button>
                    </div>
                    <div clasS="form-group col-md-3">
                        <button id="desactivar" name="desactivar" type="button" data-loading-text="Desactivando..."  class="btn btn-rounded waves-effect waves-ligth btn-warning btn-lg btn-icon "><i class="fa fa-square-o"></i> DESACTIVAR</button>
                    </div>
                    <div clasS="form-group col-md-3">
                        <button id="activar" name="activar" type="button" data-loading-text="Activando..."  class="btn btn-rounded waves-effect waves-ligth btn-info btn-lg btn-icon "><i class="fa fa-check-square-o"></i> ACTIVAR</button>
                    </div>

                </div>
        </div>
    </div>
</div>
@section('footer')
    <script src="/plugins/datatables/jquery.dataTables.min.js"></script>
    <script src="/plugins/datatables/dataTables.bootstrap.js"></script>
    <script src="/plugins/bootstrap-filestyle/js/bootstrap-filestyle.min.js" type="text/javascript"></script>
    <script type="text/javascript">





        $(document).ready(function () {
            $('body').on('click', '#selectAll', function () {
                if ($(this).hasClass('allChecked')) {
                    $('input[type="checkbox"]', '#table-1').prop('checked', false);
                } else {
                    $('input[type="checkbox"]', '#table-1').prop('checked', true);
                }
                $(this).toggleClass('allChecked');
            })
        });

        $(document).ready(function(){

            $('.ir-arriba').click(function(){
                $('body, html').animate({
                    scrollTop: '0px'
                }, 300);
            });

            $(window).scroll(function(){
                if( $(this).scrollTop() > 0 ){
                    $('.ir-arriba').slideDown(300);
                } else {
                    $('.ir-arriba').slideUp(300);
                }
            });

        });


        $(document).ready(function() {

            $(document).on('click', '#desactivar', function() {

                var productosForm = $("#productos-evento-form").serialize();

                swal({
                            title: "DESACTIVAR PRODUCTOS",
                            text: "Esta seguro de desactivar estos productos",
                            type: "warning",
                            showCancelButton: true,
                            closeOnConfirm: false,
                            confirmButtonText: "SI",
                            cancelButtonText: "NO",
                            showLoaderOnConfirm: true },
                        function(){

                            $.postJSON( "/mercadeo/eventos/desactivar/{{ $id }}", productosForm, function( event ) {

                                if( event.message == "1" ) {
                                    swal("Proceso Ejecutado", "El proceso ha finalizado exitosamente!", "success");

                                    setTimeout(function(){ location.reload(); }, 0001);

                                }else {
                                    swal("Error", "El proceso a finalidazo con error", "error");
                                }

                            });
                        });
            });
        });

        $(document).ready(function() {

            $(document).on('click', '#activar', function() {

                var productosForm = $("#productos-evento-form").serialize();

                swal({
                            title: "ACTIVAR PRODUCTOS",
                            text: "Esta seguro de activar estos productos",
                            type: "success",
                            showCancelButton: true,
                            closeOnConfirm: false,
                            confirmButtonText: "SI",
                            cancelButtonText: "NO",
                            showLoaderOnConfirm: true },
                        function(){

                            $.postJSON( "/mercadeo/eventos/activar/{{$id}}", productosForm, function( event ) {

                                if( event.message == "1" ) {
                                    swal("Proceso Ejecutado", "El proceso ha finalizado exitosamente!", "success");

                                    setTimeout(function(){ location.reload(); }, 0001);
                                }else {
                                    swal("Error", "El proceso a finalidazo con error", "error");
                                }

                            });
                        });
            });
        });

        $(document).ready(function() {

            $(document).on('click', '#eliminar', function() {

                var productosForm = $("#productos-evento-form").serialize();

                swal({
                            title: "ELIMINAR PRODUCTOS",
                            text: "Esta seguro de eliminar estos productos",
                            type: "success",
                            showCancelButton: true,
                            closeOnConfirm: false,
                            confirmButtonText: "SI",
                            cancelButtonText: "NO",
                            showLoaderOnConfirm: true },
                        function(){

                            $.postJSON( "/mercadeo/eventos/eliminar/{{$id}}", productosForm, function( event ) {

                                if( event.message == "1" ) {
                                    swal("Proceso Ejecutado", "El proceso ha finalizado exitosamente!", "success");

                                    setTimeout(function(){ location.reload(); }, 0001);
                                }else {
                                    swal("Error", "El proceso a finalidazo con error", "error");
                                }

                            });
                        });
            });
        });

        /*$("#frmProductos").ajaxForm({
            dataType:  'json',
            data: { acc: 'upload-productos' },
            beforeSubmit: function() {
                $('#div-content').block({
                    message: '<h3>Cargando Archivo</h3>', css: {}
                });
            },
            success: function(data){
                $("#load-dtl").empty();
                $('#div-content').unblock();
                if(data.response == 0) {
                    // messageSimple(data);
                    $('.dvmsg-alert-span').html(data.message);
                    $('#dvmsg-alert').css('display', 'block');
                }

                var tablaHtml = '<tr>' +
                        '<td align="right">{id}</td>' +
                        '<td align="right">{producto_codigo}</td>' +
                        '<td align="right">{descuento}</td>' +
                        '<td align="right">{status}</td>' +
                        '</tr>';

                // '<td align="right">${currency(total, 0, [",", "", "."])}</td>' +

                $.template("excel-tmpl", tablaHtml);
                $.tmpl("excel-tmpl", data.items).appendTo("#load-dtl");

                var control = $("#productos");
                control.replaceWith( control.val('').clone( true ) );

            }
        });*/


    </script>
    <script>
        var table = $("#table1").DataTable({
            "oLanguage": {
                "sUrl": "/layout/data/dataTables.es.txt"
            },

            orderCellsTop: true
        });

        $("#table1"+ ' thead tr:eq(1) th').each( function () {
            $(this).html( '<input type="text" placeholder="" class="filterInput" />' );
        } );

        // Apply the search


            $("#table1"+ ' thead tr:eq(1) td:eq(' + index + ') select').on('keyup change', function () {
                table.column($(this).parent().index() + ':visible')
                        .search(this.value)
                        .draw();
            })



    </script>

@stop