wibu/hipmi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix tampilan admin dan notifikasi to admin

Browse Source 
# fix
- Notifikasi report posting
_ Realtime notifikasi
## Issuee: Cooming soon saat report komentar langsung menuju tablenya
This commit is contained in:
Bagasbanuna02
2024-06-24 23:07:54 +08:00
parent e70577c43e
commit 1a157846c1
66 changed files with 2040 additions and 1224 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app_modules/auth/index.ts
View File

@@ -1,7 +1,6 @@
import SplashScreen from "./splash/view";
import Login from "./login/view";
import Validasi from "./validasi/view";
import LayoutValidasi from "./validasi/layout";
import Register from "./register/view";
import User_Logout from "./logout/view";
@@ -11,5 +10,4 @@ export {
Validasi,
Register,
User_Logout as Logout,
LayoutValidasi,
};

2
src/app_modules/auth/login/view.tsx
View File

@@ -40,7 +40,6 @@ export default function Login() {
async function onLogin() {
const nomorHp = phone.substring(1);
console.log(nomorHp);
if (nomorHp.length <= 4) return setError(true);
@@ -117,6 +116,7 @@ export default function Login() {
<Button
radius={"md"}
bg={MainColor.yellow}
color={"yellow"}
loading={loading ? true : false}
loaderPosition="center"
c={"black"}

69
src/app_modules/auth/register/view.tsx
View File

@@ -11,7 +11,7 @@ import {
PinInput,
Stack,
} from "@mantine/core";
import { IconCircleLetterH, IconCloudLockOpen } from "@tabler/icons-react";
import { IconCircleLetterH, IconCloudLockOpen, IconUserCircle } from "@tabler/icons-react";
import { gs_nomor } from "../state/state";
import { useAtom } from "jotai";
import { useState } from "react";
@@ -28,6 +28,7 @@ import { IconPencilCheck } from "@tabler/icons-react";
import { RouterHome } from "@/app/lib/router_hipmi/router_home";
import { auth_funEditAktivasiKodeOtpById } from "../fun/fun_edit_aktivasi_kode_otp_by_id";
import ComponentGlobal_ErrorInput from "@/app_modules/component_global/error_input";
import { AccentColor, MainColor } from "@/app_modules/component_global/color/color_pallet";
export default function Register({ dataOtp }: { dataOtp: any }) {
const router = useRouter();
@@ -72,8 +73,68 @@ export default function Register({ dataOtp }: { dataOtp: any }) {
<>
{/* <pre>{JSON.stringify(dataOtp,null,2)}</pre> */}
<Center>
<Stack
<Center bg={MainColor.darkblue} h={"100vh"}>
<Stack h={"100%"} align="center" justify="center" spacing={70}>
<Title order={2} c={MainColor.yellow}>
REGISTRASI
</Title>
<IconUserCircle size={100} color="white" />
<Stack spacing={"sm"} w={300}>
<Text fz={10} c={"white"}>
Anda akan terdaftar dengan nomor berikut{" "}
<Text inherit span fw={"bold"}>
+{nomor}
</Text>
</Text>
<TextInput
ref={focusTrapRef}
placeholder="Masukan Username"
maxLength={50}
error={
value.length > 0 && value.length < 5 ? (
<ComponentGlobal_ErrorInput text="Minimal 5 karakter !" />
) : _.values(value).includes(" ") ? (
<Stack spacing={5}>
<ComponentGlobal_ErrorInput text="Tidak boleh ada space" />
<ComponentGlobal_ErrorInput text="Sambungkan huruf meggunakan karakter _" />
</Stack>
) : isValue ? (
<ComponentGlobal_ErrorInput text="Masukan username anda" />
) : (
""
)
}
onChange={(val) => {
val.currentTarget.value.length > 0 ? setIsValue(false) : "";
setValue(val.currentTarget.value);
}}
/>
<Stack>
<Button
loading={loading ? true : false}
loaderPosition="center"
radius={"md"}
compact
h={40}
c={"black"}
bg={MainColor.yellow}
color={"yellow"}
style={{
borderColor: AccentColor.yellow,
}}
onClick={() => {
onRegistarsi();
}}
>
<Text>DAFTAR</Text>
</Button>
</Stack>
</Stack>
</Stack>
{/* <Stack
px={"lg"}
spacing={70}
w={{ base: 400 }}
@@ -137,7 +198,7 @@ export default function Register({ dataOtp }: { dataOtp: any }) {
</Button>
</Stack>
</Stack>
</Stack>
</Stack> */}
</Center>
</>
);

34
src/app_modules/auth/validasi/layout.tsx
View File

@@ -1,34 +0,0 @@
"use client";
import { ActionIcon, Box, Stack } from "@mantine/core";
import { IconChevronLeft } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import React from "react";
export default function LayoutValidasi({
children,
}: {
children: React.ReactNode;
}) {
const router = useRouter();
return (
<Stack >
<Box
bg={"white"}
p={"md"}
style={{
position: "sticky",
top: 0,
zIndex: 99,
}}
>
<ActionIcon variant="transparent" onClick={() => router.back()}>
<IconChevronLeft />
</ActionIcon>
</Box>
{children}
</Stack>
);
}

149
src/app_modules/auth/validasi/view.tsx
View File

@@ -1,41 +1,32 @@
"use client";
import { useAtom } from "jotai";
import { RouterAdminDashboard } from "@/app/lib/router_hipmi/router_admin";
import { RouterAuth } from "@/app/lib/router_hipmi/router_auth";
import { RouterHome } from "@/app/lib/router_hipmi/router_home";
import {
AccentColor,
MainColor,
} from "@/app_modules/component_global/color/color_pallet";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/component_global/notif_global/notifikasi_berhasil";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/component_global/notif_global/notifikasi_peringatan";
import {
ActionIcon,
Box,
Button,
Center,
Flex,
PinInput,
Stack,
Text,
Title,
Title
} from "@mantine/core";
import { gs_nomor, gs_otp } from "../state/state";
import { Warna } from "@/app/lib/warna";
import { useState } from "react";
import { myConsole } from "@/app/fun/my_console";
import {
IconChevronLeft,
IconCircleLetterH,
IconCloudLockOpen,
} from "@tabler/icons-react";
import toast from "react-simple-toasts";
import { ApiHipmi } from "@/app/lib/api";
import { useRouter } from "next/navigation";
import { funGetUserProfile } from "@/app_modules/fun_global/get_user_profile";
import { useFocusTrap } from "@mantine/hooks";
import { NotifBerhasil } from "@/app_modules/donasi/component/notifikasi/notif_berhasil";
import { NotifGagal } from "@/app_modules/donasi/component/notifikasi/notif_gagal";
import { NotifPeringatan } from "@/app_modules/donasi/component/notifikasi/notif_peringatan";
import Countdown from "react-countdown";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/component_global/notif_global/notifikasi_peringatan";
import { auth_funValidasi } from "../fun/fun_validasi";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/component_global/notif_global/notifikasi_berhasil";
import { RouterAuth } from "@/app/lib/router_hipmi/router_auth";
import { RouterHome } from "@/app/lib/router_hipmi/router_home";
import {
IconChevronLeft
} from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { auth_funEditAktivasiKodeOtpById } from "../fun/fun_edit_aktivasi_kode_otp_by_id";
import { RouterAdminDashboard } from "@/app/lib/router_hipmi/router_admin";
import { auth_funValidasi } from "../fun/fun_validasi";
export default function Validasi({ dataOtp }: { dataOtp: any }) {
const router = useRouter();
@@ -45,37 +36,6 @@ export default function Validasi({ dataOtp }: { dataOtp: any }) {
const focusTrapRef = useFocusTrap();
const [loading, setLoading] = useState(false);
const onValid = async () => {
// MyConsole(inputCode)
const body = {
nomor: nomor,
otp: code,
};
if (!inputCode) return toast("Lengkapi Kode");
if (body.otp != inputCode) return toast("Kode Salah");
// await fetch(ApiHipmi.validasi, {
// method: "POST",
// headers: {
// "Content-Type": "application/json",
// },
// body: JSON.stringify(body),
// })
// .then((res) => res.json())
// .then((val) => {
// myConsole(val);
// if (val.status == 200) {
// setTimeout(() => router.push("/dev/home"), 2000);
// funGetUserProfile(val.data.id);
// NotifBerhasil("Berhasil Login");
// } else {
// router.push("/dev/auth/register");
// NotifPeringatan("Silahkan Registrasi");
// }
// });
};
async function onVerifikasi() {
if (!inputCode)
return ComponentGlobal_NotifikasiPeringatan("Lengkapi Kode");
@@ -106,23 +66,32 @@ export default function Validasi({ dataOtp }: { dataOtp: any }) {
return (
<>
<Center h={"100vh"}>
<Stack px={"lg"} spacing={"xl"} w={{ base: 400 }} justify="center">
<Center>
<IconCloudLockOpen size={130} />
</Center>
<Stack bg={MainColor.darkblue} h={"100vh"}>
<Box
pt={"md"}
px={"md"}
style={{
position: "sticky",
top: 0,
}}
>
<ActionIcon variant="transparent" onClick={() => router.back()}>
<IconChevronLeft color="white" />
</ActionIcon>
</Box>
<Stack spacing={50}>
<Stack spacing={0}>
<Title order={4}>Verifikasi Kode OTP</Title>
<Text fs={"italic"} fz={"xs"}>
Silahkan masukan 4 digit kode otp yang dikirim ke{" "}
<Text span inherit fw={"bold"}>
+{nomor}
</Text>
</Text>
</Stack>
<Stack align="center" justify="center" h={"100vh"} spacing={70}>
<Title order={2} color={MainColor.yellow}>
Verifikasi Kode OTP
</Title>
<Stack spacing={0} align="center">
<Text fz={"xs"} c={"white"}>
Masukan 4 digit kode otp
</Text>
<Text fz={"xs"} c={"white"}>
Yang dikirim ke <Text span inherit fw={"bold"}> +{nomor}</Text>
</Text>
<Center>
<PinInput
ref={focusTrapRef}
@@ -133,24 +102,28 @@ export default function Validasi({ dataOtp }: { dataOtp: any }) {
}}
/>
</Center>
<Stack>
<Button
loading={loading ? true : false}
loaderPosition="center"
radius={"md"}
compact
h={40}
color={"teal"}
onClick={() => {
onVerifikasi();
}}
>
<Text>VERIFIKASI</Text>
</Button>
</Stack>
</Stack>
<Button
w={300}
loading={loading ? true : false}
loaderPosition="center"
radius={"md"}
compact
h={40}
c={"black"}
bg={MainColor.yellow}
color={"yellow"}
style={{
borderColor: AccentColor.yellow,
}}
onClick={() => {
onVerifikasi();
}}
>
<Text>VERIFIKASI</Text>
</Button>
</Stack>
</Center>
</Stack>
</>
);
}