tnx-shared 5.1.173 → 5.1.174

package/bundles/tnx-shared.umd.js

@@ -624,6 +624,7 @@
     }());
     var Filter = /** @class */ (function () {
         function Filter(init) {
+            this.valueIsField = false;
             this.filters = [];
             for (var key in init) {
                 this[key] = init[key];
@@ -2287,10 +2288,12 @@
                 filters: __spread(filters),
             });
         };
-        CommonService.prototype.newFilter = function (field, operator, value) {
+        CommonService.prototype.newFilter = function (field, operator, value, valueIsField) {
+            if (valueIsField === void 0) { valueIsField = false; }
             return new Filter({
                 field: field, operator: operator,
                 value: JSON.stringify(value),
+                valueIsField: valueIsField,
             });
         };
         CommonService.prototype.newFilterV4 = function (field, operator, value) {
@@ -2988,6 +2991,7 @@
         PermissionBase[PermissionBase["READ"] = 1] = "READ";
         PermissionBase[PermissionBase["EDIT"] = 2] = "EDIT";
         PermissionBase[PermissionBase["DELETE"] = 4] = "DELETE";
+        PermissionBase[PermissionBase["FULL"] = 7] = "FULL";
     })(exports.PermissionBase || (exports.PermissionBase = {}));
 
     var ExportItem = /** @class */ (function () {
@@ -3305,6 +3309,11 @@
         ButtonTextActionCongViec["XEM_LICH_SU"] = "Xem l\u1ECBch s\u1EED";
     })(exports.ButtonTextActionCongViec || (exports.ButtonTextActionCongViec = {}));
 
+    (function (EnumLoaiVanBanBase) {
+        EnumLoaiVanBanBase[EnumLoaiVanBanBase["VB_DEN"] = 1] = "VB_DEN";
+        EnumLoaiVanBanBase[EnumLoaiVanBanBase["VB_DI"] = 2] = "VB_DI";
+    })(exports.EnumLoaiVanBanBase || (exports.EnumLoaiVanBanBase = {}));
+
     var ModelSchema = /** @class */ (function () {
         function ModelSchema(init) {
             this.dataType = 'string';
@@ -4223,6 +4232,8 @@
             _this.mdWidth = 12;
             _this.useVbDen = true;
             _this.useVbDi = true;
+            _this.readonly = false;
+            _this.loaiVanBan = exports.EnumLoaiVanBanBase.VB_DI;
             for (var key in init) {
                 _this[key] = init[key];
             }
@@ -4565,6 +4576,15 @@
         });
         return EventData;
     }());
+    var TabViewData = /** @class */ (function () {
+        function TabViewData(init) {
+            this.hidden = false;
+            for (var key in init) {
+                this[key] = init[key];
+            }
+        }
+        return TabViewData;
+    }());
     (function (DataType) {
         DataType["date"] = "date";
         DataType["datetime"] = "datetime";
@@ -7139,10 +7159,12 @@
                 });
             });
         };
-        BaseService.prototype.newFilter = function (field, operator, value) {
+        BaseService.prototype.newFilter = function (field, operator, value, valueIsField) {
+            if (valueIsField === void 0) { valueIsField = false; }
             return new Filter({
                 field: field, operator: operator,
-                value: JSON.stringify(value)
+                value: JSON.stringify(value),
+                valueIsField: valueIsField
             });
         };
         BaseService.prototype.newFilterV4 = function (field, operator, value) {
@@ -8693,10 +8715,12 @@
                 filters: __spread(filters)
             });
         };
-        ComponentBase.prototype.newFilter = function (field, operator, value) {
+        ComponentBase.prototype.newFilter = function (field, operator, value, valueIsField) {
+            if (valueIsField === void 0) { valueIsField = false; }
             return new Filter({
                 field: field, operator: operator,
-                value: JSON.stringify(value)
+                value: JSON.stringify(value),
+                valueIsField: valueIsField
             });
         };
         ComponentBase.prototype.newFilterV4 = function (field, operator, value) {
@@ -11454,6 +11478,7 @@
         __extends(WorkflowHistoryService, _super);
         function WorkflowHistoryService(http, injector, _moduleConfigService) {
             var _this = _super.call(this, http, injector, _moduleConfigService.getConfig().environment.apiDomain.workflowEndpoint + "/" + _moduleConfigService.getConfig().environment.apiVersion + "/WorkflowHistory") || this;
+            _this.serviceManagers = {};
             _this.entityName = 'WorkflowHistory';
             _this.serviceCode = 'workflow';
             _this.apiDomain = _moduleConfigService.getConfig().environment.apiDomain;
@@ -11462,6 +11487,16 @@
             _this.apiVersion = _moduleConfigService.getConfig().environment.apiVersion;
             return _this;
         }
+        WorkflowHistoryService.prototype.registerService = function (settingKey, service) {
+            this.serviceManagers[settingKey] = service;
+        };
+        WorkflowHistoryService.prototype.getEndpointByService = function (service) {
+            return service.endPoint + "/" + this._moduleConfig.environment.apiVersion;
+        };
+        WorkflowHistoryService.prototype.changeEndpoint = function (baseService) {
+            this.serviceUri = this.getEndpointByService(baseService) + "/WorkflowHistory";
+            return this;
+        };
         WorkflowHistoryService.prototype.getLastByItemId = function (itemId) {
             // return this.getDetailByFilter(
             //     [
@@ -15469,13 +15504,6 @@
                 });
             });
         };
