Skip to content
Snippets Groups Projects
Commit 16f2e0ec authored by aleksandr.ledyaev's avatar aleksandr.ledyaev
Browse files

add my VPN orders grid

[*] DapCreateVPNOrderPanel.qml; DapVPNServiceTab.qml;
DapVPNServiceTopPanel.qml
[+] ic_info_order.svg; DapVPNOrderInfoLine.qml; DapVPNOrdersGridView.qml
parent a8ef1de1
No related branches found
No related tags found
1 merge request!11Cellframe clone
......@@ -201,5 +201,8 @@
<file>screen/desktop/VPNService/DapRightPanelElement.qml</file>
<file>screen/desktop/VPNService/DapSpinBox.qml</file>
<file>screen/desktop/VPNService/DapDoubleSpinBox.qml</file>
<file>screen/desktop/VPNService/DapVPNOrdersGridView.qml</file>
<file>resources/icons/ic_info_order.svg</file>
<file>screen/desktop/VPNService/DapVPNOrderInfoLine.qml</file>
</qresource>
</RCC>
<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30"><g transform="translate(-7)"><rect width="30" height="30" transform="translate(7)" fill="none"/><path d="M13,5a8,8,0,1,0,8,8,8,8,0,0,0-8-8Zm0,14.578A6.578,6.578,0,1,1,19.578,13,6.578,6.578,0,0,1,13,19.578ZM12.111,8.556A.889.889,0,1,1,13,9.444.889.889,0,0,1,12.111,8.556Zm2.844,8.065v.468a.356.356,0,0,1-.356.356H11.4a.356.356,0,0,1-.356-.356V16.62a.356.356,0,0,1,.248-.339l.732-.232a.124.124,0,0,0,.086-.118V12.289h-.559A.508.508,0,0,1,11.4,11.3l2.026-.64a.356.356,0,0,1,.463.339v4.935a.124.124,0,0,0,.086.118l.732.232a.356.356,0,0,1,.248.339Z" transform="translate(9 2)" fill="#fff"/></g></svg>
\ No newline at end of file
......@@ -5,6 +5,8 @@ import "qrc:/widgets"
Item {
id: control
signal orderCreated
Column {
DapRightPanelElement {
......@@ -146,6 +148,7 @@ Item {
model: ListModel {
ListElement { unit: qsTr("hours") }
ListElement { unit: qsTr("days") }
ListElement { unit: qsTr("seconds") }
}
}
}
......@@ -238,6 +241,17 @@ Item {
onClicked: {
console.log("CRATE ORDER CLICKED. name: " + textName.text + "; region: " + comboBoxRegion.currentText + "; Units: "
+ comboBoxUnit.currentText + " " + spinBoxUnit.value + "; Price: " + comboBoxPrice.currentText + " " + spinBoxPrice.value);
vpnTest.ordersModel.append({
name: textName.text,
dateCreated: (new Date()).toLocaleDateString(Qt.locale(), Locale.LongFormat),
units: spinBoxUnit.value,
unitsType: comboBoxUnit.currentText,
value: spinBoxPrice.value,
token: comboBoxPrice.currentText
});
control.orderCreated();
}
}
......
import QtQuick 2.7
Item {
id: control
property alias name: textName.text
property alias value: textValue.text
implicitWidth: textName.implicitWidth + textValue.implicitWidth
implicitHeight: Math.max(textName.implicitHeight, textValue.implicitHeight)
Text {
id: textName
anchors.left: parent.left
anchors.right: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
height: Math.max(implicitHeight, parent.height)
font: quicksandFonts.medium12
elide: Text.ElideRight
color: "#211A3A"
text: qsTr("text")
}
Text {
id: textValue
anchors.left: parent.horizontalCenter
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
height: Math.max(implicitHeight, parent.height)
font: quicksandFonts.medium12
elide: Text.ElideRight
horizontalAlignment: Qt.AlignRight
color: "#757184"
text: qsTr("text")
}
}
import QtQuick 2.7
GridView {
id: control
property int delegateMargin
property int delegateWidth: 326 * pt
property int delegateHeight: 190 * pt
property int delegateContentMargin: 16 * pt
model: vpnTest.ordersModel
cellWidth: delegateMargin * 2 + delegateWidth
cellHeight: delegateMargin * 2 + delegateHeight
clip: true
currentIndex: -1
delegate: Item {
id: cell
width: control.cellWidth
height: control.cellHeight
Rectangle {
id: contentFrame
x: control.delegateMargin
y: control.delegateMargin
width: parent.width - x * 2
height: parent.height - y * 2
color: "#00000000"
border.width: pt
border.color: "#E2E1E6"
radius: 8 * pt
Rectangle {
id: headerFrame
width: parent.width
height: 30 * pt
color: control.currentIndex == index ? "#D51F5D" : "#3E3853"
radius: 8 * pt
Rectangle {
y: parent.height - height
width: parent.width
height: 8 * pt
color: parent.color
}
Text {
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.leftMargin: control.delegateContentMargin
anchors.right: orderIcon.right
font: quicksandFonts.medium12
elide: Text.ElideRight
color: "#FFFFFF"
text: model.name
}
Image {
id: orderIcon
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: (control.delegateContentMargin / 2) * pt // / 2 - ic_info_order.svg have space right
sourceSize: Qt.size(parent.height, parent.height)
source: "qrc:/resources/icons/ic_info_order.svg"
}
}
Item {
id: infoFrame
anchors { left: parent.left; top: headerFrame.bottom; right: parent.right; bottom: parent.bottom }
anchors.margins: control.delegateContentMargin
Column {
spacing: 12 * pt
DapVPNOrderInfoLine {
width: infoFrame.width
name: qsTr("Date created")
value: model.dateCreated
}
DapVPNOrderInfoLine {
width: infoFrame.width
name: qsTr("Units")
value: model.units
}
DapVPNOrderInfoLine {
width: infoFrame.width
name: qsTr("Units type")
value: model.unitsType
}
DapVPNOrderInfoLine {
width: infoFrame.width
name: qsTr("Value")
value: model.value
}
DapVPNOrderInfoLine {
width: infoFrame.width
name: qsTr("Token")
value: model.token
}
}
}
MouseArea {
anchors.fill: parent
onClicked: {
cell.forceActiveFocus();
control.currentIndex = index;
}
}
}
}
}
......@@ -5,14 +5,43 @@ import ".."
Item {
id: tab
// TODO только для теста
Item {
id: test
id: vpnTest
property alias ordersModel: ordersModel
Component.onCompleted: {
for (var i = 0; i < 10; ++ i) {
ordersModel.append({
name: "order " + i,
dateCreated: "April 22, 2020",
units: 3600,
unitsType: "seconds",
value: 0.1,
token: "KELT"
});
}
}
ListModel {
id: ordersModel
onCountChanged: console.log("VPN TEST ORDERS COUNT CHANGED: " + count);
/*ListElement {
name: ""
dateCreated: "April 22, 2020"
units: 3600
unitsType: "seconds"
value: 0.1
token: "KELT"
}*/
}
}
// TODO как узнать?
property bool ordersExists: false
property bool ordersExists: vpnTest.ordersModel.count > 0
function newVPNOrder()
{
......@@ -45,10 +74,15 @@ Item {
height: parent.height - topPanel.height
width: parent.width
// for DapVPNOrdersGridView
clip: true
Item {
id: mainPanel
anchors.margins: 24 * pt
property int margin: 24 * pt
property int halfMargin: margin * 0.5
anchors.top: parent.top
anchors.left: parent.left
anchors.right: rightPanel.left
......@@ -58,6 +92,7 @@ Item {
id: createYourFirstVPNOrderPanel
anchors.fill: parent
anchors.margins: mainPanel.margin
visible: false
onNewVPNOrder: tab.newVPNOrder()
......@@ -73,6 +108,30 @@ Item {
text: qsTr("Creating VPN order in process…")
visible: false
}
Item {
id: vpnOrders
anchors.fill: parent
anchors.margins: mainPanel.halfMargin
visible: false
Text {
id: textMyVPNOrders
x: mainPanel.halfMargin
y: mainPanel.halfMargin
font: quicksandFonts.bold14
color: "#3E3853"
text: qsTr("My VPN orders")
}
DapVPNOrdersGridView {
id: vpnOrdersView
anchors { left: parent.left; top: textMyVPNOrders.bottom; right: parent.right; bottom: parent.bottom }
delegateMargin: mainPanel.halfMargin
}
}
}
DapRightPanel_New {
......@@ -86,7 +145,10 @@ Item {
id: createVPNOrderPanel
DapCreateVPNOrderPanel {
onOrderCreated: {
rightPanel.stackView.clear();
rightPanel.visible = false;
}
}
}
......@@ -111,6 +173,10 @@ Item {
},
State {
name: "showOrders"
PropertyChanges {
target: vpnOrders
visible: true
}
}
]
}
......@@ -8,6 +8,14 @@ DapTopPanel {
signal newVPNOrder
// TODO только для теста
DapTextButton {
anchors.verticalCenter: parent.verticalCenter
visible: vpnTest.ordersModel.count > 0
text: "delete first order"
onClicked: vpnTest.ordersModel.remove(0, 1)
}
DapTextButton {
visible: control.btnNewVPNOrderVisible
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment