@extends('layouts-auth.main')

@section('extra-style-auth')
    <style>
        img {
            width: 100%;
        }
    </style>
@endsection

@section('content-auth')
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-xl-5 col-sm-8">
                <div class="card">
                    <div class="card-body p-4">
                        <div class="p-2">
                            <h5 class="mb-5 text-center">Cek Keaslian BAST</h5>
                            <div id="reader"></div>
                        </div>
                        <div class="text-center">
                            <a href="{{ route('login') }}" class="btn btn-secondary btn-sm">Kembali ke halaman login</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('extra-script-auth')
  <script src="{{ asset('template/libs/html5-qrcode/html5-qrcode.min.js') }}"></script>
  <script>
      // inisiasi html5QRCodeScanner
      let html5QRCodeScanner = new Html5QrcodeScanner(
          // target id dengan nama reader, lalu sertakan juga 
          // pengaturan untuk qrbox (tinggi, lebar, dll)
          "reader", {
              fps: 10,
              qrbox: {
                  width: 200,
                  height: 200,
              },
          }
      );

      // function yang dieksekusi ketika scanner berhasil
      // membaca suatu QR Code
      function onScanSuccess(decodedText, decodedResult) {
          // redirect ke link hasil scan
        //   window.location.href = decodedResult.decodedText;
          verifikasiTtd(decodedResult.decodedText);

          // membersihkan scan area ketika sudah menjalankan 
          // action diatas
        //   html5QRCodeScanner.clear();
      }

      function verifikasiTtd(param) {
        $.ajax({
            url: '{{ route('cek_keaslian.verifikasi_bast') }}',
            type: 'get',
            data: {
                '_token': "{{ csrf_token() }}",
                'id': param
            },
            success: function(response) {
                if (response.status == 'berhasil') {
                    Swal.fire({
                        title: "Berhasil",
                        html: 'BAST tersebut asli dan terdaftar atas nomor <br><b>' + response.data.rpb_no_berita_acara + '</b>',
                        icon: "success",
                        showConfirmButton: true
                    });
                } else if (response.status == 'null') {
                    Swal.fire({
                        title: "Peringatan",
                        text: "BAST tersebut tidak terdaftar",
                        icon: "warning",
                        showConfirmButton: true
                    });
                } else if (response.status == 'gagal') {
                    Swal.fire({
                        title: "Gagal",
                        text: "Data gagal dihapus",
                        icon: "error",
                        showConfirmButton: true
                    });
                    console.log(response.message);
                }
            },
            error: function(request, status, error) {
                Swal.fire({
                    title: "Error",
                    text: "Terjadi kesalahan",
                    icon: "error",
                    showConfirmButton: true
                });
                console.log(request.responseText);
            }
        });
      }

      // render qr code scannernya
      html5QRCodeScanner.render(onScanSuccess);
  </script>
@endsection