-        CrudFormComponent.prototype.handleDataSourceLoadComplete = function (control, parentPath, dataSource) {
-            return __awaiter(this, void 0, void 0, function () {
-                return __generator(this, function (_d) {
-                    return [2 /*return*/];
-                });
-            });
-        };
         CrudFormComponent.prototype.handleDataSourceLoaded = function (control, parentPath, dataFromDropdown) {
             return __awaiter(this, void 0, void 0, function () {
                 var parentNode, currentNode, eventData, _a_3;
@@ -16390,7 +16418,7 @@
     CrudFormComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'crud-form',
-                    template: "<div [class]=\"_styleClass\">\r\n    <form #formElement autocomplete=\"off\" autocorrect=\"off\" spellcheck=\"false\"\r\n        [class]=\"'p-grid form-group crud-form' + (formClass ? ' ' + formClass : '')\"\r\n        (keydown.shift.tab)=\"preventBlur($event)\">\r\n        <div class=\"p-grid p-col-12\" style=\"margin: 0\">\r\n            <ng-container *ngFor=\"let control of setting.schema\">\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"customControl; context: {control: control, data: _modelData, parentPath: '', path: control.field, showLabel: control.showLabel, mdWidth: control.mdWidth}\">\r\n                </ng-container>\r\n            </ng-container>\r\n        </div>\r\n    </form>\r\n</div>\r\n<p-contextMenu #contextMenu [appendTo]=\"'body'\" [model]=\"buttonContexts\">\r\n</p-contextMenu>\r\n<ng-template #customControl let-data=\"data\" let-control=\"control\" let-showLabel=\"showLabel\" let-mdWidth=\"mdWidth\"\r\n    let-rowIndex=\"index\" let-path=\"path\" let-parentPath=\"parentPath\" let-tablePath=\"tablePath\">\r\n    <div *ngIf=\"!checkHidden(control, data, path)\" id=\"{{path}}-holder\"\r\n        class=\"p-col-{{control.gWidth}} p-md-{{mdWidth}} {{control.class}} crud-form-control type-{{control.dataType}}\"\r\n        [class.error]=\"data._errors[control.field].length > 0\"\r\n        [class.not-show-in-box-holder]=\"control.showInBox === false\"\r\n        [class.show-in-box-holder]=\"control.showInBox === true\" [ngStyle]=\"control.style\">\r\n        <div class=\"label\" *ngIf=\"showLabel\">\r\n            <label *ngIf=\"control.label\" [pTooltip]=\"control.fullLabel\" tooltipPosition=\"top\">{{control.label}}\r\n                <span *ngIf=\"control.required\" class=\"star-required\">*</span></label>\r\n            <span *ngIf=\"control.description\" class=\"control-description\">({{control.description}})</span>\r\n        </div>\r\n        <ng-container [ngSwitch]=\"control.controlType\">\r\n            <ng-container *ngSwitchCase=\"'label'\">\r\n                <ng-container [ngTemplateOutlet]=\"labelControl\"\r\n                    [ngTemplateOutletContext]=\"{control: control, data: data}\">\r\n                </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'title'\">\r\n                <label *ngIf=\"!control.ishtml\" [for]=\"control.for\">{{control.text | translate}}</label>\r\n                <label *ngIf=\"control.ishtml\" [innerHTML]=\"control.text | translate\"></label>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'text'\">\r\n                <div class=\"p-inputgroup\" *ngIf=\"control.suffFix\">\r\n                    <input (focus)=\"onFocusTextControl($event)\" [placeholder]=\"control.placeholder\"\r\n                        [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText\r\n                        [type]=\"control.dataFormat\" [(ngModel)]=\"data[control.field]\" [max]=\"control.max\"\r\n                        [min]=\"control.min\" [maxlength]=\"control.maxLength\"\r\n                        (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                        (key.enter)=\"handleFieldValueChange(control, $event, 'enter', data, parentPath)\" />\r\n                    <span class=\"p-inputgroup-addon\">({{control.suffFix}})</span>\r\n                </div>\r\n                <input *ngIf=\"!control.suffFix\" (focus)=\"onFocusTextControl($event)\" [placeholder]=\"control.placeholder\"\r\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText [type]=\"control.dataFormat\"\r\n                    [(ngModel)]=\"data[control.field]\" [max]=\"control.max\" [min]=\"control.min\"\r\n                    [maxlength]=\"control.maxLength\"\r\n                    (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (key.enter)=\"handleFieldValueChange(control, $event, 'enter', data, parentPath)\" />\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'template'\">\r\n                <ng-container [ngTemplateOutlet]=\"control.template\"\r\n                    [ngTemplateOutletContext]=\"{$implicit: _rootNode, control: control, data: data, tablePath: tablePath, parentPath: parentPath, rowIndex: rowIndex, funcUpdateModel: updateModelFromExternal}\">\r\n                </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'mask'\">\r\n                <tn-mask [prefix]=\"control.prefix\" [decimalPlaces]=\"control.decimalPlaces\" [suffix]=\"control.suffix\"\r\n                    [placeholder]=\"control.placeholder\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [maskType]=\"control.maskType\" [min]=\"control.min\" [max]=\"control.max\"\r\n                    [(ngModel)]=\"data[control.field]\" (onFocus)=\"onFocusTextControl($event)\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </tn-mask>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'numberrange'\">\r\n                <tn-number-picker-range [decimalPlaces]=\"control.decimalPlaces\"\r\n                    [disabled]=\"checkDisabled(data, control)\" [maskType]=\"control.maskType\"\r\n                    [(ngModel)]=\"data[control.field]\" [min]=\"control.min\" [max]=\"control.max\"\r\n                    (search)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (blur)=\"handleFieldValueChange(control, $event, 'blur', data, parentPath)\">\r\n                </tn-number-picker-range>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'money'\">\r\n                <input currencyMask [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText type=\"tel\"\r\n                    [(ngModel)]=\"data[control.field]\"\r\n                    [options]=\"{prefix: '', thousands: '.', decimal: ',',precision:control.dataFormat === 'money'?0:0 }\"\r\n                    (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (focus)=\"onFocusTextControl($event)\" />\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'phoneOrfax'\">\r\n                <input [placeholder]=\"control.dataFormat==='phone'?'(999) 999-9999':'999-999-9999'\"\r\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" type=\"tel\" pInputText\r\n                    [(ngModel)]=\"data[control.field]\" (focus)=\"onFocusTextControl($event)\"\r\n                    (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\" />\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'textarea'\">\r\n                <textarea pInputTextarea (focus)=\"onFocusTextControl($event)\" [rows]=\"control.rows ? control.rows : 5\"\r\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" [(ngModel)]=\"data[control.field]\"\r\n                    (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"></textarea>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'editor'\">\r\n                <tn-tinymce *ngIf=\"!checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n                    [required]=\"control.validators && control.validators.required\" [mode]=\"control.mode\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    [height]=\"control.height ? control.height : 250\" [languageCode]=\"control.languageCode\"\r\n                    [disabled]=\"control.disabled || (control.disableCheck && control.disableCheck(model))\">\r\n                </tn-tinymce>\r\n                <div *ngIf=\"checkDisabled(data, control)\" class=\"html-box\"\r\n                    [innerHTML]=\"data[control.field] ? (data[control.field] | safeHtml) : ''\">\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'datetime'\">\r\n                <datetime-picker [(ngModel)]=\"data[control.field]\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [control]=\"control\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </datetime-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'autocomplete'\">\r\n                <app-autocomplete-datasource [control]=\"control\" [(ngModel)]=\"data[control.field]\"\r\n                    [suggestions]=\"data._source[control.field] || control.dataSource\"\r\n                    (onValueChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </app-autocomplete-datasource>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'datetimerange'\">\r\n                <tn-datetime-picker-range [(ngModel)]=\"data[control.field]\" [disabled]=\"control.disabled\"\r\n                    [control]=\"control\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </tn-datetime-picker-range>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'dropdown'\">\r\n                <dropdown [control]=\"control\" [dataSource]=\"getControlDataSource(control, data)\"\r\n                    [(value)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleChangeDropdown(control, $event, 'change', data, parentPath)\"\r\n                    (onHideSmartEvent)=\"handleChangeDropdown(control, $event, 'hide', data, parentPath)\"\r\n                    (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\r\n                    (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\"\r\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n                </dropdown>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'fileManager'\">\r\n                <file-manager [control]=\"control\" [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\r\n                    [entityKey]=\"data[control.entityKeyField]\" [readonly]=\"control.disabled\" [layout]=\"control.layout\"\r\n                    [maxFileSize]=\"control.maxFileSize\" [inTaiLieu]=\"control.inTaiLieu\"\r\n                    [inTaiLieuChung]=\"control.inTaiLieuChung\" [copyToFolderId]=\"control.copyToFolderId\"\r\n                    [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\r\n                    [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\r\n                    [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\r\n                    [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\r\n                    [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\r\n                    [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\"\r\n                    [(value)]=\"data[control.field]\" (onSelected)=\"control.onSelected($event)\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n                </file-manager>\r\n            </ng-container>\r\n            <span *ngSwitchCase=\"'fileUpload'\">\r\n                <file-upload [(ngModel)]=\"data[control.field]\" [sharedFolderType]=\"control.sharedFolderType\"\r\n                    [maxFileSize]=\"control.maxFileSize\"\r\n                    [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\r\n                    [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\r\n                    [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\r\n                    [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\r\n                    [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\r\n                    [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    [readonly]=\"control.readonly\" [accept]=\"control.accept\">\r\n                </file-upload>\r\n            </span>\r\n            <span *ngSwitchCase=\"'serviceFileUpload'\">\r\n                <service-file-upload [(ngModel)]=\"data[control.field]\" [parentContext]=\"context\"\r\n                    [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\r\n                    [entityKey]=\"data[control.entityKeyField]\" [control]=\"control\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </service-file-upload>\r\n            </span>\r\n            <ng-container *ngSwitchCase=\"'user-picker'\">\r\n                <user-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [(ngModel)]=\"data[control.field]\" [multiple]=\"control.multiple\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n                </user-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'switch'\">\r\n                <p-inputSwitch [(ngModel)]=\"data[control.field]\" [disabled]=\"checkDisabled(data, control)\"\r\n                    (onChange)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </p-inputSwitch>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'checkbox'\">\r\n                <div [class]=\"control.class\" role=\"checkbox-alone\">\r\n                    <p-checkbox [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n                        [label]=\"!control.hiddenLabel ? control.label : null\"\r\n                        (onChange)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\" binary=\"true\">\r\n                    </p-checkbox>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'button'\">\r\n                <button type=\"button\" pButton [class]=\"control.btClass\" [icon]=\"control.icon\"\r\n                    [label]=\"control.label | translate\" [ngStyle]=\"control.btStyle\"\r\n                    (click)=\"handleButtonClick(control, $event, parentPath)\"></button>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'container'\">\r\n                <div class=\"p-grid p-col-12\" style=\"margin: 0\" [class.not-show-in-box]=\"!control.showInBox\"\r\n                    [class.show-in-box]=\"control.showInBox\" [ngStyle]=\"control.boxStyle\">\r\n                    <ng-container *ngFor=\"let subControl of control.controls\">\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"customControl; context: {control: subControl, data: data[control.field], parentPath: path, rowIndex: rowIndex, path: path + '.' + subControl.field, showLabel: subControl.showLabel, mdWidth: subControl.mdWidth}\">\r\n                        </ng-container>\r\n                    </ng-container>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'checkboxlist'\">\r\n                <check-box-list [control]=\"control\" [dataSource]=\"data._source[control.field] || control.dataSource\"\r\n                    [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n                    (onSelect)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n                </check-box-list>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'radiobuttonlist'\">\r\n                <radio-button-list [control]=\"control\" [dataSource]=\"control.dataSource\"\r\n                    [disabled]=\"checkDisabled(data, control)\" [(value)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\r\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\"\r\n                    (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\">\r\n                </radio-button-list>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'colorPicker'\">\r\n                <tn-color-picker [(ngModel)]=\"data[control.field]\" [disabled]=\"checkDisabled(data, control)\"\r\n                    (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </tn-color-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'spanControl'\">\r\n                <span *ngIf=\"!control.ishtml\">{{data[control.field]}}</span>\r\n                <span *ngIf=\"control.ishtml\" [innerHTML]=\"data[control.field]\"></span>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'colorControl'\">\r\n                <span class=\"show-color-control\" [ngStyle]=\"{ backgroundColor: data[control.sourceField]}\"></span>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'address'\">\r\n                <address-picker [control]=\"control\" [showSubLabel]=\"control.showSubLabel\"\r\n                    [disabled]=\"checkDisabled(data, control)\" [(data)]=\"data[control.field]\"\r\n                    (onSelect)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n                </address-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'autocomplete-picker'\">\r\n                <autocomplete-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n                </autocomplete-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'entity-picker'\">\r\n                <entity-picker [control]=\"control\" [children]=\"children\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </entity-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'cocautochuc'\">\r\n                <cocautochuc-picker [control]=\"control\" [parentOrgId]=\"control.parentOrgId\"\r\n                    [disabled]=\"checkDisabled(data, control)\" [parentOrgCode]=\"control.parentOrgCode\"\r\n                    [filter]=\"control.filter\" [multiple]=\"control.multiple\" [required]=\"control.required\"\r\n                    [isUsingId]=\"control.isUsingId\" [disabledParentItem]=\"control.disabledParentItem\"\r\n                    [rootParentId]=\"control.rootParentId\" [(ngModel)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </cocautochuc-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'cocautochuc-picker'\">\r\n                <cocautochuc-picker-list [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n                </cocautochuc-picker-list>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'vanban'\">\r\n                <vanban-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </vanban-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'congviec'\">\r\n                <div>\r\n                    <congviec-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n                        [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n                        (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                    </congviec-picker>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'percent'\">\r\n                <div>\r\n                    <tn-mask [suffix]=\"'%'\" [placeholder]=\"control.placeholder\" [maskType]=\"'int'\" [min]=\"0\" [max]=\"100\"\r\n                        [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n                        (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                    </tn-mask>\r\n                    <p-slider [step]=\"1\" [min]=\"0\" [max]=\"100\" [disabled]=\"checkDisabled(data, control)\"\r\n                        [(ngModel)]=\"data[control.field]\"\r\n                        (onSlideEnd)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                    </p-slider>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'table'\">\r\n                <div [class]=\"control.class\">\r\n                    <tn-custom-scrollbar class=\"--has-border\" [showScrollHorizontal]=\"true\">\r\n                        <p-table [value]=\"data[control.field]\" [columns]=\"control.headerTemplate\" [responsive]=\"true\"\r\n                            class=\"new-table scr-table table-control\" [rowTrackBy]=\"trackByFuncId\"\r\n                            (onRowReorder)=\"handleRowOrdered(control, $event, 'rowReorder', data, parentPath)\">\r\n                            <ng-template *ngIf=\"getComponentByType(_prefixCustomHeader + control.field)\"\r\n                                pTemplate=\"header\" let-columns>\r\n                                <ng-container\r\n                                    *ngTemplateOutlet=\"getComponentByType(_prefixCustomHeader + control.field), context: {$implicit: control.headerTemplate, crudForm: this, containerSticky: containerSticky}\">\r\n                                </ng-container>\r\n                            </ng-template>\r\n                            <ng-template *ngIf=\"!getComponentByType(_prefixCustomHeader + control.field)\"\r\n                                pTemplate=\"header\" let-rowData let-columns>\r\n                                <tr>\r\n                                    <th *ngIf=\"control.showNumber\" style=\"text-align: center; width: 2.5rem\">\r\n                                        {{ 'TT' |translate}}\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </th>\r\n                                    <ng-container *ngFor=\"let subControl of control.rowTemplate\">\r\n                                        <th *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\r\n                                            [pTooltip]=\"subControl.fullLabel || subControl.label\" tooltipPosition=\"top\"\r\n                                            [style.width]=\"subControl.width\" style=\"text-align: center;\">\r\n                                            {{subControl.label}}\r\n                                            <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                        </th>\r\n                                    </ng-container>\r\n                                    <th *ngIf=\"control.enableReorderRow\" style=\"width: 30px\">\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </th>\r\n                                    <th *ngIf=\"control.showFunction\"\r\n                                        [style.width]=\"getTableFunctionColumnWidth(control)\"\r\n                                        class=\"table-function column-function\">\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </th>\r\n                                </tr>\r\n                            </ng-template>\r\n                            <ng-template pTemplate=\"body\" let-rowData let-ri=\"rowIndex\">\r\n                                <tr [pReorderableRow]=\"ri\">\r\n                                    <td style=\"text-align: center; padding-left: 0; padding-right: 0;\"\r\n                                        *ngIf=\"control.showNumber\" class=\"stt\">\r\n                                        <span style=\"padding: 12px 5px; display: inline-block;\">{{ri+1}}</span>\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </td>\r\n                                    <ng-container *ngFor=\"let subControl of control.rowTemplate; let i = index\">\r\n                                        <td *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\r\n                                            [class.control-inside]=\"true\" [class]=\"subControl.class\">\r\n                                            <span class=\"p-column-title\">{{subControl.label}}</span>\r\n                                            <ng-container\r\n                                                *ngTemplateOutlet=\"customControl; context: getContextTd(subControl, rowData, ri, path)\">\r\n                                            </ng-container>\r\n                                            <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                        </td>\r\n                                    </ng-container>\r\n                                    <td *ngIf=\"control.enableReorderRow\" class=\"no-padding center v-center\">\r\n                                        <i class=\"fas fa-arrows-alt\" style=\"cursor:pointer; padding: 8px; color: #555;\"\r\n                                            pReorderableRowHandle></i>\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </td>\r\n                                    <td style=\"text-align:center\" *ngIf=\"control.showFunction\" class=\"column-function\">\r\n                                        <div class=\"p-toolbar-group-center button-group\">\r\n                                            <button *ngIf=\"control.showSave\" [disabled]=\"rowData._disableSave\"\r\n                                                type=\"button\" pButton class=\"p-button-text\" icon=\"pi pi-save\"\r\n                                                [pTooltip]=\"'L\u01B0u' | translate\" tooltipPosition=\"top\"\r\n                                                style=\"width: 2.143em;\" (click)=\"saveRow(ri, control, path)\"></button>\r\n                                            <button *ngIf=\"control.showEdit\" [disabled]=\"rowData._disableEdit\"\r\n                                                type=\"button\" pButton class=\"p-button-text\" icon=\"pi pi-pencil\"\r\n                                                [pTooltip]=\"'S\u1EEDa' | translate\" tooltipPosition=\"top\"\r\n                                                style=\"width: 2.143em;\" (click)=\"editRow(ri, control, path)\"></button>\r\n                                            <button *ngIf=\"control.showDelete\" [disabled]=\"rowData._disableDelete\"\r\n                                                type=\"button\" pButton class=\"p-button-text p-button-danger\"\r\n                                                icon=\"pi pi-trash\" [pTooltip]=\"'X\u00F3a' | translate\" tooltipPosition=\"top\"\r\n                                                style=\"width: 2.143em;\" (click)=\"deleteRow(ri, control, path)\"></button>\r\n                                            <button *ngIf=\"control.rowButtons\" type=\"button\" pButton\r\n                                                icon=\"pi pi-ellipsis-v\"\r\n                                                class=\"link-or-action p-button-text p-button-rounded\"\r\n                                                pTooltip=\"Ch\u1EE9c n\u0103ng kh\u00E1c\" tooltipPosition=\"top\"\r\n                                                (click)=\"showContextMenu($event, rowData, control)\"></button>\r\n                                            <!-- <button *ngFor=\"let bt of control.rowButtons\" type=\"button\" pButton\r\n                                                [class]=\"bt.class\" [icon]=\"bt.icon\" [pTooltip]=\"bt.label | translate\"\r\n                                                tooltipPosition=\"top\" style=\"width: 2.143em;\"\r\n                                                (click)=\"messageRow(ri, control, path)\"></button> -->\r\n                                        </div>\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </td>\r\n                                </tr>\r\n                            </ng-template>\r\n                        </p-table>\r\n                    </tn-custom-scrollbar>\r\n                    <div *ngIf=\"control.showFooter\" class=\"--table-schema-footer\">\r\n                        <button *ngIf=\"control.showAdd\" type=\"button\" pButton style=\"width:auto\" label=\"Th\u00EAm m\u1EDBi\"\r\n                            icon=\"pi pi-plus\" class=\"p-button-text\" (click)=\"addNewRow(control, path)\"></button>\r\n                        <span style=\"font-weight: normal;\">\r\n                            <p-checkbox label=\"M\u1EDF dialog\" [binary]=\"true\" [(ngModel)]=\"control.showEdit\">\r\n                            </p-checkbox>\r\n                        </span>\r\n                        <button *ngIf=\"control.enableAddMulti\" type=\"button\" pButton\r\n                            style=\"width:auto; margin-left:10px;\" label=\"Th\u00EAm nhi\u1EC1u\" icon=\"pi pi-clone\"\r\n                            class=\"p-button-text\" (click)=\"addMultiRow(control, 5, path)\"></button>\r\n                        <button *ngFor=\"let bt of control.footerButtons\" type=\"button\" pButton [class]=\"bt.class\"\r\n                            [icon]=\"bt.icon\" [label]=\"bt.label | translate\" style=\"width:auto; margin-left:10px;\"\r\n                            (click)=\"messageRow( -1, control, path)\"></button>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchDefault>\r\n                <ng-container [ngTemplateOutlet]=\"getComponentByType(control.field)\" [ngTemplateOutletContext]=\"{\r\n                        crudForm: this, data: data, index: rowIndex, parentPath: parentPath, control: control, changeFunc: handleFieldValueChange\r\n                    }\">\r\n                </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"validation; context: {control: control, data: data}\">\r\n            </ng-container>\r\n        </ng-container>\r\n    </div>\r\n</ng-template>\r\n<ng-template #validation let-control=\"control\" let-data=\"data\">\r\n    <ng-container *ngIf=\"data._errors[control.field].length > 0\">\r\n        <div class=\"error-container\">\r\n            <ng-container *ngFor=\"let error of data._errors[control.field]\">\r\n                <div class=\"error-item\" *ngIf=\"error\">\r\n                    <ng-container [ngTemplateOutlet]=\"errorMessage\" [ngTemplateOutletContext]=\"{content: error}\">\r\n                    </ng-container>\r\n                </div>\r\n            </ng-container>\r\n        </div>\r\n    </ng-container>\r\n</ng-template>\r\n<ng-template #errorMessage let-content=\"content\">\r\n    <div class=\"error-content\">\r\n        <i class=\"pi pi-ban\"></i>\r\n        <span> {{content}}</span>\r\n    </div>\r\n</ng-template>\r\n<ng-template #labelControl let-control=\"control\">\r\n    <ng-container>\r\n        <label [class]=\"getLabelClass(control)\" *ngIf=\"!control.ishtml\" [attr.label-index]=\"control.indexLabel\"\r\n            [pTooltip]=\"control.title\" tooltipPosition=\"top\" tooltipStyleClass=\"wrap\" [escape]=\"false\"\r\n            [for]=\"control.for\">{{control.text | translate}}</label>\r\n        <label [class]=\"getLabelClass(control)\" *ngIf=\"control.ishtml\" [innerHTML]=\"control.text | safeHtml\"\r\n            [attr.label-index]=\"control.indexLabel\"></label>\r\n    </ng-container>\r\n</ng-template>\r\n<ng-template #containerSticky>\r\n    <span class=\"fix-sticky top\"></span>\r\n    <span class=\"fix-sticky right\"></span>\r\n    <span class=\"fix-sticky left\"></span>\r\n</ng-template>\r\n<ng-template #templateCongViecForm let-control=\"control\">\r\n    <base-congviec-form [control]=\"control\" [parentSetting]=\"congViecSetting\" [tenCongViec]=\"control.data.tenCongViec\">\r\n    </base-congviec-form>\r\n</ng-template>\r\n<tn-dialog *ngIf=\"tableFormShow\" #dialog [styleClass]=\"'address-form'\" [header]=\"tableFormTitle | translate\"\r\n    [popupSize]=\"tableFormPopupSize\" (onHide)=\"tableFormShow = false\">\r\n    <table-detail-form #formBase [parentSetting]=\"setting\" [schema]=\"tableFormSchema\" [data]=\"tableFormData\"\r\n        (onSaved)=\"handleSavedTableRow($event)\" (onCancel)=\"tableFormShow = false\">\r\n    </table-detail-form>\r\n</tn-dialog>",
+                    template: "<div [class]=\"_styleClass\">\r\n    <form #formElement autocomplete=\"off\" autocorrect=\"off\" spellcheck=\"false\"\r\n        [class]=\"'p-grid form-group crud-form' + (formClass ? ' ' + formClass : '')\"\r\n        (keydown.shift.tab)=\"preventBlur($event)\">\r\n        <div class=\"p-grid p-col-12\" style=\"margin: 0\">\r\n            <ng-container *ngFor=\"let control of setting.schema\">\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"customControl; context: {control: control, data: _modelData, parentPath: '', path: control.field, showLabel: control.showLabel, mdWidth: control.mdWidth}\">\r\n                </ng-container>\r\n            </ng-container>\r\n        </div>\r\n    </form>\r\n</div>\r\n<p-contextMenu #contextMenu [appendTo]=\"'body'\" [model]=\"buttonContexts\">\r\n</p-contextMenu>\r\n<ng-template #customControl let-data=\"data\" let-control=\"control\" let-showLabel=\"showLabel\" let-mdWidth=\"mdWidth\"\r\n    let-rowIndex=\"index\" let-path=\"path\" let-parentPath=\"parentPath\" let-tablePath=\"tablePath\">\r\n    <div *ngIf=\"!checkHidden(control, data, path)\" id=\"{{path}}-holder\"\r\n        class=\"p-col-{{control.gWidth}} p-md-{{mdWidth}} {{control.class}} crud-form-control type-{{control.dataType}}\"\r\n        [class.error]=\"data._errors[control.field].length > 0\"\r\n        [class.not-show-in-box-holder]=\"control.showInBox === false\"\r\n        [class.show-in-box-holder]=\"control.showInBox === true\" [ngStyle]=\"control.style\">\r\n        <div class=\"label\" *ngIf=\"showLabel\">\r\n            <label *ngIf=\"control.label\" [pTooltip]=\"control.fullLabel\" tooltipPosition=\"top\">{{control.label}}\r\n                <span *ngIf=\"control.required\" class=\"star-required\">*</span></label>\r\n            <span *ngIf=\"control.description\" class=\"control-description\">({{control.description}})</span>\r\n        </div>\r\n        <ng-container [ngSwitch]=\"control.controlType\">\r\n            <ng-container *ngSwitchCase=\"'label'\">\r\n                <ng-container [ngTemplateOutlet]=\"labelControl\"\r\n                    [ngTemplateOutletContext]=\"{control: control, data: data}\">\r\n                </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'title'\">\r\n                <label *ngIf=\"!control.ishtml\" [for]=\"control.for\">{{control.text | translate}}</label>\r\n                <label *ngIf=\"control.ishtml\" [innerHTML]=\"control.text | translate\"></label>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'text'\">\r\n                <div class=\"p-inputgroup\" *ngIf=\"control.suffFix\">\r\n                    <input (focus)=\"onFocusTextControl($event)\" [placeholder]=\"control.placeholder\"\r\n                        [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText\r\n                        [type]=\"control.dataFormat\" [(ngModel)]=\"data[control.field]\" [max]=\"control.max\"\r\n                        [min]=\"control.min\" [maxlength]=\"control.maxLength\"\r\n                        (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                        (key.enter)=\"handleFieldValueChange(control, $event, 'enter', data, parentPath)\" />\r\n                    <span class=\"p-inputgroup-addon\">({{control.suffFix}})</span>\r\n                </div>\r\n                <input *ngIf=\"!control.suffFix\" (focus)=\"onFocusTextControl($event)\" [placeholder]=\"control.placeholder\"\r\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText [type]=\"control.dataFormat\"\r\n                    [(ngModel)]=\"data[control.field]\" [max]=\"control.max\" [min]=\"control.min\"\r\n                    [maxlength]=\"control.maxLength\"\r\n                    (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (key.enter)=\"handleFieldValueChange(control, $event, 'enter', data, parentPath)\" />\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'template'\">\r\n                <ng-container [ngTemplateOutlet]=\"control.template\"\r\n                    [ngTemplateOutletContext]=\"{$implicit: _rootNode, control: control, data: data, tablePath: tablePath, parentPath: parentPath, rowIndex: rowIndex, funcUpdateModel: updateModelFromExternal}\">\r\n                </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'mask'\">\r\n                <tn-mask [prefix]=\"control.prefix\" [decimalPlaces]=\"control.decimalPlaces\" [suffix]=\"control.suffix\"\r\n                    [placeholder]=\"control.placeholder\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [maskType]=\"control.maskType\" [min]=\"control.min\" [max]=\"control.max\"\r\n                    [(ngModel)]=\"data[control.field]\" (onFocus)=\"onFocusTextControl($event)\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </tn-mask>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'numberrange'\">\r\n                <tn-number-picker-range [decimalPlaces]=\"control.decimalPlaces\"\r\n                    [disabled]=\"checkDisabled(data, control)\" [maskType]=\"control.maskType\"\r\n                    [(ngModel)]=\"data[control.field]\" [min]=\"control.min\" [max]=\"control.max\"\r\n                    (search)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (blur)=\"handleFieldValueChange(control, $event, 'blur', data, parentPath)\">\r\n                </tn-number-picker-range>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'money'\">\r\n                <input currencyMask [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText type=\"tel\"\r\n                    [(ngModel)]=\"data[control.field]\"\r\n                    [options]=\"{prefix: '', thousands: '.', decimal: ',',precision:control.dataFormat === 'money'?0:0 }\"\r\n                    (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (focus)=\"onFocusTextControl($event)\" />\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'phoneOrfax'\">\r\n                <input [placeholder]=\"control.dataFormat==='phone'?'(999) 999-9999':'999-999-9999'\"\r\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" type=\"tel\" pInputText\r\n                    [(ngModel)]=\"data[control.field]\" (focus)=\"onFocusTextControl($event)\"\r\n                    (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\" />\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'textarea'\">\r\n                <textarea pInputTextarea (focus)=\"onFocusTextControl($event)\" [rows]=\"control.rows ? control.rows : 5\"\r\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" [(ngModel)]=\"data[control.field]\"\r\n                    (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"></textarea>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'editor'\">\r\n                <tn-tinymce *ngIf=\"!checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n                    [required]=\"control.validators && control.validators.required\" [mode]=\"control.mode\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    [height]=\"control.height ? control.height : 250\" [languageCode]=\"control.languageCode\"\r\n                    [disabled]=\"control.disabled || (control.disableCheck && control.disableCheck(model))\">\r\n                </tn-tinymce>\r\n                <div *ngIf=\"checkDisabled(data, control)\" class=\"html-box\"\r\n                    [innerHTML]=\"data[control.field] ? (data[control.field] | safeHtml) : ''\">\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'datetime'\">\r\n                <datetime-picker [(ngModel)]=\"data[control.field]\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [control]=\"control\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </datetime-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'autocomplete'\">\r\n                <app-autocomplete-datasource [control]=\"control\" [(ngModel)]=\"data[control.field]\"\r\n                    [suggestions]=\"data._source[control.field] || control.dataSource\"\r\n                    (onValueChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </app-autocomplete-datasource>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'datetimerange'\">\r\n                <tn-datetime-picker-range [(ngModel)]=\"data[control.field]\" [disabled]=\"control.disabled\"\r\n                    [control]=\"control\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </tn-datetime-picker-range>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'dropdown'\">\r\n                <dropdown [control]=\"control\" [dataSource]=\"getControlDataSource(control, data)\"\r\n                    [(value)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleChangeDropdown(control, $event, 'change', data, parentPath)\"\r\n                    (onHideSmartEvent)=\"handleChangeDropdown(control, $event, 'hide', data, parentPath)\"\r\n                    (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\r\n                    (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\"\r\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n                </dropdown>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'fileManager'\">\r\n                <file-manager [control]=\"control\" [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\r\n                    [entityKey]=\"control.entityKey ? control.entityKey : data[control.entityKeyField]\"\r\n                    [readonly]=\"control.disabled\" [layout]=\"control.layout\" [maxFileSize]=\"control.maxFileSize\"\r\n                    [inTaiLieu]=\"control.inTaiLieu\" [inTaiLieuChung]=\"control.inTaiLieuChung\"\r\n                    [copyToFolderId]=\"control.copyToFolderId\"\r\n                    [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\r\n                    [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\r\n                    [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\r\n                    [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\r\n                    [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\r\n                    [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\"\r\n                    [(value)]=\"data[control.field]\" (onSelected)=\"control.onSelected($event)\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n                </file-manager>\r\n            </ng-container>\r\n            <span *ngSwitchCase=\"'fileUpload'\">\r\n                <file-upload [(ngModel)]=\"data[control.field]\" [sharedFolderType]=\"control.sharedFolderType\"\r\n                    [maxFileSize]=\"control.maxFileSize\"\r\n                    [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\r\n                    [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\r\n                    [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\r\n                    [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\r\n                    [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\r\n                    [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    [readonly]=\"control.readonly\" [accept]=\"control.accept\">\r\n                </file-upload>\r\n            </span>\r\n            <span *ngSwitchCase=\"'serviceFileUpload'\">\r\n                <service-file-upload [(ngModel)]=\"data[control.field]\" [parentContext]=\"context\"\r\n                    [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\r\n                    [entityKey]=\"data[control.entityKeyField]\" [control]=\"control\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </service-file-upload>\r\n            </span>\r\n            <ng-container *ngSwitchCase=\"'user-picker'\">\r\n                <user-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [(ngModel)]=\"data[control.field]\" [multiple]=\"control.multiple\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n                </user-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'switch'\">\r\n                <p-inputSwitch [(ngModel)]=\"data[control.field]\" [disabled]=\"checkDisabled(data, control)\"\r\n                    (onChange)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </p-inputSwitch>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'checkbox'\">\r\n                <div [class]=\"control.class\" role=\"checkbox-alone\">\r\n                    <p-checkbox [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n                        [label]=\"!control.hiddenLabel ? control.label : null\"\r\n                        (onChange)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\" binary=\"true\">\r\n                    </p-checkbox>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'button'\">\r\n                <button type=\"button\" pButton [class]=\"control.btClass\" [icon]=\"control.icon\"\r\n                    [label]=\"control.label | translate\" [ngStyle]=\"control.btStyle\"\r\n                    (click)=\"handleButtonClick(control, $event, parentPath)\"></button>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'container'\">\r\n                <div class=\"p-grid p-col-12\" style=\"margin: 0\" [class.not-show-in-box]=\"!control.showInBox\"\r\n                    [class.show-in-box]=\"control.showInBox\" [ngStyle]=\"control.boxStyle\">\r\n                    <ng-container *ngFor=\"let subControl of control.controls\">\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"customControl; context: {control: subControl, data: data[control.field], parentPath: path, rowIndex: rowIndex, path: path + '.' + subControl.field, showLabel: subControl.showLabel, mdWidth: subControl.mdWidth}\">\r\n                        </ng-container>\r\n                    </ng-container>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'checkboxlist'\">\r\n                <check-box-list [control]=\"control\" [dataSource]=\"data._source[control.field] || control.dataSource\"\r\n                    [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n                    (onSelect)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n                </check-box-list>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'radiobuttonlist'\">\r\n                <radio-button-list [control]=\"control\" [dataSource]=\"control.dataSource\"\r\n                    [disabled]=\"checkDisabled(data, control)\" [(value)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\r\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\"\r\n                    (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\">\r\n                </radio-button-list>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'colorPicker'\">\r\n                <tn-color-picker [(ngModel)]=\"data[control.field]\" [disabled]=\"checkDisabled(data, control)\"\r\n                    (change)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </tn-color-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'spanControl'\">\r\n                <span *ngIf=\"!control.ishtml\">{{data[control.field]}}</span>\r\n                <span *ngIf=\"control.ishtml\" [innerHTML]=\"data[control.field]\"></span>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'colorControl'\">\r\n                <span class=\"show-color-control\" [ngStyle]=\"{ backgroundColor: data[control.sourceField]}\"></span>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'address'\">\r\n                <address-picker [control]=\"control\" [showSubLabel]=\"control.showSubLabel\"\r\n                    [disabled]=\"checkDisabled(data, control)\" [(data)]=\"data[control.field]\"\r\n                    (onSelect)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n                </address-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'autocomplete-picker'\">\r\n                <autocomplete-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n                </autocomplete-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'entity-picker'\">\r\n                <entity-picker [control]=\"control\" [children]=\"children\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </entity-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'cocautochuc'\">\r\n                <cocautochuc-picker [control]=\"control\" [parentOrgId]=\"control.parentOrgId\"\r\n                    [disabled]=\"checkDisabled(data, control)\" [parentOrgCode]=\"control.parentOrgCode\"\r\n                    [filter]=\"control.filter\" [multiple]=\"control.multiple\" [required]=\"control.required\"\r\n                    [isUsingId]=\"control.isUsingId\" [disabledParentItem]=\"control.disabledParentItem\"\r\n                    [rootParentId]=\"control.rootParentId\" [(ngModel)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </cocautochuc-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'cocautochuc-picker'\">\r\n                <cocautochuc-picker-list [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\"\r\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n                </cocautochuc-picker-list>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'vanban'\">\r\n                <vanban-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n                    [required]=\"control.required\" [(ngModel)]=\"data[control.field]\" [readOnly]=\"control.readOnly\"\r\n                    [loaiVanBan]=\"control.loaiVanBan\"\r\n                    (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                </vanban-picker>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'congviec'\">\r\n                <div>\r\n                    <congviec-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n                        [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n                        (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                    </congviec-picker>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'percent'\">\r\n                <div>\r\n                    <tn-mask [suffix]=\"'%'\" [placeholder]=\"control.placeholder\" [maskType]=\"'int'\" [min]=\"0\" [max]=\"100\"\r\n                        [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n                        (onChanged)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                    </tn-mask>\r\n                    <p-slider [step]=\"1\" [min]=\"0\" [max]=\"100\" [disabled]=\"checkDisabled(data, control)\"\r\n                        [(ngModel)]=\"data[control.field]\"\r\n                        (onSlideEnd)=\"handleFieldValueChange(control, $event, 'change', data, parentPath)\">\r\n                    </p-slider>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'table'\">\r\n                <div [class]=\"control.class\">\r\n                    <tn-custom-scrollbar class=\"--has-border\" [showScrollHorizontal]=\"true\">\r\n                        <p-table [value]=\"data[control.field]\" [columns]=\"control.headerTemplate\" [responsive]=\"true\"\r\n                            class=\"new-table scr-table table-control\" [rowTrackBy]=\"trackByFuncId\"\r\n                            (onRowReorder)=\"handleRowOrdered(control, $event, 'rowReorder', data, parentPath)\">\r\n                            <ng-template *ngIf=\"getComponentByType(_prefixCustomHeader + control.field)\"\r\n                                pTemplate=\"header\" let-columns>\r\n                                <ng-container\r\n                                    *ngTemplateOutlet=\"getComponentByType(_prefixCustomHeader + control.field), context: {$implicit: control.headerTemplate, crudForm: this, containerSticky: containerSticky}\">\r\n                                </ng-container>\r\n                            </ng-template>\r\n                            <ng-template *ngIf=\"!getComponentByType(_prefixCustomHeader + control.field)\"\r\n                                pTemplate=\"header\" let-rowData let-columns>\r\n                                <tr>\r\n                                    <th *ngIf=\"control.showNumber\" style=\"text-align: center; width: 2.5rem\">\r\n                                        {{ 'TT' |translate}}\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </th>\r\n                                    <ng-container *ngFor=\"let subControl of control.rowTemplate\">\r\n                                        <th *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\r\n                                            [pTooltip]=\"subControl.fullLabel || subControl.label\" tooltipPosition=\"top\"\r\n                                            [style.width]=\"subControl.width\" style=\"text-align: center;\">\r\n                                            {{subControl.label}}\r\n                                            <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                        </th>\r\n                                    </ng-container>\r\n                                    <th *ngIf=\"control.enableReorderRow\" style=\"width: 30px\">\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </th>\r\n                                    <th *ngIf=\"control.showFunction\"\r\n                                        [style.width]=\"getTableFunctionColumnWidth(control)\"\r\n                                        class=\"table-function column-function\">\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </th>\r\n                                </tr>\r\n                            </ng-template>\r\n                            <ng-template pTemplate=\"body\" let-rowData let-ri=\"rowIndex\">\r\n                                <tr [pReorderableRow]=\"ri\">\r\n                                    <td style=\"text-align: center; padding-left: 0; padding-right: 0;\"\r\n                                        *ngIf=\"control.showNumber\" class=\"stt\">\r\n                                        <span style=\"padding: 12px 5px; display: inline-block;\">{{ri+1}}</span>\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </td>\r\n                                    <ng-container *ngFor=\"let subControl of control.rowTemplate; let i = index\">\r\n                                        <td *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\r\n                                            [class.control-inside]=\"true\" [class]=\"subControl.class\">\r\n                                            <span class=\"p-column-title\">{{subControl.label}}</span>\r\n                                            <ng-container\r\n                                                *ngTemplateOutlet=\"customControl; context: getContextTd(subControl, rowData, ri, path)\">\r\n                                            </ng-container>\r\n                                            <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                        </td>\r\n                                    </ng-container>\r\n                                    <td *ngIf=\"control.enableReorderRow\" class=\"no-padding center v-center\">\r\n                                        <i class=\"fas fa-arrows-alt\" style=\"cursor:pointer; padding: 8px; color: #555;\"\r\n                                            pReorderableRowHandle></i>\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </td>\r\n                                    <td style=\"text-align:center\" *ngIf=\"control.showFunction\" class=\"column-function\">\r\n                                        <div class=\"p-toolbar-group-center button-group\">\r\n                                            <button *ngIf=\"control.showSave\" [disabled]=\"rowData._disableSave\"\r\n                                                type=\"button\" pButton class=\"p-button-text\" icon=\"pi pi-save\"\r\n                                                [pTooltip]=\"'L\u01B0u' | translate\" tooltipPosition=\"top\"\r\n                                                style=\"width: 2.143em;\" (click)=\"saveRow(ri, control, path)\"></button>\r\n                                            <button *ngIf=\"control.showEdit\" [disabled]=\"rowData._disableEdit\"\r\n                                                type=\"button\" pButton class=\"p-button-text\" icon=\"pi pi-pencil\"\r\n                                                [pTooltip]=\"'S\u1EEDa' | translate\" tooltipPosition=\"top\"\r\n                                                style=\"width: 2.143em;\" (click)=\"editRow(ri, control, path)\"></button>\r\n                                            <button *ngIf=\"control.showDelete\" [disabled]=\"rowData._disableDelete\"\r\n                                                type=\"button\" pButton class=\"p-button-text p-button-danger\"\r\n                                                icon=\"pi pi-trash\" [pTooltip]=\"'X\u00F3a' | translate\" tooltipPosition=\"top\"\r\n                                                style=\"width: 2.143em;\" (click)=\"deleteRow(ri, control, path)\"></button>\r\n                                            <button *ngIf=\"control.rowButtons\" type=\"button\" pButton\r\n                                                icon=\"pi pi-ellipsis-v\"\r\n                                                class=\"link-or-action p-button-text p-button-rounded\"\r\n                                                pTooltip=\"Ch\u1EE9c n\u0103ng kh\u00E1c\" tooltipPosition=\"top\"\r\n                                                (click)=\"showContextMenu($event, rowData, control)\"></button>\r\n                                            <!-- <button *ngFor=\"let bt of control.rowButtons\" type=\"button\" pButton\r\n                                                [class]=\"bt.class\" [icon]=\"bt.icon\" [pTooltip]=\"bt.label | translate\"\r\n                                                tooltipPosition=\"top\" style=\"width: 2.143em;\"\r\n                                                (click)=\"messageRow(ri, control, path)\"></button> -->\r\n                                        </div>\r\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n                                    </td>\r\n                                </tr>\r\n                            </ng-template>\r\n                        </p-table>\r\n                    </tn-custom-scrollbar>\r\n                    <div *ngIf=\"control.showFooter\" class=\"--table-schema-footer\">\r\n                        <button *ngIf=\"control.showAdd\" type=\"button\" pButton style=\"width:auto\" label=\"Th\u00EAm m\u1EDBi\"\r\n                            icon=\"pi pi-plus\" class=\"p-button-text\" (click)=\"addNewRow(control, path)\"></button>\r\n                        <span style=\"font-weight: normal;\">\r\n                            <p-checkbox label=\"M\u1EDF dialog\" [binary]=\"true\" [(ngModel)]=\"control.showEdit\">\r\n                            </p-checkbox>\r\n                        </span>\r\n                        <button *ngIf=\"control.enableAddMulti\" type=\"button\" pButton\r\n                            style=\"width:auto; margin-left:10px;\" label=\"Th\u00EAm nhi\u1EC1u\" icon=\"pi pi-clone\"\r\n                            class=\"p-button-text\" (click)=\"addMultiRow(control, 5, path)\"></button>\r\n                        <button *ngFor=\"let bt of control.footerButtons\" type=\"button\" pButton [class]=\"bt.class\"\r\n                            [icon]=\"bt.icon\" [label]=\"bt.label | translate\" style=\"width:auto; margin-left:10px;\"\r\n                            (click)=\"messageRow( -1, control, path)\"></button>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchDefault>\r\n                <ng-container [ngTemplateOutlet]=\"getComponentByType(control.field)\" [ngTemplateOutletContext]=\"{\r\n                        crudForm: this, data: data, index: rowIndex, parentPath: parentPath, control: control, changeFunc: handleFieldValueChange\r\n                    }\">\r\n                </ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"validation; context: {control: control, data: data}\">\r\n            </ng-container>\r\n        </ng-container>\r\n    </div>\r\n</ng-template>\r\n<ng-template #validation let-control=\"control\" let-data=\"data\">\r\n    <ng-container *ngIf=\"data._errors[control.field].length > 0\">\r\n        <div class=\"error-container\">\r\n            <ng-container *ngFor=\"let error of data._errors[control.field]\">\r\n                <div class=\"error-item\" *ngIf=\"error\">\r\n                    <ng-container [ngTemplateOutlet]=\"errorMessage\" [ngTemplateOutletContext]=\"{content: error}\">\r\n                    </ng-container>\r\n                </div>\r\n            </ng-container>\r\n        </div>\r\n    </ng-container>\r\n</ng-template>\r\n<ng-template #errorMessage let-content=\"content\">\r\n    <div class=\"error-content\">\r\n        <i class=\"pi pi-ban\"></i>\r\n        <span> {{content}}</span>\r\n    </div>\r\n</ng-template>\r\n<ng-template #labelControl let-control=\"control\">\r\n    <ng-container>\r\n        <label [class]=\"getLabelClass(control)\" *ngIf=\"!control.ishtml\" [attr.label-index]=\"control.indexLabel\"\r\n            [pTooltip]=\"control.title\" tooltipPosition=\"top\" tooltipStyleClass=\"wrap\" [escape]=\"false\"\r\n            [for]=\"control.for\">{{control.text | translate}}</label>\r\n        <label [class]=\"getLabelClass(control)\" *ngIf=\"control.ishtml\" [innerHTML]=\"control.text | safeHtml\"\r\n            [attr.label-index]=\"control.indexLabel\"></label>\r\n    </ng-container>\r\n</ng-template>\r\n<ng-template #containerSticky>\r\n    <span class=\"fix-sticky top\"></span>\r\n    <span class=\"fix-sticky right\"></span>\r\n    <span class=\"fix-sticky left\"></span>\r\n</ng-template>\r\n<ng-template #templateCongViecForm let-control=\"control\">\r\n    <base-congviec-form [control]=\"control\" [parentSetting]=\"congViecSetting\" [tenCongViec]=\"control.data.tenCongViec\">\r\n    </base-congviec-form>\r\n</ng-template>\r\n<tn-dialog *ngIf=\"tableFormShow\" #dialog [styleClass]=\"'address-form'\" [header]=\"tableFormTitle | translate\"\r\n    [popupSize]=\"tableFormPopupSize\" (onHide)=\"tableFormShow = false\">\r\n    <table-detail-form #formBase [parentSetting]=\"setting\" [schema]=\"tableFormSchema\" [data]=\"tableFormData\"\r\n        (onSaved)=\"handleSavedTableRow($event)\" (onCancel)=\"tableFormShow = false\">\r\n    </table-detail-form>\r\n</tn-dialog>",
                     providers: [ComponentContextService],
                     styles: [".label-only{font-weight:700;margin-bottom:1em}div.label{position:relative}div.label .star-required{color:red;padding-left:.2em;padding-top:.3em;position:absolute}div.type-container.not-show-in-box-holder{padding:0}.--table-schema-footer{align-items:center;background:#f8f9fa;border:1px solid #e9ecef;color:#495057;display:flex;font-weight:600;padding:.5em}.show-in-box{border:1px solid #ced4da;border-radius:5px}.not-show-in-box{padding:0}.view-mode div.label{padding-bottom:3px}.view-mode div.label label{font-size:.85em;font-weight:700}.view-mode>span:not(:empty){display:inline-block;padding:5px 0;width:100%}.view-mode.type-table div.label+div{padding:5px 0}td>.view-mode{display:inline-block;padding:.25rem .5rem}td>.view-mode .view-mode{padding:0}.crud-form-control div[role=checkbox-alone]{margin-top:24px}.crud-form-control div[role=checkbox-alone].mg-top-0{margin-top:0}.crud-form-control .label+div[role=checkbox-alone]{margin-top:11px}.crud-form-control.type-table div[role=checkbox-alone]{margin-top:6px;text-align:center}.crud-form-control.type-table div[role=checkbox-alone].mg-top-0{margin-top:0}.crud-form-control.type-table div[role=checkbox-alone].align-left{text-align:left}.crud-form-control.type-title{border-bottom:1px solid #cfcfcf;color:#025ba7;font-size:1.2rem;font-weight:700;padding:10px 0 10px 5px;text-transform:uppercase}.crud-form-control.type-title>.label{margin-bottom:0}.control-description{color:#6c757d;font-size:.8rem;margin-bottom:5px;margin-left:10px}::ng-deep .crud-form-control .tn-check-box-list{margin-top:5px}::ng-deep .crud-form-control>div.label{font-size:.9em;height:1.15em;margin-bottom:5px}::ng-deep .crud-form-control>div.label+*{width:100%}::ng-deep .crud-form-control>.error-container .error-item{-webkit-animation:shrink .1s;animation:shrink .1s;min-height:20px;overflow:visible;padding-top:5px}::ng-deep .crud-form-control>.error-container .error-item .error-content{-webkit-animation:fadeIn .1s;animation:fadeIn .1s;color:red;display:flex;font-size:.9em;position:relative}::ng-deep .crud-form-control>.error-container .error-item .error-content i{display:flex;font-size:.9em;padding-top:1px}::ng-deep .crud-form-control>.error-container .error-item .error-content span{display:flex;padding-left:5px}::ng-deep .crud-form-control.no-label>div.label{display:none}::ng-deep .crud-form-control.error .p-dropdown,::ng-deep .crud-form-control.error .p-inputtext,::ng-deep .crud-form-control.error .p-multiselect,::ng-deep .crud-form-control.error .tn-dropdown,::ng-deep .crud-form-control.error input,::ng-deep .crud-form-control.error select,::ng-deep .crud-form-control.error textarea{border-color:#ff5722!important}::ng-deep .crud-form-control.error .p-autocomplete-multiple-container:not(.p-disabled).p-focus,::ng-deep .crud-form-control.error .p-inputtext:enabled:focus,::ng-deep .crud-form-control.error .tn-dropdown:not(.p-disabled).p-focus{box-shadow:0 0 0 .2rem #ffc4b3}::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-dropdown,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-inputtext,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-multiselect,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .tn-dropdown,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) input,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) select,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) textarea{border-color:#ced4da!important}::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-autocomplete-multiple-container:not(.p-disabled).p-focus,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-dropdown.tn-dropdown.p-focus,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-inputtext:enabled:focus{box-shadow:0 0 0 .2rem #a6d5fa}@-webkit-keyframes fadeIn{0%{opacity:0;top:-25px}to{opacity:1;top:0}}@keyframes fadeIn{0%{opacity:0;top:-25px}to{opacity:1;top:0}}@-webkit-keyframes shrink{0%{height:0}to{height:20px}}@keyframes shrink{0%{height:0}to{height:20px}}@media screen and (min-width:40.063em){.label-right{padding-left:2em}}::ng-deep crud-form .crud-form-container{padding:.5rem .5rem 0}::ng-deep crud-form .p-datatable .p-datatable-tbody tr td.control-inside,::ng-deep crud-form .p-datatable .p-datatable-tbody tr td.control-inside .show-in-box:not(.crud-form-control),::ng-deep crud-form base-congviec-form crud-form>.crud-form-container{padding:0}:host ::ng-deep .tox-tinymce{border:none;border-top:1px solid #ccc;overflow:unset}:host ::ng-deep .tox-tinymce .tox-editor-container{overflow:unset}:host ::ng-deep .tox-tinymce .tox-toolbar{border:1px solid #ccc;border-bottom:none}:host ::ng-deep .tox-tinymce .tox-edit-area{border:1px solid #ccc}:host ::ng-deep .tox-tinymce .tox-edit-area iframe{box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}:host ::ng-deep .tox-tinymce .tox-menubar{border:1px solid #ccc}:host ::ng-deep .tox .tox-edit-area.tinymce-focus{border:1px solid #66afe9;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 3px 0 #66afe9;transition:box-shadow .3s,border-color .3s;transition-delay:0s,0s;transition-duration:.3s,.3s;transition-property:box-shadow,border-color;transition-timing-function:ease,ease}:host ::ng-deep .rq .tox .tox-edit-area{border-left-color:#ff4c46}.no-value{font-size:.8em}:host ::ng-deep .table-schema-paging{display:block;margin-bottom:40px}"]
                 },] }
