203 lines
7.8 KiB
JavaScript
203 lines
7.8 KiB
JavaScript
import * as React from 'react';
|
|
import { useState, useEffect } from 'react';
|
|
import { connect } from "react-redux";
|
|
import { SafeAreaView, ScrollView, TouchableOpacity, Button, View, Text, Linking } from 'react-native';
|
|
import {useNetInfo} from "@react-native-community/netinfo";
|
|
import NetInfo from "../../components/netstatus";
|
|
// import NetInfo from "@react-native-community/netinfo"
|
|
import CustomHeader from '../../components/header.js';
|
|
import Assets from '../../components/assets.manager.js';
|
|
import Theme from '../../components/theme.style.js';
|
|
import Elements from '../../components/elements.js';
|
|
import REQUEST from '../../components/api/';
|
|
import { ContactOptions, ContactOptionsWithParams } from '../../components/contact.action';
|
|
import DB, { session } from '../../components/storage/index';
|
|
import CustomSafeArea from '../../components/safeArea.component';
|
|
|
|
|
|
class LoginSendOTP extends React.PureComponent {
|
|
|
|
constructor(props) {
|
|
super(props)
|
|
}
|
|
|
|
state = {
|
|
loading: false,
|
|
data: {},
|
|
contact: {},
|
|
contactselect: false
|
|
}
|
|
|
|
componentDidMount() {
|
|
this.init()
|
|
}
|
|
|
|
componentWillUnmount() {
|
|
|
|
}
|
|
|
|
init = async () => {
|
|
this.setState({ data: this.props.route.params })
|
|
await DB.remove("is_guest")
|
|
}
|
|
|
|
onSaveSession = async () => {
|
|
console.log(this.state.data)
|
|
this.props.navigation.navigate("LoginOTP", this.state.data)
|
|
}
|
|
|
|
onSend = () => {
|
|
NetInfo.netstatus(isConnected => {
|
|
if(isConnected) {
|
|
this.setState({ loading: true })
|
|
this.requestOtp(success => {
|
|
if(success.status == 1){
|
|
this.setState({ loading: false })
|
|
this.onSaveSession()
|
|
}else{
|
|
this.setState({ loading: false })
|
|
}
|
|
}, error => {})
|
|
} else {
|
|
Elements.nointernet2()
|
|
}
|
|
})
|
|
}
|
|
|
|
requestOtp = async (successCallback, errorCallback) => {
|
|
let params = `lcard_uuid=${this.state.data.lcard_uuid}&mobile=${Theme.formatter.PMBL(this.state.data.mobile_number)}&is_resend=false`;
|
|
await REQUEST("requestOTP", "get", {}, params, {},
|
|
function(res){
|
|
console.log(res)
|
|
successCallback(res)
|
|
}, function(error){
|
|
console.log(res)
|
|
errorCallback(error)
|
|
})
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<CustomSafeArea>
|
|
<Elements.loaderView
|
|
title="Validating"
|
|
message="Please wait..."
|
|
isDarkMode={this.props.app_theme?.theme.dark}
|
|
backgroundColor={this.props.app_theme?.theme.colors.border}
|
|
color={this.props.app_theme?.theme.colors.text}
|
|
visible={this.state.loading} />
|
|
<CustomHeader title="" menu={false} back={true} onBackPress={() => this.props.navigation.goBack()} navigation={this.props.navigation} />
|
|
<View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
|
|
<Text style={{padding: 15, fontSize: 22, color: this.props.app_theme?.theme.dark ? this.props.app_theme?.theme.colors.text : Theme.colors.textPrimary, fontWeight: 'bold'}}>Please Confirm</Text>
|
|
<Text style={{padding: 5, fontSize: 16, color: this.props.app_theme?.theme.dark ? this.props.app_theme?.theme.colors.text : Theme.colors.textPrimary, width: '85%', textAlign: 'center'}}>We will send you a One Time Passcode to</Text>
|
|
<Text style={{padding: 15, fontSize: 15, color: Theme.colors.accent, width: '85%', textAlign: 'center'}}>{Theme.formatter.ENCMBL(this.state.data.mobile_number || "+639000000000")}</Text>
|
|
<TouchableOpacity onPress={() => this.onSend()} style={{backgroundColor: Theme.colors.primary, padding: 15, width: '80%', borderRadius: 10, elevation: 3}}>
|
|
<Text style={{textAlign: 'center', color: "#fff", fontSize: 16}}>Send me the code</Text>
|
|
</TouchableOpacity>
|
|
<View style={{flexDirection: 'row', width: '80%', padding: 15}}>
|
|
<Text style={{flex: 4, textAlign: 'right', color: this.props.app_theme?.theme.colors.text}}>Not your mobile number? </Text>
|
|
<TouchableOpacity onPress={() => ContactOptionsWithParams({ cardnumber: this.state.data.cardnumber })} style={{flex: 2}}>
|
|
<Text style={{textAlign: 'center', color: Theme.colors.primary}}>Contact Us</Text>
|
|
</TouchableOpacity>
|
|
</View>
|
|
</View>
|
|
</CustomSafeArea>
|
|
)
|
|
}
|
|
}
|
|
|
|
const mapStateToProps = (state) => {
|
|
return {
|
|
app_theme: state.appThemeReducer.theme
|
|
}
|
|
}
|
|
|
|
export default connect(mapStateToProps, null)(LoginSendOTP)
|
|
|
|
|
|
// export default function LoginSendOTP(navigation) {
|
|
|
|
// const [loading, setloading] = useState(false)
|
|
// const [data, setdata] = useState({})
|
|
// const [contact, setcontact] = useState({})
|
|
// const [contactselect, setcontactselect] = useState(false)
|
|
|
|
// const init = async () => {
|
|
// console.log(navigation.route?.params)
|
|
// await setdata(navigation.route?.params)
|
|
// let session = await DB.session()
|
|
// console.log("SESSION", session)
|
|
// }
|
|
|
|
// useEffect(() => {
|
|
// init()
|
|
// }, [])
|
|
|
|
// const onSend = async () => {
|
|
// setloading(true)
|
|
// let params = `lcard_uuid=${data.lcard_uuid}&mobile=${Theme.formatter.PMBL(data.mobile_number)}&is_resend=false`;
|
|
// console.log(params)
|
|
// await REQUEST("requestOTP", "get", {}, params, {},
|
|
// function(res){
|
|
// console.log(res)
|
|
// if(res.status == 1){
|
|
// setloading(false)
|
|
// navigation.navigation.navigate("LoginOTP", data)
|
|
// }else{
|
|
// setloading(false)
|
|
// alert(res.data)
|
|
// }
|
|
// console.log("RESPONSE: " , res)
|
|
// }, function(error){
|
|
// setloading(false)
|
|
// console.log(error)
|
|
// })
|
|
// }
|
|
|
|
// const loadContactInfo = async () => {
|
|
// await REQUEST("contact_us", "get", {}, {}, {},
|
|
// async (res) => {
|
|
// if(res.status == 1 && res.data){
|
|
// await setcontact(res.data)
|
|
// setcontactselect(true)
|
|
// console.log("COntact Details", contact)
|
|
// }else{
|
|
// console.log(res.message, res.data)
|
|
// }
|
|
// }, function(error){
|
|
// console.log(error)
|
|
// })
|
|
// }
|
|
|
|
// return (
|
|
// <SafeAreaView style={{flex: 1}}>
|
|
// <Elements.loader visible={loading} />
|
|
|
|
// <CustomHeader title="" menu={false} back={true} backscreen="Login" navigation={navigation} />
|
|
// <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
|
|
// <Text style={{padding: 15, fontSize: 22, color: Theme.colors.textPrimary, fontWeight: 'bold'}}>Please Confirm</Text>
|
|
// <Text style={{padding: 5, fontSize: 16, color: Theme.colors.textPrimary, width: '85%', textAlign: 'center'}}>We will send you a One Time Passcode to</Text>
|
|
// <Text style={{padding: 15, fontSize: 15, color: Theme.colors.accent, width: '85%', textAlign: 'center'}}>{Theme.formatter.ENCMBL(data.mobile_number || "+639000000000")}</Text>
|
|
// <TouchableOpacity onPress={() => {
|
|
// NetInfo.fetch().then(state => {
|
|
// console.log("Connection type", state.type);
|
|
// console.log("Is connected?", state.isConnected);
|
|
// if(state.isConnected){
|
|
// onSend()
|
|
// }else{
|
|
// Elements.nointernet2()
|
|
// }
|
|
// })
|
|
// }} style={{backgroundColor: Theme.colors.primary, padding: 15, width: '80%', borderRadius: 10, elevation: 3}}>
|
|
// <Text style={{textAlign: 'center', color: "#fff", fontSize: 16}}>Send me the code</Text>
|
|
// </TouchableOpacity>
|
|
// <View style={{flexDirection: 'row', width: '80%', padding: 15}}>
|
|
// <Text style={{flex: 4, textAlign: 'right'}}>Not your mobile number? </Text>
|
|
// <TouchableOpacity onPress={() => ContactOptions()} style={{flex: 2}}>
|
|
// <Text style={{textAlign: 'center', color: Theme.colors.primary}}>Contact Us</Text>
|
|
// </TouchableOpacity>
|
|
// </View>
|
|
// </View>
|
|
// </SafeAreaView>
|
|
// );
|
|
// }
|