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

feat: crud product

Browse Source
This commit is contained in:
caturbgs 2021-12-10 13:52:49 +07:00
parent 91ade48bea
commit 412ecc827e
3 changed files with 26 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
src/component/ProductComponent.js
View File

@ -14,7 +14,6 @@ export const ProductComponent = observer((props) => {
const [idData, setIdData] = useState('');
const [confirmLoading, setConfirmLoading] = useState(false);
const [isLoading, setIsLoading] = useState(false);
const [visibleModal, setVisibleModal] = useState(false);
useEffect(() => {
const init = async () => {
@ -35,11 +34,12 @@ export const ProductComponent = observer((props) => {
form.setFieldsValue({
name: data.name,
price: data.price,
base_price: data.base_price,
markUpPrice: data.basePrice,
code: data.code,
status: data.status,
subCategoriesId: data.sub_categories.id,
});
setVisibleModal(true);
store.product.visibleModalProduct = true;
setIdData(data.id);
}
@ -59,11 +59,10 @@ export const ProductComponent = observer((props) => {
dataIndex: "basePrice",
key: "basePrice",
},
,
{
title: "Harga Jual",
dataIndex: "price",
key: "price",
dataIndex: "basePrice",
key: "basePrice",
},
{
title: "Gangguan",
@ -71,7 +70,7 @@ export const ProductComponent = observer((props) => {
key: "status",
render: (text, record) => (
<Tag
color={record?.status === "AKTIF" ? "processing" : "#E3E8EE"}
color={record?.status === "ACTIVE" ? "processing" : "#E3E8EE"}
style={{color: "#4F566B"}}
>
{capitalize(record?.status)}
@ -84,10 +83,10 @@ export const ProductComponent = observer((props) => {
key: "tersedia",
render: (text, record) => (
<Tag
color={record?.status === "AKTIF" ? "processing" : "#E3E8EE"}
color={record?.status === "ACTIVE" ? "processing" : "#E3E8EE"}
style={{color: "#4F566B"}}
>
{record?.status === "AKTIF" ? " Ya" : "Tidak"}
{record?.status === "ACTIVE" ? " Ya" : "Tidak"}
</Tag>
),
},
@ -139,11 +138,12 @@ export const ProductComponent = observer((props) => {
const handleCancel = () => {
setIdData('')
setVisibleModal(false);
store.product.visibleModalProduct = false;
}
const handleSubmit = async (data) => {
if (idData != '') {
console.log(data, "isi data2")
if (idData !== '') {
setConfirmLoading(true);
try {
await store.product.update(idData, data)
@ -152,7 +152,9 @@ export const ProductComponent = observer((props) => {
message.error("Failed Update Data Member")
}
setConfirmLoading(false);
setVisibleModal(false);
store.product.visibleModalProduct = false;
setIdData('');
form.resetFields();
} else {
setConfirmLoading(true);
try {
@ -163,7 +165,9 @@ export const ProductComponent = observer((props) => {
message.error("Failed Add Member")
}
setConfirmLoading(false);
setVisibleModal(false);
store.product.visibleModalProduct = false;
setIdData('');
form.resetFields();
}
}
@ -176,7 +180,7 @@ export const ProductComponent = observer((props) => {
bordered
/>
<Modal
visible={visibleModal}
visible={store.product.visibleModalProduct}
title={idData ? "Edit Product" : "Create a new Product"}
okText={idData ? "Edit" : "Create"}
cancelText="Cancel"
@ -188,6 +192,7 @@ export const ProductComponent = observer((props) => {
form
.validateFields()
.then((values) => {
console.log(values, "isi form")
handleSubmit(values);
form.resetFields();
})
@ -215,7 +220,7 @@ export const ProductComponent = observer((props) => {
<Input/>
</Form.Item>
<Form.Item
name="base_price"
name="markUpPrice"
label="Mark Up Price"
rules={[{required: true, message: "Please input mark up price!"}]}
>
@ -239,7 +244,7 @@ export const ProductComponent = observer((props) => {
</Select>
</Form.Item>
<Form.Item
name="sub_category"
name="subCategoriesId"
label="Sub categories"
rules={[{required: true, message: "Please select sub categories!"}]}
>

2
src/pages/Product/Product.js
View File

@ -60,7 +60,7 @@ export const Product = observer(() => {
placeholder="input search text"
style={{width: 200, marginRight: 10}}
/>
<Button onClick={() => store.product.visibleModal = true}>
<Button onClick={() => store.product.visibleModalProduct = true}>
<PlusSquareOutlined/> New
</Button>
</Col>

8
src/store/product.js
View File

@ -1,4 +1,4 @@
import {action, makeAutoObservable} from "mobx";
import {makeAutoObservable} from "mobx";
import {http} from "../utils/http";
export class Product {
@ -7,6 +7,7 @@ export class Product {
data = [];
total_data = 0;
filterCategory = null;
visibleModalProduct = false;
pageCategories = 0;
pageSizeCategories = 10
@ -46,15 +47,14 @@ export class Product {
}
}
@action
async create(data) {
const response = await http.post('/product', data);
const response = await http.post('/product').send(data);
await this.getData();
return response;
}
async update(id, data) {
const response = await http.put(`/product/${id}`, data);
const response = await http.put(`/product/${id}`).send(data);
await this.getData();
return response;
}