QC Investasi
# fix Tampilan admin investasi Tampilan admin donasi ## No issuee
This commit is contained in:
263
src/app_modules/admin/donasi/sub_menu/table_kategori.tsx
Normal file
263
src/app_modules/admin/donasi/sub_menu/table_kategori.tsx
Normal file
@@ -0,0 +1,263 @@
|
||||
"use client";
|
||||
|
||||
import {
|
||||
Stack,
|
||||
Group,
|
||||
Title,
|
||||
Paper,
|
||||
ScrollArea,
|
||||
Center,
|
||||
Pagination,
|
||||
Table,
|
||||
Grid,
|
||||
TextInput,
|
||||
Button,
|
||||
Text,
|
||||
ActionIcon,
|
||||
Overlay,
|
||||
} from "@mantine/core";
|
||||
import ComponentAdminGlobal_HeaderTamplate from "../../component/header_tamplate";
|
||||
import { MODEL_NEW_DEFAULT_MASTER } from "@/app_modules/model_global/interface";
|
||||
import { useState } from "react";
|
||||
import { IconEdit, IconTrash } from "@tabler/icons-react";
|
||||
import adminDonasi_funCreateKategori from "../fun/create/fun_create_kategori";
|
||||
import { ComponentGlobalAdmin_NotifikasiBerhasil } from "../../component/admin_notifikasi/notifikasi_berhasil";
|
||||
import { ComponentGlobalAdmin_NotifikasiGagal } from "../../component/admin_notifikasi/notifikasi_gagal";
|
||||
import adminDonasi_getMasterKategori from "../fun/master/get_list_kategori";
|
||||
import adminDonasi_funDeleteKategori from "../fun/delete/fun_delete_by_id";
|
||||
import adminDonasi_funUpdatekategoriById from "../fun/update/fun_update_kategori_by_id";
|
||||
|
||||
export default function AdminDonasi_TableKategori({
|
||||
listKategori,
|
||||
}: {
|
||||
listKategori: MODEL_NEW_DEFAULT_MASTER[];
|
||||
}) {
|
||||
const [list, setList] = useState(listKategori);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Stack h={"100%"}>
|
||||
<ComponentAdminGlobal_HeaderTamplate name="Donasi" />
|
||||
<TableView
|
||||
list={list}
|
||||
onLoadData={(val) => {
|
||||
setList(val);
|
||||
}}
|
||||
/>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function TableView({
|
||||
list,
|
||||
onLoadData,
|
||||
}: {
|
||||
list: MODEL_NEW_DEFAULT_MASTER[];
|
||||
onLoadData: (val: any) => void;
|
||||
}) {
|
||||
const [create, setCreate] = useState("");
|
||||
const [visible, setVisible] = useState(true);
|
||||
const [kategoriId, setKategoriId] = useState("");
|
||||
const [updateName, setUpdateName] = useState("");
|
||||
|
||||
async function onCreateNewKategori() {
|
||||
const tambahData = await adminDonasi_funCreateKategori({
|
||||
newKategori: create,
|
||||
});
|
||||
if (tambahData.status === 200) {
|
||||
const loadNewdata = await adminDonasi_getMasterKategori();
|
||||
onLoadData(loadNewdata);
|
||||
setCreate("");
|
||||
ComponentGlobalAdmin_NotifikasiBerhasil(tambahData.message);
|
||||
} else {
|
||||
ComponentGlobalAdmin_NotifikasiGagal(tambahData.message);
|
||||
}
|
||||
}
|
||||
|
||||
async function onDelete(id: string) {
|
||||
const del = await adminDonasi_funDeleteKategori({ kategoriId: id });
|
||||
if (del.status === 200) {
|
||||
const loadNewdata = await adminDonasi_getMasterKategori();
|
||||
onLoadData(loadNewdata);
|
||||
ComponentGlobalAdmin_NotifikasiBerhasil(del.message);
|
||||
} else {
|
||||
ComponentGlobalAdmin_NotifikasiGagal(del.message);
|
||||
}
|
||||
}
|
||||
|
||||
async function onUpdate() {
|
||||
const updt = await adminDonasi_funUpdatekategoriById({
|
||||
kategoriId: kategoriId,
|
||||
name: updateName,
|
||||
});
|
||||
if (updt.status === 200) {
|
||||
setVisible(true);
|
||||
setKategoriId("");
|
||||
setUpdateName("");
|
||||
ComponentGlobalAdmin_NotifikasiBerhasil(updt.message);
|
||||
const loadData = await adminDonasi_getMasterKategori();
|
||||
onLoadData(loadData);
|
||||
} else {
|
||||
ComponentGlobalAdmin_NotifikasiGagal(updt.message);
|
||||
}
|
||||
}
|
||||
|
||||
const rowTable = list.map((e, i) => (
|
||||
<tr key={i}>
|
||||
<td>
|
||||
<Center>
|
||||
<Text>{e?.name}</Text>
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Group position="center">
|
||||
<ActionIcon
|
||||
onClick={() => {
|
||||
setVisible(false);
|
||||
setKategoriId(e?.id);
|
||||
setUpdateName(e?.name);
|
||||
}}
|
||||
>
|
||||
<IconEdit color="green" />
|
||||
</ActionIcon>
|
||||
<ActionIcon
|
||||
onClick={() => {
|
||||
onDelete(e?.id);
|
||||
}}
|
||||
>
|
||||
<IconTrash color="red" />
|
||||
</ActionIcon>
|
||||
</Group>
|
||||
</td>
|
||||
</tr>
|
||||
));
|
||||
|
||||
return (
|
||||
<>
|
||||
<Stack spacing={"xs"} h={"100%"}>
|
||||
{/* <pre>{JSON.stringify(listUser, null, 2)}</pre> */}
|
||||
<Group
|
||||
position="apart"
|
||||
bg={"gray.4"}
|
||||
p={"xs"}
|
||||
style={{ borderRadius: "6px" }}
|
||||
>
|
||||
<Title order={4}>Kategori</Title>
|
||||
</Group>
|
||||
|
||||
<Grid>
|
||||
<Grid.Col span={"auto"}>
|
||||
<Stack>
|
||||
<Paper p={"md"} withBorder>
|
||||
<Stack>
|
||||
<TextInput
|
||||
value={create}
|
||||
label={<Title order={6}>Tambah Kategori</Title>}
|
||||
placeholder="Masukan kategori baru"
|
||||
onChange={(val) => {
|
||||
setCreate(val.currentTarget.value);
|
||||
}}
|
||||
/>
|
||||
<Group position="right">
|
||||
<Button
|
||||
style={{
|
||||
transition: "0.5s",
|
||||
}}
|
||||
disabled={create === "" ? true : false}
|
||||
radius={"xl"}
|
||||
onClick={() => {
|
||||
onCreateNewKategori();
|
||||
}}
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
<Paper p={"md"} withBorder style={{ transition: "1s" }}>
|
||||
<Stack>
|
||||
<TextInput
|
||||
value={updateName}
|
||||
disabled={visible ? true : false}
|
||||
label={<Title order={6}>Update Kategori</Title>}
|
||||
placeholder="Update kategori"
|
||||
onChange={(val) => {
|
||||
setUpdateName(val.currentTarget.value);
|
||||
}}
|
||||
/>
|
||||
<Group position="right">
|
||||
<Button
|
||||
disabled={visible ? true : false}
|
||||
style={{
|
||||
transition: "0.5s",
|
||||
}}
|
||||
radius={"xl"}
|
||||
onClick={() => {
|
||||
setKategoriId("");
|
||||
setUpdateName("");
|
||||
setVisible(true);
|
||||
}}
|
||||
>
|
||||
Batal
|
||||
</Button>
|
||||
<Button
|
||||
style={{
|
||||
transition: "0.5s",
|
||||
}}
|
||||
color="green"
|
||||
disabled={visible ? true : false}
|
||||
radius={"xl"}
|
||||
onClick={() => {
|
||||
onUpdate();
|
||||
}}
|
||||
>
|
||||
Update
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={8} h={"80vh"}>
|
||||
<Paper p={"md"} withBorder shadow="lg" h={"100%"}>
|
||||
<ScrollArea w={"100%"} h={"90%"}>
|
||||
<Table
|
||||
verticalSpacing={"xs"}
|
||||
horizontalSpacing={"md"}
|
||||
p={"md"}
|
||||
w={"100%"}
|
||||
striped
|
||||
highlightOnHover
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<Center>Kategori</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Aksi</Center>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>{rowTable}</tbody>
|
||||
</Table>
|
||||
</ScrollArea>
|
||||
{/* <Center mt={"xl"}>
|
||||
<Pagination
|
||||
total={10}
|
||||
// value={isActivePage}
|
||||
// total={isNPage}
|
||||
// onChange={(val) => {
|
||||
// onPageClick(val);
|
||||
// }}
|
||||
/>
|
||||
</Center> */}
|
||||
</Paper>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
187
src/app_modules/admin/donasi/sub_menu/table_publish.tsx
Normal file
187
src/app_modules/admin/donasi/sub_menu/table_publish.tsx
Normal file
@@ -0,0 +1,187 @@
|
||||
"use client";
|
||||
|
||||
import { RouterAdminDonasi_OLD } from "@/app/lib/router_hipmi/router_admin";
|
||||
import {
|
||||
ActionIcon,
|
||||
Box,
|
||||
Button,
|
||||
Center,
|
||||
Group,
|
||||
Pagination,
|
||||
Paper,
|
||||
ScrollArea,
|
||||
Stack,
|
||||
Table,
|
||||
Text,
|
||||
TextInput,
|
||||
Title,
|
||||
} from "@mantine/core";
|
||||
import { IconChevronLeft, IconEyeCheck, IconSearch } from "@tabler/icons-react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import ComponentAdminDonasi_TombolKembali from "../component/tombol_kembali";
|
||||
import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
|
||||
import { useState } from "react";
|
||||
import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
|
||||
import ComponentAdminGlobal_HeaderTamplate from "../../component/header_tamplate";
|
||||
import adminDonasi_getListPublish from "../fun/get/get_list_publish";
|
||||
|
||||
export default function AdminDonasi_TablePublish({
|
||||
listPublish,
|
||||
}: {
|
||||
listPublish: any;
|
||||
}) {
|
||||
return (
|
||||
<>
|
||||
<Stack h={"100%"}>
|
||||
<ComponentAdminGlobal_HeaderTamplate name="Donasi" />
|
||||
<TableStatus listPublish={listPublish as any} />
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function TableStatus({ listPublish }: { listPublish: any }) {
|
||||
const router = useRouter();
|
||||
const [isLoading, setLoading] = useState(false);
|
||||
const [idData, setIdData] = useState("");
|
||||
|
||||
const [data, setData] = useState<MODEL_DONASI[]>(listPublish.data);
|
||||
const [isNPage, setNPage] = useState(listPublish.nPage);
|
||||
const [isActivePage, setActivePage] = useState(1);
|
||||
const [isSearch, setSearch] = useState("");
|
||||
|
||||
async function onSearch(s: string) {
|
||||
setSearch(s);
|
||||
const loadData = await adminDonasi_getListPublish({
|
||||
page: 1,
|
||||
search: s,
|
||||
});
|
||||
setData(loadData.data as any);
|
||||
setNPage(loadData.nPage);
|
||||
}
|
||||
|
||||
async function onPageClick(p: any) {
|
||||
setActivePage(p);
|
||||
const loadData = await adminDonasi_getListPublish({
|
||||
search: isSearch,
|
||||
page: p,
|
||||
});
|
||||
setData(loadData.data as any);
|
||||
setNPage(loadData.nPage);
|
||||
}
|
||||
|
||||
const TableRows = data.map((e, i) => (
|
||||
<tr key={i}>
|
||||
<td>
|
||||
<Center>{e.title}</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
<TampilanRupiahDonasi nominal={+e.target} />
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
<TampilanRupiahDonasi nominal={+e.terkumpul} />
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>{e.DonasiMaster_Ketegori.name}</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>{e.DonasiMaster_Durasi.name} hari</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
<Button
|
||||
loaderPosition="center"
|
||||
loading={isLoading && e?.id === idData ? true : false}
|
||||
color={"green"}
|
||||
leftIcon={<IconEyeCheck />}
|
||||
radius={"xl"}
|
||||
variant="outline"
|
||||
onClick={() => {
|
||||
setLoading(true);
|
||||
setIdData(e?.id);
|
||||
router.push(RouterAdminDonasi_OLD.detail_publish + `${e.id}`);
|
||||
}}
|
||||
>
|
||||
Tampilkan
|
||||
</Button>
|
||||
</Center>
|
||||
</td>
|
||||
</tr>
|
||||
));
|
||||
|
||||
return (
|
||||
<>
|
||||
<Stack spacing={"xs"} h={"100%"}>
|
||||
{/* <pre>{JSON.stringify(listUser, null, 2)}</pre> */}
|
||||
<Group
|
||||
position="apart"
|
||||
bg={"green.4"}
|
||||
p={"xs"}
|
||||
style={{ borderRadius: "6px" }}
|
||||
>
|
||||
<Title order={4}>Publish</Title>
|
||||
<TextInput
|
||||
icon={<IconSearch size={20} />}
|
||||
radius={"xl"}
|
||||
placeholder="Masukan judul"
|
||||
onChange={(val) => {
|
||||
onSearch(val.currentTarget.value);
|
||||
}}
|
||||
/>
|
||||
</Group>
|
||||
|
||||
<Paper p={"md"} withBorder shadow="lg" h={"80vh"}>
|
||||
<ScrollArea w={"100%"} h={"90%"}>
|
||||
<Table
|
||||
verticalSpacing={"md"}
|
||||
horizontalSpacing={"md"}
|
||||
p={"md"}
|
||||
w={1500}
|
||||
striped
|
||||
highlightOnHover
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<Center>Judul</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Target</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Terkumpul</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Ketegori</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Durasi</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Aksi</Center>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>{TableRows}</tbody>
|
||||
</Table>
|
||||
</ScrollArea>
|
||||
{/* <ScrollArea>
|
||||
</ScrollArea> */}
|
||||
<Center mt={"xl"}>
|
||||
<Pagination
|
||||
value={isActivePage}
|
||||
total={isNPage}
|
||||
onChange={(val) => {
|
||||
onPageClick(val);
|
||||
}}
|
||||
/>
|
||||
</Center>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
220
src/app_modules/admin/donasi/sub_menu/table_reject.tsx
Normal file
220
src/app_modules/admin/donasi/sub_menu/table_reject.tsx
Normal file
@@ -0,0 +1,220 @@
|
||||
"use client";
|
||||
|
||||
import { RouterAdminDonasi_OLD } from "@/app/lib/router_hipmi/router_admin";
|
||||
import {
|
||||
ActionIcon,
|
||||
Box,
|
||||
Button,
|
||||
Center,
|
||||
Group,
|
||||
Modal,
|
||||
Pagination,
|
||||
Paper,
|
||||
ScrollArea,
|
||||
Stack,
|
||||
Table,
|
||||
Text,
|
||||
TextInput,
|
||||
Title,
|
||||
} from "@mantine/core";
|
||||
import {
|
||||
IconChevronLeft,
|
||||
IconEyeCheck,
|
||||
IconEyeClosed,
|
||||
IconEyeEdit,
|
||||
IconSearch,
|
||||
} from "@tabler/icons-react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import ComponentAdminDonasi_TombolKembali from "../component/tombol_kembali";
|
||||
import { useDisclosure } from "@mantine/hooks";
|
||||
import AdminDonasi_DetailReview from "../detail/detail_review";
|
||||
import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
|
||||
import { useState } from "react";
|
||||
import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
|
||||
import ComponentAdminGlobal_HeaderTamplate from "../../component/header_tamplate";
|
||||
import adminDonasi_getListReject from "../fun/get/get_list_reject";
|
||||
|
||||
export default function AdminDonasi_TableReject({
|
||||
dataReject,
|
||||
}: {
|
||||
dataReject: any;
|
||||
}) {
|
||||
return (
|
||||
<>
|
||||
<Stack h={"100%"}>
|
||||
<ComponentAdminGlobal_HeaderTamplate name="Donasi" />
|
||||
<TableStatus dataReject={dataReject} />
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function TableStatus({ dataReject }: { dataReject: any }) {
|
||||
const router = useRouter();
|
||||
const [opened, { open, close }] = useDisclosure(false);
|
||||
const [isLoading, setLoading] = useState(false);
|
||||
const [idData, setIdData] = useState("");
|
||||
const [data, setData] = useState<MODEL_DONASI[]>(dataReject.data);
|
||||
const [isNPage, setNPage] = useState(dataReject.nPage);
|
||||
const [isActivePage, setActivePage] = useState(1);
|
||||
const [isSearch, setSearch] = useState("");
|
||||
|
||||
async function onSearch(s: string) {
|
||||
setSearch(s);
|
||||
const loadData = await adminDonasi_getListReject({
|
||||
page: 1,
|
||||
search: s,
|
||||
});
|
||||
setData(loadData.data as any);
|
||||
setNPage(loadData.nPage);
|
||||
}
|
||||
|
||||
async function onPageClick(p: any) {
|
||||
setActivePage(p);
|
||||
const loadData = await adminDonasi_getListReject({
|
||||
search: isSearch,
|
||||
page: p,
|
||||
});
|
||||
setData(loadData.data as any);
|
||||
setNPage(loadData.nPage);
|
||||
}
|
||||
|
||||
const TableRows = data.map((e, i) => (
|
||||
<tr key={i}>
|
||||
<td>
|
||||
<Center>{e?.Author?.username}</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>{e?.title}</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
<TampilanRupiahDonasi nominal={+e?.target} />
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>{e?.DonasiMaster_Ketegori.name}</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>{e?.DonasiMaster_Durasi.name} hari</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
<Button
|
||||
color={"red"}
|
||||
leftIcon={<IconEyeEdit />}
|
||||
radius={"xl"}
|
||||
variant="outline"
|
||||
onClick={() =>
|
||||
router.push(RouterAdminDonasi_OLD.detail_reject + `${e.id}`)
|
||||
}
|
||||
>
|
||||
Lihat Alasan
|
||||
</Button>
|
||||
</Center>
|
||||
|
||||
{/* <ModalReject opened={opened} close={close} /> */}
|
||||
</td>
|
||||
</tr>
|
||||
));
|
||||
|
||||
return (
|
||||
<>
|
||||
<Stack spacing={"xs"} h={"100%"}>
|
||||
{/* <pre>{JSON.stringify(listUser, null, 2)}</pre> */}
|
||||
<Group
|
||||
position="apart"
|
||||
bg={"red.4"}
|
||||
p={"xs"}
|
||||
style={{ borderRadius: "6px" }}
|
||||
>
|
||||
<Title order={4}>Reject</Title>
|
||||
<TextInput
|
||||
icon={<IconSearch size={20} />}
|
||||
radius={"xl"}
|
||||
placeholder="Masukan judul"
|
||||
onChange={(val) => {
|
||||
onSearch(val.currentTarget.value);
|
||||
}}
|
||||
/>
|
||||
</Group>
|
||||
|
||||
<Paper p={"md"} withBorder shadow="lg" h={"80vh"}>
|
||||
<ScrollArea w={"100%"} h={"90%"}>
|
||||
<Table
|
||||
verticalSpacing={"md"}
|
||||
horizontalSpacing={"md"}
|
||||
p={"md"}
|
||||
w={1500}
|
||||
striped
|
||||
highlightOnHover
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<Center>Username</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Judul</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Target</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Ketegori</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Durasi</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Alasan</Center>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>{TableRows}</tbody>
|
||||
</Table>
|
||||
</ScrollArea>
|
||||
{/* <ScrollArea>
|
||||
</ScrollArea> */}
|
||||
<Center mt={"xl"}>
|
||||
<Pagination
|
||||
value={isActivePage}
|
||||
total={isNPage}
|
||||
onChange={(val) => {
|
||||
onPageClick(val);
|
||||
}}
|
||||
/>
|
||||
</Center>
|
||||
</Paper>
|
||||
</Stack>
|
||||
|
||||
{data.map((e, i) => (
|
||||
<Modal
|
||||
key={e.id}
|
||||
opened={opened}
|
||||
onClose={close}
|
||||
centered
|
||||
withCloseButton={false}
|
||||
>
|
||||
<Stack>
|
||||
<Title order={6}>Alasan penolakan</Title>
|
||||
<Text>{i}</Text>
|
||||
</Stack>
|
||||
</Modal>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
async function ModalReject(opened: any, close: any) {
|
||||
return (
|
||||
<>
|
||||
<Modal opened={opened} onClose={close} centered withCloseButton={false}>
|
||||
<Stack>
|
||||
<Title order={6}>Alasan penolakan</Title>
|
||||
<Text>{"test"}</Text>
|
||||
</Stack>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
}
|
||||
187
src/app_modules/admin/donasi/sub_menu/table_review.tsx
Normal file
187
src/app_modules/admin/donasi/sub_menu/table_review.tsx
Normal file
@@ -0,0 +1,187 @@
|
||||
"use client";
|
||||
|
||||
import { RouterAdminDonasi_OLD } from "@/app/lib/router_hipmi/router_admin";
|
||||
import {
|
||||
ActionIcon,
|
||||
Box,
|
||||
Button,
|
||||
Center,
|
||||
Group,
|
||||
Modal,
|
||||
Pagination,
|
||||
Paper,
|
||||
ScrollArea,
|
||||
Stack,
|
||||
Table,
|
||||
Text,
|
||||
TextInput,
|
||||
Title,
|
||||
} from "@mantine/core";
|
||||
import { IconChevronLeft, IconEyeCheck, IconSearch } from "@tabler/icons-react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import ComponentAdminDonasi_TombolKembali from "../component/tombol_kembali";
|
||||
import { useDisclosure } from "@mantine/hooks";
|
||||
import AdminDonasi_DetailReview from "../detail/detail_review";
|
||||
import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
|
||||
import { useState } from "react";
|
||||
import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
|
||||
import ComponentAdminGlobal_HeaderTamplate from "../../component/header_tamplate";
|
||||
import _ from "lodash";
|
||||
import adminDonasi_getListReview from "../fun/get/get_list_review";
|
||||
|
||||
export default function AdminDonasi_TableReview({
|
||||
listReview,
|
||||
}: {
|
||||
listReview: MODEL_DONASI[];
|
||||
}) {
|
||||
return (
|
||||
<>
|
||||
<Stack h={"100%"}>
|
||||
<ComponentAdminGlobal_HeaderTamplate name="Donasi" />
|
||||
<TableStatus listReview={listReview} />
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function TableStatus({ listReview }: { listReview: any }) {
|
||||
const router = useRouter();
|
||||
const [isLoading, setLoading] = useState(false);
|
||||
const [idData, setIdData] = useState("");
|
||||
const [data, setData] = useState<MODEL_DONASI[]>(listReview.data);
|
||||
const [isNPage, setNPage] = useState(listReview.nPage);
|
||||
const [isActivePage, setActivePage] = useState(1);
|
||||
const [isSearch, setSearch] = useState("");
|
||||
|
||||
async function onSearch(s: string) {
|
||||
setSearch(s);
|
||||
const loadData = await adminDonasi_getListReview({
|
||||
page: 1,
|
||||
search: s,
|
||||
});
|
||||
setData(loadData.data as any);
|
||||
setNPage(loadData.nPage);
|
||||
}
|
||||
|
||||
async function onPageClick(p: any) {
|
||||
setActivePage(p);
|
||||
const loadData = await adminDonasi_getListReview({
|
||||
search: isSearch,
|
||||
page: p,
|
||||
});
|
||||
setData(loadData.data as any);
|
||||
setNPage(loadData.nPage);
|
||||
}
|
||||
|
||||
const TableRows = data.map((e, i) => (
|
||||
<tr key={i}>
|
||||
<td>
|
||||
<Center>{e?.Author?.username}</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>{e?.title}</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
<TampilanRupiahDonasi nominal={+e?.target} />
|
||||
</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>{e?.DonasiMaster_Ketegori.name}</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>{e?.DonasiMaster_Durasi.name} hari</Center>
|
||||
</td>
|
||||
<td>
|
||||
<Center>
|
||||
<Button
|
||||
loaderPosition="center"
|
||||
loading={isLoading && e?.id == idData ? true : false}
|
||||
color={"orange"}
|
||||
leftIcon={<IconEyeCheck />}
|
||||
radius={"xl"}
|
||||
variant="outline"
|
||||
onClick={() => {
|
||||
setLoading(true);
|
||||
setIdData(e?.id);
|
||||
router.push(RouterAdminDonasi_OLD.detail_review + `${e?.id}`);
|
||||
}}
|
||||
>
|
||||
Tampilkan
|
||||
</Button>
|
||||
</Center>
|
||||
</td>
|
||||
</tr>
|
||||
));
|
||||
|
||||
return (
|
||||
<>
|
||||
<Stack spacing={"xs"} h={"100%"}>
|
||||
{/* <pre>{JSON.stringify(listUser, null, 2)}</pre> */}
|
||||
<Group
|
||||
position="apart"
|
||||
bg={"orange.4"}
|
||||
p={"xs"}
|
||||
style={{ borderRadius: "6px" }}
|
||||
>
|
||||
<Title order={4}>Review</Title>
|
||||
<TextInput
|
||||
icon={<IconSearch size={20} />}
|
||||
radius={"xl"}
|
||||
placeholder="Masukan judul"
|
||||
onChange={(val) => {
|
||||
onSearch(val.currentTarget.value);
|
||||
}}
|
||||
/>
|
||||
</Group>
|
||||
|
||||
<Paper p={"md"} withBorder shadow="lg" h={"80vh"}>
|
||||
<ScrollArea w={"100%"} h={"90%"}>
|
||||
<Table
|
||||
verticalSpacing={"md"}
|
||||
horizontalSpacing={"md"}
|
||||
p={"md"}
|
||||
w={1500}
|
||||
h={"100%"}
|
||||
striped
|
||||
highlightOnHover
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<Center>Username</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Judul</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Target</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Ketegori</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Durasi</Center>
|
||||
</th>
|
||||
<th>
|
||||
<Center>Aksi</Center>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>{TableRows}</tbody>
|
||||
</Table>
|
||||
</ScrollArea>
|
||||
<Center mt={"xl"}>
|
||||
<Pagination
|
||||
value={isActivePage}
|
||||
total={isNPage}
|
||||
onChange={(val) => {
|
||||
onPageClick(val);
|
||||
}}
|
||||
/>
|
||||
</Center>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user