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

Connect communities and login

This commit is contained in:
Maria Sanchez 2022-08-22 14:22:27 -06:00
parent ee456580d3
commit 88ca9b6f11
10 changed files with 284 additions and 20233 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
.DS_Store vendored
View File

Binary file not shown.

2
mobile-ui/.gitignore vendored
View File

@ -10,4 +10,4 @@ npm-debug.*
web-build/
.vscode
.DS_Store
package-lock.json

43
mobile-ui/App.js
View File

@ -1,4 +1,4 @@
import React,{useState} from "react";
import React, { useContext, useState } from "react";
import {
NativeBaseProvider,
Icon
@ -13,6 +13,7 @@ import Reservas from "./components/Reservas";
import Profile from "./components/Profile";
import { MaterialCommunityIcons } from '@expo/vector-icons';
import AreaComun from "./components/AreaComun";
import { UserContext, UserContextProvider } from "./context/UserContext";
const Stack = createNativeStackNavigator();
const Tab = createBottomTabNavigator();
@ -20,45 +21,51 @@ const Tab = createBottomTabNavigator();
function HomeTab({ route }) {
const { user } = useContext(UserContext);
const [selected, setSelected] = useState(0);
const user = route.params;
// console.log(user);
return (
<Tab.Navigator params={user} initialRouteName="Comunicados" >
<Tab.Screen name="Comunicados" component={Home} initialParams={user} options={{headerStyle: {
<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)}
}, 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 } initialParams={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} initialParams={user} options={{headerStyle: {
}, 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} 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)} />
}, tabBarIcon: () => (<Icon mb="2" as={<MaterialCommunityIcons name={selected === 2 ? 'account' : 'account-outline'} />} color="#D7A86E" size="md" />)
}} onclick={() => setSelected(2)} />
</Tab.Navigator>
)
}
export default function App() {
return (
<NativeBaseProvider>
<UserContextProvider>
<NavigationContainer>
<Stack.Navigator initialRouteName="LogIn">
<Stack.Screen name="Inicio" component={LogIn} options={{headerStyle: {
<Stack.Screen name="Inicio" component={LogIn} options={{
headerStyle: {
backgroundColor: "#D7A86E"
}}} />
}
}} />
<Stack.Screen name="Comunicados" component={HomeTab} options={{ headerShown: false }} />
<Stack.Screen name="Password" component={RecoverPassword} />
<Stack.Screen name="area" component={AreaComun} options={{headerStyle: {
<Stack.Screen name="area" component={AreaComun} options={{
headerStyle: {
backgroundColor: "#D7A86E"
}}} />
}
}} />
</Stack.Navigator>
</NavigationContainer>
</UserContextProvider>
</NativeBaseProvider>
);
}

51
mobile-ui/components/CommentCard/index.js Normal file
View File

@ -0,0 +1,51 @@
import { format } from "date-fns";
import {
Badge,
Box, HStack, Pressable,
Spacer, Text
} from "native-base";
import PropTypes from 'prop-types';
import React from 'react';
export const CommentCard = ({ date, comment }) => {
const dateFormated = format(new Date(date), "dd LL yyyy")
return (
<Pressable
rounded="8"
overflow="hidden"
borderWidth="1"
borderColor="coolGray.300"
maxW="96"
shadow="3"
bg="coolGray.100"
p="5"
marginTop="4"
>
<Box>
<HStack alignItems="center">
<Badge colorScheme="darkBlue" _text={{
color: "white"
}} variant="solid" rounded="4">
Comunicado
</Badge>
<Spacer />
<Text fontSize={10} color="coolGray.800">
{dateFormated}
</Text>
</HStack>
<Text color="coolGray.800" mt="3" fontWeight="medium" fontSize="xl">
Administrador de Comunidad
</Text>
<Text mt="2" fontSize="sm" color="coolGray.700">
{comment}
</Text>
</Box>
</Pressable>
)
}
CommentCard.propTypes = {
date: PropTypes.string.isRequired,
comment: PropTypes.string.isRequired,
}

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

