红人店铺不展示默认和人气切换，review by Redding

+ 'use strict';
+
+import React from 'react';
+import ReactNative from 'react-native';
+
+const {
+    View,
+    Image,
+    Text,
+    ListView,
+    TouchableOpacity,
+    Dimensions,
+    StyleSheet,
+} = ReactNative;
+
+
+export default class BrandProductFilter extends React.Component {
+
+    constructor(props) {
+        super (props);
+
+        this._renderRow = this._renderRow.bind(this);
+        this._renderSeparator = this._renderSeparator.bind(this);
+        this._renderImage = this._renderImage.bind(this);
+
+        this.dataSource = new ListView.DataSource({
+            rowHasChanged: (r1, r2) => r1.key != r2.key,
+        });
+
+        this.state = {
+            filters: [
+                {
+                    key: 'default',
+                    name: '默认',
+                    value: {
+                        normal: '',
+                        popular: 'h_v_desc',
+                    },
+                    isPopular: false,
+                    radio: true,
+                },
+                {
+                    key: 'new',
+                    name: '新品',
+                    value: {
+                        asc: 's_t_desc',
+                        desc: 's_t_desc',
+                    },
+                    isAsc: false,
+                    radio: false,
+                },
+                {
+                    key: 'price',
+                    name: '价格',
+                    value: {
+                        asc: 's_p_asc',
+                        desc: 's_p_desc',
+                    },
+                    isAsc: false,
+                    radio: false,
+                },
+                {
+                    key: 'discount',
+                    name: '折扣',
+                    value: {
+                        asc: 'p_d_asc',
+                        desc: 'p_d_desc',
+                    },
+                    isAsc: false,
+                    radio: false,
+                },
+                {
+                    key: 'filter',
+                    name: '筛选',
+                    value: {
+                        asc: 'filter',
+                        desc: 'filter',
+                    },
+                    isAsc: false,
+                    radio: false,
+                },
+            ],
+            selectedIndex: 0,
+        };
+
+
+        this.images = {
+            normal: require('../../../brandStore/image/filter/shared_segmentedcontrol_other_normal.png'),
+            asc: require('../../../brandStore/image/filter/shared_segmentedcontrol_other_up.png'),
+            desc: require('../../../brandStore/image/filter/shared_segmentedcontrol_other_down.png'),
+            down:require('../../../brandStore/image/filter/brandstore_filter_arrow_down.png'),
+            down_normal:require('../../../brandStore/image/filter/brandstore_filter_arrow_down_normal.png'),
+            up:require('../../../brandStore/image/filter/brandstore_filter_arrow_up.png'),
+            up_normal:require('../../../brandStore/image/filter/brandstore_filter_arrow_up_normal.png'),
+            default_normal:require('../../../brandStore/image/filter/3_down_h.png'),
+            default_selected:require('../../../brandStore/image/filter/3_down.png'),
+        };
+    }
+
+    componentWillReceiveProps(nextProps){
+        if(this.props.selectOrder=='' || this.props.selectOrder=='h_v_desc'){
+             this.setState({
+                    selectedIndex: 0,
+                });
+        }else if (this.props.selectOrder =='s_t_desc') {
+            this.setState({
+                   selectedIndex: 1,
+               });
+        }else if (this.props.selectOrder =='s_p_asc' || this.props.selectOrder =='s_p_desc') {
+            this.setState({
+                   selectedIndex: 2,
+               });
+        }else if (this.props.selectOrder =='p_d_asc' || this.props.selectOrder =='p_d_desc') {
+            this.setState({
+                   selectedIndex: 3,
+               });
+        }
+    }
+
+    componentDidMount() {
+        if(this.props.selectOrder=='' || this.props.selectOrder=='h_v_desc'){
+             this.setState({
+                    selectedIndex: 0,
+                });
+        }else if (this.props.selectOrder =='s_t_desc') {
+            this.setState({
+                   selectedIndex: 1,
+               });
+        }else if (this.props.selectOrder =='s_p_asc' || this.props.selectOrder =='s_p_desc') {
+            this.setState({
+                   selectedIndex: 2,
+               });
+        }else if (this.props.selectOrder =='p_d_asc' || this.props.selectOrder =='p_d_desc') {
+            this.setState({
+                   selectedIndex: 3,
+               });
+        }
+    }
+
+    _renderImage(rowData, rowID) {
+        let img;
+        if(rowID==0 || rowID==1){
+            return null;
+        }else if(rowID==4){
+            img = this.props.lastSelected ? this.images.up : this.images.down_normal;
+        }else{
+            if (rowID == this.state.selectedIndex){
+                if (rowData.value.asc == this.props.selectOrder) {
+                    img = this.images.asc;
+                }else if (rowData.value.desc == this.props.selectOrder) {
+                    img = this.images.desc;
+                }else {
+                    img = this.images.normal;
+                }
+            }else{
+                img = this.images.normal;
+            }
+        }
+        return <Image style={styles.image} source={img}/>;
+    }
+
+    _renderRow(rowData, sectionID, rowID) {
+        let colorStyle = rowID == this.state.selectedIndex ? {color: '#444444'} : {color: '#b0b0b0'};
+        if (rowID == 4) {
+            colorStyle = this.props.lastSelected ? {color: '#444444'} : {color: '#b0b0b0'};
+        }
+
+        if(rowID==0){
+            if (this.props.lastSelectedPopular) {
+                rowData.name='人气';
+            }else {
+                rowData.name='默认';
+            }
+        }
+        return (
+            <View style={{backgroundColor: 'white'}}>
+                <TouchableOpacity style={{backgroundColor: 'white', flex: 1}} onPress={() => {
+
+                    let filters = this.state.filters;
+                    let filter = this.state.filters[rowID];
+                    if (rowID == 1 &&  this.state.selectedIndex == 1) {
+                        return;
+                    }
+                    if (filter.radio) {
+                        if (this.state.selectedIndex > 0) {
+                            this.setState({
+                                selectedIndex: rowID,
+                            });
+                            let value = this.props.lastSelectedPopular ? filter.value['popular'] : filter.value['normal'];
+                            this.props.onPressFilter && this.props.onPressFilter(value);
+                        } else {
+                            this.props.onPressFilter && this.props.onPressFilter(filters[0].key);
+                        }
+
+                        return;
+                    }
+                    if (rowID == 4) {
+                        let value = 'filter';
+                        this.props.onPressFilter && this.props.onPressFilter(value);
+                        return;
+                    }
+                    if (filter.value.asc == this.props.selectOrder) {
+                        filter.isAsc = true;
+                    }else {
+                        filter.isAsc = false;
+                    }
+                    filter.isAsc = !filter.isAsc;
+                    filters[rowID] = filter;
+                    this.setState({
+                        selectedIndex: rowID,
+                        filters,
+                    });
+
+                    let value = filter.isAsc ? filter.value['asc'] : filter.value['desc'];
+                    this.props.onPressFilter && this.props.onPressFilter(value);
+                }}>
+                    <View key={'row' + rowID} style={styles.rowContainer}>
+                        <Text style={[styles.name, colorStyle]}>{rowData.name}</Text>
+                        {this._renderImage(rowData, rowID)}
+                    </View>
+                </TouchableOpacity>
+            </View>
+        );
+    }
+
+    _renderSeparator(sectionID, rowID, adjacentRowHighlighted) {
+        return (
+            <View key={'sep' + rowID} style={styles.separator}>
+            </View>
+        );
+    }
+
+    render() {
+
+        let {style} = this.props;
+        return (
+            <View style={[styles.container, style]}>
+                <ListView
+                    contentContainerStyle={[styles.contentContainer, style]}
+                    enableEmptySections={true}
+                    dataSource={this.dataSource.cloneWithRows(this.state.filters)}
+                    renderRow={this._renderRow}
+                    renderSeparator={this._renderSeparator}
+                    scrollEnabled={false}
+                    scrollsToTop={false}
+                />
+                <View style={{width: width,height: 0.5,backgroundColor: '#e5e5e5',}}/>
+            </View>
+
+        );
+    }
+}
+
+let selCol = '444444'
+let norCol = 'b0b0b0'
+
+let {width, height} = Dimensions.get('window');
+
+let styles = StyleSheet.create({
+    container: {
+        marginLeft: -1,
+        width: width + 2,
+        height: 40,
+        backgroundColor:'white',
+    },
+    contentContainer: {
+        flexDirection: 'row',
+        backgroundColor:'white',
+    },
+    rowContainer: {
+        flexDirection: 'row',
+        justifyContent: 'center',
+        alignItems: 'center',
+        width: Math.ceil(width / 5),
+        height: 40,
+        backgroundColor: 'white',
+    },
+    name: {
+        color: '#b0b0b0',
+    },
+    image: {
+        marginTop: 2,
+        marginLeft: 2,
+    },
+    separator: {
+        width: 0.5,
+        top: 12.5,
+        height: 15,
+        backgroundColor: '#e5e5e5',
+    },
+});

