866 lines
32 KiB
JavaScript
866 lines
32 KiB
JavaScript
import React, {Component} from 'react';
|
|
import {
|
|
|
|
StyleSheet,
|
|
Text,
|
|
View,
|
|
Image,
|
|
Animated,
|
|
BackHandler,
|
|
TouchableOpacity,
|
|
PermissionsAndroid,
|
|
Platform,
|
|
ProgressBarAndroid,
|
|
ScrollView,
|
|
Alert,
|
|
StatusBar,
|
|
AsyncStorage
|
|
} from 'react-native';
|
|
import PropTypes from 'prop-types';
|
|
import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome';
|
|
import {responsiveHeight, responsiveWidth, responsiveFontSize} from 'react-native-responsive-dimensions';
|
|
import {Sae} from 'react-native-textinput-effects';
|
|
import Button from 'apsl-react-native-button';
|
|
|
|
let theme = require('./../../../utils/theme.json');
|
|
import {login, saveNewuser, getCountryNetwork, getAppVersion} from './../../../webservice/AuthApi';
|
|
import * as Animatable from 'react-native-animatable';
|
|
import isEqual from 'lodash/isEqual'
|
|
//import {getOpenCagePositionInformation} from './../../../webservice/MapService'
|
|
import SwitchSelector from 'react-native-switch-selector'
|
|
import I18n from 'react-native-i18n'
|
|
|
|
let route = require('./../../../route.json');
|
|
require('./../../../utils/Translations')
|
|
//let country = require('./../../../utils/country_code.json');
|
|
import {IlinkEmitter} from './../../../utils/events'
|
|
import {readUser} from "../../../webservice/AuthApi";
|
|
//import {MaterialDialog} from "react-native-material-dialog"
|
|
import Spinner from "react-native-loading-spinner-overlay";
|
|
import Geolocation from "react-native-geolocation-service";
|
|
import {iso1A2Code, callingCodes, emojiFlag, feature} from '@ideditor/country-coder';
|
|
//import {opencageDataApiKey} from "../../../webservice/IlinkConstants";
|
|
|
|
const GEOLOCATION_OPTIONS = {enableHighAccuracy: true, timeout: 20000}
|
|
const propTypes = {
|
|
coordinate: PropTypes.shape({
|
|
latitude: PropTypes.number.isRequired,
|
|
longitude: PropTypes.number.isRequired,
|
|
}),
|
|
children: PropTypes.node,
|
|
geolocationOptions: PropTypes.shape({
|
|
enableHighAccuracy: PropTypes.bool,
|
|
timeout: PropTypes.number,
|
|
maximumAge: PropTypes.number,
|
|
}),
|
|
heading: PropTypes.number,
|
|
enableHack: PropTypes.bool,
|
|
};
|
|
const widthButton = responsiveWidth(80) > 350 ? 350 : responsiveWidth(80);
|
|
|
|
export class LoginUi extends Component {
|
|
|
|
handlePhoneRef = ref => this.phoneRef = ref;
|
|
handlePasswordRef = ref => this.passRef = ref;
|
|
static defaultProps = {
|
|
enableHack: false,
|
|
geolocationOptions: null,
|
|
};
|
|
|
|
async requestCameraPermission() {
|
|
if (Platform.OS === "android") {
|
|
try {
|
|
const granted = await PermissionsAndroid.request(
|
|
PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
|
|
{
|
|
'title': 'Cool Photo App Camera Permission',
|
|
'message': 'Cool Photo App needs access to your camera ' +
|
|
'so you can take awesome pictures.'
|
|
}
|
|
)
|
|
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
|
|
this.watchLocation()
|
|
} else {
|
|
this.setState({loadingDialog: false})
|
|
Alert.alert(I18n.t("TITLE_UNABLE_TO_AUTORISE"),
|
|
I18n.t("MISSING_AUTORISATION_LOCATION"),
|
|
[{
|
|
text: I18n.t("RESTART"), onPress: () => {
|
|
this.requestCameraPermission()
|
|
}
|
|
}, {
|
|
text: I18n.t("QUIT_"), onPress: () => {
|
|
BackHandler.exitApp()
|
|
}
|
|
}],
|
|
{cancelable: false}
|
|
)
|
|
}
|
|
} catch (err) {
|
|
console.warn(err)
|
|
this.setState({loadingDialog: false})
|
|
Alert.alert(I18n.t("TITLE_ERROR_SURVENU"),
|
|
I18n.t("TEXT_ERROR_START_APPLICATION"),
|
|
[{
|
|
text: I18n.t("RESTART"), onPress: () => {
|
|
this.requestCameraPermission()
|
|
}
|
|
}, {
|
|
text: I18n.t("QUIT_"), onPress: () => {
|
|
// BackHandler.exitApp()
|
|
}
|
|
}],
|
|
{cancelable: false}
|
|
)
|
|
|
|
}
|
|
} else {
|
|
this.watchLocation()
|
|
|
|
}
|
|
}
|
|
|
|
showConnexionAlertError() {
|
|
this.setState({loadingDialog: false})
|
|
|
|
Alert.alert(I18n.t("TITLE_PROBLE_COME"),
|
|
I18n.t("TEXT_UNABLE_TO_GET_YOUR_POSITION"),
|
|
[{
|
|
text: I18n.t("QUIT_"), onPress: () => {
|
|
BackHandler.exitApp()
|
|
}
|
|
}, {
|
|
text: I18n.t("RESTART"),
|
|
onPress: () => {
|
|
this.setState({loadingDialog: true})
|
|
this.watchLocation()
|
|
}
|
|
}],
|
|
{cancelable: false}
|
|
)
|
|
}
|
|
|
|
_storeData = async (position) => {
|
|
try {
|
|
console.warn("save result", await AsyncStorage.setItem('position', JSON.stringify(position)));
|
|
} catch (error) {
|
|
console.warn("store error", error)
|
|
}
|
|
};
|
|
_retrieveData = async () => {
|
|
try {
|
|
const value = await AsyncStorage.getItem('position');
|
|
if (value !== null) {
|
|
let re = JSON.parse(value)
|
|
re.longitudeDelta = 0.04
|
|
re.latitudeDelta = 0.01
|
|
const pos = JSON.parse(value)
|
|
this.setState({region: re, oldPosition: pos})
|
|
}
|
|
} catch (error) {
|
|
console.warn(error)
|
|
}
|
|
};
|
|
|
|
watchLocation(geo = null) {
|
|
const options = geo == null ? GEOLOCATION_OPTIONS : geo
|
|
this.watchID = Geolocation.getCurrentPosition((position) => {
|
|
const myLastPosition = this.state.myPosition;
|
|
const myPosition = position.coords;
|
|
if (!isEqual(myPosition, myLastPosition)) {
|
|
console.warn(myPosition)
|
|
if (myPosition.longitude !== 0 && myPosition.latitude !== 0) {
|
|
this._storeData(myPosition)
|
|
this.retreiveinformationFromPosition(myPosition)
|
|
} else {
|
|
if (!this.state.alreadyRetry) {
|
|
this.setState({alreadyRetry: true})
|
|
let geo = {enableHighAccuracy: false, timeout: 20000, maximumAge: 1000}
|
|
this.watchLocation(geo)
|
|
} else {
|
|
if (this.state.oldPosition) {
|
|
this.retreiveinformationFromPosition(this.state.oldPosition)
|
|
} else {
|
|
Geolocation.watchPosition((position) => {
|
|
if (position.longitude !== 0 && position.latitude !== 0) {
|
|
this._storeData(position)
|
|
this.retreiveinformationFromPosition(position)
|
|
} else {
|
|
Alert.alert(I18n.t("UNABLE_GET_INFORMATION")
|
|
, I18n.t('UNABLE_GET_INFORMATION_TEXT'),
|
|
[{
|
|
text: I18n.t("EXIT"), onPress: () => {
|
|
BackHandler.exitApp()
|
|
}
|
|
},
|
|
{
|
|
text: I18n.t("RESTART"), onPress: () => {
|
|
this.watchLocation()
|
|
}
|
|
}],
|
|
{cancelable: false}
|
|
)
|
|
}
|
|
}, (error) => {
|
|
this.setState({loadingDialog: false})
|
|
Alert.alert(I18n.t("TITLE_ERROR_SURVENU"),
|
|
I18n.t("TEXT_ERROR_START_APPLICATION"),
|
|
[{
|
|
text: "Ok", onPress: () => {
|
|
BackHandler.exitApp()
|
|
}
|
|
}],
|
|
{cancelable: false})
|
|
}, GEOLOCATION_OPTIONS)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
}, (positionError) => {
|
|
console.warn(positionError)
|
|
Alert.alert(I18n.t("UNABLE_GET_INFORMATION")
|
|
, I18n.t('UNABLE_GET_INFORMATION_TEXT'),
|
|
[{
|
|
text: I18n.t("EXIT"), onPress: () => {
|
|
BackHandler.exitApp()
|
|
}
|
|
},
|
|
{
|
|
text: I18n.t("RESTART"), onPress: () => {
|
|
this.watchLocation()
|
|
}
|
|
}],
|
|
{cancelable: false}
|
|
)
|
|
}
|
|
, options)
|
|
}
|
|
|
|
|
|
retreiveinformationFromPosition(myPosition) {
|
|
let indicatif = callingCodes([myPosition.longitude, myPosition.latitude]);
|
|
this.setState({
|
|
indicatif: `+${indicatif}`,
|
|
enterPhone: `+${indicatif}`
|
|
});
|
|
|
|
/* getOpenCagePositionInformation(myPosition).then((response) => {
|
|
console.log("OPENCAGE RESPONSE", response);
|
|
if (response.results !== undefined) {
|
|
if (response.results.length > 0) {
|
|
let most = response.results[0]
|
|
let {address_components, county, country} = most.components;
|
|
let indicatif = callingCodes([myPosition.longitude, myPosition.latitude]);
|
|
console.log("OPENCAGE RESPONSE", indicatif);
|
|
this.setState({
|
|
address: address_components,
|
|
textadress: most.formatted,
|
|
indicatif: `+${indicatif}`,
|
|
enterPhone: `+${indicatif}`,
|
|
shortCountry: county,
|
|
longCountry: country
|
|
});
|
|
//this.getNetworks(country);
|
|
} else {
|
|
}
|
|
this.setState({phoneEnabled: true, loadingDialog: false});
|
|
|
|
} else {
|
|
console.log(myPosition, response)
|
|
this.showConnexionAlertError()
|
|
}
|
|
}).catch((e) => {
|
|
console.log("OPENCAGE ERROR", e);
|
|
this.setState({phoneEnabled: true, loadingDialog: false});
|
|
});*/
|
|
}
|
|
|
|
componentDidMount() {
|
|
this._retrieveData();
|
|
this.requestCameraPermission();
|
|
|
|
}
|
|
|
|
componentWillUnmount() {
|
|
if (this.focusListener)
|
|
this.focusListener.remove()
|
|
}
|
|
|
|
getNetworks(pays) {
|
|
|
|
if (pays) {
|
|
getCountryNetwork(pays).then((result) => {
|
|
this.reseaux = [];
|
|
let networks = result[0];
|
|
for (let prop in networks) {
|
|
if (networks[prop] !== "" && networks[prop].toLowerCase() !== pays.toLowerCase()) {
|
|
this.reseaux.push(networks[prop]);
|
|
}
|
|
}
|
|
this.setState({networks: this.reseaux});
|
|
|
|
}, (err) => {
|
|
console.log(err);
|
|
});
|
|
} else {
|
|
let msg = "impossible de récupérer le nom du pays";
|
|
}
|
|
}
|
|
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = this.initState();
|
|
this.Animation = new Animated.Value(0);
|
|
this.BackgroundColorConfig = this.Animation.interpolate(
|
|
{
|
|
inputRange: [0, 0.5, 1],
|
|
outputRange: this.state.colorsscheme
|
|
});
|
|
this.BackgroundColorConfigAdmin = this.Animation.interpolate(
|
|
{
|
|
inputRange: [0, 0.5, 1],
|
|
outputRange: this.state.colorsscheme.reverse()
|
|
})
|
|
|
|
}
|
|
|
|
StartBackgroundColorAnimation = (value) => {
|
|
this.Animation.setValue(value === 0 ? 0 : 1);
|
|
this.setState({stateLogin: value, typeaccount: value})
|
|
Animated.timing(
|
|
this.Animation,
|
|
{
|
|
toValueF: value === 1 ? 0 : 1,
|
|
duration: 500
|
|
}
|
|
).start();
|
|
}
|
|
|
|
async gotoHome() {
|
|
|
|
IlinkEmitter.emit("userconnect")
|
|
let readU = await readUser()
|
|
let road = "";
|
|
console.log("USER READ", readU);
|
|
if (!readU.category)
|
|
road = "App"
|
|
else {
|
|
switch (readU.category) {
|
|
case 'geolocated':
|
|
road = "AgentApp"
|
|
break;
|
|
case 'super':
|
|
road = "adminApp"
|
|
break
|
|
default:
|
|
road = "supAdminApp"
|
|
}
|
|
}
|
|
|
|
this.props.navigation.navigate(road)
|
|
|
|
|
|
}
|
|
|
|
gotoTypeCreated() {
|
|
this.props.navigation.push(route.typeaccountcreate, {
|
|
type: this.state.typeaccount,
|
|
});
|
|
}
|
|
|
|
initState() {
|
|
return {
|
|
password: "",
|
|
typeaccount: 0,
|
|
enterPhone: "",
|
|
isLoging: false,
|
|
phoneEnabled: false,
|
|
snackVisible: false,
|
|
snackText: '',
|
|
loadingDialog: false,
|
|
stateLogin: -1,
|
|
colorsscheme: [theme.primary, theme.primaryDark, theme.primaryDarkAdvanced]
|
|
}
|
|
}
|
|
|
|
options = [
|
|
{label: I18n.t('USER'), value: 0},
|
|
{label: I18n.t('AGENT'), value: 1},
|
|
];
|
|
|
|
BackgroundColorConfig: null
|
|
BackgroundColorConfigAdmin: null
|
|
|
|
render() {
|
|
|
|
return (
|
|
<Animated.View style={[style.container,
|
|
{backgroundColor: this.BackgroundColorConfig}]}>
|
|
<StatusBar
|
|
backgroundColor={theme.primaryDark}
|
|
barStyle="light-content"
|
|
translucent={false}
|
|
|
|
/><Spinner
|
|
visible={this.state.loadingDialog}
|
|
textContent={I18n.t("LOADING_PROGRESS")}
|
|
textStyle={{color: '#FFF'}}
|
|
/>
|
|
|
|
<ScrollView>
|
|
<TouchableOpacity onPress={() => {
|
|
|
|
this.props.navigation.push(route.helpScreen)
|
|
|
|
}}>
|
|
<View style={{
|
|
alignSelf: 'flex-end',
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
backgroundColor: theme.primaryLight,
|
|
height: 32,
|
|
borderRadius: 12,
|
|
marginTop: 30,
|
|
marginRight: 20
|
|
}}>
|
|
<Text style={{
|
|
color: 'white',
|
|
fontSize: 18,
|
|
fontWeight: 'bold',
|
|
padding: 5
|
|
}}>{I18n.t('HELP')}</Text>
|
|
</View>
|
|
</TouchableOpacity>
|
|
<View style={style.logoContaner}>
|
|
<Image style={style.logo} source={require('../../../assets/img/icon3.png')}/>
|
|
</View>
|
|
<Animatable.View ref={this.handlePhoneRef}>
|
|
<Sae
|
|
label={this.state.stateLogin !== 1 ? I18n.t('PHONE_NUMBER') : I18n.t('PHONE_NUMBER_ADMIN')}
|
|
iconClass={FontAwesomeIcon}
|
|
iconName={'phone'}
|
|
iconColor={'white'}
|
|
keyboardType={"numeric"}
|
|
enabled={this.state.phoneEnabled}
|
|
style={style.input}
|
|
autoCapitalize={'none'}
|
|
autoCorrect={false}
|
|
value={this.state.enterPhone}
|
|
ref={(com) => {
|
|
this.numberRef = com
|
|
}}
|
|
onChangeText={(text) => this.setState({enterPhone: text})}
|
|
labelStyle={style.labelInput}
|
|
/>
|
|
</Animatable.View>
|
|
<Animatable.View ref={this.handlePasswordRef}>
|
|
<Sae
|
|
label={I18n.t('PASSWORD')}
|
|
ref={component => {
|
|
this._pass = component
|
|
}}
|
|
iconClass={FontAwesomeIcon}
|
|
iconName={'lock'}
|
|
style={style.input}
|
|
iconColor={'white'}
|
|
labelStyle={style.labelInput}
|
|
autoCapitalize={'none'}
|
|
secureTextEntry={true}
|
|
onChangeText={(text) => this.setState({password: text})}
|
|
autoCorrect={false}
|
|
/>
|
|
</Animatable.View>
|
|
|
|
|
|
<View style={separator.btnContainer}>
|
|
<TouchableOpacity onPress={() => {
|
|
this.gotoForgottenPass()
|
|
}}>
|
|
<Text style={style.lostpassword}>
|
|
{I18n.t("FORGOTTEN_PASSWORD")}
|
|
</Text>
|
|
</TouchableOpacity>
|
|
<View style={style.contentSwitch}>
|
|
<SwitchSelector options={this.options}
|
|
initial={0}
|
|
buttonColor={theme.accentLight}
|
|
backgroundColor={theme.primaryDark}
|
|
textColor='white'
|
|
bold={true}
|
|
hasPadding
|
|
height={32}
|
|
style={style.switch}
|
|
onPress={(value) => {
|
|
this.StartBackgroundColorAnimation(value)
|
|
}}/>
|
|
</View>
|
|
<Button style={style.loginBtn1}
|
|
isLoading={this.state.isLoging}
|
|
onPress={() => {
|
|
this.connectClicked()
|
|
}}
|
|
>
|
|
<Text style={style.loginBtnText2}>{I18n.t("CONNECT_USER")}</Text>
|
|
</Button>
|
|
<View style={separator.container}>
|
|
<View style={separator.line}/>
|
|
<Text style={separator.text}>{I18n.t("OR_BIG")}</Text>
|
|
<View style={separator.line}/>
|
|
</View>
|
|
<Button style={style.loginBtn}
|
|
onPress={() => {
|
|
this.gotoTypeCreated()
|
|
}}
|
|
>
|
|
<Text style={style.loginBtnText}>{I18n.t("CREATE_ACCOUNT")} </Text>
|
|
</Button>
|
|
</View>
|
|
|
|
</ScrollView>
|
|
|
|
</Animated.View>
|
|
|
|
)
|
|
}
|
|
|
|
gotoForgottenPass() {
|
|
this.props.navigation.push(route.forgotpass, {
|
|
type: this.state.typeaccount,
|
|
})
|
|
}
|
|
|
|
connectClicked(isAgentRecharge = true) {
|
|
if (this.state.password === null || this.state.password === undefined || this.state.password.length < 3 || this.state.password.lenght < 3) {
|
|
this.passRef.shake(800)
|
|
} else {
|
|
this.setState(previousState => {
|
|
return {isLoging: !previousState.isLoging};
|
|
})
|
|
console.log("Enter Phone", this.state.enterPhone);
|
|
login(this.state.enterPhone, this.state.password, this.state.typeaccount).then((responseJson) => {
|
|
console.warn(responseJson)
|
|
|
|
if (responseJson.success === 1) {
|
|
this.setState(previousState => {
|
|
return {isLoging: !previousState.isLoging};
|
|
})
|
|
const user = responseJson;
|
|
if (!user.error) {
|
|
if (user.etat === "1" || user.etat === 1) {
|
|
|
|
if('related_refill_agent_phone' in user && isAgentRecharge) {
|
|
Alert.alert(
|
|
I18n.t("CONNEXION_CHOICE"),
|
|
I18n.t("CONNEXION_CHOICE_DESCRIPTION"),
|
|
[
|
|
{
|
|
text: I18n.t('YES'), onPress: () => {
|
|
this.setState({
|
|
enterPhone: user.related_refill_agent_phone
|
|
}, () => {
|
|
this.connectClicked(false)
|
|
return;
|
|
})
|
|
}
|
|
}, {
|
|
text: I18n.t('NO'), onPress: () => {
|
|
this.connectClicked(false)
|
|
}
|
|
},
|
|
],
|
|
{cancelable: false}
|
|
)
|
|
} else {
|
|
saveNewuser(user);
|
|
Alert.alert(
|
|
I18n.t("CONNEXION_SUCCESSFUL"),
|
|
I18n.t("CONNEXION_SUCCESSFULL_TEXT"),
|
|
[
|
|
{
|
|
text: 'Ok', onPress: () => {
|
|
this.setState(previousState => {
|
|
return {isLoging: !previousState.isLoging};
|
|
})
|
|
this.gotoHome()
|
|
}
|
|
}
|
|
],
|
|
{cancelable: false}
|
|
)
|
|
}
|
|
|
|
console.log("NEW USER", user);
|
|
this.setState({user: user})
|
|
|
|
|
|
} else {
|
|
if (user.category !== 'super') {
|
|
this.props.navigation.push(route.activateaccount, {
|
|
type: this.state.typeaccount,
|
|
user: user
|
|
})
|
|
|
|
} else {
|
|
if (user.etat_demande === 0 || user.etat_demande === '0') {
|
|
Alert.alert(
|
|
I18n.t('DONT_VALIDATE_ACCOUNT'),
|
|
I18n.t('UNVALIDATE_ACCOUNT_TEXT'),
|
|
[
|
|
{
|
|
text: 'Ok', onPress: () => {
|
|
}
|
|
}
|
|
],
|
|
{cancelable: false}
|
|
)
|
|
} else {
|
|
this.props.navigation.push(route.activateaccount, {
|
|
type: this.state.typeaccount,
|
|
user: user
|
|
})
|
|
}
|
|
}
|
|
}
|
|
} else {
|
|
this.setState(previousState => {
|
|
return {isLoging: !previousState.isLoging};
|
|
})
|
|
Alert.alert(
|
|
I18n.t("UNABLE_TO_CONNECT_TITLE"),
|
|
I18n.t('TEXT_NETWORK_UNABLE')
|
|
,
|
|
[
|
|
{
|
|
text: I18n.t("NO"), onPress: () => {
|
|
BackHandler.exitApp()
|
|
}
|
|
},
|
|
{
|
|
text: I18n.t("YES"), onPress: () => {
|
|
this.connectClicked()
|
|
}
|
|
}
|
|
|
|
],
|
|
{cancelable: false}
|
|
)
|
|
}
|
|
|
|
} else if (responseJson === null) {
|
|
this.setState(previousState => {
|
|
return {isLoging: !previousState.isLoging};
|
|
})
|
|
|
|
} else {
|
|
console.log(responseJson)
|
|
let message = '';
|
|
switch (responseJson.error) {
|
|
case 1:
|
|
this.phoneRef.shake(1200);
|
|
this.passRef.shake(1200);
|
|
message = I18n.t("UNABLE_TO_CONNECT")
|
|
break;
|
|
case -1:
|
|
this.phoneRef.shake(1200);
|
|
message = I18n.t('WRONG_PHONE_NUMBER')
|
|
break;
|
|
case -2:
|
|
message = I18n.t('WRONG_PHONE_NUMBER');
|
|
this.phoneRef.shake(1200);
|
|
break;
|
|
case -3:
|
|
message = I18n.t("WRONG_PASSWORD")
|
|
this.passRef.shake(1200);
|
|
break;
|
|
default:
|
|
this.passRef.shake(1200);
|
|
message = null
|
|
break;
|
|
}
|
|
|
|
if (message === null) {
|
|
Alert.alert(
|
|
I18n.t("UNABLE_TO_CONNECT_TITLE"),
|
|
I18n.t('TEXT_NETWORK_UNABLE')
|
|
,
|
|
[
|
|
{
|
|
text: I18n.t("NO"), onPress: () => {
|
|
BackHandler.exitApp()
|
|
}
|
|
},
|
|
{
|
|
text: I18n.t("YES"), onPress: () => {
|
|
this.connectClicked()
|
|
}
|
|
}
|
|
|
|
],
|
|
{cancelable: false}
|
|
)
|
|
} else {
|
|
Alert.alert(
|
|
I18n.t("UNABLE_TO_CONNECT_TITLE"),
|
|
message
|
|
,
|
|
[
|
|
|
|
{
|
|
text: "OK", onPress: () => {
|
|
}
|
|
}
|
|
|
|
],
|
|
{cancelable: false}
|
|
)
|
|
this.setState(previousState => {
|
|
return {
|
|
isLoging: !previousState.isLoging,
|
|
snackVisible: true, snackText: message
|
|
};
|
|
})
|
|
setTimeout(() => {
|
|
this.setState({snackVisible: false})
|
|
}, 2000)
|
|
}
|
|
|
|
}
|
|
})
|
|
.catch((e) => {
|
|
this.setState(previousState => {
|
|
return {isLoging: !previousState.isLoging};
|
|
})
|
|
Alert.alert(
|
|
I18n.t("UNABLE_TO_CONNECT_TITLE"),
|
|
I18n.t('TEXT_NETWORK_UNABLE')
|
|
,
|
|
[
|
|
{
|
|
text: I18n.t("NO"), onPress: () => {
|
|
BackHandler.exitApp()
|
|
}
|
|
},
|
|
{
|
|
text: I18n.t("YES"), onPress: () => {
|
|
this.connectClicked()
|
|
}
|
|
}
|
|
|
|
],
|
|
{cancelable: false}
|
|
)
|
|
|
|
})
|
|
}
|
|
}
|
|
}
|
|
|
|
const separator = StyleSheet.create({
|
|
line: {
|
|
height: 1.5,
|
|
flex: 1,
|
|
backgroundColor: 'white',
|
|
marginLeft: 30,
|
|
marginRight: 30
|
|
},
|
|
|
|
text: {
|
|
color: 'white',
|
|
fontWeight: 'bold',
|
|
|
|
},
|
|
container: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center'
|
|
},
|
|
btnContainer: {
|
|
flexDirection: 'column',
|
|
justifyContent: 'center',
|
|
|
|
},
|
|
})
|
|
const style = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
justifyContent: "center"
|
|
},
|
|
switch: {
|
|
margin: 15,
|
|
},
|
|
contentSwitch: {
|
|
width: responsiveWidth(70),
|
|
alignItems: 'center',
|
|
alignSelf: "center",
|
|
marginTop: 10,
|
|
marginLeft: 10
|
|
},
|
|
lostpassword: {
|
|
color: 'white',
|
|
alignSelf: 'flex-end',
|
|
|
|
marginTop: 60,
|
|
fontWeight: 'bold',
|
|
marginRight: 20
|
|
},
|
|
logoContaner: {
|
|
flexDirection: 'row',
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
},
|
|
logo: {
|
|
width: responsiveWidth(90),
|
|
resizeMode: "contain"
|
|
},
|
|
title: {
|
|
fontSize: responsiveFontSize(4),
|
|
alignSelf: 'center',
|
|
fontWeight: 'bold',
|
|
color: 'white',
|
|
},
|
|
loginBtnText: {
|
|
color: theme.primary,
|
|
fontWeight: 'bold',
|
|
fontSize: 15
|
|
|
|
},
|
|
|
|
loginBtnText2: {
|
|
color: "white",
|
|
fontWeight: 'bold',
|
|
fontSize: 15
|
|
|
|
},
|
|
|
|
loginBtn: {
|
|
width: widthButton,
|
|
height: 48,
|
|
alignSelf: 'center',
|
|
marginTop: 20,
|
|
borderRadius: responsiveHeight(4),
|
|
backgroundColor: 'white',
|
|
borderColor: 'transparent',
|
|
},
|
|
|
|
loginBtn1: {
|
|
width: widthButton,
|
|
marginTop: responsiveHeight(2),
|
|
height: 48,
|
|
alignSelf: 'center',
|
|
borderRadius: responsiveHeight(4),
|
|
backgroundColor: theme.accentLight,
|
|
borderColor: 'transparent',
|
|
},
|
|
|
|
input: {
|
|
width: responsiveWidth(70),
|
|
alignSelf: 'center',
|
|
marginTop: 5,
|
|
|
|
},
|
|
labelInput: {
|
|
color: "white",
|
|
fontWeight: 'normal',
|
|
}
|
|
})
|