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

Sinkronisasi UI & API Admin - User Submenu Penanganan Darurat, User Submenu Kontak Darurat & User Submenu Info Wabah / Penyakit

Browse Source
This commit is contained in:
nico
2025-08-18 20:56:18 +08:00
parent 1e154ced86
commit 4491d23bea
14 changed files with 845 additions and 636 deletions
Download Patch File Download Diff File Expand all files Collapse all files

121
src/app/admin/(dashboard)/kesehatan/info-wabah-penyakit/page.tsx
View File

@@ -1,6 +1,6 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Image, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
import { Box, Button, Center, Image, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
import { IconDeviceImacCog, IconSearch } from '@tabler/icons-react';
import JudulList from '../../_com/judulList';
import HeaderSearch from '../../_com/header';
@@ -21,7 +21,7 @@ function InfoWabahPenyakit() {
value={search}
onChange={(e) => setSearch(e.currentTarget.value)}
/>
<ListInfoWabahPenyakit search={search}/>
<ListInfoWabahPenyakit search={search} />
</Box>
);
}
@@ -30,19 +30,21 @@ function ListInfoWabahPenyakit({ search }: { search: string }) {
const infoWabahPenyakitState = useProxy(infoWabahPenyakit)
const router = useRouter()
const {
data,
page,
totalPages,
loading,
load,
} = infoWabahPenyakitState.findMany;
useShallowEffect(() => {
infoWabahPenyakitState.findMany.load()
}, [])
load(page, 10, search)
}, [page, search])
const filteredData = (infoWabahPenyakitState.findMany.data || []).filter(item => {
const keyword = search.toLowerCase();
return (
item.name.toLowerCase().includes(keyword) ||
item.deskripsiSingkat.toLowerCase().includes(keyword)
);
});
const filteredData = data || []
if (!infoWabahPenyakitState.findMany.data) {
if (loading || !data) {
return (
<Box py={10}>
<Skeleton h={500} />
@@ -51,49 +53,60 @@ function ListInfoWabahPenyakit({ search }: { search: string }) {
}
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<Stack>
<JudulList
title='List Info Wabah Penyakit'
href='/admin/kesehatan/info-wabah-penyakit/create'
/>
<Box style={{ overflowX: "auto" }}>
<Table striped withRowBorders withTableBorder style={{ minWidth: '700px' }}>
<TableThead>
<TableTr>
<TableTh>Judul</TableTh>
<TableTh>Deskripsi Singkat</TableTh>
<TableTh>Image</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
{filteredData.map((item) => (
<TableTr key={item.id}>
<TableTd>
<Box w={100}>
<Text truncate="end" fz={"sm"}>{item.name}</Text>
</Box>
</TableTd>
<TableTd>
<Text truncate="end" fz={"sm"}>{item.deskripsiSingkat}</Text>
</TableTd>
<TableTd>
<Image w={100} src={item.image?.link} alt="image" />
</TableTd>
<TableTd>
<Button onClick={() => router.push(`/admin/kesehatan/info-wabah-penyakit/${item.id}`)}>
<IconDeviceImacCog size={25} />
</Button>
</TableTd>
<Paper bg={colors['white-1']} p={'md'}>
<Stack>
<JudulList
title='List Info Wabah Penyakit'
href='/admin/kesehatan/info-wabah-penyakit/create'
/>
<Box style={{ overflowX: "auto" }}>
<Table striped withRowBorders withTableBorder style={{ minWidth: '700px' }}>
<TableThead>
<TableTr>
<TableTh>Judul</TableTh>
<TableTh>Deskripsi Singkat</TableTh>
<TableTh>Image</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
))}
</TableTbody>
</Table>
</Box>
</Stack>
</Paper>
</Box>
</TableThead>
<TableTbody>
{filteredData.map((item) => (
<TableTr key={item.id}>
<TableTd>
<Box w={100}>
<Text truncate="end" fz={"sm"}>{item.name}</Text>
</Box>
</TableTd>
<TableTd>
<Box w={100}>
<Text truncate="end" fz={"sm"}>{item.deskripsiSingkat}</Text>
</Box>
</TableTd>
<TableTd>
<Image w={100} src={item.image?.link} alt="image" />
</TableTd>
<TableTd>
<Button onClick={() => router.push(`/admin/kesehatan/info-wabah-penyakit/${item.id}`)}>
<IconDeviceImacCog size={25} />
</Button>
</TableTd>
</TableTr>
))}
</TableTbody>
</Table>
</Box>
</Stack>
</Paper>
<Center>
<Pagination
value={page}
onChange={(newPage) => load(newPage)} // ini penting!
total={totalPages}
mt="md"
mb="md"
/>
</Center>
</Box>
)
}

39
src/app/admin/(dashboard)/kesehatan/kontak-darurat/page.tsx
View File

@@ -1,6 +1,6 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Image, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
import { Box, Button, Center, Image, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
import { IconDeviceImacCog, IconSearch } from '@tabler/icons-react';
import JudulList from '../../_com/judulList';
import HeaderSearch from '../../_com/header';
@@ -21,7 +21,7 @@ function KontakDarurat() {
value={search}
onChange={(e) => setSearch(e.currentTarget.value)}
/>
<ListKontakDarurat search={search}/>
<ListKontakDarurat search={search} />
</Box>
);
}
@@ -30,19 +30,21 @@ function ListKontakDarurat({ search }: { search: string }) {
const kontakDaruratState = useProxy(kontakDarurat)
const router = useRouter();
const {
data,
page,
totalPages,
loading,
load,
} = kontakDaruratState.findMany;
useShallowEffect(() => {
kontakDaruratState.findMany.load()
}, [])
load(page, 10, search)
}, [page, search])
const filteredData = (kontakDaruratState.findMany.data || []).filter(item => {
const keyword = search.toLowerCase();
return (
item.name.toLowerCase().includes(keyword) ||
item.deskripsi.toLowerCase().includes(keyword)
);
});
const filteredData = data || []
if (!kontakDaruratState.findMany.data) {
if (loading || !data) {
return (
<Box py={10}>
<Skeleton h={500} />
@@ -77,7 +79,9 @@ function ListKontakDarurat({ search }: { search: string }) {
</Box>
</TableTd>
<TableTd>
<Text truncate="end" fz={"sm"} dangerouslySetInnerHTML={{ __html: item.deskripsi }} />
<Box w={100}>
<Text truncate="end" lineClamp={1} fz={"sm"} dangerouslySetInnerHTML={{ __html: item.deskripsi }} />
</Box>
</TableTd>
<TableTd>
<Image w={100} src={item.image?.link} alt="image" />
@@ -94,6 +98,15 @@ function ListKontakDarurat({ search }: { search: string }) {
</Box>
</Stack>
</Paper>
<Center>
<Pagination
value={page}
onChange={(newPage) => load(newPage)} // ini penting!
total={totalPages}
mt="md"
mb="md"
/>
</Center>
</Box>
)
}

119
src/app/admin/(dashboard)/kesehatan/penanganan-darurat/page.tsx
View File

@@ -1,6 +1,6 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Image, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
import { Box, Button, Center, Image, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
import { IconDeviceImacCog, IconSearch } from '@tabler/icons-react';
import JudulList from '../../_com/judulList';
import HeaderSearch from '../../_com/header';
@@ -21,7 +21,7 @@ function PenangananDarurat() {
value={search}
onChange={(e) => setSearch(e.currentTarget.value)}
/>
<ListPenangananDarurat search={search}/>
<ListPenangananDarurat search={search} />
</Box>
);
}
@@ -30,19 +30,21 @@ function ListPenangananDarurat({ search }: { search: string }) {
const penangananDaruratState = useProxy(penangananDarurat)
const router = useRouter();
const {
data,
page,
totalPages,
loading,
load,
} = penangananDaruratState.findMany;
useShallowEffect(() => {
penangananDaruratState.findMany.load()
}, [])
load(page, 10, search)
}, [page, search])
const filteredData = (penangananDaruratState.findMany.data || []).filter(item => {
const keyword = search.toLowerCase();
return (
item.name.toLowerCase().includes(keyword) ||
item.deskripsi.toLowerCase().includes(keyword)
);
});
const filteredData = data || []
if (!penangananDaruratState.findMany.data) {
if (loading || !data) {
return (
<Box py={10}>
<Skeleton h={500} />
@@ -52,48 +54,59 @@ function ListPenangananDarurat({ search }: { search: string }) {
return (
<Box py={10}>
<Paper bg={colors['white-1']} p={'md'}>
<Stack>
<JudulList
title='List Penanganan Darurat'
href='/admin/kesehatan/penanganan-darurat/create'
<Paper bg={colors['white-1']} p={'md'}>
<Stack>
<JudulList
title='List Penanganan Darurat'
href='/admin/kesehatan/penanganan-darurat/create'
/>
<Box style={{ overflowX: "auto" }}>
<Table striped withRowBorders withTableBorder style={{ minWidth: '700px' }}>
<TableThead>
<TableTr>
<TableTh>Judul</TableTh>
<TableTh>Deskripsi</TableTh>
<TableTh>Image</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
{filteredData.map((item) => (
<TableTr key={item.id}>
<TableTd>
<Box w={100}>
<Text truncate="end" fz={"sm"}>{item.name}</Text>
</Box></TableTd>
<TableTd>
<Box w={100}>
<Text lineClamp={1} truncate="end" fz={"sm"} dangerouslySetInnerHTML={{ __html: item.deskripsi }} />
</Box>
</TableTd>
<TableTd>
<Image w={100} src={item.image?.link} alt="image" />
</TableTd>
<TableTd>
<Button onClick={() => router.push(`/admin/kesehatan/penanganan-darurat/${item.id}`)}>
<IconDeviceImacCog size={25} />
</Button>
</TableTd>
</TableTr>
))}
</TableTbody>
</Table>
</Box>
</Stack>
</Paper>
<Center>
<Pagination
value={page}
onChange={(newPage) => load(newPage)} // ini penting!
total={totalPages}
mt="md"
mb="md"
/>
<Box style={{ overflowX: "auto" }}>
<Table striped withRowBorders withTableBorder style={{ minWidth: '700px' }}>
<TableThead>
<TableTr>
<TableTh>Judul</TableTh>
<TableTh>Deskripsi</TableTh>
<TableTh>Image</TableTh>
<TableTh>Detail</TableTh>
</TableTr>
</TableThead>
<TableTbody>
{filteredData.map((item) => (
<TableTr key={item.id}>
<TableTd>
<Box w={100}>
<Text truncate="end" fz={"sm"}>{item.name}</Text>
</Box></TableTd>
<TableTd>
<Text truncate="end" fz={"sm"} dangerouslySetInnerHTML={{ __html: item.deskripsi }} />
</TableTd>
<TableTd>
<Image w={100} src={item.image?.link} alt="image" />
</TableTd>
<TableTd>
<Button onClick={() => router.push(`/admin/kesehatan/penanganan-darurat/${item.id}`)}>
<IconDeviceImacCog size={25} />
</Button>
</TableTd>
</TableTr>
))}
</TableTbody>
</Table>
</Box>
</Stack>
</Paper>
</Box>
</Center>
</Box>
)
}

2
src/app/admin/(dashboard)/kesehatan/program-kesehatan/page.tsx
View File

@@ -39,7 +39,7 @@ function ListProgramKesehatan({ search }: { search: string }) {
} = programKesehatanState.findMany;
useShallowEffect(() => {
load(page, 3, search)
load(page, 10, search)
}, [page, search])
const filteredData = data || []

2
src/app/admin/(dashboard)/kesehatan/puskesmas/page.tsx
View File

@@ -39,7 +39,7 @@ function ListPuskesmas({ search }: { search: string }) {
} = statePuskesmas.findMany;
useShallowEffect(() => {
load(page, 3, search)
load(page, 10, search)
}, [page, search])
const filteredData = data || []