gugus/sort
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update login

Browse Source
This commit is contained in:
Gugus Darmayanto 2024-09-26 11:56:15 +07:00
parent 0fb7f14a82
commit 8ec26154c0
6 changed files with 111 additions and 129 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

138
app/(tabs)/index.tsx
View File

@ -6,6 +6,7 @@ import { RootStackParamList } from '../../types';
import AsyncStorage from '@react-native-async-storage/async-storage';
import { DB } from '@/components/lib/db';
import { GestureHandlerRootView, ScrollView } from 'react-native-gesture-handler';
import config from '../../components/data/config.json';
const LoginScreen = () => {
const navigation = useNavigation<NavigationProp<RootStackParamList>>();
@ -41,51 +42,49 @@ const LoginScreen = () => {
return (
<>
<GestureHandlerRootView>
<ScrollView>
<View style={{ flex: 1, backgroundColor:'#2563eb'}}>
<ScrollView style={{backgroundColor:"white"}}>
<View style={{ flex: 1, backgroundColor:'white'}}>
<View style={{
flexDirection:"column"
, height:300
, justifyContent:"center"
, alignItems:"center"
flexDirection: "row"
, height: 140
, alignItems: "flex-end"
, paddingHorizontal: 30
, marginBottom: 20
}}>
<View style={{ flex: 1 }}>
</View>
<View style={{
width: "auto",
backgroundColor: "white",
padding: 10,
borderRadius: 20
}}>
<View style={{
width:"auto",
backgroundColor:"white",
padding: 10,
borderRadius: 20
}}>
<Image
source={require('../../assets/images/logo.png')}
style={{
width: 75
, height: 75
}}
resizeMode="contain" // You can adjust this based on how you want the image to scale
/>
</View>
<Text style={{
color:"white",
paddingVertical: 10,
fontWeight:"bold",
fontSize: 30
}}>S.O.R.T</Text>
<Image
source={require('../../assets/images/login/logo.png')}
style={{
width: 60
, height: 60
}}
resizeMode="contain" // You can adjust this based on how you want the image to scale
/>
</View>
</View>
<View style={[styles.container]}>
<Text style={{
textAlign:"center"
, fontSize:50
, fontWeight:'bold'
, color:"#2563eb"
}}>Login</Text>
<Text style={{
textAlign:"center"
, fontSize:18
, fontWeight:'bold'
, color:"#777"
, marginVertical:20
}}>Silahkan login ke akun anda</Text>
<Text style={{
<View style={{marginBottom:40}}>
<Text style={{
fontSize:20
, fontWeight:'bold'
, color:config.color.textbiru
}}>Hi !</Text>
<Text style={{
fontSize:20
, fontWeight:'bold'
, marginVertical:5
, color: config.color.textbiru
}}>Selamat datang kembali,</Text>
</View>
{/* <Text style={{
textAlign:"left"
, fontSize:18
, fontWeight:'bold'
@ -93,14 +92,14 @@ const LoginScreen = () => {
, marginTop:10
, marginBottom: 10
,width:'100%'
}}>EMAIL</Text>
}}>EMAIL</Text> */}
<TextInput
style={styles.input}
placeholder="youremail@gmail.com"
value={username}
onChangeText={setUsername}
/>
<Text style={{
{/* <Text style={{
textAlign: "left"
, fontSize: 18
, fontWeight: 'bold'
@ -108,7 +107,7 @@ const LoginScreen = () => {
, marginBottom: 10
, marginTop: 10
, width: '100%'
}}>PASSWORD</Text>
}}>PASSWORD</Text> */}
<TextInput
style={styles.input}
placeholder="******"
@ -116,20 +115,32 @@ const LoginScreen = () => {
onChangeText={setPassword}
secureTextEntry
/>
<View style={{
flexDirection:"row",
marginBottom:50
}}>
<View style={{flex:1}}>
</View>
<TouchableOpacity onPress={handleForgotPassword}>
<Text style={styles.forgotPasswordText}>Lupa Password?</Text>
</TouchableOpacity>
</View>
<TouchableOpacity style={styles.button} onPress={handleLogin}>
<Text style={styles.buttonText}>Log In</Text>
</TouchableOpacity>
<TouchableOpacity onPress={handleForgotPassword}>
<Text style={styles.forgotPasswordText}>Lupa Password?</Text>
</TouchableOpacity>
<View style={{flexDirection:"row"}}>
<Text>Belum memiliki akun?</Text>
<TouchableOpacity onPress={handleSignUp} style={{marginHorizontal:5}}>
<Text style={{
color:"blue",
fontWeight:"bold"
}}>Daftar disini!</Text>
<Text style={styles.buttonText}>LOGIN</Text>
</TouchableOpacity>
<View style={{
flexDirection:"row"
, justifyContent:"center"
, marginTop: 30
}}>
<Text>Belum memiliki akun?</Text>
<TouchableOpacity onPress={handleSignUp} style={{marginHorizontal:10}}>
<Text style={{
color:"blue",
fontWeight:"bold"
}}>Daftar disini!</Text>
</TouchableOpacity>
</View>
</View>
</View>
@ -146,11 +157,9 @@ const styles = StyleSheet.create({
container: {
flex: 1,
paddingVertical:50,
borderTopRightRadius:80,
backgroundColor: 'white',
justifyContent: 'center',
alignItems: 'center',
paddingHorizontal: 60
paddingHorizontal: 50
},
appName: {
fontSize: 36,
@ -165,8 +174,8 @@ const styles = StyleSheet.create({
},
input: {
width: '100%',
borderWidth: 2,
borderColor:"#333",
borderBottomWidth: 2,
borderBottomColor: config.color.line,
borderRadius: 10,
padding: 15,
shadowColor: "#000",
@ -176,7 +185,7 @@ const styles = StyleSheet.create({
button: {
backgroundColor: '#2563eb',
padding: 15,
borderRadius: 10,
borderRadius: 30,
width: '100%',
alignItems: 'center',
marginBottom: 10,
@ -186,14 +195,15 @@ const styles = StyleSheet.create({
borderColor: '#fff',
},
buttonText: {
fontSize: 18,
fontSize: 20,
color: 'white',
fontWeight:"bold"
},
buttonTextSecondary: {
color: '#fff',
},
forgotPasswordText: {
color: '#777',
color: "#0f48a1",
fontSize: 16,
marginBottom: 20,
textDecorationLine: 'underline',

96
app/(tabs)/signup.tsx
View File

@ -107,15 +107,18 @@ VALUES (
<InfoLayer info={setInfo} navigation={navigation} />
</>
:
<View style={{ flex: 1, backgroundColor: config.color.primary }}>
<View style={{ flex: 1, backgroundColor: 'white'}}>
<GestureHandlerRootView>
<ScrollView>
<View style={{
flexDirection: "column"
, height: 300
, justifyContent: "center"
, alignItems: "center"
flexDirection: "row"
, height: 140
, alignItems: "flex-end"
, paddingHorizontal: 30
}}>
<View style={{ flex: 1 }}>
</View>
<View style={{
width: "auto",
backgroundColor: "white",
@ -123,87 +126,49 @@ VALUES (
borderRadius: 20
}}>
<Image
source={require('../../assets/images/logo.png')}
source={require('../../assets/images/login/logo.png')}
style={{
width: 75
, height: 75
width: 60
, height: 60
}}
resizeMode="contain" // You can adjust this based on how you want the image to scale
/>
</View>
<Text style={{
color: "white",
paddingVertical: 10,
fontWeight: "bold",
fontSize: 30
}}>S.O.R.T</Text>
</View>
<View style={styles.container}>
<Text style={styles.title}>Register</Text>
<Text style={{
textAlign: "left"
, fontSize: 18
, fontWeight: 'bold'
, color: "#777"
, marginTop: 10
, width: '100%'
}}>{(`nama lengkap`).toUpperCase()}</Text>
<Text style={styles.title}>Buat Akun Baru</Text>
<TextInput
style={styles.input}
placeholder="Nama Anda"
value={fullname}
onChangeText={setFullname}
/>
<Text style={{
textAlign: "left"
, fontSize: 18
, fontWeight: 'bold'
, color: "#777"
, width: '100%'
}}>{(`email`).toUpperCase()}</Text>
<TextInput
style={styles.input}
placeholder="emailanda@gmail.com"
placeholder="Email"
value={username}
onChangeText={setUsername}
/>
<Text style={{
textAlign: "left"
, fontSize: 18
, fontWeight: 'bold'
, color: "#777"
, width: '100%'
}}>{(`no. telepon`).toUpperCase()}</Text>
<TextInput
style={styles.input}
placeholder="No. Telepon Anda"
value={phone}
onChangeText={setPhone}
/>
<Text style={{
textAlign: "left"
, fontSize: 18
, fontWeight: 'bold'
, color: "#777"
, width: '100%'
}}>{(`PASSWORD`).toUpperCase()}</Text>
<TextInput
style={styles.input}
placeholder="******"
placeholder="Password"
value={password}
onChangeText={setPassword}
secureTextEntry
/>
<Text style={{
textAlign: "left"
, fontSize: 18
, fontWeight: 'bold'
, color: "#777"
, width: '100%'
}}>{(`konfirmasi password`).toUpperCase()}</Text>
<TextInput
style={styles.input}
placeholder="******"
placeholder="Konfirmasi Password"
value={passwordRepeat}
onChangeText={setPasswordRepeat}
secureTextEntry
@ -212,7 +177,9 @@ VALUES (
<Text style={styles.buttonText}>{(`Register`).toUpperCase()}</Text>
</TouchableOpacity>
<View style={{ marginBottom:30, marginTop:20, flexDirection: "row" }}>
<Text>Sudah memiliki akun?</Text>
<View style={{ flex: 1 }}>
<Text>Sudah memiliki akun?</Text>
</View>
<TouchableOpacity onPress={handleSignIn} style={{ marginHorizontal: 5 }}>
<Text style={{
color: "blue",
@ -234,8 +201,7 @@ const styles = StyleSheet.create({
flex: 1,
backgroundColor: 'white',
justifyContent: 'center',
alignItems: 'center',
paddingVertical: 20,
paddingVertical: 10,
paddingHorizontal:40,
borderTopLeftRadius: 50
},
@ -246,27 +212,29 @@ const styles = StyleSheet.create({
marginBottom: 10,
},
title: {
fontSize: 40,
fontSize: 20,
color: config.color.primary,
marginBottom: 20,
fontWeight:"bold"
fontWeight:"bold",
marginBottom:30
},
input: {
width: '100%',
backgroundColor: '#fff',
borderWidth:1,
borderBottomWidth: 2,
borderBottomColor: config.color.line,
borderRadius: 10,
padding: 15,
shadowColor: "#000",
marginBottom: 20,
fontSize: 16,
},
button: {
backgroundColor: config.color.primary,
padding: 15,
borderRadius: 10,
borderRadius: 50,
width: '100%',
alignItems: 'center',
marginBottom: 10,
marginBottom: 30,
marginTop: 30,
},
buttonSecondary: {
backgroundColor: 'transparent',

BIN
assets/images/login/bg1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
assets/images/login/bg2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
assets/images/login/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 466 B

6
components/data/config.json
View File

@ -1,6 +1,10 @@
{
"color":{
"primary": "#2563eb"
"primary": "#2563eb",
"line" : "#96aeda",
"textbiru" : "#2362e5",
"logohijau" : "#60e1f6",
"logobiru" : "#2563ea"
},
"api" : "http://193.203.167.219:8282/data/query/odoo"
,"api2" : "https://app.rumahjo.com/data/query/odoo"