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

fix responsive admin forum

Browse Source 
deskripsi:
- fix table
This commit is contained in:
Bagasbanuna02
2025-04-16 15:11:39 +08:00
parent f41cbba21f
commit f489d9acb7
11 changed files with 772 additions and 853 deletions
Download Patch File Download Diff File Expand all files Collapse all files

229
src/app/api/admin/forum/komentar/route.ts
View File

@@ -1,121 +1,128 @@
import { prisma } from "@/lib"; import { prisma } from "@/lib";
import backendLogger from "@/util/backendLogger"; import backendLogger from "@/util/backendLogger";
import _ from 'lodash'; import _ from "lodash";
import { NextResponse } from "next/server"; import { NextResponse } from "next/server";
export async function GET(request: Request) { export async function GET(request: Request) {
const { searchParams } = new URL(request.url);
const search = searchParams.get("search");
const page = searchParams.get("page");
const takeData = 10;
const skipData = Number(page) * takeData - takeData;
const { searchParams } = new URL(request.url); try {
const search = searchParams.get("search"); let fixData;
const page = searchParams.get("page");
const takeData = 10;
const skipData = Number(page) * takeData - takeData;
console.log("Ini page", page) if (!page) {
fixData = await prisma.forum_ReportKomentar.findMany({
try { orderBy: {
let fixData; createdAt: "desc",
},
if (!page) { where: {
fixData = await prisma.forum_ReportKomentar.findMany({ Forum_Komentar: {
isActive: true,
orderBy: { komentar: {
createdAt: "desc" contains: search ? search : "",
}, mode: "insensitive",
where: { },
Forum_Komentar: { },
isActive: true, },
komentar: { select: {
contains: search ? search : "", id: true,
mode: "insensitive", isActive: true,
}, createdAt: true,
}, deskripsi: true,
}, ForumMaster_KategoriReport: true,
select: { User: {
id: true, select: {
isActive: true, username: true,
createdAt: true, Profile: {
deskripsi: true, select: {
ForumMaster_KategoriReport: true, id: true,
User: { name: true,
select: {
Profile: {
select: {
id: true,
name: true,
},
},
},
},
},
})
} else {
const data = await prisma.forum_ReportKomentar.findMany({
take: takeData,
skip: skipData,
orderBy: {
createdAt: "desc",
}, },
where: { },
Forum_Komentar: { },
isActive: true, },
komentar: { Forum_Komentar: {
contains: search ? search : "", select: {
mode: "insensitive", komentar: true,
}, },
}, },
}, },
select: { });
id: true, } else {
isActive: true, const data = await prisma.forum_ReportKomentar.findMany({
createdAt: true, take: takeData,
deskripsi: true, skip: skipData,
ForumMaster_KategoriReport: true, orderBy: {
User: { createdAt: "desc",
select: { },
Profile: { where: {
select: { Forum_Komentar: {
id: true, isActive: true,
name: true, komentar: {
}, contains: search ? search : "",
}, mode: "insensitive",
}, },
}, },
}, },
}) select: {
const nCount = await prisma.forum_ReportKomentar.count({ id: true,
where: { isActive: true,
Forum_Komentar: { createdAt: true,
isActive: true, deskripsi: true,
komentar: { ForumMaster_KategoriReport: true,
contains: search ? search : "", User: {
mode: "insensitive", select: {
}, username: true,
}, Profile: {
} select: {
}) id: true,
name: true,
},
},
},
},
Forum_Komentar: {
select: {
komentar: true,
},
},
},
});
const nCount = await prisma.forum_ReportKomentar.count({
where: {
Forum_Komentar: {
isActive: true,
komentar: {
contains: search ? search : "",
mode: "insensitive",
},
},
},
});
fixData = { fixData = {
data: data, data: data,
nCount: _.ceil(nCount / takeData) nCount: _.ceil(nCount / takeData),
} };
}
return NextResponse.json({
success: true,
message: "Success get data forum komentar",
data: fixData,
},
{ status: 200 }
)
} catch (error) {
backendLogger.error("Error get data forum komentar", error);
return NextResponse.json({
success: false,
message: "Error get data forum komentar",
reason: (error as Error).message
},
)
} }
}
return NextResponse.json(
{
success: true,
message: "Success get data forum komentar",
data: fixData,
},
{ status: 200 }
);
} catch (error) {
backendLogger.error("Error get data forum komentar", error);
return NextResponse.json({
success: false,
message: "Error get data forum komentar",
reason: (error as Error).message,
});
}
}

276
src/app/api/admin/forum/posting/route.ts
View File

@@ -4,140 +4,150 @@ import _ from "lodash";
import { NextResponse } from "next/server"; import { NextResponse } from "next/server";
export async function GET(request: Request) { export async function GET(request: Request) {
const { searchParams } = new URL(request.url);
const { searchParams } = new URL(request.url); const search = searchParams.get("search");
const search = searchParams.get('search'); const page = searchParams.get("page");
const page = searchParams.get('page'); const takeData = 10;
const takeData = 10; const skipData = Number(page) * takeData - takeData;
const skipData = Number(page) * takeData - takeData;
try { try {
let fixData; let fixData;
if (!page) { if (!page) {
fixData = await prisma.forum_ReportPosting.findMany({ fixData = await prisma.forum_ReportPosting.findMany({
orderBy: {
orderBy: { createdAt: "desc",
createdAt: "desc",
},
where: {
Forum_Posting: {
isActive: true,
diskusi: {
contains: search ? search : '',
mode: "insensitive"
}
},
},
select: {
id: true,
deskripsi: true,
createdAt: true,
User: {
select: {
id: true,
username: true,
Profile: {
select: {
name: true,
},
},
},
},
ForumMaster_KategoriReport: {
select: {
id: true,
title: true,
deskripsi: true,
},
},
},
});
} else {
const data = await prisma.forum_ReportPosting.findMany({
take: takeData,
skip: skipData,
orderBy: {
createdAt: "desc",
},
where: {
Forum_Posting: {
isActive: true,
diskusi: {
contains: search ? search : '',
mode: "insensitive"
}
},
},
select: {
id: true,
isActive: true,
createdAt: true,
deskripsi: true,
forumMaster_KategoriReportId: true,
ForumMaster_KategoriReport: {
select: {
id: true,
title: true,
deskripsi: true,
},
},
forum_PostingId: true,
Forum_Posting: {
select: {
id: true,
diskusi: true,
ForumMaster_StatusPosting: {
select: {
id: true,
status: true,
}
},
Author: {
select: {
id: true,
username: true
}
}
},
},
userId: true,
User: {
select: {
id: true,
username: true,
},
},
},
});
const nCount = await prisma.forum_ReportPosting.count({
where: {
isActive: true,
}
})
fixData = {
data: data,
nCount: _.ceil(nCount / takeData)
}
}
return NextResponse.json({
success: true,
message: "Success get data forum posting",
data: fixData
}, },
{ status: 200 } where: {
) Forum_Posting: {
} catch (error) { isActive: true,
backendLogger.error("Error get data forum posting >>", error); diskusi: {
return NextResponse.json({ contains: search ? search : "",
success: false, mode: "insensitive",
message: "Error get data forum posting", },
},
}, },
{ status: 500 } select: {
) id: true,
} deskripsi: true,
} createdAt: true,
User: {
select: {
id: true,
username: true,
Profile: {
select: {
name: true,
},
},
},
},
ForumMaster_KategoriReport: {
select: {
id: true,
title: true,
deskripsi: true,
},
},
Forum_Posting: {
select: {
diskusi: true,
},
},
},
});
} else {
const data = await prisma.forum_ReportPosting.findMany({
take: takeData,
skip: skipData,
orderBy: {
createdAt: "desc",
},
where: {
Forum_Posting: {
isActive: true,
diskusi: {
contains: search ? search : "",
mode: "insensitive",
},
},
},
select: {
id: true,
isActive: true,
createdAt: true,
deskripsi: true,
forumMaster_KategoriReportId: true,
ForumMaster_KategoriReport: {
select: {
id: true,
title: true,
deskripsi: true,
},
},
forum_PostingId: true,
Forum_Posting: {
select: {
id: true,
diskusi: true,
ForumMaster_StatusPosting: {
select: {
id: true,
status: true,
},
},
Author: {
select: {
id: true,
username: true,
},
},
},
},
userId: true,
User: {
select: {
id: true,
username: true,
},
},
},
});
const nCount = await prisma.forum_ReportPosting.count({
where: {
Forum_Posting: {
isActive: true,
diskusi: {
contains: search ? search : "",
mode: "insensitive",
},
},
},
});
fixData = {
data: data,
nCount: _.ceil(nCount / takeData),
};
}
return NextResponse.json(
{
success: true,
message: "Success get data forum posting",
data: fixData,
},
{ status: 200 }
);
} catch (error) {
backendLogger.error("Error get data forum posting >>", error);
return NextResponse.json(
{
success: false,
message: "Error get data forum posting",
},
{ status: 500 }
);
}
}

