diff --git a/src/accounting/static/js/option-form.js b/src/accounting/static/js/option-form.js index 1397568..6d93d49 100644 --- a/src/accounting/static/js/option-form.js +++ b/src/accounting/static/js/option-form.js @@ -619,7 +619,7 @@ class RecurringItemEditor { this.#accountSelector = new RecurringAccountSelector(this); this.#name.onchange = () => this.#validateName(); - this.#accountControl.onclick = () => this.#accountSelector.clear(); + this.#accountControl.onclick = () => this.#accountSelector.onOpen(); this.#descriptionTemplate.onchange = () => this.#validateDescriptionTemplate(); this.#form.onsubmit = () => { if (this.#validate()) { @@ -847,15 +847,6 @@ class RecurringAccountSelector { this.#clearButton.onclick = () => this.editor.clearAccount(); } - /** - * Clears the filter. - * - */ - clear() { - this.#query.value = ""; - this.#filterOptions(); - } - /** * Filters the options. * @@ -878,6 +869,28 @@ class RecurringAccountSelector { this.#queryNoResult.classList.add("d-none"); } } + + /** + * The callback when the account selector is shown. + * + */ + onOpen() { + this.#query.value = ""; + this.#filterOptions(); + console.log(this.editor.accountCode); + for (const option of this.#options) { + option.setActive(option.code === this.editor.accountCode); + } + if (this.editor.accountCode === null) { + this.#clearButton.classList.add("btn-secondary"); + this.#clearButton.classList.remove("btn-danger"); + this.#clearButton.disabled = true; + } else { + this.#clearButton.classList.add("btn-danger"); + this.#clearButton.classList.remove("btn-secondary"); + this.#clearButton.disabled = false; + } + } } /** @@ -962,4 +975,17 @@ class RecurringAccount { this.#element.classList.add("d-none"); } } + + /** + * Sets whether the option is active. + * + * @param isActive {boolean} true if active, or false otherwise + */ + setActive(isActive) { + if (isActive) { + this.#element.classList.add("active"); + } else { + this.#element.classList.remove("active"); + } + } }