MAGANG_TB_dan_PNP_2023/dashboard-admin
3
0
Fork 2
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

Register dan verifikasi akun

Browse Source
This commit is contained in:
Muhammad Raihan Surya 2023-09-12 13:52:47 +07:00
parent 3b29fc2e10
commit c6e7e74f2a
29 changed files with 7725 additions and 1067 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/Http/Controllers/Admin/AdminDashboardController.php
View File

@ -14,4 +14,8 @@ class AdminDashboardController extends Controller
"transaction"=>Transactions::allTransactions() "transaction"=>Transactions::allTransactions()
]); ]);
} }
public function profile(){
return view('admin.profile.index');
}
} }

67
app/Http/Controllers/Admin/AdminUserController.php
View File

@ -13,7 +13,14 @@ class AdminUserController extends Controller
*/ */
public function index() public function index()
{ {
$users = User::where('role','User')->get(); // $users = User::where('role', 'User')
// ->orderByRaw("FIELD(status, 'Progress', 'Finished', 'Rejected') ASC")
// ->latest()
// ->get();
$users = User::where('role', 'User')
->orderByRaw("CASE WHEN status = 'Progress' THEN 1 WHEN status = 'Finished' THEN 2 WHEN status = 'Rejected' THEN 3 ELSE 4 END ASC")
->latest()
->get();
return view('admin.users.index', ['users' => $users]); return view('admin.users.index', ['users' => $users]);
} }
@ -39,7 +46,7 @@ class AdminUserController extends Controller
public function show($id) public function show($id)
{ {
$user = User::find($id); $user = User::find($id);
return view('admin.users.detail-user',['user'=>$user]); return view('admin.users.detail-user', ['user' => $user]);
} }
/** /**
@ -66,51 +73,53 @@ class AdminUserController extends Controller
*/ */
public function destroy($id) public function destroy($id)
{ {
try{ try {
$result = User::destroy($id); $result = User::destroy($id);
if($result){ if ($result) {
return response()->json([ return response()->json([
'message' => 'Berhasil hapus data', 'message' => 'Berhasil hapus data',
'status' => true 'status' => true,
]); ]);
} }
}catch(\Exception $e){ } catch (\Exception $e) {
return response()->json([ return response()->json([
'message' => 'Gagal hapus data, karena '.$e, 'message' => 'Gagal hapus data, karena ' . $e,
'status' => false
]);
}
}
public function approveUser($id){
$user = User::findOrFail($id);
$user->status = 'Finished';
$result = $user->save();
if($result){
return response()->json([
'message' => "Akun telah disetujui dan dapat digunakan",
'status' => true,
]);
}else{
return response()->json([
'message' => "Akun gagal disetujui karena "+$result,
'status' => false, 'status' => false,
]); ]);
} }
} }
public function denyUser($id){ public function approveUser($id)
{
$user = User::findOrFail($id);
$user->status = 'Finished';
$result = $user->save();
if ($result) {
return response()->json([
'message' => 'Akun telah disetujui dan dapat digunakan',
'status' => true,
]);
} else {
return response()->json([
'message' => 'Akun gagal disetujui karena ' + $result,
'status' => false,
]);
}
}
public function denyUser($id)
{
$user = User::findOrFail($id); $user = User::findOrFail($id);
$user->status = 'Rejected'; $user->status = 'Rejected';
$result = $user->save(); $result = $user->save();
if($result){ if ($result) {
return response()->json([ return response()->json([
'message' => "Akun telah ditolak dan tidak dapat digunakan", 'message' => 'Akun telah ditolak dan tidak dapat digunakan',
'status' => true, 'status' => true,
]); ]);
}else{ } else {
return response()->json([ return response()->json([
'message' => "Akun gagal ditolak karena "+$result, 'message' => 'Akun gagal ditolak karena ' + $result,
'status' => false, 'status' => false,
]); ]);
} }

273
app/Http/Controllers/Login/LoginController.php
View File

@ -16,6 +16,7 @@ use Laravolt\Indonesia\Models\City;
use Laravolt\Indonesia\Models\District; use Laravolt\Indonesia\Models\District;
use Laravolt\Indonesia\Models\Province; use Laravolt\Indonesia\Models\Province;
use Laravolt\Indonesia\Models\Village; use Laravolt\Indonesia\Models\Village;
use Ramsey\Uuid\Uuid;
class LoginController extends Controller class LoginController extends Controller
{ {
@ -66,9 +67,10 @@ class LoginController extends Controller
} }
} }
return redirect()->back() return redirect()
->back()
->withErrors([ ->withErrors([
'email' => 'Email dengan'.$credentials['email'].' tidak tersedia.', 'email' => 'Email dengan' . $credentials['email'] . ' tidak tersedia.',
]) ])
->onlyInput('email'); ->onlyInput('email');
} }
@ -91,127 +93,176 @@ class LoginController extends Controller
public function register(Request $request) public function register(Request $request)
{ {
dd($request); // input
// $validatedData = $request->validate([ $nama_depan = $request->get('nama-depan');
// 'nama' => 'required|max:255', $nama_belakang = $request->get('nama-belakang');
// 'email' => 'required|string|email|unique:users', $tanggal_lahir = $request->get('tanggal-lahir');
// 'password' => 'required|string|min:8', $new_password = $request->get('new-password');
// 'nohp' => 'required', $nik = $request->get('nik');
// 'nik' => 'required', $email = $request->get('email');
// 'alamat' => 'required', $nohp = $request->get('nohp');
// 'foto_ktp' => 'required|image|mimes:jpeg,svg,png,jpg', $alamat = $request->get('alamat');
// 'foto_wajah' => 'required|image|mimes:jpeg,svg,png,jpg', $foto_ktp = '';
// 'foto_profil' => 'image|mimes:jpeg,svg,png,jpg', $foto_wajah = '';
// 'gender' => 'required', $persentase_kemiripan = '0%';
$gender = $request->get('gender');
$kode_kelurahan = $request->get('kode-kelurahan');
$ktpBase64 = $request->request->get('ktp');
$wajahBase64 = $request->request->get('wajah');
$validatedData['email_verified_at'] = now();
if ($ktpBase64 && $wajahBase64) {
// Konversi string Base64 ke file gambar
$ktpFile = base64_decode(preg_replace('#^data:image/\w+;base64,#i', '', $ktpBase64));
$wajahFile = base64_decode(preg_replace('#^data:image/\w+;base64,#i', '', $wajahBase64));
$foto_ktp = 'Foto-KTP-' . $nama_depan . '-' . $nama_belakang . '.jpg';
$foto_wajah = 'Foto-Wajah-' . $nama_depan . '-' . $nama_belakang . '.jpg';
file_put_contents(public_path('storage/foto-ktp/' . $foto_ktp), $ktpFile);
file_put_contents(public_path('storage/foto-wajah/' . $foto_wajah), $wajahFile);
}
//OCR
try {
$fotoKTP = public_path('storage/foto-ktp/' . $foto_ktp);
$image = Image::make($fotoKTP);
$image->greyscale(); // Convert to grayscale
$image->contrast(10); // Increase contrast, adjust the value as needed
$preprocessedfotoKTP = storage_path('preprocessed_image.jpg');
$image->save($preprocessedfotoKTP);
$result = (new TesseractOCR($preprocessedfotoKTP))->run();
// (5) Normalize
$lines = explode("\n", $result);
$nikOCR = '';
$nikInputan = $nik;
$namaInputan = $nama_depan.' '.$nama_belakang;
foreach ($lines as $line) {
// Mencari NIK
if (strpos($line, $nikInputan) !== false) {
$nikOCR = preg_replace('/[^0-9]/', '', $line);
}
// Mencari nama
if (strpos($line, $namaInputan) !== false) {
$namaOCR = trim(substr($line, strpos($line, ':') + 1));
}
}
//Selesai
$persentase_kemiripan = (similar_text($nikInputan, $nikOCR, $percent) + similar_text($namaOCR, $namaOCR, $percent))/2;
// $status = 'Progress';
// if (similar_text($nikInputan, $nikOCR, $percent) >= 70 && similar_text($namaOCR, $namaOCR, $percent) >= 70) {
// $status = 'Progress';
// } else {
// $status = 'Progress';
// }
} catch (\Exception $e) {
// $status = 'Progress';
}
//OCR
//Deteksi wajah belum
$password = Hash::make($new_password);
// return response()->json([
// 'status' => true,
// 'message' => Uuid::uuid4(),
// ]); // ]);
$result = User::create([
'id' => Uuid::uuid4(),
'nama_depan' => $nama_depan,
'nama_belakang' => $nama_belakang,
'tanggal_lahir' => $tanggal_lahir,
'email' => $email,
'email_verified_at' => now(),
'password' => $password,
'nohp' => $nohp,
'nik' => $nik,
'alamat' => $alamat,
'foto_ktp' => $foto_ktp,
'foto_wajah' => $foto_wajah,
'foto_profil' => null,
'persentase_kemiripan' => $persentase_kemiripan,
'gender' => $gender,
'kode_kelurahan' => $kode_kelurahan,
'remember_token' => Str::random(10),
]);
// // $validatedData['email_verified_at'] = now(); if ($result) {
return response()->json([
// $validatedData['foto-ktp'] = ''; 'status' => true,
// $validatedData['foto-wajah'] = ''; 'message' => 'Akun anda sudah terdaftar dan butuh verifikasi hingga maksimal 1 hari kerja',
// $validatedData['foto-profil'] =''; ]);
// if ($request->hasFile('foto_ktp') && $request->hasFile('foto_wajah')) { } else {
// // $namaGambarOri = $request->file('foto-gambar')->getClientOriginalName(); return response()->json([
// // $namaGambar = round(microtime(true) * 1000) . '-' . str_replace(' ', '-', $namaGambarOri); 'status' => false,
// $tipeFotoKtp = $request->file('foto_ktp')->getClientMimeType(); 'message' => 'Akun anda gagal terdaftar. Coba lagi! ' + $result,
// $tipeFotoWajah = $request->file('foto_wajah')->getClientMimeType(); ]);
// $validatedData['foto-ktp'] = 'Foto-KTP-' . $request->nama . '.' . $tipeFotoKtp; }
// $validatedData['foto-wajah'] = 'Foto-Wajah' . $request->nama . '.' . $tipeFotoWajah;
// // Simpan foto
// $request->file('foto-ktp')->storeAs('public/foto-ktp', $validatedData['foto-ktp']);
// $request->file('foto-wajah')->storeAs('public/foto-wajah', $validatedData['foto-wajah']);
// }
// if($request->hasFile('foto_profil')){
// $tipeFotoProfil = $request->file('foto_profil')->getClientMimeType();
// $validatedData['foto-profil'] = 'Foto-Profil-' . $request->nama . '.' . $tipeFotoProfil;
// // Simpan foto
// $request->file('foto-profil')->storeAs('public/foto-profil', $validatedData['foto-profil']);
// }
// //OCR
// try {
// $imagePath = storage_path('foto-ktp/' . $validatedData['foto-ktp']);
// $image = Image::make($imagePath);
// $image->greyscale(); // Convert to grayscale
// $image->contrast(10); // Increase contrast, adjust the value as needed
// $preprocessedImagePath = storage_path('preprocessed_image.jpg');
// $image->save($preprocessedImagePath);
// $result = (new TesseractOCR($preprocessedImagePath))->run();
// // (5) Normalize
// $lines = explode("\n", $result);
// $nikOCR = '';
// $nikInputan = $request->nik;
// $namaInputan = $request->nama;
// foreach ($lines as $line) {
// // normalize NIK
// if (strpos($line, 'NIK') !== false) {
// $nikOCR = preg_replace('/[^0-9]/', '', $line);
// }
// // Mencari nama
// if (strpos($line, $namaInputan) !== false) {
// $namaOCR = trim(substr($line, strpos($line, ':') + 1));
// }
// }
// //Selesai
// $percent = 0.0;
// if (similar_text($nikInputan, $nikOCR, $percent) >= 70 && similar_text($namaOCR, $namaOCR, $percent) >= 70) {
// $validatedData['status'] = 'Progress';
// } else {
// $validatedData['status'] = 'Pending';
// }
// } catch (\Exception $e) {
// $validatedData['status'] = 'Pending';
// }
// //OCR
// //Deteksi wajah belum
// $validatedData['remember_token'] = Str::random(10);
// $validatedData['password'] = Hash::make($request->password);
// User::create([
// 'id' => Str::uuid(),
// 'nama' => $validatedData['nama'],
// 'email' => $validatedData['email'],
// 'email_verified_at' => null,
// 'password' => $validatedData['password'],
// 'role' => 'User',
// 'nohp' => $validatedData['nohp'],
// 'nik' => $validatedData['nik'],
// 'alamat' => $validatedData['alamat'],
// 'foto_ktp' => $validatedData['foto-ktp'],
// 'foto_wajah' => $validatedData['foto-wajah'],
// 'foto_profil' => $validatedData['foto-profil'],
// 'status' => $validatedData['status'],
// 'gender' => $validatedData['gender'],
// 'remember_token' => Str::random(10),
// ]);
// return redirect('/login')->with('daftar', 'Daftar berhasil, silahkan login');
} }
public function statusAkun($email){ public function statusAkun($email)
$result = User::where('email',$email)->get(); {
if($result->isNotEmpty()){ $result = User::where('email', $email)->get();
if ($result->isNotEmpty()) {
return response()->json([ return response()->json([
'status' => true, 'status' => true,
'message' => $result, 'message' => $result,
]); ]);
}else{ } else {
return response()->json([ return response()->json([
'status' => false, 'status' => false,
'message' => $result, 'message' => $result,
]); ]);
} }
} }
public function cariProvinsi()
{
$data = Province::where('name', 'LIKE', '%' . strtoupper(request('q')) . '%')->paginate(10);
return response()->json($data);
}
public function cariKota($code)
{
$data = City::where('province_code', $code)
->where('name', 'LIKE', '%' . strtoupper(request('q')) . '%')
->paginate(10);
return response()->json($data);
}
public function cariKecamatan($code)
{
$data = District::where('city_code', $code)
->where('name', 'LIKE', '%' . strtoupper(request('q')) . '%')
->paginate(10);
return response()->json($data);
}
public function cariKelurahan($code)
{
$data = Village::where('district_code', $code)
->where('name', 'LIKE', '%' . strtoupper(request('q')) . '%')
->paginate(10);
return response()->json($data);
}
} }

84
app/Http/Controllers/User/UserContactController.php
View File

