replace FlickableType with ListViewType in PageSetupWizardApiServiceInfo

client/ui/qml/Pages2/PageSetupWizardApiServiceInfo.qml

@@ -15,25 +15,31 @@ import "../Components"
 PageType {
     id: root
 
-    FlickableType {
+    BackButtonType {
-        id: fl
+        id: backButton
-        anchors.top: parent.top
-        anchors.bottom: parent.bottom
-        contentHeight: content.height + continueButton.implicitHeight + continueButton.anchors.bottomMargin + continueButton.anchors.topMargin
-
-        ColumnLayout {
-            id: content
 
         anchors.top: parent.top
         anchors.left: parent.left
         anchors.right: parent.right
+        anchors.topMargin: 20
 
-            spacing: 0
+        onFocusChanged: {
-
+            if (this.activeFocus) {
-            BackButtonType {
+                listView.positionViewAtBeginning()
-                id: backButton
-                Layout.topMargin: 20
             }
+        }
+    }
+
+    ListViewType {
+        id: listView
+
+        anchors.top: backButton.bottom
+        anchors.bottom: parent.bottom
+        anchors.right: parent.right
+        anchors.left: parent.left
+
+        header: ColumnLayout {
+            width: listView.width
 
             BaseHeaderType {
                 Layout.fillWidth: true
@@ -45,53 +51,28 @@ PageType {
                 headerText: ApiServicesModel.getSelectedServiceData("name")
                 descriptionText: ApiServicesModel.getSelectedServiceData("serviceDescription")
             }
+        }
+
+        model: inputFields
+        spacing: 0
+
+        delegate: ColumnLayout {
+            width: listView.width
 
             LabelWithImageType {
                 Layout.fillWidth: true
                 Layout.margins: 16
 
-                imageSource: "qrc:/images/controls/map-pin.svg"
+                imageSource: imagePath
-                leftText: qsTr("For the region")
+                leftText: lText
-                rightText: ApiServicesModel.getSelectedServiceData("region")
+                rightText: rText
+            }
         }
 
-            LabelWithImageType {
+        footer: ColumnLayout {
-                Layout.fillWidth: true
+            width: listView.width
-                Layout.margins: 16
 
-                imageSource: "qrc:/images/controls/tag.svg"
+            spacing: 0
-                leftText: qsTr("Price")
-                rightText: ApiServicesModel.getSelectedServiceData("price")
-            }
-
-            LabelWithImageType {
-                Layout.fillWidth: true
-                Layout.margins: 16
-
-                imageSource: "qrc:/images/controls/history.svg"
-                leftText: qsTr("Work period")
-                rightText: ApiServicesModel.getSelectedServiceData("timeLimit")
-
-                visible: rightText !== ""
-            }
-
-            LabelWithImageType {
-                Layout.fillWidth: true
-                Layout.margins: 16
-
-                imageSource: "qrc:/images/controls/gauge.svg"
-                leftText: qsTr("Speed")
-                rightText: ApiServicesModel.getSelectedServiceData("speed")
-            }
-
-            LabelWithImageType {
-                Layout.fillWidth: true
-                Layout.margins: 16
-
-                imageSource: "qrc:/images/controls/info.svg"
-                leftText: qsTr("Features")
-                rightText: ""
-            }
 
             ParagraphTextType {
                 Layout.fillWidth: true
@@ -113,20 +94,15 @@ PageType {
                     cursorShape: parent.hoveredLink ? Qt.PointingHandCursor : Qt.ArrowCursor
                 }
             }
-        }
-    }
 
             BasicButtonType {
                 id: continueButton
 
-        anchors.right: parent.right
+                Layout.fillWidth: true
-        anchors.left: parent.left
+                Layout.topMargin: 32
-        anchors.bottom: parent.bottom
+                Layout.bottomMargin: 32
-
+                Layout.leftMargin: 16
-        anchors.topMargin: 32
+                Layout.rightMargin: 16
-        anchors.rightMargin: 16
-        anchors.leftMargin: 16
-        anchors.bottomMargin: 32
 
                 text: qsTr("Connect")
 
@@ -144,3 +120,58 @@ PageType {
                 }
             }
         }
+    }
+
+    property list<QtObject> inputFields: [
+        region,
+        price,
+        timeLimit,
+        speed,
+        features
+    ]
+
+    QtObject {
+        id: region
+
+        readonly property string imagePath: "qrc:/images/controls/map-pin.svg"
+        readonly property string lText: qsTr("For the region")
+        readonly property string rText: ApiServicesModel.getSelectedServiceData("region")
+        property bool isVisible: true
+    }
+
+    QtObject {
+        id: price
+
+        readonly property string imagePath: "qrc:/images/controls/tag.svg"
+        readonly property string lText: qsTr("Price")
+        readonly property string rText: ApiServicesModel.getSelectedServiceData("price")
+        property bool isVisible: true
+    }
+
+    QtObject {
+        id: timeLimit
+
+        readonly property string imagePath: "qrc:/images/controls/history.svg"
+        readonly property string lText: qsTr("Work period")
+        readonly property string rText: ApiServicesModel.getSelectedServiceData("timeLimit")
+        property bool isVisible: rText !== ""
+    }
+
+    QtObject {
+        id: speed
+
+        readonly property string imagePath: "qrc:/images/controls/gauge.svg"
+        readonly property string lText: qsTr("Speed")
+        readonly property string rText: ApiServicesModel.getSelectedServiceData("speed")
+        property bool isVisible: true
+    }
+
+    QtObject {
+        id: features
+
+        readonly property string imagePath: "qrc:/images/controls/info.svg"
+        readonly property string lText: qsTr("Features")
+        readonly property string rText: ""
+        property bool isVisible: true
+    }
+}