From 7cf403f19d82fd3adfdefcee181b1a7477efc1e5 Mon Sep 17 00:00:00 2001 From: caturbgs Date: Wed, 22 Dec 2021 14:43:04 +0700 Subject: [PATCH 1/5] feat: handler modal dynamic --- src/component/ProductComponent.js | 96 +++++++++++++++++-------------- src/pages/Product/Product.js | 2 +- src/store/product.js | 4 +- 3 files changed, 55 insertions(+), 47 deletions(-) diff --git a/src/component/ProductComponent.js b/src/component/ProductComponent.js index 40a6a34..0f12656 100644 --- a/src/component/ProductComponent.js +++ b/src/component/ProductComponent.js @@ -15,9 +15,8 @@ export const ProductComponent = observer((props) => { const {Option} = Select; const history = useHistory(); const [idData, setIdData] = useState(""); - const [filterSupplier, setFilterSupplier] = useState(null); - const [filterCategories, setFilterCategories] = useState(null); - const [filterSubCategories, setFilterSubCategories] = useState(null); + const [filterSupplier, setFilterSupplier] = useState([]); + const [filterSubCategories, setFilterSubCategories] = useState([]); const modalLoader = useContext(ModalLoaderContext); const handleEditButton = (data) => { @@ -163,17 +162,17 @@ export const ProductComponent = observer((props) => { const handleRemoveFilter = async () => { store.product.filterSupplier = null; store.product.filterSubCategory = null; - setFilterSupplier(null); - setFilterCategories(null); - setFilterSubCategories(null); + setFilterSupplier([]); + store.product.filterCategory = null; + setFilterSubCategories([]); await store.product.getData(); store.product.visibleModalFilterProduct = false; }; const handleCancelFilter = () => { - setFilterSupplier(null); - setFilterCategories(null); - setFilterSubCategories(null); + setFilterSupplier([]); + store.product.filterCategory = null; + setFilterSubCategories([]); store.product.visibleModalFilterProduct = false; }; @@ -186,14 +185,24 @@ export const ProductComponent = observer((props) => { store.product.visibleModalFilterProduct = false; }; + const handleFilterCategory = async (value) => { + if (value) { + store.product.filterCategory = value; + await store.product.getDataSubCategories(); + } else { + store.product.filterCategory = null; + await store.product.getDataSubCategories(); + } + }; + const footerLayoutFilter = [ , @@ -403,17 +412,18 @@ export const ProductComponent = observer((props) => { Filter Supplier @@ -422,19 +432,16 @@ export const ProductComponent = observer((props) => { Filter Categories @@ -443,17 +450,18 @@ export const ProductComponent = observer((props) => { Filter Sub-Categories diff --git a/src/pages/Product/Product.js b/src/pages/Product/Product.js index 21539e1..95f4c34 100644 --- a/src/pages/Product/Product.js +++ b/src/pages/Product/Product.js @@ -21,7 +21,7 @@ export const Product = observer(() => { await Promise.allSettled([ store.supplier.getData(), store.category.getData(), - store.category.getDataSubCategories(), + store.product.getDataSubCategories(), ]); await store.product.getData(); modalLoader.setLoading(false); diff --git a/src/store/product.js b/src/store/product.js index e03b223..7c893de 100644 --- a/src/store/product.js +++ b/src/store/product.js @@ -21,7 +21,7 @@ export class Product { pageSizeSubCategories = 10 dataSubCategories = []; total_dataSubCategories = 0; - filterByCategory = null; + filterCategory = null; constructor(ctx) { this.ctx = ctx; @@ -44,7 +44,7 @@ export class Product { async getDataSubCategories() { try { - const response = await http.get(`/product/sub-categories?category=${this.filterByCategory}&page=${this.pageSubCategories}&pageSize=${this.pageSizeSubCategories}`); + const response = await http.get(`/product/sub-categories?category=${this.filterCategory}&page=${this.pageSubCategories}&pageSize=${this.pageSizeSubCategories}`); this.dataSubCategories = response.body.data.map((item, idx) => { item.key = idx; return item From 5039fa736a656da662732348f13a97d5702586a1 Mon Sep 17 00:00:00 2001 From: caturbgs Date: Wed, 22 Dec 2021 14:48:50 +0700 Subject: [PATCH 2/5] fix: column product --- src/component/ProductComponent.js | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/src/component/ProductComponent.js b/src/component/ProductComponent.js index 0f12656..96d0668 100644 --- a/src/component/ProductComponent.js +++ b/src/component/ProductComponent.js @@ -36,23 +36,23 @@ export const ProductComponent = observer((props) => { const columns = [ { title: "Kode", - dataIndex: "code", - key: "code", + dataIndex: "product_code", + key: "product_code", }, { title: "Produk", - dataIndex: ["name"], - key: "name", + dataIndex: "product_name", + key: "product_name", }, { title: "Harga Beli", - dataIndex: ["currentPrice", "price"], - key: ["currentPrice", "price"], + dataIndex: "current_price_price", + key: "current_price_price", }, { title: "Harga Jual", - dataIndex: ["currentPrice", "mark_up_price"], - key: ["currentPrice", "mark_up_price"], + dataIndex: "mark_up_price", + key: "mark_up_price", }, // { // title: "Gangguan", @@ -244,7 +244,7 @@ export const ProductComponent = observer((props) => { store.product.pageSize = page.pageSize; store.product.page = pageNumber - 1; modalLoader.setLoading(true); - //await store.product.getData(); + await store.product.getData(); modalLoader.setLoading(false); }} /> From 84ff8c12f8f6c5b90b575a7829f57061cbed3106 Mon Sep 17 00:00:00 2001 From: caturbgs Date: Wed, 22 Dec 2021 15:46:41 +0700 Subject: [PATCH 3/5] fix: roles api not fetch --- src/pages/Membership/Membership.js | 45 +++++++++--------------------- src/store/role.js | 4 +-- 2 files changed, 15 insertions(+), 34 deletions(-) diff --git a/src/pages/Membership/Membership.js b/src/pages/Membership/Membership.js index 9126636..88194bf 100644 --- a/src/pages/Membership/Membership.js +++ b/src/pages/Membership/Membership.js @@ -1,35 +1,16 @@ -import React, { useContext, useEffect, useState } from "react"; -import { - Button, - Card, - Col, - Divider, - Form, - Input, - List, - message, - Modal, - Row, - Select, - Space, - Table, - Tag, -} from "antd"; -import { useStore } from "../../utils/useStore"; -import { observer } from "mobx-react-lite"; -import { - DownloadOutlined, - ExclamationCircleOutlined, - PlusSquareOutlined, -} from "@ant-design/icons"; -import { MembershipModal } from "./MembershipModal"; -import { BreadcumbComponent } from "../../component/BreadcumbComponent"; -import { LINKS } from "../../routes/app"; -import { Link, useHistory } from "react-router-dom"; -import { ModalLoaderContext } from "../../utils/modal"; +import React, {useContext, useEffect, useState} from "react"; +import {Button, Card, Col, Divider, Form, Input, List, message, Modal, Row, Select, Space, Table, Tag,} from "antd"; +import {useStore} from "../../utils/useStore"; +import {observer} from "mobx-react-lite"; +import {DownloadOutlined, PlusSquareOutlined,} from "@ant-design/icons"; +import {MembershipModal} from "./MembershipModal"; +import {BreadcumbComponent} from "../../component/BreadcumbComponent"; +import {LINKS} from "../../routes/app"; +import {useHistory} from "react-router-dom"; +import {ModalLoaderContext} from "../../utils/modal"; -const { Search } = Input; -const { Option } = Select; +const {Search} = Input; +const {Option} = Select; export const Membership = observer(() => { const history = useHistory(); const [form] = Form.useForm(); @@ -357,7 +338,7 @@ export const Membership = observer(() => { store.membership.pageSize = page.pageSize; store.membership.page = pageNumber - 1; modalLoader.setLoading(true); - //await getData(); + await getData(); modalLoader.setLoading(false); }} /> diff --git a/src/store/role.js b/src/store/role.js index f5607f0..da6f11e 100644 --- a/src/store/role.js +++ b/src/store/role.js @@ -2,8 +2,8 @@ import {makeAutoObservable} from "mobx"; import {http} from "../utils/http"; export class Role { - page = null; - pageSize = null; + page = 0; + pageSize = 10; data = []; total_data = 0; From 73d23b8958b48ae3460a71c7f207a4a8ea8087f6 Mon Sep 17 00:00:00 2001 From: caturbgs Date: Wed, 22 Dec 2021 16:06:18 +0700 Subject: [PATCH 4/5] fix: create payback fix image --- src/pages/Payback/PaybackModal.js | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/src/pages/Payback/PaybackModal.js b/src/pages/Payback/PaybackModal.js index f5229ef..6420dae 100644 --- a/src/pages/Payback/PaybackModal.js +++ b/src/pages/Payback/PaybackModal.js @@ -12,7 +12,7 @@ export const PaybackModal = ({initialData}) => { const [image, setImage] = useState(""); const [fileList, setFileList] = useState([]); const [previewImage, setPreviewImage] = useState(""); - const [previewVisible, setPreviewVisible] = useState(false); + const [responseFilename, setResponseFilename] = useState(""); const [loading, setLoading] = useState(false); const modalLoader = useContext(ModalLoaderContext); @@ -34,6 +34,7 @@ export const PaybackModal = ({initialData}) => { const file = args.file; const res = await http.upload(file); setImage(`${appConfig.apiUrl}/config/image/${res.body.filename}`); + setResponseFilename(res.body.filename); setFileList([{ uid: '-1', name: 'image', @@ -62,7 +63,8 @@ export const PaybackModal = ({initialData}) => { try { const request = { ...data, - destination: store.authentication.profileData.superior?.id + destination: store.authentication.profileData.superior?.id, + image_prove: responseFilename } await store.payback.create(request); message.success("Success Add Payback"); @@ -75,20 +77,20 @@ export const PaybackModal = ({initialData}) => { } modalLoader.setLoading(false); form.resetFields(); - store.payback.visibleModalPayback = false; setImage(""); setFileList([]); setPreviewImage(""); - setPreviewVisible(false); + setResponseFilename(""); + store.payback.visibleModalPayback = false; }; const handleCancel = () => { form.resetFields(); - store.payback.visibleModalPayback = false; setImage(""); setFileList([]); setPreviewImage(""); - setPreviewVisible(false); + setResponseFilename(""); + store.payback.visibleModalPayback = false; } return ( @@ -126,7 +128,6 @@ export const PaybackModal = ({initialData}) => { fileList={fileList} onPreview={(file) => { setPreviewImage(file.url || file.filename); - setPreviewVisible(file.url || file.filename); }} showUploadList={true} onChange={handleChange} From 81d6407367edbcff811ebac40e33a63f46af3bb6 Mon Sep 17 00:00:00 2001 From: caturbgs Date: Wed, 22 Dec 2021 16:19:45 +0700 Subject: [PATCH 5/5] fix: dsplay image in payback --- src/pages/Payback/Payback.js | 12 ++++++------ src/pages/Payback/PaybackModal.js | 2 +- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/pages/Payback/Payback.js b/src/pages/Payback/Payback.js index 729ccb7..521f9e0 100644 --- a/src/pages/Payback/Payback.js +++ b/src/pages/Payback/Payback.js @@ -6,6 +6,7 @@ import {CheckCircleOutlined, CloseOutlined, FilterOutlined,} from "@ant-design/i import {BreadcumbComponent} from "../../component/BreadcumbComponent"; import {LINKS} from "../../routes/app"; import {ModalLoaderContext} from "../../utils/modal"; +import {appConfig} from "../../config/app"; const {Search} = Input; @@ -39,12 +40,11 @@ export const Payback = observer(() => { dataIndex: "image_prove", key: "image_prove", render: (text, record) => ( - avatar + {record.id} ), }, { diff --git a/src/pages/Payback/PaybackModal.js b/src/pages/Payback/PaybackModal.js index 6420dae..144ee42 100644 --- a/src/pages/Payback/PaybackModal.js +++ b/src/pages/Payback/PaybackModal.js @@ -76,12 +76,12 @@ export const PaybackModal = ({initialData}) => { message.error(e.message); } modalLoader.setLoading(false); + store.payback.visibleModalPayback = false; form.resetFields(); setImage(""); setFileList([]); setPreviewImage(""); setResponseFilename(""); - store.payback.visibleModalPayback = false; }; const handleCancel = () => {