n8r/rluv_client
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

Added working edit transaction

Browse Source
This commit is contained in:
Nathan Anderson
2023-07-22 21:29:32 -06:00
parent eba628bb4c
commit 18aad2b3d5
28 changed files with 1959 additions and 430 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/features/budget/screens/budget_overview.dart
+251 -223
View File
@@ -1,15 +1,21 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:helpers/helpers.dart';
import 'package:rluv/features/budget/screens/transactions_listview.dart';
import 'package:rluv/features/budget/widgets/add_transaction_dialog.dart';
import 'package:rluv/features/budget/widgets/budget_category_bar.dart';
import 'package:rluv/features/budget/widgets/budget_net_bar.dart';
import 'package:rluv/global/styles.dart';
import 'package:rluv/global/utils.dart';
import '../../../global/store.dart';
import '../../../models/transaction_model.dart';
import '../widgets/add_budget_category_dialog.dart';
class BudgetOverviewScreen extends ConsumerStatefulWidget {
const BudgetOverviewScreen({super.key});
const BudgetOverviewScreen({super.key, required this.initialData});
final Map<String, dynamic> initialData;
@override
ConsumerState<BudgetOverviewScreen> createState() =>
@@ -20,234 +26,256 @@ class _BudgetOverviewScreenState extends ConsumerState<BudgetOverviewScreen> {
final budgetListScrollController = ScrollController();
@override
Widget build(BuildContext context) {
final budgetCategoriesRef = ref.watch(Store().budgetCategoriesProvider);
final budgetCategories = ref.watch(Store().budgetCategoriesProvider);
final transactions = ref.watch(Store().transactionsProvider);
final screen = BuildMedia(context).size;
return budgetCategoriesRef.when(
data: ((budgetCategories) => RefreshIndicator(
onRefresh: () async {
final _ = await ref.refresh(Store().dashboardProvider.future);
},
double netExpense = 0.0;
double netIncome = 0.0;
Map<int, double> budgetCategoryNetMap = {};
netExpense = transactions
.where((t) => t.type == TransactionType.expense)
.fold(netExpense, (net, t) => net + t.amount);
netIncome = transactions
.where((t) => t.type == TransactionType.income)
.fold(netIncome, (net, t) => net + t.amount);
for (final bud in budgetCategories) {
double net = 0.0;
net = transactions
.where((t) => t.budgetCategoryId == bud.id)
.fold(net, (net, t) => net + t.amount);
budgetCategoryNetMap[bud.id!] = net;
}
return RefreshIndicator(
displacement: 20.0,
onRefresh: () async {
final family = ref.read(Store().familyProvider).valueOrNull;
final _ =
ref.read(Store().dashboardProvider.notifier).fetchDashboard(family);
},
child: Column(
children: [
/// TOP HALF, TITLE & OVERVIEW
Container(
height: screen.height * 0.3,
width: screen.width,
color: Styles.purpleNurple,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
/// TOP HALF, TITLE & OVERVIEW
Container(
height: screen.height * 0.33,
width: screen.width,
color: Styles.purpleNurple,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const Spacer(flex: 2),
Text(
formatDate(DateTime.now()),
style: const TextStyle(
fontSize: 16, color: Styles.electricBlue),
),
const Spacer(),
const Text('MONTHLY',
style: TextStyle(
fontSize: 42, color: Styles.electricBlue)),
const Spacer(flex: 2),
const BudgetNetBar(isPositive: true, net: 5024.64),
const Spacer(),
const BudgetNetBar(isPositive: false, net: 2004.37),
const Spacer(),
],
),
const Spacer(flex: 2),
Text(
formatDate(DateTime.now()),
style:
const TextStyle(fontSize: 16, color: Styles.electricBlue),
),
/// BOTTOM HALF, BUDGET BREAKDOWN
Expanded(
child: SizedBox(
width: screen.width,
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Padding(
padding: const EdgeInsets.all(14.0),
child: Container(
decoration: BoxDecoration(
color: Styles.blushingPink,
borderRadius: BorderRadius.circular(16.0),
),
child: Column(
children: [
const Padding(
padding: EdgeInsets.all(8.0),
child: Text(
'BUDGET',
style: TextStyle(
fontSize: 28,
color: Styles.electricBlue),
),
),
Scrollbar(
controller: budgetListScrollController,
thumbVisibility: true,
child: ListView(
controller: budgetListScrollController,
shrinkWrap: true,
children: [
for (final budget in budgetCategories)
Row(
children: [
Padding(
padding:
const EdgeInsets.all(8.0),
child: SizedBox(
width: 85,
child: Text(
budget.name,
style: const TextStyle(
fontSize: 16.0),
),
),
),
AnimatedContainer(
duration: const Duration(
milliseconds: 500),
child: Expanded(
child: Padding(
padding: const EdgeInsets.only(
right: 18.0),
child: Stack(
children: [
Container(
height: 30,
decoration: BoxDecoration(
color: Colors.black,
borderRadius:
BorderRadius
.circular(10.0),
),
),
Padding(
padding:
const EdgeInsets.all(
2.0),
child: Container(
height: 26,
decoration:
BoxDecoration(
color: Styles
.emptyBarGrey,
borderRadius:
BorderRadius
.circular(
10.0),
),
),
),
Padding(
padding:
const EdgeInsets.all(
2.0),
child: SizedBox(
height: 26,
child:
FractionallySizedBox(
heightFactor: 1.0,
widthFactor: 0.5,
child: Container(
decoration:
BoxDecoration(
color:
budget.color,
borderRadius:
BorderRadius
.circular(
10.0),
),
),
),
),
),
],
),
)),
)
],
),
const SizedBox(height: 20),
],
),
),
],
),
),
),
const Spacer(),
Padding(
padding: const EdgeInsets.only(bottom: 24.0),
child: Row(
children: [
Expanded(
child: Padding(
padding: const EdgeInsets.only(
left: 20.0, right: 15.0),
child: Container(
height: 70,
decoration: BoxDecoration(
color: Styles.seaweedGreen,
borderRadius: BorderRadius.circular(15.0),
),
child: InkWell(
child: const Center(
child: Padding(
padding: EdgeInsets.symmetric(
horizontal: 20.0, vertical: 14.0),
child: Text(
'Transaction History',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 25),
),
),
),
onTap: () {
printRed('FIXME');
},
),
),
),
),
Padding(
padding: const EdgeInsets.only(right: 20.0),
child: Container(
decoration: BoxDecoration(
color: Styles.purpleNurple,
borderRadius: BorderRadius.circular(40.0),
),
height: 80,
width: 80,
child: IconButton(
icon: const Icon(
Icons.add,
size: 48,
color: Styles.lavender,
),
onPressed: () {
showDialog(
context: context,
builder: (BuildContext context) {
return const AddTransactionDialog();
},
);
},
),
),
),
],
),
),
],
),
),
)
const Spacer(),
const Text('MONTHLY',
style: TextStyle(fontSize: 42, color: Styles.electricBlue)),
const Spacer(flex: 2),
BudgetNetBar(isPositive: true, net: netIncome),
const Spacer(),
BudgetNetBar(isPositive: false, net: netExpense),
const Spacer(),
],
),
)),
loading: () => const CircularProgressIndicator(),
error: (error, stackTrace) => Text('Error: $error, \n\n$stackTrace'),
),
/// BOTTOM HALF, BUDGET BREAKDOWN
Expanded(
child: Container(
color: Styles.sunflower,
width: screen.width,
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Padding(
padding: const EdgeInsets.all(14.0),
child: Container(
decoration: BoxDecoration(
color: Styles.blushingPink,
borderRadius: BorderRadius.circular(16.0),
),
child: Column(
children: [
const Padding(
padding: EdgeInsets.all(8.0),
child: Text(
'BUDGET',
style: TextStyle(
fontSize: 28, color: Styles.electricBlue),
),
),
budgetCategories.isEmpty
? Padding(
padding: const EdgeInsets.all(8.0),
child: SizedBox(
width: screen.width * 0.8,
child: Column(
children: [
const Padding(
padding: EdgeInsets.all(8.0),
child: Text(
'No budget categories created yet, add some!'),
),
ElevatedButton(
onPressed: ref.watch(
Store().budgetProvider) ==
null
? null
: () => showDialog(
context: context,
builder: (context) => Dialog(
shape:
Styles.dialogShape,
backgroundColor:
Styles.dialogColor,
child:
const AddBudgetCategoryDialog()),
),
child: const Text('Add Category'),
),
],
),
),
)
: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 2.0, vertical: 4.0),
child: SizedBox(
height: screen.height * 0.36,
child: Scrollbar(
controller: budgetListScrollController,
thumbVisibility: true,
child: ListView(
physics: const BouncingScrollPhysics(),
controller: budgetListScrollController,
shrinkWrap: true,
children: [
...budgetCategories
.mapIndexed((i, category) {
return BudgetCategoryBar(
budgetCategory: category,
currentAmount:
budgetCategoryNetMap[
category.id]!,
index: i,
);
}).toList(),
const SizedBox(height: 20),
Row(
mainAxisAlignment:
MainAxisAlignment.center,
children: [
SizedBox(
width: 140,
child: ElevatedButton(
onPressed: ref.watch(Store()
.budgetProvider) ==
null
? null
: () => showDialog(
context: context,
builder: (context) => Dialog(
shape: Styles
.dialogShape,
backgroundColor:
Styles
.dialogColor,
child:
const AddBudgetCategoryDialog()),
),
child: const Text(
'Add Category'),
),
),
],
),
const SizedBox(height: 20),
],
),
),
),
),
],
),
),
),
const Spacer(),
Row(
children: [
Expanded(
child: Padding(
padding:
const EdgeInsets.only(left: 20.0, right: 15.0),
child: Container(
height: 70,
decoration: BoxDecoration(
color: Styles.seaweedGreen,
borderRadius: BorderRadius.circular(15.0),
),
child: InkWell(
child: const Center(
child: Padding(
padding: EdgeInsets.symmetric(
horizontal: 20.0, vertical: 14.0),
child: FittedBox(
child: Text(
'Transaction History',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 25),
),
),
),
),
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =>
const TransactionsListview()));
},
),
),
),
),
Padding(
padding: const EdgeInsets.only(right: 20.0),
child: Container(
decoration: BoxDecoration(
color: Styles.purpleNurple,
borderRadius: BorderRadius.circular(40.0),
),
height: 80,
width: 80,
child: IconButton(
icon: const Icon(
Icons.add,
size: 48,
color: Styles.lavender,
),
onPressed: () {
showDialog(
context: context,
builder: (BuildContext context) {
return Dialog(
backgroundColor: Styles.dialogColor,
shape: Styles.dialogShape,
child: const AddTransactionDialog());
},
);
},
),
),
),
],
),
const Spacer(),
],
),
),
)
],
),
);
}
}
lib/features/budget/screens/transactions_listview.dart
+63
View File
@@ -0,0 +1,63 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:rluv/features/budget/widgets/transaction_list_item.dart';
import 'package:rluv/global/styles.dart';
import '../../../global/store.dart';
class TransactionsListview extends ConsumerStatefulWidget {
const TransactionsListview({super.key});
@override
ConsumerState<TransactionsListview> createState() =>
_TransactionsListviewState();
}
class _TransactionsListviewState extends ConsumerState<TransactionsListview> {
@override
Widget build(BuildContext context) {
final transactions = ref.watch(Store().transactionsProvider);
transactions.sort(
(a, b) => b.date.compareTo(a.date),
);
return Scaffold(
backgroundColor: Styles.purpleNurple,
body: SafeArea(
child: Stack(
children: [
if (transactions.isEmpty) ...[
const Center(
child: Text('No transactions'),
),
],
if (transactions.isNotEmpty)
Column(
children: [
const SizedBox(height: 28),
const Text(
'Transaction History',
style: TextStyle(fontSize: 28),
textAlign: TextAlign.center,
),
Expanded(
child: ListView.builder(
physics: const BouncingScrollPhysics(),
itemCount: transactions.length,
itemBuilder: (BuildContext context, int index) {
return TransactionListItem(
index: index,
);
},
),
),
],
),
IconButton(
icon: const Icon(Icons.chevron_left),
onPressed: () => Navigator.pop(context)),
],
),
),
);
}
}
lib/features/budget/widgets/add_budget_category_dialog.dart
+265
View File
@@ -0,0 +1,265 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:helpers/helpers/misc_build/build_media.dart';
import 'package:helpers/helpers/print.dart';
import 'package:rluv/global/styles.dart';
import 'package:rluv/models/budget.dart';
import 'package:rluv/models/budget_category_model.dart';
import '../../../global/api.dart';
import '../../../global/store.dart';
class AddBudgetCategoryDialog extends ConsumerStatefulWidget {
const AddBudgetCategoryDialog({super.key});
@override
ConsumerState<AddBudgetCategoryDialog> createState() =>
_AddBudgetCategoryDialogState();
}
class _AddBudgetCategoryDialogState
extends ConsumerState<AddBudgetCategoryDialog> {
bool loading = false;
bool complete = false;
late final Budget? budget;
final categoryNameController = TextEditingController();
final amountController = TextEditingController();
final categoryFocusNode = FocusNode();
final amountFocusNode = FocusNode();
final colors = Styles.curatedColors;
int selectedColorIndex = -1;
final formKey = GlobalKey<FormState>();
@override
void initState() {
budget = ref.read(Store().budgetProvider);
WidgetsBinding.instance.addPostFrameCallback((_) {
categoryFocusNode.requestFocus();
});
super.initState();
}
@override
Widget build(BuildContext context) {
if (budget == null) {
WidgetsBinding.instance.addPostFrameCallback((_) {
Navigator.pop(context);
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Could not get your budget'),
),
);
});
return Container();
} else if (complete) {
WidgetsBinding.instance.addPostFrameCallback((_) {
Navigator.pop(context);
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Budget Category Added!'),
),
);
});
return Container();
}
return SizedBox(
width: BuildMedia(context).width * Styles.dialogScreenWidthFactor,
child: Stack(
children: [
Padding(
padding:
const EdgeInsets.symmetric(vertical: 18.0, horizontal: 32.0),
child: Form(
key: formKey,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Padding(
padding: EdgeInsets.only(bottom: 18.0),
child: Text('Add Category:'),
),
Row(
children: [
const Text('Name:'),
const SizedBox(width: 30),
Container(
width: 120,
height: 30,
decoration: Styles.boxLavenderBubble,
child: TextFormField(
validator: (text) {
if (text == null || text.length < 3) {
return 'Invalid Category';
}
return null;
},
focusNode: categoryFocusNode,
textAlign: TextAlign.center,
cursorColor: Styles.blushingPink,
controller: categoryNameController,
decoration: Styles.inputLavenderBubble(),
onFieldSubmitted: (_) {
amountFocusNode.requestFocus();
},
),
),
],
),
const SizedBox(height: 18),
Row(
children: [
const Text('Amount:'),
const SizedBox(width: 30),
Container(
width: 80,
height: 30,
decoration: Styles.boxLavenderBubble,
child: TextFormField(
validator: (text) {
try {
if (text == null || text.isEmpty) {
return 'Invalid Amount';
}
final amount = double.tryParse(text);
if (amount == null) {
return 'Not A Number';
}
if (amount < 0) {
return 'Not Positive';
}
return null;
} catch (err) {
return 'Invalid input';
}
},
focusNode: amountFocusNode,
keyboardType: TextInputType.number,
textAlign: TextAlign.center,
cursorColor: Styles.blushingPink,
controller: amountController,
decoration: Styles.inputLavenderBubble(),
),
),
],
),
Padding(
padding: const EdgeInsets.symmetric(
vertical: 6.0, horizontal: 16.0),
child: SizedBox(
height: 76,
child: ListView.builder(
itemCount: colors.length,
scrollDirection: Axis.horizontal,
itemBuilder: (BuildContext context, int index) {
return GestureDetector(
onTap: () {
if (selectedColorIndex != index) {
setState(() => selectedColorIndex = index);
} else {
setState(() => selectedColorIndex = -1);
}
printBlue(selectedColorIndex);
},
child: Padding(
padding: const EdgeInsets.all(8.0),
child: AnimatedContainer(
decoration: selectedColorIndex == index
? BoxDecoration(
borderRadius:
BorderRadius.circular(15.0),
border: Border.all(
color: Styles.washedStone,
width: 2.0,
),
)
: BoxDecoration(
borderRadius:
BorderRadius.circular(5.0),
border: Border.all(
color: Colors.transparent,
width: 2.0,
),
),
duration: const Duration(milliseconds: 400),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Stack(
alignment: Alignment.center,
children: [
Container(
height: 40,
width: 40,
decoration: const BoxDecoration(
shape: BoxShape.circle,
),
),
Container(
height: 40,
width: 40,
decoration: BoxDecoration(
color: colors[index],
shape: BoxShape.circle,
border: Border.all(
color: Colors.black, width: 1.5),
),
),
],
),
),
),
),
);
},
),
),
),
ElevatedButton(
onPressed: () => submitCategory(colors[selectedColorIndex]),
child: const Text('SAVE'),
)
],
),
),
),
IconButton(
icon: const Icon(Icons.close),
onPressed: () => Navigator.pop(context),
),
if (loading) const Center(child: CircularProgressIndicator()),
],
),
);
}
Future submitCategory(Color categoryColor) async {
if (formKey.currentState != null && !formKey.currentState!.validate()) {
printPink('Failed validation');
return;
}
setState(
() => loading = true,
);
final newBudget = BudgetCategory(
id: null,
amount: double.parse(amountController.text),
budgetId: budget!.id!,
color: categoryColor,
name: categoryNameController.text,
);
final budgetData =
await Api().post(path: 'budget_category', data: newBudget.toJson());
final success = budgetData != null ? budgetData['success'] as bool : false;
if (success) {
ref
.read(Store().dashboardProvider.notifier)
.add({'budget_categories': budgetData});
}
complete = true;
setState(() {
loading = false;
});
}
}
lib/features/budget/widgets/add_transaction_dialog.dart
+304 -137
View File
@@ -1,6 +1,7 @@
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:helpers/helpers/misc_build/build_media.dart';
import '../../../global/api.dart';
import '../../../global/store.dart';
@@ -9,7 +10,9 @@ import '../../../models/budget_category_model.dart';
import '../../../models/transaction_model.dart';
class AddTransactionDialog extends ConsumerStatefulWidget {
const AddTransactionDialog({super.key});
const AddTransactionDialog({super.key, this.transaction});
final Transaction? transaction;
@override
ConsumerState<AddTransactionDialog> createState() =>
@@ -17,146 +20,310 @@ class AddTransactionDialog extends ConsumerStatefulWidget {
}
class _AddTransactionDialogState extends ConsumerState<AddTransactionDialog> {
final amountController = TextEditingController();
bool loading = false;
bool complete = false;
late final TextEditingController amountController;
late final TextEditingController memoController;
final amountFocusNode = FocusNode();
final memoFocusNode = FocusNode();
TransactionType transactionType = TransactionType.expense;
late BudgetCategory selectedBudgetCategory;
@override
void initState() {
if (widget.transaction != null) {
amountController =
TextEditingController(text: widget.transaction!.amount.toString());
memoController = TextEditingController(text: widget.transaction!.memo);
transactionType = widget.transaction!.type;
} else {
amountController = TextEditingController();
memoController = TextEditingController();
}
final categories = ref.read(Store().budgetCategoriesProvider);
if (categories.isNotEmpty) {
selectedBudgetCategory = categories.first;
}
super.initState();
}
@override
Widget build(BuildContext context) {
final List<BudgetCategory> budgetCategories =
ref.read(Store().budgetCategoriesProvider).requireValue;
return Dialog(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0),
side: const BorderSide(color: Styles.purpleNurple, width: 5.0),
),
child: StatefulBuilder(builder: (context, setState) {
TransactionType transactionType = TransactionType.expense;
BudgetCategory selectedBudgetCategory = budgetCategories.first;
return Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10.0),
color: Styles.purpleNurple,
),
child: Padding(
padding: const EdgeInsets.all(12.0),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Row(children: [
InkWell(
onTap: transactionType == TransactionType.expense
? null
: () {
setState(() =>
transactionType = TransactionType.expense);
},
child: AnimatedContainer(
height: 30,
width: 70,
decoration: BoxDecoration(
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(8.0),
topRight: Radius.circular(8.0)),
color: transactionType == TransactionType.expense
? Styles.lavender
: Styles.sand),
duration: const Duration(milliseconds: 300),
child: const Padding(
padding: EdgeInsets.all(8.0),
child: Text('Expense'),
),
),
),
InkWell(
onTap: transactionType == TransactionType.income
? null
: () {
setState(
() => transactionType = TransactionType.income);
},
child: AnimatedContainer(
height: 30,
width: 70,
decoration: BoxDecoration(
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(8.0),
topRight: Radius.circular(8.0)),
color: transactionType == TransactionType.income
? Styles.lavender
: Styles.sand),
duration: const Duration(milliseconds: 300),
child: const Padding(
padding: EdgeInsets.all(8.0),
child: Text('Income'),
),
),
),
]),
Row(
children: [
const Text('Amount:'),
SizedBox(
width: 80,
child: TextField(
controller: amountController,
decoration: InputDecoration(
fillColor: Styles.lavender,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10.0),
borderSide:
const BorderSide(color: Colors.transparent),
),
),
),
),
],
),
Row(
children: [
const Padding(
padding: EdgeInsets.only(right: 28.0),
child: Text('Category:'),
),
DropdownButton<BudgetCategory>(
value: selectedBudgetCategory,
items: budgetCategories
.map(
(e) => DropdownMenuItem(
value: e,
child: Text(e.name),
),
)
.toList(),
onChanged: (BudgetCategory? value) {
if (value != null) {
if (kDebugMode) {
print('${value.name} selected');
}
setState(() => selectedBudgetCategory = value);
}
},
),
],
),
ElevatedButton(
child: const Text('Add'),
onPressed: () {
Api().put(
path: 'transactions',
data: Transaction(
amount: double.parse(amountController.text),
addedByUserId: 1,
budgetCategoryId: 1,
budgetId: 1,
date: DateTime.now(),
transactionType: transactionType));
Navigator.pop(context);
},
),
],
),
if (complete) {
WidgetsBinding.instance.addPostFrameCallback((_) {
Navigator.pop(context);
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(widget.transaction != null
? 'Transaction updated!'
: 'Transaction added!'),
),
);
}),
);
});
return Container();
}
final List<BudgetCategory> budgetCategories =
ref.read(Store().budgetCategoriesProvider);
return SizedBox(
width: BuildMedia(context).width * Styles.dialogScreenWidthFactor,
child: budgetCategories.isEmpty
? const Padding(
padding: EdgeInsets.all(8.0),
child: Text(
'Add budget categories to sort your transactions',
textAlign: TextAlign.center,
),
)
: Padding(
padding: const EdgeInsets.all(18.0),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
if (widget.transaction == null)
Padding(
padding: const EdgeInsets.only(bottom: 8.0, left: 8.0),
child: Row(children: [
if (budgetCategories.isNotEmpty)
InkWell(
onTap: transactionType == TransactionType.expense
? null
: () {
setState(() => transactionType =
TransactionType.expense);
},
child: AnimatedContainer(
height: 38,
width: 80,
decoration: BoxDecoration(
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(8.0),
topRight: Radius.circular(8.0)),
color: transactionType ==
TransactionType.expense
? Styles.lavender
: Styles.washedStone),
duration: const Duration(milliseconds: 300),
child: const Padding(
padding: EdgeInsets.all(8.0),
child: Text('Expense',
style: TextStyle(fontSize: 16)),
),
),
),
InkWell(
onTap: transactionType == TransactionType.income
? null
: () {
setState(() => transactionType =
TransactionType.income);
},
child: AnimatedContainer(
height: 38,
width: 80,
decoration: BoxDecoration(
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(8.0),
topRight: Radius.circular(8.0)),
color:
transactionType == TransactionType.income
? Styles.lavender
: Styles.washedStone),
duration: const Duration(milliseconds: 300),
child: const Padding(
padding: EdgeInsets.all(8.0),
child: Text('Income',
style: TextStyle(fontSize: 16)),
),
),
),
]),
),
Row(
children: [
const Padding(
padding: EdgeInsets.all(8.0),
child: Text(
'Amount:',
style: TextStyle(fontSize: 18.0),
),
),
Container(
width: 120,
height: 40,
decoration: Styles.boxLavenderBubble,
child: TextFormField(
keyboardType: TextInputType.number,
textAlign: TextAlign.center,
style: const TextStyle(fontSize: 18.0),
cursorColor: Styles.blushingPink,
decoration: Styles.inputLavenderBubble(),
focusNode: amountFocusNode,
controller: amountController,
onFieldSubmitted: (_) {
memoFocusNode.requestFocus();
},
),
),
],
),
if (budgetCategories.isEmpty)
const Padding(
padding: EdgeInsets.all(18.0),
child: Text(
'Add budget categories to sort your transactions',
textAlign: TextAlign.center,
),
),
if (budgetCategories.isNotEmpty)
AnimatedSwitcher(
duration: const Duration(milliseconds: 300),
child: transactionType == TransactionType.income
? const SizedBox(height: 12.5)
: Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Row(
children: [
const Padding(
padding: EdgeInsets.only(right: 28.0),
child: Text(
'Category:',
style: TextStyle(fontSize: 18.0),
),
),
DropdownButton<BudgetCategory>(
dropdownColor: Styles.lavender,
value: selectedBudgetCategory,
items: budgetCategories
.map(
(e) => DropdownMenuItem(
value: e,
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Container(
height: 18,
width: 18,
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(
color: Colors.black,
width: 1.5),
color: e.color,
),
),
const SizedBox(width: 12),
Text(e.name),
],
),
),
)
.toList(),
onChanged: (BudgetCategory? value) {
if (value != null) {
if (kDebugMode) {
print('${value.name} selected');
}
setState(() =>
selectedBudgetCategory = value);
}
},
),
],
),
),
),
const Padding(
padding: EdgeInsets.all(8.0),
child: Row(
children: [
Text(
'Memo',
style: TextStyle(fontSize: 18.0),
),
],
),
),
Container(
width: BuildMedia(context).width * 0.65,
height: 100,
decoration: Styles.boxLavenderBubble,
child: TextFormField(
style: const TextStyle(fontSize: 18.0),
maxLines: 4,
focusNode: memoFocusNode,
textAlign: TextAlign.left,
cursorColor: Styles.blushingPink,
controller: memoController,
decoration: Styles.inputLavenderBubble(),
onFieldSubmitted: (_) {},
),
),
ElevatedButton(
onPressed: loading ? null : () => submitTransaction(),
child: const Text('Add'),
),
],
),
));
}
Future submitTransaction() async {
setState(() {
loading = true;
});
Map<String, dynamic>? data;
if (widget.transaction != null) {
data = await Api().put(
path: 'transactions',
data: Transaction.copyWith(widget.transaction!, {
'memo': memoController.text.isNotEmpty ? memoController.text : null,
'amount': double.parse(amountController.text),
'budget_category_id': transactionType == TransactionType.income
? null
: selectedBudgetCategory.id,
}).toJson());
} else {
data = await Api().post(
path: 'transactions',
data: Transaction(
amount: double.parse(amountController.text),
addedByUserId: 1,
budgetCategoryId: transactionType == TransactionType.income
? null
: selectedBudgetCategory.id,
budgetId: 1,
date: DateTime.now(),
type: transactionType,
memo: memoController.text.isNotEmpty
? memoController.text
: null)
.toJson());
}
final success = data != null ? data['success'] as bool : false;
if (success) {
if (widget.transaction != null) {
ref
.read(Store().dashboardProvider.notifier)
.update({'transactions': data});
} else {
ref
.read(Store().dashboardProvider.notifier)
.add({'transactions': data});
}
complete = true;
} else {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(widget.transaction != null
? 'Failed to edit transaction'
: 'Failed to add transaction'),
),
);
}
setState(() {
loading = false;
});
}
}
lib/features/budget/widgets/budget_category_bar.dart
+157
View File
@@ -0,0 +1,157 @@
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:helpers/helpers/print.dart';
import 'package:rluv/global/utils.dart';
import 'package:rluv/models/budget_category_model.dart';
import '../../../global/styles.dart';
class BudgetCategoryBar extends StatefulWidget {
const BudgetCategoryBar(
{super.key,
required this.budgetCategory,
required this.currentAmount,
required this.index,
this.height = 32,
this.innerPadding = 1.5});
final int index;
final double currentAmount;
final BudgetCategory budgetCategory;
final double height;
final double innerPadding;
@override
State<BudgetCategoryBar> createState() => _BudgetCategoryBarState();
}
class _BudgetCategoryBarState extends State<BudgetCategoryBar> {
double percentSpent = 0.0;
@override
void initState() {
Future.delayed(Duration(milliseconds: min(1600, 200 * widget.index)), () {
setState(() =>
percentSpent = (widget.currentAmount / widget.budgetCategory.amount));
});
super.initState();
}
@override
Widget build(BuildContext context) {
final innerHeight = widget.height - widget.innerPadding * 2;
final isBright =
getBrightness(widget.budgetCategory.color) == Brightness.light;
final textStyle = TextStyle(
fontSize: 14,
fontWeight: FontWeight.bold,
color: widget.currentAmount > widget.budgetCategory.amount
? Styles.expensesRed
: isBright
? Colors.black87
: Colors.white);
return Padding(
padding: const EdgeInsets.symmetric(vertical: 4.0),
child: Row(
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: SizedBox(
width: 90,
child: FittedBox(
fit: BoxFit.scaleDown,
alignment: Alignment.centerLeft,
child: Text(
formatBudgetName(widget.budgetCategory.name),
style: const TextStyle(fontSize: 18.0),
),
),
),
),
Expanded(
child: Padding(
padding: const EdgeInsets.only(right: 18.0),
child: Stack(
children: [
Container(
height: widget.height,
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.circular(14.0),
),
),
Padding(
padding: EdgeInsets.all(widget.innerPadding),
child: Container(
height: innerHeight,
decoration: BoxDecoration(
color: Styles.emptyBarGrey,
borderRadius: BorderRadius.circular(12.0),
),
),
),
Padding(
padding: EdgeInsets.all(widget.innerPadding),
child: SizedBox(
height: innerHeight,
child: AnimatedFractionallySizedBox(
curve: Curves.easeOutSine,
heightFactor: 1.0,
widthFactor: min(1.0, max(0.08, percentSpent)),
duration: const Duration(milliseconds: 350),
child: Container(
decoration: BoxDecoration(
color: widget.budgetCategory.color,
borderRadius: BorderRadius.circular(12.0),
),
),
),
),
),
SizedBox(
height: widget.height,
child: Row(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Center(
child: Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Text(
'${widget.currentAmount.currency()} / ${widget.budgetCategory.amount.currency()}',
style: textStyle),
),
),
],
),
),
],
),
))
],
),
);
}
String formatBudgetName(String name) {
if (name.length < 12) {
return name;
}
if (!name.contains(' ') || name.indexOf(' ') == name.length - 1) {
return name;
}
printLime('here');
final words = name.split(' ');
int index = 0;
String firstLine = words[index];
while (true) {
index += 1;
if (index == words.length) {
return '$firstLine\n${words.sublist(index).join(' ')}';
}
if (firstLine.length + words[index].length > 12) {
return '$firstLine\n${words.sublist(index).join(' ')}';
}
firstLine += ' ${words[index]}';
}
}
}
lib/features/budget/widgets/budget_net_bar.dart
+2 -1
View File
@@ -1,6 +1,7 @@
import 'package:flutter/material.dart';
import 'package:helpers/helpers.dart';
import 'package:rluv/global/styles.dart';
import 'package:rluv/global/utils.dart';
class BudgetNetBar extends StatelessWidget {
const BudgetNetBar({super.key, required this.isPositive, required this.net});
@@ -28,7 +29,7 @@ class BudgetNetBar extends StatelessWidget {
),
),
Text(
'\$$net',
net.currency(),
style: TextStyle(
fontSize: 20,
color: isPositive ? Styles.incomeGreen : Styles.expensesRed),
lib/features/budget/widgets/transaction_list_item.dart
+168
View File
@@ -0,0 +1,168 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:helpers/helpers/misc_build/build_media.dart';
import 'package:intl/intl.dart';
import 'package:rluv/features/budget/widgets/add_transaction_dialog.dart';
import 'package:rluv/global/utils.dart';
import 'package:rluv/models/transaction_model.dart';
import '../../../global/store.dart';
import '../../../global/styles.dart';
import '../../../global/widgets/budget_color_circle.dart';
import '../../../models/budget_category_model.dart';
class TransactionListItem extends ConsumerStatefulWidget {
const TransactionListItem({super.key, required this.index});
final int index;
@override
ConsumerState<TransactionListItem> createState() =>
_TransactionListItemState();
}
class _TransactionListItemState extends ConsumerState<TransactionListItem> {
bool showDetails = false;
double cardHeight = 70.0;
BudgetCategory? budgetCategory;
late final Transaction transaction;
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
final transaction = ref.watch(Store().transactionsProvider)[widget.index];
final budgetCategories = ref.read(Store().budgetCategoriesProvider);
if (transaction.type == TransactionType.expense) {
budgetCategory = budgetCategories.singleWhere(
(category) => category.id == transaction.budgetCategoryId,
);
}
return GestureDetector(
onTap: () => toggleDetails(),
child: Padding(
padding: const EdgeInsets.only(top: 8.0, left: 8.0, bottom: 8.0),
child: ClipRRect(
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(10.0),
bottomLeft: Radius.circular(10.0)),
child: AnimatedContainer(
curve: Curves.easeOut,
duration: const Duration(milliseconds: 200),
height: cardHeight,
decoration: const BoxDecoration(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(10.0),
bottomLeft: Radius.circular(10.0)),
color: Styles.washedStone,
),
child: Row(
children: [
AnimatedContainer(
curve: Curves.easeOut,
duration: const Duration(milliseconds: 200),
height: cardHeight,
width: 6,
color: transaction.type == TransactionType.income
? Styles.incomeBlue
: Styles.expensesOrange),
SizedBox(
width: BuildMedia(context).width * 0.65,
child: Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(DateFormat('EEE MMM d, h:mm a')
.format(transaction.date)),
Row(
children: [
const SizedBox(
width: 6,
),
if (budgetCategory != null) ...[
BudgetColorCircle(
color: budgetCategory!.color,
),
const SizedBox(
width: 8,
),
],
Text(
transaction.type == TransactionType.income
? 'Income'
: budgetCategory!.name,
style: const TextStyle(fontSize: 20),
),
],
),
if (showDetails)
Text(
transaction.memo ?? '',
style: const TextStyle(fontSize: 16),
)
],
),
),
),
const Spacer(),
Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Text(
transaction.amount.currency(),
style: TextStyle(
fontSize: 24,
color: transaction.type == TransactionType.income
? Styles.incomeGreen
: Styles.expensesRed),
),
if (showDetails)
IconButton(
icon: const Icon(
Icons.edit_rounded,
),
onPressed: () {
showDialog(
context: context,
builder: (context) => Dialog(
backgroundColor: Styles.dialogColor,
shape: Styles.dialogShape,
child: AddTransactionDialog(
transaction: transaction),
),
);
},
),
],
),
const SizedBox(
width: 14,
),
],
),
),
),
),
);
}
void toggleDetails() {
if (showDetails) {
setState(() {
showDetails = false;
cardHeight = 70;
});
} else {
setState(() {
showDetails = true;
cardHeight = 120;
});
}
}
}
lib/features/notes/screens/notes_screen.dart
+51
View File
@@ -0,0 +1,51 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:helpers/helpers/misc_build/build_media.dart';
import '../../../global/store.dart';
class SharedNotesScreen extends ConsumerStatefulWidget {
const SharedNotesScreen({super.key, required this.initialData});
final Map<String, dynamic> initialData;
@override
ConsumerState<SharedNotesScreen> createState() => _SharedNotesScreenState();
}
class _SharedNotesScreenState extends ConsumerState<SharedNotesScreen> {
@override
Widget build(BuildContext context) {
final sharedNotes = ref.watch(Store().sharedNotesProvider);
return Column(
children: [
const Padding(
padding: EdgeInsets.all(18.0),
child: Text(
'Notes:',
style: TextStyle(fontSize: 20),
textAlign: TextAlign.center,
),
),
if (sharedNotes.isEmpty) const Text('Add notes to get started:'),
if (sharedNotes.isNotEmpty)
GridView.builder(
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
),
itemBuilder: (BuildContext context, int index) {
final note = sharedNotes[index];
return SizedBox(
width: BuildMedia(context).width * 0.4,
child: Card(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Text(note.content),
),
),
);
},
),
],
);
}
}
lib/features/settings/screens/settings_screen.dart
+20
View File
@@ -0,0 +1,20 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
class SettingsScreen extends ConsumerStatefulWidget {
const SettingsScreen({super.key});
@override
ConsumerState<SettingsScreen> createState() => _SettingsScreenState();
}
class _SettingsScreenState extends ConsumerState<SettingsScreen> {
@override
Widget build(BuildContext context) {
return const Column(
children: [
Text('Settings'),
],
);
}
}