Added a months grid view

src/Project-Orion/DateRangeSelector.qml

@@ -3,7 +3,7 @@ import QtQuick.Controls
 import QtQuick.Layouts
 
 Dialog {
-    width: 300
+    width: 400
     height: 300
 
     id: dateRangeRootDialog
@@ -19,7 +19,7 @@ Dialog {
         YEAR = 2
     }
 
-    property int viewMode: Qt.enumStringToValue(DateRangeSelector.ViewMode, "DAY")
+    property int viewMode: 0
     property date beginDate;
     property date endDate;
 
@@ -33,7 +33,7 @@ Dialog {
         GridLayout {
             id: myGridLayout
             columns: 1
-
+            anchors.centerIn: parent
             Label
             {
                 font.pixelSize: 22
@@ -41,19 +41,19 @@ Dialog {
             }
 
             DayOfWeekRow {
-                visible: dateRangeRootDialog.viewMode === Qt.enumStringToValue(DateRangeSelector.ViewMode, "DAY")
+                visible: dateRangeRootDialog.viewMode === DateRangeSelector.ViewMode.DAY
                 locale: grid.locale
                 Layout.fillWidth: true
             }
 
             MonthGrid
             {
-
                 id: grid
+
                 month: currentDate.getMonth()
                 year: currentDate.getFullYear()
                 locale: Qt.locale("en_US")
-
+                visible: dateRangeRootDialog.viewMode === DateRangeSelector.ViewMode.DAY
                 Layout.fillWidth: true
                 Layout.fillHeight: true
                 delegate: Rectangle {
@@ -61,8 +61,7 @@ Dialog {
                     border.width: 3
                     width: 30
                     height: 20
-                    color: calendarActivePalette.base
-
+                    color: calendarActivePalette ? calendarActivePalette.base: "black"
 
                     Text {
                         anchors.centerIn: parent
@@ -78,16 +77,54 @@ Dialog {
 
                 property date currentlySelectedDate: currentDate;
             }
+
+            Grid
+            {
+                id: monthsGrid
+                visible: dateRangeRootDialog.viewMode === DateRangeSelector.ViewMode.MONTH
+
+                property list<string> monthNames: ["January", "February", "March", "April", "May", "June",
+                "July", "August", "September", "October", "November", "December"];
+
+                spacing: 10
+                columns: 3
+
+                Repeater
+                {
+                    model: 12
+
+                    Rectangle {
+                        width: 100
+                        height: 30
+                        color: calendarActivePalette ? calendarActivePalette.base: "black"
+                        required property int index
+                        Label
+                        {
+                            anchors.centerIn: parent
+                            font.pixelSize: 12
+                            horizontalAlignment: Text.AlignHCenter
+                            verticalAlignment: Text.AlignVCenter
+                            anchors.horizontalCenter: parent.horizontalCenter
+                            text: monthsGrid.monthNames[index]
+
+                        }
+                    }
+                }
+            }
+
             Row
             {
                 Button
                 {
                     text: "Months"
+
+                    onPressed: dateRangeRootDialog.viewMode = DateRangeSelector.ViewMode.MONTH
                 }
 
                 Button
                 {
                     text: "Years"
+                    onPressed: dateRangeRootDialog.viewMode = DateRangeSelector.ViewMode.MONTH
                 }
             }
         }