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

<!-- Modal Documentos de Movimientos -->
<div class="modal fade" id="modalDoctosMovimientos" data-bs-keyboard="false" data-bs-backdrop="static" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-xl" role="document" style="max-width: 90%;">
        <div class="modal-content">
            <div class="modal-body">  
                <div class="row">       
                    <div class="col-2">                        
                        <div class="form-group">
                            <span class="x-label">Fecha Inicio:</span>
                            <input type="text" class="x-form-control" id="fechainicio" value="10/12/2025" onchange="verDoctosMovimientos()" readonly autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-2">                        
                        <div class="form-group">
                            <span class="x-label">Fecha Fin:</span>
                            <input type="text" class="x-form-control" id="fechafin" value="10/12/2025" onchange="verDoctosMovimientos()" readonly autocomplete="off"/>
                        </div>
                    </div>
                </div> 
                <div class="table-responsive">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>Folio</th>
                                <th>Fecha</th>
                                <th>Almacen</th>
                                <th>Proveedor</th>
                                <th>Total</th>
                            </tr>
                        </thead>
                        <tbody id="bodyDocumentos"></tbody>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- Modal Almacenes -->
<div class="modal fade" id="selAlmacen" tabindex="-1" data-bs-backdrop="static" role="dialog" aria-labelledby="selAlmacenLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
        <div class="modal-header">
            <h5 class="modal-title" id="selAlmacenLabel">Seleccione un Almacén</h5>
            <div style="width:50%">
                <input type="text" class="form-control" id="searchAlmacen" placeholder="Escribe el almacén" autocomplete="off" />
            </div>
        </div>
        <div class="modal-body">
            <div class="table-responsive">
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th>Almacén</th>
                            <th>Zona</th>
                        </tr>
                    </thead>
                    <tbody id="bodyAlmacenes"></tbody>
                </table>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
        </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- Modal Proveedores -->
<div class="modal fade" id="modalProveedor" tabindex="-1" role="dialog" data-bs-backdrop="static" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="selProveedorLabel">Seleccione un Proveedor</h5>
                <div style="width:50%">
                    <div class="input-group">
                        <input type="text" class="form-control" id="searchProveedor" placeholder="Escribe el nombre o clave del proveedor" autocomplete="off" />
                        <button class="btn btn-sm btn-success" type="button" id="btnNewProveedor">
                            <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>Vendedor</th>
                            </tr>
                        </thead>
                        <tbody id="bodyProveedores"></tbody>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- Modal Crear Nuevo Proveedor -->