@@ -17331,6 +17359,10 @@
                                 });
                             }
                             data.__disableEdit = this.model.data.__disableEdit;
+                            // Set basePermission từ crudlist
+                            if (this.model.data.basePermission && this.model.data.basePermission === exports.PermissionBase.FULL) {
+                                data.basePermission = this.model.data.basePermission;
+                            }
                             this.model.data = data;
                             if (data.pid && data.pid != this.guidEmpty && data.basePermissionByPid !== undefined) {
                                 this.checkPermission(data.basePermissionByPid);
@@ -20358,6 +20390,7 @@
                             }
                             buttonContexts.sort(multipleSort('soThuTu'));
                             workflowHistoryService = this._injector.get(WorkflowHistoryService);
+                            workflowHistoryService.changeEndpoint(this.setting.baseService);
                             userService = this._injector.get(UserService);
                             userId = userService.getId();
                             userIdStringUpper = '';
@@ -21995,6 +22028,11 @@
             }
             return !this.buttonPermissionMap.get(this.setting.baseService.serviceCode + "/" + this.setting.baseService.entityName + "/" + buttonPermissionCode);
         };
+        CrudListComponent.prototype.setDropdownDatasource = function (field, dataSource) {
+            if (this.filterSchema.dropdown[field]) {
+                this.filterSchema.dropdown[field].dataSource = dataSource;
+            }
+        };
         return CrudListComponent;
     }(ComponentBase));
     CrudListComponent.decorators = [
@@ -22158,7 +22196,6 @@
             this.serviceUri = this.getEndpointByService(service) + "/WorkflowSetting";
         };
         WorkflowSettingsService.prototype.renderDataSourceActionWorkflow = function (workflowSchema) {
-            var _this = this;
             var dataSourceAction = [];
             var dicSameName = {};
             workflowSchema.connections.sort(multipleSort('soThuTu')).forEach(function (action) {
@@ -22189,6 +22226,51 @@
                     dataSourceAction.push(itemAdd_1);
                 }
             });
