cart
This commit is contained in:
@@ -26,6 +26,7 @@ import {
|
|||||||
Toolbar, ToolbarGroup, ToolbarSeparator, ToolbarTitle, Badge
|
Toolbar, ToolbarGroup, ToolbarSeparator, ToolbarTitle, Badge
|
||||||
} from 'material-ui';
|
} from 'material-ui';
|
||||||
import IconUserCircle from 'material-ui/svg-icons/action/account-circle';
|
import IconUserCircle from 'material-ui/svg-icons/action/account-circle';
|
||||||
|
import ShoppingCart from 'material-ui/svg-icons/action/shopping-cart';
|
||||||
import DepositDialog from './../DepositDialog';
|
import DepositDialog from './../DepositDialog';
|
||||||
import WithdrawDialog from './../WithdrawDialog';
|
import WithdrawDialog from './../WithdrawDialog';
|
||||||
import IconMenus from 'material-ui/svg-icons/navigation/menu';
|
import IconMenus from 'material-ui/svg-icons/navigation/menu';
|
||||||
@@ -339,41 +340,41 @@ export default class App extends React.Component {
|
|||||||
message={this.globalUI.snackbarMessage}
|
message={this.globalUI.snackbarMessage}
|
||||||
autoHideDuration={3000}/>
|
autoHideDuration={3000}/>
|
||||||
|
|
||||||
{/*<Dialog*/}
|
<Dialog
|
||||||
{/*style={{margin: 'auto'}}*/}
|
style={{margin: 'auto'}}
|
||||||
{/*open={this.globalUI.loadingVisibility}>*/}
|
open={this.globalUI.loadingVisibility}>
|
||||||
{/*<div style={{textAlign: 'center'}}>*/}
|
<div style={{textAlign: 'center'}}>
|
||||||
{/*<LoadingDialog/>*/}
|
<LoadingDialog/>
|
||||||
{/*</div>*/}
|
</div>
|
||||||
{/*</Dialog>*/}
|
</Dialog>
|
||||||
{/*<DepositDialog/>*/}
|
<DepositDialog/>
|
||||||
{/*<WithdrawDialog/>*/}
|
<WithdrawDialog/>
|
||||||
|
|
||||||
|
|
||||||
<Toolbar className="toolbarAkunTiket">
|
<Toolbar className="toolbarAkunTiket">
|
||||||
<ToolbarGroup>
|
<ToolbarGroup>
|
||||||
<IconButton className="hide-on-med-and-up" onClick={() => this.toggleDrawer()}><IconMenus/></IconButton>
|
<IconButton className="hide-on-med-and-up" onClick={() => this.toggleDrawer()}><IconMenus/></IconButton>
|
||||||
|
|
||||||
{/*<ToolbarTitle className="show-on-small marketplace-toolbarTitle" style={{color: '#424770'}}*/}
|
{/* <ToolbarTitle className="show-on-small marketplace-toolbarTitle" style={{color: '#424770'}}
|
||||||
{/*text={"Store Admin"}/>*/}
|
text={"Store Admin"}/> */}
|
||||||
|
|
||||||
<img style={{width: 150, height: 50}} src={'http://btn-redemption-2.bangun-kreatif.com/dr6u0fppdi4xy.cloudfront.net/FilesDirectory/Albilad/ImgIconImage/logo-btn.png'} />
|
<img style={{width: 150, height: 50}} src={'http://btn-redemption-2.bangun-kreatif.com/dr6u0fppdi4xy.cloudfront.net/FilesDirectory/Albilad/ImgIconImage/logo-btn.png'} />
|
||||||
|
|
||||||
<ToolbarSeparator className="hide-on-small-only" style={{marginLeft: 30, marginRight: 30}}/>
|
<ToolbarSeparator className="hide-on-small-only" style={{marginLeft: 30, marginRight: 30}}/>
|
||||||
{/*<IconButton className="hide-on-small-only" style={{marginRight: 10}} onClick={() => this.toggleDrawer()}>*/}
|
<IconButton className="hide-on-small-only" style={{marginRight: 10}} onClick={() => this.toggleDrawer()}>
|
||||||
{/*<IconMenus/>*/}
|
<IconMenus/>
|
||||||
{/*</IconButton>*/}
|
</IconButton>
|
||||||
{/*<Button className="toolbar-button-sysinfo hide-on-small-only" size="small" type="dashed"*/}
|
{/* <Button className="toolbar-button-sysinfo hide-on-small-only" size="small" type="dashed"
|
||||||
{/*style={{marginRight: (window.innerWidth < 600) ? 2 : 10}}*/}
|
style={{marginRight: (window.innerWidth < 600) ? 2 : 10}}
|
||||||
{/*onClick={() => this.openNotification(null, "System Information", "This is your computer locale timezone", "clock-circle")}>*/}
|
onClick={() => this.openNotification(null, "System Information", "This is your computer locale timezone", "clock-circle")}>
|
||||||
{/*<Icon type="clock-circle"/> <span className="hide-on-small-only">{moment().format('h:mm:ss A')}</span>*/}
|
<Icon type="clock-circle"/> <span className="hide-on-small-only">{moment().format('h:mm:ss A')}</span>
|
||||||
{/*</Button>*/}
|
</Button>
|
||||||
|
|
||||||
{/*<Button className="toolbar-button-sysinfo hide-on-small-only" size="small" type="dashed"*/}
|
<Button className="toolbar-button-sysinfo hide-on-small-only" size="small" type="dashed"
|
||||||
{/*style={{marginRight: (window.innerWidth < 600) ? 2 : 10}}*/}
|
style={{marginRight: (window.innerWidth < 600) ? 2 : 10}}
|
||||||
{/*onClick={() => this.openNotification(null, "System Information", "This is your computer locale timezone", "environment")}>*/}
|
onClick={() => this.openNotification(null, "System Information", "This is your computer locale timezone", "environment")}>
|
||||||
{/*<Icon type="environment"/><span className="hide-on-small-only">{this.user.userGeolocation.ip}</span>*/}
|
<Icon type="environment"/><span className="hide-on-small-only">{this.user.userGeolocation.ip}</span>
|
||||||
{/*</Button>*/}
|
</Button> */}
|
||||||
|
|
||||||
<Link onClick={this
|
<Link onClick={this
|
||||||
.changeRoute
|
.changeRoute
|
||||||
@@ -417,132 +418,216 @@ export default class App extends React.Component {
|
|||||||
className={(this.state.selectedMenu === '/app/vouchers') ? "menuAkunItem active" : 'menuAkunItem'}><span
|
className={(this.state.selectedMenu === '/app/vouchers') ? "menuAkunItem active" : 'menuAkunItem'}><span
|
||||||
className="menuAkun">Vouchers</span></MenuItem></Link>
|
className="menuAkun">Vouchers</span></MenuItem></Link>
|
||||||
|
|
||||||
{/*<Button className="toolbar-button-sysinfo hide-on-small-only" size="small" type="dashed"*/}
|
{/* <Button className="toolbar-button-sysinfo hide-on-small-only" size="small" type="dashed"
|
||||||
{/*style={{marginRight: (window.innerWidth < 600) ? 2 : 10}}*/}
|
style={{marginRight: (window.innerWidth < 600) ? 2 : 10}}
|
||||||
{/*onClick={() => this.openNotification(null, "System Information", "This is your computer locale timezone", "calendar")}>*/}
|
onClick={() => this.openNotification(null, "System Information", "This is your computer locale timezone", "calendar")}>
|
||||||
{/*<Icon type="calendar"/><span className="hide-on-small-only">{this.user.userGeolocation.time_zone}</span>*/}
|
<Icon type="calendar"/><span className="hide-on-small-only">{this.user.userGeolocation.time_zone}</span>
|
||||||
{/*</Button>*/}
|
</Button>
|
||||||
|
|
||||||
{/*<Button className="toolbar-button-sysinfo hide-on-small-only" size="small" type="dashed"*/}
|
<Button className="toolbar-button-sysinfo hide-on-small-only" size="small" type="dashed"
|
||||||
{/*style={{marginRight: (window.innerWidth < 600) ? 2 : 10}}*/}
|
style={{marginRight: (window.innerWidth < 600) ? 2 : 10}}
|
||||||
{/*onClick={() => this.openNotification(null, "System Information", "This is your computer locale timezone", "home")}>*/}
|
onClick={() => this.openNotification(null, "System Information", "This is your computer locale timezone", "home")}>
|
||||||
{/*<Icon type="home"/> <span*/}
|
<Icon type="home"/> <span
|
||||||
{/*className="hide-on-small-only">{this.user.userGeolocation.latitude}, {this.user.userGeolocation.longitude}</span>*/}
|
className="hide-on-small-only">{this.user.userGeolocation.latitude}, {this.user.userGeolocation.longitude}</span>
|
||||||
{/*</Button>*/}
|
</Button> */}
|
||||||
|
|
||||||
</ToolbarGroup>
|
</ToolbarGroup>
|
||||||
{/*<ToolbarGroup>*/}
|
<ToolbarGroup>
|
||||||
{/*<IconMenu*/}
|
<IconMenu
|
||||||
{/*anchorOrigin={{vertical: 'bottom', horizontal: 'right'}}*/}
|
anchorOrigin={{vertical: 'bottom', horizontal: 'right'}}
|
||||||
{/*targetOrigin={{vertical: 'top', horizontal: 'right'}}*/}
|
targetOrigin={{vertical: 'top', horizontal: 'right'}}
|
||||||
{/*onClick={()=>this.notificationStore.readAll()}*/}
|
onClick={()=>this.notificationStore.readAll()}
|
||||||
{/*iconButtonElement={*/}
|
iconButtonElement={
|
||||||
{/*<div>*/}
|
<div>
|
||||||
{/*{userData.role === 'admin' ? (*/}
|
{userData.role === 'admin' ? (
|
||||||
{/*<div>*/}
|
<div>
|
||||||
{/*{this.notificationStore.unread_notif === 0 ?*/}
|
{this.notificationStore.unread_notif === 0 ?
|
||||||
{/*<IconButton className="menuAkunItem" tooltip="Notification center"*/}
|
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||||
{/*tooltipPosition="bottom-center">*/}
|
tooltipPosition="bottom-center">
|
||||||
{/*<img className="img-responsive" src="/assets/images/icon/toa.png" alt=""/>*/}
|
<ShoppingCart/>
|
||||||
{/*</IconButton> :*/}
|
</IconButton> :
|
||||||
{/*<Badge*/}
|
<Badge
|
||||||
{/*badgeContent={this.notificationStore.unread_notif}*/}
|
badgeContent={this.notificationStore.unread_notif}
|
||||||
{/*primary={true}*/}
|
primary={true}
|
||||||
{/*badgeStyle={{top: 15, right: 12}}*/}
|
badgeStyle={{top: 15, right: 12}}
|
||||||
{/*>*/}
|
>
|
||||||
{/*<IconButton className="menuAkunItem" tooltip="Notification center"*/}
|
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||||
{/*tooltipPosition="bottom-center">*/}
|
tooltipPosition="bottom-center">
|
||||||
{/*<img className="img-responsive" src="/assets/images/icon/toa.png" alt=""/>*/}
|
<ShoppingCart/>
|
||||||
{/*</IconButton>*/}
|
</IconButton>
|
||||||
{/*</Badge>*/}
|
</Badge>
|
||||||
{/*}*/}
|
}
|
||||||
{/*</div>*/}
|
</div>
|
||||||
{/*) : (*/}
|
) : (
|
||||||
{/*<div>*/}
|
<div>
|
||||||
{/*{this.notificationStore.unread_notif === 0 ?*/}
|
{this.notificationStore.unread_notif === 0 ?
|
||||||
{/*<IconButton className="menuAkunItem" tooltip="Notification center"*/}
|
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||||
{/*tooltipPosition="bottom-center">*/}
|
tooltipPosition="bottom-center">
|
||||||
{/*<img className="img-responsive" src="/assets/images/icon/toa.png" alt=""/>*/}
|
<ShoppingCart/>
|
||||||
{/*</IconButton> :*/}
|
</IconButton> :
|
||||||
{/*<Badge*/}
|
<Badge
|
||||||
{/*badgeContent={this.notificationStore.unread_notif}*/}
|
badgeContent={this.notificationStore.unread_notif}
|
||||||
{/*primary={true}*/}
|
primary={true}
|
||||||
{/*badgeStyle={{top: 15, right: 12}}*/}
|
badgeStyle={{top: 15, right: 12}}
|
||||||
{/*>*/}
|
>
|
||||||
{/*<IconButton className="menuAkunItem" tooltip="Notification center"*/}
|
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||||
{/*tooltipPosition="bottom-center">*/}
|
tooltipPosition="bottom-center">
|
||||||
{/*<img className="img-responsive" src="/assets/images/icon/toa.png" alt=""/>*/}
|
<ShoppingCart/>
|
||||||
{/*</IconButton>*/}
|
</IconButton>
|
||||||
{/*</Badge>*/}
|
</Badge>
|
||||||
{/*}*/}
|
}
|
||||||
{/*</div>*/}
|
</div>
|
||||||
{/*)}*/}
|
)}
|
||||||
|
|
||||||
{/*</div>*/}
|
</div>
|
||||||
{/*}*/}
|
}
|
||||||
{/*>*/}
|
>
|
||||||
{/*<List>*/}
|
<List>
|
||||||
{/*{*/}
|
{
|
||||||
{/*(this.notificationStore.list.length) ?*/}
|
(this.notificationStore.list.length) ?
|
||||||
{/*this.notificationStore.list.slice(0, 5).map((item, index) => {*/}
|
this.notificationStore.list.slice(0, 5).map((item, index) => {
|
||||||
{/*return (*/}
|
return (
|
||||||
{/*<Link to={onNotifRowClick(item)}>*/}
|
<Link to={onNotifRowClick(item)}>
|
||||||
{/*<ListItem*/}
|
<ListItem
|
||||||
{/*// leftAvatar={<Avatar src="images/ok-128.jpg" />}*/}
|
// leftAvatar={<Avatar src="images/ok-128.jpg" />}
|
||||||
{/*primaryText={item.notification.title}*/}
|
primaryText={item.notification.title}
|
||||||
{/*secondaryText={*/}
|
secondaryText={
|
||||||
{/*<div>*/}
|
<div>
|
||||||
{/*<p>*/}
|
<p>
|
||||||
{/*<span style={{color: darkBlack}}>{item.notification.description.substr(0,40)}{(item.notification.description.length > 40) ? '...' : ""}</span>*/}
|
<span style={{color: darkBlack}}>{item.notification.description.substr(0,40)}{(item.notification.description.length > 40) ? '...' : ""}</span>
|
||||||
{/*</p>*/}
|
</p>
|
||||||
{/*<p style={{fontSize:10,color:black}}>{moment(item.created_at).fromNow()}</p>*/}
|
<p style={{fontSize:10,color:black}}>{moment(item.created_at).fromNow()}</p>
|
||||||
{/*</div>*/}
|
</div>
|
||||||
{/*}*/}
|
}
|
||||||
{/*secondaryTextLines={2}*/}
|
secondaryTextLines={2}
|
||||||
{/*/>*/}
|
/>
|
||||||
{/*</Link>*/}
|
</Link>
|
||||||
{/*);*/}
|
);
|
||||||
{/*}) : <EmptyComponent width="" image="default4" type="empty" header="" content="No notification yet! "/>*/}
|
}) : <EmptyComponent width="" image="default4" type="empty" header="" content="No notification yet! "/>
|
||||||
{/*}*/}
|
}
|
||||||
{/*<Link to={`${LINKS.INBOX}/notification`}>*/}
|
<Link to={`${LINKS.INBOX}/notification`}>
|
||||||
{/*<ListItem*/}
|
<ListItem
|
||||||
{/*primaryText={*/}
|
primaryText={
|
||||||
{/*<div style={{textAlign:'center'}}>*/}
|
<div style={{textAlign:'center'}}>
|
||||||
{/*<p>View All</p>*/}
|
<p>View All</p>
|
||||||
{/*</div>*/}
|
</div>
|
||||||
{/*}*/}
|
}
|
||||||
{/*/>*/}
|
/>
|
||||||
{/*</Link>*/}
|
</Link>
|
||||||
{/*</List>*/}
|
</List>
|
||||||
{/*</IconMenu>*/}
|
</IconMenu>
|
||||||
|
|
||||||
{/*<IconMenu*/}
|
<IconMenu
|
||||||
{/*anchorOrigin={{vertical: 'bottom', horizontal: 'right'}}*/}
|
anchorOrigin={{vertical: 'bottom', horizontal: 'right'}}
|
||||||
{/*targetOrigin={{vertical: 'top', horizontal: 'right'}}*/}
|
targetOrigin={{vertical: 'top', horizontal: 'right'}}
|
||||||
{/*iconButtonElement={*/}
|
onClick={()=>this.notificationStore.readAll()}
|
||||||
{/*<IconButton style={{width: 'auto', height: 'auto'}} iconStyle={{width: 35, height: 'auto',borderRadius: '45%'}}>*/}
|
iconButtonElement={
|
||||||
{/*{!!this.profileStore.userProfile.photo?*/}
|
<div>
|
||||||
{/*<img src={this.http.appendImagePath(this.profileStore.userProfile.photo)}/> : <IconUserCircle/>*/}
|
{userData.role === 'admin' ? (
|
||||||
{/*}*/}
|
<div>
|
||||||
|
{this.notificationStore.unread_notif === 0 ?
|
||||||
|
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||||
|
tooltipPosition="bottom-center">
|
||||||
|
<img className="img-responsive" src="/assets/images/icon/toa.png" alt=""/>
|
||||||
|
</IconButton> :
|
||||||
|
<Badge
|
||||||
|
badgeContent={this.notificationStore.unread_notif}
|
||||||
|
primary={true}
|
||||||
|
badgeStyle={{top: 15, right: 12}}
|
||||||
|
>
|
||||||
|
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||||
|
tooltipPosition="bottom-center">
|
||||||
|
<img className="img-responsive" src="/assets/images/icon/toa.png" alt=""/>
|
||||||
|
</IconButton>
|
||||||
|
</Badge>
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div>
|
||||||
|
{this.notificationStore.unread_notif === 0 ?
|
||||||
|
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||||
|
tooltipPosition="bottom-center">
|
||||||
|
<img className="img-responsive" src="/assets/images/icon/toa.png" alt=""/>
|
||||||
|
</IconButton> :
|
||||||
|
<Badge
|
||||||
|
badgeContent={this.notificationStore.unread_notif}
|
||||||
|
primary={true}
|
||||||
|
badgeStyle={{top: 15, right: 12}}
|
||||||
|
>
|
||||||
|
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||||
|
tooltipPosition="bottom-center">
|
||||||
|
<img className="img-responsive" src="/assets/images/icon/toa.png" alt=""/>
|
||||||
|
</IconButton>
|
||||||
|
</Badge>
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
{/*</IconButton>*/}
|
</div>
|
||||||
{/*}*/}
|
}
|
||||||
{/*><List>*/}
|
>
|
||||||
{/*<ListItem*/}
|
<List>
|
||||||
{/*style={{padding: '0px 16px 0px', fontSize: 14}}*/}
|
{
|
||||||
{/*disabled={true}*/}
|
(this.notificationStore.list.length) ?
|
||||||
{/*primaryText={<span style={{fontWeight: 500}}>{this.authStore.userProfile.username || 'Username'}</span>}*/}
|
this.notificationStore.list.slice(0, 5).map((item, index) => {
|
||||||
{/*secondaryText={<p style={{fontWeight: 400}}>{_.capitalize(this.authStore.userProfile.role) || 'role'}</p>}*/}
|
return (
|
||||||
{/*/>*/}
|
<Link to={onNotifRowClick(item)}>
|
||||||
{/*</List>*/}
|
<ListItem
|
||||||
{/*<Divider/>*/}
|
// leftAvatar={<Avatar src="images/ok-128.jpg" />}
|
||||||
{/*<Link onClick={this*/}
|
primaryText={item.notification.title}
|
||||||
{/*.changeRoute*/}
|
secondaryText={
|
||||||
{/*.bind(this, '/app/profile')} to={LINKS.PROFILE}> <MenuItem style={{fontSize: 14}}*/}
|
<div>
|
||||||
{/*primaryText="Profile"/></Link>*/}
|
<p>
|
||||||
{/*<MenuItem onClick={this.willLogout.bind(this)} style={{fontSize: 14}} primaryText="Sign out"/>*/}
|
<span style={{color: darkBlack}}>{item.notification.description.substr(0,40)}{(item.notification.description.length > 40) ? '...' : ""}</span>
|
||||||
{/*</IconMenu>*/}
|
</p>
|
||||||
{/*</ToolbarGroup>*/}
|
<p style={{fontSize:10,color:black}}>{moment(item.created_at).fromNow()}</p>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
secondaryTextLines={2}
|
||||||
|
/>
|
||||||
|
</Link>
|
||||||
|
);
|
||||||
|
}) : <EmptyComponent width="" image="default4" type="empty" header="" content="No notification yet! "/>
|
||||||
|
}
|
||||||
|
<Link to={`${LINKS.INBOX}/notification`}>
|
||||||
|
<ListItem
|
||||||
|
primaryText={
|
||||||
|
<div style={{textAlign:'center'}}>
|
||||||
|
<p>View All</p>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
</Link>
|
||||||
|
</List>
|
||||||
|
</IconMenu>
|
||||||
|
|
||||||
|
<IconMenu
|
||||||
|
anchorOrigin={{vertical: 'bottom', horizontal: 'right'}}
|
||||||
|
targetOrigin={{vertical: 'top', horizontal: 'right'}}
|
||||||
|
iconButtonElement={
|
||||||
|
<IconButton style={{width: 'auto', height: 'auto'}} iconStyle={{width: 35, height: 'auto',borderRadius: '45%'}}>
|
||||||
|
{!!this.profileStore.userProfile.photo?
|
||||||
|
<img src={this.http.appendImagePath(this.profileStore.userProfile.photo)}/> : <IconUserCircle/>
|
||||||
|
}
|
||||||
|
|
||||||
|
</IconButton>
|
||||||
|
}
|
||||||
|
><List>
|
||||||
|
<ListItem
|
||||||
|
style={{padding: '0px 16px 0px', fontSize: 14}}
|
||||||
|
disabled={true}
|
||||||
|
primaryText={<span style={{fontWeight: 500}}>{this.authStore.userProfile.username || 'Username'}</span>}
|
||||||
|
secondaryText={<p style={{fontWeight: 400}}>{_.capitalize(this.authStore.userProfile.role) || 'role'}</p>}
|
||||||
|
/>
|
||||||
|
</List>
|
||||||
|
<Divider/>
|
||||||
|
<Link onClick={this
|
||||||
|
.changeRoute
|
||||||
|
.bind(this, '/app/profile')} to={LINKS.PROFILE}> <MenuItem style={{fontSize: 14}}
|
||||||
|
primaryText="Profile"/></Link>
|
||||||
|
<MenuItem onClick={this.willLogout.bind(this)} style={{fontSize: 14}} primaryText="Sign out"/>
|
||||||
|
</IconMenu>
|
||||||
|
</ToolbarGroup>
|
||||||
</Toolbar>
|
</Toolbar>
|
||||||
|
|
||||||
<div className="mainContent" style={{
|
<div className="mainContent" style={{
|
||||||
|
|||||||
Reference in New Issue
Block a user