SingleImage.js 3.39 KB
'use strict';

import React from 'react';
import ReactNative from 'react-native';
import Immutable, {Map} from 'immutable';
import YH_Image from '../../../common/components/YH_Image';

const {
    View,
    Text,
    TouchableOpacity,
    Dimensions,
    StyleSheet,
	Platform,
} = ReactNative;

export default class SingleImage extends React.Component {

    constructor(props) {
        super (props);
    }

    shouldComponentUpdate(nextProps,nextState){
        if (Immutable.is(nextProps.resource, this.props.resource)) {
            return false;
        } else {
            return true;
        }
    }

    render() {

        let {resource} = this.props;
        if (!resource) {
            return null;
        }

        let list = resource.get('module_data').get('data').toJS();
        let data = list?list[0]:null;
        let backgroundImage = data.pic;
        let linkType = data.linkType;
        let showProductInfo = data.showProductInfo;
        let properties = resource.get('module_data').get('properties').toJS();
        let imageW = properties.width;
        let imageH = properties.height;
        imageW = imageW ? imageW : width;
        imageH = imageH ? imageH : 200
        let isModuleMargin = properties.isModuleMargin;
        let imageHeight = (imageH*width)/(imageW==0?1:imageW);//根据返回信息计算出高度
        let backgroundHeight =isModuleMargin?((imageH*width)/(imageW==0?1:imageW)+10):(imageH*width)/(imageW==0?1:imageW);
        let product = data.product;
        let salePrice = product?parseFloat(product.sales_price):0;
        let originPrice = product?parseFloat(product.market_price):0;
        let name = product?product.product_name:'';
        let price = '¥' + salePrice.toFixed(2);
        let sale = '¥' + originPrice.toFixed(2);
        let saleAble = false;//salePrice>0?true:false;
        let linkReource = data.resource;

		return (
			<TouchableOpacity activeOpacity={0.5} style={{width: backgroundWidth, height:backgroundHeight,backgroundColor: 'white'}} onPress={() => {
				this.props.onPressProduct && this.props.onPressProduct(linkType,linkReource);
			}}>
				<View style={{width: backgroundWidth, height:backgroundHeight,backgroundColor: 'white'}}>
					<YH_Image
                        url={backgroundImage}
						style={{width: backgroundWidth, height: imageHeight}}
					/>
					{linkType=='1' && showProductInfo?<View style={{ width: width, height: 35,position: 'absolute',backgroundColor: 'rgba(0,0,0,0.3)',top: imageHeight-35,flexDirection: 'row',alignItems: 'center',justifyContent: 'space-around'}}>
						<Text style={styles.text1}>{name}</Text>
						<Text style={{marginRight: 10,fontSize: 15,backgroundColor: 'transparent',color: saleAble?'red':'white'}}>{price}</Text>
                        {saleAble?<Text style={styles.deleteSale}>{sale}</Text>:null}
					</View>:null}
				</View>
			</TouchableOpacity>
		);
    }
}

let {width, height} = Dimensions.get('window');
let backgroundWidth = width;
let styles = StyleSheet.create({
	text1: {
		width: width- 100,
		fontSize: 15,
		fontWeight: 'bold',
		backgroundColor: 'transparent',
		color: 'white',
        marginLeft: 10,
	},
	text2: {
        marginRight: 10,
		fontSize: 15,
		backgroundColor: 'transparent',
		color: 'white',
	},
    deleteSale: {
        marginRight: 10,
        fontSize: 12,
        backgroundColor: 'transparent',
        color: 'white',
        textDecorationLine: 'line-through',
    }
});