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

Hit Api Total Transaksi

Browse Source
This commit is contained in:
ajat91.sudrajat 2021-12-30 12:28:53 +07:00
parent 036cba0528
commit bf3e66b5b5
4 changed files with 259 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,14 +1,96 @@
import React from "react";
import { Button, PageHeader, Card, Row, Col } from "antd";
import { store } from "../../utils/useStore";
import React, { useContext, useEffect } from "react";
import { Button, PageHeader, Card, Row, Col, message, Table } from "antd";
import { useStore } from "../../utils/useStore";
import { observer } from "mobx-react-lite";
import {
DropboxOutlined,
DollarCircleOutlined,
BarChartOutlined,
} from "@ant-design/icons";
import { ModalLoaderContext } from "../../utils/modal";
export const Home = observer(() => {
const modalLoader = useContext(ModalLoaderContext);
const store = useStore();
useEffect(() => {
const init = async () => {
try {
modalLoader.setLoading(true);
const isAdmin = store.authentication.userData.role === "Admin";
await getData();
await store.membership.getDataBySuperior();
await store.partner.getData();
await store.transaction.getDataTransaction();
await store.role.getData(isAdmin);
modalLoader.setLoading(false);
} catch (e) {
console.error(e);
modalLoader.setLoading(false);
if (e.response?.body?.message) {
message.error(e.response.body.message);
return;
}
message.error(e.message);
}
};
init();
}, []);
const getData = async () => {
store.authentication.userData.role === "Admin"
? await store.membership.getData()
: await store.membership.getDataBySuperior();
};
const columns = [
{
title: "Name",
dataIndex: "name",
key: "name",
render: (text, record) => record?.name ?? record?.username,
},
{
title: "Role",
dataIndex: "roleName",
key: "role",
},
{
title: "Saldo",
dataIndex: ["coa", "amount"],
key: ["coa", "amount"],
width: "20%",
render: (text) =>
new Intl.NumberFormat("id-ID", {
style: "currency",
currency: "IDR",
}).format(text),
},
// {
// title: "Action",
// key: "action",
// render: (text, record) => (
// <Space size="middle">
// <Button
// onClick={() => {
// setDestination(record?.id);
// console.log(record?.id);
// setIsVisibleTopUpModal(true);
// }}
// >
// <DownloadOutlined /> Top Up Saldo
// </Button>
// <Button
// onClick={async () => {
// await store.transaction.getDataHistoryTopUp(record.id);
// history.push(LINKS.USER_DETAIL.replace(":id", record.id));
// console.log(record.id);
// }}
// >
// Detail
// </Button>
// </Space>
// ),
// },
];
return (
<div>
{store.ui.mediaQuery.isDesktop && (
@ -32,7 +114,9 @@ export const Home = observer(() => {
<Row>
<BarChartOutlined style={{ fontSize: 30 }} />
<PageHeader title={<span>Total Transaksi</span>}>
<span>Total Transaksi : 25 Transaksi</span>
<p>
<h4>{store.transaction.dataTransaction} Transaksi</h4>
</p>
</PageHeader>
</Row>
</Card>
@ -84,6 +168,78 @@ export const Home = observer(() => {
</Card>
</Row>
)}
{store.authentication.userData.role === "Admin" &&
store.ui.mediaQuery.isDesktop && (
<Row style={{ marginLeft: 50, marginTop: 10 }}>
<Card
className={"shadow"}
title="Card title"
style={{
marginBottom: 30,
marginRight: 20,
borderColor: "salmon",
width: "47%",
}}
>
<Table
key="1"
hasEmpty
size="large"
columns={columns}
dataSource={store.membership.data}
bordered
pagination={{
pageSize: store.membership.pageSize,
total: store.membership.totalData,
current: store.membership.page + 1,
showSizeChanger: true,
simple: false,
}}
onChange={async (page) => {
let pageNumber = page.current;
store.membership.pageSize = page.pageSize;
store.membership.page = pageNumber - 1;
modalLoader.setLoading(true);
await getData();
modalLoader.setLoading(false);
}}
/>
</Card>
<Card
className={"shadow"}
title="Card title"
style={{
marginBottom: 30,
borderColor: "salmon",
width: "47%",
}}
>
<Table
key="1"
hasEmpty
size="large"
columns={columns}
dataSource={store.membership.data}
bordered
pagination={{
pageSize: store.membership.pageSize,
total: store.membership.totalData,
current: store.membership.page + 1,
showSizeChanger: true,
simple: false,
}}
onChange={async (page) => {
let pageNumber = page.current;
store.membership.pageSize = page.pageSize;
store.membership.page = pageNumber - 1;
modalLoader.setLoading(true);
await getData();
modalLoader.setLoading(false);
}}
/>
</Card>
</Row>
)}
{store.ui.mediaQuery.isMobile && (
<div style={{ marginTop: 10 }}>
<Card
@ -100,7 +256,9 @@ export const Home = observer(() => {
<Row>
<BarChartOutlined style={{ fontSize: 30 }} />
<PageHeader title={<span>Total Transaksi</span>}>
<span>Total Transaksi : 25 Transaksi</span>
<p>
<h4>{store.transaction.dataTransaction} Transaksi</h4>
</p>
</PageHeader>
</Row>
</Card>
@ -152,6 +310,75 @@ export const Home = observer(() => {
</Card>
</div>
)}
{store.authentication.userData.role === "Admin" &&
store.ui.mediaQuery.isMobile && (
<Row style={{ marginLeft: 20, marginRight: 20, marginTop: 10 }}>
<Card
className={"shadow"}
title="Card title"
style={{
marginBottom: 10,
borderColor: "salmon",
}}
>
<Table
key="1"
hasEmpty
size="small"
columns={columns}
dataSource={store.membership.data}
bordered
pagination={{
pageSize: store.membership.pageSize,
total: store.membership.totalData,
current: store.membership.page + 1,
showSizeChanger: true,
simple: false,
}}
onChange={async (page) => {
let pageNumber = page.current;
store.membership.pageSize = page.pageSize;
store.membership.page = pageNumber - 1;
modalLoader.setLoading(true);
await getData();
modalLoader.setLoading(false);
}}
/>
</Card>
<Card
className={"shadow"}
title="Card title"
style={{
marginBottom: 30,
borderColor: "salmon",
}}
>
<Table
key="1"
hasEmpty
size="small"
columns={columns}
dataSource={store.membership.data}
bordered
pagination={{
pageSize: store.membership.pageSize,
total: store.membership.totalData,
current: store.membership.page + 1,
showSizeChanger: true,
simple: false,
}}
onChange={async (page) => {
let pageNumber = page.current;
store.membership.pageSize = page.pageSize;
store.membership.page = pageNumber - 1;
modalLoader.setLoading(true);
await getData();
modalLoader.setLoading(false);
}}
/>
</Card>
</Row>
)}
</div>
);
});

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

@ -120,9 +120,9 @@ export const Profile = observer(() => {
];
const columns = [
{
title: "Markup Price",
dataIndex: "mark_up_price",
key: "mark_up_price",
title: "Price",
dataIndex: "price",
key: "price",
width: "20%",
render: (text) =>
new Intl.NumberFormat("id-ID", {
@ -131,9 +131,9 @@ export const Profile = observer(() => {
}).format(text),
},
{
title: "Name",
dataIndex: "name",
key: "name",
title: "Buyer",
dataIndex: "buyer",
key: "buyer",
width: "50%",
},
{
@ -141,9 +141,7 @@ export const Profile = observer(() => {
dataIndex: "created_at",
key: "created_at",
render: (text, record) => {
return (
<Text>{format(parseISO(record.created_at), "mm:HH dd-MM-yyyy")}</Text>
);
return <Text>{format(parseISO(record.created_at), "dd-MM-yyyy")}</Text>;
},
},
];
@ -208,7 +206,7 @@ export const Profile = observer(() => {
</Col>
</Row>
</Col>
<Col>
<Col span={store.ui.mediaQuery.isMobile ? 10 : 5}>
<Row justify={"center"}>
<Col lg={12} xs={12}>
<Title strong level={3} style={styleSaldoTitle}>
@ -226,7 +224,7 @@ export const Profile = observer(() => {
<Col></Col>
</Row>
</Col>
<Col>
<Col span={store.ui.mediaQuery.isMobile ? 8 : 5}>
<Row justify={"center"}>
<Col lg={12} xs={12}>
<Title strong level={3} style={styleSaldoTitle}>
@ -292,11 +290,7 @@ export const Profile = observer(() => {
>
<Row>
<Col span={24}>
<Form
layout="vertical"
name="filter"
form={form}
>
<Form layout="vertical" name="filter" form={form}>
<Form.Item
name="start_date"
label="Dari"

2
src/store/authentication.js
View File

@ -2,6 +2,7 @@ import {makeAutoObservable, runInAction} from "mobx";
import {TokenUtil} from "../utils/token";
import {http} from "../utils/http";
export class Authentication {
isLoggedIn = false;
isLoginLoading = false;
@ -53,6 +54,7 @@ export class Authentication {
async getProfile() {
try {
const response = await http.get('/auth/profile');
console.log(response)
this.profileData = response.body;
} catch (e) {
console.error(e);

14
src/store/transaction.js
View File

@ -30,6 +30,7 @@ export class Transaction {
pageSizeHistoryTopUp = 10;
dataHistoryTopUp = [];
total_dataHistoryTopUp = 0;
dataTransaction=[]
//filter
visibleModalFilterTransaction = false;
@ -52,6 +53,19 @@ export class Transaction {
}
}
async getDataTransaction() {
try {
const response = await http.get(
`/transaction/total-order`
);
//console.log(response)
this.dataTransaction = response.body.data ?? [];
this.total_data = response?.body?.count ?? 0;
} catch (e) {
console.error(e);
}
}
async getDataSubCategories() {
try {
const response = await http.get(