[new-owner-report] add interactivity to highlight linked rows

add javascript to highlight matching documents/payments via their
common link-id attribute.
This commit is contained in:
Christopher Lam
2020-01-25 15:22:17 +08:00
parent 5de18cf101
commit 3f324952d4
2 changed files with 21 additions and 1 deletions

View File

@@ -60,6 +60,23 @@
(define balance-header (N_ "Balance"))
(define linked-txns-header (N_ "Links"))
(define javascript "
<script>
function getID(cell) { return cell.getAttribute('link-id'); }
function clicky() {
var id = getID(this);
var ishighlighted = this.classList.contains('highlight');
TDs.forEach(TD => TD.classList.remove('highlight'));
if (ishighlighted) return;
TDs
.filter (TD => getID(TD) == id)
.forEach (TD => TD.classList.add('highlight'));}
var TDs = document.getElementsByTagName('td');
TDs = [...TDs].filter(getID);
TDs.forEach(TD => TD.onclick = clicky);
</script>
")
;; Depending on the report type we want to set up some lists/cases
;; with strings to ease overview and translation
(define owner-string-alist
@@ -1116,7 +1133,9 @@ invoices and amounts.")))))
(list section-headings headings)
(list headings)))
(gnc:html-document-add-object! document table))))))
(gnc:html-document-add-object! document table)
(gnc:html-document-add-object! document javascript))))))
document))

View File

@@ -142,6 +142,7 @@
"th.column-heading-left { text-align: left; " number-header-info " }\n"
"th.column-heading-center { text-align: center; " number-header-info " }\n"
"th.column-heading-right { text-align: right; " number-header-info " }\n"
"td.highlight {background-color:#e1e1e1}"
"td.neg { " (if negative-red? "color: red; " "") " }\n"
"td.number-cell, td.total-number-cell { text-align: right; white-space: nowrap; }\n"
"td.date-cell { white-space: nowrap; }\n"