认证

js/navigator/AppNavigators.js

@@ -17,6 +17,7 @@ import Suggestion from "../page/Suggestion"
 import Setting from "../page/Setting"
 import MyInfo from "../page/MyInfo"
 import MyGift from "../page/MyGift"
+import Attestation from "../page/Attestation/Attestation"
 
 const InitNavigator = createStackNavigator({
     LoginPage: {
@@ -33,6 +34,12 @@ const InitNavigator = createStackNavigator({
     }
 })
 const MainNavigator = createStackNavigator({
+    Attestation: {
+        screen: Attestation,
+        navigationOptions: {
+            headerTitle: "认证"
+        }
+    },
     MyGift: {
         screen: MyGift,
         navigationOptions: {

js/page/Attestation/Attestation.js

@@ -0,0 +1,29 @@
+import React, { Component } from "react"
+import { StyleSheet, View } from "react-native"
+import Title from "./Title"
+import Icon from "./Icon"
+import Info from "./Info"
+
+export default class Attestation extends Component {
+
+    render() {
+        return (
+            <View style={styles.container}>
+                <Title
+                    tit="请上传您的行驶证内页图片"
+                    subTit="(您上传的照片资料仅作认证使用，并将被加密处理)"
+                />
+                <Icon
+                    text="请上传您的行驶证内页图片"
+                />
+                <Info />
+            </View>
+        )
+    }
+}
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        alignItems: "center"
+    }
+})

js/page/Attestation/Icon.js

@@ -0,0 +1,52 @@
+import React, { Component } from "react"
+import { StyleSheet, Text, View } from "react-native"
+import { unitWidth, unitHeight } from "../../utils/AdapterUtil";
+import AntDesign from "react-native-vector-icons/AntDesign"
+
+export default class Icon extends Component {
+
+    render() {
+        let { text } = this.props
+        return (
+            <View style={styles.iconArea}>
+                <View style={styles.iconItem}>
+                    <View style={styles.icon}>
+                        <AntDesign
+                            name={"camera"}
+                            size={45}
+                            style={{ color: "#fff" }}
+                        />
+                    </View>
+        <Text style={{ color: "#333333", fontSize: unitWidth * 24 }}>{text}</Text>
+                </View>
+            </View>
+        )
+    }
+}
+const styles = StyleSheet.create({
+    iconArea: {
+        width: "100%",
+        height: unitHeight * 280,
+        flexDirection: "row",
+        justifyContent: "space-around"
+    },
+    iconItem: {
+        width: unitWidth * 590,
+        height: unitHeight * 280,
+        borderStyle: "dashed",
+        borderWidth: 1,
+        borderColor:"#ccc",
+        alignItems: "center",
+        justifyContent: "space-between",
+        paddingTop: unitHeight * 57,
+        paddingBottom: unitHeight * 20,
+    },
+    icon: {
+        width: unitWidth * 118,
+        height: unitWidth * 118,
+        backgroundColor: "#FB7E90",
+        justifyContent: "center",
+        alignItems: "center",
+        borderRadius: unitWidth * 118
+    }
+})

js/page/Attestation/Info.js

@@ -0,0 +1,42 @@
+import React, { Component } from "react"
+import { StyleSheet, Text, View } from "react-native"
+import { unitWidth, unitHeight } from "../../utils/AdapterUtil";
+import AntDesign from "react-native-vector-icons/AntDesign"
+
+export default class Info extends Component {
+
+    render() {
+        // let { text } = this.props
+        return (
+            <View style={styles.infoArea}>
+                <View style={styles.infoTitle}>
+                    <AntDesign
+                        name={"exclamationcircleo"}
+                        size={15}
+                        style={{ color: "#FA788A" }}
+                    />
+                    <Text style={{ color: "#333333", fontSize: unitWidth * 28, marginLeft: unitWidth * 12 }}>证明材料拍摄技巧</Text>
+                </View>
+                <View style={styles.infoList}>
+                    <Text style={{ color: "#666666", fontSize: unitWidth * 28, marginBottom: unitWidth * 10 }}>1、请保证拍摄图片清晰可辨。</Text>
+                    <Text style={{ color: "#666666", fontSize: unitWidth * 28, marginBottom: unitWidth * 10 }}>2、证书内页的印章完整清晰，请勿遮挡。</Text>
+                </View>
+            </View>
+        )
+    }
+}
+const styles = StyleSheet.create({
+    infoArea: {
+        width: "100%",
+        marginTop:unitHeight * 40
+    },
+    infoTitle: {
+        flexDirection: "row",
+        paddingLeft: unitWidth * 24,
+        alignItems: "center"
+    },
+    infoList: {
+        marginTop: unitHeight * 10,
+        marginLeft: unitWidth * 64
+    }
+})

js/page/Attestation/Title.js

@@ -0,0 +1,33 @@
+import React, { Component } from "react"
+import { StyleSheet, Text, View } from "react-native"
+import { unitWidth, unitHeight } from "../../utils/AdapterUtil";
+
+export default class Attestation extends Component {
+
+    render() {
+        let { tit, subTit } = this.props
+        return (
+            <View style={styles.titArea}>
+                <Text style={styles.tit}>{tit}</Text>
+                <Text style={styles.subTit}>{subTit}</Text>
+            </View>
+        )
+    }
+}
+const styles = StyleSheet.create({
+    titArea: {
+        width: "100%",
+        paddingTop: unitHeight * 30,
+        paddingBottom: unitHeight * 40,
+        paddingLeft: unitWidth * 26
+    },
+    tit: {
+        fontSize: unitWidth * 28,
+        color: "#333333",
+        marginBottom: unitHeight * 23
+    },
+    subTit: {
+        fontSize: unitWidth * 24,
+        color: "#FA788A",
+    }
+})

js/page/SendGift.js

@@ -2,7 +2,7 @@ import React, { Component } from "react"
 import { StyleSheet, Text, View, Image } from "react-native"
 import { unitWidth, unitHeight } from "../utils/AdapterUtil";
 
-export default class GetGift extends Component {
+export default class SendGift extends Component {
 
 	render() {
 		return (