diff --git a/CellFrameDashboardGUI/qml.qrc b/CellFrameDashboardGUI/qml.qrc index 777faa45fbcfbae171ec073958f507da3bc4f6ee..2f5286b3df68ee543c6fd8f43025dec766a6ad47 100755 --- a/CellFrameDashboardGUI/qml.qrc +++ b/CellFrameDashboardGUI/qml.qrc @@ -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> diff --git a/CellFrameDashboardGUI/resources/icons/ic_info_order.svg b/CellFrameDashboardGUI/resources/icons/ic_info_order.svg new file mode 100644 index 0000000000000000000000000000000000000000..27dbbbae7d369847b1e01deea73a96ddeb0379cc --- /dev/null +++ b/CellFrameDashboardGUI/resources/icons/ic_info_order.svg @@ -0,0 +1 @@ +<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 diff --git a/CellFrameDashboardGUI/screen/desktop/VPNService/DapCreateVPNOrderPanel.qml b/CellFrameDashboardGUI/screen/desktop/VPNService/DapCreateVPNOrderPanel.qml index 8cd148d28e9915b51cdc38ffc20614b58e9daaa8..8c42cbbb1dc09b8ce337d25d306cbebe37185d86 100644 --- a/CellFrameDashboardGUI/screen/desktop/VPNService/DapCreateVPNOrderPanel.qml +++ b/CellFrameDashboardGUI/screen/desktop/VPNService/DapCreateVPNOrderPanel.qml @@ -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(); } } diff --git a/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNOrderInfoLine.qml b/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNOrderInfoLine.qml new file mode 100644 index 0000000000000000000000000000000000000000..b7ecbe1fc72148a8c5e6f243a5a07ec27b03bd99 --- /dev/null +++ b/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNOrderInfoLine.qml @@ -0,0 +1,36 @@ +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") + } +} diff --git a/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNOrdersGridView.qml b/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNOrdersGridView.qml new file mode 100644 index 0000000000000000000000000000000000000000..b49a60482d9ae8633cf2fb466f1d8f1fd37d0e77 --- /dev/null +++ b/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNOrdersGridView.qml @@ -0,0 +1,121 @@ +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; + } + } + } + } +} diff --git a/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNServiceTab.qml b/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNServiceTab.qml index 81c8ce70484c217e0d7f2b0372f2b9db0d19d077..232b240488627524e2199da3f6dbe2a380343ad1 100644 --- a/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNServiceTab.qml +++ b/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNServiceTab.qml @@ -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 + } } ] } diff --git a/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNServiceTopPanel.qml b/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNServiceTopPanel.qml index 11c36316874bd275e5e82d9ccc12ac4a92adfb99..13953cf67a3ad4094bb38ed6bcfa3a20856df348 100644 --- a/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNServiceTopPanel.qml +++ b/CellFrameDashboardGUI/screen/desktop/VPNService/DapVPNServiceTopPanel.qml @@ -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