style : update style

Deskripsi:
- update style home
- update validasi jabatan

No Issue

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

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 (
     <Box>
-      <Drawer opened={opened} title={<Text c={tema.get().utama} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '40%'}
+      <Drawer opened={opened} title={<Text c={tema.get().utama} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '40%' }
         styles={{
           content: {
             backgroundColor: "white",

src/module/division_new/ui/list_task.tsx

@@ -66,7 +66,7 @@ export default function ListTaskOnDetailDivision() {
                      : <></>
             }
          </Group>
-         <Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}>
+         <Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withControls={false}>
             {data.map((v, i) =>
                <Carousel.Slide key={v.id}>
                   <Box p={20} w={{

src/module/home/ui/list_divisi.tsx

@@ -59,9 +59,9 @@ export default function ListDivisi() {
                      <Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada divisi</Text>
                   </Box>
                   :
-                  <Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}>
+                  <Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withControls={false}>
                      {isData.map((v) =>
-                        <Carousel.Slide key={v.id}>
+                        <Carousel.Slide key={v.id} pb={20}>
                            <Box w={{
                              base: isMobile ? 230 : 300,
                               md: 400

src/module/home/ui/list_project.tsx

@@ -59,9 +59,9 @@ export default function ListProjects() {
                      <Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada kegiatan terbaru</Text>
                   </Box>
                   :
-                  <Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}>
+                  <Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"}  withControls={false}>
                      {isData.map((v) =>
-                        <Carousel.Slide key={v.id}>
+                        <Carousel.Slide key={v.id} pb={20}>
                            <Box w={{
                               base: isMobile ? 230 : 300,
                               md: 400

src/module/position/ui/drawer_detail_position.tsx

@@ -96,6 +96,23 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
       getOneData()
    }, [refresh.get()])
 
+   function onCheck() {
+      if (Object.values(touched).some((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 ?
                   <Box>
                      <Skeleton height={40} mt={6} radius={10} />
-                     <Skeleton height={40} mt={15} radius={10} />
                   </Box>
                   :
                   <Box>
@@ -172,16 +188,14 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
                         required
                         size="md"
                         value={String(data.name)}
-                        onChange={(e) => {
+                        onChange={(e) => { onValidation('name', e.target.value) }}
-                           setData({ ...data, name: e.target.value })
-                           setTouched({ ...touched, name: false })
-                        }}
                         onBlur={() => setTouched({ ...touched, name: true })}
                         error={
-                           touched.name && (
+                           touched.name &&
-                              data.name == "" ? "Nama Jabatan Tidak Boleh Kosong" : null
+                           (data.name == "" ? "Error! harus memasukkan Nama Jabatan" :
+                              data.name.length < 3 ? "Masukkan Minimal 3 karakter" : ""
                            )
-                        }
+                         }
                         radius={10}
                         placeholder="Nama Jabatan"
                      />

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 (
       <Box>
          <Stack pt={10}>
@@ -102,9 +126,9 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
          </Stack>
          <LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'Tambah Jabatan'} size="lg">
             <Box pt={10} pos={"relative"} h={{
-               base: "69vh",
+               base: "65vh",
-               sm: "69vh",
+               sm: "67vh",
-               lg: "69vh",
+               lg: "67vh",
                xl: "70vh"
                
             }}>
@@ -125,13 +149,9 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
                      radius={10}
                      mb={5}
                      withAsterisk
-                     onChange={(val: any) => {
+                     onChange={(e: any) => 
-                        setListData({
+                        { onValidation('idGroup', e) }
-                           ...listData,
+                     }
-                           idGroup: val
-                        })
-                        setTouched({ ...touched, idGroup: false })
-                     }}
                      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 })}
                   />
                }
                <TextInput
@@ -159,22 +177,15 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
                   }}
                   my={15}
                   size="md"
-                  onChange={(event: any) => {
+                  onChange={(e) => { onValidation('name', e.target.value) }}
-                     setListData({
-                        ...listData,
-                        name: event.target.value
-                     })
-                     setTouched({ ...touched, name: false })
-                  }}
                   radius={10}
                   placeholder="Nama Jabatan"
                   error={
-                     touched.name && (
+                     touched.name &&
-                        listData.name == "" ? "Nama Jabatan Tidak Boleh Kosong" : null
+                     (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
                />
                <Box pos={"absolute"} bottom={10} left={0} right={0}>
@@ -184,7 +195,7 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
                      size="lg"
                      radius={30}
                      fullWidth
-                     onClick={onSubmit}
+                     onClick={() => { onCheck() }}
                   >
                      SIMPAN
                   </Button>