<!DOCTYPE html>
<html lang="en">
<!-- [Head] start -->

<head>
  <title>Login | Smart Anxiety</title>
  <!-- [Meta] -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="description"
    content="Mantis is made using Bootstrap 5 design framework. Download the free admin template & use it for your project.">
  <meta name="keywords"
    content="Mantis, Dashboard UI Kit, Bootstrap 5, Admin Template, Admin Dashboard, CRM, CMS, Bootstrap Admin Template">
  <meta name="author" content="CodedThemes">

  <!-- [Favicon] icon -->
  <link rel="icon" href="{{ asset('assets/admin/assets/images/favicon.svg') }}" type="image/x-icon"> <!-- [Google Font] Family -->
  <link rel="stylesheet"
    href="https://fonts.googleapis.com/css2?family=Public+Sans:wght@300;400;500;600;700&display=swap"
    id="main-font-link">
  <!-- [Tabler Icons] https://tablericons.com -->
  <link rel="stylesheet" href="{{ asset('assets/admin/assets/fonts/tabler-icons.min.css') }}">
  <!-- [Feather Icons] https://feathericons.com -->
  <link rel="stylesheet" href="{{ asset('assets/admin/assets/fonts/feather.css') }}">
  <!-- [Font Awesome Icons] https://fontawesome.com/icons -->
  <link rel="stylesheet" href="{{ asset('assets/admin/assets/fonts/fontawesome.css') }}">
  <!-- [Material Icons] https://fonts.google.com/icons -->
  <link rel="stylesheet" href="{{ asset('assets/admin/assets/fonts/material.css') }}">
  <!-- [Template CSS Files] -->
  <link rel="stylesheet" href="{{ asset('assets/admin/assets/css/style.css') }}" id="main-style-link">
  <link rel="stylesheet" href="{{ asset('assets/admin/assets/css/style-preset.css') }}">

  <meta id="_token" value="{{ csrf_token() }}">

</head>
<!-- [Head] end -->
<!-- [Body] Start -->

<body>
  <!-- [ Pre-loader ] start -->
  <div class="loader-bg">
    <div class="loader-track">
      <div class="loader-fill"></div>
    </div>
  </div>
  <!-- [ Pre-loader ] End -->

  <div class="auth-main">
    <div class="auth-wrapper v3">
      <div class="auth-form">
        <div class="auth-header">
          <a href="#"><img src="{{ asset('assets/admin/assets/images/logo-dark.svg') }}" alt="img"></a> 
        </div>
        <div class="card my-5">
          <div class="card-body">
            <div class="d-flex justify-content-between align-items-end mb-4">
              <h3 class="mb-0"><b>Login</b></h3>
              {{-- <a href="#" class="link-primary">Don't have an account?</a> --}}
            </div>
            <div class="form-group mb-3">
              <label class="form-label">Email Address</label>
              <input type="email" id="email" class="form-control" placeholder="Email Address">
            </div>
            <div class="form-group mb-3">
              <label class="form-label">Password</label>
              <input type="password" id="password" class="form-control" placeholder="Password">
            </div>
            <div class="d-flex mt-1 justify-content-between">
              <h5 class="text-secondary f-w-400">Forgot Password?</h5>
            </div>
            <div class="d-grid mt-4">
              <button type="button" class="btn btn-primary" onclick="doLogin()">Login</button>
            </div>
          </div>
        </div>
        <div class="auth-footer row">
          <!-- <div class=""> -->
          <div class="col my-1">
            <p class="m-0">Copyright {{ date('Y') }} © <a href="https://polije.ac.id" target="_blank"> Politeknik Negeri Jember</a></p>
          </div>
          <div class="col-auto my-1">
            <ul class="list-inline footer-link mb-0">
              <li class="list-inline-item"><a href="#">Beranda</a></li>
              <li class="list-inline-item"><a href="#">Contact us</a></li>
            </ul>
          </div>
          <!-- </div> -->
        </div>
      </div>
    </div>
  </div>
  <!-- [ Main Content ] end -->
  <!-- Required Js -->
  <script src="{{ asset('assets/admin/assets/js/plugins/popper.min.js') }}"></script>
  <script src="{{ asset('assets/admin/assets/js/plugins/simplebar.min.js') }}"></script>
  <script src="{{ asset('assets/admin/assets/js/plugins/bootstrap.min.js') }}"></script>
  <script src="{{ asset('assets/admin/assets/js/fonts/custom-font.js') }}"></script>
  <script src="{{ asset('assets/admin/assets/js/pcoded.js') }}"></script>
  <script src="{{ asset('assets/admin/assets/js/plugins/feather.min.js') }}"></script>
  <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
  <script>layout_change('light');</script>
  <script>change_box_container('false');</script>
  <script>layout_rtl_change('false');</script>
  <script>preset_change("preset-1");</script>
  <script>font_change("Public-Sans");</script>

  <script>
    function doLogin() {
      try {
        let token = document.getElementById('_token').getAttribute('value');
        let email = document.getElementById('email').value;
        let password = document.getElementById('password').value;

        if(email == '' || email == null) {
          Swal.fire({
            title: "Info",
            text: "Email tidak boleh kosong!",
            icon: "warning"
          });
          return;
        }

        if(password == '' || password == null) {
          Swal.fire({
            title: "Info",
            text: "Password tidak boleh kosong!",
            icon: "warning"
          });
          return;
        }

        let xhttp = new XMLHttpRequest();
        let formData = new FormData();

        formData.append('_token', token);
        formData.append('email', email);
        formData.append('password', password);

        xhttp.onreadystatechange = function() {
          if(this.status == 200) {
            let jsonData = JSON.parse(this.responseText);
            if(jsonData.status) {
              Swal.fire({
                title: "Info",
                text: "Login berhasil!",
                icon: "success"
              });
              window.location.href = '{{ route('dashboard.index') }}';
            } else {
              Swal.fire({
                title: "Info",
                text: "Login gagal, cek email atau password anda!",
                icon: "error"
              });
            }
          } else {
            Swal.fire({
              title: "Info",
              text: "Login gagal, koneksi ke server gagal, coba lagi nanti!",
              icon: "error"
            });
          }
        }

        xhttp.open('POST', '{{ route("login") }}', false);
        xhttp.send(formData);
      } catch(error) {
        Swal.fire({
          title: "Info",
          text: "Login gagal, kesalahan pada server, coba lagi nanti!",
          icon: "error"
        });
      }
    }
  </script>
</body>
<!-- [Body] end -->

</html>