Revised the JavaScript journal entry editor and summary editor so that the summary editor work with the journal entry editor and does not get into the detail of the journal entry editor.

This commit is contained in:
依瑪貓 2023-03-13 18:34:17 +08:00
parent fe87c3a7de
commit 6a671cac84
2 changed files with 66 additions and 54 deletions

View File

@ -94,34 +94,10 @@ class SummaryEditor {
#selectedAccount = null;
/**
* The modal of the journal entry form
* @type {HTMLDivElement}
* The journal entry editor
* @type {JournalEntryEditor}
*/
#entryFormModal;
/**
* The control of the account on the journal entry form
* @type {HTMLDivElement}
*/
#formAccountControl;
/**
* The account on the journal entry form
* @type {HTMLDivElement}
*/
#formAccount;
/**
* The control of the summary on the journal entry form
* @type {HTMLDivElement}
*/
#formSummaryControl;
/**
* The summary on the journal entry form
* @type {HTMLDivElement}
*/
#formSummary;
#entryEditor;
/**
* The tab planes
@ -145,13 +121,6 @@ class SummaryEditor {
// noinspection JSValidateTypes
this.#accountButtons = Array.from(document.getElementsByClassName(this.prefix + "-account"));
// Things from the entry form
this.#entryFormModal = document.getElementById("accounting-entry-editor-modal");
this.#formAccountControl = document.getElementById("accounting-entry-editor-account-control");
this.#formAccount = document.getElementById("accounting-entry-editor-account");
this.#formSummaryControl = document.getElementById("accounting-entry-editor-summary-control");
this.#formSummary = document.getElementById("accounting-entry-editor-summary");
for (const cls of [GeneralTagTab, GeneralTripTab, BusTripTab, RegularPaymentTab, AnnotationTab]) {
const tab = new cls(this);
this.tabPlanes[tab.tabId()] = tab;
@ -239,31 +208,24 @@ class SummaryEditor {
*
*/
#submit() {
if (this.summary.value === "") {
this.#formSummaryControl.classList.remove("accounting-not-empty");
} else {
this.#formSummaryControl.classList.add("accounting-not-empty");
}
if (this.#selectedAccount !== null) {
this.#formAccountControl.classList.add("accounting-not-empty");
this.#formAccount.dataset.code = this.#selectedAccount.dataset.code;
this.#formAccount.dataset.text = this.#selectedAccount.dataset.text;
this.#formAccount.innerText = this.#selectedAccount.dataset.text;
JournalEntryEditor.validateAccount();
}
this.#formSummary.dataset.value = this.summary.value;
this.#formSummary.innerText = this.summary.value;
bootstrap.Modal.getOrCreateInstance(this.#modal).hide();
bootstrap.Modal.getOrCreateInstance(this.#entryFormModal).show();
if (this.#selectedAccount !== null) {
this.#entryEditor.saveSummaryWithAccount(this.summary.value, this.#selectedAccount.dataset.code, this.#selectedAccount.dataset.text);
} else {
this.#entryEditor.saveSummary(this.summary.value);
}
}
/**
* The callback when the summary editor is shown.
*
* @param entryEditor {JournalEntryEditor} the journal entry editor
* @param summary {string} the summary
*/
#onOpen() {
#onOpen(entryEditor, summary) {
this.#entryEditor = entryEditor;
this.#reset();
this.summary.value = this.#formSummary.dataset.value;
this.summary.value = summary;
this.#onSummaryChange();
}
@ -291,13 +253,20 @@ class SummaryEditor {
*/
static initialize() {
const forms = Array.from(document.getElementsByClassName("accounting-summary-editor"));
const entryForm = document.getElementById("accounting-entry-editor");
const formSummaryControl = document.getElementById("accounting-entry-editor-summary-control");
for (const form of forms) {
const editor = new SummaryEditor(form);
this.#editors[editor.#entryType] = editor;
}
formSummaryControl.onclick = () => this.#editors[entryForm.dataset.entryType].#onOpen()
}
/**
* The callback when the summary editor is shown.
*
* @param entryEditor {JournalEntryEditor} the journal entry editor
* @param summary {string} the summary
*/
static start(entryEditor, summary) {
this.#editors[entryEditor.entryType].#onOpen(entryEditor, summary);
}
}

View File

@ -793,6 +793,12 @@ class JournalEntryEditor {
*/
#modal;
/**
* The entry type, either "debit" or "credit"
* @type {string}
*/
entryType;
/**
* The control of the account
* @type {HTMLDivElement}
@ -868,6 +874,9 @@ class JournalEntryEditor {
this.#summaryError = document.getElementById("accounting-entry-editor-summary-error");
this.#amount = document.getElementById("accounting-entry-editor-amount");
this.#amountError = document.getElementById("accounting-entry-editor-amount-error");
this.#summaryControl.onclick = () => {
SummaryEditor.start(this, this.#summary.dataset.value);
};
this.#element.onsubmit = () => {
if (this.#validate()) {
if (this.#entry === null) {
@ -882,6 +891,38 @@ class JournalEntryEditor {
};
}
/**
* Saves the summary from the summary editor.
*
* @param summary {string} the summary
*/
saveSummary(summary) {
if (summary === "") {
this.#summaryControl.classList.remove("accounting-not-empty");
} else {
this.#summaryControl.classList.add("accounting-not-empty");
}
this.#summary.dataset.value = summary;
this.#summary.innerText = summary;
bootstrap.Modal.getOrCreateInstance(this.#modal).show();
}
/**
* Saves the summary with the suggested account from the summary editor.
*
* @param summary {string} the summary
* @param accountCode {string} the account code
* @param accountText {string} the account text
*/
saveSummaryWithAccount(summary, accountCode, accountText) {
this.#accountControl.classList.add("accounting-not-empty");
this.#account.dataset.code = accountCode;
this.#account.dataset.text = accountText;
this.#account.innerText = accountText;
this.#validateAccount();
this.saveSummary(summary)
}
/**
* Validates the form.
*
@ -950,6 +991,7 @@ class JournalEntryEditor {
#onAddNew(side) {
this.#entry = null;
this.#side = side;
this.entryType = this.#side.entryType;
this.#element.dataset.entryType = side.entryType;
this.#accountControl.classList.remove("accounting-not-empty");
this.#accountControl.classList.remove("is-invalid");
@ -980,6 +1022,7 @@ class JournalEntryEditor {
#onEdit(entry, accountCode, accountText, summary, amount) {
this.#entry = entry;
this.#side = entry.side;
this.entryType = this.#side.entryType;
this.#element.dataset.entryType = entry.entryType;
if (accountCode === "") {
this.#accountControl.classList.remove("accounting-not-empty");