@extends('admin.layouts.master')
@section('title', $invoice->exists ? 'تعديل فاتورة' : 'فاتورة جديدة')

@section('page-header')
    <div class="row align-items-center">
        <div class="col"><div class="page-pretitle">الفواتير</div>
            <h2 class="page-title">{{ $invoice->exists ? 'تعديل: '.$invoice->invoice_no : 'فاتورة جديدة' }}</h2></div>
        <div class="col-auto"><a href="{{ route('admin.invoices.index') }}" class="btn btn-outline-secondary">العودة</a></div>
    </div>
@endsection

@section('content')
<form method="POST" action="{{ $invoice->exists ? route('admin.invoices.update', $invoice) : route('admin.invoices.store') }}">
    @csrf @if($invoice->exists) @method('PUT') @endif

    <div class="card"><div class="card-body"><div class="row g-3">
        <div class="col-md-3"><label class="form-label required">رقم الفاتورة</label>
            <input type="text" name="invoice_no" class="form-control" value="{{ old('invoice_no', $invoice->invoice_no) }}" required></div>
        <div class="col-md-4"><label class="form-label required">العميل</label>
            <select name="customer_id" class="form-select select2" required>
                <option value="">— اختر —</option>
                @foreach($customers as $c)<option value="{{ $c->id }}" {{ old('customer_id', $invoice->customer_id) == $c->id ? 'selected' : '' }}>{{ $c->name }}</option>@endforeach
            </select></div>
        <div class="col-md-2"><label class="form-label required">الفرع</label>
            <select name="branch_id" class="form-select" required>
                @foreach($branches as $b)<option value="{{ $b->id }}" {{ old('branch_id', $invoice->branch_id) == $b->id ? 'selected' : '' }}>{{ $b->name }}</option>@endforeach
            </select></div>
        <div class="col-md-3"><label class="form-label">رقم الطلب المرتبط</label>
            <input type="number" name="order_id" class="form-control" value="{{ old('order_id', $invoice->order_id) }}"></div>

        <div class="col-md-3"><label class="form-label required">تاريخ الفاتورة</label>
            <input type="date" name="invoice_date" class="form-control" value="{{ old('invoice_date', $invoice->invoice_date?->format('Y-m-d') ?? $invoice->invoice_date) }}" required></div>
        <div class="col-md-3"><label class="form-label">تاريخ الاستحقاق</label>
            <input type="date" name="due_date" class="form-control" value="{{ old('due_date', $invoice->due_date?->format('Y-m-d') ?? $invoice->due_date) }}"></div>
        <div class="col-md-2"><label class="form-label">الحالة</label>
            <select name="status" class="form-select">
                @foreach(['draft'=>'مسودة','issued'=>'مُصدرة','partial'=>'مدفوعة جزئياً','paid'=>'مدفوعة','cancelled'=>'ملغية'] as $k=>$v)
                    <option value="{{ $k }}" {{ old('status', $invoice->status ?? 'issued') === $k ? 'selected' : '' }}>{{ $v }}</option>
                @endforeach
            </select></div>
        <div class="col-md-2"><label class="form-label">الضريبة %</label>
            <input type="number" step="0.01" name="tax_percent" class="form-control" value="{{ old('tax_percent', $invoice->tax_percent ?? 14) }}"></div>
        <div class="col-md-2"><label class="form-label">الخصم</label>
            <input type="number" step="0.01" name="discount_amount" id="discount_amount" class="form-control" value="{{ old('discount_amount', $invoice->discount_amount ?? 0) }}"></div>
    </div></div></div>

    <div class="card mt-3">
        <div class="card-header d-flex justify-content-between">
            <h3 class="card-title">البنود</h3>
            <button type="button" class="btn btn-sm btn-success" onclick="addRow()"><i class="ti ti-plus ms-1"></i> بند</button>
        </div>
        <div class="table-responsive">
            <table class="table table-bordered mb-0">
                <thead class="bg-light"><tr>
                    <th>الوصف</th><th style="width:120px">الكمية</th><th style="width:140px">سعر الوحدة</th><th style="width:140px">الإجمالي</th><th style="width:50px"></th>
                </tr></thead>
                <tbody id="itemsBody">
                    @foreach($items as $idx => $line)
                    <tr>
                        <td><input type="text" name="items[{{ $idx }}][description]" class="form-control form-control-sm" value="{{ old("items.$idx.description", $line->description) }}" required></td>
                        <td><input type="number" step="0.01" name="items[{{ $idx }}][quantity]" class="form-control form-control-sm qty" value="{{ old("items.$idx.quantity", $line->quantity) }}" required></td>
                        <td><input type="number" step="0.0001" name="items[{{ $idx }}][unit_price]" class="form-control form-control-sm price" value="{{ old("items.$idx.unit_price", $line->unit_price) }}" required></td>
                        <td><input type="text" class="form-control form-control-sm total bg-light" value="{{ number_format($line->total_price, 2) }}" readonly></td>
                        <td><button type="button" class="btn btn-sm btn-outline-danger" onclick="removeRow(this)"><i class="ti ti-x"></i></button></td>
                    </tr>
                    @endforeach
                </tbody>
                <tfoot class="bg-light">
                    <tr><th colspan="3" class="text-end">الإجمالي:</th><th id="subtotal">0.00</th><th></th></tr>
                    <tr><th colspan="3" class="text-end">بعد الخصم:</th><th id="afterDiscount">0.00</th><th></th></tr>
                    <tr><th colspan="3" class="text-end">الضريبة:</th><th id="taxAmount">0.00</th><th></th></tr>
                    <tr class="bg-primary text-white"><th colspan="3" class="text-end">الإجمالي النهائي:</th><th id="grandTotal">0.00</th><th></th></tr>
                </tfoot>
            </table>
        </div>
    </div>

    <div class="card mt-3"><div class="card-body">
        <label class="form-label">ملاحظات</label>
        <textarea name="notes" class="form-control" rows="3">{{ old('notes', $invoice->notes) }}</textarea>
    </div>
    <div class="card-footer text-end">
        <a href="{{ route('admin.invoices.index') }}" class="btn btn-outline-secondary">إلغاء</a>
        <button class="btn btn-primary"><i class="ti ti-device-floppy ms-1"></i> حفظ الفاتورة</button>
    </div></div>
