1.增加个人中心点击客服弹出提示点确定打电话功能

2.获取购买参数信息并且赋值

pages/buy/buy.js

@@ -30,8 +30,42 @@ import Alipay from 'react-native-yunpeng-alipay';
 export default class Buy extends BasePage {
 	state = {
 		shopData: [
-			{ title: '1个月', originPrice: '199', price: '49' },
-			{ title: '12个月', originPrice: '499', price: '199' }
+			{
+				appCode: '1006',
+				days: 365,
+				gmtCreated: 1520843765000,
+				gmtModified: 1541127465000,
+				id: 10018,
+				title: '',
+				originalPrice: '499',
+				payType: 3,
+				price: '199',
+				sort: 1
+			},
+			{
+				appCode: '1006',
+				days: 92,
+				gmtCreated: 1520843761000,
+				gmtModified: 1534387968000,
+				id: 10017,
+				title: '',
+				originalPrice: '199',
+				payType: 2,
+				price: '99',
+				sort: 2
+			},
+			{
+				appCode: '1006',
+				days: 31,
+				gmtCreated: 1520843757000,
+				gmtModified: 1537953249000,
+				id: 10016,
+				title: '',
+				originalPrice: '99',
+				payType: 1,
+				price: '49',
+				sort: 3
+			}
 		],
 		currentTapindex: 0,
 		slideAnim: new Animated.Value(-150),
@@ -61,7 +95,7 @@ export default class Buy extends BasePage {
 					￥{item.price}元
 				</Text>
 				<Text style={this.state.currentTapindex === index ? styles.originPriceTap : styles.originPrice}>
-					原价:￥{item.originPrice}
+					原价:￥{item.originalPrice}
 				</Text>
 			</TouchableOpacity>
 		);
@@ -105,6 +139,15 @@ export default class Buy extends BasePage {
 		);
 	};
 	componentWillMount() {
+		//获取订购数据信息
+		PayUtil.getMember().then((result) => {
+			console.log('====================================');
+			console.log('result', result);
+			console.log('====================================');
+			this.setState({
+				shopData: result.data
+			});
+		});
 		BackHandler.addEventListener('hardwareBackPress', this.onBackAndroid);
 	}
 	componentWillUnmount() {

pages/services/PayUtil.js

@@ -1,8 +1,13 @@
 import APIConfig from './api.js';
 import efunRequest from '../utils/efunRequest';
 import request from '../utils/request';
+import commonUitl from '../utils/commonutil';
 
 export default class PayUtil {
+	static async getMember() {
+		return request(APIConfig.getMember() + '?appCode=' + commonUitl.getAppCode(), { method: 'GET' });
+	}
+
 	static async payByAli(opts) {
 		return request(APIConfig.getPayUrl() + '/aliPay/pay', opts);
 	}

pages/services/api.js

@@ -3,6 +3,7 @@ const url = {
 	schedule_url: 'http://ott80test-schedule.yifangjiaoyu.cn/mobile/schedule/',
 	user_url: 'http://ott80test-base.yifangjiaoyu.cn/mobile/user',
 	upload_img: 'http://ott80test-base.yifangjiaoyu.cn/file/upload',
+	getMember: 'http://ott80test-trade.yifangjiaoyu.cn/customer/order/member',
 	pay_url: 'http://ott80test-trade.yifangjiaoyu.cn/mobile/'
 };
 
@@ -24,4 +25,7 @@ export default class APIConfig {
 	static getPayUrl() {
 		return url.pay_url;
 	}
+	static getMember() {
+		return url.getMember;
+	}
 }

pages/userCenter.js

@@ -1,304 +1,289 @@
 /*
  * 个人中心页面
  */
-import React, { Component } from "react";
+import React, { Component } from 'react';
 import {
-  Platform,
-  StyleSheet,
-  Text,
-  View,
-  Image,
-  TouchableOpacity,
-  ImageBackground,
-  Button,
-  StatusBar,
-  Modal,
-  TouchableHighlight,
-  DeviceEventEmitter,
-  ScrollView
-} from "react-native";
-import BasePage from "./BasePage";
-import Dimensions from "./utils/dimensions";
-import ShopBox from "./components/ShopBox";
-import TopicTitle from "./components/TopicTitle";
-import ScrollRow from "./components/ScrollRow";
-import CourseTitle from "./components/CourseTitle";
-import user from "./services/user";
+	Platform,
+	StyleSheet,
+	Text,
+	View,
+	Image,
+	TouchableOpacity,
+	ImageBackground,
+	Button,
+	StatusBar,
+	Modal,
+	TouchableHighlight,
+	DeviceEventEmitter,
+	ScrollView
+} from 'react-native';
+import BasePage from './BasePage';
+import Dimensions from './utils/dimensions';
+import ShopBox from './components/ShopBox';
+import TopicTitle from './components/TopicTitle';
+import ScrollRow from './components/ScrollRow';
+import CourseTitle from './components/CourseTitle';
+import user from './services/user';
+import commonUtil from './utils/commonutil';
 
 export default class userCenter extends BasePage {
-  componentDidMount() {
-    //触发更新
-    this.refreshSubScription = DeviceEventEmitter.addListener('infoback', () => {
-      user.userMember().then(res => {
-        console.log("个人列表", res);
-        // 收藏
-        const favoritesList = res.data.favoritesList;
-        //观看记录
-        const playLogList = res.data.playLogList;
-        // 用户消息
-        const user = res.data.user;
-        // VIP
-        const vip = res.data.vip;
-        this.setState({
-            favoritesList,
-            playLogList,
-            user,
-            vip
-        });
-      });
-    })
-    DeviceEventEmitter.emit('infoback')
-  }
-  componentWillUnmount(){
-    this.refreshSubScription.remove();
-  }
-  state = {
-    nickName: "初始昵称",
-    user: {},
-    ifDiscount: true,
-    isVIP: false,
-    btnArr: [
-      {
-        title: "订单",
-        icon: require("./images/userCenter/order.png"),
-        goTo: "Order"
-      },
-      {
-        title: "抵用券",
-        icon: require("./images/userCenter/discount.png"),
-        goTo: "Ticket"
-      },
-      {
-        title: "客服",
-        icon: require("./images/userCenter/service.png"),
-        goTo: "Order"
-      }
-    ],
-    shopData: [
-      {
-        title: "1个月",
-        originPrice: "199",
-        price: "49",
-        background: require("./images/shopBox/left.png")
-      },
-      {
-        title: "12个月",
-        originPrice: "499",
-        price: "199",
-        background: require("./images/shopBox/right.png")
-      }
-    ],
-    discount: {
-      title: "限时秒杀",
-      icon: require("./images/shopBox/discount.png")
-    },
-    favoritesList: [],
-    playLogList: [],
-    vip: false
-  };
-  renderBtn = (item, index) => {
-    return (
-      <TouchableOpacity
-        key={index}
-        onPress={() => this.goTo(`${item.goTo}`)}
-        style={{ display: "flex", justifyContent: "space-between" }}
-      >
-        <View style={styles.btnItem}>
-          <Image source={item.icon} style={styles.btnIcon} />
-          <Text style={styles.btnTitle}>{item.title}</Text>
-        </View>
-      </TouchableOpacity>
-    );
-  };
-  goBack() {
-    //返回上一页
-    this.props.navigation.goBack();
-  }
-  render() {
-    return (
-      <ScrollView
-        style={{ height: 1100, overflow: "scroll", backgroundColor: "#fff" }}
-      >
-        <View style={styles.topSection}>
-          <ImageBackground
-            source={require("./images/userCenter/top-bg.png")}
-            style={{ width: "100%", height: 203 }}
-          >
-            <StatusBar
-              backgroundColor={"transparent"}
-              barStyle={"dark-content"}
-              // backgroundColor={"white"}
-              translucent={true}
-              hidden={false}
-            />
-            <View
-              style={{
-                height: 30,
-                // backgroundColor: "white"
-                marginTop: 20
-              }}
-            >
-              <CourseTitle
-                width={this.getWindowWidth()}
-                title="个人中心"
-                lefttype={2}
-                righttype={2}
-                textcolor={"#fff"}
-                backPress={() => this.goBack()}
-                // backgroundColor={"transparent"}
-                // rightPress={this.showSharedDialog.bind(this)}
-              />
-            </View>     
-            <View style={styles.userInfo}>
-              <TouchableOpacity onPress={() => this.goTo(`PersonalInfo`)}>
-                <Image
-                  style={styles.userAvatar}
-                  source={{ uri: this.state.user.avatar }}
-                />
-              </TouchableOpacity>
+	componentDidMount() {
+		//触发更新
+		this.refreshSubScription = DeviceEventEmitter.addListener('infoback', () => {
+			user.userMember().then((res) => {
+				console.log('个人列表', res);
+				// 收藏
+				const favoritesList = res.data.favoritesList;
+				//观看记录
+				const playLogList = res.data.playLogList;
+				// 用户消息
+				const user = res.data.user;
+				// VIP
+				const vip = res.data.vip;
+				this.setState({
+					favoritesList,
+					playLogList,
+					user,
+					vip
+				});
+			});
+		});
+		DeviceEventEmitter.emit('infoback');
+	}
+	componentWillUnmount() {
+		this.refreshSubScription.remove();
+	}
+	state = {
+		nickName: '初始昵称',
+		user: {},
+		ifDiscount: true,
+		isVIP: false,
+		btnArr: [
+			{
+				title: '订单',
+				icon: require('./images/userCenter/order.png'),
+				goTo: 'Order'
+			},
+			{
+				title: '抵用券',
+				icon: require('./images/userCenter/discount.png'),
+				goTo: 'Ticket'
+			},
+			{
+				title: '客服',
+				icon: require('./images/userCenter/service.png'),
+				goTo: 'Phone'
+			}
+		],
+		shopData: [
+			{
+				title: '1个月',
+				originPrice: '199',
+				price: '49',
+				background: require('./images/shopBox/left.png')
+			},
+			{
+				title: '12个月',
+				originPrice: '499',
+				price: '199',
+				background: require('./images/shopBox/right.png')
+			}
+		],
+		discount: {
+			title: '限时秒杀',
+			icon: require('./images/shopBox/discount.png')
+		},
+		favoritesList: [],
+		playLogList: [],
+		vip: false
+	};
+	renderBtn = (item, index) => {
+		return (
+			<TouchableOpacity
+				key={index}
+				onPress={() => this.goTo(`${item.goTo}`)}
+				style={{ display: 'flex', justifyContent: 'space-between' }}
+			>
+				<View style={styles.btnItem}>
+					<Image source={item.icon} style={styles.btnIcon} />
+					<Text style={styles.btnTitle}>{item.title}</Text>
+				</View>
+			</TouchableOpacity>
+		);
+	};
+	goBack() {
+		//返回上一页
+		this.props.navigation.goBack();
+	}
+	render() {
+		return (
+			<ScrollView style={{ height: 1100, overflow: 'scroll', backgroundColor: '#fff' }}>
+				<View style={styles.topSection}>
+					<ImageBackground
+						source={require('./images/userCenter/top-bg.png')}
+						style={{ width: '100%', height: 203 }}
+					>
+						<StatusBar
+							backgroundColor={'transparent'}
+							barStyle={'dark-content'}
+							// backgroundColor={"white"}
+							translucent={true}
+							hidden={false}
+						/>
+						<View
+							style={{
+								height: 30,
+								// backgroundColor: "white"
+								marginTop: 20
+							}}
+						>
+							<CourseTitle
+								width={this.getWindowWidth()}
+								title="个人中心"
+								lefttype={2}
+								righttype={2}
+								textcolor={'#fff'}
+								backPress={() => this.goBack()}
+								// backgroundColor={"transparent"}
+								// rightPress={this.showSharedDialog.bind(this)}
+							/>
+						</View>
+						<View style={styles.userInfo}>
+							<TouchableOpacity onPress={() => this.goTo(`PersonalInfo`)}>
+								<Image style={styles.userAvatar} source={{ uri: this.state.user.avatar }} />
+							</TouchableOpacity>
 
-              <View style={styles.userRight}>
-                <View style={styles.userName}>
-                  <Text style={styles.userNameText}>
-                    {this.state.user.nickName}
-                  </Text>
-                  {this.state.vip ? (
-                    <Image
-                      style={styles.vipTag}
-                      source={require("./images/common/vip.png")}
-                    />
-                  ) : null}
-                </View>
-                {this.state.vip ? null : (
-                  <View style={styles.userName}>
-                    <Text style={styles.vipSologan}>开通vip</Text>
-                  </View>
-                )}
-              </View>
-            </View>
-            <View style={styles.btnBoxWrapper}>
-              <View style={styles.btnBox}>
-                {this.state.btnArr.map((item, index) =>
-                  this.renderBtn(item, index)
-                )}
-              </View>
-            </View>
-          </ImageBackground>
-        </View>
-        <View style={styles.discountSection}>
-          <ShopBox
-            data={this.state.shopData}
-            discount={this.state.discount}
-            nav={this.props.navigation.navigate}
-          />
-        </View>
-        <View style={styles.recordSection}>
-          <TopicTitle title={"观看记录"} ifTubeShow={true} />
-          <ScrollRow
-            itemWidth={106}
-            itemHeight={153}
-            data={this.state.playLogList}
-          />
-        </View>
-        <View style={styles.collectSection}>
-          <TopicTitle title={"我的收藏"} ifTubeShow={true} />
-          <ScrollRow
-            itemWidth={106}
-            itemHeight={150}
-            data={this.state.favoritesList}
-          />
-        </View>
-      </ScrollView>
-    );
-  }
-  goTo(index) {
-    this.toNextPage(index);
-  }
+							<View style={styles.userRight}>
+								<View style={styles.userName}>
+									<Text style={styles.userNameText}>{this.state.user.nickName}</Text>
+									{this.state.vip ? (
+										<Image style={styles.vipTag} source={require('./images/common/vip.png')} />
+									) : null}
+								</View>
+								{this.state.vip ? null : (
+									<View style={styles.userName}>
+										<Text style={styles.vipSologan}>开通vip</Text>
+									</View>
+								)}
+							</View>
+						</View>
+						<View style={styles.btnBoxWrapper}>
+							<View style={styles.btnBox}>
+								{this.state.btnArr.map((item, index) => this.renderBtn(item, index))}
+							</View>
+						</View>
+					</ImageBackground>
+				</View>
+				<View style={styles.discountSection}>
+					<ShopBox
+						data={this.state.shopData}
+						discount={this.state.discount}
+						nav={this.props.navigation.navigate}
+					/>
+				</View>
+				<View style={styles.recordSection}>
+					<TopicTitle title={'观看记录'} ifTubeShow={true} />
+					<ScrollRow itemWidth={106} itemHeight={153} data={this.state.playLogList} />
+				</View>
+				<View style={styles.collectSection}>
+					<TopicTitle title={'我的收藏'} ifTubeShow={true} />
+					<ScrollRow itemWidth={106} itemHeight={150} data={this.state.favoritesList} />
+				</View>
+			</ScrollView>
+		);
+	}
+	goTo(index) {
+		if (index === 'Phone') {
+			commonUtil.callPhone('15810271473');
+		} else {
+			this.toNextPage(index);
+		}
+	}
 }
 
 const styles = StyleSheet.create({
-  topSection: {
-    height: 250,
-    width: Dimensions.width
-    // backgroundColor: 'red'
-  },
-  userInfo: {
-    width: Dimensions.width,
-    height: 70,
-    flexDirection: "row",
-    justifyContent: "flex-start",
-    alignItems: "center"
-  },
-  userAvatar: {
-    width: 67,
-    height: 67,
-    borderRadius: 55,
-    marginHorizontal: 12
-  },
-  userRight: {
-    flexDirection: "column"
-  },
-  userName: {
-    flexDirection: "row",
-    alignItems: "center"
-  },
-  userNameText: {
-    fontSize: 18,
-    color: "#fff",
-    fontWeight: "500",
-    marginRight: 9
-  },
-  vipSologan: {
-    fontSize: 14,
-    color: "#fff"
-  },
-  btnBoxWrapper: {
-    width: Dimensions.width,
-    alignItems: "center",
-    marginTop: 16
-  },
-  btnBox: {
-    width: (Dimensions.width * 343) / 375,
-    height: 100,
-    borderRadius: 10,
-    shadowColor: "#000",
-    // shadowOffset: 1,
-    shadowOpacity: 2,
-    shadowRadius: 5,
-    elevation: 4,
-    backgroundColor: "#fff",
-    justifyContent: "space-around",
-    flexDirection: "row"
-  },
-  btnItem: {
-    height: "100%",
-    flexDirection: "column",
-    justifyContent: "center",
-    alignItems: "center"
-  },
-  btnIcon: {
-    width: 36,
-    height: 24,
-    marginBottom: 7
-  },
-  btnTitle: {
-    color: "#3f3f3f",
-    fontSize: 16
-  },
-  discountSection: {
-    width: Dimensions.width
-    // height: 242,
-    // backgroundColor: 'green'
-  },
-  recordSection: {
-    width: Dimensions.width,
-    height: 235
-    // backgroundColor: 'blue'
-  },
-  collectSection: {
-    width: Dimensions.width,
-    height: 255,
-    marginBottom: 20
-    // backgroundColor: 'yellow'
-  }
+	topSection: {
+		height: 250,
+		width: Dimensions.width
+		// backgroundColor: 'red'
+	},
+	userInfo: {
+		width: Dimensions.width,
+		height: 70,
+		flexDirection: 'row',
+		justifyContent: 'flex-start',
+		alignItems: 'center'
+	},
+	userAvatar: {
+		width: 67,
+		height: 67,
+		borderRadius: 55,
+		marginHorizontal: 12
+	},
+	userRight: {
+		flexDirection: 'column'
+	},
+	userName: {
+		flexDirection: 'row',
+		alignItems: 'center'
+	},
+	userNameText: {
+		fontSize: 18,
+		color: '#fff',
+		fontWeight: '500',
+		marginRight: 9
+	},
+	vipSologan: {
+		fontSize: 14,
+		color: '#fff'
+	},
+	btnBoxWrapper: {
+		width: Dimensions.width,
+		alignItems: 'center',
+		marginTop: 16
+	},
+	btnBox: {
+		width: Dimensions.width * 343 / 375,
+		height: 100,
+		borderRadius: 10,
+		shadowColor: '#000',
+		// shadowOffset: 1,
+		shadowOpacity: 2,
+		shadowRadius: 5,
+		elevation: 4,
+		backgroundColor: '#fff',
+		justifyContent: 'space-around',
+		flexDirection: 'row'
+	},
+	btnItem: {
+		height: '100%',
+		flexDirection: 'column',
+		justifyContent: 'center',
+		alignItems: 'center'
+	},
+	btnIcon: {
+		width: 36,
+		height: 24,
+		marginBottom: 7
+	},
+	btnTitle: {
+		color: '#3f3f3f',
+		fontSize: 16
+	},
+	discountSection: {
+		width: Dimensions.width
+		// height: 242,
+		// backgroundColor: 'green'
+	},
+	recordSection: {
+		width: Dimensions.width,
+		height: 235
+		// backgroundColor: 'blue'
+	},
+	collectSection: {
+		width: Dimensions.width,
+		height: 255,
+		marginBottom: 20
+		// backgroundColor: 'yellow'
+	}
 });

pages/utils/commonutil.js

@@ -1,4 +1,11 @@
+import { Linking, Alert } from 'react-native';
+
 export default class commonutil {
+	//获取appCode
+	static getAppCode() {
+		return '1006';
+	}
+
 	//验证手机号
 	static isPoneAvailable(str) {
 		let myreg = /^[1][0-9]{10}$/;
@@ -44,4 +51,31 @@ export default class commonutil {
 	static jsonToMap(jsonStr) {
 		return this.objToStrMap(JSON.parse(jsonStr));
 	}
+
+	//调用打电话功能
+	static callPhone(phone) {
+		// let tel = '1008611'; // 目标电话
+		Alert.alert('提示', phone, [
+			{
+				text: '取消',
+				onPress: () => {
+					console.log('取消');
+				}
+			},
+			{
+				text: '确定',
+				onPress: () => {
+					Linking.canOpenURL('tel:' + phone)
+						.then((supported) => {
+							if (!supported) {
+								console.log('Can not handle tel:' + phone);
+							} else {
+								return Linking.openURL('tel:' + phone);
+							}
+						})
+						.catch((error) => console.log('tel error', error));
+				}
+			}
+		]);
+	}
 }