Compare commits

...

4 Commits

Author SHA1 Message Date
27bd00e773 Add UI Menu Desa 2025-03-15 15:10:07 +08:00
7d93ba5108 UI Detail Layanan & Detail Penghargaan 2025-03-13 15:48:47 +08:00
cef0c98f1e UI Layanan & Sub Desa Layanan 2025-03-13 00:17:47 +08:00
3324b930ef UI Dashboard Darmasaba 2025-03-12 13:53:46 +08:00
63 changed files with 3498 additions and 196 deletions

BIN
bun.lockb

Binary file not shown.

View File

@@ -18,6 +18,7 @@
"@elysiajs/stream": "^1.1.0",
"@elysiajs/swagger": "^1.2.0",
"@mantine/carousel": "^7.16.2",
"@mantine/charts": "^7.17.1",
"@mantine/core": "^7.16.2",
"@mantine/dropzone": "^7.17.0",
"@mantine/hooks": "^7.16.2",
@@ -45,6 +46,7 @@
"react-dom": "^19.0.0",
"react-simple-toasts": "^6.1.0",
"readdirp": "^4.1.1",
"recharts": "2",
"swr": "^2.3.2",
"valtio": "^2.1.3"
},

View File

@@ -16,3 +16,4 @@ model Potensi {
id String @id @default(cuid())
name String @unique
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 19 KiB

View File

@@ -0,0 +1,36 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Belum Kawin
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
<ListItem fz={"sm"}>Khusus bagi yang berstatus duda atau janda melampirkan fotocopy akta cerai atau dokumen pendukung lainnya</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,36 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Beda Biodata Diri
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
<ListItem fz={"sm"}>Fotocopy dokumen bersangkutan yang terdapat perbedaan biodata diri misal : Sertifikat Tanah/Ijazah/Polis Asuransi dan lainnya.</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,36 @@
import colors from '@/con/colors';
import { Box, Button, Container, Image, List, ListItem, Stack, Text } from '@mantine/core';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Domisili Organisasi
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Surat Keterangan Terdaftar (SKT) organisasi atau Pengukuhan Kelompok</ListItem>
<ListItem fz={"sm"}>Jika Pengajuan baru pembuatan SKT maka melengkapi Susunan Pengurus lengkap dengan Kop Organisasi</ListItem>
<ListItem fz={"sm"}>Tanggal berdiri/Tahun berdiri/Sejak kapan berdirinya organisasi</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt=''/>
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,37 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Kelahiran
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Surat lahir dari dokter/bidan (jika ada)</ListItem>
<ListItem fz={"sm"}>Fotocopy Kartu Keluarga</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP 2 orang saksi</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-kelahiran-removebg-preview.png" alt='' />
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,37 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Kematian
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP atau Kartu keluarga</ListItem>
<ListItem fz={"sm"}>Surat Kematian dari rumah sakit atau dokter (jika ada)</ListItem>
<ListItem fz={"sm"}>Tanggal dan Waktu Kematian</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,36 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Penghasilan
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP orang tua atau Fotocopy Kartu keluarga</ListItem>
<ListItem fz={"sm"}>Membuat Surat Pernyataan Penghasilan bermaterai (disertai jumlah penghasilan)</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,35 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Kelakuan Baik (Pengantar SKCK)
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,37 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Tempat Usaha
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP atau Kartu keluarga</ListItem>
<ListItem fz={"sm"}>Foto Lokasi dan Kegiatan Usaha di cetak dalam selembar kertas (diparaf dan stempel oleh Kelian Banjar Dinas)</ListItem>
<ListItem fz={"sm"}>Surat Perjanjian Sewa/Kontrak atau Kwintansi Pembayaran Sewa 3 bulan terakhir bagi yang mengontrak tempat usaha, apabila tempat usaha milik sendiri lampiri dengan dokumen kepemilikan tempat usaha (dapat berupa fotocopy sppt atau Fotocopy Sertipikat Hak Milik)</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-tempat-usaha-removebg-preview.png" alt='' />
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,38 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Tidak Mampu
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP/KIA atau Kartu Keluarga</ListItem>
<ListItem fz={"sm"}>Fotocopy Kartu Indonesia Pintar/Kartu Perlindungan Sosial/Terdaftar dalam DTKS</ListItem>
<ListItem fz={"sm"}>Jika tidak memiliki Kartu tersebut diatas diwajibkan membuat Surat Pernyataan Tidak Mampu
</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-tidak-mampu-removebg-preview.png" alt='' />
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,36 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton/>
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Usaha
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy KTP atau Kartu keluarga</ListItem>
<ListItem fz={"sm"}>Foto Lokasi dan Kegiatan Usaha di cetak dalam selembar kertas (diparaf dan stempel oleh Kelian Banjar Dinas)</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,35 @@
import colors from '@/con/colors';
import { Stack, Container, List, ListItem, Box, Text, Image, Button } from '@mantine/core';
import React from 'react';
import BackButton from '../../_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} p={"xl"}>
<BackButton />
<Stack gap={0}>
<Text fz={"3.4rem"} ta={"center"} fw={"bold"}>
Surat Keterangan Yatim Piatu
</Text>
<Text fz={"h4"} py={20}>
Persyaratan Dokumen:
</Text>
<List>
<ListItem fz={"sm"}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
<ListItem fz={"sm"}>Fotocopy Ktp, KIA atau Kartu Keluarga</ListItem>
</List>
<Box py={20}>
<Text fz={"h4"} py={20}>
Alur Pelayanan:
</Text>
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
</Box>
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
</Stack>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,245 @@
'use client'
import colors from "@/con/colors";
import { ActionIcon, BackgroundImage, Box, Button, Container, Divider, Flex, Group, List, ListItem, SimpleGrid, Stack, Stepper, StepperCompleted, StepperStep, Text, TextInput } from "@mantine/core";
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp, IconSearch } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import BackButton from "./_com/BackButto";
const data = [
{
id: 1,
images: "/api/img/test.png",
name: "Surat Keterangan Domisili Organisasi",
link: "/darmasaba/desa/layanan/domisili"
},
{
id: 2,
images: "/api/img/test-3.jpeg",
name: "Surat Keterangan Penghasilan",
link: "/darmasaba/desa/layanan/penghasilan"
},
{
id: 3,
images: "/api/img/domisili.jpeg",
name: "Surat Keterangan Tidak Mampu",
link: "/darmasaba/desa/layanan/tidakmampu"
},
{
id: 4,
images: "/api/img/kelahiran.jpeg",
name: "Surat Keterangan Kelahiran",
link: "/darmasaba/desa/layanan/kelahiran"
},
{
id: 5,
images: "/api/img/keterangan-usaha.jpeg",
name: "Surat Keterangan Usaha",
link: "/darmasaba/desa/layanan/usaha"
},
{
id: 6,
images: "/api/img/kematian.jpeg",
name: "Surat Keterangan Kematian",
link: "/darmasaba/desa/layanan/kematian"
},
{
id: 7,
images: "/api/img/tempatusaha.jpeg",
name: "Surat Keterangan Tempat Usaha",
link: "/darmasaba/desa/layanan/tempatusaha"
},
{
id: 8,
images: "/api/img/belumkawin.jpeg",
name: "Surat Keterangan Belum Kawin",
link: "/darmasaba/desa/layanan/belumkawin"
},
{
id: 9,
images: "/api/img/berkelakuan-baik.jpeg",
name: "Surat Keterangan Kelakuan Baik",
link: "/darmasaba/desa/layanan/skck"
},
{
id: 10,
images: "/api/img/biodata.jpeg",
name: "Surat Keterangan Beda Biodata Diri",
link: "/darmasaba/desa/layanan/biodata"
},
{
id: 11,
images: "/api/img/yatim.jpeg",
name: "Surat Keterangan Yatim Piatu",
link: "/darmasaba/desa/layanan/yatim"
}
]
export default function Page() {
const router = useRouter()
const [active, setActive] = useState(1);
const nextStep = () => setActive((current) => (current < 6 ? current + 1 : current));
const prevStep = () => setActive((current) => (current > 0 ? current - 1 : current));
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton/>
<Stack align="center" gap={0}>
{/* Bagian Layanan */}
<Text fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Layanan Desa Darmasaba
</Text>
<Text
>
Informasi dan Pelayanan Administrasi Digital
</Text>
<TextInput
py={20}
w={{ base: "70%", md: "50%" }}
placeholder="Cari Layanan"
leftSection={<IconSearch size={20} />}
/>
</Stack>
{/* Bagian Pelayanan Surat Keterangan */}
<Box py={10}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Surat Keterangan</Text>
</Box>
<SimpleGrid
py={20}
cols={{
base: 1,
sm: 3
}}
>
{data.map((v, k) => {
return (
<BackgroundImage
key={k}
src={v.images}
h={250}
radius={16}
pos={"relative"}
>
<Box
style={{
borderRadius: 16,
zIndex: 0
}}
pos={"absolute"}
w={"100%"}
h={"100%"}
bg={colors.trans.dark[2]}
/>
<Stack justify='space-between' h={"100%"} gap={0} p={"lg"} pos={"relative"}>
<Box p={"lg"}>
<Text
c={"white"}
size={"1.5rem"}
style={{
textAlign: "center",
}}>{v.name}</Text>
</Box>
<Group justify="center">
<Button px={20} radius={"100"} size="md" bg={colors["blue-button"]}
onClick={() => router.push(v.link)}>
Detail
</Button>
</Group>
</Stack>
</BackgroundImage>
)
})}
</SimpleGrid>
{/* Bagian Pelayanan Perizinan Berusaha */}
<Box py={15}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Perizinan Berusaha Berbasis Risiko Melalui Sistem ONLINE SINGLE SUBMISSION (OSS)</Text>
</Box>
<Text py={10} ta={"justify"} fz={"sm"}>Penyelenggaraan Perizinan Berusaha Berbasis Risiko melalui Sistem Online Single Submission (OSS)
merupakan pelaksanaan Undang-Undang Nomor 11 Tahun 2020 Tentang Cipta Kerja. OSS Berbasis Risiko wajib digunakan oleh Pelaku Usaha,
Kementerian/Lembaga, Pemerintah Daerah, Administrator Kawasan Ekonomi Khusus (KEK), dan Badan Pengusahaan Kawasan Perdagangan Bebas
Pelabuhan Bebas (KPBPB).Berdasarkan Peraturan Pemerintah Nomor 5 Tahun 2021 terdapat 1.702 kegiatan usaha yang terdiri atas 1.349
Klasifikasi Baku Lapangan Usaha Indonesia (KBLI) yang sudah diimplementasikan dalam Sistem OSS Berbasis Risiko.</Text>
<Text py={10} fz={"sm"}>Proses pendaftaran NIB melalui OSS mencakup beberapa langkah umum, seperti:</Text>
<Box p={"xl"} w={{ base: "100%", md: "100%" }} >
<Stepper active={active} onStepClick={setActive} orientation="vertical"
styles={{
separator: {
marginLeft: 25
},
step: {
padding: '12px 0'
}
}}>
<StepperStep label="Langkah Pertama" description="Pendaftaran Akun">
Pendaftaran akun pada portal OSS
</StepperStep>
<StepperStep label="Langkah Kedua" description="Pengisian Data Perusahaan">
Mengisi informasi perusahaan, termasuk data pemegang saham, alamat perusahaan, dan lainnya
</StepperStep>
<StepperStep label="Langkah Ketiga" description="Pemilihan KBLI ">
Memilih KBLI dengan jenis usaha yang akan didaftarkan
</StepperStep>
<StepperStep label="Langkah Keempat" description="Pengunggahan Dokumen">
Mengunggah dokumen-dokumen yang diperlukan, seperti akta pendirian perusahaan, surat izin usaha, dan dokumen lainnya sesuai dengan ketentuan yang berlaku
</StepperStep>
<StepperStep label="Langkah Kelima" description="Verifikasi dan Persetujuan">
Proses verifikasi dan persetujuan oleh instansi terkait
</StepperStep>
<StepperStep label="Langkah Keenam" description="Penerimaan NIB">
Jika proses sebelumnya berhasil, perusahaan akan menerima NIB sebagai identitas resmi usaha anda
</StepperStep>
<StepperCompleted>
Selesai, anda telah mengikuti proses pendaftaran NIB melalui OSS
</StepperCompleted>
</Stepper>
<Group justify="center" mt="xl">
<Button variant="default" onClick={prevStep}>Back</Button>
<Button onClick={nextStep}>Next step</Button>
</Group>
<Text py={35} ta={"justify"} fz={"sm"}>Penting untuk diingat bahwa prosedur dan persyaratan dapat berubah
seiring waktu. Untuk informasi yang lebih akurat dan terkini, saya sarankan untuk mengunjungi situs
resmi OSS <a href={"https://oss.go.id/"}>(https://oss.go.id/)</a> atau menghubungi instansi terkait di pemerintah Indonesia yang bertanggung jawab atas urusan perizinan usaha.</Text>
</Box>
{/* Bagian Pelayanan Telunjuk Sakti Desa */}
<Box py={15}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Telunjuk Sakti Desa</Text>
</Box>
<Text fz={"sm"} py={10}>Terwujudnya Layanan umum bertajuk Sistim administrasi Kependudukan Terintegrasi di Desa berbasi Elektronik, Smart dan Aman. layanan telunjuk sakti Desa meliputi :</Text>
<List type="ordered" pb={20}>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Kelahiran (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20KELAHIRAN_(dengan%20contoh%20Formulir).pdf">Akta Kelahiran</a>)</ListItem>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Perkawinan (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20PERKAWINAN_(dengan%20contoh%20Formulir).pdf">Akta Perkawinan</a>)</ListItem>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Kematian (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20KEMATIAN_(dengan%20contoh%20Formulir).pdf">Akata Kematian</a>)</ListItem>
</List>
{/* Bagian Pelayanan Telunjuk Sakti Desa */}
<Box py={15}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Penduduk Non-Permanent</Text>
</Box>
<Text pb={20} fz={"sm"} ta={"justify"}>Surat Keterangan Penduduk Non-Permanent adalah dokumen yang dikeluarkan oleh pihak berwenang untuk memberikan keterangan bahwa seseorang atau kelompok orang memiliki status penduduk non-permanent di suatu wilayah. Dokumen ini biasanya digunakan untuk keperluan administratif atau legal, seperti mendapatkan akses ke layanan kesehatan, pendidikan, atau pelayanan publik lainnya.</Text>
<Divider color={colors["blue-button"]}/>
<Flex justify={"space-between"} py={20}>
<Text fz={"sm"}>25 May 2021 . Darmasaba</Text>
<Box>
<Flex gap={"lg"}>
<ActionIcon variant='transparent'>
<IconBrandFacebook color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandInstagram color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandTwitter color={colors["blue-button"]} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandWhatsapp color={colors["blue-button"]} size={"30"} />
</ActionIcon>
</Flex>
</Box>
</Flex>
<Divider color={colors["blue-button"]} pb={50} />
</Container>
</Stack>
)
}

View File

@@ -0,0 +1,245 @@
'use client'
import colors from "@/con/colors";
import { ActionIcon, BackgroundImage, Box, Button, Container, Divider, Flex, Group, List, ListItem, SimpleGrid, Stack, Stepper, StepperCompleted, StepperStep, Text, TextInput } from "@mantine/core";
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp, IconSearch } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import BackButton from "./_com/BackButto";
const data = [
{
id: 1,
images: "/api/img/test.png",
name: "Surat Keterangan Domisili Organisasi",
link: "/darmasaba/desa/layanan/domisili"
},
{
id: 2,
images: "/api/img/test-3.jpeg",
name: "Surat Keterangan Penghasilan",
link: "/darmasaba/desa/layanan/penghasilan"
},
{
id: 3,
images: "/api/img/domisili.jpeg",
name: "Surat Keterangan Tidak Mampu",
link: "/darmasaba/desa/layanan/tidakmampu"
},
{
id: 4,
images: "/api/img/kelahiran.jpeg",
name: "Surat Keterangan Kelahiran",
link: "/darmasaba/desa/layanan/kelahiran"
},
{
id: 5,
images: "/api/img/keterangan-usaha.jpeg",
name: "Surat Keterangan Usaha",
link: "/darmasaba/desa/layanan/usaha"
},
{
id: 6,
images: "/api/img/kematian.jpeg",
name: "Surat Keterangan Kematian",
link: "/darmasaba/desa/layanan/kematian"
},
{
id: 7,
images: "/api/img/tempatusaha.jpeg",
name: "Surat Keterangan Tempat Usaha",
link: "/darmasaba/desa/layanan/tempatusaha"
},
{
id: 8,
images: "/api/img/belumkawin.jpeg",
name: "Surat Keterangan Belum Kawin",
link: "/darmasaba/desa/layanan/belumkawin"
},
{
id: 9,
images: "/api/img/berkelakuan-baik.jpeg",
name: "Surat Keterangan Kelakuan Baik",
link: "/darmasaba/desa/layanan/skck"
},
{
id: 10,
images: "/api/img/biodata.jpeg",
name: "Surat Keterangan Beda Biodata Diri",
link: "/darmasaba/desa/layanan/biodata"
},
{
id: 11,
images: "/api/img/yatim.jpeg",
name: "Surat Keterangan Yatim Piatu",
link: "/darmasaba/desa/layanan/yatim"
}
]
export default function Page() {
const router = useRouter()
const [active, setActive] = useState(1);
const nextStep = () => setActive((current) => (current < 6 ? current + 1 : current));
const prevStep = () => setActive((current) => (current > 0 ? current - 1 : current));
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton/>
<Stack align="center" gap={0}>
{/* Bagian Layanan */}
<Text fz={"3.4rem"} fw={"bold"}>
Layanan Desa Darmasaba
</Text>
<Text
>
Informasi dan Pelayanan Administrasi Digital
</Text>
<TextInput
py={20}
w={{ base: "70%", md: "50%" }}
placeholder="Cari Layanan"
leftSection={<IconSearch size={20} />}
/>
</Stack>
{/* Bagian Pelayanan Surat Keterangan */}
<Box py={10}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Surat Keterangan</Text>
</Box>
<SimpleGrid
py={20}
cols={{
base: 1,
sm: 3
}}
>
{data.map((v, k) => {
return (
<BackgroundImage
key={k}
src={v.images}
h={250}
radius={16}
pos={"relative"}
>
<Box
style={{
borderRadius: 16,
zIndex: 0
}}
pos={"absolute"}
w={"100%"}
h={"100%"}
bg={colors.trans.dark[2]}
/>
<Stack justify='space-between' h={"100%"} gap={0} p={"lg"} pos={"relative"}>
<Box p={"lg"}>
<Text
c={"white"}
size={"1.5rem"}
style={{
textAlign: "center",
}}>{v.name}</Text>
</Box>
<Group justify="center">
<Button px={20} radius={"100"} size="md" bg={colors["blue-button"]}
onClick={() => router.push(v.link)}>
Detail
</Button>
</Group>
</Stack>
</BackgroundImage>
)
})}
</SimpleGrid>
{/* Bagian Pelayanan Perizinan Berusaha */}
<Box py={15}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Perizinan Berusaha Berbasis Risiko Melalui Sistem ONLINE SINGLE SUBMISSION (OSS)</Text>
</Box>
<Text py={10} ta={"justify"} fz={"sm"}>Penyelenggaraan Perizinan Berusaha Berbasis Risiko melalui Sistem Online Single Submission (OSS)
merupakan pelaksanaan Undang-Undang Nomor 11 Tahun 2020 Tentang Cipta Kerja. OSS Berbasis Risiko wajib digunakan oleh Pelaku Usaha,
Kementerian/Lembaga, Pemerintah Daerah, Administrator Kawasan Ekonomi Khusus (KEK), dan Badan Pengusahaan Kawasan Perdagangan Bebas
Pelabuhan Bebas (KPBPB).Berdasarkan Peraturan Pemerintah Nomor 5 Tahun 2021 terdapat 1.702 kegiatan usaha yang terdiri atas 1.349
Klasifikasi Baku Lapangan Usaha Indonesia (KBLI) yang sudah diimplementasikan dalam Sistem OSS Berbasis Risiko.</Text>
<Text py={10} fz={"sm"}>Proses pendaftaran NIB melalui OSS mencakup beberapa langkah umum, seperti:</Text>
<Box p={"xl"} w={{ base: "100%", md: "100%" }} >
<Stepper active={active} onStepClick={setActive} orientation="vertical"
styles={{
separator: {
marginLeft: 25
},
step: {
padding: '12px 0'
}
}}>
<StepperStep label="Langkah Pertama" description="Pendaftaran Akun">
Pendaftaran akun pada portal OSS
</StepperStep>
<StepperStep label="Langkah Kedua" description="Pengisian Data Perusahaan">
Mengisi informasi perusahaan, termasuk data pemegang saham, alamat perusahaan, dan lainnya
</StepperStep>
<StepperStep label="Langkah Ketiga" description="Pemilihan KBLI ">
Memilih KBLI dengan jenis usaha yang akan didaftarkan
</StepperStep>
<StepperStep label="Langkah Keempat" description="Pengunggahan Dokumen">
Mengunggah dokumen-dokumen yang diperlukan, seperti akta pendirian perusahaan, surat izin usaha, dan dokumen lainnya sesuai dengan ketentuan yang berlaku
</StepperStep>
<StepperStep label="Langkah Kelima" description="Verifikasi dan Persetujuan">
Proses verifikasi dan persetujuan oleh instansi terkait
</StepperStep>
<StepperStep label="Langkah Keenam" description="Penerimaan NIB">
Jika proses sebelumnya berhasil, perusahaan akan menerima NIB sebagai identitas resmi usaha anda
</StepperStep>
<StepperCompleted>
Selesai, anda telah mengikuti proses pendaftaran NIB melalui OSS
</StepperCompleted>
</Stepper>
<Group justify="center" mt="xl">
<Button variant="default" onClick={prevStep}>Back</Button>
<Button onClick={nextStep}>Next step</Button>
</Group>
<Text py={35} ta={"justify"} fz={"sm"}>Penting untuk diingat bahwa prosedur dan persyaratan dapat berubah
seiring waktu. Untuk informasi yang lebih akurat dan terkini, saya sarankan untuk mengunjungi situs
resmi OSS <a href={"https://oss.go.id/"}>(https://oss.go.id/)</a> atau menghubungi instansi terkait di pemerintah Indonesia yang bertanggung jawab atas urusan perizinan usaha.</Text>
</Box>
{/* Bagian Pelayanan Telunjuk Sakti Desa */}
<Box py={15}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Telunjuk Sakti Desa</Text>
</Box>
<Text fz={"sm"} py={10}>Terwujudnya Layanan umum bertajuk Sistim administrasi Kependudukan Terintegrasi di Desa berbasi Elektronik, Smart dan Aman. layanan telunjuk sakti Desa meliputi :</Text>
<List type="ordered" pb={20}>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Kelahiran (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20KELAHIRAN_(dengan%20contoh%20Formulir).pdf">Akta Kelahiran</a>)</ListItem>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Perkawinan (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20PERKAWINAN_(dengan%20contoh%20Formulir).pdf">Akta Perkawinan</a>)</ListItem>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Kematian (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20KEMATIAN_(dengan%20contoh%20Formulir).pdf">Akata Kematian</a>)</ListItem>
</List>
{/* Bagian Pelayanan Telunjuk Sakti Desa */}
<Box py={15}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Penduduk Non-Permanent</Text>
</Box>
<Text pb={20} fz={"sm"} ta={"justify"}>Surat Keterangan Penduduk Non-Permanent adalah dokumen yang dikeluarkan oleh pihak berwenang untuk memberikan keterangan bahwa seseorang atau kelompok orang memiliki status penduduk non-permanent di suatu wilayah. Dokumen ini biasanya digunakan untuk keperluan administratif atau legal, seperti mendapatkan akses ke layanan kesehatan, pendidikan, atau pelayanan publik lainnya.</Text>
<Divider />
<Flex justify={"space-between"} py={20}>
<Text fz={"sm"}>25 May 2021 . Darmasaba</Text>
<Box>
<Flex gap={"lg"}>
<ActionIcon variant='transparent'>
<IconBrandFacebook color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandInstagram color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandTwitter color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandWhatsapp color={"gray"} size={"30"} />
</ActionIcon>
</Flex>
</Box>
</Flex>
<Divider pb={50} />
</Container>
</Stack>
)
}

View File

@@ -0,0 +1,236 @@
'use client'
import colors from "@/con/colors";
import { ActionIcon, Box, Button, Container, Divider, Flex, Group, Image, List, ListItem, Modal, Paper, SimpleGrid, Stack, Stepper, StepperCompleted, StepperStep, Text, TextInput } from "@mantine/core";
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp, IconSearch } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import BackButton from "./_com/BackButto";
import { useDisclosure } from "@mantine/hooks";
const data = [
{
id: 1,
name: "Surat Keterangan Domisili Organisasi",
link: "/darmasaba/desa/layanan/domisili"
},
{
id: 2,
name: "Surat Keterangan Penghasilan",
link: "/darmasaba/desa/layanan/penghasilan"
},
{
id: 3,
name: "Surat Keterangan Tidak Mampu",
link: "/darmasaba/desa/layanan/tidakmampu"
},
{
id: 4,
name: "Surat Keterangan Kelahiran",
link: "/darmasaba/desa/layanan/kelahiran"
},
{
id: 5,
name: "Surat Keterangan Usaha",
link: "/darmasaba/desa/layanan/usaha"
},
{
id: 6,
name: "Surat Keterangan Kematian",
link: "/darmasaba/desa/layanan/kematian"
},
{
id: 7,
name: "Surat Keterangan Tempat Usaha",
link: "/darmasaba/desa/layanan/tempatusaha"
},
{
id: 8,
name: "Surat Keterangan Belum Kawin",
link: "/darmasaba/desa/layanan/belumkawin"
},
{
id: 9,
name: "Surat Keterangan Kelakuan Baik",
link: "/darmasaba/desa/layanan/skck"
},
{
id: 10,
name: "Surat Keterangan Beda Biodata Diri",
link: "/darmasaba/desa/layanan/biodata"
},
{
id: 11,
name: "Surat Keterangan Yatim Piatu",
link: "/darmasaba/desa/layanan/yatim"
}
]
export default function Page() {
const [opened, { open, close }] = useDisclosure(false);
const router = useRouter()
const [active, setActive] = useState(1);
const nextStep = () => setActive((current) => (current < 6 ? current + 1 : current));
const prevStep = () => setActive((current) => (current > 0 ? current - 1 : current));
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Stack align="center" gap={0}>
{/* Bagian Layanan */}
<Text fz={"3.4rem"} fw={"bold"}>
Layanan Desa Darmasaba
</Text>
<Text
>
Informasi dan Pelayanan Administrasi Digital
</Text>
<TextInput
py={20}
w={{ base: "70%", md: "50%" }}
placeholder="Cari Layanan"
leftSection={<IconSearch size={20} />}
/>
</Stack>
{/* Bagian Pelayanan Surat Keterangan */}
<Box py={10}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Surat Keterangan</Text>
</Box>
<SimpleGrid
py={20}
cols={{
base: 1,
sm: 1
}}
>
{data.map((v, k) => {
return (
<Paper
key={k}
radius={16}
pos={"relative"}
>
<Stack gap={0} p={"lg"} pos={"relative"}>
<Flex justify={"space-between"} align={"center"} px={10}>
<Box>
<Flex p={"lg"} align={"center"} gap={"lg"}>
<Paper p={10} bg={colors.Bg} radius={"100%"}>
<Image src="/api/img/icondocument.png" alt="" w={30} h={30} />
</Paper>
<Text size={"1.5rem"}>{v.name}</Text>
</Flex>
</Box>
<ActionIcon size={"lg"} variant="transparent" onClick={open}>
<Image src="/api/img/arrowicon.png" alt="" w={30} h={30} />
</ActionIcon>
</Flex>
{/* <Group justify="center">
<Button px={20} radius={"100"} size="md" bg={colors["blue-button"]}
onClick={() => router.push(v.link)}>
Detail
</Button>
</Group> */}
</Stack>
</Paper>
)
})}
<Modal opened={opened} onClose={close} size={"xl"} title="Persyaratan">
<Text fz={"sm"}>Test</Text>
</Modal>
</SimpleGrid>
{/* Bagian Pelayanan Perizinan Berusaha */}
<Box py={15}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Perizinan Berusaha Berbasis Risiko Melalui Sistem ONLINE SINGLE SUBMISSION (OSS)</Text>
</Box>
<Text py={10} ta={"justify"} fz={"sm"}>Penyelenggaraan Perizinan Berusaha Berbasis Risiko melalui Sistem Online Single Submission (OSS)
merupakan pelaksanaan Undang-Undang Nomor 11 Tahun 2020 Tentang Cipta Kerja. OSS Berbasis Risiko wajib digunakan oleh Pelaku Usaha,
Kementerian/Lembaga, Pemerintah Daerah, Administrator Kawasan Ekonomi Khusus (KEK), dan Badan Pengusahaan Kawasan Perdagangan Bebas
Pelabuhan Bebas (KPBPB).Berdasarkan Peraturan Pemerintah Nomor 5 Tahun 2021 terdapat 1.702 kegiatan usaha yang terdiri atas 1.349
Klasifikasi Baku Lapangan Usaha Indonesia (KBLI) yang sudah diimplementasikan dalam Sistem OSS Berbasis Risiko.</Text>
<Text py={10} fz={"sm"}>Proses pendaftaran NIB melalui OSS mencakup beberapa langkah umum, seperti:</Text>
<Box p={"xl"} w={{ base: "100%", md: "100%" }} >
<Stepper active={active} onStepClick={setActive} orientation="vertical"
styles={{
separator: {
marginLeft: 25
},
step: {
padding: '12px 0'
}
}}>
<StepperStep label="Langkah Pertama" description="Pendaftaran Akun">
Pendaftaran akun pada portal OSS
</StepperStep>
<StepperStep label="Langkah Kedua" description="Pengisian Data Perusahaan">
Mengisi informasi perusahaan, termasuk data pemegang saham, alamat perusahaan, dan lainnya
</StepperStep>
<StepperStep label="Langkah Ketiga" description="Pemilihan KBLI ">
Memilih KBLI dengan jenis usaha yang akan didaftarkan
</StepperStep>
<StepperStep label="Langkah Keempat" description="Pengunggahan Dokumen">
Mengunggah dokumen-dokumen yang diperlukan, seperti akta pendirian perusahaan, surat izin usaha, dan dokumen lainnya sesuai dengan ketentuan yang berlaku
</StepperStep>
<StepperStep label="Langkah Kelima" description="Verifikasi dan Persetujuan">
Proses verifikasi dan persetujuan oleh instansi terkait
</StepperStep>
<StepperStep label="Langkah Keenam" description="Penerimaan NIB">
Jika proses sebelumnya berhasil, perusahaan akan menerima NIB sebagai identitas resmi usaha anda
</StepperStep>
<StepperCompleted>
Selesai, anda telah mengikuti proses pendaftaran NIB melalui OSS
</StepperCompleted>
</Stepper>
<Group justify="center" mt="xl">
<Button variant="default" onClick={prevStep}>Back</Button>
<Button onClick={nextStep}>Next step</Button>
</Group>
<Text py={35} ta={"justify"} fz={"sm"}>Penting untuk diingat bahwa prosedur dan persyaratan dapat berubah
seiring waktu. Untuk informasi yang lebih akurat dan terkini, saya sarankan untuk mengunjungi situs
resmi OSS <a href={"https://oss.go.id/"}>(https://oss.go.id/)</a> atau menghubungi instansi terkait di pemerintah Indonesia yang bertanggung jawab atas urusan perizinan usaha.</Text>
</Box>
{/* Bagian Pelayanan Telunjuk Sakti Desa */}
<Box py={15}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Telunjuk Sakti Desa</Text>
</Box>
<Text fz={"sm"} py={10}>Terwujudnya Layanan umum bertajuk Sistim administrasi Kependudukan Terintegrasi di Desa berbasi Elektronik, Smart dan Aman. layanan telunjuk sakti Desa meliputi :</Text>
<List type="ordered" pb={20}>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Kelahiran (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20KELAHIRAN_(dengan%20contoh%20Formulir).pdf">Akta Kelahiran</a>)</ListItem>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Perkawinan (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20PERKAWINAN_(dengan%20contoh%20Formulir).pdf">Akta Perkawinan</a>)</ListItem>
<ListItem fz={"sm"}>Telunjuk Sakti Desa Akta Kematian (Petunjuk Pengajuan pada link berikut : Download <a href="https://darmasaba.desa.id/storage/files/PERSYARATAN%20DAN%20ALUR%20PENGAJUAN%20AKTA%20KEMATIAN_(dengan%20contoh%20Formulir).pdf">Akata Kematian</a>)</ListItem>
</List>
{/* Bagian Pelayanan Telunjuk Sakti Desa */}
<Box py={15}>
<Text fz={"h4"} fw={"bold"}>Pelayanan Penduduk Non-Permanent</Text>
</Box>
<Text pb={20} fz={"sm"} ta={"justify"}>Surat Keterangan Penduduk Non-Permanent adalah dokumen yang dikeluarkan oleh pihak berwenang untuk memberikan keterangan bahwa seseorang atau kelompok orang memiliki status penduduk non-permanent di suatu wilayah. Dokumen ini biasanya digunakan untuk keperluan administratif atau legal, seperti mendapatkan akses ke layanan kesehatan, pendidikan, atau pelayanan publik lainnya.</Text>
<Divider />
<Flex justify={"space-between"} py={20}>
<Text fz={"sm"}>25 May 2021 . Darmasaba</Text>
<Box>
<Flex gap={"lg"}>
<ActionIcon variant='transparent'>
<IconBrandFacebook color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandInstagram color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandTwitter color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandWhatsapp color={"gray"} size={"30"} />
</ActionIcon>
</Flex>
</Box>
</Flex>
<Divider pb={50} />
</Container>
</Stack>
)
}
function ModalDetail() {
}

