@extends('layouts.default')
@section('content')

<!-- Modal Accion Factura -->
<div class="modal fade" id="accionFactura" tabindex="-1" role="dialog" data-bs-backdrop="static" data-bs-keyboard="false" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
        <div class="modal-header">
            <h5 class="modal-title" id="accionFacturaLabel">Descarga y envío de CFDI</h5>
        </div>
        <div class="modal-body">  
            <div class="row">       
                <div class="col-6 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                    <button class="btn btn-info" onclick="descargar('xml')"><i class="fa fa-file-code" style="font-size:40px"></i><br/>Descargar XML</button>
                    <input type="hidden" id="seriefolio"/>
                </div>
                <div class="col-6 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                    <button class="btn btn-danger" onclick="descargar('pdf')"><i class="fa fa-file-pdf" style="font-size:40px"></i><br/>Descargar PDF</button>
                </div>
                <div class="col-12 col-sm-12 col-md-6 col-lg-6 col-xl-6">
                    <div class="form-group">
                        <label style="font-size:1.1em">Correo del cliente:</label>
                        <div style="text-align:right"><input type="text" style="border:#888 1px solid; margin-bottom:5px; padding: 5px; width:100%" id="correocliente"></div>
                        <div><button class="btn btn-primary btn-sm" onclick="enviarFactura()">Enviar</button>&nbsp;&nbsp;<span sytle="" id="mensajeMail"></span></div>
                    </div>
                </div>
            </div> 
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" id="accionFacturaClose" data-bs-dismiss="modal">Cerrar</button>
        </div>
        </div>
    </div>
</div>
<!-- End Modal -->
<!-- Modal Vendedores -->
<div class="modal fade" id="selVendedor" tabindex="-1" role="dialog" aria-labelledby="selVendedorLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
        <div class="modal-body">
            <div class="d-flex justify-content-center">
                <input type="text" class="form-control" id="codigoVendedor" style="width:90%; font-size:1.5em; text-align:center" placeholder="Codigo de vendedor" autocomplete="off" />
            </div>
            <div class="d-flex justify-content-center">
                <button class="btn btn-secondary" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="addInput(1)">1</button>
                <button class="btn btn-secondary" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="addInput(2)">2</button>
                <button class="btn btn-secondary" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="addInput(3)">3</button>
            </div>
            <div class="d-flex justify-content-center">
                <button class="btn btn-secondary" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="addInput(4)">4</button>
                <button class="btn btn-secondary" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="addInput(5)">5</button>
                <button class="btn btn-secondary" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="addInput(6)">6</button>
            </div>
            <div class="d-flex justify-content-center">
                <button class="btn btn-secondary" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="addInput(7)">7</button>
                <button class="btn btn-secondary" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="addInput(8)">8</button>
                <button class="btn btn-secondary" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="addInput(9)">9</button>
            </div>
            <div class="d-flex justify-content-center">
                <button class="btn btn-danger" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="delInput()"><i class="mdi mdi-backspace" style="font-size:1.5em"></i></button>
                <button class="btn btn-secondary" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="addInput(0)">0</button>
                <button class="btn btn-success" style="width:30%;float:left;font-size:1.5em; margin:2px" onclick="saveInput()"><i class="mdi mdi-check" style="font-size:1.5em"></i></button>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" id="selVendedorClose" data-bs-dismiss="modal">Cerrar</button>
        </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- Modal Anticipo -->
<div class="modal fade" id="modalAnticipo" tabindex="-1" role="dialog" aria-labelledby="modalAnticipoLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="modalAnticipoLabel">Generación de Anticipo</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group" style="text-align:left">
                            <span class="x-label">Centro de Costo:</span>
                            <select class="x-form-control" id="ant_almacen" onchange="getFormasPago('ant')"></select>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group">
                            <span class="x-label">Folio:</span>
                            <input type="text" class="form-control x-form-control-sm" id="ant_folio" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-4">
                        <div class="form-group">
                            <span class="x-label">Fecha:</span>
                            <input type="text" class="form-control x-form-control-sm" id="ant_fecha" value="10/12/2025" readonly autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-8">
                        <div class="form-group">
                            <span class="x-label">Cuenta:</span>
                            <select class="x-form-control" id="ant_cuenta"></select>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-7">
                        <div class="form-group">
                            <span class="x-label">Forma de Pago:</span>
                            <select class="x-form-control" id="ant_formapago" onchange="getCuentasDestino('ant_formapago','ant_almacen','ant_cuenta')"></select>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-5">
                        <div class="form-group" style="text-align:left">
                            <span class="x-label">Monto a Aplicar:</span>
                            <input type="number" class="x-form-control" id="ant_monto" autocomplete="off"  />
                        </div>
                    </div>
                    <div class="col-md-12 col-lg-12">
                        <div class="form-group" style="text-align:left">
                            <span class="x-label">Concepto:</span>
                            <textarea class="x-form-control text-uppercase" id="ant_concepto" autocomplete="off"></textarea>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" id="modalAnticipoClose" data-bs-dismiss="modal">Cerrar</button>
                <button type="button" class="btn btn-success" id="btnGeneraAnticipo" onclick="generaAnticipo()">Generar</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- Modal Nota de Abono -->
