Blame view

js/home/containers/HomeContainer.js 11.4 KB
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
'use strict'

import React, {Component} from 'react';
import ReactNative, {
    StyleSheet,
    Dimensions,
    Platform,
    View,
    Text,
    NativeModules,
    InteractionManager,
    NativeAppEventEmitter,
} from 'react-native'

import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {Map} from 'immutable';
import * as homeActions from '../reducers/home/homeActions';
19
import * as appActions from '../reducers/app/appActions';
20
import channelTransfer from '../../common/utils/channelTransfer';
21 22 23 24 25

import Home from '../components/home/Home';

const actions = [
    homeActions,
26
    appActions
27 28 29
];

function mapStateToProps(state) {
30 31 32 33
    let {app, home} = state;
        let channel = app.channel;
        let channelStr = channelTransfer.number2String(channel);
        let data =  home[channelStr];
34
    return {
35 36
        channel,
        data,
37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56
    };
}

function mapDispatchToProps(dispatch) {

    const creators = Map()
        .merge(...actions)
        .filter(value => typeof value === 'function')
        .toObject();

    return {
        actions: bindActionCreators(creators, dispatch),
        dispatch
    };
}

class HomeContainer extends Component {
    constructor(props) {
        super(props);
57 58
        this.onRefresh = this.onRefresh.bind(this);
        this.onEndReached = this.onEndReached.bind(this);
于良 authored
59
        this.onPressAnnounceItem = this.onPressAnnounceItem.bind(this);
60
        this.onPressShopFavorite = this.onPressShopFavorite.bind(this);
61
        this.onPressTitleMore = this.onPressTitleMore.bind(this);
62
        this.onClickSort = this.onClickSort.bind(this);
63
        this.onClickRecommendProduct = this.onClickRecommendProduct.bind(this);
64 65 66 67
        this.onLongPressProduct = this.onLongPressProduct.bind(this);
        this.onPressFindSimilar = this.onPressFindSimilar.bind(this);
        this.onPressDislike = this.onPressDislike.bind(this);
        this.onPressProductListProduct = this.onPressProductListProduct.bind(this);
68
        this.onPressReloadData = this.onPressReloadData.bind(this);
69
        this.onPressChangeChannel = this.onPressChangeChannel.bind(this);
70
71 72 73 74
        //统一回调
        this.onPressFloorItem = this.onPressFloorItem.bind(this);
        this.onPressProductItem = this.onPressProductItem.bind(this);
75 76 77
        this.subscription = NativeAppEventEmitter.addListener(
            'ChannelDidChangeEvent',
            (reminder) => {
78 79 80
                //增加了IOS的判断,Android不需要此方法,因为Android首页的四个频道为四个不同的原生界面,调用此方法会导致重复渲染数据
                if (Platform.OS === 'ios') {
                    this.props.actions.setChannel(reminder.channel);
81
                    this.home && this.home.trigggePullToRefresh(true);
82
                }
83 84
            }
        );
85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111
        this.subscription2 = NativeAppEventEmitter.addListener(
            'UserDidLoginEvent',
            (reminder) => {
                this.home && this.home.trigggePullToRefresh();
            }
        );

        this.subscription3 = NativeAppEventEmitter.addListener(
            'UserDidLogoutEvent',
            (reminder) => {
                this.home && this.home.trigggePullToRefresh();
            }
        );

        this.subscription4 = NativeAppEventEmitter.addListener(
            'ABTestDidChangeEvent',
            (reminder) => {
                this.home && this.home.trigggePullToRefresh();
            }
        );

        this.subscription5 = NativeAppEventEmitter.addListener(
            'UserDidRegisterEvent',
            (reminder) => {
                this.home && this.home.trigggePullToRefresh();
            }
        );
112 113 114
    }

    componentDidMount() {
115
        this.props.actions.loadChannelCachedData();
116
        this.home && this.home.trigggePullToRefresh();
117
        // this.props.actions.setShowSimilarGuider(true);
118 119 120 121
    }

