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

Tampilan UI Admin Ekonomi & Inovasi Progress

Browse Source
This commit is contained in:
nico
2025-06-04 14:02:39 +08:00
parent a1e7fddbed
commit 06622c49e8
48 changed files with 1910 additions and 675 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/app/admin/(dashboard)/ekonomi/demografi-pekerjaan/create/page.tsx Normal file
View File

@@ -0,0 +1,42 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function CreateDemografiPekerjaan() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Create Demografi Pekerjaan</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pekerjaan</Text>}
placeholder='Masukkan pekerjaan'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jumlah Pekerja Laki - Laki</Text>}
placeholder='Masukkan jumlah pekerja laki - laki'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jumlah Pekerja Perempuan</Text>}
placeholder='Masukkan jumlah pekerja perempuan'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreateDemografiPekerjaan;

62
src/app/admin/(dashboard)/ekonomi/demografi-pekerjaan/detail/page.tsx Normal file
View File

@@ -0,0 +1,62 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Flex, Paper, Stack, Text } from '@mantine/core';
import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailDemografiPekerjaan() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button variant="subtle" onClick={() => router.back()}>
<IconArrowBack color={colors['blue-button']} size={25} />
</Button>
</Box>
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
<Stack>
<Text fz={"xl"} fw={"bold"}>Detail Demografi Pekerjaan</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fw={"bold"}>Pekerjaan</Text>
<Text>Karyawan</Text>
</Box>
<Box>
<Text fw={"bold"}>Jumlah Pekerja Laki - Laki</Text>
<Text>200</Text>
</Box>
<Box>
<Text fw={"bold"}>Jumlah Pekerja Perempuan</Text>
<Text>100</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/ekonomi/demografi-pekerjaan/edit')} color="green">
<IconEdit size={20} />
</Button>
</Flex>
</Box>
</Stack>
</Paper>
</Stack>
</Paper>
{/* Modal Hapus
<ModalKonfirmasiHapus
opened={modalHapus}
onClose={() => setModalHapus(false)}
onConfirm={handleHapus}
text="Apakah anda yakin ingin menghapus potensi ini?"
/> */}
</Box>
);
}
export default DetailDemografiPekerjaan;

42
src/app/admin/(dashboard)/ekonomi/demografi-pekerjaan/edit/page.tsx Normal file
View File

@@ -0,0 +1,42 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function EditDemografiPekerjaan() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Edit Demografi Pekerjaan</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pekerjaan</Text>}
placeholder='Masukkan pekerjaan'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jumlah Pekerja Laki - Laki</Text>}
placeholder='Masukkan jumlah pekerja laki - laki'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jumlah Pekerja Perempuan</Text>}
placeholder='Masukkan jumlah pekerja perempuan'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditDemografiPekerjaan;

87
src/app/admin/(dashboard)/ekonomi/demografi-pekerjaan/page.tsx
View File

@@ -1,47 +1,58 @@
'use client'
import colors from '@/con/colors'; import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core'; import { Box, Button, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
import React from 'react'; import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
import HeaderSearch from '../../_com/header';
import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function Page() { function DemografiPekerjaan() {
return ( return (
<Box> <Box>
<Stack gap={"xs"}> <HeaderSearch
<Box> title='Demografi Pekerjaan'
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={"md"}> placeholder='pencarian'
<Stack gap={"xs"}> searchIcon={<IconSearch size={20} />}
<Title order={3}>Demografi Pekerjaan</Title>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Jumlah Pekerja Laki - Laki</Text>}
placeholder="Masukkan jumlah pekerja laki - laki"
/> />
<TextInput <ListDemografiPekerjaan/>
label={<Text fz={"sm"} fw={"bold"}>Jumlah Pekerja Perempuan</Text>}
placeholder="Masukkan jumlah pekerja perempuan"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Nama Pekerjaan</Text>}
placeholder="Masukkan nama pekerjaan"
/>
<Group>
<Button
bg={colors['blue-button']}
>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
<Paper bg={colors['white-1']} p={"md"}>
<Stack gap={"xs"}>
<Title order={3}>Grafik Demografi Pekerjaan</Title>
</Stack>
</Paper>
</Box>
</Stack>
</Box> </Box>
); );
} }
export default Page; function ListDemografiPekerjaan() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Demografi Pekerjaan'
href='/admin/ekonomi/demografi-pekerjaan/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Pekerjaan</TableTh>
<TableTh>Jumlah Pekerja Laki - Laki</TableTh>
<TableTh>Jumlah Pekerja Perempuan</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Karyawan</TableTd>
<TableTd>200</TableTd>
<TableTd>100</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/ekonomi/demografi-pekerjaan/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default DemografiPekerjaan;

38
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin-2024-2025/create/page.tsx Normal file
View File

@@ -0,0 +1,38 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function CreateJumlahPendudukMiskin() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Create Jumlah Penduduk Miskin</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Tahun</Text>}
placeholder='Masukkan tahun'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jumlah Penduduk Miskin</Text>}
placeholder='Masukkan jumlah penduduk miskin'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreateJumlahPendudukMiskin;

58
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin-2024-2025/detail/page.tsx Normal file
View File

@@ -0,0 +1,58 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Flex, Paper, Stack, Text } from '@mantine/core';
import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailJumlahPendudukMiskin() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button variant="subtle" onClick={() => router.back()}>
<IconArrowBack color={colors['blue-button']} size={25} />
</Button>
</Box>
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
<Stack>
<Text fz={"xl"} fw={"bold"}>Detail Jumlah Penduduk Miskin</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fw={"bold"}>Tahun</Text>
<Text>2024</Text>
</Box>
<Box>
<Text fw={"bold"}>Jumlah Penduduk Miskin</Text>
<Text>100</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/ekonomi/jumlah-penduduk-miskin-2024-2025/edit')} color="green">
<IconEdit size={20} />
</Button>
</Flex>
</Box>
</Stack>
</Paper>
</Stack>
</Paper>
{/* Modal Hapus
<ModalKonfirmasiHapus
opened={modalHapus}
onClose={() => setModalHapus(false)}
onConfirm={handleHapus}
text="Apakah anda yakin ingin menghapus potensi ini?"
/> */}
</Box>
);
}
export default DetailJumlahPendudukMiskin;

38
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin-2024-2025/edit/page.tsx Normal file
View File

@@ -0,0 +1,38 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function EditJumlahPendudukMiskin() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Edit Jumlah Penduduk Miskin</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Tahun</Text>}
placeholder='Masukkan tahun'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jumlah Penduduk Miskin</Text>}
placeholder='Masukkan jumlah penduduk miskin'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditJumlahPendudukMiskin;

81
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-miskin-2024-2025/page.tsx
View File

