imacat/mia-accounting
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 41 Wiki Activity

Replaced the traditional function expressions with ES6 arrow function expressions in the JavaScript for the summary editor to avoid messing up with the "this" object.

Browse Source
This commit is contained in:
依瑪貓 2023-03-04 07:49:14 +08:00
parent 3ab4eacf9f
commit 39c9c17007
1 changed files with 44 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

107
src/accounting/static/js/summary-editor.js
View File

@ -22,7 +22,7 @@
*/ */
// Initializes the page JavaScript. // Initializes the page JavaScript.
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", () => {
SummaryEditor.initialize(); SummaryEditor.initialize();
}); });
@ -163,13 +163,10 @@ class SummaryEditor {
} }
this.currentTab = this.tabPlanes.general; this.currentTab = this.tabPlanes.general;
this.#initializeSuggestedAccounts(); this.#initializeSuggestedAccounts();
const editor = this; this.summary.onchange = () => this.#onSummaryChange();
this.summary.onchange = function () { this.#form.onsubmit = () => {
editor.#onSummaryChange(); if (this.currentTab.validate()) {
}; this.#submit();
this.#form.onsubmit = function () {
if (editor.currentTab.validate()) {
editor.#submit();
} }
return false; return false;
}; };
@ -220,11 +217,8 @@ class SummaryEditor {
* *
*/ */
#initializeSuggestedAccounts() { #initializeSuggestedAccounts() {
const editor = this;
for (const accountButton of this.#accountButtons) { for (const accountButton of this.#accountButtons) {
accountButton.onclick = function () { accountButton.onclick = () => this.#selectAccount(accountButton);
editor.#selectAccount(accountButton);
};
} }
} }
@ -307,10 +301,7 @@ class SummaryEditor {
const editor = new SummaryEditor(form); const editor = new SummaryEditor(form);
this.#editors[editor.#entryType] = editor; this.#editors[editor.#entryType] = editor;
} }
const editors = this; formSummaryControl.onclick = () => this.#editors[entryForm.dataset.entryType].#onOpen()
formSummaryControl.onclick = function () {
editors.#editors[entryForm.dataset.entryType].#onOpen();
};
} }
/** /**
@ -365,10 +356,7 @@ class TabPlane {
this.prefix = this.editor.prefix + "-" + this.tabId(); this.prefix = this.editor.prefix + "-" + this.tabId();
this.#tab = document.getElementById(this.prefix + "-tab"); this.#tab = document.getElementById(this.prefix + "-tab");
this.#page = document.getElementById(this.prefix + "-page"); this.#page = document.getElementById(this.prefix + "-page");
const tabPlane = this; this.#tab.onclick = () => this.switchToMe();
this.#tab.onclick = function () {
tabPlane.switchToMe();
};
} }
/** /**
@ -460,10 +448,9 @@ class TagTabPlane extends TabPlane {
// noinspection JSValidateTypes // noinspection JSValidateTypes
this.tagButtons = Array.from(document.getElementsByClassName(this.prefix + "-btn-tag")); this.tagButtons = Array.from(document.getElementsByClassName(this.prefix + "-btn-tag"));
this.initializeTagButtons(); this.initializeTagButtons();
const tabPlane = this; this.tag.onchange = () => {
this.tag.onchange = function () { this.onTagChange();
tabPlane.onTagChange(); this.updateSummary();
tabPlane.updateSummary();
}; };
} }
@ -519,18 +506,17 @@ class TagTabPlane extends TabPlane {
* *
*/ */
initializeTagButtons() { initializeTagButtons() {
const tabPlane = this; for (const tagButton of this.tagButtons) {
for (const tagButton of tabPlane.tagButtons) { tagButton.onclick = () => {
tagButton.onclick = function () { for (const otherButton of this.tagButtons) {
for (const otherButton of tabPlane.tagButtons) {
otherButton.classList.remove("btn-primary"); otherButton.classList.remove("btn-primary");
otherButton.classList.add("btn-outline-primary"); otherButton.classList.add("btn-outline-primary");
} }
tagButton.classList.remove("btn-outline-primary"); tagButton.classList.remove("btn-outline-primary");
tagButton.classList.add("btn-primary"); tagButton.classList.add("btn-primary");
tabPlane.tag.value = tagButton.dataset.value; this.tag.value = tagButton.dataset.value;
tabPlane.editor.filterSuggestedAccounts(tagButton); this.editor.filterSuggestedAccounts(tagButton);
tabPlane.updateSummary(); this.updateSummary();
}; };
} }
} }
@ -702,27 +688,26 @@ class GeneralTripTab extends TagTabPlane {
this.#toError = document.getElementById(this.prefix + "-to-error") this.#toError = document.getElementById(this.prefix + "-to-error")
// noinspection JSValidateTypes // noinspection JSValidateTypes
this.#directionButtons = Array.from(document.getElementsByClassName(this.prefix + "-direction")); this.#directionButtons = Array.from(document.getElementsByClassName(this.prefix + "-direction"));
const tabPlane = this; this.#from.onchange = () => {
this.#from.onchange = function () { this.#from.value = this.#from.value.trim();
tabPlane.#from.value = tabPlane.#from.value.trim(); this.updateSummary();
tabPlane.updateSummary(); this.validateFrom();
tabPlane.validateFrom();
}; };
for (const directionButton of this.#directionButtons) { for (const directionButton of this.#directionButtons) {
directionButton.onclick = function () { directionButton.onclick = () => {
for (const otherButton of tabPlane.#directionButtons) { for (const otherButton of this.#directionButtons) {
otherButton.classList.remove("btn-primary"); otherButton.classList.remove("btn-primary");
otherButton.classList.add("btn-outline-primary"); otherButton.classList.add("btn-outline-primary");
} }
directionButton.classList.remove("btn-outline-primary"); directionButton.classList.remove("btn-outline-primary");
directionButton.classList.add("btn-primary"); directionButton.classList.add("btn-primary");
tabPlane.updateSummary(); this.updateSummary();
}; };
} }
this.#to.onchange = function () { this.#to.onchange = () => {
tabPlane.#to.value = tabPlane.#to.value.trim(); this.#to.value = this.#to.value.trim();
tabPlane.updateSummary(); this.updateSummary();
tabPlane.validateTo(); this.validateTo();
}; };
} }
@ -915,21 +900,20 @@ class BusTripTab extends TagTabPlane {
this.#fromError = document.getElementById(this.prefix + "-from-error"); this.#fromError = document.getElementById(this.prefix + "-from-error");
this.#to = document.getElementById(this.prefix + "-to"); this.#to = document.getElementById(this.prefix + "-to");
this.#toError = document.getElementById(this.prefix + "-to-error") this.#toError = document.getElementById(this.prefix + "-to-error")
const tabPlane = this; this.#route.onchange = () => {
this.#route.onchange = function () { this.#route.value = this.#route.value.trim();
tabPlane.#route.value = tabPlane.#route.value.trim(); this.updateSummary();
tabPlane.updateSummary(); this.validateRoute();
tabPlane.validateRoute();
}; };
this.#from.onchange = function () { this.#from.onchange = () => {
tabPlane.#from.value = tabPlane.#from.value.trim(); this.#from.value = this.#from.value.trim();
tabPlane.updateSummary(); this.updateSummary();
tabPlane.validateFrom(); this.validateFrom();
}; };
this.#to.onchange = function () { this.#to.onchange = () => {
tabPlane.#to.value = tabPlane.#to.value.trim(); this.#to.value = this.#to.value.trim();
tabPlane.updateSummary(); this.updateSummary();
tabPlane.validateTo(); this.validateTo();
}; };
} }
@ -1139,13 +1123,10 @@ class AnnotationTab extends TabPlane {
*/ */
constructor(editor) { constructor(editor) {
super(editor); super(editor);
const tabPlane = this; this.editor.number.onchange = () => this.updateSummary();
this.editor.number.onchange = function () { this.editor.note.onchange = () => {
tabPlane.updateSummary(); this.editor.note.value = this.editor.note.value.trim();
}; this.updateSummary();
this.editor.note.onchange = function () {
tabPlane.editor.note.value = tabPlane.editor.note.value.trim();
tabPlane.updateSummary();
}; };
} }