Skip to content

N
new_excelso
Commit df2e2f9f authored by Trisno's avatar Trisno
Browse files
Options

update design shopping cart

parent 44a3a512
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 66 additions and 59 deletions
view/ItemShopingCart.js
View file @ df2e2f9f
......@@ -22,40 +22,42 @@ class ItemShoping extends React.Component {
note: 'jangan garing',
image: item.image,
price: parseInt(item.price),
}
this.props.changeQuantity({item: order_item, quantity: quantity})
}
this.props.changeQuantity({ item: order_item, quantity: quantity })
}
render() {
const { item } = this.props
// console.log(this.props)
return (
<View style={{ flex: 1, margin: 10 }} key={item.id}>
{/* <Text style={{ fontSize: 20, color: '#c9af6d' }}>{item.name}</Text> */}
<View style={{ flexDirection: 'row' }}>
<View >
<Image source={{ uri: item.image }} style={{ height: 100, width: 100, borderRadius: 5, top: 5 }}></Image>
</View>
<View >
<Text style={{ fontSize: 15, margin: 5, marginRight: 10, fontFamily: 'Gotham-Black' }}>{item.name}</Text>
<NumberFormat decimalScale={0} value={item.price} renderText={value => <Text style={{ fontSize: 12, margin: 5, marginRight: 10, fontFamily: 'Gotham-Black', color: 'grey' }}>Rp. {value}</Text>} displayType={'text'} thousandSeparator={true} prefix={''} />
<View style={{ flexDirection: 'row', flex: 1 }}>
<View style={styles.shadowEdit}></View>
<View style={styles.shadowAdd}>
<TouchableOpacity onPress={() => this.props.handleMin()}>
<Text style={{ fontSize: 20, margin: 2, color:'#CFB368' }}> - </Text>
</TouchableOpacity>
<TextInput
style={{ height: 25, padding: 2, textAlign: 'center', margin: 2 }}
keyboardType={'numeric'}
onChangeText={(quantity) => this.handleChangeQuantity(item, quantity)}>{item.quantity}</TextInput>
<TouchableOpacity onPress={() => this.props.handleAdd()}>
<Text style={{ fontSize: 20, margin: 2, color:'#CFB368'}}> + </Text>
</TouchableOpacity>
</View>
{/* <Text style={{ fontSize: 20, color: '#c9af6d' }}>{item.name}</Text> */}
<View style={{ flexDirection: 'row' }}>
<View >
<Image source={{ uri: item.image }} style={{ height: 100, width: 100, borderRadius: 5, top: 5 }}></Image>
</View>
<View >
<Text style={{ fontSize: 15, margin: 5, marginRight: 10, fontFamily: 'Gotham-Black', color: 'grey' }}>{item.name}</Text>
<NumberFormat decimalScale={0} value={item.price} renderText={value => <Text style={{ fontSize: 12, margin: 5, marginRight: 10, fontFamily: 'Gotham-Light', color: 'grey' }}>Rp. {value}</Text>} displayType={'text'} thousandSeparator={true} prefix={''} />
<View style={{ flexDirection: 'row', flex: 1 }}>
<View style={styles.shadowEdit}>
<Image source={(require('../assets/icon/icon-pencil.png'))} style={{ height: 25, width: 25, marginLeft: 5}}></Image>
</View>
<View style={styles.shadowAdd}>
<TouchableOpacity onPress={() => this.props.handleMin()}>
<Text style={{ fontSize: 20, margin: 2, color: '#CFB368' }}> - </Text>
</TouchableOpacity>
<TextInput
style={{ height: 25, padding: 2, textAlign: 'center', margin: 2 }}
keyboardType={'numeric'}
onChangeText={(quantity) => this.handleChangeQuantity(item, quantity)}>{item.quantity}</TextInput>
<TouchableOpacity onPress={() => this.props.handleAdd()}>
<Text style={{ fontSize: 20, margin: 2, color: '#CFB368' }}> + </Text>
</TouchableOpacity>
</View>
</View>
</View>
</View>
</View>
)
}
......@@ -77,6 +79,7 @@ const styles = StyleSheet.create({
marginLeft: 5,
marginRight: 5,
marginTop: 10,
alignItems:'center'
},
shadowAdd: {
height: 30,
......@@ -126,14 +129,14 @@ const mapStateToProps = (state) => {
const mapDispatchToProps = (dispacth) => {
return {
changeQuantity: (params) => dispacth({
type: ActionType.CHANGE_QUANTITY,
data: {
item: params.item,
new_quantity: params.quantity
}
}),
changeQuantity: (params) => dispacth({
type: ActionType.CHANGE_QUANTITY,
data: {
item: params.item,
new_quantity: params.quantity
}
}),
}
}
}
export default connect(mapStateToProps, mapDispatchToProps)(ItemShoping)
view/ShoppingCart.js
View file @ df2e2f9f
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment