mobile / YH_RNComponent · Commits

Go to a project

Authored by 盖剑秋
Commit 62a6a862d60e60d4aeea7e75448fbd35d6634995 1 parent c7380afc

秒杀页面的一系列需求。

Inline Side-by-side
Showing 8 changed files with 122 additions and 20 deletions
... ... @@ -26,6 +26,7 @@ export default class ProductListView extends Component {
let tipState = '';
let btnBgColor = '#d30018';
let btnTextcolor = 'white';
let url = rowData.url;
if (rowData.over) {
tipState = '已抢光';
btnBgColor = '#b2b2b2';
... ... @@ -46,7 +47,38 @@ export default class ProductListView extends Component {
this.props.onPressProductItem && this.props.onPressProductItem(rowData);
}}>
<View style={styles.rowContainer}>
<Image style={styles.leftImage} source={{uri: brandIconUrl}}/>
<View style = {
styles.leftImage
} >
<Image style={
{
flex: 1,
}
}
source={
{
uri: brandIconUrl
}
}/>
{tipState == '已抢光' ?
< View style={
[styles.imageBottomTag, {
backgroundColor: btnBgColor,
position: 'absolute',
}]
} >
<Text style={
{
color: btnTextcolor
}
} > {
tipState
} </Text> </View>
:null }
</View>
<View style={styles.rowRight}>
<View style={styles.productTitlePrice}>
... ... @@ -69,12 +101,15 @@ export default class ProductListView extends Component {
: null }
</View>
{tipState == '已抢光' ?
<View style={[styles.priceClickTipViewRight, {backgroundColor: btnBgColor}]}>
<Text style={{color: btnTextcolor}}>{tipState}</Text>
{tipState == '已抢光' && url && url.lenth?
<View onPress={()=>{
this.props.onPressGuangShopWithURL && this.props.onPressGuangShopWithURL(url);
}} style={[styles.priceClickTipViewRight, {backgroundColor: 'white', borderColor:'black', borderWidth: 1}]}>
<Text style={{color: 'black'}}>进店逛逛</Text>
</View>
:
<TouchableOpacity onPress={() => {
:null}
{tipState != '已抢光'? <TouchableOpacity onPress={() => {
if (this.tipMessage == '') {
if (rowData.wait) {
this.props.onPressRemindBtn && this.props.onPressRemindBtn(rowData);
... ... @@ -98,7 +133,7 @@ export default class ProductListView extends Component {
</View>
}
</TouchableOpacity>
</TouchableOpacity>:null
}
</View>
</View>
... ... @@ -136,6 +171,16 @@ let styles = StyleSheet.create({
resizeMode: 'cover',
},
imageBottomTag: {
width: adjustPx(imageWidth),
height: 30,
marginRight: 10,
marginTop: adjustPx(imageHeight) - 30,
alignItems: 'center',
justifyContent: 'center',
borderRadius: 3,
backgroundColor: '#d0021b',
},
rowRight: {
flexDirection: 'column',
justifyContent: 'space-between',
... ...
... ... @@ -21,6 +21,7 @@ import TimeListView from "./TimeListView";
import Prompt from "../../../coupon/components/coupon/Prompt";
import YH_PtrRefresh from "../../../common/components/YH_PtrRefresh";
import ProductListCell from "../../../common/components/ListCell/ProductListCell";
import LoadingIndicator from '../../../common/components/LoadingIndicator';
const SECTION_TYPE_SECKILL = 1;
const SECTION_TYPE_DISCOUNT = 2;
... ... @@ -42,10 +43,10 @@ export default class Seckill extends Component {
componentDidMount() {
if (Platform.OS === 'ios') {
this.timer = TimerMixin.setTimeout(() => {
this.listView && this.listView.getScrollResponder().startPullToRefresh();
}, 0);
// this.timer = TimerMixin.setTimeout(() => {
// this.listView && this.listView.getScrollResponder().startPullToRefresh();
// }, 0);
this.props.onRefresh && this.props.onRefresh();
} else {
this.props.onRefresh && this.props.onRefresh();
}
... ... @@ -117,6 +118,7 @@ export default class Seckill extends Component {
<ProductListView
key={index}
rowData={item}
onPressGuangShopWithURL={this.props.onPressGuangShopWithURL}
onPressProductItem={this.props.onPressProductItem}
onPressRemindBtn={this.props.onPressRemindBtn}
tipMessage={this.tipMessage}
... ... @@ -128,8 +130,19 @@ export default class Seckill extends Component {
renderDiscountProduct({item, index}) {
let paddingLeft = index % 2 === 1 ? rowMarginHorizontal / 2 : rowMarginHorizontal;
let customStyle = index === 0 || index === 1 ? {
paddingLeft
} : {
paddingLeft
};
return <ProductListCell
style={styles.listContainer}
style={
[styles.listContainer, customStyle]
}
key={'row' + index}
rowID={index}
data={item}
... ... @@ -139,6 +152,7 @@ export default class Seckill extends Component {
renderDiscountSection({item}) {
return <FlatList
data={item}
style={{backgroundColor:'white'}}
numColumns={2}
renderItem={this.renderDiscountProduct}
/>
... ... @@ -166,17 +180,12 @@ export default class Seckill extends Component {
return (
<View style={styles.container}>
<SectionList
refreshControl={Platform.OS === 'ios' ? null : <YH_PtrRefresh
refreshing={isPullToRefresh}
onRefresh={() =>this.props.onRefresh && this.props.onRefresh()}
/>}
renderItem={this.renderItem}
contentContainerStyle={styles.contentContainer}
ListHeaderComponent={this.renderListHeaderComponent}
renderSectionFooter={this.renderSectionFooter}
renderSectionHeader={this.renderSectionHeader}
enablePullToRefresh={true}
isOnPullToRefresh={isPullToRefresh}
stickySectionHeadersEnabled={false}
onRefreshData={() => this.props.onRefresh && this.props.onRefresh()}
sections={[
{title: null, type: SECTION_TYPE_SECKILL, data: queryProductList ? queryProductList : []},
... ... @@ -188,6 +197,7 @@ export default class Seckill extends Component {
},
]}
/>
<LoadingIndicator isVisible={isPullToRefresh} />
{tipMessage != '' ?
<Prompt
text={tipMessage}
... ... @@ -205,6 +215,8 @@ export default class Seckill extends Component {
}
let {width, height} = Dimensions.get('window');
let diff = 0;
let rowWidth = Math.ceil(137.5 * width / 320);
let rowMarginHorizontal = (width - rowWidth * 2) / 3;
let styles = StyleSheet.create({
container: {
... ...
... ... @@ -21,6 +21,7 @@ export default class TimeForLostFocus extends Component {
now,
over,
wait,
specialState,
} = this.props;
let colorStyle = {color: '#3e3e3e'};
... ... @@ -29,8 +30,14 @@ export default class TimeForLostFocus extends Component {
text = '抢购中';
} else if (over) {
text = '已开抢';
} else if (wait) {
} else if (wait && !specialState) {
text = '即将开抢';
} else if (specialState) {
if (specialState == 1) {
text = '明天开抢';
} else {
text = '2天后开抢';
}
}
return (
... ...
... ... @@ -16,6 +16,7 @@ import TimeForLostFocus from './TimeForLostFocus';
let diff;
export default class SeckillTimeListView extends Component {
constructor(props) {
... ... @@ -150,6 +151,7 @@ export default class SeckillTimeListView extends Component {
_renderRow(rowData, sectionID, rowID) {
rowData = rowData.toJS();
return (
<TouchableOpacity activeOpacity={1.0} onPress={() => {
if (rowData.focus) {
... ... @@ -179,6 +181,9 @@ export default class SeckillTimeListView extends Component {
now={rowData.now}
over={rowData.over}
wait={rowData.wait}
specialState = {
rowData.specialState
}
/>
}
... ...
... ... @@ -39,6 +39,7 @@ class SeckillContainer extends Component {
this._onPressTimeItem = this._onPressTimeItem.bind(this);
this._onPressProductItem = this._onPressProductItem.bind(this);
this._onPressRemindBtn = this._onPressRemindBtn.bind(this);
this._onPressGuangShopWithURL = this._onPressGuangShopWithURL.bind(this);
this._onRefresh = this._onRefresh.bind(this);
this._onClearTipMessage = this._onClearTipMessage.bind(this);
this._onFocusToCurStartedActivity = this._onFocusToCurStartedActivity.bind(this);
... ... @@ -53,6 +54,12 @@ class SeckillContainer extends Component {
this.props.actions.clickProductItem(product);
}
_onPressGuangShopWithURL(url) {
if (url && url.length) {
NativeModules.YH_CommonHelper.jumpWithUrl(url);
}
}
_onPressRemindBtn(product) {
this.props.actions.clickRemindBtn(product);
}
... ... @@ -111,6 +118,7 @@ class SeckillContainer extends Component {
onPressTimeItem={this._onPressTimeItem}
onPressProductItem={this._onPressProductItem}
onPressRemindBtn={this._onPressRemindBtn}
onPressGuangShopWithURL={this._onPressGuangShopWithURL}
onRefresh={this._onRefresh}
onFetchDiscountProductList={this._onFetchDiscountProductList}
onClearTipMessage={this._onClearTipMessage}
... ...
... ... @@ -393,6 +393,7 @@ export function refreshList() {
* product.remindFlag = true [APP: 已添加提醒]
* product.remindFalg = false [APP: 默认提醒状态]
* Product.hideRemind = true [APP: queryRemindList接口失败的情况下]
* Product.specialState = 0 1,明天开抢 2.2天后开抢
*/
function productAddFlag(productList, remindList) {
let now = Date.now();
... ... @@ -401,7 +402,7 @@ function productAddFlag(productList, remindList) {
.sort((a, b) => b.orderBy - a.orderBy)
.forEach(product => {
let startTime = product.startTime * 1000; // s to ms
let endTime = product.endTime * 1000;
let endTime = product.endTime * 1000;
product.remindFlag = false;
product.readableTime = moment.unix(product.startTime).format('MM月DD日 HH:mm');
... ... @@ -447,6 +448,8 @@ function parseActivityTimeLsit(json, focusTime=0) {
}
}
let now = Date.now();
newActivityTimeList.forEach((activityTimeItem, i) => {
let date,
hour = 0,
... ... @@ -459,6 +462,19 @@ function parseActivityTimeLsit(json, focusTime=0) {
minute = date.getMinutes();
activityTimeItem.time = `${_timeFormat(hour)}:${_timeFormat(minute)}`;
activityTimeItem.specialState = 0;
let startDays = Math.floor(now / 1000 / 60 / 60 / 24);
let endDate = Math.floor(activityTimeItem.startTime / 1000 / 60 / 60 / 24);
let offsetDate = endDate - startDays;
if (offsetDate <= 2) {
activityTimeItem.specialState = offsetDate;
}
if (currentTime > activityTimeItem.startTime) {
if (i < newActivityTimeList.length - 1) {
let nextTime = newActivityTimeList[i + 1].startTime * 1000;
... ...
... ... @@ -60,6 +60,10 @@ export default function seckillReducer(state=initialState, action) {
.set('error', null);
}
case QUERY_PRODUCT_LIST_SUCCESS: {
console.log('wwwwwwwwww');
console.log(action.payload);
return state.set('isFetching', false)
.set('ptr', false)
.set('queryProductList', Immutable.fromJS(action.payload))
... ...
... ... @@ -5,10 +5,15 @@ import Request from '../../common/services/NativeRequest';
export default class SeckillService {
constructor (host) {
let baseURL = 'http://api.yoho.cn';
console.log(host);
let baseURL = 'http://apigray.yoho.cn';
if(host){
console.log('lalalallala lalalla ');
baseURL = host;
}
this.api = new Request(baseURL);
}
... ...