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

Pages Product

Browse Source
This commit is contained in:
ajat91 2021-12-16 17:47:05 +07:00
parent 5ce366f638
commit 34a9cd972b
1 changed files with 26 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,6 +1,10 @@
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { Button, Card, Col, Input, Row, Select, Tabs } from "antd"; import { Button, Card, Col, Input, Row, Select, Tabs, Upload } from "antd";
import { FilterOutlined, PlusSquareOutlined } from "@ant-design/icons"; import {
FilterOutlined,
PlusSquareOutlined,
UploadOutlined,
} from "@ant-design/icons";
import { BreadcumbComponent } from "../../component/BreadcumbComponent"; import { BreadcumbComponent } from "../../component/BreadcumbComponent";
import { useStore } from "../../utils/useStore"; import { useStore } from "../../utils/useStore";
import { observer } from "mobx-react-lite"; import { observer } from "mobx-react-lite";
@ -13,14 +17,17 @@ const { Option } = Select;
export const Product = observer(() => { export const Product = observer(() => {
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const [uploadProduct, setUpload] = useState(true);
const store = useStore(); const store = useStore();
useEffect(() => { useEffect(() => {
const init = async () => { const init = async () => {
try { try {
setIsLoading(true); setIsLoading(true);
await store.supplier.getData();
await store.product.getDataCategories(); await store.product.getDataCategories();
await store.product.getData(); await store.product.getData();
//await store.supplier.data;
setIsLoading(false); setIsLoading(false);
} catch (e) { } catch (e) {
setIsLoading(false); setIsLoading(false);
@ -30,12 +37,6 @@ export const Product = observer(() => {
init(); init();
}, []); }, []);
const handleChangeTabPane = async (key) => {
store.product.filterCategory = key;
// console.log(key);
await store.product.getData();
};
const routeData = [ const routeData = [
{ {
route: LINKS.HOME, route: LINKS.HOME,
@ -72,28 +73,31 @@ export const Product = observer(() => {
</Button> </Button>
</Col> </Col>
</Row> </Row>
<Row> <Row>
<Col span={24}> <Col span={20}>
<Select <Select
placeholder="Choose Supplier" placeholder="Choose Supplier"
onChange={(val) => console.log(val, "SELECTED")} onChange={(val) => {
val ? setUpload(false) : setUpload(true);
}}
style={{ marginBottom: "20px", width: "100%" }} style={{ marginBottom: "20px", width: "100%" }}
> >
<Option value={1}>Hemm</Option> {store.supplier.data.map((item) => (
<Option value={2}>Huam</Option> <Option value={item.id} key={item.id}>
{item.name}
</Option>
))}
</Select> </Select>
</Col> </Col>
<Col style={{ marginLeft: "10px" }}>
<Upload>
<Button disabled={uploadProduct} icon={<UploadOutlined />}>
Upload Product
</Button>
</Upload>
</Col>
</Row> </Row>
{/* <Tabs onChange={handleChangeTabPane} size="default" tabBarGutter="50">
{store.product.dataCategories.map((item, idx) => (
<TabPane tab={item.name} key={item.id}> */}
{/* <ProductComponent category={item.name} /> */}
<ProductComponent /> <ProductComponent />
{/* </TabPane>
))}
</Tabs> */}
</Card> </Card>
</div> </div>
); );