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

<!-- Modal Buscar Solicitudes de Transferencias -->
<div class="modal fade" id="modalSolicitudes" 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-header">
                <h4 class="modal-title" id="modalFacturarTitle" style="font-size:1.4em">Buscar Solicitudes de Transferencias</h4>
                <button type="button" class="btn-close btn-danger" data-bs-dismiss="modal" aria-label="Close">X</button>
            </div>
            <div class="modal-body">  
                <div class="row">       
                    <div class="col-md-2">                        
                        <div class="form-group">
                            <span class="x-label">Fecha inicio:</span>
                            <input type="text" class="x-form-control" id="solicitudfechainicio" value="15/12/2025" onchange="getSolicitudesTransferencias()" readonly autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-2">                        
                        <div class="form-group">
                            <span class="x-label">Fecha fin:</span>
                            <input type="text" class="x-form-control" id="solicitudfechafin" value="15/12/2025" onchange="getSolicitudesTransferencias()" 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">Sucursal:</span>
                            <select class="x-form-control" id="solicitudsucursalfiltro" onchange="getSolicitudesTransferencias()">

                            </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="estatusSolicitud" class="x-form-control" onchange="getSolicitudesTransferencias()">
                                <option value="0">TODOS</option>
                                <option value="1">PENDIENTE</option>
                                <option value="2">AUTORIZADO</option>
                                <option value="3">TRANSFERIDO</option>
                                <option value="99">RECHAZADO</option>
                            </select>
                        </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">Realizo:</span>
                            <select class="x-form-control" id="solicitudcolaboradorfiltro" onchange="getSolicitudesTransferencias()">

                            </select>
                        </div>
                    </div>
                </div> 
                <div class="card-body">
                    <div class="row" style="height:500px; overflow:auto">
                        <div class="table-responsive">
                            <table class="table table-striped" id="tablaSolicitudesTransferencias" 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">Proveedor</th>
                                        <th style="padding: 10px; text-align: center; color: #FFF">Total</th>
                                        <th style="padding: 10px; text-align: center; color: #FFF">Estatus</th>
                                        <th style="padding: 10px; text-align: center; color: #FFF">Acciones</th>
                                    </tr>
                                </thead>
                                <tbody></tbody>
                            </table>
                        </div>
                    </div>
                </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 Colaboradores -->
<div class="modal fade" id="modalColaboradores" 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">
                <h4 class="modal-title" id="modalFacturarTitle" style="font-size: 1.4em">Seleccione un Colaborador</h4>
                <div class="d-flex justify-content-between" style="width: 50%">
                    <input type="text" class="form-control" id="searchColaborador" placeholder="Escribe el nombre del colaborador" autocomplete="off" />
                    <button type="button" class="btn-close btn-danger" data-bs-dismiss="modal" aria-label="Close">X</button>
                </div>
            </div>
            <div class="modal-body">
                <div class="table-responsive" style="height:400px;overflow:auto">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>NIP</th>
                                <th>Nombre</th>
                                <th>RFC</th>
                                <th>Sucursal</th>
                                <th>Departamento</th>
                                <th>Puesto</th>
                            </tr>
                        </thead>
                        <tbody id="bodyColaboradores"></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 Ver Detalle Gastos -->
