E31230935_GalangSefianAdji_B
/
sistem_rekomendasi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update

This commit is contained in:
GalangSefin 2026-05-12 11:25:41 +07:00
parent 40a227ca7a
commit 68b3232ef2
9 changed files with 582 additions and 182 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

116
app/Http/Controllers/Api/Student/RecommendationApiController.php
View File

@ -7,7 +7,6 @@
use Illuminate\Http\Request; use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth; use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Http; use Illuminate\Support\Facades\Http;
use Illuminate\Validation\ValidationException;
class RecommendationApiController extends Controller class RecommendationApiController extends Controller
{ {
@ -49,15 +48,7 @@ public function hitungPrediksi(Request $request)
'gaji_ortu' => 'required|numeric|min:0', 'gaji_ortu' => 'required|numeric|min:0',
]); ]);
$gaji = (float) $validated['gaji_ortu']; $ekonomiOrangTua = self::getLabelEkonomiSingkat($validated['gaji_ortu']);
if ($gaji < 2000000) {
$ekonomiOrangTua = 'Kurang Mampu';
} elseif ($gaji <= 5000000) {
$ekonomiOrangTua = 'Menengah';
} else {
$ekonomiOrangTua = 'Mampu';
}
$payload = $validated; $payload = $validated;
$payload['ekonomi_orang_tua'] = $ekonomiOrangTua; $payload['ekonomi_orang_tua'] = $ekonomiOrangTua;
@ -133,4 +124,109 @@ public function hitungPrediksi(Request $request)
], 500); ], 500);
} }
} }
public function getHasilRekomendasi($id)
{
$riwayat = RiwayatRekomendasi::findOrFail($id);
return response()->json([
'success' => true,
'data' => self::formatHasilData($riwayat)
]);
}
public static function formatHasilData(RiwayatRekomendasi $riwayat): array
{
return [
'id' => $riwayat->id,
'hasil_rekomendasi_jurusan' => $riwayat->hasil_rekomendasi_jurusan,
'label_ekonomi' => self::getLabelEkonomiDetail($riwayat->gaji_ortu),
'minat_utama' => self::getMinatUtamaLabel($riwayat),
'prospek_kerja' => self::getProspekKerjaText($riwayat->hasil_rekomendasi_jurusan),
'gaji_ortu' => $riwayat->gaji_ortu,
'riasec' => [
'r' => $riwayat->riasec_r,
'i' => $riwayat->riasec_i,
'a' => $riwayat->riasec_a,
's' => $riwayat->riasec_s,
'e' => $riwayat->riasec_e,
'c' => $riwayat->riasec_c,
],
];
}
public static function getLabelEkonomiSingkat($gaji): string
{
$gaji = (float) $gaji;
if ($gaji < 2000000) {
return 'Kurang Mampu';
} elseif ($gaji <= 5000000) {
return 'Menengah';
}
return 'Mampu';
}
public static function getLabelEkonomiDetail($gaji): string
{
$gaji = (float) $gaji;
if ($gaji < 2000000) {
return 'Kurang Mampu (< Rp 2.000.000)';
} elseif ($gaji <= 5000000) {
return 'Menengah (Rp 2.000.000 - Rp 5.000.000)';
}
return 'Mampu (> Rp 5.000.000)';
}
public static function getMinatUtamaLabel(RiwayatRekomendasi $riwayat): string
{
$riasecScores = [
'r' => (float) $riwayat->riasec_r,
'i' => (float) $riwayat->riasec_i,
'a' => (float) $riwayat->riasec_a,
's' => (float) $riwayat->riasec_s,
'e' => (float) $riwayat->riasec_e,
'c' => (float) $riwayat->riasec_c,
];
arsort($riasecScores);
$topCode = array_key_first($riasecScores);
$labels = [
'r' => 'Teknis & Lapangan',
'i' => 'Sains, Riset & Analitis',
'a' => 'Kreatif & Desain',
's' => 'Sosial & Pelayanan',
'e' => 'Bisnis & Kepemimpinan',
'c' => 'Administratif & Terstruktur',
];
return $labels[$topCode] ?? 'Belum teridentifikasi';
}
public static function getProspekKerjaText($jurusan): string
{
$jurusan = strtolower((string) $jurusan);
if (str_contains($jurusan, 'ekonomi') || str_contains($jurusan, 'manajemen') || str_contains($jurusan, 'bisnis')) {
return 'Lulusan bidang ini dapat berkarier sebagai manajer bisnis, staf keuangan, analis pasar, konsultan bisnis, wirausahawan, maupun pegawai instansi pemerintah dan BUMN pada sektor ekonomi dan administrasi.';
}
if (str_contains($jurusan, 'teknik') || str_contains($jurusan, 'informatika') || str_contains($jurusan, 'komputer')) {
return 'Lulusan bidang ini memiliki peluang karier sebagai software developer, analis sistem, teknisi, network engineer, data analyst, maupun profesional teknologi di perusahaan swasta, startup, dan instansi pemerintah.';
}
if (str_contains($jurusan, 'kesehatan') || str_contains($jurusan, 'keperawatan') || str_contains($jurusan, 'farmasi')) {
return 'Lulusan bidang ini dapat berkarier di rumah sakit, klinik, laboratorium, industri kesehatan, layanan masyarakat, maupun lembaga penelitian kesehatan.';
}
if (str_contains($jurusan, 'pendidikan') || str_contains($jurusan, 'guru')) {
return 'Lulusan bidang ini memiliki prospek sebagai guru, tenaga pendidik, instruktur pelatihan, pengembang kurikulum, maupun konsultan pendidikan.';
}
return 'Prospek karier untuk jurusan ini sangat luas, mulai dari spesialis industri, konsultan ahli, hingga pegawai instansi pemerintah/BUMN di sektor terkait.';
}
} }

21
app/Http/Controllers/Student/RecommendationController.php
View File