View File

@@ -1,7 +1,32 @@
import { Stack } from "@mantine/core";
import colors from "@/con/colors";
import { Container, Image, Stack, Text } from "@mantine/core";
import BackButton from "./layanan/_com/BackButto";
export default function Page() {
return <Stack>
desa
return <Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"}>
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Desa Darmasaba
</Text>
<Text
fw={"bold"}
fz={"1.8rem"}
>
&quot;Dharma Temaja&quot;
</Text>
</Stack>
<Image py={20} src="/api/img/darmasaba.jpeg" w={"100%"} h={"50%"} alt="" />
<Text fz={"sm"} ta={"justify"}>
Desa Darmasaba adalah desa yang terletak di Kecamatan Abiansemal, Kabupaten Badung, Provinsi Bali. Desa ini merupakan wilayah paling selatan di Kecamatan Abiansemal.
</Text>
<Text py={20} fz={"sm"} ta={"justify"}>
Sejarah Singkat: Nama &quot;Darmasaba&quot; memiliki kaitan dengan keturunan Danghyang Nirarta, seorang kawi-wiku asal Daha (Jawa Timur). Cucunya, Ida Pedanda Sakti Manuaba, tinggal di Desa Kendran, Tegalalang, Gianyar.
</Text>
<Text fz={"sm"} ta={"justify"}>
Pemerintahan Desa: Perbekel (Kepala Desa) Darmasaba saat ini adalah I.B. Surya Prabhawa Manuaba, S.H.,M.H.,NL.P. Struktur pemerintahan desa terdiri dari sekretaris desa, kepala urusan, kepala seksi, dan kepala dusun yang bertugas mengelola berbagai aspek administrasi dan pelayanan masyarakat.
</Text>
</Container>
</Stack>
}

