Start graph rendering

frontend/lib/main.dart

@@ -4,6 +4,7 @@ import 'constants.dart';
 
 import 'states/home_page.dart';
 import 'states/plug_settings.dart';
+import 'states/graphs.dart';
 
 void main() {
   runApp(const MyApp());
@@ -24,6 +25,7 @@ class MyApp extends StatelessWidget {
         home: const MyHomePage(title: 'Home Server'),
         routes: <String, WidgetBuilder>{
           '/plug_settings': (BuildContext context) => PlugSettings(),
+          '/graphs': (BuildContext context) => Graphs(),
         });
   }
 }

frontend/lib/states/graphs.dart

@@ -0,0 +1,98 @@
+import 'package:fl_chart/fl_chart.dart';
+import 'package:flutter/material.dart';
+import 'package:http/http.dart' as http;
+import 'package:intl/intl.dart';
+
+import '../constants.dart';
+
+class Graphs extends StatefulWidget {
+  const Graphs({super.key});
+
+  @override
+  State<Graphs> createState() => _GraphsState();
+}
+
+class _GraphsState extends State<Graphs> {
+  String? start_date;
+  String? end_date;
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+        appBar: AppBar(
+          backgroundColor: Theme.of(context).colorScheme.inversePrimary,
+          title: const Text('Graphs'),
+          actions: [
+            IconButton(
+                icon: const Icon(Icons.arrow_back),
+                onPressed: () => Navigator.of(context).pushReplacementNamed(
+                      '/',
+                    ))
+          ],
+        ),
+        body: Center(
+            child: Column(children: [
+          Row(children: [
+            const Text('Start'),
+            SizedBox(
+                width: 200,
+                height: 40,
+                child: TextField(
+                  decoration: const InputDecoration(
+                      icon: Icon(Icons.calendar_today),
+                      labelText: "Enter Date"),
+                  readOnly: true,
+                  onTap: () async {
+                    final DateTime? pickedDate = await showDatePicker(
+                        context: context,
+                        initialDate: DateTime.now(),
+                        firstDate: DateTime(2023),
+                        lastDate: DateTime(2101));
+
+                    if (pickedDate != null) {
+                      final String formattedDate =
+                          DateFormat('dd.MM.yyyy').format(pickedDate);
+
+                      print(formattedDate);
+                    }
+                  },
+                  onChanged: (text) => start_date = text,
+                ))
+          ]),
+          Row(children: [
+            const Text('End'),
+            SizedBox(
+                width: 200,
+                height: 40,
+                child: TextField(
+                  decoration: const InputDecoration(
+                      icon: Icon(Icons.calendar_today),
+                      labelText: "Enter Date"),
+                  readOnly: true,
+                  onTap: () async {
+                    final DateTime? pickedDate = await showDatePicker(
+                        context: context,
+                        initialDate: DateTime.now(),
+                        firstDate: DateTime(2023),
+                        lastDate: DateTime(2101));
+
+                    if (pickedDate != null) {
+                      final String formattedDate =
+                          DateFormat('dd.MM.yyyy').format(pickedDate);
+
+                      print(formattedDate);
+                    }
+                  },
+                  onChanged: (text) => end_date = text,
+                ))
+          ]),
+          // LineChart(
+          //   LineChartData(
+          //       //
+          //       ),
+          //   duration: const Duration(milliseconds: 200),
+          //   curve: Curves.linear,
+          // )
+        ])));
+  }
+}

frontend/lib/states/home_page.dart

@@ -45,6 +45,17 @@ class _MyHomePageState extends State<MyHomePage> {
               appBar: AppBar(
                 backgroundColor: Theme.of(context).colorScheme.inversePrimary,
                 title: Text(widget.title),
+                actions: [
+                  IconButton(
+                      icon: const Icon(Icons.auto_graph_outlined),
+                      onPressed: () =>
+                          Navigator.of(context).pushReplacementNamed(
+                            '/graphs',
+                          )),
+                  IconButton(
+                      icon: const Icon(Icons.refresh_outlined),
+                      onPressed: () {})
+                ],
               ),
               body: Column(children: [
                 Container(

frontend/pubspec.yaml

@@ -38,6 +38,8 @@ dependencies:
 
   http: ^1.1.0
   flutter_spinkit: ^5.2.0
+  fl_chart: ^0.64.0
+  intl: ^0.18.1
 
 dev_dependencies:
   flutter_test: