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

Role Access

Browse Source
This commit is contained in:
ajat91.sudrajat
2021-12-22 17:52:05 +07:00
parent 9460935e0a
commit 78626fd6e9
4 changed files with 199 additions and 119 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,14 +1,18 @@
import React, {useContext, useEffect} from "react";
import {Button, Card, Col, Input, message, Row, Upload} from "antd";
import {FilterOutlined, PlusSquareOutlined, UploadOutlined,} from "@ant-design/icons";
import {BreadcumbComponent} from "../../component/BreadcumbComponent";
import {useStore} from "../../utils/useStore";
import {observer} from "mobx-react-lite";
import {ProductComponent} from "../../component/ProductComponent";
import {LINKS} from "../../routes/app";
import {ModalLoaderContext} from "../../utils/modal";
import React, { useContext, useEffect } from "react";
import { Button, Card, Col, Input, message, Row, Upload } from "antd";
import {
FilterOutlined,
PlusSquareOutlined,
UploadOutlined,
} from "@ant-design/icons";
import { BreadcumbComponent } from "../../component/BreadcumbComponent";
import { useStore } from "../../utils/useStore";
import { observer } from "mobx-react-lite";
import { ProductComponent } from "../../component/ProductComponent";
import { LINKS } from "../../routes/app";
import { ModalLoaderContext } from "../../utils/modal";
const {Search} = Input;
const { Search } = Input;
export const Product = observer(() => {
const store = useStore();
@@ -53,40 +57,59 @@ export const Product = observer(() => {
<div className={["ppob-container"].join(" ")}>
<BreadcumbComponent data={routeData} />
<Card>
<Row style={{marginBottom: 20}}>
<Row style={{ marginBottom: 20 }}>
<Col span={12}>
<Button onClick={() => {
store.product.visibleModalFilterProduct = true
}}>
<FilterOutlined/>
<Button
onClick={() => {
store.product.visibleModalFilterProduct = true;
}}
>
<FilterOutlined />
Filter
</Button>
</Col>
<Col span={12}>
<div style={{display: store.ui.mediaQuery.isMobile? "" :'flex',justifyContent: 'flex-end',textAlign: "right"}}>
<div
style={{
display: store.ui.mediaQuery.isMobile ? "" : "flex",
justifyContent: "flex-end",
textAlign: "right",
//width:store.authentication.userData.role === "Admin" ? 100 : ''
}}
>
<Search
placeholder="input search text"
style={{
width: store.ui.mediaQuery.isMobile ? 160 : 200,
marginRight: store.ui.mediaQuery.isMobile ? 0 : 10,
marginBottom: store.ui.mediaQuery.isMobile ? 10 : 0,
}}
/>
<Upload>
<Button disabled={store.product.uploadBtnProduct} style={{
placeholder="input search text"
style={{
width: store.ui.mediaQuery.isMobile ? 160 : 200,
marginRight: store.ui.mediaQuery.isMobile ? 0 : 10,
marginBottom: store.ui.mediaQuery.isMobile ? 10 : 0,
}} icon={<UploadOutlined/>}>
Upload Product
</Button>
</Upload>
<Button onClick={() => (store.product.visibleModalProduct = true)}>
<PlusSquareOutlined/> New
</Button>
}}
/>
{store.authentication.userData.role === "Admin" && (
<div>
<Upload>
<Button
disabled={store.product.uploadBtnProduct}
style={{
marginRight: store.ui.mediaQuery.isMobile ? 0 : 0,
marginBottom: store.ui.mediaQuery.isMobile ? 10 : 10,
}}
icon={<UploadOutlined />}
>
Upload Product
</Button>
</Upload>
<Button
onClick={() => (store.product.visibleModalProduct = true)}
>
<PlusSquareOutlined /> New
</Button>
</div>
)}
</div>
</Col>
</Row>
<ProductComponent/>
<ProductComponent />
</Card>
</div>
);