@@ -1,43 +1,56 @@
import { Box, Button, Group, Paper, Stack, TextInput, Title } from '@mantine/core'; 'use client'
import colors from '@/con/colors'; import colors from '@/con/colors';
import React from 'react'; import { Box, Button, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
import HeaderSearch from '../../_com/header';
import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function Page() { function JumlahPendudukMiskin() {
return ( return (
<Box> <Box>
<Stack gap={"xs"}> <HeaderSearch
<Box> title='Jumlah Penduduk Miskin'
<Paper p={"md"} bg={colors['white-1']} w={{ base: '100%', md: '50%' }}> placeholder='pencarian'
<Stack gap={"xs"}> searchIcon={<IconSearch size={20} />}
<Title order={3}>Jumlah Penduduk Miskin 2024-2025</Title>
<TextInput
label="Tahun"
placeholder="masukkan tahun"
/> />
<TextInput <ListJumlahPendudukMiskin/>
label="Jumlah Penduduk Miskin"
placeholder="masukkan jumlah penduduk miskin"
/>
<Group>
<Button
bg={colors['blue-button']}
>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
<Paper p={"md"} bg={colors['white-1']} >
<Stack gap={"xs"}>
<Title order={3}>Grafik Jumlah Penduduk Miskin 2024-2025</Title>
</Stack>
</Paper>
</Box>
</Stack>
</Box> </Box>
); );
} }
export default Page; function ListJumlahPendudukMiskin() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Jumlah Penduduk Miskin'
href='/admin/ekonomi/jumlah-penduduk-miskin-2024-2025/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Tahun</TableTh>
<TableTh>Jumlah Penduduk Miskin</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>2024</TableTd>
<TableTd>100</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/ekonomi/jumlah-penduduk-miskin-2024-2025/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default JumlahPendudukMiskin;

18
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/page.tsx
View File

@@ -1,27 +1,27 @@
import colors from "@/con/colors"; import colors from "@/con/colors";
import { Box, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from "@mantine/core"; import { Box, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from "@mantine/core";
import PengangguranBerdasarkanUsia from "./ui/pengangguranBerdasarkanUsia/page"; import PengangguranBerdasarkanUsia from "./pengangguran_berdasarkan_usia/page";
import PengangguranBerdasarkanPendidikan from "./ui/pengangguranBerdasarkanPendidikan/page"; import PengangguranBerdasarkanPendidikan from "./pengangguran_berdasarkan_pendidikan/page";
export default function Page() { export default function Page() {
return ( return (
<Box> <Box>
<Stack gap={"xs"}> <Stack gap={"xs"}>
<Title order={3}>Jumlah Penduduk Usia Kerja yang Menganggur</Title> <Title order={3}>Jumlah Penduduk Usia Kerja yang Menganggur</Title>
<Tabs color={colors['blue-button']} variant='pills' defaultValue={"Pengangguran Bredasarkan Usia"}> <Tabs color={colors['blue-button']} variant='pills' defaultValue={"Pengangguran Berdasarkan Usia"}>
<TabsList p={"xs"} bg={"#BBC8E7FF"}> <TabsList p={"xs"} bg={"#BBC8E7FF"}>
<TabsTab value={"Pengangguran Bredasarkan Usia"}> <TabsTab value={"Pengangguran Berdasarkan Usia"}>
Pengangguran Bredasarkan Usia Pengangguran Berdasarkan Usia
</TabsTab> </TabsTab>
<TabsTab value={"Pengangguran Bredasarkan Pendidikan"}> <TabsTab value={"Pengangguran Berdasarkan Pendidikan"}>
Pengangguran Bredasarkan Pendidikan Pengangguran Berdasarkan Pendidikan
</TabsTab> </TabsTab>
</TabsList> </TabsList>
<TabsPanel value={"Pengangguran Bredasarkan Usia"}> <TabsPanel value={"Pengangguran Berdasarkan Usia"}>
<PengangguranBerdasarkanUsia /> <PengangguranBerdasarkanUsia />
</TabsPanel> </TabsPanel>
<TabsPanel value={"Pengangguran Bredasarkan Pendidikan"}> <TabsPanel value={"Pengangguran Berdasarkan Pendidikan"}>
<PengangguranBerdasarkanPendidikan/> <PengangguranBerdasarkanPendidikan/>
</TabsPanel> </TabsPanel>
</Tabs> </Tabs>

54
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_pendidikan/create/page.tsx Normal file
View File

@@ -0,0 +1,54 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function CreatePengangguranBerdasarkanPendidikan() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Create Pengangguran Berdasarkan Pendidikan</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan SD</Text>}
placeholder='Masukkan pendidikan sd'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan SMP</Text>}
placeholder='Masukkan pendidikan smp'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan SMA</Text>}
placeholder='Masukkan pendidikan sma'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan S1</Text>}
placeholder='Masukkan pendidikan s1'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan S2</Text>}
placeholder='Masukkan pendidikan s2'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan S3</Text>}
placeholder='Masukkan pendidikan s3'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreatePengangguranBerdasarkanPendidikan;

74
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_pendidikan/detail/page.tsx Normal file
View File

@@ -0,0 +1,74 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Flex, Paper, Stack, Text } from '@mantine/core';
import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailPengangguranBerdasarkanPendidikan() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button variant="subtle" onClick={() => router.back()}>
<IconArrowBack color={colors['blue-button']} size={25} />
</Button>
</Box>
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
<Stack>
<Text fz={"xl"} fw={"bold"}>Detail Pengangguran Berdasarkan Pendidikan</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fw={"bold"}>Pendidikan SD</Text>
<Text>50</Text>
</Box>
<Box>
<Text fw={"bold"}>Pendidikan SMP</Text>
<Text>60</Text>
</Box>
<Box>
<Text fw={"bold"}>Pendidikan SMA</Text>
<Text>80</Text>
</Box>
<Box>
<Text fw={"bold"}>Pendidikan S1</Text>
<Text>40</Text>
</Box>
<Box>
<Text fw={"bold"}>Pendidikan S2</Text>
<Text>20</Text>
</Box>
<Box>
<Text fw={"bold"}>Pendidikan S3</Text>
<Text>10</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_pendidikan/edit')} color="green">
<IconEdit size={20} />
</Button>
</Flex>
</Box>
</Stack>
</Paper>
</Stack>
</Paper>
{/* Modal Hapus
<ModalKonfirmasiHapus
opened={modalHapus}
onClose={() => setModalHapus(false)}
onConfirm={handleHapus}
text="Apakah anda yakin ingin menghapus potensi ini?"
/> */}
</Box>
);
}
export default DetailPengangguranBerdasarkanPendidikan;

54
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_pendidikan/edit/page.tsx Normal file
View File