<div class="modal fade" id="modalNewProveedor" data-bs-keyboard="false" data-bs-backdrop="static" tabindex="-1" aria-labelledby="modalNewClienteLabel" 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="modalNewClienteLabel">Nuevo Proveedor</h5>    
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            Nombre o razón social:*<br/>
                            <input type="text" class="x-form-control text-uppercase" id="nombreProveedor" placeholder="" autocomplete="off" />
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <span class="x-label">Cuenta Contable:</span>
                            <input type="text" class="x-form-control" id="cuentaProveedor" placeholder="" readonly autocomplete="off" />
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            Empresa:*<br/>
                            <select class="x-form-control" id="categoriaProveedor">

                            </select>
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <span class="x-label">RFC:</span>
                            <input type="text" maxlength="13" class="x-form-control text-uppercase" id="rfcNewProveedor" value="XAXX010101000" placeholder="XAXX010101000" autocomplete="off" />
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <span class="x-label">CURP:</span>
                            <input type="text" maxlength="18" class="x-form-control text-uppercase" id="curpProveedor" placeholder="" autocomplete="off" />
                        </div>
                    </div>
                    
                    <div class="col-md-2">
                        <div class="form-group">
                            <span class="x-label">Telefono:</span>
                            <input type="number" maxlength="10" class="x-form-control" id="telefonoProveedor" placeholder="" autocomplete="off"  />
                        </div>
                    </div>
                    <div class="col-md-2">                        
                        <div class="form-group">
                            <span class="x-label">Email:</span>
                            <input type="text" class="x-form-control" id="emailProveedor" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-4">                        
                        <div class="form-group">
                            <span class="x-label">Calle:</span>
                            <input type="text" class="x-form-control" id="calleProveedor" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-1">                        
                        <div class="form-group">
                            # Exterior:<br/>
                            <input type="text" class="x-form-control" id="numExteriorProveedor" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-1">                        
                        <div class="form-group">
                            # Interior:<br/>
                            <input type="text" class="x-form-control" id="numInteriorProveedor" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <span class="x-label">C.P:</span>
                            <input type="number" maxlength="5" class="x-form-control" id="codigopostalProveedor" placeholder="" autocomplete="off"  />
                        </div>
                    </div>
                    <div class="col-md-3">                        
                        <div class="form-group">
                            <span class="x-label">Colonia:</span>
                            <input type="text" class="x-form-control" id="coloniaProveedor" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-2">                        
                        <div class="form-group">
                            <span class="x-label">Pais:</span>
                            <select class="x-form-control" id="paisProveedor" onchange="getEstados(4)">

                            </select>
                        </div>
                    </div>
                    <div class="col-md-2">                        
                        <div class="form-group">
                            <span class="x-label">Estado:</span>
                            <select class="x-form-control" id="estadoProveedor" onchange="getMunicipios(4)">

                            </select>
                        </div>
                    </div>
                    <div class="col-md-2">                        
                        <div class="form-group">
                            <span class="x-label">Municipio:</span>
                            <select class="x-form-control" id="municipioProveedor">

                            </select>
                        </div>
                    </div>
                    <div class="col-md-2">                        
                        <div class="form-group">
                            Campo No.Identificación:*<br/>
                            <select class="x-form-control" id="noIdentificacion">
                                <option value="codigo">codigo Interno</option>
                                <option value="codigoproveedor">Codigo del proveedor</option>
                                <option value="codigobarras">Codigo de Barras</option>
                            </select>
                        </div>
                    </div>                                                
                    <<div class="col-md-2">
                        <div class="form-group">
                            Banco:*<br/>
                            <select id="bancoProveedor" class="x-form-control">

                            </select>
                        </div>
                    </div> 
                    <div class="col-md-2">
                        <div class="form-group">
                            Tarjeta Bancaria:*<br/>
                            <input type="number" class="x-form-control" id="tarjetaProveedor" placeholder="" autocomplete="off" />
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            Cuenta Bancaria:*<br/>
                            <input type="number" class="x-form-control" id="cuentaBancoProveedor" placeholder="" autocomplete="off" />
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            Clabe Interbancaria:*<br/>
                            <input type="number" class="x-form-control" id="clabeProveedor" placeholder="" autocomplete="off" />
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" id="modalNewClienteClose" data-bs-dismiss="modal">Cerrar</button>
                <button type="button" class="btn btn-success" id="modalNewClienteCrear" onclick="agregarProveedor()">Crear</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- Modal Subir PDF Comprobacion Gastos -->
