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

# Forum

Browse Source 
- Tampilan admin untuk komentar
- Hapus komentar
- Hapus postingan
- Lihat report
- Search topik forum
## feat
### No issue
This commit is contained in:
Bagasbanuna02
2024-03-25 17:44:27 +08:00
parent de0790aade
commit 8af6c6265f
55 changed files with 2213 additions and 218 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/app_modules/forum/component/header/detail_author_header_name.tsx
View File

@@ -10,6 +10,7 @@ import {
Group,
ThemeIcon,
ActionIcon,
Badge,
} from "@mantine/core";
import { useRouter } from "next/navigation";
import moment from "moment";
@@ -31,14 +32,18 @@ export default function ComponentForum_DetailOnHeaderAuthorName({
authorName,
username,
isPembatas,
userLoginId,
statusId,
}: {
authorId?: string
authorId?: string;
postingId?: string;
imagesId?: string;
authorName?: string;
username?: string;
tglPublish?: Date;
isPembatas?: boolean;
statusId: string;
userLoginId: string;
}) {
const router = useRouter();
@@ -73,40 +78,21 @@ export default function ComponentForum_DetailOnHeaderAuthorName({
<Text lineClamp={1} fz={"sm"} fw={"bold"}>
{authorName ? authorName : "Nama author "}
</Text>
<Text lineClamp={1} fz={"xs"} c={"gray"}>
{username ? `@${username}` : "@username "}
</Text>
<Badge
w={70}
variant="light"
color={(statusId as any) === 1 ? "green" : "red"}
>
<Text fz={10}>{(statusId as any) === 1 ? "Open" : "Close"}</Text>
</Badge>
</Stack>
{/* <Stack justify="center" h={"100%"}>
<Grid>
<Grid.Col span={"auto"}>
<Text lineClamp={1} fz={"sm"} fw={"bold"}>
{authorName ? authorName : "Nama author "}
</Text>
</Grid.Col>
<Grid.Col span={"auto"}>
<Text lineClamp={1} fz={"sm"} c={"gray"}>
{username ? username : "@username "}
</Text>
</Grid.Col>
<Grid.Col span={"auto"}>
<Group spacing={3}>
<IconCircle size={5} color="gray" />
<Text c={"gray"} fz={"sm"}>
{skrng.toLocaleDateString(["id-ID"], {
dateStyle: "medium",
})}
</Text>
</Group>
</Grid.Col>
</Grid>
</Stack> */}
</Grid.Col>
<Grid.Col span={"content"}>
<ComponentForum_DetailMoreButton
postingId={postingId}
authorId={authorId}
userLoginId={userLoginId}
statusId={statusId}
/>
</Grid.Col>
</Grid>

69
src/app_modules/forum/component/header/posting_author_header_name.tsx
View File

@@ -1,7 +1,16 @@
"use client";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import { Stack, Grid, Avatar, Divider, Text, Group } from "@mantine/core";
import {
Stack,
Grid,
Avatar,
Divider,
Text,
Group,
Badge,
Loader,
} from "@mantine/core";
import { useRouter } from "next/navigation";
import moment from "moment";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/component_global/notif_global/notifikasi_peringatan";
@@ -19,6 +28,7 @@ import { IoIosMore } from "react-icons/io";
import { useDisclosure } from "@mantine/hooks";
import { useState } from "react";
import ComponentForum_PostingButtonMore from "../more_button/posting_button_more";
import ComponentGlobal_V2_LoadingPage from "@/app_modules/component_global/loading_page_v2";
export default function ComponentForum_PostingAuthorNameOnHeader({
authorId,
@@ -28,6 +38,8 @@ export default function ComponentForum_PostingAuthorNameOnHeader({
tglPublish,
isPembatas,
isMoreButton,
statusId,
userLoginId,
}: {
authorId?: string;
postingId?: string;
@@ -36,8 +48,12 @@ export default function ComponentForum_PostingAuthorNameOnHeader({
tglPublish?: Date;
isPembatas?: boolean;
isMoreButton?: boolean;
statusId?: string;
userLoginId: string;
}) {
const router = useRouter();
const [loading, setLoading] = useState(false);
return (
<>
<Stack spacing={"xs"}>
@@ -46,43 +62,52 @@ export default function ComponentForum_PostingAuthorNameOnHeader({
span={"content"}
onClick={() => {
if (authorId) {
setLoading(true);
router.push(RouterForum.forumku + authorId);
} else {
ComponentGlobal_NotifikasiPeringatan("Id tidak ditemukan");
}
}}
>
<Avatar
size={30}
sx={{ borderStyle: "solid", borderWidth: "0.5px" }}
radius={"xl"}
bg={"gray.1"}
src={
imagesId
? RouterProfile.api_foto_profile + imagesId
: "/aset/global/avatar.png"
}
/>
{loading ? (
<Loader color="gray" variant="dots" />
) : (
<Avatar
size={40}
sx={{ borderStyle: "solid", borderWidth: "0.5px" }}
radius={"xl"}
bg={"gray.1"}
src={
imagesId
? RouterProfile.api_foto_profile + imagesId
: "/aset/global/avatar.png"
}
/>
)}
</Grid.Col>
<Grid.Col span={"auto"}>
<Stack justify="center" h={"100%"}>
<Stack justify="center" h={"100%"} spacing={0}>
<Grid>
<Grid.Col span={"auto"}>
<Text lineClamp={1} fz={"sm"} fw={"bold"}>
{authorName
? authorName
: "Nama author coba di berikan panjang "}
{authorName ? authorName : "Nama author "}
</Text>
</Grid.Col>
{/* <Grid.Col span={"auto"}>
<Text lineClamp={1} fz={"sm"} c={"gray"}>
{username ? username : "@username "}
</Text>
</Grid.Col> */}
<Grid.Col span={"content"}></Grid.Col>
</Grid>
<Badge
w={70}
variant="light"
color={(statusId as any) === 1 ? "green" : "red"}
>
<Text fz={10}>
{(statusId as any) === 1 ? "Open" : "Close"}
</Text>
</Badge>
</Stack>
</Grid.Col>
<Grid.Col span={"content"}>
<Group position="center" spacing={"xs"}>
<Group spacing={3}>
@@ -108,6 +133,8 @@ export default function ComponentForum_PostingAuthorNameOnHeader({
<ComponentForum_PostingButtonMore
authorId={authorId}
postingId={postingId as any}
statusId={statusId}
userLoginId={userLoginId}
/>
</Group>
) : (

48
src/app_modules/forum/component/main_card_view.tsx
View File

@@ -2,7 +2,7 @@
import { RouterForum } from "@/app/lib/router_hipmi/router_forum";
import { Stack, Card, Group, ActionIcon, Divider, Text } from "@mantine/core";
import { IconMessageCircle } from "@tabler/icons-react";
import { IconMessageCircle, IconMessageCircleOff } from "@tabler/icons-react";
import ComponentForum_PostingAuthorNameOnHeader from "./header/posting_author_header_name";
import { MODEL_FORUM_POSTING } from "../model/interface";
@@ -12,23 +12,28 @@ import { useRouter } from "next/navigation";
import { useAtom } from "jotai";
import { gs_forum_total_komentar } from "../global_state";
import { forum_countOneTotalKomentarById } from "../fun/count/count_one_total_komentar_by_id";
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/component_global/notif_global/notifikasi_peringatan";
import { IconMessageCircleX } from "@tabler/icons-react";
export default function ComponentForum_MainCardView({
data,
setLoadingKomen,
setLoadingDetail,
userLoginId,
}: {
data: MODEL_FORUM_POSTING[];
setLoadingKomen: any;
setLoadingDetail: any;
userLoginId: any
}) {
const router = useRouter();
return (
<>
<Stack>
<Stack spacing={"xl"}>
{data.map((e, i) => (
<Card key={i}>
<Card.Section>
{/* <pre>{JSON.stringify( typeof e.ForumMaster_StatusPosting.id)}</pre> */}
<ComponentForum_PostingAuthorNameOnHeader
authorName={e?.Author?.Profile?.name}
imagesId={e?.Author?.Profile?.imagesId}
@@ -36,22 +41,22 @@ export default function ComponentForum_MainCardView({
isMoreButton={true}
authorId={e?.Author?.id}
postingId={e?.id}
statusId={e?.ForumMaster_StatusPosting?.id}
userLoginId={userLoginId}
/>
</Card.Section>
<Card.Section
sx={{ zIndex: 0 }}
p={"sm"}
p={"lg"}
onClick={() => {
// console.log("halaman forum");
setLoadingDetail(true);
router.push(RouterForum.main_detail + e.id);
}}
>
<Stack spacing={"xs"}>
<Text fz={"sm"} lineClamp={4}>
<div dangerouslySetInnerHTML={{ __html: e.diskusi }} />
</Text>
</Stack>
<Text fz={"sm"} lineClamp={4}>
<div dangerouslySetInnerHTML={{ __html: e.diskusi }} />
</Text>
</Card.Section>
<Card.Section>
<Stack>
@@ -61,11 +66,17 @@ export default function ComponentForum_MainCardView({
variant="transparent"
sx={{ zIndex: 1 }}
onClick={() => {
setLoadingKomen(true);
router.push(RouterForum.komentar + e.id);
(e?.ForumMaster_StatusPosting.id as any) === 1
? (router.push(RouterForum.komentar + e?.id),
setLoadingKomen(true))
: router.push(RouterForum.main_detail + e?.id);
}}
>
<IconMessageCircle color="gray" size={25} />
{(e?.ForumMaster_StatusPosting?.id as any) === 1 ? (
<IconMessageCircle color="gray" size={25} />
) : (
<IconMessageCircleX color="gray" size={25} />
)}
</ActionIcon>
{/* <TotalKomentar postingId={e?.id} /> */}
@@ -81,18 +92,3 @@ export default function ComponentForum_MainCardView({
</>
);
}
function TotalKomentar({ postingId }: { postingId: string }) {
const [value, setValue] = useState(0)
useShallowEffect(() => {
forum_countOneTotalKomentarById(postingId).then((res) => {
setValue(res);
});
}, [postingId]);
return (
<>
<Text c={"gray"}>{value}</Text>
</>
);
}

141
src/app_modules/forum/component/more_button/detail_more_button.tsx
View File

@@ -17,7 +17,13 @@ import {
Loader,
} from "@mantine/core";
import { useDisclosure, useShallowEffect } from "@mantine/hooks";
import { IconTrash, IconEdit, IconFlag3, IconDots } from "@tabler/icons-react";
import {
IconTrash,
IconEdit,
IconFlag3,
IconDots,
IconSquareRoundedX,
} from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
@@ -29,18 +35,24 @@ import ComponentForum_LoadingDrawer from "../loading_drawer";
import { User_getUserId } from "@/app_modules/fun_global/get_user_token";
import { forum_funDeletePostingById } from "../../fun/delete/fun_delete_posting_by_id";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/component_global/notif_global/notifikasi_gagal";
import { IconSquareCheck } from "@tabler/icons-react";
import { forum_funEditStatusPostingById } from "../../fun/edit/fun_edit_status_posting_by_id";
export default function ComponentForum_DetailMoreButton({
authorId,
postingId,
statusId,
userLoginId,
}: {
authorId: any;
postingId?: any;
statusId: any;
userLoginId: any;
}) {
const router = useRouter();
const [opened, { open, close }] = useDisclosure(false);
const [openDel, setOpenDel] = useState(false);
const [userLoginId, setUserLoginId] = useState("");
const [openStatusClose, setOpenStatusClose] = useState(false);
// loading
const [loadingEdit, setLoadingEdit] = useState(false);
@@ -48,15 +60,6 @@ export default function ComponentForum_DetailMoreButton({
// if (loadingEdit) return <ComponentGlobal_V2_LoadingPage />;
useShallowEffect(() => {
getUserLoginId();
}, []);
async function getUserLoginId() {
const getUserLoginId = await User_getUserId();
setUserLoginId(getUserLoginId);
}
return (
<>
<Drawer
@@ -73,6 +76,28 @@ export default function ComponentForum_DetailMoreButton({
""
) : (
<Stack>
<Grid
onClick={() => {
close();
setOpenStatusClose(true);
}}
>
<Grid.Col span={"content"}>
{statusId === 1 ? (
<IconSquareRoundedX color="red" />
) : (
<IconSquareCheck />
)}
</Grid.Col>
<Grid.Col span={"auto"}>
{statusId === 1 ? (
<Text c={"red"}>Tutup forum</Text>
) : (
<Text>Buka forum</Text>
)}
</Grid.Col>
</Grid>
<Grid
onClick={() => {
close();
@@ -146,6 +171,19 @@ export default function ComponentForum_DetailMoreButton({
<ButtonDelete postingId={postingId} setOpenDel={setOpenDel} />
</Modal>
<Modal
opened={openStatusClose}
onClose={() => setOpenStatusClose(false)}
centered
withCloseButton={false}
>
<ButtonStatus
postingId={postingId}
setOpenStatus={setOpenStatusClose}
statusId={statusId}
/>
</Modal>
<ActionIcon variant="transparent" onClick={() => open()}>
<IconDots size={20} />
</ActionIcon>
@@ -201,3 +239,84 @@ function ButtonDelete({
</>
);
}
function ButtonStatus({
postingId,
setOpenStatus,
statusId,
}: {
postingId?: string;
setOpenStatus: any;
statusId?: any;
}) {
const [loading, setLoading] = useState(false);
async function onTutupForum() {
setOpenStatus(false);
await forum_funEditStatusPostingById(postingId as any, 2).then((res) => {
if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(`Forum Ditutup`, 2000);
setLoading(true);
} else {
ComponentGlobal_NotifikasiGagal(res.message);
}
});
}
async function onBukaForum() {
setOpenStatus(false);
await forum_funEditStatusPostingById(postingId as any, 1).then((res) => {
if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(`Forum Dibuka`, 2000);
setLoading(true);
} else {
ComponentGlobal_NotifikasiGagal(res.message);
}
});
}
return (
<>
<Stack>
{statusId === 1 ? (
<Title order={6}>Yakin menutup forum ini ?</Title>
) : (
<Title order={6}>Yakin membuka forum ini ?</Title>
)}
<Group position="center">
<Button radius={"xl"} onClick={() => setOpenStatus(false)}>
Batal
</Button>
{statusId === 1 ? (
<Button
loaderPosition="center"
loading={loading ? true : false}
color="red"
radius={"xl"}
onClick={() => {
onTutupForum();
}}
>
Hapus
</Button>
) : (
<Button
loaderPosition="center"
loading={loading ? true : false}
color="green"
radius={"xl"}
onClick={() => {
onBukaForum();
}}
>
Buka
</Button>
)}
</Group>
</Stack>
</>
);
}

161
src/app_modules/forum/component/more_button/posting_button_more.tsx
View File

@@ -17,7 +17,14 @@ import {
Loader,
} from "@mantine/core";
import { useDisclosure, useShallowEffect } from "@mantine/hooks";
import { IconTrash, IconEdit, IconFlag3, IconDots } from "@tabler/icons-react";
import {
IconTrash,
IconEdit,
IconFlag3,
IconDots,
IconSquareRoundedX,
IconSquareCheck,
} from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
@@ -29,18 +36,25 @@ import ComponentForum_LoadingDrawer from "../loading_drawer";
import { User_getUserId } from "@/app_modules/fun_global/get_user_token";
import { forum_funDeletePostingById } from "../../fun/delete/fun_delete_posting_by_id";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/component_global/notif_global/notifikasi_gagal";
import { forum_funEditStatusPostingById } from "../../fun/edit/fun_edit_status_posting_by_id";
export default function ComponentForum_PostingButtonMore({
authorId,
postingId,
statusId,
userLoginId,
}: {
authorId: any;
postingId?: any;
statusId?: any;
userLoginId: any;
}) {
const router = useRouter();
// modal & drawer
const [opened, { open, close }] = useDisclosure(false);
const [openDel, setOpenDel] = useState(false);
const [userLoginId, setUserLoginId] = useState("");
const [openStatusClose, setOpenStatusClose] = useState(false);
// loading
const [loadingEdit, setLoadingEdit] = useState(false);
@@ -48,15 +62,6 @@ export default function ComponentForum_PostingButtonMore({
// if (loadingEdit) return <ComponentGlobal_V2_LoadingPage />;
useShallowEffect(() => {
getUserLoginId();
}, []);
async function getUserLoginId() {
const getUserLoginId = await User_getUserId();
setUserLoginId(getUserLoginId);
}
return (
<>
<Drawer
@@ -73,6 +78,28 @@ export default function ComponentForum_PostingButtonMore({
""
) : (
<Stack>
<Grid
onClick={() => {
close();
setOpenStatusClose(true);
}}
>
<Grid.Col span={"content"}>
{statusId === 1 ? (
<IconSquareRoundedX color="red" />
) : (
<IconSquareCheck />
)}
</Grid.Col>
<Grid.Col span={"auto"}>
{statusId === 1 ? (
<Text c={"red"}>Tutup forum</Text>
) : (
<Text>Buka forum</Text>
)}
</Grid.Col>
</Grid>
<Grid
onClick={() => {
close();
@@ -146,6 +173,19 @@ export default function ComponentForum_PostingButtonMore({
<ButtonDelete postingId={postingId} setOpenDel={setOpenDel} />
</Modal>
<Modal
opened={openStatusClose}
onClose={() => setOpenStatusClose(false)}
centered
withCloseButton={false}
>
<ButtonStatus
postingId={postingId}
setOpenStatus={setOpenStatusClose}
statusId={statusId}
/>
</Modal>
<ActionIcon variant="transparent" onClick={() => open()}>
<IconDots size={20} />
</ActionIcon>
@@ -160,18 +200,18 @@ function ButtonDelete({
postingId?: string;
setOpenDel: any;
}) {
const [loading, setLoading] = useState(false);
const [loading, setLoading] = useState(false);
async function onDelete() {
setOpenDel(false);
await forum_funDeletePostingById(postingId as any).then((res) => {
if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(`Postingan Terhapus`, 2000);
setLoading(true)
} else {
ComponentGlobal_NotifikasiGagal(res.message);
}
});
await forum_funDeletePostingById(postingId as any).then((res) => {
if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(`Postingan Terhapus`, 2000);
setLoading(true);
} else {
ComponentGlobal_NotifikasiGagal(res.message);
}
});
}
return (
<>
@@ -197,3 +237,84 @@ function ButtonDelete({
</>
);
}
function ButtonStatus({
postingId,
setOpenStatus,
statusId,
}: {
postingId?: string;
setOpenStatus: any;
statusId?: any;
}) {
const [loading, setLoading] = useState(false);
async function onTutupForum() {
setOpenStatus(false);
await forum_funEditStatusPostingById(postingId as any, 2).then((res) => {
if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(`Forum Ditutup`, 2000);
setLoading(true);
} else {
ComponentGlobal_NotifikasiGagal(res.message);
}
});
}
async function onBukaForum() {
setOpenStatus(false);
await forum_funEditStatusPostingById(postingId as any, 1).then((res) => {
if (res.status === 200) {
ComponentGlobal_NotifikasiBerhasil(`Forum Dibuka`, 2000);
setLoading(true);
} else {
ComponentGlobal_NotifikasiGagal(res.message);
}
});
}
return (
<>
<Stack>
{statusId === 1 ? (
<Title order={6}>Yakin menutup forum ini ?</Title>
) : (
<Title order={6}>Yakin membuka forum ini ?</Title>
)}
<Group position="center">
<Button radius={"xl"} onClick={() => setOpenStatus(false)}>
Batal
</Button>
{statusId === 1 ? (
<Button
loaderPosition="center"
loading={loading ? true : false}
color="red"
radius={"xl"}
onClick={() => {
onTutupForum();
}}
>
Hapus
</Button>
) : (
<Button
loaderPosition="center"
loading={loading ? true : false}
color="green"
radius={"xl"}
onClick={() => {
onBukaForum();
}}
>
Buka
</Button>
)}
</Group>
</Stack>
</>
);
}