'use strict';

import React, {Component} from 'react';
import {Dimensions, ListView, StyleSheet, Text, TouchableOpacity, View} from 'react-native';
import {Immutable} from 'immutable';


export default class EstimateIncome extends Component {

    constructor(props) {
        super(props);
        this.state = {
            tabType: this.props.tabType,
            timeType: this.props.timeType,
        };

        this._renderRow = this._renderRow.bind(this);
        this.dataSource = new ListView.DataSource({
            rowHasChanged: (r1, r2) => !Immutable.is(r1, r2),
        });
    }

    _renderRow(rowData, sectionID, rowID) {
        let status = rowData.get('status') === '10' ? '待结算' : '';
        return (
            <View>
                <TouchableOpacity activeOpacity={1} onPress={() => {
                    this.props.jumpWithUrl && (this.state.tabType === 1 ? this.props.jumpWithUrl('订单详情', 'orderDetail', rowData.get('orderCode')) : this.props.jumpWithUrl('佣金详情', 'activityOrderDetail', rowData.get('id')) );
                }}>
                    <View style={styles.rowView}>
                        <View style={{height: 70, paddingTop: 12, paddingBottom: 12}}>
                            { this.state.tabType === 1 ? <Text style={styles.numberText}>订单金额：{rowData.get('lastOrderAmountStr')}</Text> : <Text style={styles.numberText}>活动名称：{rowData.get('activityName')}</Text>}
                            <View style={{flexDirection: 'row', marginTop: 6}}>
                                <Text style={styles.timeText}>{rowData.get('orderTimeStr')}</Text>
                                {rowData.get('isNew') === 1 && this.state.tabType === 1  ?
                                    <View style={styles.statusTextContainer}>
                                        <Text style={styles.statusText}>新客订单</Text>
                                    </View>: null}
                            </View>
                        </View>
                        <View>
                            <Text style={styles.priceText}>{rowData.get('amountStr')}</Text>
                            <Text style={[styles.timeText, {fontSize:12, textAlign:'right'}]}>{status}</Text>
                        </View>
                    </View>
                    <View style={styles.lineView}/>
                </TouchableOpacity>
            </View>
        );
    }

    render() {
        let {estimateList} = this.props;
        let estimateLists = estimateList.list ? estimateList.list.toArray() : [];
        return (
            <View style={styles.container}>
                <ListView
                    ref={(c) => {
                        this.listView = c;
                    }}
                    // yh_viewVisible={true}
                    contentContainerStyle={styles.contentContainer}
                    enableEmptySections={true}
                    dataSource={this.dataSource.cloneWithRows(estimateLists)}
                    renderRow={this._renderRow}
                    onEndReached={() => {
                        if (estimateLists.size !== 0) {
                            this.props.onEndReached && this.props.onEndReached();
                        }
                    }}/>
            </View>
        );
    }
}

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

let styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#f0f0f0',
        alignItems: 'center'
    },
    contentContainer: {
        width: width,
        backgroundColor: 'white'
    },
    rowView: {
        width: width,
        height: 70,
        flexDirection: 'row',
        paddingLeft: 15,
        paddingRight: 15,
        alignItems: 'center',
        justifyContent: 'space-between'
    },
    underLine: {
        width: 56,
        height: 2,
        backgroundColor: '#444444',
    },
    lineView: {
        width: width,
        height: 0.5,
        backgroundColor: '#e0e0e0'
    },
    numberText: {
        fontFamily: 'PingFang-SC-Regular',
        fontSize: 14,
        color: '#444444',
        letterSpacing: -0.19,
    },
    priceText: {
        fontFamily: 'PingFang-SC-Medium',
        fontSize: 16,
        color: '#444444',
        letterSpacing: -0.21,
        fontWeight: 'bold'
    },
    timeText: {
        fontFamily: 'PingFang-SC-Regular',
        fontSize: 14,
        color: '#B0B0B0',
        letterSpacing: -0.19,
    },
    statusTextContainer: {
        width: 48,
        height: 18,
        marginLeft: 10,
        borderWidth: 1,
        borderColor: '#D0021B',
        borderRadius: 2,
        alignItems: 'center',
        justifyContent: 'center',
    },
    statusText: {
        fontFamily: 'PingFang-SC-Regular',
        fontSize: 10,
        color: '#D0021B',
        letterSpacing: -0.24,
        textAlign: 'center',
    },
});