mobile / YH_RNComponent · Commits

Go to a project

Authored by Zhu-Arthur
Commit 34f3a4c4eff40dbeaee244a6c63dc2473966ef69 1 parent d67d2c94

拼团3期需求 review by 戴强

Inline Side-by-side
Showing 28 changed files with 684 additions and 42 deletions
... ... @@ -7,7 +7,7 @@ import configureStore from './store/configureStore';
import appInitialState from './reducers/app/appInitialState';
import groupPurchaseInitialState from './reducers/groupPurchase/groupPurchaseInitialState';
import GroupPurchaseContainer from './containers/GroupPurchaseContainer';
import {setHost, setPlatform, setServiceHost} from './reducers/app/appActions';
import {setHost, setPlatform, setServiceHost, getUid, getUnionType} from './reducers/app/appActions';
import {setActivityId} from './reducers/groupPurchase/groupPurchaseActions';
import createReactClass from 'create-react-class';
import GroupPurchaseDetailContainer from './containers/GroupPurchaseDetailContainer';
... ... @@ -36,6 +36,8 @@ export default function native(platform) {
store.dispatch(setActivityId(this.props.activityId));
store.dispatch(setGroupNo(this.props.groupNo));
store.dispatch(setDetailActivityId(this.props.activityId));
store.dispatch(getUid());
store.dispatch(getUnionType());
let type = this.props.type;
if (type === 'List') {
... ...
... ... @@ -185,7 +185,7 @@ export default class GroupDetailHeader extends React.Component {
<TouchableOpacity activeOpacity={0.5} style={styles.product} onPress={() => {
this.props.didTouchProduct && this.props.didTouchProduct(productSkn,activityId);
}}>
<GroupDetailProduct resource={productDetail} pageGo={pageGo} perpleNum={perpleNum}/>
<GroupDetailProduct joinLimit={joinLimit} resource={productDetail} pageGo={pageGo} perpleNum={perpleNum}/>
</TouchableOpacity>
<View style={styles.bottomLine}/>
</View>
... ...
... ... @@ -24,7 +24,7 @@ export default class GroupDetailProduct extends React.Component {
}
render() {
let { resource ,perpleNum,pageGo} = this.props;
let { resource ,perpleNum,pageGo, joinLimit} = this.props;
if(!resource) return null;
let productIcon = resource.productIcon ? getSlicedUrl(resource.productIcon,109*DEVICE_WIDTH_RATIO, 141*DEVICE_WIDTH_RATIO, 2) : '';
let productGroupPrice = resource.productGroupPrice;
... ... @@ -44,6 +44,7 @@ export default class GroupDetailProduct extends React.Component {
<Text style={styles.title} numberOfLines={2}>{productName}</Text>
</View>
<View style={styles.priceView}>
{joinLimit == 1 && <Image style={styles.priceImg} source={require('../images/ptj_tab.png')}/>}
<Text style={styles.price1}>{productGroupPrice}</Text>
</View>
<View style={styles.subPriceView}>
... ... @@ -132,17 +133,19 @@ let styles = StyleSheet.create({
fontSize: 9*DEVICE_WIDTH_RATIO,
textAlign: 'center',
},
priceImg: {
marginRight: 5,
},
price1: {
fontSize: 18*DEVICE_WIDTH_RATIO,
fontSize: 20*DEVICE_WIDTH_RATIO,
color: '#D0021B',
lineHeight: 18*DEVICE_WIDTH_RATIO,
fontWeight: 'bold',
},
price2: {
fontSize: 12*DEVICE_WIDTH_RATIO,
lineHeight: 12*DEVICE_WIDTH_RATIO,
fontWeight: '500',
color: '#B0B0B0',
alignItems: 'center',
marginTop: 2*DEVICE_WIDTH_RATIO,
... ...
... ... @@ -34,6 +34,7 @@ export default class GroupProductCell extends React.Component {
let productSkn = resource.get('productSkn');
let activityId = resource.get('activityId');
let collagePrice = resource.get('collagePrice').toFixed(2);
let joinLimit = resource.get('joinLimit');
return (
<View>
<TouchableOpacity activeOpacity={0.8} onPress={() => {
... ... @@ -48,8 +49,9 @@ export default class GroupProductCell extends React.Component {
<Text style={styles.title} numberOfLines={2}>{resource.get('productName')}</Text>
</View>
<View style={styles.priceView}>
<Text style={styles.price1}>¥{collagePrice}</Text>
<Text style={[styles.price2, {textDecorationLine: 'line-through'}]}>{deleteLineText}</Text>
{joinLimit == 1 && <Image style={styles.priceImg} source={require('../images/ptj_tab.png')} />}
<Text style={styles.price1}>¥{collagePrice}</Text>
<Text style={[styles.price2, {textDecorationLine: 'line-through'}]}>{deleteLineText}</Text>
</View>
<View style={styles.buttonView}>
<ImageBackground
... ... @@ -67,7 +69,7 @@ export default class GroupProductCell extends React.Component {
</View>
</View>
</View>
<View style={styles.line}/>
<View style={styles.line}/>
</TouchableOpacity>
</View>
... ... @@ -125,6 +127,9 @@ let styles = StyleSheet.create({
flexDirection: 'row',
alignItems: 'center',
},
priceImg: {
marginRight: 5,
},
iconTextView: {
width: 40,
height: 14,
... ... @@ -186,9 +191,9 @@ let styles = StyleSheet.create({
color: 'white',
},
line: {
width,
height: 1,
marginLeft: 15*DEVICE_WIDTH_RATIO,
backgroundColor: '#E0E0E0',
width,
height: 1,
marginLeft: 15*DEVICE_WIDTH_RATIO,
backgroundColor: '#E0E0E0',
},
});
... ...
... ... @@ -53,6 +53,10 @@ export default class GroupPurchase extends Component {
);
}
goMyPurchaseOrder() {
this.props.jumpToMinePurchaseOrder();
}
render() {
let {
productList,
... ... @@ -73,11 +77,16 @@ export default class GroupPurchase extends Component {
renderRow={this._renderRow}
renderHeader={this._renderHeader}
onEndReached={() => {
if (productList.list.size !== 0) {
this.props.onEndReached && this.props.onEndReached();
}
if (productList && productList.list && productList.list.size !== 0) {
this.props.onEndReached && this.props.onEndReached();
}
}}
/>
<View style={styles.bottom}>
<TouchableOpacity onPress={() => this.goMyPurchaseOrder()} style={styles.center}>
<Text style={styles.myPurchaseText}>我的拼团</Text>
</TouchableOpacity>
</View>
</View>
);
}
... ... @@ -96,5 +105,20 @@ let styles = StyleSheet.create({
width,
height: 121*DEVICE_WIDTH_RATIO,
},
bottom: {
height: 44,
borderTopWidth: 1,
borderColor: '#e0e0e0',
},
center: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
},
myPurchaseText: {
fontFamily: 'PingFang-SC-Medium',
fontSize: 14,
color: '#444444',
}
})
;
... ...
'use strict';
import React from 'react';
import ReactNative , {Platform}from 'react-native';
import YH_Image from '../../common/components/YH_Image';
import {getSlicedUrl} from '../../classify/utils/Utils';
const {
AppRegistry,
StyleSheet,
Image,
View,
Dimensions,
TouchableOpacity,
Modal,
Text,
CameraRoll,
Alert,
ScrollView,
} = ReactNative;
export default class SnapshootShare extends React.Component {
constructor(props) {
super(props);
this.saveImage = this.saveImage.bind(this);
this.shareImage = this.shareImage.bind(this);
}
shareImage(shareType){
if (Platform.OS === 'ios') {
ReactNative.takeSnapshot(this.refs.container, {format: 'png', quality: 10}).then(
(uri) => {
this.props.shareSnapshootAction && this.props.shareSnapshootAction(shareType,uri);
}).catch(
(error) => {
Alert.alert('图片生成失败!')
});
} else {
// captureRef(this.refs.container, {format: 'png', quality: 10}).then(
// (uri) => {
// this.props.shareSnapshootAction && this.props.shareSnapshootAction(shareType,uri);
// }).catch(
// (error) => {
// Alert.alert('图片生成失败!')
// });
}
}
saveImage(){
if (Platform.OS === 'ios'){
ReactNative.takeSnapshot(this.refs.container, {format: 'png', quality: 10}).then(
(uri) => {
var promise = CameraRoll.saveToCameraRoll(uri);
promise.then(function(result) {
Alert.alert('保存成功!')
}).catch(function(error) {
Alert.alert('保存失败!')
});
}).catch(
(error) => {
Alert.alert('保存失败!')
});
} else {
// captureRef(this.refs.container, {format: 'png', quality: 10}).then(
// (uri) => {
// var promise = CameraRoll.saveToCameraRoll(uri);
// promise.then(function(result) {
// Alert.alert('保存成功!')
// }).catch(function(error) {
// Alert.alert('保存失败!')
// });
// }).catch(
// (error) => {
// Alert.alert('保存失败!')
// });
}
}
render() {
let { shareCodeInfo, qrCode, unionType } = this.props;
shareCodeInfo = shareCodeInfo ? shareCodeInfo.toJS() : {};
let productIcon = shareCodeInfo.bigImage ? getSlicedUrl(shareCodeInfo.bigImage,218*DEVICE_WIDTH_RATIO, 282*DEVICE_WIDTH_RATIO, 2) : '';
return (
<Modal
visible={this.props.show}
animationType={'none'}
transparent={true}
onRequestClose={() => {
}}>
<View style={styles.modalContainer}>
<ScrollView
style={styles.scrollView}
vertical={true}
showsVerticalScrollIndicator={false}
>
<View style={styles.container} ref='container'>
<Image source={require('../images/share-logo.png')} resizeMode={'contain'} style={styles.logo} />
<View style={styles.product}>
<YH_Image style={styles.productimage} url={productIcon}></YH_Image>
</View>
<View style={styles.bottom}>
<Image source={{uri: qrCode}} resizeMode={'contain'} style={styles.qr} />
<View style={styles.bottomDetail}>
<View style={styles.titleV}>
<Text style={styles.titleText}>{shareCodeInfo.title}</Text>
</View>
<Text style={styles.tipDetailText}>长按图片识别小程序参团</Text>
</View>
</View>
</View>
<View style={styles.spaceV}/>
</ScrollView>
<View style={styles.shareView}>
<View style={styles.buttons}>
<TouchableOpacity activeOpacity={0.5} style={styles.button1} onPress={() => {
this.shareImage && this.shareImage('WXSceneSession');
}}>
<Image source={unionType ? require('../images/unionShare_wx_icon.png') : require('../images/weixin.png')} style={styles.icon} />
<Text style={styles.text}>微信好友</Text>
</TouchableOpacity>
<TouchableOpacity activeOpacity={0.5} style={styles.button2} onPress={() => {
this.shareImage && this.shareImage('WXSceneTimeline');
}}>
<Image source={unionType ? require('../images/unionShare_timeline_icon.png') : require('../images/share_timeline_icon.png')} style={styles.icon} />
<Text style={styles.text}>微信朋友圈</Text>
</TouchableOpacity>
</View>
<View style={styles.line}/>
<TouchableOpacity activeOpacity={0.5} style={styles.save} onPress={() => {
this.saveImage && this.saveImage();
}}>
<Text style={styles.savetext}>保存图片</Text>
</TouchableOpacity>
</View>
<TouchableOpacity activeOpacity={0.5} style={styles.cancelBtn} onPress={() => {
this.props.showSnapshootShare && this.props.showSnapshootShare(false);
}}>
<Image source={require('../images/imageShareClose.png')} style={styles.cancelBtnicon} resizeMode={'contain'}/>
</TouchableOpacity>
</View>
</Modal>
);
}
};
let {width, height} = Dimensions.get('window');
const DEVICE_WIDTH_RATIO = width / 375;
let styles = StyleSheet.create({
modalContainer: {
flex: 1,
width: width,
height: height,
},
backContainer: {
flex: 1,
width: width,
height: height,
alignItems: 'center',
backgroundColor: 'white',
},
container: {
width,
height,
backgroundColor: 'white',
alignItems: 'center',
},
scrollView: {
backgroundColor: 'white',
},
spaceV: {
backgroundColor: 'white',
height: 150*DEVICE_WIDTH_RATIO,
width,
},
logo: {
height: 22*DEVICE_WIDTH_RATIO,
width: 112*DEVICE_WIDTH_RATIO,
marginTop: 37*DEVICE_WIDTH_RATIO,
},
productimage: {
height: 443*DEVICE_WIDTH_RATIO,
width: 325*DEVICE_WIDTH_RATIO,
},
product: {
height: 443*DEVICE_WIDTH_RATIO,
width: 325*DEVICE_WIDTH_RATIO,
marginTop: 24*DEVICE_WIDTH_RATIO,
},
productDetail: {
height: 80*DEVICE_WIDTH_RATIO,
width: 325*DEVICE_WIDTH_RATIO,
backgroundColor: 'rgba(0,0,0,0.4)',
position: 'absolute',
bottom: 0,
},
productDetailTop: {
height: 20*DEVICE_WIDTH_RATIO,
width: 325*DEVICE_WIDTH_RATIO,
marginTop: 14*DEVICE_WIDTH_RATIO,
justifyContent: 'center',
alignItems: 'center',
},
productDetailTopText: {
fontSize: 14,
color: '#FFFFFF',
},
productDetailBottom: {
height: 30*DEVICE_WIDTH_RATIO,
width: 325*DEVICE_WIDTH_RATIO,
marginTop: 7*DEVICE_WIDTH_RATIO,
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'center',
},
priceIcon: {
height: 17,
width: 50,
},
price: {
fontSize: 24,
color: '#FFFFFF',
marginLeft: 15*DEVICE_WIDTH_RATIO,
fontWeight: 'bold',
},
price2: {
fontSize: 14,
lineHeight: 14,
color: '#B0B0B0',
alignItems: 'center',
marginLeft: 13*DEVICE_WIDTH_RATIO,
height: 14,
marginTop: 2,
},
mianyouIcon: {
position: 'absolute',
top: 262*DEVICE_WIDTH_RATIO,
right: 28*DEVICE_WIDTH_RATIO,
height: 63*DEVICE_WIDTH_RATIO,
width: 63*DEVICE_WIDTH_RATIO,
},
bottom: {
height: 141*DEVICE_WIDTH_RATIO,
width: 325*DEVICE_WIDTH_RATIO,
alignItems: 'center',
flexDirection: 'row',
},
qr: {
height: 80*DEVICE_WIDTH_RATIO,
width: 80*DEVICE_WIDTH_RATIO,
},
bottomDetail: {
height: 80*DEVICE_WIDTH_RATIO,
width: 245*DEVICE_WIDTH_RATIO,
},
titleV: {
width: 218*DEVICE_WIDTH_RATIO,
height: 20*DEVICE_WIDTH_RATIO,
flexDirection: 'row',
alignItems: 'center',
marginTop: 16*DEVICE_WIDTH_RATIO,
marginLeft: 27*DEVICE_WIDTH_RATIO,
},
titleText: {
fontSize: 16,
color: '#444444',
},
tipDetailText: {
fontSize: 12,
color: '#B0B0B0',
marginTop: 12*DEVICE_WIDTH_RATIO,
marginLeft: 27*DEVICE_WIDTH_RATIO,
},
shareView: {
position: 'absolute',
width,
height: 171*DEVICE_WIDTH_RATIO,
backgroundColor: 'rgb(241,241,241)',
alignItems: 'center',
bottom : 0,
},
image :{
width: 305*DEVICE_WIDTH_RATIO,
height: 88*DEVICE_WIDTH_RATIO,
marginTop: 25*DEVICE_WIDTH_RATIO,
backgroundColor: 'red',
},
buttons: {
width,
height: 115*DEVICE_WIDTH_RATIO,
alignItems: 'center',
flexDirection: 'row',
},
button1: {
alignItems: 'center',
marginLeft: (width - 180*DEVICE_WIDTH_RATIO)/3,
},
button2: {
marginLeft: (width - 180*DEVICE_WIDTH_RATIO)/3,
alignItems: 'center',
},
icon: {
width: 45*DEVICE_WIDTH_RATIO,
height: 45*DEVICE_WIDTH_RATIO,
},
text: {
marginTop: 8*DEVICE_WIDTH_RATIO,
fontSize: 12,
width: 90*DEVICE_WIDTH_RATIO,
textAlign: 'center',
color: '#444444',
},
line: {
width: width - 52,
height: 1,
backgroundColor: '#CCCCCC',
},
save: {
width,
height: 54*DEVICE_WIDTH_RATIO,
justifyContent: 'center',
alignItems: 'center',
},
savetext: {
fontSize: 17,
color: '#444444',
},
cancelBtn: {
position: 'absolute',
width: 54*DEVICE_WIDTH_RATIO,
height: 54*DEVICE_WIDTH_RATIO,
top: 44,
right: 34,
alignItems: 'flex-end',
},
cancelBtnicon: {
width: 30*DEVICE_WIDTH_RATIO,
height: 30*DEVICE_WIDTH_RATIO,
},
});
... ...
... ... @@ -21,6 +21,7 @@ export default class ShareViewModal extends React.Component {
}
render() {
let { unionType } = this.props;
return (
<Modal
visible={this.props.show}
... ... @@ -34,13 +35,13 @@ export default class ShareViewModal extends React.Component {
<TouchableOpacity activeOpacity={0.5} style={styles.button1} onPress={() => {
this.props.shareMiniApp && this.props.shareMiniApp();
}}>
<Image source={require('../images/weixin.png')} style={styles.icon} />
<Image source={unionType ? require('../images/unionShare_wx_icon.png') : require('../images/weixin.png')} style={styles.icon} />
<Text style={styles.text}>分享给好友</Text>
</TouchableOpacity>
<TouchableOpacity activeOpacity={0.5} style={styles.button2} onPress={() => {
this.props.showSnapshootShare && this.props.showSnapshootShare(true);
}}>
<Image source={require('../images/pengyou.png')} style={styles.icon} />
<Image source={unionType ? require('../images/unionShare_qr_icon.png') : require('../images/pengyou.png')} style={styles.icon} />
<Text style={styles.text}>微信快照</Text>
</TouchableOpacity>
</View>
... ...
... ... @@ -53,7 +53,7 @@ export default class SnapshootShare extends React.Component {
}
render() {
let { groupDetail ,qrCode} = this.props;
let { groupDetail ,qrCode, unionType} = this.props;
let productDetail = groupDetail ? groupDetail.toJS():null;
if(!productDetail){
return null;
... ... @@ -122,13 +122,13 @@ export default class SnapshootShare extends React.Component {
<TouchableOpacity activeOpacity={0.5} style={styles.button1} onPress={() => {
this.shareImage && this.shareImage('WXSceneSession');
}}>
<Image source={require('../images/weixin.png')} style={styles.icon} />
<Image source={unionType ? require('../images/unionShare_wx_icon.png') : require('../images/weixin.png')} style={styles.icon} />
<Text style={styles.text}>微信好友</Text>
</TouchableOpacity>
<TouchableOpacity activeOpacity={0.5} style={styles.button2} onPress={() => {
this.shareImage && this.shareImage('WXSceneTimeline');
}}>
<Image source={require('../images/share_timeline_icon.png')} style={styles.icon} />
<Image source={unionType ? require('../images/unionShare_timeline_icon.png') : require('../images/share_timeline_icon.png')} style={styles.icon} />
<Text style={styles.text}>微信朋友圈</Text>
</TouchableOpacity>
</View>
... ...
... ... @@ -18,4 +18,10 @@ export default keyMirror({
UPDATE_LEFTTIME: null,
SHOWSHARVIEW: null,
SHOWSNAPSHOOTSHARE: null,
SET_UNIONTYPE: null,
FETCH_SHARE_CODE_INFO: null,
SHARECODEINFO_REQUEST: null,
SHARECODEINFO_SUCCESS: null,
SHARECODEINFO_FAILURE: null,
SET_UID: null,
});
... ...
'use strict';
import React, {Component} from 'react';
import ReactNative, {Platform, StyleSheet, View} from 'react-native'
import ReactNative, {Dimensions, NativeAppEventEmitter, Platform, StyleSheet, View} from 'react-native'
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {Map} from 'immutable';
import * as groupPurchaseActions from '../reducers/groupPurchase/groupPurchaseActions';
import GroupPurchase from '../components/GroupPurchase'
import GroupPurchase from '../components/GroupPurchase';
import ShareViewModal from '../components/ShareViewModal';
import ListSnapshootShare from '../components/ListSnapshootShare';
import {getSlicedUrl} from '../../classify/utils/Utils';
const actions = [
groupPurchaseActions,
];
let {width, height} = Dimensions.get('window');
const DEVICE_WIDTH_RATIO = width / 375;
function mapStateToProps(state) {
return {
... ... @@ -39,15 +44,28 @@ class GroupPurchaseContainer extends Component {
this._onEndReached = this._onEndReached.bind(this);
this._didTouchBanner = this._didTouchBanner.bind(this);
this._didTouchProduct = this._didTouchProduct.bind(this);
this.showShareView = this.showShareView.bind(this);
this.shareMiniApp = this.shareMiniApp.bind(this);
this.showSnapshootShare = this.showSnapshootShare.bind(this);
this.shareSnapshootAction = this.shareSnapshootAction.bind(this);
this.jumpToMinePurchaseOrder = this.jumpToMinePurchaseOrder.bind(this);
this.subscription = NativeAppEventEmitter.addListener(
'ShareCollageListEvent',
() => {
this.props.actions.showShareView(true);
}
);
}
componentDidMount() {
this.props.actions.getProductList();
this.props.actions.fetchResourceInfo();
async componentDidMount() {
let { actions } = this.props;
actions.getProductList();
actions.fetchResourceInfo();
}
componentWillUnmount() {
this.subscription && this.subscription.remove();
}
_onEndReached() {
... ... @@ -56,12 +74,12 @@ class GroupPurchaseContainer extends Component {
_didTouchBanner(url) {
let params = {
URL: url,
};
ReactNative.NativeModules.YH_CommonHelper.logEvent('YB_GROUP_LIST_BANNER_C', params);
let params = {
URL: url,
};
ReactNative.NativeModules.YH_CommonHelper.logEvent('YB_GROUP_LIST_BANNER_C', params);
ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url);
ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url);
}
_didTouchProduct(productSkn,activityId) {
... ... @@ -69,15 +87,88 @@ class GroupPurchaseContainer extends Component {
ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url);
}
shareSnapshootAction(shareType,url) {
let fromPage = 'GroupPurchaseDetail';
let param = {
shareType,
imageUrl: url,
fromPage,
}
ReactNative.NativeModules.YH_CommonHelper.shareImageToWXMini(param);
this.props.actions.showSnapshootShare(false);
}
showShareView(show){
this.props.actions.showShareView(show);
}
async shareMiniApp(){
let {
activityId,
resource,
shareCodeInfo,
} = this.props.groupPurchase;
if (!resource) {
return;
}
let miniProgramPath = '/pages/groupPurchase/groupPurchase?activity_id=' + activityId;
let fromPage = 'GroupPurchase';
let bigImage = shareCodeInfo.get('bigImage');
let productIcon = bigImage ? getSlicedUrl(bigImage,150*DEVICE_WIDTH_RATIO, 120*DEVICE_WIDTH_RATIO, 2) : '';
this.props.actions.showShareView(false);
let param = {
title: shareCodeInfo.get('title'),
image: productIcon,
shareUrl: '',
miniProgramPath,
fromPage,
}
ReactNative.NativeModules.YH_CommonHelper.shareWXMiniProgram(param);
}
showSnapshootShare(show){
this.props.actions.showShareView(false);
this.props.actions.showSnapshootShare(show);
}
jumpToMinePurchaseOrder() {
let url = 'http://m.yohobuy.com?openby:yohobuy={"action":"go.mineGroupPurchase"}';
ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url);
}
render() {
let {
activityId,
showShareView,
showSnapshootShare,
productList,
resource,
shareCodeInfo,
} = this.props.groupPurchase;
let {
host
} = this.props.app;
let param = {
activity_id: activityId,
}
let qrCode = host + '/wechat/miniapp/img-check.jpg?param=' + encodeURIComponent(JSON.stringify(param)) + '&miniQrType=15';
return (
<View style={styles.container}>
<ShareViewModal show={showShareView} showShareView={this.showShareView} shareMiniApp={this.shareMiniApp} showSnapshootShare={this.showSnapshootShare}/>
<ListSnapshootShare
show={showSnapshootShare}
shareCodeInfo={shareCodeInfo}
showSnapshootShare={this.showSnapshootShare}
shareSnapshootAction={this.shareSnapshootAction}
qrCode={qrCode}
/>
<GroupPurchase
jumpToMinePurchaseOrder={this.jumpToMinePurchaseOrder}
productList={productList}
resource={resource}
onEndReached={this._onEndReached}
... ...
... ... @@ -6,6 +6,7 @@ import ReactNative, {Platform, StyleSheet, View,Dimensions,} from 'react-native'
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {Map} from 'immutable';
import { setUnionType } from '../reducers/app/appActions';
import * as groupPurchaseDetailActions from '../reducers/groupPurchaseDetail/groupPurchaseDetailActions';
import GroupPurchaseDetail from '../components/GroupPurchaseDetail'
import ShareViewModal from '../components/ShareViewModal'
... ... @@ -14,6 +15,7 @@ import {getSlicedUrl} from '../../classify/utils/Utils';
const actions = [
groupPurchaseDetailActions,
{setUnionType},
];
... ... @@ -51,7 +53,7 @@ class GroupPurchaseDetailContainer extends Component {
}
componentDidMount() {
async componentDidMount() {
this.props.actions.getProductList();
this.props.actions.fetchActivityGroupDetail();
}
... ... @@ -69,10 +71,24 @@ class GroupPurchaseDetailContainer extends Component {
}
didTouchButton(resource){
let pageGo = resource.pageGo ? resource.pageGo : 0;
let { activityId } = this.props.groupPurchaseDetail;
let { activityId, groupNo, groupDetail } = this.props.groupPurchaseDetail;
if(pageGo == 1) {
this.props.actions.showShareView(true);
}else if (pageGo == 2) {
let membershipItems = groupDetail.get('membershipItems');
let productDetail = membershipItems.size > 0 ? membershipItems.get(0) : new Map();
let productSkn = productDetail.get('productSkn');
let productGroupPrice = productDetail.get('productGroupPrice');
let productName = productDetail.get('productName');
let params = {
activityId,
groupNo,
productSkn,
productGroupPrice,
productName,
fromPage: 'GroupPurchaseDetail'
};
ReactNative.NativeModules.YH_CommonHelper.showBuyPicker(params);
}else if (pageGo == 3) {
this.props.actions.showShareView(true);
}else if (pageGo == 4 || pageGo == 5 || pageGo == 7 || pageGo == 6) {
... ... @@ -82,13 +98,13 @@ class GroupPurchaseDetailContainer extends Component {
}
shareSnapshootAction(shareType,url) {
let fromPage = 'GroupPurchaseDetail';
let param = {
shareType,
imageUrl: url,
fromPage,
}
ReactNative.NativeModules.YH_CommonHelper.shareImageToWXMini(param);
this.props.actions.showSnapshootShare(false);
}
... ... @@ -107,12 +123,13 @@ class GroupPurchaseDetailContainer extends Component {
this.props.actions.showShareView(show);
}
shareMiniApp(){
async shareMiniApp(){
let {
activityId,
groupNo,
groupDetail,
} = this.props.groupPurchaseDetail;
let { unionType } = this.props.app;
let productDetail = groupDetail ? groupDetail.toJS():null;
if(!productDetail){
return;
... ... @@ -125,6 +142,7 @@ class GroupPurchaseDetailContainer extends Component {
}
let productIcon = resource.productIcon ? getSlicedUrl(resource.productIcon,150*DEVICE_WIDTH_RATIO, 120*DEVICE_WIDTH_RATIO, 2) : '';
let miniProgramPath = '/pages/groupPurchase/groupPurchaseResult?activity_id=' + activityId + '&group_no=' + groupNo;
unionType && (miniProgramPath += '&unionType=' + unionType);
let productGroupPrice = resource.productGroupPrice;
let productName = resource.productName;
let title = '【还差' + lackNum + '人】' + productGroupPrice + '拼' + productName;
... ... @@ -136,7 +154,7 @@ class GroupPurchaseDetailContainer extends Component {
image: productIcon,
shareUrl: '',
miniProgramPath,
fromPage,
fromPage,
}
ReactNative.NativeModules.YH_CommonHelper.shareWXMiniProgram(param);
}
... ... @@ -161,7 +179,8 @@ class GroupPurchaseDetailContainer extends Component {
} = this.props.groupPurchaseDetail;
let {
host
host,
unionType,
} = this.props.app;
let param = {
... ... @@ -173,9 +192,10 @@ class GroupPurchaseDetailContainer extends Component {
return (
<View style={styles.container}>
<ShareViewModal show={showShareView} showShareView={this.showShareView} shareMiniApp={this.shareMiniApp} showSnapshootShare={this.showSnapshootShare}/>
<ShareViewModal show={showShareView} unionType={unionType} showShareView={this.showShareView} shareMiniApp={this.shareMiniApp} showSnapshootShare={this.showSnapshootShare}/>
<SnapshootShare
show={showSnapshootShare}
unionType={unionType}
groupDetail={groupDetail}
showSnapshootShare={this.showSnapshootShare}
shareSnapshootAction={this.shareSnapshootAction}
... ...
... ... @@ -3,9 +3,43 @@
const {
SET_PLATFORM,
SET_HOST,
SET_SERVICE_HOST
SET_SERVICE_HOST,
SET_UNIONTYPE,
SET_UID
} = require('../../constants/actionTypes').default;
import { NativeModules } from 'react-native';
import { fetchShareCodeInfo } from '../groupPurchase/groupPurchaseActions';
export function getUid() {
return async dispatch => {
let uid = await NativeModules.YH_CommonHelper.uid();
dispatch(setUid(uid));
dispatch(fetchShareCodeInfo());
}
}
export function setUid(uid) {
return {
type: SET_UID,
payload: uid
};
}
export function getUnionType() {
return async dispatch => {
let unionType = await NativeModules.YH_CommonHelper.unionType();;
dispatch(setUnionType(unionType))
}
}
export function setUnionType(unionType) {
return {
type: SET_UNIONTYPE,
payload: unionType
};
}
export function setPlatform(platform) {
return {
type: SET_PLATFORM,
... ...
... ... @@ -6,6 +6,8 @@ let InitialState = Record({
platform: 'ios', // ios, android
host: 'http://api.yoho.cn',
serviceHost: 'http://api.yoho.cn',
unionType: '',
uid: '',
});
export default InitialState;
... ...
... ... @@ -6,6 +6,8 @@ const {
SET_PLATFORM,
SET_HOST,
SET_SERVICE_HOST,
SET_UNIONTYPE,
SET_UID,
} = require('../../constants/actionTypes').default;
const initialState = new InitialState;
... ... @@ -14,6 +16,10 @@ export default function appReducer(state = initialState, action) {
if (!(state instanceof InitialState)) return initialState.merge(state);
switch (action.type) {
case SET_UID:
return state.set('uid', action.payload);
case SET_UNIONTYPE:
return state.set('unionType', action.payload);
case SET_PLATFORM:
return state.set('platform', action.payload);
case SET_HOST:
... ...
... ... @@ -13,9 +13,28 @@ const {
RESOURCEINFO_REQUEST,
RESOURCEINFO_SUCCESS,
RESOURCEINFO_FAILURE,
SHOWSHARVIEW,
SHOWSNAPSHOOTSHARE,
FETCH_SHARE_CODE_INFO,
SHARECODEINFO_REQUEST,
SHARECODEINFO_SUCCESS,
SHARECODEINFO_FAILURE
} = require('../../constants/actionTypes').default;
export function showShareView(show) {
return {
type: SHOWSHARVIEW,
payload: show,
}
}
export function showSnapshootShare(show) {
return {
type: SHOWSNAPSHOOTSHARE,
payload: show,
}
}
export function setActivityId(activityId) {
return {
type: SET_ACTIVITY_ID,
... ... @@ -110,3 +129,38 @@ export function getProductList(reload=false) {
});
};
}
export function shareCodeInfoRequest() {
return {
type: SHARECODEINFO_REQUEST,
};
}
export function shareCodeInfoSuccess(json) {
return {
type: SHARECODEINFO_SUCCESS,
payload: json
}
}
export function shareCodeInfoFailure(error) {
return {
type: SHARECODEINFO_FAILURE,
payload: error
}
}
export function fetchShareCodeInfo() {
return (dispatch, getState) => {
let {app: {host, uid}} = getState();
dispatch(shareCodeInfoRequest());
let share_id = host.match('test') ? '1124' : '5409';//测试：1124，线上：5409
return new GroupPurchaseService(host).fetchShareCodeInfo({uid, share_id})
.then(json => {
dispatch(shareCodeInfoSuccess(json));
})
.catch(error => {
dispatch(shareCodeInfoFailure(error));
});
};
}
\ No newline at end of file
... ...
... ... @@ -4,6 +4,8 @@ import {List, Map, Record} from 'immutable';
let InitialState = Record({
activityId: 0,
showShareView: false,
showSnapshootShare: false,
productList: new (Record({
isFetching: false,
error: null,
... ... @@ -19,6 +21,15 @@ let InitialState = Record({
error: null,
data: null,
})),
shareCodeInfo: new (Record({
bigImage: "",
content: '',
message: '',
pic: "",
praise_num: null,
title: "",
url: ''
}))
});
export default InitialState;
... ...
... ... @@ -11,7 +11,9 @@ const {
RESOURCEINFO_REQUEST,
RESOURCEINFO_SUCCESS,
RESOURCEINFO_FAILURE,
SHOWSHARVIEW,
SHOWSNAPSHOOTSHARE,
SHARECODEINFO_SUCCESS,
} = require('../../constants/actionTypes').default;
const initialState = new InitialState;
... ... @@ -22,6 +24,15 @@ export default function couponReducer(state = initialState, action) {
}
switch (action.type) {
case SHARECODEINFO_SUCCESS: {
return state.set('shareCodeInfo', Immutable.fromJS(action.payload));
}
case SHOWSHARVIEW: {
return state.set('showShareView', action.payload);
}
case SHOWSNAPSHOOTSHARE: {
return state.set('showSnapshootShare', action.payload);
}
case SET_ACTIVITY_ID: {
return state.set('activityId', action.payload);
}
... ...
... ... @@ -68,4 +68,18 @@ export default class groupPurchaseService {
});
}
async fetchShareCodeInfo(params) {
return await this.api.get({
url: '/operations/api/v5/webshare/getShare',
body: {
...params
}
})
.then((json) => {
return json;
})
.catch((error) => {
throw(error);
});
}
}
... ...