@extends('admin.layouts.app')

@section('title', 'Create Purchase Return')
@section('page_title', 'Add Purchase Return')

@section('content')
<div class="card">
    <div class="card-header">
        <h5 class="mb-0">Create Purchase Return</h5>
    </div>
    <div class="card-body">
        <form action="{{ route('purchase-returns.store') }}" method="POST">
            @csrf
            <div class="row">
                <div class="col-md-4 mb-3">
                    <label class="form-label">Return No <span class="text-danger">*</span></label>
                    <input type="text" name="return_no" class="form-control @error('return_no') is-invalid @enderror" value="{{ old('return_no', $return_no) }}" required>
                    @error('return_no')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>
                <div class="col-md-4 mb-3">
                    <label class="form-label">Date <span class="text-danger">*</span></label>
                    <input type="date" name="date" class="form-control @error('date') is-invalid @enderror" value="{{ old('date', date('Y-m-d')) }}" required>
                    @error('date')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>
                <div class="col-md-4 mb-3">
                    <label class="form-label">Purchase Invoice <span class="text-danger">*</span></label>
                    <select name="purchase_id" class="form-select @error('purchase_id') is-invalid @enderror" required id="purchaseSelect">
                        <option value="">Select Purchase</option>
                        @foreach($purchases as $purchase)
                            <option value="{{ $purchase->id }}" data-supplier="{{ $purchase->supplier_id }}" data-shipment_number="{{ $purchase->shipment_number ?? '' }}" {{ old('purchase_id') == $purchase->id ? 'selected' : '' }}>
                                {{ $purchase->invoice_no }} - {{ $purchase->supplier->name ?? 'N/A' }}
                            </option>
                        @endforeach
                    </select>
                    @error('purchase_id')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>
            </div>
            <div class="row">
                <div class="col-md-4 mb-3">
                    <label class="form-label">Supplier</label>
                    <select name="supplier_id" class="form-select @error('supplier_id') is-invalid @enderror" required id="supplierSelect">
                        <option value="">Select Supplier</option>
                        @foreach($suppliers as $supplier)
                            <option value="{{ $supplier->id }}" {{ old('supplier_id') == $supplier->id ? 'selected' : '' }}>{{ $supplier->name }}</option>
                        @endforeach
                    </select>
                    @error('supplier_id')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>
                <div class="col-md-4 mb-3">
                    <label class="form-label">Shipment Number</label>
                    <input type="text" name="shipment_number" id="shipmentNumber" class="form-control @error('shipment_number') is-invalid @enderror" value="{{ old('shipment_number') }}" placeholder="Auto-filled from purchase invoice" readonly>
                    @error('shipment_number')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>
            </div>
             
            <hr>
            <h5>Return Items</h5>
            <div class="alert alert-info">
                <i class="fas fa-info-circle"></i> Select a purchase invoice above to load its products automatically.
            </div>
            <div class="table-responsive">
                <table class="table table-bordered" id="returnItemsTable">
                    <thead>
                        <tr>
                            <th>Product</th>
                            <th>Available Qty</th>
                            <th>Quantity</th>
                            <th>Rate</th>
                            <th>Amount</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody id="returnItemsBody">
                    </tbody>
                    <tfoot>
                        <tr>
                            <td colspan="4" class="text-end"><strong>Total:</strong></td>
                            <td><input type="number" name="total" id="totalAmount" class="form-control" step="0.01" value="0" readonly></td>
                            <td></td>
                        </tr>
                    </tfoot>
                </table>
            </div>
            
            <div class="mb-3">
                <label class="form-label">Reason</label>
                <textarea name="reason" class="form-control @error('reason') is-invalid @enderror" rows="3">{{ old('reason') }}</textarea>
                @error('reason')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
            
            <button type="submit" class="btn btn-primary">
                <i class="fas fa-save"></i> Save Return
            </button>
            <a href="{{ route('purchase-returns.index') }}" class="btn btn-secondary">Cancel</a>
        </form>
    </div>
</div>
@endsection

@section('scripts')
<script>
$(document).ready(function() {
    function calculateRowAmount(row) {
        var quantity = parseFloat(row.find('.quantity').val()) || 0;
        var rate = parseFloat(row.find('.rate').val()) || 0;
        var amount = quantity * rate;
        row.find('.amount').val(amount.toFixed(2));
        calculateTotal();
    }
    
    function calculateTotal() {
        var total = 0;
        $('.amount').each(function() {
            total += parseFloat($(this).val()) || 0;
        });
        $('#totalAmount').val(total.toFixed(2));
    }
    
    function loadPurchaseItems(purchaseId) {
        $('#returnItemsBody').empty();
        
        if (!purchaseId) {
            return;
        }
        
        $.ajax({
            url: '{{ url("/api/get-purchase-items") }}/' + purchaseId,
            type: 'GET',
            beforeSend: function() {
                $('#returnItemsBody').html('<tr><td colspan="6" class="text-center">Loading products...</td></tr>');
            },
            success: function(data) {
                $('#returnItemsBody').empty();
                
                if (data && data.length > 0) {
                    $.each(data, function(index, item) {
                        var row = `
                            <tr data-product-id="${item.id}">
                                <td>
                                    <input type="hidden" name="products[]" value="${item.id}">
                                    <strong>${item.name}</strong>
                                </td>
                                <td>
                                    <span class="badge bg-info">${item.quantity}</span>
                                </td>
                                <td>
                                    <input type="number" name="quantities[]" class="form-control quantity" step="0.01" value="1" max="${item.quantity}" required>
                                </td>
                                <td>
                                    <input type="number" name="rates[]" class="form-control rate" step="0.01" value="${item.rate}" required>
                                </td>
                                <td>
                                    <input type="number" class="form-control amount" step="0.01" value="${item.rate}" readonly>
                                </td>
                                <td>
                                    <button type="button" class="btn btn-danger btn-sm removeRow"><i class="fas fa-trash"></i></button>
                                </td>
                            </tr>
                        `;
                        $('#returnItemsBody').append(row);
                    });
                    calculateTotal();
                } else {
                    $('#returnItemsBody').html('<tr><td colspan="6" class="text-center">No products found for this purchase.</td></tr>');
                }
            },
            error: function(xhr, status, error) {
                console.log('Error:', error);
                $('#returnItemsBody').html('<tr><td colspan="6" class="text-center text-danger">Error loading products.</td></tr>');
            }
        });
    }
    
    $(document).on('input', '.quantity, .rate', function() {
        calculateRowAmount($(this).closest('tr'));
    });
    
    $('#purchaseSelect').change(function() {
        var selectedOption = $(this).find('option:selected');
        var supplierId = selectedOption.attr('data-supplier');
        var shipmentNumber = selectedOption.attr('data-shipment_number');
        
        if (supplierId) {
            $('#supplierSelect').val(supplierId);
        }
        
        if (shipmentNumber) {
            $('#shipmentNumber').val(shipmentNumber);
        } else {
            $('#shipmentNumber').val('');
        }
        
        loadPurchaseItems($(this).val());
    });
    
    // Trigger change on page load if purchase is pre-selected
    $('#purchaseSelect').trigger('change');
    
    $(document).on('click', '.removeRow', function() {
        $(this).closest('tr').remove();
        calculateTotal();
    });
});
</script>
@endsection