@ -3,25 +3,30 @@
namespace App\Http\Controllers\Student; namespace App\Http\Controllers\Student;
use App\Http\Controllers\Controller; use App\Http\Controllers\Controller;
use Illuminate\Http\Request; use App\Http\Controllers\Api\Student\RecommendationApiController;
use App\Models\RiwayatRekomendasi; use App\Models\RiwayatRekomendasi;
class RecommendationController extends Controller class RecommendationController extends Controller
{ {
// Menampilkan halaman form terpadu (Kuesioner + Nilai)
public function prediction() public function prediction()
{ {
return view('student.prediksi'); return view('student.prediksi');
} }
// Menampilkan halaman hasil khusus berdasarkan ID
public function result($id) public function result($id)
{ {
$riwayat = RiwayatRekomendasi::findOrFail($id); $riwayat = RiwayatRekomendasi::findOrFail($id);
$hasil = RecommendationApiController::formatHasilData($riwayat);
// Informasi Prospek Kerja berdasarkan hasil (Bisa kamu sesuaikan teksnya)
$prospekKerja = "Prospek karier untuk jurusan ini sangat luas, mulai dari spesialis industri, konsultan ahli, hingga pegawai instansi pemerintah/BUMN di sektor terkait."; $labelEkonomi = $hasil['label_ekonomi'];
$minatUtama = $hasil['minat_utama'];
return view('student.hasil', compact('riwayat', 'prospekKerja')); $prospekKerja = $hasil['prospek_kerja'];
return view('student.hasil', compact(
'riwayat',
'labelEkonomi',
'minatUtama',
'prospekKerja'
));
} }
} }

26
database/migrations/2026_03_30_113537_create_riwayat_rekomendasis_table.php
View File

