feat: handler modal payback after create and fix payback paging

src/pages/Payback/Payback.js

@@ -158,21 +158,21 @@ export const Payback = observer(() => {
                   columns={columns}
                   dataSource={store.payback.data}
                   bordered
-                  pagination={{
+                  // pagination={{
-                    pageSize: store.payback.page,
+                  //   pageSize: store.payback.page,
-                    total: store.payback.total_data,
+                  //   total: store.payback.total_data,
-                    current: store.payback.pageSize + 1,
+                  //   current: store.payback.pageSize + 1,
-                    showSizeChanger: true,
+                  //   showSizeChanger: true,
-                    simple: false
+                  //   simple: false
-                  }}
+                  // }}
-                  onChange={async (page) => {
+                  // onChange={async (page) => {
-                    let pageNumber = page.current;
+                  //   let pageNumber = page.current;
-                    store.payback.pageSize = page.pageSize;
+                  //   store.payback.pageSize = page.pageSize;
-                    store.payback.page = pageNumber - 1;
+                  //   store.payback.page = pageNumber - 1;
-                    modalLoader.setLoading(true);
+                  //   modalLoader.setLoading(true);
-                    await store.payback.getData();
+                  //   await store.payback.getData();
-                    modalLoader.setLoading(false);
+                  //   modalLoader.setLoading(false);
-                  }}
+                  // }}
               />
           )}
 
@@ -180,19 +180,19 @@ export const Payback = observer(() => {
               <List
                   itemLayout="horizontal"
                   position={"top"}
-                  pagination={{
+                  // pagination={{
-                    onChange: async (page) => {
+                  //   onChange: async (page) => {
-                      store.payback.pageSize = page.pageSize;
+                  //     store.payback.pageSize = page.pageSize;
-                      store.payback.page = page.current;
+                  //     store.payback.page = page.current;
-                      modalLoader.setLoading(true);
+                  //     modalLoader.setLoading(true);
-                      await store.payback.getData();
+                  //     await store.payback.getData();
-                      modalLoader.setLoading(false);
+                  //     modalLoader.setLoading(false);
-                    },
+                  //   },
-                    pageSize: store.payback.pageSize,
+                  //   pageSize: store.payback.pageSize,
-                    total: store.payback.total_data,
+                  //   total: store.payback.total_data,
-                    current: store.payback.page,
+                  //   current: store.payback.page,
-                    style: {marginBottom: "1rem", marginRight: "1rem"},
+                  //   style: {marginBottom: "1rem", marginRight: "1rem"},
-                  }}
+                  // }}
                   dataSource={store.payback.data}
                   style={{padding: 0}}
                   renderItem={(item) => {

src/pages/Payback/PaybackFromUser.js

@@ -12,7 +12,6 @@ const {Search} = Input;
 
 export const PaybackFromUser = observer(() => {
   const store = useStore();
-  const [visibleModal, setVisibleModal] = useState(false);
   const [initialData, setInitialData] = useState({});
   const modalLoader = useContext(ModalLoaderContext);
 
@@ -71,23 +70,6 @@ export const PaybackFromUser = observer(() => {
     },
   ];
 
-  const onSubmit = async (data) => {
-    modalLoader.setLoading(true);
-    try {
-      // await store.membership.create(data);
-      // message.success("Success Add New Member");
-      // await store.membership.getData();
-    } catch (e) {
-      console.error(e, "apa errornya");
-      message.error("Failed Add Member");
-    }
-    modalLoader.setLoading(false);
-    setVisibleModal(false);
-  };
-
-  const handleAction = async (record, type) => {
-  };
-
   return (
     <div className={["ppob-container"].join(" ")}>
       <BreadcumbComponent data={routeData}/>
@@ -113,7 +95,7 @@ export const PaybackFromUser = observer(() => {
                 <Button
                   onClick={() => {
                     setInitialData({});
-                    setVisibleModal(true);
+                    store.payback.visibleModalPayback = true;
                   }}
                 >
                   <PlusSquareOutlined/> New
@@ -210,15 +192,7 @@ export const PaybackFromUser = observer(() => {
       </Card>
 
       <PaybackModal
-        visible={visibleModal}
         initialData={initialData}
-        onCreate={async (data) => {
-          await onSubmit(data);
-        }}
-        onCancel={() => {
-          setInitialData({});
-          setVisibleModal(false);
-        }}
       />
     </div>
   );

src/pages/Payback/PaybackModal.js

@@ -6,7 +6,7 @@ import {ModalLoaderContext} from "../../utils/modal";
 import {http} from "../../utils/http";
 import {appConfig} from "../../config/app";
 
-export const PaybackModal = ({visible, onCreate, onCancel, initialData}) => {
+export const PaybackModal = ({initialData}) => {
   const [form] = Form.useForm();
   const store = useStore();
   const [image, setImage] = useState("");
@@ -58,40 +58,51 @@ export const PaybackModal = ({visible, onCreate, onCancel, initialData}) => {
   );
 
   const handleSubmit = async (data) => {
-    console.log(data, "isi data2");
+    modalLoader.setLoading(true);
     try {
-      modalLoader.setLoading(true);
+      const request = {
-      await store.payback.create(data);
+        ...data,
-      modalLoader.setLoading(false);
+        destination: store.authentication.profileData.superior?.id
+      }
+      await store.payback.create(request);
       message.success("Success Add Payback");
-      await store.payback.getData();
     } catch (e) {
-      modalLoader.setLoading(false);
       if (e.response?.body?.message) {
         message.error(e.response.body.message);
         return;
       }
       message.error(e.message);
     }
+    modalLoader.setLoading(false);
     form.resetFields();
+    store.payback.visibleModalPayback = false;
+    setImage("");
+    setFileList([]);
+    setPreviewImage("");
+    setPreviewVisible(false);
   };
 
+  const handleCancel = () => {
+    form.resetFields();
+    store.payback.visibleModalPayback = false;
+    setImage("");
+    setFileList([]);
+    setPreviewImage("");
+    setPreviewVisible(false);
+  }
+
   return (
       <Modal
-          visible={visible}
+          visible={store.payback.visibleModalPayback}
           title={"Create a new Payback"}
           okText={"Create"}
           cancelText="Cancel"
-          onCancel={() => {
+          onCancel={handleCancel}
-            form.resetFields();
-            onCancel();
-          }}
           onOk={() => {
             form
                 .validateFields()
                 .then((values) => {
                   handleSubmit(values);
-                  console.log(values);
                   form.resetFields();
                 })
                 .catch((info) => {
@@ -105,14 +116,6 @@ export const PaybackModal = ({visible, onCreate, onCancel, initialData}) => {
             name="form_in_modal"
             initialValues={initialData}
         >
-          <Form.Item
-              name="destination"
-              label="destination"
-              rules={[{required: true, message: "Please input Name!"}]}
-              initialValue={store.authentication.profileData.superior?.id}
-          >
-            <Input/>
-          </Form.Item>
           <Form.Item
               label="Upload Picture"
               name="image_prove"

src/store/payback.js

@@ -73,9 +73,9 @@ export class Payback {
 
   async create(data) {
     try {
-    console.log(data)
+      const response = await http.post("/transaction/deposit-return").send(data);
-      return await http.post("/transaction/deposit-return").send(data);
+      await this.getData();
-      
+      return response;
     } catch (e) {
       console.error(e);
     }