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

Merge branch 'develop' into 'main'

Browse Source 
Develop

See merge request empatnusabangsa/ppob/ppob-frontend!132
This commit is contained in:
ilham dwi pratama 2022-02-04 12:02:50 +00:00
commit 80e1e5bf7b
27 changed files with 1165 additions and 540 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/component/CategoryComponent.js
View File

@ -8,7 +8,7 @@ import {
Space,
Table,
List,
Divider
Divider,
} from "antd";
import { observer } from "mobx-react-lite";
import { useHistory } from "react-router-dom";
@ -40,12 +40,12 @@ export const CategoryComponent = observer((props) => {
key: "code",
},
{
title: "Category Name",
title: "Kategori",
dataIndex: "name",
key: "name",
},
{
title: "Action",
title: "Tindakan",
key: "action",
render: (text, record) => (
<Space size="middle">
@ -55,6 +55,8 @@ export const CategoryComponent = observer((props) => {
},
];
if (store.authentication.userData.role === "Customer Service") columns.pop();
const deleteData = async (id) => {
try {
console.log(id);
@ -209,7 +211,7 @@ export const CategoryComponent = observer((props) => {
visible={store.category.visibleModalCategory}
title={idData ? "Edit Category" : "Create a new Category"}
okText={idData ? "Edit" : "Create"}
cancelText="Cancel"
cancelText="Batal"
onCancel={() => {
form.resetFields();
handleCancel();

10
src/component/CommissionComponent.js
View File

@ -23,18 +23,18 @@ export const CommissionComponent = observer((props) => {
const columns = [
{
title: "Name",
title: "Nama",
dataIndex: "name",
key: "name",
},
{
title: "Amount",
title: "Nominal",
dataIndex: "commission",
key: "commission",
render: (text) => <span>{text}%</span>,
},
{
title: "Action",
title: "Tindakan",
key: "action",
render: (text, record) => (
<Space size="middle">
@ -44,6 +44,8 @@ export const CommissionComponent = observer((props) => {
},
];
if (store.authentication.userData.role === "Customer Service") columns.pop();
const handleCancel = () => {
setIdData("");
store.commission.visibleModalCommission = false;
@ -93,7 +95,7 @@ export const CommissionComponent = observer((props) => {
visible={store.commission.visibleModalCommission}
title={"Edit Commission"}
okText={"Edit"}
cancelText="Cancel"
cancelText="Batal"
onCancel={() => {
form.resetFields();
handleCancel();

18
src/component/PartnerComponent.js
View File

@ -71,7 +71,7 @@ export const PartnerComponent = observer((props) => {
const columns = [
{
title: "Name",
title: "Nama",
dataIndex: "name",
key: "name",
},
@ -86,7 +86,7 @@ export const PartnerComponent = observer((props) => {
key: "npwp",
},
{
title: "Address",
title: "Alamat",
dataIndex: "address",
key: "address",
},
@ -104,7 +104,7 @@ export const PartnerComponent = observer((props) => {
),
},
{
title: "Action",
title: "Tindakan",
key: "action",
render: (text, record) => (
<Space size="middle">
@ -124,6 +124,8 @@ export const PartnerComponent = observer((props) => {
},
];
if (store.authentication.userData.role === "Customer Service") columns.pop();
const deleteData = async (id) => {
try {
modalLoader.setLoading(true);
@ -143,12 +145,12 @@ export const PartnerComponent = observer((props) => {
icon: <ExclamationCircleOutlined />,
okText: "Yes",
okType: "primary",
cancelText: "Cancel",
cancelText: "Batal",
onOk() {
return deleteData(id);
},
onCancel() {
console.log("Cancel");
console.log("Batal");
},
});
};
@ -273,7 +275,7 @@ export const PartnerComponent = observer((props) => {
<div style={{ marginBottom: 10 }}>
<small>Nama : {item.name}</small> <br />
<small>Npwp : {item.npwp}</small> <br />
<small>Address : {item.address}</small>
<small>Alamat : {item.address}</small>
</div>
<Space size="small">
<Button
@ -333,7 +335,7 @@ export const PartnerComponent = observer((props) => {
: "Create a new partner"
}
okText={idData ? "Edit" : "Create"}
cancelText="Cancel"
cancelText="Batal"
onCancel={() => {
form.resetFields();
handleCancel();
@ -450,7 +452,7 @@ export const PartnerComponent = observer((props) => {
</Form.Item>
<Form.Item
name="address"
label="Address"
label="Alamat"
rules={[
idData
? { required: false }

20
src/component/ProductComponent.js
View File

@ -95,7 +95,7 @@ export const ProductComponent = observer((props) => {
key: "supplier_name",
},
{
title: "Sub Category",
title: "Sub Kategori",
dataIndex: "sub_categories_name",
key: "sub_categories_name",
},
@ -113,7 +113,7 @@ export const ProductComponent = observer((props) => {
),
},
{
title: "Action",
title: "Tindakan",
key: "action",
render: (text, record) => (
<Button
@ -156,12 +156,12 @@ export const ProductComponent = observer((props) => {
icon: <ExclamationCircleOutlined />,
okText: "Yes",
okType: "primary",
cancelText: "Cancel",
cancelText: "Batal",
onOk() {
return deleteData(id);
},
onCancel() {
console.log("Cancel");
console.log("Batal");
},
});
};
@ -241,10 +241,10 @@ export const ProductComponent = observer((props) => {
color: "#fff",
}}
>
Remove Filter
Hapus Filter
</Button>,
<Button key={"cancel"} onClick={handleCancelFilter}>
Cancel
Batal
</Button>,
<Button
key={"submit"}
@ -254,7 +254,7 @@ export const ProductComponent = observer((props) => {
color: "#fff",
}}
>
Apply
Terapkan
</Button>,
];
@ -349,8 +349,8 @@ export const ProductComponent = observer((props) => {
<div style={{}}>
<p>
<small>{item.product_name}</small> <br />
<small>Harga Beli : {item.current_price_price}</small>
<br />
{/* <small>Harga Beli : {item.current_price_price}</small>
<br /> */}
<small>Harga Jual : {item.mark_up_price}</small>
</p>
<p></p>
@ -387,7 +387,7 @@ export const ProductComponent = observer((props) => {
visible={store.product.visibleModalProduct}
title={idData ? "Edit Product" : "Create a new Product"}
okText={idData ? "Edit" : "Create"}
cancelText="Cancel"
cancelText="Batal"
onCancel={() => {
form.resetFields();
handleCancel();

12
src/component/SubcategoryComponent.js
View File

@ -42,22 +42,22 @@ export const SubcategoryComponent = observer((props) => {
const columns = [
{
title: "Code",
title: "Kode",
dataIndex: "code",
key: "code",
},
{
title: "Sub Category Name",
title: "Sub Kategori",
dataIndex: "name",
key: "name",
},
{
title: "Category",
title: "Kategori",
dataIndex: "categoryName",
key: "categoryName",
},
{
title: "Action",
title: "Tindakan",
key: "action",
render: (text, record) => (
<Space size="middle">
@ -67,6 +67,8 @@ export const SubcategoryComponent = observer((props) => {
},
];
if (store.authentication.userData.role === "Customer Service") columns.pop();
const handleCancel = () => {
setIdData("");
store.subcategory.visibleModalSubcategory = false;
@ -214,7 +216,7 @@ export const SubcategoryComponent = observer((props) => {
visible={store.subcategory.visibleModalSubcategory}
title={idData ? "Edit Sub Category" : "Create a new sub category"}
okText={idData ? "Edit" : "Create"}
cancelText="Cancel"
cancelText="Batal"
onCancel={() => {
form.resetFields();
handleCancel();

12
src/component/SupplierComponent.js
View File

@ -65,7 +65,7 @@ export const SupplierComponent = observer((props) => {
const columns = [
{
title: "Name",
title: "Nama",
dataIndex: "name",
key: "name",
},
@ -112,7 +112,7 @@ export const SupplierComponent = observer((props) => {
),
},
{
title: "Action",
title: "Tindakan",
key: "action",
width: "20%",
render: (text, record) => (
@ -130,6 +130,8 @@ export const SupplierComponent = observer((props) => {
},
];
if (store.authentication.userData.role === "Customer Service") columns.pop();
const deleteData = async (id) => {
try {
console.log(id);
@ -151,12 +153,12 @@ export const SupplierComponent = observer((props) => {
icon: <ExclamationCircleOutlined />,
okText: "Yes",
okType: "primary",
cancelText: "Cancel",
cancelText: "Batal",
onOk() {
return deleteData(id);
},
onCancel() {
console.log("Cancel");
console.log("Batal");
},
});
};
@ -342,7 +344,7 @@ export const SupplierComponent = observer((props) => {
visible={store.supplier.visibleModalSupplier}
title={idData ? "Edit Supplier" : "Create a new Supplier"}
okText={idData ? "Edit" : "Create"}
cancelText="Cancel"
cancelText="Batal"
onCancel={() => {
form.resetFields();
handleCancel();

4
src/component/TopupsaldoModal.js
View File

@ -34,7 +34,7 @@ export const TopupsaldoModal = observer((props) => {
visible={store.supplier.visibleModalTransaction}
title="Top Up Saldo"
okText="Top Up"
cancelText="Cancel"
cancelText="Batal"
onCancel={() => {
form.resetFields();
handleCancelTransaction();
@ -66,7 +66,7 @@ export const TopupsaldoModal = observer((props) => {
</Form.Item>
<Form.Item
name="amount"
label="Amount"
label="Nominal"
rules={[{ required: true, message: "Please input amount!" }]}
>
<InputNumber

4
src/constants/payback.js
View File

@ -2,6 +2,6 @@ export const PAYBACK_STATUS = {
0: 'Pending',
1: 'Success',
2: 'Failed',
3: 'Approved',
4: 'Rejected',
3: 'Disetujui',
4: 'Ditolak',
}

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

@ -25,7 +25,7 @@ import {
DollarCircleOutlined,
UsergroupAddOutlined,
UnorderedListOutlined,
FormOutlined
FormOutlined,
} from "@ant-design/icons";
import { AppRoute, LINKS } from "../../routes/app";
import { useStore } from "../../utils/useStore";
@ -129,7 +129,8 @@ export const DesktopLayout = observer(() => {
}}
>
<Menu>
{store.authentication.userData.role === "Admin" && (
{(store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service") && (
<Menu.Item key="home">
<Link to={LINKS.HOME}>
<HomeOutlined />
@ -145,7 +146,8 @@ export const DesktopLayout = observer(() => {
</Link>
</Menu.Item>
)}
{store.authentication.userData.role === "Admin" && (
{(store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service") && (
<SubMenu
key="keanggotaan"
icon={<UsergroupAddOutlined />}
@ -154,7 +156,7 @@ export const DesktopLayout = observer(() => {
<Menu.Item key="membership">
<Link to={LINKS.MEMBERSHIP}>
<UnorderedListOutlined />
<span>List Anggota</span>
<span>Daftar Anggota</span>
</Link>
</Menu.Item>
<Menu.Item key="konfirmasi">
@ -174,7 +176,7 @@ export const DesktopLayout = observer(() => {
<Menu.Item key="membership">
<Link to={LINKS.MEMBERSHIP}>
<UnorderedListOutlined />
<span>List Anggota</span>
<span>Daftar Anggota</span>
</Link>
</Menu.Item>
<Menu.Item key="konfirmasi">
@ -201,7 +203,8 @@ export const DesktopLayout = observer(() => {
</Link>
</Menu.Item>
)} */}
{store.authentication.userData.role === "Admin" && (
{(store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service") && (
<SubMenu
key="config"
icon={<SettingOutlined />}
@ -228,7 +231,8 @@ export const DesktopLayout = observer(() => {
</Menu.Item>
</SubMenu>
)}
{store.authentication.userData.role === "Admin" && (
{(store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service") && (
<SubMenu
key="product-main"
icon={<PieChartOutlined />}

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

@ -56,7 +56,8 @@ export const MenuList = observer((props) => {
overflowedIndicator={0}
forceSubMenuRender={true}
>
{store.authentication.userData.role === "Admin" && (
{(store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service") && (
<Menu.Item key="home">
<Link to={LINKS.HOME}>
<HomeOutlined />
@ -72,7 +73,8 @@ export const MenuList = observer((props) => {
</Link>
</Menu.Item>
)}
{store.authentication.userData.role === "Admin" && (
{(store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service") && (
<SubMenu
key="keanggotaan"
icon={<UsergroupAddOutlined />}
@ -81,7 +83,7 @@ export const MenuList = observer((props) => {
<Menu.Item key="membership">
<Link to={LINKS.MEMBERSHIP}>
<UnorderedListOutlined />
<span>List Anggota</span>
<span>Daftar Anggota</span>
</Link>
</Menu.Item>
<Menu.Item key="konfirmasi">
@ -101,7 +103,7 @@ export const MenuList = observer((props) => {
<Menu.Item key="membership">
<Link to={LINKS.MEMBERSHIP}>
<UnorderedListOutlined />
<span>List Anggota</span>
<span>Daftar Anggota</span>
</Link>
</Menu.Item>
<Menu.Item key="konfirmasi">
@ -121,7 +123,7 @@ export const MenuList = observer((props) => {
<Menu.Item key="membership">
<Link to={LINKS.MEMBERSHIP}>
<UnorderedListOutlined />
<span>List Anggota</span>
<span>Daftar Anggota</span>
</Link>
</Menu.Item>
</SubMenu>
@ -142,7 +144,8 @@ export const MenuList = observer((props) => {
</Link>
</Menu.Item>
)}
{store.authentication.userData.role === "Admin" && (
{(store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service") && (
<SubMenu key="config" icon={<SettingOutlined />} title="Config">
<Menu.Item key="partner">
<Link to={LINKS.PARTNER}>
@ -164,7 +167,8 @@ export const MenuList = observer((props) => {
</Menu.Item>
</SubMenu>
)}
{store.authentication.userData.role === "Admin" && (
{(store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service") && (
<SubMenu
key="product-main"
icon={<AppstoreAddOutlined />}
@ -176,22 +180,20 @@ export const MenuList = observer((props) => {
<span>Produk</span>
</Link>
</Menu.Item>
{store.authentication.userData.role === "Admin" && (
<Menu.Item key="sub-category">
<Link to={LINKS.SUBCATEGORY}>
<FileSyncOutlined />
<span>Sub Kategori</span>
</Link>
</Menu.Item>
)}
{store.authentication.userData.role === "Admin" && (
<Menu.Item key="category">
<Link to={LINKS.CATEGORY}>
<FileAddOutlined />
<span>Kategori</span>
</Link>
</Menu.Item>
)}
</SubMenu>
)}
{store.authentication.userData.role === "Admin Partner" && (

10
src/pages/Config/Partner.js
View File

@ -1,6 +1,6 @@
import React, { useContext, useEffect, useState } from "react";
import { Button, Card, Col, Input, Row, Tabs, message } from "antd";
import {FilterOutlined, PlusSquareOutlined,} from "@ant-design/icons";
import { FilterOutlined, PlusSquareOutlined } from "@ant-design/icons";
import { BreadcumbComponent } from "../../component/BreadcumbComponent";
import { useStore } from "../../utils/useStore";
import { observer } from "mobx-react-lite";
@ -40,7 +40,7 @@ export const Partner = observer(() => {
},
{
route: LINKS.PARTNER,
name: <span style={{fontWeight: 'bold'}}>Rekanan</span>,
name: <span style={{ fontWeight: "bold" }}>Rekanan</span>,
},
];
@ -64,9 +64,13 @@ export const Partner = observer(() => {
marginBottom: store.ui.mediaQuery.isMobile ? 10 : 0,
}}
/> */}
<Button onClick={() => store.partner.visibleModalPartner = true}>
{store.authentication.userData.role !== "Customer Service" && (
<Button
onClick={() => (store.partner.visibleModalPartner = true)}
>
<PlusSquareOutlined /> New
</Button>
)}
</Col>
</Row>
<PartnerComponent />

2
src/pages/Config/Supplier.js
View File

@ -80,11 +80,13 @@ export const Supplier = observer(() => {
}}
onSearch={(value) => console.log(value)}
/> */}
{store.authentication.userData.role !== "Customer Service" && (
<Button
onClick={() => (store.supplier.visibleModalSupplier = true)}
>
<PlusSquareOutlined /> New
</Button>
)}
</Col>
</Row>
<SupplierComponent />

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

@ -52,7 +52,8 @@ export const Home = observer(() => {
return (
<div>
{store.ui.mediaQuery.isDesktop &&
store.authentication.userData.role === "Admin" && (
(store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service") && (
<Row
style={{
marginTop: 30,
@ -282,7 +283,8 @@ export const Home = observer(() => {
</Row>
)}
{store.ui.mediaQuery.isMobile &&
store.authentication.userData.role === "Admin" && (
(store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service") && (
<Row
style={{
marginTop: 20,

171
src/pages/Membership/DetailUser.js
View File

@ -42,6 +42,7 @@ export const DetailUser = observer(() => {
const [filterStart, setFilterStart] = useState([]);
const [filterEnd, setFilterEnd] = useState([]);
const [visibleHis, setVisibleHis] = useState(true);
const [actionFilter, setAction] = useState(false);
useEffect(() => {
(async () => {
@ -161,7 +162,12 @@ export const DetailUser = observer(() => {
};
const columns = [
{
title: "Amount",
title: "Pengirim",
dataIndex: "sender_name",
key: "sender_name",
},
{
title: "Nominal",
dataIndex: "amount",
key: "amount",
render: (text) =>
@ -171,7 +177,7 @@ export const DetailUser = observer(() => {
}).format(text),
},
{
title: "Transaction Date",
title: "Tanggal Transaksi",
dataIndex: "transaction_date",
key: "transaction_date",
render: (text, record) => {
@ -191,7 +197,7 @@ export const DetailUser = observer(() => {
key: "name",
},
{
title: "Price",
title: "Harga",
dataIndex: "price",
key: "price",
render: (text) =>
@ -321,19 +327,31 @@ export const DetailUser = observer(() => {
form.resetFields();
setFilterStart([]);
setFilterEnd([]);
await store.transaction.getDetailHistoryTransaction(
actionFilter === true
? await store.transaction.getDataHistoryTopUp(id)
: await store.transaction.getDetailHistoryTransaction(
store.authentication.dataProfit.id
);
// await store.transaction.getDetailHistoryTransaction(
// store.authentication.dataProfit.id
// );
store.transaction.visibleModalFilterTransaction = false;
setAction(false);
};
const handleCancelFilter = async () => {
store.transaction.filterStart = null;
store.transaction.filterEnd = null;
store.transaction.visibleModalFilterTransaction = false;
await store.transaction.getDetailHistoryTransaction(
actionFilter === true
? await store.transaction.getDataHistoryTopUp(id)
: await store.transaction.getDetailHistoryTransaction(
store.authentication.dataProfit.id
);
// await store.transaction.getDetailHistoryTransaction(
// store.authentication.dataProfit.id
// );
setAction(false);
};
const handleSubmitFilter = async () => {
@ -345,13 +363,16 @@ export const DetailUser = observer(() => {
"YYYY-MM-DD HH:mm:ss"
);
modalLoader.setLoading(true);
await store.transaction.getDetailHistoryTransaction(
actionFilter === true
? await store.transaction.getDataHistoryTopUp(id)
: await store.transaction.getDetailHistoryTransaction(
store.authentication.dataProfit.id
);
modalLoader.setLoading(false);
store.transaction.filterStart = null;
store.transaction.filterEnd = null;
store.transaction.visibleModalFilterTransaction = false;
setAction(false);
};
const footerLayoutFilter = [
<Button
@ -362,10 +383,10 @@ export const DetailUser = observer(() => {
color: "#fff",
}}
>
Remove Filter
Hapus Filter
</Button>,
<Button key={"cancel"} onClick={handleCancelFilter}>
Cancel
Batal
</Button>,
<Button
key={"submit"}
@ -375,7 +396,7 @@ export const DetailUser = observer(() => {
color: "#fff",
}}
>
Apply
Terapkan
</Button>,
];
return (
@ -391,8 +412,8 @@ export const DetailUser = observer(() => {
Detail User
</Title>
<Col
lg={store.authentication.userData.role === "Admin" ? 18 : 17}
xs={store.authentication.userData.role === "Admin" ? 18 : 17}
lg={store.authentication.userData.role === "Admin" ? 18 : 13}
xs={store.authentication.userData.role === "Admin" ? 18 : 13}
style={{ textAlign: "right" }}
>
<Space
@ -401,6 +422,8 @@ export const DetailUser = observer(() => {
wrap={true}
style={{ textAlign: "center" }}
>
{store.authentication.userData.role === "Admin" && (
<Space>
<Button
type={
store.membership.dataDetail.is_active === true
@ -425,9 +448,11 @@ export const DetailUser = observer(() => {
name: store.membership.dataDetail.userDetail.name,
username: store.membership.dataDetail.username,
identity_number:
store.membership.dataDetail.userDetail.identity_number,
store.membership.dataDetail.userDetail
.identity_number,
image_identity:
store.membership.dataDetail?.userDetail.image_identity,
store.membership.dataDetail?.userDetail
.image_identity,
image_store:
store.membership.dataDetail?.userDetail.image_store,
phone_number:
@ -468,6 +493,8 @@ export const DetailUser = observer(() => {
>
Ganti Password
</Button>
</Space>
)}
{((store.authentication.userData.role === "Sales" &&
store.membership.dataDetail.is_rejected === true &&
store.membership.dataDetail.is_active === false) ||
@ -509,12 +536,12 @@ export const DetailUser = observer(() => {
<Col span={12}>
<Text>{store.authentication.dataProfit.username}</Text>
</Col>
<Col span={12}>
{/* <Col span={12}>
<Text strong>Role</Text>
</Col>
<Col span={12}>
<Text>{store.authentication.dataProfit.roles?.name}</Text>
</Col>
</Col> */}
<Col span={12}>
<Text strong>Phone Number</Text>
</Col>
@ -537,8 +564,8 @@ export const DetailUser = observer(() => {
<Col span={12}>
<Text>
{store.authentication.dataProfit.is_active === true
? "Active"
: "Inactive"}
? "Aktif"
: "Inaktif"}
</Text>
</Col>
{store.authentication.userData.role === "Admin" &&
@ -558,7 +585,7 @@ export const DetailUser = observer(() => {
? `${appConfig.apiUrl}/config/image/${store.authentication.dataProfit.userDetail?.image_identity}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
}
style={{ width: "10vw" }}
style={{ width: "8vw" }}
/>
</Text>
</Col>
@ -578,7 +605,7 @@ export const DetailUser = observer(() => {
? `${appConfig.apiUrl}/config/image/${item}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
}
style={{ width: "10vw", marginRight: 15 }}
style={{ width: "8vw", marginRight: 10 }}
/>
)
)
@ -683,7 +710,7 @@ export const DetailUser = observer(() => {
<Row justify={"center"}>
<Col lg={12} xs={12}>
<Title strong level={3} style={styleSaldoTitle}>
Profit
Keuntungan
</Title>
</Col>
<Col lg={24} xs={12}>
@ -707,7 +734,19 @@ export const DetailUser = observer(() => {
<Row>
<Col span={24}>
<Tabs defaultActiveKey="1">
<TabPane tab="History Top Up" key="1">
<TabPane tab="Riwayat Top Up" key="1">
{store.ui.mediaQuery.isDesktop && (
<div>
<Button
style={{ marginBottom: "1rem", marginLeft: 5 }}
onClick={() => {
store.transaction.visibleModalFilterTransaction = true;
setAction(true);
}}
>
<FilterOutlined />
Filter
</Button>
<Table
key="1"
hasEmpty
@ -730,8 +769,89 @@ export const DetailUser = observer(() => {
modalLoader.setLoading(false);
}}
/>
</div>
)}
{store.ui.mediaQuery.isMobile && (
<div>
<Button
style={{ marginBottom: "1rem" }}
onClick={() => {
store.transaction.visibleModalFilterTransaction = true;
setAction(true);
}}
>
<FilterOutlined />
Filter
</Button>
<List
itemLayout="horizontal"
position={"top"}
pagination={{
onChange: async (page, pageSize) => {
store.transaction.pageSize = pageSize;
store.transaction.page = page - 1;
modalLoader.setLoading(true);
await getData();
modalLoader.setLoading(false);
},
pageSize: store.transaction.pageSize,
total: store.transaction.total_data,
current: store.transaction.page + 1,
style: { marginBottom: "1rem", marginRight: "1rem" },
}}
dataSource={store.transaction.dataHistoryTopUp}
style={{ padding: 0 }}
renderItem={(item) => {
return (
<div>
<List.Item
key={item.id}
style={{
backgroundColor: "#ffffff",
paddingTop: 0,
paddingBottom: 0,
display: "flex",
flexDirection: "row",
alignItems: "center",
justifyContent: "center",
}}
>
<List.Item.Meta
className={["cariparkir-container"].join(" ")}
title={item.sender_name}
description={
<div style={{}}>
<p>
<small>
Amount :{" "}
{new Intl.NumberFormat("id-ID", {
style: "currency",
currency: "IDR",
}).format(item.amount || 0)}
</small>{" "}
<br />
<small>
Transaction Date :{" "}
{format(
parseISO(item.transaction_date),
"dd-MM-yyyy hh:mm:ss"
)}
</small>{" "}
<br />
</p>
</div>
}
/>
</List.Item>
<Divider plain style={{ margin: 0 }} />
</div>
);
}}
/>
</div>
)}
</TabPane>
<TabPane tab="History Transaction" key="2">
<TabPane tab="Riwayat Transaksi" key="2">
{store.ui.mediaQuery.isDesktop && (
<div>
<Button
@ -911,7 +1031,12 @@ export const DetailUser = observer(() => {
store.transaction.filterStart = null;
store.transaction.filterEnd = null;
store.transaction.visibleModalFilterTransaction = false;
await store.transaction.getDetailHistoryTransaction();
actionFilter === true
? await store.transaction.getDataHistoryTopUp(id)
: await store.transaction.getDetailHistoryTransaction(
store.authentication.dataProfit.id
);
//await store.transaction.getDetailHistoryTransaction();
}}
>
<Row>

24
src/pages/Membership/Konfirmasi.js
View File

@ -72,7 +72,7 @@ export const Konfirmasi = observer(() => {
const columns = [
{
title: "Name",
title: "Nama",
dataIndex: "username",
key: "username",
},
@ -98,8 +98,8 @@ export const Konfirmasi = observer(() => {
title: "Foto Toko",
render: (text, record) =>
record.roles?.name !== "Sales" &&
record.user_detail?.image_store !== "[]" &&
record.user_detail?.image_store !== '""' ? (
(record.user_detail?.image_store !== "[]" ||
record.user_detail?.image_store !== '""') ? (
<Button
onClick={async () => {
setToko(record);
@ -113,7 +113,7 @@ export const Konfirmasi = observer(() => {
),
},
{
title: "Action",
title: "Tindakan",
dataIndex: "amount",
key: "action",
width: "10%",
@ -126,14 +126,14 @@ export const Konfirmasi = observer(() => {
title: `Are you sure Accept this submission?`,
icon: <CheckOutlined />,
okText: "Accept",
cancelText: "Cancel",
cancelText: "Batal",
okType: "primary",
onOk() {
handleApprove(record.id);
console.log(record.id);
},
onCancel() {
console.log("Cancel");
console.log("Batal");
},
});
}}
@ -152,13 +152,13 @@ export const Konfirmasi = observer(() => {
title: `Are you sure Reject this submission?`,
icon: <StopOutlined />,
okText: "Reject",
cancelText: "Cancel",
cancelText: "Batal",
okType: "primary",
onOk() {
handleReject(record.id);
},
onCancel() {
console.log("Cancel");
console.log("Batal");
},
});
}}
@ -315,13 +315,13 @@ export const Konfirmasi = observer(() => {
title: `Are you sure Accept this submission?`,
icon: <CheckOutlined />,
okText: "Accept",
cancelText: "Cancel",
cancelText: "Batal",
okType: "primary",
onOk() {
handleApprove(item.id);
},
onCancel() {
console.log("Cancel");
console.log("Batal");
},
});
}}
@ -340,13 +340,13 @@ export const Konfirmasi = observer(() => {
title: `Are you sure Reject this submission?`,
icon: <StopOutlined />,
okText: "Reject",
cancelText: "Cancel",
cancelText: "Batal",
okType: "primary",
onOk() {
handleReject(item.id);
},
onCancel() {
console.log("Cancel");
console.log("Batal");
},
});
}}

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

@ -71,7 +71,8 @@ export const Membership = observer(() => {
}, []);
const getData = async () => {
store.authentication.userData.role === "Admin"
store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service"
? await store.membership.getData()
: await store.membership.getDataBySuperior();
};
@ -111,10 +112,10 @@ export const Membership = observer(() => {
color: "#fff",
}}
>
Remove Filter
Hapus Filter
</Button>,
<Button key={"cancel"} onClick={handleCancelFilter}>
Cancel
Batal
</Button>,
<Button
key={"submit"}
@ -124,7 +125,7 @@ export const Membership = observer(() => {
color: "#fff",
}}
>
Apply
Terapkan
</Button>,
];
const handleCancelTransaction = () => {
@ -168,10 +169,10 @@ export const Membership = observer(() => {
const columns = [
{
title: "Name",
title: "Nama",
dataIndex: "name",
key: "name",
render: (text, record) => record?.name ?? record?.username,
render: (text, record) => record?.name ?? record?.user_detail?.name,
},
{
title: "Username",
@ -196,7 +197,7 @@ export const Membership = observer(() => {
}).format(text),
},
{
title: "Action",
title: "Tindakan",
key: "action",
render: (text, record) => (
<Space size="middle">
@ -225,6 +226,7 @@ export const Membership = observer(() => {
},
];
if (store.authentication.userData.role === "Customer Service") columns.pop();
const routeData = [
{
route: LINKS.HOME,
@ -344,6 +346,8 @@ export const Membership = observer(() => {
marginBottom: store.ui.mediaQuery.isMobile ? 10 : 0,
}}
/> */}
{store.authentication.userData.role !== "Customer Service" && (
<Button
onClick={() => {
setInitialData({});
@ -352,6 +356,7 @@ export const Membership = observer(() => {
>
<PlusSquareOutlined /> New
</Button>
)}
</Col>
</Row>
{store.ui.mediaQuery.isDesktop && (
@ -359,16 +364,18 @@ export const Membership = observer(() => {
key="1"
hasEmpty
columns={columns}
style={{ cursor: "pointer" }}
//style={{ cursor: "pointer" }}
dataSource={
store.authentication.userData.role === "Admin"
store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service"
? store.membership.dataMember
: store.membership.data
}
pagination={{
pageSize: store.membership.pageSize,
total:
store.authentication.userData.role === "Admin"
store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service"
? store.membership.dataTotal
: store.membership.total_data,
current: store.membership.page + 1,
@ -401,14 +408,16 @@ export const Membership = observer(() => {
},
pageSize: store.membership.pageSize,
total:
store.authentication.userData.role === "Admin"
store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service"
? store.membership.dataTotal
: store.membership.total_data,
current: store.membership.page + 1,
style: { marginBottom: "1rem", marginRight: "1rem" },
}}
dataSource={
store.authentication.userData.role === "Admin"
store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Customer Service"
? store.membership.dataMember
: store.membership.data
}
@ -496,7 +505,7 @@ export const Membership = observer(() => {
visible={isVisibleTopUpModal}
title="Top Up Saldo"
okText="Top Up"
cancelText="Cancel"
cancelText="Batal"
onCancel={() => {
form.resetFields();
handleCancelTransaction();
@ -517,7 +526,7 @@ export const Membership = observer(() => {
<Form form={form} layout="vertical">
<Form.Item
name="amount"
label="Amount"
label="Nominal"
rules={[{ required: true, message: "Please input amount!" }]}
>
<InputNumber

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

@ -195,7 +195,7 @@ export const MembershipModal = ({
: "Create a new Membership"
}
okText={initialData.id ? "Edit" : "Create"}
cancelText="Cancel"
cancelText="Batal"
onCancel={() => {
form.resetFields();
onCancel();

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

@ -67,12 +67,12 @@ export const Payback = observer(() => {
const columns = [
{
title: "Name",
title: "Nama",
dataIndex: "userData_name",
key: "userData_name",
},
{
title: "Picture",
title: "Gambar",
dataIndex: "image_prove",
key: "image_prove",
render: (text, record) => (
@ -84,7 +84,7 @@ export const Payback = observer(() => {
),
},
{
title: "Amount",
title: "Nominal",
dataIndex: "amount",
key: "amount",
width: "20%",
@ -95,7 +95,7 @@ export const Payback = observer(() => {
}).format(text),
},
{
title: "Action",
title: "Tindakan",
dataIndex: "amount",
key: "action",
width: "10%",
@ -108,13 +108,13 @@ export const Payback = observer(() => {
title: `Are you sure Accept this submission?`,
icon: <CheckOutlined />,
okText: "Accept",
cancelText: "Cancel",
cancelText: "Batal",
okType: "primary",
onOk() {
handleAction(record.id, "accept");
},
onCancel() {
console.log("Cancel");
console.log("Batal");
},
});
}}
@ -133,13 +133,13 @@ export const Payback = observer(() => {
title: `Are you sure Reject this submission?`,
icon: <StopOutlined />,
okText: "Reject",
cancelText: "Cancel",
cancelText: "Batal",
okType: "primary",
onOk() {
handleAction(record.id, "reject");
},
onCancel() {
console.log("Cancel");
console.log("Batal");
},
});
}}
@ -254,10 +254,10 @@ export const Payback = observer(() => {
color: "#fff",
}}
>
Remove Filter
Hapus Filter
</Button>,
<Button key={"cancel"} onClick={handleCancelFilter}>
Cancel
Batal
</Button>,
<Button
key={"submit"}
@ -267,7 +267,7 @@ export const Payback = observer(() => {
color: "#fff",
}}
>
Apply
Terapkan
</Button>,
];
return (
@ -377,13 +377,13 @@ export const Payback = observer(() => {
title: `Are you sure Accept this submission?`,
icon: <CheckOutlined />,
okText: "Accept",
cancelText: "Cancel",
cancelText: "Batal",
okType: "primary",
onOk() {
handleAction(item.id, "accept");
},
onCancel() {
console.log("Cancel");
console.log("Batal");
},
});
}}
@ -402,13 +402,13 @@ export const Payback = observer(() => {
title: `Are you sure Reject this submission?`,
icon: <StopOutlined />,
okText: "Reject",
cancelText: "Cancel",
cancelText: "Batal",
okType: "primary",
onOk() {
handleAction(item.id, "reject");
},
onCancel() {
console.log("Cancel");
console.log("Batal");
},
});
}}
@ -478,7 +478,7 @@ export const Payback = observer(() => {
<Row>
<Col span={24}>
<Title level={5} type={"secondary"} strong>
Sender
Pengirim
</Title>
<Form layout="vertical" name="filter" form={form}>
<Select
@ -498,14 +498,14 @@ export const Payback = observer(() => {
</Select>
<Form.Item
name="start_date"
label="Dari"
label="Dari Tanggal"
rules={[{ required: true, message: "Please input Date!" }]}
>
<DatePicker style={{ width: "100%" }}/>
</Form.Item>
<Form.Item
name="end_date"
label="Sampai"
label="Sampai Tanggal"
rules={[{ required: true, message: "Please input Date!" }]}
>
<DatePicker style={{ width: "100%" }} />

12
src/pages/Payback/PaybackCreated.js
View File

@ -56,7 +56,7 @@ export const PaybackCreated = observer(() => {
const columns = [
{
title: "Picture",
title: "Gambar",
dataIndex: "image_prove",
key: "image_prove",
render: (text, record) => (
@ -68,7 +68,7 @@ export const PaybackCreated = observer(() => {
),
},
{
title: "Amount",
title: "Nominal",
dataIndex: "amount",
key: "amount",
render: (text) =>
@ -103,8 +103,8 @@ export const PaybackCreated = observer(() => {
: record.status === 2
? "Failed"
: record.status === 3
? "Approved"
: "Rejected"}
? "Disetujui"
: "Ditolak"}
</Tag>
),
},
@ -313,8 +313,8 @@ export const PaybackCreated = observer(() => {
: item.status === 2
? "Failed"
: item.status === 3
? "Approved"
: "Rejected"}
? "Disetujui"
: "Ditolak"}
</Tag>
</div>
</div>

4
src/pages/Payback/PaybackModal.js
View File

@ -100,7 +100,7 @@ export const PaybackModal = ({ initialData }) => {
visible={store.payback.visibleModalPayback}
title={"Create a new Created"}
okText={"Create"}
cancelText="Cancel"
cancelText="Batal"
onCancel={handleCancel}
onOk={() => {
form
@ -120,7 +120,7 @@ export const PaybackModal = ({ initialData }) => {
name="form_in_modal"
initialValues={initialData}
>
<Form.Item label="Upload Picture" name="image_prove">
<Form.Item label="Upload Gambar" name="image_prove">
<div>
<Upload
listType="picture-card"

3
src/pages/Product/Category.js
View File

@ -8,7 +8,6 @@ import {LINKS} from "../../routes/app";
import { CategoryComponent } from "../../component/CategoryComponent";
import { ModalLoaderContext } from "../../utils/modal";
export const Category = observer(() => {
const store = useStore();
const modalLoader = useContext(ModalLoaderContext);
@ -49,11 +48,13 @@ export const Category = observer(() => {
<Card>
<Row style={{ marginBottom: 20 }}>
<Col span={24} style={{ textAlign: "right" }}>
{store.authentication.userData.role !== "Customer Service" && (
<Button
onClick={() => (store.category.visibleModalCategory = true)}
>
<PlusSquareOutlined /> New
</Button>
)}
</Col>
</Row>

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

@ -250,7 +250,7 @@ export const Product = observer(() => {
visible={visibleModalUpload}
title={"Upload Excel Product"}
okText={"Create"}
cancelText="Cancel"
cancelText="Batal"
onCancel={() => {
form.resetFields();
handleCancel();

6
src/pages/Product/Subcategory.js
View File

@ -55,11 +55,15 @@ export const Subcategory = observer(() => {
<Card>
<Row style={{ marginBottom: 20 }}>
<Col span={24} style={{ textAlign: "right" }}>
{store.authentication.userData.role !== "Customer Service" && (
<Button
onClick={() => (store.subcategory.visibleModalSubcategory = true)}
onClick={() =>
(store.subcategory.visibleModalSubcategory = true)
}
>
<PlusSquareOutlined /> New
</Button>
)}
</Col>
</Row>
<SubcategoryComponent />

243
src/pages/Profile/Profile.js
View File

@ -14,6 +14,7 @@ import {
List,
Image,
Tag,
Tabs,
} from "antd";
import moment from "moment";
import { BreadcumbComponent } from "../../component/BreadcumbComponent";
@ -23,17 +24,19 @@ import { observer } from "mobx-react-lite";
import { FilterOutlined } from "@ant-design/icons";
import { format, parseISO } from "date-fns";
import { appConfig } from "../../config/app";
import { ModalLoaderContext } from "../../utils/modal";
import { useParams } from "react-router-dom";
const { TabPane } = Tabs;
const { Title, Text } = Typography;
const { RangePicker } = DatePicker;
export const Profile = observer(() => {
const store = useStore();
const [form] = Form.useForm();
const { id } = useParams();
const modalLoader = useContext(ModalLoaderContext);
const [filterStart, setFilterStart] = useState([]);
const [filterEnd, setFilterEnd] = useState([]);
const [actionFilter, setAction] = useState(false);
const routeData = [
{
@ -56,10 +59,14 @@ export const Profile = observer(() => {
useEffect(() => {
(async () => {
modalLoader.setLoading(true);
await Promise.allSettled([
store.authentication.getProfile(),
store.transaction.getDataHistoryTransaction(),
]);
await store.transaction.getDataHistoryTopUpProfile(
store.authentication.profileData?.id
);
modalLoader.setLoading(false);
})();
}, []);
@ -70,8 +77,14 @@ export const Profile = observer(() => {
form.resetFields();
setFilterStart([]);
setFilterEnd([]);
await store.transaction.getDataHistoryTransaction();
//await store.transaction.getDataHistoryTransaction();
actionFilter === true
? await store.transaction.getDataHistoryTopUpProfile(
store.authentication.profileData?.id
)
: await store.transaction.getDataHistoryTransaction();
store.transaction.visibleModalFilterTransaction = false;
setAction(false);
};
const handleCancelFilter = async () => {
@ -79,24 +92,35 @@ export const Profile = observer(() => {
//form.resetFields();
store.transaction.filterEnd = null;
store.transaction.visibleModalFilterTransaction = false;
await store.transaction.getDataHistoryTransaction();
actionFilter === true
? await store.transaction.getDataHistoryTopUpProfile(
store.authentication.profileData?.id
)
: await store.transaction.getDataHistoryTransaction();
setAction(false);
//await store.transaction.getDataHistoryTransaction();
};
const handleSubmitFilter = async () => {
const data = form.getFieldsValue();
const awal = (store.transaction.filterStart = moment(
data.start_date
).format("YYYY-MM-DD HH:mm:ss"));
const akhir = (store.transaction.filterEnd = moment(data.end_date).format(
store.transaction.filterStart = moment(data.start_date).format(
"YYYY-MM-DD HH:mm:ss"
));
);
store.transaction.filterEnd = moment(data.end_date).format(
"YYYY-MM-DD HH:mm:ss"
);
modalLoader.setLoading(true);
await store.transaction.getDataHistoryTransaction();
actionFilter === true
? await store.transaction.getDataHistoryTopUpProfile(
store.authentication.profileData?.id
)
: await store.transaction.getDataHistoryTransaction();
modalLoader.setLoading(false);
store.transaction.filterStart = null;
store.transaction.filterEnd = null;
//form.resetFields();
store.transaction.visibleModalFilterTransaction = false;
setAction(false);
};
const footerLayoutFilter = [
@ -108,10 +132,10 @@ export const Profile = observer(() => {
color: "#fff",
}}
>
Remove Filter
Hapus Filter
</Button>,
<Button key={"cancel"} onClick={handleCancelFilter}>
Cancel
Batal
</Button>,
<Button
key={"submit"}
@ -121,17 +145,17 @@ export const Profile = observer(() => {
color: "#fff",
}}
>
Apply
Terapkan
</Button>,
];
const columns = [
{
title: "Name Produk",
title: "Nama Produk",
dataIndex: "name",
key: "name",
},
{
title: "Price",
title: "Harga",
dataIndex: "price",
key: "price",
render: (text) =>
@ -172,10 +196,10 @@ export const Profile = observer(() => {
}
>
{record.status === 1
? "Success"
? "Sukses"
: record.status === 0
? "Pending"
: "Failed"}
? "Dalam Proses"
: "Gagal"}
</Tag>
);
},
@ -210,6 +234,35 @@ export const Profile = observer(() => {
},
];
const column = [
{
title: "Pengirim",
dataIndex: "sender_name",
key: "sender_name",
},
{
title: "Nominal",
dataIndex: "amount",
key: "amount",
render: (text) =>
new Intl.NumberFormat("id-ID", {
style: "currency",
currency: "IDR",
}).format(text),
},
{
title: "Tanggal Transaksi",
dataIndex: "transaction_date",
key: "transaction_date",
render: (text, record) => {
return (
<Text>
{format(parseISO(record.transaction_date), "dd MMMM yyyy")}
</Text>
);
},
},
];
const styleSaldoTitle = store.ui.mediaQuery.isDesktop
? {
display: "flex",
@ -240,7 +293,7 @@ export const Profile = observer(() => {
<Col lg={12} xs={24}>
<Row>
<Col span={12}>
<Text strong>Name</Text>
<Text strong>Nama</Text>
</Col>
<Col span={12}>
<Text>
@ -248,7 +301,7 @@ export const Profile = observer(() => {
</Text>
</Col>
<Col span={12}>
<Text strong>Phone Number</Text>
<Text strong>No. Telepon</Text>
</Col>
<Col span={12}>
<Text>
@ -261,14 +314,14 @@ export const Profile = observer(() => {
<Col span={12}>
<Text>{store.authentication.profileData?.username}</Text>
</Col>
<Col span={12}>
{/* <Col span={12}>
<Text strong>Role</Text>
</Col>
<Col span={12}>
<Text>{store.authentication.profileData.roles?.name}</Text>
</Col>
</Col> */}
<Col span={12}>
<Text strong>Superior</Text>
<Text strong>Upline</Text>
</Col>
<Col span={12}>
<Text>
@ -357,12 +410,125 @@ export const Profile = observer(() => {
</Row>
<Row>
<Col span={24}>
<div>
<Title strong level={3}>
History Transaction
</Title>
<Tabs defaultActiveKey="1">
<TabPane tab="Riwayat Top Up" key="1">
<Button
style={{ marginBottom: "1rem" }}
style={{ marginBottom: "1rem", marginLeft: 5 }}
onClick={() => {
store.transaction.visibleModalFilterTransaction = true;
setAction(true);
}}
>
<FilterOutlined />
Filter
</Button>
{store.ui.mediaQuery.isDesktop && (
<Table
key="1"
hasEmpty
columns={column}
dataSource={store.transaction.dataHistoryTopUpProfile}
bordered
pagination={{
pageSize: store.transaction.pageSize,
total: store.transaction.total_dataHistoryTopUpProfile,
current: store.transaction.page + 1,
showSizeChanger: true,
simple: false,
}}
onChange={async (page) => {
let pageNumber = page.current;
store.transaction.pageSize = page.pageSize;
store.transaction.page = pageNumber - 1;
modalLoader.setLoading(true);
await store.transaction.getDataHistoryTopUpProfile(
store.authentication.profileData?.id
);
modalLoader.setLoading(false);
}}
/>
)}
{store.ui.mediaQuery.isMobile && (
<div>
<List
itemLayout="horizontal"
position={"top"}
dataSource={store.transaction.dataHistoryTopUpProfile}
pagination={{
onChange: async (page, pageSize) => {
console.log(page, "Page");
console.log(pageSize, "Page size");
store.transaction.pageSize = pageSize;
store.transaction.page = page - 1;
modalLoader.setLoading(true);
await store.transaction.getDataHistoryTopUpProfile(
store.authentication.profileData?.id
);
modalLoader.setLoading(false);
},
pageSize: store.transaction.pageSize,
total: store.transaction.total_dataHistoryTopUpProfile,
current: store.transaction.page + 1,
style: { marginBottom: "1rem", marginRight: "1rem" },
}}
style={{ padding: 0 }}
renderItem={(item) => {
return (
<div>
<List.Item
key={item.id}
style={{
backgroundColor: "#ffffff",
paddingTop: 0,
paddingBottom: 0,
display: "flex",
flexDirection: "row",
alignItems: "center",
justifyContent: "center",
}}
>
<List.Item.Meta
className={["cariparkir-container"].join(" ")}
title={item.id}
description={
<div style={{}}>
<p>
<small>
Pengirim : {item.sender_name}
</small>{" "}
<br />
<small>
Amount :{" "}
{new Intl.NumberFormat("id-ID", {
style: "currency",
currency: "IDR",
}).format(item.amount || 0)}
</small>{" "}
<br />
<small>
Transaction Date :{" "}
{format(
parseISO(item.transaction_date),
"dd-MM-yyyy"
)}
</small>{" "}
<br />
</p>
</div>
}
/>
</List.Item>
<Divider plain style={{ margin: 0 }} />
</div>
);
}}
/>
</div>
)}
</TabPane>
<TabPane tab="Riwayat Transaksi" key="2">
<Button
style={{ marginBottom: "1rem", marginLeft: 5 }}
onClick={() => {
store.transaction.visibleModalFilterTransaction = true;
}}
@ -396,6 +562,7 @@ export const Profile = observer(() => {
/>
)}
{store.ui.mediaQuery.isMobile && (
<div>
<List
itemLayout="horizontal"
position={"top"}
@ -404,7 +571,8 @@ export const Profile = observer(() => {
onChange: async (page, pageSize) => {
console.log(page, "Page");
console.log(pageSize, "Page size");
store.transaction.pageSizeHistoryTransaction = pageSize;
store.transaction.pageSizeHistoryTransaction =
pageSize;
store.transaction.pageHistoryTransaction = page - 1;
modalLoader.setLoading(true);
await store.transaction.getDataHistoryTransaction();
@ -459,10 +627,10 @@ export const Profile = observer(() => {
}
>
{item.status === 1
? "Success"
? "Sukses"
: item.status === 0
? "Pending"
: "Failed"}
? "Dalam Proses"
: "Gagal"}
</Tag>
}
</small>{" "}
@ -498,11 +666,12 @@ export const Profile = observer(() => {
);
}}
/>
)}
</div>
)}
</TabPane>
</Tabs>
</Col>
</Row>
<div />
</Card>
<Modal
visible={store.transaction.visibleModalFilterTransaction}
@ -513,7 +682,11 @@ export const Profile = observer(() => {
store.transaction.filterStart = null;
store.transaction.filterEnd = null;
store.transaction.visibleModalFilterTransaction = false;
await store.transaction.getDataHistoryTransaction();
actionFilter === true
? await store.transaction.getDataHistoryTopUpProfile(
store.authentication.profileData?.id
)
: await store.transaction.getDataHistoryTransaction();
}}
>
<Row>

20
src/pages/Transaction/Product.js
View File

@ -122,13 +122,13 @@ export const Product = observer(() => {
<div>
<Row>
<span style={{ fontWeight: "bold", marginBottom: "10px" }}>
Sub Category
Jenis Produk
</span>
</Row>
<Row>
<Col span={24}>
<Select
placeholder={"Select Sub Category"}
placeholder={"Pilih Kategori"}
allowClear={true}
onChange={(val) => handleChangeSubcategory(val)}
style={{ marginBottom: "10px", width: "100%" }}
@ -189,7 +189,7 @@ export const Product = observer(() => {
)}
<Modal
visible={visibleModalBuy}
title={`Are you sure buy ${barang?.product_name}?`}
title={`Apakah anda yakin membeli ${barang?.product_name}?`}
okText={"Confirm"}
onCancel={() => {
form.resetFields();
@ -208,10 +208,10 @@ export const Product = observer(() => {
handleCancel();
}}
>
Cancel
Batal
</Button>,
<Button
key="Buy Prod"
key="Beli"
style={{
backgroundColor: "#4e79e7",
color: "#fff",
@ -229,10 +229,10 @@ export const Product = observer(() => {
});
}}
>
Buy Prod
Beli
</Button>,
<Button
key="Buy Stag"
key="Beli Stag"
type="primary"
onClick={() => {
form
@ -247,18 +247,18 @@ export const Product = observer(() => {
});
}}
>
Buy Staging
Beli Staging
</Button>,
]}
>
<Form form={form} layout="vertical">
<Form.Item
name="destination"
label="Destination"
label="Nomor Tujuan"
rules={[
{
required: true,
message: "Please input Destination Number!",
message: "Tolong masukan nomor tujuan!",
},
// {
// pattern: /^(?:\d*)$/,

289
src/pages/Transaction/Transaction.js
View File

@ -10,6 +10,8 @@ import {
Modal,
Row,
DatePicker,
Form,
Input,
} from "antd";
import { BreadcumbComponent } from "../../component/BreadcumbComponent";
import { Product } from "./Product";
@ -24,12 +26,16 @@ export const Transaction = observer(() => {
const { Title } = Typography;
const { Option } = Select;
const modalLoader = useContext(ModalLoaderContext);
const [form] = Form.useForm();
const [visibleModalBuy, setVisibleModalBuy] = useState(false);
const [barang, setBarang] = useState({});
useEffect(() => {
const init = async () => {
try {
modalLoader.setLoading(true);
await store.transaction.getDataCategories();
await store.transaction.getDataSubCategories();
modalLoader.setLoading(false);
} catch (e) {
modalLoader.setLoading(false);
@ -44,22 +50,96 @@ export const Transaction = observer(() => {
init();
}, []);
const handleChangeTabs = async (key) => {
const routeData = [
{
route: LINKS.TRANSACTION,
name: "Transaksi",
},
];
const handleChangeTabs = async (item) => {
modalLoader.setLoading(true);
store.transaction.dataSubCategories = [];
store.transaction.data = [];
store.transaction.filterSubCategory = null;
store.transaction.filterCategory = key;
store.transaction.filterCategory = item;
await store.transaction.getDataSubCategories();
modalLoader.setLoading(false);
};
const routeData = [
{
route: LINKS.TRANSACTION,
name: "Transaksi"
},
];
const handleChangeSubcategory = async (item) => {
store.transaction.filterSubCategory = item;
modalLoader.setLoading(true);
await store.transaction.getData();
modalLoader.setLoading(false);
};
const handleBuyProduct = async (data, productCode) => {
modalLoader.setLoading(true);
try {
const response = await store.transaction.buyProd({
...data,
productCode: productCode,
});
if (response.status === 201) {
message.success(response?.body?.message || "Berhasil Beli Produk");
} else {
message.error(response?.body?.error || "Gagal Beli Produk", 3);
}
} catch (e) {
console.log("testingan");
console.log(e.response, "testingan");
console.log(e.result, "testingan1");
if (e.response?.body?.error) {
message.error(e.response.body.error);
setVisibleModalBuy(false);
modalLoader.setLoading(false);
return;
}
console.log(e, "apa errornya");
message.error("Gagal Beli Product");
}
setVisibleModalBuy(false);
modalLoader.setLoading(false);
};
const handleBuyStag = async (data, productCode) => {
modalLoader.setLoading(true);
try {
const response = await store.transaction.buyProduct({
...data,
productCode: productCode,
});
if (response.status === 201) {
message.success(response?.body?.message || "Berhasil Beli Produk");
} else {
message.error(response?.body?.error || "Gagal Beli Produk", 3);
}
} catch (e) {
console.log("testingan");
console.log(e.response, "testingan");
console.log(e.result, "testingan1");
if (e.response?.body?.error) {
message.error(e.response.body.error);
setVisibleModalBuy(false);
modalLoader.setLoading(false);
return;
}
console.log(e, "apa errornya");
message.error("Gagal Beli Product");
}
// setDataProd(false);
// setDataStag(false);
setVisibleModalBuy(false);
modalLoader.setLoading(false);
};
const handleCancel = () => {
form.resetFields();
setVisibleModalBuy(false);
};
return (
<div className={["ppob-container"].join(" ")}>
@ -75,6 +155,7 @@ export const Transaction = observer(() => {
Filter
</Button> */}
</Col>
{store.ui.mediaQuery.isDesktop && (
<Tabs onChange={handleChangeTabs} size="default" tabBarGutter="50">
{store.transaction.dataCategories.map((item, index) => (
<TabPane tab={item.name} key={item.id}>
@ -82,6 +163,198 @@ export const Transaction = observer(() => {
</TabPane>
))}
</Tabs>
)}
{store.ui.mediaQuery.isMobile && (
<div>
<Row>
<span style={{ fontWeight: "bold", marginBottom: "10px" }}>
Jenis Produk
</span>
</Row>
<Row>
<Col span={24}>
<Select
placeholder={"Pilih Jenis Produk"}
allowClear={true}
onChange={(val) => handleChangeTabs(val)}
style={{ marginBottom: "10px", width: "100%" }}
>
{store.transaction.dataCategories.map((item, index) => (
<Option key={index} value={item.id}>
{item.name}
</Option>
))}
</Select>
</Col>
</Row>
<Row>
<span style={{ fontWeight: "bold", marginBottom: "10px" }}>
Kategori
</span>
</Row>
<Row>
<Col span={24}>
<Select
placeholder={"Pilih Kategori"}
allowClear={true}
onChange={(val) => handleChangeSubcategory(val)}
style={{ marginBottom: "10px", width: "100%" }}
value={store.transaction.filterSubCategory}
>
{store.transaction.dataSubCategories.map((item, index) => (
<Option key={item.id} value={item.id}>
{item.name}
</Option>
))}
</Select>
</Col>
</Row>
<Row
justify={"center"}
align={"center"}
style={{ marginBottom: "1rem" }}
>
<Col
span={12}
style={{
fontWeight: "bold",
display: "flex",
alignItems: "center",
}}
>
Produk & Nominal
</Col>
<Col span={12} style={{ textAlign: "right" }}>
{/* <Search
placeholder="input search text"
style={{ width: 200, marginRight: 10 }}
/> */}
</Col>
</Row>
{store.transaction.data.length != 0 && (
<Row>
{store.transaction.data.map((item, index) => (
<Col key={index} xs={24} md={16} lg={8}>
<Card
onClick={() => {
setVisibleModalBuy(true);
setBarang(item);
}}
hoverable
style={{
cursor: "pointer",
marginLeft: 10,
borderColor: "salmon",
height: 100,
marginBottom: 10,
}}
>
<span style={{ color: "black" }}>
{item?.product_name}
</span>
<br />
<span style={{ color: "grey", fontSize: 10 }}>
{new Intl.NumberFormat("id-ID", {
style: "currency",
currency: "IDR",
}).format(item?.price)}
</span>
</Card>
</Col>
))}
</Row>
)}
<Modal
visible={visibleModalBuy}
title={`Apakah anda yakin membeli ${barang?.product_name}?`}
okText={"Confirm"}
onCancel={() => {
form.resetFields();
setVisibleModalBuy(false);
}}
// footer={footerLayoutFilter}
footer={[
<Button
key="back"
style={{
backgroundColor: "#e74e5e",
color: "#fff",
}}
onClick={() => {
form.resetFields();
handleCancel();
}}
>
Batal
</Button>,
<Button
key="Beli"
style={{
backgroundColor: "#4e79e7",
color: "#fff",
}}
onClick={() => {
form
.validateFields()
.then((values) => {
console.log(values, "isi form");
handleBuyProduct(values, barang.product_code);
form.resetFields();
})
.catch((info) => {
console.error("Validate Failed:", info);
});
}}
>
Beli
</Button>,
<Button
key="Beli Stag"
type="primary"
onClick={() => {
form
.validateFields()
.then((values) => {
console.log(values, "isi form");
handleBuyStag(values, barang.product_code);
form.resetFields();
})
.catch((info) => {
console.error("Validate Failed:", info);
});
}}
>
Beli Staging
</Button>,
]}
>
<Form form={form} layout="vertical">
<Form.Item
name="destination"
label="Nomor Tujuan"
rules={[
{
required: true,
message: "Tolong masukan nomor tujuan!",
},
// {
// pattern: /^(?:\d*)$/,
// message: "Value should contain just number",
// },
// {
// pattern: /^[\d]{1,12}$/,
// message: "Value should be 1 - 12 character",
// },
]}
>
<Input />
</Form.Item>
</Form>
</Modal>
</div>
)}
</Card>
</div>
);

20
src/store/transaction.js
View File

@ -23,7 +23,7 @@ export class Transaction {
pageSizeSubCategories = 10;
dataSubCategories = [];
total_dataSubCategories = 0;
filterSubCategory = null;
//filterSubCategory = null;
pageHistoryTransaction = 0;
pageSizeHistoryTransaction = 10;
@ -40,6 +40,9 @@ export class Transaction {
dataHistoryTopUp = [];
total_dataHistoryTopUp = 0;
dataHistoryTopUpProfile = [];
total_dataHistoryTopUpProfile = 0;
dataTransaction = [];
dataTransactionB2B = [];
dataTransactionPartner = [];
@ -155,7 +158,7 @@ export class Transaction {
async getDataHistoryTopUp(id) {
try {
const response = await http.get(
`/transaction/history-deposit?page=${this.pageHistoryTopUp}&pageSize=${this.pageSizeHistoryTopUp}&user-destination=${id}`
`/transaction/history-deposit?page=${this.pageHistoryTopUp}&pageSize=${this.pageSizeHistoryTopUp}&user-destination=${id}&start=${this.filterStart}&end=${this.filterEnd}`
);
console.log(response,'get data history')
this.dataHistoryTopUp = response.body.data ?? [];
@ -165,6 +168,19 @@ export class Transaction {
}
}
async getDataHistoryTopUpProfile(id) {
try {
const response = await http.get(
`/transaction/history-deposit-profile?page=${this.page}&pageSize=${this.pageSize}&user-destination=${id}&start=${this.filterStart}&end=${this.filterEnd}`
);
console.log(response,'get data history Profile')
this.dataHistoryTopUpProfile = response.body.data ?? [];
this.total_dataHistoryTopUpProfile = response?.body?.count ?? 0;
} catch (e) {
console.error(e);
}
}
async create(data) {
try {
const response = await http.post("/product").send(data);