|
@@ -0,0 +1,310 @@
|
|
|
|
+import React, { Component } from "react"
|
|
|
|
+import { StyleSheet, View, Text, Image } from "react-native"
|
|
|
|
+import { unitWidth, unitHeight } from "../utils/AdapterUtil";
|
|
|
|
+import RNPickerSelect from 'react-native-picker-select';
|
|
|
|
+import AntDesign from "react-native-vector-icons/AntDesign"
|
|
|
|
+
|
|
|
|
+export default class MyInfo extends Component {
|
|
|
|
+ render() {
|
|
|
|
+ return (
|
|
|
|
+ <View style={styles.container}>
|
|
|
|
+ <View style={styles.titleTip}>
|
|
|
|
+ <AntDesign
|
|
|
|
+ name={"pay-circle1"}
|
|
|
|
+ size={20}
|
|
|
|
+ style={{ color: "#FA788A", marginRight: unitWidth * 12 }}
|
|
|
|
+ />
|
|
|
|
+ <Text style={{ color: "#FA788A", fontSize: unitWidth * 28 }}>完成10项资料后,你才会被系统推荐给他人</Text>
|
|
|
|
+ </View>
|
|
|
|
+ <View style={styles.formArea}>
|
|
|
|
+ <View style={styles.formItem}>
|
|
|
|
+ <RNPickerSelect
|
|
|
|
+ placeholder={""}
|
|
|
|
+ onValueChange={(value) => console.log(value)}
|
|
|
|
+ items={[
|
|
|
|
+ { label: 'Football', value: 'football' },
|
|
|
|
+ { label: 'Baseball', value: 'baseball' },
|
|
|
|
+ { label: 'Hockey', value: 'hockey' },
|
|
|
|
+ ]}
|
|
|
|
+ >
|
|
|
|
+ <View style={styles.itemArea}>
|
|
|
|
+ <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>头像</Text>
|
|
|
|
+ <View style={styles.itemRight}>
|
|
|
|
+ <Image
|
|
|
|
+ source={require("../../static/userPhone.png")}
|
|
|
|
+ style={styles.userIcon}
|
|
|
|
+ />
|
|
|
|
+ <AntDesign
|
|
|
|
+ name={"right"}
|
|
|
|
+ size={20}
|
|
|
|
+ style={{ color: "#999999", marginLeft: unitWidth * 22 }}
|
|
|
|
+ />
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ </View>
|
|
|
|
+ </RNPickerSelect>
|
|
|
|
+ </View>
|
|
|
|
+ <View style={styles.formItem}>
|
|
|
|
+ <RNPickerSelect
|
|
|
|
+ placeholder={""}
|
|
|
|
+ onValueChange={(value) => console.log(value)}
|
|
|
|
+ items={[
|
|
|
|
+ { label: 'Football', value: 'football' },
|
|
|
|
+ { label: 'Baseball', value: 'baseball' },
|
|
|
|
+ { label: 'Hockey', value: 'hockey' },
|
|
|
|
+ ]}
|
|
|
|
+ >
|
|
|
|
+ <View style={styles.itemArea}>
|
|
|
|
+ <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>姓名</Text>
|
|
|
|
+ <View style={styles.itemRight}>
|
|
|
|
+ <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>张晓明</Text>
|
|
|
|
+ <AntDesign
|
|
|
|
+ name={"right"}
|
|
|
|
+ size={20}
|
|
|
|
+ style={{ color: "#999999", marginLeft: unitWidth * 22 }}
|
|
|
|
+ />
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ </View>
|
|
|
|
+ </RNPickerSelect>
|
|
|
|
+ </View>
|
|
|
|
+ <View style={styles.formItem}>
|
|
|
|
+ <RNPickerSelect
|
|
|
|
+ placeholder={""}
|
|
|
|
+ onValueChange={(value) => console.log(value)}
|
|
|
|
+ items={[
|
|
|
|
+ { label: 'Football', value: 'football' },
|
|
|
|
+ { label: 'Baseball', value: 'baseball' },
|
|
|
|
+ { label: 'Hockey', value: 'hockey' },
|
|
|
|
+ ]}
|
|
|
|
+ >
|
|
|
|
+ <View style={styles.itemArea}>
|
|
|
|
+ <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>性别</Text>
|
|
|
|
+ <View style={styles.itemRight}>
|
|
|
|
+ <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>女</Text>
|
|
|
|
+ <AntDesign
|
|
|
|
+ name={"right"}
|
|
|
|
+ size={20}
|
|
|
|
+ style={{ color: "#999999", marginLeft: unitWidth * 22 }}
|
|
|
|
+ />
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ </View>
|
|
|
|
+ </RNPickerSelect>
|
|
|
|
+ </View>
|
|
|
|
+ <View style={styles.formItem}>
|
|
|
|
+ <RNPickerSelect
|
|
|
|
+ placeholder={""}
|
|
|
|
+ onValueChange={(value) => console.log(value)}
|
|
|
|
+ items={[
|
|
|
|
+ { label: 'Football', value: 'football' },
|
|
|
|
+ { label: 'Baseball', value: 'baseball' },
|
|
|
|
+ { label: 'Hockey', value: 'hockey' },
|
|
|
|
+ ]}
|
|
|
|
+ >
|
|
|
|
+ <View style={styles.itemArea}>
|
|
|
|
+ <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>出生日期</Text>
|
|
|
|
+ <View style={styles.itemRight}>
|
|
|
|
+ <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>1990-01-01</Text>
|
|
|
|
+ <AntDesign
|
|
|
|
+ name={"right"}
|
|
|
|
+ size={20}
|
|
|
|
+ style={{ color: "#999999", marginLeft: unitWidth * 22 }}
|
|
|
|
+ />
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ </View>
|
|
|
|
+ </RNPickerSelect>
|
|
|
|
+ </View>
|
|
|
|
+ <View style={styles.formItem}>
|
|
|
|
+ <RNPickerSelect
|
|
|
|
+ placeholder={""}
|
|
|
|
+ onValueChange={(value) => console.log(value)}
|
|
|
|
+ items={[
|
|
|
|
+ { label: 'Football', value: 'football' },
|
|
|
|
+ { label: 'Baseball', value: 'baseball' },
|
|
|
|
+ { label: 'Hockey', value: 'hockey' },
|
|
|
|
+ ]}
|
|
|
|
+ >
|
|
|
|
+ <View style={styles.itemArea}>
|
|
|
|
+ <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>居住地</Text>
|
|
|
|
+ <View style={styles.itemRight}>
|
|
|
|
+ <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>山东省烟台市莱山区</Text>
|
|
|
|
+ <AntDesign
|
|
|
|
+ name={"right"}
|
|
|
|
+ size={20}
|
|
|
|
+ style={{ color: "#999999", marginLeft: unitWidth * 22 }}
|
|
|
|
+ />
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ </View>
|
|
|
|
+ </RNPickerSelect>
|
|
|
|
+ </View>
|
|
|
|
+ <View style={styles.formItem}>
|
|
|
|
+ <RNPickerSelect
|
|
|
|
+ placeholder={""}
|
|
|
|
+ onValueChange={(value) => console.log(value)}
|
|
|
|
+ items={[
|
|
|
|
+ { label: 'Football', value: 'football' },
|
|
|
|
+ { label: 'Baseball', value: 'baseball' },
|
|
|
|
+ { label: 'Hockey', value: 'hockey' },
|
|
|
|
+ ]}
|
|
|
|
+ >
|
|
|
|
+ <View style={styles.itemArea}>
|
|
|
|
+ <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>身高</Text>
|
|
|
|
+ <View style={styles.itemRight}>
|
|
|
|
+ <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>170cm</Text>
|
|
|
|
+ <AntDesign
|
|
|
|
+ name={"right"}
|
|
|
|
+ size={20}
|
|
|
|
+ style={{ color: "#999999", marginLeft: unitWidth * 22 }}
|
|
|
|
+ />
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ </View>
|
|
|
|
+ </RNPickerSelect>
|
|
|
|
+ </View>
|
|
|
|
+ <View style={styles.formItem}>
|
|
|
|
+ <RNPickerSelect
|
|
|
|
+ placeholder={""}
|
|
|
|
+ onValueChange={(value) => console.log(value)}
|
|
|
|
+ items={[
|
|
|
|
+ { label: 'Football', value: 'football' },
|
|
|
|
+ { label: 'Baseball', value: 'baseball' },
|
|
|
|
+ { label: 'Hockey', value: 'hockey' },
|
|
|
|
+ ]}
|
|
|
|
+ >
|
|
|
|
+ <View style={styles.itemArea}>
|
|
|
|
+ <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>体重</Text>
|
|
|
|
+ <View style={styles.itemRight}>
|
|
|
|
+ <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>55kg</Text>
|
|
|
|
+ <AntDesign
|
|
|
|
+ name={"right"}
|
|
|
|
+ size={20}
|
|
|
|
+ style={{ color: "#999999", marginLeft: unitWidth * 22 }}
|
|
|
|
+ />
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ </View>
|
|
|
|
+ </RNPickerSelect>
|
|
|
|
+ </View>
|
|
|
|
+ <View style={styles.formItem}>
|
|
|
|
+ <RNPickerSelect
|
|
|
|
+ placeholder={""}
|
|
|
|
+ onValueChange={(value) => console.log(value)}
|
|
|
|
+ items={[
|
|
|
|
+ { label: 'Football', value: 'football' },
|
|
|
|
+ { label: 'Baseball', value: 'baseball' },
|
|
|
|
+ { label: 'Hockey', value: 'hockey' },
|
|
|
|
+ ]}
|
|
|
|
+ >
|
|
|
|
+ <View style={styles.itemArea}>
|
|
|
|
+ <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>行业</Text>
|
|
|
|
+ <View style={styles.itemRight}>
|
|
|
|
+ <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>互联网行业</Text>
|
|
|
|
+ <AntDesign
|
|
|
|
+ name={"right"}
|
|
|
|
+ size={20}
|
|
|
|
+ style={{ color: "#999999", marginLeft: unitWidth * 22 }}
|
|
|
|
+ />
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ </View>
|
|
|
|
+ </RNPickerSelect>
|
|
|
|
+ </View>
|
|
|
|
+ <View style={styles.formItem}>
|
|
|
|
+ <RNPickerSelect
|
|
|
|
+ placeholder={""}
|
|
|
|
+ onValueChange={(value) => console.log(value)}
|
|
|
|
+ items={[
|
|
|
|
+ { label: 'Football', value: 'football' },
|
|
|
|
+ { label: 'Baseball', value: 'baseball' },
|
|
|
|
+ { label: 'Hockey', value: 'hockey' },
|
|
|
|
+ ]}
|
|
|
|
+ >
|
|
|
|
+ <View style={styles.itemArea}>
|
|
|
|
+ <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>年收入</Text>
|
|
|
|
+ <View style={styles.itemRight}>
|
|
|
|
+ <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>15-20w</Text>
|
|
|
|
+ <AntDesign
|
|
|
|
+ name={"right"}
|
|
|
|
+ size={20}
|
|
|
|
+ style={{ color: "#999999", marginLeft: unitWidth * 22 }}
|
|
|
|
+ />
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ </View>
|
|
|
|
+ </RNPickerSelect>
|
|
|
|
+ </View>
|
|
|
|
+ <View style={styles.formItem}>
|
|
|
|
+ <RNPickerSelect
|
|
|
|
+ placeholder={""}
|
|
|
|
+ onValueChange={(value) => console.log(value)}
|
|
|
|
+ items={[
|
|
|
|
+ { label: 'Football', value: 'football' },
|
|
|
|
+ { label: 'Baseball', value: 'baseball' },
|
|
|
|
+ { label: 'Hockey', value: 'hockey' },
|
|
|
|
+ ]}
|
|
|
|
+ >
|
|
|
|
+ <View style={styles.itemArea}>
|
|
|
|
+ <Text style={{ fontSize: unitWidth * 28, color: "#333333" }}>兴趣爱好</Text>
|
|
|
|
+ <View style={styles.itemRight}>
|
|
|
|
+ <Text style={{ color: "#333333", marginLeft: unitWidth * 28 }}>it</Text>
|
|
|
|
+ <AntDesign
|
|
|
|
+ name={"right"}
|
|
|
|
+ size={20}
|
|
|
|
+ style={{ color: "#999999", marginLeft: unitWidth * 22 }}
|
|
|
|
+ />
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ </View>
|
|
|
|
+ </RNPickerSelect>
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ </View>
|
|
|
|
+ </View>
|
|
|
|
+ )
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+const styles = StyleSheet.create({
|
|
|
|
+ container: {
|
|
|
|
+ flex: 1,
|
|
|
|
+ alignItems: "center"
|
|
|
|
+ },
|
|
|
|
+ titleTip: {
|
|
|
|
+ width: "100%",
|
|
|
|
+ height: unitHeight * 84,
|
|
|
|
+ backgroundColor: "#FCF2F6",
|
|
|
|
+ flexDirection:"row",
|
|
|
|
+ alignItems:"center",
|
|
|
|
+ paddingLeft:unitWidth * 24,
|
|
|
|
+ },
|
|
|
|
+ formArea: {
|
|
|
|
+ width: "100%"
|
|
|
|
+ },
|
|
|
|
+ formItem: {
|
|
|
|
+ width: "100%",
|
|
|
|
+ height: unitHeight * 97,
|
|
|
|
+ backgroundColor: "#fff",
|
|
|
|
+ marginBottom: unitHeight * 6,
|
|
|
|
+ },
|
|
|
|
+ itemArea: {
|
|
|
|
+ width: "100%",
|
|
|
|
+ height: "100%",
|
|
|
|
+ flexDirection: "row",
|
|
|
|
+ justifyContent: "space-between",
|
|
|
|
+ alignItems: "center",
|
|
|
|
+ paddingLeft: unitWidth * 23,
|
|
|
|
+ paddingRight: unitWidth * 24,
|
|
|
|
+ borderBottomColor: "#F9F9F9",
|
|
|
|
+ borderBottomWidth: 1
|
|
|
|
+ },
|
|
|
|
+ itemRight: {
|
|
|
|
+ flexDirection: "row",
|
|
|
|
+ alignItems: "center"
|
|
|
|
+ },
|
|
|
|
+ userIcon: {
|
|
|
|
+ width: unitWidth * 66,
|
|
|
|
+ height: unitHeight * 66
|
|
|
|
+ }
|
|
|
|
+})
|