outlet add 楼层 review by zhanglixia

@@ -24,13 +24,13 @@ export default class Outlet extends Component {
             categoryList,
         } = this.props;
 
-        console.log(categoryList.toJS());
         let isFetching = false;
 
         if (!categoryList) {
             return null;
         }
-        let list = categoryList.get('list').toJS();
+
+        let list = categoryList.get('list').toArray();
 
         return (
 
@@ -38,13 +38,15 @@ export default class Outlet extends Component {
                 renderTabBar={() => <ScrollableTabBar />}
             >
                 {list.map((item, i) => {
-                    let name = item.sort_name;
+                    let name = item.get('sort_name');
                     return (
                         <OutletPageListView
                             tabLabel={name}
                             key={'OutletPageListView' + i}
                             resource = {list[i]}
                             getOutletHomeResource = {this.props.getOutletHomeResource}
+                            onPressProduct = {this.props.onPressProduct}
+                            onPressFilter = {this.props.onPressFilter}
                         />
                     );
                 })}

+'use strict';
+
+import React from 'react';
+import ReactNative from 'react-native';
+
+const {
+    Image,
+	View,
+    StyleSheet,
+    Dimensions,
+    TouchableOpacity,
+} = ReactNative;
+
+import Immutable, {Map} from 'immutable';
+import YH_Image from '../../../common/components/YH_Image';
+import {getSlicedUrl} from '../../../classify/utils/Utils';
+
+export default class OutletDoubleImage extends React.Component {
+
+    constructor(props) {
+        super (props);
+    }
+
+    shouldComponentUpdate(nextProps){
+        if (Immutable.is(nextProps.resource, this.props.resource)) {
+            return false;
+        } else {
+            return true;
+        }
+    }
+
+    render() {
+
+		let {resource} = this.props;
+        if (!resource) {
+			return null;
+		}
+
+		let data = resource.get('data').toJS();
+
+		let src0 = getSlicedUrl(data[0].src, backgroundWidth, backgroundHeight);
+		let url0 = data[0].url;
+		let src1 = getSlicedUrl(data[1].src, backgroundWidth, backgroundHeight);
+		let url1 = data[1].url;
+		return (
+			<View style={styles.viewStyle}>
+				  <TouchableOpacity onPress={() => {this.props.onPressProduct&&this.props.onPressProduct(src0)}} >
+					  <YH_Image
+					  	url={src0}
+						style={styles.thumbnail}
+					  />
+				  </TouchableOpacity>
+
+				 <TouchableOpacity onPress={() => {this.props.onPressProduct&&this.props.onPressProduct(url1)}} >
+					  <YH_Image
+					   url={src1}
+					   style={styles.thumbnail}
+					 />
+				  </TouchableOpacity>
+				  <View style={styles.space} />
+			</View>
+		);
+    }
+};
+
+let {width, height} = Dimensions.get('window');
+let backgroundWidth = Math.ceil((275 / 640) * width);
+let backgroundHeight = Math.ceil((134 / 640) * width);
+let spaceH = Math.ceil((30 / 640) * width);
+
+const styles = StyleSheet.create({
+    thumbnail: {
+        width: backgroundWidth,
+        height: backgroundHeight,
+        marginLeft: spaceH,
+    },
+	viewStyle:{
+		flexDirection: 'row',
+        width: width,
+        height: backgroundHeight + spaceH,
+    },
+	space: {
+        width: width,
+        height: spaceH,
+        backgroundColor: 'white',
+    },
+});

@@ -14,6 +14,13 @@ import {
 
 import {Map} from 'immutable';
 import LoadingIndicator from '../../../common/components/LoadingIndicator';
+import OutletSwiper from './OutletSwiper';
+import OutletSingleImage from './OutletSingleImage';
+import OutletDoubleImage from './OutletDoubleImage';
+import OutletThreeImage from './OutletThreeImage';
+import OutletRecommendFive from './OutletRecommendFive';
+import ProductFliter from './ProductFliter';
+
 
 export default class OutletPageListView extends Component {
     constructor(props) {
@@ -32,15 +39,43 @@ export default class OutletPageListView extends Component {
 			resource,
 		} = this.props;
 
-		this.props.getOutletHomeResource && this.props.getOutletHomeResource(resource.content_code);
+		this.props.getOutletHomeResource && this.props.getOutletHomeResource(resource.get('content_code'));
 	}
 
 
     renderSectionHeader(sectionData, sectionID) {
+        if (sectionID == 'categoryNavigationList') {
+            return (
+                <ProductFliter
+                    resource={categoryNavigationList}
+                    onPressFilter={this.props.onPressFilter}
+                />
+            );
+        }
         return null;
     }
 
     renderRow(rowData, sectionID, rowID, highlightRow) {
+        console.log(rowData.toJS());
+        if (sectionID == 'outletHomeReource') {
+            if (rowData.get('template_name') == 'NL2R') {
+                return(<OutletThreeImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+            }else if (rowData.get('template_name') == 'focus') {
+                return(<OutletSwiper resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+            }else if (rowData.get('template_name') == 'single_image') {
+                return(<OutletSingleImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+            }else if (rowData.get('template_name') == 'double_image') {
+                return(<OutletDoubleImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+            }else if (rowData.get('template_name') == 'recommend_content_five') {
+                return(<OutletRecommendFive resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+            }else if (rowData.get('template_name') == 'app_hot_brands') {
+                return(<OutletRecommendFive resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+            }else if (rowData.get('template_name') == '文字广告') {
+                // return(<TripleImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+            }
+        }else if (sectionID == 'categoryNavigationList') {
+
+        }
         return null;
     }
 
@@ -50,35 +85,63 @@ export default class OutletPageListView extends Component {
             resource,
         } = this.props;
 
-        let isFetching = false;
-
         if (!resource) {
             return null;
         }
 
+        let isFetching = resource.get('isFetching')?resource.get('isFetching'):false;
+        let honeResource = resource.get('honeResource');
+        let error = resource.get('error');
+        let list;
+
+        if (honeResource) {
+            list = honeResource.get('list');
+        }
+
+        if (list) {
+            list.map((item, i) => {
+                 let template_name = item.get('template_name');
+                 if (template_name == 'categoryNavigation') {
+                     categoryNavigationList = item.get('data');
+                 }
+            })
+        }
+
+        let dataSource = {
+            outletHomeReource: honeResource?list.toArray():[],
+            categoryNavigationList: categoryNavigationList?categoryNavigationList.toArray():[],
+        };
+
+
+
+
+
         return (
 			<View style={styles.container}>
 				<ListView
 					ref='OutletPageListView'
 					contentContainerStyle={styles.contentContainerStyle}
 					enableEmptySections={true}
-					dataSource={this.dataSource.cloneWithRowsAndSections([])}
+					dataSource={this.dataSource.cloneWithRowsAndSections(dataSource)}
 					renderRow={this.renderRow}
 					renderSectionHeader={this.renderSectionHeader}
 				/>
+                <LoadingIndicator
+                    isVisible={isFetching}
+                />
 			</View>
         );
     }
 }
 
 let {width, height} = Dimensions.get('window');
-
+let categoryNavigationList;
 let styles = StyleSheet.create({
     container: {
         flex: 1,
-		backgroundColor: 'red',
+		backgroundColor: 'white',
     },
-    contentContainerStyle:{
+    contentContainerStyle: {
         flexDirection: 'row',
         flexWrap: 'wrap',
     },

+'use strict';
+
+import React from 'react';
+import ReactNative from 'react-native';
+
+const {
+    Image,
+	View,
+    StyleSheet,
+    Dimensions,
+	Text,
+	ListView,
+    TouchableOpacity,
+    Platform,
+} = ReactNative;
+
+import DeviceInfo from 'react-native-device-info';
+import Immutable, {Map} from 'immutable';
+import {getSlicedUrl} from '../../../classify/utils/Utils';
+
+export default class OutletRecommendFive extends React.Component {
+
+    constructor(props) {
+        super (props);
+
+        this.renderHeader = this.renderHeader.bind(this);
+        this.renderRow = this.renderRow.bind(this);
+
+		this.dataSource = new ListView.DataSource({
+			rowHasChanged: (r1, r2) => !Immutable.is(r1, r2),
+		});
+    }
+
+    shouldComponentUpdate(nextProps){
+        if (Immutable.is(nextProps.resource, this.props.resource)) {
+            return false;
+        } else {
+            return true;
+        }
+    }
+
+	renderRow(rowData, sectionID, rowID, highlightRow) {
+
+		let newSrc = getSlicedUrl(rowData.get('src'), 80, 80, 2);
+
+		return (
+			<TouchableOpacity activeOpacity={0.5}  onPress={() => {
+				this.props.onPressRecommendItem && this.props.onPressRecommendItem(rowData.get('url'));
+			}}>
+				<View style={styles.rowContainer}>
+					<Image
+					 	source={{uri: newSrc}}
+	 			 		style={styles.thumbnail}
+	 			 	>
+					</Image>
+				</View>
+			</TouchableOpacity>
+
+		);
+	}
+
+	renderHeader() {
+		let fontFamilyStyle = {};
+ 		if (Platform.OS === 'ios') {
+ 			let systemVersion = DeviceInfo.getSystemVersion();
+ 			systemVersion = parseFloat(systemVersion);
+ 			if (systemVersion >= 9.0) {
+ 				fontFamilyStyle = {fontFamily: 'PingFang SC'};
+ 			}
+ 		}
+
+		let data = this.props.resource.get('data');
+		let title = data.get('title');
+
+	  	return(
+            <View style={styles.titleB}>
+                <View style={{width: width,height: 0.5,backgroundColor: '#e5e5e5',}}/>
+    			<View style={styles.title}>
+    				<Text style={[styles.text, fontFamilyStyle]}>{title.get('title')}</Text>
+    			</View>
+                <View style={{width: width,height: 0.5,backgroundColor: '#e5e5e5',}}/>
+            </View>
+		);
+	}
+
+    render() {
+		let data = this.props.resource.get('data');
+
+		let list = data.get('list')?data.get('list').toArray():null;
+        if (!list || list.length == 0) {
+            return null;
+        }
+
+        let backgroundWidth =  width;
+        let backgroundHeight = 40 + Math.ceil(list.length / 4) * itemWidth + spaceH;
+        return (
+            <View style={{width: backgroundWidth, height:backgroundHeight, backgroundColor:'#f0f0f0'}}>
+				<ListView
+				    contentContainerStyle={styles.contentContainer}
+				    dataSource={this.dataSource.cloneWithRows(list)}
+				    renderRow={this.renderRow}
+					renderHeader={this.renderHeader}
+                    enableEmptySections={true}
+                    initialListSize={list.length}
+                    scrollEnabled={false}
+                	scrollsToTop={false}
+			    />
+			</View>
+		);
+	}
+};
+
+let {width, height} = Dimensions.get('window');
+let itemWidth = width / 4;
+let spaceH = Math.ceil((30 / 640) * width);
+
+const styles = StyleSheet.create({
+	contentContainer: {
+		flexDirection: 'row',
+        flexWrap: 'wrap',
+		alignItems:'flex-start',
+	},
+	header: {
+
+	},
+	rowContainer: {
+        borderRightWidth: 0.5,
+        borderBottomWidth: 0.5,
+        borderColor: '#e5e5e5',
+	},
+	thumbnail: {
+        width: itemWidth-0.5,
+        height: itemWidth-0.5,
+    },
+    titleB: {
+		alignItems: 'center',
+		justifyContent: 'center',
+		height: 40,
+		width:width,
+        backgroundColor: 'white',
+    },
+	title: {
+		alignItems: 'center',
+		justifyContent: 'center',
+		height: 39,
+		width:width,
+        backgroundColor: 'transparent',
+    },
+	text: {
+		textAlign: 'center',
+		fontSize: 16,
+		fontWeight: 'bold',
+		color: '#444',
+    },
+});

+'use strict';
+
+import React from 'react';
+import ReactNative from 'react-native';
+import Immutable, {Map} from 'immutable';
+import YH_Image from '../../../common/components/YH_Image';
+import {getSlicedUrl} from '../../../classify/utils/Utils';
+
+const {
+    View,
+    Text,
+    TouchableOpacity,
+    Dimensions,
+    StyleSheet,
+	Platform,
+} = ReactNative;
+
+export default class OutletSingleImage 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 data = resource.get('data').toJS();
+
+		let newSrc = getSlicedUrl(data[0].src, width, backgroundHeight);
+
+		return (
+			<View style={styles.container}>
+				<TouchableOpacity
+					activeOpacity={1}
+					style={{width: width, height: backgroundHeight}}
+					onPress={() => {
+						this.props.onPressProduct && this.props.onPressProduct(data[0].url);
+					}}
+				>
+					<YH_Image
+						url={newSrc}
+						style={{ width: width, height: backgroundHeight}}
+					/>
+				</TouchableOpacity>
+				<View style={styles.space} />
+			</View>
+		);
+    }
+}
+
+let {width, height} = Dimensions.get('window');
+let backgroundWidth = width;
+let backgroundHeight = Math.ceil((210 / 640) * width);
+let spaceH = Math.ceil((30 / 640) * width);
+
+let styles = StyleSheet.create({
+	container: {
+		width: width,
+		height: backgroundHeight + spaceH,
+	},
+
+	space: {
+        width: width,
+        height: spaceH,
+        backgroundColor: 'white',
+    },
+});

+'use strict';
+
+import React from 'react';
+import ReactNative from 'react-native';
+import Swiper from 'react-native-swiper';
+import YH_Image from '../../../common/components/YH_Image';
+import {getSlicedUrl} from '../../../classify/utils/Utils';
+
+const {
+    View,
+    TouchableOpacity,
+    StyleSheet,
+    Dimensions,
+    Platform,
+} = ReactNative;
+
+import Immutable, {Map} from 'immutable';
+
+export default class OutletSwiper extends React.Component {
+
+    constructor(props) {
+        super (props);
+
+        this.dot = <View
+            style={{
+                backgroundColor:'rgba(0,0,0,.2)',
+                width: 6,
+                height: 6,
+                borderRadius: 3,
+                marginLeft: 3,
+                marginRight: 3,
+                marginTop: (Platform.OS === 'ios')?3:1,
+                marginBottom: 0,
+            }}
+        />;
+        this.activeDot = <View
+            style={{
+                backgroundColor:'white',
+                width: 6,
+                height: 6,
+                borderRadius: 3,
+                marginLeft: 3,
+                marginRight: 3,
+                marginTop: 3,
+                marginBottom: 0,
+            }}
+        />;
+    }
+
+    shouldComponentUpdate(nextProps){
+        if (Immutable.is(nextProps.resource, this.props.resource)) {
+            return false;
+        } else {
+            return true;
+        }
+    }
+
+    render() {
+
+        let {resource} = this.props;
+        if (!resource) {
+			return null;
+		}
+
+        let data = resource.get('data').toJS();
+
+        if (data.length == 1) {
+			let newSrc = getSlicedUrl(data[0].src, width, swiperHeight);
+            return (
+				<View style={styles.container}>
+	                <TouchableOpacity
+	                    activeOpacity={1}
+	                    style={{width: width, height: swiperHeight}}
+	                    onPress={() => {
+	                        this.props.onPressProduct && this.props.onPressProduct(data[0].url);
+	                    }}
+	                >
+	                    <YH_Image
+	                        url={newSrc}
+	                        style={{ width: width, height: swiperHeight}}
+	                    />
+	                </TouchableOpacity>
+					<View style={styles.space} />
+				</View>
+            );
+        } else {
+            return (
+				<View style={styles.container}>
+	                <Swiper
+	                    style={styles.banner}
+	                    showsButtons={false}
+	                    loop={true}
+	                    autoplay={true}
+	                    autoplayTimeout={2}
+	                    paginationStyle={{bottom: 8}}
+	                    dot={this.dot}
+	                    activeDot={(Platform.OS === 'ios')?this.activeDot:null}
+	                    width={width}
+	                    height={swiperHeight}
+	                >
+	                    {data.map((item, i) => {
+							let newSrc = getSlicedUrl(item.src, width, swiperHeight);
+	                        return (
+	                            <TouchableOpacity
+	                                key={i}
+	                                activeOpacity={1}
+	                                onPress={() => {
+	 		                            this.props.onPressProduct && this.props.onPressProduct(item.url);
+	                                }}
+	                            >
+	                                <YH_Image
+	                                    url={newSrc}
+	                                    style={{width: width, height: swiperHeight}}
+	                                />
+	                            </TouchableOpacity>
+	                        );
+	                    })}
+	                </Swiper>
+					<View style={styles.space} />
+				</View>
+            );
+        }
+    }
+}
+
+let {width, height} = Dimensions.get('window');
+let swiperHeight = Math.ceil((310 / 640) * width);
+let spaceH = Math.ceil((30 / 640) * width);
+
+let styles = StyleSheet.create({
+	container: {
+		width: width,
+		height: swiperHeight + spaceH,
+		backgroundColor: 'white',
+	},
+
+	space: {
+        width: width,
+        height: spaceH,
+        backgroundColor: 'white',
+    },
+
+});

+import React, {Component } from 'react'
+import {View, StyleSheet, Text, Dimensions,TouchableOpacity} from 'react-native';
+import Immutable, {Map} from 'immutable';
+import YH_Image from '../../../common/components/YH_Image';
+import {getSlicedUrl} from '../../../classify/utils/Utils';
+
+export default class OutletThreeImage extends Component{
+	  constructor(props) {
+	    super(props);
+	  }
+
+	  shouldComponentUpdate(nextProps){
+	      if (Immutable.is(nextProps.resource, this.props.resource)) {
+	          return false;
+	      } else {
+	          return true;
+	      }
+	  }
+
+	  render() {
+
+		let {resource} = this.props;
+	  	if (!resource) {
+	  		return null;
+	  	}
+
+	  	let data = resource.get('data').toJS();
+
+	    let src1 = getSlicedUrl(data.left[0].src, width, backgroundHeight);
+	    let url1 = data.left[0].url;
+
+	    let src2 = getSlicedUrl(data.right[0].src, width, backgroundHeight);
+	    let url2 = data.right[0].url;
+
+	    let src3 = getSlicedUrl(data.right[1].src, width, backgroundHeight);
+	    let url3 = data.right[1].url;
+
+
+        return (
+            <View style={styles.container}>
+				<View style={styles.leftView}>
+					<TouchableOpacity onPress={() => {this.props.onPressProduct && this.props.onPressProduct(url1)}} >
+						<View style={styles.leftImage}>
+							<YH_Image url={src1} style={styles.leftImage}></YH_Image>
+						</View>
+					</TouchableOpacity>
+				</View>
+				<View style={styles.rightView}>
+					<TouchableOpacity onPress={() => {this.props.onPressProduct && this.props.onPressProduct(url2)}} >
+						<YH_Image url={src2} style={styles.rightImage1}></YH_Image>
+					</TouchableOpacity>
+					<TouchableOpacity onPress={() => {this.props.onPressProduct && this.props.onPressProduct(url3)}} >
+						<YH_Image url={src3} style={styles.rightImage2}></YH_Image>
+					</TouchableOpacity>
+				</View>
+            </View>
+        )
+	}
+}
+
+let {width, height} = Dimensions.get('window');
+let backgroundHeight = Math.ceil((297 / 640) * width);
+let spaceH = Math.ceil((30 / 640) * width);
+let imageWidth = Math.ceil((275 / 640) * width);
+let rightImageWidth = Math.ceil((134 / 640) * width);
+
+let styles = StyleSheet.create({
+    container: {
+        width: width,
+		height: backgroundHeight + spaceH,
+        flexDirection: 'row',
+    },
+	leftView: {
+		width: imageWidth,
+		height: backgroundHeight,
+		marginLeft: spaceH,
+		backgroundColor: 'white',
+	},
+	leftImage: {
+		width: imageWidth,
+		height: backgroundHeight,
+	},
+	rightView: {
+		width: imageWidth,
+		height: backgroundHeight,
+		marginLeft: spaceH,
+		backgroundColor: 'white',
+	},
+	rightImage1: {
+		width: imageWidth,
+		height: rightImageWidth,
+	},
+	rightImage2: {
+		width: imageWidth,
+		height: rightImageWidth,
+		marginTop: spaceH-1,
+	},
+});

+'use strict';
+
+import React from 'react';
+import ReactNative from 'react-native';
+import Immutable, {Map} from 'immutable';
+
+const {
+    View,
+    Text,
+    ListView,
+    TouchableOpacity,
+    Dimensions,
+    StyleSheet,
+} = ReactNative;
+
+
+export default class ProductFliter extends React.Component {
+
+    constructor(props) {
+        super (props);
+
+        this._renderRow = this._renderRow.bind(this);
+        this._renderSeparator = this._renderSeparator.bind(this);
+
+        this.dataSource = new ListView.DataSource({
+            rowHasChanged: (r1, r2) => r1.key != r2.key,
+        });
+		this.state = {
+            selectedIndex: 0,
+        };
+    }
+
+    _renderRow(rowData, sectionID, rowID) {
+
+        let colorStyle = rowID == this.state.selectedIndex ? {color: '#444444'} : {color: '#b0b0b0'};
+
+        return (
+            <TouchableOpacity
+                activeOpacity={1}
+                onPress={() => {
+
+					if (this.state.selectedIndex == rowID) {
+	                    return;
+	                }
+
+					this.setState({
+						selectedIndex: rowID,
+					});
+                	this.props.onPressFilter && this.props.onPressFilter(rowID);
+            	}}>
+                <View key={'row' + rowID} style={styles.rowContainer}>
+                    <Text style={[styles.name, colorStyle]}>{rowData.categoryName}</Text>
+                </View>
+            </TouchableOpacity>
+        );
+    }
+
+    _renderSeparator(sectionID, rowID, adjacentRowHighlighted) {
+        return (
+            <View key={'sep' + rowID} style={styles.separator}>
+            </View>
+        );
+    }
+
+    render() {
+
+        let {resource} = this.props;
+        let res = resource?resource.toJS():null;
+
+		if (!res) {
+			return null;
+		}
+
+        return (
+            <View style={styles.container}>
+                <ListView
+                    contentContainerStyle={styles.contentContainer}
+                    enableEmptySections={true}
+                    dataSource={this.dataSource.cloneWithRows(res)}
+                    renderRow={this._renderRow}
+                    renderSeparator={this._renderSeparator}
+                    scrollsToTop={false}
+					horizontal={true}
+					showsHorizontalScrollIndicator ={false}
+                />
+            </View>
+        );
+    }
+}
+
+let {width, height} = Dimensions.get('window');
+
+let styles = StyleSheet.create({
+    container: {
+        marginLeft: -1,
+        width: width + 2,
+        height: 37,
+        borderTopColor: 'transparent',
+        borderBottomColor: '#e5e5e5',
+        borderWidth: 0.5,
+		backgroundColor:'white',
+    },
+    contentContainer: {
+        flexDirection: 'row',
+    },
+    rowContainer: {
+        flexDirection: 'row',
+        justifyContent: 'center',
+        alignItems: 'center',
+        width: Math.ceil(width / 5),
+        height: 37,
+		backgroundColor:'white',
+    },
+    name: {
+        color: '#b0b0b0',
+    },
+    separator: {
+        width: 0.5,
+        top: 37 / 4,
+        height: 37 / 2,
+        backgroundColor: '#e5e5e5',
+    },
+});

@@ -41,6 +41,8 @@ class OutletContainer extends Component {
     constructor(props) {
         super(props);
         this._getOutletHomeResource = this._getOutletHomeResource.bind(this);
+        this._onPressProduct = this._onPressProduct.bind(this);
+        this._onPressFilter = this._onPressFilter.bind(this);
     }
 
     componentDidMount() {
@@ -55,6 +57,15 @@ class OutletContainer extends Component {
         this.props.actions.getOutletHomeResource(content_code);
     }
 
+    _onPressProduct(url){
+        console.log('_onPressProduct = '+url);
+    }
+
+    _onPressFilter(value){
+        console.log(value);
+        // this.props.actions.onPressFilter(value);
+    }
+
     render() {
 
         let {
@@ -65,6 +76,8 @@ class OutletContainer extends Component {
             <Outlet
                 categoryList = {categoryList}
                 getOutletHomeResource = {this._getOutletHomeResource}
+                onPressProduct = {this._onPressProduct}
+                onPressFilter = {this._onPressFilter}
             />
         );
     }

@@ -46,7 +46,7 @@ export default function outletReducer(state=initialState, action) {
 		}
 		case GET_OUTLETHOMERESOURCE_SUCCESS: {
 			let categoryList = state.categoryList.toJS();
-			let content_code1 = action.payload.content_code
+			let content_code1 = action.payload.content_code;
 		    categoryList.list.map((item, i) => {
 			   	 let content_code0 = item.content_code;
 			   	 if (content_code1 == content_code0) {