UI Admin Revisi Baru Di Menu Ekonomi

This commit is contained in:
2025-06-03 17:42:34 +08:00
parent 423ad0e2ba
commit a1e7fddbed
42 changed files with 1509 additions and 623 deletions

View File

@@ -1,36 +0,0 @@
import colors from '@/con/colors';
import { Box, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconImageInPicture } from '@tabler/icons-react';
import React from 'react';
function CreatePasarDesa() {
return (
<Box>
<Stack gap={"xs"}>
<Title order={4}>Produk Pasar Desa</Title>
<Box>
<Text fz={"sm"} fw={"bold"}>Masukkan Foto Produk</Text>
<IconImageInPicture size={24} color={colors['blue-button']} />
</Box>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Nama Produk</Text>}
placeholder="masukkan nama produk"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Harga Produk</Text>}
placeholder="masukkan harga produk"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Rating Produk</Text>}
placeholder="masukkan rating produk"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Alamat Usaha</Text>}
placeholder="masukkan alamat usaha"
/>
</Stack>
</Box>
);
}
export default CreatePasarDesa;

View File

@@ -0,0 +1,56 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../../keamanan/_com/keamananEditor';
function CreatePasarDesa() {
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 Pasar Desa</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Produk</Text>}
placeholder='Masukkan nama produk'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Harga Produk</Text>}
placeholder='Masukkan harga produk'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Rating Produk</Text>}
placeholder='Masukkan rating produk'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Alamat Usaha</Text>}
placeholder='Masukkan alamat usaha'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Produk</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreatePasarDesa;

View File

@@ -0,0 +1,74 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import React from 'react';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailPasarDesa() {
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 Pasar Desa</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fz={"lg"} fw={"bold"}>Nama Produk</Text>
<Text fz={"lg"}>Test Judul</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Harga Produk</Text>
<Text fz={"lg"}>Rp. 20.000</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Rating Produk</Text>
<Text fz={"lg"}>5</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Alamat Usaha</Text>
<Text fz={"lg"}>Jalan In Aja</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
<Image src={"/"} alt="gambar" />
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
<Text fz={"lg"} >Test Konten</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/ekonomi/pasar-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 DetailPasarDesa;

View File

@@ -0,0 +1,56 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../../keamanan/_com/keamananEditor';
function EditPasarDesa() {
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 Pasar Desa</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Produk</Text>}
placeholder='Masukkan nama produk'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Harga Produk</Text>}
placeholder='Masukkan harga produk'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Rating Produk</Text>}
placeholder='Masukkan rating produk'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Alamat Usaha</Text>}
placeholder='Masukkan alamat usaha'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Produk</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditPasarDesa;

View File

@@ -1,32 +0,0 @@
import colors from '@/con/colors';
import { Box, Paper, Stack, Text, Title } from '@mantine/core';
import { IconImageInPicture } from '@tabler/icons-react';
import React from 'react';
function ListDataUsaha() {
return (
<Box>
<Stack gap={"xs"}>
<Paper bg={colors['white-1']} p={'md'} radius={10}>
<Box>
<Title mb={10} order={4}>List Produk Pasar Desa</Title>
<Box>
<Text fz={"sm"} fw={"bold"}>Foto Produk</Text>
<IconImageInPicture size={24} color={colors['blue-button']} />
</Box>
<Text fz={"sm"} fw={"bold"}>Nama Produk</Text>
<Text></Text>
<Text fz={"sm"} fw={"bold"}>Harga Produk</Text>
<Text></Text>
<Text fz={"sm"} fw={"bold"}>Rating Produk</Text>
<Text></Text>
<Text fz={"sm"} fw={"bold"}>Alamat Usaha</Text>
<Text></Text>
</Box>
</Paper>
</Stack>
</Box>
);
}
export default ListDataUsaha;

View File

