Ahmad.zuhdi.y/bukopin-redemption-client-react
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update: shop page

Browse Source
This commit is contained in:
Rifqy Zacky Ariadhy
2019-01-02 21:16:50 +07:00
parent 0794e91ad0
commit e503b70640
5 changed files with 387 additions and 302 deletions
Download Patch File Download Diff File Expand all files Collapse all files

222
src/common/pages/App/index.js
View File

@@ -538,226 +538,10 @@ export default class App extends React.Component {
{/*</ToolbarGroup>*/}
</Toolbar>
<Drawer containerClassName={(window.innerWidth < 600) ? 'drawer_small' : 'drawer_large transparent no-shadow'}
docked={(window.innerWidth < 600) ? false : true}
onRequestChange={(open) => this.setState({open})}
open={this.state.open}>
<Toolbar className="hide-on-med-and-up transparent" style={{marginLeft: 16}}>
<ToolbarGroup firstChild={true}>
{
// (this.settingStore.isIconEmpty) ?
// <div>
// <Paper style={styles.Paper} zDepth={1} circle={true}>
// <img style={styles.ImageRounded} className="logo"
// src="/assets/images/logo_ikan.png"/>
// </Paper>
// </div>
// :
// <div>
// <Paper style={styles.Paper} zDepth={1} circle={true}>
// <img style={styles.ImageRounded} className="logo"
// src={this.http.appendImagePath(this.settingStore.setting.icon)}/>
// </Paper>
// </div>
}
<div>
<Paper style={styles.Paper} zDepth={1} circle={true}>
<img style={styles.ImageRounded} className="logo" src="/assets/images/logo_ikan.png"/>
</Paper>
</div>
{/*<ToolbarTitle style={{color: '#424770'}}
text={(this.settingStore.setting.name) ? this.settingStore.setting.name : "Tourmate"}/>*/}
<ToolbarTitle style={{color: '#424770'}} text={'Marketplace'}/>
</ToolbarGroup>
</Toolbar>
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/dashboard')} to={LINKS.DASHBOARD}><MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/chart.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/dashboard') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Dashboard</span></MenuItem></Link>*/}
{/*{*/}
{/*userData.role == 'administrator' ?*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/data')} to={LINKS.DATA}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/data.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/data') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Data</span></MenuItem></Link> : ''*/}
{/*}*/}
{/*{*/}
{/*userData.role == 'administrator' &&*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/layout')} to={LINKS.LAYOUT}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/layout.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/layout') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Layout</span></MenuItem></Link>*/}
{/*}*/}
{/*{*/}
{/*userData.role == 'administrator' &&*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/content')} to={LINKS.CONTENT}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/content.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/content') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Content</span></MenuItem></Link>*/}
{/*}*/}
{/*{*/}
{/*userData.role === 'administrator' &&*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/tasks')} to={LINKS.TASKS}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/tasks.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/tasks') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Tasks</span></MenuItem></Link>*/}
{/*}*/}
{/*{*/}
{/*userData.role == 'store' ?*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/items')} to={LINKS.ITEMS}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/product.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/items') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Items</span></MenuItem></Link>*/}
{/*: ""*/}
{/*}*/}
{/*{*/}
{/*userData.role == 'store' ?*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/billing')} to={LINKS.WALLET}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/wallet.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/billing') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Wallet</span></MenuItem></Link> : ""*/}
{/*}*/}
{/*{*/}
{/*userData.role == 'store' ?*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/orders')} to={LINKS.ORDER}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/accounting.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/orders') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Order</span></MenuItem></Link>*/}
{/*: ""*/}
{/*}*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/tasks')} to={LINKS.TASKS}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/tasks.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/tasks') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Tasks</span></MenuItem></Link>*/}
{/*{*/}
{/*userData.role == 'store' ?*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/stores')} to={LINKS.STORES}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/store.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/stores') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Store</span></MenuItem></Link> : ''*/}
{/*}*/}
{/* {
userData.role == 'store' ?
<Link onClick={this
.changeRoute
.bind(this, '/app/recipes')} to={LINKS.RECIPES}> <MenuItem
leftIcon={<img src="/assets/images/icon/recipe.png"/>}
className={(this.state.selectedMenu === '/app/recipes') ? "menuAkunItem active" : 'menuAkunItem'}><span
className="menuAkun">Recipes</span></MenuItem></Link> : ''
} */}
{/* {
userData.role == 'administrator' ?
<Link onClick={this
.changeRoute
.bind(this, '/app/surf_turf')} to={LINKS.SURF}> <MenuItem
leftIcon={<img src="/assets/images/icon/grill.png"/>}
className={(this.state.selectedMenu === '/app/surf_turf') ? "menuAkunItem active" : 'menuAkunItem'}><span
className="menuAkun">Surf & Turf</span></MenuItem></Link> : ''
}
{
userData.role == 'administrator' ?
<Link onClick={this
.changeRoute
.bind(this, '/app/help')} to={LINKS.HELP}> <MenuItem
leftIcon={<img src="/assets/images/icon/help.png"/>}
className={(this.state.selectedMenu === '/app/help') ? "menuAkunItem active" : 'menuAkunItem'}><span
className="menuAkun">Help</span></MenuItem></Link> : ''
} */}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/inbox')} to={LINKS.INBOX}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/inbox.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/inbox') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Inbox</span></MenuItem></Link>*/}
{/*/!*{*!/*/}
{/*/!*userData.role == 'administrator' && *!/*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/setting')} to={LINKS.SETTING}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/settings.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/setting') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Setting</span></MenuItem></Link>*/}
{/*}*/}
{/*
userData.role == 'administrator' ?
<Link onClick={this
.changeRoute
.bind(this, '/app/promotion')} to={LINKS.PROMOTION}> <MenuItem
leftIcon={<img src="/assets/images/icon/promotion.png"/>}
className={(this.state.selectedMenu === '/app/promotion') ? "menuAkunItem active" : 'menuAkunItem'}><span
className="menuAkun">Promotion</span></MenuItem></Link> : ''
*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/entities')} to={LINKS.ENTITIES}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/walter_white.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/entities') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Entities</span></MenuItem></Link>*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/agents')} to={LINKS.AGENT}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/conference.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/agents') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Agents</span></MenuItem></Link>*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, LINKS.EMPLOYEE)} to={LINKS.EMPLOYEE}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/employee.png"/>}*/}
{/*className={(this.state.selectedMenu === LINKS.EMPLOYEE) ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Employees</span></MenuItem></Link>*/}
{/*<Link onClick={this*/}
{/*.changeRoute*/}
{/*.bind(this, '/app/customers')} to={LINKS.CUSTOMER}> <MenuItem*/}
{/*leftIcon={<img src="/assets/images/icon/customer.png"/>}*/}
{/*className={(this.state.selectedMenu === '/app/customers') ? "menuAkunItem active" : 'menuAkunItem'}><span*/}
{/*className="menuAkun">Customers</span></MenuItem></Link>*/}
</Drawer>
<div className="mainContent" style={{
paddingLeft: (window.innerWidth < 600) ? '0px' : '50px',
marginLeft: (window.innerWidth < 600) ? 'auto' : 'auto',
marginRight: (window.innerWidth < 600) ? '0' : 'auto'
// paddingLeft: (window.innerWidth < 600) ? '0px' : '50px',
// marginLeft: (window.innerWidth < 600) ? 'auto' : '50px',
// marginRight: (window.innerWidth < 600) ? '0' : '50px',
}}>
<div className="try"/>
<Route/>

