eduardo
/
katoikia-app
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

scrollview y pasar params del usuario

This commit is contained in:
Maria Sanchez 2022-08-22 00:51:05 -06:00
parent ec5c738e6b
commit f74c539781
3 changed files with 60 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
mobile-ui/App.js
View File

@ -24,18 +24,18 @@ function HomeTab({route}) {
const [selected, setSelected] = useState(0);
const user = route.params;
console.log(user);
// console.log(user);
return (
<Tab.Navigator initialRouteName="Comunicados" >
<Tab.Screen name="Comunicados" component={Home} params={user} options={{headerStyle: {
<Tab.Navigator params={user} initialRouteName="Comunicados" >
<Tab.Screen name="Comunicados" component={Home} initialParams={user} options={{headerStyle: {
backgroundColor: "#D7A86E"
}, tabBarIcon: () => (<Icon mb="2" as={<MaterialCommunityIcons name={selected === 0 ? 'home' : 'home-outline'} />} color="#D7A86E" size="md" />)}} onclick={() => setSelected(0)}
/>
<Tab.Screen name="Reservas" component={Reservas } params={user} options={{headerStyle: {
<Tab.Screen name="Reservas" component={Reservas } initialParams={user} options={{headerStyle: {
backgroundColor: "#D7A86E"
}, tabBarIcon: () => (<Icon mb="2" as={<MaterialCommunityIcons name={selected === 1 ? 'tree' : 'tree-outline'} />} color="#D7A86E" size="md" />)} } onclick={() => setSelected(1)} />
<Tab.Screen name="Perfil" component={Profile} params={user} options={{headerStyle: {
<Tab.Screen name="Perfil" component={Profile} initialParams={user} options={{headerStyle: {
backgroundColor: "#D7A86E"
}, tabBarIcon: () => (<Icon mb="2" as={<MaterialCommunityIcons name={selected === 2 ? 'account' : 'account-outline'} />} color="#D7A86E" size="md" />)}} onclick={() => setSelected(2)} />
</Tab.Navigator>

8
mobile-ui/components/Home.js
View File

@ -6,6 +6,7 @@ import {
Box,
Pressable,
Spacer,
ScrollView
} from "native-base";
import { MaterialCommunityIcons } from '@expo/vector-icons';
export default function Home(){
@ -14,6 +15,12 @@ export default function Home(){
return (
<Box alignItems="center">
<ScrollView width='100%' h='550' ml='1' _contentContainerStyle={{
px: "20px",
mb: "4",
minW: "72"
}}>
<Pressable onPress={() => console.log("I'm Pressed")} rounded="8" overflow="hidden" borderWidth="1" borderColor="coolGray.300" maxW="96" shadow="3" bg="coolGray.100" p="5" marginTop="4">
<Box>
<HStack alignItems="center">
@ -58,6 +65,7 @@ export default function Home(){
</Box>
</Pressable>
</ScrollView>
</Box>
// <Center width={"100%"} marginTop={"auto"}>

60
mobile-ui/components/Profile.js
View File

@ -4,24 +4,32 @@ import {
Box,
Heading,
VStack,
FormControl,
Input,
FormControl,
Button,
Center
Center,
ScrollView
} from "native-base";
import { View, TextInput, StyleSheet } from "react-native";
export default function Profile({route, navigation}){
const user = route.params;
const userData = JSON.parse(JSON.stringify(route.params));
console.log(user);
console.log(userData.user);
return (
<Center>
<ScrollView width='100%' h='550' ml='36' _contentContainerStyle={{
px: "20px",
mb: "4",
minW: "72"
}}>
<Box safeArea p="2" w="90%" maxW="290" py="8">
<Heading size="lg" color="coolGray.800" _dark={{
color: "warmGray.50"
}} fontWeight="semibold">
Katoikia
Bienvenido {userData.user.name}
</Heading>
<Heading mt="1" color="coolGray.600" _dark={{
color: "warmGray.200"
@ -29,21 +37,25 @@ export default function Profile({route, navigation}){
Modifique sus datos
</Heading>
<VStack space={3} mt="5">
<FormControl>
<FormControl.Label>DNI</FormControl.Label>
<TextInput type="text" defaultValue={userData.user.dni} editable='false'/>
</FormControl>
<FormControl>
<FormControl.Label>Nombre</FormControl.Label>
<Input type="text"/>
<TextInput style={styles.input} type="text" defaultValue={userData.user.name}/>
</FormControl>
<FormControl>
<FormControl.Label>Correo Electrónico</FormControl.Label>
<Input type="text" />
<FormControl.Label>Apellido</FormControl.Label>
<TextInput style={styles.input} type="text"defaultValue={userData.user.last_name} />
</FormControl>
<FormControl>
<FormControl.Label>Teléfono</FormControl.Label>
<Input type="text" />
<FormControl.Label>Correo electrónico</FormControl.Label>
<TextInput style={styles.input} type="text" defaultValue={userData.user.email}/>
</FormControl>
<FormControl>
<FormControl.Label>Contraseña actual</FormControl.Label>
<Input type="password" />
<TextInput style={styles.input} type="password" defaultValue=""/>
</FormControl>
<Button mt="2" backgroundColor="orange.300">
@ -54,7 +66,29 @@ export default function Profile({route, navigation}){
</Button>
</VStack>
</Box>
</ScrollView>
</Center>
)
}
}
const styles = StyleSheet.create({
input: {
height: 10,
margin:3,
borderWidth: 0.5,
padding: 5,
flex: 1,
paddingTop: 9,
paddingRight: 19,
paddingBottom: 20,
paddingLeft: 0,
marginTop: 6,
marginBottom:6,
borderRadius: 4
}
})