From 39048fdd105b0b8b84ec74558ecaf1a5f73ede3c Mon Sep 17 00:00:00 2001
From: Sander van Grieken <sander@outrightsolutions.nl>
Date: Sat, 3 Apr 2021 21:56:42 +0200
Subject: [PATCH] qml: UI: add most transaction fields to tx history page

---
 electrum/gui/qml/components/EHeader.qml |  29 ++++++
 electrum/gui/qml/components/landing.qml |   5 +
 electrum/gui/qml/components/scan.qml    |   5 +
 electrum/gui/qml/components/splash.qml  |   2 +-
 electrum/gui/qml/components/tx.qml      | 118 +++++++++++++++++++++---
 5 files changed, 145 insertions(+), 14 deletions(-)
 create mode 100644 electrum/gui/qml/components/EHeader.qml

diff --git a/electrum/gui/qml/components/EHeader.qml b/electrum/gui/qml/components/EHeader.qml
new file mode 100644
index 000000000..50283313f
--- /dev/null
+++ b/electrum/gui/qml/components/EHeader.qml
@@ -0,0 +1,29 @@
+import QtQuick 2.6
+
+Item {
+    height: 60
+
+    property alias text: label.text
+
+    Rectangle {
+        anchors.fill: parent
+        color: '#cccccc'
+    }
+
+    Text {
+        id: label
+        x: 10
+        anchors.verticalCenter: parent.verticalCenter
+        font.pointSize: 11
+        color: '#202020'
+    }
+
+    Rectangle {
+        x: 10
+        width: parent.width - 20
+        height: 2
+        anchors.topMargin: 0
+        anchors.top: label.bottom
+        color: '#808080'
+    }
+}
diff --git a/electrum/gui/qml/components/landing.qml b/electrum/gui/qml/components/landing.qml
index 469799937..4a88d8170 100644
--- a/electrum/gui/qml/components/landing.qml
+++ b/electrum/gui/qml/components/landing.qml
@@ -6,6 +6,11 @@ Item {
     Column {
         width: parent.width
 
+        EHeader {
+            text: "Network"
+            width: parent.width
+        }
+
         Row {
             Text { text: "Server: " }
             Text { text: Network.server }
diff --git a/electrum/gui/qml/components/scan.qml b/electrum/gui/qml/components/scan.qml
index a13b04615..cec1e3710 100644
--- a/electrum/gui/qml/components/scan.qml
+++ b/electrum/gui/qml/components/scan.qml
@@ -6,6 +6,11 @@ Item {
     Column {
         width: parent.width
 
+        EHeader {
+            text: "Scan QR Code"
+            width: parent.width
+        }
+
         Item {
             id: voc
             width: parent.width
diff --git a/electrum/gui/qml/components/splash.qml b/electrum/gui/qml/components/splash.qml
index cd882d712..bb555f36a 100644
--- a/electrum/gui/qml/components/splash.qml
+++ b/electrum/gui/qml/components/splash.qml
@@ -3,7 +3,7 @@ import QtQuick 2.0
 Item {
     Rectangle {
         anchors.fill: parent
-        color: '#111111'
+        color: '#111144'
     }
 
     Image {
diff --git a/electrum/gui/qml/components/tx.qml b/electrum/gui/qml/components/tx.qml
index 116b18d25..f8aefd0f1 100644
--- a/electrum/gui/qml/components/tx.qml
+++ b/electrum/gui/qml/components/tx.qml
@@ -2,38 +2,130 @@ import QtQuick 2.6
 
 Item {
     id: rootItem
-//    height: 800
+
     Column {
         width: parent.width
-//        height: parent.height
 
-        Text {
-            text: "Transactions"
+        EHeader {
+            text: "History"
+            width: parent.width
         }
 
         ListView {
             width: parent.width
             height: 200
-//            anchors.bottom: rootItem.bottom
 
             model: Daemon.currentWallet.historyModel
             delegate: Item {
+                id: delegate
                 width: parent.width
-                height: line.height
+                height: txinfo.height
+
+                MouseArea {
+                    anchors.fill: delegate
+                    onClicked: extinfo.visible = !extinfo.visible
+                }
+
                 Row {
-                    id: line
+                    id: txinfo
                     Rectangle {
-                        width: 10
+                        width: 4
                         height: parent.height
-                        color: 'blue'
+                        color: model.incoming ? 'green' : 'red'
                     }
-                    Text {
-                        leftPadding: 20
-                        text: model.display
+
+                    Column {
+
+                        Row {
+                            id: baseinfo
+                            spacing: 10
+
+
+                            Image {
+                                readonly property variant tx_icons : [
+                                    "../../icons/unconfirmed.png",
+                                    "../../icons/clock1.png",
+                                    "../../icons/clock2.png",
+                                    "../../icons/clock3.png",
+                                    "../../icons/clock4.png",
+                                    "../../icons/clock5.png",
+                                    "../../icons/confirmed.png"
+                                ]
+
+                                width: 32
+                                height: 32
+                                anchors.verticalCenter: parent.verticalCenter
+                                source: tx_icons[Math.min(6,Math.floor(model.confirmations/20))]
+                            }
+
+                            Column {
+                                id: content
+                                width: delegate.width - x - valuefee.width
+
+                                Text {
+                                    text: model.label !== '' ? model.label : '<no label>'
+                                    color: model.label !== '' ? 'black' : 'gray'
+                                }
+                                Text {
+                                    font.pointSize: 7
+                                    text: model.date
+                                }
+                            }
+
+                            Column {
+                                id: valuefee
+                                width: delegate.width * 0.25
+                                Text {
+                                    text: model.bc_value
+                                }
+                                Text {
+                                    font.pointSize: 7
+                                    text: 'fee: ' + (model.fee !== undefined ? model.fee : '0')
+                                }
+                            }
+                        }
+
+                        Row {
+                            id: extinfo
+                            visible: false
+
+                            Column {
+                                id: extinfoinner
+                                Text {
+                                    font.pointSize: 6
+                                    text: 'txid: ' + model.txid
+                                }
+                                Text {
+                                    font.pointSize: 7
+                                    text: 'height: ' + model.height
+                                }
+                                Text {
+                                    font.pointSize: 7
+                                    text: 'confirmations: ' + model.confirmations
+                                }
+                                Text {
+                                    font.pointSize: 7
+                                    text: {
+                                        for (var i=0; i < Object.keys(model.outputs).length; i++) {
+                                            if (model.outputs[i].value === model.bc_value) {
+                                                return 'address: ' + model.outputs[i].address
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+
+
                     }
                 }
-            }
+            } // delegate
         }
 
+        EButton {
+            text: 'Back'
+            onClicked: app.stack.pop()
+        }
     }
+
 }