Skip to content

E
EmidWife-New
Commit 3272ec2c authored by Malsha Jayakody's avatar Malsha Jayakody
Browse files
Options

implement home page

parent 6e521176
Hide whitespace changes
Inline Side-by-side
Showing with 154 additions and 70 deletions
src/constants/imgs.js
View file @ 3272ec2c
...@@ -63,4 +63,5 @@ export default { ...@@ -63,4 +63,5 @@ export default {
game_img_43: require('../assets/games/baby02.png'), game_img_43: require('../assets/games/baby02.png'),
game_img_44: require('../assets/games/game02Backgroundnew.jpeg'), game_img_44: require('../assets/games/game02Backgroundnew.jpeg'),
game_img_45: require('../assets/games/game02Backgroundnew02.jpeg'), game_img_45: require('../assets/games/game02Backgroundnew02.jpeg'),
home_page: require('../assets/home_page.png'),
}; };
src/screens/auth/Login.js
View file @ 3272ec2c
...@@ -8,86 +8,100 @@ import { ...@@ -8,86 +8,100 @@ import {
TouchableOpacity, TouchableOpacity,
KeyboardAvoidingView, KeyboardAvoidingView,
ScrollView, ScrollView,
ToastAndroid ToastAndroid,
} from 'react-native'; } from 'react-native';
import LinearGradient from 'react-native-linear-gradient'; import LinearGradient from 'react-native-linear-gradient';
import {COLORS, ROUTES} from '../../constants'; import {COLORS, ROUTES} from '../../constants';
import Logo from '../../assets/icons/mother.svg'; import Logo from '../../assets/icons/mother.svg';
import { Formik } from 'formik'; import {Formik} from 'formik';
import { signin } from '../../services/auth/index'; import {signin} from '../../services/auth/index';
const Login = props => {
const Login = (props) => {
const {navigation} = props; const {navigation} = props;
const onSubmit = async (values) => { const onSubmit = async values => {
console.log("dataset2") console.log('dataset2');
let respond = await signin(values.email, values.password); let respond = await signin(values.email, values.password);
console.log("dataset3",respond.data) console.log('dataset3', respond.data);
if(respond.data){ if (respond.data) {
if(respond.data.success === true){ if (respond.data.success === true) {
console.log("dataset") console.log('dataset');
navigation.navigate(ROUTES.HOME) ToastAndroid.show('Logged Successfully', ToastAndroid.SHORT);
} navigation.navigate(ROUTES.HOME);
else{ } else {
ToastAndroid.show('Email or password incorrect !', ToastAndroid.SHORT); ToastAndroid.show('Email or password incorrect !', ToastAndroid.SHORT);
} }
} } else {
else{
ToastAndroid.show('Network Error !', ToastAndroid.SHORT); ToastAndroid.show('Network Error !', ToastAndroid.SHORT);
} }
};
}
return ( return (
<KeyboardAvoidingView style={{flex:1}}> <KeyboardAvoidingView style={{flex: 1}}>
<ScrollView contentContainerStyle={{flex:1}} bounces={false}> <ScrollView contentContainerStyle={{flex: 1}} bounces={false}>
<View style={Styles.container}> <View style={Styles.container}>
<View style={Styles.wFull}> <View style={Styles.wFull}>
<Formik <Formik
initialValues={{ email: '' , password: ''}} initialValues={{email: '', password: ''}}
onSubmit={values => onSubmit(values)} onSubmit={values => onSubmit(values)}>
> {({handleChange, handleBlur, handleSubmit, values}) => (
{({ handleChange, handleBlur, handleSubmit, values }) => ( <>
<> <View style={Styles.row}>
<View style={Styles.row}> <Logo width={55} height={55} style={Styles.mr7} />
<Logo width={55} height={55} style={Styles.mr7} /> <Text style={Styles.brandName}>EmidWife</Text>
<Text style={Styles.brandName}>EmidWife</Text> </View>
</View>
<Text style={Styles.loginContinueTxt}>Login in to continue</Text> <Text style={Styles.loginContinueTxt}>
<TextInput style={Styles.input} placeholder="Email" onChangeText={handleChange('email')} value={values.email}/> Login in to continue
<TextInput style={Styles.input} placeholder="Password" onChangeText={handleChange('password')} value={values.password}/> </Text>
<TextInput
style={Styles.input}
placeholder="Email"
onChangeText={handleChange('email')}
value={values.email}
/>
<TextInput
style={Styles.input}
placeholder="Password"
onChangeText={handleChange('password')}
value={values.password}
/>
<View style={Styles.loginBtnWrapper}> <View style={Styles.loginBtnWrapper}>
<LinearGradient <LinearGradient
colors={[COLORS.gradientForm, COLORS.bgColor]} colors={[COLORS.gradientForm, COLORS.bgColor]}
style={Styles.linearGradient} style={Styles.linearGradient}
start={{y: 0.0, x: 0.0}} start={{y: 0.0, x: 0.0}}
end={{y: 1.0, x: 0.0}}> end={{y: 1.0, x: 0.0}}>
{/******************** LOGIN BUTTON *********************/} {/******************** LOGIN BUTTON *********************/}
<TouchableOpacity activeOpacity={0.7} style={Styles.loginBtn} onPress={handleSubmit}> <TouchableOpacity
<Text style={Styles.loginText}>Log In</Text> activeOpacity={0.7}
</TouchableOpacity> style={Styles.loginBtn}
</LinearGradient> onPress={handleSubmit}>
</View> <Text style={Styles.loginText}>Log In</Text>
</TouchableOpacity>
</LinearGradient>
</View>
{/***************** FORGOT PASSWORD BUTTON *****************/} {/***************** FORGOT PASSWORD BUTTON *****************/}
<TouchableOpacity style={Styles.loginBtn} onPress={() => navigation.navigate(ROUTES.FORGOT_PASSWORD)}> <TouchableOpacity
<Text style={Styles.forgotPassText}>Forgot Password?</Text> style={Styles.loginBtn}
</TouchableOpacity> onPress={() => navigation.navigate(ROUTES.FORGOT_PASSWORD)}>
</> <Text style={Styles.forgotPassText}>Forgot Password?</Text>
)} </TouchableOpacity>
</Formik> </>
</View> )}
</Formik>
</View>
<View style={Styles.footer}> <View style={Styles.footer}>
<Text style={Styles.footerText}> Don't have an account? </Text> <Text style={Styles.footerText}> Don't have an account? </Text>
{/******************** REGISTER BUTTON *********************/} {/******************** REGISTER BUTTON *********************/}
<TouchableOpacity onPress={() => navigation.navigate(ROUTES.REGISTER)}> <TouchableOpacity
<Text style={Styles.signupBtn}>Sign Up</Text> onPress={() => navigation.navigate(ROUTES.REGISTER)}>
</TouchableOpacity> <Text style={Styles.signupBtn}>Sign Up</Text>
</TouchableOpacity>
</View>
</View> </View>
</View> </ScrollView>
</ScrollView>
</KeyboardAvoidingView> </KeyboardAvoidingView>
); );
}; };
...@@ -120,7 +134,6 @@ const Styles = StyleSheet.create({ ...@@ -120,7 +134,6 @@ const Styles = StyleSheet.create({
color: COLORS.gray, color: COLORS.gray,
marginBottom: 16, marginBottom: 16,
fontWeight: 'bold', fontWeight: 'bold',
}, },
input: { input: {
borderWidth: 1, borderWidth: 1,
...@@ -130,7 +143,7 @@ const Styles = StyleSheet.create({ ...@@ -130,7 +143,7 @@ const Styles = StyleSheet.create({
borderRadius: 12, borderRadius: 12,
height: 45, height: 45,
paddingVertical: 0, paddingVertical: 0,
color: "black" color: 'black',
}, },
// Login Btn Styles // Login Btn Styles
loginBtnWrapper: { loginBtnWrapper: {
......
src/screens/auth/Register.js
View file @ 3272ec2c
...@@ -28,8 +28,8 @@ const Register = ({navigation}) => { ...@@ -28,8 +28,8 @@ const Register = ({navigation}) => {
console.log('dataset3', respond.data); console.log('dataset3', respond.data);
if (respond.data.success === true) { if (respond.data.success === true) {
console.log('dataset'); console.log('dataset');
ToastAndroid.show('Registered Successfully', ToastAndroid.SHORT);
navigation.navigate(ROUTES.HOME); navigation.navigate(ROUTES.HOME);
ToastAndroid.show('Login success', ToastAndroid.SHORT);
} else { } else {
ToastAndroid.show('Network or details not clear !', ToastAndroid.SHORT); ToastAndroid.show('Network or details not clear !', ToastAndroid.SHORT);
} }
......
src/screens/home/Home.js
View file @ 3272ec2c
import React from 'react'; import React from 'react';
import { SafeAreaView, StyleSheet, Text, View } from 'react-native'; import {Image, TouchableOpacity, Text, View} from 'react-native';
import {COLORS, IMGS} from '../../constants';
import LinearGradient from 'react-native-linear-gradient';
const Home = () => { const Home = () => {
return ( return (
<LinearGradient
style={{
flex: 1,
}}
colors={[COLORS.dark_purple, COLORS.white, COLORS.dark_purple]}>
<View>
<View> <View>
<Text>Register</Text> <Image
source={IMGS.home_page}
style={{
height: 360,
width: '100%',
position: 'absolute',
top: 100,
}}
/>
</View> </View>
);
<View
style={{
paddingHorizontal: 67,
position: 'absolute',
top: 590,
width: '100%',
}}>
<Text
style={{
fontSize: 48,
color: COLORS.black,
fontWeight: 'bold',
textAlign: 'center',
}}>
Welcome to
</Text>
<Text
style={{
fontSize: 48,
color: COLORS.black,
fontWeight: 'bold',
textAlign: 'center',
}}>
e-MidWife
</Text>
{/* <View style={{marginTop: 1}}>
<TouchableOpacity
style={{
backgroundColor: COLORS.purple_new,
borderColor: COLORS.purple_new,
height: 50,
marginBottom: 50,
justifyContent: 'center',
alignItems: 'center',
borderRadius: 14,
width: '100%',
zIndex: 3,
elevation: 10,
}}
onPress={() => navigation.navigate(ROUTES.GAME_QUIZ_OPTIONS)}
>
<Text
medium
center
style={{color: 'white', fontSize: 24, fontWeight: 'bold'}}>
Start
</Text>
</TouchableOpacity>
</View> */}
</View>
</View>
</LinearGradient>
);
}; };
export default Home; export default Home;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment