upd: task

Deskripsi:
- role user
- log user

No Issues
This commit is contained in:
amel
2024-09-10 16:49:02 +08:00
parent 6ba2c0fc79
commit 0a8d882078
5 changed files with 93 additions and 73 deletions

View File

@@ -1,5 +1,5 @@
'use client' 'use client'
import { LayoutDrawer, SkeletonSingle, WARNA } from "@/module/_global"; import { globalRole, LayoutDrawer, SkeletonSingle, WARNA } from "@/module/_global";
import { Box, Group, Flex, Avatar, Text, SimpleGrid, Stack, Grid } from "@mantine/core"; import { Box, Group, Flex, Avatar, Text, SimpleGrid, Stack, Grid } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks"; import { useShallowEffect } from "@mantine/hooks";
import { useParams, useRouter } from "next/navigation"; import { useParams, useRouter } from "next/navigation";
@@ -10,6 +10,8 @@ import { IDataMemberTaskDivision } from "../lib/type_task";
import { FaUser } from "react-icons/fa6"; import { FaUser } from "react-icons/fa6";
import { IoIosCloseCircle } from "react-icons/io"; import { IoIosCloseCircle } from "react-icons/io";
import LayoutModal from "@/module/_global/layout/layout_modal"; import LayoutModal from "@/module/_global/layout/layout_modal";
import { useHookstate } from "@hookstate/core";
import { globalIsAdminDivision } from "@/module/division_new";
export default function ListAnggotaDetailTask() { export default function ListAnggotaDetailTask() {
@@ -20,6 +22,8 @@ export default function ListAnggotaDetailTask() {
const [isOpenModal, setOpenModal] = useState(false) const [isOpenModal, setOpenModal] = useState(false)
const [dataChoose, setDataChoose] = useState({ id: '', name: '' }) const [dataChoose, setDataChoose] = useState({ id: '', name: '' })
const router = useRouter() const router = useRouter()
const roleLogin = useHookstate(globalRole)
const adminLogin = useHookstate(globalIsAdminDivision)
async function getOneData() { async function getOneData() {
try { try {
@@ -140,15 +144,18 @@ export default function ListAnggotaDetailTask() {
<Text c={WARNA.biruTua}>Lihat profil</Text> <Text c={WARNA.biruTua}>Lihat profil</Text>
</Box> </Box>
</Flex> </Flex>
{
<Flex onClick={() => { setOpenModal(true) }} justify={'center'} align={'center'} direction={'column'} > (roleLogin.get() != "user" && roleLogin.get() != "coadmin") || adminLogin.get() ?
<Box> <Flex onClick={() => { setOpenModal(true) }} justify={'center'} align={'center'} direction={'column'} >
<IoIosCloseCircle size={30} color={WARNA.biruTua} /> <Box>
</Box> <IoIosCloseCircle size={30} color={WARNA.biruTua} />
<Box> </Box>
<Text c={WARNA.biruTua}>Keluarkan anggota</Text> <Box>
</Box> <Text c={WARNA.biruTua}>Keluarkan anggota</Text>
</Flex> </Box>
</Flex>
: <></>
}
</SimpleGrid> </SimpleGrid>
</Stack> </Stack>
</Box> </Box>

View File

@@ -1,5 +1,5 @@
import { WARNA } from "@/module/_global"; import { WARNA } from "@/module/_global";
import { ActionIcon, Avatar, Badge, Box, Card, Center, Divider, Flex, Grid, Group, Progress, Skeleton, Text, TextInput, Title } from "@mantine/core"; import { ActionIcon, Avatar, Box, Card, Center, Divider, Flex, Grid, Group, Progress, Skeleton, Text, TextInput, Title } from "@mantine/core";
import { useParams, useRouter, useSearchParams } from "next/navigation"; import { useParams, useRouter, useSearchParams } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import { HiMagnifyingGlass, HiMiniPresentationChartBar, HiOutlineListBullet, HiSquares2X2 } from "react-icons/hi2"; import { HiMagnifyingGlass, HiMiniPresentationChartBar, HiOutlineListBullet, HiSquares2X2 } from "react-icons/hi2";
@@ -67,6 +67,7 @@ export default function ListDivisionTask() {
radius={30} radius={30}
leftSection={<HiMagnifyingGlass size={20} />} leftSection={<HiMagnifyingGlass size={20} />}
placeholder="Pencarian" placeholder="Pencarian"
onChange={(val) => setSearchQuery(val.target.value)}
/> />
</Grid.Col> </Grid.Col>
<Grid.Col span={'auto'}> <Grid.Col span={'auto'}>
@@ -181,7 +182,7 @@ export default function ListDivisionTask() {
<Avatar> <Avatar>
<MdAccountCircle size={32} color={WARNA.biruTua} /> <MdAccountCircle size={32} color={WARNA.biruTua} />
</Avatar> </Avatar>
<Avatar>+{v.member - 1}</Avatar> <Avatar>{(v.member == 0) ? "0" : "+" + (v.member - 1)}</Avatar>
</Avatar.Group> </Avatar.Group>
</Group> </Group>
</Box> </Box>

View File

@@ -1,5 +1,5 @@
'use client' 'use client'
import { LayoutDrawer, LayoutNavbarNew, WARNA } from "@/module/_global"; import { globalRole, LayoutDrawer, LayoutNavbarNew, WARNA } from "@/module/_global";
import { ActionIcon, Box, Flex, SimpleGrid, Stack, Text } from "@mantine/core"; import { ActionIcon, Box, Flex, SimpleGrid, Stack, Text } from "@mantine/core";
import { useParams, useRouter } from "next/navigation"; import { useParams, useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
@@ -10,12 +10,16 @@ import { HiMenu } from "react-icons/hi";
import { IoAddCircle } from "react-icons/io5"; import { IoAddCircle } from "react-icons/io5";
import { FaFileCirclePlus, FaPencil, FaUsers } from "react-icons/fa6"; import { FaFileCirclePlus, FaPencil, FaUsers } from "react-icons/fa6";
import { MdCancel } from "react-icons/md"; import { MdCancel } from "react-icons/md";
import { globalIsAdminDivision } from "@/module/division_new";
import { useHookstate } from "@hookstate/core";
export default function NavbarDetailDivisionTask() { export default function NavbarDetailDivisionTask() {
const router = useRouter() const router = useRouter()
const param = useParams<{ id: string, detail: string }>() const param = useParams<{ id: string, detail: string }>()
const [name, setName] = useState('') const [name, setName] = useState('')
const [isOpen, setOpen] = useState(false) const [isOpen, setOpen] = useState(false)
const roleLogin = useHookstate(globalRole)
const adminLogin = useHookstate(globalIsAdminDivision)
async function getOneData() { async function getOneData() {
try { try {
@@ -75,22 +79,6 @@ export default function NavbarDetailDivisionTask() {
</Box> </Box>
</Flex> </Flex>
<Flex justify={'center'} align={'center'} direction={'column'}
style={{
cursor: 'pointer'
}}
onClick={() => {
router.push(param.detail + '/add-member')
}}
>
<Box>
<FaUsers size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua} ta='center'>Tambah anggota</Text>
</Box>
</Flex>
<Flex justify={'center'} align={'center'} direction={'column'} <Flex justify={'center'} align={'center'} direction={'column'}
style={{ style={{
cursor: 'pointer' cursor: 'pointer'
@@ -107,33 +95,51 @@ export default function NavbarDetailDivisionTask() {
</Box> </Box>
</Flex> </Flex>
<Flex justify={'center'} align={'center'} direction={'column'} {
style={{ (roleLogin.get() != "user" && roleLogin.get() != "coadmin") || adminLogin.get() ?
cursor: 'pointer' <>
}} <Flex justify={'center'} align={'center'} direction={'column'}
onClick={() => { router.push(param.detail + '/edit') }} style={{
> cursor: 'pointer'
<Box> }}
<FaPencil size={30} color={WARNA.biruTua} /> onClick={() => { router.push(param.detail + '/add-member') }} >
</Box> <Box>
<Box> <FaUsers size={30} color={WARNA.biruTua} />
<Text c={WARNA.biruTua} ta='center'>Edit</Text> </Box>
</Box> <Box>
</Flex> <Text c={WARNA.biruTua} ta='center'>Tambah anggota</Text>
</Box>
</Flex>
<Flex justify={'center'} align={'center'} direction={'column'}
style={{
cursor: 'pointer'
}}
onClick={() => { router.push(param.detail + '/edit') }} >
<Box>
<FaPencil size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua} ta='center'>Edit</Text>
</Box>
</Flex>
<Flex justify={'center'} align={'center'} direction={'column'}
style={{
cursor: 'pointer'
}}
onClick={() => { router.push(param.detail + '/cancel') }} >
<Box>
<MdCancel size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua} ta='center'>Batal</Text>
</Box>
</Flex>
</> : <></>
}
<Flex justify={'center'} align={'center'} direction={'column'}
style={{
cursor: 'pointer'
}}
onClick={() => { router.push(param.detail + '/cancel') }}
>
<Box>
<MdCancel size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua} ta='center'>Batal</Text>
</Box>
</Flex>
</SimpleGrid> </SimpleGrid>
</Stack> </Stack>

View File

@@ -1,21 +1,27 @@
'use client' 'use client'
import { LayoutDrawer, LayoutNavbarNew, WARNA } from "@/module/_global"; import { globalRole, LayoutDrawer, LayoutNavbarNew, WARNA } from "@/module/_global";
import { ActionIcon } from "@mantine/core"; import { ActionIcon } from "@mantine/core";
import { useState } from "react"; import { useState } from "react";
import { HiMenu } from "react-icons/hi"; import { HiMenu } from "react-icons/hi";
import DrawerDivisionTask from "./drawer_division_task"; import DrawerDivisionTask from "./drawer_division_task";
import { useParams } from "next/navigation"; import { useParams } from "next/navigation";
import { useHookstate } from "@hookstate/core";
import { globalIsAdminDivision } from "@/module/division_new";
export default function NavbarDivisionTask() { export default function NavbarDivisionTask() {
const [openDrawer, setOpenDrawer] = useState(false) const [openDrawer, setOpenDrawer] = useState(false)
const param = useParams<{ id: string}>() const param = useParams<{ id: string }>()
const roleLogin = useHookstate(globalRole)
const adminLogin = useHookstate(globalIsAdminDivision)
return ( return (
<> <>
<LayoutNavbarNew back={`/division/${param.id}`} title="Divisi - Tugas" <LayoutNavbarNew back={`/division/${param.id}`} title="Divisi - Tugas"
menu={ menu={((roleLogin.get() != "user" && roleLogin.get() != "coadmin") || adminLogin.get()) ?
<ActionIcon variant="light" onClick={() => setOpenDrawer(true)} bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings"> <ActionIcon variant="light" onClick={() => setOpenDrawer(true)} bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
<HiMenu size={20} color='white' /> <HiMenu size={20} color='white' />
</ActionIcon> </ActionIcon>
: <></>
} }
/> />
<LayoutDrawer opened={openDrawer} title={'Menu'} onClose={() => setOpenDrawer(false)}> <LayoutDrawer opened={openDrawer} title={'Menu'} onClose={() => setOpenDrawer(false)}>

View File

@@ -17,26 +17,26 @@ export default function TabsDivisionTask() {
const dataStatus = [ const dataStatus = [
{ {
id: "0", id: "0",
title: "Segera", title: "Segera",
icon: <RiProgress3Line style={iconStyle} /> icon: <TbClockPause style={iconStyle} />
}, },
{ {
id: "1", id: "1",
title: "Dikerjakan", title: "Dikerjakan",
icon: <TbClockPause style={iconStyle} /> icon: <RiProgress3Line style={iconStyle} />
}, },
{ {
id: "2", id: "2",
title: "Selesai", title: "Selesai",
icon: <IoIosCheckmarkCircleOutline style={iconStyle} /> icon: <IoIosCheckmarkCircleOutline style={iconStyle} />
}, },
{ {
id: "3", id: "3",
title: "Batal", title: "Batal",
icon: <IoCloseCircleOutline style={iconStyle} /> icon: <IoCloseCircleOutline style={iconStyle} />
} }
] ]
return ( return (
<Box p={20}> <Box p={20}>
@@ -77,7 +77,7 @@ export default function TabsDivisionTask() {
color={ color={
status == item.id status == item.id
? "white" ? "white"
: WARNA.biruTua : (status == null && item.id == "0") ? "white" : WARNA.biruTua
} }
onClick={() => { router.push("?status=" + item.id) }} onClick={() => { router.push("?status=" + item.id) }}
defaultValue={(status == "1" || status == "2" || status == "3") ? status : "0"} defaultValue={(status == "1" || status == "2" || status == "3") ? status : "0"}
@@ -85,7 +85,7 @@ export default function TabsDivisionTask() {
bg={ bg={
status == item.id status == item.id
? "#FF9861" ? "#FF9861"
: "transparent" : (status == null && item.id == "0") ? "#FF9861" : "transparent"
} }
> >
{item.icon} {item.icon}