    componentWillUnmount() {
        this.subscription && this.subscription.remove();
122 123 124 125
        this.subscription2 && this.subscription2.remove();
        this.subscription3 && this.subscription3.remove();
        this.subscription4 && this.subscription4.remove();
        this.subscription5 && this.subscription5.remove();
126
    }
127
128 129 130 131 132
    onLongPressProduct(rowID) {
        if (rowID) {
            this.props.actions.setSimilarIndex(rowID);
        }
    }
133
134 135 136 137
    onPressFindSimilar(product) {
        if (!product) {
            return;
        }
138
        ReactNative.NativeModules.YH_CommonHelper.jumpFindSimilar(product.toJS());
139
        ReactNative.NativeModules.YH_CommonHelper.setSimilarGuiderVisible(false);
140
        this.props.actions.setSimilarIndex(-1);
141 142
        this.props.actions.setShowSimilarGuider(false, false);
143 144
    }
145 146 147
    onPressDislike(product, similarIndex) {
        this.props.actions.setSimilarIndex(-1);
        let product_skn = product && product.get('product_skn', 0);
148
        if (!product_skn || productSkn == 0) {
149 150 151
            return;
        }
        this.props.actions.fetchDislike(similarIndex, product_skn);
152 153
    }
154 155 156 157
    //统一回调
    onPressProductItem(productData, imageUrl, index, floorData, floorIndex) {
        let productSkn = productData && productData.get('product_skn', 0);
        if (!productSkn || productSkn == 0) {
158
          return;
159 160 161 162 163 164 165 166
        }
        let jumpUrl = `http://m.yohobuy.com?openby:yohobuy={"action":"go.productDetail","params":{"product_skn":"${productSkn}"}}`;
        this.jumpWithUrl(jumpUrl, imageUrl, index, floorData, floorIndex);
    }

    onPressFloorItem(jumpUrl, imageUrl, index, floorData, floorIndex) {
        this.jumpWithUrl(jumpUrl, imageUrl, index, floorData, floorIndex);
    }
167
168 169 170 171 172 173
    onPressProductListProduct(productData, imgUrl, index) {
      let productSkn = productData && productData.get('product_skn', 0);
      let productId = productData && productData.get('product_id', 0);
      if (productSkn == 0 || !productSkn) {
          return;
      }
174 175
      let url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.productDetail","params":{"product_skn":"${productSkn}"}}`;
      ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url);
176
177
      let {channel ,data} = this.props;
178
179 180
      let rec_id = '';
      let rec_pose = '';
181
      if (channel == 1) {
182
          rec_pose = '100001';
183
      } else if (channel == 2) {
184
          rec_pose = '100002';
185
      } else if (channel == 3) {
186
          rec_pose = '100006';
187
      } else if (channel == 4) {
188 189 190
          rec_pose = '100011';
      }
191
      if (channel == 1 || channel == 2) {
192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211
          rec_id = data.favorite.get('rec_id','');

          let chooseForYouParam = {
              'PRD_ID': productId,
              'PRD_NUM': parseInt(index)+1,
              'ACTION_ID': 1,
              'REC_ID': rec_id,
              'REC_POSE': rec_pose
          };

          NativeModules.YH_CommonHelper.logEvent('YB_CHOOSE_FOR_YOU', chooseForYouParam);
      }

      let param = {
                      'PRD_ID': productId,
                      'NAV_NUM': parseInt(index)+1,
                      'REC_ID': rec_id
                  };

      NativeModules.YH_CommonHelper.logEvent('YB_MAIN_CAT_NAV_RECPRD', param);
212
    }
213
    onRefresh() {
214
        // InteractionManager.runAfterInteractions(() => {
于良 authored
215
            this.props.actions.resetStateWhenRefresh();
216
            this.props.actions.fetchFloor();
217
        // });
218 219
    }
220 221 222 223
    onClickRecommendProduct() {
        this.props.actions.selectedRecommendProduct();
    }
224
    onEndReached() {
225 226 227 228 229 230 231
        let {channel ,data} = this.props;
        if (channel == 1 || channel == 2) {
            this.props.actions.fetchBoyGirlFavoriteList();
        } else if (channel == 3) {
            this.props.actions.fetchKidsFavoriteList();
        } else if (channel == 4) {
            this.props.actions.fetchLifeStyleFavoriteList();
232
        }
233 234
    }