@ -3,6 +3,7 @@
namespace App\Http\Controllers\User; namespace App\Http\Controllers\User;
use App\Models\Contact; use App\Models\Contact;
use App\Models\User;
use App\Http\Controllers\Controller; use App\Http\Controllers\Controller;
use Illuminate\Http\Request; use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth; use Illuminate\Support\Facades\Auth;
@ -14,8 +15,9 @@ class UserContactController extends Controller
*/ */
public function index() public function index()
{ {
$contacts = Contact::where('pemilik_kontak',Auth::user()->email); $contacts = Contact::where('pemilik_kontak', Auth::user()->email)->get();
return view('user.contact.index',['contacts'=>$contacts]); return view('user.contact.index', ['contacts' => $contacts]);
// dd($contacts);
} }
/** /**
@ -31,21 +33,29 @@ class UserContactController extends Controller
*/ */
public function store(Request $request) public function store(Request $request)
{ {
$result = Contact::create([ $email_relasi = $request->input('email');
'pemilik_kontak' => Auth::user()->email, if($email_relasi == Auth::user()->email){
'relasi_kontak' => $request->relasi_kontak,
]);
if($result){
return response()->json([
'status' => true,
'message' => $result,
]);
}else{
return response()->json([ return response()->json([
'status' => false, 'status' => false,
'message' => $result, 'message' => 'Kontak yang ingin didaftarkan tidak boleh sama',
]); ]);
}else{
$result = Contact::create([
'pemilik_kontak' => Auth::user()->email,
'relasi_kontak' => $request->input('email'),
]);
if($result){
return response()->json([
'status' => true,
'message' => 'Akun berhasil masuk ke kontak',
]);
}else{
return response()->json([
'status' => false,
'message' => 'Akun gagal masuk ke kontak',
]);
}
} }
} }
@ -54,7 +64,7 @@ class UserContactController extends Controller
*/ */
public function show(Contact $contact) public function show(Contact $contact)
{ {
//
} }
/** /**
@ -78,16 +88,46 @@ class UserContactController extends Controller
*/ */
public function destroy(Contact $contact, $id) public function destroy(Contact $contact, $id)
{ {
try{ try {
Contact::destroy($id); $result = Contact::destroy($id);
if($result){
return response()->json([
'message' => 'Berhasil hapus data',
'status' => true,
]);
}else{
return response()->json([
'message' => 'Gagal hapus data karena '.$result,
'status' => false,
]);
}
} catch (\Exception $e) {
return response()->json([ return response()->json([
'message' => 'Berhasil hapus data', 'message' => 'Gagal hapus data, karena ' . $e,
'status' => true 'status' => false,
]); ]);
}catch(\Exception $e){ }
}
public function cekEmail($email)
{
$result = User::where('email', $email)->get();
if ($result->isNotEmpty() && $result[0]->role == 'User') {
if($result[0]->status == 'Finished'){
return response()->json([
'status' => true,
'message' => $result,
]);
}else{
return response()->json([
'status' => false,
'message' => 'Akun dengen email ' . $email . ' tersedia dan belum diverifikasi',
]);
}
} else {
return response()->json([ return response()->json([
'message' => 'Gagal hapus data, karena '.$e, 'status' => false,
'status' => false 'message' => 'Akun dengen email ' . $email . ' tidak tersedia',
]); ]);
} }
} }

4
app/Http/Controllers/User/UserDashboardController.php
View File

@ -13,4 +13,8 @@ class UserDashboardController extends Controller
"refundUserss"=>RefundUser::HistoryRefundUser() "refundUserss"=>RefundUser::HistoryRefundUser()
]); ]);
} }
public function profile(){
return view('user.profile.index');
}
} }

2
app/Http/Kernel.php
View File

@ -64,5 +64,7 @@ class Kernel extends HttpKernel
'signed' => \App\Http\Middleware\ValidateSignature::class, 'signed' => \App\Http\Middleware\ValidateSignature::class,
'throttle' => \Illuminate\Routing\Middleware\ThrottleRequests::class, 'throttle' => \Illuminate\Routing\Middleware\ThrottleRequests::class,
'verified' => \Illuminate\Auth\Middleware\EnsureEmailIsVerified::class, 'verified' => \Illuminate\Auth\Middleware\EnsureEmailIsVerified::class,
'admin' => \App\Http\Middleware\Admin::class,
'user' => \App\Http\Middleware\User::class,
]; ];
} }

9
app/Models/Contact.php
View File

@ -20,12 +20,13 @@ class Contact extends Model
]; ];
//Relasi //Relasi
public function pemilik_kontak(){ public function pemilikKontak(){
return $this->belongsTo(User::class, 'email', 'pemilik_kontak'); return $this->belongsTo(User::class, 'pemilik_kontak', 'email');
} }
public function relasi_kontak(){ public function relasiKontak(){
return $this->belongsTo(User::class, 'email', 'relasi_kontak'); return $this->belongsTo(User::class, 'relasi_kontak', 'email');
} }
//Relasi //Relasi
} }

16
app/Models/User.php
View File

