Statistics.js 3.35 KB
'use strict';

import React, {Component} from 'react';
import {DeviceEventEmitter, Dimensions, Image, StyleSheet, Text, TouchableOpacity, View} from 'react-native';

export default class Statistics extends Component {
    constructor(props) {
        super(props);
    }

    componentDidMount() {
        this.subscription = DeviceEventEmitter.addListener('BankCardBindSuccessEvent', () => {
            this.props.refreshSettlementInfo && this.props.refreshSettlementInfo();
        });
    }

    componentWillUnmount() {
        this.subscription.remove();
    }

    render() {
        let {statisticsInfo} = this.props;
        return (
            <TouchableOpacity activeOpacity={1} style={styles.container} onPress={() => {
                this.props.jumpWithUrl && this.props.jumpWithUrl('全部佣金', 'orderIncome');
            }} >
            <View style={styles.container}>
                <View style={styles.statisticsView}>
                    <View style={{width: width / 2, paddingLeft: 30, marginTop: -10}}>
                        <Text style={styles.numberText}>¥{statisticsInfo.orderAmountSum}</Text>
                        <Text style={styles.tipsText}>预估订单佣金</Text>
                    </View>
                    <View style={styles.spaceView}/>
                    <View style={{width: width / 2, paddingLeft: 30, marginTop: -10}}>
                        <Text style={styles.numberText}>¥{statisticsInfo.extraAmountSum}</Text>
                        <Text style={styles.tipsText}>预估其他佣金</Text>
                    </View>
                </View>
                <View style={styles.lineView}/>
                <View style={styles.statisticsView}>
                    <View style={{width: width / 2, paddingLeft: 30, marginTop: -10}}>
                        <Text style={styles.numberText}>{statisticsInfo.orderNum}</Text>
                        <Text style={styles.tipsText}>订单数</Text>
                    </View>
                    <View style={styles.spaceView}/>
                    <View style={{width: width / 2, paddingLeft: 30, marginTop: -10}}>
                        <Text style={styles.numberText}>{statisticsInfo.clickNum}</Text>
                        <Text style={styles.tipsText}>点击数</Text>
                    </View>
                </View>
                <View style={styles.lineView}/>
            </View>
            </TouchableOpacity>
        );
    }

}

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

let styles = StyleSheet.create({
        container: {
            flex: 1,
        },
        statisticsView: {
            width: width,
            height: 90,
            backgroundColor: 'white',
            flexDirection: 'row',
            alignItems: 'center',
        },
        numberText: {
            fontFamily: 'PingFang-SC-Regular',
            fontSize: 25,
            color: '#444444',
        },
        tipsText: {
            fontFamily: 'PingFang-SC-Regular',
            marginTop: 5,
            fontSize: 12,
            color: '#B0B0B0',
        },
        arrowImage: {
            width: 16,
            height: 16,
            marginLeft: 2,
        },
        spaceView: {
            width: 0.5,
            height: 90,
            backgroundColor: '#e0e0e0'
        },
        lineView: {
            width: width,
            height: 0.5,
            backgroundColor: '#e0e0e0'
        }
    })
;