feat: adjust supplier page

src/component/SupplierComponent.js

@@ -1,25 +1,17 @@
-import React, { useEffect, useState } from "react";
-import { Button, Form, Input, message, Modal, Space, Table, Tag } from "antd";
-import { observer } from "mobx-react-lite";
-import { ExclamationCircleOutlined } from "@ant-design/icons";
-import { useHistory } from "react-router-dom";
-import { useStore } from "../utils/useStore";
-import { LINKS } from "../routes/app";
-import { TopupsaldoModal } from "./TopupsaldoModal";
+import React, {useState} from "react";
+import {Button, Form, Input, message, Modal, Space, Table, Tag} from "antd";
+import {observer} from "mobx-react-lite";
+import {ExclamationCircleOutlined} from "@ant-design/icons";
+import {useHistory} from "react-router-dom";
+import {useStore} from "../utils/useStore";
+import {LINKS} from "../routes/app";
+import {TopupsaldoModal} from "./TopupsaldoModal";
 
 export const SupplierComponent = observer((props) => {
   const store = useStore();
   const [form] = Form.useForm();
   const history = useHistory();
   const [idData, setIdData] = useState("");
-  const [code, setCode] = useState("");
-
-  useEffect(() => {
-    const init = async () => {
-      await store.supplier.getData();
-    };
-    init();
-  }, []);
 
   const handleEditButton = (data) => {
     console.log(data, "isi data");
@@ -38,8 +30,9 @@ export const SupplierComponent = observer((props) => {
       code: data.code,
     });
     store.supplier.visibleModalTransaction = true;
-    setCode(data.code);
+    store.supplier.code = data.code;
   };
+
   const changeStatus = async (id, isActive) => {
     const status = isActive ? "inactive" : "active";
     const status2 = isActive ? "Inactivating" : "Activating";
@@ -66,7 +59,6 @@ export const SupplierComponent = observer((props) => {
       dataIndex: "code",
       key: "code",
     },
-    ,
     {
       title: "Saldo",
       dataIndex: ["coa","amount"],
@@ -216,20 +208,18 @@ export const SupplierComponent = observer((props) => {
           >
             <Input />
           </Form.Item>
-          {idData ? (
-            ""
-          ) : (
+          {!idData &&
               <Form.Item
                   name="code"
                   label="Kode"
-              rules={[{ required: true, message: "Please input kode!" }]}
+                  rules={[{required: true, message: "Please input kode!"}]}
               >
-              <Input />
+                <Input/>
               </Form.Item>
-          )}
+          }
         </Form>
       </Modal>
-      <TopupsaldoModal code={code} />
+      <TopupsaldoModal code={store.supplier.code}/>
     </div>
   );
 });

src/component/TopupsaldoModal.js

@@ -1,7 +1,7 @@
 import React from "react";
-import { Form, Input, message, Modal } from "antd";
-import { observer } from "mobx-react-lite";
-import { useStore } from "../utils/useStore";
+import {Form, Input, message, Modal} from "antd";
+import {observer} from "mobx-react-lite";
+import {useStore} from "../utils/useStore";
 
 export const TopupsaldoModal = observer((props) => {
   const store = useStore();
@@ -10,6 +10,7 @@ export const TopupsaldoModal = observer((props) => {
   const handleCancelTransaction = () => {
     store.supplier.visibleModalTransaction = false;
   };
+
   const handleSubmitTransaction = async (data) => {
     console.log(data, "isi data2");
 
@@ -51,12 +52,12 @@ export const TopupsaldoModal = observer((props) => {
         <Form
             form={form}
             layout="vertical"
-          initialValues={{ supplier: props.code }}
+            initialValues={{supplier: store.supplier.code}}
         >
           <Form.Item
               name="supplier"
               label="Supplier"
-            rules={[{ required: true, message: "Please input supplier!" }]}
+              rules={[{required: true, message: "Please input supplier!"}]}
           >
             <Input disabled={true} />
           </Form.Item>

src/store/supplier.js

@@ -8,7 +8,8 @@ export class Supplier {
     total_data = 0;
     filterCategory = null;
     visibleModalSupplier = false;
-    visibleModalTransaction=false;
+    visibleModalTransaction = false;
+    code = "";
 
     pageCategories = 0;
     pageSizeCategories = 10