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

update: redeem voucher step

Browse Source
This commit is contained in:
Rifqy Zacky Ariadhy
2019-01-28 19:17:00 +07:00
parent d0d20f0d2a
commit dab57e2c88
12 changed files with 579 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

160
src/common/pages/Vouchers/Checkout/index.js
View File

@@ -8,6 +8,7 @@ import { Affix, Card, Slider, Select, Row, Col, Icon, Tag,Rate, Button, Checkbox
import {startCase} from 'lodash';
import LoadingDialog from "../../LoadingDialog";
import Loader from 'react-loader-advanced';
import './style.scss';
import {DIALOG} from "../../../stores/global_ui";
import EmptyComponent from '../../EmptyComponent';
import NavigationArrowBack from 'material-ui/svg-icons/navigation/arrow-back';
@@ -32,105 +33,92 @@ export default class CheckoutVouchers extends React.Component {
}
componentDidMount() {
console.log("skuid",this.vouchersStore.skuId);
console.log("skuName",this.vouchersStore.skuName);
console.log("skuPrice",this.vouchersStore.skuPrice);
console.log("data",this.vouchersStore.dataItems);
console.log(this.vouchersStore)
// console.log("skuid",this.vouchersStore.skuId);
// console.log("skuName",this.vouchersStore.skuName);
// console.log("skuPrice",this.vouchersStore.skuPrice);
// console.log("data",this.vouchersStore.dataItems);
}
render() {
let image = get(this.vouchersStore.dataItems, 'images.logo', '');
const logoUrl = (this.props.vouchersStore.dataItems.images.logo) ? get(this.vouchersStore.dataItems, 'images.logo', '') : 'http://lorempixel.com/400/200';
let image = logoUrl;
if (!image.includes('http')) {
image = this.http.appendImagePath(image);
}
return (
<div className="wallet containerMiddle">
<div className="row">
<div className="row">
<div className="col s0 m3 l3" />
<div className="col s12 m6 l6">
<div className="row">
<FlatButton
className="headerMenu"
hoverColor="#f1f5f9"
style={{ background: '#ffffff00' }}
onClick={() => this.props.history.goBack()}
label="Back"
primary={true}
icon={<NavigationArrowBack />}
/>
<Divider style={{marginBottom:10,marginTop:10}} />
<Card
// title={<div style={{display:'flex',justifyContent:'center'}}>
// <p style={{fontSize:20}}>
// Detail Pembelian
// </p>
// </div>}
>
<div className="">
<div style={{display:'flex',justifyContent:'center'}}>
<h3 style={{fontSize:18}}>
Detail Pembelian
</h3>
</div>
</div>
<Divider style={{marginBottom:10,marginTop:10}} />
<div className="row" style={{marginTop:30}}>
<div className="col s5 m5 l5">
<div style={{display:'flex',justifyContent:'center',alignItems:'center'}}>
<img className={'imageCard'} src={this.http.appendImagePath(image)} />
{/* <Avatar size={74} src={this.http.appendImagePath(this.vouchersStore.dataItems.images.logo)} /> */}
</div>
</div>
<div className="col s4 m7 l7">
<div style={{alignItems:'center'}}>
<Row>
<div className="col s12 m6 6">
<h3>Jenis Layanan :</h3>
</div>
<div className="col s12 m6 6">
<h3 style={{color:''}}>{this.vouchersStore.dataItems.name} {this.vouchersStore.skuName}</h3>
</div>
</Row>
<Row>
<div className="col s12 m6 6">
<h3>Point :</h3>
</div>
<div className="col s12 m6 6">
<h3 style={{color:'#FF6F00'}}>{(+this.vouchersStore.skuPrice).toFixed(0)} Points</h3>
</div>
</Row>
</div>
</div>
</div>
</Card>
</div>
<div className="row">
<Card >
<div className="row">
<div style={{display:'flex',justifyContent:'space-between'}}>
<h3 style={{color:''}}>Point</h3>
<h3 style={{color:'#FF6F00'}}>{this.props.appstate.wallet.data.point} Points</h3>
</div>
</div>
<Divider style={{marginBottom:10,marginTop:10}} />
<div className="row">
<div style={{display:'flex',justifyContent:'space-between'}}>
<h3>Total Pembayaran Point</h3>
<h3 style={{color:'#FF6F00'}}>{(+this.vouchersStore.skuPrice).toFixed(0)} Points</h3>
</div>
</div>
<div className="row">
<Button type="primary" block onClick={() => this.props.history.push(LINKS.PAYMENT_VOUCHERS)}>Lanjut</Button>
</div>
</Card>
</div>
<Card>
<div className="">
<div style={{display:'flex',justifyContent:'center'}}>
<h3 style={{fontSize:18}}>
Detail Pembelian
</h3>
</div>
</div>
<div className="col s0 m3 l3" />
<Divider style={{marginBottom:10,marginTop:10}} />
<div className="row" style={{marginTop:30}}>
<div className="col s12 m5 l5">
<div style={{display:'flex',justifyContent:'center',alignItems:'center'}}>
<img className={'imageCard'} src={image} />
{/* <Avatar size={74} src={this.http.appendImagePath(this.props.vouchersStore.dataItems.images.logo)} /> */}
</div>
</div>
<div className="col s12 m7 l7">
<div style={{alignItems:'center', justifyContent: 'center'}}>
<Row>
<div className="col s4 m4">
<h3>Jenis Layanan</h3>
</div>
<div className="col s1 m1">
<h3>:</h3>
</div>
<div className="col s7 m7">
<h3 style={{color:'#FF6F00'}}>{this.props.vouchersStore.dataItems.name} - {this.props.vouchersStore.skuName}</h3>
</div>
</Row>
<Row>
<div className="col s4 m4">
<h3>Point</h3>
</div>
<div className="col s1 m1">
<h3>:</h3>
</div>
<div className="col s7 m7">
<h3 style={{color:'#FF6F00'}}>{(+this.props.vouchersStore.skuPrice || 0).toFixed(0)} Points</h3>
</div>
</Row>
</div>
</div>
</div>
</Card>
</div>
</div>
<div className="row">
<Card >
<div className="row">
<div style={{display:'flex',justifyContent:'space-between'}}>
<h3 style={{color:''}}>Point</h3>
<h3 style={{color:'#FF6F00'}}>{this.props.appstate.wallet.data.point || 0} Points</h3>
</div>
</div>
<Divider style={{marginBottom:10,marginTop:10}} />
<div className="row">
<div style={{display:'flex',justifyContent:'space-between'}}>
<h3>Total Pembayaran Point</h3>
<h3 style={{color:'#FF6F00'}}>{(+this.props.vouchersStore.skuPrice || 0).toFixed(0)} Points</h3>
</div>
</div>
</Card>
</div>
<div className="row">
{this.props.button()}
</div>
</div>
)
}
}