mirror of
https://github.com/rzuasti/oott.git
synced 2026-07-08 19:21:54 +02:00
Adding fancy stuff to events list
This commit is contained in:
@@ -3,67 +3,97 @@ import 'package:frontend/utils/friendly_date_formatter.dart';
|
|||||||
import '../model/event.dart';
|
import '../model/event.dart';
|
||||||
import '../model/device_type.dart';
|
import '../model/device_type.dart';
|
||||||
|
|
||||||
// Dummy events to display
|
class EventsList extends StatefulWidget {
|
||||||
// TODO : Replace with API call
|
@override
|
||||||
final List<Event> events = <Event>[
|
_EventListState createState() => _EventListState();
|
||||||
Event(
|
}
|
||||||
id: 5,
|
|
||||||
title: 'New device found',
|
class _EventListState extends State<EventsList> {
|
||||||
description: 'Apple device @ 192.168.0.1 with MAC 56:e7:e3:07:d2:d5',
|
// Dummy events to display
|
||||||
isRead: false,
|
// TODO : Replace with API call
|
||||||
deviceType: DeviceType.phone,
|
List<Event> events = <Event>[
|
||||||
dateTime: DateTime.now().subtract(Duration(minutes: 22)),
|
Event(
|
||||||
),
|
id: 5,
|
||||||
Event(
|
title: 'New device found',
|
||||||
id: 4,
|
description: 'Apple device @ 192.168.0.1 with MAC 56:e7:e3:07:d2:d5',
|
||||||
title: 'New device found',
|
isRead: false,
|
||||||
description: 'Apple device @ 192.168.0.1 with MAC 56:e7:e3:07:d2:d5',
|
deviceType: DeviceType.phone,
|
||||||
isRead: false,
|
dateTime: DateTime.now().subtract(Duration(minutes: 22)),
|
||||||
deviceType: DeviceType.pc,
|
),
|
||||||
dateTime: DateTime.now().subtract(Duration(minutes: 87)),
|
Event(
|
||||||
),
|
id: 4,
|
||||||
Event(
|
title: 'New device found',
|
||||||
id: 3,
|
description: 'Apple device @ 192.168.0.1 with MAC 56:e7:e3:07:d2:d5',
|
||||||
title: 'New device found',
|
isRead: false,
|
||||||
description: 'Apple device @ 192.168.0.1 with MAC 56:e7:e3:07:d2:d5',
|
deviceType: DeviceType.pc,
|
||||||
isRead: false,
|
dateTime: DateTime.now().subtract(Duration(minutes: 87)),
|
||||||
deviceType: DeviceType.tablet,
|
),
|
||||||
dateTime: DateTime.now().subtract(Duration(hours: 23)),
|
Event(
|
||||||
),
|
id: 3,
|
||||||
Event(
|
title: 'New device found',
|
||||||
id: 2,
|
description: 'Apple device @ 192.168.0.1 with MAC 56:e7:e3:07:d2:d5',
|
||||||
title: 'New device found',
|
isRead: false,
|
||||||
description: 'Apple device @ 192.168.0.1 with MAC 56:e7:e3:07:d2:d5',
|
deviceType: DeviceType.tablet,
|
||||||
isRead: false,
|
dateTime: DateTime.now().subtract(Duration(hours: 23)),
|
||||||
deviceType: DeviceType.server,
|
),
|
||||||
dateTime: DateTime(2026, 01, 19, 14, 47),
|
Event(
|
||||||
),
|
id: 2,
|
||||||
Event(
|
title: 'New device found',
|
||||||
id: 1,
|
description: 'Apple device @ 192.168.0.1 with MAC 56:e7:e3:07:d2:d5',
|
||||||
title: 'New device found',
|
isRead: false,
|
||||||
description: 'Apple device @ 192.168.0.1 with MAC 56:e7:e3:07:d2:d5',
|
deviceType: DeviceType.server,
|
||||||
isRead: false,
|
dateTime: DateTime(2026, 01, 19, 14, 47),
|
||||||
deviceType: DeviceType.phone,
|
),
|
||||||
dateTime: DateTime(2026, 01, 17, 14, 47),
|
Event(
|
||||||
),
|
id: 1,
|
||||||
];
|
title: 'New device found',
|
||||||
|
description: 'Apple device @ 192.168.0.1 with MAC 56:e7:e3:07:d2:d5',
|
||||||
|
isRead: false,
|
||||||
|
deviceType: DeviceType.phone,
|
||||||
|
dateTime: DateTime(2026, 01, 17, 14, 47),
|
||||||
|
),
|
||||||
|
];
|
||||||
|
|
||||||
class EventsList extends StatelessWidget {
|
|
||||||
const EventsList({super.key});
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return ListView.separated(
|
return Scaffold(
|
||||||
itemCount: events.length,
|
appBar: AppBar(title: const Text('Events')),
|
||||||
itemBuilder: (context, index) {
|
body: ListView.separated(
|
||||||
return ListTile(
|
itemCount: events.length,
|
||||||
leading: Icon(events[index].deviceType.icon),
|
itemBuilder: (context, index) {
|
||||||
title: Text(
|
return Dismissible(
|
||||||
'${FriendlyDateFormatter().format(events[index].dateTime)} - ${events[index].title}',
|
key: UniqueKey(),
|
||||||
),
|
onDismissed: (direction) {
|
||||||
subtitle: Text(events[index].description),
|
setState(() {
|
||||||
);
|
events.removeAt(index);
|
||||||
},
|
});
|
||||||
separatorBuilder: (context, index) => Divider(),
|
|
||||||
|
ScaffoldMessenger.of(context).showSnackBar(
|
||||||
|
SnackBar(
|
||||||
|
content: Text('Event marked as read'),
|
||||||
|
behavior: SnackBarBehavior.floating,
|
||||||
|
showCloseIcon: true,
|
||||||
|
),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
background: Container(
|
||||||
|
color: Theme.of(context).colorScheme.primaryContainer,
|
||||||
|
alignment: Alignment.center,
|
||||||
|
child: Icon(Icons.done),
|
||||||
|
),
|
||||||
|
child: ListTile(
|
||||||
|
leading: Icon(events[index].deviceType.icon),
|
||||||
|
title: Text(
|
||||||
|
'${FriendlyDateFormatter().format(events[index].dateTime)} - ${events[index].title}',
|
||||||
|
),
|
||||||
|
subtitle: Text(events[index].description),
|
||||||
|
trailing: Icon(Icons.more_vert),
|
||||||
|
onTap: () {},
|
||||||
|
),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
separatorBuilder: (context, index) => Divider(),
|
||||||
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -14,7 +14,7 @@ final GoRouter router = GoRouter(
|
|||||||
GoRoute(
|
GoRoute(
|
||||||
path: '/events',
|
path: '/events',
|
||||||
name: 'events',
|
name: 'events',
|
||||||
builder: (context, state) => const EventsList(),
|
builder: (context, state) => EventsList(),
|
||||||
),
|
),
|
||||||
GoRoute(
|
GoRoute(
|
||||||
path: '/devices',
|
path: '/devices',
|
||||||
@@ -49,7 +49,9 @@ class MainShell extends StatelessWidget {
|
|||||||
return Scaffold(
|
return Scaffold(
|
||||||
appBar: AppBar(
|
appBar: AppBar(
|
||||||
title: const Text('OOTT'),
|
title: const Text('OOTT'),
|
||||||
backgroundColor: Theme.of(context).colorScheme.surfaceBright,
|
backgroundColor: Theme.of(
|
||||||
|
context,
|
||||||
|
).colorScheme.surfaceContainerLowest,
|
||||||
),
|
),
|
||||||
body: Row(
|
body: Row(
|
||||||
children: [
|
children: [
|
||||||
@@ -57,7 +59,7 @@ class MainShell extends StatelessWidget {
|
|||||||
child: NavigationRail(
|
child: NavigationRail(
|
||||||
backgroundColor: Theme.of(
|
backgroundColor: Theme.of(
|
||||||
context,
|
context,
|
||||||
).colorScheme.primaryContainer,
|
).colorScheme.surfaceContainerLow,
|
||||||
extended: constraints.maxWidth >= 600,
|
extended: constraints.maxWidth >= 600,
|
||||||
destinations: [
|
destinations: [
|
||||||
NavigationRailDestination(
|
NavigationRailDestination(
|
||||||
@@ -89,7 +91,7 @@ class MainShell extends StatelessWidget {
|
|||||||
Expanded(
|
Expanded(
|
||||||
child: Container(
|
child: Container(
|
||||||
padding: const EdgeInsets.all(20),
|
padding: const EdgeInsets.all(20),
|
||||||
color: Theme.of(context).colorScheme.surfaceDim,
|
color: Theme.of(context).colorScheme.surface,
|
||||||
child: child,
|
child: child,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
|||||||
Reference in New Issue
Block a user