View File

@@ -0,0 +1,51 @@
import colors from '@/con/colors';
import { Stack, Container, Box, List, ListItem, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} >
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Bumdes Pudak Mesari
</Text>
<Text
ta={"center"}
fw={"bold"}
>
Informasi dan Pelayanan Administrasi Digital
</Text>
</Box>
<Image src="/api/img/ack.png" alt='' w={"100%"} />
<Text py={20} fz={"sm"} ta={"justify"}>
Badan Usaha Milik Desa (BUMDes) Pudak Mesari adalah lembaga ekonomi desa yang berperan penting dalam pengembangan potensi dan kesejahteraan masyarakat Desa Darmasaba, Kecamatan Abiansemal, Kabupaten Badung, Bali. BUMDes ini berfungsi sebagai motor penggerak perekonomian desa melalui berbagai unit usaha yang dikelola secara profesional.
</Text>
<Text fz={"sm"} ta={"justify"}>
Potensi dan Peran BUMDes Pudak Mesari:
</Text>
<List py={20} type='ordered'>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pengembangan Usaha Mikro dan Kecil:</Text>BUMDes Pudak Mesari menyediakan layanan bagi pelaku usaha mikro dan kecil di desa, seperti penyediaan konsumsi dan snack kotak untuk berbagai acara.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pengelolaan Sampah Berbasis Masyarakat:</Text>Melalui kolaborasi dengan komunitas pemuda peduli lingkungan, BUMDes Pudak Mesari aktif dalam pengelolaan sampah berbasis masyarakat.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Peningkatan Kapasitas dan Transparansi:</Text>Untuk memastikan pengelolaan yang akuntabel, BUMDes Pudak Mesari rutin mengadakan rapat koordinasi dan pendampingan penyusunan laporan pertanggungjawaban.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Kolaborasi Internasional:</Text>Desa Darmasaba, melalui BUMDes Pudak Mesari, menerima kunjungan dari tim Osaki Jepang untuk memperkuat pengelolaan sampah dan lingkungan.
</ListItem>
</List>
<Text fz={"sm"} ta={"justify"}>
Dengan berbagai inisiatif tersebut, BUMDes Pudak Mesari menunjukkan perannya sebagai pilar utama dalam pengembangan ekonomi dan kesejahteraan masyarakat Desa Darmasaba, sekaligus menjaga kelestarian lingkungan melalui program-program inovatif dan kolaboratif.
</Text>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,54 @@
import colors from '@/con/colors';
import { Stack, Container, Box, List, ListItem, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} >
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Gumuh Sari Waterpark
</Text>
<Text
ta={"center"}
fw={"bold"}
>
Informasi dan Pelayanan Administrasi Digital
</Text>
</Box>
<Image src="/api/img/waterpark.png" alt='' w={"100%"} h={400} />
<Text py={20} fz={"sm"} ta={"justify"}>
Gumuh Sari Waterpark, terletak di Jl. Tegal Gumuh No. 9, Desa Darmasaba, Kecamatan Abiansemal, Kabupaten Badung, Bali, adalah destinasi rekreasi yang menawarkan berbagai fasilitas untuk pengunjung dari segala usia. Taman rekreasi ini tidak hanya menyediakan wahana air yang menyenangkan, tetapi juga fasilitas olahraga dan kuliner, menjadikannya tempat ideal untuk rekreasi keluarga dan komunitas.
</Text>
<Text fz={"sm"} ta={"justify"}>
Potensi Desa melalui Gumuh Sari Waterpark:
</Text>
<List py={20} type='ordered'>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pengembangan Pariwisata Lokal:</Text> Dengan adanya destinasi seperti Gumuh Sari Waterpark, Desa Darmasaba dapat menarik lebih banyak wisatawan lokal maupun mancanegara. Kehadiran pengunjung ini berpotensi meningkatkan pendapatan desa dan membuka peluang usaha baru bagi masyarakat setempat.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Peningkatan Ekonomi Masyarakat:</Text>Fasilitas seperti restoran dan pusat olahraga di dalam kompleks waterpark memberikan peluang bagi warga lokal untuk terlibat dalam sektor jasa dan perdagangan. Hal ini dapat menciptakan lapangan pekerjaan dan mendukung pertumbuhan ekonomi desa.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pengembangan Fasilitas Olahraga dan Kesehatan:</Text>Dengan adanya pusat futsal dan gym, Gumuh Sari Waterpark mendorong masyarakat untuk berpartisipasi dalam kegiatan olahraga, yang dapat meningkatkan kesehatan dan kesejahteraan warga.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pemberdayaan Komunitas Melalui Event dan Acara:</Text>Waterpark ini sering menjadi tuan rumah berbagai acara komunitas, seperti pesta busa dan bola, yang dapat mempererat hubungan antarwarga dan menciptakan lingkungan yang harmonis.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Peningkatan Infrastruktur dan Aksesibilitas:</Text>Dengan meningkatnya jumlah pengunjung, infrastruktur desa seperti jalan, transportasi, dan layanan umum lainnya akan berkembang untuk memenuhi kebutuhan tersebut, yang pada gilirannya meningkatkan kualitas hidup masyarakat setempat.
</ListItem>
</List>
<Text fz={"sm"} ta={"justify"}>
Melalui pengelolaan dan pengembangan yang tepat, Gumuh Sari Waterpark dapat menjadi motor penggerak bagi kemajuan Desa Darmasaba, meningkatkan kesejahteraan masyarakat, dan menjadikan desa ini sebagai destinasi wisata yang dikenal luas.
</Text>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,59 @@
import colors from '@/con/colors';
import { Stack, Container, Box, List, ListItem, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} >
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Kawasan Kuliner
</Text>
<Text
ta={"center"}
fw={"bold"}
>
Informasi dan Pelayanan Administrasi Digital
</Text>
</Box>
<Image src="/api/img/warungumkm.jpg" alt='' w={"100%"} h={400} />
<Text py={20} fz={"sm"} ta={"justify"}>
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, Bali, memiliki potensi besar dalam sektor kuliner. Sebagai desa yang strategis dan terus berkembang, Darmasaba mulai dikenal sebagai destinasi kuliner yang menawarkan beragam makanan khas Bali hingga makanan modern yang menarik minat wisatawan dan masyarakat lokal.
</Text>
<Text fz={"sm"} ta={"justify"}>
Potensi Desa melalui Kawasan Kuliner:
</Text>
<List py={20} type='ordered'>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Ragam Kuliner Khas Bali</Text>
<Text fz={"sm"} ta={"justify"}>Darmasaba memiliki banyak warung dan rumah makan yang menyajikan hidangan khas Bali yang otentik, seperti:</Text>
<Text fz={"sm"} ta={"justify"}> - Babi Guling : Salah satu kuliner favorit di Bali yang banyak ditemukan di Darmasaba.</Text>
<Text fz={"sm"} ta={"justify"}> - Ayam Betutu : Hidangan ayam berbumbu khas yang dimasak dengan teknik khas Bali.</Text>
<Text fz={"sm"} ta={"justify"}> - Lawar : Campuran daging dan sayuran berbumbu khas Bali.</Text>
<Text fz={"sm"} ta={"justify"}> - Sate Lilit : Sate khas Bali yang terbuat dari daging cincang yang dibalut pada batang serai.</Text>
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Wisata Kuliner Modern & Cafe Kekinian:</Text>Selain makanan tradisional, Darmasaba juga mulai berkembang dengan hadirnya cafe dan resto kekinian yang menyajikan menu modern seperti kopi spesial, burger, pizza, dan aneka dessert yang digemari anak muda. Keberadaan tempat-tempat ini menjadikan Darmasaba sebagai pilihan destinasi kuliner bagi wisatawan maupun warga sekitar.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pasar Kuliner Malam:</Text>Salah satu daya tarik Darmasaba adalah pusat kuliner malam yang menghadirkan aneka makanan kaki lima seperti nasi jinggo, tipat cantok, bakso, dan berbagai jajanan khas Bali. Suasana yang ramai dan harga yang terjangkau membuat pasar kuliner ini menjadi tempat favorit bagi masyarakat lokal.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Potensi Ekonomi & UMKM Kuliner:</Text>Dengan berkembangnya sektor kuliner, banyak pelaku UMKM di Darmasaba mulai merintis usaha makanan, baik dalam bentuk warung makan, katering, hingga produksi makanan ringan seperti keripik, sambal, dan minuman tradisional. Potensi ini dapat terus dikembangkan dengan dukungan pemerintah desa dan promosi melalui media sosial.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Kawasan Kuliner Berbasis Pariwisata:</Text>Untuk menarik lebih banyak pengunjung, Darmasaba berpotensi mengembangkan kawasan kuliner berbasis wisata yang menggabungkan pengalaman makan dengan konsep alam terbuka, pertunjukan seni, dan edukasi kuliner khas Bali. Hal ini dapat menjadi daya tarik tambahan bagi wisatawan yang ingin merasakan pengalaman kuliner yang lebih autentik.
</ListItem>
</List>
<Text fz={"sm"} ta={"justify"}>
Dengan kekayaan kuliner yang dimiliki, Desa Darmasaba berpotensi menjadi kawasan kuliner unggulan di Kabupaten Badung. Dukungan dari masyarakat, pemerintah desa, serta promosi yang lebih luas dapat menjadikan Darmasaba sebagai destinasi kuliner yang semakin dikenal dan berkembang.
</Text>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,59 @@
import colors from '@/con/colors';
import { Stack, Container, Box, List, ListItem, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} >
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Pertanian
</Text>
<Text
ta={"center"}
fw={"bold"}
>
Informasi dan Pelayanan Administrasi Digital
</Text>
</Box>
<Image src="/api/img/pertanian.jpg" alt='' w={"100%"} h={400} />
<Text py={20} fz={"sm"} ta={"justify"}>
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, Bali, memiliki potensi pertanian yang besar sebagai bagian dari warisan agraris yang telah diwariskan secara turun-temurun. Dengan kondisi tanah yang subur serta sistem irigasi tradisional subak, pertanian di Darmasaba memainkan peran penting dalam ekonomi dan keberlanjutan lingkungan desa.
</Text>
<Text fz={"sm"} ta={"justify"}>
Potensi Desa melalui Pertanian:
</Text>
<List py={20} type='ordered'>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Potensi dan Komoditas Unggulan</Text>
<Text fz={"sm"} ta={"justify"}>Pertanian di Desa Darmasaba mengandalkan berbagai jenis tanaman yang memiliki nilai ekonomi tinggi, di antaranya:</Text>
<Text fz={"sm"} ta={"justify"}> - Padi : Sebagai salah satu desa yang masih mempertahankan sistem subak, Darmasaba menjadi bagian dari lumbung pangan di Bali.</Text>
<Text fz={"sm"} ta={"justify"}> - Sayur-mayur : Beberapa jenis sayuran seperti kangkung, bayam, cabai, dan tomat banyak dibudidayakan oleh petani lokal.</Text>
<Text fz={"sm"} ta={"justify"}> - Buah-buahan tropis : Termasuk pisang, mangga, dan kelapa, yang menjadi sumber pendapatan tambahan bagi petani.</Text>
<Text fz={"sm"} ta={"justify"}> - Tanaman obat dan rempah : Seperti jahe, kunyit, dan lengkuas, yang memiliki permintaan tinggi baik untuk kebutuhan rumah tangga maupun industri herbal.</Text>
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Sistem Irigasi Tradisional Subak:</Text>Sebagai bagian dari warisan budaya Bali, sistem irigasi subak masih diterapkan di Darmasaba. Sistem ini memungkinkan distribusi air yang adil di antara lahan pertanian dan membantu menjaga keberlanjutan produksi pangan desa.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pengembangan Pertanian Organik:</Text>Dengan meningkatnya kesadaran akan pentingnya produk sehat dan ramah lingkungan, beberapa petani di Darmasaba mulai beralih ke metode pertanian organik. Hal ini membuka peluang bagi desa untuk mengembangkan produk-produk pertanian yang memiliki nilai jual lebih tinggi.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Agrowisata sebagai Sumber Pendapatan Baru:</Text>Potensi pertanian Darmasaba juga dapat dikembangkan menjadi agrowisata, di mana wisatawan dapat merasakan pengalaman langsung dalam bertani, mengikuti workshop bercocok tanam, serta menikmati hasil pertanian segar. Hal ini dapat menarik wisatawan lokal maupun mancanegara, meningkatkan perekonomian desa.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pemberdayaan Petani dan UMKM Berbasis Pertanian:</Text>Dengan adanya BUMDes Pudak Mesari dan dukungan dari pemerintah setempat, petani di Darmasaba dapat diberikan pelatihan dan akses pasar yang lebih luas. Produk pertanian dapat diolah menjadi berbagai produk turunan seperti keripik pisang, sambal khas desa, hingga minuman herbal yang dapat dipasarkan ke luar daerah.
</ListItem>
</List>
<Text fz={"sm"} ta={"justify"}>
Dengan berbagai potensi yang dimiliki, pertanian di Desa Darmasaba dapat terus berkembang melalui inovasi dan pemanfaatan teknologi pertanian modern. Dukungan dari masyarakat, pemerintah, dan lembaga terkait sangat penting untuk menjaga keberlanjutan sektor pertanian dan meningkatkan kesejahteraan petani di desa ini.
</Text>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,54 @@
import colors from '@/con/colors';
import { Stack, Container, Box, List, ListItem, Text, Image } from '@mantine/core';
import React from 'react';
import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} >
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Taman Beji Cengana
</Text>
<Text
ta={"center"}
fw={"bold"}
>
Informasi dan Pelayanan Administrasi Digital
</Text>
</Box>
<Image src="/api/img/taman-beji.jpg" alt='' w={"100%"} h={400} />
<Text py={20} fz={"sm"} ta={"justify"}>
Taman Beji Cengana, terletak di Desa Darmasaba, Kecamatan Abiansemal, Kabupaten Badung, Bali, adalah situs suci yang memiliki nilai spiritual dan sejarah yang tinggi. Tempat ini dikenal sebagai lokasi untuk ritual pembersihan diri (melukat) dan peribadatan oleh umat Hindu Bali. Keberadaan mata air suci (Tirta Klebutan) di Taman Beji Cengana dipercaya memberikan berkah dan penyucian bagi mereka yang datang untuk berdoa dan melakukan ritual.
</Text>
<Text fz={"sm"} ta={"justify"}>
Potensi Desa melalui Taman Beji Cengana:
</Text>
<List py={20} type='ordered'>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pengembangan Pariwisata Spiritual:</Text> Taman Beji Cengana memiliki potensi besar sebagai destinasi wisata spiritual. Wisatawan yang mencari pengalaman spiritual dan ketenangan batin dapat tertarik untuk mengunjungi tempat ini, mengikuti ritual melukat, dan merasakan suasana sakral yang ditawarkan.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pelestarian Budaya dan Tradisi:</Text>Dengan mempromosikan Taman Beji Cengana sebagai pusat kegiatan budaya dan ritual tradisional, desa dapat memastikan bahwa warisan budaya dan tradisi lokal tetap lestari.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pendidikan dan Penelitian:</Text>Taman Beji Cengana dapat dijadikan sebagai pusat pendidikan dan penelitian bagi akademisi, peneliti, dan pelajar yang tertarik mempelajari budaya, agama, dan sejarah Bali.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pengembangan Ekonomi Kreatif:</Text>Dengan meningkatnya jumlah pengunjung ke Taman Beji Cengana, peluang bagi pengembangan ekonomi kreatif juga terbuka lebar. Masyarakat lokal dapat mengembangkan produk kerajinan tangan, kuliner khas, dan suvenir yang mencerminkan budaya dan tradisi desa.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Konservasi Lingkungan:</Text>Sebagai situs suci dengan mata air alami, Taman Beji Cengana memiliki peran penting dalam konservasi lingkungan. Upaya menjaga kebersihan dan kelestarian mata air serta lingkungan sekitarnya dapat menjadi contoh praktik konservasi yang baik.
</ListItem>
</List>
<Text fz={"sm"} ta={"justify"}>
Dengan memanfaatkan potensi yang dimiliki Taman Beji Cengana, Desa Darmasaba dapat mengembangkan sektor pariwisata, budaya, pendidikan, ekonomi, dan lingkungan secara berkelanjutan, yang pada gilirannya akan meningkatkan kesejahteraan masyarakat dan pelestarian warisan budaya.
</Text>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,48 @@
import colors from '@/con/colors';
import { Stack, Box, Container, Text, Image, ListItem, List } from '@mantine/core';
import React from 'react';
import BackButton from '../../../layanan/_com/BackButto';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} >
<Container w={{ base: "100%", md: "50%" }} >
<BackButton />
<Box pb={20}>
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
TPS3R Pudak Mesari
</Text>
<Text
ta={"center"}
fw={"bold"}
>
Informasi dan Pelayanan Administrasi Digital
</Text>
</Box>
<Image src="/api/img/tps.png" alt='' w={"100%"} />
<Text py={20} fz={"sm"} ta={"justify"}>
TPS3R Pudak Mesari adalah Tempat Pengolahan Sampah dengan konsep Reduce, Reuse, dan Recycle (TPS3R) yang berlokasi di Desa Darmasaba, Kecamatan Abiansemal, Kabupaten Badung, Bali. Fasilitas ini berperan penting dalam pengelolaan sampah berbasis masyarakat, dengan tujuan mengurangi volume sampah yang masuk ke Tempat Pembuangan Akhir (TPA) dan meningkatkan kesadaran warga tentang pentingnya pengelolaan sampah yang berkelanjutan.
</Text>
<Text fz={"sm"} ta={"justify"}>
Potensi Desa melalui TPS3R Pudak Mesari:
</Text>
<List py={20} type='ordered'>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Peningkatan Kesehatan Lingkungan:</Text> Dengan pengelolaan sampah yang efektif, desa dapat menjaga kebersihan lingkungan, mengurangi risiko penyakit, dan menciptakan suasana yang lebih nyaman bagi warga.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pemberdayaan Ekonomi Masyarakat:</Text> TPS3R membuka peluang usaha bagi warga melalui pemilahan dan pengolahan sampah, seperti produksi kompos dari sampah organik dan kerajinan tangan dari sampah anorganik yang dapat meningkatkan pendapatan masyarakat.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Edukasi dan Kesadaran Lingkungan:</Text> Fasilitas ini dapat menjadi pusat edukasi bagi masyarakat tentang pentingnya pengelolaan sampah, mendorong partisipasi aktif dalam menjaga kelestarian lingkungan.
</ListItem>
<ListItem fz={"sm"} ta={"justify"}>
<Text fz={"sm"} fw={"bold"}>Pengembangan Pariwisata Berkelanjutan:</Text> Dengan lingkungan yang bersih dan asri, Desa Darmasaba memiliki potensi untuk menarik wisatawan yang tertarik pada ekowisata dan budaya lokal, sehingga meningkatkan perekonomian desa.
</ListItem>
</List>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,192 @@
'use client'
import colors from '@/con/colors';
import { BackgroundImage, Box, Button, Flex, Group, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
import BackButton from '../layanan/_com/BackButto';
import { useRouter } from 'next/navigation';
const datamap = [
{
id: 1,
images: "/api/img/tps.png",
name: "TPS3R Pudak Mesari",
kategori: "Lingkungan",
link: "/darmasaba/desa/potensi/tps",
},
{
id: 2,
images: "/api/img/ack.png",
name: "Bumdes Pudak Mesari",
kategori: "Ekonomi",
link: "/darmasaba/desa/potensi/bumdes"
},
{
id: 3,
images: "/api/img/taman-beji.jpg",
name: "Taman Beji Cengana",
kategori: "Wisata",
link: "/darmasaba/desa/potensi/taman"
},
{
id: 4,
images: "/api/img/waterpark.png",
name: "Gumuh Sari Water Park",
kategori: "Wisata",
link: "/darmasaba/desa/potensi/gumuh"
},
{
id: 5,
images: "/api/img/pertanian.jpg",
name: "Pertanian",
kategori: "Ekonomi",
link: "/darmasaba/desa/potensi/pertanian"
},
{
id: 6,
images: "/api/img/warungumkm.jpg",
name: "Kawasan Kuliner",
kategori: "Ekonomi",
link: "/darmasaba/desa/potensi/kuliner"
},
{
id: 7,
images: "/api/img/ikm.png",
name: "IKM berbasis Pengolahan Pangan",
kategori: "Ekonomi",
link: "/darmasaba/desa/potensi/tps"
},
{
id: 8,
images: "/api/img/genteng.jpeg",
name: "Genteng",
kategori: "Ekonomi",
link: "/darmasaba/desa/potensi/tps"
},
{
id: 9,
images: "/api/img/peternakanlele.jpg",
name: "Peternakan Ikan Lele",
kategori: "Ekonomi",
link: "/darmasaba/desa/potensi/tps"
},
{
id: 10,
images: "/api/img/jogging.jpg",
name: "Jogging Track Tegeh Aban, Karang Gadon dan Munduk Uma Desa",
kategori: "Lingkungan",
link: "/darmasaba/desa/potensi/tps"
},
{
id: 11,
images: "/api/img/damtanahputih.jpeg",
name: "Dam Tanah Putih",
kategori: "Wisata",
link: "/darmasaba/desa/potensi/tps"
},
{
id: 12,
images: "/api/img/umkm.jpeg",
name: "UMKM",
kategori: "Ekonomi",
link: "/darmasaba/desa/potensi/tps"
},
{
id: 13,
images: "/api/img/potong-daging.png",
name: "Pemotongan Daging",
kategori: "Ekonomi",
link: "/darmasaba/desa/potensi/tps"
},
]
function Page() {
const router = useRouter()
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} >
<Box px={"lg"}>
<BackButton />
<Box pb={30}>
<Stack gap={0}>
<Flex justify={"space-between"} align={"center"} px={10}>
<Box>
<Text fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Potensi Desa
</Text>
<Text ta={"justify"} py={10}>
Temukan berbagai potensi dan keunggulan yang dimiliki Desa Darmasaba.
</Text>
</Box>
<Paper radius={"md"} px={"xl"} py={5} bg={colors["blue-button"]} >
<Flex justify={"space-evenly"} align={"center"} gap={"xl"}>
<Box>
<Text ta={"center"} fz={"h2"} fw={"bold"} c={"white"}>13</Text>
<Text ta={"center"} fz={"sm"} c={"white"}>Potensi</Text>
</Box>
<Box>
<Text ta={"center"} fz={"h2"} fw={"bold"} c={"white"}>5</Text>
<Text ta={"center"} fz={"sm"} c={"white"}>Destinasi Wisata</Text>
</Box>
</Flex>
</Paper>
</Flex>
</Stack>
</Box>
<SimpleGrid
py={20}
cols={{
base: 1,
sm: 3
}}
>
{datamap.map((v, k) => {
return (
<BackgroundImage
key={k}
src={v.images}
h={350}
radius={16}
pos={"relative"}
>
<Box
style={{
borderRadius: 16,
zIndex: 0
}}
pos={"absolute"}
w={"100%"}
h={"100%"}
bg={colors.trans.dark[2]}
/>
<Stack justify='space-between' h={"100%"} gap={0} p={"lg"} pos={"relative"}>
<Group>
<Paper radius={"lg"} py={7} px={10}>
<Text>{v.kategori}</Text>
</Paper>
</Group>
<Box p={"lg"}>
<Text
fw={"bold"}
c={"white"}
size={"1.8rem"}
style={{
textAlign: "center",
}}>{v.name}</Text>
</Box>
<Group justify="center">
<Button px={20} radius={"100"} size="md" bg={colors["blue-button"]}
onClick={() => router.push(v.link)}>
Detail
</Button>
</Group>
</Stack>
</BackgroundImage>
)
})}
</SimpleGrid>
</Box>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,14 @@
'use client'
import { ActionIcon } from "@mantine/core";
import { IconArrowLeft } from "@tabler/icons-react";
import { useTransitionRouter } from 'next-view-transitions';
export default function BackButton() {
const router = useTransitionRouter()
return (
<ActionIcon variant="transparent" onClick={() => router.back()}>
<IconArrowLeft />
</ActionIcon>
);
}

View File

@@ -0,0 +1,36 @@
import colors from '@/con/colors';
import { Box, Container, Stack, Text } from '@mantine/core';
import BackButton from './_com/BackButto';
import ProfileDesa from './ui/profileDesa';
import SejarahDesa from './ui/sejarahDesa';
import VisimisiDesa from './ui/visimisiDesa';
import LambangDesa from './ui/lambangDesa';
import MaskotDesa from './ui/maskotDesa';
import ProfilPerbekel from './ui/profilPerbekel';
function Page() {
return (
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"}>
<Box px={50}>
<BackButton />
</Box>
<Container w={{ base: "100%", md: "50%" }}>
<Stack align='center' gap={0}>
<Text fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
Profile Desa
</Text>
</Stack>
</Container>
<Box w={{ base: "100%", md: "100%" }} px={50}>
<ProfileDesa />
<SejarahDesa />
<VisimisiDesa />
<LambangDesa />
<MaskotDesa />
<ProfilPerbekel />
</Box>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,61 @@
import colors from '@/con/colors';
import { Box, Stack, Paper, Image, Text, Center } from '@mantine/core';
import React from 'react';
function LambangDesa() {
return (
<Box pb={70}>
<Stack align='center' gap={0}>
<Box pb={30}>
<Center>
<Image src={"/api/img/darmasaba-icon.png"} alt="" w={{ base: 200, md: 300 }} />
</Center>
<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>
</Paper>
</Stack>
</Box >
);
}
export default LambangDesa;

View File

@@ -0,0 +1,98 @@
import colors from '@/con/colors';
import { Box, Center, Image, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
function MaskotDesa() {
return (
<Box pb={70}>
<Stack align='center' gap={0}>
<Box pb={30}>
<Center>
<Image src={"/api/img/pudak-icon.png"} alt="" w={{ base: 200, md: 300 }} />
</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={"/api/img/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={"/api/img/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={"/api/img/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={"/api/img/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>
</Stack>
</Box >
);
}
export default MaskotDesa;

View File

@@ -0,0 +1,136 @@
import colors from '@/con/colors';
import { Box, Image, List, ListItem, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
function ProfilPerbekel() {
return (
<Box pb={70}>
<Stack align='center' gap={0}>
<Box pb={30}>
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={"2.5rem"}>Profil Perbekel</Text>
</Box>
</Stack>
<SimpleGrid
cols={{
base: 1,
md: 2,
}}
pb={50}
>
<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='' />
<Paper
bg={colors['blue-button']}
px={"lg"}
className="glass3"
py={{ base: 20, md: 50 }}
>
<Text c={colors['white-1']} fz={{ base: "md", md: "h3" }}>Perbekel Desa Darmasaba</Text>
<Text c={colors['white-1']} fw={"bolder"} fz={{ base: "md", md: "h2" }}>
I.B. Surya Prabhawa Manuaba, S.H.,M.H.,NL.P.
</Text>
</Paper>
</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%" }}>
<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>
<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>
</Paper>
</Box>
);
}
export default ProfilPerbekel;

View File

@@ -0,0 +1,49 @@
import colors from '@/con/colors';
import { Center, Paper, SimpleGrid, Box, Text } from '@mantine/core';
import React from 'react';
function ProfileDesa() {
return (
<Box pb={90}>
<Center>
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<Center>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d15780.3751228292!2d115.19559210934409!3d-8.586981700000006!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2dd23eb932812c81%3A0x5b5ac2759cc5fe4b!2sKantor%20Perbekel%20Darmasaba!5e0!3m2!1sid!2sid!4v1741922475983!5m2!1sid!2sid" width="600" height="450" style={{ border: 2, width: "100%" }} loading="lazy" />
</Center>
</Paper>
</Center>
<Center>
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
<SimpleGrid
cols={{
base: 1,
sm: 3
}}
>
<Box>
<Paper p={"sm"} w={{ base: "100%", md: "100%" }}>
<Text fz={50} c={colors['blue-button']} ta={"center"} fw={"bold"}>8</Text>
<Text fz={{ base: "md", md: "h3"}} ta={"center"}>Tempat Wisata</Text>
</Paper>
</Box>
<Box>
<Paper p={"sm"} w={{ base: "100%", md: "100%" }}>
<Text fz={50} c={colors['blue-button']} ta={"center"} fw={"bold"}>8</Text>
<Text fz={{ base: "md", md: "h3"}} ta={"center"}>Tempat Wisata</Text>
</Paper>
</Box>
<Box>
<Paper p={"sm"} w={{ base: "100%", md: "100%" }}>
<Text fz={50} c={colors['blue-button']} ta={"center"} fw={"bold"}>8</Text>
<Text fz={{ base: "md", md: "h3"}} ta={"center"}>Tempat Wisata</Text>
</Paper>
</Box>
</SimpleGrid>
</Paper>
</Center>
</Box>
);
}
export default ProfileDesa;

View File

@@ -0,0 +1,33 @@
import colors from '@/con/colors';
import { Box, Center, Image, Paper, Stack, Text } from '@mantine/core';
function SejarahDesa() {
return (
<>
<Box pb={70}>
<Stack align='center' gap={0}>
<Box pb={30}>
<Center>
<Image src={"/api/img/darmasaba-icon.png"} alt="" w={{ base: 200, md: 300 }} />
</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>
</Stack>
</Box >
</>
);
}
export default SejarahDesa;

View File

@@ -0,0 +1,41 @@
import colors from '@/con/colors';
import { Box, Stack, Paper, Image, Text, ListItem, List } from '@mantine/core';
import React from 'react';
function VisimisiDesa() {
return (
<>
<Box pb={30}>
<Stack align='center' gap={0}>
<Box pb={30}>
<Image src={"/api/img/darmasaba-icon.png"} alt="" w={{ base: 200, md: 300 }} />
</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>
</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>
</Paper>
</Stack>
</Box >
</>
);
}
export default VisimisiDesa;

View File

@@ -1,7 +0,0 @@
import { Stack } from "@mantine/core";
export default function Page() {
return <Stack>
layanan
</Stack>
}

View File

@@ -0,0 +1,92 @@
import BackButton from '@/app/darmasaba/(pages)/desa/layanan/_com/BackButto';
import colors from '@/con/colors';
import { Stack, Container, Text, Image, ActionIcon, Box, Divider, Flex } from '@mantine/core';
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp } from '@tabler/icons-react';
import React from 'react';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={42}>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton/>
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
Juara 2
</Text>
<Text
ta={"center"}
fw={"bold"}
>
Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024
</Text>
<Image py={20} src={"/api/img/penghargaan-2.png"} alt='' />
<Text
py={20}
ta={"justify"}
fw={"bold"}
>
Desa Dramasaba Raih Juara 2 dalam Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024
</Text>
<Text
ta={"justify"}
>
Desa Dramasaba kembali menunjukkan eksistensinya dalam memajukan potensi desa dengan meraih Juara 2 dalam ajang Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024. Prestasi ini menjadi bukti nyata bahwa Desa Dramasaba memiliki daya tarik serta peluang investasi yang menjanjikan bagi para investor maupun masyarakat yang ingin berkontribusi dalam pengembangan desa.
</Text>
<Text
py={5}
ta={"justify"}
>
Dalam video pendek yang diikutsertakan dalam lomba ini, Desa Dramasaba menampilkan berbagai potensi unggulan yang dimiliki, mulai dari sektor pertanian, pariwisata berbasis budaya, hingga ekonomi kreatif yang sedang berkembang pesat. Dengan pengemasan yang menarik dan penyampaian informasi yang jelas, video tersebut berhasil memikat perhatian dewan juri serta menjadi inspirasi bagi desa-desa lain dalam mengembangkan potensi wilayahnya masing-masing.
</Text>
<Text
ta={"justify"}
>
Keberhasilan ini tidak lepas dari kerja keras seluruh tim kreatif, pemerintah desa, serta masyarakat yang turut berpartisipasi dalam produksi video. Kepala Desa Dramasaba, [Nama Kepala Desa], mengungkapkan rasa syukur dan bangganya atas pencapaian ini. Menurutnya, kemenangan ini bukan sekadar penghargaan, tetapi juga menjadi motivasi untuk terus mengembangkan desa agar semakin dikenal luas dan menarik lebih banyak peluang investasi.
</Text>
<Text
py={5}
ta={"justify"}
>
Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024 merupakan ajang yang diadakan oleh pemerintah daerah dengan tujuan untuk mendorong desa-desa dalam mengenalkan dan mempromosikan potensi investasi mereka. Dengan mengikuti lomba ini, Desa Dramasaba tidak hanya memperoleh apresiasi, tetapi juga membuka peluang lebih besar untuk berkolaborasi dengan investor maupun pihak lain yang tertarik dalam pengembangan desa.
</Text>
<Text
ta={"justify"}
>
Ke depan, Desa Dramasaba berkomitmen untuk terus meningkatkan daya saingnya, baik dalam sektor ekonomi, budaya, maupun infrastruktur, sehingga mampu memberikan manfaat yang lebih besar bagi masyarakat serta menarik perhatian lebih banyak pihak untuk berinvestasi dan berkontribusi dalam pembangunan desa.
</Text>
<Text
py={5}
ta={"justify"}
>
Dengan prestasi ini, diharapkan Desa Dramasaba dapat menjadi contoh bagi desa-desa lain dalam memanfaatkan media digital sebagai sarana promosi dan pengembangan potensi lokal.
</Text>
</Stack>
<Box py={20}>
<Divider />
<Flex justify={"space-between"} py={20}>
<Text fz={"sm"}>25 May 2021 . Darmasaba</Text>
<Box>
<Flex gap={"lg"}>
<ActionIcon variant='transparent'>
<IconBrandFacebook color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandInstagram color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandTwitter color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandWhatsapp color={"gray"} size={"30"} />
</ActionIcon>
</Flex>
</Box>
</Flex>
<Divider pb={50} />
</Box>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,92 @@
import BackButton from '@/app/darmasaba/(pages)/desa/layanan/_com/BackButto';
import colors from '@/con/colors';
import { Stack, Container, Text, Image, ActionIcon, Box, Divider, Flex } from '@mantine/core';
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp } from '@tabler/icons-react';
import React from 'react';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={42}>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton/>
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
Juara 2
</Text>
<Text
ta={"center"}
fw={"bold"}
>
Duta Invenstasi Kabupaten Badung 2024
</Text>
<Image py={20} src={"/api/img/penghargaan-3.png"} alt='' />
<Text
py={20}
ta={"justify"}
fw={"bold"}
>
Desa Dramasaba Raih Juara 2 dalam Duta Invenstasi Kabupaten Badung 2024
</Text>
<Text
ta={"justify"}
>
Desa Dramasaba kembali menunjukkan eksistensinya dalam memajukan potensi desa dengan meraih Juara 2 dalam ajang Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024. Prestasi ini menjadi bukti nyata bahwa Desa Dramasaba memiliki daya tarik serta peluang investasi yang menjanjikan bagi para investor maupun masyarakat yang ingin berkontribusi dalam pengembangan desa.
</Text>
<Text
py={5}
ta={"justify"}
>
Dalam video pendek yang diikutsertakan dalam lomba ini, Desa Dramasaba menampilkan berbagai potensi unggulan yang dimiliki, mulai dari sektor pertanian, pariwisata berbasis budaya, hingga ekonomi kreatif yang sedang berkembang pesat. Dengan pengemasan yang menarik dan penyampaian informasi yang jelas, video tersebut berhasil memikat perhatian dewan juri serta menjadi inspirasi bagi desa-desa lain dalam mengembangkan potensi wilayahnya masing-masing.
</Text>
<Text
ta={"justify"}
>
Keberhasilan ini tidak lepas dari kerja keras seluruh tim kreatif, pemerintah desa, serta masyarakat yang turut berpartisipasi dalam produksi video. Kepala Desa Dramasaba, [Nama Kepala Desa], mengungkapkan rasa syukur dan bangganya atas pencapaian ini. Menurutnya, kemenangan ini bukan sekadar penghargaan, tetapi juga menjadi motivasi untuk terus mengembangkan desa agar semakin dikenal luas dan menarik lebih banyak peluang investasi.
</Text>
<Text
py={5}
ta={"justify"}
>
Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024 merupakan ajang yang diadakan oleh pemerintah daerah dengan tujuan untuk mendorong desa-desa dalam mengenalkan dan mempromosikan potensi investasi mereka. Dengan mengikuti lomba ini, Desa Dramasaba tidak hanya memperoleh apresiasi, tetapi juga membuka peluang lebih besar untuk berkolaborasi dengan investor maupun pihak lain yang tertarik dalam pengembangan desa.
</Text>
<Text
ta={"justify"}
>
Ke depan, Desa Dramasaba berkomitmen untuk terus meningkatkan daya saingnya, baik dalam sektor ekonomi, budaya, maupun infrastruktur, sehingga mampu memberikan manfaat yang lebih besar bagi masyarakat serta menarik perhatian lebih banyak pihak untuk berinvestasi dan berkontribusi dalam pembangunan desa.
</Text>
<Text
py={5}
ta={"justify"}
>
Dengan prestasi ini, diharapkan Desa Dramasaba dapat menjadi contoh bagi desa-desa lain dalam memanfaatkan media digital sebagai sarana promosi dan pengembangan potensi lokal.
</Text>
</Stack>
<Box py={20}>
<Divider />
<Flex justify={"space-between"} py={20}>
<Text fz={"sm"}>25 May 2021 . Darmasaba</Text>
<Box>
<Flex gap={"lg"}>
<ActionIcon variant='transparent'>
<IconBrandFacebook color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandInstagram color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandTwitter color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandWhatsapp color={"gray"} size={"30"} />
</ActionIcon>
</Flex>
</Box>
</Flex>
<Divider pb={50} />
</Box>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -0,0 +1,92 @@
import BackButton from '@/app/darmasaba/(pages)/desa/layanan/_com/BackButto';
import colors from '@/con/colors';
import { Stack, Container, Text, Image, ActionIcon, Box, Divider, Flex } from '@mantine/core';
import { IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp } from '@tabler/icons-react';
import React from 'react';
function Page() {
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={42}>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton />
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
Juara Favorit
</Text>
<Text
ta={"center"}
fw={"bold"}
>
Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024
</Text>
<Image py={20} src={"/api/img/penghargaan-1.png"} alt='' />
<Text
py={20}
ta={"justify"}
fw={"bold"}
>
Desa Dramasaba Raih Juara Favorit dalam Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024
</Text>
<Text
ta={"justify"}
>
Desa Dramasaba kembali menunjukkan eksistensinya dalam memajukan potensi desa dengan meraih Juara 2 dalam ajang Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024. Prestasi ini menjadi bukti nyata bahwa Desa Dramasaba memiliki daya tarik serta peluang investasi yang menjanjikan bagi para investor maupun masyarakat yang ingin berkontribusi dalam pengembangan desa.
</Text>
<Text
py={5}
ta={"justify"}
>
Dalam video pendek yang diikutsertakan dalam lomba ini, Desa Dramasaba menampilkan berbagai potensi unggulan yang dimiliki, mulai dari sektor pertanian, pariwisata berbasis budaya, hingga ekonomi kreatif yang sedang berkembang pesat. Dengan pengemasan yang menarik dan penyampaian informasi yang jelas, video tersebut berhasil memikat perhatian dewan juri serta menjadi inspirasi bagi desa-desa lain dalam mengembangkan potensi wilayahnya masing-masing.
</Text>
<Text
ta={"justify"}
>
Keberhasilan ini tidak lepas dari kerja keras seluruh tim kreatif, pemerintah desa, serta masyarakat yang turut berpartisipasi dalam produksi video. Kepala Desa Dramasaba, [Nama Kepala Desa], mengungkapkan rasa syukur dan bangganya atas pencapaian ini. Menurutnya, kemenangan ini bukan sekadar penghargaan, tetapi juga menjadi motivasi untuk terus mengembangkan desa agar semakin dikenal luas dan menarik lebih banyak peluang investasi.
</Text>
<Text
py={5}
ta={"justify"}
>
Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024 merupakan ajang yang diadakan oleh pemerintah daerah dengan tujuan untuk mendorong desa-desa dalam mengenalkan dan mempromosikan potensi investasi mereka. Dengan mengikuti lomba ini, Desa Dramasaba tidak hanya memperoleh apresiasi, tetapi juga membuka peluang lebih besar untuk berkolaborasi dengan investor maupun pihak lain yang tertarik dalam pengembangan desa.
</Text>
<Text
ta={"justify"}
>
Ke depan, Desa Dramasaba berkomitmen untuk terus meningkatkan daya saingnya, baik dalam sektor ekonomi, budaya, maupun infrastruktur, sehingga mampu memberikan manfaat yang lebih besar bagi masyarakat serta menarik perhatian lebih banyak pihak untuk berinvestasi dan berkontribusi dalam pembangunan desa.
</Text>
<Text
py={5}
ta={"justify"}
>
Dengan prestasi ini, diharapkan Desa Dramasaba dapat menjadi contoh bagi desa-desa lain dalam memanfaatkan media digital sebagai sarana promosi dan pengembangan potensi lokal.
</Text>
</Stack>
<Box py={20}>
<Divider />
<Flex justify={"space-between"} py={20}>
<Text fz={"sm"}>25 May 2021 . Darmasaba</Text>
<Box>
<Flex gap={"lg"}>
<ActionIcon variant='transparent'>
<IconBrandFacebook color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandInstagram color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandTwitter color={"gray"} size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandWhatsapp color={"gray"} size={"30"} />
</ActionIcon>
</Flex>
</Box>
</Flex>
<Divider pb={50} />
</Box>
</Container>
</Stack>
);
}
export default Page;

View File

@@ -1,5 +1,137 @@
'use client';
import colors from "@/con/colors";
import { Carousel, CarouselSlide } from "@mantine/carousel";
import { Box, Button, Container, Group, Paper, Stack, Text, useMantineTheme } from "@mantine/core";
import { useMediaQuery } from "@mantine/hooks";
import Autoplay from "embla-carousel-autoplay";
import Link from "next/link";
import { useRef } from "react";
import BackButton from "../../(pages)/desa/layanan/_com/BackButto";
const data = [
{
id: 1,
images: "/api/img/penghargaan-2.png",
juara: "Juara 2",
deskripsi: "Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024",
link: "/darmasaba/penghargaan/detail/lomba1"
},
{
id: 2,
images: "/api/img/penghargaan-3.png",
juara: "Juara 2",
deskripsi: "Duta Invenstasi Kabupaten Badung 2024",
link: "/darmasaba/penghargaan/detail/lomba2"
},
{
id: 3,
images: "/api/img/penghargaan-1.png",
juara: "Juara Favorit",
deskripsi: "Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024",
link: "/darmasaba/penghargaan/detail/lomba3"
},
{
id: 4,
images: "/api/img/penghargaan-2.png",
juara: "Juara 2",
deskripsi: "Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024",
link: "/darmasaba/penghargaan/detail/lomba1"
},
{
id: 5,
images: "/api/img/penghargaan-3.png",
juara: "Juara 2",
deskripsi: "Duta Invenstasi Kabupaten Badung 2024",
link: "/darmasaba/penghargaan/detail/lomba2"
},
{
id: 6,
images: "/api/img/penghargaan-1.png",
juara: "Juara Favorit",
deskripsi: "Lomba Video Pendek Potensi dan Peluang Investasi di Desa Kabupaten Badung 2024",
link: "/darmasaba/penghargaan/detail/lomba3"
}
]
export default function Page() {
return <div>
penghargaan
</div>
return (
<Stack pos={"relative"} bg={colors.grey[1]} py={"xl"} gap={42}>
<Container w={{ base: "100%", md: "50%" }}>
<BackButton/>
<Stack align="center" gap={0}>
<Text fz={"3.4rem"} fw={"bold"}>
Penghargaan
</Text>
<Text
py={10}
ta={"justify"}
>
Desa Darmasaba telah berhasil meraih berbagai penghargaan bergengsi yang membuktikan dedikasi dan kerja keras seluruh elemen masyarakat dalam membangun desa yang maju dan berkelanjutan. Berikut ini adalah macam-macam penghargaan yang telah diraih oleh Desa Darmasaba:
</Text>
<Slider />
</Stack>
</Container>
</Stack>
)
}
function Slider() {
const height = 720;
const width = 1200;
const theme = useMantineTheme();
const mobile = useMediaQuery(`(max-width: ${theme.breakpoints.sm})`);
const autoplay = useRef(Autoplay({ delay: 2000 }));
const slides = data.map((item) => (
<CarouselSlide key={item.id}>
<Paper h={"100%"} pos={"relative"} style={{
backgroundImage: `url(${item.images}) `,
backgroundSize: "cover",
backgroundPosition: "center",
backgroundRepeat: "no-repeat",
}}>
<Box
style={{
borderRadius: 16,
zIndex: 0,
}}
pos={"absolute"}
w={"100%"}
h={"100%"}
bg={colors.trans.dark[2]}
/>
<Stack justify="space-between" h={"100%"} gap={0} p={"lg"} pos={"relative"} >
<Box p={"lg"}>
<Text fz={"2.3rem"} fw={"bold"} ta={"center"} c={"white"}>{item.juara}</Text>
<Text fz={"1.5rem"} ta={"center"} c={"white"}>{item.deskripsi}</Text>
</Box>
<Group justify="center">
<Button component={Link} href={item.link} px={46} radius={"100"} size="md" bg={colors["blue-button"]}>
Detail
</Button>
</Group>
</Stack>
</Paper>
</CarouselSlide>
));
return (
<Carousel
c={"white"}
py={50}
plugins={[autoplay.current]}
onMouseEnter={autoplay.current.stop}
onMouseLeave={autoplay.current.reset}
w={width}
height={height}
slideSize={{ base: "100%", sm: "50%", md: "33.333333%" }}
slideGap={{ base: "xl", sm: "md" }}
loop
align="start"
slidesToScroll={mobile ? 1 : 2}
>
{slides}
</Carousel>
);
}

View File

@@ -1,15 +1,208 @@
import colors from "@/con/colors";
import { Stack, Container, Center, Text } from "@mantine/core";
'use client'
import colors from '@/con/colors';
import { ActionIcon, Anchor, Box, Center, Container, Divider, Flex, Group, Image, Paper, SimpleGrid, Stack, Text, TextInput, Title, useMantineTheme } from '@mantine/core';
import { useMediaQuery } from '@mantine/hooks';
import { IconAt, IconBrandFacebook, IconBrandInstagram, IconBrandTwitter, IconBrandWhatsapp } from '@tabler/icons-react';
function Footer() {
return <Stack bg={colors["blue-button"]} c={colors["white-trans-1"]}>
<Container w={{ base: "100%", md: "80%" }} p={"xl"} h={720} >
<Center>
<Text fz={"3.4rem"}>Footer</Text>
</Center>
</Container>
</Stack>
const theme = useMantineTheme();
const mobile = useMediaQuery(`(max-width: ${theme.breakpoints.sm})`);
return (
<>
<Stack bg={colors["blue-button"]}>
<Box w={mobile ? "100%" : "100%"} p={"xl"} h={{ base: 1850, md: 1100 }} >
<Center>
<Paper w={"100%"}>
<Box component="footer" py="xl">
<Container size="lg">
<Stack gap="xl">
<Box>
<Title fz={"md"} order={2} fw={700} mb="md">Komitmen Dalam Pelayanan</Title>
<Stack gap="sm">
<Group align="flex-start" gap="xs">
<Text fz={"sm"} fw={700}>1. Transparansi:</Text>
<Text fz={"sm"}>
Kami berkomitmen untuk mengelola dana desa secara terbuka, sehingga masyarakat dapat
mengetahui penggunaan anggaran secara jelas dan bertanggung jawab.
</Text>
</Group>
<Group align="flex-start" gap="xs">
<Text fz={"sm"} fw={700}>2. Profesionalisme:</Text>
<Text fz={"sm"}>
Setiap layanan desa akan dilakukan dengan profesional, cepat, dan tanpa diskriminasi,
demi memastikan kepuasan masyarakat.
</Text>
</Group>
<Group align="flex-start" gap="xs">
<Text fz={"sm"} fw={700}>3. Partisipatif:</Text>
<Text fz={"sm"}>
Kami percaya bahwa partisipasi aktif masyarakat adalah kunci keberhasilan pembangunan desa.
Oleh karena itu, kami akan terus melibatkan warga dalam setiap proses pengambilan keputusan.
</Text>
</Group>
<Group align="flex-start" gap="xs">
<Text fz={"sm"} fw={700}>4. Inovasi:</Text>
<Text fz={"sm"}>
Kami berkomitmen untuk terus berinovasi dalam memberikan solusi bagi permasalahan desa,
termasuk melalui pemanfaatan teknologi untuk mempermudah akses layanan.
</Text>
</Group>
<Group align="flex-start" gap="xs">
<Text fz={"sm"} fw={700}>5. Berkeadilan:</Text>
<Text fz={"sm"}>
Setiap kebijakan dan program desa akan dirancang untuk memberikan manfaat yang merata
bagi seluruh lapisan masyarakat, tanpa memandang status sosial atau ekonomi.
</Text>
</Group>
<Group align="flex-start" gap="xs">
<Text fz={"sm"} fw={700}>6. Pemberdayaan:</Text>
<Text fz={"sm"}>
Kami berkomitmen untuk memberdayakan masyarakat melalui pelatihan, pendampingan,
dan dukungan terhadap usaha-usaha lokal agar desa semakin mandiri.
</Text>
</Group>
<Group align="flex-start" gap="xs">
<Text fz={"sm"} fw={700}>7. Ramah Lingkungan:</Text>
<Text fz={"sm"}>
Seluruh kegiatan pembangunan dan pelayanan desa akan memperhatikan keberlanjutan lingkungan,
demi menjaga keseimbangan alam dan kenyamanan hidup warga.
</Text>
</Group>
</Stack>
</Box>
<Divider />
<Box>
<Title fz={"md"} order={2} fw={700} mb="md">Tujuan Akhir</Title>
<Text fz={"sm"} mb="sm">
Dengan visi, misi dan komitmen ini, kami bertekad untuk menjadikan desa sebagai tempat tinggal
yang nyaman, aman dan sejahtera bagi seluruh warganya.
</Text>
<Text fz={"sm"} mb="sm">
Kami percaya bahwa kemajuan desa dimulai dari kerjasama antara pemerintah desa dan masyarakat,
serta didukung oleh tata kelola yang baik dan berorientasi pada kepentingan bersama. Jika ada
masukan untuk lembaga desa, silahkan hubungi pada nomor pengaduan di bawah, terima kasih.
</Text>
</Box>
<Group justify='apart' align="center">
<Text ta={"center"} fz={"sm"} fw={700} size="lg" style={{ fontStyle: 'italic' }}>{"Desa Kuat, Masyarakat Sejahtera!"}</Text>
<Box
style={{
width: 80,
height: 80,
position: 'relative'
}}
>
<ActionIcon size={80} radius={"xl"} variant='transparent'>
<Image src="/api/img/chatbot-removebg-preview.png" alt="Logo Desa" width={80} height={80} />
</ActionIcon>
</Box>
</Group>
</Stack>
</Container>
</Box>
</Paper>
</Center>
<Box py={20}>
<SimpleGrid
p={20}
cols={{
base: 2,
sm: 4,
}}
style={{
color: "white"
}}
>
<Box p={mobile ? 30 : 30}>
<Stack justify='space-between'>
<Text fz={"md"} fw={"bold"}>Tentang Darmasaba</Text>
<Text fz={"xs"} >Desa Darmasaba adalah desa
budaya yang kaya akan tradisi dan
nilai-nilai luhur masyarakat Bali.</Text>
<Box>
<Flex gap={"md"}>
<ActionIcon variant='transparent'>
<IconBrandFacebook color='white' size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandInstagram color='white' size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandTwitter color='white' size={"30"} />
</ActionIcon>
<ActionIcon variant='transparent'>
<IconBrandWhatsapp color='white' size={"30"} />
</ActionIcon>
</Flex>
</Box>
</Stack>
</Box>
<Box p={mobile ? 30 : 30}>
<Stack justify='space-between' gap={"xs"}>
<Text fz={"md"} fw={"bold"}>Layanan</Text>
<Anchor c={"white"} variant='transparent'>
<Text fz={"xs"} >Administrasi Kependudukan</Text>
</Anchor>
<Anchor c={"white"} variant='transparent'>
<Text fz={"xs"} >Pelayanan Sosial</Text>
</Anchor>
<Anchor c={"white"} variant='transparent'>
<Text fz={"xs"} >Pengaduan Masyarakat</Text>
</Anchor>
<Anchor c={"white"} variant='transparent'>
<Text fz={"xs"} >Informasi Publik</Text>
</Anchor>
</Stack>
</Box>
<Box p={mobile ? 30 : 30}>
<Stack justify='space-between' gap={"xs"}>
<Text fz={"md"} fw={"bold"}>Tautan Penting</Text>
<Anchor c={"white"} variant='transparent'>
<Text fz={"xs"} >Portal Badung</Text>
</Anchor>
<Anchor c={"white"} variant='transparent'>
<Text fz={"xs"} >E-Government</Text>
</Anchor>
<Anchor c={"white"} variant='transparent'>
<Text fz={"xs"} >Transparansi</Text>
</Anchor>
<Anchor c={"white"} variant='transparent'>
<Text fz={"xs"} >Unduhan</Text>
</Anchor>
</Stack>
</Box>
<Box p={mobile ? 30 : 30}>
<Stack justify='space-between'>
<Text fz={"md"} fw={"bold"}>Newsletter</Text>
<Text fz={"xs"} >Dapatkan informasi terbaru
tentang kegiatan dan program
desa</Text>
<TextInput
placeholder='Alamat email anda'
rightSection={<IconAt color={colors["blue-button"]} />}
/>
</Stack>
</Box>
</SimpleGrid>
</Box>
<Divider py={15} />
<Text ta={"center"} c={"white"} p={20}>
© 2024 Desa Darmasaba. Hak Cipta Dilindungi.
</Text>
</Box>
</Stack>
</>
);
}
export default Footer;
export default Footer;

View File

@@ -2,13 +2,13 @@
import colors from "@/con/colors";
import navbarListMenu from "@/con/navbar-list-menu";
import stateNav from "@/state/state-nav";
import { ActionIcon, Box, Burger, Group, Stack, Text } from "@mantine/core";
import { IconHome, IconSquareArrowRight } from "@tabler/icons-react";
import { ActionIcon, Box, Burger, Group, Image, Stack, Text } from "@mantine/core";
import { IconSquareArrowRight } from "@tabler/icons-react";
import { motion } from 'framer-motion';
import { useRouter } from 'next/navigation';
import { useSnapshot } from "valtio";
import { MenuItem } from "../../../../types/menu-item";
import { NavbarMainMenu } from "./NavbarMainMenu";
import { useRouter } from 'next/navigation'
export function Navbar() {
const { item, isSearch, mobileOpen } = useSnapshot(stateNav);
@@ -31,8 +31,10 @@ export function Navbar() {
<ActionIcon variant="transparent" onClick={() => {
router.push("/darmasaba")
stateNav.mobileOpen = false
}}>
<IconHome />
}}
size={80} radius={"xl"}
>
<Image src="/api/img/darmasaba-icon.png" alt="Logo Desa" width={50} height={50} />
</ActionIcon>
<Burger onClick={() => stateNav.mobileOpen = !stateNav.mobileOpen} color={colors["blue-button"]} opened={mobileOpen} />
</Group>

View File

@@ -0,0 +1,105 @@
import colors from '@/con/colors';
import { BackgroundImage, Box, Button, Group, SimpleGrid, Stack, Text } from '@mantine/core';
const data = [
{
id: 1,
title: "Pendapatan",
image: "/api/img/pendapatan.jpeg",
value: "Rp 495M"
},
{
id: 2,
title: "Belanja",
image: "/api/img/belanja.jpeg",
value: "Rp 395M"
},
{
id: 3,
title: "Pembiayaan",
image: "/api/img/pembiayaan.jpeg",
value: "Rp 295M"
},
]
function Apbdes() {
const textHeading = {
title: "APBDes",
des: "Transparansi APBDes Darmasaba adalah langkah nyata menuju tata kelola pemerintahan desa yang bersih dan bertanggung jawab"
}
return (
<>
<Stack p={"sm"} gap={"4rem"} bg={colors.Bg}>
<Box
w={{
base: '100%',
sm: '60%',
}}
>
<Stack gap={0}>
<Text fz={"4.4rem"} fw={"bold"}>
{textHeading.title}
</Text>
<Text fz={"1.4rem"}>
{textHeading.des}
</Text>
</Stack>
</Box>
<SimpleGrid
cols={{
base: 1,
sm: 3,
}}
pb={50}
>
{data.map((v, k) => {
return (
<BackgroundImage
key={k}
src={v.image}
h={350}
radius={16}
pos={"relative"}
>
<Box
style={{
borderRadius: 16,
zIndex: 0
}}
pos={"absolute"}
w={"100%"}
h={"100%"}
bg={colors.trans.dark[2]}
/>
<Stack justify='space-between' h={"100%"} gap={0} p={"lg"} pos={"relative"}>
<Box p={"lg"}>
<Text
c={"white"}
size={"1.5rem"}
style={{
textAlign: "center",
}}>{v.title}</Text>
</Box>
<Text
fw={"bold"}
c={"white"}
size={"3.5rem"}
style={{
textAlign: "center",
}}>{v.value}</Text>
<Group justify="center">
<Button px={46} radius={"100"} size="md" bg={colors["blue-button"]}>
Detail
</Button>
</Group>
</Stack>
</BackgroundImage>
)
})}
</SimpleGrid>
</Stack>
</>
);
}
export default Apbdes;

View File

@@ -1,16 +0,0 @@
"use client";
import { Center, Container, Stack, Text } from "@mantine/core";
function Content5() {
return (
<Stack>
<Container w={{ base: "100%", md: "80%" }} p={"xl"} h={720}>
<Center>
<Text fz={"3.4rem"}>Berkolaborasi membangun desa</Text>
</Center>
</Container>
</Stack>
);
}
export default Content5;

View File

@@ -1,18 +0,0 @@
"use client";
import { Stack, Container, Center, Text } from "@mantine/core";
function Content6() {
return (
<Stack>
<Container w={{ base: "100%", md: "80%" }} p={"xl"} h={720}>
<Center>
<Text fz={"3.4rem"}>Indeks Kepuasan Masyarakat</Text>
</Center>
</Container>
</Stack>
);
}
export default Content6;

View File

@@ -1,13 +0,0 @@
import { Stack, Container, Center, Text } from "@mantine/core";
export default function Content7() {
return (
<Stack>
<Container w={{ base: "100%", md: "80%" }} p={"xl"} h={720}>
<Center>
<Text fz={"3.4rem"}>APBDES Darmasaba</Text>
</Center>
</Container>
</Stack>
);
}

View File

@@ -0,0 +1,89 @@
"use client";
import colors from "@/con/colors";
import { Box, Button, Center, Container, Flex, Paper, SimpleGrid, Stack, Text, useMantineTheme } from "@mantine/core";
import { useMediaQuery } from "@mantine/hooks";
import { IconClipboardText } from "@tabler/icons-react";
import { motion } from "motion/react";
function DesaAntiKorupsi() {
const data = [
{
judul: "PENGUATAN TATA LAKSANA",
deskripsi: "1.1 ADANYA PERDES/KEPUTUSAN KEPALA DESA/SOP TENTANG PERENCANAAN, PELAKSANAAN, PENATAUSAHAAN DAN PERTANGGUNG JAWABAN APBDES BESERTA IMPLEMENTASINYA",
icon: <IconClipboardText size={180} color={colors["blue-button"]} />,
},
{
judul: "PENGUATAN TATA LAKSANA",
deskripsi: "1.1 ADANYA PERDES/KEPUTUSAN KEPALA DESA/SOP TENTANG PERENCANAAN, PELAKSANAAN, PENATAUSAHAAN DAN PERTANGGUNG JAWABAN APBDES BESERTA IMPLEMENTASINYA",
icon: <IconClipboardText size={180} color={colors["blue-button"]} />,
},
{
judul: "PENGUATAN TATA LAKSANA",
deskripsi: "1.1 ADANYA PERDES/KEPUTUSAN KEPALA DESA/SOP TENTANG PERENCANAAN, PELAKSANAAN, PENATAUSAHAAN DAN PERTANGGUNG JAWABAN APBDES BESERTA IMPLEMENTASINYA",
icon: <IconClipboardText size={180} color={colors["blue-button"]} />,
},
{
judul: "PENGUATAN TATA LAKSANA",
deskripsi: "1.1 ADANYA PERDES/KEPUTUSAN KEPALA DESA/SOP TENTANG PERENCANAAN, PELAKSANAAN, PENATAUSAHAAN DAN PERTANGGUNG JAWABAN APBDES BESERTA IMPLEMENTASINYA",
icon: <IconClipboardText size={180} color={colors["blue-button"]} />,
},
{
judul: "PENGUATAN TATA LAKSANA",
deskripsi: "1.1 ADANYA PERDES/KEPUTUSAN KEPALA DESA/SOP TENTANG PERENCANAAN, PELAKSANAAN, PENATAUSAHAAN DAN PERTANGGUNG JAWABAN APBDES BESERTA IMPLEMENTASINYA",
icon: <IconClipboardText size={180} color={colors["blue-button"]} />,
},
{
judul: "PENGUATAN TATA LAKSANA",
deskripsi: "1.1 ADANYA PERDES/KEPUTUSAN KEPALA DESA/SOP TENTANG PERENCANAAN, PELAKSANAAN, PENATAUSAHAAN DAN PERTANGGUNG JAWABAN APBDES BESERTA IMPLEMENTASINYA",
icon: <IconClipboardText size={180} color={colors["blue-button"]} />,
},
]
const theme = useMantineTheme();
const mobile = useMediaQuery(`(max-width: ${theme.breakpoints.sm})`);
return (
<Stack gap={"0"} bg={colors.Bg} p={"sm"} h={mobile ? 2000 : 1150}>
<Container w={{ base: "100%", md: "80%" }} p={"xl"} >
<Center>
<Text fz={"3.4rem"}>Desa Anti Korupsi</Text>
</Center>
<Text ta={"center"} fz={"1.4rem"}>Desa antikorupsi mendorong pemerintahan jujur dan transparan. Keuangan desa dikelola terbuka dengan melibatkan warga mengawasi anggaran, sehingga digunakan tepat sasaran sesuai kebutuhan.</Text>
</Container>
<SimpleGrid
pt={50}
cols={{
base: 1,
sm: 2,
}}>
{data.map((v, k) => {
return (
<motion.div
key={k}
whileTap={{ scale: 0.8 }}
>
<Paper p={"lg"} >
<Flex gap={"lg"} justify={"center"} align={"center"}>
<Box >
<Text fz={"lg"} ta={"center"} c={colors["blue-button"]}>{v.judul}</Text>
<Flex gap={"lg"} justify={"center"} align={"center"}>
{v.icon}
<Box>
<Text fz={"sm"} ta={"justify"}>{v.deskripsi}</Text>
<Box pt={10}>
<Button bg={colors["blue-button"]} radius={"lg"}>Download</Button>
</Box>
</Box>
</Flex>
</Box>
</Flex>
</Paper>
</motion.div>
)
})}
</SimpleGrid>
</Stack>
);
}
export default DesaAntiKorupsi;

View File

@@ -0,0 +1,173 @@
"use client";
import { Stack, Container, Center, Text, Paper, Flex, Box, SimpleGrid } from "@mantine/core";
import { BarChart, PieChart } from '@mantine/charts';
import colors from "@/con/colors";
const dataBarChart = [
{
bulan: "Januari",
responden: "480"
},
{
bulan: "Februari",
responden: "730"
},
{
bulan: "Maret",
responden: "740"
},
{
bulan: "April",
responden: "80"
},
{
bulan: "Mei",
responden: "250"
},
{
bulan: "Juni",
responden: "900"
},
{
bulan: "Juli",
responden: "230"
},
{
bulan: "Agustus",
responden: "255"
},
{
bulan: "September",
responden: "650"
},
{
bulan: "Oktober",
responden: "730"
},
{
bulan: "November",
responden: "800"
},
{
bulan: "Desember",
responden: "1000"
},
]
const dataPieChart = [
{ name: "Laki-laki", value: 70, color: colors["blue-button"] },
{ name: "Perempuan", value: 30, color: colors.orange },
]
const dataPieChart2 = [
{ name: "Sangat Baik", value: 75, color: colors["blue-button"] },
{ name: "Buruk", value: 25, color: colors.orange },
]
const dataPieChart3 = [
{ name: "Umur 18-44", value: 65, color: colors["blue-button"] },
{ name: "Umur 44-60+", value: 35, color: colors.orange },
]
function Kepuasan() {
return (
<Stack p={"sm"}>
<Container w={{ base: "100%", md: "80%" }} p={"xl"}>
<Center>
<Text fz={"3.4rem"}>Indeks Kepuasan Masyarakat</Text>
</Center>
<Text fz={"1.4rem"} ta={"center"}>Ukur kebahagiaan warga, tingkatkan layanan desa! Dengan partisipasi aktif masyarakat, kami berkomitmen untuk terus memperbaiki layanan agar lebih transparan, efektif, dan sesuai dengan kebutuhan warga. Kepuasan Anda adalah prioritas utama kami dalam membangun desa yang lebih baik!</Text>
</Container>
<Box px={"xl"}>
<Paper p={"lg"} bg={colors.Bg}>
<Paper p={"lg"}>
<Flex justify={"space-between"} align={"center"}>
<Text fw={"bold"}>Pelayanan Terhadap Publik Desa Darmasaba</Text>
<Box>
<Text fz={"h1"} fw={"bold"} c={colors["blue-button"]}>95.00</Text>
<Text >Sangat Baik</Text>
<Text fz={"sm"} fw={"bold"} c={colors["blue-button"]}>Total 2500 responden</Text>
</Box>
</Flex>
<BarChart
py={"xl"}
h={300}
data={dataBarChart}
dataKey="bulan"
tickLine="y"
series={[
{
name: "responden",
color: colors["blue-button"],
},
]}
/>
</Paper>
<Box py={"xl"}>
<SimpleGrid
cols={{
base: 1,
sm: 3
}}
>
<Box>
<Paper p={"lg"}>
<Text fw={"bold"}>Jenis Kelamin</Text>
<Box py={"xl"}>
<PieChart
size={250}
withLabelsLine
labelsPosition="outside"
labelsType="percent"
withLabels
data={dataPieChart}
withTooltip tooltipDataSource="segment" mx="auto"
/>
</Box>
</Paper>
</Box>
<Box>
<Paper p={"lg"}>
<Text fw={"bold"}>Pilihan</Text>
<Box py={"xl"}>
<PieChart
size={250}
withLabelsLine
labelsPosition="outside"
labelsType="percent"
withLabels
data={dataPieChart2}
withTooltip tooltipDataSource="segment" mx="auto"
/>
</Box>
</Paper>
</Box>
<Box>
<Paper p={"lg"}>
<Text fw={"bold"}>Umur</Text>
<Box py={"xl"}>
<PieChart
size={250}
withLabelsLine
labelsPosition="outside"
labelsType="percent"
withLabels
data={dataPieChart3}
withTooltip tooltipDataSource="segment" mx="auto"
/>
</Box>
</Paper>
</Box>
</SimpleGrid>
</Box>
</Paper>
</Box>
</Stack>
);
}
export default Kepuasan;

View File

@@ -93,7 +93,7 @@ function LandingPage() {
bg={"white"}
>
<Image
src={"/assets/images/pudak-icon.png"}
src={"/api/img/pudak-icon.png"}
alt="icon"
sizes={"100%"}
fit="contain"

View File

@@ -18,40 +18,77 @@ import { useMediaQuery } from "@mantine/hooks";
import Autoplay from "embla-carousel-autoplay";
import _ from "lodash";
import { useTransitionRouter } from "next-view-transitions";
import Link from "next/link";
import { useRef } from "react";
import useSWR from "swr";
const data = [
{
id: 1,
images: "/assets/images/layanan/test.png",
name: "Surat Keterangan Domisili Organisasi"
images: "/api/img/test.png",
name: "Surat Keterangan Domisili Organisasi",
link: "/darmasaba/desa/layanan/domisili"
},
{
id: 2,
images: "/assets/images/layanan/test3.jpeg",
name: "Surat Keterangan Penghasilan"
images: "/api/img/test-3.jpeg",
name: "Surat Keterangan Penghasilan",
link: "/darmasaba/desa/layanan/penghasilan"
},
{
id: 3,
images: "/assets/images/layanan/test2.jpeg",
name: "Surat Keterangan Tidak Mampu"
images: "/api/img/domisili.jpeg",
name: "Surat Keterangan Tidak Mampu",
link: "/darmasaba/desa/layanan/tidakmampu"
},
{
id: 4,
images: "/assets/images/layanan/kelahiran.jpeg",
name: "Surat Keterangan Kelahiran"
images: "/api/img/kelahiran.jpeg",
name: "Surat Keterangan Kelahiran",
link: "/darmasaba/desa/layanan/kelahiran"
},
{
id: 5,
images: "/assets/images/layanan/test.png",
name: "Surat Keterangan Usaha"
images: "/api/img/keterangan-usaha.jpeg",
name: "Surat Keterangan Usaha",
link: "/darmasaba/desa/layanan/usaha"
},
{
id: 6,
images: "/assets/images/layanan/test2.jpeg",
name: "Surat Keterangan Kematian"
images: "/api/img/kematian.jpeg",
name: "Surat Keterangan Kematian",
link: "/darmasaba/desa/layanan/kematian"
},
{
id: 7,
images: "/api/img/tempatusaha.jpeg",
name: "Surat Keterangan Tempat Usaha",
link: "/darmasaba/desa/layanan/tempatusaha"
},
{
id: 8,
images: "/api/img/belumkawin.jpeg",
name: "Surat Keterangan Belum Kawin",
link: "/darmasaba/desa/layanan/belumkawin"
},
{
id: 9,
images: "/api/img/berkelakuan-baik.jpeg",
name: "Surat Keterangan Kelakuan Baik",
link: "/darmasaba/desa/layanan/skck"
},
{
id: 10,
images: "/api/img/biodata.jpeg",
name: "Surat Keterangan Beda Biodata Diri",
link: "/darmasaba/desa/layanan/biodata"
},
{
id: 11,
images: "/api/img/yatim.jpeg",
name: "Surat Keterangan Yatim Piatu",
link: "/darmasaba/desa/layanan/yatim"
}
]
const textHeading = {
@@ -83,13 +120,11 @@ function Layanan() {
>
{textHeading.des}
</Text>
{/* <Box p={"md"}>
<Button onClick={() => {
router.push("/layanan")
}} variant="filled" bg={"dark"} radius={100}>
Lanjutkan
<Box p={"md"}>
<Button component={Link} href={"/darmasaba/desa/layanan"} variant="filled" bg={colors["blue-button"]} radius={100}>
Detail
</Button>
</Box> */}
</Box>
</Stack>
</Container>
<Slider />
@@ -126,6 +161,7 @@ function Slider() {
<Stack justify="space-between" h={"100%"} gap={0} p={"lg"} pos={"relative"} >
<Box p={"lg"}>
<Text
fw={"bold"}
c={"white"}
size={"3.5rem"}
@@ -137,9 +173,7 @@ function Slider() {
</Text>
</Box>
<Group justify="center">
<Button onClick={() => {
router.push(`/layanan/${item.id}`)
}} px={46} radius={"100"} size="md">
<Button component={Link} href={item.link} px={46} radius={"100"} size="md" bg={colors["blue-button"]}>
Detail
</Button>
</Group>

View File

@@ -1,4 +1,5 @@
'use client';
import colors from "@/con/colors";
import { Stack, Box, Container, Button, Text } from "@mantine/core";
import { useTransitionRouter } from 'next-view-transitions'
@@ -54,7 +55,7 @@ function Penghargaan() {
Juara Favorit Lomba Video Pendek
</Text>
</Stack>
<Button onClick={() => router.push("/penghargaan")} variant="white" radius={100}>
<Button color={colors["blue-button"]} onClick={() => router.push("/darmasaba/penghargaan")} variant="white" radius={100}>
Selanjutnya
</Button>
</Stack>

View File

@@ -16,19 +16,45 @@ import {
} from "@mantine/core";
import _ from "lodash";
import { motion } from "motion/react";
import { useRouter } from "next/navigation";
import useSWR from "swr";
type DataPotensi = {
id: string;
name: string;
};
const datamap = [
{
id: 1,
images: "/api/img/tps.png",
name: "TPS3R Pudak Mesari",
deskripsi: "TPS 3R Pudak Mesari Darmasaba layak mendapat penghargaan demikian apresiasi dari Delterra Sosial Indonesia nie Semeton Darmasaba!, Hal tersebut dikarenakan walaupun baru berdiri namun TPS 3R kebanggaan Desa Darmasaba tersebut sudah berjalan dengan sangat baik. "
},
{
id: 2,
images: "/api/img/ack.png",
name: "Bumdes Pudak Mesari",
deskripsi: "Bumdes Pudak Mesari sangat membantu warga desa Darmasaba dalam mengelola dan membangun sebuah desa yang lebih baik lagi"
},
{
id: 3,
images: "/api/img/taman-beji.jpg",
name: "Taman Beji Cengana",
deskripsi: "Tirta Klebutan di Pura Taman Beji Cengana di Desa Adat Darmasaba, Badung, selain dipercaya nunas Taksu serta pembersihan diri. Tersemat juga asal usul cerita ditemukannya Tirta Klebutan yang tepat berada di pinggir Tukad Cengana tersebut."
},
{
id: 4,
images: "/api/img/waterpark.png",
name: "Gumuh Sari Water Park",
deskripsi: "Gumuh Sari Rekreasi atau waterpark, tempat wisata yang asyik dan seru untuk kamu sekeluarga! Tempat liburan di Bali memang seakan nggak ada habisnya. Selalu ada aja destinasi wisata seru yang bisa jadi wishlist. Ada banyak banget tempat wisata yang kamu kunjungi di Bali, mulai dari wisata alam, wisata modern, sampai wisata air."
},
]
const textHeading = {
title: "Potensi",
des: "segenap sumber daya alam dan sumber daya manusia yang dimiliki desa sebagai modal dasar yang perlu dikelola dan dikembangkan bagi kelangsungan dan perkembangan desa",
des: "Tidak hanya untuk warga desa, fitur ini juga dapat digunakan oleh pemerintah desa untuk merencanakan program pengembangan berbasis potensi lokal",
};
function Content4() {
function Potensi() {
const router = useRouter()
const { data, isLoading } = useSWR("/", (url) =>
ApiFetch.api.potensi.get().then(({ data }) => data?.data)
);
@@ -57,7 +83,7 @@ function Content4() {
whileTap={{ scale: 0.8 }}
>
<BackgroundImage
src={images.tps}
src={datamap[k].images}
h={320}
key={k}
radius={16}
@@ -84,15 +110,16 @@ function Content4() {
}}
>
<Text fw={"bold"} c={"gray.1"} size={"2.4rem"}>
{v.name}
{datamap[k].name}
</Text>
<Text
lineClamp={2}
style={{
textAlign: "center",
textAlign: "justify",
}}
c={"blue"}
c={colors["white-1"]}
>
Tambahkan Text Indikasi Keberhasilan
{datamap[k].deskripsi}
</Text>
</Stack>
</BackgroundImage>
@@ -101,20 +128,8 @@ function Content4() {
</SimpleGrid>
<Stack align="center">
<Group>
<Stack gap={0}>
<Title>Text Lanjutan Mengarahkan</Title>
<Text
style={{
textAlign: "center",
}}
>
deskripsi singkat sebelum tombol dibawah setelah ini
</Text>
</Stack>
</Group>
<Group>
<Button variant="outline" radius={100} size="md">
Selanjutnya
<Button onClick={() => router.push("/darmasaba/desa/potensi")} color={colors["blue-button"]} variant="outline" radius={100} size="md">
Selengkapnya
</Button>
</Group>
</Stack>
@@ -123,4 +138,4 @@ function Content4() {
);
}
export default Content4;
export default Potensi;

View File

@@ -0,0 +1,93 @@
import colors from "@/con/colors";
import { BackgroundImage, Box, Button, Center, Container, Group, SimpleGrid, Stack, Text } from "@mantine/core";
const data = [
{
id: 1,
title: "Tata Kelola Pemerintahan",
image: "/api/img/lombadesa.jpg",
deskripsi: "Juara 1 Lomba Desa Tingkat Kabupaten/Kota Tahun [XXXX]"
},
{
id: 2,
title: "Tata Kelola Pemerintahan",
image: "/api/img/lombadesa.jpg",
deskripsi: "Juara 1 Lomba Desa Tingkat Kabupaten/Kota Tahun [XXXX]"
},
{
id: 3,
title: "Tata Kelola Pemerintahan",
image: "/api/img/lombadesa.jpg",
deskripsi: "Juara 1 Lomba Desa Tingkat Kabupaten/Kota Tahun [XXXX]"
},
]
function Prestasi() {
return (
<>
<Stack p={"sm"}>
<Container w={{ base: "100%", md: "80%" }} p={"xl"}>
<Center>
<Text fz={"3.4rem"}>Prestasi Desa</Text>
</Center>
<Text fz={"1.4rem"} ta={"center"}>Kami bangga dengan apa yang telah dicapai desa kita hingga saat ini. Semoga prestasi ini menjadi inspirasi untuk terus berkarya dan berinovasi demi kemajuan bersama.</Text>
</Container>
<Box py={50}>
<SimpleGrid
cols={{
base: 1,
sm: 3
}}
>
{data.map((v, k) => {
return (
<BackgroundImage
key={k}
src={v.image}
h={720}
radius={16}
pos={"relative"}
>
<Box
style={{
borderRadius: 16,
zIndex: 0
}}
pos={"absolute"}
w={"100%"}
h={"100%"}
bg={colors.trans.dark[2]}
/>
<Stack justify="space-between" h={"100%"} gap={0} p={"lg"} pos={"relative"}>
<Box p={"lg"}>
<Text
c={"white"}
size={"1.5rem"}
ta={"center"}
>
{v.title}
</Text>
</Box>
<Text
fw={"bold"}
c={"white"}
size={"3.5rem"}
ta={"center"}
>
{v.deskripsi}
</Text>
<Group justify="center">
<Button px={46} radius={"100"} size="md" bg={colors["blue-button"]}>
Lihat Detail
</Button>
</Group>
</Stack>
</BackgroundImage>
)
})}
</SimpleGrid>
</Box>
</Stack>
</>
)
}
export default Prestasi;

View File

@@ -0,0 +1,40 @@
'use client'
import colors from "@/con/colors";
import { Box, Center, Container, Image, Paper, SimpleGrid, Stack, Text, useMantineTheme } from "@mantine/core";
import { useMediaQuery } from "@mantine/hooks";
export default function SDGS() {
const theme = useMantineTheme();
const mobile = useMediaQuery(`(max-width: ${theme.breakpoints.sm})`);
return (
<Stack p={"sm"}>
<Container w={{ base: "100%", md: "80%" }} p={"xl"}>
<Center>
<Text fz={"3.4rem"}>SDGs Desa</Text>
</Center>
<Text fz={"1.4rem"} ta={"center"}>SDGs Desa adalah upaya menerapkan 17 Tujuan Pembangunan Berkelanjutan di tingkat desa.
Dengan fokus pada pengentasan kemiskinan, pendidikan, kesehatan, kesetaraan gender, dan pelestarian lingkungan, kami berkomitmen untuk menciptakan desa yang lebih baik bagi semua</Text>
<Box py={50}>
<Paper p={"lg"} bg={colors.Bg}>
<SimpleGrid
cols={{
base: 1,
sm: 3,
}}>
<Center>
<Image src={"/api/img/sgdesa-1.png"} alt="" w={mobile ? 250 : 200} />
</Center>
<Center>
<Image src={"/api/img/sgdesa-2.png"} alt="" w={mobile ? 250 : 220} />
</Center>
<Center>
<Image src={"/api/img/sgdesa-3.png"} alt="" w={mobile ? 250 : 190} />
</Center>
</SimpleGrid>
</Paper>
</Box>
</Container>
</Stack>
);
}

View File

@@ -1,7 +1,10 @@
import colors from "@/con/colors";
import { Box, Space, Stack } from "@mantine/core";
import Footer from "@/app/darmasaba/_com/Footer";
import { Navbar } from "@/app/darmasaba/_com/Navbar";
import Footer from "./_com/Footer";
export default function Layout({ children }: { children: React.ReactNode }) {
return (

View File

@@ -1,24 +1,30 @@
import DesaAntiKorupsi from "@/app/darmasaba/_com/main-page/desaantikorupsi";
import Kepuasan from "@/app/darmasaba/_com/main-page/kepuasan";
import LandingPage from "@/app/darmasaba/_com/main-page/landing-page";
import Layanan from "@/app/darmasaba/_com/main-page/layanan";
import Penghargaan from "@/app/darmasaba/_com/main-page/penghargaan";
import Content3 from "@/app/darmasaba/_com/main-page/layanan";
import Content4 from "@/app/darmasaba/_com/main-page/content-4";
import Content5 from "@/app/darmasaba/_com/main-page/content-5";
import Content6 from "@/app/darmasaba/_com/main-page/content-6";
import Potensi from "@/app/darmasaba/_com/main-page/potensi";
import colors from "@/con/colors";
import SDGS from "./_com/main-page/sdgs";
// import ApiFetch from "@/lib/api-fetch";
import { Stack } from "@mantine/core";
import Content7 from "@/app/darmasaba/_com/main-page/content-7";
import Apbdes from "./_com/main-page/apbdes";
import Prestasi from "./_com/main-page/prestasi";
export default function Page() {
return (
<Stack bg={colors.grey[1]} gap={"4rem"}>
<LandingPage />
<Penghargaan />
<Content3 />
<Content4 />
<Content5 />
<Content6 />
<Content7 />
<Layanan />
<Potensi />
<DesaAntiKorupsi />
<Kepuasan />
<SDGS />
<Apbdes />
<Prestasi/>
</Stack>
);
}

View File

@@ -7,6 +7,7 @@ import "animate.css";
import 'react-simple-toasts/dist/style.css';
import 'react-simple-toasts/dist/theme/dark.css';
import "./globals.css";
import '@mantine/charts/styles.css';
@@ -20,7 +21,7 @@ import {
import { ViewTransitions } from "next-view-transitions";
export const metadata = {
title: "desa darmasaba",
title: "Desa Darmasaba",
description: "Desa Darmasaba Kabupaten Badung",
};

View File

@@ -1,4 +1,5 @@
const colors = {
"orange": "#FCAE00",
"blue-button": "#0A4E78",
"white-1": "#FBFBFC",
"white-trans-1": "rgba(255, 255, 255, 0.5)",

View File

@@ -1,277 +1,331 @@
const navbarListMenu = [
{
id: "1",
name: "Desa",
href: "/darmasaba/desa",
name: "PPID",
href: "/darmasaba/ppid",
children: [
{
id: "1.1",
name: "profile",
href: "/darmasaba/desa/profile"
name: "Profile PPID",
href: "/darmasaba/ppid/profileppid"
},
{
id: "1.2",
name: "potensi",
href: "/darmasaba/desa/potensi"
name: "Struktur PPID",
href: "/darmasaba/ppid/struktur"
},
{
id: "1.3",
name: "berita",
href: "/darmasaba/desa/berita"
name: "Visi Misi PPID",
href: "/darmasaba/ppid/visi"
},
{
id: "1.4",
name: "pengumuman",
href: "/darmasaba/desa/pengumuman"
name: "Dasar Hukum",
href: "/darmasaba/ppid/hukum"
},
{
id: "1.5",
name: "galery",
href: "/darmasaba/desa/galery"
name: "Permohonan Informasi Publik",
href: "/darmasaba/ppid/informasi"
},
{
id: "1.6",
name: "layanan",
href: "/darmasaba/desa/layanan"
name: "Permohonan Keberatan Informasi Publik",
href: "/darmasaba/ppid/permohonan"
},
{
id: "1.7",
name: "Daftar Informasi Publik Desa Darmasaba",
href: "/darmasaba/ppid/daftar"
},
{
id: "1.8",
name: "IKM Desa Darmasaba",
href: "/darmasaba/ppid/ikm"
},
]
},
{
id: "2",
name: "Desa",
href: "/darmasaba/desa",
children: [
{
id: "2.1",
name: "Profile",
href: "/darmasaba/desa/profile"
},
{
id: "2.2",
name: "Potensi",
href: "/darmasaba/desa/potensi"
},
{
id: "2.3",
name: "Berita",
href: "/darmasaba/desa/berita"
},
{
id: "2.4",
name: "Pengumuman",
href: "/darmasaba/desa/pengumuman"
},
{
id: "2.5",
name: "Gallery",
href: "/darmasaba/desa/galery"
},
{
id: "2.6",
name: "Layanan",
href: "/darmasaba/desa/layanan"
},
{
id: "2.7",
name: "Penghargaan",
href: "/darmasaba/penghargaan"
}
]
},
{
id: "3",
name: "Kesehatan",
href: "/darmasaba/kesehatan",
children: [
{
id: "2.1",
id: "3.1",
name: "Posyandu",
href: "/darmasaba/kesehatan/posyandu"
},
{
id: "2.2",
id: "3.2",
name: "Data Kesehatan Warga",
href: "/darmasaba/kesehatan/data-kesehatan-warga"
},
{
id: "2.3",
id: "3.3",
name: "Puskesmas",
href: "/darmasaba/kesehatan/puskesmas"
},
{
id: "2.4",
id: "3.4",
name: "Program Kesehatan",
href: "/darmasaba/kesehatan/program-kesehatan"
},
{
id: "2.5",
id: "3.5",
name: "Penanganan Darurat",
href: "/darmasaba/kesehatan/penanganan-darurat"
},
{
id: "2.6",
id: "3.6",
name: "Kontak Darurat",
href: "/darmasaba/kesehatan/kontak-darurat"
},
{
id: "2.7",
id: "3.7",
name: "Info Wabah/Penyakit",
href: "/darmasaba/kesehatan/info-wabah-penyakit"
}
]
},
{
id: "3",
id: "4",
name: "Keamanan",
href: "/darmasaba/keamanan",
children: [
{
id: "3.1",
id: "4.1",
name: "Keamanan Lingkungan (Pecalang/Patwal)",
href: "/darmasaba/keamanan/keamanan-lingkungan"
},
{
id: "3.2",
id: "4.2",
name: "Polsek Terdekat",
href: "/darmasaba/keamanan/polsek-terdekat"
},
{
id: "3.3",
id: "4.3",
name: "Kontak Darurat",
href: "/darmasaba/keamanan/kontak-darurat"
},
{
id: "3.4",
id: "4.4",
name: "Pencegahan Kriminalitas",
href: "/darmasaba/keamanan/pencegahan-kriminalitas"
},
{
id: "3.5",
id: "4.5",
name: "Laporan Publik",
href: "/darmasaba/keamanan/laporan-publik"
},
{
id: "3.6",
id: "4.6",
name: "Tips Keamanan",
href: "/darmasaba/keamanan/tips-keamanan"
}
]
},
{
id: "4",
id: "5",
name: "Ekonomi",
href: "/darmasaba/ekonomi",
children: [
{
id: "4.1",
id: "5.1",
name: "Pasar Desa",
href: "/darmasaba/ekonomi/pasar-desa"
},
{
id: "4.2",
id: "5.2",
name: "Koperasi",
href: "/darmasaba/ekonomi/koperasi"
},
{
id: "4.3",
id: "5.3",
name: "UMKM",
href: "/darmasaba/ekonomi/umkm"
},
{
id: "4.4",
id: "5.4",
name: "Data Ekonomi Desa",
href: "/darmasaba/ekonomi/data-ekonomi-desa"
},
{
id: "4.5",
id: "5.5",
name: "Pelatihan Wirausaha",
href: "/darmasaba/ekonomi/pelatihan-wirausaha"
},
{
id: "4.6",
id: "5.6",
name: "Bantuan & Pendanaan",
href: "/darmasaba/ekonomi/bantuan-pendanaan"
},
{
id: "4.7",
id: "5.7",
name: "Investasi Desa",
href: "/darmasaba/ekonomi/investasi-desa"
},
{
id: "4.8",
id: "5.8",
name: "Produk Unggulan",
href: "/darmasaba/ekonomi/produk-unggulan"
},
{
id: "4.9",
id: "5.9",
name: "Lowongan Kerja Lokal",
href: "/darmasaba/ekonomi/lowongan-kerja-lokal"
}
]
}, {
id: "5",
id: "6",
name: "Inovasi",
href: "/darmasaba/inovasi",
children: [
{
id: "5.1",
id: "6.1",
name: "Desa Digital/Smart Village",
href: "/darmasaba/inovasi/desa-digital-smart-village"
},
{
id: "5.2",
id: "6.2",
name: "Layanan Online Desa",
href: "/darmasaba/inovasi/layanan-online-desa"
},
{
id: "5.3",
id: "6.3",
name: "Program Kreatif Desa",
href: "/darmasaba/inovasi/program-kreatif-desa"
},
{
id: "5.4",
id: "6.4",
name: "Kolaborasi Inovasi",
href: "/darmasaba/inovasi/kolaborasi-inovasi"
},
{
id: "5.5",
id: "6.5",
name: "Info Teknologi Tepat Guna",
href: "/darmasaba/inovasi/info-teknologi-tepat-guna"
},
{
id: "5.6",
id: "6.6",
name: "Ajukan Ide Inovatif",
href: "/darmasaba/inovasi/ajukan-ide-inovatif"
}
]
}, {
id: "6",
id: "7",
name: "Lingkungan",
href: "/darmasaba/lingkungan",
children: [
{
id: "6.1",
id: "7.1",
name: "Pengelolaan Sampah (Bank Sampah)",
href: "/darmasaba/lingkungan/pengelolaan-sampah-bank-sampah"
},
{
id: "6.2",
id: "7.2",
name: "Program Penghijauan",
href: "/darmasaba/lingkungan/program-penghijauan"
},
{
id: "6.3",
id: "7.3",
name: "Data Lingkungan Desa",
href: "/darmasaba/lingkungan/data-lingkungan-desa"
},
{
id: "6.4",
id: "7.4",
name: "Gotong Royong",
href: "/darmasaba/lingkungan/gotong-royong"
},
{
id: "6.5",
id: "7.5",
name: "Edukasi Lingkungan",
href: "/darmasaba/lingkungan/edukasi-lingkungan"
},
{
id: "6.6",
id: "7.6",
name: "Konservasi Adat Bali",
href: "/darmasaba/lingkungan/konservasi-adat-bali"
}
]
}, {
id: "7",
id: "8",
name: "Pendidikan",
href: "/darmasaba/pendidikan",
children: [
{
id: "7.1",
id: "8.1",
name: "Info Sekolah & PAUD",
href: "/darmasaba/pendidikan/info-sekolah-paud"
},
{
id: "7.2",
id: "8.2",
name: "Beasiswa Desa",
href: "/darmasaba/pendidikan/beasiswa-desa"
},
{
id: "7.3",
id: "8.3",
name: "Program Pendidikan Anak",
href: "/darmasaba/pendidikan/program-pendidikan-anak"
},
{
id: "7.4",
id: "8.4",
name: "Bimbingan Belajar Desa",
href: "/darmasaba/pendidikan/bimbingan-belajar-desa"
},
{
id: "7.5",
id: "8.5",
name: "Pendidikan Non Formal",
href: "/darmasaba/pendidikan/pendidikan-non-formal"
},
{
id: "7.6",
id: "8.6",
name: "Perpustakaan Desa",
href: "/darmasaba/pendidikan/perpustakaan-desa"
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 195 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 142 KiB