<div class="modal fade" id="modalDetalleGastos" 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">
                <h4 class="modal-title" id="modalFacturarTitle" style="font-size:1.4em">Detalle del Gasto</h4>
                <button type="button" class="btn-close btn-danger" data-bs-dismiss="modal" aria-label="Close">X</button>
            </div>
            <div class="modal-body">
                <div class="row" style="height:500px; overflow:auto">
                    <div class="table-responsive">
                        <table class="table table-striped" id="tableDetalleGastos" 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">Nu Cuenta</th>
                                    <th style="padding: 10px; text-align: center; color: #FFF">Cta Contable</th>
                                    <th style="padding: 10px; text-align: center; color: #FFF">Cantidad</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>
            <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">
                <h4 class="modal-title" id="modalFacturarTitle" style="font-size: 1.4em">Seleccione una cuenta contable</h4>
                <div class="d-flex justify-content-between" style="width: 50%">
                    <input type="text" class="form-control " id="searchCuentaContable" placeholder="Escribe el nombre o cuenta contable" autocomplete="off" />
                    <button type="button" class="btn-close btn-danger" data-bs-dismiss="modal" aria-label="Close">X</button>
                </div>
            </div>
            <div class="modal-body">
                <div class="table-responsive" style="height:400px;overflow:auto">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>Numero</th>
                                <th>Descripcion</th>
                                <th>Nivel</th>
                                <th>Cod. Agrupador</th>
                            </tr>
                        </thead>
                        <tbody id="bodyCuentasContables"></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 Ver PDF de la Provision -->
<div class="modal fade" id="modalVerPdf" tabindex="-1" data-bs-keyboard="false" data-bs-backdrop="static" role="dialog" aria-labelledby="selClienteLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="modalFacturarTitle" style="font-size:1.4em">Visualización de PDF</h4>
                <button type="button" class="btn-close btn-danger" data-bs-dismiss="modal" aria-label="Close">X</button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div id="pdfContainer" style="width: 100%; height: 700px;"></div>
                </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 Facturas de Reposicion de Gastos -->
<div class="modal fade" id="modalFacturasGastos" 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">
                <h4 class="modal-title" id="modalFacturarTitle" style="font-size: 1.4em">Seleccione una Factura</h4>
                <div class="d-flex justify-content-between" style="width: 50%">
                    <input type="text" class="form-control me-3" id="searchFactura" placeholder="Escribe el UUID de la factura" autocomplete="off" />
                    <button type="button" class="btn-close btn-danger" data-bs-dismiss="modal" aria-label="Close">X</button>
                </div>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="table-responsive" style="height:400px;overflow:auto">
                        <table class="table table-striped" id="tableFacturasGastos" 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">Proveedor</th>
                                    <th style="padding: 10px; text-align: center; color: #FFF">RFC</th>
                                    <th style="padding: 10px; text-align: center; color: #FFF">UUID</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>
                                </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                    </div>
                </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 Ver Factura PDF -->
<div class="modal fade" id="modalFacturaPdf" 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">
                <h4 class="modal-title" id="modalFacturarTitle" style="font-size:1.4em">Selecciona la factura en PDF a subir</h4>
                <button type="button" class="btn-close btn-danger" data-bs-dismiss="modal" aria-label="Close">X</button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-12 col-sm-12 col-md-6 col-lg-4 col-xl-4">                      
                        <div class="form-group">
                            <span class="x-label">Folio Fiscal (UUID):</span>
                            <input type="hidden" id="idReposicionDetalle" value="0">
                            <input type="text" class="form-control x-form-control-sm text-uppercase" id="reposicionuuid" disabled autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-12 col-sm-12 col-md-6 col-lg-2 col-xl-2">                      
                        <div class="form-group">
                            <span class="x-label">Monto:</span>
                            <input type="text" class="form-control x-form-control-sm text-uppercase" id="reposicionmonto" disabled 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">Documento PDF:</span>
                            <input class="form-control x-form-control-sm" id="inputDocPdf" type="file" accept="application/pdf">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div id="pdfFactura" style="width: 100%; height: 500px;"></div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
                <button type="button" class="btn btn-success" id="btnSubirDocto" style="display:none;" onclick="savePdfFactura()">Subir</button>
                <button type="button" class="btn btn-success" id="btnActualizarDocto" style="display:none;" onclick="savePdfFactura()">Actualizar</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- Modal Detalle de Gastos Sin Factura -->