+            this.makeUniqueName(dicSameName);
+            return dataSourceAction;
+        };
+        WorkflowSettingsService.prototype.generateTenWithCode = function (item) {
+            item.ten = item.name + " - " + item.rawCode;
+        };
+        WorkflowSettingsService.prototype.generateTenWithSource = function (item) {
+            item.ten = item.name + " (" + item.sourceName + " - " + item.sourceCode + ")";
+        };
+        WorkflowSettingsService.prototype.generateTenFull = function (item) {
+            item.ten = item.name + " - " + item.rawCode + " (" + item.sourceName + " - " + item.sourceCode + ")";
+        };
+        WorkflowSettingsService.prototype.minimizeDatasourceAction = function (actions, lstWorkflowHistory) {
+            var dataSourceAction = [];
+            var dicSameName = {};
+            actions.forEach(function (action) {
+                if (action.buildIn) {
+                    dataSourceAction.push(action);
+                    return;
+                }
+                action.ten = action.shortTen;
+                if (lstWorkflowHistory) {
+                    if (!lstWorkflowHistory.some(function (q) { return q.sourceStatusCode == action.sourceCode && q.actionCode == action.rawCode; })) {
+                        return;
+                    }
+                }
+                var itemExist = dataSourceAction.find(function (q) { return q.nameLower == action.nameLower; });
+                if (itemExist) {
+                    if (!dicSameName[action.nameLower]) {
+                        dicSameName[action.nameLower] = [];
+                    }
+                    if (dicSameName[action.nameLower].indexOf(itemExist) == -1) {
+                        dicSameName[action.nameLower].push(itemExist);
+                    }
+                    if (dicSameName[action.nameLower].indexOf(action) == -1) {
+                        dicSameName[action.nameLower].push(action);
+                    }
+                }
+                dataSourceAction.push(action);
+            });
+            this.makeUniqueName(dicSameName);
+            return dataSourceAction;
+        };
+        WorkflowSettingsService.prototype.makeUniqueName = function (dicSameName) {
+            var _this = this;
             Object.values(dicSameName).forEach(function (lstItem) {
                 var arrTen = [];
                 var error = false;
@@ -22220,16 +22302,6 @@
                     _this.generateTenFull(lstItem[i]);
                 }
             });