@ -20,19 +20,24 @@ class User extends Authenticatable
* @var array<int, string> * @var array<int, string>
*/ */
protected $fillable = [ protected $fillable = [
'id',
'nama_depan', 'nama_depan',
'nama_belakang', 'nama_belakang',
'tanggal_lahir', 'tanggal_lahir',
'nik',
'email', 'email',
'password', 'password',
'role_id', 'role',
'nohp',
'alamat', 'alamat',
'foto_ktp', 'foto_ktp',
'foto_wajah', 'foto_wajah',
'nohp', 'foto_profil',
'nik', 'persentase_kemiripan',
'gender',
'status', 'status',
'gender',
'kode_kelurahan',
'remember_token',
]; ];
/** /**
@ -54,6 +59,7 @@ class User extends Authenticatable
'email_verified_at' => 'datetime', 'email_verified_at' => 'datetime',
'password' => 'hashed', 'password' => 'hashed',
'id' => 'string', 'id' => 'string',
'status' => 'string',
]; ];
//JWT //JWT
@ -99,7 +105,7 @@ class User extends Authenticatable
} }
public function village(){ public function village(){
return $this->belongsTo('Laravolt\Indonesia\Models\Village', 'code', 'kode_kelurahan'); return $this->belongsTo('Laravolt\Indonesia\Models\Village', 'kode_kelurahan', 'code');
} }
//Relasi //Relasi

1
database/factories/UserFactory.php
View File

@ -30,6 +30,7 @@ class UserFactory extends Factory
'nik' => $this->faker->nik($this->faker->randomElement(['male', 'female']),$this->faker->dateTimeBetween('-65 years', '-18 years')), 'nik' => $this->faker->nik($this->faker->randomElement(['male', 'female']),$this->faker->dateTimeBetween('-65 years', '-18 years')),
'alamat'=> $this->faker->address, 'alamat'=> $this->faker->address,
'nohp'=> $this->faker->phoneNumber(), 'nohp'=> $this->faker->phoneNumber(),
'persentase_kemiripan' => random_int(0, 100).'%',
'status'=> $this->faker->randomElement(['Progress', 'Finished', 'Rejected']), 'status'=> $this->faker->randomElement(['Progress', 'Finished', 'Rejected']),
'gender' => $this->faker->randomElement(['Laki-laki', 'Perempuan']), 'gender' => $this->faker->randomElement(['Laki-laki', 'Perempuan']),
'kode_kelurahan' => '1101012002', 'kode_kelurahan' => '1101012002',

3
database/migrations/2014_10_12_000000_create_users_table.php
View File

@ -19,13 +19,14 @@ return new class extends Migration
$table->string('email',50)->unique(); $table->string('email',50)->unique();
$table->timestamp('email_verified_at')->nullable(); $table->timestamp('email_verified_at')->nullable();
$table->string('password'); $table->string('password');
$table->string('role',10); $table->enum('role',['Admin','User'])->default('User');
$table->string('nohp',20); $table->string('nohp',20);
$table->string('nik',20); $table->string('nik',20);
$table->string('alamat',255); $table->string('alamat',255);
$table->string('foto_ktp')->nullable(); $table->string('foto_ktp')->nullable();
$table->string('foto_wajah')->nullable(); $table->string('foto_wajah')->nullable();
$table->string('foto_profil')->nullable(); $table->string('foto_profil')->nullable();
$table->string('persentase_kemiripan')->nullable();
$table->enum('status',['Finished','Progress','Rejected'])->default('Progress'); $table->enum('status',['Finished','Progress','Rejected'])->default('Progress');
$table->string('gender',15); $table->string('gender',15);
$table->char('kode_kelurahan',10); $table->char('kode_kelurahan',10);

1
database/seeders/DatabaseSeeder.php
View File

@ -37,6 +37,7 @@ class DatabaseSeeder extends Seeder
'alamat'=> $faker->address, 'alamat'=> $faker->address,
'nohp'=> $faker->phoneNumber(), 'nohp'=> $faker->phoneNumber(),
'status'=> 'Finished', 'status'=> 'Finished',
'persentase_kemiripan' => '100%',
'gender' => $faker->randomElement(['Laki-laki', 'Perempuan']), 'gender' => $faker->randomElement(['Laki-laki', 'Perempuan']),
'kode_kelurahan' => '1101012002', 'kode_kelurahan' => '1101012002',
]); ]);

338
public/assets/css/login_register/style.css
View File

@ -21,6 +21,15 @@ input {
font-family: "Poppins", sans-serif; font-family: "Poppins", sans-serif;
} }
input[type="text"] {
border: none;
outline: 0;
}
video {
background: primary;
}
.container { .container {
position: relative; position: relative;
width: 100%; width: 100%;
@ -164,6 +173,7 @@ form p {
color: #aaa; color: #aaa;
font-weight: 500; font-weight: 500;
} }
.error { .error {
display: none; display: none;
} }
@ -200,7 +210,8 @@ form p {
transform: translateY(-0.252m); transform: translateY(-0.252m);
} }
.btn-otp { .btn-otp,
.btn-foto {
width: fit-content; width: fit-content;
height: fit-content; height: fit-content;
margin-left: 2%; margin-left: 2%;
@ -350,16 +361,16 @@ form p {
@media (max-width: 1100px) { @media (max-width: 1100px) {
.container { .container {
min-height: 800px; min-height: 1000px;
height: 100vh; height: 100vh;
} }
.container.sign-up-mode .right-panel { form.sign-in-form {
padding-top: 0; justify-content: start;
} }
.header { .header {
padding: 0px; padding: 0;
} }
.header ul li div { .header ul li div {
@ -386,8 +397,6 @@ form p {
.panel { .panel {
flex-direction: row; flex-direction: row;
justify-content: space-around; justify-content: space-around;
align-items: center;
padding: 2.5rem 8%;
grid-column: 1 / 2; grid-column: 1 / 2;
} }
@ -439,7 +448,7 @@ form p {
.container.sign-up-mode:before { .container.sign-up-mode:before {
transform: translate(-50%, 100%); transform: translate(-50%, 100%);
bottom: 32%; bottom: 26%;
right: initial; right: initial;
} }
@ -464,9 +473,13 @@ form p {
} }
} }
@media (max-width: 700px) { @media (max-width: 740px) {
form { .form_4 div {
padding: 0 1.5rem; width: 90%;
}
.btns_wrap .common_btns.form_4_btns {
width: 90%;
} }
.image { .image {
@ -490,7 +503,7 @@ form p {
} }
} }
//MULTIPLE PROGGRESS BAR /* // MULTIPLE PROGGRESS BAR */
.wrapper { .wrapper {
width: fit-content; width: fit-content;
max-width: 100%; max-width: 100%;
@ -502,7 +515,6 @@ form p {
.header { .header {
display: flex; display: flex;
justify-content: center; justify-content: center;
padding: 1rem 0;
} }
.header ul { .header ul {
@ -557,10 +569,6 @@ form p {
background: var(--primary); background: var(--primary);
} }
.form_wrap {
margin-bottom: 35px;
}
.form_wrap h2 { .form_wrap h2 {
color: var(--header-clr); color: var(--header-clr);
text-align: start; text-align: start;
@ -617,8 +625,8 @@ form p {
} }
.btns_wrap .common_btns.form_3_btns { .btns_wrap .common_btns.form_3_btns {
width: 125%; width: 60%;
margin-top: 7%; margin-top: 2%;
} }
.btns_wrap .common_btns button { .btns_wrap .common_btns button {
@ -666,14 +674,16 @@ form p {
.btns_wrap .common_btns button.btn_next:hover, .btns_wrap .common_btns button.btn_next:hover,
.btns_wrap .common_btns button.btn_done:hover { .btns_wrap .common_btns button.btn_done:hover {
background: var(--next-btn-hover); background: var(--next-btn-hover);
box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px; box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px,
rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
-webkit-transform: translateY(-0.22em); -webkit-transform: translateY(-0.22em);
transform: translateY(-0.252m); transform: translateY(-0.252m);
} }
.btns_wrap .common_btns button.btn_back:hover { .btns_wrap .common_btns button.btn_back:hover {
background: var(--back-btn-hover); background: var(--back-btn-hover);
box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px; box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px,
rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
-webkit-transform: translateY(-0.22em); -webkit-transform: translateY(-0.22em);
transform: translateY(-0.252m); transform: translateY(-0.252m);
} }
@ -741,6 +751,45 @@ form p {
/****************************************** /******************************************
/* END DROPDOWN INPUT /* END DROPDOWN INPUT
==================================================*/ ==================================================*/
.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;
}
.gender-select-menu, .gender-select-menu,
.select-menu { .select-menu {
height: 100%; height: 100%;
@ -820,225 +869,72 @@ form p {
==================================================*/ ==================================================*/
/****************************************** /******************************************
/* DROP IMAGE /* SLIDER
==================================================*/ ==================================================*/
.container-image { .slider-container {
padding: 28px; position: relative;
border-radius: 25px; max-width: 60%;
background: #fff; overflow: hidden;
}
.drop-area {
width: 125%;
height: 300px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center;
justify-content: center; justify-content: center;
background: white; align-items: center;
padding: 20px;
border-radius: 1.5rem;
text-align: center;
color: #999;
cursor: pointer;
border: 2px dashed #999;
position: relative;
overflow: hidden;
} }
.drop-area-title { .slider {
font-size: 1.2rem;
font-weight: 600;
margin-bottom: 16px;
pointer-events: none;
}
.drop-area-text {
font-size: 0.7rem;
}
.thumbnail,
.img-name {
position: absolute;
display: flex; display: flex;
justify-content: center;
align-items: center; transition: transform 0.5s ease-in-out;
}
.slide {
flex: 0 0 100%;
}
.slider h3 {
margin: 1rem 0;
}
.slide img {
width: 100%; width: 100%;
height: 100%; height: auto;
top: 0;
left: 0;
z-index: 5;
} }
.thumbnail {
height: 100%; .dots {
display: flex; display: flex;
justify-content: center;
align-items: center; align-items: center;
object-fit: cover; width: fit-content;
z-index: 6; margin-top: 1rem;
} }
.drop-area:hover .img-name { .dot {
opacity: 1; display: inline-block;
width: 10px;
height: 10px;
margin: 0 5px;
background-color: #bbb;
border-radius: 50%;
cursor: pointer;
} }
.clickable-button { .prev,
padding: 10px 20px; .next {
margin-top: 3%; font-size: 1rem;
background-color: #007bff; background: none;
color: #fff;
border: none; border: none;
border-radius: 5px;
cursor: pointer; cursor: pointer;
font-size: 14px; margin: 0 1rem;
font-weight: 500;
width: 8rem;
transition: background-color 0.3s ease-in-out;
} }
.clickable-button:hover { .dot.active {
background-color: #0056b3; background-color: #900c3e;
}
#webcamKtp,
#webcamEkyc {
height: 30vh;
border-radius: 1rem;
} }
/****************************************** /******************************************
/* END DROP IMAGE /* END SLIDER
==================================================*/
/******************************************
/* preloader
==================================================*/
#preloader {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #fff;
z-index: 10000;
}
#status,
.preloader {
top: 50%;
left: 50%;
position: absolute;
}
#status {
width: 100px;
height: 100px;
background-repeat: no-repeat;
background-position: center;
margin: -50px 0 0 -50px;
}
.preloader {
height: 40px;
width: 40px;
margin-top: -20px;
margin-left: -20px;
}
.preloader:before {
content: "";
display: block;
position: absolute;
left: -1px;
top: -1px;
height: 100%;
width: 100%;
-webkit-animation: rotation 1s linear infinite;
animation: rotation 1s linear infinite;
border: 2px solid #900c3f;
border-top: 2px solid transparent;
border-radius: 100%;
}
.preloader > .icon {
position: absolute;
top: 50%;
left: 50%;
height: 25px;
width: 10.6px;
margin-top: -12.5px;
margin-left: -5.3px;
-webkit-animation: wink 1s ease-in-out infinite alternate;
animation: wink 1s ease-in-out infinite alternate;
}
@media only screen and (min-width: 768px) {
.preloader {
height: 60px;
width: 60px;
margin-top: -30px;
margin-left: -30px;
}
.preloader:before {
left: -2px;
top: -2px;
border-width: 2px;
}
.preloader > .icon {
height: 37.5px;
width: 15.9px;
margin-top: -18.75px;
margin-left: -7.95px;
}
}
@media only screen and (min-width: 1200px) {
.preloader {
height: 60px;
width: 60px;
margin-top: -30px;
margin-left: -30px;
}
.preloader > .icon {
height: 50px;
width: 21.2px;
margin-top: -25px;
margin-left: -10.6px;
}
}
@-webkit-keyframes rotation {
from {
-webkit-transform: rotate(0);
transform: rotate(0);
}
to {
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@keyframes rotation {
from {
-webkit-transform: rotate(0);
transform: rotate(0);
}
to {
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@-webkit-keyframes wink {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes wink {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
/******************************************
/* preloader
==================================================*/ ==================================================*/

BIN
public/assets/images/dashboard/Asset 3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 44 KiB

471
public/assets/js/login_register/app.js
View File

@ -114,13 +114,472 @@ form_4_back_btn.addEventListener("click", function () {
form_4_progessbar.classList.remove("active"); form_4_progessbar.classList.remove("active");
}); });
btn_done.addEventListener("click", function () { // btn_done.addEventListener("click", function () {
modal_wrapper.classList.add("active"); // modal_wrapper.classList.add("active");
}); // });
shadow.addEventListener("click", function () { // shadow.addEventListener("click", function () {
modal_wrapper.classList.remove("active"); // modal_wrapper.classList.remove("active");
}); // });
/****************************************** /******************************************
* MULTIPLE FORM END * MULTIPLE FORM END
******************************************/ ******************************************/
/******************************************
* KTP & E-KYC CAMERA
******************************************/
document.addEventListener("DOMContentLoaded", function () {
const videoElementKtp = document.getElementById("webcamKtp");
const captureButtonKtp = document.getElementById("captureButtonKtp");
const fotoInputKtp = document.getElementById("fotoKtp");
const startButtonKtp = document.getElementById("startButtonKtp");
const refreshButtonKtp = document.getElementById("refreshButtonKtp");
const imageHolderKtp = document.getElementById("imageHolderKtp");
const videoElementEkyc = document.getElementById("webcamEkyc");
const captureButtonEkyc = document.getElementById("captureButtonEkyc");
const fotoInputEkyc = document.getElementById("fotoEkyc");
const startButtonEkyc = document.getElementById("startButtonEkyc");
const refreshButtonEkyc = document.getElementById("refreshButtonEkyc");
const imageHolderEkyc = document.getElementById("imageHolderEkyc");
// Inisialisasi status kamera
let ktpStream = null;
let ekycStream = null;
// Tampilan tombol capture dan refresh
captureButtonKtp.style.display = "none";
refreshButtonKtp.style.display = "none";
videoElementKtp.style.display = "none";
imageHolderKtp.style.display = "block";
captureButtonEkyc.style.display = "none";
refreshButtonEkyc.style.display = "none";
videoElementEkyc.style.display = "none";
imageHolderEkyc.style.display = "block";
// Fungsi untuk menyalakan kamera
function turnOnCamera(stream, videoElement, startButton) {
videoElement.srcObject = stream;
startButton.textContent = "Matikan Kamera";
videoElement.style.display = "block"; // Tampilkan video
}
// Fungsi untuk mematikan kamera
function turnOffCamera(stream, videoElement, startButton) {
if (stream) {
stream.getTracks().forEach((track) => track.stop());
videoElement.srcObject = null;
}
startButton.textContent = "Nyalakan Kamera";
videoElement.style.display = "none"; // Sembunyikan video
}
// Fungsi untuk menghapus hasil foto
function clearPhoto(fotoInput, fotoPreview) {
fotoInput.value = "";
fotoPreview.innerHTML = "";
}
startButtonKtp.addEventListener("click", function () {
if (ktpStream) {
// Matikan kamera jika sudah aktif
turnOffCamera(ktpStream, videoElementKtp, startButtonKtp);
// Hapus hasil foto
clearPhoto(
fotoInputKtp,
document.getElementById("foto-preview-ktp")
);
ktpStream = null;
imageHolderKtp.style.display = "block";
captureButtonKtp.style.display = "none";
} else {
// Aktifkan kamera jika belum aktif
navigator.mediaDevices
.getUserMedia({ video: true })
.then(function (stream) {
ktpStream = stream;
turnOnCamera(ktpStream, videoElementKtp, startButtonKtp);
imageHolderKtp.style.display = "none";
captureButtonKtp.style.display = "block";
})
.catch(function (error) {
Swal.fire({
title: "Gagal",
text: "Gagal mengakses kamera, karena " + error,
icon: "error",
});
});
}
});
startButtonEkyc.addEventListener("click", function () {
if (ekycStream) {
// Matikan kamera jika sudah aktif
turnOffCamera(ekycStream, videoElementEkyc, startButtonEkyc);
// Hapus hasil foto
clearPhoto(
fotoInputEkyc,
document.getElementById("foto-preview-ekyc")
);
ekycStream = null;
imageHolderEkyc.style.display = "block";
captureButtonEkyc.style.display = "none";
} else {
// Aktifkan kamera jika belum aktif
navigator.mediaDevices
.getUserMedia({ video: true })
.then(function (stream) {
ekycStream = stream;
turnOnCamera(ekycStream, videoElementEkyc, startButtonEkyc);
imageHolderEkyc.style.display = "none";
captureButtonEkyc.style.display = "block";
})
.catch(function (error) {
Swal.fire({
title: "Gagal",
text: "Gagal mengakses kamera, karena " + error,
icon: "error",
});
});
}
});
refreshButtonKtp.addEventListener("click", function () {
// Hapus hasil foto jika tombol "Ulang Foto" ditekan
clearPhoto(fotoInputKtp, document.getElementById("foto-preview-ktp"));
if (ktpStream) {
// Matikan kamera jika sedang aktif
turnOffCamera(ktpStream, videoElementKtp, startButtonKtp);
ktpStream = null;
}
// Menyalakan kembali kamera
navigator.mediaDevices
.getUserMedia({ video: true })
.then(function (stream) {
ktpStream = stream;
turnOnCamera(ktpStream, videoElementKtp, startButtonKtp);
})
.catch(function (error) {
Swal.fire({
title: "Gagal",
text: "Gagal mengakses kamera, karena " + error,
icon: "error",
});
});
refreshButtonKtp.style.display = "none";
captureButtonKtp.style.display = "block";
startButtonKtp.style.display = "block";
});
refreshButtonEkyc.addEventListener("click", function () {
// Hapus hasil foto jika tombol "Ulang Foto" ditekan
clearPhoto(fotoInputEkyc, document.getElementById("foto-preview-ekyc"));
if (ekycStream) {
// Matikan kamera jika sedang aktif
turnOffCamera(ekycStream, videoElementEkyc, startButtonEkyc);
ekycStream = null;
}
// Menyalakan kembali kamera
navigator.mediaDevices
.getUserMedia({ video: true })
.then(function (stream) {
ekycStream = stream;
turnOnCamera(ekycStream, videoElementEkyc, startButtonEkyc);
})
.catch(function (error) {
Swal.fire({
title: "Gagal",
text: "Gagal mengakses kamera, karena " + error,
icon: "error",
});
});
refreshButtonEkyc.style.display = "none";
captureButtonEkyc.style.display = "block";
startButtonEkyc.style.display = "block";
});
captureButtonKtp.addEventListener("click", function () {
if (ktpStream) {
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d");
canvas.width = videoElementKtp.videoWidth;
canvas.height = videoElementKtp.videoHeight;
context.drawImage(
videoElementKtp,
0,
0,
canvas.width,
canvas.height
);
const fotoDataUrl = canvas.toDataURL("image/jpeg");
fotoInputKtp.value = fotoDataUrl;
const fotoPreview = document.getElementById("foto-preview-ktp");
fotoPreview.innerHTML =
'<img src="' + fotoDataUrl + '" alt="Foto">';
// Matikan kamera setelah mengambil foto
turnOffCamera(ktpStream, videoElementKtp, startButtonKtp);
// Tombol ulang muncul
refreshButtonKtp.style.display = "block";
captureButtonKtp.style.display = "none";
startButtonKtp.style.display = "none";
}
});
captureButtonEkyc.addEventListener("click", function () {
if (ekycStream) {
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d");
canvas.width = videoElementEkyc.videoWidth;
canvas.height = videoElementEkyc.videoHeight;
context.drawImage(
videoElementEkyc,
0,
0,
canvas.width,
canvas.height
);
const fotoDataUrl = canvas.toDataURL("image/jpeg");
fotoInputEkyc.value = fotoDataUrl;
const fotoPreview = document.getElementById("foto-preview-ekyc");
fotoPreview.innerHTML =
'<img src="' + fotoDataUrl + '" alt="Foto">';
// Matikan kamera setelah mengambil foto
turnOffCamera(ekycStream, videoElementEkyc, startButtonEkyc);
refreshButtonEkyc.style.display = "block";
captureButtonEkyc.style.display = "none";
startButtonEkyc.style.display = "none";
}
});
});
/******************************************
* END KTP & E-KYC CAMERA
******************************************/
/******************************************
* SLIDE KTP & E-KYC FORM 3
******************************************/
let slideIndex = 1;
showSlide(slideIndex);
function plusSlide(n) {
showSlide((slideIndex += n));
}
function currentSlide(n) {
showSlide((slideIndex = n));
}
function showSlide(n) {
let slides = document.querySelectorAll(".slide");
let dots = document.querySelectorAll(".dot");
if (n > slides.length) {
slideIndex = 1;
}
if (n < 1) {
slideIndex = slides.length;
}
for (let i = 0; i < slides.length; i++) {
slides[i].style.transform =
"translateX(-" + (slideIndex - 1) * 100 + "%)";
}
for (let i = 0; i < dots.length; i++) {
dots[i].classList.remove("active");
}
dots[slideIndex - 1].classList.add("active");
}
/******************************************
* END SLIDE KTP & E-KYC FORM 3
******************************************/
/******************************************
* DROPDOWN SELECT GENDER
******************************************/
$(document).ready(function () {
$("#gender-select").select2();
});
/******************************************
* END DROPDOWN SELECT GENDER
******************************************/
/******************************************
* AJAX DROPDOWN SELECT PROVINSI, KABUPATEN & KECAMATAN
******************************************/
$(document).ready(function () {
$("#selectProvince").select2({
placeholder: "Pilih Provinsi",
ajax: {
url: $("#selectProvince").data("url"),
processResults: function ({ data }) {
return {
results: $.map(data, function (item) {
return {
id: item.code,
text: item.name,
};
}),
};
},
},
});
$("#selectCity").select2({
placeholder: "Pilih Kabupaten/Kota",
ajax: {
url: "", // Isi dengan URL yang sesuai
processResults: function ({ data }) {
return {
results: $.map(data, function (item) {
return {
id: item.code,
text: item.name,
};
}),
};
},
},
});
$("#selectDistrict").select2({
placeholder: "Pilih Kecamatan",
ajax: {
url: "", // Isi dengan URL yang sesuai
processResults: function ({ data }) {
return {
results: $.map(data, function (item) {
return {
id: item.code,
text: item.name,
};
}),
};
},
},
});
$("#selectVillage").select2({
placeholder: "Pilih Kelurahan",
ajax: {
url: "", // Isi dengan URL yang sesuai
processResults: function ({ data }) {
return {
results: $.map(data, function (item) {
return {
id: item.code,
text: item.name,
};
}),
};
},
},
});
// Event Listener untuk selectProvince
$("#selectProvince").change(function () {
let code = $("#selectProvince").val();
// Mengosongkan pilihan di selectCity dan selectDistrict dan selectVillage
$("#selectCity", "#selectDistrict", "#selectVillage").empty();
// Menghapus properti 'disabled' pada selectCity dan selectDistrict dan selectVillage
$("#selectCity", "#selectDistrict", "#selectVillage").prop(
"disable",
false
);
// Muat ulang data berdasarkan provinsi yang baru dipilih di selectProvince
$("#selectCity").select2({
placeholder: "Pilih Kabupaten/Kota",
ajax: {
url: "/cari-kota/" + code,
processResults: function ({ data }) {
return {
results: $.map(data, function (item) {
return {
id: item.code,
text: item.name,
};
}),
};
},
},
});
});
// Event Listener untuk perubahan pada selectCity
$("#selectCity").change(function () {
let code = $("#selectCity").val();
// Mengosongkan pilihan di selectDistrict dan selectVillage
$("#selectDristrict", "#selectVillage").empty();
// Menghapus properti 'disable' pada selectDistrict dan selectVillage
$("#selectDistrict", "#selectVillage").prop("disabled", false);
// Memuat ulang data berdasarkan wilayah yang baru dipilih di selectCity
$("#selectDistrict").select2({
placeholder: "Pilih Kecamatan",
ajax: {
url: "/cari-kecamatan/" + code, // Isi dengan URL yang sesuai
processResults: function ({ data }) {
return {
results: $.map(data, function (item) {
return {
id: item.code,
text: item.name,
};
}),
};
},
},
});
});
// Event Listener untuk selectDistrict
$("#selectDistrict").change(function () {
let code = $("#selectDistrict").val();
// Mengosongkan pilihan di selectVillage
$("#selectVillage").empty();
// Menghapus properti 'disabled' pada selectVillage
$("#selectVillage").prop("disabled", false);
// Memuat ulang data berdasarkan wilayah yang baru dipilih di selectDistrict
$("#selectVillage").select2({
placeholder: "Pilih Kelurahan",
ajax: {
url: "/cari-kelurahan/" + code, // Isi dengan URL yang sesuai
processResults: function ({ data }) {
return {
results: $.map(data, function (item) {
return {
id: item.code,
text: item.name,
};
}),
};
},
},
});
});
});
/******************************************
* END AJAX DROPDOWN SELECT PROVINSI, KABUPATEN & KECAMATAN
******************************************/

5793
public/assets/js/login_register/jquery.js vendored
View File

File diff suppressed because one or more lines are too long

365
public/assets/js/login_register/script.js
View File

@ -1,315 +1,70 @@
/****************************************** /******************************************
* DROP AND DRAG IMAGE * PROGRESS BAR MULTIPLE FORM
******************************************/ ******************************************/
const dropArea = document.querySelector('.drop-area');
const inputFile = document.getElementById('input-file');
dropArea.addEventListener('click', function() {
inputFile.click()
})
inputFile.addEventListener('change', function() {
const file = this.files[0];
if (file.type.startsWith('image/')) {
if (file.size < 2000000) {
create_thumbnail(file);
} else {
alert('Image size must be less than 2MB');
}
} else {
alert('Must be image');
}
})
dropArea.addEventListener('dragover', function(e) {
e.preventDefault();
this.style.borderStyle = 'solid';
const h3 = this.querySelector('h3');
h3.textContent = 'Release here to upload image';
})
dropArea.addEventListener('drop', function(e) {
e.preventDefault();
inputFile.files = e.dataTransfer.files;
const file = e.dataTransfer.files[0];
if (file.type.startsWith('image/')) {
if (file.size < 2000000) {
create_thumbnail(file);
} else {
alert('Image size must be less than 2MB');
}
} else {
alert('Must be image');
}
})
const command = ['dragleave', 'dragend']
command.forEach(item => {
dropArea.addEventListener(item, function() {
this.style.borderStyle = 'dashed';
const h3 = this.querySelector('h3');
h3.textContent = 'Drag and drop or click here to select image';
})
})
function create_thumbnail(file) {
const img = document.querySelectorAll('.thumbnail');
const imgName = document.querySelectorAll('.img-name');
img.forEach(item => item.remove());
imgName.forEach(item => item.remove());
const reader = new FileReader();
reader.onload = () => {
const url = reader.result;
const img = document.createElement('img');
img.src = url;
img.className = 'thumbnail'
const span = document.createElement('span');
span.className = 'img-name';
span.textContent = file.name;
dropArea.appendChild(img);
dropArea.appendChild(span);
dropArea.style.borderColor = 'transparent';
}
reader.readAsDataURL(file);
}
/******************************************
* END DROP AND DRAG IMAGE
******************************************/
/******************************************
* DROPDOOWN INPUT
******************************************/
const optionMenu = document.querySelector(".select-menu"),
selectBtn = optionMenu.querySelector(".select-btn"),
options = optionMenu.querySelectorAll(".option"),
sBtn_text = optionMenu.querySelector(".sBtn-text");
selectBtn.addEventListener("click", () =>
optionMenu.classList.toggle("active")
);
options.forEach((option) => {
option.addEventListener("click", () => {
let selectedOption = option.querySelector(".option-text").innerText;
sBtn_text.innerText = selectedOption;
optionMenu.classList.remove("active");
});
});
/******************************************
* DROPDOOWN INPUT END
******************************************/
/******************************************
* PROGRESS BAR MULTIPLE FORM
******************************************/
"use strict"; "use strict";
//jQuery time //jQuery time
var current_fs, next_fs, previous_fs; //fieldsets var current_fs, next_fs, previous_fs; //fieldsets
var left, opacity, scale; //fieldset properties which we will animate var left, opacity, scale; //fieldset properties which we will animate
var animating; //flag to prevent quick multi-click glitches var animating; //flag to prevent quick multi-click glitches
$(".next").click(function() { $(".next").click(function () {
if (animating) return false; if (animating) return false;
animating = true; animating = true;
current_fs = $(this).parent(); current_fs = $(this).parent();
next_fs = $(this).parent().next(); next_fs = $(this).parent().next();
//activate next step on progressbar using the index of next_fs //activate next step on progressbar using the index of next_fs
$("#progressbar li").eq($("fieldset").index(next_fs)).addClass("active"); $("#progressbar li").eq($("fieldset").index(next_fs)).addClass("active");
//show the next fieldset //show the next fieldset
next_fs.show(); next_fs.show();
//hide the current fieldset with style });
current_fs.animate({
opacity: 0
}, {
step: function(now, mx) {
//as the opacity of current_fs reduces to 0 - stored in "now"
//1. scale current_fs down to 80%
scale = 0 - (0 - now) * 0;
//2. bring next_fs from the right(50%)
left = (now * 50) + "%";
//3. increase opacity of next_fs to 1 as it moves in
opacity = 1 - now;
current_fs.css({
'transform': 'scale(' + scale + ')'
});
next_fs.css({
'left': left,
'opacity': opacity
});
},
duration: 500,
complete: function() {
current_fs.hide();
animating = false;
},
//this comes from the custom easing plugin
easing: 'easeOutQuint'
});
});
$(".previous").click(function() { $(".previous").click(function () {
if (animating) return false; if (animating) return false;
animating = true; animating = true;
current_fs = $(this).parent(); current_fs = $(this).parent();
previous_fs = $(this).parent().prev(); previous_fs = $(this).parent().prev();
//de-activate current step on progressbar //de-activate current step on progressbar
$("#progressbar li").eq($("fieldset").index(current_fs)).removeClass("active"); $("#progressbar li")
.eq($("fieldset").index(current_fs))
//show the previous fieldset .removeClass("active");
previous_fs.show(); });
//hide the current fieldset with style
current_fs.animate({
opacity: 0
}, {
step: function(now, mx) {
//as the opacity of current_fs reduces to 0 - stored in "now"
//1. scale previous_fs from 80% to 100%
scale = 0.8 + (1 - now) * 0.2;
//2. take current_fs to the right(50%) - from 0%
left = ((1 - now) * 50) + "%";
//3. increase opacity of previous_fs to 1 as it moves in
opacity = 1 - now;
current_fs.css({
'left': left
});
previous_fs.css({
'transform': 'scale(' + scale + ')',
'opacity': opacity
});
},
duration: 500,
complete: function() {
current_fs.hide();
animating = false;
},
//this comes from the custom easing plugin
easing: 'easeOutQuint'
});
});
$(".submit").click(function() {
return false;
})
$(document).ready(function() {
$('select').material_select();
});
var counter = 0;
var orderCounter = 1;
function newKeyword() {
$(".keywords").append(
'<div class=\"row rowKey animated zoomIn2\">\r\n <div class=\"input-field col s6\" style=\"\r\n width: 42%;\r\n\">\r\n \r\n <input id=\"icon_prefix1' +
counter + '\" type=\"text\" class=\"validate\">\r\n <label for=\"icon_prefix1' + counter +
'\" class=\"\">Keyword<\/label>\r\n <\/div>\r\n <div class=\"row\">\r\n <!--<div style=\" top: 0.8rem;\" class=\"col s2\"> Density :<\/div> -->\r\n <div class=\"input-field col s2\" style=\" top: 0.7rem;\"> Density<\/div>\r\n <div class=\"input-field col s2\">\r\n <input id=\"icon_telephone1' +
counter + '\" type=\"number\" class=\"validate\">\r\n <label for=\"icon_telephone1' + counter +
'\" class=\"\">Min<\/label>\r\n <\/div>\r\n <div class=\"input-field col s2\">\r\n <input id=\"max1' +
counter + '\" type=\"number\" class=\"validate\">\r\n <label for=\"max1' + counter +
'\" class=\"\">Max<\/label>\r\n <\/div>\r\n <i class=\"material-icons prefix remove active\" style=\"\r\n margin-top: 1.7rem; cursor: pointer;color: #607D8B;\r\n\">close<\/i><\/div>\r\n <\/div>'
);
counter++;
};
$(".promo-example").hover(
function() {
$(this).addClass("hovered");
},
function() {
$(this).removeClass("hovered");
}
);
$(".promo-example").click(
function() {
$(".promo-example").removeClass("selected")
$(this).addClass("selected");
}
);
$(".promo-example2").hover(
function() {
$(this).addClass("hovered");
},
function() {
$(this).removeClass("hovered");
}
);
$(".promo-example2").click(
function() {
$(".promo-example").removeClass("selected")
$(this).addClass("selected");
}
);
$(".keywords").delegate(".remove", "click", function() {
$(this).closest('.rowKey').remove();
});
function newOrder() {
var orderNumber = $(".card").length;
//var orderNumber = $(".card").index(this);
$(".creation").prepend(
'<div class=\"card animated zoomIn\">\r\n\t\t<h2 class=\"fs-title\" style=\" padding-top: 25px;\r\n padding-left: 25px;\r\n text-align: left;\r\n width: 100%;\">Product description n\u00B0' +
orderNumber +
'<\/h2>\r\n<div class=\"row\">\r\n <div class=\"input-field col s12\">\r\n <input id=\"first_name' +
orderNumber + '\" type=\"text\" class=\"validate\">\r\n <label for=\"first_name' +
orderNumber +
'\">Order name<\/label> \r\n <\/div> \r\n <div class=\"row col s12\" style=\"color:grey;font-size: 10px;text-align: left;margin-top: -10px;margin-left: 0px\">Name your order, you can also use a reference Id from your system to find it easily <\/div>\r\n <\/div>\r\n <div class=\"row\">\r\n <div class=\"input-field col s12\">\r\n <input id=\"first_name2' +
orderNumber + '\" type=\"text\" class=\"validate\">\r\n <label for=\"first_name2' +
orderNumber +
'\">URL (optional)<\/label> \r\n <\/div> \r\n \r\n <div class=\"row col s12\" style=\"color:grey;font-size: 10px;text-align: left;margin-top: -10px;margin-left: 0px\">You can add an url to give more informations to the writer<\/div> <\/div> \r\n \r\n <div class=\"row\">\r\n <div class=\"input-field col s12\">\r\n <input id=\"first_name2' +
orderNumber + '\" type=\"text\" class=\"validate\">\r\n <label for=\"first_name2' +
orderNumber +
'\">Reference id (optional)<\/label> \r\n <\/div> \r\n \r\n <div class=\"row col s12\" style=\"color:grey;font-size: 10px;text-align: left;margin-top: -10px;margin-left: 0px\">You can add a reference id to match the order with your system<\/div> <\/div> \r\n <div class=\"keywords\"> \r\n<!-- <div class=\"row\">\r\n <div class=\"input-field col s6\">\r\n <i class=\"material-icons prefix\">label<\/i>\r\n <input id=\"icon_prefix' +
orderNumber + '\" type=\"text\" class=\"validate\">\r\n <label for=\"icon_prefix' +
orderNumber +
'\">Keyword<\/label>\r\n <\/div>\r\n <div class=\"row\">\r\n <div style=\"margin-top:2rem\" class=\"col s2\"> Density<\/div> \r\n <div class=\"input-field col s2\"> Density<\/div>\r\n <div class=\"input-field col s2\">\r\n <input id=\"icon_telephone' +
orderNumber + '\" type=\"number\" class=\"validate\">\r\n <label for=\"icon_telephone' +
orderNumber +
'\">Min<\/label>\r\n <\/div>\r\n <div class=\"input-field col s2\">\r\n <input id=\"max' +
orderNumber + '\" type=\"number\" class=\"validate\">\r\n <label for=\"max' + orderNumber +
'\">Max<\/label>\r\n <\/div>\r\n <\/div>\r\n <\/div>-->\r\n \r\n\r\n <\/div>\r\n <div><a class=\"waves-effect waves-light btn\" onClick=\"newKeyword()\"><i class=\"material-icons left\">add<\/i>Add a Keyword<\/a><\/div> \r\n <\/div>\r\n <\/div>'
);
orderCounter++;
counter++;
};
$("fieldset").delegate(".removeOrder", "click", function() {
$(this).closest('.card').remove();
});
/****************************************** /******************************************
* END PROGRESS BAR MULTIPLE FORM * END PROGRESS BAR MULTIPLE FORM
******************************************/ ******************************************/
/******************************************
* HIDE & SEE PASSWORD PIN DAN KONFIR PIN
******************************************/
function togglePinVisibility() {
var pin = document.getElementById("pin");
var toggleIconPin = document.getElementById("toggle-pin");
if (pin.type === "password") {
pin.type = "text";
toggleIconPin.className = "fa fa-eye-slash password-toggle-icon";
} else {
pin.type = "password";
toggleIconPin.className = "fa fa-eye password-toggle-icon";
}
}
function toggleKonfirPinVisibility() {
var pin = document.getElementById("konfir-pin");
var toggleIconKonfirPin = document.getElementById("toggle-konfir-pin");
if (pin.type === "password") {
pin.type = "text";
toggleIconKonfirPin.className = "fa fa-eye-slash password-toggle-icon";
} else {
pin.type = "password";
toggleIconKonfirPin.className = "fa fa-eye password-toggle-icon";
}
}
/******************************************
* END HIDE & SEE PASSWORD PIN DAN KONFIR PIN
******************************************/

22
resources/views/Admin/index.blade.php
View File

@ -371,8 +371,7 @@
</div> </div>
</section> </section>
</div> </div>
@include('admin.transaction.tracking') @include('admin.transaction.modal-tracking')
<script src="{{ asset('assets/modules/chart.min.js') }}"></script>
<script> <script>
// Set new default font family and font color to mimic Bootstrap's default styling // Set new default font family and font color to mimic Bootstrap's default styling
Chart.defaults.global.defaultFontFamily = 'Nunito', Chart.defaults.global.defaultFontFamily = 'Nunito',
@ -569,24 +568,5 @@
}, },
} }
}); });
// $("#products-carousel").owlCarousel({
// items: 3,
// margin: 10,
// autoplay: true,
// autoplayTimeout: 5000,
// loop: true,
// responsive: {
// 0: {
// items: 2
// },
// 768: {
// items: 2
// },
// 1200: {
// items: 3
// }
// }
// });
</script> </script>
@endsection @endsection

3
resources/views/Admin/layout/main.blade.php
View File

@ -71,6 +71,7 @@
{{-- JS --}} {{-- JS --}}
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="{{ asset('assets/modules/chart.min.js') }}"></script>
</head> </head>
<body> <body>
@ -145,7 +146,6 @@
<!-- JS Libraies --> <!-- JS Libraies -->
<script src="{{ asset('assets/modules/jquery.sparkline.min.js') }}"></script> <script src="{{ asset('assets/modules/jquery.sparkline.min.js') }}"></script>
<script src="{{ asset('assets/modules/chart.min.js') }}"></script>
<script src="{{ asset('assets/modules/owlcarousel2/dist/owl.carousel.min.js') }}"></script> <script src="{{ asset('assets/modules/owlcarousel2/dist/owl.carousel.min.js') }}"></script>
<script src="{{ asset('assets/modules/summernote/summernote-bs4.js') }}"></script> <script src="{{ asset('assets/modules/summernote/summernote-bs4.js') }}"></script>
<script src="{{ asset('assets/modules/chocolat/dist/js/jquery.chocolat.min.js') }}"></script> <script src="{{ asset('assets/modules/chocolat/dist/js/jquery.chocolat.min.js') }}"></script>
@ -164,6 +164,7 @@
<script src="{{ asset('assets/js/custom.js') }}"></script> <script src="{{ asset('assets/js/custom.js') }}"></script>
<script src="https://cdn.jsdelivr.net/npm/daterangepicker@3.1.0/daterangepicker.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/daterangepicker@3.1.0/daterangepicker.min.js"></script>
<script src="{{ asset('assets/js/tablesort.js') }}"></script> <script src="{{ asset('assets/js/tablesort.js') }}"></script>
{{-- <script src="{{ asset('assets/js/main.js') }}"></script> --}}
<script> <script>
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
const alertCloseButtons = document.querySelectorAll('.alert .btn-close'); const alertCloseButtons = document.querySelectorAll('.alert .btn-close');

221
resources/views/Admin/users/detail-user.blade.php
View File

@ -5,7 +5,7 @@
<div class="section-header"> <div class="section-header">
<h1>Detail Users</h1> <h1>Detail Users</h1>
<div class="section-header-breadcrumb"> <div class="section-header-breadcrumb">
<div class="breadcrumb-item active"><a href="{{ route('index') }}">Dashboard</a></div> <div class="breadcrumb-item active"><a href="{{ route('admin.index') }}">Dashboard</a></div>
<div class="breadcrumb-item">Users</div> <div class="breadcrumb-item">Users</div>
<div class="breadcrumb-item">Details</div> <div class="breadcrumb-item">Details</div>
</div> </div>
@ -19,29 +19,30 @@
</div> </div>
</div> </div>
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<img src="/assets/img/avatar/avatar-6.png" class="rounded-circle shadow align-self-center" @if ($user->foto_profil == null)
style="max-width: 130px;" alt="" srcset=""> <img src="{{ asset('assets/img/avatar/avatar-6.png') }}"
class="rounded-circle shadow align-self-center"style="max-width: 130px;"
alt="" srcset="">
@else
<img src="{{ asset('storage/foto-profil/' . $user->foto_profil) }}"
class="rounded-circle shadow align-self-center" style="max-width: 130px;"
alt="" srcset="">
@endif
<h4 class="align-self-center mt-3">Status : {{$user->status == 'Finished' ? 'Selesai diverifikasi' : ($user->status == 'Progress' ? 'Sedang diverifikasi' : 'Tolak')}}</h4>
<hr class="border border-1 opacity-75 w-100"> <hr class="border border-1 opacity-75 w-100">
<div class="data-field"> <div class="data-field">
<span class="fw-bold text-start">NIK</span> <span class="fw-bold text-start">NIK</span>
<span class="text-muted ">{{ $user->nik }}</span> <span class="text-muted ">{{ $user->nik }}</span>
</div> </div>
<div class="data-field"> <div class="data-field">
<span class="fw-bold text-start">Name</span> <span class="fw-bold text-start">Nama</span>
<span class="text-muted ">{{ $user->nama }}</span> <span
class="text-muted ">{{ ucwords(strtolower($user->nama_depan . ' ' . $user->nama_belakang)) }}</span>
</div> </div>
<div class="data-field"> <div class="data-field">
<span class="fw-bold text-start">Gender</span> <span class="fw-bold text-start">Jenis Kelamin</span>
<span class="text-muted ">{{ $user->gender }}</span> <span class="text-muted ">{{ $user->gender }}</span>
</div> </div>
{{-- <div class="data-field">
<span class="fw-bold text-start">Religion</span>
<span class="text-muted ">{{ $user }}</span>
</div> --}}
{{-- <div class="data-field">
<span class="fw-bold text-start">Blood Type</span>
<span class="text-muted ">{{ $user['bloodType'] }}</span>
</div> --}}
</div> </div>
<hr class="border border-1 opacity-75 w-100"> <hr class="border border-1 opacity-75 w-100">
<div class="d-flex justify-content-between align-items-center"> <div class="d-flex justify-content-between align-items-center">
@ -55,7 +56,7 @@
<span class="text-muted ">{{ $user->email }}</span> <span class="text-muted ">{{ $user->email }}</span>
</div> </div>
<div class="data-field"> <div class="data-field">
<span class="fw-bold text-start">Phone Number</span> <span class="fw-bold text-start">Nomor HP</span>
<span class="text-muted ">{{ $user->nohp }}</span> <span class="text-muted ">{{ $user->nohp }}</span>
</div> </div>
<hr class="border border-1 opacity-75 w-100"> <hr class="border border-1 opacity-75 w-100">
@ -66,28 +67,206 @@
</div> </div>
<div class="data-field"> <div class="data-field">
<span class="fw-bold text-start">Provinsi</span> <span class="fw-bold text-start">Provinsi</span>
<span class="text-muted ">{{ $user->getProvinceName() }}</span> <span class="text-muted ">{{ ucwords(strtolower($user->getProvinceName())) }}</span>
</div> </div>
<div class="data-field"> <div class="data-field">
<span class="fw-bold text-start">Kota</span> <span class="fw-bold text-start">Kota/Kabupaten</span>
<span class="text-muted ">{{ $user->getCityName() }}</span> <span class="text-muted ">{{ ucwords(strtolower($user->getCityName())) }}</span>
</div> </div>
<div class="data-field"> <div class="data-field">
<span class="fw-bold text-start">Kecamatan</span> <span class="fw-bold text-start">Kecamatan</span>
<span class="text-muted ">{{ $user->getDistrictName() }}</span> <span class="text-muted ">{{ ucwords(strtolower($user->getDistrictName())) }}</span>
</div> </div>
<div class="data-field"> <div class="data-field">
<span class="fw-bold text-start">Village</span> <span class="fw-bold text-start">Kelurahan</span>
<span class="text-muted ">{{ $user->getVillageName() }}</span> <span class="text-muted ">{{ ucwords(strtolower($user->getVillageName())) }}</span>
</div> </div>
<div class="data-field"> <div class="data-field">
<span class="fw-bold text-start">Alamat</span> <span class="fw-bold text-start">Alamat</span>
<span class="text-muted ">{{ $user->alamat }}</span> <span class="text-muted ">{{ $user->alamat }}</span>
</div> </div>
<hr class="border border-1 opacity-75 w-100">
<div class="d-flex justify-content-between align-items-center">
<div class="card-title pb-2 m-0">
<h4>Foto KTP dan Wajah</h4>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-6 col-sm-12 text-center">
<!-- Kolom pertama, col-md-6 untuk layar medium dan col-sm-12 untuk layar kecil -->
@if ($user->foto_ktp == null)
<a href="#" id="tampilKTP">
<img id="fotoKTP" src="{{ asset('storage/foto-ktp/ktp.jpg') }}"
alt="Foto KTP" class="align-self-center img-fluid"
style="max-width: 350px;">
</a>
@else
<a href="#" id="tampilKTP">
<img id="fotoKTP"
src="{{ asset('storage/foto-ktp/' . $user->foto_ktp) }}"
alt="Foto Wajah" class="align-self-center img-fluid"
style="max-width: 350px;">
</a>
@endif
</div>
<div class="col-md-6 col-sm-12 text-center">
<!-- Kolom kedua, col-md-6 untuk layar medium dan col-sm-12 untuk layar kecil -->
@if ($user->foto_wajah == null)
<a href="#" id="tampilWajah">
<img id="fotoWajah" src="{{ asset('storage/foto-wajah/wajah.jpg') }}"
alt="Foto KTP" class="align-self-center img-fluid"
style="max-width: 350px;">
</a>
@else
<a href="#" id="tampilWajah">
<img id="fotoWajah"
src="{{ asset('storage/foto-wajah/' . $user->foto_wajah) }}"
alt="Foto Wajah" class="align-self-center img-fluid"
style="max-width: 350px;">
</a>
@endif
</div>
</div>
</div>
<div class="data-field mt-4">
<span class="fw-bold text-start">Persentase Kemiripan</span>
<span class="text-muted ">{{ $user->persentase_kemiripan }}</span>
</div>
@if ($user->status == 'Progress')
<div class="d-flex justify-content-between align-items-center">
<div class="card-title pb-2 m-0">
<h4>Setujui pembuatan akun ini?</h4>
</div>
</div>
<a class="btn btn-primary text-white" id="approveUser"
data-id="{{ $user->id }}">Setujui</a>
<a class="btn btn-danger text-white" id="denyUser"
data-id="{{ $user->id }}">Tolak</a>
@endif
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</section> </section>
</div> </div>
<script>
$(document).ready(function() {
$('#tampilKTP').on('click', function() {
let fotoKTP = document.getElementById('fotoKTP').src;
console.log(fotoKTP);
Swal.fire({
title: 'Foto KTP',
imageUrl: fotoKTP,
imageWidth: 600,
// imageHeight: 1500,
imageAlt: 'Foto KTP'
});
});
$('#tampilWajah').on('click', function() {
let fotoWajah = document.getElementById('fotoWajah').src;
Swal.fire({
title: 'Foto Wajah',
imageUrl: fotoWajah,
imageWidth: 600,
imageAlt: 'Foto Wajah'
});
});
$('#approveUser').on('click', function() {
let id = $(this).data('id');
const csrfToken = $('meta[name="csrf-token"]').attr('content');
Swal.fire({
title: 'Status Akun',
text: 'Apakah anda yakin menyetujui akun ini?',
icon: 'info',
confirmButtonText: 'Ya, setuju!',
showCancelButton: true,
cancelButtonText: 'Tidak'
}).then((result) => {
if (result.isConfirmed) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': csrfToken
}
});
$.ajax({
url: "{{ route('admin-user.approve', ':id') }}".replace(
':id', id),
type: 'PUT',
success: function(response) {
Swal.fire({
title: response.status ? 'Berhasil!' :
'Gagal!',
text: response.message,
icon: response.status ? 'success' : 'error',
confirmButtonText: 'OK'
}).then(function() {
location.reload();
});
},
error: function(error) {
Swal.fire({
title: 'Gagal!',
text: 'Tidak ada data yang dihapus, karena ' +
error,
icon: 'error'
}).then(function() {
location.reload();
});
}
});
}
});
});
$('#denyUser').on('click', function() {
let id = $(this).data('id');
const csrfToken = $('meta[name="csrf-token"]').attr('content');
Swal.fire({
title: 'Status Akun',
text: 'Apakah anda yakin menolak akun ini?',
icon: 'info',
confirmButtonText: 'Ya, setuju!',
showCancelButton: true,
cancelButtonText: 'Tidak'
}).then((result) => {
if (result.isConfirmed) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': csrfToken
}
});
$.ajax({
url: "{{ route('admin-user.deny', ':id') }}".replace(
':id', id),
type: 'PUT',
success: function(response) {
Swal.fire({
title: response.status ? 'Berhasil!' :
'Gagal!',
text: response.message,
icon: response.status ? 'success' : 'error',
confirmButtonText: 'OK'
}).then(function() {
location.reload();
});
},
error: function(error) {
Swal.fire({
title: 'Gagal!',
text: 'Gagal mengubah status akun, karena ' +
error,
icon: 'info'
});
}
});
}
});
});
});
</script>
@endsection @endsection

