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

feat : update revisi

Browse Source 
Deskripsi:
- update tambah anggota
- update list anggota
- update tambah kalender
- update kalender name indonesia

No Issue
This commit is contained in:
lukman
2024-08-28 16:44:24 +08:00
parent 8a79ab14c1
commit 7f540e7724
9 changed files with 121 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/app/api/calender/route.ts
View File

@@ -102,22 +102,6 @@ export async function POST(request: Request) {
return NextResponse.json({ success: false, message: "Gagal mendapatkan divisi, data tidak ditemukan" }, { status: 404 }); return NextResponse.json({ success: false, message: "Gagal mendapatkan divisi, data tidak ditemukan" }, { status: 404 });
} }
if (timeStart > timeEnd) {
return NextResponse.json({ success: false, message: "Gagal mendapatkan calender, waktu mulai harus lebih kecil dari waktu berakhir" }, { status: 404 });
}
if (dateStart > dateEnd) {
return NextResponse.json({ success: false, message: "Gagal mendapatkan calender, Tanggal mulai harus lebih kecil dari Tanggal berakhir" }, { status: 404 });
}
if (dateStart < moment().format("YYYY-MM-DD")) {
return NextResponse.json({ success: false, message: "Gagal mendapatkan calender, Tanggal mulai harus lebih kecil dari Tanggal sekarang" }, { status: 404 });
}
if (dateEnd < moment().format("YYYY-MM-DD")) {
return NextResponse.json({ success: false, message: "Gagal mendapatkan calender, Tanggal berakhir harus lebih kecil dari Tanggal sekarang" }, { status: 404 });
}
const statusCalender = 0 const statusCalender = 0
const y = new Date('1970-01-01 ' + timeStart) const y = new Date('1970-01-01 ' + timeStart)

22
src/module/calender/ui/create_user_calender.tsx
View File