-            return dataSourceAction;
-        };
-        WorkflowSettingsService.prototype.generateTenWithCode = function (item) {
-            item.ten = item.name + " - " + item.rawCode;
-        };
-        WorkflowSettingsService.prototype.generateTenWithSource = function (item) {
-            item.ten = item.name + " (" + item.sourceName + " - " + item.sourceCode + ")";
-        };
-        WorkflowSettingsService.prototype.generateTenFull = function (item) {
-            item.ten = item.name + " - " + item.rawCode + " (" + item.sourceName + " - " + item.sourceCode + ")";
         };
         return WorkflowSettingsService;
     }(BaseService));
@@ -22859,7 +22931,8 @@
             return {
                 pid: rowData.pid,
                 basePermissionByPid: rowData.basePermissionByPid,
-                id: rowData[this.setting.entityKey]
+                id: rowData[this.setting.entityKey],
+                basePermission: rowData.basePermission
             };
         };
         DataListBase.prototype.getPromiseDeleteItem = function (rowData) {
@@ -27505,12 +27578,9 @@
         CheckBoxListComponent.prototype.ngOnInit = function () {
             this.fieldValue = this.control.valueField;
             if (this.control.dataSource == null || this.control.dataSource.length == 0) {
-                this.bindDataSource(this.control.serviceUri, this.control.baseService);
-                // if (this.control.serviceUri) {
-                // }
-                // else if(this.control.baseService) {
-                //
-                // }
+                if (this.control.serviceUri) {
+                    this.bindDataSource();
+                }
             }
             else {
                 this.dataSourceInternal = this.control.dataSource;
@@ -27528,56 +27598,20 @@
                 this.classCheckBox += " p-col-" + this.control.pColClass;
             }
         };
-        CheckBoxListComponent.prototype.bindDataSource = function (serviceUri, baseService) {
+        CheckBoxListComponent.prototype.bindDataSource = function () {
             var _this = this;
-            var _a, _b;
-            if (baseService) {
-                if (baseService instanceof BaseService) {
-                    var dropdownOptions = new DropdownOptions({
-                        displayField: (_a = this.control.displayField) !== null && _a !== void 0 ? _a : 'ten',
-                        valueField: (_b = this.control.valueField) !== null && _b !== void 0 ? _b : 'id',
-                    });
-                    baseService.getDataDropdown(dropdownOptions).then(function (res) {
-                        _this.dataSourceInternal = res;
-                        _this.gotData = true;
-                        if (_this.wroteValue)
-                            _this.fixValue();
-                        _this.onReady.emit(_this.control.field);
-                    }).catch(function (err) {
-                        _this.onReady.emit(_this.control.field);
-                        console.log(err);
-                    });
-                }
-                else if (baseService instanceof MasterDataService) {
-                    baseService.getDropdown(this.control.groupCode).then(function (res) {
-                        // const displayField = this.control.displayField ?? 'id';
-                        // const valueField = this.control.valueField ?? 'code';
-                        _this.dataSourceInternal = res.map(function (item) {
-                            return { id: item.value, ten: item.label };
-                        });
-                        if (_this.wroteValue)
-                            _this.fixValue();
-                        _this.onReady.emit(_this.control.field);
-                    }).catch(function (err) {
-                        console.log(err);
-                        _this.onReady.emit(_this.control.field);
-                    });
+            this._dropDownService.getDataSource(this.control.serviceUri).then(function (rs) {
+                var arr = [];
+                // for (let i = 0; i < rs.data.length; i++) {
+                //     arr.push({ label: rs.data[i][this.control.displayField], title: rs.data[i][this.control.displayField], value: rs.data[i][this.control.valueField] });
+                // }
+                _this.dataSourceInternal = rs.data;
+                _this.gotData = true;
+                if (_this.wroteValue) {
+                    _this.fixValue();
                 }
-            }
-            else if (serviceUri) {
-                this._dropDownService.getDataSource(serviceUri).then(function (rs) {
-                    var arr = [];
-                    // for (let i = 0; i < rs.data.length; i++) {
-                    //     arr.push({ label: rs.data[i][this.control.displayField], title: rs.data[i][this.control.displayField], value: rs.data[i][this.control.valueField] });
-                    // }
-                    _this.dataSourceInternal = rs.data;
-                    _this.gotData = true;
-                    if (_this.wroteValue) {
-                        _this.fixValue();
-                    }
-                }, function (error) {
-                });
-            }
+            }, function (error) {
+            });
         };
         CheckBoxListComponent.prototype.change = function (event) {
             var totalValue = __spread(this.selectedValue);
@@ -27645,8 +27679,8 @@
                         {
                             provide: forms.NG_VALUE_ACCESSOR,
                             useExisting: i0.forwardRef(function () { return CheckBoxListComponent; }),
-                            multi: true,
-                        },
+                            multi: true
+                        }
                     ],
                     styles: [".tn-check-box-list.p-grid{margin-bottom:-.5em}.p-col-horizontal{padding:.5em;position:relative}.tn-check-box-list{position:relative}.tn-check-box-list.flex-end{justify-content:flex-end}.tn-check-box-list.flex-center{justify-content:center}"]
                 },] }
