'use strict';

import React, { Component } from 'react';
import Immutable, {List, Record} from 'immutable';

import AccountSettlement from '../components/AccountSettlement'

import {
    View,
    StyleSheet,
    Dimensions,
    Platform
}
from 'react-native';

import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';

import {Map} from 'immutable';

import * as accountSettlementActions from '../reducers/accountSettlement/accountSettlementActions';

const actions = [
    accountSettlementActions,
];

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 AccountSettlementContainer extends Component {

	constructor(props) {
		super(props);

	}

	componentDidMount() {
        this.props.actions.nextPageOfDataRequest();
	}

    componentWillUnmount() {
        this.props.actions.accountSettlementClean();
    }

	render() {
        let {actStmt} = this.props;

        let dataBlob = {
			'SECTION_HEADER': [{title:'累计结算金额（元）',content:`${actStmt.sum}`}],
			'SECTION_SEPORATOR': [{}],
			'SECTION_TITLE': [{}],
			'SECTION_CONTENT': actStmt.list,
		};

        let mapBlob = Immutable.fromJS(dataBlob);

		return (
            <View style={styles.container}>
                <AccountSettlement
                    dataBlob={mapBlob}
                    isFetching={actStmt.isFetching}
                />
            </View>
		);
	}
}

let {width, height} = Dimensions.get('window');
let navbarHeight = (Platform.OS === 'android') ? 50 : 64;

let styles = StyleSheet.create({
    container: {
        top: navbarHeight,
        height: height - navbarHeight,
    },

});

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