feat

Desc:
- Fitur metode transfer

fix
Desc:
- Perubahan minor

#No issue

src/app_modules/investasi/proses_investasi/view.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { RouteInvestasi } from "@/app/lib/app_route";
 import { Warna } from "@/app/lib/warna";
 import {
   ActionIcon,
@@ -9,6 +10,7 @@ import {
   Divider,
   Grid,
   Group,
+  NumberInput,
   Text,
   Title,
 } from "@mantine/core";
@@ -26,9 +28,11 @@ import toast from "react-simple-toasts";
 
 export default function ProsesInvestasi() {
   const router = useRouter();
-  const [count, handlers] = useCounter(0, { min: 1, max: 1000 });
+  // const [count, handlers] = useCounter(0, { min: 1, max: 1000 });
+  const [sisaLembar, setSisaLembar] = useState(5000);
   const [hargaLembar, setHargaLembar] = useState(1000);
-
+  const [beli, setBeli] = useState(0);
+  const [total, setTotal] = useState(0);
 
   //   const formatter = new Intl.NumberFormat("", {
   //     style: 'currency',
@@ -36,14 +40,47 @@ export default function ProsesInvestasi() {
 
   //   });
 
-  
+  async function onProses() {
+    if (beli === 0) return toast("Masukan jumlah pembelian saham");
+    if (beli < 10) return toast("Minimal pemebelian 10 Lembar");
+    const hasil = hargaLembar * beli;
+    setTotal(hasil);
+  }
+
+  async function onBeli() {
+    router.push(RouteInvestasi.metode_transfer);
+    localStorage.setItem("total_harga", total as any);
+  }
 
   return (
     <>
       <Box px={"md"}>
+        {/* Sisa Lembar Saham */}
         <Group position="apart" mb={"md"}>
-          <Text>Lembar Saham</Text>
-          <Group position="center">
+          <Text>Sisa Lembar Saham</Text>
+          <Text fz={23}>{sisaLembar} </Text>
+        </Group>
+
+        {/* Harga perlembar saham */}
+        <Group position="apart" mb={"md"}>
+          <Text>Harga Perlembar</Text>
+          <Text fz={23}>Rp.{hargaLembar} </Text>
+        </Group>
+
+        {/* Lembar saham */}
+        <Group position="apart" mb={"md"}>
+          <Box>
+            <Text>Jumlah Pembelian</Text>
+            <Text fs={"italic"} fz={"xs"}>
+              minimal pembelian 10 lembar
+            </Text>
+          </Box>
+          <NumberInput
+            w={100}
+            value={beli}
+            onChange={(val: number) => setBeli(val)}
+          />
+          {/* <Group position="center">
             <ActionIcon variant="filled" radius={50} onClick={handlers.reset}>
               <IconRefresh />
             </ActionIcon>
@@ -55,7 +92,7 @@ export default function ProsesInvestasi() {
             >
               <IconMinus />
             </ActionIcon>
-            {/* Jumlah saham  */}
+
             <Text>{count}</Text>
             <ActionIcon
               variant="filled"
@@ -71,37 +108,49 @@ export default function ProsesInvestasi() {
             >
               <IconNumber10Small />
             </ActionIcon>
-          </Group>
+          </Group> */}
         </Group>
 
-        <Group position="apart" mb={"md"}>
-          <Text>Harga Perlembar</Text>
-          <Text fz={23}>Rp.{hargaLembar} </Text>
-        </Group>
-
-        <Divider />
-        <Group position="apart" mb={"md"}>
-          <Text>Total Harga</Text>
-          <Text fz={25}>Rp.{hargaLembar * count} </Text>
-        </Group>
+        {/* Tombol Proses  */}
         <Center>
           <Button
-            w={350}
+            w={100}
+            compact
             radius={50}
-            bg={Warna.biru}
-            onClick={() => {
-             
-              if(hargaLembar * count === 1000){
-                return toast("Minimal pembelian 10.000")
-              } else {
-                router.push("/dev/investasi/upload_bukti");
-                localStorage.setItem("total_harga", (hargaLembar * count) as any)
-              }
-            }}
+            bg={Warna.hijau_tua}
+            color="green"
+            onClick={onProses}
           >
             Proses
           </Button>
         </Center>
+
+        <Divider my={"lg"} />
+
+        <Group position="apart" mb={"md"}>
+          <Box>
+            <Text>Total Harga</Text>
+          </Box>
+          <Text fz={25}>Rp.{total} </Text>
+        </Group>
+        <Center>
+          {total < 10000 ? (
+            <Button w={350} radius={50} bg={"gray"} disabled>
+              Beli Saham
+            </Button>
+          ) : (
+            <Button
+              w={350}
+              radius={50}
+              bg={Warna.biru}
+              onClick={() => {
+                onBeli();
+              }}
+            >
+              Beli Saham
+            </Button>
+          )}
+        </Center>
       </Box>
     </>
   );