upd:

pembatasan jika bukan member divisi pada fitur tugas divisi

No Issues

src/module/division_new/index.ts

@@ -15,7 +15,7 @@ import EditDivision from './ui/edit_division';
 import CreateReport from './ui/create_report';
 import ReportDivisionId from './ui/report_division_id';
 import { funGetDivisionById, funGetListDivisionByIdDivision, funGetSearchMemberDivision } from './lib/api_division';
-import { globalIsAdminDivision } from './lib/val_division';
+import { globalIsAdminDivision, globalIsMemberDivision } from './lib/val_division';
 import WrapLayoutDivision from './ui/wrap_division';
 import TabListDivision from './ui/tab_list_division';
 import NavbarListDivision from './ui/navbar_list_division';
@@ -39,7 +39,7 @@ export { ReportDivisionId }
 export { funGetDivisionById }
 export { funGetListDivisionByIdDivision }
 export { funGetSearchMemberDivision }
-export { globalIsAdminDivision }
+export { globalIsAdminDivision, globalIsMemberDivision }
 export { WrapLayoutDivision }
 export { TabListDivision }
 export { NavbarListDivision }

src/module/division_new/lib/val_division.ts

@@ -3,3 +3,4 @@ import { IFormMemberDivision } from "./type_division";
 
 export const globalMemberDivision = hookstate<IFormMemberDivision[]>([]);
 export const globalIsAdminDivision = hookstate<boolean>(false)
+export const globalIsMemberDivision = hookstate<boolean>(false)

src/module/division_new/ui/wrap_division.tsx

@@ -1,20 +1,23 @@
 'use client'
 import { useHookstate } from "@hookstate/core";
 import { useShallowEffect } from "@mantine/hooks";
