Added Desktop View

2026-09-01 14:05:01 +02:00
parent 525aaa6555
commit 233d9feb94
2 changed files with 82 additions and 1 deletions
@@ -0,0 +1,71 @@
+import 'package:ac_web/Pages/AgentAvailabilities.dart';
+import 'package:ac_web/Pages/LatestReports.dart';
+import 'package:ac_web/Pages/Reports.dart';
+import 'package:ac_web/Widgets/LatestReportHeader.dart';
+import 'package:flutter/material.dart';
+
+/// Main screen for wide windows.
+///
+/// Instead of switching between the three pages through a navigation bar like
+/// the `MobileView` does, all of them are shown next to each other:
+/// reports on the left, the latest reports in the center and the agents on
+/// the right.
+class DesktopView extends StatelessWidget {
+  const DesktopView({super.key});
+
+  /// Breakpoint at which this layout is wide enough to be useful.
+  static const double minimumWidth = 900;
+
+  @override
+  Widget build(BuildContext context) {
+
+    return Scaffold(
+      appBar: AppBar(
+        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
+        title: Text("AC Control"),
+      ),
+      body: Row(
+        crossAxisAlignment: CrossAxisAlignment.stretch,
+        children: <Widget>[
+
+          // Reports grouped by their type
+          _buildColumn(flex: 2, child: const Reports()),
+
+          const VerticalDivider(width: 1, thickness: 1),
+
+          // The newest reports of every type
+          _buildColumn(flex: 3, child: LatestReports()),
+
+          const VerticalDivider(width: 1, thickness: 1),
+
+          // Agents and their current availability
+          _buildColumn(
+            flex: 2,
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: <Widget>[
+                // The other two columns draw their headline themselves.
+                Padding(
+                  padding: EdgeInsetsGeometry.fromLTRB(8, 8, 8, 0),
+                  child: LatestReportHeader(text: "Agents", bigHeader: true),
+                ),
+                const Expanded(child: AgentAvailabilities()),
+              ],
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  /// One column of the layout. Every column scrolls on its own.
+  Widget _buildColumn({required int flex, required Widget child}) {
+    return Expanded(
+      flex: flex,
+      child: Padding(
+        padding: EdgeInsetsGeometry.all(8),
+        child: child,
+      ),
+    );
+  }
+}