added installController with logic for server/container installation

This commit is contained in:
vladimir.kuznetsov 2023-05-17 23:28:27 +08:00
parent 03a0e2084a
commit acca85b99a
19 changed files with 519 additions and 151 deletions

View file

@ -65,6 +65,8 @@ Button {
}
case ConnectionState.Preparing: {
console.log("Preparing")
connectionProccess.running = true
root.text = "Подключение..."
break
}
case ConnectionState.Connecting: {

View file

@ -8,40 +8,38 @@ Item {
id: root
property string text
property string textColor: "#d7d8db"
property string descriptionText
property string headerText
property string headerBackButtonImage
property var onClickedFunc
property string buttonImage: "qrc:/images/controls/chevron-down.svg"
property string buttonImageColor: "#494B50"
property var onRootButtonClicked
property string rootButtonImage: "qrc:/images/controls/chevron-down.svg"
property string rootButtonImageColor: "#494B50"
property string rootButtonDefaultColor: "#1C1D21"
property int rootButtonMaximumWidth
property int buttonMaximumWidth
property string defaultColor: "#1C1D21"
property string textColor: "#d7d8db"
property string borderColor: "#494B50"
property int borderWidth: 1
property string rootButtonBorderColor: "#494B50"
property int rootButtonBorderWidth: 1
property Component menuDelegate
property variant menuModel
property alias menuVisible: menu.visible
implicitWidth: buttonContent.implicitWidth
implicitHeight: buttonContent.implicitHeight
implicitWidth: rootButtonContent.implicitWidth
implicitHeight: rootButtonContent.implicitHeight
Rectangle {
id: buttonBackground
anchors.fill: buttonContent
id: rootButtonBackground
anchors.fill: rootButtonContent
radius: 16
color: defaultColor
border.color: borderColor
border.width: borderWidth
color: rootButtonDefaultColor
border.color: rootButtonBorderColor
border.width: rootButtonBorderWidth
Behavior on border.width {
PropertyAnimation { duration: 200 }
@ -49,7 +47,7 @@ Item {
}
RowLayout {
id: buttonContent
id: rootButtonContent
anchors.fill: parent
spacing: 0
@ -71,7 +69,7 @@ Item {
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
Layout.maximumWidth: buttonMaximumWidth ? buttonMaximumWidth : implicitWidth
Layout.maximumWidth: rootButtonMaximumWidth ? rootButtonMaximumWidth : implicitWidth
color: root.textColor
text: root.text
@ -81,38 +79,36 @@ Item {
}
}
//todo change to image type
ImageButtonType {
id: button
Layout.leftMargin: 4
Layout.rightMargin: 16
hoverEnabled: false
image: buttonImage
imageColor: buttonImageColor
onClicked: {
if (onClickedFunc && typeof onClickedFunc === "function") {
onClickedFunc()
}
}
image: rootButtonImage
imageColor: rootButtonImageColor
}
}
MouseArea {
anchors.fill: buttonContent
anchors.fill: rootButtonContent
cursorShape: Qt.PointingHandCursor
hoverEnabled: true
onEntered: {
buttonBackground.border.width = borderWidth
rootButtonBackground.border.width = rootButtonBorderWidth
}
onExited: {
buttonBackground.border.width = 0
rootButtonBackground.border.width = 0
}
onClicked: {
menu.visible = true
if (onRootButtonClicked && typeof onRootButtonClicked === "function") {
onRootButtonClicked()
} else {
menu.visible = true
}
}
}
@ -132,7 +128,7 @@ Item {
radius: 16
color: "#1C1D21"
border.color: borderColor
border.color: "#494B50"
border.width: 1
}

View file

@ -59,8 +59,8 @@ Item {
visible: image ? true : false
onClicked: {
if (actionButtonImage && typeof actionButtonImage === "function") {
actionButtonImage()
if (actionButtonFunction && typeof actionButtonFunction === "function") {
actionButtonFunction()
}
}
}

View file

@ -0,0 +1,19 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
ProgressBar {
id: root
implicitHeight: 4
background: Rectangle {
color: "#412102"
}
contentItem: Rectangle {
width: root.visualPosition * root.width
height: root.height
color: "#FBB26A"
}
}

View file

@ -20,8 +20,10 @@ Item {
property string borderColor: "#2C2D30"
property string currentServerName: serversMenuContent.currentItem.delegateData.desc
property string currentServerDescription: serversMenuContent.currentItem.delegateData.address
property string currentServerName: serversMenuContent.currentItem.delegateData.name
property string currentServerHostName: serversMenuContent.currentItem.delegateData.hostName
property string currentContainerName
ConnectButton {
anchors.centerIn: parent
@ -72,7 +74,7 @@ Item {
Layout.bottomMargin: 44
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
text: currentServerDescription
text: currentContainerName + " | " + currentServerHostName
}
}
@ -127,7 +129,7 @@ Item {
Layout.bottomMargin: 24
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
text: currentServerDescription
text: currentServerHostName
}
RowLayout {
@ -150,16 +152,21 @@ Item {
implicitHeight: 40
borderWidth: 0
buttonImageColor: "#0E0E11"
buttonMaximumWidth: 150 //todo make it dynamic
defaultColor: "#D7D8DB"
rootButtonBorderWidth: 0
rootButtonImageColor: "#0E0E11"
rootButtonMaximumWidth: 150 //todo make it dynamic
rootButtonDefaultColor: "#D7D8DB"
textColor: "#0E0E11"
headerText: "Протокол подключения"
headerBackButtonImage: "qrc:/images/controls/arrow-left.svg"
onRootButtonClicked: function() {
ServersModel.setCurrentlyProcessedServerIndex(serversMenuContent.currentIndex)
ContainersModel.setCurrentlyProcessedServerIndex(serversMenuContent.currentIndex)
containersDropDown.menuVisible = true
}
menuModel: proxyContainersModel
ButtonGroup {
@ -265,9 +272,11 @@ Item {
modelData.isDefault = true
containersDropDown.text = containerRadioButtonText.text
root.currentContainerName = containerRadioButtonText.text
containersDropDown.menuVisible = false
} else {
ContainersModel.setCurrentlyInstalledContainerIndex(proxyContainersModel.mapToSource(delegateIndex))
InstallController.setShouldCreateServer(false)
PageController.goToPage(PageEnum.PageSetupWizardProtocolSettings)
containersDropDown.menuVisible = false
menu.visible = false
@ -307,6 +316,10 @@ Item {
actionButtonImage: "qrc:/images/controls/plus.svg"
headerText: "Серверы"
actionButtonFunction: function() {
PageController.goToPage(PageEnum.PageSetupWizardStart)
}
}
}
@ -378,7 +391,7 @@ Item {
Text {
id: serverRadioButtonText
text: desc
text: name
color: "#D7D8DB"
font.pixelSize: 16
font.weight: 400
@ -402,11 +415,11 @@ Item {
}
onClicked: {
root.currentServerName = desc
root.currentServerDescription = address
serversMenuContent.currentIndex = index
root.currentServerName = name
root.currentServerHostName = hostName
ServersModel.setDefaultServerIndex(index)
ContainersModel.setSelectedServerIndex(index)
}
MouseArea {

View file

@ -38,18 +38,25 @@ Item {
}
TextFieldWithHeaderType {
id: hostname
Layout.fillWidth: true
headerText: "Server IP adress [:port]"
}
TextFieldWithHeaderType {
id: username
Layout.fillWidth: true
headerText: "Login to connect via SSH"
}
TextFieldWithHeaderType {
id: secretData
Layout.fillWidth: true
headerText: "Password / Private key"
textField.echoMode: TextInput.Password
}
BasicButtonType {
@ -77,6 +84,9 @@ Item {
text: qsTr("Выбрать протокол для установки")
onClicked: function() {
InstallController.setShouldCreateServer(true)
InstallController.setCurrentlyInstalledServerCredentials(hostname.textField.text, username.textField.text, secretData.textField.text)
PageController.goToPage(PageEnum.PageSetupWizardProtocols)
}
}

View file

@ -2,6 +2,8 @@ import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import SortFilterProxyModel 0.2
import PageEnum 1.0
import "./"
@ -12,32 +14,111 @@ import "../Config"
Item {
id: root
property real progressBarValue: 0
SortFilterProxyModel {
id: proxyContainersModel
sourceModel: ContainersModel
filters: [
ValueFilter {
roleName: "isCurrentlyInstalled"
value: true
}
]
}
FlickableType {
id: fl
anchors.top: root.top
anchors.bottom: root.bottom
anchors.fill: parent
contentHeight: content.height
ColumnLayout {
Column {
id: content
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 16
anchors.leftMargin: 16
spacing: 16
HeaderType {
Layout.fillWidth: true
Layout.topMargin: 20
ListView {
// todo change id naming
id: container
width: parent.width
height: container.contentItem.height
currentIndex: -1
clip: true
interactive: false
model: proxyContainersModel
//TODO remove later
backButtonImage: "qrc:/images/controls/arrow-left.svg"
delegate: Item {
implicitWidth: container.width
implicitHeight: delegateContent.implicitHeight
headerText: "Установка"
descriptionText: ContainersModel.getCurrentlyInstalledContainerName()
ColumnLayout {
id: delegateContent
anchors.fill: parent
anchors.rightMargin: 16
anchors.leftMargin: 16
HeaderType {
Layout.fillWidth: true
Layout.topMargin: 20
headerText: "Установка"
descriptionText: name
}
ProgressBarType {
id: progressBar
Layout.fillWidth: true
Layout.topMargin: 32
value: progressBarValue
Timer {
id: timer
interval: 300
repeat: true
running: true
onTriggered: {
progressBarValue += 0.001
}
}
}
ParagraphTextType {
Layout.fillWidth: true
Layout.topMargin: 8
text: "Обычно это занимает не больше 5 минут"
}
}
}
}
}
Timer {
id: closePageTimer
interval: 1000
repeat: false
running: false
onTriggered: {
// todo go to root installing page
PageController.goToPage(PageEnum.PageHome)
}
}
Connections {
target: InstallController
function onInstallContainerFinished() {
progressBarValue = 1
closePageTimer.start()
}
}
}

View file

@ -2,7 +2,11 @@ import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import SortFilterProxyModel 0.2
import PageEnum 1.0
import ContainerProps 1.0
import ProtocolProps 1.0
import "./"
import "../Controls2"
@ -12,83 +16,169 @@ import "../Config"
Item {
id: root
SortFilterProxyModel {
id: proxyContainersModel
sourceModel: ContainersModel
filters: [
ValueFilter {
roleName: "isCurrentlyInstalled"
value: true
}
]
}
FlickableType {
id: fl
anchors.top: root.top
anchors.bottom: root.bottom
anchors.fill: parent
contentHeight: content.height
ColumnLayout {
Column {
id: content
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 16
anchors.leftMargin: 16
spacing: 16
HeaderType {
Layout.fillWidth: true
Layout.topMargin: 20
ListView {
// todo change id naming
id: containers
width: parent.width
height: containers.contentItem.height
currentIndex: -1
clip: true
interactive: false
model: proxyContainersModel
backButtonImage: "qrc:/images/controls/arrow-left.svg"
delegate: Item {
implicitWidth: containers.width
implicitHeight: delegateContent.implicitHeight
headerText: "Установка " + ContainersModel.getCurrentlyInstalledContainerName()
descriptionText: "Эти настройки можно будет изменить позже"
}
ColumnLayout {
id: delegateContent
ParagraphTextType {
Layout.topMargin: 16
anchors.fill: parent
anchors.rightMargin: 16
anchors.leftMargin: 16
text: "Network protocol"
}
HeaderType {
id: header
//TODO move to separete control
Rectangle {
implicitWidth: buttonGroup.implicitWidth
implicitHeight: buttonGroup.implicitHeight
Layout.fillWidth: true
Layout.topMargin: 20
color: "#1C1D21"
radius: 16
backButtonImage: "qrc:/images/controls/arrow-left.svg"
RowLayout {
id: buttonGroup
headerText: "Установка " + name
descriptionText: "Эти настройки можно будет изменить позже"
}
spacing: 0
ParagraphTextType {
id: transportProtoHeader
HorizontalRadioButton {
implicitWidth: (root.width - 32) / 2
text: "UDP"
}
Layout.topMargin: 16
HorizontalRadioButton {
implicitWidth: (root.width - 32) / 2
text: "TCP"
text: "Network protocol"
}
Rectangle {
id: transportProtoBackground
implicitWidth: transportProtoButtonGroup.implicitWidth
implicitHeight: transportProtoButtonGroup.implicitHeight
color: "#1C1D21"
radius: 16
RowLayout {
id: transportProtoButtonGroup
property int currentIndex
spacing: 0
HorizontalRadioButton {
checked: transportProtoButtonGroup.currentIndex === 0
implicitWidth: (root.width - 32) / 2
text: "UDP"
hoverEnabled: !transportProtoButtonMouseArea.enabled
onClicked: {
transportProtoButtonGroup.currentIndex = 0
}
}
HorizontalRadioButton {
checked: transportProtoButtonGroup.currentIndex === 1
implicitWidth: (root.width - 32) / 2
text: "TCP"
hoverEnabled: !transportProtoButtonMouseArea.enabled
onClicked: {
transportProtoButtonGroup.currentIndex = 1
}
}
}
MouseArea {
id: transportProtoButtonMouseArea
anchors.fill: parent
}
}
TextFieldWithHeaderType {
id: port
Layout.fillWidth: true
headerText: "Port"
}
Rectangle {
// todo make it dynamic
implicitHeight: root.height - port.implicitHeight -
transportProtoBackground.implicitHeight - transportProtoHeader.implicitHeight -
header.implicitHeight - installButton.implicitHeight - 100
color: "transparent"
}
BasicButtonType {
id: installButton
Layout.fillWidth: true
Layout.bottomMargin: 32
text: qsTr("Установить")
onClicked: function() {
PageController.goToPage(PageEnum.PageSetupWizardInstalling);
InstallController.install(dockerContainer, port.textFieldText, transportProtoButtonGroup.currentIndex)
}
}
Component.onCompleted: {
//todo move to protocols model?
var defaultContainerProto = ContainerProps.defaultProtocol(dockerContainer)
if (ProtocolProps.defaultPort(defaultContainerProto) < 0) {
port.visible = false
} else {
port.textFieldText = ProtocolProps.defaultPort(defaultContainerProto)
}
transportProtoButtonGroup.currentIndex = ProtocolProps.defaultTransportProto(defaultContainerProto)
port.enabled = ProtocolProps.defaultPortChangeable(defaultContainerProto)
transportProtoButtonMouseArea.enabled = !ProtocolProps.defaultTransportProtoChangeable(defaultContainerProto)
}
}
}
}
TextFieldWithHeaderType {
Layout.fillWidth: true
headerText: "Port"
}
}
}
BasicButtonType {
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 16
anchors.leftMargin: 16
anchors.bottomMargin: 32
text: qsTr("Установить")
onClicked: function() {
PageController.goToPage(PageEnum.PageSetupWizardInstalling)
}
}
}

View file

@ -18,10 +18,6 @@ Item {
id: proxyContainersModel
sourceModel: ContainersModel
filters: [
ValueFilter {
roleName: "is_installed_role"
value: false
},
ValueFilter {
roleName: "service_type_role"
value: ProtocolEnum.Vpn

View file

@ -96,7 +96,7 @@ Item {
radius: 16
color: "#1C1D21"
border.color: borderColor
border.color: "#2C2D30"
border.width: 1
}