</form>
@endsection

@push('scripts')
<script>
let rowIdx = {{ $items->count() ?? 0 }};
function addRow() {
    const html = `<tr>
        <td><input type="text" name="items[${rowIdx}][description]" class="form-control form-control-sm" required></td>
        <td><input type="number" step="0.01" name="items[${rowIdx}][quantity]" class="form-control form-control-sm qty" value="1" required></td>
        <td><input type="number" step="0.0001" name="items[${rowIdx}][unit_price]" class="form-control form-control-sm price" value="0" required></td>
        <td><input type="text" class="form-control form-control-sm total bg-light" readonly></td>
        <td><button type="button" class="btn btn-sm btn-outline-danger" onclick="removeRow(this)"><i class="ti ti-x"></i></button></td>
    </tr>`;
    $('#itemsBody').append(html); rowIdx++; recalc();
}
function removeRow(b){ $(b).closest('tr').remove(); recalc(); }
function recalc(){
    let s=0;
    $('#itemsBody tr').each(function(){
        const q=parseFloat($(this).find('.qty').val())||0, p=parseFloat($(this).find('.price').val())||0;
        $(this).find('.total').val((q*p).toFixed(2)); s+=q*p;
    });
    const d=parseFloat($('#discount_amount').val())||0, t=parseFloat($('[name=tax_percent]').val())||0;
    const ad=Math.max(0,s-d), tax=ad*t/100;
    $('#subtotal').text(s.toFixed(2)); $('#afterDiscount').text(ad.toFixed(2));
    $('#taxAmount').text(tax.toFixed(2)); $('#grandTotal').text((ad+tax).toFixed(2));
}
$(document).on('input', '.qty, .price, [name=tax_percent], #discount_amount', recalc);
$(function(){ recalc(); if (!{{ $items->count() ?? 0 }}) addRow(); });
</script>
@endpush