{% extends "base.html.twig"%}
{% block stylesheets %}
    <link rel="stylesheet" href="{{ asset('css/templateOneBlock.css')}}">
{% endblock %}
{% block titulo %} - <a href="{{path('projectInitial',{ 'idproyectos':idproyectos})}}">{{proyectos.proyecto}}</a> - <a href="{{path(modulo.path,{ 'idproyectos':idproyectos,'idmodule':idmodule})}}">{{modulo.modulo}}</a>{% endblock %}
{% block menuTop %}
    <div class="col-lg-12 col-xs-12" >
        {# if (idproyectos < 1000) #}
            <div class="col-lg-12 col-xs-12" >
                {{ render(controller("PortalBundle:Default:topModule",{'idproyectos':idproyectos,'idmodule':idmodule})) }}
            </div>
        {# else %}
            <div class="col-lg-12 col-xs-12" >
                {{ render(controller("PortalBundle:Default:topModuleMx",{'idproyectos':idproyectosp,'idmodule':idmodule, 'idproyecto':idproyectos})) }}
            </div>
        {% endif #}
    </div>
{%endblock %}

{%block dashboard %}

    <style>
        .modal.modal-wide .modal-dialog {
            width: 90%;
        }
        .modal-wide .modal-body {
            overflow-y: auto;
        }


        .js-example-basic-single{
            width: 100%;
        }
        .js-example-basic-single .select2-arrow {
            background: white !important;
            background-image: none !important;
            border-left: none !important;
            margin-top: 5px !important;
        }
        .js-example-basic-single .select2-choice{
            display: block;
            width: 100%;
            height: 34px;
            padding: 6px 12px;
            font-size: 14px;
            line-height: 1.42857143;
            color: #555;
            background-color: #fff;
            background-image: none;
            border: 1px solid #ccc;
            border-radius: 4px;
            -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
            box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
            -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
            -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
            transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        }
        .js-example-basic-single .select2-choice:focus{
            border-color:#66afe9;
            outline:0;
            -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
            box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)
        }
    </style>


<script>


    $(function () {
        var idproy='{{idproyectos}}';

        var columna = [
            { "data": "id" },
            { "data": "Movimiento" },
            { "data": "Proveedor" },
            { "data": "entrega" },
            { "data": "recibe"},
            { "data": "Ubicación" },
            { "data": "fecha" },
            { "data": "Observaciones" },
            { "data": "Categoria" },
            { "data": "SubCategoria" },
            { "data": "Codigo" },
            { "data": "NombreProducto" },
            { "data": "Serie" },
            { "data": "Cantidad" },
            { "data": "Costo" },
            { "data": "Tipo" },
            { "data": "Contingencia" },
            { "data": "Mes" },
        ];
        //$('.double-scroll').doubleScroll();
        var table = $('#example').DataTable( {
            dom: 'Bfrtip',
            scrollY: '60vh',
            scrollX: true,
            scrollCollapse: true,
            orderCellsTop: true,
            "ajax": {
                "url": "{{ path('showreportSEP',{'idproyectos':idproyectos}) }}",
                "type": "POST",
                data:  function( d ) {
                    d.idproveedor= $('#idproveedor').val();
                }
            },
            columns: columna,
            lengthMenu: [
                [  25, 50, -1 ],
                [ '10 rows', '25 rows', '50 rows', 'Show all' ]
            ],
            buttons: [
                {
                    extend:'excel',
                    exportOptions: {
                        columns: [ 0,1,2,3,4,5 ]
                    }
                }

            ]
        } );

        $('#fileExcel').on('filepreajax', function(event, previewId, index) {
            console.log('File pre ajax triggered');

            $("#cargar").css('display','');
        });

    });
</script>
    <br>
    <br>
    <div class="row" style="overflow-x: auto;">
        <!--<div class="row double-scroll col-lg-12"></div>-->
        <table id="example" class="display nowrap" cellspacing="0" width="100%">
            <thead>
            <tr>
                <th>ID</th>
                <th>MOVIMIENTO</th>
                <th>PROVEEDOR</th>
                <th>USUARIO QUE REALIAZO EL MOVIMEINTO</th>
                <th>USUARIO QUE RECIBIO EL MOVIMEINTO</th>
                <th>UBICACION</th>
                <th>FECHA Y HORA DE INGRESO</th>
                <th>OBSERVACIONES</th>
                <th>CATEGORIA</th>
                <th>SUB CATEGORIA POR</th>
                <th>CODIGO</th>
                <th>NOMBRE DEL PRODUCTO</th>
                <th>SERIE</th>
                <th>CANTIDAD</th>
                <th>COSTO POR UNIDAD</th>
                <th>TIPO DE COMPRA</th>
                <th>CONTINGENCIA</th>
                <th>MES</th>
            </tr>
            </thead>
            <tbody id="tbody">
            </tbody>
        </table>
    </div>

{% endblock %}
{% block javascripts %}

    <link rel="stylesheet" href="{{ asset('css/jquery.dataTables.min.css')}}">
    <link rel="stylesheet" href="{{ asset('css/buttons.dataTables.min.css')}}">
    <!--script src="{{ asset('js/jquery-1.12.4.js') }}"></script-->
    <script src="{{ asset('js/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('js/dataTables.buttons.min.js') }}"></script>
    <script src="{{ asset('js/buttons.flash.min.js') }}"></script>
    <script src="{{ asset('js/jszip.min.js') }}"></script>
    <script src="{{ asset('js/pdfmake.min.js') }}"></script>
    <script src="{{ asset('js/vfs_fonts.js') }}"></script>
    <script src="{{ asset('js/buttons.html5.min.js') }}"></script>
    <script src="{{ asset('js/buttons.print.min.js') }}"></script>
    <script src="{{asset('js/jquery.doubleScroll.js')}}" type="text/javascript"></script>
{% endblock %}