@extends('layouts.app')

@section('title', 'Nueva Recepción de Mercancía')

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title mb-0">
                        <i class="fas fa-truck-loading mr-2"></i>
                        Nueva Recepción de Mercancía
                    </h3>
                </div>
                <form action="{{ route('admin.purchases.receptions.store') }}" method="POST" id="reception-form">
                    @csrf
                    <div class="card-body">
                        <!-- Información General -->
                        <div class="row">
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="invoice_search" class="required">Buscar Factura de Compra</label>
                                    <div class="input-group">
                                        <input type="text" id="invoice_search" class="form-control" 
                                               placeholder="Buscar por número, proveedor..." autocomplete="off">
                                        <button type="button" class="btn btn-outline-secondary" id="search_invoice_btn">
                                            <i class="fas fa-search"></i>
                                        </button>
                                        <button type="button" class="btn btn-outline-info" id="filter_invoice_btn" title="Filtros">
                                            <i class="fas fa-filter"></i>
                                        </button>
                                    </div>
                                    <input type="hidden" name="purchase_invoice_id" id="purchase_invoice_id" 
                                           value="{{ old('purchase_invoice_id') }}" required>
                                    <div id="invoice_search_results" class="dropdown-menu w-100" style="display: none; max-height: 300px; overflow-y: auto;">
                                        <!-- Resultados de búsqueda aparecerán aquí -->
                                    </div>
                                    @error('purchase_invoice_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="reception_date" class="required">Fecha de Recepción</label>
                                    <input type="date" name="reception_date" id="reception_date" 
                                           class="form-control @error('reception_date') is-invalid @enderror" 
                                           value="{{ old('reception_date', date('Y-m-d')) }}" required>
                                    @error('reception_date')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label for="reception_number">N° Recepción</label>
                                    <input type="text" name="reception_number" id="reception_number" 
                                           class="form-control @error('reception_number') is-invalid @enderror" 
                                           value="{{ old('reception_number') }}" readonly>
                                    @error('reception_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <!-- Información de la Factura -->
                        <div class="row" id="invoice-info" style="display: none;">
                            <div class="col-12">
                                <div class="alert alert-info">
                                    <h6><i class="fas fa-file-invoice mr-1"></i> Información de la Factura</h6>
                                    <div class="row">
                                        <div class="col-md-3">
                                            <strong>Proveedor:</strong><br>
                                            <span id="invoice-supplier"></span>
                                        </div>
                                        <div class="col-md-3">
                                            <strong>Total Factura:</strong><br>
                                            <span id="invoice-total"></span>
                                        </div>
                                        <div class="col-md-3">
                                            <strong>Moneda:</strong><br>
                                            <span id="invoice-currency"></span>
                                        </div>
                                        <div class="col-md-3">
                                            <strong>Estado:</strong><br>
                                            <span id="invoice-status"></span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Almacén y Ubicación -->
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="warehouse_id" class="required">Almacén</label>
                                    <select name="warehouse_id" id="warehouse_id" 
                                            class="form-control @error('warehouse_id') is-invalid @enderror" required>
                                        <option value="">Seleccionar almacén...</option>
                                        @foreach($warehouses as $warehouse)
                                            <option value="{{ $warehouse->id }}">{{ $warehouse->name }}</option>
                                        @endforeach
                                    </select>
                                    @error('warehouse_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="location_id" class="required">Ubicación</label>
                                    <select name="location_id" id="location_id" 
                                            class="form-control @error('location_id') is-invalid @enderror" required>
                                        <option value="">Seleccionar ubicación...</option>
                                    </select>
                                    @error('location_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <!-- Productos -->
                        <div class="row">
                            <div class="col-12">
                                <h5><i class="fas fa-boxes mr-2"></i> Productos a Recibir</h5>
                                <div class="table-responsive">
                                    <table class="table table-bordered" id="products-table">
                                        <thead class="thead-dark">
                                            <tr>
                                                <th width="5%">#</th>
                                                <th width="20%">Producto</th>
                                                <th width="10%">Cant. Ordenada</th>
                                                <th width="10%">Cant. Recibida</th>
                                                <th width="10%">Cant. Pendiente</th>
                                                <th width="15%">Precio Unit.</th>
                                                <th width="15%">Total</th>
                                                <th width="10%">Estado</th>
                                                <th width="5%">Acciones</th>
                                            </tr>
                                        </thead>
                                        <tbody id="products-tbody">
                                            <!-- Los productos se cargarán dinámicamente -->
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

                        <!-- Resumen -->
                        <div class="row mt-4">
                            <div class="col-md-8"></div>
                            <div class="col-md-4">
                                <div class="card">
                                    <div class="card-body">
                                        <div class="row">
                                            <div class="col-6"><strong>Productos:</strong></div>
                                            <div class="col-6 text-right" id="products-count">0</div>
                                        </div>
                                        <div class="row">
                                            <div class="col-6"><strong>Cantidad Total:</strong></div>
                                            <div class="col-6 text-right" id="total-quantity">0</div>
                                        </div>
                                        <div class="row">
                                            <div class="col-6"><strong>Valor Total:</strong></div>
                                            <div class="col-6 text-right" id="total-value">$0.00</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Notas -->
                        <div class="row mt-4">
                            <div class="col-12">
                                <div class="form-group">
                                    <label for="general_notes">Notas de Recepción</label>
                                    <textarea name="general_notes" id="general_notes" rows="4" 
                                              class="form-control @error('general_notes') is-invalid @enderror" 
                                              placeholder="Observaciones sobre la recepción de mercancía...">{{ old('general_notes') }}</textarea>
                                    @error('general_notes')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card-footer">
                        <div class="row">
                            <div class="col-md-6">
                                <a href="{{ route('admin.purchases.receptions.index') }}" class="btn btn-secondary">
                                    <i class="fas fa-arrow-left mr-1"></i>
                                    Cancelar
                                </a>
                            </div>
                            <div class="col-md-6 text-right">
                                <button type="submit" class="btn btn-primary">
                                    <i class="fas fa-save mr-1"></i>
                                    Guardar Recepción
                                </button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- Modal de Búsqueda de Facturas -->
<div class="modal fade" id="invoiceSearchModal" tabindex="-1" role="dialog" aria-labelledby="invoiceSearchModalLabel">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="invoiceSearchModalLabel">
                    <i class="fas fa-search mr-2"></i>Buscar Factura de Compra
                </h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <!-- Barra de búsqueda -->
                <div class="row mb-3">
                    <div class="col-md-8">
                        <div class="form-group">
                            <label for="modal_search_query">Buscar</label>
                            <input type="text" id="modal_search_query" class="form-control" 
                                   placeholder="Buscar por número de factura, proveedor, contacto..." autocomplete="off">
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            <label for="modal_search_status">Estado</label>
                            <select id="modal_search_status" class="form-control">
                                <option value="received">Recibida</option>
                                <option value="processed">Procesada</option>
                                <option value="pending">Pendiente</option>
                            </select>
                        </div>
                    </div>
                </div>
                
                <!-- Filtros adicionales -->
                <div class="row mb-3">
                    <div class="col-md-4">
                        <div class="form-group">
                            <label for="modal_search_supplier">Proveedor</label>
                            <select id="modal_search_supplier" class="form-control">
                                <option value="">Todos los proveedores</option>
                                @foreach(\App\Models\Supplier::where('is_active', true)->orderBy('business_name')->get() as $supplier)
                                    <option value="{{ $supplier->id }}">{{ $supplier->business_name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            <label for="modal_search_date_from">Fecha Desde</label>
                            <input type="date" id="modal_search_date_from" class="form-control">
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            <label for="modal_search_date_to">Fecha Hasta</label>
                            <input type="date" id="modal_search_date_to" class="form-control">
                        </div>
                    </div>
                </div>
                
                <!-- Botones de acción -->
                <div class="row mb-3">
                    <div class="col-12">
                        <button type="button" class="btn btn-primary" id="modal_search_btn">
                            <i class="fas fa-search mr-1"></i>Buscar
                        </button>
                        <button type="button" class="btn btn-secondary" id="modal_clear_filters">
                            <i class="fas fa-times mr-1"></i>Limpiar Filtros
                        </button>
                        <span id="modal_search_loading" class="ml-2" style="display: none;">
                            <i class="fas fa-spinner fa-spin"></i> Buscando...
                        </span>
                    </div>
                </div>
                
                <!-- Lista de resultados -->
                <div class="row">
                    <div class="col-12">
                        <div class="card">
                            <div class="card-header">
                                <h6 class="mb-0">Resultados de Búsqueda</h6>
                            </div>
                            <div class="card-body p-0">
                                <div id="modal_search_results" style="max-height: 400px; overflow-y: auto;">
                                    <div class="text-center text-muted p-4">
                                        <i class="fas fa-search fa-2x mb-2"></i>
                                        <p>Ingrese criterios de búsqueda para encontrar facturas</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
            </div>
        </div>
    </div>
</div>

@push('scripts')
<script>
let productCounter = 0;

$(document).ready(function() {
    // Generar número de recepción automático
    generateReceptionNumber();

    // Mostrar información de la factura
    $('#purchase_invoice_id').on('change', function() {
        const option = $(this).find('option:selected');
        if (option.val()) {
            $('#invoice-supplier').text(option.data('supplier'));
            $('#invoice-total').text('$' + parseFloat(option.data('total')).toFixed(2));
            $('#invoice-currency').text(option.data('currency'));
            $('#invoice-status').text('Procesada');
            $('#invoice-info').show();
            
            // Cargar productos de la factura
            loadInvoiceProducts(option.val());
        } else {
            $('#invoice-info').hide();
            $('#products-tbody').empty();
            productCounter = 0;
            updateSummary();
        }
    });

    // Cargar ubicaciones por almacén
    $('#warehouse_id').on('change', function() {
        const warehouseId = $(this).val();
        if (warehouseId) {
            loadLocationsByWarehouse(warehouseId);
            // Actualizar warehouse_id en todos los productos existentes
            updateProductWarehouseIds(warehouseId);
        } else {
            $('#location_id').html('<option value="">Seleccionar ubicación...</option>');
        }
    });

    // Actualizar location_id cuando cambie
    $('#location_id').on('change', function() {
        const locationId = $(this).val();
        updateProductLocationIds(locationId);
    });

    // Actualizar resumen cuando cambien las cantidades
    $('#products-tbody').on('input', 'input[name*="quantity_received"]', function() {
        updateProductRow($(this).closest('tr'));
        updateSummary();
    });
});

function generateReceptionNumber() {
    const today = new Date();
    const year = today.getFullYear();
    const month = String(today.getMonth() + 1).padStart(2, '0');
    const day = String(today.getDate()).padStart(2, '0');
    const random = String(Math.floor(Math.random() * 1000)).padStart(3, '0');
    
    const receptionNumber = `REC-${year}${month}${day}-${random}`;
    $('#reception_number').val(receptionNumber);
}

function loadInvoiceProducts(invoiceId) {
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
    
    $.get('{{ route("admin.purchases.receptions.invoice-products") }}', {
        invoice_id: invoiceId
    }).done(function(products) {
        $('#products-tbody').empty();
        productCounter = 0;
        
        products.forEach(function(product) {
            addProductToTable(product);
        });
        
        updateSummary();
    }).fail(function(xhr, status, error) {
        console.error('Error al cargar productos:', xhr.responseText);
        alert('Error al cargar los productos de la factura: ' + (xhr.responseJSON?.message || error));
    });
}

function addProductToTable(product) {
    productCounter++;
    
    const pendingQuantity = product.quantity_ordered - product.quantity_received;
    const statusClass = pendingQuantity > 0 ? 'badge-warning' : 'badge-success';
    const statusText = pendingQuantity > 0 ? 'Pendiente' : 'Completado';

    const row = `
        <tr data-product-id="${product.product_id}">
            <td>${productCounter}</td>
            <td>
                <strong>${product.product.name}</strong><br>
                <small class="text-muted">${product.product.code}</small>
                <input type="hidden" name="products[${productCounter}][product_id]" value="${product.product_id}">
                <input type="hidden" name="products[${productCounter}][quantity_ordered]" value="${product.quantity_ordered}">
                <input type="hidden" name="products[${productCounter}][unit_price]" value="${product.unit_price}">
                <input type="hidden" name="products[${productCounter}][warehouse_id]" value="${$('#warehouse_id').val()}">
                <input type="hidden" name="products[${productCounter}][location_id]" value="${$('#location_id').val()}">
            </td>
            <td class="text-center">${product.quantity_ordered}</td>
            <td>
                <input type="number" name="products[${productCounter}][quantity_received]" 
                       class="form-control form-control-sm" 
                       value="${product.quantity_received}" 
                       min="0" max="${product.quantity_ordered}" required>
            </td>
            <td class="text-center pending-quantity">${pendingQuantity}</td>
            <td class="text-right">$${parseFloat(product.unit_price).toFixed(2)}</td>
            <td class="text-right total-price">$0.00</td>
            <td class="text-center">
                <span class="badge ${statusClass}">${statusText}</span>
            </td>
            <td class="text-center">
                <button type="button" class="btn btn-success btn-sm complete-product" title="Completar recepción">
                    <i class="fas fa-check"></i>
                </button>
            </td>
        </tr>
    `;

    $('#products-tbody').append(row);
}

function loadLocationsByWarehouse(warehouseId) {
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
    
    $.get('{{ route("admin.purchases.receptions.locations-by-warehouse") }}', {
        warehouse_id: warehouseId
    }).done(function(locations) {
        let html = '<option value="">Seleccionar ubicación...</option>';
        locations.forEach(function(location) {
            html += `<option value="${location.id}">${location.name}</option>`;
        });
        $('#location_id').html(html);
    }).fail(function(xhr, status, error) {
        console.error('Error al cargar ubicaciones:', xhr.responseText);
        alert('Error al cargar las ubicaciones: ' + (xhr.responseJSON?.message || error));
    });
}

function updateProductRow(row) {
    const quantityOrdered = parseInt(row.find('input[name*="quantity_ordered"]').val());
    const quantityReceived = parseInt(row.find('input[name*="quantity_received"]').val()) || 0;
    const unitPrice = parseFloat(row.find('input[name*="unit_price"]').val());
    
    const pendingQuantity = quantityOrdered - quantityReceived;
    const totalPrice = quantityReceived * unitPrice;
    
    row.find('.pending-quantity').text(pendingQuantity);
    row.find('.total-price').text('$' + totalPrice.toFixed(2));
    
    // Actualizar estado
    const statusBadge = row.find('.badge');
    if (pendingQuantity > 0) {
        statusBadge.removeClass('badge-success').addClass('badge-warning').text('Pendiente');
    } else {
        statusBadge.removeClass('badge-warning').addClass('badge-success').text('Completado');
    }
}

function updateSummary() {
    let productsCount = 0;
    let totalQuantity = 0;
    let totalValue = 0;
    
    $('#products-tbody tr').each(function() {
        const quantityReceived = parseInt($(this).find('input[name*="quantity_received"]').val()) || 0;
        const unitPrice = parseFloat($(this).find('input[name*="unit_price"]').val());
        
        if (quantityReceived > 0) {
            productsCount++;
            totalQuantity += quantityReceived;
            totalValue += quantityReceived * unitPrice;
        }
    });
    
    $('#products-count').text(productsCount);
    $('#total-quantity').text(totalQuantity);
    $('#total-value').text('$' + totalValue.toFixed(2));
}

// Actualizar warehouse_id en todos los productos
function updateProductWarehouseIds(warehouseId) {
    $('#products-tbody tr').each(function() {
        $(this).find('input[name*="warehouse_id"]').val(warehouseId);
    });
}

// Actualizar location_id en todos los productos
function updateProductLocationIds(locationId) {
    $('#products-tbody tr').each(function() {
        $(this).find('input[name*="location_id"]').val(locationId);
    });
}

// Completar recepción de producto
$(document).on('click', '.complete-product', function() {
    const row = $(this).closest('tr');
    const quantityOrdered = parseInt(row.find('input[name*="quantity_ordered"]').val());
    row.find('input[name*="quantity_received"]').val(quantityOrdered);
    updateProductRow(row);
    updateSummary();
});

// Validación del formulario
$('#reception-form').on('submit', function(e) {
    const productsCount = $('#products-tbody tr').length;
    if (productsCount === 0) {
        e.preventDefault();
        alert('Debe agregar al menos un producto');
        return false;
    }
    
    // Verificar que al menos un producto tenga cantidad recibida
    let hasReceivedProducts = false;
    let missingFields = [];
    
    $('#products-tbody tr').each(function() {
        const quantityReceived = parseInt($(this).find('input[name*="quantity_received"]').val()) || 0;
        const warehouseId = $(this).find('input[name*="warehouse_id"]').val();
        const locationId = $(this).find('input[name*="location_id"]').val();
        
        if (quantityReceived > 0) {
            hasReceivedProducts = true;
            
            // Verificar campos requeridos
            if (!warehouseId) {
                missingFields.push('almacén');
            }
            if (!locationId) {
                missingFields.push('ubicación');
            }
        }
    });
    
    if (!hasReceivedProducts) {
        e.preventDefault();
        alert('Debe recibir al menos un producto');
        return false;
    }
    
    if (missingFields.length > 0) {
        e.preventDefault();
        alert('Debe seleccionar ' + missingFields.join(' y ') + ' para todos los productos');
        return false;
    }
    
    // Verificar que se haya seleccionado una factura
    const invoiceId = $('#purchase_invoice_id').val();
    if (!invoiceId) {
        e.preventDefault();
        alert('Debe seleccionar una factura de compra');
        return false;
    }
});

// === BUSCADOR DE FACTURAS CON MODAL ===

// Abrir modal de búsqueda
$('#search_invoice_btn').on('click', function() {
    $('#invoiceSearchModal').modal('show');
    // Limpiar resultados anteriores
    $('#modal_search_results').html(`
        <div class="text-center text-muted p-4">
            <i class="fas fa-search fa-2x mb-2"></i>
            <p>Ingrese criterios de búsqueda para encontrar facturas</p>
        </div>
    `);
});

// Búsqueda en tiempo real en el modal
$('#modal_search_query').on('input', function() {
    const query = $(this).val();
    if (query.length >= 2) {
        performModalSearch();
    } else {
        $('#modal_search_results').html(`
            <div class="text-center text-muted p-4">
                <i class="fas fa-search fa-2x mb-2"></i>
                <p>Ingrese al menos 2 caracteres para buscar</p>
            </div>
        `);
    }
});

// Botón de búsqueda en el modal
$('#modal_search_btn').on('click', function() {
    performModalSearch();
});

// Limpiar filtros
$('#modal_clear_filters').on('click', function() {
    $('#modal_search_query').val('');
    $('#modal_search_status').val('received');
    $('#modal_search_supplier').val('');
    $('#modal_search_date_from').val('');
    $('#modal_search_date_to').val('');
    $('#modal_search_results').html(`
        <div class="text-center text-muted p-4">
            <i class="fas fa-search fa-2x mb-2"></i>
            <p>Ingrese criterios de búsqueda para encontrar facturas</p>
        </div>
    `);
});

// Función de búsqueda en el modal
function performModalSearch() {
    const filters = {
        q: $('#modal_search_query').val(),
        supplier_id: $('#modal_search_supplier').val(),
        status: $('#modal_search_status').val(),
        date_from: $('#modal_search_date_from').val(),
        date_to: $('#modal_search_date_to').val()
    };
    
    // Mostrar loading
    $('#modal_search_loading').show();
    
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
    
    $.get('{{ route("admin.purchases.receptions.search-invoices") }}', filters)
        .done(function(invoices) {
            displayModalResults(invoices);
        })
        .fail(function(xhr, status, error) {
            console.error('Error al buscar facturas:', xhr.responseText);
            $('#modal_search_results').html(`
                <div class="text-center text-danger p-4">
                    <i class="fas fa-exclamation-triangle fa-2x mb-2"></i>
                    <p>Error al buscar facturas. Intente nuevamente.</p>
                </div>
            `);
        })
        .always(function() {
            $('#modal_search_loading').hide();
        });
}

// Mostrar resultados en el modal
function displayModalResults(invoices) {
    const resultsContainer = $('#modal_search_results');
    
    if (invoices.length === 0) {
        resultsContainer.html(`
            <div class="text-center text-muted p-4">
                <i class="fas fa-search fa-2x mb-2"></i>
                <p>No se encontraron facturas con los criterios especificados</p>
            </div>
        `);
        return;
    }
    
    let html = '';
    invoices.forEach(function(invoice) {
        const supplierName = invoice.supplier ? invoice.supplier.business_name : 'N/A';
        const totalFormatted = parseFloat(invoice.total_amount).toFixed(2);
        const invoiceDate = new Date(invoice.invoice_date).toLocaleDateString('es-ES');
        
        html += `
            <div class="list-group-item list-group-item-action invoice-option-modal" 
                 data-invoice-id="${invoice.id}" 
                 data-supplier="${supplierName}" 
                 data-total="${invoice.total_amount}" 
                 data-currency="${invoice.currency}"
                 style="cursor: pointer;">
                <div class="d-flex justify-content-between align-items-center">
                    <div class="flex-grow-1">
                        <div class="d-flex justify-content-between align-items-start">
                            <div>
                                <h6 class="mb-1 text-primary">${invoice.invoice_number}</h6>
                                <p class="mb-1 text-muted">${supplierName}</p>
                                <small class="text-muted">
                                    <i class="fas fa-calendar mr-1"></i>${invoiceDate}
                                    <span class="ml-3">
                                        <i class="fas fa-file-invoice mr-1"></i>${invoice.document_number || 'N/A'}
                                    </span>
                                </small>
                            </div>
                            <div class="text-right">
                                <h6 class="mb-1 text-success">$${totalFormatted} ${invoice.currency}</h6>
                                <span class="badge badge-${getStatusBadgeClass(invoice.status)}">${getStatusText(invoice.status)}</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        `;
    });
    
    resultsContainer.html(html);
    
    // Manejar selección en el modal
    $('.invoice-option-modal').on('click', function() {
        const invoiceId = $(this).data('invoice-id');
        const supplierName = $(this).data('supplier');
        const total = $(this).data('total');
        const currency = $(this).data('currency');
        const invoiceNumber = $(this).find('h6').first().text();
        
        // Cerrar modal
        $('#invoiceSearchModal').modal('hide');
        
        // Actualizar campos del formulario
        $('#purchase_invoice_id').val(invoiceId);
        $('#invoice_search').val(`${invoiceNumber} - ${supplierName}`);
        
        // Mostrar información de la factura
        $('#invoice-supplier').text(supplierName);
        $('#invoice-total').text('$' + parseFloat(total).toFixed(2));
        $('#invoice-currency').text(currency);
        $('#invoice-status').text('Procesada');
        $('#invoice-info').show();
        
        // Cargar productos de la factura
        loadInvoiceProducts(invoiceId);
    });
}

// Funciones auxiliares para el estado
function getStatusBadgeClass(status) {
    switch(status) {
        case 'received': return 'warning';
        case 'processed': return 'success';
        case 'pending': return 'info';
        default: return 'secondary';
    }
}

function getStatusText(status) {
    switch(status) {
        case 'received': return 'Recibida';
        case 'processed': return 'Procesada';
        case 'pending': return 'Pendiente';
        default: return status;
    }
}

// Cargar factura inicial si viene por parámetro
@if(isset($purchaseInvoice) && $purchaseInvoice)
    $(document).ready(function() {
        const invoiceId = {{ $purchaseInvoice->id }};
        const invoice = @json($purchaseInvoice);
        
        if (invoice) {
            $('#purchase_invoice_id').val(invoiceId);
            $('#invoice_search').val(`${invoice.invoice_number} - ${invoice.supplier ? invoice.supplier.business_name : 'N/A'}`);
            
            // Mostrar información de la factura
            $('#invoice-supplier').text(invoice.supplier ? invoice.supplier.business_name : 'N/A');
            $('#invoice-total').text('$' + parseFloat(invoice.total_amount).toFixed(2));
            $('#invoice-currency').text(invoice.currency);
            $('#invoice-status').text('Procesada');
            $('#invoice-info').show();
            
            // Cargar productos de la factura
            loadInvoiceProducts(invoiceId);
        }
    });
@endif
</script>
@endpush
@endsection