parent
3ac1dd6b9d
commit
3e318a28e2
@ -0,0 +1,58 @@
|
||||
import React, { FC, useEffect, useState } from 'react'
|
||||
import { Card } from '../Card'
|
||||
import { FlatList, Text, TouchableOpacity } from 'react-native'
|
||||
import { useFetchWithAuth } from '../../hooks/useFetchWithAuth'
|
||||
import { useNavigation } from '@react-navigation/native';
|
||||
|
||||
interface Props {
|
||||
endpoint: string
|
||||
}
|
||||
|
||||
export const CardList:FC <Props> = ({endpoint}) => {
|
||||
|
||||
const navitation = useNavigation();
|
||||
|
||||
let defaultData:[] = [];
|
||||
|
||||
const [entities, setEntities] = useState(defaultData);
|
||||
|
||||
|
||||
const getInitData = async () => {
|
||||
|
||||
const { data, error } = await useFetchWithAuth(endpoint);
|
||||
|
||||
if (!error) {
|
||||
setEntities(data);
|
||||
} else {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getInitData();
|
||||
}, [endpoint])
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
<FlatList
|
||||
data={entities}
|
||||
renderItem={({item}) =>
|
||||
<Card>
|
||||
<TouchableOpacity
|
||||
onPress={()=>navitation.navigate("CustomerFormScreen" as never)}
|
||||
>
|
||||
<Text>
|
||||
{item["nombre"]}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
</Card>
|
||||
}
|
||||
keyExtractor={item => item["id"]}
|
||||
/>
|
||||
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
@ -0,0 +1,36 @@
|
||||
import AsyncStorage from '@react-native-async-storage/async-storage'
|
||||
|
||||
const fecher = async (url: string, token: string) => {
|
||||
return await fetch(url, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
"Authorization":token
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
export const useFetchWithAuth = async (url: string) => {
|
||||
|
||||
url= "http://192.168.1.21:8082/api/"+url+"/";
|
||||
const token = await AsyncStorage.getItem("token") || "";
|
||||
let data;
|
||||
let error;
|
||||
try{
|
||||
const response = await fecher(url, token)
|
||||
if (response.ok){
|
||||
data = await response.json();
|
||||
}else {
|
||||
|
||||
error = "Servidor: "+ ((await response.json()).trace);
|
||||
}
|
||||
}catch (e){
|
||||
error = "Cliente: "+e;
|
||||
}
|
||||
|
||||
return {
|
||||
data,
|
||||
error
|
||||
}
|
||||
|
||||
}
|
@ -1,23 +1,38 @@
|
||||
import { FC } from 'react'
|
||||
import { Text } from 'react-native'
|
||||
import { FlatList, Text, View } from 'react-native'
|
||||
import { Background } from '../../components/Background'
|
||||
import { Card } from '../../components/Card'
|
||||
import { Input } from '../../components/Input'
|
||||
import { Button } from '../../components/Button'
|
||||
import { useNavigation } from '@react-navigation/native';
|
||||
import { CardList } from '../../components/cardList/CardList'
|
||||
|
||||
interface Props {
|
||||
}
|
||||
|
||||
export const CustomerListScreen:FC <Props> = () => {
|
||||
const navigation = useNavigation();
|
||||
|
||||
return (
|
||||
<Background >
|
||||
<View className=''>
|
||||
<Button title=' + ' additionalStyle='z-10 absolute bottom-2 right-0' onClick={()=>navigation.navigate("CustomerFormScreen" as never)} />
|
||||
<FlatList
|
||||
data={[""]}
|
||||
renderItem={({item}) =>
|
||||
<View id={item} className='flex-1 items-center'>
|
||||
<Card>
|
||||
<Text className='text-xl text-center my-4'>Listado de clientes</Text>
|
||||
<Button title='Nuevo' onClick={()=>navigation.navigate("CustomerFormScreen" as never)} />
|
||||
<CardList endpoint='cliente'/>
|
||||
</Card>
|
||||
|
||||
</Background>
|
||||
</View>
|
||||
|
||||
}
|
||||
keyExtractor={item => item}
|
||||
|
||||
/>
|
||||
|
||||
</View>
|
||||
|
||||
|
||||
)
|
||||
}
|
Loading…
Reference in new issue