Compare commits
13 Commits
nico/14-ma
...
nico/14-ap
| Author | SHA1 | Date | |
|---|---|---|---|
| 1138fe14d0 | |||
| 4bd9ef6acf | |||
| 4824e4e848 | |||
| 8b26a91ce9 | |||
| e33db73d65 | |||
| 1bb808da3b | |||
| 50a46e2ca7 | |||
| 40b49c83ae | |||
| 525b4a8474 | |||
| e9aab942c6 | |||
| e082e8ce75 | |||
| a106fe658f | |||
| 1347afb7d1 |
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "desa-darmasaba",
|
||||
"version": "0.1.0",
|
||||
"version": "0.1.1",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev --turbopack",
|
||||
@@ -13,6 +13,7 @@
|
||||
"seed": "bun run prisma/seed.ts"
|
||||
},
|
||||
"dependencies": {
|
||||
"@cubejs-client/core": "^0.31.0",
|
||||
"@elysiajs/cors": "^1.2.0",
|
||||
"@elysiajs/eden": "^1.2.0",
|
||||
"@elysiajs/stream": "^1.1.0",
|
||||
@@ -30,6 +31,7 @@
|
||||
"add": "^2.0.6",
|
||||
"animate.css": "^4.1.1",
|
||||
"bun": "^1.2.2",
|
||||
"chart.js": "^4.4.8",
|
||||
"elysia": "^1.2.12",
|
||||
"embla-carousel-autoplay": "^8.5.2",
|
||||
"embla-carousel-react": "^7.1.0",
|
||||
@@ -60,6 +62,7 @@
|
||||
"postcss": "^8.5.1",
|
||||
"postcss-preset-mantine": "^1.17.0",
|
||||
"postcss-simple-vars": "^7.0.1",
|
||||
"typescript": "^5"
|
||||
"typescript": "^5",
|
||||
"parcel": "^2.6.2"
|
||||
}
|
||||
}
|
||||
|
||||
185
src/app/darmasaba/(pages)/desa/berita/(tabs)/budaya.tsx
Normal file
185
src/app/darmasaba/(pages)/desa/berita/(tabs)/budaya.tsx
Normal file
@@ -0,0 +1,185 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Container, Divider, Grid, GridCol, Group, Image, Pagination, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconCalendar, IconUser } from '@tabler/icons-react';
|
||||
import React from 'react';
|
||||
|
||||
const dataBeritaTerbaru = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik',
|
||||
image: "/api/img/berita-1.png",
|
||||
tanggal: "Selasa, 11 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/prestasi-voli.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/prestasi-voli.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
]
|
||||
function Budaya() {
|
||||
return (
|
||||
<Box py={20}>
|
||||
<Container size="xl" px={{ base: "md", md: "xl" }}>
|
||||
<Grid gutter={{ base: "md", md: "xl" }} pb={70}>
|
||||
{/* Berita Utama */}
|
||||
<GridCol span={{ base: 12, md: 8 }}>
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="md">
|
||||
<Box>
|
||||
<Image
|
||||
src="/api/img/berita-1.png"
|
||||
alt="Darmasaba Smart Village"
|
||||
radius="md"
|
||||
fit="cover"
|
||||
h={{ base: 450, md: 660 }}
|
||||
/>
|
||||
</Box>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz={{ base: "xl", md: "2xl" }} fw="bold" lineClamp={2}>
|
||||
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
|
||||
</Text>
|
||||
<Text size="md" lineClamp={3}>
|
||||
Desa Darmasaba mengambil langkah maju dalam transformasi digital dengan meluncurkan aplikasi Smart Village yang memudahkan warga dalam mengakses layanan publik secara online.
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</GridCol>
|
||||
|
||||
{/* Berita Sampingan */}
|
||||
<GridCol span={{ base: 12, md: 4 }}>
|
||||
<Stack gap="md">
|
||||
{/* Berita Sampingan 1 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/prestasi-voli.jpeg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Berita Sampingan 2 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/prestasi-voli.jpeg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Sosial</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Tim Voli Darmasaba Raih Juara Turnamen Desa
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
<Box pb={30}>
|
||||
<Text fz={"h1"} fw={"bold"}>Berita Terbaru</Text>
|
||||
<Divider color={colors["blue-button"]} />
|
||||
</Box>
|
||||
<SimpleGrid cols={{ base: 1, md: 3 }}>
|
||||
{dataBeritaTerbaru.map((v, k) => {
|
||||
return (
|
||||
<Paper key={k} p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src={v.image}
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">{v.tanggal}</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Box py={"xl"}>
|
||||
<Center>
|
||||
<Pagination total={10} />
|
||||
</Center>
|
||||
</Box>
|
||||
</Container>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default Budaya;
|
||||
185
src/app/darmasaba/(pages)/desa/berita/(tabs)/ekonomi.tsx
Normal file
185
src/app/darmasaba/(pages)/desa/berita/(tabs)/ekonomi.tsx
Normal file
@@ -0,0 +1,185 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Container, Divider, Grid, GridCol, Group, Image, Pagination, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconCalendar, IconUser } from '@tabler/icons-react';
|
||||
import React from 'react';
|
||||
|
||||
const dataBeritaTerbaru = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik',
|
||||
image: "/api/img/berita-1.png",
|
||||
tanggal: "Selasa, 11 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/prestasi-voli.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/prestasi-voli.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
]
|
||||
function Ekonomi() {
|
||||
return (
|
||||
<Box py={20}>
|
||||
<Container size="xl" px={{ base: "md", md: "xl" }}>
|
||||
<Grid gutter={{ base: "md", md: "xl" }} pb={70}>
|
||||
{/* Berita Utama */}
|
||||
<GridCol span={{ base: 12, md: 8 }}>
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="md">
|
||||
<Box>
|
||||
<Image
|
||||
src="/api/img/berita-1.png"
|
||||
alt="Darmasaba Smart Village"
|
||||
radius="md"
|
||||
fit="cover"
|
||||
h={{ base: 450, md: 660 }}
|
||||
/>
|
||||
</Box>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz={{ base: "xl", md: "2xl" }} fw="bold" lineClamp={2}>
|
||||
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
|
||||
</Text>
|
||||
<Text size="md" lineClamp={3}>
|
||||
Desa Darmasaba mengambil langkah maju dalam transformasi digital dengan meluncurkan aplikasi Smart Village yang memudahkan warga dalam mengakses layanan publik secara online.
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</GridCol>
|
||||
|
||||
{/* Berita Sampingan */}
|
||||
<GridCol span={{ base: 12, md: 4 }}>
|
||||
<Stack gap="md">
|
||||
{/* Berita Sampingan 1 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/prestasi-voli.jpeg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Berita Sampingan 2 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/prestasi-voli.jpeg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Sosial</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Tim Voli Darmasaba Raih Juara Turnamen Desa
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
<Box pb={30}>
|
||||
<Text fz={"h1"} fw={"bold"}>Berita Terbaru</Text>
|
||||
<Divider color={colors["blue-button"]} />
|
||||
</Box>
|
||||
<SimpleGrid cols={{ base: 1, md: 3 }}>
|
||||
{dataBeritaTerbaru.map((v, k) => {
|
||||
return (
|
||||
<Paper key={k} p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src={v.image}
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">{v.tanggal}</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Box py={"xl"}>
|
||||
<Center>
|
||||
<Pagination total={10} />
|
||||
</Center>
|
||||
</Box>
|
||||
</Container>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default Ekonomi;
|
||||
187
src/app/darmasaba/(pages)/desa/berita/(tabs)/pembangunan.tsx
Normal file
187
src/app/darmasaba/(pages)/desa/berita/(tabs)/pembangunan.tsx
Normal file
@@ -0,0 +1,187 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Container, Divider, Grid, GridCol, Group, Image, Pagination, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconCalendar, IconUser } from '@tabler/icons-react';
|
||||
import React from 'react';
|
||||
|
||||
const dataBeritaTerbaru = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'PEMBANGUNAN TROTOARISASI JALAN LINGKUNGAN BR. GULINGAN',
|
||||
image: "/api/img/pembangunan-1.jpg",
|
||||
tanggal: "Selasa, 11 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'PEMBANGUNAN GOT JALAN LINGKUNGAN BR. TAMAN',
|
||||
image: "/api/img/pembangunan-2.jpg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'PEMBANGUNAN BALE GAMBELAN SETRA AGENG DESA ADAT TEGAL',
|
||||
image: "/api/img/pembangunan-3.jpg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
]
|
||||
function Pembangunan() {
|
||||
return (
|
||||
<Box py={20}>
|
||||
<Container size="xl" px={{ base: "md", md: "xl" }}>
|
||||
<Grid gutter={{ base: "md", md: "xl" }} pb={70}>
|
||||
{/* Berita Utama */}
|
||||
<GridCol span={{ base: 12, xl: 8 }}>
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="md">
|
||||
<Box>
|
||||
<Image
|
||||
src="/api/img/pembangunan-1.jpg"
|
||||
alt="PEMBANGUNAN TROTOARISASI JALAN LINGKUNGAN BR. GULINGAN"
|
||||
radius="md"
|
||||
fit="cover"
|
||||
h={{ base: 450, md: 615 }}
|
||||
/>
|
||||
</Box>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Pembangunan</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz={{ base: "xl", md: "2xl" }} fw="bold" lineClamp={2}>
|
||||
PEMBANGUNAN TROTOARISASI JALAN LINGKUNGAN BR. GULINGAN
|
||||
</Text>
|
||||
<Text size="md" lineClamp={3}>
|
||||
Sudah tertata rapi dan bersih niki Semeton Darmasaba! Sekarang pejalan kaki di seputaran jalan lingkungan Br. Gulingan bisa aman dan nyaman nie!!!
|
||||
|
||||
Pemdes Darmasaba dalam rangka memenuhi kebutuhan masyarakat khususnya warga Br. Gulingan yang memerlukan trotoarisasi guna memperlancar saluran air dan memberikan kenyamanan ketika berjalan, kini sudah menyelesaikan pembangunan trotoarisasi jalan lingkungan Br. Gulingan. Pembangunan tersebut menggunakan APBDes Darmasaba T. A. 2023 dengan realisasi sebesar Rp357.011.299,00 dari pagu yang disiapkan sebesar Rp439.066.327,00. Pembangunan trotoar tersebut melibatkan pekerja lokal dan dibantu oleh warga Br. Gulingan.
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</GridCol>
|
||||
|
||||
{/* Berita Sampingan */}
|
||||
<GridCol span={{ base: 12, xl: 4 }}>
|
||||
<Stack gap="md">
|
||||
{/* Berita Sampingan 1 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/pembangunan-2.jpg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={300}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Pembangunan</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
PEMBANGUNAN GOT JALAN LINGKUNGAN BR. TAMAN
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Berita Sampingan 2 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/pembangunan-3.jpg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={250}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Pembangunan</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
PEMBANGUNAN BALE GAMBELAN SETRA AGENG DESA ADAT TEGAL
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
<Box pb={30}>
|
||||
<Text fz={"h1"} fw={"bold"}>Berita Terbaru</Text>
|
||||
<Divider color={colors["blue-button"]} />
|
||||
</Box>
|
||||
<SimpleGrid cols={{ base: 1, md: 3 }}>
|
||||
{dataBeritaTerbaru.map((v, k) => {
|
||||
return (
|
||||
<Paper key={k} p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src={v.image}
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={200}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">{v.tanggal}</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Box py={"xl"}>
|
||||
<Center>
|
||||
<Pagination total={10} />
|
||||
</Center>
|
||||
</Box>
|
||||
</Container>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default Pembangunan;
|
||||
185
src/app/darmasaba/(pages)/desa/berita/(tabs)/pemerintahan.tsx
Normal file
185
src/app/darmasaba/(pages)/desa/berita/(tabs)/pemerintahan.tsx
Normal file
@@ -0,0 +1,185 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Container, Divider, Grid, GridCol, Group, Image, Pagination, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconCalendar, IconUser } from '@tabler/icons-react';
|
||||
import React from 'react';
|
||||
|
||||
const dataBeritaTerbaru = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'PEMBERIAN HASIL PANEN JAGUNG PROGRAM KETAHANAN PANGAN DESA KEPADA ANAK YATIM, PIATU DAN YATIM-PIATU DESA DARMASABA',
|
||||
image: "/api/img/berita-pemerintahan.jpg",
|
||||
tanggal: "Selasa, 11 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/pemerintahan-3.jpg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'PEMBERIAN HASIL PANEN JAGUNG PROGRAM KETAHANAN PANGAN DESA KEPADA ANAK YATIM, PIATU DAN YATIM-PIATU DESA DARMASABA',
|
||||
image: "/api/img/berita-pemerintahan.jpg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
]
|
||||
function Pemerintahan() {
|
||||
return (
|
||||
<Box py={20}>
|
||||
<Container size="xl" px={{ base: "md", md: "xl" }}>
|
||||
<Grid gutter={{ base: "md", md: "xl" }} pb={70}>
|
||||
{/* Berita Utama */}
|
||||
<GridCol span={{ base: 12, xl: 8 }}>
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="md">
|
||||
<Box>
|
||||
<Image
|
||||
src="/api/img/berita-pemerintahan.jpg"
|
||||
alt="Darmasaba Smart Village"
|
||||
radius="md"
|
||||
fit="cover"
|
||||
h={{ base: 450, md: 615 }}
|
||||
/>
|
||||
</Box>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Pemerintahan</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz={{ base: "xl", md: "2xl" }} fw="bold" lineClamp={2}>
|
||||
PEMBERIAN HASIL PANEN JAGUNG PROGRAM KETAHANAN PANGAN DESA KEPADA ANAK YATIM, PIATU DAN YATIM-PIATU DESA DARMASABA
|
||||
</Text>
|
||||
<Text size="md" lineClamp={3}>
|
||||
Pada hari Selasa, 19 November 2024, Desa Darmasaba memberikan hasil panen jagung sebagai bagian dari kegiatan Ketahanan Pangan Desa kepada anak-anak yatim, piatu, dan yatim-piatu yang berusia 0-18 Tahun. Hasil panen ini diserahkan langsung oleh I. B. Surya Prabhawa Manuaba, S.H., M.H., NL.P selaku Perbekel Darmasaba, didampingi Ketua BPD dan LPM Desa Darmasaba, serta seluruh perangkat dan staf desa. Melalui kegiatan ini, kami berharap dapat memberikan manfaat langsung bagi mereka yang membutuhkan, serta memperkuat rasa kebersamaan dan kepedulian dalam membangun ketahanan pangan di Desa Darmasaba.
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</GridCol>
|
||||
|
||||
{/* Berita Sampingan */}
|
||||
<GridCol span={{ base: 12, xl: 4 }}>
|
||||
<Stack gap="md">
|
||||
{/* Berita Sampingan 1 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/beritapemerintahan-2.jpeg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={300}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Pemerintahan</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Evaluasi dan Verifikasi APBDes Darmasaba T.A. 2025
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Berita Sampingan 2 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/pemerintahan-3.jpg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={250}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Pemerintahan</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
JAKSA GARDA DESA (JAGA DESA) T.A. 2025
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
<Box pb={30}>
|
||||
<Text fz={"h1"} fw={"bold"}>Berita Terbaru</Text>
|
||||
<Divider color={colors["blue-button"]} />
|
||||
</Box>
|
||||
<SimpleGrid cols={{ base: 1, md: 3 }}>
|
||||
{dataBeritaTerbaru.map((v, k) => {
|
||||
return (
|
||||
<Paper key={k} p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src={v.image}
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={200}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">{v.tanggal}</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Box py={"xl"}>
|
||||
<Center>
|
||||
<Pagination total={10} />
|
||||
</Center>
|
||||
</Box>
|
||||
</Container>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default Pemerintahan;
|
||||
185
src/app/darmasaba/(pages)/desa/berita/(tabs)/semua.tsx
Normal file
185
src/app/darmasaba/(pages)/desa/berita/(tabs)/semua.tsx
Normal file
@@ -0,0 +1,185 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Container, Divider, Grid, GridCol, Group, Image, Pagination, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconCalendar, IconUser } from '@tabler/icons-react';
|
||||
import React from 'react';
|
||||
|
||||
const dataBeritaTerbaru = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik',
|
||||
image: "/api/img/berita-1.png",
|
||||
tanggal: "Selasa, 11 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/prestasi-voli.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/prestasi-voli.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
]
|
||||
function Semua() {
|
||||
return (
|
||||
<Box py={20}>
|
||||
<Container size="xl" px={{ base: "md", md: "xl" }}>
|
||||
<Grid gutter={{ base: "md", md: "xl" }} pb={70}>
|
||||
{/* Berita Utama */}
|
||||
<GridCol span={{ base: 12, xl: 8 }}>
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="md">
|
||||
<Box>
|
||||
<Image
|
||||
src="/api/img/berita-1.png"
|
||||
alt="Darmasaba Smart Village"
|
||||
radius="md"
|
||||
fit="cover"
|
||||
h={{ base: 450, md: 610 }}
|
||||
/>
|
||||
</Box>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz={{ base: "xl", md: "2xl" }} fw="bold" lineClamp={2}>
|
||||
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
|
||||
</Text>
|
||||
<Text size="md" lineClamp={3}>
|
||||
Desa Darmasaba mengambil langkah maju dalam transformasi digital dengan meluncurkan aplikasi Smart Village yang memudahkan warga dalam mengakses layanan publik secara online.
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</GridCol>
|
||||
|
||||
{/* Berita Sampingan */}
|
||||
<GridCol span={{ base: 12, xl: 4 }}>
|
||||
<Stack gap="md">
|
||||
{/* Berita Sampingan 1 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/pembangunan-2.jpg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Pembangunan</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Berita Sampingan 2 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/prestasi-voli.jpeg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Sosial</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Tim Voli Darmasaba Raih Juara Turnamen Desa
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
<Box pb={30}>
|
||||
<Text fz={"h1"} fw={"bold"}>Berita Terbaru</Text>
|
||||
<Divider color={colors["blue-button"]} />
|
||||
</Box>
|
||||
<SimpleGrid cols={{ base: 1, xl: 3 }}>
|
||||
{dataBeritaTerbaru.map((v, k) => {
|
||||
return (
|
||||
<Paper key={k} p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src={v.image}
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">{v.tanggal}</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Box py={"xl"}>
|
||||
<Center>
|
||||
<Pagination total={10} />
|
||||
</Center>
|
||||
</Box>
|
||||
</Container>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default Semua;
|
||||
204
src/app/darmasaba/(pages)/desa/berita/(tabs)/sosial.tsx
Normal file
204
src/app/darmasaba/(pages)/desa/berita/(tabs)/sosial.tsx
Normal file
@@ -0,0 +1,204 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Container, Divider, Grid, GridCol, Group, Image, Pagination, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconCalendar, IconUser } from '@tabler/icons-react';
|
||||
import React from 'react';
|
||||
|
||||
const dataBeritaTerbaru = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'AKSI BERSIH DESA MEMPERINGATI HARI PEDULI SAMPAH NASIONAL 2025',
|
||||
image: "/api/img/sosial-1.jpeg",
|
||||
tanggal: "Selasa, 11 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Sosialisasi Pengelolaan Sampah di SD No. 3 Darmasaba dalam Kolaborasi Mahasiswa KKN-PMM I Universitas Warmadewa di Desa Darmasaba',
|
||||
image: "/api/img/sosial-2.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/prestasi-voli.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
]
|
||||
function Sosial() {
|
||||
return (
|
||||
<Box py={20}>
|
||||
<Container size="xl" px={{ base: "md", md: "xl" }}>
|
||||
<Grid gutter={{ base: "md", md: "xl" }} pb={70}>
|
||||
{/* Berita Utama */}
|
||||
<GridCol span={{ base: 12, md: 8 }}>
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="md">
|
||||
<Box>
|
||||
<Image
|
||||
src="/api/img/sosial-1.jpeg"
|
||||
alt="Darmasaba Smart Village"
|
||||
radius="md"
|
||||
fit="cover"
|
||||
h={{ base: 450, md: 635 }}
|
||||
/>
|
||||
</Box>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Sosial</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz={{ base: "xl", md: "2xl" }} fw="bold" lineClamp={2}>
|
||||
AKSI BERSIH DESA MEMPERINGATI HARI PEDULI SAMPAH NASIONAL 2025
|
||||
</Text>
|
||||
<Text size="md" lineClamp={3}>
|
||||
AKSI BERSIH DESA MEMPERINGATI HARI PEDULI SAMPAH NASIONAL 2025 ♻️
|
||||
Dalam semangat Hari Peduli Sampah Nasional (HPSN) 2025, Aksi Bersih Desa sukses digelar di Lombok Utara serta beberapa wilayah lain, termasuk Kabupaten Badung yang berpusat di TPS 3R Pudak Mesari, Desa Darmasaba. ?✨
|
||||
|
||||
Kegiatan ini melibatkan berbagai pihak seperti Pusdal LH BN - KLH, DKLH Provinsi Bali, DLHK Kab. Badung, Pemdes Darmasaba, BPD, LPM, TPS 3R Pudak Mesari, Lembaga Kemasyarakatan Desa, serta masyarakat Darmasaba.
|
||||
|
||||
Selain aksi bersih, Desa Darmasaba juga meluncurkan Pemuda Peduli Lingkungan sebagai garda terdepan dalam gerakan sadar lingkungan!
|
||||
|
||||
Mengapa ini penting?
|
||||
- Pengelolaan sampah harus dimulai dari sumbernya melalui pemilahan, pemanfaatan, hingga penyelesaian residu.
|
||||
- Inovasi "Galah Melah" & "BARES" menjadi contoh nyata dalam menciptakan lingkungan yang bersih & berkelanjutan.
|
||||
- Darmasaba terpilih sebagai 1 dari 8 desa se-Indonesia untuk peringatan HPSN 2025, sebuah kebanggaan sekaligus tanggung jawab bersama! ✨
|
||||
|
||||
"Kami berharap aksi ini bukan sekadar seremoni, tetapi menjadi budaya masyarakat dalam memilah dan mengelola sampah dari sumbernya." - Ibu Cokorda Istri Muter Handayani, Plt. Kabid Wilayah Bali, Pusat Pengendalian LH Bali & Nusra.
|
||||
|
||||
"Ke depan, kami menargetkan setiap desa di Badung memiliki komunitas Pemuda Peduli Lingkungan agar pengelolaan sampah lebih optimal dan berkelanjutan." - Bapak Ida Bagus Gede Arjana, Plt. Kadis DLHK Kab. Badung.
|
||||
|
||||
"Darmasaba menjadi contoh desa aktif dalam pengelolaan sampah. Kami berharap inovasi ini menginspirasi desa lain." - Ida Bagus Surya Prabhawa Manuaba, Perbekel Darmasaba.
|
||||
|
||||
Mari bersama wujudkan lingkungan yang lebih bersih, sehat, dan lestari!
|
||||
Jaga Bumi, Pilah Sampah dari Sekarang! ♻️
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</GridCol>
|
||||
|
||||
{/* Berita Sampingan */}
|
||||
<GridCol span={{ base: 12, md: 4 }}>
|
||||
<Stack gap="md">
|
||||
{/* Berita Sampingan 1 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/sosial-2.jpeg"
|
||||
alt="Darmasaba Smart Village"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Sosial</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Sosialisasi Pengelolaan Sampah di SD No. 3 Darmasaba dalam Kolaborasi Mahasiswa KKN-PMM I Universitas Warmadewa di Desa Darmasaba
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Berita Sampingan 2 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/prestasi-voli.jpeg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Sosial</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Tim Voli Darmasaba Raih Juara Turnamen Desa
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
<Box pb={30}>
|
||||
<Text fz={"h1"} fw={"bold"}>Berita Terbaru</Text>
|
||||
<Divider color={colors["blue-button"]} />
|
||||
</Box>
|
||||
<SimpleGrid cols={{ base: 1, md: 3 }}>
|
||||
{dataBeritaTerbaru.map((v, k) => {
|
||||
return (
|
||||
<Paper key={k} p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src={v.image}
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">{v.tanggal}</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Box py={"xl"}>
|
||||
<Center>
|
||||
<Pagination total={10} />
|
||||
</Center>
|
||||
</Box>
|
||||
</Container>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default Sosial;
|
||||
185
src/app/darmasaba/(pages)/desa/berita/(tabs)/teknologi.tsx
Normal file
185
src/app/darmasaba/(pages)/desa/berita/(tabs)/teknologi.tsx
Normal file
@@ -0,0 +1,185 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Container, Divider, Grid, GridCol, Group, Image, Pagination, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconCalendar, IconUser } from '@tabler/icons-react';
|
||||
import React from 'react';
|
||||
|
||||
const dataBeritaTerbaru = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik',
|
||||
image: "/api/img/berita-1.png",
|
||||
tanggal: "Selasa, 11 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/prestasi-voli.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/prestasi-voli.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
]
|
||||
function Teknologi() {
|
||||
return (
|
||||
<Box py={20}>
|
||||
<Container size="xl" px={{ base: "md", md: "xl" }}>
|
||||
<Grid gutter={{ base: "md", md: "xl" }} pb={70}>
|
||||
{/* Berita Utama */}
|
||||
<GridCol span={{ base: 12, md: 8 }}>
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="md">
|
||||
<Box>
|
||||
<Image
|
||||
src="/api/img/berita-1.png"
|
||||
alt="Darmasaba Smart Village"
|
||||
radius="md"
|
||||
fit="cover"
|
||||
h={{ base: 450, md: 660 }}
|
||||
/>
|
||||
</Box>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz={{ base: "xl", md: "2xl" }} fw="bold" lineClamp={2}>
|
||||
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
|
||||
</Text>
|
||||
<Text size="md" lineClamp={3}>
|
||||
Desa Darmasaba mengambil langkah maju dalam transformasi digital dengan meluncurkan aplikasi Smart Village yang memudahkan warga dalam mengakses layanan publik secara online.
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</GridCol>
|
||||
|
||||
{/* Berita Sampingan */}
|
||||
<GridCol span={{ base: 12, md: 4 }}>
|
||||
<Stack gap="md">
|
||||
{/* Berita Sampingan 1 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/prestasi-voli.jpeg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Berita Sampingan 2 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/prestasi-voli.jpeg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Sosial</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Tim Voli Darmasaba Raih Juara Turnamen Desa
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
<Box pb={30}>
|
||||
<Text fz={"h1"} fw={"bold"}>Berita Terbaru</Text>
|
||||
<Divider color={colors["blue-button"]} />
|
||||
</Box>
|
||||
<SimpleGrid cols={{ base: 1, md: 3 }}>
|
||||
{dataBeritaTerbaru.map((v, k) => {
|
||||
return (
|
||||
<Paper key={k} p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src={v.image}
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">{v.tanggal}</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Box py={"xl"}>
|
||||
<Center>
|
||||
<Pagination total={10} />
|
||||
</Center>
|
||||
</Box>
|
||||
</Container>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default Teknologi;
|
||||
102
src/app/darmasaba/(pages)/desa/berita/page.tsx
Normal file
102
src/app/darmasaba/(pages)/desa/berita/page.tsx
Normal file
@@ -0,0 +1,102 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Container, Grid, GridCol, Stack, Tabs, TabsList, TabsPanel, TabsTab, Text, TextInput } from '@mantine/core';
|
||||
import { IconSearch } from '@tabler/icons-react';
|
||||
import BackButton from '../layanan/_com/BackButto';
|
||||
import Budaya from './(tabs)/budaya';
|
||||
import Ekonomi from './(tabs)/ekonomi';
|
||||
import Pemerintahan from './(tabs)/pemerintahan';
|
||||
import Semua from './(tabs)/semua';
|
||||
import Sosial from './(tabs)/sosial';
|
||||
import Teknologi from './(tabs)/teknologi';
|
||||
import Pembangunan from './(tabs)/pembangunan';
|
||||
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos="relative" bg={colors.Bg} py="xl" gap="22">
|
||||
{/* Header */}
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Container size="lg" px="md">
|
||||
<Stack align="center" gap="0" >
|
||||
<Text fz={{ base: "2rem", md: "3.4rem" }} c={colors["blue-button"]} fw="bold" ta="center">
|
||||
Portal Berita Darmasaba
|
||||
</Text>
|
||||
<Text ta="center" px="md">
|
||||
Temukan berbagai potensi dan keunggulan yang dimiliki Desa Darmasaba
|
||||
</Text>
|
||||
</Stack>
|
||||
</Container>
|
||||
|
||||
{/* Tabs Menu */}
|
||||
<Tabs color={colors['blue-button']} variant="pills" defaultValue="semua">
|
||||
<Box px={{ base: "md", md: 100 }} py="md" bg={colors['BG-trans']} >
|
||||
<Grid>
|
||||
<GridCol span={{ base: 12, md: 9, lg: 8, xl: 9 }}>
|
||||
<TabsList>
|
||||
<TabsTab value="semua">
|
||||
Semua
|
||||
</TabsTab>
|
||||
<TabsTab value="pemerintahan">
|
||||
Pemerintahan
|
||||
</TabsTab>
|
||||
<TabsTab value="pembangunan" >
|
||||
Pembangunan
|
||||
</TabsTab>
|
||||
<TabsTab value="ekonomi" >
|
||||
Ekonomi
|
||||
</TabsTab>
|
||||
<TabsTab value="sosial" >
|
||||
Sosial
|
||||
</TabsTab>
|
||||
<TabsTab value="budaya" >
|
||||
Budaya
|
||||
</TabsTab>
|
||||
<TabsTab value="teknologi" >
|
||||
Teknologi
|
||||
</TabsTab>
|
||||
</TabsList>
|
||||
</GridCol>
|
||||
<GridCol span={{ base: 12, md: 3, lg: 4, xl: 3 }}>
|
||||
<TextInput
|
||||
w={{ base: "100%", md: "100%" }}
|
||||
radius="lg"
|
||||
placeholder="Cari Berita"
|
||||
leftSection={<IconSearch size={18} />}
|
||||
/>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
</Box>
|
||||
|
||||
<TabsPanel value='semua'>
|
||||
<Semua />
|
||||
</TabsPanel>
|
||||
<TabsPanel value='pemerintahan'>
|
||||
<Pemerintahan />
|
||||
</TabsPanel>
|
||||
<TabsPanel value="pembangunan" >
|
||||
<Pembangunan />
|
||||
</TabsPanel>
|
||||
<TabsPanel value="ekonomi" >
|
||||
<Ekonomi />
|
||||
</TabsPanel>
|
||||
<TabsPanel value="sosial" >
|
||||
<Sosial />
|
||||
</TabsPanel>
|
||||
<TabsPanel value="budaya" >
|
||||
<Budaya />
|
||||
</TabsPanel>
|
||||
<TabsPanel value="teknologi" >
|
||||
<Teknologi />
|
||||
</TabsPanel>
|
||||
|
||||
</Tabs>
|
||||
|
||||
|
||||
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
232
src/app/darmasaba/(pages)/desa/berita/page.txt
Normal file
232
src/app/darmasaba/(pages)/desa/berita/page.txt
Normal file
@@ -0,0 +1,232 @@
|
||||
{backup}
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Container, Divider, Grid, GridCol, Group, Image, Pagination, Paper, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { IconCalendar, IconSearch, IconUser } from '@tabler/icons-react';
|
||||
import BackButton from '../layanan/_com/BackButto';
|
||||
|
||||
const dataBeritaTerbaru = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik',
|
||||
image: "/api/img/berita-1.png",
|
||||
tanggal: "Selasa, 11 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/prestasi-voli.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Tim Voli Darmasaba Raih Juara Turnamen Desa',
|
||||
image: "/api/img/prestasi-voli.jpeg",
|
||||
tanggal: "Kamis, 13 Januari 2025",
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos="relative" bg={colors.Bg} py="xl" gap="22">
|
||||
{/* Header */}
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Container size="lg" px="md">
|
||||
<Stack align="center" gap="0" >
|
||||
<Text fz={{ base: "2rem", md: "3.4rem" }} c={colors["blue-button"]} fw="bold" ta="center">
|
||||
Portal Berita Darmasaba
|
||||
</Text>
|
||||
<Text ta="center" px="md">
|
||||
Temukan berbagai potensi dan keunggulan yang dimiliki Desa Darmasaba
|
||||
</Text>
|
||||
</Stack>
|
||||
</Container>
|
||||
|
||||
{/* Tabs Menu */}
|
||||
<Box px={{ base: "md", md: "xl" }} py="md" bg={colors['BG-trans']} >
|
||||
<Grid align="center" justify="space-between">
|
||||
<GridCol span={{ base: 12, md: 8 }}>
|
||||
<Group gap="md" wrap="wrap">
|
||||
<Paper bg={colors['blue-button']} radius="xl" py={5} px={20}>
|
||||
<Text c={colors['white-1']} size="sm">
|
||||
Semua
|
||||
</Text>
|
||||
</Paper>
|
||||
{['Pemerintahan', 'Pembangunan', 'Ekonomi', 'Sosial', 'Budaya', 'Teknologi'].map((kategori) => (
|
||||
<Paper key={kategori} bg={colors['blue-button-trans']} radius="xl" py={5} px={20}>
|
||||
<Text size="sm">
|
||||
{kategori}
|
||||
</Text>
|
||||
</Paper>
|
||||
))}
|
||||
</Group>
|
||||
</GridCol>
|
||||
<GridCol span={{ base: 12, md: 4 }}>
|
||||
<TextInput
|
||||
radius="lg"
|
||||
placeholder="Cari Berita"
|
||||
leftSection={<IconSearch size={18} />}
|
||||
w="100%"
|
||||
/>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
</Box>
|
||||
|
||||
{/* Konten Berita */}
|
||||
<Container size="xl" px={{ base: "md", md: "xl" }}>
|
||||
<Grid gutter={{ base: "md", md: "xl" }} pb={70}>
|
||||
{/* Berita Utama */}
|
||||
<GridCol span={{ base: 12, md: 8 }}>
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="md">
|
||||
<Box>
|
||||
<Image
|
||||
src="/api/img/berita-1.png"
|
||||
alt="Darmasaba Smart Village"
|
||||
radius="md"
|
||||
fit="cover"
|
||||
h={{ base: 450, md: 660 }}
|
||||
/>
|
||||
</Box>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz={{ base: "xl", md: "2xl" }} fw="bold" lineClamp={2}>
|
||||
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
|
||||
</Text>
|
||||
<Text size="md" lineClamp={3}>
|
||||
Desa Darmasaba mengambil langkah maju dalam transformasi digital dengan meluncurkan aplikasi Smart Village yang memudahkan warga dalam mengakses layanan publik secara online.
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</GridCol>
|
||||
|
||||
{/* Berita Sampingan */}
|
||||
<GridCol span={{ base: 12, md: 4 }}>
|
||||
<Stack gap="md">
|
||||
{/* Berita Sampingan 1 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/prestasi-voli.jpeg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Darmasaba Luncurkan Aplikasi Smart Village untuk Pelayanan Publik
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Berita Sampingan 2 */}
|
||||
<Paper p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src="/api/img/prestasi-voli.jpeg"
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Sosial</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
Tim Voli Darmasaba Raih Juara Turnamen Desa
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
<Box pb={30}>
|
||||
<Text fz={"h1"} fw={"bold"}>Berita Terbaru</Text>
|
||||
<Divider color={colors["blue-button"]} />
|
||||
</Box>
|
||||
<SimpleGrid cols={{ base: 1, md: 3 }}>
|
||||
{dataBeritaTerbaru.map((v, k) => {
|
||||
return (
|
||||
<Paper key={k} p="md" shadow="sm" radius="md">
|
||||
<Stack gap="sm">
|
||||
<Image
|
||||
radius="md"
|
||||
src={v.image}
|
||||
alt="Prestasi Voli"
|
||||
fit="cover"
|
||||
h={180}
|
||||
/>
|
||||
<Group>
|
||||
<Paper px={10} py={5} radius="xl" bg={colors['BG-trans']}>
|
||||
<Text size="sm">Teknologi</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz="lg" fw="bold" lineClamp={2}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Group>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">{v.tanggal}</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Box py={"xl"}>
|
||||
<Center>
|
||||
<Pagination total={10} />
|
||||
</Center>
|
||||
</Box>
|
||||
</Container>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
64
src/app/darmasaba/(pages)/desa/galery/(tabs)/foto.tsx
Normal file
64
src/app/darmasaba/(pages)/desa/galery/(tabs)/foto.tsx
Normal file
@@ -0,0 +1,64 @@
|
||||
import colors from '@/con/colors';
|
||||
import { SimpleGrid, Box, Paper, Center, Stack, Image, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
image: "/api/img/galeri-1.png",
|
||||
title: "Pendapatan",
|
||||
tanggal: "3 Mar 2025",
|
||||
judul: "Pemasangan Wifi Gratis Di Publik Desa",
|
||||
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
image: "/api/img/galeri-2.png",
|
||||
title: "Belanja",
|
||||
tanggal: "4 Mar 2025",
|
||||
judul: "Panen raya Desa Darmasaba",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
image: "/api/img/galeri-3.png",
|
||||
title: "Pembiayaan",
|
||||
tanggal: "5 Mar 2025",
|
||||
judul: "Kegiatan Pembangunan Pelinggih",
|
||||
}
|
||||
]
|
||||
function Foto() {
|
||||
return (
|
||||
<Box pt={20}>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Box key={k}>
|
||||
<Paper mb={50} p={"md"} radius={26} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
|
||||
<Box>
|
||||
<Center>
|
||||
<Image src={v.image} alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Box>
|
||||
<Stack gap={"sm"} py={10}>
|
||||
<Text fz={{ base: "sm", md: "sm" }}>{v.tanggal}</Text>
|
||||
<Text fw={"bold"} fz={{ base: "sm", md: "sm" }}>{v.judul}</Text>
|
||||
<Text ta={"justify"} fz={{ base: "sm", md: "sm" }}>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
||||
Fusce sagittis nec arcu ac ornare. Praesent a porttitor
|
||||
felis. Proin varius ex nisl, in hendrerit odio tristique vel. </Text>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default Foto;
|
||||
64
src/app/darmasaba/(pages)/desa/galery/(tabs)/video.tsx
Normal file
64
src/app/darmasaba/(pages)/desa/galery/(tabs)/video.tsx
Normal file
@@ -0,0 +1,64 @@
|
||||
import colors from '@/con/colors';
|
||||
import { SimpleGrid, Box, Paper, Center, Stack, Image, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
image: "/api/img/galeri-1.png",
|
||||
title: "Pendapatan",
|
||||
tanggal: "3 Mar 2025",
|
||||
judul: "Pemasangan Wifi Gratis Di Publik Desa",
|
||||
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
image: "/api/img/galeri-2.png",
|
||||
title: "Belanja",
|
||||
tanggal: "4 Mar 2025",
|
||||
judul: "Panen raya Desa Darmasaba",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
image: "/api/img/galeri-3.png",
|
||||
title: "Pembiayaan",
|
||||
tanggal: "5 Mar 2025",
|
||||
judul: "Kegiatan Pembangunan Pelinggih",
|
||||
}
|
||||
]
|
||||
function Video() {
|
||||
return (
|
||||
<Box pt={20}>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Box key={k}>
|
||||
<Paper mb={50} p={"md"} radius={26} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
|
||||
<Box>
|
||||
<Center>
|
||||
<Image src={v.image} alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Box>
|
||||
<Stack gap={"sm"} py={10}>
|
||||
<Text fz={{ base: "sm", md: "sm" }}>{v.tanggal}</Text>
|
||||
<Text fw={"bold"} fz={{ base: "sm", md: "sm" }}>{v.judul}</Text>
|
||||
<Text ta={"justify"} fz={{ base: "sm", md: "sm" }}>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
||||
Fusce sagittis nec arcu ac ornare. Praesent a porttitor
|
||||
felis. Proin varius ex nisl, in hendrerit odio tristique vel. </Text>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default Video;
|
||||
100
src/app/darmasaba/(pages)/desa/galery/backup.txt
Normal file
100
src/app/darmasaba/(pages)/desa/galery/backup.txt
Normal file
@@ -0,0 +1,100 @@
|
||||
import colors from '@/con/colors';
|
||||
import { ActionIcon, Box, Center, Container, Flex, Image, Paper, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { IconPhoto, IconSearch, IconVideo } from '@tabler/icons-react';
|
||||
import BackButton from '../layanan/_com/BackButto';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
image: "/api/img/galeri-1.png",
|
||||
title: "Pendapatan",
|
||||
tanggal: "3 Mar 2025",
|
||||
judul: "Pemasangan Wifi Gratis Di Publik Desa",
|
||||
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
image: "/api/img/galeri-2.png",
|
||||
title: "Belanja",
|
||||
tanggal: "4 Mar 2025",
|
||||
judul: "Panen raya Desa Darmasaba",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
image: "/api/img/galeri-3.png",
|
||||
title: "Pembiayaan",
|
||||
tanggal: "5 Mar 2025",
|
||||
judul: "Kegiatan Pembangunan Pelinggih",
|
||||
}
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos="relative" bg={colors.Bg} py="xl" gap="md">
|
||||
{/* Header */}
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Container size="lg" px="md">
|
||||
<Stack align="center" gap="xs" mb="xl">
|
||||
<Text fz={{ base: "2rem", md: "3.4rem" }} c={colors["blue-button"]} fw="bold" ta="center">
|
||||
Galeri Kegiatan Desa Darmasaba
|
||||
</Text>
|
||||
</Stack>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Flex justify={"space-between"} align={"center"} pb={50}>
|
||||
<Flex gap={"lg"}>
|
||||
<ActionIcon variant='transparent' p={50}>
|
||||
<Flex c={colors["blue-button"]} align={"center"} gap={10}>
|
||||
<IconPhoto size={35} />
|
||||
<Text fz={"h4"}>Foto</Text>
|
||||
</Flex>
|
||||
</ActionIcon>
|
||||
<ActionIcon variant='transparent' p={50}>
|
||||
<Flex c={colors["blue-button"]} align={"center"} gap={10}>
|
||||
<IconVideo size={35} />
|
||||
<Text fz={"h4"}>Video</Text>
|
||||
</Flex>
|
||||
</ActionIcon>
|
||||
</Flex>
|
||||
<TextInput
|
||||
placeholder='Cari Galeri'
|
||||
radius="lg"
|
||||
leftSection={<IconSearch size={20} />}
|
||||
w={{ base: "25%", md: "30%" }}
|
||||
/>
|
||||
</Flex>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Box key={k}>
|
||||
<Paper mb={50} p={"md"} radius={26} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
|
||||
<Box>
|
||||
<Center>
|
||||
<Image src={v.image} alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Box>
|
||||
<Stack gap={"sm"} py={10}>
|
||||
<Text fz={{ base: "sm", md: "sm" }}>{v.tanggal}</Text>
|
||||
<Text fw={"bold"} fz={{ base: "sm", md: "sm" }}>{v.judul}</Text>
|
||||
<Text ta={"justify"} fz={{ base: "sm", md: "sm" }}>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
||||
Fusce sagittis nec arcu ac ornare. Praesent a porttitor
|
||||
felis. Proin varius ex nisl, in hendrerit odio tristique vel. </Text>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
63
src/app/darmasaba/(pages)/desa/galery/page.tsx
Normal file
63
src/app/darmasaba/(pages)/desa/galery/page.tsx
Normal file
@@ -0,0 +1,63 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Container, Grid, GridCol, Group, Stack, Tabs, TabsList, TabsPanel, TabsTab, Text, TextInput } from '@mantine/core';
|
||||
import { IconPhoto, IconSearch, IconVideo } from '@tabler/icons-react';
|
||||
import BackButton from '../layanan/_com/BackButto';
|
||||
import Foto from './(tabs)/foto';
|
||||
import Video from './(tabs)/video';
|
||||
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos="relative" bg={colors.Bg} py="xl" gap="md">
|
||||
{/* Header */}
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Container size="lg" px="md">
|
||||
<Stack align="center" gap="xs" mb="xl">
|
||||
<Text fz={{ base: "2rem", md: "3.4rem" }} c={colors["blue-button"]} fw="bold" ta="center">
|
||||
Galeri Kegiatan Desa Darmasaba
|
||||
</Text>
|
||||
</Stack>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Tabs color={colors['blue-button']} defaultValue="foto">
|
||||
<Grid>
|
||||
<GridCol span={{ base: 12, md: 9, lg: 8, xl: 9 }}>
|
||||
<Group>
|
||||
<TabsList>
|
||||
<TabsTab style={{ color: colors['blue-button'] }} fz={"xl"} value="foto" leftSection={<IconPhoto color={colors['blue-button']} size={45} />}>
|
||||
Foto
|
||||
</TabsTab>
|
||||
<TabsTab style={{ color: colors['blue-button'] }} fz={"xl"} value="video" leftSection={<IconVideo color={colors['blue-button']} size={45} />}>
|
||||
Video
|
||||
</TabsTab>
|
||||
</TabsList>
|
||||
</Group>
|
||||
</GridCol>
|
||||
<GridCol span={{ base: 12, md: 3, lg: 4, xl: 3 }}>
|
||||
<TextInput
|
||||
w={{ base: "100%", md: "100%" }}
|
||||
radius="lg"
|
||||
placeholder="Cari Berita"
|
||||
leftSection={<IconSearch size={18} />}
|
||||
/>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
|
||||
<TabsPanel value="foto">
|
||||
<Foto />
|
||||
</TabsPanel>
|
||||
|
||||
<TabsPanel value="video">
|
||||
<Video />
|
||||
</TabsPanel>
|
||||
|
||||
</Tabs>
|
||||
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -1,36 +0,0 @@
|
||||
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;
|
||||
@@ -1,36 +0,0 @@
|
||||
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;
|
||||
@@ -1,36 +0,0 @@
|
||||
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;
|
||||
@@ -1,37 +0,0 @@
|
||||
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;
|
||||
@@ -1,37 +0,0 @@
|
||||
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;
|
||||
@@ -1,36 +0,0 @@
|
||||
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;
|
||||
@@ -1,35 +0,0 @@
|
||||
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;
|
||||
@@ -0,0 +1,42 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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={"22"}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Text fz={{base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem"}} ta={"center"} fw={"bold"}>
|
||||
Surat Keterangan Beda Biodata Diri
|
||||
</Text>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={0}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} pb={20}>
|
||||
Persyaratan Dokumen:
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy dokumen bersangkutan yang terdapat perbedaan biodata diri misal : Sertifikat Tanah/Ijazah/Polis Asuransi dan lainnya.</ListItem>
|
||||
</List>
|
||||
<Box py={20}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} py={20}>
|
||||
Alur Pelayanan:
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Group justify='center'>
|
||||
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,42 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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={"22"}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Text fz={{base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem"}} ta={"center"} fw={"bold"}>
|
||||
Surat Keterangan Belum Kawin
|
||||
</Text>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={0}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} pb={20}>
|
||||
Persyaratan Dokumen:
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Khusus bagi yang berstatus duda atau janda melampirkan fotocopy akta cerai atau dokumen pendukung lainnya</ListItem>
|
||||
</List>
|
||||
<Box py={20}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} py={20}>
|
||||
Alur Pelayanan:
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Group justify='center'>
|
||||
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,42 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Center, 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={"22"}>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Text fz={{base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem"}} ta={"center"} fw={"bold"}>
|
||||
Surat Keterangan Domisili Organisasi
|
||||
</Text>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={0} >
|
||||
<Text fz={{ base: "h4", md: "h2" }} pb={20}>
|
||||
Persyaratan Dokumen:
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy Surat Keterangan Terdaftar (SKT) organisasi atau Pengukuhan Kelompok</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Jika Pengajuan baru pembuatan SKT maka melengkapi Susunan Pengurus lengkap dengan Kop Organisasi</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Tanggal berdiri/Tahun berdiri/Sejak kapan berdirinya organisasi</ListItem>
|
||||
</List>
|
||||
<Box py={20}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} py={20}>
|
||||
Alur Pelayanan:
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,43 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Group, Center } 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={"22"}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }}>
|
||||
<Text fz={{base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem"}} ta={"center"} fw={"bold"}>
|
||||
Surat Keterangan Kelahiran
|
||||
</Text>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={0}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} pb={20}>
|
||||
Persyaratan Dokumen:
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy Surat lahir dari dokter/bidan (jika ada)</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy Kartu Keluarga</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy KTP 2 orang saksi</ListItem>
|
||||
</List>
|
||||
<Box py={20}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} py={20}>
|
||||
Alur Pelayanan:
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src="/api/img/flowchart-suket-kelahiran-removebg-preview.png" alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Group justify='center'>
|
||||
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,41 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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={"22"}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Text fz={{base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem"}} ta={"center"} fw={"bold"}>
|
||||
Surat Keterangan Kelakuan Baik (Pengantar SKCK)
|
||||
</Text>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={0}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} pb={20}>
|
||||
Persyaratan Dokumen:
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy Ktp atau Kartu Keluarga</ListItem>
|
||||
</List>
|
||||
<Box py={20}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} py={20}>
|
||||
Alur Pelayanan:
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Group justify='center'>
|
||||
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,43 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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={"22"}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }}>
|
||||
<Text fz={{base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem"}} ta={"center"} fw={"bold"}>
|
||||
Surat Keterangan Kematian
|
||||
</Text>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={0}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} pb={20}>
|
||||
Persyaratan Dokumen:
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy KTP atau Kartu keluarga</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Surat Kematian dari rumah sakit atau dokter (jika ada)</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Tanggal dan Waktu Kematian</ListItem>
|
||||
</List>
|
||||
<Box py={20}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} py={20}>
|
||||
Alur Pelayanan:
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Group justify='center'>
|
||||
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,42 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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={"22"}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Text fz={{base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem"}} ta={"center"} fw={"bold"}>
|
||||
Surat Keterangan Penghasilan
|
||||
</Text>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={0}>
|
||||
<Text fz={{base:"h4", md: "h2"}} pb={20}>
|
||||
Persyaratan Dokumen:
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem fz={{base:"sm", md: "h3"}}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
|
||||
<ListItem fz={{base:"sm", md: "h3"}}>Fotocopy KTP orang tua atau Fotocopy Kartu keluarga</ListItem>
|
||||
<ListItem fz={{base:"sm", md: "h3"}}>Membuat Surat Pernyataan Penghasilan bermaterai (disertai jumlah penghasilan)</ListItem>
|
||||
</List>
|
||||
<Box py={20}>
|
||||
<Text fz={{base:"h4", md: "h2"}} py={20}>
|
||||
Alur Pelayanan:
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Group justify='center'>
|
||||
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,43 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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={"22"}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Text fz={{base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem"}} ta={"center"} fw={"bold"}>
|
||||
Surat Keterangan Tempat Usaha
|
||||
</Text>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={0}>
|
||||
<Text fz={{ base: "h4", md: 'h2' }} pb={20}>
|
||||
Persyaratan Dokumen:
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy KTP atau Kartu keluarga</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Foto Lokasi dan Kegiatan Usaha di cetak dalam selembar kertas (diparaf dan stempel oleh Kelian Banjar Dinas)</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>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={{ base: "h4", md: 'h2' }} py={20}>
|
||||
Alur Pelayanan:
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src="/api/img/flowchart-suket-tempat-usaha-removebg-preview.png" alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Group justify='center'>
|
||||
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,44 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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={"22"}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Text fz={{base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem"}} ta={"center"} fw={"bold"}>
|
||||
Surat Keterangan Tidak Mampu
|
||||
</Text>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={0}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} py={20}>
|
||||
Persyaratan Dokumen:
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy KTP/KIA atau Kartu Keluarga</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Fotocopy Kartu Indonesia Pintar/Kartu Perlindungan Sosial/Terdaftar dalam DTKS</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "h3" }}>Jika tidak memiliki Kartu tersebut diatas diwajibkan membuat Surat Pernyataan Tidak Mampu
|
||||
</ListItem>
|
||||
</List>
|
||||
<Box py={20}>
|
||||
<Text fz={{ base: "h4", md: "h2" }} py={20}>
|
||||
Alur Pelayanan:
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src="/api/img/flowchart-suket-tidak-mampu-removebg-preview.png" alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Group justify='center'>
|
||||
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,42 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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={"22"}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Text fz={{base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem"}} ta={"center"} fw={"bold"}>
|
||||
Surat Keterangan Usaha
|
||||
</Text>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={0}>
|
||||
<Text fz={{ base: "h4", md: 'h2' }} pb={20}>
|
||||
Persyaratan Dokumen:
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy KTP atau Kartu keluarga</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Foto Lokasi dan Kegiatan Usaha di cetak dalam selembar kertas (diparaf dan stempel oleh Kelian Banjar Dinas)</ListItem>
|
||||
</List>
|
||||
<Box py={20}>
|
||||
<Text fz={{ base: "h4", md: 'h2' }} py={20}>
|
||||
Alur Pelayanan:
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Group justify='center'>
|
||||
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack >
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,41 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Container, List, ListItem, Box, Text, Image, Button, Center, Group } 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={"22"}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Text fz={{base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.4rem"}} ta={"center"} fw={"bold"}>
|
||||
Surat Keterangan Yatim Piatu
|
||||
</Text>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={0}>
|
||||
<Text fz={{ base: "h4", md: 'h2' }} pb={20}>
|
||||
Persyaratan Dokumen:
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Pengantar Kelian Banjar Dinas di Wilayah Masing - masing</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>Fotocopy Ktp, KIA atau Kartu Keluarga</ListItem>
|
||||
</List>
|
||||
<Box py={20}>
|
||||
<Text fz={{ base: "h4", md: 'h2' }} py={20}>
|
||||
Alur Pelayanan:
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src="/api/img/flowchart-suket-beda-biodatadiri-removebg-preview.png" alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Group justify='center'>
|
||||
<Button radius={"lg"} fz={'h4'} bg={colors['blue-button']}>Ajukan Permohonan</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -1,37 +0,0 @@
|
||||
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;
|
||||
@@ -1,38 +0,0 @@
|
||||
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;
|
||||
@@ -1,36 +0,0 @@
|
||||
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;
|
||||
@@ -1,35 +0,0 @@
|
||||
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;
|
||||
@@ -1,5 +1,6 @@
|
||||
'use client'
|
||||
|
||||
import colors from "@/con/colors";
|
||||
import { ActionIcon } from "@mantine/core";
|
||||
import { IconArrowLeft } from "@tabler/icons-react";
|
||||
import { useTransitionRouter } from 'next-view-transitions';
|
||||
@@ -7,7 +8,7 @@ import { useTransitionRouter } from 'next-view-transitions';
|
||||
export default function BackButton() {
|
||||
const router = useTransitionRouter()
|
||||
return (
|
||||
<ActionIcon variant="transparent" onClick={() => router.back()}>
|
||||
<ActionIcon bg={colors["blue-button"]} onClick={() => router.back()}>
|
||||
<IconArrowLeft />
|
||||
</ActionIcon>
|
||||
);
|
||||
|
||||
@@ -11,67 +11,67 @@ const data = [
|
||||
id: 1,
|
||||
images: "/api/img/test.png",
|
||||
name: "Surat Keterangan Domisili Organisasi",
|
||||
link: "/darmasaba/desa/layanan/domisili"
|
||||
link: "/darmasaba/desa/layanan/surat-keterangan-domisili"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
images: "/api/img/test-3.jpeg",
|
||||
name: "Surat Keterangan Penghasilan",
|
||||
link: "/darmasaba/desa/layanan/penghasilan"
|
||||
link: "/darmasaba/desa/layanan/surat-keterangan-penghasilan"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
images: "/api/img/domisili.jpeg",
|
||||
name: "Surat Keterangan Tidak Mampu",
|
||||
link: "/darmasaba/desa/layanan/tidakmampu"
|
||||
link: "/darmasaba/desa/layanan/surat-keterangan-tidak-mampu"
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
images: "/api/img/kelahiran.jpeg",
|
||||
name: "Surat Keterangan Kelahiran",
|
||||
link: "/darmasaba/desa/layanan/kelahiran"
|
||||
link: "/darmasaba/desa/layanan/surat-keterangan-kelahiran"
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
images: "/api/img/keterangan-usaha.jpeg",
|
||||
name: "Surat Keterangan Usaha",
|
||||
link: "/darmasaba/desa/layanan/usaha"
|
||||
link: "/darmasaba/desa/layanan/surat-keterangan-usaha"
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
images: "/api/img/kematian.jpeg",
|
||||
name: "Surat Keterangan Kematian",
|
||||
link: "/darmasaba/desa/layanan/kematian"
|
||||
link: "/darmasaba/desa/layanan/surat-keterangan-kematian"
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
images: "/api/img/tempatusaha.jpeg",
|
||||
name: "Surat Keterangan Tempat Usaha",
|
||||
link: "/darmasaba/desa/layanan/tempatusaha"
|
||||
link: "/darmasaba/desa/layanan/surat-keterangan-tempat-usaha"
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
images: "/api/img/belumkawin.jpeg",
|
||||
name: "Surat Keterangan Belum Kawin",
|
||||
link: "/darmasaba/desa/layanan/belumkawin"
|
||||
link: "/darmasaba/desa/layanan/surat-keterangan-belum-kawin"
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
images: "/api/img/berkelakuan-baik.jpeg",
|
||||
name: "Surat Keterangan Kelakuan Baik",
|
||||
link: "/darmasaba/desa/layanan/skck"
|
||||
link: "/darmasaba/desa/layanan/surat-keterangan-kelakuan-baik"
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
images: "/api/img/biodata.jpeg",
|
||||
name: "Surat Keterangan Beda Biodata Diri",
|
||||
link: "/darmasaba/desa/layanan/biodata"
|
||||
link: "/darmasaba/desa/layanan/surat-keterangan-beda-biodata-diri"
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
images: "/api/img/yatim.jpeg",
|
||||
name: "Surat Keterangan Yatim Piatu",
|
||||
link: "/darmasaba/desa/layanan/yatim"
|
||||
link: "/darmasaba/desa/layanan/surat-keterangan-yatim-piatu"
|
||||
}
|
||||
|
||||
]
|
||||
@@ -82,11 +82,13 @@ export default function Page() {
|
||||
const prevStep = () => setActive((current) => (current > 0 ? current - 1 : current));
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<BackButton/>
|
||||
<Stack align="center" gap={0}>
|
||||
{/* Bagian Layanan */}
|
||||
<Text fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
<Text fz={{ base: "2rem", md: "2.5rem", lg: "3rem", xl: "3.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Layanan Desa Darmasaba
|
||||
</Text>
|
||||
<Text
|
||||
@@ -94,16 +96,18 @@ export default function Page() {
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
<TextInput
|
||||
py={20}
|
||||
pt={20}
|
||||
w={{ base: "70%", md: "50%" }}
|
||||
placeholder="Cari Layanan"
|
||||
leftSection={<IconSearch size={20} />}
|
||||
|
||||
/>
|
||||
</Stack>
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
{/* Bagian Pelayanan Surat Keterangan */}
|
||||
<Box py={10}>
|
||||
<Text fz={"h4"} fw={"bold"}>Pelayanan Surat Keterangan</Text>
|
||||
<Box pb={10}>
|
||||
<Text fz={{ base: "h4", md: 'h2' }} fw={"bold"}>Pelayanan Surat Keterangan</Text>
|
||||
</Box>
|
||||
<SimpleGrid
|
||||
py={20}
|
||||
@@ -153,14 +157,14 @@ export default function Page() {
|
||||
</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>
|
||||
<Text fz={{ base: "h4", md: 'h2' }} 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)
|
||||
<Text py={10} ta={"justify"} fz={{ base: "sm", md: 'h3' }}>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>
|
||||
<Text py={10} fz={{ base: "sm", md: 'h3' }}>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={{
|
||||
@@ -190,7 +194,7 @@ export default function Page() {
|
||||
<StepperStep label="Langkah Keenam" description="Penerimaan NIB">
|
||||
Jika proses sebelumnya berhasil, perusahaan akan menerima NIB sebagai identitas resmi usaha anda
|
||||
</StepperStep>
|
||||
<StepperCompleted>
|
||||
<StepperCompleted >
|
||||
Selesai, anda telah mengikuti proses pendaftaran NIB melalui OSS
|
||||
</StepperCompleted>
|
||||
</Stepper>
|
||||
@@ -199,28 +203,28 @@ export default function Page() {
|
||||
<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
|
||||
<Text py={35} ta={"justify"} fz={{ base: "sm", md: 'h3' }}>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>
|
||||
<Text fz={{base: "h4", md: "h3"}} 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>
|
||||
<Text fz={{ base: "sm", md: 'h3' }} 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>
|
||||
<ListItem fz={{ base: "sm", md: 'h3' }}>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={{ base: "sm", md: 'h3' }}>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={{ base: "sm", md: 'h3' }}>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>
|
||||
<Text fz={{base: "h4", md: "h3"}} 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"]}/>
|
||||
<Text pb={20} fz={{ base: "sm", md: 'h3' }} 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>
|
||||
<Text fz={{ base: "sm", md: 'h3' }}>25 May 2021 . Darmasaba</Text>
|
||||
<Box>
|
||||
<Flex gap={"lg"}>
|
||||
<ActionIcon variant='transparent'>
|
||||
@@ -239,7 +243,7 @@ export default function Page() {
|
||||
</Box>
|
||||
</Flex>
|
||||
<Divider color={colors["blue-button"]} pb={50} />
|
||||
</Container>
|
||||
</Box>
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
104
src/app/darmasaba/(pages)/desa/pengumuman/page.tsx
Normal file
104
src/app/darmasaba/(pages)/desa/pengumuman/page.tsx
Normal file
@@ -0,0 +1,104 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Container, Text, TextInput, SimpleGrid, Notification, Flex, Anchor, Paper } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../layanan/_com/BackButto';
|
||||
import { IconSearch } from '@tabler/icons-react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos="relative" bg={colors.Bg} py="xl" gap="md">
|
||||
{/* Header */}
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Container size="lg" px="md">
|
||||
<Stack align="center" gap="0" >
|
||||
<Text fz={{ base: "2rem", md: "3.4rem" }} c={colors["blue-button"]} fw="bold" ta="center">
|
||||
Pengumuman Desa Darmasaba
|
||||
</Text>
|
||||
<Text ta="center" px="md" pb={10}>
|
||||
Informasi dan pengumuman resmi terkait kegiatan dan kebijakan Desa Darmasaba
|
||||
</Text>
|
||||
<TextInput
|
||||
placeholder='Cari Pengumuman'
|
||||
radius="lg"
|
||||
leftSection={<IconSearch size={20} />}
|
||||
w={{ base: "55%", md: "70%" }}
|
||||
/>
|
||||
</Stack>
|
||||
</Container>
|
||||
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2,
|
||||
}}
|
||||
>
|
||||
<Notification styles={{ title: { fontWeight: "bold" } }} withCloseButton={false} title="Penting">
|
||||
<Stack gap={"xs"}>
|
||||
<Text fz={"sm"} fw={"bold"} c={"black"}>PENGUMUMAN LOWONGAN KERJA TPS3R PUDAK MESARI DESA DARMASABA</Text>
|
||||
<Text ta={"justify"} fz={"sm"} c={"black"}>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sagittis nec arcu ac ornare. Praesent a porttitor felis. Proin varius ex nisl, in hendrerit odio tristique vel. </Text>
|
||||
</Stack>
|
||||
<Flex pt={20} gap={"md"} justify={"space-between"}>
|
||||
<Text fz={"xs"} c={"black"}>1 Februari 2025</Text>
|
||||
<Text fz={"xs"} c={"black"}>09:00 WITA</Text>
|
||||
<Anchor>
|
||||
<Text fz={"xs"}>Baca Selengkapnya</Text>
|
||||
</Anchor>
|
||||
</Flex>
|
||||
</Notification>
|
||||
<Paper p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Text fw={"bold"} fz={"lg"} c={colors['blue-button']}>Kategori</Text>
|
||||
<Flex justify={"space-between"}>
|
||||
<Text fz={"md"} c={"black"}>Pengumuman</Text>
|
||||
<Text fz={"md"} c={"black"}>5</Text>
|
||||
</Flex>
|
||||
<Flex justify={"space-between"}>
|
||||
<Text fz={"md"} c={"black"}>Kegiatan</Text>
|
||||
<Text fz={"md"} c={"black"}>10</Text>
|
||||
</Flex>
|
||||
<Flex justify={"space-between"}>
|
||||
<Text fz={"md"} c={"black"}>Informasi</Text>
|
||||
<Text fz={"md"} c={"black"}>12</Text>
|
||||
</Flex>
|
||||
<Flex justify={"space-between"}>
|
||||
<Text fz={"md"} c={"black"}>Layanan</Text>
|
||||
<Text fz={"md"} c={"black"}>6</Text>
|
||||
</Flex>
|
||||
</Stack>
|
||||
</Paper>
|
||||
<Notification color='yellow' styles={{ title: { fontWeight: "bold" } }} withCloseButton={false} title="Informasi">
|
||||
<Stack gap={"xs"}>
|
||||
<Text fz={"sm"} fw={"bold"} c={"black"}>LELANG PEMASANGAN CCTV DESA DARMASABA</Text>
|
||||
<Text ta={"justify"} fz={"sm"} c={"black"}>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sagittis nec arcu ac ornare. Praesent a porttitor felis. Proin varius ex nisl, in hendrerit odio tristique vel. </Text>
|
||||
</Stack>
|
||||
<Flex pt={20} gap={"md"} justify={"space-between"}>
|
||||
<Text fz={"xs"} c={"black"}>2 Februari 2025</Text>
|
||||
<Text fz={"xs"} c={"black"}>10:00 WITA</Text>
|
||||
<Anchor>
|
||||
<Text fz={"xs"}>Baca Selengkapnya</Text>
|
||||
</Anchor>
|
||||
</Flex>
|
||||
</Notification>
|
||||
<Paper p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Text fw={"bold"} fz={"lg"} c={colors['blue-button']}>Pengumuman Penting</Text>
|
||||
<Flex justify={"space-between"}>
|
||||
<Text fz={"md"} c={"black"}>Jadwal Rapat</Text>
|
||||
<Text fz={"md"} c={"black"}>5</Text>
|
||||
</Flex>
|
||||
<Flex justify={"space-between"}>
|
||||
<Text fz={"md"} c={"black"}>Pendaftaran UMKM</Text>
|
||||
<Text fz={"md"} c={"black"}>10</Text>
|
||||
</Flex>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -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={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
Bumdes Pudak Mesari
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/ack.png" alt='' w={"100%"} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi dan Peran BUMDes Pudak Mesari:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} 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>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -1,51 +0,0 @@
|
||||
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;
|
||||
@@ -0,0 +1,71 @@
|
||||
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={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
Dam Tanah Putih
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/damtanahputih.jpeg" alt='' w={"100%"} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki Dam Tanah Putih sebagai salah satu potensi desa yang bernilai strategis. Selain berfungsi sebagai infrastruktur pengairan, dam ini juga memiliki potensi untuk dikembangkan sebagai destinasi wisata alam, edukasi, dan rekreasi bagi masyarakat lokal maupun wisatawan.
|
||||
</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi dan Peran Dam Tanah Putih:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Fungsi Utama Sebagai Sumber Pengairan</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Dam Tanah Putih memiliki peran penting dalam sistem irigasi yang menopang sektor pertanian di Darmasaba. Air dari dam ini digunakan untuk:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Mengairi sawah dan ladang : Menjamin ketersediaan air bagi petani sepanjang tahun.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Menjaga keseimbangan ekosistem : Menjadi habitat bagi ikan air tawar dan berbagai biota air.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Menampung air hujan : Membantu mengurangi risiko banjir dan kekeringan.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Potensi Wisata Alam dan Rekreasi</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Dengan pemandangan alam yang asri dan suasana yang sejuk, Dam Tanah Putih memiliki potensi besar untuk dikembangkan sebagai tempat wisata alam. Beberapa kegiatan yang bisa dikembangkan di area ini antara lain:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Trekking dan jogging di sekitar dam : Menikmati udara segar dan pemandangan indah.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Berkemah dan piknik : Cocok untuk keluarga dan komunitas yang ingin menikmati alam.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Wisata air : Seperti pemancingan atau wisata perahu kecil yang dapat menarik wisatawan.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Spot fotografi alam : Keindahan dam dan sekitarnya menjadi latar yang menarik bagi para fotografer.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Potensi Ekonomi dan UMKM Lokal</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Dengan pengembangan dam sebagai destinasi wisata, masyarakat sekitar dapat memanfaatkan peluang usaha seperti:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Warung makan dan jajanan tradisional : Menyediakan makanan khas Bali bagi wisatawan.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Jasa penyewaan alat rekreasi : Seperti pancing atau perahu kecil.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Produk kerajinan tangan dan suvenir : Oleh-oleh khas Darmasaba yang menarik bagi pengunjung.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Pengembangan Konservasi dan Edukasi Lingkungan</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Dam Tanah Putih juga bisa menjadi tempat edukasi lingkungan dengan konsep konservasi, di mana pengunjung bisa belajar tentang:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Pengelolaan sumber daya air yang berkelanjutan.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Keanekaragaman hayati di sekitar dam.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Pentingnya ekosistem perairan bagi pertanian dan kehidupan masyarakat.</Text>
|
||||
</ListItem>
|
||||
</List>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Dengan berbagai fungsi dan keindahannya, Dam Tanah Putih memiliki potensi besar untuk dikembangkan sebagai destinasi wisata alam, rekreasi, serta edukasi lingkungan. Dengan pengelolaan yang baik dan dukungan dari masyarakat serta pemerintah desa, dam ini dapat menjadi aset penting bagi Darmasaba, baik dari sisi ekonomi maupun kelestarian lingkungan.
|
||||
</Text>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,69 @@
|
||||
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={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
Genteng
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/genteng.jpeg" alt='' w={"100%"} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi besar dalam industri genteng yang dikelola oleh Usaha Mikro, Kecil, dan Menengah (UMKM). Sebagai desa yang masih mempertahankan nilai-nilai tradisional dalam pembangunan, industri genteng di Darmasaba berperan penting dalam penyediaan bahan bangunan berkualitas bagi masyarakat lokal maupun luar daerah.
|
||||
</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi dan Peran UMKM Genteng:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Genteng Tradisional Berkualitas Tinggi</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>UMKM di Darmasaba memproduksi genteng dari bahan baku pilihan seperti tanah liat berkualitas, yang menghasilkan genteng dengan daya tahan tinggi, kuat, dan cocok untuk iklim tropis. Beberapa jenis genteng yang dihasilkan meliputi:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Genteng Tanah Liat : Kuat, tahan lama, dan memiliki estetika khas tradisional.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Genteng Beton : Cocok untuk bangunan modern dengan ketahanan lebih tinggi.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Genteng Keramik : Memberikan tampilan elegan dan daya serap air yang lebih rendah.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Peluang Ekonomi dan Pemberdayaan Masyarakat:</Text>Industri genteng di Darmasaba memberikan peluang kerja bagi masyarakat setempat, terutama dalam bidang produksi, distribusi, hingga pemasaran. UMKM genteng juga mendukung keberlanjutan ekonomi desa dengan meningkatkan pendapatan warga serta mengurangi angka pengangguran.
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Inovasi dan Pengembangan Teknologi</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Beberapa pengrajin genteng di Darmasaba telah mulai mengadopsi teknologi modern dalam proses produksi, seperti:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Penggunaan cetakan dan oven pembakaran efisien untuk meningkatkan kualitas dan kapasitas produksi.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Teknik pelapisan anti bocor dan anti lumut untuk membuat genteng lebih tahan lama.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Desain genteng inovatif yang lebih ringan dan mudah dipasang.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Pemasaran dan Ekspansi Pasar</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Dengan meningkatnya pembangunan perumahan dan proyek konstruksi di Bali, permintaan akan genteng berkualitas terus bertambah. UMKM genteng Darmasaba dapat memperluas pasarnya dengan:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Menjalin kerja sama dengan kontraktor dan pengembang properti.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Mempromosikan produk melalui media sosial dan marketplace online.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Menyediakan layanan custom sesuai kebutuhan pelanggan.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Keberlanjutan dan Ramah Lingkungan:</Text>Industri genteng di Darmasaba berpotensi dikembangkan secara lebih ramah lingkungan dengan menerapkan metode produksi yang mengurangi limbah dan emisi. Pemanfaatan energi alternatif serta daur ulang bahan limbah dapat membantu menciptakan industri yang lebih berkelanjutan.
|
||||
</ListItem>
|
||||
</List>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
UMKM genteng di Desa Darmasaba memiliki potensi besar untuk terus berkembang sebagai sektor industri unggulan. Dengan inovasi, pemasaran yang lebih luas, serta dukungan dari pemerintah dan masyarakat, industri ini dapat meningkatkan kesejahteraan warga dan memperkuat perekonomian desa.
|
||||
</Text>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,57 @@
|
||||
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={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
Gumuh Sari Waterpark
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/waterpark.png" alt='' w={"100%"} h={400} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi Desa melalui Gumuh Sari Waterpark:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} 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>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -1,54 +0,0 @@
|
||||
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;
|
||||
@@ -0,0 +1,63 @@
|
||||
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={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
IKM Berbasis Pengolahan Pangan
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.4rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/ikm.png" alt='' w={"100%"} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi besar dalam Industri Kecil dan Menengah (IKM) berbasis pengolahan pangan. Dengan sumber daya alam yang melimpah dan warisan kuliner khas Bali, Darmasaba dapat mengembangkan sektor ini untuk meningkatkan kesejahteraan masyarakat dan menciptakan lapangan kerja baru.
|
||||
</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi dan Peran IKM Berbasis Pengolahan Pangan:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Produk Unggulan Pengolahan Pangan</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Beberapa produk olahan pangan yang potensial dikembangkan di Darmasaba meliputi:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Keripik dan Snack Tradisional : Seperti keripik pisang, keripik singkong, dan rengginang.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Sambal Khas Bali : Seperti sambal matah dan sambal embe yang banyak diminati pasar lokal dan nasional.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Minuman Herbal dan Jamu : Berbasis rempah seperti kunyit asam, beras kencur, dan wedang jahe.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Olahan Makanan Berbasis Kelapa : Seperti virgin coconut oil (VCO), serundeng, dan gula aren.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Kue Tradisional Bali : Seperti jaje laklak, jaje uli, dan klepon yang dapat dikemas secara modern.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Peluang Ekonomi dan Pemberdayaan UMKM:</Text>IKM berbasis pengolahan pangan dapat membuka peluang bagi masyarakat, terutama ibu rumah tangga dan pemuda desa, untuk berwirausaha. Dengan dukungan modal dan pelatihan dari pemerintah desa atau BUMDes Pudak Mesari, usaha kecil ini dapat berkembang menjadi industri yang lebih besar.
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Digitalisasi dan Pemasaran Online:</Text>Darmasaba dapat mengembangkan kawasan sentra IKM sebagai pusat produksi, pelatihan, dan pemasaran produk olahan pangan. Dengan adanya fasilitas ini, para pelaku usaha dapat lebih mudah berkolaborasi, meningkatkan kualitas produk, serta mendapatkan akses ke permodalan dan distribusi yang lebih luas.
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Pengembangan Kawasan Sentra IKM:</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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Sinergi dengan Pariwisata dan Agrowisata:</Text>Dengan berkembangnya sektor wisata di Darmasaba, produk olahan pangan dapat dijadikan suvenir khas desa. Pengunjung dapat membeli oleh-oleh seperti sambal kemasan, jajanan khas, atau minuman herbal sebagai bagian dari pengalaman wisata mereka.
|
||||
</ListItem>
|
||||
</List>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
IKM berbasis pengolahan pangan memiliki potensi besar untuk menjadi sektor unggulan di Desa Darmasaba. Dengan inovasi, dukungan teknologi, serta pemasaran yang baik, produk-produk lokal dapat bersaing di pasar yang lebih luas, meningkatkan kesejahteraan masyarakat, dan menjadikan Darmasaba sebagai pusat industri pangan kreatif di Kabupaten Badung.
|
||||
</Text>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,65 @@
|
||||
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={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
Jogging Track Tegeh Aban, Karang Gadon dan Munduk Uma Desa
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/jogging.jpg" alt='' w={"100%"} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi wisata olahraga dan rekreasi melalui Jogging Track Tegeh Aban, Karang Gadon, dan Munduk Uma Desa. Jalur jogging ini tidak hanya menjadi fasilitas olahraga bagi warga, tetapi juga berpotensi dikembangkan sebagai destinasi wisata sehat berbasis alam yang menarik bagi wisatawan lokal maupun luar daerah.
|
||||
</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi dan Peran Jogging Track Tegeh Aban, Karang Gadon dan Munduk Uma Desa:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Keindahan Alam dan Udara Segar:</Text>Jogging track yang membentang di Tegeh Aban, Karang Gadon, dan Munduk Uma Desa menawarkan pemandangan alam yang asri dengan udara segar khas pedesaan. Jalur ini melewati area persawahan hijau, perkebunan, serta hutan kecil yang memberikan pengalaman jogging yang lebih menyenangkan dan menenangkan.
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Fasilitas Olahraga dan Rekreasi </Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Selain untuk jogging, jalur ini juga cocok digunakan untuk:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Bersepeda santai : Jalur yang nyaman untuk pecinta sepeda.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Trekking ringan : Cocok bagi wisatawan yang ingin menikmati suasana pedesaan.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Meditasi dan Yoga : Area yang tenang dan alami, ideal untuk relaksasi.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Destinasi Wisata Sehat dan Edukasi:</Text>Jogging track ini berpotensi dikembangkan sebagai wisata sehat berbasis alam, di mana pengunjung bisa menikmati udara segar sambil berolahraga. Selain itu, jalur ini dapat dijadikan sebagai rute edukasi lingkungan, mengenalkan keanekaragaman hayati, pertanian, serta kehidupan masyarakat desa.
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Potensi Ekonomi bagi Masyarakat </Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Dengan meningkatnya jumlah pengunjung, masyarakat sekitar dapat memanfaatkan peluang usaha seperti:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Warung sehat dan kuliner lokal : Menyediakan makanan dan minuman sehat bagi para pengunjung.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Jasa penyewaan sepeda : Menarik bagi wisatawan yang ingin berkeliling lebih jauh.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Pemandu wisata lokal : Memberikan pengalaman lebih bagi wisatawan yang ingin mengenal sejarah dan budaya desa.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Pengembangan Berkelanjutan:</Text>Agar semakin menarik, jogging track ini bisa dilengkapi dengan fasilitas tambahan seperti tempat istirahat, spot foto alami, papan informasi tentang flora dan fauna, serta area taman bunga untuk mempercantik jalur jogging.
|
||||
</ListItem>
|
||||
</List>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Jogging Track Tegeh Aban, Karang Gadon, dan Munduk Uma Desa memiliki potensi besar sebagai destinasi wisata sehat dan olahraga berbasis alam. Dengan pengelolaan yang baik serta dukungan dari pemerintah desa dan masyarakat, jalur ini bisa menjadi ikon baru Desa Darmasaba yang menarik bagi wisatawan serta meningkatkan perekonomian warga setempat.
|
||||
</Text>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,62 @@
|
||||
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"} px={{ base: "md", md: 0 }} gap={"22"} >
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
Kawasan Kuliner
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/warungumkm.jpg" alt='' w={"100%"} h={400} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi Desa melalui Kawasan Kuliner:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Ragam Kuliner Khas Bali</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Darmasaba memiliki banyak warung dan rumah makan yang menyajikan hidangan khas Bali yang otentik, seperti:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Babi Guling : Salah satu kuliner favorit di Bali yang banyak ditemukan di Darmasaba.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Ayam Betutu : Hidangan ayam berbumbu khas yang dimasak dengan teknik khas Bali.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Lawar : Campuran daging dan sayuran berbumbu khas Bali.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Sate Lilit : Sate khas Bali yang terbuat dari daging cincang yang dibalut pada batang serai.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} 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>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -1,59 +0,0 @@
|
||||
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;
|
||||
@@ -0,0 +1,77 @@
|
||||
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={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
Pemotongan Daging
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/potong-daging.png" alt='' w={"100%"} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi besar dalam sektor pemotongan daging. Kegiatan ini tidak hanya berperan dalam memenuhi kebutuhan konsumsi lokal, tetapi juga mendukung sektor kuliner, usaha mikro, dan distribusi daging ke berbagai wilayah di Bali.
|
||||
</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi dan Peran Pemotongan Daging:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Pemotongan Daging sebagai Sumber Ekonomi</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Usaha pemotongan daging di Darmasaba menjadi salah satu sektor ekonomi yang berkembang pesat, terutama untuk memenuhi permintaan dari:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Warung makan dan rumah tangga : Daging segar untuk kebutuhan harian masyarakat.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Restoran dan usaha kuliner : Banyak digunakan dalam masakan khas Bali, seperti babi guling, sate lilit, dan lawar.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Pasar tradisional dan distributor daging : Suplai daging ke pasar di wilayah sekitar.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Jenis Daging yang Diproduksi</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Kuliner khas desa ini memiliki potensi besar untuk dikembangkan sebagai bisnis UMKM, seperti:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Daging babi : Salah satu produk utama yang digunakan untuk kuliner khas Bali seperti babi guling.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Daging sapi : Untuk kebutuhan rumah tangga, usaha kuliner, hingga upacara adat.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Daging ayam : Bahan dasar berbagai makanan seperti ayam betutu dan sate lilit.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Potensi Distribusi dan Pasar yang Luas</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Pemotongan daging di Darmasaba tidak hanya memenuhi kebutuhan desa, tetapi juga didistribusikan ke berbagai daerah di Bali, termasuk:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Pasar tradisional di Badung dan Denpasar.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Rumah makan, katering, dan warung lokal.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - UMKM yang bergerak di bidang pengolahan daging seperti abon, bakso, dan dendeng.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Peluang Pengolahan dan Inovasi Produk</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Untuk meningkatkan nilai jual, usaha pemotongan daging di Darmasaba dapat dikembangkan dengan inovasi pengolahan seperti:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Daging olahan siap masak : Seperti sosis, bakso, dan abon yang lebih praktis untuk konsumen.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Produk daging asap atau dendeng : Memiliki daya tahan lebih lama dan nilai jual lebih tinggi.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Paket daging beku : Mempermudah distribusi ke restoran dan pelanggan yang membutuhkan penyimpanan lebih lama.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Dukungan dan Pengembangan Usaha</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Agar usaha pemotongan daging di Darmasaba semakin berkembang, diperlukan:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Peningkatan standar kebersihan dan keamanan pangan : Dengan penerapan Good Handling Practices (GHP).</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Pemasaran digital dan kemitraan dengan UMKM : Untuk memperluas jangkauan pasar.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Pengolahan limbah yang ramah lingkungan : Agar tidak mencemari lingkungan sekitar.</Text>
|
||||
</ListItem>
|
||||
</List>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Pemotongan daging di Desa Darmasaba memiliki potensi besar sebagai sektor ekonomi utama, dengan permintaan pasar yang tinggi serta peluang inovasi dalam pengolahan produk daging. Dengan pengelolaan yang baik, usaha ini dapat berkembang menjadi industri yang lebih modern, higienis, dan berkelanjutan.
|
||||
</Text>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -5,9 +5,9 @@ import BackButton from '../../../layanan/_com/BackButto';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} >
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<BackButton />
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
Pertanian
|
||||
@@ -15,43 +15,46 @@ function Page() {
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
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.
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} 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"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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 fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Potensi dan Komoditas Unggulan</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Pertanian di Desa Darmasaba mengandalkan berbagai jenis tanaman yang memiliki nilai ekonomi tinggi, di antaranya:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Padi : Sebagai salah satu desa yang masih mempertahankan sistem subak, Darmasaba menjadi bagian dari lumbung pangan di Bali.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Sayur-mayur : Beberapa jenis sayuran seperti kangkung, bayam, cabai, dan tomat banyak dibudidayakan oleh petani lokal.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Buah-buahan tropis : Termasuk pisang, mangga, dan kelapa, yang menjadi sumber pendapatan tambahan bagi petani.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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 fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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 fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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 fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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 fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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 fz={{ base: "sm", md: "lg" }} 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>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,69 @@
|
||||
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={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
Peternakan Ikan Lele
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/peternakanlele.jpg" alt='' w={"100%"} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi besar dalam sektor peternakan lele. Dengan kondisi lingkungan yang mendukung serta meningkatnya permintaan ikan lele di pasaran, budidaya ikan lele dapat menjadi salah satu sektor ekonomi unggulan yang mampu meningkatkan kesejahteraan masyarakat desa.
|
||||
</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi dan Peran Peternakan Ikan Lele:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Kondisi Lingkungan yang Mendukung</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Darmasaba memiliki sumber air yang cukup serta iklim yang cocok untuk budidaya ikan lele. Kolam-kolam budidaya dapat dibuat dengan berbagai sistem, seperti:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Kolam Terpal : Mudah dibuat dan lebih efisien dalam perawatan.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Kolam Beton : Lebih tahan lama dan cocok untuk produksi skala besar.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Sistem Bioflok : Teknologi modern yang dapat meningkatkan kepadatan ikan dan mengurangi limbah.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Permintaan Pasar yang Tinggi:</Text>Lele merupakan salah satu jenis ikan yang memiliki permintaan tinggi di Bali, baik untuk konsumsi rumah tangga, warung makan, hingga restoran. Produk olahan seperti lele goreng, pecel lele, dan abon lele semakin diminati, membuka peluang besar bagi peternak lele di Darmasaba.
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Inovasi dan Pengembangan Teknologi</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Beberapa pengrajin genteng di Darmasaba telah mulai mengadopsi teknologi modern dalam proses produksi, seperti:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Penggunaan cetakan dan oven pembakaran efisien untuk meningkatkan kualitas dan kapasitas produksi.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Teknik pelapisan anti bocor dan anti lumut untuk membuat genteng lebih tahan lama.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Desain genteng inovatif yang lebih ringan dan mudah dipasang.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Pemasaran dan Ekspansi Pasar</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Dengan meningkatnya pembangunan perumahan dan proyek konstruksi di Bali, permintaan akan genteng berkualitas terus bertambah. UMKM genteng Darmasaba dapat memperluas pasarnya dengan:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Menjalin kerja sama dengan kontraktor dan pengembang properti.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Mempromosikan produk melalui media sosial dan marketplace online.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Menyediakan layanan custom sesuai kebutuhan pelanggan.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Keberlanjutan dan Ramah Lingkungan:</Text>Industri genteng di Darmasaba berpotensi dikembangkan secara lebih ramah lingkungan dengan menerapkan metode produksi yang mengurangi limbah dan emisi. Pemanfaatan energi alternatif serta daur ulang bahan limbah dapat membantu menciptakan industri yang lebih berkelanjutan.
|
||||
</ListItem>
|
||||
</List>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
UMKM genteng di Desa Darmasaba memiliki potensi besar untuk terus berkembang sebagai sektor industri unggulan. Dengan inovasi, pemasaran yang lebih luas, serta dukungan dari pemerintah dan masyarakat, industri ini dapat meningkatkan kesejahteraan warga dan memperkuat perekonomian desa.
|
||||
</Text>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,57 @@
|
||||
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={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
Taman Beji Cengana
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/taman-beji.jpg" alt='' w={"100%"} h={400} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi Desa melalui Taman Beji Cengana:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} 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>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -1,54 +0,0 @@
|
||||
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;
|
||||
@@ -1,48 +0,0 @@
|
||||
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;
|
||||
@@ -0,0 +1,51 @@
|
||||
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={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
TPS3R Pudak Mesari
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/tps.png" alt='' w={"100%"} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi Desa melalui TPS3R Pudak Mesari:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} 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>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,70 @@
|
||||
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={"22"} px={{ base: "md", md: 0 }}>
|
||||
<Box px={{ base: "md", md: 100 }}><BackButton /></Box>
|
||||
<Container w={{ base: "100%", md: "50%" }} >
|
||||
<Box pb={20}>
|
||||
<Text ta={"center"} fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
UMKM
|
||||
</Text>
|
||||
<Text
|
||||
ta={"center"}
|
||||
fw={"bold"}
|
||||
fz={"1.5rem"}
|
||||
>
|
||||
Informasi dan Pelayanan Administrasi Digital
|
||||
</Text>
|
||||
</Box>
|
||||
<Image src="/api/img/umkm.jpeg" alt='' w={"100%"} />
|
||||
</Container>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Text py={20} fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Desa Darmasaba, yang terletak di Kecamatan Abiansemal, Kabupaten Badung, memiliki potensi besar dalam sektor Usaha Mikro, Kecil, dan Menengah (UMKM). Keberadaan UMKM di desa ini tidak hanya menjadi motor penggerak ekonomi lokal, tetapi juga mendukung pelestarian budaya dan kearifan lokal melalui berbagai produk unggulan.
|
||||
</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
Potensi dan Peran UMKM:
|
||||
</Text>
|
||||
<List py={20} type='ordered'>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Kerajinan Tangan dan Produk Lokal</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Darmasaba memiliki banyak pengrajin yang menghasilkan produk unik dengan nilai seni tinggi, seperti:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Genteng dan bahan bangunan tradisional : Genteng khas Darmasaba yang berkualitas tinggi.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Kerajinan anyaman dan ukiran : Produk berbasis rotan dan kayu yang banyak diminati pasar lokal dan internasional.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Pakaian adat dan kain tradisional : Mendukung pelestarian budaya Bali.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Industri Kuliner Khas Darmasaba</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Kuliner khas desa ini memiliki potensi besar untuk dikembangkan sebagai bisnis UMKM, seperti:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Babi Guling : Salah satu kuliner favorit yang banyak diminati wisatawan.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Jajanan tradisional Bali : Seperti laklak, jaja uli, dan klepon yang masih dibuat dengan cara tradisional.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Olahan ikan lele : Seperti abon lele, lele asap, dan pecel lele yang memiliki pasar luas.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>UMKM Berbasis Pengolahan Pangan</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Beberapa UMKM di Darmasaba mengolah hasil pertanian dan peternakan menjadi produk bernilai tambah, seperti:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Keripik singkong dan pisang : Camilan sehat berbasis bahan lokal.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Olahan kelapa : Seperti minyak kelapa murni dan gula aren.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Produk herbal dan jamu : Menggunakan bahan-bahan alami dari tanaman lokal.</Text>
|
||||
</ListItem>
|
||||
<ListItem fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
<Text fz={{ base: "sm", md: "lg" }} fw={"bold"}>Dukungan dan Pengembangan UMKM</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>Agar UMKM di Darmasaba semakin berkembang, perlu adanya:</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Pelatihan dan pendampingan usaha : Untuk meningkatkan kualitas produk dan manajemen usaha.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Pemasaran digital : Menggunakan media sosial dan e-commerce untuk menjangkau pasar lebih luas.</Text>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}> - Kerja sama dengan BUMDes Pudak Mesari : Untuk membantu akses modal dan pengelolaan bisnis yang lebih profesional.</Text>
|
||||
</ListItem>
|
||||
</List>
|
||||
<Text fz={{ base: "sm", md: "lg" }} ta={"justify"}>
|
||||
UMKM di Desa Darmasaba memiliki potensi besar dalam berbagai sektor, mulai dari kerajinan tangan, kuliner, hingga wisata berbasis masyarakat. Dengan inovasi, pemasaran yang lebih luas, dan dukungan dari pemerintah desa serta masyarakat, UMKM Darmasaba dapat berkembang pesat dan menjadi tulang punggung perekonomian desa.
|
||||
</Text>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -10,28 +10,28 @@ const datamap = [
|
||||
images: "/api/img/tps.png",
|
||||
name: "TPS3R Pudak Mesari",
|
||||
kategori: "Lingkungan",
|
||||
link: "/darmasaba/desa/potensi/tps",
|
||||
link: "/darmasaba/desa/potensi/tps3r-pudak-mesari",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
images: "/api/img/ack.png",
|
||||
name: "Bumdes Pudak Mesari",
|
||||
kategori: "Ekonomi",
|
||||
link: "/darmasaba/desa/potensi/bumdes"
|
||||
link: "/darmasaba/desa/potensi/bumdes-pudak-mesari",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
images: "/api/img/taman-beji.jpg",
|
||||
name: "Taman Beji Cengana",
|
||||
kategori: "Wisata",
|
||||
link: "/darmasaba/desa/potensi/taman"
|
||||
link: "/darmasaba/desa/potensi/taman-beji-cengana",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
images: "/api/img/waterpark.png",
|
||||
name: "Gumuh Sari Water Park",
|
||||
kategori: "Wisata",
|
||||
link: "/darmasaba/desa/potensi/gumuh"
|
||||
link: "/darmasaba/desa/potensi/gumuh-sari-water-park",
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
@@ -45,73 +45,75 @@ const datamap = [
|
||||
images: "/api/img/warungumkm.jpg",
|
||||
name: "Kawasan Kuliner",
|
||||
kategori: "Ekonomi",
|
||||
link: "/darmasaba/desa/potensi/kuliner"
|
||||
link: "/darmasaba/desa/potensi/kawasan-kuliner"
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
images: "/api/img/ikm.png",
|
||||
name: "IKM berbasis Pengolahan Pangan",
|
||||
name: "IKM Berbasis Pengolahan Pangan",
|
||||
kategori: "Ekonomi",
|
||||
link: "/darmasaba/desa/potensi/tps"
|
||||
link: "/darmasaba/desa/potensi/ikm-berbasis-pengolahan-pangan"
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
images: "/api/img/genteng.jpeg",
|
||||
name: "Genteng",
|
||||
kategori: "Ekonomi",
|
||||
link: "/darmasaba/desa/potensi/tps"
|
||||
link: "/darmasaba/desa/potensi/genteng"
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
images: "/api/img/peternakanlele.jpg",
|
||||
name: "Peternakan Ikan Lele",
|
||||
kategori: "Ekonomi",
|
||||
link: "/darmasaba/desa/potensi/tps"
|
||||
link: "/darmasaba/desa/potensi/peternakan-ikan-lele"
|
||||
},
|
||||
{
|
||||
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"
|
||||
link: "/darmasaba/desa/potensi/jogging-track-tegeh-aban-karang-gadon-dan-munduk-uma-desa"
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
images: "/api/img/damtanahputih.jpeg",
|
||||
name: "Dam Tanah Putih",
|
||||
kategori: "Wisata",
|
||||
link: "/darmasaba/desa/potensi/tps"
|
||||
link: "/darmasaba/desa/potensi/dam-tanah-putih"
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
images: "/api/img/umkm.jpeg",
|
||||
name: "UMKM",
|
||||
kategori: "Ekonomi",
|
||||
link: "/darmasaba/desa/potensi/tps"
|
||||
link: "/darmasaba/desa/potensi/umkm"
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
images: "/api/img/potong-daging.png",
|
||||
name: "Pemotongan Daging",
|
||||
kategori: "Ekonomi",
|
||||
link: "/darmasaba/desa/potensi/tps"
|
||||
link: "/darmasaba/desa/potensi/pemotongan-daging"
|
||||
},
|
||||
|
||||
|
||||
]
|
||||
function Page() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"} >
|
||||
<Box px={"lg"}>
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"} >
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<BackButton />
|
||||
<Box pb={30}>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Box>
|
||||
<Stack gap={0}>
|
||||
<Flex justify={"space-between"} align={"center"} px={10}>
|
||||
<Flex justify={"space-between"} align={"center"} >
|
||||
<Box>
|
||||
<Text fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
Potensi Desa
|
||||
</Text>
|
||||
<Text ta={"justify"} py={10}>
|
||||
<Text ta={"justify"} >
|
||||
Temukan berbagai potensi dan keunggulan yang dimiliki Desa Darmasaba.
|
||||
</Text>
|
||||
</Box>
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
'use client'
|
||||
|
||||
import colors from "@/con/colors";
|
||||
import { ActionIcon } from "@mantine/core";
|
||||
import { IconArrowLeft } from "@tabler/icons-react";
|
||||
import { useTransitionRouter } from 'next-view-transitions';
|
||||
@@ -7,7 +8,7 @@ import { useTransitionRouter } from 'next-view-transitions';
|
||||
export default function BackButton() {
|
||||
const router = useTransitionRouter()
|
||||
return (
|
||||
<ActionIcon variant="transparent" onClick={() => router.back()}>
|
||||
<ActionIcon bg={colors["blue-button"]} onClick={() => router.back()}>
|
||||
<IconArrowLeft />
|
||||
</ActionIcon>
|
||||
);
|
||||
|
||||
@@ -7,27 +7,33 @@ import VisimisiDesa from './ui/visimisiDesa';
|
||||
import LambangDesa from './ui/lambangDesa';
|
||||
import MaskotDesa from './ui/maskotDesa';
|
||||
import ProfilPerbekel from './ui/profilPerbekel';
|
||||
import LembagaDesa from './ui/lembagaDesa';
|
||||
import MotoDesa from './ui/motoDesa';
|
||||
import SemuaPerbekel from './ui/semuaPerbekel';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"42"}>
|
||||
<Box px={50}>
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Container w={{ base: "100%", md: "50%" }}>
|
||||
<Stack align='center' gap={0}>
|
||||
<Text fz={"3.4rem"} c={colors["blue-button"]} fw={"bold"}>
|
||||
<Text fz={{base: "h1", md: "2.5rem"}} c={colors["blue-button"]} fw={"bold"}>
|
||||
Profile Desa
|
||||
</Text>
|
||||
</Stack>
|
||||
</Container>
|
||||
<Box w={{ base: "100%", md: "100%" }} px={50}>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<ProfileDesa />
|
||||
<SejarahDesa />
|
||||
<VisimisiDesa />
|
||||
<LambangDesa />
|
||||
<MaskotDesa />
|
||||
<ProfilPerbekel />
|
||||
<LembagaDesa />
|
||||
<MotoDesa />
|
||||
<SemuaPerbekel/>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
|
||||
39
src/app/darmasaba/(pages)/desa/profile/ui/lembagaDesa.tsx
Normal file
39
src/app/darmasaba/(pages)/desa/profile/ui/lembagaDesa.tsx
Normal file
@@ -0,0 +1,39 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Image, Paper, Stack, Text } from '@mantine/core';
|
||||
|
||||
function LembagaDesa() {
|
||||
return (
|
||||
<Box pb={70}>
|
||||
<Stack align='center' gap={0}>
|
||||
<Box pb={30}>
|
||||
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Lembaga Desa</Text>
|
||||
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h4", md: "h2"}}>Badan Permusyawaratan Desa (BPD)</Text>
|
||||
</Box>
|
||||
<Paper mb={50} p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
|
||||
<Center pb={10}>
|
||||
<Image src={"/api/img/bpddarmasaba.png"} alt='' w={{ base: 390, md: 1000 }} />
|
||||
</Center>
|
||||
</Paper>
|
||||
<Box pb={30}>
|
||||
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Lembaga pemberdayaan Masyarakat (LPM)</Text>
|
||||
</Box>
|
||||
<Paper mb={50} p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
|
||||
<Center pb={10}>
|
||||
<Image src={"/api/img/bpddarmasaba.png"} alt='' w={{ base: 390, md: 1000 }} />
|
||||
</Center>
|
||||
</Paper>
|
||||
<Box pb={30}>
|
||||
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Perangkat Desa</Text>
|
||||
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h4", md: "h2"}}>Struktur Organisasi Tata Kerja Pemerintahan Desa Darmasaba</Text>
|
||||
</Box>
|
||||
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
|
||||
<Center pb={10}>
|
||||
<Image src={"/api/img/pernagkatdesa.png"} alt='' w={{ base: 390, md: 1000 }} />
|
||||
</Center>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box >
|
||||
);
|
||||
}
|
||||
|
||||
export default LembagaDesa;
|
||||
78
src/app/darmasaba/(pages)/desa/profile/ui/motoDesa.tsx
Normal file
78
src/app/darmasaba/(pages)/desa/profile/ui/motoDesa.tsx
Normal file
@@ -0,0 +1,78 @@
|
||||
import colors from '@/con/colors';
|
||||
import { ActionIcon, Box, Flex, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
|
||||
const dataText = [
|
||||
{
|
||||
id: 1,
|
||||
title: "SANTUN",
|
||||
description: "Memberikan pelayanan yang baik, penuh rasa empati, sopan, dan beretika"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "ADAPTIF",
|
||||
description: "Cepat menyesuaikan diri menghadapi perubahan dan bertindak proaktif"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "INOVATIF",
|
||||
description: "Selalu berusaha menciptakan pembaruan atau kreasi baru"
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: "PROFESIONAL",
|
||||
description: "Memiliki pengetahuan, terampil dan bertanggung jawab"
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: "GESIT",
|
||||
description: "Inisiatif dan cekatan dalam bekerja"
|
||||
},
|
||||
]
|
||||
function MotoDesa() {
|
||||
return (
|
||||
<Box pb={70}>
|
||||
<Stack align='center' gap={0} >
|
||||
<Box pb={30}>
|
||||
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Moto Desa Darmasaba</Text>
|
||||
</Box>
|
||||
<Flex gap={50} pb={50} pt={20} justify={"space-evenly"} align={"center"} >
|
||||
<ActionIcon bg={colors['blue-button']} radius={150} p={{ base: "lg", md: "xl" }}>
|
||||
<Text c={colors['white-1']} ta={"center"} fw={"bold"} fz={{ base: "h2", md: "h1" }}>S</Text>
|
||||
</ActionIcon>
|
||||
<ActionIcon bg={colors['blue-button']} radius={150} p={{ base: "lg", md: "xl" }}>
|
||||
<Text c={colors['white-1']} ta={"center"} fw={"bold"} fz={{ base: "h2", md: "h1" }}>I</Text>
|
||||
</ActionIcon>
|
||||
<ActionIcon bg={colors['blue-button']} radius={150} p={{ base: "lg", md: "xl" }}>
|
||||
<Text c={colors['white-1']} ta={"center"} fw={"bold"} fz={{ base: "h2", md: "h1" }}>G</Text>
|
||||
</ActionIcon>
|
||||
<ActionIcon bg={colors['blue-button']} radius={150} p={{ base: "lg", md: "xl" }}>
|
||||
<Text c={colors['white-1']} ta={"center"} fw={"bold"} fz={{ base: "h2", md: "h1" }}>A</Text>
|
||||
</ActionIcon>
|
||||
<ActionIcon bg={colors['blue-button']} radius={150} p={{ base: "lg", md: "xl" }}>
|
||||
<Text c={colors['white-1']} ta={"center"} fw={"bold"} fz={{ base: "h2", md: "h1" }}>P</Text>
|
||||
</ActionIcon>
|
||||
</Flex>
|
||||
<Paper mb={50} p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2,
|
||||
}}
|
||||
>
|
||||
{dataText.map((v, k) => {
|
||||
return (
|
||||
<Box key={k}>
|
||||
<Text fw={"bold"} fz={{ base: "lg", md: "h3" }}>{v.title}</Text>
|
||||
<Text fz={{ base: "sm", md: "md" }}>{v.description}</Text>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Paper>
|
||||
<Text mb={40} c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h4", md: "h3" }}>"Berkomitmen memberikan pelayanan terbaik dengan prinsip SIGAP untuk masyarakat Desa Darmasaba"</Text>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default MotoDesa;
|
||||
@@ -15,7 +15,6 @@ function ProfileDesa() {
|
||||
<Center>
|
||||
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
|
||||
<SimpleGrid
|
||||
|
||||
cols={{
|
||||
base: 1,
|
||||
sm: 3
|
||||
|
||||
111
src/app/darmasaba/(pages)/desa/profile/ui/semuaPerbekel.tsx
Normal file
111
src/app/darmasaba/(pages)/desa/profile/ui/semuaPerbekel.tsx
Normal file
@@ -0,0 +1,111 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Image, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
nama: "SI GEDE KANIA",
|
||||
wilayah: "PERBEKEL TEGAL",
|
||||
periode: "Tahun 1943 - 1946",
|
||||
foto: "/api/img/perbekel-1.png"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
nama: "SI GEDE GANDEM",
|
||||
wilayah: "PERBEKEL TEGAL",
|
||||
periode: "Tahun 1946 - 1950",
|
||||
foto: "/api/img/perbekel-2.png"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
nama: "I WAYAN SAMA",
|
||||
wilayah: "PERBEKEL TEGAL",
|
||||
periode: "Tahun 1950 - 1953",
|
||||
foto: "/api/img/perbekel-3.png"
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
nama: "I WAYAN NAMBREG",
|
||||
wilayah: "PERBEKEL DARMASABA",
|
||||
periode: "Tahun 1950 - 1960",
|
||||
foto: "/api/img/perbekel-4.png"
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
nama: "IDA BAGUS PUTU OKA",
|
||||
wilayah: "PERBEKEL TEGAL/DARMASABA",
|
||||
periode: "Tahun 1953 - 1974",
|
||||
foto: "/api/img/perbekel-5.png"
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
nama: "I NYOMAN PATRA",
|
||||
wilayah: "PERBEKEL DARMASABA",
|
||||
periode: "Tahun 1974 - 1991",
|
||||
foto: "/api/img/perbekel-6.png"
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
nama: "I MADE RUDJA",
|
||||
wilayah: "PERBEKEL DARMASABA",
|
||||
periode: "Tahun 1991 - 2007",
|
||||
foto: "/api/img/perbekel-7.png"
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
nama: "I WAYAN KALER, SH.MH.",
|
||||
wilayah: "PERBEKEL DARMASABA",
|
||||
periode: "Tahun 2007 - 2013",
|
||||
foto: "/api/img/perbekel-8.png"
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
nama: "I MADE TARAM, SH.",
|
||||
wilayah: "PERBEKEL DARMASABA",
|
||||
periode: "Tahun 2013 - 2019",
|
||||
foto: "/api/img/perbekel-9.png"
|
||||
},
|
||||
]
|
||||
function SemuaPerbekel() {
|
||||
|
||||
return (
|
||||
<Box pb={50}>
|
||||
<Stack align='center'>
|
||||
<Box pb={30}>
|
||||
<Text c={colors['blue-button']} ta={"center"} fw={"bold"} fz={{ base: "h1", md: "2.5rem" }}>Perbekel Dari Masa Ke Masa</Text>
|
||||
</Box>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}
|
||||
>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Box key={k}>
|
||||
<Paper mb={50} radius={26} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
|
||||
<Box>
|
||||
<Center>
|
||||
<Image src={v.foto} alt='' />
|
||||
</Center>
|
||||
</Box>
|
||||
<Box>
|
||||
<Stack gap={"sm"} py={10}>
|
||||
<Text ta={"center"} fw={"bold"} fz={{ base: "h3", md: "h3" }}>{v.nama}</Text>
|
||||
<Text ta={"center"} fz={{ base: "h5", md: "h4" }}>{v.wilayah}</Text>
|
||||
<Text ta={"center"} fz={{ base: "h5", md: "h4" }}>{v.periode}</Text>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
})
|
||||
}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default SemuaPerbekel;
|
||||
@@ -0,0 +1,24 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, Image } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Pendapatan Asli Desa
|
||||
</Text>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<Image src={'/api/img/pa-desa.png'} alt=''/>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
250
src/app/darmasaba/(pages)/ekonomi/demografi-pekerjaan/page.tsx
Normal file
250
src/app/darmasaba/(pages)/ekonomi/demografi-pekerjaan/page.tsx
Normal file
@@ -0,0 +1,250 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Paper, Text, ColorSwatch, Flex } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { BarChart } from '@mantine/charts';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
Pekerjaan: 'Guru',
|
||||
laki: 2,
|
||||
perempuan: 3
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
Pekerjaan: 'Belajar/Mahasiswa',
|
||||
laki: 37,
|
||||
perempuan: 38
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
Pekerjaan: 'Karyawan Bumdn',
|
||||
laki: 1,
|
||||
perempuan: 0
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
Pekerjaan: 'Buruh Tani/Perkebunan',
|
||||
laki: 1,
|
||||
perempuan: 0
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
Pekerjaan: 'Karyawan Swasta',
|
||||
laki: 3,
|
||||
perempuan: 17
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
Pekerjaan: 'Karyawan Honorer',
|
||||
laki: 2,
|
||||
perempuan: 1
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
Pekerjaan: 'Buruh Harian Lepas',
|
||||
laki: 8,
|
||||
perempuan: 5
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
Pekerjaan: 'Belum/Tidak Bekerja',
|
||||
laki: 87,
|
||||
perempuan: 44
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
Pekerjaan: ' Kepolisian RI (Polri)',
|
||||
laki: 4,
|
||||
perempuan: 0
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
Pekerjaan: 'Wiraswasta Mengurus Rumah Tangga',
|
||||
laki: 1,
|
||||
perempuan: 7
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
Pekerjaan: 'Dosen',
|
||||
laki: 1,
|
||||
perempuan: 1
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
Pekerjaan: 'Perangkat Desa',
|
||||
laki: 17,
|
||||
perempuan: 19
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
Pekerjaan: 'Nelayan',
|
||||
laki: 3,
|
||||
perempuan: 0
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
Pekerjaan: 'Penyuluh Pertanian',
|
||||
laki: 33,
|
||||
perempuan: 24
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
Pekerjaan: 'Tukang Las/Pandai Besi',
|
||||
laki: 5,
|
||||
perempuan: 0
|
||||
},
|
||||
{
|
||||
id: 16,
|
||||
Pekerjaan: 'Sopir/Driver',
|
||||
laki: 10,
|
||||
perempuan: 3
|
||||
},
|
||||
{
|
||||
id: 17,
|
||||
Pekerjaan: 'Teknisi/Listrik',
|
||||
laki: 25,
|
||||
perempuan: 0
|
||||
},
|
||||
{
|
||||
id: 18,
|
||||
Pekerjaan: 'Montir/Mekanik',
|
||||
laki: 25,
|
||||
perempuan: 0
|
||||
},
|
||||
{
|
||||
id: 19,
|
||||
Pekerjaan: 'Karyawan Hotel/Pariwisata',
|
||||
laki: 2,
|
||||
perempuan: 52
|
||||
},
|
||||
{
|
||||
id: 20,
|
||||
Pekerjaan: 'Pengrajin (Batik, Anyaman, Kayu)',
|
||||
laki: 5,
|
||||
perempuan: 25
|
||||
},
|
||||
{
|
||||
id: 21,
|
||||
Pekerjaan: 'Tukang Bangunan',
|
||||
laki: 25,
|
||||
perempuan: 5
|
||||
},
|
||||
{
|
||||
id: 22,
|
||||
Pekerjaan: 'Tukang Kayu/Furnitur',
|
||||
laki: 25,
|
||||
perempuan: 0
|
||||
},
|
||||
{
|
||||
id: 23,
|
||||
Pekerjaan: 'Penjahit',
|
||||
laki: 2,
|
||||
perempuan: 35
|
||||
},
|
||||
{
|
||||
id: 24,
|
||||
Pekerjaan: 'Pedagang Pasar',
|
||||
laki: 25,
|
||||
perempuan: 30
|
||||
},
|
||||
{
|
||||
id: 25,
|
||||
Pekerjaan: 'Warung Makan/Penjual Makanan',
|
||||
laki: 15,
|
||||
perempuan: 30
|
||||
},
|
||||
{
|
||||
id: 26,
|
||||
Pekerjaan: 'Satpam/Security',
|
||||
laki: 20,
|
||||
perempuan: 5
|
||||
},
|
||||
{
|
||||
id: 27,
|
||||
Pekerjaan: 'Pengusaha Kecil (UMKM)',
|
||||
laki: 5,
|
||||
perempuan: 20
|
||||
},
|
||||
{
|
||||
id: 28,
|
||||
Pekerjaan: 'Karyawan Restoran/Kafe',
|
||||
laki: 5,
|
||||
perempuan: 15
|
||||
},
|
||||
{
|
||||
id: 29,
|
||||
Pekerjaan: 'Freelancer',
|
||||
laki: 20,
|
||||
perempuan: 10
|
||||
},
|
||||
{
|
||||
id: 30,
|
||||
Pekerjaan: 'Fotografer',
|
||||
laki: 25,
|
||||
perempuan: 9
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Demografi Pekerjaan
|
||||
</Text>
|
||||
<Text ta={'center'} fz={'h4'}>Desa Darmasaba memiliki komposisi penduduk yang beragam dalam sektor pekerjaan</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<Paper p={'xl'}>
|
||||
<Text fw={'bold'} fz={'h4'}>Statistik Demografi Pekerjaan Di Desa Darmasaba</Text>
|
||||
<BarChart
|
||||
type='stacked'
|
||||
p={10}
|
||||
mb={50}
|
||||
h={400}
|
||||
data={data}
|
||||
dataKey="Pekerjaan"
|
||||
series={[
|
||||
{ name: 'laki', color: '#5082EE' },
|
||||
{ name: 'perempuan', color: '#6EDF9C' },
|
||||
]}
|
||||
tickLine="y"
|
||||
xAxisProps={{
|
||||
angle: -45, // Rotate labels by -45 degrees
|
||||
textAnchor: 'end', // Anchor text to the end for better alignment
|
||||
height: 100, // Increase height for rotated labels
|
||||
interval: 0, // Show all labels
|
||||
style: {
|
||||
fontSize: '12px', // Adjust font size if needed
|
||||
overflow: 'visible',
|
||||
whiteSpace: 'nowrap'
|
||||
}
|
||||
}}
|
||||
/>
|
||||
<Flex pb={30} justify={'center'} gap={'xl'} align={'center'}>
|
||||
<Box>
|
||||
<Flex gap={{ base: 0, md: 5 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>Laki-Laki</Text>
|
||||
<ColorSwatch color="#5082EE" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 0, md: 5 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>Perempuan</Text>
|
||||
<ColorSwatch color="#6EDF9C" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,119 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, CheckIcon, Combobox, ComboboxChevron, ComboboxOption, ComboboxOptions, ComboboxTarget, Group, InputBase, InputPlaceholder, Paper, SimpleGrid, Stack, Text, useCombobox } from '@mantine/core';
|
||||
import { useState } from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { BarChart } from '@mantine/charts';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
tahun: '2024',
|
||||
Penduduk: 400000
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
tahun: '2025',
|
||||
Penduduk: 450000
|
||||
},
|
||||
|
||||
]
|
||||
const tahun = [
|
||||
'2024',
|
||||
'2025'
|
||||
];
|
||||
function Page() {
|
||||
const combobox = useCombobox({
|
||||
onDropdownClose: () => combobox.resetSelectedOption(),
|
||||
onDropdownOpen: (eventSource) => {
|
||||
if (eventSource === 'keyboard') {
|
||||
combobox.selectActiveOption();
|
||||
} else {
|
||||
combobox.updateSelectedOptionIndex('active');
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
const [value, setValue] = useState<string | null>('2024');
|
||||
|
||||
const options = tahun.map((item) => (
|
||||
<ComboboxOption value={item} key={item} active={item === value}>
|
||||
<Group gap="xs">
|
||||
{item === value && <CheckIcon size={12} />}
|
||||
<span>{item}</span>
|
||||
</Group>
|
||||
</ComboboxOption>
|
||||
));
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Jumlah Penduduk Miskin Tahun 2024-2025
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<SimpleGrid
|
||||
pb={20}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2
|
||||
}}
|
||||
>
|
||||
<Paper p={'xl'}>
|
||||
<Text fz={'h3'}>Tahun: 2024</Text>
|
||||
<Text fw={"bold"} fz={'h1'}>4,800,000 Orang</Text>
|
||||
</Paper>
|
||||
<Paper p={'xl'}>
|
||||
<Text>Pilih Tahun</Text>
|
||||
<Combobox
|
||||
store={combobox}
|
||||
resetSelectionOnOptionHover
|
||||
withinPortal={false}
|
||||
onOptionSubmit={(val) => {
|
||||
setValue(val);
|
||||
combobox.updateSelectedOptionIndex('active');
|
||||
}}
|
||||
>
|
||||
<ComboboxTarget targetType="button">
|
||||
<InputBase
|
||||
component="button"
|
||||
type="button"
|
||||
pointer
|
||||
rightSection={<ComboboxChevron />}
|
||||
rightSectionPointerEvents="none"
|
||||
onClick={() => combobox.toggleDropdown()}
|
||||
>
|
||||
{value || <InputPlaceholder>Pick value</InputPlaceholder>}
|
||||
</InputBase>
|
||||
</ComboboxTarget>
|
||||
|
||||
<Combobox.Dropdown>
|
||||
<ComboboxOptions>{options}</ComboboxOptions>
|
||||
</Combobox.Dropdown>
|
||||
</Combobox>
|
||||
</Paper>
|
||||
</SimpleGrid>
|
||||
<Paper p={'xl'}>
|
||||
<Text pb={10} fw={'bold'} fz={'h4'}>Jumlah Penduduk Miskin Per Tahun</Text>
|
||||
<BarChart
|
||||
p={10}
|
||||
h={300}
|
||||
data={data}
|
||||
dataKey="tahun"
|
||||
series={[
|
||||
{ name: 'Penduduk', color: '#8785D3' },
|
||||
]}
|
||||
tickLine="y"
|
||||
/>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,142 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, Center, Paper, ColorSwatch, Flex } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { PieChart } from '@mantine/charts';
|
||||
|
||||
const datausiaKerja = [
|
||||
{
|
||||
id: 1,
|
||||
name: '18 - 25',
|
||||
value: 45,
|
||||
color: 'indigo.6'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: '26 - 35',
|
||||
value: 35,
|
||||
color: 'teal.6'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: '36 - 45',
|
||||
value: 15,
|
||||
color: 'yellow.6'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: '46+',
|
||||
value: 5,
|
||||
color: 'red.6'
|
||||
},
|
||||
]
|
||||
const datakerjaPendidikan = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'SD',
|
||||
value: 10,
|
||||
color: 'indigo.6'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'SMP',
|
||||
value: 20,
|
||||
color: 'teal.6'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'SMA/SMK',
|
||||
value: 45,
|
||||
color: 'yellow.6'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'D3/S1',
|
||||
value: 25,
|
||||
color: 'red.6'
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Jumlah Penduduk Usia Kerja Yang Menganggur
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<Paper p={'lg'}>
|
||||
<Text fw={'bold'} fz={'h3'}>Pengangguran Berdasarkan Usia</Text>
|
||||
<Center>
|
||||
<PieChart size={300} withLabelsLine labelsPosition="outside" labelsType="percent" withLabels data={datausiaKerja} withTooltip tooltipDataSource="segment" mx="auto" />
|
||||
</Center>
|
||||
<Flex pb={30} justify={'center'} gap={'xl'} align={'center'}>
|
||||
<Box>
|
||||
<Flex gap={{ base: 5, md: 8 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>18-25</Text>
|
||||
<ColorSwatch color="#4b6Ef5" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 5, md: 8 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>26-35</Text>
|
||||
<ColorSwatch color="#14b885" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 5, md: 8 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>36-45</Text>
|
||||
<ColorSwatch color="#E6A03B" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 5, md: 8 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>46+</Text>
|
||||
<ColorSwatch color="#DB524D" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Paper>
|
||||
<Paper p={'lg'}>
|
||||
<Text fw={'bold'} fz={'h3'}>Pengangguran Berdasarkan Pendidikan</Text>
|
||||
<Center>
|
||||
<PieChart size={300} withLabelsLine labelsPosition="outside" labelsType="percent" withLabels data={datakerjaPendidikan} withTooltip tooltipDataSource="segment" mx="auto" />
|
||||
</Center>
|
||||
<Flex pb={30} justify={'center'} gap={'xl'} align={'center'}>
|
||||
<Box>
|
||||
<Flex gap={{ base: 5, md: 8 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>SD</Text>
|
||||
<ColorSwatch color="#4b6Ef5" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 5, md: 8 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>SMP</Text>
|
||||
<ColorSwatch color="#14b885" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 5, md: 8 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>SMA/SMK</Text>
|
||||
<ColorSwatch color="#E6A03B" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 5, md: 8 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>D3/S1</Text>
|
||||
<ColorSwatch color="#DB524D" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,185 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, Group, Flex, Button, SimpleGrid, Paper, Center, ColorSwatch, TableTd, TableTr, Table, TableTbody, TableTh, TableThead } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { IconBriefcase, IconChevronDown, IconDownload, IconSchool, IconUserOff, IconUsersGroup } from '@tabler/icons-react';
|
||||
import { BarChart } from '@mantine/charts';
|
||||
|
||||
const data1 = [
|
||||
{
|
||||
id: 1,
|
||||
icon: <IconUserOff size={35} />,
|
||||
judul: 'Total Pengangguran',
|
||||
jumlah: '140',
|
||||
persentase: <Text fz={'h4'} c={'green'}>-12.5% dari 2024</Text>
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
icon: <IconSchool size={35} />,
|
||||
judul: 'Pengangguran Terdidik',
|
||||
jumlah: '80',
|
||||
persentase: <Text fz={'h4'} c={'gray'}>57.1% dari total</Text>
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
icon: <IconUsersGroup size={35} />,
|
||||
judul: 'Usia Produktif',
|
||||
jumlah: '125',
|
||||
persentase: <Text fz={'h4'} c={'gray'}>89.3% dari total</Text>
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
icon: <IconBriefcase size={35} />,
|
||||
judul: 'Sedang Mencari Kerja',
|
||||
jumlah: '95',
|
||||
persentase: <Text fz={'h4'} c={'red'}>67.9% dari total</Text>
|
||||
},
|
||||
]
|
||||
|
||||
const dataPengangguran = [
|
||||
{
|
||||
id: 1,
|
||||
bulan: 'Jan',
|
||||
berpendidikan: 98,
|
||||
takberpendidikan: 74,
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
bulan: 'Feb',
|
||||
berpendidikan: 85,
|
||||
takberpendidikan: 74,
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
bulan: 'Mar',
|
||||
berpendidikan: 76,
|
||||
takberpendidikan: 55,
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
bulan: 'Apr',
|
||||
berpendidikan: 98,
|
||||
takberpendidikan: 74,
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
bulan: 'Mei',
|
||||
berpendidikan: 74,
|
||||
takberpendidikan: 54,
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
bulan: 'Jun',
|
||||
berpendidikan: 55,
|
||||
takberpendidikan: 50,
|
||||
},
|
||||
]
|
||||
const dataTable = [
|
||||
{ bulan: 'Jan', total: 160, terdidik: 95, takterdidik: 65, perubahan: '-' },
|
||||
{ bulan: 'Feb', total: 155, terdidik: 90, takterdidik: 65, perubahan: '-3.1%' },
|
||||
{ bulan: 'Mar', total: 150, terdidik: 88, takterdidik: 62, perubahan: '-3.2%' },
|
||||
{ bulan: 'Apr', total: 148, terdidik: 85, takterdidik: 63, perubahan: '-1.3%' },
|
||||
{ bulan: 'Mei', total: 145, terdidik: 82, takterdidik: 63, perubahan: '-2.0%' },
|
||||
{ bulan: 'Jun', total: 140, terdidik: 80, takterdidik: 60, perubahan: '-3.4%' },
|
||||
]
|
||||
function Page() {
|
||||
const rows = dataTable.map((element) => (
|
||||
<TableTr key={element.bulan}>
|
||||
<TableTd ta={'center'}>{element.bulan}</TableTd>
|
||||
<TableTd ta={'center'}>{element.total}</TableTd>
|
||||
<TableTd ta={'center'}>{element.terdidik}</TableTd>
|
||||
<TableTd ta={'center'}>{element.takterdidik}</TableTd>
|
||||
<TableTd ta={'center'}>{element.perubahan}</TableTd>
|
||||
</TableTr>
|
||||
));
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Jumlah Pengangguran 2024 - 2025
|
||||
</Text>
|
||||
<Group py={20} align='center' justify='space-between'>
|
||||
<Text fz={'h4'} fw={"bold"}>DATA PENGANGGURAN DESA</Text>
|
||||
<Flex gap={'xl'}>
|
||||
<Button c={'black'} bg={colors['white-1']} rightSection={<IconChevronDown size={20} />}>2025</Button>
|
||||
<Button leftSection={<IconDownload size={20} />}>Export</Button>
|
||||
</Flex>
|
||||
</Group>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<SimpleGrid
|
||||
cols={1}
|
||||
pb={20}
|
||||
>
|
||||
{data1.map((v, k) => {
|
||||
return (
|
||||
<Paper px={25} key={k} py={'lg'} bg={colors['white-1']} shadow={'md'}>
|
||||
<Flex justify={'space-between'} align={'center'}>
|
||||
<Box>
|
||||
<Stack>
|
||||
<Text fz={'h4'}>{v.judul}</Text>
|
||||
<Text fz={'h2'} fw={'bold'}>{v.jumlah}</Text>
|
||||
{v.persentase}
|
||||
</Stack>
|
||||
</Box>
|
||||
{v.icon}
|
||||
</Flex>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Paper p={'lg'}>
|
||||
<Flex pb={30} justify={'flex-end'} gap={'xl'} align={'center'}>
|
||||
<Box>
|
||||
<Flex gap={{ base: 0, md: 5 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>Pengangguran Berpendidikan</Text>
|
||||
<ColorSwatch color="#5082EE" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 0, md: 5 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>Pengangguran Tak Berpendidikan</Text>
|
||||
<ColorSwatch color="#DA524C" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
</Flex>
|
||||
<Center>
|
||||
<BarChart
|
||||
p={10}
|
||||
h={400}
|
||||
data={dataPengangguran}
|
||||
dataKey="bulan"
|
||||
series={[
|
||||
{ name: 'berpendidikan', color: '#5082EE' },
|
||||
{ name: 'takberpendidikan', color: '#DA524C' },
|
||||
]}
|
||||
tickLine="y"
|
||||
/>
|
||||
</Center>
|
||||
</Paper>
|
||||
<Paper p={'lg'}>
|
||||
<Text fw={'bold'} fz={'h4'}>Detail Data Pengangguran</Text>
|
||||
<Table striped highlightOnHover>
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh ta={'center'}>Bulan</TableTh>
|
||||
<TableTh ta={'center'}>Total</TableTh>
|
||||
<TableTh ta={'center'}>Terdidik</TableTh>
|
||||
<TableTh ta={'center'}>Tidak Terdidik</TableTh>
|
||||
<TableTh ta={'center'}>Perubahan</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>{rows}</TableTbody>
|
||||
</Table>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
128
src/app/darmasaba/(pages)/ekonomi/lowongan-kerja-lokal/page.tsx
Normal file
128
src/app/darmasaba/(pages)/ekonomi/lowongan-kerja-lokal/page.tsx
Normal file
@@ -0,0 +1,128 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, TextInput, Group, SimpleGrid, Paper, Flex, Button } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { IconBriefcase, IconClock, IconMapPin, IconSearch } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
kerja: 'Kasir',
|
||||
tempat: 'Toko Sumber Rejeki',
|
||||
alamat: 'Desa Munggu , Badung',
|
||||
gaji: 'Rp. 2.500.000 / bulan'
|
||||
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
kerja: 'Kasir',
|
||||
tempat: 'Toko Sumber Rejeki',
|
||||
alamat: 'Desa Munggu , Badung',
|
||||
gaji: 'Rp. 2.500.000 / bulan'
|
||||
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
kerja: 'Kasir',
|
||||
tempat: 'Toko Sumber Rejeki',
|
||||
alamat: 'Desa Munggu , Badung',
|
||||
gaji: 'Rp. 2.500.000 / bulan'
|
||||
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
kerja: 'Kasir',
|
||||
tempat: 'Toko Sumber Rejeki',
|
||||
alamat: 'Desa Munggu , Badung',
|
||||
gaji: 'Rp. 2.500.000 / bulan'
|
||||
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
kerja: 'Kasir',
|
||||
tempat: 'Toko Sumber Rejeki',
|
||||
alamat: 'Desa Munggu , Badung',
|
||||
gaji: 'Rp. 2.500.000 / bulan'
|
||||
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
kerja: 'Kasir',
|
||||
tempat: 'Toko Sumber Rejeki',
|
||||
alamat: 'Desa Munggu , Badung',
|
||||
gaji: 'Rp. 2.500.000 / bulan'
|
||||
|
||||
},
|
||||
|
||||
]
|
||||
function Page() {
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Lowongan Kerja Lokal
|
||||
</Text>
|
||||
<Group justify='center'>
|
||||
<TextInput
|
||||
radius={'xl'}
|
||||
w={{ base: 500, md: 700 }}
|
||||
placeholder='Cari Pekerjaan'
|
||||
leftSection={<IconSearch size={20} />}
|
||||
/>
|
||||
</Group>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3
|
||||
}}
|
||||
>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Paper key={k} p={'xl'}>
|
||||
<Stack gap={'md'}>
|
||||
<Box>
|
||||
<Flex gap={'xl'} align={'center'}>
|
||||
<IconBriefcase color={colors['blue-button']} size={50} />
|
||||
<Box>
|
||||
<Text fw={'bold'} fz={'h4'} c={colors['blue-button']}>{v.kerja}</Text>
|
||||
<Text fz={'h4'}>{v.tempat}</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={'xl'} align={'center'}>
|
||||
<IconMapPin color={colors['blue-button']} size={50} />
|
||||
<Text fz={'h4'}>{v.alamat}</Text>
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={'xl'} align={'center'}>
|
||||
<IconClock color={colors['blue-button']} size={50} />
|
||||
<Box>
|
||||
<Text fw={'bold'} fz={'h4'} c={colors['blue-button']}>Full Time</Text>
|
||||
<Text fz={'h4'}>{v.gaji}</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Box>
|
||||
<Button onClick={() => router.push('https://www.whatsapp.com/?lang=id')} bg={colors['blue-button']}>Lamar Sekarang</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box >
|
||||
</Stack >
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
182
src/app/darmasaba/(pages)/ekonomi/pasar-desa/page.tsx
Normal file
182
src/app/darmasaba/(pages)/ekonomi/pasar-desa/page.tsx
Normal file
@@ -0,0 +1,182 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Combobox, Flex, Group, Image, InputBase, InputPlaceholder, Paper, SimpleGrid, Stack, Text, TextInput, useCombobox } from '@mantine/core';
|
||||
import { IconArrowDown, IconMapPinFilled, IconSearch, IconShoppingCartFilled, IconStarFilled } from '@tabler/icons-react';
|
||||
import { useState } from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { motion } from 'motion/react';
|
||||
|
||||
const groceries = [
|
||||
'Makanan',
|
||||
'Minuman',
|
||||
'Pakaian',
|
||||
'Alat Dapur',
|
||||
'Alat Mandi',
|
||||
'Furniture',
|
||||
];
|
||||
|
||||
const dataBarang = [
|
||||
{
|
||||
id: 1,
|
||||
image: '/api/img/semat.png',
|
||||
judul: 'Semat Bambu / Semat Banten',
|
||||
harga: 'Rp. 3000 / pcs',
|
||||
bintang: '4.9',
|
||||
alamat: 'Jl. Kecubung no.6'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
image: '/api/img/kerupuk.png',
|
||||
judul: 'Kerupuk Babi',
|
||||
harga: 'Rp. 12000 / pcs',
|
||||
bintang: '4.9',
|
||||
alamat: 'Jl. Kenari no.7'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
image: '/api/img/beras.png',
|
||||
judul: 'beras Merah Organik',
|
||||
harga: 'Rp. 40000 / 1 kg',
|
||||
bintang: '4.9',
|
||||
alamat: 'Jl. Mawar no.8'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
image: '/api/img/genteng.png',
|
||||
judul: 'Genteng',
|
||||
harga: 'Rp. 3600 / pcs',
|
||||
bintang: '4.9',
|
||||
alamat: 'Jl. Kecubung no.16'
|
||||
},
|
||||
|
||||
]
|
||||
function Page() {
|
||||
const [search, setSearch] = useState('');
|
||||
const combobox = useCombobox({
|
||||
onDropdownClose: () => {
|
||||
combobox.resetSelectedOption();
|
||||
combobox.focusTarget();
|
||||
setSearch('');
|
||||
},
|
||||
|
||||
onDropdownOpen: () => {
|
||||
combobox.focusSearchInput();
|
||||
},
|
||||
});
|
||||
|
||||
const [value, setValue] = useState<string | null>(null);
|
||||
|
||||
const options = groceries
|
||||
.filter((item) => item.toLowerCase().includes(search.toLowerCase().trim()))
|
||||
.map((item) => (
|
||||
<Combobox.Option value={item} key={item}>
|
||||
{item}
|
||||
</Combobox.Option>
|
||||
));
|
||||
const router = useRouter()
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Pasar Desa
|
||||
</Text>
|
||||
<Text px={{ base: 20, md: 150 }} ta={"center"} fz={{ base: "h4", md: "h3" }} >
|
||||
Pasar Desa Online merupakan Media Promosi yang bertujuan untuk membantu warga desa dalam memasarkan dan memperkenalkan produknya kepada masyarakat.
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<SimpleGrid
|
||||
pb={30}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2
|
||||
}}
|
||||
>
|
||||
<Box>
|
||||
<Combobox
|
||||
store={combobox}
|
||||
withinPortal={false}
|
||||
onOptionSubmit={(val) => {
|
||||
setValue(val);
|
||||
combobox.closeDropdown();
|
||||
}}
|
||||
>
|
||||
<Combobox.Target>
|
||||
<InputBase
|
||||
component="button"
|
||||
type="button"
|
||||
pointer
|
||||
rightSection={<Combobox.Chevron />}
|
||||
onClick={() => combobox.toggleDropdown()}
|
||||
rightSectionPointerEvents="none"
|
||||
>
|
||||
{value || <InputPlaceholder>Kategori</InputPlaceholder>}
|
||||
</InputBase>
|
||||
</Combobox.Target>
|
||||
|
||||
<Combobox.Dropdown>
|
||||
<Combobox.Search
|
||||
value={search}
|
||||
onChange={(event) => setSearch(event.currentTarget.value)}
|
||||
placeholder="Search groceries"
|
||||
/>
|
||||
<Combobox.Options>
|
||||
{options.length > 0 ? options : <Combobox.Empty>Nothing found</Combobox.Empty>}
|
||||
</Combobox.Options>
|
||||
</Combobox.Dropdown>
|
||||
</Combobox>
|
||||
</Box>
|
||||
<Box>
|
||||
<TextInput
|
||||
placeholder='Cari Produk'
|
||||
leftSection={<IconSearch size={20} />}
|
||||
/>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
<SimpleGrid cols={{ base: 1, md: 4 }}>
|
||||
{dataBarang.map((v, k) => {
|
||||
return (
|
||||
<Stack key={k}>
|
||||
<motion.div
|
||||
onClick={() => router.push('https://www.whatsapp.com/?lang=id')}
|
||||
whileHover={{ scale: 1.05 }}
|
||||
whileTap={{ scale: 0.8 }}
|
||||
>
|
||||
<Paper p={'lg'}>
|
||||
<Image radius={'lg'} src={v.image} alt='' />
|
||||
<Text py={10} fw={'bold'} fz={'lg'}>{v.judul}</Text>
|
||||
<Text fz={'md'}>{v.harga}</Text>
|
||||
<Flex py={10} gap={'md'}>
|
||||
<IconStarFilled size={20} color='#EBCB09' />
|
||||
<Text fz={'sm'} ml={2}>{v.bintang}</Text>
|
||||
</Flex>
|
||||
<Flex justify={'space-between'} align={'center'}>
|
||||
<Box>
|
||||
<Flex gap={'md'} align={'center'}>
|
||||
<IconMapPinFilled size={20} color='red' />
|
||||
<Text fz={'sm'} ml={2}>{v.alamat}</Text>
|
||||
</Flex>
|
||||
</Box>
|
||||
<IconShoppingCartFilled size={20} color={colors['blue-button']} />
|
||||
</Flex>
|
||||
</Paper>
|
||||
</motion.div>
|
||||
</Stack>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Group justify='center'>
|
||||
<Button bg={colors['blue-button']} rightSection={<IconArrowDown size={20} color={colors['white-1']} />} fz={'md'}>Lihat Produk Lainnya</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,99 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, SimpleGrid, Paper } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { LineChart } from '@mantine/charts';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Bantuan Tunai',
|
||||
deskripsi: 'Bantuan keuangan langsung bagi keluarga kurang mampu'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Pelatihan Kerja',
|
||||
deskripsi: 'Program pelatihan keterampilan untuk meningkatkan peluang kerja'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Subsidi Pangan',
|
||||
deskripsi: 'Distribusi bahan pangan bersubsidi bagi masyarakat kurang mampu'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
judul: 'Layanan Kesehatan Gratis',
|
||||
deskripsi: 'Akses kesehatan gratis bagi masyarakat kurang mampu'
|
||||
},
|
||||
]
|
||||
const dataStatistik = [
|
||||
{
|
||||
id: 1,
|
||||
tahun: '2022',
|
||||
Kemiskinan: 400000
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
tahun: '2023',
|
||||
Kemiskinan: 450000
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
tahun: '2024',
|
||||
Kemiskinan: 500000
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
tahun: '2025',
|
||||
Kemiskinan: 400000
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Program Kemiskinan
|
||||
</Text>
|
||||
<Text ta={'center'} fz={'h4'}>Berbagai program bantuan untuk mengurangi kemiskinan dan meningkatkan kesejahteraan masyarakat</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<SimpleGrid
|
||||
pb={10}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2
|
||||
}}
|
||||
>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Paper p={'xl'} key={k}>
|
||||
<Text fz={'h3'} fw={'bold'} c={colors['blue-button']}>{v.judul}</Text>
|
||||
<Text fz={'lg'} c={'black'}>{v.deskripsi}</Text>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Paper p={'xl'}>
|
||||
<Text fz={'h4'} fw={'bold'} c={colors['blue-button']}>Statistik Kemiskinan Masyarakat</Text>
|
||||
<LineChart
|
||||
h={300}
|
||||
data={dataStatistik}
|
||||
dataKey="tahun"
|
||||
series={[
|
||||
{ name: 'Kemiskinan', color: colors['blue-button'] },
|
||||
]}
|
||||
curveType="linear"
|
||||
/>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,69 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, Paper } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { BarChart } from '@mantine/charts';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
sektor: 'Sektor Pertanian',
|
||||
Ton: 20
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
sektor: 'Sektor Peternakan',
|
||||
Ton: 5
|
||||
},
|
||||
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Sektor Unggulan Desa Darmasaba
|
||||
</Text>
|
||||
<Text ta={'center'} fz={'h4'}> Desa Darmasaba dikenal sebagai desa dengan potensi unggulan di sektor pertanian dan peternakan</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<Paper p={'xl'}>
|
||||
<Text fw={'bold'} fz={'h4'}>Jumlah Penduduk Miskin Per Tahun</Text>
|
||||
<Text fz={'h4'} ta={'justify'}>
|
||||
Pertanian di Darmasaba berfokus pada padi, sayuran, dan hortikultura yang dikembangkan dengan metode pertanian
|
||||
organik serta sistem irigasi tradisional yang efisien. Keberlanjutan dalam pertanian juga didukung dengan pemanfaatan
|
||||
teknologi modern untuk meningkatkan produktivitas hasil panen.
|
||||
</Text>
|
||||
</Paper>
|
||||
<Paper p={'xl'}>
|
||||
<Text fw={'bold'} fz={'h4'}>Sektor Peternakan</Text>
|
||||
<Text fz={'h4'} ta={'justify'}>
|
||||
Di bidang peternakan, Desa Darmasaba memiliki potensi besar dalam pengembangan sapi, ayam, dan babi. Sistem
|
||||
peternakan yang diterapkan mengutamakan pengelolaan pakan alami dan perawatan hewan yang sehat, sehingga
|
||||
menghasilkan produk ternak berkualitas tinggi.
|
||||
</Text>
|
||||
</Paper>
|
||||
<Paper p={'xl'}>
|
||||
<Text pb={10} fw={'bold'} fz={'h4'}>Statistik Sektor Unggulan Darmasaba</Text>
|
||||
<BarChart
|
||||
p={10}
|
||||
h={300}
|
||||
data={data}
|
||||
dataKey="sektor"
|
||||
series={[
|
||||
{ name: 'Ton', color: colors['blue-button'] },
|
||||
]}
|
||||
tickLine="y"
|
||||
/>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,24 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, Image } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Text px={{ base: 'md', md: 100 }} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Struktur Organisasi dan SK Pengurus BUMDesa
|
||||
</Text>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<Image src={'/api/img/bpddarmasaba.png'} alt='' />
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,56 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, SimpleGrid, Paper, List, ListItem, Flex, ActionIcon } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { IconArrowRight, IconBulbFilled } from '@tabler/icons-react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Ajukan Ide Inovatif
|
||||
</Text>
|
||||
<Text ta={'center'} fz={'h4'}>Desa Darmasaba percaya bahwa setiap warga memiliki potensi luar biasa untuk menciptakan perubahan positif. Platform "Ajukan Ide Inovatif" hadir sebagai ruang inklusif bagi seluruh masyarakat untuk mengembangkan dan mengusulkan gagasan transformatif.</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} p={'lg'}>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2,
|
||||
}}
|
||||
>
|
||||
<Paper p={'xl'} >
|
||||
<Text fz={'h3'} fw={'bold'} c={colors['blue-button']}>Tujuan Ide Inovatif Ini</Text>
|
||||
<List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Mendorong partisipasi aktif masyarakat</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Memfasilitasi inovasi berbasis lokal</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Memecahkan tantangan komunal</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Mengembangkan potensi kreativitas warga</ListItem>
|
||||
</List>
|
||||
</Paper>
|
||||
<Paper p={'xl'} >
|
||||
<Flex align={'center'} justify={'space-between'}>
|
||||
<Box>
|
||||
<Text fz={'h4'} fw={'bold'} c={colors['blue-button']}>Apabila Anda Ingin Mengajukan Ide Inovatif Bisa Klik Pada Gambar Di Samping</Text>
|
||||
<IconArrowRight size={30} color={colors['blue-button']} />
|
||||
</Box>
|
||||
<Box px={{ base: 5, md: 10 }} py={5}>
|
||||
<ActionIcon variant="transparent" size={150}>
|
||||
<IconBulbFilled size={150} color={colors['blue-button']} />
|
||||
</ActionIcon>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Paper>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,105 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, List, ListItem, Paper, SimpleGrid, Image } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
image: '/api/img/administrasi-digital.png',
|
||||
judul: 'Layanan Administrasi Digital',
|
||||
deskripsi: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Sistem pengurusan dokumen kependudukan online.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pembuatan KTP, KK, Surat Keterangan secara daring.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Antrian dan pembayaran pajak berbasis aplikasi mobile.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Sistem informasi kependudukan terintegrasi.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
image: '/api/img/edukasi-digital.png',
|
||||
judul: 'Edukasi Digital',
|
||||
deskripsi: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Ruang Belajar Digital dengan akses internet gratis.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pelatihan komputer dan literasi digital untuk semua usia.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Kursus online keterampilan digital (desain, pemrograman, marketing).</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Beasiswa pendidikan teknologi untuk pemuda desa.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Perpustakaan digital dengan koleksi buku elektronik.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
image: '/api/img/ekonomi-digital.png',
|
||||
judul: 'Ekonomi Digital',
|
||||
deskripsi: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Marketplace produk UMKM Darmasaba.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Platform pemasaran hasil pertanian dan kerajinan lokal.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Sistem pembayaran digital untuk pelaku usaha desa.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Inkubator bisnis digital untuk wirausaha muda.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pelatihan e-commerce dan digital marketing.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
image: '/api/img/kesehatan-daring.png',
|
||||
judul: 'Kesehatan Daring',
|
||||
deskripsi: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Telemedicine dengan dokter dan puskesmas.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Monitoring kesehatan berbasis aplikasi.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pendaftaran antrian puskesmas online.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Edukasi kesehatan melalui platform digital.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Rekam medis elektronik.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
image: '/api/img/pertanian-cerdas.png',
|
||||
judul: 'Pertanian Cerdas',
|
||||
deskripsi: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Sistem informasi cuaca dan prediksi pertanian.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Konsultasi pertanian online dengan ahli.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Penjualan hasil pertanian melalui platform digital.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pelatihan pertanian modern berbasis teknologi.</ListItem>
|
||||
</List>
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Desa Digital / Smart Village
|
||||
</Text>
|
||||
<Text ta={'center'} fz={'h4'}>Mewujudkan Desa Darmasaba sebagai pusat inovasi digital yang memberdayakan masyarakat, meningkatkan kesejahteraan, dan menciptakan peluang ekonomi berbasis teknologi.</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<SimpleGrid
|
||||
pb={10}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3
|
||||
}}
|
||||
>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Paper p={'xl'} key={k}>
|
||||
<Image src={v.image} pb={10} radius={10} alt='' />
|
||||
<Text fz={'h3'} fw={'bold'} c={colors['blue-button']}>{v.judul}</Text>
|
||||
<Box pr={'lg'}>
|
||||
{v.deskripsi}
|
||||
</Box>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,139 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, List, ListItem, Paper, SimpleGrid, Image } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
image: '/api/img/pertanian-cerdas.png',
|
||||
judul: 'Pertanian Cerdas',
|
||||
subjudul1: 'Sistem Irigasi Hemat Air',
|
||||
subjudul2: 'Pengolahan Limbah Pertanian',
|
||||
deskripsi1: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Penggunaan sensor kelembaban tanah</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Kontrol penyiraman otomatis </ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pengurangan konsumsi air hingga 40%</ListItem>
|
||||
</List>,
|
||||
deskripsi2: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Mesin pencacah jerami otomatis</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Konversi limbah menjadi pupuk organik</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Mengurangi pembakaran sampah pertanian</ListItem>
|
||||
</List>,
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
image: '/api/img/energi-terbarukan.png',
|
||||
judul: 'Energi Terbarukan',
|
||||
subjudul1: 'Pembangkit Listrik Mikrohidro',
|
||||
subjudul2: 'Solar Home System',
|
||||
deskripsi1: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Memanfaatkan aliran sungai sekitar</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Kapasitas 10-50 kW</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Elektrifikasi mandiri desa</ListItem>
|
||||
</List>,
|
||||
deskripsi2: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Panel surya untuk rumah tangga </ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Akses listrik 24 jam</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Hemat biaya energi</ListItem>
|
||||
</List>,
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
image: '/api/img/pengolahan-pangan.png',
|
||||
judul: 'Pengolahan Pangan',
|
||||
subjudul1: 'Mesin Pengering Hasil Pertanian',
|
||||
subjudul2: 'Alat Pengolah Hasil Pertanian',
|
||||
deskripsi1: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Teknologi pengering tenaga surya</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Menjaga kualitas hasil panen</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Mencegah kerusakan pasca panen</ListItem>
|
||||
</List>,
|
||||
deskripsi2: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Mesin pengupas dan pengemas produk</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Meningkatkan nilai jual komoditas</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Standarisasi kualitas produk</ListItem>
|
||||
</List>,
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
image: '/api/img/pengelolaan-sampah.png',
|
||||
judul: 'Pengelolaan Sampah',
|
||||
subjudul1: 'Sistem Pengolahan Sampah Terpadu',
|
||||
subjudul2: 'Komposter Komunal',
|
||||
deskripsi1: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pemilahan otomatis</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Daur ulang sampah organik dan anorganik</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pembangkit listrik dari sampah</ListItem>
|
||||
</List>,
|
||||
deskripsi2: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Teknologi pengomposan cepat</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Menghasilkan pupuk organik</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Mengurangi sampah ke TPA</ListItem>
|
||||
</List>,
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
image: '/api/img/kesehatan-daring.png',
|
||||
judul: 'Kesehatan Masyarakat',
|
||||
subjudul1: 'Alat Deteksi Dini Penyakit',
|
||||
subjudul2: 'Air Bersih Mandiri',
|
||||
deskripsi1: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Skrining kesehatan portable </ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pemeriksaan tekanan darah dan gula </ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Konsultasi medis jarak jauh</ListItem>
|
||||
</List>,
|
||||
deskripsi2: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Sistem filter air canggih </ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Menghilangkan kontaminan </ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Jaminan kualitas air minum
|
||||
|
||||
</ListItem>
|
||||
</List>,
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Info Teknologi Tepat Guna
|
||||
</Text>
|
||||
<Text ta={'center'} fz={'h4'}>Desa Darmasaba berkomitmen mengembangkan teknologi tepat guna yang sesuai dengan kebutuhan masyarakat, mendukung pembangunan berkelanjutan, dan meningkatkan kualitas hidup warga.</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} p={'lg'}>
|
||||
<SimpleGrid
|
||||
pb={10}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3
|
||||
}}
|
||||
>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Paper p={'xl'} key={k}>
|
||||
<Image src={v.image} pb={10} radius={10} alt='' />
|
||||
<Text fz={'h3'} fw={'bold'} c={colors['blue-button']}>{v.judul}</Text>
|
||||
<Box pr={'lg'} pb={10}>
|
||||
<Text fz={'h4'} fw={'bold'} >{v.subjudul1}</Text>
|
||||
{v.deskripsi1}
|
||||
</Box>
|
||||
<Box pr={'lg'}>
|
||||
<Text fz={'h4'} fw={'bold'} >{v.subjudul2}</Text>
|
||||
{v.deskripsi2}
|
||||
</Box>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,83 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, Paper, Flex, Group, SimpleGrid, Button, Image, Center } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { IconChevronDown } from '@tabler/icons-react';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
bulan: 'JANUARI 2025',
|
||||
judul: 'Darmasaba Smart Waste',
|
||||
deskripsi: 'Sistem manajemen sampah terpadu yang memudahkan warga untuk memilah dan mendaur ulang sampah.',
|
||||
kolaborator: 'Kolaborator: DLH Kabupaten Badung, Komunitas Peduli Lingkungan, TPS3R Pudak Mesari'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
bulan: 'FEBRUARI 2025',
|
||||
judul: 'Darmasaba Digital Market',
|
||||
deskripsi: 'Platform e-commerce untuk produk UMKM desa yang menghubungkan produsen lokal dengan pasar global.',
|
||||
kolaborator: 'Kolaborator: Kementerian Desa PDTT, UMKM Darmasaba'
|
||||
}
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<>
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Kolaborasi Inovasi
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<Group justify='flex-end'>
|
||||
<Paper bg={colors['blue-button']} p={5} w={{ base: 150, md: 300 }}>
|
||||
<Flex px={20} align={'center'} justify={'space-between'}>
|
||||
<Text fz={'h4'} fw={'bold'} c={colors['white-1']}>Tahun</Text>
|
||||
<IconChevronDown size={20} color={colors['white-1']} />
|
||||
</Flex>
|
||||
</Paper>
|
||||
</Group>
|
||||
<SimpleGrid cols={{ base: 1, md: 2 }} spacing={'lg'}>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Paper p={'xl'} key={k}>
|
||||
<Text fz={'h3'} fw={'bold'} c={colors['blue-button']}>{v.judul}</Text>
|
||||
<Box pr={'lg'} pb={20}>
|
||||
{v.deskripsi}
|
||||
</Box>
|
||||
<Box pr={'lg'}>
|
||||
{v.kolaborator}
|
||||
</Box>
|
||||
</Paper>
|
||||
);
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Group py={40} justify='center'>
|
||||
<Button px={80} rightSection={<IconChevronDown />} radius={6} bg={colors["blue-button"]} c={colors["white-1"]}>Lihat Laporan Lainnya</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
<Box py={40} px={{ base: "md", md: 100 }} bg={colors['white-trans-1']}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Mitra Kolaborasi
|
||||
</Text>
|
||||
<Text ta={'center'} fz={'h4'}>Kami berkolaborasi dengan berbagai mitra dari berbagai sektor untuk mewujudkan visi Smart Village Darmasaba.</Text>
|
||||
</Box>
|
||||
<Center>
|
||||
<Image src={'/api/img/logoukm-kolaborasiinvoasi.png'} alt='' w={{base: 500, md: 650}}/>
|
||||
</Center>
|
||||
</Stack>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,67 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconBell, IconFileCheckFilled, IconMessageCircleQuestion } from '@tabler/icons-react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
icon: <IconFileCheckFilled size={50} color={colors['blue-button']} />,
|
||||
judul: 'Administrasi Online',
|
||||
deskripsi: 'Pengurusan surat dan dokumen secara digital tanpa perlu datang ke kantor desa'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
icon: <IconMessageCircleQuestion size={50} color={colors['blue-button']} />,
|
||||
judul: 'Pengaduan Masyarakat',
|
||||
deskripsi: 'Sampaikan keluhan dan aspirasi Anda melalui platform digital kami'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
icon: <IconBell size={50} color={colors['blue-button']} />,
|
||||
judul: 'Informasi Desa',
|
||||
deskripsi: 'Akses berita dan pengumuman terbaru seputar kegiatan desa'
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Layanan Online Desa
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<SimpleGrid
|
||||
pb={10}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 1
|
||||
}}
|
||||
>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Stack key={k} >
|
||||
|
||||
<Paper p={'xl'} >
|
||||
<Box>
|
||||
{v.icon}
|
||||
</Box>
|
||||
<Text fz={'h3'} fw={'bold'} c={colors['blue-button']}>{v.judul}</Text>
|
||||
<Text fz={'lg'} c={'black'}>{v.deskripsi}</Text>
|
||||
</Paper>
|
||||
</Stack>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,81 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, SimpleGrid, Paper, Center, Button } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { IconBuildingCircus, IconChartLine, IconLeaf, IconRecycle, IconTrophy } from '@tabler/icons-react';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
icon: <IconLeaf size={50} color={colors['blue-button']} />,
|
||||
judul: 'Ekowisata dan Desa Hijau',
|
||||
deskripsi: 'Inisiatif ramah lingkungan untuk desa berkelanjutan'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
icon: <IconTrophy size={50} color={colors['blue-button']} />,
|
||||
judul: 'Kompetisi dan Festival Desa',
|
||||
deskripsi: 'Ajang kompetisi inovasi dan festival tahunan desa'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
icon: <IconBuildingCircus size={50} color={colors['blue-button']} />,
|
||||
judul: 'Wisata Kreatif dan Budaya',
|
||||
deskripsi: 'Promosi destinasi wisata berbasis budaya dan alam'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
icon: <IconChartLine size={50} color={colors['blue-button']} />,
|
||||
judul: 'Ekonomi Kreatif',
|
||||
deskripsi: 'Mendukung pelaku UMKM dengan platform digital untuk mempromosikan produk lokal ke pasar global'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
icon: <IconRecycle size={50} color={colors['blue-button']} />,
|
||||
judul: 'Smart Waste Management',
|
||||
deskripsi: 'Inisiatif pengelolaan sampah berbasis teknologi untuk menciptakan lingkungan yang bersih dan berkelanjutan.'
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Program Kreatif Desa
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'} justify='center'>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3
|
||||
}}
|
||||
>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Stack key={k} >
|
||||
<Paper p={'xl'} >
|
||||
<Center pb={20}>
|
||||
{v.icon}
|
||||
</Center>
|
||||
<Text ta={'center'} fz={'h3'} fw={'bold'} c={colors['blue-button']}>{v.judul}</Text>
|
||||
<Text py={10} ta={'center'} fz={'lg'} c={'black'}>{v.deskripsi}</Text>
|
||||
<Center>
|
||||
<Button bg={colors['blue-button']}>Selengkapnya</Button>
|
||||
</Center>
|
||||
</Paper>
|
||||
</Stack>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,107 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Image, List, ListItem, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data1 = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Peran Pecalang dalam Keamanan Desa',
|
||||
image: '/api/img/pecalang.png',
|
||||
pengertian: 'Pecalang adalah petugas keamanan adat di Bali yang memiliki peran penting dalam menjaga ketertiban dan budaya lokal. Tugas mereka meliputi:',
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Mengamankan upacara adat dan kegiatan keagamaan.</ListItem>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Mengatur lalu lintas saat ada perayaan atau kegiatan besar.</ListItem>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Berpatroli untuk mencegah gangguan keamanan di lingkungan desa.</ListItem>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Berkoordinasi dengan aparat desa dan kepolisian dalam penanganan situasi darurat.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Patwal (Patroli Pengawal) Desa',
|
||||
image: '/api/img/patwal-1.png',
|
||||
pengertian: 'Selain Pecalang, Desa Darmasaba juga memiliki Patwal yang bertugas menjaga keamanan sehari-hari. Peran mereka antara lain:',
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Berpatroli secara rutin untuk memastikan lingkungan tetap aman.</ListItem>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Menjaga ketertiban lalu lintas di area desa.</ListItem>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Melakukan tindakan preventif terhadap potensi gangguan keamanan.</ListItem>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Siap siaga dalam keadaan darurat untuk membantu warga.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Layanan Keamanan yang Tersedia',
|
||||
image: '/api/img/pospecalang.png',
|
||||
pengertian: 'Jika terjadi keadaan darurat atau membutuhkan bantuan keamanan, warga dapat menghubungi:',
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Pos Pecalang Desa: [Masukkan Nomor Kontak].</ListItem>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Patwal Desa Darmasaba: [Masukkan Nomor Kontak].</ListItem>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Polsek Terdekat: 110 (Layanan Kepolisian).</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
judul: 'Program Keamanan Desa',
|
||||
image: '/api/img/rond.png',
|
||||
pengertian: 'Untuk meningkatkan keamanan, Desa Darmasaba menjalankan berbagai program, seperti:',
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Ronda Malam Warga: Kegiatan jaga malam secara bergilir oleh warga bersama Pecalang dan Patwal.</ListItem>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}>Sosialisasi Keamanan: Edukasi bagi warga tentang cara menjaga keamanan lingkungan.</ListItem>
|
||||
<ListItem fz={{ base: 'h4', md: 'lg' }}> Pengawasan Kamera CCTV: Memantau titik- titik strategis untuk mencegah tindak kejahatan.</ListItem>
|
||||
</List>
|
||||
}
|
||||
]
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Keamanan Lingkungan (Pecalang / Patwal)
|
||||
</Text>
|
||||
<Text px={{ base: 20, md: 150 }} ta={"center"} fz={{ base: "h4", md: "h3" }} >
|
||||
Keamanan dan ketertiban lingkungan di Desa Darmasaba dijaga melalui peran aktif Pecalang dan Patwal (Patroli Pengawal). Mereka bertugas memastikan desa tetap aman, tertib, dan kondusif bagi seluruh warga.
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<SimpleGrid
|
||||
pb={10}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data1.map((v, k) => {
|
||||
return (
|
||||
<Paper radius={10} key={k} bg={colors["white-trans-1"]}>
|
||||
<Stack gap={'xs'}>
|
||||
<Center px={10} py={20}>
|
||||
<Image src={v.image} alt='' />
|
||||
</Center>
|
||||
<Box px={'lg'}>
|
||||
<Box pb={20}>
|
||||
<Text pb={10} c={colors["blue-button"]} fw={"bold"} fz={"h3"}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Text pb={10} fz={"h4"} ta={'justify'}>
|
||||
{v.pengertian}
|
||||
</Text>
|
||||
<Box px={10}>
|
||||
{v.deskripsi}
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
160
src/app/darmasaba/(pages)/keamanan/kontak-darurat/page.tsx
Normal file
160
src/app/darmasaba/(pages)/keamanan/kontak-darurat/page.tsx
Normal file
@@ -0,0 +1,160 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Avatar, Box, Flex, Group, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconAmbulance, IconBadge, IconBuildingBank, IconBuildingSkyscraper, IconFiretruck, IconFirstAidKit, IconPhoneCall, IconUser } from '@tabler/icons-react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const emergencyServices = [
|
||||
{
|
||||
id: 1,
|
||||
name: "Polisi",
|
||||
icon: <IconBadge size={24} color={colors['blue-button']} />,
|
||||
nomor: '081xxxxxxxxx'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "Ambulans",
|
||||
icon: <IconAmbulance size={24} color={colors['blue-button']} />,
|
||||
nomor: '081xxxxxxxxx'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: "Pemadam Kebakaran",
|
||||
icon: <IconFiretruck size={24} color={colors['blue-button']} />,
|
||||
nomor: '081xxxxxxxxx'
|
||||
}
|
||||
];
|
||||
|
||||
const healthFacilities = [
|
||||
{
|
||||
id: 4,
|
||||
name: "Puskesmas Darmasaba",
|
||||
icon: <IconFirstAidKit size={24} color={colors['blue-button']} />,
|
||||
nomor: '081xxxxxxxxx'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: "UGD Terdekat",
|
||||
icon: <IconAmbulance size={24} color={colors['blue-button']} />,
|
||||
nomor: '081xxxxxxxxx'
|
||||
}
|
||||
];
|
||||
|
||||
const villageGovernment = [
|
||||
{
|
||||
id: 6,
|
||||
name: "Kantor Desa Darmasaba",
|
||||
icon: <IconBuildingSkyscraper size={24} color={colors['blue-button']} />,
|
||||
nomor: '081xxxxxxxxx'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
name: "Kepala Desa",
|
||||
icon: <IconUser size={24} color={colors['blue-button']} />,
|
||||
nomor: '081xxxxxxxxx'
|
||||
}
|
||||
];
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Kontak Darurat
|
||||
</Text>
|
||||
<Text px={{ base: 20, md: 150 }} ta={"center"} fz={{ base: "h4", md: "h3" }} >
|
||||
Desa Darmasaba, Kecamatan Abiansemal, Kabupaten Badung.
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
|
||||
<Flex justify={'center'} gap={'lg'} align={'center'}>
|
||||
<Avatar radius={"xl"} size={'lg'} bg={colors['BG-trans']}>
|
||||
<IconPhoneCall size={30} color={colors["blue-button"]} />
|
||||
</Avatar>
|
||||
<Box>
|
||||
<Text ta={'center'} c={colors['blue-button']} py={10} fz={{ base: "md", md: "h4" }} fw={"bold"} >
|
||||
Nomor Darurat Utama
|
||||
</Text>
|
||||
<Text ta={'center'} fw={"bold"} fz={'h2'} c={colors["blue-button"]}>112</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<SimpleGrid cols={{ base: 1, md: 2 }} spacing="xl">
|
||||
{/* Layanan Darurat */}
|
||||
<Paper p="lg" radius="md" bg={colors['white-trans-1']}>
|
||||
<Group pb="md" align="center">
|
||||
<Avatar radius={"xl"} size={'lg'} bg={colors['BG-trans']}>
|
||||
<IconFirstAidKit size={30} color={colors["blue-button"]} />
|
||||
</Avatar>
|
||||
<Text fw="bold" fz={{ base: "lg", md: "xl" }} c={colors["blue-button"]}>
|
||||
Layanan Darurat
|
||||
</Text>
|
||||
</Group>
|
||||
|
||||
{emergencyServices.map((v, k) => (
|
||||
<Group key={k} px="md" py="sm" bg={colors['BG-trans']} mb="xs" justify="space-between" style={{ borderRadius: 8 }}>
|
||||
<Group>
|
||||
{v.icon}
|
||||
<Text>{v.name}</Text>
|
||||
</Group>
|
||||
<Text>{v.nomor}</Text>
|
||||
</Group>
|
||||
))}
|
||||
</Paper>
|
||||
|
||||
{/* Fasilitas Kesehatan */}
|
||||
<Paper p="lg" radius="md" bg={colors['white-trans-1']}>
|
||||
<Group pb="md" align="center">
|
||||
<Avatar radius={"xl"} size={'lg'} bg={colors['BG-trans']}>
|
||||
<IconBuildingSkyscraper size={30} color={colors["blue-button"]} />
|
||||
</Avatar>
|
||||
<Text fw="bold" fz={{ base: "lg", md: "xl" }} c={colors["blue-button"]}>
|
||||
Fasilitas Kesehatan
|
||||
</Text>
|
||||
</Group>
|
||||
|
||||
{healthFacilities.map((v, k) => (
|
||||
<Group key={k} px="md" py="sm" bg={colors['BG-trans']} mb="xs" justify="space-between" style={{ borderRadius: 8 }}>
|
||||
<Group>
|
||||
{v.icon}
|
||||
<Text>{v.name}</Text>
|
||||
</Group>
|
||||
<Text>{v.nomor}</Text>
|
||||
</Group>
|
||||
))}
|
||||
</Paper>
|
||||
|
||||
{/* Pemerintah Desa */}
|
||||
<Paper p="lg" radius="md" bg={colors['white-trans-1']}>
|
||||
<Group pb="md" align="center">
|
||||
<Avatar radius={"xl"} size={'lg'} bg={colors['BG-trans']}>
|
||||
<IconBuildingBank size={30} color={colors["blue-button"]} />
|
||||
</Avatar>
|
||||
<Text fw="bold" fz={{ base: "lg", md: "xl" }} c={colors["blue-button"]}>
|
||||
Pemerintah Desa
|
||||
</Text>
|
||||
</Group>
|
||||
|
||||
{villageGovernment.map((v, k) => (
|
||||
<Group key={k} px="md" py="sm" bg={colors['BG-trans']} mb="xs" justify="space-between" style={{ borderRadius: 8 }}>
|
||||
<Group>
|
||||
{v.icon}
|
||||
<Text>{v.name}</Text>
|
||||
</Group>
|
||||
<Text>{v.nomor}</Text>
|
||||
</Group>
|
||||
))}
|
||||
</Paper>
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
118
src/app/darmasaba/(pages)/keamanan/laporan-publik/page.tsx
Normal file
118
src/app/darmasaba/(pages)/keamanan/laporan-publik/page.tsx
Normal file
@@ -0,0 +1,118 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, Flex, ColorSwatch, SimpleGrid, List, ListItem, Button, Paper, Title } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { IconArrowRight } from '@tabler/icons-react';
|
||||
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Kasus Pencurian Banjar Tengah',
|
||||
tanggal: '3 Februari 2025, 02:00 WITA',
|
||||
deskripsi: <List>
|
||||
<ListItem>Laporan ke Polsek setempat</ListItem>
|
||||
<ListItem>Penyisiran area oleh Pecalang</ListItem>
|
||||
<ListItem>Koordinasi dengan dealer motor</ListItem>
|
||||
<ListItem>Penyebaran informasi ke grup keamanan</ListItem>
|
||||
</List>,
|
||||
button: <Button fz={'md'} fullWidth bg={'#2A742D'}>Terselesaikan</Button>
|
||||
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Kasus Narkoba Banjar Kaja',
|
||||
tanggal: '10 Februari 2025, 22:30 WITA',
|
||||
deskripsi: <List>
|
||||
<ListItem>Koordinasi dengan Satres Narkoba</ListItem>
|
||||
<ListItem>Penggerebekan lokasi</ListItem>
|
||||
<ListItem>Pengamanan barang bukti</ListItem>
|
||||
<ListItem>Pemeriksaan saksi</ListItem>
|
||||
</List>,
|
||||
button: <Button fz={'md'} fullWidth bg={'#D1961F'}>Dalam Proses</Button>
|
||||
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Kasus Tawuran Banjar Kaja',
|
||||
tanggal: '15 Februari 2025, 22:30 WITA',
|
||||
deskripsi: <List>
|
||||
<ListItem>Laporan ke Polsek setempat</ListItem>
|
||||
<ListItem>Penggerebekan lokasi</ListItem>
|
||||
<ListItem>Pengamanan barang bukti</ListItem>
|
||||
<ListItem>Pemeriksaan saksi</ListItem>
|
||||
</List>,
|
||||
button: <Button fz={'md'} fullWidth bg={'#2A742D'}>Terselesaikan</Button>
|
||||
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Laporan Keamanan Lingkungan
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<Flex justify={'space-between'} align={'center'}>
|
||||
<Text fz={{ base: 'sm', md: 'h4' }} fw={'bold'}>Laporan Terbaru</Text>
|
||||
<Box>
|
||||
<Flex gap={'lg'}>
|
||||
<Box>
|
||||
<Flex gap={{ base: 2, md: 5 }} align={'center'}>
|
||||
<Text fz={{ base: 'sm', md: 'h4' }}>Terselesaikan</Text>
|
||||
<ColorSwatch color="#2A742D" size={20} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 2, md: 5 }} align={'center'}>
|
||||
<Text fz={{ base: 'sm', md: 'h4' }}>Dalam Proses</Text>
|
||||
<ColorSwatch color="#D1961F" size={20} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 2, md: 5 }} align={'center'}>
|
||||
<Text fz={{ base: 'sm', md: 'h4' }}>Gagal</Text>
|
||||
<ColorSwatch color="#A34437" size={20} />
|
||||
</Flex>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Flex>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3
|
||||
}}
|
||||
>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Paper radius={'lg'} key={k} bg={colors['white-trans-1']} p={'xl'}>
|
||||
<Stack>
|
||||
<Title c={colors['blue-button']} order={1}>{v.judul}</Title>
|
||||
<Text fs={'italic'} fz={'xl'}>{v.tanggal}</Text>
|
||||
<Box>
|
||||
<Text fw={'bold'}>Penanganan:</Text>
|
||||
{v.deskripsi}
|
||||
</Box>
|
||||
<Box>
|
||||
{v.button}
|
||||
</Box>
|
||||
<Button bg={colors['blue-button']} rightSection={<IconArrowRight size={20} color={colors['white-1']} />}>Lihat Detail Kronologi</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,123 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Flex, Group, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { IconArrowRight } from '@tabler/icons-react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<SimpleGrid
|
||||
px={{ base: 20, md: 100 }}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2
|
||||
}}
|
||||
>
|
||||
{/* Content 1 */}
|
||||
<Box pt={{base: 0, md: 35}}>
|
||||
<Text c={colors["blue-button"]} fz={{ base: "h4", md: "h3" }} >
|
||||
Info Keamanan dan Pencegahan Kriminalitas
|
||||
</Text>
|
||||
<Text fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Kontak Darurat
|
||||
</Text>
|
||||
<Group>
|
||||
<Button rightSection={<IconArrowRight />} mt={20} radius={10} bg={colors["blue-button"]} c={colors["white-1"]}>
|
||||
Lihat Detail
|
||||
</Button>
|
||||
</Group>
|
||||
</Box>
|
||||
{/* Content 2 */}
|
||||
<SimpleGrid cols={{ base: 1, md: 2 }}>
|
||||
<Paper p={"lg"}>
|
||||
<Text c={colors["blue-button"]} fw={'bold'} fz={{ base: "h4", md: "h3" }} >
|
||||
Tips menjaga keamanan lingkungan
|
||||
</Text>
|
||||
<Text fz={{ base: "h5", md: "h4" }} c={colors["blue-button"]} >
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
|
||||
</Text>
|
||||
<Group>
|
||||
<Button rightSection={<IconArrowRight />} mt={20} radius={10} bg={colors["blue-button"]} c={colors["white-1"]}>
|
||||
Lihat Detail
|
||||
</Button>
|
||||
</Group>
|
||||
</Paper>
|
||||
<Paper p={"lg"}>
|
||||
<Text c={colors["blue-button"]} fw={'bold'} fz={{ base: "h4", md: "h3" }} >
|
||||
Mengenali tanda-tanda kegiatan kriminal
|
||||
</Text>
|
||||
<Text fz={{ base: "h5", md: "h4" }} c={colors["blue-button"]} >
|
||||
the printing and typesetting industry. the printing and typesetting industry.
|
||||
</Text>
|
||||
<Group>
|
||||
<Button rightSection={<IconArrowRight />} mt={20} radius={10} bg={colors["blue-button"]} c={colors["white-1"]}>
|
||||
Lihat Detail
|
||||
</Button>
|
||||
</Group>
|
||||
</Paper>
|
||||
</SimpleGrid>
|
||||
{/* Content 3 */}
|
||||
<Paper p={'xl'}>
|
||||
<Text fz={{ base: "h3", md: "h2" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Program Keamanan Rutin
|
||||
</Text>
|
||||
<Stack pt={30} gap={'lg'}>
|
||||
<Box>
|
||||
<Paper p={"md"} bg={colors['blue-button']} w={{ base: "100%", md: "100%" }}>
|
||||
<Flex align={'center'} justify={'space-between'}>
|
||||
<Text fz={'h3'} c={colors['white-1']}>Ronda Malam</Text>
|
||||
<IconArrowRight size={30} color={colors['white-1']} />
|
||||
</Flex>
|
||||
</Paper>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper p={"md"} bg={colors['blue-button']} w={{ base: "100%", md: "100%" }}>
|
||||
<Flex align={'center'} justify={'space-between'}>
|
||||
<Text fz={'h3'} c={colors['white-1']}>Ronda Malam</Text>
|
||||
<IconArrowRight size={30} color={colors['white-1']} />
|
||||
</Flex>
|
||||
</Paper>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper p={"md"} bg={colors['blue-button']} w={{ base: "100%", md: "100%" }}>
|
||||
<Flex align={'center'} justify={'space-between'}>
|
||||
<Text fz={'h3'} c={colors['white-1']}>Ronda Malam</Text>
|
||||
<IconArrowRight size={30} color={colors['white-1']} />
|
||||
</Flex>
|
||||
</Paper>
|
||||
</Box>
|
||||
<Box pt={25}>
|
||||
<Button fullWidth rightSection={<IconArrowRight size={20} color={colors['white-1']} />}>Lihat program lainnya</Button>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
{/* Content 4 */}
|
||||
<Box>
|
||||
<Paper p={'xl'} >
|
||||
<Box style={{ maxWidth: "560px", width: "100%", aspectRatio: "16/9" }}>
|
||||
<iframe width="100%"
|
||||
height="100%"
|
||||
src="https://www.youtube.com/embed/p5OkdBgasWA?si=6lFKXeE9LN5zcJQq" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" ></iframe>
|
||||
</Box>
|
||||
<Text py={10} fz={{ base: "h3", md: "h2" }} fw={'bold'} c={colors['blue-button']}>
|
||||
Patroli Malam Darmasaba
|
||||
</Text>
|
||||
<Text fz={'h4'} >
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
|
||||
</Text>
|
||||
<Box pt={10}>
|
||||
<Button bg={colors['blue-button']} rightSection={<IconArrowRight size={20} color={colors['white-1']} />}>
|
||||
Lihat Video Lainnya
|
||||
</Button>
|
||||
</Box>
|
||||
</Paper>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
95
src/app/darmasaba/(pages)/keamanan/polsek-terdekat/page.tsx
Normal file
95
src/app/darmasaba/(pages)/keamanan/polsek-terdekat/page.tsx
Normal file
@@ -0,0 +1,95 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Badge, Box, Button, Flex, Paper, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { IconArrowDown, IconClock, IconNavigation, IconPhone, IconPin, IconSearch } from '@tabler/icons-react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box pb={10} px={{ base: 20, md: 100 }}>
|
||||
<Text fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Kantor Polisi Terdekat
|
||||
</Text>
|
||||
<Text pb={15} fz={'h4'} >
|
||||
Desa Darmasaba, Kecamatan Abiansemal, Kabupaten Badung
|
||||
</Text>
|
||||
<TextInput radius={10} leftSection={<IconSearch size={20} />} placeholder='Cari Kantor Polisi' />
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<Paper radius={10} bg={colors["white-trans-1"]} p={'xl'}>
|
||||
<Stack gap={'xs'}>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2,
|
||||
}}
|
||||
>
|
||||
{/* Content Sebelah Kiri */}
|
||||
<Box>
|
||||
<Text c={colors["blue-button"]} fw={'bold'} fz={'h2'}>Polsek Abiansemal</Text>
|
||||
<Text c={colors["blue-button"]} fz={'sm'}>2,5 Km dari Desa Darmasaba</Text>
|
||||
<Flex py={10} gap={9} align={'center'}>
|
||||
<IconPin size={25} color={colors["blue-button"]} />
|
||||
<Text c={colors["blue-button"]} fz={'lg'}>Jl. Gandamayu 1 Blahkiuh</Text>
|
||||
</Flex>
|
||||
<Flex gap={9} align={'center'}>
|
||||
<IconPhone size={25} color={colors["blue-button"]} />
|
||||
<Text c={colors["blue-button"]} fz={'lg'}>08xxxxxxxx</Text>
|
||||
</Flex>
|
||||
<Flex py={10} gap={9} align={'center'}>
|
||||
<IconClock size={25} color={colors["blue-button"]} />
|
||||
<Text c={colors["blue-button"]} fz={'lg'}>24 Jam</Text>
|
||||
</Flex>
|
||||
<Box>
|
||||
<Text c={colors["blue-button"]} fw={'bold'} fz={'h2'}>Layanan Yang Tersedia :</Text>
|
||||
<SimpleGrid
|
||||
py={10}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2,
|
||||
}}
|
||||
>
|
||||
<Box>
|
||||
<Text c={colors["blue-button"]} fz={'lg'}>Laporan Kehilangan</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={colors["blue-button"]} fz={'lg'}>Laporan Kriminal</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={colors["blue-button"]} fz={'lg'}>Pelayanan SKCK</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text c={colors["blue-button"]} fz={'lg'}>Pengaduan Masyarakat</Text>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
<Box>
|
||||
<Button bg={colors["blue-button"]} rightSection={<IconArrowDown size={20}/>}>Lihat Kantor Polisi Lainnya</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box pos={'relative'}>
|
||||
<Box style={{ position: 'absolute', top: 0, right: 0 }}>
|
||||
<Badge size='lg' c={'#287407'} bg={'#A8EDC4'}>Buka</Badge>
|
||||
</Box>
|
||||
<Box pt={40}>
|
||||
<iframe style={{ border: 2, width: "100%" }} src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3945.7949871034166!2d115.20778387533218!3d-8.519275686287415!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2dd23ceb4f6e5363%3A0xa353662f070f47d8!2sAbian%20Semal%20Police%20Station!5e0!3m2!1sid!2sid!4v1742789148825!5m2!1sid!2sid" width="550" height="300" ></iframe>
|
||||
</Box>
|
||||
<Box pt={20}>
|
||||
<Button fullWidth bg={colors["blue-button"]} radius={10} leftSection={<IconNavigation size={20}/>}>Petunjuk Arah</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
120
src/app/darmasaba/(pages)/keamanan/tips-keamanan/page.tsx
Normal file
120
src/app/darmasaba/(pages)/keamanan/tips-keamanan/page.tsx
Normal file
@@ -0,0 +1,120 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, Image, List, ListItem, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data1 = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Keamanan Rumah',
|
||||
image: '/api/img/kemanan.png',
|
||||
deskripsi: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pastikan pintu dan jendela selalu terkunci saat meninggalkan rumah.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pasang lampu penerangan di halaman dan area sekitar rumah untuk mencegah tindak kejahatan.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Jangan mudah memberikan akses masuk ke orang yang tidak dikenal.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Keamanan di Jalan',
|
||||
image: '/api/img/keamananjalan.png',
|
||||
deskripsi: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Hindari berjalan sendirian di tempat sepi, terutama pada malam hari.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Simpan barang berharga di tempat yang aman saat bepergian.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Gunakan jalur yang ramai dan terang saat pulang malam.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Keamanan Kendaraan',
|
||||
image: '/api/img/keamanankendaraan.png',
|
||||
deskripsi: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Gunakan kunci ganda saat memarkir kendaraan, terutama di tempat umum.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Parkir di tempat yang terang dan mudah diawasi.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Jangan meninggalkan barang berharga di dalam kendaraan.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
judul: 'Keamanan Sosial',
|
||||
image: '/api/img/mencurigakan.png',
|
||||
deskripsi: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Laporkan kejadian mencurigakan kepada Pecalang atau perangkat desa.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Jangan mudah percaya terhadap informasi yang belum jelas sumbernya.</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Ikuti program sosialisasi keamanan yang diadakan oleh desa.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
judul: 'Sistem Laporan Kejadian',
|
||||
image: '/api/img/securitydigital.png',
|
||||
deskripsi: <List>
|
||||
<ListItem>Jangan mudah membagikan informasi pribadi di media sosial.</ListItem>
|
||||
<ListItem>Waspada terhadap penipuan online dan telepon yang mengatasnamakan instansi resmi.</ListItem>
|
||||
<ListItem>Gunakan kata sandi yang kuat untuk akun digital dan ganti secara berkala.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
judul: 'Nomor Darurat yang Bisa Dihubungi',
|
||||
image: '/api/img/kontakpecalang.png',
|
||||
deskripsi: <List>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pecalang: 08125651052</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Ambulans: 08125651052</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Pemadam Kebakaran: 113</ListItem>
|
||||
<ListItem ta={'justify'} fz={{ base: 'h4', md: 'lg' }}>Polisi: 110</ListItem>
|
||||
</List>
|
||||
}
|
||||
]
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Tips Keamanan
|
||||
</Text>
|
||||
<Text px={{ base: 20, md: 150 }} ta={"center"} fz={{ base: "h4", md: "h3" }} >
|
||||
Desa Darmasaba berkomitmen untuk menjaga keamanan dan kenyamanan seluruh warganya. Berikut beberapa tips yang dapat membantu meningkatkan keamanan di lingkungan desa.
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<SimpleGrid
|
||||
pb={10}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data1.map((v, k) => {
|
||||
return (
|
||||
<Paper radius={10} key={k} bg={colors["white-trans-1"]}>
|
||||
<Stack gap={'xs'}>
|
||||
<Center p={10}>
|
||||
<Image src={v.image} radius={10}
|
||||
alt='' />
|
||||
</Center>
|
||||
<Box px={'xl'}>
|
||||
<Box pb={20}>
|
||||
<Text pb={10} c={colors["blue-button"]} fw={"bold"} fz={"h3"}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Box pr={10}>
|
||||
{v.deskripsi}
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,298 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Text, Paper, Center, Flex, ColorSwatch, SimpleGrid, Anchor, Divider, Image } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import { BarChart } from '@mantine/charts';
|
||||
|
||||
|
||||
const dataKematian = [
|
||||
{
|
||||
id: 1,
|
||||
tahun: '2023',
|
||||
kematianKasar: '1.7',
|
||||
kematianBayi: '1.4',
|
||||
kelahiranKasar: '0.5'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
tahun: '2024',
|
||||
kematianKasar: '1.4',
|
||||
kematianBayi: '1.8',
|
||||
kelahiranKasar: '1.5'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
tahun: '2025',
|
||||
kematianKasar: '2.0',
|
||||
kematianBayi: '1.5',
|
||||
kelahiranKasar: '1.2'
|
||||
},
|
||||
|
||||
]
|
||||
|
||||
const dataPenyakit = [
|
||||
{ penyakit: 'Covid', penderita: 335 },
|
||||
{ penyakit: 'Tuli', penderita: 105 },
|
||||
{ penyakit: 'Bisul', penderita: 98 },
|
||||
{ penyakit: 'Panas', penderita: 96 },
|
||||
{ penyakit: 'Batuk', penderita: 87 },
|
||||
{ penyakit: 'Sembelit', penderita: 72 },
|
||||
{ penyakit: 'Demam', penderita: 51 },
|
||||
{ penyakit: 'Gred', penderita: 36 },
|
||||
{ penyakit: 'Magh', penderita: 34 },
|
||||
{ penyakit: 'Farangitis Akut', penderita: 17 },
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Data Kesehatan Masyarakat Puskesmas Darmasaba
|
||||
</Text>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
{/* Bar Chart Kematian Kelahiran */}
|
||||
<Box>
|
||||
<Paper p={"xl"} bg={colors['white-trans-1']}>
|
||||
<Box pb={30}>
|
||||
<Flex pb={30} justify={'flex-end'} gap={'xl'} align={'center'}>
|
||||
<Box>
|
||||
<Flex gap={{ base: 0, md: 5 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>Angka Kematian Kasar</Text>
|
||||
<ColorSwatch color="#26308A" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 0, md: 5 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>Angka Kematian Bayi</Text>
|
||||
<ColorSwatch color="#135A9B" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={{ base: 0, md: 5 }} align={'center'}>
|
||||
<Text fw={'bold'} fz={{ base: 'md', md: 'h4' }}>Angka Kelahiran Kasar</Text>
|
||||
<ColorSwatch color="#3290CA" size={30} />
|
||||
</Flex>
|
||||
</Box>
|
||||
</Flex>
|
||||
<Center>
|
||||
<BarChart
|
||||
h={400}
|
||||
data={dataKematian}
|
||||
dataKey="tahun"
|
||||
series={[
|
||||
{ name: 'kematianKasar', color: '#26308A' },
|
||||
{ name: 'kematianBayi', color: '#135A9B' },
|
||||
{ name: 'kelahiranKasar', color: '#3290CA' },
|
||||
]}
|
||||
tickLine="y"
|
||||
/>
|
||||
</Center>
|
||||
</Box>
|
||||
</Paper>
|
||||
</Box>
|
||||
{/* Bar Chart Penyakit */}
|
||||
<Box>
|
||||
<Paper p={"xl"} bg={colors['white-trans-1']}>
|
||||
<Box pb={30}>
|
||||
<Text pb={30} fw={"bold"} fz={{ base: 'h4', md: 'h3' }} ta={"center"}>
|
||||
Grafik Hasil Kepuasan Masyarakat Terhadap Pelayanan Publik
|
||||
</Text>
|
||||
<Center>
|
||||
<BarChart
|
||||
p={20}
|
||||
mb={30}
|
||||
h={500}
|
||||
data={dataPenyakit}
|
||||
dataKey='penyakit'
|
||||
orientation='vertical'
|
||||
yAxisProps={{ width: 80 }}
|
||||
barProps={{ radius: 10 }}
|
||||
series={[{ name: 'penderita', color: colors['blue-button'] }]}
|
||||
/>
|
||||
</Center>
|
||||
<Text ta={"center"} fw={"bold"} fz={"h4"}>Jumlah Penderita</Text>
|
||||
</Box>
|
||||
</Paper>
|
||||
</Box>
|
||||
{/* Artikel Kesehatan */}
|
||||
<Box>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}
|
||||
>
|
||||
{/* Fasilitas Kesehatan */}
|
||||
<Box>
|
||||
<Paper p={'xl'} h={'112vh'} bg={colors['white-trans-1']}>
|
||||
<Stack gap={'xs'}>
|
||||
<Text ta={'center'} fw={"bold"} fz={'h3'} c={colors['blue-button']}>Fasilitas Kesehatan</Text>
|
||||
<Box>
|
||||
<Text fz={'h4'}>
|
||||
UPTD Puskesmas Abiansemal III
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
Jl. Ratna, Sibang Kaja
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
08:00-16:00 WITA
|
||||
(Senin-Sabtu)
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
Layanan Unggulan: Poli Umum, Poli Gigi, Imunisasi, Ibu/KB
|
||||
</Text>
|
||||
<Anchor c={'black'} variant='transparent'>
|
||||
<Text c={'black'} fz={'h4'}>
|
||||
Detail Lengkap {'>>'}
|
||||
</Text>
|
||||
</Anchor>
|
||||
</Box>
|
||||
<Divider color={colors['blue-button']} px={'xl'} />
|
||||
<Box>
|
||||
<Text fz={'h4'}>
|
||||
UPTD Puskesmas Abiansemal III
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
Jl. Ratna, Sibang Kaja
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
08:00-16:00 WITA
|
||||
(Senin-Sabtu)
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
Layanan Unggulan: Poli Umum, Poli Gigi, Imunisasi, Ibu/KB
|
||||
</Text>
|
||||
<Anchor c={'black'} variant='transparent'>
|
||||
<Text c={'black'} fz={'h4'}>
|
||||
Detail Lengkap {'>>'}
|
||||
</Text>
|
||||
</Anchor>
|
||||
</Box>
|
||||
<Divider color={colors['blue-button']} px={'xl'} />
|
||||
<Box>
|
||||
<Text fz={'h4'}>
|
||||
UPTD Puskesmas Abiansemal III
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
Jl. Ratna, Sibang Kaja
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
08:00-16:00 WITA
|
||||
(Senin-Sabtu)
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
Layanan Unggulan: Poli Umum, Poli Gigi, Imunisasi, Ibu/KB
|
||||
</Text>
|
||||
<Anchor c={'black'} variant='transparent'>
|
||||
<Text c={'black'} fz={'h4'}>
|
||||
Detail Lengkap {'>>'}
|
||||
</Text>
|
||||
</Anchor>
|
||||
</Box>
|
||||
<Divider color={colors['blue-button']} px={'xl'}/>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
{/* Jadwal Kegiatan */}
|
||||
<Box>
|
||||
<Paper p={'xl'} h={'112vh'} bg={colors['white-trans-1']}>
|
||||
<Stack gap={'xs'}>
|
||||
<Text ta={'center'} fw={"bold"} fz={'h3'} c={colors['blue-button']}>Jadwal Kegiatan</Text>
|
||||
<Box>
|
||||
<Text fz={'h4'} fw={'bold'} c={colors['blue-button']}>
|
||||
21 Februari 2025
|
||||
</Text>
|
||||
<Text fz={'h4'} fw={'bold'}>
|
||||
Posyandu Balita
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
08:00-12:00 WITA
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
Banjar Gulingan
|
||||
</Text>
|
||||
<Anchor c={colors['blue-button']} variant='transparent'>
|
||||
<Text c={colors['blue-button']} fz={'h4'} >
|
||||
Detail & Pendaftaran
|
||||
</Text>
|
||||
</Anchor>
|
||||
</Box>
|
||||
<Divider color={colors['blue-button']} px={'xl'} />
|
||||
<Box>
|
||||
<Text fz={'h4'} fw={'bold'} c={colors['blue-button']}>
|
||||
23 Februari 2025
|
||||
</Text>
|
||||
<Text fz={'h4'} fw={'bold'}>
|
||||
Donor Darah
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
09:00-14:00 WITA
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
Puskesmas Abiansemal III
|
||||
</Text>
|
||||
<Anchor c={colors['blue-button']} variant='transparent'>
|
||||
<Text c={colors['blue-button']} fz={'h4'} >
|
||||
Detail & Pendaftaran
|
||||
</Text>
|
||||
</Anchor>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
{/* Artikel Kesehatan */}
|
||||
<Box>
|
||||
<Paper p={'xl'} h={'112vh'} bg={colors['white-trans-1']}>
|
||||
<Stack gap={'xs'}>
|
||||
<Box>
|
||||
<Text ta={'center'} fw={"bold"} fz={'h3'} c={colors['blue-button']}>Artikel Kesehatan</Text>
|
||||
<Image pt={5} src={'/api/img/dbd.png'} alt="" />
|
||||
<Text fz={'h4'} fw={'bold'} >
|
||||
Tips Mencegah Demam Berdarah Saat Musim Hujan
|
||||
</Text>
|
||||
<Text fz={'h6'} pb={10}>
|
||||
Diposting: 12 Februari 2025 | Dinas Kesehatan
|
||||
</Text>
|
||||
<Text fz={'h4'} pb={10}>
|
||||
Yuk Kenali gelaja dan cara penanganan DBD yang efektif untuk melindungi keluarga anda selama musim hujan.
|
||||
</Text>
|
||||
<Anchor c={'black'} variant='transparent'>
|
||||
<Text c={'black'} fz={'h4'} >
|
||||
Baca Selengkapnya {'>>'}
|
||||
</Text>
|
||||
</Anchor>
|
||||
</Box>
|
||||
<Divider color={colors['blue-button']} px={'xl'} />
|
||||
<Box>
|
||||
<Text ta={'center'} fw={"bold"} fz={'h3'} c={colors['blue-button']}>Artikel Kesehatan</Text>
|
||||
<Image pt={5} src={'/api/img/dbd.png'} alt="" />
|
||||
<Text fz={'h4'} fw={'bold'} >
|
||||
Tips Mencegah Demam Berdarah Saat Musim Hujan
|
||||
</Text>
|
||||
<Text fz={'h6'} pb={10}>
|
||||
Diposting: 12 Februari 2025 | Dinas Kesehatan
|
||||
</Text>
|
||||
<Text fz={'h4'} pb={10}>
|
||||
Yuk Kenali gelaja dan cara penanganan DBD yang efektif untuk melindungi keluarga anda selama musim hujan.
|
||||
</Text>
|
||||
<Anchor c={'black'} variant='transparent'>
|
||||
<Text c={'black'} fz={'h4'} >
|
||||
Baca Selengkapnya {'>>'}
|
||||
</Text>
|
||||
</Anchor>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
120
src/app/darmasaba/(pages)/kesehatan/info-wabah-penyakit/page.tsx
Normal file
120
src/app/darmasaba/(pages)/kesehatan/info-wabah-penyakit/page.tsx
Normal file
@@ -0,0 +1,120 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Image, List, ListItem, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Info Wabah / Penyakit
|
||||
</Text>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}
|
||||
>
|
||||
<Box>
|
||||
<Paper p={'xl'} h={'80vh'} bg={colors['white-trans-1']}>
|
||||
<Stack gap={'xs'}>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={'h3'} c={colors['blue-button']}>Demam Berdarah Dengue (DBD)</Text>
|
||||
<Image pt={5} src={'/api/img/dbd.png'} alt="" />
|
||||
<Text fz={'h4'} fw={'bold'} >
|
||||
Apa itu DBD penyebab, gejala dan cara penanganannya?
|
||||
</Text>
|
||||
<Text fz={'h6'} pb={10}>
|
||||
Diposting: 12 Februari 2025 | Dinas Kesehatan
|
||||
</Text>
|
||||
<Text fz={'h4'} pb={10}>
|
||||
Yuk Kenali gelaja dan cara penanganan DBD yang efektif untuk melindungi keluarga anda selama musim hujan.
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem>
|
||||
Penyebab: Virus dengue yang ditularkan oleh nyamuk Aedes aegypti.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Gejala: Demam tinggi, nyeri sendi, ruam kulit, dan pendarahan ringan.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Pencegahan: Menguras tempat air, menutup wadah air, fogging, dan menggunakan lotion anti-nyamuk.
|
||||
</ListItem>
|
||||
</List>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper p={'xl'} h={'80vh'} bg={colors['white-trans-1']}>
|
||||
<Stack gap={'xs'}>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={'h3'} c={colors['blue-button']}>TBC (Tuberkulosis)</Text>
|
||||
<Image pt={5} src={'/api/img/tbc-1.png'} alt="" />
|
||||
<Text fz={'h4'} fw={'bold'} >
|
||||
Apa itu TBC penyebab, gejala dan cara penanganannya?
|
||||
</Text>
|
||||
<Text fz={'h6'} pb={10}>
|
||||
Diposting: 12 Februari 2025 | Dinas Kesehatan
|
||||
</Text>
|
||||
<Text fz={'h4'} pb={10}>
|
||||
Yuk Kenali gelaja dan cara penanganan TBC yang efektif untuk melindungi keluarga anda.
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem>
|
||||
Penyebab: Bakteri Mycobacterium tuberculosis yang menyebar melalui udara.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Gejala: Batuk lebih dari 2 minggu, berkeringat di malam hari, dan berat badan turun.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Pencegahan: Vaksin BCG, pola hidup sehat, dan pengobatan bagi penderita agar tidak menular.
|
||||
</ListItem>
|
||||
</List>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper p={'xl'} h={'80vh'} bg={colors['white-trans-1']}>
|
||||
<Stack gap={'xs'}>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={'h3'} c={colors['blue-button']}>Diare dan Kolera</Text>
|
||||
<Image pt={5} src={'/api/img/diare.png'} alt="" />
|
||||
<Text fz={'h4'} fw={'bold'} >
|
||||
Apa itu Diare dan Kolera penyebab, gejala dan cara penanganannya?
|
||||
</Text>
|
||||
<Text fz={'h6'} pb={10}>
|
||||
Diposting: 12 Februari 2025 | Dinas Kesehatan
|
||||
</Text>
|
||||
<Text fz={'h4'} pb={10}>
|
||||
Yuk Kenali gelaja dan cara penanganan Diare dan Kolera yang efektif untuk melindungi keluarga anda.
|
||||
</Text>
|
||||
<List>
|
||||
<ListItem>
|
||||
Penyebab: Bakteri Vibrio cholerae (Kolera) atau Escherichia coli (diare) akibat makanan/minuman yang terkontaminasi.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Gejala: Buang air besar cair terus-menerus, dehidrasi, dan lemas.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Pencegahan: Menjaga kebersihan makanan dan air, serta mencuci tangan dengan sabun.
|
||||
</ListItem>
|
||||
</List>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
106
src/app/darmasaba/(pages)/kesehatan/kontak-darurat/page.tsx
Normal file
106
src/app/darmasaba/(pages)/kesehatan/kontak-darurat/page.tsx
Normal file
@@ -0,0 +1,106 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, List, ListItem, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconHospitalCircle, IconPhone, IconReport, IconReportMedical, IconSpeakerphone } from '@tabler/icons-react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data1 = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Layanan Medis Cepat',
|
||||
icon: <IconHospitalCircle size={80} color={colors["blue-button"]} />,
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Ambulans desa siap siaga 24 jam untuk keadaan darurat medis.</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Pos kesehatan desa menyediakan layanan pertolongan pertama dan perawatan dasar.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Nomor Darurat',
|
||||
icon: <IconPhone size={80} color={colors["blue-button"]}/>,
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Ambulans: 08125651052</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Pos Kesehatan: 08125651052</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Pemadam Kebakaran: 113</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Polisi: 110</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Posko Kesehatan & Evakuasi',
|
||||
icon: <IconReportMedical size={80} color={colors["blue-button"]}/>,
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Ambulans desa siap siaga 24 jam untuk keadaan darurat medis.</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Pos kesehatan desa menyediakan layanan pertolongan pertama dan perawatan dasar.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
judul: 'Pelatihan & Sosialisasi',
|
||||
icon: <IconSpeakerphone size={80} color={colors["blue-button"]}/>,
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Setiap bulan, desa mengadakan pelatihan P3K (Pertolongan Pertama pada Kecelakaan) bagi masyarakat.</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Edukasi tentang tindakan saat bencana seperti gempa bumi dan banjir.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
judul: 'Sistem Laporan Kejadian',
|
||||
icon: <IconReport size={80} color={colors["blue-button"]}/>,
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Warga bisa melaporkan kejadian darurat melalui aplikasi desa atau menghubungi perangkat desa.</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Laporan akan segera ditindaklanjuti oleh tim penanganan darurat.</ListItem>
|
||||
</List>
|
||||
}
|
||||
]
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Kontak Darurat
|
||||
</Text>
|
||||
<Text px={{base: 20, md: 150}} ta={"center"} fz={{ base: "h4", md: "h3" }} >
|
||||
Program kesehatan di Desa Darmasaba memiliki peran penting dalam meningkatkan kesejahteraan masyarakat. Kami berkomitmen untuk memberikan layanan darurat yang cepat, responsif, dan mudah diakses oleh seluruh warga.
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<SimpleGrid
|
||||
pb={10}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data1.map((v, k) => {
|
||||
return (
|
||||
<Paper radius={10} key={k} bg={colors["white-trans-1"]}>
|
||||
<Stack gap={'xs'}>
|
||||
<Center py={40}>
|
||||
{v.icon}
|
||||
</Center>
|
||||
<Box px={'lg'}>
|
||||
<Box pb={20}>
|
||||
<Text pb={10} c={colors["blue-button"]} fw={"bold"} fz={"h3"}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Box px={10}>
|
||||
{v.deskripsi}
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
106
src/app/darmasaba/(pages)/kesehatan/penanganan-darurat/page.tsx
Normal file
106
src/app/darmasaba/(pages)/kesehatan/penanganan-darurat/page.tsx
Normal file
@@ -0,0 +1,106 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Center, List, ListItem, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconHospitalCircle, IconPhone, IconReport, IconReportMedical, IconSpeakerphone } from '@tabler/icons-react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data1 = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Layanan Medis Cepat',
|
||||
icon: <IconHospitalCircle size={80} color={colors["blue-button"]} />,
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Ambulans desa siap siaga 24 jam untuk keadaan darurat medis.</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Pos kesehatan desa menyediakan layanan pertolongan pertama dan perawatan dasar.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Nomor Darurat',
|
||||
icon: <IconPhone size={80} color={colors["blue-button"]}/>,
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Ambulans: 08125651052</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Pos Kesehatan: 08125651052</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Pemadam Kebakaran: 113</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Polisi: 110</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Posko Kesehatan & Evakuasi',
|
||||
icon: <IconReportMedical size={80} color={colors["blue-button"]}/>,
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Ambulans desa siap siaga 24 jam untuk keadaan darurat medis.</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Pos kesehatan desa menyediakan layanan pertolongan pertama dan perawatan dasar.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
judul: 'Pelatihan & Sosialisasi',
|
||||
icon: <IconSpeakerphone size={80} color={colors["blue-button"]}/>,
|
||||
deskripsi: <List>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Setiap bulan, desa mengadakan pelatihan P3K (Pertolongan Pertama pada Kecelakaan) bagi masyarakat.</ListItem>
|
||||
<ListItem fz={{base: 'h4', md: 'lg'}}>Edukasi tentang tindakan saat bencana seperti gempa bumi dan banjir.</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
judul: 'Sistem Laporan Kejadian',
|
||||
icon: <IconReport size={80} color={colors["blue-button"]}/>,
|
||||
deskripsi: <List>
|
||||
<ListItem>Warga bisa melaporkan kejadian darurat melalui aplikasi desa atau menghubungi perangkat desa.</ListItem>
|
||||
<ListItem>Laporan akan segera ditindaklanjuti oleh tim penanganan darurat.</ListItem>
|
||||
</List>
|
||||
}
|
||||
]
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Penanganan Darurat
|
||||
</Text>
|
||||
<Text px={{base: 20, md: 150}} ta={"center"} fz={{ base: "h4", md: "h3" }} >
|
||||
Program kesehatan di Desa Darmasaba memiliki peran penting dalam meningkatkan kesejahteraan masyarakat. Kami berkomitmen untuk memberikan layanan darurat yang cepat, responsif, dan mudah diakses oleh seluruh warga.
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<SimpleGrid
|
||||
pb={10}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data1.map((v, k) => {
|
||||
return (
|
||||
<Paper radius={10} key={k} bg={colors["white-trans-1"]}>
|
||||
<Stack gap={'xs'}>
|
||||
<Center py={40}>
|
||||
{v.icon}
|
||||
</Center>
|
||||
<Box px={'lg'}>
|
||||
<Box pb={20}>
|
||||
<Text pb={10} c={colors["blue-button"]} fw={"bold"} fz={"h3"}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Box px={10}>
|
||||
{v.deskripsi}
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
100
src/app/darmasaba/(pages)/kesehatan/posyandu/page.tsx
Normal file
100
src/app/darmasaba/(pages)/kesehatan/posyandu/page.tsx
Normal file
@@ -0,0 +1,100 @@
|
||||
import colors from "@/con/colors";
|
||||
import { Stack, Box, Text, SimpleGrid, Paper, Center, Image, Flex, List, ListItem } from "@mantine/core";
|
||||
import BackButton from "../../desa/layanan/_com/BackButto";
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Posyandu Banjar Bucu',
|
||||
nomor: '082345678910',
|
||||
image: '/api/img/posyandu.png'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Posyandu Banjar Bucu',
|
||||
nomor: '082345678910',
|
||||
image: '/api/img/posyandu.png'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Posyandu Banjar Bucu',
|
||||
nomor: '082345678910',
|
||||
image: '/api/img/posyandu.png'
|
||||
}
|
||||
]
|
||||
export default function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Posyandu Darmasaba
|
||||
</Text>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<SimpleGrid
|
||||
pb={10}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Paper key={k} p={"xl"} bg={colors["white-trans-1"]}>
|
||||
<Stack gap={'xs'}>
|
||||
<Text c={colors["blue-button"]} fw={"bold"} fz={"h3"}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
{v.nomor}
|
||||
</Text>
|
||||
<Center>
|
||||
<Image src={v.image} alt="" />
|
||||
</Center>
|
||||
<Text fz={'h4'}>
|
||||
Jadwal Pelayanan
|
||||
</Text>
|
||||
<Text fz={'h4'}>
|
||||
Setiap tanggal 5, Pukul 09:00 -
|
||||
12:00 WITA
|
||||
</Text>
|
||||
<Box>
|
||||
<Flex justify={'space-between'}>
|
||||
<Text fz={'h4'}>Balita</Text>
|
||||
<Box>
|
||||
<Text fz={'h4'}>Selasa minggu pertama</Text>
|
||||
<Text fz={'h4'}>(09:00-11:00 WITA)</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex justify={'space-between'}>
|
||||
<Text fz={'h4'}>Lansia</Text>
|
||||
<Box>
|
||||
<Text fz={'h4'}>Selasa minggu pertama</Text>
|
||||
<Text fz={'h4'}>(09:00-11:00 WITA)</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
<Text fz={'h4'} fw={"bold"}>
|
||||
Pelayanan Posyandu
|
||||
</Text>
|
||||
<List type="ordered">
|
||||
<ListItem fz={'h4'}>Penimbangan bayi dan balita</ListItem>
|
||||
<ListItem fz={'h4'}>Pemantuan status gizi</ListItem>
|
||||
<ListItem fz={'h4'}>Imunisasi dasar lengkap</ListItem>
|
||||
<ListItem fz={'h4'}>Konseling</ListItem>
|
||||
<ListItem fz={'h4'}>Pemantuan kesehatan ibu hamil</ListItem>
|
||||
</List>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
|
||||
)
|
||||
}
|
||||
146
src/app/darmasaba/(pages)/kesehatan/program-kesehatan/page.tsx
Normal file
146
src/app/darmasaba/(pages)/kesehatan/program-kesehatan/page.tsx
Normal file
@@ -0,0 +1,146 @@
|
||||
import colors from "@/con/colors";
|
||||
import { Box, Button, Center, Group, Image, Paper, SimpleGrid, Stack, Text } from "@mantine/core";
|
||||
import { IconBarbell, IconCalendar, IconOld, IconUser, IconUsersGroup } from "@tabler/icons-react";
|
||||
import BackButton from "../../desa/layanan/_com/BackButto";
|
||||
|
||||
const data1 = [
|
||||
{
|
||||
id: 1,
|
||||
judul: 'Posyandu Terintegrasi',
|
||||
image: '/api/img/pk-1.png',
|
||||
deskripsi: 'Program pemantauan kesehatan terpadu untuk balita, ibu hamil, dan lansia di Banjar Gulingan dengan sistem pencatatan digital. Layanan meliputi penimbangan, imunisasi, dan konsultasi kesehatan'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
judul: 'Senam Lansia',
|
||||
image: '/api/img/pk-2.png',
|
||||
deskripsi: 'Kegiatan olahraga teratur untuk warga lanjut usia dengan gerakan yang disesuaikan untuk menjaga kebugaran dan kesehatan. Program ini didampingi oleh instruktur profesional dan pemantauan kesehatan rutin.'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
judul: 'Vaksinasi & Sterilasi HPR',
|
||||
image: '/api/img/pk-3.png',
|
||||
deskripsi: 'Program pengendalian hewan penular rabies melalui vaksinasi dan sterilisasi untuk mencegah penyebaran penyakit zoonosis. Dilengkapi dengan sistem pendataan digital untuk memantau cakupan dan efektivitas program.'
|
||||
}
|
||||
]
|
||||
const data2 = [
|
||||
{
|
||||
id: 1,
|
||||
icon: <IconBarbell size={50} color={colors['BG-trans']} />,
|
||||
title: "Menjaga Kesehatan Tubuh",
|
||||
desc: "Program kesehatan desa dirancang untuk memelihara kesehatan fisik masyarakat melalui aktivitas rutin, pemeriksaan kesehatan berkala, dan edukasi gaya hidup sehat.",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
icon: <IconUsersGroup size={50} color={colors['BG-trans']} />,
|
||||
title: "Mempererat Kebersamaan",
|
||||
desc: "Kegiatan kesehatan komunal menjadi wadah interaksi sosial yang memperkuat ikatan antar warga desa, menumbuhkan rasa kepedulian dan gotong royong.",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
icon: <IconOld size={50} color={colors['BG-trans']} />,
|
||||
title: "Medukung Lansia Aktif",
|
||||
desc: "Program khusus bagi lansia membantu menjaga kebugaran, mengurangi risiko penyakit degeneratif, dan menciptakan komunitas pendukung untuk kehidupan yang sehat dan bahagia.",
|
||||
},
|
||||
]
|
||||
export default function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Program Kesehatan Unggulan
|
||||
</Text>
|
||||
<Text px={{base: 20, md: 90}} ta={"center"} fz={{ base: "h4", md: "h3" }} >
|
||||
Desa Darmasaba mengembangkan berbagai program kesehatan terpadu untuk meningkatkan kualitas
|
||||
hidup masyarakat, dengan pendekatan preventif dan promotif bebrbasis teknologi serta prtisipasi aktif
|
||||
warga.
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<SimpleGrid
|
||||
pb={10}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data1.map((v, k) => {
|
||||
return (
|
||||
<Paper radius={10} key={k} bg={colors["white-trans-1"]}>
|
||||
<Stack gap={'xs'}>
|
||||
<Center>
|
||||
<Image src={v.image} alt="" style={{ borderRadius: '14px 14px 0 0' }} />
|
||||
</Center>
|
||||
<Box px={'lg'}>
|
||||
<Box>
|
||||
<Text pb={10} c={colors["blue-button"]} fw={"bold"} fz={"h3"}>
|
||||
{v.judul}
|
||||
</Text>
|
||||
<Text ta={'justify'} fz={'h4'}>{v.deskripsi}</Text>
|
||||
</Box>
|
||||
<Box py={15}>
|
||||
<Button fw={'bold'} fz={'h5'} c={colors["blue-button"]} bg={colors["BG-trans"]}>Detail Program</Button>
|
||||
</Box>
|
||||
<Group py={20}>
|
||||
<Group gap="xs">
|
||||
<IconCalendar size={18} />
|
||||
<Text size="sm">Selasa, 11 Januari 2025</Text>
|
||||
</Group>
|
||||
<Group gap="xs">
|
||||
<IconUser size={18} />
|
||||
<Text size="sm">Admin Desa</Text>
|
||||
</Group>
|
||||
</Group>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
<Box py={10} px={{ base: "md", md: 100 }}>
|
||||
<Box pb={10}>
|
||||
<Text fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Manfaat Program Kesehatan
|
||||
</Text>
|
||||
<Text fz={{ base: "h4", md: "h3" }} >
|
||||
Program kesehatan di Desa Darmasaba memiliki peran penting dalam meningkatkan kesejahteraan masyarakat.
|
||||
</Text>
|
||||
</Box>
|
||||
<SimpleGrid
|
||||
pb={30}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data2.map((v, k) => {
|
||||
return (
|
||||
<Paper key={k} px={"xl"} py={80} bg={colors['white-trans-1']} c={colors['blue-button']}>
|
||||
<Stack justify='space-between' >
|
||||
<Group justify='center'>
|
||||
<Paper p={'xl'} radius={'100'} bg={colors['blue-button']}>
|
||||
<Center >
|
||||
{v.icon}
|
||||
</Center>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text ta={"center"} fw={"bold"} fz={"h3"}>
|
||||
{v.title}
|
||||
</Text>
|
||||
<Text ta={"center"} fz={'h4'}>
|
||||
{v.desc}
|
||||
</Text>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Stack>
|
||||
|
||||
)
|
||||
}
|
||||
127
src/app/darmasaba/(pages)/kesehatan/puskesmas/page.tsx
Normal file
127
src/app/darmasaba/(pages)/kesehatan/puskesmas/page.tsx
Normal file
@@ -0,0 +1,127 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Paper, Text, BackgroundImage, SimpleGrid, Title, Flex } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Puskesmas Darmasaba
|
||||
</Text>
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<Stack gap={'lg'}>
|
||||
<Box>
|
||||
<Paper p={"xl"} bg={colors['white-trans-1']}>
|
||||
<Box pb={30}>
|
||||
<BackgroundImage
|
||||
pb={30}
|
||||
radius={16}
|
||||
h={{ base: 250, md: 500 }}
|
||||
src='/api/img/posyandu.png'
|
||||
style={{ position: 'relative' }}
|
||||
>
|
||||
<Box
|
||||
style={{
|
||||
borderRadius: 16,
|
||||
zIndex: 0
|
||||
}}
|
||||
pos={"absolute"}
|
||||
w={"100%"}
|
||||
h={"100%"}
|
||||
bg={colors.trans.dark[2]}
|
||||
/>
|
||||
<Text style={{
|
||||
position: 'absolute',
|
||||
bottom: 35,
|
||||
left: 15,
|
||||
}} fw={'bold'} fz={{ base: 'md', md: 'h3' }} c={colors['white-1']}>Puskesmas Darmasaba</Text>
|
||||
<Text style={{
|
||||
position: 'absolute',
|
||||
bottom: 10,
|
||||
left: 15,
|
||||
}} fw={'bold'} fz={{ base: 'md', md: 'h4' }} c={colors['white-1']}>Jl. Raya Darmasaba No.45, Badung, Bali</Text>
|
||||
</BackgroundImage>
|
||||
<SimpleGrid
|
||||
py={20}
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2
|
||||
}}>
|
||||
<Box>
|
||||
<Stack>
|
||||
<Title order={3}>Jam Operasional</Title>
|
||||
<Box>
|
||||
<Flex justify={'space-between'} align={'center'}>
|
||||
<Box>
|
||||
<Text>Senin - Kamis</Text>
|
||||
<Text>Jumat</Text>
|
||||
<Text>Sabtu</Text>
|
||||
<Text> Minggu & Libur</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text>08:00 - 15:00 WITA</Text>
|
||||
<Text>08:00 - 15:00 WITA</Text>
|
||||
<Text>08:00 - 15:00 WITA</Text>
|
||||
<Text>Tutp (UGD 24 JAM)</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Box>
|
||||
<Box>
|
||||
<Stack>
|
||||
<Title order={3}>Jam Operasional</Title>
|
||||
<Box>
|
||||
<Flex justify={'space-between'} align={'center'}>
|
||||
<Box>
|
||||
<Text>Senin - Kamis</Text>
|
||||
<Text>Jumat</Text>
|
||||
<Text>Sabtu</Text>
|
||||
<Text> Minggu & Libur</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text>08:00 - 15:00 WITA</Text>
|
||||
<Text>08:00 - 15:00 WITA</Text>
|
||||
<Text>08:00 - 15:00 WITA</Text>
|
||||
<Text>Tutp (UGD 24 JAM)</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Box>
|
||||
<Box>
|
||||
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper p={"xl"} bg={'#B1C5F2'}>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2
|
||||
}}>
|
||||
<Paper p={"xl"} bg={colors['white-trans-1']}>
|
||||
<Text fw={"bold"} fz={'h3'} ta={'center'}>Poliklinik Umum</Text>
|
||||
<Text ta={'center'} fz={{ base: 45, md: 65 }} fw={'bold'} c={colors['blue-button']}>26</Text>
|
||||
</Paper>
|
||||
<Paper p={"xl"} bg={colors['white-trans-1']}>
|
||||
<Text ta={'center'} fz={'h3'} fw={"bold"}>Poli Gigi</Text>
|
||||
<Text ta={'center'} fz={{ base: 45, md: 65 }} fw={'bold'} c={colors['blue-button']}>26</Text>
|
||||
</Paper>
|
||||
</SimpleGrid>
|
||||
</Paper>
|
||||
</Box>
|
||||
</Paper>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,88 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconChristmasTree, IconDroplet, IconHome, IconLeaf, IconTrash } from '@tabler/icons-react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
icon: <IconLeaf size={100} color={colors['blue-button']} />,
|
||||
title: 'Luas Lahan Hijau',
|
||||
jumlah: '± 25 hektar',
|
||||
deskripsi: 'tersebar di area persawahan, kebun, dan taman desa.'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
icon: <IconHome size={100} color={colors['blue-button']} />,
|
||||
title: 'Jumlah Rumah Tangga',
|
||||
jumlah: '± 1.500 rumah tangga',
|
||||
deskripsi: 'yang mayoritas sudah memiliki fasilitas pengelolaan sampah mandiri.'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
icon: <IconDroplet size={100} color={colors['blue-button']} />,
|
||||
title: 'Jumlah Sungai dan Saluran Air',
|
||||
jumlah: '± 3 Sungai Besar',
|
||||
deskripsi: 'dan beberapa saluran irigasi tradisional (subak) yang masih aktif digunakan.'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
icon: <IconChristmasTree size={100} color={colors['blue-button']} />,
|
||||
title: 'Program Penghijauan',
|
||||
jumlah: '± 1000 Pohon',
|
||||
deskripsi: 'Dilaksanakan secara berkala melalui kegiatan menanam pohon di area umum dan perbukitan.'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
icon: <IconTrash size={100} color={colors['blue-button']} />,
|
||||
title: 'Pengelolaan Sampah',
|
||||
jumlah: '± 5 Bank Sampah',
|
||||
deskripsi: 'Didukung oleh Bank Sampah dan sistem pemilahan sampah rumah tangga.'
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Data Lingkungan Desa
|
||||
</Text>
|
||||
<Text px={20} ta={'center'} fz={'h4'}>Desa Darmasaba memiliki lingkungan yang terus dijaga dan dikembangkan demi kesejahteraan warganya. Upaya pelestarian lingkungan difokuskan pada penghijauan, pengelolaan sampah, serta perlindungan kawasan hijau.</Text>
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2,
|
||||
}}>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Box key={k}>
|
||||
<Paper p={20} bg={colors['white-trans-1']}>
|
||||
<Text fw={'bold'} c={colors['blue-button']} fz={{ base: "lg", md: "xl" }} >
|
||||
{v.title}
|
||||
</Text>
|
||||
<Box>
|
||||
{v.icon}
|
||||
<Text c={colors['blue-button']} fz={'h4'} fw={'bold'}>
|
||||
{v.jumlah}
|
||||
</Text>
|
||||
</Box>
|
||||
<Text fz={{ base: "lg", md: "xl" }} >
|
||||
{v.deskripsi}
|
||||
</Text>
|
||||
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
103
src/app/darmasaba/(pages)/lingkungan/edukasi-lingkungan/page.tsx
Normal file
103
src/app/darmasaba/(pages)/lingkungan/edukasi-lingkungan/page.tsx
Normal file
@@ -0,0 +1,103 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, List, ListItem, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
title: 'Tujuan Edukasi Lingkungan',
|
||||
listDeskripsi: <List fz={'h4'} pr={20} ta={'justify'}>
|
||||
<ListItem>
|
||||
Meningkatkan kesadaran masyarakat tentang pentingnya lingkungan bersih dan sehat
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Mendorong partisipasi warga dalam kegiatan pengelolaan sampah, penghijauan, dan konservasi
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Mengurangi dampak negatif terhadap lingkungan dari kegiatan manusia
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Membentuk generasi muda yang peduli terhadap isu-isu lingkungan
|
||||
</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: 'Materi Edukasi yang Diberikan',
|
||||
listDeskripsi: <List fz={'h4'} pr={20} ta={'justify'}>
|
||||
<ListItem>
|
||||
Pengelolaan Sampah (Pilah sampah organik dan anorganik)
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Pencegahan pencemaran lingkungan (air, udara, dan tanah)
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Pemanfaatan lahan hijau dan penghijauan desa
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Daur ulang dan kreatifitas dari sampah
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Bahaya pembakaran sampah sembarangan
|
||||
</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: 'Contoh Kegiatan di Desa Darmasaba',
|
||||
listDeskripsi: <List fz={'h4'} pr={20} ta={'justify'}>
|
||||
<ListItem>
|
||||
Pelatihan membuat kompos dari sampah rumah tangga
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Gerakan "Jumat Bersih" rutin
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Workshop membuat ecobrick
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Lomba kebersihan antar banjar
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Sosialisasi lingkungan di sekolah dan posyandu
|
||||
</ListItem>
|
||||
</List>
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} pb={20}>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Edukasi Lingkungan
|
||||
</Text>
|
||||
<Text px={20} ta={'center'} fz={'h4'}>
|
||||
Edukasi Lingkungan adalah bagian penting dalam membentuk perilaku masyarakat yang peduli dan bertanggung jawab terhadap kelestarian alam. Melalui program ini, masyarakat diajak untuk memahami pentingnya menjaga lingkungan demi kesehatan, kenyamanan, dan keberlanjutan hidup bersama.
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Box key={k}>
|
||||
<Paper h={{base: 0, md: 350}} p={20} bg={colors['white-trans-1']}>
|
||||
<Text fz={'h3'} fw={'bold'} c={colors['blue-button']}>{v.title}</Text>
|
||||
{v.listDeskripsi}
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
89
src/app/darmasaba/(pages)/lingkungan/gotong-royong/page.tsx
Normal file
89
src/app/darmasaba/(pages)/lingkungan/gotong-royong/page.tsx
Normal file
@@ -0,0 +1,89 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Box, Container, Grid, GridCol, Group, Paper, TextInput, Text, Image, Flex, Button } from '@mantine/core';
|
||||
import { IconCalendar, IconMapPin, IconSearch, IconUsersGroup } from '@tabler/icons-react';
|
||||
import React from 'react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
import Link from 'next/link';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos="relative" bg={colors.Bg} py="xl" gap="md">
|
||||
{/* Header */}
|
||||
<Box px={{ base: "md", md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Container size="lg" px="md">
|
||||
<Stack align="center" gap={0} mb="xl">
|
||||
<Text fz={{ base: "2rem", md: "3.4rem" }} c={colors["blue-button"]} fw="bold" ta="center">
|
||||
Program Gotong Royong
|
||||
</Text>
|
||||
<Text fz={{ base: "2rem", md: "3.4rem" }} c={colors["blue-button"]} fw="bold" ta="center">
|
||||
Desa Darmasaba
|
||||
</Text>
|
||||
</Stack>
|
||||
</Container>
|
||||
|
||||
{/* Tabs Menu */}
|
||||
<Box px={{ base: "md", md: "xl" }} py="md" bg={colors['BG-trans']} mb="md">
|
||||
<Grid align="center" justify="space-between" mb={20}>
|
||||
<GridCol span={{ base: 12, md: 8 }}>
|
||||
<Group gap="md" wrap="wrap">
|
||||
<Paper bg={colors['blue-button']} radius="xl" py={5} px={20}>
|
||||
<Text c={colors['white-1']} size="sm">
|
||||
Semua
|
||||
</Text>
|
||||
</Paper>
|
||||
{['Kebersihan', 'Infrastruktur', 'Sosial', 'Lingkungan'].map((kategori) => (
|
||||
<Paper key={kategori} bg={colors['blue-button-trans']} radius="xl" py={5} px={20}>
|
||||
<Text size="sm">
|
||||
{kategori}
|
||||
</Text>
|
||||
</Paper>
|
||||
))}
|
||||
</Group>
|
||||
</GridCol>
|
||||
<GridCol span={{ base: 12, md: 4 }}>
|
||||
<TextInput
|
||||
radius="lg"
|
||||
placeholder="Cari Program Gotong Royong"
|
||||
leftSection={<IconSearch size={18} />}
|
||||
w="100%"
|
||||
/>
|
||||
</GridCol>
|
||||
</Grid>
|
||||
<Paper p={"xl"} bg={colors['white-trans-1']} w={{ base: "100%", md: "100%" }}>
|
||||
<Stack gap={'xs'}>
|
||||
<Image radius={20} src={'/api/img/gotong-royong.png'} w={'100%'} alt='' />
|
||||
<Text fw={"bold"} fz={{ base: "h2", md: "h1" }}>Membangun Fasilitas Desa</Text>
|
||||
<Group>
|
||||
<Paper py={5} px={20} bg={colors['blue-button-trans']} radius={20}>
|
||||
<Text c={colors['white-1']}>Sosial</Text>
|
||||
</Paper>
|
||||
</Group>
|
||||
<Text fz={{ base: "h4", md: "h3" }}>
|
||||
Program Pembangunan Fasilitas Desa Maju, Masyarakat Sejahtera.
|
||||
</Text>
|
||||
<Flex gap={5} align={'center'}>
|
||||
<IconCalendar color={colors['blue-button-trans']} size={45} />
|
||||
<Text fz={{ base: "h4", md: "h3" }}>1 April 2025</Text>
|
||||
</Flex>
|
||||
<Flex gap={5} align={'center'}>
|
||||
<IconMapPin color={colors['blue-button-trans']} size={45} />
|
||||
<Text fz={{ base: "h4", md: "h3" }}>Banjar Desa Darmasaba</Text>
|
||||
</Flex>
|
||||
<Flex gap={5} align={'center'}>
|
||||
<IconUsersGroup color={colors['blue-button-trans']} size={45} />
|
||||
<Text fz={{ base: "h4", md: "h3" }}>30 Partisipan</Text>
|
||||
</Flex>
|
||||
<Text fw={'bold'} fz={'md'}>Deskripsi : Program pembangunan Pura sebagai pusat spiritual dan budaya desa, melibatkan gotong royong masyarakat dalam pembangunan struktur utama serta ornamen tradisional.</Text>
|
||||
<Group py={20} justify='center'>
|
||||
<Button component={Link} href={'https://www.whatsapp.com/?lang=id'} bg={colors['blue-button']} >Daftar Sebagai Relawan</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,97 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, List, ListItem, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
title: 'Filosofi Tri Hita Karana',
|
||||
listDeskripsi: <List fz={'h4'} pr={20} ta={'justify'}>
|
||||
<ListItem>
|
||||
Parahyangan: Hubungan manusia dengan Tuhan
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Pawongan: Hubungan antar manusia
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Palemahan: Hubungan manusia dengan alam
|
||||
</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: 'Bentuk Konservasi Berdasarkan Adat',
|
||||
listDeskripsi: <List fz={'h4'} pr={20} ta={'justify'}>
|
||||
<ListItem>
|
||||
Pelestarian Hutan Adat seperti Alas Pala Sangeh atau Wana Kerthi
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Subak: Sistem pengelolaan irigasi tradisional yang menjunjung kebersamaan dan keberlanjutan
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Hari Raya Tumpek Uduh: Perayaan khusus untuk menghormati pohon dan tumbuhan
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Perarem dan Awig-Awig: Aturan adat desa yang mengatur larangan menebang pohon sembarangan, membuang limbah ke sungai, dll.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Ritual penyucian alam seperti Melasti, Piodalan Segara, dan lainnya
|
||||
</ListItem>
|
||||
</List>
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: 'Nilai Konservasi Adat',
|
||||
listDeskripsi: <List fz={'h4'} pr={20} ta={'justify'}>
|
||||
<ListItem>
|
||||
Menjaga keseimbangan ekosistem
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Melestarikan spiritualitas lokal dan kesucian alam
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Menumbuhkan kesadaran kolektif untuk hidup selaras dengan lingkungan
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
Menjaga keberlangsungan sumber daya alam untuk generasi mendatang
|
||||
</ListItem>
|
||||
</List>
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} pb={20}>
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Konservasi Adat Bali
|
||||
</Text>
|
||||
<Text px={20} ta={'center'} fz={'h4'}>
|
||||
Konservasi Adat Bali adalah upaya pelestarian lingkungan yang berpijak pada kearifan lokal masyarakat Bali, di mana alam dan budaya dianggap sebagai satu kesatuan yang harus dijaga secara harmonis.
|
||||
</Text>
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 3,
|
||||
}}>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Box key={k}>
|
||||
<Paper h={{ base: 0, md: 450 }} p={20} bg={colors['white-trans-1']}>
|
||||
<Text fz={'h3'} fw={'bold'} c={colors['blue-button']}>{v.title}</Text>
|
||||
{v.listDeskripsi}
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,172 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Flex, Paper, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { IconClipboardTextFilled, IconMapPin, IconRecycle, IconScale, IconSearch, IconTrashFilled, IconTruckFilled } from '@tabler/icons-react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
icon: <IconRecycle size={50} color={colors['blue-button']} />,
|
||||
deskripsi: '1. Pilah sampah sesuai jenisnya'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
icon: <IconTruckFilled size={50} color={colors["blue-button"]} />,
|
||||
deskripsi: '2. Bawa sampah ke Bank Sampah'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
icon: <IconScale size={50} color={colors["blue-button"]} />,
|
||||
deskripsi: '3. Timbang sampah di Bank Sampah'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
icon: <IconClipboardTextFilled size={50} color={colors["blue-button"]} />,
|
||||
deskripsi: '4. Catat hasil timbangan di buku tabungan'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
icon: <IconTrashFilled size={50} color={colors["blue-button"]} />,
|
||||
deskripsi: '5. Sampah didaur ulang oleh petugas Bank Sampah'
|
||||
},
|
||||
]
|
||||
|
||||
const bankSampah = [
|
||||
{
|
||||
id: 1,
|
||||
icon: <IconMapPin size={50} color={colors['blue-button']} />,
|
||||
deskripsi: 'Bank Sampah Sarana Gathi',
|
||||
alamat: 'Jl. Ahmad Yani Utara No.453, Peguyangan, Kec. Denpasar Utara, Kota Denpasar, Bali 80115'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
icon: <IconMapPin size={50} color={colors['blue-button']} />,
|
||||
deskripsi: 'Bank Sampah BALI WASTU LESTARI',
|
||||
alamat: 'Jl. Ahmad Yani Utara Gg. Garuda No.1, Peguyangan, Kec. Denpasar Utara, Kota Denpasar, Bali 80115'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
icon: <IconMapPin size={50} color={colors['blue-button']} />,
|
||||
deskripsi: 'Bank Sampah Jempiring Sari',
|
||||
alamat: 'Jl. Gn. Lebah I No.9, Tegal Harum, Kec. Denpasar Bar., Kota Denpasar, Bali 80119'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
icon: <IconMapPin size={50} color={colors['blue-button']} />,
|
||||
deskripsi: 'Bank Sampah Sarana Gathi',
|
||||
alamat: 'Jl. Ahmad Yani Utara No.453, Peguyangan, Kec. Denpasar Utara, Kota Denpasar, Bali 80115'
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Pengelolaan Sampah (Bank Sampah)
|
||||
</Text>
|
||||
<Text px={20} ta={'center'} fz={'h4'}>Bank Sampah di Desa Darmasaba berfungsi sebagai tempat pengelolaan sampah yang bertujuan untuk mengurangi limbah dan memberikan manfaat ekonomi bagi masyarakat.</Text>
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} pb={60}>
|
||||
<Text fw={'bold'} py={10} px={28} fz={{ base: "lg", md: "xl" }} ta={"justify"}>
|
||||
Mekanisme Bank Sampah di Desa Darmasaba:
|
||||
</Text>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 1,
|
||||
}}
|
||||
>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Box key={k} px={28}>
|
||||
<Paper p={20} bg={colors['white-trans-1']}>
|
||||
<Flex gap={20} align={'center'}>
|
||||
<Box>
|
||||
{v.icon}
|
||||
</Box>
|
||||
<Text fw={'bold'} fz={{ base: "lg", md: "xl" }} c={'black'}>{v.deskripsi}</Text>
|
||||
</Flex>
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Keterangan Bank Sampah Terdekat
|
||||
</Text>
|
||||
<TextInput
|
||||
mb={20}
|
||||
radius={'xl'}
|
||||
px={{ base: 70, md: 150 }}
|
||||
leftSection={<IconSearch size={20} />}
|
||||
placeholder='Cari Bank Sampah Terdekat'
|
||||
/>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 2,
|
||||
}}>
|
||||
<Box>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 1,
|
||||
}}
|
||||
>
|
||||
{bankSampah.map((v, k) => {
|
||||
return (
|
||||
<Box key={k} px={20}>
|
||||
<Paper p={20} bg={colors['white-trans-1']} radius={'lg'}>
|
||||
<Flex gap={20} align={'center'}>
|
||||
<Box>
|
||||
{v.icon}
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={'bold'} fz={{ base: "lg", md: "xl" }} c={'black'}>
|
||||
{v.deskripsi}
|
||||
</Text>
|
||||
<Text fz={{ base: "md", md: "lg" }} c={'black'}>
|
||||
{v.alamat}
|
||||
</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
<Box style={{
|
||||
position: 'relative',
|
||||
width: '100%',
|
||||
paddingBottom: '90.5%', // Aspek rasio 16:9 (atau gunakan '100%' untuk aspek rasio 1:1)
|
||||
height: 0,
|
||||
overflow: 'hidden'
|
||||
}}>
|
||||
<iframe
|
||||
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d31558.578355337635!2d115.18413781150647!3d-8.613053599999985!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2dd23ff3a9d0f0ab%3A0xb6bb54a820adbae6!2sBank%20Sampah%20Sarana%20Gathi!5e0!3m2!1sid!2sid!4v1743994947623!5m2!1sid!2sid"
|
||||
style={{
|
||||
position: 'absolute',
|
||||
top: 0,
|
||||
left: 0,
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
border: 0
|
||||
}}
|
||||
loading="lazy"
|
||||
allowFullScreen
|
||||
></iframe>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,74 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Center, Group, Paper, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { IconChristmasTreeFilled, IconHomeEco, IconShieldFilled, IconTrendingUp } from '@tabler/icons-react';
|
||||
import BackButton from '../../desa/layanan/_com/BackButto';
|
||||
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
deskripsi: 'Lingkungan Sehat',
|
||||
icon: <IconHomeEco size={80} color={colors['blue-button']} />,
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
deskripsi: 'Sumber Oksigen',
|
||||
icon: <IconChristmasTreeFilled size={80} color={colors['blue-button']} />,
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
deskripsi: 'Ekonomi Berkelanjutan',
|
||||
icon: <IconTrendingUp size={80} color={colors['blue-button']} />,
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
deskripsi: 'Mencegah Bencana',
|
||||
icon: <IconShieldFilled size={80} color={colors['blue-button']} />,
|
||||
},
|
||||
]
|
||||
function Page() {
|
||||
return (
|
||||
<Stack pos={"relative"} bg={colors.Bg} py={"xl"} gap={"22"}>
|
||||
<Box px={{ base: 'md', md: 100 }}>
|
||||
<BackButton />
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} >
|
||||
<Text ta={"center"} fz={{ base: "h1", md: "2.5rem" }} c={colors["blue-button"]} fw={"bold"}>
|
||||
Program Penghijauan Desa
|
||||
</Text>
|
||||
<Text px={20} ta={'center'} fz={'h4'}>Program Penghijauan Desa bertujuan untuk meningkatkan kesadaran masyarakat akan pentingnya lingkungan hijau melalui penanaman pohon dan perawatan tanaman.</Text>
|
||||
</Box>
|
||||
<Box px={{ base: 'md', md: 100 }} pb={60}>
|
||||
<Text c={colors['blue-button']} fw={'bold'} py={10} px={28} fz={{ base: "lg", md: "xl" }} ta={"justify"}>
|
||||
Manfaat Program Penghijauan
|
||||
</Text>
|
||||
<SimpleGrid
|
||||
cols={{
|
||||
base: 1,
|
||||
md: 4
|
||||
}}>
|
||||
{data.map((v, k) => {
|
||||
return (
|
||||
<Box key={k}>
|
||||
<Paper p={20} bg={colors['white-trans-1']}>
|
||||
<Stack flex={5}>
|
||||
<Center>
|
||||
{v.icon}
|
||||
</Center>
|
||||
<Box>
|
||||
<Text fz={{ base: "lg", md: "xl" }} ta={'center'} c={colors['blue-button']} fw={'bold'}>{v.deskripsi}</Text>
|
||||
</Box>
|
||||
<Group justify='center'>
|
||||
<Button bg={colors['blue-button']}>Detail</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user