Revisi Tampilan Admin

# fix :
- Tampilan Donasi
# feat :
- Penambahan App Information
## No Issuee
This commit is contained in:
2024-06-06 12:05:06 +08:00
parent 5b8cd3a4b6
commit 0e16d6501f
295 changed files with 2861 additions and 918 deletions

View File

@@ -0,0 +1,23 @@
"use server";
import prisma from "@/app/lib/prisma";
export default async function adminAppInformation_createBank({
data,
}: {
data: any;
}) {
const count = await prisma.masterBank.count({});
const idBank = count + 1;
const create = await prisma.masterBank.create({
data: {
id: idBank.toString(),
name: data.name,
norek: data.norek,
},
});
if (!create) return { status: 400, message: "Gagal menambahkan" };
return { status: 200, message: "Berhasil menambahkan" };
}

View File

@@ -0,0 +1,17 @@
"use server";
import prisma from "@/app/lib/prisma";
export default async function adminAppInformation_getOneBankById({
id,
}: {
id: string;
}) {
const data = await prisma.masterBank.findFirst({
where: {
id: id,
},
});
return data;
}

View File

@@ -0,0 +1,13 @@
"use server";
import prisma from "@/app/lib/prisma";
export default async function adminAppInformation_getMasterBank() {
const data = await prisma.masterBank.findMany({
orderBy: {
createdAt: "desc",
},
});
return data;
}

View File

@@ -0,0 +1,13 @@
"use server";
import prisma from "@/app/lib/prisma";
export default async function adminAppInformation_getNomorAdmin() {
const data = await prisma.nomorAdmin.findFirst({
where: {
isActive: true,
},
});
return data;
}

View File

@@ -0,0 +1,22 @@
"use server";
import prisma from "@/app/lib/prisma";
import { MODEL_DATA_BANK } from "@/app_modules/investasi/model/model_investasi";
export default async function adminAppInformation_updateStatusBankById({
data,
}: {
data: MODEL_DATA_BANK;
}) {
const updt = await prisma.masterBank.update({
where: {
id: data.id,
},
data: {
active: data.active,
},
});
if (!updt) return { status: 400, message: "Gagal update" };
return { status: 200, message: "Berhasil update" };
}

View File

@@ -0,0 +1,23 @@
"use server";
import prisma from "@/app/lib/prisma";
import { MODEL_DATA_BANK } from "@/app_modules/investasi/model/model_investasi";
export default async function adminAppInformation_updateDataBankById({
data,
}: {
data: MODEL_DATA_BANK;
}) {
const updt = await prisma.masterBank.update({
where: {
id: data.id,
},
data: {
name: data.name,
norek: data.norek,
},
});
if (!updt) return { status: 400, message: "Gagal update" };
return { status: 200, message: "Berhasil update" };
}

View File

@@ -0,0 +1,21 @@
"use server";
import prisma from "@/app/lib/prisma";
export default async function adminAppInformation_funUpdateNomorAdmin({
data,
}: {
data: any;
}) {
const updt = await prisma.nomorAdmin.update({
where: {
id: data.id,
},
data: {
nomor: data.nomor,
},
});
if (!updt) return { status: 400, message: "Gagal update" };
return { status: 200, message: "Berhasil update" };
}

View File

@@ -0,0 +1,2 @@
import AdminAppInformation_MainView from "./main";
export { AdminAppInformation_MainView };

View File

