feat: Add statistics card on landing page

This commit is contained in:
Anton Stubenbord
2023-08-01 18:09:14 +02:00
parent f3e660e91d
commit 53a01ae775
21 changed files with 469 additions and 78 deletions

View File

@@ -341,13 +341,6 @@ class _DocumentDetailsPageState extends State<DocumentDetailsPage> {
document: state.document,
enabled: isConnected,
),
// //TODO: Enable again, need new pdf viewer package...
// IconButton(
// tooltip: S.of(context)!.previewTooltip,
// icon: const Icon(Icons.visibility),
// onPressed:
// (isConnected) ? () => _onOpen(state.document) : null,
// ).paddedOnly(right: 4.0),
IconButton(
tooltip: S.of(context)!.openInSystemViewer,
icon: const Icon(Icons.open_in_new),
@@ -355,7 +348,7 @@ class _DocumentDetailsPageState extends State<DocumentDetailsPage> {
).paddedOnly(right: 4.0),
DocumentShareButton(document: state.document),
IconButton(
tooltip: S.of(context)!.print, //TODO: INTL
tooltip: S.of(context)!.print,
onPressed: () =>
context.read<DocumentDetailsCubit>().printDocument(),
icon: const Icon(Icons.print),

View File

@@ -1,4 +1,3 @@
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:go_router/go_router.dart';
@@ -46,24 +45,21 @@ class ScaffoldWithNavigationBarState extends State<ScaffoldWithNavigationBar> {
if (widget.authenticatedUser.canViewDocuments) {
widget.navigationShell.goBranch(index);
} else {
showSnackBar(context,
"You do not have the required permissions to access this page.");
showSnackBar(context, S.of(context)!.missingPermissions);
}
break;
case _scannerIndex:
if (widget.authenticatedUser.canCreateDocuments) {
widget.navigationShell.goBranch(index);
} else {
showSnackBar(context,
"You do not have the required permissions to access this page.");
showSnackBar(context, S.of(context)!.missingPermissions);
}
break;
case _labelsIndex:
if (widget.authenticatedUser.canViewAnyLabel) {
widget.navigationShell.goBranch(index);
} else {
showSnackBar(context,
"You do not have the required permissions to access this page.");
showSnackBar(context, S.of(context)!.missingPermissions);
}
break;
case _inboxIndex:
@@ -71,8 +67,7 @@ class ScaffoldWithNavigationBarState extends State<ScaffoldWithNavigationBar> {
widget.authenticatedUser.canViewTags) {
widget.navigationShell.goBranch(index);
} else {
showSnackBar(context,
"You do not have the required permissions to access this page.");
showSnackBar(context, S.of(context)!.missingPermissions);
}
break;
default:

View File

@@ -61,7 +61,6 @@ class InboxCubit extends HydratedCubit<InboxState>
Future<void> initialize() async {
await refreshItemsInInboxCount(false);
await loadInbox();
super.initialize();
}
Future<void> refreshItemsInInboxCount([bool shouldLoadInbox = true]) async {

View File

@@ -214,6 +214,10 @@ class _InboxPageState extends State<InboxPage>
}
Future<bool> _onItemDismissed(DocumentModel doc) async {
if (!context.read<LocalUserAccount>().paperlessUser.canEditDocuments) {
showSnackBar(context, S.of(context)!.missingPermissions);
return false;
}
try {
final removedTags = await context.read<InboxCubit>().removeFromInbox(doc);
showSnackBar(

View File

@@ -1,7 +1,18 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:go_router/go_router.dart';
import 'package:paperless_api/paperless_api.dart';
import 'package:paperless_mobile/core/database/tables/local_user_account.dart';
import 'package:paperless_mobile/extensions/flutter_extensions.dart';
import 'package:paperless_mobile/features/app_drawer/view/app_drawer.dart';
import 'package:paperless_mobile/features/document_search/view/sliver_search_bar.dart';
import 'package:paperless_mobile/features/landing/view/widgets/expansion_card.dart';
import 'package:paperless_mobile/features/landing/view/widgets/mime_types_pie_chart.dart';
import 'package:paperless_mobile/generated/l10n/app_localizations.dart';
import 'package:paperless_mobile/routes/routes.dart';
import 'package:paperless_mobile/routes/typed/branches/documents_route.dart';
import 'package:paperless_mobile/routes/typed/branches/inbox_route.dart';
import 'package:fl_chart/fl_chart.dart';
class LandingPage extends StatefulWidget {
const LandingPage({super.key});
@@ -14,6 +25,7 @@ class _LandingPageState extends State<LandingPage> {
final _searchBarHandle = SliverOverlapAbsorberHandle();
@override
Widget build(BuildContext context) {
final currentUser = context.watch<LocalUserAccount>().paperlessUser;
return SafeArea(
child: Scaffold(
drawer: const AppDrawer(),
@@ -29,19 +41,126 @@ class _LandingPageState extends State<LandingPage> {
],
body: CustomScrollView(
slivers: [
SliverPadding(
padding: const EdgeInsets.all(16),
sliver: SliverToBoxAdapter(
child: Text(
"Welcome!",
style: Theme.of(context).textTheme.titleLarge,
),
),
SliverToBoxAdapter(
child: Text(
"Welcome to Paperless Mobile, ${currentUser.fullName ?? currentUser.username}!",
textAlign: TextAlign.center,
style: Theme.of(context)
.textTheme
.displaySmall
?.copyWith(fontSize: 28),
).padded(24),
),
SliverToBoxAdapter(child: _buildStatisticsCard(context)),
],
),
),
),
);
}
Widget _buildStatisticsCard(BuildContext context) {
return FutureBuilder<PaperlessServerStatisticsModel>(
future: context.read<PaperlessServerStatsApi>().getServerStatistics(),
builder: (context, snapshot) {
if (!snapshot.hasData) {
return Card(
margin: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Statistics", //TODO: INTL
style: Theme.of(context).textTheme.titleLarge,
),
const Padding(
padding: EdgeInsets.all(16.0),
child: Center(child: CircularProgressIndicator()),
),
],
).padded(16),
);
}
final stats = snapshot.data!;
return ExpansionCard(
title: Text(
"Statistics", //TODO: INTL
style: Theme.of(context).textTheme.titleLarge,
),
content: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Card(
color: Theme.of(context).colorScheme.surfaceVariant,
child: ListTile(
shape: Theme.of(context).cardTheme.shape,
titleTextStyle: Theme.of(context).textTheme.labelLarge,
title: Text("Documents in inbox:"),
onTap: () {
InboxRoute().go(context);
},
trailing: Chip(
padding: EdgeInsets.symmetric(
horizontal: 4,
vertical: 2,
),
labelPadding: EdgeInsets.symmetric(horizontal: 4),
label: Text(
stats.documentsInInbox.toString(),
),
),
),
),
Card(
color: Theme.of(context).colorScheme.surfaceVariant,
child: ListTile(
shape: Theme.of(context).cardTheme.shape,
titleTextStyle: Theme.of(context).textTheme.labelLarge,
title: Text("Total documents:"),
onTap: () {
DocumentsRoute().go(context);
},
trailing: Chip(
padding: EdgeInsets.symmetric(
horizontal: 4,
vertical: 2,
),
labelPadding: EdgeInsets.symmetric(horizontal: 4),
label: Text(
stats.documentsTotal.toString(),
),
),
),
),
Card(
color: Theme.of(context).colorScheme.surfaceVariant,
child: ListTile(
shape: Theme.of(context).cardTheme.shape,
titleTextStyle: Theme.of(context).textTheme.labelLarge,
title: Text("Total characters:"),
trailing: Chip(
padding: const EdgeInsets.symmetric(
horizontal: 4,
vertical: 2,
),
labelPadding: EdgeInsets.symmetric(horizontal: 4),
label: Text(
stats.totalChars.toString(),
),
),
),
),
AspectRatio(
aspectRatio: 1.3,
child: SizedBox(
width: 300,
child: MimeTypesPieChart(statistics: stats),
),
),
],
).padded(16),
);
},
);
}
}

View File

@@ -0,0 +1,33 @@
import 'package:flutter/material.dart';
import 'package:paperless_mobile/extensions/flutter_extensions.dart';
class ExpansionCard extends StatelessWidget {
final Widget title;
final Widget content;
const ExpansionCard({super.key, required this.title, required this.content});
@override
Widget build(BuildContext context) {
return Card(
margin: EdgeInsets.all(16),
child: Theme(
data: Theme.of(context).copyWith(
dividerColor: Colors.transparent,
expansionTileTheme: ExpansionTileThemeData(
shape: Theme.of(context).cardTheme.shape,
collapsedShape: Theme.of(context).cardTheme.shape,
),
listTileTheme: ListTileThemeData(
shape: Theme.of(context).cardTheme.shape,
),
),
child: ExpansionTile(
initiallyExpanded: true,
title: title,
children: [content],
),
),
);
}
}

View File

@@ -0,0 +1,166 @@
import 'dart:math';
import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
import 'package:paperless_api/paperless_api.dart';
class MimeTypesPieChart extends StatefulWidget {
final PaperlessServerStatisticsModel statistics;
const MimeTypesPieChart({
super.key,
required this.statistics,
});
@override
State<MimeTypesPieChart> createState() => _MimeTypesPieChartState();
}
class _MimeTypesPieChartState extends State<MimeTypesPieChart> {
static final _mimeTypeNames = {
"application/pdf": "PDF Document",
"image/png": "PNG Image",
"image/jpeg": "JPEG Image",
"image/tiff": "TIFF Image",
"image/gif": "GIF Image",
"image/webp": "WebP Image",
"text/plain": "Plain Text Document",
"application/msword": "Microsoft Word Document",
"application/vnd.openxmlformats-officedocument.wordprocessingml.document":
"Microsoft Word Document (OpenXML)",
"application/vnd.ms-powerpoint": "Microsoft PowerPoint Presentation",
"application/vnd.openxmlformats-officedocument.presentationml.presentation":
"Microsoft PowerPoint Presentation (OpenXML)",
"application/vnd.ms-excel": "Microsoft Excel Spreadsheet",
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet":
"Microsoft Excel Spreadsheet (OpenXML)",
"application/vnd.oasis.opendocument.text": "ODT Document",
"application/vnd.oasis.opendocument.presentation": "ODP Presentation",
"application/vnd.oasis.opendocument.spreadsheet": "ODS Spreadsheet",
};
int? _touchedIndex = -1;
@override
Widget build(BuildContext context) {
final colorShades = Colors.lightGreen.values;
return Column(
children: [
Expanded(
child: PieChart(
PieChartData(
startDegreeOffset: 90,
// pieTouchData: PieTouchData(
// touchCallback: (event, response) {
// setState(() {
// if (!event.isInterestedForInteractions ||
// response == null ||
// response.touchedSection == null) {
// _touchedIndex = -1;
// return;
// }
// _touchedIndex =
// response.touchedSection!.touchedSectionIndex;
// });
// },
// ),
borderData: FlBorderData(
show: false,
),
sectionsSpace: 0,
centerSpaceRadius: 40,
sections: _buildSections(colorShades).toList(),
),
),
),
Wrap(
alignment: WrapAlignment.start,
spacing: 8,
runSpacing: 8,
children: [
for (int i = 0; i < widget.statistics.fileTypeCounts.length; i++)
GestureDetector(
onTapDown: (_) {
setState(() {
_touchedIndex = i;
});
},
onTapUp: (details) {
setState(() {
_touchedIndex = -1;
});
},
onTapCancel: () {
setState(() {
_touchedIndex = -1;
});
},
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Container(
decoration: BoxDecoration(
shape: BoxShape.circle,
color: colorShades[i % colorShades.length],
),
margin: EdgeInsets.only(right: 8),
width: 20,
height: 20,
),
Text(
_mimeTypeNames[
widget.statistics.fileTypeCounts[i].mimeType]!,
style: Theme.of(context).textTheme.bodyLarge,
),
],
),
),
],
),
],
);
}
Iterable<PieChartSectionData> _buildSections(List<Color> colorShades) sync* {
for (int i = 0; i < widget.statistics.fileTypeCounts.length; i++) {
final type = widget.statistics.fileTypeCounts[i];
final isTouched = i == _touchedIndex;
final fontSize = isTouched ? 24.0 : 16.0;
final radius = isTouched ? 60.0 : 50.0;
const shadows = [
Shadow(color: Colors.black, blurRadius: 2),
];
final color = colorShades[i % colorShades.length];
final textColor =
color.computeLuminance() > 0.5 ? Colors.black : Colors.white;
yield PieChartSectionData(
color: colorShades[i % colorShades.length],
value: type.count.toDouble(),
title: ((type.count / widget.statistics.documentsTotal) * 100)
.toStringAsFixed(1) +
"%",
radius: radius,
titleStyle: TextStyle(
fontSize: fontSize,
fontWeight: FontWeight.bold,
color: textColor,
),
);
}
}
}
extension AllShades on MaterialColor {
List<Color> get values => [
shade200,
shade600,
shade300,
shade100,
shade800,
shade400,
shade900,
shade500,
shade700,
];
}