tnx-shared 5.1.446 → 5.1.448

package/bundles/tnx-shared.umd.js

@@ -1458,6 +1458,7 @@
             _this.inTaiLieu = false;
             _this.inTaiLieuChung = false;
             _this.copyToFolderId = '';
+            _this.multiple = false;
             for (var key in init) {
                 _this[key] = init[key];
             }
@@ -27459,6 +27460,9 @@
         FileObjectService.prototype.getUploadUrl = function () {
             return this.serviceUri + "/UploadFileIntoFolder";
         };
+        FileObjectService.prototype.getUploadMultipleUrl = function () {
+            return this.serviceUri + "/UploadFilesIntoFolder";
+        };
         FileObjectService.prototype.getUploadIntoSharedFolderUrl = function () {
             return this.serviceUri + "/UploadFileIntoSharedFolder";
         };
@@ -33800,6 +33804,7 @@
             _this.visibleFolder = true;
             _this.rootTreeNode = [];
             _this.accept = '';
+            _this.fileInForm = 'file';
             _this._moduleConfig = _this._moduleConfigService.getConfig();
             _this.apiUploadUrl = _this._fileObjectService.getUploadUrl();
             _this.userId = _this._userService.getUserIdCombine();
@@ -33859,6 +33864,11 @@
             if (!this.control) {
                 this.control = new FileManagerControlSchema();
             }
+            if (this.control.multiple) {
+                // Upload with multiple file
+                this.apiUploadUrl = this._fileObjectService.getUploadMultipleUrl();
+                this.fileInForm = 'files';
+            }
             this.control._component = this;
             this.accept = this.control.accept && this.control.accept !== ''
                 ? this.control.accept
