From 412ecc827eacb22d7fbaa0399f59613d85384685 Mon Sep 17 00:00:00 2001 From: caturbgs Date: Fri, 10 Dec 2021 13:52:49 +0700 Subject: [PATCH 1/3] feat: crud product --- src/component/ProductComponent.js | 37 ++++++++++++++++++------------- src/pages/Product/Product.js | 2 +- src/store/product.js | 8 +++---- 3 files changed, 26 insertions(+), 21 deletions(-) diff --git a/src/component/ProductComponent.js b/src/component/ProductComponent.js index d5acd23..a4ded5b 100644 --- a/src/component/ProductComponent.js +++ b/src/component/ProductComponent.js @@ -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) => ( {capitalize(record?.status)} @@ -84,10 +83,10 @@ export const ProductComponent = observer((props) => { key: "tersedia", render: (text, record) => ( - {record?.status === "AKTIF" ? " Ya" : "Tidak"} + {record?.status === "ACTIVE" ? " Ya" : "Tidak"} ), }, @@ -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 /> { form .validateFields() .then((values) => { + console.log(values, "isi form") handleSubmit(values); form.resetFields(); }) @@ -215,7 +220,7 @@ export const ProductComponent = observer((props) => { @@ -239,7 +244,7 @@ export const ProductComponent = observer((props) => { diff --git a/src/pages/Product/Product.js b/src/pages/Product/Product.js index 4ba587d..594374b 100644 --- a/src/pages/Product/Product.js +++ b/src/pages/Product/Product.js @@ -60,7 +60,7 @@ export const Product = observer(() => { placeholder="input search text" style={{width: 200, marginRight: 10}} /> - diff --git a/src/store/product.js b/src/store/product.js index aebf01e..c8f6e38 100644 --- a/src/store/product.js +++ b/src/store/product.js @@ -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; } From d3ecd09d6f0786fadc90023425f1971b00f8f64c Mon Sep 17 00:00:00 2001 From: caturbgs Date: Fri, 10 Dec 2021 13:58:50 +0700 Subject: [PATCH 2/3] fix: merge conflicts --- src/component/ProductComponent.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/component/ProductComponent.js b/src/component/ProductComponent.js index a4ded5b..a61d8ca 100644 --- a/src/component/ProductComponent.js +++ b/src/component/ProductComponent.js @@ -56,8 +56,8 @@ export const ProductComponent = observer((props) => { }, { title: "Harga Beli", - dataIndex: "basePrice", - key: "basePrice", + dataIndex: "price", + key: "price", }, { title: "Harga Jual", From 6a364fe8b4ce12abc4335fe3ce75a76a4d71c9eb Mon Sep 17 00:00:00 2001 From: caturbgs Date: Fri, 10 Dec 2021 14:33:55 +0700 Subject: [PATCH 3/3] feat: add roles in Membership --- src/pages/App/MenuList.js | 26 ++++----- src/pages/Membership/Membership.js | 74 +++++++++++-------------- src/pages/Membership/MembershipModal.js | 13 ++++- src/store/index.js | 2 + src/store/membership.js | 2 - src/store/role.js | 34 ++++++++++++ 6 files changed, 91 insertions(+), 60 deletions(-) create mode 100644 src/store/role.js diff --git a/src/pages/App/MenuList.js b/src/pages/App/MenuList.js index 1e81b44..8068ac5 100644 --- a/src/pages/App/MenuList.js +++ b/src/pages/App/MenuList.js @@ -1,7 +1,7 @@ import React, {useEffect, useState} from "react"; import {Menu} from "antd"; import {Link} from "react-router-dom"; -import {CalendarOutlined, HomeOutlined,} from "@ant-design/icons"; +import {HomeOutlined,} from "@ant-design/icons"; import {observer} from "mobx-react-lite"; import {useStore} from "../../utils/useStore"; @@ -39,30 +39,30 @@ export const MenuList = observer((props) => { Home - + {store.authentication.userData.role !== 'Retail' && Membership - - + } + {store.authentication.userData.role !== 'Retail' && Product - - + } + {store.authentication.userData.role === 'Retail' && Transaction - - - - - About - - + } + {/**/} + {/* */} + {/* */} + {/* About*/} + {/* */} + {/**/} ); diff --git a/src/pages/Membership/Membership.js b/src/pages/Membership/Membership.js index 0f599a5..df36bd5 100644 --- a/src/pages/Membership/Membership.js +++ b/src/pages/Membership/Membership.js @@ -1,30 +1,12 @@ -import React, { useEffect, useState } from "react"; -import { - Button, - Card, - Col, - Divider, - Input, - List, - message, - Modal, - Row, - Space, - Table, - Tag, -} from "antd"; -import { useStore } from "../../utils/useStore"; -import { observer } from "mobx-react-lite"; -import { - ExclamationCircleOutlined, - FilterOutlined, - PlusSquareOutlined, -} from "@ant-design/icons"; -import { MembershipModal } from "./MembershipModal"; -import { BreadcumbComponent } from "../../component/BreadcumbComponent"; -import { format } from "date-fns"; +import React, {useEffect, useState} from "react"; +import {Button, Card, Col, Divider, Input, List, message, Modal, Row, Space, Table, Tag,} from "antd"; +import {useStore} from "../../utils/useStore"; +import {observer} from "mobx-react-lite"; +import {ExclamationCircleOutlined, FilterOutlined, PlusSquareOutlined,} from "@ant-design/icons"; +import {MembershipModal} from "./MembershipModal"; +import {BreadcumbComponent} from "../../component/BreadcumbComponent"; -const { Search } = Input; +const {Search} = Input; export const Membership = observer(() => { const store = useStore(); @@ -33,16 +15,18 @@ export const Membership = observer(() => { const [confirmLoading, setConfirmLoading] = useState(false); const [isLoading, setIsLoading] = useState(false); - const init = async () => { - try { - setIsLoading(true); - await store.membership.getData(); - setIsLoading(false); - } catch (e) { - setIsLoading(false); - } - }; useEffect(() => { + const init = async () => { + try { + setIsLoading(true); + await store.membership.getData(); + await store.role.getData(); + setIsLoading(false); + } catch (e) { + setIsLoading(false); + } + }; + init(); }, []); @@ -78,7 +62,10 @@ export const Membership = observer(() => { - + - diff --git a/src/pages/Membership/MembershipModal.js b/src/pages/Membership/MembershipModal.js index b404639..84ff209 100644 --- a/src/pages/Membership/MembershipModal.js +++ b/src/pages/Membership/MembershipModal.js @@ -1,5 +1,7 @@ import React from 'react'; import {Form, Input, Modal, Select,} from 'antd'; +import {capitalize} from "lodash"; +import {useStore} from "../../utils/useStore"; export const MembershipModal = ({ visible, @@ -10,6 +12,7 @@ export const MembershipModal = ({ const [form] = Form.useForm(); const {Option} = Select; const dataStatus = ["true", "false"] + const store = useStore(); return ( @@ -57,10 +60,14 @@ export const MembershipModal = ({ - + {dataStatus.map(it => { - return + return })} diff --git a/src/store/index.js b/src/store/index.js index a5a0d80..8a935c9 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -4,6 +4,7 @@ import {User} from "./user"; import {Membership} from "./membership"; import {Product} from "./product"; import {TokenUtil} from "../utils/token"; +import {Role} from "./role"; export class Store { ui = new UI(this); @@ -11,6 +12,7 @@ export class Store { user = new User(this); membership = new Membership(this); product = new Product(this); + role = new Role(this); constructor() { TokenUtil.loadToken(); diff --git a/src/store/membership.js b/src/store/membership.js index 786313f..9dad452 100644 --- a/src/store/membership.js +++ b/src/store/membership.js @@ -15,8 +15,6 @@ export class Membership { @action async getData() { const response = await http.get(`/users/find-by-supperior?page=${this.page}&pageSize=${this.pageSize}`); - // console.log(response, 'Data user') - // console.log(JSON.stringify(response.body.data), 'Data') this.data = response.body.data ?? [] this.total_data = response.body.total_data ?? 0 } diff --git a/src/store/role.js b/src/store/role.js new file mode 100644 index 0000000..4352187 --- /dev/null +++ b/src/store/role.js @@ -0,0 +1,34 @@ +import {makeAutoObservable} from "mobx"; +import {http} from "../utils/http"; + +export class Role { + page = null; + pageSize = null; + data = []; + total_data = 0 + + constructor(ctx) { + this.ctx = ctx; + makeAutoObservable(this); + } + + async getData() { + const response = await http.get(`/config/roles?page=${this.page}&pageSize=${this.pageSize}`); + this.data = response.body.data ?? [] + this.total_data = response.body.total_data ?? 0 + } + + async create(data) { + return await http.post('/users').send(data) + } + + async update(id, data) { + return await http.put('/users/' + id).send(data); + } + + async delete(id) { + return await http.del('/users/' + id); + } +} + +