<?php include "Views/templates/header.php"; ?>

<div class="card">

        <div class="card-header bg-light">

            <button class="btn btn-secondary" type="button" onclick="" id="btnClientesHide"><i class="fas fa-caret-square-up"></i></button>
            <button class="btn btn-secondary d-none" type="button" onclick="" id="btnClientesShow"><i class="fas fa-caret-square-down"></i></button>

            <button class="btn btn-success" type="button" id="btnProcesar" disabled><i class="fas fa-save"></i></button>
            <!-- <button class="btn btn-danger" onclick="location.href='<?php echo base_url; ?>cajas/cierre'" type="button"><i class="fas fa-trash-alt"></i></button>             -->
        </div>

        <div class="card-body">
            <div class="row" id='areaClienteMinimizado'>
                <div class="col-12"></div>
            </div>

            <div class="row" id='areaCliente'>
                <div class="col-md-3">
                    <div class="form-group">

                        <div id='buscarClienteContainer'>
                            <label for="buscarCliente"><i class="fas fa-users"></i> Buscar Cliente 
                                <span class="badge bg-success" id='id_cliente_badge'></span>
                                <input type="hidden" id="id_cliente" value="1">
                            </label>

                            <div class="input-group mb-3">
                                <input id="buscarCliente" class="form-control" type="text" placeholder="Nombre del cliente">
                                <div class="input-group-append">
                                    <button class="btn btn-outline-danger" type="button" id='reset_cliente'><i class="fa-solid fa-eraser"></i></button>
                                </div>
                            </div>                            

                        </div>

                    </div>


                </div>


                <div class="col-md-2">
                    <div class="form-group">
                        <label for="fecha"># Recibo</label>
                        <input type="text" value="<?=$data['nrecibo']?>" class="form-control" disabled>
                    </div>
                </div>

                <div class="col-md-2">
                    <div class="form-group">
                        <label for="fecha">Fecha</label>
                        <input type="date" id="fecha" name="fecha" class="form-control" disabled>
                    </div>
                </div>

                <div class="col-md-2">
                    <div class="form-group">
                        <label for="tipoid_cliente">Tipo</label>
                        <select class="form-control" id="tipo" name="tipo" required disabled>
                        <?php
                            foreach((array)$data['metodos'] as $value)
                            {
                                echo "<option value='{$value['codme']}'>{$value['nombre']} {$value['codme']}</option>";
                            }
                        ?>
                        </select>                        
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group">
                        <label for="tipoid_cliente">BANCO</label>
                        <select class="form-control" id="banco" name="banco" required disabled>
                        <option value="0">Seleccione Banco</option>
                        <?php
                            foreach((array)$data['bancos'] as $value)
                            {
                                echo "<option value='{$value['id']}'>{$value['nombre']}</option>";
                            }
                        ?>
                        </select>
                    </div>
                </div>

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

<div class="card">
    <div class="card-body" id='area_creditos'>
        
        <i class="fa-solid fa-check-double text-warning mr-1"></i><span class='text-warning'>Seleccione el cliente</span>

        <!-- <div class="table-responsive">
        <table class="" id="t_ventas_hist" style="width: 100%;">
                <tbody id="t_ven">
                </tbody>
            </table>
        </div> -->
    </div>
</div>

<div class="card bg-light">
    <div class="card-body">
        <div class="row">
            <div class="col-md-9">

                <div class="form-group">
                    <label for="anotacion"><i class="fas fa-keyboard"></i> Referencias</label>
                    <input class="form-control" id="referencias" name="referencias" disabled/>
                </div>            

                <div class="form-group">
                    <label for="anotacion"><i class="fa fa-comments"></i>  Observaciones</label>
                    <textarea class="form-control" id="anotacion" name="anotacion" rows="3" maxlength="250" disabled></textarea>
                </div>
            </div>

            <div class="col-md-3">
                <!-- <div class="form-group">
                    <label for="total" class="font-weight-bold">Monto Total</label>
                    <input id="total" class="form-control" type="text" name="monto_total" id="monto_total" value='0' disabled>
                </div>
                <div class="form-group">
                    <label for="total" class="font-weight-bold">Saldo Total</label>
                    <input id="total" class="form-control" type="text" name="saldo_total" id="saldo_total" value='0' disabled>                    
                </div> -->

                <div class="form-group">
                    <label for="abonar_total" class="font-weight-bold">Abonar Total</label>
                    

                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text" id="basic-addon1">Q</span>
                        </div>
                        <input class="form-control text-right" type="text" name="abonar_total" id="abonar_total" value='0' disabled>
                    </div>                    

                </div>                
                <div class="form-group">
                    <button class="btn btn-success mt-2 btn-block" type="button" id="btnProcesar2" disabled>Guardar</i></button>
                    <button class="btn btn-danger  mt-2 btn-block" onclick="location.href='<?php echo base_url; ?>creditoventas/abonos'" type="button">Salir</button>                                        
                </div>
  
            </div>

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



<div id="nuevo_cliente" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="my-modal-title" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header bg-primary">
                <h5 class="modal-title text-white" id="title">Nuevo Cliente</h5>
                <button class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <form id="formulario" class="needs-validation" novalidate autocomplete="off">
                <div class="modal-body">
                    <div class="alert alert-info" role="alert">
                        Todo los campos con * son requeridos.
                    </div>
                    <div class="form-group">
                        <input type="hidden" id="id" name="id">
                        <label for="nombre">Nombre *</label>
                        <input id="nombre" class="form-control" type="text" name="nombre" placeholder="Nombre del cliente" required>
                        <div class="valid-feedback">
                            Correcto
                        </div>
                        <div class="invalid-feedback">
                            El nombre es requerido
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="telefono">Teléfono *</label>
                        <input id="telefono" class="form-control" type="text" name="telefono" placeholder="Teléfono" onkeypress="return soloNumeros(event);" required>
                        <div class="valid-feedback">
                            Correcto
                        </div>
                        <div class="invalid-feedback">
                            El teléfono es requerido
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="direccion">Dirección</label>
                        <textarea id="direccion" class="form-control" name="direccion" placeholder="Dirección" rows="3" required></textarea>
                        <div class="valid-feedback">
                            Correcto
                        </div>
                        <div class="invalid-feedback">
                            La direccion es requerido
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>




<style>
.height-max-autocomplete {
    max-height:400px;
    overflow-y: auto;
    overflow-x: hidden;
}
</style>

<?php include "Views/templates/footer.php"; ?>