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

Perbaikan Project PPOB

Browse Source
This commit is contained in:
ajat91.sudrajat 2021-12-28 13:46:52 +07:00
parent bf0e28c4f3
commit 7ad15665cc
6 changed files with 319 additions and 180 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/component/PartnerComponent.js
View File

@ -20,6 +20,7 @@ import { ModalLoaderContext } from "../utils/modal";
export const PartnerComponent = observer((props) => { export const PartnerComponent = observer((props) => {
const store = useStore(); const store = useStore();
const [value, setValue] = useState();
const [form] = Form.useForm(); const [form] = Form.useForm();
const history = useHistory(); const history = useHistory();
const [idData, setIdData] = useState(""); const [idData, setIdData] = useState("");
@ -415,9 +416,21 @@ export const PartnerComponent = observer((props) => {
required: true, required: true,
message: "Please input password phone number!", message: "Please input password phone number!",
}, },
{
pattern: /^(?:\d*)$/,
message: "Value should contain just number",
},
{
pattern: /^[\d]{0,12}$/,
message: "Value should be less than 12 character",
},
]} ]}
> >
<Input /> <Input
onChange={(value) => {
setValue(value);
}}
/>
</Form.Item> </Form.Item>
)} )}
{!isChangePassword && ( {!isChangePassword && (

42
src/pages/App/DesktopLayout.js
View File

@ -118,23 +118,30 @@ export const DesktopLayout = observer(() => {
}} }}
> >
<Menu> <Menu>
{store.authentication.userData.role !== "Admin Partner" && ( {/* {store.authentication.userData.role !== "Admin Partner" && ( */}
<Menu.Item key="home"> <Menu.Item key="home">
<Link to={LINKS.HOME}> <Link to={LINKS.HOME}>
<HomeOutlined /> <HomeOutlined />
<span>Beranda</span> <span>Beranda</span>
</Link> </Link>
</Menu.Item> </Menu.Item>
)} {/* )} */}
{store.authentication.userData.role !== "Retail" || {store.authentication.userData.role === "Admin" && (
(store.authentication.userData.role !== "Admin Partner" && (
<Menu.Item key="membership"> <Menu.Item key="membership">
<Link to={LINKS.MEMBERSHIP}> <Link to={LINKS.MEMBERSHIP}>
<FileProtectOutlined /> <FileProtectOutlined />
<span>Keanggotaan</span> <span>Keanggotaan</span>
</Link> </Link>
</Menu.Item> </Menu.Item>
))} )}
{store.authentication.userData.role === "Supervisor" && (
<Menu.Item key="membership">
<Link to={LINKS.MEMBERSHIP}>
<FileProtectOutlined />
<span>Keanggotaan</span>
</Link>
</Menu.Item>
)}
{store.authentication.userData.role === "Admin" && ( {store.authentication.userData.role === "Admin" && (
<SubMenu <SubMenu
key="config" key="config"
@ -192,7 +199,7 @@ export const DesktopLayout = observer(() => {
)} )}
</SubMenu> </SubMenu>
)} )}
{store.authentication.userData.role !== "Admin" && ( {store.authentication.userData.role === "Supervisor" && (
<Menu.Item key="product"> <Menu.Item key="product">
<Link to={LINKS.PRODUCT}> <Link to={LINKS.PRODUCT}>
<DatabaseOutlined /> <DatabaseOutlined />
@ -200,16 +207,31 @@ export const DesktopLayout = observer(() => {
</Link> </Link>
</Menu.Item> </Menu.Item>
)} )}
{store.authentication.userData.role === "Retail" || {store.authentication.userData.role === "Admin Partner" && (
(store.authentication.userData.role === "Admin Partner" && ( <Menu.Item key="product">
<Link to={LINKS.PRODUCT}>
<DatabaseOutlined />
<span>Produk</span>
</Link>
</Menu.Item>
)}
{store.authentication.userData.role === "Admin Partner" && (
<Menu.Item key="transaction"> <Menu.Item key="transaction">
<Link to={LINKS.TRANSACTION}> <Link to={LINKS.TRANSACTION}>
<ShoppingCartOutlined /> <ShoppingCartOutlined />
<span>Transaksi</span> <span>Transaksi</span>
</Link> </Link>
</Menu.Item> </Menu.Item>
))} )}
{store.authentication.userData.role !== "Admin Partner" && ( {store.authentication.userData.role === "Retail" && (
<Menu.Item key="transaction">
<Link to={LINKS.TRANSACTION}>
<ShoppingCartOutlined />
<span>Transaksi</span>
</Link>
</Menu.Item>
)}
{store.authentication.userData.role !== "Admin Partner" && store.authentication.userData.role !== "Retail" && (
<SubMenu <SubMenu
key="payback-main" key="payback-main"
icon={<ProfileOutlined />} icon={<ProfileOutlined />}

28
src/pages/App/MenuList.js
View File

@ -15,7 +15,7 @@ import {
SlackOutlined, SlackOutlined,
CodepenOutlined, CodepenOutlined,
WindowsOutlined, WindowsOutlined,
AliyunOutlined AliyunOutlined,
} from "@ant-design/icons"; } from "@ant-design/icons";
import { observer } from "mobx-react-lite"; import { observer } from "mobx-react-lite";
import { useStore } from "../../utils/useStore"; import { useStore } from "../../utils/useStore";
@ -48,16 +48,23 @@ export const MenuList = observer((props) => {
overflowedIndicator={0} overflowedIndicator={0}
forceSubMenuRender={true} forceSubMenuRender={true}
> >
{store.authentication.userData.role === "Admin" && ( {/* {store.authentication.userData.role === "Admin" && ( */}
<Menu.Item key="home"> <Menu.Item key="home">
<Link to={LINKS.HOME}> <Link to={LINKS.HOME}>
<HomeOutlined /> <HomeOutlined />
<span>Beranda</span> <span>Beranda</span>
</Link> </Link>
</Menu.Item> </Menu.Item>
{/* )} */}
{store.authentication.userData.role === "Admin" && (
<Menu.Item key="membership">
<Link to={LINKS.MEMBERSHIP}>
<FileProtectOutlined />
<span>Keanggotaan</span>
</Link>
</Menu.Item>
)} )}
{store.authentication.userData.role !== "Retail" && {store.authentication.userData.role === "Supervisor" && (
store.authentication.userData.role !== "Admin Partner" && (
<Menu.Item key="membership"> <Menu.Item key="membership">
<Link to={LINKS.MEMBERSHIP}> <Link to={LINKS.MEMBERSHIP}>
<FileProtectOutlined /> <FileProtectOutlined />
@ -129,15 +136,22 @@ export const MenuList = observer((props) => {
</Link> </Link>
</Menu.Item> </Menu.Item>
)} )}
{store.authentication.userData.role === "Retail" || {store.authentication.userData.role === "Admin Partner" && (
(store.authentication.userData.role === "Admin Partner" && (
<Menu.Item key="transaction"> <Menu.Item key="transaction">
<Link to={LINKS.TRANSACTION}> <Link to={LINKS.TRANSACTION}>
<ShoppingCartOutlined /> <ShoppingCartOutlined />
<span>Transaksi</span> <span>Transaksi</span>
</Link> </Link>
</Menu.Item> </Menu.Item>
))} )}
{store.authentication.userData.role === "Retail" && (
<Menu.Item key="transaction">
<Link to={LINKS.TRANSACTION}>
<ShoppingCartOutlined />
<span>Transaksi</span>
</Link>
</Menu.Item>
)}
{store.authentication.userData.role !== "Retail" && {store.authentication.userData.role !== "Retail" &&
store.authentication.userData.role !== "Admin Partner" && ( store.authentication.userData.role !== "Admin Partner" && (
<SubMenu <SubMenu

6
src/pages/Membership/Membership.js
View File

@ -104,15 +104,15 @@ export const Membership = observer(() => {
: (response = await store.transaction.distribute(data)); : (response = await store.transaction.distribute(data));
response?.body?.statusCode === 201 response?.body?.statusCode === 201
? message.success("Success Top Up") ? message.success("Sukses Top Up")
: message.error("Failed Top Up"); : message.error("Saldo Tidak Mencukupi");
modalLoader.setLoading(false); modalLoader.setLoading(false);
await getData(); await getData();
} catch (e) { } catch (e) {
console.log(e, "apa errornya"); console.log(e, "apa errornya");
modalLoader.setLoading(false); modalLoader.setLoading(false);
message.error("Failed Top Up"); message.error("Gagal Top Up");
} }
setConfirmLoading(false); setConfirmLoading(false);
setIsVisibleTopUpModal(false); setIsVisibleTopUpModal(false);

23
src/pages/Membership/MembershipModal.js
View File

@ -1,5 +1,5 @@
import React from "react"; import React, { useState } from "react";
import {Form, Input, Modal, Select} from "antd"; import { Form, Input, Modal, Select, InputNumber } from "antd";
import { useStore } from "../../utils/useStore"; import { useStore } from "../../utils/useStore";
export const MembershipModal = ({ export const MembershipModal = ({
@ -11,6 +11,7 @@ export const MembershipModal = ({
const [form] = Form.useForm(); const [form] = Form.useForm();
const { Option } = Select; const { Option } = Select;
const store = useStore(); const store = useStore();
const [value, setValue] = useState();
return ( return (
<Modal <Modal
@ -80,9 +81,23 @@ export const MembershipModal = ({
<Form.Item <Form.Item
name="phone_number" name="phone_number"
label="Phone Number" label="Phone Number"
rules={[{required: true, message: "Please input Phone Number!"}]} rules={[
{ required: true, message: "Please input Phone Number!" },
{
pattern: /^(?:\d*)$/,
message: "Value should contain just number",
},
{
pattern: /^[\d]{0,12}$/,
message: "Value should be less than 12 character",
},
]}
> >
<Input/> <Input
onChange={(value) => {
setValue(value);
}}
/>
</Form.Item> </Form.Item>
)} )}
{((initialData.id && !initialData.isChangePassword) || {((initialData.id && !initialData.isChangePassword) ||

81
src/pages/Payback/Payback.js
View File

@ -175,7 +175,7 @@ export const Payback = observer(() => {
modalLoader.setLoading(true); modalLoader.setLoading(true);
try { try {
const response = await store.payback.confirmPayback(id, type); const response = await store.payback.confirmPayback(id, type);
console.log(response) console.log(response);
response.body.statusCode !== 201 && response.body.statusCode !== 200 response.body.statusCode !== 201 && response.body.statusCode !== 200
? message.error( ? message.error(
response?.body?.message || `Failed ${capitalize(type)} Payback` response?.body?.message || `Failed ${capitalize(type)} Payback`
@ -288,7 +288,79 @@ export const Payback = observer(() => {
title={item.name} title={item.name}
description={ description={
<div style={{}}> <div style={{}}>
<Image src={item.picture} preview={false} /> <p>
<span>{item.userData_name}</span>
<br />
<small>Amount: {item.amount}</small>
<br />
{PAYBACK_STATUS[item.status] ===
PAYBACK_STATUS[0] ? (
<Space size="middle">
<Button
onClick={async () => {
Modal.confirm({
title: `Are you sure Accept this submission?`,
icon: <CheckOutlined />,
okText: "Accept",
cancelText: "Cancel",
okType: "primary",
onOk() {
handleAction(item.id, "accept");
},
onCancel() {
console.log("Cancel");
},
});
}}
icon={<CheckCircleOutlined />}
style={{
backgroundColor: "#1bb91d",
color: "#fff",
borderColor: "#1bb91d",
}}
>
Accept
</Button>
<Button
onClick={async () => {
Modal.confirm({
title: `Are you sure Reject this submission?`,
icon: <StopOutlined />,
okText: "Reject",
cancelText: "Cancel",
okType: "primary",
onOk() {
handleAction(item.id, "reject");
},
onCancel() {
console.log("Cancel");
},
});
}}
icon={<CloseOutlined />}
style={{
backgroundColor: "#ff1c1c",
color: "#fff",
borderColor: "#ff1c1c",
}}
>
Reject
</Button>
</Space>
) : (
<Tag
color={
PAYBACK_STATUS[item.status] ===
PAYBACK_STATUS[3]
? "cyan"
: "red"
}
style={{ color: "#4F566B" }}
>
{PAYBACK_STATUS[item.status]}
</Tag>
)}
</p>
</div> </div>
} }
/> />
@ -299,7 +371,10 @@ export const Payback = observer(() => {
margin: 0, margin: 0,
}} }}
> >
{item.amount} <Image
src={`${appConfig.apiUrl}/config/image/${item.image_prove}`}
style={{ width: "10vw" }}
/>
</p> </p>
</div> </div>
</List.Item> </List.Item>