rawalcher/interaktive-systeme
Archived
1
0
Fork 0
Code Issues 5 Pull requests 2 Projects Releases 14 Packages Wiki Activity Actions

implemented plus button on budget screen and routing for the plus button

Browse source
This commit is contained in:
thschleicher 2024-01-02 10:14:36 +01:00 • committed by Jakob Stornig
parent 85c737e66c
commit 6ee1c01d6a
6 changed files with 45 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

21
app/(tabs)/budget/index.tsx
View file

@ -1,9 +1,10 @@
import AsyncStorage from '@react-native-async-storage/async-storage';
import { router } from 'expo-router';
import { useEffect, useState } from 'react';
import { StyleSheet, View } from 'react-native';
import { FlatList } from 'react-native-gesture-handler';
import { SafeAreaView } from 'react-native-safe-area-context';
import { BudgetHeader, LoadingSymbol } from '../../../components';
import { BudgetHeader, LoadingSymbol, Plus } from '../../../components';
import CategoryItem from '../../../components/budget/categoryItem';
import useFetch from '../../../hooks/useFetch';
import { useThemeColor } from '../../../hooks/useThemeColor';
@ -26,7 +27,7 @@ export default function Page() {
const {data, isLoading, reFetch} = useFetch({sql: "SELECT guid as category_guid, name as category_name, color as category_color FROM category WHERE type = ?", args: selectedPage === "expenses" ? ["expense"] : selectedPage === "savings" ? ["saving"] : []});
useEffect(() => {
console.log("reFetch()");
console.log("reFetch()"); //REFETCH LOG
reFetch();
}, [selectedPage]);
@ -40,10 +41,15 @@ export default function Page() {
return (
<SafeAreaView style={[styles.safeAreaViewStyle, {backgroundColor: containerColor}]}>
<BudgetHeader selectedPage={selectedPage} handlePageSelection={handlePageSelection}/>
<Plus onPress={() => {
router.push("./(tabs)/budget/addCategory")
}}/>
{isLoading ? (<LoadingSymbol/>) : (
<FlatList
data={data}
renderItem = {({item}) => <CategoryItem category={item.category_name} allocated_ammount={100} color={item.category_color} category_guid={item.category_guid}/>}
renderItem = {({item}) => <CategoryItem category={item.category_name} allocated_ammount={100} color={item.category_color} category_guid={item.category_guid} total_expenses={calculateSumOfCategory(item.guid, data)}/>}
keyExtractor={item => item.category_guid}
ItemSeparatorComponent={() => {
return (<View style={styles.itemSeperatorStyle}/>);
@ -54,6 +60,15 @@ export default function Page() {
);
}
const calculateSumOfCategory = (guid: string, data: {[column: string]: any;}[]): number => {
return 10;
}
const styles = StyleSheet.create({
safeAreaViewStyle: {
flex: 1,