added display of vpn containers and services on the settings page

- added PageSettingsData and implementation of 'remove all containers'  button
This commit is contained in:
vladimir.kuznetsov 2023-05-27 22:46:41 +08:00
parent e00656d757
commit 1e180489a4
19 changed files with 393 additions and 102 deletions

View file

@ -37,12 +37,11 @@ Drawer {
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: 16
anchors.leftMargin: 16
Header2TextType {
Layout.fillWidth: true
Layout.topMargin: 24
Layout.rightMargin: 16
Layout.leftMargin: 16
Layout.alignment: Qt.AlignHCenter
text: "Данные для подключения"
@ -52,7 +51,7 @@ Drawer {
LabelWithButtonType {
id: ip
Layout.fillWidth: true
Layout.topMargin: 32
Layout.topMargin: 16
text: "IP, логин и пароль от сервера"
buttonImage: "qrc:/images/controls/chevron-right.svg"
@ -62,11 +61,9 @@ Drawer {
root.visible = false
}
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
DividerType {}
LabelWithButtonType {
Layout.fillWidth: true
@ -78,10 +75,7 @@ Drawer {
root.visible = false
}
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
DividerType {}
}
}

View file

@ -116,4 +116,3 @@ ListView {
}
}
}

View file

@ -0,0 +1,107 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import SortFilterProxyModel 0.2
import PageEnum 1.0
import ProtocolEnum 1.0
import "../Controls2"
import "../Controls2/TextTypes"
ListView {
id: root
height: root.contentItem.height
clip: true
ButtonGroup {
id: containersRadioButtonGroup
}
delegate: Item {
implicitWidth: parent.width
implicitHeight: containerRadioButton.implicitHeight
RadioButton {
id: containerRadioButton
implicitWidth: parent.width
implicitHeight: containerRadioButtonContent.implicitHeight
hoverEnabled: true
ButtonGroup.group: containersRadioButtonGroup
checked: isDefault
indicator: Rectangle {
anchors.fill: parent
color: containerRadioButton.hovered ? Qt.rgba(1, 1, 1, 0.08) : "transparent"
Behavior on color {
PropertyAnimation { duration: 200 }
}
}
checkable: isInstalled
RowLayout {
id: containerRadioButtonContent
anchors.fill: parent
anchors.rightMargin: 16
anchors.leftMargin: 16
z: 1
ColumnLayout {
Layout.topMargin: 20
Layout.bottomMargin: 20
ListItemTitleType {
Layout.fillWidth: true
text: name
}
CaptionTextType {
Layout.fillWidth: true
text: description
color: "#878B91"
}
}
Image {
source: isInstalled ? "qrc:/images/controls/chevron-right.svg" : "qrc:/images/controls/download.svg"
width: 24
height: 24
Layout.rightMargin: 8
}
}
onClicked: {
if (isInstalled) {
// isDefault = true
// root.currentIndex = index
} else {
ContainersModel.setCurrentlyInstalledContainerIndex(root.model.mapToSource(index))
InstallController.setShouldCreateServer(false)
goToPage(PageEnum.PageSetupWizardProtocolSettings)
}
}
MouseArea {
anchors.fill: containerRadioButton
cursorShape: Qt.PointingHandCursor
enabled: false
}
}
}
}

View file

@ -0,0 +1,8 @@
import QtQuick
import QtQuick.Layouts
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}

View file

