Added first project implementation

qml/Controls/DescriptionTextField.qml

@@ -0,0 +1,28 @@
+import QtQuick 2.12
+import QtQuick.Layouts 1.12
+
+import Controls 1.0 as CustomControls
+import Palette 1.0
+
+ColumnLayout {
+    id: root
+    spacing: 8
+
+    property string descriptionText
+    property string text
+    property string indicatorText
+    property bool readonly: false
+
+    CustomControls.Label {
+        text: root.descriptionText
+        Layout.leftMargin: 24
+        Layout.fillWidth: true
+    }
+
+    CustomControls.TextField {
+        text: root.text
+        indicatorText: root.indicatorText
+        readOnly: root.readonly
+        Layout.fillWidth: true
+    }
+}

qml/Controls/GroupBox.qml

@@ -0,0 +1,53 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.12 as Controls
+import QtQuick.Layouts 1.12
+
+import Controls 1.0 as CustomControls
+import Palette 1.0
+
+Controls.GroupBox {
+    id: control
+
+    leftPadding: 40
+    rightPadding: 40
+    topPadding: 56 + label.height + 48
+    bottomPadding: 56
+
+    property string subTitle: ""
+
+    background: Rectangle {
+        color: Palette.controlBackgroundColor
+        radius: 32
+    }
+
+    label: RowLayout {
+        width: parent.width - control.leftPadding - control.rightPadding
+        x: control.leftPadding
+        y: 56
+        spacing: 10
+
+        Text {
+            id: label
+            width: control.availableWidth
+
+            text: control.title
+            color: Palette.titleTextColor
+            elide: Text.ElideRight
+
+            font.family: "Roboto"
+            font.pixelSize: 40
+            font.weight: Font.Bold
+
+            Layout.fillWidth: true
+        }
+
+        CustomControls.IndicatorTextField {
+            text: control.subTitle
+            visible: control.subTitle.length > 0
+            font.pixelSize: 23
+            font.weight: Font.Normal
+            backgroundRadius: 16
+            readOnly: true
+        }
+    }
+}

qml/Controls/IndicatorTextField.qml

@@ -0,0 +1,29 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.12 as Controls
+
+import Palette 1.0
+
+Controls.TextField {
+    id: control
+
+    horizontalAlignment: Text.AlignHCenter
+    verticalAlignment: Text.AlignVCenter
+
+    topPadding: 10
+    bottomPadding: 10
+    leftPadding: 24
+    rightPadding: 24
+
+    font.family: "Roboto"
+    font.pixelSize: 40
+    font.weight: Font.Bold
+
+    color: Palette.labelTextColor
+    property color backgroundColor: Palette.indicatorBackgroundColor
+    property int backgroundRadius: 24
+
+    background: Rectangle {
+        color: backgroundColor
+        radius: backgroundRadius
+    }
+}

qml/Controls/Label.qml

@@ -0,0 +1,7 @@
+import QtQuick 2.12
+
+Text {
+    font.family: "Roboto"
+    font.pixelSize: 24
+    font.weight: Font.Normal
+}

qml/Controls/Switch.qml

