<?php $__env->startSection('title', 'Pengaturan Absensi'); ?>
<?php $__env->startSection('page-title', 'Pengaturan Parameter Absensi'); ?>
<?php $__env->startSection('page-subtitle', 'Konfigurasi aturan jam operasional, radius geofencing, selfie camera, dan kebijakan toleransi presensi.'); ?>

<?php $__env->startPush('styles'); ?>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
<style>
    .settings-map-picker {
        height: 260px;
        width: 100%;
        border-radius: 0.75rem;
        z-index: 1;
    }
</style>
<?php $__env->stopPush(); ?>

<?php $__env->startSection('content'); ?>
<div class="row">
    <div class="col-12 col-xl-10 mx-auto">
        <div class="card shadow-sm border-0">
            <div class="card-header bg-white py-3 border-bottom">
                <h5 class="card-title mb-0 fw-bold"><i class="bi bi-sliders me-2 text-primary"></i> Parameter Kebijakan Presensi</h5>
            </div>
            <form action="<?php echo e(route('admin.settings.attendance.update')); ?>" method="POST">
                <?php echo csrf_field(); ?>
                <?php echo method_field('PUT'); ?>
                <div class="card-body p-4">
                    <div class="row g-4">
                        <div class="col-12">
                            <label class="form-label fw-bold">Nama Perusahaan / Organisasi</label>
                            <input type="text" name="company_name" class="form-control" value="<?php echo e($settings['company_name'] ?? 'PT Inovasi Digital Nusantara'); ?>" required>
                        </div>

                        
                        <div class="col-12">
                            <div class="p-3 bg-light rounded-3 border">
                                <h6 class="fw-bold text-primary mb-1"><i class="bi bi-geo-alt-fill me-1"></i> Pengaturan Lokasi & Radius Absensi</h6>
                                <p class="text-muted text-xs mb-3">Tentukan titik pusat kantor utama, batas radius meter absensi karyawan, dan toleransi akurasi GPS perangkat.</p>
                                
                                <div class="row g-3">
                                    <div class="col-md-6">
                                        <div class="mb-3">
                                            <label class="form-label fw-bold">Nama Lokasi Kantor Utama <span class="text-danger">*</span></label>
                                            <input type="text" name="office_name" class="form-control" value="<?php echo e($primaryOffice?->name ?? ($settings['office_name'] ?? 'Kantor Utama')); ?>" placeholder="Contoh: Kantor Utama" required>
                                        </div>
                                        <div class="row g-2 mb-3">
                                            <div class="col-6">
                                                <label class="form-label fw-bold">Latitude Kantor <span class="text-danger">*</span></label>
                                                <input type="text" name="office_latitude" id="officeLat" class="form-control font-monospace" value="<?php echo e($primaryOffice?->latitude ?? ($settings['office_latitude'] ?? '-6.225588')); ?>" oninput="updatePinFromInputs()" placeholder="-6.xxxxx" required>
                                            </div>
                                            <div class="col-6">
                                                <label class="form-label fw-bold">Longitude Kantor <span class="text-danger">*</span></label>
                                                <input type="text" name="office_longitude" id="officeLng" class="form-control font-monospace" value="<?php echo e($primaryOffice?->longitude ?? ($settings['office_longitude'] ?? '106.808560')); ?>" oninput="updatePinFromInputs()" placeholder="106.xxxxx" required>
                                            </div>
                                        </div>
                                        <div class="mb-3">
                                            <button type="button" class="btn btn-outline-primary btn-sm w-100" onclick="detectGPS()">
                                                <i class="bi bi-crosshair me-1"></i> Ambil Titik GPS Posisi Saya Saat Ini (Browser Geolocation)
                                            </button>
                                        </div>
                                        <div class="row g-2 mb-3">
                                            <div class="col-6">
                                                <label class="form-label fw-bold">Radius Absensi (m) <span class="text-danger">*</span></label>
                                                <input type="number" name="default_radius_meters" id="radiusInput" class="form-control" value="<?php echo e($primaryOffice?->radius_meters ?? ($settings['default_radius_meters'] ?? '150')); ?>" min="1" max="10000" oninput="updateCircleRadius()" required>
                                            </div>
                                            <div class="col-6">
                                                <label class="form-label fw-bold">Max Akurasi GPS (m) <span class="text-danger">*</span></label>
                                                <input type="number" name="max_gps_accuracy" class="form-control" value="<?php echo e($primaryOffice?->max_gps_accuracy ?? ($settings['max_gps_accuracy'] ?? '50')); ?>" min="5" max="500" required>
                                            </div>
                                        </div>
                                        <div class="d-flex gap-1 flex-wrap">
                                            <small class="text-muted me-1">Preset cepat radius:</small>
                                            <button type="button" class="btn btn-outline-secondary btn-sm py-0 px-2 text-xs" onclick="setRadiusPreset(10)">10m</button>
                                            <button type="button" class="btn btn-outline-secondary btn-sm py-0 px-2 text-xs" onclick="setRadiusPreset(30)">30m</button>
                                            <button type="button" class="btn btn-outline-secondary btn-sm py-0 px-2 text-xs" onclick="setRadiusPreset(50)">50m</button>
                                            <button type="button" class="btn btn-outline-secondary btn-sm py-0 px-2 text-xs" onclick="setRadiusPreset(100)">100m</button>
                                            <button type="button" class="btn btn-outline-secondary btn-sm py-0 px-2 text-xs" onclick="setRadiusPreset(150)">150m</button>
                                        </div>
                                    </div>

                                    
                                    <div class="col-md-6">
                                        <label class="form-label fw-bold d-block"><i class="bi bi-pin-map-fill text-danger me-1"></i> Titik Peta (Geser Pin ke Lokasi Kantor):</label>
                                        <div id="settingsMapPicker" class="settings-map-picker border shadow-sm mb-2"></div>
                                        <small class="text-muted text-xs d-block"><i class="bi bi-info-circle me-1"></i> Anda bisa <strong>menggeser pin merah</strong> atau <strong>mengklik langsung di peta</strong> untuk menentukan titik kantor dengan presisi.</small>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-md-6">
                            <label class="form-label fw-bold">Toleransi Keterlambatan Default (Menit)</label>
                            <input type="number" name="late_tolerance_minutes" class="form-control" value="<?php echo e($settings['late_tolerance_minutes'] ?? '10'); ?>" min="0" required>
                            <small class="text-muted">Menit keterlambatan yang masih ditoleransi sebagai "Hadir".</small>
                        </div>

                        <div class="col-md-6">
                            <label class="form-label fw-bold">Wajib Validasi Lokasi GPS</label>
                            <div class="form-check form-switch p-2 bg-light rounded-3">
                                <input class="form-check-input ms-0 me-3" type="checkbox" name="require_gps" value="true" id="requireGps" <?php echo e(($settings['require_gps'] ?? 'true') === 'true' ? 'checked' : ''); ?>>
                                <label class="form-check-label fw-bold" for="requireGps">
                                    Aktifkan Geofence GPS
                                    <small class="d-block text-muted fw-normal">Menolak absensi jika karyawan di luar radius kantor.</small>
                                </label>
                            </div>
                        </div>

                        <div class="col-md-6">
                            <label class="form-label fw-bold">Batas Awal Absen Masuk</label>
                            <input type="time" name="check_in_start_time" class="form-control" value="<?php echo e($settings['check_in_start_time'] ?? '06:00'); ?>" required>
                        </div>

                        <div class="col-md-6">
                            <label class="form-label fw-bold">Batas Akhir Absen Masuk</label>
                            <input type="time" name="check_in_end_time" class="form-control" value="<?php echo e($settings['check_in_end_time'] ?? '12:00'); ?>" required>
                        </div>

                        <div class="col-md-6">
                            <label class="form-label fw-bold">Batas Awal Absen Pulang</label>
                            <input type="time" name="check_out_start_time" class="form-control" value="<?php echo e($settings['check_out_start_time'] ?? '16:00'); ?>" required>
                        </div>

                        <div class="col-md-6">
                            <label class="form-label fw-bold">Batas Akhir Absen Pulang</label>
                            <input type="time" name="check_out_end_time" class="form-control" value="<?php echo e($settings['check_out_end_time'] ?? '23:59'); ?>" required>
                        </div>
                    </div>
                </div>
                <div class="card-footer bg-light p-3 text-end">
                    <button type="submit" class="btn btn-primary px-4">
                        <i class="bi bi-save me-1"></i> Simpan Pengaturan Absensi
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

