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

feat: init responsive mode

Browse Source
This commit is contained in:
caturbgs
2021-12-09 11:31:02 +07:00
parent f27ddcfe90
commit 599a89449b
9 changed files with 438 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -8,63 +8,63 @@ const {TabPane} = Tabs;
const {Search} = Input;
export const Product = () => {
const callback = (key) => {
console.log(key);
};
const routeData = [
{
route: "/app/home",
name: "Home",
},
{
route: "/app/product",
name: <span style={{fontWeight: 'bold'}}>Product</span>,
},
];
return (
<div>
<BreadcumbComponent data={routeData}/>
<Card>
<Row style={{marginBottom: 20}}>
<Col span={12}>
<Button>
<FilterOutlined/>
Filter
</Button>
</Col>
<Col span={12} style={{textAlign: "right"}}>
<Search
placeholder="input search text"
style={{width: 200, marginRight: 10}}
/>
<Button>
<PlusSquareOutlined/> New
</Button>
</Col>
</Row>
<Tabs
defaultActiveKey="1"
onChange={callback}
size="default"
tabBarGutter="50"
>
<TabPane tab="Pulsa" key="1">
<Pulsa/>
</TabPane>
<TabPane tab="Game Voucher" key="2">
Game Voucher
</TabPane>
<TabPane tab="Product" key="3">
Product
</TabPane>
<TabPane tab="Prduct" key="4">
Prduct
</TabPane>
<TabPane tab="Prdct" key="5">
Prdct
</TabPane>
</Tabs>
</Card>
</div>
);
const callback = (key) => {
console.log(key);
};
const routeData = [
{
route: "/app/home",
name: "Home",
},
{
route: "/app/product",
name: <span style={{fontWeight: 'bold'}}>Product</span>,
},
];
return (
<div className={["ppob-container"].join(" ")}>
<BreadcumbComponent data={routeData}/>
<Card>
<Row style={{marginBottom: 20}}>
<Col span={12}>
<Button>
<FilterOutlined/>
Filter
</Button>
</Col>
<Col span={12} style={{textAlign: "right"}}>
<Search
placeholder="input search text"
style={{width: 200, marginRight: 10}}
/>
<Button>
<PlusSquareOutlined/> New
</Button>
</Col>
</Row>
<Tabs
defaultActiveKey="1"
onChange={callback}
size="default"
tabBarGutter="50"
>
<TabPane tab="Pulsa" key="1">
<Pulsa/>
</TabPane>
<TabPane tab="Game Voucher" key="2">
Game Voucher
</TabPane>
<TabPane tab="Product" key="3">
Product
</TabPane>
<TabPane tab="Prduct" key="4">
Prduct
</TabPane>
<TabPane tab="Prdct" key="5">
Prdct
</TabPane>
</Tabs>
</Card>
</div>
);
};