<div class="modal fade" id="modalSubirComprobante" tabindex="-1" role="dialog" data-bs-backdrop="static" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="selAlmacenLabel">Selecciona el archivo de comprobante de gastos firmado y escaneado</h5>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                        <div class="form-group">
                            <span class="x-label">Folio:</span>
                            <input type="text" class="form-control x-form-control-sm" id="foliosubida" readonly autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                        <div class="form-group">
                            <span class="x-label">Fecha:</span>
                            <input type="text" class="form-control x-form-control-sm" id="fechaSubida" value="10/12/2025" readonly autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                        <div class="form-group">
                            <span class="x-label">Almacen:</span>
                            <select id="almacensubida" class="x-form-control" onchange="getFolioComprobanteGastos()">

                            </select>
                        </div>
                    </div>
                    <div class="col-12 col-sm-6 col-md-3 col-lg-4 col-xl-4">
                        <div class="form-group">
                            <span class="x-label">Comprobante de Gastos:</span>
                            <input class="form-control x-form-control-sm" id="inputSubidaComprobante" type="file" accept="application/pdf">
                        </div>
                    </div>
                </div>
                <br>
                <div class="row">
                    <div id="pdfContainer" style="width: 100%; height: 500px;"></div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" id="inputsubir" onclick="subirComprobanteGastos()">Subir</button>
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- Modal Selecciona Factura -->
<div class="modal fade" id="modalFacturas" tabindex="-1" role="dialog" data-bs-backdrop="static" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Seleccione una Factura</h5>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-12 col-sm-6 col-md-4 col-lg-2 col-xl-2">
                        <div class="form-group">
                            <span class="x-label">Fecha inicio:</span>
                            <input type="text" class="form-control x-form-control-sm" onchange="buscarCFDIs()" id="fechainiciocfdi" value="10/12/2025" readonly autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-12 col-sm-6 col-md-4 col-lg-2 col-xl-2">
                        <div class="form-group">
                            <span class="x-label">Fecha fin:</span>
                            <input type="text" class="form-control x-form-control-sm" onchange="buscarCFDIs()" id="fechafincfdi" value="10/12/2025" readonly autocomplete="off"/>
                        </div>
                    </div>
                </div>
                <div class="table-responsive" style="height:400px;overflow:auto">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th style="white-space: nowrap; text-align: center;">Fecha</th>
                                <th style="white-space: nowrap; text-align: center;">Proveedor</th>
                                <th style="white-space: nowrap; text-align: center;">Folio</th>
                                <th style="white-space: nowrap; text-align: center;">UUID</th>
                                <th style="white-space: nowrap; text-align: center;">Total</th>
                            </tr>
                        </thead>
                        <tbody id="bodyFacturas"></tbody>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- Modal Cuenta Contable -->