@@ -28774,6 +28808,10 @@
             return _this;
         }
         AppSubMenuComponent.prototype.itemClick = function (event, item) {
+            if (item.url) {
+                // go to external url, default target="_blank"
+                window.open(item.url);
+            }
             if (this.root) {
                 this._commonService.menuHoverActive = !this._commonService.menuHoverActive;
             }
@@ -28920,6 +28958,10 @@
         AppMenuComponent.prototype.ngOnInit = function () {
         };
         AppMenuComponent.prototype.activeItem = function (item) {
+            if (item.url) {
+                item.activated = false;
+                return false;
+            }
             if (item.items && item.items.length > 0) {
                 item.activated = undefined;
                 for (var i in item.items) {
@@ -36788,7 +36830,7 @@
         { type: i0.Component, args: [{
                     // tslint:disable-next-line: component-selector
                     selector: 'file-manager',
-                    template: "<div *ngIf=\"layout == _layout.LIST\" class=\"full-layout\">\r\n    <div class=\"fm-toolbar\">\r\n        <div class=\"fm-toolbar-buttons\">\r\n            <ng-container *ngIf=\"!readonly\">\r\n                <button *ngIf=\"!hiddenCreateFolder\" 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\r\n                <button 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 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\r\n                <!--<button *ngIf=\"model.selectedItems && model.selectedItems.length > 1\" class=\"p-button-text\" pButton\r\n                        type=\"button\"\r\n                        pTooltip=\"N\u00E9n & sao ch\u00E9p \u0111\u01B0\u1EDDng d\u1EABn\" tooltipPosition=\"top\" icon=\"fas fa-file-archive\"\r\n                        iconPos=\"left\" label=\"N\u00E9n & sao ch\u00E9p \u0111\u01B0\u1EDDng d\u1EABn\"\r\n                        (click)=\"generateZipLinkAndCopy()\">\r\n                </button>-->\r\n\r\n                <button *ngIf=\"!inTaiLieu && !inTaiLieuChung\" 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()\" 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-container>\r\n        </div>\r\n        <ng-container *ngTemplateOutlet=\"breadCrumb\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"fm-grid\">\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'\" (onReload)=\"_triggerProcessData($event)\"\r\n            (onRowSelect)=\"onRowSelect($event)\">\r\n\r\n            <ng-template #explorerItem let-rowData='rowData' let-col='col'>\r\n                <span (click)=\"openObject(rowData)\" class=\"pull-left file-ex-icon\"\r\n                    [innerHTML]=\"rowData.name | fileIcon : !rowData.isFile\">\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                <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            </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\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        <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        <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    </div>\r\n\r\n    <div class=\"nfl-grid\">\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                        <!-- <div *ngIf=\"rowData.signatures\" class=\"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                    </span>\r\n                    <!-- <span class=\"file-ex-extension\">{{rowData.extension}}</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                <!--\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        <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<ng-template #breadCrumb>\r\n    <div *ngIf=\"data.breadcrumbs.length > 0\" 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\" [maxFileSize]=\"maxFileSize\" auto=\"true\"\r\n    [invalidFileSizeMessageSummary]=\"invalidFileSizeMessageSummary\"\r\n    [invalidFileSizeMessageDetail]=\"invalidFileSizeMessageDetail\"\r\n    [invalidFileTypeMessageSummary]=\"invalidFileTypeMessageSummary\"\r\n    [invalidFileTypeMessageDetail]=\"invalidFileTypeMessageDetail\"\r\n    [invalidFileLimitMessageSummary]=\"invalidFileLimitMessageSummary\"\r\n    [invalidFileLimitMessageDetail]=\"invalidFileLimitMessageDetail\" (onProgress)=\"onUploadProgress($event)\"\r\n    (onBeforeUpload)=\"onBeforeUpload($event)\" (onSelect)=\"handleSelectFile($event)\" (onUpload)=\"onUploaded($event)\"\r\n    [accept]=\"control ? control.accept: null\">\r\n</p-fileUpload>\r\n<p-contextMenu #contextMenu [appendTo]=\"'body'\" [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:1024, height: 800 }\" (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<!--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>",
+                    template: "<div *ngIf=\"layout == _layout.LIST\" class=\"full-layout\">\r\n    <div class=\"fm-toolbar\">\r\n        <div class=\"fm-toolbar-buttons\">\r\n            <ng-container *ngIf=\"!readonly\">\r\n                <button *ngIf=\"!hiddenCreateFolder\" 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\r\n                <button 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 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\r\n                <!--<button *ngIf=\"model.selectedItems && model.selectedItems.length > 1\" class=\"p-button-text\" pButton\r\n                        type=\"button\"\r\n                        pTooltip=\"N\u00E9n & sao ch\u00E9p \u0111\u01B0\u1EDDng d\u1EABn\" tooltipPosition=\"top\" icon=\"fas fa-file-archive\"\r\n                        iconPos=\"left\" label=\"N\u00E9n & sao ch\u00E9p \u0111\u01B0\u1EDDng d\u1EABn\"\r\n                        (click)=\"generateZipLinkAndCopy()\">\r\n                </button>-->\r\n\r\n                <button *ngIf=\"!inTaiLieu && !inTaiLieuChung\" 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()\" 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-container>\r\n        </div>\r\n        <ng-container *ngTemplateOutlet=\"breadCrumb\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"fm-grid\">\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'\" (onReload)=\"_triggerProcessData($event)\"\r\n            (onRowSelect)=\"onRowSelect($event)\">\r\n\r\n            <ng-template #explorerItem let-rowData='rowData' let-col='col'>\r\n                <span (click)=\"openObject(rowData)\" class=\"pull-left file-ex-icon\"\r\n                    [innerHTML]=\"rowData.name | fileIcon : !rowData.isFile\">\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                <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            </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\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        <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        <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        <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                        <!-- <div *ngIf=\"rowData.signatures\" class=\"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                    </span>\r\n                    <!-- <span class=\"file-ex-extension\">{{rowData.extension}}</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                <!--\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        <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<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\" [maxFileSize]=\"maxFileSize\" auto=\"true\"\r\n    [invalidFileSizeMessageSummary]=\"invalidFileSizeMessageSummary\"\r\n    [invalidFileSizeMessageDetail]=\"invalidFileSizeMessageDetail\"\r\n    [invalidFileTypeMessageSummary]=\"invalidFileTypeMessageSummary\"\r\n    [invalidFileTypeMessageDetail]=\"invalidFileTypeMessageDetail\"\r\n    [invalidFileLimitMessageSummary]=\"invalidFileLimitMessageSummary\"\r\n    [invalidFileLimitMessageDetail]=\"invalidFileLimitMessageDetail\" (onProgress)=\"onUploadProgress($event)\"\r\n    (onBeforeUpload)=\"onBeforeUpload($event)\" (onSelect)=\"handleSelectFile($event)\" (onUpload)=\"onUploaded($event)\"\r\n    [accept]=\"control ? control.accept: null\">\r\n</p-fileUpload>\r\n<p-contextMenu #contextMenu [appendTo]=\"'body'\" [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:1024, height: 800 }\" (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<!--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>",
                     providers: [
                         {
                             provide: forms.NG_VALUE_ACCESSOR,
@@ -37698,7 +37740,7 @@
             var model = this.getGenerateDownloadLinkModel();
             this._downloadLinkService.generateDownloadLink(model)
                 .then(function (rs) {
-                _this.model.fileUrl = _this._downloadLinkService.getAnonymousDownloadUrlForViewer(rs.data);
+                _this.model.fileUrl = _this._downloadLinkService.getAnonymousDownloadUrl(rs.data);
             });
         };
         FileViewerComponent.prototype.processOtherFileExtension = function () {
@@ -43546,6 +43588,7 @@
             _this._moduleConfigService = _moduleConfigService;
             _this.display = false;
             _this.showHelperCurrentPageState = true;
+            _this.helps = [];
             _this.environment = _moduleConfigService.getConfig().environment;
             if (_this.environment.helpConfig) {
                 _this.phoneNumber = _this.environment.helpConfig.expertPhoneNummber;
@@ -43562,6 +43605,9 @@
                 else {
                     _this.hrefMail = "javascript:void(0)";
                 }
+                if (_this.environment.helpConfig.documents) {
+                    _this.helps = _this.environment.helpConfig.documents;
+                }
             }
             return _this;
         }
@@ -43582,7 +43628,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=\"/assets/images/tri-nam-group-logo.png\"\r\n                            style=\"width: 100%; float: right; margin-top: 15px; opacity: 0.7;\" />\r\n                    </div>\r\n                </div>\r\n\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>",
+                    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}"]
                 },] }
@@ -44977,7 +45023,7 @@
     TnTabViewComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'tn-tabview',
-                    template: "<div [style.height]=\"height\">\r\n    <p-tabView #tab orientation=\"top\" [styleClass]=\"styleClass\" [activeIndex]=\"currentTabIndex\"\r\n        (onChange)=\"handleTabChange($event)\">\r\n        <ng-container *ngFor=\"let item of data; let i = index\">\r\n            <p-tabPanel *ngIf=\"!item.hidden\" [leftIcon]=\"item.icon\" [header]=\"item.label\">\r\n                <ng-container *ngIf=\"allowViewAll || currentTabIndex == i\">\r\n                    <ng-container *ngTemplateOutlet=\"template[item.code]; context: {$implicit: item}\">\r\n                    </ng-container>\r\n                </ng-container>\r\n            </p-tabPanel>\r\n        </ng-container>\r\n    </p-tabView>\r\n</div>",
+                    template: "<div [style.height]=\"height\">\r\n    <p-tabView #tab orientation=\"top\" [styleClass]=\"styleClass\" [activeIndex]=\"currentTabIndex\"\r\n        (onChange)=\"handleTabChange($event)\">\r\n        <ng-container *ngFor=\"let item of data; let i = index\">\r\n            <p-tabPanel *ngIf=\"!item.hidden\" [leftIcon]=\"item.icon\" [header]=\"item.label\"\r\n                [headerStyleClass]=\"item.headerStyleClass\">\r\n                <ng-container *ngIf=\"allowViewAll || currentTabIndex == i\">\r\n                    <ng-container *ngTemplateOutlet=\"template[item.code]; context: {$implicit: item}\">\r\n                    </ng-container>\r\n                </ng-container>\r\n            </p-tabPanel>\r\n        </ng-container>\r\n    </p-tabView>\r\n</div>",
                     styles: [".accordion-link{flex:1 1;text-align:right}.accordion-link ul{list-style:none;margin-bottom:0;margin-top:0;padding-left:0}.accordion-link ul li{background-color:#a4a5a4;border-radius:4px;color:#fff;display:inline-block;line-height:20px;margin-bottom:.5rem;margin-left:.5rem;padding:6px 12px;transition:all .3s ease-out}.accordion-link ul li:hover{background-color:#3db762;cursor:pointer}.accordion-link ul li.tab-active{background-color:#23a349}.tn-l-toolbar{display:flex;padding:.5rem .5rem 0}.hoso-container{height:auto;max-height:none}.tab-number{align-items:center;background:#a4a5a4;border-radius:2px;color:#fff;display:inline-flex;font-size:.9em;height:20px;justify-content:center;margin-right:.5rem;padding-top:2px;width:20px}.tab-number.active{background:#23a349}::ng-deep tn-accordion-tab{display:flex;flex-direction:column;height:100%}::ng-deep tn-accordion-tab .p-accordion-header{position:-webkit-sticky;position:sticky;top:1px;z-index:6}::ng-deep tn-accordion-tab .tn-l-p-accordion-wrapper{border-radius:4px;display:flex;flex:1;margin-left:.5rem;margin-right:.5rem;overflow:auto}::ng-deep tn-accordion-tab .tn-l-p-accordion-wrapper tn-custom-scrollbar{width:100%}::ng-deep tn-accordion-tab .ps__rail-x,::ng-deep tn-accordion-tab .ps__rail-y{z-index:7}::ng-deep tn-accordion-tab .tn-l-toolbar .toolbar{flex:0 0 auto;padding-top:0}@media (max-width:640px){.accordion-link,.toolbar{overflow-x:auto;white-space:nowrap}.tn-l-custom-wrapper{display:block}.accordion-link ul{margin-top:0}.tn-l-toolbar{display:block}}"]
                 },] }
     ];
@@ -46826,15 +46872,18 @@
             this.setting.hiddenSettingPermission = true;
             this.setting.hiddenSettingWorkflow = true;
             this.setting.showEditLink = false;
+            this.setting.hiddenSettingWorkflowNew = true;
+            // RedOnly
+            this.setting.hiddenToolbar = !this.readOnly;
             this.setting.modelSchemas = [
-                new ModelSchema({ field: 'soDen', dataType: 'int', name: 'Số đến/đi', fullName: 'Số đến/đi', description: 'Số đến/đi' }),
+                new ModelSchema({ field: 'soDenDi', dataType: 'int', name: 'Số đến/đi', fullName: 'Số đến/đi', description: 'Số đến/đi' }),
                 new ModelSchema({ field: 'soKyHieu', name: 'Số, ký hiệu', fullName: 'Số, ký hiệu', description: 'Số, ký hiệu' }),
                 new ModelSchema({ field: 'trichYeu', name: 'Trích yếu', fullName: '', description: '' }),
                 new ModelSchema({ field: 'ngayBanHanh', dataType: 'date', name: 'Ngày ban hành', fullName: '', description: '' })
             ];
             this.setting.cols = [
                 new ColumnSchemaBase({
-                    field: 'soDen',
+                    field: 'soDenDi',
                     width: '100px'
                 }),
                 new ColumnSchemaBase({
@@ -46864,7 +46913,7 @@
                     });
                     return;
                 }
-                gridInfo.filters.push(_this.newFilter('instanceId', exports.Operator.in, _this.idVanBanDens));
+                gridInfo.filters.push(_this.newFilter('id', exports.Operator.in, _this.idVanBanDens));
                 _this._vanBanDenService.getByGridRequestWithBodyOld(gridInfo, 'Permission')
                     .then(function (response) { return __awaiter(_this, void 0, void 0, function () {
                     return __generator(this, function (_a) {
@@ -46909,8 +46958,9 @@
                     });
                     return;
                 }
-                gridInfo.filters.push(_this.newFilter('instanceId', exports.Operator.in, _this.idVanBanDis));
-                _this._vanBanDiService.getByGridRequestWithBodyOld(gridInfo, 'Permission')
+                gridInfo.filters.push(_this.newFilter('id', exports.Operator.in, _this.idVanBanDis));
+                _this.plusUrl = 'GetDataByPermission';
+                _this._vanBanDiService.getByGridRequest(gridInfo, _this.plusUrl)
                     .then(function (response) { return __awaiter(_this, void 0, void 0, function () {
                     return __generator(this, function (_a) {
                         if (response.success) {
@@ -46954,6 +47004,21 @@
                 });
             });
         };
+        VanBanPickerComponent.prototype.beforeRenderDataSource = function (datasource) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_a) {
+                    datasource.forEach(function (element) {
+                        if (element.type == EnumLoaiVanBanBase.VB_DEN) {
+                            element.soDenDi = element.soDen;
+                        }
+                        else {
+                            element.soDenDi = element.soDi;
+                        }
+                    });
+                    return [2 /*return*/];
+                });
+            });
+        };
         VanBanPickerComponent.prototype.navigateToVanBan = function (rowData) {
             if (rowData.type == EnumLoaiVanBanBase.VB_DEN)
                 this.navigateToVanBanDen(rowData);
@@ -46961,10 +47026,10 @@
                 this.navigateToVanBanDi(rowData);
         };
         VanBanPickerComponent.prototype.navigateToVanBanDen = function (rowData) {
-            window.open(this.environment.clientDomain.vanbanDomain + "/vanbanden#_a=1&_i=" + rowData.id, '_blank');
+            window.open(this.environment.clientDomain.vanban + "/tracuu-vanbanden#i=" + rowData.id, '_blank');
         };
         VanBanPickerComponent.prototype.navigateToVanBanDi = function (rowData) {
-            window.open(this.environment.clientDomain.vanbanDomain + "/vanbandi#_a=1&_i=" + rowData.id, '_blank');
+            window.open(this.environment.clientDomain.vanban + "/tracuu-vanbandi#i=" + rowData.id, '_blank');
         };
         VanBanPickerComponent.prototype.showFormPickVanBan = function () {
             this.beforeAdd();
@@ -46989,9 +47054,9 @@
                 var idVanBanDens = [], idVanBanDis = [];
                 rowDatas.forEach(function (item) {
                     if (item.type == EnumLoaiVanBanBase.VB_DEN)
-                        idVanBanDens.push(item.instanceId);
+                        idVanBanDens.push(item.id);
                     else
-                        idVanBanDis.push(item.instanceId);
+                        idVanBanDis.push(item.id);
                 });
                 if (idVanBanDens.length > 0)
                     _this.idVanBanDens = _this.idVanBanDens.filter(function (q) { return idVanBanDens.indexOf(q) == -1; });
@@ -47051,7 +47116,7 @@
     VanBanPickerComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'vanban-picker',
-                    template: "<crud-list #crudList [model]=\"model\" [setting]=\"setting\" [dataSource]=\"model.dataSource\"\r\n    [style]=\"{'min-height': '300px'}\" (onReload)=\"_triggerProcessData($event)\" (onAdd)=\"_add($event)\" (onEdit)=\"_edit($event)\"\r\n    (onView)=\"_view($event)\" (onDelete)=\"_delete($event)\" (onDeleteMultiple)=\"_deleteMultiple($event)\"\r\n    (onReloaded)=\"_unmarkLoading()\">\r\n    <ng-template #toolbar>\r\n        <button type=\"button\" pButton icon=\"pi pi-clone\" class=\"p-button-text p-button-rounded p-button-success\"\r\n            label=\"Ch\u1ECDn v\u0103n b\u1EA3n\" (click)=\"showFormPickVanBan()\"></button>\r\n        <button type=\"button\" pButton icon=\"pi pi-trash\" class=\"p-button-text p-button-rounded p-button-danger\"\r\n            label=\"X\u00F3a v\u0103n b\u1EA3n\" (click)=\"xoaVanBanSelected()\"></button>\r\n    </ng-template>\r\n    <ng-template #function let-rowData=\"rowData\">\r\n        <button type=\"button\" pButton icon=\"pi pi-eye\"\r\n            class=\"p-button-text p-button-rounded p-button-success link-or-action\" pTooltip=\"Xem chi ti\u1EBFt v\u0103n b\u1EA3n\"\r\n            tooltipPosition=\"top\" (click)=\"navigateToVanBan(rowData)\"></button>\r\n        <button type=\"button\" pButton icon=\"pi pi-trash\"\r\n            class=\"p-button-text p-button-rounded p-button-danger link-or-action\" pTooltip=\"X\u00F3a v\u0103n b\u1EA3n\"\r\n            tooltipPosition=\"top\" (click)=\"xoaVanBan(rowData)\"></button>\r\n    </ng-template>\r\n</crud-list>\r\n<tn-dialog *ngIf=\"showFormPicker\" #dialog [styleClass]=\"'tn-form-dialog'\" [header]=\"setting.popupHeader | translate\"\r\n    [popupSize]=\"setting.popupSize\" [useDefaultScrollBar]=\"true\" (onHide)=\"_handleCancel($event)\">\r\n    <app-vanban-picker-dialog [parentModel]=\"model\" [parentContext]=\"context\" [control]=\"control\"\r\n        [idVanBanDens]=\"idVanBanDens\" [idVanBanDis]=\"idVanBanDis\" (onCancel)=\"_handleCancel($event)\"\r\n        (onChanged)=\"handleChangeValue($event)\">\r\n    </app-vanban-picker-dialog>\r\n</tn-dialog>",
+                    template: "<crud-list #crudList [model]=\"model\" [setting]=\"setting\" [dataSource]=\"model.dataSource\"\r\n    [style]=\"{'min-height': '300px'}\" (onReload)=\"_triggerProcessData($event)\" (onAdd)=\"_add($event)\"\r\n    (onEdit)=\"_edit($event)\" (onView)=\"_view($event)\" (onDelete)=\"_delete($event)\"\r\n    (onDeleteMultiple)=\"_deleteMultiple($event)\" (onReloaded)=\"_unmarkLoading()\">\r\n    <ng-template #toolbar>\r\n        <button type=\"button\" pButton icon=\"pi pi-clone\" class=\"p-button-text p-button-rounded p-button-success\"\r\n            label=\"Ch\u1ECDn v\u0103n b\u1EA3n\" (click)=\"showFormPickVanBan()\"></button>\r\n        <button type=\"button\" pButton icon=\"pi pi-trash\" class=\"p-button-text p-button-rounded p-button-danger\"\r\n            label=\"X\u00F3a v\u0103n b\u1EA3n\" (click)=\"xoaVanBanSelected()\"></button>\r\n    </ng-template>\r\n    <ng-template #function let-rowData=\"rowData\">\r\n        <button type=\"button\" pButton icon=\"pi pi-eye\"\r\n            class=\"p-button-text p-button-rounded p-button-success link-or-action\" pTooltip=\"Xem chi ti\u1EBFt v\u0103n b\u1EA3n\"\r\n            tooltipPosition=\"top\" (click)=\"navigateToVanBan(rowData)\"></button>\r\n        <button *ngIf=\"readOnly\" type=\"button\" pButton icon=\"pi pi-trash\"\r\n            class=\"p-button-text p-button-rounded p-button-danger link-or-action\" pTooltip=\"X\u00F3a v\u0103n b\u1EA3n\"\r\n            tooltipPosition=\"top\" (click)=\"xoaVanBan(rowData)\"></button>\r\n    </ng-template>\r\n</crud-list>\r\n<tn-dialog *ngIf=\"showFormPicker\" #dialog [styleClass]=\"'tn-form-dialog'\" [header]=\"setting.popupHeader | translate\"\r\n    [popupSize]=\"setting.popupSize\" [useDefaultScrollBar]=\"true\" (onHide)=\"_handleCancel($event)\">\r\n    <app-vanban-picker-dialog [parentModel]=\"model\" [parentContext]=\"context\" [control]=\"control\"\r\n        [idVanBanDens]=\"idVanBanDens\" [idVanBanDis]=\"idVanBanDis\" (onCancel)=\"_handleCancel($event)\"\r\n        (onChanged)=\"handleChangeValue($event)\">\r\n    </app-vanban-picker-dialog>\r\n</tn-dialog>",
                     providers: [
                         ComponentContextService,
                         {
@@ -47070,6 +47135,8 @@
         { type: ModuleConfigService }
     ]; };
     VanBanPickerComponent.propDecorators = {
+        loaiVanBan: [{ type: i0.Input }],
+        readOnly: [{ type: i0.Input }],
         control: [{ type: i0.Input }],
         onChanged: [{ type: i0.Output }],
         onReady: [{ type: i0.Output }]
@@ -48146,6 +48213,8 @@
                 StraightConnection: true,
                 CenterConnectionLabel: true
             });