@@ -5,7 +5,7 @@ import { funGetDivisionById, IDataMemberDivision } from '@/module/division_new';
import { useHookstate } from '@hookstate/core'; import { useHookstate } from '@hookstate/core';
import toast from 'react-hot-toast'; import toast from 'react-hot-toast';
import { useShallowEffect } from '@mantine/hooks'; import { useShallowEffect } from '@mantine/hooks';
import { LayoutNavbarNew, WARNA } from '@/module/_global'; import { LayoutNavbarNew, SkeletonSingle, WARNA } from '@/module/_global';
import { Avatar, Box, Button, Divider, Flex, Group, Text } from '@mantine/core'; import { Avatar, Box, Button, Divider, Flex, Group, Text } from '@mantine/core';
import { FaCheck } from 'react-icons/fa6'; import { FaCheck } from 'react-icons/fa6';
@@ -16,21 +16,27 @@ export default function CreateUserCalender({ onClose }: { onClose: (val: any) =>
const [isData, setData] = useState<IDataMemberDivision[]>([]) const [isData, setData] = useState<IDataMemberDivision[]>([])
const member = useHookstate(globalCalender) const member = useHookstate(globalCalender)
const [selectAll, setSelectAll] = useState(false) const [selectAll, setSelectAll] = useState(false)
const [loading, setLoading] = useState(true)
async function getData() { async function getData() {
try { try {
setLoading(true)
const response = await funGetDivisionById(param.id) const response = await funGetDivisionById(param.id)
if (response.success) { if (response.success) {
setData(response.data.member) setData(response.data.member)
if (member.length > 0) { if (member.length > 0) {
setSelectedFiles(JSON.parse(JSON.stringify(member.get()))) setSelectedFiles(JSON.parse(JSON.stringify(member.get())))
} }
setLoading(false)
} else { } else {
toast.error(response.message) toast.error(response.message)
} }
} catch (error) { } catch (error) {
console.log(error) console.log(error)
toast.error("Gagal mendapatkan anggota, coba lagi nanti"); toast.error("Gagal mendapatkan anggota, coba lagi nanti");
} finally {
setLoading(false)
} }
} }
@@ -88,8 +94,17 @@ export default function CreateUserCalender({ onClose }: { onClose: (val: any) =>
Pilih Semua Anggota Pilih Semua Anggota
</Text> </Text>
{selectAll ? <FaCheck style={{ marginRight: 10 }} /> : ""} {selectAll ? <FaCheck style={{ marginRight: 10 }} /> : ""}
</Group> </Group>
<Box mt={15}> {loading ?
Array(4)
.fill(null)
.map((_, i) => (
<Box key={i}>
<SkeletonSingle />
</Box>
))
:
<Box mt={20}>
{isData.map((v, i) => { {isData.map((v, i) => {
const isSelected = selectedFiles.some((i: any) => i?.idUser == v.idUser); const isSelected = selectedFiles.some((i: any) => i?.idUser == v.idUser);
return ( return (
@@ -121,6 +136,7 @@ export default function CreateUserCalender({ onClose }: { onClose: (val: any) =>
); );
})} })}
</Box> </Box>
}
<Box mt={"xl"}> <Box mt={"xl"}>
<Button <Button
c={"white"} c={"white"}

6
src/module/calender/ui/date_event_division.tsx
View File

@@ -9,6 +9,8 @@ import { IDataCalender } from '../lib/type_calender';
import moment from 'moment'; import moment from 'moment';
import _ from 'lodash'; import _ from 'lodash';
import toast from 'react-hot-toast'; import toast from 'react-hot-toast';
import 'dayjs/locale/id'
import { PiCalendarStarThin } from 'react-icons/pi';
export default function DateEventDivision() { export default function DateEventDivision() {
@@ -80,7 +82,7 @@ export default function DateEventDivision() {
const muncul = isListTgl.includes(coba) const muncul = isListTgl.includes(coba)
return ( return (
<Indicator size={6} color="red" offset={-5} disabled={!muncul}> <Indicator color="red" offset={-3} disabled={!muncul} position='top-end' inline processing size={10} >
<div>{day}</div> <div>{day}</div>
</Indicator> </Indicator>
); );
@@ -88,6 +90,7 @@ export default function DateEventDivision() {
return ( return (
<Box> <Box>
<Group <Group
@@ -101,6 +104,7 @@ export default function DateEventDivision() {
renderDay={dayRenderer} renderDay={dayRenderer}
onChange={(val: any) => { change(val) }} onChange={(val: any) => { change(val) }}
onDateChange={(val) => { changeMonth(val) }} onDateChange={(val) => { changeMonth(val) }}
locale='id'
/> />
</Group> </Group>
<Box> <Box>

13
src/module/calender/ui/navbar_create_division_calender.tsx
View File

@@ -62,16 +62,6 @@ export default function NavbarCreateDivisionCalender() {
if (response.success) { if (response.success) {
setModal(false) setModal(false)
router.push(`/division/${param.id}/calender`) router.push(`/division/${param.id}/calender`)
setData({
...isData,
title: "",
dateStart: "",
timeStart: "",
timeEnd: "",
linkMeet: "",
repeatEventTyper: "1",
desc: "",
})
toast.success(response.message) toast.success(response.message)
memberUser.set([]) memberUser.set([])
} else { } else {
@@ -136,7 +126,6 @@ export default function NavbarCreateDivisionCalender() {
}} }}
placeholder="Input Tanggal" placeholder="Input Tanggal"
label="Tanggal" label="Tanggal"
minDate={new Date()}
onBlur={() => setTouched({ ...touched, dateStart: true })} onBlur={() => setTouched({ ...touched, dateStart: true })}
error={ error={
touched.dateStart && ( touched.dateStart && (
@@ -250,7 +239,7 @@ export default function NavbarCreateDivisionCalender() {
borderRadius: 10, borderRadius: 10,
}} }}
> >
<Text>Tambah Anggota *</Text> <Text>Tambah Anggota</Text>
<IoIosArrowDropright size={25} /> <IoIosArrowDropright size={25} />
</Group> </Group>
</Box> </Box>

129
src/module/calender/ui/update_list_users.tsx
View File

@@ -1,5 +1,5 @@
"use client" "use client"
import { LayoutNavbarNew, WARNA } from '@/module/_global'; import { LayoutNavbarNew, SkeletonSingle, WARNA } from '@/module/_global';
import { funGetDivisionById, IDataMemberDivision } from '@/module/division_new'; import { funGetDivisionById, IDataMemberDivision } from '@/module/division_new';
import { useHookstate } from '@hookstate/core'; import { useHookstate } from '@hookstate/core';
import { Avatar, Box, Button, Center, Divider, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core'; import { Avatar, Box, Button, Center, Divider, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
@@ -51,21 +51,26 @@ export default function UpdateListUsers({ onClose }: { onClose: (val: any) => vo
const [isData, setData] = useState<IDataMemberDivision[]>([]) const [isData, setData] = useState<IDataMemberDivision[]>([])
const member = useHookstate(globalCalender) const member = useHookstate(globalCalender)
const [selectAll, setSelectAll] = useState(false) const [selectAll, setSelectAll] = useState(false)
const [loading, setLoading] = useState(true)
async function getData() { async function getData() {
try { try {
setLoading(true)
const response = await funGetDivisionById(param.id) const response = await funGetDivisionById(param.id)
if (response.success) { if (response.success) {
setData(response.data.member) setData(response.data.member)
if (member.length > 0) { if (member.length > 0) {
setSelectedFiles(JSON.parse(JSON.stringify(member.get()))) setSelectedFiles(JSON.parse(JSON.stringify(member.get())))
} }
setLoading(false)
} else { } else {
toast.error(response.message) toast.error(response.message)
} }
} catch (error) { } catch (error) {
console.log(error) console.log(error)
toast.error("Gagal mendapatkan anggota, coba lagi nanti"); toast.error("Gagal mendapatkan anggota, coba lagi nanti");
} finally {
setLoading(false)
} }
} }
@@ -112,64 +117,74 @@ export default function UpdateListUsers({ onClose }: { onClose: (val: any) => vo
return ( return (
<Box> <Box>
<LayoutNavbarNew <LayoutNavbarNew
// back="" // back=""
title="Pilih Anggota" title="Pilih Anggota"
menu menu
/> />
<Box p={20}> <Box p={20}>
<Group justify="space-between" mt={20} onClick={handleSelectAll}> <Group justify="space-between" mt={20} onClick={handleSelectAll}>
<Text c={WARNA.biruTua} fw={"bold"}> <Text c={WARNA.biruTua} fw={"bold"}>
Pilih Semua Anggota Pilih Semua Anggota
</Text> </Text>
{selectAll ? <FaCheck style={{ marginRight: 10 }} /> : ""} {selectAll ? <FaCheck style={{ marginRight: 10 }} /> : ""}
</Group> </Group>
<Box mt={15}> {loading ?
{isData.map((v, i) => { Array(4)
const isSelected = selectedFiles.some((i: any) => i?.idUser == v.idUser); .fill(null)
return ( .map((_, i) => (
<Box mb={15} key={i} onClick={() => handleFileClick(i)}> <Box key={i}>
<Flex justify={"space-between"} align={"center"}> <SkeletonSingle />
<Group> </Box>
<Avatar src={"v.image"} alt="it's me" size="lg" /> ))
<Text style={{ :
cursor: 'pointer', <Box mt={20}>
display: 'flex', {isData.map((v, i) => {
alignItems: 'center', const isSelected = selectedFiles.some((i: any) => i?.idUser == v.idUser);
}}> return (
{v.name} <Box mb={15} key={i} onClick={() => handleFileClick(i)}>
</Text> <Flex justify={"space-between"} align={"center"}>
</Group> <Group>
<Text <Avatar src={"v.image"} alt="it's me" size="lg" />
style={{ <Text style={{
cursor: 'pointer', cursor: 'pointer',
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
paddingLeft: 20, }}>
}} {v.name}
> </Text>
{isSelected ? <FaCheck style={{ marginRight: 10 }} /> : ""} </Group>
</Text> <Text
</Flex> style={{
<Divider my={"md"} /> cursor: 'pointer',
</Box> display: 'flex',
); alignItems: 'center',
})} paddingLeft: 20,
</Box> }}
<Box mt={"xl"}> >
<Button {isSelected ? <FaCheck style={{ marginRight: 10 }} /> : ""}
c={"white"} </Text>
bg={WARNA.biruTua} </Flex>
size="lg" <Divider my={"md"} />
radius={30} </Box>
fullWidth );
onClick={() => {onSubmit()}} })}
> </Box>
Simpan }
</Button> <Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => { onSubmit() }}
>
Simpan
</Button>
</Box>
</Box> </Box>
</Box> </Box>
</Box>
); );
} }

2
src/module/user/member/ui/create_member.tsx
View File

@@ -343,7 +343,7 @@ export default function CreateMember() {
size="md" size="md"
type="number" type="number"
radius={30} radius={30}
placeholder="87701795778" placeholder="xxx xxxx xxxx"
leftSection={<Text>+62</Text>} leftSection={<Text>+62</Text>}
withAsterisk withAsterisk
label="Nomor Telepon" label="Nomor Telepon"

2
src/module/user/member/ui/edit_member.tsx
View File

@@ -307,7 +307,7 @@ export default function EditMember({ id }: { id: string }) {
borderColor: WARNA.biruTua, borderColor: WARNA.biruTua,
}, },
}} }}
placeholder="6287701795778" placeholder="62xxx xxxx xxxx"
onChange={(e) => { onChange={(e) => {
setData({ ...data, phone: e.target.value }) setData({ ...data, phone: e.target.value })
setTouched({ ...touched, phone: false }) setTouched({ ...touched, phone: false })

2
src/module/user/member/ui/navbar_detail_member.tsx
View File

@@ -98,7 +98,7 @@ export default function NavbarDetailMember({ id }: IMember) {
<FaSquarePhone size={28} /> <FaSquarePhone size={28} />
<Text fz={18}>No Telepon</Text> <Text fz={18}>No Telepon</Text>
</Group> </Group>
<Text fz={18} fw={'bold'} ta={"right"}>{dataOne?.phone}</Text> <Text fz={18} fw={'bold'} ta={"right"}>+{dataOne?.phone}</Text>
</Group> </Group>
<Group justify="space-between" grow py={5}> <Group justify="space-between" grow py={5}>
<Group> <Group>

40
src/module/user/member/ui/tab_list_member.tsx
View File

@@ -1,6 +1,6 @@
import { SkeletonSingle, WARNA } from "@/module/_global" import { SkeletonSingle, WARNA } from "@/module/_global"
import { Box, Group, ActionIcon, Text, TextInput } from "@mantine/core" import { Box, Group, ActionIcon, Text, TextInput, Divider } from "@mantine/core"
import { useShallowEffect } from "@mantine/hooks" import { useShallowEffect } from "@mantine/hooks"
import { useRouter, useSearchParams } from "next/navigation" import { useRouter, useSearchParams } from "next/navigation"
import { useEffect, useState } from "react" import { useEffect, useState } from "react"
@@ -65,28 +65,30 @@ export default function TabListMember() {
: :
dataMember.length == 0 ? dataMember.length == 0 ?
<Box style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '60vh' }}> <Box style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '60vh' }}>
<Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada anggota</Text> <Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada anggota</Text>
</Box> </Box>
: :
dataMember.map((v, i) => { dataMember.map((v, i) => {
return ( return (
<Box pt={20} key={i} onClick={() => { <Box key={i}>
router.push(`/member/${v.id}`) <Box onClick={() => {
}}> router.push(`/member/${v.id}`)
<Group align='center' style={{ }}>
borderBottom: `1px solid #D9D9D9`, <Group align='center' style={{
padding: 10, padding: 10,
}} > }} >
<Box> <Box>
<ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon"> <ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
<HiMiniUser color={'white'} size={25} /> <HiMiniUser color={'white'} size={25} />
</ActionIcon> </ActionIcon>
</Box> </Box>
<Box> <Box>
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text> <Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
<Text fw={'lighter'} fz={12}>{v.group + ' - ' + v.position}</Text> <Text fw={'lighter'} fz={12}>{v.group + ' - ' + v.position}</Text>
</Box> </Box>
</Group> </Group>
</Box>
<Divider my={10}/>
</Box> </Box>
) )
}) })