96
resources/views/Admin/users/index.blade.php
View File

@ -5,7 +5,7 @@
<div class="section-header"> <div class="section-header">
<h1>User</h1> <h1>User</h1>
<div class="section-header-breadcrumb"> <div class="section-header-breadcrumb">
<div class="breadcrumb-item active"><a href="{{ route('index') }}">Dashboard</a></div> <div class="breadcrumb-item active"><a href="{{ route('admin.index') }}">Dashboard</a></div>
<div class="breadcrumb-item">User</div> <div class="breadcrumb-item">User</div>
</div> </div>
</div> </div>
@ -53,14 +53,9 @@
</button> </button>
<div class="dropdown-menu"> <div class="dropdown-menu">
<a class="dropdown-item" <a class="dropdown-item"
href="{{ route('admin-user.show', $user->id) }}">Details</a> href="{{ route('admin-user.show', $user->id) }}">Keterangan</a>
@if ($user->status == 'Progress')
<a class="dropdown-item" href="#"
data-id="{{ $user->id }}" id="approveUser">Setujui
Akun</a>
@endif
<a class="dropdown-item" href="#" <a class="dropdown-item" href="#"
data-id="{{ $user->id }}" id="deleteUser">Delete</a> data-id="{{ $user->id }}" id="deleteUser">Hapus</a>
</div> </div>
</div> </div>
</td> </td>
@ -84,7 +79,7 @@
Swal.fire({ Swal.fire({
title: 'Hapus data', title: 'Hapus data',
text: 'Apakah yakin ingin menghapus data user ini?', text: 'Apakah yakin ingin menghapus data user ini?',
icon: 'info', icon: 'question',
confirmButtonText: 'Ya, hapus!', confirmButtonText: 'Ya, hapus!',
showDenyButton: true, showDenyButton: true,
denyButtonText: 'Tidak, jangan hapus!', denyButtonText: 'Tidak, jangan hapus!',
@ -134,89 +129,6 @@
} }
}); });
}); });
// Approved dan deny Akun
$('#table-1').on('click', '#approveUser', function() {
const csrfToken = $('meta[name="csrf-token"]').attr('content');
let dataId = $(this).data("id");
Swal.fire({
title: '',
text: 'Apakah yakin ingin menyutuji akun user ini?',
icon: 'info',
confirmButtonText: 'Ya, setuju!',
showDenyButton: true,
denyButtonText: 'Tidak, jangan setujui!',
}).then((result) => {
if (result.isConfirmed) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': csrfToken
}
});
$.ajax({
url: "{{ route('admin-user.approve', ':id') }}".replace(
':id', dataId),
type: 'PUT',
success: function(response) {
Swal.fire({
title: response.status ? 'Berhasil!' :
'Gagal!',
text: response.message,
icon: response.status ? 'success' : 'error',
confirmButtonText: 'OK'
}).then(function() {
location.reload();
});
},
error: function(error) {
Swal.fire({
title: 'Gagal!',
text: 'Tidak ada data yang dihapus, karena ' +
error,
icon: 'error'
}).then(function() {
location.reload();
});
}
});
} else if (result.isDenied) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': csrfToken
}
});
$.ajax({
url: "{{ route('admin-user.deny', ':id') }}".replace(
':id', dataId),
type: 'PUT',
success: function(response) {
Swal.fire({
title: response.status ? 'Berhasil!' :
'Gagal!',
text: response.message,
icon: response.status ? 'success' : 'error',
confirmButtonText: 'OK'
}).then(function() {
location.reload();
});
},
error: function(error) {
Swal.fire({
title: 'Gagal!',
text: 'Gagal mengubah status akun, karena ' +
error,
icon: 'info'
});
}
});
}
});
});
}); });
</script> </script>
@endsection @endsection

