import React, { Component } from "react"
import { StyleSheet, View } from "react-native"
import { unitWidth, unitHeight } from "../../utils/AdapterUtil";
import MyButtom from '../../component/MyButton'
import Title from "./Title"
import Icon from "./Icon"
import Info from "./Info"
import Select from "./Select"
import IdSelect from "./IdSelect"
import IdIcon from "./IdIcon"

export default class Attestation extends Component {
    state = {
        pageStatus: 2
    }
    render() {
        return (
            <View style={styles.container}>
                {
                    this.state.pageStatus === 1 ? (<Select />) : null
                }
                <Title
                    tit="完成身份验证，信用值+10"
                    subTit=""
                />
                {
                    this.state.pageStatus === 2 ? (<IdSelect />) : null
                }
                {
                    this.state.pageStatus === 1 ? (<Icon
                        text="请上传您的行驶证内页图片"
                        IconList={["点击上传个人名片", "点击上传个人工牌", "点击上传在职证明"]}
                    />) : null
                }
                {
                    this.state.pageStatus === 2 ? (<IdIcon
                        IconList={["点击上传人像面", "点击上传国徽面"]}
                    />) : null
                }
                <Info
                    infoList={["1.请保证拍摄图片清晰可辨，证书中的印章完整清晰。", "2.证书中的证书编号、院校名称、学历类别、姓名等信息须完整清晰，请勿遮挡。"]}
                />
                <View style={styles.bottomBtn}>
                    <MyButtom
                        text={"提交认证"}
                        width={unitWidth * 502}
                        height={unitHeight * 84}
                        borderRadius={unitHeight * 84}
                        bgColor="#FA788A"
                        shadowBgc="rgba(250,120,138,1)"
                        style={{ fontSize: unitWidth * 32 }}
                    />
                </View>
            </View>
        )
    }
}
const styles = StyleSheet.create({
    container: {
        flex: 1,
        alignItems: "center",
        backgroundColor: "#fff"
    },
    bottomBtn: {
        width: "100%",
        height: unitHeight * 84,
        justifyContent: 'center',
        alignItems: 'center',
        position: "absolute",
        bottom: unitHeight * 138
    }
})