@@ -35252,7 +35262,7 @@
         { type: i0.Component, args: [{
                     // tslint:disable-next-line: component-selector
                     selector: 'file-manager',
-                    template: "<div *ngIf=\"layout == _layout.LIST\" class=\"full-layout p-grid\">\r\n    <div *ngIf=\"visibleFolder\" class=\"tree-layout\" [class]=\"visibleFolder ? 'p-col-12 p-lg-2' : '' \">\r\n        <div class=\"tree-layout-btn\">\r\n            <button *ngIf=\"!hiddenCreateFolder && !readonly\" pButton pRipple type=\"button\" pTooltip=\"T\u1EA1o th\u01B0 m\u1EE5c m\u1EDBi\"\r\n                tooltipPosition=\"top\" icon=\"pi pi-folder\" class=\"p-button-text\" label=\"T\u1EA1o th\u01B0 m\u1EE5c\" iconPos=\"left\"\r\n                (click)=\"createFolder()\">\r\n            </button>\r\n        </div>\r\n        <div class=\"tree-layout-wrapper\">\r\n            <perfect-scrollbar #scrollbar class=\"defaulFlexColumn treeOrg\" [config]=\"{suppressScrollX : true}\">\r\n                <p-tree class=\"folderTree\" selectionMode=\"single\" [style]=\"{ 'width' : '100%'}\"\r\n                    [(selection)]=\"selectedTreeNode\" [value]=\"rootTreeNode\" [contextMenu]=\"contextMenu\"\r\n                    (onNodeSelect)=\"nodeSelect($event)\">\r\n                    <ng-template let-node pTemplate=\"default\">\r\n                        <span [id]=\"node.data\" class=\"custom-node\"\r\n                            (contextmenu)=\"showContextMenu($event, node, true)\">{{node.label}}</span>\r\n                    </ng-template>\r\n                </p-tree>\r\n            </perfect-scrollbar>\r\n        </div>\r\n    </div>\r\n    <div class=\"fm-grid\" [class]=\"visibleFolder ? 'p-col-12 p-lg-10' : 'p-col-12' \">\r\n        <crud-list #crudList [model]=\"model\" [setting]=\"setting\" [dataSource]=\"_dataSource\"\r\n            [disableKeypressControl]=\"true\" [showScrollBar]=\"false\" class=\"--auto-height-content --no-wrapper-padding\"\r\n            [widthFunctionColumn]=\"'8.2rem'\" [showScrollHorizontal]=\"true\" (onReload)=\"_triggerProcessData($event)\"\r\n            (onRowSelect)=\"onRowSelect($event)\">\r\n            <ng-template #customTitle>\r\n                <ng-container *ngTemplateOutlet=\"breadCrumb\"></ng-container>\r\n            </ng-template>\r\n            <ng-template #toolbar>\r\n                <button pButton pRipple type=\"button\"\r\n                    [pTooltip]=\"visibleFolder == true ? '\u1EA8n c\u00E2y th\u01B0 m\u1EE5c' : 'Hi\u1EC7n c\u00E2y th\u01B0 m\u1EE5c'\" tooltipPosition=\"top\"\r\n                    [icon]=\"visibleFolder ? 'far fa-eye-slash': 'far fa-eye'\" class=\"p-button-text\"\r\n                    [label]=\"visibleFolder == true ? '\u1EA8n c\u00E2y th\u01B0 m\u1EE5c' : 'Hi\u1EC7n c\u00E2y th\u01B0 m\u1EE5c'\" iconPos=\"left\"\r\n                    (click)=\"changeVisibleFolder()\">\r\n                </button>\r\n\r\n                <button *ngIf=\"!hiddenCreateFolder && !readonly && !visibleFolder\" pButton pRipple type=\"button\"\r\n                    pTooltip=\"T\u1EA1o th\u01B0 m\u1EE5c m\u1EDBi\" tooltipPosition=\"top\" icon=\"pi pi-folder\" class=\"p-button-text\"\r\n                    label=\"T\u1EA1o th\u01B0 m\u1EE5c\" iconPos=\"left\" (click)=\"createFolder()\">\r\n                </button>\r\n\r\n                <button *ngIf=\"!readonly\" pButton icon=\"pi pi-cloud-upload\" pTooltip=\"T\u1EA3i t\u1EC7p tin t\u1EEB m\u00E1y t\u00EDnh c\u1EE7a b\u1EA1n\"\r\n                    tooltipPosition=\"top\" type=\"button\" class=\"p-button-text p-button-primary\" label=\"T\u1EA3i l\u00EAn\"\r\n                    (click)=\"selectFile()\"></button>\r\n\r\n                <button *ngIf=\"!readonly\" pButton icon=\"pi pi-link\" pTooltip=\"T\u1EA3i t\u1EEB li\u00EAn k\u1EBFt trong h\u1EC7 th\u1ED1ng\"\r\n                    tooltipPosition=\"top\" type=\"button\" class=\"p-button-text p-button-primary\" label=\"T\u1EA3i li\u00EAn k\u1EBFt\"\r\n                    (click)=\"showAttachLinkBox = true\"></button>\r\n\r\n                <button *ngIf=\"!inTaiLieu && !inTaiLieuChung && !readonly\" pButton icon=\"pi pi-book\"\r\n                    pTooltip=\"Sao ch\u00E9p t\u1EEB t\u00E0i li\u1EC7u d\u00F9ng chung ho\u1EB7c c\u00E1 nh\u00E2n\" tooltipPosition=\"top\" type=\"button\"\r\n                    class=\"p-button-text\" label=\"T\u00E0i li\u1EC7u\" (click)=\"showTaiLieuDungChung = true;\">\r\n                </button>\r\n\r\n                <button *ngIf=\"canSelect()\" class=\"p-button-text p-button-success\" pButton type=\"button\"\r\n                    pTooltip=\"Di chuy\u1EC3n th\u01B0 m\u1EE5c/t\u1EC7p tin \u0111\u00E3 ch\u1ECDn\" tooltipPosition=\"top\" icon=\"fas fa-arrows-alt\"\r\n                    iconPos=\"left\" label=\"Di chuy\u1EC3n\" (click)=\"moveExplorerItems()\">\r\n                </button>\r\n\r\n                <button *ngIf=\"canSetMove()\" class=\"p-button-text p-button-success\" pButton type=\"button\"\r\n                    pTooltip=\"Di chuy\u1EC3n th\u01B0 m\u1EE5c/t\u1EC7p tin \u0111\u00E3 ch\u1ECDn t\u1EDBi \u0111\u00E2y\" tooltipPosition=\"top\" icon=\"far fa-hand-paper\"\r\n                    iconPos=\"left\" label=\"\u0110\u1EB7t t\u1EA1i \u0111\u00E2y\" (click)=\"setMoveExplorerItems()\">\r\n                </button>\r\n\r\n                <button *ngIf=\"canSetMove()\" icon=\"pi pi-undo\" pButton class=\"p-button-text p-button-secondary\"\r\n                    type=\"button\" pTooltip=\"B\u1ECF di chuy\u1EC3n th\u01B0 m\u1EE5c/t\u1EC7p tin \u0111\u00E3 ch\u1ECDn\" tooltipPosition=\"top\" label=\"B\u1ECF qua\"\r\n                    (click)=\"cancelMove()\">\r\n                </button>\r\n\r\n                <button *ngIf=\"hasSelect() && !readonly\" pButton type=\"button\"\r\n                    pTooltip=\"{{ 'X\u00F3a th\u01B0 m\u1EE5c/t\u1EC7p tin \u0111\u00E3 ch\u1ECDn' | translate }}\" tooltipPosition=\"top\" icon=\"pi pi-trash\"\r\n                    iconPos=\"left\" class=\"p-button-text p-button-danger\" label=\"X\u00F3a\"\r\n                    (click)=\"deleteMutiple(model.selectedItems)\"></button>\r\n\r\n                <button *ngIf=\"hasSelect()\" class=\"p-button-text p-button-secondary\" pButton type=\"button\"\r\n                    pTooltip=\"N\u00E9n & t\u1EA3i v\u1EC1\" tooltipPosition=\"top\" icon=\"fas fa-file-archive\" iconPos=\"left\"\r\n                    label=\"T\u1EA3i v\u1EC1\" (click)=\"downloadMultiple()\">\r\n                </button>\r\n            </ng-template>\r\n\r\n            <ng-template #explorerItem let-rowData='rowData' let-col='col'>\r\n                <div style=\"display: flex; align-items: center;\">\r\n                    <span *ngIf=\"rowData.tailFileUpper != '.JPG'\r\n                    && rowData.tailFileUpper != '.JPEG' && rowData.tailFileUpper != '.PNG' \"\r\n                        (click)=\"openObject(rowData)\" class=\"pull-left file-ex-icon\" style=\"display: flex;\"\r\n                        [innerHTML]=\"rowData.name | fileIcon : !rowData.isFile\">\r\n                    </span>\r\n\r\n                    <span *ngIf=\"rowData.isFile && (rowData.tailFileUpper == '.JPG'\r\n                    || rowData.tailFileUpper == '.JPEG' || rowData.tailFileUpper == '.PNG' )\"\r\n                        (click)=\"openObject(rowData)\" class=\"file-ex-thumbnail\" style=\"display: flex;\">\r\n                        <img class=\"thumbnail-img\" [src]=\"getPathImage(rowData.id)\" width=\"50px\" [alt]=\"rowData.name\"\r\n                            style=\"margin-right: 7px;\" />\r\n                    </span>\r\n\r\n                    <span (click)=\"openObject(rowData)\" class=\"{{rowData.class}} file-ex-name\">\r\n                        {{rowData.name}}\r\n                    </span>\r\n\r\n                    <span *ngIf=\"rowData.signatures\" class=\"pull-right signature\" pTooltip=\"Xem chi ti\u1EBFt k\u00FD s\u1ED1\"\r\n                        tooltipPosition=\"top\" (click)=\"viewListSign($event, rowData.signatures)\">\r\n                        <i class=\"fas fa-signature\"></i>\r\n                    </span>\r\n                </div>\r\n            </ng-template>\r\n\r\n            <!-- <ng-template #thumbnail let-rowData=\"rowData\" let-col=\"col\">\r\n                <div style=\"text-align: center;\">\r\n                    <img *ngIf=\"rowData.isFile && (rowData.tailFile.toUpperCase() == '.JPG'\r\n                    || rowData.tailFile.toUpperCase() == '.JPEG' || rowData.tailFile.toUpperCase() == '.PNG' )\"\r\n                        class=\"thumbnail-img\" [src]=\"getPathImage(rowData.id)\" width=\"100px\" [alt]=\"rowData.name\" />\r\n                </div>\r\n            </ng-template> -->\r\n\r\n            <ng-template #fileSize let-rowData='rowData'>\r\n                <div *ngIf=\"rowData.isFile\">{{rowData.fileSize | fileSize}}</div>\r\n            </ng-template>\r\n\r\n            <ng-template #function let-rowData=\"rowData\" let-crudList=\"crudList\">\r\n                <div class=\"function-list\">\r\n                    <ng-container *ngIf=\"!readonly\">\r\n                        <button class=\"p-button-rounded p-button-text link-or-action\" pButton type=\"button\"\r\n                            tooltipPosition=\"top\" pTooltip=\"{{getButtonTooltip(rowData)}}\"\r\n                            icon=\"{{getButtonIcon(rowData)}}\" (click)=\"onButtonClick(rowData)\"></button>\r\n\r\n                        <button class=\"p-button-danger p-button-rounded p-button-text link-or-action\" pButton\r\n                            type=\"button\" pTooltip=\"X\u00F3a\" tooltipPosition=\"top\" icon=\"pi pi-trash\"\r\n                            (click)=\"deleteFile(rowData)\"></button>\r\n\r\n                        <button type=\"button\" pButton icon=\"pi pi-ellipsis-v\"\r\n                            class=\"link-or-action p-button-text p-button-rounded\" pTooltip=\"Th\u00EAm\" tooltipPosition=\"top\"\r\n                            (click)=\"showContextMenu($event, rowData)\"></button>\r\n                    </ng-container>\r\n                    <button *ngIf=\"readonly\" class=\"p-button-secondary p-button-rounded p-button-text link-or-action\"\r\n                        pButton type=\"button\" pTooltip=\"T\u1EA3i v\u1EC1\" tooltipPosition=\"top\" icon=\"pi pi-cloud-download\"\r\n                        (click)=\"download(rowData)\"></button>\r\n                    <button *ngIf=\"readonly\" class=\"p-button-secondary p-button-rounded p-button-text link-or-action\"\r\n                        pButton type=\"button\" pTooltip=\"Sao ch\u00E9p \u0111\u01B0\u1EDDng d\u1EABn\" tooltipPosition=\"top\" icon=\"pi pi-link\"\r\n                        (click)=\"copyDownloadLink(rowData)\"></button>\r\n                </div>\r\n            </ng-template>\r\n        </crud-list>\r\n    </div>\r\n</div>\r\n\r\n<div *ngIf=\"layout == _layout.SIMPLE\" class=\"not-full-layout\" [class.readonly]=\"readonly\">\r\n    <div *ngIf=\"!readonly || data.breadcrumbs.length > 0\" class=\"fm-toolbar\">\r\n        <div class=\"fm-toolbar-buttons\">\r\n            <ng-container *ngIf=\"!readonly\">\r\n                <button *ngIf=\"!hiddenCreateFolder\" (click)=\"createFolder()\" pButton pRipple type=\"button\"\r\n                    pTooltip=\"T\u1EA1o th\u01B0 m\u1EE5c m\u1EDBi\" tooltipPosition=\"top\" icon=\"pi pi-folder\" class=\"p-button-text\"\r\n                    label=\"T\u1EA1o th\u01B0 m\u1EE5c\" iconPos=\"left\">\r\n                </button>\r\n                <button type=\"button\" pButton class=\"p-button-text p-button-info link-or-action\"\r\n                    icon=\"pi pi-cloud-upload\" (click)=\"selectFile()\" label=\"T\u1EA3i l\u00EAn\"></button>\r\n                <button pButton icon=\"pi pi-link\" pTooltip=\"T\u1EA3i t\u1EEB li\u00EAn k\u1EBFt trong h\u1EC7 th\u1ED1ng\" tooltipPosition=\"top\"\r\n                    type=\"button\" class=\"p-button-text p-button-primary\" label=\"T\u1EA3i li\u00EAn k\u1EBFt\"\r\n                    (click)=\"showAttachLinkBox = true\"></button>\r\n                <button *ngIf=\"!inTaiLieu\" pButton icon=\"pi pi-book\" pTooltip=\"T\u00E0i li\u1EC7u d\u00F9ng chung\"\r\n                    tooltipPosition=\"top\" type=\"button\" class=\"p-button-text\" label=\"T\u00E0i li\u1EC7u\"\r\n                    (click)=\"showTaiLieuDungChung = true;\">\r\n                </button>\r\n            </ng-container>\r\n        </div>\r\n        <ng-container *ngTemplateOutlet=\"breadCrumb\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"nfl-grid\">\r\n        <ng-container *ngIf=\"_dataSource && _dataSource.length > 0\">\r\n            <div *ngFor=\"let rowData of _dataSource; index as i\" class=\"nfl-item\">\r\n                <div class=\"nfl-no\">\r\n                    {{i + 1}}.\r\n                </div>\r\n\r\n                <div class=\"nfl-name\">\r\n                    <span class=\"pull-left file-ex-icon\" [innerHTML]=\"rowData.name | fileIcon : !rowData.isFile\">\r\n                    </span>\r\n                    <a (click)=\"openObject(rowData)\" class=\"{{rowData.class}} file-ex-name\">\r\n                        <span>\r\n                            <span>{{rowData.name}}</span>\r\n                        </span>\r\n                    </a>\r\n                </div>\r\n                <div *ngIf=\"rowData.signatures\" class=\"nfl-signature signature\" pTooltip=\"Xem chi ti\u1EBFt k\u00FD s\u1ED1\"\r\n                    tooltipPosition=\"top\" (click)=\"viewListSign($event, rowData.signatures)\">\r\n                    <i class=\"fas fa-signature\"></i>\r\n                </div>\r\n                <div *ngIf=\"rowData.isFile\" class=\"nfl-version\">\r\n                    v{{rowData.currentFileVersion}}\r\n                </div>\r\n\r\n                <div class=\"nfl-function\">\r\n                    <ng-container *ngIf=\"!readonly\">\r\n                        <button class=\"p-button-rounded p-button-text link-or-action\" (click)=\"onButtonClick(rowData)\"\r\n                            pButton type=\"button\" tooltipPosition=\"top\" pTooltip=\"{{getButtonTooltip(rowData)}}\"\r\n                            icon=\"{{getButtonIcon(rowData)}}\"></button>\r\n\r\n                        <button class=\"p-button-danger p-button-rounded p-button-text link-or-action\"\r\n                            (click)=\"deleteFile(rowData)\" pButton type=\"button\" pTooltip=\"X\u00F3a\" tooltipPosition=\"top\"\r\n                            icon=\"pi pi-trash\"></button>\r\n                    </ng-container>\r\n\r\n                    <button *ngIf=\"readonly\" class=\"p-button-secondary p-button-rounded p-button-text link-or-action\"\r\n                        (click)=\"download(rowData)\" pButton type=\"button\" pTooltip=\"T\u1EA3i v\u1EC1\" tooltipPosition=\"top\"\r\n                        icon=\"pi pi-cloud-download\"></button>\r\n                    <button *ngIf=\"readonly\" class=\"p-button-secondary p-button-rounded p-button-text link-or-action\"\r\n                        pButton type=\"button\" pTooltip=\"Sao ch\u00E9p \u0111\u01B0\u1EDDng d\u1EABn\" tooltipPosition=\"top\" icon=\"pi pi-link\"\r\n                        (click)=\"copyDownloadLink(rowData)\"></button>\r\n                    <button type=\"button\" pButton icon=\"pi pi-ellipsis-v\"\r\n                        class=\"link-or-action p-button-text p-button-rounded\" pTooltip=\"Th\u00EAm\" tooltipPosition=\"top\"\r\n                        (click)=\"showContextMenu($event, rowData)\"></button>\r\n                </div>\r\n            </div>\r\n        </ng-container>\r\n        <div *ngIf=\"!_dataSource || !_dataSource.length\" class=\"nfl-no-item\">\r\n            Ch\u01B0a c\u00F3 t\u00E0i li\u1EC7u \u0111\u01B0\u1EE3c t\u1EA3i l\u00EAn\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<div *ngIf=\"layout == _layout.SIMPLE_FOR_LIST\" class=\"not-full-layout\" [class.readonly]=\"readonly\">\r\n    <div *ngIf=\"!readonly || data.breadcrumbs.length > 0\" class=\"fm-toolbar\">\r\n        <div class=\"fm-toolbar-buttons\">\r\n            <ng-container *ngIf=\"!readonly\">\r\n                <button *ngIf=\"!hiddenCreateFolder\" (click)=\"createFolder()\" pButton pRipple type=\"button\"\r\n                    pTooltip=\"T\u1EA1o th\u01B0 m\u1EE5c m\u1EDBi\" tooltipPosition=\"top\" icon=\"pi pi-folder\" class=\"p-button-text\"\r\n                    label=\"T\u1EA1o th\u01B0 m\u1EE5c\" iconPos=\"left\">\r\n                </button>\r\n                <button type=\"button\" pButton class=\"p-button-text p-button-info link-or-action\"\r\n                    icon=\"pi pi-cloud-upload\" (click)=\"selectFile()\" label=\"T\u1EA3i l\u00EAn\"></button>\r\n                <button pButton icon=\"pi pi-link\" pTooltip=\"T\u1EA3i t\u1EEB li\u00EAn k\u1EBFt trong h\u1EC7 th\u1ED1ng\" tooltipPosition=\"top\"\r\n                    type=\"button\" class=\"p-button-text p-button-primary\" label=\"T\u1EA3i li\u00EAn k\u1EBFt\"\r\n                    (click)=\"showAttachLinkBox = true\"></button>\r\n                <button *ngIf=\"!inTaiLieu\" pButton icon=\"pi pi-book\" pTooltip=\"T\u00E0i li\u1EC7u d\u00F9ng chung\"\r\n                    tooltipPosition=\"top\" type=\"button\" class=\"p-button-text\" label=\"T\u00E0i li\u1EC7u\"\r\n                    (click)=\"showTaiLieuDungChung = true;\">\r\n                </button>\r\n            </ng-container>\r\n        </div>\r\n        <ng-container *ngTemplateOutlet=\"breadCrumb\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"nfl-grid\">\r\n        <ng-container *ngIf=\"_dataSource && _dataSource.length > 0\">\r\n            <div *ngFor=\"let rowData of _dataSource; index as i\" class=\"nfl-item\">\r\n                <div class=\"nfl-no\">\r\n                    {{i + 1}}.\r\n                </div>\r\n\r\n                <div class=\"nfl-name\">\r\n                    <span class=\"pull-left file-ex-icon\" [innerHTML]=\"rowData.name | fileIcon : !rowData.isFile\">\r\n                    </span>\r\n\r\n                    <a (click)=\"openObject(rowData)\" class=\"{{rowData.class}} file-ex-name\">\r\n                        <span>\r\n                            <span>{{rowData.name}}</span>\r\n                        </span>\r\n                    </a>\r\n                </div>\r\n\r\n                <div class=\"nfl-function\">\r\n                    <ng-container *ngIf=\"!readonly\">\r\n                        <button class=\"p-button-rounded p-button-text link-or-action\" (click)=\"onButtonClick(rowData)\"\r\n                            pButton type=\"button\" tooltipPosition=\"top\" pTooltip=\"{{getButtonTooltip(rowData)}}\"\r\n                            icon=\"{{getButtonIcon(rowData)}}\"></button>\r\n\r\n                        <button class=\"p-button-danger p-button-rounded p-button-text link-or-action\"\r\n                            (click)=\"deleteFile(rowData)\" pButton type=\"button\" pTooltip=\"X\u00F3a\" tooltipPosition=\"top\"\r\n                            icon=\"pi pi-trash\"></button>\r\n                    </ng-container>\r\n                    <button type=\"button\" pButton icon=\"pi pi-ellipsis-v\"\r\n                        class=\"link-or-action p-button-text p-button-rounded\" pTooltip=\"Th\u00EAm\" tooltipPosition=\"top\"\r\n                        (click)=\"showContextMenu($event, rowData)\"></button>\r\n                </div>\r\n            </div>\r\n        </ng-container>\r\n        <div *ngIf=\"!_dataSource || !_dataSource.length\" class=\"nfl-no-item\">\r\n            Ch\u01B0a c\u00F3 t\u00E0i li\u1EC7u \u0111\u01B0\u1EE3c t\u1EA3i l\u00EAn\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #breadCrumb>\r\n    <div *ngIf=\"data.breadcrumbs.length > 1\" class=\"fm-toolbar-path\">\r\n        <p-breadcrumb class=\"customBreadCrumb\" [model]=\"data.breadcrumbs\"></p-breadcrumb>\r\n    </div>\r\n</ng-template>\r\n\r\n<p-fileUpload #fileControl [ngStyle]=\"{'display': 'none'}\" mode=\"basic\" [chooseLabel]=\"chooseLabel\" name=\"file\"\r\n    [url]=\"apiUploadUrl\" auto=\"true\" [invalidFileSizeMessageSummary]=\"invalidFileSizeMessageSummary\"\r\n    [invalidFileSizeMessageDetail]=\"invalidFileSizeMessageDetail\"\r\n    [invalidFileTypeMessageSummary]=\"invalidFileTypeMessageSummary\"\r\n    [invalidFileTypeMessageDetail]=\"invalidFileTypeMessageDetail\"\r\n    [invalidFileLimitMessageSummary]=\"invalidFileLimitMessageSummary\"\r\n    [invalidFileLimitMessageDetail]=\"invalidFileLimitMessageDetail\" [accept]=\"accept\"\r\n    (onProgress)=\"onUploadProgress($event)\" (onBeforeUpload)=\"onBeforeUpload($event)\"\r\n    (onSelect)=\"handleSelectFile($event)\" (onUpload)=\"onUploaded($event)\" (onError)=\"handleError($event)\">\r\n</p-fileUpload>\r\n<p-contextMenu *ngIf=\"data.itemsMenuFile && data.itemsMenuFile.length > 0\" #contextMenu [appendTo]=\"'body'\"\r\n    [model]=\"data.itemsMenuFile\" styleClass=\"fm-contextMenu-panel\">\r\n</p-contextMenu>\r\n\r\n<!-- T\u1EA1o m\u1EDBi/ \u0111\u1ED5i t\u00EAn th\u01B0 m\u1EE5c -->\r\n<tn-dialog *ngIf=\"forms.createFolder.show\" #dialog [styleClass]=\"'address-form'\"\r\n    [header]=\"forms.createFolder.header | translate\" [popupSize]=\"forms[formIds.createFolder].popupSize\"\r\n    (onHide)=\"onCancelForm(formIds.createFolder)\">\r\n    <folder-form #formBase [parentModel]=\"model\" [parentContext]=\"context\"\r\n        [model]=\"forms[formIds.createFolder].formData\" (onSaved)=\"onSavedForm(formIds.createFolder)\"\r\n        (onCancel)=\"onCancelForm(formIds.createFolder)\">\r\n    </folder-form>\r\n</tn-dialog>\r\n\r\n<!-- \u0110\u1ED5i t\u00EAn file -->\r\n<tn-dialog *ngIf=\"forms.renameFile.show\" #dialog [styleClass]=\"'address-form'\"\r\n    [header]=\"forms.renameFile.header | translate\" [popupSize]=\"forms[formIds.renameFile].popupSize\"\r\n    (onHide)=\"onCancelForm(formIds.renameFile)\">\r\n    <file-form #formBase [parentModel]=\"model\" [parentContext]=\"context\" [model]=\"forms[formIds.renameFile].formData\"\r\n        (onSaved)=\"onSavedForm(formIds.renameFile)\" (onCancel)=\"onCancelForm(formIds.renameFile)\">\r\n    </file-form>\r\n</tn-dialog>\r\n\r\n<!-- Xem file tr\u1EF1c tuy\u1EBFn -->\r\n<file-viewer *ngIf=\"forms.fileViewer.show\" [parentModel]=\"model\" [parentContext]=\"context\" [readonly]=\"readonly\"\r\n    [model]=\"forms.fileViewer.formData\" (onClose)=\"closeFileViewer()\">\r\n</file-viewer>\r\n\r\n<!-- Xem phi\u00EAn b\u1EA3n -->\r\n<tn-dialog *ngIf=\"forms.fileVersionList.show\" #dialog [styleClass]=\"'address-form'\"\r\n    [header]=\"forms.fileVersionList.header | translate\" [popupSize]=\"forms[formIds.fileVersionList].popupSize\"\r\n    (onHide)=\"onCancelForm(formIds.fileVersionList)\">\r\n    <file-version-list *ngIf=\"forms.fileVersionList.show\" [parentModel]=\"model\" [parentContext]=\"context\"\r\n        [fileId]=\"forms[formIds.fileVersionList].fileId\" [readonly]=\"readonly\">\r\n    </file-version-list>\r\n</tn-dialog>\r\n\r\n<tn-dialog *ngIf=\"showAttachLinkBox\" #dialog2 [maximizable]=\"false\" [header]=\"'Nh\u1EADp li\u00EAn k\u1EBFt' | translate\"\r\n    [popupSize]=\"{ width: 600, height: 50}\" (onHide)=\"showAttachLinkBox = false; typedLink=''\">\r\n    <div class=\"p-col-12\">\r\n        <div class=\"p-grid\">\r\n            <div class=\"p-md-10\">\r\n                <input #input type=\"text\" placeholder=\"Nh\u1EADp li\u00EAn k\u1EBFt sao ch\u00E9p t\u1EEB t\u1EC7p tin kh\u00E1c...\"\r\n                    (keyup.enter)=\"addAttachLink()\" pInputText [(ngModel)]=\"typedLink\" class=\"p-col-12\" />\r\n            </div>\r\n            <div class=\"p-md-2\">\r\n                <button type=\"button\" (click)=\"addAttachLink()\" [disabled]=\"typedLink != ''? null : true\" pButton\r\n                    class=\"p-button-primary p-col-12\" label=\"Ok\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <after-view-checked (loaded)=\"focusInput(input)\"></after-view-checked>\r\n</tn-dialog>\r\n\r\n<tn-dialog #dialog3 *ngIf=\"showTaiLieuDungChung\" [header]=\"'T\u00E0i li\u1EC7u' |translate\"\r\n    [popupSize]=\"{ width:1200, height: 650 }\" (onHide)=\"showTaiLieuDungChung = false\">\r\n    <file-tai-lieu #formBase [originalFolderId]=\"data.currentFolderId\"\r\n        (onSaved)=\"showTaiLieuDungChung = false; this._triggerProcessData()\" (onCancel)=\"showTaiLieuDungChung = false\">\r\n    </file-tai-lieu>\r\n</tn-dialog>\r\n\r\n<!--\r\n\r\n<share-file *ngIf=\"forms.shareFile.show\" [parentDataModel]=\"model\" [parentDataContext]=\"context\"\r\n    [model]=\"forms.shareFile.formData\">\r\n</share-file>\r\n\r\n<share-folder *ngIf=\"forms.shareFolder.show\" [parentDataModel]=\"model\" [parentDataContext]=\"context\"\r\n    [model]=\"forms.shareFolder.formData\">\r\n</share-folder>\r\n -->\r\n\r\n<!-- Xem ch\u1EEF k\u00FD s\u1ED1 -->\r\n<tn-dialog *ngIf=\"forms.signatureDetail.show\" #dialog [styleClass]=\"'address-form'\"\r\n    [header]=\"forms.signatureDetail.header | translate\" [popupSize]=\"forms[formIds.signatureDetail].popupSize\"\r\n    (onHide)=\"onCancelForm(formIds.signatureDetail)\">\r\n    <signature-detail [parentModel]=\"model\" [parentContext]=\"context\">\r\n    </signature-detail>\r\n</tn-dialog>\r\n\r\n<!--K\u00FD s\u1ED1 sim-->\r\n<tn-dialog *ngIf=\"forms.kySoSim.show\" #dialog [styleClass]=\"'address-form'\" [header]=\"forms.kySoSim.header | translate\"\r\n    [popupSize]=\"forms.kySoSim.popupSize\" [showFooter]=\"true\" (onHide)=\"onCancelForm(formIds.kySoSim)\">\r\n    <app-file-ky-so-sim #fileKySoSim [parentModel]=\"model\" [parentContext]=\"context\">\r\n    </app-file-ky-so-sim>\r\n    <ng-template #footer>\r\n        <button type=\"button\" pButton icon=\"fas fa-images\" [disabled]=\"model.submitting\" class=\"p-button-text\"\r\n            [label]=\"'Ch\u1ECDn ch\u1EEF k\u00FD' | translate\" (click)=\"chonChuKy()\"></button>\r\n        <button type=\"button\" pButton icon=\"fas fa-signature\" class=\"p-button-text ui-button-success\"\r\n            [disabled]=\"model.submitting\" [label]=\"'Th\u1EF1c hi\u1EC7n k\u00FD' | translate\" (click)=\"kySo()\"></button>\r\n        <button type=\"button\" pButton icon=\"pi pi-replay\" class=\"p-button-text p-button-secondary\"\r\n            [label]=\"'FORM.CANCEL' | translate\" preventTab (click)=\"forms.kySoSim.show=false\"></button>\r\n    </ng-template>\r\n</tn-dialog>\r\n\r\n<!-- Xem chi ti\u1EBFt -->\r\n<tn-dialog *ngIf=\"forms.viewDetail.show\" #dialog [styleClass]=\"'address-form'\"\r\n    [header]=\"forms.viewDetail.header | translate\" [popupSize]=\"forms[formIds.viewDetail].popupSize\"\r\n    (onHide)=\"onCancelForm(formIds.viewDetail)\">\r\n    <view-detail #formBase [parentModel]=\"model\" [parentContext]=\"context\" [model]=\"forms.viewDetail.formData\"\r\n        (onCancel)=\"onCancelForm(formIds.viewDetail)\">\r\n    </view-detail>\r\n</tn-dialog>",
+                    template: "<div *ngIf=\"layout == _layout.LIST\" class=\"full-layout p-grid\">\r\n    <div *ngIf=\"visibleFolder\" class=\"tree-layout\" [class]=\"visibleFolder ? 'p-col-12 p-lg-2' : '' \">\r\n        <div class=\"tree-layout-btn\">\r\n            <button *ngIf=\"!hiddenCreateFolder && !readonly\" pButton pRipple type=\"button\" pTooltip=\"T\u1EA1o th\u01B0 m\u1EE5c m\u1EDBi\"\r\n                tooltipPosition=\"top\" icon=\"pi pi-folder\" class=\"p-button-text\" label=\"T\u1EA1o th\u01B0 m\u1EE5c\" iconPos=\"left\"\r\n                (click)=\"createFolder()\">\r\n            </button>\r\n        </div>\r\n        <div class=\"tree-layout-wrapper\">\r\n            <perfect-scrollbar #scrollbar class=\"defaulFlexColumn treeOrg\" [config]=\"{suppressScrollX : true}\">\r\n                <p-tree class=\"folderTree\" selectionMode=\"single\" [style]=\"{ 'width' : '100%'}\"\r\n                    [(selection)]=\"selectedTreeNode\" [value]=\"rootTreeNode\" [contextMenu]=\"contextMenu\"\r\n                    (onNodeSelect)=\"nodeSelect($event)\">\r\n                    <ng-template let-node pTemplate=\"default\">\r\n                        <span [id]=\"node.data\" class=\"custom-node\"\r\n                            (contextmenu)=\"showContextMenu($event, node, true)\">{{node.label}}</span>\r\n                    </ng-template>\r\n                </p-tree>\r\n            </perfect-scrollbar>\r\n        </div>\r\n    </div>\r\n    <div class=\"fm-grid\" [class]=\"visibleFolder ? 'p-col-12 p-lg-10' : 'p-col-12' \">\r\n        <crud-list #crudList [model]=\"model\" [setting]=\"setting\" [dataSource]=\"_dataSource\"\r\n            [disableKeypressControl]=\"true\" [showScrollBar]=\"false\" class=\"--auto-height-content --no-wrapper-padding\"\r\n            [widthFunctionColumn]=\"'8.2rem'\" [showScrollHorizontal]=\"true\" (onReload)=\"_triggerProcessData($event)\"\r\n            (onRowSelect)=\"onRowSelect($event)\">\r\n            <ng-template #customTitle>\r\n                <ng-container *ngTemplateOutlet=\"breadCrumb\"></ng-container>\r\n            </ng-template>\r\n            <ng-template #toolbar>\r\n                <button pButton pRipple type=\"button\"\r\n                    [pTooltip]=\"visibleFolder == true ? '\u1EA8n c\u00E2y th\u01B0 m\u1EE5c' : 'Hi\u1EC7n c\u00E2y th\u01B0 m\u1EE5c'\" tooltipPosition=\"top\"\r\n                    [icon]=\"visibleFolder ? 'far fa-eye-slash': 'far fa-eye'\" class=\"p-button-text\"\r\n                    [label]=\"visibleFolder == true ? '\u1EA8n c\u00E2y th\u01B0 m\u1EE5c' : 'Hi\u1EC7n c\u00E2y th\u01B0 m\u1EE5c'\" iconPos=\"left\"\r\n                    (click)=\"changeVisibleFolder()\">\r\n                </button>\r\n\r\n                <button *ngIf=\"!hiddenCreateFolder && !readonly && !visibleFolder\" pButton pRipple type=\"button\"\r\n                    pTooltip=\"T\u1EA1o th\u01B0 m\u1EE5c m\u1EDBi\" tooltipPosition=\"top\" icon=\"pi pi-folder\" class=\"p-button-text\"\r\n                    label=\"T\u1EA1o th\u01B0 m\u1EE5c\" iconPos=\"left\" (click)=\"createFolder()\">\r\n                </button>\r\n\r\n                <button *ngIf=\"!readonly\" pButton icon=\"pi pi-cloud-upload\" pTooltip=\"T\u1EA3i t\u1EC7p tin t\u1EEB m\u00E1y t\u00EDnh c\u1EE7a b\u1EA1n\"\r\n                    tooltipPosition=\"top\" type=\"button\" class=\"p-button-text p-button-primary\" label=\"T\u1EA3i l\u00EAn\"\r\n                    (click)=\"selectFile()\"></button>\r\n\r\n                <button *ngIf=\"!readonly\" pButton icon=\"pi pi-link\" pTooltip=\"T\u1EA3i t\u1EEB li\u00EAn k\u1EBFt trong h\u1EC7 th\u1ED1ng\"\r\n                    tooltipPosition=\"top\" type=\"button\" class=\"p-button-text p-button-primary\" label=\"T\u1EA3i li\u00EAn k\u1EBFt\"\r\n                    (click)=\"showAttachLinkBox = true\"></button>\r\n\r\n                <button *ngIf=\"!inTaiLieu && !inTaiLieuChung && !readonly\" pButton icon=\"pi pi-book\"\r\n                    pTooltip=\"Sao ch\u00E9p t\u1EEB t\u00E0i li\u1EC7u d\u00F9ng chung ho\u1EB7c c\u00E1 nh\u00E2n\" tooltipPosition=\"top\" type=\"button\"\r\n                    class=\"p-button-text\" label=\"T\u00E0i li\u1EC7u\" (click)=\"showTaiLieuDungChung = true;\">\r\n                </button>\r\n\r\n                <button *ngIf=\"canSelect()\" class=\"p-button-text p-button-success\" pButton type=\"button\"\r\n                    pTooltip=\"Di chuy\u1EC3n th\u01B0 m\u1EE5c/t\u1EC7p tin \u0111\u00E3 ch\u1ECDn\" tooltipPosition=\"top\" icon=\"fas fa-arrows-alt\"\r\n                    iconPos=\"left\" label=\"Di chuy\u1EC3n\" (click)=\"moveExplorerItems()\">\r\n                </button>\r\n\r\n                <button *ngIf=\"canSetMove()\" class=\"p-button-text p-button-success\" pButton type=\"button\"\r\n                    pTooltip=\"Di chuy\u1EC3n th\u01B0 m\u1EE5c/t\u1EC7p tin \u0111\u00E3 ch\u1ECDn t\u1EDBi \u0111\u00E2y\" tooltipPosition=\"top\" icon=\"far fa-hand-paper\"\r\n                    iconPos=\"left\" label=\"\u0110\u1EB7t t\u1EA1i \u0111\u00E2y\" (click)=\"setMoveExplorerItems()\">\r\n                </button>\r\n\r\n                <button *ngIf=\"canSetMove()\" icon=\"pi pi-undo\" pButton class=\"p-button-text p-button-secondary\"\r\n                    type=\"button\" pTooltip=\"B\u1ECF di chuy\u1EC3n th\u01B0 m\u1EE5c/t\u1EC7p tin \u0111\u00E3 ch\u1ECDn\" tooltipPosition=\"top\" label=\"B\u1ECF qua\"\r\n                    (click)=\"cancelMove()\">\r\n                </button>\r\n\r\n                <button *ngIf=\"hasSelect() && !readonly\" pButton type=\"button\"\r\n                    pTooltip=\"{{ 'X\u00F3a th\u01B0 m\u1EE5c/t\u1EC7p tin \u0111\u00E3 ch\u1ECDn' | translate }}\" tooltipPosition=\"top\" icon=\"pi pi-trash\"\r\n                    iconPos=\"left\" class=\"p-button-text p-button-danger\" label=\"X\u00F3a\"\r\n                    (click)=\"deleteMutiple(model.selectedItems)\"></button>\r\n\r\n                <button *ngIf=\"hasSelect()\" class=\"p-button-text p-button-secondary\" pButton type=\"button\"\r\n                    pTooltip=\"N\u00E9n & t\u1EA3i v\u1EC1\" tooltipPosition=\"top\" icon=\"fas fa-file-archive\" iconPos=\"left\"\r\n                    label=\"T\u1EA3i v\u1EC1\" (click)=\"downloadMultiple()\">\r\n                </button>\r\n            </ng-template>\r\n\r\n            <ng-template #explorerItem let-rowData='rowData' let-col='col'>\r\n                <div style=\"display: flex; align-items: center;\">\r\n                    <span *ngIf=\"rowData.tailFileUpper != '.JPG'\r\n                    && rowData.tailFileUpper != '.JPEG' && rowData.tailFileUpper != '.PNG' \"\r\n                        (click)=\"openObject(rowData)\" class=\"pull-left file-ex-icon\" style=\"display: flex;\"\r\n                        [innerHTML]=\"rowData.name | fileIcon : !rowData.isFile\">\r\n                    </span>\r\n\r\n                    <span *ngIf=\"rowData.isFile && (rowData.tailFileUpper == '.JPG'\r\n                    || rowData.tailFileUpper == '.JPEG' || rowData.tailFileUpper == '.PNG' )\"\r\n                        (click)=\"openObject(rowData)\" class=\"file-ex-thumbnail\" style=\"display: flex;\">\r\n                        <img class=\"thumbnail-img\" [src]=\"getPathImage(rowData.id)\" width=\"50px\" [alt]=\"rowData.name\"\r\n                            style=\"margin-right: 7px;\" />\r\n                    </span>\r\n\r\n                    <span (click)=\"openObject(rowData)\" class=\"{{rowData.class}} file-ex-name\">\r\n                        {{rowData.name}}\r\n                    </span>\r\n\r\n                    <span *ngIf=\"rowData.signatures\" class=\"pull-right signature\" pTooltip=\"Xem chi ti\u1EBFt k\u00FD s\u1ED1\"\r\n                        tooltipPosition=\"top\" (click)=\"viewListSign($event, rowData.signatures)\">\r\n                        <i class=\"fas fa-signature\"></i>\r\n                    </span>\r\n                </div>\r\n            </ng-template>\r\n\r\n            <!-- <ng-template #thumbnail let-rowData=\"rowData\" let-col=\"col\">\r\n                <div style=\"text-align: center;\">\r\n                    <img *ngIf=\"rowData.isFile && (rowData.tailFile.toUpperCase() == '.JPG'\r\n                    || rowData.tailFile.toUpperCase() == '.JPEG' || rowData.tailFile.toUpperCase() == '.PNG' )\"\r\n                        class=\"thumbnail-img\" [src]=\"getPathImage(rowData.id)\" width=\"100px\" [alt]=\"rowData.name\" />\r\n                </div>\r\n            </ng-template> -->\r\n\r\n            <ng-template #fileSize let-rowData='rowData'>\r\n                <div *ngIf=\"rowData.isFile\">{{rowData.fileSize | fileSize}}</div>\r\n            </ng-template>\r\n\r\n            <ng-template #function let-rowData=\"rowData\" let-crudList=\"crudList\">\r\n                <div class=\"function-list\">\r\n                    <ng-container *ngIf=\"!readonly\">\r\n                        <button class=\"p-button-rounded p-button-text link-or-action\" pButton type=\"button\"\r\n                            tooltipPosition=\"top\" pTooltip=\"{{getButtonTooltip(rowData)}}\"\r\n                            icon=\"{{getButtonIcon(rowData)}}\" (click)=\"onButtonClick(rowData)\"></button>\r\n\r\n                        <button class=\"p-button-danger p-button-rounded p-button-text link-or-action\" pButton\r\n                            type=\"button\" pTooltip=\"X\u00F3a\" tooltipPosition=\"top\" icon=\"pi pi-trash\"\r\n                            (click)=\"deleteFile(rowData)\"></button>\r\n\r\n                        <button type=\"button\" pButton icon=\"pi pi-ellipsis-v\"\r\n                            class=\"link-or-action p-button-text p-button-rounded\" pTooltip=\"Th\u00EAm\" tooltipPosition=\"top\"\r\n                            (click)=\"showContextMenu($event, rowData)\"></button>\r\n                    </ng-container>\r\n                    <button *ngIf=\"readonly\" class=\"p-button-secondary p-button-rounded p-button-text link-or-action\"\r\n                        pButton type=\"button\" pTooltip=\"T\u1EA3i v\u1EC1\" tooltipPosition=\"top\" icon=\"pi pi-cloud-download\"\r\n                        (click)=\"download(rowData)\"></button>\r\n                    <button *ngIf=\"readonly\" class=\"p-button-secondary p-button-rounded p-button-text link-or-action\"\r\n                        pButton type=\"button\" pTooltip=\"Sao ch\u00E9p \u0111\u01B0\u1EDDng d\u1EABn\" tooltipPosition=\"top\" icon=\"pi pi-link\"\r\n                        (click)=\"copyDownloadLink(rowData)\"></button>\r\n                </div>\r\n            </ng-template>\r\n        </crud-list>\r\n    </div>\r\n</div>\r\n\r\n<div *ngIf=\"layout == _layout.SIMPLE\" class=\"not-full-layout\" [class.readonly]=\"readonly\">\r\n    <div *ngIf=\"!readonly || data.breadcrumbs.length > 0\" class=\"fm-toolbar\">\r\n        <div class=\"fm-toolbar-buttons\">\r\n            <ng-container *ngIf=\"!readonly\">\r\n                <button *ngIf=\"!hiddenCreateFolder\" (click)=\"createFolder()\" pButton pRipple type=\"button\"\r\n                    pTooltip=\"T\u1EA1o th\u01B0 m\u1EE5c m\u1EDBi\" tooltipPosition=\"top\" icon=\"pi pi-folder\" class=\"p-button-text\"\r\n                    label=\"T\u1EA1o th\u01B0 m\u1EE5c\" iconPos=\"left\">\r\n                </button>\r\n                <button type=\"button\" pButton class=\"p-button-text p-button-info link-or-action\"\r\n                    icon=\"pi pi-cloud-upload\" (click)=\"selectFile()\" label=\"T\u1EA3i l\u00EAn\"></button>\r\n                <button pButton icon=\"pi pi-link\" pTooltip=\"T\u1EA3i t\u1EEB li\u00EAn k\u1EBFt trong h\u1EC7 th\u1ED1ng\" tooltipPosition=\"top\"\r\n                    type=\"button\" class=\"p-button-text p-button-primary\" label=\"T\u1EA3i li\u00EAn k\u1EBFt\"\r\n                    (click)=\"showAttachLinkBox = true\"></button>\r\n                <button *ngIf=\"!inTaiLieu\" pButton icon=\"pi pi-book\" pTooltip=\"T\u00E0i li\u1EC7u d\u00F9ng chung\"\r\n                    tooltipPosition=\"top\" type=\"button\" class=\"p-button-text\" label=\"T\u00E0i li\u1EC7u\"\r\n                    (click)=\"showTaiLieuDungChung = true;\">\r\n                </button>\r\n            </ng-container>\r\n        </div>\r\n        <ng-container *ngTemplateOutlet=\"breadCrumb\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"nfl-grid\">\r\n        <ng-container *ngIf=\"_dataSource && _dataSource.length > 0\">\r\n            <div *ngFor=\"let rowData of _dataSource; index as i\" class=\"nfl-item\">\r\n                <div class=\"nfl-no\">\r\n                    {{i + 1}}.\r\n                </div>\r\n\r\n                <div class=\"nfl-name\">\r\n                    <span class=\"pull-left file-ex-icon\" [innerHTML]=\"rowData.name | fileIcon : !rowData.isFile\">\r\n                    </span>\r\n                    <a (click)=\"openObject(rowData)\" class=\"{{rowData.class}} file-ex-name\">\r\n                        <span>\r\n                            <span>{{rowData.name}}</span>\r\n                        </span>\r\n                    </a>\r\n                </div>\r\n                <div *ngIf=\"rowData.signatures\" class=\"nfl-signature signature\" pTooltip=\"Xem chi ti\u1EBFt k\u00FD s\u1ED1\"\r\n                    tooltipPosition=\"top\" (click)=\"viewListSign($event, rowData.signatures)\">\r\n                    <i class=\"fas fa-signature\"></i>\r\n                </div>\r\n                <div *ngIf=\"rowData.isFile\" class=\"nfl-version\">\r\n                    v{{rowData.currentFileVersion}}\r\n                </div>\r\n\r\n                <div class=\"nfl-function\">\r\n                    <ng-container *ngIf=\"!readonly\">\r\n                        <button class=\"p-button-rounded p-button-text link-or-action\" (click)=\"onButtonClick(rowData)\"\r\n                            pButton type=\"button\" tooltipPosition=\"top\" pTooltip=\"{{getButtonTooltip(rowData)}}\"\r\n                            icon=\"{{getButtonIcon(rowData)}}\"></button>\r\n\r\n                        <button class=\"p-button-danger p-button-rounded p-button-text link-or-action\"\r\n                            (click)=\"deleteFile(rowData)\" pButton type=\"button\" pTooltip=\"X\u00F3a\" tooltipPosition=\"top\"\r\n                            icon=\"pi pi-trash\"></button>\r\n                    </ng-container>\r\n\r\n                    <button *ngIf=\"readonly\" class=\"p-button-secondary p-button-rounded p-button-text link-or-action\"\r\n                        (click)=\"download(rowData)\" pButton type=\"button\" pTooltip=\"T\u1EA3i v\u1EC1\" tooltipPosition=\"top\"\r\n                        icon=\"pi pi-cloud-download\"></button>\r\n                    <button *ngIf=\"readonly\" class=\"p-button-secondary p-button-rounded p-button-text link-or-action\"\r\n                        pButton type=\"button\" pTooltip=\"Sao ch\u00E9p \u0111\u01B0\u1EDDng d\u1EABn\" tooltipPosition=\"top\" icon=\"pi pi-link\"\r\n                        (click)=\"copyDownloadLink(rowData)\"></button>\r\n                    <button type=\"button\" pButton icon=\"pi pi-ellipsis-v\"\r\n                        class=\"link-or-action p-button-text p-button-rounded\" pTooltip=\"Th\u00EAm\" tooltipPosition=\"top\"\r\n                        (click)=\"showContextMenu($event, rowData)\"></button>\r\n                </div>\r\n            </div>\r\n        </ng-container>\r\n        <div *ngIf=\"!_dataSource || !_dataSource.length\" class=\"nfl-no-item\">\r\n            Ch\u01B0a c\u00F3 t\u00E0i li\u1EC7u \u0111\u01B0\u1EE3c t\u1EA3i l\u00EAn\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<div *ngIf=\"layout == _layout.SIMPLE_FOR_LIST\" class=\"not-full-layout\" [class.readonly]=\"readonly\">\r\n    <div *ngIf=\"!readonly || data.breadcrumbs.length > 0\" class=\"fm-toolbar\">\r\n        <div class=\"fm-toolbar-buttons\">\r\n            <ng-container *ngIf=\"!readonly\">\r\n                <button *ngIf=\"!hiddenCreateFolder\" (click)=\"createFolder()\" pButton pRipple type=\"button\"\r\n                    pTooltip=\"T\u1EA1o th\u01B0 m\u1EE5c m\u1EDBi\" tooltipPosition=\"top\" icon=\"pi pi-folder\" class=\"p-button-text\"\r\n                    label=\"T\u1EA1o th\u01B0 m\u1EE5c\" iconPos=\"left\">\r\n                </button>\r\n                <button type=\"button\" pButton class=\"p-button-text p-button-info link-or-action\"\r\n                    icon=\"pi pi-cloud-upload\" (click)=\"selectFile()\" label=\"T\u1EA3i l\u00EAn\"></button>\r\n                <button pButton icon=\"pi pi-link\" pTooltip=\"T\u1EA3i t\u1EEB li\u00EAn k\u1EBFt trong h\u1EC7 th\u1ED1ng\" tooltipPosition=\"top\"\r\n                    type=\"button\" class=\"p-button-text p-button-primary\" label=\"T\u1EA3i li\u00EAn k\u1EBFt\"\r\n                    (click)=\"showAttachLinkBox = true\"></button>\r\n                <button *ngIf=\"!inTaiLieu\" pButton icon=\"pi pi-book\" pTooltip=\"T\u00E0i li\u1EC7u d\u00F9ng chung\"\r\n                    tooltipPosition=\"top\" type=\"button\" class=\"p-button-text\" label=\"T\u00E0i li\u1EC7u\"\r\n                    (click)=\"showTaiLieuDungChung = true;\">\r\n                </button>\r\n            </ng-container>\r\n        </div>\r\n        <ng-container *ngTemplateOutlet=\"breadCrumb\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"nfl-grid\">\r\n        <ng-container *ngIf=\"_dataSource && _dataSource.length > 0\">\r\n            <div *ngFor=\"let rowData of _dataSource; index as i\" class=\"nfl-item\">\r\n                <div class=\"nfl-no\">\r\n                    {{i + 1}}.\r\n                </div>\r\n\r\n                <div class=\"nfl-name\">\r\n                    <span class=\"pull-left file-ex-icon\" [innerHTML]=\"rowData.name | fileIcon : !rowData.isFile\">\r\n                    </span>\r\n\r\n                    <a (click)=\"openObject(rowData)\" class=\"{{rowData.class}} file-ex-name\">\r\n                        <span>\r\n                            <span>{{rowData.name}}</span>\r\n                        </span>\r\n                    </a>\r\n                </div>\r\n\r\n                <div class=\"nfl-function\">\r\n                    <ng-container *ngIf=\"!readonly\">\r\n                        <button class=\"p-button-rounded p-button-text link-or-action\" (click)=\"onButtonClick(rowData)\"\r\n                            pButton type=\"button\" tooltipPosition=\"top\" pTooltip=\"{{getButtonTooltip(rowData)}}\"\r\n                            icon=\"{{getButtonIcon(rowData)}}\"></button>\r\n\r\n                        <button class=\"p-button-danger p-button-rounded p-button-text link-or-action\"\r\n                            (click)=\"deleteFile(rowData)\" pButton type=\"button\" pTooltip=\"X\u00F3a\" tooltipPosition=\"top\"\r\n                            icon=\"pi pi-trash\"></button>\r\n                    </ng-container>\r\n                    <button type=\"button\" pButton icon=\"pi pi-ellipsis-v\"\r\n                        class=\"link-or-action p-button-text p-button-rounded\" pTooltip=\"Th\u00EAm\" tooltipPosition=\"top\"\r\n                        (click)=\"showContextMenu($event, rowData)\"></button>\r\n                </div>\r\n            </div>\r\n        </ng-container>\r\n        <div *ngIf=\"!_dataSource || !_dataSource.length\" class=\"nfl-no-item\">\r\n            Ch\u01B0a c\u00F3 t\u00E0i li\u1EC7u \u0111\u01B0\u1EE3c t\u1EA3i l\u00EAn\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #breadCrumb>\r\n    <div *ngIf=\"data.breadcrumbs.length > 1\" class=\"fm-toolbar-path\">\r\n        <p-breadcrumb class=\"customBreadCrumb\" [model]=\"data.breadcrumbs\"></p-breadcrumb>\r\n    </div>\r\n</ng-template>\r\n\r\n<p-fileUpload #fileControl [ngStyle]=\"{'display': 'none'}\" mode=\"basic\" [chooseLabel]=\"chooseLabel\" [name]=\"fileInForm\"\r\n    [url]=\"apiUploadUrl\" auto=\"true\" [invalidFileSizeMessageSummary]=\"invalidFileSizeMessageSummary\"\r\n    [invalidFileSizeMessageDetail]=\"invalidFileSizeMessageDetail\"\r\n    [invalidFileTypeMessageSummary]=\"invalidFileTypeMessageSummary\"\r\n    [invalidFileTypeMessageDetail]=\"invalidFileTypeMessageDetail\"\r\n    [invalidFileLimitMessageSummary]=\"invalidFileLimitMessageSummary\"\r\n    [invalidFileLimitMessageDetail]=\"invalidFileLimitMessageDetail\" [accept]=\"accept\" [multiple]=\"control.multiple\"\r\n    (onProgress)=\"onUploadProgress($event)\" (onBeforeUpload)=\"onBeforeUpload($event)\"\r\n    (onSelect)=\"handleSelectFile($event)\" (onUpload)=\"onUploaded($event)\" (onError)=\"handleError($event)\">\r\n</p-fileUpload>\r\n<p-contextMenu *ngIf=\"data.itemsMenuFile && data.itemsMenuFile.length > 0\" #contextMenu [appendTo]=\"'body'\"\r\n    [model]=\"data.itemsMenuFile\" styleClass=\"fm-contextMenu-panel\">\r\n</p-contextMenu>\r\n\r\n<!-- T\u1EA1o m\u1EDBi/ \u0111\u1ED5i t\u00EAn th\u01B0 m\u1EE5c -->\r\n<tn-dialog *ngIf=\"forms.createFolder.show\" #dialog [styleClass]=\"'address-form'\"\r\n    [header]=\"forms.createFolder.header | translate\" [popupSize]=\"forms[formIds.createFolder].popupSize\"\r\n    (onHide)=\"onCancelForm(formIds.createFolder)\">\r\n    <folder-form #formBase [parentModel]=\"model\" [parentContext]=\"context\"\r\n        [model]=\"forms[formIds.createFolder].formData\" (onSaved)=\"onSavedForm(formIds.createFolder)\"\r\n        (onCancel)=\"onCancelForm(formIds.createFolder)\">\r\n    </folder-form>\r\n</tn-dialog>\r\n\r\n<!-- \u0110\u1ED5i t\u00EAn file -->\r\n<tn-dialog *ngIf=\"forms.renameFile.show\" #dialog [styleClass]=\"'address-form'\"\r\n    [header]=\"forms.renameFile.header | translate\" [popupSize]=\"forms[formIds.renameFile].popupSize\"\r\n    (onHide)=\"onCancelForm(formIds.renameFile)\">\r\n    <file-form #formBase [parentModel]=\"model\" [parentContext]=\"context\" [model]=\"forms[formIds.renameFile].formData\"\r\n        (onSaved)=\"onSavedForm(formIds.renameFile)\" (onCancel)=\"onCancelForm(formIds.renameFile)\">\r\n    </file-form>\r\n</tn-dialog>\r\n\r\n<!-- Xem file tr\u1EF1c tuy\u1EBFn -->\r\n<file-viewer *ngIf=\"forms.fileViewer.show\" [parentModel]=\"model\" [parentContext]=\"context\" [readonly]=\"readonly\"\r\n    [model]=\"forms.fileViewer.formData\" (onClose)=\"closeFileViewer()\">\r\n</file-viewer>\r\n\r\n<!-- Xem phi\u00EAn b\u1EA3n -->\r\n<tn-dialog *ngIf=\"forms.fileVersionList.show\" #dialog [styleClass]=\"'address-form'\"\r\n    [header]=\"forms.fileVersionList.header | translate\" [popupSize]=\"forms[formIds.fileVersionList].popupSize\"\r\n    (onHide)=\"onCancelForm(formIds.fileVersionList)\">\r\n    <file-version-list *ngIf=\"forms.fileVersionList.show\" [parentModel]=\"model\" [parentContext]=\"context\"\r\n        [fileId]=\"forms[formIds.fileVersionList].fileId\" [readonly]=\"readonly\">\r\n    </file-version-list>\r\n</tn-dialog>\r\n\r\n<tn-dialog *ngIf=\"showAttachLinkBox\" #dialog2 [maximizable]=\"false\" [header]=\"'Nh\u1EADp li\u00EAn k\u1EBFt' | translate\"\r\n    [popupSize]=\"{ width: 600, height: 50}\" (onHide)=\"showAttachLinkBox = false; typedLink=''\">\r\n    <div class=\"p-col-12\">\r\n        <div class=\"p-grid\">\r\n            <div class=\"p-md-10\">\r\n                <input #input type=\"text\" placeholder=\"Nh\u1EADp li\u00EAn k\u1EBFt sao ch\u00E9p t\u1EEB t\u1EC7p tin kh\u00E1c...\"\r\n                    (keyup.enter)=\"addAttachLink()\" pInputText [(ngModel)]=\"typedLink\" class=\"p-col-12\" />\r\n            </div>\r\n            <div class=\"p-md-2\">\r\n                <button type=\"button\" (click)=\"addAttachLink()\" [disabled]=\"typedLink != ''? null : true\" pButton\r\n                    class=\"p-button-primary p-col-12\" label=\"Ok\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <after-view-checked (loaded)=\"focusInput(input)\"></after-view-checked>\r\n</tn-dialog>\r\n\r\n<tn-dialog #dialog3 *ngIf=\"showTaiLieuDungChung\" [header]=\"'T\u00E0i li\u1EC7u' |translate\"\r\n    [popupSize]=\"{ width:1200, height: 650 }\" (onHide)=\"showTaiLieuDungChung = false\">\r\n    <file-tai-lieu #formBase [originalFolderId]=\"data.currentFolderId\"\r\n        (onSaved)=\"showTaiLieuDungChung = false; this._triggerProcessData()\" (onCancel)=\"showTaiLieuDungChung = false\">\r\n    </file-tai-lieu>\r\n</tn-dialog>\r\n\r\n<!--\r\n\r\n<share-file *ngIf=\"forms.shareFile.show\" [parentDataModel]=\"model\" [parentDataContext]=\"context\"\r\n    [model]=\"forms.shareFile.formData\">\r\n</share-file>\r\n\r\n<share-folder *ngIf=\"forms.shareFolder.show\" [parentDataModel]=\"model\" [parentDataContext]=\"context\"\r\n    [model]=\"forms.shareFolder.formData\">\r\n</share-folder>\r\n -->\r\n\r\n<!-- Xem ch\u1EEF k\u00FD s\u1ED1 -->\r\n<tn-dialog *ngIf=\"forms.signatureDetail.show\" #dialog [styleClass]=\"'address-form'\"\r\n    [header]=\"forms.signatureDetail.header | translate\" [popupSize]=\"forms[formIds.signatureDetail].popupSize\"\r\n    (onHide)=\"onCancelForm(formIds.signatureDetail)\">\r\n    <signature-detail [parentModel]=\"model\" [parentContext]=\"context\">\r\n    </signature-detail>\r\n</tn-dialog>\r\n\r\n<!--K\u00FD s\u1ED1 sim-->\r\n<tn-dialog *ngIf=\"forms.kySoSim.show\" #dialog [styleClass]=\"'address-form'\" [header]=\"forms.kySoSim.header | translate\"\r\n    [popupSize]=\"forms.kySoSim.popupSize\" [showFooter]=\"true\" (onHide)=\"onCancelForm(formIds.kySoSim)\">\r\n    <app-file-ky-so-sim #fileKySoSim [parentModel]=\"model\" [parentContext]=\"context\">\r\n    </app-file-ky-so-sim>\r\n    <ng-template #footer>\r\n        <button type=\"button\" pButton icon=\"fas fa-images\" [disabled]=\"model.submitting\" class=\"p-button-text\"\r\n            [label]=\"'Ch\u1ECDn ch\u1EEF k\u00FD' | translate\" (click)=\"chonChuKy()\"></button>\r\n        <button type=\"button\" pButton icon=\"fas fa-signature\" class=\"p-button-text ui-button-success\"\r\n            [disabled]=\"model.submitting\" [label]=\"'Th\u1EF1c hi\u1EC7n k\u00FD' | translate\" (click)=\"kySo()\"></button>\r\n        <button type=\"button\" pButton icon=\"pi pi-replay\" class=\"p-button-text p-button-secondary\"\r\n            [label]=\"'FORM.CANCEL' | translate\" preventTab (click)=\"forms.kySoSim.show=false\"></button>\r\n    </ng-template>\r\n</tn-dialog>\r\n\r\n<!-- Xem chi ti\u1EBFt -->\r\n<tn-dialog *ngIf=\"forms.viewDetail.show\" #dialog [styleClass]=\"'address-form'\"\r\n    [header]=\"forms.viewDetail.header | translate\" [popupSize]=\"forms[formIds.viewDetail].popupSize\"\r\n    (onHide)=\"onCancelForm(formIds.viewDetail)\">\r\n    <view-detail #formBase [parentModel]=\"model\" [parentContext]=\"context\" [model]=\"forms.viewDetail.formData\"\r\n        (onCancel)=\"onCancelForm(formIds.viewDetail)\">\r\n    </view-detail>\r\n</tn-dialog>",
                     providers: [
                         {
                             provide: forms.NG_VALUE_ACCESSOR,
@@ -52677,6 +52687,7 @@
             this.onBlur = new i0.EventEmitter();
             this.onChanged = new i0.EventEmitter();
             this.thousandSeperator = '.';
+            this.decimalMarker = ',';
         }
         Object.defineProperty(MaskComponent.prototype, "placeholder", {
             set: function (value) {
@@ -52758,7 +52769,7 @@
     MaskComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'tn-mask',
-                    template: "<ng-container *ngIf=\"viewMode\">\r\n    <div class=\"tn-mask-viewMode\">\r\n        <span *ngIf=\"prefix\">{{prefix}}</span>\r\n        <span *ngIf=\"autoFormat\">{{value | number}}</span>\r\n        <span *ngIf=\"!autoFormat\">{{value}}</span>\r\n        <span *ngIf=\"suffix\">({{suffix}})</span>\r\n    </div>\r\n</ng-container>\r\n<ng-container *ngIf=\"!viewMode\">\r\n    <div class=\"p-inputgroup\">\r\n        <span *ngIf=\"prefix\" class=\"p-inputgroup-addon\">{{prefix}}</span>\r\n        <input type=\"text\" pInputText [placeholder]=\"_placeholder\" [attr.disabled]=\"disabled ? true : null\"\r\n            [mask]=\"getMaskByType(maskType)\" [thousandSeparator]=\"thousandSeperator\" [class]=\"inputStyleClass\"\r\n            [(ngModel)]=\"value\" (focus)=\"handleFocus()\" (blur)=\"handleBlur()\" (change)=\"handleChangedValue()\" />\r\n        <span *ngIf=\"suffix\" class=\"p-inputgroup-addon\">({{suffix}})</span>\r\n    </div>\r\n</ng-container>",
+                    template: "<ng-container *ngIf=\"viewMode\">\r\n    <div class=\"tn-mask-viewMode\">\r\n        <span *ngIf=\"prefix\">{{prefix}}</span>\r\n        <span *ngIf=\"autoFormat\">{{value | number}}</span>\r\n        <span *ngIf=\"!autoFormat\">{{value}}</span>\r\n        <span *ngIf=\"suffix\">({{suffix}})</span>\r\n    </div>\r\n</ng-container>\r\n<ng-container *ngIf=\"!viewMode\">\r\n    <div class=\"p-inputgroup\">\r\n        <span *ngIf=\"prefix\" class=\"p-inputgroup-addon\">{{prefix}}</span>\r\n        <input type=\"text\" pInputText [placeholder]=\"_placeholder\" [attr.disabled]=\"disabled ? true : null\"\r\n            [mask]=\"getMaskByType(maskType)\" [thousandSeparator]=\"thousandSeperator\" [class]=\"inputStyleClass\"\r\n            [decimalMarker]=\"decimalMarker\" [(ngModel)]=\"value\" (focus)=\"handleFocus()\" (blur)=\"handleBlur()\"\r\n            (change)=\"handleChangedValue()\" />\r\n        <span *ngIf=\"suffix\" class=\"p-inputgroup-addon\">({{suffix}})</span>\r\n    </div>\r\n</ng-container>",
                     providers: [
                         {
                             provide: forms.NG_VALUE_ACCESSOR,
@@ -55860,8 +55871,6 @@
             _this.display = false;
             _this.showHelperCurrentPageState = true;
             _this.helps = [];
-            _this.usingVideoLink = false;
-            _this.videoLink = '';
             _this.environment = _moduleConfigService.getConfig().environment;
             if (_this.environment.helpConfig) {
                 _this.phoneNumber = _this.environment.helpConfig.expertPhoneNummber;
@@ -55881,8 +55890,6 @@
                 if (_this.environment.helpConfig.documents) {
                     _this.helps = _this.environment.helpConfig.documents;
                 }
-                _this.usingVideoLink = _this.environment.helpConfig.usingVideoLink;
-                _this.videoLink = _this.environment.helpConfig.videoLink;
             }
             return _this;
         }
@@ -55903,7 +55910,7 @@
     TnAppHelpComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'li[tn-app-help]',
-                    template: "<a href=\"javascript:;\" tabindex=\"9\" (click)=\"showHelper()\" style=\"height: 30px;\" pTooltip=\"Tr\u1EE3 gi\u00FAp\"\r\n    tooltipPosition=\"bottom\">\r\n    <span class=\"topbar-icon-left\">\r\n        <!-- <svg focusable=\"false\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"\r\n            class=\"topbar-icon animated swing svgmodule\">\r\n            <path fill=\"currentColor\"\r\n                d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 448c-110.532 0-200-89.431-200-200 0-110.495 89.472-200 200-200 110.491 0 200 89.471 200 200 0 110.53-89.431 200-200 200zm107.244-255.2c0 67.052-72.421 68.084-72.421 92.863V300c0 6.627-5.373 12-12 12h-45.647c-6.627 0-12-5.373-12-12v-8.659c0-35.745 27.1-50.034 47.579-61.516 17.561-9.845 28.324-16.541 28.324-29.579 0-17.246-21.999-28.693-39.784-28.693-23.189 0-33.894 10.977-48.942 29.969-4.057 5.12-11.46 6.071-16.666 2.124l-27.824-21.098c-5.107-3.872-6.251-11.066-2.644-16.363C184.846 131.491 214.94 112 261.794 112c49.071 0 101.45 38.304 101.45 88.8zM298 368c0 23.159-18.841 42-42 42s-42-18.841-42-42 18.841-42 42-42 42 18.841 42 42z\"\r\n                class=\"\"></path>\r\n        </svg> -->\r\n        <i class=\"topbar-icon animated swing pi pi-question-circle\"></i>\r\n    </span>\r\n    <span class=\"topbar-item-name\">{{ \"Tr\u1EE3 gi\u00FAp\" | translate }}</span>\r\n</a>\r\n\r\n<p-sidebar [styleClass]=\"'HelperSlideBar tn-l-sidebar-wrapper'\" [(visible)]=\"display\" position=\"right\"\r\n    [appendTo]=\"'body'\" [style]=\"{ width: '30em', border: 0, 'max-width': '100vw' }\">\r\n    <div style=\"background-color: #fff; box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.35);\">\r\n        <h1 style=\"font-size: 16px; color: #212529;\">Trung t\u00E2m tr\u1EE3 gi\u00FAp</h1>\r\n    </div>\r\n\r\n    <div class=\"tn-l-help-wrapper\">\r\n        <tn-custom-scrollbar #scrollbar [style]=\"{'max-height':'calc(100vh - 50px)'}\">\r\n            <div class=\"HelpCenter\">\r\n                <div class=\"p-grid\" style=\"margin-top:10px; margin-bottom: 25px;\">\r\n                    <div class=\"p-col-8\">\r\n                        <p style=\"font-weight:bold;font-size: 16px;margin-bottom: 8px; margin-top:20px\">\r\n                            {{environment.helpConfig?.expertName}}\r\n                        </p>\r\n                        <p style=\"margin: 0px;\">\r\n                            <a [href]=\"hrefTelephone\"><i class=\"fas fa-phone\"\r\n                                    style=\"margin-right: 8px; width: 15px\"></i>{{phoneNumber}}</a>\r\n                        </p>\r\n                        <p style=\"margin-top: 8px;\">\r\n                            <a [href]=\"hrefMail\"><i class=\"fas fa-envelope\"\r\n                                    style=\"margin-right: 8px; width: 15px\"></i>{{mail}}</a>\r\n                        </p>\r\n                    </div>\r\n                    <div class=\"p-col-4\">\r\n                        <img [src]=\"environment.helpConfig?.logoCompany\"\r\n                            style=\"width: 100%; float: right; opacity: 0.7;\" />\r\n                    </div>\r\n                </div>\r\n                <div class=\"p-grid p-m-0 HelpCenter-download\" style=\"margin-top: 0px; margin-bottom: 40px;\">\r\n                    <div class=\"p-col-12 help-title\">\r\n                        <span class=\"tit-name\">T\u00E0i li\u1EC7u - H\u01B0\u1EDBng d\u1EABn s\u1EED d\u1EE5ng c\u00E1c ph\u00E2n h\u1EC7 </span>\r\n                    </div>\r\n                    <div class=\"tn-l-pmti p-grid\"\r\n                        style=\"border: 1px solid #ccc; width: 100%;margin:0;margin-bottom:20px;\">\r\n                        <div *ngFor=\"let item of helps\" class=\"p-col-4 help-content\">\r\n                            <p style=\"margin-top: 18px; text-align: center;\">\r\n                                <a target=\"_blank\" [href]=\"item.href\"\r\n                                    style=\"display: inline-block; text-align: center;\">\r\n                                    <i class=\"{{item.icon}} app-switcher-item-icon\"\r\n                                        style=\"color: rgb(44 126 210);font-size: 3.5em;padding-bottom: 10px;\"></i>\r\n                                    <br />{{item.label}}\r\n                                </a>\r\n                            </p>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                <div class=\"p-grid p-m-0 HelpCenter-video\" style=\"margin-top: 0px\">\r\n                    <div class=\"p-col-12 help-title\">\r\n                        <span class=\"tit-name\">Xem h\u01B0\u1EDBng d\u1EABn</span>\r\n                    </div>\r\n                    <div class=\"p-col-12 help-content\">\r\n                        <h2 *ngIf=\"showHelperCurrentPageState\" style=\"margin-top: 0px\">\r\n                            <a *ngIf=\"!usingVideoLink\" href=\"javascript:;\" (click)=\"showHelperCurrentPage(null)\"\r\n                                style=\"display:inline-block; position: relative; border-top: 1px solid #52abf5;\">\r\n                                <img src=\"/assets/images/bgvideo.png\" alt=\"screen shot\"\r\n                                    style=\"width:100%; filter: brightness(0.88);\" />\r\n                                <i class=\"fab fa-youtube fa-2x\"></i>\r\n                            </a>\r\n                            <a *ngIf=\"usingVideoLink\" href=\"{{videoLink}}\" target=\"_blank\"\r\n                                style=\"display:inline-block; position: relative; border-top: 1px solid #52abf5;\">\r\n                                <img src=\"/assets/images/bgvideo.png\" alt=\"screen shot\"\r\n                                    style=\"width:100%; filter: brightness(0.88);\" />\r\n                                <i class=\"fab fa-youtube fa-2x\"></i>\r\n                            </a>\r\n                        </h2>\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"p-grid p-m-0 HelpCenter-download\" style=\"margin-top: 0px; margin-bottom: 40px;\">\r\n                    <div class=\"p-col-12 help-title\">\r\n                        <span class=\"tit-name\">Ph\u1EA7n m\u1EC1m ti\u1EC7n \u00EDch</span>\r\n                    </div>\r\n                    <div class=\"tn-l-pmti\" style=\"border: 1px solid #ccc; width: 100%\">\r\n                        <div class=\"p-col-4 help-content\">\r\n                            <p style=\"margin-top: 18px; text-align: center;\">\r\n                                <a target=\"_blank\" href=\"{{environment.signalr.linkDownloadClientApp}}\"\r\n                                    style=\"display: inline-block; text-align: center;\">\r\n                                    <img src=\"/assets/images/icon-appTN64x64.png\" />\r\n                                    <br />TN Client\r\n                                </a>\r\n                            </p>\r\n                        </div>\r\n                        <div class=\"p-col-4 help-content\">\r\n                            <p style=\"margin-top: 18px; text-align: center;\">\r\n                                <a target=\"_blank\" href=\"https://ultraviewer.net/vi/UltraViewer_setup_6.2_vi.exe\"\r\n                                    style=\"display: inline-block; text-align: center;\">\r\n                                    <img src=\"/assets/images/ultraviewer.ico\" />\r\n                                    <br />Ultraviewer\r\n                                </a>\r\n                            </p>\r\n                        </div>\r\n                        <div class=\"p-col-4 help-content\">\r\n                            <p style=\"margin-top: 18px; text-align: center;\">\r\n                                <a target=\"_blank\" href=\"https://www.teamviewer.com/vi/tai-xuong-tu-dong-teamviewer/\"\r\n                                    style=\"display: inline-block; text-align: center;\">\r\n                                    <img src=\"/assets/images/icon-teamviewer.png\" />\r\n                                    <br />Teamviewer\r\n                                </a>\r\n                            </p>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </tn-custom-scrollbar>\r\n    </div>\r\n</p-sidebar>",
+                    template: "<a href=\"javascript:;\" tabindex=\"9\" (click)=\"showHelper()\" style=\"height: 30px;\" pTooltip=\"Tr\u1EE3 gi\u00FAp\"\r\n    tooltipPosition=\"bottom\">\r\n    <span class=\"topbar-icon-left\">\r\n        <!-- <svg focusable=\"false\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"\r\n            class=\"topbar-icon animated swing svgmodule\">\r\n            <path fill=\"currentColor\"\r\n                d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 448c-110.532 0-200-89.431-200-200 0-110.495 89.472-200 200-200 110.491 0 200 89.471 200 200 0 110.53-89.431 200-200 200zm107.244-255.2c0 67.052-72.421 68.084-72.421 92.863V300c0 6.627-5.373 12-12 12h-45.647c-6.627 0-12-5.373-12-12v-8.659c0-35.745 27.1-50.034 47.579-61.516 17.561-9.845 28.324-16.541 28.324-29.579 0-17.246-21.999-28.693-39.784-28.693-23.189 0-33.894 10.977-48.942 29.969-4.057 5.12-11.46 6.071-16.666 2.124l-27.824-21.098c-5.107-3.872-6.251-11.066-2.644-16.363C184.846 131.491 214.94 112 261.794 112c49.071 0 101.45 38.304 101.45 88.8zM298 368c0 23.159-18.841 42-42 42s-42-18.841-42-42 18.841-42 42-42 42 18.841 42 42z\"\r\n                class=\"\"></path>\r\n        </svg> -->\r\n        <i class=\"topbar-icon animated swing pi pi-question-circle\"></i>\r\n    </span>\r\n    <span class=\"topbar-item-name\">{{ \"Tr\u1EE3 gi\u00FAp\" | translate }}</span>\r\n</a>\r\n\r\n<p-sidebar [styleClass]=\"'HelperSlideBar tn-l-sidebar-wrapper'\" [(visible)]=\"display\" position=\"right\"\r\n    [appendTo]=\"'body'\" [style]=\"{ width: '30em', border: 0, 'max-width': '100vw' }\">\r\n    <div style=\"background-color: #fff; box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.35);\">\r\n        <h1 style=\"font-size: 16px; color: #212529;\">Trung t\u00E2m tr\u1EE3 gi\u00FAp</h1>\r\n    </div>\r\n\r\n    <div class=\"tn-l-help-wrapper\">\r\n        <tn-custom-scrollbar #scrollbar [style]=\"{'max-height':'calc(100vh - 50px)'}\">\r\n            <div class=\"HelpCenter\">\r\n                <div class=\"p-grid\" style=\"margin-top:10px; margin-bottom: 25px;\">\r\n                    <div class=\"p-col-8\">\r\n                        <p style=\"font-weight:bold;font-size: 16px;margin-bottom: 8px; margin-top:20px\">\r\n                            {{environment.helpConfig?.expertName}}\r\n                        </p>\r\n                        <p style=\"margin: 0px;\">\r\n                            <a [href]=\"hrefTelephone\"><i class=\"fas fa-phone\"\r\n                                    style=\"margin-right: 8px; width: 15px\"></i>{{phoneNumber}}</a>\r\n                        </p>\r\n                        <p style=\"margin-top: 8px;\">\r\n                            <a [href]=\"hrefMail\"><i class=\"fas fa-envelope\"\r\n                                    style=\"margin-right: 8px; width: 15px\"></i>{{mail}}</a>\r\n                        </p>\r\n                    </div>\r\n                    <div class=\"p-col-4\">\r\n                        <img [src]=\"environment.helpConfig?.logoCompany\"\r\n                            style=\"width: 100%; float: right; opacity: 0.7;\" />\r\n                    </div>\r\n                </div>\r\n                <div class=\"p-grid p-m-0 HelpCenter-download\" style=\"margin-top: 0px; margin-bottom: 40px;\">\r\n                    <div class=\"p-col-12 help-title\">\r\n                        <span class=\"tit-name\">T\u00E0i li\u1EC7u - H\u01B0\u1EDBng d\u1EABn s\u1EED d\u1EE5ng c\u00E1c ph\u00E2n h\u1EC7 </span>\r\n                    </div>\r\n                    <div class=\"tn-l-pmti p-grid\"\r\n                        style=\"border: 1px solid #ccc; width: 100%;margin:0;margin-bottom:20px;\">\r\n                        <div *ngFor=\"let item of helps\" class=\"p-col-4 help-content\">\r\n                            <p style=\"margin-top: 18px; text-align: center;\">\r\n                                <a target=\"_blank\" [href]=\"item.href\"\r\n                                    style=\"display: inline-block; text-align: center;\">\r\n                                    <i class=\"{{item.icon}} app-switcher-item-icon\"\r\n                                        style=\"color: rgb(44 126 210);font-size: 3.5em;padding-bottom: 10px;\"></i>\r\n                                    <br />{{item.label}}\r\n                                </a>\r\n                            </p>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                <div class=\"p-grid p-m-0 HelpCenter-video\" style=\"margin-top: 0px\">\r\n                    <div class=\"p-col-12 help-title\">\r\n                        <span class=\"tit-name\">Xem h\u01B0\u1EDBng d\u1EABn</span>\r\n                    </div>\r\n                    <div class=\"p-col-12 help-content\">\r\n                        <h2 *ngIf=\"showHelperCurrentPageState\" style=\"margin-top: 0px\">\r\n                            <a href=\"javascript:;\" (click)=\"showHelperCurrentPage(null)\"\r\n                                style=\"display:inline-block; position: relative; border-top: 1px solid #52abf5;\">\r\n                                <img src=\"/assets/images/bgvideo.png\" alt=\"screen shot\"\r\n                                    style=\"width:100%; filter: brightness(0.88);\" />\r\n                                <i class=\"fab fa-youtube fa-2x\"></i>\r\n                            </a>\r\n                        </h2>\r\n                    </div>\r\n                </div>\r\n\r\n                <div class=\"p-grid p-m-0 HelpCenter-download\" style=\"margin-top: 0px; margin-bottom: 40px;\">\r\n                    <div class=\"p-col-12 help-title\">\r\n                        <span class=\"tit-name\">Ph\u1EA7n m\u1EC1m ti\u1EC7n \u00EDch</span>\r\n                    </div>\r\n                    <div class=\"tn-l-pmti\" style=\"border: 1px solid #ccc; width: 100%\">\r\n                        <div class=\"p-col-4 help-content\">\r\n                            <p style=\"margin-top: 18px; text-align: center;\">\r\n                                <a target=\"_blank\" href=\"{{environment.signalr.linkDownloadClientApp}}\"\r\n                                    style=\"display: inline-block; text-align: center;\">\r\n                                    <img src=\"/assets/images/icon-appTN64x64.png\" />\r\n                                    <br />TN Client\r\n                                </a>\r\n                            </p>\r\n                        </div>\r\n                        <div class=\"p-col-4 help-content\">\r\n                            <p style=\"margin-top: 18px; text-align: center;\">\r\n                                <a target=\"_blank\" href=\"https://ultraviewer.net/vi/UltraViewer_setup_6.2_vi.exe\"\r\n                                    style=\"display: inline-block; text-align: center;\">\r\n                                    <img src=\"/assets/images/ultraviewer.ico\" />\r\n                                    <br />Ultraviewer\r\n                                </a>\r\n                            </p>\r\n                        </div>\r\n                        <div class=\"p-col-4 help-content\">\r\n                            <p style=\"margin-top: 18px; text-align: center;\">\r\n                                <a target=\"_blank\" href=\"https://www.teamviewer.com/vi/tai-xuong-tu-dong-teamviewer/\"\r\n                                    style=\"display: inline-block; text-align: center;\">\r\n                                    <img src=\"/assets/images/icon-teamviewer.png\" />\r\n                                    <br />Teamviewer\r\n                                </a>\r\n                            </p>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </tn-custom-scrollbar>\r\n    </div>\r\n</p-sidebar>",
                     providers: [ComponentContextService],
                     styles: [".HelpCenter{color:#555;padding:0 20px}::ng-deep .tn-l-sidebar-wrapper{padding:0}.tn-l-pmti{display:flex}.HelpCenter p:first-child img{margin-bottom:10px}::ng-deep .HelperSlideBar .p-sidebar-content>button{color:#212529;cursor:pointer;font-size:20px;margin-right:14px;margin-top:10px}::ng-deep .ui-sidebar{padding:0}::ng-deep .HelperSlideBar h1{height:50px;line-height:50px;margin:0;padding-left:20px;text-transform:uppercase}.HelpCenter-video{position:relative}.HelpCenter-video i{color:#454545;cursor:pointer;left:50%;opacity:.5;position:absolute;top:calc(50% - 10px);transform:translateX(-50%) translateY(-50%);transition:.5s}.HelpCenter-video video{opacity:1}.HelpCenter-video:hover video{cursor:pointer;opacity:.5}.HelpCenter-video:hover i{opacity:1}.HelpCenter-download img{height:45px;width:45px}.HelpCenter .help-title{background-color:rgba(49,146,225,.8784313725490196);color:#fff}.HelpCenter .help-title .tit-name{font-size:14px;font-weight:700}.HelpCenter .help-content{padding:0}.HelpCenter .HelpCenter-comment .help-content{padding:0;text-align:center}.HelpCenter-comment,.HelpCenter-download,.HelpCenter-video{margin-bottom:15px}.tn-l-help-wrapper{display:flex;max-height:calc(100vh - 60px);overflow:auto}"]
                 },] }