-import { globalIsAdminDivision } from "../lib/val_division";
+import { globalIsAdminDivision, globalIsMemberDivision } from "../lib/val_division";
 import { funGetDivisionById } from "../lib/api_division";
 import { useParams } from "next/navigation";
 import { funGetUserByCookies } from "@/module/auth";
 
 export default function WrapLayoutDivision({ children }: { children: React.ReactNode }) {
    const isAdmin = useHookstate(globalIsAdminDivision)
+   const isMember = useHookstate(globalIsMemberDivision)
    const param = useParams<{ id: string }>()
 
    const getData = async () => {
       const res = await funGetDivisionById(param.id);
       const login = await funGetUserByCookies()
       const cek = res.data.member.some((i: any) => i.idUser == login.id && i.isAdmin == true)
+      const cekMember = res.data.member.some((i: any) => i.idUser == login.id)
       isAdmin.set(cek)
+      isMember.set(cekMember)
    }
 
    useShallowEffect(() => {

src/module/task/ui/detail_list_file_task.tsx

@@ -1,5 +1,5 @@
 'use client'
-import { keyWibu, LayoutDrawer, LayoutModalViewFile, TEMA } from "@/module/_global";
+import { globalRole, keyWibu, LayoutDrawer, LayoutModalViewFile, TEMA } from "@/module/_global";
 import LayoutModal from "@/module/_global/layout/layout_modal";
 import { useHookstate } from "@hookstate/core";
 import { Box, Center, Flex, Grid, Group, SimpleGrid, Skeleton, Stack, Text } from "@mantine/core";
@@ -12,8 +12,11 @@ import { FaTrash } from "react-icons/fa6";
 import { useWibuRealtime } from "wibu-realtime";
 import { funDeleteFileTask, funGetTaskDivisionById } from "../lib/api_task";
 import { IDataFileTaskDivision } from "../lib/type_task";
+import { globalIsMemberDivision } from "@/module/division_new";
 
 export default function ListFileDetailTask() {
+   const roleLogin = useHookstate(globalRole)
+   const memberDivision = useHookstate(globalIsMemberDivision)
    const [isData, setData] = useState<IDataFileTaskDivision[]>([])
    const [loading, setLoading] = useState(true)
    const param = useParams<{ id: string, detail: string }>()
@@ -193,19 +196,22 @@ export default function ListFileDetailTask() {
                            <Text c={tema.get().utama}>Lihat file</Text>
                         </Box>
                      </Flex>
-
+                     {
-                     <Flex onClick={() => {
+                        (roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberDivision.get() ? <></>
-                        reason == null ?
+                           :
-                           setOpenModal(true)
+                           <Flex onClick={() => {
-                           : setOpenModal(false)
+                              reason == null ?
-                     }} justify={'center'} align={'center'} direction={'column'} >
+                                 setOpenModal(true)
-                        <Box>
+                                 : setOpenModal(false)
-                           <FaTrash size={30} color={reason == null ? tema.get().utama : "gray"} />
+                           }} justify={'center'} align={'center'} direction={'column'} >
-                        </Box>
+                              <Box>
-                        <Box>
+                                 <FaTrash size={30} color={reason == null ? tema.get().utama : "gray"} />
-                           <Text c={reason == null ? tema.get().utama : "gray"}>Hapus file</Text>
+                              </Box>
-                        </Box>
+                              <Box>
-                     </Flex>
+                                 <Text c={reason == null ? tema.get().utama : "gray"}>Hapus file</Text>
+                              </Box>
+                           </Flex>
+                     }
                   </SimpleGrid>
                </Stack>
             </Box>

src/module/task/ui/detail_list_tugas_task.tsx

@@ -1,8 +1,8 @@
 'use client'
-import { keyWibu, LayoutDrawer, SkeletonDetailListTugasTask, TEMA } from "@/module/_global"
+import { globalRole, keyWibu, LayoutDrawer, SkeletonDetailListTugasTask, TEMA } from "@/module/_global"
 import LayoutModal from "@/module/_global/layout/layout_modal"
 import { useHookstate } from "@hookstate/core"
-import { Box, Center, Checkbox, Divider, Flex, Grid, Group, SimpleGrid, Stack, Text } from "@mantine/core"
+import { Box, Center, Checkbox, Divider, Flex, Grid, Group, SimpleGrid, Stack, Text, Loader } from "@mantine/core"
 import { useShallowEffect } from "@mantine/hooks"
 import "moment/locale/id"
 import { useParams, useRouter } from "next/navigation"
@@ -14,8 +14,11 @@ import { useWibuRealtime } from "wibu-realtime"
 import { funDeleteDetailTask, funGetTaskDivisionById, funUpdateStatusDetailTask } from "../lib/api_task"
 import { IDataListTaskDivision } from "../lib/type_task"
 import { globalRefreshTask, valStatusDetailTask } from "../lib/val_task"
+import { globalIsMemberDivision } from "@/module/division_new"
 
 export default function ListTugasDetailTask() {
+   const roleLogin = useHookstate(globalRole)
+   const memberDivision = useHookstate(globalIsMemberDivision)
    const [openDrawer, setOpenDrawer] = useState(false)
    const [openDrawerStatus, setOpenDrawerStatus] = useState(false)
    const [isOpenModal, setOpenModal] = useState(false)
@@ -29,6 +32,8 @@ export default function ListTugasDetailTask() {
    const refresh = useHookstate(globalRefreshTask)
    const tema = useHookstate(TEMA)
    const [reason, setReason] = useState("")
+   const [loadingStatus, setLoadingStatus] = useState(false)
+   const [pilihStatus, setPilihStatus] = useState(0)
    const [dataRealTime, setDataRealtime] = useWibuRealtime({
       WIBU_REALTIME_TOKEN: keyWibu,
       project: "sdm"
@@ -105,6 +110,8 @@ export default function ListTugasDetailTask() {
 
    async function onUpdateStatus(val: number) {
       try {
+         setPilihStatus(val)
+         setLoadingStatus(true)
          const res = await funUpdateStatusDetailTask(idData, { status: val, idProject: param.detail });
          if (res.success) {
             setDataRealtime([{
@@ -123,6 +130,9 @@ export default function ListTugasDetailTask() {
       } catch (error) {
          console.error(error);
          toast.error("Gagal mengubah status tugas divisi, coba lagi nanti");
+      } finally {
+         setLoadingStatus(false)
+         setOpenModal(false)
       }
    }
 
@@ -162,11 +172,15 @@ export default function ListTugasDetailTask() {
                         return (
                            <Box key={index}>
                               <Box onClick={() => {
-                                 setIdData(item.id)
+                                 if ((roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberDivision.get()) {
-                                 setStatusData(item.status)
+                                    setOpenDrawer(false)
-                                 reason == null ?
+                                 } else {
-                                    setOpenDrawer(true)
+                                    setIdData(item.id)
-                                    : setOpenDrawer(false)
+                                    setStatusData(item.status)
+                                    reason == null ?
+                                       setOpenDrawer(true)
+                                       : setOpenDrawer(false)
+                                 }
                               }} my={18}>
                                  <Checkbox color="teal" size="md" checked={(item.status === 1) ? true : false} disabled
                                     label={item.status === 1 ? 'Sudah Selesai' : 'Belum Selesai'}
@@ -283,7 +297,11 @@ export default function ListTugasDetailTask() {
                {
                   valStatusDetailTask.map((item, index) => {
                      return (
-                        <Box key={index} onClick={() => { onUpdateStatus(item.value) }}>
+                        <Box key={index} onClick={() => {
+                           if (!loadingStatus) {
+                              onUpdateStatus(item.value)
+                           }
+                        }}>
                            <Flex justify={"space-between"} align={"center"}>
                               <Group>
                                  <Text style={{
@@ -302,7 +320,11 @@ export default function ListTugasDetailTask() {
                                     paddingLeft: 20,
                                  }}
                               >
-                                 {statusData === item.value ? <FaCheck style={{ marginRight: 10 }} /> : ""}
+                                 {
+                                    loadingStatus && pilihStatus == item.value ? <Loader color="gray" size="sm" style={{ marginRight: 10 }} />
+                                       :
+                                       statusData === item.value ? <FaCheck style={{ marginRight: 10 }} /> : ""
+                                 }
                               </Text>
                            </Flex>
                            <Divider my={20} />

src/module/task/ui/navbar_detail_division_task.tsx

@@ -1,6 +1,6 @@
 'use client'
 import { globalRole, keyWibu, LayoutDrawer, LayoutNavbarNew, TEMA } from "@/module/_global";
-import { globalIsAdminDivision } from "@/module/division_new";
+import { globalIsAdminDivision, globalIsMemberDivision } from "@/module/division_new";
 import { useHookstate } from "@hookstate/core";
 import { ActionIcon, Box, Flex, SimpleGrid, Stack, Text } from "@mantine/core";
 import { useShallowEffect } from "@mantine/hooks";
@@ -21,6 +21,7 @@ export default function NavbarDetailDivisionTask() {
    const [isOpen, setOpen] = useState(false)
    const roleLogin = useHookstate(globalRole)
    const adminLogin = useHookstate(globalIsAdminDivision)
+   const memberDivision = useHookstate(globalIsMemberDivision)
    const tema = useHookstate(TEMA)
    const [reason, setReason] = useState("")
    const [dataRealTime, setDataRealtime] = useWibuRealtime({
@@ -58,16 +59,17 @@ export default function NavbarDetailDivisionTask() {
    return (
       <>
          <LayoutNavbarNew back={`/division/${param.id}/task/`} title={name} menu={
-            <ActionIcon
+            ((roleLogin.get() == "user" || roleLogin.get() == "coadmin") && !memberDivision.get()) ? <></> :
-               variant="light"
+               <ActionIcon
-               bg={tema.get().bgIcon}
+                  variant="light"
-               size="lg"
+                  bg={tema.get().bgIcon}
-               radius="lg"
+                  size="lg"
-               aria-label="Settings"
+                  radius="lg"
-               onClick={() => { setOpen(true) }}
+                  aria-label="Settings"
-            >
+                  onClick={() => { setOpen(true) }}
-               <HiMenu size={20} color="white" />
+               >
-            </ActionIcon>
+                  <HiMenu size={20} color="white" />
+               </ActionIcon>
          } />