{% extends 'layouts/panel_layout.html.twig' %}

{% block title %}
Cheques
{% endblock %}



{% block content %}

    {# TITULO #}
    <div class="bg-dark m-b-30">
        <div class="container">
            <div class="row p-b-60 p-t-60">

                <div class="col-md-10 mx-auto text-center text-white p-b-30">
                    <div class="m-b-20">
                        <div class="avatar avatar-xl my-auto">
                            <i class="icon-placeholder mdi mdi-ticket-account" style="font-size: 5rem"></i>
                        </div>
                    </div>
                    <h1 id="page-offset">Cheques
                        <a href="javascript:void(0);"
                           data-toggle="modal" data-target="#mdlNuevaFactura"
                           class="btn btn-rounded-circle py-1 btn-outline-primary ml-2">
                            <i class="mdi mdi-plus mdi-18px"></i>
                        </a>
                    </h1>
                </div>

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

    {# BOTONERA PRINCIPAL #}
    <div class="container pull-up pb-5 mb-5">

        <div class="row">
 <div class="col-md-4 m-b-30">
                <div class="card card-hover">
                    <div class="card-body">
                        <div class="text-center p-t-20">
                            <div class="avatar-lg avatar">
                                <div class="avatar-title rounded-circle badge-soft-success">
                                    <i class="mdi mdi-account-multiple h1 m-0"></i>
                                </div>
                            </div>
                            <div class="text-center">
                                  <h1 class="fw-600 p-t-20">{{ countCheques }}</h1>
                                <p class="text-muted fw-600">CANTIDAD DE CHEQUES</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="d-none d-md-inline-block col-md-4 m-b-30">
                <div class="card card-hover">
                    <div class="card-body">
                        <div class="text-center p-t-20">
                            <div class="avatar-lg avatar">
                                <div class="avatar-title rounded-circle badge-soft-danger">
                                    <i class="mdi mdi-account-multiple h1 m-0"></i>
                                </div>
                            </div>
                            <div class="text-center">
                                <h1 class="fw-600 p-t-20">{{ chequesCobrados  }} / ${{ totalImporteCobrados| number_format(2) }}</h1>
                                <p class="text-muted fw-600">CHEQUES EN CARTERA</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="d-none d-md-inline-block col-md-4 m-b-30">
                <div class="card card-hover">
                    <div class="card-body">
                        <div class="text-center p-t-20">
                            <div class="avatar-lg avatar">
                                <div class="avatar-title rounded-circle badge-soft-info">
                                    <i class="mdi mdi-account-multiple h1 m-0"></i>
                                </div>
                            </div>
                            <div class="text-center">
<h1 class="fw-600 p-t-20">{{ chequesLiberado  }} / ${{ totalImporteLiberado| number_format(2) }}</h1>
                                <p class="text-muted fw-600">CHEQUES ENTREGADOS</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        

        </div>

    </div>

    {# CONTENIDO PRINCIPAL #}
    <div class="container-fluid pull-up pb-5 mb-5">

        <div class="row">

            {# FILTRO DE ESTADOS #}
            <div class="col-12">
                <div class="card">
                    <div class="card-body pt-5 pb-4">
                        <form action="{{ path('cheque_index') }}" method="GET" class="form-row">

                            <div class="col-6 py-3">
                                <label class="cstm-switch px-3 justify-content-center w-100" data-ui="radio-entrada">
                                    <input type="radio" name="estado" value="{{ estados.CARTERA }}"
                                           {% if estadoActual == estados.CARTERA %}checked="checked"{% endif %}
                                           class="cstm-switch-input" onchange="this.form.submit()">
                                    <span class="cstm-switch-indicator bg-success"></span>
                                    <span class="cstm-switch-description text-uppercase">CARTERA</span>
                                </label>
                            </div>

                            <div class="col-6 py-3">
                                <label class="cstm-switch px-3 justify-content-center w-100" data-ui="radio-entrada">
                                    <input type="radio" name="estado" value="{{ estados.ENTREGADO }}"
                                           {% if estadoActual == estados.ENTREGADO %}checked="checked"{% endif %}
                                           class="cstm-switch-input" onchange="this.form.submit()">
                                    <span class="cstm-switch-indicator bg-success"></span>
                                    <span class="cstm-switch-description text-uppercase">ENTREGADO</span>
                                </label>
                            </div>

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

            {# RESULTADO DE FILTRO (DEFAULT FACTURAS DEL DIA) #}
            <div class="col-12 mt-4">
                <div class="card">
                    <div class="card-body">
                        <div class="table-responsive p-t-10" data-ui="table_result">
                            <!-- Content obtained by ajax -->
                                    {% include 'cheques/templates/table_result.html.twig' with { cheques: cheques } %}
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>

 

{{ form_start(form, {'attr': {'id': 'chequeAdd'}}) }}
   <div class="modal fade" id="mdlNuevaFactura" tabindex="-1" role="dialog"
             aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">

                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalCenterTitle">Nuevo cheque</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>

                    <div class="modal-body">

                            <div class="form-row">

                            
                  <div class="form-row">     

                              <div class="pt-1 form-inline col-12">
                                    <label class="col-4 text-justify-none" for="{{ form.nroCheque.vars.id }}">
                                        {{ form.nroCheque.vars.label }}
                                    </label>
                                    {{ form_widget(form.nroCheque, { 'attr': {'class': 'form-control col-8', 'autocomplete': 'off'} }) }}
                               </div>
                               <div class="pt-1 form-inline col-12">    
                                    <label class="col-4 text-justify-none" for="{{ form.banco.vars.id }}">
                                        {{ form.banco.vars.label }}
                                    </label>
                                    {{ form_widget(form.banco, { 'attr': {'class': 'form-control col-8', 'autocomplete': 'off'} }) }}
                                 </div>
                                 <div class="pt-1 form-inline col-12">   
                                    <label class="col-4 text-justify-none" for="{{ form.fechaVencimiento.vars.id }}">
                                        {{ form.fechaVencimiento.vars.label }}
                                    </label>
                                    {{ form_widget(form.fechaVencimiento, { 'attr': {'class': 'form-control col-8 datesingle', 'autocomplete': 'off',  'data-daterange-expiration':"true"} }) }}
                                 </div>
                                 <div class="pt-1 form-inline col-12">  
                                    <label class="col-4 text-justify-none" for="{{ form.importe.vars.id }}">
                                        {{ form.importe.vars.label }}
                                    </label>
                                    {{ form_widget(form.importe, { 'attr': {'class': 'form-control col-8', 'autocomplete': 'off'} }) }}
                               </div>
                               <div class="  pt-1 form-inline col-12">
                                <label class="col-6 text-justify-none" for="{{ form.esTercero.vars.id }}">
                                            {{ form.esTercero.vars.label }}
                                </label>
                               </label>
                                    <label class="cstm-switch col-6"> 
                                    {{ form_widget(form.esTercero, { 'attr': {'class': 'cstm-switch-input', 'autocomplete': 'off'} }) }}
                                    <span class="cstm-switch-indicator"></span>
                                    </label>
                                </div>
                                <div class="pt-1 form-inline col-12">
                                    <label class="col-4 text-justify-none" for="{{ form.deQuien.vars.id }}">
                                        {{ form.deQuien.vars.label }}
                                    </label>
                                    {{ form_widget(form.deQuien, { 'attr': {'class': 'form-control col-8', 'autocomplete': 'off'} }) }}
                                 </div>
{#                                 <div class="pt-1 form-inline col-12">#}
{#                                    <label class="col-4 text-justify-none" for="{{ form.cobrado.vars.id }}">#}
{#                                        {{ form.cobrado.vars.label }}#}
{#                                    </label>#}
{#                                    {{ form_widget(form.cobrado, { 'attr': {'class': 'form-control col-8', 'autocomplete': 'off'} }) }}#}
{#                                </div>                                #}
                                <div class="pt-1 form-inline col-12">
                                    <label class="col-4 text-justify-none" for="{{ form.estado.vars.id }}">
                                        {{ form.estado.vars.label }}
                                    </label>
                                    {{ form_widget(form.estado, { 'attr': {'class': 'form-control col-8 ', 'autocomplete': 'off'} }) }}
                                </div>

                      <div class="pt-1 form-inline col-12">
                          <label class="col-4 text-justify-none" for="{{ form.observacion.vars.id }}">
                              {{ form.observacion.vars.label }}
                          </label>
                          {{ form_widget(form.observacion, { 'attr': {'class': 'form-control col-8 ', 'autocomplete': 'off'} }) }}
                      </div>

                    </div>                                    

                              

                      

                            </div>

                    </div>

                    <div class="modal-footer">
                        <button type="submit" class="btn btn-primary" id="submit_nuevo">Aceptar</button>
                    </div>

                </div>
            </div>
        </div>
{{ form_end(form) }}


{{ form_start(formEdit, {'attr': {'id': 'chequeEdit'}}) }}    
   <div class="modal fade" id="mdlEditCheque" tabindex="-1" role="dialog"
             aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">

                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalCenterTitle">Editar cheque</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>

                    <div class="modal-body">

                            <div class="form-row">

                            
                  <div class="form-row">     
                        {{ form_widget(formEdit.idCheque) }}
                           <div class="pt-1 form-inline col-12 pb-2">

                                   <label class="col-4 text-justify-none">
                                       Número de factura
                                   </label>
                                   <div class="col-8">
                                       <b id="cheque_edit_facturas"></b>
                                   </div>
                              </div>
                              <div class="pt-1 form-inline col-12">     
                                    <label class="col-4 text-justify-none" for="{{ formEdit.nroCheque.vars.id }}">
                                        {{ form.nroCheque.vars.label }}
                                    </label>
                                    {{ form_widget(formEdit.nroCheque, { 'attr': {'class': 'form-control col-8', 'autocomplete': 'off'} }) }}
                               </div>
                               <div class="pt-1 form-inline col-12">    
                                    <label class="col-4 text-justify-none" for="{{ formEdit.banco.vars.id }}">
                                        {{ formEdit.banco.vars.label }}
                                    </label>
                                    {{ form_widget(formEdit.banco, { 'attr': {'class': 'form-control col-8', 'autocomplete': 'off'} }) }}
                                 </div>
                                 <div class="pt-1 form-inline col-12">   
                                    <label class="col-4 text-justify-none" for="{{ formEdit.fechaVencimiento.vars.id }}">
                                        {{ formEdit.fechaVencimiento.vars.label }}
                                    </label>
                                    {{ form_widget(formEdit.fechaVencimiento, { 'attr': {'class': 'form-control col-8 datesingle', 'autocomplete': 'off',  'data-daterange-expiration':"true"} }) }}
                                 </div>
                                 <div class="pt-1 form-inline col-12">  
                                    <label class="col-4 text-justify-none" for="{{ formEdit.importe.vars.id }}">
                                        {{ formEdit.importe.vars.label }}
                                    </label>
                                    {{ form_widget(formEdit.importe, { 'attr': {'class': 'form-control col-8', 'autocomplete': 'off'} }) }}
                               </div>
                               <div class="  pt-1 form-inline col-12">
                                <label class="col-6 text-justify-none" for="{{ formEdit.esTercero.vars.id }}">
                                            {{ formEdit.esTercero.vars.label }}
                                </label>
                               </label>
                                    <label class="cstm-switch col-6"> 
                                    {{ form_widget(formEdit.esTercero, { 'attr': {'class': 'cstm-switch-input', 'autocomplete': 'off'} }) }}
                                    <span class="cstm-switch-indicator"></span>
                                    </label>
                                </div>
                                <div class="pt-1 form-inline col-12">
                                    <label class="col-4 text-justify-none" for="{{ formEdit.deQuien.vars.id }}">
                                        {{ formEdit.deQuien.vars.label }}
                                    </label>
                                    {{ form_widget(formEdit.deQuien, { 'attr': {'class': 'form-control col-8', 'autocomplete': 'off'} }) }}
                                 </div>
{#                                 <div class="pt-1 form-inline col-12">#}
{#                                    <label class="col-4 text-justify-none" for="{{ formEdit.cobrado.vars.id }}">#}
{#                                        {{ formEdit.cobrado.vars.label }}#}
{#                                    </label>#}
{#                                    {{ form_widget(formEdit.cobrado, { 'attr': {'class': 'form-control col-8', 'autocomplete': 'off'} }) }}#}
{#                                </div>                                #}
                                <div class="pt-1 form-inline col-12">
                                    <label class="col-4 text-justify-none" for="{{ formEdit.estado.vars.id }}">
                                        {{ formEdit.estado.vars.label }}
                                    </label>
                                    {{ form_widget(formEdit.estado, { 'attr': {'class': 'form-control col-8 ', 'autocomplete': 'off'} }) }}
                                </div>
                              <div class="pt-1 form-inline col-12">
                                  <label class="col-4 text-justify-none" for="{{ formEdit.observacion.vars.id }}">
                                      {{ formEdit.observacion.vars.label }}
                                  </label>
                                  {{ form_widget(formEdit.observacion, { 'attr': {'class': 'form-control col-8 ', 'autocomplete': 'off'} }) }}
                              </div>

                    </div>                                    

                              

                      

                            </div>

                    </div>

                    <div class="modal-footer">
                        <button type="submit" class="btn btn-primary" id="submit_nuevo">Editar</button>
                    </div>

                </div>
            </div>
        </div>
{{ form_end(form) }}


{% endblock %}

{% block javascripts %}
    <script>

        // CONTAINER DE URLS A USAR EN JAVASCRIPT
        const urlContainer = {
          resumen: "{{ path('facturacion_resumen') }}", // PARA OBTENER EL RESUMEN PARA LA FECHA DEL FILTRO
          buscarCliente: "{{ path('buscar_cliente_json') }}",
          edicionCliente: "{{ path('cliente_edit', { cuenta: '_cuenta_' }) }}",
          actualizarVendedor: "{{ path('facturacion_vendedor_actualizar', { id: '_codigo_', vendedorId: '_vendedor_' }) }}",
          chequeAdd : "{{ path('cheque_index') }}",
          chequeDelete: "{{ path('cheque_delete', { id: '_codigo_' }) }}",
          chequeSearchId: "{{ path('cheque_search', { id: '_codigo_' }) }}",
          chequeEdit: "{{ path('cheque_edit') }}",
        };

    </script>
    {{ encore_entry_script_tags('cheques_index') }}
{% endblock %}