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

feat: initial commit for mockup bukopin

Browse Source
This commit is contained in:
ahmadzuhdi
2023-01-17 21:21:43 +07:00
parent 0ebe039eda
commit 9f0c68b2ce
23 changed files with 142 additions and 568201 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/common/pages/Vouchers/Modal/index.js
View File

@@ -40,7 +40,7 @@ export default class ModalVouchersComponent extends React.Component {
render() {
const {item} = this.props.appstate;
const {data = {}, isVisible = false, onOk = () => {}, onCancel = () => {}, title='Modal'} = this.props;
let image = get(data, 'images.logo', '');
let image = get(data, 'images.main', '');
if (!image.includes('http')) {
image = this.http.appendImagePath(image);
@@ -102,38 +102,45 @@ export default class ModalVouchersComponent extends React.Component {
placeholder="Please Select your Option"
optionFilterProp="children"
onChange={(value) => {
console.log({value})
this.setState({selectedOption: value});
this.setState({hidden: 'none'});
// console.log('onChange',value);
const points = item.selectedData.sku.filter(item => item.id == value);
// const points = item.selectedData.sku.filter(item => item.id == value);
this.setState({
skuName :points[0].name,
skuPrice : points[0].price,
buttonDisbaled:false
skuName : get(data, 'name', '').name,
skuPrice : get(data, 'regular_price', '0.0'),
buttonDisbaled: false
})
}
}
}}
onDropdownVisibleChange={(value) => {
this.setState({hidden: 'inline'})
}}
>
{(item.selectedData.sku || []).map((item, index) => {
{(item.selectedData.sku || [{
vouchers: [{count: +get(data, 'stock', '0.0')}],
price: get(data, 'regular_price', '0.0'),
id: get(data, 'id', ''),
name: get(data, 'name', '')
}]).map((selectedItem, index) => {
// const {vouchers:[{count}]} = item;
console.log({item: selectedItem})
let count = 1;
if (data.source === 'internal') {
count = get(item, 'vouchers[0].count', 0) || 0;
count = get(selectedItem, 'vouchers[0].count', 0) || 0;
}
console.log(count);
const outOfStock = !(+count > 0);
return (
<Option disabled={outOfStock} value={item.id}>
<Option disabled={outOfStock} value={selectedItem.id}>
<div style={{display:'flex',justifyContent:'space-between', width:'100%'}}>
<span>{item.name} {outOfStock ? " - Out of Stock" : ""}</span>
<span>{selectedItem.name} {outOfStock ? " - Out of Stock" : ""}</span>
<span style={{color:'#FF6F00', display:this.state.hidden}}>
Rp. <NumberFormat value={(+item.price).toFixed(0)} displayType={'text'} thousandSeparator={true}/>
Rp. <NumberFormat value={(+selectedItem.price).toFixed(0)} displayType={'text'} thousandSeparator={true}/>
</span>
</div>
</Option>
@@ -144,7 +151,9 @@ export default class ModalVouchersComponent extends React.Component {
<div className={'costContainerModal'}>
<div className={'costLeftPaneModal'}>
<p className={'costTitleModal'}>Points</p>
<p className={'costValueModal'}><NumberFormat value={(+this.state.skuPrice).toFixed(0)} displayType={'text'} thousandSeparator={true}/> </p>
<p className={'costValueModal'}>
<NumberFormat value={(+this.state.skuPrice).toFixed(0)} displayType={'text'} thousandSeparator={true}/>
</p>
</div>
<div className={'costRightPaneModal'}>
<Route render={({ history}) => (
@@ -205,38 +214,45 @@ export default class ModalVouchersComponent extends React.Component {
placeholder="Please Select your Option"
optionFilterProp="children"
onChange={(value) => {
console.log({value})
this.setState({selectedOption: value});
this.setState({hidden: 'none'});
// console.log('onChange',value);
const points = item.selectedData.sku.filter(item => item.id == value);
this.setState({
skuName :points[0].name,
skuPrice : points[0].price,
buttonDisbaled:false
skuName : get(data, 'name', '').name,
skuPrice : get(data, 'regular_price', '0.0'),
buttonDisbaled: false
})
}
}
}}
onDropdownVisibleChange={(value) => {
this.setState({hidden: 'inline'})
}}
>
{(item.selectedData.sku || []).map((item, index) => {
{(item.selectedData.sku || [{
vouchers: [{count: +get(data, 'stock', '0.0')}],
price: get(data, 'regular_price', '0.0'),
id: get(data, 'id', ''),
name: get(data, 'name', '')
}]).map((selectedItem, index) => {
// const {vouchers:[{count}]} = item;
console.log({item: selectedItem})
let count = 1;
if (data.source === 'internal') {
count = get(item, 'vouchers[0].count', 0) || 0;
count = get(selectedItem, 'vouchers[0].count', 0) || 0;
}
console.log(count);
const outOfStock = !(+count > 0);
return (
<Option disabled={outOfStock} value={item.id}>
<Option disabled={outOfStock} value={selectedItem.id}>
<div style={{display:'flex',justifyContent:'space-between', width:'100%'}}>
<span>{item.name} {outOfStock ? " - Out of Stock" : ""}</span>
<span>{selectedItem.name} {outOfStock ? " - Out of Stock" : ""}</span>
<span style={{color:'#FF6F00', display:this.state.hidden}}>
Rp. <NumberFormat value={(+item.price).toFixed(0)} displayType={'text'} thousandSeparator={true}/>
Rp. <NumberFormat value={(+selectedItem.price).toFixed(0)} displayType={'text'} thousandSeparator={true}/>
</span>
</div>
</Option>