@extends('layouts.main')

@section('content')
<div class="pagetitle">
    <h1>Pengaturan Umum</h1>
    <nav>
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="/">Home</a></li>
            <li class="breadcrumb-item">Pengaturan</li>
            <li class="breadcrumb-item active">Umum</li>
        </ol>
    </nav>
</div>

<section class="section">
    @if (session()->has('success'))
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <i class="bi bi-check-circle me-1"></i>
            {{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif

    @if (session()->has('error'))
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <i class="bi bi-exclamation-octagon me-1"></i>
            {{ session('error') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif

    <div class="row">
        <div class="col-lg-8">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">Konfigurasi Umum Sistem</h5>

                    <form action="{{ route('settings.general.update') }}" method="POST">
                        @csrf
                        @method('PUT')

                        <!-- App Version -->
                        <div class="card mb-3">
                            <div class="card-body">
                                <h6 class="card-title">
                                    <i class="bi bi-app-indicator text-success"></i> Versi Aplikasi Mobile
                                </h6>
                                
                                <div class="mb-3">
                                    <label for="app_version" class="form-label">
                                        <strong>Versi Aplikasi</strong>
                                    </label>
                                    <input 
                                        type="text" 
                                        class="form-control" 
                                        id="app_version" 
                                        name="app_version" 
                                        value="{{ \App\Models\Setting::get('app_version', '1.0') }}"
                                        placeholder="1.0.2"
                                    >
                                    <small class="text-muted">Format bebas: 1.0, 1.0.2, 2.1.5, dll. Digunakan untuk splashscreen Flutter.</small>
                                </div>
                            </div>
                        </div>

                        <!-- PPN (Pajak Pertambahan Nilai) -->
                        <div class="card mb-3">
                            <div class="card-body">
                                <h6 class="card-title">
                                    <i class="bi bi-percent text-danger"></i> PPN (Pajak Pertambahan Nilai)
                                </h6>
                                
                                <div class="mb-3">
                                    <label for="ppn_persen" class="form-label">
                                        <strong>Persentase PPN</strong>
                                    </label>
                                    <div class="input-group">
                                        <input 
                                            type="number" 
                                            class="form-control" 
                                            id="ppn_persen" 
                                            name="ppn_persen" 
                                            value="{{ \App\Models\Setting::get('ppn_persen', '12') }}"
                                            placeholder="12"
                                            min="0"
                                            max="100"
                                            step="0.01"
                                        >
                                        <span class="input-group-text">%</span>
                                    </div>
                                    <small class="text-muted">Default: 12%. Nilai PPN ini akan digunakan di form registrasi customer dan perhitungan pembayaran lainnya.</small>
                                </div>
                            </div>
                        </div>

                        <!-- Biaya Registrasi -->
                        <div class="card mb-3">
                            <div class="card-body">
                                <h6 class="card-title">
                                    <i class="bi bi-currency-dollar text-success"></i> Biaya Registrasi Customer
                                </h6>
                                
                                <div class="mb-3">
                                    <label for="biaya_registrasi" class="form-label">
                                        <strong>Biaya Registrasi</strong>
                                    </label>
                                    <div class="input-group">
                                        <span class="input-group-text">Rp</span>
                                        <input 
                                            type="number" 
                                            class="form-control" 
                                            id="biaya_registrasi" 
                                            name="biaya_registrasi" 
                                            value="{{ \App\Models\Setting::get('biaya_registrasi', '0') }}"
                                            placeholder="0"
                                            min="0"
                                            step="1000"
                                        >
                                    </div>
                                    <small class="text-muted">Default: Rp 0. Nilai biaya registrasi ini akan otomatis digunakan di form pendaftaran customer baru.</small>
                                </div>
                            </div>
                        </div>

                        <!-- Worker Self Pick Job -->
                        <div class="card mb-3">
                            <div class="card-body">
                                <h6 class="card-title">
                                    <i class="bi bi-people-fill text-primary"></i> Worker Self-Pick Job
                                </h6>
                                
                                <div class="form-check form-switch mb-3">
                                    <input 
                                        class="form-check-input" 
                                        type="checkbox" 
                                        role="switch" 
                                        id="enable_pick_by_worker" 
                                        name="enable_pick_by_worker" 
                                        value="1"
                                        {{ \App\Models\Setting::get('enable_pick_by_worker', false) ? 'checked' : '' }}
                                    >
                                    <label class="form-check-label" for="enable_pick_by_worker">
                                        <strong>Aktifkan Worker Mengambil Job Sendiri</strong>
                                    </label>
                                </div>

                                <div class="alert alert-info mb-0">
                                    <h6 class="alert-heading"><i class="bi bi-info-circle"></i> Cara Kerja:</h6>
                                    <ul class="mb-0">
                                        <li><strong>Jika AKTIF (ON):</strong>
                                            <ul>
                                                <li>Setiap admin membuat order baru, sistem akan mengirim notifikasi ke <strong>semua worker</strong></li>
                                                <li>Worker dapat melihat daftar job yang available dan <strong>mengambil job sendiri</strong></li>
                                                <li>Worker yang pertama kali mengambil job akan otomatis di-assign ke order tersebut</li>
                                                <li>Status order otomatis berubah menjadi <span class="badge bg-info">Assigned</span></li>
                                            </ul>
                                        </li>
                                        <li class="mt-2"><strong>Jika NONAKTIF (OFF):</strong>
                                            <ul>
                                                <li>Admin harus <strong>manual assign</strong> worker ke setiap order</li>
                                                <li>Worker hanya menerima notifikasi untuk order yang sudah di-assign ke mereka</li>
                                                <li>Flow normal seperti biasa</li>
                                            </ul>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>

                        <!-- Web Login Access Control -->
                        <div class="card mb-3">
                            <div class="card-body">
                                <h6 class="card-title">
                                    <i class="bi bi-shield-lock text-warning"></i> Kontrol Akses Login Web
                                </h6>
                                
                                <!-- Customer Web Login -->
                                <div class="form-check form-switch mb-3">
                                    <input 
                                        class="form-check-input" 
                                        type="checkbox" 
                                        role="switch" 
                                        id="enable_customer_web_login" 
                                        name="enable_customer_web_login" 
                                        value="1"
                                        {{ \App\Models\Setting::get('enable_customer_web_login', '1') == '1' ? 'checked' : '' }}
                                    >
                                    <label class="form-check-label" for="enable_customer_web_login">
                                        <strong>Aktifkan Login Customer via Web</strong>
                                    </label>
                                </div>

                                <!-- Teknisi Web Login -->
                                <div class="form-check form-switch mb-3">
                                    <input 
                                        class="form-check-input" 
                                        type="checkbox" 
                                        role="switch" 
                                        id="enable_teknisi_web_login" 
                                        name="enable_teknisi_web_login" 
                                        value="1"
                                        {{ \App\Models\Setting::get('enable_teknisi_web_login', '1') == '1' ? 'checked' : '' }}
                                    >
                                    <label class="form-check-label" for="enable_teknisi_web_login">
                                        <strong>Aktifkan Login Teknisi via Web</strong>
                                    </label>
                                </div>

                                <div class="alert alert-warning mb-0">
                                    <h6 class="alert-heading"><i class="bi bi-exclamation-triangle"></i> Informasi:</h6>
                                    <ul class="mb-0">
                                        <li><strong>Jika AKTIF (ON):</strong> Customer/Teknisi dapat login melalui halaman web</li>
                                        <li><strong>Jika NONAKTIF (OFF):</strong> Halaman login akan menampilkan error 403 dan customer/teknisi harus menggunakan aplikasi mobile untuk login</li> 
                                    </ul>
                                </div>
                            </div>
                        </div>

                        <!-- Footer -->
                         <div class="card mb-3">
                            <div class="card-body">
                                <h6 class="card-title">
                                    <i class="bi bi-footer text-info"></i> Footer Aplikasi
                                </h6>
                                
                                <div class="mb-3">
                                    <label for="footer" class="form-label">
                                        <strong>Konten Footer</strong>
                                    </label>
                                    <!-- Quill Editor Container -->
                                    <div id="quill-editor" style="height: 150px; background: white;"></div>
                                    <!-- Hidden Input untuk menyimpan konten -->
                                    <input type="hidden" name="footer" id="footer">
                                    <small class="text-muted d-block mt-2">
                                        Gunakan toolbar untuk format teks dan insert link. 
                                        <br>Contoh: Copyright &copy; 2025 <strong>PT AuliaNet</strong>
                                    </small>
                                </div>
                            </div>
                        </div>

                        <!-- Submit Button -->
                        <div class="text-end">
                            <button type="submit" class="btn btn-primary">
                                <i class="bi bi-save"></i> Simpan Pengaturan
                            </button>
                        </div>
                    </form>
                </div>
            </div>

            <!-- Notification Ringtone Settings Card -->
            <div class="card mt-3">
                <div class="card-body">
                    <h5 class="card-title">
                        <i class="bi bi-music-note-beamed text-primary"></i> 
                        Notification Ringtone Settings
                    </h5>

                    <form action="{{ route('settings.ringtone.update') }}" method="POST" enctype="multipart/form-data">
                        @csrf
                        @method('PUT')

                        <!-- Current Ringtone Info -->
                        @if(\App\Models\Setting::get('ringtone_url'))
                        <div class="alert alert-success">
                            <div class="d-flex justify-content-between align-items-start">
                                <div class="w-100">
                                    <h6 class="alert-heading mb-2">
                                        <i class="bi bi-check-circle-fill"></i> Ringtone Custom Aktif
                                    </h6>
                                    <p class="mb-2"><strong>Filename:</strong> {{ \App\Models\Setting::get('ringtone_filename') }}</p>
                                    
                                            <audio controls style="width: 100%;" class="mb-2">
                                        <source src="{{ \App\Models\Setting::get('ringtone_url') }}" type="audio/mpeg">
                                        Your browser does not support the audio element.
                                    </audio>

                                    <div class="mt-2">
                                        <a href="{{ route('settings.ringtone.delete') }}" 
                                           class="btn btn-danger btn-sm"
                                           onclick="return confirm('Hapus ringtone custom? App akan ERROR karena tidak ada ringtone (sesuai permintaan Anda).')">
                                            <i class="bi bi-trash"></i> Hapus Ringtone
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        @else
                        <div class="alert alert-info">
                            <i class="bi bi-info-circle"></i>
                            <strong>Status:</strong> Menggunakan ringtone default (technician_alert.mp3)
                            <br><small>Upload file di bawah untuk menggunakan ringtone custom</small>
                        </div>
                        @endif

                        <!-- Upload New Ringtone -->
                        <div class="mb-3">
                            <label for="ringtone_file" class="form-label">
                                <strong>Upload Ringtone Baru</strong>
                            </label>
                            <input type="file" 
                                   class="form-control" 
                                   id="ringtone_file" 
                                   name="ringtone_file" 
                                   accept=".mp3,.wav,.m4a">
                            <small class="form-text text-muted">
                                Format: MP3, WAV, M4A | Max: 5MB | Recommended: 3-10 detik, 128kbps
                            </small>
                        </div>

                        <!-- Info Box -->
                        <div class="alert alert-warning">
                            <h6 class="alert-heading">
                                <i class="bi bi-lightbulb"></i> Cara Kerja:
                            </h6>
                            <ul class="mb-0 small">
                                <li>Upload file ringtone baru dan klik "Update Ringtone"</li>
                                <li><strong>Semua app akan otomatis cek & download jika ringtone berubah</strong></li>
                                <li>File akan tersimpan dengan nama unik (timestamp)</li>
                                <li>Ringtone lama otomatis terhapus saat upload yang baru</li>
                            </ul>
                        </div>

                        <button type="submit" class="btn btn-primary">
                            <i class="bi bi-upload"></i> Update Ringtone
                        </button>
                    </form>
                </div>
            </div>

        </div>

        <div class="col-lg-4">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">Status Saat Ini</h5>
                    
                    <div class="mb-3">
                        <label class="fw-bold d-block mb-2">Versi Aplikasi:</label>
                        <span class="badge bg-info fs-6">
                            <i class="bi bi-app"></i> v{{ \App\Models\Setting::get('app_version', '1.0') }}
                        </span>
                    </div>

                    <hr>

                    <div class="mb-3">
                        <label class="fw-bold d-block mb-2">PPN (Pajak):</label>
                        <span class="badge bg-danger fs-6">
                            <i class="bi bi-percent"></i> {{ \App\Models\Setting::get('ppn_persen', '12') }}%
                        </span>
                        <p class="mt-2 mb-0 text-muted small">
                            Nilai PPN yang digunakan untuk perhitungan registrasi customer.
                        </p>
                    </div>

                    <hr>

                    <div class="mb-3">
                        <label class="fw-bold d-block mb-2">Biaya Registrasi:</label>
                        <span class="badge bg-success fs-6">
                            <i class="bi bi-currency-dollar"></i> Rp {{ number_format(\App\Models\Setting::get('biaya_registrasi', '0'), 0, ',', '.') }}
                        </span>
                        <p class="mt-2 mb-0 text-muted small">
                            Biaya registrasi default untuk pendaftaran customer baru.
                        </p>
                    </div>

                    <hr>

                    <div class="mb-3">
                        <label class="fw-bold d-block mb-2">Worker Self-Pick Job:</label>
                        @php
                            $enabled = \App\Models\Setting::get('enable_pick_by_worker', false);
                        @endphp
                        
                        @if($enabled)
                            <span class="badge bg-success fs-6">
                                <i class="bi bi-toggle-on"></i> AKTIF
                            </span>
                            <p class="mt-2 mb-0 text-muted small">
                                Worker dapat mengambil job sendiri. Notifikasi akan dikirim ke semua worker saat ada order baru.
                            </p>
                        @else
                            <span class="badge bg-secondary fs-6">
                                <i class="bi bi-toggle-off"></i> NONAKTIF
                            </span>
                            <p class="mt-2 mb-0 text-muted small">
                                Admin harus manual assign worker ke setiap order. Worker hanya menerima notifikasi untuk order yang di-assign ke mereka.
                            </p>
                        @endif
                    </div>

                    <hr>

                    <div class="mb-3">
                        <label class="fw-bold d-block mb-2">Login Customer Web:</label>
                        @php
                            $customerWebLogin = \App\Models\Setting::get('enable_customer_web_login', '1') == '1';
                        @endphp
                        
                        @if($customerWebLogin)
                            <span class="badge bg-success fs-6">
                                <i class="bi bi-unlock-fill"></i> AKTIF
                            </span>
                        @else
                            <span class="badge bg-danger fs-6">
                                <i class="bi bi-lock-fill"></i> NONAKTIF
                            </span>
                        @endif
                    </div>

                    <hr>

                    <div class="mb-3">
                        <label class="fw-bold d-block mb-2">Login Teknisi Web:</label>
                        @php
                            $teknisiWebLogin = \App\Models\Setting::get('enable_teknisi_web_login', '1') == '1';
                        @endphp
                        
                        @if($teknisiWebLogin)
                            <span class="badge bg-success fs-6">
                                <i class="bi bi-unlock-fill"></i> AKTIF
                            </span>
                        @else
                            <span class="badge bg-danger fs-6">
                                <i class="bi bi-lock-fill"></i> NONAKTIF
                            </span>
                        @endif
                    </div>

                    <hr>

                    <div class="mb-3">
                        <label class="fw-bold d-block mb-2">Footer Aplikasi:</label>
                        @php
                            $footerContent = \App\Models\Setting::get('footer', '');
                        @endphp
                        
                        @if($footerContent)
                            <div class="border rounded p-2 bg-light small">
                                {!! $footerContent !!}
                            </div>
                        @else
                            <span class="badge bg-secondary">
                                <i class="bi bi-x-circle"></i> Belum diatur
                            </span>
                        @endif
                    </div>
                </div>
            </div>

            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">Database Management</h5>
                    
                    <div class="d-grid gap-2 mb-3">
                        <a href="{{ route('database.export') }}" class="btn btn-success">
                            <i class="bi bi-download"></i> Export Database (.sql)
                        </a>
                    </div>

                    <div class="d-grid gap-2">
                        <a href="{{ route('database.import.form') }}" class="btn btn-warning">
                            <i class="bi bi-upload"></i> Import Database (.sql)
                        </a>
                    </div>

                    <div class="alert alert-info mt-3 mb-0">
                        <small>
                            <i class="bi bi-info-circle"></i> 
                            <strong>Export:</strong> Backup seluruh database ke file .sql<br>
                            <strong>Import:</strong> Restore data dari file .sql backup
                        </small>
                    </div>
                </div>
            </div>

            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">Pengaturan Lainnya</h5>
                    
                    <ul class="list-unstyled">
                        <li class="mb-2">
                            <a href="{{ route('response-deadline-settings.index') }}" class="text-decoration-none">
                                <i class="bi bi-clock-history text-primary"></i> Response Deadline
                            </a>
                        </li>
                        <li class="mb-2">
                            <a href="{{ route('otp-settings.index') }}" class="text-decoration-none">
                                <i class="bi bi-shield-check text-success"></i> OTP Settings
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection

@push('styles')
<!-- Quill CSS -->
<link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">
<style>
    .ql-container {
        font-family: Arial, sans-serif;
        font-size: 14px;
    }
    .ql-editor {
        min-height: 120px;
    }
</style>
@endpush

@push('scripts')
<!-- Quill JS -->
<script src="https://cdn.quilljs.com/1.3.6/quill.min.js"></script>

<script>
document.addEventListener('DOMContentLoaded', function() {
    const switchInput = document.getElementById('enable_pick_by_worker');
    
    if (switchInput) {
        switchInput.addEventListener('change', function() {
            if (this.checked) {
                console.log('Worker self-pick enabled');
            } else {
                console.log('Worker self-pick disabled');
            }
        });
    }

    // Initialize Quill Editor
    var quill = new Quill('#quill-editor', {
        theme: 'snow',
        modules: {
            toolbar: [
                ['bold', 'italic', 'underline'],
                ['link'],
                [{ 'list': 'ordered'}, { 'list': 'bullet' }],
                ['clean']
            ]
        },
        placeholder: 'Ketik konten footer di sini...'
    });

    // Set initial value dari database
    var footerContent = {!! json_encode(\App\Models\Setting::get('footer', '')) !!};
    if (footerContent) {
        quill.root.innerHTML = footerContent;
    }

    // Update hidden input saat konten berubah
    quill.on('text-change', function() {
        document.getElementById('footer').value = quill.root.innerHTML;
    });

    // Set initial value ke hidden input
    document.getElementById('footer').value = quill.root.innerHTML;
});
</script>
@endpush