@@ -0,0 +1,54 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function EditPengangguranBerdasarkanPendidikan() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Edit Pengangguran Berdasarkan Pendidikan</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan SD</Text>}
placeholder='Masukkan pendidikan sd'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan SMP</Text>}
placeholder='Masukkan pendidikan smp'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan SMA</Text>}
placeholder='Masukkan pendidikan sma'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan S1</Text>}
placeholder='Masukkan pendidikan s1'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan S2</Text>}
placeholder='Masukkan pendidikan s2'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pendidikan S3</Text>}
placeholder='Masukkan pendidikan s3'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditPengangguranBerdasarkanPendidikan;

49
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_pendidikan/page.tsx Normal file
View File

@@ -0,0 +1,49 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Paper, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Title } from '@mantine/core';
import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import JudulListTab from '../../../_com/jusulListTab';
function PengangguranBerdasarkanPendidikan() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<JudulListTab
title='Pengangguran Berdasarkan Pendidikan'
href='/admin/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_pendidikan/create'
placeholder='pencarian'
searchIcon={<IconSearch size={20} />}
/>
<Title order={4}>List Pengangguran Berdasarkan Pendidikan</Title>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Pendidikan SD</TableTh>
<TableTh>Pendidikan SMP</TableTh>
<TableTh>Pendidikan SMA</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>80</TableTd>
<TableTd>40</TableTd>
<TableTd>20</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_pendidikan/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Stack>
</Paper>
</Box>
);
}
export default PengangguranBerdasarkanPendidikan;

45
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_usia/create/page.tsx Normal file
View File

@@ -0,0 +1,45 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function CreatePengangguranBerdasarkanUsia() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Create Pengangguran Berdasarkan Usia</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Usia 18 - 25</Text>}
placeholder='Masukkan usia'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Usia 26 - 35</Text>}
placeholder='Masukkan usia'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Usia 36 - 45</Text>}
placeholder='Masukkan usia'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Usia 46 +</Text>}
placeholder='Masukkan usia'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreatePengangguranBerdasarkanUsia;

70
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_usia/detail/page.tsx Normal file
View File

@@ -0,0 +1,70 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Flex, Paper, Stack, Text } from '@mantine/core';
import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailPengangguranBerdasarkanUsia() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button variant="subtle" onClick={() => router.back()}>
<IconArrowBack color={colors['blue-button']} size={25} />
</Button>
</Box>
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
<Stack>
<Text fz={"xl"} fw={"bold"}>Detail Pengangguran Berdasarkan Usia</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fw={"bold"}>Usia 18 - 25</Text>
<Text>80</Text>
</Box>
<Box>
<Text fw={"bold"}>Usia 26 - 35</Text>
<Text>40</Text>
</Box>
<Box>
<Text fw={"bold"}>Usia 36 - 45</Text>
<Text>20</Text>
</Box>
<Box>
<Text fw={"bold"}>Usia 46 +</Text>
<Text>10</Text>
</Box>
<Box>
<Text fw={"bold"}>Total</Text>
<Text>150</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_usia/edit')} color="green">
<IconEdit size={20} />
</Button>
</Flex>
</Box>
</Stack>
</Paper>
</Stack>
</Paper>
{/* Modal Hapus
<ModalKonfirmasiHapus
opened={modalHapus}
onClose={() => setModalHapus(false)}
onConfirm={handleHapus}
text="Apakah anda yakin ingin menghapus potensi ini?"
/> */}
</Box>
);
}
export default DetailPengangguranBerdasarkanUsia;

47
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_usia/edit/page.tsx Normal file
View File

@@ -0,0 +1,47 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function EditPengangguranBerdasarkanUsia() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Edit Pengangguran Berdasarkan Usia</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Usia 18 - 25</Text>}
placeholder='Masukkan usia'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Usia 26 - 35</Text>}
placeholder='Masukkan usia'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Usia 36 - 45</Text>}
placeholder='Masukkan usia'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Usia 46 +</Text>}
placeholder='Masukkan usia'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditPengangguranBerdasarkanUsia;

49
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_usia/page.tsx Normal file
View File

@@ -0,0 +1,49 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Paper, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Title } from '@mantine/core';
import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import JudulListTab from '../../../_com/jusulListTab';
function PengangguranBerdasarkanUsia() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<JudulListTab
title='Pengangguran Berdasarkan Usia'
href='/admin/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_usia/create'
placeholder='pencarian'
searchIcon={<IconSearch size={20} />}
/>
<Title order={4}>List Pengangguran Berdasarkan Usia</Title>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Usia 18 - 25</TableTh>
<TableTh>Usia 26 - 35</TableTh>
<TableTh>Usia 36 - 45</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>80</TableTd>
<TableTd>40</TableTd>
<TableTd>20</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/pengangguran_berdasarkan_usia/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Stack>
</Paper>
</Box>
);
}
export default PengangguranBerdasarkanUsia;

47
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/ui/pengangguranBerdasarkanPendidikan/page.tsx
View File

@@ -1,47 +0,0 @@
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import React from 'react';
function PengangguranBerdasarkanPendidikan() {
return (
<Box>
<Box py={15}>
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'} radius={10}>
<Stack gap={"xs"}>
<Title order={3}>Pengangguran Berdasarkan Pendidikan</Title>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Pendidikan SD</Text>}
placeholder="masukkan jumlah penduduk Pendidikan SD yang menganggur"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Pendidikan SMP</Text>}
placeholder="masukkan jumlah penduduk Pendidikan SMP yang menganggur"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Pendidikan SMA / SMK</Text>}
placeholder="masukkan jumlah penduduk Pendidikan SMA / SMK yang menganggur"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Pendidikan D1-D3 / S1</Text>}
placeholder="masukkan jumlah penduduk Pendidikan D1-D3 yang menganggur"
/>
<Group>
<Button mt={10} bg={colors['blue-button']}>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
<Paper bg={colors['white-1']} w={{ base: '100%', md: '50%' }} p={'md'}>
<Stack>
<Title pb={10} order={3}>Grafik Pengangguran Berdasarkan Pendidikan</Title>
</Stack>
</Paper>
</Box>
</Box>
);
}
export default PengangguranBerdasarkanPendidikan;

47
src/app/admin/(dashboard)/ekonomi/jumlah-penduduk-usia-kerja-yang-menganggur/ui/pengangguranBerdasarkanUsia/page.tsx
View File

