@extends('layouts.app')

@section('title', 'Editar Orden de Compra')

@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-edit mr-2"></i>
                        Editar Orden de Compra
                    </h3>
                </div>
                <form action="{{ route('admin.purchases.orders.update', $purchaseOrder) }}" method="POST" id="order-form">
                    @csrf
                    @method('PUT')
                    <div class="card-body">
                        <!-- Información General -->
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="supplier_id" class="required">Proveedor</label>
                                    <select name="supplier_id" id="supplier_id" class="form-control @error('supplier_id') is-invalid @enderror" required>
                                        <option value="">Seleccionar proveedor...</option>
                                        @foreach($suppliers as $supplier)
                                            <option value="{{ $supplier->id }}" 
                                                    {{ old('supplier_id', $purchaseOrder->supplier_id) == $supplier->id ? 'selected' : '' }}
                                                    data-business-name="{{ $supplier->business_name }}"
                                                    data-contact-name="{{ $supplier->contact_person }}"
                                                    data-email="{{ $supplier->email }}"
                                                    data-phone="{{ $supplier->phone }}"
                                                    data-address="{{ $supplier->address }}">
                                                {{ $supplier->business_name }} - {{ $supplier->contact_person }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('supplier_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="order_number" class="required">N° Orden</label>
                                    <input type="text" name="order_number" id="order_number" 
                                           class="form-control @error('order_number') is-invalid @enderror" 
                                           value="{{ old('order_number', $purchaseOrder->order_number) }}" required readonly>
                                    @error('order_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <!-- Información del Proveedor -->
                        <div class="row" id="supplier-info" style="display: none;">
                            <div class="col-12">
                                <div class="alert alert-info">
                                    <h6><i class="fas fa-building mr-1"></i> Información del Proveedor</h6>
                                    <div class="row">
                                        <div class="col-md-3">
                                            <strong>Empresa:</strong><br>
                                            <span id="supplier-business-name"></span>
                                        </div>
                                        <div class="col-md-3">
                                            <strong>Contacto:</strong><br>
                                            <span id="supplier-contact-name"></span>
                                        </div>
                                        <div class="col-md-3">
                                            <strong>Email:</strong><br>
                                            <span id="supplier-email"></span>
                                        </div>
                                        <div class="col-md-3">
                                            <strong>Teléfono:</strong><br>
                                            <span id="supplier-phone"></span>
                                        </div>
                                    </div>
                                    <div class="row mt-2">
                                        <div class="col-md-6">
                                            <strong>Dirección:</strong><br>
                                            <span id="supplier-address"></span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Información de la Orden -->
                        <div class="row">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="order_date" class="required">Fecha de Orden</label>
                                    <input type="date" name="order_date" id="order_date" 
                                           class="form-control @error('order_date') is-invalid @enderror" 
                                           value="{{ old('order_date', $purchaseOrder->order_date ? $purchaseOrder->order_date->format('Y-m-d') : '') }}" required>
                                    @error('order_date')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="expected_delivery_date">Fecha Esperada de Entrega</label>
                                    <input type="date" name="expected_delivery_date" id="expected_delivery_date" 
                                           class="form-control @error('expected_delivery_date') is-invalid @enderror" 
                                           value="{{ old('expected_delivery_date', $purchaseOrder->expected_delivery_date ? $purchaseOrder->expected_delivery_date->format('Y-m-d') : '') }}">
                                    @error('expected_delivery_date')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="currency" class="required">Moneda</label>
                                    <select name="currency" id="currency" class="form-control @error('currency') is-invalid @enderror" required>
                                        <option value="USD" {{ old('currency', $purchaseOrder->currency) == 'USD' ? 'selected' : '' }}>USD - Dólar Americano</option>
                                        <option value="EUR" {{ old('currency', $purchaseOrder->currency) == 'EUR' ? 'selected' : '' }}>EUR - Euro</option>
                                        <option value="COP" {{ old('currency', $purchaseOrder->currency) == 'COP' ? 'selected' : '' }}>COP - Peso Colombiano</option>
                                        <option value="VES" {{ old('currency', $purchaseOrder->currency) == 'VES' ? 'selected' : '' }}>VES - Bolívar Venezolano</option>
                                    </select>
                                    @error('currency')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="exchange_rate" class="required">Tasa de Cambio</label>
                                    <input type="number" name="exchange_rate" id="exchange_rate" 
                                           class="form-control @error('exchange_rate') is-invalid @enderror" 
                                           value="{{ old('exchange_rate', $purchaseOrder->exchange_rate) }}" step="0.0001" min="0" required>
                                    @error('exchange_rate')
                                        <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</h5>
                                <div class="table-responsive">
                                    <table class="table table-bordered" id="products-table">
                                        <thead class="thead-dark">
                                            <tr>
                                                <th width="5%">#</th>
                                                <th width="25%">Producto</th>
                                                <th width="10%">Cantidad</th>
                                                <th width="15%">Precio Unit.</th>
                                                <th width="15%">Total</th>
                                                <th width="20%">Notas</th>
                                                <th width="10%">Acciones</th>
                                            </tr>
                                        </thead>
                                        <tbody id="products-tbody">
                                            @foreach($purchaseOrder->details as $index => $detail)
                                                <tr data-product-id="{{ $detail->product_id }}">
                                                    <td>{{ $index + 1 }}</td>
                                                    <td>
                                                        <strong>{{ $detail->product->name }}</strong><br>
                                                        <small class="text-muted">{{ $detail->product->code }}</small>
                                                        <input type="hidden" name="products[{{ $index + 1 }}][product_id]" value="{{ $detail->product_id }}">
                                                    </td>
                                                    <td>
                                                        <input type="number" name="products[{{ $index + 1 }}][quantity_ordered]" 
                                                               class="form-control form-control-sm" 
                                                               value="{{ $detail->quantity_ordered }}" min="1" required>
                                                    </td>
                                                    <td>
                                                        <input type="number" name="products[{{ $index + 1 }}][unit_price]" 
                                                               class="form-control form-control-sm" 
                                                               value="{{ $detail->unit_price }}" step="0.01" min="0" required>
                                                    </td>
                                                    <td class="total-price">{{ number_format($detail->total_price, 2) }}</td>
                                                    <td>
                                                        <input type="text" name="products[{{ $index + 1 }}][notes]" 
                                                               class="form-control form-control-sm" 
                                                               value="{{ $detail->notes }}">
                                                    </td>
                                                    <td>
                                                        <button type="button" class="btn btn-danger btn-sm remove-product">
                                                            <i class="fas fa-trash"></i>
                                                        </button>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                                <button type="button" class="btn btn-success btn-sm" id="add-product">
                                    <i class="fas fa-plus mr-1"></i>
                                    Agregar Producto
                                </button>
                            </div>
                        </div>

                        <!-- Totales -->
                        <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>Subtotal:</strong></div>
                                            <div class="col-6 text-right" id="subtotal-display">${{ number_format($purchaseOrder->subtotal, 2) }}</div>
                                        </div>
                                        <div class="row">
                                            <div class="col-6"><strong>Impuestos:</strong></div>
                                            <div class="col-6 text-right" id="tax-display">${{ number_format($purchaseOrder->tax_amount, 2) }}</div>
                                        </div>
                                        <hr>
                                        <div class="row">
                                            <div class="col-6"><strong>Total:</strong></div>
                                            <div class="col-6 text-right" id="total-display">${{ number_format($purchaseOrder->total_amount, 2) }}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Notas -->
                        <div class="row mt-4">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="notes">Notas</label>
                                    <textarea name="notes" id="notes" rows="3" 
                                              class="form-control @error('notes') is-invalid @enderror">{{ old('notes', $purchaseOrder->notes) }}</textarea>
                                    @error('notes')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="terms_conditions">Términos y Condiciones</label>
                                    <textarea name="terms_conditions" id="terms_conditions" rows="3" 
                                              class="form-control @error('terms_conditions') is-invalid @enderror">{{ old('terms_conditions', $purchaseOrder->terms_conditions) }}</textarea>
                                    @error('terms_conditions')
                                        <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.orders.show', $purchaseOrder) }}" 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>
                                    Actualizar Orden
                                </button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- Modal para buscar productos -->
<div class="modal fade" id="product-search-modal" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Buscar Producto</h5>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="form-group">
                    <input type="text" id="product-search" class="form-control" placeholder="Buscar por nombre, código o código de barras...">
                </div>
                <div id="product-search-results"></div>
            </div>
        </div>
    </div>
</div>

@push('scripts')
<script>
let productCounter = {{ $purchaseOrder->details->count() }};
let selectedProducts = {!! json_encode($purchaseOrder->details->pluck('product_id')->toArray()) !!};

$(document).ready(function() {
    // Mostrar información del proveedor
    $('#supplier_id').on('change', function() {
        const option = $(this).find('option:selected');
        if (option.val()) {
            $('#supplier-business-name').text(option.data('business-name'));
            $('#supplier-contact-name').text(option.data('contact-name'));
            $('#supplier-email').text(option.data('email'));
            $('#supplier-phone').text(option.data('phone'));
            $('#supplier-address').text(option.data('address'));
            $('#supplier-info').show();
        } else {
            $('#supplier-info').hide();
        }
    });

    // Mostrar información del proveedor actual
    if ($('#supplier_id').val()) {
        $('#supplier_id').trigger('change');
    }

    // Agregar producto
    $('#add-product').on('click', function() {
        $('#product-search-modal').modal('show');
    });

    // Búsqueda de productos
    $('#product-search').on('input', function() {
        const query = $(this).val();
        if (query.length >= 2) {
            searchProducts(query);
        }
    });

    // Calcular totales
    $('#products-tbody').on('input', 'input[name*="quantity"], input[name*="unit_price"]', calculateTotals);
});

function searchProducts(query) {
    $.get('{{ route("admin.purchases.orders.search-products") }}', {
        q: query
    }).done(function(products) {
        let html = '';
        if (products.length > 0) {
            products.forEach(function(product) {
                html += `
                    <div class="product-item border p-2 mb-2 cursor-pointer" data-product='${JSON.stringify(product)}'>
                        <div class="row">
                            <div class="col-md-6">
                                <strong>${product.name}</strong><br>
                                <small class="text-muted">Código: ${product.code}</small>
                            </div>
                            <div class="col-md-3">
                                <small>Precio Compra: $${parseFloat(product.purchase_price).toFixed(2)}</small>
                            </div>
                            <div class="col-md-3 text-right">
                                <button type="button" class="btn btn-sm btn-primary add-product-btn">
                                    Agregar
                                </button>
                            </div>
                        </div>
                    </div>
                `;
            });
        } else {
            html = '<p class="text-muted">No se encontraron productos</p>';
        }
        $('#product-search-results').html(html);
    });
}

$(document).on('click', '.add-product-btn', function() {
    const productItem = $(this).closest('.product-item');
    const product = productItem.data('product');
    addProductToTable(product);
    $('#product-search-modal').modal('hide');
    $('#product-search').val('');
    $('#product-search-results').empty();
});

function addProductToTable(product) {
    if (selectedProducts.includes(product.id)) {
        alert('Este producto ya está agregado');
        return;
    }

    selectedProducts.push(product.id);
    productCounter++;

    const row = `
        <tr data-product-id="${product.id}">
            <td>${productCounter}</td>
            <td>
                <strong>${product.name}</strong><br>
                <small class="text-muted">${product.code}</small>
                <input type="hidden" name="products[${productCounter}][product_id]" value="${product.id}">
            </td>
            <td>
                <input type="number" name="products[${productCounter}][quantity_ordered]" 
                       class="form-control form-control-sm" value="1" min="1" required>
            </td>
            <td>
                <input type="number" name="products[${productCounter}][unit_price]" 
                       class="form-control form-control-sm" value="${product.purchase_price}" 
                       step="0.01" min="0" required>
            </td>
            <td class="total-price">$0.00</td>
            <td>
                <input type="text" name="products[${productCounter}][notes]" 
                       class="form-control form-control-sm">
            </td>
            <td>
                <button type="button" class="btn btn-danger btn-sm remove-product">
                    <i class="fas fa-trash"></i>
                </button>
            </td>
        </tr>
    `;

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

$(document).on('click', '.remove-product', function() {
    const row = $(this).closest('tr');
    const productId = parseInt(row.data('product-id'));
    selectedProducts = selectedProducts.filter(id => id !== productId);
    row.remove();
    calculateTotals();
});

function calculateTotals() {
    let subtotal = 0;
    
    $('#products-tbody tr').each(function() {
        const quantity = parseFloat($(this).find('input[name*="quantity_ordered"]').val()) || 0;
        const unitPrice = parseFloat($(this).find('input[name*="unit_price"]').val()) || 0;
        const total = quantity * unitPrice;
        subtotal += total;
        $(this).find('.total-price').text('$' + total.toFixed(2));
    });

    const taxRate = 0.16; // 16% IVA
    const taxAmount = subtotal * taxRate;
    const total = subtotal + taxAmount;

    $('#subtotal-display').text('$' + subtotal.toFixed(2));
    $('#tax-display').text('$' + taxAmount.toFixed(2));
    $('#total-display').text('$' + total.toFixed(2));
}

// Validación del formulario
$('#order-form').on('submit', function(e) {
    if (selectedProducts.length === 0) {
        e.preventDefault();
        alert('Debe agregar al menos un producto');
        return false;
    }
});
</script>
@endpush
@endsection