124 lines
3.5 KiB
JavaScript
124 lines
3.5 KiB
JavaScript
import React from "react";
|
|
import { Button, PageHeader, Card, Row, Col, List } from "antd";
|
|
import { store } from "../../utils/useStore";
|
|
import { observer } from "mobx-react-lite";
|
|
import { FilterOutlined, TransactionOutlined } from "@ant-design/icons";
|
|
|
|
export const Home = observer(() => {
|
|
return (
|
|
<div>
|
|
{store.ui.mediaQuery.isDesktop && (
|
|
<Row
|
|
style={{
|
|
marginTop: 30,
|
|
marginLeft: 30,
|
|
}}
|
|
>
|
|
<Card
|
|
className={"shadow"}
|
|
style={{
|
|
marginLeft: 20,
|
|
height: 200,
|
|
marginBottom: 10,
|
|
width: "30%",
|
|
}}
|
|
>
|
|
<PageHeader title={<span>Total Transaksi</span>}>
|
|
<span>Total Transaksi : 25 Transaksi</span>
|
|
</PageHeader>
|
|
</Card>
|
|
<Card
|
|
className={"shadow"}
|
|
style={{
|
|
marginLeft: 20,
|
|
height: 200,
|
|
marginBottom: 10,
|
|
width: "30%",
|
|
}}
|
|
>
|
|
<PageHeader title={<span>Total Keuntungan</span>}>
|
|
<span>Rp.30.000.000</span>
|
|
</PageHeader>
|
|
</Card>
|
|
<Card
|
|
className={"shadow"}
|
|
hoverable
|
|
style={{
|
|
marginLeft: 20,
|
|
height: 200,
|
|
marginBottom: 10,
|
|
width: "30%",
|
|
}}
|
|
>
|
|
<PageHeader title={<span>Saldo</span>}>
|
|
<span>Rp.200.000.000 </span>
|
|
</PageHeader>
|
|
</Card>
|
|
</Row>
|
|
)}
|
|
{store.ui.mediaQuery.isMobile && (
|
|
<div style={{ marginTop: 10 }}>
|
|
<Card
|
|
className={"shadow"}
|
|
style={{
|
|
marginLeft: 20,
|
|
height: 200,
|
|
marginBottom: 10,
|
|
marginRight: 20,
|
|
}}
|
|
>
|
|
<PageHeader title={<span>Total Transaksi</span>}>
|
|
<span>Total Transaksi :</span>
|
|
</PageHeader>
|
|
</Card>
|
|
<Card
|
|
className={"shadow"}
|
|
style={{
|
|
marginLeft: 20,
|
|
height: 200,
|
|
marginBottom: 10,
|
|
marginRight: 20,
|
|
}}
|
|
>
|
|
<PageHeader title={<span>Total Keuntungan</span>}>
|
|
<span>Rp.30.000.000</span>
|
|
</PageHeader>
|
|
</Card>
|
|
<Card
|
|
className={"shadow"}
|
|
hoverable
|
|
style={{
|
|
marginLeft: 20,
|
|
height: 200,
|
|
marginBottom: 10,
|
|
marginRight: 20,
|
|
}}
|
|
>
|
|
<PageHeader title={<span>Saldo</span>}>
|
|
<span>Rp.200.000.000 </span>
|
|
</PageHeader>
|
|
</Card>
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
// return <div className={["ppob-container"].join(" ")}>
|
|
// <PageHeader
|
|
// style={{
|
|
// padding: 0,
|
|
// margin: 0,
|
|
// height: 40,
|
|
// backgroundColor: "transparent",
|
|
// }}
|
|
// title={"Home"}
|
|
// >
|
|
// </PageHeader>
|
|
// <Button onClick={() => {
|
|
// store.ui.setTestValue();
|
|
// }}>{store.ui.testValue}</Button>
|
|
// Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus aut recusandae velit! Consequatur corporis,
|
|
// eum fuga, harum incidunt laboriosam minus necessitatibus neque non nostrum pariatur tempore. Dignissimos impedit
|
|
// rem tempora!
|
|
// </div>
|
|
});
|