wibu/desa-darmasaba
1
0
Fork 0
Code Issues Pull Requests 5 Actions Packages Projects Releases Wiki Activity

Tampilan UI Admin PPID IKM & API

Browse Source
This commit is contained in:
nico
2025-06-12 17:40:37 +08:00
parent a1c2821153
commit 1462e1d256
52 changed files with 2719 additions and 797 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/app/darmasaba/(pages)/ppid/ikm-desa-darmasaba/grafik_berdasarkan_jenis_kelamin/page.tsx
View File

@@ -1,15 +1,15 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
'use client'
import React, { useEffect, useState } from 'react';
import { Box, Center, Flex, Skeleton, Stack, Text, Title } from '@mantine/core';
import { Cell, Pie, PieChart } from 'recharts';
import grafikBerdasarkanJenisKelamin from '@/app/admin/(dashboard)/_state/ppid/indeks_kepuasan_masyarakat/grafikBerdasarkanJenisKelamin';
import colors from '@/con/colors';
import { Box, Center, Flex, Skeleton, Stack, Text, Title } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { useEffect, useState } from 'react';
import { Cell, Pie, PieChart } from 'recharts';
import { useProxy } from 'valtio/utils';
import stateGrafikBerdasarkanJenisKelamin from '@/app/admin/(dashboard)/_state/ppid/indeks_kepuasan_masyarakat/grafikBerdasarkanJenisKelamin';
function GrafikBerdasarkanJenisKelamin() {
const grafikBerdasarkanJenisKelamin = useProxy(stateGrafikBerdasarkanJenisKelamin.grafikBerdasarkanJenisKelamin)
const stategrafikBerdasarkanJenisKelamin = useProxy(grafikBerdasarkanJenisKelamin)
const [mounted, setMounted] = useState(false);
const [donutData, setDonutData] = useState<any[]>([]);
@@ -34,13 +34,13 @@ function GrafikBerdasarkanJenisKelamin() {
}, []);
const fetchData = async () => {
await grafikBerdasarkanJenisKelamin.findMany.load();
if (grafikBerdasarkanJenisKelamin.findMany.data) {
updateChartData(grafikBerdasarkanJenisKelamin.findMany.data);
await stategrafikBerdasarkanJenisKelamin.findMany.load();
if (stategrafikBerdasarkanJenisKelamin.findMany.data) {
updateChartData(stategrafikBerdasarkanJenisKelamin.findMany.data);
}
};
if(!grafikBerdasarkanJenisKelamin.findMany.data) return <Stack>
if(!stategrafikBerdasarkanJenisKelamin.findMany.data) return <Stack>
<Title pb={10} order={3}>Grafik Berdasarkan Jenis Kelamin Responden</Title>
<Skeleton h={500} />
</Stack>

18
src/app/darmasaba/(pages)/ppid/ikm-desa-darmasaba/grafik_berdasarkan_pilihan_responden/page.tsx
View File

@@ -1,15 +1,15 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
'use client'
import stateGrafikResponden from '@/app/admin/(dashboard)/_state/ppid/indeks_kepuasan_masyarakat/grafikBerdasarkanResponden';
import grafikBerdasarkanResponden from '@/app/admin/(dashboard)/_state/ppid/indeks_kepuasan_masyarakat/grafikBerdasarkanResponden';
import colors from '@/con/colors';
import { Stack, Title, Box, Center, Flex, Text, Skeleton } from '@mantine/core';
import { Box, Center, Flex, Skeleton, Stack, Text, Title } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import React, { useEffect, useState } from 'react';
import { PieChart, Pie, Cell } from 'recharts';
import { useEffect, useState } from 'react';
import { Cell, Pie, PieChart } from 'recharts';
import { useProxy } from 'valtio/utils';
function GrafikBerdasarkanResponden() {
const grafikBerdasarkanResponden = useProxy(stateGrafikResponden.grafikBerdasarkanResponden)
const stategrafikBerdasarkanResponden = useProxy(grafikBerdasarkanResponden)
const [donutData, setDonutData] = useState<any[]>([]);
const [mounted, setMounted] = useState(false);
@@ -37,13 +37,13 @@ function GrafikBerdasarkanResponden() {
}, []);
const fetchData = async () => {
await grafikBerdasarkanResponden.findMany.load();
if (grafikBerdasarkanResponden.findMany.data) {
updateChartData(grafikBerdasarkanResponden.findMany.data);
await stategrafikBerdasarkanResponden.findMany.load();
if (stategrafikBerdasarkanResponden.findMany.data) {
updateChartData(stategrafikBerdasarkanResponden.findMany.data);
}
};
if (!grafikBerdasarkanResponden.findMany.data) return <Stack>
if (!stategrafikBerdasarkanResponden.findMany.data) return <Stack>
<Title pb={10} order={3}>Grafik Berdasarkan Responden</Title>
<Skeleton h={500} />
</Stack>

18
src/app/darmasaba/(pages)/ppid/ikm-desa-darmasaba/grafik_berdasarkan_umur_responden/page.tsx
View File

@@ -1,15 +1,15 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
'use client'
import stateGrafikBerdasarkanUmur from '@/app/admin/(dashboard)/_state/ppid/indeks_kepuasan_masyarakat/grafikBerdasarkanUmur';
import grafikBerdasarkanUmur from '@/app/admin/(dashboard)/_state/ppid/indeks_kepuasan_masyarakat/grafikBerdasarkanUmur';
import colors from '@/con/colors';
import { Stack, Title, Box, Center, Flex, Text, Skeleton } from '@mantine/core';
import { Box, Center, Flex, Skeleton, Stack, Text, Title } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import React, { useEffect, useState } from 'react';
import { PieChart, Pie, Cell } from 'recharts';
import { useEffect, useState } from 'react';
import { Cell, Pie, PieChart } from 'recharts';
import { useProxy } from 'valtio/utils';
function GrafikBerdasarakanUmur() {
const grafikBerdasarkanUmur = useProxy(stateGrafikBerdasarkanUmur.grafikBerdasarkanUmur)
const stategrafikBerdasarkanUmur = useProxy(grafikBerdasarkanUmur)
const [donutData, setDonutData] = useState<any[]>([]);
const [mounted, setMounted] = useState(false);
@@ -38,13 +38,13 @@ function GrafikBerdasarakanUmur() {
}, []);
const fetchData = async () => {
await grafikBerdasarkanUmur.findMany.load();
if (grafikBerdasarkanUmur.findMany.data) {
updateChartData(grafikBerdasarkanUmur.findMany.data);
await stategrafikBerdasarkanUmur.findMany.load();
if (stategrafikBerdasarkanUmur.findMany.data) {
updateChartData(stategrafikBerdasarkanUmur.findMany.data);
}
}
if(!grafikBerdasarkanUmur.findMany.data) return <Stack>
if(!stategrafikBerdasarkanUmur.findMany.data) return <Stack>
<Title pb={10} order={3}>Grafik Berdasarkan Umur Responden</Title>
<Skeleton h={500} />
</Stack>

8
src/app/darmasaba/(pages)/ppid/ikm-desa-darmasaba/grafik_hasil_kepuasan_masyarakat/page.tsx
View File

@@ -1,15 +1,15 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
'use client'
import stateGrafikHasilKepuasanMasyarakat from '@/app/admin/(dashboard)/_state/ppid/indeks_kepuasan_masyarakat/grafikHasilKepuasan';
import grafikHasilKepuasanMasyarakat from '@/app/admin/(dashboard)/_state/ppid/indeks_kepuasan_masyarakat/grafikHasilKepuasan';
import colors from '@/con/colors';
import { Box, Skeleton, Stack, Text, Title } from '@mantine/core';
import { useMediaQuery, useShallowEffect } from '@mantine/hooks';
import React, { useEffect, useState } from 'react';
import { BarChart, Tooltip, XAxis, YAxis, Legend, Bar } from 'recharts';
import { useEffect, useState } from 'react';
import { Bar, BarChart, Legend, Tooltip, XAxis, YAxis } from 'recharts';
import { useProxy } from 'valtio/utils';
function GrafikHasilKepuasan() {
const grafikHasilKepuasan = useProxy(stateGrafikHasilKepuasanMasyarakat.grafikHasilKepuasanMasyarakat)
const grafikHasilKepuasan = useProxy(grafikHasilKepuasanMasyarakat)
const [chartData, setChartData] = useState<any[]>([]);
const [mounted, setMounted] = useState(false);
const isTablet = useMediaQuery('(max-width: 1024px)')

2
src/app/darmasaba/_com/main-page/landing-page/index.tsx
View File

@@ -29,7 +29,7 @@ const getCurrentTime = () => {
}
const isWorkingHours = (currentTime: string): boolean => {
const [openTime, closeTime] = ['08:00', '11:00'];
const [openTime, closeTime] = ['08:00', '16:00'];
const compareTimes = (time1: string, time2: string) => {
const [hour1, minute1] = time1.split(':').map(Number);