@extends('layouts.adminlte')

@section('title', 'MASTER LOCATION GPS')
@section('page_title', 'MASTER LOCATION GPS')

@section('content')
<div class="card shadow-sm">
    <div class="card-header d-flex flex-wrap justify-content-between align-items-center gap-2">
        <div>
            <strong>Master Location GPS</strong>
            <div class="small text-muted">Batas akurasi berlaku per lokasi. Kosong = gunakan batas default aplikasi.</div>
        </div>
        <a href="{{ route('attendance_site_assignments.index') }}" class="btn btn-outline-secondary btn-sm">Penugasan Lokasi</a>
    </div>
    <div class="table-responsive">
        <table class="table table-hover align-middle mb-0">
            <thead class="table-light">
                <tr><th>Kode</th><th>Lokasi</th><th class="text-end">Radius</th><th style="min-width:240px">Batas Akurasi GPS</th><th>Status</th></tr>
            </thead>
            <tbody>
            @forelse($sites as $site)
                <tr data-site-id="{{ $site->id }}">
                    <td><code>{{ $site->code }}</code></td>
                    <td><strong>{{ $site->name }}</strong><div class="small text-muted">{{ $site->description }}</div></td>
                    <td class="text-end">{{ number_format((float) $site->radius_meter, 0, ',', '.') }} m</td>
                    <td>
                        <div class="input-group input-group-sm">
                            <input type="number" class="form-control gps-limit" min="1" max="10000" step="0.1" value="{{ $site->gps_accuracy_limit_meter }}" placeholder="Default aplikasi">
                            <span class="input-group-text">m</span>
                            <button type="button" class="btn btn-primary btn-save">Simpan</button>
                        </div>
                        <small class="text-muted">Safari/iOS GPS kasar: isi misalnya 3000. Kosongkan untuk default.</small>
                    </td>
                    <td><span class="badge {{ $site->is_active ? 'bg-success' : 'bg-secondary' }}">{{ $site->is_active ? 'Aktif' : 'Nonaktif' }}</span></td>
                </tr>
            @empty
                <tr><td colspan="5" class="text-center text-muted py-4">Master lokasi belum ada.</td></tr>
            @endforelse
            </tbody>
        </table>
    </div>
</div>
@endsection

@push('scripts')
<script>
document.querySelectorAll('.btn-save').forEach((button) => {
    button.addEventListener('click', async () => {
        const row = button.closest('tr');
        const input = row.querySelector('.gps-limit');
        button.disabled = true;
        try {
            const response = await fetch(`{{ url('/master-location-gps') }}/${row.dataset.siteId}`, {
                method: 'PUT',
                headers: {'Content-Type': 'application/json', 'Accept': 'application/json', 'X-CSRF-TOKEN': '{{ csrf_token() }}'},
                body: JSON.stringify({gps_accuracy_limit_meter: input.value || null}),
            });
            const data = await response.json();
            if (!response.ok) throw new Error(data.message || 'Gagal menyimpan.');
            Swal.fire({icon: 'success', title: 'Tersimpan', text: data.message, timer: 1300, showConfirmButton: false});
        } catch (error) {
            Swal.fire({icon: 'error', title: 'Gagal', text: error.message});
        } finally {
            button.disabled = false;
        }
    });
});
</script>
@endpush