@ -5,17 +5,12 @@
use Illuminate\Support\Facades\Schema; use Illuminate\Support\Facades\Schema;
return new class extends Migration { return new class extends Migration {
public function up(): void { public function up(): void
{
Schema::create('riwayat_rekomendasis', function (Blueprint $table) { Schema::create('riwayat_rekomendasis', function (Blueprint $table) {
$table->id(); $table->id();
$table->foreignId('user_id')->constrained('users')->cascadeOnDelete(); // Hilangkan komentar jika sudah pakai login Auth $table->foreignId('user_id')->constrained('users')->cascadeOnDelete();
// Kolom Profil
$table->integer('gaji_ortu');
$table->integer('ekonomi_orang_tua'); // 0: Kurang, 1: Menengah, 2: Mampu
$table->integer('minat_bakat'); // 0-3 sesuai dataset
// 15 Nilai Mata Pelajaran
$table->float('agama'); $table->float('agama');
$table->float('pkn'); $table->float('pkn');
$table->float('bahasa_indonesia'); $table->float('bahasa_indonesia');
@ -32,13 +27,22 @@ public function up(): void {
$table->float('pjok'); $table->float('pjok');
$table->float('informatika'); $table->float('informatika');
// Hasil Akhir $table->float('riasec_r')->default(0);
$table->float('riasec_i')->default(0);
$table->float('riasec_a')->default(0);
$table->float('riasec_s')->default(0);
$table->float('riasec_e')->default(0);
$table->float('riasec_c')->default(0);
$table->bigInteger('gaji_ortu');
$table->string('hasil_rekomendasi_jurusan')->nullable(); $table->string('hasil_rekomendasi_jurusan')->nullable();
$table->timestamps(); $table->timestamps();
}); });
} }
public function down(): void { public function down(): void
{
Schema::dropIfExists('riwayat_rekomendasis'); Schema::dropIfExists('riwayat_rekomendasis');
} }
}; };

0
app/ai_model/encoders_15mapel.pkl → flask_api/encoders_15mapel.pkl
View File

0
app/ai_model/feature_columns_15mapel.pkl → flask_api/feature_columns_15mapel.pkl
View File

197
resources/views/student/hasil.blade.php
View File

@ -5,81 +5,184 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hasil Analisis - ASGARD</title> <title>Hasil Analisis - ASGARD</title>
<script src="https://cdn.tailwindcss.com"></script> <script src="https://cdn.tailwindcss.com"></script>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;700;800&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet">
<style> <style>
body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: #f8fafc; } body {
font-family: 'Plus Jakarta Sans', sans-serif;
background-color: #f8fafc;
}
.card-shadow {
box-shadow: 0 14px 40px rgba(15, 23, 42, 0.08);
}
</style> </style>
</head> </head>
<body class="flex flex-col min-h-screen"> <body class="flex flex-col min-h-screen text-slate-800">
<nav class="bg-white border-b border-slate-100 px-6 py-4 mb-10"> <nav class="sticky top-0 z-50 bg-white/95 backdrop-blur-md border-b border-slate-100 px-6 py-4">
<div class="max-w-7xl mx-auto flex justify-between items-center"> <div class="max-w-7xl mx-auto flex items-center justify-between gap-4">
<div class="flex items-center gap-4"> <div class="flex items-center gap-4">
<div class="w-10 h-10 bg-emerald-100 rounded-xl flex items-center justify-center text-emerald-600 font-bold">AS</div> <div class="w-10 h-10 bg-emerald-100 rounded-xl flex items-center justify-center text-emerald-600 font-bold">AS</div>
<span class="font-black text-xl tracking-tighter text-emerald-950 uppercase italic">ASGARD.</span> <span class="font-black text-xl tracking-tighter text-emerald-950 uppercase italic">ASGARD.</span>
</div> </div>
<div class="hidden md:flex items-center gap-8 text-[11px] font-bold uppercase tracking-widest text-slate-400">
<a href="{{ route('student.profile') }}" class="hover:text-emerald-600 transition">Beranda</a>
<a href="{{ route('student.prediction') }}" class="text-emerald-600">Cek Rekomendasi</a>
<a href="#" class="hover:text-emerald-600 transition">Kontak BK</a>
</div>
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<a href="{{ route('student.prediction') }}" <div class="hidden sm:flex items-center gap-3 bg-emerald-50 px-4 py-2 rounded-full border border-emerald-100">
class="text-sm font-semibold text-slate-600 hover:text-emerald-600 transition"> <div class="w-2 h-2 bg-emerald-500 rounded-full animate-pulse"></div>
Kembali ke Form <span class="text-[10px] font-bold text-emerald-700 uppercase">Siswa Terdaftar</span>
</a> </div>
<button onclick="handleLogout()" <button onclick="handleLogout()" class="bg-red-50 hover:bg-red-100 text-red-600 border border-red-100 px-4 py-2 rounded-full transition-all">
class="bg-red-50 hover:bg-red-100 text-red-600 border border-red-100 px-4 py-2 rounded-full transition-all">
<span class="text-[10px] font-bold uppercase tracking-widest">Logout</span> <span class="text-[10px] font-bold uppercase tracking-widest">Logout</span>
</button> </button>
</div> </div>
</div> </div>
</nav> </nav>
<main class="flex-grow flex items-center justify-center px-6"> <main class="flex-grow px-6 py-10">
<div class="max-w-xl w-full bg-white p-10 rounded-3xl shadow-xl text-center border border-slate-100 relative overflow-hidden"> <div class="max-w-5xl mx-auto">
<div class="absolute -top-10 -right-10 w-32 h-32 bg-emerald-50 rounded-full blur-2xl"></div> <div class="text-center mb-8">
<div class="absolute -bottom-10 -left-10 w-32 h-32 bg-blue-50 rounded-full blur-2xl"></div> <div class="inline-flex items-center gap-2 bg-emerald-100 text-emerald-700 px-4 py-2 rounded-full text-xs font-bold">
Analisis Random Forest Selesai ✅
<div class="relative z-10">
<div class="w-20 h-20 bg-emerald-100 text-emerald-600 rounded-full flex items-center justify-center mx-auto mb-6">
<svg class="w-10 h-10" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
</div> </div>
<h1 class="mt-5 text-4xl md:text-5xl font-extrabold tracking-tight text-slate-900">
<h2 class="text-slate-500 font-bold tracking-widest text-sm mb-2 uppercase">Rekomendasi AI Engine</h2> Laporan Rekomendasi AI
<h1 class="text-4xl font-extrabold text-slate-800 mb-6 leading-tight">
{{ $riwayat->hasil_rekomendasi_jurusan }}
</h1> </h1>
<p class="text-slate-500 mt-3">
Berdasarkan data akademik dan minat bakat, berikut diagnosis masa depanmu.
</p>
</div>
<div class="bg-slate-50 p-6 rounded-2xl mb-8 border border-slate-100 text-left"> <div class="bg-gradient-to-br from-emerald-600 via-emerald-500 to-teal-600 rounded-[2.5rem] p-8 md:p-14 text-white card-shadow mb-8 relative overflow-hidden">
<h3 class="font-bold text-slate-800 mb-2">Ringkasan Analisis</h3> <div class="absolute inset-0 opacity-10">
<p class="text-slate-600 text-sm leading-relaxed mb-4"> <div class="absolute -top-10 -left-10 w-40 h-40 bg-white rounded-full blur-3xl"></div>
Berdasarkan perpaduan profil akademik siswa, skor minat bakat RIASEC, dan kondisi ekonomi keluarga, <div class="absolute -bottom-10 -right-10 w-56 h-56 bg-white rounded-full blur-3xl"></div>
sistem merekomendasikan jurusan ini sebagai pilihan yang paling sesuai untuk Anda. </div>
<div class="relative z-10 text-center">
<p class="text-[11px] md:text-sm font-bold uppercase tracking-[0.35em] text-emerald-100 mb-5">
Sangat Cocok di Bidang
</p> </p>
<h3 class="font-bold text-slate-800 mb-2">Peluang Karier</h3> <h2 class="text-3xl md:text-6xl font-black uppercase leading-tight tracking-tight mb-8">
<p class="text-slate-600 text-sm leading-relaxed"> {{ $riwayat->hasil_rekomendasi_jurusan }}
{{ $prospekKerja ?? 'Informasi prospek karier belum tersedia untuk jurusan ini.' }} </h2>
<div class="flex flex-col sm:flex-row gap-3 justify-center">
<a href="{{ route('student.prediction') }}"
class="inline-flex items-center justify-center bg-emerald-700/70 hover:bg-emerald-800 text-white font-bold py-4 px-8 rounded-2xl transition border border-white/10">
↻ Ulangi Analisis
</a>
<a href="{{ route('student.profile') }}"
class="inline-flex items-center justify-center bg-white hover:bg-slate-100 text-emerald-700 font-bold py-4 px-8 rounded-2xl transition">
Kembali ke Dashboard →
</a>
</div>
</div>
</div>
<div class="bg-white rounded-[2rem] border border-slate-100 card-shadow p-6 md:p-8 mb-8">
<div class="flex items-center gap-3 mb-6">
<div class="w-10 h-10 rounded-2xl bg-violet-100 flex items-center justify-center text-xl">👤</div>
<h3 class="text-2xl font-extrabold text-slate-800">Rekapan Profilmu</h3>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div class="bg-slate-50 border border-slate-100 rounded-3xl p-5">
<p class="text-[11px] font-bold uppercase tracking-widest text-slate-400 mb-3">Kondisi Ekonomi</p>
<div class="flex items-center gap-4">
<div class="w-14 h-14 rounded-2xl bg-amber-100 flex items-center justify-center text-2xl">💰</div>
<div>
<p class="font-extrabold text-slate-800 leading-snug">
{{ $labelEkonomi }}
</p>
</div>
</div>
</div>
<div class="bg-slate-50 border border-slate-100 rounded-3xl p-5">
<p class="text-[11px] font-bold uppercase tracking-widest text-slate-400 mb-3">Minat Utama</p>
<div class="flex items-center gap-4">
<div class="w-14 h-14 rounded-2xl bg-pink-100 flex items-center justify-center text-2xl">🎯</div>
<div>
<p class="font-extrabold text-slate-800 leading-snug">
{{ $minatUtama }}
</p>
</div>
</div>
</div>
<div class="bg-slate-50 border border-slate-100 rounded-3xl p-5">
<p class="text-[11px] font-bold uppercase tracking-widest text-slate-400 mb-3">Akademik</p>
<div class="flex items-center gap-4">
<div class="w-14 h-14 rounded-2xl bg-cyan-100 flex items-center justify-center text-2xl">📚</div>
<div>
<p class="font-extrabold text-slate-800 leading-snug">
15 Mata Pelajaran
</p>
</div>
</div>
</div>
</div>
</div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="bg-white rounded-[2rem] border border-slate-100 card-shadow p-6 md:p-8">
<h3 class="text-xl font-extrabold text-slate-800 mb-4">Ringkasan Analisis</h3>
<p class="text-slate-600 leading-relaxed">
Berdasarkan perpaduan profil akademik, kecenderungan minat bakat, dan kondisi ekonomi keluarga,
sistem menilai bahwa jurusan ini merupakan pilihan yang paling relevan untuk dipertimbangkan pada tahap saat ini.
</p> </p>
</div> </div>
<div class="flex flex-col sm:flex-row gap-3 justify-center"> <div class="bg-white rounded-[2rem] border border-slate-100 card-shadow p-6 md:p-8">
<a href="{{ route('student.prediction') }}" <h3 class="text-xl font-extrabold text-slate-800 mb-4">Peluang Karier</h3>
class="inline-block bg-slate-800 hover:bg-slate-900 text-white font-bold py-3 px-8 rounded-xl transition shadow-lg"> <p class="text-slate-600 leading-relaxed">
Analisis Ulang {{ $prospekKerja }}
</a> </p>
<a href="{{ route('student.profile') }}"
class="inline-block bg-emerald-600 hover:bg-emerald-700 text-white font-bold py-3 px-8 rounded-xl transition shadow-lg">
Kembali ke Dashboard
</a>
</div> </div>
</div> </div>
</div> </div>
</main> </main>
<footer class="bg-slate-900 text-white mt-20 py-12 px-6"> <footer class="bg-[#062C22] text-white py-16 px-6 mt-16">
<div class="max-w-7xl mx-auto flex justify-between items-center text-center"> <div class="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-12">
<p class="text-[10px] font-medium uppercase tracking-[0.2em] text-slate-500 w-full"> <div class="space-y-6">
© 2026 ASGARD SMAN 4 JEMBER. All Rights Reserved. <div class="flex items-center gap-4">
<span class="font-black text-2xl tracking-tighter uppercase italic">ASGARD.</span>
</div>
<p class="text-slate-300 text-sm leading-relaxed max-w-xs">
Sistem pakar rekomendasi jurusan kuliah SMAN 4 Jember berbasis data-driven.
</p>
</div>
<div>
<h5 class="font-bold text-xs uppercase tracking-widest text-emerald-400 mb-6">Informasi</h5>
<ul class="space-y-4 text-sm text-slate-300">
<li><a href="{{ route('panduan') }}" class="hover:text-white transition">Panduan Sistem</a></li>
<li><a href="#" class="hover:text-white transition">Kebijakan Privasi</a></li>
</ul>
</div>
<div>
<h5 class="font-bold text-xs uppercase tracking-widest text-emerald-400 mb-6">Sekolah</h5>
<ul class="space-y-4 text-sm text-slate-300">
<li>SMAN 4 Jember</li>
<li>Jl. Wolter Monginsidi No.24</li>
<li>Jember, Jawa Timur</li>
</ul>
</div>
</div>
<div class="max-w-7xl mx-auto mt-16 pt-8 border-t border-white/10 text-center">
<p class="text-[10px] font-medium uppercase tracking-[0.5em] text-slate-400">
© 2026 GALANG SEFIAN ADJI - POLITEKNIK NEGERI JEMBER
</p> </p>
</div> </div>
</footer> </footer>

