From c67b1b8a376d0f87728abd51550ba013376d6a66 Mon Sep 17 00:00:00 2001 From: lukman Date: Mon, 30 Sep 2024 10:47:49 +0800 Subject: [PATCH 1/2] style : update style Deskripsi: - update style home - update validasi jabatan No Issue --- src/app/api/home/notification/route.ts | 1 + src/module/_global/layout/layout_drawer.tsx | 2 +- src/module/division_new/ui/list_task.tsx | 2 +- src/module/home/ui/list_divisi.tsx | 4 +- src/module/home/ui/list_project.tsx | 4 +- .../position/ui/drawer_detail_position.tsx | 30 ++++++--- .../position/ui/drawer_list_position.tsx | 61 +++++++++++-------- 7 files changed, 65 insertions(+), 39 deletions(-) diff --git a/src/app/api/home/notification/route.ts b/src/app/api/home/notification/route.ts index 80213ce..0aebe27 100644 --- a/src/app/api/home/notification/route.ts +++ b/src/app/api/home/notification/route.ts @@ -3,6 +3,7 @@ import { funGetUserByCookies } from "@/module/auth"; import { createLogUser } from "@/module/user"; import _ from "lodash"; import moment from "moment"; +import "moment/locale/id"; import { NextResponse } from "next/server"; // GET ALL NOTIFIKASI diff --git a/src/module/_global/layout/layout_drawer.tsx b/src/module/_global/layout/layout_drawer.tsx index 31a31f2..804a922 100644 --- a/src/module/_global/layout/layout_drawer.tsx +++ b/src/module/_global/layout/layout_drawer.tsx @@ -8,7 +8,7 @@ export default function LayoutDrawer({ opened, onClose, title, children, size }: const tema = useHookstate(TEMA) return ( - {title}} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '40%'} + {title}} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '40%' } styles={{ content: { backgroundColor: "white", diff --git a/src/module/division_new/ui/list_task.tsx b/src/module/division_new/ui/list_task.tsx index b989569..892d35b 100644 --- a/src/module/division_new/ui/list_task.tsx +++ b/src/module/division_new/ui/list_task.tsx @@ -66,7 +66,7 @@ export default function ListTaskOnDetailDivision() { : <> } - + {data.map((v, i) => Tidak ada divisi : - + {isData.map((v) => - + Tidak ada kegiatan terbaru : - + {isData.map((v) => - + v == true)) + return false + onSubmit() + } + + function onValidation(kategori: string, val: string) { + if (kategori == 'name') { + setData({...data, name: val}) + if (val == "" || val.length < 3) { + setTouched({ ...touched, name: true }) + } else { + setTouched({ ...touched, name: false }) + } + } + } + async function nonActive(val: boolean) { try { if (val) { @@ -156,7 +173,6 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: { {loading ? - : @@ -172,16 +188,14 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: { required size="md" value={String(data.name)} - onChange={(e) => { - setData({ ...data, name: e.target.value }) - setTouched({ ...touched, name: false }) - }} + onChange={(e) => { onValidation('name', e.target.value) }} onBlur={() => setTouched({ ...touched, name: true })} error={ - touched.name && ( - data.name == "" ? "Nama Jabatan Tidak Boleh Kosong" : null + touched.name && + (data.name == "" ? "Error! harus memasukkan Nama Jabatan" : + data.name.length < 3 ? "Masukkan Minimal 3 karakter" : "" ) - } + } radius={10} placeholder="Nama Jabatan" /> diff --git a/src/module/position/ui/drawer_list_position.tsx b/src/module/position/ui/drawer_list_position.tsx index 283b4ee..fdb4485 100644 --- a/src/module/position/ui/drawer_list_position.tsx +++ b/src/module/position/ui/drawer_list_position.tsx @@ -73,6 +73,30 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo } } + function onCheck() { + if (Object.values(touched).some((v) => v == true)) + return false + onSubmit() + } + + function onValidation(kategori: string, val: string) { + if (kategori == 'name') { + setListData({...listData, name: val}) + if (val == "" || val.length < 3) { + setTouched({ ...touched, name: true }) + } else { + setTouched({ ...touched, name: false }) + } + } else if (kategori == 'idGroup') { + setListData({ ...listData, idGroup: val }) + if (val == "") { + setTouched({ ...touched, idGroup: true }) + } else { + setTouched({ ...touched, idGroup: false }) + } + } + } + return ( @@ -102,9 +126,9 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo setOpenDrawerGroup(false)} title={'Tambah Jabatan'} size="lg"> @@ -125,13 +149,9 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo radius={10} mb={5} withAsterisk - onChange={(val: any) => { - setListData({ - ...listData, - idGroup: val - }) - setTouched({ ...touched, idGroup: false }) - }} + onChange={(e: any) => + { onValidation('idGroup', e) } + } styles={{ input: { color: tema.get().utama, @@ -144,8 +164,6 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo listData.idGroup == "" ? "Grup Tidak Boleh Kosong" : null ) } - onFocus={() => setTouched({ ...touched, idGroup: true })} - onBlur={() => setTouched({ ...touched, idGroup: true })} /> } { - setListData({ - ...listData, - name: event.target.value - }) - setTouched({ ...touched, name: false }) - }} + onChange={(e) => { onValidation('name', e.target.value) }} radius={10} placeholder="Nama Jabatan" error={ - touched.name && ( - listData.name == "" ? "Nama Jabatan Tidak Boleh Kosong" : null + touched.name && + (listData.name == "" ? "Error! harus memasukkan Nama Jabatan" : + listData.name.length < 3 ? "Masukkan Minimal 3 karakter" : "" ) - } - onFocus={() => setTouched({ ...touched, name: true })} - onBlur={() => setTouched({ ...touched, name: true })} + } required /> @@ -184,7 +195,7 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo size="lg" radius={30} fullWidth - onClick={onSubmit} + onClick={() => { onCheck() }} > SIMPAN From 75c5a0039d7a96a9da3f9a048167de74fce33129 Mon Sep 17 00:00:00 2001 From: lukman Date: Mon, 30 Sep 2024 11:29:33 +0800 Subject: [PATCH 2/2] style : update style --- .../calender/ui/detail_event_division.tsx | 17 ++++----- .../division_new/ui/information_division.tsx | 9 ++--- .../ui/list_anggota_detail_project.tsx | 34 +++++++++--------- .../task/ui/detail_list_anggota_task.tsx | 36 +++++++++---------- 4 files changed, 47 insertions(+), 49 deletions(-) diff --git a/src/module/calender/ui/detail_event_division.tsx b/src/module/calender/ui/detail_event_division.tsx index 249dcf1..8115cbc 100644 --- a/src/module/calender/ui/detail_event_division.tsx +++ b/src/module/calender/ui/detail_event_division.tsx @@ -320,7 +320,7 @@ export default function DetailEventDivision() { - + ))} @@ -365,7 +365,7 @@ export default function DetailEventDivision() { lg: 1, xl: 1, }}> - + - - - {v.name} - - {v.email} - - - + {v.name} + {v.email} diff --git a/src/module/division_new/ui/information_division.tsx b/src/module/division_new/ui/information_division.tsx index 5f014cf..9c8119e 100644 --- a/src/module/division_new/ui/information_division.tsx +++ b/src/module/division_new/ui/information_division.tsx @@ -31,6 +31,7 @@ export default function InformationDivision() { const roleLogin = useHookstate(globalRole) const [isAdmin, setAdmin] = useState(false) const isMobile = useMediaQuery('(max-width: 455px)'); + const isMobile2 = useMediaQuery("(max-width: 438px)"); const tema = useHookstate(TEMA) async function getOneData() { @@ -164,8 +165,8 @@ export default function InformationDivision() { ((roleLogin.get() != 'user' && roleLogin.get() != 'coadmin') || isAdmin) ? router.push('/division/add-member/' + param.id)}> - - + + Tambah Anggota @@ -194,10 +195,10 @@ export default function InformationDivision() { }} > - + - + {v.name} diff --git a/src/module/project/ui/list_anggota_detail_project.tsx b/src/module/project/ui/list_anggota_detail_project.tsx index a02ab60..ed459c4 100644 --- a/src/module/project/ui/list_anggota_detail_project.tsx +++ b/src/module/project/ui/list_anggota_detail_project.tsx @@ -1,6 +1,6 @@ 'use client' -import { globalRole, LayoutDrawer, SkeletonSingle, TEMA } from '@/module/_global'; -import { Avatar, Box, Flex, Grid, Group, SimpleGrid, Stack, Text } from '@mantine/core'; +import { globalRole, LayoutDrawer, SkeletonList, SkeletonSingle, TEMA } from '@/module/_global'; +import { Avatar, Box, Divider, Flex, Grid, Group, SimpleGrid, Stack, Text } from '@mantine/core'; import React, { useState } from 'react'; import { funDeleteMemberProject, funGetOneProjectById } from '../lib/api_project'; import toast from 'react-hot-toast'; @@ -24,6 +24,7 @@ export default function ListAnggotaDetailProject() { const roleLogin = useHookstate(globalRole) const tema = useHookstate(TEMA) const [reason, setReason] = useState("") + const isMobile2 = useMediaQuery("(max-width: 438px)"); async function getOneDataCancel() { try { @@ -83,7 +84,7 @@ export default function ListAnggotaDetailProject() { toast.error("Gagal menghapus anggota Kegiatan, coba lagi nanti"); } } -const isMobile = useMediaQuery('(max-width: 369px)'); + const isMobile = useMediaQuery('(max-width: 369px)'); return ( @@ -107,7 +108,7 @@ const isMobile = useMediaQuery('(max-width: 369px)'); .fill(null) .map((_, i) => ( - + )) : @@ -123,19 +124,15 @@ const isMobile = useMediaQuery('(max-width: 369px)'); : setOpenDrawer(false) }} > - - - - - - {v.name} - {v.email} - - - + + + + + {v.name} + {v.email} @@ -143,6 +140,9 @@ const isMobile = useMediaQuery('(max-width: 369px)'); + + + ); })} diff --git a/src/module/task/ui/detail_list_anggota_task.tsx b/src/module/task/ui/detail_list_anggota_task.tsx index 71c1357..2751d75 100644 --- a/src/module/task/ui/detail_list_anggota_task.tsx +++ b/src/module/task/ui/detail_list_anggota_task.tsx @@ -1,6 +1,6 @@ 'use client' -import { globalRole, LayoutDrawer, SkeletonSingle, TEMA } from "@/module/_global"; -import { Box, Group, Flex, Avatar, Text, SimpleGrid, Stack, Grid } from "@mantine/core"; +import { globalRole, LayoutDrawer, SkeletonList, SkeletonSingle, TEMA } from "@/module/_global"; +import { Box, Group, Flex, Avatar, Text, SimpleGrid, Stack, Grid, Divider } from "@mantine/core"; import { useMediaQuery, useShallowEffect } from "@mantine/hooks"; import { useParams, useRouter } from "next/navigation"; import { useState } from "react"; @@ -25,6 +25,7 @@ export default function ListAnggotaDetailTask() { const roleLogin = useHookstate(globalRole) const adminLogin = useHookstate(globalIsAdminDivision) const isMobile = useMediaQuery('(max-width: 369px)'); + const isMobile2 = useMediaQuery("(max-width: 438px)"); const tema = useHookstate(TEMA) const [reason, setReason] = useState("") @@ -109,7 +110,7 @@ export default function ListAnggotaDetailTask() { .fill(null) .map((_, i) => ( - + )) : @@ -121,23 +122,19 @@ export default function ListAnggotaDetailTask() { onClick={() => { setDataChoose({ id: v.idUser, name: v.name }) reason == null ? - setOpenDrawer(true) - : setOpenDrawer(false) + setOpenDrawer(true) + : setOpenDrawer(false) }} > - - - - - - {v.name} - {v.email} - - - + + + + + {v.name} + {v.email} @@ -145,6 +142,9 @@ export default function ListAnggotaDetailTask() { + + + ); })}