@@ -0,0 +1,73 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.12 as Controls
+import QtQuick.Layouts 1.12
+
+import Palette 1.0
+
+Controls.Switch {
+    id: control
+
+    implicitHeight: 128
+    padding: 12
+
+    property string firstStateDescription
+    property string secondStateDescription
+
+    indicator: Item {
+        anchors.fill: control
+        anchors.margins: control.padding
+
+        RowLayout {
+            anchors.fill: parent
+            spacing: 0
+
+            Controls.Label {
+                id: firstLabel
+
+                text: control.firstStateDescription
+                horizontalAlignment: Text.AlignHCenter
+                verticalAlignment: Text.AlignVCenter
+
+                font.family: "Roboto"
+                font.pixelSize: 72
+                font.weight: Font.Bold
+
+                color: control.checked ? Palette.labelTextColor : Palette.alternativeLabelTextColor
+                Layout.preferredWidth: (parent.width -parent.spacing) / 2
+            }
+
+            Controls.Label {
+                id: secondLabel
+
+                text: control.secondStateDescription
+                horizontalAlignment: Text.AlignHCenter
+                verticalAlignment: Text.AlignVCenter
+
+                font.family: "Roboto"
+                font.pixelSize: 72
+                font.weight: Font.Bold
+
+                color: control.checked ? Palette.alternativeLabelTextColor : Palette.labelTextColor
+                Layout.preferredWidth: (parent.width -parent.spacing) / 2
+            }
+        }
+
+        Rectangle {
+            color: Palette.switchActiveBackgroundColor
+            radius: 24
+
+            width: control.checked ? secondLabel.width : firstLabel.width
+            height: parent.height
+            x: control.checked ? secondLabel.x : firstLabel.x
+            z: -1
+        }
+    }
+
+    contentItem: Item {
+    }
+
+    background: Rectangle {
+        color: Palette.switchBackgroundColor
+        radius: 32
+    }
+}

qml/Controls/TextField.qml

@@ -0,0 +1,53 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.12 as Controls
+
+import Palette 1.0
+
+Controls.TextField {
+    id: control
+
+    implicitHeight: 108
+
+    horizontalAlignment: Text.AlignRight
+    verticalAlignment: Text.AlignVCenter
+
+    topPadding: 12
+    bottomPadding: 12
+    leftPadding: 24
+    rightPadding: 24 + Math.ceil(indicatorLabel.width) + (indicatorLabel.visible ? 12 : 0)
+
+    font.family: "Roboto"
+    font.pixelSize: 72
+    font.weight: Font.Bold
+
+    color: Palette.labelTextColor
+
+    property string indicatorText
+
+    background: Rectangle {
+        radius: 32
+        color: Palette.controlBackgroundColor
+        border.width: 1
+        border.color: Palette.borderColor
+
+        width: control.width
+        height: control.height
+
+        Controls.Label {
+            id: indicatorLabel
+            visible: control.indicatorText.length > 0
+            text: control.indicatorText
+
+            anchors.right: parent.right
+            anchors.rightMargin: 24
+            anchors.bottom: parent.bottom
+            anchors.bottomMargin: 20
+
+            font.family: "Roboto"
+            font.pixelSize: 40
+            font.weight: Font.Normal
+
+            color: Palette.descriptionTextColor
+        }
+    }
+}

qml/Controls/TristateSwitch.qml

@@ -0,0 +1,76 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.12 as Controls
+import QtQuick.Layouts 1.12
+
+import Palette 1.0
+
+Controls.CheckBox {
+    id: control
+
+    implicitHeight: 128
+    padding: 12
+    tristate: true
+    checkState: Qt.Unchecked
+
+    property string firstStateDescription
+    property string secondStateDescription
+
+    indicator: Item {
+        anchors.fill: control
+        anchors.margins: control.padding
+
+        RowLayout {
+            anchors.fill: parent
+            spacing: 0
+
+            Controls.Label {
+                id: firstLabel
+
+                text: control.firstStateDescription
+                horizontalAlignment: Text.AlignHCenter
+                verticalAlignment: Text.AlignVCenter
+
+                font.family: "Roboto"
+                font.pixelSize: 72
+                font.weight: Font.Bold
+
+                color: control.checkState === Qt.PartiallyChecked ? Palette.alternativeLabelTextColor : Palette.labelTextColor
+                Layout.preferredWidth: (parent.width -parent.spacing) / 2
+            }
+
+            Controls.Label {
+                id: secondLabel
+
+                text: control.secondStateDescription
+                horizontalAlignment: Text.AlignHCenter
+                verticalAlignment: Text.AlignVCenter
+
+                font.family: "Roboto"
+                font.pixelSize: 72
+                font.weight: Font.Bold
+
+                color: control.checkState === Qt.Checked ? Palette.alternativeLabelTextColor : Palette.labelTextColor
+                Layout.preferredWidth: (parent.width -parent.spacing) / 2
+            }
+        }
+
+        Rectangle {
+            color: Palette.switchActiveBackgroundColor
+            radius: 24
+            visible: control.checkState !== Qt.Unchecked
+
+            width: control.checkState === Qt.Checked ? secondLabel.width : firstLabel.width
+            height: parent.height
+            x: control.checkState === Qt.Checked ? secondLabel.x : firstLabel.x
+            z: -1
+        }
+    }
+
+    contentItem: Item {
+    }
+
+    background: Rectangle {
+        color: Palette.switchBackgroundColor
+        radius: 32
+    }
+}

