ngx-techlify-core 11.2.4 → 11.2.8

package/bundles/ngx-techlify-core.umd.js

@@ -865,25 +865,27 @@
         }
         ErrorHandlerService.prototype.handleError = function (errorResponse, msg) {
             if (msg === void 0) { msg = ''; }
-            var _a;
+            var _a, _b, _c, _d;
             // 1 - Create empty array to store errors
             var errors = [];
             // 2 - check if the error object is present in the response
-            if (errorResponse.error) {
-                // 3 - Push the main error message to the array of errors
-                errors.push(errorResponse.error.message ? errorResponse.error.message : (_a = errorResponse.error) === null || _a === void 0 ? void 0 : _a.error);
-                // 4 - Check for Laravel form validation error messages object
-                if (errorResponse.error.errors) {
-                    // 5 - For each error property (which is a form field)
+            if (errorResponse === null || errorResponse === void 0 ? void 0 : errorResponse.error) {
+                // 3 - Check for Laravel form validation error messages object
+                if ((_a = errorResponse === null || errorResponse === void 0 ? void 0 : errorResponse.error) === null || _a === void 0 ? void 0 : _a.errors) {
+                    // 4 - For each error property (which is a form field)
                     for (var property in errorResponse.error.errors) {
-                        if (errorResponse.error.errors.hasOwnProperty(property)) {
-                            // 6 - Extract it's array of errors
-                            var propertyErrors = errorResponse.error.errors[property];
-                            // 7 - Push all errors in the array to the errors array
+                        if ((_b = errorResponse.error.errors) === null || _b === void 0 ? void 0 : _b.hasOwnProperty(property)) {
+                            // 5 - Extract it's array of errors
+                            var propertyErrors = (_c = errorResponse === null || errorResponse === void 0 ? void 0 : errorResponse.error) === null || _c === void 0 ? void 0 : _c.errors[property];
+                            // 6 - Push all errors in the array to the errors array
                             propertyErrors.forEach(function (error) { return errors.push(error); });
                         }
                     }
                 }
+                if (errors.length === 0) {
+                    // 7 - Push the main error message to the array of errors if there is no validation error
+                    errors.push(errorResponse.error.message ? errorResponse.error.message : (_d = errorResponse.error) === null || _d === void 0 ? void 0 : _d.error);
+                }
             }
             var errMessage = errors.length ? errors[0] : msg;
             this.alerter.addAlert("Error: " + errMessage, "warning");
@@ -1935,10 +1937,11 @@
         };
         //Method to trigger login
         NoteFormComponent.prototype.submit = function () {
+            var _a;
             return __awaiter(this, void 0, void 0, function () {
-                var model, result, _a;
-                return __generator(this, function (_b) {
-                    switch (_b.label) {
+                var model, result, _b;
+                return __generator(this, function (_c) {
+                    switch (_c.label) {
                         case 0:
                             this.noteFormFirstAttempt = true;
                             if (!this.noteFormGroup.valid) return [3 /*break*/, 5];
@@ -1946,17 +1949,17 @@
                             if (!this.updateMode) return [3 /*break*/, 2];
                             return [4 /*yield*/, this.noteService.editNote(model)];
                         case 1:
-                            _a = _b.sent();
+                            _b = _c.sent();
                             return [3 /*break*/, 4];
                         case 2: return [4 /*yield*/, this.noteService.addNote(model)];
                         case 3:
-                            _a = _b.sent();
-                            _b.label = 4;
+                            _b = _c.sent();
+                            _c.label = 4;
                         case 4:
-                            result = _a;
-                            this.alertService.addAlert("Note saved successfully", "success");
+                            result = _b;
+                            this.alertService.addAlert(((_a = this.data) === null || _a === void 0 ? void 0 : _a.labelText) + " saved successfully", "success");
                             this.dialogRef.close(result);
-                            _b.label = 5;
+                            _c.label = 5;
                         case 5: return [2 /*return*/];
                     }
                 });
@@ -1978,7 +1981,7 @@
     NoteFormComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'app-note-form',
-                    template: "<form [formGroup]=\"noteFormGroup\" (ngSubmit)=\"submit()\">\n    <div fxLayout=\"column\" class=\"mat-typography\">\n        <div mat-dialog-title class=\"text-center\">\n            <div>Note</div>\n        </div>\n\n        <div mat-dialog-content fxLayout=\"column\">\n            <div fxLayout=\"row wrap\" fxLayoutAlign=\"space-between\">\n                <mat-form-field fxFlex=\"100%\">\n                    <textarea matInput formControlName=\"note\" placeholder=\"Note\" autocomplete=\"off\" required></textarea>\n                    <mat-error *ngIf=\"isFieldValid('note')\">{{\n                      getErrorMessage(\"note\")\n                    }}</mat-error>\n                </mat-form-field>\n\n                <div class=\"my-2\" fxLayout=\"row\" fxLayoutGap=\"30px\" fxLayoutAlign=\"end\" fxFlex=\"100%\">\n                    <button mat-raised-button type=\"button\" (click)=\"cancel()\">\n                        Cancel\n                    </button>\n                    <button mat-raised-button type=\"submit\" color=\"primary\">Save</button>\n                </div>\n            </div>\n        </div>\n    </div>\n</form>",
+                    template: "<form [formGroup]=\"noteFormGroup\" (ngSubmit)=\"submit()\">\n    <div fxLayout=\"column\" class=\"mat-typography\">\n        <div mat-dialog-title class=\"text-center\">\n            <div>{{data?.labelText}}</div>\n        </div>\n\n        <div mat-dialog-content fxLayout=\"column\">\n            <div fxLayout=\"row wrap\" fxLayoutAlign=\"space-between\">\n                <mat-form-field fxFlex=\"100%\">\n                    <textarea matInput formControlName=\"note\" placeholder=\"{{data?.labelText}}\" autocomplete=\"off\"\n                        required></textarea>\n                    <mat-error *ngIf=\"isFieldValid('note')\">{{\n                        getErrorMessage(\"note\")\n                        }}</mat-error>\n                </mat-form-field>\n\n                <div class=\"my-2\" fxLayout=\"row\" fxLayoutGap=\"30px\" fxLayoutAlign=\"end\" fxFlex=\"100%\">\n                    <button mat-raised-button type=\"button\" (click)=\"cancel()\">\n                        Cancel\n                    </button>\n                    <button mat-raised-button type=\"submit\" color=\"primary\">Save</button>\n                </div>\n            </div>\n        </div>\n    </div>\n</form>",
                     styles: [""]
                 },] }
     ];
@@ -1992,11 +1995,11 @@
     ]; };
 
     var NoteListComponent = /** @class */ (function () {
-        function NoteListComponent(noteService, alertService, dialog) {
+        function NoteListComponent(noteService, dialog) {
             this.noteService = noteService;
-            this.alertService = alertService;
             this.dialog = dialog;
             this.readonly = false;
+            this.labelText = 'Note';
             this.notes = [];
             this.displayedColumns = [
                 'index',
@@ -2037,7 +2040,8 @@
             var dialogRef = this.dialog.open(NoteFormComponent, {
                 width: "400px",
                 data: {
-                    note: { related_model_id: this.relatedModelId, model_type: this.modelType }
+                    note: { related_model_id: this.relatedModelId, model_type: this.modelType },
+                    labelText: this.labelText,
                 },
                 autoFocus: false
             });
@@ -2054,7 +2058,8 @@
                 width: "400px",
                 data: {
                     note: note,
-                    update: true
+                    update: true,
+                    labelText: this.labelText
                 },
                 autoFocus: false
             });
@@ -2073,8 +2078,8 @@
                     dialogRef = this.dialog.open(ActionPopupComponent, {
                         width: "400px",
                         data: {
-                            title: "Delete Note",
-                            message: "Are you sure to delete the note?"
+                            title: "Delete " + this.labelText,
+                            message: "Are you sure to delete?"
                         },
                         autoFocus: false
                     });
@@ -2113,19 +2118,19 @@
     NoteListComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'app-note-list',
-                    template: "<div fxLayout=\"column\" fxLayoutGap=\"1.5rem\" class=\"m-4\">\n\n    <div fxLayout fxLayoutAlign=\"start center\" fxLayoutGap=\"1rem\">\n        <h3 class=\"m-0 font-weight-bold mr-3\">Notes</h3>\n        <button class=\"d-print-none\" *ngIf=\"!readonly\" mat-raised-button color=\"primary\" type=\"button\"\n            (click)=\"addNote()\">+ Add</button>\n    </div>\n\n    <div class=\"w-00 scroll-container\" infiniteScroll [infiniteScrollDistance]=\"1\" [infiniteScrollThrottle]=\"50\"\n        (scrolled)=\"onScroll()\" [scrollWindow]=\"false\">\n        <table mat-table [dataSource]=\"notes\" class=\"w-100\" multiTemplateDataRows>\n\n            <!-- Index Column -->\n            <ng-container matColumnDef=\"index\">\n                <th mat-header-cell *matHeaderCellDef> # </th>\n                <td mat-cell *matCellDef=\"let note; let i = dataIndex\"> {{ i+1 }} </td>\n            </ng-container>\n\n\n            <ng-container matColumnDef=\"note\">\n                <th mat-header-cell *matHeaderCellDef> Note </th>\n                <td mat-cell *matCellDef=\"let note\">\n                    {{note?.note}}\n                </td>\n            </ng-container>\n\n            <ng-container matColumnDef=\"actions\">\n                <th mat-header-cell *matHeaderCellDef class=\"d-print-none\"> Actions </th>\n                <td mat-cell *matCellDef=\"let note\" class=\"d-print-none\">\n                    <button type=\"button\" mat-icon-button (click)=\"editNote(note)\">\n                        <mat-icon>edit</mat-icon>\n                    </button>\n                    <button type=\"button\" mat-icon-button (click)=\"deleteNote(note)\">\n                        <mat-icon>delete</mat-icon>\n                    </button>\n                </td>\n            </ng-container>\n            <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n            <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n        </table>\n    </div>\n\n</div>",
+                    template: "<div fxLayout=\"column\" fxLayoutGap=\"1.5rem\" class=\"m-4\">\n\n    <div fxLayout fxLayoutAlign=\"center center\" fxLayoutGap=\"1rem\">\n        <h3 class=\"m-0 font-weight-bold mr-3\">{{labelText}}s</h3>\n        <button class=\"d-print-none\" *ngIf=\"!readonly\" mat-raised-button color=\"primary\" type=\"button\"\n            (click)=\"addNote()\">+ Add</button>\n    </div>\n\n    <div class=\"w-00 scroll-container\" infiniteScroll [infiniteScrollDistance]=\"1\" [infiniteScrollThrottle]=\"50\"\n        (scrolled)=\"onScroll()\" [scrollWindow]=\"false\">\n        <table mat-table [dataSource]=\"notes\" class=\"w-100\" multiTemplateDataRows>\n\n            <!-- Index Column -->\n            <ng-container matColumnDef=\"index\">\n                <th mat-header-cell *matHeaderCellDef> # </th>\n                <td mat-cell *matCellDef=\"let note; let i = dataIndex\"> {{ i+1 }} </td>\n            </ng-container>\n\n\n            <ng-container matColumnDef=\"note\">\n                <th mat-header-cell *matHeaderCellDef> {{labelText}} </th>\n                <td mat-cell *matCellDef=\"let note\">\n                    {{note?.note}}\n                </td>\n            </ng-container>\n\n            <ng-container matColumnDef=\"actions\">\n                <th mat-header-cell *matHeaderCellDef class=\"d-print-none\"> Actions </th>\n                <td mat-cell *matCellDef=\"let note\" class=\"d-print-none\">\n                    <button type=\"button\" mat-icon-button (click)=\"editNote(note)\">\n                        <mat-icon>edit</mat-icon>\n                    </button>\n                    <button type=\"button\" mat-icon-button (click)=\"deleteNote(note)\">\n                        <mat-icon>delete</mat-icon>\n                    </button>\n                </td>\n            </ng-container>\n            <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n            <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n        </table>\n    </div>\n\n</div>",
                     styles: [".scroll-container{max-height:400px;overflow-y:auto}"]
                 },] }
     ];
     NoteListComponent.ctorParameters = function () { return [
         { type: NoteService },
-        { type: AlertService },
         { type: dialog.MatDialog }
     ]; };
     NoteListComponent.propDecorators = {
         relatedModelId: [{ type: i0.Input }],
         modelType: [{ type: i0.Input }],
-        readonly: [{ type: i0.Input }]
+        readonly: [{ type: i0.Input }],
+        labelText: [{ type: i0.Input }]
     };
 
     var SearchableSelectorComponent_1;
@@ -2146,6 +2151,7 @@
             this.edit = false;
             this.sort = true;
             this.selectionChange = new i0.EventEmitter();
+            this.itemsChange = new i0.EventEmitter();
             this.isLoading = false;
             this.onChange = function () { };
             this.onTouched = function () { };
@@ -2234,7 +2240,10 @@
                     items = __spread([this.selectedValue], this.items);
                 else
                     items = this.items;
-                return items.filter(function (v, i, a) { return a.findIndex(function (v) { return v[_this.valueField] === a[i][_this.valueField]; }) === i; });
+                items = items.filter(function (v, i, a) { return a.findIndex(function (v) { return v[_this.valueField] === a[i][_this.valueField]; }) === i; });
+                //Emit the items to any child component
+                this.itemsChange.emit(items);
+                return items;
             },
             enumerable: false,
             configurable: true
@@ -2411,6 +2420,7 @@
         searchField: [{ type: i0.Input }],
         itemComponent: [{ type: i0.Input }],
         selectionChange: [{ type: i0.Output }],
+        itemsChange: [{ type: i0.Output }],
         required: [{ type: i0.Input }],
         disabled: [{ type: i0.Input }],
         value: [{ type: i0.Input }]
@@ -2618,12 +2628,12 @@
     };
 
     function calculateTimeline(value) {
+        var date = new Date();
         var data = {
             'date_from': date,
             'date_to': date,
             'show_custom_field': false
         };
-        var date = new Date();
         switch (value) {
             case 1: { //Custom
                 data.show_custom_field = true;
@@ -2741,10 +2751,14 @@
                 { value: 11, viewValue: 'Last Year' },
                 { value: 12, viewValue: 'All dates' },
             ];
+            this.labelText = 'Select Timeline';
+            this.dateFrom = 'date_from';
+            this.dateTo = 'date_to';
             this.showCustomDateFields = false;
         }
         Object.defineProperty(TimelineFilterComponent.prototype, "defaultValue", {
             set: function (value) {
+                this.timelineValue = value;
                 this.changeTimeline(value);
             },
             enumerable: false,
@@ -2764,8 +2778,8 @@
         TimelineFilterComponent.prototype.changeTimeline = function (value) {
             var timeline = calculateTimeline(value);
             if (timeline) {
-                this.setFieldValue('date_from', timeline.date_from);
-                this.setFieldValue('date_to', timeline.date_to);
+                this.setFieldValue(this.dateFrom, timeline.date_from);
+                this.setFieldValue(this.dateTo, timeline.date_to);
                 this.showCustomDateFields = timeline.show_custom_field;
             }
         };
@@ -2774,13 +2788,16 @@
     TimelineFilterComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'app-timeline-filter',
-                    template: "<ng-container [formGroup]=\"form\">\n    <mat-form-field>\n        <mat-label>Select Timeline</mat-label>\n        <mat-select (selectionChange)=\"changeTimeline($event.value)\">\n            <mat-option *ngFor=\"let timeline of timelines\" [value]=\"timeline.value\">\n                {{timeline.viewValue}}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <ng-container *ngIf=\"showCustomDateFields\">\n        <mat-form-field>\n            <input matInput formControlName=\"date_from\" [matDatepicker]=\"fromPicker\" (click)=\"fromPicker.open()\"\n                placeholder=\"From Date\" readonly />\n            <mat-datepicker-toggle matSuffix [for]=\"fromPicker\"></mat-datepicker-toggle>\n            <mat-datepicker #fromPicker></mat-datepicker>\n            <button mat-button *ngIf=\"getFieldValue('date_from')\" matSuffix mat-icon-button\n                (click)=\"resetFieldValue('date_from')\">\n                <mat-icon>close</mat-icon>\n            </button>\n        </mat-form-field>\n\n        <mat-form-field>\n            <input matInput formControlName=\"date_to\" [matDatepicker]=\"toPicker\" (click)=\"toPicker.open()\"\n                placeholder=\"To Date\" readonly />\n            <mat-datepicker-toggle matSuffix [for]=\"\"></mat-datepicker-toggle>\n            <mat-datepicker #toPicker></mat-datepicker>\n            <button mat-button *ngIf=\"getFieldValue('date_to')\" matSuffix mat-icon-button\n                (click)=\"resetFieldValue('date_to')\">\n                <mat-icon>close</mat-icon>\n            </button>\n        </mat-form-field>\n\n    </ng-container>\n</ng-container>",
+                    template: "<ng-container [formGroup]=\"form\">\n    <mat-form-field>\n        <mat-label>{{labelText}}</mat-label>\n        <mat-select (selectionChange)=\"changeTimeline($event.value)\" [value]=\"timelineValue\">\n            <mat-option *ngFor=\"let timeline of timelines\" [value]=\"timeline.value\">\n                {{timeline.viewValue}}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <ng-container *ngIf=\"showCustomDateFields\">\n        <mat-form-field>\n            <input matInput formControlName=\"{{dateFrom}}\" [matDatepicker]=\"fromPicker\" (click)=\"fromPicker.open()\"\n                placeholder=\"From Date\" readonly />\n            <mat-datepicker-toggle matSuffix [for]=\"fromPicker\"></mat-datepicker-toggle>\n            <mat-datepicker #fromPicker></mat-datepicker>\n            <button mat-button *ngIf=\"getFieldValue(dateFrom)\" matSuffix mat-icon-button\n                (click)=\"resetFieldValue(dateFrom)\">\n                <mat-icon>close</mat-icon>\n            </button>\n        </mat-form-field>\n\n        <mat-form-field>\n            <input matInput formControlName=\"{{dateTo}}\" [matDatepicker]=\"toPicker\" (click)=\"toPicker.open()\"\n                placeholder=\"To Date\" readonly />\n            <mat-datepicker-toggle matSuffix [for]=\"\"></mat-datepicker-toggle>\n            <mat-datepicker #toPicker></mat-datepicker>\n            <button mat-button *ngIf=\"getFieldValue(dateTo)\" matSuffix mat-icon-button\n                (click)=\"resetFieldValue(dateTo)\">\n                <mat-icon>close</mat-icon>\n            </button>\n        </mat-form-field>\n\n    </ng-container>\n</ng-container>",
                     styles: [""]
                 },] }
     ];
     TimelineFilterComponent.ctorParameters = function () { return []; };
     TimelineFilterComponent.propDecorators = {
         timelines: [{ type: i0.Input }],
+        labelText: [{ type: i0.Input }],
+        dateFrom: [{ type: i0.Input }],
+        dateTo: [{ type: i0.Input }],
         form: [{ type: i0.Input }],
         defaultValue: [{ type: i0.Input }]
     };