<div class="modal fade" id="modalCuentasContables" tabindex="-1" role="dialog" data-bs-backdrop="static" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="selProveedorLabel">Seleccione una cuenta contable</h5>
                <div style="width:50%">
                    <input type="text" class="form-control" id="searchCuentaContable" placeholder="Escribe el nombre o cuenta contable" autocomplete="off" />
                </div>
            </div>
            <div class="modal-body">
                <div class="table-responsive" style="height:400px;overflow:auto">
                    <table id="bodyCuentasContables" class="table table-striped">
                        <thead>
                            <tr>
                                <th>Numero</th>
                                <th>Descripcion</th>
                                <th>Cod. Agrupador</th>
                            </tr>
                        </thead>
                        <tbody></tbody>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<div class="row">
    <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
        <div class="card">
            <div class="card-body">    
                <ul class="nav nav-tabs" id="myTab" role="tablist">
                    <li class="nav-item" role="presentation">
                        <button class="nav-link" id="registroconfactura-tab" data-bs-toggle="tab" data-bs-target="#registroconfactura" type="button" role="tab" aria-controls="registroconfactura" aria-selected="false" style="display:none">
                            Registro Con Factura
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link" id="registro-tab" data-bs-toggle="tab" data-bs-target="#registro" type="button" role="tab" aria-controls="registro" aria-selected="false" style="display:none">
                            Registro Sin Factura
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link" id="comprobante-tab" data-bs-toggle="tab" data-bs-target="#comprobante" type="button" role="tab" aria-controls="comprobante" aria-selected="false" style="display:none">
                            Comprobante
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link" id="fichagarantia-tab" data-bs-toggle="tab" data-bs-target="#fichagarantia" type="button" role="tab" aria-controls="fichagarantia" aria-selected="false" style="display:none">
                            Ficha de Garantia
                        </button>
                    </li>
                </ul> 
                <!--////////////////////////////////////////////////////////////////////////////////////////PESTAÑA REGISTRO CON FACTURA///////////////////////////////////////////////////////////////////////////////-->
                <div class="tab-content" id="myTabContent" style="padding:1em; border: #DDD 1px solid !important; display:none">
                    <div class="tab-pane fade" id="registroconfactura" role="tabpanel" aria-labelledby="registroconfactura-tab">     
                        <div class="row">
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">     
                                <span class="x-label">FOLIO:</span>
                                <div class="input-group">
                                    <input type="hidden" id="idcajachica">
                                    <input type="text" class="form-control x-form-control-sm" style="padding:5px !important" id="folioconfactura" placeholder="----" readonly autocomplete="off" />
                                    <div class="input-group-append" style="height:30px">
                                        <button class="btn btn-sm btn-primary" style="height:30px" onclick="abreModalDoctos()">
                                            <i class="mdi mdi-magnify" style="font-size:1em"></i>
                                        </button>
                                    </div>
                                </div>   
                            </div>
                            <div class="col-12 col-sm-6 col-md-2 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Fecha:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="fechaconfactura" value="10/12/2025" readonly autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Almacen:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="almacenconfactura" placeholder="Seleccione..." readonly autocomplete="off" />
                                    <input type="text" style="display:none" id="idalmacenconfactura">
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-4 col-lg-3 col-xl-3">
                                <div class="form-group">
                                    <span class="x-label">Proveedor:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="proveedorconfactura" placeholder="Seleccione..." readonly autocomplete="off" />
                                    <input type="text" style="display:none" id="idproveedorconfactura">
                                    <input type="hidden" id="rfcproveedorconfactura" value="0">
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                                <div class="form-group">
                                    <span class="x-label">Folio Fiscal (UUID):</span>
                                    <input type="hidden" id="idfactura" value="0">
                                    <input type="text" class="form-control x-form-control-sm" id="foliofiscalconfactura" placeholder="Seleccione..." readonly autocomplete="off" />
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-2 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Fecha factura:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="fechafactura" readonly autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Folio Factura:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="foliofactura" autocomplete="off" />
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    Forma de Pago:*<br/>
                                    <select id="formapagoconfactura" class="x-form-control">

                                    </select>
                                </div>
                            </div>
                            <!-- <div class="col-12 col-sm-12 col-md-6 col-lg-3 col-xl-3">                      
                                <div class="form-group">
                                    <span class="x-label">Concepto:</span>
                                    <input type="text" class="form-control x-form-control-sm text-uppercase" id="conceptoconfactura" autocomplete="off"/>
                                </div>
                            </div> -->
                            <div class="col-12 col-sm-6 col-md-3 col-lg-5 col-xl-5">
                                <div class="form-group">
                                    <span class="x-label">Factura PDF:</span>
                                    <input class="form-control x-form-control-sm" id="inputfacturapdf" type="file" accept="application/pdf">
                                </div>
                            </div>
                            <!--  -->
                        </div> 
                        <hr>
                        <div class="row" style="height:300px; overflow:auto">
                            <div class="table-responsive">
                                <table class="table table-striped" id="tablaGastosconfactura" class="table">
                                    <thead style="background-color:#777">
                                        <tr>
                                            <!-- <th style="padding: 10px; text-align: center; color: #FFF">Codigo</th> -->
                                            <th style="padding: 10px; text-align: center; color: #FFF">Descripcion</th>
                                            <!-- <th style="padding: 10px; text-align: center; color: #FFF">Clave SAT</th>-->
                                            <th style="padding: 10px; text-align: center; color: #FFF">Cta. Contable</th> 
                                            <th style="padding: 10px; text-align: center; color: #FFF">Prec. Uni.</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Cant</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Subtotal</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">IVA</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">IVA Ret.</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Desc.</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Total</th>
                                            <!-- <th style="padding: 10px; text-align: center; color: #FFF">Acciones</th> -->
                                        </tr>
                                    </thead>
                                    <tbody></tbody>
                                </table>
                            </div>
                        </div>
                        <div class="row" style="padding-top:20px">
                            <div class="col-12 col-sm-6 col-md-4 col-lg-5 col-xl-5">
                                Observaciones:<br/>
                                <textarea class="form-control" id="observacionesconfactura" rows="3"></textarea>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                                <div class="row my-2 mt-4">
                                    <div class="col-md-6">
                                        Subtotal:
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="subtotalgastoconfactura">
                                        $ 0.00
                                    </div>
                                    <div class="col-md-6">
                                        Descuento:
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="descuentogastoconfactura">
                                        $ 0.00
                                    </div>
                                    <div class="col-md-6">
                                        I.V.A:
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="ivagastoconfactura">
                                        $ 0.00
                                    </div>
                                    <div class="col-md-6">
                                        Imp. Ret:
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="retenidogastoconfactura">
                                        $ 0.00
                                    </div>
                                    <div class="col-md-6">
                                        <b>TOTAL:</b>
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="totalgastoconfactura">
                                        $ 0.00
                                    </div>
                                </div>
                            </div>         
                            <div class="col-12 col-sm-6 col-md-5 col-lg-4 col-xl-4">
                                <div style="float:right; margin-right:5px">
                                    <button type="button" id="buttonImprimirconfactura" class="btn btn-warning" style="margin:3px" onclick="imprimirgastoconfactura()">
                                        <i class="mdi mdi-printer" style="font-size:3.4em"></i>
                                        <br/>
                                        Imprimir
                                    </button>                     
                                    <button type="button" id="buttonCancelarconfactura" class="btn btn-danger" style="margin:3px" onclick="cancelarGastoconfactura()">
                                        <i class="mdi mdi-close" style="font-size:3.4em"></i>
                                        <br/>
                                        Cancelar
                                    </button>    
                                    <button type="button" id="buttonGuardarconfactura" class="btn btn-success" style="margin:3px" onclick="guardarGastoconfactura()">
                                        <i class="mdi mdi-check" style="font-size:3.4em"></i>
                                        <br/>
                                        Guardar
                                    </button>
                                    <!-- <button type="button" id="buttonActualizarconfactura" class="btn btn-success" style="margin:3px; display:none;" onclick="actualizarGastoconfactura()">
                                        <i class="mdi mdi-check" style="font-size:3.4em"></i>
                                        <br/>
                                        Actualizar
                                    </button>   -->
                                </div>
                            </div>      
                        </div>              
                    </div>
                    <!--////////////////////////////////////////////////////////////////////////////////////////PESTAÑA REGISTRO SIN FACTURA///////////////////////////////////////////////////////////////////////////////-->
                    <div class="tab-pane fade" id="registro" role="tabpanel" aria-labelledby="registro-tab">     
                        <div class="row">
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">     
                                <span class="x-label">FOLIO:</span>
                                <div class="input-group">
                                    <input type="hidden" id="idgasto">
                                    <input type="text" class="form-control x-form-control-sm" style="padding:5px !important" id="folio" placeholder="----" readonly autocomplete="off" />
                                    <div class="input-group-append" style="height:30px">
                                        <button class="btn btn-sm btn-primary" style="height:30px" onclick="abreModalDoctos()">
                                            <i class="mdi mdi-magnify" style="font-size:1em"></i>
                                        </button>
                                    </div>
                                </div>   
                            </div>
                            <div class="col-12 col-sm-6 col-md-2 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Fecha:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="fecha" value="10/12/2025" readonly autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Almacen:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="almacen" placeholder="Seleccione..." readonly autocomplete="off" />
                                    <input type="text" style="display:none" id="idalmacen">
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-4 col-lg-3 col-xl-3">
                                <div class="form-group">
                                    <span class="x-label">Proveedor:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="proveedor" placeholder="Seleccione..." readonly autocomplete="off" />
                                    <input type="text" style="display:none" id="idproveedor">
                                    <input type="hidden" id="rfcproveedor" value="0">
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                                <div class="form-group">
                                    <span class="x-label">Comprobante PDF (remision):</span>
                                    <input class="form-control x-form-control-sm" id="inputComprobante" type="file" accept="application/pdf">
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    Forma de Pago:*<br/>
                                    <select id="formapago" class="x-form-control">

                                    </select>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-2 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Fecha gasto:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="fechagasto" onchange="validaFechaGastoRegistro()" value="10/12/2025" readonly autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-12 col-md-6 col-lg-4 col-xl-4">                      
                                <div class="form-group">
                                    <span class="x-label">Concepto:</span>
                                    <input type="hidden" id="idItemGasto">
                                    <input type="text" class="form-control x-form-control-sm text-uppercase" id="concepto" autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-2 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Total</span>
                                    <input type="number" class="x-form-control" id="total" autocomplete="off"/>
                                </div>
                            </div>
                            <!-- <div class="col-12 col-sm-6 col-md-2 col-lg-1 col-xl-1">
                                <div class="form-group">
                                    <span class="x-label">Cant.</span>
                                    <input type="number" class="x-form-control" id="cantidad" autocomplete="off"/>
                                </div>
                            </div> -->
                            <!-- <div class="col-12 col-sm-6 col-md-2 col-lg-3 col-xl-3">
                                <div class="row">
                                    <div class="col-12 col-sm-6 col-md-2 col-lg-4 col-xl-4">
                                        <div class="form-group">
                                            <span class="x-label">Subtotal</span>
                                            <input type="number" class="x-form-control" id="subtotal" autocomplete="off"/>
                                        </div>
                                    </div>
                                    <div class="col-12 col-sm-6 col-md-2 col-lg-4 col-xl-4">
                                        <div class="form-group">
                                            <span class="x-label">IVA</span>
                                            <input type="number" class="x-form-control" id="iva" autocomplete="off"/>
                                        </div>
                                    </div>
                                </div>
                            </div> -->
                            <div class="col-12 col-sm-6 col-md-4 col-lg-2 col-xl-2">
                                <button type="button" id="buttonAgregar" class="btn btn-primary btn-icon-text" title="Guardar" onclick="agregarGasto()" style="margin:3px; width:72px">
                                    <i class="mdi mdi-plus" style="font-size:1.6em"></i>                                                                          
                                </button> 
                                <button type="button" id="buttonLimpiar" class="btn btn-secondary btn-icon-text" title="Limpiar" onclick="reiniciaItemGasto()" style="margin:3px; width:72px">
                                    <i class="mdi mdi-file" style="font-size:1.6em"></i>                                                                          
                                </button>  
                            </div>
                        </div>
                        <hr>
                        <div class="row" style="height:300px; overflow:auto">
                            <div class="table-responsive">
                                <table class="table table-striped" id="tablaGastos" class="table">
                                    <thead style="background-color:#777">
                                        <tr>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Concepto</th>
                                            <!-- <th style="padding: 10px; text-align: center; color: #FFF">Prec. Uni.</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Cant</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Subtotal</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">iva</th> -->
                                            <th style="padding: 10px; text-align: center; color: #FFF">Total</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Acciones</th>
                                        </tr>
                                    </thead>
                                    <tbody></tbody>
                                </table>
                            </div>
                        </div>
                        <div class="row" style="padding-top:20px">
                            <div class="col-12 col-sm-6 col-md-4 col-lg-5 col-xl-5">
                                Observaciones:<br/>
                                <textarea class="form-control" id="observaciones" rows="3"></textarea>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                                <div class="row my-2 mt-4">
                                    <!-- <div class="col-md-6">
                                        Subtotal:
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="subtotalgasto">
                                        $ 0.00
                                    </div>                     -->
                                    <!-- <div class="col-md-6">
                                        Descuento:
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="descuento">
                                        $ 0.00
                                    </div>                     -->
                                    <!-- <div class="col-md-6">
                                        I.V.A:
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="ivagasto">
                                        $ 0.00
                                    </div>                    -->
                                    <!-- <div class="col-md-6">
                                        Imp. Ret:
                                    </div>
                                    <div class="col-md-6" style="text-align:right">
                                        $ 0.00
                                    </div>                    -->
                                    <div class="col-md-6">
                                        <b>TOTAL:</b>
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="totalgasto">
                                        <b>$ 0.00</b>
                                    </div>
                                </div>
                            </div>         
                            <div class="col-12 col-sm-6 col-md-5 col-lg-4 col-xl-4">
                                <div style="float:right; margin-right:5px">
                                    <button type="button" id="buttonImprimir" class="btn btn-warning" style="margin:3px" onclick="imprimirgasto()">
                                        <i class="mdi mdi-printer" style="font-size:3.4em"></i>
                                        <br/>
                                        Imprimir
                                    </button>                     
                                    <button type="button" id="buttonCancelar" class="btn btn-danger" style="margin:3px" onclick="cancelarGasto()">
                                        <i class="mdi mdi-close" style="font-size:3.4em"></i>
                                        <br/>
                                        Cancelar
                                    </button>    
                                    <button type="button" id="buttonGuardar" class="btn btn-success" style="margin:3px" onclick="guardarGasto()">
                                        <i class="mdi mdi-check" style="font-size:3.4em"></i>
                                        <br/>
                                        Guardar
                                    </button>
                                    <button type="button" id="buttonActualizar" class="btn btn-success" style="margin:3px; display:none;" onclick="actualizarGasto()">
                                        <i class="mdi mdi-check" style="font-size:3.4em"></i>
                                        <br/>
                                        Actualizar
                                    </button>  
                                </div>
                            </div>                   
                        </div>
                    </div>
                    <!--////////////////////////////////////////////////////////////////////////////////////////PESTAÑA COMPROBANTE///////////////////////////////////////////////////////////////////////////////-->       
                    <div class="tab-pane fade" id="comprobante" role="tabpanel" aria-labelledby="comprobante-tab">
                        <div class="row">
                            <div class="col-12 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                                <div class="row">
                                    <div class="col-12 col-sm-6 col-md-3 col-lg-6 col-xl-6">
                                        <div class="form-group">
                                            <span class="x-label">Fecha Inicio:</span>
                                            <input type="text" class="form-control x-form-control-sm" id="fechainiciocomprobante" value="10/12/2025" readonly autocomplete="off"/>
                                        </div>
                                    </div>
                                    <div class="col-12 col-sm-6 col-md-3 col-lg-6 col-xl-6">
                                        <div class="form-group">
                                            <span class="x-label">Fecha Fin:</span>
                                            <input type="text" class="form-control x-form-control-sm" id="fechafincomprobante" value="10/12/2025" readonly autocomplete="off"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Almacen:</span>
                                    <select id="cajachicaalmacen" class="x-form-control" onchange="getGastosCajaChica()">

                                    </select>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Tipo:</span>
                                    <select id="cajachicatipo" class="x-form-control" onchange="getGastosCajaChica()">
                                        <option value="0">SIN FACTURA</option>
                                        <option value="1">CON FACTURA</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Estatus:</span>
                                    <select id="cajachicaestatus" class="x-form-control" onchange="getGastosCajaChica()">
                                        <option value="1">PENDIENTES</option>
                                        <option value="2">CAPTURADOS</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                                <div class="form-group">
                                    Banco:*<br/>
                                    <select id="banco" class="x-form-control">

                                    </select>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                                <div class="form-group">
                                    <span class="x-label">Clabe Interbancaria:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="clabeinterbancaria" autocomplete="off" />
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-4 col-lg-3 col-xl-3">
                                <button type="button" id="buttonLimpiarcajachica" class="btn btn-secondary btn-icon-text" title="Limpiar" onclick="reiniciacajachica()" style="margin:3px; width:72px">
                                    <i class="mdi mdi-file" style="font-size:1.6em"></i>                                                                          
                                </button>
                                <button type="button" id="buttonPdfCajaChica" class="btn btn-danger btn-icon-text" title="Descargar PDF" onclick="pdfCajaChica()" style="margin:3px; width:72px">
                                    <i class="mdi mdi-file-pdf" style="font-size:1.6em"></i>                                                                          
                                </button> 
                                <!-- <button type="button" id="buttonAprobarCajaChica" class="btn btn-success btn-icon-text" title="Aprobar" onclick="aprobarCajaChica()" style="margin:3px; width:72px;">
                                    <i class="mdi mdi-check" style="font-size:1.6em"></i>                                                                          
                                </button>  -->
                            </div>
                        </div>
                        <div class="row" style="height:300px; overflow:auto" id="tablasinfactura">
                            <div class="table-responsive">
                                <table class="table table-striped" id="tablaGastosCajaChica" class="table">
                                    <thead style="background-color:#777">
                                        <tr>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Folio</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Fecha</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Almacén</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Proveedor</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Concepto</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Total</th>
                                            <!-- <th style="padding: 10px; text-align: center; color: #FFF">Acciones</th> -->
                                        </tr>
                                    </thead>
                                    <tbody></tbody>
                                </table>
                            </div>
                        </div>
                        <div class="row" style="height:300px; overflow:auto; display:none;" id="tablaconfactura">
                            <div class="table-responsive">
                                <table class="table table-striped" id="tablaGastosCajaChicaFacturas" class="table">
                                    <thead style="background-color:#777;">
                                        <tr>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Folio</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Fecha</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Almacén</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Proveedor</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Concepto</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Subtotal</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">iva</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Desc</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Total</th>
                                            <!-- <th style="padding: 10px; text-align: center; color: #FFF">Acciones</th> -->
                                        </tr>
                                    </thead>
                                    <tbody></tbody>
                                </table>
                            </div>
                        </div>
                        <div class="row mr-5 mt-3" style="justify-content: flex-end;">
                            <div class="col-1">
                                <b>TOTAL:</b>
                            </div>
                            <div class="col-1" style="text-align:right" id="totalgastotabla">
                                <b>$ 0.00</b>
                            </div>
                        </div>
                    </div>
                    <!--////////////////////////////////////////////////////////////////////////////////////////PESTAÑA OTROS///////////////////////////////////////////////////////////////////////////////-->
                    <div class="tab-pane fade" id="fichagarantia" role="tabpanel" aria-labelledby="fichagarantia-tab">     
                        <div class="row">
                            <div class="col-12 col-sm-6 col-md-3 col-lg-3 col-xl-3">     
                                <span class="x-label">FOLIO:</span>
                                <div class="input-group">
                                    <!-- <input type="hidden" id="idficha"> -->
                                    <input type="text" class="form-control x-form-control-sm" style="padding:5px !important" id="folioficha" placeholder="----" readonly autocomplete="off" />
                                    <div class="input-group-append" style="height:30px">
                                        <button class="btn btn-sm btn-primary" style="height:30px" onclick="abreModalDoctos()">
                                            <i class="mdi mdi-magnify" style="font-size:1em"></i>
                                        </button>
                                    </div>
                                </div>   
                            </div>
                            <div class="col-12 col-sm-6 col-md-2 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Fecha:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="fechaficha" value="10/12/2025" readonly autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-3 col-xl-3">
                                <div class="form-group">
                                    <span class="x-label">Almacen:</span>
                                    <select id="almacenficha" class="x-form-control" onchange="getFolioFichaGarantia()">

                                    </select>
                                </div>
                            </div>
                            <div class="col-12 col-sm-12 col-md-6 col-lg-4 col-xl-4">                      
                                <div class="form-group">
                                    <span class="x-label">Solicita:</span>
                                    <input type="text" class="form-control x-form-control-sm text-uppercase" value="{{ session()->get('nombre') }}" id="solicitaficha" readonly autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-12 col-md-6 col-lg-8 col-xl-8">                      
                                <div class="form-group">
                                    <span class="x-label">Concepto:</span>
                                    <input type="text" class="form-control x-form-control-sm text-uppercase" id="conceptoficha" autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-2 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Total</span>
                                    <input type="number" class="x-form-control" id="totalficha" autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-4 col-lg-2 col-xl-2">
                                <button type="button" id="btnGuardarFina" class="btn btn-success btn-icon-text" title="Guardar" onclick="agregarFicha()" style="margin:3px; width:72px">
                                    <i class="mdi mdi-content-save" style="font-size:1.6em"></i>                                                                          
                                </button> 
                                <button type="button" id="btnLimpiarFicha" class="btn btn-secondary btn-icon-text" title="Limpiar" onclick="reiniciaFicha()" style="margin:3px; width:72px">
                                    <i class="mdi mdi-file" style="font-size:1.6em"></i>                                                                          
                                </button>  
                            </div>
                        </div>
                        <hr>
                        <div class="row">
                            <div class="col-12 col-sm-6 col-md-2 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Fecha Inicio:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="filtrofechaficha" onchange="getFichasGarantias()" value="10/12/2025" readonly autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group">
                                    <span class="x-label">Fecha Fin:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="fechafinficha" onchange="getFichasGarantias()" value="10/12/2025" readonly autocomplete="off"/>
                                </div>
                            </div>
                        </div>
                        <div class="row" style="height:600px; overflow:auto">
                            <div class="table-responsive">
                                <table class="table table-striped" id="tableFichas" class="table">
                                    <thead style="background-color:#777">
                                        <tr>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Fecha</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Folio</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Sucursal</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Realizo</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Concepto</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Total</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Acciones</th>
                                        </tr>
                                    </thead>
                                    <tbody></tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@stop

@section('jspage')
  <script src="jsprod/misc.js?v=1.0"></script>
  <script src="jsprod/cajachica.js?v=1.1"></script>
@stop