qml/Controls/qmldir

@@ -0,0 +1,8 @@
+module Controls
+TextField 1.0 TextField.qml
+IndicatorTextField 1.0 IndicatorTextField.qml
+DescriptionTextField 1.0 DescriptionTextField.qml
+Label 1.0 Label.qml
+GroupBox 1.0 GroupBox.qml
+Switch 1.0 Switch.qml
+TristateSwitch 1.0 TristateSwitch.qml

qml/Palette/Palette.qml

@@ -0,0 +1,23 @@
+pragma Singleton
+import QtQuick 2.12
+
+QtObject {
+    property color titleTextColor: "#232323"
+    property color labelTextColor: "#232323"
+    property color alternativeLabelTextColor: "#FFFFFF"
+    property color descriptionTextColor: "#757575"
+
+    property color backgroundColor: "#EEE"
+    property color controlBackgroundColor: "#FCFCFC"
+    property color indicatorBackgroundColor: "#F0F4FF"
+
+    property color switchBackgroundColor: "#F0F4FF"
+    property color switchActiveBackgroundColor: "#3069FE"
+
+    property color borderColor: "#D0D0D0"
+
+    property color informationColor: "#4C68ED"
+    property color invalidColor: "#A31C00"
+    property color goodColor: "#009352"
+    property color neutralColor: "#DFE0EB"
+}

qml/Palette/qmldir

@@ -0,0 +1,2 @@
+module Palette
+singleton Palette 1.0 Palette.qml

qml/main.qml

