d1041211043_randa/portaldata
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix Layout

Browse Source
This commit is contained in:
Randa Firman Putra
2025-07-14 22:49:22 +07:00
parent f76440c4e2
commit 833b307602
21 changed files with 143 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/charts/AsalDaerahChart.tsx
View File

@@ -262,7 +262,7 @@ export default function AsalDaerahChart() {
</CardTitle>
</CardHeader>
<CardContent>
<div className="h-[600px] w-full">
<div className="h-[300px] w-full">
<Chart
options={options}
series={series}

4
components/charts/AsalDaerahPerAngkatanChart.tsx
View File

@@ -308,13 +308,13 @@ export default function AsalDaerahPerAngkatanChart({ tahunAngkatan }: Props) {
</CardTitle>
</CardHeader>
<CardContent>
<div className="h-[600px] w-full">
<div className="h-[300px] w-full">
<Chart
options={options}
series={series}
type="bar"
height="100%"
width="90%"
width="100%"
/>
</div>
</CardContent>

6
components/charts/AsalDaerahStatusChart.tsx
View File

@@ -119,7 +119,7 @@ export default function AsalDaerahStatusChart({ selectedYear, selectedStatus }:
fontSize: '12px',
colors: theme === 'dark' ? '#fff' : '#000'
}
}
},
},
yaxis: {
title: {
@@ -224,14 +224,14 @@ export default function AsalDaerahStatusChart({ selectedYear, selectedStatus }:
</CardTitle>
</CardHeader>
<CardContent>
<div className="h-[500px] w-full max-w-5xl mx-auto">
<div className="h-[300px] w-full max-w-5xl mx-auto">
{typeof window !== 'undefined' && (
<Chart
options={chartOptions}
series={series}
type="bar"
height="100%"
width="90%"
width="100%"
/>
)}
</div>

4
components/charts/IPKChart.tsx
View File

@@ -324,13 +324,13 @@ export default function IPKChart() {
</CardTitle>
</CardHeader>
<CardContent>
<div className="h-[300px] sm:h-[350px] md:h-[400px] w-full max-w-5xl mx-auto">
<div className="h-[300px] sm:h-[350px] md:h-[300px] w-full max-w-5xl mx-auto">
<Chart
options={options}
series={series}
type="line"
height="100%"
width="90%"
width="100%"
/>
</div>
</CardContent>

4
components/charts/IpkStatusChart.tsx
View File

@@ -278,14 +278,14 @@ export default function IpkStatusChart({ selectedYear, selectedStatus }: Props)
</CardTitle>
</CardHeader>
<CardContent>
<div className="h-[300px] sm:h-[350px] md:h-[400px] w-full max-w-5xl mx-auto">
<div className="h-[300px] sm:h-[300px] md:h-[300px] w-full max-w-5xl mx-auto">
{typeof window !== 'undefined' && (
<Chart
options={chartOptions}
series={series}
type={selectedYear === 'all' ? 'line' : 'bar'}
height="100%"
width="90%"
width="100%"
/>
)}
</div>

10
components/charts/JenisPendaftaranChart.tsx
View File

@@ -32,7 +32,7 @@ export default function JenisPendaftaranChart() {
},
plotOptions: {
bar: {
horizontal: true,
horizontal: false,
columnWidth: '55%',
},
},
@@ -66,7 +66,7 @@ export default function JenisPendaftaranChart() {
fontSize: '12px',
colors: theme === 'dark' ? '#fff' : '#000'
}
}
},
},
yaxis: {
title: {
@@ -82,7 +82,9 @@ export default function JenisPendaftaranChart() {
fontSize: '12px',
colors: theme === 'dark' ? '#fff' : '#000'
}
}
},
min:0,
tickAmount: 5
},
fill: {
opacity: 1,
@@ -280,7 +282,7 @@ export default function JenisPendaftaranChart() {
</CardTitle>
</CardHeader>
<CardContent>
<div className="h-[300px] sm:h-[350px] md:h-[400px] w-full max-w-5xl mx-auto">
<div className="h-[300px] sm:h-[350px] md:h-[300px] w-full max-w-5xl mx-auto">
<Chart
options={options}
series={series}

7
components/charts/JenisPendaftaranPerAngkatanChart.tsx
View File

@@ -230,18 +230,15 @@ export default function JenisPendaftaranPerAngkatanChart({ tahunAngkatan }: Prop
<CardTitle className="text-xl font-bold dark:text-white">
Jenis Pendaftaran Angkatan {tahunAngkatan}
</CardTitle>
<div className="text-lg font-semibold text-gray-600 dark:text-gray-300">
Total Mahasiswa: {totalMahasiswa}
</div>
</CardHeader>
<CardContent>
<div className="h-[350px] w-full max-w-5xl mx-auto">
<div className="h-[300px] w-full max-w-5xl mx-auto">
<Chart
options={options}
series={series}
type="pie"
height="100%"
width="90%"
width="100%"
/>
</div>
</CardContent>

6
components/charts/JenisPendaftaranStatusChart.tsx
View File

@@ -137,7 +137,7 @@ export default function JenisPendaftaranStatusChart({ selectedYear, selectedStat
}
},
min:0,
tickAmount: 5
tickAmount: 10
},
fill: {
opacity: 1,
@@ -235,14 +235,14 @@ export default function JenisPendaftaranStatusChart({ selectedYear, selectedStat
</CardTitle>
</CardHeader>
<CardContent>
<div className="h-[350px] w-full max-w-5xl mx-auto">
<div className="h-[300px] w-full max-w-5xl mx-auto">
{typeof window !== 'undefined' && (
<Chart
options={chartOptions}
series={series}
type="bar"
height="100%"
width="90%"
width="100%"
/>
)}
</div>

7
components/charts/JenisPendaftaranStatusPieChart.tsx
View File

@@ -171,19 +171,16 @@ export default function JenisPendaftaranStatusPieChart({ selectedYear, selectedS
Jenis Pendaftaran Mahasiswa {selectedStatus}
{selectedYear !== 'all' ? ` Angkatan ${selectedYear}` : ''}
</CardTitle>
<div className="text-lg font-semibold text-gray-600 dark:text-gray-300">
Total Mahasiswa: {totalMahasiswa}
</div>
</CardHeader>
<CardContent>
<div className="h-[350px] w-full max-w-5xl mx-auto">
<div className="h-[300px] w-full max-w-5xl mx-auto">
{typeof window !== 'undefined' && (
<Chart
options={{...chartOptions, labels}}
series={series}
type="pie"
height="100%"
width="90%"
width="100%"
/>
)}
</div>

2
components/charts/StatistikMahasiswaChart.tsx
View File

@@ -311,7 +311,7 @@ export default function StatistikMahasiswaChart() {
</CardTitle>
</CardHeader>
<CardContent>
<div className="h-[300px] sm:h-[350px] md:h-[400px] w-full max-w-5xl mx-auto">
<div className="h-[300px] sm:h-[350px] md:h-[300px] w-full max-w-5xl mx-auto">
<Chart
options={chartOptions}
series={chartSeries}

7
components/charts/StatistikPerAngkatanChart.tsx
View File

@@ -218,18 +218,15 @@ export default function StatistikPerAngkatanChart({ tahunAngkatan }: Props) {
<CardTitle className="text-xl font-bold dark:text-white">
Total Mahasiswa Angkatan {tahunAngkatan}
</CardTitle>
<div className="text-lg font-semibold text-gray-600 dark:text-gray-300">
Total Mahasiswa: {totalMahasiswa}
</div>
</CardHeader>
<CardContent>
<div className="h-[350px] w-full max-w-5xl mx-auto">
<div className="h-[300px] w-full max-w-5xl mx-auto">
<Chart
options={chartOptions}
series={chartSeries}
type="pie"
height="100%"
width="90%"
width="100%"
/>
</div>
</CardContent>

4
components/charts/StatusMahasiswaChart.tsx
View File

@@ -84,6 +84,8 @@ export default function StatusMahasiswaChart() {
colors: theme === 'dark' ? '#fff' : '#000'
}
},
min:0,
tickAmount: 5
},
fill: {
opacity: 1,
@@ -200,7 +202,7 @@ export default function StatusMahasiswaChart() {
</CardTitle>
</CardHeader>
<CardContent>
<div className="h-[300px] sm:h-[350px] md:h-[400px] w-full max-w-5xl mx-auto">
<div className="h-[300px] sm:h-[350px] md:h-[300px] w-full max-w-5xl mx-auto">
{typeof window !== 'undefined' && (
<Chart
options={chartOptions}

11
components/charts/StatusMahasiswaFilterChart.tsx
View File

@@ -130,7 +130,9 @@ export default function StatusMahasiswaFilterChart({ selectedYear, selectedStatu
fontSize: '12px',
colors: theme === 'dark' ? '#fff' : '#000'
}
}
},
min:0,
tickAmount: 5
},
fill: {
opacity: 1,
@@ -231,19 +233,18 @@ export default function StatusMahasiswaFilterChart({ selectedYear, selectedStatu
<Card className="bg-white dark:bg-slate-900 shadow-lg">
<CardHeader>
<CardTitle className="text-xl font-bold dark:text-white">
Status Mahasiswa {selectedStatus}
{selectedYear !== 'all' ? ` Angkatan ${selectedYear}` : ''}
Jumlah Mahasiswa {selectedStatus}
</CardTitle>
</CardHeader>
<CardContent>
<div className="h-[350px] w-full max-w-5xl mx-auto">
<div className="h-[300px] w-full max-w-5xl mx-auto">
{typeof window !== 'undefined' && (
<Chart
options={chartOptions}
series={series}
type="bar"
height="100%"
width="90%"
width="100%"
/>
)}
</div>

7
components/charts/StatusMahasiswaFilterPieChart.tsx
View File

@@ -163,19 +163,16 @@ export default function StatusMahasiswaFilterPieChart({ selectedYear, selectedSt
Status Mahasiswa {selectedStatus}
{selectedYear !== 'all' ? ` Angkatan ${selectedYear}` : ''}
</CardTitle>
<div className="text-lg font-semibold text-gray-600 dark:text-gray-300">
Total Mahasiswa: {totalMahasiswa}
</div>
</CardHeader>
<CardContent>
<div className="h-[350px] w-full max-w-5xl mx-auto">
<div className="h-[300px] w-full max-w-5xl mx-auto">
{typeof window !== 'undefined' && (
<Chart
options={chartOptions}
series={series}
type="pie"
height="100%"
width="90%"
width="100%"
/>
)}
</div>