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

feat: stiching api profile and history transaction.js

Browse Source
This commit is contained in:
caturbgs
2021-12-15 20:36:48 +07:00
parent 6f743301e4
commit 28c42b3453
3 changed files with 97 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,12 +1,13 @@
import React from "react";
import {Card, Col, Row, Typography} from "antd";
import React, {useEffect} from "react";
import {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";
const {Title, Text} = Typography;
export const Profile = () => {
export const Profile = observer(() => {
const store = useStore();
const routeData = [
{
@@ -19,6 +20,35 @@ export const Profile = () => {
},
];
useEffect(() => {
(async () => {
await Promise.allSettled([
store.authentication.getProfile(),
store.transaction.getDataHistoryTransaction(),
]);
})()
}, []);
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',
},
]
return (
<div className={["ppob-container"].join(" ")}>
<BreadcumbComponent data={routeData}/>
@@ -27,26 +57,49 @@ export const Profile = () => {
<Col span={24}>
<div>
<Title strong>Profile</Title>
<Row>
<Col span={10}>
<Text strong>Name</Text>
</Col>
<Col span={14}>
<Text>{store.authentication.userData.username}</Text>
</Col>
<Col span={10}>
<Text strong>Role</Text>
</Col>
<Col span={14}>
<Text>{store.authentication.userData.role}</Text>
</Col>
</Row>
{/*<Row>*/}
{/* <Col span={10}>*/}
{/* <Text strong>Name</Text>*/}
{/* </Col>*/}
{/* <Col span={14}>*/}
{/* <Text>{store.authentication.profileData.username}</Text>*/}
{/* </Col>*/}
{/* <Col span={10}>*/}
{/* <Text strong>Role</Text>*/}
{/* </Col>*/}
{/* <Col span={14}>*/}
{/* <Text>{store.authentication.profileData.roles.name}</Text>*/}
{/* </Col>*/}
{/* <Col span={10}>*/}
{/* <Text strong>Superior</Text>*/}
{/* </Col>*/}
{/* <Col span={14}>*/}
{/* <Text>{store.authentication.profileData.superior.username}</Text>*/}
{/* </Col>*/}
{/* <Col span={10}>*/}
{/* <Text strong>Wallet</Text>*/}
{/* </Col>*/}
{/* <Col span={14}>*/}
{/* <Text>{store.authentication.profileData.wallet}</Text>*/}
{/* </Col>*/}
{/*</Row>*/}
</div>
</Col>
</Row>
<Row>
<Col span={24}>
<div>
<Title strong level={3}>History User Transaction</Title>
<Table
columns={columns}
dataSource={store.transaction.dataHistoryTransaction}
bordered
/>
</div>
</Col>
</Row>
<div/>
</Card>
</div>
)
};
});