216
src/app/api/admin/forum/publish/route.ts
View File

@@ -4,116 +4,116 @@ import _ from "lodash";
import { NextResponse } from "next/server"; import { NextResponse } from "next/server";
export async function GET(request: Request) { export async function GET(request: Request) {
const { searchParams } = new URL(request.url);
const search = searchParams.get("search");
const page = searchParams.get("page");
const takeData = 10;
const skipData = Number(page) * takeData - takeData;
const { searchParams } = new URL(request.url); try {
const search = searchParams.get("search"); let fixData;
const page = searchParams.get("page");
const takeData = 10;
const skipData = Number(page) * takeData - takeData;
try { if (!page) {
let fixData; fixData = await prisma.forum_Posting.findMany({
orderBy: {
if (!page) { createdAt: "desc",
fixData = await prisma.forum_Posting.findMany({
orderBy: {
createdAt: "desc",
},
where: {
isActive: true,
diskusi: {
contains: search ? search : "",
mode: "insensitive",
},
},
select: {
id: true,
diskusi: true,
isActive: true,
createdAt: true,
Author: {
select: {
id: true,
username: true,
Profile: true,
},
},
Forum_ReportPosting: true,
Forum_Komentar: {
where: {
isActive: true,
},
},
ForumMaster_StatusPosting: true,
},
});
} else {
const data = await prisma.forum_Posting.findMany({
take: takeData,
skip: skipData,
orderBy: {
createdAt: "desc",
},
where: {
isActive: true,
diskusi: {
contains: search ? search : "",
mode: "insensitive",
},
},
select: {
id: true,
diskusi: true,
isActive: true,
createdAt: true,
Author: {
select: {
id: true,
username: true,
Profile: true,
},
},
Forum_ReportPosting: true,
Forum_Komentar: {
where: {
isActive: true,
},
},
ForumMaster_StatusPosting: true,
},
});
const nCount = await prisma.forum_Posting.count({
where: {
isActive: true,
diskusi: {
contains: search ? search : "",
mode: "insensitive",
},
},
});
fixData = {
data: data,
nCount: _.ceil(nCount / takeData)
}
}
return NextResponse.json({
success: true,
message: "Success get data table forum",
data: fixData
}, },
{ status: 200 } where: {
) isActive: true,
} catch (error) { diskusi: {
backendLogger.error("Error get data table forum", error) contains: search ? search : "",
return NextResponse.json({ mode: "insensitive",
success: false, },
message: "Error get data table forum",
reason: (error as Error)
}, },
{ status: 500 } select: {
) id: true,
diskusi: true,
isActive: true,
createdAt: true,
Author: {
select: {
id: true,
username: true,
Profile: true,
},
},
Forum_ReportPosting: true,
Forum_Komentar: {
where: {
isActive: true,
},
},
ForumMaster_StatusPosting: true,
},
});
} else {
const data = await prisma.forum_Posting.findMany({
take: takeData,
skip: skipData,
orderBy: {
createdAt: "desc",
},
where: {
isActive: true,
diskusi: {
contains: search ? search : "",
mode: "insensitive",
},
},
select: {
id: true,
diskusi: true,
isActive: true,
createdAt: true,
Author: {
select: {
id: true,
username: true,
Profile: true,
},
},
Forum_ReportPosting: true,
Forum_Komentar: {
where: {
isActive: true,
},
},
ForumMaster_StatusPosting: true,
},
});
const nCount = await prisma.forum_Posting.count({
where: {
isActive: true,
diskusi: {
contains: search ? search : "",
mode: "insensitive",
},
},
});
fixData = {
data: data,
nCount: _.ceil(nCount / takeData),
};
} }
} return NextResponse.json(
{
success: true,
message: "Success get data table forum",
data: fixData,
},
{ status: 200 }
);
} catch (error) {
backendLogger.error("Error get data table forum", error);
return NextResponse.json(
{
success: false,
message: "Error get data table forum",
reason: error as Error,
},
{ status: 500 }
);
}
}

18
src/app/dev/admin/forum/main/page.tsx
View File

@@ -1,23 +1,13 @@
import { AdminForum_Main } from "@/app_modules/admin/forum"; import { AdminForum_Main } from "@/app_modules/admin/forum";
import { adminForum_countLaporanKomentar } from "@/app_modules/admin/forum/fun/count/fun_count_laporan_komentar";
import { adminForum_countLaporanPosting } from "@/app_modules/admin/forum/fun/count/fun_count_laporan_posting";
import { adminForum_countPublish } from "@/app_modules/admin/forum/fun/count/fun_count_publish";
export default async function Page() { export default async function Page() {
// await new Promise((a, b) => { // await new Promise((a, b) => {
// setTimeout(a, 4000); // setTimeout(a, 4000);
// }); // });
const countPublish = await adminForum_countPublish();
const countLaporanPosting = await adminForum_countLaporanPosting()
const countLaporanKomentar = await adminForum_countLaporanKomentar();
return ( return (
<> <>
<AdminForum_Main <AdminForum_Main />
// countPublish={countPublish}
// countLaporanPosting={countLaporanPosting}
// countLaporanKomentar={countLaporanKomentar}
/>
</> </>
); );
} }

5
src/app/dev/admin/forum/sub-menu/posting/page.tsx
View File

@@ -1,12 +1,9 @@
import { AdminForum_TablePublish } from "@/app_modules/admin/forum"; import { AdminForum_TablePublish } from "@/app_modules/admin/forum";
import { adminForum_getListPosting } from "@/app_modules/admin/forum/fun/get/get_list_publish";
export default async function Page() { export default async function Page() {
return ( return (
<> <>
<AdminForum_TablePublish /> <AdminForum_TablePublish />
</> </>
); );
} }

250
src/app_modules/admin/forum/lib/api_fetch_admin_forum.ts
View File