<div class="modal fade" id="modalGastosSinFactura" tabindex="-1" role="dialog" data-bs-keyboard="false" data-bs-backdrop="static" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="modalFacturarTitle" style="font-size:1.4em">Ingresa los conceptos del gasto sin factura</h4>
                <button type="button" class="btn-close btn-danger" onclick="cancelarConceptos()" aria-label="Close">X</button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <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="idTipoGasto" value="0">
                            <input type="text" class="form-control x-form-control-sm text-uppercase" id="conceptoGastoSinFactura" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-12 col-sm-12 col-md-6 col-lg-2 col-xl-2">                      
                        <div class="form-group">
                            <span class="x-label">Cantidad:</span>
                            <input type="number" class="form-control x-form-control-sm" id="cantidadGastoSinFactura" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-12 col-sm-12 col-md-6 col-lg-2 col-xl-2">                      
                        <div class="form-group">
                            <span class="x-label">Monto:</span>
                            <input type="number" class="form-control x-form-control-sm" id="montoGastoSinFactura" autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-3">
                        <button type="button" class="btn btn-primary" onclick="agregarConceptoSinFactura()">Agregar</button>
                    </div>
                </div>
                <hr>
                <div class="row">
                    <div class="table-responsive" style="height:400px;overflow:auto">
                        <table class="table table-striped" id="tablaGastosSinFactura" class="table">
                            <thead style="background-color:#777">
                                <tr>
                                    <th style="padding: 10px; text-align: center; color: #FFF">Num</th>
                                    <th style="padding: 10px; text-align: center; color: #FFF">Concepto</th>
                                    <th style="padding: 10px; text-align: center; color: #FFF">Cantidad</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 class="modal-footer">
                <button type="button" class="btn btn-secondary" onclick="cancelarConceptos()">Cerrar</button>
                <button type="button" class="btn btn-success" id="btnSubirGasto" onclick="registrarAllConceptos()">Registrar</button>
            </div>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- Modal Buscar Reposiciones de Gastos -->
<div class="modal fade" id="modalReposiciones" 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-header">
                <h4 class="modal-title" id="modalFacturarTitle" style="font-size:1.4em">Buscar Reposiciones de Gastos</h4>
                <button type="button" class="btn-close btn-danger" data-bs-dismiss="modal" aria-label="Close">X</button>
            </div>
            <div class="modal-body">  
                <div class="row">       
                    <div class="col-md-2">                        
                        <div class="form-group">
                            <span class="x-label">Fecha inicio:</span>
                            <input type="text" class="x-form-control" id="reposicionfechainicio" value="15/12/2025" onchange="getReposicionesGastos()" readonly autocomplete="off"/>
                        </div>
                    </div>
                    <div class="col-md-2">                        
                        <div class="form-group">
                            <span class="x-label">Fecha fin:</span>
                            <input type="text" class="x-form-control" id="reposicionfechafin" value="15/12/2025" onchange="getReposicionesGastos()" 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">Sucursal:</span>
                            <select class="x-form-control" id="reposicionsucursalfiltro" onchange="getReposicionesGastos()">

                            </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="estatusReposicion" class="x-form-control" onchange="getReposicionesGastos()">
                                <option value="0">TODOS</option>
                                <option value="1">PENDIENTE</option>
                                <option value="2">AUTORIZADO</option>
                                <option value="3">TRANSFERIDO</option>
                                <option value="99">RECHAZADO</option>
                            </select>
                        </div>
                    </div>
                </div> 
                <div class="card-body">
                    <div class="row" style="height:500px; overflow:auto">
                        <div class="table-responsive">
                            <table class="table table-striped" id="tablaReposicionesGastos" 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">Colaborador</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">Estatus</th>
                                        <th style="padding: 10px; text-align: center; color: #FFF">Acciones</th>
                                    </tr>
                                </thead>
                                <tbody></tbody>
                            </table>
                        </div>
                    </div>
                </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">
                <div class="col-5">
                    <h4 class="modal-title" id="modalFacturarTitle" style="font-size:1.4em">Seleccione un Proveedor</h4>
                </div>
                <div style="width:50%">
                    <input type="text" class="form-control" id="searchProveedor" placeholder="Escribe el nombre o clave del proveedor" autocomplete="off" />
                </div>
                <button type="button" class="btn-close btn-danger ml-3" data-bs-dismiss="modal" aria-label="Close">X</button>
            </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>Banco</th>
                                <th>CLABE Interbancaria</th>
                                <th>Cuenta Bancaria</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 -->

