add pages and update button

CMakeLists.txt

@@ -23,10 +23,14 @@ qt_add_qml_module(apparchpack
   QML_FILES
     Main.qml
     qml/style/Theme.qml
-    qml/buttons/Settings.qml
+    qml/buttons/SettingsBtn.qml
+    qml/buttons/UpdateBtn.qml
     qml/components/Title.qml
     qml/components/Line.qml
     qml/components/Tabs.qml
+    qml/components/pages/UpdatePg.qml
+    qml/components/pages/InstallPg.qml
+    qml/components/pages/DeletePg.qml
   SOURCES
     cpp/utils/utils.hpp
     cpp/utils/utils.cpp

Main.qml

@@ -2,8 +2,8 @@ import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
 
-import archpack
 import "qml/components" as Components
+import "qml/components/pages" as Pages
 import "qml/buttons" as Buttons
 
 ApplicationWindow {
@@ -34,7 +34,7 @@ ApplicationWindow {
         Layout.alignment: Qt.AlignBottom
       }
 
-      Buttons.Settings {
+      Buttons.SettingsBtn {
         id: settingsButton
         Layout.alignment: Qt.AlignBottom
       }
@@ -44,12 +44,26 @@ ApplicationWindow {
 
     Components.Tabs {
       id: tabs
-      Layout.alignment: Qt.AlignTop
       parentWidth: mainLayout.width
     }
 
-    Item {
+    StackLayout {
+      id: pages
+      Layout.fillWidth: true
       Layout.fillHeight: true
+      currentIndex: tabs.currentIndex
+
+      Pages.UpdatePg {
+        id: pgUpdate
+      }
+
+      Pages.InstallPg {
+        id: pgInstall
+      }
+
+      Pages.DeletePg {
+        id: pgDelete
+      }
     }
   }
 }

qml/buttons/UpdateBtn.qml

@@ -0,0 +1,34 @@
+import QtQuick
+import QtQuick.Controls
+
+Button {
+  id: root
+  implicitHeight: 44
+  font.pixelSize: 15
+  font.bold: true
+
+  property int packageCount: 0
+  property bool isChecking: false
+  property bool isUpdating: false
+  property bool isInstalling: false
+
+  enabled: !root.isUpdating && !root.isChecking && !root.isInstalling && root.packageCount > 0
+  text: root.isUpdating ? "Обновление..." : root.isChecking ? "Проверка..." : root.packageCount > 0 ? "Обновить систему" : "✓  Всё обновлено"
+
+  background: Rectangle {
+    radius: 1
+    color: !root.enabled ? "#313244" : root.down ? "#6f8fd8" : root.hovered ? "#89b4fa" : "#8CAAEE"
+    border.width: root.visualFocus ? 2 : 0
+    border.color: "#cdd6f4"
+
+    Behavior on color { ColorAnimation { duration: 100 } }
+  }
+
+  contentItem: Text {
+    text: root.text
+    font: root.font
+    color: root.enabled ? "#1e1e2e" : "#585b70"
+    horizontalAlignment: Text.AlignHCenter
+    verticalAlignment: Text.AlignVCenter
+  }
+}

qml/components/Tabs.qml

@@ -3,6 +3,7 @@ import QtQuick.Controls
 
 TabBar {
   id: root
+  spacing: 0 // у Fusion TabBar.spacing по умолчанию -1
 
   property int parentWidth: 0
 
@@ -25,7 +26,7 @@ TabBar {
 
     contentItem: Text {
       text: tabElement.text
-      color: tabElement.checked ? "#cdd6f4" : "#a6adc8"
+      color: tabElement.checked ? Theme.color2 : Theme.color3
       font.pixelSize: 13
       font.bold: tabElement.checked
       horizontalAlignment: Text.AlignHCenter
@@ -44,7 +45,7 @@ TabBar {
         anchors.margins: 0
         height: 1
         radius: 1
-        color: "#89b4fa"
+        color: Theme.color6
         visible: tabElement.checked
       }
     }

qml/components/pages/DeletePg.qml

@@ -0,0 +1,4 @@
+import QtQuick
+
+Item { }
+

qml/components/pages/InstallPg.qml

@@ -0,0 +1,6 @@
+import QtQuick
+
+Item { }
+
+
+

qml/components/pages/UpdatePg.qml

@@ -0,0 +1,23 @@
+import QtQuick
+import QtQuick.Layouts
+import "../../buttons" as Buttons
+
+Item { 
+  id: root
+
+  ColumnLayout {
+    anchors.fill: parent
+    spacing: 12
+
+    Item {
+      Layout.fillWidth: true
+      Layout.fillHeight: true
+    }
+
+    Buttons.UpdateBtn {
+      Layout.fillWidth: true
+    }
+  }
+}
+
+

qml/style/Theme.qml

@@ -8,6 +8,7 @@ QtObject {
   readonly property color color3: "#6c7086"
   readonly property color color4: "#45475a"
   readonly property color color5: "#313244"
+  readonly property color color6: "#89b4fa"
   readonly property color colorTransparent: "transparent"
 
   readonly property int fontSize: 12