AllBrandListCell.js 2.48 KB
'use strict';

import React from 'react';
import ReactNative from 'react-native';
import Immutable, {Map} from 'immutable';

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

export default class AllBrandListCell extends React.Component {
    constructor(props) {
      super(props);
    }

    shouldComponentUpdate(nextProps){

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

    render() {
    	let data = this.props.rowData;
		let name = data.get('brand_name');
		let is_hot = data.get('is_hot');
		let is_show_new = data.get('is_show_new');
        let yh_exposureData = this.props.yh_exposureData?this.props.yh_exposureData:null;
        if (yh_exposureData) {
            yh_exposureData = {
                BRAND_ID: data.get('id')?data.get('id'):'0',
                ...yh_exposureData,
            };
        }

		return (
			<TouchableOpacity style={{overflow:'hidden'}} yh_exposureData={yh_exposureData} activeOpacity={0.5} onPress={() => {
				this.props.onPressBrandItem && this.props.onPressBrandItem(this.props.rowData.toJS());
			}}>
                <View style={styles.row}>
    				<View style={styles.rowTitle}>
    					<Text style={styles.rowText}>{name}</Text>
    					{is_show_new=='Y' ? <View style={styles.new}><Text style={styles.text}>NEW</Text></View> : null}
    					{is_hot=='Y' ? <View style={styles.hot}><Text style={styles.text}>HOT</Text></View> : null}
    				</View>
                    <View style={{width: width - 30,height: 0.5,marginLeft:10,backgroundColor: '#e5e5e5',}}/>
                </View>
			</TouchableOpacity>
		);
    }
};


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

let styles = StyleSheet.create({
	rowText: {
		textAlign: 'left',
		fontSize: 17,
		marginLeft:10,
        color: '#444444',
	},
    row: {
		height: 44,
		width,
		backgroundColor: 'white',
        overflow:'hidden',
	},
	rowTitle: {
		flexDirection: 'row',
		alignItems: 'center',
		height: 43.5,
		width,
		backgroundColor: 'white',
	},
	text: {
		textAlign: 'left',
		fontSize: 13,
		color: 'white',
        fontWeight: 'bold',
    },
	hot: {
		alignItems: 'center',
		height: 17,
		width: 40,
		backgroundColor: '#ca0b22',
		marginLeft: 10,
		justifyContent: 'center',
		borderRadius: 30,
	},
	new: {
		alignItems: 'center',
		height: 17,
		width: 40,
		backgroundColor: 'green',
		marginLeft: 10,
		justifyContent: 'center',
		borderRadius: 30,
	},
});