From 15a545048c88dbfb6b7a14475e8d4336f00183d8 Mon Sep 17 00:00:00 2001 From: Bill Erickson Date: Fri, 5 Feb 2021 11:16:59 -0500 Subject: [PATCH] LP1908743 Org select now supports disabled org unit Org units specified as disabled in are now visible, but disabled when the typeahead displays. Signed-off-by: Bill Erickson Signed-off-by: Terran McCanna Signed-off-by: Chris Sharp --- .../org-select/org-select.component.html | 2 +- .../share/org-select/org-select.component.ts | 26 +++++++++++++++++-- 2 files changed, 25 insertions(+), 3 deletions(-) diff --git a/Open-ILS/src/eg2/src/app/share/org-select/org-select.component.html b/Open-ILS/src/eg2/src/app/share/org-select/org-select.component.html index 32bc94e2b9..cf120ecc41 100644 --- a/Open-ILS/src/eg2/src/app/share/org-select/org-select.component.html +++ b/Open-ILS/src/eg2/src/app/share/org-select/org-select.component.html @@ -1,7 +1,7 @@ -{{r.label}} + {{r.label}} diff --git a/Open-ILS/src/eg2/src/app/share/org-select/org-select.component.ts b/Open-ILS/src/eg2/src/app/share/org-select/org-select.component.ts index 3436045d10..dab8e37fa2 100644 --- a/Open-ILS/src/eg2/src/app/share/org-select/org-select.component.ts +++ b/Open-ILS/src/eg2/src/app/share/org-select/org-select.component.ts @@ -39,6 +39,7 @@ interface OrgDisplay { templateUrl: './org-select.component.html' }) export class OrgSelectComponent implements OnInit { + static domId = 0; selected: OrgDisplay; click$ = new Subject(); @@ -54,7 +55,7 @@ export class OrgSelectComponent implements OnInit { @Input() placeholder = ''; // ID to display in the DOM for this selector - @Input() domId = ''; + @Input() domId = 'eg-org-select-' + OrgSelectComponent.domId++; // Org unit field displayed in the selector @Input() displayField = 'shortname'; @@ -79,6 +80,10 @@ export class OrgSelectComponent implements OnInit { if (ids) { this._disabledOrgs = ids; } } + get disableOrgs(): number[] { + return this._disabledOrgs; + } + // Apply an org unit value at load time. // These will NOT result in an onChange event. @Input() initialOrg: IdlObject; @@ -241,7 +246,7 @@ export class OrgSelectComponent implements OnInit { return { id : org.id(), label : label, - disabled : false + disabled : this.disableOrgs.includes(org.id()) }; } @@ -269,7 +274,20 @@ export class OrgSelectComponent implements OnInit { this.selected = null; } + // NgbTypeahead doesn't offer a way to style the dropdown + // button directly, so we have to reach up and style it ourselves. + applyDisableStyle() { + this.disableOrgs.forEach(id => { + const node = document.getElementById(`${this.domId}-${id}`); + if (node) { + const button = node.parentNode as HTMLElement; + button.classList.add('disabled'); + } + }); + } + filter = (text$: Observable): Observable => { + return text$.pipe( debounceTime(200), distinctUntilChanged(), @@ -303,6 +321,10 @@ export class OrgSelectComponent implements OnInit { }); } + // Give the typeahead a chance to open before applying + // the disabled org unit styling. + setTimeout(() => this.applyDisableStyle()); + return orgs.map(org => this.formatForDisplay(org)); }) ); -- 2.43.2