Authored by 于良

Merge branch '5.5.1' of http://git.yoho.cn/mobile/YH_RNComponent into 5.5.1

... ... @@ -21,6 +21,8 @@ import mineInitialState from './reducers/mine/mineInitialState';
import MineContainer from './containers/MineContainer';
import {
setPlatform,
setHost,
setServiceHost,
setChannel,
} from './reducers/app/appActions';
... ... @@ -45,6 +47,9 @@ export default function native(platform) {
render() {
const store = configureStore(getInitialState());
store.dispatch(setPlatform(platform));
store.dispatch(setHost(this.props.host));
store.dispatch(setServiceHost(this.props.serviceHost));
let channel = this.props.channel;
let profilesInfo = this.props.profilesInfo;
let memberBillNew = this.props.memberBillNew;
... ...
'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 Immutable, {Map} from 'immutable';
import RecyclerSwiper from '../../../common/recycler-swiper/recyclerswiper'
const {
View,
Image,
TouchableOpacity,
StyleSheet,
Dimensions,
Platform,
} = ReactNative;
const YH_Swiper = (Platform.OS === 'ios') ? Swiper : RecyclerSwiper;
export default class ImageSlider extends React.Component {
constructor(props) {
super (props);
this.dot = <View
style={{
backgroundColor:'rgba(237, 237, 237, 0.5)',
width: 6,
height: 6,
borderRadius: 3,
marginLeft: 3,
marginRight: 3,
marginTop: 3,
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)
&& nextProps.sliderWidth == this.props.sliderWidth
&& nextProps.sliderHeight == this.props.sliderHeight) {
return false;
} else {
return true;
}
}
render() {
let {resource, sliderWidth, sliderHeight} = this.props;
if (!resource || resource.size == 0) {
return null;
}
let data = this.props.resource.toJS();
if (data.length == 1) {
let imageUrl = YH_Image.getSlicedUrl(data[0].src, sliderWidth, sliderHeight, 2);
return (
<TouchableOpacity
activeOpacity={1}
style={{width: sliderWidth, height: sliderHeight}}
onPress={() => {
this.props.onPressSlideItem && this.props.onPressSlideItem(data[0].url, imageUrl, 0);
}}
>
<YH_Image
url={imageUrl}
style={{ width: sliderWidth, height: sliderHeight}}
/>
</TouchableOpacity>
);
} else {
return (
<YH_Swiper
showsButtons={false}
loop={true}
autoplay={true}
autoplayTimeout={3}
dot={this.dot}
activeDot={(Platform.OS === 'ios') ? this.activeDot : null}
width={sliderWidth}
height={sliderHeight}
paginationStyle={{
backgroundColor: 'rgba(68, 68, 68, 0.2)',
bottom: 10,
height: 10,
width: data.length * 12,
borderRadius: 5,
marginLeft: (sliderWidth - data.length * 12)/2,
paddingBottom: 3,
}}
>
{data.map((item, i) => {
let imageUrl = YH_Image.getSlicedUrl(item.src, sliderWidth, sliderHeight, 2);
return (
<TouchableOpacity
key={i}
activeOpacity={1}
yh_exposureData={item.yh_exposureData}
onPress={() => {
this.props.onPressSlideItem && this.props.onPressSlideItem(item.url, imageUrl,i);
}}
onPressIn={() => {
this.props.onChildScrollToPreventRefresh && this.props.onChildScrollToPreventRefresh();
}}
>
<YH_Image
url={imageUrl}
style={{width: sliderWidth, height: sliderHeight}}
/>
</TouchableOpacity>
);
})}
</YH_Swiper>
);
}
}
}
... ...
'use strict';
import React, {Component} from 'react';
import Immutable, {Map} from 'immutable';
import SlicedImage from '../../../common/components/SlicedImage';
import YH_Image from '../../../common/components/YH_Image';
import ReactNative, {
View,
StyleSheet,
Dimensions,
} from 'react-native';
/**
* 分割线楼层
**/
export default class DivideImage extends Component{
constructor(props) {
super(props);
}
render(){
let data = this.props.data;
let url = data && data.get(0,{}).get("src",'');
let imageUrl = SlicedImage.getSlicedUrl(url, width, height, 2);
return(
<View style={styles.container}>
<YH_Image style={styles.immage} url={imageUrl} />
</View>
);
}
};
let {width} = Dimensions.get('window');
let height = 10;
let styles = StyleSheet.create({
container: {
width: width,
height: height,
backgroundColor: "#f0f0f0",
},
immage: {
width: width,
height: height,
},
});
... ...
'use strict';
import React from 'react';
import ReactNative from 'react-native';
import ImageSlider from '../cell/ImageSlider';
import Immutable, {Map} from 'immutable';
const {
View,
Image,
TouchableOpacity,
StyleSheet,
Dimensions,
Platform,
} = ReactNative;
export default class SingleImage extends React.Component {
constructor(props) {
super (props);
}
shouldComponentUpdate(nextProps){
if (Immutable.is(nextProps.data, this.props.data)) {
return false;
} else {
return true;
}
}
render() {
return (
<ImageSlider
resource={this.props.data}
sliderWidth={width}
sliderHeight={sliderHeight}
onPressSlideItem={this.props.onPressSlideItem}
/>
);
}
}
let {width, height} = Dimensions.get('window');
let sliderHeight = Math.ceil(width * 234 / 750);
\ No newline at end of file
... ...
'use strict';
import React from 'react';
import ReactNative from 'react-native';
import YH_Image from '../../../common/components/YH_Image';
import Immutable, {Map} from 'immutable';
const {
View,
TouchableOpacity,
StyleSheet,
Dimensions,
Platform,
} = ReactNative;
export default class SmallPic extends React.Component {
constructor(props) {
super (props);
}
shouldComponentUpdate(nextProps){
if (Immutable.is(nextProps.data, this.props.data)) {
return false;
} else {
return true;
}
}
render() {
let {data} = this.props;
if (!data || data.size == 0) {
return null;
}
let url1 = YH_Image.getSlicedUrl(data.get(0).get('src'), imageWidth, imageHeight, 2);
let url2 = YH_Image.getSlicedUrl(data.get(1).get('src'), imageWidth, imageHeight, 2);
return (
<View style={styles.container}>
<TouchableOpacity
activeOpacity={1}
onPress={() => {
this.props.onPressPicItem && this.props.onPressPicItem(data.get(0).get('url'), url1, 0);
}}
>
<YH_Image
url={url1}
masksToBounds={true}
radius={{'topLeft':'3','topRight':'3','bottomRight':'3','bottomLeft':'3'}}
style={[styles.image, styles.left]}
/>
</TouchableOpacity>
<TouchableOpacity
activeOpacity={1}
onPress={() => {
this.props.onPressPicItem && this.props.onPressPicItem(data.get(1).get('url'), url2, 1);
}}
>
<YH_Image
url={url2}
masksToBounds={true}
radius={{'topLeft':'3','topRight':'3','bottomRight':'3','bottomLeft':'3'}}
style={[styles.image, styles.right]}
/>
</TouchableOpacity>
</View>
);
}
}
let {width, height} = Dimensions.get('window');
const DEVICE_WIDTH_RATIO = width / 320;
let containerHeight = Math.ceil(80 * (width - 45) / 2 / 137.5);
let imageWidth = Math.ceil((width - 45) / 2);
let imageHeight = Math.ceil(80 * (imageWidth / 137.5));
let styles = StyleSheet.create({
container: {
width: width,
height: containerHeight,
flexDirection: 'row',
backgroundColor: '#f0f0f0',
},
image: {
width: imageWidth,
height: imageHeight,
borderRadius: 3,
backgroundColor: 'white',
marginLeft: 15,
},
left: {
},
right: {
},
});
... ...
... ... @@ -81,6 +81,7 @@ export default class MineList extends React.Component {
iconAll={this.props.iconAll}
instalmentStatus={this.props.instalmentStatus}
mineResource={this.props.mineResource}
onPressFloorItem={this.props.onPressFloorItem}
/>
);
}
... ...
... ... @@ -14,6 +14,7 @@ import ReactNative, {
import Immutable, {Map} from 'immutable';
import Announcement from './Announcement';
import MineResourceList from './MineResourceList';
import YH_Image from '../../../common/components/YH_Image';
export default class MineListHeader extends React.Component {
... ... @@ -23,6 +24,8 @@ export default class MineListHeader extends React.Component {
this._renderMinePropertyNumberPoint = this._renderMinePropertyNumberPoint.bind(this);
this._renderVip = this._renderVip.bind(this);
this._renderBannerResource = this._renderBannerResource.bind(this);
this._calculateBannerResourceHeight = this._calculateBannerResourceHeight.bind(this);
}
/**
... ... @@ -111,20 +114,54 @@ export default class MineListHeader extends React.Component {
);
}
//渲染资源位
_renderBannerResource(){
let mineResource = this.props.mineResource;
if(!mineResource)
return;
//
return(
<View style={{width:width,height:25, backgroundColor:'red'}}>
</View>
<MineResourceList
style={{width:width,height:500}}
mineResource={this.props.mineResource}
onPressFloorItem={this.props.onPressFloorItem}>
</MineResourceList>
);
}
//计算资源位高度
_calculateBannerResourceHeight(){
let {mineResource} = this.props;
let resourceList = mineResource ? mineResource.toJS() : [];
let floorHeight = 0;
let i = 0;
let count = resourceList.length;
for(i; i < count; i++) {
let item = resourceList[i];
if (!item) {
continue;
}
let templateName = item.template_name;
let data = item.data;
if (!templateName || !data) {
continue;
}
switch(templateName) {
case 'single_image': {
floorHeight = floorHeight + Math.ceil(width * 234 / 750);
break;
}
case 'small_pic': {
floorHeight = floorHeight + Math.ceil(80 * (width - 45) / 2 / 137.5);
break;
}
case 'divideImage': {
floorHeight = floorHeight + 10;
break;
}
}
}
return floorHeight;
}
... ... @@ -166,6 +203,13 @@ export default class MineListHeader extends React.Component {
if (this.props.activityListInfo && this.props.activityListInfo.list && this.props.activityListInfo.list.size > 0) {
oHigh = oHigh + rowheight * this.props.activityListInfo.list.size;
}
//资源位高度
if (this.props.mineResource) {
let floorHeight = this._calculateBannerResourceHeight();
oHigh = oHigh + floorHeight;
}
oHigh = topHeight + oHigh;
let bgImage = Platform.OS === 'ios' ? require('../../image/mine_top_boy.png') : require('../../image/mine_banner_boy.jpg');
let bgHeight = Platform.OS === 'ios' ? 284 : 175;
... ... @@ -675,7 +719,9 @@ export default class MineListHeader extends React.Component {
<Image style={styles.arrow} source={require('../../image/arrow_gray.png')}/>
</View>
</TouchableOpacity>
{this._renderBannerResource()}
<View style={{
width: width,
height: 10,
... ...
'use strict';
import React from 'react';
import ReactNative, {
View,
Text,
Image,
ListView,
StyleSheet,
Dimensions,
TouchableOpacity,
Platform,
PixelRatio,
} from 'react-native';
import Immutable, {Map} from 'immutable';
import SingleImage from '../floor/SingleImage';
import DivideImage from '../floor/DivideImage';
import SmallPic from '../floor/SmallPic';
export default class MineResourceList extends React.Component {
constructor(props) {
super(props);
this._renderRow = this._renderRow.bind(this);
this.dataSource = new ListView.DataSource({
rowHasChanged: (r1, r2) => !Immutable.is(r1, r2),
});
}
_renderRow(rowData, sectionID, rowID, highlightRow) {
if(!rowData || !rowData.get('data')){
return null;
}
let template_name = rowData.get('template_name');
switch (template_name) {
case 'single_image': {
return (
<SingleImage
data={rowData.get('data')}
onPressSlideItem={(jumpUrl, imageUrl, index) =>{
this.props.onPressFloorItem&&this.props.onPressFloorItem(jumpUrl, imageUrl, index, rowData, rowID);
}}
/>
);
}
case 'small_pic': {
return (
<SmallPic
data={rowData.get('data')}
onPressPicItem={(jumpUrl, imageUrl, index) =>{
this.props.onPressFloorItem&&this.props.onPressFloorItem(jumpUrl, imageUrl, index, rowData, rowID);
}}
/>
);
}
case 'divideImage': {
return (
<DivideImage data={rowData.get('data')}/>
);
}
default:
return null;
}
}
render() {
let mineResource = this.props.mineResource;
if(!mineResource)
return;
let dataSource = mineResource.toArray();
return (
<View style={styles.container}>
<ListView
contentContainerStyle={styles.contentContainer}
enableEmptySections={true}
dataSource={this.dataSource.cloneWithRows(dataSource)}
renderRow={this._renderRow}
/>
</View>
);
}
};
let {width, height} = Dimensions.get('window');
let styles = StyleSheet.create({
container: {
width: width,
},
contentContainer: {
flex: 1,
},
});
... ...
... ... @@ -2,6 +2,8 @@ import keyMirror from 'key-mirror';
export default keyMirror({
SET_PLATFORM:null,
SET_HOST: null,
SET_SERVICE_HOST: null,
SET_CHANNEL:null,
SET_IS_NEED_SHOW_XSRZ:null,
... ...
... ... @@ -45,6 +45,9 @@ class MineContainer extends Component {
this._onLongPressProduct = this._onLongPressProduct.bind(this);
this._onPressFindSimilar = this._onPressFindSimilar.bind(this);
//资源位点击楼层
this._onPressFloorItem = this._onPressFloorItem.bind(this);
this.subscription1 = NativeAppEventEmitter.addListener(
'UserDidLoginEvent',
(reminder) => {
... ... @@ -88,7 +91,7 @@ class MineContainer extends Component {
this.props.actions.onMineCenterRefresh();
this.props.actions.getMineAllIcon();
this.props.actions.setShowSimilarGuider(true);
//this.props.actions.getMineResource();
this.props.actions.getMineResource();
}
componentWillUnmount() {
... ... @@ -290,6 +293,25 @@ class MineContainer extends Component {
});
}
//点击资源位楼层数据
_onPressFloorItem(jumpUrl, imageUrl, index, floorData, floorIndex) {
if (!jumpUrl) {
return;
}
ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(jumpUrl);
let floorID = floorData.get('template_id','');
let floorName = floorData.get('template_name','');
let param = {
'F_ID': floorID,
'F_NAME': floorName,
'F_URL': jumpUrl,
'F_INDEX': parseInt(floorIndex) + 1 + "",
'I_INDEX': parseInt(index) + 1 + "",
};
NativeModules.YH_CommonHelper.logEvent('YB_MY_BANNER_C', param);
}
render() {
let {
isFetching,
... ... @@ -335,6 +357,7 @@ class MineContainer extends Component {
onMineCenterRefresh={this._onMineCenterRefresh}
onLongPressProduct={this._onLongPressProduct}
onPressFindSimilar={this._onPressFindSimilar}
onPressFloorItem={this._onPressFloorItem}
showSimilarGuider={showSimilarGuider}
/>
);
... ...
... ... @@ -4,6 +4,8 @@ import ReactNative from 'react-native';
const {
SET_PLATFORM,
SET_HOST,
SET_SERVICE_HOST,
SET_CHANNEL,
} = require('../../constants/actionTypes').default;
... ... @@ -15,6 +17,20 @@ export function setPlatform(platform) {
};
}
export function setHost(host) {
return {
type: SET_HOST,
payload: host
};
}
export function setServiceHost(host) {
return {
type: SET_SERVICE_HOST,
payload: host
};
}
export function setChannel(channel) {
return {
type: SET_CHANNEL,
... ...
... ... @@ -4,6 +4,8 @@ import InitialState from './appInitialState';
const {
SET_PLATFORM,
SET_HOST,
SET_SERVICE_HOST,
SET_CHANNEL,
} = require('../../constants/actionTypes').default;
... ... @@ -15,6 +17,10 @@ export default function appReducer(state = initialState, action) {
switch (action.type) {
case SET_PLATFORM:
return state.set('platform', action.payload);
case SET_HOST:
return state.set('host', action.payload);
case SET_SERVICE_HOST:
return state.set('serviceHost', action.payload);
case SET_CHANNEL:
return state.set('channel', action.payload);
}
... ...
... ... @@ -494,8 +494,7 @@ export default function appReducer(state = initialState, action) {
}
case GET_MINERESOURCE_SUCCESS: {
let {data} = action.payload;
let mineResource = (data && data.list) ? data.list : [];
let mineResource = action.payload ? action.payload : [];
return state.set("mineResource", Immutable.fromJS(mineResource));
}
}
... ...