@@ -1,133 +1,161 @@
export { export {
apiGetAdminForumPublishCountDasboard, apiGetAdminForumPublishCountDasboard,
apiGetAdminCountForumReportPosting, apiGetAdminCountForumReportPosting,
apiGetAdminCountForumReportKomentar, apiGetAdminCountForumReportKomentar,
apiGetAdminForumReportPosting, apiGetAdminForumReportPosting,
apiGetAdminForumReportKomentar, apiGetAdminForumReportKomentar,
apiGetAdminForumPublish, apiGetAdminForumPublish,
apiGetAdminHasilReportPosting apiGetAdminHasilReportPosting,
} };
const apiGetAdminForumPublishCountDasboard = async () => { const apiGetAdminForumPublishCountDasboard = async () => {
const { token } = await fetch("/api/get-cookie").then((res) => res.json()); const { token } = await fetch("/api/get-cookie").then((res) => res.json());
if (!token) return await token.json().catch(() => null); if (!token) return await token.json().catch(() => null);
const response = await fetch(`/api/admin/forum/dashboard/publish`, { const response = await fetch(`/api/admin/forum/dashboard/publish`, {
method: "GET", method: "GET",
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
Accept: "application/json", Accept: "application/json",
"Access-Control-Allow-Origin": "*", "Access-Control-Allow-Origin": "*",
Authorization: `Bearer ${token}`, Authorization: `Bearer ${token}`,
}, },
}) });
return await response.json().catch(() => null); return await response.json().catch(() => null);
} };
const apiGetAdminCountForumReportPosting = async () => { const apiGetAdminCountForumReportPosting = async () => {
const { token } = await fetch("/api/get-cookie").then((res) => res.json()); const { token } = await fetch("/api/get-cookie").then((res) => res.json());
if (!token) return await token.json().catch(() => null); if (!token) return await token.json().catch(() => null);
const response = await fetch(`/api/admin/forum/dashboard/report_posting`, { const response = await fetch(`/api/admin/forum/dashboard/report_posting`, {
method: "GET", method: "GET",
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
Accept: "application/json", Accept: "application/json",
"Access-Control-Allow-Origin": "*", "Access-Control-Allow-Origin": "*",
Authorization: `Bearer ${token}`, Authorization: `Bearer ${token}`,
}, },
}) });
return await response.json().catch(() => null);
return await response.json().catch(() => null); };
}
const apiGetAdminCountForumReportKomentar = async () => { const apiGetAdminCountForumReportKomentar = async () => {
const { token } = await fetch("/api/get-cookie").then((res) => res.json()); const { token } = await fetch("/api/get-cookie").then((res) => res.json());
if (!token) return await token.json().catch(() => null); if (!token) return await token.json().catch(() => null);
const response = await fetch(`/api/admin/forum/dashboard/report_komentar`, { const response = await fetch(`/api/admin/forum/dashboard/report_komentar`, {
method: "GET", method: "GET",
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
Accept: "application/json", Accept: "application/json",
"Access-Control-Allow-Origin": "*", "Access-Control-Allow-Origin": "*",
Authorization: `Bearer ${token}`, Authorization: `Bearer ${token}`,
}, },
}) });
return await response.json().catch(() => null); return await response.json().catch(() => null);
} };
const apiGetAdminForumReportPosting = async ({ page }: { page?: string }) => { const apiGetAdminForumReportPosting = async ({
const { token } = await fetch("/api/get-cookie").then((res) => res.json()); page,
if (!token) return await token.json().catch(() => null); search,
}: {
page?: string;
search?: string;
}) => {
const { token } = await fetch("/api/get-cookie").then((res) => res.json());
if (!token) return await token.json().catch(() => null);
const isPage = page ? `?page=${page}` : ""; const isPage = page ? `?page=${page}` : "";
const response = await fetch(`/api/admin/forum/posting${isPage}`, { const isSeach = search ? `&search=${search}` : "";
method: "GET", const response = await fetch(`/api/admin/forum/posting${isPage}${isSeach}`, {
headers: { method: "GET",
"Content-Type": "application/json", headers: {
Accept: "application/json", "Content-Type": "application/json",
"Access-Control-Allow-Origin": "*", Accept: "application/json",
Authorization: `Bearer ${token}`, "Access-Control-Allow-Origin": "*",
}, Authorization: `Bearer ${token}`,
}) },
});
return await response.json().catch(() => null); return await response.json().catch(() => null);
} };
const apiGetAdminForumReportKomentar = async ({ page }: { page?: string }) => { const apiGetAdminForumReportKomentar = async ({
const { token } = await fetch("/api/get-cookie").then((res) => res.json()); page,
if (!token) return await token.json().catch(() => null); search,
}: {
page?: string;
search?: string;
}) => {
const { token } = await fetch("/api/get-cookie").then((res) => res.json());
if (!token) return await token.json().catch(() => null);
const isPage = page ? `?page=${page}` : ""; const isPage = page ? `?page=${page}` : "";
const response = await fetch(`/api/admin/forum/komentar${isPage}`, { const isSeach = search ? `&search=${search}` : "";
method: "GET", const response = await fetch(`/api/admin/forum/komentar${isPage}${isSeach}`, {
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
Accept: "application/json", Accept: "application/json",
"Access-Control-Allow-Origin": "*", "Access-Control-Allow-Origin": "*",
Authorization: `Bearer ${token}`, Authorization: `Bearer ${token}`,
}, },
}) });
return await response.json().catch(() => null); return await response.json().catch(() => null);
} };
const apiGetAdminForumPublish = async ( const apiGetAdminForumPublish = async ({
{ page }: { page?: string }) => { page,
const { token } = await fetch("/api/get-cookie").then((res) => res.json()); search,
if (!token) return await token.json().catch(() => null); }: {
page?: string;
search?: string;
}) => {
const { token } = await fetch("/api/get-cookie").then((res) => res.json());
if (!token) return await token.json().catch(() => null);
const isPage = page ? `?page=${page}` : ""; const isPage = page ? `?page=${page}` : "";
const response = await fetch(`/api/admin/forum/publish/${isPage}`, { const isSearch = search ? `&search=${search}` : "";
method: "GET", const response = await fetch(
headers: { `/api/admin/forum/publish/${isPage}${isSearch}`,
"Content-Type": "application/json", {
Accept: "application/json", method: "GET",
"Access-Control-Allow-Origin": "*", headers: {
Authorization: `Bearer ${token}`, "Content-Type": "application/json",
}, Accept: "application/json",
}) "Access-Control-Allow-Origin": "*",
Authorization: `Bearer ${token}`,
},
}
);
return await response.json().catch(() => null);
};
return await response.json().catch(() => null); const apiGetAdminHasilReportPosting = async ({
} page,
id,
}: {
page?: string;
id: string;
}) => {
const { token } = await fetch("/api/get-cookie").then((res) => res.json());
if (!token) return await token.json().catch(() => null);
const apiGetAdminHasilReportPosting = async ({ page, id }: { page?: string, id: string }) => { const isPage = page ? `?page=${page}` : "";
const { token } = await fetch("/api/get-cookie").then((res) => res.json()); const response = await fetch(
if (!token) return await token.json().catch(() => null); `/api/admin/forum/${id}/report_posting${isPage}`,
{
method: "GET",
headers: {
"Content-Type": "application/json",
Accept: "application/json",
"Access-Control-Allow-Origin": "*",
Authorization: `Bearer ${token}`,
},
}
);
const isPage = page ? `?page=${page}` : ""; return await response.json().catch(() => null);
const response = await fetch(`/api/admin/forum/${id}/report_posting${isPage}`, { };
method: "GET",
headers: {
"Content-Type": "application/json",
Accept: "application/json",
"Access-Control-Allow-Origin": "*",
Authorization: `Bearer ${token}`,
}
})
return await response.json().catch(() => null);
}

129
src/app_modules/admin/forum/main/dashboard.tsx
View File

