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

ProfilePPID bagian Profile, VisiMisiPPD sudah ada seed dan bisa di edit

Browse Source
This commit is contained in:
nico
2025-05-13 11:51:48 +08:00
parent 8a34a122d0
commit e5889ca903
39 changed files with 1048 additions and 418 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
src/app/darmasaba/(pages)/ppid/visi-misi-ppid/page.tsx
View File

@@ -1,54 +1,60 @@
'use client'
import stateVisiMisiPPID from '@/app/admin/(dashboard)/_state/ppid/visi_misi_ppid/visimisiPPID';
import colors from '@/con/colors';
import { Stack, Box, Paper, Text, Image, Center, ListItem, List } from '@mantine/core';
import React from 'react';
import { Box, Center, Image, Paper, Skeleton, Stack, Text } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { useProxy } from 'valtio/utils';
import BackButton from '../../desa/layanan/_com/BackButto';
function Page() {
const allList = useProxy(stateVisiMisiPPID)
useShallowEffect(() => {
allList.findById.load("1") // Assuming "1" is your default ID, adjust as needed
}, [])
if (!allList.findById.data) return <Stack>
{Array.from({ length: 10 }).map((v, k) => <Skeleton key={k} h={40} />)}
</Stack>
const dataArray = Array.isArray(allList.findById.data)
? allList.findById.data
: [allList.findById.data];
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
<Box px={{ base: 'md', md: 100 }}>
<BackButton />
</Box>
<Box px={{ base: "md", md: 100 }}>
<Stack gap={'lg'}>
<Paper p={"xl"} bg={colors['white-trans-1']}>
<Box pb={30}>
<Center>
<Image src={"/api/img/darmasaba-icon.png"} w={{ base: 100, md: 150 }} alt='' />
</Center>
<Text ta={"center"} fz={{ base: "h2", md: "2.5rem" }} fw={"bold"}>
MOTO PPID DESA DARMASABA
</Text>
<Text ta={"center"} fz={{ base: "h4", md: "h3" }} >
MEMBERIKAN INFORMASI YANG CEPAT, MUDAH, TEPAT DAN TRANSPARAN
</Text>
</Box>
<Box px={{ base: 20, md: 50 }} pb={30}>
<Text ta={"center"} fz={{ base: "h3", md: "h2" }} fw={"bold"}>
VISI PPID
</Text>
<Text fz={{ base: "md", md: "h3" }} ta={"justify"}>
Memberikan pelayanan informasi yanng transparan dan akuntabel untuk memenuhi hak pemohon informasi
sesuai dengan ketentuan peraturan perundang-undangan yang berlaku.
</Text>
</Box>
<Box px={{ base: 20, md: 50 }}>
<Text ta={"center"} fz={{ base: "h3", md: "h2" }} fw={"bold"}>
MISI PPID
</Text>
<Box >
<List type='ordered'>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Meningkatkan pengelolaan dan pelayanan informasi yang berkualitas, benar dan bertanggung jawab</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Membangun dan mengembangkan sistem penyediaan dan layanan informasi.</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Meningkatkan dan mengembangkan kompetensi dan kualitas SDM dalam bidang pelayanan informasi.</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} >Mewujudkan keterbukaan informasi Pemerintah Desa Punggul dengan proses yang cepat, tepat, mudah
dan sederhana.</ListItem>
</List>
{dataArray.map((item) => (
<Box key={item.id} px={{ base: "md", md: 100 }}>
<Stack gap={'lg'}>
<Paper p={"xl"} bg={colors['white-trans-1']}>
<Box pb={30}>
<Center>
<Image src={"/api/img/darmasaba-icon.png"} w={{ base: 100, md: 150 }} alt='' />
</Center>
<Text ta={"center"} fz={{ base: "h2", md: "2.5rem" }} fw={"bold"}>
MOTO PPID DESA DARMASABA
</Text>
<Text ta={"center"} fz={{ base: "h4", md: "h3" }} >
MEMBERIKAN INFORMASI YANG CEPAT, MUDAH, TEPAT DAN TRANSPARAN
</Text>
</Box>
</Box>
</Paper>
</Stack>
</Box>
<Box px={{ base: 20, md: 50 }} pb={30}>
<Text ta={"center"} fz={{ base: "h3", md: "h2" }} fw={"bold"}>
VISI PPID
</Text>
<Text fz={{ base: "md", md: "h3" }} ta={"justify"} dangerouslySetInnerHTML={{ __html: item.visi }} />
</Box>
<Box px={{ base: 20, md: 50 }}>
<Text ta={"center"} fz={{ base: "h3", md: "h2" }} fw={"bold"}>
MISI PPID
</Text>
<Text fz={{ base: "md", md: "h3" }} ta={"justify"} dangerouslySetInnerHTML={{ __html: item.misi }} />
</Box>
</Paper>
</Stack>
</Box>
))}
</Stack>
);
}