Role Access
This commit is contained in:
parent
9460935e0a
commit
78626fd6e9
|
@ -1,18 +1,33 @@
|
|||
import React, {useContext, useState} from "react";
|
||||
import {Button, Col, Divider, Form, Input, List, message, Modal, Row, Select, Table, Tag, Typography,} from "antd";
|
||||
import {observer} from "mobx-react-lite";
|
||||
import {ExclamationCircleOutlined} from "@ant-design/icons";
|
||||
import {useHistory} from "react-router-dom";
|
||||
import {useStore} from "../utils/useStore";
|
||||
import {LINKS} from "../routes/app";
|
||||
import {ModalLoaderContext} from "../utils/modal";
|
||||
import React, { useContext, useState } from "react";
|
||||
import {
|
||||
Button,
|
||||
Col,
|
||||
Divider,
|
||||
Form,
|
||||
Input,
|
||||
InputNumber,
|
||||
List,
|
||||
message,
|
||||
Modal,
|
||||
Row,
|
||||
Select,
|
||||
Table,
|
||||
Tag,
|
||||
Typography,
|
||||
} from "antd";
|
||||
import { observer } from "mobx-react-lite";
|
||||
import { ExclamationCircleOutlined } from "@ant-design/icons";
|
||||
import { useHistory } from "react-router-dom";
|
||||
import { useStore } from "../utils/useStore";
|
||||
import { LINKS } from "../routes/app";
|
||||
import { ModalLoaderContext } from "../utils/modal";
|
||||
|
||||
const {Title, Text} = Typography;
|
||||
const { Title, Text } = Typography;
|
||||
|
||||
export const ProductComponent = observer((props) => {
|
||||
const store = useStore();
|
||||
const [form] = Form.useForm();
|
||||
const {Option} = Select;
|
||||
const { Option } = Select;
|
||||
const history = useHistory();
|
||||
const [idData, setIdData] = useState("");
|
||||
const [filterSupplier, setFilterSupplier] = useState([]);
|
||||
|
@ -302,9 +317,7 @@ export const ProductComponent = observer((props) => {
|
|||
<small>{item.product_name}</small> <br />
|
||||
<small>Harga Beli : {item.current_price_price}</small>
|
||||
<br />
|
||||
<small>
|
||||
Harga Jual : {item.mark_up_price}
|
||||
</small>
|
||||
<small>Harga Jual : {item.mark_up_price}</small>
|
||||
</p>
|
||||
<p></p>
|
||||
</div>
|
||||
|
@ -318,10 +331,14 @@ export const ProductComponent = observer((props) => {
|
|||
}}
|
||||
>
|
||||
<Tag
|
||||
color={item?.product_status === "ACTIVE" ? "blue" : "#E3E8EE"}
|
||||
color={
|
||||
item?.product_status === "ACTIVE" ? "blue" : "#E3E8EE"
|
||||
}
|
||||
style={{ color: "#4F566B" }}
|
||||
>
|
||||
{item?.product_status === "ACTIVE" ? " Tersedia" : "Tidak"}
|
||||
{item?.product_status === "ACTIVE"
|
||||
? " Tersedia"
|
||||
: "Tidak"}
|
||||
</Tag>
|
||||
</p>
|
||||
</div>
|
||||
|
@ -367,14 +384,26 @@ export const ProductComponent = observer((props) => {
|
|||
label="Price"
|
||||
rules={[{ required: true, message: "Please input price!" }]}
|
||||
>
|
||||
<Input />
|
||||
<InputNumber
|
||||
style={{ width: "100%" }}
|
||||
formatter={(value) =>
|
||||
`Rp. ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ",")
|
||||
}
|
||||
parser={(value) => value.replace(/\Rp.\s?|(,*)/g, "")}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="markUpPrice"
|
||||
label="Mark Up Price"
|
||||
rules={[{ required: true, message: "Please input mark up price!" }]}
|
||||
>
|
||||
<Input />
|
||||
<InputNumber
|
||||
style={{ width: "100%" }}
|
||||
formatter={(value) =>
|
||||
`Rp. ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ",")
|
||||
}
|
||||
parser={(value) => value.replace(/\Rp.\s?|(,*)/g, "")}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="code"
|
||||
|
@ -427,7 +456,7 @@ export const ProductComponent = observer((props) => {
|
|||
onChange={(val) => {
|
||||
setFilterSupplier(val);
|
||||
}}
|
||||
style={{marginBottom: "20px", width: "100%"}}
|
||||
style={{ marginBottom: "20px", width: "100%" }}
|
||||
value={filterSupplier}
|
||||
>
|
||||
{store.supplier.data.map((item) => (
|
||||
|
@ -445,7 +474,7 @@ export const ProductComponent = observer((props) => {
|
|||
mode={"multiple"}
|
||||
placeholder="Choose Category"
|
||||
onChange={async (val) => handleFilterCategory(val)}
|
||||
style={{marginBottom: "20px", width: "100%"}}
|
||||
style={{ marginBottom: "20px", width: "100%" }}
|
||||
value={store.product.filterCategory || []}
|
||||
>
|
||||
{store.category.data.map((item) => (
|
||||
|
@ -465,7 +494,7 @@ export const ProductComponent = observer((props) => {
|
|||
onChange={(val) => {
|
||||
setFilterSubCategories(val);
|
||||
}}
|
||||
style={{marginBottom: "20px", width: "100%"}}
|
||||
style={{ marginBottom: "20px", width: "100%" }}
|
||||
value={filterSubCategories}
|
||||
>
|
||||
{store.product.dataSubCategories.map((item) => (
|
||||
|
|
|
@ -125,7 +125,7 @@ export const DetailUser = observer(() => {
|
|||
<Row>
|
||||
<Col span={24}>
|
||||
<div>
|
||||
<Title strong level={3}>History User Transaction</Title>
|
||||
<Title strong level={3}>History Top Up</Title>
|
||||
|
||||
<Button style={{marginBottom: '1rem'}} onClick={() => {
|
||||
console.log('clicked filter')
|
||||
|
|
|
@ -1,16 +1,32 @@
|
|||
import React, {useContext, useEffect, useState} from "react";
|
||||
import {Button, Card, Col, Divider, Form, Input, List, message, Modal, Row, Select, Space, Table, Tag,} from "antd";
|
||||
import {useStore} from "../../utils/useStore";
|
||||
import {observer} from "mobx-react-lite";
|
||||
import {DownloadOutlined, PlusSquareOutlined,} from "@ant-design/icons";
|
||||
import {MembershipModal} from "./MembershipModal";
|
||||
import {BreadcumbComponent} from "../../component/BreadcumbComponent";
|
||||
import {LINKS} from "../../routes/app";
|
||||
import {useHistory} from "react-router-dom";
|
||||
import {ModalLoaderContext} from "../../utils/modal";
|
||||
import React, { useContext, useEffect, useState } from "react";
|
||||
import {
|
||||
Button,
|
||||
Card,
|
||||
Col,
|
||||
Divider,
|
||||
Form,
|
||||
Input,
|
||||
List,
|
||||
message,
|
||||
Modal,
|
||||
Row,
|
||||
Select,
|
||||
Space,
|
||||
Table,
|
||||
Tag,
|
||||
InputNumber
|
||||
} from "antd";
|
||||
import { useStore } from "../../utils/useStore";
|
||||
import { observer } from "mobx-react-lite";
|
||||
import { DownloadOutlined, PlusSquareOutlined } from "@ant-design/icons";
|
||||
import { MembershipModal } from "./MembershipModal";
|
||||
import { BreadcumbComponent } from "../../component/BreadcumbComponent";
|
||||
import { LINKS } from "../../routes/app";
|
||||
import { useHistory } from "react-router-dom";
|
||||
import { ModalLoaderContext } from "../../utils/modal";
|
||||
|
||||
const {Search} = Input;
|
||||
const {Option} = Select;
|
||||
const { Search } = Input;
|
||||
const { Option } = Select;
|
||||
export const Membership = observer(() => {
|
||||
const history = useHistory();
|
||||
const [form] = Form.useForm();
|
||||
|
@ -212,6 +228,7 @@ export const Membership = observer(() => {
|
|||
},
|
||||
];
|
||||
|
||||
if (store.authentication.userData.role !== "Admin") columns.pop();
|
||||
const routeData = [
|
||||
{
|
||||
route: LINKS.HOME,
|
||||
|
@ -385,9 +402,14 @@ export const Membership = observer(() => {
|
|||
<div style={{}}>
|
||||
<p>
|
||||
<small>Role : {item.roleName}</small> <br />
|
||||
<small>Saldo Supplier : {item.coa.amount}</small>{" "}
|
||||
<small>
|
||||
Saldo Supplier : {item.coa.amount}
|
||||
</small>{" "}
|
||||
<br />
|
||||
<small>
|
||||
Saldo System : {item.coa.amount}
|
||||
</small>{" "}
|
||||
<br />
|
||||
<small>Saldo System : {item.coa.amount}</small> <br />
|
||||
</p>
|
||||
</div>
|
||||
}
|
||||
|
@ -461,7 +483,13 @@ export const Membership = observer(() => {
|
|||
label="Amount"
|
||||
rules={[{ required: true, message: "Please input amount!" }]}
|
||||
>
|
||||
<Input />
|
||||
<InputNumber
|
||||
style={{ width: "100%" }}
|
||||
formatter={(value) =>
|
||||
`Rp. ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ",")
|
||||
}
|
||||
parser={(value) => value.replace(/\Rp.\s?|(,*)/g, "")}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</Modal>
|
||||
|
|
|
@ -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,17 +57,26 @@ 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={{
|
||||
|
@ -72,21 +85,31 @@ export const Product = observer(() => {
|
|||
marginBottom: store.ui.mediaQuery.isMobile ? 10 : 0,
|
||||
}}
|
||||
/>
|
||||
{store.authentication.userData.role === "Admin" && (
|
||||
<div>
|
||||
<Upload>
|
||||
<Button disabled={store.product.uploadBtnProduct} style={{
|
||||
marginRight: store.ui.mediaQuery.isMobile ? 0 : 10,
|
||||
marginBottom: store.ui.mediaQuery.isMobile ? 10 : 0,
|
||||
}} icon={<UploadOutlined/>}>
|
||||
<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
|
||||
onClick={() => (store.product.visibleModalProduct = true)}
|
||||
>
|
||||
<PlusSquareOutlined /> New
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</Col>
|
||||
</Row>
|
||||
<ProductComponent/>
|
||||
<ProductComponent />
|
||||
</Card>
|
||||
</div>
|
||||
);
|
||||
|
|
Loading…
Reference in New Issue
Block a user