import React, { useEffect } from 'react'; import { StyleSheet, Text, View, TextInput, FlatList, SafeAreaView, ColorPropType } from 'react-native'; import { ScrollView } from 'react-native-gesture-handler'; import { sqlite_exec_query } from '../db/query'; import DepenseListEntry from './depense_list_entry'; import DayList from './list/day_list'; import WeekList from './list/week_list'; var getDaysArray = function(s,e) {for(var a=[],d=new Date(s);d<=e.setHours(23,59,59);d.setDate(d.getDate()+1)){ a.push(new Date(d));}return a;}; var getWeek=function(i_date){ var first_day = new Date(i_date.getFullYear(),0,1) return Math.ceil(((i_date-first_day+ (first_day.getDay()-1) * 86400000)/86400000)/7)} function DepensesList(props) { const [depenses, onGetDepenses] = React.useState([]); const [depensesFetched, preventFetchDepenses] = React.useState(false) let fetchDepenses = props.fetchDepenses || !depensesFetched useEffect( () => { sqlite_exec_query(`create table if not exists expense (id integer primary key not null, value real, description text, date integer);`,(res)=>{ if(fetchDepenses) sqlite_exec_query("select * from expense order by date desc", (res) => { onGetDepenses(res.rows._array); preventFetchDepenses(true); props.depensesFetched(); }); }); }); let content = [] if(depenses.length > 0) { // get latest and oldest depense let latest_depense = depenses[0]; let oldest_depense = depenses[depenses.length - 1] let curDate = new Date(latest_depense.date); let oldestDate = new Date(oldest_depense.date); let days = getDaysArray(oldestDate, curDate ) days.reverse(); let data = []; let renderItem = null; switch(props.durationMode) { case "days": days.forEach( (day) => { // get depenses that are on the current day var depenses_day = depenses.filter( obj => { var tpDate = new Date(obj.date); return tpDate.getUTCFullYear() == day.getUTCFullYear() && tpDate.getUTCMonth() == day.getUTCMonth() && tpDate.getUTCDate() == day.getUTCDate() } ) data.push( { date: day, depenses: depenses_day, dailyObjective: props.dailyObjective, id: "day_"+day.toISOString() }) }); renderItem = ({item}) =>( preventFetchDepenses(false)} date={item.date} depenses={item.depenses}/> ); content = ( item.id}/> ) break; case "weeks": // dont forget the list of days is ordered latest to oldest let week_number = getWeek(days[0]); let week = { id:week_number+"_"+days[0].getFullYear(), days: [], number: week_number, } data.push(week); days.forEach( (day) => { week_number = getWeek(day); if( week_number+"_"+day.getFullYear() == week.id) week.days.push( { date:day, expenses: depenses.filter( obj => { var tpDate = new Date(obj.date); return tpDate.getFullYear() == day.getFullYear() && tpDate.getMonth() == day.getMonth() && tpDate.getDate() == day.getDate() } ) }); else { week = { id:week_number+"_"+day.getFullYear(), days: [ { date:day, expenses: depenses.filter( obj => { var tpDate = new Date(obj.date); return tpDate.getFullYear() == day.getFullYear() && tpDate.getMonth() == day.getMonth() && tpDate.getDate() == day.getDate() } ) } ], number: week_number, } data.push(week); } }); renderItem = ({item}) =>( preventFetchDepenses(false)} /> ); content = ( item.id}/> ) break; default: content = This does not work yet :( } }else content = Start adding expenses ! return( {content} ) } const depense_list_style = StyleSheet.create({ }); export default DepensesList