native: simple data loading

native/MainPage.qml

@@ -62,36 +62,84 @@ Rectangle {
         }
         color: getColors().window
 
-        TableView {
+        ListModel {
+            id: apiDataModel
+        }
+
+        ListView {
             anchors {
                 topMargin: 5
                 fill: s2
             }
-            columnSpacing: 0
-            rowSpacing: 1
             clip: true
             boundsBehavior: Flickable.StopAtBounds
 
-            model: Data {}
-            delegate: Rectangle {
-                id: r
-                anchors{
-                }
-                color: getColors().base
-                implicitWidth: 100
-                implicitHeight: 50
-                border.width: 0
+            model: apiDataModel
 
-                Text {
-                    anchors {
-                    horizontalCenter: r.horizontalCenter
-                    verticalCenter: r.verticalCenter
+            delegate: Item {
+                width: parent.width
+                height: 50
+
+                Row {
+                    spacing: 10
+
+                    Text {
+                        text: model.name
+                        color: getColors().text
+                    }
+
+                    Text {
+                        text: model.key
+                        color: getColors().text
+                    }
+                    Text {
+                        text: model.amount
+                        color: getColors().text
+                    }
+                    Text {
+                        text: model.start
+                        color: getColors().text
+                    }
+                    Text {
+                        text: model.end
+                        color: getColors().text
+                    }
+                    Text {
+                        text: model.group
+                        color: getColors().text
                     }
-                    text: display
-                    color: getColors().text
-                    anchors.centerIn: parent
                 }
             }
         }
     }
+
+    Component.onCompleted: {
+        var xhr = new XMLHttpRequest();
+        xhr.open("GET", "https://api.clan-war.net/api/v1/licenses");
+        xhr.setRequestHeader("Authorization", "Bearer " + authToken);
+        xhr.onreadystatechange = function() {
+            if (xhr.readyState === XMLHttpRequest.DONE) {
+                if (xhr.status === 200) {
+                    var jsonResponse = JSON.parse(xhr.responseText);
+
+                    apiDataModel.clear();
+                    for (var i = 0; i < jsonResponse.length; i++) {
+                        for (var ii = 0; ii < jsonResponse[i].licenses.length; ii++) {
+                            apiDataModel.append({
+                                group: jsonResponse[i].name,
+                                name: jsonResponse[i].licenses[ii].name,
+                                start: jsonResponse[i].licenses[ii].start ?? "Indefinitely",
+                                end: jsonResponse[i].licenses[ii].end ?? "Indefinitely",
+                                amount: jsonResponse[i].licenses[ii].amount ?? "∞",
+                                key: jsonResponse[i].licenses[ii].key
+                            });
+                        }
+                    }
+                } else {
+                    console.log("Error: " + xhr.status);
+                }
+            }
+        }
+        xhr.send();
+    }
 }