Merge branch 'master' of https://gitlab.com/asacreative/redemption-point/new-frontend-customer-redemption-point
This commit is contained in:
BIN
assets/images/emptyState/coupon.png
Normal file
BIN
assets/images/emptyState/coupon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
BIN
assets/images/login/background.jpg
Normal file
BIN
assets/images/login/background.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
assets/images/logo-bankbtn.png
Normal file
BIN
assets/images/logo-bankbtn.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
2
package-lock.json
generated
2
package-lock.json
generated
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"name": "marketplace",
|
||||
"name": "BTN",
|
||||
"version": "1.0.0",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"name": "marketplace",
|
||||
"name": "BTN",
|
||||
"version": "1.0.0",
|
||||
"description": "Server-side rendering with mobx and react-router",
|
||||
"main": "src/index.js",
|
||||
@@ -19,7 +19,7 @@
|
||||
"author": "Asacreative",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://gitlab.com/asacreative/marketplace-admin.git"
|
||||
"url": "https://gitlab.com/asacreative/redemption-point/new-frontend-customer-redemption-point"
|
||||
},
|
||||
"browserslist": [
|
||||
"last 1 version",
|
||||
|
||||
@@ -2,9 +2,9 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Marketplace</title>
|
||||
<title>BTN</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<link rel="icon" type="image/png" href="/assets/images/logo_ikan.png" sizes="96x96" />
|
||||
<link rel="icon" type="image/png" href="/assets/images/logo-bankbtn.png" sizes="96x96" />
|
||||
<style>
|
||||
body {
|
||||
visibility: hidden;
|
||||
|
||||
@@ -2,9 +2,9 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Marketplace</title>
|
||||
<title>BTN</title>
|
||||
<meta id="viewport" name="viewport" content="width=1280">
|
||||
<link rel="icon" type="image/png" href="/assets/images/logo_ikan.png" sizes="96x96" />
|
||||
<link rel="icon" type="image/png" href="/assets/images/logo-bankbtn.png" sizes="96x96" />
|
||||
<style>
|
||||
body {
|
||||
visibility: hidden;
|
||||
|
||||
@@ -2,9 +2,9 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Marketplace</title>
|
||||
<title>BTN</title>
|
||||
<meta id="viewport" name="viewport" content="width=1280">
|
||||
<link rel="icon" type="image/png" href="/assets/images/logo_ikan.png" sizes="96x96" />
|
||||
<link rel="icon" type="image/png" href="/assets/images/logo-bankbtn.png" sizes="96x96" />
|
||||
<style>
|
||||
body {
|
||||
visibility: hidden;
|
||||
|
||||
@@ -2,9 +2,9 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Marketplace</title>
|
||||
<title>BTN</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<link rel="icon" type="image/png" href="/assets/images/logo_ikan.png" sizes="96x96" />
|
||||
<link rel="icon" type="image/png" href="/assets/images/logo-bankbtn.png" sizes="96x96" />
|
||||
<style>
|
||||
body {
|
||||
visibility: hidden;
|
||||
|
||||
@@ -21,8 +21,12 @@ let type = 'akuntiket';
|
||||
|
||||
// apiUrl = "https://marketplace-sillyfish-staging-api.asacreative.com/v1/";
|
||||
// imageUrl = "https://marketplace-sillyfish-staging-api.asacreative.com";
|
||||
apiUrl = "https://marketplace-sillyfish-api.asacreative.com/v1/";
|
||||
imageUrl = "https://marketplace-sillyfish-api.asacreative.com";
|
||||
// apiUrl = "https://marketplace-sillyfish-api.asacreative.com/v1/";
|
||||
// imageUrl = "https://marketplace-sillyfish-api.asacreative.com";
|
||||
|
||||
apiUrl = "https://giift-api.asacreative.com/";
|
||||
imageUrl = "https://giift-api.asacreative.com";
|
||||
|
||||
type = 'localhost';
|
||||
if(window.location.href.includes("localhost") || window.location.href.includes("marketplace-store")){
|
||||
appUrl = 'http://localhost:7700'
|
||||
|
||||
@@ -145,13 +145,13 @@ export default class AcceptInvite extends React.Component {
|
||||
style={{marginRight: 10}}
|
||||
/>
|
||||
];
|
||||
// const applicationIcon = (this.settingStore.isIconEmpty) ? "/assets/images/logo_ikan.png" : this.http.appendImagePath(this.settingStore.setting.icon);
|
||||
const applicationIcon = "/assets/images/logo_ikan.png";
|
||||
// const applicationIcon = (this.settingStore.isIconEmpty) ? "/assets/images/bankbtn.png" : this.http.appendImagePath(this.settingStore.setting.icon);
|
||||
const applicationIcon = "/assets/images/bankbtn.png";
|
||||
return (
|
||||
<div className="AcceptInvite">
|
||||
<Helmet>
|
||||
<meta charSet="utf-8"/>
|
||||
<title>Marketplace</title>
|
||||
<title>BTN</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<link rel="icon" type="image/png" href={applicationIcon} sizes="96x96"/>
|
||||
</Helmet>
|
||||
@@ -168,7 +168,7 @@ export default class AcceptInvite extends React.Component {
|
||||
marginRight: "auto",
|
||||
marginLeft: "auto"
|
||||
}} zDepth={1} circle={true}>
|
||||
<img className="logo" src="/assets/images/logo_ikan.png"/>
|
||||
<img className="logo" src="/assets/images/bankbtn.png"/>
|
||||
</Paper>
|
||||
<h2 style={{
|
||||
color: '#275164',
|
||||
@@ -177,7 +177,7 @@ export default class AcceptInvite extends React.Component {
|
||||
maxWidth: 500,
|
||||
marginTop: 15,
|
||||
marginBottom: 0
|
||||
}}>Marketplace</h2>
|
||||
}}>BTN</h2>
|
||||
</div>
|
||||
:
|
||||
<div style={{textAlign: "center"}}>
|
||||
@@ -190,7 +190,7 @@ export default class AcceptInvite extends React.Component {
|
||||
marginRight: "auto",
|
||||
marginLeft: "auto"
|
||||
}} zDepth={1} circle={true}>
|
||||
<img className="logo" src={'/assets/images/logo_ikan.png'}/>
|
||||
<img className="logo" src={'/assets/images/bankbtn.png'}/>
|
||||
</Paper>
|
||||
<h2 style={{
|
||||
color: '#275164',
|
||||
@@ -211,7 +211,7 @@ export default class AcceptInvite extends React.Component {
|
||||
marginRight: "auto",
|
||||
marginLeft: "auto"
|
||||
}} zDepth={1} circle={true}>
|
||||
<img className="logo" src={'/assets/images/logo_ikan.png'}/>
|
||||
<img className="logo" src={'/assets/images/bankbtn.png'}/>
|
||||
</Paper>
|
||||
<h2 style={{
|
||||
color: '#275164',
|
||||
@@ -220,7 +220,7 @@ export default class AcceptInvite extends React.Component {
|
||||
maxWidth: 500,
|
||||
marginTop: 15,
|
||||
marginBottom: 0
|
||||
}}>Marketplace</h2>
|
||||
}}>BTN</h2>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
@@ -314,8 +314,8 @@ export default class App extends React.Component {
|
||||
// }
|
||||
|
||||
const {userData} = this.appstate;
|
||||
// const applicationIcon = (this.settingStore.isIconEmpty) ? "/assets/images/logo_ikan.png" : this.http.appendImagePath(this.settingStore.setting.icon);
|
||||
const applicationIcon = "/assets/images/logo_ikan.png";
|
||||
// const applicationIcon = (this.settingStore.isIconEmpty) ? "/assets/images/bankbtn.png" : this.http.appendImagePath(this.settingStore.setting.icon);
|
||||
const applicationIcon = "/assets/images/bankbtn.png";
|
||||
|
||||
let onNotifRowClick = (record) => {
|
||||
// if(record.notification.type == 'order_seller' && _.get(record,'notification.additional_data.user_order_store_id',false) != false){
|
||||
@@ -332,7 +332,7 @@ export default class App extends React.Component {
|
||||
<div className="app-container">
|
||||
<Helmet>
|
||||
<meta charSet="utf-8"/>
|
||||
<title>Marketplace</title>
|
||||
<title>BTN</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<link rel="icon" type="image/png" href={applicationIcon} sizes="96x96"/>
|
||||
</Helmet>
|
||||
@@ -457,52 +457,17 @@ export default class App extends React.Component {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<IconMenu
|
||||
{window.location.pathname.split("/")[2] == "shop" ? (
|
||||
<IconMenu
|
||||
anchorOrigin={{vertical: 'bottom', horizontal: 'right'}}
|
||||
targetOrigin={{vertical: 'top', horizontal: 'right'}}
|
||||
onClick={() => this.notificationStore.readAll()}
|
||||
iconButtonElement={
|
||||
<div>
|
||||
{userData.role === 'admin' ? (
|
||||
<div>
|
||||
{this.notificationStore.unread_notif === 0 ?
|
||||
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||
<IconButton className="menuAkunItem" tooltip="Cart center"
|
||||
tooltipPosition="bottom-center">
|
||||
<ShoppingCart/>
|
||||
</IconButton> :
|
||||
<Badge
|
||||
badgeContent={this.notificationStore.unread_notif}
|
||||
primary={true}
|
||||
badgeStyle={{top: 15, right: 12}}
|
||||
>
|
||||
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||
tooltipPosition="bottom-center">
|
||||
<ShoppingCart/>
|
||||
</IconButton>
|
||||
</Badge>
|
||||
}
|
||||
</div>
|
||||
) : (
|
||||
<div>
|
||||
{this.notificationStore.unread_notif === 0 ?
|
||||
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||
tooltipPosition="bottom-center">
|
||||
<ShoppingCart/>
|
||||
</IconButton> :
|
||||
<Badge
|
||||
badgeContent={this.notificationStore.unread_notif}
|
||||
primary={true}
|
||||
badgeStyle={{top: 15, right: 12}}
|
||||
>
|
||||
<IconButton className="menuAkunItem" tooltip="Notification center"
|
||||
tooltipPosition="bottom-center">
|
||||
<ShoppingCart/>
|
||||
</IconButton>
|
||||
</Badge>
|
||||
}
|
||||
</div>
|
||||
)}
|
||||
|
||||
</IconButton>
|
||||
</div>
|
||||
}
|
||||
>
|
||||
@@ -542,6 +507,8 @@ export default class App extends React.Component {
|
||||
</Link>
|
||||
</List>
|
||||
</IconMenu>
|
||||
) : (<div/>)}
|
||||
|
||||
|
||||
<IconMenu
|
||||
anchorOrigin={{vertical: 'bottom', horizontal: 'right'}}
|
||||
@@ -615,7 +582,7 @@ export default class App extends React.Component {
|
||||
</Link>
|
||||
);
|
||||
}) : <EmptyComponent width="" image="default4" type="empty" header=""
|
||||
content="No notification yet! "/>
|
||||
content="No item yet! "/>
|
||||
}
|
||||
<Link to={`${LINKS.CART_DETAIL}`}>
|
||||
<ListItem
|
||||
@@ -660,7 +627,11 @@ export default class App extends React.Component {
|
||||
.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"/>
|
||||
<Link onClick={this
|
||||
.changeRoute
|
||||
.bind(this, '/login')} to={LINKS.LOGIN}>
|
||||
<MenuItem onClick={() => {}} style={{fontSize: 14}} primaryText="Sign out"/>
|
||||
</Link>
|
||||
</IconMenu>
|
||||
</ToolbarGroup>
|
||||
</Toolbar>
|
||||
|
||||
@@ -4,12 +4,14 @@
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
width: 11vw;
|
||||
// width: 11vw;
|
||||
height: 70px;
|
||||
align-items: center;
|
||||
margin-right: 15px;
|
||||
|
||||
.containerVoucher{
|
||||
margin-left: 16px;
|
||||
margin-right: 16px;
|
||||
|
||||
.titleVoucher{
|
||||
margin-bottom: 0px;
|
||||
@@ -124,7 +126,7 @@
|
||||
font-size: 13px !important;
|
||||
font-weight: 500 !important;
|
||||
color: #424770 !important;
|
||||
margin-left: -20px !important;
|
||||
// margin-left: -20px !important;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
@@ -146,7 +148,7 @@
|
||||
}
|
||||
|
||||
.menuAkunItem {
|
||||
padding: 0px;
|
||||
padding: 0px 16px;
|
||||
transition: all 0.2s ease !important;
|
||||
}
|
||||
|
||||
@@ -178,7 +180,7 @@
|
||||
|
||||
.menuAkun {
|
||||
letter-spacing: 0.03em;
|
||||
margin-right: 20px;
|
||||
// margin-right: 20px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -147,9 +147,9 @@ export default class ChangePassword extends React.Component {
|
||||
|
||||
return (
|
||||
<div className="AcceptInvite">
|
||||
<img className="logo" src="/assets/images/logo_ikan.png" style={{maxWidth : '200px'}}/>
|
||||
<img className="logo" src="/assets/images/bankbtn.png" style={{maxWidth : '200px'}}/>
|
||||
<h1 style={{color:'#275164'}}>5 Roti dan 2 Ikan</h1>
|
||||
<h4 style={{color:'#55dab6'}}>Marketplace</h4>
|
||||
<h4 style={{color:'#55dab6'}}>BTN</h4>
|
||||
<Card style={{width:450, marginTop:'18px'}} className="cardLite">
|
||||
<CardTitle className="align-center" title={<p style={{fontSize:14}}>Confirm Password</p>}>
|
||||
<Divider style={{backgroundColor:'#48d8b2', width:'150px'}} className="margin-auto"/>
|
||||
|
||||
@@ -47,7 +47,25 @@ export default class EmptyComponent extends React.Component {
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
else if(type == "default4"){
|
||||
return(
|
||||
<div style={{textAlign: 'center', padding: '20px'}}>
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css?family=Raleway');
|
||||
</style>
|
||||
<div className="row">
|
||||
<div className="col m12">
|
||||
<img src="../../../../assets/images/emptyState/coupon.png" width="200px" height="200px"/>
|
||||
</div>
|
||||
<div className="col m12">
|
||||
<h1>{this.props.header}</h1>
|
||||
<h3 style={{marginTop: '10px', color: '#808080', fontFamily: 'Raleway, sans-serif'}}>{this.props.content}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
else if(type == "404"){
|
||||
return(
|
||||
<div style={{textAlign: 'center', padding: '20px'}}>
|
||||
|
||||
@@ -83,8 +83,8 @@ export default class ForgotPasswordComponent extends React.Component {
|
||||
/>
|
||||
];
|
||||
|
||||
// const applicationIcon = (this.settingStore.isIconEmpty) ? "/assets/images/logo_ikan.png" : this.http.appendImagePath(this.settingStore.setting.icon);
|
||||
const applicationIcon = "/assets/images/logo_ikan.png";
|
||||
// const applicationIcon = (this.settingStore.isIconEmpty) ? "/assets/images/bankbtn.png" : this.http.appendImagePath(this.settingStore.setting.icon);
|
||||
const applicationIcon = "/assets/images/bankbtn.png";
|
||||
return (
|
||||
<div className="login">
|
||||
<Helmet>
|
||||
@@ -106,7 +106,7 @@ export default class ForgotPasswordComponent extends React.Component {
|
||||
marginRight: "auto",
|
||||
marginLeft: "auto"
|
||||
}} zDepth={1} circle={true}>
|
||||
<img className="logo" src="/assets/images/logo_ikan.png"/>
|
||||
<img className="logo" src="/assets/images/bankbtn.png"/>
|
||||
</Paper>
|
||||
<h2 style={{
|
||||
color: '#275164',
|
||||
@@ -160,7 +160,7 @@ export default class ForgotPasswordComponent extends React.Component {
|
||||
maxWidth: 500,
|
||||
marginTop: 15,
|
||||
marginBottom: 0
|
||||
}}>Marketplace</h2>
|
||||
}}>BTN</h2>
|
||||
</div>
|
||||
</div>
|
||||
<Card style={{width: 350, marginTop: '18px'}} className="cardLite align-center">
|
||||
|
||||
@@ -1,11 +1,8 @@
|
||||
import React from 'react';
|
||||
import {Card, CardActions, CardText, CardTitle, Divider, Paper,RaisedButton, TextField,Dialog,FlatButton,} from 'material-ui';
|
||||
import {TextField, RaisedButton} from 'material-ui';
|
||||
import {inject, observer} from 'mobx-react';
|
||||
import * as firebase from "firebase";
|
||||
import './style.scss'
|
||||
import {LINKS} from "../../routes";
|
||||
import {getMobileOperatingSystem} from '../../stores/firebase';
|
||||
import {Helmet} from "react-helmet";
|
||||
|
||||
|
||||
@inject('appstate')
|
||||
@@ -17,256 +14,40 @@ export default class LoginComponent extends React.Component {
|
||||
this.state = {
|
||||
email: "",
|
||||
password: "",
|
||||
warningLogin : false,
|
||||
warningLoginMessage : '',
|
||||
notif:false,
|
||||
};
|
||||
this.defaultState = Object.assign({}, this.state);
|
||||
this.authStore = props.appstate.auth;
|
||||
this.http = props.appstate.http;
|
||||
this.settingStore = props.appstate.setting;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.settingStore.getAll();
|
||||
const firebase = require('firebase');
|
||||
firebase.messaging().requestPermission()
|
||||
.then(function () {
|
||||
console.log('Notification permission granted.');
|
||||
return firebase.messaging().getToken();
|
||||
})
|
||||
.then(currentToken => {
|
||||
if (currentToken) {
|
||||
console.log(currentToken, "user tokens");
|
||||
localStorage.setItem('tokens', currentToken);
|
||||
} else {
|
||||
// Show permission request.
|
||||
console.log('No Instance ID token available. Request permission to generate one.');
|
||||
// Show permission UI.
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
handleTextFieldChange = (event, name) => {
|
||||
this.setState({
|
||||
[name]: event.target.value
|
||||
});
|
||||
};
|
||||
|
||||
login=(e)=>{
|
||||
firebase.messaging().requestPermission()
|
||||
.then(() => {
|
||||
// alert('bisa')
|
||||
|
||||
// e.preventDefault();
|
||||
var tokenNotif = localStorage.getItem('tokens');
|
||||
this.authStore.login({
|
||||
username: this.state.email,
|
||||
password: this.state.password,
|
||||
firebase_token: tokenNotif
|
||||
})
|
||||
.then(() => {
|
||||
localStorage.setItem('isLoggedIn', true);
|
||||
this.props.history.push(LINKS.DASHBOARD);
|
||||
console.log(this.state.email + " is logging in..")
|
||||
}).catch(err => {
|
||||
console.log(err);
|
||||
this.openWarningMessage(err.message);
|
||||
});
|
||||
|
||||
})
|
||||
.catch(error => {
|
||||
this.setState({
|
||||
notif:true
|
||||
})
|
||||
// alert('gk bisa')
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
openWarningMessage = (message)=>{
|
||||
this.setState({
|
||||
warningLoginMessage : message,
|
||||
warningLogin : true
|
||||
})
|
||||
}
|
||||
|
||||
closeWarning = ()=>{
|
||||
this.setState({
|
||||
warningLogin : false
|
||||
})
|
||||
}
|
||||
|
||||
handleClose = ()=>{
|
||||
this.setState({
|
||||
notif : false
|
||||
})
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
const actions = [
|
||||
<RaisedButton
|
||||
label={"Ok"}
|
||||
primary={true}
|
||||
onClick={()=>this.closeWarning()}
|
||||
/>,
|
||||
];
|
||||
|
||||
const actionsNotif = [
|
||||
<RaisedButton
|
||||
label="Done"
|
||||
primary={true}
|
||||
onClick={this.handleClose}
|
||||
/>,
|
||||
];
|
||||
|
||||
// const applicationIcon = (this.settingStore.isIconEmpty) ? "/assets/images/logo_ikan.png" : this.http.appendImagePath(this.settingStore.setting.icon);
|
||||
const applicationIcon = "/assets/images/logo_ikan.png";
|
||||
return (
|
||||
<div className="login login-wrapper">
|
||||
<Helmet>
|
||||
<meta charSet="utf-8"/>
|
||||
<title>{/*(this.settingStore.setting.name) ? this.settingStore.setting.name : ""*/'Marketplace'}</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<link rel="icon" type="image/png" href={applicationIcon} sizes="96x96"/>
|
||||
</Helmet>
|
||||
<div style={{width: "100%"}}>
|
||||
{/*
|
||||
(this.settingStore.isIconEmpty) ?
|
||||
<div style={{textAlign: "center"}}>
|
||||
<Paper style={{
|
||||
backgroundSize: "contain",
|
||||
backgroundClip: "padding-box",
|
||||
padding: 10,
|
||||
height: 75, width: 75,
|
||||
background: '#fff',
|
||||
marginRight: "auto",
|
||||
marginLeft: "auto"
|
||||
}} zDepth={1} circle={true}>
|
||||
<img className="logo" src="/assets/images/logo_ikan.png"/>
|
||||
</Paper>
|
||||
<h2 style={{
|
||||
color: '#000',
|
||||
marginRight: "auto",
|
||||
marginLeft: "auto",
|
||||
maxWidth: 500,
|
||||
marginTop: 15,
|
||||
marginBottom: 0
|
||||
}}>5 Roti dan 2 Ikan</h2>
|
||||
</div>
|
||||
:
|
||||
<div style={{textAlign: "center"}}>
|
||||
<Paper style={{
|
||||
backgroundSize: "contain",
|
||||
backgroundClip: "padding-box",
|
||||
padding: 10,
|
||||
height: 75, width: 75,
|
||||
background: '#fff',
|
||||
marginRight: "auto",
|
||||
marginLeft: "auto"
|
||||
}} zDepth={1} circle={true}>
|
||||
<img className="logo"
|
||||
src={this.http.appendImagePath(this.settingStore.setting.icon)}/>
|
||||
</Paper>
|
||||
<h2 style={{
|
||||
color: '#275164',
|
||||
marginRight: "auto",
|
||||
marginLeft: "auto",
|
||||
maxWidth: 500,
|
||||
marginTop: 15,
|
||||
marginBottom: 0
|
||||
}}>{this.settingStore.setting.name}</h2>
|
||||
</div>
|
||||
*/
|
||||
}
|
||||
<div style={{textAlign: "center"}}>
|
||||
<Paper style={{
|
||||
backgroundSize: "contain",
|
||||
backgroundClip: "padding-box",
|
||||
padding: 10,
|
||||
height: 75, width: 75,
|
||||
background: '#fff',
|
||||
marginRight: "auto",
|
||||
marginLeft: "auto"
|
||||
}} zDepth={1} circle={true}>
|
||||
<img className="logo" src={applicationIcon}/>
|
||||
</Paper>
|
||||
<h2 style={{
|
||||
color: '#000',
|
||||
marginRight: "auto",
|
||||
marginLeft: "auto",
|
||||
maxWidth: 500,
|
||||
marginTop: 15,
|
||||
marginBottom: 0
|
||||
}}>Marketplace</h2>
|
||||
</div>
|
||||
</div>
|
||||
<Card style={{width: 350, marginTop: '18px'}} className="cardLite align-center">
|
||||
<CardTitle title={<p style={{fontSize: 14}}>Login to Store Admin Console</p>}>
|
||||
<Divider style={{backgroundColor: 'rgba(171, 111, 48, 1)', width: '150px'}} className="margin-auto"/>
|
||||
</CardTitle>
|
||||
<div className="loginWrapper">
|
||||
<div className={'formContainer'}>
|
||||
<img className={'logoLogin'} src={'http://btn-redemption-2.bangun-kreatif.com/dr6u0fppdi4xy.cloudfront.net/FilesDirectory/Albilad/ImgIconImage/logo-btn.png'} />
|
||||
<p className={'textLogin'}>Login into our System</p>
|
||||
|
||||
<form>
|
||||
<CardText>
|
||||
<TextField
|
||||
hintText="Email"
|
||||
fullWidth={true}
|
||||
name="email"
|
||||
type="email"
|
||||
value={this.state.email}
|
||||
onChange={(event) => this.handleTextFieldChange(event, 'email')}
|
||||
<div className={'formParent'}>
|
||||
<div className={'inputContainer'}>
|
||||
<input
|
||||
className={'usernameForm'}
|
||||
placeholder="Username"
|
||||
/>
|
||||
<TextField
|
||||
hintText="Password"
|
||||
name="password"
|
||||
fullWidth={true}
|
||||
<input
|
||||
className={'passwordForm'}
|
||||
placeholder="Password"
|
||||
type="password"
|
||||
value={this.state.password}
|
||||
onChange={(event) => this.handleTextFieldChange(event, 'password')}
|
||||
onKeyPress={(ev) => {
|
||||
if (ev.key === 'Enter') {
|
||||
// Do code here
|
||||
this.login()
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</CardText>
|
||||
<CardActions>
|
||||
<RaisedButton primary={true} label="Login To Your Account" onClick={this.login}/>
|
||||
</CardActions>
|
||||
<a style={{fontSize: 12, fontWeight: 500, display: 'block', margin: '18px 0px 30px'}}
|
||||
onClick={() => this.props.history.push(LINKS.FORGOT_PASSWORD)}>Forgot Password</a>
|
||||
</form>
|
||||
</Card>
|
||||
<Dialog
|
||||
title="Error"
|
||||
actions={actions}
|
||||
modal={true}
|
||||
open={this.state.warningLogin}
|
||||
onRequestClose={() => this.closeWarning()}
|
||||
>
|
||||
{this.state.warningLoginMessage}
|
||||
</Dialog>
|
||||
<Dialog
|
||||
title="Warning"
|
||||
actions={actionsNotif}
|
||||
open={this.state.notif}
|
||||
autoScrollBodyContent={true}
|
||||
modal={false}
|
||||
>
|
||||
<p>1. You must allow notification</p>
|
||||
<div style={{textAlign:'center'}}>
|
||||
<img src="/assets/images/notification.jpg" style={{height : '400px'}}/>
|
||||
</div>
|
||||
<p style={{marginTop:'1em'}}>2. Reload Page</p>
|
||||
<div style={{textAlign:'center'}}>
|
||||
<img style={{height: "400px"}} src="/assets/images/reload.jpg"/>
|
||||
</div>
|
||||
{/*<p>1. You must allow notification</p>
|
||||
<img style={{width: "100%", height: "100%"}} src="/assets/images/notification.jpg"/>*/}
|
||||
</Dialog>
|
||||
|
||||
<button onClick={() => this.props.history.push(LINKS.DASHBOARD)} className={'buttonLogin'}>
|
||||
Sign In
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,83 +1,82 @@
|
||||
.login {
|
||||
@import url('https://fonts.googleapis.com/css?family=Thasadith');
|
||||
|
||||
.loginWrapper{
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
//background-size: cover;
|
||||
//position: fixed;
|
||||
//height: 100%;
|
||||
//width: 100%;
|
||||
//top:0;
|
||||
//overflow: hidden;
|
||||
.logo {
|
||||
width: 100%;
|
||||
}
|
||||
//background-color: #aaafff;
|
||||
background-image: url("../../../../assets/images/login/background.jpg");
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-position: center bottom;
|
||||
margin-top: -56px !important;
|
||||
|
||||
.background {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background: rgba(128, 0, 128, 0.82); /* fallback for old browsers */
|
||||
background: -webkit-linear-gradient(to top, rgba(0, 204, 187, 0.86), rgba(43, 69, 230, 0.91), rgba(128, 0, 128, 0.92)); /* Chrome 10-25, Safari 5.1-6 */
|
||||
background: linear-gradient(to top, rgba(0, 204, 187, 0.86), rgba(43, 69, 230, 0.91), rgba(128, 0, 128, 0.92));
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
.ant-form-explain {
|
||||
text-align: left;
|
||||
}
|
||||
.login-box {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 460px;
|
||||
height: 320px;
|
||||
padding: 36px;
|
||||
background-color: #1e2e4a;
|
||||
box-shadow: 0 0 100px rgba(0, 0, 0, .08);
|
||||
.header {
|
||||
.formContainer{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: -17.5vh;
|
||||
|
||||
.logoLogin{
|
||||
width: 200px;
|
||||
height: auto;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.textLogin{
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
margin-bottom: 24px;
|
||||
img {
|
||||
width: 40px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
span {
|
||||
vertical-align: text-bottom;
|
||||
font-size: 16px;
|
||||
text-transform: uppercase;
|
||||
display: inline-block;
|
||||
}
|
||||
p {
|
||||
font-size: 16px;
|
||||
text-transform: uppercase;
|
||||
margin-top: 5vh;
|
||||
margin-bottom: 6.5vh;
|
||||
font-size: 1.25rem;
|
||||
font-weight: lighter;
|
||||
color: #555;
|
||||
font-family: 'Thasadith', sans-serif;
|
||||
}
|
||||
|
||||
.formParent{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
.inputContainer{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 14px 28px rgba(0,0,0,0.06), 0 10px 10px rgba(0,0,0,0.03);
|
||||
|
||||
.usernameForm{
|
||||
border: 0px;
|
||||
padding: 15px;
|
||||
width: 20vw;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
.passwordForm{
|
||||
border: 0px;
|
||||
padding: 15px;
|
||||
width: 20vw;
|
||||
}
|
||||
}
|
||||
|
||||
.buttonLogin{
|
||||
width: 100px;
|
||||
height: 35px;
|
||||
align-self: center;
|
||||
margin-left: -3vw;
|
||||
box-shadow: 0 14px 28px rgba(0,0,0,0.09), 0 10px 10px rgba(0,0,0,0.06) !important;
|
||||
color: #fff;
|
||||
border: 0px;
|
||||
background-color: #6772e5;
|
||||
border-radius: 2.5px;
|
||||
cursor: pointer;
|
||||
transition: 0.5s;
|
||||
}
|
||||
|
||||
.buttonLogin:hover{
|
||||
background-color: #424770;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//
|
||||
//.login::before {
|
||||
// content: "";
|
||||
// position: absolute;
|
||||
// z-index: -1;
|
||||
// background: -webkit-gradient(linear, left top, right bottom, from(#D7BBEA), to(#65A8F1));
|
||||
// background: linear-gradient(to bottom right, #D7BBEA, #65A8F1);
|
||||
// top: 0;
|
||||
// left: 0;
|
||||
// bottom: 0;
|
||||
// right: 0;
|
||||
//}
|
||||
|
||||
//.login-wrapper {
|
||||
// margin: 0 auto;
|
||||
// position: relative;
|
||||
// min-height: 100%;
|
||||
// box-shadow: none;
|
||||
// border-radius: 0;
|
||||
// background-image: url('/assets/images/bg-pattern2.png');
|
||||
// background-size: contain;
|
||||
// background-repeat: repeat;
|
||||
// background-position: 0 0;
|
||||
//}
|
||||
textarea:focus, input:focus{
|
||||
outline: none;
|
||||
}
|
||||
|
||||
@@ -1,11 +1,12 @@
|
||||
import React from 'react';
|
||||
import {inject, observer} from 'mobx-react';
|
||||
import {Link} from 'react-router';
|
||||
import {Affix, Card, Slider, Select, Col, Row, Carousel } from 'antd';
|
||||
import {Affix, Card, Slider, Select, Col, Row } from 'antd';
|
||||
import {Tab, Tabs} from 'material-ui';
|
||||
import './style.scss';
|
||||
import {ItemCard} from "./ItemCard";
|
||||
import ModalVouchersComponent from "./Modal";
|
||||
import EmptyComponent from '../EmptyComponent';
|
||||
|
||||
const Option = Select.Option;
|
||||
@inject('appstate')
|
||||
@@ -31,9 +32,12 @@ export default class VouchersComponent extends React.Component {
|
||||
},
|
||||
};
|
||||
this.defaultState = Object.assign({}, this.state);
|
||||
this.vouchersStore = props.appstate.vouchers;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.vouchersStore.getList();
|
||||
console.log('res list component',this.vouchersStore.getList())
|
||||
}
|
||||
|
||||
render() {
|
||||
@@ -186,14 +190,6 @@ export default class VouchersComponent extends React.Component {
|
||||
|
||||
return (
|
||||
<div className="voucher">
|
||||
{/*<div className="row">*/}
|
||||
{/*<Carousel autoplay>*/}
|
||||
{/*<div style={{width:960,height:239}}><img alt="Banner 1" style={{width:'100%',height:'100%'}} src="https://ecs7.tokopedia.net/img/banner/2018/12/18/41966928/41966928_03c39a82-9ec8-45c3-8184-2d1a0fd810cd.jpg" /></div>*/}
|
||||
{/*<div style={{width:960,height:239}}><img alt="Banner 2" style={{width:'100%',height:'100%'}} src="https://ecs7.tokopedia.net/img/banner/2019/1/4/42484317/42484317_e6f6cdf6-90a4-4c21-86fe-c7910982a8e9.jpg" /></div>*/}
|
||||
{/*<div style={{width:960,height:239}}><img alt="Banner 3" style={{width:'100%',height:'100%'}} src="https://ecs7.tokopedia.net/img/banner/2019/1/4/42484317/42484317_e6f6cdf6-90a4-4c21-86fe-c7910982a8e9.jpg" /></div>*/}
|
||||
{/*<div style={{width:960,height:239}}><img alt="Banner 4" style={{width:'100%',height:'100%'}} src="https://ecs7.tokopedia.net/img/banner/2019/1/4/42484317/42484317_e6f6cdf6-90a4-4c21-86fe-c7910982a8e9.jpg" /></div>*/}
|
||||
{/*</Carousel>*/}
|
||||
{/*</div>*/}
|
||||
<div className="row">
|
||||
<div className="col l12 m12 s12 padding">
|
||||
<p className={'pageTitle'}>
|
||||
@@ -201,11 +197,17 @@ export default class VouchersComponent extends React.Component {
|
||||
</p>
|
||||
|
||||
<Row gutter={10}>
|
||||
{data.map((item, index) => {
|
||||
return (<Col onClick={() => this.setState({isOpened: true, data: item})} key={index} span={6}>
|
||||
<ItemCard data={item}/>
|
||||
</Col>)
|
||||
})}
|
||||
{
|
||||
(data.length > 0) ?
|
||||
data.map((item, index) => {
|
||||
return (<Col onClick={() => this.setState({isOpened: true, data: item})} key={index} span={6}>
|
||||
<ItemCard data={item}/>
|
||||
</Col>)
|
||||
})
|
||||
: (
|
||||
<EmptyComponent type="default4" header="" content="There is no voucher in sight"/>
|
||||
)
|
||||
}
|
||||
</Row>
|
||||
|
||||
<ModalVouchersComponent
|
||||
|
||||
@@ -30,16 +30,4 @@
|
||||
margin-bottom: -10px;
|
||||
}
|
||||
|
||||
.ant-carousel .slick-slide {
|
||||
text-align: center;
|
||||
height: 160px;
|
||||
line-height: 160px;
|
||||
background: #364d79;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ant-carousel .slick-slide h3 {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
83
src/common/pages/Wallet/Modal/index.js
Normal file
83
src/common/pages/Wallet/Modal/index.js
Normal file
@@ -0,0 +1,83 @@
|
||||
import React from 'react';
|
||||
import {inject, observer} from 'mobx-react';
|
||||
import {Link} from 'react-router';
|
||||
import { Modal, Input, Alert, Select } from 'antd';
|
||||
import './style.scss';
|
||||
import { Route } from 'react-router-dom'
|
||||
import {LINKS} from "../../../routes";
|
||||
|
||||
const Option = Select.Option;
|
||||
@inject('appstate')
|
||||
@observer
|
||||
export default class ModalTopupComponent extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.props = props;
|
||||
this.state = {
|
||||
selectedOption: '0 Points',
|
||||
inputCode1: '',
|
||||
inputCode2: '',
|
||||
inputCode3: '',
|
||||
inputCode4: '',
|
||||
};
|
||||
this.defaultState = Object.assign({}, this.state);
|
||||
}
|
||||
|
||||
componentDidMount() {}
|
||||
|
||||
render() {
|
||||
const {data, isVisible = false, onOk = () => {}, onCancel = () => {}, title='Redeem your code'} = this.props;
|
||||
|
||||
return (
|
||||
<Modal
|
||||
title={title}
|
||||
visible={isVisible}
|
||||
onOk={onOk}
|
||||
onCancel={onCancel}
|
||||
bodyStyle={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center'
|
||||
}}
|
||||
>
|
||||
<div className={'modalContainer'}>
|
||||
<Input value={this.state.inputCode1} maxLength={4} ref={e => this.inputCode1 = e} onChange={(e) => {
|
||||
this.setState({inputCode1: e.target.value})
|
||||
if(e.target.value.length === 4){
|
||||
this.inputCode2.focus();
|
||||
}
|
||||
}} className={'inputCode'} placeholder="XXXX" />
|
||||
<p className={'stripeText'}>-</p>
|
||||
<Input value={this.state.inputCode2} maxLength={4} ref={e => this.inputCode2 = e} onChange={(e) => {
|
||||
this.setState({inputCode2: e.target.value})
|
||||
if(e.target.value.length === 4){
|
||||
this.inputCode3.focus();
|
||||
}
|
||||
|
||||
if(e.target.value.length === 0){
|
||||
this.inputCode1.focus();
|
||||
}
|
||||
}} className={'inputCode'} placeholder="XXXX" />
|
||||
<p className={'stripeText'}>-</p>
|
||||
<Input value={this.state.inputCode3} maxLength={4} ref={e => this.inputCode3 = e} onChange={(e) => {
|
||||
this.setState({inputCode3: e.target.value})
|
||||
if(e.target.value.length === 4){
|
||||
this.inputCode4.focus();
|
||||
}
|
||||
|
||||
if(e.target.value.length === 0){
|
||||
this.inputCode2.focus();
|
||||
}
|
||||
}} className={'inputCode'} placeholder="XXXX" />
|
||||
<p className={'stripeText'}>-</p>
|
||||
<Input value={this.state.inputCode4} maxLength={4} ref={e => this.inputCode4 = e} onChange={(e) => {
|
||||
this.setState({inputCode4: e.target.value})
|
||||
if(e.target.value.length === 0){
|
||||
this.inputCode3.focus();
|
||||
}
|
||||
}} className={'inputCode'} placeholder="XXXX" />
|
||||
</div>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
}
|
||||
15
src/common/pages/Wallet/Modal/style.scss
Normal file
15
src/common/pages/Wallet/Modal/style.scss
Normal file
@@ -0,0 +1,15 @@
|
||||
.modalContainer{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.stripeText{
|
||||
margin-top: 12px;
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.inputCode{
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
@@ -31,6 +31,7 @@ import Loader from 'react-loader-advanced';
|
||||
import './style.scss';
|
||||
import {DIALOG} from "../../stores/global_ui";
|
||||
import faker from 'faker';
|
||||
import ModalTopupComponent from "./Modal";
|
||||
|
||||
@inject('appstate')
|
||||
@observer
|
||||
@@ -44,6 +45,7 @@ export default class WalletComponent extends React.Component {
|
||||
slideIndex: 0,
|
||||
filteredInfo: null,
|
||||
sortedInfo: null,
|
||||
modalTopup: false,
|
||||
};
|
||||
this.defaultState = Object.assign({}, this.state);
|
||||
this.http = props.appstate.http;
|
||||
@@ -60,6 +62,10 @@ export default class WalletComponent extends React.Component {
|
||||
// this.authStore.getWallet();
|
||||
}
|
||||
|
||||
setModalTopup = (bool) => {
|
||||
this.setState({modalTopup: bool});
|
||||
};
|
||||
|
||||
render() {
|
||||
const voucher = <NumberFormat value={(500000).toFixed(2)} displayType={'text'} thousandSeparator={true} prefix={'Rp '}/>;
|
||||
const points = <NumberFormat value={15000} displayType={'text'} thousandSeparator={true}/>;
|
||||
@@ -207,7 +213,7 @@ export default class WalletComponent extends React.Component {
|
||||
className="ToolbarGroupLastButton"
|
||||
icon={<UnarchiveIcon/>}
|
||||
label="Top Up"
|
||||
// onClick={() => this.globalUI.showDialog(DIALOG.WALLET.WITHDRAW)}
|
||||
onClick={() => this.setModalTopup(true)}
|
||||
primary={true}/>
|
||||
</div>
|
||||
}
|
||||
@@ -283,8 +289,7 @@ export default class WalletComponent extends React.Component {
|
||||
</div>
|
||||
</Card></div>
|
||||
</div>
|
||||
|
||||
|
||||
<ModalTopupComponent onOk={() => this.setModalTopup(false)} onCancel={() => this.setModalTopup(false)} isVisible={this.state.modalTopup} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -138,10 +138,13 @@ export default class Routes extends React.Component {
|
||||
const PrivateRoute = ({component: Component, ...rest}) => (
|
||||
<Route
|
||||
{...rest}
|
||||
render={(props) => this.authStore.isLoggedIn === true
|
||||
render={
|
||||
(props) => true === true
|
||||
? (<Component {...props}/>)
|
||||
: (<Redirect to={{pathname : LINKS.LOGIN}}/>
|
||||
)}/>
|
||||
)
|
||||
}
|
||||
/>
|
||||
)
|
||||
|
||||
return (
|
||||
|
||||
@@ -56,6 +56,7 @@ import {Tags} from './tags';
|
||||
import Surf from './surf';
|
||||
import Odoo from './odoo';
|
||||
|
||||
import Vouchers from './vouchers';
|
||||
|
||||
export default class AppState {
|
||||
http = new Http(this.token);
|
||||
@@ -101,6 +102,7 @@ export default class AppState {
|
||||
userBanks = new UserBanks(this);
|
||||
stores = new Stores(this);
|
||||
storeList = new StoreList(this);
|
||||
vouchers = new Vouchers(this);
|
||||
userAddress = new UserAddress(this);
|
||||
item = new ItemStore(this);
|
||||
myStore = new MyStoreStore(this);
|
||||
|
||||
101
src/common/stores/vouchers.js
Normal file
101
src/common/stores/vouchers.js
Normal file
@@ -0,0 +1,101 @@
|
||||
import { observable, action, computed } from 'mobx';
|
||||
|
||||
export default class Vouchers {
|
||||
|
||||
@observable list = [];
|
||||
@observable selected = {};
|
||||
@observable istLoading = false;
|
||||
@observable isSearching = false;
|
||||
@observable filtered = [];
|
||||
|
||||
constructor(context) {
|
||||
this.http = context.http;
|
||||
this.context = context;
|
||||
}
|
||||
|
||||
@action
|
||||
getList(){
|
||||
console.log('res');
|
||||
this.isLoading = true;
|
||||
return this.http.get("items")
|
||||
.then(res => {
|
||||
console.log(res.data,'res list')
|
||||
this.list = res.data;
|
||||
this.isLoading = false;
|
||||
})
|
||||
.catch(err => {
|
||||
this.isLoading = false;
|
||||
throw err;
|
||||
})
|
||||
}
|
||||
|
||||
@action
|
||||
getDetail(id){
|
||||
this.isLoading = true;
|
||||
return this.http.get(`stores/${id}`)
|
||||
.then(res => {
|
||||
this.selected = res;
|
||||
this.isLoading = false;
|
||||
})
|
||||
.catch(err => {
|
||||
this.isLoading = false;
|
||||
throw err;
|
||||
})
|
||||
}
|
||||
|
||||
@action
|
||||
post(data){
|
||||
this.isLoading = true;
|
||||
return this.http.post("stores", data)
|
||||
.then(res => {
|
||||
this.isLoading = false;
|
||||
this.getList();
|
||||
return res;
|
||||
})
|
||||
.catch(err => {
|
||||
this.isLoading = false;
|
||||
throw err;
|
||||
})
|
||||
}
|
||||
|
||||
@action
|
||||
put(id,data){
|
||||
this.isLoading = true;
|
||||
return this.http.put(`stores/${id}`, data)
|
||||
.then(res => {
|
||||
this.isLoading = false;
|
||||
this.getList();
|
||||
return res;
|
||||
})
|
||||
.catch(err => {
|
||||
this.isLoading = false;
|
||||
throw err;
|
||||
})
|
||||
}
|
||||
|
||||
@action
|
||||
delete(id){
|
||||
this.isLoading = true;
|
||||
return this.http.delete(`stores/${id}`)
|
||||
.then(res => {
|
||||
this.isLoading = false;
|
||||
this.getList();
|
||||
return res;
|
||||
})
|
||||
.catch(err => {
|
||||
this.isLoading = false;
|
||||
throw err;
|
||||
})
|
||||
}
|
||||
|
||||
filterItems = (query) => {
|
||||
return this.list.filter((el) =>
|
||||
el.name.toLowerCase().indexOf(query.toLowerCase()) > -1
|
||||
);
|
||||
}
|
||||
|
||||
@action
|
||||
search(text){
|
||||
this.filtered = this.filterItems(text);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user