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

upd: announcement

Browse Source 
Deskripsi:
- tambah
- edit
- detail

No Issues
This commit is contained in:
amel
2024-08-14 15:40:19 +08:00
parent fcf54d1924
commit e2d49fdd7e
29 changed files with 784 additions and 501 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
src/module/announcement/ui/list_announcement.tsx
View File

@@ -1,6 +1,6 @@
'use client'
import { WARNA } from '@/module/_global';
import { ActionIcon, Box, Center, Divider, Grid, Group, Spoiler, Text, TextInput } from '@mantine/core';
import { SkeletonSingle, WARNA } from '@/module/_global';
import { ActionIcon, Box, Center, Divider, Grid, Group, Spoiler, Stack, Text, TextInput } from '@mantine/core';
import React, { useState } from 'react';
import { TfiAnnouncement } from "react-icons/tfi";
import { HiMagnifyingGlass } from 'react-icons/hi2';
@@ -15,9 +15,11 @@ export default function ListAnnouncement() {
const [isData, setIsData] = useState<IListDataAnnouncement[]>([])
const [searchQuery, setSearchQuery] = useState('')
const router = useRouter()
const [loading, setLoading] = useState(true);
const fetchData = async () => {
try {
setLoading(true);
const response = await funGetAllAnnouncement('?search=' + searchQuery)
if (response.success) {
@@ -25,10 +27,12 @@ export default function ListAnnouncement() {
} else {
toast.error(response.message);
}
setLoading(false);
} catch (error) {
toast.error("Gagal mendapatkan announcement, coba lagi nanti");
console.error(error);
} finally {
setLoading(false);
}
}
@@ -51,39 +55,52 @@ export default function ListAnnouncement() {
leftSection={<HiMagnifyingGlass size={20} />}
placeholder="Pencarian"
onChange={(e) => setSearchQuery(e.target.value)}
/>
{isData.map((v, i) => {
return (
<Box key={i} mt={15}>
<Box >
<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}>
<Group justify='space-between' mb={5} onClick={() => {
router.push(`/announcement/${v.id}`)
}}>
<Text fw={'bold'} c={WARNA.biruTua}>{v.title}</Text>
<Text fw={'lighter'} c={WARNA.biruTua} fz={13}>{v.createdAt}</Text>
</Group>
{/* <Text c={WARNA.biruTua} lineClamp={2}>{v.desc}</Text> */}
<Spoiler maxHeight={50} showLabel="Lebih banyak" hideLabel="Lebih sedikit">
<Text c={WARNA.biruTua} onClick={() => {
router.push(`/announcement/${v.id}`)
}} >{v.desc}</Text>
</Spoiler>
</Grid.Col>
</Grid>
/>
{loading
? Array(6)
.fill(null)
.map((_, i) => (
<Box key={i}>
<SkeletonSingle />
</Box>
<Divider my={15} />
</Box>
)
})}
))
: (isData.length === 0) ?
<Stack align="stretch" justify="center" w={"100%"} h={200}>
<Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada pengumuman</Text>
</Stack>
:
isData.map((v, i) => {
return (
<Box key={i} mt={15}>
<Box >
<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}>
<Group justify='space-between' mb={5} onClick={() => {
router.push(`/announcement/${v.id}`)
}}>
<Text fw={'bold'} c={WARNA.biruTua}>{v.title}</Text>
<Text fw={'lighter'} c={WARNA.biruTua} fz={13}>{v.createdAt}</Text>
</Group>
{/* <Text c={WARNA.biruTua} lineClamp={2}>{v.desc}</Text> */}
<Spoiler maxHeight={50} showLabel="Lebih banyak" hideLabel="Lebih sedikit">
<Text c={WARNA.biruTua} onClick={() => {
router.push(`/announcement/${v.id}`)
}} >{v.desc}</Text>
</Spoiler>
</Grid.Col>
</Grid>
</Box>
<Divider my={15} />
</Box>
)
})}
</Box>
);
}