<div class="row">
    <div class="col-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="solicitud-tab" data-bs-toggle="tab" data-bs-target="#solicitud" type="button" role="tab" aria-controls="solicitud" aria-selected="false" style="display:none">
                            Solicitud de Transferencia
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link" id="reposicion-tab" data-bs-toggle="tab" data-bs-target="#reposicion" type="button" role="tab" aria-controls="reposicion" aria-selected="false" style="display:none">
                            Reposicion de Gastos
                        </button>
                    </li>
                </ul>
                <div class="tab-content" id="myTabContent" style="padding:1em; border: #DDD 1px solid !important display:none">
                <!--////////////////////////////////////////////////////////////////////////////////////////PESTAÑA SOLICITUD///////////////////////////////////////////////////////////////////////////////-->
                    <div class="tab-pane fade" id="solicitud" role="tabpanel" aria-labelledby="solicitud-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="idsolicitud" value="0">
                                    <input type="text" class="form-control x-form-control-sm" style="padding:5px !important" id="solicitudfolio" placeholder="----" readonly autocomplete="off" />
                                    <div class="input-group-append" style="height:30px">
                                        <button class="btn btn-sm btn-primary" id="btnBuscarSolicitud" style="height:30px" data-bs-toggle="modal" data-bs-target="#modalSolicitudes">
                                            <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-1 col-xl-1">
                                <div class="form-group">
                                    <span class="x-label">Fecha:</span>
                                    <input type="text" class="form-control x-form-control-sm" id="solicitudfecha" value="15/12/2025" autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group" style="text-align:left">
                                    <span class="x-label">Sucursal:</span>
                                    <select class="x-form-control" id="solicitudsucursal" onchange="getFolio('solicitudfolio','solicitudsucursal')"></select>
                                </div>
                            </div>
                            <div class="col-5">
                                <div class="row">
                                    <div class="col-12 col-sm-6 col-md-3 col-lg-4 col-xl-4">
                                        <div class="form-group" style="text-align:left">
                                            <span class="x-label">Tipo:</span>
                                            <select class="x-form-control" id="solicitudtipo" onchange="changeTipoSolicitud()">
                                                <option value="0">PROVEEDOR</option>
                                                <option value="1">TRABAJADOR</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-12 col-sm-6 col-md-4 col-lg-8 col-xl-8"  id="divProveedor">
                                        <div class="form-group">
                                            <span class="x-label">Proveedor:</span>
                                            <input type="text" class="form-control x-form-control-sm text-uppercase" id="solicitudproveedor" placeholder="Seleccione un proveedor..." readonly autocomplete="off" />
                                            <input type="hidden" id="idsolicitudproveedor" value="0">
                                        </div>
                                    </div>
                                    <div class="col-12 col-sm-6 col-md-4 col-lg-8 col-xl-8" style="display:none;" id="divColaborador">
                                        <div class="form-group">
                                            <span class="x-label">Colaborador:</span>
                                            <input type="text" class="form-control x-form-control-sm text-uppercase" id="solicitudcolaborador" readonly autocomplete="off" />
                                            <input type="hidden" id="solicitudidcolaborador" value="0">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group" style="text-align:left">
                                    <span class="x-label">Banco:</span>
                                    <select class="x-form-control" id="solicitudbanco"></select>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    Numero de Tarjeta:*<br/>
                                    <input type="number" class="x-form-control" id="solicitudtarjetaProveedor" placeholder="" autocomplete="off" />
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    Numero de Cuenta:*<br/>
                                    <input type="number" class="x-form-control" id="solicitudcuentaBancoProveedor" placeholder="" autocomplete="off" />
                                </div>
                            </div>
                            <div class="col-12 col-sm-12 col-md-6 col-lg-3 col-xl-3">                      
                                <div class="form-group">
                                    CLABE Interbancaría:*</br>
                                    <input type="number" class="x-form-control" id="solicitudclabeproveedor" placeholder="" autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-5">
                                <div class="form-group">
                                    <span class="x-label">Concepto:</span>
                                    <input type="text" class="x-form-control text-uppercase" id="solicitudconcepto" placeholder="" autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-9">
                                <div class="row">
                                    <div class="col-2">
                                        <div class="form-group">
                                            Monto:*<br/>
                                            <input type="number" class="x-form-control" id="solicitudmonto" placeholder="" autocomplete="off" />
                                        </div>
                                    </div>
                                    <div class="col-2">
                                        <div class="form-group">
                                            <span class="x-label">Fecha Requerida:</span>
                                            <input type="text" class="form-control x-form-control-sm" id="solicitudfecharequerida" value="15/12/2025" autocomplete="off"/>
                                        </div>
                                    </div>
                                    <div class="col-12 col-sm-6 col-md-3 col-lg-4 col-xl-4">
                                        Comprobante o Cotizacion (Solo PDF)<br/>
                                        <div class="input-group">
                                            <input type="hidden" id="rutasolicitud" value="0">
                                            <input class="form-control x-form-control-sm" id="inputcomprobantepdf" type="file" accept="application/pdf">
                                            <div class="input-group-append">
                                                <button class="btn btn-sm btn-primary" type="button" id="btnVerComprobante" data-bs-toggle="tooltip" data-bs-placement="top" title="Ver PDF" onclick="verComprobantePDF()">
                                                    <i class="mdi mdi-eye" style="font-size:0.6em"></i>
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 col-sm-6 col-md-6 col-lg-4 col-xl-4">
                                        <div class="form-group">
                                            <span class="x-label">Observaciones:</span>
                                            <textarea class="form-control x-form-control-sm text-uppercase" rows="2" id="solicitudobservaciones"></textarea>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-4 col-lg-3 col-xl-3">
                                <button type="button" id="buttonSolicitar" class="btn btn-success btn-icon-text" data-bs-toggle="tooltip" data-bs-placement="top" title="SOLICITAR TRANSFERENCIA" onclick="solicitarTransferencia()" style="margin:3px; width:72px">
                                    <i class="mdi mdi-bank-transfer" style="font-size:1.8em"></i>                                                                          
                                </button> 
                                <!-- <button type="button" id="buttonConvertir" class="btn btn-success btn-icon-text" title="Convertir" onclick="convertirProvision()" style="margin:3px; width:72px; display:none;">
                                    <i class="mdi mdi-account-details" style="font-size:1.6em"></i>                                                                          
                                </button> -->
                                <button type="button" id="buttonAgregarFactura" class="btn btn-warning btn-icon-text" title="Añadir Factura" onclick="modalAnadirFactura()" disabled style="margin:3px; width:72px">
                                    <i class="mdi mdi-file-document-box-plus-outline" style="font-size:1.6em"></i>                                                                          
                                </button>
                                <button type="button" id="buttonLimpiar" class="btn btn-secondary btn-icon-text" data-bs-toggle="tooltip" data-bs-placement="top" title="Limpiar" onclick="reinicia()" style="margin:3px; width:72px">
                                    <i class="mdi mdi-file" style="font-size:1.8em"></i>                                                                          
                                </button>  
                            </div>
                        </div>
                        <hr><hr>
                        <div class="row divSolicitudFacturas" style="height:400px; overflow:auto; display:none;">
                            <div class="table-responsive">
                                <table class="table table-striped" id="tableFacturasSolicitud" 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">Proveedor</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Folio</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">UUID</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>
                        <hr><hr>
                        <div class="row divSolicitudFacturas" style="padding-top:20px; display:none;">
                            <div class="col-12 col-sm-6 col-md-4 col-lg-5 col-xl-5">
                                Observaciones de Comprobacion:<br/>
                                <textarea class="form-control text-uppercase" id="observacionesSolicitud" 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="solicitudSubtotalGasto">
                                        $ 0.00
                                    </div>
                                    <div class="col-md-6">
                                        I.V.A:
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="solicitudIvaGasto">
                                        $ 0.00
                                    </div>
                                    <div class="col-md-6">
                                        <b>TOTAL:</b>
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="solicitudTotalGasto">
                                        <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="btnLimpiarSolicitudFacturas" class="btn btn-danger" style="margin:3px" onclick="limpiarSolicitudFacturas()">
                                        <i class="mdi mdi-file" style="font-size:3.4em"></i>
                                        <br/>
                                        Limpiar
                                    </button>   
                                    <button type="button" id="btnImprimirSolicitudFacturas" class="btn btn-warning" disabled style="margin:3px" onclick="imprimirSolicitudFacturas()">
                                        <i class="mdi mdi-printer" style="font-size:3.4em"></i>
                                        <br/>
                                        Imprimir
                                    </button>                   
                                    <button type="button" id="btnRegistrarSolicitudFacturas" class="btn btn-success" style="margin:3px" onclick="registrarSolicitudFacturas()">
                                        <i class="mdi mdi-check" style="font-size:3.4em"></i>
                                        <br/>
                                        Comprobar
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--//////////////////////////////////////////////////////////////////////////////////////// PESTAÑA REPOSICION ///////////////////////////////////////////////////////////////////////////////-->
                    <div class="tab-pane fade" id="reposicion" role="tabpanel" aria-labelledby="reposicion-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="idreposicion">
                                    <input type="text" class="form-control x-form-control-sm" style="padding:5px !important" id="reposicionfolio" readonly autocomplete="off" />
                                    <div class="input-group-append" style="height:30px">
                                        <button class="btn btn-sm btn-primary" id="btnBuscarReposicion" style="height:30px" data-bs-toggle="modal" data-bs-target="#modalReposiciones">
                                            <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="reposicionfecha" value="15/12/2025" disabled autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group" style="text-align:left">
                                    <span class="x-label">Sucursal:</span>
                                    <select class="x-form-control" id="reposicionsucursal" onchange="getFolio('reposicionfolio','reposicionsucursal')"></select>
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-4 col-lg-4 col-xl-4">
                                <div class="form-group">
                                    <span class="x-label">Colaborador:</span>
                                    <input type="text" class="form-control x-form-control-sm text-uppercase" id="reposicioncolaborador" readonly autocomplete="off" />
                                    <input type="hidden" id="reposicionidcolaborador">
                                </div>
                            </div>
                            <div class="col-12 col-sm-6 col-md-3 col-lg-2 col-xl-2">
                                <div class="form-group" style="text-align:left">
                                    <span class="x-label">Banco:</span>
                                    <select class="x-form-control" id="reposicionbanco"></select>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    Numero de Tarjeta:*<br/>
                                    <input type="number" class="x-form-control" id="reposiciontarjeta" placeholder="" autocomplete="off" />
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    Numero de Cuenta:*<br/>
                                    <input type="number" class="x-form-control" id="reposicioncuenta" placeholder="" autocomplete="off" />
                                </div>
                            </div>
                            <div class="col-12 col-sm-12 col-md-6 col-lg-3 col-xl-3">                      
                                <div class="form-group">
                                    CLABE Interbancaría:*</br>
                                    <input type="number" class="x-form-control" id="reposicionclabe" placeholder="" autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-5">
                                <div class="form-group">
                                    <span class="x-label">Concepto:</span>
                                    <input type="text" class="x-form-control text-uppercase" id="reposicionconcepto" placeholder="" autocomplete="off"/>
                                </div>
                            </div>
                        </div>
                        <div class="row" id="divAgregarViatico">
                        <hr>
                            <h4>Agregar Gastos</h4>
                            <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="reposicionfechagasto" value="15/12/2025" readonly autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    Tipo:*<br/>
                                    <select class="x-form-control" id="reposiciontipogasto">
                                        <option value="0">SIN FACTURA</option>
                                        <option value="1">CON FACTURA</option>
                                    </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">Establecimiento:</span>
                                    <input type="text" class="x-form-control text-uppercase" id="reposicionestablecimientogasto" placeholder="" autocomplete="off"/>
                                </div>
                            </div>
                            <div class="col-5">
                                <div class="row">
                                    <div class="col-12 col-sm-12 col-md-6 col-lg-7 col-xl-7">                      
                                        <div class="form-group">
                                            <span class="x-label">Motivo:</span>
                                            <input type="text" class="x-form-control text-uppercase" id="reposicionmotivogasto" placeholder="" autocomplete="off"/>
                                        </div>
                                    </div>
                                    <div class="col-12 col-sm-6 col-md-4 col-lg-5 col-xl-5">
                                        <button type="button" id="comprobacionbuttonAgregar" class="btn btn-primary btn-icon-text" title="Agregar" onclick="agregarReposicionGasto()" style="margin:3px; width:72px">
                                            <i class="mdi mdi-plus" style="font-size:1.6em"></i>                                                                          
                                        </button> 
                                        <button type="button" id="comprobacionbuttonLimpiar" class="btn btn-secondary btn-icon-text" title="Limpiar" onclick="limpiarInputsReposicion()" style="margin:3px; width:72px">
                                            <i class="mdi mdi-file" style="font-size:1.6em"></i>                                                                          
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <hr>
                        <div class="row">
                            <div class="col-8">
                                <h4>Comprobantes de Gastos</h4>
                            </div>
                            <!-- <div class="col-4">
                                <div class="row">
                                    <div class="col-6">
                                        <b>TOTAL:</b>
                                    </div>
                                    <div class="col-6" style="text-align:right">
                                        <b id="totalComprobantesNotas">$ 0.00</b>
                                    </div>
                                </div>
                            </div> -->
                        </div>
                        <div class="row" style="height:400px; overflow:auto">
                            <div class="table-responsive">
                                <table class="table table-striped" id="tableAllGastos" 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">Tipo</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Establecimiento</th>
                                            <th style="padding: 10px; text-align: center; color: #FFF">Motivo</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>
                        <hr>
                        <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 text-uppercase" id="reposicionObservaciones" 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="reposicionSubtotalGasto">
                                        $ 0.00
                                    </div>
                                    <div class="col-md-6">
                                        I.V.A:
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="reposicionIvaGasto">
                                        $ 0.00
                                    </div>
                                    <div class="col-md-6">
                                        <b>TOTAL:</b>
                                    </div>
                                    <div class="col-md-6" style="text-align:right" id="repocisionTotalGasto">
                                        <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="comprobacionbuttonLimpiar" class="btn btn-danger" style="margin:3px" onclick="limpiarReposicion()">
                                        <i class="mdi mdi-file" style="font-size:3.4em"></i>
                                        <br/>
                                        Limpiar
                                    </button>   
                                    <button type="button" id="buttonImprimirComprobacion" class="btn btn-warning" disabled style="margin:3px" onclick="imprimirComprobacionViatico()">
                                        <i class="mdi mdi-printer" style="font-size:3.4em"></i>
                                        <br/>
                                        Imprimir
                                    </button>                   
                                    <button type="button" id="comprobacionbuttonGuardar" class="btn btn-success" style="margin:3px" onclick="registrarReposicionGastos()">
                                        <i class="mdi mdi-check" style="font-size:3.4em"></i>
                                        <br/>
                                        Comprobar
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@stop

@section('jspage')
  <script src="jsprod/solicitudes_colaborador.js?v=20251215202501"></script>
@stop