@@ -1,47 +0,0 @@
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import React from 'react';
function PengangguranBerdasarkanUsia() {
return (
<Box>
<Box py={15}>
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'} radius={10}>
<Stack gap={"xs"}>
<Title order={3}>Pengangguran Berdasarkan Usia</Title>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Usia 18 - 25 tahun</Text>}
placeholder="masukkan jumlah penduduk usia 18 - 25 tahun yang menganggur"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Usia 26 - 35 tahun</Text>}
placeholder="masukkan jumlah penduduk usia 26 - 35 tahun yang menganggur"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Usia 36 - 45 tahun</Text>}
placeholder="masukkan jumlah penduduk usia 36 - 45 tahun yang menganggur"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Usia 46+</Text>}
placeholder="masukkan jumlah penduduk usia 46+ yang menganggur"
/>
<Group>
<Button mt={10} bg={colors['blue-button']}>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
<Paper bg={colors['white-1']} w={{ base: '100%', md: '50%' }} p={'md'}>
<Stack>
<Title pb={10} order={3}>Grafik Pengangguran Berdasarkan Usia</Title>
</Stack>
</Paper>
</Box>
</Box>
);
}
export default PengangguranBerdasarkanUsia;

45
src/app/admin/(dashboard)/ekonomi/jumlah-pengangguran-2024-2025/create/page.tsx Normal file
View File

@@ -0,0 +1,45 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function CreateJumlahPengangguran() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Create Jumlah Pengangguran</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pengangguran Terdidik</Text>}
placeholder='Masukkan pengangguran terdidik'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Usia Produktif</Text>}
placeholder='Masukkan usia produktif'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Sedang Mencari Kerja</Text>}
placeholder='Masukkan sedang mencari kerja'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pengangguran Tidak Terdidik</Text>}
placeholder='Masukkan pengangguran tidak terdidik'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreateJumlahPengangguran;

66
src/app/admin/(dashboard)/ekonomi/jumlah-pengangguran-2024-2025/detail/page.tsx Normal file
View File

@@ -0,0 +1,66 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Flex, Paper, Stack, Text } from '@mantine/core';
import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailJumlahPengangguran() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button variant="subtle" onClick={() => router.back()}>
<IconArrowBack color={colors['blue-button']} size={25} />
</Button>
</Box>
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
<Stack>
<Text fz={"xl"} fw={"bold"}>Detail Jumlah Pengangguran</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fw={"bold"}>Pengangguran Terdidik</Text>
<Text>100</Text>
</Box>
<Box>
<Text fw={"bold"}>Usia Produktif</Text>
<Text>200</Text>
</Box>
<Box>
<Text fw={"bold"}>Sedang Mencari Kerja</Text>
<Text>300</Text>
</Box>
<Box>
<Text fw={"bold"}>Pengangguran Tidak Terdidik</Text>
<Text>30</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/ekonomi/jumlah-pengangguran-2024-2025/edit')} color="green">
<IconEdit size={20} />
</Button>
</Flex>
</Box>
</Stack>
</Paper>
</Stack>
</Paper>
{/* Modal Hapus
<ModalKonfirmasiHapus
opened={modalHapus}
onClose={() => setModalHapus(false)}
onConfirm={handleHapus}
text="Apakah anda yakin ingin menghapus potensi ini?"
/> */}
</Box>
);
}
export default DetailJumlahPengangguran;

45
src/app/admin/(dashboard)/ekonomi/jumlah-pengangguran-2024-2025/edit/page.tsx Normal file
View File

@@ -0,0 +1,45 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function EditJumlahPengangguran() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Edit Jumlah Pengangguran</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pengangguran Terdidik</Text>}
placeholder='Masukkan pengangguran terdidik'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Usia Produktif</Text>}
placeholder='Masukkan usia produktif'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Sedang Mencari Kerja</Text>}
placeholder='Masukkan sedang mencari kerja'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pengangguran Tidak Terdidik</Text>}
placeholder='Masukkan pengangguran tidak terdidik'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditJumlahPengangguran;

85
src/app/admin/(dashboard)/ekonomi/jumlah-pengangguran-2024-2025/page.tsx
View File

@@ -1,37 +1,58 @@
'use client'
import colors from '@/con/colors'; import colors from '@/con/colors';
import { Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core'; import { Box, Button, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
import DataPengangguran from './ui/dataPengangguran/page'; import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
import GrafikDataPengangguran from './ui/grafikDataPengangguran/page'; import HeaderSearch from '../../_com/header';
import DetailDataPengangguran from './ui/detailDataPengangguran/page'; import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function Page() { function JumlahPengangguran() {
return ( return (
<Stack> <Box>
<Title order={3}>Jumlah Pengangguran 2024-2025</Title> <HeaderSearch
<Tabs color={colors['blue-button']} variant='pills' defaultValue={"Data Pengangguran Desa"}> title='Jumlah Pengangguran 2024-2025'
<TabsList p={"xs"} bg={"#BBC8E7FF"}> placeholder='pencarian'
<TabsTab value="Data Pengangguran Desa"> searchIcon={<IconSearch size={20} />}
Data Pengangguran Desa />
</TabsTab> <ListJumlahPengangguran/>
<TabsTab value="Grafik Data Pengangguran Desa"> </Box>
Grafik Data Pengangguran Desa );
</TabsTab>
<TabsTab value="Detail Data Pengangguran Desa">
Detail Data Pengangguran Desa
</TabsTab>
</TabsList>
<TabsPanel value="Data Pengangguran Desa">
<DataPengangguran/>
</TabsPanel>
<TabsPanel value="Grafik Data Pengangguran Desa">
<GrafikDataPengangguran/>
</TabsPanel>
<TabsPanel value="Detail Data Pengangguran Desa">
<DetailDataPengangguran/>
</TabsPanel>
</Tabs>
</Stack>
)
} }
export default Page; function ListJumlahPengangguran() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Jumlah Pengangguran 2024-2025'
href='/admin/ekonomi/jumlah-pengangguran-2024-2025/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Pengangguran Terdidik</TableTh>
<TableTh>Usia Produktif</TableTh>
<TableTh>Sedang Mencari Kerja</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>100</TableTd>
<TableTd>200</TableTd>
<TableTd>300</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/ekonomi/jumlah-pengangguran-2024-2025/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default JumlahPengangguran;

51
src/app/admin/(dashboard)/ekonomi/jumlah-pengangguran-2024-2025/ui/dataPengangguran/page.tsx
View File

@@ -1,51 +0,0 @@
import colors from '@/con/colors';
import { Box, Button, Group, Paper, SimpleGrid, Stack, Text, TextInput, Title } from '@mantine/core';
function DataPengangguran() {
return (
<Box>
<Box py={15}>
<SimpleGrid cols={{ base: 1, md: 2 }}>
<Box>
<Paper bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={3}>Data Pengangguran</Title>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Total Pengangguran</Text>}
placeholder="masukkan total pengangguran"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Pengangguran Terdidik</Text>}
placeholder="masukkan pengangguran terdidik"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Usia Produktif</Text>}
placeholder="masukkan usia produktif"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Sedang Mencari Kerja</Text>}
placeholder="masukkan jumlah sedang mencari kerja"
/>
<Group>
<Button bg={colors['blue-button']}>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
<Paper bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={3}>List Data Pengangguran</Title>
</Stack>
</Paper>
</Box>
</SimpleGrid>
</Box>
</Box>
);
}
export default DataPengangguran;

