'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, Record} from 'immutable';
import * as listActions from '../reducers/list/listActions';

import Swiper from 'react-native-swiper'
import Segment from '../components/list/Segment';
import OrderList from '../components/list/OrderList'
import {urlAddParamOfType} from '../../common/utils/urlHandler';

const actions = [
    listActions,
];

function mapStateToProps(state) {
    return {
        ...state
    };
}

function mapDispatchToProps(dispatch) {

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

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

class ListContainer extends Component {
    constructor(props) {
        super(props);
        this._onEndReached = this._onEndReached.bind(this);
        this._onRefresh = this._onRefresh.bind(this);
        this._onLoadMore = this._onLoadMore.bind(this);
        this._onPressEmptyItem = this._onPressEmptyItem.bind(this);

        this._orderAction = this._orderAction.bind(this);
        this._showDelayDeliveryNotice = this._showDelayDeliveryNotice.bind(this);
        this._pay = this._pay.bind(this);
        this._buyAgain = this._buyAgain.bind(this);
        this._cancel = this._cancel.bind(this);
        this._checkLogistics = this._checkLogistics.bind(this);
        this._refundOrExchange = this._refundOrExchange.bind(this);
        this._comment = this._comment.bind(this);
        this._callCustomService = this._callCustomService.bind(this);
        this._confirmReceipt = this._confirmReceipt.bind(this);
        this._delete = this._delete.bind(this);
        this._checkQRCode = this._checkQRCode.bind(this);
        this._editAddress = this._editAddress.bind(this);
        this._applyforRefund = this._applyforRefund.bind(this);
        this._goDetail = this._goDetail.bind(this);
        this._onSelectIndex = this._onSelectIndex.bind(this);

        this.subscription = NativeAppEventEmitter.addListener(
            'PaySuccessEvent',
            (reminder) => {
                this.allList._triggePullToRefresh();
                this.onPayList._triggePullToRefresh();
                this.onDeliveryList._triggePullToRefresh();
            }
        );
        this.subscription1 = NativeAppEventEmitter.addListener(
            'CancelSuccessEvent',
            (reminder) => {
                this.allList._triggePullToRefresh();
                this.onPayList._triggePullToRefresh();
            }
        );
        this.subscription2 = NativeAppEventEmitter.addListener(
            'RefundSuccessEvent',
            (reminder) => {
                this.allList._triggePullToRefresh();
                this.onDeliveryList._triggePullToRefresh();
            }
        );
        this.subscription3 = NativeAppEventEmitter.addListener(
            'ConfirmSuccessEvent',
            (reminder) => {
                this.allList._triggePullToRefresh();
                this.onReceiveList._triggePullToRefresh();
            }
        );
    }

    componentDidMount() {
        // let {list}=this.props;
        // let showIndex = list.get('showIndex');
        // InteractionManager.runAfterInteractions(() => {
        //     this.props.actions.getOrderListByType(showIndex+1);
        // });
    }

    componentWillUnmount() {
        this.subscription1 && this.subscription1.remove();
        this.subscription2 && this.subscription2.remove();
    }

    _onEndReached(type) {
        InteractionManager.runAfterInteractions(() => {
            this.props.actions.getOrderListByType(type);
        });
    }
    _onRefresh(type) {
        console.log('_onRefresh:'+type);
        let {list}=this.props;
        let showIndex = list.get('showIndex');
        console.log(showIndex);
        InteractionManager.runAfterInteractions(() => {
            this.props.actions.resetStateWhenRefresh(showIndex+1);
            this.props.actions.getOrderListByType(showIndex+1);
        });
    }

    _onLoadMore(type){
        let {list}=this.props;
        let showIndex = list.get('showIndex');
        InteractionManager.runAfterInteractions(() => {
            this.props.actions.getOrderListByType(showIndex+1);
        });
    }

    _onPressEmptyItem() {
        NativeModules.YH_MessageHelper.jumpNew();
    }

    _showDelayDeliveryNotice(noticeString){
        NativeModules.YH_OrderHelper.deliveryDelayNotice(noticeString);
    }

    _pay(type,orderData){
        InteractionManager.runAfterInteractions(() => {
            NativeModules.YH_OrderHelper.jumpChoosePayway(orderData);
        });
    }

    _buyAgain(type,orderData){
        let orderCode = orderData.get('order_code');
        this.props.actions.buyAgain(type,orderCode)
    }

    _cancel(type,orderData){
        this.props.actions.cancelOrder(type,orderData);
    }

    _checkLogistics(type,orderData){
        NativeModules.YH_OrderHelper.jumpLogistics(orderData);
    }

    _refundOrExchange(type,orderData){

    }

    _comment(type,orderData){
        let orderCode = orderData.get('order_code');
        NativeModules.YH_OrderHelper.jumpShareOrder(orderCode);
    }

    _callCustomService(type,orderData){
        NativeModules.YH_OrderHelper.callCustomService();
    }

    _confirmReceipt(type,orderData){

    }

    _delete(type,orderData){
        let orderCode = orderData.get('order_code');
        this.props.actions.deleteOrder(type,orderCode);
    }

    _checkQRCode(type,orderData){
        NativeModules.YH_OrderHelper.jumpCheckQRCode();
    }

    _editAddress(type,orderData){
        this.props.actions.modifyAdress(type,orderData);
    }

    _applyforRefund(type,orderData){

    }

    _goDetail(type,orderData){
        NativeModules.YH_OrderHelper.jumpOrderDetail(orderData);
    }

    _orderAction(type,orderData,link){
        console.log('link = ' + link + '    type = ' + type);

        switch (link) {
            case 'buyNow': this._pay && this._pay(type,orderData);
                break;
            case 'getExpress': this._checkLogistics && this._checkLogistics(type,orderData);
                break;
            case 'delOrder': this._delete && this._delete(type,orderData);
                break;
            case 'afterService': this._callCustomService && this._callCustomService(type,orderData);
                break;
            case 'modifyAddress': this._editAddress && this._editAddress(type,orderData);
                break;
            case 'shareOrder': this._comment && this._comment(type,orderData);
                break;
            case 'lookQrcode': this._checkQRCode && this._checkQRCode(type,orderData);
                break;
            case 'closeOrder':
            case 'refundApply':
            case 'confirm':
            case 'readd':
            {
                let {list}=this.props;
                let showIndex = list.get('showIndex');
                let param = {
                    index: showIndex,
                    type: link,
                    data: orderData.toJS(),
                }
                NativeModules.YH_OrderHelper.rnOrderListActionWithParam(param);
            }
                break;

        }
    }

    _onSelectIndex(index){
        console.log(index);
        // this.props.actions.setShowIndex && this.props.actions.setShowIndex(index);
        // this._swiper.scrollBy(index,true);
    }

    render() {
        let {list}=this.props;
        let showIndex = list.get('showIndex');
        return (
            <View style={styles.container}>
                <Segment
                    defaultPage = {showIndex}
                    _onSelectIndex={this._onSelectIndex}
                />
                <Swiper style = {styles.swiper}
                    ref={(swiper) => {this._swiper = swiper;}}
                    loop={false}
                    index={showIndex}
                    onMomentumScrollEnd={(event) =>{
                        console.log(event.nativeEvent);
                    }}
                >
                    <OrderList style={styles.slide}
                        ref={(c) => {
                            this.allList = c;
                        }}
                        dataSource={list.get('all')}
                        type={'all'}
                        _onPressEmptyItem={this._onPressEmptyItem}
                        _onRefresh={this._onRefresh}
                        _onLoadMore={this._onLoadMore}
                        _orderAction={this._orderAction}
                        _onGoDetail={this._goDetail}
                        _onPressDelayNotice={this._showDelayDeliveryNotice}
                    />

                    <OrderList style={styles.slide}
                        ref={(c) => {
                            this.onPayList = c;
                        }}
                        dataSource={list.get('onPay')}
                        type={'onPay'}
                        _onPressEmptyItem={this._onPressEmptyItem}
                        _onRefresh={this._onRefresh}
                        _onLoadMore={this._onLoadMore}
                        _orderAction={this._orderAction}
                        _onGoDetail={this._goDetail}
                        _onPressDelayNotice={this._showDelayDeliveryNotice}
                    />

                    <OrderList style={styles.slide}
                        ref={(c) => {
                            this.onDeliveryList = c;
                        }}
                        dataSource={list.get('onDelivery')}
                        type={'onDelivery'}
                        _onPressEmptyItem={this._onPressEmptyItem}
                        _onRefresh={this._onRefresh}
                        _onLoadMore={this._onLoadMore}
                        _orderAction={this._orderAction}
                        _onGoDetail={this._goDetail}
                        _onPressDelayNotice={this._showDelayDeliveryNotice}
                    />

                    <OrderList style={styles.slide}
                        ref={(c) => {
                            this.onReceiveList = c;
                        }}
                        dataSource={list.get('onReceive')}
                        type={'onReceive'}
                        _onPressEmptyItem={this._onPressEmptyItem}
                        _onRefresh={this._onRefresh}
                        _onLoadMore={this._onLoadMore}
                        _orderAction={this._orderAction}
                        _onGoDetail={this._goDetail}
                        _onPressDelayNotice={this._showDelayDeliveryNotice}
                    />
                </Swiper>
            </View>
        );
    }
}

let {width, height} = Dimensions.get('window');

let styles = StyleSheet.create({
    container: {
        flex: 1,
        flexDirection: 'column',
    },
    swiper: {
        backgroundColor: 'transparent',
    },
    slide: {
      justifyContent: 'center',
      alignItems: 'center',
    }
});

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