@@ -1,31 +1,60 @@
'use client'
import colors from '@/con/colors'; import colors from '@/con/colors';
import { Box, Button, Group, Paper, 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 CreatePasarDesa from './create/createPasarDesa'; import HeaderSearch from '../../_com/header';
import ListDataUsaha from './listData/page'; import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function Page() { function PasarDesa() {
return ( return (
<Stack gap={'xs'}> <Box>
<Box> <HeaderSearch
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'} radius={10}> title='Pasar Desa'
<Stack gap={'xs'}> placeholder='pencarian'
<Title order={3}>Pasar Desa</Title> searchIcon={<IconSearch size={20} />}
<CreatePasarDesa /> />
<Group> <ListPasarDesa/>
<Button </Box>
mt={10}
bg={colors['blue-button']}
>
Submit
</Button>
</Group>
</Stack>
</Paper>
</Box>
<ListDataUsaha />
</Stack>
); );
} }
export default Page; function ListPasarDesa() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Pasar Desa'
href='/admin/ekonomi/pasar-desa/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Nama Produk</TableTh>
<TableTh>Harga Produk</TableTh>
<TableTh>Rating Produk</TableTh>
<TableTh>Alamat Usaha</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Produk 1</TableTd>
<TableTd>Harga Rp. 20.000</TableTd>
<TableTd>Rating 5</TableTd>
<TableTd>Jalan In Aja</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/ekonomi/pasar-desa/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default PasarDesa;

View File

@@ -0,0 +1,44 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function CreateKeamananLingkungan() {
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 Keamanan Lingkungan</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Keamanan Lingkungan</Text>}
placeholder='Masukkan nama KeamananLingkungan'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi KeamananLingkungan</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreateKeamananLingkungan;

View File

@@ -0,0 +1,70 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import React from 'react';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailKeamananLingkungan() {
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 Keamanan Lingkungan</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fz={"lg"} fw={"bold"}>Nama Keamanan Lingkungan</Text>
<Text fz={"lg"}>Test Judul</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Nomor Keamanan Lingkungan</Text>
<Text fz={"lg"}>Test Kategori</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
<Text fz={"lg"}>Test Deskripsi</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
<Image src={"/"} alt="gambar" />
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Konten</Text>
<Text fz={"lg"} >Test Konten</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/keamanan/keamanan-lingkungan-pecalang-patwal/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 DetailKeamananLingkungan;

View File

@@ -0,0 +1,44 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function EditKeamananLingkungan() {
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 Keamanan Lingkungan</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Keamanan Lingkungan</Text>}
placeholder='Masukkan nama Keamanan Lingkungan'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Keamanan Lingkungan</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditKeamananLingkungan;

View File

@@ -1,36 +1,58 @@
'use client'
import colors from '@/con/colors'; import colors from '@/con/colors';
import { Box, 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 CreateKeamananLingkungan from './ui/tambah_keamanan_lingkungan/page'; import HeaderSearch from '../../_com/header';
import ListKeamananLingkungan from './ui/list_keamanan_lingkungan/page'; import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function KeamananLingkungan() {
function Page() {
return ( return (
<Box> <Box>
<Stack gap={'xs'}> <HeaderSearch
<Title order={3}>Keamanan Lingkungan </Title> title='Keamanan Lingkungan'
<Tabs defaultValue="create" color={colors['blue-button']} variant='pills'> placeholder='pencarian'
<TabsList mb={10} bg={colors['BG-trans']} p={'xs'}> searchIcon={<IconSearch size={20} />}
<TabsTab value="create" > />
Tambah Keamanan Lingkungan <ListKeamananLingkungan/>
</TabsTab>
<TabsTab value="list" >
List Keamanan Lingkungan
</TabsTab>
</TabsList>
<TabsPanel value="create">
<CreateKeamananLingkungan/>
</TabsPanel>
<TabsPanel value="list">
<ListKeamananLingkungan/>
</TabsPanel>
</Tabs>
</Stack>
</Box> </Box>
); );
} }
export default Page; function ListKeamananLingkungan() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Keamanan Lingkungan'
href='/admin/keamanan/keamanan-lingkungan-pecalang-patwal/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Nama Keamanan Lingkungan</TableTh>
<TableTh>Nomor Keamanan Lingkungan</TableTh>
<TableTh>Deskripsi</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Keamanan Lingkungan 1</TableTd>
<TableTd>0896232831883</TableTd>
<TableTd>Keamanan Lingkungan 1</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/keamanan/keamanan-lingkungan-pecalang-patwal/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default KeamananLingkungan;

View File

@@ -1,33 +0,0 @@
import { Box, Paper, Stack, Table, TableTbody, TableTh, TableThead, TableTr, Title } from '@mantine/core';
import colors from '@/con/colors';
import React from 'react';
function ListKeamananLingkungan() {
return (
<Box>
<Paper bg={colors['white-1']} p={'md'} radius={10}>
<Stack gap={'xs'}>
<Title order={3}>List Keamanan Lingkungan</Title>
<Box>
<Table striped withTableBorder withColumnBorders withRowBorders>
<TableThead>
<TableTr>
<TableTh>Image</TableTh>
<TableTh>Nama Keamanan Lingkungan</TableTh>
<TableTh>Deskripsi Keamanan Lingkungan</TableTh>
<TableTh>Aksi</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
</TableTbody>
</Table>
</Box>
</Stack>
</Paper>
</Box>
);
}
export default ListKeamananLingkungan;

View File

@@ -1,46 +0,0 @@
import colors from '@/con/colors';
import { Box, Button, Group, Paper, SimpleGrid, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconImageInPicture } from '@tabler/icons-react';
import React from 'react';
import { KeamananEditor } from '../../../_com/keamananEditor';
function KeamananLingkungan() {
return (
<Box>
<Stack gap={'xs'}>
<SimpleGrid cols={{ base: 1, md: 2 }}>
<Box>
<Paper bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Tambah Keamanan Lingkungan</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Keamanan Lingkungan</Text>}
placeholder='Masukkan nama keamanan lingkungan'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Keamanan Lingkungan</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
</Box>
</SimpleGrid>
</Stack>
</Box>
);
}
export default KeamananLingkungan;

View File

@@ -1,28 +0,0 @@
import colors from '@/con/colors';
import { Box, Stack, Text, TextInput } from '@mantine/core';
import { IconImageInPicture } from '@tabler/icons-react';
function CreateKontakDarurat() {
return (
<Box>
<Stack gap={"xs"}>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Judul Kontak Darurat</Text>}
placeholder="masukkan judul kontak darurat"
/>
<IconImageInPicture size={24} color={colors['blue-button']} />
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Nama Kontak Darurat</Text>}
placeholder="masukkan nama kontak darurat"
/>
<IconImageInPicture size={24} color={colors['blue-button']} />
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Nomor Kontak Darurat</Text>}
placeholder="masukkan nomor kontak darurat"
/>
</Stack>
</Box>
);
}
export default CreateKontakDarurat;

