Authored by 朱小军

活动模板标签页自定义为推荐、价格、折扣,修复传参问题 review by days

'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: 'new',
name: '推荐',
value: {
asc: 's_t_desc',
desc: 's_t_desc',
},
isAsc: false,
radio: true,
},
{
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,
},
],
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'),
};
}
componentWillReceiveProps(nextProps){
if(nextProps.selectOrder==''){
this.setState({
selectedIndex: 0,
});
}
}
_renderImage(rowData, rowID) {
let img;
if(rowID==0){
img = null;
}else if(rowID==3){
img = this.props.lastSelected ? this.images.up : this.images.down_normal;
}else{
if (rowID == this.state.selectedIndex){
img = rowData.isAsc ? this.images.asc : this.images.desc;
}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 == 3) {
colorStyle = this.props.lastSelected ? {color: '#444444'} : {color: '#b0b0b0'};
}
if(rowID==0){
}
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 == 3) {
let value = 'filter';
this.props.onPressFilter && this.props.onPressFilter(value);
return;
}
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 / 3),
height: 40,
backgroundColor: 'white',
},
name: {
color: '#b0b0b0',
},
image: {
marginTop: 2,
marginLeft: 2,
},
separator: {
width: 0.5,
top: 12.5,
height: 15,
backgroundColor: '#e5e5e5',
},
});
... ...
... ... @@ -18,6 +18,7 @@ import BrandProductFilter from '../cell/BrandProductFilter';
import BannerSwiper from '../cell/BannerSwiper';
import ActivityCell from '../../../outlet/components/outlet/ActivityCell';
import LatestHeader from '../cell/LatestHeader';
import ActivityHeader from '../cell/ActivityHeader';
export default class ProductListPool extends Component {
constructor(props) {
... ... @@ -33,6 +34,9 @@ export default class ProductListPool extends Component {
}
renderSectionHeader(sectionData, sectionID) {
let {
type,
} = this.props;
switch(sectionID) {
case 'productList': {
let noFilterValue = true;
... ... @@ -46,6 +50,16 @@ export default class ProductListPool extends Component {
return null;
}
if (type == 'YH_ActivityProListVC') {
return (
<View style={styles.brandFilterContainer} onLayout={(evt) => {yPosition = evt.nativeEvent.layout.y;}}>
<ActivityHeader
onPressFilter={this.props.onPressProductFilter}
selectOrder={this.props.productList.order}
/>
</View>
)
}
return (
<View style={styles.brandFilterContainer} onLayout={(evt) => {yPosition = evt.nativeEvent.layout.y;}}>
... ...
... ... @@ -195,7 +195,6 @@ export function getNewUserProductList(reload=false) {
let page = productList.currentPage + 1;
let pageSize = productList.pageSize;
let order = productList.order;
let params = {};
let bSelectedFilterFactor,allFilterFactors;
allFilterFactors = filterFactors.toJS();
... ... @@ -214,7 +213,7 @@ export function getNewUserProductList(reload=false) {
let getList = (uid) => {
dispatch(productListRequest());
return new ProductListPoolService(app.serviceHost).newUserProductList(uid, order, page, pageSize, originParams, allFilterFactors, params)
return new ProductListPoolService(app.serviceHost).newUserProductList(uid, order, page, pageSize, originParams, allFilterFactors)
.then(json => {
let payload = Utils.parseProductList(json);
payload.endReached = payload.currentPage == payload.pageCount;
... ... @@ -250,8 +249,8 @@ export function getActivityList(reload=false) {
return (dispatch, getState) => {
let {app, productListPool} = getState();
let {productList, filterFactors,activityInfo} = productListPool;
let {originParams,saleType,type} = app;
let {productList, filterFactors, activityInfo} = productListPool;
let {originParams, saleType, type} = app;
if (reload) {
... ... @@ -263,7 +262,6 @@ export function getActivityList(reload=false) {
let page = productList.currentPage + 1;
let pageSize = productList.pageSize;
let order = productList.order;
let params = {};
let bSelectedFilterFactor,allFilterFactors;
allFilterFactors = filterFactors.toJS();
... ... @@ -282,7 +280,7 @@ export function getActivityList(reload=false) {
let getList = (uid) => {
dispatch(productListRequest());
return new ProductListPoolService(app.serviceHost).getActivityList(uid,order,page, pageSize,originParams,allFilterFactors,params)
return new ProductListPoolService(app.serviceHost).getActivityList(uid,order,page, pageSize,originParams,allFilterFactors)
.then(json => {
let payload = Utils.parseProductList(json);
payload.endReached = payload.currentPage == payload.pageCount;
... ...
... ... @@ -34,7 +34,12 @@ export default class ProductListPoolService {
});
}
async getActivityList(uid,order,page=1, limit=60,originParams,filterFactors={},params,fromPage='iFP_Activity') {
async getActivityList(uid,order,page=1, limit=60,originParams,filterFactors={},fromPage='iFP_Activity') {
if (order.length > 0) {
originParams['order'] = order;
}else {
originParams['order'] = 's_t_desc';
}
return await this.api.get({
url: '/operations/api/v5/activitytemplate/getProduct',
body: {
... ... @@ -42,8 +47,6 @@ export default class ProductListPoolService {
uid,
page,
limit,
order,
...params,
...originParams,
...filterFactors,
}
... ... @@ -93,7 +96,7 @@ export default class ProductListPoolService {
});
}
async newUserProductList(uid,order,page=1, limit=60,originParams,filterFactors={},params, v=7) {
async newUserProductList(uid,order,page=1, limit=60,originParams,filterFactors={}, v=7) {
return await this.api.get({
url: '/operations/api/v5/activitytemplate/getProduct',
body: {
... ... @@ -101,7 +104,6 @@ export default class ProductListPoolService {
page,
limit,
order,
...params,
...originParams,
...filterFactors,
v,
... ...