Added placeholders no data charts

This commit is contained in:
Juan Gilsanz Polo 2023-12-17 14:32:46 +01:00
parent 6523229ea3
commit 71b870b42f
4 changed files with 85 additions and 52 deletions

View file

@ -713,5 +713,7 @@
"noFallbackDnsAdded": "No fallback DNS servers added.", "noFallbackDnsAdded": "No fallback DNS servers added.",
"blockedResponseTtl": "Blocked response TTL", "blockedResponseTtl": "Blocked response TTL",
"blockedResponseTtlDescription": "Specifies for how many seconds the clients should cache a filtered response", "blockedResponseTtlDescription": "Specifies for how many seconds the clients should cache a filtered response",
"invalidValue": "Invalid value" "invalidValue": "Invalid value",
"noDataChart": "There's no data to display this chart.",
"noData": "No data"
} }

View file

@ -713,5 +713,7 @@
"noFallbackDnsAdded": "No hay servidores DNS alternativos añadidos.", "noFallbackDnsAdded": "No hay servidores DNS alternativos añadidos.",
"blockedResponseTtl": "Respuesta TTL bloqueada", "blockedResponseTtl": "Respuesta TTL bloqueada",
"blockedResponseTtlDescription": "Especifica durante cuántos segundos los clientes deben almacenar en cache una respuesta filtrada", "blockedResponseTtlDescription": "Especifica durante cuántos segundos los clientes deben almacenar en cache una respuesta filtrada",
"invalidValue": "Valor no válido" "invalidValue": "Valor no válido",
"noDataChart": "No hay datos para mostrar este gráfico.",
"noData": "No hay datos"
} }

View file

@ -1,5 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:adguard_home_manager/widgets/line_chart.dart'; import 'package:adguard_home_manager/widgets/line_chart.dart';
@ -13,6 +14,7 @@ class HomeChart extends StatefulWidget {
final Color color; final Color color;
final int hoursInterval; final int hoursInterval;
final void Function() onTapTitle; final void Function() onTapTitle;
final bool isDesktop;
const HomeChart({ const HomeChart({
super.key, super.key,
@ -23,6 +25,7 @@ class HomeChart extends StatefulWidget {
required this.color, required this.color,
required this.hoursInterval, required this.hoursInterval,
required this.onTapTitle, required this.onTapTitle,
required this.isDesktop,
}); });
@override @override
@ -58,7 +61,9 @@ class _HomeChartState extends State<HomeChart> {
), ),
child: Row( child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: isEmpty
? CrossAxisAlignment.center
: CrossAxisAlignment.start,
children: [ children: [
Flexible( Flexible(
child: MouseRegion( child: MouseRegion(
@ -68,7 +73,7 @@ class _HomeChartState extends State<HomeChart> {
child: GestureDetector( child: GestureDetector(
onTapDown: (_) => setState(() => _isHover = true), onTapDown: (_) => setState(() => _isHover = true),
onTapUp: (_) => setState(() => _isHover = false), onTapUp: (_) => setState(() => _isHover = false),
onTap: widget.onTapTitle, onTap: !isEmpty ? () => widget.onTapTitle () : null,
child: Row( child: Row(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: [
@ -79,66 +84,64 @@ class _HomeChartState extends State<HomeChart> {
style: TextStyle( style: TextStyle(
fontSize: 18, fontSize: 18,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: _isHover color: _isHover && !isEmpty
? Theme.of(context).colorScheme.onSurfaceVariant ? Theme.of(context).colorScheme.onSurfaceVariant
: Theme.of(context).colorScheme.onSurface, : Theme.of(context).colorScheme.onSurface,
), ),
), ),
), ),
const SizedBox(width: 4), if (!isEmpty) ...[
Icon( const SizedBox(width: 4),
Icons.chevron_right_rounded, Icon(
size: 20, Icons.chevron_right_rounded,
color: _isHover size: 20,
? Theme.of(context).colorScheme.onSurfaceVariant color: _isHover && !isEmpty
: Theme.of(context).colorScheme.onSurface, ? Theme.of(context).colorScheme.onSurfaceVariant
) : Theme.of(context).colorScheme.onSurface,
)
],
], ],
), ),
), ),
), ),
), ),
!isEmpty if (!isEmpty) Column(
? Column( crossAxisAlignment: CrossAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.end, children: [
children: [ Text(
Text( widget.primaryValue,
widget.primaryValue, style: TextStyle(
style: TextStyle( color: widget.color,
color: widget.color, fontSize: 18,
fontSize: 18, fontWeight: FontWeight.w500
fontWeight: FontWeight.w500 ),
), ),
), Text(
Text( widget.secondaryValue,
widget.secondaryValue, style: TextStyle(
style: TextStyle( fontSize: 12,
fontSize: 12, color: widget.color
color: widget.color ),
),
)
],
) )
: Row( ],
children: [ ),
Text( if (isEmpty && !widget.isDesktop) Column(
widget.primaryValue, children: [
style: TextStyle( Icon(
color: widget.color, Icons.show_chart_rounded,
fontSize: 18, color: Theme.of(context).colorScheme.onSurfaceVariant,
fontWeight: FontWeight.w500 size: 16,
), ),
), Text(
const SizedBox(width: 10), AppLocalizations.of(context)!.noData,
Text( style: TextStyle(
"(${widget.secondaryValue})", fontSize: 12,
style: TextStyle( fontWeight: FontWeight.w500,
fontSize: 12, color: Theme.of(context).colorScheme.onSurfaceVariant,
color: widget.color ),
),
)
],
) )
],
)
], ],
), ),
), ),
@ -153,6 +156,28 @@ class _HomeChartState extends State<HomeChart> {
context: context, context: context,
) )
), ),
if (isEmpty && widget.isDesktop) SizedBox(
height: 150,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.show_chart_rounded,
color: Theme.of(context).colorScheme.onSurfaceVariant,
size: 30,
),
const SizedBox(height: 20),
Text(
AppLocalizations.of(context)!.noDataChart,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 16,
color: Theme.of(context).colorScheme.onSurfaceVariant
),
)
],
),
)
], ],
), ),
), ),

View file

@ -153,6 +153,7 @@ class _HomeState extends State<Home> {
logsProvider.filterLogs(); logsProvider.filterLogs();
appConfigProvider.setSelectedScreen(2); appConfigProvider.setSelectedScreen(2);
}, },
isDesktop: width > 700,
), ),
), ),
FractionallySizedBox( FractionallySizedBox(
@ -171,6 +172,7 @@ class _HomeState extends State<Home> {
); );
appConfigProvider.setSelectedScreen(2); appConfigProvider.setSelectedScreen(2);
}, },
isDesktop: width > 700,
), ),
), ),
FractionallySizedBox( FractionallySizedBox(
@ -189,6 +191,7 @@ class _HomeState extends State<Home> {
); );
appConfigProvider.setSelectedScreen(2); appConfigProvider.setSelectedScreen(2);
}, },
isDesktop: width > 700,
), ),
), ),
FractionallySizedBox( FractionallySizedBox(
@ -208,6 +211,7 @@ class _HomeState extends State<Home> {
logsProvider.filterLogs(); logsProvider.filterLogs();
appConfigProvider.setSelectedScreen(2); appConfigProvider.setSelectedScreen(2);
}, },
isDesktop: width > 700,
), ),
), ),
], ],