<div class="modal fade" id="modalNotaAbono" tabindex="-1" role="dialog" aria-labelledby="modalAnticipoLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="modalAnticipoLabel">Generación de Nota de Abono</h5>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group">
                            <span class="x-label">Folio:</span>
                            <input type="text" class="form-control x-form-control-sm" id="nabono_folio" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group">
                            <span class="x-label">Fecha:</span>
                            <input type="text" class="form-control x-form-control-sm" id="nabono_fecha" value="10/12/2025" readonly autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group">
                            <span class="x-label">Forma de Pago:</span>
                            <select class="x-form-control" id="nabono_formapago" onchange="getCuentasDestino('nabono_formapago','nabono_centrocosto','nabono_cuenta')"></select>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group">
                            <span class="x-label">Cuenta:</span>
                            <select class="x-form-control" id="nabono_cuenta"></select>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group" style="text-align:left">
                            <span class="x-label">Centro de Costo:</span>
                            <select class="x-form-control" id="nabono_almacen" onchange="getFormasPago('ant')"></select>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group" style="text-align:left">
                            <span class="x-label">Monto a Aplicar:</span>
                            <input type="number" class="x-form-control" id="nabono_monto" autocomplete="off"  />
                        </div>
                    </div>
                    <div class="col-md-12 col-lg-12">
                        <div class="form-group" style="text-align:left">
                            <span class="x-label">Concepto:</span>
                            <textarea class="x-form-control text-uppercase" id="nabono_concepto" autocomplete="off"></textarea>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-bs-dismiss="modal">Cerrar</button>
                <button type="button" class="btn btn-success" id="btnGeneraNotaAbono" onclick="generaNotaAbono()">Generar</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- Modal Nota de Debito -->
<div class="modal fade" id="modalND" tabindex="-1" role="dialog" aria-labelledby="modalNDLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="modalNDLabel">Generación de Nota de Débito (Cargo)</h5>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group">
                            <span class="x-label">Folio:</span>
                            <input type="text" class="form-control x-form-control-sm" id="nd_folio" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group">
                            <span class="x-label">Fecha:</span>
                            <input type="text" class="form-control x-form-control-sm" id="nd_fecha" value="10/12/2025" readonly autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group">
                            <span class="x-label">Forma de Pago:</span>
                            <select class="x-form-control" id="nd_formapago" onchange="getCuentasDestino('nd_formapago','nd_centrocosto','nd_cuenta')"></select>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group">
                            <span class="x-label">Cuenta:</span>
                            <select class="x-form-control" id="nd_cuenta"></select>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group" style="text-align:left">
                            <span class="x-label">Centro de Costo:</span>
                            <select class="x-form-control" id="nd_almacen" onchange="getFormasPago('nd')"></select>
                        </div>
                    </div>
                    <div class="col-md-3 col-lg-6">
                        <div class="form-group" style="text-align:left">
                            <span class="x-label">Monto a Aplicar:</span>
                            <input type="number" class="x-form-control" id="nd_monto" autocomplete="off"  />
                        </div>
                    </div>
                    <div class="col-md-12 col-lg-12">
                        <div class="form-group" style="text-align:left">
                            <span class="x-label">Factura Relacionada:</span>
                            <select class="x-form-control" id="nd_idpedido"></select>
                        </div>
                    </div>
                    <div class="col-md-12 col-lg-12">
                        <div class="form-group" style="text-align:left">
                            <span class="x-label">Concepto:</span>
                            <textarea class="x-form-control text-uppercase" id="nd_concepto" autocomplete="off"></textarea>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" id="modalNDClose" data-bs-dismiss="modal">Cerrar</button>
                <button type="button" class="btn btn-success" id="btnGeneraNotaDebito" data-bs-dismiss="modal" onclick="generaNotaDebito()">Generar</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->
