Compare commits
4 Commits
| Author | SHA1 | Date |
|---|---|---|
 Freddy Heredia
|
7023a1fe45 | 2 years ago |
|
Freddy Heredia
|
070680add8 | 2 years ago |
|
Freddy Heredia
|
f81b0a9914 | 2 years ago |
|
Freddy Heredia
|
477d589aac | 2 years ago |
@ -1,4 +1,5 @@
|
||||
{
|
||||
"java.compile.nullAnalysis.mode": "automatic",
|
||||
"eslint.enable": false
|
||||
"eslint.enable": false,
|
||||
"java.configuration.updateBuildConfiguration": "automatic"
|
||||
}
|
||||
@ -0,0 +1,103 @@
|
||||
import { FC, useContext } from 'react'
|
||||
import { FlatList, Image, ScrollView, Text, TextInput, View } from 'react-native'
|
||||
import { SalesOrderContext } from '../screens/salesorder/SalesOrderContex';
|
||||
import { InputNumber } from './InputNumber';
|
||||
import NumericInput from 'react-native-numeric-input'
|
||||
import { CardItem } from './CardItem';
|
||||
import { Avatar } from '@ui-kitten/components';
|
||||
|
||||
const OneToMany = () => {
|
||||
|
||||
const { lines, setLines } = useContext(SalesOrderContext);
|
||||
|
||||
const setCantidad = (productoId: number, nuevaCantidad: number) => {
|
||||
|
||||
setLines(lines.map(line => {
|
||||
if (line.producto.id == productoId) {
|
||||
line.cantidad = nuevaCantidad;
|
||||
}
|
||||
return line;
|
||||
}))
|
||||
|
||||
}
|
||||
|
||||
const setPrecio = (productoId: number, nuevoPrecio: number) => {
|
||||
setLines(lines.map(line => {
|
||||
if (line.producto.id == productoId) {
|
||||
line.precio = nuevoPrecio;
|
||||
}
|
||||
return line;
|
||||
}))
|
||||
}
|
||||
|
||||
return (
|
||||
<ScrollView >
|
||||
<FlatList
|
||||
data={lines}
|
||||
renderItem={({ item }) =>
|
||||
<View className='flex-row'>
|
||||
<CardItem>
|
||||
<View className='flex-row'>
|
||||
<View>
|
||||
<Image
|
||||
source={{ uri: 'https://images.philips.com/is/image/PhilipsConsumer/271V8_69-IMS-en_HK?$jpglarge$&wid=1250' }}
|
||||
style={{
|
||||
width: 100,
|
||||
height: 80
|
||||
}}
|
||||
/>
|
||||
<NumericInput
|
||||
value={item.cantidad}
|
||||
onChange={value => setCantidad(item.producto.id, value)}
|
||||
onLimitReached={(isMax, msg) => console.log(isMax, msg)}
|
||||
minValue={1}
|
||||
totalWidth={100}
|
||||
totalHeight={50}
|
||||
iconSize={50}
|
||||
step={1}
|
||||
valueType='integer'
|
||||
rounded
|
||||
textColor='#B0228C'
|
||||
iconStyle={{ backgroundColor: 'white' }}
|
||||
rightButtonBackgroundColor='#1d4ed8'
|
||||
leftButtonBackgroundColor='#0ea5e9'
|
||||
type='plus-minus'
|
||||
/>
|
||||
</View>
|
||||
|
||||
<View className='mx-4'>
|
||||
<Text className='text-xl text-center'>{item.producto.nombre}</Text>
|
||||
<View className='flex-row justify-center'>
|
||||
<Text className=' my-2 font-bold text-black text-4xl text-center'>{item.precio * item.cantidad}</Text>
|
||||
<Text className=' my-2 ml-2 text-3xl text-left text-teal-500'>$</Text>
|
||||
</View>
|
||||
|
||||
<View className='flex-row items-center border-b-2 border-sky-500'>
|
||||
<TextInput
|
||||
id={'precio'}
|
||||
value={String(item.precio)}
|
||||
onChangeText={value => setPrecio(item.producto.id, Number(value))}
|
||||
placeholder={'Precio'}
|
||||
keyboardType="decimal-pad"
|
||||
className='p-2 h-10 text-right '
|
||||
/>
|
||||
<Text>/ unidad</Text>
|
||||
</View>
|
||||
|
||||
</View>
|
||||
|
||||
|
||||
</View>
|
||||
|
||||
</CardItem>
|
||||
|
||||
|
||||
|
||||
</View>
|
||||
}
|
||||
/>
|
||||
</ScrollView>
|
||||
)
|
||||
}
|
||||
|
||||
export default OneToMany
|
||||
@ -0,0 +1,4 @@
|
||||
interface Product {
|
||||
id: number;
|
||||
nombre: string;
|
||||
}
|
||||
@ -0,0 +1,63 @@
|
||||
import React, { FC, useContext } from 'react'
|
||||
import { FlatList, Text, TouchableOpacity, View } from 'react-native'
|
||||
|
||||
import { useNavigation } from '@react-navigation/native';
|
||||
|
||||
import { NativeStackNavigationProp } from '@react-navigation/native-stack';
|
||||
import { Avatar, Layout } from '@ui-kitten/components';
|
||||
import { CardItem } from '../../components/CardItem';
|
||||
import { SalesOrderContext } from './SalesOrderContex';
|
||||
|
||||
interface Props {
|
||||
entities: [],
|
||||
screenName: string,
|
||||
columnDisplay: string
|
||||
}
|
||||
|
||||
export const ProductItem: FC<Props> = ({ entities, screenName, columnDisplay }) => {
|
||||
|
||||
const navigation = useNavigation<NativeStackNavigationProp<any>>();
|
||||
const {lines, setLines, add} = useContext(SalesOrderContext);
|
||||
return (
|
||||
<>
|
||||
|
||||
<FlatList
|
||||
|
||||
data={entities}
|
||||
renderItem={({ item }) =>
|
||||
|
||||
<TouchableOpacity
|
||||
onPress={() => {
|
||||
// Pass and merge params back to home screen
|
||||
const newLine: SalesOrderLine = {
|
||||
producto: { id: item['id'], nombre: item["nombre"] },
|
||||
cantidad: 1,
|
||||
precio: item["precio"]
|
||||
}
|
||||
add(newLine)
|
||||
navigation.pop();
|
||||
}}
|
||||
>
|
||||
<CardItem>
|
||||
<View className='flex-row'>
|
||||
<Avatar
|
||||
size='giant'
|
||||
source={{ uri: 'https://images.philips.com/is/image/PhilipsConsumer/271V8_69-IMS-en_HK?$jpglarge$&wid=1250' }}
|
||||
/>
|
||||
<Text className='mx-4'>
|
||||
{item[columnDisplay]}
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
</CardItem>
|
||||
|
||||
</TouchableOpacity>
|
||||
|
||||
}
|
||||
keyExtractor={item => item["id"]}
|
||||
/>
|
||||
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
@ -0,0 +1,8 @@
|
||||
interface SalesOrder {
|
||||
id: number;
|
||||
numero: string;
|
||||
cliente: {
|
||||
id: number;
|
||||
};
|
||||
detalle: SalesOrderLine[];
|
||||
}
|
||||
@ -0,0 +1,37 @@
|
||||
import React, { createContext, useState } from 'react';
|
||||
import AsyncStorage from '@react-native-async-storage/async-storage';
|
||||
|
||||
|
||||
type SalesOrderContextProps = {
|
||||
lines: SalesOrderLine[],
|
||||
add: (newLine:SalesOrderLine)=>void,
|
||||
remove: (productId: number)=>void,
|
||||
setLines: (lines: SalesOrderLine[])=>void
|
||||
}
|
||||
|
||||
export const SalesOrderContext = createContext({} as SalesOrderContextProps);
|
||||
|
||||
export const SalesOrderProvider = ({ children }: {children: JSX.Element | JSX.Element[]})=> {
|
||||
|
||||
const [lines, setLines] = useState<SalesOrderLine[]>([]);
|
||||
|
||||
const add = (newLine:SalesOrderLine) => {
|
||||
setLines([...lines,newLine]);
|
||||
}
|
||||
|
||||
const remove = (productId:number) => {
|
||||
setLines(lines.filter(line => line.producto.id === productId));
|
||||
}
|
||||
|
||||
return (
|
||||
<SalesOrderContext.Provider value={{
|
||||
lines,
|
||||
add,
|
||||
remove,
|
||||
setLines
|
||||
}}>
|
||||
{ children }
|
||||
</SalesOrderContext.Provider>
|
||||
)
|
||||
}
|
||||
|
||||
@ -0,0 +1,6 @@
|
||||
interface SalesOrderLine {
|
||||
id?: number
|
||||
producto: Product,
|
||||
cantidad: number,
|
||||
precio: number
|
||||
}
|
||||
@ -1,63 +1,67 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import { useContext, useEffect, useState } from 'react'
|
||||
import { FlatList, RefreshControl, Text, View } from 'react-native'
|
||||
import { useNavigation } from '@react-navigation/native';
|
||||
import { Card } from '../../components/Card'
|
||||
import { CardList } from '../../components/cardList/CardList'
|
||||
import { Button } from '../../components/Button'
|
||||
import { useFetchWithAuth } from '../../hooks/useFetchWithAuth'
|
||||
import { SalesOrderContext } from './SalesOrderContex';
|
||||
|
||||
export const SalesOrderListScreen = () => {
|
||||
const navigation = useNavigation();
|
||||
const [refreshing, setRefreshing] = useState(false);
|
||||
const endpoints = "pedido";
|
||||
let defaultData: [] = [];
|
||||
|
||||
const { setLines } = useContext(SalesOrderContext);
|
||||
const [entities, setEntities] = useState(defaultData);
|
||||
|
||||
const getInitData = async () => {
|
||||
const { data, error } = await useFetchWithAuth(endpoints);
|
||||
if (!error) {
|
||||
setEntities(data);
|
||||
} else {
|
||||
console.log(error)
|
||||
}
|
||||
const { data, error } = await useFetchWithAuth(endpoints);
|
||||
if (!error) {
|
||||
setEntities(data);
|
||||
} else {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getInitData();
|
||||
getInitData();
|
||||
}, [refreshing])
|
||||
|
||||
const onRefresh = () => {
|
||||
setRefreshing(true);
|
||||
setTimeout(() => {
|
||||
setRefreshing(false);
|
||||
}, 1000);
|
||||
setRefreshing(true);
|
||||
setTimeout(() => {
|
||||
setRefreshing(false);
|
||||
}, 1000);
|
||||
};
|
||||
|
||||
return (
|
||||
<View className='bg-sky-100'>
|
||||
<Button
|
||||
title=' + '
|
||||
additionalStyle='z-10 absolute bottom-2 right-0'
|
||||
onPress={() => navigation.navigate("SalesOrderFormScreen" as never)} />
|
||||
<FlatList
|
||||
refreshControl={
|
||||
<RefreshControl
|
||||
refreshing={refreshing}
|
||||
onRefresh={onRefresh}
|
||||
<View className='bg-sky-100'>
|
||||
<Button
|
||||
title=' + '
|
||||
additionalStyle='z-10 absolute bottom-2 right-0'
|
||||
onPress={() => {
|
||||
setLines([]);
|
||||
navigation.navigate("SalesOrderFormScreen" as never)}
|
||||
} />
|
||||
<FlatList
|
||||
refreshControl={
|
||||
<RefreshControl
|
||||
refreshing={refreshing}
|
||||
onRefresh={onRefresh}
|
||||
/>
|
||||
}
|
||||
data={[""]}
|
||||
renderItem={({ item }) =>
|
||||
<View id={item} className='flex-1 items-center'>
|
||||
<Card>
|
||||
<Text className='text-xl text-center my-4'>Listado de pedidos</Text>
|
||||
<CardList screenName="SalesOrderFormScreen" columnDisplay="numero" entities={entities} />
|
||||
</Card>
|
||||
</View>
|
||||
}
|
||||
keyExtractor={item => item}
|
||||
/>
|
||||
}
|
||||
data={[""]}
|
||||
renderItem={({ item }) =>
|
||||
<View id={item} className='flex-1 items-center'>
|
||||
<Card>
|
||||
<Text className='text-xl text-center my-4'>Listado de pedidos</Text>
|
||||
<CardList screenName="SalesOrderFormScreen" columnDisplay="numero" entities={entities} />
|
||||
</Card>
|
||||
</View>
|
||||
}
|
||||
keyExtractor={item => item}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
Before Width: | Height: | Size: 15 KiB |
Loading…
Reference in new issue