220
resources/views/User/contact/index.blade.php
View File

@ -19,12 +19,13 @@
<div class="card"> <div class="card">
<div class="card-header"> <div class="card-header">
<div class="d-flex justify-content-end"> <div class="d-flex justify-content-end">
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#modalForm">Open Contact Form</button> <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#modalForm">Open
Contact Form</button>
</div> </div>
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-striped" id="table-1"> <table class="table table-striped" id="table-2">
<thead> <thead>
<tr class="text-center"> <tr class="text-center">
<th>#</th> <th>#</th>
@ -38,13 +39,24 @@
@foreach ($contacts as $contact) @foreach ($contacts as $contact)
<tr> <tr>
<td>{{ $loop->iteration }}</td> <td>{{ $loop->iteration }}</td>
<td class="font-weight-600">{{ $contact->relasi_kontak->nama_depan.' '.$contact->relasi_kontak->nama_belakang }}</td> <td class="font-weight-600">
<td class="text-center font-weight-600">{{ $contact->relasi_kontak}}</td> {{ $contact->relasiKontak->nama_depan . ' ' . $contact->relasiKontak->nama_belakang }}
<td class="text-center font-weight-600">{{ $contact->relasi_kontak->nohp }}</td> </td>
<td class="text-center font-weight-600">{{ $contact->relasiKontak->email }}
</td>
<td class="text-center font-weight-600">{{ $contact->relasiKontak->nohp }}
</td>
<td class="text-center"> <td class="text-center">
<button class="btn btn-info open-detail-modal" data-toggle="modal" data-target="#modaldetail">Detail</button> <button class="btn btn-info open-detail-modal" data-toggle="modal"
{{-- <a href="/detail-contact" type="button" class="btn btn-primary">Detail</a> --}} data-target="#modaldetail" id="detailContact"
<button class="btn btn-danger open-detail-modal" data-toggle="modal" data-target="#modaldelete">Delete</button> data-id="{{ $contact->relasiKontak }}"
data-province="{{ $contact->relasiKontak->getProvinceName() }}"
data-city="{{ $contact->relasiKontak->getCityName() }}"
data-district="{{ $contact->relasiKontak->getDistrictName() }}"
data-village="{{ $contact->relasiKontak->getVillageName() }}">Detail</button>
<button class="btn btn-danger open-detail-modal" data-toggle="modal"
data-target="#modaldelete" id="deleteContact"
data-id="{{ $contact->id }}">Delete</button>
</td> </td>
</tr> </tr>
@endforeach @endforeach
@ -56,8 +68,196 @@
</div> </div>
</div> </div>
@extends('user.contact.modal-detail-contact') @extends('user.contact.modal-detail-contact')
@extends('user.contact.modal-delete-contact') {{-- @extends('user.contact.modal-delete-contact') --}}
@extends('user.contact.modal-add-contact') @extends('user.contact.modal-add-contact')
</section>
</div>
<script>
$(document).ready(function() {
let check = false;
var teksArea = document.getElementById('resultArea');
var teksNama = document.getElementById('teksNama');
var teksNohp = document.getElementById('teksNoHP');
var teksEmail = document.getElementById('teksEmail');
var teksAlamat = document.getElementById('teksAlamat');
$('#table-2').on('click', '#detailContact', function() {
let dataId = $(this).data('id');
let dataProvince = $(this).data('province');
let dataCity = $(this).data('city');
let dataDistrict = $(this).data('district');
let dataVillage = $(this).data('village');
teksNama.innerHTML = dataId.nama_depan + " " + dataId.nama_belakang;
teksAlamat.innerHTML = dataId.alamat + ", " + capital(dataVillage) + ", " + capital(
dataDistrict) + ", " + capital(dataCity) + ", " + capital(dataProvince);
teksNohp.innerHTML = dataId.nohp;
teksEmail.innerHTML = dataId.email;
});
function capital(text) {
return text.toLowerCase().replace(/(?:^|\s)\w/g, function(match) {
return match.toUpperCase();
});
}
$('#table-2').on('click', '#deleteContact', function() {
let dataId = $(this).data('id');
const csrfToken = $('meta[name="csrf-token"]').attr('content');
Swal.fire({
title: 'Hapus Kontak',
text: 'Yakin hapus kontak ini?',
icon: 'warning',
confirmButtonText: 'Ya, Hapus!',
showDenyButton: true,
denyButtonText: 'Tidak, jangan hapus',
}).then((result) => {
if (result.isConfirmed) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': csrfToken
}
});
$.ajax({
url: "{{ route('user-contact.delete', ':id') }}".replace(':id',
dataId),
type: 'DELETE',
contentType: false,
processType: 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 == true) {
location.reload();
}
});
},
error: function(error) {
Swal.fire({
title: 'Gagal',
text: "Terjadi error karena " + error
.message,
icon: 'error',
confirmButtonText: 'OK'
});
}
});
} else if (result.isDenied) {
Swal.fire({
title: 'Gagal',
text: 'Tidak ada kontak yang dihapus',
icon: 'info',
confirmButtonText: 'OK',
});
}
});
});
$('#checkButton').on('click', function() {
const email = document.querySelector('[name="email"]').value;
const csrfToken = $('meta[name="csrf-token"]').attr('content');
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': csrfToken
}
});
$.ajax({
url: "{{ route('user-contact.email', ':email') }}".replace(':email', email),
type: 'GET',
success: function(response) {
if (response.status) {
let status = response.message[0].status
Swal.fire({
title: response.status ? 'Akun ditemukan' :
'Akun tidak ditemukan',
text: response.status ? 'Akun dengan email ' + email +
' tersedia' : 'Akun dengan email ' + email +
' tidak tersedia',
icon: response.status ? 'success' : 'error',
confirmButtonText: 'OK'
});
let messages = response.message[0];
let hasil = "Nama : " + messages.nama_depan + " " + messages
.nama_belakang +
"\n" + "Email : " + messages.email + "\n" + "No. HP : " +
messages.nohp + "\n" + "Alamat : " + messages.alamat;
teksArea.value = hasil;
teksArea.style.height = 'auto';
check = true;
} else {
Swal.fire({
title: 'Gagal',
text: response.message,
icon: 'error',
confirmButtonText: 'OK'
});
check = false;
}
},
error: function(error) {
Swal.fire({
title: 'Gagal!',
text: 'Gagal memuat data karena ' + error,
icon: 'error',
confirmButtonText: 'OK',
});
check = false;
}
});
});
$('#tambahkanContact').on('click', function() {
const email = document.querySelector('[name="email"]').value;
const csrfToken = $('meta[name="csrf-token"]').attr('content');
const formData = new FormData();
formData.append('email', email);
if (check) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': csrfToken
}
});
$.ajax({
url: '{{ route('user-contact.store') }}',
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 == true) {
location.reload();
}
});
}
});
check = false;
} else {
Swal.fire({
title: 'Gagal',
text: 'Silahkan check email terlebih dahulu',
icon: 'error',
});
check = false;
}
});
});
</script>
@endsection @endsection

