You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

day_list.js 1.9KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. import React from 'react';
  2. import { StyleSheet, Text, View, TextInput, Alert, Pressable } from 'react-native';
  3. import DepenseListEntry from '../depense_list_entry';
  4. export default function DayList(props)
  5. {
  6. const [ showDepenses, onToggleDepenses] = React.useState(true);
  7. let content = []
  8. let total = 0;
  9. props.depenses.forEach( function(depense){
  10. content.push(
  11. <DepenseListEntry fetchDepenses={props.fetchDepenses} key={"depense_list_depense"+depense.id} depense={depense}/>
  12. )
  13. total += depense.value;
  14. });
  15. let result = props.dailyObjective - total
  16. let text_color = "#000000";
  17. let bg_color = "#FFFFFF";
  18. if( result > 0)
  19. text_color = "#00"+parseInt(100 + (result / props.dailyObjective) * 100).toString(16) + "00"
  20. else
  21. bg_color = "#FF"+
  22. parseInt(255 + (result / props.dailyObjective) * 100).toString(16) +
  23. parseInt(255 + (result / props.dailyObjective) * 100).toString(16)
  24. return (
  25. <View style={[day_list_styles.day_list_container, {backgroundColor: bg_color}]}>
  26. <Pressable
  27. style={day_list_styles.day_list_entry}
  28. onPress={() => {onToggleDepenses(!showDepenses)}}>
  29. <Text style={day_list_styles.day_list_day}>{props.date.toDateString()}</Text>
  30. <Text style={[day_list_styles.day_list_day, {color: text_color}]}>{"Total : "+total}</Text>
  31. </Pressable>
  32. {showDepenses ? content : <View/>}
  33. </View>
  34. )
  35. }
  36. const day_list_styles = StyleSheet.create({
  37. day_list_container: {
  38. borderWidth: 1,
  39. margin: 1,
  40. },
  41. day_list_entry: {
  42. display: 'flex',
  43. flexDirection: 'row',
  44. justifyContent: 'space-between',
  45. marginTop: 5,
  46. },
  47. day_list_day: {
  48. fontWeight: '900',
  49. margin: 4,
  50. }
  51. });