First commit

2025-06-18 22:03:32 +07:00
parent 852121be46
commit e028039ee2
123 changed files with 17506 additions and 144 deletions
--- a/app/mahasiswa/beasiswa/page.tsx
+++ b/app/mahasiswa/beasiswa/page.tsx
@@ -0,0 +1,94 @@
+'use client';
+
+import { useState } from "react";
+import FilterTahunAngkatan from "@/components/FilterTahunAngkatan";
+import FilterJenisBeasiswa from "@/components/FilterJenisBeasiswa";
+import TotalBeasiswaChart from "@/components/TotalBeasiswaChart";
+import TotalBeasiswaPieChart from "@/components/TotalBeasiswaPieChart";
+import NamaBeasiswaChart from "@/components/NamaBeasiswaChart";
+import NamaBeasiswaPieChart from "@/components/NamaBeasiswaPieChart";
+import JenisPendaftaranBeasiswaChart from "@/components/JenisPendaftaranBeasiswaChart";
+import JenisPendaftaranBeasiswaPieChart from "@/components/JenisPendaftaranBeasiswaPieChart";
+import AsalDaerahBeasiswaChart from "@/components/AsalDaerahBeasiswaChart";
+import IPKBeasiswaChart from "@/components/IPKBeasiswaChart";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+
+export default function BeasiswaMahasiswaPage() {
+    const [selectedYear, setSelectedYear] = useState<string>("all");
+    const [selectedJenisBeasiswa, setSelectedJenisBeasiswa] = useState<string>("Pemerintah");
+  
+    return (
+      <div className="container mx-auto p-4 space-y-6">
+        <h1 className="text-3xl font-bold mb-4">Mahasiswa Beasiswa</h1>
+        
+        <div className="mb-4">
+          <p className="text-gray-600 dark:text-gray-300">
+            Mahasiswa yang mendapatkan beasiswa di program studi Informatika Fakultas Teknik Universitas Tanjungpura.
+          </p>
+        </div>
+  
+        <Card className="bg-white dark:bg-slate-900 shadow-lg dark:text-white">
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium dark:text-white">
+              Filter Data
+            </CardTitle>
+          </CardHeader>
+          <CardContent>
+            <div className="flex flex-col sm:flex-row items-start sm:items-center gap-4 sm:space-x-4">
+              <FilterTahunAngkatan 
+                selectedYear={selectedYear}
+                onYearChange={setSelectedYear}
+              />
+              <FilterJenisBeasiswa
+                selectedJenisBeasiswa={selectedJenisBeasiswa}
+                onJenisBeasiswaChange={setSelectedJenisBeasiswa}
+              />
+            </div>
+          </CardContent>
+        </Card>
+
+        {selectedYear === "all" ? (
+        <>
+          <TotalBeasiswaChart 
+            selectedYear={selectedYear}
+            selectedJenisBeasiswa={selectedJenisBeasiswa}
+          />
+          <NamaBeasiswaChart 
+            selectedYear={selectedYear}
+            selectedJenisBeasiswa={selectedJenisBeasiswa}
+          />
+          <JenisPendaftaranBeasiswaChart 
+            selectedYear={selectedYear}
+            selectedJenisBeasiswa={selectedJenisBeasiswa}
+          />
+        </>
+        ) : (
+          <>
+            <TotalBeasiswaPieChart 
+              selectedYear={selectedYear}
+              selectedJenisBeasiswa={selectedJenisBeasiswa}
+            />
+            <NamaBeasiswaPieChart 
+              selectedYear={selectedYear}
+              selectedJenisBeasiswa={selectedJenisBeasiswa}
+            />
+            <JenisPendaftaranBeasiswaPieChart 
+              selectedYear={selectedYear}
+              selectedJenisBeasiswa={selectedJenisBeasiswa}
+            />
+          </>
+        )}
+
+        <AsalDaerahBeasiswaChart 
+          selectedYear={selectedYear}
+          selectedJenisBeasiswa={selectedJenisBeasiswa}
+        />
+
+        {selectedYear === "all" && (
+          <IPKBeasiswaChart 
+            selectedJenisBeasiswa={selectedJenisBeasiswa}
+          />
+        )}
+      </div>
+    );
+  }
--- a/app/mahasiswa/berprestasi/page.tsx
+++ b/app/mahasiswa/berprestasi/page.tsx
@@ -0,0 +1,80 @@
+'use client';
+
+import { useState } from "react";
+import FilterTahunAngkatan from "@/components/FilterTahunAngkatan";
+import FilterJenisPrestasi from "@/components/FilterJenisPrestasi";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import TotalPrestasiChart from "@/components/TotalPrestasiChart";
+import TotalPrestasiPieChart from "@/components/TotalPrestasiPieChart";
+import TingkatPrestasiChart from "@/components/TingkatPrestasiChart";
+import TingkatPrestasiPieChart from "@/components/TingkatPrestasiPieChart";
+import JenisPendaftaranPrestasiChart from "@/components/JenisPendaftaranPrestasiChart";
+import JenisPendaftaranPrestasiPieChart from "@/components/JenisPendaftaranPrestasiPieChart";
+import AsalDaerahPrestasiChart from "@/components/AsalDaerahPrestasiChart";
+import IPKPrestasiChart from "@/components/IPKPrestasiChart";
+
+export default function BerprestasiMahasiswaPage() {
+    const [selectedYear, setSelectedYear] = useState<string>("all");
+    const [selectedJenisPrestasi, setSelectedJenisPrestasi] = useState<string>("Akademik");
+  
+    return (
+      <div className="container mx-auto p-4 space-y-6">
+        <h1 className="text-3xl font-bold mb-4">Mahasiswa Berprestasi</h1>
+        
+        <div className="mb-4">
+          <p className="text-gray-600 dark:text-gray-300">
+            Mahasiswa yang mendapatkan prestasi akademik dan non akademik di program studi Informatika Fakultas Teknik Universitas Tanjungpura.
+          </p>
+        </div>
+  
+        <Card className="bg-white dark:bg-slate-900 shadow-lg dark:text-white">
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium dark:text-white">
+              Filter Data
+            </CardTitle>
+          </CardHeader>
+          <CardContent>
+            <div className="flex flex-col sm:flex-row items-start sm:items-center gap-4 sm:space-x-4">
+              <FilterTahunAngkatan 
+                selectedYear={selectedYear}
+                onYearChange={setSelectedYear}
+              />
+              <FilterJenisPrestasi
+                selectedJenisPrestasi={selectedJenisPrestasi}
+                onJenisPrestasiChange={setSelectedJenisPrestasi}
+              />
+            </div>
+          </CardContent>
+        </Card>
+
+        {selectedYear === "all" ? (
+        <>
+          <TotalPrestasiChart selectedJenisPrestasi={selectedJenisPrestasi} />
+          <TingkatPrestasiChart selectedJenisPrestasi={selectedJenisPrestasi} />
+          <JenisPendaftaranPrestasiChart selectedJenisPrestasi={selectedJenisPrestasi} />
+        </>
+        ) : (
+          <>
+            <TotalPrestasiPieChart 
+              selectedYear={selectedYear}
+              selectedJenisPrestasi={selectedJenisPrestasi}
+            />
+            <TingkatPrestasiPieChart 
+              selectedYear={selectedYear}
+              selectedJenisPrestasi={selectedJenisPrestasi}
+            />
+            <JenisPendaftaranPrestasiPieChart 
+              selectedYear={selectedYear}
+              selectedJenisPrestasi={selectedJenisPrestasi}
+            />
+          </>
+        )}
+
+        <AsalDaerahPrestasiChart selectedYear={selectedYear} selectedJenisPrestasi={selectedJenisPrestasi} />
+
+        {selectedYear === "all" && (
+          <IPKPrestasiChart selectedJenisPrestasi={selectedJenisPrestasi} />
+        )}
+      </div>
+    );
+  }
--- a/app/mahasiswa/lulustepatwaktu/page.tsx
+++ b/app/mahasiswa/lulustepatwaktu/page.tsx
@@ -0,0 +1,61 @@
+'use client';
+
+import { useState } from "react";
+import FilterTahunAngkatan from "@/components/FilterTahunAngkatan";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import LulusTepatWaktuChart from "@/components/LulusTepatWaktuChart";
+import LulusTepatWaktuPieChart from "@/components/LulusTepatWaktuPieChart";
+import JenisPendaftaranLulusChart from "@/components/JenisPendaftaranLulusChart";
+import JenisPendaftaranLulusPieChart from "@/components/JenisPendaftaranLulusPieChart";
+import AsalDaerahLulusChart from "@/components/AsalDaerahLulusChart";
+import IPKLulusTepatChart from "@/components/IPKLulusTepatChart";
+
+export default function LulusTepatWaktuPage() {
+    const [selectedYear, setSelectedYear] = useState<string>("all");
+  
+    return (
+      <div className="container mx-auto p-4 space-y-6">
+        <h1 className="text-3xl font-bold mb-4">Mahasiswa Lulus Tepat Waktu</h1>
+        
+        <div className="mb-4">
+          <p className="text-gray-600 dark:text-gray-300">
+            Mahasiswa yang lulus tepat waktu sesuai dengan masa studi ≤ 4 tahun program studi Informatika Fakultas Teknik Universitas Tanjungpura.
+          </p>
+        </div>
+  
+        <Card className="bg-white dark:bg-slate-900 shadow-lg dark:text-white">
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium dark:text-white">
+              Filter Data
+            </CardTitle>
+          </CardHeader>
+          <CardContent>
+            <div className="flex flex-col sm:flex-row items-start sm:items-center gap-4 sm:space-x-4">
+              <FilterTahunAngkatan 
+                selectedYear={selectedYear}
+                onYearChange={setSelectedYear}
+              />
+            </div>
+          </CardContent>
+        </Card>
+
+        {selectedYear === "all" ? (
+        <>
+          <LulusTepatWaktuChart selectedYear={selectedYear} />
+          <JenisPendaftaranLulusChart selectedYear={selectedYear} />
+        </>
+        ) : (
+          <>
+            <LulusTepatWaktuPieChart selectedYear={selectedYear} />
+            <JenisPendaftaranLulusPieChart selectedYear={selectedYear} />
+          </>
+        )}
+  
+        <AsalDaerahLulusChart selectedYear={selectedYear} />
+        {selectedYear === "all" && (
+        <IPKLulusTepatChart selectedYear={selectedYear} />
+        )}
+
+      </div>
+    );
+  }
--- a/app/mahasiswa/profile/page.tsx
+++ b/app/mahasiswa/profile/page.tsx
@@ -0,0 +1,171 @@
+'use client';
+
+import { useEffect, useState } from 'react';
+import { useRouter } from 'next/navigation';
+import { useToast } from '@/components/ui/use-toast';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { Skeleton } from '@/components/ui/skeleton';
+import { User } from 'lucide-react';
+import { useTheme } from 'next-themes';
+
+interface MahasiswaProfile {
+  nim: string;
+  nama: string;
+  jk: 'Pria' | 'Wanita';
+  agama: string;
+  kabupaten: string;
+  provinsi: string;
+  jenis_pendaftaran: string;
+  status_beasiswa: 'YA' | 'TIDAK';
+  tahun_angkatan: string;
+  ipk: number | null;
+  prestasi: 'YA' | 'TIDAK';
+  status_kuliah: string;
+}
+
+export default function ProfilePage() {
+  const [profile, setProfile] = useState<MahasiswaProfile | null>(null);
+  const [loading, setLoading] = useState(true);
+  const { toast } = useToast();
+  const router = useRouter();
+  const { theme } = useTheme();
+
+  useEffect(() => {
+    const fetchProfile = async () => {
+      try {
+        console.log('Fetching profile data...');
+        const response = await fetch('/api/mahasiswa/profile');
+        console.log('Profile response status:', response.status);
+        
+        if (response.status === 401) {
+          toast({
+            variant: "destructive",
+            title: "Akses Ditolak",
+            description: "Silakan login terlebih dahulu untuk mengakses halaman ini.",
+          });
+          router.push('/');
+          return;
+        }
+
+        if (!response.ok) {
+          const errorData = await response.json();
+          throw new Error(errorData.error || 'Failed to fetch profile data');
+        }
+
+        const data = await response.json();
+        console.log('Profile data received:', data);
+        setProfile(data);
+      } catch (error) {
+        console.error('Error fetching profile:', error);
+        toast({
+          variant: "destructive",
+          title: "Error",
+          description: error instanceof Error ? error.message : "Gagal memuat data profil. Silakan coba lagi nanti.",
+        });
+      } finally {
+        setLoading(false);
+      }
+    };
+
+    fetchProfile();
+  }, [toast, router]);
+
+  if (loading) {
+    return (
+      <div className="container mx-auto p-4 max-w-2xl">
+        <Card className="border shadow-sm bg-white dark:bg-slate-900">
+          <CardHeader className="border-b py-3 bg-white dark:bg-slate-900 text-black dark:text-white">
+            <CardTitle className="text-lg">Profil Mahasiswa</CardTitle>
+          </CardHeader>
+          <CardContent className="p-4">
+            <div className="space-y-3">
+              {[...Array(8)].map((_, i) => (
+                <div key={i} className="flex items-center gap-2">
+                  <Skeleton className="h-3 w-[80px]" />
+                  <Skeleton className="h-3 w-[140px]" />
+                </div>
+              ))}
+            </div>
+          </CardContent>
+        </Card>
+      </div>
+    );
+  }
+
+  if (!profile) {
+    return (
+      <div className="container mx-auto p-4 max-w-2xl">
+        <Card className="border shadow-sm">
+          <CardHeader className="border-b bg-muted/30 py-3">
+            <CardTitle className="text-lg">Profil Mahasiswa</CardTitle>
+          </CardHeader>
+          <CardContent className="p-4">
+            <div className="text-center text-muted-foreground text-sm py-4">
+              Data profil tidak tersedia
+            </div>
+          </CardContent>
+        </Card>
+      </div>
+    );
+  }
+
+  // Format IPK value
+  const formatIPK = (ipk: number | null): string => {
+    if (ipk === null || ipk === undefined) return '-';
+    return Number(ipk).toFixed(2);
+  };
+
+  return (
+    <div className="container mx-auto p-4 w-full">
+      <Card className="gap-0 bg-white dark:bg-slate-900 border shadow-sm">
+        <CardHeader className="border-b py-2">
+          <div className="flex items-center gap-3">
+            <div className="h-10 w-10 rounded-full bg-primary/10 flex items-center justify-center">
+              <User className="h-5 w-5 text-primary" />
+            </div>
+            <div>
+              <CardTitle className="text-base font-medium text-black dark:text-white">{profile.nama}</CardTitle>
+              <p className="text-xs text-muted-foreground">{profile.nim}</p>
+            </div>
+          </div>
+        </CardHeader>
+        <CardContent className="py-2 px-4">
+          <div className="space-y-1 text-sm text-black dark:text-white">
+            <div className="py-1.5 border-b">
+              <div className="text-muted-foreground">Jenis Kelamin</div>
+              <div>{profile.jk}</div>
+            </div>
+            <div className="py-1.5 border-b">
+              <div className="text-muted-foreground">Agama</div>
+              <div>{profile.agama}</div>
+            </div>
+            <div className="py-1.5 border-b">
+              <div className="text-muted-foreground">Kabupaten</div>
+              <div>{profile.kabupaten}</div>
+            </div>
+            <div className="py-1.5 border-b">
+              <div className="text-muted-foreground">Provinsi</div>
+              <div>{profile.provinsi}</div>
+            </div>
+            <div className="py-1.5 border-b">
+              <div className="text-muted-foreground">Jenis Pendaftaran</div>
+              <div>{profile.jenis_pendaftaran}</div>
+            </div>
+            <div className="py-1.5 border-b">
+              <div className="text-muted-foreground">Tahun Angkatan</div>
+              <div>{profile.tahun_angkatan}</div>
+            </div>
+            <div className="py-1.5 border-b">
+              <div className="text-muted-foreground">IPK</div>
+              <div>{formatIPK(profile.ipk)}</div>
+            </div>
+            <div className="py-1.5">
+              <div className="text-muted-foreground">Status Kuliah</div>
+              <div>{profile.status_kuliah || '-'}</div>
+            </div>
+          </div>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}
--- a/app/mahasiswa/status/page.tsx
+++ b/app/mahasiswa/status/page.tsx
@@ -0,0 +1,86 @@
+'use client';
+
+import { useState } from "react";
+import FilterTahunAngkatan from "@/components/FilterTahunAngkatan";
+import FilterStatusKuliah from "@/components/FilterStatusKuliah";
+import StatusMahasiswaFilterChart from "@/components/StatusMahasiswaFilterChart";
+import StatusMahasiswaFilterPieChart from "@/components/StatusMahasiswaFilterPieChart";
+import JenisPendaftaranStatusChart from "@/components/JenisPendaftaranStatusChart";
+import JenisPendaftaranStatusPieChart from "@/components/JenisPendaftaranStatusPieChart";
+import AsalDaerahStatusChart from '@/components/AsalDaerahStatusChart';
+import IpkStatusChart from '@/components/IpkStatusChart';
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+
+export default function StatusMahasiswaPage() {
+    const [selectedYear, setSelectedYear] = useState<string>("all");
+    const [selectedStatus, setSelectedStatus] = useState<string>("Aktif");
+  
+    return (
+      <div className="container mx-auto p-4 space-y-6">
+        <h1 className="text-3xl font-bold mb-4">Status Mahasiswa</h1>
+        
+        <div className="mb-4">
+          <p className="text-gray-600 dark:text-gray-300">
+            Mahasiswa status adalah status kuliah mahasiswa program studi Informatika Fakultas Teknik Universitas Tanjungpura.
+          </p>
+        </div>
+  
+        <Card className="bg-white dark:bg-slate-900 shadow-lg dark:text-white">
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium dark:text-white">
+              Filter Data
+            </CardTitle>
+          </CardHeader>
+          <CardContent>
+            <div className="flex flex-col sm:flex-row items-start sm:items-center gap-4 sm:space-x-4">
+              <FilterTahunAngkatan 
+                selectedYear={selectedYear}
+                onYearChange={setSelectedYear}
+              />
+              <FilterStatusKuliah
+                selectedStatus={selectedStatus}
+                onStatusChange={setSelectedStatus}
+              />
+            </div>
+          </CardContent>
+        </Card>
+
+        {selectedYear === "all" ? (
+        <>
+          <StatusMahasiswaFilterChart 
+            selectedYear={selectedYear}
+            selectedStatus={selectedStatus}
+          />
+          <JenisPendaftaranStatusChart
+            selectedYear={selectedYear}
+            selectedStatus={selectedStatus}
+          />
+        </>
+        ) : (
+          <>
+            <StatusMahasiswaFilterPieChart
+              selectedYear={selectedYear}
+              selectedStatus={selectedStatus}
+            />
+            <JenisPendaftaranStatusPieChart
+              selectedYear={selectedYear}
+              selectedStatus={selectedStatus}
+            />
+          </>
+        )}
+
+        <AsalDaerahStatusChart
+          selectedYear={selectedYear}
+          selectedStatus={selectedStatus}
+        />
+
+        {selectedYear === "all" && (
+          <IpkStatusChart
+            selectedYear={selectedYear}
+            selectedStatus={selectedStatus}
+          />
+        )}
+
+      </div>
+    );
+  }
--- a/app/mahasiswa/total/page.tsx
+++ b/app/mahasiswa/total/page.tsx
@@ -0,0 +1,60 @@
+'use client';
+
+import { useState } from "react";
+import StatistikMahasiswaChart from "@/components/StatistikMahasiswaChart";
+import StatistikPerAngkatanChart from "@/components/StatistikPerAngkatanChart";
+import JenisPendaftaranChart from "@/components/JenisPendaftaranChart";
+import AsalDaerahChart from "@/components/AsalDaerahChart";
+import IPKChart from "@/components/IPKChart";
+import FilterTahunAngkatan from "@/components/FilterTahunAngkatan";
+import JenisPendaftaranPerAngkatanChart from "@/components/JenisPendaftaranPerAngkatanChart";
+import AsalDaerahPerAngkatanChart from "@/components/AsalDaerahPerAngkatanChart";
+import IPKJenisKelaminChart from "@/components/IPKJenisKelaminChart";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+
+export default function TotalMahasiswaPage() {
+  const [selectedYear, setSelectedYear] = useState<string>("all");
+
+  return (
+    <div className="container mx-auto p-4 space-y-6">
+      <h1 className="text-3xl font-bold mb-4">Total Mahasiswa</h1>
+      
+      <div className="mb-4">
+        <p className="text-gray-600 dark:text-gray-300">
+          Mahasiswa total adalah jumlah mahasiswa program studi Informatika Fakultas Teknik Universitas Tanjungpura.
+        </p>
+      </div>
+
+      <Card className="bg-white dark:bg-slate-900 shadow-lg dark:text-white">
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium dark:text-white">
+              Filter Data
+            </CardTitle>
+          </CardHeader>
+          <CardContent>
+            <div className="flex flex-col sm:flex-row items-start sm:items-center gap-4 sm:space-x-4">
+              <FilterTahunAngkatan 
+                selectedYear={selectedYear}
+                onYearChange={setSelectedYear}
+              />
+            </div>
+          </CardContent>
+        </Card>
+
+      {selectedYear === "all" ? (
+        <>
+          <StatistikMahasiswaChart />
+          <JenisPendaftaranChart />
+          <AsalDaerahChart />
+          <IPKChart />
+        </>
+      ) : (
+        <>
+          <StatistikPerAngkatanChart tahunAngkatan={selectedYear} />
+          <JenisPendaftaranPerAngkatanChart tahunAngkatan={selectedYear} />
+          <AsalDaerahPerAngkatanChart tahunAngkatan={selectedYear} />
+        </>
+      )}
+    </div>
+  );
+}