18
src/app/admin/(dashboard)/ekonomi/jumlah-pengangguran-2024-2025/ui/detailDataPengangguran/page.tsx
View File

@@ -1,18 +0,0 @@
import colors from '@/con/colors';
import { Box, Paper, Stack, Title } from '@mantine/core';
function DetailDataPengangguran() {
return (
<Box>
<Box py={15}>
<Paper bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={3}>Detail Data Pengangguran</Title>
</Stack>
</Paper>
</Box>
</Box>
);
}
export default DetailDataPengangguran;

49
src/app/admin/(dashboard)/ekonomi/jumlah-pengangguran-2024-2025/ui/grafikDataPengangguran/page.tsx
View File

@@ -1,49 +0,0 @@
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
function GrafikDataPengangguran() {
return (
<Box>
<Box py={15}>
<Box>
<Paper bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={3}>Data Pengangguran</Title>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Total Pengangguran</Text>}
placeholder="masukkan total pengangguran"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Pengangguran Terdidik</Text>}
placeholder="masukkan pengangguran terdidik"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Usia Produktif</Text>}
placeholder="masukkan usia produktif"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Sedang Mencari Kerja</Text>}
placeholder="masukkan jumlah sedang mencari kerja"
/>
<Group>
<Button bg={colors['blue-button']}>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={3}>List Data Pengangguran</Title>
</Stack>
</Paper>
</Box>
</Box>
</Box>
);
}
export default GrafikDataPengangguran;

29
src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/create/createLowongan.tsx
View File

@@ -1,29 +0,0 @@
import { Box, Stack, Text, TextInput, Title } from '@mantine/core';
function CreateLowongan() {
return (
<Box>
<Stack gap={"xs"}>
<Title order={4}>Lowongan Kerja Lokal</Title>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Bekerja Sebagai</Text>}
placeholder="masukkan bekerja sebagai"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Alamat Usaha</Text>}
placeholder="masukkan alamat usaha"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Waktu Kerja</Text>}
placeholder="masukkan waktu kerja"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Gaji selama 1 bulan</Text>}
placeholder="masukkan gaji selama 1 bulan"
/>
</Stack>
</Box>
);
}
export default CreateLowongan;

57
src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/create/page.tsx Normal file
View File

@@ -0,0 +1,57 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../../keamanan/_com/keamananEditor';
function CreateLowonganKerja() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Create Lowongan Kerja Lokal</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pekerjaan</Text>}
placeholder='Masukkan pekerjaan'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Usaha</Text>}
placeholder='Masukkan nama usaha'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Alamat Usaha</Text>}
placeholder='Masukkan alamat usaha'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nomor Telepon</Text>}
placeholder='Masukkan nomor telepon'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Gaji selama 1 bulan</Text>}
placeholder='Masukkan gaji'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Lowongan Kerja</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreateLowonganKerja;

78
src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/detail/page.tsx Normal file
View File

@@ -0,0 +1,78 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Flex, Paper, Stack, Text } from '@mantine/core';
import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailLowonganKerjaLokal() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button variant="subtle" onClick={() => router.back()}>
<IconArrowBack color={colors['blue-button']} size={25} />
</Button>
</Box>
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
<Stack>
<Text fz={"xl"} fw={"bold"}>Detail Lowongan Kerja Lokal</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fw={"bold"}>Bekerja Sebagai</Text>
<Text>Karyawan</Text>
</Box>
<Box>
<Text fw={"bold"}>Nama Usaha</Text>
<Text>BIBD</Text>
</Box>
<Box>
<Text fw={"bold"}>Alamat Usaha</Text>
<Text>Jalan In Aja</Text>
</Box>
<Box>
<Text fw={"bold"}>Nomor Telepon</Text>
<Text>0896232831883</Text>
</Box>
<Box>
<Text fw={"bold"}>Waktu Kerja</Text>
<Text>Full Time</Text>
</Box>
<Box>
<Text fw={"bold"}>Gaji selama 1 bulan</Text>
<Text>Rp. 3.000.000</Text>
</Box>
<Box>
<Text fw={"bold"}>Deskripsi Lowongan Kerja</Text>
<Text> Pekerjaan dengan gaji Rp. 3.000.000</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/ekonomi/lowongan-kerja-lokal/edit')} color="green">
<IconEdit size={20} />
</Button>
</Flex>
</Box>
</Stack>
</Paper>
</Stack>
</Paper>
{/* Modal Hapus
<ModalKonfirmasiHapus
opened={modalHapus}
onClose={() => setModalHapus(false)}
onConfirm={handleHapus}
text="Apakah anda yakin ingin menghapus potensi ini?"
/> */}
</Box>
);
}
export default DetailLowonganKerjaLokal;

57
src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/edit/page.tsx Normal file
View File

@@ -0,0 +1,57 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../../keamanan/_com/keamananEditor';
function EditLowonganKerja() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Edit Lowongan Kerja Lokal</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Pekerjaan</Text>}
placeholder='Masukkan pekerjaan'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Usaha</Text>}
placeholder='Masukkan nama usaha'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Alamat Usaha</Text>}
placeholder='Masukkan alamat usaha'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nomor Telepon</Text>}
placeholder='Masukkan nomor telepon'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Gaji selama 1 bulan</Text>}
placeholder='Masukkan gaji'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Lowongan Kerja</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditLowonganKerja;

25
src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/listData/page.tsx
View File

@@ -1,25 +0,0 @@
import colors from '@/con/colors';
import { Box, Paper, Stack, Title, Text } from '@mantine/core';
import React from 'react';
function ListDataLowongan() {
return (
<Paper bg={colors['white-1']} p={'md'} radius={10}>
<Stack gap={"xs"}>
<Title order={3}>List Data Lowongan Kerja Lokal</Title>
<Box>
<Text fw={"bold"}>Bekerja Sebagai</Text>
<Text> </Text>
<Text fw={"bold"}>Alamat Usaha</Text>
<Text> </Text>
<Text fw={"bold"}>Waktu Kerja</Text>
<Text> </Text>
<Text fw={"bold"}>Gaji selama 1 bulan</Text>
<Text> </Text>
</Box>
</Stack>
</Paper>
);
}
export default ListDataLowongan;

74
src/app/admin/(dashboard)/ekonomi/lowongan-kerja-lokal/page.tsx
View File