View File

@@ -0,0 +1,44 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function CreateKontakDarurat() {
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 Kontak Darurat</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Kontak Darurat</Text>}
placeholder='Masukkan nama Kontak Darurat'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Kontak Darurat</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreateKontakDarurat;

View File

@@ -0,0 +1,70 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import React from 'react';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailKontakDarurat() {
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 Kontak Darurat</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fz={"lg"} fw={"bold"}>Nama Kontak Darurat</Text>
<Text fz={"lg"}>Test Judul</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Nomor Kontak Darurat</Text>
<Text fz={"lg"}>Test Kategori</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
<Text fz={"lg"}>Test Deskripsi</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
<Image src={"/"} alt="gambar" />
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Konten</Text>
<Text fz={"lg"} >Test Konten</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/keamanan/kontak-darurat/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 DetailKontakDarurat;

View File

@@ -0,0 +1,44 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function EditKontakDarurat() {
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 Kontak Darurat</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Kontak Darurat</Text>}
placeholder='Masukkan nama Kontak Darurat'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Kontak Darurat</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditKontakDarurat;

View File

@@ -1,23 +0,0 @@
import colors from '@/con/colors';
import { Box, Paper, Stack, Text, Title } from '@mantine/core';
import React from 'react';
function ListDataKontakDarurat() {
return (
<Paper bg={colors['white-1']} p={'md'} radius={10}>
<Stack gap={"xs"}>
<Title order={3}>List Data Kontak Darurat</Title>
<Box>
<Text fw={"bold"}>Judul Kontak Darurat</Text>
<Text> </Text>
<Text fw={"bold"}>Nama Kontak Darurat</Text>
<Text> </Text>
<Text fw={"bold"}>Nomor Kontak Darurat</Text>
<Text> </Text>
</Box>
</Stack>
</Paper>
);
}
export default ListDataKontakDarurat;

View File

@@ -1,31 +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 CreateKontakDarurat from './create/createKontak'; import HeaderSearch from '../../_com/header';
import ListDataKontakDarurat from './listData/page'; import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function Page() { function KontakDaurat() {
return ( return (
<Stack gap={"xs"}> <Box>
<SimpleGrid cols={{ base: 1, md: 2 }}> <HeaderSearch
<Box> title='Kontak Darurat'
<Paper bg={colors['white-1']} p={'md'} radius={10}> placeholder='pencarian'
<Title order={3}>Kontak Darurat</Title> searchIcon={<IconSearch size={20} />}
<CreateKontakDarurat/> />
<Group> <ListKontakDaurat/>
<Button </Box>
mt={10}
bg={colors['blue-button']}
>
Submit
</Button>
</Group>
</Paper>
</Box>
<ListDataKontakDarurat/>
</SimpleGrid>
</Stack>
); );
} }
export default Page; function ListKontakDaurat() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Kontak Darurat'
href='/admin/keamanan/kontak-darurat/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Nama Kontak Darurat</TableTh>
<TableTh>Nomor Kontak Darurat</TableTh>
<TableTh>Deskripsi</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Kontak Darurat 1</TableTd>
<TableTd>0896232831883</TableTd>
<TableTd>Kontak Darurat 1</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/keamanan/kontak-darurat/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default KontakDaurat;

View File

@@ -1,27 +0,0 @@
import { Box, Stack, Text, TextInput } from '@mantine/core';
import React from 'react';
import { KeamananEditor } from '../../_com/keamananEditor';
function CreateLaporanPublik() {
return (
<Box>
<Stack gap={"xs"}>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Judul Laporan Publik</Text>}
placeholder="masukkan judul laporan publik"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Tanggal Laporan Publik</Text>}
placeholder="masukkan tanggal laporan publik"
/>
<Box>
<Text fz={"sm"} fw={"bold"}>Deskripsi Laporan Publik</Text>
<KeamananEditor showSubmit={false} />
</Box>
</Stack>
</Box>
);
}
export default CreateLaporanPublik;

