PPOB/ppob-frontend
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: rewrite modal logic product

Browse Source
This commit is contained in:
caturbgs
2021-12-10 12:05:49 +07:00
parent 4d1cd215a1
commit 6da88a97a8
3 changed files with 125 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
src/pages/Product/PulsaModal.js
View File

@@ -1,108 +0,0 @@
import React, {useEffect, useState} from "react";
import {Form, Input, Modal, Select} from "antd";
import {useStore} from "../../utils/useStore";
import {observer} from "mobx-react-lite";
export const PulsaModal = observer(({visible, onCreate, onCancel, initialData, confirmLoading}) => {
const [form] = Form.useForm();
const {Option} = Select;
const store = useStore();
const [isLoading, setIsLoading] = useState(false);
useEffect(() => {
const init = async () => {
try {
setIsLoading(true);
await store.product.getDataSubCategories();
setIsLoading(false);
} catch (e) {
setIsLoading(false);
}
};
init();
}, []);
return (
<Modal
visible={visible}
title={initialData.id ? "Edit Product" : "Create a new Product"}
okText={initialData.id ? "Edit" : "Create"}
cancelText="Cancel"
onCancel={() => {
form.resetFields();
onCancel();
}}
onOk={() => {
form
.validateFields()
.then((values) => {
onCreate(values);
form.resetFields();
})
.catch((info) => {
console.error("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="base_price"
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="sub_category"
label="Sub categories"
rules={[{required: true, message: "Please select sub categories!"}]}
>
<Select placeholder="Select Sub Category" allowClear>
{store.product.dataSubCategories.map((item) => (
<Option value={item.id} key={item.id}>
{item.name}
</Option>
))}
</Select>
</Form.Item>
</Form>
</Modal>
);
});