@@ -0,0 +1,369 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.12
+import QtQuick.Layouts 1.12
+
+import Controls 1.0 as CustomControls
+import Palette 1.0
+
+import Tksi 1.0
+
+ApplicationWindow {
+    id: root
+    width: 1920
+    height: 1080
+    visible: true
+    visibility: Qt.platform.os === "linux" ? "FullScreen" : "Windowed"
+    flags: Qt.platform.os === "linux" ? Qt.FramelessWindowHint | Qt.Window : Qt.Window
+    title: "ТКСИ 310 монитор"
+
+    ColumnLayout {
+        anchors.leftMargin: 56
+        anchors.rightMargin: 56
+        anchors.topMargin: 80
+        anchors.bottomMargin: 58
+        anchors.fill: parent
+
+        spacing: 72
+
+        RowLayout {
+            spacing: 96
+
+            ColumnLayout {
+                spacing: 16
+
+                CustomControls.Label {
+                    text: "Статус модулей"
+                }
+
+                RowLayout {
+                    spacing: 16
+
+                    CustomControls.IndicatorTextField {
+                        text: DataController.firstStatus
+                        horizontalAlignment: Text.AlignHCenter
+                        readOnly: true
+                        Layout.preferredWidth: 160
+                    }
+
+                    CustomControls.IndicatorTextField {
+                        text: DataController.secondStatus
+                        horizontalAlignment: Text.AlignHCenter
+                        readOnly: true
+                        Layout.preferredWidth: 160
+                    }
+
+                    CustomControls.IndicatorTextField {
+                        visible: DataController.firstStatus === "0x07" && DataController.secondStatus === "0x07"
+                        text: "Готов к работе"
+                        backgroundColor: "#C4FFCA"
+                        backgroundRadius: 16
+                        font.pixelSize: 24
+                        font.weight: Font.Normal
+                        leftPadding: 16
+                        rightPadding: 16
+                        readOnly: true
+                        Layout.preferredWidth: 200
+                    }
+                }
+
+                Item {
+                    Layout.fillHeight: true
+                }
+
+                Layout.fillHeight: true
+            }
+
+            Item {
+                Layout.fillWidth: true
+            }
+
+            CustomControls.DescriptionTextField {
+                // visible: modeSwitch.checkState === Qt.PartiallyChecked
+                descriptionText: "Вход ПСН"
+                indicatorText: "В"
+                text: DataController.psnInputVoltage
+                readonly: true
+                Layout.alignment: Qt.AlignTop
+                Layout.fillWidth: false
+                Layout.preferredWidth: 320
+            }
+
+            CustomControls.DescriptionTextField {
+                descriptionText: "Сеть"
+                indicatorText: "В"
+                text: DataController.mainVoltage
+                readonly: true
+                Layout.alignment: Qt.AlignTop
+                Layout.fillWidth: false
+                Layout.preferredWidth: 320
+            }
+
+            ColumnLayout {
+                spacing: 16
+
+                CustomControls.Label {
+                    id: dateLabel
+                    text: "Статус модулей"
+                    Layout.alignment: Qt.AlignCenter
+                }
+
+                CustomControls.IndicatorTextField {
+                    id: timeField
+                    readOnly: true
+                    Layout.alignment: Qt.AlignCenter
+                    Layout.preferredWidth: 220
+                }
+
+                Item {
+                    Layout.fillHeight: true
+                }
+
+                Timer {
+                    interval: 1000
+                    repeat: true
+                    running: true
+                    triggeredOnStart: true
+
+                    onTriggered: {
+                        let date =  new Date()
+                        dateLabel.text = Qt.formatDate(date, "dd.MM.yyyy")
+                        timeField.text = Qt.formatTime(date, "hh:mm:ss")
+                    }
+                }
+
+                Layout.fillHeight: true
+            }
+
+            Layout.fillHeight: false
+            Layout.fillWidth: true
+        }
+
+        CustomControls.TristateSwitch {
+            id: modeSwitch
+//            enabled: false // uncomment for non clickable
+            firstStateDescription: "АИН 1,2,3"
+            secondStateDescription: "АИН 4,5,6"
+            checkState: DataController.ainMode === 2 ? Qt.Unchecked : DataController.ainMode === 1 ? Qt.Checked : Qt.PartiallyChecked
+            Layout.fillHeight: false
+            Layout.fillWidth: true
+        }
+
+        RowLayout {
+            RowLayout {
+                spacing: 56
+                visible: modeSwitch.checkState === Qt.PartiallyChecked
+
+                CustomControls.GroupBox {
+                    title: "АИН 1"
+                    subTitle: (DataController.ainReservedMask & 0x1) != 0 ? "Резервирование" : ""
+
+                    ColumnLayout {
+                        anchors.fill: parent
+                        spacing: 32
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Напряжение"
+                            indicatorText: "B"
+                            text: DataController.ain1Voltage
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Ток"
+                            indicatorText: "А"
+                            text: DataController.ain1Current
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+                    }
+
+                    Layout.preferredWidth: (parent.width - 2 * parent.spacing) / 3
+                    Layout.fillWidth: true
+                    Layout.fillHeight: true
+                }
+
+                CustomControls.GroupBox {
+                    title: "АИН 2"
+                    subTitle: (DataController.ainReservedMask & 0x2) != 0 ? "Резервирование" : ""
+
+                    ColumnLayout {
+                        anchors.fill: parent
+                        spacing: 32
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Напряжение"
+                            indicatorText: "B"
+                            text: DataController.ain2Voltage
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Ток"
+                            indicatorText: "А"
+                            text: DataController.ain2Current
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+                    }
+
+                    Layout.preferredWidth: (parent.width - 2 * parent.spacing) / 3
+                    Layout.fillWidth: true
+                    Layout.fillHeight: true
+                }
+
+                CustomControls.GroupBox {
+                    title: "АИН 3"
+                    subTitle: (DataController.ainReservedMask & 0x4) != 0 ? "Резервирование" : ""
+
+                    ColumnLayout {
+                        anchors.fill: parent
+                        spacing: 32
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Напряжение"
+                            indicatorText: "B"
+                            text: DataController.ain3Voltage
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Ток"
+                            indicatorText: "А"
+                            text: DataController.ain3Current
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+                    }
+
+                    Layout.preferredWidth: (parent.width - 2 * parent.spacing) / 3
+                    Layout.fillWidth: true
+                    Layout.fillHeight: true
+                }
+
+                Layout.fillWidth: true
+                Layout.fillHeight: true
+            }
+
+            RowLayout {
+                spacing: 56
+                visible: modeSwitch.checkState === Qt.Checked
+
+                CustomControls.GroupBox {
+                    title: "АИН 4"
+                    subTitle: (DataController.ainReservedMask & 0x8) != 0 ? "Резервирование" : ""
+
+                    ColumnLayout {
+                        anchors.fill: parent
+                        spacing: 32
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Напряжение"
+                            indicatorText: "B"
+                            text: DataController.ain4Voltage
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Ток"
+                            indicatorText: "А"
+                            text: DataController.ain4Current
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+                    }
+
+                    Layout.preferredWidth: (parent.width - 2 * parent.spacing) / 3
+                    Layout.fillWidth: true
+                    Layout.fillHeight: true
+                }
+
+                CustomControls.GroupBox {
+                    title: "АИН 5"
+                    subTitle: (DataController.ainReservedMask & 0x10) != 0 ? "Резервирование" : ""
+
+                    ColumnLayout {
+                        anchors.fill: parent
+                        spacing: 32
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Напряжение"
+                            indicatorText: "B"
+                            text: DataController.ain5Voltage
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Ток"
+                            indicatorText: "А"
+                            text: DataController.ain5Current
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+                    }
+
+                    Layout.preferredWidth: (parent.width - 2 * parent.spacing) / 3
+                    Layout.fillWidth: true
+                    Layout.fillHeight: true
+                }
+
+                CustomControls.GroupBox {
+                    title: "АИН 6"
+                    subTitle: (DataController.ainReservedMask & 0x20) != 0 ? "Резервирование" : ""
+
+                    ColumnLayout {
+                        anchors.fill: parent
+                        spacing: 32
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Напряжение"
+                            indicatorText: "B"
+                            text: DataController.ain6Voltage
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+
+                        CustomControls.DescriptionTextField {
+                            descriptionText: "Ток"
+                            indicatorText: "А"
+                            text: DataController.ain6Current
+                            readonly: true
+                            Layout.fillWidth: true
+                        }
+                    }
+
+                    Layout.preferredWidth: (parent.width - 2 * parent.spacing) / 3
+                    Layout.fillWidth: true
+                    Layout.fillHeight: true
+                }
+
+                Layout.fillWidth: true
+                Layout.fillHeight: true
+            }
+
+            Item {
+                visible: modeSwitch.checkState === Qt.Unchecked
+                Layout.fillWidth: true
+                Layout.fillHeight: true
+            }
+
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+        }
+    }
+
+    MouseArea {
+        visible: Qt.platform.os === "linux"
+        anchors.fill: parent
+        enabled: false
+        cursorShape: Qt.BlankCursor
+    }
+
+    background: Rectangle {
+        color: Palette.backgroundColor
+    }
+}

qml/qml.qrc

@@ -0,0 +1,15 @@
+<RCC>
+    <qresource prefix="/">
+        <file>main.qml</file>
+        <file>Controls/TextField.qml</file>
+        <file>Controls/qmldir</file>
+        <file>Palette/Palette.qml</file>
+        <file>Palette/qmldir</file>
+        <file>Controls/GroupBox.qml</file>
+        <file>Controls/Label.qml</file>
+        <file>Controls/IndicatorTextField.qml</file>
+        <file>Controls/Switch.qml</file>
+        <file>Controls/DescriptionTextField.qml</file>
+        <file>Controls/TristateSwitch.qml</file>
+    </qresource>
+</RCC>