32 lines
1.1 KiB
TypeScript
32 lines
1.1 KiB
TypeScript
import {Component, Input} from "@angular/core";
|
|
|
|
@Component({
|
|
selector: 'loading',
|
|
template: `
|
|
<ng-template [ngIf]="full" [ngIfElse]="loading">
|
|
<div class="uk-position-relative" style="height: 100vh; width: 99vw; z-index: 1000; background-color: var(--background-color)">
|
|
<div class="uk-position-center">
|
|
<ng-container [ngTemplateOutlet]="loading"></ng-container>
|
|
</div>
|
|
</div>
|
|
</ng-template>
|
|
<ng-template #loading>
|
|
<div class="uk-flex uk-flex-center uk-margin-small-top">
|
|
<span class="portal-color uk-icon uk-spinner">
|
|
<svg width="60" height="60" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg" data-svg="spinner"><circle
|
|
fill="none" stroke="#000" cx="15" cy="15" r="14" style="stroke-width: 2px;"></circle></svg>
|
|
</span>
|
|
</div>
|
|
</ng-template>`
|
|
})
|
|
export class LoadingComponent {
|
|
/**
|
|
* Possible values '': blue, 'success': green, 'warning': orange and 'danger': red
|
|
*/
|
|
@Input() color: 'success' | 'warning' | 'danger' = null;
|
|
@Input() full: boolean = false;
|
|
|
|
constructor() {
|
|
}
|
|
}
|