@ -1,17 +1,48 @@
import React from "react";
import {
Text,
HStack,
Badge,
Box,
Pressable,
Spacer,
ScrollView
Box, ScrollView
} from "native-base";
import { MaterialCommunityIcons } from '@expo/vector-icons';
export default function Home(){
import React, { useContext, useEffect, useState } from "react";
import { UserContext } from "../context/UserContext";
import { API } from "../environment/api";
import { CommentCard } from "./CommentCard";
export default function Home() {
const { user } = useContext(UserContext)
const [isRequesting, setIsRequesting] = useState(false);
const [comments, setComments] = useState([]);
useEffect(() => {
const onRequestCommentsData = async () => {
console.log("CALLED?")
setIsRequesting(true);
try {
const jsonResponse = await fetch(`${API.BASE_URL}/post/allComments`, {
method: "GET",
headers: {
'Content-Type': 'application/json'
}
})
const response = await jsonResponse.json();
console.log(response);
setComments(response.message);
} catch (error) {
}
setIsRequesting(false)
}
onRequestCommentsData()
}, [user])
const [selected, setSelected] = React.useState(0);
return (
<Box alignItems="center">
@ -21,68 +52,18 @@ export default function Home(){
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">
<Badge colorScheme="darkBlue" _text={{
color: "white"
}} variant="solid" rounded="4">
Comunicado
</Badge>
<Spacer />
<Text fontSize={10} color="coolGray.800">
1 month ago
</Text>
</HStack>
<Text color="coolGray.800" mt="3" fontWeight="medium" fontSize="xl">
Administrador de Comunidad
</Text>
<Text mt="2" fontSize="sm" color="coolGray.700">
Notificacion sobre la aplicacion
</Text>
</Box>
</Pressable>
{
comments.map(item => (
<CommentCard
key={item._id}
comment={item.comment}
date={item.date_entry}
/>
))
}
</ScrollView>
</Box>
// <Center width={"100%"} marginTop={"auto"}>
// <Box safeAreaTop bg="#D7A86E" flex={1} />
// <HStack bg="#D7A86E" px="2" py="4" justifyContent="space-between" alignItems="center" w="100%" maxW="100%">
// <Pressable opacity={selected === 0 ? 1 : 0.5} py="3" flex={1} onPress={() => setSelected(0) && navigation.navigate('Home')}>
// <Center>
// <Icon mb="2" as={<MaterialCommunityIcons name={selected === 0 ? 'home' : 'home-outline'} />} color="white" size="md" />
// <Text color="white" fontSize="15">
// Inicio
// </Text>
// </Center>
// </Pressable>
// <Pressable opacity={selected === 1 ? 1 : 0.5} py="3" flex={1} onPress={() => setSelected(1) && ( () => navigation.navigate('Reservas'))}>
// <Center>
// <Icon mb="2" as={<MaterialCommunityIcons name={selected === 1 ? 'tree' : 'tree-outline'} />} color="white" size="md" />
// <Text color="white" fontSize="15">
// Reservas
// </Text>
// </Center>
// </Pressable>
// <Pressable opacity={selected === 2 ? 1 : 0.5} py="3" flex={1} onPress={() => setSelected(2)}>
// <Center>
// <Icon mb="2" as={<MaterialCommunityIcons name={selected === 2 ? 'account' : 'account-outline'} />} color="white" size="md" />
// <Text color="white" fontSize="15">
// Perfil
// </Text>
// </Center>
// </Pressable>
// </HStack>
// </Center>
)
}

62
mobile-ui/components/LogIn.js
View File

@ -1,4 +1,4 @@
import React, {useState} from "react";
import React, { useContext, useState } from "react";
import Cookies from 'universal-cookie';
import {
Text,
@ -15,8 +15,10 @@ import logo from "../assets/logo-katoikia.png";
import { Entypo } from '@expo/vector-icons';
import { MaterialCommunityIcons } from '@expo/vector-icons';
import { View, TextInput, StyleSheet } from "react-native";
import { UserContext } from "../context/UserContext";
import { API } from "../environment/api";
const baseURL = "http://localhost:4000/user/loginUser";
const baseURL = `${API.BASE_URL}/user/loginUser`;
const cookies = new Cookies();
// const handleChange = (value) => {
@ -26,29 +28,24 @@ const cookies = new Cookies();
export default function LogIn({ navigation }) {
const [email, setEmail] = useState();
const [password, setPassword] = useState();
// const [inputs, setInputs] = useState();
const { addUser } = useContext(UserContext);
const [credentials, setCredentials] = useState({
email: "",
password: ""
});
const onHandleChange = (name) => (value) => setCredentials(prev => ({ ...prev, [name]: value }))
const iniciarSesion = async () => {
console.log(email);
const userData = {
email: "lalo@lalo.com",
password: '12345'
}
console.log(userData);
// const userData = JSON.stringify(FormControl.toString);
// console.log(userData);
console.log(credentials)
try {
await fetch(baseURL, {
cache: 'no-cache',
method: 'POST',
body: JSON.stringify(userData),
body: JSON.stringify(credentials),
headers: {
'Content-Type': 'application/json'
}
@ -64,18 +61,12 @@ export default function LogIn({navigation}) {
// inqulino 4 y guarda 63
const user = response.message
//console.log(user);
cookies.set('id',user._id, {path: "/"} )
cookies.set('name',user.name, {path: "/"} )
cookies.set('email',user.email, {path: "/"} )
cookies.set('type',user.user_type, {path: "/"} )
if(user.user_type == '4'){
}else if(user.user_type == '3'){
navigation.navigate('Comunicados', {user})
addUser(user);
navigation.navigate('Comunicados')
}
})
@ -83,7 +74,6 @@ export default function LogIn({navigation}) {
console.log("ERROR: " +error);
}
}
return (
@ -129,7 +119,13 @@ export default function LogIn({navigation}) {
<View style={styles.viewSection}>
<Entypo name="email" size={20} color="grey" style={styles.iconStyle} />
<TextInput name='email' type="text" style={styles.input} placeholder='Correo electrónico' onChangeText={(value) => setEmail(value) } />
<TextInput
name='email'
type="text"
style={styles.input}
value={credentials.email}
placeholder='Correo electrónico'
onChangeText={onHandleChange("email")} />
</View>
</FormControl>
@ -137,7 +133,13 @@ export default function LogIn({navigation}) {
<FormControl.Label Text='bold'> Contraseña </FormControl.Label>
<View style={styles.viewSection}>
<MaterialCommunityIcons name="form-textbox-password" size={20} color="grey" style={styles.iconStyle} />
<TextInput name='password' type="password" style={styles.input} placeholder='Contraseña' onChangeText={(value) => setPassword(value)} />
<TextInput
name='password'
type="password"
style={styles.input}
value={credentials.password}
placeholder='Contraseña'
onChangeText={onHandleChange("password")} />
</View>
<Link
_text={{
@ -156,7 +158,7 @@ export default function LogIn({navigation}) {
</Link>
</FormControl>
<Button mt="2" backgroundColor="#D7A86E" onPress={() => iniciarSesion()}
<Button mt="2" backgroundColor="#D7A86E" onPress={iniciarSesion}
>
<Text>Continuar</Text>
</Button>

23
mobile-ui/context/UserContext.js Normal file
View File

@ -0,0 +1,23 @@
import React, { createContext, useState } from 'react'
export const UserContext = createContext({});
export const UserContextProvider = ({ children }) => {
const [user, setUser] = useState(null);
const addUser = (user) => setUser(user);
const removeUser = () => setUser(null);
const value = {
user,
addUser,
removeUser
}
return (
<UserContext.Provider value={value}>
{children}
</UserContext.Provider>
)
}

5
mobile-ui/environment/api.js Normal file
View File

@ -0,0 +1,5 @@
export class API {
static BASE_URL = "http://10.0.2.2:4000"
}

20020
mobile-ui/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

2
mobile-ui/package.json
View File

@ -22,9 +22,11 @@
"@react-navigation/native": "^6.0.11",
"@react-navigation/native-stack": "^6.7.0",
"@react-navigation/stack": "^6.2.2",
"date-fns": "^2.29.2",
"expo": "^44.0.0",
"expo-status-bar": "~1.2.0",
"native-base": "3.4.0",
"prop-types": "^15.8.1",
"react": "17.0.1",
"react-dom": "17.0.1",
"react-native": "0.64.3",