+'use strict';
+
+import React from 'react';
+import ReactNative from 'react-native';
+
+const {
+  AppRegistry,
+  StyleSheet,
+  Text,
+  View,
+  Image,
+  ListView,
+  Dimensions,
+  TouchableOpacity,
+} = ReactNative;
+
+import BrandProductFilter from './BrandProductFilter';
+import immutable from 'immutable';
+
+export default class ProductCategoryList extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.leftRenderRow = this.leftRenderRow.bind(this);
+        this.rightRenderRow = this.rightRenderRow.bind(this);
+        this._pressLeftRow = this._pressLeftRow.bind(this);
+        this._pressRightRow = this._pressRightRow.bind(this);
+
+        this.dataSourceL = new ListView.DataSource({rowHasChanged: (r1, r2) => !immutable.is(r1, r2)});
+        this.dataSourceR = new ListView.DataSource({rowHasChanged: (r1, r2) => !immutable.is(r1, r2)});
+    }
+
+    _pressLeftRow(rowData) {
+        this.refs.subCategoryList && this.refs.subCategoryList.scrollTo({x: 0, y: 0, animated: false});
+        this.props.onPressProductFilterLeftItem(rowData);
+    }
+
+    _pressRightRow(rowData) {
+        let items = this.props.categoryFilterList.toJS().filter((item) => {
+            return item.isSelect;
+        });
+
+        if (items.length > 0) {
+            this.props.onPressProductFilterRightItem(items[0], rowData);
+        }
+  	}
+
+    leftRenderRow(rowData, sectionID, rowID, highlightRow) {
+        let selectText = this.props.filterNameFactors.get(rowData.get('key'));
+        let arrow = rowData.get('isSelect') ? <Image style={styles.arrow} source={require('../../../brandStore/image/filter_category_select_icon.png')}/> : null;
+
+        return (
+            <TouchableOpacity onPress={() => this._pressLeftRow(rowData.toJS())}>
+                <View style={[styles.leftRow]} >
+
+                    <View style={styles.leftRowText} >
+                        <Text style={styles.title} numberOfLines={1}>
+                            {rowData.get('name')}:{"  " + selectText}
+                        </Text>
+                        {arrow}
+                    </View>
+                    <View style={[styles.underline]}></View>
+
+                </View>
+            </TouchableOpacity>
+        );
+    }
+
+    rightRenderRow(rowData, sectionID, rowID, highlightRow) {
+
+        let colorStyle = rowData.get('isSelect') ? {backgroundColor: '#DBDBDB'} : {backgroundColor: '#f4f4f4'};
+        return (
+            <TouchableOpacity onPress={() => this._pressRightRow(rowData.toJS())}>
+                <View style={[styles.rightRow, colorStyle]}>
+                    <Text style={styles.subtitle} numberOfLines={1}>
+                        {rowData.get('name')}
+                    </Text>
+                    <View style={[styles.underline]}></View>
+
+                </View>
+            </TouchableOpacity>
+        );
+    }
+
+    render() {
+        let {categoryFilterList, filterCategoryDetailFilterList, filterNameFactors} = this.props;
+        let subList = [];
+
+        let items = categoryFilterList.toJS().filter((item) => {
+            return item.isSelect;
+        });
+
+        if (items.length > 0) {
+            subList = filterCategoryDetailFilterList.get(items[0].key);
+        }
+
+        return (
+            <View style={styles.allcontainer}>
+                <BrandProductFilter
+                    onPressFilter={this.props.onPressFilter}
+                    lastSelected={this.props.productList.isFilter}
+                    moreFilter={this.props.productList.isMoreFilter}
+                    selectOrder={this.props.productList.order}
+                    lastSelectedPopular={this.props.lastSelectedPopular}/>
+
+                <View style={styles.container}>
+                    <ListView
+                        style={styles.leftContentContainer}
+                        dataSource={this.dataSourceL.cloneWithRows(categoryFilterList.toArray())}
+                        renderRow={this.leftRenderRow}
+                        scrollsToTop={false}
+                    />
+                    <ListView
+                        ref='subCategoryList'
+                        style={styles.rightContentContainer}
+                        dataSource={this.dataSourceR.cloneWithRows(subList.size?subList.toArray():[])}
+                        renderRow={this.rightRenderRow}
+                        scrollsToTop={false}
+                    />
+                </View>
+            </View>
+        );
+    }
+};
+
+let {width, height} = Dimensions.get('window');
+let rowHeight = Math.ceil(height - 37);
+let rowWidth = Math.ceil(width / 2);
+
+let styles = StyleSheet.create({
+    allcontainer:{
+        flex: 1,
+        flexDirection: 'column',
+        top: 0,
+        left: 0,
+        width: width,
+        height: height ,
+        backgroundColor: '#ffffff',
+        borderTopColor: '#e0e0e0',
+        borderTopWidth: 0.5,
+        borderLeftColor: '#ffffff',
+        borderLeftWidth: 0,
+        borderRightWidth: 0,
+        borderBottomWidth: 0,
+        position: 'absolute',
+
+    },
+    container:{
+        flex: 1,
+        flexDirection: 'row',
+        left: 0,
+        width: width,
+        height: height - 40 - 44 - 64,
+        backgroundColor: '#ffffff',
+        borderTopWidth: 0,
+        borderLeftWidth: 0,
+        borderRightWidth: 0,
+        borderBottomWidth: 0,
+    },
+    leftContentContainer: {
+        backgroundColor: '#ffffff',
+    },
+    leftRow: {
+        justifyContent: 'center',
+        height: 44,
+        width: rowWidth,
+        paddingLeft: 15,
+        backgroundColor: '#ffffff',
+    },
+    leftRowText: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        height: 43.5,
+        width: rowWidth,
+    },
+    rightContentContainer: {
+        backgroundColor: '#f4f4f4',
+    },
+    rightRow: {
+        flexDirection: 'column',
+        justifyContent: 'center',
+        height: 44,
+        width: rowWidth,
+        paddingLeft: 15,
+    },
+    underline:{
+        width: rowWidth,
+        height: 0.5,
+        backgroundColor:'#e0e0e0',
+        position: 'absolute',
+        bottom: 0,
+
+    },
+    title: {
+        fontSize: 14,
+        color: '#444444',
+        width: rowWidth - 15 - 6,
+    },
+    subtitle: {
+        fontSize: 14,
+        color: '#b0b0b0',
+    },
+    arrow: {
+        justifyContent: 'flex-end',
+        alignItems: 'center',
+        width: 6,
+        height: 12,
+    },
+});