<?php $__env->startPush('scripts'); ?>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script>
    let settingsMap = null;
    let settingsMarker = null;
    let settingsCircle = null;

    document.addEventListener('DOMContentLoaded', function() {
        initSettingsMap();
    });

    function initSettingsMap() {
        const lat = parseFloat(document.getElementById('officeLat').value.replace(',', '.').trim()) || -6.225588;
        const lng = parseFloat(document.getElementById('officeLng').value.replace(',', '.').trim()) || 106.808560;
        const rad = parseInt(document.getElementById('radiusInput').value) || 150;

        settingsMap = L.map('settingsMapPicker').setView([lat, lng], 16);
        L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(settingsMap);

        settingsMarker = L.marker([lat, lng], { draggable: true }).addTo(settingsMap);
        settingsCircle = L.circle([lat, lng], { color: '#435ebe', fillColor: '#435ebe', fillOpacity: 0.2, radius: rad }).addTo(settingsMap);

        settingsMarker.on('dragend', function(e) {
            const pos = e.target.getLatLng();
            document.getElementById('officeLat').value = pos.lat.toFixed(8);
            document.getElementById('officeLng').value = pos.lng.toFixed(8);
            settingsCircle.setLatLng(pos);
        });

        settingsMap.on('click', function(e) {
            settingsMarker.setLatLng(e.latlng);
            settingsCircle.setLatLng(e.latlng);
            document.getElementById('officeLat').value = e.latlng.lat.toFixed(8);
            document.getElementById('officeLng').value = e.latlng.lng.toFixed(8);
        });
    }

    function updatePinFromInputs() {
        const latVal = parseFloat(document.getElementById('officeLat').value.replace(',', '.').trim());
        const lngVal = parseFloat(document.getElementById('officeLng').value.replace(',', '.').trim());

        if (!isNaN(latVal) && !isNaN(lngVal) && settingsMarker && settingsCircle && settingsMap) {
            const pos = [latVal, lngVal];
            settingsMarker.setLatLng(pos);
            settingsCircle.setLatLng(pos);
            settingsMap.panTo(pos);
        }
    }

    function updateCircleRadius() {
        const radVal = parseInt(document.getElementById('radiusInput').value);
        if (!isNaN(radVal) && settingsCircle) {
            settingsCircle.setRadius(radVal);
        }
    }

    function setRadiusPreset(meters) {
        document.getElementById('radiusInput').value = meters;
        updateCircleRadius();
    }

    function detectGPS() {
        if (!navigator.geolocation) {
            Swal.fire('Error', 'Browser tidak mendukung Geolocation GPS.', 'error');
            return;
        }

        Swal.fire({
            title: 'Mendeteksi Lokasi GPS...',
            text: 'Mengambil koordinat perangkat dengan akurasi tinggi...',
            allowOutsideClick: false,
            didOpen: () => Swal.showLoading()
        });

        navigator.geolocation.getCurrentPosition(
            (pos) => {
                const lat = pos.coords.latitude.toFixed(8);
                const lng = pos.coords.longitude.toFixed(8);

                document.getElementById('officeLat').value = lat;
                document.getElementById('officeLng').value = lng;

                updatePinFromInputs();

                Swal.fire({
                    icon: 'success',
                    title: 'GPS Berhasil Terdeteksi!',
                    html: `<b>Latitude:</b> ${lat}<br><b>Longitude:</b> ${lng}<br><b>Akurasi GPS:</b> ±${Math.round(pos.coords.accuracy)}m`,
                    timer: 2500,
                    showConfirmButton: false
                });
            },
            (err) => {
                Swal.fire('Gagal Mendeteksi GPS', err.message || 'Izin lokasi ditolak atau GPS tidak aktif.', 'error');
            },
            { enableHighAccuracy: true, timeout: 15000, maximumAge: 0 }
        );
    }
</script>
<?php $__env->stopPush(); ?>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\laragon\www\absensi\resources\views/admin/settings/attendance.blade.php ENDPATH**/ ?>