diff --git a/src/module/announcement/ui/create_announcement.tsx b/src/module/announcement/ui/create_announcement.tsx index 0265326..3424fa0 100644 --- a/src/module/announcement/ui/create_announcement.tsx +++ b/src/module/announcement/ui/create_announcement.tsx @@ -75,7 +75,7 @@ export default function CreateAnnouncement() { return ( - } /> + } /> diff --git a/src/module/announcement/ui/create_users_announcement.tsx b/src/module/announcement/ui/create_users_announcement.tsx index bb2f4e0..23c1060 100644 --- a/src/module/announcement/ui/create_users_announcement.tsx +++ b/src/module/announcement/ui/create_users_announcement.tsx @@ -1,7 +1,7 @@ "use client"; import { LayoutNavbarNew, WARNA } from '@/module/_global'; import { funGetGroupDivision } from '@/module/group/lib/api_group'; -import { Box, Button, Divider, Flex, Group, Stack, Text } from '@mantine/core'; +import { Box, Button, Divider, Flex, Group, rem, Skeleton, Stack, Text } from '@mantine/core'; import { useShallowEffect } from '@mantine/hooks'; import React, { useState } from 'react'; import { FaCheck } from 'react-icons/fa'; @@ -22,6 +22,7 @@ export default function CreateUsersAnnouncement({ onClose }: { onClose: (val: an const [selectAll, setSelectAll] = useState(false); const [isData, setIsData] = useState([]) const memberGroup = useHookstate(globalMemberAnnouncement) + const [loading, setLoading] = useState(false) const handleCheck = (groupId: string, divisionId: string) => { const newChecked = { ...checked }; @@ -70,6 +71,7 @@ export default function CreateUsersAnnouncement({ onClose }: { onClose: (val: an }; async function getData() { + setLoading(true) const response = await funGetGroupDivision() setIsData(response.data) @@ -81,6 +83,8 @@ export default function CreateUsersAnnouncement({ onClose }: { onClose: (val: an setChecked(formatArray) } + + setLoading(false) } const handleSubmit = () => { @@ -121,75 +125,89 @@ export default function CreateUsersAnnouncement({ onClose }: { onClose: (val: an Pilih Semua - {isData.map((item) => ( - - handleGroupCheck(item.id)} justify='space-between' align='center'> - - {item.name} - - - {checked[item.id] && checked[item.id].length === item.Division.length ? - : (checked[item.id] && checked[item.id].length > 0 && checked[item.id].length < item.Division.length) ? : ""} - - - - {item.Division.map((division) => ( - - handleCheck(item.id, division.id)} justify='space-between' align='center'> - - {division.name} - - - {checked[item.id] && checked[item.id].includes(division.id) ? : ""} - - - - + {loading ? + Array(6) + .fill(null) + .map((_, i) => ( + + + + + + + )) + : + isData.map((item) => ( + + handleGroupCheck(item.id)} justify='space-between' align='center'> + + {item.name} + + + {checked[item.id] && checked[item.id].length === item.Division.length ? + : (checked[item.id] && checked[item.id].length > 0 && checked[item.id].length < item.Division.length) ? : ""} + + + + {item.Division.map((division) => ( + + handleCheck(item.id, division.id)} justify='space-between' align='center'> + + + {division.name} + + + + {checked[item.id] && checked[item.id].includes(division.id) ? : ""} + + + + + - - ))} - - ))} - - - - + ))} + + )) + } + + + ); diff --git a/src/module/announcement/ui/detail_announcement.tsx b/src/module/announcement/ui/detail_announcement.tsx index 19d6dff..4d8c9e4 100644 --- a/src/module/announcement/ui/detail_announcement.tsx +++ b/src/module/announcement/ui/detail_announcement.tsx @@ -1,5 +1,5 @@ "use client" -import { ActionIcon, Box, Flex, Grid, Group, List, Skeleton, Spoiler, Stack, Text } from "@mantine/core"; +import { ActionIcon, Box, Center, Flex, Grid, Group, List, Skeleton, Spoiler, Stack, Text } from "@mantine/core"; import { useShallowEffect } from "@mantine/hooks"; import { useState } from "react"; import { BsCardText } from "react-icons/bs"; @@ -78,15 +78,25 @@ export default function DetailAnnouncement({ id }: { id: string }) { : - - - {isData?.title} - - - + +
+ +
- + + + {isData?.title} + + + + + +
+ +
+ + {isData?.desc} @@ -108,10 +118,12 @@ export default function DetailAnnouncement({ id }: { id: string }) { return ( {isMember[v]?.[0].group} - + { isMember[v].map((item: any, x: any) => { - return {item.division} + return + {item.division} + }) } diff --git a/src/module/announcement/ui/edit_announcement.tsx b/src/module/announcement/ui/edit_announcement.tsx index 4e601b9..9b6a625 100644 --- a/src/module/announcement/ui/edit_announcement.tsx +++ b/src/module/announcement/ui/edit_announcement.tsx @@ -1,23 +1,25 @@ 'use client' import { LayoutNavbarNew, WARNA } from "@/module/_global"; import LayoutModal from "@/module/_global/layout/layout_modal"; -import { Box, Button, Flex, List, rem, Skeleton, Stack, Text, Textarea, TextInput } from "@mantine/core"; +import { Box, Button, Flex, Group, List, rem, Skeleton, Stack, Text, Textarea, TextInput } from "@mantine/core"; import { useShallowEffect } from "@mantine/hooks"; import { useState } from "react"; import toast from "react-hot-toast"; import { HiOutlineChevronRight } from "react-icons/hi2"; import { funEditAnnouncement, funGetAnnouncementById } from "../lib/api_announcement"; -import { useParams } from "next/navigation"; +import { useParams, useRouter } from "next/navigation"; import { useHookstate } from "@hookstate/core"; import { globalMemberEditAnnouncement } from "../lib/val_announcement"; import { GroupData, GroupDataEditAnnouncement } from "../lib/type_announcement"; import EditChooseMember from "./edit_choose_member"; +import { IoIosArrowForward } from "react-icons/io"; export default function EditAnnouncement() { const [isOpen, setOpen] = useState(false) const [isChooseDivisi, setChooseDivisi] = useState(false) const param = useParams<{ id: string }>() const [loading, setLoading] = useState(true) + const router = useRouter() const [touched, setTouched] = useState({ title: false, desc: false @@ -89,6 +91,7 @@ export default function EditAnnouncement() { if (response.success) { toast.success(response.message) + router.push(`/announcement/${param.id}`) } else { toast.error(response.message) } @@ -121,7 +124,7 @@ export default function EditAnnouncement() { <> - + : <> @@ -173,9 +176,22 @@ export default function EditAnnouncement() { } /> - + + { setChooseDivisi(true) }} + > + + Tambah divisi penerima pengumuman + + + + } @@ -197,11 +213,17 @@ export default function EditAnnouncement() { return ( {v.name} - + - {v.Division.map((division: any) => ( -
  • {division.name}
    • - ))} + + { + v.Division.map((division: any) => { + return + {division.name} + + }) + } +     diff --git a/src/module/announcement/ui/edit_choose_member.tsx b/src/module/announcement/ui/edit_choose_member.tsx index 32af0fa..8708057 100644 --- a/src/module/announcement/ui/edit_choose_member.tsx +++ b/src/module/announcement/ui/edit_choose_member.tsx @@ -145,6 +145,7 @@ export default function EditChooseMember({ onClose }: { onClose: (val: any) => v alignItems: 'center', }} fw={checked[item.id] && checked[item.id].length === item.Division.length ? 'bold' : 'normal'} + lineClamp={1} > {item.name} @@ -158,16 +159,14 @@ export default function EditChooseMember({ onClose }: { onClose: (val: any) => v {item.Division.map((division) => ( handleCheck(item.id, division.id)} justify='space-between' align='center'> - - {division.name} - + + + {division.name} + +     - { + { router.push(`/announcement/${v.id}`) - }}> - {v.title} - {v.createdAt} - + }} mb={10}> + + {v.title} + + + {v.createdAt} + +     {/* {v.desc} */} { diff --git a/src/module/announcement/ui/navbar_detail_announcement.tsx b/src/module/announcement/ui/navbar_detail_announcement.tsx index 3133ec0..22c538b 100644 --- a/src/module/announcement/ui/navbar_detail_announcement.tsx +++ b/src/module/announcement/ui/navbar_detail_announcement.tsx @@ -11,7 +11,7 @@ export default function NavbarDetailAnnouncement() { const router = useRouter() return ( - setOpenDrawer(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings"> diff --git a/src/module/division_new/ui/create_anggota_division.tsx b/src/module/division_new/ui/create_anggota_division.tsx index aaa10d3..62e9e9c 100644 --- a/src/module/division_new/ui/create_anggota_division.tsx +++ b/src/module/division_new/ui/create_anggota_division.tsx @@ -3,7 +3,7 @@ import { LayoutNavbarNew, SkeletonSingle, WARNA } from '@/module/_global'; import LayoutModal from '@/module/_global/layout/layout_modal'; import { funGetUserByCookies } from '@/module/auth'; import { funGetAllmember, TypeUser } from '@/module/user'; -import { Avatar, Box, Button, Divider, Group, rem, Stack, Text, TextInput } from '@mantine/core'; +import { Avatar, Box, Button, Divider, Flex, Grid, Group, rem, Stack, Text, TextInput } from '@mantine/core'; import { useParams, useRouter } from 'next/navigation'; import React, { useState } from 'react'; import toast from 'react-hot-toast'; @@ -103,56 +103,63 @@ export default function CreateAnggotaDivision() { />     - {loading ? - Array(8) - .fill(null) - .map((_, i) => ( + {loading ? + Array(8) + .fill(null) + .map((_, i) => ( - + - )) + )) : - {dataMember.map((v: any, index: any) => { - const isSelected = selectedFiles.some((i: any) => i.idUser == dataMember[index].id) - const found = memberDb.some((i: any) => i.idUser == v.id) - return ( - (!found) ? handleFileClick(index) : null}> - - - - - {v.name} - {(found) ? "sudah menjadi anggota divisi" : ""} - - - {isSelected ? : null} - - - + {dataMember.map((v: any, index: any) => { + const isSelected = selectedFiles.some((i: any) => i.idUser == dataMember[index].id) + const found = memberDb.some((i: any) => i.idUser == v.id) + return ( + (!found) ? handleFileClick(index) : null}> + + + + + + + + {v.name} + {(found) ? "sudah menjadi anggota divisi" : ""} + + {isSelected ? : null} + + + + + + - - ) - })} - + ) + })} + } - - - + + + setOpen(false)} description="Apakah Anda yakin ingin menambahkan anggota divisi?" onYes={(val) => { diff --git a/src/module/division_new/ui/information_division.tsx b/src/module/division_new/ui/information_division.tsx index 0aca711..87419da 100644 --- a/src/module/division_new/ui/information_division.tsx +++ b/src/module/division_new/ui/information_division.tsx @@ -1,6 +1,6 @@ "use client" import { LayoutDrawer, LayoutNavbarNew, SkeletonSingle, WARNA } from '@/module/_global'; -import { ActionIcon, Avatar, Box, Button, Divider, Flex, Group, Skeleton, Stack, Text } from '@mantine/core'; +import { ActionIcon, Avatar, Box, Button, Divider, Flex, Grid, Group, Skeleton, Stack, Text } from '@mantine/core'; import { useShallowEffect } from '@mantine/hooks'; import { useParams, useRouter } from 'next/navigation'; import React, { useState } from 'react'; @@ -184,24 +184,28 @@ export default function InformationDivision() { : member.map((v, i) => { return ( - { onClickMember(v.id, (v.isAdmin) ? true : false), setChooseMemberName(v.name) }} > - - - - - {v.name} - - - - - {(v.isAdmin) ? 'Admin' : 'Anggota'} - - + + + + + + {v.name} + + + + + + + {(v.isAdmin) ? 'Admin' : 'Anggota'} + + + diff --git a/src/module/division_new/ui/list_division.tsx b/src/module/division_new/ui/list_division.tsx index 355865c..1312068 100644 --- a/src/module/division_new/ui/list_division.tsx +++ b/src/module/division_new/ui/list_division.tsx @@ -150,26 +150,45 @@ export default function ListDivision() { data?.map((v: any, i: any) => { return ( - router.push(`/division/${v.id}`)}> - -
    - - - -
    - {v.name} -     -     + + + router.push(`/division/${v.id}`)}> +
    + + + +
    +     +     + + + + + {v.name} + + + + +     ); @@ -193,8 +212,8 @@ export default function ListDivision() { router.push(`/division/${v.id}`)}> - - {v.name} + + {v.name} diff --git a/src/module/home/ui/list_divisi.tsx b/src/module/home/ui/list_divisi.tsx index 4788aa5..60cd98d 100644 --- a/src/module/home/ui/list_divisi.tsx +++ b/src/module/home/ui/list_divisi.tsx @@ -63,8 +63,8 @@ export default function ListDivisi() { router.push(`/division/${v.id}`)}> - - {v.name} + + {v.name} diff --git a/src/module/home/ui/list_project.tsx b/src/module/home/ui/list_project.tsx index c705869..458261b 100644 --- a/src/module/home/ui/list_project.tsx +++ b/src/module/home/ui/list_project.tsx @@ -62,8 +62,8 @@ export default function ListProjects() { router.push(`/project/${v.id}`)}> - - {v.title} + + {v.title} diff --git a/src/module/project/ui/list_project.tsx b/src/module/project/ui/list_project.tsx index 38d442c..476583a 100644 --- a/src/module/project/ui/list_project.tsx +++ b/src/module/project/ui/list_project.tsx @@ -121,35 +121,50 @@ export default function ListProject() { {isData.map((v, i) => { return ( - router.push(`/project/${v.id}`)}> - -
    - - - -
    - {v.title} -     - - - -     + + + router.push(`/project/${v.id}`)}> +
    + + + +
    +     +     + + + + + + {v.title} + + + {/* */} + + + + + +     ); @@ -163,8 +178,8 @@ export default function ListProject() { router.push(`/project/${v.id}`)}> - - {v.title} + + {v.title} diff --git a/src/module/user/member/ui/tab_list_member.tsx b/src/module/user/member/ui/tab_list_member.tsx index 5f1681f..1e57554 100644 --- a/src/module/user/member/ui/tab_list_member.tsx +++ b/src/module/user/member/ui/tab_list_member.tsx @@ -1,6 +1,6 @@ import { SkeletonSingle, WARNA } from "@/module/_global" -import { Box, Group, ActionIcon, Text, TextInput, Divider, Avatar } from "@mantine/core" +import { Box, Group, ActionIcon, Text, TextInput, Divider, Avatar, Grid } from "@mantine/core" import { useShallowEffect } from "@mantine/hooks" import { useRouter, useSearchParams } from "next/navigation" import { useEffect, useState } from "react" @@ -104,17 +104,18 @@ export default function TabListMember() { { router.push(`/member/${v.id}`) }}> - - + + - - + + {_.startCase(v.name)} {v.group + ' - ' + v.position} - - + +