@ -2,6 +2,8 @@ import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import "TextTypes"
Item {
id: root
@ -13,12 +15,16 @@ Item {
property alias buttonImage: button.image
property string iconImage
property string textColor: "#d7d8db"
implicitWidth: content.implicitWidth
implicitHeight: content.implicitHeight
RowLayout {
id: content
anchors.fill: parent
anchors.leftMargin: 16
anchors.rightMargin: 16
Image {
id: icon
@ -28,34 +34,28 @@ Item {
}
ColumnLayout {
Text {
font.family: "PT Root UI VF"
font.styleName: "normal"
font.pixelSize: 18
color: "#d7d8db"
ListItemTitleType {
text: root.text
wrapMode: Text.WordWrap
color: textColor
Layout.fillWidth: true
height: 22
Layout.topMargin: 16
Layout.bottomMargin: description.visible ? 0 : 16
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter
}
Text {
font.family: "PT Root UI VF"
font.styleName: "normal"
font.pixelSize: 13
font.letterSpacing: 0.02
CaptionTextType {
id: description
color: "#878B91"
text: root.descriptionText
wrapMode: Text.WordWrap
visible: root.descriptionText !== ""
Layout.fillWidth: true
height: 16
Layout.bottomMargin: 16
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter
@ -88,21 +88,45 @@ Item {
}
}
}
Rectangle {
id: background
anchors.fill: root
color: "transparent"
Behavior on color {
PropertyAnimation { duration: 200 }
}
}
MouseArea {
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
hoverEnabled: true
onEntered: {
imageBackground.color = button.hoveredColor
if (buttonImage) {
imageBackground.color = button.hoveredColor
} else {
background.color = button.hoveredColor
}
}
onExited: {
imageBackground.color = button.defaultColor
if (buttonImage) {
imageBackground.color = button.defaultColor
} else {
background.color = button.defaultColor
}
}
onPressedChanged: {
imageBackground.color = pressed ? button.pressedColor : entered ? button.hoveredColor : button.defaultColor
if (buttonImage) {
imageBackground.color = pressed ? button.pressedColor : entered ? button.hoveredColor : button.defaultColor
} else {
background.color = pressed ? button.pressedColor : entered ? button.hoveredColor : button.defaultColor
}
}
onClicked: {

View file

@ -0,0 +1,12 @@
import QtQuick
Text {
height: 21.6
color: "#D7D8DB"
font.pixelSize: 18
font.weight: Font.Normal
font.family: "PT Root UI VF"
wrapMode: Text.WordWrap
}

View file

@ -37,21 +37,6 @@ PageType {
}
}
Connections {
target: InstallController
function onInstallContainerFinished() {
goToStartPage()
menu.visible = true
containersDropDown.menuVisible = true
}
function onInstallServerFinished() {
goToStartPage()
menu.visible = true
}
}
Rectangle {
id: buttonBackground
anchors.fill: buttonContent
@ -166,6 +151,10 @@ PageType {
ValueFilter {
roleName: "serviceType"
value: ProtocolEnum.Vpn
},
ValueFilter {
roleName: "isSupported"
value: true
}
]
}

View file

@ -5,6 +5,7 @@ import QtQuick.Layouts
import SortFilterProxyModel 0.2
import PageEnum 1.0
import ProtocolEnum 1.0
import ContainerProps 1.0
import ProtocolProps 1.0
@ -12,6 +13,7 @@ import "./"
import "../Controls2"
import "../Controls2/TextTypes"
import "../Config"
import "../Components"
PageType {
id: root
@ -27,35 +29,28 @@ PageType {
]
}
FlickableType {
id: fl
anchors.fill: parent
contentHeight: content.height
ColumnLayout {
id: content
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.fill: parent
spacing: 16
Repeater {
id: header
model: proxyServersModel
delegate: HeaderType {
id: header
Layout.fillWidth: true
Layout.topMargin: 20
Layout.leftMargin: 16
Layout.rightMargin: 16
actionButtonImage: "qrc:/images/controls/plus.svg"
actionButtonImage: "qrc:/images/controls/edit-3.svg"
backButtonImage: "qrc:/images/controls/arrow-left.svg"
headerText: name
descriptionText: hostName
actionButtonFunction: function() {
connectionTypeSelection.visible = true
@ -66,6 +61,82 @@ PageType {
}
}
}
TabBar {
id: tabBar
Layout.fillWidth: true
background: Rectangle {
color: "transparent"
}
TabButtonType {
isSelected: tabBar.currentIndex === 0
text: qsTr("Protocols")
}
TabButtonType {
isSelected: tabBar.currentIndex === 1
text: qsTr("Services")
}
TabButtonType {
isSelected: tabBar.currentIndex === 2
text: qsTr("Data")
}
}
StackLayout {
id: stackLayout
currentIndex: tabBar.currentIndex
Layout.fillWidth: true
height: root.height
StackView {
id: protocolsStackView
initialItem: PageSettingsContainersListView {
model: SortFilterProxyModel {
sourceModel: ContainersModel
filters: [
ValueFilter {
roleName: "serviceType"
value: ProtocolEnum.Vpn
},
ValueFilter {
roleName: "isSupported"
value: true
}
]
}
}
}
StackView {
id: servicesStackView
initialItem: PageSettingsContainersListView {
model: SortFilterProxyModel {
sourceModel: ContainersModel
filters: [
ValueFilter {
roleName: "serviceType"
value: ProtocolEnum.Other
},
ValueFilter {
roleName: "isSupported"
value: true
}
]
}
}
}
StackView {
id: dataStackView
initialItem: PageSettingsData {
}
}
}
}
}
// }
}

View file

@ -0,0 +1,67 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import SortFilterProxyModel 0.2
import PageEnum 1.0
import ProtocolEnum 1.0
import "../Controls2"
import "../Controls2/TextTypes"
PageType {
id: root
FlickableType {
id: fl
anchors.top: root.top
anchors.bottom: root.bottom
contentHeight: content.height
ColumnLayout {
id: content
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
LabelWithButtonType {
Layout.fillWidth: true
text: "Clear Amnezia cache"
descriptionText: "May be needed when changing other settings"
clickedFunction: function() {
}
}
DividerType {}
LabelWithButtonType {
Layout.fillWidth: true
text: "Remove server from application"
textColor: "#EB5757"
clickedFunction: function() {
}
}
DividerType {}
LabelWithButtonType {
Layout.fillWidth: true
text: "Clear server from Amnezia software"
textColor: "#EB5757"
clickedFunction: function() {
ContainersModel.removeAllContainers()
}
}
DividerType {}
}
}
}

View file

@ -57,11 +57,6 @@ PageType {
anchors.left: parent.left
anchors.right: parent.right
anchors.leftMargin: 16
anchors.rightMargin: 16
spacing: 16
ListView {
id: servers
width: parent.width
@ -85,8 +80,6 @@ PageType {
LabelWithButtonType {
id: server
Layout.fillWidth: true
Layout.topMargin: 16
Layout.bottomMargin: 16
text: name
descriptionText: hostName
@ -98,11 +91,7 @@ PageType {
}
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
DividerType {}
}
}
}

View file

@ -33,14 +33,12 @@ PageType {
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
Layout.rightMargin: 16
Layout.leftMargin: 16
backButtonImage: "qrc:/images/controls/arrow-left.svg"
@ -52,6 +50,8 @@ PageType {
Header2TextType {
Layout.fillWidth: true
Layout.topMargin: 32
Layout.rightMargin: 16
Layout.leftMargin: 16
text: "Что у вас есть?"
}
@ -75,11 +75,8 @@ PageType {
}
}
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
DividerType {}
//todo ifdef mobile platforms
LabelWithButtonType {
@ -93,11 +90,7 @@ PageType {
}
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
DividerType {}
LabelWithButtonType {
Layout.fillWidth: true
@ -111,11 +104,7 @@ PageType {
}
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
DividerType {}
}
}
}

View file

@ -23,6 +23,14 @@ PageType {
closePage()
PageController.showErrorMessage(errorMessage)
}
function onInstallContainerFinished() {
goToStartPage()
}
function onInstallServerFinished() {
goToStartPage()
}
}
SortFilterProxyModel {

View file

@ -75,12 +75,12 @@ PageType {
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: -16
anchors.leftMargin: -16
LabelWithButtonType {
id: container
Layout.fillWidth: true
Layout.topMargin: 16
Layout.bottomMargin: 16
text: name
descriptionText: description
@ -92,11 +92,7 @@ PageType {
}
}
Rectangle {
Layout.fillWidth: true
height: 1
color: "#2C2D30"
}
DividerType {}
}
}
}

View file

@ -26,8 +26,9 @@ PageType {
target: InstallController
function onInstallServerFinished() {
//todo add smt like changeStartPage
goToStartPage()
// goToPage(PageEnum.PageStart)
goToPage(PageEnum.PageStart)
}
}

View file

@ -38,8 +38,9 @@ PageType {
height: root.height - tabBar.implicitHeight
StackView {
id: homeStackView
initialItem: "PageHome.qml" //PageController.getPagePath(PageEnum.PageSettingsServersList)
initialItem: PageHome {
id: pageHome
}
}
Item {
@ -47,8 +48,9 @@ PageType {
}
StackView {
id: settingsStackView
initialItem: "PageSettingsServersList.qml" //PageController.getPagePath(PageEnum.PageSettingsServersList)
initialItem: PageSettingsServersList {
id: pageSettingsServersList
}
}
}
@ -72,6 +74,9 @@ PageType {
TabImageButtonType {
isSelected: tabBar.currentIndex === 0
image: "qrc:/images/controls/home.svg"
onClicked: {
pageSettingsServersList.goToStartPage()
}
}
TabImageButtonType {
isSelected: tabBar.currentIndex === 1
@ -80,6 +85,9 @@ PageType {
TabImageButtonType {
isSelected: tabBar.currentIndex === 2
image: "qrc:/images/controls/settings-2.svg"
onClicked: {
pageHome.goToStartPage()
}
}
}