Fix: admin job

Deskripsi:
- Fix image job dari server wibu
## No Issue
This commit is contained in:
2024-11-05 13:49:06 +08:00
parent d624d61a33
commit 3aea046046
15 changed files with 276 additions and 180 deletions

View File

@@ -0,0 +1,61 @@
import {
Divider,
Grid,
Group,
Navbar,
ScrollArea,
Skeleton,
Stack,
} from "@mantine/core";
export function Admin_ComponentSkeletonNavbar() {
return (
<>
<Navbar.Section h={"6vh"}>
<Stack spacing={"lg"}>
<Grid>
<Grid.Col span={7}>
<Skeleton height={30} radius="xl" />
</Grid.Col>
<Grid.Col span={5}>
<Stack h={"100%"} justify="center">
<Group position="right" spacing={5}>
<Skeleton circle height={30} />
<Skeleton circle height={30} />
</Group>
</Stack>
</Grid.Col>
</Grid>
<Divider />
</Stack>
</Navbar.Section>
<Navbar.Section h={"88vh"} grow component={ScrollArea} py={"sm"}>
<Stack spacing={"lg"}>
{Array.from(new Array(20)).map((e, i) => (
<Grid key={i}>
<Grid.Col span={"content"}>
<Stack h={"100%"} justify="center">
<Group position="right" spacing={5}>
<Skeleton circle height={30} />
</Group>
</Stack>
</Grid.Col>
<Grid.Col span={"auto"}>
<Skeleton height={30} radius="xl" />
</Grid.Col>
</Grid>
))}
</Stack>
</Navbar.Section>
<Navbar.Section h={"6vh"}>
<Stack spacing={"lg"}>
<Divider />
<Skeleton height={20} radius="xl" />
</Stack>
</Navbar.Section>
</>
);
}

View File

@@ -1,5 +1,7 @@
import { Admin_ComponentLoadImageLandscape } from "./_component/comp_admin_load_image";
import { Admin_ComponentSkeletonNavbar } from "./_component/comp_admin_skeleton_navbar";
import { Admin_UiImagePreview } from "./_ui/ui_admin_image_preview";
export { Admin_ComponentLoadImageLandscape };
export { Admin_UiImagePreview };
export { Admin_ComponentSkeletonNavbar };

View File

