ilink-world/screens/nano-sante/AcceptPrestationAgent.js

153 lines
4.5 KiB
JavaScript

import React, {Component} from 'react';
import {Color} from "../../config/Color";
import I18n from "react-native-i18n";
import * as Animatable from "react-native-animatable";
import {Fumi} from "react-native-textinput-effects";
import FontAwesomeIcon from "react-native-vector-icons/FontAwesome";
import {ScrollView, StyleSheet, Text, View} from "react-native";
import {responsiveHeight, responsiveWidth} from "react-native-responsive-dimensions";
import {FontWeight, Typography} from "../../config/typography";
import Button from "apsl-react-native-button";
export default class AcceptPrestationAgent extends Component {
static navigatorStyle = {
navBarBackgroundColor: Color.primaryColor,
statusBarColor: Color.primaryDarkColor,
navBarTextColor: '#FFFFFF',
navBarButtonColor: '#FFFFFF'
};
static navigationOptions = () => {
return {
drawerLabel: () => null,
headerTitle: I18n.t('ACCEPTER_PRESTATION'),
headerTintColor: 'white',
headerStyle: {
backgroundColor: Color.primaryColor,
marginTop: 0,
color: 'white'
},
headerTitleStyle: {
color: "white"
},
title: I18n.t('ACCEPTER_PRESTATION')
}
};
constructor(props) {
super(props);
this.state = {
password: null,
numeroTelephone: null
}
}
render() {
return (
<ScrollView style={styles.container}>
<Text style={styles.subbigtitle}>{I18n.t('ACCEPTER_PRESTATION')}</Text>
<Animatable.View ref={(comp) => {
this.numeroTelephoneAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName="phone"
label={I18n.t('PHONE')}
iconColor={'#f95a25'}
keyboardType='phone-pad'
iconSize={20}
value={this.state.numeroTelephone}
onChangeText={(numeroTelephone) => {
this.setState({numeroTelephone})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => {
this.passwordAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
label={I18n.t('PASSWORD')}
iconColor={'#f95a25'}
iconSize={20}
secureTextEntry={true}
value={this.state.password}
onChangeText={(password) => {
this.setState({password})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Button style={styles.btnvalide}
textStyle={styles.textbtnvalide}
onPress={() => {
//this.onSubmitSendWalletToCard()
}}>
{I18n.t('SUBMIT_LABEL')}</Button>
</ScrollView>
)
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: Color.primaryDarkColor,
},
textbtnvalide: {
color: 'white',
fontWeight: 'bold'
},
bigtitle: {
color: 'white',
fontSize: 20,
flex: 1,
fontWeight: 'bold',
textAlign: 'center',
margin: 20,
},
blockView: {
paddingVertical: 10,
borderBottomWidth: 1
},
subbigtitle: {
color: 'white',
fontSize: 17,
textAlign: 'center',
margin: 5,
},
btnvalide: {
marginTop: 20,
marginLeft: 20,
marginRight: 20,
borderColor: 'transparent',
backgroundColor: Color.accentLightColor,
height: 52
},
btnSubmit: {
marginTop: 20,
borderColor: 'transparent',
backgroundColor: Color.accentLightColor,
height: 52,
width: "30%",
marginLeft: 20,
marginRight: 20,
},
input: {
height: 60,
marginTop: responsiveHeight(2),
marginLeft: responsiveWidth(5),
marginRight: responsiveWidth(5),
borderRadius: 5,
}
});