ngx-techlify-core 11.4.5 → 11.4.6

package/fesm2015/ngx-techlify-core.js

@@ -441,6 +441,7 @@ class TechlifyConfig {
         this.authClientSecret = '';
         this.authGrantType = '';
         this.apiUrl = '';
+        this.isLogoutWhileApiGetsFailed = false;
         this.loadFromMap(data);
     }
     loadFromMap(data) {
@@ -451,6 +452,7 @@ class TechlifyConfig {
         this.apiUrl = data.apiUrl;
         this.storage = data === null || data === void 0 ? void 0 : data.storage;
         this.rawConfigs = data;
+        this.isLogoutWhileApiGetsFailed = data === null || data === void 0 ? void 0 : data.isLogoutWhileApiGetsFailed;
     }
 }
 
@@ -570,8 +572,9 @@ AlertService.ctorParameters = () => [
  * @since 20171202
  */
 class ErrorHandlerService {
-    constructor(alerter) {
+    constructor(alerter, config) {
         this.alerter = alerter;
+        this.config = config;
     }
     handleError(errorResponse, msg = '') {
         var _a, _b, _c, _d;
@@ -598,16 +601,22 @@ class ErrorHandlerService {
         }
         var errMessage = errors.length ? errors[0] : msg;
         this.alerter.addAlert("Error: " + errMessage, "warning");
+        if (errorResponse.status == 403 && this.config.isLogoutWhileApiGetsFailed) {
+            sessionStorage.clear();
+            localStorage.clear();
+            location.reload();
+        }
     }
 }
-ErrorHandlerService.ɵprov = ɵɵdefineInjectable({ factory: function ErrorHandlerService_Factory() { return new ErrorHandlerService(ɵɵinject(AlertService)); }, token: ErrorHandlerService, providedIn: "root" });
+ErrorHandlerService.ɵprov = ɵɵdefineInjectable({ factory: function ErrorHandlerService_Factory() { return new ErrorHandlerService(ɵɵinject(AlertService), ɵɵinject(TechlifyConfig)); }, token: ErrorHandlerService, providedIn: "root" });
 ErrorHandlerService.decorators = [
     { type: Injectable, args: [{
                 providedIn: 'root'
             },] }
 ];
 ErrorHandlerService.ctorParameters = () => [
-    { type: AlertService }
+    { type: AlertService },
+    { type: TechlifyConfig }
 ];
 
 const log = new Logger('ErrorHandlerInterceptor');
@@ -1052,9 +1061,13 @@ class EntityFileService {
     deleteEntityFile(model) {
         return this.http.delete(`api/entity-files/${model.id}`).toPromise();
     }
-    uploadEntityFile(file) {
+    uploadEntityFile(file, params) {
         const formData = new FormData();
         formData.append("fileData", file, file.name);
+        if (params === null || params === void 0 ? void 0 : params.entity_id) {
+            formData.append('entity_id', params.entity_id);
+            formData.append('entity_type', params.entity_type);
+        }
         return this.http
             .skipHeader()
             .post("api/entity-files-upload", formData).toPromise();
@@ -1117,7 +1130,8 @@ class EntityFileFormComponent {
             entity_type: [''],
             entity_id: [],
             file: ['', Validators.required],
-            url: ['', Validators.required]
+            url: ['', Validators.required],
+            file_size: ['', Validators.required],
         });
     }
     ngOnInit() {
@@ -1175,12 +1189,8 @@ class EntityFileFormComponent {
             this.fileList = event;
             if (this.fileList.length > 0) {
                 const result = yield this.entityFileService.uploadEntityFile(this.fileList[0]);
-                this.entityFileGroup
-                    .get("file")
-                    .setValue(result.item.file);
-                this.entityFileGroup
-                    .get("url")
-                    .setValue(result.item.url);
+                this.entityFileGroup.patchValue(result.item);
+                ;
                 this.fileList = [];
             }
         });
@@ -1212,7 +1222,7 @@ class EntityFileFormComponent {
 EntityFileFormComponent.decorators = [
     { type: Component, args: [{
                 selector: 'entity-file-form',
-                template: "<form [formGroup]=\"entityFileGroup\" (ngSubmit)=\"submit()\">\n    <div fxLayout=\"column\" class=\"mat-typography\">\n        <div mat-dialog-title class=\"text-center\">\n            <div>Entity File</div>\n        </div>\n\n        <div mat-dialog-content fxLayout=\"column\" fxLayoutAlign.=\"start\">\n            <ng-container *ngIf=\"!hideTitleAndDetails\">\n                <mat-form-field>\n                    <input type=\"text\" matInput formControlName=\"title\" placeholder=\"Title\" autocomplete=\"off\">\n                </mat-form-field>\n                <mat-form-field>\n                    <textarea matInput formControlName=\"details\" placeholder=\"Details\" autocomplete=\"off\"></textarea>\n                </mat-form-field>\n            </ng-container>\n\n            <ng-template #fileUpload>\n                <section fxFlex=\"100%\">\n                    <div>Entity File*</div>\n                    <app-file-dropper [config]=\"fileConfig\" (fileChanged)=\"fileChanged($event)\" [fileArray]=\"fileList\">\n                    </app-file-dropper>\n                    <div class=\"text-danger\" *ngIf=\"isFieldValid('url')\">\n                        {{getErrorMessage(\"url\")}}\n                    </div>\n                </section>\n            </ng-template>\n\n\n            <div fxFlex=\"100%\" class=\"mt-2\" *ngIf=\"entityFileGroup.get('url').value;else fileUpload;\">\n                <app-document-viewer [file]=\"entityFileGroup.get('file').value\"\n                    [fileUrl]=\"entityFileGroup.get('url').value\" [config]=\"this.viewerConfig\" (remove)=\"removeFile()\"\n                    [disableEdit]=\"updateMode\">\n                </app-document-viewer>\n\n            </div>\n\n            <div class=\"mt-4 mb-2\" fxLayout=\"row\" fxLayoutGap=\"30px\" fxLayoutAlign=\"end\" fxFlex=\"100%\">\n                <button mat-raised-button type=\"button\" (click)=\"dialogRef.close()\">\n                    Cancel\n                </button>\n                <button mat-raised-button type=\"submit\" color=\"primary\">Save</button>\n            </div>\n        </div>\n    </div>\n</form>",
+                template: "<form [formGroup]=\"entityFileGroup\" (ngSubmit)=\"submit()\">\n  <div fxLayout=\"column\" class=\"mat-typography\">\n    <div mat-dialog-title class=\"text-center\">\n      <div>Entity File</div>\n    </div>\n    <div mat-dialog-content fxLayout=\"column\" fxLayoutAlign.=\"start\">\n      <ng-container *ngIf=\"!hideTitleAndDetails\">\n        <mat-form-field>\n          <input type=\"text\" matInput formControlName=\"title\" placeholder=\"Title\" autocomplete=\"off\">\n        </mat-form-field>\n        <mat-form-field>\n          <textarea matInput formControlName=\"details\" placeholder=\"Details\" autocomplete=\"off\"></textarea>\n        </mat-form-field>\n      </ng-container>\n      <ng-template #fileUpload>\n        <section fxFlex=\"100%\">\n          <div>Entity File*</div>\n          <app-file-dropper [config]=\"fileConfig\" (fileChanged)=\"fileChanged($event)\" [fileArray]=\"fileList\">\n          </app-file-dropper>\n          <div class=\"text-danger\" *ngIf=\"isFieldValid('url')\">\n            {{getErrorMessage(\"url\")}}\n          </div>\n        </section>\n      </ng-template>\n      <div fxFlex=\"100%\" class=\"mt-2\" *ngIf=\"entityFileGroup.get('url').value;else fileUpload;\">\n        <app-document-viewer [file]=\"entityFileGroup.get('file').value\" [fileUrl]=\"entityFileGroup.get('url').value\"\n          [config]=\"this.viewerConfig\" (remove)=\"removeFile()\" [disableEdit]=\"updateMode\">\n        </app-document-viewer>\n      </div>\n      <div class=\"mt-4 mb-2\" fxLayout=\"row\" fxLayoutGap=\"30px\" fxLayoutAlign=\"end\" fxFlex=\"100%\">\n        <button mat-raised-button type=\"button\" (click)=\"dialogRef.close()\">\n          Cancel\n        </button>\n        <button mat-raised-button type=\"submit\" color=\"primary\">Save</button>\n      </div>\n    </div>\n  </div>\n</form>\n",
                 styles: [""]
             },] }
 ];
@@ -1232,16 +1242,36 @@ let EntityFilesViewAllComponent = class EntityFilesViewAllComponent {
         this.alertService = alertService;
         this.dialog = dialog;
         this.viewOnly = false;
+        this.title = "File";
         this.filters = {};
         this.entityFiles = [];
-        this.displayedColumns = ['index', 'title', 'details', 'file',];
+        this.displayedColumns = [
+            'index',
+            'title',
+            'details',
+            'file_size',
+            'uploaded_on',
+        ];
         this.isWorking = false;
         this.search = new FormControl('');
         this.page = 1;
         this.perPage = 25;
         this.lastPage = 0;
+        this.fileList = [];
     }
     ngOnInit() {
+        //File dropper config
+        this.fileConfig = {
+            fileId: "entityDashboardDropper",
+            containerId: "entityDashboardDropperContainer",
+            styles: {
+                height: "500px"
+            },
+            multiple: false,
+            acceptFile: "*",
+            maxSize: 10,
+            acceptFileText: "All Files"
+        };
         this.viewerConfig = {
             imageStyle: {
                 height: '200px',
@@ -1273,6 +1303,7 @@ let EntityFilesViewAllComponent = class EntityFilesViewAllComponent {
     fetchEntityFilesDetails() {
         return __awaiter(this, void 0, void 0, function* () {
             this.filters.page = this.page;
+            this.filters.perPage = this.perPage;
             this.isWorking = true;
             const result = yield this.entityFileService.getEntityFiles(this.filters);
             this.lastPage = result.last_page || this.page;
@@ -1348,11 +1379,32 @@ let EntityFilesViewAllComponent = class EntityFilesViewAllComponent {
     resetFieldValue() {
         this.search.setValue("");
     }
+    sizeOf(bytes) {
+        if (!bytes) {
+            return "0.00 B";
+        }
+        var e = Math.floor(Math.log(bytes) / Math.log(1024));
+        return (bytes / Math.pow(1024, e)).toFixed(2) + ' ' + ' KMGTP'.charAt(e) + 'B';
+    }
+    fileChanged(event) {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.fileList = event;
+            if (this.fileList.length > 0) {
+                const result = yield this.entityFileService.uploadEntityFile(this.fileList[0], {
+                    entity_type: this.entityType,
+                    entity_id: this.entityId,
+                });
+                this.fileList = [];
+                this.alertService.addAlert('Successfull uploaded', 'success');
+                this.reload();
+            }
+        });
+    }
 };
 EntityFilesViewAllComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-entity-files-view-all',
-                template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\" class=\"mat-typography p-4\" *ngIf=\"!displayMode\">\n    <div fxLayout=\"column\" fxLayoutGap=\"0.25rem\">\n        <h3 class=\"font-weight-bold\" fxLayoutAlign=\"center center\"> Files\n            <button type=\"button\" class=\"mx-1\" mat-mini-fab color=\"primary\" (click)=\"addEntityFile()\" *ngIf=\"!viewOnly\">\n                <mat-icon>add</mat-icon>\n            </button>\n        </h3>\n        <div fxLayout=\"row wrap\" fxLayoutAlign=\"start\" *ngIf=\"!removeSearch\">\n            <mat-form-field class=\"mt-1\">\n                <input type=\"text\" matInput [formControl]=\"search\" placeholder=\"Title\" name=\"title\"\n                    autocomplete=\"off\" />\n                <button mat-button *ngIf=\"filters.title\" matSuffix mat-icon-button (click)=\"resetFieldValue()\">\n                    <mat-icon>close</mat-icon>\n                </button>\n            </mat-form-field>\n        </div>\n        <table mat-table [dataSource]=\"entityFiles\" class=\"w-100\" matSort multiTemplateDataRows\n            infiniteScrollContainer=\"body\" infiniteScroll [infiniteScrollDistance]=\"1.5\" [infiniteScrollThrottle]=\"50\"\n            [fromRoot]=\"true\" (scrolled)=\"onScroll()\">\n\n            <!-- Index Column -->\n            <ng-container matColumnDef=\"index\">\n                <th mat-header-cell *matHeaderCellDef> # </th>\n                <td mat-cell *matCellDef=\"let element; let i = dataIndex\"> {{ i+1 }} </td>\n            </ng-container>\n\n            <!-- Title Column -->\n            <ng-container matColumnDef=\"title\">\n                <th mat-header-cell *matHeaderCellDef> Title </th>\n                <td mat-cell *matCellDef=\"let element\"> {{element.title}} </td>\n            </ng-container>\n\n            <!-- Details Column -->\n            <ng-container matColumnDef=\"details\">\n                <th mat-header-cell *matHeaderCellDef> Details </th>\n                <td mat-cell *matCellDef=\"let element\"> {{element.details}} </td>\n            </ng-container>\n\n            <!-- File Column -->\n            <ng-container matColumnDef=\"file\">\n                <th mat-header-cell *matHeaderCellDef> File </th>\n                <td mat-cell *matCellDef=\"let element\">\n                    <a href=\"{{element.url}}\" target=\"_blank\">\n                        <button mat-button type=\"button\">View</button>\n                    </a>\n                </td>\n            </ng-container>\n\n            <!-- Actions Column -->\n            <ng-container matColumnDef=\"actions\">\n                <th mat-header-cell *matHeaderCellDef> Actions </th>\n                <td mat-cell *matCellDef=\"let element\" style=\"min-width:110px\">\n                    <button type=\"button\" mat-icon-button (click)=\"editEntityFile(element)\">\n                        <mat-icon>edit</mat-icon>\n                    </button>\n                    <button type=\"button\" mat-icon-button (click)=\"deleteEntityFile(element)\">\n                        <mat-icon>delete</mat-icon>\n                    </button>\n                </td>\n            </ng-container>\n\n            <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n            <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n        </table>\n    </div>\n</div>\n\n<div fxLayout=\"row wrap\" fxLayoutGap=\"1rem\" class=\"mat-typography p-4\" *ngIf=\"displayMode\">\n\n    <div *ngFor=\"let efile of entityFiles\">\n        <app-document-viewer [file]=\"efile.file\" [fileUrl]=\"efile.url\" [config]=\"this.viewerConfig\"\n            [disableEdit]=\"true\">\n        </app-document-viewer>\n        <a href=\"{{efile.url}}\" target=\"_blank\">\n            <button mat-button type=\"button\">View</button>\n        </a>\n    </div>\n\n</div>",
+                template: "<div class=\"mat-typography\" *ngIf=\"!displayMode\">\n  <div fxLayout=\"row\" fxLayoutGap=\"1rem\">\n    <mat-card fxFlex=\"70%\">\n      <mat-card-title fxLayout fxLayoutGap=\"1rem\">\n        <h3 class=\"font-weight-bold primary-color\" fxLayout=\"center center\">\n          <mat-icon>\n            <span class=\"material-icons\">\n              description\n            </span>\n          </mat-icon>\n          {{title}}s\n        </h3>\n        <div>\n          <button type=\"button\" class=\"mx-1\" mat-raised-button color=\"primary\" (click)=\"addEntityFile()\"\n            *ngIf=\"!viewOnly\">\n            <mat-icon>\n              <span class=\"material-icons\">\n                add_circle_outline\n              </span>\n            </mat-icon>\n            {{title}}\n          </button>\n        </div>\n        <mat-form-field *ngIf=\"!removeSearch\" appearance=\"outline\" style=\"font-size: 10px;\">\n          <mat-label>Search</mat-label>\n          <input type=\"text\" matInput [formControl]=\"search\" placeholder=\"Search\" name=\"title\" autocomplete=\"off\" />\n          <button mat-button *ngIf=\"filters.title\" matSuffix mat-icon-button (click)=\"resetFieldValue()\">\n            <mat-icon>close</mat-icon>\n          </button>\n        </mat-form-field>\n      </mat-card-title>\n      <mat-card-content class=\"entity-file-card\">\n        <table mat-table [dataSource]=\"entityFiles\" class=\"w-100\" matSort multiTemplateDataRows infiniteScroll\n          [infiniteScrollDistance]=\"1.5\" [infiniteScrollThrottle]=\"50\" (scrolled)=\"onScroll()\">\n\n          <!-- Index Column -->\n          <ng-container matColumnDef=\"index\">\n            <th mat-header-cell *matHeaderCellDef> # </th>\n            <td mat-cell *matCellDef=\"let element; let i = dataIndex\"> {{ i+1 }} </td>\n          </ng-container>\n\n          <!-- Title Column -->\n          <ng-container matColumnDef=\"title\">\n            <th mat-header-cell *matHeaderCellDef> Title </th>\n            <td mat-cell *matCellDef=\"let element\">\n              <div>\n                <span>\n                  {{element.title}}\n                </span>\n                <span>\n                  <a href=\"{{element.url}}\" target=\"_blank\" class=\"text-decoration-none text-muted\">\n                    <button mat-icon-button type=\"button\">\n                      <mat-icon>download</mat-icon>\n                    </button>\n                  </a>\n                </span>\n              </div>\n            </td>\n          </ng-container>\n\n          <!-- Details Column -->\n          <ng-container matColumnDef=\"details\">\n            <th mat-header-cell *matHeaderCellDef> Details </th>\n            <td mat-cell *matCellDef=\"let element\"> {{element.details}} </td>\n          </ng-container>\n\n          <!-- File size Column -->\n          <ng-container matColumnDef=\"file_size\">\n            <th mat-header-cell *matHeaderCellDef> File Size </th>\n            <td mat-cell *matCellDef=\"let element\"> {{ sizeOf(element.file_size)}} </td>\n          </ng-container>\n\n          <!-- Uploaded On Column -->\n          <ng-container matColumnDef=\"uploaded_on\">\n            <th mat-header-cell *matHeaderCellDef> Uploaded On </th>\n            <td mat-cell *matCellDef=\"let element\">\n              <div>\n                {{element.created_at | date: 'mediumDate'}}\n              </div>\n              <div class=\"text-muted\">\n                By {{element.creator?.name}}\n              </div>\n            </td>\n          </ng-container>\n\n          <!-- Actions Column -->\n          <ng-container matColumnDef=\"actions\">\n            <th mat-header-cell *matHeaderCellDef> Actions </th>\n            <td mat-cell *matCellDef=\"let element\" style=\"min-width:110px\" class=\"text-muted\">\n              <button type=\"button\" mat-icon-button (click)=\"editEntityFile(element)\">\n                <mat-icon>edit</mat-icon>\n              </button>\n              <button type=\"button\" mat-icon-button (click)=\"deleteEntityFile(element)\">\n                <mat-icon>delete</mat-icon>\n              </button>\n            </td>\n          </ng-container>\n\n          <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n          <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\n        </table>\n      </mat-card-content>\n    </mat-card>\n    <section fxFlex=\"30%\">\n      <app-file-dropper [config]=\"fileConfig\" (fileChanged)=\"fileChanged($event)\" [fileArray]=\"fileList\">\n      </app-file-dropper>\n    </section>\n  </div>\n</div>\n\n<div fxLayout=\"row wrap\" fxLayoutGap=\"1rem\" class=\"mat-typography p-4\" *ngIf=\"displayMode\">\n  <div *ngFor=\"let efile of entityFiles\">\n    <app-document-viewer [file]=\"efile.file\" [fileUrl]=\"efile.url\" [config]=\"this.viewerConfig\" [disableEdit]=\"true\">\n    </app-document-viewer>\n    <a href=\"{{efile.url}}\" target=\"_blank\">\n      <button mat-button type=\"button\">View</button>\n    </a>\n  </div>\n</div>\n",
                 styles: [""]
             },] }
 ];
@@ -1368,7 +1420,8 @@ EntityFilesViewAllComponent.propDecorators = {
     viewOnly: [{ type: Input }],
     removeSearch: [{ type: Input }],
     hideTitleAndDetails: [{ type: Input }],
-    displayMode: [{ type: Input }]
+    displayMode: [{ type: Input }],
+    title: [{ type: Input }]
 };
 EntityFilesViewAllComponent = __decorate([
     UntilDestroy()