View File

@@ -0,0 +1,48 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function CreateLaporanPublik() {
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 Laporan Publik</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Judul Laporan Publik</Text>}
placeholder='Masukkan judul LaporanPublik'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Tanggal Laporan Publik</Text>}
placeholder='Masukkan tanggal LaporanPublik'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Laporan Publik</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreateLaporanPublik;

View File

@@ -0,0 +1,70 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import React from 'react';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailLaporanPublik() {
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 Laporan Publik</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fz={"lg"} fw={"bold"}>Judul Laporan Publik</Text>
<Text fz={"lg"}>Test Judul</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Tanggal Laporan Publik</Text>
<Text fz={"lg"}>Test Tanggal</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
<Text fz={"lg"}>Test Deskripsi</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
<Image src={"/"} alt="gambar" />
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Konten</Text>
<Text fz={"lg"} >Test Konten</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/keamanan/laporan-publik/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 DetailLaporanPublik;

View File

@@ -0,0 +1,48 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function EditLaporanPublik() {
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 Laporan Publik</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Judul Laporan Publik</Text>}
placeholder='Masukkan judul Laporan Publik'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Tanggal Laporan Publik</Text>}
placeholder='Masukkan tanggal Laporan Publik'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Laporan Publik</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditLaporanPublik;

View File

@@ -1,23 +0,0 @@
import React from 'react';
import { Box, Paper, Stack, Text, Title } from '@mantine/core';
import colors from '@/con/colors';
function ListDataLaporanPublik() {
return (
<Paper bg={colors['white-1']} p={'md'} radius={10}>
<Stack gap={"xs"}>
<Title order={3}>List Data Laporan Publik</Title>
<Box>
<Text fw={"bold"}>Judul Laporan Publik</Text>
<Text></Text>
<Text fw={"bold"}>Tanggal Laporan Publik</Text>
<Text></Text>
<Text fw={"bold"}>Deskripsi Laporan Publik</Text>
<Text></Text>
</Box>
</Stack>
</Paper>
);
}
export default ListDataLaporanPublik;

View File

