Make the pie chart widget reusable

This commit is contained in:
2025-05-06 21:59:03 +02:00
parent d40d24f759
commit 63b5354b72
24 changed files with 2264 additions and 1924 deletions

View File

@@ -23,44 +23,45 @@ class AddBudgetState extends State<AddBudgetPopup> {
mainAxisSize: MainAxisSize.min,
children: [
TextField(
decoration: InputDecoration(
hintText: "Budget name",
),
decoration: InputDecoration(hintText: "Budget name"),
controller: _budgetNameEditController,
),
TextField(
decoration: InputDecoration(
hintText: "Income",
),
decoration: InputDecoration(hintText: "Income"),
controller: _budgetIncomeEditController,
keyboardType: TextInputType.numberWithOptions(signed: false, decimal: true),
keyboardType: TextInputType.numberWithOptions(
signed: false,
decimal: true,
),
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
OutlinedButton(
onPressed: () async {
if (_budgetNameEditController.text.isEmpty || _budgetIncomeEditController.text.isEmpty) {
return;
}
onPressed: () async {
if (_budgetNameEditController.text.isEmpty ||
_budgetIncomeEditController.text.isEmpty) {
return;
}
final bloc = GetIt.I.get<CoreCubit>();
final budget = Budget()
..name = _budgetNameEditController.text
..period = BudgetPeriod.month
..includeOtherSpendings = false
..income = double.parse(_budgetIncomeEditController.text)
..account.value = bloc.activeAccount!;
await upsertBudget(budget);
widget.onDone();
},
child: Text("Add"),
final bloc = GetIt.I.get<CoreCubit>();
final budget =
Budget()
..name = _budgetNameEditController.text
..period = BudgetPeriod.month
..includeOtherSpendings = false
..income = double.parse(_budgetIncomeEditController.text)
..account.value = bloc.activeAccount!;
await upsertBudget(budget);
widget.onDone();
},
child: Text("Add"),
),
],
),
],
);
}
}
}

View File

@@ -11,7 +11,11 @@ class AddBudgetItemPopup extends StatefulWidget {
final VoidCallback onDone;
final Budget budget;
const AddBudgetItemPopup({super.key, required this.onDone, required this.budget});
const AddBudgetItemPopup({
super.key,
required this.onDone,
required this.budget,
});
@override
AddBudgetItemState createState() => AddBudgetItemState();
@@ -31,55 +35,67 @@ class AddBudgetItemState extends State<AddBudgetItemPopup> {
Text("Expense category"),
OutlinedButton(
onPressed: () async {
final category = await showDialogOrModal(
context: context,
builder: (_) => AddExpenseCategory(),
);
if (category == null) {
return;
}
onPressed: () async {
final category = await showDialogOrModal(
context: context,
builder: (_) => AddExpenseCategory(),
);
if (category == null) {
return;
}
setState(() => _expenseCategory = category);
},
child: Text(_expenseCategory?.name ?? "None"),
setState(() => _expenseCategory = category);
},
child: Text(_expenseCategory?.name ?? "None"),
),
],
),
TextField(
decoration: InputDecoration(
hintText: "Amount",
),
decoration: InputDecoration(hintText: "Amount"),
controller: _budgetItemAmountEditController,
keyboardType: TextInputType.numberWithOptions(signed: false, decimal: true),
keyboardType: TextInputType.numberWithOptions(
signed: false,
decimal: true,
),
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
OutlinedButton(
onPressed: () async {
if (_budgetItemAmountEditController.text.isEmpty || _expenseCategory == null) {
return;
}
if (widget.budget.items.where((i) => i.expenseCategory.value!.name == _expenseCategory!.name).firstOrNull != null) {
return;
}
onPressed: () async {
if (_budgetItemAmountEditController.text.isEmpty ||
_expenseCategory == null) {
return;
}
if (widget.budget.items
.where(
(i) =>
i.expenseCategory.value!.name ==
_expenseCategory!.name,
)
.firstOrNull !=
null) {
return;
}
final item = BudgetItem()
..expenseCategory.value = _expenseCategory
..amount = double.parse(_budgetItemAmountEditController.text);
await upsertBudgetItem(item);
widget.budget.items.add(item);
await upsertBudget(widget.budget);
widget.onDone();
},
child: Text("Add"),
final item =
BudgetItem()
..expenseCategory.value = _expenseCategory
..amount = double.parse(
_budgetItemAmountEditController.text,
);
await upsertBudgetItem(item);
widget.budget.items.add(item);
await upsertBudget(widget.budget);
widget.onDone();
},
child: Text("Add"),
),
],
),
],
);
}
}
}

