Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.

depenses_list.js 6.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
  1. import React, { useEffect } from 'react';
  2. import { StyleSheet, Text, View, TextInput, FlatList, SafeAreaView, ColorPropType } from 'react-native';
  3. import { ScrollView } from 'react-native-gesture-handler';
  4. import { sqlite_exec_query } from '../db/query';
  5. import DepenseListEntry from './depense_list_entry';
  6. import DayList from './list/day_list';
  7. import WeekList from './list/week_list';
  8. 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;};
  9. var getWeek=function(i_date){
  10. var first_day = new Date(i_date.getFullYear(),0,1)
  11. return Math.ceil(((i_date-first_day+ (first_day.getDay()-1) * 86400000)/86400000)/7)}
  12. function DepensesList(props)
  13. {
  14. const [depenses, onGetDepenses] = React.useState([]);
  15. const [depensesFetched, preventFetchDepenses] = React.useState(false)
  16. let fetchDepenses = props.fetchDepenses || !depensesFetched
  17. useEffect( () => {
  18. sqlite_exec_query(`create table if not exists expense (id integer primary key not null, value real, description text, date integer);`,(res)=>{
  19. if(fetchDepenses)
  20. sqlite_exec_query("select * from expense order by date desc", (res) => {
  21. onGetDepenses(res.rows._array);
  22. preventFetchDepenses(true);
  23. props.depensesFetched();
  24. });
  25. });
  26. });
  27. let content = []
  28. if(depenses.length > 0)
  29. {
  30. // get latest and oldest depense
  31. let latest_depense = depenses[0];
  32. let oldest_depense = depenses[depenses.length - 1]
  33. let curDate = new Date(latest_depense.date);
  34. let oldestDate = new Date(oldest_depense.date);
  35. let days = getDaysArray(oldestDate, curDate )
  36. days.reverse();
  37. let data = [];
  38. let renderItem = null;
  39. switch(props.durationMode)
  40. {
  41. case "days":
  42. days.forEach( (day) => {
  43. // get depenses that are on the current day
  44. var depenses_day = depenses.filter( obj => {
  45. var tpDate = new Date(obj.date);
  46. return tpDate.getUTCFullYear() == day.getUTCFullYear() && tpDate.getUTCMonth() == day.getUTCMonth() && tpDate.getUTCDate() == day.getUTCDate()
  47. } )
  48. data.push(
  49. {
  50. date: day,
  51. depenses: depenses_day,
  52. dailyObjective: props.dailyObjective,
  53. id: "day_"+day.toISOString()
  54. })
  55. });
  56. renderItem = ({item}) =>(
  57. <DayList
  58. dailyObjective={props.dailyObjective}
  59. fetchDepenses={() => preventFetchDepenses(false)}
  60. date={item.date}
  61. depenses={item.depenses}/>
  62. );
  63. content = (
  64. <FlatList
  65. data={data}
  66. renderItem={renderItem}
  67. keyExtractor={item => item.id}/>
  68. )
  69. break;
  70. case "weeks":
  71. // dont forget the list of days is ordered latest to oldest
  72. let week_number = getWeek(days[0]);
  73. let week = {
  74. id:week_number+"_"+days[0].getFullYear(),
  75. days: [],
  76. number: week_number,
  77. }
  78. data.push(week);
  79. days.forEach( (day) => {
  80. week_number = getWeek(day);
  81. if( week_number+"_"+day.getFullYear() == week.id)
  82. week.days.push(
  83. {
  84. date:day,
  85. expenses: depenses.filter( obj => {
  86. var tpDate = new Date(obj.date);
  87. return tpDate.getFullYear() == day.getFullYear() && tpDate.getMonth() == day.getMonth() && tpDate.getDate() == day.getDate()
  88. } )
  89. });
  90. else
  91. {
  92. week = {
  93. id:week_number+"_"+day.getFullYear(),
  94. days: [
  95. {
  96. date:day,
  97. expenses: depenses.filter( obj => {
  98. var tpDate = new Date(obj.date);
  99. return tpDate.getFullYear() == day.getFullYear() && tpDate.getMonth() == day.getMonth() && tpDate.getDate() == day.getDate()
  100. } )
  101. }
  102. ],
  103. number: week_number,
  104. }
  105. data.push(week);
  106. }
  107. });
  108. renderItem = ({item}) =>(
  109. <WeekList
  110. dailyObjective={props.dailyObjective}
  111. days={item.days}
  112. number={item.number}
  113. fetchDepenses={() => preventFetchDepenses(false)}
  114. />
  115. );
  116. content = (
  117. <FlatList
  118. data={data}
  119. renderItem={renderItem}
  120. keyExtractor={item => item.id}/>
  121. )
  122. break;
  123. default:
  124. content = <Text> This does not work yet :(</Text>
  125. }
  126. }else
  127. content = <Text> Start adding expenses ! </Text>
  128. return(
  129. <SafeAreaView >
  130. {content}
  131. </SafeAreaView >
  132. )
  133. }
  134. const depense_list_style = StyleSheet.create({
  135. });
  136. export default DepensesList