383
resources/views/student/prediksi.blade.php
View File

@ -3,117 +3,287 @@
<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>Analisis Rekomendasi - ASGARD SMAN 4 Jember</title> <title>Cek Rekomendasi - ASGARD</title>
<script src="https://cdn.tailwindcss.com"></script> <script src="https://cdn.tailwindcss.com"></script>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;700;800&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet">
<meta name="csrf-token" content="{{ csrf_token() }}"> <meta name="csrf-token" content="{{ csrf_token() }}">
<style> <style>
body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: #f8fafc; } body {
font-family: 'Plus Jakarta Sans', sans-serif;
background-color: #f8fafc;
}
.card-shadow {
box-shadow: 0 14px 40px rgba(15, 23, 42, 0.08);
}
</style> </style>
</head> </head>
<body class="flex flex-col min-h-screen"> <body class="flex flex-col min-h-screen text-slate-800">
<nav class="bg-white border-b border-slate-100 px-6 py-4 mb-10"> <nav class="sticky top-0 z-50 bg-white/95 backdrop-blur-md border-b border-slate-100 px-6 py-4">
<div class="max-w-7xl mx-auto flex justify-between items-center"> <div class="max-w-7xl mx-auto flex items-center justify-between gap-4">
<div class="flex items-center gap-4"> <div class="flex items-center gap-4">
<div class="w-10 h-10 bg-emerald-100 rounded-xl flex items-center justify-center text-emerald-600 font-bold">AS</div> <div class="w-10 h-10 bg-emerald-100 rounded-xl flex items-center justify-center text-emerald-600 font-bold">AS</div>
<span class="font-black text-xl tracking-tighter text-emerald-950 uppercase italic">ASGARD.</span> <span class="font-black text-xl tracking-tighter text-emerald-950 uppercase italic">ASGARD.</span>
</div> </div>
<div class="hidden md:flex items-center gap-8 text-[11px] font-bold uppercase tracking-widest text-slate-400">
<a href="{{ route('student.profile') }}" class="hover:text-emerald-600 transition">Beranda</a>
<a href="{{ route('student.prediction') }}" class="text-emerald-600">Cek Rekomendasi</a>
<a href="#" class="hover:text-emerald-600 transition">Kontak BK</a>
</div>
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<a href="{{ route('student.profile') }}" <div class="hidden sm:flex items-center gap-3 bg-emerald-50 px-4 py-2 rounded-full border border-emerald-100">
class="text-sm font-semibold text-slate-600 hover:text-emerald-600 transition"> <div class="w-2 h-2 bg-emerald-500 rounded-full animate-pulse"></div>
Dashboard <span class="text-[10px] font-bold text-emerald-700 uppercase">Siswa Terdaftar</span>
</a> </div>
<button onclick="handleLogout()" <button onclick="handleLogout()" class="bg-red-50 hover:bg-red-100 text-red-600 border border-red-100 px-4 py-2 rounded-full transition-all">
class="bg-red-50 hover:bg-red-100 text-red-600 border border-red-100 px-4 py-2 rounded-full transition-all">
<span class="text-[10px] font-bold uppercase tracking-widest">Logout</span> <span class="text-[10px] font-bold uppercase tracking-widest">Logout</span>
</button> </button>
</div> </div>
</div> </div>
</nav> </nav>
<div class="max-w-4xl mx-auto px-6 pb-20 w-full"> <main class="flex-grow px-6 py-10">
<h2 class="text-3xl font-extrabold text-slate-800 mb-2">Formulir Rekomendasi Jurusan</h2> <div class="max-w-3xl mx-auto">
<p class="text-slate-500 mb-8">Lengkapi data nilai dan jawab kuesioner di bawah ini dengan jujur.</p> <div class="bg-white rounded-[2rem] card-shadow border border-slate-100 px-6 md:px-10 py-8 md:py-10">
<div class="text-center mb-8">
<div class="w-12 h-12 mx-auto rounded-2xl bg-emerald-100 flex items-center justify-center text-2xl mb-4">
🧠
</div>
<h1 class="text-3xl md:text-4xl font-extrabold tracking-tight text-slate-900">DIAGNOSIS JURUSAN</h1>
<p class="text-slate-500 mt-3 text-sm md:text-base">
Isi data berikut dengan jujur agar sistem dapat memberikan rekomendasi jurusan kuliah yang sesuai.
</p>
</div>
<div id="alert-box" class="hidden mb-6 rounded-xl border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700"></div> <div id="alert-box" class="hidden mb-6 rounded-2xl border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700"></div>
<div class="bg-white p-6 rounded-2xl shadow-sm border border-slate-100 mb-8"> <div class="space-y-6">
<h3 class="font-bold text-lg mb-4 text-emerald-700">1. Data Nilai Rapor (Skala 0-100)</h3> <section class="bg-slate-50 border border-slate-100 rounded-3xl p-5 md:p-6">
<div class="grid grid-cols-1 md:grid-cols-3 gap-4"> <h2 class="font-extrabold text-slate-800 mb-1">💰 Kondisi Ekonomi</h2>
<div><label class="text-sm font-semibold">Agama</label><input type="number" id="agama" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> <p class="text-sm text-slate-500 mb-4">
<div><label class="text-sm font-semibold">PKN</label><input type="number" id="pkn" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> Masukkan estimasi pendapatan gabungan orang tua per bulan dalam rupiah.
<div><label class="text-sm font-semibold">Bahasa Indonesia</label><input type="number" id="bahasa_indonesia" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> </p>
<div><label class="text-sm font-semibold">Bahasa Inggris</label><input type="number" id="bahasa_inggris" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div>
<div><label class="text-sm font-semibold">Matematika</label><input type="number" id="matematika" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> <input
<div><label class="text-sm font-semibold">Fisika</label><input type="number" id="fisika" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> type="number"
<div><label class="text-sm font-semibold">Kimia</label><input type="number" id="kimia" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> id="gaji_ortu"
<div><label class="text-sm font-semibold">Biologi</label><input type="number" id="biologi" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> min="0"
<div><label class="text-sm font-semibold">Sejarah</label><input type="number" id="sejarah" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> placeholder="Contoh: 3000000"
<div><label class="text-sm font-semibold">Geografi</label><input type="number" id="geografi" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> class="w-full rounded-2xl border border-slate-200 bg-white px-4 py-4 text-base font-semibold text-slate-700 outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100"
<div><label class="text-sm font-semibold">Ekonomi</label><input type="number" id="ekonomi_mapel" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> >
<div><label class="text-sm font-semibold">Sosiologi</label><input type="number" id="sosiologi" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div>
<div><label class="text-sm font-semibold">Seni Budaya</label><input type="number" id="seni_budaya" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> <p class="text-xs text-slate-400 mt-2">
<div><label class="text-sm font-semibold">PJOK</label><input type="number" id="pjok" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> Isi dengan angka saja tanpa titik atau koma.
<div><label class="text-sm font-semibold">Informatika</label><input type="number" id="informatika" min="0" max="100" class="w-full border rounded-lg p-2 mt-1" value="85"></div> </p>
</section>
<section class="bg-emerald-50/40 border border-emerald-100 rounded-3xl p-5 md:p-6">
<h2 class="font-extrabold text-emerald-800 mb-4">🎯 Kuesioner Minat & Bakat</h2>
<div class="space-y-4">
<div>
<label for="q1" class="block text-sm font-semibold text-slate-700 mb-2">
1. Aktivitas apa yang paling kamu sukai?
</label>
<select id="q1" class="question-select w-full rounded-2xl border border-slate-200 bg-white px-4 py-4 text-sm text-slate-700 outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
<option value="">Pilih jawaban</option>
<option value="r">Memperbaiki alat, praktik lapangan, atau pekerjaan teknis</option>
<option value="i">Meneliti, mengamati, dan memecahkan masalah logika</option>
<option value="a">Menggambar, menulis, mendesain, atau berkarya</option>
<option value="s">Membantu, mengajar, atau mendampingi orang lain</option>
<option value="e">Memimpin tim, negosiasi, atau berwirausaha</option>
<option value="c">Mengatur data, arsip, dokumen, dan pekerjaan terstruktur</option>
</select>
</div>
<div>
<label for="q2" class="block text-sm font-semibold text-slate-700 mb-2">
2. Saat ada tugas kelompok, kamu paling nyaman berperan sebagai apa?
</label>
<select id="q2" class="question-select w-full rounded-2xl border border-slate-200 bg-white px-4 py-4 text-sm text-slate-700 outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
<option value="">Pilih jawaban</option>
<option value="r">Pelaksana teknis atau praktik</option>
<option value="i">Analis data dan pencari solusi</option>
<option value="a">Pembuat ide dan desain</option>
<option value="s">Penjaga kekompakan tim</option>
<option value="e">Pemimpin dan presenter</option>
<option value="c">Penyusun dokumen dan jadwal</option>
</select>
</div>
<div>
<label for="q3" class="block text-sm font-semibold text-slate-700 mb-2">
3. Jenis pekerjaan masa depan yang paling menarik buatmu?
</label>
<select id="q3" class="question-select w-full rounded-2xl border border-slate-200 bg-white px-4 py-4 text-sm text-slate-700 outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
<option value="">Pilih jawaban</option>
<option value="r">Teknisi, operator, atau pekerjaan lapangan</option>
<option value="i">Dokter, peneliti, analis, atau ilmuwan</option>
<option value="a">Desainer, penulis, editor, atau seniman</option>
<option value="s">Guru, konselor, perawat, atau pekerja sosial</option>
<option value="e">Pebisnis, manajer, marketer, atau leader</option>
<option value="c">Administrator, akuntan, atau staf operasional</option>
</select>
</div>
<div>
<label for="q4" class="block text-sm font-semibold text-slate-700 mb-2">
4. Kegiatan sekolah seperti apa yang paling kamu nikmati?
</label>
<select id="q4" class="question-select w-full rounded-2xl border border-slate-200 bg-white px-4 py-4 text-sm text-slate-700 outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
<option value="">Pilih jawaban</option>
<option value="r">Praktikum, keterampilan, atau kegiatan teknis</option>
<option value="i">Eksperimen, olimpiade, atau analisis kasus</option>
<option value="a">Lomba desain, seni, atau karya kreatif</option>
<option value="s">Kegiatan sosial, mentoring, atau organisasi pelayanan</option>
<option value="e">OSIS, lomba bisnis, atau kepanitiaan inti</option>
<option value="c">Administrasi acara, pencatatan, atau dokumentasi</option>
</select>
</div>
<div>
<label for="q5" class="block text-sm font-semibold text-slate-700 mb-2">
5. Kamu paling nyaman bekerja dalam suasana seperti apa?
</label>
<select id="q5" class="question-select w-full rounded-2xl border border-slate-200 bg-white px-4 py-4 text-sm text-slate-700 outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
<option value="">Pilih jawaban</option>
<option value="r">Aktif, praktik, dan langsung di lapangan</option>
<option value="i">Tenang, fokus, dan penuh analisis</option>
<option value="a">Bebas, kreatif, dan tidak kaku</option>
<option value="s">Hangat, kolaboratif, dan banyak interaksi</option>
<option value="e">Dinamis, kompetitif, dan penuh tantangan</option>
<option value="c">Rapi, teratur, dan jelas prosedurnya</option>
</select>
</div>
</div>
</section>
<section class="bg-slate-50 border border-slate-100 rounded-3xl p-5 md:p-6">
<h2 class="font-extrabold text-slate-700 mb-2">📚 Nilai Rapor</h2>
<p class="text-sm text-slate-500 mb-4">
Masukkan nilai rapor pada setiap mata pelajaran dengan rentang 0 sampai 100.
</p>
<div class="grid grid-cols-2 md:grid-cols-5 gap-4">
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">Agama</label>
<input type="number" id="agama" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">PKN</label>
<input type="number" id="pkn" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">B. Indonesia</label>
<input type="number" id="bahasa_indonesia" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">B. Inggris</label>
<input type="number" id="bahasa_inggris" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">Matematika</label>
<input type="number" id="matematika" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">Fisika</label>
<input type="number" id="fisika" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">Kimia</label>
<input type="number" id="kimia" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">Biologi</label>
<input type="number" id="biologi" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">Sejarah</label>
<input type="number" id="sejarah" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">Geografi</label>
<input type="number" id="geografi" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">Ekonomi</label>
<input type="number" id="ekonomi_mapel" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">Sosiologi</label>
<input type="number" id="sosiologi" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">Seni Budaya</label>
<input type="number" id="seni_budaya" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">PJOK</label>
<input type="number" id="pjok" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
<div>
<label class="block text-xs font-bold text-slate-500 mb-2">Informatika</label>
<input type="number" id="informatika" min="0" max="100" placeholder="0 - 100" class="w-full rounded-xl border border-slate-200 bg-white px-3 py-3 font-semibold outline-none focus:border-emerald-400 focus:ring-4 focus:ring-emerald-100">
</div>
</div>
</section>
<div class="flex flex-col sm:flex-row gap-3 pt-2">
<a href="{{ route('student.profile') }}"
class="w-full sm:w-1/3 text-center bg-slate-100 hover:bg-slate-200 text-slate-600 font-bold py-4 rounded-2xl transition">
Batal
</a>
<button id="btn-submit"
class="w-full sm:w-2/3 bg-emerald-600 hover:bg-emerald-700 text-white font-bold py-4 rounded-2xl transition shadow-lg shadow-emerald-200">
Cek Rekomendasi
</button>
</div>
</div>
</div>
</div>
</main>
<footer class="bg-[#062C22] text-white py-16 px-6 mt-16">
<div class="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-12">
<div class="space-y-6">
<div class="flex items-center gap-4">
<span class="font-black text-2xl tracking-tighter uppercase italic">ASGARD.</span>
</div>
<p class="text-slate-300 text-sm leading-relaxed max-w-xs">
Sistem pakar rekomendasi jurusan kuliah SMAN 4 Jember berbasis data-driven.
</p>
</div> </div>
<div class="mt-4"> <div>
<label class="text-sm font-semibold text-slate-700">Rata-rata Gaji Orang Tua (Nominal Rupiah)</label> <h5 class="font-bold text-xs uppercase tracking-widest text-emerald-400 mb-6">Informasi</h5>
<input type="number" id="gaji_ortu" min="0" class="w-full border rounded-lg p-2 mt-1" placeholder="Contoh: 3000000" value="3000000"> <ul class="space-y-4 text-sm text-slate-300">
<li><a href="{{ route('panduan') }}" class="hover:text-white transition">Panduan Sistem</a></li>
<li><a href="#" class="hover:text-white transition">Kebijakan Privasi</a></li>
</ul>
</div>
<div>
<h5 class="font-bold text-xs uppercase tracking-widest text-emerald-400 mb-6">Sekolah</h5>
<ul class="space-y-4 text-sm text-slate-300">
<li>SMAN 4 Jember</li>
<li>Jl. Wolter Monginsidi No.24</li>
<li>Jember, Jawa Timur</li>
</ul>
</div> </div>
</div> </div>
<div class="bg-white p-6 rounded-2xl shadow-sm border border-slate-100 mb-8"> <div class="max-w-7xl mx-auto mt-16 pt-8 border-t border-white/10 text-center">
<h3 class="font-bold text-lg mb-1 text-emerald-700">2. Tes Minat Bakat (RIASEC)</h3> <p class="text-[10px] font-medium uppercase tracking-[0.5em] text-slate-400">
<p class="text-sm text-slate-500 mb-5"> © 2026 GALANG SEFIAN ADJI - POLITEKNIK NEGERI JEMBER
Centang kegiatan yang Anda sukai. Setiap jawaban "Ya" bernilai 50 poin, dengan maksimum 100 poin per kategori.
</p> </p>
<div class="space-y-4">
<div class="p-4 border border-slate-100 rounded-xl bg-slate-50">
<p class="font-bold text-slate-800 mb-2">Tipe Realistic (R)</p>
<label class="flex items-center gap-3 mb-2"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="r"> Saya suka memperbaiki barang elektronik atau mesin kendaraan.</label>
<label class="flex items-center gap-3"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="r"> Saya menyukai kegiatan fisik atau bekerja di luar ruangan.</label>
</div>
<div class="p-4 border border-slate-100 rounded-xl bg-slate-50">
<p class="font-bold text-slate-800 mb-2">Tipe Investigative (I)</p>
<label class="flex items-center gap-3 mb-2"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="i"> Saya suka meneliti, mengamati, dan memecahkan teka-teki logika.</label>
<label class="flex items-center gap-3"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="i"> Saya tertarik mendalami teori sains, matematika, atau komputer.</label>
</div>
<div class="p-4 border border-slate-100 rounded-xl bg-slate-50">
<p class="font-bold text-slate-800 mb-2">Tipe Artistic (A)</p>
<label class="flex items-center gap-3 mb-2"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="a"> Saya senang menggambar, mendesain, atau mengekspresikan seni.</label>
<label class="flex items-center gap-3"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="a"> Saya lebih suka pekerjaan kreatif yang tidak memiliki aturan kaku.</label>
</div>
<div class="p-4 border border-slate-100 rounded-xl bg-slate-50">
<p class="font-bold text-slate-800 mb-2">Tipe Social (S)</p>
<label class="flex items-center gap-3 mb-2"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="s"> Saya merasa puas ketika bisa membantu, mengajar, atau merawat orang lain.</label>
<label class="flex items-center gap-3"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="s"> Saya mudah berempati dan suka bekerja dalam lingkungan masyarakat.</label>
</div>
<div class="p-4 border border-slate-100 rounded-xl bg-slate-50">
<p class="font-bold text-slate-800 mb-2">Tipe Enterprising (E)</p>
<label class="flex items-center gap-3 mb-2"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="e"> Saya suka memimpin sebuah tim atau bernegosiasi dalam organisasi.</label>
<label class="flex items-center gap-3"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="e"> Saya pandai meyakinkan orang lain dan tertarik pada dunia bisnis.</label>
</div>
<div class="p-4 border border-slate-100 rounded-xl bg-slate-50">
<p class="font-bold text-slate-800 mb-2">Tipe Conventional (C)</p>
<label class="flex items-center gap-3 mb-2"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="c"> Saya sangat teliti dan suka mengatur data, dokumen, atau arsip.</label>
<label class="flex items-center gap-3"><input type="checkbox" class="w-5 h-5 riasec-chk" data-type="c"> Saya lebih nyaman bekerja dengan angka, jadwal, dan aturan yang jelas.</label>
</div>
</div>
</div> </div>
</footer>
<button id="btn-submit" class="w-full bg-emerald-600 hover:bg-emerald-700 text-white p-4 rounded-xl font-bold text-lg transition shadow-lg">
Jalankan AI Engine
</button>
</div>
<script> <script>
const alertBox = document.getElementById('alert-box'); const alertBox = document.getElementById('alert-box');
@ -122,6 +292,7 @@ class="bg-red-50 hover:bg-red-100 text-red-600 border border-red-100 px-4 py-2 r
function showError(message) { function showError(message) {
alertBox.classList.remove('hidden'); alertBox.classList.remove('hidden');
alertBox.textContent = message; alertBox.textContent = message;
window.scrollTo({ top: 0, behavior: 'smooth' });
} }
function hideError() { function hideError() {
@ -163,19 +334,50 @@ function validateForm(payload) {
]; ];
for (const field of scoreFields) { for (const field of scoreFields) {
const rawValue = document.getElementById(field).value;
if (rawValue === '') {
return `Nilai ${field.replaceAll('_', ' ')} wajib diisi.`;
}
const value = Number(payload[field]); const value = Number(payload[field]);
if (isNaN(value) || value < 0 || value > 100) { if (isNaN(value) || value < 0 || value > 100) {
return `Nilai ${field.replaceAll('_', ' ')} harus berada pada rentang 0 sampai 100.`; return `Nilai ${field.replaceAll('_', ' ')} harus berada pada rentang 0 sampai 100.`;
} }
} }
if (document.getElementById('gaji_ortu').value === '') {
return 'Pendapatan gabungan orang tua wajib diisi.';
}
if (Number(payload.gaji_ortu) < 0) { if (Number(payload.gaji_ortu) < 0) {
return 'Gaji orang tua tidak boleh bernilai negatif.'; return 'Pendapatan gabungan orang tua tidak boleh bernilai negatif.';
}
const questionIds = ['q1', 'q2', 'q3', 'q4', 'q5'];
for (const id of questionIds) {
if (!document.getElementById(id).value) {
return 'Semua pertanyaan minat dan bakat wajib diisi.';
}
} }
return null; return null;
} }
function calculateRiasecScores() {
const scores = { r: 0, i: 0, a: 0, s: 0, e: 0, c: 0 };
const questionIds = ['q1', 'q2', 'q3', 'q4', 'q5'];
questionIds.forEach(id => {
const value = document.getElementById(id).value;
if (value && scores.hasOwnProperty(value)) {
scores[value] += 20;
}
});
return scores;
}
async function handleLogout() { async function handleLogout() {
const token = getAccessToken(); const token = getAccessToken();
@ -231,13 +433,10 @@ function validateForm(payload) {
return; return;
} }
btnSubmit.innerHTML = 'Memproses Analisis...'; btnSubmit.innerHTML = 'Memeriksa Rekomendasi...';
btnSubmit.disabled = true; btnSubmit.disabled = true;
const scores = { r: 0, i: 0, a: 0, s: 0, e: 0, c: 0 }; const scores = calculateRiasecScores();
document.querySelectorAll('.riasec-chk:checked').forEach(chk => {
scores[chk.dataset.type] += 50;
});
const payload = { const payload = {
agama: getNumberValue('agama'), agama: getNumberValue('agama'),
@ -267,7 +466,7 @@ function validateForm(payload) {
const validationError = validateForm(payload); const validationError = validateForm(payload);
if (validationError) { if (validationError) {
showError(validationError); showError(validationError);
btnSubmit.innerHTML = 'Jalankan AI Engine'; btnSubmit.innerHTML = 'Cek Rekomendasi';
btnSubmit.disabled = false; btnSubmit.disabled = false;
return; return;
} }
@ -311,7 +510,7 @@ function validateForm(payload) {
} catch (error) { } catch (error) {
showError('Kesalahan jaringan. Pastikan Laravel dan API Flask sedang berjalan.'); showError('Kesalahan jaringan. Pastikan Laravel dan API Flask sedang berjalan.');
} finally { } finally {
btnSubmit.innerHTML = 'Jalankan AI Engine'; btnSubmit.innerHTML = 'Cek Rekomendasi';
btnSubmit.disabled = false; btnSubmit.disabled = false;
} }
}); });

