update: shop page
This commit is contained in:
Rifqy Zacky Ariadhy
parent
0794e91ad0
commit
e503b70640
|
|
@ -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/>
|
||||
|
|
|
|||
|
|
@ -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) {
|
||||
|
|
|
|||
|
|
@ -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>)
|
||||
|
|
|
|||
|
|
@ -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>*/}
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user