This commit is contained in:
Maarten 2024-08-08 13:13:58 +02:00
parent fe82b69997
commit 3287b9a3b7
10 changed files with 813 additions and 813 deletions

View file

@ -1,128 +1,128 @@
import {Stack} from 'expo-router';
import {StyleSheet, TextInput, TouchableOpacity} from 'react-native';
import { Stack } from 'expo-router';
import { StyleSheet, TextInput, TouchableOpacity } from 'react-native';
import {ThemedText} from '@/components/ThemedText';
import {ThemedView} from '@/components/ThemedView';
import {useToken} from '@/context/AppProvider';
import {Colors} from '@/constants/Colors';
import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView';
import { useToken } from '@/context/AppProvider';
import { Colors } from '@/constants/Colors';
import React from 'react';
import {useColorScheme} from '@/hooks/useColorScheme';
import {Message} from '@/services/message';
import {Request} from '@/services/request';
import { useColorScheme } from '@/hooks/useColorScheme';
import { Message } from '@/services/message';
import { Request } from '@/services/request';
import { router } from 'expo-router';
export default function OnboardStartScreen() {
const colorScheme = useColorScheme() ?? 'light';
const {setToken} = useToken();
const [name, setName] = React.useState('Maarten');
const [zipcode, setZipcode] = React.useState('6715GA');
const [houseNumber, setHouseNumber] = React.useState('3');
const colorScheme = useColorScheme() ?? 'light';
const { setToken } = useToken();
const [ name, setName ] = React.useState( 'Maarten' );
const [ zipcode, setZipcode ] = React.useState( '6715GA' );
const [ houseNumber, setHouseNumber ] = React.useState( '3' );
const start = () => {
if (name === '' || zipcode === '' || houseNumber === '') {
Message.error('Niet alle gegevens zijn ingevuld!');
const start = () => {
if (name === '' || zipcode === '' || houseNumber === '') {
Message.error( 'Niet alle gegevens zijn ingevuld!' );
return;
return;
}
// TODO: Get device name
const deviceName = 'Test';
Request
.post( 'sessions/create', {
name: name,
zipcode: zipcode,
houseNumber: houseNumber,
device: deviceName,
} )
.then( (response) => {
if (!response.success) {
Message.error( response.message );
} else {
const token = response.token;
setToken( token );
router.replace( "/(tabs)" );
Message.success( response.message );
}
} );
}
// TODO: Get device name
const deviceName = 'Test';
return (
<>
<Stack.Screen options={{ title: 'Welkom' }}/>
<ThemedView style={styles.container}>
<ThemedView style={styles.heading}>
<ThemedText type="title">Welkom bij </ThemedText>
<ThemedText type="title" style={{ color: Colors[ colorScheme ].tint }}>Kliko</ThemedText>
</ThemedView>
Request
.post('sessions/create', {
name: name,
zipcode: zipcode,
houseNumber: houseNumber,
device: deviceName,
})
.then((response) => {
if (!response.success) {
Message.error(response.message);
} else {
const token = response.token;
<ThemedView style={styles.inputContainer}>
<ThemedText>Wat is je naam?</ThemedText>
<TextInput
style={styles.input}
onChangeText={setName}
placeholder={'Je naam'}
value={name}
/>
</ThemedView>
setToken(token);
router.replace("/(tabs)");
Message.success(response.message);
}
});
}
return (
<>
<Stack.Screen options={{title: 'Welkom'}}/>
<ThemedView style={styles.container}>
<ThemedView style={styles.heading}>
<ThemedText type="title">Welkom bij </ThemedText>
<ThemedText type="title" style={{color: Colors[colorScheme].tint}}>Kliko</ThemedText>
</ThemedView>
<ThemedView style={styles.inputContainer}>
<ThemedText>Wat is je naam?</ThemedText>
<TextInput
style={styles.input}
onChangeText={setName}
placeholder={'Je naam'}
value={name}
/>
</ThemedView>
<ThemedView style={styles.inputContainer}>
<ThemedText>Wat is je postcode en huisnummer?</ThemedText>
<TextInput
style={styles.input}
onChangeText={setZipcode}
placeholder={'Postcode'}
value={zipcode}
/>
<TextInput
style={styles.input}
onChangeText={setHouseNumber}
placeholder={'Huisnummer'}
value={houseNumber}
keyboardType="numeric"
/>
</ThemedView>
<ThemedView style={styles.inputContainer}>
<ThemedText>Wat is je postcode en huisnummer?</ThemedText>
<TextInput
style={styles.input}
onChangeText={setZipcode}
placeholder={'Postcode'}
value={zipcode}
/>
<TextInput
style={styles.input}
onChangeText={setHouseNumber}
placeholder={'Huisnummer'}
value={houseNumber}
keyboardType="numeric"
/>
</ThemedView>
<TouchableOpacity style={{...styles.button, backgroundColor: Colors[colorScheme].tint}} onPress={start}>
<ThemedText style={{color: '#fff'}}>Start</ThemedText>
</TouchableOpacity>
</ThemedView>
</>
);
<TouchableOpacity style={{ ...styles.button, backgroundColor: Colors[ colorScheme ].tint }} onPress={start}>
<ThemedText style={{ color: '#fff' }}>Start</ThemedText>
</TouchableOpacity>
</ThemedView>
</>
);
}
const styles = StyleSheet.create({
container: {
padding: 20,
flex: 1,
alignItems: 'center',
justifyContent: 'center',
},
heading: {
marginBottom: 30,
alignItems: 'center',
justifyContent: 'center',
},
inputContainer: {
paddingTop: 20,
},
input: {
width: 250,
borderWidth: 1,
padding: 10,
paddingLeft: 20,
borderRadius: 3,
marginBottom: 10,
},
button: {
borderRadius: 5,
paddingTop: 10,
paddingBottom: 10,
paddingLeft: 40,
paddingRight: 40,
marginTop: 30,
},
});
const styles = StyleSheet.create( {
container: {
padding: 20,
flex: 1,
alignItems: 'center',
justifyContent: 'center',
},
heading: {
marginBottom: 30,
alignItems: 'center',
justifyContent: 'center',
},
inputContainer: {
paddingTop: 20,
},
input: {
width: 250,
borderWidth: 1,
padding: 10,
paddingLeft: 20,
borderRadius: 3,
marginBottom: 10,
},
button: {
borderRadius: 5,
paddingTop: 10,
paddingBottom: 10,
paddingLeft: 40,
paddingRight: 40,
marginTop: 30,
},
} );