diff --git a/app/Http/Controllers/Login/LoginController.php b/app/Http/Controllers/Login/LoginController.php index 651e0a0..75cda0f 100644 --- a/app/Http/Controllers/Login/LoginController.php +++ b/app/Http/Controllers/Login/LoginController.php @@ -94,6 +94,7 @@ class LoginController extends Controller public function register(Request $request) { + // return response()->json($request->all()); $request->validate( [ 'nama_depan' => ['required'], @@ -159,7 +160,7 @@ class LoginController extends Controller 'nohp.required' => 'No HP harus dimasukan.', 'nohp.min' => 'No HP memiliki minimal 10 angka.', - 'verification_status.boolean' => 'Masa berlaku kode verifikasi sudah habis. Silahkan lakukan verifikasi lagi.', + 'verification_status.in' => 'Masa berlaku kode verifikasi sudah habis. Silahkan lakukan verifikasi lagi.', ], ); diff --git a/public/assets/js/login_register/app.js b/public/assets/js/login_register/app.js index d81a384..b2a97be 100644 --- a/public/assets/js/login_register/app.js +++ b/public/assets/js/login_register/app.js @@ -128,6 +128,8 @@ document.addEventListener("DOMContentLoaded", function () { const startButtonKtp = document.getElementById("startButtonKtp"); const refreshButtonKtp = document.getElementById("refreshButtonKtp"); const imageHolderKtp = document.getElementById("imageHolderKtp"); + const selectImageKtp = document.getElementById("gambarKtp"); + const inputImageKtp = document.getElementById("ambilKtp"); const videoElementEkyc = document.getElementById("webcamEkyc"); const captureButtonEkyc = document.getElementById("captureButtonEkyc"); @@ -135,6 +137,8 @@ document.addEventListener("DOMContentLoaded", function () { const startButtonEkyc = document.getElementById("startButtonEkyc"); const refreshButtonEkyc = document.getElementById("refreshButtonEkyc"); const imageHolderEkyc = document.getElementById("imageHolderEkyc"); + const selectImageEkyc = document.getElementById("gambarEkyc"); + const inputImageEkyc = document.getElementById("ambilEkyc"); // Inisialisasi status kamera let ktpStream = null; @@ -175,6 +179,8 @@ document.addEventListener("DOMContentLoaded", function () { } startButtonKtp.addEventListener("click", function () { + clearPhoto(fotoInputKtp, document.getElementById("foto-preview-ktp")); + if (ktpStream) { // Matikan kamera jika sudah aktif turnOffCamera(ktpStream, videoElementKtp, startButtonKtp); @@ -186,6 +192,7 @@ document.addEventListener("DOMContentLoaded", function () { ktpStream = null; imageHolderKtp.style.display = "block"; captureButtonKtp.style.display = "none"; + selectImageKtp.style.display = "block"; } else { // Aktifkan kamera jika belum aktif navigator.mediaDevices @@ -195,6 +202,7 @@ document.addEventListener("DOMContentLoaded", function () { turnOnCamera(ktpStream, videoElementKtp, startButtonKtp); imageHolderKtp.style.display = "none"; captureButtonKtp.style.display = "block"; + selectImageKtp.style.display = "none"; }) .catch(function (error) { Swal.fire({ @@ -207,6 +215,8 @@ document.addEventListener("DOMContentLoaded", function () { }); startButtonEkyc.addEventListener("click", function () { + clearPhoto(fotoInputEkyc, document.getElementById("foto-preview-ekyc")); + if (ekycStream) { // Matikan kamera jika sudah aktif turnOffCamera(ekycStream, videoElementEkyc, startButtonEkyc); @@ -218,6 +228,7 @@ document.addEventListener("DOMContentLoaded", function () { ekycStream = null; imageHolderEkyc.style.display = "block"; captureButtonEkyc.style.display = "none"; + selectImageEkyc.style.display = "block"; } else { // Aktifkan kamera jika belum aktif navigator.mediaDevices @@ -227,6 +238,7 @@ document.addEventListener("DOMContentLoaded", function () { turnOnCamera(ekycStream, videoElementEkyc, startButtonEkyc); imageHolderEkyc.style.display = "none"; captureButtonEkyc.style.display = "block"; + selectImageEkyc.style.display = "none"; }) .catch(function (error) { Swal.fire({ @@ -265,6 +277,7 @@ document.addEventListener("DOMContentLoaded", function () { refreshButtonKtp.style.display = "none"; captureButtonKtp.style.display = "block"; startButtonKtp.style.display = "block"; + selectImageKtp.style.display = "none"; }); refreshButtonEkyc.addEventListener("click", function () { @@ -294,8 +307,22 @@ document.addEventListener("DOMContentLoaded", function () { refreshButtonEkyc.style.display = "none"; captureButtonEkyc.style.display = "block"; startButtonEkyc.style.display = "block"; + selectImageEkyc.style.display = "none"; }); + function dataURLtoBlob(dataURL) { + const byteString = atob(dataURL.split(",")[1]); + const mimeString = dataURL.split(",")[0].split(":")[1].split(";")[0]; + const ab = new ArrayBuffer(byteString.length); + const ia = new Uint8Array(ab); + + for (let i = 0; i < byteString.length; i++) { + ia[i] = byteString.charCodeAt(i); + } + + return new Blob([ab], { type: mimeString }); + } + captureButtonKtp.addEventListener("click", function () { if (ktpStream) { const canvas = document.createElement("canvas"); @@ -323,6 +350,7 @@ document.addEventListener("DOMContentLoaded", function () { refreshButtonKtp.style.display = "block"; captureButtonKtp.style.display = "none"; startButtonKtp.style.display = "none"; + selectImageKtp.style.display = "block"; } }); @@ -353,53 +381,96 @@ document.addEventListener("DOMContentLoaded", function () { refreshButtonEkyc.style.display = "block"; captureButtonEkyc.style.display = "none"; startButtonEkyc.style.display = "none"; + selectImageEkyc.style.display = "block"; } }); - //gambar untuk foto wajah - var uploadInput = document.getElementById('fotoEkyc'); - var imageHolder = document.getElementById('imageHolderEkyc'); - var gambarButton = document.getElementById('gambarEkyc'); - - gambarButton.addEventListener('click', function() { - uploadInput.click(); - }); - - uploadInput.addEventListener('change', function(event) { - var file = event.target.files[0]; + // gambar untuk foto wajah + inputImageKtp.addEventListener("change", function (event) { + const file = event.target.files[0]; + imageHolderKtp.style.display = "none"; if (file) { - var reader = new FileReader(); - reader.onload = function() { - imageHolder.src = reader.result; // Mengubah sumber gambar pada elemen img dengan ID imageHolderEkyc + const reader = new FileReader(); + + reader.onload = function (event) { + const imageDataUrl = event.target.result; + + // Buat elemen gambar sementara + const img = new Image(); + + img.onload = function () { + const canvas = document.createElement("canvas"); + const ctx = canvas.getContext("2d"); + + // Set ukuran canvas sesuai dengan gambar + canvas.width = img.width; + canvas.height = img.height; + + // Gambar gambar ke dalam canvas + ctx.drawImage(img, 0, 0); + + // Ambil data URL dalam format JPEG dari canvas + const fotoDataUrl = canvas.toDataURL("image/jpeg"); + + const fotoPreview = + document.getElementById("foto-preview-ktp"); + fotoPreview.innerHTML = + 'Foto'; + + fotoInputKtp.value = fotoDataUrl; + }; + + // Set data URL gambar ke elemen gambar + img.src = imageDataUrl; }; - reader.readAsDataURL(file); // Membaca file gambar sebagai URL data + reader.readAsDataURL(file); } }); - //gambar foto ktp - var uploadInput = document.getElementById('fotoKtp'); - var imageHolder = document.getElementById('imageHolderKtp'); - var gambarButton = document.getElementById('gambarKtp'); - - gambarButton.addEventListener('click', function() { - uploadInput.click(); - }); - - uploadInput.addEventListener('change', function(event) { - var file = event.target.files[0]; + inputImageEkyc.addEventListener("change", function (event) { + const file = event.target.files[0]; + imageHolderEkyc.style.display = "none"; if (file) { - var reader = new FileReader(); - reader.onload = function() { - imageHolder.src = reader.result; // Mengubah sumber gambar pada elemen img dengan ID imageHolderEkyc + const reader = new FileReader(); + + reader.onload = function (event) { + const imageDataUrl = event.target.result; + + // Buat elemen gambar sementara + const img = new Image(); + + img.onload = function () { + const canvas = document.createElement("canvas"); + const ctx = canvas.getContext("2d"); + + // Set ukuran canvas sesuai dengan gambar + canvas.width = img.width; + canvas.height = img.height; + + // Gambar gambar ke dalam canvas + ctx.drawImage(img, 0, 0); + + // Ambil data URL dalam format JPEG dari canvas + const fotoDataUrl = canvas.toDataURL("image/jpeg"); + + const fotoPreview = + document.getElementById("foto-preview-ekyc"); + fotoPreview.innerHTML = + 'Foto'; + + fotoInputEkyc.value = fotoDataUrl; + }; + + // Set data URL gambar ke elemen gambar + img.src = imageDataUrl; }; - reader.readAsDataURL(file); // Membaca file gambar sebagai URL data + reader.readAsDataURL(file); } }); - }); /****************************************** * END KTP & E-KYC CAMERA diff --git a/resources/views/User/transaction/Pembeli/new-transaction.blade.php b/resources/views/User/transaction/Pembeli/new-transaction.blade.php index cfc9ee5..2c267af 100644 --- a/resources/views/User/transaction/Pembeli/new-transaction.blade.php +++ b/resources/views/User/transaction/Pembeli/new-transaction.blade.php @@ -391,7 +391,6 @@ icon: "error", }); } - console.log(error); }, }); }); diff --git a/resources/views/index.blade.php b/resources/views/index.blade.php index ce13449..ccd2fa3 100644 --- a/resources/views/index.blade.php +++ b/resources/views/index.blade.php @@ -141,26 +141,25 @@
+ name="nama_depan" />
+ name="nama_belakang">
+ oninput="this.value = this.value.replace(/[^0-9]/g, '').substring(0, 16);" />
+ id="newEmail">
@@ -169,20 +168,20 @@
+ placeholder="Nomer Telepon. cth: 08xxx" name="nohp">
@@ -190,8 +189,7 @@
@@ -230,14 +228,14 @@
+ style="width: 190%; padding: 0rem 1rem;"> @@ -246,7 +244,7 @@
-
+

Foto KTP Anda

- -
+ +
- +
-
+

Foto Wajah Anda

- logo ambil gambar
- -
+ +
- +
@@ -665,17 +667,34 @@ confirmButtonText: 'OK', }).then(function() { if (response.status) { + console.log(response); location.reload(); } }); }, error: function(error) { - Swal.fire({ - title: 'Gagal', - text: 'Ada form yang kosong atau kesalahan internet. penyebab ' + - error, - icon: 'error', - }); + if (error.responseJSON && error.responseJSON.errors) { + let errorMessage = "Terdapat beberapa kesalahan:
"; + + const errors = error.responseJSON.errors; + + for (let key in errors) { + errorMessage += `${errors[key].join(', ')}
`; + } + + Swal.fire({ + title: "Gagal", + html: errorMessage, + icon: "error", + }); + } else { + Swal.fire({ + title: "Gagal", + text: "Gagal mengirimkan data karena " + error + .statusText, + icon: "error", + }); + } } }); });