Phone_Check.js 3.53 KB
import React, { Component } from 'react';
import { View, Text, StyleSheet,TouchableOpacity } from 'react-native';
import CheckBox from '@react-native-community/checkbox'
import { TextInput } from 'react-native-gesture-handler';
import {post} from 'axios'
import { SERVER } from '../../common/servername';
export default class AddTab extends Component {
    
    static navigationOptions = {
        
        headerShown: false
        
    }
    state= {
        all:false,
        SNS:false,
        private_info:false,
        profile_info:false,
        phone_num:""
    }
    constructor(props) {
        super(props)

    }
    componentDidMount() {

    }
    onHandlecheckBox= (type) => {
        if(type == "SNS") {
            if(this.state.SNS == true) {
                this.setState({
                    SNS:false,
                    all:false,
                })
            }
            else {
                this.setState({
                    SNS:true
                })
            }
        }
        else if(type == "private_info") {
            if(this.state.private_info == true) {
                this.setState({
                    private_info:false,
                    all:false,
                })
            }
            else {
                this.setState({
                    private_info:true
                })
            }
        }
        else if(type == "profile_info") {
            if(this.state.profile_info == true) {
                this.setState({
                    profile_info:false,
                    all:false,
                })
            }
            else {
                this.setState({
                    profile_info:true
                })
            }
        }
    }

    HandlePhoneNum = (e) => {
        this.setState({
            phone_num:e
        })
    }
    HandleNavigate = () => {
        
        
        var re = /^\d{3}-\d{3,4}-\d{4}$/;
        
        var result = re.test(`${this.state.phone_num}`)
        re = /^\d{3}\d{3,4}\d{4}$/;
        
        var result_ = re.test(`${this.state.phone_num}`)
        if(result || result_) {
            post(`http://${SERVER}/auth/phone`,{phone_number:this.state.phone_num}).then(res => {
                console.log(res.data)
                if(res.data.success) {
                    this.props.navigation.navigate("PhoneCheck_Cert",{phone_num:this.state.phone_num,data:res.data.data})
                }
            })
        }
        else {
            alert('전화번호를 정확히 입력해주세요.')
        }
    }
    render() {
        return (
            <View style={{width:"100%",height:"100%",paddingLeft:"10%",paddingRight:"10%",paddingTop:"10%"}}>
                <View>
                    <Text style={{color:"#615F5F",fontsize:15}}>
                        본인 휴대전화번호를 입력해주세요.
                    </Text>
                </View>
                <TextInput value={this.state.phone_num} onChangeText={(e) => this.HandlePhoneNum(e)} keyboardType="number-pad" placeholder="010 - 1234 - 5678" style={{textAlign:"center",fontSize:15,borderColor:"#FFD63A",borderWidth:1,paddingTop:9,paddingBottom:9,marginTop:16,marginBottom:16}}/>
                <TouchableOpacity onPress={() => this.HandleNavigate()} style={{backgroundColor:"#FFD63A",paddingTop:21,paddingBottom:19}}>
                    <Text style={{textAlign:"center"}}>
                        인증번호 요청
                    </Text>
                </TouchableOpacity>
            </View>
        );
    }
}
 
const style = StyleSheet.create({
    container: {
    }
});