@@ -1,32 +1,58 @@
'use client'
import colors from '@/con/colors'; import colors from '@/con/colors';
import { Box, Button, Group, Paper, SimpleGrid, Stack, Title } from '@mantine/core'; import { Box, Button, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
import React from 'react'; import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
import CreateLowongan from './create/createLowongan'; import HeaderSearch from '../../_com/header';
import ListDataLowongan from './listData/page'; import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function Page() { function LowonganKerjaLokal() {
return ( return (
<Stack gap={"xs"}>
<SimpleGrid cols={{ base: 1, md: 2 }}>
<Box> <Box>
<Paper bg={colors['white-1']} p={'md'} radius={10}> <HeaderSearch
<Title order={3}>Lowongan Kerja Lokal</Title> title='Lowongan Kerja Lokal'
<CreateLowongan/> placeholder='pencarian'
<Group> searchIcon={<IconSearch size={20} />}
<Button mt={10} bg={colors['blue-button']}> />
Submit <ListLowonganKerjaLokal/>
</Button>
</Group>
</Paper>
</Box> </Box>
<Box>
<Paper bg={colors['white-1']} p={'md'} radius={10}>
<ListDataLowongan/>
</Paper>
</Box>
</SimpleGrid>
</Stack>
); );
} }
export default Page; function ListLowonganKerjaLokal() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Lowongan Kerja Lokal'
href='/admin/ekonomi/lowongan-kerja-lokal/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Bekerja Sebagai</TableTh>
<TableTh>Nama Usaha</TableTh>
<TableTh>Alamat Usaha</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Karyawan</TableTd>
<TableTd>BIBD</TableTd>
<TableTd>Jalan In Aja</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/ekonomi/lowongan-kerja-lokal/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default LowonganKerjaLokal;

46
src/app/admin/(dashboard)/ekonomi/program-kemiskinan/create/page.tsx Normal file
View File

@@ -0,0 +1,46 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function CreateProgramKemiskinan() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Create Program Kemiskinan</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Judul Program</Text>}
placeholder='Masukkan judul program'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Deskripsi Singkat</Text>}
placeholder='Masukkan deskripsi'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jumlah Masyarakat Miskin</Text>}
placeholder='Masukkan jumlah masyarakat miskin'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>}
placeholder='Masukkan deskripsi'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreateProgramKemiskinan;

66
src/app/admin/(dashboard)/ekonomi/program-kemiskinan/detail/page.tsx Normal file
View File

@@ -0,0 +1,66 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Flex, Paper, Stack, Text } from '@mantine/core';
import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailProgramKemiskinan() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button variant="subtle" onClick={() => router.back()}>
<IconArrowBack color={colors['blue-button']} size={25} />
</Button>
</Box>
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
<Stack>
<Text fz={"xl"} fw={"bold"}>Detail Program Kemiskinan</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fw={"bold"}>Judul Program</Text>
<Text>Program A</Text>
</Box>
<Box>
<Text fw={"bold"}>Deskripsi Singkat</Text>
<Text>Deskripsi Program A</Text>
</Box>
<Box>
<Text fw={"bold"}>Jumlah Masyarakat Miskin</Text>
<Text>100</Text>
</Box>
<Box>
<Text fw={"bold"}>Deskripsi</Text>
<Text>Deskripsi Program A</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/ekonomi/program-kemiskinan/edit')} color="green">
<IconEdit size={20} />
</Button>
</Flex>
</Box>
</Stack>
</Paper>
</Stack>
</Paper>
{/* Modal Hapus
<ModalKonfirmasiHapus
opened={modalHapus}
onClose={() => setModalHapus(false)}
onConfirm={handleHapus}
text="Apakah anda yakin ingin menghapus potensi ini?"
/> */}
</Box>
);
}
export default DetailProgramKemiskinan;

46
src/app/admin/(dashboard)/ekonomi/program-kemiskinan/edit/page.tsx Normal file
View File

@@ -0,0 +1,46 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
function EditProgramKemiskinan() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Edit Program Kemiskinan</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Judul Program</Text>}
placeholder='Masukkan judul program'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Deskripsi Singkat</Text>}
placeholder='Masukkan deskripsi'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jumlah Masyarakat Miskin</Text>}
placeholder='Masukkan jumlah masyarakat miskin'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>}
placeholder='Masukkan deskripsi'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditProgramKemiskinan;

77
src/app/admin/(dashboard)/ekonomi/program-kemiskinan/page.tsx
View File

@@ -1,31 +1,58 @@
'use client'
import colors from '@/con/colors'; import colors from '@/con/colors';
import { Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core'; import { Box, Button, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
import ProgramKemiskinan from './ui/program/page'; import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
import StatistikKemiskinan from './ui/statistik/page'; import HeaderSearch from '../../_com/header';
import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function Page() { function ProgramKemiskinan() {
return ( return (
<Stack> <Box>
<Title order={3}>Program Kemiskinan</Title> <HeaderSearch
<Tabs color={colors['blue-button']} variant='pills' defaultValue={"Program Kemiskinan"}> title='Program Kemiskinan'
<TabsList p={"xs"} bg={"#BBC8E7FF"}> placeholder='pencarian'
<TabsTab value="Program Kemiskinan"> searchIcon={<IconSearch size={20} />}
Program Kemiskinan />
</TabsTab> <ListProgramKemiskinan/>
<TabsTab value="Statistik Kemiskinan"> </Box>
Statistik Kemiskinan
</TabsTab>
</TabsList>
<TabsPanel value="Program Kemiskinan">
<ProgramKemiskinan />
</TabsPanel>
<TabsPanel value="Statistik Kemiskinan">
<StatistikKemiskinan />
</TabsPanel>
</Tabs>
</Stack>
); );
} }
export default Page; function ListProgramKemiskinan() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Program Kemiskinan'
href='/admin/ekonomi/program-kemiskinan/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Judul Program</TableTh>
<TableTh>Deskripsi Singkat</TableTh>
<TableTh>Jumlah Masyarakat Miskin</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Program A</TableTd>
<TableTd>Deskripsi Program A</TableTd>
<TableTd>100</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/ekonomi/program-kemiskinan/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default ProgramKemiskinan;

43
src/app/admin/(dashboard)/ekonomi/program-kemiskinan/ui/program/page.tsx
View File

@@ -1,43 +0,0 @@
import colors from '@/con/colors';
import { Box, Button, Group, Paper, SimpleGrid, Stack, Text, TextInput, Title } from '@mantine/core';
import React from 'react';
function ProgramKemiskinan() {
return (
<Box py={15}>
<SimpleGrid cols={{base: 1, md: 2}}>
<Box>
<Paper p={"md"} bg={colors['white-1']}>
<Stack gap={"xs"}>
<Title order={3}>Program Kemiskinan</Title>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Nama Program</Text>}
placeholder="Masukkan nama program"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Deskripsi Program</Text>}
placeholder="Masukkan deskripsi program"
/>
<Group>
<Button
bg={colors['blue-button']}
>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
<Paper p={"md"} bg={colors['white-1']}>
<Stack gap={"xs"}>
<Title order={3}>List Data Program Kemiskinan</Title>
</Stack>
</Paper>
</Box>
</SimpleGrid>
</Box>
);
}
export default ProgramKemiskinan;

