@extends('layouts.index')

@section('title')
    Dashboard -
@endsection

@push('css')
    <style>
        .text-dark{
            color:#003f37 !important
        }
        body {
            background-color: #fff;
        }
        div.amcharts-chart-div>a {
            display: none!important;
        }

    </style>
    <style>
        #reader {
            width: 300px;
            margin: auto;
        }
    </style>
@endpush

@section('content')
    <div class="content flex-column-fluid" id="kt_content">
        <div class="toolbar d-flex flex-stack flex-wrap mb-5 mb-lg-7" id="kt_toolbar">
            <div class="page-title d-flex flex-column py-1">
                <h1 class="d-flex align-items-center my-1"><span class="text-dark fw-bold fs-1">Home</span></h1>
                @include('layouts._breadcrumb')
            </div>
            <div class="d-flex align-items-center py-1 gap-6">
            </div>
        </div>

        <div id="reader"></div>
        <p style="display: none">Hasil: <span id="result"></span></p>
    </div>
@endsection

@push('scripts')
    <script src="https://unpkg.com/html5-qrcode" type="text/javascript"></script>
    <script>
        let scanned = false;
        function onScanSuccess(decodedText, decodedResult) {

            if (scanned) return; // cegah scan ulang
            scanned = true;

            // Hentikan scanner setelah scan sukses
            html5QrcodeScanner.clear();

            document.getElementById("result").innerText = decodedText;

            const url = new URL(decodedText);
            const kodeBooking = url.searchParams.get("kode_booking");

            if (!kodeBooking) {
                Swal.fire("Error", "QR Code tidak mengandung kode booking!", "error");
                return;
            }

            fetch("{{ route('operator.scan.do') }}", {
                method: "POST",
                headers: {
                    "Content-Type": "application/json",
                    "X-CSRF-TOKEN": "{{ csrf_token() }}"
                },
                body: JSON.stringify({
                    kode_booking : kodeBooking
                })
            })
                .then(response => response.json())
                .then(data => {
                    console.log(data);
                    if (data.success) {
                        Swal.fire({
                            icon: "success",
                            title: "Status berhasil diupdate",
                            text: data.message
                        }).then((result) => {
                            if(result.isConfirmed)
                            {
                                window.location.href = decodedText;
                            }
                        });
                    } else {
                        Swal.fire({
                            icon: "error",
                            title: "Tiket sudah digunakan",
                            text: data.message
                        }).then((result) => {
                            if(result.isConfirmed)
                            {
                                window.location.href = '{{ route('operator') }}'
                            }
                        });
                    }
                })
                .catch(error => {
                    console.error("Error:", error);
                    Swal.fire("Error", "Terjadi kesalahan saat memproses data", "error");
                });
        }

        function onScanFailure(error) {
            // Bisa dipakai untuk debug kalau gagal scan
            console.warn(`Scan error: ${error}`);
        }

        let html5QrcodeScanner = new Html5QrcodeScanner(
            "reader",
            { fps: 10, qrbox: 250 }
        );

        html5QrcodeScanner.render(onScanSuccess, onScanFailure);
    </script>
@endpush