mobile / YH_RNComponent · Commits

Go to a project

Authored by huangyCode
Commit b780b6203e888d3c7d6f4829e4b080e100b11103 1 parent 1523e888

砍价列表改动

Inline Side-by-side
Showing 6 changed files with 134 additions and 141 deletions
... ... @@ -111,7 +111,6 @@ _renderRow(rowData, sectionID, rowID) {
productList: data.list ? data.list.toArray() : [],
}
}
return (
<View style={styles.container}>
... ...
... ... @@ -86,8 +86,8 @@ export default class TimerLable extends React.Component {
render() {
if(this.state.leftTime > 0){
return (
<View style={[styles.container,this.props.style ? this.props.style : {}]}>
<Text style={styles.time}>
<View style={styles.container}>
<Text style={[styles.time,this.props.style ? this.props.style : {}]}>
{this.formatTime(this.state.leftTime)}
</Text>
</View>
... ... @@ -104,17 +104,11 @@ let leftOffset = 20 * DEVICE_WIDTH_RATIO;
let styles = StyleSheet.create({
container: {
height: 80 * DEVICE_WIDTH_RATIO,
width: 100* DEVICE_WIDTH_RATIO,
flexDirection: 'row',
alignItems: 'center',
},
timeIcon: {
width: 16 * DEVICE_WIDTH_RATIO,
height: 16 * DEVICE_WIDTH_RATIO,
},
time: {
fontFamily: 'Alte DIN 1451 Mittelschrift',
fontFamily: 'PingFang-SC-Medium',
fontSize: 12,
color: '#ffffff',
letterSpacing: 0,
... ...
'use strict';
import React, {Component} from 'react';
import {Dimensions, StyleSheet, Text, TouchableOpacity, View, ImageBackground,Image} from 'react-native';
import {
Dimensions,
StyleSheet,
Text,
TouchableOpacity,
View,
ImageBackground,
Image,
PixelRatio,
Platform
} from 'react-native';
import YH_Image from '../../../common/components/YH_Image';
import TimerLabel from './TimerLable';
... ... @@ -19,115 +29,119 @@ export default class productCell extends Component {
let leftTime = data.get('cutEndTime') - data.get('currentTime');
let status = data.get('cutStatus');
let des = '后结束';
if (status == 2) {
if (status === 5) {
des = '已成功';
}else if (status == 3){
} else if (status === 6 || leftTime <= 0) {
des = '已结束';
}
let timeFlag = leftTime > 0 && status !== 5 && status !== 6;
return (
<View style= {styles.timeFatherContainer}>
<ImageBackground source={require('../../images/timeBg.png')} style={styles.timeBg}>
</ImageBackground>
<View style={styles.timeContainer}>
{data.get('cutStatus')==1? <TimerLabel leftTime = {leftTime} style={styles.timeCount} onStop = {this.props.onStop}/>:null }
<Text style={styles.timeDes}>{des}</Text>
</View>
</View>
<View style={styles.timeFatherContainer}>
<View style={styles.timeContainer}>
{timeFlag ?
<TimerLabel leftTime={leftTime} style={styles.grayColor} onStop={this.props.onStop}/> : null}
<Text style={[timeFlag ? styles.grayColor : styles.lightGrayColor, styles.timeDes]}>{des}</Text>
</View>
</View>
);
}
_priceView(data) {
let categoryType = this.props.categoryType;
let status = data.get('cutStatus');
let text, textStyle;
if (categoryType) {
if (status === 4) {
text = '已下单';
textStyle = styles.redColor;
} else if (status === 5) {
text = data.get('hasCutPrice') && '已砍¥' + data.get('hasCutPrice');
textStyle = styles.blackColor;
} else if (status === 6) {
text = '砍价失败';
textStyle = styles.lightGrayColor;
} else {
text = data.get('hasCutPrice') && '已砍¥' + data.get('hasCutPrice');
textStyle = styles.redColor;
}
} else {
text = data.get('sales_price') && '¥' + data.get('sales_price');
textStyle = styles.blackColor;
}
let status = data.get('cutStatus');
if (status==2 || status==3) {
return null;
}else {
return (
<View>
<View style={styles.priceFatherContainer}>
<View style={styles.nowPriceContainer}>
<Text style={styles.nowPrice}>¥</Text>
<Text style={[styles.nowPrice, {
marginLeft: 1,
marginTop:-4,
fontSize: 18
}]}>{data && data.get('highPrice')}</Text>
</View>
{data.get('hasCutPrice') ?
<View style={styles.cutPriceContainer}>
<Text style={styles.hasCutPrice}>已砍¥</Text>
<Text style={[styles.hasCutPrice, {
marginLeft: 1,
}]}>{data && data.get('hasCutPrice')}</Text>
</View>
: null }
</View>
</View>
);
return <View style={styles.priceFatherContainer}>
<View style={styles.priceContainer}>
<Text style={[textStyle, styles.priceText]}>{text}</Text>
</View>
</View>
}
}
_cutActionView(data) {
let categoryType = this.props.categoryType;
if (categoryType == 1) {
if (data.get('cutStatus') == 1) {
return (
<View style={styles.actionContainer}>
<View style={styles.continueCutContainer}>
<Text style={styles.continueCut}>继续砍价</Text>
return (
<View style={styles.actionContainer}>
<View style={styles.continueCutContainer}>
<Text style={styles.continueCut}>继续砍价</Text>
</View>
</View>
</View>
)
}else if (data.get('cutStatus') == 2) {
return (
<View style={styles.actionContainer}>
)
} else if (data.get('cutStatus') == 2 || data.get('cutStatus') == 3) {
return (
<View style={styles.actionContainer}>
<View style={styles.continueCutContainer}>
<Text style={styles.continueCut}>立即购买</Text>
</View>
</View>
)
} else if (data.get('cutStatus') == 4) {
return <View style={styles.actionContainer}>
<View style={styles.continueCutContainer}>
<Text style={styles.continueCut}>立即购买</Text>
<Text style={styles.continueCut}>立即付款</Text>
</View>
</View>
)
}else {
return null;
</View>;
} else {
return null;
}
}else {
let highPrice = data && parseInt(data.get('highPrice'));
let lowPrice = data && parseInt(data.get('lowPrice'));
let cutPrice = highPrice - lowPrice;
return (
<View style={styles.actionContainer}>
<View style={styles.cutActionContainer}>
<Image source={require('../../images/cutPriceBg.png')} style={styles.cutPriceBg}></Image>
<Text style={styles.cutPrice}>-¥{cutPrice}</Text>
} else {
return (
<View style={styles.actionContainer}>
<View style={styles.cutActionContainer}>
<Image source={require('../../images/cutPriceBg.png')} style={styles.cutPriceBg}></Image>
<Text style={styles.cutPrice}>-¥{data.get('cutTotalPrice')}</Text>
</View>
</View>
</View>
)
)
}
}
}
render() {
let data = this.props.data;
let prdImage = YH_Image.getSlicedUrl(data && data.get('defaultImages', ''), 98, 130, 2);
let prdImage = YH_Image.getSlicedUrl(data && data.get('defaultImages', ''), 98, 98, 2);
let productType = data.get('productType');
return (
<View>
<View style={styles.fatherContainer}>
{data.get('cutStatus')?this._topTimerView(data):null}
{data.get('cutStatus') ? this._topTimerView(data) : null}
<TouchableOpacity
activeOpacity={1} style={[styles.container]}
onPress={() => {
this.props.onPressProduct && this.props.onPressProduct(data);
}}>
<View style={styles.container}>
<YH_Image style={styles.prdImage} url={prdImage}/>
<YH_Image style={styles.prdImage} url={prdImage} resizeMode={'contain'}/>
<View style={styles.rightContainer}>
<Text style={styles.prdName} numberOfLines={2}>{data && data.get('productName', '')}</Text>
{productType ?
<Image style={[{width: 47, height: 14, position: 'absolute', top: 3, left: 10}]}
source={require('../../images/logo.png')}/> : null}
<Text style={styles.prdName} numberOfLines={2}>
{productType ? ' ' : null}
{data && data.get('productName', '')}
</Text>
{this._priceView(data)}
</View>
{this._cutActionView(data)}
... ... @@ -161,62 +175,61 @@ let styles = StyleSheet.create({
prdImage: {
marginTop: 5,
width: 98,
height: 130,
height: 98,
},
prdName: {
fontFamily: 'PingFang-SC-Light',
fontSize: 14,
color: '#444444',
marginTop: 10,
marginLeft: 10,
width: nameWidth,
letterSpacing: -0.34,
},
timeFatherContainer: {
flexDirection: 'row',
alignItems: 'center'
},
priceFatherContainer: {
flex:1,
marginBottom: 0,
marginLeft: 10,
},
nowPriceContainer: {
flexDirection: 'row',
position: 'absolute',
left: 10,
bottom: 6,
},
cutPriceContainer:{
flexDirection: 'row',
priceContainer: {
flexDirection: 'row',
},
nowPrice: {
priceText: {
fontSize: 14,
fontFamily: 'PingFang-SC-Medium',
},
blackColor: {
color: '#222222',
},
hasCutPrice: {
fontSize: 14,
fontFamily: 'PingFang-SC-Medium',
redColor: {
color: '#d0021b',
},
grayColor: {
color: '#444'
},
lightGrayColor: {
color: '#B0B0B0'
},
cutActionContainer: {
width: 91,
height: 33,
justifyContent: 'center',
},
cutPriceBg: {
width: 91,
height: 33,
width: 91,
height: 33,
},
cutPrice: {
fontSize: 14,
fontFamily: 'PingFang-SC-Medium',
color: 'white',
marginTop:-25,
marginRight: 10,
textAlign: 'right',
right: 10,
position: 'absolute',
},
continueCutContainer: {
... ... @@ -234,54 +247,40 @@ let styles = StyleSheet.create({
},
separator: {
width:width-30,
width: width - 30,
marginLeft: 15,
height: 1,
backgroundColor: '#f0f0f0'
},
timeBg:{
justifyContent: 'center',
width: 21,
height: 31,
marginLeft:-3,
},
timeContainer :{
alignItems: 'center',
flexDirection: 'row',
marginLeft:-2,
backgroundColor: '#222222',
height: 24,
},
timeIcon:{
width: 9,
height: 10,
marginLeft:3,
},
timeCount:{
width:55,
marginLeft: 4,
timeContainer: {
alignItems: 'center',
flexDirection: 'row',
marginLeft: -2,
height: 24,
},
timeDes:{
fontSize: 12,
color: 'white',
marginLeft:3,
marginRight:10,
fontFamily: 'PingFang-SC-Medium',
timeIcon: {
width: 9,
height: 10,
marginLeft: 3,
},
invalidDes: {
fontSize: 14,
timeDes: {
fontSize: 12,
marginLeft: 3,
marginRight: 10,
fontFamily: 'PingFang-SC-Medium',
color: '#b0b0b0',
},
actionContainer: {
position: 'absolute',
right: 0,
width: 91,
height: 33,
bottom: 0,
},
bottom: {
flexDirection: 'row',
alignItems: 'center'
}
});
... ...
... ... @@ -113,14 +113,15 @@ class HaggleListContainer extends Component {
let productSkn = product && product.get('productSkn', 0);
let activityId = product && product.get('activityId', 0);
let cutRecordId = product && product.get('cutRecordId', 0);
let shopId = product && product.get('shop_id',0);
let isUFOProduct = product && product.get('productType',0);
if (!productSkn) {
return;
}
let url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.haggleDetail","params":{"type":"haggleDetail","title":"砍价详情", "productSkn":"${productSkn}", "activityId":"${activityId}","status": "${status}","cutRecordId":"${cutRecordId}"}}`;
let url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.haggleDetail","params":{"type":"haggleDetail","title":"砍价详情", "productSkn":"${productSkn}", "activityId":"${activityId}","status": "${status}","isUFOProduct":"${isUFOProduct}","shopId":"${shopId}","cutRecordId":"${cutRecordId}"}}`;
if (cutRecordId == 0) {
url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.haggleDetail","params":{"type":"haggleDetail","title":"砍价详情", "productSkn":"${productSkn}", "activityId":"${activityId}","status": "${status}"}}`;
url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.haggleDetail","params":{"type":"haggleDetail","title":"砍价详情", "productSkn":"${productSkn}", "activityId":"${activityId}","isUFOProduct":"${isUFOProduct}","shopId":"${shopId}","status": "${status}"}}`;
}
ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url);
... ...