@extends('layouts.admin')

@section('title', 'Edit price list — '.config('app.name'))
@section('page_title', 'Edit '.$list->code)

@section('breadcrumbs')
    <li class="breadcrumb-item"><a href="{{ route('admin.price-lists.index') }}">Price lists</a></li>
    <li class="breadcrumb-item active">{{ $list->code }}</li>
@endsection

@section('content')
    <form method="post" action="{{ route('admin.price-lists.update', $list->code) }}">
        @csrf
        @method('PUT')

        <div class="card mb-3">
            <div class="card-header">
                <h5 class="mb-0">{{ $list->code }} list settings</h5>
                <p class="text-muted small mb-0">Partners in mapped countries see these prices. {{ $list->currency_code }} · SI {{ $list->currency?->format((float) $list->si_price) ?? $list->si_price }}/hr</p>
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-3">
                        <label class="form-label">Currency</label>
                        <select class="form-select" name="currency_code" required>
                            @foreach ($currencies as $currency)
                                <option value="{{ $currency->code }}" @selected(old('currency_code', $list->currency_code) === $currency->code)>{{ $currency->code }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-3">
                        <label class="form-label">Rate</label>
                        <input class="form-control" name="rate" type="number" step="0.0001" value="{{ old('rate', $list->rate) }}" required>
                    </div>
                    <div class="col-md-3">
                        <label class="form-label">SI price</label>
                        <input class="form-control" name="si_price" type="number" step="0.01" value="{{ old('si_price', $list->si_price) }}" required>
                    </div>
                    <div class="col-md-3 d-flex align-items-end">
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" name="is_active" value="1" id="is_active" @checked(old('is_active', $list->is_active))>
                            <label class="form-check-label" for="is_active">Active</label>
                        </div>
                    </div>
                </div>

                <hr class="my-4">
                <h6>Assign country</h6>
                <div class="row g-3">
                    <div class="col-md-6">
                        <label class="form-label">Country</label>
                        <input class="form-control" name="country" value="{{ old('country') }}" placeholder="Canada">
                    </div>
                    <div class="col-md-6">
                        <label class="form-label">Price list for country</label>
                        <input class="form-control" name="country_price_list" value="{{ old('country_price_list', $list->code) }}">
                    </div>
                </div>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header price-edit-head">
                <div>
                    <h5 class="mb-0">Perpetual licenses</h5>
                    <p class="text-muted small mb-0">One-time license fee on this list. Same product can appear more than once when Sage 300 lines differ.</p>
                </div>
                <input class="form-control form-control-sm price-edit-filter" type="search" placeholder="Filter perpetual…" data-price-filter="perpetual" autocomplete="off">
            </div>
            <div class="card-body p-0">
                <div class="table-responsive">
                    <table class="table table-sm mb-0 price-edit-table" data-price-table="perpetual">
                        <thead>
                            <tr>
                                <th>Product</th>
                                <th>Code</th>
                                <th>Sage 300</th>
                                <th class="text-end">License fee</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse ($perpetualRows as $row)
                                <tr>
                                    <td>
                                        <strong>{{ $row->name }}</strong>
                                        @if ($row->line2 !== '')
                                            <div class="text-muted small">{{ $row->line2 }}</div>
                                        @endif
                                    </td>
                                    <td class="text-nowrap">{{ $row->code !== '' ? $row->code : '—' }}</td>
                                    <td class="text-nowrap">{{ $row->sage }}</td>
                                    <td class="text-end" style="width:160px">
                                        <input
                                            class="form-control form-control-sm text-end"
                                            name="perpetual_prices[{{ $row->id }}]"
                                            type="number"
                                            step="0.01"
                                            min="0"
                                            value="{{ old('perpetual_prices.'.$row->id, $row->price) }}"
                                            aria-label="License fee for {{ $row->name }} {{ $row->sage }}"
                                        >
                                    </td>
                                </tr>
                            @empty
                                <tr><td colspan="4" class="text-muted p-3">No perpetual SKUs published.</td></tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-header price-edit-head">
                <div>
                    <h5 class="mb-0">Subscriptions</h5>
                    <p class="text-muted small mb-0">Annual fee on this list. Look for names that include Subscription, for example AR-AP Settlements Subscription.</p>
                </div>
                <input class="form-control form-control-sm price-edit-filter" type="search" placeholder="Filter subscriptions…" data-price-filter="subscription" autocomplete="off">
            </div>
            <div class="card-body p-0">
                <div class="table-responsive">
                    <table class="table table-sm mb-0 price-edit-table" data-price-table="subscription">
                        <thead>
                            <tr>
                                <th>Product</th>
                                <th>Code</th>
                                <th>Sage 300</th>
                                <th class="text-end">Annual fee</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse ($subscriptionRows as $row)
                                <tr>
                                    <td>
                                        <strong>{{ $row->name }}</strong>
                                        @if ($row->line2 !== '')
                                            <div class="text-muted small">{{ $row->line2 }}</div>
                                        @endif
                                    </td>
                                    <td class="text-nowrap">{{ $row->code !== '' ? $row->code : '—' }}</td>
                                    <td class="text-nowrap">{{ $row->sage }}</td>
                                    <td class="text-end" style="width:160px">
                                        <input
                                            class="form-control form-control-sm text-end"
                                            name="subscription_prices[{{ $row->id }}]"
                                            type="number"
                                            step="0.01"
                                            min="0"
                                            value="{{ old('subscription_prices.'.$row->id, $row->price) }}"
                                            aria-label="Annual fee for {{ $row->name }} {{ $row->sage }}"
                                        >
                                    </td>
                                </tr>
                            @empty
                                <tr><td colspan="4" class="text-muted p-3">No subscription SKUs published.</td></tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <div class="d-flex gap-2 mb-4">
            <button class="btn btn-primary" type="submit">Save prices</button>
            <a class="btn btn-outline-secondary" href="{{ route('admin.price-lists.index') }}">Back</a>
        </div>
    </form>
@endsection

@push('styles')
    <style>
        .price-edit-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; }
        .price-edit-filter { max-width:260px; }
        .price-edit-table thead th { position:sticky; top:0; background:#fff; z-index:1; }
        .price-edit-table tbody tr[hidden] { display:none; }
        @media (max-width: 760px) {
            .price-edit-filter { max-width:none; width:100%; }
        }
    </style>
@endpush

@push('scripts')
    <script>
        document.querySelectorAll('[data-price-filter]').forEach(function (input) {
            var table = document.querySelector('[data-price-table="' + input.getAttribute('data-price-filter') + '"]');
            if (!table) return;
            input.addEventListener('input', function () {
                var q = input.value.trim().toLowerCase();
                table.querySelectorAll('tbody tr').forEach(function (row) {
                    row.hidden = q !== '' && row.innerText.toLowerCase().indexOf(q) === -1;
                });
            });
        });
    </script>
@endpush