11
resources/views/User/contact/modal-add-contact.blade.php
View File

@ -15,10 +15,10 @@
<!-- Modal Body --> <!-- Modal Body -->
<div class="modal-body"> <div class="modal-body">
<p class="statusMsg"></p> <p class="statusMsg"></p>
<form role="form"> <form role="form" id="formContact">
<div class="form-group"> <div class="form-group">
<label for="inputemail">Email</label> <label for="inputemail">Email</label>
<input type="text" class="form-control" id="inputemail" placeholder="Enter your email" /> <input type="text" class="form-control" name="email" placeholder="Enter your email" />
</div> </div>
<div class="form-group"> <div class="form-group">
<button type="button" class="btn btn-primary" id="checkButton">Check</button> <button type="button" class="btn btn-primary" id="checkButton">Check</button>
@ -26,7 +26,7 @@
<div class="form-group"> <div class="form-group">
<label for="exampleFormControlTextarea1" class="form-label">Hasil</label> <label for="exampleFormControlTextarea1" class="form-label">Hasil</label>
<textarea class="form-control" id="hasil" rows="5" readonly></textarea> <textarea class="form-control" rows="10" cols="10" readonly id="resultArea""></textarea>
</div> </div>
</form> </form>
</div> </div>
@ -34,9 +34,8 @@
<!-- Modal Footer --> <!-- Modal Footer -->
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<a href="/contact" type="button" class="btn btn-primary submitBtn" <button type="button" class="btn btn-primary submitBtn"
onclick="submitContactForm()">Tambahkan id="tambahkanContact">Tambahkan Data</button>
Data</a>
</div> </div>
</div> </div>
</div> </div>

19
resources/views/User/contact/modal-detail-contact.blade.php
View File

@ -36,27 +36,30 @@
<div class="card-body"> <div class="card-body">
<div class="alert alert-primary" role="alert"> <div class="alert alert-primary" role="alert">
<div class="form-group"> <div class="form-group">
<label for="inputNama" style="color: white; font-size: 1.1em;">Nama</label> <label for="teksNama" style="color: white; font-size: 1.1em;">Nama</label>
<p class="form-control-static" id="inputNama">Nurul Prima</p> <p class="form-control-static" id="teksNama">Nurul Prima</p>
</div> </div>
<hr style="border-top: 1px solid #fff;"> <hr style="border-top: 1px solid #fff;">
<div class="form-group"> <div class="form-group">
<label for="inputNoHP" style="color: white; font-size: 1.1em;">No HP</label> <label for="teksNoHP" style="color: white; font-size: 1.1em;">No HP</label>
<p class="form-control-static" id="inputNoHP">+6282284964524</p> <p class="form-control-static" id="teksNoHP">+6282284964524</p>
</div> </div>
<hr style="border-top: 1px solid #fff;"> <hr style="border-top: 1px solid #fff;">
<div class="form-group"> <div class="form-group">
<label for="inputEmail" style="color: white; font-size: 1.1em;">Email</label> <label for="teksEmail" style="color: white; font-size: 1.1em;">Email</label>
<p class="form-control-static" id="inputEmail">npannisa@gmail.com</p> <p class="form-control-static" id="teksEmail">npannisa@gmail.com</p>
</div> </div>
<hr style="border-top: 1px solid #fff;"> <hr style="border-top: 1px solid #fff;">
<div class="form-group"> <div class="form-group">
<label for="inputAlamat" style="color: white; font-size: 1.1em;">Alamat</label> <label for="teksAlamat" style="color: white; font-size: 1.1em;">Alamat</label>
<p class="form-control-static" id="inputAlamat">Depok City</p> <p class="form-control-static" id="teksAlamat">Depok City</p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div> </div>
</div> </div>
</div> </div>

199
resources/views/User/index.blade.php
View File

@ -152,4 +152,203 @@
</div> </div>
</section> </section>
</div> </div>
<script>
// Set new default font family and font color to mimic Bootstrap's default styling
Chart.defaults.global.defaultFontFamily = 'Nunito',
'-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif';
Chart.defaults.global.defaultFontColor = '#858796';
var ctx = document.getElementById("myChart1").getContext('2d');
var myChart = new Chart(ctx, {
type: 'line',
data: {
labels: ["January", "February", "March", "April", "May", "June", "July", "August", "September",
"Oktober", "November", "December"
],
datasets: [{
label: 'Transaction',
data: [3200, 18009, 4305, 3022, 6310, 5120, 5880, 6154, 0],
borderWidth: 2,
backgroundColor: 'rgba(63,82,227,.8)',
borderWidth: 0,
borderColor: 'transparent',
pointBorderWidth: 0,
pointRadius: 3.5,
pointBackgroundColor: 'transparent',
pointHoverBackgroundColor: 'rgba(63,82,227,.8)',
},
{
label: 'Refund',
data: [2207, 3403, 220000, 5025, 2302, 4208, 3880, 4880, 5000],
borderWidth: 2,
backgroundColor: 'rgba(254,86,83,.7)',
borderWidth: 0,
borderColor: 'transparent',
pointBorderWidth: 0,
pointRadius: 3.5,
pointBackgroundColor: 'transparent',
pointHoverBackgroundColor: 'rgba(254,86,83,.8)',
}
]
},
options: {
layout: {
padding: 20,
},
legend: {
display: true,
labels: {
padding: 20,
}
},
scales: {
yAxes: [{
gridLines: {
// display: false,
drawBorder: false,
color: '#f2f2f2',
},
ticks: {
beginAtZero: true,
stepSize: 15000,
callback: function(value, index, values) {
// return 'Rp.' + value;
return new Intl.NumberFormat('id-ID', {
style: 'currency',
currency: 'IDR',
}).format(value);
}
}
}],
xAxes: [{
gridLines: {
display: true,
tickMarkLength: 15,
}
}]
},
}
});
var balance_chart = document.getElementById("balance-chart").getContext('2d');
var balance_chart_bg_color = balance_chart.createLinearGradient(0, 0, 0, 70);
balance_chart_bg_color.addColorStop(0, 'rgba(63,82,227,.2)');
balance_chart_bg_color.addColorStop(1, 'rgba(63,82,227,0)');
var myChart = new Chart(balance_chart, {
type: 'line',
data: {
labels: ['16-07-2018', '17-07-2018', '18-07-2018', '19-07-2018', '20-07-2018', '21-07-2018',
'22-07-2018', '23-07-2018', '24-07-2018', '25-07-2018', '26-07-2018', '27-07-2018',
'28-07-2018', '29-07-2018', '30-07-2018', '31-07-2018'
],
datasets: [{
label: 'Balance',
data: [50, 61, 80, 50, 72, 52, 60, 41, 30, 45, 70, 40, 93, 63, 50, 62],
backgroundColor: balance_chart_bg_color,
borderWidth: 3,
borderColor: 'rgba(63,82,227,1)',
pointBorderWidth: 0,
pointBorderColor: 'transparent',
pointRadius: 3,
pointBackgroundColor: 'transparent',
pointHoverBackgroundColor: 'rgba(63,82,227,1)',
}]
},
options: {
layout: {
padding: {
bottom: -1,
left: -1
}
},
legend: {
display: false
},
scales: {
yAxes: [{
gridLines: {
display: false,
drawBorder: false,
},
ticks: {
beginAtZero: true,
display: false
}
}],
xAxes: [{
gridLines: {
drawBorder: false,
display: false,
},
ticks: {
display: false
}
}]
},
}
});
var sales_chart = document.getElementById("sales-chart").getContext('2d');
var sales_chart_bg_color = sales_chart.createLinearGradient(0, 0, 0, 80);
balance_chart_bg_color.addColorStop(0, 'rgba(63,82,227,.2)');
balance_chart_bg_color.addColorStop(1, 'rgba(63,82,227,0)');
var myChart = new Chart(sales_chart, {
type: 'line',
data: {
labels: ['16-07-2018', '17-07-2018', '18-07-2018', '19-07-2018', '20-07-2018', '21-07-2018',
'22-07-2018', '23-07-2018', '24-07-2018', '25-07-2018', '26-07-2018', '27-07-2018',
'28-07-2018', '29-07-2018', '30-07-2018', '31-07-2018'
],
datasets: [{
label: 'Sales',
data: [70, 62, 44, 40, 21, 63, 82, 52, 50, 31, 70, 50, 91, 63, 51, 60],
borderWidth: 2,
backgroundColor: balance_chart_bg_color,
borderWidth: 3,
borderColor: 'rgba(63,82,227,1)',
pointBorderWidth: 0,
pointBorderColor: 'transparent',
pointRadius: 3,
pointBackgroundColor: 'transparent',
pointHoverBackgroundColor: 'rgba(63,82,227,1)',
}]
},
options: {
layout: {
padding: {
bottom: -1,
left: -1
}
},
legend: {
display: false
},
scales: {
yAxes: [{
gridLines: {
display: false,
drawBorder: false,
},
ticks: {
beginAtZero: true,
display: false
}
}],
xAxes: [{
gridLines: {
drawBorder: false,
display: false,
},
ticks: {
display: false
}
}]
},
}
});
</script>
@endsection @endsection

6
resources/views/User/layout/header.blade.php
View File

