import React from 'react'; import { StyleSheet, Text, View, TextInput, Alert, Pressable } from 'react-native'; import DepenseListEntry from '../depense_list_entry'; import { strLPad } from '../../utils/util'; import { LinearGradient } from 'expo-linear-gradient'; export default function DayList(props) { const [ showDepenses, onToggleDepenses] = React.useState(false); let content = [] let total = 0; var currentDay = new Date(); let isCurrentday = ( currentDay.getFullYear() === props.date.getFullYear() && currentDay.getMonth() === props.date.getMonth() && currentDay.getDate() === props.date.getDate()); props.depenses.forEach( function(depense){ content.push( ) total += depense.value; }); let scale = Math.min(1, total/props.dailyObjective) let result = props.dailyObjective - total let text_color = "#000000"; let bg_color = "#FFFFFF"; if( result > 0) text_color = "#00"+parseInt(100 + (result / props.dailyObjective) * 100).toString(16) + "00" else bg_color = "#FF"+ strLPad(parseInt(255 + Math.max(-255,(result / props.dailyObjective) * 100)).toString(16), 2, '0') + strLPad(parseInt(255 + Math.max(-255, (result / props.dailyObjective) * 100)).toString(16), 2, '0') return ( 0 ? '#FFDDDDFF' : '#FFFFFF','#FFFFFF', '#FFFFFF']} locations={[scale, scale+0.05, 1]} end={{x:1,y:0}} style={day_list_styles.background} /> {onToggleDepenses(!showDepenses)}}> {props.date.toDateString()} {"Total : "+total} {showDepenses || isCurrentday ? content : } ) } const day_list_styles = StyleSheet.create({ day_list_container: { // borderWidth: 1, // margin: 1, // marginTop: 5, // marginBottom: 15, // elevation: 5, }, current_day_container: { shadowColor: "#0000FF", shadowOffset: { width: 0, height: 10, }, shadowOpacity: 0, shadowRadius: 10, elevation: 10, }, day_list_entry: { display: 'flex', flexDirection: 'row', justifyContent: 'space-between', marginBottom: 10, }, day_list_day: { fontWeight: '900', margin: 4, }, background: { position: 'absolute', width: '100%', height: "100%", } });