@@ -21,12 +21,11 @@ import SingleImage from './SingleImage';
 import DoubleImage from './DoubleImage';
 import TripleImage from './TripleImage';
 import RedBrandSwiper from './RedBrandSwiper';
-import BrandProductMoreFilter from '../../../brandStore/components/brandStore/brandStoreSubView/Cells/BrandProductMoreFilter';
-import ProductCategoryList from '../../../brandStore/components/brandStore/brandStoreSubView/Cells/ProductCategoryList';
+import ProductCategoryList from './ProductCategoryList';
 import LoadingIndicator from '../../../common/components/LoadingIndicator';
 import LoadMoreIndicator from '../../../common/components/LoadMoreIndicator';
 import BrandProductListCell from '../../../common/components/ListCell/ProductListCell';
-import BrandProductFilter from '../../../brandStore/components/brandStore/brandStoreSubView/Cells/BrandProductFilter';
+import BrandProductFilter from './BrandProductFilter';
 import CouponCell from '../../../brandStore/components/brandStore/brandStoreSubView/Cells/CouponCell';
 import Prompt from '../../../coupon/components/coupon/Prompt';
 import FourImages from './FourImages';
@@ -255,14 +254,6 @@ export default class RedBrand extends Component {
                         onPressProductFilterRightItem={this.props.onPressProductFilterRightItem}
                         onPressCloseMoreFilter={this.props.onPressCloseMoreFilter}
                         onPressMoreFilter={this.props.onPressMoreFilter}/> : null}
-
-                {productList.isMoreFilter ?
-                    <BrandProductMoreFilter
-                        productList={productList}
-                        onPressCloseMoreFilter={this.props.onPressCloseMoreFilter}
-                        onPressMoreFilter={this.props.onPressMoreFilter}/> : null}
-
-
                 {needShowToast ? <Prompt
                     text={showToastMessage}
                     duration={1000}