@@ -1,28 +1,58 @@
import colors from "@/con/colors"; 'use client'
import { Box, Button, Group, Paper, SimpleGrid, Stack, Title } from "@mantine/core"; import colors from '@/con/colors';
import CreateLaporanPublik from "./create/createLaporan"; import { Box, Button, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
import ListDataLaporanPublik from "./listData/page"; import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
import HeaderSearch from '../../_com/header';
import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
export default function Page() { function LaporanPublik() {
return ( return (
<Stack gap={"xs"}> <Box>
<SimpleGrid cols={{ base: 1, md: 2 }}> <HeaderSearch
<Box> title='Laporan Publik'
<Paper bg={colors['white-1']} p={'md'} radius={10}> placeholder='pencarian'
<Title order={3}>Laporan Publik</Title> searchIcon={<IconSearch size={20} />}
<CreateLaporanPublik/> />
<Group> <ListLaporanPublik/>
<Button </Box>
mt={10} );
bg={colors['blue-button']} }
>
Submit function ListLaporanPublik() {
</Button> const router = useRouter();
</Group> return (
</Paper> <Box py={10}>
</Box> <Paper bg={colors['white-1']} p={'md'}>
<ListDataLaporanPublik/> <JudulList
</SimpleGrid> title='List Laporan Publik'
</Stack> href='/admin/keamanan/laporan-publik/create'
) />
} <Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Judul Laporan Publik</TableTh>
<TableTh>Tanggal Laporan Publik</TableTh>
<TableTh>Deskripsi</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Laporan Publik 1</TableTd>
<TableTd>0896232831883</TableTd>
<TableTd>Laporan Publik 1</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/keamanan/laporan-publik/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default LaporanPublik;

View File

@@ -1,25 +0,0 @@
import colors from '@/con/colors';
import { Box, Stack, Text, TextInput } from '@mantine/core';
import { IconImageInPicture } from '@tabler/icons-react';
import React from 'react';
function CreatePencegahan() {
return (
<Box>
<Stack gap={"xs"}>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Judul Pencegahan Kriminalitas</Text>}
placeholder="masukkan judul pencegahan kriminalitas"
/>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Deskripsi Pencegahan Kriminalitas</Text>}
placeholder="masukkan deskripsi pencegahan kriminalitas"
/>
<Text fw={"bold"} fz={"sm"} >Gambar Pencegahan Kriminalitas</Text>
<IconImageInPicture size={24} color={colors['blue-button']} />
</Stack>
</Box>
);
}
export default CreatePencegahan;

View File

@@ -0,0 +1,44 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function CreatePencegahanKriminalitas() {
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 Pencegahan Kriminalitas</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Pencegahan Kriminalitas</Text>}
placeholder='Masukkan nama Pencegahan Kriminalitas'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Pencegahan Kriminalitas</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreatePencegahanKriminalitas;

View File

@@ -0,0 +1,70 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import React from 'react';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailPencegahanKriminalitas() {
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 Pencegahan Kriminalitas</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fz={"lg"} fw={"bold"}>Nama Pencegahan Kriminalitas</Text>
<Text fz={"lg"}>Test Judul</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Nomor Pencegahan Kriminalitas</Text>
<Text fz={"lg"}>Test Kategori</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
<Text fz={"lg"}>Test Deskripsi</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
<Image src={"/"} alt="gambar" />
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Konten</Text>
<Text fz={"lg"} >Test Konten</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/keamanan/pencegahan-kriminalitas/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 DetailPencegahanKriminalitas;

View File

@@ -0,0 +1,44 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function EditPencegahanKriminalitas() {
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 Pencegahan Kriminalitas</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Pencegahan Kriminalitas</Text>}
placeholder='Masukkan nama Pencegahan Kriminalitas'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Pencegahan Kriminalitas</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditPencegahanKriminalitas;

View File

@@ -1,23 +0,0 @@
import colors from '@/con/colors';
import { Box, Paper, Stack, Text, Title } from '@mantine/core';
import React from 'react';
function ListDataPencegahan() {
return (
<Paper bg={colors['white-1']} p={'md'} radius={10}>
<Stack gap={"xs"}>
<Title order={3}>List Data Pencegahan Kriminalitas</Title>
<Box>
<Text fw={"bold"}>Judul Pencegahan Kriminalitas</Text>
<Text> </Text>
<Text fw={"bold"}>Deskripsi Pencegahan Kriminalitas</Text>
<Text> </Text>
<Text fw={"bold"}>Gambar Pencegahan Kriminalitas</Text>
<Text> </Text>
</Box>
</Stack>
</Paper>
);
}
export default ListDataPencegahan;

View File

@@ -1,32 +1,58 @@
'use client'
import colors from '@/con/colors'; import colors from '@/con/colors';
import { Stack, SimpleGrid, Box, Paper, Title, Group, Button } 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 CreatePencegahan from './create/createPencegahan'; import HeaderSearch from '../../_com/header';
import ListDataPencegahan from './listData/page'; import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function PencegahanKriminalitas() {
function Page() {
return ( return (
<Stack gap={"xs"}> <Box>
<SimpleGrid cols={{ base: 1, md: 2 }}> <HeaderSearch
<Box> title='Pencegahan Kriminalitas'
<Paper bg={colors['white-1']} p={'md'} radius={10}> placeholder='pencarian'
<Title order={3}>Kontak Darurat</Title> searchIcon={<IconSearch size={20} />}
<CreatePencegahan/> />
<Group> <ListPencegahanKriminalitas/>
<Button </Box>
mt={10}
bg={colors['blue-button']}
>
Submit
</Button>
</Group>
</Paper>
</Box>
<ListDataPencegahan/>
</SimpleGrid>
</Stack>
); );
} }
export default Page; function ListPencegahanKriminalitas() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Pencegahan Kriminalitas'
href='/admin/keamanan/pencegahan-kriminalitas/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Nama Pencegahan Kriminalitas</TableTh>
<TableTh>Nomor Pencegahan Kriminalitas</TableTh>
<TableTh>Deskripsi</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Pencegahan Kriminalitas 1</TableTd>
<TableTd>0896232831883</TableTd>
<TableTd>Pencegahan Kriminalitas 1</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/keamanan/pencegahan-kriminalitas/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default PencegahanKriminalitas;

View File

@@ -0,0 +1,44 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function CreatePolsekTerdekat() {
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 Polsek Terdekat</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Polsek Terdekat</Text>}
placeholder='Masukkan nama Polsek Terdekat'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Polsek Terdekat</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreatePolsekTerdekat;

View File

@@ -0,0 +1,70 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import React from 'react';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailPolsekTerdekat() {
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 Polsek Terdekat</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fz={"lg"} fw={"bold"}>Nama Polsek Terdekat</Text>
<Text fz={"lg"}>Test Judul</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Nomor Polsek Terdekat</Text>
<Text fz={"lg"}>Test Kategori</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
<Text fz={"lg"}>Test Deskripsi</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
<Image src={"/"} alt="gambar" />
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Konten</Text>
<Text fz={"lg"} >Test Konten</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/keamanan/polsek-terdekat/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 DetailPolsekTerdekat;

View File

@@ -0,0 +1,44 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function EditPolsekTerdekat() {
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 Polsek Terdekat</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Polsek Terdekat</Text>}
placeholder='Masukkan nama Polsek Terdekat'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Polsek Terdekat</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditPolsekTerdekat;

View File

@@ -1,36 +1,58 @@
'use client'
import colors from '@/con/colors'; import colors from '@/con/colors';
import { Box, 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 CreatePolsekTerdekat from './ui/tambah_polsek_terdekat/page'; import HeaderSearch from '../../_com/header';
import ListPolsekTerdekat from './ui/list_polsek_terdekat/page'; import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function PolsekTerdekat() {
function Page() {
return ( return (
<Box> <Box>
<Stack gap={'xs'}> <HeaderSearch
<Title order={3}>Polsek Terdekat</Title> title='Polsek Terdekat'
<Tabs defaultValue="create" color={colors['blue-button']} variant='pills'> placeholder='pencarian'
<TabsList mb={10} bg={colors['BG-trans']} p={'xs'}> searchIcon={<IconSearch size={20} />}
<TabsTab value="create" > />
Tambah Polsek Terdekat <ListPolsekTerdekat/>
</TabsTab>
<TabsTab value="list" >
List Polsek Terdekat
</TabsTab>
</TabsList>
<TabsPanel value="create">
<CreatePolsekTerdekat/>
</TabsPanel>
<TabsPanel value="list">
<ListPolsekTerdekat/>
</TabsPanel>
</Tabs>
</Stack>
</Box> </Box>
); );
} }
export default Page; function ListPolsekTerdekat() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Polsek Terdekat'
href='/admin/keamanan/polsek-terdekat/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Nama Polsek Terdekat</TableTh>
<TableTh>Nomor Polsek Terdekat</TableTh>
<TableTh>Deskripsi</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Polsek Terdekat 1</TableTd>
<TableTd>0896232831883</TableTd>
<TableTd>Polsek Terdekat 1</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/keamanan/polsek-terdekat/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default PolsekTerdekat;

View File

@@ -1,36 +0,0 @@
import { Box, Paper, Stack, Table, TableTbody, TableTh, TableThead, TableTr, Title } from '@mantine/core';
import colors from '@/con/colors';
import React from 'react';
function ListPolsekTerdekat() {
return (
<Box>
<Paper bg={colors['white-1']} p={'md'} radius={10}>
<Stack gap={'xs'}>
<Title order={3}>List Polsek Terdekat</Title>
<Box>
<Table striped withTableBorder withColumnBorders withRowBorders>
<TableThead>
<TableTr>
<TableTh>Nama Polsek Terdekat</TableTh>
<TableTh>Jarak Polsek Terdekat</TableTh>
<TableTh>Alamat Polsek Terdekat</TableTh>
<TableTh>Nomor Telepon Polsek Terdekat</TableTh>
<TableTh>Jam Aktif</TableTh>
<TableTh>Deskripsi Polsek Terdekat</TableTh>
<TableTh>Aksi</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
</TableTbody>
</Table>
</Box>
</Stack>
</Paper>
</Box>
);
}
export default ListPolsekTerdekat;

View File

@@ -1,56 +0,0 @@
import colors from '@/con/colors';
import { Box, Button, Group, Paper, SimpleGrid, Stack, Text, TextInput, Title } from '@mantine/core';
import { KeamananEditor } from '../../../_com/keamananEditor';
function CreatePolsekTerdekat() {
return (
<Box>
<Stack gap={'xs'}>
<SimpleGrid cols={{ base: 1, md: 2 }}>
<Box>
<Paper bg={colors['white-1']} p={'md'}>
<Stack gap={"xs"}>
<Title order={4}>Tambah Polsek Terdekat</Title>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Polsek Terdekat</Text>}
placeholder='Masukkan nama polsek terdekat'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jarak Polsek Terdekat</Text>}
placeholder='Masukkan jarak polsek terdekat'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Alamat Polsek Terdekat</Text>}
placeholder='Masukkan alamat polsek terdekat'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nomor Telepon Polsek Terdekat</Text>}
placeholder='Masukkan nomor telepon polsek terdekat'
/>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Jam Aktif</Text>}
placeholder='Masukkan jam aktif polsek terdekat'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Polsek Terdekat</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
<Box>
</Box>
</SimpleGrid>
</Stack>
</Box>
);
}
export default CreatePolsekTerdekat;