43
src/app/admin/(dashboard)/ekonomi/program-kemiskinan/ui/statistik/page.tsx
View File

@@ -1,43 +0,0 @@
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import React from 'react';
function StatistikKemiskinan() {
return (
<Box py={15}>
<Stack gap={"xs"}>
<Box>
<Paper w={{base: '100%', md: '50%'}} p={"md"} bg={colors['white-1']}>
<Stack gap={"xs"}>
<Title order={3}>Statistik Kemiskinan</Title>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Tahun</Text>}
placeholder="Masukkan tahun"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Jumlah Penduduk Miskin</Text>}
placeholder="Masukkan jumlah penduduk miskin"
/>
<Group>
<Button
bg={colors['blue-button']}
>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
<Paper p={"md"} bg={colors['white-1']}>
<Stack gap={"xs"}>
<Title order={3}>Statistik Kemiskinan</Title>
</Stack>
</Paper>
</Box>
</Stack>
</Box>
);
}
export default StatistikKemiskinan;

45
src/app/admin/(dashboard)/ekonomi/sektor-unggulan-desa/create/page.tsx Normal file
View File

@@ -0,0 +1,45 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../../keamanan/_com/keamananEditor';
function CreateSektorUnggulanDesa() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25} />
</Button>
</Box>
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Create Sektor Unggulan Desa</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Sektor Unggulan</Text>}
placeholder='Masukkan nama sektor unggulan'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Sektor Unggulan</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jumlah Sektor Unggulan</Text>}
placeholder='Masukkan jumlah sektor unggulan'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreateSektorUnggulanDesa;

62
src/app/admin/(dashboard)/ekonomi/sektor-unggulan-desa/detail/page.tsx Normal file
View File

@@ -0,0 +1,62 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Flex, Paper, Stack, Text } from '@mantine/core';
import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailSektorUnggulanDesa() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button variant="subtle" onClick={() => router.back()}>
<IconArrowBack color={colors['blue-button']} size={25} />
</Button>
</Box>
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
<Stack>
<Text fz={"xl"} fw={"bold"}>Detail Sektor Unggulan Desa</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fw={"bold"}>Nama Sektor Unggulan</Text>
<Text>Petani</Text>
</Box>
<Box>
<Text fw={"bold"}>Deskripsi Sektor Unggulan</Text>
<Text>BIBD</Text>
</Box>
<Box>
<Text fw={"bold"}>Jumlah Sektor Unggulan</Text>
<Text>200</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/ekonomi/sektor-unggulan-desa/edit')} color="green">
<IconEdit size={20} />
</Button>
</Flex>
</Box>
</Stack>
</Paper>
</Stack>
</Paper>
{/* Modal Hapus
<ModalKonfirmasiHapus
opened={modalHapus}
onClose={() => setModalHapus(false)}
onConfirm={handleHapus}
text="Apakah anda yakin ingin menghapus potensi ini?"
/> */}
</Box>
);
}
export default DetailSektorUnggulanDesa;

45
src/app/admin/(dashboard)/ekonomi/sektor-unggulan-desa/edit/page.tsx Normal file
View File

@@ -0,0 +1,45 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../../keamanan/_com/keamananEditor';
function EditSektorUnggulanDesa() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25} />
</Button>
</Box>
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Edit Sektor Unggulan Desa</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Sektor Unggulan</Text>}
placeholder='Masukkan nama sektor unggulan'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Sektor Unggulan</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jumlah Sektor Unggulan</Text>}
placeholder='Masukkan jumlah sektor unggulan'
/>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditSektorUnggulanDesa;

76
src/app/admin/(dashboard)/ekonomi/sektor-unggulan-desa/page.tsx
View File

@@ -1,32 +1,56 @@
'use client'
import colors from '@/con/colors'; import colors from '@/con/colors';
import { Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core'; import { Box, Button, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
import React from 'react'; import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
import DataSektorUnggulan from './ui/data_sektor_unggulan/page'; import HeaderSearch from '../../_com/header';
import GrafikDataSektor from './ui/grafik_data_sektor/page'; import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function Page() { function SektorUnggulanDesa() {
return ( return (
<Stack> <Box>
<Title order={3}>Sektor Unggulan Desa</Title> <HeaderSearch
<Tabs color={colors['blue-button']} variant='pills' defaultValue={"Data Sektor Unggulan Desa"}> title='Sektor Unggulan Desa'
<TabsList p={"xs"} bg={"#BBC8E7FF"}> placeholder='pencarian'
<TabsTab value="Data Sektor Unggulan Desa"> searchIcon={<IconSearch size={20} />}
Data Sektor Unggulan Desa />
</TabsTab> <ListSektorUnggulanDesa/>
<TabsTab value="Grafik Data Sektor Unggulan Desa"> </Box>
Grafik Data Sektor Unggulan Desa
</TabsTab>
</TabsList>
<TabsPanel value="Data Sektor Unggulan Desa">
<DataSektorUnggulan />
</TabsPanel>
<TabsPanel value="Grafik Data Sektor Unggulan Desa">
<GrafikDataSektor />
</TabsPanel>
</Tabs>
</Stack>
); );
} }
export default Page; function ListSektorUnggulanDesa() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Sektor Unggulan Desa'
href='/admin/ekonomi/sektor-unggulan-desa/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Nama Sektor Unggulan</TableTh>
<TableTh>Deskripsi Sektor Unggulan</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Sektor 1</TableTd>
<TableTd>Deskripsi Sektor 1</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/ekonomi/sektor-unggulan-desa/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default SektorUnggulanDesa;

45
src/app/admin/(dashboard)/ekonomi/sektor-unggulan-desa/ui/data_sektor_unggulan/page.tsx
View File

@@ -1,45 +0,0 @@
import colors from '@/con/colors';
import { Box, Button, Group, Paper, SimpleGrid, Stack, Text, TextInput, Title } from '@mantine/core';
import React from 'react';
function DataSektorUnggulan() {
return (
<Box py={15}>
<Stack gap={"xs"}>
<SimpleGrid cols={{ base: 1, md: 2 }}>
<Box>
<Paper p={"md"} bg={colors['white-1']}>
<Stack gap={"xs"}>
<Title order={3}>Data Sektor Unggulan</Title>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Nama Sektor Unggulan</Text>}
placeholder="Masukkan nama sektor unggulan"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Deskripsi Sektor Unggulan</Text>}
placeholder="Masukkan deskripsi sektor unggulan"
/>
<Group>
<Button
bg={colors['blue-button']}
>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
<Paper p={"md"} bg={colors['white-1']}>
<Stack gap={"xs"}>
<Title order={3}>Data Sektor Unggulan</Title>
</Stack>
</Paper>
</Box>
</SimpleGrid>
</Stack>
</Box>
);
}
export default DataSektorUnggulan;

