@extends('layouts.app')

@section('content')
    <div class="container py-4">
        <div class="card shadow-sm">
            <div class="card-header bg-white d-flex justify-content-between align-items-center">
                <h4 class="mb-0">Edit Sale Invoice {{ $sale->invoice_no }}</h4>
                <a href="{{ route('sales.show', $sale) }}" class="btn btn-outline-secondary btn-sm">Cancel</a>
            </div>
            <div class="card-body">
                @if ($errors->any())
                    <div class="alert alert-danger"><ul class="mb-0">@foreach ($errors->all() as $error)<li>{{ $error }}</li>@endforeach</ul></div>
                @endif
                @if (session('error'))<div class="alert alert-danger">{{ session('error') }}</div>@endif

                <form action="{{ route('sales.update', $sale) }}" method="POST" id="editSaleForm">
                    @csrf
                    @method('PUT')

                    <div class="mb-4">
                        <label for="salesman_id" class="form-label fw-semibold">Salesman</label>
                        <select id="salesman_id" name="salesman_id" class="form-select">
                            <option value="">No salesman</option>
                            @foreach ($salesmen as $salesman)
                                <option value="{{ $salesman->id }}" @selected(old('salesman_id', $sale->salesman_id) == $salesman->id)>{{ $salesman->name }}</option>
                            @endforeach
                        </select>
                    </div>

                    <div class="table-responsive">
                        <table class="table table-bordered align-middle">
                            <thead class="table-light">
                                <tr><th>Product / Batch</th><th>Quantity</th><th>Free</th><th>Unit price</th><th>Commission</th><th>Line total</th><th></th></tr>
                            </thead>
                            <tbody id="sale-edit-rows">
                                @foreach ($sale->details as $detail)
                                    @php($unit = $detail->medicine?->unit ?: 'pcs')
                                    <tr class="sale-edit-row">
                                        <td>
                                            <input type="hidden" name="detail_id[]" value="{{ $detail->id }}">
                                            <div class="fw-semibold">{{ $detail->medicine?->name ?? 'Product' }} <span class="badge bg-light text-dark">{{ $unit }}</span></div>
                                            <small class="text-muted">Batch {{ $detail->batch_no }}</small>
                                        </td>
                                        <td><input type="number" name="quantity[]" class="form-control qty-field" min="0" step="{{ $unit === 'kg' ? '0.001' : '1' }}" value="{{ old('quantity.' . $loop->index, $detail->quantity) }}" required></td>
                                        <td><input type="number" name="free_quantity[]" class="form-control qty-field" min="0" step="{{ $unit === 'kg' ? '0.001' : '1' }}" value="{{ old('free_quantity.' . $loop->index, $detail->free_quantity ?? 0) }}"></td>
                                        <td><input type="number" name="selling_price[]" class="form-control price-field" min="0" step="0.01" value="{{ old('selling_price.' . $loop->index, $detail->selling_price) }}" required></td>
                                        <td><input type="number" name="commission[]" class="form-control commission-field" min="0" step="0.01" value="{{ old('commission.' . $loop->index, $detail->commission ?? 0) }}"></td>
                                        <td class="text-end line-total">{{ number_format((float) $detail->total_price, 2) }}</td>
                                        <td class="text-center"><button type="button" class="btn btn-outline-danger btn-sm remove-sale-line" title="Remove line" aria-label="Remove line"><i class="bi bi-trash3" aria-hidden="true"></i></button></td>
                                    </tr>
                                @endforeach
                            </tbody>
                            <tfoot><tr><th colspan="5" class="text-end">Invoice total after commission</th><th class="text-end" id="invoice-total">৳{{ number_format($sale->grand_total, 2) }}</th><th></th></tr></tfoot>
                        </table>
                    </div>

                    <button type="submit" class="btn btn-primary">Save Invoice Changes</button>
                    <a href="{{ route('sales.show', $sale) }}" class="btn btn-secondary">Cancel</a>
                </form>
            </div>
        </div>
    </div>
    <script>
        document.addEventListener('DOMContentLoaded', () => {
            const rows = document.getElementById('sale-edit-rows');
            const invoiceTotal = document.getElementById('invoice-total');

            function updateTotals() {
                let total = 0;
                rows.querySelectorAll('.sale-edit-row').forEach(row => {
                    const quantity = parseFloat(row.querySelector('[name="quantity[]"]').value) || 0;
                    const price = parseFloat(row.querySelector('[name="selling_price[]"]').value) || 0;
                    const commission = parseFloat(row.querySelector('[name="commission[]"]').value) || 0;
                    row.querySelector('.line-total').textContent = (quantity * price).toFixed(2);
                    total += Math.max(0, quantity * price - commission);
                });
                invoiceTotal.textContent = `৳${total.toFixed(2)}`;
            }

            rows.addEventListener('input', event => {
                if (event.target.matches('.qty-field, .price-field, .commission-field')) updateTotals();
            });
            rows.addEventListener('click', event => {
                const button = event.target.closest('.remove-sale-line');
                if (!button) return;
                if (rows.querySelectorAll('.sale-edit-row').length < 2) {
                    alert('An invoice must keep at least one item.');
                    return;
                }
                button.closest('.sale-edit-row').remove();
                updateTotals();
            });
        });
    </script>
@endsection