View File

@@ -1,27 +0,0 @@
import colors from '@/con/colors';
import { Box, Stack, Text, TextInput } from '@mantine/core';
import { IconImageInPicture } from '@tabler/icons-react';
import React from 'react';
import { KeamananEditor } from '../../_com/keamananEditor';
function CreateTipsKeamanan() {
return (
<Box>
<Stack gap={"xs"}>
<TextInput
label={<Text fz={"sm"} fw={"bold"}>Judul Tips Keamanan</Text>}
placeholder="masukkan judul tips keamanan"
/>
<Box>
<Text fz={"sm"} fw={"bold"}>Upload Gambar</Text>
<IconImageInPicture size={24} color={colors['blue-button']} />
</Box>
<KeamananEditor
showSubmit={false}
/>
</Stack>
</Box>
);
}
export default CreateTipsKeamanan;

View File

@@ -0,0 +1,44 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function CreateTipsKeamanan() {
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 Tips Keamanan</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Tips Keamanan</Text>}
placeholder='Masukkan nama tips keamanan'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Tips Keamanan</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default CreateTipsKeamanan;

View File

@@ -0,0 +1,70 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import React from 'react';
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
function DetailTipsKeamanan() {
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 Tips Keamanan</Text>
<Paper bg={colors['BG-trans']} p={'md'}>
<Stack gap={"xs"}>
<Box>
<Text fz={"lg"} fw={"bold"}>Nama Tips Keamanan</Text>
<Text fz={"lg"}>Test Judul</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Nomor Tips Keamanan</Text>
<Text fz={"lg"}>Test Kategori</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
<Text fz={"lg"}>Test Deskripsi</Text>
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
<Image src={"/"} alt="gambar" />
</Box>
<Box>
<Text fz={"lg"} fw={"bold"}>Konten</Text>
<Text fz={"lg"} >Test Konten</Text>
</Box>
<Box>
<Flex gap={"xs"}>
<Button color="red">
<IconX size={20} />
</Button>
<Button onClick={() => router.push('/admin/keamanan/tips-keamanan/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 DetailTipsKeamanan;

View File

@@ -0,0 +1,44 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { KeamananEditor } from '../../_com/keamananEditor';
function EditTipsKeamanan() {
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 Tips Keamanan</Title>
<Box>
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
<IconImageInPicture size={50} />
</Box>
<TextInput
label={<Text fw={"bold"} fz={"sm"}>Nama Tips Keamanan</Text>}
placeholder='Masukkan nama Tips Keamanan'
/>
<Box>
<Text fw={"bold"} fz={"sm"}>Deskripsi Tips Keamanan</Text>
<KeamananEditor
showSubmit={false}
/>
</Box>
<Group>
<Button bg={colors['blue-button']}>Submit</Button>
</Group>
</Stack>
</Paper>
</Box>
);
}
export default EditTipsKeamanan;

View File

@@ -1,24 +0,0 @@
import colors from '@/con/colors';
import { Box, Paper, Stack, Text, Title } from '@mantine/core';
import { IconImageInPicture } from '@tabler/icons-react';
import React from 'react';
function ListDataTipsKeamanan() {
return (
<Paper bg={colors['white-1']} p={'md'} radius={10}>
<Stack gap={"xs"}>
<Title order={3}>List Data Tips Keamanan</Title>
<Box>
<Text fw={"bold"}>Judul Tips Keamanan</Text>
<Text></Text>
<Text fw={"bold"}>Gambar Tips Keamanan</Text>
<IconImageInPicture size={24} color={colors['blue-button']} />
<Text fw={"bold"}>Deskripsi Tips Keamanan</Text>
<Text></Text>
</Box>
</Stack>
</Paper>
);
}
export default ListDataTipsKeamanan;

View File

@@ -1,31 +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 CreateTipsKeamanan from './create/createTips'; import HeaderSearch from '../../_com/header';
import ListDataTipsKeamanan from './listData/page'; import JudulList from '../../_com/judulList';
import { useRouter } from 'next/navigation';
function Page() { function TipsKeamanan() {
return ( return (
<Stack gap={"xs"}> <Box>
<SimpleGrid cols={{ base: 1, md: 2 }}> <HeaderSearch
<Box> title='Tips Keamanan'
<Paper bg={colors['white-1']} p={'md'} radius={10}> placeholder='pencarian'
<Title order={3}>Tips Keamanan</Title> searchIcon={<IconSearch size={20} />}
<CreateTipsKeamanan/> />
<Group> <ListTipsKeamanan/>
<Button </Box>
mt={10} );
bg={colors['blue-button']}
>
Submit
</Button>
</Group>
</Paper>
</Box>
<ListDataTipsKeamanan/>
</SimpleGrid>
</Stack>
)
} }
export default Page; function ListTipsKeamanan() {
const router = useRouter();
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<JudulList
title='List Tips Keamanan'
href='/admin/keamanan/tips-keamanan/create'
/>
<Table striped withTableBorder withRowBorders>
<TableThead>
<TableTr>
<TableTh>Nama Tips Keamanan</TableTh>
<TableTh>Nomor Tips Keamanan</TableTh>
<TableTh>Deskripsi</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
<TableTr>
<TableTd>Tips Keamanan 1</TableTd>
<TableTd>0896232831883</TableTd>
<TableTd>Tips Keamanan 1</TableTd>
<TableTd>
<Button onClick={() => router.push('/admin/keamanan/tips-keamanan/detail')}>
<IconDeviceImac size={20} />
</Button>
</TableTd>
</TableTr>
</TableTbody>
</Table>
</Paper>
</Box>
);
}
export default TipsKeamanan;