diff --git a/src/component/CategoryComponent.js b/src/component/CategoryComponent.js index 753342e..9005485 100644 --- a/src/component/CategoryComponent.js +++ b/src/component/CategoryComponent.js @@ -139,7 +139,7 @@ export const CategoryComponent = observer((props) => { store.category.pageSize = page.pageSize; store.category.page = pageNumber - 1; modalLoader.setLoading(true); - await store.category.getData(); + //await store.category.getData(); modalLoader.setLoading(false); }} /> diff --git a/src/component/CommissionComponent.js b/src/component/CommissionComponent.js index ae730ca..0cf36e8 100644 --- a/src/component/CommissionComponent.js +++ b/src/component/CommissionComponent.js @@ -82,7 +82,7 @@ export const CommissionComponent = observer((props) => { store.commission.pageSize = page.pageSize; store.commission.page = pageNumber - 1; modalLoader.setLoading(true); - await store.commission.getData(); + //await store.commission.getData(); modalLoader.setLoading(false); }} /> diff --git a/src/component/PartnerComponent.js b/src/component/PartnerComponent.js index 7a3afd0..5e49029 100644 --- a/src/component/PartnerComponent.js +++ b/src/component/PartnerComponent.js @@ -211,7 +211,7 @@ export const PartnerComponent = observer((props) => { store.partner.pageSize = page.pageSize; store.partner.page = pageNumber - 1; modalLoader.setLoading(true); - await store.partner.getData(); + //await store.partner.getData(); modalLoader.setLoading(false); }} /> diff --git a/src/component/ProductComponent.js b/src/component/ProductComponent.js index 4b0b143..96d0668 100644 --- a/src/component/ProductComponent.js +++ b/src/component/ProductComponent.js @@ -1,38 +1,22 @@ -import React, { useContext, useState } from "react"; -import { - Button, - Col, - Form, - Input, - message, - Modal, - Row, - Select, - Table, - Divider, - Tag, - Typography, - List, -} from "antd"; -import { observer } from "mobx-react-lite"; -import { ExclamationCircleOutlined } from "@ant-design/icons"; -import { useHistory } from "react-router-dom"; -import { capitalize } from "lodash"; -import { useStore } from "../utils/useStore"; -import { LINKS } from "../routes/app"; -import { ModalLoaderContext } from "../utils/modal"; +import React, {useContext, useState} from "react"; +import {Button, Col, Divider, Form, Input, List, message, Modal, Row, Select, Table, Tag, Typography,} from "antd"; +import {observer} from "mobx-react-lite"; +import {ExclamationCircleOutlined} from "@ant-design/icons"; +import {useHistory} from "react-router-dom"; +import {useStore} from "../utils/useStore"; +import {LINKS} from "../routes/app"; +import {ModalLoaderContext} from "../utils/modal"; -const { Title, Text } = Typography; +const {Title, Text} = Typography; export const ProductComponent = observer((props) => { const store = useStore(); const [form] = Form.useForm(); - const { Option } = Select; + 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) => { @@ -52,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", @@ -96,6 +80,20 @@ export const ProductComponent = observer((props) => { ), }, + { + title: "Action", + key: "action", + render: (text, record) => ( + + ), + }, ]; const deleteData = async (id) => { @@ -164,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; }; @@ -187,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 = [ , @@ -383,10 +391,10 @@ export const ProductComponent = observer((props) => { ]} > @@ -404,17 +412,18 @@ export const ProductComponent = observer((props) => { Filter Supplier @@ -423,19 +432,16 @@ export const ProductComponent = observer((props) => { Filter Categories @@ -444,17 +450,18 @@ export const ProductComponent = observer((props) => { Filter Sub-Categories diff --git a/src/component/Subcategory.js b/src/component/Subcategory.js index 332552d..283aedc 100644 --- a/src/component/Subcategory.js +++ b/src/component/Subcategory.js @@ -1,4 +1,4 @@ -import React, { useContext, useState } from "react"; +import React, { useContext, useState,useEffect } from "react"; import { Button, Form, @@ -23,7 +23,10 @@ export const SubcategoryComponent = observer((props) => { const { Option } = Select; const [idData, setIdData] = useState(""); const modalLoader = useContext(ModalLoaderContext); - + useEffect(() => { + + getData() + }, []) const getData = async () => { await store.category.getData(); await store.subcategory.getData(); @@ -78,7 +81,7 @@ export const SubcategoryComponent = observer((props) => { modalLoader.setLoading(true); try { await store.subcategory.update(idData, data); - await getData(); + //await getData(); message.success("Success Update Data Category"); } catch (e) { message.error("Failed Update Data Category"); @@ -91,7 +94,6 @@ export const SubcategoryComponent = observer((props) => { modalLoader.setLoading(true); try { await store.subcategory.create(data); - await getData(); message.success("Success Add New Category"); } catch (e) { console.log(e, "apa errornya"); @@ -124,7 +126,7 @@ export const SubcategoryComponent = observer((props) => { store.subcategory.pageSize = page.pageSize; store.subcategory.page = pageNumber - 1; modalLoader.setLoading(true); - await getData(); + // await getData(); modalLoader.setLoading(false); }} /> diff --git a/src/component/SupplierComponent.js b/src/component/SupplierComponent.js index 29b1298..dce358e 100644 --- a/src/component/SupplierComponent.js +++ b/src/component/SupplierComponent.js @@ -1,12 +1,23 @@ -import React, {useContext, useState} from "react"; -import {Button, Form, Input, message, Modal, Space, Table, Tag} from "antd"; -import {observer} from "mobx-react-lite"; -import {ExclamationCircleOutlined} from "@ant-design/icons"; -import {useHistory} from "react-router-dom"; -import {useStore} from "../utils/useStore"; -import {LINKS} from "../routes/app"; -import {TopupsaldoModal} from "./TopupsaldoModal"; -import {ModalLoaderContext} from "../utils/modal"; +import React, { useContext, useState } from "react"; +import { + Button, + Form, + Input, + message, + Modal, + Space, + Table, + Tag, + List, + Divider, +} from "antd"; +import { observer } from "mobx-react-lite"; +import { ExclamationCircleOutlined } from "@ant-design/icons"; +import { useHistory } from "react-router-dom"; +import { useStore } from "../utils/useStore"; +import { LINKS } from "../routes/app"; +import { TopupsaldoModal } from "./TopupsaldoModal"; +import { ModalLoaderContext } from "../utils/modal"; export const SupplierComponent = observer((props) => { const store = useStore(); @@ -70,10 +81,10 @@ export const SupplierComponent = observer((props) => { key: ["coa", "amount"], width: "20%", render: (text, record) => - new Intl.NumberFormat("id-ID", { - style: "currency", - currency: "IDR", - }).format(text) + new Intl.NumberFormat("id-ID", { + style: "currency", + currency: "IDR", + }).format(text), }, { title: "Saldo di System", @@ -81,10 +92,10 @@ export const SupplierComponent = observer((props) => { key: ["coa_undistribute", "amount"], width: "20%", render: (text, record) => - new Intl.NumberFormat("id-ID", { - style: "currency", - currency: "IDR", - }).format(text) + new Intl.NumberFormat("id-ID", { + style: "currency", + currency: "IDR", + }).format(text), }, { title: "Status", @@ -94,7 +105,7 @@ export const SupplierComponent = observer((props) => { render: (text, record) => ( {record?.status === true ? " ACTIVE" : "INACTIVE"} @@ -137,7 +148,7 @@ export const SupplierComponent = observer((props) => { const handleDelete = (id) => { Modal.confirm({ title: "Are you sure delete this record?", - icon: , + icon: , okText: "Yes", okType: "primary", cancelText: "Cancel", @@ -190,27 +201,121 @@ export const SupplierComponent = observer((props) => { return (
- { - let pageNumber = page.current; - store.supplier.pageSize = page.pageSize; - store.supplier.page = pageNumber - 1; - modalLoader.setLoading(true); - await store.supplier.getData(); - modalLoader.setLoading(false); - }} - /> + {store.ui.mediaQuery.isDesktop && ( +
{ + let pageNumber = page.current; + store.supplier.pageSize = page.pageSize; + store.supplier.page = pageNumber - 1; + modalLoader.setLoading(true); + //await store.supplier.getData(); + modalLoader.setLoading(false); + }} + /> + )} + {store.ui.mediaQuery.isMobile && ( + { + store.supplier.pageSize = page.pageSize; + store.supplier.page = page.current; + modalLoader.setLoading(true); + await store.supplier.getData(); + modalLoader.setLoading(false); + }, + pageSize: store.supplier.pageSize, + total: store.supplier.total_data, + current: store.supplier.page, + style: { marginBottom: "1rem", marginRight: "1rem" }, + }} + dataSource={store.supplier.data} + style={{ padding: 0 }} + renderItem={(item) => { + return ( +
+ + +

+ Name : {item.name}
+ Saldo Supplier : {item.coa.amount} +
+ + Saldo System : {item.coa_undistribute.amount} + +
+ + + + + {item?.status === true ? " ACTIVE" : "INACTIVE"} + +

+

+
+ } + /> + + + + ); + }} + /> + )} { - + {!idData && ( - + )} - + ); }); diff --git a/src/index.css b/src/index.css index 8911c18..3c1a8ed 100644 --- a/src/index.css +++ b/src/index.css @@ -63,6 +63,11 @@ code { .ant-menu-submenu-arrow{ padding-right: 40px !important; } -.ant-breadcrumb{ +.ant-breadcrumb { margin-bottom: 10px !important; +} + +.ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn { + color: #ed1f24 !important; + border-color: #ed1f24 !important; } \ No newline at end of file diff --git a/src/pages/App/DesktopLayout.js b/src/pages/App/DesktopLayout.js index 0651668..ffe6524 100644 --- a/src/pages/App/DesktopLayout.js +++ b/src/pages/App/DesktopLayout.js @@ -209,18 +209,22 @@ export const DesktopLayout = observer(() => { icon={} title="Payback" > + {store.authentication.userData.role !== "Retail" && ( Payback To + )} + {store.authentication.userData.role !== "Admin" && ( Payback + )} {store.authentication.userData.role !== "Admin" && ( diff --git a/src/pages/App/MenuList.js b/src/pages/App/MenuList.js index 56137bb..8f744c3 100644 --- a/src/pages/App/MenuList.js +++ b/src/pages/App/MenuList.js @@ -15,7 +15,7 @@ import { ShoppingCartOutlined, UserOutlined, AlipayOutlined, - PayCircleOutlined + PayCircleOutlined, } from "@ant-design/icons"; import { observer } from "mobx-react-lite"; import { useStore } from "../../utils/useStore"; @@ -127,18 +127,22 @@ export const MenuList = observer((props) => { )} } title="Payback"> - - - - Payback To - - - - - - Payback - - + {store.authentication.userData.role !== "Retail" && ( + + + + Payback To + + + )} + {store.authentication.userData.role !== "Admin" && ( + + + + Payback + + + )} {store.authentication.userData.role !== "Admin" && ( diff --git a/src/pages/Config/Supplier.js b/src/pages/Config/Supplier.js index 5c6d60a..fc088b5 100644 --- a/src/pages/Config/Supplier.js +++ b/src/pages/Config/Supplier.js @@ -75,7 +75,7 @@ export const Supplier = observer(() => { placeholder="input search text" style={{ width: store.ui.mediaQuery.isMobile ? 160 : 200, - marginRight: store.ui.mediaQuery.isMobile ? 0 : 10, + marginRight: store.ui.mediaQuery.isMobile ? 10 : 10, marginBottom: store.ui.mediaQuery.isMobile ? 10 : 0, }} onSearch={(value) => console.log(value)} diff --git a/src/pages/Membership/DetailUser.js b/src/pages/Membership/DetailUser.js new file mode 100644 index 0000000..fe5bfdc --- /dev/null +++ b/src/pages/Membership/DetailUser.js @@ -0,0 +1,148 @@ +import React, {useContext, useEffect} from "react"; +import {Button, Card, Col, Row, Table, Typography} from "antd"; +import {BreadcumbComponent} from "../../component/BreadcumbComponent"; +import {LINKS} from "../../routes/app"; +import {useStore} from "../../utils/useStore"; +import {observer} from "mobx-react-lite"; +import {FilterOutlined} from "@ant-design/icons"; +import {format, parseISO} from "date-fns"; +import {ModalLoaderContext} from "../../utils/modal"; + +const {Title, Text} = Typography; + +export const DetailUser = observer(() => { + const store = useStore(); + const modalLoader = useContext(ModalLoaderContext); + + const routeData = [ + { + route: LINKS.HOME, + name: "Home", + }, + { + route: LINKS.DETAILUSER, + name: Detail User, + }, + ]; + + useEffect(() => { + (async () => { + modalLoader.setLoading(true); + await Promise.allSettled([ + store.authentication.getProfile(), + store.transaction.getDataHistoryTransaction(), + ]); + modalLoader.setLoading(false); + })() + }, []); + + const columns = [ + { + title: 'Markup Price', + dataIndex: 'mark_up_price', + key: 'mark_up_price', + width: '20%', + }, + { + title: 'Name', + dataIndex: 'name', + key: 'name', + width: '50%', + }, + { + title: 'Transaction Date', + dataIndex: 'created_at', + key: 'created_at', + render: (text, record) => { + return ( + {format(parseISO(record.created_at), 'dd MMMM yyyy HH:mm')} + ) + }, + }, + ] + + const styleSaldoTitle = store.ui.mediaQuery.isDesktop ? { + display: "flex", + justifyContent: "center" + } : {fontSize: "0.75rem"}; + const styleSaldoContent = store.ui.mediaQuery.isDesktop ? { + fontSize: '1.25rem', + display: "flex", + justifyContent: "center" + } : null; + + return ( +
+ + + Detail User + +
+ + + Name + + + {store.authentication.profileData?.userDetail?.name} + + + Role + + + {store.authentication.profileData?.userDetail?.phone_number} + + + Saldo Supplier + + + {store.authentication.profileData?.username} + + + Saldo System + + + {store.authentication.profileData.roles?.name} + + + Status + + + {store.authentication.profileData.superior?.username} + + + + + + + Saldo + + + {store.authentication.profileData?.wallet} + + + + + + +
+ History User Transaction + + +
+ + + +
+ +
+ ) +}); diff --git a/src/pages/Membership/Membership.js b/src/pages/Membership/Membership.js index 93d6d33..9126636 100644 --- a/src/pages/Membership/Membership.js +++ b/src/pages/Membership/Membership.js @@ -1,36 +1,37 @@ -import React, {useContext, useEffect, useState} from "react"; +import React, { useContext, useEffect, useState } from "react"; import { Button, Card, Col, Divider, + Form, Input, List, message, Modal, Row, + Select, Space, Table, Tag, - Form, - Select, } from "antd"; -import {useStore} from "../../utils/useStore"; -import {observer} from "mobx-react-lite"; +import { useStore } from "../../utils/useStore"; +import { observer } from "mobx-react-lite"; import { - ExclamationCircleOutlined, - FilterOutlined, - PlusSquareOutlined, DownloadOutlined, + ExclamationCircleOutlined, + PlusSquareOutlined, } from "@ant-design/icons"; -import {MembershipModal} from "./MembershipModal"; -import {BreadcumbComponent} from "../../component/BreadcumbComponent"; -import {LINKS} from "../../routes/app"; -import {ModalLoaderContext} from "../../utils/modal"; +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"; -const {Search} = Input; -const {Option} = Select; +const { Search } = Input; +const { Option } = Select; export const Membership = observer(() => { + const history = useHistory(); const [form] = Form.useForm(); const store = useStore(); const [visibleModal, setVisibleModal] = useState(false); @@ -133,9 +134,26 @@ export const Membership = observer(() => { key: "role", }, { - title: "Saldo", + title: "Saldo di Supplier", dataIndex: ["coa", "amount"], key: ["coa", "amount"], + width: "20%", + render: (text) => + new Intl.NumberFormat("id-ID", { + style: "currency", + currency: "IDR", + }).format(text), + }, + { + title: "Saldo di System", + dataIndex: ["coa_undistribute", "amount"], + key: ["coa_undistribute", "amount"], + width: "20%", + render: (text) => + new Intl.NumberFormat("id-ID", { + style: "currency", + currency: "IDR", + }).format(text), }, { title: "Status", @@ -144,7 +162,7 @@ export const Membership = observer(() => { render: (text, record) => ( {record?.isActive === true ? " ACTIVE" : "INACTIVE"} @@ -168,7 +186,7 @@ export const Membership = observer(() => { setIsVisibleTopUpModal(true); }} > - Top Up Saldo + Top Up Saldo - {/* */} + Detail + ), }, @@ -219,7 +238,7 @@ export const Membership = observer(() => { }, { route: "/app/membership", - name: Membership, + name: Membership, }, ]; @@ -254,7 +273,6 @@ export const Membership = observer(() => { try { await store.membership.create(data); message.success("Success Add New Member"); - await getData(); } catch (e) { console.log(e, "apa errornya"); message.error("Failed Add Member"); @@ -266,42 +284,42 @@ export const Membership = observer(() => { } }; - const handleDelete = (record) => { - Modal.confirm({ - title: "Are you sure delete this record?", - icon: , - okText: "Yes", - okType: "primary", - cancelText: "Cancel", - async onOk() { - try { - //TODO: minta apinya ke ka ilham ya, jangan di uncomment kalo pake api reconcile, nanti beneran ke apus datanya - await store.membership.delete(record); - message.success("Success Delete Data"); - await getData(); - } catch (e) { - message.error("Failed Delete Data"); - } - }, - onCancel() { - console.log("Cancel"); - }, - }); + const handleDetail = (record) => { + // Modal.confirm({ + // title: "Are you sure delete this record?", + // icon: , + // okText: "Yes", + // okType: "primary", + // cancelText: "Cancel", + // async onOk() { + // try { + // //TODO: minta apinya ke ka ilham ya, jangan di uncomment kalo pake api reconcile, nanti beneran ke apus datanya + // await store.membership.delete(record); + // message.success("Success Delete Data"); + // await getData(); + // } catch (e) { + // message.error("Failed Delete Data"); + // } + // }, + // onCancel() { + // console.log("Cancel"); + // }, + // }); }; return (
- +
- +
{/* */} - + { setVisibleModal(true); }} > - New + New @@ -339,7 +357,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); }} /> @@ -360,10 +378,10 @@ export const Membership = observer(() => { pageSize: store.membership.pageSize, total: store.membership.total_data, current: store.membership.page, - style: {marginBottom: "1rem", marginRight: "1rem"}, + style: { marginBottom: "1rem", marginRight: "1rem" }, }} dataSource={store.membership.data} - style={{padding: 0}} + style={{ padding: 0 }} renderItem={(item) => { return (
@@ -381,27 +399,39 @@ export const Membership = observer(() => { >

- Username : {item.username}
+ Role : {item.roleName}
+ Saldo Supplier : {item.amount}{" "} +
+ Saldo System : {item.amount}

} /> -
+

- {item.username} +

- +
); }} @@ -435,7 +465,7 @@ export const Membership = observer(() => { + diff --git a/src/pages/Membership/MembershipModal.js b/src/pages/Membership/MembershipModal.js index 92faaef..4a21904 100644 --- a/src/pages/Membership/MembershipModal.js +++ b/src/pages/Membership/MembershipModal.js @@ -1,17 +1,16 @@ import React from "react"; -import { Form, Input, Modal, Select } from "antd"; -import { capitalize } from "lodash"; -import { useStore } from "../../utils/useStore"; +import {Form, Input, Modal, Select} from "antd"; +import {useStore} from "../../utils/useStore"; export const MembershipModal = ({ - visible, - onCreate, - onCancel, - initialData, -}) => { - const [form] = Form.useForm(); - const { Option } = Select; - const store = useStore(); + visible, + onCreate, + onCancel, + initialData, + }) => { + const [form] = Form.useForm(); + const {Option} = Select; + const store = useStore(); return ( - + )} {((initialData.id && !initialData.isChangePassword) || diff --git a/src/pages/Payback/Payback.js b/src/pages/Payback/Payback.js index a87baff..729ccb7 100644 --- a/src/pages/Payback/Payback.js +++ b/src/pages/Payback/Payback.js @@ -158,21 +158,21 @@ export const Payback = observer(() => { columns={columns} dataSource={store.payback.data} bordered - pagination={{ - pageSize: store.payback.page, - total: store.payback.total_data, - current: store.payback.pageSize + 1, - showSizeChanger: true, - simple: false - }} - onChange={async (page) => { - let pageNumber = page.current; - store.payback.pageSize = page.pageSize; - store.payback.page = pageNumber - 1; - modalLoader.setLoading(true); - await store.payback.getData(); - modalLoader.setLoading(false); - }} + // pagination={{ + // pageSize: store.payback.page, + // total: store.payback.total_data, + // current: store.payback.pageSize + 1, + // showSizeChanger: true, + // simple: false + // }} + // onChange={async (page) => { + // let pageNumber = page.current; + // store.payback.pageSize = page.pageSize; + // store.payback.page = pageNumber - 1; + // modalLoader.setLoading(true); + // await store.payback.getData(); + // modalLoader.setLoading(false); + // }} /> )} @@ -180,19 +180,19 @@ export const Payback = observer(() => { { - store.payback.pageSize = page.pageSize; - store.payback.page = page.current; - modalLoader.setLoading(true); - await store.payback.getData(); - modalLoader.setLoading(false); - }, - pageSize: store.payback.pageSize, - total: store.payback.total_data, - current: store.payback.page, - style: {marginBottom: "1rem", marginRight: "1rem"}, - }} + // pagination={{ + // onChange: async (page) => { + // store.payback.pageSize = page.pageSize; + // store.payback.page = page.current; + // modalLoader.setLoading(true); + // await store.payback.getData(); + // modalLoader.setLoading(false); + // }, + // pageSize: store.payback.pageSize, + // total: store.payback.total_data, + // current: store.payback.page, + // style: {marginBottom: "1rem", marginRight: "1rem"}, + // }} dataSource={store.payback.data} style={{padding: 0}} renderItem={(item) => { diff --git a/src/pages/Payback/PaybackFromUser.js b/src/pages/Payback/PaybackFromUser.js index cc258f2..6db5368 100644 --- a/src/pages/Payback/PaybackFromUser.js +++ b/src/pages/Payback/PaybackFromUser.js @@ -12,7 +12,6 @@ const {Search} = Input; export const PaybackFromUser = observer(() => { const store = useStore(); - const [visibleModal, setVisibleModal] = useState(false); const [initialData, setInitialData] = useState({}); const modalLoader = useContext(ModalLoaderContext); @@ -71,23 +70,6 @@ export const PaybackFromUser = observer(() => { }, ]; - const onSubmit = async (data) => { - modalLoader.setLoading(true); - try { - // await store.membership.create(data); - // message.success("Success Add New Member"); - // await store.membership.getData(); - } catch (e) { - console.error(e, "apa errornya"); - message.error("Failed Add Member"); - } - modalLoader.setLoading(false); - setVisibleModal(false); - }; - - const handleAction = async (record, type) => { - }; - return (
@@ -113,7 +95,7 @@ export const PaybackFromUser = observer(() => {
); diff --git a/src/pages/Payback/PaybackModal.js b/src/pages/Payback/PaybackModal.js index 9079ad9..f5229ef 100644 --- a/src/pages/Payback/PaybackModal.js +++ b/src/pages/Payback/PaybackModal.js @@ -1,12 +1,12 @@ import React, {useContext, useState} from "react"; -import {Form, Input, message, Modal, Upload,} from "antd"; +import {Form, InputNumber, message, Modal, Upload,} from "antd"; import {useStore} from "../../utils/useStore"; import {LoadingOutlined, PlusOutlined} from "@ant-design/icons"; import {ModalLoaderContext} from "../../utils/modal"; import {http} from "../../utils/http"; import {appConfig} from "../../config/app"; -export const PaybackModal = ({visible, onCreate, onCancel, initialData}) => { +export const PaybackModal = ({initialData}) => { const [form] = Form.useForm(); const store = useStore(); const [image, setImage] = useState(""); @@ -58,40 +58,51 @@ export const PaybackModal = ({visible, onCreate, onCancel, initialData}) => { ); const handleSubmit = async (data) => { - console.log(data, "isi data2"); + modalLoader.setLoading(true); try { - modalLoader.setLoading(true); - await store.payback.create(data); - modalLoader.setLoading(false); + const request = { + ...data, + destination: store.authentication.profileData.superior?.id + } + await store.payback.create(request); message.success("Success Add Payback"); - await store.payback.getData(); } catch (e) { - modalLoader.setLoading(false); if (e.response?.body?.message) { message.error(e.response.body.message); return; } message.error(e.message); } + modalLoader.setLoading(false); form.resetFields(); + store.payback.visibleModalPayback = false; + setImage(""); + setFileList([]); + setPreviewImage(""); + setPreviewVisible(false); }; + const handleCancel = () => { + form.resetFields(); + store.payback.visibleModalPayback = false; + setImage(""); + setFileList([]); + setPreviewImage(""); + setPreviewVisible(false); + } + return ( { - form.resetFields(); - onCancel(); - }} + onCancel={handleCancel} onOk={() => { form .validateFields() .then((values) => { handleSubmit(values); - console.log(values); form.resetFields(); }) .catch((info) => { @@ -105,14 +116,6 @@ export const PaybackModal = ({visible, onCreate, onCancel, initialData}) => { name="form_in_modal" initialValues={initialData} > - - - { {image === "" ? uploadButton : null} -
- Max size of file 2 mb +
+ Max size of file 2 MB
@@ -153,7 +154,11 @@ export const PaybackModal = ({visible, onCreate, onCancel, initialData}) => { label="amount" rules={[{required: true, message: "Please input Amount!"}]} > - + `Rp. ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')} + parser={value => value.replace(/\Rp.\s?|(,*)/g, '')} + /> diff --git a/src/pages/Product/DetailProduct.js b/src/pages/Product/DetailProduct.js new file mode 100644 index 0000000..40640e4 --- /dev/null +++ b/src/pages/Product/DetailProduct.js @@ -0,0 +1,148 @@ +import React, {useContext, useEffect} from "react"; +import {Button, Card, Col, Row, Table, Typography} from "antd"; +import {BreadcumbComponent} from "../../component/BreadcumbComponent"; +import {LINKS} from "../../routes/app"; +import {useStore} from "../../utils/useStore"; +import {observer} from "mobx-react-lite"; +import {FilterOutlined} from "@ant-design/icons"; +import {format, parseISO} from "date-fns"; +import {ModalLoaderContext} from "../../utils/modal"; + +const {Title, Text} = Typography; + +export const DetailProduct = observer(() => { + const store = useStore(); + const modalLoader = useContext(ModalLoaderContext); + + const routeData = [ + { + route: LINKS.HOME, + name: "Home", + }, + { + route: LINKS.DETAILPRODUCT, + name: Detail Product, + }, + ]; + + useEffect(() => { + (async () => { + modalLoader.setLoading(true); + await Promise.allSettled([ + store.authentication.getProfile(), + store.transaction.getDataHistoryTransaction(), + ]); + modalLoader.setLoading(false); + })() + }, []); + + const columns = [ + { + title: 'Markup Price', + dataIndex: 'mark_up_price', + key: 'mark_up_price', + width: '20%', + }, + { + title: 'Name', + dataIndex: 'name', + key: 'name', + width: '50%', + }, + { + title: 'Transaction Date', + dataIndex: 'created_at', + key: 'created_at', + render: (text, record) => { + return ( + {format(parseISO(record.created_at), 'dd MMMM yyyy HH:mm')} + ) + }, + }, + ] + + const styleSaldoTitle = store.ui.mediaQuery.isDesktop ? { + display: "flex", + justifyContent: "center" + } : {fontSize: "0.75rem"}; + const styleSaldoContent = store.ui.mediaQuery.isDesktop ? { + fontSize: '1.25rem', + display: "flex", + justifyContent: "center" + } : null; + + return ( +
+ + + Detail Product + +
+ + + Kode + + + {store.authentication.profileData?.userDetail?.name} + + + Produk + + + {store.authentication.profileData?.userDetail?.phone_number} + + + Harga Beli + + + {store.authentication.profileData?.username} + + + Harga Jual + + + {store.authentication.profileData.roles?.name} + + + Status + + + {store.authentication.profileData.superior?.username} + + + + + + + Saldo + + + {store.authentication.profileData?.wallet} + + + + + + +
+ History User Transaction + + +
+ + + +
+ +
+ ) +}); diff --git a/src/pages/Product/Product.js b/src/pages/Product/Product.js index 95750f5..95f4c34 100644 --- a/src/pages/Product/Product.js +++ b/src/pages/Product/Product.js @@ -1,5 +1,5 @@ import React, {useContext, useEffect} from "react"; -import {Button, Card, Col, Input, Row, Upload,message} from "antd"; +import {Button, Card, Col, Input, message, Row, Upload} from "antd"; import {FilterOutlined, PlusSquareOutlined, UploadOutlined,} from "@ant-design/icons"; import {BreadcumbComponent} from "../../component/BreadcumbComponent"; import {useStore} from "../../utils/useStore"; @@ -20,8 +20,8 @@ export const Product = observer(() => { modalLoader.setLoading(true); await Promise.allSettled([ store.supplier.getData(), - store.product.getDataCategories(), store.category.getData(), + store.product.getDataSubCategories(), ]); await store.product.getData(); modalLoader.setLoading(false); diff --git a/src/pages/Transaction/Product.js b/src/pages/Transaction/Product.js index 5e23868..b2c59b2 100644 --- a/src/pages/Transaction/Product.js +++ b/src/pages/Transaction/Product.js @@ -1,4 +1,4 @@ -import React, {useContext, useEffect, useState} from "react"; +import React, {useContext, useEffect} from "react"; import {useStore} from "../../utils/useStore"; import {Button, Card, Col, Input, message, Modal, Row, Select} from "antd"; import {observer} from "mobx-react-lite"; @@ -10,8 +10,6 @@ const {Option} = Select; export const Product = observer(() => { const store = useStore(); - - const [productData, setProductData] = useState([]); const modalLoader = useContext(ModalLoaderContext); useEffect(() => { @@ -36,20 +34,6 @@ export const Product = observer(() => { init(); }, []); - // data - useEffect(() => { - console.log("⚡ transaction data store", store.transaction.data); - setProductData(store.transaction.data); - }, [store.transaction.data]); - - // Subcategory - useEffect(() => { - console.log( - "⚡ transaction subcategory store", - store.transaction.dataSubCategories - ); - }, [store.transaction.dataSubCategories]); - const handleChangeSubcategory = async (item) => { store.transaction.filterSubCategory = item; modalLoader.setLoading(true); @@ -61,12 +45,16 @@ export const Product = observer(() => { modalLoader.setLoading(true); try { const response = await store.transaction.buyProduct({productCode: data}); - // if (response.status === 200) { - message.success("Success Buy Product"); - // } else { - //message.error("Failed Buy Product"); - //} + if (response.status === 201) { + message.success("Success Buy Product"); + } else { + message.error("Failed Buy Product", 3); + } } catch (e) { + if (e.response?.body?.message) { + message.error(e.response.body.message); + return; + } console.log(e, "apa errornya"); message.error("Failed Buy Product"); } @@ -81,14 +69,11 @@ export const Product = observer(() => {