feat: edit expense
This commit is contained in:
parent
deda54152b
commit
5b71fa74b1
11 changed files with 273 additions and 41 deletions
|
|
@ -3,35 +3,53 @@ import { ColorValue, StyleSheet, Text, View } from 'react-native';
|
|||
import { SIZES } from '../../constants/theme';
|
||||
import CustomCard from "../common/CustomCard";
|
||||
import { useTheme } from '../../app/contexts/ThemeContext';
|
||||
import { TouchableOpacity } from 'react-native-gesture-handler';
|
||||
|
||||
//export type ExpenseItemProps = {color: ColorValue, category: string, title: string, date: string, value : string}
|
||||
interface ExpenseItemProps {
|
||||
color: ColorValue;
|
||||
category: string;
|
||||
title: string;
|
||||
date: string;
|
||||
value : string;
|
||||
guid? : string;
|
||||
onPress? : (guid?: string) => void
|
||||
}
|
||||
|
||||
export type ExpenseItemProps = {color: ColorValue, category: string, title: string, date: string, value : string}
|
||||
export default function ExpenseItem(itemProps : ExpenseItemProps) {
|
||||
const { colors } = useTheme();
|
||||
const handlePress = ()=>{
|
||||
if(itemProps.onPress){
|
||||
itemProps.onPress(itemProps.guid);
|
||||
}
|
||||
}
|
||||
return (
|
||||
<CustomCard>
|
||||
<View style={styles.tile}>
|
||||
<View style={[styles.colorTip, {backgroundColor: itemProps.color}]}></View>
|
||||
<View style={[styles.textSection, {backgroundColor: colors.backgroundColor}]}>
|
||||
<Text style={{
|
||||
fontSize: SIZES.normal,
|
||||
color: colors.primaryText
|
||||
}} numberOfLines={1}>{itemProps.category}</Text>
|
||||
<Text style={{
|
||||
fontSize: SIZES.large,
|
||||
color: colors.primaryText
|
||||
}} numberOfLines={1}>{itemProps.title}</Text>
|
||||
<Text style={{
|
||||
fontSize: SIZES.small,
|
||||
color: colors.primaryText
|
||||
}} numberOfLines={1}>{itemProps.date}</Text>
|
||||
<TouchableOpacity onPress={handlePress}>
|
||||
<View style={styles.tile}>
|
||||
<View style={[styles.colorTip, {backgroundColor: itemProps.color}]}></View>
|
||||
<View style={[styles.textSection, {backgroundColor: colors.backgroundColor}]}>
|
||||
<Text style={{
|
||||
fontSize: SIZES.normal,
|
||||
color: colors.primaryText
|
||||
}} numberOfLines={1}>{itemProps.category}</Text>
|
||||
<Text style={{
|
||||
fontSize: SIZES.large,
|
||||
color: colors.primaryText
|
||||
}} numberOfLines={1}>{itemProps.title}</Text>
|
||||
<Text style={{
|
||||
fontSize: SIZES.small,
|
||||
color: colors.primaryText
|
||||
}} numberOfLines={1}>{itemProps.date}</Text>
|
||||
</View>
|
||||
<View style={[styles.valueSection, {backgroundColor: colors.backgroundColor}]}>
|
||||
<Text style={{
|
||||
fontSize: SIZES.xxLarge,
|
||||
color: colors.primaryText
|
||||
}} numberOfLines={1}>{itemProps.value}</Text>
|
||||
</View>
|
||||
</View>
|
||||
<View style={[styles.valueSection, {backgroundColor: colors.backgroundColor}]}>
|
||||
<Text style={{
|
||||
fontSize: SIZES.xxLarge,
|
||||
color: colors.primaryText
|
||||
}} numberOfLines={1}>{itemProps.value}</Text>
|
||||
</View>
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
</CustomCard>
|
||||
|
||||
)
|
||||
|
|
|
|||
Reference in a new issue