tnx-shared 5.3.344 → 5.3.345

package/bundles/tnx-shared.umd.js

@@ -303,7 +303,7 @@
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
     ***************************************************************************** */
-    /* global Reflect, Promise, SuppressedError, Symbol */
+    /* global Reflect, Promise, SuppressedError, Symbol, Iterator */
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -439,8 +439,8 @@
     }
     function __generator(thisArg, body) {
         var _ = { label: 0, sent: function () { if (t[0] & 1)
-                throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-        return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function () { return this; }), g;
+                throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+        return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function () { return this; }), g;
         function verb(n) { return function (v) { return step([n, v]); }; }
         function step(op) {
             if (f)
@@ -595,7 +595,7 @@
         if (!Symbol.asyncIterator)
             throw new TypeError("Symbol.asyncIterator is not defined.");
         var g = generator.apply(thisArg, _arguments || []), i, q = [];
-        return i = {}, verb("next"), verb("throw"), verb("return", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i;
+        return i = Object.create((typeof AsyncIterator === "function" ? AsyncIterator : Object).prototype), verb("next"), verb("throw"), verb("return", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i;
         function awaitReturn(f) { return function (v) { return Promise.resolve(v).then(f, reject); }; }
         function verb(n, f) { if (g[n]) {
             i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); };
@@ -719,18 +719,26 @@
             env.error = env.hasError ? new _SuppressedError(e, env.error, "An error was suppressed during disposal.") : e;
             env.hasError = true;
         }
+        var r, s = 0;
         function next() {
-            while (env.stack.length) {
-                var rec = env.stack.pop();
+            while (r = env.stack.pop()) {
                 try {
-                    var result = rec.dispose && rec.dispose.call(rec.value);
-                    if (rec.async)
-                        return Promise.resolve(result).then(next, function (e) { fail(e); return next(); });
+                    if (!r.async && s === 1)
+                        return s = 0, env.stack.push(r), Promise.resolve().then(next);
+                    if (r.dispose) {
+                        var result = r.dispose.call(r.value);
+                        if (r.async)
+                            return s |= 2, Promise.resolve(result).then(next, function (e) { fail(e); return next(); });
+                    }
+                    else
+                        s |= 1;
                 }
                 catch (e) {
                     fail(e);
                 }
             }
+            if (s === 1)
+                return env.hasError ? Promise.reject(env.error) : Promise.resolve();
             if (env.hasError)
                 throw env.error;
         }
@@ -49345,6 +49353,9 @@
             _this.showPrint = true;
             _this.showDownload = true;
             _this.showDelete = true;
+            _this.fullScreen = true;
+            _this.showModal = true;
+            _this.styleClass = "";
             _this.onClose = new i0.EventEmitter();
             _this.onRename = new i0.EventEmitter();
             _this.onDelete = new i0.EventEmitter();
@@ -49772,17 +49783,18 @@
             return this.data.fileType == type;
         };
         FileViewerComponent.prototype.getStyleClassByDocumentType = function (docType) {
+            var styleClass = this.styleClass;
             if (docType === FILE_TYPES.PDF) {
-                return 'pdf-container';
+                return styleClass + ' ' + 'pdf-container';
             }
-            return null;
+            return styleClass;
         };
         return FileViewerComponent;
     }(ComponentBase));
     FileViewerComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'file-viewer',
-                    template: "<p-sidebar #sidebar [showCloseIcon]=\"false\" [fullScreen]=\"true\" [appendTo]=\"'body'\"\n    [styleClass]=\"getStyleClassByDocumentType(data.fileType)\" [(visible)]=\"show\">\n    <ng-container *ngIf=\"data.fileType == fileTypes.PDF\">\n        <div id=\"fileViewerHolder\" class=\"file-viewer-holder\">\n            <div #headerdialogmaterial class=\"header-dialog-material\">\n                <div class=\"flex-item\" style=\"margin: 0px auto;\">\n                    <a *ngIf=\"isDesktop()\" (click)=\"!isReadonly && renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                </div>\n                <div class=\"flex-item\">\n                    <!-- UD-2450 - TuDN -->\n                    <!-- <a *ngIf=\"_deviceDetectorService.isDesktop() && showPrint\" pTooltip=\"In t\u00E0i li\u1EC7u\"\n                        tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\" (click)=\"print()\"\n                        class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-print\"></i></a> -->\n                    <a *ngIf=\"showDownload\" pTooltip=\"T\u1EA3i xu\u1ED1ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\"\n                        style=\"color: white;\" (click)=\"download()\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-download\"></i></a>\n                    <!-- End UD-2450 - TuDN -->\n                    <a *ngIf=\"!_deviceDetectorService.isDesktop() && !readonly\" pTooltip=\"\u0110\u1ED5i t\u00EAn\"\n                        tooltipPosition=\"bottom\" (click)=\"renameFile()\"\n                        class=\"cursor-pointer button-link btn btn-secondary\" style=\"color: white;\"><i\n                            class=\"fas fa-eraser\"></i></a>\n                    <a *ngIf=\"showDelete && !readonly\" pTooltip=\"X\u00F3a t\u1EC7p tin\" tooltipPosition=\"bottom\"\n                        (click)=\"deleteFile()\" class=\"cursor-pointer button-link btn btn-secondary\"\n                        style=\"color: white;\"><i class=\"far fa-trash-alt\"></i></a>\n                    <a (click)=\"onTopbarItemClick($event)\" role=\"menuitem\" style=\"color: white;\"\n                        *ngIf=\"!readonly && _deviceDetectorService.isDesktop()\"\n                        class=\"cursor-pointer button-link btn btn-secondary submenu\"> <i class=\"fas fa-ellipsis-v\"></i>\n                        <ul class=\"layout-menu fadeInDown\" *ngIf=\"model.activeTopbarItem\">\n                            <li *ngIf=\"_deviceDetectorService.isDesktop()\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"editFile()\" class=\"file-row-action\"><i class=\"fas fa-pen-square\"></i>S\u1EEDa\n                                    file\n                                    tr\u1EF1c\n                                    tuy\u1EBFn</a>\n                            </li>\n                            <li *ngIf=\"!isReadonly\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"renameFile()\" class=\"file-row-action\"><i class=\"fas fa-eraser\"></i>\u0110\u1ED5i\n                                    t\u00EAn</a>\n                            </li>\n                            <li *ngIf=\"!isReadonly\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"deleteFile()\" class=\"file-row-action\"><i class=\"far fa-trash-alt\"></i>X\u00F3a\n                                    t\u1EC7p\n                                    tin</a>\n                            </li>\n                        </ul>\n                    </a>\n                    <a pTooltip=\"\u0110\u00F3ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\"\n                        (click)=\"closeSidebar(null)\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-times\"></i></a>\n                </div>\n            </div>\n        </div>\n        <ngx-extended-pdf-viewer [src]=\"model.fileUrl\" useBrowserLocale=\"true\" height=\"calc(100vh - 50px)\"\n            [enablePinchOnMobile]=\"true\" [filenameForDownload]=\"data.fileName\" [language]=\"'vi-VN'\"\n            [showBookmarkButton]=\"false\" [showHandToolButton]=\"false\" [showOpenFileButton]=\"false\"\n            [showUnverifiedSignatures]=\"true\">\n        </ngx-extended-pdf-viewer>\n    </ng-container>\n\n    <ng-container\n        *ngIf=\"data.fileType != fileTypes.IMAGE && data.fileType != fileTypes.VIDEO && data.fileType != fileTypes.AUDIO && data.fileType != fileTypes.PDF\">\n        <div id=\"fileViewerHolder\" class=\"file-viewer-holder\">\n            <div #headerdialogmaterial class=\"header-dialog-material\">\n                <div class=\"flex-item\">\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"isDesktop()\" (click)=\"!isReadonly && renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"isDesktop() && showPrint\" pTooltip=\"In t\u00E0i li\u1EC7u\" tooltipPosition=\"bottom\"\n                        placeholder=\"Bottom\" style=\"color: white;\" (click)=\"print()\"\n                        class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-print\"></i></a>\n                    <a *ngIf=\"showDownload\" pTooltip=\"T\u1EA3i xu\u1ED1ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\"\n                        style=\"color: white;\" (click)=\"download()\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-download\"></i></a>\n                    <a *ngIf=\"!readonly && showDelete && isDesktop()\" pTooltip=\"X\u00F3a t\u1EC7p tin\" tooltipPosition=\"bottom\"\n                        (click)=\"deleteFile()\" class=\"cursor-pointer button-link btn btn-secondary\"\n                        style=\"color: white;\"><i class=\"pi pi-trash\"></i></a>\n                    <a *ngIf=\"!readonly && isDesktop()\" pTooltip=\"S\u1EEDa file tr\u1EF1c tuy\u1EBFn\" (click)=\"editFile()\"\n                        placeholder=\"Bottom\" class=\"cursor-pointer button-link btn btn-secondary\" style=\"color: white;\">\n                        <i class=\"fas fa-pen-square\"></i></a>\n\n                    <a (click)=\"onTopbarItemClick($event)\" role=\"menuitem\" style=\"color: white;\" *ngIf=\"!isDesktop()\"\n                        class=\"cursor-pointer button-link btn btn-secondary submenu\">\n                        <i class=\"fas fa-ellipsis-v\"></i>\n                        <ul class=\"layout-menu fadeInDown\" *ngIf=\"model.activeTopbarItem\">\n                            <li *ngIf=\"!isReadonly\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"editFile()\" class=\"file-row-action\">\n                                    <i class=\"fas fa-pen-square\"></i>S\u1EEDa file tr\u1EF1c tuy\u1EBFn</a>\n                            </li>\n                            <li *ngIf=\"!isReadonly\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"renameFile()\" class=\"file-row-action\"><i class=\"fas fa-eraser\"></i>\u0110\u1ED5i\n                                    t\u00EAn</a>\n                            </li>\n                            <li *ngIf=\"!isReadonly && showDelete\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"deleteFile()\" class=\"file-row-action\"><i class=\"pi pi-trash\"></i>X\u00F3a\n                                    t\u1EC7p tin</a>\n                            </li>\n                        </ul>\n                    </a>\n                    <a pTooltip=\"\u0110\u00F3ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\"\n                        (click)=\"closeSidebar(null)\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-times\"></i></a>\n                </div>\n            </div>\n\n            <div class=\"dialog-material\" [class.view-file]=\"true\" [class.mobile]=\"!isDesktop()\"\n                [class.view-file-text]=\"isFileType(fileTypes.TEXT)\"\n                [class.view-file-spreadsheet]=\"isFileType(fileTypes.SPREADSHEET)\"\n                [class.view-file-presentation]=\"isFileType(fileTypes.PRESENTATION)\">\n                <div id=\"file-viewer\"></div>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"data.fileType == fileTypes.IMAGE && model.images.length > 0\">\n        <div class=\"image-container\">\n            <div #headerdialogmaterial class=\"header-dialog-material\">\n                <div class=\"flex-item\">\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"isDesktop()\" (click)=\"!isReadonly && renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                </div>\n                <div class=\"flex-item\">\n                    <a pTooltip=\"\u0110\u00F3ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\"\n                        (click)=\"closeSidebar(null)\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-times\"></i></a>\n                </div>\n            </div>\n\n            <img *ngIf=\"model.images && model.images.length\" src=\"{{model.images[0]}}\" alt=\"Ch\u01B0a c\u00F3 \u1EA3nh\">\n        </div>\n        <!-- <app-image-viewer [showPDFOnlyLabel]=\"false\" [showPDFOnlyOption]=\"false\" [fullscreen]=\"false\"\n            [images]=\"model.images\" [primaryColor]=\"'#3192e1'\" [idContainer]=\"'image-view-list'\"\n            (mousedown)=\"closeSidebar($event)\" id=\"fileViewerHolder\" [loadOnInit]=\"true\">\n        </app-image-viewer>\n        <a style=\"color: white;\" (click)=\"closeSidebar(null)\" class=\"mobile-image-viewer-close\">\n            <i class=\"far fa-times-circle\"></i></a> -->\n    </ng-container>\n\n    <ng-container *ngIf=\"data.fileType == fileTypes.VIDEO\">\n        <div id=\"fileViewerHolder\" class=\"file-viewer-holder\" style=\"height: 100%;\">\n            <div #headerdialogmaterial class=\"header-dialog-material\">\n                <div class=\"flex-item\">\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"isDesktop()\" (click)=\"!isReadonly && renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"showDownload\" pTooltip=\"T\u1EA3i xu\u1ED1ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\"\n                        style=\"color: white;\" (click)=\"download()\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-download\"></i>\n                    </a>\n                    <a *ngIf=\"!isReadonly && !isDesktop()\" (click)=\"renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                    <a *ngIf=\"!readonly && showDelete\" pTooltip=\"X\u00F3a t\u1EC7p tin\" tooltipPosition=\"bottom\"\n                        (click)=\"deleteFile()\" class=\"cursor-pointer button-link btn btn-secondary\"\n                        style=\"color: white;\"><i class=\"pi pi-trash\"></i></a>\n                    <a pTooltip=\"\u0110\u00F3ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\"\n                        (click)=\"closeSidebar(null)\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-times\"></i></a>\n                </div>\n            </div>\n\n            <div class=\"dialog-material\" [class.view-file]=\"true\" [class.mobile]=\"!isDesktop()\"\n                style=\"width: 80%; margin: auto; height: 100%; border-radius: 0px;\">\n                <video width=\"100%\" height=\"100%\" style=\"margin-top: 50px;\" autoplay controls src=\"{{model.fileUrl}}\">\n                    Tr\u00ECnh duy\u1EC7t kh\u00F4ng h\u1ED7 tr\u1EE3 m\u1EDF video.\n                </video>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"data.fileType == fileTypes.AUDIO\">\n        <div id=\"fileViewerHolder\" class=\"file-viewer-holder\" (mousedown)=\"closeSidebar($event)\" style=\"height: 100%;\">\n            <div #headerdialogmaterial class=\"header-dialog-material\">\n                <div class=\"flex-item\">\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"isDesktop()\" (click)=\"!isReadonly && renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"showDownload\" pTooltip=\"T\u1EA3i xu\u1ED1ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\"\n                        style=\"color: white;\" (click)=\"download()\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-download\"></i></a>\n                    <a *ngIf=\"!isReadonly && showDelete\" pTooltip=\"X\u00F3a t\u1EC7p tin\" tooltipPosition=\"bottom\"\n                        (click)=\"deleteFile()\" class=\"cursor-pointer button-link btn btn-secondary\"\n                        style=\"color: white;\"><i class=\"pi pi-trash\"></i></a>\n                    <a pTooltip=\"\u0110\u00F3ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\"\n                        (click)=\"closeSidebar(null)\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-times\"></i></a>\n                </div>\n            </div>\n            <audio controls autoplay src=\"{{model.fileUrl}}\"\n                style=\"margin: auto;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);\">\n                Tr\u00ECnh duy\u1EC7t kh\u00F4ng h\u1ED7 tr\u1EE3 ph\u00E1t audio. </audio>\n        </div>\n    </ng-container>\n\n</p-sidebar>\n\n<tn-dialog *ngIf=\"renameFileForm.show\" #dialog [styleClass]=\"'address-form'\"\n    [header]=\"renameFileForm.header | translate\" [popupSize]=\"renameFileForm.popupSize\" (onHide)=\"onCancelRenameFile()\">\n    <file-form #formBase [parentModel]=\"model\" [parentContext]=\"context\" [model]=\"renameFileForm.formData\"\n        (onSaved)=\"onSavedRenameFile()\" (onCancel)=\"onCancelRenameFile()\">\n    </file-form>\n</tn-dialog>",
+                    template: "<p-sidebar #sidebar [showCloseIcon]=\"false\" [fullScreen]=\"fullScreen\" [appendTo]=\"'body'\" [modal]=\"showModal\"\n    [styleClass]=\"getStyleClassByDocumentType(data.fileType)\" [(visible)]=\"show\">\n    <ng-container *ngIf=\"data.fileType == fileTypes.PDF\">\n        <div id=\"fileViewerHolder\" class=\"file-viewer-holder\">\n            <div #headerdialogmaterial class=\"header-dialog-material\">\n                <div class=\"flex-item\" style=\"margin: 0px auto;\">\n                    <a *ngIf=\"isDesktop()\" (click)=\"!isReadonly && renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                </div>\n                <div class=\"flex-item\">\n                    <!-- UD-2450 - TuDN -->\n                    <!-- <a *ngIf=\"_deviceDetectorService.isDesktop() && showPrint\" pTooltip=\"In t\u00E0i li\u1EC7u\"\n                        tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\" (click)=\"print()\"\n                        class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-print\"></i></a> -->\n                    <a *ngIf=\"showDownload\" pTooltip=\"T\u1EA3i xu\u1ED1ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\"\n                        style=\"color: white;\" (click)=\"download()\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-download\"></i></a>\n                    <!-- End UD-2450 - TuDN -->\n                    <a *ngIf=\"!_deviceDetectorService.isDesktop() && !readonly\" pTooltip=\"\u0110\u1ED5i t\u00EAn\"\n                        tooltipPosition=\"bottom\" (click)=\"renameFile()\"\n                        class=\"cursor-pointer button-link btn btn-secondary\" style=\"color: white;\"><i\n                            class=\"fas fa-eraser\"></i></a>\n                    <a *ngIf=\"showDelete && !readonly\" pTooltip=\"X\u00F3a t\u1EC7p tin\" tooltipPosition=\"bottom\"\n                        (click)=\"deleteFile()\" class=\"cursor-pointer button-link btn btn-secondary\"\n                        style=\"color: white;\"><i class=\"far fa-trash-alt\"></i></a>\n                    <a (click)=\"onTopbarItemClick($event)\" role=\"menuitem\" style=\"color: white;\"\n                        *ngIf=\"!readonly && _deviceDetectorService.isDesktop()\"\n                        class=\"cursor-pointer button-link btn btn-secondary submenu\"> <i class=\"fas fa-ellipsis-v\"></i>\n                        <ul class=\"layout-menu fadeInDown\" *ngIf=\"model.activeTopbarItem\">\n                            <li *ngIf=\"_deviceDetectorService.isDesktop()\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"editFile()\" class=\"file-row-action\"><i class=\"fas fa-pen-square\"></i>S\u1EEDa\n                                    file\n                                    tr\u1EF1c\n                                    tuy\u1EBFn</a>\n                            </li>\n                            <li *ngIf=\"!isReadonly\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"renameFile()\" class=\"file-row-action\"><i class=\"fas fa-eraser\"></i>\u0110\u1ED5i\n                                    t\u00EAn</a>\n                            </li>\n                            <li *ngIf=\"!isReadonly\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"deleteFile()\" class=\"file-row-action\"><i class=\"far fa-trash-alt\"></i>X\u00F3a\n                                    t\u1EC7p\n                                    tin</a>\n                            </li>\n                        </ul>\n                    </a>\n                    <a pTooltip=\"\u0110\u00F3ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\"\n                        (click)=\"closeSidebar(null)\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-times\"></i></a>\n                </div>\n            </div>\n        </div>\n        <ngx-extended-pdf-viewer [src]=\"model.fileUrl\" useBrowserLocale=\"true\" height=\"calc(100vh - 50px)\"\n            [enablePinchOnMobile]=\"true\" [filenameForDownload]=\"data.fileName\" [language]=\"'vi-VN'\"\n            [showBookmarkButton]=\"false\" [showHandToolButton]=\"false\" [showOpenFileButton]=\"false\"\n            [showUnverifiedSignatures]=\"true\">\n        </ngx-extended-pdf-viewer>\n    </ng-container>\n\n    <ng-container\n        *ngIf=\"data.fileType != fileTypes.IMAGE && data.fileType != fileTypes.VIDEO && data.fileType != fileTypes.AUDIO && data.fileType != fileTypes.PDF\">\n        <div id=\"fileViewerHolder\" class=\"file-viewer-holder\">\n            <div #headerdialogmaterial class=\"header-dialog-material\">\n                <div class=\"flex-item\">\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"isDesktop()\" (click)=\"!isReadonly && renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"isDesktop() && showPrint\" pTooltip=\"In t\u00E0i li\u1EC7u\" tooltipPosition=\"bottom\"\n                        placeholder=\"Bottom\" style=\"color: white;\" (click)=\"print()\"\n                        class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-print\"></i></a>\n                    <a *ngIf=\"showDownload\" pTooltip=\"T\u1EA3i xu\u1ED1ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\"\n                        style=\"color: white;\" (click)=\"download()\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-download\"></i></a>\n                    <a *ngIf=\"!readonly && showDelete && isDesktop()\" pTooltip=\"X\u00F3a t\u1EC7p tin\" tooltipPosition=\"bottom\"\n                        (click)=\"deleteFile()\" class=\"cursor-pointer button-link btn btn-secondary\"\n                        style=\"color: white;\"><i class=\"pi pi-trash\"></i></a>\n                    <a *ngIf=\"!readonly && isDesktop()\" pTooltip=\"S\u1EEDa file tr\u1EF1c tuy\u1EBFn\" (click)=\"editFile()\"\n                        placeholder=\"Bottom\" class=\"cursor-pointer button-link btn btn-secondary\" style=\"color: white;\">\n                        <i class=\"fas fa-pen-square\"></i></a>\n\n                    <a (click)=\"onTopbarItemClick($event)\" role=\"menuitem\" style=\"color: white;\" *ngIf=\"!isDesktop()\"\n                        class=\"cursor-pointer button-link btn btn-secondary submenu\">\n                        <i class=\"fas fa-ellipsis-v\"></i>\n                        <ul class=\"layout-menu fadeInDown\" *ngIf=\"model.activeTopbarItem\">\n                            <li *ngIf=\"!isReadonly\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"editFile()\" class=\"file-row-action\">\n                                    <i class=\"fas fa-pen-square\"></i>S\u1EEDa file tr\u1EF1c tuy\u1EBFn</a>\n                            </li>\n                            <li *ngIf=\"!isReadonly\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"renameFile()\" class=\"file-row-action\"><i class=\"fas fa-eraser\"></i>\u0110\u1ED5i\n                                    t\u00EAn</a>\n                            </li>\n                            <li *ngIf=\"!isReadonly && showDelete\" role=\"menuitem\" class=\"cursor-pointer\">\n                                <a (click)=\"deleteFile()\" class=\"file-row-action\"><i class=\"pi pi-trash\"></i>X\u00F3a\n                                    t\u1EC7p tin</a>\n                            </li>\n                        </ul>\n                    </a>\n                    <a pTooltip=\"\u0110\u00F3ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\"\n                        (click)=\"closeSidebar(null)\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-times\"></i></a>\n                </div>\n            </div>\n\n            <div class=\"dialog-material\" [class.view-file]=\"true\" [class.mobile]=\"!isDesktop()\"\n                [class.view-file-text]=\"isFileType(fileTypes.TEXT)\"\n                [class.view-file-spreadsheet]=\"isFileType(fileTypes.SPREADSHEET)\"\n                [class.view-file-presentation]=\"isFileType(fileTypes.PRESENTATION)\">\n                <div id=\"file-viewer\"></div>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"data.fileType == fileTypes.IMAGE && model.images.length > 0\">\n        <div class=\"image-container\">\n            <div #headerdialogmaterial class=\"header-dialog-material\">\n                <div class=\"flex-item\">\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"isDesktop()\" (click)=\"!isReadonly && renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                </div>\n                <div class=\"flex-item\">\n                    <a pTooltip=\"\u0110\u00F3ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\"\n                        (click)=\"closeSidebar(null)\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-times\"></i></a>\n                </div>\n            </div>\n\n            <img *ngIf=\"model.images && model.images.length\" src=\"{{model.images[0]}}\" alt=\"Ch\u01B0a c\u00F3 \u1EA3nh\">\n        </div>\n        <!-- <app-image-viewer [showPDFOnlyLabel]=\"false\" [showPDFOnlyOption]=\"false\" [fullscreen]=\"false\"\n            [images]=\"model.images\" [primaryColor]=\"'#3192e1'\" [idContainer]=\"'image-view-list'\"\n            (mousedown)=\"closeSidebar($event)\" id=\"fileViewerHolder\" [loadOnInit]=\"true\">\n        </app-image-viewer>\n        <a style=\"color: white;\" (click)=\"closeSidebar(null)\" class=\"mobile-image-viewer-close\">\n            <i class=\"far fa-times-circle\"></i></a> -->\n    </ng-container>\n\n    <ng-container *ngIf=\"data.fileType == fileTypes.VIDEO\">\n        <div id=\"fileViewerHolder\" class=\"file-viewer-holder\" style=\"height: 100%;\">\n            <div #headerdialogmaterial class=\"header-dialog-material\">\n                <div class=\"flex-item\">\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"isDesktop()\" (click)=\"!isReadonly && renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"showDownload\" pTooltip=\"T\u1EA3i xu\u1ED1ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\"\n                        style=\"color: white;\" (click)=\"download()\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-download\"></i>\n                    </a>\n                    <a *ngIf=\"!isReadonly && !isDesktop()\" (click)=\"renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                    <a *ngIf=\"!readonly && showDelete\" pTooltip=\"X\u00F3a t\u1EC7p tin\" tooltipPosition=\"bottom\"\n                        (click)=\"deleteFile()\" class=\"cursor-pointer button-link btn btn-secondary\"\n                        style=\"color: white;\"><i class=\"pi pi-trash\"></i></a>\n                    <a pTooltip=\"\u0110\u00F3ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\"\n                        (click)=\"closeSidebar(null)\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-times\"></i></a>\n                </div>\n            </div>\n\n            <div class=\"dialog-material\" [class.view-file]=\"true\" [class.mobile]=\"!isDesktop()\"\n                style=\"width: 80%; margin: auto; height: 100%; border-radius: 0px;\">\n                <video width=\"100%\" height=\"100%\" style=\"margin-top: 50px;\" autoplay controls src=\"{{model.fileUrl}}\">\n                    Tr\u00ECnh duy\u1EC7t kh\u00F4ng h\u1ED7 tr\u1EE3 m\u1EDF video.\n                </video>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"data.fileType == fileTypes.AUDIO\">\n        <div id=\"fileViewerHolder\" class=\"file-viewer-holder\" (mousedown)=\"closeSidebar($event)\" style=\"height: 100%;\">\n            <div #headerdialogmaterial class=\"header-dialog-material\">\n                <div class=\"flex-item\">\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"isDesktop()\" (click)=\"!isReadonly && renameFile()\" style=\"color: white;\"\n                        class=\"btn btn-secondary\">\n                        <i class=\"fas fa-file-alt\"></i><span class=\"cursor-pointer\">\n                            {{ data.name }}\n                        </span>\n                    </a>\n                </div>\n                <div class=\"flex-item\">\n                    <a *ngIf=\"showDownload\" pTooltip=\"T\u1EA3i xu\u1ED1ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\"\n                        style=\"color: white;\" (click)=\"download()\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-download\"></i></a>\n                    <a *ngIf=\"!isReadonly && showDelete\" pTooltip=\"X\u00F3a t\u1EC7p tin\" tooltipPosition=\"bottom\"\n                        (click)=\"deleteFile()\" class=\"cursor-pointer button-link btn btn-secondary\"\n                        style=\"color: white;\"><i class=\"pi pi-trash\"></i></a>\n                    <a pTooltip=\"\u0110\u00F3ng\" tooltipPosition=\"bottom\" placeholder=\"Bottom\" style=\"color: white;\"\n                        (click)=\"closeSidebar(null)\" class=\"cursor-pointer button-link btn btn-secondary\">\n                        <i class=\"fas fa-times\"></i></a>\n                </div>\n            </div>\n            <audio controls autoplay src=\"{{model.fileUrl}}\"\n                style=\"margin: auto;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);\">\n                Tr\u00ECnh duy\u1EC7t kh\u00F4ng h\u1ED7 tr\u1EE3 ph\u00E1t audio. </audio>\n        </div>\n    </ng-container>\n\n</p-sidebar>\n\n<tn-dialog *ngIf=\"renameFileForm.show\" #dialog [styleClass]=\"'address-form'\"\n    [header]=\"renameFileForm.header | translate\" [popupSize]=\"renameFileForm.popupSize\" (onHide)=\"onCancelRenameFile()\">\n    <file-form #formBase [parentModel]=\"model\" [parentContext]=\"context\" [model]=\"renameFileForm.formData\"\n        (onSaved)=\"onSavedRenameFile()\" (onCancel)=\"onCancelRenameFile()\">\n    </file-form>\n</tn-dialog>",
                     providers: [ComponentContextService],
                     styles: ["::ng-deep .pdf-container ngx-extended-pdf-viewer #outerContainer{top:51px}.view-file{height:92vh}.dialog-material{display:block;border-radius:4px;box-sizing:border-box;overflow:hidden;outline:0;min-height:inherit;max-height:inherit;width:50vw;width:100%}.dialog-material.view-file-text{width:85%;margin:0 auto}.dialog-material.view-file-text.mobile{width:100%;margin:0 auto}.header-dialog-material{display:flex;flex-direction:row;justify-content:space-between;padding:5px 15px;box-sizing:border-box;outline:0;height:50px;line-height:50px;background:#3192e1;position:absolute;pointer-events:auto;left:0;right:0;top:0;width:auto}.header-dialog-material .flex-item{line-height:40px}.header-dialog-material .flex-item .cursor-pointer{cursor:pointer;display:inline-block;padding:0 15px}.header-dialog-material .flex-item .cursor-pointer.submenu{position:relative}.header-dialog-material .flex-item .cursor-pointer.submenu ul{display:flex;position:absolute;top:25px;right:0;align-content:flex-end;flex-direction:column;width:230px;border-radius:2px;padding:5px 0;background:#fff;box-shadow:0 6px 12px rgba(0,0,0,.175);z-index:1}.header-dialog-material .flex-item .cursor-pointer.submenu ul li{padding:0}.header-dialog-material .flex-item .cursor-pointer.submenu ul li a{padding:0 0 0 5px;line-height:40px}.header-dialog-material .flex-item .cursor-pointer.submenu ul li a:hover{background:#f5f5f5}.header-dialog-material ul:before{top:-8px;right:8px;left:auto;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:10px solid #fff;content:\" \";position:absolute}.mat-dialog-content{display:block;margin:0;padding:0;max-height:100vh;max-width:50vw;overflow:auto;-webkit-overflow-scrolling:touch}::ng-deep .cdk-overlay-container{position:fixed;z-index:1000;background:rgba(0,0,0,.7)!important}::ng-deep .cdk-overlay-backdrop{position:absolute;top:0;bottom:0;left:0;right:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}::ng-deep .mat-dialog-container{display:block;padding:0!important}::ng-deep .cdk-overlay-pane{max-height:100%}.button-link:hover{transition:background-color .1s,opacity .1s;background-image:none;background-color:hsla(0,0%,100%,.25)}.file-row-action i{margin-right:5px;width:40px;text-align:center}.file-row-action{line-height:34px;width:100%;display:block;color:#212529}.layout-menu li a{border:none;text-align:left}.layout-menu li a i:first-child{color:#666;font-size:1em}.footer-page{position:absolute;left:50%;margin-right:-50%;transform:translate(-50%);border-radius:3px;bottom:12px;z-index:3;overflow:hidden}.footer-page-label{border-right:1px solid hsla(0,0%,100%,.2);display:inline-block;font-size:13px;line-height:44px;height:44px;vertical-align:middle;background:#000}.footer-page-label-page{display:inline-block;margin-left:12px;vertical-align:middle;background:rgba(0,0,0,.75);color:#fff}.footer-page-label-numberpage{display:inline-block;text-align:center;vertical-align:middle;width:48px;color:#fff}.footer-page-label-space{display:inline-block;margin-left:12px;vertical-align:middle;color:#fff}.footer-page-label-totalpage{display:inline-block;text-align:center;vertical-align:middle;width:48px;color:#fff}::ng-deep p-table .ui-table-tbody>tr>td{overflow:unset}::ng-deep .ui-sidebar-left.ui-sidebar-active{padding-top:55px;background:rgba(0,0,0,.4);border:0}::ng-deep .layout-wrapper .layout-menu-container{border-radius:unset}::ng-deep .p-sidebar{padding:0!important;background-color:#000}@media print{::ng-deep body *{visibility:visible!important}}::ng-deep .image-container{display:flex;justify-content:center;background-color:#000}::ng-deep .image-container .image-container-toolbar{display:flex;justify-content:flex-end}::ng-deep .image-container>img{height:calc(100ch - 50px)!important;max-height:100%!important;margin-top:50px}"]
                 },] }
@@ -49811,6 +49823,9 @@
         showPrint: [{ type: i0.Input }],
         showDownload: [{ type: i0.Input }],
         showDelete: [{ type: i0.Input }],
+        fullScreen: [{ type: i0.Input }],
+        showModal: [{ type: i0.Input }],
+        styleClass: [{ type: i0.Input }],
         onClose: [{ type: i0.Output }],
         onRename: [{ type: i0.Output }],
         onDelete: [{ type: i0.Output }]