mobile / YH_RNComponent · Commits

Go to a project

Authored by 张文文
Commit d827c9e68f44a5c919e06da0126d6410ea209fd8 1 parent 63d87493

拼团详情分享微信快照

Inline Side-by-side
Showing 3 changed files with 4 additions and 176 deletions
'use strict';
import React from 'react';
import ReactNative from 'react-native';
const {
AppRegistry,
StyleSheet,
Image,
View,
Dimensions,
TouchableOpacity,
Modal,
Text,
TouchableWithoutFeedback,
} = ReactNative;
export default class DetailShareViewModal extends React.Component {
constructor(props) {
super(props);
}
render() {
let { unionType } = this.props;
return (
<Modal
visible={this.props.show}
animationType={'none'}
transparent={true}
onRequestClose={() => {
}}>
<View style={styles.modalContainer}>
<TouchableWithoutFeedback onPress={() => {
this.props.showShareView && this.props.showShareView(false);
}}>
<View style={styles.topView}/>
</TouchableWithoutFeedback>
<View style={styles.shareView}>
<View style={styles.buttons}>
<TouchableOpacity activeOpacity={0.5} style={styles.button1} onPress={() => {
this.props.shareMiniApp && this.props.shareMiniApp();
}}>
<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.shareWXTimeLine && this.props.shareWXTimeLine();
}}>
<Image source={unionType ? require('../images/unionShare_timeline_icon.png') : require('../images/pengyou.png')} style={styles.icon} />
<Text style={styles.text}>微信朋友圈</Text>
</TouchableOpacity>
</View>
<View style={styles.line}/>
<TouchableOpacity activeOpacity={0.5} style={styles.cancel} onPress={() => {
this.props.showShareView && this.props.showShareView(false);
}}>
<Text style={styles.canceltext}>取消</Text>
</TouchableOpacity>
</View>
</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,
backgroundColor: 'rgba(0, 0, 0, 0.6)',
},
topView: {
flex: 1,
},
shareView: {
width,
height: 171*DEVICE_WIDTH_RATIO,
backgroundColor: 'white',
alignItems: 'center',
},
image :{
width: 305*DEVICE_WIDTH_RATIO,
height: 88*DEVICE_WIDTH_RATIO,
marginTop: 25*DEVICE_WIDTH_RATIO,
},
buttons: {
width,
height: 115*DEVICE_WIDTH_RATIO,
alignItems: 'center',
flexDirection: 'row',
},
button1: {
marginLeft: (width - 180*DEVICE_WIDTH_RATIO)/3,
alignItems: 'center',
},
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,
color: '#444444',
width: 90*DEVICE_WIDTH_RATIO,
textAlign: 'center',
},
line: {
width: width - 52,
height: 1,
backgroundColor: '#CCCCCC',
},
cancel: {
width,
height: 54*DEVICE_WIDTH_RATIO,
justifyContent: 'center',
alignItems: 'center',
},
canceltext: {
fontSize: 17,
color: '#444444',
},
});
... ... @@ -59,8 +59,8 @@ export default class GroupPurchaseDetail extends Component {
let src = YH_Image.getSlicedUrl(item.src, imageWidth, imageHeight, 2);
return(
<View style={{width:width, height:121*DEVICE_WIDTH_RATIO+8, backgroundColor:'#f0f0f0'}}>
<View style={{width:width, height:121*DEVICE_WIDTH_RATIO}}>
<View style={{width:width, height:70*DEVICE_WIDTH_RATIO+8, backgroundColor:'#f0f0f0'}}>
<View style={{width:width, height:70*DEVICE_WIDTH_RATIO}}>
<TouchableOpacity activeOpacity={1} onPress={() => {
this.props.didTouchBanner && this.props.didTouchBanner(item.url);
}}>
... ...
... ... @@ -9,7 +9,7 @@ import {Map} from 'immutable';
import { setUnionType } from '../reducers/app/appActions';
import * as groupPurchaseDetailActions from '../reducers/groupPurchaseDetail/groupPurchaseDetailActions';
import GroupPurchaseDetail from '../components/GroupPurchaseDetail'
import DetailShareViewModal from '../components/DetailShareViewModal'
import ShareViewModal from '../components/ShareViewModal'
import SnapshootShare from '../components/SnapshootShare'
import {getSlicedUrl} from '../../classify/utils/Utils';
... ... @@ -49,7 +49,6 @@ class GroupPurchaseDetailContainer extends Component {
this.didTouchButton = this.didTouchButton.bind(this);
this.showShareView = this.showShareView.bind(this);
this.shareMiniApp = this.shareMiniApp.bind(this);
this.shareWXTimeLine = this.shareWXTimeLine.bind(this);
this.showSnapshootShare = this.showSnapshootShare.bind(this);
this.shareSnapshootAction = this.shareSnapshootAction.bind(this);
... ... @@ -185,44 +184,6 @@ class GroupPurchaseDetailContainer extends Component {
ReactNative.NativeModules.YH_CommonHelper.shareWXMiniProgram(param);
}
async shareWXTimeLine(){
let {
activityId,
groupNo,
groupDetail,
} = this.props.groupPurchaseDetail;
let { unionType } = this.props.app;
let productDetail = groupDetail ? groupDetail.toJS():null;
if(!productDetail){
return;
}
let membershipItems = productDetail.membershipItems;
let resource = membershipItems ? membershipItems[0]: null;
let lackNum = productDetail ? productDetail.lackNum : 0;
if (!resource) {
return;
}
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;
let fromPage = 'GroupPurchaseDetail';
this.props.actions.showShareView(false);
let businessId = 'collage';
let param = {
title: title,
image: productIcon,
shareUrl: '', //缺少分享到H5的url
miniProgramPath,
fromPage,
businessId
}
ReactNative.NativeModules.YH_CommonHelper.shareWXTimeLine(param);
}
showSnapshootShare(show){
this.props.actions.showShareView(false);
this.props.actions.showSnapshootShare(show);
... ... @@ -257,7 +218,7 @@ class GroupPurchaseDetailContainer extends Component {
return (
<View style={styles.container}>
<DetailShareViewModal show={showShareView} unionType={unionType} showShareView={this.showShareView} shareMiniApp={this.shareMiniApp} shareWXTimeLine={this.shareWXTimeLine}/>
<ShareViewModal show={showShareView} unionType={unionType} showShareView={this.showShareView} shareMiniApp={this.shareMiniApp} showSnapshootShare={this.showSnapshootShare}/>
<SnapshootShare
show={showSnapshootShare}
unionType={unionType}
... ...