Invesment

Fix: create & edit list master sudah terintegrasi ke API ### No Issue
2025-09-30 11:00:31 +08:00
parent ccdd7730b2
commit 3d8d8568a3
3 changed files with 279 additions and 126 deletions
--- a/app/(application)/(user)/investment/[id]/edit.tsx
+++ b/app/(application)/(user)/investment/[id]/edit.tsx
@@ -4,6 +4,7 @@ import {
  ButtonCustom,
  InformationBox,
  LandscapeFrameUploaded,
+  LoaderCustom,
  SelectCustom,
  Spacing,
  StackCustom,
@@ -12,13 +13,11 @@ import {
 } from "@/components";
 import API_STRORAGE from "@/constants/base-url-api-strorage";
 import DIRECTORY_ID from "@/constants/directory-id";
-import dummyPembagianDeviden from "@/lib/dummy-data/investment/pembagian-deviden";
-import dummyListPencarianInvestor from "@/lib/dummy-data/investment/pencarian-investor";
-import dummyPeriodeDeviden from "@/lib/dummy-data/investment/periode-deviden";
 import {
  apiInvestmentGetById,
  apiInvestmentUpdateData,
 } from "@/service/api-client/api-investment";
+import { apiMasterInvestment } from "@/service/api-client/api-master";
 import {
  deleteImageService,
  uploadImageService,
@@ -26,6 +25,7 @@ import {
 import { formatCurrencyDisplay } from "@/utils/formatCurrencyDisplay";
 import pickFile from "@/utils/pickFile";
 import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
+import _ from "lodash";
 import { useCallback, useState } from "react";
 import Toast from "react-native-toast-message";

@@ -61,24 +61,33 @@ export default function InvestmentEdit() {

  const [image, setImage] = useState<string | null>(null);
  const [isLoading, setIsLoading] = useState(false);
-
-  const displayTargetDana = formatCurrencyDisplay(data?.targetDana);
-  const displayHargaPerLembar = formatCurrencyDisplay(data?.hargaLembar);
-  const displayTotalLembar = formatCurrencyDisplay(
-    Number(data?.targetDana) / Number(data?.hargaLembar)
-  );
-
-  const handleChangeCurrency = (field: keyof typeof data) => (text: string) => {
-    const numeric = text.replace(/\D/g, "");
-    setData((prev) => ({ ...prev, [field]: numeric }));
-  };
+  const [loadingMaster, setLoadingMaster] = useState(false);
+  const [listPencarianInvestor, setListPencarianInvestor] = useState<any[]>([]);
+  const [listPeriodeDeviden, setListPeriodeDeviden] = useState<any[]>([]);
+  const [listPembagianDeviden, setListPembagianDeviden] = useState<any[]>([]);

  useFocusEffect(
    useCallback(() => {
+      onLoadMaster();
      onLoadData();
    }, [id])
  );

+  const onLoadMaster = async () => {
+    try {
+      setLoadingMaster(true);
+      const response = await apiMasterInvestment({ category: "" });
+
+      setListPencarianInvestor(response.data.pencarianInvestor);
+      setListPeriodeDeviden(response.data.periodeDeviden);
+      setListPembagianDeviden(response.data.pembagianDeviden);
+    } catch (error) {
+      console.log("[ERROR]", error);
+    } finally {
+      setLoadingMaster(false);
+    }
+  };
+
  const onLoadData = async () => {
    try {
      const response = await apiInvestmentGetById({
@@ -91,25 +100,44 @@ export default function InvestmentEdit() {
    }
  };

-  const handleSubmitUpdate = async () => {
-    let newData = {
-      ...data,
-    };
+  const displayTargetDana = formatCurrencyDisplay(data?.targetDana);
+  const displayHargaPerLembar = formatCurrencyDisplay(data?.hargaLembar);
+  const displayTotalLembar = formatCurrencyDisplay(
+    Number(data?.targetDana) / Number(data?.hargaLembar)
+  );

+  const handleChangeCurrency = (field: keyof typeof data) => (text: string) => {
+    const numeric = text.replace(/\D/g, "");
+    setData((prev) => ({ ...prev, [field]: numeric }));
+  };
+
+  const validateData = () => {
    if (
-      newData?.title === "" ||
-      newData?.targetDana === "" ||
-      newData?.hargaLembar === "" ||
-      newData?.totalLembar === "" ||
-      newData?.roi === "" ||
-      newData?.masterPencarianInvestorId === "" ||
-      newData?.masterPeriodeDevidenId === "" ||
-      newData?.masterPembagianDevidenId === ""
+      !data.title ||
+      !data.targetDana ||
+      !data.hargaLembar ||
+      !data.totalLembar ||
+      !data.roi ||
+      !data.masterPencarianInvestorId ||
+      !data.masterPeriodeDevidenId ||
+      !data.masterPembagianDevidenId
    ) {
      Toast.show({
        type: "info",
        text1: "Harap isi semua data",
      });
+      return false;
+    }
+
+    return true;
+  };
+
+  const handleSubmitUpdate = async () => {
+    let newData = {
+      ...data,
+    };
+
+    if (!validateData()) {
      return;
    }

@@ -153,7 +181,10 @@ export default function InvestmentEdit() {
        data: newData,
      });

-      console.log("[RESPONSE UPDATE]", JSON.parse(JSON.stringify(responseUpdate)));
+      console.log(
+        "[RESPONSE UPDATE]",
+        JSON.parse(JSON.stringify(responseUpdate))
+      );

      if (responseUpdate.success) {
        Toast.show({
@@ -249,47 +280,72 @@ export default function InvestmentEdit() {
          value={data?.roi === "" ? "" : data?.roi}
        />

-        <SelectCustom
-          required
-          placeholder="Pilih batas waktu"
-          label="Pencarian Investor"
-          data={dummyListPencarianInvestor.map((item) => ({
-            label: item.name + `${" "}hari`,
-            value: item.id,
-          }))}
-          onChange={(value) =>
-            setData({ ...data, masterPencarianInvestorId: value as any })
-          }
-          value={data.masterPencarianInvestorId}
-        />
+        {loadingMaster ? (
+          <LoaderCustom />
+        ) : (
+          <SelectCustom
+            required
+            placeholder="Pilih batas waktu"
+            label="Pencarian Investor"
+            data={
+              _.isEmpty(listPencarianInvestor)
+                ? []
+                : listPencarianInvestor.map((item) => ({
+                    label: item.name + `${" "}hari`,
+                    value: item.id,
+                  }))
+            }
+            onChange={(value) =>
+              setData({ ...data, masterPencarianInvestorId: value as any })
+            }
+            value={data.masterPencarianInvestorId}
+          />
+        )}

-        <SelectCustom
-          required
-          placeholder="Pilih batas waktu"
-          label="Pilih Periode Deviden"
-          data={dummyPeriodeDeviden.map((item) => ({
-            label: item.name,
-            value: item.id,
-          }))}
-          onChange={(value) =>
-            setData({ ...data, masterPeriodeDevidenId: value as any })
-          }
-          value={data.masterPeriodeDevidenId}
-        />
+        {loadingMaster ? (
+          <LoaderCustom />
+        ) : (
+          <SelectCustom
+            required
+            placeholder="Pilih batas waktu"
+            label="Pilih Periode Deviden"
+            data={
+              _.isEmpty(listPeriodeDeviden)
+                ? []
+                : listPeriodeDeviden.map((item) => ({
+                    label: item.name,
+                    value: item.id,
+                  }))
+            }
+            onChange={(value) =>
+              setData({ ...data, masterPeriodeDevidenId: value as any })
+            }
+            value={data.masterPeriodeDevidenId}
+          />
+        )}
+
+        {loadingMaster ? (
+          <LoaderCustom />
+        ) : (
+          <SelectCustom
+            required
+            placeholder="Pilih batas waktu"
+            label="Pilih Pembagian Deviden"
+            data={
+              _.isEmpty(listPembagianDeviden)
+                ? []
+                : listPembagianDeviden.map((item) => ({
+                    label: item.name + `${" "}bulan`,
+                    value: item.id,
+                  }))
+            }
+            onChange={(value) =>
+              setData({ ...data, masterPembagianDevidenId: value as any })
+            }
+            value={data.masterPembagianDevidenId}
+          />
+        )}

-        <SelectCustom
-          required
-          placeholder="Pilih batas waktu"
-          label="Pilih Pembagian Deviden"
-          data={dummyPembagianDeviden.map((item) => ({
-            label: item.name + `${" "}bulan`,
-            value: item.id,
-          }))}
-          onChange={(value) =>
-            setData({ ...data, masterPembagianDevidenId: value as any })
-          }
-          value={data.masterPembagianDevidenId}
-        />
        <Spacing />
        <ButtonCustom isLoading={isLoading} onPress={handleSubmitUpdate}>
          Simpan
--- a/app/(application)/(user)/investment/create.tsx
+++ b/app/(application)/(user)/investment/create.tsx
@@ -5,6 +5,7 @@ import {
  CenterCustom,
  InformationBox,
  LandscapeFrameUploaded,
+  LoaderCustom,
  SelectCustom,
  Spacing,
  StackCustom,
@@ -15,16 +16,15 @@ import {
 import { MainColor } from "@/constants/color-palet";
 import DIRECTORY_ID from "@/constants/directory-id";
 import { useAuth } from "@/hooks/use-auth";
-import dummyPembagianDeviden from "@/lib/dummy-data/investment/pembagian-deviden";
-import dummyListPencarianInvestor from "@/lib/dummy-data/investment/pencarian-investor";
-import dummyPeriodeDeviden from "@/lib/dummy-data/investment/periode-deviden";
 import { apiInvestmentCreate } from "@/service/api-client/api-investment";
+import { apiMasterInvestment } from "@/service/api-client/api-master";
 import { uploadImageService } from "@/service/upload-service";
 import { formatCurrencyDisplay } from "@/utils/formatCurrencyDisplay";
 import pickFile, { IFileData } from "@/utils/pickFile";
 import { FontAwesome5 } from "@expo/vector-icons";
-import { router } from "expo-router";
-import { useState } from "react";
+import { router, useFocusEffect } from "expo-router";
+import _ from "lodash";
+import { useCallback, useState } from "react";
 import Toast from "react-native-toast-message";

 export default function InvestmentCreate() {
@@ -46,6 +46,32 @@ export default function InvestmentCreate() {
  const [pdf, setPdf] = useState<IFileData | null>(null);
  const [isLoading, setIsLoading] = useState(false);

+  const [loadingMaster, setLoadingMaster] = useState(false);
+  const [listPencarianInvestor, setListPencarianInvestor] = useState<any[]>([]);
+  const [listPeriodeDeviden, setListPeriodeDeviden] = useState<any[]>([]);
+  const [listPembagianDeviden, setListPembagianDeviden] = useState<any[]>([]);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadMaster();
+    }, [])
+  );
+
+  const onLoadMaster = async () => {
+    try {
+      setLoadingMaster(true);
+      const response = await apiMasterInvestment({ category: "" });
+
+      setListPencarianInvestor(response.data.pencarianInvestor);
+      setListPeriodeDeviden(response.data.periodeDeviden);
+      setListPembagianDeviden(response.data.pembagianDeviden);
+    } catch (error) {
+      console.log("[ERROR]", error);
+    } finally {
+      setLoadingMaster(false);
+    }
+  };
+
  const displayTargetDana = formatCurrencyDisplay(data.targetDana);
  const displayHargaPerLembar = formatCurrencyDisplay(data.hargaPerLembar);
  const displayTotalLembar = formatCurrencyDisplay(
@@ -57,15 +83,7 @@ export default function InvestmentCreate() {
    setData((prev) => ({ ...prev, [field]: numeric }));
  };

-  const handleSubmit = async () => {
-    if (!image || !pdf) {
-      Toast.show({
-        type: "error",
-        text1: "Harap pilih gambar dan file PDF",
-      });
-      return;
-    }
-
+  const validateData = () => {
    if (
      !data.title ||
      !data.targetDana ||
@@ -79,6 +97,22 @@ export default function InvestmentCreate() {
        type: "error",
        text1: "Harap isi semua data",
      });
+      return false;
+    }
+
+    return true;
+  };
+
+  const handleSubmit = async () => {
+    if (!validateData()) {
+      return;
+    }
+
+    if (!image || !pdf) {
+      Toast.show({
+        type: "error",
+        text1: "Harap upload gambar dan file PDF",
+      });
      return;
    }

@@ -258,47 +292,72 @@ export default function InvestmentCreate() {
          }
        />

-        <SelectCustom
-          required
-          placeholder="Pilih batas waktu"
-          label="Pencarian Investor"
-          data={dummyListPencarianInvestor.map((item) => ({
-            label: item.name + `${" "}hari`,
-            value: item.id,
-          }))}
-          onChange={(value) =>
-            setData({ ...data, pencarianInvestor: value as any })
-          }
-          value={data.pencarianInvestor}
-        />
+        {loadingMaster ? (
+          <LoaderCustom />
+        ) : (
+          <SelectCustom
+            required
+            placeholder="Pilih batas waktu"
+            label="Pencarian Investor"
+            data={
+              _.isEmpty(listPencarianInvestor)
+                ? []
+                : listPencarianInvestor.map((item) => ({
+                    label: item.name + `${" "}hari`,
+                    value: item.id,
+                  }))
+            }
+            onChange={(value) =>
+              setData({ ...data, pencarianInvestor: value as any })
+            }
+            value={data.pencarianInvestor}
+          />
+        )}

-        <SelectCustom
-          required
-          placeholder="Pilih batas waktu"
-          label="Pilih Periode Deviden"
-          data={dummyPeriodeDeviden.map((item) => ({
-            label: item.name,
-            value: item.id,
-          }))}
-          onChange={(value) =>
-            setData({ ...data, periodeDeviden: value as any })
-          }
-          value={data.periodeDeviden}
-        />
+        {loadingMaster ? (
+          <LoaderCustom />
+        ) : (
+          <SelectCustom
+            required
+            placeholder="Pilih batas waktu"
+            label="Pilih Periode Deviden"
+            data={
+              _.isEmpty(listPeriodeDeviden)
+                ? []
+                : listPeriodeDeviden.map((item) => ({
+                    label: item.name,
+                    value: item.id,
+                  }))
+            }
+            onChange={(value) =>
+              setData({ ...data, periodeDeviden: value as any })
+            }
+            value={data.periodeDeviden}
+          />
+        )}
+
+        {loadingMaster ? (
+          <LoaderCustom />
+        ) : (
+          <SelectCustom
+            required
+            placeholder="Pilih batas waktu"
+            label="Pilih Pembagian Deviden"
+            data={
+              _.isEmpty(listPembagianDeviden)
+                ? []
+                : listPembagianDeviden.map((item) => ({
+                    label: item.name + `${" "}bulan`,
+                    value: item.id,
+                  }))
+            }
+            onChange={(value) =>
+              setData({ ...data, pembagianDeviden: value as any })
+            }
+            value={data.pembagianDeviden}
+          />
+        )}

-        <SelectCustom
-          required
-          placeholder="Pilih batas waktu"
-          label="Pilih Pembagian Deviden"
-          data={dummyPembagianDeviden.map((item) => ({
-            label: item.name + `${" "}bulan`,
-            value: item.id,
-          }))}
-          onChange={(value) =>
-            setData({ ...data, pembagianDeviden: value as any })
-          }
-          value={data.pembagianDeviden}
-        />
        <Spacing />
        <ButtonCustom isLoading={isLoading} onPress={() => handleSubmit()}>
          Simpan