Merge branch 'main' of https://gitlab.com/empatnusabangsa/ppob/ppob-frontend into devops-production

Main

See merge request empatnusabangsa/ppob/ppob-frontend!198

src/component/ProductComponent.js

@@ -174,7 +174,6 @@ export const ProductComponent = observer((props) => {
       message.error("Gagal menghapus");
     }
   };
-
   const handleDelete = (id) => {
     Modal.confirm({
       title: "Are you sure delete this record?",

src/pages/Membership/Konfirmasi.js

@@ -375,7 +375,7 @@ export const Konfirmasi = observer(() => {
                                     : "Aktif"}
                                 </Tag>
                               )}
-                              <Button
+                              {item.user_detail?.image_identity !== "" ? <Button
                                 style={
                                   item.is_active === true
                                     ? {
@@ -389,7 +389,8 @@ export const Konfirmasi = observer(() => {
                                 }}
                               >
                                 Foto Identitas
-                              </Button>
+                              </Button>: ""}
+                              
                               {item.user_detail?.image_store !== '""' ? (
                                 <Button
                                   style={

src/pages/Product/PulsaModal.js

@@ -0,0 +1,213 @@
+// import React,{useEffect,useState} from "react";
+// import { Form, Input, Modal, Select } from "antd";
+
+// export const PulsaModal =  ({ visible, onCreate, onCancel, initialData }) => {
+//   const [form] = Form.useForm();
+//   const { Option } = Select;
+// const [visibleModal, setVisibleModal] = useState(false)
+//   const [initialData, setInitialData] = useState({})
+//   const [confirmLoading, setConfirmLoading] = useState(false);
+//   const [isLoading, setIsLoading] = useState(false);
+//   useEffect(() => {
+//     const init = async () => {
+//       try {
+//         setIsLoading(true);
+//         await store.categories.getData();
+//         setIsLoading(false);
+//       } catch (e) {
+//         setIsLoading(false);
+//       }
+//     };
+
+//     init();
+//   }, []);
+
+//   return (
+//     <Modal
+//     visible={visibleModal}
+//                          confirmLoading={confirmLoading}
+//                          initialData={initialData}
+//                          onCreate={async (data) => {
+//                            onSubmit(data)
+//                          }}
+//                          onCancel={() => {
+//                            setInitialData({})
+//                            setVisibleModal(false);
+//                          }}
+//       visible={visible}
+//       title={initialData.id ? "Edit Member" : "Create a new Member"}
+//       okText={initialData.id ? "Edit" : "Create"}
+//       cancelText="Cancel"
+//       onCancel={() => {
+//         form.resetFields();
+//         onCancel();
+//       }}
+//       onOk={() => {
+//         form
+//           .validateFields()
+//           .then((values) => {
+//             onCreate(values);
+//             form.resetFields();
+//           })
+//           .catch((info) => {
+//             console.log("Validate Failed:", info);
+//           });
+//       }}
+//     >
+//       <Form
+//         form={form}
+//         layout="vertical"
+//         name="form_in_modal"
+//         initialValues={initialData}
+//       >
+//         <Form.Item
+//           name="name"
+//           label="Name"
+//           rules={[{ required: true, message: "Please input name!" }]}
+//         >
+//           <Input />
+//         </Form.Item>
+//         <Form.Item
+//           name="price"
+//           label="Price"
+//           rules={[{ required: true, message: "Please input price!" }]}
+//         >
+//           <Input />
+//         </Form.Item>
+//         <Form.Item
+//           name="markUpPrice"
+//           label="Mark Up Price"
+//           rules={[{ required: true, message: "Please input mark up price!" }]}
+//         >
+//           <Input />
+//         </Form.Item>
+//         <Form.Item
+//           name="code"
+//           label="Code"
+//           rules={[{ required: true, message: "Please input code!" }]}
+//         >
+//           <Input />
+//         </Form.Item>
+//         <Form.Item
+//           name="status"
+//           label="Status"
+//           rules={[{ required: true, message: "Please select Status!" }]}
+//         >
+//           <Select placeholder="Select Status" allowClear>
+//           {store.categories.map(it => {
+//                             return <Option value={it.id}>{it.name}</Option>
+//                         })}
+//           </Select>
+//         </Form.Item>
+//       </Form>
+//     </Modal>
+//   );
+// };
+import React, { useState, useEffect } from "react";
+import { Form, Input, Modal, Select } from "antd";
+import { useStore } from "../../utils/useStore";
+
+export const PulsaModal = ({ visible, onCreate, onCancel }) => {
+  const [form] = Form.useForm();
+  const { Option } = Select;
+  const dataStatus = ["Active", "Inactive"];
+  const store = useStore();
+  const [visibleModal, setVisibleModal] = useState(false);
+  const [initialData, setInitialData] = useState({});
+  const [confirmLoading, setConfirmLoading] = useState(false);
+  const [isLoading, setIsLoading] = useState(false);
+  const init = async () => {
+    try {
+      setIsLoading(true);
+      await store.categories.getData();
+      setIsLoading(false);
+    } catch (e) {
+      setIsLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    init();
+  }, []);
+
+  return (
+    <Modal
+      visible={visible}
+      title={initialData.id ? "Edit Member" : "Create a new Member"}
+      okText={initialData.id ? "Edit" : "Create"}
+      cancelText="Cancel"
+      onCancel={() => {
+        form.resetFields();
+        onCancel();
+      }}
+      onOk={() => {
+        form
+          .validateFields()
+          .then((values) => {
+            onCreate(values);
+            form.resetFields();
+          })
+          .catch((info) => {
+            console.log("Validate Failed:", info);
+          });
+      }}
+    >
+      <Form
+        form={form}
+        layout="vertical"
+        name="form_in_modal"
+        initialValues={initialData}
+      >
+        <Form.Item
+          name="name"
+          label="Name"
+          rules={[{ required: true, message: "Please input name!" }]}
+        >
+          <Input />
+        </Form.Item>
+        <Form.Item
+          name="price"
+          label="Price"
+          rules={[{ required: true, message: "Please input price!" }]}
+        >
+          <Input />
+        </Form.Item>
+        <Form.Item
+          name="markUpPrice"
+          label="Mark Up Price"
+          rules={[{ required: true, message: "Please input mark up price!" }]}
+        >
+          <Input />
+        </Form.Item>
+        <Form.Item
+          name="code"
+          label="Code"
+          rules={[{ required: true, message: "Please input code!" }]}
+        >
+          <Input />
+        </Form.Item>
+        <Form.Item
+          name="status"
+          label="Status"
+          rules={[{ required: true, message: "Please select Status!" }]}
+        >
+          <Select placeholder="Select Sub Category" allowClear>
+            <Option value="ACTIVE">ACTIVE</Option>
+            <Option value="INACTIVE">INACTIVE</Option>
+          </Select>
+        </Form.Item>
+        <Form.Item
+          name="subCategoriesId"
+          label="Sub Categories"
+          rules={[{ required: true, message: "Please select Sub Category!" }]}
+        >
+          <Select placeholder="Select Sub Category" allowClear>
+            {store.categories.data.map((it) => {
+              return <Option value={it.id}>{it.name}</Option>;
+            })}
+          </Select>
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+};

src/pages/Transaction/Pulsa.js

@@ -0,0 +1,121 @@
+import React from "react";
+import {Button, Card, Col, Dropdown, Menu, message, Modal, Row, Space,} from "antd";
+import {DownOutlined, TabletOutlined, UserOutlined} from "@ant-design/icons";
+
+export const Pulsa = () => {
+
+    function handleMenuClick(e) {
+        message.info("Click on menu item.");
+        console.log("click", e);
+    }
+
+    const menu = (
+        <Menu onClick={handleMenuClick}>
+            <Menu.Item key="1" icon={<UserOutlined/>}>
+                1st menu item
+            </Menu.Item>
+            <Menu.Item key="2" icon={<UserOutlined/>}>
+                2nd menu item
+            </Menu.Item>
+            <Menu.Item key="3" icon={<UserOutlined/>}>
+                3rd menu item
+            </Menu.Item>
+        </Menu>
+    );
+
+    function success() {
+        Modal.success({
+            content: 'some messages...some messages...',
+        });
+    }
+
+    const dataCard = [
+        {
+            title: "DATA AXIS BRONET 2GB-60HR",
+            price: "Harga : Rp.6.000",
+        },
+        {
+            title: "DATA AXIS BRONET 2GB-60HR",
+            price: "Harga : Rp.6.000",
+        },
+        {
+            title: "DATA AXIS BRONET 2GB-60HR",
+            price: "Harga : Rp.6.000",
+        },
+        {
+            title: "DATA AXIS BRONET 2GB-60HR",
+            price: "Harga : Rp.6.000",
+        },
+        {
+            title: "DATA AXIS BRONET 2GB-60HR",
+            price: "Harga : Rp.6.000",
+        },
+        {
+            title: "DATA AXIS BRONET 2GB-60HR",
+            price: "Harga : Rp.6.000",
+        },
+        {
+            title: "DATA AXIS BRONET 2GB-60HR",
+            price: "Harga : Rp.6.000",
+        },
+        {
+            title: "DATA AXIS BRONET 2GB-60HR",
+            price: "Harga : Rp.6.000",
+        },
+        {
+            title: "DATA AXIS BRONET 2GB-60HR",
+            price: "Harga : Rp.6.000",
+        },
+        {
+            title: "DATA AXIS BRONET 2GB-60HR",
+            price: "Harga : Rp.6.000",
+        },
+    ]
+
+    return (
+        <div>
+            <Row>
+        <span style={{fontWeight: "bold", marginBottom: "10px"}}>
+          Sub-Category
+        </span>
+            </Row>
+            <Row>
+                <Space wrap>
+                    <Dropdown overlay={menu}>
+                        <Button
+                            style={{
+                                marginBottom: "20px",
+                                color: "grey",
+                            }}
+                        >
+                            <TabletOutlined/>
+                            Select sub-Category
+                            <DownOutlined/>
+                        </Button>
+                    </Dropdown>
+                </Space>
+            </Row>
+            <Row>
+        <span style={{fontWeight: "bold", marginBottom: "10px"}}>
+          Produk & Nominal
+        </span>
+            </Row>
+            <Row>
+                {dataCard.map((item, index) => (
+                    <Col key={index} xs={24} md={16} lg={8}>
+                        <Card onClick={success}>
+                            <span style={{color: "black"}}>{item.title}</span>
+                            <br/>
+                            <span style={{color: "grey", fontSize: 10}}>{item.price}</span>
+                        </Card>
+                    </Col>
+                ))}
+            </Row>
+            <Col style={{textAlign: "right"}}>
+                <Button style={{backgroundColor: "#2D9CDB", color: "white"}}>
+                    Beli Sekarang
+                </Button>
+            </Col>
+        </div>
+  );
+};

src/store/authentication.js

@@ -2,7 +2,6 @@ import {makeAutoObservable, runInAction} from "mobx";
 import {TokenUtil} from "../utils/token";
 import {http} from "../utils/http";
 
-
 export class Authentication {
   isLoggedIn = false;
   isLoginLoading = false;

src/store/categories.js

@@ -0,0 +1,40 @@
+import {action, makeAutoObservable} from "mobx";
+import {http} from "../utils/http";
+
+export class Categories {
+    page = 0;
+    pageSize = 10
+    data = [];
+    total_data = 0
+
+    constructor(ctx) {
+        this.ctx = ctx;
+        makeAutoObservable(this);
+    }
+
+    @action
+    async getData() {
+        const response = await http.get(`/product/sub-categories?page=${this.page}&pageSize=${this.pageSize}`);
+        console.log(response,'Data cate')
+        console.log(JSON.stringify(response.body.data),'Data')
+        
+        this.data = response.body.data ?? []
+        this.total_data = response.body.total_data ?? 0
+    }
+
+    @action
+    async create(data) {
+        return await http.post('/user').send(data)
+    }
+
+    @action
+    async update(id, data) {
+        return await http.put('/user/' + id).send(data);
+    }
+
+    async delete(id) {
+        return await http.del('/product/' + id);
+    }
+}
+
+