4
src/common/pages/App/style.scss
View File

@@ -1,6 +1,8 @@
.app-container {
.mainContent {
width: calc(100vw - 275px);
width: calc(100vw - 5vw);
margin-left: 2.5vw;
margin-right: 2.5vw;
position: relative;
}
@media screen and (max-width: 780px) {

334
src/common/pages/Items/All/index.js
View File

@@ -85,19 +85,19 @@ export default class All extends React.Component {
componentDidMount() {
// this.myStoreItem.isSearching = false;
if(this.userData.role == 'store') {
this.myStoreItem.getAll();
}
if(this.userData.role == 'administrator') {
this.myStoreItem.setRequestQuery({user_store_id : this.props.id});
console.log('ini id',this.props.id);
this.myStoreItem.getAll();
}
// if(this.userData.role == 'store') {
// this.myStoreItem.getAll();
// }
// if(this.userData.role == 'administrator') {
// this.myStoreItem.setRequestQuery({user_store_id : this.props.id});
// console.log('ini id',this.props.id);
// this.myStoreItem.getAll();
// }
}
componentWillUnmount(){
this.myStoreItem.isSearching = false;
this.myStoreItem.reset();
// this.myStoreItem.isSearching = false;
// this.myStoreItem.reset();
}
deleteClicked = (id) => {
@@ -145,7 +145,315 @@ export default class All extends React.Component {
render() {
console.log(this.myStoreItem.data.length);
const data = [
{
category_id: "1e444a5a-cf4d-48e5-bde4-0f984ebd557d",
created_at: "2019-01-02T04:00:08.803Z",
custom_fields: null,
deleted_at: null,
description: null,
height: "0.00",
id: "7e3072c1-9bfd-4b52-af38-9c6e30456c73",
images: {main: "https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png", gallery: ["https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png"]},
item_status_id: "2b1a2598-8333-4b19-ae7b-c054bec87540",
length: "0.00",
name: "Silly Oregano Seasoning",
odoo_additional_data: {product_id: 205, product_uom: 21, product_tmpl_id: 291},
product_id: 205,
product_tmpl_id: 291,
product_uom: 21,
odoo_stock_id: 123634,
order: 147291,
preorder: null,
regular_price: "10",
sale_date_from: null,
sale_date_to: null,
sale_price: null,
seen: 0,
sold: 0,
stock: "34.00",
uom: "pack",
updated_at: "2019-01-02T13:00:05.042Z",
use_weight_as_stock: false,
user_store_id: "959194a0-7067-400c-b354-2e8d03300660",
visible: true,
weight: "0.04",
width: "0.00",
wishlist: "0",
},{
category_id: "1e444a5a-cf4d-48e5-bde4-0f984ebd557d",
created_at: "2019-01-02T04:00:08.803Z",
custom_fields: null,
deleted_at: null,
description: null,
height: "0.00",
id: "7e3072c1-9bfd-4b52-af38-9c6e30456c73",
images: {main: "https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png", gallery: ["https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png"]},
item_status_id: "2b1a2598-8333-4b19-ae7b-c054bec87540",
length: "0.00",
name: "Silly Oregano Seasoning",
odoo_additional_data: {product_id: 205, product_uom: 21, product_tmpl_id: 291},
product_id: 205,
product_tmpl_id: 291,
product_uom: 21,
odoo_stock_id: 123634,
order: 147291,
preorder: null,
regular_price: "10",
sale_date_from: null,
sale_date_to: null,
sale_price: null,
seen: 0,
sold: 0,
stock: "34.00",
uom: "pack",
updated_at: "2019-01-02T13:00:05.042Z",
use_weight_as_stock: false,
user_store_id: "959194a0-7067-400c-b354-2e8d03300660",
visible: true,
weight: "0.04",
width: "0.00",
wishlist: "0",
},{
category_id: "1e444a5a-cf4d-48e5-bde4-0f984ebd557d",
created_at: "2019-01-02T04:00:08.803Z",
custom_fields: null,
deleted_at: null,
description: null,
height: "0.00",
id: "7e3072c1-9bfd-4b52-af38-9c6e30456c73",
images: {main: "https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png", gallery: ["https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png"]},
item_status_id: "2b1a2598-8333-4b19-ae7b-c054bec87540",
length: "0.00",
name: "Silly Oregano Seasoning",
odoo_additional_data: {product_id: 205, product_uom: 21, product_tmpl_id: 291},
product_id: 205,
product_tmpl_id: 291,
product_uom: 21,
odoo_stock_id: 123634,
order: 147291,
preorder: null,
regular_price: "10",
sale_date_from: null,
sale_date_to: null,
sale_price: null,
seen: 0,
sold: 0,
stock: "34.00",
uom: "pack",
updated_at: "2019-01-02T13:00:05.042Z",
use_weight_as_stock: false,
user_store_id: "959194a0-7067-400c-b354-2e8d03300660",
visible: true,
weight: "0.04",
width: "0.00",
wishlist: "0",
},{
category_id: "1e444a5a-cf4d-48e5-bde4-0f984ebd557d",
created_at: "2019-01-02T04:00:08.803Z",
custom_fields: null,
deleted_at: null,
description: null,
height: "0.00",
id: "7e3072c1-9bfd-4b52-af38-9c6e30456c73",
images: {main: "https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png", gallery: ["https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png"]},
item_status_id: "2b1a2598-8333-4b19-ae7b-c054bec87540",
length: "0.00",
name: "Silly Oregano Seasoning",
odoo_additional_data: {product_id: 205, product_uom: 21, product_tmpl_id: 291},
product_id: 205,
product_tmpl_id: 291,
product_uom: 21,
odoo_stock_id: 123634,
order: 147291,
preorder: null,
regular_price: "10",
sale_date_from: null,
sale_date_to: null,
sale_price: null,
seen: 0,
sold: 0,
stock: "34.00",
uom: "pack",
updated_at: "2019-01-02T13:00:05.042Z",
use_weight_as_stock: false,
user_store_id: "959194a0-7067-400c-b354-2e8d03300660",
visible: true,
weight: "0.04",
width: "0.00",
wishlist: "0",
},{
category_id: "1e444a5a-cf4d-48e5-bde4-0f984ebd557d",
created_at: "2019-01-02T04:00:08.803Z",
custom_fields: null,
deleted_at: null,
description: null,
height: "0.00",
id: "7e3072c1-9bfd-4b52-af38-9c6e30456c73",
images: {main: "https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png", gallery: ["https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png"]},
item_status_id: "2b1a2598-8333-4b19-ae7b-c054bec87540",
length: "0.00",
name: "Silly Oregano Seasoning",
odoo_additional_data: {product_id: 205, product_uom: 21, product_tmpl_id: 291},
product_id: 205,
product_tmpl_id: 291,
product_uom: 21,
odoo_stock_id: 123634,
order: 147291,
preorder: null,
regular_price: "10",
sale_date_from: null,
sale_date_to: null,
sale_price: null,
seen: 0,
sold: 0,
stock: "34.00",
uom: "pack",
updated_at: "2019-01-02T13:00:05.042Z",
use_weight_as_stock: false,
user_store_id: "959194a0-7067-400c-b354-2e8d03300660",
visible: true,
weight: "0.04",
width: "0.00",
wishlist: "0",
},{
category_id: "1e444a5a-cf4d-48e5-bde4-0f984ebd557d",
created_at: "2019-01-02T04:00:08.803Z",
custom_fields: null,
deleted_at: null,
description: null,
height: "0.00",
id: "7e3072c1-9bfd-4b52-af38-9c6e30456c73",
images: {main: "https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png", gallery: ["https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png"]},
item_status_id: "2b1a2598-8333-4b19-ae7b-c054bec87540",
length: "0.00",
name: "Silly Oregano Seasoning",
odoo_additional_data: {product_id: 205, product_uom: 21, product_tmpl_id: 291},
product_id: 205,
product_tmpl_id: 291,
product_uom: 21,
odoo_stock_id: 123634,
order: 147291,
preorder: null,
regular_price: "10",
sale_date_from: null,
sale_date_to: null,
sale_price: null,
seen: 0,
sold: 0,
stock: "34.00",
uom: "pack",
updated_at: "2019-01-02T13:00:05.042Z",
use_weight_as_stock: false,
user_store_id: "959194a0-7067-400c-b354-2e8d03300660",
visible: true,
weight: "0.04",
width: "0.00",
wishlist: "0",
},{
category_id: "1e444a5a-cf4d-48e5-bde4-0f984ebd557d",
created_at: "2019-01-02T04:00:08.803Z",
custom_fields: null,
deleted_at: null,
description: null,
height: "0.00",
id: "7e3072c1-9bfd-4b52-af38-9c6e30456c73",
images: {main: "https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png", gallery: ["https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png"]},
item_status_id: "2b1a2598-8333-4b19-ae7b-c054bec87540",
length: "0.00",
name: "Silly Oregano Seasoning",
odoo_additional_data: {product_id: 205, product_uom: 21, product_tmpl_id: 291},
product_id: 205,
product_tmpl_id: 291,
product_uom: 21,
odoo_stock_id: 123634,
order: 147291,
preorder: null,
regular_price: "10",
sale_date_from: null,
sale_date_to: null,
sale_price: null,
seen: 0,
sold: 0,
stock: "34.00",
uom: "pack",
updated_at: "2019-01-02T13:00:05.042Z",
use_weight_as_stock: false,
user_store_id: "959194a0-7067-400c-b354-2e8d03300660",
visible: true,
weight: "0.04",
width: "0.00",
wishlist: "0",
},{
category_id: "1e444a5a-cf4d-48e5-bde4-0f984ebd557d",
created_at: "2019-01-02T04:00:08.803Z",
custom_fields: null,
deleted_at: null,
description: null,
height: "0.00",
id: "7e3072c1-9bfd-4b52-af38-9c6e30456c73",
images: {main: "https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png", gallery: ["https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png"]},
item_status_id: "2b1a2598-8333-4b19-ae7b-c054bec87540",
length: "0.00",
name: "Silly Oregano Seasoning",
odoo_additional_data: {product_id: 205, product_uom: 21, product_tmpl_id: 291},
product_id: 205,
product_tmpl_id: 291,
product_uom: 21,
odoo_stock_id: 123634,
order: 147291,
preorder: null,
regular_price: "10",
sale_date_from: null,
sale_date_to: null,
sale_price: null,
seen: 0,
sold: 0,
stock: "34.00",
uom: "pack",
updated_at: "2019-01-02T13:00:05.042Z",
use_weight_as_stock: false,
user_store_id: "959194a0-7067-400c-b354-2e8d03300660",
visible: true,
weight: "0.04",
width: "0.00",
wishlist: "0",
},{
category_id: "1e444a5a-cf4d-48e5-bde4-0f984ebd557d",
created_at: "2019-01-02T04:00:08.803Z",
custom_fields: null,
deleted_at: null,
description: null,
height: "0.00",
id: "7e3072c1-9bfd-4b52-af38-9c6e30456c73",
images: {main: "https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png", gallery: ["https://marketplace-sillyfish-api.asacreative.com/uploads/item_123634.png"]},
item_status_id: "2b1a2598-8333-4b19-ae7b-c054bec87540",
length: "0.00",
name: "Silly Oregano Seasoning",
odoo_additional_data: {product_id: 205, product_uom: 21, product_tmpl_id: 291},
product_id: 205,
product_tmpl_id: 291,
product_uom: 21,
odoo_stock_id: 123634,
order: 147291,
preorder: null,
regular_price: "10",
sale_date_from: null,
sale_date_to: null,
sale_price: null,
seen: 0,
sold: 0,
stock: "34.00",
uom: "pack",
updated_at: "2019-01-02T13:00:05.042Z",
use_weight_as_stock: false,
user_store_id: "959194a0-7067-400c-b354-2e8d03300660",
visible: true,
weight: "0.04",
width: "0.00",
wishlist: "0",
}
];
const actionsDelete = [
<FlatButton
@@ -173,7 +481,7 @@ export default class All extends React.Component {
style={{fontSize: 14}}
hintStyle={{fontSize: 14}}
underlineShow={false}
onChange={this.search}
// onChange={this.search}
/>
</ToolbarGroup>
{/*<ToolbarGroup className="ToolbarGroupLast">*/}
@@ -244,7 +552,7 @@ export default class All extends React.Component {
</Col> : ""
}
{(this.myStoreItem.isSearching ? this.myStoreItem.dataFiltered : this.myStoreItem.data).map(item => {
{data.map(item => {
return (<Col key={item.id} className="gutter-row col" span={4} style={{marginBottom: 20}}>
<div className="gutter-box"><ItemCard data={item}/></div>
</Col>)

15
src/common/pages/Items/ItemCard/index.js
View File

@@ -31,8 +31,9 @@ export class ItemCard extends React.Component {
render() {
const {data = {}} = this.props;
const main = get(data,'images.main',null)
const mainImage = this.http.appendImagePath(main);
const main = get(data,'images.main',null);
// const mainImage = this.http.appendImagePath(main);
const mainImage = main;
return (
<Link to={`${LINKS.FORM_ITEMS}/edit/${data.id}`}>
@@ -43,10 +44,12 @@ export class ItemCard extends React.Component {
{/*<CardTitle style={{padding:8}} subtitleStyle={{display:'none'}} title={data.name} titleStyle={{fontSize: 12}}/>*/}
<CardTitle title={<Link to={`${LINKS.FORM_ITEMS}/${data.id}`}>{(data.name.length > 14) ? data.name.substring(0,13)+`...` : data.name}</Link>} titleStyle={{fontWeight: 'bold', fontSize: 18, lineHeight: '30px', whiteSpace: 'nowrap'}}
subtitle={<NumberFormat style={{fontWeight: 'bold', color: 'orangered'}}
value={data.regular_price}
displayType={'text'}
thousandSeparator={true} prefix={'Rp'}/>}/>
subtitle={<span style={{fontWeight: 'bold', color: 'orangered'}}>{data.regular_price} Points</span>}/>
{/*<CardTitle title={<Link to={`${LINKS.FORM_ITEMS}/${data.id}`}>{(data.name.length > 14) ? data.name.substring(0,13)+`...` : data.name}</Link>} titleStyle={{fontWeight: 'bold', fontSize: 18, lineHeight: '30px', whiteSpace: 'nowrap'}}*/}
{/*subtitle={<NumberFormat style={{fontWeight: 'bold', color: 'orangered'}}*/}
{/*value={data.regular_price}*/}
{/*displayType={'text'}*/}
{/*thousandSeparator={true} prefix={'Rp'}/>}/>*/}
{/*<CardText style={{padding: 8}}>*/}
{/*<p className="font-14" style={{marginBottom: 32, fontWeight: 'bold'}}>{data.name}</p>*/}

114
src/common/pages/Items/index.js
View File

@@ -1,22 +1,12 @@
import React from 'react';
import {inject, observer} from 'mobx-react';
import {Link} from 'react-router';
import { Affix, Card, Slider, Select } from 'antd';
import {Tab, Tabs} from 'material-ui';
import './style.scss';
import All from "./All/index";
import Active from "./Active/index";
import Unactive from "./Unactive/index";
import SoldOut from "./SoldOut/index";
import Banned from "./Banned/index";
export const ITEM_TABS = {
ALL: 'all',
ACTIVE: 'active',
UNACTIVE : 'unactive',
SOLD_OUT: 'sold_out',
BANNED: 'banned',
};
const Option = Select.Option;
@inject('appstate')
@observer
export default class ItemsComponent extends React.Component {
@@ -24,72 +14,70 @@ export default class ItemsComponent extends React.Component {
super(props);
this.props = props;
this.state = {
tabSelected: 'all',
valueMinimal: 0,
valueMaximal: 0,
};
this.handleChange = this.handleChange.bind(this);
this.defaultState = Object.assign({}, this.state);
this.http = props.appstate.http;
this.authStore = props.appstate.auth;
this.globalUI = props.appstate.globalUI;
this.appStore = props.appstate.app;
this.myStore = props.appstate.myStore;
}
componentDidMount() {
}
handleChange = (tabSelected) => {
this.setState({tabSelected: tabSelected});
this.globalUI.itemsTabSelected = tabSelected;
handleChangeMinimal = (valueMinimal) => {
this.setState({ valueMinimal });
};
getContent() {
switch (this.globalUI.itemsTabSelected) {
case ITEM_TABS.ALL:
return <All/>;
case ITEM_TABS.ACTIVE:
return <Active/>;
case ITEM_TABS.UNACTIVE:
return <Unactive/>;
case ITEM_TABS.SOLD_OUT:
return <SoldOut/>;
case ITEM_TABS.BANNED:
return <Banned/>;
default:
return <All/>
}
handleChangeMaximal = (valueMaximal) => {
this.setState({ valueMaximal });
};
handleChange = (value) => {
console.log(`selected ${value}`);
}
handleBlur = () => {
console.log('blur');
}
handleFocus = () => {
console.log('focus');
}
render() {
const {type:appType} = this.appStore;
const { valueMinimal, valueMaximal } = this.state;
return (
<div className="setting containerMiddle">
<div className="setting">
<div className="row">
<div className="col l12 m12 s12 no-padding">
<Tabs
value={this.globalUI.itemsTabSelected}
onChange={this.handleChange}
inkBarStyle={{background: 'transparent'}}
className="tabsAkun"
style={{background: 'transparent'}} >
<Tab label="All" value="all" className={(this.globalUI.itemsTabSelected === 'all') ? "buttonTabs buttonTabsActive" : 'buttonTabs'}>
</Tab>
<Tab label="Active" value="active" className={(this.globalUI.itemsTabSelected === 'active') ? "buttonTabs buttonTabsActive" : 'buttonTabs'}>
</Tab>
{/*<Tab label="Inactive" value="unactive" className={(this.globalUI.itemsTabSelected === 'unactive') ? "buttonTabs buttonTabsActive" : 'buttonTabs'}>
</Tab>*/}
<Tab label="Sold Out" value="sold_out" className={(this.globalUI.itemsTabSelected === 'sold_out') ? "buttonTabs buttonTabsActive" : 'buttonTabs'}>
</Tab>
{/*<Tab label="Banned" value="banned" className={(this.globalUI.itemsTabSelected === 'banned') ? "buttonTabs buttonTabsActive" : 'buttonTabs'}>*/}
{/**/}
{/*</Tab>*/}
</Tabs>
{this.getContent()}
<div className="col l3 m3 s3 no-padding">
<Affix offsetTop={90}>
<Card title="Filter" bordered={true} style={{ width: '100%' }}>
<p>Min. Points</p>
<Slider max={1000} onChange={this.handleChangeMinimal} value={valueMinimal} />
<p>Max. Points</p>
<Slider max={1000} onChange={this.handleChangeMaximal} value={valueMaximal} />
<p style={{marginTop: 25}}>Category</p>
<Select
showSearch
style={{ width: '100%' }}
placeholder="Select a category"
optionFilterProp="children"
onChange={this.handleChange}
onFocus={this.handleFocus}
onBlur={this.handleBlur}
// filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
>
<Option value="jack">Electronic</Option>
<Option value="lucy">Fashion</Option>
<Option value="tom">Food</Option>
</Select>
</Card>
</Affix>
</div>
<div className="col l9 m9 s9 no-padding">
<All/>
</div>
</div>
</div>