@php
    $isEdit = $invoice->exists;
    $items = old('items', $items);
@endphp

<x-app-layout>
    <form method="POST" action="{{ $isEdit ? route('invoicing.invoices.update', $invoice) : route('invoicing.invoices.store') }}" class="card app-card" id="invoice-builder" data-currencies="{{ json_encode(\App\Enums\Currency::options()) }}">
        @csrf
        @if ($isEdit)
            @method('PUT')
        @endif

        <div class="card-body">
            <div class="row g-3 mb-3">
                <div class="col-md-3">
                    <label class="form-label" for="invoice_number">Invoice no.</label>
                    <input
                        class="form-control"
                        type="text"
                        id="invoice_number"
                        value="{{ $number }}"
                        disabled
                        @unless ($isEdit)
                            data-sequence="{{ $setting->sequenceForFinancialYear() }}"
                            data-current-suffix="{{ \App\Support\FinancialYear::label() }}"
                            data-preview-url="{{ route('invoicing.invoices.next-number') }}"
                        @endunless
                    >
                    @unless ($isEdit)
                        <div class="form-text">Assigned on save for the invoice date’s financial year (1 Apr – 31 Mar), e.g. 2026-27/3.</div>
                    @endunless
                </div>
                <div class="col-md-3">
                    <label class="form-label" for="client_id">Client</label>
                    <select class="form-select @error('client_id') is-invalid @enderror" id="client_id" name="client_id" required>
                        <option value="">Select client</option>
                        @foreach ($clients as $client)
                            <option value="{{ $client->id }}" @selected((string) old('client_id', $invoice->client_id) === (string) $client->id)>{{ $client->company_name }}</option>
                        @endforeach
                    </select>
                    @error('client_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <div class="col-md-3">
                    <label class="form-label" for="kind">Billing type</label>
                    <select class="form-select @error('kind') is-invalid @enderror" id="kind" name="kind" required>
                        @foreach ($kinds as $kind)
                            <option value="{{ $kind->value }}" @selected(old('kind', $invoice->kind?->value) === $kind->value)>{{ $kind->label() }}</option>
                        @endforeach
                    </select>
                    @error('kind') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <div class="col-md-3" id="amc-contract-wrap">
                    <label class="form-label" for="amc_contract_id">AMC contract</label>
                    <select class="form-select @error('amc_contract_id') is-invalid @enderror" id="amc_contract_id" name="amc_contract_id">
                        <option value="">Select contract</option>
                        @foreach ($contracts as $contract)
                            <option
                                value="{{ $contract->id }}"
                                data-client="{{ $contract->client_id }}"
                                data-description="{{ $contract->service_name }} ({{ $contract->billing_frequency->label() }} AMC)"
                                data-amount="{{ $contract->periodAmount() }}"
                                @selected((string) old('amc_contract_id', $invoice->amc_contract_id) === (string) $contract->id)
                            >{{ $contract->client?->company_name }} — {{ $contract->service_name }}</option>
                        @endforeach
                    </select>
                    @error('amc_contract_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <div class="col-md-3">
                    <label class="form-label" for="purchase_order_id">Client PO / WO</label>
                    <select class="form-select @error('purchase_order_id') is-invalid @enderror" id="purchase_order_id" name="purchase_order_id">
                        <option value="">None</option>
                        @foreach ($purchaseOrders as $purchaseOrder)
                            <option
                                value="{{ $purchaseOrder->id }}"
                                data-client="{{ $purchaseOrder->client_id }}"
                                @selected((string) old('purchase_order_id', $invoice->purchase_order_id) === (string) $purchaseOrder->id)
                            >{{ $purchaseOrder->client?->company_name }} — {{ $purchaseOrder->optionLabel() }}</option>
                        @endforeach
                    </select>
                    @error('purchase_order_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    <div class="form-text">Optional. Saved POs for the selected client.</div>
                </div>
                <div class="col-md-3">
                    <label class="form-label" for="invoice_date">Invoice date</label>
                    <input class="form-control @error('invoice_date') is-invalid @enderror" type="date" id="invoice_date" name="invoice_date" value="{{ old('invoice_date', $invoice->invoice_date?->format('Y-m-d')) }}" required>
                    @error('invoice_date') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <div class="col-md-3">
                    <label class="form-label" for="due_date">Due date</label>
                    <input class="form-control @error('due_date') is-invalid @enderror" type="date" id="due_date" name="due_date" value="{{ old('due_date', $invoice->due_date?->format('Y-m-d')) }}" required>
                    @error('due_date') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <div class="col-md-3">
                    <label class="form-label" for="tax_rate_gst">GST %</label>
                    <input class="form-control @error('tax_rate_gst') is-invalid @enderror" type="number" step="0.01" min="0" max="100" id="tax_rate_gst" name="tax_rate_gst" value="{{ old('tax_rate_gst', $invoice->tax_rate_gst) }}" required>
                    @error('tax_rate_gst') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <div class="col-md-3">
                    <label class="form-label" for="status">Status</label>
                    <select class="form-select @error('status') is-invalid @enderror" id="status" name="status" required>
                        @foreach ($statuses as $status)
                            <option value="{{ $status->value }}" @selected(old('status', $invoice->status?->value) === $status->value)>{{ $status->label() }}</option>
                        @endforeach
                    </select>
                    @error('status') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <div class="col-md-3">
                    <label class="form-label" for="currency">Currency</label>
                    <select class="form-select @error('currency') is-invalid @enderror" id="currency" name="currency" required>
                        @foreach ($currencies as $currency)
                            <option value="{{ $currency->value }}" @selected(old('currency', $invoice->currency?->value ?? 'INR') === $currency->value)>{{ $currency->label() }}</option>
                        @endforeach
                    </select>
                    @error('currency') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <div class="col-md-3" id="exchange-rate-wrap">
                    <label class="form-label" for="exchange_rate">INR per 1 <span id="exchange-currency-code">USD</span></label>
                    <input class="form-control @error('exchange_rate') is-invalid @enderror" type="number" step="0.0001" min="0.0001" id="exchange_rate" name="exchange_rate" value="{{ old('exchange_rate', $invoice->exchange_rate ?? 1) }}">
                    <div class="form-text">Used only for dashboards and income posting.</div>
                    @error('exchange_rate') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
            </div>

            <div class="d-flex justify-content-between align-items-center mb-2">
                <h2 class="h6 mb-0">Line items</h2>
                <button type="button" class="btn btn-sm btn-outline-primary" id="add-item">
                    <i class="bi bi-plus-lg me-1"></i> Add line
                </button>
            </div>

            @error('items')
                <div class="alert alert-danger py-2">{{ $message }}</div>
            @enderror

            <div class="table-responsive">
                <table class="table align-middle" id="items-table">
                    <thead>
                        <tr>
                            <th>Description</th>
                            <th style="width: 8rem;">HSN/SAC</th>
                            <th style="width: 8rem;">Qty</th>
                            <th style="width: 10rem;">Unit price</th>
                            <th class="text-end" style="width: 10rem;">Amount</th>
                            <th style="width: 3rem;"></th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($items as $index => $item)
                            <tr class="item-row">
                                <td>
                                    <input class="form-control @error('items.'.$index.'.description') is-invalid @enderror" type="text" name="items[{{ $index }}][description]" value="{{ $item['description'] ?? '' }}" required>
                                </td>
                                <td>
                                    <input class="form-control @error('items.'.$index.'.hsn_code') is-invalid @enderror" type="text" name="items[{{ $index }}][hsn_code]" value="{{ $item['hsn_code'] ?? '' }}" maxlength="20" placeholder="Optional">
                                    @error('items.'.$index.'.hsn_code') <div class="invalid-feedback">{{ $message }}</div> @enderror
                                </td>
                                <td>
                                    <input class="form-control item-qty @error('items.'.$index.'.quantity') is-invalid @enderror" type="number" step="0.01" min="0.01" name="items[{{ $index }}][quantity]" value="{{ $item['quantity'] ?? 1 }}" required>
                                </td>
                                <td>
                                    <input class="form-control item-price @error('items.'.$index.'.unit_price') is-invalid @enderror" type="number" step="0.01" min="0" name="items[{{ $index }}][unit_price]" value="{{ $item['unit_price'] ?? '' }}" required>
                                </td>
                                <td class="text-end fw-semibold item-total">{{ money((float) ($item['quantity'] ?? 0) * (float) ($item['unit_price'] ?? 0)) }}</td>
                                <td>
                                    <button type="button" class="btn btn-sm btn-outline-danger remove-item" aria-label="Remove line">&times;</button>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                    <tfoot>
                        <tr>
                            <td colspan="4" class="text-end">Subtotal</td>
                            <td class="text-end" id="subtotal-display">{{ money(0) }}</td>
                            <td></td>
                        </tr>
                        <tr>
                            <td colspan="4" class="text-end">GST</td>
                            <td class="text-end" id="tax-display">{{ money(0) }}</td>
                            <td></td>
                        </tr>
                        <tr>
                            <td colspan="4" class="text-end"><strong>Total</strong></td>
                            <td class="text-end"><strong id="grand-display">{{ money(0, 2, old('currency', $invoice->currency?->value ?? 'INR')) }}</strong></td>
                            <td></td>
                        </tr>
                        <tr id="inr-equivalent-row">
                            <td colspan="4" class="text-end text-secondary">INR equivalent</td>
                            <td class="text-end text-secondary" id="inr-display">{{ money(0) }}</td>
                            <td></td>
                        </tr>
                    </tfoot>
                </table>
            </div>

            <div class="mt-3">
                @include('partials.gst-split', [
                    'igstRate' => $invoice->tax_rate_igst ?? $setting->igst_rate ?? 0,
                    'cgstRate' => $invoice->tax_rate_cgst ?? $setting->cgst_rate ?? 9,
                    'sgstRate' => $invoice->tax_rate_sgst ?? $setting->sgst_rate ?? 9,
                    'igstAmount' => $invoice->tax_amount_igst,
                    'cgstAmount' => $invoice->tax_amount_cgst,
                    'sgstAmount' => $invoice->tax_amount_sgst,
                    'currencySymbol' => $invoice->currencyEnum()->symbol(),
                    'help' => 'Calculated from the invoice subtotal using company defaults. You can override the % or the amount. Prints still show GST '.$setting->default_tax_rate.'% as a single line.',
                ])
            </div>

            <div class="mt-3">
                <label class="form-label" for="notes">Notes</label>
                <textarea class="form-control @error('notes') is-invalid @enderror" id="notes" name="notes" rows="3">{{ old('notes', $invoice->notes) }}</textarea>
                @error('notes') <div class="invalid-feedback">{{ $message }}</div> @enderror
            </div>
        </div>
        <div class="card-footer bg-white d-flex justify-content-end gap-2">
            <a href="{{ $isEdit ? route('invoicing.invoices.show', $invoice) : route('invoicing.invoices.index') }}" class="btn btn-light">Cancel</a>
            <button type="submit" class="btn btn-primary">{{ $isEdit ? 'Save invoice' : 'Create invoice' }}</button>
        </div>
    </form>

    <template id="item-row-template">
        <tr class="item-row">
            <td><input class="form-control" type="text" name="items[__INDEX__][description]" required></td>
            <td><input class="form-control" type="text" name="items[__INDEX__][hsn_code]" maxlength="20" placeholder="Optional"></td>
            <td><input class="form-control item-qty" type="number" step="0.01" min="0.01" name="items[__INDEX__][quantity]" value="1" required></td>
            <td><input class="form-control item-price" type="number" step="0.01" min="0" name="items[__INDEX__][unit_price]" required></td>
            <td class="text-end fw-semibold item-total">{{ money(0) }}</td>
            <td><button type="button" class="btn btn-sm btn-outline-danger remove-item" aria-label="Remove line">&times;</button></td>
        </tr>
    </template>

    @push('scripts')
        <script src="{{ asset('js/gst-split.js') }}?v={{ filemtime(public_path('js/gst-split.js')) }}"></script>
        <script src="{{ asset('js/invoice-builder.js') }}?v={{ filemtime(public_path('js/invoice-builder.js')) }}"></script>
    @endpush
</x-app-layout>