prasule/lib/views/graph_view.dart

719 lines
33 KiB
Dart

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:intl/intl.dart';
import 'package:prasule/api/category.dart';
import 'package:prasule/api/wallet.dart';
import 'package:prasule/api/wallet_manager.dart';
import 'package:prasule/main.dart';
import 'package:prasule/pw/platformroute.dart';
import 'package:prasule/util/drawer.dart';
import 'package:prasule/util/graphs.dart';
import 'package:prasule/util/utils.dart';
import 'package:prasule/views/settings/settings.dart';
import 'package:prasule/views/setup.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:wheel_chooser/wheel_chooser.dart';
/// Shows data from a [Wallet] in graphs
class GraphView extends StatefulWidget {
/// Shows data from a [Wallet] in graphs
const GraphView({super.key});
@override
State<GraphView> createState() => _GraphViewState();
}
class _GraphViewState extends State<GraphView> {
var _selectedDate = DateTime.now();
Wallet? selectedWallet;
List<Wallet> wallets = [];
String? locale;
bool yearly = true;
@override
void didChangeDependencies() {
super.didChangeDependencies();
locale ??= Localizations.localeOf(context).languageCode;
}
List<double> generateChartData(EntryType type) {
final d = _selectedDate.add(const Duration(days: 31));
final data = List<double>.filled(
yearly ? 12 : DateTime(d.year, d.month, 0).day,
0,
);
if (selectedWallet == null) return [];
for (var i = 0; i < data.length; i++) {
final entriesForRange = selectedWallet!.entries.where(
(element) =>
((!yearly)
? element.date.month == _selectedDate.month &&
element.date.year == _selectedDate.year &&
element.date.day == i + 1
: element.date.month == i + 1 &&
element.date.year == _selectedDate.year) &&
element.type == type,
);
var sum = 0.0;
for (final e in entriesForRange) {
sum += e.data.amount;
}
data[i] = sum;
}
return data;
}
final availableYears = <WheelChoice<int>>[];
Future<void> loadWallet() async {
wallets = await WalletManager.listWallets();
if (wallets.isEmpty && mounted) {
unawaited(
Navigator.of(context)
.pushReplacement(platformRoute((c) => const SetupView())),
);
return;
}
selectedWallet = wallets.first;
availableYears.clear();
for (final entry in selectedWallet!.entries) {
if (!availableYears.any((element) => element.value == entry.date.year)) {
availableYears.add(
WheelChoice<int>(
value: entry.date.year,
title: entry.date.year.toString(),
),
);
}
}
setState(() {});
}
int? chartType;
@override
void initState() {
super.initState();
loadWallet();
SharedPreferences.getInstance().then((s) {
chartType = s.getInt("monthlygraph") ?? 2;
setState(() {});
});
}
@override
Widget build(BuildContext context) {
return DefaultTabController(
length: 2,
child: Scaffold(
floatingActionButton: Tooltip(
message: AppLocalizations.of(context).changeDate,
child: FloatingActionButton(
child: const Icon(Icons.calendar_month),
onPressed: () async {
var selectedYear = _selectedDate.year;
var selectedMonth = _selectedDate.month;
await showAdaptiveDialog<void>(
context: context,
builder: (c) => AlertDialog.adaptive(
title: Text(
yearly
? AppLocalizations.of(context).selectYear
: AppLocalizations.of(context).selectMonth,
),
content: LimitedBox(
maxHeight: MediaQuery.of(context).size.width * 0.7,
maxWidth: MediaQuery.of(context).size.width * 0.8,
child: Wrap(
alignment: WrapAlignment.center,
spacing: 5,
children: [
if (!yearly)
SizedBox(
width: 120,
height: 100,
child: WheelChooser<int>.choices(
onChoiceChanged: (v) {
selectedMonth = v as int;
},
startPosition: _selectedDate.month - 1,
choices: List<WheelChoice<int>>.generate(
12,
(index) => WheelChoice(
value: index + 1,
title: DateFormat.MMMM(locale ?? "en").format(
DateTime(
_selectedDate.year,
index + 1,
),
),
),
),
),
),
SizedBox(
height: 100,
width: 80,
child: WheelChooser<int>.choices(
startPosition: availableYears.indexWhere(
(element) => element.value == _selectedDate.year,
),
onChoiceChanged: (v) {
selectedYear = v as int;
},
choices: availableYears,
),
),
],
),
),
actions: [
TextButton(
onPressed: () {
_selectedDate = DateTime(selectedYear, selectedMonth);
Navigator.of(c).pop();
},
child: Text(AppLocalizations.of(context).ok),
),
],
),
);
setState(() {});
},
),
),
appBar: AppBar(
bottom: TabBar(
tabs: [
Tab(
child: Text(AppLocalizations.of(context).expenses),
),
Tab(
child: Text(AppLocalizations.of(context).incomePlural),
),
],
),
title: DropdownButton<int>(
value: (selectedWallet == null)
? -1
: wallets.indexOf(
wallets.where((w) => w.name == selectedWallet!.name).first,
),
items: [
...wallets.map(
(e) => DropdownMenuItem(
value: wallets.indexOf(
e,
),
child: Text(e.name),
),
),
DropdownMenuItem(
value: -1,
child: Text(AppLocalizations.of(context).newWallet),
),
],
onChanged: (v) async {
if (v == null || v == -1) {
await Navigator.of(context).push(
platformRoute(
(c) => const SetupView(
newWallet: true,
),
),
);
wallets = await WalletManager.listWallets();
logger.i(wallets.length);
selectedWallet = wallets.last;
setState(() {});
return;
}
selectedWallet = wallets[v];
setState(() {});
},
),
actions: [
PopupMenuButton(
itemBuilder: (context) => [
AppLocalizations.of(context).settings,
AppLocalizations.of(context).about,
].map((e) => PopupMenuItem(value: e, child: Text(e))).toList(),
onSelected: (value) {
if (value == AppLocalizations.of(context).settings) {
Navigator.of(context)
.push(
platformRoute(
(context) => const SettingsView(),
),
)
.then((value) async {
selectedWallet =
await WalletManager.loadWallet(selectedWallet!.name);
final s = await SharedPreferences.getInstance();
chartType = s.getInt("monthlygraph") ?? 2;
setState(() {});
});
} else if (value == AppLocalizations.of(context).about) {
showAbout(context);
}
},
),
],
),
drawer: makeDrawer(context, 2),
body: TabBarView(
children: [
// EXPENSE TAB
SingleChildScrollView(
child: Center(
child: (selectedWallet == null)
? const CircularProgressIndicator(
strokeWidth: 5,
)
: SizedBox(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(
width: 200,
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Text(
AppLocalizations.of(context).monthly,
style: const TextStyle(
fontWeight: FontWeight.bold,
),
),
Switch.adaptive(
value: yearly,
onChanged: (v) async {
yearly = v;
final s =
await SharedPreferences.getInstance();
chartType = yearly
? (s.getInt("yearlygraph") ?? 1)
: (s.getInt("monthlygraph") ?? 2);
setState(() {});
},
),
Text(
AppLocalizations.of(context).yearly,
style: const TextStyle(
fontWeight: FontWeight.bold,
),
),
],
),
),
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
boxShadow: (MediaQuery.of(context)
.platformBrightness ==
Brightness.light)
? [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 3,
blurRadius: 7,
offset: const Offset(
0,
3,
),
),
]
: null,
color: (MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Theme.of(context)
.colorScheme
.secondaryContainer
: Theme.of(context).colorScheme.surface,
),
child: Padding(
padding: const EdgeInsets.all(8),
child: Column(
children: [
Text(
yearly
? AppLocalizations.of(context)
.expensesPerYear(
_selectedDate.year,
)
: AppLocalizations.of(context)
.expensesPerMonth(
DateFormat.yMMMM(locale)
.format(_selectedDate),
),
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
const SizedBox(
height: 15,
),
SizedBox(
width: MediaQuery.of(context).size.width *
0.9,
height:
MediaQuery.of(context).size.height *
0.35,
child: (chartType == null)
? const CircularProgressIndicator()
: (chartType == 1)
? ExpensesBarChart(
currency:
selectedWallet!.currency,
date: _selectedDate,
locale: locale ?? "en",
yearly: yearly,
expenseData:
generateChartData(
EntryType.expense,
),
incomeData: const [],
)
: Padding(
padding:
const EdgeInsets.all(8),
child: ExpensesLineChart(
currency: selectedWallet!
.currency,
date: _selectedDate,
locale: locale ?? "en",
yearly: yearly,
expenseData:
generateChartData(
EntryType.expense,
),
incomeData: const [],
),
),
),
],
),
),
),
const SizedBox(
height: 25,
),
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
boxShadow: (MediaQuery.of(context)
.platformBrightness ==
Brightness.light)
? [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 3,
blurRadius: 7,
offset: const Offset(
0,
3,
),
),
]
: null,
color: (MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Theme.of(context)
.colorScheme
.secondaryContainer
: Theme.of(context).colorScheme.surface,
),
width: MediaQuery.of(context).size.width * 0.95,
height: MediaQuery.of(context).size.height * 0.4,
child: Column(
children: [
const SizedBox(
height: 10,
),
Flexible(
child: Text(
textAlign: TextAlign.center,
yearly
? AppLocalizations.of(context)
.expensesPerYearCategory(
_selectedDate.year,
)
: AppLocalizations.of(context)
.expensesPerMonthCategory(
DateFormat.yMMMM(locale)
.format(_selectedDate),
),
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
),
Padding(
padding: const EdgeInsets.all(6),
child: CategoriesPieChart(
// TODO: better size adaptivity without overflow
locale: locale ?? "en",
symbol: selectedWallet!.currency.symbol,
entries: selectedWallet!.entries
.where(
(element) =>
((!yearly)
? element.date.month ==
_selectedDate
.month &&
element.date.year ==
_selectedDate.year
: element.date.year ==
_selectedDate.year) &&
element.type ==
EntryType.expense,
)
.toList(),
categories: selectedWallet!.categories,
),
),
],
),
),
],
),
),
),
), // Expense Tab END
SingleChildScrollView(
child: Center(
child: (selectedWallet == null)
? const CircularProgressIndicator(
strokeWidth: 5,
)
: SizedBox(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(
width: 200,
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Text(
AppLocalizations.of(context).monthly,
style: const TextStyle(
fontWeight: FontWeight.bold,
),
),
Switch.adaptive(
value: yearly,
onChanged: (v) async {
yearly = v;
final s =
await SharedPreferences.getInstance();
chartType = yearly
? (s.getInt("yearlygraph") ?? 1)
: (s.getInt("monthlygraph") ?? 2);
setState(() {});
},
),
Text(
AppLocalizations.of(context).yearly,
style: const TextStyle(
fontWeight: FontWeight.bold,
),
),
],
),
),
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
boxShadow: (MediaQuery.of(context)
.platformBrightness ==
Brightness.light)
? [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 3,
blurRadius: 7,
offset: const Offset(
0,
3,
),
),
]
: null,
color: (MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Theme.of(context)
.colorScheme
.secondaryContainer
: Theme.of(context).colorScheme.surface,
),
child: Padding(
padding: const EdgeInsets.all(8),
child: Column(
children: [
Text(
yearly
? AppLocalizations.of(context)
.incomePerYear(
_selectedDate.year,
)
: AppLocalizations.of(context)
.incomePerMonth(
DateFormat.yMMMM(locale)
.format(_selectedDate),
),
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
const SizedBox(
height: 15,
),
SizedBox(
width: MediaQuery.of(context).size.width *
0.9,
height:
MediaQuery.of(context).size.height *
0.35,
child: (chartType == null)
? const CircularProgressIndicator()
: (chartType == 1)
? ExpensesBarChart(
currency:
selectedWallet!.currency,
date: _selectedDate,
locale: locale ?? "en",
yearly: yearly,
expenseData: const [],
incomeData: generateChartData(
EntryType.income,
),
)
: Padding(
padding:
const EdgeInsets.all(8),
child: ExpensesLineChart(
currency: selectedWallet!
.currency,
date: _selectedDate,
locale: locale ?? "en",
yearly: yearly,
expenseData: const [],
incomeData:
generateChartData(
EntryType.income,
),
),
),
),
],
),
),
),
const SizedBox(
height: 25,
),
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
boxShadow: (MediaQuery.of(context)
.platformBrightness ==
Brightness.light)
? [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 3,
blurRadius: 7,
offset: const Offset(
0,
3,
),
),
]
: null,
color: (MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Theme.of(context)
.colorScheme
.secondaryContainer
: Theme.of(context).colorScheme.surface,
),
width: MediaQuery.of(context).size.width * 0.95,
height: MediaQuery.of(context).size.height * 0.4,
child: Column(
children: [
const SizedBox(
height: 10,
),
Flexible(
child: Text(
yearly
? AppLocalizations.of(context)
.incomePerYearCategory(
_selectedDate.year,
)
: AppLocalizations.of(context)
.incomePerMonthCategory(
DateFormat.yMMMM(locale)
.format(_selectedDate),
),
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
),
Padding(
padding: const EdgeInsets.all(6),
child: CategoriesPieChart(
locale: locale ?? "en",
symbol: selectedWallet!.currency.symbol,
entries: selectedWallet!.entries
.where(
(element) =>
((!yearly)
? element.date.month ==
_selectedDate
.month &&
element.date.year ==
_selectedDate.year
: element.date.year ==
_selectedDate.year) &&
element.type ==
EntryType.income,
)
.toList(),
categories: selectedWallet!.categories,
),
),
],
),
),
],
),
),
),
), // Income Tab END
],
),
),
);
}
}