Footer.js 3.39 KB
'use strict';

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

import ReactNative, {
    View,
    Text,
    Image,
    ListView,
    StyleSheet,
    Dimensions,
    TouchableOpacity,
    InteractionManager,
    Platform,
} from 'react-native';



export default class Detail extends Component {

    constructor(props) {
        super(props);

    }

    render() {

        let total_praised = this.props.total_praised;
        let is_praised = this.props.is_praised;

        let likeImgSource;
        let likeTextColor;
        if (is_praised == 'Y') {
            likeImgSource = require('../../image/liked.png');
            likeTextColor = '#d0021b';
        } else if (is_praised == 'N') {
            likeImgSource =require('../../image/unlike.png')
            likeTextColor = '#b0b0b0';
        }

        let fav_image = this.props.favorite?require('../../image/love_tab_ic_h.png'):require('../../image/love_tab_ic.png');
        let fav_title = this.props.favorite?'已收藏':'收藏';
        return (
            <View style={styles.footer}>

                <TouchableOpacity style={styles.favoriteButton}
                activeOpacity={1}
                onPress={() => {
                    this.props.onPressPraise && this.props.onPressPraise();
                }}>
                <View style={{flex: 1, flexDirection: 'row', alignItems: 'center'}}>
                    <Image style={styles.favIcon} source={likeImgSource}/>
                    <Text style={[styles.favText, {color: likeTextColor}]}>{total_praised}</Text>
                </View>
                </TouchableOpacity>

                <TouchableOpacity activeOpacity={1} style={styles.favoriteButton} onPress={() => {this.props.onPressFavorite&&this.props.onPressFavorite(this.props.favorite)}}>
                <View style={{flex: 1, flexDirection: 'row', alignItems: 'center'}}>
                    <Image style={styles.favIcon} source={fav_image}/>
                    <Text style={styles.favText}>{fav_title}</Text>
                </View>
                </TouchableOpacity>
                <View style={styles.detailButton}>
                    <Text
                    style={styles.detailButtonText}
                    onPress={() => {this.props.onPressProduct&& this.props.onPressProduct(Immutable.fromJS({'product_skn':this.props.product_skn}), -1)}}
                    >查看详情</Text>
                </View>
            </View>
        );
    }
}

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

let styles = StyleSheet.create({
    footer: {
        width: width,
        height: 59,
        borderColor: '#ededed',
        borderTopWidth: 1,
        flexDirection: 'row',
        alignItems: 'center',
    },
    detailButton: {
        position: 'absolute',
        width: 100,
        height: 44,
        top: 7,
        left: width - 15 - 100,
        backgroundColor: '#d0021b',
        borderRadius: 4,
        alignItems: 'center',
    },
    detailButtonText: {
        marginTop: 4,
        height: 36,
        color: 'white',
        paddingTop: (Platform.OS === 'ios') ? 10 : 7,
        textAlign: 'center',
        fontSize: 15,
    },
    favoriteButton: {
        height: 40,
        paddingLeft: 20,
        paddingRight: 10,
    },
    favIcon: {
        width: 17,
        height: 16,
        marginRight: 0,
    },
    favText: {
        fontSize: 13,
        color: '#b0b0b0',
        marginLeft: 5,
    },
});