mobile / YH_RNComponent · Commits

Go to a project

Authored by 孙凯
Commit 399102c03e611d7bc2e7cfaf350ba6ef5e2e8d84 1 parent 0cd42411

整理代码 review by 红魔

Inline Side-by-side
Showing 16 changed files with 328 additions and 913 deletions
'use strict'
import React, {Component} from 'react';
import {
StyleSheet,
Dimensions,
Platform,
View,
Text,
Alert,
Image,
ListView,
NativeModules,
InteractionManager,
NativeAppEventEmitter,
TouchableOpacity,
PixelRatio,
} from 'react-native'
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {Map} from 'immutable';
import * as brandStoreActions from '../../../reducers/brandStore/brandStoreActions';
import BrandStoreHeaderView from '../brandStoreSubView/SessionHeader/BrandStoreHeaderView';
import CouponCell from '../brandStoreSubView/Cells/CouponCell';
import BrandListCell from '../brandStoreSubView/Cells/BrandListCell';
import BrandSwiper from '../brandStoreSubView/Cells/BrandSwiper';
const actions = [
brandStoreActions,
];
function mapStateToProps(state) {
return {
...state
};
}
function mapDispatchToProps(dispatch) {
const creators = Map()
.merge(...actions)
.filter(value => typeof value === 'function')
.toObject();
return {
actions: bindActionCreators(creators, dispatch),
dispatch
};
}
class BradnStoreCenter extends Component {
constructor(props) {
super(props);
let getSectionData = (dataBlob, sectionID) => {
return dataBlob[sectionID];
};
let getRowData = (dataBlob, sectionID, rowID) => {
return dataBlob[sectionID + ':' + rowID];
};
this.state = {
dataSource: new ListView.DataSource({
getSectionData: getSectionData, // 获取组中数据
getRowData: getRowData, // 获取行中的数据
rowHasChanged: (r1, r2) => r1 != r2,
sectionHeaderHasChanged: (s1, s2) => s1 !== s2
})
};
this.loadDataFromJason();
this._onPressCollection = this._onPressCollection.bind(this);
this._onPressCoupon = this._onPressCoupon.bind(this);
this._onPressBrandItem= this._onPressBrandItem.bind(this);
this.onPressImage1 = this._onPressImage1.bind(this);
}
componentDidMount() {
}
componentWillUnmount() {
}
_onPressCollection(){
this.props.actions.onPressCollection();
}
_onPressCoupon(){
this.props.actions.onPressCoupon();
}
_onPressBrandItem(){
this.props.actions.onPressBrandItem();
}
_onPressImage1(){
}
loadDataFromJason() {
let jsonData = require('../../../image/Car.json');
let dataBlob = {},
sectionIDs = [],
rowIDs = [],
cars = [];
let datas = jsonData.data;
for (let i in datas) {
//step 1、把组数据放入sectionIDs数组中
sectionIDs.push(i);
//step 2、把组中内容放dataBlob对象中
dataBlob[i] = datas[i].title;
//step 3、取出该组中所有的车
cars = datas[i].cars;
//step 4记录每一行中的数据
rowIDs[i] = [];
//step 5、获取行中每一组数据
for (let j in cars) {
//把行号放入rowIDs中
rowIDs[i].push(j);
//把每一行中的内容放dataBlob对象中
dataBlob[i + ':' + j] = cars[j];
}
}
this.state = {
dataSource: this.state.dataSource.cloneWithRowsAndSections(dataBlob, sectionIDs, rowIDs)
};
}
render() {
return (
<ListView
dataSource={this.state.dataSource}
renderRow={this.renderRow.bind(this)}
renderSectionHeader={this.renderSectionHeader.bind(this)}
renderHeader = {this.renderHeader.bind(this)}
contentContainerStyle={styles.listViewStyle}//设置cell的样式
/>
);
}
// 每一行的数据
renderRow(rowData,sectionID,rowID,highlightRow) {
if (sectionID === '0') {
switch (rowID) {
case '0':
{
return (
<CouponCell
src={'aa'}
onPressCoupon={this._onPressCoupon}
/>
);
}
break;
case '1':
{
return (
<BrandListCell
src={'aa'}
onPressBrandItem={this._onPressBrandItem}
/>
);
}
break;
default:
{
return (
<BrandSwiper
src={'aa'}
// onPressBrandItem={this._onPressBrandItem}
/>
);
}
break;
}
}else {
return (
<TouchableOpacity activeOpacity={0.5}>
<View style={styles.row}>
<Text style={styles.text}>
{rowData.name}
</Text>
</View>
</TouchableOpacity>
);
}
}
// 每一组中的数据
renderSectionHeader(sectionData, sectionID) {
//根据数据显示不同的header
switch (sectionData) {
case 'A':
{
return (
<View style={styles.headerViewStyle}>
<Text style={{marginLeft: 5, color: 'white'}}>{sectionData}</Text>
</View>
);
}
break;
default:
{
return (
<View style={styles.headerViewStyle}>
<Text style={{marginLeft: 5, color: 'white'}}>{sectionData}</Text>
</View>
);
}
break;
}
}
renderHeader(){
return(
<BrandStoreHeaderView
src={'aa'}
onPressCollection={this._onPressCollection}
/>
);
}
}
let styles = StyleSheet.create({
container: {
flex: 1,
},
separator: {
height: 0.5,
backgroundColor: 'rgba(255,255,255,0.5)',
},
listViewStyle:{
justifyContent: 'space-around',
flexDirection: 'row',
flexWrap: 'wrap',
alignItems:'flex-start'
},
rowStyle: {
flexDirection: 'row',
alignItems: 'center',
padding: 10,
borderBottomColor: 'grey',
borderBottomWidth: 1 / PixelRatio.get()
},
headerViewStyle: {
height: 64,
backgroundColor: 'blue',
justifyContent: 'center',
alignItems: 'center',
width: Dimensions.get('window').width,
},
row: {
justifyContent: 'center',
padding: 5,
margin: 3,
width: 150,
height: 200,
backgroundColor: '#F6F6F6',
alignItems: 'center',
borderWidth: 1,
borderRadius: 5,
borderColor: '#CCC'
},
text: {
flex: 1,
marginTop: 5,
fontWeight: 'bold'
},
list: {
marginTop:5,
justifyContent: 'space-around',
flexDirection: 'row',
flexWrap: 'wrap'
},
});
export default connect(mapStateToProps, mapDispatchToProps)(BradnStoreCenter);
'use strict'
import React, {Component} from 'react';
import {
StyleSheet,
Dimensions,
Platform,
View,
Text,
Alert,
Image,
ListView,
NativeModules,
InteractionManager,
NativeAppEventEmitter,
TouchableOpacity,
PixelRatio,
} from 'react-native'
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {Map} from 'immutable';
import * as brandStoreActions from '../../../reducers/brandStore/brandStoreActions';
import BrandStoreHeaderView from '../brandStoreSubView/SessionHeader/BrandStoreHeaderView';
import CouponCell from '../brandStoreSubView/Cells/CouponCell';
import BrandListCell from '../brandStoreSubView/Cells/BrandListCell';
import BrandSwiper from '../brandStoreSubView/Cells/BrandSwiper';
const actions = [
brandStoreActions,
];
function mapStateToProps(state) {
return {
...state
};
}
function mapDispatchToProps(dispatch) {
const creators = Map()
.merge(...actions)
.filter(value => typeof value === 'function')
.toObject();
return {
actions: bindActionCreators(creators, dispatch),
dispatch
};
}
class BradnStoreCenter extends Component {
constructor(props) {
super(props);
let getSectionData = (dataBlob, sectionID) => {
return dataBlob[sectionID];
};
let getRowData = (dataBlob, sectionID, rowID) => {
return dataBlob[sectionID + ':' + rowID];
};
this.state = {
dataSource: new ListView.DataSource({
getSectionData: getSectionData, // 获取组中数据
getRowData: getRowData, // 获取行中的数据
rowHasChanged: (r1, r2) => r1 != r2,
sectionHeaderHasChanged: (s1, s2) => s1 !== s2
})
};
this.loadDataFromJason();
this._onPressCollection = this._onPressCollection.bind(this);
this._onPressCoupon = this._onPressCoupon.bind(this);
this._onPressBrandItem= this._onPressBrandItem.bind(this);
this.onPressImage1 = this._onPressImage1.bind(this);
}
componentDidMount() {
}
componentWillUnmount() {
}
_onPressCollection(){
this.props.actions.onPressCollection();
}
_onPressCoupon(){
this.props.actions.onPressCoupon();
}
_onPressBrandItem(){
this.props.actions.onPressBrandItem();
}
_onPressImage1(){
}
loadDataFromJason() {
let jsonData = require('../../../image/Car.json');
let dataBlob = {},
sectionIDs = [],
rowIDs = [],
cars = [];
let datas = jsonData.data;
for (let i in datas) {
//step 1、把组数据放入sectionIDs数组中
sectionIDs.push(i);
//step 2、把组中内容放dataBlob对象中
dataBlob[i] = datas[i].title;
//step 3、取出该组中所有的车
cars = datas[i].cars;
//step 4记录每一行中的数据
rowIDs[i] = [];
//step 5、获取行中每一组数据
for (let j in cars) {
//把行号放入rowIDs中
rowIDs[i].push(j);
//把每一行中的内容放dataBlob对象中
dataBlob[i + ':' + j] = cars[j];
}
}
this.state = {
dataSource: this.state.dataSource.cloneWithRowsAndSections(dataBlob, sectionIDs, rowIDs)
};
}
render() {
return (
<ListView
dataSource={this.state.dataSource}
renderRow={this.renderRow.bind(this)}
renderSectionHeader={this.renderSectionHeader.bind(this)}
renderHeader = {this.renderHeader.bind(this)}
contentContainerStyle={styles.listViewStyle}//设置cell的样式
/>
);
}
// 每一行的数据
renderRow(rowData,sectionID,rowID,highlightRow) {
if (sectionID === '0') {
switch (rowID) {
case '0':
{
return (
<CouponCell
src={'aa'}
onPressCoupon={this._onPressCoupon}
/>
);
}
break;
case '1':
{
return (
<BrandListCell
src={'aa'}
onPressBrandItem={this._onPressBrandItem}
/>
);
}
break;
default:
{
return (
<BrandSwiper
src={'aa'}
// onPressBrandItem={this._onPressBrandItem}
/>
);
}
break;
}
}else {
return (
<TouchableOpacity activeOpacity={0.5}>
<View style={styles.row}>
<Text style={styles.text}>
{rowData.name}
</Text>
</View>
</TouchableOpacity>
);
}
}
// 每一组中的数据
renderSectionHeader(sectionData, sectionID) {
//根据数据显示不同的header
switch (sectionData) {
case 'A':
{
return (
<View style={styles.headerViewStyle}>
<Text style={{marginLeft: 5, color: 'white'}}>{sectionData}</Text>
</View>
);
}
break;
default:
{
return (
<View style={styles.headerViewStyle}>
<Text style={{marginLeft: 5, color: 'white'}}>{sectionData}</Text>
</View>
);
}
break;
}
}
renderHeader(){
return(
<BrandStoreHeaderView
src={'aa'}
onPressCollection={this._onPressCollection}
/>
);
}
}
let styles = StyleSheet.create({
container: {
flex: 1,
},
separator: {
height: 0.5,
backgroundColor: 'rgba(255,255,255,0.5)',
},
listViewStyle:{
justifyContent: 'space-around',
flexDirection: 'row',
flexWrap: 'wrap',
alignItems:'flex-start'
},
rowStyle: {
flexDirection: 'row',
alignItems: 'center',
padding: 10,
borderBottomColor: 'grey',
borderBottomWidth: 1 / PixelRatio.get()
},
headerViewStyle: {
height: 64,
backgroundColor: 'blue',
justifyContent: 'center',
alignItems: 'center',
width: Dimensions.get('window').width,
},
row: {
justifyContent: 'center',
padding: 5,
margin: 3,
width: 150,
height: 200,
backgroundColor: '#F6F6F6',
alignItems: 'center',
borderWidth: 1,
borderRadius: 5,
borderColor: '#CCC'
},
text: {
flex: 1,
marginTop: 5,
fontWeight: 'bold'
},
list: {
marginTop:5,
justifyContent: 'space-around',
flexDirection: 'row',
flexWrap: 'wrap'
},
});
export default connect(mapStateToProps, mapDispatchToProps)(BradnStoreCenter);
'use strict';
import React from 'react';
import ReactNative from 'react-native';
const {
AppRegistry,
StyleSheet,
Text,
View,
Image,
ListView,
Dimensions,
TouchableOpacity,
} = ReactNative;
export default class BrandListCell extends React.Component {
constructor(props) {
super(props);
let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
this.state = {
dataSource: ds.cloneWithRows(['row 1', 'row 2' ,'row 3' ,'row 4', 'row 5']),
touchBrandItem : false,
};
}
render() {
return (
<View style={styles.cellList}>
<Text style={styles.titleStyle}>
品牌一览
</Text>
<ListView
showsHorizontalScrollIndicator ={false}
dataSource={this.state.dataSource}
horizontal={true}
renderRow={this.renderRow.bind(this)}
/>
</View>
);
}
renderRow(rowData,sectionID,rowID,highlightRow) {
return (
<TouchableOpacity activeOpacity={0.5} onPress={this.props.onPressBrandItem}>
<View style={styles.row}>
<Image
source={require('../../../../image/2.png')}
style={{ width: 100, height: 120}}
resizeMode={'cover'}
></Image>
<Text style={styles.text}>
{rowData}
</Text>
</View>
</TouchableOpacity>
);
}
};
let styles = StyleSheet.create({
cellList:{
justifyContent: 'center',
width: Dimensions.get('window').width,
height: 200,
},
titleStyle:{
marginTop:8,
alignItems: 'center',
textAlign:'center',
fontWeight: 'bold',
fontSize:28,
width: Dimensions.get('window').width,
height: 30,
},
row: {
justifyContent: 'center',
margin: 3,
width: 100,
height: 140,
backgroundColor: 'white',
alignItems: 'center',
},
text: {
flex: 1,
justifyContent: 'center',
fontWeight: 'bold',
},
});
'use strict';
import React from 'react';
import ReactNative from 'react-native';
import Swiper from 'react-native-swiper';
import ImmutablePropTypes from 'react-immutable-proptypes';
const {
View,
Image,
TouchableOpacity,
StyleSheet,
Dimensions,
} = ReactNative;
export default class BrandSwiper extends React.Component {
constructor(props) {
super (props);
this.state = {
data:['1', '2' ,'3' ,'4', '5'],
duration: 1,
width: Dimensions.get('window').width,
height: 200,
// onPress: React.PropTypes.func,
};
this.dot = <View
style={{
backgroundColor:'rgba(0,0,0,.2)',
width: 6,
height: 6,
borderRadius: 3,
marginLeft: 3,
marginRight: 3,
marginTop: 3,
marginBottom: 23,
}}
/>;
this.activeDot = <View
style={{
backgroundColor:'white',
width: 6,
height: 6,
borderRadius: 3,
marginLeft: 3,
marginRight: 3,
marginTop: 3,
marginBottom: 23,
}}
/>;
}
render() {
let width = this.state.width;
let height = this.state.height;
let data = this.state.data;
if (data.length == 1) {
// let item = data[0];
return (
<TouchableOpacity
activeOpacity={1}
onPress={() => {
}}
>
<Image
source={require('../../../../image/1.png')}
style={{ width: width, height: height}}
resizeMode={'cover'}
></Image>
</TouchableOpacity>
);
} else {
return (
<Swiper
style={styles.banner}
showsButtons={false}
loop={true}
autoplay={true}
autoplayTimeout={this.state.duration}
paginationStyle={{bottom: 8}}
dot={this.dot}
activeDot={this.activeDot}
height={height}
>
{data.map((item, i) => {
return (
<TouchableOpacity
key={i}
activeOpacity={1}
onPress={() => {
}}
>
<Image
source={require('../../../../image/1.png')}
style={{ width: width, height: height - 20}}
resizeMode={'cover'}
></Image>
</TouchableOpacity>
);
})}
</Swiper>
);
}
}
}
let styles = StyleSheet.create({
banner: {
},
});
'use strict';
import React from 'react';
import ReactNative from 'react-native';
const {
AppRegistry,
StyleSheet,
Text,
View,
Image,
ListView,
Dimensions,
TouchableOpacity,
} = ReactNative;
export default class CouponCell extends React.Component {
constructor(props) {
super(props);
let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
this.state = {
dataSource: ds.cloneWithRows(['row 1', 'row 2' ,'row 3' ,'row 4', 'row 5']),
hasBuy : false,
};
}
render() {
return (
<View style={styles.viewStyle}>
<ListView
showsHorizontalScrollIndicator ={false}
dataSource={this.state.dataSource}
horizontal={true}
renderRow={this.renderRow.bind(this)}
/>
</View>
);
}
renderRow(rowData,sectionID,rowID,highlightRow) {
return (
<TouchableOpacity activeOpacity={0.5} onPress={this.props.onPressCoupon}>
<View style={styles.row}>
<Image
source={require('../../../../image/3.png')}
style={{ width: 140, height: 60}}
resizeMode={'cover'}
></Image>
</View>
</TouchableOpacity>
);
}
};
let styles = StyleSheet.create({
viewStyle:{
justifyContent: 'center',
width: Dimensions.get('window').width,
height:80,
backgroundColor:'#f0f0f0',
},
row: {
marginTop:8,
justifyContent: 'center',
padding: 5,
margin: 5,
width: 140,
height: 60,
backgroundColor: '#F6F6F6',
alignItems: 'center',
borderWidth: 1,
borderRadius: 5,
borderColor: '#CCC'
},
text: {
flex: 1,
justifyContent: 'center',
fontWeight: 'bold',
},
});
'use strict';
import React from 'react';
import ReactNative from 'react-native';
const {
Image,
StyleSheet,
Dimensions,
TouchableOpacity,
} = ReactNative;
export default class BrandStoreHeaderView extends React.Component {
constructor(props) {
super (props);
this.state = {
backgroundWidth: Dimensions.get('window').width,
backgroundHeight: Math.ceil((310 / 640) * Dimensions.get('window').width),
buttonWidth: 60,
buttonHeight: 30,
isCollection: true,
}
}
componentDidMount() {
}
render() {
return (
<Image
source={require('../../../../image/4.png')}
// source={{uri: this.props.src}}
style={{width: this.state.backgroundWidth, height: this.state.backgroundHeight }}
resizeMode={'cover'}>
<TouchableOpacity onPress={this.props.onPressCollection} >
<Image
source={require('../../../../image/5.png')}
style={{ width: this.state.buttonWidth, height: this.state.buttonHeight,position:'absolute',bottom:-this.state.backgroundHeight + 30,right:30}}
resizeMode={'cover'}
></Image>
</TouchableOpacity>
</Image>
);
}
};
const styles = StyleSheet.create({
thumbnail: {
width: 320,
height: 120,
},
});
... ... @@ -10,4 +10,7 @@ export default keyMirror({
SHOP_INTRO_SUCCESS: null,
SHOP_INTRO_REQUEST: null,
SHOP_INTRO_FAILURE: null,
SHOP_RESOURCE_REQUEST: null,
SHOP_RESOURCE_SUCCESS: null,
SHOP_RESOURCE_FAILURE: null,
});
... ...
... ... @@ -6,16 +6,25 @@ import {
Dimensions,
Platform,
View,
Text,
Alert,
Image,
ListView,
NativeModules,
InteractionManager,
NativeAppEventEmitter,
TouchableOpacity,
PixelRatio,
} from 'react-native'
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {Map} from 'immutable';
import * as brandStoreActions from '../reducers/brandStore/brandStoreActions';
import BrandStoreCenter from '../components/common/brandStoreHome/BrandStoreCenter';
import BrandStoreHeaderView from '../components/brandStore/brandStoreSubView/SessionHeader/BrandStoreHeaderView';
import CouponCell from '../components/brandStore/brandStoreSubView/Cells/CouponCell';
import BrandListCell from '../components/brandStore/brandStoreSubView/Cells/BrandListCell';
import BrandSwiper from '../components/brandStore/brandStoreSubView/Cells/BrandSwiper';
const actions = [
brandStoreActions,
... ... @@ -43,23 +52,175 @@ function mapDispatchToProps(dispatch) {
class BrandStoreContainer extends Component {
constructor(props) {
super(props);
let getSectionData = (dataBlob, sectionID) => {
return dataBlob[sectionID];
};
let getRowData = (dataBlob, sectionID, rowID) => {
return dataBlob[sectionID + ':' + rowID];
};
this.state = {
dataSource: new ListView.DataSource({
getSectionData: getSectionData, // 获取组中数据
getRowData: getRowData, // 获取行中的数据
rowHasChanged: (r1, r2) => r1 != r2,
sectionHeaderHasChanged: (s1, s2) => s1 !== s2
})
};
this.loadDataFromJason();
this._onPressCollection = this._onPressCollection.bind(this);
this._onPressCoupon = this._onPressCoupon.bind(this);
this._onPressBrandItem= this._onPressBrandItem.bind(this);
this.onPressImage1 = this._onPressImage1.bind(this);
}
componentDidMount() {
this.props.actions.getShopsIntro();
// this.props.actions.getShopsIntro();
}
componentWillUnmount() {
}
_onPressCollection(){
this.props.actions.onPressCollection();
}
_onPressCoupon(){
this.props.actions.onPressCoupon();
}
_onPressBrandItem(){
this.props.actions.onPressBrandItem();
}
_onPressImage1(){
}
loadDataFromJason() {
let jsonData = require('../image/Car.json');
let dataBlob = {},
sectionIDs = [],
rowIDs = [],
cars = [];
let datas = jsonData.data;
for (let i in datas) {
//step 1、把组数据放入sectionIDs数组中
sectionIDs.push(i);
//step 2、把组中内容放dataBlob对象中
dataBlob[i] = datas[i].title;
//step 3、取出该组中所有的车
cars = datas[i].cars;
//step 4记录每一行中的数据
rowIDs[i] = [];
//step 5、获取行中每一组数据
for (let j in cars) {
//把行号放入rowIDs中
rowIDs[i].push(j);
//把每一行中的内容放dataBlob对象中
dataBlob[i + ':' + j] = cars[j];
}
}
this.state = {
dataSource: this.state.dataSource.cloneWithRowsAndSections(dataBlob, sectionIDs, rowIDs)
};
}
render() {
let {brandStore} = this.props;
let {shopId} = brandStore;
return (
<ListView
dataSource={this.state.dataSource}
renderRow={this.renderRow.bind(this)}
renderSectionHeader={this.renderSectionHeader.bind(this)}
renderHeader = {this.renderHeader.bind(this)}
contentContainerStyle={styles.listViewStyle}//设置cell的样式
/>
);
}
// 每一行的数据
renderRow(rowData,sectionID,rowID,highlightRow) {
if (sectionID === '0') {
switch (rowID) {
case '0':
{
return (
<CouponCell
src={'aa'}
onPressCoupon={this._onPressCoupon}
/>
);
}
break;
case '1':
{
return (
<BrandListCell
src={'aa'}
onPressBrandItem={this._onPressBrandItem}
/>
);
}
break;
default:
{
return (
<BrandSwiper
src={'aa'}
// onPressBrandItem={this._onPressBrandItem}
/>
);
}
break;
}
}else {
return (
<BrandStoreCenter />
<TouchableOpacity activeOpacity={0.5}>
<View style={styles.row}>
<Text style={styles.text}>
{rowData.name}
</Text>
</View>
</TouchableOpacity>
);
}
}
// 每一组中的数据
renderSectionHeader(sectionData, sectionID) {
//根据数据显示不同的header
switch (sectionData) {
case 'A':
{
return (
<View style={styles.headerViewStyle}>
<Text style={{marginLeft: 5, color: 'white'}}>{sectionData}</Text>
</View>
);
}
break;
default:
{
return (
<View style={styles.headerViewStyle}>
<Text style={{marginLeft: 5, color: 'white'}}>{sectionData}</Text>
</View>
);
}
break;
}
}
renderHeader(){
return(
<BrandStoreHeaderView
src={'aa'}
onPressCollection={this._onPressCollection}
/>
);
}
}
... ... @@ -67,7 +228,54 @@ let styles = StyleSheet.create({
container: {
flex: 1,
},
separator: {
height: 0.5,
backgroundColor: 'rgba(255,255,255,0.5)',
},
listViewStyle:{
justifyContent: 'space-around',
flexDirection: 'row',
flexWrap: 'wrap',
alignItems:'flex-start'
},
rowStyle: {
flexDirection: 'row',
alignItems: 'center',
padding: 10,
borderBottomColor: 'grey',
borderBottomWidth: 1 / PixelRatio.get()
},
headerViewStyle: {
height: 64,
backgroundColor: 'blue',
justifyContent: 'center',
alignItems: 'center',
width: Dimensions.get('window').width,
},
row: {
justifyContent: 'center',
padding: 5,
margin: 3,
width: 150,
height: 200,
backgroundColor: '#F6F6F6',
alignItems: 'center',
borderWidth: 1,
borderRadius: 5,
borderColor: '#CCC'
},
text: {
flex: 1,
marginTop: 5,
fontWeight: 'bold'
},
list: {
marginTop:5,
justifyContent: 'space-around',
flexDirection: 'row',
flexWrap: 'wrap'
},
});
export default connect(mapStateToProps, mapDispatchToProps)(BrandStoreContainer);
... ...
... ... @@ -15,8 +15,51 @@ const {
SHOP_INTRO_SUCCESS,
SHOP_INTRO_REQUEST,
SHOP_INTRO_FAILURE,
SHOP_RESOURCE_SUCCESS,
SHOP_RESOURCE_REQUEST,
SHOP_RESOURCE_FAILURE,
} = require('../../constants/actionTypes').default;
export function onPressBrandItem() {
return {
type: SEL_BRANDITEM,
payload: true
};
}
export function onPressCoupon() {
return {
type: SEL_COUPONITEM,
payload: true
};
}
export function onPressCollection() {
return {
type: SET_COLLECTION,
payload: true
};
}
export function shopResourceRequest() {
return {
type: SHOP_RESOURCE_REQUEST,
};
}
export function shopsResourcesSuccess(json) {
return {
type: SHOP_RESOURCE_SUCCESS,
payload:json
}
}
export function shopsResourcesFailure(error) {
return {
type: SHOP_RESOURCE_FAILURE,
payload:error
}
}
export function shopIntroRequest() {
return {
type: SHOP_INTRO_REQUEST,
... ... @@ -52,7 +95,7 @@ export function getShopsIntro() {
let {app, brandStore} = getState();
let {shopId} = brandStore;
if (!shopId) {
return;
// return;
}
let fetchShopIntroInfo = (shopId, uid) => {
... ... @@ -77,3 +120,37 @@ export function getShopsIntro() {
});
};
}
/*
* 店铺资源位
*/
export function getShopsResources() {
return (dispatch, getState) => {
let {app, brandStore} = getState();
let {shopId} = brandStore;
if (!shopId) {
return;
}
let fetchShopsResourcesInfo = (shopId, uid) => {
return new BrandStoreService().fetchShopsResources(shopId, uid)
.then(json => {
let payload = json;
console.log(json);
dispatch(shopsResourcesSuccess(payload));
})
.catch(error => {
dispatch(shopsResourcesFailure(error));
});
}
ReactNative.NativeModules.YH_CommonHelper.uid()
.then(uid => {
fetchShopsResourcesInfo(shopId, uid);
})
.catch(error => {
fetchShopsResourcesInfo(shopId, 0);
});
};
}
... ...
... ... @@ -15,6 +15,7 @@ let shopsIntro = new (Record({
}));
let InitialState = Record({
shopResource: List(),
shopsIntro: shopsIntro,
isCollection: false,
hasBuy : false,
... ...
... ... @@ -15,6 +15,9 @@ const {
SHOP_INTRO_SUCCESS,
SHOP_INTRO_REQUEST,
SHOP_INTRO_FAILURE,
SHOP_RESOURCE_SUCCESS,
SHOP_RESOURCE_REQUEST,
SHOP_RESOURCE_FAILURE,
} = require('../../constants/actionTypes').default;
const initialState = new InitialState;
... ... @@ -43,7 +46,7 @@ export default function brandStoreReducer(state=initialState, action) {
case SHOP_INTRO_SUCCESS:{
let json = action.payload;
let {is_favorite,shop_intro,shop_logo,shop_name} = json;
let {is_favorite,shop_intro,shop_logo,shop_name,mult_brand_shop_type,shop_domain,shops_id} = json;
let shopIntro = initialState.shopsIntro;
shopIntro = shopIntro.set('isFavorite', is_favorite)
.set('shopIntro', shop_intro)
... ... @@ -52,11 +55,21 @@ export default function brandStoreReducer(state=initialState, action) {
.set('multBrandShopType', mult_brand_shop_type)
.set('shopDomain', shop_domain)
.set('shopsId', shops_id);
let nextState = state.set('shopsIntro', shopsIntro)
let nextState = state.set('shopsIntro', shopIntro)
return nextState;
}
break;
case SHOP_RESOURCE_SUCCESS:{
return state.set('shopResource', Immutable.fromJS(action.payload.list))
}
case SHOP_RESOURCE_FAILURE:{
return state.set('shopResource', Immutable.fromJS(action.payload))
}
break;
}
return state;
... ...
... ... @@ -26,4 +26,21 @@ export default class QRCodeService {
});
}
async fetchShopsResources(shopId, uid) {
return await this.api.get({
url: '',
body: {
method: 'app.shopsdecorator.getList',
shop_id: shopId,
uid,
}
})
.then((json) => {
return json;
})
.catch((error) => {
throw(error);
});
}
}
... ...