wibu/desa-darmasaba
1
0
Fork 0
Code Issues Pull Requests 5 Actions Packages Projects Releases Wiki Activity

QC ToolTip Admin Keano Masih di Menu Landing Page - Keamanan, QC Dari Darmasaba Pop Up Notifikasi

Browse Source
This commit is contained in:
nico
2025-11-05 14:32:38 +08:00
parent fb57698dc9
commit f66a46f645
195 changed files with 2819 additions and 3323 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/app/admin/(dashboard)/ppid/struktur-ppid/_lib/layoutTabs.tsx
View File

@@ -1,7 +1,7 @@
/* eslint-disable react-hooks/exhaustive-deps */
'use client'
import colors from '@/con/colors';
import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title, Tooltip } from '@mantine/core';
import { ScrollArea, Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core';
import { IconBuildingCommunity, IconHierarchy2, IconUsers } from '@tabler/icons-react';
import { usePathname, useRouter } from 'next/navigation';
import React, { useEffect, useState } from 'react';
@@ -9,28 +9,25 @@ import React, { useEffect, useState } from 'react';
function LayoutTabs({ children }: { children: React.ReactNode }) {
const router = useRouter();
const pathname = usePathname();
const tabs = [
{
label: "Pegawai",
value: "pegawai",
href: "/admin/ppid/struktur-ppid/pegawai",
icon: <IconUsers size={18} stroke={1.8} />,
tooltip: "Kelola daftar pegawai PPID"
},
{
label: "Posisi Organisasi",
value: "posisiorganisasi",
href: "/admin/ppid/struktur-ppid/posisi-organisasi",
icon: <IconHierarchy2 size={18} stroke={1.8} />,
tooltip: "Kelola posisi dalam struktur organisasi"
},
{
label: "Struktur Organisasi",
value: "strukturorganisasi",
href: "/admin/ppid/struktur-ppid/struktur-organisasi",
icon: <IconBuildingCommunity size={18} stroke={1.8} />,
tooltip: "Kelola struktur organisasi PPID"
}
];
@@ -79,9 +76,9 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
paddingInline: "0.5rem", // ✅ biar nggak nempel ke tepi
}}
>
{tabs.map((tab, i) => (
<Tooltip key={i} label={tab.tooltip} position="bottom" withArrow transitionProps={{ transition: 'pop', duration: 200 }}>
{tabs.map((tab, i) => (
<TabsTab
key={i}
value={tab.value}
leftSection={tab.icon}
style={{
@@ -92,27 +89,26 @@ function LayoutTabs({ children }: { children: React.ReactNode }) {
>
{tab.label}
</TabsTab>
</Tooltip>
))}
</TabsList>
</ScrollArea>
{tabs.map((tab, i) => (
<TabsPanel
key={i}
value={tab.value}
style={{
padding: "1.5rem",
background: "linear-gradient(180deg, #ffffff, #f5f6fa)",
borderRadius: "1rem",
boxShadow: "0 4px 16px rgba(0,0,0,0.05)",
}}
>
{children}
</TabsPanel>
))}
</Tabs>
</Stack>
{tabs.map((tab, i) => (
<TabsPanel
key={i}
value={tab.value}
style={{
padding: "1.5rem",
background: "linear-gradient(180deg, #ffffff, #f5f6fa)",
borderRadius: "1rem",
boxShadow: "0 4px 16px rgba(0,0,0,0.05)",
}}
>
{children}
</TabsPanel>
))}
</Tabs>
</Stack >
);
}

5
src/app/admin/(dashboard)/ppid/struktur-ppid/pegawai/[id]/edit/page.tsx
View File

@@ -13,8 +13,7 @@ import {
Stack,
Text,
TextInput,
Title,
Tooltip
Title
} from '@mantine/core';
import { Dropzone } from '@mantine/dropzone';
import { IconArrowBack, IconPhoto, IconUpload, IconX } from '@tabler/icons-react';
@@ -109,11 +108,9 @@ export default function EditPegawaiPPID() {
return (
<Box px={{ base: 'sm', md: 'lg' }} py="md">
<Group mb="md">
<Tooltip label="Kembali ke halaman sebelumnya" withArrow>
<Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
<IconArrowBack color={colors['blue-button']} size={24} />
</Button>
</Tooltip>
<Title order={4} ml="sm" c="dark">Edit Data Pegawai PPID</Title>
</Group>

6
src/app/admin/(dashboard)/ppid/struktur-ppid/pegawai/[id]/page.tsx
View File

@@ -2,7 +2,7 @@
import { ModalKonfirmasiHapus } from '@/app/admin/(dashboard)/_com/modalKonfirmasiHapus';
import stateStrukturPPID from '@/app/admin/(dashboard)/_state/ppid/struktur_ppid/struktur_PPID';
import colors from '@/con/colors';
import { Box, Button, Group, Image, Paper, Skeleton, Stack, Text, Tooltip } from '@mantine/core';
import { Box, Button, Group, Image, Paper, Skeleton, Stack, Text } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { IconArrowBack, IconEdit, IconTrash } from '@tabler/icons-react';
import { useParams, useRouter } from 'next/navigation';
@@ -149,7 +149,6 @@ function DetailPegawai() {
</Button>
<Group gap="sm" mt="md">
<Tooltip label="Hapus Pegawai" withArrow position="top">
<Button
color="red"
onClick={() => {
@@ -162,9 +161,7 @@ function DetailPegawai() {
>
<IconTrash size={20} />
</Button>
</Tooltip>
<Tooltip label="Edit Pegawai" withArrow position="top">
<Button
color="green"
onClick={() => router.push(`/admin/ppid/struktur-ppid/pegawai/${data.id}/edit`)}
@@ -174,7 +171,6 @@ function DetailPegawai() {
>
<IconEdit size={20} />
</Button>
</Tooltip>
</Group>
</Stack>
</Paper>

4
src/app/admin/(dashboard)/ppid/struktur-ppid/pegawai/create/page.tsx
View File

@@ -3,7 +3,7 @@
import stateStrukturPPID from '@/app/admin/(dashboard)/_state/ppid/struktur_ppid/struktur_PPID';
import colors from '@/con/colors';
import ApiFetch from '@/lib/api-fetch';
import { Box, Button, Group, Image, Paper, Select, Stack, Text, TextInput, Title, Tooltip } from '@mantine/core';
import { Box, Button, Group, Image, Paper, Select, Stack, Text, TextInput, Title } from '@mantine/core';
import { Dropzone } from '@mantine/dropzone';
import { IconArrowBack, IconPhoto, IconUpload, IconX } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
@@ -74,11 +74,9 @@ function CreatePegawaiPPID() {
return (
<Box px={{ base: 'sm', md: 'lg' }} py="md">
<Group mb="md">
<Tooltip label="Kembali ke halaman sebelumnya" withArrow>
<Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
<IconArrowBack color={colors['blue-button']} size={24} />
</Button>
</Tooltip>
<Title order={4} ml="sm" c="dark">
Tambah Pegawai PPID
</Title>

6
src/app/admin/(dashboard)/ppid/struktur-ppid/pegawai/page.tsx
View File

@@ -1,7 +1,7 @@
/* eslint-disable react-hooks/exhaustive-deps */
'use client'
import colors from '@/con/colors';
import { Badge, Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, ThemeIcon, Title, Tooltip } from '@mantine/core';
import { Badge, Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, ThemeIcon, Title } from '@mantine/core';
import { IconCheck, IconDeviceImacCog, IconPlus, IconSearch, IconX } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { useEffect, useState } from 'react';
@@ -58,7 +58,6 @@ function ListPegawaiPPID({ search }: { search: string }) {
<Paper withBorder bg={colors['white-1']} p="lg" shadow="md" radius="md">
<Group justify="space-between" mb="md">
<Title order={4}>Daftar Pegawai PPID</Title>
<Tooltip label="Tambah Pegawai Baru" withArrow>
<Button
leftSection={<IconPlus size={18} />}
color="blue"
@@ -67,7 +66,6 @@ function ListPegawaiPPID({ search }: { search: string }) {
>
Tambah Baru
</Button>
</Tooltip>
</Group>
<Center py="xl">
<Text c="dimmed">Tidak ada data pegawai yang ditemukan</Text>
@@ -81,7 +79,6 @@ function ListPegawaiPPID({ search }: { search: string }) {
<Paper withBorder bg={colors['white-1']} p="lg" shadow="md" radius="md">
<Group justify="space-between" mb="md">
<Title order={4}>Daftar Pegawai PPID</Title>
<Tooltip label="Tambah Pegawai Baru" withArrow>
<Button
leftSection={<IconPlus size={18} />}
color="blue"
@@ -90,7 +87,6 @@ function ListPegawaiPPID({ search }: { search: string }) {
>
Tambah Baru
</Button>
</Tooltip>
</Group>
<Box style={{ overflowX: "auto" }}>
<Table highlightOnHover>

4
src/app/admin/(dashboard)/ppid/struktur-ppid/posisi-organisasi/[id]/page.tsx
View File

@@ -5,7 +5,7 @@
import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
import stateStrukturPPID from '@/app/admin/(dashboard)/_state/ppid/struktur_ppid/struktur_PPID';
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title, Tooltip } from '@mantine/core';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useParams, useRouter } from 'next/navigation';
import { useEffect, useState } from 'react';
@@ -84,11 +84,9 @@ function EditPosisiOrganisasiPPID() {
return (
<Box px={{ base: 'sm', md: 'lg' }} py="md">
<Group mb="md">
<Tooltip label="Kembali ke halaman sebelumnya" withArrow>
<Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
<IconArrowBack color={colors['blue-button']} size={24} />
</Button>
</Tooltip>
<Title order={4} ml="sm" c="dark">
Edit Posisi Organisasi PPID
</Title>

4
src/app/admin/(dashboard)/ppid/struktur-ppid/posisi-organisasi/create/page.tsx
View File

@@ -3,7 +3,7 @@
import CreateEditor from '@/app/admin/(dashboard)/_com/createEditor';
import stateStrukturPPID from '@/app/admin/(dashboard)/_state/ppid/struktur_ppid/struktur_PPID';
import colors from '@/con/colors';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title, Tooltip } from '@mantine/core';
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
import { IconArrowBack } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
import { useEffect } from 'react';
@@ -51,11 +51,9 @@ function CreatePosisiOrganisasiPPID() {
return (
<Box px={{ base: 'sm', md: 'lg' }} py="md">
<Group mb="md">
<Tooltip label="Kembali ke halaman sebelumnya" withArrow>
<Button variant="subtle" onClick={() => router.back()} p="xs" radius="md">
<IconArrowBack color={colors['blue-button']} size={24} />
</Button>
</Tooltip>
<Title order={4} ml="sm" c="dark">
Tambah Posisi Organisasi PPID
</Title>

8
src/app/admin/(dashboard)/ppid/struktur-ppid/posisi-organisasi/page.tsx
View File

@@ -1,6 +1,6 @@
'use client'
import colors from '@/con/colors';
import { Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title, Tooltip } from '@mantine/core';
import { Box, Button, Center, Group, Pagination, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { IconEdit, IconPlus, IconSearch, IconTrash } from '@tabler/icons-react';
import { useRouter } from 'next/navigation';
@@ -67,7 +67,6 @@ function ListPosisiOrganisasiPPID({ search }: { search: string }) {
<Paper withBorder bg={colors['white-1']} p="lg" shadow="md" radius="md">
<Group justify="space-between" mb="md">
<Title order={4}>Daftar Posisi Organisasi PPID</Title>
<Tooltip label="Tambah Posisi Organisasi" withArrow>
<Button
leftSection={<IconPlus size={18} />}
color="blue"
@@ -76,7 +75,6 @@ function ListPosisiOrganisasiPPID({ search }: { search: string }) {
>
Tambah Baru
</Button>
</Tooltip>
</Group>
<Box style={{ overflowX: 'auto' }}>
<Table highlightOnHover>
@@ -105,7 +103,6 @@ function ListPosisiOrganisasiPPID({ search }: { search: string }) {
<Text>{item.hierarki || '-'}</Text>
</TableTd>
<TableTd style={{ width: '20%' }}>
<Tooltip label="Edit" withArrow>
<Button
variant="light"
color="green"
@@ -114,10 +111,8 @@ function ListPosisiOrganisasiPPID({ search }: { search: string }) {
>
<IconEdit size={18} />
</Button>
</Tooltip>
</TableTd>
<TableTd style={{ width: '20%' }}>
<Tooltip label="Hapus" withArrow>
<Button
variant="light"
color="red"
@@ -129,7 +124,6 @@ function ListPosisiOrganisasiPPID({ search }: { search: string }) {
>
<IconTrash size={18} />
</Button>
</Tooltip>
</TableTd>
</TableTr>
))

4
src/app/admin/(dashboard)/ppid/struktur-ppid/struktur-organisasi/page.tsx
View File

@@ -2,7 +2,7 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
/* eslint-disable react-hooks/exhaustive-deps */
'use client'
import { Box, Center, Image, Loader, Paper, Stack, Text, Tooltip } from '@mantine/core';
import { Box, Center, Image, Loader, Paper, Stack, Text } from '@mantine/core';
import { IconUsers } from '@tabler/icons-react';
import { OrganizationChart } from 'primereact/organizationchart';
import { useEffect } from 'react';
@@ -110,7 +110,6 @@ function nodeTemplate(node: any) {
return (
<Stack align="center" gap={6} p="sm" style={{ minWidth: 160 }}>
<Tooltip label={name} position="top" withArrow>
<Image
src={imageSrc}
alt={name}
@@ -123,7 +122,6 @@ function nodeTemplate(node: any) {
}}
loading='lazy'
/>
</Tooltip>
<Text fw={600} ta="center" size="sm">{name}</Text>
<Text size="xs" c="dimmed" ta="center">{status}</Text>
</Stack>