# fix

## Deskripsi:
- Perubahan tampilan notifikasi
- Pin map sesuai logo
- Pin map bisa custom
### No Issue

src/app_modules/investasi/_component/index.ts

@@ -1,7 +1,11 @@
 import { ComponentInvestasi_FrameFileView } from "./file_view/frame_file_view";
 import { ComponentInvestasi_BoxMetodePembayaran } from "./transaksi/box_metode_pembayaran";
 import { ComponentInvestasi_BoxPembelian } from "./transaksi/box_pembelian";
+import { ComponentInvestasi_ProsesAccAdmin } from "./transaksi/proses_acc_admin";
+import { ComponentInvestasi_ViewInvoice } from "./transaksi/view_invoice";
 
 export { ComponentInvestasi_BoxPembelian };
 export { ComponentInvestasi_BoxMetodePembayaran };
 export { ComponentInvestasi_FrameFileView };
+export { ComponentInvestasi_ViewInvoice };
+export { ComponentInvestasi_ProsesAccAdmin };

src/app_modules/investasi/_component/transaksi/box_metode_pembayaran.tsx

@@ -1,8 +1,11 @@
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
 import {
   AccentColor,
   MainColor,
 } from "@/app_modules/_global/color/color_pallet";
 import { Button, Paper, Radio, Stack, Text, Title } from "@mantine/core";
