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

upd: list pengumuman

Browse Source
This commit is contained in:
amel
2024-07-18 15:03:07 +08:00
parent 948020b1be
commit 0c9ce19ca3
1 changed files with 48 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
src/module/announcement/component/list_announcement.tsx
View File

@@ -1,6 +1,6 @@
'use client'
import { WARNA } from '@/module/_global';
import { ActionIcon, Box, Group, Text, TextInput } from '@mantine/core';
import { ActionIcon, Box, Center, Divider, Grid, Group, Text, TextInput } from '@mantine/core';
import React from 'react';
import { TfiAnnouncement } from "react-icons/tfi";
import { HiMagnifyingGlass } from 'react-icons/hi2';
@@ -10,42 +10,58 @@ const dataPengumuman = [
{
id: 1,
name: 'Lembaga Pengkreditan Desa',
desc: 'Diharapkan semua untuk melakukan upacara ben...'
desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
grup: 'Dinas',
tgl: '7 Juli 2024'
},
{
id: 2,
name: 'Lembaga Pengkreditan Desa',
desc: 'Diharapkan semua untuk melakukan upacara ben...'
desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
grup: 'Dinas',
tgl: '7 Juli 2024'
},
{
id: 3,
name: 'Lembaga Pengkreditan Desa',
desc: 'Diharapkan semua untuk melakukan upacara ben...'
desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
grup: 'Adat',
tgl: '7 Juli 2024'
},
{
id: 4,
name: 'Lembaga Pengkreditan Desa',
desc: 'Diharapkan semua untuk melakukan upacara ben...'
desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
grup: 'Dinas',
tgl: '7 Juli 2024'
},
{
id: 5,
name: 'Lembaga Pengkreditan Desa',
desc: 'Diharapkan semua untuk melakukan upacara ben...'
desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
grup: 'PKK',
tgl: '7 Juli 2024'
},
{
id: 6,
name: 'Lembaga Pengkreditan Desa',
desc: 'Diharapkan semua untuk melakukan upacara ben...'
desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
grup: 'Karang Taruna',
tgl: '7 Juli 2024'
},
{
id: 7,
name: 'Lembaga Pengkreditan Desa',
desc: 'Diharapkan semua untuk melakukan upacara ben...'
desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
grup: 'Dinas',
tgl: '7 Juli 2024'
},
{
id: 8,
name: 'Lembaga Pengkreditan Desa',
desc: 'Diharapkan semua untuk melakukan upacara ben...'
desc: 'Diharapkan semua untuk melakukan upacara ben...',
grup: 'Dinas',
tgl: '7 Juli 2024'
},
]
@@ -68,22 +84,29 @@ export default function ListAnnouncement() {
/>
{dataPengumuman.map((v, i) => {
return (
<Box pt={20} key={i} onClick={() => {
router.push(`/announcement/${v.id}`)
}}>
<Group align='center' style={{
borderBottom: `1px solid #D9D9D9`,
padding: 10,
}} >
<Box>
<ActionIcon variant="light" bg={'#FCAA4B'} size={50} radius={100} aria-label="icon">
<TfiAnnouncement color={WARNA.biruTua} size={25} />
</ActionIcon>
</Box>
<Box>
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
</Box>
</Group>
<Box key={i} mt={15}>
<Box onClick={() => {
router.push(`/announcement/${v.id}`)
}}>
<Grid>
<Grid.Col span={2}>
<Center>
<ActionIcon variant="light" bg={'#FCAA4B'} size={50} radius={100} aria-label="icon">
<TfiAnnouncement color={WARNA.biruTua} size={25} />
</ActionIcon>
</Center>
</Grid.Col>
<Grid.Col span={10}>
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
<Text c={WARNA.biruTua} truncate={'end'}>{v.desc}</Text>
<Group justify='space-between' mt={5}>
<Text fw={'lighter'} c={WARNA.biruTua} fz={13}>{v.grup}</Text>
<Text fw={'lighter'} c={WARNA.biruTua} fz={13}>{v.tgl}</Text>
</Group>
</Grid.Col>
</Grid>
</Box>
<Divider my={15}/>
</Box>
)
})}