<!-- Modal Clientes -->
<div class="modal fade" id="selCliente" data-bs-keyboard="false" data-bs-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="selClienteLabel" aria-hidden="true">
    <div class="modal-dialog modal-xl" role="document" style="max-width: 90%;">
        <div class="modal-content">
        <div class="modal-header">
            <h5 class="modal-title" id="selClienteLabel">Seleccione un Cliente</h5>
            <div style="width:50%">
                <div class="input-group">
                    <input type="text" class="form-control" id="searchCliente" placeholder="Escribe el nombre o clave del cliente" autocomplete="off" />
                    <!-- <button class="btn btn-sm btn-success" type="button" id="btnNewCliente">
                        <i class="mdi mdi-account-plus" style="font-size:1.8em"></i>
                    </button> -->
                </div>
            </div>
        </div>
        <div class="modal-body">
            <div class="table-responsive" style="height:400px;overflow:auto">
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th>Clave</th>
                            <th>Nombre</th>
                            <th>RFC</th>
                            <th>Telefono</th>
                        </tr>
                    </thead>
                    <tbody id="bodyClientes"></tbody>
                </table>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" id="selClienteClose" data-bs-dismiss="modal">Cerrar</button>
        </div>
        </div>
    </div>
</div>
<!-- End Modal -->
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header d-flex justify-content-between" style="font-size:1.2em; font-weight:bold; flex-direction: row"> 
                <div class="p-1">
                    <i class="icon-edit"></i> <span>Documentos Especiales de Clientes</span>
                </div>
            </div>
            <div class="card-body" style="padding:10px">
                <div class="row">
                    <div class="col-md-12">                 
                        <div class="row">
                            <div class="col-md-4">     
                                <span class="x-label">Cliente:*</span>
                                <div class="input-group">
                                    <input type="text" class="form-control x-form-control-sm" id="idcliente" style="display:none"/>
                                    <input type="text" class="form-control x-form-control-sm" style="padding:5px !important" id="cliente" placeholder="" readonly autocomplete="off" />
                                    <div class="input-group-append">
                                        <button class="btn btn-sm btn-secondary" type="button" id="btnIdCliente" disabled>
                                            <i class="mdi mdi-magnify" style="font-size:1em"></i>
                                        </button>
                                    </div>
                                </div>   
                            </div>
                            <div class="col-md-8">
                                <div class="p-1">
                                    <div class="form-group" style="text-align:right">
                                        <button class="btn btn-warning" onclick="modalAnticipo()">Nuevo Anticipo</button>
                                        <!-- <button class="btn btn-warning" onclick="modalNotaCredito()">Nueva Nota de Crédito</button> -->
                                        <button class="btn btn-warning" onclick="modalNotaAbono()">Nueva Nota de Abono</button>
                                        <button class="btn btn-warning" onclick="modaNotaCargo()">Nueva Nota de Cargo</button>
                                    </div>
                                </div>
                            </div>   
                        </div>
                    </div>
                </div>
                <br/>
                <div class="row">
                    <div class="col-12">
                        <div class="card">
                            <div class="card-header d-flex justify-content-between" style="flex-direction: row"> 
                                <div class="p-1">
                                    <div class="row">
                                        <div class="col-4">
                                            <div class="form-group" style="text-align:left">
                                                <span class="x-label">Tipo:</span>
                                                <select class="form-select" id="tipo">
                                                    <option value="0">Todos</option>
                                                    <option value="1">Anticipos</option>
                                                    <option value="2">Notas de Crédito</option>
                                                    <option value="3">Notas de Cargo</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-3">
                                            <div class="form-group">
                                                <span class="x-label">De:</span>
                                                <input type="text" class="form-control x-form-control-sm" id="fecde" value="10/12/2025" readonly autocomplete="off"/>
                                            </div>
                                        </div>
                                        <div class="col-3">
                                            <div class="form-group">
                                                <span class="x-label">Al:</span>
                                                <input type="text" class="form-control x-form-control-sm" id="fecal" value="10/12/2025" readonly autocomplete="off"/>
                                            </div>
                                        </div>
                                        <div class="col-2">
                                            <button class="btn btn-success" onclick="getDoctos()">Buscar</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="card-body">
                                <div class="table-responsive">
                                    <table id="tablaDocumentos" class="table">
                                        <thead>
                                            <tr>
                                                <th>Tipo</th>
                                                <th>Almacen</th>
                                                <th>Folio</th>
                                                <th>Fecha</th>
                                                <th>Concepto</th>
                                                <th>Forma Pago</th>
                                                <th>Importe</th>
                                                <th>Acciones</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
.nav-link.active{
    background: #90caf9 !important
}
#bordesTable{
    border: 1px solid #000000;
    text-align: center;
}
</style>

@stop
@section('jspage')
    <script src="jsprod/misc.js"></script>
    <script src="jsprod/doctosclientes.js"></script>
@stop