<?php $__env->startSection('content'); ?>
    <div class="d-flex justify-content-between align-items-center mb-3 flex-wrap gap-2">
        <h4 class="mb-0">Trade fairs</h4>
        <a href="<?php echo e(route('tradefairs.create')); ?>" class="btn btn-success">Add trade fair</a>
    </div>

    <div class="card shadow-sm mb-3">
        <div class="card-header fw-bold">Filter</div>
        <div class="card-body">
            <form method="GET" action="<?php echo e(route('tradefairs.index')); ?>" class="row g-2 align-items-end">
                <div class="col-md-3">
                    <label class="form-label small text-muted mb-0">Continent</label>
                    <select name="f_continent_id" id="filter_continent" class="form-select form-select-sm">
                        <option value="">All continents</option>
                        <?php $__currentLoopData = $continents; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $c): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <option value="<?php echo e($c->id); ?>" <?php echo e((string) request('f_continent_id') === (string) $c->id ? 'selected' : ''); ?>><?php echo e($c->name); ?></option>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    </select>
                </div>
                <div class="col-md-3">
                    <label class="form-label small text-muted mb-0">Country</label>
                    <select name="f_country_id" id="filter_country" class="form-select form-select-sm">
                        <option value="">All countries</option>
                        <?php $__currentLoopData = $filterCountries; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $c): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <option value="<?php echo e($c->id); ?>" <?php echo e((string) request('f_country_id') === (string) $c->id ? 'selected' : ''); ?>><?php echo e($c->name); ?></option>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    </select>
                </div>
                <div class="col-md-3">
                    <label class="form-label small text-muted mb-0">City</label>
                    <select name="f_city_id" id="filter_city" class="form-select form-select-sm">
                        <option value="">All cities</option>
                        <?php $__currentLoopData = $filterCities; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $ct): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <option value="<?php echo e($ct->id); ?>" <?php echo e((string) request('f_city_id') === (string) $ct->id ? 'selected' : ''); ?>><?php echo e($ct->name); ?></option>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    </select>
                </div>
                <div class="col-md-3 d-flex gap-2">
                    <button type="submit" class="btn btn-primary btn-sm">Apply</button>
                    <a href="<?php echo e(route('tradefairs.index')); ?>" class="btn btn-outline-secondary btn-sm">Reset</a>
                </div>
            </form>
        </div>
    </div>

    <div class="card shadow-sm">
        <div class="card-header fw-bold d-flex justify-content-between align-items-center">
            <span>Listing (<?php echo e($tradefairs->count()); ?>)</span>
        </div>
        <div class="card-body p-0 table-responsive">
            <table class="table table-sm table-hover mb-0 align-middle">
                <thead>
                <tr>
                    <th>Fair Name</th>
                    <th>Continent</th>
                    <th>Country</th>
                    <th>City</th>
                    <th>Start</th>
                    <th>End</th>
                    <th class="text-end">Actions</th>
                </tr>
                </thead>
                <tbody>
                <?php $__empty_1 = true; $__currentLoopData = $tradefairs; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $tf): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                    <tr>
                        <td><?php echo e($tf->fair_name); ?></td>
                        <td><?php echo e(optional($tf->fairContinent)->name ?: $tf->contient ?: '—'); ?></td>
                        <td><?php echo e(optional($tf->fairCountry)->name ?: $tf->country ?: '—'); ?></td>
                        <td><?php echo e($tf->eventvenue ?: '—'); ?></td>
                        <td class="small"><?php echo e(optional($tf->event_start_date)->format('Y-m-d') ?: '—'); ?></td>
                        <td class="small"><?php echo e(optional($tf->event_end_date)->format('Y-m-d') ?: '—'); ?></td>
                        <td class="text-end text-nowrap">
                            <a href="<?php echo e(route('tradefairs.edit', $tf)); ?>" class="btn btn-sm btn-outline-secondary">Edit</a>
                            <form method="POST" action="<?php echo e(route('tradefairs.destroy', $tf)); ?>" class="d-inline" onsubmit="return confirm('Delete this trade fair?');">
                                <?php echo csrf_field(); ?>
                                <?php echo method_field('DELETE'); ?>
                                <button type="submit" class="btn btn-sm btn-outline-danger">Delete</button>
                            </form>
                        </td>
                    </tr>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                    <tr><td colspan="7" class="text-center text-muted py-4">No trade fairs match the filters.</td></tr>
                <?php endif; ?>
                </tbody>
            </table>
        </div>
    </div>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
<script>
(function () {
    var countriesUrl = <?php echo json_encode(route('locations.countries-by-continent'), 15, 512) ?>;
    var citiesUrl = <?php echo json_encode(route('locations.cities-by-country'), 15, 512) ?>;

    function fillSelect(select, items, placeholder, selectedId) {
        select.innerHTML = '';
        var p = document.createElement('option');
        p.value = '';
        p.textContent = placeholder;
        select.appendChild(p);
        (items || []).forEach(function (row) {
            var o = document.createElement('option');
            o.value = row.id;
            o.textContent = row.name;
            if (selectedId && String(row.id) === String(selectedId)) o.selected = true;
            select.appendChild(o);
        });
    }

    function loadCountries(continentId, target, citySelect) {
        if (!continentId) {
            target.disabled = true;
            fillSelect(target, [], '— Select continent first —', null);
            if (citySelect) {
                citySelect.disabled = true;
                fillSelect(citySelect, [], '— Select country first —', null);
            }
            return;
        }
        target.disabled = true;
        fetch(countriesUrl + '?continent_id=' + encodeURIComponent(continentId), {
            headers: { 'Accept': 'application/json', 'X-Requested-With': 'XMLHttpRequest' }
        }).then(function (r) { return r.json(); }).then(function (rows) {
            target.disabled = false;
            fillSelect(target, rows, '— Select country —', null);
            if (citySelect) {
                citySelect.disabled = true;
                fillSelect(citySelect, [], '— Select country first —', null);
            }
        });
    }

    function loadCities(countryId, target) {
        if (!countryId) {
            target.disabled = true;
            fillSelect(target, [], '— Select country first —', null);
            return;
        }
        target.disabled = true;
        fetch(citiesUrl + '?country_id=' + encodeURIComponent(countryId), {
            headers: { 'Accept': 'application/json', 'X-Requested-With': 'XMLHttpRequest' }
        }).then(function (r) { return r.json(); }).then(function (rows) {
            target.disabled = false;
            fillSelect(target, rows, '— Select city —', null);
        });
    }

    var fC = document.getElementById('filter_continent');
    var fCo = document.getElementById('filter_country');
    var fCi = document.getElementById('filter_city');
    if (fC && fCo) {
        fC.addEventListener('change', function () {
            loadCountries(this.value, fCo, fCi);
        });
    }
    if (fCo && fCi) {
        fCo.addEventListener('change', function () {
            loadCities(this.value, fCi);
        });
    }
})();
</script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH D:\laragon\www\lt\resources\views/tradefairs/index.blade.php ENDPATH**/ ?>