+            _this.generated = false;
+            _this.dataSourceAction = [];
             _this.stateDistance = 350;
             _this.topDistance = 80;
             _this.fileDataService = _fileDataService;
@@ -48155,6 +48224,7 @@
             var _this = this;
             this.loadDetailFromQueryParam = false;
             this.setting.baseService = this._workflowHistoryService;
+            this._workflowHistoryService.changeEndpoint(this.businessSetting.baseService);
             this.setting.multipleCheckWhenClickRow = false;
             this.setting.settingKey = '__workflow';
             this.currentWorkflow = this.workflowSetting.workflows.find(function (q) { return q.code == _this.item.__workflowCode; });
@@ -48198,7 +48268,6 @@
         };
         WorkflowHistoryNewComponent.prototype.init = function () {
             this.machineCodeKetThucs = this.currentWorkflow.data.machines.filter(function (q) { return q.type == exports.EnumStateType.STOP; }).map(function (q) { return q.code; });
-            var datasourceAction = this.createDatasourceAction();
             this.setting.modelSchemas = [
                 new ModelSchema({ field: 'userIdCreated', name: 'Người gửi', fullName: 'Người gửi', description: '' }),
                 new ModelSchema({ field: 'actionCode', name: 'Thao tác', fullName: 'Thao tác', description: '' }),
@@ -48213,6 +48282,8 @@
                 new ModelSchema({ field: 'roleViewIds', name: 'Chức vụ theo dõi', fullName: 'Chức vụ theo dõi', description: '' }),
                 new ModelSchema({ field: 'note', name: 'Ý kiến', fullName: 'Ý kiến', description: '' })
             ];
+            this.dataSourceAction = this.createDatasourceAction();
+            this.setting.fieldSearchText = ['code', 'ten'];
             this.setting.cols = [
                 new ColumnSchemaBase({
                     field: 'userIdCreated',
@@ -48222,11 +48293,13 @@
                 }),
                 new ColumnSchemaBase({
                     field: 'fullActionCode',
+                    fieldFilter: 'actionCode',
                     label: 'Hành động',
                     width: '9%',
-                    dataSource: datasourceAction,
+                    dataSource: this.dataSourceAction,
                     displayFieldInGrid: 'shortTen',
-                    valueField: 'code'
+                    valueField: 'code',
+                    fullTextSearch: true
                 }),
                 new ColumnSchemaBase({
                     field: 'userIds',
@@ -48332,6 +48405,7 @@
                 })
             ];
             this.model.ready = true;
+            this.minimizeDatasourceAction();
             _super.prototype.ngOnInit.call(this);
         };
         WorkflowHistoryNewComponent.prototype.findLastHistoryAndGetData = function () {
@@ -48443,40 +48517,32 @@
         };
         WorkflowHistoryNewComponent.prototype.appendStateAfterLastState = function (machinesData, machinesDataRaw, left) {
             return __awaiter(this, void 0, void 0, function () {
-                var lastMachine_1, actionAllows_1, index_1;
+                var lastMachine_1, index_1;
                 var _this = this;
                 return __generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            if (!(machinesData.machines.length > 0)) return [3 /*break*/, 2];
-                            lastMachine_1 = machinesData.machines[machinesData.machines.length - 1];
-                            if (lastMachine_1.type == exports.EnumStateType.STOP)
-                                return [2 /*return*/];
-                            return [4 /*yield*/, this.businessSetting.baseService.getActionAllow(this.item.id)];
-                        case 1:
-                            actionAllows_1 = (_a.sent()).data;
-                            if (!actionAllows_1)
-                                return [2 /*return*/];
-                            index_1 = 1;
-                            machinesDataRaw.connections.filter(function (q) { return q.source == lastMachine_1.rawId && actionAllows_1.indexOf(q.code) > -1; })
-                                .forEach(function (conn) {
-                                var targetMachine = machinesDataRaw.machines.find(function (q) { return q.id == conn.target; });
-                                if (targetMachine.code == lastMachine_1.code) {
-                                    var connection = _this.cloneConnection(conn, lastMachine_1, lastMachine_1);
-                                    connection.connector = 'StateMachine';
-                                    machinesData.connections.push(connection);
-                                }
-                                else {
-                                    var newTargetMachine = _this.cloneMachine(targetMachine, {});
-                                    newTargetMachine.location = [left, _this.topDistance + 150 * (index_1 - 1)];
-                                    index_1++;
-                                    machinesData.connections.push(_this.cloneConnection(conn, lastMachine_1, newTargetMachine));
-                                    machinesData.machines.push(newTargetMachine);
-                                }
-                            });
-                            _a.label = 2;
-                        case 2: return [2 /*return*/];
+                    if (machinesData.machines.length > 0) {
+                        lastMachine_1 = machinesData.machines[machinesData.machines.length - 1];
+                        if (lastMachine_1.type == exports.EnumStateType.STOP)
+                            return [2 /*return*/];
+                        index_1 = 1;
+                        machinesDataRaw.connections.filter(function (q) { return q.source == lastMachine_1.rawId; })
+                            .forEach(function (conn) {
+                            var targetMachine = machinesDataRaw.machines.find(function (q) { return q.id == conn.target; });
+                            if (targetMachine.code == lastMachine_1.code) {
+                                var connection = _this.cloneConnection(conn, lastMachine_1, lastMachine_1);
+                                connection.connector = 'StateMachine';
+                                machinesData.connections.push(connection);
+                            }
+                            else {
+                                var newTargetMachine = _this.cloneMachine(targetMachine, {});
+                                newTargetMachine.location = [left, _this.topDistance + 150 * (index_1 - 1)];
+                                index_1++;
+                                machinesData.connections.push(_this.cloneConnection(conn, lastMachine_1, newTargetMachine));
+                                machinesData.machines.push(newTargetMachine);
+                            }
+                        });
                     }
+                    return [2 /*return*/];
                 });
             });
         };
@@ -48489,18 +48555,52 @@
         WorkflowHistoryNewComponent.prototype.cloneConnection = function (connection, sourceState, targetState) {
             return Object.assign(Object.assign({}, connection), { source: sourceState.id, target: targetState.id });
         };
+        WorkflowHistoryNewComponent.prototype.minimizeDatasourceAction = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                var lstWorkflowHistory, dataSource;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0: return [4 /*yield*/, this._workflowHistoryService.getAll(this.getDefaultFilter(), 'sourceStatusCode,actionCode')];
+                        case 1:
+                            lstWorkflowHistory = (_a.sent()).data;
+                            dataSource = this._workflowSettingService.minimizeDatasourceAction(this.dataSourceAction, lstWorkflowHistory);
+                            this.crudList.setDropdownDatasource('fullActionCode', dataSource);
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
         WorkflowHistoryNewComponent.prototype.createDatasourceAction = function () {
             var result = [
-                { code: MaActionBatDauQuyTrinh, ten: 'Bắt đầu quy trình' }
+                { code: MaActionBatDauQuyTrinh, ten: 'Bắt đầu quy trình', buildIn: true }
             ];
             result.push.apply(result, __spread(this._workflowSettingService.renderDataSourceActionWorkflow(this.currentWorkflow.data)));
-            result.push({ code: ActionUpdateModel, ten: 'Chỉnh sửa' }, { code: ActionChoYKienBase, ten: 'Cho ý kiến' }, { code: ActionThuHoiBase, ten: 'Thu hồi thao tác' });
+            result.push({ code: ActionUpdateModel, ten: 'Chỉnh sửa', buildIn: true }, { code: ActionChoYKienBase, ten: 'Cho ý kiến', buildIn: true }, { code: ActionThuHoiBase, ten: 'Thu hồi thao tác', buildIn: true });
+            result.filter(function (q) { return q.buildIn; }).forEach(function (item) {
+                item.rawCode = item.code;
+                item.shortTen = item.ten;
+            });
             return result;
         };