44
src/app/admin/(dashboard)/ekonomi/sektor-unggulan-desa/ui/grafik_data_sektor/page.tsx
View File

@@ -1,44 +0,0 @@
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import React from 'react';
function GrafikDataSektor() {
return (
<Box py={15}>
<Stack gap={"xs"}>
<Box>
<Paper w={{base: '100%', md: '50%'}} p={"md"} bg={colors['white-1']}>
<Stack gap={"xs"}>
<Title order={3}>Grafik Data Sektor Unggulan</Title>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Nama Sektor Unggulan</Text>}
placeholder="Masukkan nama sektor unggulan"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Jumlah Sektor Unggulan</Text>}
placeholder="Masukkan jumlah sektor unggulan"
/>
<Group>
<Button
bg={colors['blue-button']}
>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
<Paper p={"md"} bg={colors['white-1']}>
<Stack gap={"xs"}>
<Title order={3}>Grafik Sektor Unggulan</Title>
</Stack>
</Paper>
</Box>
</Stack>
</Box>
);
}
export default GrafikDataSektor;

49
src/app/admin/(dashboard)/inovasi/desa-digital-smart-village/create/page.tsx Normal file
View File

@@ -0,0 +1,49 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../../keamanan/_com/keamananEditor';
function CreateDesaDigital() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Create Desa Digital Smart Village</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Inovasi</Text>}
placeholder='Masukkan nama inovasi'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Deskripsi Singkat Inovasi</Text>}
placeholder='Masukkan deskripsi singkat inovasi'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Image</Text>}
placeholder='Masukkan image'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Inovasi</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreateDesaDigital;

66
src/app/admin/(dashboard)/inovasi/desa-digital-smart-village/detail/page.tsx Normal file
View File

@@ -0,0 +1,66 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Flex, Paper, Stack, Text } from '@mantine/core';
import { IconArrowBack, IconEdit, IconImageInPicture, IconX } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailDesaDigital() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button variant="subtle" onClick={() => router.back()}>
<IconArrowBack color={colors['blue-button']} size={25} />
</Button>
</Box>
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
<Stack>
<Text fz={"xl"} fw={"bold"}>Detail Desa Digital Smart Village</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fw={"bold"}>Nama Inovasi</Text>
<Text>Pelayanan Admin Digital</Text>
</Box>
<Box>
<Text fw={"bold"}>Deskripsi Singkat Inovasi</Text>
<Text>Deskripsi Singkat Inovasi</Text>
</Box>
<Box>
<Text fw={"bold"}>Image</Text>
<IconImageInPicture size={20} />
</Box>
<Box>
<Text fw={"bold"}>Deskripsi Inovasi</Text>
<Text>Deskripsi Inovasi</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/inovasi/desa-digital-smart-village/edit')} color="green">
<IconEdit size={20} />
</Button>
</Flex>
</Box>
</Stack>
</Paper>
</Stack>
</Paper>
{/* Modal Hapus
<ModalKonfirmasiHapus
opened={modalHapus}
onClose={() => setModalHapus(false)}
onConfirm={handleHapus}
text="Apakah anda yakin ingin menghapus potensi ini?"
/> */}
</Box>
);
}
export default DetailDesaDigital;

49
src/app/admin/(dashboard)/inovasi/desa-digital-smart-village/edit/page.tsx Normal file
View File

@@ -0,0 +1,49 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../../keamanan/_com/keamananEditor';
function EditDesaDigital() {
const router = useRouter();
return (
<Box>
<Box mb={10}>
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
<IconArrowBack color={colors['blue-button']} size={25}/>
</Button>
</Box>
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Edit Desa Digital Smart Village</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Inovasi</Text>}
placeholder='Masukkan nama inovasi'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Deskripsi Singkat Inovasi</Text>}
placeholder='Masukkan deskripsi singkat inovasi'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Image</Text>}
placeholder='Masukkan image'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Inovasi</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditDesaDigital;

92
src/app/admin/(dashboard)/inovasi/desa-digital-smart-village/page.tsx
View File

@@ -1,50 +1,60 @@
'use client'
import colors from '@/con/colors'; import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core'; import { Box, Button, Image, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
import { IconImageInPicture } from '@tabler/icons-react'; import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
import React from 'react'; import HeaderSearch from '../../_com/header';
import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function Page() { function DesaDigitalSmartVillage() {
return ( return (
<Box> <Box>
<Stack gap={"xs"}> <HeaderSearch
<Box> title='Desa Digital Smart Village'
<Paper w={{ base: '100%', md: '50%' }} p={"md"} bg={colors['white-1']}> placeholder='pencarian'
<Stack gap={"xs"}> searchIcon={<IconSearch size={20} />}
<Title order={3}>Create Data Desa Digital Smart Village</Title>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Nama Desa Digital Smart Village</Text>}
placeholder="Masukkan nama desa digital smart village"
/> />
<TextInput <ListDesaDigitalSmartVillage/>
label={<Text fz={"sm"} fw={"bold"}>Deskripsi Desa Digital Smart Village</Text>}
placeholder="Masukkan deskripsi desa digital smart village"
/>
<Box>
<Text fz={"sm"} fw={"bold"}>
Upload Gambar Desa Digital Smart Village
</Text>
<IconImageInPicture size={24} />
</Box>
<Group>
<Button
bg={colors['blue-button']}
>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
<Paper p={"md"} bg={colors['white-1']}>
<Stack gap={"xs"}>
<Title order={3}>Create Data Desa Digital Smart Village</Title>
</Stack>
</Paper>
</Box>
</Stack>
</Box> </Box>
); );
} }
export default Page; function ListDesaDigitalSmartVillage() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Desa Digital Smart Village'
href='/admin/inovasi/desa-digital-smart-village/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Nama Inovasi</TableTh>
<TableTh>Deskripsi Singkat Inovasi</TableTh>
<TableTh>Image</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Layanan Admin Digital</TableTd>
<TableTd>Deskripsi Singkat Inovasi</TableTd>
<TableTd>
<Image src={"/"} alt=''/>
</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/inovasi/desa-digital-smart-village/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default DesaDigitalSmartVillage;