@ -202,12 +202,12 @@
</li> </li>
<li class="dropdown"><a href="#" data-toggle="dropdown" <li class="dropdown"><a href="#" data-toggle="dropdown"
class="nav-link dropdown-toggle nav-link-lg nav-link-user"> class="nav-link dropdown-toggle nav-link-lg nav-link-user">
<img alt="image" src="assets/img/avatar/avatar-1.png" class="rounded-circle mr-1"> <img alt="image" src="{{asset('assets/img/avatar/avatar-1.png')}}" class="rounded-circle mr-1">
<div class="d-sm-none d-lg-inline-block">Hi, {{ Auth::user()->name }}</div> <div class="d-sm-none d-lg-inline-block">Hi, {{ Auth::user()->nama_depan }}</div>
</a> </a>
<div class="dropdown-menu dropdown-menu-right"> <div class="dropdown-menu dropdown-menu-right">
<div class="dropdown-title">Logged in 5 min ago</div> <div class="dropdown-title">Logged in 5 min ago</div>
<a href="/profile" class="dropdown-item has-icon"> <a href="{{route('user.profile')}}" class="dropdown-item has-icon">
<i class="far fa-user"></i> Profile <i class="far fa-user"></i> Profile
</a> </a>
{{-- <a href="features-activities.html" class="dropdown-item has-icon"> {{-- <a href="features-activities.html" class="dropdown-item has-icon">

48
resources/views/User/layout/main.blade.php
View File

@ -2,28 +2,55 @@
<html lang="en"> <html lang="en">
<head> <head>
<style>
.data-field {
display: flex;
width: 100%;
justify-content: space-between;
font-size: 14px;
}
.data-field:not(:last-child) {
margin-bottom: 15px;
}
.data-field span {
text-align: end;
}
.card-title span a {
color: #899bbd;
text-decoration: underline;
}
.justified-text {
text-align: justify;
}
.font-weight-italic {
font-style: italic;
}
</style>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no" name="viewport"> <meta content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no" name="viewport">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>REKBER</title> <title>REKBER</title>
<!-- General CSS Files --> <!-- General CSS Files -->
<link rel="stylesheet" href="{{ asset('assets/modules/bootstrap/css/bootstrap.min.css') }}"> <link rel="stylesheet" href="{{ asset('assets/modules/bootstrap/css/bootstrap.min.css') }}">
<link rel="stylesheet" href="{{ asset('assets/modules/fontawesome/css/all.min.css') }}"> <link rel="stylesheet" href="{{ asset('assets/modules/fontawesome/css/all.min.css') }}">
<link rel="stylesheet" href="https://cdn.materialdesignicons.com/5.4.55/css/materialdesignicons.min.css"> <link rel="stylesheet" href="https://cdn.materialdesignicons.com/5.4.55/css/materialdesignicons.min.css">
<!-- CSS Libraries -->
<link rel="stylesheet" href="{{ asset('assets/modules/jqvmap/dist/jqvmap.min.css') }}"> <link rel="stylesheet" href="{{ asset('assets/modules/jqvmap/dist/jqvmap.min.css') }}">
<link rel="stylesheet" href="{{ asset('assets/modules/summernote/summernote-bs4.css') }}"> <link rel="stylesheet" href="{{ asset('assets/modules/summernote/summernote-bs4.css') }}">
<link rel="stylesheet" href="{{ asset('assets/modules/owlcarousel2/dist/assets/owl.carousel.min.css') }}"> <link rel="stylesheet" href="{{ asset('assets/modules/owlcarousel2/dist/assets/owl.carousel.min.css') }}">
<link rel="stylesheet" href="{{ asset('assets/modules/owlcarousel2/dist/assets/owl.theme.default.min.css') }}"> <link rel="stylesheet" href="{{ asset('assets/modules/owlcarousel2/dist/assets/owl.theme.default.min.css') }}">
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker@3.1.0/daterangepicker.css" />
<link rel="stylesheet" href="{{ asset('assets/modules/datatables/datatables.min.css') }}"> <link rel="stylesheet" href="{{ asset('assets/modules/datatables/datatables.min.css') }}">
<link rel="stylesheet" <link rel="stylesheet" href="{{ asset('assets/modules/datatables/DataTables-1.10.16/css/dataTables.bootstrap4.min.css') }}">
href="{{ asset('assets/modules/datatables/DataTables-1.10.16/css/dataTables.bootstrap4.min.css') }}">
<link rel="stylesheet" href="{{ asset('assets/modules/datatables/Select-1.2.4/css/select.bootstrap4.min.css') }}"> <link rel="stylesheet" href="{{ asset('assets/modules/datatables/Select-1.2.4/css/select.bootstrap4.min.css') }}">
<link rel="stylesheet" href="{{ asset('assets/css/main.css') }}"> <link rel="stylesheet" href="{{ asset('assets/css/main.css') }}">
<!-- Template CSS --> <!-- Template CSS -->
<link rel="stylesheet" href="{{ asset('assets/css/style.css') }}"> <link rel="stylesheet" href="{{ asset('assets/css/style.css') }}">
<link rel="stylesheet" href="{{ asset('assets/css/components.css') }}"> <link rel="stylesheet" href="{{ asset('assets/css/components.css') }}">
@ -43,6 +70,7 @@
{{-- JS --}} {{-- JS --}}
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="{{ asset('assets/modules/chart.min.js') }}"></script>
</head> </head>
<body> <body>
@ -116,10 +144,10 @@
<script src="{{ asset('assets/modules/nicescroll/jquery.nicescroll.min.js') }}"></script> <script src="{{ asset('assets/modules/nicescroll/jquery.nicescroll.min.js') }}"></script>
<script src="{{ asset('assets/modules/moment.min.js') }}"></script> <script src="{{ asset('assets/modules/moment.min.js') }}"></script>
<script src="{{ asset('assets/js/stisla.js') }}"></script> <script src="{{ asset('assets/js/stisla.js') }}"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<!-- JS Libraies --> <!-- JS Libraies -->
<script src="{{ asset('assets/modules/jquery.sparkline.min.js') }}"></script> <script src="{{ asset('assets/modules/jquery.sparkline.min.js') }}"></script>
<script src="{{ asset('assets/modules/chart.min.js') }}"></script>
<script src="{{ asset('assets/modules/owlcarousel2/dist/owl.carousel.min.js') }}"></script> <script src="{{ asset('assets/modules/owlcarousel2/dist/owl.carousel.min.js') }}"></script>
<script src="{{ asset('assets/modules/summernote/summernote-bs4.js') }}"></script> <script src="{{ asset('assets/modules/summernote/summernote-bs4.js') }}"></script>
<script src="{{ asset('assets/modules/chocolat/dist/js/jquery.chocolat.min.js') }}"></script> <script src="{{ asset('assets/modules/chocolat/dist/js/jquery.chocolat.min.js') }}"></script>
@ -129,7 +157,6 @@
<script src="{{ asset('assets/modules/datatables/DataTables-1.10.16/js/dataTables.bootstrap4.min.js') }}"></script> <script src="{{ asset('assets/modules/datatables/DataTables-1.10.16/js/dataTables.bootstrap4.min.js') }}"></script>
<script src="{{ asset('assets/modules/datatables/Select-1.2.4/js/dataTables.select.min.js') }}"></script> <script src="{{ asset('assets/modules/datatables/Select-1.2.4/js/dataTables.select.min.js') }}"></script>
<script src="{{ asset('assets/modules/jquery-ui/jquery-ui.min.js') }}"></script> <script src="{{ asset('assets/modules/jquery-ui/jquery-ui.min.js') }}"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
{{-- <script type="text/javascript"> {{-- <script type="text/javascript">
$(function() { $(function() {
@ -153,15 +180,14 @@
<script src="{{ asset('assets/js/page/modules-datatables.js') }}"></script> <script src="{{ asset('assets/js/page/modules-datatables.js') }}"></script>
<!-- Page Specific JS File --> <!-- Page Specific JS File -->
<script src="{{ asset('assets/js/page/index.js') }}"></script> {{-- <script src="{{ asset('assets/js/page/index.js') }}"></script> --}}
<script src="https://cdn.jsdelivr.net/npm/daterangepicker@3.1.0/daterangepicker.min.js"></script>i <script src="https://cdn.jsdelivr.net/npm/daterangepicker@3.1.0/daterangepicker.min.js"></script>i
<script src="{{ asset('assets/js/page/index-0.js') }}"></script> {{-- <script src="{{ asset('assets/js/page/index-0.js') }}"></script> --}}
<!-- Template JS File --> <!-- Template JS File -->
<script src="{{ asset('assets/js/scripts.js') }}"></script> <script src="{{ asset('assets/js/scripts.js') }}"></script>
<script src="{{ asset('assets/js/custom.js') }}"></script> <script src="{{ asset('assets/js/custom.js') }}"></script>
{{-- <script src="{{ asset('assets/js/main.js') }}"></script> --}}
<script src="{{ asset('assets/js/main.js') }}"></script>
</body> </body>
</html> </html>

8
resources/views/User/profile/index.blade.php
View File

@ -5,11 +5,9 @@
<div class="section-header"> <div class="section-header">
<h1>Profile</h1> <h1>Profile</h1>
</div> </div>
<div class="card-body profile-card py-2 d-flex flex-column align-items-center text-center" <div class="card-body profile-card py-2 d-flex flex-column align-items-center text-center" style="border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); position: relative; background: linear-gradient(45deg, #f3f3f3, #e0e0e0);">
style="border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); position: relative; background: linear-gradient(45deg, #f3f3f3, #e0e0e0);">
<i class="bi bi-arrow-right" style="position: absolute; top: 10px; right: 10px; font-size: 24px;"></i> <i class="bi bi-arrow-right" style="position: absolute; top: 10px; right: 10px; font-size: 24px;"></i>
<img src="assets/img/avatar/ok.jpg" alt="Profile" class="rounded-circle" style="width: 150px; height: 150px;"> <img src="{{asset('assets/img/avatar/ok.jpg')}}" alt="Profile" class="rounded-circle" style="width: 150px; height: 150px;">
<h2 class="mt-3">Nurul Prima Annisa</h2> <h2 class="mt-3">Nurul Prima Annisa</h2>
<h5 class="mb-0">#123udfai90-20udf82</h5> <h5 class="mb-0">#123udfai90-20udf82</h5>
</div> </div>
@ -120,7 +118,7 @@
<div class="row mb-3"> <div class="row mb-3">
<label for="profileImage" class="col-md-4 col-lg-3 col-form-label">Profile Image</label> <label for="profileImage" class="col-md-4 col-lg-3 col-form-label">Profile Image</label>
<div class="col-md-8 col-lg-9"> <div class="col-md-8 col-lg-9">
<img id="profileImagePreview" src="assets/img/avatar/ok.jpg" alt="Profile" <img id="profileImagePreview" src="{{asset('assets/img/avatar/ok.jpg')}}" alt="Profile"
style="max-width: 100%; max-height: 150px;"> style="max-width: 100%; max-height: 150px;">
<div class="d-flex justify-content-between align-items-center mt-2"> <div class="d-flex justify-content-between align-items-center mt-2">
<label for="profileImageInput" class="btn btn-primary btn-sm" <label for="profileImageInput" class="btn btn-primary btn-sm"

484
resources/views/index.blade.php
View File

@ -4,37 +4,87 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>REKBER</title> <title>REKBER | Homepage</title>
<!-- icon font awesome --> <!-- icon font awesome -->
<script src="https://kit.fontawesome.com/64d58efce2.js" crossorigin="anonymous"></script> <script src="https://kit.fontawesome.com/64d58efce2.js" crossorigin="anonymous"></script>
<!-- css --> <!-- css -->
<link rel="stylesheet" href="{{ asset('assets/css/login_register/style.css') }}" /> <link rel="stylesheet" href="{{ asset('assets/css/login_register/style.css') }}" />
{{-- Token --}}
<meta name="csrf-token" content="{{ csrf_token() }}"> <meta name="csrf-token" content="{{ csrf_token() }}">
<!-- ionicons --> <!-- ionicons -->
<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script> <script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
<!-- Boxicons --> <!-- Boxicons -->
<script src="https://unpkg.com/boxicons@2.1.4/dist/boxicons.js"></script> <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'> <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> </head>
<body> <body>
<!-- ======= PRELOADER ======= --> <!-- ======= PRELOADER ======= -->
<div id="preloader"> {{-- <div id="preloader">
<div id="status"> <div id="status">
<div class="preloader" aria-busy="true" aria-label="Loading, please wait." role="progressbar"> <div class="preloader" aria-busy="true" aria-label="Loading, please wait." role="progressbar">
</div> </div>
</div> </div>
</div> </div> --}}
<!-- ======= END PRELOADER ======= --> <!-- ======= END PRELOADER ======= -->
<!-- ======= MODAL ======= --> <!-- ======= MODAL ======= -->
<div class="modal_wrapper"> {{-- <div class="modal_wrapper">
<div class="shadow"></div> <div class="shadow"></div>
<div class="success_wrap"> <div class="success_wrap">
<span class="modal_icon"><ion-icon name="checkmark-sharp"></ion-icon></span> <span class="modal_icon"><ion-icon name="checkmark-sharp"></ion-icon></span>
<p>You have successfully completed the process.</p> <p>You have successfully completed the process.</p>
</div> </div>
</div> </div> --}}
<!-- ======= MODAL ======= --> <!-- ======= MODAL ======= -->
<div class="container"> <div class="container">
@ -119,9 +169,15 @@
name="nama_belakang" /> name="nama_belakang" />
</div> </div>
</div> </div>
<div class="input-field 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="input-field up"> <div class="input-field up">
<i class="fa fa-envelope" aria-hidden="true"></i> <i class="fa fa-envelope" aria-hidden="true"></i>
<input type="email" placeholder="Email" class="email-input" name="email" /> <input type="email" placeholder="Email" class="email-input" name="new_email" />
</div> </div>
<div class="input-field up"> <div class="input-field up">
@ -132,18 +188,13 @@
</div> </div>
<div style="display: flex;"> <div style="display: flex;">
<div class="input-field-signup-flex up gender-select-menu" style="width: 190%"> <div class="input-field-signup-flex up gender-select-menu" style="width: 190%">
<div class="gender-select-input"> <div class="gender-select-input" style="width: 100%; padding-left: 1rem;">
<span class="gender-select">Jenis Kelamin</span> <select style="width: 190%;" class="gender-select" id="gender-select"
<i class="bx bx-chevron-down" style="padding: 0"></i> name="gender">
<option value="Laki-laki">Laki-laki</option>
<option value="Perempuan">Perempuan</option>
</select>
</div> </div>
<ul class="gender-options" name="gender">
<li class="gender-option">
<span class="gender-option-text">Laki-laki</span>
</li>
<li class="gender-option">
<span class="gender-option-text">Perempuan</span>
</li>
</ul>
</div> </div>
<div class="input-field-signup-flex up" style="margin-left: 3%"> <div class="input-field-signup-flex up" style="margin-left: 3%">
<i class="fa fa-calendar" aria-hidden="true"></i> <i class="fa fa-calendar" aria-hidden="true"></i>
@ -156,178 +207,118 @@
<!-- ======= FORM ADDRESS ======= --> <!-- ======= FORM ADDRESS ======= -->
<div class="form_2 data_info" style="display: none;"> <div class="form_2 data_info" style="display: none;">
<div class="input-field select-menu" style="width: 190%" name="alamat"> <div class="input-field" style="width: 190%; padding: 0rem 1rem;">
<div class="select-btn"> <select id="selectProvince" data-url="{{ route('cari.provinsi') }}"
<span class="sBtn-text">Select Provinsi</span> style="width: 100%; border: 1px solid transparent; " class="input-field"
<i class="bx bx-chevron-down"></i> aria-label="Default select example">
</div>
<ul class="options">
<li class="option">
<span class="option-text">Nanggroe Aceh Darussalam</span>
</li>
<li class="option">
<span class="option-text">Sumatera Utara</span>
</li>
<li class="option">
<span class="option-text">Sumatera Selatan</span>
</li>
<li class="option">
<span class="option-text">Sumatera Barat</span>
</li>
<li class="option">
<span class="option-text">Bengkulu</span>
</li>
<li class="option">
<span class="option-text">Riau</span>
</li>
<li class="option">
<span class="option-text">Kepulauan Riau</span>
</li>
<li class="option">
<span class="option-text">Jambi</span>
</li>
<li class="option">
<span class="option-text">Lampung</span>
</li>
<li class="option">
<span class="option-text">Bangka Belitung</span>
</li>
<li class="option">
<span class="option-text">Kalimantan Barat</span>
</li>
<li class="option">
<span class="option-text">Kalimantan Timur</span>
</li>
<li class="option">
<span class="option-text">Kalimantan Selatan</span>
</li>
<li class="option">
<span class="option-text">Kalimantan Tengah</span>
</li>
<li class="option">
<span class="option-text">Kalimantan Utara</span>
</li>
<li class="option">
<span class="option-text">Banten</span>
</li>
<li class="option">
<span class="option-text">DKI Jakarta</span>
</li>
<li class="option">
<span class="option-text">Jawa Barat</span>
</li>
<li class="option">
<span class="option-text">Jawa Tengah</span>
</li>
<li class="option">
<span class="option-text">Daerah Istimewa Yogyakarta</span>
</li>
<li class="option">
<span class="option-text">Jawa Timur</span>
</li>
<li class="option">
<span class="option-text">Bali</span>
</li>
<li class="option">
<span class="option-text">Nusa Tenggara Timur</span>
</li>
<li class="option">
<span class="option-text">Nusa Tenggara Barat</span>
</li>
<li class="option">
<span class="option-text">Gorontalo</span>
</li>
<li class="option">
<span class="option-text">Sulawesi Barat</span>
</li>
<li class="option">
<span class="option-text">Sulawesi Tengah</span>
</li>
<li class="option">
<span class="option-text">Sulawesi Utara</span>
</li>
<li class="option">
<span class="option-text">Sulawesi Tenggara</span>
</li>
<li class="option">
<span class="option-text">Sulawesi Selatan</span>
</li>
<li class="option">
<span class="option-text">Maluku Utara</span>
</li>
<li class="option">
<span class="option-text">Maluku</span>
</li>
<li class="option">
<span class="option-text">Papua Barat</span>
</li>
<li class="option">
<span class="option-text">Papua</span>
</li>
<li class="option">
<span class="option-text">Papua Tengah</span>
</li>
<li class="option">
<span class="option-text">Papua Pegunungan</span>
</li>
<li class="option">
<span class="option-text">Papua Selatan</span>
</li>
<li class="option">
<span class="option-text">Papua Barat Daya</span>
</li>
</ul>
</div>
<div class="input-field select-menu" style="width: 190%">
<div class="select-btn">
<span class="sBtn-text">Select Kabupaten/Kota</span>
<i class="bx bx-chevron-down"></i>
</div>
</div>
<div class="input-field select-menu" style="width: 190%">
<div class="select-btn">
<span class="sBtn-text">Select Kecamatan</span>
<i class="bx bx-chevron-down"></i>
</div>
</div>
</select>
</div>
<div class='mb-2'>
<div class="input-field" style="width: 190%; padding: 0rem 1rem;">
<select id="selectCity"
style="width: 100%; border: 1px solid transparent; margin-top: 0; outline: none;"
class="input-field" aria-label="Default select example">
</select>
</div>
</div>
<div class='mb-2'>
<div class="input-field" style="width: 190%; padding: 0rem 1rem;">
<select id="selectDistrict"
style="width: 100%; border: 1px solid transparent; margin-top: 0; outline: none;"
class="input-field" aria-label="Default select example">
</select>
</div>
</div>
<div class='mb-2'>
<div class="input-field" style="width: 190%; padding: 0rem 1rem;">
<select id="selectVillage"
style="width: 100%; border: 1px solid transparent; margin-top: 0; outline: none;"
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"
style="width: 190%; padding: 0rem 1rem;">
</div> </div>
<!-- ======= END FORM ADDRESS ======= --> <!-- ======= END FORM ADDRESS ======= -->
<!-- ======= FORM DROP & DRAG IMAGE ======= --> <!-- ======= FORM DROP & DRAG IMAGE ======= -->
<div class="form_3 data_info" style="display: none;"> <div class="form_3 data_info" style="display: none;">
<div class="slider-container">
<div class="container-img"> <div class="slider">
<div class="drop-area box box-h"> <div class="slide fade">
<div class="img"> <div style="display: flex; flex-direction: column; align-items: center">
<img src="img/uploadimg.svg" alt=""> <h3 style="">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">
<div style="display: flex; margin-top: 1rem">
<button type="button" class="btn-foto" id="startButtonKtp"
data-state="off">Mulai Kamera</button>
<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>
<h5 class="drop-area-title">Tarik atau Seret gambar mu di sini</h5> <div class="slide fade">
<p class="drop-area-text">type jpg, png atau jpeg</p> <div
<input type="file" accept="image/*" id="input-file" hidden style="display: flex; flex-direction: column; justify-content: center; align-items: center">
name="foto[]" multiple> <h3>Foto Wajah Anda</h3>
<div class="image-holder-ekyc">
<img class="image-holder-ekyc"
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">
<div style="display: flex; margin-top: 1rem">
<button type="button" class="btn-foto" id="startButtonEkyc"
data-state="off">Mulai Kamera</button>
<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)">&#10094;</button>
<span class="dot" onclick="currentSlide(1)"></span>
<span class="dot" onclick="currentSlide(2)"></span>
<button class="next" type="button"
onclick="plusSlide(1)">&#10095;</button>
</div> </div>
</div> </div>
</div> </div>
<!-- ======= FORM DROP & DRAG IMAGE ======= --> <!-- ======= FORM DROP & DRAG IMAGE ======= -->
<!-- ======= FORM PIN ======= --> <!-- ======= FORM PIN ======= -->
<div class="form_4 data_info" style="display: none;"> <div class="form_4 data_info" style="display: none;">
<div style="display: flex"> <div style="display: flex">
<div class="input-field-signup-flex"> <div class="input-field-signup-flex">
<i class="fa fa-unlock-alt" aria-hidden="true"></i> <i class="fa fa-unlock-alt" aria-hidden="true"></i>
<input type="text" class="pin-input" maxlength="6" <input type="password" class="pin-input" placeholder="Password"
oninput="this.value = this.value.replace(/[^0-9]/g, '').substring(0, 6);" name="new_password">
placeholder="PIN" name="password">
</div> </div>
<div class="input-field-signup-flex" style="margin-left: 3%"> <div class="input-field-signup-flex" style="margin-left: 3%">
<i class="fa fa-unlock-alt" aria-hidden="true"></i> <i class="fa fa-unlock-alt" aria-hidden="true"></i>
<input type="text" class="konfir-pin-input" maxlength="6" <input type="password" class="konfir-pin-input"
oninput="this.value = this.value.replace(/[^0-9]/g, '').substring(0, 6);" placeholder="Konfirmasi Password" name="confirm_password">
placeholder="Konfirmasi PIN" name="confirm_password">
</div> </div>
</div> </div>
@ -355,7 +346,7 @@
<div class="common_btns form_4_btns" style="display: none;"> <div class="common_btns form_4_btns" style="display: none;">
<button type="button" class="btn_back"><span class="icon"><ion-icon <button type="button" class="btn_back"><span class="icon"><ion-icon
name="arrow-back-sharp"></ion-icon></span>Back</button> name="arrow-back-sharp"></ion-icon></span>Back</button>
<button type="submit" class="btn_done">Sign Up</button> <button type="button" class="btn_done" id="signUp">Sign Up</button>
</div> </div>
</div> </div>
<!-- ======= BTN FORM NEXT & BACK ======= --> <!-- ======= BTN FORM NEXT & BACK ======= -->
@ -398,11 +389,18 @@
</div> </div>
</div> </div>
</div> </div>
<script src="{{ asset('assets/js/login_register/jquery.js') }}"></script> {{-- <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> --}}
<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/app.js') }}"></script>
<script src="{{ asset('assets/js/login_register/script.js') }}"></script> <script src="{{ asset('assets/js/login_register/script.js') }}"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script> <script>
$(document).ready(function() { $(document).ready(function() {
$('#cekAkun').on('click', function() { $('#cekAkun').on('click', function() {
@ -471,6 +469,146 @@
} }
} }
}); });
$('#signUp').on('click', function() {
let emptyInput = [];
const csrfToken = $('meta[name="csrf-token"]').attr('content');
let namaDepan = document.querySelector('[name="nama_depan"]').value;
let namaBelakang = document.querySelector('[name="nama_belakang"]').value;
let nik = document.querySelector('[name="nik"]').value;
let email = document.querySelector('[name="new_email"]').value;
let nohp = document.querySelector('[name="nohp"]').value;
let gender = document.querySelector('[name="gender"]').value;
// Tanggal lahir
let tanggalLahir = document.querySelector('[name="tanggal_lahir"]').value;
// Mencari selisih tahun lahir dengan tahun sekarang
// Parse tanggal lahir ke objek Date
let tanggalLahirDate = new Date(tanggalLahir);
// Dapatkan tahun dari tanggal lahir
let tahunLahir = tanggalLahirDate.getFullYear();
// Dapatkan tahun sekarang
let tahunSekarang = new Date().getFullYear();
// Hitung selisih tahun
let selisihTahun = tahunSekarang - tahunLahir;
// Akhir mencari selisih tahun
let kodeKelurahan = document.querySelector('[name="village_code"]').value;
let alamat = document.querySelector('[name="alamat"]').value;
let wajah = document.querySelector('[name="wajah"]').value;
let ktp = document.querySelector('[name="ktp"]').value;
let newPassword = document.querySelector('[name="new_password"]').value;
let confirmPassword = document.querySelector('[name="confirm_password"]').value;
// Pengecekan inputan yang kosong
if (namaDepan.trim() === "" || namaBelakang.trim() === "") {
emptyInput.push("Nama depan dan nama belakang tidak boleh kosong");
}
if (nik.trim() === "") {
emptyInput.push("Nik tidak boleh kosong");
}
if (email.trim() === "") {
emptyInput.push("Email tidak boleh kosong");
}
if (nohp.trim() === "") {
emptyInput.push("nomor HP tidak boleh kosong");
}
if (gender.trim() === "") {
emptyInput.push("Jenis kelamin tidak boleh kosong");
}
if (tanggalLahir.trim() === "") {
emptyInput.push("Tanggal lahir tidak boleh kosong");
} else if (selisihTahun < 17) {
// kondisi dimana usia dibawah 18 tahun
emptyInput.push("Anda harus berusia 17 keatas");
}
if (kodeKelurahan.trim() === "" || alamat.trim() === "") {
emptyInput.push("Alamat tidak boleh kosong");
}
if (wajah.trim() === "") {
emptyInput.push("Silahkan ambil foto wajah anda");
}
if (ktp.trim() === "") {
emptyInput.push("Silahkan ambil foto KTP anda");
}
if (newPassword.trim() === "" || confirmPassword === "") {
emptyInput.push("Password tidak boleh kosong");
} else if (newPassword.trim() != confirmPassword) {
emptyInput.push("Password baru harus sama dengan password yang dikonfirmasi");
}
// kalau terdapat inputan kosong
if (emptyInput.length > 0) {
const emptyInputError = emptyInput.join(', ');
Swal.fire({
title: 'Gagal',
text: emptyInputError,
icon: 'error',
confirmButtonText: 'OK',
});
} else {
const formData = new FormData();
formData.append('nama-depan', namaDepan);
formData.append('nama-belakang', namaBelakang);
formData.append('nik', nik);
formData.append('email', email);
formData.append('nohp', nohp);
formData.append('gender', gender);
formData.append('tanggal-lahir', tanggalLahir);
formData.append('kode-kelurahan', kodeKelurahan);
formData.append('alamat', alamat);
formData.append('wajah', wajah);
formData.append('ktp', ktp);
formData.append('new-password', newPassword);
formData.append('confirm-password', confirmPassword);
$.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 == true) {
location.reload();
}
});
},
error: function(error) {
Swal.fire({
title: 'Gagal',
text: 'Ada form yang kosong atau kesalahan internet. penyebab ' +
error,
icon: 'error',
});
}
});
}
});
}); });
</script> </script>
</body> </body>

18
routes/web.php
View File

@ -79,11 +79,11 @@ Route::get('/next_detail_refund',function() {
// "detail_user" => Users::detailUser() // "detail_user" => Users::detailUser()
// ]); // ]);
// }); // });
Route::get('/profile',function() { // Route::get('/profile',function() {
return view('admin/profile/index',[ // return view('admin/profile/index',[
'name'=>"Jilhan Haura", // 'name'=>"Jilhan Haura",
]); // ]);
}); // });
// Route::get('/setting',function() { // Route::get('/setting',function() {
// return view('admin/setting/index',[ // return view('admin/setting/index',[
// 'name'=>"Jilhan Haura", // 'name'=>"Jilhan Haura",
@ -112,6 +112,10 @@ Route::controller(LoginController::class)->group(function(){
Route::post('/','authenticate')->name('authenticate'); Route::post('/','authenticate')->name('authenticate');
Route::post('/register','register')->name('register'); Route::post('/register','register')->name('register');
Route::get('/cek-email/{email}','statusAkun')->name('status.akun'); Route::get('/cek-email/{email}','statusAkun')->name('status.akun');
Route::get('/cari-provinsi','cariProvinsi')->name('cari.provinsi');
Route::get('/cari-kota/{code}','cariKota')->name('cari.kota');
Route::get('/cari-kecamatan/{code}','cariKecamatan')->name('cari.kecamatan');
Route::get('/cari-kelurahan/{code}','cariKelurahan')->name('cari.kelurahan');
}); });
// admin dan user // admin dan user
@ -121,6 +125,7 @@ Route::middleware(['auth'])->group(function(){
// Tampilan dashboard admin beserta perhitungan // Tampilan dashboard admin beserta perhitungan
Route::controller(AdminDashboardController::class)->group(function(){ Route::controller(AdminDashboardController::class)->group(function(){
Route::get('/','index')->name('admin.index'); Route::get('/','index')->name('admin.index');
Route::get('/profile','profile')->name('admin.profile');
}); });
// Tampilan, aprove atau deny dan hapus user // Tampilan, aprove atau deny dan hapus user
// Route::resource('admin-user', AdminUserController::class); // Route::resource('admin-user', AdminUserController::class);
@ -144,13 +149,14 @@ Route::middleware(['auth'])->group(function(){
// Tampilan dashboard user beserta perhitungan // Tampilan dashboard user beserta perhitungan
Route::controller(UserDashboardController::class)->group(function(){ Route::controller(UserDashboardController::class)->group(function(){
Route::get('/','index')->name('user.index'); Route::get('/','index')->name('user.index');
Route::get('/profile','profile')->name('user.profile');
}); });
// Tampilan, tambah dan hapus kontak // Tampilan, tambah dan hapus kontak
Route::controller(UserContactController::class)->group(function(){ Route::controller(UserContactController::class)->group(function(){
Route::get('user-contact','index')->name('user-contact.index'); Route::get('user-contact','index')->name('user-contact.index');
Route::get('cek-contact/{email}','cekEmail')->name('user-contact.email'); Route::get('cek-contact/{email}','cekEmail')->name('user-contact.email');
Route::post('user-contact','store')->name('user-contact.store'); Route::post('user-contact','store')->name('user-contact.store');
Route::delete('user-contact/{id}','delete')->name('user-contact.delete'); Route::delete('user-contact/{id}','destroy')->name('user-contact.delete');
}); });
// Tampilan transaksi, bayar, update status pengiriman dan refund // Tampilan transaksi, bayar, update status pengiriman dan refund
Route::controller(UserTransactionController::class)->group(function(){ Route::controller(UserTransactionController::class)->group(function(){