|
...
|
...
|
@@ -3,9 +3,7 @@ |
|
|
|
import React, {Component} from 'react';
|
|
|
|
import Immutable, {Map} from 'immutable';
|
|
|
|
import LoadingIndicator from '../../../common/components/LoadingIndicator';
|
|
|
|
import GoodGoodsImagesView from './GoodGoodsImagesView'
|
|
|
|
import ContentCell from './ContentCell'
|
|
|
|
import BrandProductListCell from '../../../common/components/ListCell/ProductListCell';
|
|
|
|
import Footer from './Footer'
|
|
|
|
|
|
|
|
import ReactNative, {
|
|
...
|
...
|
@@ -20,8 +18,6 @@ import ReactNative, { |
|
|
|
Platform,
|
|
|
|
} from 'react-native';
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
export default class Detail extends Component {
|
|
|
|
|
|
|
|
constructor(props) {
|
|
...
|
...
|
@@ -29,109 +25,44 @@ export default class Detail extends Component { |
|
|
|
this.renderRow = this.renderRow.bind(this);
|
|
|
|
this.dataSource = new ListView.DataSource({
|
|
|
|
rowHasChanged: (r1, r2) => !Immutable.is(r1, r2),
|
|
|
|
sectionHeaderHasChanged: (s1, s2) => !Immutable.is(s1, s2),
|
|
|
|
sectionHeaderHasChanged: (s1, s2) => !Immutable.is(s1, s2)
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
renderRow(rowData,sectionID,rowID,highlightRow) {
|
|
|
|
renderRow(rowData, sectionID, rowID, highlightRow) {
|
|
|
|
switch (sectionID) {
|
|
|
|
case 'images': {
|
|
|
|
let ary = [];
|
|
|
|
for (var i = 0; i < rowData.length; i++) {
|
|
|
|
let item = rowData[i];
|
|
|
|
let url = item.get('image_url');
|
|
|
|
let tempAry = url.split('?');
|
|
|
|
// url = url.replace('{width}', 420).replace('{height}', 562).replace('{mode}',2);
|
|
|
|
ary.push(tempAry[0]);
|
|
|
|
}
|
|
|
|
return (
|
|
|
|
<View style={{
|
|
|
|
width,
|
|
|
|
height: 300,
|
|
|
|
}}>
|
|
|
|
<GoodGoodsImagesView
|
|
|
|
style={{
|
|
|
|
width,
|
|
|
|
height: 300,
|
|
|
|
backgroundColor: '#f0f0f0'
|
|
|
|
}}
|
|
|
|
items={ary}
|
|
|
|
/>
|
|
|
|
<View style={styles.separator}/>
|
|
|
|
</View>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
break;
|
|
|
|
case 'content': {
|
|
|
|
return <ContentCell data={rowData}/>
|
|
|
|
}
|
|
|
|
break;
|
|
|
|
case 'similarTitle': {
|
|
|
|
return(
|
|
|
|
<View style={{width: width, height: 40, borderColor: '#ededed', borderBottomWidth: 1, backgroundColor: '#f0f0f0'}}>
|
|
|
|
<Text style={{flex: 1, textAlign: 'center', color:'#444444', fontSize: 16, paddingTop: 12}}>猜你喜欢</Text>
|
|
|
|
</View>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
break;
|
|
|
|
case 'similar': {
|
|
|
|
let paddingLeft = rowID % 2 == 1 ? rowMarginHorizontal / 2 : rowMarginHorizontal;
|
|
|
|
let customStyle = rowID == 0 || rowID == 1 ? {paddingLeft} : {paddingLeft};
|
|
|
|
return (
|
|
|
|
<BrandProductListCell
|
|
|
|
style={[styles.listContainer, customStyle]}
|
|
|
|
key={'row' + rowID}
|
|
|
|
rowID={rowID}
|
|
|
|
data={rowData}
|
|
|
|
onPressProduct={this.props.onPressProduct}
|
|
|
|
/>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
|
|
|
|
}
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
|
|
|
render() {
|
|
|
|
let {product_skn, favorite, product, similarList} = this.props.resource;
|
|
|
|
let isFetching = product.get('isFetching')||similarList.get('isFetching');
|
|
|
|
let images = product.getIn(['data','goods_list',0,'images_list']);
|
|
|
|
let similar = similarList&&similarList.get('data')&&similarList.get('data').toArray().length?similarList.get('data').toArray():[];
|
|
|
|
let {order_code, detail} = this.props.resource;
|
|
|
|
|
|
|
|
let isFetching = detail.get('isFetching');
|
|
|
|
|
|
|
|
let addressBlob = {
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
let dataSource = {
|
|
|
|
'images': images&&images.toArray().length?[images.toArray()]:[],
|
|
|
|
'content':product&&product.get('data')?[product.get('data')]:[],
|
|
|
|
'similarTitle':similar.length?[1]:[],
|
|
|
|
'similar':similar,
|
|
|
|
};
|
|
|
|
|
|
|
|
// //Test
|
|
|
|
// product_skn = '51148345';
|
|
|
|
// //
|
|
|
|
|
|
|
|
let buttonArray = detail.get('links')? detail.get('links').toJS() : [];
|
|
|
|
return (
|
|
|
|
<View style={styles.container}>
|
|
|
|
{!isFetching?
|
|
|
|
<View style={styles.container}>
|
|
|
|
<ListView
|
|
|
|
contentContainerStyle={styles.contentContainer}
|
|
|
|
enableEmptySections={true}
|
|
|
|
showsVerticalScrollIndicator={false}
|
|
|
|
dataSource={this.dataSource.cloneWithRowsAndSections(dataSource)}
|
|
|
|
renderRow={this.renderRow}
|
|
|
|
/>
|
|
|
|
<Footer
|
|
|
|
favorite={favorite}
|
|
|
|
onPressFavorite={this.props.onPressFavorite}
|
|
|
|
onPressProduct={this.props.onPressProduct}
|
|
|
|
product_skn={product_skn}
|
|
|
|
/>
|
|
|
|
</View>
|
|
|
|
:<LoadingIndicator
|
|
|
|
isVisible={isFetching}
|
|
|
|
/>}
|
|
|
|
{!isFetching
|
|
|
|
? <View style={styles.container}>
|
|
|
|
<ListView
|
|
|
|
contentContainerStyle={styles.contentContainer}
|
|
|
|
enableEmptySections={true}
|
|
|
|
showsVerticalScrollIndicator={false}
|
|
|
|
dataSource={this.dataSource.cloneWithRowsAndSections(dataSource)}
|
|
|
|
renderRow={this.renderRow}
|
|
|
|
/>
|
|
|
|
{buttonArray.length?<Footer resource={buttonArray}/>: null}
|
|
|
|
</View>
|
|
|
|
: <LoadingIndicator isVisible={isFetching}/>}
|
|
|
|
</View>
|
|
|
|
);
|
|
|
|
}
|
|
...
|
...
|
@@ -139,23 +70,17 @@ export default class Detail extends Component { |
|
|
|
|
|
|
|
let {width, height} = Dimensions.get('window');
|
|
|
|
|
|
|
|
let rowWidth = Math.ceil(137.5 * width / 320);
|
|
|
|
let rowHeight = Math.ceil(254 * width / 320);
|
|
|
|
let rowMarginTop = Math.ceil(10 * width / 320);
|
|
|
|
let rowMarginHorizontal = (width - rowWidth * 2) / 3;
|
|
|
|
|
|
|
|
let styles = StyleSheet.create({
|
|
|
|
container: {
|
|
|
|
flex: 1,
|
|
|
|
width: width,
|
|
|
|
width: width
|
|
|
|
},
|
|
|
|
contentContainer:{
|
|
|
|
contentContainer: {
|
|
|
|
backgroundColor: 'white',
|
|
|
|
flexDirection: 'row',
|
|
|
|
flexDirection: 'row',
|
|
|
|
flexWrap: 'wrap'
|
|
|
|
|
|
|
|
},
|
|
|
|
listContainer: {
|
|
|
|
width: width / 2,
|
|
|
|
},
|
|
|
|
width: width / 2
|
|
|
|
}
|
|
|
|
}); |
...
|
...
|
|
