Fix UI Event Dashboard Admin
This commit is contained in:
@@ -24,6 +24,7 @@ import { useState } from "react";
|
||||
import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
|
||||
import { apiGetAdminEventRiwayat } from "@/app/dev/admin/event/_lib/api_fecth_admin_event";
|
||||
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
|
||||
import { AdminColor } from "@/app_modules/_global/color/color_pallet";
|
||||
|
||||
export default function AdminEvent_Riwayat() {
|
||||
return (
|
||||
@@ -112,28 +113,28 @@ function DetailRiwayat() {
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text>{e?.Author?.username}</Text>
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text lineClamp={2}>{e.title}</Text>
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text>{e.lokasi}</Text>
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text>{e.EventMaster_TipeAcara.name}</Text>
|
||||
</Center>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text align="center">
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
dateStyle: "full",
|
||||
@@ -148,7 +149,7 @@ function DetailRiwayat() {
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text align="center">
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
dateStyle: "full",
|
||||
@@ -164,7 +165,7 @@ function DetailRiwayat() {
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<Center w={400}>
|
||||
<Center c={AdminColor.white} w={400}>
|
||||
<Spoiler
|
||||
hideLabel="sembunyikan"
|
||||
maxHeight={50}
|
||||
@@ -183,11 +184,11 @@ function DetailRiwayat() {
|
||||
<Stack spacing={"xs"} h={"100%"}>
|
||||
<Group
|
||||
position="apart"
|
||||
bg={"gray.4"}
|
||||
bg={AdminColor.softBlue}
|
||||
p={"xs"}
|
||||
style={{ borderRadius: "6px" }}
|
||||
>
|
||||
<Title order={4}>Riwayat</Title>
|
||||
<Title c={AdminColor.white} order={4}>Riwayat</Title>
|
||||
<TextInput
|
||||
icon={<IconSearch size={20} />}
|
||||
radius={"xl"}
|
||||
@@ -201,41 +202,40 @@ function DetailRiwayat() {
|
||||
{!data ? (
|
||||
<CustomSkeleton height={"80vh"} width="100%" />
|
||||
) : (
|
||||
<Paper p={"md"} withBorder shadow="lg" h={"80vh"}>
|
||||
<Paper p={"md"} bg={AdminColor.softBlue} h={"80vh"}>
|
||||
<ScrollArea w={"100%"} h={"90%"}>
|
||||
<Table
|
||||
verticalSpacing={"md"}
|
||||
horizontalSpacing={"md"}
|
||||
p={"md"}
|
||||
w={"100%"}
|
||||
striped
|
||||
highlightOnHover
|
||||
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<Center>Aksi</Center>
|
||||
<Center c={AdminColor.white}>Aksi</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Username</Center>
|
||||
<Center c={AdminColor.white}>Username</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Judul</Center>
|
||||
<Center c={AdminColor.white}>Judul</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Lokasi</Center>
|
||||
<Center c={AdminColor.white}>Lokasi</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Tipe Acara</Center>
|
||||
<Center c={AdminColor.white}>Tipe Acara</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Tanggal & Waktu Mulai</Center>
|
||||
<Center c={AdminColor.white}>Tanggal & Waktu Mulai</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Tanggal & Waktu Selesai</Center>
|
||||
<Center c={AdminColor.white}>Tanggal & Waktu Selesai</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Deskripsi</Center>
|
||||
<Center c={AdminColor.white}>Deskripsi</Center>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
@@ -28,6 +28,7 @@ import { AdminEvent_getListTipeAcara } from "../fun/get/get_list_tipe_acara";
|
||||
import { apiGetAdminEventTipeAcara } from "@/app/dev/admin/event/_lib/api_fecth_admin_event";
|
||||
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
|
||||
import { clientLogger } from "@/util/clientLogger";
|
||||
import { AdminColor } from "@/app_modules/_global/color/color_pallet";
|
||||
|
||||
export default function AdminEvent_DetailTipeAcara() {
|
||||
return (
|
||||
@@ -92,11 +93,11 @@ function DetailTipeAcara() {
|
||||
|
||||
<Group
|
||||
position="apart"
|
||||
bg={"gray.4"}
|
||||
bg={AdminColor.softBlue}
|
||||
p={"xs"}
|
||||
style={{ borderRadius: "6px" }}
|
||||
>
|
||||
<Title order={4}>Tipe Acara</Title>
|
||||
<Title c={AdminColor.white} order={4}>Tipe Acara</Title>
|
||||
<Button
|
||||
leftIcon={<IconCirclePlus />}
|
||||
radius={"xl"}
|
||||
@@ -123,14 +124,14 @@ function DetailTipeAcara() {
|
||||
]}
|
||||
>
|
||||
<div>
|
||||
<Paper p={"md"} shadow="lg" withBorder>
|
||||
<Paper p={"md"} bg={AdminColor.softBlue}>
|
||||
<Stack>
|
||||
<Title order={3}>Tipe Acara Yang Tersedia </Title>
|
||||
<Title c={AdminColor.white} order={3}>Tipe Acara Yang Tersedia </Title>
|
||||
<Stack px={"md"}>
|
||||
{tipe.map((e, i) => (
|
||||
<Stack key={e.id} spacing={"xs"}>
|
||||
<Group position="apart">
|
||||
<Text>{e.name}</Text>
|
||||
<Text c={AdminColor.white}>{e.name}</Text>
|
||||
<Group>
|
||||
<ActionIcon
|
||||
variant="transparent"
|
||||
@@ -202,9 +203,10 @@ function DetailTipeAcara() {
|
||||
|
||||
<div>
|
||||
{openEditor ? (
|
||||
<Paper p={"sm"} shadow="lg" withBorder>
|
||||
<Paper p={"sm"} bg={AdminColor.softBlue}>
|
||||
<Stack>
|
||||
<TextInput
|
||||
styles={{ label: { color: AdminColor.white } }}
|
||||
value={edit?.name ? edit?.name : ""}
|
||||
label="Edit Tipe"
|
||||
placeholder="Contoh: Ramah Tamah, dll"
|
||||
|
||||
@@ -24,6 +24,7 @@ import { useState } from "react";
|
||||
import QRCode from "react-qr-code";
|
||||
import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
|
||||
import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
|
||||
import { AdminColor } from "@/app_modules/_global/color/color_pallet";
|
||||
|
||||
export default function AdminEvent_TablePublish() {
|
||||
return (
|
||||
@@ -135,28 +136,28 @@ function TableStatus() {
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text>{e?.Author?.username}</Text>
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text lineClamp={2}>{e.title}</Text>
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text>{e.lokasi}</Text>
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text>{e.EventMaster_TipeAcara?.name}</Text>
|
||||
</Center>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text align="center">
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
dateStyle: "full",
|
||||
@@ -171,7 +172,7 @@ function TableStatus() {
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center w={200}>
|
||||
<Center c={AdminColor.white} w={200}>
|
||||
<Text align="center">
|
||||
{new Intl.DateTimeFormat("id-ID", {
|
||||
dateStyle: "full",
|
||||
@@ -187,7 +188,7 @@ function TableStatus() {
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<Center w={400}>
|
||||
<Center c={AdminColor.white} w={400}>
|
||||
<Spoiler
|
||||
hideLabel="sembunyikan"
|
||||
maxHeight={50}
|
||||
@@ -222,7 +223,7 @@ function TableStatus() {
|
||||
<Stack spacing="xs" h="100%">
|
||||
<ComponentAdminGlobal_TitlePage
|
||||
name="Publish"
|
||||
color="green"
|
||||
color={AdminColor.softBlue}
|
||||
component={
|
||||
<TextInput
|
||||
disabled={!data}
|
||||
@@ -238,47 +239,45 @@ function TableStatus() {
|
||||
{!data ? (
|
||||
<CustomSkeleton height={"80vh"} width="100%" />
|
||||
) : (
|
||||
<Paper p="md" withBorder shadow="lg" h="80vh">
|
||||
<Paper p="md" bg={AdminColor.softBlue} h="80vh">
|
||||
<ScrollArea w="100%" h="90%">
|
||||
<Table
|
||||
verticalSpacing="md"
|
||||
horizontalSpacing="md"
|
||||
p="md"
|
||||
w={1500}
|
||||
striped
|
||||
highlightOnHover
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<Center>QR Code</Center>
|
||||
<Center c={AdminColor.white}>QR Code</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Download QR</Center>
|
||||
<Center c={AdminColor.white}>Download QR</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Username</Center>
|
||||
<Center c={AdminColor.white}>Username</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Judul</Center>
|
||||
<Center c={AdminColor.white}>Judul</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Lokasi</Center>
|
||||
<Center c={AdminColor.white}>Lokasi</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Tipe Acara</Center>
|
||||
<Center c={AdminColor.white}>Tipe Acara</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Tanggal & Waktu Mulai</Center>
|
||||
<Center c={AdminColor.white}>Tanggal & Waktu Mulai</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Tanggal & Waktu Selesai</Center>
|
||||
<Center c={AdminColor.white}>Tanggal & Waktu Selesai</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Deskripsi</Center>
|
||||
<Center c={AdminColor.white}>Deskripsi</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Aksi</Center>
|
||||
<Center c={AdminColor.white}>Aksi</Center>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
Reference in New Issue
Block a user