testing yuk
This commit is contained in:
@@ -6,7 +6,7 @@ import { ApexOptions } from 'apexcharts';
|
||||
import { useTheme } from 'next-themes';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
|
||||
// Dynamically import ApexCharts to avoid SSR issues
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface AsalDaerahBeasiswaData {
|
||||
@@ -48,13 +48,13 @@ export default function AsalDaerahBeasiswaChart({ selectedYear, selectedJenisBea
|
||||
const result = await response.json();
|
||||
|
||||
if (!Array.isArray(result)) {
|
||||
throw new Error('Invalid data format received from server');
|
||||
throw new Error('Format data tidak valid diterima dari server');
|
||||
}
|
||||
|
||||
setData(result);
|
||||
} catch (err) {
|
||||
console.error('Error in fetchData:', err);
|
||||
setError(err instanceof Error ? err.message : 'An error occurred while fetching data');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan saat mengambil data');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -109,7 +109,7 @@ export default function AsalDaerahBeasiswaChart({ selectedYear, selectedJenisBea
|
||||
colors: [theme === 'dark' ? '#374151' : '#E5E7EB'],
|
||||
},
|
||||
xaxis: {
|
||||
categories: [...new Set(data.map(item => item.kabupaten))].sort(),
|
||||
categories: [...new Set(data.map(item => item.kabupaten))].sort(), // Ambil kabupaten unik dan urutkan
|
||||
title: {
|
||||
text: 'Jumlah Mahasiswa',
|
||||
style: {
|
||||
@@ -166,7 +166,7 @@ export default function AsalDaerahBeasiswaChart({ selectedYear, selectedJenisBea
|
||||
|
||||
const series = [{
|
||||
name: 'Jumlah Mahasiswa',
|
||||
data: [...new Set(data.map(item => item.kabupaten))].sort().map(kabupaten => {
|
||||
data: [...new Set(data.map(item => item.kabupaten))].sort().map(kabupaten => { // Ambil kabupaten unik, urutkan, dan map ke jumlah mahasiswa
|
||||
const item = data.find(d => d.kabupaten === kabupaten);
|
||||
return item ? item.jumlah_mahasiswa : 0;
|
||||
})
|
||||
|
||||
@@ -9,7 +9,7 @@ import { Button } from "@/components/ui/button";
|
||||
import { ExternalLink } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
|
||||
// Dynamically import ApexCharts to avoid SSR issues
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface AsalDaerahData {
|
||||
@@ -107,7 +107,7 @@ export default function AsalDaerahChart({
|
||||
fill: {
|
||||
opacity: 1,
|
||||
},
|
||||
colors: ['#3B82F6'], // Blue color for bars
|
||||
colors: ['#3B82F6'], // Warna biru untuk bar
|
||||
tooltip: {
|
||||
theme: theme === 'dark' ? 'dark' : 'light',
|
||||
y: {
|
||||
@@ -118,7 +118,7 @@ export default function AsalDaerahChart({
|
||||
}
|
||||
});
|
||||
|
||||
// Update theme when it changes
|
||||
// Perbarui tema saat berubah
|
||||
useEffect(() => {
|
||||
setOptions(prev => ({
|
||||
...prev,
|
||||
@@ -193,12 +193,12 @@ export default function AsalDaerahChart({
|
||||
const result = await response.json();
|
||||
|
||||
if (!Array.isArray(result)) {
|
||||
throw new Error('Invalid data format received from server');
|
||||
throw new Error('Format data tidak valid diterima dari server');
|
||||
}
|
||||
|
||||
setData(result);
|
||||
|
||||
// Process data for chart
|
||||
// Proses data untuk chart
|
||||
const kabupaten = result.map(item => item.kabupaten);
|
||||
const jumlah = result.map(item => item.jumlah);
|
||||
|
||||
@@ -215,7 +215,7 @@ export default function AsalDaerahChart({
|
||||
}));
|
||||
} catch (err) {
|
||||
console.error('Error in fetchData:', err);
|
||||
setError(err instanceof Error ? err.message : 'An error occurred while fetching data');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan saat mengambil data');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -264,11 +264,11 @@ export default function AsalDaerahChart({
|
||||
);
|
||||
}
|
||||
|
||||
// Calculate dynamic height based on number of kabupaten
|
||||
// Hitung tinggi dinamis berdasarkan jumlah kabupaten
|
||||
const calculateHeight = () => {
|
||||
const minHeight = 100;
|
||||
const barHeight = 15; // Height per bar in pixels
|
||||
const padding = 50; // Extra space for title, legend, etc.
|
||||
const barHeight = 15; // Tinggi per bar dalam piksel
|
||||
const padding = 50; // Ruang ekstra untuk judul, legenda, dll
|
||||
const dynamicHeight = Math.max(minHeight, (data.length * barHeight) + padding);
|
||||
return `${dynamicHeight}px`;
|
||||
};
|
||||
|
||||
@@ -6,7 +6,7 @@ import { ApexOptions } from 'apexcharts';
|
||||
import { useTheme } from 'next-themes';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
|
||||
// Dynamically import ApexCharts to avoid SSR issues
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface AsalDaerahLulusChartProps {
|
||||
@@ -110,7 +110,7 @@ export default function AsalDaerahLulusChart({ selectedYear }: AsalDaerahLulusCh
|
||||
fill: {
|
||||
opacity: 1,
|
||||
},
|
||||
colors: ['#3B82F6'], // Blue color for bars
|
||||
colors: ['#3B82F6'], // Warna biru untuk bar
|
||||
tooltip: {
|
||||
theme: theme === 'dark' ? 'dark' : 'light',
|
||||
y: {
|
||||
@@ -121,7 +121,7 @@ export default function AsalDaerahLulusChart({ selectedYear }: AsalDaerahLulusCh
|
||||
}
|
||||
});
|
||||
|
||||
// Update theme when it changes
|
||||
// Perbarui tema saat berubah
|
||||
useEffect(() => {
|
||||
const currentTheme = theme;
|
||||
setOptions(prev => ({
|
||||
@@ -196,7 +196,7 @@ export default function AsalDaerahLulusChart({ selectedYear }: AsalDaerahLulusCh
|
||||
const data = await response.json();
|
||||
setChartData(data);
|
||||
|
||||
// Process data for chart
|
||||
// Proses data untuk chart
|
||||
const kabupaten = data.map((item: ChartData) => item.kabupaten);
|
||||
const jumlah = data.map((item: ChartData) => item.jumlah_lulus_tepat_waktu);
|
||||
|
||||
@@ -212,7 +212,7 @@ export default function AsalDaerahLulusChart({ selectedYear }: AsalDaerahLulusCh
|
||||
},
|
||||
}));
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'An error occurred');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan');
|
||||
console.error('Error fetching data:', err);
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
|
||||
@@ -6,7 +6,7 @@ import { ApexOptions } from 'apexcharts';
|
||||
import { useTheme } from 'next-themes';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
|
||||
// Dynamically import ApexCharts to avoid SSR issues
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface AsalDaerahData {
|
||||
@@ -126,7 +126,7 @@ export default function AsalDaerahPerAngkatanChart({ tahunAngkatan }: Props) {
|
||||
fill: {
|
||||
opacity: 1,
|
||||
},
|
||||
colors: ['#3B82F6'], // Blue color for bars
|
||||
colors: ['#3B82F6'], // Warna biru untuk bar
|
||||
tooltip: {
|
||||
theme: theme === 'dark' ? 'dark' : 'light',
|
||||
y: {
|
||||
@@ -137,7 +137,7 @@ export default function AsalDaerahPerAngkatanChart({ tahunAngkatan }: Props) {
|
||||
}
|
||||
});
|
||||
|
||||
// Update theme when it changes
|
||||
// Perbarui tema saat berubah
|
||||
useEffect(() => {
|
||||
setOptions(prev => ({
|
||||
...prev,
|
||||
@@ -212,12 +212,12 @@ export default function AsalDaerahPerAngkatanChart({ tahunAngkatan }: Props) {
|
||||
const result = await response.json();
|
||||
|
||||
if (!Array.isArray(result)) {
|
||||
throw new Error('Invalid data format received from server');
|
||||
throw new Error('Format data tidak valid diterima dari server');
|
||||
}
|
||||
|
||||
setData(result);
|
||||
|
||||
// Process data for chart
|
||||
// Proses data untuk chart
|
||||
const kabupaten = result.map(item => item.kabupaten);
|
||||
const jumlah = result.map(item => item.jumlah);
|
||||
|
||||
@@ -248,7 +248,7 @@ export default function AsalDaerahPerAngkatanChart({ tahunAngkatan }: Props) {
|
||||
}));
|
||||
} catch (err) {
|
||||
console.error('Error in fetchData:', err);
|
||||
setError(err instanceof Error ? err.message : 'An error occurred while fetching data');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan saat mengambil data');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -299,11 +299,11 @@ export default function AsalDaerahPerAngkatanChart({ tahunAngkatan }: Props) {
|
||||
);
|
||||
}
|
||||
|
||||
// Calculate dynamic height based on number of kabupaten
|
||||
// Hitung tinggi dinamis berdasarkan jumlah kabupaten
|
||||
const calculateHeight = () => {
|
||||
const minHeight = 100;
|
||||
const barHeight = 15; // Height per bar in pixels
|
||||
const padding = 50; // Extra space for title, legend, etc.
|
||||
const barHeight = 15; // Tinggi per bar dalam piksel
|
||||
const padding = 50; // Ruang ekstra untuk judul, legenda, dll
|
||||
const dynamicHeight = Math.max(minHeight, (data.length * barHeight) + padding);
|
||||
return `${dynamicHeight}px`;
|
||||
};
|
||||
|
||||
@@ -6,7 +6,7 @@ import { ApexOptions } from 'apexcharts';
|
||||
import { useTheme } from 'next-themes';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
|
||||
// Dynamically import ApexCharts to avoid SSR issues
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface AsalDaerahPrestasiData {
|
||||
@@ -48,13 +48,13 @@ export default function AsalDaerahPrestasiChart({ selectedYear, selectedJenisPre
|
||||
const result = await response.json();
|
||||
|
||||
if (!Array.isArray(result)) {
|
||||
throw new Error('Invalid data format received from server');
|
||||
throw new Error('Format data tidak valid diterima dari server');
|
||||
}
|
||||
|
||||
setData(result);
|
||||
} catch (err) {
|
||||
console.error('Error in fetchData:', err);
|
||||
setError(err instanceof Error ? err.message : 'An error occurred while fetching data');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan saat mengambil data');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -109,7 +109,7 @@ export default function AsalDaerahPrestasiChart({ selectedYear, selectedJenisPre
|
||||
colors: [theme === 'dark' ? '#374151' : '#E5E7EB'],
|
||||
},
|
||||
xaxis: {
|
||||
categories: [...new Set(data.map(item => item.kabupaten))].sort(),
|
||||
categories: [...new Set(data.map(item => item.kabupaten))].sort(), // Ambil kabupaten unik dan urutkan
|
||||
title: {
|
||||
text: 'Jumlah Mahasiswa',
|
||||
style: {
|
||||
@@ -166,7 +166,7 @@ export default function AsalDaerahPrestasiChart({ selectedYear, selectedJenisPre
|
||||
|
||||
const series = [{
|
||||
name: 'Jumlah Mahasiswa',
|
||||
data: [...new Set(data.map(item => item.kabupaten))].sort().map(kabupaten => {
|
||||
data: [...new Set(data.map(item => item.kabupaten))].sort().map(kabupaten => { // Ambil kabupaten unik, urutkan, dan map ke jumlah mahasiswa prestasi
|
||||
const item = data.find(d => d.kabupaten === kabupaten);
|
||||
return item ? item.asal_daerah_mahasiswa_prestasi : 0;
|
||||
})
|
||||
|
||||
@@ -6,7 +6,7 @@ import { ApexOptions } from 'apexcharts';
|
||||
import { useTheme } from 'next-themes';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
|
||||
// Dynamically import ApexCharts to avoid SSR issues
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface AsalDaerahStatusData {
|
||||
@@ -44,7 +44,7 @@ export default function AsalDaerahStatusChart({ selectedYear, selectedStatus }:
|
||||
const result = await response.json();
|
||||
console.log('Received data:', result);
|
||||
|
||||
// Sort data by kabupaten
|
||||
// Urutkan data berdasarkan kabupaten
|
||||
const sortedData = result.sort((a: AsalDaerahStatusData, b: AsalDaerahStatusData) =>
|
||||
a.kabupaten.localeCompare(b.kabupaten)
|
||||
);
|
||||
@@ -52,7 +52,7 @@ export default function AsalDaerahStatusChart({ selectedYear, selectedStatus }:
|
||||
setData(sortedData);
|
||||
} catch (err) {
|
||||
console.error('Error in fetchData:', err);
|
||||
setError(err instanceof Error ? err.message : 'An error occurred');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -61,12 +61,12 @@ export default function AsalDaerahStatusChart({ selectedYear, selectedStatus }:
|
||||
fetchData();
|
||||
}, [selectedYear, selectedStatus]);
|
||||
|
||||
// Log data changes
|
||||
// Log perubahan data
|
||||
useEffect(() => {
|
||||
console.log('Current data state:', data);
|
||||
}, [data]);
|
||||
|
||||
// Get unique kabupaten
|
||||
// Ambil kabupaten unik
|
||||
const kabupaten = [...new Set(data.map(item => item.kabupaten))].sort();
|
||||
console.log('Kabupaten:', kabupaten);
|
||||
|
||||
@@ -164,7 +164,7 @@ export default function AsalDaerahStatusChart({ selectedYear, selectedStatus }:
|
||||
}
|
||||
};
|
||||
|
||||
// Process data for series
|
||||
// Proses data untuk series
|
||||
const processSeriesData = () => {
|
||||
const seriesData = kabupaten.map(kab => {
|
||||
const item = data.find(d => d.kabupaten === kab);
|
||||
|
||||
@@ -6,7 +6,7 @@ import { ApexOptions } from 'apexcharts';
|
||||
import { useTheme } from 'next-themes';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
|
||||
// Dynamically import ApexCharts to avoid SSR issues
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface IPKBeasiswaData {
|
||||
@@ -161,7 +161,7 @@ export default function IPKBeasiswaChart({ selectedJenisBeasiswa }: Props) {
|
||||
}
|
||||
});
|
||||
|
||||
// Update theme when it changes
|
||||
// Perbarui tema saat berubah
|
||||
useEffect(() => {
|
||||
const currentTheme = theme;
|
||||
setOptions(prev => ({
|
||||
@@ -250,12 +250,12 @@ export default function IPKBeasiswaChart({ selectedJenisBeasiswa }: Props) {
|
||||
const result = await response.json();
|
||||
|
||||
if (!Array.isArray(result)) {
|
||||
throw new Error('Invalid data format received from server');
|
||||
throw new Error('Format data tidak valid diterima dari server');
|
||||
}
|
||||
|
||||
setData(result);
|
||||
|
||||
// Process data for chart
|
||||
// Proses data untuk chart
|
||||
const tahunAngkatan = result.map(item => item.tahun_angkatan);
|
||||
const rataRataIPK = result.map(item => item.rata_rata_ipk);
|
||||
|
||||
@@ -272,7 +272,7 @@ export default function IPKBeasiswaChart({ selectedJenisBeasiswa }: Props) {
|
||||
}));
|
||||
} catch (err) {
|
||||
console.error('Error in fetchData:', err);
|
||||
setError(err instanceof Error ? err.message : 'An error occurred while fetching data');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan saat mengambil data');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
|
||||
@@ -9,7 +9,7 @@ import { Button } from "@/components/ui/button";
|
||||
import { ExternalLink } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
|
||||
// Dynamically import ApexCharts to avoid SSR issues
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface IPKData {
|
||||
@@ -145,7 +145,7 @@ export default function IPKChart({
|
||||
left: 0
|
||||
}
|
||||
},
|
||||
colors: ['#3B82F6'], // Blue color for line
|
||||
colors: ['#3B82F6'], // Warna biru untuk garis
|
||||
tooltip: {
|
||||
theme: theme === 'dark' ? 'dark' : 'light',
|
||||
y: {
|
||||
@@ -167,7 +167,7 @@ export default function IPKChart({
|
||||
}
|
||||
});
|
||||
|
||||
// Update theme when it changes
|
||||
// Perbarui tema saat berubah
|
||||
useEffect(() => {
|
||||
const currentTheme = theme;
|
||||
setOptions(prev => ({
|
||||
@@ -256,12 +256,12 @@ export default function IPKChart({
|
||||
const result = await response.json();
|
||||
|
||||
if (!Array.isArray(result)) {
|
||||
throw new Error('Invalid data format received from server');
|
||||
throw new Error('Format data tidak valid diterima dari server');
|
||||
}
|
||||
|
||||
setData(result);
|
||||
|
||||
// Process data for chart
|
||||
// Proses data untuk chart
|
||||
const tahunAngkatan = result.map(item => item.tahun_angkatan);
|
||||
const rataRataIPK = result.map(item => item.rata_rata_ipk);
|
||||
|
||||
@@ -278,7 +278,7 @@ export default function IPKChart({
|
||||
}));
|
||||
} catch (err) {
|
||||
console.error('Error in fetchData:', err);
|
||||
setError(err instanceof Error ? err.message : 'An error occurred while fetching data');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan saat mengambil data');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
|
||||
@@ -117,7 +117,7 @@ export default function IPKJenisKelaminChart({ tahunAngkatan }: Props) {
|
||||
}
|
||||
});
|
||||
|
||||
// Update theme when it changes
|
||||
// Perbarui tema saat berubah
|
||||
useEffect(() => {
|
||||
const currentTheme = theme;
|
||||
setOptions(prev => ({
|
||||
@@ -202,7 +202,7 @@ export default function IPKJenisKelaminChart({ tahunAngkatan }: Props) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Process data for chart
|
||||
// Proses data untuk chart
|
||||
const labels = data.map((item: any) => {
|
||||
console.log('Processing item:', item);
|
||||
return item.jk === 'Pria' ? 'Laki-laki' : 'Perempuan';
|
||||
@@ -223,7 +223,7 @@ export default function IPKJenisKelaminChart({ tahunAngkatan }: Props) {
|
||||
}
|
||||
|
||||
setCategories(labels);
|
||||
// Untuk bar chart, kita memerlukan array dari objects
|
||||
// Untuk bar chart, kita memerlukan array dari objek
|
||||
setSeries([{
|
||||
name: 'Rata-rata IPK',
|
||||
data: values
|
||||
|
||||
@@ -6,7 +6,7 @@ import { ApexOptions } from 'apexcharts';
|
||||
import { useTheme } from 'next-themes';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
|
||||
// Dynamically import ApexCharts to avoid SSR issues
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface IPKLulusTepatData {
|
||||
@@ -138,7 +138,7 @@ export default function IPKLulusTepatChart({ selectedYear }: IPKLulusTepatChartP
|
||||
left: 0
|
||||
}
|
||||
},
|
||||
colors: ['#3B82F6'], // Blue color for line
|
||||
colors: ['#3B82F6'], // Warna biru untuk garis
|
||||
tooltip: {
|
||||
theme: theme === 'dark' ? 'dark' : 'light',
|
||||
y: {
|
||||
@@ -160,7 +160,7 @@ export default function IPKLulusTepatChart({ selectedYear }: IPKLulusTepatChartP
|
||||
}
|
||||
});
|
||||
|
||||
// Update theme when it changes
|
||||
// Perbarui tema saat berubah
|
||||
useEffect(() => {
|
||||
const currentTheme = theme;
|
||||
setOptions(prev => ({
|
||||
@@ -248,7 +248,7 @@ export default function IPKLulusTepatChart({ selectedYear }: IPKLulusTepatChartP
|
||||
const fetchedData: IPKLulusTepatData[] = await response.json();
|
||||
setData(fetchedData);
|
||||
|
||||
// Process data for chart
|
||||
// Proses data untuk chart
|
||||
const tahunAngkatan = fetchedData.map(item => item.tahun_angkatan);
|
||||
const rataRataIPK = fetchedData.map(item => item.rata_rata_ipk);
|
||||
|
||||
@@ -264,7 +264,7 @@ export default function IPKLulusTepatChart({ selectedYear }: IPKLulusTepatChartP
|
||||
},
|
||||
}));
|
||||
} catch (error) {
|
||||
setError(error instanceof Error ? error.message : 'An error occurred');
|
||||
setError(error instanceof Error ? error.message : 'Terjadi kesalahan');
|
||||
console.error('Error fetching data:', error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
|
||||
@@ -6,7 +6,7 @@ import { ApexOptions } from 'apexcharts';
|
||||
import { useTheme } from 'next-themes';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
|
||||
// Dynamically import ApexCharts to avoid SSR issues
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface IPKPrestasiData {
|
||||
@@ -161,7 +161,7 @@ export default function IPKPrestasiChart({ selectedJenisPrestasi }: Props) {
|
||||
}
|
||||
});
|
||||
|
||||
// Update theme when it changes
|
||||
// Perbarui tema saat berubah
|
||||
useEffect(() => {
|
||||
const currentTheme = theme;
|
||||
setOptions(prev => ({
|
||||
@@ -250,15 +250,15 @@ export default function IPKPrestasiChart({ selectedJenisPrestasi }: Props) {
|
||||
const result = await response.json();
|
||||
|
||||
if (!Array.isArray(result)) {
|
||||
throw new Error('Invalid data format received from server');
|
||||
throw new Error('Format data tidak valid diterima dari server');
|
||||
}
|
||||
|
||||
setData(result);
|
||||
|
||||
// Sort data by tahun_angkatan in ascending order
|
||||
// Urutkan data berdasarkan tahun_angkatan secara ascending
|
||||
const sortedData = [...result].sort((a, b) => a.tahun_angkatan - b.tahun_angkatan);
|
||||
|
||||
// Process data for chart
|
||||
// Proses data untuk chart
|
||||
const tahunAngkatan = sortedData.map(item => item.tahun_angkatan);
|
||||
const rataRataIPK = sortedData.map(item => item.rata_rata_ipk);
|
||||
|
||||
@@ -275,7 +275,7 @@ export default function IPKPrestasiChart({ selectedJenisPrestasi }: Props) {
|
||||
}));
|
||||
} catch (err) {
|
||||
console.error('Error in fetchData:', err);
|
||||
setError(err instanceof Error ? err.message : 'An error occurred while fetching data');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan saat mengambil data');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
|
||||
@@ -6,7 +6,7 @@ import { ApexOptions } from 'apexcharts';
|
||||
import { useTheme } from 'next-themes';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
|
||||
// Dynamically import ApexCharts to avoid SSR issues
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface IpkStatusData {
|
||||
@@ -53,10 +53,10 @@ export default function IpkStatusChart({ selectedYear, selectedStatus }: Props)
|
||||
|
||||
if (!Array.isArray(result)) {
|
||||
console.error('Invalid data format:', result);
|
||||
throw new Error('Invalid data format received from server');
|
||||
throw new Error('Format data tidak valid diterima dari server');
|
||||
}
|
||||
|
||||
// Sort data by tahun_angkatan
|
||||
// Urutkan data berdasarkan tahun_angkatan
|
||||
const sortedData = result.sort((a: IpkStatusData, b: IpkStatusData) =>
|
||||
a.tahun_angkatan - b.tahun_angkatan
|
||||
);
|
||||
@@ -65,7 +65,7 @@ export default function IpkStatusChart({ selectedYear, selectedStatus }: Props)
|
||||
setData(sortedData);
|
||||
} catch (err) {
|
||||
console.error('Error in fetchData:', err);
|
||||
setError(err instanceof Error ? err.message : 'An error occurred while fetching data');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan saat mengambil data');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -74,7 +74,7 @@ export default function IpkStatusChart({ selectedYear, selectedStatus }: Props)
|
||||
fetchData();
|
||||
}, [selectedYear, selectedStatus]);
|
||||
|
||||
// Log data changes
|
||||
// Log perubahan data
|
||||
useEffect(() => {
|
||||
console.log('Current data state:', data);
|
||||
}, [data]);
|
||||
@@ -219,7 +219,7 @@ export default function IpkStatusChart({ selectedYear, selectedStatus }: Props)
|
||||
}
|
||||
};
|
||||
|
||||
// Process data for series
|
||||
// Proses data untuk series
|
||||
const processSeriesData = () => {
|
||||
return [{
|
||||
name: 'Rata-rata IPK',
|
||||
|
||||
@@ -8,7 +8,7 @@ import { useTheme } from "next-themes";
|
||||
import { ExternalLink } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
|
||||
// Import ApexCharts secara dinamis untuk menghindari error SSR
|
||||
// Import ApexCharts secara dinamis untuk menghindari masalah SSR
|
||||
const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
|
||||
|
||||
interface MahasiswaStatistik {
|
||||
@@ -174,7 +174,7 @@ export default function StatistikMahasiswaChart({
|
||||
const statistikData = await statistikResponse.json();
|
||||
setStatistikData(statistikData);
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'An error occurred');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan');
|
||||
console.error('Error fetching data:', err);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
@@ -184,7 +184,7 @@ export default function StatistikMahasiswaChart({
|
||||
fetchData();
|
||||
}, []);
|
||||
|
||||
// Update theme when it changes
|
||||
// Perbarui tema saat berubah
|
||||
useEffect(() => {
|
||||
const currentTheme = theme;
|
||||
const textColor = currentTheme === 'dark' ? '#fff' : '#000';
|
||||
@@ -253,7 +253,7 @@ export default function StatistikMahasiswaChart({
|
||||
}));
|
||||
}, [theme]);
|
||||
|
||||
// Update categories when data changes
|
||||
// Perbarui kategori saat data berubah
|
||||
useEffect(() => {
|
||||
if (statistikData.length > 0) {
|
||||
|
||||
|
||||
@@ -38,13 +38,13 @@ export default function StatistikPerAngkatanChart({ tahunAngkatan }: Props) {
|
||||
const result = await response.json();
|
||||
|
||||
if (!Array.isArray(result)) {
|
||||
throw new Error('Invalid data format received from server');
|
||||
throw new Error('Format data tidak valid diterima dari server');
|
||||
}
|
||||
|
||||
setStatistikData(result);
|
||||
} catch (err) {
|
||||
console.error('Error in fetchData:', err);
|
||||
setError(err instanceof Error ? err.message : 'An error occurred while fetching data');
|
||||
setError(err instanceof Error ? err.message : 'Terjadi kesalahan saat mengambil data');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -119,7 +119,7 @@ export default function StatistikPerAngkatanChart({ tahunAngkatan }: Props) {
|
||||
}
|
||||
});
|
||||
|
||||
// Update theme when it changes
|
||||
// Perbarui tema saat berubah
|
||||
useEffect(() => {
|
||||
const currentTheme = theme;
|
||||
const textColor = currentTheme === 'dark' ? '#fff' : '#000';
|
||||
@@ -152,7 +152,7 @@ export default function StatistikPerAngkatanChart({ tahunAngkatan }: Props) {
|
||||
}));
|
||||
}, [theme]);
|
||||
|
||||
// Update dataLabels formatter when data changes
|
||||
// Perbarui formatter dataLabels saat data berubah
|
||||
useEffect(() => {
|
||||
if (statistikData.length > 0) {
|
||||
setChartOptions(prev => ({
|
||||
|
||||
Reference in New Issue
Block a user