@@ -249,7 +249,9 @@ function TampilanDetailDonasi({
<Grid.Col span={"auto"}>
<Stack spacing={0}>
<Text fz={"xs"}>Bank Tujuan</Text>
<Title order={6}>{donasi?.namaBank}</Title>
<Title order={6} c={"blue"}>
{donasi?.namaBank}
</Title>
</Stack>
</Grid.Col>
</Grid>
@@ -257,17 +259,32 @@ function TampilanDetailDonasi({
<Grid.Col span={"auto"}>
<Stack spacing={0}>
<Text fz={"xs"}>Akumulasi Pencairan</Text>
<Title order={6}>{donasi?.akumulasiPencairan} Kali</Title>
<Title order={6} c={"blue"}>
{donasi?.akumulasiPencairan} Kali
</Title>
</Stack>
</Grid.Col>
<Grid.Col span={"auto"}>
<Stack spacing={0}>
<Text fz={"xs"}>Nomor Rekening</Text>
<Title order={6}>{donasi?.rekening}</Title>
<Title order={6} c={"blue"}>
{donasi?.rekening}
</Title>
</Stack>
</Grid.Col>
</Grid>
<Stack align="center" spacing={0}>
<Text fz={"xs"}>Sisa Dana</Text>
<ComponentGlobal_TampilanRupiah
nominal={
toNumber(donasi.terkumpul) -
toNumber(donasi.totalPencairan)
}
color="darkblue"
/>
</Stack>
<Button
loaderPosition="center"
loading={isLoadingPencairanDana}

View File

@@ -21,6 +21,7 @@ import { IconPhotoCheck, IconSearch } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import adminJob_getListPublish from "../../fun/get/get_list_publish";
import { RouterAdminGlobal } from "@/app/lib";
export default function AdminJob_TablePublish({
dataPublish,
@@ -45,6 +46,7 @@ function TableStatus({ dataPublish }: { dataPublish: any }) {
const [activePage, setActivePage] = useState(1);
const [isSearch, setSearch] = useState("");
const [isLoadingShowImage, setLoadingShowImage] = useState(false);
const [dataId, setDataId] = useState("");
async function onSearch(s: string) {
setSearch(s);
@@ -100,13 +102,14 @@ function TableStatus({ dataPublish }: { dataPublish: any }) {
{e.imageId ? (
<Button
loaderPosition="center"
loading={isLoadingShowImage}
loading={isLoadingShowImage && e.id === dataId}
color="green"
radius={"xl"}
leftIcon={<IconPhotoCheck />}
onClick={() => {
setLoadingShowImage(true);
router.push(RouterAdminJob.detail_poster + e?.imageId);
setDataId(e.id);
router.push(RouterAdminGlobal.preview_image({ id: e.imageId }));
}}
>
Lihat

View File

@@ -1,11 +1,14 @@
"use client";
import { RouterAdminJob } from "@/app/lib/router_admin/router_admin_job";
import ComponentAdminGlobal_HeaderTamplate from "@/app_modules/admin/_admin_global/header_tamplate";
import ComponentGlobal_InputCountDown from "@/app_modules/_global/component/input_countdown";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import { ComponentAdminGlobal_TitlePage } from "@/app_modules/admin/_admin_global/_component";
import ComponentAdminGlobal_HeaderTamplate from "@/app_modules/admin/_admin_global/header_tamplate";
import adminNotifikasi_funCreateToUser from "@/app_modules/admin/notifikasi/fun/create/fun_create_notif_user";
import { MODEL_JOB } from "@/app_modules/job/model/interface";
import mqtt_client from "@/util/mqtt_client";
import {
Button,
Center,
@@ -19,17 +22,13 @@ import {
Table,
Text,
TextInput,
Textarea,
Title,
Textarea
} from "@mantine/core";
import { IconBan, IconPhotoCheck, IconSearch } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { AdminJob_funEditCatatanById } from "../../fun/edit/fun_edit_catatan_by_id";
import adminJob_getListReject from "../../fun/get/get_list_reject";
import { AdminJob_getListTableByStatusId } from "../../fun/get/get_list_table_by_status_id";
import mqtt_client from "@/util/mqtt_client";
import adminNotifikasi_funCreateToUser from "@/app_modules/admin/notifikasi/fun/create/fun_create_notif_user";
export default function AdminJob_TableReject({
dataReject,
@@ -55,6 +54,7 @@ function TableStatus({ listReject }: { listReject: any }) {
const [reject, setReject] = useState(false);
const [jobId, setJobId] = useState("");
const [isLoading, setIsLoading] = useState(false);
const [catatan, setCatatan] = useState("");
async function onSearch(s: string) {
@@ -99,10 +99,14 @@ function TableStatus({ listReject }: { listReject: any }) {
<Center w={150}>
{e.imageId ? (
<Button
loading={isLoading && e?.imageId === jobId}
loaderPosition="center"
color="green"
radius={"xl"}
leftIcon={<IconPhotoCheck />}
onClick={() => {
setJobId(e?.imageId);
setIsLoading(true);
router.push(RouterAdminJob.detail_poster + e?.imageId);
}}
>
@@ -224,24 +228,20 @@ function TableStatus({ listReject }: { listReject: any }) {
</Modal>
<Stack spacing={"xs"} h={"100%"}>
<Group
position="apart"
bg={"red.4"}
p={"xs"}
style={{ borderRadius: "6px" }}
>
<Title order={4} c={"white"}>
Reject
</Title>
<TextInput
icon={<IconSearch size={20} />}
radius={"xl"}
placeholder="Masukan judul"
onChange={(val) => {
onSearch(val.currentTarget.value);
}}
/>
</Group>
<ComponentAdminGlobal_TitlePage
name="Reject"
color="red.4"
component={
<TextInput
icon={<IconSearch size={20} />}
radius={"xl"}
placeholder="Masukan judul"
onChange={(val) => {
onSearch(val.currentTarget.value);
}}
/>
}
/>
<Paper p={"md"} withBorder shadow="lg" h={"80vh"}>
<ScrollArea w={"100%"} h={"90%"}>

View File

@@ -1,10 +1,12 @@
"use client";
import { RouterAdminJob } from "@/app/lib/router_admin/router_admin_job";
import ComponentAdminGlobal_HeaderTamplate from "@/app_modules/admin/_admin_global/header_tamplate";
import adminNotifikasi_funCreateToUser from "@/app_modules/admin/notifikasi/fun/create/fun_create_notif_user";
import { RouterAdminGlobal } from "@/app/lib";
import ComponentGlobal_InputCountDown from "@/app_modules/_global/component/input_countdown";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal";
import { ComponentAdminGlobal_TitlePage } from "@/app_modules/admin/_admin_global/_component";
import ComponentAdminGlobal_HeaderTamplate from "@/app_modules/admin/_admin_global/header_tamplate";
import adminNotifikasi_funCreateToUser from "@/app_modules/admin/notifikasi/fun/create/fun_create_notif_user";
import { MODEL_JOB } from "@/app_modules/job/model/interface";
import mqtt_client from "@/util/mqtt_client";
import {
@@ -21,14 +23,12 @@ import {
Text,
TextInput,
Textarea,
Title,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import {
IconBan,
IconEyeCheck,
IconEyeShare,
IconHandFinger,
IconPhotoCheck,
IconSearch,
} from "@tabler/icons-react";
import { useRouter } from "next/navigation";
@@ -36,8 +36,6 @@ import { useState } from "react";
import { AdminJob_funEditCatatanById } from "../../fun/edit/fun_edit_catatan_by_id";
import { AdminJob_funEditStatusPublishById } from "../../fun/edit/fun_edit_status_publish_by_id";
import adminJob_getListReview from "../../fun/get/get_list_review";
import { IconPhotoCheck } from "@tabler/icons-react";
import ComponentGlobal_InputCountDown from "@/app_modules/_global/component/input_countdown";
export default function AdminJob_TableReview({
dataReview,
@@ -63,6 +61,7 @@ function TableStatus({ listReview }: { listReview: any }) {
const [reject, setReject] = useState(false);
const [jobId, setJobId] = useState("");
const [isLoading, setIsLoading] = useState(false);
const [catatan, setCatatan] = useState("");
useShallowEffect(() => {
@@ -125,11 +124,15 @@ function TableStatus({ listReview }: { listReview: any }) {
<Center w={200}>
{e.imageId ? (
<Button
loaderPosition="center"
loading={isLoading && jobId == e?.id}
color="green"
radius={"xl"}
leftIcon={<IconPhotoCheck />}
onClick={() => {
router.push(RouterAdminJob.detail_poster + e?.imageId);
setJobId(e?.id);
setIsLoading(true);
router.push(RouterAdminGlobal.preview_image({ id: e.imageId }));
}}
>
Lihat
@@ -253,24 +256,20 @@ function TableStatus({ listReview }: { listReview: any }) {
</Modal>
<Stack spacing={"xs"} h={"100%"}>
<Group
position="apart"
bg={"orange.4"}
p={"xs"}
style={{ borderRadius: "6px" }}
>
<Title order={4} c={"white"}>
Review
</Title>
<TextInput
icon={<IconSearch size={20} />}
radius={"xl"}
placeholder="Masukan judul"
onChange={(val) => {
onSearch(val.currentTarget.value);
}}
/>
</Group>
<ComponentAdminGlobal_TitlePage
name="Review"
color="orange.4"
component={
<TextInput
icon={<IconSearch size={20} />}
radius={"xl"}
placeholder="Masukan judul"
onChange={(val) => {
onSearch(val.currentTarget.value);
}}
/>
}
/>
<Paper p={"md"} withBorder shadow="lg" h={"80vh"}>
<ScrollArea w={"100%"} h={"90%"}>

View File

@@ -20,6 +20,7 @@ import {
} from "@tabler/icons-react";
import { useState } from "react";
import { adminMap_funGetOneById } from "../fun/fun_get_one_by_id";
import { Admin_ComponentLoadImageLandscape } from "../../_admin_global";
export function ComponentAdminMap_DetailDataDrawer({
mapId,
@@ -44,14 +45,15 @@ export function ComponentAdminMap_DetailDataDrawer({
return (
<>
<Stack>
<AspectRatio ratio={1 / 1} mah={300}>
<Admin_ComponentLoadImageLandscape fileId={data?.imageId as any}/>
{/* <AspectRatio ratio={1 / 1} mah={300}>
<Image
radius={"md"}
width={300}
alt="Photo"
src={APIs.GET({ fileId: data?.imageId as string })}
/>
</AspectRatio>
</AspectRatio> */}
<Box>
<Grid>

View File

@@ -1,30 +1,17 @@
"use client";
import { RouterMap } from "@/app/lib/router_hipmi/router_map";
import { MODEL_MAP } from "@/app_modules/map/lib/interface";
import {
AspectRatio,
Box,
Drawer,
Grid,
Group,
Image,
Stack,
Text,
Text
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import {
IconBuildingSkyscraper,
IconListDetails,
IconMapPin,
IconPhoneCall,
IconPinned,
} from "@tabler/icons-react";
import _ from "lodash";
import { useState } from "react";
import { adminMap_funGetOneById } from "../fun/fun_get_one_by_id";
import _ from "lodash";
import { ComponentAdminMap_SkeletonDrawer } from "./comp_skeleton_drawer";
import { ComponentAdminMap_DetailDataDrawer } from "./comp_detail_data_drawer";
import { ComponentAdminMap_SkeletonDrawer } from "./comp_skeleton_drawer";
export function ComponentAdminMap_Drawer({
opened,

View File

@@ -40,6 +40,7 @@ import {
} from "./_admin_global/new_global_state";
import { newListAdminPage } from "./new_list_page";
import { ComponentAdmin_UIDrawerNotifikasi } from "./notifikasi/ui_drawer_notifikasi";
import { Admin_ComponentSkeletonNavbar } from "./_admin_global";
export function Admin_NewLayout({
children,
@@ -60,80 +61,83 @@ export function Admin_NewLayout({
return (
<>
<AppShell
h={"100vh"}
padding="md"
navbarOffsetBreakpoint={1024}
navbar={
<Navbar
width={{ lg: 250, md: 200, base: 250 }}
height={"100vh"}
width={{ base: 250 }}
hiddenBreakpoint={1024}
hidden={!opened}
p="xs"
bg={AccentColor.darkblue}
>
{/* Header */}
<Navbar.Section style={{ color: "white" }}>
<Stack spacing={"lg"}>
<Grid>
<Grid.Col span={7}>
<Title order={3} lineClamp={1}>
{userRoleId == "2" ? "Admin" : "Developer"}
</Title>
</Grid.Col>
{!matches ? (
<Admin_ComponentSkeletonNavbar />
) : (
<>
<Navbar.Section style={{ color: "white" }}>
<Stack spacing={"lg"}>
<Grid>
<Grid.Col span={7}>
<Title order={3} lineClamp={1}>
{userRoleId == "2" ? "Admin" : "Developer"}
</Title>
</Grid.Col>
<Grid.Col span={5}>
<Stack h={"100%"} justify="center">
<Group position="right" spacing={5}>
<ButtonUserCircle dataUser={dataUser} />
<Grid.Col span={5}>
<Stack h={"100%"} justify="center">
<Group position="right" spacing={5}>
<ButtonUserCircle dataUser={dataUser} />
<ActionIcon
variant="transparent"
onClick={() => setDrawerNotifikasi(true)}
>
<IconBell color="white" />
</ActionIcon>
</Group>
</Stack>
</Grid.Col>
</Grid>
<Divider color="white" />
</Stack>
</Navbar.Section>
<ActionIcon
variant="transparent"
onClick={() => setDrawerNotifikasi(true)}
>
<IconBell color="white" />
</ActionIcon>
</Group>
</Stack>
</Grid.Col>
</Grid>
<Divider color="white" />
</Stack>
</Navbar.Section>
{/* Main */}
<Navbar.Section
grow
component={ScrollArea}
style={{ color: "white", transition: "0.5s" }}
>
<Stack style={{ color: "white" }}>
<NavbarAdmin userRoleId={userRoleId} />
</Stack>
</Navbar.Section>
<Navbar.Section
grow
component={ScrollArea}
style={{ color: "white", transition: "0.5s" }}
>
<Stack style={{ color: "white" }}>
<NavbarAdmin userRoleId={userRoleId} />
</Stack>
</Navbar.Section>
{/* Footer */}
<Navbar.Section>
<Stack>
<Divider />
<Group position="center">
<Text fs={"italic"} c={"white"} fz={"xs"}>
V 1.0.0
</Text>
</Group>
</Stack>
</Navbar.Section>
<Navbar.Section>
<Stack>
<Divider />
<Group position="center">
<Text fs={"italic"} c={"white"} fz={"xs"}>
V 1.0.0
</Text>
</Group>
</Stack>
</Navbar.Section>
</>
)}
</Navbar>
}
>
{matches ? (
children
) : (
{!matches ? (
<Stack align="center" justify="center" h={"100%"}>
<Title>Sorry !</Title>
<Title order={4} align="center">
View Only Available For Desktop
</Title>
</Stack>
) : (
children
)}
</AppShell>