dashboard/calendar: add scroll

modules/dashboard/dash/Calendar.qml

@@ -2,13 +2,14 @@ pragma ComponentBehavior: Bound
 
 import qs.components
 import qs.components.effects
+import qs.components.controls
 import qs.services
 import qs.config
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
 
-Column {
+CustomMouseArea {
     id: root
 
     required property var state
@@ -18,15 +19,29 @@ Column {
 
     anchors.left: parent.left
     anchors.right: parent.right
-    padding: Appearance.padding.large
+    implicitHeight: inner.implicitHeight + inner.anchors.margins * 2
+
+    acceptedButtons: Qt.MiddleButton
+    onClicked: root.state.currentDate = new Date()
+
+    function onWheel(event: WheelEvent): void {
+        if (event.angleDelta.y > 0)
+            root.state.currentDate = new Date(root.currYear, root.currMonth - 1, 1);
+        else if (event.angleDelta.y < 0)
+            root.state.currentDate = new Date(root.currYear, root.currMonth + 1, 1);
+    }
+
+    ColumnLayout {
+        id: inner
+
+        anchors.fill: parent
+        anchors.margins: Appearance.padding.large
         spacing: Appearance.spacing.small
 
         RowLayout {
             id: monthNavigationRow
 
-        anchors.left: parent.left
+            Layout.fillWidth: true
-        anchors.right: parent.right
-        anchors.margins: parent.padding
             spacing: Appearance.spacing.small
 
             Item {
@@ -67,7 +82,10 @@ Column {
                     anchors.rightMargin: -Appearance.padding.normal
 
                     radius: Appearance.rounding.full
-                disabled: root.state.currentDate.toDateString() == new Date().toDateString()
+                    disabled: {
+                        const now = new Date();
+                        return root.currMonth === now.getMonth() && root.currYear === now.getFullYear();
+                    }
 
                     function onClicked(): void {
                         root.state.currentDate = new Date();
@@ -115,12 +133,9 @@ Column {
         DayOfWeekRow {
             id: daysRow
 
+            Layout.fillWidth: true
             locale: grid.locale
 
-        anchors.left: parent.left
-        anchors.right: parent.right
-        anchors.margins: parent.padding
-
             delegate: StyledText {
                 required property var model
 
@@ -132,10 +147,7 @@ Column {
         }
 
         Item {
-        anchors.left: parent.left
+            Layout.fillWidth: true
-        anchors.right: parent.right
-        anchors.margins: parent.padding
-
             implicitHeight: grid.implicitHeight
 
             MonthGrid {
@@ -238,3 +250,4 @@ Column {
             }
         }
     }
+}