@@ -0,0 +1,60 @@
"use client";
import {
ActionIcon,
Button,
Center,
Grid,
Group,
Modal,
Paper,
ScrollArea,
Space,
Stack,
Table,
Text,
TextInput,
Title,
Tooltip,
} from "@mantine/core";
import { list } from "postcss";
import ComponentAdminGlobal_HeaderTamplate from "../../component_global/header_tamplate";
import { useState } from "react";
import {
IconEdit,
IconEye,
IconEyeClosed,
IconEyeOff,
IconPhone,
IconPlus,
IconTrack,
IconTrash,
} from "@tabler/icons-react";
import { ComponentGlobalAdmin_NotifikasiPeringatan } from "../../component_global/admin_notifikasi/notifikasi_peringatan";
import adminAppInformation_funUpdateNomorAdmin from "../fun/update/fun_update_nomor";
import { ComponentGlobalAdmin_NotifikasiBerhasil } from "../../component_global/admin_notifikasi/notifikasi_berhasil";
import { ComponentGlobalAdmin_NotifikasiGagal } from "../../component_global/admin_notifikasi/notifikasi_gagal";
import adminAppInformation_getNomorAdmin from "../fun/master/get_nomor_admin";
import { MODEL_DATA_BANK } from "@/app_modules/investasi/model/model_investasi";
import _ from "lodash";
import InformasiWhatApps from "./info_whatsapp";
import InformasiBank from "./info_bank";
export default function AdminAppInformation_MainView({
nomorAdmin,
listBank,
}: {
nomorAdmin: any;
listBank: any[];
}) {
return (
<>
<Stack h={"100%"}>
<ComponentAdminGlobal_HeaderTamplate name="App Information" />
<InformasiWhatApps nomorAdmin={nomorAdmin} />
<Space h={50} />
<InformasiBank listBank={listBank} />
</Stack>
</>
);
}

View File