+import { useLocalStorage } from "@mantine/hooks";
+import { useRouter } from "next/navigation";
 import { useState } from "react";
 
 export function ComponentInvestasi_BoxMetodePembayaran({
@@ -10,12 +13,17 @@ export function ComponentInvestasi_BoxMetodePembayaran({
 }: {
   listBank: any[];
 }) {
+  const router = useRouter();
   const [bank, setBank] = useState(listBank);
   const [pilihBank, setPilihBank] = useState("");
   const [isLoading, setLoading] = useState(false);
+  const [total, setTotal] = useLocalStorage({
+    key: "total_investasi",
+    defaultValue: 0,
+  });
 
   async function onProses() {
-    console.log(pilihBank);
+    router.push(NEW_RouterInvestasi.invoice + "1", { scroll: false });
   }
 
   return (

src/app_modules/investasi/_component/transaksi/proses_acc_admin.tsx

@@ -0,0 +1,101 @@
+import { Warna } from "@/app/lib/warna";
+import {
+  AccentColor,
+  MainColor,
+} from "@/app_modules/_global/color/color_pallet";
+import {
+  Stack,
+  Paper,
+  Title,
+  Center,
+  Loader,
+  Group,
+  Text,
+} from "@mantine/core";
+import { IconBrandWhatsapp } from "@tabler/icons-react";
+import Link from "next/link";
+
+export function ComponentInvestasi_ProsesAccAdmin() {
+  return (
+    <>
+      <Stack>
+        <Paper
+          style={{
+            backgroundColor: AccentColor.blue,
+            border: `2px solid ${AccentColor.darkblue}`,
+            padding: "15px",
+            cursor: "pointer",
+            borderRadius: "10px",
+            color: "white",
+          }}
+        >
+          <Stack spacing={"md"}>
+            <Paper
+              style={{
+                backgroundColor: MainColor.darkblue,
+                border: `2px solid ${AccentColor.darkblue}`,
+                padding: "15px",
+                cursor: "pointer",
+                borderRadius: "10px",
+                color: "white",
+              }}
+            >
+              <Stack align="center" justify="center">
+                <Title order={6}>Admin sedang memproses transaksimu</Title>
+                <Paper radius={1000} w={100} h={100}>
+                  <Center h={"100%"}>
+                    <Loader size={"lg"} color="yellow" variant="bars" />
+                  </Center>
+                </Paper>
+                <Title order={6}>Mohon menunggu !</Title>
+              </Stack>
+            </Paper>
+          </Stack>
+        </Paper>
+        <Paper
+          style={{
+            backgroundColor: AccentColor.blue,
+            border: `2px solid ${AccentColor.darkblue}`,
+            padding: "15px",
+            cursor: "pointer",
+            borderRadius: "10px",
+            color: "white",
+          }}
+        >
+          <Paper
+            style={{
+              backgroundColor: AccentColor.darkblue,
+              border: `2px solid ${AccentColor.darkblue}`,
+              padding: "15px",
+              cursor: "pointer",
+              borderRadius: "10px",
+              color: "white",
+            }}
+          >
+            <Group position="center">
+              <Stack spacing={0}>
+                <Text fz={"xs"} fs={"italic"}>
+                  Hubungi admin jika tidak kunjung di proses!
+                </Text>
+                <Text fz={"xs"} fs={"italic"}>
+                  Klik pada logo Whatsapp ini.
+                </Text>
+              </Stack>
+              {/* <Link
+                  color="white"
+                  style={{
+                    color: "black",
+                    textDecoration: "none",
+                  }}
+                  target="_blank"
+                  href={`https://wa.me/+${nomorAdmin.nomor}?text=Hallo Admin , Saya ada kendala dalam proses transfer donasi!`}
+                >
+                  <IconBrandWhatsapp size={40} color={Warna.hijau_cerah} />
+                </Link> */}
+            </Group>
+          </Paper>
+        </Paper>
+      </Stack>
+    </>
+  );
+}

src/app_modules/investasi/_component/transaksi/view_invoice.tsx

@@ -0,0 +1,267 @@
+"use client";
+
+import { NEW_RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+import {
+  AccentColor,
+  MainColor,
+} from "@/app_modules/_global/color/color_pallet";
+import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
+import {
+  Stack,
+  Title,
+  Group,
+  Paper,
+  Grid,
+  CopyButton,
+  Button,
+  Center,
+  FileButton,
+  Text,
+} from "@mantine/core";
+import { IconCamera, IconCircleCheck } from "@tabler/icons-react";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+export function ComponentInvestasi_ViewInvoice({
+  dataInvoice,
+}: {
+  dataInvoice: any;
+}) {
+  const router = useRouter();
+  const [invoice, setDataInvoice] = useState(dataInvoice);
+  const [file, setFile] = useState<File | null>(null);
+  const [image, setImage] = useState<any | null>(null);
+  // const [active, setActive] = useAtom(gs_donasi_hot_menu);
+
+  return (
+    <>
+      <Stack spacing={"lg"} py={"md"}>
+        <Stack
+          spacing={0}
+          style={{
+            backgroundColor: AccentColor.blue,
+            border: `2px solid ${AccentColor.darkblue}`,
+            padding: "15px",
+            cursor: "pointer",
+            borderRadius: "10px",
+            color: "white",
+          }}
+        >
+          <Title order={5}>Mohon transfer ke rekening dibawah</Title>
+          <Group spacing={"xs"}>
+            <Text>untuk diteruskan ke </Text>
+            <Text fw={"bold"}>{invoice?.Donasi?.Author.username}</Text>
+          </Group>
+        </Stack>
+
+        <Paper
+          style={{
+            backgroundColor: AccentColor.blue,
+            border: `2px solid ${AccentColor.darkblue}`,
+            padding: "15px",
+            cursor: "pointer",
+            borderRadius: "10px",
+            color: "white",
+            marginBottom: "15px",
+          }}
+        >
+          <Stack spacing={"md"}>
+            <Stack spacing={0}>
+              <Text>Bank {invoice?.DonasiMaster_Bank?.name}</Text>
+              <Text>PT. Himpunan Pengusaha Badung</Text>
+            </Stack>
+            <Paper
+              style={{
+                backgroundColor: AccentColor.darkblue,
+                border: `2px solid ${AccentColor.blue}`,
+                padding: "15px",
+                cursor: "pointer",
+                borderRadius: "10px",
+                color: "white",
+              }}
+            >
+              <Grid>
+                <Grid.Col span={8}>
+                  <Group position="left" align="center" h={"100%"}>
+                    <Title order={4} color={MainColor.yellow}>
+                      {invoice?.DonasiMaster_Bank?.norek}
+                    </Title>
+                  </Group>
+                </Grid.Col>
+                <Grid.Col span={4}>
+                  <Group position="right">
+                    <CopyButton value={invoice?.DonasiMaster_Bank?.norek}>
+                      {({ copied, copy }) => (
+                        <Button
+                          style={{
+                            transition: "0.5s",
+                          }}
+                          radius={"xl"}
+                          onClick={copy}
+                          color={copied ? "teal" : "yellow"}
+                          c={"black"}
+                        >
+                          {copied ? "Berhasil" : "Salin"}
+                        </Button>
+                      )}
+                    </CopyButton>
+                  </Group>
+                </Grid.Col>
+              </Grid>
+            </Paper>
+          </Stack>
+        </Paper>
+
+        <Paper
+          style={{
+            backgroundColor: AccentColor.blue,
+            border: `2px solid ${AccentColor.darkblue}`,
+            padding: "15px",
+            cursor: "pointer",
+            borderRadius: "10px",
+            color: "white",
+            marginBottom: "15px",
+          }}
+        >
+          <Stack spacing={"md"}>
+            <Stack spacing={0}>
+              <Text>Jumlah transfer</Text>
+            </Stack>
+            <Paper
+              style={{
+                backgroundColor: AccentColor.darkblue,
+                border: `2px solid ${AccentColor.blue}`,
+                padding: "15px",
+                cursor: "pointer",
+                borderRadius: "10px",
+                color: "white",
+              }}
+            >
+              <Grid>
+                <Grid.Col span={8}>
+                  <Group position="left" align="center" h={"100%"}>
+                    <Title order={4} color="white">
+                      <TampilanRupiahDonasi nominal={+(+invoice.nominal)} />
+                    </Title>
+                  </Group>
+                </Grid.Col>
+                <Grid.Col span={4}>
+                  <Group position="right">
+                    <CopyButton value={"" + +invoice.nominal}>
+                      {({ copied, copy }) => (
+                        <Button
+                          style={{
+                            transition: "0.5s",
+                          }}
+                          variant="filled"
+                          radius={"xl"}
+                          color={copied ? "teal" : "yellow"}
+                          c={"black"}
+                          onClick={copy}
+                        >
+                          {copied ? "Berhasil" : "Salin"}
+                        </Button>
+                      )}
+                    </CopyButton>
+                  </Group>
+                </Grid.Col>
+              </Grid>
+            </Paper>
+            {/* <Text fz={"xs"} c={"gray"}>
+              Sudah termasuk biaya admin Rp. 2.500,-
+            </Text> */}
+          </Stack>
+        </Paper>
+
+        <Paper
+          style={{
+            backgroundColor: AccentColor.blue,
+            border: `2px solid ${AccentColor.darkblue}`,
+            padding: "15px",
+            cursor: "pointer",
+            borderRadius: "10px",
+            color: "white",
+            marginBottom: "15px",
+          }}
+        >
+          <Stack spacing={"sm"}>
+            <Center>
+              <FileButton
+                onChange={async (files: any | null) => {
+                  try {
+                    // const buffer = URL.createObjectURL(
+                    //   new Blob([new Uint8Array(await files.arrayBuffer())])
+                    // );
+                    // console.log(buffer, "ini buffer");
+                    // console.log(files, " ini file");
+                    setFile(files);
+                    // onUpload(invoice.id, files);
+                  } catch (error) {
+                    console.log(error);
+                  }
+                }}
+                accept="image/png,image/jpeg"
+              >
+                {(props) => (
+                  <Button
+                    {...props}
+                    radius={"xl"}
+                    leftIcon={<IconCamera />}
+                    bg={MainColor.yellow}
+                    color="yellow"
+                    c={"black"}
+                  >
+                    Upload
+                  </Button>
+                )}
+              </FileButton>
+            </Center>
+            {file ? (
+              <Center>
+                <Group spacing={"xs"}>
+                  <Text fz={"xs"} fs={"italic"}>
+                    Upload berhasil{" "}
+                  </Text>
+                  <IconCircleCheck color="green" />
+                </Group>
+              </Center>
+            ) : (
+              <Center>
+                <Text fz={"xs"} fs={"italic"}>
+                  Upload bukti transfer anda !
+                </Text>
+              </Center>
+            )}
+          </Stack>
+        </Paper>
+
+        {file !== null ? (
+          <Button
+            radius={"xl"}
+            bg={MainColor.yellow}
+            color="yellow"
+            c={"black"}
+            // onClick={() => onClick(router, invoice.id, setActive)}
+            onClick={() => {
+              router.push(NEW_RouterInvestasi.proses_transaksi + "1", {
+                scroll: false,
+              });
+            }}
+          >
+            Saya Sudah Transfer
+          </Button>
+        ) : (
+          <Button
+            disabled
+            radius={"xl"}
+            //  bg={"orange"}
+            //  color="orange"
+            //  onClick={() => onClick(router, invoice.id)}
+          >
+            Menunggu Bukti Transfer
+          </Button>
+        )}
+      </Stack>
+    </>
+  );
+}