View File

@@ -8,6 +8,8 @@ import 'package:okane/ui/pages/account/breakdown_card.dart';
import 'package:okane/ui/pages/budgets/add_budget_item.dart';
import 'package:okane/ui/state/core.dart';
import 'package:okane/ui/utils.dart';
import 'package:okane/ui/widgets/piechart.dart';
import 'package:okane/ui/widgets/piechart_card.dart';
class BudgetDetailsPage extends StatelessWidget {
final bool isPage;
@@ -256,211 +258,48 @@ class BudgetDetailsPage extends StatelessWidget {
),
Wrap(
children: [
Padding(
padding: EdgeInsets.all(8),
child: SizedBox(
child: Card(
child: Column(
crossAxisAlignment:
CrossAxisAlignment.center,
children: [
Padding(
padding: EdgeInsets.only(top: 8),
child: Text(
"Budget breakdown",
style:
Theme.of(
context,
).textTheme.titleLarge,
textAlign: TextAlign.center,
children: [
Padding(
padding: EdgeInsets.symmetric(horizontal: 8),
child: PieChartCard(
fallbackText: "",
valueConverter: formatCurrency,
items:
state.activeBudget!.items
.map(
(i) => (
title: i.expenseCategory.value!.name,
value: i.amount,
color: colorHash(
i.expenseCategory.value!.name,
),
),
),
Row(
mainAxisSize: MainAxisSize.min,
children: [
Padding(
padding: EdgeInsets.all(16),
child: SizedBox(
width: 150,
height: 150,
child: AspectRatio(
aspectRatio: 1,
child: PieChart(
PieChartData(
borderData: FlBorderData(
show: false,
),
sectionsSpace: 0,
centerSpaceRadius: 35,
sections:
state
.activeBudget!
.items
.map(
(
i,
) => PieChartSectionData(
value:
i.amount
.abs(),
title:
formatCurrency(
i.amount
.abs(),
),
titleStyle: TextStyle(
fontWeight:
FontWeight
.bold,
),
radius: 40,
color: colorHash(
i
.expenseCategory
.value!
.name,
),
),
)
.toList(),
),
),
),
),
),
Padding(
padding: EdgeInsets.symmetric(
horizontal: 8,
),
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children:
state.activeBudget!.items
.map(
(i) => LegendItem(
text:
i
.expenseCategory
.value!
.name,
color: colorHash(
i
.expenseCategory
.value!
.name,
),
),
)
.toList(),
),
),
],
),
],
),
),
),
)
.toList(),
titleText: "Budget breakdown",
),
),
Padding(
padding: EdgeInsets.all(8),
child: SizedBox(
child: Card(
child: Column(
crossAxisAlignment:
CrossAxisAlignment.center,
children: [
Padding(
padding: EdgeInsets.only(top: 8),
child: Text(
"Spending breakdown",
style:
Theme.of(
context,
).textTheme.titleLarge,
textAlign: TextAlign.center,
Padding(
padding: EdgeInsets.symmetric(horizontal: 8),
child: PieChartCard(
fallbackText: "No spending available",
valueConverter: formatCurrency,
items:
spending.entries
.map(
(e) => (
title: e.key,
value: e.value.abs(),
color: colorHash(e.key),
),
),
Row(
mainAxisSize: MainAxisSize.min,
children: [
Padding(
padding: EdgeInsets.all(16),
child: SizedBox(
width: 150,
height: 150,
child: AspectRatio(
aspectRatio: 1,
child: PieChart(
PieChartData(
borderData: FlBorderData(
show: false,
),
sectionsSpace: 0,
centerSpaceRadius: 35,
sections:
spending.entries
.map(
(
e,
) => PieChartSectionData(
value:
e.value
.abs(),
title:
formatCurrency(
e.value
.abs(),
),
titleStyle: TextStyle(
fontWeight:
FontWeight
.bold,
),
radius: 40,
color:
colorHash(
e.key,
),
),
)
.toList(),
),
),
),
),
),
Padding(
padding: EdgeInsets.symmetric(
horizontal: 8,
),
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children:
spending.keys
.map(
(k) => LegendItem(
text: k,
color: colorHash(k),
),
)
.toList(),
),
),
],
),
],
),
),
),
)
.toList(),
titleText: "Spending Breakdown",
),
],
),
),
],
),
Padding(
padding: EdgeInsets.all(8),

View File

@@ -19,9 +19,7 @@ class BudgetListPage extends StatelessWidget {
if (state.budgets.isEmpty) {
return Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text("No budgets"),
],
children: [Text("No budgets")],
);
}
@@ -74,18 +72,18 @@ class BudgetListPage extends StatelessWidget {
right: 16,
bottom: 16,
child: FloatingActionButton(
child: Icon(Icons.add),
onPressed: () {
showDialogOrModal(
context: context,
builder:
(_) => AddBudgetPopup(
onDone: () {
Navigator.of(context).pop();
},
),
);
},
child: Icon(Icons.add),
onPressed: () {
showDialogOrModal(
context: context,
builder:
(_) => AddBudgetPopup(
onDone: () {
Navigator.of(context).pop();
},
),
);
},
),
),
],

View File

@@ -6,45 +6,47 @@ class EditBudgetPopup extends StatefulWidget {
final Budget budget;
final VoidCallback onDone;
const EditBudgetPopup({required this.budget, required this.onDone, super.key});
const EditBudgetPopup({
required this.budget,
required this.onDone,
super.key,
});
@override
EditBudgetState createState() => EditBudgetState();
}
class EditBudgetState extends State<EditBudgetPopup> {
final _budgetNameEditController = TextEditingController();
late bool _includeOtherSpendings;
@override
void initState() {
super.initState();
_budgetNameEditController.text = widget.budget.name;
_includeOtherSpendings = widget.budget.includeOtherSpendings;
}
}
@override
Widget build(BuildContext context) {
return Column(
mainAxisSize: MainAxisSize.min,
children: [
TextField(
decoration: InputDecoration(
hintText: "Name",
),
decoration: InputDecoration(hintText: "Name"),
controller: _budgetNameEditController,
),
Row(
children: [
Text("Include other spendings"),
Switch(
value: _includeOtherSpendings,
onChanged: (value) {
setState(() => _includeOtherSpendings = value);
},
value: _includeOtherSpendings,
onChanged: (value) {
setState(() => _includeOtherSpendings = value);
},
),
],
),
@@ -52,26 +54,28 @@ class EditBudgetState extends State<EditBudgetPopup> {
mainAxisAlignment: MainAxisAlignment.end,
children: [
OutlinedButton(
onPressed: () async {
if (_budgetNameEditController.text.isEmpty) {
return;
}
if (_budgetNameEditController.text == widget.budget.name && _includeOtherSpendings == widget.budget.includeOtherSpendings) {
widget.onDone();
return;
}
widget.budget
..name = _budgetNameEditController.text
..includeOtherSpendings = _includeOtherSpendings;
await upsertBudget(widget.budget);
onPressed: () async {
if (_budgetNameEditController.text.isEmpty) {
return;
}
if (_budgetNameEditController.text == widget.budget.name &&
_includeOtherSpendings ==
widget.budget.includeOtherSpendings) {
widget.onDone();
},
child: Text("Save"),
return;
}
widget.budget
..name = _budgetNameEditController.text
..includeOtherSpendings = _includeOtherSpendings;
await upsertBudget(widget.budget);
widget.onDone();
},
child: Text("Save"),
),
],
),
],
);
}
}
}