4
routes/api.php
View File

@ -15,17 +15,13 @@
Route::post('/login', [AuthController::class, 'login']); Route::post('/login', [AuthController::class, 'login']);
Route::middleware('auth:sanctum')->group(function () { Route::middleware('auth:sanctum')->group(function () {
Route::middleware('role:admin')->prefix('admin')->group(function () { Route::middleware('role:admin')->prefix('admin')->group(function () {
Route::apiResource('siswa', SiswaController::class); Route::apiResource('siswa', SiswaController::class);
Route::apiResource('jurusan', JurusanController::class); Route::apiResource('jurusan', JurusanController::class);
Route::apiResource('guru', GuruController::class); Route::apiResource('guru', GuruController::class);
Route::apiResource('alumni', AlumniController::class); Route::apiResource('alumni', AlumniController::class);
Route::apiResource('prospek-kerja', ProspekKerjaController::class); Route::apiResource('prospek-kerja', ProspekKerjaController::class);
Route::get('/dashboard-stats', [DashboardAdminController::class, 'index']); Route::get('/dashboard-stats', [DashboardAdminController::class, 'index']);
Route::get('/riwayat', [RiwayatController::class, 'index']); Route::get('/riwayat', [RiwayatController::class, 'index']);
Route::get('/riwayat/{id}', [RiwayatController::class, 'show']); Route::get('/riwayat/{id}', [RiwayatController::class, 'show']);
}); });

17
routes/web.php
View File

@ -11,11 +11,12 @@
use App\Http\Controllers\Admin\RiwayatController; use App\Http\Controllers\Admin\RiwayatController;
use App\Http\Controllers\Admin\AlumniController; use App\Http\Controllers\Admin\AlumniController;
use App\Http\Controllers\Admin\ProspekKerjaController; use App\Http\Controllers\Admin\ProspekKerjaController;
use App\Http\Controllers\AuthWebController;
use App\Http\Controllers\PanduanController; use App\Http\Controllers\PanduanController;
Route::get('/', [LandingPageController::class, 'index'])->name('landingpage'); Route::get('/', [LandingPageController::class, 'index'])->name('landingpage');
Route::get('/login', function () { return view('auth.login'); })->name('login'); Route::get('/login', function () {
return view('auth.login');
})->name('login');
Route::get('/panduan', [PanduanController::class, 'showPanduan'])->name('panduan'); Route::get('/panduan', [PanduanController::class, 'showPanduan'])->name('panduan');
@ -23,23 +24,19 @@
Route::get('/profile', [StudentDashboardController::class, 'profile'])->name('profile'); Route::get('/profile', [StudentDashboardController::class, 'profile'])->name('profile');
Route::get('/prediction', [RecommendationController::class, 'prediction'])->name('prediction'); Route::get('/prediction', [RecommendationController::class, 'prediction'])->name('prediction');
Route::get('/result/{id}', [RecommendationController::class, 'result'])->name('result'); Route::get('/result/{id}', [RecommendationController::class, 'result'])->name('result');
Route::get('/grades', [RecommendationController::class, 'grades'])->name('grades');
Route::get('/interest', [RecommendationController::class, 'interest'])->name('interest');
}); });
Route::prefix('admin')->name('admin.')->group(function () { Route::prefix('admin')->name('admin.')->group(function () {
Route::get('/dashboard', [AdminDashboardController::class, 'index'])->name('dashboard'); Route::get('/dashboard', [AdminDashboardController::class, 'index'])->name('dashboard');
Route::resource('siswa', SiswaController::class)->only(['index', 'create', 'edit'])->names(['index' => 'siswa']); Route::resource('siswa', SiswaController::class)->only(['index', 'create', 'edit'])->names(['index' => 'siswa']);
Route::resource('alumni', AlumniController::class)->only(['index', 'create', 'edit'])->names(['index' => 'alumni']); Route::resource('alumni', AlumniController::class)->only(['index', 'create', 'edit'])->names(['index' => 'alumni']);
Route::resource('jurusan', JurusanController::class)->only(['index', 'create', 'edit'])->names(['index' => 'jurusan']); Route::resource('jurusan', JurusanController::class)->only(['index', 'create', 'edit'])->names(['index' => 'jurusan']);
Route::resource('guru', GuruController::class)->only(['index', 'create', 'edit'])->names(['index' => 'guru']); Route::resource('guru', GuruController::class)->only(['index', 'create', 'edit'])->names(['index' => 'guru']);
Route::resource('prospek-kerja', ProspekKerjaController::class)->only(['index', 'create', 'edit'])->names(['index' => 'prospek-kerja']); Route::resource('prospek-kerja', ProspekKerjaController::class)->only(['index', 'create', 'edit'])->names(['index' => 'prospek-kerja']);
Route::get('/riwayat', [RiwayatController::class, 'index'])->name('riwayat'); Route::get('/riwayat', [RiwayatController::class, 'index'])->name('riwayat');
Route::get('/latih-model', function() { Route::get('/latih-model', function () {
return view('admin.latihmodel'); return view('admin.latihmodel');
})->name('latih-model'); })->name('latih-model');
}); });