Fix UI Admin

This commit is contained in:
2025-02-03 00:54:43 +08:00
parent d2a1f85ec0
commit 91f61f99c5
22 changed files with 315 additions and 246 deletions

View File

@@ -1,7 +1,10 @@
"use client";
import { Group, Paper, SimpleGrid, Stack, Text, Title } from "@mantine/core";
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 { AdminColor } from "@/app_modules/_global/color/color_pallet";
export default function AdminForum_Main({
countPublish,
@@ -41,18 +44,21 @@ function ForumMain({
name: "Publish",
jumlah: countPublish,
color: "green",
icon: <IconUpload size={18} color="#4CAF4F" />
},
{
id: 2,
name: "Report Posting",
jumlah: countLaporanPosting,
color: "orange",
icon: <IconFlag size={18} color="#FF9800" />
},
{
id: 3,
name: "Report Komentar",
jumlah: countLaporanKomentar,
color: "red",
icon: <IconMessageReport size={18} color="#F44336" />
},
];
return (
@@ -69,18 +75,25 @@ function ForumMain({
{listBox.map((e, i) => (
<Paper
key={i}
bg={`${e.color}.2`}
bg={AdminColor.softBlue}
shadow="md"
radius="md"
p="md"
// sx={{ borderColor: e.color, borderStyle: "solid" }}
// sx={{ borderColor: e.color, borderStyle: "solid" }}
>
<Group position="center">
<Stack align="center" spacing={0}>
<Text>{e.name}</Text>
<Title>{e.jumlah ? e.jumlah : 0}</Title>
</Stack>
</Group>
<Stack spacing={0}>
<Text fw={"bold"} c={AccentColor.white}>{e.name}</Text>
<Flex align={"center"} justify={"space-between"}>
<Title color={AccentColor.white}>{e.jumlah ? e.jumlah : 0}</Title>
<ThemeIcon
radius={"xl"}
size={"md"}
color={AccentColor.white}
>
{e.icon}
</ThemeIcon>
</Flex>
</Stack>
</Paper>
))}
</SimpleGrid>

View File

@@ -94,7 +94,7 @@ function TablePublish({ listPublish }: { listPublish: any }) {
<tr key={i}>
<td>
<Center w={200}>
<Text lineClamp={1}>{e?.Author?.username}</Text>
<Text c={AdminColor.white} lineClamp={1}>{e?.Author?.username}</Text>
</Center>
</td>
<td>
@@ -126,7 +126,7 @@ function TablePublish({ listPublish }: { listPublish: any }) {
</td>
<td>
<Center w={150}>
<Text>
<Text c={AdminColor.white}>
{new Intl.DateTimeFormat(["id-ID"], { dateStyle: "medium" }).format(
e.createdAt
)}
@@ -135,7 +135,7 @@ function TablePublish({ listPublish }: { listPublish: any }) {
</td>
<td>
<Center w={150}>
<Text fw={"bold"} fz={"lg"}>
<Text c={AdminColor.white} fw={"bold"} fz={"lg"}>
{e?.Forum_Komentar.length}
</Text>
</Center>
@@ -172,7 +172,7 @@ function TablePublish({ listPublish }: { listPublish: any }) {
<Stack spacing={"xs"} h={"100%"}>
<ComponentAdminGlobal_TitlePage
name="Posting"
color={AdminColor.green}
color={AdminColor.softBlue}
component={
<TextInput
icon={<IconSearch size={20} />}
@@ -206,7 +206,7 @@ function TablePublish({ listPublish }: { listPublish: any }) {
{isEmpty(data) ? (
<ComponentAdminGlobal_IsEmptyData />
) : (
<Paper p={"md"} withBorder shadow="lg" h={"80vh"}>
<Paper p={"md"} bg={AdminColor.softBlue} h={"80vh"}>
<ScrollArea w={"100%"} h={"90%"} offsetScrollbars>
<Table
verticalSpacing={"md"}
@@ -214,31 +214,30 @@ function TablePublish({ listPublish }: { listPublish: any }) {
p={"md"}
w={"100%"}
h={"100%"}
striped
highlightOnHover
>
<thead>
<tr>
<th>
<Center>Username</Center>
<Center c={AdminColor.white}>Username</Center>
</th>
<th>
<Center>Status</Center>
<Center c={AdminColor.white}>Status</Center>
</th>
<th>
<Text>Postingan</Text>
<Text c={AdminColor.white}>Postingan</Text>
</th>
<th>
<Center>Tanggal Publish</Center>
<Center c={AdminColor.white}>Tanggal Publish</Center>
</th>
<th>
<Center>Komentar Aktif</Center>
<Center c={AdminColor.white}>Komentar Aktif</Center>
</th>
<th>
<Center>Total Report Posting</Center>
<Center c={AdminColor.white}>Total Report Posting</Center>
</th>
<th>
<Center>Aksi</Center>
<Center c={AdminColor.white}>Aksi</Center>
</th>
</tr>
</thead>

View File

@@ -98,15 +98,15 @@ function TableView({ listData }: { listData: any }) {
<tr key={i}>
<td>
<Center w={200}>
<Text lineClamp={1}>{e?.User.username}</Text>
<Text c={AdminColor.white} lineClamp={1}>{e?.User.username}</Text>
</Center>
</td>
<td>
<Center w={200}>
{e?.forumMaster_KategoriReportId === null ? (
<Text>Lainnya</Text>
<Text c={AdminColor.white}>Lainnya</Text>
) : (
<Text lineClamp={1}>{e?.ForumMaster_KategoriReport.title}</Text>
<Text c={AdminColor.white} lineClamp={1}>{e?.ForumMaster_KategoriReport.title}</Text>
)}
</Center>
</td>
@@ -160,7 +160,7 @@ function TableView({ listData }: { listData: any }) {
<Stack spacing={"xs"} h={"100%"}>
<ComponentAdminGlobal_TitlePage
name="Report Komentar"
color={AdminColor.yellow}
color={AdminColor.softBlue}
component={
<TextInput
icon={<IconSearch size={20} />}
@@ -194,7 +194,7 @@ function TableView({ listData }: { listData: any }) {
{isEmpty(data) ? (
<ComponentAdminGlobal_IsEmptyData />
) : (
<Paper p={"md"} withBorder shadow="lg" h={"80vh"}>
<Paper p={"md"} bg={AdminColor.softBlue} h={"80vh"}>
<ScrollArea w={"100%"} h={"90%"} offsetScrollbars>
<Table
verticalSpacing={"md"}
@@ -202,29 +202,28 @@ function TableView({ listData }: { listData: any }) {
p={"md"}
w={"100%"}
h={"100%"}
striped
highlightOnHover
>
<thead>
<tr>
<th>
<Center>Pelapor</Center>
<Center c={AdminColor.white}>Pelapor</Center>
</th>
<th>
<Center>Jenis Laporan</Center>
<Center c={AdminColor.white}>Jenis Laporan</Center>
</th>
<th>
<Text>Komentar</Text>
<Text c={AdminColor.white}>Komentar</Text>
</th>
<th>
<Center>Tanggal Report</Center>
<Center c={AdminColor.white}>Tanggal Report</Center>
</th>
<th>
<Center>Aksi</Center>
<Center c={AdminColor.white}>Aksi</Center>
</th>
</tr>

View File

@@ -169,7 +169,7 @@ function TableView({ listData }: { listData: any }) {
<Stack spacing={"xs"} h={"100%"}>
<ComponentAdminGlobal_TitlePage
name="Report Posting"
color={AdminColor.orange}
color={AdminColor.softBlue}
component={
<TextInput
icon={<IconSearch size={20} />}
@@ -205,7 +205,7 @@ function TableView({ listData }: { listData: any }) {
{isEmpty(data) ? (
<ComponentAdminGlobal_IsEmptyData />
) : (
<Paper p={"md"} withBorder shadow="lg" h={"80vh"}>
<Paper p={"md"} bg={AdminColor.softBlue} h={"80vh"}>
<ScrollArea w={"100%"} h={"90%"} offsetScrollbars>
<Table
verticalSpacing={"md"}
@@ -213,32 +213,31 @@ function TableView({ listData }: { listData: any }) {
p={"md"}
w={"100%"}
h={"100%"}
striped
highlightOnHover
>
<thead>
<tr>
<th>
<Center>Pelapor</Center>
<Center c={AdminColor.white}>Pelapor</Center>
</th>
<th>
<Center>Jenis Laporan</Center>
<Center c={AdminColor.white}>Jenis Laporan</Center>
</th>
{/* <th>
<Center>Author</Center>
<Center c={AdminColor.white}>Author</Center>
</th>
<th>
<Text>Postingan</Text>
</th> */}
<th>
<Center w={200}>Status Posting</Center>
<Center c={AdminColor.white} w={200}>Status Posting</Center>
</th>
<th>
<Center>Tanggal Report</Center>
<Center c={AdminColor.white}>Tanggal Report</Center>
</th>
<th>
<Center>Aksi</Center>
<Center c={AdminColor.white}>Aksi</Center>
</th>
</tr>
</thead>