707 lines
35 KiB
PHP
707 lines
35 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<link rel="shortcut icon" href="{{ asset('assets/images/logo-oki.webp') }}">
|
|
<title>REKBER | Login</title>
|
|
<link rel="shortcut icon" href="{{ asset('assets/images/logo-rekber.png') }}">
|
|
<!-- icon font awesome -->
|
|
<script src="https://kit.fontawesome.com/64d58efce2.js" crossorigin="anonymous"></script>
|
|
<!-- css -->
|
|
<link rel="stylesheet" href="{{ asset('assets/css/login_register/style.css') }}" />
|
|
{{-- Token --}}
|
|
<meta name="csrf-token" content="{{ csrf_token() }}">
|
|
<!-- ionicons -->
|
|
<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
|
|
<!-- Boxicons -->
|
|
<script src="https://unpkg.com/boxicons@2.1.4/dist/boxicons.js"></script>
|
|
<link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
|
|
<!-- css input dropdown -->
|
|
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
|
|
<style>
|
|
.select2-container .select2-selection--single {
|
|
border: none;
|
|
background: none;
|
|
outline: none;
|
|
box-shadow: none;
|
|
padding: 0;
|
|
}
|
|
|
|
.select2-container .select2-selection--single:focus {
|
|
border: none;
|
|
}
|
|
|
|
.select2-container .select2-selection--single .select2-selection__arrow {
|
|
border: none;
|
|
background: none;
|
|
}
|
|
|
|
.select2-container--default.select2-container--open .select2-selection--single {
|
|
border: none;
|
|
}
|
|
|
|
.select2-results {
|
|
border-bottom: 1px solid #aaa;
|
|
}
|
|
|
|
.select2-results__option {
|
|
padding: 10px;
|
|
color: #333;
|
|
background-color: white;
|
|
}
|
|
|
|
.select2-container--default .select2-results>.select2-results__options .select2-results__option--highlighted {
|
|
background-color: #900c3e !important;
|
|
color: #fff !important;
|
|
}
|
|
|
|
/* #foto-preview-ktp,
|
|
#foto-preview-ekyc {
|
|
width: 400px;
|
|
} */
|
|
|
|
.image-holder-ktp,
|
|
.image-holder-ekyc {
|
|
width: 400px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container mt-5">
|
|
<div class="forms-container">
|
|
<div class="signin-signup">
|
|
|
|
<!-- ======= SIGN IN FORM ======= -->
|
|
<form action="{{ route('autentikasi') }}" class="sign-in-form" method="POST"
|
|
enctype="multipart/form-data">
|
|
@csrf
|
|
<h2 class="title">Login</h2>
|
|
<p>
|
|
Selamat datang kembali, silakan isi form login di bawah ini untuk masuk ke akun anda.
|
|
</p>
|
|
<div style="width: 100%; display: flex; align-items: center;">
|
|
<div class="input-field-signin-flex">
|
|
<i class="fas fa-envelope" aria-hidden="true"></i>
|
|
<input type="email" class="telp-input-signin" placeholder="Email" name="email" required>
|
|
</div>
|
|
<button type="button" class="btn-otp solid" id="cekAkun">Cek Akun</button>
|
|
|
|
</div>
|
|
<div class="input-field-signin-flex">
|
|
<i class="fas fa-unlock-alt" aria-hidden="true"></i>
|
|
<input type="password" class="otp-input" placeholder="Password" name="password" required>
|
|
</div>
|
|
<button type="submit" class="btn solid" id="login-btn">Login</button>
|
|
</form>
|
|
<!-- ======= END SIGN IN FORM ======= -->
|
|
|
|
<!-- ======= SIGN UP FORM ======= -->
|
|
<form action="javascript:void(0);" class="sign-up-form" id="msform" enctype="multipart/form-data"
|
|
method="POST">
|
|
@csrf
|
|
<h2 class="title">Daftar</h2>
|
|
<p>
|
|
Selamat datang kembali, silakan isi form login di bawah ini untuk masuk ke akun anda.
|
|
</p>
|
|
|
|
<<!--=======PROGRESS BAR=======-->
|
|
<div class="header">
|
|
<ul>
|
|
<li class="active form_1_progessbar">
|
|
<div>
|
|
<p>1</p>
|
|
</div>
|
|
</li>
|
|
<li class="form_2_progessbar">
|
|
<div>
|
|
<p>2</p>
|
|
</div>
|
|
</li>
|
|
<li class="form_3_progessbar">
|
|
<div>
|
|
<p>3</p>
|
|
</div>
|
|
</li>
|
|
<li class="form_4_progessbar">
|
|
<div>
|
|
<p>4</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<!-- ======= END PROGRESS BAR ======= -->
|
|
|
|
<!-- ======= FORM MULTIPLE ======= -->
|
|
<div class="form_wrap">
|
|
|
|
<!-- ======= FORM PERSONAL DATA ======= -->
|
|
<div class="form_1 data_info">
|
|
<div style="display: flex;">
|
|
<div class="input-field-signup-flex">
|
|
<i class="fas fa-user"></i>
|
|
<input type="text" placeholder="Nama Depan" class="first-name-input"
|
|
name="nama_depan" />
|
|
</div>
|
|
<div class="input-field-signup-flex" style="margin-left: 3%">
|
|
<i class="fas fa-user"></i>
|
|
<input type="text" placeholder="Nama Belakang" class="last-name-input"
|
|
name="nama_belakang">
|
|
</div>
|
|
</div>
|
|
<div class="input-field-signin-flex up">
|
|
<i class="fa fa-id-card" aria-hidden="true"></i>
|
|
<input type="text" placeholder="NIK" class="email-input" name="nik"
|
|
maxlength="16"
|
|
oninput="this.value = this.value.replace(/[^0-9]/g, '').substring(0, 16);" />
|
|
</div>
|
|
<div class="flex-input-btn">
|
|
<div class="input-field-signin-flex">
|
|
<i class="fa fa-envelope" aria-hidden="true"></i>
|
|
<input type="email" placeholder="Email" class="email-input" name="new_email"
|
|
id="newEmail">
|
|
</div>
|
|
<button id="verifikasiEmail" class="btn-otp solid up" type="button"
|
|
disabled="true">Verifikasi</button>
|
|
</div>
|
|
<div class="input-field-signin-flex up">
|
|
<i class="fa fa-ellipsis-h" aria-hidden="true"></i>
|
|
<input type="text" class="telp-input-signup"
|
|
oninput="this.value = this.value.replace(/[^0-9]/g, '').substring(0, 6);"
|
|
placeholder="Kode Verifikasi Email" name="email_verification"
|
|
id="emailVerification">
|
|
</div>
|
|
<div class="input-field-signin-flex up">
|
|
<i class="fa fa-phone" aria-hidden="true"></i>
|
|
<input type="text" class="telp-input-signup" maxlength="13"
|
|
oninput="this.value = this.value.replace(/[^0-9]/g, '').substring(0, 15);"
|
|
placeholder="Nomer Telepon. cth: 08xxx" name="nohp">
|
|
</div>
|
|
<div style="display: flex;">
|
|
<div class="input-field">
|
|
<select id="gender-select" name="gender">
|
|
<option value="Laki-laki">Laki-laki</option>
|
|
<option value="Perempuan">Perempuan</option>
|
|
</select>
|
|
</div>
|
|
<div class="input-field-signup-flex left">
|
|
<i class="fa fa-calendar" aria-hidden="true"></i>
|
|
<input type="date" placeholder="Tanggal Lahir" name="tanggal_lahir" />
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- ======= END FORM PERSONAL DATA ======= -->
|
|
|
|
<!-- ======= FORM ADDRESS ======= -->
|
|
<div class="form_2 data_info" style="display: none;">
|
|
<div class="input-field">
|
|
<select id="selectProvince" data-url="{{ route('cari-provinsi') }}"
|
|
style="width: 100%;" class="input-field" aria-label="Default select example">
|
|
|
|
</select>
|
|
</div>
|
|
<div class='mb-2'>
|
|
<div class="input-field">
|
|
<select id="selectCity" style="width: 100%;" class="input-field"
|
|
aria-label="Default select example">
|
|
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class='mb-2'>
|
|
<div class="input-field">
|
|
<select id="selectDistrict" style="width: 100%;" class="input-field"
|
|
aria-label="Default select example">
|
|
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class='mb-2'>
|
|
<div class="input-field">
|
|
<select id="selectVillage" style="width: 100%;" class="input-field"
|
|
aria-label="Default select example" name="village_code">
|
|
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<input type="text" class="input-field" id="alamat" name="alamat"
|
|
placeholder="Alamat lengkap Anda" cols="50" rows="4">
|
|
</div>
|
|
<!-- ======= END FORM ADDRESS ======= -->
|
|
|
|
<!-- ======= FORM DROP & DRAG IMAGE ======= -->
|
|
<div class="form_3 data_info" style="display: none;">
|
|
<div class="slider-container">
|
|
<div class="slider">
|
|
<div class="slide fade">
|
|
<div style="display: flex; flex-direction: column; align-items: center">
|
|
<h3>Foto KTP Anda</h3>
|
|
<div class="image-holder-ktp">
|
|
<img src="{{ asset('assets/images/dashboard/Asset 3.png') }}"
|
|
alt="logo ambil gambar" id="imageHolderKtp">
|
|
</div>
|
|
<video id="webcamKtp" autoplay playsinline></video>
|
|
<div id="foto-preview-ktp"></div>
|
|
<input type="hidden" id="fotoKtp" name="ktp"
|
|
style="display: none;">
|
|
<div style="display: flex; margin-top: 1rem;">
|
|
<button type="button" class="btn-foto" id="startButtonKtp"
|
|
data-state="off">Mulai Kamera</button>
|
|
<label for="ambilKtp" class="btn-foto text-center" id="gambarKtp"
|
|
data-state="off">Pilih Gambar KTP<input type="file"
|
|
id="ambilKtp" accept="image/*"
|
|
style="display: none;"></label>
|
|
<button type="button" class="btn-foto"
|
|
id="captureButtonKtp">Ambil Foto</button>
|
|
<button type="button" class="btn-foto"
|
|
id="refreshButtonKtp">Ulang Foto</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="slide fade">
|
|
<div
|
|
style="display: flex; flex-direction: column; justify-content: center; align-items: center">
|
|
<h3>Foto Wajah Anda</h3>
|
|
<div class="image-holder-ekyc">
|
|
<img src="{{ asset('assets/images/dashboard/Asset 3.png') }}"
|
|
alt="logo ambil gambar" id="imageHolderEkyc">
|
|
</div>
|
|
<video id="webcamEkyc" autoplay playsinline></video>
|
|
<div id="foto-preview-ekyc"></div>
|
|
<input type="hidden" id="fotoEkyc" name="wajah" accept="image/*"
|
|
style="display: none;">
|
|
<div style="display: flex; margin-top: 1rem;">
|
|
<button type="button" class="btn-foto" id="startButtonEkyc"
|
|
data-state="off">Mulai Kamera</button>
|
|
<label for="ambilEkyc" class="btn-foto text-center"
|
|
id="gambarEkyc" data-state="off">Pilih Foto Wajah<input
|
|
type="file" id="ambilEkyc" accept="image/*"
|
|
style="display: none;"></label>
|
|
<button type="button" class="btn-foto"
|
|
id="captureButtonEkyc">Ambil Foto</button>
|
|
<button type="button" class="btn-foto"
|
|
id="refreshButtonEkyc">Ulang Foto</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="dots">
|
|
<button class="prev" type="button"
|
|
onclick="plusSlide(-1)">❮</button>
|
|
<span class="dot" onclick="currentSlide(1)"></span>
|
|
<span class="dot" onclick="currentSlide(2)"></span>
|
|
<button class="next" type="button"
|
|
onclick="plusSlide(1)">❯</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- ======= FORM DROP & DRAG IMAGE ======= -->
|
|
|
|
<!-- ======= FORM PIN ======= -->
|
|
<div class="form_4 data_info" style="display: none;">
|
|
<div style="display: flex; width: 100%;">
|
|
<div class="input-field-signup-flex">
|
|
<i class="fa fa-unlock-alt" aria-hidden="true"></i>
|
|
<input type="password" class="pin-input" placeholder="Password"
|
|
name="new_password">
|
|
</div>
|
|
<div class="input-field-signup-flex left" style="margin-left: 3%">
|
|
<i class="fa fa-unlock-alt" aria-hidden="true"></i>
|
|
<input type="password" class="konfir-pin-input"
|
|
placeholder="Konfirmasi Password" name="confirm_password">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- ======= END FORM PIN ======= -->
|
|
|
|
<!-- ======= BTN FORM NEXT & BACK ======= -->
|
|
<div class="btns_wrap">
|
|
<div class="common_btns form_1_btns">
|
|
<button type="button" class="btn_next">Next <span class="icon"><ion-icon
|
|
name="arrow-forward-sharp"></ion-icon></span></button>
|
|
</div>
|
|
<div class="common_btns form_2_btns" style="display: none;">
|
|
<button type="button" class="btn_back"><span class="icon"><ion-icon
|
|
name="arrow-back-sharp"></ion-icon></span>Back</button>
|
|
<button type="button" class="btn_next">Next <span class="icon"><ion-icon
|
|
name="arrow-forward-sharp"></ion-icon></span></button>
|
|
</div>
|
|
<div class="common_btns form_3_btns" style="display: none;">
|
|
<button type="button" class="btn_back"><span class="icon"><ion-icon
|
|
name="arrow-back-sharp"></ion-icon></span>Back</button>
|
|
<button type="button" class="btn_next">Next <span class="icon"><ion-icon
|
|
name="arrow-forward-sharp"></ion-icon></span></button>
|
|
</div>
|
|
<div class="common_btns form_4_btns" style="display: none;">
|
|
<button type="button" class="btn_back"><span class="icon"><ion-icon
|
|
name="arrow-back-sharp"></ion-icon></span>Back</button>
|
|
<button type="submit" class="btn_done" id="signUp">Daftar</button>
|
|
</div>
|
|
</div>
|
|
<!-- ======= BTN FORM NEXT & BACK ======= -->
|
|
|
|
</div>
|
|
<!-- ======= END FORM MIULTIPLE ======= -->
|
|
</form>
|
|
<!-- ======= END FORM SIGN UP ======= -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panels-container">
|
|
<div class="panel left-panel">
|
|
<div class="content">
|
|
<h3>Belum memiliki akun?</h3>
|
|
<p>
|
|
Daftarkan akun anda sekarang untuk nikmatin Aplikasi RekBer. Daftar di sini.
|
|
</p>
|
|
<button class="btn transparent" id="sign-up-btn">
|
|
Daftar
|
|
</button>
|
|
<p><a href="{{ route('homepage') }}">Kembali</a></p>
|
|
</div>
|
|
<img src="{{ asset('assets/img/login_register/Payment Information-pana.svg') }}" class="image"
|
|
alt="" />
|
|
</div>
|
|
<div class="panel right-panel">
|
|
<div class="content">
|
|
<h3>Sudah memiliki akun?</h3>
|
|
<p>
|
|
Silakan masuk ke dalam RekBar menggunakan akun yang telah Anda buat sebelumnya di sini.
|
|
</p>
|
|
<button class="btn transparent" id="sign-in-btn">
|
|
Masuk
|
|
</button>
|
|
<p><a href="{{ route('homepage') }}">Kembali</a></p>
|
|
</div>
|
|
<img src="{{ asset('assets/img/login_register/Payment Information-pana.svg') }}" class="image"
|
|
alt="" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"
|
|
integrity="sha512-aVKKRRi/Q/YV+4mjoKBsE4x3H+BkegoM/em46NNlCqNTmUYADjBbeNefNxYV7giUp0VxICtqdrbqU7iVaeZNXA=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js"
|
|
integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous">
|
|
</script>
|
|
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
|
<script src="{{ asset('assets/js/login_register/app.js') }}"></script>
|
|
<script src="{{ asset('assets/js/login_register/script.js') }}"></script>
|
|
|
|
@if (Session::has('message'))
|
|
<script>
|
|
Swal.fire({
|
|
icon: 'error',
|
|
title: 'Gagal',
|
|
text: "{{ Session::get('message') }}",
|
|
});
|
|
</script>
|
|
@endif
|
|
|
|
@if ($errors->any())
|
|
<script>
|
|
Swal.fire({
|
|
icon: 'error',
|
|
title: 'Kesalahan',
|
|
text: @json($errors->all()).join(' '),
|
|
});
|
|
console.log(@json($errors->all()));
|
|
</script>
|
|
@endif
|
|
|
|
<script>
|
|
$(document).ready(function() {
|
|
let verificationStatus = false;
|
|
let verificationCode = '';
|
|
let waktuSekarangDetik = 0;
|
|
|
|
// Generate Kode Verifikasi
|
|
function generateVerificationCode() {
|
|
const codeLength = 6;
|
|
let code = '';
|
|
for (let i = 0; i < codeLength; i++) {
|
|
code += Math.floor(Math.random() * 10); // Menghasilkan digit acak dari 0 hingga 9
|
|
}
|
|
return code;
|
|
}
|
|
|
|
function isValidEmail(email) {
|
|
// Ekspresi reguler untuk memeriksa validitas alamat email
|
|
var emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
|
|
// Menggunakan test() untuk memeriksa apakah email sesuai dengan ekspresi reguler
|
|
return emailRegex.test(email);
|
|
}
|
|
|
|
// Login Awal
|
|
$('#cekAkun').on('click', function() {
|
|
let email = document.querySelector('[name="email"]').value;
|
|
const csrfToken = $('meta[name="csrf-token"]').attr('content');
|
|
// Periksa apakah input email kosong
|
|
if (email.trim() === '') {
|
|
Swal.fire({
|
|
title: 'Gagal!',
|
|
text: 'Email tidak boleh kosong',
|
|
icon: 'error'
|
|
});
|
|
} else if (!isValidEmail(email)) {
|
|
Swal.fire({
|
|
title: 'Gagal!',
|
|
text: 'Gunakan format email yang benar. Cth: example@example.com',
|
|
icon: 'error'
|
|
});
|
|
} else {
|
|
try {
|
|
$.ajaxSetup({
|
|
headers: {
|
|
'X-CSRF-TOKEN': csrfToken
|
|
}
|
|
});
|
|
|
|
$.ajax({
|
|
url: "{{ route('status-akun') }}",
|
|
data: {
|
|
email: email
|
|
},
|
|
type: 'GET',
|
|
success: function(response) {
|
|
let status = response.message.status
|
|
if (response.status) {
|
|
Swal.fire({
|
|
title: 'Akun ditemukan',
|
|
text: 'Akun dengan email ' + email + (status ==
|
|
'Finished' ? ' siap digunakan' : (
|
|
status == 'Progress' ?
|
|
' masih proses verifikasi' :
|
|
' ditolak. Alasan: ' + response
|
|
.message.keterangan)),
|
|
icon: (status == 'Finished' ? 'success' : (
|
|
status == 'Progress' ? 'info' :
|
|
'error')),
|
|
confirmButtonText: 'OK'
|
|
});
|
|
|
|
} else {
|
|
Swal.fire({
|
|
title: 'Gagal',
|
|
text: response.message,
|
|
icon: 'error',
|
|
confirmButtonText: 'OK'
|
|
});
|
|
}
|
|
},
|
|
error: function(error) {
|
|
Swal.fire({
|
|
title: 'Gagal!',
|
|
text: 'Gagal memuat data karena ' + error,
|
|
icon: 'error',
|
|
confirmButtonText: 'OK',
|
|
});
|
|
}
|
|
});
|
|
} catch (error) {
|
|
Swal.fire({
|
|
title: 'Gagal!',
|
|
text: 'Gagal memuat data karena ' + error,
|
|
icon: 'error',
|
|
confirmButtonText: 'OK',
|
|
});
|
|
}
|
|
}
|
|
});
|
|
// Login Akhir
|
|
|
|
// Register Awal
|
|
$('#newEmail').on('input', function() {
|
|
const newEmail = $(this);
|
|
clearTimeout(newEmail.timer); // Menghapus timeout yang ada
|
|
const verificationButton = document.getElementById('verifikasiEmail');
|
|
verificationButton.disabled = true;
|
|
|
|
const email = newEmail.val().trim(); // Menghapus spasi di awal dan akhir
|
|
if (email != '' && isValidEmail(email)) {
|
|
// Menunggu 5 detik sebelum menghasilkan kode verifikasi
|
|
newEmail.timer = setTimeout(function() {
|
|
if (waktuSekarangDetik == 0) {
|
|
verificationStatus = false;
|
|
verificationButton.disabled = false;
|
|
verificationButton.innerHTML = 'Verifikasi';
|
|
}
|
|
}, 1000);
|
|
}
|
|
});
|
|
|
|
$('#verifikasiEmail').on('click', function() {
|
|
const newEmail = $(this);
|
|
const email = document.querySelector('[name="new_email"]').value;
|
|
const csrfToken = $('meta[name="csrf-token"]').attr('content');
|
|
verificationCode = generateVerificationCode();
|
|
verificationStatus = false
|
|
|
|
if (isValidEmail(email)) {
|
|
const formData = new FormData();
|
|
formData.append('email', email);
|
|
formData.append('code', verificationCode);
|
|
|
|
// Menonaktifkan tombol verifikasi
|
|
newEmail.prop('disabled', true);
|
|
|
|
// Mengatur waktu dalam detik (misalnya, 2 menit = 120 detik)
|
|
const waktuTotalDetik = 120;
|
|
waktuSekarangDetik = waktuTotalDetik;
|
|
|
|
// Mengupdate teks tombol dengan format menit:detik
|
|
function updateButtonText() {
|
|
const menit = Math.floor(waktuSekarangDetik / 60);
|
|
const detik = waktuSekarangDetik % 60 < 10 ? '0' + (waktuSekarangDetik % 60) :
|
|
waktuSekarangDetik % 60;
|
|
newEmail.text(`${menit}:${detik}`);
|
|
}
|
|
|
|
// Memulai timer dan mengupdate teks tombol setiap detik
|
|
const timerInterval = setInterval(function() {
|
|
if (waktuSekarangDetik > 0) {
|
|
waktuSekarangDetik--;
|
|
updateButtonText();
|
|
} else {
|
|
clearInterval(timerInterval);
|
|
newEmail.text("Verifikasi"); // Mengembalikan teks awal tombol
|
|
newEmail.prop('disabled', false); // Mengaktifkan kembali tombol
|
|
verificationStatus = false;
|
|
}
|
|
}, 1000); // Setiap 1 detik
|
|
|
|
$.ajaxSetup({
|
|
headers: {
|
|
'X-CSRF-TOKEN': csrfToken
|
|
}
|
|
});
|
|
|
|
$.ajax({
|
|
url: "{{ route('kirim-kode') }}",
|
|
type: 'POST',
|
|
data: formData,
|
|
contentType: false,
|
|
processData: false,
|
|
success: function(response) {
|
|
Swal.fire({
|
|
title: response.status ? 'Berhasil' : 'Gagal',
|
|
text: response.message,
|
|
icon: response.status ? 'success' : 'error',
|
|
});
|
|
},
|
|
error: function(error) {
|
|
Swal.fire({
|
|
title: 'Gagal',
|
|
text: 'Gagal karena kesalahan inputan atau jaringan',
|
|
icon: 'error',
|
|
});
|
|
verificationStatus = false;
|
|
},
|
|
});
|
|
} else {
|
|
Swal.fire({
|
|
title: 'Kesalahan',
|
|
text: 'Inputan yang anda masukan bukan alamat email. Silahkan masukan alamat email yang benar.',
|
|
icon: 'error'
|
|
});
|
|
verificationStatus = false;
|
|
}
|
|
|
|
|
|
});
|
|
|
|
$('#msform').on('submit', function(e) {
|
|
e.preventDefault();
|
|
const csrfToken = $('meta[name="csrf-token"]').attr('content');
|
|
let kode = $('#emailVerification').val();
|
|
|
|
let form = this;
|
|
|
|
if (!form.checkValidity()) {
|
|
form.reportValidity();
|
|
return;
|
|
}
|
|
|
|
// if (verificationCode == kode && waktuSekarangDetik > 0) {
|
|
// verificationStatus = true;
|
|
// }
|
|
|
|
let formData = new FormData(this);
|
|
// formData.append('kode_verifikasi', verificationCode);
|
|
// formData.append('verification_status', verificationStatus ? 'true' : 'false');
|
|
|
|
Swal.fire({
|
|
html: '<div class="mt-3"><lord-icon src="https://cdn.lordicon.com/etwtznjn.json" trigger="loop" colors="primary:#0ab39c,secondary:#405189" style="width:120px;height:120px"></lord-icon><div class="mt-4 pt-2 fs-15"><h4>Form Anda sedang diproses!</h4><p class="text-muted mx-4 mb-0">Mohon tunggu...</p></div></div>',
|
|
allowEscapeKey: false,
|
|
allowOutsideClick: false,
|
|
didOpen: () => {
|
|
Swal.showLoading();
|
|
}
|
|
});
|
|
|
|
$.ajaxSetup({
|
|
headers: {
|
|
'X-CSRF-TOKEN': csrfToken
|
|
}
|
|
});
|
|
|
|
$.ajax({
|
|
url: "{{ route('register') }}",
|
|
type: 'POST',
|
|
data: formData,
|
|
processData: false,
|
|
contentType: false,
|
|
success: function(response) {
|
|
Swal.fire({
|
|
title: response.status ? 'Berhasil' : 'Gagal',
|
|
text: response.message,
|
|
icon: response.status ? 'success' : 'error',
|
|
confirmButtonText: 'OK',
|
|
}).then(function() {
|
|
if (response.status) {
|
|
location.reload();
|
|
}
|
|
console.log(response);
|
|
});
|
|
},
|
|
error: function(error) {
|
|
if (error.responseJSON && error.responseJSON.errors) {
|
|
let errorMessage = "Terdapat beberapa kesalahan:<br>";
|
|
|
|
const errors = error.responseJSON.errors;
|
|
|
|
for (let key in errors) {
|
|
errorMessage += `${errors[key].join(', ')}<br>`;
|
|
}
|
|
|
|
Swal.fire({
|
|
title: "Gagal",
|
|
html: errorMessage,
|
|
icon: "error",
|
|
});
|
|
} else {
|
|
Swal.fire({
|
|
title: "Gagal",
|
|
text: "Gagal mengirimkan data karena " + error
|
|
.statusText,
|
|
icon: "error",
|
|
});
|
|
}
|
|
}
|
|
});
|
|
});
|
|
// Register Akhir
|
|
});
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|