235 236
    jumpWithUrl(jumpUrl, imageUrl, index, floorData, floorIndex) {
        if (!jumpUrl) {
于良 authored
237 238
            return;
        }
239
        ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(jumpUrl);
于良 authored
240
241 242 243 244 245 246 247 248 249
        let floorID = floorData.get('template_id','');
        let floorName = floorData.get('template_name','');
        let param = {
                        'F_ID': floorID,
                        'F_NAME': floorName,
                        'F_URL': jumpUrl,
                        'F_INDEX': parseInt(floorIndex)+1,
                        'I_INDEX': parseInt(index)+1
                    };
于良 authored
250
251
        NativeModules.YH_CommonHelper.logEvent('YB_MAIN_EVENT', param);
于良 authored
252 253
    }
254 255
    onPressAnnounceItem(jumpUrl, imageUrl, index, floorData, floorIndex) {
        this.jumpWithUrl(jumpUrl, imageUrl, index, floorData, floorIndex);
256
        NativeModules.YH_CommonHelper.logEvent('YB_MY_NOTICE_C', {'POS_ID': '2'});
257 258 259
    }

    onPressShopFavorite(shopId, index) {
260
        this.props.actions.favoriteOperation(shopId);
261 262
    }
263 264
    onPressTitleMore(jumpUrl, imageUrl, index, floorData, floorIndex) {
        this.jumpWithUrl(jumpUrl, imageUrl, index, floorData, floorIndex);
265 266
    }
267 268 269 270
    onClickSort(index) {
        this.props.actions.selecLifeStyleProductIndex(index);
    }
271 272 273 274
    onPressReloadData() {
        this.props.actions.fetchFloor();
    }
275 276
    onPressChangeChannel(url) {
        if (Platform.OS === 'ios') {
277 278
            let {channel} = this.props;
            if (channel == 1) {
279
                ReactNative.NativeModules.YH_CommonHelper.switchChannelByTheme(0);
于良 authored
280 281
                this.props.actions.setChannel('2');
                this.home && this.home.trigggePullToRefresh(true);
282
            } else if (channel == 2) {
283
                ReactNative.NativeModules.YH_CommonHelper.switchChannelByTheme(1);
于良 authored
284 285
                this.props.actions.setChannel('1');
                this.home && this.home.trigggePullToRefresh(true);
286
            }
287
        } else {
288
            ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url);
289
        }
290 291

        NativeModules.YH_CommonHelper.logEvent('YB_MAIN_BO', {'TOURL': url});
292 293
    }
294 295 296 297 298 299
    onExposureScroll(){
        if (Platform.OS === 'android'){
            NativeModules.YH_CommonHelper.exposeView();
        }
    }
300
    render() {
301
        let {channel, data} = this.props;
302 303 304 305
        return (
            <View style={styles.container}>
                <Home
                    ref={(c) => {
306
                        this.home = c;
307
                    }}
308 309
                    channel={channel}
                    data={data}
310 311
                    onRefresh={this.onRefresh}
                    onEndReached={this.onEndReached}
于良 authored
312
                    onPressAnnounceItem={this.onPressAnnounceItem}
313
                    onPressShopFavorite={this.onPressShopFavorite}
314
                    onPressTitleMore={this.onPressTitleMore}
315
                    onClickSort={this.onClickSort}
316 317 318 319
                    onLongPressProduct={this.onLongPressProduct}
                    onPressFindSimilar={this.onPressFindSimilar}
                    onPressDislike={this.onPressDislike}
                    onPressProductListProduct={this.onPressProductListProduct}
320
                    onClickRecommendProduct={this.onClickRecommendProduct}
321
                    onPressReloadData={this.onPressReloadData}
322
                    onPressChangeChannel={this.onPressChangeChannel}
323 324
                    onPressFloorItem={this.onPressFloorItem}
                    onPressProductItem={this.onPressProductItem}
325
                    onExposureScroll={this.onExposureScroll}
326 327 328 329 330 331
                />
            </View>
        );
    }
}
332 333
let {width, height} = Dimensions.get('window');
334 335
let styles = StyleSheet.create({
    container: {
336 337
        width,
        height: height - 64 - 49,
338
        flex: 1,
339 340 341 342
    },
});

export default connect(mapStateToProps, mapDispatchToProps)(HomeContainer);