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

Sinkronisasi UI & API Admin - User Submenu Profile, Menu Desa

Browse Source
This commit is contained in:
nico
2025-08-13 14:53:48 +08:00
parent 0777b00a7d
commit b8a45bc451
23 changed files with 1348 additions and 409 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/darmasaba/(pages)/desa/profile/page.tsx
View File

@@ -31,7 +31,6 @@ function Page() {
<LambangDesa />
<MaskotDesa />
<ProfilPerbekel />
{/* <LembagaDesa /> */}
<MotoDesa />
<SemuaPerbekel/>
</Box>

63
src/app/darmasaba/(pages)/desa/profile/ui/lambangDesa.tsx
View File

@@ -1,8 +1,27 @@
/* eslint-disable react-hooks/exhaustive-deps */
'use client'
import colors from '@/con/colors';
import { Box, Stack, Paper, Image, Text, Center } from '@mantine/core';
import React from 'react';
import { Box, Stack, Paper, Image, Text, Center, Skeleton } from '@mantine/core';
import React, { useEffect } from 'react';
import { useProxy } from 'valtio/utils';
import stateProfileDesa from '@/app/admin/(dashboard)/_state/desa/profile';
function LambangDesa() {
const state = useProxy(stateProfileDesa.lambangDesa)
useEffect(() => {
state.findUnique.load("edit")
}, [])
const { data, loading } = state.findUnique
if (loading || !data) {
return (
<Box py={10}>
<Skeleton h={500} />
</Box>
)
}
return (
<Box pb={70}>
<Stack align='center' gap={0}>
@@ -13,46 +32,8 @@ function LambangDesa() {
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={"2.5rem"}>Lambang Desa</Text>
</Box>
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Text fz={{ base: "md", md: "h3"}} ta={"justify"}>
Simbul atau lambang bukanlah suatu gambar bentuk tanpa mengandung makna, namun segala yang terdapat di dalamnya mengandung makna filosofi yang mendalam dan kepribadian, setidaknya mengandung suatu pengharapan atau tujuan yang ingin dicapai oleh yang empunya lambang tersebut.
</Text>
<Text fz={{ base: "md", md: "h3"}} py={10} ta={"justify"}>
Lambang Desa Darmasaba berbentuk persegi lima sama sisi dengan dasar warna biru yang di dalamnya terdapat bangunan Padmasana dengan rong tiga, di dasarnya terdapat bunga Padma berwarna merah muda yang dikelilingi oleh padi dan kapas serta rantai sebagai pengikatnya, terdapat pula pita berwarna putih bertuliskan “Dharma Temaja”.
</Text>
<Box>
<Text fz={{ base: "md", md: "h3"}} ta={"justify"} fw={"bold"}>
Bentuk Dasar Persegi Lima
</Text>
<Text fz={{ base: "md", md: "h3"}} ta={"justify"}>
Melambangkan Pancasila yang menjadi dasar Negara Republik Indonesia yang harus dihayati dan diamalkan oleh masyarakat Indonesia termasuk masyarakat Desa Darmaaba merupakan bagian dari Bangsa Indonesia.
</Text>
</Box>
<Box>
<Text fz={{ base: "md", md: "h3"}} ta={"justify"} fw={"bold"}>
Dasar Persegi Lima Yang Berwarna Biru
</Text>
<Text fz={{ base: "md", md: "h3"}} ta={"justify"}>
Mengandung makna wilayah Desa Darmasaba yang luas, tanahnya yg subur dan masyarakatnya memiliki berbagai macam mata pencaharian.
</Text>
</Box>
<Box>
<Text fz={{ base: "md", md: "h3"}} ta={"justify"} fw={"bold"}>
Bangunan Pelinggih Padmasana Rong Tiga
</Text>
<Text fz={{ base: "md", md: "h3"}} ta={"justify"}>
Merupakan perlambang wilayah Desa Darmasaba terdiri dari tiga Desa Adat antara lain Desa Adat Aban, Desa Adat Tegal dan Desa Adat Darmasaba yang dengan rasa persatuan dan kesatuan dilandasi semangat segalak segilik seguluk sebayantaka membangun Desa Darmasaba.
</Text>
</Box>
<Box>
<Text fz={{ base: "md", md: "h3"}} ta={"justify"} fw={"bold"}>
Bunga Padma Merah Muda
</Text>
<Text fz={{ base: "md", md: "h3"}} ta={"justify"}>
Memiliki arti kemuliaan.
</Text>
</Box>
<Text fz={{ base: "md", md: "h3"}} ta={"justify"} dangerouslySetInnerHTML={{__html: data.deskripsi}} />
</Paper>
</Stack>
</Box >
);

39
src/app/darmasaba/(pages)/desa/profile/ui/lembagaDesa.tsx
View File

@@ -1,39 +0,0 @@
import colors from '@/con/colors';
import { Box, Center, Image, Paper, Stack, Text } from '@mantine/core';
function LembagaDesa() {
return (
<Box pb={70}>
<Stack align='center' gap={0}>
<Box pb={30}>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Lembaga Desa</Text>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h4", md: "h2"}}>Badan Permusyawaratan Desa (BPD)</Text>
</Box>
<Paper mb={50} p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Center pb={10}>
<Image src={"/api/img/bpddarmasaba.png"} alt='' w={{ base: 390, md: 1000 }} />
</Center>
</Paper>
<Box pb={30}>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Lembaga pemberdayaan Masyarakat (LPM)</Text>
</Box>
<Paper mb={50} p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Center pb={10}>
<Image src={"/api/img/bpddarmasaba.png"} alt='' w={{ base: 390, md: 1000 }} />
</Center>
</Paper>
<Box pb={30}>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Perangkat Desa</Text>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h4", md: "h2"}}>Struktur Organisasi Tata Kerja Pemerintahan Desa Darmasaba</Text>
</Box>
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Center pb={10}>
<Image src={"/api/img/pernagkatdesa.png"} alt='' w={{ base: 390, md: 1000 }} />
</Center>
</Paper>
</Stack>
</Box >
);
}
export default LembagaDesa;

117
src/app/darmasaba/(pages)/desa/profile/ui/maskotDesa.tsx
View File

@@ -1,7 +1,27 @@
/* eslint-disable react-hooks/exhaustive-deps */
'use client'
import stateProfileDesa from '@/app/admin/(dashboard)/_state/desa/profile';
import colors from '@/con/colors';
import { Box, Center, Image, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
import { Box, Card, Center, Group, Image, Paper, Skeleton, Stack, Text } from '@mantine/core';
import { useEffect } from 'react';
import { useProxy } from 'valtio/utils';
function MaskotDesa() {
const state = useProxy(stateProfileDesa.maskotDesa)
useEffect(() => {
state.findUnique.load("edit")
}, [])
const { data, loading } = state.findUnique
if (loading || !data) {
return (
<Box py={10}>
<Skeleton h={500} />
</Box>
)
}
return (
<Box pb={70}>
<Stack align='center' gap={0}>
@@ -11,83 +31,24 @@ function MaskotDesa() {
</Center>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={"2.5rem"}>Maskot Desa</Text>
</Box>
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Text fz={{ base: "md", md: "h3" }} ta={"justify"}>
Pudak adalah bunga dari tanaman sejenis pandan <Text span fz={{ base: "md", md: "h3" }} fs={"italic"}>(Pandanaceae)</Text>. Bentuk bunga ini tersusun dalam beberapa lapisan, terbungkus oleh kelopak warna putih <Text span fz={{ base: "md", md: "h3" }} fs={"italic"}>(semacam daun lonjong)</Text> yang ujungnya meruncing.
</Text>
<Text fz={{ base: "md", md: "h3" }} py={10} ta={"justify"}>
Bunga Pudak berwarna kuning dan akan terlihat jika kelopak atau pelepahnya telah mekar. Kekhasan dari bunga pudak, yaitu mempunyai aroma wangi yang semerbak nan lembut <Text span fz={{ base: "md", md: "h3" }} fs={"italic"}>(tidak menyengat)</Text>, dan dapat menebar keharuman sepanjang pagi atau pun sore hari. Tanaman ini dapat tumbuh di sepanjang pantai, aliran sungai, di atas batu-batu karang, dan juga di tanah ladang.
</Text>
{/* Pohon dan Bunga Pudak */}
<Box py={20}>
<SimpleGrid
cols={{
base: 1,
md: 2,
}}
>
<Center>
<Box>
<Paper p={"lg"}>
<Image src={"/pohonpudak.png"} alt="" w={{ base: 150, md: 250 }} />
<Text ta={"center"} fw={"bold"} c={colors["blue-button"]} fz={{ base: "md", md: "h3" }}>Pohon Pudak</Text>
</Paper>
</Box>
</Center>
<Center>
<Box>
<Paper p={"lg"}>
<Image src={"/bungapudak.png"} alt="" w={{ base: 150, md: 250 }} />
<Text ta={"center"} fw={"bold"} c={colors["blue-button"]} fz={{ base: "md", md: "h3" }}>Bunga Pudak</Text>
</Paper>
</Box>
</Center>
</SimpleGrid>
</Box>
<Box>
<Text fz={{ base: "md", md: "h3" }} py={10} ta={"justify"}>
Dalam Kamus Jawa Kuna- Indonesia kata “Pudak” berarti bunga pandan atau Pandanus Moschatus (Mardiwarsito: 1981: 442). Selain itu bunga pudak juga dapat disebut ketaka atau ketaki (Mardiwarsito, 1981: 276). Sedangkan kata “Sategal” berasal dari kata dasar “Tegal” yang berarti ladang (Mardiwarsito, 1981: 593). Jadi Pudak Sategal dapat diartikan sebagai satu ladang luas yang dipenuhi bunga pudak dan menabar keharuman.
</Text>
<Text fz={{ base: "md", md: "h3" }} py={10} ta={"justify"}>
Pada sebuah kesempatan, Ida Pedanda Putu Pemaron menjelaskan mengenai makna dari istilah Pudak Sategal dengan sebuah analogi bahwa, sekuntum bunga pudak memiliki aroma wangi atau keharuman yang sangat kuat, apalagi jika satu ladang penuh bunga pudak, maka dapat dipastikan aroma keharumannya akan membumbung menyebar ke segala penjuru (Wawancara, 18 Mei 2019 di Geria Putra Mandara Kenderan, Tegallalang).
“Pudak” ialah sebuah bunga yang memiliki aroma wangi atau keharuman yang semerbak, lembut, dan khas.
</Text>
</Box>
{/* Tari dan Pose Klimaks Sekar Pudak */}
<Box py={20}>
<SimpleGrid
cols={{
base: 1,
md: 2,
}}
>
<Box>
<Center>
<Paper p={"lg"}>
<Image src={"/tarisekar.png"} alt="" w={{ base: 150, md: 250 }} />
<Text ta={"center"} fw={"bold"} c={colors["blue-button"]} fz={{ base: "md", md: "h3" }}>Tari Sekar Pudak</Text>
</Paper>
</Center>
</Box>
<Box>
<Center>
<Paper p={"lg"}>
<Image src={"/klimakstari.png"} alt="" w={{ base: 150, md: 250 }} />
<Text ta={"center"} fw={"bold"} c={colors["blue-button"]} fz={{ base: "md", md: "h3" }}>Pose Klimaks Tari </Text>
<Text ta={"center"} fw={"bold"} c={colors["blue-button"]} fz={{ base: "md", md: "h3" }}>Sekar Pudak </Text>
</Paper>
</Center>
</Box>
</SimpleGrid>
</Box>
<Box>
<Text fz={{ base: "md", md: "h3" }} py={10} ta={"justify"}>
Garapan Tari Maskot Desa Darmasaba Sekar Pudak diwujudkan ke dalam bentuk tari kreasi yang ditarikan secara berkelompok dengan jumlah lima orang penari perempuan (putri).
</Text>
<Text fz={{ base: "md", md: "h3" }} py={10} ta={"justify"}>
Pemilihan penari perempuan dimaksudkan untuk mempresentasikan keindahan, keluwesan, dan keharuman dari bunga pudak. Sedangkan penetapan jumlah penari lima orang didasarkan atas pertimbangan kebutuhan koreografi agar dapat membentuk desain-desain komposisi lantai yang menarik dan dinamis, baik ketika ditarikan di area panggung yang luas atau pun area panggung yang kecil. Penyajian tari maskot ini dirancang dengan durasi waktu 9 menit.
</Text>
</Box>
<Paper p={"xl"} bg={colors['white-trans-1']}>
<Text fz={{ base: "md", md: "h3" }} ta={"justify"} dangerouslySetInnerHTML={{ __html: data.deskripsi }} />
<Group wrap="wrap" gap="md">
{data.images.map((img, index) => (
<Card key={index} p="xs" w={220}>
<Image
src={img.image.link}
alt={img.label}
w={200}
h={200}
fit="cover"
radius="md"
style={{ border: '1px solid #ccc', objectFit: 'cover' }}
/>
<Text ta="center" mt="xs" fw="bold">{img.label}</Text>
</Card>
))}
</Group>
</Paper>
</Stack>
</Box >

146
src/app/darmasaba/(pages)/desa/profile/ui/profilPerbekel.tsx
View File

@@ -1,7 +1,27 @@
/* eslint-disable react-hooks/exhaustive-deps */
'use client'
import stateProfileDesa from '@/app/admin/(dashboard)/_state/desa/profile';
import colors from '@/con/colors';
import { Box, Image, List, ListItem, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
import { Box, Image, Paper, SimpleGrid, Skeleton, Stack, Text } from '@mantine/core';
import { useEffect } from 'react';
import { useProxy } from 'valtio/utils';
function ProfilPerbekel() {
const state = useProxy(stateProfileDesa.profilPerbekel)
useEffect(() => {
state.findUnique.load("edit")
}, [])
const { data, loading } = state.findUnique
if (loading || !data) {
return (
<Box py={10}>
<Skeleton h={500} />
</Box>
)
}
return (
<Box pb={70}>
<Stack align='center' gap={0}>
@@ -19,7 +39,16 @@ function ProfilPerbekel() {
<Box>
<Paper bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Stack gap={0}>
<Image pt={{ base: 0, md: 120 }} px={"lg"} src={"/api/img/perbekel.png"} sizes='100%' alt='' />
<Image
pt={{ base: 0, md: 120 }}
px={"lg"}
src={data.image?.link || "/perbekel.png"}
sizes='100%'
alt=''
onError={(e) => {
e.currentTarget.src = "/perbekel.png";
}}
/>
<Paper
bg={colors['blue-button']}
px={"lg"}
@@ -35,101 +64,30 @@ function ProfilPerbekel() {
</Stack>
</Paper>
</Box>
<Box>
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Text fz={"h2"} fw={"bold"}>
Biodata
</Text>
<Text fz={{ base: "md", md: "h3" }} ta={"justify"}>
I.B Surya Prabhawa Manuaba, S.H., M.H., adalah Perbekel Darmasaba periode 2021-2027, seorang advokat, pendiri Mantra Legal Consultants & Advocates, serta aktif di bidang musik dan akademis. Dia menempuh pendidikan hukum di Universitas Udayana dan Universitas Mahasaraswati Denpasar serta memiliki pengalaman luas di berbagai organisasi dan kepemimpinan.
</Text>
<Text py={10} fz={"h2"} fw={"bold"}>
Pengalaman
</Text>
<List>
<Box px={20}>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>2021 - 2027: Perbekel Desa Darmasaba</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>2015 - Sekarang: Founder & Managing Director Mantra
Legal Consultants & Advocates</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>2020 - Sekarang: Founder Ugawa Record Music Studio</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} >2010 - 2016: Dosen Fakultas Hukum Universitas
Mahasaraswati Denpasar</ListItem>
</Box>
</List>
<Text py={10} fz={"h2"} fw={"bold"}>
Pengalaman Organisasi
</Text>
<List>
<Box px={20}>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>1996 - 1997: Ketua OSIS SMP Negeri 1 Abiansemal</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>1999 - 2000: Ketua OSIS SMA Negeri 1 Mengwi</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>2008 - 2009: Ketua BEM Universitas Mahasaraswati Denpasar</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} >2008 - 2010: Ketua Sekaa Taruna Sila Dharma, Banjar Tengah, Desa Adat Tegal, Darmasaba</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} >2020 - Sekarang: Pengurus Young Lawyer Committee Peradi Denpasar</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} >2021 - Sekarang: Dewan Kehormatan Himpunan Pengusaha Muda Indonesia (HIPMI) Badung</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} >2023 - 2028: Komite Tetap Advokasi - Bidang Hukum dan Regulasi Kamar Dagang dan Industri Badung</ListItem>
</Box>
</List>
</Paper>
</Box>
</SimpleGrid>
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Box>
<Text fz={{ base: "1.125rem", md: "1.6rem" }} fw={'bold'}>Biodata</Text>
<Text fz={{ base: "1rem", md: "1.5rem" }} ta={"justify"} dangerouslySetInnerHTML={{ __html: data.biodata }} />
</Box>
<Box>
<Text fz={{ base: "1.125rem", md: "1.6rem" }} fw={'bold'}>Pengalaman</Text>
<Text fz={{ base: "1rem", md: "1.5rem" }} dangerouslySetInnerHTML={{ __html: data.pengalaman }} />
</Box>
</Paper>
</SimpleGrid >
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Text py={10} fz={{ base: "md", md: "h1" }} fw={"bold"} >
Program Kerja Unggulan
</Text>
<Stack>
<Box>
<Text fz={{ base: "md", md: "h3" }} fw={"bold"} ta={"justify"}>
Pemberdayaan Ekonomi dan UMKM
</Text>
<List>
<Box px={10}>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Pelatihan dan pendampingan UMKM lokal</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Program bantuan modal usaha bagi pelaku usaha kecil</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Digitalisasi UMKM untuk meningkatkan pemasaran produk lokal</ListItem>
</Box>
</List>
<Box>
<Text fz={{ base: "1.125rem", md: "1.6rem" }} fw={'bold'}>Pengalaman Organisasi</Text>
<Text fz={{ base: "1rem", md: "1.5rem" }} ta={"justify"} dangerouslySetInnerHTML={{ __html: data.pengalamanOrganisasi }} />
</Box>
<Box pb={20}>
<Text fz={{ base: "1.125rem", md: "1.6rem" }} fw={'bold'}>Program Kerja Unggulan</Text>
<Box px={20}>
<Text fz={{ base: "1rem", md: "1.5rem" }} ta={"justify"} dangerouslySetInnerHTML={{ __html: data.programUnggulan }} />
</Box>
<Box>
<Text fz={{ base: "md", md: "h3" }} fw={"bold"} ta={"justify"}>
Peningkatan Infrastruktur Desa
</Text>
<List>
<Box px={10}>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Pembangunan dan perbaikan jalan desa</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Penyediaan fasilitas umum dan ruang terbuka hijau</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Optimalisasi layanan publik berbasis digital</ListItem>
</Box>
</List>
</Box>
<Box>
<Text fz={{ base: "md", md: "h3" }} fw={"bold"} ta={"justify"}>
Pendidikan dan Pengembangan SDM
</Text>
<List>
<Box px={10}>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Beasiswa pendidikan bagi siswa berprestasi dari keluarga kurang mampu</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Program kursus dan pelatihan kerja bagi pemuda desa</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Peningkatan kualitas pendidikan melalui kerja sama dengan perguruan tinggi</ListItem>
</Box>
</List>
</Box>
<Box>
<Text fz={{ base: "md", md: "h3" }} fw={"bold"} ta={"justify"}>
Pelestarian Budaya dan Pariwisata
</Text>
<List>
<Box px={10}>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Revitalisasi pura dan tempat bersejarah di Darmasaba</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Pengembangan desa wisata berbasis budaya dan seni lokal</ListItem>
<ListItem fz={{ base: "md", md: "h3" }} ta={"justify"}>Festival budaya dan seni sebagai daya tarik wisata</ListItem>
</Box>
</List>
</Box>
</Stack>
</Box>
</Paper>
</Box>
</Box >
);
}

35
src/app/darmasaba/(pages)/desa/profile/ui/sejarahDesa.tsx
View File

@@ -1,7 +1,28 @@
/* eslint-disable react-hooks/exhaustive-deps */
'use client'
import stateProfileDesa from '@/app/admin/(dashboard)/_state/desa/profile';
import colors from '@/con/colors';
import { Box, Center, Image, Paper, Stack, Text } from '@mantine/core';
import { Box, Center, Image, Paper, Skeleton, Stack, Text } from '@mantine/core';
import { useEffect } from 'react';
import { useProxy } from 'valtio/utils';
function SejarahDesa() {
const state = useProxy(stateProfileDesa.sejarahDesa)
useEffect(() => {
state.findUnique.load("edit")
}, [])
const { data, loading } = state.findUnique
if (loading || !data) {
return (
<Box py={10}>
<Skeleton h={500} />
</Box>
)
}
return (
<>
<Box pb={70}>
@@ -12,16 +33,8 @@ function SejarahDesa() {
</Center>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={"2.5rem"}>Sejarah Desa</Text>
</Box>
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Text fz={{ base: "md", md: "h3" }} ta={"justify"}>
Asal –usul nama Darmasaba tertuang dalam lontar Usada Bali. Seperti di tulis dalam monografi Desa Darmasaba tahun 1980 silam, nama Darmasaba berkaitan dengan keturunan Danghyang Nirarta diceritakan, Sang kawi-wiku asal Daha (Jawa Timur) itu memiliki cucu bernama Ida Pedanda Sakti Manuaba yang tigggal di Desa Kendran Tegalalang Gianyar.
</Text>
<Text fz={{ base: "md", md: "h3" }} py={10} ta={"justify"}>
Merasa tidak disenangi sang ayah, Ida Pedanda Sakti Manuaba pergi mengembara bersama dua orang pengiringnya. Pengembaraan sang pendeta sampai di pura Sarin Buana di Jimbaran. Saat mengadakan semedi di tempat ini sang pendeta melihat sinar api. Yang sangat jauh di utara. Timbul keinginan Ida Pedanda Manuaba untuk mengunjungi tempat itu.
</Text>
<Text fz={{ base: "md", md: "h3" }} ta={"justify"}>
Sampailah sang Pedanda di pura Batan Bila Peguyangan. Disini Ida Pedanda Manuaba singgah menghadap Ida Pedanda Budha yang tinggal disana. Selanjutnya, kedua pendeta bersama-sama menuju arah utara dan singgah di Taman Cang Ana, sebuah taman milik Arya Lanang Blusung. Di tempat ini kedua pendeta bersama-sama melaksanakan semedi dan menetap untuk sementara waktu.
</Text>
<Paper p={"xl"} bg={colors['white-trans-1']}>
<Text fz={{ base: "md", md: "h3" }} ta={"justify"} dangerouslySetInnerHTML={{ __html: data.deskripsi }} />
</Paper>
</Stack>

92
src/app/darmasaba/(pages)/desa/profile/ui/semuaPerbekel.tsx
View File

@@ -1,73 +1,25 @@
'use client'
import colors from '@/con/colors';
import { Box, Center, Image, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
const data = [
{
id: 1,
nama: "SI GEDE KANIA",
wilayah: "PERBEKEL TEGAL",
periode: "Tahun 1943 - 1946",
foto: "/api/img/perbekel-1.png"
},
{
id: 2,
nama: "SI GEDE GANDEM",
wilayah: "PERBEKEL TEGAL",
periode: "Tahun 1946 - 1950",
foto: "/api/img/perbekel-2.png"
},
{
id: 3,
nama: "I WAYAN SAMA",
wilayah: "PERBEKEL TEGAL",
periode: "Tahun 1950 - 1953",
foto: "/api/img/perbekel-3.png"
},
{
id: 4,
nama: "I WAYAN NAMBREG",
wilayah: "PERBEKEL DARMASABA",
periode: "Tahun 1950 - 1960",
foto: "/api/img/perbekel-4.png"
},
{
id: 5,
nama: "IDA BAGUS PUTU OKA",
wilayah: "PERBEKEL TEGAL/DARMASABA",
periode: "Tahun 1953 - 1974",
foto: "/api/img/perbekel-5.png"
},
{
id: 6,
nama: "I NYOMAN PATRA",
wilayah: "PERBEKEL DARMASABA",
periode: "Tahun 1974 - 1991",
foto: "/api/img/perbekel-6.png"
},
{
id: 7,
nama: "I MADE RUDJA",
wilayah: "PERBEKEL DARMASABA",
periode: "Tahun 1991 - 2007",
foto: "/api/img/perbekel-7.png"
},
{
id: 8,
nama: "I WAYAN KALER, SH.MH.",
wilayah: "PERBEKEL DARMASABA",
periode: "Tahun 2007 - 2013",
foto: "/api/img/perbekel-8.png"
},
{
id: 9,
nama: "I MADE TARAM, SH.",
wilayah: "PERBEKEL DARMASABA",
periode: "Tahun 2013 - 2019",
foto: "/api/img/perbekel-9.png"
},
]
import { Box, Center, Image, Paper, SimpleGrid, Skeleton, Stack, Text } from '@mantine/core';
import stateProfileDesa from '@/app/admin/(dashboard)/_state/desa/profile';
import { useProxy } from 'valtio/utils';
import { useShallowEffect } from '@mantine/hooks';
function SemuaPerbekel() {
const state = useProxy(stateProfileDesa.mantanPerbekel)
useShallowEffect(() => {
state.findMany.load()
}, [])
const {data, loading} = state.findMany
if (loading || !data) {
return (
<Box py={10}>
<Skeleton h={500} />
</Box>
)
}
return (
<Box pb={50}>
@@ -84,16 +36,16 @@ function SemuaPerbekel() {
{data.map((v, k) => {
return (
<Box key={k}>
<Paper mb={50} radius={26} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Paper h={620} mb={50} radius={26} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Box>
<Center>
<Image src={v.foto} alt='' />
<Image src={v.image?.link} alt='' />
</Center>
</Box>
<Box>
<Stack gap={"sm"} py={10}>
<Text ta={"center"} fw={"bold"} fz={{ base: "h3", md: "h3" }}>{v.nama}</Text>
<Text ta={"center"} fz={{ base: "h5", md: "h4" }}>{v.wilayah}</Text>
<Text ta={"center"} fz={{ base: "h5", md: "h4" }}>{v.daerah}</Text>
<Text ta={"center"} fz={{ base: "h5", md: "h4" }}>{v.periode}</Text>
</Stack>
</Box>

41
src/app/darmasaba/(pages)/desa/profile/ui/visimisiDesa.tsx
View File

@@ -1,8 +1,27 @@
/* eslint-disable react-hooks/exhaustive-deps */
'use client'
import stateProfileDesa from '@/app/admin/(dashboard)/_state/desa/profile';
import colors from '@/con/colors';
import { Box, Stack, Paper, Image, Text, ListItem, List } from '@mantine/core';
import React from 'react';
import { Box, Image, Paper, Skeleton, Stack, Text } from '@mantine/core';
import { useEffect } from 'react';
import { useProxy } from 'valtio/utils';
function VisimisiDesa() {
const state = useProxy(stateProfileDesa.visiMisiDesa)
useEffect(() => {
state.findUnique.load("edit")
}, [])
const { data, loading } = state.findUnique
if (loading || !data) {
return (
<Box py={10}>
<Skeleton h={500} />
</Box>
)
}
return (
<>
<Box pb={30}>
@@ -12,24 +31,12 @@ function VisimisiDesa() {
</Box>
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Text c={colors['blue-button']} ta={"center"} fw={"lighter"} fz={"2.5rem"}>Visi Desa</Text>
<Text fz={"1.5rem"} ta={"center"} fw={"bold"}>
“Mewujudkan Desa Darmasaba yang sejahtera, unggul, religius, berbudaya, dan aman dengan berlandaskan Tri Hita Karana”
</Text>
<Text fz={"1.5rem"} ta={"center"} fw={"bold"} dangerouslySetInnerHTML={{ __html: data.visi }} />
</Paper>
<Paper my={20} p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Text c={colors['blue-button']} ta={"center"} fw={"lighter"} fz={"2.5rem"}>Misi Desa</Text>
<Box >
<List type='ordered'>
<ListItem fz={{ base: "md", md: "h3"}} ta={"justify"}>Memperkokoh kerukunan hidup masyarakat dalam jalinan adat, budaya, olahraga, dan agama.</ListItem>
<ListItem fz={{ base: "md", md: "h3"}} ta={"justify"}>Meningkatkan kualitas pelayanan publik dengan menerapkan teknologi informasi dan komunikasi terintegrasi.</ListItem>
<ListItem fz={{ base: "md", md: "h3"}} ta={"justify"}>Meningkatkan tata kelola pemerintah desa dengan menerapkan prinsip good governance dan good clean goverment.</ListItem>
<ListItem fz={{ base: "md", md: "h3"}} ta={"justify"}>Meningkatkan kualitas pendidikan, kesehatan, Keluarga Berencana serta pengelolaan kependudukan.</ListItem>
<ListItem fz={{ base: "md", md: "h3"}} ta={"justify"}>Memperkuat usaha mikro kecil dan menengah (UMKM) dan BUMDesa sebagai pilar ekonomi masyarakat.</ListItem>
<ListItem fz={{ base: "md", md: "h3"}} ta={"justify"}>Mewujudkan tatanan kehidupan bermasyarakat yang menjunjung tinggi penegakan hukum dan HAM. </ListItem>
<ListItem fz={{ base: "md", md: "h3"}} ta={"justify"}>Meningkatkan perlindungan dan pengelolaan terhadap sumber daya alam dan lingkungan hidup.</ListItem>
<ListItem fz={{ base: "md", md: "h3"}} ta={"justify"}>Memperkuat daya saing desa melalui peningkatan mutu sumber daya manusia dan infrastruktur desa berbasis potensi desa. </ListItem>
<ListItem fz={{ base: "md", md: "h3"}} ta={"justify"}>Meningkatkan sinergisitas potensi budaya, pertanian dalam arti luas dan pariwisata.</ListItem>
</List>
<Box>
<Text fz={"1.5rem"} fw={"bold"} dangerouslySetInnerHTML={{ __html: data.misi }} />
</Box>
</Paper>
</Stack>