+        WorkflowHistoryNewComponent.prototype.getDefaultFilter = function () {
+            return [
+                this.newFilter('tableName', exports.Operator.equal, this.tableName),
+                this.newFilter('itemId', exports.Operator.equal, this.item.id),
+                this.newFilter('workflowCode', exports.Operator.equal, this.item.__workflowCode)
+            ];
+        };
         WorkflowHistoryNewComponent.prototype.modifyGridInfo = function (gridInfo) {
             return __awaiter(this, void 0, void 0, function () {
-                return __generator(this, function (_a) {
-                    gridInfo.filters.unshift(this.newFilter('tableName', exports.Operator.equal, this.tableName), this.newFilter('itemId', exports.Operator.equal, this.item.id), this.newFilter('workflowCode', exports.Operator.equal, this.item.__workflowCode));
+                var filterByActionCode, arrValue_1, arrActionCode;
+                var _a;
+                return __generator(this, function (_b) {
+                    filterByActionCode = gridInfo.filters.find(function (q) { return q.field == 'actionCode'; });
+                    if (filterByActionCode) {
+                        arrValue_1 = JSON.parse(filterByActionCode.value);
+                        arrActionCode = this.dataSourceAction.filter(function (q) { return arrValue_1.some(function (x) { return x == q.code; }); }).map(function (x) { return x.rawCode; });
+                        filterByActionCode.value = JSON.stringify(arrActionCode);
+                    }
+                    (_a = gridInfo.filters).unshift.apply(_a, __spread(this.getDefaultFilter()));
                     gridInfo.sorts.unshift(this.newSort('created', -1));
                     return [2 /*return*/];
                 });
@@ -48512,7 +48612,13 @@
                 return __generator(this, function (_a) {
                     // Duyệt từng history để chỉ hiển thị luồng hiện tại của quy trình. k hiển thị các bước thừa
                     dataSource.forEach(function (item) {
-                        item.fullActionCode = item.sourceStatusCode + "___" + item.actionCode;
+                        item.fullActionCode = item.actionCode;
+                        if (item.actionCode != MaActionBatDauQuyTrinh
+                            && item.actionCode != ActionUpdateModel
+                            && item.actionCode != ActionChoYKienBase
+                            && item.actionCode != ActionThuHoiBase) {
+                            item.fullActionCode = item.sourceStatusCode + "___" + item.actionCode;
+                        }
                         _this.splitList(item, 'userIds');
                         _this.splitList(item, 'userViewIds');
                         _this.splitList(item, 'donViIds');
@@ -48551,7 +48657,10 @@
         WorkflowHistoryNewComponent.prototype.afterGetData = function () {
             return __awaiter(this, void 0, void 0, function () {
                 return __generator(this, function (_a) {
-                    this.regenerateMachineData();
+                    if (!this.generated) {
+                        this.generated = true;
+                        this.regenerateMachineData();
+                    }
                     return [2 /*return*/];
                 });
             });
@@ -50691,7 +50800,10 @@
                 isTree: true,
                 fieldTree: 'idParent',
                 valueParentRoot: null,
-                sorts: [{ field: 'maPhanCap', dir: 1 }]
+                sorts: [{ field: 'maPhanCap', dir: 1 }],
+                defaultFilters: [
+                    this.newFilter('hienThiTrongCongViec', exports.Operator.equal, true)
+                ]
             });
         };
         BaseCongViecComponent.prototype.ngOnDestroy = function () {
@@ -50946,12 +51058,25 @@
             var _this = this;
             this._congViecService.updateBulkIdCha(model).then(function (response) { return _this.handleResponse(response, '', function (f) { return _this.reload(); }); });
         };
+        BaseCongViecComponent.prototype.getMenuButtons = function (rowData) {
+            if (this.stateCode === exports.EnumStateByMenuCongViec.DA_XU_LY) {
+                this.rowDataCurrent = rowData;
+                return [
+                    { label: 'Dự thảo văn bản', icon: 'far fa-file-alt', command: this.duThaoVanBan.bind(this) }
+                ];
+            }
+            return [];
+        };
+        BaseCongViecComponent.prototype.duThaoVanBan = function () {
+            var link = this._moduleConfigService.getConfig().environment.clientDomain.vanban + "/vanbandi/du-thao#task=" + this.rowDataCurrent.id;
+            window.open(link, '_blank');
+        };
         return BaseCongViecComponent;
     }(DataListBase));
     BaseCongViecComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'base-congviec',
-                    template: "<crud-list #crudList [model]=\"model\" [setting]=\"setting\" [dataSource]=\"model.dataSource\" [hiddenAdd]=\"hiddenAdd\"\r\n    [hiddenEdit]=\"hiddenEdit\" [hiddenDelete]=\"hiddenDelete\" [hiddenCopyLink]=\"true\" [hiddenAdd]=\"isFromDashboard\"\r\n    [showScrollHorizontal]=\"true\" (onCopyLink)=\"_copyLink($event)\" (onCopyLinkMultiple)=\"_copyLinkMultiple()\"\r\n    (onReload)=\"_triggerProcessData($event)\" (onAdd)=\"addCongViec($event)\" (onEdit)=\"_edit($event)\"\r\n    (onView)=\"_edit($event)\" (onDelete)=\"_delete($event)\" (onDeleteMultiple)=\"_deleteMultiple($event)\"\r\n    (onReloaded)=\"_unmarkLoading()\" (onChangedStatusWorkflow)=\"handleChangedStatusWorkflow($event)\">\r\n    <ng-template #buttonAfterToolbar>\r\n        <button *ngIf=\"loaiDanhSach > 0 && !isPicker\" type=\"button\" pButton pRipple label=\"Ch\u1ECDn c\u00F4ng vi\u1EC7c\"\r\n            icon=\"pi pi-plus\" class=\"p-button-text p-button-success\" (click)=\"onChonCongViec()\"></button>\r\n    </ng-template>\r\n    <ng-template #congViecInfo let-rowData=\"rowData\">\r\n        <div class=\"container-task-info\">\r\n            <div class=\"cell-task-info\">\r\n                {{rowData.ten}}\r\n            </div>\r\n            <div class=\"percent-done\">\r\n                <div class=\"detail transition-width\" [ngStyle]=\"{\r\n                    width: rowData.percentWidth\r\n                }\">\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </ng-template>\r\n    <ng-template #idPriority let-rowData=\"rowData\">\r\n        <div class=\"priority\">\r\n            <span [ngStyle]=\"{\r\n                color: rowData.priorityColor,\r\n                background: rowData.priorityBackground\r\n            }\">{{rowData.stridPriority}}</span>\r\n        </div>\r\n    </ng-template>\r\n    <ng-template *ngIf=\"loaiDanhSach > 0\" #function let-rowData=\"rowData\" let-crudList=\"crudList\">\r\n        <button type=\"button\" pButton pRipple pTooltip=\"{{'FORM.DELETE' | translate}}\" tooltipPosition=\"top\"\r\n            class=\"p-button-rounded p-button-text p-button-danger link-or-action\" icon=\"pi pi-trash\"\r\n            (click)=\"deleteCongViecTheoLoaiDanhSach(rowData)\"></button>\r\n    </ng-template>\r\n</crud-list>\r\n\r\n<tn-dialog *ngIf=\"loaiCongViecModel.showEditForm\" [styleClass]=\"'tn-form-dialog'\"\r\n    [header]=\"loaiCongViecModel.header | translate\" [popupSize]=\"loaiCongViecModel.popupSize\"\r\n    (onHide)=\"loaiCongViecModel.showEditForm = false\">\r\n    <div class=\"p-col-12\">\r\n        <div class=\"p-grid\">\r\n            <div class=\"p-md-10 tn-dropdown p-fluid\">\r\n                <dropdown [control]=\"searchSchema.loaiCongViec\" [(value)]=\"searchData.loaiCongViec\"></dropdown>\r\n            </div>\r\n            <div class=\"p-md-2\">\r\n                <button type=\"button\" pButton class=\"p-button-primary p-col-12\" label=\"Ok\"\r\n                    (click)=\"showFormAddTask($event)\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</tn-dialog>\r\n\r\n<tn-dialog *ngIf=\"showDetailForm\" #dialog [styleClass]=\"'congviec-form tn-form-dialog'\"\r\n    [header]=\"setting.popupHeader | translate\" [popupSize]=\"setting.popupSize\" [useDefaultScrollBar]=\"true\"\r\n    (onHide)=\"showDetailForm = false\">\r\n    <base-congviec-form #formBase [parentModel]=\"model\" [parentSetting]=\"setting\" [parentContext]=\"context\"\r\n        [model]=\"formModel\" [crudList]=\"crudList\" (onSaved)=\"showDetailForm = false;crudList.reload()\"\r\n        (onCancel)=\"_handleCancel($event)\" (onAfterSaved)=\"onAfterSaved($event)\">\r\n    </base-congviec-form>\r\n</tn-dialog>\r\n\r\n<tn-dialog *ngIf=\"showPickerForm\" #dialog [styleClass]=\"'congviec-form tn-form-dialog'\"\r\n    [header]=\"'Ch\u1ECDn c\u00F4ng vi\u1EC7c' | translate\" [popupSize]=\"setting.popupSize\" [showFooter]=\"true\"\r\n    [useDefaultScrollBar]=\"true\" (onHide)=\"showPickerForm = false\">\r\n    <base-congviec #congViecPicker [isPicker]=\"true\" [formState]=\"formState\" [loaiDanhSach]=\"loaiDanhSach\"\r\n        [idCongViec]=\"idCongViec\">\r\n    </base-congviec>\r\n    <ng-template #footer>\r\n        <button type=\"button\" pButton icon=\"pi pi-save\" class=\"p-button-text\" [label]=\"'Ch\u1ECDn' | translate\"\r\n            (click)=\"onSelectCongViec()\"></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)=\"showPickerForm=false\"></button>\r\n    </ng-template>\r\n</tn-dialog>",
+                    template: "<crud-list #crudList [model]=\"model\" [setting]=\"setting\" [dataSource]=\"model.dataSource\" [hiddenAdd]=\"hiddenAdd\"\r\n    [hiddenEdit]=\"hiddenEdit\" [hiddenDelete]=\"hiddenDelete\" [hiddenCopyLink]=\"true\" [hiddenAdd]=\"isFromDashboard\"\r\n    [showScrollHorizontal]=\"true\" [menuButtons]=\"getMenuButtons\" (onCopyLink)=\"_copyLink($event)\"\r\n    (onCopyLinkMultiple)=\"_copyLinkMultiple()\" (onReload)=\"_triggerProcessData($event)\" (onAdd)=\"addCongViec($event)\"\r\n    (onEdit)=\"_edit($event)\" (onView)=\"_edit($event)\" (onDelete)=\"_delete($event)\"\r\n    (onDeleteMultiple)=\"_deleteMultiple($event)\" (onReloaded)=\"_unmarkLoading()\"\r\n    (onChangedStatusWorkflow)=\"handleChangedStatusWorkflow($event)\">\r\n    <ng-template #buttonAfterToolbar>\r\n        <button *ngIf=\"loaiDanhSach > 0 && !isPicker\" type=\"button\" pButton pRipple label=\"Ch\u1ECDn c\u00F4ng vi\u1EC7c\"\r\n            icon=\"pi pi-plus\" class=\"p-button-text p-button-success\" (click)=\"onChonCongViec()\"></button>\r\n    </ng-template>\r\n    <ng-template #congViecInfo let-rowData=\"rowData\">\r\n        <div class=\"container-task-info\">\r\n            <div class=\"cell-task-info\">\r\n                {{rowData.ten}}\r\n            </div>\r\n            <div class=\"percent-done\">\r\n                <div class=\"detail transition-width\" [ngStyle]=\"{\r\n                    width: rowData.percentWidth\r\n                }\">\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </ng-template>\r\n    <ng-template #idPriority let-rowData=\"rowData\">\r\n        <div class=\"priority\">\r\n            <span [ngStyle]=\"{\r\n                color: rowData.priorityColor,\r\n                background: rowData.priorityBackground\r\n            }\">{{rowData.stridPriority}}</span>\r\n        </div>\r\n    </ng-template>\r\n    <ng-template *ngIf=\"loaiDanhSach > 0\" #function let-rowData=\"rowData\" let-crudList=\"crudList\">\r\n        <button type=\"button\" pButton pRipple pTooltip=\"{{'FORM.DELETE' | translate}}\" tooltipPosition=\"top\"\r\n            class=\"p-button-rounded p-button-text p-button-danger link-or-action\" icon=\"pi pi-trash\"\r\n            (click)=\"deleteCongViecTheoLoaiDanhSach(rowData)\"></button>\r\n    </ng-template>\r\n</crud-list>\r\n\r\n<tn-dialog *ngIf=\"loaiCongViecModel.showEditForm\" [styleClass]=\"'tn-form-dialog'\"\r\n    [header]=\"loaiCongViecModel.header | translate\" [popupSize]=\"loaiCongViecModel.popupSize\"\r\n    (onHide)=\"loaiCongViecModel.showEditForm = false\">\r\n    <div class=\"p-col-12\">\r\n        <div class=\"p-grid\">\r\n            <div class=\"p-md-10 tn-dropdown p-fluid\">\r\n                <dropdown [control]=\"searchSchema.loaiCongViec\" [(value)]=\"searchData.loaiCongViec\"></dropdown>\r\n            </div>\r\n            <div class=\"p-md-2\">\r\n                <button type=\"button\" pButton class=\"p-button-primary p-col-12\" label=\"Ok\"\r\n                    (click)=\"showFormAddTask($event)\"></button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</tn-dialog>\r\n\r\n<tn-dialog *ngIf=\"showDetailForm\" #dialog [styleClass]=\"'congviec-form tn-form-dialog'\"\r\n    [header]=\"setting.popupHeader | translate\" [popupSize]=\"setting.popupSize\" [useDefaultScrollBar]=\"true\"\r\n    (onHide)=\"showDetailForm = false\">\r\n    <base-congviec-form #formBase [parentModel]=\"model\" [parentSetting]=\"setting\" [parentContext]=\"context\"\r\n        [model]=\"formModel\" [crudList]=\"crudList\" (onSaved)=\"showDetailForm = false;crudList.reload()\"\r\n        (onCancel)=\"_handleCancel($event)\" (onAfterSaved)=\"onAfterSaved($event)\">\r\n    </base-congviec-form>\r\n</tn-dialog>\r\n\r\n<tn-dialog *ngIf=\"showPickerForm\" #dialog [styleClass]=\"'congviec-form tn-form-dialog'\"\r\n    [header]=\"'Ch\u1ECDn c\u00F4ng vi\u1EC7c' | translate\" [popupSize]=\"setting.popupSize\" [showFooter]=\"true\"\r\n    [useDefaultScrollBar]=\"true\" (onHide)=\"showPickerForm = false\">\r\n    <base-congviec #congViecPicker [isPicker]=\"true\" [formState]=\"formState\" [loaiDanhSach]=\"loaiDanhSach\"\r\n        [idCongViec]=\"idCongViec\">\r\n    </base-congviec>\r\n    <ng-template #footer>\r\n        <button type=\"button\" pButton icon=\"pi pi-save\" class=\"p-button-text\" [label]=\"'Ch\u1ECDn' | translate\"\r\n            (click)=\"onSelectCongViec()\"></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)=\"showPickerForm=false\"></button>\r\n    </ng-template>\r\n</tn-dialog>",
                     providers: [ComponentContextService],
                     styles: [".container-task-info .percent-done{background-color:#f0f0f0;border-radius:2px;height:5px;margin-top:5px;overflow:hidden;position:relative}.container-task-info .percent-done .detail{background:#3eb839;border-radius:2px;font-size:13px;height:5px;left:0;position:absolute;text-align:center;top:0}.priority{text-align:center}.priority>span{border-radius:3px;font-size:.8em;padding:3px 7px}"]
                 },] }
@@ -51136,7 +51261,11 @@
                     field: 'ten',
                     label: 'Tên loại',
                     required: true,
-                    mdWidth: 12
+                }),
+                new SwitchControlSchema({
+                    field: 'hienThiTrongCongViec',
+                    label: 'Sử dụng ở phân hệ công việc',
+                    defaultValue: true
                 })
             ];
         };
@@ -51221,6 +51350,7 @@
             return __awaiter(this, void 0, void 0, function () {
                 return __generator(this, function (_a) {
                     gridInfo.sorts = [{ field: 'maPhanCap', dir: 1 }];
+                    gridInfo.filters.push(this.newFilter('soThuTu', exports.Operator.equal, 'soThuTu', true));
                     return [2 /*return*/];
                 });
             });
@@ -56053,6 +56183,7 @@
     exports.TBL_KTX_NGUOITHUE_HOSO = TBL_KTX_NGUOITHUE_HOSO;
     exports.TBL_TS_PHIEUDEXUAT = TBL_TS_PHIEUDEXUAT;
     exports.TBL_TS_TAISANCODINH_CONSTS = TBL_TS_TAISANCODINH_CONSTS;
+    exports.TabViewData = TabViewData;
     exports.TableSchema = TableSchema;
     exports.TagSeparator = TagSeparator;
     exports.TaiLieuComponent = TaiLieuComponent;