tin-spa 2.0.0 → 2.1.0

package/fesm5/tin-spa.js

@@ -1,3422 +0,0 @@
-import { __decorate, __awaiter, __generator, __param, __values, __extends } from 'tslib';
-import { ɵɵdefineInjectable, Injectable, Inject, Component, ɵɵinject, Input, NgModule, EventEmitter, Output, ViewChild, HostBinding, HostListener, Directive } from '@angular/core';
-import { MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar';
-import { MatDialogRef, MAT_DIALOG_DATA, MatDialog, MatDialogModule, MAT_DIALOG_DEFAULT_OPTIONS } from '@angular/material/dialog';
-import { of, BehaviorSubject, Observable } from 'rxjs';
-import { mergeMap, startWith, map } from 'rxjs/operators';
-import { saveAs } from 'file-saver';
-import { utils, write } from 'xlsx';
-import { Router, ActivatedRoute } from '@angular/router';
-import { HttpHeaders, HttpClient, HttpResponse, HTTP_INTERCEPTORS } from '@angular/common/http';
-import { CommonModule, LocationStrategy, HashLocationStrategy, Location } from '@angular/common';
-import { MatAutocompleteModule } from '@angular/material/autocomplete';
-import { MatBadgeModule } from '@angular/material/badge';
-import { MatButtonModule } from '@angular/material/button';
-import { MatCardModule } from '@angular/material/card';
-import { MatCheckboxModule } from '@angular/material/checkbox';
-import { MatChipsModule } from '@angular/material/chips';
-import { MatNativeDateModule, MAT_DATE_LOCALE } from '@angular/material/core';
-import { MatDatepickerModule } from '@angular/material/datepicker';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import { MatIconModule } from '@angular/material/icon';
-import { MatInputModule } from '@angular/material/input';
-import { MatListModule } from '@angular/material/list';
-import { MatMenuModule } from '@angular/material/menu';
-import { MatPaginatorModule } from '@angular/material/paginator';
-import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import { MatRadioModule } from '@angular/material/radio';
-import { MatSelectModule } from '@angular/material/select';
-import { MatSliderModule } from '@angular/material/slider';
-import { MatSortModule } from '@angular/material/sort';
-import { MatStepperModule } from '@angular/material/stepper';
-import { MatTableModule, MatTableDataSource } from '@angular/material/table';
-import { MatTabsModule } from '@angular/material/tabs';
-import { MatTooltipModule } from '@angular/material/tooltip';
-import { FormsModule, ReactiveFormsModule, FormControl, Validators } from '@angular/forms';
-import { Keepalive, NgIdleKeepaliveModule } from '@ng-idle/keepalive';
-import { MomentModule } from 'angular2-moment';
-import { DEFAULT_INTERRUPTSOURCES, Idle } from '@ng-idle/core';
-import { STEPPER_GLOBAL_OPTIONS } from '@angular/cdk/stepper';
-
-var TinSpaService = /** @class */ (function () {
-    function TinSpaService() {
-    }
-    TinSpaService.ɵprov = ɵɵdefineInjectable({ factory: function TinSpaService_Factory() { return new TinSpaService(); }, token: TinSpaService, providedIn: "root" });
-    TinSpaService = __decorate([
-        Injectable({
-            providedIn: 'root'
-        })
-    ], TinSpaService);
-    return TinSpaService;
-}());
-
-var StorageService = /** @class */ (function () {
-    function StorageService() {
-    }
-    // Store the value
-    StorageService.prototype.store = function (storageKey, value) {
-        return __awaiter(this, void 0, void 0, function () {
-            var encryptedValue;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        encryptedValue = btoa(escape(JSON.stringify(value)));
-                        // const encryptedValue = JSON.stringify(value);
-                        return [4 /*yield*/, localStorage.setItem(storageKey, encryptedValue)];
-                    case 1:
-                        // const encryptedValue = JSON.stringify(value);
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    // Get the value
-    StorageService.prototype.get = function (storageKey) {
-        return __awaiter(this, void 0, void 0, function () {
-            var ret;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, localStorage.getItem(storageKey)];
-                    case 1:
-                        ret = _a.sent();
-                        return [2 /*return*/, JSON.parse(unescape(atob(ret)))];
-                }
-            });
-        });
-    };
-    // Remove
-    StorageService.prototype.removeStorageItem = function (storageKey) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, localStorage.removeItem(storageKey)];
-                    case 1:
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    // Clear storage
-    StorageService.prototype.clear = function () {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, localStorage.clear()];
-                    case 1:
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    StorageService.ɵprov = ɵɵdefineInjectable({ factory: function StorageService_Factory() { return new StorageService(); }, token: StorageService, providedIn: "root" });
-    StorageService = __decorate([
-        Injectable({
-            providedIn: 'root'
-        })
-    ], StorageService);
-    return StorageService;
-}());
-
-var messageDialog = /** @class */ (function () {
-    function messageDialog(dialogRef, data) {
-        this.dialogRef = dialogRef;
-        this.data = data;
-    }
-    messageDialog.prototype.ngOnInit = function () {
-        this.messageType = this.data.type;
-        this._messageSubject = this.data.subject;
-        this._messageDetails = this.data.details;
-    };
-    messageDialog.prototype.response = function (resp) {
-        this.dialogRef.close(resp);
-    };
-    messageDialog.ctorParameters = function () { return [
-        { type: MatDialogRef },
-        { type: undefined, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] }
-    ]; };
-    messageDialog = __decorate([
-        Component({
-            selector: 'lib-app-message',
-            template: "\r\n  <h2 mat-dialog-title>\r\n\r\n    <mat-label *ngIf=\"messageType=='confirm'\">Confirm</mat-label>\r\n    <mat-label *ngIf=\"messageType=='info'\">Information</mat-label>\r\n    <mat-label *ngIf=\"messageType=='error'\">Error</mat-label>\r\n\r\n  </h2>\r\n\r\n  <mat-dialog-content class=\"mat-typography\">\r\n\r\n\r\n    <!-- Confirm -->\r\n    <p *ngIf=\"messageType=='confirm'\">{{_messageDetails}}</p>\r\n\r\n\r\n    <!-- Information -->\r\n    <div *ngIf=\"messageType=='info'\">\r\n\r\n      <h3>{{_messageSubject}}</h3>\r\n      <mat-label>{{_messageDetails}}</mat-label>\r\n\r\n    </div>\r\n\r\n\r\n    <!-- Error -->\r\n    <div *ngIf=\"messageType=='error'\">\r\n\r\n      <mat-label>{{_messageDetails}}</mat-label>\r\n\r\n    </div>\r\n\r\n\r\n  </mat-dialog-content>\r\n\r\n<mat-dialog-actions>\r\n\r\n  <button id=\"btnYes\" mat-stroked-button  *ngIf=\"messageType=='confirm'\" (click)=\"response('yes')\" cdkFocusInitial>Yes</button>\r\n\r\n  <button id=\"btnNo\" mat-stroked-button *ngIf=\"messageType=='confirm'\" (click)=\"response('no')\" >No</button>\r\n\r\n  <button id=\"btnOK\" mat-stroked-button *ngIf=\"messageType=='info' || messageType=='error'\" (click)=\"response('ok')\" cdkFocusInitial>OK</button>\r\n\r\n</mat-dialog-actions>\r\n\r\n\r\n\r\n"
-        }),
-        __param(1, Inject(MAT_DIALOG_DATA))
-    ], messageDialog);
-    return messageDialog;
-}());
-;
-
-var MessageService = /** @class */ (function () {
-    function MessageService(snackBar, dialog) {
-        this.snackBar = snackBar;
-        this.dialog = dialog;
-    }
-    MessageService.prototype.toast = function (msg) {
-        this.snackBar.open(msg, "OK", { duration: 5000 });
-    };
-    MessageService.prototype.info = function (subject, details) {
-        var type = "info";
-        var dialogRef = this.dialog.open(messageDialog, {
-            width: "600px",
-            data: { type: type, subject: subject, details: details },
-        });
-    };
-    MessageService.prototype.error = function (details) {
-        var type = "error";
-        var subject;
-        var dialogRef = this.dialog.open(messageDialog, {
-            width: "600px",
-            data: { type: type, subject: subject, details: details },
-        });
-    };
-    MessageService.prototype.confirm = function (msg) {
-        var type = "confirm";
-        var subject = "";
-        var details = msg;
-        var dialogRef = this.dialog.open(messageDialog, {
-            width: "400px",
-            data: { type: type, subject: subject, details: details },
-        });
-        return dialogRef.afterClosed().pipe(mergeMap(function (result) {
-            return of(result);
-        }));
-    };
-    MessageService.ctorParameters = function () { return [
-        { type: MatSnackBar },
-        { type: MatDialog }
-    ]; };
-    MessageService.ɵprov = ɵɵdefineInjectable({ factory: function MessageService_Factory() { return new MessageService(ɵɵinject(MatSnackBar), ɵɵinject(MatDialog)); }, token: MessageService, providedIn: "root" });
-    MessageService = __decorate([
-        Injectable({
-            providedIn: "root",
-        })
-    ], MessageService);
-    return MessageService;
-}());
-
-var ExportService = /** @class */ (function () {
-    function ExportService() {
-        this.fileType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8';
-        this.fileExtension = '.xlsx';
-    }
-    ExportService.prototype.exportExcel = function (jsonData, fileName) {
-        var ws = utils.json_to_sheet(jsonData);
-        var wb = { Sheets: { 'data': ws }, SheetNames: ['data'] };
-        var excelBuffer = write(wb, { bookType: 'xlsx', type: 'array' });
-        this.saveExcelFile(excelBuffer, fileName);
-    };
-    ExportService.prototype.saveExcelFile = function (buffer, fileName) {
-        var data = new Blob([buffer], { type: this.fileType });
-        saveAs(data, fileName + this.fileExtension);
-    };
-    ExportService.ɵprov = ɵɵdefineInjectable({ factory: function ExportService_Factory() { return new ExportService(); }, token: ExportService, providedIn: "root" });
-    ExportService = __decorate([
-        Injectable({
-            providedIn: 'root'
-        })
-    ], ExportService);
-    return ExportService;
-}());
-
-var Core = /** @class */ (function () {
-    function Core() {
-    }
-    Core.getClone = function (x) {
-        return JSON.parse(JSON.stringify(x));
-    };
-    Core.getNumber = function (value) {
-        if (value == null || value == "") {
-            return 0;
-        }
-        var onlyNumbers = value.replace(/[^\d.-]/g, '');
-        return onlyNumbers;
-    };
-    Core.getFirstDayOfMonth = function () {
-        var date = new Date();
-        return new Date(date.getFullYear(), date.getMonth(), 1);
-    };
-    Core.emailIsValid = function (email) {
-        // return /\S+@\S+\.\S+/.test(email)
-        return false;
-    };
-    Core.isValidUNCPath = function (path) {
-        // return /\\\\([a-zA-Z0-9_.$●-]+)\\([a-zA-Z0-9_.$●-]+).*/.test(path)
-        return false;
-    };
-    Core.isValidDate = function (date) {
-        var parsedDate = Date.parse(date);
-        if (isNaN(date) && !isNaN(parsedDate)) {
-            return true;
-        }
-        else {
-            return false;
-        }
-    };
-    Core.isValidEmailList = function (list) {
-        var e_1, _a;
-        if (list.includes(";")) {
-            var emails = list.split(";");
-            try {
-                for (var emails_1 = __values(emails), emails_1_1 = emails_1.next(); !emails_1_1.done; emails_1_1 = emails_1.next()) {
-                    var email = emails_1_1.value;
-                    if (this.emailIsValid(email) == false) {
-                        return false;
-                    }
-                }
-            }
-            catch (e_1_1) { e_1 = { error: e_1_1 }; }
-            finally {
-                try {
-                    if (emails_1_1 && !emails_1_1.done && (_a = emails_1.return)) _a.call(emails_1);
-                }
-                finally { if (e_1) throw e_1.error; }
-            }
-        }
-        else {
-            if (this.emailIsValid(list) == false) {
-                return false;
-            }
-        }
-        return true;
-    };
-    Core.isNumber = function (value) {
-        return ((value != null) &&
-            (value !== '') &&
-            !isNaN(Number(value.toString())));
-    };
-    Core.getDiff = function (startDate, endDate) {
-        if (endDate === void 0) { endDate = Date(); }
-        var eventStartTime = new Date(startDate);
-        var eventEndTime = new Date(endDate);
-        var milliseconds = eventEndTime.valueOf() - eventStartTime.valueOf();
-        function numberEnding(number) {
-            if (number.toFixed() == '1') {
-                return '';
-            }
-            else {
-                return 's';
-            }
-        }
-        var minutes = (milliseconds / (1000 * 60));
-        var hours = (milliseconds / (1000 * 60 * 60));
-        var days = (milliseconds / (1000 * 60 * 60 * 24));
-        var weeks = (milliseconds / (1000 * 60 * 60 * 24 * 7));
-        var months = (milliseconds / (1000 * 60 * 60 * 24 * 7 * 4));
-        var years = (milliseconds / (1000 * 60 * 60 * 24 * 365));
-        if (years >= 1) {
-            return years.toFixed() + ' year' + numberEnding(years);
-        }
-        else if (months >= 1) {
-            return months.toFixed() + ' month' + numberEnding(months);
-        }
-        else if (weeks >= 1) {
-            return weeks.toFixed() + ' week' + numberEnding(weeks);
-        }
-        else if (days >= 1) {
-            return days.toFixed() + ' day' + numberEnding(days);
-        }
-        else if (hours >= 1) {
-            return hours.toFixed() + ' hour' + numberEnding(hours);
-        }
-        else if (minutes >= 1) {
-            return minutes.toFixed() + ' minute' + numberEnding(minutes);
-        }
-        else if (milliseconds >= (-1000 * 60)) {
-            return 'a minute';
-        }
-        else {
-            return 'N/A';
-        }
-    };
-    Core.nowDate = function (NoTime) {
-        if (NoTime === void 0) { NoTime = false; }
-        if (NoTime) {
-            return this.getFormatedDate(Date(), true);
-        }
-        else {
-            return this.getFormatedDate(Date());
-        }
-    };
-    Core.getFormatedDate = function (dateString, NoTime) {
-        if (NoTime === void 0) { NoTime = false; }
-        var d = new Date(dateString);
-        d.setHours(d.getHours() + 2);
-        if (NoTime == true) {
-            return d.toISOString().split('T')[0];
-        }
-        else {
-            return d.toISOString().split('.')[0];
-        }
-    };
-    Core.getBusinessDatesCount = function (startDate, endDate) {
-        var count = 0;
-        var _startDate = new Date(startDate);
-        var _endDate = new Date(endDate);
-        var curDate = _startDate;
-        while (curDate < _endDate) {
-            var dayOfWeek = curDate.getDay();
-            if (!(dayOfWeek == 6 || dayOfWeek == 0))
-                count++;
-            curDate.setDate(curDate.getDate() + 1);
-        }
-        return count;
-    };
-    Core.nullDate = "01 Jan 1969";
-    return Core;
-}());
-var ApiResponse = /** @class */ (function () {
-    function ApiResponse() {
-    }
-    return ApiResponse;
-}());
-var Constants = /** @class */ (function () {
-    function Constants() {
-    }
-    Constants.AUTH_USER = 'a';
-    Constants.AUTH_NAME = 'b';
-    Constants.AUTH_ROLES = 'c';
-    Constants.AUTH_TOKEN = 'd';
-    Constants.AUTH_TOKEN_EXPIRE = 'e';
-    return Constants;
-}());
-
-var LogLevel;
-(function (LogLevel) {
-    LogLevel[LogLevel["All"] = 0] = "All";
-    LogLevel[LogLevel["Debug"] = 1] = "Debug";
-    LogLevel[LogLevel["Info"] = 2] = "Info";
-    LogLevel[LogLevel["Warn"] = 3] = "Warn";
-    LogLevel[LogLevel["Error"] = 4] = "Error";
-    LogLevel[LogLevel["Fatal"] = 5] = "Fatal";
-    LogLevel[LogLevel["Off"] = 6] = "Off";
-})(LogLevel || (LogLevel = {}));
-var Tile = /** @class */ (function () {
-    function Tile() {
-    }
-    return Tile;
-}());
-var Step = /** @class */ (function () {
-    function Step() {
-    }
-    return Step;
-}());
-var TableConfig = /** @class */ (function () {
-    function TableConfig() {
-        this.enableFilter = false;
-        this.create = new TableCreate();
-        this.greyout = new Condition();
-    }
-    return TableConfig;
-}());
-var TableCreate = /** @class */ (function () {
-    function TableCreate() {
-    }
-    return TableCreate;
-}());
-var TableColumn = /** @class */ (function () {
-    function TableColumn() {
-        this.name = "default";
-        this.display = "default";
-        this.type = TableColumnType.String;
-    }
-    return TableColumn;
-}());
-var TableColumnType;
-(function (TableColumnType) {
-    TableColumnType[TableColumnType["String"] = 0] = "String";
-    TableColumnType[TableColumnType["Date"] = 1] = "Date";
-    TableColumnType[TableColumnType["DateTime"] = 2] = "DateTime";
-    TableColumnType[TableColumnType["Image"] = 3] = "Image";
-    TableColumnType[TableColumnType["Icon"] = 4] = "Icon";
-    TableColumnType[TableColumnType["TextIcon"] = 5] = "TextIcon";
-    TableColumnType[TableColumnType["Chip"] = 6] = "Chip";
-})(TableColumnType || (TableColumnType = {}));
-var Condition = /** @class */ (function () {
-    function Condition() {
-        this.field = "";
-        this.operator = Operator.Equal;
-        this.value = "";
-    }
-    return Condition;
-}());
-var Operator;
-(function (Operator) {
-    Operator[Operator["Equal"] = 0] = "Equal";
-    Operator[Operator["Less"] = 1] = "Less";
-    Operator[Operator["Greater"] = 2] = "Greater";
-    Operator[Operator["NotEqual"] = 3] = "NotEqual";
-})(Operator || (Operator = {}));
-var Color = /** @class */ (function (_super) {
-    __extends(Color, _super);
-    function Color() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    return Color;
-}(Condition));
-var Icon = /** @class */ (function (_super) {
-    __extends(Icon, _super);
-    function Icon() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    return Icon;
-}(Condition));
-var TableAction = /** @class */ (function () {
-    function TableAction() {
-    }
-    return TableAction;
-}());
-var ActionResponse = /** @class */ (function () {
-    function ActionResponse() {
-    }
-    return ActionResponse;
-}());
-var loginConfig = /** @class */ (function () {
-    function loginConfig() {
-        this.appName = "";
-        this.selfService = false;
-        this.logo = "";
-        this.logoSize = "normal";
-    }
-    return loginConfig;
-}());
-var AppConfig = /** @class */ (function () {
-    function AppConfig() {
-        this.appName = "App Name";
-        this.logo = "";
-        this.logoSize = "normal";
-        this.ADAuth = true;
-        this.localAuth = true;
-        this.selfService = false;
-    }
-    return AppConfig;
-}());
-var CapItem = /** @class */ (function () {
-    function CapItem() {
-        this.name = "";
-        this.display = "New Cap Item";
-        this.enabled = false;
-        this.type = "";
-        this.newLine = false;
-        this.showMenu = true;
-        this.ignoreSubsDisplay = false;
-        this.link = "";
-        this.icon = "navigate_next";
-    }
-    return CapItem;
-}());
-var Account = /** @class */ (function () {
-    function Account() {
-    }
-    return Account;
-}());
-var User = /** @class */ (function () {
-    function User() {
-        this.userName = "";
-        this.password = "";
-        this.tries = "0";
-        this.locked = "0";
-        this.logged = "0";
-        this.disabled = "0";
-        this.changepassword = "0";
-        this.dateCreated = Core.nowDate();
-        this.dateUpdated = Core.nowDate();
-        this.token = "";
-        this.dateExpire = Core.nowDate();
-        this.tokenExpire = Core.nowDate();
-        this.authType = "";
-    }
-    return User;
-}());
-var ChangeUserPassword = /** @class */ (function () {
-    function ChangeUserPassword() {
-        this.userName = "";
-        this.currentPassword = "";
-        this.newPassword = "";
-        this.confirmPassword = "";
-    }
-    return ChangeUserPassword;
-}());
-var Register = /** @class */ (function () {
-    function Register() {
-        this.userName = "";
-        this.roleID = 1;
-        this.firstName = "";
-        this.lastName = "";
-        this.email = "";
-        this.authType = "";
-        this.password = "";
-    }
-    return Register;
-}());
-var Profile = /** @class */ (function () {
-    function Profile() {
-        this.profileID = "";
-        this.userName = "";
-        this.roleID = 1;
-        this.firstName = "";
-        this.lastName = "";
-        this.email = "";
-        this.empID = "";
-        this.arID = "0";
-        this.authType = "";
-        this.password = "";
-        this.role = new Role();
-    }
-    return Profile;
-}());
-var Role = /** @class */ (function () {
-    function Role() {
-        this.roleID = 0;
-        this.roleName = "New Role";
-        this.cap1 = false;
-        this.cap2 = false;
-        this.cap3 = false;
-        this.cap4 = false;
-        this.cap5 = false;
-        this.cap6 = false;
-        this.cap7 = false;
-        this.cap8 = false;
-        this.cap9 = false;
-        this.cap10 = false;
-        this.cap11 = false;
-        this.cap12 = false;
-        this.cap13 = false;
-        this.cap14 = false;
-        this.cap15 = false;
-        this.cap16 = false;
-        this.cap17 = false;
-        this.cap18 = false;
-        this.cap19 = false;
-        this.cap20 = false;
-        this.cap21 = false;
-        this.cap22 = false;
-        this.cap23 = false;
-        this.cap24 = false;
-        this.cap25 = false;
-        this.cap26 = false;
-        this.cap27 = false;
-        this.cap28 = false;
-        this.cap29 = false;
-        this.cap30 = false;
-        this.cap31 = false;
-        this.cap32 = false;
-        this.cap33 = false;
-        this.cap34 = false;
-        this.cap35 = false;
-        this.cap36 = false;
-        this.cap37 = false;
-        this.cap38 = false;
-        this.cap39 = false;
-        this.cap40 = false;
-        this.cap41 = false;
-        this.cap42 = false;
-        this.cap43 = false;
-        this.cap44 = false;
-        this.cap45 = false;
-        this.cap46 = false;
-        this.cap47 = false;
-        this.cap48 = false;
-        this.cap49 = false;
-        this.cap50 = false;
-        this.cap51 = false;
-        this.cap52 = false;
-        this.cap53 = false;
-        this.cap54 = false;
-        this.cap55 = false;
-        this.cap56 = false;
-        this.cap57 = false;
-        this.cap58 = false;
-        this.cap59 = false;
-        this.cap60 = false;
-        this.cap61 = false;
-        this.cap62 = false;
-        this.cap63 = false;
-        this.cap64 = false;
-        this.cap65 = false;
-        this.cap66 = false;
-        this.cap67 = false;
-        this.cap68 = false;
-        this.cap69 = false;
-        this.cap70 = false;
-        this.cap71 = false;
-        this.cap72 = false;
-        this.cap73 = false;
-        this.cap74 = false;
-        this.cap75 = false;
-        this.cap76 = false;
-        this.cap77 = false;
-        this.cap78 = false;
-        this.cap79 = false;
-        this.cap80 = false;
-        this.cap81 = false;
-        this.cap82 = false;
-        this.cap83 = false;
-        this.cap84 = false;
-        this.cap85 = false;
-        this.cap86 = false;
-        this.cap87 = false;
-        this.cap88 = false;
-        this.cap89 = false;
-        this.cap90 = false;
-        this.cap91 = false;
-        this.cap92 = false;
-        this.cap93 = false;
-        this.cap94 = false;
-        this.cap95 = false;
-        this.cap96 = false;
-        this.cap97 = false;
-        this.cap98 = false;
-        this.cap99 = false;
-        this.cap100 = false;
-    }
-    return Role;
-}());
-
-var LogService = /** @class */ (function () {
-    function LogService() {
-        this.level = LogLevel.All;
-        this.logToConsole = true;
-        this.logToApi = false;
-    }
-    LogService.prototype.debug = function (msg) {
-        var optionalParams = [];
-        for (var _i = 1; _i < arguments.length; _i++) {
-            optionalParams[_i - 1] = arguments[_i];
-        }
-        this.writeToLog(msg, LogLevel.Debug, optionalParams);
-    };
-    LogService.prototype.info = function (msg) {
-        var optionalParams = [];
-        for (var _i = 1; _i < arguments.length; _i++) {
-            optionalParams[_i - 1] = arguments[_i];
-        }
-        this.writeToLog(msg, LogLevel.Info, optionalParams);
-    };
-    LogService.prototype.warn = function (msg) {
-        var optionalParams = [];
-        for (var _i = 1; _i < arguments.length; _i++) {
-            optionalParams[_i - 1] = arguments[_i];
-        }
-        this.writeToLog(msg, LogLevel.Warn, optionalParams);
-    };
-    LogService.prototype.error = function (msg) {
-        var optionalParams = [];
-        for (var _i = 1; _i < arguments.length; _i++) {
-            optionalParams[_i - 1] = arguments[_i];
-        }
-        this.writeToLog(msg, LogLevel.Error, optionalParams);
-    };
-    LogService.prototype.fatal = function (msg) {
-        var optionalParams = [];
-        for (var _i = 1; _i < arguments.length; _i++) {
-            optionalParams[_i - 1] = arguments[_i];
-        }
-        this.writeToLog(msg, LogLevel.Fatal, optionalParams);
-    };
-    LogService.prototype.log = function (msg) {
-        var optionalParams = [];
-        for (var _i = 1; _i < arguments.length; _i++) {
-            optionalParams[_i - 1] = arguments[_i];
-        }
-        this.writeToLog(msg, LogLevel.All, optionalParams);
-    };
-    LogService.prototype.writeToLog = function (msg, level, params) {
-        if (this.shouldLog(level)) {
-            // Build log string
-            var value = Core.getFormatedDate(Date(), false).replace("T", " ");
-            // value += " - Type: " + LogLevel[this.level];
-            value += " - Message: " + msg;
-            if (params.length) {
-                value += " - Extra Info: " + this.formatParams(params);
-            }
-            // Log the value
-            if (this.logToConsole) {
-                console.log(value);
-            }
-            if (this.logToApi) {
-                //Call API post
-            }
-        }
-    };
-    LogService.prototype.formatParams = function (params) {
-        var e_1, _a;
-        var ret = params.join(",");
-        // Is there at least one object in the array?
-        if (params.some(function (p) { return typeof p == "object"; })) {
-            ret = "";
-            try {
-                // Build comma-delimited string
-                for (var params_1 = __values(params), params_1_1 = params_1.next(); !params_1_1.done; params_1_1 = params_1.next()) {
-                    var item = params_1_1.value;
-                    ret += JSON.stringify(item) + ",";
-                }
-            }
-            catch (e_1_1) { e_1 = { error: e_1_1 }; }
-            finally {
-                try {
-                    if (params_1_1 && !params_1_1.done && (_a = params_1.return)) _a.call(params_1);
-                }
-                finally { if (e_1) throw e_1.error; }
-            }
-        }
-        return ret;
-    };
-    LogService.prototype.shouldLog = function (level) {
-        var ret = false;
-        if ((level >= this.level && level !== LogLevel.Off) ||
-            this.level === LogLevel.All) {
-            ret = true;
-        }
-        return ret;
-    };
-    LogService.ɵprov = ɵɵdefineInjectable({ factory: function LogService_Factory() { return new LogService(); }, token: LogService, providedIn: "root" });
-    LogService = __decorate([
-        Injectable({
-            providedIn: "root",
-        })
-    ], LogService);
-    return LogService;
-}());
-
-var HttpService = /** @class */ (function () {
-    function HttpService(httpClient, router) {
-        this.httpClient = httpClient;
-        this.router = router;
-        //----Set apiUrl from the data service of the project---//
-        this.apiUrl = "https://api.solinc.co.zw/"; //default
-        this.httpOptions_Legacy = {
-            headers: new HttpHeaders({
-                Accept: "application/json",
-                "Content-Type": "application/json",
-                Authorization: "Basic " + btoa("emptyUser:emptyToken"),
-            }),
-            resposeType: "json",
-        };
-        this.httpOptions_Files = {
-            headers: new HttpHeaders({
-                Authorization: "Basic " + btoa("tnyagato:j5Toszfr@ys"),
-            }),
-            resposeType: "json",
-        };
-    }
-    //POST
-    HttpService.prototype.Post = function (service, data) {
-        return this.httpClient.post(this.apiUrl + service, data, this.httpOptions_Legacy);
-    };
-    //PUT
-    HttpService.prototype.Put = function (service, data) {
-        return this.httpClient.put(this.apiUrl + service, data, this.httpOptions_Legacy);
-    };
-    //POST RAW
-    HttpService.prototype.Post_Raw = function (url, data) {
-        return this.httpClient.post(url, data, this.httpOptions_Legacy);
-    };
-    //POST with file
-    HttpService.prototype.Post_WithFile = function (service, data, file) {
-        var formData = new FormData();
-        if (file) {
-            formData.append("uploadFile", file, file.name);
-        }
-        formData.append("data", JSON.stringify(data));
-        return this.httpClient.post(this.apiUrl + service, formData, this.httpOptions_Files);
-    };
-    //  //POST with files
-    HttpService.prototype.Post_FormData = function (service, formData) {
-        return this.httpClient.post(this.apiUrl + service, formData, this.httpOptions_Files);
-    };
-    //GET
-    HttpService.prototype.Get = function (service) {
-        return this.httpClient.get(this.apiUrl + service, this.httpOptions_Legacy);
-    };
-    //Get RAW
-    HttpService.prototype.Get_Raw = function (url) {
-        return this.httpClient.get(url, this.httpOptions_Legacy);
-    };
-    //ERROR
-    HttpService.prototype.Error = function (error) {
-        if (error.statusText == "Unauthorized") {
-            this.router.navigate(["login"]);
-            return "Unauthorized";
-        }
-        else {
-            return "Connection failed";
-        }
-    };
-    HttpService.ctorParameters = function () { return [
-        { type: HttpClient },
-        { type: Router }
-    ]; };
-    HttpService.ɵprov = ɵɵdefineInjectable({ factory: function HttpService_Factory() { return new HttpService(ɵɵinject(HttpClient), ɵɵinject(Router)); }, token: HttpService, providedIn: "root" });
-    HttpService = __decorate([
-        Injectable({
-            providedIn: "root",
-        })
-    ], HttpService);
-    return HttpService;
-}());
-
-var AuthService = /** @class */ (function () {
-    function AuthService(_route, storage, router, httpService, messageService, logService) {
-        this._route = _route;
-        this.storage = storage;
-        this.router = router;
-        this.httpService = httpService;
-        this.messageService = messageService;
-        this.logService = logService;
-        //Logged in
-        this.loggedin = false;
-        this.loggedinSource = new BehaviorSubject(this.loggedin);
-        this.loggedinObserv = this.loggedinSource.asObservable();
-        //Token
-        this.token = "";
-        this.tokenSource = new BehaviorSubject(this.token);
-        this.tokenObserv = this.tokenSource.asObservable();
-        //TokenExpire
-        this.tokenExpire = "";
-        this.tokenExpireSource = new BehaviorSubject(this.tokenExpire);
-        this.tokenExpireObserv = this.tokenExpireSource.asObservable();
-        //Current User
-        this.currentUser = "tnyagato";
-        this.currentUserSource = new BehaviorSubject(this.currentUser);
-        this.currentUserObserv = this.currentUserSource.asObservable();
-        //Line Manager
-        this.islineManager = false;
-        this.isLineManagerSource = new BehaviorSubject(this.islineManager);
-        this.isLineManagerObserv = this.isLineManagerSource.asObservable();
-        //Roles
-        this.currentRole = new Role;
-        this.currentRoleSource = new BehaviorSubject(this.currentRole);
-        this.myRoleObserv = this.currentRoleSource.asObservable();
-        //Logged in FirstName
-        this.loggedUserSource = new BehaviorSubject("tnyagato");
-        this.loggedUserFullName = this.loggedUserSource.asObservable();
-    }
-    AuthService.prototype.Updateloggedin = function (loggedin) {
-        this.loggedinSource.next(loggedin);
-        this.loggedin = loggedin;
-    };
-    AuthService.prototype.UpdateToken = function (newToken) {
-        this.tokenSource.next(newToken);
-    };
-    AuthService.prototype.UpdateTokenExpire = function (newTokenExpire) {
-        this.tokenExpireSource.next(newTokenExpire);
-    };
-    AuthService.prototype.UpdateCurrentUser = function (newUser) {
-        this.currentUserSource.next(newUser.toLocaleLowerCase());
-        this.currentUser = newUser.toLocaleLowerCase();
-    };
-    AuthService.prototype.UpdateIsLineManager = function (manager) {
-        this.isLineManagerSource.next(manager);
-    };
-    AuthService.prototype.UpdateRole = function (role) {
-        this.currentRoleSource.next(role);
-    };
-    AuthService.prototype.updateLoggedUserFullName = function (userName) {
-        this.loggedUserSource.next(userName);
-    };
-    //Authorisation
-    AuthService.prototype.isAuthorised = function (capName) {
-        if (!this.currentRoleSource.value[capName]) {
-            // this.logService.info(`authorise: ${this.currentRoleSource.value.roleName} not authorised for ${capName}`);
-            this.router.navigate(["home"]);
-            this.messageService.toast("Unauthorised: " + capName);
-            return false;
-        }
-        else {
-            return true;
-        }
-    };
-    AuthService.prototype.isValidToken = function () {
-        var tokenExpire = new Date(this.tokenExpireSource.value);
-        var nowDate = new Date();
-        var valid = tokenExpire > nowDate;
-        if (!valid) {
-            this.router.navigate(["login"]);
-            this.messageService.toast("Expired Session");
-        }
-        return valid;
-    };
-    AuthService.prototype.canActivate = function () {
-        var _this = this;
-        if (this.loggedin && this.isValidToken()) {
-            // this.logService.info("authentication: logged in");
-            return true;
-        }
-        if (localStorage.getItem(Constants.AUTH_USER) === null) {
-            // this.logService.info("authentication: not logged and no cache");
-            this.Updateloggedin(false);
-            var url = new URL(window.location.href);
-            var path = url.hash.replace("#/", "");
-            this.router.navigate(["login"], {
-                relativeTo: this._route,
-                queryParams: { redirectTo: path },
-                queryParamsHandling: 'merge',
-                skipLocationChange: false
-            });
-            return false;
-        }
-        else {
-            // this.logService.info("authentication: not logged but allowed login");
-            this.Updateloggedin(true);
-            this.storage.get(Constants.AUTH_USER).then(function (resp) {
-                _this.UpdateCurrentUser(resp);
-            });
-            this.storage.get(Constants.AUTH_NAME).then(function (resp) {
-                _this.updateLoggedUserFullName(resp);
-            });
-            this.storage.get(Constants.AUTH_ROLES).then(function (resp) {
-                var ret = JSON.parse(resp);
-                _this.UpdateRole(ret);
-            });
-            this.storage.get(Constants.AUTH_TOKEN).then(function (resp) {
-                _this.UpdateToken(resp);
-            });
-            this.storage.get(Constants.AUTH_TOKEN_EXPIRE).then(function (resp) {
-                _this.UpdateTokenExpire(resp);
-                _this.isValidToken();
-            });
-            return true;
-        }
-    };
-    AuthService.ctorParameters = function () { return [
-        { type: ActivatedRoute },
-        { type: StorageService },
-        { type: Router },
-        { type: HttpService },
-        { type: MessageService },
-        { type: LogService }
-    ]; };
-    AuthService.ɵprov = ɵɵdefineInjectable({ factory: function AuthService_Factory() { return new AuthService(ɵɵinject(ActivatedRoute), ɵɵinject(StorageService), ɵɵinject(Router), ɵɵinject(HttpService), ɵɵinject(MessageService), ɵɵinject(LogService)); }, token: AuthService, providedIn: "root" });
-    AuthService = __decorate([
-        Injectable({
-            providedIn: 'root'
-        })
-    ], AuthService);
-    return AuthService;
-}());
-
-var DataServiceLib = /** @class */ (function () {
-    function DataServiceLib(httpService) {
-        this.httpService = httpService;
-        this.appConfig = new AppConfig();
-        this.appConfigSource = new BehaviorSubject(this.appConfig);
-        this.appConfigObserv = this.appConfigSource.asObservable();
-        // caps: CapItem[];
-        this.capHome = new CapItem;
-        this.capAdmin = new CapItem;
-        this.capUsers = new CapItem;
-        this.capRoles = new CapItem;
-        this.capLogs = new CapItem;
-        this.capSettings = new CapItem;
-        this.tmpProfileuserName = "";
-        this.appConfig.appName = "App-Name";
-        this.appConfig.logo = "./assets/logo.png";
-        this.appConfig.ADAuth = true;
-        this.appConfig.capItems = [this.capAdmin, this.capHome];
-        this.capHome.name = "cap1";
-        this.capHome.display = "Home";
-        this.capHome.link = "home";
-        this.capAdmin.name = "cap2";
-        this.capAdmin.display = "Admin";
-        this.capAdmin.capSubItems = [this.capUsers, this.capRoles, this.capLogs, this.capSettings];
-        this.capUsers.name = "cap3";
-        this.capUsers.display = "Users";
-        this.capUsers.link = "home/admin/users";
-        this.capRoles.name = "cap4";
-        this.capRoles.display = "Roles";
-        this.capRoles.link = "home/admin/roles";
-        this.capLogs.name = "cap5";
-        this.capLogs.display = "Logs";
-        this.capLogs.link = "home/admin/logs";
-        this.capSettings.name = "cap6";
-        this.capSettings.display = "Settings";
-        this.capSettings.link = "home/admin/settings";
-    }
-    DataServiceLib.prototype.UpdateAppConfig = function (config) {
-        this.appConfigSource.next(config);
-        this.appConfig = config;
-    };
-    //Users
-    DataServiceLib.prototype.GetUser = function () {
-        return this.httpService.Get("User/all/x");
-    };
-    DataServiceLib.prototype.RegisterAccount = function (u) {
-        return this.httpService.Post("User/register", u);
-    };
-    DataServiceLib.prototype.GetUserByID = function (val) {
-        return this.httpService.Get("User/id/" + val);
-    };
-    DataServiceLib.prototype.UpdateUser = function (profile) {
-        return this.httpService.Post("User/edit", profile);
-    };
-    DataServiceLib.prototype.UnlockUser = function (user) {
-        return this.httpService.Post("User/unlock", user);
-    };
-    DataServiceLib.prototype.LockUser = function (user) {
-        return this.httpService.Post("User/lock", user);
-    };
-    DataServiceLib.prototype.DeleteUser = function (user) {
-        return this.httpService.Post("User/delete", user);
-    };
-    DataServiceLib.prototype.Login = function (u) {
-        return this.httpService.Post("User/login", u);
-    };
-    DataServiceLib.prototype.ChangePassword = function (u) {
-        return this.httpService.Post("User/changepassword-self", u);
-    };
-    DataServiceLib.prototype.ChangePasswordAdmin = function (u) {
-        return this.httpService.Post("User/changepassword-admin", u);
-    };
-    DataServiceLib.prototype.SelfReset = function (u) {
-        return this.httpService.Post("Basic/SelfReset", u);
-    };
-    //Roles
-    DataServiceLib.prototype.PostRole = function (role, action) {
-        return this.httpService.Post("Role?action=" + action, role);
-    };
-    DataServiceLib.prototype.PutRole = function (role) {
-        return this.httpService.Put("Role", role);
-    };
-    DataServiceLib.prototype.GetRole = function (by, val) {
-        return this.httpService.Get("Role/all/x");
-    };
-    //Logs
-    DataServiceLib.prototype.GetLog = function (by, val) {
-        return this.httpService.Get("Log/all/x");
-    };
-    //Settings
-    DataServiceLib.prototype.GetSetting = function (by, val) {
-        return this.httpService.Get("Setting/all/x");
-    };
-    DataServiceLib.prototype.UpdateSetting = function (setting, action) {
-        return this.httpService.Post("Setting?action=" + action, setting);
-    };
-    DataServiceLib.ctorParameters = function () { return [
-        { type: HttpService }
-    ]; };
-    DataServiceLib.ɵprov = ɵɵdefineInjectable({ factory: function DataServiceLib_Factory() { return new DataServiceLib(ɵɵinject(HttpService)); }, token: DataServiceLib, providedIn: "root" });
-    DataServiceLib = __decorate([
-        Injectable({
-            providedIn: 'root'
-        })
-    ], DataServiceLib);
-    return DataServiceLib;
-}());
-
-var LoaderService = /** @class */ (function () {
-    function LoaderService() {
-        this.isLoading = new BehaviorSubject(false);
-    }
-    LoaderService.ɵprov = ɵɵdefineInjectable({ factory: function LoaderService_Factory() { return new LoaderService(); }, token: LoaderService, providedIn: "root" });
-    LoaderService = __decorate([
-        Injectable({
-            providedIn: 'root'
-        })
-    ], LoaderService);
-    return LoaderService;
-}());
-
-var LoaderComponent = /** @class */ (function () {
-    function LoaderComponent(loaderService) {
-        var _this = this;
-        this.loaderService = loaderService;
-        this.logo = "";
-        this.loaderService.isLoading.subscribe(function (v) {
-            _this.loading = v;
-        });
-    }
-    LoaderComponent.prototype.ngOnInit = function () {
-    };
-    LoaderComponent.ctorParameters = function () { return [
-        { type: LoaderService }
-    ]; };
-    __decorate([
-        Input()
-    ], LoaderComponent.prototype, "logo", void 0);
-    LoaderComponent = __decorate([
-        Component({
-            selector: 'spa-loader',
-            template: "<div class=\"progress-loader\" style=\"z-index: 9999;\" [hidden]=\"!loading\">\r\n  <div class=\"loading-spinner\">\r\n\r\n      <img *ngIf=\"logo==''\" style=\"width: 100px;\"\r\n      src=\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg==\"\r\n\r\n      >\r\n\r\n      <img *ngIf=\"logo!=''\" [src]=\"logo\" style=\"width: 100px;\" />\r\n\r\n\r\n      <span id=\"loadingMessage\" class=\"loading-message\">Please wait...</span>\r\n  </div>\r\n</div>\r\n",
-            styles: [".loading-spinner{background-color:#0000001f;position:absolute;width:100%;top:0;left:0;height:100vh;align-items:center;justify-content:center;display:-ms-grid;display:grid}.loading-spinner img{-ms-grid-row-align:end;align-self:end}.loading-message{text-align:center;-ms-grid-row-align:start;align-self:start}"]
-        })
-    ], LoaderComponent);
-    return LoaderComponent;
-}());
-
-var ɵ0 = { disableClose: true, hasBackdrop: true };
-var SpaMatModule = /** @class */ (function () {
-    function SpaMatModule() {
-    }
-    SpaMatModule = __decorate([
-        NgModule({
-            declarations: [],
-            imports: [],
-            exports: [
-                CommonModule, FormsModule, ReactiveFormsModule,
-                MatMenuModule, MatSliderModule, MatTableModule, MatPaginatorModule,
-                MatCheckboxModule, MatBadgeModule, MatButtonModule, MatIconModule, MatDialogModule, MatSnackBarModule,
-                MatTabsModule, MatFormFieldModule, MatInputModule, MatCardModule, MatChipsModule, MatSelectModule,
-                MatNativeDateModule, MatProgressSpinnerModule, MatListModule, MatAutocompleteModule, MatTooltipModule, MatSortModule,
-                MatDatepickerModule, MatStepperModule, MatRadioModule,
-            ],
-            providers: [
-                { provide: MAT_DIALOG_DEFAULT_OPTIONS, useValue: ɵ0 },
-                { provide: MAT_DATE_LOCALE, useValue: "en-GB" },
-            ]
-        })
-    ], SpaMatModule);
-    return SpaMatModule;
-}());
-
-var LoaderInterceptor = /** @class */ (function () {
-    function LoaderInterceptor(loaderService, messageService, authService, router, logService) {
-        this.loaderService = loaderService;
-        this.messageService = messageService;
-        this.authService = authService;
-        this.router = router;
-        this.logService = logService;
-        this.requests = [];
-    }
-    LoaderInterceptor.prototype.removeRequest = function (req) {
-        var i = this.requests.indexOf(req);
-        if (i >= 0) {
-            this.requests.splice(i, 1);
-        }
-        this.loaderService.isLoading.next(this.requests.length > 0);
-    };
-    LoaderInterceptor.prototype.intercept = function (request, next) {
-        var _this = this;
-        var requestClone = request.clone({
-            setHeaders: {
-                Authorization: "Bearer " + this.authService.tokenSource.value
-            }
-        });
-        this.requests.push(requestClone);
-        if (this.requests.length > 1) {
-            this.logService.info("Multiple connections detected > " + this.requests.length);
-        }
-        this.loaderService.isLoading.next(true);
-        return Observable.create(function (observer) {
-            var subscription = next.handle(requestClone).subscribe(function (event) {
-                if (event instanceof HttpResponse) {
-                    _this.removeRequest(requestClone);
-                    observer.next(event);
-                }
-            }, function (error) {
-                _this.removeRequest(requestClone);
-                observer.error(error);
-                if (error.status === 401) {
-                    _this.router.navigate(["login"]);
-                    _this.messageService.toast('Unauthorised: Please login again');
-                }
-                else if (error.status === 500) {
-                    console.log(error.error);
-                    _this.messageService.toast('System Error');
-                }
-                else if (error.statusText == 'Unknown Error') {
-                    _this.messageService.toast('Connection Error');
-                }
-                else {
-                    _this.messageService.toast('Error: ' + error.statusText);
-                }
-            }, function () {
-                _this.removeRequest(requestClone);
-                observer.complete();
-            });
-            // remove request from queue when cancelled
-            return function () {
-                _this.removeRequest(requestClone);
-                subscription.unsubscribe();
-            };
-        });
-    };
-    LoaderInterceptor.ctorParameters = function () { return [
-        { type: LoaderService },
-        { type: MessageService },
-        { type: AuthService },
-        { type: Router },
-        { type: LogService }
-    ]; };
-    LoaderInterceptor = __decorate([
-        Injectable()
-    ], LoaderInterceptor);
-    return LoaderInterceptor;
-}());
-
-var TinSpaComponent = /** @class */ (function () {
-    function TinSpaComponent() {
-    }
-    TinSpaComponent.prototype.ngOnInit = function () {
-    };
-    TinSpaComponent = __decorate([
-        Component({
-            selector: 'lib-tin-spa',
-            template: "\n    <p>\n      tin-spa works!\n    </p>\n  "
-        })
-    ], TinSpaComponent);
-    return TinSpaComponent;
-}());
-
-var NavMenuComponent = /** @class */ (function () {
-    function NavMenuComponent(router, authService) {
-        this.router = router;
-        this.authService = authService;
-        this.isExpanded = false;
-        this.appConfig = new AppConfig();
-    }
-    NavMenuComponent.prototype.ngOnInit = function () {
-        var _this = this;
-        this.authService.loggedUserFullName.subscribe(function (user) { return _this.loggedUserFullName = user; });
-        this.authService.myRoleObserv.subscribe(function (rol) { return _this.myRole = rol; });
-        this.authService.loggedinObserv.subscribe(function (obj) { return _this.loggedin = obj; });
-    };
-    NavMenuComponent.prototype.collapse = function () {
-        this.isExpanded = false;
-    };
-    NavMenuComponent.prototype.toggle = function () {
-        this.isExpanded = !this.isExpanded;
-    };
-    // logoff() {
-    //   // this.authService.updateloggedin(false);
-    //   // this.authService.updateRole(new Role());
-    //   this.router.navigate(["login"]);
-    //   // this.storageService.clear();
-    // }
-    NavMenuComponent.prototype.redirectTo = function (link) {
-        if (link != "") {
-            this.router.navigate([link]);
-        }
-    };
-    NavMenuComponent.ctorParameters = function () { return [
-        { type: Router },
-        { type: AuthService }
-    ]; };
-    __decorate([
-        Input()
-    ], NavMenuComponent.prototype, "appConfig", void 0);
-    NavMenuComponent = __decorate([
-        Component({
-            selector: 'spa-nav-menu',
-            template: "<header *ngIf=\"loggedin\">\r\n  <nav class=\"toolbar navbar navbar-expand-sm navbar-toggleable-sm navbar-light  border-bottom box-shadow mb-3 \" style=\"padding-right: 10px;\">\r\n    <div class=\"container-fluid\" style=\"padding-right: 0px;\">\r\n      <!--<a class=\"navbar-brand\" [routerLink]=\"['/']\">Orbit</a>-->\r\n\r\n      <img *ngIf=\"appConfig.logo!=''\" [src]=\"appConfig.logo\" style=\"height: 50px; margin-right: 2em\" />\r\n\r\n\r\n      <div style=\"font-size: 20px;\">\r\n        {{appConfig.appName}}\r\n      </div>\r\n\r\n\r\n      <button class=\"navbar-toggler\"\r\n              type=\"button\"\r\n              data-toggle=\"collapse\"\r\n              data-target=\".navbar-collapse\"\r\n              aria-label=\"Toggle navigation\"\r\n              [attr.aria-expanded]=\"isExpanded\"\r\n              (click)=\"toggle()\">\r\n        <span class=\"navbar-toggler-icon\"></span>\r\n      </button>\r\n\r\n      <div *ngIf=\"myRole\" class=\"navbar-collapse collapse d-sm-inline-flex flex-sm-row-reverse stack-top\" style=\"margin-right: 0px;\" [ngClass]=\"{ show: isExpanded }\" >\r\n\r\n        <button mat-icon-button (click)=\"redirectTo('login')\"> <mat-icon>logout</mat-icon> </button>\r\n\r\n        <button id=\"btnUser\" mat-button [matMenuTriggerFor]=\"profileMenu\" style=\"margin-left:2em\"><mat-icon>account_circle</mat-icon>  &nbsp;{{loggedUserFullName}}</button>\r\n\r\n        <mat-menu #profileMenu=\"matMenu\">\r\n          <button id=\"btnProfile\" mat-menu-item (click)=\"redirectTo('home/user/profile')\" >Profile</button>\r\n          <button id=\"btnLogOff\" mat-menu-item (click)=\"redirectTo('login')\">Log Off</button>\r\n        </mat-menu>\r\n\r\n          <div *ngFor=\"let item of appConfig.capItems\">\r\n\r\n            <!-- Menu Item -->\r\n            <button id=\"btnMenu\" *ngIf=\"myRole[item.name] && !item.capSubItems && item.showMenu\" mat-button (click)=\"redirectTo(item.link)\">{{item.display}}</button>\r\n\r\n            <!-- Menu Item with Sub items ignored -->\r\n            <button id=\"btnMenu\" *ngIf=\"myRole[item.name] && item.capSubItems && item.showMenu && item.ignoreSubsDisplay\" mat-button (click)=\"redirectTo(item.link)\">{{item.display}}</button>\r\n\r\n            <!-- Menu Item with Sub items to display-->\r\n            <button id=\"btnMenu\" *ngIf=\"myRole[item.name] && item.capSubItems && item.showMenu && !item.ignoreSubsDisplay\" mat-button [matMenuTriggerFor]=\"adminMenu\">{{item.display}}</button>\r\n\r\n\r\n            <!-- Sub Menu Items -->\r\n            <mat-menu #adminMenu=\"matMenu\">\r\n\r\n              <div *ngFor=\"let subItem of item.capSubItems\">\r\n\r\n                <button *ngIf=\"myRole[subItem.name] && subItem.showMenu\" mat-menu-item (click)=\"redirectTo(subItem.link)\">{{subItem.display}}</button>\r\n\r\n              </div>\r\n\r\n            </mat-menu>\r\n\r\n          </div>\r\n\r\n        </div>\r\n\r\n\r\n      </div>\r\n\r\n  </nav>\r\n</header>\r\n",
-            styles: ["a.navbar-brand{white-space:normal;text-align:center;word-break:break-all}html{font-size:14px}@media (min-width:768px){html{font-size:16px}}.box-shadow{box-shadow:0 .25rem .75rem rgba(0,0,0,.05)}.toolbar{height:60px;display:flex;align-items:center;background-color:#03a;color:#fff;font-weight:600}.stack-top{z-index:9;margin:20px}"]
-        })
-    ], NavMenuComponent);
-    return NavMenuComponent;
-}());
-
-var TimeoutComponent = /** @class */ (function () {
-    function TimeoutComponent(idle, keepalive, authService, router) {
-        var _this = this;
-        this.idle = idle;
-        this.keepalive = keepalive;
-        this.authService = authService;
-        this.router = router;
-        this.loggedin = false;
-        this.idleState = 'Not started.';
-        this.timedOut = false;
-        this.lastPing = null;
-        this.isWarning = false;
-        this.authService.loggedinObserv.subscribe(function (obj) {
-            _this.loggedin = obj;
-            // if (this.loggedin){
-            //   this.startWatch();
-            // }else{
-            //   this.stopWatch();
-            // }
-        });
-        // sets an idle timeout of 5 seconds, for testing purposes.
-        idle.setIdle(900);
-        // sets a timeout period of 5 seconds. after 10 seconds of inactivity, the user will be considered timed out.
-        idle.setTimeout(10);
-        // sets the default interrupts, in this case, things like clicks, scrolls, touches to the document
-        idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);
-        idle.onIdleStart.subscribe(function () {
-            _this.idleState = 'You\'ve gone idle!';
-        });
-        idle.onIdleEnd.subscribe(function () {
-            _this.idleState = 'No longer idle.';
-            _this.isWarning = false;
-        });
-        idle.onTimeoutWarning.subscribe(function (countdown) {
-            _this.idleState = 'You will be signed out in ' + countdown + ' seconds!';
-            if (_this.loggedin) {
-                _this.isWarning = true;
-            }
-        });
-        idle.onTimeout.subscribe(function () {
-            _this.idleState = 'Timed out!';
-            _this.timedOut = true;
-            //action
-            _this.stopWatch();
-        });
-        // sets the ping interval to 15 seconds
-        keepalive.interval(15);
-        keepalive.onPing.subscribe(function () {
-            _this.lastPing = new Date();
-        });
-        this.startWatch();
-    }
-    TimeoutComponent.prototype.ngOnInit = function () {
-    };
-    TimeoutComponent.prototype.startWatch = function () {
-        this.idle.watch();
-        this.idleState = 'Started.';
-        this.timedOut = false;
-        this.isWarning = false;
-    };
-    TimeoutComponent.prototype.stopWatch = function () {
-        this.idle.stop();
-        this.isWarning = false;
-        this.router.navigate(['login']);
-    };
-    TimeoutComponent.prototype.using = function () {
-        //remove message and continue
-        this.isWarning = false;
-    };
-    TimeoutComponent.ctorParameters = function () { return [
-        { type: Idle },
-        { type: Keepalive },
-        { type: AuthService },
-        { type: Router }
-    ]; };
-    TimeoutComponent = __decorate([
-        Component({
-            selector: 'spa-timeout',
-            template: "\r\n<div class=\"loading-spinner\" [hidden]=\"!isWarning\" >\r\n\r\n  <div style=\"width: 500px; text-align: center;\">\r\n\r\n\r\n\r\n  <div class=\"row\">\r\n    <div class=\"col\">\r\n      <img style=\"width: 100px;\"\r\n        src=\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg==\">\r\n    </div>\r\n  </div>\r\n\r\n  <mat-card class=\"mat-elevation-z3\" >\r\n\r\n    <mat-card-header>\r\n\r\n     <h5>Are you still there ?</h5>\r\n\r\n    </mat-card-header>\r\n\r\n    <mat-card-content>\r\n\r\n      <br>\r\n     <span>{{idleState}}</span>\r\n\r\n     <br>\r\n\r\n    </mat-card-content>\r\n\r\n    <mat-card-actions>\r\n\r\n      <div class=\"row justify-content-around\">\r\n\r\n        <div class=\"col-2\">\r\n          <button  style=\"width: 100px;\" mat-stroked-button color=\"primary\" (click)=\"using()\">Yes</button>\r\n        </div>\r\n\r\n        <div class=\"col-4\">\r\n          <button  style=\"width: 100px;\" mat-stroked-button color=\"primary\" (click)=\"stopWatch()\">No</button>\r\n        </div>\r\n\r\n      </div>\r\n\r\n    </mat-card-actions>\r\n\r\n  </mat-card>\r\n\r\n\r\n</div>\r\n\r\n</div>\r\n",
-            styles: [".loading-spinner{background-color:#0000001f;position:absolute;width:100%;top:0;left:0;height:100vh;align-items:center;justify-content:center;display:-ms-grid;display:grid}.loading-spinner img{-ms-grid-row-align:end;align-self:end}.loading-message{text-align:center;-ms-grid-row-align:start;align-self:start}"]
-        })
-    ], TimeoutComponent);
-    return TimeoutComponent;
-}());
-
-var TableComponent = /** @class */ (function () {
-    function TableComponent() {
-        this.dataChange = new EventEmitter();
-        this.buttonClick = new EventEmitter();
-        this.loadClick = new EventEmitter();
-        this.createClick = new EventEmitter();
-        this.colType = TableColumnType;
-        this.op = Operator;
-        this.displayedColumns = [];
-        this._filterText = "";
-    }
-    TableComponent.prototype.ngOnInit = function () {
-        var _this = this;
-        this.config.columns.forEach(function (element) {
-            _this.displayedColumns.push(element.name);
-        });
-        this.displayedColumns.push("Action");
-        this.styleString = "width: " + 50 * this.config.actions.length + "px";
-    };
-    TableComponent.prototype.ngOnChanges = function () {
-        this.data = new MatTableDataSource(this.data);
-        this.data.paginator = this.tablePaginator;
-        this.applyFilter(this._filterText);
-    };
-    TableComponent.prototype.applyFilter = function (filterValue) {
-        this.data.filter = filterValue.trim().toLowerCase();
-    };
-    TableComponent.prototype.do = function (name, item) {
-        var resp = new ActionResponse();
-        resp.name = name;
-        resp.value = item;
-        this.buttonClick.emit(resp);
-    };
-    TableComponent.prototype.create = function () {
-        this.createClick.emit();
-    };
-    TableComponent.prototype.load = function () {
-        this.loadClick.emit();
-    };
-    TableComponent.prototype.test = function (a, op, b) {
-        if (op == Operator.Equal) {
-            if (a == b) {
-                return true;
-            }
-            else {
-                return false;
-            }
-        }
-        if (op == Operator.Greater) {
-            if (a > b) {
-                return true;
-            }
-            else {
-                return false;
-            }
-        }
-        if (op == Operator.Less) {
-            if (a < b) {
-                return true;
-            }
-            else {
-                return false;
-            }
-        }
-        if (op == Operator.NotEqual) {
-            if (a != b) {
-                return true;
-            }
-            else {
-                return false;
-            }
-        }
-    };
-    __decorate([
-        Input()
-    ], TableComponent.prototype, "config", void 0);
-    __decorate([
-        Input()
-    ], TableComponent.prototype, "data", void 0);
-    __decorate([
-        Output()
-    ], TableComponent.prototype, "dataChange", void 0);
-    __decorate([
-        Output()
-    ], TableComponent.prototype, "buttonClick", void 0);
-    __decorate([
-        Output()
-    ], TableComponent.prototype, "loadClick", void 0);
-    __decorate([
-        Output()
-    ], TableComponent.prototype, "createClick", void 0);
-    __decorate([
-        ViewChild('tablePaginator')
-    ], TableComponent.prototype, "tablePaginator", void 0);
-    TableComponent = __decorate([
-        Component({
-            selector: 'spa-table',
-            template: "<div >\r\n\r\n<div *ngIf=\"config.create.enabled || config.enableFilter\" class=\"row justify-content-between\" style=\"padding-bottom: 10px\">\r\n <div class=\"col\">\r\n<button *ngIf=\"config.create\" [disabled]=\"!config.create.enabled\" mat-raised-button color=\"primary\" (click)=\"create()\">{{config.create.display}}</button>\r\n</div>\r\n <div *ngIf=\"config.enableFilter\" class=\"col d-flex justify-content-end\">\r\n<mat-form-field style=\"font-size:12px;margin-right: 5px;\">\r\n<mat-label>Filter</mat-label>\r\n<input matInput [(ngModel)]=\"_filterText\" (keyup)=\"applyFilter($event.target.value)\" placeholder=\"Enter Filter text\" autocomplete=\"off\">\r\n</mat-form-field>\r\n<button mat-mini-fab color=\"primary\" (click)=\"load()\" style=\"margin-top:5px\" matTooltip=\"refresh data\" matTooltipPosition=\"right\"><mat-icon class=\"refreshIcon\">refresh</mat-icon></button>\r\n</div>\r\n</div>\r\n\r\n<div class=\"mat-elevation-z8\" *ngIf=\"data\">\r\n\r\n  <table mat-table [dataSource]=\"data\">\r\n\r\n    <ng-container *ngFor=\"let col of config.columns; let i = index\"\r\n\r\n      [matColumnDef]=\"col.name\">\r\n      <th mat-header-cell *matHeaderCellDef> {{col.display}} </th>\r\n      <td mat-cell *matCellDef=\"let row\">\r\n\r\n        <!-- String -->\r\n        <div *ngIf=\"(col.type==colType.String || col.type == null) && col.color == null\"> {{row[col.name]}}</div>\r\n\r\n        <div [ngStyle]=\"{'color':col.color.name}\"\r\n          *ngIf=\"(col.type==colType.String || col.type == null) && col.color != null && test(row[col.color.field], col.color.operator, col.color.value )\" >\r\n           {{row[col.name]}}\r\n        </div>\r\n\r\n        <div\r\n          *ngIf=\"(col.type==colType.String || col.type == null) && col.color != null && !test(row[col.color.field], col.color.operator, col.color.value )\" >\r\n           {{row[col.name]}}\r\n        </div>\r\n\r\n        <!-- <div [ngStyle]=\"{'color':col.color.name}\"\r\n          *ngIf=\"(col.type==colType.String || col.type == null) && col.color != null &&\r\n          col.color.operator==op.Equal && row[col.color.field]==col.color.value\" >\r\n           {{row[col.name]}}\r\n        </div>\r\n\r\n        <div [ngStyle]=\"{'color':col.color.name}\"\r\n          *ngIf=\"(col.type==colType.String || col.type == null) && col.color != null &&\r\n          col.color.operator==op.Greater && row[col.color.field]>col.color.value\" >\r\n           {{row[col.name]}}\r\n        </div>\r\n\r\n        <div [ngStyle]=\"{'color':col.color.name}\"\r\n          *ngIf=\"(col.type==colType.String || col.type == null) && col.color != null &&\r\n          col.color.operator==op.Less && row[col.color.field]<col.color.value\" >\r\n           {{row[col.name]}}\r\n        </div>\r\n\r\n        <div [ngStyle]=\"{'color':col.color.name}\"\r\n          *ngIf=\"(col.type==colType.String || col.type == null) && col.color != null &&\r\n          col.color.operator==op.NotEqual && row[col.color.field]!=col.color.value\" >\r\n           {{row[col.name]}}\r\n        </div> -->\r\n\r\n\r\n        <!-- Date -->\r\n        <div *ngIf=\"col.type==colType.Date\"> {{row[col.name] | date:'dd/MM/yyyy'}}</div>\r\n\r\n\r\n        <!-- DateTime -->\r\n        <div *ngIf=\"col.type==colType.DateTime\"> {{row[col.name] | date:'dd/MM/yyyy HH:mm'}}</div>\r\n\r\n\r\n        <ng-container *ngFor=\"let icon of col.icons;\">\r\n          <!-- <mat-icon *ngIf=\"col.type==colType.Icon && icon.operator==op.Equal && row[icon.field]==icon.value\"\r\n            [ngStyle]=\"{'color':icon.color}\"\r\n            [matTooltip]=\"icon.hint\" matTooltipPosition=\"above\">\r\n            {{icon.name}}\r\n          </mat-icon>\r\n\r\n          <mat-icon *ngIf=\"col.type==colType.Icon && icon.operator==op.Greater && row[icon.field]>icon.value\"\r\n            [ngStyle]=\"{'color':icon.color}\"\r\n            [matTooltip]=\"icon.hint\" matTooltipPosition=\"above\">\r\n            {{icon.name}}\r\n          </mat-icon>\r\n\r\n          <mat-icon *ngIf=\"col.type==colType.Icon && icon.operator==op.Less && row[icon.field]<icon.value\"\r\n            [ngStyle]=\"{'color':icon.color}\"\r\n            [matTooltip]=\"icon.hint\" matTooltipPosition=\"above\">\r\n            {{icon.name}}\r\n          </mat-icon>\r\n          <mat-icon *ngIf=\"col.type==colType.Icon && icon.operator==op.NotEqual && row[icon.field]!=icon.value\"\r\n            [ngStyle]=\"{'color':icon.color}\"\r\n            [matTooltip]=\"icon.hint\" matTooltipPosition=\"above\">\r\n            {{icon.name}}\r\n          </mat-icon> -->\r\n\r\n          <mat-icon *ngIf=\"col.type==colType.Icon && test(row[icon.field],icon.operator,icon.value)\"\r\n            [ngStyle]=\"{'color':icon.color}\"\r\n            [matTooltip]=\"icon.hint\" matTooltipPosition=\"above\">\r\n            {{icon.name}}\r\n          </mat-icon>\r\n\r\n        </ng-container>\r\n\r\n      </td>\r\n\r\n    </ng-container>\r\n\r\n\r\n\r\n\r\n    <ng-container matColumnDef=\"Action\">\r\n\r\n      <th mat-header-cell *matHeaderCellDef> Action </th>\r\n      <td mat-cell *matCellDef=\"let row\" [style]=\"styleString+';padding-right: 0px;'\">\r\n\r\n          <ng-container *ngFor=\"let act of config.actions\">\r\n\r\n            <button *ngIf=\" (act.disappear && (row[act.disappear.field] != act.disappear.value)) || !act.disappear\"   mat-mini-fab\r\n\r\n              [disabled]=\"(act.disable && (row[act.disable.field] == act.disable.value))\"\r\n              [color]=\"act.color==null? 'primary' : act.color\"\r\n              [matTooltip]=\"act.hint\" matTooltipPosition=\"above\"\r\n              (click)=\"do(act.name,row)\" style=\"margin-right:5px\">\r\n              <mat-icon>{{act.icon}}</mat-icon>\r\n\r\n            </button>\r\n\r\n          </ng-container>\r\n\r\n      </td>\r\n    </ng-container>\r\n\r\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n    <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"  [ngClass]=\"{'make-gray': row[config.greyout.field]==config.greyout.value}\"></tr>\r\n\r\n  </table>\r\n</div>\r\n<mat-paginator #tablePaginator [pageSizeOptions]=\"[10, 50, 100]\" showFirstLastButtons></mat-paginator>\r\n</div>\r\n\r\n",
-            styles: [".mat-mini-fab{width:32px;height:32px}.mat-mini-fab mat-icon{font-size:16px;margin-top:-3px}.make-gray{background-color:#d3d3d3}"]
-        })
-    ], TableComponent);
-    return TableComponent;
-}());
-
-var TilesComponent = /** @class */ (function () {
-    function TilesComponent() {
-        this.clickable = false;
-        this.tileClick = new EventEmitter();
-        this.selected = "";
-    }
-    TilesComponent.prototype.ngOnInit = function () {
-    };
-    TilesComponent.prototype.clicked = function (v) {
-        if (!this.clickable)
-            return;
-        if (this.selected == v.tileName) {
-            this.tileClick.emit("");
-            this.selected = "";
-        }
-        else {
-            this.tileClick.emit(v.tileName);
-            this.selected = v.tileName;
-        }
-    };
-    __decorate([
-        Input()
-    ], TilesComponent.prototype, "tiles", void 0);
-    __decorate([
-        Input()
-    ], TilesComponent.prototype, "clickable", void 0);
-    __decorate([
-        Output()
-    ], TilesComponent.prototype, "tileClick", void 0);
-    TilesComponent = __decorate([
-        Component({
-            selector: 'spa-tiles',
-            template: "      <div class=\"row align-items-center\">\r\n\r\n        <!-- <div class=\"col\" *ngFor=\"let row of tiles\" >\r\n\r\n          <mat-card *ngIf=\"row.visible\">\r\n          <div class=\"row d-flex justify-content-center\">\r\n\r\n            <mat-label style=\"font-size:30px;font-weight:bold\" [ngStyle]=\"{'color':row.tileColor}\">{{row.tileValue}}</mat-label>\r\n\r\n          </div>\r\n\r\n          <div class=\"row d-flex justify-content-center\">\r\n\r\n            <mat-label [ngStyle]=\"{'color':row.selected == true ? 'darkorange' : 'black' }\" style=\"font-size:12px;padding-left:5px;padding-right:5px\">{{row.tileName}}</mat-label>\r\n            <mat-icon style=\"font-size: 17px; color:steelblue;\">info</mat-icon>\r\n\r\n          </div>\r\n          </mat-card>\r\n\r\n        </div> -->\r\n\r\n        <ng-container *ngFor=\"let row of tiles\">\r\n\r\n          <mat-card class=\"col\" style=\"margin-left: 10px;margin-right: 10px\" *ngIf=\"row.visible\" (click)=\"clicked(row)\">\r\n\r\n            <div class=\"row d-flex justify-content-center\">\r\n\r\n              <mat-label style=\"font-weight:bold\" [ngStyle]=\"{'color':row.tileColor,'font-size':row.tileName == selected ? '35px' : '30px' }\">{{row.tileValue}}</mat-label>\r\n\r\n            </div>\r\n\r\n            <div class=\"row d-flex justify-content-center row align-items-center\">\r\n\r\n              <mat-label [ngStyle]=\"{'font-size':row.tileName == selected ? '18px' : '12px' }\" style=\"padding-left:5px;padding-right:5px\">{{row.tileName}}</mat-label>\r\n              <mat-icon [matTooltip]=\"row.info\" matTooltipPosition=\"above\" [ngStyle]=\"{'font-size':row.tileName == selected ? '20px' : '17px' }\" style=\" color:steelblue;\">info</mat-icon>\r\n\r\n            </div>\r\n\r\n          </mat-card>\r\n\r\n\r\n        </ng-container>\r\n\r\n      </div>\r\n",
-            styles: [""]
-        })
-    ], TilesComponent);
-    return TilesComponent;
-}());
-
-var DateComponent = /** @class */ (function () {
-    function DateComponent() {
-        this.date = new FormControl(new Date());
-        this.display = "";
-        this.readonly = false;
-        this.currentYear = new Date().getFullYear();
-        this.min = new FormControl(new Date(this.currentYear - 50, 0, 1));
-        this.max = new FormControl(new Date(this.currentYear + 50, 0, 1));
-    }
-    DateComponent.prototype.ngOnInit = function () {
-    };
-    // @Output() dateChange = new EventEmitter();
-    // minDate: Date = new Date(this.currentYear, 2, 2);
-    // maxDate: Date = new Date(this.currentYear, 2, 10);
-    DateComponent.prototype.onChangeEvent = function (d) {
-        // this.dateChange.emit(d);
-    };
-    __decorate([
-        Input()
-    ], DateComponent.prototype, "date", void 0);
-    __decorate([
-        Input()
-    ], DateComponent.prototype, "display", void 0);
-    __decorate([
-        Input()
-    ], DateComponent.prototype, "readonly", void 0);
-    __decorate([
-        Input()
-    ], DateComponent.prototype, "min", void 0);
-    __decorate([
-        Input()
-    ], DateComponent.prototype, "max", void 0);
-    DateComponent = __decorate([
-        Component({
-            selector: 'spa-date',
-            template: "\r\n<mat-form-field style=\"width:150px;margin-right:20px\">\r\n<input [formControl]=\"date\" [min]=\"min.value\" [max]=\"max.value\" matInput [matDatepicker]=\"picker_date\" [placeholder]=\"display\" [readonly]=\"true\"  [disabled]=\"readonly\">\r\n<mat-datepicker-toggle matSuffix [for]=\"picker_date\"></mat-datepicker-toggle>\r\n<mat-datepicker #picker_date></mat-datepicker>\r\n</mat-form-field>\r\n",
-            styles: [""]
-        })
-    ], DateComponent);
-    return DateComponent;
-}());
-
-var TextComponent = /** @class */ (function () {
-    function TextComponent() {
-        // options: FormGroup;
-        this.hideRequiredControl = new FormControl(true);
-        this.readonly = false;
-        this.hint = "";
-        this.display = "";
-        this.placeholder = "";
-        this.value = "";
-        this.valueChange = new EventEmitter();
-        this.format = "text";
-        this.type = "";
-        this.leave = new EventEmitter();
-        this.enterPress = new EventEmitter();
-        this.rows = "";
-        this.width = "100%";
-        //Autocomplete items
-        this.options = [];
-        this.optionValue = "";
-        this.optionDisplay = "";
-        this.myControl = new FormControl();
-        //validations
-        this.required = true;
-        this.min = 0;
-        this.max = 9000000000000000; //Math.max
-        this.regex = ""; //"[a-zA-Z ]*" //"/\S+@\S+\.\S+/";
-        this.control = new FormControl(this.value, [Validators.required, Validators.minLength(this.min), Validators.maxLength(this.max), Validators.pattern(this.regex)]);
-    }
-    TextComponent.prototype.ngOnInit = function () {
-        if (this.options.length > 0) {
-            this.initFilter();
-        }
-        if (this.placeholder == "") {
-            this.placeholder = "Enter " + this.display;
-        }
-    };
-    TextComponent.prototype.ngAfterViewInit = function () {
-        if (this.readonly) {
-            this.control.setValidators(null);
-            this.control.updateValueAndValidity();
-        }
-        if (!this.required && !this.readonly) {
-            this.control.setValidators([Validators.minLength(this.min), Validators.maxLength(this.max), Validators.pattern(this.regex)]);
-            this.control.updateValueAndValidity();
-        }
-    };
-    TextComponent.prototype.initFilter = function () {
-        var _this = this;
-        this.filteredOptions = this.myControl.valueChanges.pipe(startWith(""), map(function (value) { return _this._filter(value); }));
-    };
-    TextComponent.prototype._filter = function (value) {
-        var _this = this;
-        var filterValue = value.toLowerCase();
-        return this.options.filter(function (option) { return option["" + _this.optionDisplay].toLowerCase().includes(filterValue); });
-    };
-    TextComponent.prototype.changed = function () {
-        // if (this.options.length > 0) {
-        //   this.value = this.myControl.value;
-        // }
-        this.valueChange.emit(this.value);
-    };
-    TextComponent.prototype.changed2 = function () {
-        // if (this.options.length > 0) {
-        //   this.value = this.myControl.value;
-        // }
-        this.valueChange.emit(this.myControl.value);
-    };
-    TextComponent.prototype.leaved = function () {
-        this.leave.emit();
-    };
-    TextComponent.prototype.enterPressed = function () {
-        this.enterPress.emit();
-    };
-    TextComponent.prototype.validate = function () {
-        if ((this.required || this.min > 0) && this.control.hasError('required')) {
-            return "Required";
-        }
-        if (this.control.hasError('minlength')) {
-            return "Minimun length is " + this.min;
-        }
-        if (this.control.hasError('maxlength')) {
-            return "Maximum length is " + this.max;
-        }
-        if (this.control.hasError('pattern')) {
-            return "Invalid Input";
-        }
-        // if (this.regex != ""){
-        //   let r = new RegExp(this.regex, "g");
-        //   if (!r.test(this.value)){
-        //     this.valid = false;
-        //     this.errorMessage = "Invalid input";
-        //     return this.errorMessage;
-        //   }
-        // }
-        return "";
-    };
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "readonly", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "hint", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "display", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "placeholder", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "value", void 0);
-    __decorate([
-        Output()
-    ], TextComponent.prototype, "valueChange", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "format", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "type", void 0);
-    __decorate([
-        Output()
-    ], TextComponent.prototype, "leave", void 0);
-    __decorate([
-        Output()
-    ], TextComponent.prototype, "enterPress", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "rows", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "width", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "options", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "optionValue", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "optionDisplay", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "required", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "min", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "max", void 0);
-    __decorate([
-        Input()
-    ], TextComponent.prototype, "regex", void 0);
-    TextComponent = __decorate([
-        Component({
-            selector: 'spa-text',
-            template: "<mat-form-field *ngIf=\"rows == '' && options.length==0\" hideRequiredMarker=\"true\" [hintLabel]=\"hint\" style=\"padding-right: 20px;\" [ngStyle]=\"{'width':width}\" >\r\n<mat-label *ngIf=\"format=='text'\">{{display}}</mat-label>\r\n<mat-label *ngIf=\"format=='date'\">{{display | date:'dd/MM/yyyy'}}</mat-label>\r\n<!-- <mat-label *ngIf=\"format=='datetime'\">{{display | date:'dd/MM/yyyy HH:mm'}}</mat-label> -->\r\n<input matInput autocomplete=\"off\" [(ngModel)]=\"value\"  (change)=\"changed()\" (blur)=\"leaved()\" (keyup.enter)=\"enterPressed()\" [type]=\"type\" [placeholder]=\"placeholder\" [formControl]=\"control\" [required]=\"required\" [readonly]=\"readonly\"/>\r\n<mat-error *ngIf=\"control.invalid\">{{validate()}}</mat-error>\r\n</mat-form-field>\r\n\r\n\r\n<!-- TextArea copy - Only change input to textarea and change ngif to not -->\r\n\r\n<mat-form-field *ngIf=\"rows != ''  && options.length==0\" hideRequiredMarker=\"true\" [hintLabel]=\"hint\" style=\"padding-right: 20px;\" [ngStyle]=\"{'width':width}\">\r\n<mat-label>{{display}}</mat-label>\r\n<textarea matInput autocomplete=\"off\" [rows]=\"rows\" [(ngModel)]=\"value\" (change)=\"changed()\" (keyup.enter)=\"enterPressed()\" [placeholder]=\"placeholder\" [formControl]=\"control\" [required]=\"required\" [readonly]=\"readonly\"></textarea>\r\n<mat-error *ngIf=\"control.invalid\">{{validate()}}</mat-error>\r\n</mat-form-field>\r\n\r\n\r\n\r\n<!-- Work in progress cant bind to value -->\r\n\r\n <!-- <mat-form-field *ngIf=\"options.length !=0\" hideRequiredMarker=\"true\" [hintLabel]=\"hint\" style=\"padding-right: 20px;\" [ngStyle]=\"{'width':width}\">\r\n  <input type=\"text\" autocomplete=\"off\" [placeholder]=\"display\" (change)=\"changed2()\" matInput [formControl]=\"myControl\" [matAutocomplete]=\"auto\" [readonly]=\"readonly\">\r\n  <mat-autocomplete #auto=\"matAutocomplete\">\r\n    <mat-option *ngFor=\"let row of filteredOptions | async\" [value]=\"row[optionValue]\">\r\n      {{row[optionDisplay]}}\r\n    </mat-option>\r\n  </mat-autocomplete>\r\n</mat-form-field> -->\r\n\r\n",
-            styles: [""]
-        })
-    ], TextComponent);
-    return TextComponent;
-}());
-
-var SelectComponent = /** @class */ (function () {
-    function SelectComponent() {
-        this.width = "100%";
-        this.readonly = false;
-        this.readonlyMode = "";
-        this.hint = "";
-        this.placeholder = "";
-        this.display = "";
-        this.value = "";
-        this.optionValue = "";
-        this.optionDisplay = "";
-        this.optionDisplayExtra = "";
-        this.valueChange = new EventEmitter();
-    }
-    SelectComponent.prototype.ngOnInit = function () {
-        // this.displayValue = this.options.filter((m) => m.optionValue == this.value)
-        // this.displayValue = this.value
-        if (this.placeholder == "") {
-            this.placeholder = "Select " + this.display;
-        }
-    };
-    SelectComponent.prototype.ngOnChanges = function () {
-        var _this = this;
-        if (this.readonlyMode != "" && this.options.length > 0) {
-            this.displayValue = this.options.filter(function (m) { return m["" + _this.optionValue] == _this.value; })[0]["" + this.optionDisplay];
-        }
-    };
-    SelectComponent.prototype.changed = function () {
-        this.valueChange.emit(this.value);
-    };
-    __decorate([
-        Input()
-    ], SelectComponent.prototype, "width", void 0);
-    __decorate([
-        Input()
-    ], SelectComponent.prototype, "readonly", void 0);
-    __decorate([
-        Input()
-    ], SelectComponent.prototype, "readonlyMode", void 0);
-    __decorate([
-        Input()
-    ], SelectComponent.prototype, "hint", void 0);
-    __decorate([
-        Input()
-    ], SelectComponent.prototype, "placeholder", void 0);
-    __decorate([
-        Input()
-    ], SelectComponent.prototype, "display", void 0);
-    __decorate([
-        Input()
-    ], SelectComponent.prototype, "value", void 0);
-    __decorate([
-        Input()
-    ], SelectComponent.prototype, "options", void 0);
-    __decorate([
-        Input()
-    ], SelectComponent.prototype, "optionValue", void 0);
-    __decorate([
-        Input()
-    ], SelectComponent.prototype, "optionDisplay", void 0);
-    __decorate([
-        Input()
-    ], SelectComponent.prototype, "optionDisplayExtra", void 0);
-    __decorate([
-        Output()
-    ], SelectComponent.prototype, "valueChange", void 0);
-    SelectComponent = __decorate([
-        Component({
-            selector: 'spa-select',
-            template: "\r\n<mat-form-field *ngIf=\"readonlyMode==''\" style=\"padding-right: 20px;\" floatLabel=\"always\"  [ngStyle]=\"{'width':width}\">\r\n  <mat-label>{{display}}</mat-label>\r\n  <mat-select [(value)]=\"value\" (selectionChange)=\"changed()\"  [disabled]=\"readonly\" [placeholder]=\"placeholder\" >\r\n    <mat-option *ngFor=\"let row of options\" [value]=\"row[optionValue]\">\r\n      {{row[optionDisplay]}} <label *ngIf=\"optionDisplayExtra!='' && row[optionDisplayExtra] && row[optionDisplayExtra] != ''\">({{row[optionDisplayExtra]}})</label>\r\n    </mat-option>\r\n  </mat-select>\r\n  <mat-hint *ngIf=\"hint!=''\">{{hint}}</mat-hint>\r\n</mat-form-field>\r\n\r\n<!-- ReadOnlyModes original, text, label -->\r\n<!-- <spa-text *ngIf=\"readonlyMode=='text' && readonly\" [display]=\"display\" [(value)]=\"displayValue\" [readonly]=\"true\" ></spa-text> -->\r\n",
-            styles: [""]
-        })
-    ], SelectComponent);
-    return SelectComponent;
-}());
-
-var CheckComponent = /** @class */ (function () {
-    function CheckComponent() {
-        this.readonly = false;
-        this.display = "";
-        this.value = false;
-        this.valueChange = new EventEmitter();
-        this.click = new EventEmitter();
-        this.check = new EventEmitter();
-        this.uncheck = new EventEmitter();
-    }
-    CheckComponent.prototype.ngOnInit = function () {
-    };
-    CheckComponent.prototype.changed = function () {
-        this.valueChange.emit(this.value);
-    };
-    CheckComponent.prototype.clicked = function () {
-        this.click.emit();
-        if (!this.value) {
-            this.checked();
-        }
-        else {
-            this.unchecked();
-        }
-    };
-    CheckComponent.prototype.checked = function () {
-        this.check.emit();
-    };
-    CheckComponent.prototype.unchecked = function () {
-        this.uncheck.emit();
-    };
-    __decorate([
-        Input()
-    ], CheckComponent.prototype, "readonly", void 0);
-    __decorate([
-        Input()
-    ], CheckComponent.prototype, "display", void 0);
-    __decorate([
-        Input()
-    ], CheckComponent.prototype, "value", void 0);
-    __decorate([
-        Output()
-    ], CheckComponent.prototype, "valueChange", void 0);
-    __decorate([
-        Output()
-    ], CheckComponent.prototype, "click", void 0);
-    __decorate([
-        Output()
-    ], CheckComponent.prototype, "check", void 0);
-    __decorate([
-        Output()
-    ], CheckComponent.prototype, "uncheck", void 0);
-    CheckComponent = __decorate([
-        Component({
-            selector: 'spa-check',
-            template: " <mat-checkbox color=\"primary\" style=\"margin-right:50px; font-size:14px\" [(ngModel)]=\"value\" (change)=\"changed()\" (click)=\"clicked()\" [disabled]=\"readonly\">{{display}}</mat-checkbox>\r\n",
-            styles: [""]
-        })
-    ], CheckComponent);
-    return CheckComponent;
-}());
-
-var AttachComponent = /** @class */ (function () {
-    function AttachComponent() {
-        this.message = "Drag and drop files here";
-        this.files = [];
-        this.filesChange = new EventEmitter();
-        this.upload = new EventEmitter();
-        this.enableUpload = false;
-    }
-    AttachComponent.prototype.ngOnInit = function () {
-    };
-    /**
-     * on file drop handler
-     */
-    AttachComponent.prototype.onFileDropped = function ($event) {
-        this.prepareFilesList($event);
-    };
-    /**
-     * handle file from browsing
-     */
-    AttachComponent.prototype.fileBrowseHandler = function (files) {
-        this.prepareFilesList(files);
-    };
-    /**
-     * Delete file from files list
-     * @param index (File index)
-     */
-    AttachComponent.prototype.deleteFile = function (index) {
-        this.files.splice(index, 1);
-    };
-    /**
-     * Simulate the upload process
-     */
-    // uploadFilesSimulator(index: number) {
-    //   setTimeout(() => {
-    //     if (index === this.files.length) {
-    //       return;
-    //     } else {
-    //       const progressInterval = setInterval(() => {
-    //         if (this.files[index].progress === 100) {
-    //           clearInterval(progressInterval);
-    //           this.uploadFilesSimulator(index + 1);
-    //         } else {
-    //           this.files[index].progress += 5;
-    //         }
-    //       }, 200);
-    //     }
-    //   }, 1000);
-    // }
-    /**
-     * Convert Files list to normal array list
-     * @param files (Files List)
-     */
-    AttachComponent.prototype.prepareFilesList = function (files) {
-        var e_1, _a;
-        try {
-            for (var files_1 = __values(files), files_1_1 = files_1.next(); !files_1_1.done; files_1_1 = files_1.next()) {
-                var item = files_1_1.value;
-                item.progress = 0;
-                this.files.push(item);
-            }
-        }
-        catch (e_1_1) { e_1 = { error: e_1_1 }; }
-        finally {
-            try {
-                if (files_1_1 && !files_1_1.done && (_a = files_1.return)) _a.call(files_1);
-            }
-            finally { if (e_1) throw e_1.error; }
-        }
-        // this.uploadFilesSimulator(0);
-    };
-    /**
-     * format bytes
-     * @param bytes (File size in bytes)
-     * @param decimals (Decimals point)
-     */
-    AttachComponent.prototype.formatBytes = function (bytes, decimals) {
-        if (bytes === 0) {
-            return '0 Bytes';
-        }
-        var k = 1024;
-        var dm = decimals <= 0 ? 0 : decimals || 2;
-        var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
-        var i = Math.floor(Math.log(bytes) / Math.log(k));
-        return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
-    };
-    AttachComponent.prototype.uploaded = function () {
-        this.upload.emit();
-    };
-    AttachComponent.prototype.filesChanged = function () {
-        this.filesChange.emit(this.files);
-    };
-    __decorate([
-        Input()
-    ], AttachComponent.prototype, "message", void 0);
-    __decorate([
-        Input()
-    ], AttachComponent.prototype, "files", void 0);
-    __decorate([
-        Output()
-    ], AttachComponent.prototype, "filesChange", void 0);
-    __decorate([
-        Output()
-    ], AttachComponent.prototype, "upload", void 0);
-    __decorate([
-        Input()
-    ], AttachComponent.prototype, "enableUpload", void 0);
-    AttachComponent = __decorate([
-        Component({
-            selector: 'spa-attach',
-            template: "<div class=\"tin-input-row\" style=\"width: 100%;\">\r\n\r\n  <div class=\"col\">\r\n    <div class=\"container\" appDnd (fileDropped)=\"onFileDropped($event)\">\r\n      <input type=\"file\" #fileDropRef id=\"fileDropRef\" multiple (change)=\"fileBrowseHandler($event.target.files)\" />\r\n      <h4>{{message}}</h4>\r\n      <h4>or</h4>\r\n      <label for=\"fileDropRef\">Click to Browse</label>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"col\">\r\n    <div class=\"files-list \">\r\n      <div class=\"single-file \" style=\"width: 100%;\" *ngFor=\"let file of files; let i = index\">\r\n\r\n        <div class=\"tin-input-row info\" >\r\n          <h4 class=\"name\">\r\n            {{ file?.name }}\r\n          </h4>\r\n          <p class=\"size\">\r\n            {{ formatBytes(file?.size, 2) }}\r\n          </p>\r\n        </div>\r\n\r\n        <div class=\"delete\" (click)=\"deleteFile(i)\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"18\" viewBox=\"0 0 14 18\">\r\n            <path fill=\"#B1B1B1\" fill-rule=\"nonzero\"\r\n              d=\"M1 16c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2H3c-1.1 0-2 .9-2 2v10zm3.17-7.83a.996.996 0 0 1 1.41 0L7 9.59l1.42-1.42a.996.996 0 1 1 1.41 1.41L8.41 11l1.42 1.42a.996.996 0 1 1-1.41 1.41L7 12.41l-1.42 1.42a.996.996 0 1 1-1.41-1.41L5.59 11 4.17 9.58a.996.996 0 0 1 0-1.41zM10.5 1L9.79.29C9.61.11 9.35 0 9.09 0H4.91c-.26 0-.52.11-.7.29L3.5 1H1c-.55 0-1 .45-1 1s.45 1 1 1h12c.55 0 1-.45 1-1s-.45-1-1-1h-2.5z\" />\r\n          </svg>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div *ngIf=\"files.length > 0 && enableUpload\" class=\"tin-input-row d-flex justify-content-center\" style=\"width: 100%;\" >\r\n      <button mat-button color=\"primary\" (click)=\"uploaded()\" matTooltip=\"Upload New Documents\" matTooltipPosition=\"above\"  ><mat-icon>file_upload</mat-icon> Upload</button>\r\n    </div>\r\n  </div>\r\n\r\n</div>\r\n",
-            styles: [".container{width:100%;height:200px;padding:2rem;text-align:center;border:2px dashed #2a7b94;position:relative;margin:0 auto}.container input{opacity:0;position:absolute;z-index:2;width:100%;height:100%;top:0;left:0}.container label{color:#fff;width:183px;height:44px;border-radius:21.5px;background-color:#db202f;padding:8px 16px}.container h3{font-size:20px;font-weight:600;color:#38424c}.fileover{-webkit-animation:1s infinite shake;animation:1s infinite shake}.files-list{margin-top:1.5rem}.files-list .single-file{display:flex;padding:.5rem;justify-content:space-between;align-items:center;border:1px dashed #1c824d;margin-bottom:1rem;margin-right:1rem;display:flex;flex-grow:1}.files-list .single-file .delete{display:flex;margin-left:.5rem;cursor:pointer;align-self:flex-end}.files-list .single-file .name{font-size:14px;font-weight:500;color:#353f4a;margin:0}.files-list .single-file .size{font-size:12px;font-weight:500;color:#a4a4a4;margin:0 0 0 1rem}.files-list .single-file .info{width:100%}@-webkit-keyframes shake{0%{transform:translate(1px,1px) rotate(0)}10%{transform:translate(-1px,-2px) rotate(-1deg)}20%{transform:translate(-3px,0) rotate(1deg)}30%{transform:translate(3px,2px) rotate(0)}40%{transform:translate(1px,-1px) rotate(1deg)}50%{transform:translate(-1px,2px) rotate(-1deg)}60%{transform:translate(-3px,1px) rotate(0)}70%{transform:translate(3px,1px) rotate(-1deg)}80%{transform:translate(-1px,-1px) rotate(1deg)}90%{transform:translate(1px,2px) rotate(0)}100%{transform:translate(1px,-2px) rotate(-1deg)}}@keyframes shake{0%{transform:translate(1px,1px) rotate(0)}10%{transform:translate(-1px,-2px) rotate(-1deg)}20%{transform:translate(-3px,0) rotate(1deg)}30%{transform:translate(3px,2px) rotate(0)}40%{transform:translate(1px,-1px) rotate(1deg)}50%{transform:translate(-1px,2px) rotate(-1deg)}60%{transform:translate(-3px,1px) rotate(0)}70%{transform:translate(3px,1px) rotate(-1deg)}80%{transform:translate(-1px,-1px) rotate(1deg)}90%{transform:translate(1px,2px) rotate(0)}100%{transform:translate(1px,-2px) rotate(-1deg)}}"]
-        })
-    ], AttachComponent);
-    return AttachComponent;
-}());
-
-var DatetimeComponent = /** @class */ (function () {
-    function DatetimeComponent() {
-        this.display = "";
-        this.value = "";
-        this.valueChange = new EventEmitter();
-        this.readonly = false;
-        this.min = "01 jan 1900";
-        this.max = "31 dec 9999";
-    }
-    DatetimeComponent.prototype.ngOnInit = function () {
-    };
-    DatetimeComponent.prototype.changed = function () {
-        this.valueChange.emit(this.value);
-    };
-    __decorate([
-        Input()
-    ], DatetimeComponent.prototype, "display", void 0);
-    __decorate([
-        Input()
-    ], DatetimeComponent.prototype, "value", void 0);
-    __decorate([
-        Output()
-    ], DatetimeComponent.prototype, "valueChange", void 0);
-    __decorate([
-        Input()
-    ], DatetimeComponent.prototype, "readonly", void 0);
-    __decorate([
-        Input()
-    ], DatetimeComponent.prototype, "min", void 0);
-    __decorate([
-        Input()
-    ], DatetimeComponent.prototype, "max", void 0);
-    DatetimeComponent = __decorate([
-        Component({
-            selector: 'spa-datetime',
-            template: "<mat-form-field style=\"width:150px;margin-right:20px\">\r\n<mat-label>{{display}}</mat-label>\r\n<input matInput autocomplete=\"off\" type=\"datetime-local\" [(ngModel)]=\"value\" [min]=\"min\" [max]=\"max\"  (change)=\"changed()\" [placeholder]=\"display\" [readonly]=\"readonly\" />\r\n</mat-form-field>\r\n",
-            styles: [""]
-        })
-    ], DatetimeComponent);
-    return DatetimeComponent;
-}());
-
-// import { CurrencyPipe } from '@angular/common';
-// import { Core } from 'tin-core';
-var MoneyComponent = /** @class */ (function () {
-    function MoneyComponent() {
-        this.readonly = false;
-        this.display = "";
-        this.value = "";
-        this.valueChange = new EventEmitter();
-        this.width = "100%";
-        this.hint = "";
-        this.currency = "$";
-    }
-    MoneyComponent.prototype.ngOnInit = function () {
-    };
-    MoneyComponent.prototype.ngOnChanges = function () {
-    };
-    MoneyComponent.prototype.changed = function () {
-        this.valueChange.emit(this.value);
-    };
-    __decorate([
-        Input()
-    ], MoneyComponent.prototype, "readonly", void 0);
-    __decorate([
-        Input()
-    ], MoneyComponent.prototype, "display", void 0);
-    __decorate([
-        Input()
-    ], MoneyComponent.prototype, "value", void 0);
-    __decorate([
-        Output()
-    ], MoneyComponent.prototype, "valueChange", void 0);
-    __decorate([
-        Input()
-    ], MoneyComponent.prototype, "width", void 0);
-    __decorate([
-        Input()
-    ], MoneyComponent.prototype, "hint", void 0);
-    __decorate([
-        Input()
-    ], MoneyComponent.prototype, "currency", void 0);
-    MoneyComponent = __decorate([
-        Component({
-            selector: 'spa-money',
-            template: "\r\n<div class=\"tin-input-row\">\r\n\r\n<Label>{{currency}}</Label>\r\n<mat-form-field  [hintLabel]=\"hint\"  style=\"padding-right: 20px;\" [ngStyle]=\"{'width':width}\" >\r\n  <mat-label>{{display}}</mat-label>\r\n  <!-- <span>$</span> -->\r\n  <input matInput class=\"example-right-align\" autocomplete=\"off\" type=\"number\" min=\"0.00\"  step=\"0.01\" [(ngModel)]=\"value \"  [placeholder]=\"display\" (change)=\"changed()\" [readonly]=\"readonly\" />\r\n<!-- <span matTextSuffix>.00</span> -->\r\n</mat-form-field>\r\n</div>\r\n\r\n\r\n\r\n\r\n",
-            styles: ["input.example-right-align{-moz-appearance:textfield}.example-right-align{text-align:right}input.example-right-align::-webkit-inner-spin-button,input.example-right-align::-webkit-outer-spin-button{display:none}.curr{background-color:red}"]
-        })
-    ], MoneyComponent);
-    return MoneyComponent;
-}());
-
-var DndDirective = /** @class */ (function () {
-    function DndDirective() {
-        this.fileDropped = new EventEmitter();
-    }
-    // Dragover listener
-    DndDirective.prototype.onDragOver = function (evt) {
-        evt.preventDefault();
-        evt.stopPropagation();
-        this.fileOver = true;
-    };
-    // Dragleave listener
-    DndDirective.prototype.onDragLeave = function (evt) {
-        evt.preventDefault();
-        evt.stopPropagation();
-        this.fileOver = false;
-    };
-    // Drop listener
-    DndDirective.prototype.ondrop = function (evt) {
-        evt.preventDefault();
-        evt.stopPropagation();
-        this.fileOver = false;
-        var files = evt.dataTransfer.files;
-        if (files.length > 0) {
-            this.fileDropped.emit(files);
-        }
-    };
-    __decorate([
-        HostBinding('class.fileover')
-    ], DndDirective.prototype, "fileOver", void 0);
-    __decorate([
-        Output()
-    ], DndDirective.prototype, "fileDropped", void 0);
-    __decorate([
-        HostListener('dragover', ['$event'])
-    ], DndDirective.prototype, "onDragOver", null);
-    __decorate([
-        HostListener('dragleave', ['$event'])
-    ], DndDirective.prototype, "onDragLeave", null);
-    __decorate([
-        HostListener('drop', ['$event'])
-    ], DndDirective.prototype, "ondrop", null);
-    DndDirective = __decorate([
-        Directive({
-            selector: '[appDnd]'
-        })
-    ], DndDirective);
-    return DndDirective;
-}());
-
-var ChipsComponent = /** @class */ (function () {
-    function ChipsComponent(messageService) {
-        this.messageService = messageService;
-        this.icon = "";
-        this.removable = false;
-        this.addable = false;
-        // @Output() chipClick = new EventEmitter();
-        this.click = new EventEmitter();
-        this.remove = new EventEmitter();
-    }
-    ChipsComponent.prototype.ngOnInit = function () {
-    };
-    ChipsComponent.prototype.clicked = function (chip) {
-        if (typeof chip != 'string') {
-            return;
-        }
-        if (chip) {
-            this.click.emit(chip);
-        }
-    };
-    ChipsComponent.prototype.removed = function (chip) {
-        // const index = this.chips.indexOf(chip);
-        var _this = this;
-        // if (index >= 0) {
-        //   this.chips.splice(index, 1);
-        // }
-        this.messageService.confirm("Remove " + chip + " ?").subscribe(function (result) {
-            if (result == "yes") {
-                _this.remove.emit(chip);
-            }
-            ;
-        });
-    };
-    ChipsComponent.ctorParameters = function () { return [
-        { type: MessageService }
-    ]; };
-    __decorate([
-        Input()
-    ], ChipsComponent.prototype, "icon", void 0);
-    __decorate([
-        Input()
-    ], ChipsComponent.prototype, "removable", void 0);
-    __decorate([
-        Input()
-    ], ChipsComponent.prototype, "addable", void 0);
-    __decorate([
-        Input()
-    ], ChipsComponent.prototype, "chips", void 0);
-    __decorate([
-        Output()
-    ], ChipsComponent.prototype, "click", void 0);
-    __decorate([
-        Output()
-    ], ChipsComponent.prototype, "remove", void 0);
-    ChipsComponent = __decorate([
-        Component({
-            selector: 'spa-chips',
-            template: "\r\n\r\n\r\n<div class=\"row  mt-1\" style=\"margin-left: 1em;\">\r\n  <mat-chip-list #chipList  >\r\n    <mat-chip *ngFor=\"let chip of chips let i = index\" selectable  [removable]=\"removable\"  style=\"font-size: 12px;\" [ngStyle]=\"{'padding-right': removable ? '5px':'12px'}\" (click)=\"clicked(chip)\" >\r\n      <mat-icon *ngIf=\"icon != ''\" color=\"primary\" style=\"font-size: 22px;\">{{icon}}</mat-icon>\r\n\r\n      {{chip}}\r\n\r\n      <mat-icon *ngIf=\"removable\"  style=\"font-size: 20px; margin-left: 5px;margin-top: 3px;margin-right: 0px; color: grey;\" (click)=\"removed(chip)\">cancel</mat-icon>\r\n    </mat-chip>\r\n  </mat-chip-list>\r\n</div>\r\n\r\n\r\n",
-            styles: [""]
-        })
-    ], ChipsComponent);
-    return ChipsComponent;
-}());
-
-var ActivityComponent = /** @class */ (function () {
-    function ActivityComponent() {
-        this.notes = new Array();
-        this.notesMessage = "Empty";
-        this.title = "Notes";
-    }
-    ActivityComponent.prototype.ngOnInit = function () {
-    };
-    __decorate([
-        Input()
-    ], ActivityComponent.prototype, "notes", void 0);
-    __decorate([
-        Input()
-    ], ActivityComponent.prototype, "title", void 0);
-    ActivityComponent = __decorate([
-        Component({
-            selector: 'spa-activity',
-            template: "\r\n      <div class=\"tin-input-row mt-3\" *ngIf=\"title != ''\">\r\n        <mat-label style=\"font-size: 20px; font-weight: 300\" >  {{title}}</mat-label >\r\n      </div>\r\n\r\n      <ul *ngIf=\"notes && notes.length>0\" class=\"list-group list-group-flush\" style=\"max-height:350px; margin-left:5px\">\r\n\r\n        <li *ngFor=\"let note of notes\" class=\"list-group-item  list-group-item-action flex-column align-items-start\">\r\n          <div class=\"d-flex w-100 justify-content-between\">\r\n            <div class=\"mb-0\">{{note.createdByName}}</div>\r\n            <!-- <small class=\"text-muted\">{{note.expr1}} ago</small> -->\r\n          </div>\r\n\r\n          <small>{{note.details}} (<em>{{note.createdDate | date: 'dd MMM yyyy HH:mm'}}</em>) </small>\r\n        </li>\r\n\r\n\r\n      </ul>\r\n\r\n      <div *ngIf=\"notes && notes.length==0\" class=\"d-flex justify-content-center row align-items-center\" style=\"max-height:200px\">\r\n\r\n        No {{title.toLowerCase()}}\r\n\r\n      </div>\r\n",
-            styles: [""]
-        })
-    ], ActivityComponent);
-    return ActivityComponent;
-}());
-
-var OptionComponent = /** @class */ (function () {
-    function OptionComponent() {
-        this.optionValue = "";
-        this.optionDisplay = "";
-        this.readonly = false;
-        this.value = "";
-        this.display = "";
-        this.show = false;
-        this.valueChange = new EventEmitter();
-        this.enterPress = new EventEmitter();
-    }
-    OptionComponent.prototype.ngOnInit = function () {
-        this.OGValue = this.value;
-    };
-    OptionComponent.prototype.changed = function () {
-        this.valueChange.emit(this.value);
-    };
-    OptionComponent.prototype.enterPressed = function () {
-        this.valueChange.emit();
-    };
-    OptionComponent.prototype.resetValue = function () {
-        this.value = this.OGValue;
-        this.changed();
-    };
-    __decorate([
-        Input()
-    ], OptionComponent.prototype, "options", void 0);
-    __decorate([
-        Input()
-    ], OptionComponent.prototype, "optionValue", void 0);
-    __decorate([
-        Input()
-    ], OptionComponent.prototype, "optionDisplay", void 0);
-    __decorate([
-        Input()
-    ], OptionComponent.prototype, "readonly", void 0);
-    __decorate([
-        Input()
-    ], OptionComponent.prototype, "value", void 0);
-    __decorate([
-        Input()
-    ], OptionComponent.prototype, "display", void 0);
-    __decorate([
-        Input()
-    ], OptionComponent.prototype, "show", void 0);
-    __decorate([
-        Output()
-    ], OptionComponent.prototype, "valueChange", void 0);
-    __decorate([
-        Output()
-    ], OptionComponent.prototype, "enterPress", void 0);
-    OptionComponent = __decorate([
-        Component({
-            selector: 'spa-option',
-            template: "\r\n<mat-checkbox color=\"primary\" style=\"margin-right:5px\" [(ngModel)]=\"show\" (change)=\"resetValue()\" labelPosition=\"after\">{{display}}</mat-checkbox>\r\n\r\n\r\n<mat-form-field style=\"margin-right:10px;width: 0px;\" >\r\n<input matInput />\r\n</mat-form-field>\r\n\r\n\r\n<mat-form-field style=\"margin-right:30px\" *ngIf=\"show && !options\">\r\n<mat-label>{{display}}</mat-label>\r\n<input matInput [(ngModel)]=\"value\" width=\"100\" (change)=\"changed()\" (keyup.enter)=\"changed()\" [placeholder]=\"'Enter ' + display\" autocomplete=\"off\" />\r\n</mat-form-field>\r\n\r\n\r\n<mat-form-field style=\"margin-right: 20px;\" floatLabel=\"always\" width=\"100\" *ngIf=\"show && options\">\r\n  <mat-label>{{display}}</mat-label>\r\n  <mat-select [(value)]=\"value\" (selectionChange)=\"changed()\" [placeholder]=\"'Select ' + display\" [disabled]=\"readonly\" >\r\n    <mat-option *ngFor=\"let row of options\" [value]=\"row[optionValue]\">\r\n      {{row[optionDisplay]}}\r\n    </mat-option>\r\n  </mat-select>\r\n</mat-form-field>\r\n\r\n<!-- <spa-text *ngIf=\"show\" style=\"margin-right:30px\" [display]=\"'Enter ' + display\" (enterPress)=\"enterPressed()\" (valueChange)=\"changed($event.target.value)\" width=\"100\" [required]=\"false\" [(value)]=\"value\" ></spa-text> -->\r\n\r\n",
-            styles: [""]
-        })
-    ], OptionComponent);
-    return OptionComponent;
-}());
-
-var LabelComponent = /** @class */ (function () {
-    function LabelComponent() {
-        this.display = "";
-        this.value = "";
-        this.format = "text";
-    }
-    LabelComponent.prototype.ngOnInit = function () {
-    };
-    __decorate([
-        Input()
-    ], LabelComponent.prototype, "display", void 0);
-    __decorate([
-        Input()
-    ], LabelComponent.prototype, "value", void 0);
-    __decorate([
-        Input()
-    ], LabelComponent.prototype, "format", void 0);
-    LabelComponent = __decorate([
-        Component({
-            selector: 'spa-label',
-            template: "<div *ngIf=\"format=='text'\">\r\n  <label  style=\"font-weight: 500\" >{{display}}: </label> &nbsp; <label>{{value}} </label> &nbsp;\r\n</div>\r\n\r\n<div *ngIf=\"format=='date'\">\r\n  <label  style=\"font-weight: 500\" >{{display}}: </label> &nbsp; <label>{{value | date:'dd/MM/yyyy'}} </label> &nbsp;\r\n</div>\r\n\r\n<div *ngIf=\"format=='datetime'\">\r\n  <label  style=\"font-weight: 500\" >{{display}}: </label> &nbsp; <label>{{value | date:'dd/MM/yyyy HH:mm'}} </label> &nbsp;\r\n</div>\r\n\r\n",
-            styles: [""]
-        })
-    ], LabelComponent);
-    return LabelComponent;
-}());
-
-var ɵ0$1 = { displayDefaultIndicatorType: false };
-var StepsComponent = /** @class */ (function () {
-    function StepsComponent() {
-        this.value = "";
-    }
-    StepsComponent.prototype.ngOnInit = function () {
-    };
-    StepsComponent.prototype.ngAfterViewInit = function () {
-    };
-    StepsComponent.prototype.ngOnChanges = function () {
-        this.pushSteps();
-    };
-    StepsComponent.prototype.setStepper = function () {
-        if (this.value == "")
-            return;
-        this.stepper.selectedIndex = 0;
-        switch (this.value) {
-            case "Draft":
-                this.stepper.selectedIndex = 0;
-                break;
-            case "Head Approval":
-                this.pushStepper(1);
-                break;
-            case "CE Approval":
-                this.pushStepper(2);
-                break;
-            case "Booking":
-                this.pushStepper(3);
-                break;
-            case "BTA Approval":
-                this.pushStepper(4);
-                break;
-            case "Travel":
-                this.pushStepper(5);
-                break;
-            case "BTR Approval":
-                this.pushStepper(6);
-                break;
-            case "Travel Closure":
-                this.pushStepper(7);
-                break;
-        }
-    };
-    StepsComponent.prototype.pushStepper = function (count) {
-        for (var index = 0; index < count + 1; index++) {
-            // const element = array[index];
-            this.stepper.selectedIndex = index;
-        }
-    };
-    StepsComponent.prototype.pushSteps = function () {
-        var e_1, _a;
-        if (this.steps.length == 0)
-            return;
-        if (this.value == "")
-            return;
-        this.stepper.selectedIndex = 0;
-        var i = 0;
-        try {
-            for (var _b = __values(this.steps), _c = _b.next(); !_c.done; _c = _b.next()) {
-                var step = _c.value;
-                if (step.name != this.value) {
-                    this.stepper.selectedIndex = i;
-                    i++;
-                }
-                else {
-                    this.stepper.selectedIndex = i;
-                    break;
-                }
-            }
-        }
-        catch (e_1_1) { e_1 = { error: e_1_1 }; }
-        finally {
-            try {
-                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
-            }
-            finally { if (e_1) throw e_1.error; }
-        }
-    };
-    __decorate([
-        ViewChild('stepper')
-    ], StepsComponent.prototype, "stepper", void 0);
-    __decorate([
-        Input()
-    ], StepsComponent.prototype, "value", void 0);
-    __decorate([
-        Input()
-    ], StepsComponent.prototype, "steps", void 0);
-    StepsComponent = __decorate([
-        Component({
-            selector: 'spa-steps',
-            template: "\r\n\r\n\r\n<!-- <mat-horizontal-stepper class=\"test\" labelPosition=\"bottom\"  #stepper>\r\n  <mat-step [editable]=\"false\" label=\"Draft\"> </mat-step>\r\n  <mat-step [editable]=\"false\" label=\"Head Approval\" > </mat-step>\r\n  <mat-step [editable]=\"false\" label=\"CE Approval\"> </mat-step>\r\n  <mat-step [editable]=\"false\" label=\"Booking\" state=\"booking\"> </mat-step>\r\n  <mat-step [editable]=\"false\" label=\"BTA Approval\"> </mat-step>\r\n  <mat-step [editable]=\"false\" label=\"Travel\"> </mat-step>\r\n  <mat-step [editable]=\"false\" label=\"BTR Approval\"> </mat-step>\r\n  <mat-step [editable]=\"false\" label=\"Closure\"> </mat-step>\r\n  <ng-template matStepperIcon=\"booking\"> <mat-icon>forum</mat-icon> </ng-template>\r\n</mat-horizontal-stepper> -->\r\n\r\n<mat-horizontal-stepper class=\"transparent\" labelPosition=\"bottom\"   #stepper>\r\n\r\n  <mat-step *ngFor=\"let row of steps\"\r\n    [editable]=\"false\"  [label]=\"row.name\">\r\n  </mat-step>\r\n\r\n  <!-- <ng-template *ngFor=\"let row of steps\"\r\n    [matStepperIcon]=\"row.name\"> <mat-icon>{{row.icon}}</mat-icon>\r\n  </ng-template> -->\r\n\r\n  <!-- <ng-template matStepperIcon=\"booking\">\r\n    <mat-icon>call_end</mat-icon>\r\n  </ng-template> -->\r\n\r\n  <!-- <ng-template ngFor let-xb [ngForOf]=\"steps\" matStepperIcon=\"Booking\"> <mat-icon>forum</mat-icon>\r\n\r\n  </ng-template> -->\r\n\r\n</mat-horizontal-stepper>\r\n",
-            providers: [{
-                    provide: STEPPER_GLOBAL_OPTIONS, useValue: ɵ0$1
-                }],
-            styles: [".transparent{background-color:rgba(0,0,0,0)}:host ::ng-deep.mat-step-header{padding:5px!important}:host ::ng-deep.mat-stepper-horizontal-line{min-width:5px!important}:host ::ng-deep .mat-horizontal-content-container{padding:0!important}:host ::ng-deep .mat-horizontal-stepper-header{pointer-events:none!important}"]
-        })
-    ], StepsComponent);
-    return StepsComponent;
-}());
-
-var FilterComponent = /** @class */ (function () {
-    function FilterComponent() {
-        this.data = new MatTableDataSource();
-        this.refreshClick = new EventEmitter();
-        this._filterText = "";
-    }
-    FilterComponent.prototype.ngOnInit = function () {
-    };
-    FilterComponent.prototype.ngOnChanges = function () {
-        // console.log("OnChange")
-        this.applyFilter(this._filterText);
-    };
-    ;
-    FilterComponent.prototype.applyFilter = function (filterValue) {
-        if (this.data) {
-            this.data.filter = filterValue.trim().toLowerCase();
-        }
-    };
-    FilterComponent.prototype.refreshClicked = function () {
-        this.refreshClick.emit();
-    };
-    __decorate([
-        Input()
-    ], FilterComponent.prototype, "data", void 0);
-    __decorate([
-        Output()
-    ], FilterComponent.prototype, "refreshClick", void 0);
-    FilterComponent = __decorate([
-        Component({
-            selector: 'spa-filter',
-            template: "<mat-form-field style=\"font-size:12px\">\r\n <mat-label>Filter</mat-label>\r\n <input id=\"txtFilter\" matInput [(ngModel)]=\"_filterText\" (keyup)=\"applyFilter($event.target.value)\" placeholder=\"Enter Filter text\" autocomplete=\"off\">\r\n</mat-form-field>\r\n\r\n<button id=\"btnFilter\" mat-mini-fab color=\"primary\" matTooltip=\"Refresh Data\" matTooltipPosition=\"above\" (click)=\"refreshClicked()\" style=\"margin-right:1em;margin-top:5px\"><mat-icon class=\"refreshIcon\">refresh</mat-icon></button>\r\n",
-            styles: [".mat-mini-fab{width:32px;height:32px}.mat-mini-fab mat-icon{font-size:16px;margin-top:-3px}.refreshIcon{font-size:22px!important;margin-top:-7px!important}"]
-        })
-    ], FilterComponent);
-    return FilterComponent;
-}());
-
-var TinSpaModule = /** @class */ (function () {
-    function TinSpaModule() {
-    }
-    TinSpaModule = __decorate([
-        NgModule({
-            declarations: [DndDirective, TinSpaComponent, messageDialog, NavMenuComponent, LoaderComponent,
-                TimeoutComponent, TableComponent, TilesComponent, DateComponent, TextComponent,
-                SelectComponent, CheckComponent, AttachComponent, DatetimeComponent,
-                MoneyComponent,
-                ChipsComponent,
-                ActivityComponent, OptionComponent, LabelComponent, StepsComponent, FilterComponent],
-            entryComponents: [messageDialog],
-            imports: [
-                ReactiveFormsModule.withConfig({ warnOnNgModelWithFormControl: "never" }),
-                CommonModule,
-                FormsModule,
-                ReactiveFormsModule,
-                SpaMatModule,
-                MomentModule,
-                // NgxDocViewerModule,
-                // AngularEditorModule,
-                NgIdleKeepaliveModule.forRoot()
-            ],
-            exports: [
-                CommonModule,
-                FormsModule,
-                SpaMatModule,
-                TinSpaComponent,
-                messageDialog,
-                NavMenuComponent,
-                LoaderComponent,
-                TimeoutComponent,
-                TableComponent,
-                TilesComponent,
-                DateComponent,
-                SelectComponent,
-                TextComponent,
-                DatetimeComponent,
-                CheckComponent,
-                AttachComponent,
-                MoneyComponent,
-                ChipsComponent,
-                ActivityComponent,
-                OptionComponent,
-                LabelComponent,
-                StepsComponent,
-                FilterComponent
-            ],
-            providers: [
-                { provide: HTTP_INTERCEPTORS, useClass: LoaderInterceptor, multi: true },
-                { provide: LocationStrategy, useClass: HashLocationStrategy }
-            ],
-        })
-    ], TinSpaModule);
-    return TinSpaModule;
-}());
-
-var LoginComponent = /** @class */ (function () {
-    function LoginComponent(httpService, storageService, router, messageService, dataService, authService, logService, route) {
-        this.httpService = httpService;
-        this.storageService = storageService;
-        this.router = router;
-        this.messageService = messageService;
-        this.dataService = dataService;
-        this.authService = authService;
-        this.logService = logService;
-        this.route = route;
-        this.user = new User();
-        this.hide = true;
-        this.isProcessing = false;
-        this.appConfig = new AppConfig();
-    }
-    LoginComponent.prototype.ngOnInit = function () {
-        var _this = this;
-        this.authService.Updateloggedin(false);
-        this.authService.UpdateRole(null);
-        this.storageService.clear();
-        this.dataService.appConfigObserv.subscribe(function (x) { return _this.appConfig = x; });
-        if (this.route.snapshot.queryParams.redirectTo != undefined) {
-            this.redirectPath = this.route.snapshot.queryParams.redirectTo;
-        }
-        else {
-            this.redirectPath = "home";
-        }
-    };
-    LoginComponent.prototype.signup = function () {
-        this.router.navigate(["signup"]);
-    };
-    LoginComponent.prototype.recoverAccount = function () {
-        this.router.navigate(["recover-account"]);
-    };
-    LoginComponent.prototype.login = function () {
-        var _this = this;
-        if (this.user.userName == "" || this.user.password == "") {
-            this.messageService.toast("Please enter your credentials");
-            return;
-        }
-        this.logService.info("logging in");
-        this.isProcessing = true;
-        this.user.userName = this.user.userName;
-        this.dataService.Login(this.user).subscribe(function (apiResponse) {
-            _this.isProcessing = false;
-            if (apiResponse.success) {
-                if (apiResponse.data.authType == 'local' && !_this.appConfig.localAuth) {
-                    _this.messageService.toast("Contact Admin: Authentication Type error");
-                    return;
-                }
-                if (apiResponse.data.authType == 'AD' && !_this.appConfig.ADAuth) {
-                    _this.messageService.toast("Contact Admin: Authentication Type error");
-                    return;
-                }
-                _this.authService.Updateloggedin(true);
-                _this.authService.UpdateToken(apiResponse.data.token);
-                _this.storageService.store(Constants.AUTH_TOKEN, apiResponse.data.token);
-                _this.authService.UpdateTokenExpire(apiResponse.data.expiration);
-                _this.storageService.store(Constants.AUTH_TOKEN_EXPIRE, apiResponse.data.expiration);
-                _this.authService.UpdateCurrentUser(_this.user.userName);
-                _this.storageService.store(Constants.AUTH_USER, _this.user.userName);
-                _this.authService.updateLoggedUserFullName(apiResponse.data.firstName);
-                _this.storageService.store(Constants.AUTH_NAME, apiResponse.data.firstName);
-                _this.authService.UpdateRole(apiResponse.data.role);
-                _this.storageService.store(Constants.AUTH_ROLES, JSON.stringify(apiResponse.data.role));
-                _this.logService.info("logged in");
-                if (apiResponse.data.changePassword == true && apiResponse.data.authType == 'local') {
-                    _this.router.navigate(["home/user/change-password"], {
-                        queryParams: { redirectTo: _this.redirectPath },
-                        queryParamsHandling: 'merge',
-                        skipLocationChange: false
-                    });
-                    return;
-                }
-                _this.router.navigate([_this.redirectPath]);
-            }
-            else {
-                _this.messageService.toast("Error: " + apiResponse.message);
-                _this.user.password = "";
-            }
-        }, function (error) {
-            _this.isProcessing = false;
-            _this.messageService.toast(_this.httpService.Error(error));
-        });
-    };
-    LoginComponent.ctorParameters = function () { return [
-        { type: HttpService },
-        { type: StorageService },
-        { type: Router },
-        { type: MessageService },
-        { type: DataServiceLib },
-        { type: AuthService },
-        { type: LogService },
-        { type: ActivatedRoute }
-    ]; };
-    LoginComponent = __decorate([
-        Component({
-            selector: "spa-login",
-            template: "\r\n  <div class=\"tin-bg-login login-page\">\r\n\r\n    <div *ngIf=\"appConfig.logo!=''\" class=\"d-flex justify-content-center row align-items-center\" style=\"margin-top:3em;margin-bottom:1em\">\r\n\r\n      <img *ngIf=\"appConfig.logoSize=='normal'\"  [src]=\"appConfig.logo\" style=\"height:100px;margin-right:3em;margin-left:3em\" />\r\n      <img *ngIf=\"appConfig.logoSize=='medium'\"  [src]=\"appConfig.logo\" style=\"height:150px;margin-right:3em;margin-left:3em\" />\r\n      <img *ngIf=\"appConfig.logoSize=='large'\"  [src]=\"appConfig.logo\" style=\"height:250px;margin-right:3em;margin-left:3em\" />\r\n\r\n    </div>\r\n\r\n\r\n    <div *ngIf=\"appConfig.logo ==''\" style=\"margin-top:2em\">\r\n        <!-- Add margin top when there is no logo -->\r\n    </div>\r\n\r\n\r\n    <div class=\"d-flex justify-content-center row align-items-center\" style=\"margin-top:3em\">\r\n\r\n      <div class=\"d-none d-sm-block\">\r\n      </div>\r\n\r\n      <div style=\"margin-left:1em\">\r\n\r\n        <mat-card class=\"mat-elevation-z3\" style=\"width:400px; \">\r\n\r\n          <mat-card-header>\r\n            <mat-card-title>{{appConfig.appName}}</mat-card-title>\r\n          </mat-card-header>\r\n\r\n          <mat-card-content>\r\n\r\n            <div class=\"tin-input mt-2\">\r\n\r\n              <spa-text id=\"txtuserName\" display=\"Username\" [(value)]=\"user.userName\" ></spa-text>\r\n\r\n              <mat-form-field >\r\n                <mat-label>Password</mat-label>\r\n                <input id=\"txtPassword\" matInput [type]=\"hide ? 'password' : 'text'\"  (keyup.enter)=\"login()\" [(ngModel)]=\"user.password\" autocomplete=\"off\" >\r\n                <button mat-icon-button matSuffix (click)=\"hide = !hide\" [attr.aria-label]=\"'Hide password'\" [attr.aria-pressed]=\"hide\">\r\n                  <mat-icon style=\"font-size: 18px;\">{{hide ? 'visibility_off' : 'visibility'}}</mat-icon>\r\n                </button>\r\n              </mat-form-field>\r\n\r\n            </div>\r\n\r\n          </mat-card-content>\r\n\r\n\r\n          <mat-card-actions>\r\n\r\n            <div class=\"row \">\r\n\r\n              <div class=\"col d-flex justify-content-center\">\r\n                <button id=\"btnLogin\"  mat-raised-button [disabled]=\"isProcessing\" style=\"width: 100px;\" (click)=\"login()\" color=\"primary\">Login</button>\r\n              </div>\r\n\r\n              <div class=\"col d-flex justify-content-center\" *ngIf=\"appConfig.selfService\">\r\n                <button id=\"btnSignup\" mat-stroked-button  color=\"primary\" style=\"width: 100px;\" (click)=\"signup()\">Signup</button>\r\n              </div>\r\n\r\n            </div>\r\n\r\n          </mat-card-actions>\r\n\r\n        </mat-card>\r\n\r\n        <div *ngIf=\"appConfig.selfService\">\r\n          <br />\r\n          <a mat-button id=\"lnkRecover\"  style=\"margin-left: 1em\" (click)=\"recoverAccount()\">Forgot your password ?</a>\r\n        </div>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n  </div>\r\n\r\n",
-            styles: [".login-page{position:absolute;top:0;left:0;right:0;bottom:0;overflow:auto}.tin-bg-login{background-image:url(~/assets/login-bg.jpg);background-size:100%}"]
-        })
-    ], LoginComponent);
-    return LoginComponent;
-}());
-
-var SignupComponent = /** @class */ (function () {
-    function SignupComponent(httpService, messageService, dataService, authService) {
-        this.httpService = httpService;
-        this.messageService = messageService;
-        this.dataService = dataService;
-        this.authService = authService;
-        this.isProcessing = false;
-        this.user = new User();
-        this.profile = new Profile();
-        this.account = new Account();
-    }
-    SignupComponent.prototype.ngOnInit = function () {
-        this.account.user = this.user;
-        this.account.profile = this.profile;
-    };
-    SignupComponent.prototype.create = function () {
-        var _this = this;
-        this.profile.userName = this.user.userName;
-        this.isProcessing = true;
-        this.dataService.RegisterAccount(this.account).subscribe(function (apiResponse) {
-            _this.isProcessing = false;
-            if (apiResponse.message == "success") {
-                _this.messageService.toast("Account Created");
-                _this.user = new User();
-                _this.profile = new Profile();
-            }
-            else {
-                _this.messageService.toast("Error: " + apiResponse.message);
-            }
-        }, function (error) {
-            _this.isProcessing = false;
-            _this.messageService.toast(_this.httpService.Error(error));
-        });
-    };
-    SignupComponent.ctorParameters = function () { return [
-        { type: HttpService },
-        { type: MessageService },
-        { type: DataServiceLib },
-        { type: AuthService }
-    ]; };
-    SignupComponent = __decorate([
-        Component({
-            selector: 'spa-signup',
-            template: "\r\n<h4 style=\"margin-top: 1em;\">Signup</h4>\r\n\r\n<hr/>\r\nComplete the form below.\r\n\r\n<div class=\"d-flex justify-content-center row align-items-center\">\r\n\r\n  <div class=\"tin-input\" style=\"font-size:14px; width: 50%;\">\r\n\r\n\r\n    <div class=\"tin-input-row\">\r\n\r\n      <div class=\"col\">\r\n\r\n        <mat-form-field style=\"width:100%\">\r\n          <mat-label>FirstName</mat-label>\r\n          <input matInput autocomplete=\"off\" [(ngModel)]=\"account.profile.firstName\" placeholder=\"Enter FirstName\" />\r\n        </mat-form-field>\r\n\r\n      </div>\r\n\r\n      <div class=\"col\">\r\n\r\n        <mat-form-field style=\"width:100%\">\r\n          <mat-label>LastName</mat-label>\r\n          <input matInput autocomplete=\"off\" [(ngModel)]=\"profile.lastName\" placeholder=\"Enter LastName\" />\r\n        </mat-form-field>\r\n\r\n      </div>\r\n\r\n\r\n    </div>\r\n\r\n    <div class=\"tin-input-row mt-3\">\r\n\r\n      <div class=\"col-6\">\r\n\r\n        <mat-form-field style=\"width:100%\">\r\n          <mat-label>userName</mat-label>\r\n          <input matInput autocomplete=\"off\" [(ngModel)]=\"user.userName\" placeholder=\"Enter userName\" />\r\n        </mat-form-field>\r\n      </div>\r\n\r\n\r\n    </div>\r\n\r\n    <div class=\"tin-input-row\">\r\n\r\n      <div class=\"col\">\r\n\r\n        <mat-form-field style=\"width:100%\">\r\n          <mat-label>Password</mat-label>\r\n          <input matInput autocomplete=\"off\" type=\"password\" [(ngModel)]=\"user.password\" placeholder=\"Enter Password\" />\r\n        </mat-form-field>\r\n\r\n      </div>\r\n\r\n      <div class=\"col\">\r\n\r\n        <mat-form-field style=\"width:100%\">\r\n          <mat-label>Confirm Password</mat-label>\r\n          <input matInput autocomplete=\"off\" type=\"password\" [(ngModel)]=\"confirmPassword\" placeholder=\"Enter Confirm Password\" />\r\n        </mat-form-field>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n\r\n\r\n\r\n    <div class=\"tin-input-row mt-3\">\r\n      <button mat-raised-button color=\"primary\" (click)=\"create()\" cdkFocusInitial>Create</button>\r\n    </div>\r\n\r\n\r\n\r\n  </div>\r\n\r\n\r\n\r\n</div>\r\n\r\n",
-            styles: [""]
-        })
-    ], SignupComponent);
-    return SignupComponent;
-}());
-
-var RecoverAccountComponent = /** @class */ (function () {
-    function RecoverAccountComponent(location, dataService, authService, messageService) {
-        this.location = location;
-        this.dataService = dataService;
-        this.authService = authService;
-        this.messageService = messageService;
-        this.userName = "";
-    }
-    RecoverAccountComponent.prototype.ngOnInit = function () {
-    };
-    RecoverAccountComponent.prototype.recover = function () {
-        var _this = this;
-        if (this.userName == "") {
-            this.messageService.toast("Please enter your userName");
-            return;
-        }
-        else {
-            var u = new User();
-            u.userName = this.userName;
-            this.dataService.SelfReset(u).subscribe(function (apiResponse) {
-                if (apiResponse.message == "success") {
-                    _this.messageService.toast("The password has been sent to your email");
-                    _this.location.back();
-                }
-                else {
-                    _this.messageService.toast("Error: " + apiResponse.message);
-                }
-            });
-        }
-    };
-    RecoverAccountComponent.ctorParameters = function () { return [
-        { type: Location },
-        { type: DataServiceLib },
-        { type: AuthService },
-        { type: MessageService }
-    ]; };
-    RecoverAccountComponent = __decorate([
-        Component({
-            selector: 'spa-recover-account',
-            template: "<h4 style=\"margin-top: 1em;\">Recover Account</h4>\r\n\r\n<hr/>\r\nSubmit your userName and we will send you details to your registered email address.\r\n\r\n<div class=\"mt-3\" >\r\n\r\n  <div class=\"tin-input \" style=\"font-size:14px;\">\r\n\r\n    <div class=\"col\">\r\n      <spa-text display=\"Username\" [(value)]=\"userName\" ></spa-text>\r\n    </div>\r\n\r\n    <div class=\"col mt-3\">\r\n      <button mat-raised-button color=\"primary\" (click)=\"recover()\" cdkFocusInitial>Submit</button>\r\n    </div>\r\n\r\n  </div>\r\n\r\n</div>\r\n",
-            styles: [""]
-        })
-    ], RecoverAccountComponent);
-    return RecoverAccountComponent;
-}());
-
-var SpaIndexModule = /** @class */ (function () {
-    function SpaIndexModule() {
-    }
-    SpaIndexModule = __decorate([
-        NgModule({
-            declarations: [LoginComponent, SignupComponent, RecoverAccountComponent],
-            entryComponents: [],
-            imports: [
-                ReactiveFormsModule.withConfig({ warnOnNgModelWithFormControl: "never" }),
-                CommonModule,
-                FormsModule,
-                ReactiveFormsModule,
-                SpaMatModule,
-                TinSpaModule
-            ],
-            exports: [
-                CommonModule,
-                FormsModule,
-                SpaMatModule,
-                LoginComponent,
-                SignupComponent,
-                RecoverAccountComponent,
-            ],
-        })
-    ], SpaIndexModule);
-    return SpaIndexModule;
-}());
-
-var ChangePasswordComponent = /** @class */ (function () {
-    function ChangePasswordComponent(router, location, httpService, messageService, dataService, authService, route) {
-        this.router = router;
-        this.location = location;
-        this.httpService = httpService;
-        this.messageService = messageService;
-        this.dataService = dataService;
-        this.authService = authService;
-        this.route = route;
-        this.isProcessing = false;
-        this.changePassword = new ChangeUserPassword();
-    }
-    ChangePasswordComponent.prototype.ngOnInit = function () {
-        this.myRole = this.authService.currentRoleSource.value;
-        if (this.dataService.tmpProfileuserName == "") {
-            this.changePassword.userName = this.authService.currentUser;
-        }
-        else {
-            this.changePassword.userName = this.dataService.tmpProfileuserName;
-            this.dataService.tmpProfileuserName = "";
-        }
-        if (this.route.snapshot.queryParams.redirectTo != undefined) {
-            this.redirectPath = this.route.snapshot.queryParams.redirectTo;
-        }
-        else {
-            this.redirectPath = "home";
-        }
-    };
-    ChangePasswordComponent.prototype.change = function () {
-        var _this = this;
-        if (!this.myRole[this.dataService.capUsers.name]) {
-            if (this.changePassword.currentPassword == "") {
-                this.messageService.toast("Please enter current Password");
-                return;
-            }
-        }
-        if (this.changePassword.newPassword == "") {
-            this.messageService.toast("Please enter new Password");
-            return;
-        }
-        if (this.changePassword.confirmPassword == "") {
-            this.messageService.toast("Please confirm new Password");
-            return;
-        }
-        if (this.changePassword.confirmPassword != this.changePassword.newPassword) {
-            this.messageService.toast("Passwords do not match");
-            return;
-        }
-        this.isProcessing = true;
-        if (this.myRole[this.dataService.capUsers.name]) {
-            this.dataService.ChangePasswordAdmin(this.changePassword).subscribe(function (apiResponse) {
-                _this.isProcessing = false;
-                if (apiResponse.message == "success") {
-                    _this.messageService.toast("Password Changed");
-                    _this.router.navigate([_this.redirectPath]);
-                }
-                else {
-                    _this.messageService.toast("Error: " + apiResponse.message);
-                }
-            });
-        }
-        else {
-            this.dataService.ChangePassword(this.changePassword).subscribe(function (apiResponse) {
-                _this.isProcessing = false;
-                if (apiResponse.message == "success") {
-                    _this.messageService.toast("Password Changed");
-                    _this.router.navigate([_this.redirectPath]);
-                }
-                else {
-                    _this.messageService.toast("Error: " + apiResponse.message);
-                }
-            });
-        }
-    };
-    ChangePasswordComponent.ctorParameters = function () { return [
-        { type: Router },
-        { type: Location },
-        { type: HttpService },
-        { type: MessageService },
-        { type: DataServiceLib },
-        { type: AuthService },
-        { type: ActivatedRoute }
-    ]; };
-    ChangePasswordComponent = __decorate([
-        Component({
-            selector: 'spa-change-password',
-            template: "<h4>Change Password</h4>\r\n<hr>\r\n\r\n<div class=\"container\">\r\n\r\n  <div class=\"d-flex justify-content-center row align-items-center\" >\r\n\r\n    <div class=\"col\">\r\n\r\n      <div class=\"tin-input \" style=\"font-size:14px;\">\r\n\r\n        <div class=\"col\" *ngIf=\"changePassword.userName!=''\">\r\n          <spa-text id=\"txtuserName\" display=\"Username\" [(value)]=\"changePassword.userName\" width=\"300px\" readonly=\"true\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\" *ngIf=\"!myRole[dataService.capUsers.name]\">\r\n          <spa-text id=\"txtPassword\" display=\"Current Password\" [(value)]=\"changePassword.currentPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n          <spa-text id=\"txtNewPassword\" display=\"New Password\" [(value)]=\"changePassword.newPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n           <spa-text id=\"txtConfirmPassword\" display=\"Confirm Password\" [(value)]=\"changePassword.confirmPassword\" width=\"300px\" type=\"password\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col mt-3\">\r\n          <button id=\"btnChange\" mat-raised-button color=\"primary\" (click)=\"change()\" cdkFocusInitial>Change</button>\r\n        </div>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n    <div class=\"col\">\r\n\r\n      <div class=\"alert alert-info\" style=\"font-size: 14px;\" role=\"alert\">\r\n        <b>*Please consider these requirements for your new password.</b> <br><br>\r\n\r\n        At least 8 characters<br>\r\n        At least 1 uppercase letter (A-Z)<br>\r\n        At least 2 lowercase letters (a-z)<br>\r\n        At least 1 digit (0-9)<br>\r\n        At least 1 special character (~`! \u2026)<br>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n\r\n\r\n\r\n\r\n  </div>\r\n</div>\r\n\r\n",
-            styles: [""]
-        })
-    ], ChangePasswordComponent);
-    return ChangePasswordComponent;
-}());
-
-var ProfileComponent = /** @class */ (function () {
-    function ProfileComponent(dataService, messageService, httpService, router, authService) {
-        this.dataService = dataService;
-        this.messageService = messageService;
-        this.httpService = httpService;
-        this.router = router;
-        this.authService = authService;
-        this.appConfig = new AppConfig();
-        this.selfProfile = false;
-        this.profile = new Profile();
-    }
-    ProfileComponent.prototype.ngOnInit = function () {
-        this.myRole = this.authService.currentRoleSource.value;
-        if (this.dataService.tmpProfileuserName == "") {
-            this.loadProfile(this.authService.currentUser);
-        }
-        else {
-            this.loadProfile(this.dataService.tmpProfileuserName);
-            this.dataService.tmpProfileuserName = "";
-        }
-    };
-    ProfileComponent.prototype.loadProfile = function (userName) {
-        var _this = this;
-        var action = "all";
-        this.dataService.GetUserByID(userName).subscribe(function (apiResponse) {
-            _this.profile = apiResponse[0];
-            if (_this.profile.userName.toLocaleLowerCase() == _this.authService.currentUser.toLocaleLowerCase()) {
-                _this.selfProfile = true;
-            }
-            _this.loadRoles();
-            console.log(_this.profile);
-        }, function (error) {
-            _this.isProcessing = false;
-            _this.messageService.toast(_this.httpService.Error(error));
-        });
-    };
-    ProfileComponent.prototype.loadRoles = function () {
-        var _this = this;
-        this.dataService.GetRole("all", "").subscribe(function (apiResponse) {
-            _this.roles = apiResponse;
-            console.log(_this.roles);
-        }, function (error) {
-            _this.isProcessing = false;
-            _this.messageService.toast(_this.httpService.Error(error));
-        });
-    };
-    ProfileComponent.prototype.changePassword = function () {
-        this.dataService.tmpProfileuserName = this.profile.userName;
-        this.router.navigate(["home/user/change-password"]);
-    };
-    ProfileComponent.prototype.gotoUsers = function () {
-        this.router.navigate(["home/admin/users"]);
-    };
-    ProfileComponent.prototype.update = function () {
-    };
-    ProfileComponent.prototype.updateProfile = function () {
-        var _this = this;
-        this.isProcessing = true;
-        // console.log(this.profile)
-        // return
-        this.dataService.UpdateUser(this.profile).subscribe(function (apiResponse) {
-            _this.isProcessing = false;
-            if (apiResponse.success) {
-                _this.messageService.toast("Profile Updated");
-            }
-            else {
-                _this.messageService.toast("Error: " + apiResponse.message);
-            }
-        }, function (error) {
-            _this.messageService.toast("Connection failed ");
-            _this.isProcessing = false;
-        });
-    };
-    ProfileComponent.ctorParameters = function () { return [
-        { type: DataServiceLib },
-        { type: MessageService },
-        { type: HttpService },
-        { type: Router },
-        { type: AuthService }
-    ]; };
-    __decorate([
-        Input()
-    ], ProfileComponent.prototype, "appConfig", void 0);
-    ProfileComponent = __decorate([
-        Component({
-            selector: 'spa-profile',
-            template: "\r\n<div class=\"container\">\r\n\r\n  <div class=\"row mt-3\" style=\"font-size:14px;\">\r\n\r\n    <div class=\"col-2 mt-3 \">\r\n\r\n      <div class=\"tin-input\">\r\n\r\n        <div class=\"col\">\r\n          <mat-icon style=\"font-size: 70px;\">account_circle</mat-icon>\r\n          <!-- <img style=\"height: 40px\"> -->\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n          <mat-label id=\"lbluserName\" style=\"font-size: 14px;\">{{profile?.userName}}</mat-label>\r\n        </div>\r\n\r\n\r\n      </div>\r\n\r\n\r\n\r\n    </div>\r\n\r\n    <div class=\"col-8 mt-3\">\r\n\r\n      <div class=\"tin-input\" style=\"width: 70%;\">\r\n\r\n        <div class=\"tin-input-row\">\r\n\r\n\r\n          <div class=\"col\">\r\n            <spa-text id=\"txtFirstName\" display=\"First Name\" [(value)]=\"profile.firstName\" [readonly]=\"selfProfile\"></spa-text>\r\n          </div>\r\n\r\n          <div class=\"col\">\r\n            <spa-text id=\"txtLastName\" display=\"Last Name\" [(value)]=\"profile.lastName\" [readonly]=\"selfProfile\"></spa-text>\r\n          </div>\r\n\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n          <spa-text id=\"txtAuth\" display=\"Authentication\" [(value)]=\"profile.authType\" [readonly]=\"true\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n           <spa-text id=\"txtEmail\" display=\"Email\" [(value)]=\"profile.email\" [readonly]=\"selfProfile\"></spa-text>\r\n        </div>\r\n\r\n        <div class=\"col\">\r\n          <spa-select id=\"cboRole\" display=\"Role\" [options]=\"roles\" optionDisplay=\"roleName\" optionValue=\"roleID\"  [(value)]=\"profile.roleID\" [readonly]=\"selfProfile\"></spa-select>\r\n        </div>\r\n\r\n\r\n        <div class=\"tin-input-row mt-2\">\r\n          <button id=\"btnUpdate\" mat-raised-button color=\"primary\" *ngIf=\"!selfProfile\" [disabled]=\"isProcessing\" (click)=\"updateProfile()\" >Update Profile</button>\r\n        </div>\r\n\r\n\r\n      </div>\r\n\r\n\r\n    </div>\r\n\r\n    <div class=\"col-2 mt-4\">\r\n\r\n      <a mat-button id=\"lnkUserManager\"  style=\"margin-left: 1em\" *ngIf=\"!selfProfile\" (click)=\"gotoUsers()\" >User Manager</a>\r\n      <a mat-button id=\"lnkChangePassword\" style=\"margin-left: 1em\" *ngIf=\"(selfProfile || myRole[dataService.capUsers.name]) && profile.authType=='local'\" (click)=\"changePassword()\" >Change Password</a>\r\n\r\n    </div>\r\n\r\n  </div>\r\n\r\n</div>\r\n\r\n\r\n\r\n",
-            styles: [""]
-        })
-    ], ProfileComponent);
-    return ProfileComponent;
-}());
-
-var SpaUserModule = /** @class */ (function () {
-    function SpaUserModule() {
-    }
-    SpaUserModule = __decorate([
-        NgModule({
-            declarations: [ChangePasswordComponent, ProfileComponent],
-            entryComponents: [],
-            imports: [
-                ReactiveFormsModule.withConfig({ warnOnNgModelWithFormControl: "never" }),
-                CommonModule,
-                FormsModule,
-                ReactiveFormsModule,
-                SpaMatModule,
-                TinSpaModule
-            ],
-            exports: [
-                CommonModule,
-                FormsModule,
-                SpaMatModule,
-                ChangePasswordComponent,
-                ProfileComponent,
-            ],
-        })
-    ], SpaUserModule);
-    return SpaUserModule;
-}());
-
-// import { ApiResponse } from 'tin-core';
-var SettingsComponent = /** @class */ (function () {
-    function SettingsComponent(dataService, messageService) {
-        this.dataService = dataService;
-        this.messageService = messageService;
-        this._filterText = "";
-        this.isProcessing = false;
-    }
-    SettingsComponent.prototype.ngOnInit = function () {
-        this.loadSettings();
-    };
-    SettingsComponent.prototype.applyFilter = function (filterValue) {
-        this.settings.filter = filterValue.trim().toLowerCase();
-    };
-    SettingsComponent.prototype.loadSettings = function () {
-        var _this = this;
-        this.dataService.GetSetting("all", "").subscribe(function (apiResponse) {
-            _this.settings = apiResponse;
-        });
-    };
-    SettingsComponent.prototype.updateSetting = function (setting) {
-        var _this = this;
-        this.isProcessing = true;
-        this.dataService.UpdateSetting(setting, "edit").subscribe(function (apiResponse) {
-            _this.isProcessing = false;
-            if (apiResponse.success) {
-                _this.messageService.toast("Setting " + setting.sName + " Updated");
-                _this.loadSettings();
-            }
-            else {
-                _this.messageService.toast("Error: " + apiResponse.message);
-            }
-        });
-    };
-    ;
-    SettingsComponent.prototype.addSetting = function () {
-        // const dialogRef = this.dialog.open(addRoleDialog, {
-        //   width: "1100px",
-        //   data: "",
-        // });
-        // dialogRef.afterClosed().subscribe((result) => {
-        //   if (result == "success") {
-        //     this.loadRoles();
-        //   }
-        // });
-        this.messageService.toast("Feature not Available");
-    };
-    SettingsComponent.ctorParameters = function () { return [
-        { type: DataServiceLib },
-        { type: MessageService }
-    ]; };
-    SettingsComponent = __decorate([
-        Component({
-            selector: 'spa-settings',
-            template: "<h4>Settings</h4>\r\n<hr>\r\n\r\n<div class=\"container\">\r\n\r\n  <div class=\"row justify-content-between\" style=\"padding-bottom: 10px;padding-left:10px\">\r\n\r\n    <div class=\"col-2\">\r\n      <!-- <button mat-raised-button (click)=\"addSetting()\">New Setting</button> -->\r\n    </div>\r\n    <div class=\"col-2\">\r\n      <button mat-raised-button (click)=\"loadSettings()\">Refresh</button>\r\n    </div>\r\n  </div>\r\n\r\n\r\n  <div class=\"row mt-1 mb-1\" style=\"margin-left:10px\" *ngFor=\"let setting of settings\">\r\n\r\n    <mat-form-field style=\"width: 500px; font-size: 14px;\">\r\n      <mat-label>{{setting.sName}}</mat-label>\r\n      <input matInput autocomplete=\"off\" [(ngModel)]=\"setting.sValue\" >\r\n    </mat-form-field>\r\n\r\n    <button  mat-mini-fab color=\"primary\" (click)=\"updateSetting(setting)\" style=\"margin-right:150px;\"><mat-icon>done_all</mat-icon></button>\r\n\r\n    <mat-label style=\"font-size: small;\">Last Updated by {{setting.updatedBy}} on {{setting.updatedDate | date: 'dd MMM yy HH:mm'}}</mat-label>\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n\r\n",
-            styles: [".mat-mini-fab{width:32px;height:32px}.mat-mini-fab mat-icon{font-size:16px;margin-top:-3px}"]
-        })
-    ], SettingsComponent);
-    return SettingsComponent;
-}());
-
-var LogsComponent = /** @class */ (function () {
-    function LogsComponent(authService, dataService) {
-        this.authService = authService;
-        this.dataService = dataService;
-        this.isProcessing = false;
-        this.displayedColumns = ["dateLogged", "userName", "fullName", "source", "details"];
-    }
-    LogsComponent.prototype.ngOnInit = function () {
-        this.authService.isAuthorised(this.dataService.capLogs.name);
-        this.loadLogs();
-    };
-    LogsComponent.prototype.loadLogs = function () {
-        var _this = this;
-        this.dataService.GetLog("all", "").subscribe(function (apiResponse) {
-            _this.logs = new MatTableDataSource(apiResponse);
-            _this.logs.paginator = _this.logsPaginator;
-        });
-    };
-    LogsComponent.ctorParameters = function () { return [
-        { type: AuthService },
-        { type: DataServiceLib }
-    ]; };
-    __decorate([
-        ViewChild("logsPaginator")
-    ], LogsComponent.prototype, "logsPaginator", void 0);
-    LogsComponent = __decorate([
-        Component({
-            selector: 'spa-logs',
-            template: "<h4>Logs</h4>\r\n<hr />\r\n\r\n<div class=\"container-fluid\">\r\n\r\n  <div class=\"row justify-content-between\" style=\"padding-bottom: 10px\">\r\n\r\n    <div class=\"col-2\">\r\n    </div>\r\n\r\n    <div class=\"d-flex justify-content-end\">\r\n      <spa-filter [data]=\"logs\" (refreshClick)=\"loadLogs()\"></spa-filter>\r\n   </div>\r\n  </div>\r\n\r\n\r\n\r\n  <p *ngIf=\"!logs\"><em>Loading...</em></p>\r\n\r\n\r\n  <div class=\"mat-elevation-z8\" *ngIf=\"logs\">\r\n\r\n    <table id=\"tblTable\" mat-table [dataSource]=\"logs\">\r\n\r\n\r\n      <ng-container matColumnDef=\"userName\">\r\n        <th mat-header-cell *matHeaderCellDef> User </th>\r\n        <td mat-cell *matCellDef=\"let log\"> {{log.userName}} </td>\r\n      </ng-container>\r\n\r\n\r\n      <ng-container matColumnDef=\"dateLogged\">\r\n        <th mat-header-cell *matHeaderCellDef class=\"datetime\"> Date Logged </th>\r\n        <td mat-cell *matCellDef=\"let log\"> {{log.dateLogged | date: 'dd MMM yy HH:mm:ss'}} </td>\r\n      </ng-container>\r\n\r\n      <ng-container matColumnDef=\"source\">\r\n        <th mat-header-cell *matHeaderCellDef> Source </th>\r\n        <td mat-cell *matCellDef=\"let log\"> {{log.source}} </td>\r\n      </ng-container>\r\n\r\n      <ng-container matColumnDef=\"details\">\r\n        <th mat-header-cell *matHeaderCellDef> Details </th>\r\n        <td mat-cell *matCellDef=\"let log\"> {{log.details}} </td>\r\n      </ng-container>\r\n\r\n      <ng-container matColumnDef=\"fullName\">\r\n        <th mat-header-cell *matHeaderCellDef> Name </th>\r\n        <td mat-cell *matCellDef=\"let log\">{{log.user.firstName}} {{log.user.lastName}}</td>\r\n      </ng-container>\r\n\r\n\r\n\r\n\r\n      <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n      <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\r\n\r\n\r\n    </table>\r\n\r\n  </div>\r\n\r\n  <mat-paginator #logsPaginator [pageSizeOptions]=\"[50, 100, 200]\" showFirstLastButtons></mat-paginator>\r\n</div>\r\n\r\n",
-            styles: [".mat-mini-fab{width:32px;height:32px}.mat-mini-fab mat-icon{font-size:16px;margin-top:-3px}.refreshIcon{font-size:22px!important;margin-top:-7px!important}"]
-        })
-    ], LogsComponent);
-    return LogsComponent;
-}());
-
-var UsersComponent = /** @class */ (function () {
-    function UsersComponent(httpService, router, authService, dataService, dialog, messageService) {
-        this.httpService = httpService;
-        this.router = router;
-        this.authService = authService;
-        this.dataService = dataService;
-        this.dialog = dialog;
-        this.messageService = messageService;
-        this.isProcessing = false;
-        this._filterText = "";
-        this.displayedColumns = ["userName", "fullName", "roleName", "locked", "dateCreated", "Action"];
-    }
-    UsersComponent.prototype.ngOnInit = function () {
-        this.authService.isAuthorised(this.dataService.capUsers.name);
-        this.UpdateData();
-    };
-    UsersComponent.prototype.UpdateData = function () {
-        var _this = this;
-        this.dataService.GetUser().subscribe(function (apiResponse) {
-            _this.users = new MatTableDataSource(apiResponse);
-            _this.users.paginator = _this.usersPaginator;
-            _this.applyFilter(_this._filterText);
-        }, function (error) {
-            _this.isProcessing = false;
-            _this.messageService.toast(_this.httpService.Error(error));
-        });
-    };
-    UsersComponent.prototype.applyFilter = function (filterValue) {
-        this.users.filter = filterValue.trim().toLowerCase();
-    };
-    UsersComponent.prototype.createAccount = function () {
-        this.router.navigate(["home/admin/create-account"]);
-    };
-    UsersComponent.prototype.viewProfile = function (user) {
-        this.dataService.tmpProfileuserName = user.userName;
-        this.router.navigate(["home/user/profile"]);
-    };
-    UsersComponent.prototype.lock = function (u) {
-        var _this = this;
-        var login = { userName: u.userName, password: "Abcdef@123" };
-        this.dataService.LockUser(login).subscribe(function (apiResponse) {
-            if (apiResponse.success) {
-                _this.messageService.toast("User Locked");
-                _this.UpdateData();
-            }
-            else {
-                _this.messageService.toast("Error: " + apiResponse);
-            }
-        });
-    };
-    UsersComponent.prototype.unlock = function (u) {
-        var _this = this;
-        var login = { userName: u.userName, password: "Abcdef@123" };
-        this.dataService.UnlockUser(login).subscribe(function (apiResponse) {
-            if (apiResponse.success) {
-                _this.messageService.toast("User Unlocked");
-                _this.UpdateData();
-            }
-            else {
-                _this.messageService.toast("Error: " + apiResponse);
-            }
-        });
-    };
-    UsersComponent.prototype.recover = function (u) {
-        var _this = this;
-        this.dataService.SelfReset(u).subscribe(function (apiResponse) {
-            if (apiResponse.message == "success") {
-                _this.messageService.toast("The password has been sent on email");
-            }
-            else {
-                _this.messageService.toast("Error: " + apiResponse.message);
-            }
-        });
-    };
-    UsersComponent.prototype.deleteUser = function (user) {
-        var _this = this;
-        this.messageService.confirm("Delete " + user.userName + " ?").subscribe(function (result) {
-            if (result == "yes") {
-                _this.isProcessing = true;
-                _this.dataService.DeleteUser(user).subscribe(function (apiResponse) {
-                    _this.isProcessing = false;
-                    if (apiResponse.message == "success") {
-                        _this.messageService.toast("User Deleted");
-                        _this.UpdateData();
-                    }
-                    else {
-                        _this.messageService.toast("Error: " + apiResponse.message);
-                    }
-                }, function (error) {
-                    _this.messageService.toast("Connection failed ");
-                    _this.isProcessing = false;
-                });
-            }
-        });
-    };
-    UsersComponent.ctorParameters = function () { return [
-        { type: HttpService },
-        { type: Router },
-        { type: AuthService },
-        { type: DataServiceLib },
-        { type: MatDialog },
-        { type: MessageService }
-    ]; };
-    __decorate([
-        ViewChild("usersPaginator")
-    ], UsersComponent.prototype, "usersPaginator", void 0);
-    UsersComponent = __decorate([
-        Component({
-            selector: "spa-users",
-            template: "\r\n<h4>Users</h4>\r\n<hr />\r\n\r\n<div class=\"container\">\r\n\r\n  <div class=\"row justify-content-between\" style=\"padding-bottom: 10px\">\r\n    <div class=\"col-2\">\r\n      <button id=\"btnCreateAccount\" mat-raised-button color=\"primary\" (click)=\"createAccount()\">Create Account</button>\r\n    </div>\r\n\r\n    <div class=\"d-flex justify-content-end\">\r\n      <spa-filter [data]=\"users\" (refreshClick)=\"UpdateData()\"></spa-filter>\r\n    </div>\r\n  </div>\r\n\r\n\r\n  <p *ngIf=\"!users\"><em>Loading...</em></p>\r\n\r\n\r\n  <div class=\"mat-elevation-z8\" *ngIf=\"users\">\r\n\r\n    <table id=\"tblTable\" mat-table [dataSource]=\"users\">\r\n\r\n      <ng-container matColumnDef=\"userName\">\r\n        <th mat-header-cell *matHeaderCellDef> userName </th>\r\n        <td mat-cell *matCellDef=\"let user\"> {{user.userName}} </td>\r\n      </ng-container>\r\n\r\n      <ng-container matColumnDef=\"locked\">\r\n        <th mat-header-cell *matHeaderCellDef> Locked </th>\r\n        <td mat-cell *matCellDef=\"let user\"> {{user.locked}} </td>\r\n      </ng-container>\r\n\r\n      <ng-container matColumnDef=\"fullName\">\r\n        <th mat-header-cell *matHeaderCellDef> Name </th>\r\n        <td mat-cell *matCellDef=\"let user\"> {{user.firstName}} {{user.lastName}} </td>\r\n      </ng-container>\r\n\r\n      <ng-container matColumnDef=\"roleName\">\r\n        <th mat-header-cell *matHeaderCellDef> Role </th>\r\n        <td mat-cell *matCellDef=\"let user\"> {{user.role.roleName}} </td>\r\n      </ng-container>\r\n\r\n      <ng-container matColumnDef=\"disabled\">\r\n        <th mat-header-cell *matHeaderCellDef> Disabled </th>\r\n        <td mat-cell *matCellDef=\"let user\"> {{user.disabled}} </td>\r\n      </ng-container>\r\n\r\n      <ng-container matColumnDef=\"dateCreated\">\r\n        <th mat-header-cell *matHeaderCellDef> Created </th>\r\n        <td mat-cell *matCellDef=\"let user\"> {{user.createdDate | date: 'dd/MM/yyyy'}} </td>\r\n      </ng-container>\r\n\r\n      <ng-container matColumnDef=\"dateUpdated\">\r\n        <th mat-header-cell *matHeaderCellDef> Updated </th>\r\n        <td mat-cell *matCellDef=\"let user\"> {{user.updatedDate | date: 'dd/MM/yyyy'}} </td>\r\n      </ng-container>\r\n\r\n\r\n      <ng-container matColumnDef=\"Action\">\r\n        <th mat-header-cell *matHeaderCellDef> Action </th>\r\n        <td mat-cell *matCellDef=\"let user\" style=\"width: 250px;\">\r\n\r\n          <button mat-mini-fab color=\"primary\" (click)=\"viewProfile(user)\" style=\"margin-right:30px\" matTooltip=\"View Profile\" matTooltipPosition=\"above\"> <mat-icon>account_circle</mat-icon></button>\r\n\r\n          <button *ngIf=\"user.locked=='0'\" mat-mini-fab color=\"warn\" (click)=\"lock(user)\" style=\"margin-right:10px\" matTooltip=\"Lock\" matTooltipPosition=\"above\"> <mat-icon>lock</mat-icon></button>\r\n          <button *ngIf=\"user.locked=='1'\" mat-mini-fab  (click)=\"unlock(user)\" style=\"margin-right:10px; background-color: green;\" matTooltip=\"Unlock\" matTooltipPosition=\"above\"> <mat-icon >lock_open</mat-icon></button>\r\n\r\n          <!-- <button *ngIf=\"user.disabled=='0'\" mat-mini-fab color=\"warn\" (click)=\"disable(user)\" style=\"margin-right:10px\" matTooltip=\"Disable\" matTooltipPosition=\"above\"> <mat-icon>block</mat-icon></button>\r\n          <button *ngIf=\"user.disabled=='1'\" mat-mini-fab (click)=\"enable(user)\" style=\"margin-right:10px; background-color: green\" matTooltip=\"Enable\" matTooltipPosition=\"above\"> <mat-icon>done</mat-icon></button> -->\r\n\r\n          <button mat-mini-fab color=\"warn\" (click)=\"deleteUser(user)\" style=\"margin-right:10px\" matTooltip=\"Delete\" matTooltipPosition=\"above\"> <mat-icon>delete</mat-icon></button>\r\n          <!-- <button mat-mini-fab color=\"primary\" (click)=\"recover(user)\" style=\"margin-right:10px\" matTooltip=\"Reset Password\" matTooltipPosition=\"above\"> <mat-icon>vpn_key</mat-icon></button> -->\r\n\r\n\r\n\r\n        </td>\r\n      </ng-container>\r\n\r\n\r\n      <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n      <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\" [ngClass]=\"{'make-gray': row.disabled =='1'}\"></tr>\r\n\r\n    </table>\r\n\r\n  </div>\r\n\r\n  <mat-paginator #usersPaginator [pageSizeOptions]=\"[10, 20, 50]\" showFirstLastButtons></mat-paginator>\r\n</div>\r\n",
-            styles: [".mat-mini-fab{width:32px;height:32px}.mat-mini-fab mat-icon{font-size:16px;margin-top:-3px}.refreshIcon{font-size:22px!important;margin-top:-7px!important}.make-gray{background-color:#d3d3d3}"]
-        })
-    ], UsersComponent);
-    return UsersComponent;
-}());
-
-var addRoleDialog = /** @class */ (function () {
-    function addRoleDialog(messageService, dataService, authService, dialogRef, data) {
-        this.messageService = messageService;
-        this.dataService = dataService;
-        this.authService = authService;
-        this.dialogRef = dialogRef;
-        this.data = data;
-        this.role = new Role();
-    }
-    addRoleDialog.prototype.ngOnInit = function () {
-        this.capItems = this.data;
-    };
-    addRoleDialog.prototype.submit = function () {
-        var _this = this;
-        if (this.role.roleName == "New Role" || this.role.roleName == "") {
-            this.messageService.toast("Please enter Role Name");
-            return;
-        }
-        this.isProcessing = true;
-        this.dataService.PostRole(this.role, "add").subscribe(function (apiResponse) {
-            _this.isProcessing = false;
-            if (apiResponse.success) {
-                _this.messageService.toast("Role Added");
-                _this.dialogRef.close("success");
-            }
-            else {
-                _this.messageService.toast("Error: " + apiResponse.message);
-            }
-        }, function (error) {
-            _this.messageService.toast("Connection failed");
-            _this.isProcessing = false;
-        });
-    };
-    ;
-    addRoleDialog.ctorParameters = function () { return [
-        { type: MessageService },
-        { type: DataServiceLib },
-        { type: AuthService },
-        { type: MatDialogRef },
-        { type: undefined, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] }
-    ]; };
-    addRoleDialog = __decorate([
-        Component({
-            selector: 'app-addRole',
-            template: "<mat-form-field>\r\n  <mat-label>Role Name</mat-label>\r\n  <input matInput autocomplete=\"off\" [(ngModel)]=\"role.roleName\" placeholder=\"Enter Role Name\" />\r\n</mat-form-field>\r\n\r\n<mat-dialog-content class=\"mat-typography\">\r\n\r\n  <div class=\"row\" >\r\n\r\n    <!-- <div class=\"  col-4\">\r\n\r\n      <div class=\"row\">\r\n        <mat-checkbox color=\"primary\" style=\"margin-right:20px; font-size:14px\" [(ngModel)]=\"role.cap1\">Admin</mat-checkbox>\r\n      </div>\r\n\r\n    </div> -->\r\n\r\n    <div class=\"row\" style=\"margin-left: 2em;margin-right: 2em;\">\r\n\r\n      <div class=\"row\" style=\"margin-left: 2em;\" *ngFor=\"let capItem of capItems\">\r\n\r\n        <mat-checkbox color=\"primary\" style=\"margin-right:20px; font-size:12px; width: 200px;\" [(ngModel)]=\"role[capItem.name]\">{{capItem.display}}</mat-checkbox>\r\n\r\n        <div *ngFor=\"let capSubItem of capItem.capSubItems\">\r\n\r\n          <mat-checkbox color=\"primary\" style=\"margin-right:20px; font-size:12px; width: 200px;\" [(ngModel)]=\"role[capSubItem.name]\">{{capSubItem.display}}</mat-checkbox>\r\n\r\n        </div>\r\n\r\n\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n  </div>\r\n\r\n</mat-dialog-content>\r\n\r\n<mat-dialog-actions>\r\n  <button mat-button [disabled]=\"isProcessing\" (click)=\"submit()\" cdkFocusInitial>Submit</button>\r\n  <button mat-button mat-dialog-close=\"success\">Cancel</button>\r\n</mat-dialog-actions>\r\n",
-            styles: [".mat-mini-fab{width:32px;height:32px}.mat-mini-fab mat-icon{font-size:16px;margin-top:-3px}.refreshIcon{font-size:22px!important;margin-top:-7px!important}"]
-        }),
-        __param(4, Inject(MAT_DIALOG_DATA))
-    ], addRoleDialog);
-    return addRoleDialog;
-}());
-;
-
-var RolesComponent = /** @class */ (function () {
-    function RolesComponent(httpService, router, authService, dataService, dialog, messageService) {
-        this.httpService = httpService;
-        this.router = router;
-        this.authService = authService;
-        this.dataService = dataService;
-        this.dialog = dialog;
-        this.messageService = messageService;
-        this.isProcessing = false;
-        this.appConfig = new AppConfig();
-    }
-    RolesComponent.prototype.ngOnInit = function () {
-        var _this = this;
-        this.authService.isAuthorised(this.dataService.capRoles.name);
-        this.loadRoles();
-        this.dataService.appConfigObserv.subscribe(function (x) { return _this.appConfig = x; });
-    };
-    RolesComponent.prototype.loadRoles = function () {
-        var _this = this;
-        this.dataService.GetRole("all", "").subscribe(function (apiResponse) {
-            _this.roles = apiResponse;
-        });
-    };
-    RolesComponent.prototype.refresh = function () {
-        this.loadRoles();
-    };
-    RolesComponent.prototype.addRole = function () {
-        var _this = this;
-        var dialogRef = this.dialog.open(addRoleDialog, {
-            width: "1100px",
-            data: this.appConfig.capItems,
-        });
-        dialogRef.afterClosed().subscribe(function (result) {
-            if (result == "success") {
-                _this.loadRoles();
-            }
-        });
-    };
-    RolesComponent.prototype.updateRole = function (role) {
-        var _this = this;
-        this.messageService.confirm("UPDATE " + role.roleName + " ?").subscribe(function (result) {
-            if (result == "yes") {
-                _this.dataService.PostRole(role, "edit").subscribe(function (apiResponse) {
-                    if (apiResponse.success) {
-                        _this.messageService.toast("Role Updated");
-                        _this.loadRoles();
-                    }
-                    else {
-                        _this.messageService.toast("Error: " + apiResponse);
-                    }
-                });
-            }
-        });
-    };
-    ;
-    RolesComponent.prototype.deleteRole = function (role) {
-        var _this = this;
-        this.messageService.confirm("DELETE " + role.roleName + " ?").subscribe(function (result) {
-            if (result == "yes") {
-                _this.dataService.PostRole(role, "delete").subscribe(function (apiResponse) {
-                    if (apiResponse.success) {
-                        _this.messageService.toast("Role Deleted");
-                        _this.loadRoles();
-                    }
-                    else {
-                        _this.messageService.toast("Error: " + apiResponse);
-                    }
-                });
-            }
-        });
-    };
-    RolesComponent.ctorParameters = function () { return [
-        { type: HttpService },
-        { type: Router },
-        { type: AuthService },
-        { type: DataServiceLib },
-        { type: MatDialog },
-        { type: MessageService }
-    ]; };
-    RolesComponent = __decorate([
-        Component({
-            selector: "spa-roles",
-            template: "<h4> Roles </h4>\r\n<hr />\r\n\r\n<div class=\"container mb-5\">\r\n\r\n  <div class=\"row justify-content-between\" style=\"padding-bottom: 10px;padding-left:10px\">\r\n    <div class=\"col-2\">\r\n\r\n      <button id=\"btnNewRole\" mat-raised-button color=\"primary\" (click)=\"addRole()\">New Role</button>\r\n    </div>\r\n    <div class=\"col-1\">\r\n\r\n      <button id=\"btnRefresh\" mat-mini-fab color=\"primary\" (click)=\"refresh()\" style=\"margin-right:1em;margin-top:5px\" matTooltip=\"refresh data\" matTooltipPosition=\"right\"><mat-icon class=\"refreshIcon\">refresh</mat-icon></button>\r\n\r\n    </div>\r\n  </div>\r\n\r\n\r\n  <div class=\"row mt-2 mb-1\" style=\"margin-left:10px\" *ngFor=\"let role of roles\">\r\n\r\n    <mat-card class=\"mat-elevation-z8\" style=\"width:100%;padding-left:2em\">\r\n\r\n      <h4>{{role.roleName}}</h4>\r\n      <hr />\r\n\r\n      <div class=\"row\" style=\"margin-left: 2em;\">\r\n\r\n\r\n        <div class=\"row\" style=\"margin-right:20px;\"  *ngFor=\"let capItem of appConfig.capItems\">\r\n\r\n          <mat-checkbox color=\"primary\" style=\" font-size:12px; width: 200px;\" [(ngModel)]=\"role[capItem.name]\">{{capItem.display}}</mat-checkbox>\r\n\r\n          <div class=\"row\" style=\"margin-right:20px;margin-left: 0px; \" *ngFor=\"let capSubItem of capItem.capSubItems\">\r\n\r\n            <mat-checkbox   color=\"primary\" style=\" font-size:12px; width: 200px;\" [(ngModel)]=\"role[capSubItem.name]\">{{capSubItem.display}}</mat-checkbox>\r\n\r\n            <div class=\"row\" style=\"margin-right:20px;margin-left: 0px;\" *ngFor=\"let capSubSubItem of capSubItem.capSubItems\">\r\n\r\n              <mat-checkbox   color=\"primary\" style=\"font-size:12px; width: 200px;\" [(ngModel)]=\"role[capSubSubItem.name]\">{{capSubSubItem.display}}</mat-checkbox>\r\n\r\n            </div>\r\n\r\n          </div>\r\n\r\n        </div>\r\n\r\n      </div>\r\n\r\n\r\n      <mat-card-actions>\r\n\r\n        <button  mat-mini-fab color=\"primary\" (click)=\"updateRole(role)\" style=\"margin-right:10px;\">\r\n           <mat-icon>done_all</mat-icon>\r\n        </button>\r\n\r\n        <!-- <button mat-mini-fab color=\"warn\" (click)=\"editRole(role)\" style=\"margin-right:10px\">\r\n          <mat-icon>edit</mat-icon>\r\n        </button> -->\r\n\r\n        <button mat-mini-fab color=\"warn\" (click)=\"deleteRole(role)\" style=\"margin-right:10px\">\r\n          <mat-icon>delete</mat-icon>\r\n        </button>\r\n\r\n      </mat-card-actions>\r\n\r\n    </mat-card>\r\n\r\n  </div>\r\n\r\n\r\n</div>\r\n\r\n",
-            styles: [".mat-mini-fab{width:32px;height:32px}.mat-mini-fab mat-icon{font-size:16px;margin-top:-3px}.refreshIcon{font-size:22px!important;margin-top:-7px!important}"]
-        })
-    ], RolesComponent);
-    return RolesComponent;
-}());
-
-var CreateAccountComponent = /** @class */ (function () {
-    function CreateAccountComponent(httpService, messageService, dataService, authService, router) {
-        this.httpService = httpService;
-        this.messageService = messageService;
-        this.dataService = dataService;
-        this.authService = authService;
-        this.router = router;
-        this.appConfig = new AppConfig();
-        this.isProcessing = false;
-        this.register = new Register();
-        this.openProfile = true;
-        this.authTypes = [
-            { name: "Local Authentication", value: "local" },
-            { name: "AD Authentication", value: "AD" }
-        ];
-    }
-    CreateAccountComponent.prototype.ngOnInit = function () {
-        this.appConfig = this.dataService.appConfig;
-    };
-    CreateAccountComponent.prototype.create = function () {
-        var _this = this;
-        if (this.register.authType == "") {
-            this.messageService.toast("Choose Authentication Type");
-            return;
-        }
-        this.isProcessing = true;
-        this.dataService.RegisterAccount(this.register).subscribe(function (apiResponse) {
-            _this.isProcessing = false;
-            if (apiResponse.success) {
-                _this.messageService.toast("Account Created");
-                if (_this.openProfile) {
-                    _this.viewProfile(_this.register.userName);
-                }
-                else {
-                    // this.user = new User();
-                    _this.register = new Register();
-                    _this.confirmPassword = "";
-                }
-            }
-            else {
-                _this.messageService.toast("Error: " + apiResponse.message);
-            }
-        }, function (error) {
-            _this.isProcessing = false;
-            _this.messageService.toast(_this.httpService.Error(error));
-        });
-    };
-    CreateAccountComponent.prototype.viewProfile = function (userName) {
-        this.dataService.tmpProfileuserName = userName;
-        this.router.navigate(["home/user/profile"]);
-    };
-    CreateAccountComponent.ctorParameters = function () { return [
-        { type: HttpService },
-        { type: MessageService },
-        { type: DataServiceLib },
-        { type: AuthService },
-        { type: Router }
-    ]; };
-    __decorate([
-        Input()
-    ], CreateAccountComponent.prototype, "appConfig", void 0);
-    CreateAccountComponent = __decorate([
-        Component({
-            selector: 'spa-create-account',
-            template: "<h4>Create Account</h4>\r\n\r\n<hr/>\r\n\r\n<div class=\"container\">\r\n\r\n  <div class=\"tin-input\" style=\"font-size:14px; width: 70%;\">\r\n\r\n\r\n    <div class=\"tin-input-row\">\r\n\r\n      <div class=\"col\">\r\n          <spa-text id=\"txtFirstName\" display=\"FirstName\" [(value)]=\"register.firstName\"></spa-text>\r\n      </div>\r\n\r\n      <div class=\"col\">\r\n         <spa-text id=\"txtLastName\" display=\"LastName\" [(value)]=\"register.lastName\"></spa-text>\r\n      </div>\r\n\r\n    </div>\r\n\r\n\r\n    <div class=\"tin-input-row mt-3\">\r\n\r\n      <div class=\"col\">\r\n        <spa-text id=\"txtUserName\" display=\"Username\" [(value)]=\"register.userName\"></spa-text>\r\n      </div>\r\n\r\n      <div class=\"col\">\r\n        <spa-select id=\"cboAuth\" display=\"Authentication Type\" [options]=\"authTypes\" optionDisplay=\"name\" optionValue=\"value\"  [(value)]=\"register.authType\" ></spa-select>\r\n      </div>\r\n\r\n    </div>\r\n\r\n\r\n    <div class=\"tin-input-row\" *ngIf=\"register.authType=='local'\">\r\n\r\n      <div class=\"col\">\r\n        <spa-text id=\"txtPassword\" display=\"Password\" [(value)]=\"register.password\" type=\"password\"></spa-text>\r\n      </div>\r\n\r\n      <div class=\"col\">\r\n        <spa-text id=\"txtConfirmPassword\" display=\"Confirm Password\" [(value)]=\"confirmPassword\" type=\"password\"></spa-text>\r\n      </div>\r\n\r\n    </div>\r\n\r\n\r\n    <div class=\"tin-input-row mt-3\" style=\"margin-left: 1em;\">\r\n      <mat-checkbox id=\"cbkOpenAfter\" color=\"primary\" style=\"margin-right:100px; font-size:12px\" [(ngModel)]=\"openProfile\">Open profile after creation</mat-checkbox>\r\n    </div>\r\n\r\n    <div class=\"tin-input-row mt-3\">\r\n      <button id=\"btnCreate\" [disabled]=\"register.authType ==''\" mat-raised-button color=\"primary\" (click)=\"create()\" cdkFocusInitial>Create</button>\r\n    </div>\r\n\r\n  </div>\r\n</div>\r\n\r\n",
-            styles: [""]
-        })
-    ], CreateAccountComponent);
-    return CreateAccountComponent;
-}());
-
-var SpaAdminModule = /** @class */ (function () {
-    function SpaAdminModule() {
-    }
-    SpaAdminModule = __decorate([
-        NgModule({
-            declarations: [
-                UsersComponent,
-                RolesComponent,
-                addRoleDialog,
-                CreateAccountComponent,
-                LogsComponent,
-                SettingsComponent
-            ],
-            entryComponents: [
-                addRoleDialog,
-            ],
-            imports: [
-                ReactiveFormsModule.withConfig({ warnOnNgModelWithFormControl: "never" }),
-                CommonModule,
-                FormsModule,
-                ReactiveFormsModule,
-                SpaMatModule,
-                TinSpaModule
-            ],
-            exports: [
-                CommonModule,
-                FormsModule,
-                SpaMatModule,
-                UsersComponent,
-                RolesComponent,
-                addRoleDialog,
-                CreateAccountComponent,
-                LogsComponent,
-                SettingsComponent
-            ],
-        })
-    ], SpaAdminModule);
-    return SpaAdminModule;
-}());
-
-/*
- * Public API Surface of tin-spa
- */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { Account, ActionResponse, ActivityComponent, ApiResponse, AppConfig, AttachComponent, AuthService, CapItem, ChangePasswordComponent, ChangeUserPassword, CheckComponent, ChipsComponent, Color, Condition, Constants, Core, CreateAccountComponent, DataServiceLib, DateComponent, DatetimeComponent, ExportService, FilterComponent, HttpService, Icon, LabelComponent, LoaderComponent, LogLevel, LogService, LoginComponent, LogsComponent, MessageService, MoneyComponent, NavMenuComponent, Operator, OptionComponent, Profile, ProfileComponent, RecoverAccountComponent, Register, Role, RolesComponent, SelectComponent, SettingsComponent, SignupComponent, SpaAdminModule, SpaIndexModule, SpaMatModule, SpaUserModule, Step, StepsComponent, StorageService, TableAction, TableColumn, TableColumnType, TableComponent, TableConfig, TableCreate, TextComponent, Tile, TilesComponent, TimeoutComponent, TinSpaComponent, TinSpaModule, TinSpaService, User, UsersComponent, addRoleDialog, loginConfig, messageDialog, ɵ0, DndDirective as ɵa, LoaderService as ɵb, LoaderInterceptor as ɵc };
-//# sourceMappingURL=tin-spa.js.map