@@ -0,0 +1,401 @@
"use client";
import { MODEL_DATA_BANK } from "@/app_modules/investasi/model/model_investasi";
import {
Center,
Stack,
ActionIcon,
Tooltip,
Group,
Title,
Button,
Paper,
ScrollArea,
Modal,
TextInput,
Text,
Table,
SimpleGrid,
Grid,
Switch,
} from "@mantine/core";
import {
IconEye,
IconEyeOff,
IconEdit,
IconTrash,
IconPlus,
IconCirclePlus,
} from "@tabler/icons-react";
import _, { fill } from "lodash";
import { useState } from "react";
import adminAppInformation_createBank from "../fun/create/fun_create_new_bank";
import adminAppInformation_getMasterBank from "../fun/master/get_list_bank";
import { ComponentGlobalAdmin_NotifikasiBerhasil } from "../../component_global/admin_notifikasi/notifikasi_berhasil";
import { ComponentGlobalAdmin_NotifikasiGagal } from "../../component_global/admin_notifikasi/notifikasi_gagal";
import adminAppInformation_getOneBankById from "../fun/get/get_one_bank_by_id";
import { useShallowEffect } from "@mantine/hooks";
import adminAppInformation_updateDataBankById from "../fun/update/fun_update_data_bank";
import adminAppInformation_updateStatusBankById from "../fun/update/fun_udpate_status_bank";
export default function InformasiBank({
listBank,
}: {
listBank: MODEL_DATA_BANK[];
}) {
const [data, setData] = useState(listBank);
const [isCreate, setIsCreate] = useState(false);
const [newData, setNewData] = useState({
name: "",
norek: "",
});
const [isUpdate, setIsUpdate] = useState(false);
const [updateData, setUpdateData] = useState({
id: "",
name: "",
norek: "",
});
const [isActivation, setIsActivation] = useState(false);
const [updateStatus, setUpdateStatus] = useState({
id: "",
active: "",
});
const [checked, setChecked] = useState(false);
async function onCreate() {
const create = await adminAppInformation_createBank({ data: newData });
if (create.status === 200) {
const loadData = await adminAppInformation_getMasterBank();
setData(loadData);
ComponentGlobalAdmin_NotifikasiBerhasil(create.message);
} else {
ComponentGlobalAdmin_NotifikasiGagal(create.message);
}
setIsCreate(false);
}
async function onUpdate() {
const updt = await adminAppInformation_updateDataBankById({
data: updateData as any,
});
if (updt.status === 200) {
const loadData = await adminAppInformation_getMasterBank();
setData(loadData);
ComponentGlobalAdmin_NotifikasiBerhasil(updt.message);
setIsUpdate(false);
} else {
ComponentGlobalAdmin_NotifikasiGagal(updt.message);
}
}
async function onUpdateActivation({
id,
value,
}: {
id: string;
value: boolean;
}) {
const data = {
id: id,
active: value,
};
const updt = await adminAppInformation_updateStatusBankById({
data: data as any,
});
if (updt.status === 200) {
const loadData = await adminAppInformation_getMasterBank();
setData(loadData);
ComponentGlobalAdmin_NotifikasiBerhasil(updt.message);
setIsActivation(false);
} else {
ComponentGlobalAdmin_NotifikasiGagal(updt.message);
}
}
const rowTable = _.isEmpty(data) ? (
<tr>
<Center>
<Text>Tidak ada data</Text>
</Center>
</tr>
) : (
data.map((e, i) => (
<tr key={i}>
<td>
<Center>
<Text>{e?.name}</Text>
</Center>
</td>
<td>
<Center>
<Text>{e?.norek}</Text>
</Center>
</td>
<td>
<Center>
<Switch
color="orange"
onLabel="ON"
offLabel="OFF"
checked={e?.active}
onChange={(val) => {
setIsActivation(true);
setUpdateStatus({
id: e?.id,
active: val.currentTarget.checked as any,
});
}}
/>
</Center>
</td>
<td>
<Stack align="center" justify="center">
<ActionIcon
radius={"xl"}
variant="transparent"
onClick={() => {
setIsUpdate(true);
setIsCreate(false);
setUpdateData({
id: e?.id,
name: e?.name,
norek: e?.norek,
});
}}
>
<Tooltip label="Edit">
<IconEdit color="green" />
</Tooltip>
</ActionIcon>
</Stack>
</td>
</tr>
))
);
return (
<>
<Stack spacing={"xs"}>
<Group
position="apart"
bg={"gray.4"}
p={"xs"}
style={{ borderRadius: "6px" }}
>
<Title order={4}>Informasi Bank</Title>
<Button
w={120}
leftIcon={<IconCirclePlus />}
radius={"xl"}
onClick={() => {
setIsCreate(true);
setIsUpdate(false);
}}
>
Tambah
</Button>
</Group>
</Stack>
<Grid>
<Grid.Col span={"auto"}>
<Paper p={"md"} withBorder shadow="lg" h={"50vh"}>
<ScrollArea w={"100%"} h={"90%"} offsetScrollbars>
<Table
verticalSpacing={"xs"}
horizontalSpacing={"md"}
p={"md"}
w={"100%"}
striped
highlightOnHover
>
<thead>
<tr>
<th>
<Center>Nama Bank</Center>
</th>
<th>
<Center>Nomor Rekening</Center>
</th>
<th>
<Center>Status</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.Col span={4}>
{isCreate ? (
<Paper p={"md"} withBorder shadow="lg">
<Stack>
<Center>
<Title order={5}>Tambah Daftar Bank</Title>
</Center>
<TextInput
label={"Nama Bank"}
placeholder="Masukan nama bank"
onChange={(val) => {
setNewData({
...newData,
name: val.currentTarget.value,
});
}}
/>
<TextInput
label={"Nomor Rekening Bank"}
placeholder=" Masukan nomor rekening bank"
type="number"
onChange={(val) => {
setNewData({
...newData,
norek: val.currentTarget.value,
});
}}
/>
<Group position="right" align="flex-end">
<Button
radius={"xl"}
onClick={() => {
setIsCreate(false);
}}
>
Batal
</Button>
<Button
style={{ transition: "0.5s" }}
disabled={_.values(newData).includes("") ? true : false}
radius={"xl"}
color="green"
onClick={() => {
onCreate();
}}
>
Simpan
</Button>
</Group>
</Stack>
</Paper>
) : (
""
)}
{isUpdate ? (
<Paper p={"md"} withBorder shadow="lg">
<Stack>
<Center>
<Title order={5}>Update Data Bank</Title>
</Center>
<TextInput
label={"Nama Bank"}
placeholder="Masukan nama bank"
value={updateData.name}
onChange={(val) => {
const value = val.currentTarget.value;
setUpdateData({ ...updateData, name: value });
}}
/>
<TextInput
label={"Nomor Rekening Bank"}
placeholder=" Masukan nomor rekening bank"
type="number"
value={updateData.norek}
onChange={(val) => {
const value = val.currentTarget.value;
setUpdateData({ ...updateData, norek: value });
}}
/>
<Group position="right">
<Button
radius={"xl"}
onClick={() => {
setIsUpdate(false);
}}
>
Batal
</Button>
<Button
style={{ transition: "0.5s" }}
disabled={
updateData?.name === "" || updateData?.norek === ""
? true
: false
}
radius={"xl"}
color="green"
onClick={() => {
onUpdate();
}}
>
Simpan
</Button>
</Group>
</Stack>
</Paper>
) : (
""
)}
</Grid.Col>
</Grid>
{/* Activasi bank */}
<Modal
centered
withCloseButton={false}
opened={isActivation}
onClose={() => setIsActivation(false)}
>
<Stack align="center">
<Title order={5}>
Anda ingin{" "}
{updateStatus.active ? (
<Text span inherit>
mengaktifkan
</Text>
) : (
<Text span inherit>
menonaktifkan
</Text>
)}{" "}
Bank ini ?
</Title>
<Group>
<Button radius={"xl"} onClick={() => setIsActivation(false)}>
Batal
</Button>
<Button
color="green"
radius={"xl"}
onClick={() => {
onUpdateActivation({
id: updateStatus.id,
value: updateStatus.active as any,
});
}}
>
Iya
</Button>
</Group>
</Stack>
</Modal>
</>
);
}

