LP1821382 Angular boolean yes/no display component
[working/Evergreen.git] / Open-ILS / src / eg2 / src / app / share / util / bool.component.ts
1 import {Component, Input} from '@angular/core';
2
3 /* Simple component to render a boolean value as human-friendly text */
4
5 @Component({
6     selector: 'eg-bool',
7     template: `
8       <ng-container>
9         <span *ngIf="value" class="badge badge-success" i18n>Yes</span>
10         <span *ngIf="value == false" class="badge badge-secondary" i18n>No</span>
11         <ng-container *ngIf="value === null">
12           <span *ngIf="ternary" class="badge badge-light" i18n>Unset</span>
13           <span *ngIf="!ternary"> </span>
14       </ng-container>`
15 })
16 export class BoolDisplayComponent {
17
18     _value: boolean;
19     @Input() set value(v: boolean) {
20         this._value = v;
21     }
22     get value(): boolean {
23         return this._value;
24     }
25
26     // If true, a null value displays as unset.
27     // If false, a null value displays as an empty string.
28     _ternary: boolean;
29     @Input() set ternary(t: boolean) {
30         this._ternary = t;
31     }
32     get ternary(): boolean {
33         return this._ternary;
34     }
35
36     constructor() {
37         this.value = null;
38     }
39 }