@@ -1,27 +1,38 @@
"use client"; "use client";
import { Flex, Group, Paper, SimpleGrid, Stack, Text, ThemeIcon, Title } from "@mantine/core";
import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
import { IconFlag, IconMessageReport, IconUpload } from "@tabler/icons-react";
import { AccentColor } from "@/app_modules/_global/color"; import { AccentColor } from "@/app_modules/_global/color";
import { AdminColor } from "@/app_modules/_global/color/color_pallet"; import { AdminColor } from "@/app_modules/_global/color/color_pallet";
import { useShallowEffect } from "@mantine/hooks";
import { clientLogger } from "@/util/clientLogger";
import global_limit from "@/lib/limit";
import { apiGetAdminCountForumReportKomentar, apiGetAdminCountForumReportPosting, apiGetAdminForumPublishCountDasboard } from "../lib/api_fetch_admin_forum";
import { useState } from "react";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton"; import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import global_limit from "@/lib/limit";
import { clientLogger } from "@/util/clientLogger";
import {
Flex,
Paper,
SimpleGrid,
Stack,
Text,
ThemeIcon,
Title,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconFlag, IconMessageReport, IconUpload } from "@tabler/icons-react";
import { useState } from "react";
import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
import {
apiGetAdminCountForumReportKomentar,
apiGetAdminCountForumReportPosting,
apiGetAdminForumPublish,
apiGetAdminForumPublishCountDasboard,
apiGetAdminForumReportKomentar,
apiGetAdminForumReportPosting,
} from "../lib/api_fetch_admin_forum";
export default function AdminForum_Main() { export default function AdminForum_Main() {
return ( return (
<> <>
<Stack> <Stack>
<ComponentAdminGlobal_HeaderTamplate name="Forum" /> <ComponentAdminGlobal_HeaderTamplate name="Forum" />
<ForumMain <ForumMain />
// countPublish={countPublish}
// countLaporanPosting={countLaporanPosting}
// countLaporanKomentar={countLaporanKomentar}
/>
</Stack> </Stack>
</> </>
); );
@@ -29,13 +40,16 @@ export default function AdminForum_Main() {
function ForumMain() { function ForumMain() {
const [countPublish, setCountPublish] = useState<number | null>(null); const [countPublish, setCountPublish] = useState<number | null>(null);
const [countLaporanPosting, setCountLaporanPosting] = useState<number | null>(null); const [countLaporanPosting, setCountLaporanPosting] = useState<number | null>(
const [countLaporanKomentar, setCountLaporanKomentar] = useState<number | null>(null); null
);
const [countLaporanKomentar, setCountLaporanKomentar] = useState<
number | null
>(null);
useShallowEffect(() => { useShallowEffect(() => {
handlerLoadData(); handlerLoadData();
}, []) }, []);
async function handlerLoadData() { async function handlerLoadData() {
try { try {
@@ -43,7 +57,7 @@ function ForumMain() {
global_limit(() => onLoadCountPublish()), global_limit(() => onLoadCountPublish()),
global_limit(() => onLoadCountReportPosting()), global_limit(() => onLoadCountReportPosting()),
global_limit(() => onLoadCountReportKomentar()), global_limit(() => onLoadCountReportKomentar()),
] ];
const result = await Promise.all(listLoadData); const result = await Promise.all(listLoadData);
} catch (error) { } catch (error) {
clientLogger.error("Error handler load data", error); clientLogger.error("Error handler load data", error);
@@ -52,9 +66,9 @@ function ForumMain() {
async function onLoadCountPublish() { async function onLoadCountPublish() {
try { try {
const response = await apiGetAdminForumPublishCountDasboard() const response = await apiGetAdminForumPublish({});
if (response) { if (response) {
setCountPublish(response.data) setCountPublish(response.data.length);
} }
} catch (error) { } catch (error) {
clientLogger.error("Error get count publish", error); clientLogger.error("Error get count publish", error);
@@ -63,9 +77,9 @@ function ForumMain() {
async function onLoadCountReportPosting() { async function onLoadCountReportPosting() {
try { try {
const response = await apiGetAdminCountForumReportPosting() const response = await apiGetAdminForumReportPosting({});
if (response) { if (response) {
setCountLaporanPosting(response.data) setCountLaporanPosting(response.data.length);
} }
} catch (error) { } catch (error) {
clientLogger.error("Error get count publish", error); clientLogger.error("Error get count publish", error);
@@ -74,9 +88,9 @@ function ForumMain() {
async function onLoadCountReportKomentar() { async function onLoadCountReportKomentar() {
try { try {
const response = await apiGetAdminCountForumReportKomentar() const response = await apiGetAdminForumReportKomentar({});
if (response) { if (response) {
setCountLaporanKomentar(response.data) setCountLaporanKomentar(response.data.length);
} }
} catch (error) { } catch (error) {
clientLogger.error("Error get count publish", error); clientLogger.error("Error get count publish", error);
@@ -87,41 +101,44 @@ function ForumMain() {
{ {
id: 1, id: 1,
name: "Publish", name: "Publish",
jumlah: countPublish == null ? ( jumlah:
<CustomSkeleton width={40} height={40} /> countPublish == null ? (
) : countPublish ? ( <CustomSkeleton width={40} height={40} />
countPublish ) : countPublish ? (
) : ( countPublish
"-" ) : (
), "-"
),
color: "green", color: "green",
icon: <IconUpload size={18} color="#4CAF4F" /> icon: <IconUpload size={18} color="#4CAF4F" />,
}, },
{ {
id: 2, id: 2,
name: "Report Posting", name: "Report Posting",
jumlah: countLaporanPosting == null ? ( jumlah:
<CustomSkeleton width={40} height={40} /> countLaporanPosting == null ? (
) : countLaporanPosting ? ( <CustomSkeleton width={40} height={40} />
countLaporanPosting ) : countLaporanPosting ? (
) : ( countLaporanPosting
"-" ) : (
), "-"
),
color: "orange", color: "orange",
icon: <IconFlag size={18} color="#FF9800" /> icon: <IconFlag size={18} color="#FF9800" />,
}, },
{ {
id: 3, id: 3,
name: "Report Komentar", name: "Report Komentar",
jumlah: countLaporanKomentar == null ? ( jumlah:
<CustomSkeleton width={40} height={40} /> countLaporanKomentar == null ? (
) : countLaporanKomentar ? ( <CustomSkeleton width={40} height={40} />
countLaporanKomentar ) : countLaporanKomentar ? (
) : ( countLaporanKomentar
"-" ) : (
), "-"
),
color: "red", color: "red",
icon: <IconMessageReport size={18} color="#F44336" /> icon: <IconMessageReport size={18} color="#F44336" />,
}, },
]; ];
return ( return (
@@ -142,17 +159,17 @@ function ForumMain() {
shadow="md" shadow="md"
radius="md" radius="md"
p="md" p="md"
// sx={{ borderColor: e.color, borderStyle: "solid" }} // sx={{ borderColor: e.color, borderStyle: "solid" }}
> >
<Stack spacing={0}> <Stack spacing={0}>
<Text fw={"bold"} c={AccentColor.white}>{e.name}</Text> <Text fw={"bold"} c={AccentColor.white}>
{e.name}
</Text>
<Flex align={"center"} justify={"space-between"}> <Flex align={"center"} justify={"space-between"}>
<Title color={AccentColor.white}>{e.jumlah ? e.jumlah : 0}</Title> <Title color={AccentColor.white}>
<ThemeIcon {e.jumlah ? e.jumlah : 0}
radius={"xl"} </Title>
size={"md"} <ThemeIcon radius={"xl"} size={"md"} color={AccentColor.white}>
color={AccentColor.white}
>
{e.icon} {e.icon}
</ThemeIcon> </ThemeIcon>
</Flex> </Flex>

183
src/app_modules/admin/forum/sub_menu/table_posting.tsx
View File

@@ -1,64 +1,60 @@
"use client"; "use client";
import { RouterAdminForum } from "@/lib/router_admin/router_admin_forum";
import { AdminColor } from "@/app_modules/_global/color/color_pallet"; import { AdminColor } from "@/app_modules/_global/color/color_pallet";
import ComponentAdminGlobal_HeaderTamplate from "@/app_modules/admin/_admin_global/header_tamplate"; import ComponentAdminGlobal_HeaderTamplate from "@/app_modules/admin/_admin_global/header_tamplate";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton"; import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import { MODEL_FORUM_POSTING } from "@/app_modules/forum/model/interface"; import { MODEL_FORUM_POSTING } from "@/app_modules/forum/model/interface";
import { RouterAdminForum } from "@/lib/router_admin/router_admin_forum";
import { clientLogger } from "@/util/clientLogger"; import { clientLogger } from "@/util/clientLogger";
import { import {
Badge, Badge,
Box, Box,
Button, Button,
Center, Center,
Pagination,
Paper, Paper,
ScrollArea, ScrollArea,
Spoiler, Spoiler,
Stack, Stack,
Table, Table,
Text, Text,
TextInput TextInput,
} from "@mantine/core"; } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks"; import { useShallowEffect } from "@mantine/hooks";
import { IconFlag3, IconMessageCircle, IconSearch } from "@tabler/icons-react"; import { IconFlag3, IconMessageCircle, IconSearch } from "@tabler/icons-react";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component"; import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
import { Admin_V3_ComponentPaginationBreakpoint } from "../../_components_v3/comp_pagination_breakpoint";
import ComponentAdminForum_ButtonDeletePosting from "../component/button_delete"; import ComponentAdminForum_ButtonDeletePosting from "../component/button_delete";
import { apiGetAdminForumPublish } from "../lib/api_fetch_admin_forum"; import { apiGetAdminForumPublish } from "../lib/api_fetch_admin_forum";
export default function AdminForum_TablePosting() { export default function AdminForum_TablePosting() {
return ( return (
<> <>
<Stack> <Stack>
<ComponentAdminGlobal_HeaderTamplate name="Forum" /> <ComponentAdminGlobal_HeaderTamplate name="Forum" />
<TablePublish /> <TablePublish />
{/* <pre>{JSON.stringify(listPublish, null, 2)}</pre> */}
</Stack> </Stack>
</> </>
); );
} }
function TablePublish() { function TablePublish() {
const router = useRouter(); const router = useRouter();
const [data, setData] = useState<MODEL_FORUM_POSTING[] | null>(null); const [data, setData] = useState<MODEL_FORUM_POSTING[] | null>(null);
const [nPage, setNPage] = useState<number>(1); const [nPage, setNPage] = useState<number>(1);
const [activePage, setActivePage] = useState(1); const [activePage, setActivePage] = useState(1);
const [isSearch, setSearch] = useState(""); const [isSearch, setSearch] = useState("");
const [isDelete, setDelete] = useState(false);
useShallowEffect(() => { useShallowEffect(() => {
const loadInitialData = async () => { const loadInitialData = async () => {
try { try {
const response = await apiGetAdminForumPublish({ const response = await apiGetAdminForumPublish({
page: `${activePage}` page: `${activePage}`,
}) search: isSearch,
});
if (response?.success && response?.data.data) { if (response?.success && response?.data.data) {
setData(response.data.data); setData(response.data.data);
setNPage(response.data.nCount || 1); setNPage(response.data.nCount || 1);
@@ -70,27 +66,22 @@ function TablePublish() {
clientLogger.error("Invlid data format recieved:", error); clientLogger.error("Invlid data format recieved:", error);
setData([]); setData([]);
} }
} };
loadInitialData(); loadInitialData();
}, [activePage, isSearch]); }, [activePage, isSearch, isDelete]);
const onSearch = (searchTerm: string) => { const onSearch = (searchTerm: string) => {
setSearch(searchTerm); setSearch(searchTerm);
setActivePage(1); setActivePage(1);
} };
async function onLoadData() { async function onDelete(val: boolean) {
const loadData = await apiGetAdminForumPublish({ setDelete(val);
page: `${activePage}`
});
setData(loadData.data.data);
setNPage(loadData.data.nCount);
} }
const onPageClick = (page: number) => { const onPageClick = (page: number) => {
setActivePage(page); setActivePage(page);
} };
const renderTableBody = () => { const renderTableBody = () => {
if (!Array.isArray(data) || data.length === 0) { if (!Array.isArray(data) || data.length === 0) {
@@ -102,42 +93,77 @@ function TablePublish() {
</Center> </Center>
</td> </td>
</tr> </tr>
) );
} }
return data?.map((e, i) => ( return data?.map((e, i) => (
<tr key={i}> <tr key={i} style={{
color: AdminColor.white
}}>
{/* Aksi */}
<td> <td>
<Center w={100}> <Stack align="center" spacing={"xs"}>
<Text c={AdminColor.white} lineClamp={1}>{e?.Author?.username}</Text> <ButtonAction postingId={e?.id} />
</Center> <ComponentAdminForum_ButtonDeletePosting
postingId={e?.id}
onSuccesDelete={(val) => {
onDelete(val);
}}
/>
</Stack>
</td> </td>
{/* Status */}
<td> <td>
<Center w={100}> <Center>
<Badge <Badge
color={ color={
(e?.ForumMaster_StatusPosting?.id as any) === 1 ? "green" : "red" (e?.ForumMaster_StatusPosting?.id as any) === 1
? "green"
: "red"
} }
> >
{e?.ForumMaster_StatusPosting?.status} {e?.ForumMaster_StatusPosting?.status}
</Badge> </Badge>
</Center> </Center>
</td> </td>
{/* Author */}
<td> <td>
<Center w={150}> <Box w={100}>
<Text c={AdminColor.white}> <Text lineClamp={1}>
{new Intl.DateTimeFormat("id-ID", { dateStyle: "medium" }).format( {e?.Author?.username}
new Date(e?.createdAt)
)}
</Text> </Text>
</Center> </Box>
</td> </td>
{/* Deskripsi */}
<td>
<Box w={150}>
<Spoiler
// w={400}
maxHeight={50}
hideLabel="sembunyikan"
showLabel="tampilkan"
>
<div
dangerouslySetInnerHTML={{
__html: e?.diskusi,
}}
/>
</Spoiler>
</Box>
</td>
{/* Jumlah komentar */}
<td> <td>
<Center w={150}> <Center w={150}>
<Text c={AdminColor.white} fw={"bold"} fz={"lg"}> <Text fw={"bold"} fz={"lg"}>
{e?.Forum_Komentar.length} {e?.Forum_Komentar.length}
</Text> </Text>
</Center> </Center>
</td> </td>
{/* Jumlah report */}
<td> <td>
<Center w={150}> <Center w={150}>
<Text <Text
@@ -149,23 +175,19 @@ function TablePublish() {
</Text> </Text>
</Center> </Center>
</td> </td>
<td>
<Stack align="center" spacing={"xs"}> {/* <td>
<ButtonAction postingId={e?.id} /> <Box w={100}>
<ComponentAdminForum_ButtonDeletePosting <Text>
postingId={e?.id} {new Intl.DateTimeFormat("id-ID", { dateStyle: "medium" }).format(
onSuccesDelete={(val) => { new Date(e?.createdAt)
if (val) { )}
onLoadData(); </Text>
} </Box>
}} </td> */}
/>
</Stack>
</td>
</tr> </tr>
)); ));
} };
return ( return (
<> <>
@@ -184,25 +206,6 @@ function TablePublish() {
/> />
} }
/> />
{/* <Group
position="apart"
bg={"green.4"}
p={"xs"}
style={{ borderRadius: "6px" }}
>
<Title order={4} c={"white"}>
Posting
</Title>
<TextInput
icon={<IconSearch size={20} />}
radius={"xl"}
placeholder="Cari postingan"
onChange={(val) => {
onSearch(val.currentTarget.value);
}}
/>
</Group> */}
{!data ? ( {!data ? (
<CustomSkeleton height={"80vh"} width={"100%"} /> <CustomSkeleton height={"80vh"} width={"100%"} />
@@ -215,19 +218,21 @@ function TablePublish() {
p={"md"} p={"md"}
w={"100%"} w={"100%"}
h={"100%"} h={"100%"}
> >
<thead> <thead>
<tr> <tr>
<th> <th>
<Center c={AdminColor.white}>Username</Center> <Center c={AdminColor.white}>Aksi</Center>
</th> </th>
<th> <th>
<Center c={AdminColor.white}>Status</Center> <Center c={AdminColor.white}>Status</Center>
</th> </th>
<th> <th>
<Center c={AdminColor.white}>Tanggal Publish</Center> <Text c={AdminColor.white}>Username</Text>
</th>
<th>
<Text c={AdminColor.white}>Postingan</Text>
</th> </th>
<th> <th>
<Center c={AdminColor.white}>Komentar Aktif</Center> <Center c={AdminColor.white}>Komentar Aktif</Center>
@@ -235,23 +240,18 @@ function TablePublish() {
<th> <th>
<Center c={AdminColor.white}>Total Report Posting</Center> <Center c={AdminColor.white}>Total Report Posting</Center>
</th> </th>
<th>
<Center c={AdminColor.white}>Aksi</Center>
</th>
</tr> </tr>
</thead> </thead>
<tbody>{renderTableBody()}</tbody> <tbody>{renderTableBody()}</tbody>
</Table> </Table>
</ScrollArea> </ScrollArea>
<Center mt={"xl"}> <Admin_V3_ComponentPaginationBreakpoint
<Pagination value={activePage}
value={activePage} total={nPage}
total={nPage} onChange={(val) => {
onChange={(val) => { onPageClick(val);
onPageClick(val); }}
}} />
/>
</Center>
</Paper> </Paper>
)} )}
</Stack> </Stack>
@@ -259,13 +259,11 @@ function TablePublish() {
); );
} }
function ButtonAction({ postingId }: { postingId: string }) { function ButtonAction({ postingId }: { postingId: string }) {
const router = useRouter(); const router = useRouter();
const [loadingKomentar, setLoadingKomentar] = useState(false); const [loadingKomentar, setLoadingKomentar] = useState(false);
const [loadingReport, setLoadingReport] = useState(false); const [loadingReport, setLoadingReport] = useState(false);
return ( return (
<> <>
<Button <Button
@@ -300,13 +298,11 @@ function ButtonAction({ postingId }: { postingId: string }) {
); );
} }
// function ButtonDeletePosting({ postingId }: { postingId: string }) { // function ButtonDeletePosting({ postingId }: { postingId: string }) {
// const [opened, { open, close }] = useDisclosure(false); // const [opened, { open, close }] = useDisclosure(false);
// const [loadingDel, setLoadingDel] = useState(false); // const [loadingDel, setLoadingDel] = useState(false);
// const [loadingDel2, setLoadingDel2] = useState(false); // const [loadingDel2, setLoadingDel2] = useState(false);
// async function onDelete() { // async function onDelete() {
// await adminForum_funDeletePostingById(postingId).then((res) => { // await adminForum_funDeletePostingById(postingId).then((res) => {
// if (res.status === 200) { // if (res.status === 200) {
@@ -374,6 +370,3 @@ function ButtonAction({ postingId }: { postingId: string }) {
// </> // </>
// ); // );
// } // }

152
src/app_modules/admin/forum/sub_menu/table_report_komentar.tsx
View File

@@ -1,19 +1,15 @@
"use client"; "use client";
import { RouterAdminForum } from "@/lib/router_admin/router_admin_forum";
import { AdminColor } from "@/app_modules/_global/color/color_pallet"; import { AdminColor } from "@/app_modules/_global/color/color_pallet";
import ComponentAdminGlobal_HeaderTamplate from "@/app_modules/admin/_admin_global/header_tamplate"; import ComponentAdminGlobal_HeaderTamplate from "@/app_modules/admin/_admin_global/header_tamplate";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton"; import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import { import { MODEL_FORUM_REPORT_KOMENTAR } from "@/app_modules/forum/model/interface";
MODEL_FORUM_REPORT_KOMENTAR import { RouterAdminForum } from "@/lib/router_admin/router_admin_forum";
} from "@/app_modules/forum/model/interface";
import { clientLogger } from "@/util/clientLogger"; import { clientLogger } from "@/util/clientLogger";
import { import {
Box, Box,
Button, Button,
Center, Center,
Pagination,
Paper, Paper,
ScrollArea, ScrollArea,
Spoiler, Spoiler,
@@ -27,9 +23,9 @@ import { IconFlag3, IconSearch } from "@tabler/icons-react";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component"; import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
import { Admin_V3_ComponentPaginationBreakpoint } from "../../_components_v3/comp_pagination_breakpoint";
import { apiGetAdminForumReportKomentar } from "../lib/api_fetch_admin_forum"; import { apiGetAdminForumReportKomentar } from "../lib/api_fetch_admin_forum";
export default function AdminForum_TableReportKomentar() { export default function AdminForum_TableReportKomentar() {
return ( return (
<> <>
@@ -42,7 +38,6 @@ export default function AdminForum_TableReportKomentar() {
); );
} }
function TableView() { function TableView() {
const router = useRouter(); const router = useRouter();
const [data, setData] = useState<MODEL_FORUM_REPORT_KOMENTAR[] | null>(null); const [data, setData] = useState<MODEL_FORUM_REPORT_KOMENTAR[] | null>(null);
@@ -50,50 +45,37 @@ function TableView() {
const [activePage, setActivePage] = useState(1); const [activePage, setActivePage] = useState(1);
const [isSearch, setSearch] = useState(""); const [isSearch, setSearch] = useState("");
useShallowEffect(() => { useShallowEffect(() => {
const loadInitialData = async () => { const loadInitialData = async () => {
try { try {
const response = await apiGetAdminForumReportKomentar({ const response = await apiGetAdminForumReportKomentar({
page: `${activePage}` page: `${activePage}`,
}) search: isSearch,
});
if (response?.success && response?.data.data) { if (response?.success && response?.data.data) {
setData(response.data.data); setData(response.data.data);
setNPage(response.data.nCount || 1) setNPage(response.data.nCount || 1);
} else { } else {
console.error("Invalid data format recieved", response) console.error("Invalid data format recieved", response);
setData([]) setData([]);
} }
} catch (error) { } catch (error) {
clientLogger.error("Invalid data format recieved", error) clientLogger.error("Invalid data format recieved", error);
setData([]) setData([]);
} }
} };
loadInitialData(); loadInitialData();
}, [activePage, isSearch]); }, [activePage, isSearch]);
// async function onLoadData({ onLoad }: { onLoad: (val: any) => void }) {
// const loadData = await apiGetAdminForumReportKomentar(
// { page: `${activePage}` });
// onLoad(loadData);
// setData(loadData.data.data);
// setNPage(loadData.data.nPage);
// }
const onSearch = (searchTerm: string) => { const onSearch = (searchTerm: string) => {
setSearch(searchTerm); setSearch(searchTerm);
setActivePage(1); setActivePage(1);
} };
const onPageClick = (page: number) => { const onPageClick = (page: number) => {
setActivePage(page); setActivePage(page);
} };
const renderTableBody = () => { const renderTableBody = () => {
if (!Array.isArray(data) || data.length === 0) { if (!Array.isArray(data) || data.length === 0) {
@@ -105,75 +87,66 @@ function TableView() {
</Center> </Center>
</td> </td>
</tr> </tr>
) );
} }
return data?.map((e, i) => ( return data?.map((e, i) => (
<tr key={i}> <tr key={i}>
<td> <td>
<Center w={150}> <Box w={100}>
<Text c={AdminColor.white} lineClamp={1}>{e?.User?.Profile?.name}</Text> <Text c={AdminColor.white} lineClamp={1}>
</Center> {e?.User?.username}
</Text>
</Box>
</td> </td>
<td> <td>
<Center w={150}> <Box w={150}>
{e?.forumMaster_KategoriReportId === null ? ( {!e?.ForumMaster_KategoriReport ? (
<Text c={AdminColor.white}>Lainnya</Text> <Text c={AdminColor.white}>Lainnya</Text>
) : ( ) : (
<Text c={AdminColor.white} lineClamp={1}>{e?.ForumMaster_KategoriReport?.title}</Text> <Text c={AdminColor.white} lineClamp={1}>
{e?.ForumMaster_KategoriReport?.title}
</Text>
)} )}
</Center> </Box>
</td> </td>
<td> <td>
<Box w={250}> <Box w={150}>
<Spoiler <Spoiler
style={{ textAlign: "justify", textJustify: "auto"}} style={{ textAlign: "justify", textJustify: "auto" }}
c={AdminColor.white} c={AdminColor.white}
// w={400} // w={400}
maxHeight={60} maxHeight={50}
hideLabel="sembunyikan" hideLabel="sembunyikan"
showLabel="tampilkan" showLabel="tampilkan"
> >
<div <div
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: e?.deskripsi, __html: e?.Forum_Komentar.komentar,
}} }}
/> />
</Spoiler> </Spoiler>
</Box> </Box>
</td> </td>
<td> <td>
<Center w={150} > <Box w={150}>
<Text c={AdminColor.white}> <Text c={AdminColor.white}>
{new Intl.DateTimeFormat("id-ID", { dateStyle: "medium" }).format( {new Intl.DateTimeFormat("id-ID", { dateStyle: "medium" }).format(
new Date(e?.createdAt) new Date(e?.createdAt)
)} )}
</Text> </Text>
</Center> </Box>
</td> </td>
<td> <td>
<Stack align="center" spacing={"xs"}> <Stack align="center" spacing={"xs"}>
{/* <ButtonAction postingId={e?.id} /> */}
<ButtonLihatReportLainnya komentarId={e?.forum_KomentarId} /> <ButtonLihatReportLainnya komentarId={e?.forum_KomentarId} />
{/* <ComponentAdminForum_ButtonDeletePosting
postingId={e?.Forum_Komentar.forum_PostingId}
onSuccesDelete={(val) => {
if (val) {
onLoadData();
}
}}
/> */}
</Stack> </Stack>
</td> </td>
</tr> </tr>
)); ));
} };
return ( return (
<> <>
@@ -185,32 +158,13 @@ function TableView() {
<TextInput <TextInput
icon={<IconSearch size={20} />} icon={<IconSearch size={20} />}
radius={"xl"} radius={"xl"}
placeholder="Cari postingan" placeholder="Cari Komentar"
onChange={(val) => { onChange={(val) => {
onSearch(val.currentTarget.value); onSearch(val.currentTarget.value);
}} }}
/> />
} }
/> />
{/* <Group
position="apart"
bg={"yellow.4"}
p={"xs"}
style={{ borderRadius: "6px" }}
>
<Title order={4} c={"white"}>
Report Komentar
</Title>
<TextInput
icon={<IconSearch size={20} />}
radius={"xl"}
placeholder="Cari postingan"
onChange={(val) => {
onSearch(val.currentTarget.value);
}}
/>
</Group> */}
{!data ? ( {!data ? (
<CustomSkeleton height={"80vh"} width={"100%"} /> <CustomSkeleton height={"80vh"} width={"100%"} />
@@ -223,50 +177,40 @@ function TableView() {
p={"md"} p={"md"}
w={"100%"} w={"100%"}
h={"100%"} h={"100%"}
> >
<thead> <thead>
<tr> <tr>
<th> <th>
<Center c={AdminColor.white}>Pelapor</Center> <Text c={AdminColor.white}>Pelaporr</Text>
</th> </th>
<th> <th>
<Center c={AdminColor.white}>Jenis Laporan</Center> <Text c={AdminColor.white}>Jenis Laporan</Text>
</th> </th>
<th> <th>
<Center c={AdminColor.white}>Komentar</Center> <Text c={AdminColor.white}>Komentar</Text>
</th> </th>
<th> <th>
<Center c={AdminColor.white}>Tanggal Report</Center> <Text c={AdminColor.white}>Tanggal Report</Text>
</th> </th>
<th> <th>
<Center c={AdminColor.white}>Aksi</Center> <Center c={AdminColor.white}>Aksi</Center>
</th> </th>
</tr> </tr>
</thead> </thead>
<tbody>{renderTableBody()}</tbody> <tbody>{renderTableBody()}</tbody>
</Table> </Table>
</ScrollArea> </ScrollArea>
<Center mt={"xl"}> <Admin_V3_ComponentPaginationBreakpoint
<Pagination value={activePage}
value={activePage} total={nPage}
total={nPage} onChange={(val) => {
onChange={(val) => { onPageClick(val);
onPageClick(val); }}
}} />
/>
</Center>
</Paper> </Paper>
)} )}
</Stack> </Stack>
@@ -274,7 +218,6 @@ function TableView() {
); );
} }
function ButtonLihatReportLainnya({ komentarId }: { komentarId: string }) { function ButtonLihatReportLainnya({ komentarId }: { komentarId: string }) {
const router = useRouter(); const router = useRouter();
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
@@ -297,6 +240,3 @@ function ButtonLihatReportLainnya({ komentarId }: { komentarId: string }) {
</> </>
); );
} }

151
src/app_modules/admin/forum/sub_menu/table_report_posting.tsx
View File

@@ -1,39 +1,31 @@
"use client"; "use client";
import { RouterAdminForum } from "@/lib/router_admin/router_admin_forum"; import { AdminColor } from "@/app_modules/_global/color/color_pallet";
import ComponentAdminGlobal_HeaderTamplate from "@/app_modules/admin/_admin_global/header_tamplate"; import ComponentAdminGlobal_HeaderTamplate from "@/app_modules/admin/_admin_global/header_tamplate";
import { import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
MODEL_FORUM_REPORT_POSTING import { MODEL_FORUM_REPORT_POSTING } from "@/app_modules/forum/model/interface";
} from "@/app_modules/forum/model/interface"; import { RouterAdminForum } from "@/lib/router_admin/router_admin_forum";
import { clientLogger } from "@/util/clientLogger";
import { import {
Badge, Badge,
Box, Box,
Button, Button,
Center, Center,
Group,
Pagination,
Paper, Paper,
ScrollArea, ScrollArea,
Spoiler, Spoiler,
Stack, Stack,
Table, Table,
Text, Text,
TextInput, TextInput
Title
} from "@mantine/core"; } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconFlag3, IconSearch } from "@tabler/icons-react"; import { IconFlag3, IconSearch } from "@tabler/icons-react";
import { isEmpty } from "lodash";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import ComponentAdminGlobal_IsEmptyData from "../../_admin_global/is_empty_data";
import ComponentAdminForum_ButtonDeletePosting from "../component/button_delete";
import adminForum_funGetAllReportPosting from "../fun/get/get_all_report_posting";
import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component"; import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
import { AdminColor } from "@/app_modules/_global/color/color_pallet"; import { Admin_V3_ComponentPaginationBreakpoint } from "../../_components_v3/comp_pagination_breakpoint";
import { useShallowEffect } from "@mantine/hooks";
import { apiGetAdminForumReportPosting } from "../lib/api_fetch_admin_forum"; import { apiGetAdminForumReportPosting } from "../lib/api_fetch_admin_forum";
import { clientLogger } from "@/util/clientLogger";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
export default function AdminForum_TableReportPosting() { export default function AdminForum_TableReportPosting() {
return ( return (
@@ -59,20 +51,20 @@ function TableView() {
try { try {
const response = await apiGetAdminForumReportPosting({ const response = await apiGetAdminForumReportPosting({
page: `${activePage}`, page: `${activePage}`,
}) search: isSearch,
});
if (response?.success && response?.data.data) { if (response?.success && response?.data.data) {
setData(response.data.data); setData(response.data.data);
setNPage(response.data.nCount || 1) setNPage(response.data.nCount || 1);
} else { } else {
console.error("Invalid data format recieved", response), console.error("Invalid data format recieved", response), setData([]);
setData([])
} }
} catch (error) { } catch (error) {
clientLogger.error("Invalid data format recieved", error) clientLogger.error("Invalid data format recieved", error);
setData([]) setData([]);
} }
} };
loadInitialData(); loadInitialData();
}, [activePage, isSearch]); }, [activePage, isSearch]);
async function onSearch(searchTerm: string) { async function onSearch(searchTerm: string) {
@@ -82,7 +74,7 @@ function TableView() {
const onPageClick = (page: number) => { const onPageClick = (page: number) => {
setActivePage(page); setActivePage(page);
} };
const renderTableBody = () => { const renderTableBody = () => {
if (!Array.isArray(data) || data.length === 0) { if (!Array.isArray(data) || data.length === 0) {
@@ -94,36 +86,30 @@ function TableView() {
</Center> </Center>
</td> </td>
</tr> </tr>
) );
} }
return data?.map((e, i) => ( return data?.map((e, i) => (
<tr key={i}> <tr key={i} style={{ color: AdminColor.white }}>
<td> <td>
<Center c={AdminColor.white} w={150}> <Text w={100}>
<Text lineClamp={1}>{e?.User.username}</Text> <Text lineClamp={1}>{e?.User.username}</Text>
</Center> </Text>
</td> </td>
<td> <td>
<Center c={AdminColor.white} w={150}> <Text w={150}>
{e?.forumMaster_KategoriReportId === null ? ( {e?.forumMaster_KategoriReportId === null ? (
<Text>Lainnya</Text> <Text>Lainnya</Text>
) : ( ) : (
<Text lineClamp={1}>{e?.ForumMaster_KategoriReport.title}</Text> <Text lineClamp={1}>{e?.ForumMaster_KategoriReport.title}</Text>
)} )}
</Center> </Text>
</td> </td>
{/* <td>
<Center w={200}>
<Text lineClamp={1}>{e?.Forum_Posting.Author.username}</Text>
</Center>
</td>
<td> <td>
<Box w={400}> <Box w={150}>
<Spoiler <Spoiler
// w={400} // w={400}
maxHeight={60} maxHeight={50}
hideLabel="sembunyikan" hideLabel="sembunyikan"
showLabel="tampilkan" showLabel="tampilkan"
> >
@@ -134,10 +120,10 @@ function TableView() {
/> />
</Spoiler> </Spoiler>
</Box> </Box>
</td> */} </td>
<td> <td>
<Center w={250}> <Center>
<Badge <Badge
color={ color={
(e?.Forum_Posting?.ForumMaster_StatusPosting?.id as any) === 1 (e?.Forum_Posting?.ForumMaster_StatusPosting?.id as any) === 1
@@ -149,34 +135,15 @@ function TableView() {
</Badge> </Badge>
</Center> </Center>
</td> </td>
<td>
<Center w={150}>
<Text c={AdminColor.white}>
{new Intl.DateTimeFormat("id-ID", { dateStyle: "medium" }).format(
new Date(e?.createdAt)
)}
</Text>
</Center>
</td>
<td> <td>
<Stack align="center" spacing={"xs"}> <Stack align="center" spacing={"xs"}>
{/* <ButtonAction postingId={e?.id} /> */}
<ButtonLihatReportLainnya postingId={e?.forum_PostingId} /> <ButtonLihatReportLainnya postingId={e?.forum_PostingId} />
{/* <ComponentAdminForum_ButtonDeletePosting
postingId={e?.forum_PostingId}
onSuccesDelete={(val) => {
if (val) {
onLoadData();
}
}}
/> */}
</Stack> </Stack>
</td> </td>
</tr> </tr>
)); ));
} };
return ( return (
<> <>
@@ -190,31 +157,11 @@ function TableView() {
radius={"xl"} radius={"xl"}
placeholder="Cari postingan" placeholder="Cari postingan"
onChange={(val) => { onChange={(val) => {
onSearch(val.currentTarget.value); onSearch(val.currentTarget.value);
}} }}
/> />
} }
/> />
{/* <Group
position="apart"
bg={"orange.4"}
p={"xs"}
style={{ borderRadius: "6px" }}
>
<Title order={4} c={"white"}>
Report Posting
</Title>
<TextInput
icon={<IconSearch size={20} />}
radius={"xl"}
placeholder="Cari postingan"
onChange={(val) => {
onSearch(val.currentTarget.value);
}}
/>
</Group> */}
{!data ? ( {!data ? (
<CustomSkeleton height={"80vh"} width={"100%"} /> <CustomSkeleton height={"80vh"} width={"100%"} />
@@ -227,27 +174,22 @@ function TableView() {
p={"md"} p={"md"}
w={"100%"} w={"100%"}
h={"100%"} h={"100%"}
> >
<thead> <thead>
<tr> <tr>
<th> <th>
<Center c={AdminColor.white}>Pelapor</Center> <Text c={AdminColor.white}>Pelapor</Text>
</th> </th>
<th> <th>
<Center c={AdminColor.white}>Jenis Laporan</Center> <Text c={AdminColor.white}>Jenis Laporan</Text>
</th>
{/* <th>
<Center c={AdminColor.white}>Author</Center>
</th> </th>
<th> <th>
<Text>Postingan</Text> <Text c={AdminColor.white}>Postingan</Text>
</th> */}
<th>
<Center c={AdminColor.white} w={250}>Status Posting</Center>
</th> </th>
<th> <th>
<Center c={AdminColor.white}>Tanggal Report</Center> <Center c={AdminColor.white} w={250}>
Status Posting
</Center>
</th> </th>
<th> <th>
@@ -258,15 +200,13 @@ function TableView() {
<tbody>{renderTableBody()}</tbody> <tbody>{renderTableBody()}</tbody>
</Table> </Table>
</ScrollArea> </ScrollArea>
<Center mt={"xl"}> <Admin_V3_ComponentPaginationBreakpoint
<Pagination value={activePage}
value={activePage} total={nPage}
total={nPage} onChange={(val) => {
onChange={(val) => { onPageClick(val);
onPageClick(val); }}
}} />
/>
</Center>
</Paper> </Paper>
)} )}
</Stack> </Stack>
@@ -280,8 +220,7 @@ function ButtonLihatReportLainnya({ postingId }: { postingId: string }) {
return ( return (
<> <>
<Button <Button
fz={"xs"} loading={loading}
loading={loading ? true : false}
loaderPosition="center" loaderPosition="center"
radius={"xl"} radius={"xl"}
w={170} w={170}
@@ -291,7 +230,7 @@ function ButtonLihatReportLainnya({ postingId }: { postingId: string }) {
router.push(RouterAdminForum.report_posting + postingId); router.push(RouterAdminForum.report_posting + postingId);
}} }}
> >
<Text>Lihat Report Lain</Text> <Text> Report Lain</Text>
</Button> </Button>
</> </>
); );

16
src/app_modules/admin/job/child/publish/index.tsx
View File

@@ -204,15 +204,13 @@ function TableStatus() {
<tbody>{renderTableBody()}</tbody> <tbody>{renderTableBody()}</tbody>
</Table> </Table>
</ScrollArea> </ScrollArea>
<Center mt={"xl"}> <Admin_V3_ComponentPaginationBreakpoint
<Admin_V3_ComponentPaginationBreakpoint value={activePage}
value={activePage} total={nPage}
total={nPage} onChange={(val) => {
onChange={(val) => { onPageClick(val);
onPageClick(val); }}
}} />
/>
</Center>
</Paper> </Paper>
)} )}
</Stack> </Stack>