View File

@@ -0,0 +1,135 @@
" use client";
import {
Stack,
Group,
Title,
Paper,
ActionIcon,
TextInput,
Button,
Box,
Tooltip,
} from "@mantine/core";
import { IconEdit, IconPhone } from "@tabler/icons-react";
import { useState } from "react";
import { ComponentGlobalAdmin_NotifikasiBerhasil } from "../../component_global/admin_notifikasi/notifikasi_berhasil";
import { ComponentGlobalAdmin_NotifikasiGagal } from "../../component_global/admin_notifikasi/notifikasi_gagal";
import adminAppInformation_getNomorAdmin from "../fun/master/get_nomor_admin";
import adminAppInformation_funUpdateNomorAdmin from "../fun/update/fun_update_nomor";
export default function InformasiWhatApps({ nomorAdmin }: { nomorAdmin: any }) {
const [disabled, setDisable] = useState(true);
const [dataNomor, setDataNomor] = useState(nomorAdmin);
const [updateNomor, setUpdateNomor] = useState("");
async function onUpdate() {
const newNumber = (dataNomor.nomor = updateNomor);
setDataNomor({
...dataNomor,
nomor: newNumber,
});
const updt = await adminAppInformation_funUpdateNomorAdmin({
data: dataNomor,
});
if (updt.status === 200) {
setDisable(true);
setUpdateNomor("");
const loadDdata = await adminAppInformation_getNomorAdmin();
setDataNomor(loadDdata);
if (loadDdata) {
ComponentGlobalAdmin_NotifikasiBerhasil(updt.message);
return;
}
} else {
ComponentGlobalAdmin_NotifikasiGagal(updt.message);
}
}
return (
<>
<Stack>
<Stack spacing={"xs"}>
<Group
position="apart"
bg={"gray.4"}
p={"xs"}
style={{ borderRadius: "6px" }}
>
<Title order={4}>Informasi WhatsApp</Title>
</Group>
</Stack>
<Paper w={"50%"} withBorder p={"md"}>
<Stack>
<Paper bg={"gray.4"} p={"xl"}>
<Group position="apart">
<Title order={2}>{`+${dataNomor.nomor}`}</Title>
<Tooltip label={"Edit"}>
<ActionIcon
style={{ transition: "0.2s" }}
variant="subtle"
disabled={disabled ? false : true}
radius={"xl"}
onClick={() => {
setDisable(false);
setUpdateNomor(dataNomor.nomor);
}}
>
<IconEdit
style={{ transition: "0.2s" }}
color={disabled ? "green" : "gray"}
/>
</ActionIcon>
</Tooltip>
</Group>
</Paper>
{disabled ? (
""
) : (
<Stack>
<TextInput
disabled={disabled ? true : false}
type="number"
placeholder="Update nomor admin"
icon={<IconPhone />}
value={updateNomor}
label={<Title order={6}>Nomor Aktif Admin</Title>}
onChange={(val) => {
setUpdateNomor(val.currentTarget.value);
}}
/>
<Group position="right">
<Button
style={{ transition: "0.2s" }}
disabled={disabled ? true : false}
radius={"xl"}
onClick={() => {
setDisable(true);
setUpdateNomor("");
}}
>
Batal
</Button>
<Button
style={{ transition: "0.2s" }}
disabled={disabled || updateNomor === "" ? true : false}
color="green"
radius={"xl"}
onClick={() => {
onUpdate();
}}
>
Update
</Button>
</Group>
</Stack>
)}
</Stack>
</Paper>
</Stack>
</>
);
}