140 lines
2.8 KiB
JavaScript
140 lines
2.8 KiB
JavaScript
import React, {useState } from 'react';
|
|
import {
|
|
StatusBar,
|
|
StyleSheet,
|
|
Text,
|
|
useColorScheme,
|
|
View,
|
|
TouchableHighlight,
|
|
TextInput
|
|
} from 'react-native';
|
|
import { Icon } from 'react-native-elements';
|
|
|
|
|
|
const RegisterUserScreen = () => {
|
|
|
|
const [username, setUsername] = useState("")
|
|
const [orgname, setOrgname] = useState("")
|
|
const [token, setToken] = useState("none")
|
|
var [ isPress, setIsPress ] = useState(false);
|
|
|
|
const register = () => {
|
|
var data = {
|
|
"username": username,
|
|
"orgName": orgname
|
|
}
|
|
fetch("http://192.168.29.141:4000/users", {
|
|
method: "POST",
|
|
headers: {
|
|
'Accept': 'application/json',
|
|
'Content-Type': 'application/json',
|
|
},
|
|
body: JSON.stringify(data)
|
|
})
|
|
.then(function (response) {
|
|
return response.json();
|
|
})
|
|
.then(function (data) {
|
|
console.log(data)
|
|
setToken(data)
|
|
});
|
|
|
|
}
|
|
|
|
var touchProps = {
|
|
|
|
activeOpacity: 1,
|
|
underlayColor: 'white',
|
|
style: isPress ? styles.btnPress : styles.btnNormal,
|
|
onHideUnderlay: () => setIsPress(false),
|
|
onShowUnderlay: () => setIsPress(true),
|
|
onPress: register,
|
|
}
|
|
|
|
var textInputProps = {
|
|
style:styles.input,
|
|
onChangeText:setUsername,
|
|
value:username,
|
|
placeholder:"username",
|
|
placeholderTextColor : "#4b4a4a",
|
|
|
|
}
|
|
return (
|
|
|
|
<>
|
|
<StatusBar backgroundColor="#fffff2" barStyle="dark-content" />
|
|
<View
|
|
style={styles.viewRoot}>
|
|
<Text style={styles.heading}>Log In</Text>
|
|
<View style={{ flexDirection: "row", marginTop: "20%"}}>
|
|
<TextInput {...textInputProps} />
|
|
</View>
|
|
<View style={{ flexDirection: "row", marginTop: "10%"}}>
|
|
<TextInput {...textInputProps} />
|
|
</View>
|
|
|
|
<View style={{ flexDirection: "row", marginTop: "10%", justifyContent: "center"}}>
|
|
<TouchableHighlight {...touchProps}>
|
|
<Text style={styles.btnText}>Submit</Text>
|
|
</TouchableHighlight>
|
|
</View>
|
|
|
|
<Text style={{color: "#206ba5", fontSize: 25 }}>{token.message}</Text>
|
|
</View>
|
|
|
|
</>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
viewRoot: {
|
|
backgroundColor: '#ffffff',
|
|
height: '100%',
|
|
justifyContent: 'center',
|
|
alignItems: 'center'
|
|
},
|
|
heading: {
|
|
color: '#1C254E',
|
|
fontSize: 60,
|
|
textAlign: 'center',
|
|
fontFamily: 'Ubuntu-Bold',
|
|
},
|
|
icon: {
|
|
|
|
alignSelf: "flex-start",
|
|
marginLeft: '28%',
|
|
flexDirection: 'row',
|
|
},
|
|
btnNormal: {
|
|
borderRadius: 10,
|
|
height: 45,
|
|
width: 140,
|
|
backgroundColor: '#1C254E',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
btnText: {
|
|
textAlign: 'center',
|
|
fontSize: 22,
|
|
color:'white',
|
|
},
|
|
btnPress: {
|
|
borderRadius: 10,
|
|
height: 45,
|
|
width: 140,
|
|
backgroundColor: '#1C254E',
|
|
justifyContent: 'center',
|
|
},
|
|
input: {
|
|
height: 60,
|
|
width: 280,
|
|
margin: 12,
|
|
borderRadius: 15,
|
|
padding: 10,
|
|
color: "black",
|
|
backgroundColor: "#c4c4c4",
|
|
},
|
|
});
|
|
|
|
export default RegisterUserScreen;
|