items vouchers sudah nempel ke belakang

This commit is contained in:
2019-01-06 01:40:19 +07:00
parent 68ea6966cf
commit 346b306f5f
3 changed files with 43 additions and 18 deletions

View File

@@ -14,10 +14,11 @@ export default class ModalVouchersComponent extends React.Component {
super(props);
this.props = props;
this.state = {
selectedOption: '0 Points',
selectedOption: '0',
hidden:'inline'
};
this.defaultState = Object.assign({}, this.state);
this.http = props.appstate.http;
}
componentDidMount() {}
@@ -47,12 +48,12 @@ export default class ModalVouchersComponent extends React.Component {
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'center',
background: data.background_color || '#aaa',
// height: 500,
background: `linear-gradient(${data.background_color_1}, ${data.background_color_2})` || '#aaa',
// background: data.background_color || '#aaa',
flex: 0.3
}}>
<img className={'imageModal'} src={data.image} />
<p className={'titleModal'}>{data.name}</p>
<img className={'imageModal'} src={this.http.appendImagePath(data.images.logo)} />
<p className={'titleModal'}>{data.name} }</p>
</div>
<div style={{
display: 'flex',
@@ -62,10 +63,10 @@ export default class ModalVouchersComponent extends React.Component {
}}>
<p className={'descriptionModal'} >{data.description}</p>
{(data.additional_information.length > 0) && <Alert className={'informationAlertModal'} message={
{(data.additional_data.information != null) && <Alert className={'informationAlertModal'} message={
<div className={'informationContainerModal'}>
<p className={'informationTitleModal'}>Information</p>
<p className={'informationBodyModal'}>{data.additional_information}</p>
<p className={'informationBodyModal'}>{data.additional_data.information}</p>
</div>
} type="success" />}
@@ -85,14 +86,14 @@ export default class ModalVouchersComponent extends React.Component {
console.log(this.state.hidden,'onDropdownVisibleChange')
}}
>
{data.option.map((item, index) => {
return <Option value={item.cost}><div style={{display:'flex',justifyContent:'space-between', width:'100%'}}><span>{item.value}</span> <span style={{color:'#FF6F00', display:this.state.hidden}}>{item.cost}</span></div></Option>
{data.sku.map((item, index) => {
return <Option value={item.price}><div style={{display:'flex',justifyContent:'space-between', width:'100%'}}><span>{item.name}</span> <span style={{color:'#FF6F00', display:this.state.hidden}}>{item.price}</span></div></Option>
})}
</Select>
<div className={'costContainerModal'}>
<div className={'costLeftPaneModal'}>
<p className={'costTitleModal'}>Cost</p>
<p className={'costTitleModal'}>Points</p>
<p className={'costValueModal'}>{this.state.selectedOption}</p>
</div>
<div className={'costRightPaneModal'}>