tnx-shared 5.3.211 → 5.3.212

package/fesm2015/tnx-shared.js

@@ -903,6 +903,7 @@ class ContainerSchema extends FormSchemaBase {
     constructor(init) {
         super();
         this.showInBox = true;
+        this.required = false;
         for (const key in init) {
             this[key] = init[key];
         }
@@ -1624,6 +1625,17 @@ class TableSchema extends FormControlBase {
         this.disableChildrenControl(this.rowTemplate);
     }
 }
+class HtmlPreviewControlSchema extends FormControlBase {
+    constructor(init) {
+        super();
+        this.height = 250;
+        this.useMathJaxMenu = false;
+        this.autoScrollBottom = false;
+        for (const key in init) {
+            this[key] = init[key];
+        }
+    }
+}
 class ColumnSchemaBase extends FormSchemaBaseWithService {
     constructor(init) {
         super();
@@ -3937,6 +3949,10 @@ class CommonService {
         }
         document.body.appendChild(scriptElement);
     }
+    getNameOfWeekdays(date) {
+        const weekdays = ['Chủ nhật', 'Thứ hai', 'Thứ ba', 'Thứ tư', 'Thứ năm', 'Thứ sáu', 'Thứ bảy'];
+        return weekdays[date.getDay()];
+    }
 }
 CommonService.ɵprov = i0.ɵɵdefineInjectable({ factory: function CommonService_Factory() { return new CommonService(i0.ɵɵinject(ModuleConfigService)); }, token: CommonService, providedIn: "root" });
 CommonService.decorators = [
@@ -12342,6 +12358,40 @@ class CrudFormComponent extends ComponentBase {
         this.controlNeedCheckReady = [];
         this.readyStatus = {};
         this.fieldParentField = 'parentField';
+        this.handleKeyUp = (control, event, eventType, parentModel, parentPath, sourceNode) => __awaiter(this, void 0, void 0, function* () {
+            let parentNode = this._rootNode.getNodeByPath(parentPath);
+            let currentNode;
+            // row in table
+            if (control == null) {
+                currentNode = parentNode;
+                control = currentNode.control;
+                parentNode = parentNode.parentNode;
+                parentModel = parentNode.model;
+            }
+            else {
+                currentNode = parentNode.getChildNode(control.field);
+            }
+            let value = currentNode.value;
+            // auto correct value
+            value = this.correctValue(currentNode);
+            currentNode.value = value;
+            // validate value
+            yield this.validate(currentNode);
+            const eventData = new EventData({
+                currentNode,
+                sourceEvent: event,
+                sourceNode: sourceNode || currentNode,
+                eventType,
+                crudForm: this
+            });
+            if (control.onKeyUp) {
+                try {
+                    yield control.onKeyUp(eventData);
+                }
+                catch (_a) {
+                }
+            }
+        });
         /**
          * Để nguyên hàm dạng arrow function vì có 1 số form khác gọi
          */
@@ -12378,7 +12428,7 @@ class CrudFormComponent extends ComponentBase {
                 try {
                     yield control.onChanged(eventData);
                 }
-                catch (_a) {
+                catch (_b) {
                 }
             }
             if (!bubble) {
@@ -12396,7 +12446,7 @@ class CrudFormComponent extends ComponentBase {
                 try {
                     yield control.onAfterChanged(eventData);
                 }
-                catch (_b) {
+                catch (_c) {
                 }
             }
             this.onChange.emit(eventData);
@@ -13431,6 +13481,8 @@ class CrudFormComponent extends ComponentBase {
             return 'chips';
         if (control instanceof ColumnSchemaBase)
             return 'column';
+        if (control instanceof HtmlPreviewControlSchema)
+            return 'htmlPreview';
         return 'custom';
     }
     getViewModeDataType(control) {
@@ -13488,6 +13540,8 @@ class CrudFormComponent extends ComponentBase {
             return 'table';
         if (control instanceof KeyValueControlSchema)
             return 'app-key-value';
+        if (control instanceof HtmlPreviewControlSchema)
+            return 'htmlPreview';
         if (control instanceof ContainerSchema) {
             return 'container';
         }
@@ -14457,7 +14511,7 @@ class CrudFormComponent extends ComponentBase {
 CrudFormComponent.decorators = [
     { type: Component, args: [{
                 selector: 'crud-form',
-                template: "<div [class]=\"_styleClass\">\n    <form #formElement autocomplete=\"off\" autocorrect=\"off\" spellcheck=\"false\"\n        [class]=\"'p-grid form-group crud-form' + (formClass ? ' ' + formClass : '')\"\n        (keydown.shift.tab)=\"preventBlur($event)\">\n        <div class=\"p-grid p-col-12\" [class.grid]=\"useGridTemplate\" style=\"margin: 0\">\n            <ng-container *ngFor=\"let control of setting.schema\">\n                <ng-container *ngTemplateOutlet=\"customControl; context: {\n                    control: control, data: _modelData, parentPath: '', path: control.field, showLabel: control.showLabel,\n                    mdWidth: control.mdWidth, rowSpan: control.rowSpan\n                }\">\n                </ng-container>\n            </ng-container>\n        </div>\n    </form>\n</div>\n<p-contextMenu #contextMenu [appendTo]=\"'body'\" [model]=\"buttonContexts\">\n</p-contextMenu>\n<ng-template #customControl let-data=\"data\" let-control=\"control\" let-showLabel=\"showLabel\" let-mdWidth=\"mdWidth\"\n    let-rowSpan=\"rowSpan\" let-rowIndex=\"index\" let-path=\"path\" let-parentPath=\"parentPath\" let-tablePath=\"tablePath\">\n    <div *ngIf=\"!checkHidden(control, data, path)\" id=\"{{path}}-holder\"\n        class=\"p-col-{{control.gWidth}} p-md-{{mdWidth}} row-span-{{rowSpan}} {{control.class}} crud-form-control type-{{control.dataType}}\"\n        [class.error]=\"data._errors[control.field].length > 0\"\n        [class.not-show-in-box-holder]=\"control.showInBox === false\"\n        [class.show-in-box-holder]=\"control.showInBox === true\" [ngStyle]=\"control.style\">\n        <div class=\"label\" *ngIf=\"showLabel\">\n            <label *ngIf=\"control.label && !control.isHtmlLabel\" [pTooltip]=\"control.fullLabel\"\n                tooltipPosition=\"top\">{{control.label}}\n                <span *ngIf=\"control.required || control.showIconRequired\" class=\"star-required\">*</span>\n            </label>\n            <ng-container *ngIf=\"control.label && control.isHtmlLabel\">\n                <label [innerHTML]=\"control.label | safeHtml\" [pTooltip]=\"control.fullLabel\" tooltipPosition=\"top\">\n                </label>\n                <span *ngIf=\"control.required || control.showIconRequired\" class=\"star-required\">*</span>\n            </ng-container>\n            <span *ngIf=\"control.description\" class=\"control-description\">({{control.description}})</span>\n        </div>\n        <ng-container [ngSwitch]=\"control.controlType\">\n            <ng-container *ngSwitchCase=\"'label'\">\n                <ng-container [ngTemplateOutlet]=\"labelControl\"\n                    [ngTemplateOutletContext]=\"{control: control, data: data}\">\n                </ng-container>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'title'\">\n                <label *ngIf=\"!control.isHtml\" [for]=\"control.for\">{{control.text | translate}}</label>\n                <label *ngIf=\"control.isHtml\" [innerHTML]=\"control.text | safeHtml\"></label>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'text'\">\n                <div class=\"p-inputgroup\" *ngIf=\"control.suffFix\">\n                    <input [placeholder]=\"control.placeholder\"\n                        [required]=\"control.validators && control.validators.required\"\n                        [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText\n                        [type]=\"control.dataFormat\" [max]=\"control.max\" [min]=\"control.min\"\n                        [maxlength]=\"control.maxLength\" [(ngModel)]=\"data[control.field]\"\n                        (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                        (key.enter)=\"handleFieldValueChange(control, $event, eventType.ENTER, data, parentPath)\" />\n                    <span class=\"p-inputgroup-addon\">({{control.suffFix}})</span>\n                </div>\n                <input *ngIf=\"!control.suffFix\" [placeholder]=\"control.placeholder\"\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText [type]=\"control.dataFormat\"\n                    [max]=\"control.max\" [min]=\"control.min\" [maxlength]=\"control.maxLength\"\n                    [(ngModel)]=\"data[control.field]\"\n                    (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (key.enter)=\"handleFieldValueChange(control, $event, eventType.ENTER, data, parentPath)\" />\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'reference-text'\">\n                <reference-textbox [control]=\"control\" [value]=\"data[control.field]\" [dataSource]=\"control.dataSource\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"></reference-textbox>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'template'\">\n                <ng-container [ngTemplateOutlet]=\"control.template\"\n                    [ngTemplateOutletContext]=\"{$implicit: _rootNode, control: control, data: data, tablePath: tablePath, parentPath: parentPath, rowIndex: rowIndex, funcUpdateModel: updateModelFromExternal}\">\n                </ng-container>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'content'\">\n                <div class=\"control-content label\">\n                    <span [innerHTML]=\"data[control.field] ? (data[control.field] | safeHtml) : ''\">\n                    </span>\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'mask'\">\n                <tn-mask [prefix]=\"control.prefix\" [decimalPlaces]=\"control.decimalPlaces\" [suffix]=\"control.suffix\"\n                    [placeholder]=\"control.placeholder\" [disabled]=\"checkDisabled(data, control)\"\n                    [maskType]=\"control.maskType\" [autoFormat]=\"control.autoFormat\" [min]=\"control.min\"\n                    [max]=\"control.max\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </tn-mask>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'numberrange'\">\n                <tn-number-picker-range [decimalPlaces]=\"control.decimalPlaces\"\n                    [disabled]=\"checkDisabled(data, control)\" [maskType]=\"control.maskType\" [min]=\"control.min\"\n                    [max]=\"control.max\" [placeholder]=\"control.placeholder\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (blur)=\"handleFieldValueChange(control, $event, eventType.BLUR, data, parentPath)\">\n                </tn-number-picker-range>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'money'\">\n                <input currencyMask [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText type=\"tel\"\n                    [options]=\"{prefix: '', thousands: '.', decimal: ',',precision:control.dataFormat === 'money'?0:0 }\"\n                    [(ngModel)]=\"data[control.field]\"\n                    (ngModelChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\" />\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'phoneOrfax'\">\n                <input [placeholder]=\"control.dataFormat==='phone'?'(999) 999-9999':'999-999-9999'\"\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" type=\"tel\" pInputText\n                    [(ngModel)]=\"data[control.field]\"\n                    (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\" />\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'textarea'\">\n                <textarea pInputTextarea [rows]=\"control.rows ? control.rows : 5\"\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" [(ngModel)]=\"data[control.field]\"\n                    [placeholder]=\"control.placeholder\"\n                    (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"></textarea>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'editor'\">\n                <tn-tinymce *ngIf=\"!checkDisabled(data, control)\"\n                    [required]=\"control.validators && control.validators.required\" [mode]=\"control.mode\"\n                    [placeholder]=\"control.placeholder\" [height]=\"control.height ? control.height : 250\"\n                    [languageCode]=\"control.languageCode\"\n                    [disabled]=\"control.disabled || (control.disableCheck && control.disableCheck(model))\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </tn-tinymce>\n                <div *ngIf=\"checkDisabled(data, control)\" class=\"html-box\"\n                    [innerHTML]=\"data[control.field] ? (data[control.field] | safeHtml) : ''\">\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'datetime'\">\n                <datetime-picker [disabled]=\"checkDisabled(data, control)\" [control]=\"control\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </datetime-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'autocomplete'\">\n                <app-autocomplete-datasource [control]=\"control\"\n                    [suggestions]=\"data._source[control.field] || control.dataSource\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onValueChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </app-autocomplete-datasource>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'datetimerange'\">\n                <tn-datetime-picker-range [disabled]=\"control.disabled\" [control]=\"control\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </tn-datetime-picker-range>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'dropdown'\">\n                <dropdown [control]=\"control\" [dataSource]=\"getControlDataSource(control, data)\" [data]=\"data\"\n                    [(value)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleChangeDropdown(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onHideSmartEvent)=\"handleChangeDropdown(control, $event, eventType.HIDE, data, parentPath)\"\n                    (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\n                    (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\"\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\n                </dropdown>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'imageuploader'\">\n                <app-image-uploader [loadByEntityKey]=\"control.loadByEntityKey\" [entityKey]=\"control.entityKey\"\n                    [defaultNoImageUrl]=\"'/assets/images/no-image.jpg'\" [multiple]=\"control.multiple\"\n                    [disabled]=\"control.disabled\" [isAvatar]=\"control.isAvatar\" [(ngModel)]=\"data[control.field]\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\">\n                    <ng-template *ngIf=\"control.templateItems\" #items let-files>\n                        <ng-container *ngTemplateOutlet=\"control.templateItems; context: {\n                            $implicit: files\n                        }\"></ng-container>\n                    </ng-template>\n                    <ng-template *ngIf=\"control.templateItem\" #item let-file>\n                        <ng-container *ngTemplateOutlet=\"control.templateItem; context: {\n                            $implicit: file\n                        }\"></ng-container>\n                    </ng-template>\n                </app-image-uploader>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'fileManager'\">\n                <file-manager *ngIf=\"control.entityKey || data[control.entityKeyField] || control.rootFolderId\"\n                    [control]=\"control\" [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\n                    [entityKey]=\"control.entityKey ? control.entityKey : data[control.entityKeyField]\"\n                    [readonly]=\"control.disabled\" [layout]=\"control.layout\" [rootFolderId]=\"control.rootFolderId\"\n                    [maxFileSize]=\"control.maxFileSize\" [inTaiLieu]=\"control.inTaiLieu\"\n                    [inTaiLieuChung]=\"control.inTaiLieuChung\" [copyToFolderId]=\"control.copyToFolderId\"\n                    [filePickerSetting]=\"control.filePickerSetting\" [dataForm]=\"data\"\n                    [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\n                    [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\n                    [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\n                    [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\n                    [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\n                    [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\" [parentSetting]=\"setting\"\n                    [noFileMessage]=\"control.noFileMessage\"\n                    [(value)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onSelected)=\"control.onSelected($event)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\n                </file-manager>\n            </ng-container>\n            <span *ngSwitchCase=\"'fileUpload'\">\n                <file-upload [sharedFolderType]=\"control.sharedFolderType\" [maxFileSize]=\"control.maxFileSize\"\n                    [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\n                    [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\n                    [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\n                    [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\n                    [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\n                    [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\" [control]=\"control\"\n                    [showDeleteFile]=\"control.showDeleteFile\" [readonly]=\"control.readonly\" [accept]=\"control.accept\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onRemove)=\"handleFieldValueChange(control, $event, eventType.DELETED, data, parentPath)\">\n                </file-upload>\n            </span>\n            <span *ngSwitchCase=\"'serviceFileUpload'\">\n                <service-file-upload *ngIf=\"control.entityKey || data[control.entityKeyField] || control.rootFolderId\"\n                    [parentContext]=\"context\" [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\n                    [entityKey]=\"control.entityKey ? control.entityKey : data[control.entityKeyField]\"\n                    [control]=\"control\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onRemove)=\"handleFieldValueChange(control, $event, eventType.DELETED, data, parentPath)\">\n                </service-file-upload>\n            </span>\n            <ng-container *ngSwitchCase=\"'user-picker'\">\n                <user-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                    [readOnlyValues]=\"data[control.field + '_readOnly']\" [multiple]=\"control.multiple\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\n                </user-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'switch'\">\n                <p-inputSwitch [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\n                    (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </p-inputSwitch>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'checkbox'\">\n                <div [class]=\"control.class\" role=\"checkbox-alone\">\n                    <p-checkbox [disabled]=\"checkDisabled(data, control)\" [binary]=\"true\"\n                        [label]=\"control.isCustomLabel ? control.displayLabel : (!control.hiddenLabel ? control.label : null)\"\n                        [(ngModel)]=\"data[control.field]\"\n                        (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                    </p-checkbox>\n                    <!-- <tn-checkbox [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                        [(ngModel)]=\"data[control.field]\"\n                        (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"></tn-checkbox> -->\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'button'\">\n                <button type=\"button\" pButton [class]=\"control.btClass\" [icon]=\"control.icon\"\n                    [label]=\"control.buttonText | translate\" [ngStyle]=\"control.btStyle\" [pTooltip]=\"control.fullLabel\"\n                    tooltipPosition=\"top\" (click)=\"handleButtonClick(control, $event, parentPath)\"></button>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'container'\">\n                <div class=\"p-grid p-col-12\" style=\"margin: 0\" [class.not-show-in-box]=\"!control.showInBox\"\n                    [class.show-in-box]=\"control.showInBox\" [ngStyle]=\"control.boxStyle\">\n                    <ng-container *ngFor=\"let subControl of control.controls\">\n                        <ng-container *ngTemplateOutlet=\"customControl; context: {\n                            control: subControl,\n                            data: data[control.field],\n                            parentPath: path,\n                            rowIndex: rowIndex,\n                            path: path + '.' + subControl.field,\n                            showLabel: subControl.showLabel,\n                            mdWidth: subControl.mdWidth,\n                            rowSpan: subControl.rowSpan\n                        }\">\n                        </ng-container>\n                    </ng-container>\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'checkboxlist'\">\n                <check-box-list [control]=\"control\" [dataSource]=\"data._source[control.field] || control.dataSource\"\n                    [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onSelect)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\n                </check-box-list>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'radiobuttonlist'\">\n                <radio-button-list [control]=\"control\" [dataSource]=\"control.dataSource\"\n                    [disabled]=\"checkDisabled(data, control)\" [(value)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\"\n                    (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\">\n                </radio-button-list>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'colorPicker'\">\n                <tn-color-picker [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </tn-color-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'spanControl'\">\n                <span *ngIf=\"!control.ishtml\">{{data[control.field]}}</span>\n                <span *ngIf=\"control.ishtml\" [innerHTML]=\"data[control.field]\"></span>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'colorControl'\">\n                <span class=\"show-color-control\" [ngStyle]=\"{ backgroundColor: data[control.sourceField]}\"></span>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'address'\">\n                <address-picker [control]=\"control\" [showSubLabel]=\"control.showSubLabel\"\n                    [disabled]=\"checkDisabled(data, control)\" [(data)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onSelect)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\n                </address-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'autocomplete-picker'\">\n                <autocomplete-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                    [required]=\"control.required\" [readOnlyValues]=\"data[control.field + '_readOnly']\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\n                </autocomplete-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'cocautochuc'\">\n                <cocautochuc-picker [control]=\"control\" [parentOrgId]=\"control.parentOrgId\"\n                    [disabled]=\"checkDisabled(data, control)\" [parentOrgCode]=\"control.parentOrgCode\"\n                    [filter]=\"control.filter\" [multiple]=\"control.multiple\" [required]=\"control.required\"\n                    [isUsingId]=\"control.isUsingId\" [disabledParentItem]=\"control.disabledParentItem\"\n                    [rootParentId]=\"control.rootParentId\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </cocautochuc-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'cocautochuc-picker'\">\n                <cocautochuc-picker-list [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                    [required]=\"control.required\" [readOnlyValues]=\"data[control.field + '_readOnly']\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\n                </cocautochuc-picker-list>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'cocautochuc-picker-new'\">\n                <cocautochuc-picker-list-new [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                    [required]=\"control.required\" [readOnlyValues]=\"data[control.field + '_readOnly']\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\n                </cocautochuc-picker-list-new>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'vanban'\">\n                <vanban-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                    [required]=\"control.required\" [readOnly]=\"control.readOnly\" [loaiVanBan]=\"control.loaiVanBan\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </vanban-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'congviec'\">\n                <div>\n                    <congviec-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                        [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\n                        (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                        (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                    </congviec-picker>\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'percent'\">\n                <div>\n                    <tn-mask [suffix]=\"'%'\" [placeholder]=\"control.placeholder\" [maskType]=\"'int'\"\n                        [autoFormat]=\"control.autoFormat\" [min]=\"0\" [max]=\"100\"\n                        [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\n                        (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                        (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                    </tn-mask>\n                    <p-slider [step]=\"1\" [min]=\"0\" [max]=\"100\" [disabled]=\"checkDisabled(data, control)\"\n                        [(ngModel)]=\"data[control.field]\"\n                        (onSlideEnd)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                    </p-slider>\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'chips'\">\n                <p-chips [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\n                    (onAdd)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onRemove)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"></p-chips>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'entity-picker'\">\n                <entity-picker [control]=\"control\" [children]=\"children\" [disabled]=\"checkDisabled(data, control)\"\n                    [required]=\"control.required\" [readOnly]=\"control.readOnly\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </entity-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'table'\">\n                <div [class]=\"control.class\">\n                    <tn-custom-scrollbar class=\"--has-border\" [showScrollHorizontal]=\"true\">\n                        <p-table class=\"new-table scr-table table-control\" [value]=\"data[control.field]\"\n                            [columns]=\"control.headerTemplate\" [responsive]=\"true\" [scrollable]=\"false\"\n                            [rowTrackBy]=\"trackByFuncId\"\n                            (onRowReorder)=\"handleRowOrdered(control, $event, eventType.ROW_REORDER, data, parentPath)\">\n                            <ng-template pTemplate=\"colgroup\">\n                                <colgroup>\n                                    <col *ngIf=\"control.showNumber\" style=\"width: 40px\" />\n                                    <ng-container *ngFor=\"let subControl of control.rowTemplate\">\n                                        <col *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\n                                            [style.width]=\"subControl.width\" />\n                                    </ng-container>\n                                    <col *ngIf=\"control.enableReorderRow\" style=\"width: 30px\" />\n                                    <col *ngIf=\"control.showFunction\" [style.width]=\"control.widthFunctionColumn\" />\n                                </colgroup>\n                            </ng-template>\n                            <ng-template *ngIf=\"getComponentByType(_prefixCustomHeader + control.field)\"\n                                pTemplate=\"header\" let-columns>\n                                <ng-container\n                                    *ngTemplateOutlet=\"getComponentByType(_prefixCustomHeader + control.field), context: {$implicit: control.headerTemplate, crudForm: this, containerSticky: containerSticky}\">\n                                </ng-container>\n                            </ng-template>\n                            <ng-template *ngIf=\"!getComponentByType(_prefixCustomHeader + control.field)\"\n                                pTemplate=\"header\" let-rowData let-columns>\n                                <tr>\n                                    <th *ngIf=\"control.showNumber\" class=\"th-sticky stt\">\n                                        {{ 'TT' |translate}}\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </th>\n                                    <ng-container *ngFor=\"let subControl of control.rowTemplate\">\n                                        <th *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\n                                            [width]=\"subControl.width\"\n                                            [pTooltip]=\"subControl.fullLabel || subControl.label\" tooltipPosition=\"top\"\n                                            style=\"text-align: center;\">\n                                            {{subControl.label}}\n                                            <span *ngIf=\"subControl.required\" class=\"star-required\">*</span>\n                                            <span *ngIf=\"subControl.description\"\n                                                class=\"subControl-description\">({{subControl.description}})</span>\n                                            <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                        </th>\n                                    </ng-container>\n                                    <th *ngIf=\"control.enableReorderRow\">\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </th>\n                                    <th *ngIf=\"control.showFunction\" class=\"table-function column-function\">\n                                        <div class=\"cell-header-function\"><span>Ch\u1EE9c n\u0103ng</span></div>\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </th>\n                                </tr>\n                            </ng-template>\n                            <ng-template pTemplate=\"body\" let-rowData let-ri=\"rowIndex\">\n                                <tr [pReorderableRow]=\"ri\" [class]=\"rowData.class\"\n                                    (click)=\"handleRowClick(rowData, control)\">\n                                    <td *ngIf=\"control.showNumber\" class=\"stt th-sticky\"\n                                        style=\"text-align: center; vertical-align: inherit\">\n                                        <span>\n                                            {{ri + 1}}\n                                        </span>\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </td>\n                                    <ng-container *ngFor=\"let subControl of control.rowTemplate; let i = index\">\n                                        <td *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\n                                            [class.control-inside]=\"true\" [class]=\"subControl.class\"\n                                            [ngStyle]=\"{'text-align': getTextAlign(subControl.textAlign), 'vertical-align': 'inherit'}\">\n                                            <span class=\"p-column-title\">{{subControl.label}}</span>\n                                            <ng-template [ngIf]=\"getControlType(subControl) != 'column'\">\n                                                <ng-container *ngTemplateOutlet=\"customControl; context: {\n                                                    control: subControl,\n                                                    data: rowData,\n                                                    index: ri,\n                                                    tablePath: path,\n                                                    parentPath: path + '[' + ri + ']',\n                                                    path: path + '[' + ri + '].' + subControl.field,\n                                                    showLabel: false,\n                                                    mdWidth: 12,\n                                                    rowSpan: 1\n                                                }\">\n                                                </ng-container>\n                                            </ng-template>\n                                            <ng-template [ngIf]=\"getControlType(subControl) == 'column'\">\n                                                <span>{{_modelData[control.field][ri][subControl.field]}}</span>\n                                            </ng-template>\n                                            <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                        </td>\n                                    </ng-container>\n                                    <td *ngIf=\"control.enableReorderRow\" class=\"no-padding center v-center\">\n                                        <i class=\"fas fa-arrows-alt\" style=\"cursor:pointer; padding: 8px; color: #555;\"\n                                            pReorderableRowHandle></i>\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </td>\n                                    <td *ngIf=\"control.showFunction\" style=\"text-align: center\"\n                                        class=\"column-function text-center\">\n                                        <div *ngIf=\"!control.rowButtonTemplate\"\n                                            class=\"p-toolbar-group-center button-group\">\n                                            <button *ngIf=\"control.showSave\" [disabled]=\"rowData._disableSave\"\n                                                type=\"button\" pButton class=\"p-button-text p-button-rounded\"\n                                                icon=\"pi pi-save\" [pTooltip]=\"'L\u01B0u' | translate\" tooltipPosition=\"top\"\n                                                (click)=\"saveRow(ri, control, path)\"></button>\n                                            <button *ngIf=\"control.showEdit\" [disabled]=\"rowData._disableEdit\"\n                                                type=\"button\" pButton class=\"p-button-text p-button-rounded\"\n                                                icon=\"pi pi-pencil\" [pTooltip]=\"'S\u1EEDa' | translate\" tooltipPosition=\"top\"\n                                                (click)=\"editRow(ri, control, path)\"></button>\n                                            <button *ngIf=\"control.showDelete\" [disabled]=\"rowData._disableDelete\"\n                                                type=\"button\" pButton\n                                                class=\"p-button-text p-button-danger p-button-rounded\"\n                                                icon=\"pi pi-trash\" [pTooltip]=\"'X\u00F3a' | translate\" tooltipPosition=\"top\"\n                                                (click)=\"deleteRow(ri, control, path)\"></button>\n                                            <button *ngIf=\"control.rowButtons\" type=\"button\" pButton\n                                                icon=\"pi pi-ellipsis-v\"\n                                                class=\"link-or-action p-button-text p-button-rounded\"\n                                                pTooltip=\"Ch\u1EE9c n\u0103ng kh\u00E1c\" tooltipPosition=\"top\"\n                                                (click)=\"showContextMenu($event, rowData, control)\"></button>\n                                        </div>\n                                        <div *ngIf=\"control.rowButtonTemplate\"\n                                            class=\"p-toolbar-group-center button-group\">\n                                            <ng-container\n                                                *ngTemplateOutlet=\"control.rowButtonTemplate; context: {rowData: _modelData[control.field][ri], rowIndex: ri, path: path, control: control}\">\n                                            </ng-container>\n                                        </div>\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </td>\n                                </tr>\n                            </ng-template>\n                            <ng-template *ngIf=\"control.summaryTemplate\" pTemplate=\"summary\" let-rowData>\n                                <ng-container *ngTemplateOutlet=\"control.summaryTemplate; context: {rowData: rowData}\">\n                                </ng-container>\n                            </ng-template>\n                        </p-table>\n                    </tn-custom-scrollbar>\n                    <div *ngIf=\"control.showFooter\" class=\"--table-schema-footer\">\n                        <button *ngIf=\"control.showAdd\" type=\"button\" pButton style=\"width:auto\" label=\"Th\u00EAm m\u1EDBi\"\n                            icon=\"pi pi-plus\" class=\"p-button-text\" (click)=\"addNewRow(control, path)\"></button>\n                        <span *ngIf=\"control.showDialog\" style=\"font-weight: normal;\">\n                            <p-checkbox label=\"M\u1EDF dialog\" [binary]=\"true\" [(ngModel)]=\"control.showEdit\">\n                            </p-checkbox>\n                        </span>\n                        <button *ngIf=\"control.enableAddMulti\" type=\"button\" pButton\n                            style=\"width:auto; margin-left:10px;\" label=\"Th\u00EAm nhi\u1EC1u\" icon=\"pi pi-clone\"\n                            class=\"p-button-text\" (click)=\"addMultiRow(control, 5, path)\"></button>\n                        <button *ngFor=\"let bt of control.footerButtons\" type=\"button\" pButton [class]=\"bt.class\"\n                            [icon]=\"bt.icon\" [label]=\"bt.label | translate\" style=\"width:auto; margin-left:10px;\"\n                            (click)=\"messageRow( -1, control, path)\"></button>\n                    </div>\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchDefault>\n                <ng-container *ngIf=\"control.template\">\n                    <ng-container [ngTemplateOutlet]=\"control.template\" [ngTemplateOutletContext]=\"{\n                        crudForm: this, data: data, index: rowIndex, parentPath: parentPath, control: control, changeFunc: handleFieldValueChange\n                    }\">\n                    </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"!control.template\" [ngTemplateOutlet]=\"getComponentByType(control.field)\"\n                    [ngTemplateOutletContext]=\"{\n                        crudForm: this, data: data, index: rowIndex, parentPath: parentPath, control: control, changeFunc: handleFieldValueChange\n                    }\">\n                </ng-container>\n            </ng-container>\n            <ng-container *ngTemplateOutlet=\"validation; context: {control: control, data: data}\">\n            </ng-container>\n            <div *ngIf=\"control.message\" class=\"control-message\">\n                <span [class]=\"control.messageClass\">{{control.message}}</span>\n            </div>\n        </ng-container>\n    </div>\n</ng-template>\n<ng-template #validation let-control=\"control\" let-data=\"data\">\n    <ng-container *ngIf=\"data._errors[control.field].length > 0\">\n        <div class=\"error-container\">\n            <ng-container *ngFor=\"let error of data._errors[control.field]\">\n                <div class=\"error-item\" *ngIf=\"error\">\n                    <ng-container [ngTemplateOutlet]=\"errorMessage\" [ngTemplateOutletContext]=\"{content: error}\">\n                    </ng-container>\n                </div>\n            </ng-container>\n        </div>\n    </ng-container>\n</ng-template>\n<ng-template #errorMessage let-content=\"content\">\n    <div class=\"error-content\">\n        <i class=\"pi pi-ban\"></i>\n        <span> {{content}}</span>\n    </div>\n</ng-template>\n<ng-template #labelControl let-control=\"control\">\n    <ng-container>\n        <label [class]=\"getLabelClass(control)\" *ngIf=\"!control.isHtml\" [attr.label-index]=\"control.indexLabel\"\n            [pTooltip]=\"control.title\" tooltipPosition=\"top\" tooltipStyleClass=\"wrap\" [escape]=\"false\"\n            [for]=\"control.for\">{{control.text | translate}}</label>\n        <label [class]=\"getLabelClass(control)\" *ngIf=\"control.isHtml\" [innerHTML]=\"control.text | safeHtml\"\n            [attr.label-index]=\"control.indexLabel\"></label>\n    </ng-container>\n</ng-template>\n<ng-template #containerSticky>\n    <span class=\"fix-sticky top\"></span>\n    <span class=\"fix-sticky right\"></span>\n    <span class=\"fix-sticky left\"></span>\n</ng-template>\n<!-- <ng-template #templateCongViecForm let-control=\"control\">\n    <base-congviec-form [control]=\"control\" [parentSetting]=\"congViecSetting\" [tenCongViec]=\"control.data.tenCongViec\">\n    </base-congviec-form>\n</ng-template> -->\n<tn-dialog *ngIf=\"tableFormDialogModel.showEditForm\" #dialog [styleClass]=\"'address-form'\"\n    [header]=\"tableFormDialogModel.header | translate\" [popupSize]=\"tableFormDialogModel.popupSize\"\n    (onHide)=\"tableFormDialogModel.showEditForm = false\">\n    <table-detail-form #formBase [parentSetting]=\"setting\" [schema]=\"tableFormSchema\" [data]=\"tableFormDialogModel.data\"\n        (onSaved)=\"handleSavedTableRow($event)\" (onCancel)=\"tableFormDialogModel.showEditForm = false\">\n    </table-detail-form>\n</tn-dialog>",
+                template: "<div [class]=\"_styleClass\">\n    <form #formElement autocomplete=\"off\" autocorrect=\"off\" spellcheck=\"false\"\n        [class]=\"'p-grid form-group crud-form' + (formClass ? ' ' + formClass : '')\"\n        (keydown.shift.tab)=\"preventBlur($event)\">\n        <div class=\"p-grid p-col-12\" [class.grid]=\"useGridTemplate\" style=\"margin: 0\">\n            <ng-container *ngFor=\"let control of setting.schema\">\n                <ng-container *ngTemplateOutlet=\"customControl; context: {\n                    control: control, data: _modelData, parentPath: '', path: control.field, showLabel: control.showLabel,\n                    mdWidth: control.mdWidth, rowSpan: control.rowSpan\n                }\">\n                </ng-container>\n            </ng-container>\n        </div>\n    </form>\n</div>\n<p-contextMenu #contextMenu [appendTo]=\"'body'\" [model]=\"buttonContexts\">\n</p-contextMenu>\n<ng-template #customControl let-data=\"data\" let-control=\"control\" let-showLabel=\"showLabel\" let-mdWidth=\"mdWidth\"\n    let-rowSpan=\"rowSpan\" let-rowIndex=\"index\" let-path=\"path\" let-parentPath=\"parentPath\" let-tablePath=\"tablePath\">\n    <div *ngIf=\"!checkHidden(control, data, path)\" id=\"{{path}}-holder\"\n        class=\"p-col-{{control.gWidth}} p-md-{{mdWidth}} row-span-{{rowSpan}} {{control.class}} crud-form-control type-{{control.dataType}}\"\n        [class.error]=\"data._errors[control.field].length > 0\"\n        [class.not-show-in-box-holder]=\"control.showInBox === false\"\n        [class.show-in-box-holder]=\"control.showInBox === true\" [ngStyle]=\"control.style\">\n        <div class=\"label\" *ngIf=\"showLabel\">\n            <label *ngIf=\"control.label && !control.isHtmlLabel\" [pTooltip]=\"control.fullLabel\"\n                tooltipPosition=\"top\">{{control.label}}\n                <span *ngIf=\"control.required || control.showIconRequired\" class=\"star-required\">*</span>\n            </label>\n            <ng-container *ngIf=\"control.label && control.isHtmlLabel\">\n                <label [innerHTML]=\"control.label | safeHtml\" [pTooltip]=\"control.fullLabel\" tooltipPosition=\"top\">\n                </label>\n                <span *ngIf=\"control.required || control.showIconRequired\" class=\"star-required\">*</span>\n            </ng-container>\n            <span *ngIf=\"control.description\" class=\"control-description\">({{control.description}})</span>\n        </div>\n        <ng-container [ngSwitch]=\"control.controlType\">\n            <ng-container *ngSwitchCase=\"'label'\">\n                <ng-container [ngTemplateOutlet]=\"labelControl\"\n                    [ngTemplateOutletContext]=\"{control: control, data: data}\">\n                </ng-container>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'title'\">\n                <label *ngIf=\"!control.isHtml\" [for]=\"control.for\">{{control.text | translate}}</label>\n                <label *ngIf=\"control.isHtml\" [innerHTML]=\"control.text | safeHtml\"></label>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'text'\">\n                <div class=\"p-inputgroup\" *ngIf=\"control.suffFix\">\n                    <input [placeholder]=\"control.placeholder\"\n                        [required]=\"control.validators && control.validators.required\"\n                        [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText\n                        [type]=\"control.dataFormat\" [max]=\"control.max\" [min]=\"control.min\"\n                        [maxlength]=\"control.maxLength\" [(ngModel)]=\"data[control.field]\"\n                        (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                        (key.enter)=\"handleFieldValueChange(control, $event, eventType.ENTER, data, parentPath)\" />\n                    <span class=\"p-inputgroup-addon\">({{control.suffFix}})</span>\n                </div>\n                <input *ngIf=\"!control.suffFix\" [placeholder]=\"control.placeholder\"\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText [type]=\"control.dataFormat\"\n                    [max]=\"control.max\" [min]=\"control.min\" [maxlength]=\"control.maxLength\"\n                    [(ngModel)]=\"data[control.field]\"\n                    (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (key.enter)=\"handleFieldValueChange(control, $event, eventType.ENTER, data, parentPath)\" />\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'htmlPreview'\">\n                <html-preview [control]=\"control\" [(content)]=\"data[control.field]\">\n                </html-preview>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'reference-text'\">\n                <reference-textbox [control]=\"control\" [value]=\"data[control.field]\" [dataSource]=\"control.dataSource\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"></reference-textbox>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'template'\">\n                <ng-container [ngTemplateOutlet]=\"control.template\"\n                    [ngTemplateOutletContext]=\"{$implicit: _rootNode, control: control, data: data, tablePath: tablePath, parentPath: parentPath, rowIndex: rowIndex, funcUpdateModel: updateModelFromExternal}\">\n                </ng-container>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'content'\">\n                <div class=\"control-content label\">\n                    <span [innerHTML]=\"data[control.field] ? (data[control.field] | safeHtml) : ''\">\n                    </span>\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'mask'\">\n                <tn-mask [prefix]=\"control.prefix\" [decimalPlaces]=\"control.decimalPlaces\" [suffix]=\"control.suffix\"\n                    [placeholder]=\"control.placeholder\" [disabled]=\"checkDisabled(data, control)\"\n                    [maskType]=\"control.maskType\" [autoFormat]=\"control.autoFormat\" [min]=\"control.min\"\n                    [max]=\"control.max\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </tn-mask>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'numberrange'\">\n                <tn-number-picker-range [decimalPlaces]=\"control.decimalPlaces\"\n                    [disabled]=\"checkDisabled(data, control)\" [maskType]=\"control.maskType\" [min]=\"control.min\"\n                    [max]=\"control.max\" [placeholder]=\"control.placeholder\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (blur)=\"handleFieldValueChange(control, $event, eventType.BLUR, data, parentPath)\">\n                </tn-number-picker-range>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'money'\">\n                <input currencyMask [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText type=\"tel\"\n                    [options]=\"{prefix: '', thousands: '.', decimal: ',',precision:control.dataFormat === 'money'?0:0 }\"\n                    [(ngModel)]=\"data[control.field]\"\n                    (ngModelChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\" />\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'phoneOrfax'\">\n                <input [placeholder]=\"control.dataFormat==='phone'?'(999) 999-9999':'999-999-9999'\"\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" type=\"tel\" pInputText\n                    [(ngModel)]=\"data[control.field]\"\n                    (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\" />\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'textarea'\">\n                <textarea pInputTextarea [rows]=\"control.rows ? control.rows : 5\"\n                    [attr.disabled]=\"checkDisabled(data, control) ? true : null\" [(ngModel)]=\"data[control.field]\"\n                    [placeholder]=\"control.placeholder\"\n                    (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"></textarea>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'editor'\">\n                <tn-tinymce *ngIf=\"!checkDisabled(data, control)\"\n                    [required]=\"control.validators && control.validators.required\" [mode]=\"control.mode\"\n                    [placeholder]=\"control.placeholder\" [height]=\"control.height ? control.height : 250\"\n                    [languageCode]=\"control.languageCode\"\n                    [disabled]=\"control.disabled || (control.disableCheck && control.disableCheck(model))\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onKeyUp)=\"handleKeyUp(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </tn-tinymce>\n                <div *ngIf=\"checkDisabled(data, control)\" class=\"html-box\"\n                    [innerHTML]=\"data[control.field] ? (data[control.field] | safeHtml) : ''\">\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'datetime'\">\n                <datetime-picker [disabled]=\"checkDisabled(data, control)\" [control]=\"control\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </datetime-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'autocomplete'\">\n                <app-autocomplete-datasource [control]=\"control\"\n                    [suggestions]=\"data._source[control.field] || control.dataSource\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onValueChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </app-autocomplete-datasource>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'datetimerange'\">\n                <tn-datetime-picker-range [disabled]=\"control.disabled\" [control]=\"control\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </tn-datetime-picker-range>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'dropdown'\">\n                <dropdown [control]=\"control\" [dataSource]=\"getControlDataSource(control, data)\" [data]=\"data\"\n                    [(value)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleChangeDropdown(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onHideSmartEvent)=\"handleChangeDropdown(control, $event, eventType.HIDE, data, parentPath)\"\n                    (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\n                    (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\"\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\n                </dropdown>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'imageuploader'\">\n                <app-image-uploader [loadByEntityKey]=\"control.loadByEntityKey\" [entityKey]=\"control.entityKey\"\n                    [defaultNoImageUrl]=\"'/assets/images/no-image.jpg'\" [multiple]=\"control.multiple\"\n                    [disabled]=\"control.disabled\" [isAvatar]=\"control.isAvatar\" [(ngModel)]=\"data[control.field]\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\">\n                    <ng-template *ngIf=\"control.templateItems\" #items let-files>\n                        <ng-container *ngTemplateOutlet=\"control.templateItems; context: {\n                            $implicit: files\n                        }\"></ng-container>\n                    </ng-template>\n                    <ng-template *ngIf=\"control.templateItem\" #item let-file>\n                        <ng-container *ngTemplateOutlet=\"control.templateItem; context: {\n                            $implicit: file\n                        }\"></ng-container>\n                    </ng-template>\n                </app-image-uploader>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'fileManager'\">\n                <file-manager *ngIf=\"control.entityKey || data[control.entityKeyField] || control.rootFolderId\"\n                    [control]=\"control\" [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\n                    [entityKey]=\"control.entityKey ? control.entityKey : data[control.entityKeyField]\"\n                    [readonly]=\"control.disabled\" [layout]=\"control.layout\" [rootFolderId]=\"control.rootFolderId\"\n                    [maxFileSize]=\"control.maxFileSize\" [inTaiLieu]=\"control.inTaiLieu\"\n                    [inTaiLieuChung]=\"control.inTaiLieuChung\" [copyToFolderId]=\"control.copyToFolderId\"\n                    [filePickerSetting]=\"control.filePickerSetting\" [dataForm]=\"data\"\n                    [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\n                    [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\n                    [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\n                    [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\n                    [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\n                    [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\" [parentSetting]=\"setting\"\n                    [noFileMessage]=\"control.noFileMessage\"\n                    [(value)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onSelected)=\"control.onSelected($event)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\n                </file-manager>\n            </ng-container>\n            <span *ngSwitchCase=\"'fileUpload'\">\n                <file-upload [sharedFolderType]=\"control.sharedFolderType\" [maxFileSize]=\"control.maxFileSize\"\n                    [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\n                    [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\n                    [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\n                    [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\n                    [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\n                    [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\" [control]=\"control\"\n                    [showDeleteFile]=\"control.showDeleteFile\" [readonly]=\"control.readonly\" [accept]=\"control.accept\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onRemove)=\"handleFieldValueChange(control, $event, eventType.DELETED, data, parentPath)\">\n                </file-upload>\n            </span>\n            <span *ngSwitchCase=\"'serviceFileUpload'\">\n                <service-file-upload *ngIf=\"control.entityKey || data[control.entityKeyField] || control.rootFolderId\"\n                    [parentContext]=\"context\" [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\n                    [entityKey]=\"control.entityKey ? control.entityKey : data[control.entityKeyField]\"\n                    [control]=\"control\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onRemove)=\"handleFieldValueChange(control, $event, eventType.DELETED, data, parentPath)\">\n                </service-file-upload>\n            </span>\n            <ng-container *ngSwitchCase=\"'user-picker'\">\n                <user-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                    [readOnlyValues]=\"data[control.field + '_readOnly']\" [multiple]=\"control.multiple\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\n                </user-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'switch'\">\n                <p-inputSwitch [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\n                    (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </p-inputSwitch>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'checkbox'\">\n                <div [class]=\"control.class\" role=\"checkbox-alone\">\n                    <p-checkbox [disabled]=\"checkDisabled(data, control)\" [binary]=\"true\"\n                        [label]=\"control.isCustomLabel ? control.displayLabel : (!control.hiddenLabel ? control.label : null)\"\n                        [(ngModel)]=\"data[control.field]\"\n                        (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                    </p-checkbox>\n                    <!-- <tn-checkbox [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                        [(ngModel)]=\"data[control.field]\"\n                        (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"></tn-checkbox> -->\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'button'\">\n                <button type=\"button\" pButton [class]=\"control.btClass\" [icon]=\"control.icon\"\n                    [label]=\"control.buttonText | translate\" [ngStyle]=\"control.btStyle\" [pTooltip]=\"control.fullLabel\"\n                    tooltipPosition=\"top\" (click)=\"handleButtonClick(control, $event, parentPath)\"></button>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'container'\">\n                <div class=\"p-grid p-col-12\" style=\"margin: 0\" [class.not-show-in-box]=\"!control.showInBox\"\n                    [class.show-in-box]=\"control.showInBox\" [ngStyle]=\"control.boxStyle\">\n                    <ng-container *ngFor=\"let subControl of control.controls\">\n                        <ng-container *ngTemplateOutlet=\"customControl; context: {\n                            control: subControl,\n                            data: data[control.field],\n                            parentPath: path,\n                            rowIndex: rowIndex,\n                            path: path + '.' + subControl.field,\n                            showLabel: subControl.showLabel,\n                            mdWidth: subControl.mdWidth,\n                            rowSpan: subControl.rowSpan\n                        }\">\n                        </ng-container>\n                    </ng-container>\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'checkboxlist'\">\n                <check-box-list [control]=\"control\" [dataSource]=\"data._source[control.field] || control.dataSource\"\n                    [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onSelect)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\n                </check-box-list>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'radiobuttonlist'\">\n                <radio-button-list [control]=\"control\" [dataSource]=\"control.dataSource\"\n                    [disabled]=\"checkDisabled(data, control)\" [(value)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\"\n                    (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\">\n                </radio-button-list>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'colorPicker'\">\n                <tn-color-picker [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </tn-color-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'spanControl'\">\n                <span *ngIf=\"!control.ishtml\">{{data[control.field]}}</span>\n                <span *ngIf=\"control.ishtml\" [innerHTML]=\"data[control.field]\"></span>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'colorControl'\">\n                <span class=\"show-color-control\" [ngStyle]=\"{ backgroundColor: data[control.sourceField]}\"></span>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'address'\">\n                <address-picker [control]=\"control\" [showSubLabel]=\"control.showSubLabel\"\n                    [disabled]=\"checkDisabled(data, control)\" [(data)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onSelect)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleControlReadyEvent(control, parentPath)\">\n                </address-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'autocomplete-picker'\">\n                <autocomplete-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                    [required]=\"control.required\" [readOnlyValues]=\"data[control.field + '_readOnly']\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\n                </autocomplete-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'cocautochuc'\">\n                <cocautochuc-picker [control]=\"control\" [parentOrgId]=\"control.parentOrgId\"\n                    [disabled]=\"checkDisabled(data, control)\" [parentOrgCode]=\"control.parentOrgCode\"\n                    [filter]=\"control.filter\" [multiple]=\"control.multiple\" [required]=\"control.required\"\n                    [isUsingId]=\"control.isUsingId\" [disabledParentItem]=\"control.disabledParentItem\"\n                    [rootParentId]=\"control.rootParentId\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </cocautochuc-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'cocautochuc-picker'\">\n                <cocautochuc-picker-list [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                    [required]=\"control.required\" [readOnlyValues]=\"data[control.field + '_readOnly']\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\n                </cocautochuc-picker-list>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'cocautochuc-picker-new'\">\n                <cocautochuc-picker-list-new [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                    [required]=\"control.required\" [readOnlyValues]=\"data[control.field + '_readOnly']\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onReady)=\"handleReadyControlPicker(control, parentPath)\">\n                </cocautochuc-picker-list-new>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'vanban'\">\n                <vanban-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                    [required]=\"control.required\" [readOnly]=\"control.readOnly\" [loaiVanBan]=\"control.loaiVanBan\"\n                    [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </vanban-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'congviec'\">\n                <div>\n                    <congviec-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\n                        [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\n                        (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                        (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                    </congviec-picker>\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'percent'\">\n                <div>\n                    <tn-mask [suffix]=\"'%'\" [placeholder]=\"control.placeholder\" [maskType]=\"'int'\"\n                        [autoFormat]=\"control.autoFormat\" [min]=\"0\" [max]=\"100\"\n                        [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\n                        (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                        (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                    </tn-mask>\n                    <p-slider [step]=\"1\" [min]=\"0\" [max]=\"100\" [disabled]=\"checkDisabled(data, control)\"\n                        [(ngModel)]=\"data[control.field]\"\n                        (onSlideEnd)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                    </p-slider>\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'chips'\">\n                <p-chips [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\n                    (onAdd)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\n                    (onRemove)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"></p-chips>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'entity-picker'\">\n                <entity-picker [control]=\"control\" [children]=\"children\" [disabled]=\"checkDisabled(data, control)\"\n                    [required]=\"control.required\" [readOnly]=\"control.readOnly\" [(ngModel)]=\"data[control.field]\"\n                    (onInit)=\"handleLoadedControl($event, control, parentPath)\"\n                    (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\n                </entity-picker>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'table'\">\n                <div [class]=\"control.class\">\n                    <tn-custom-scrollbar class=\"--has-border\" [showScrollHorizontal]=\"true\">\n                        <p-table class=\"new-table scr-table table-control\" [value]=\"data[control.field]\"\n                            [columns]=\"control.headerTemplate\" [responsive]=\"true\" [scrollable]=\"false\"\n                            [rowTrackBy]=\"trackByFuncId\"\n                            (onRowReorder)=\"handleRowOrdered(control, $event, eventType.ROW_REORDER, data, parentPath)\">\n                            <ng-template pTemplate=\"colgroup\">\n                                <colgroup>\n                                    <col *ngIf=\"control.showNumber\" style=\"width: 40px\" />\n                                    <ng-container *ngFor=\"let subControl of control.rowTemplate\">\n                                        <col *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\n                                            [style.width]=\"subControl.width\" />\n                                    </ng-container>\n                                    <col *ngIf=\"control.enableReorderRow\" style=\"width: 30px\" />\n                                    <col *ngIf=\"control.showFunction\" [style.width]=\"control.widthFunctionColumn\" />\n                                </colgroup>\n                            </ng-template>\n                            <ng-template *ngIf=\"getComponentByType(_prefixCustomHeader + control.field)\"\n                                pTemplate=\"header\" let-columns>\n                                <ng-container\n                                    *ngTemplateOutlet=\"getComponentByType(_prefixCustomHeader + control.field), context: {$implicit: control.headerTemplate, crudForm: this, containerSticky: containerSticky}\">\n                                </ng-container>\n                            </ng-template>\n                            <ng-template *ngIf=\"!getComponentByType(_prefixCustomHeader + control.field)\"\n                                pTemplate=\"header\" let-rowData let-columns>\n                                <tr>\n                                    <th *ngIf=\"control.showNumber\" class=\"th-sticky stt\">\n                                        {{ 'TT' |translate}}\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </th>\n                                    <ng-container *ngFor=\"let subControl of control.rowTemplate\">\n                                        <th *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\n                                            [width]=\"subControl.width\"\n                                            [pTooltip]=\"subControl.fullLabel || subControl.label\" tooltipPosition=\"top\"\n                                            style=\"text-align: center;\">\n                                            {{subControl.label}}\n                                            <span *ngIf=\"subControl.required\" class=\"star-required\">*</span>\n                                            <span *ngIf=\"subControl.description\"\n                                                class=\"subControl-description\">({{subControl.description}})</span>\n                                            <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                        </th>\n                                    </ng-container>\n                                    <th *ngIf=\"control.enableReorderRow\">\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </th>\n                                    <th *ngIf=\"control.showFunction\" class=\"table-function column-function\">\n                                        <div class=\"cell-header-function\"><span>Ch\u1EE9c n\u0103ng</span></div>\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </th>\n                                </tr>\n                            </ng-template>\n                            <ng-template pTemplate=\"body\" let-rowData let-ri=\"rowIndex\">\n                                <tr [pReorderableRow]=\"ri\" [class]=\"rowData.class\"\n                                    (click)=\"handleRowClick(rowData, control)\">\n                                    <td *ngIf=\"control.showNumber\" class=\"stt th-sticky\"\n                                        style=\"text-align: center; vertical-align: inherit\">\n                                        <span>\n                                            {{ri + 1}}\n                                        </span>\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </td>\n                                    <ng-container *ngFor=\"let subControl of control.rowTemplate; let i = index\">\n                                        <td *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\n                                            [class.control-inside]=\"true\" [class]=\"subControl.class\"\n                                            [ngStyle]=\"{'text-align': getTextAlign(subControl.textAlign), 'vertical-align': 'inherit'}\">\n                                            <span class=\"p-column-title\">{{subControl.label}}</span>\n                                            <ng-template [ngIf]=\"getControlType(subControl) != 'column'\">\n                                                <ng-container *ngTemplateOutlet=\"customControl; context: {\n                                                    control: subControl,\n                                                    data: rowData,\n                                                    index: ri,\n                                                    tablePath: path,\n                                                    parentPath: path + '[' + ri + ']',\n                                                    path: path + '[' + ri + '].' + subControl.field,\n                                                    showLabel: false,\n                                                    mdWidth: 12,\n                                                    rowSpan: 1\n                                                }\">\n                                                </ng-container>\n                                            </ng-template>\n                                            <ng-template [ngIf]=\"getControlType(subControl) == 'column'\">\n                                                <span>{{_modelData[control.field][ri][subControl.field]}}</span>\n                                            </ng-template>\n                                            <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                        </td>\n                                    </ng-container>\n                                    <td *ngIf=\"control.enableReorderRow\" class=\"no-padding center v-center\">\n                                        <i class=\"fas fa-arrows-alt\" style=\"cursor:pointer; padding: 8px; color: #555;\"\n                                            pReorderableRowHandle></i>\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </td>\n                                    <td *ngIf=\"control.showFunction\" style=\"text-align: center\"\n                                        class=\"column-function text-center\">\n                                        <div *ngIf=\"!control.rowButtonTemplate\"\n                                            class=\"p-toolbar-group-center button-group\">\n                                            <button *ngIf=\"control.showSave\" [disabled]=\"rowData._disableSave\"\n                                                type=\"button\" pButton class=\"p-button-text p-button-rounded\"\n                                                icon=\"pi pi-save\" [pTooltip]=\"'L\u01B0u' | translate\" tooltipPosition=\"top\"\n                                                (click)=\"saveRow(ri, control, path)\"></button>\n                                            <button *ngIf=\"control.showEdit\" [disabled]=\"rowData._disableEdit\"\n                                                type=\"button\" pButton class=\"p-button-text p-button-rounded\"\n                                                icon=\"pi pi-pencil\" [pTooltip]=\"'S\u1EEDa' | translate\" tooltipPosition=\"top\"\n                                                (click)=\"editRow(ri, control, path)\"></button>\n                                            <button *ngIf=\"control.showDelete\" [disabled]=\"rowData._disableDelete\"\n                                                type=\"button\" pButton\n                                                class=\"p-button-text p-button-danger p-button-rounded\"\n                                                icon=\"pi pi-trash\" [pTooltip]=\"'X\u00F3a' | translate\" tooltipPosition=\"top\"\n                                                (click)=\"deleteRow(ri, control, path)\"></button>\n                                            <button *ngIf=\"control.rowButtons\" type=\"button\" pButton\n                                                icon=\"pi pi-ellipsis-v\"\n                                                class=\"link-or-action p-button-text p-button-rounded\"\n                                                pTooltip=\"Ch\u1EE9c n\u0103ng kh\u00E1c\" tooltipPosition=\"top\"\n                                                (click)=\"showContextMenu($event, rowData, control)\"></button>\n                                        </div>\n                                        <div *ngIf=\"control.rowButtonTemplate\"\n                                            class=\"p-toolbar-group-center button-group\">\n                                            <ng-container\n                                                *ngTemplateOutlet=\"control.rowButtonTemplate; context: {rowData: _modelData[control.field][ri], rowIndex: ri, path: path, control: control}\">\n                                            </ng-container>\n                                        </div>\n                                        <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\n                                    </td>\n                                </tr>\n                            </ng-template>\n                            <ng-template *ngIf=\"control.summaryTemplate\" pTemplate=\"summary\" let-rowData>\n                                <ng-container *ngTemplateOutlet=\"control.summaryTemplate; context: {rowData: rowData}\">\n                                </ng-container>\n                            </ng-template>\n                        </p-table>\n                    </tn-custom-scrollbar>\n                    <div *ngIf=\"control.showFooter\" class=\"--table-schema-footer\">\n                        <button *ngIf=\"control.showAdd\" type=\"button\" pButton style=\"width:auto\" label=\"Th\u00EAm m\u1EDBi\"\n                            icon=\"pi pi-plus\" class=\"p-button-text\" (click)=\"addNewRow(control, path)\"></button>\n                        <span *ngIf=\"control.showDialog\" style=\"font-weight: normal;\">\n                            <p-checkbox label=\"M\u1EDF dialog\" [binary]=\"true\" [(ngModel)]=\"control.showEdit\">\n                            </p-checkbox>\n                        </span>\n                        <button *ngIf=\"control.enableAddMulti\" type=\"button\" pButton\n                            style=\"width:auto; margin-left:10px;\" label=\"Th\u00EAm nhi\u1EC1u\" icon=\"pi pi-clone\"\n                            class=\"p-button-text\" (click)=\"addMultiRow(control, 5, path)\"></button>\n                        <button *ngFor=\"let bt of control.footerButtons\" type=\"button\" pButton [class]=\"bt.class\"\n                            [icon]=\"bt.icon\" [label]=\"bt.label | translate\" style=\"width:auto; margin-left:10px;\"\n                            (click)=\"messageRow( -1, control, path)\"></button>\n                    </div>\n                </div>\n            </ng-container>\n            <ng-container *ngSwitchDefault>\n                <ng-container *ngIf=\"control.template\">\n                    <ng-container [ngTemplateOutlet]=\"control.template\" [ngTemplateOutletContext]=\"{\n                        crudForm: this, data: data, index: rowIndex, parentPath: parentPath, control: control, changeFunc: handleFieldValueChange\n                    }\">\n                    </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"!control.template\" [ngTemplateOutlet]=\"getComponentByType(control.field)\"\n                    [ngTemplateOutletContext]=\"{\n                        crudForm: this, data: data, index: rowIndex, parentPath: parentPath, control: control, changeFunc: handleFieldValueChange\n                    }\">\n                </ng-container>\n            </ng-container>\n            <ng-container *ngTemplateOutlet=\"validation; context: {control: control, data: data}\">\n            </ng-container>\n            <div *ngIf=\"control.message\" class=\"control-message\">\n                <span [class]=\"control.messageClass\">{{control.message}}</span>\n            </div>\n        </ng-container>\n    </div>\n</ng-template>\n<ng-template #validation let-control=\"control\" let-data=\"data\">\n    <ng-container *ngIf=\"data._errors[control.field].length > 0\">\n        <div class=\"error-container\">\n            <ng-container *ngFor=\"let error of data._errors[control.field]\">\n                <div class=\"error-item\" *ngIf=\"error\">\n                    <ng-container [ngTemplateOutlet]=\"errorMessage\" [ngTemplateOutletContext]=\"{content: error}\">\n                    </ng-container>\n                </div>\n            </ng-container>\n        </div>\n    </ng-container>\n</ng-template>\n<ng-template #errorMessage let-content=\"content\">\n    <div class=\"error-content\">\n        <i class=\"pi pi-ban\"></i>\n        <span> {{content}}</span>\n    </div>\n</ng-template>\n<ng-template #labelControl let-control=\"control\">\n    <ng-container>\n        <label [class]=\"getLabelClass(control)\" *ngIf=\"!control.isHtml\" [attr.label-index]=\"control.indexLabel\"\n            [pTooltip]=\"control.title\" tooltipPosition=\"top\" tooltipStyleClass=\"wrap\" [escape]=\"false\"\n            [for]=\"control.for\">{{control.text | translate}}</label>\n        <label [class]=\"getLabelClass(control)\" *ngIf=\"control.isHtml\" [innerHTML]=\"control.text | safeHtml\"\n            [attr.label-index]=\"control.indexLabel\"></label>\n    </ng-container>\n</ng-template>\n<ng-template #containerSticky>\n    <span class=\"fix-sticky top\"></span>\n    <span class=\"fix-sticky right\"></span>\n    <span class=\"fix-sticky left\"></span>\n</ng-template>\n<!-- <ng-template #templateCongViecForm let-control=\"control\">\n    <base-congviec-form [control]=\"control\" [parentSetting]=\"congViecSetting\" [tenCongViec]=\"control.data.tenCongViec\">\n    </base-congviec-form>\n</ng-template> -->\n<tn-dialog *ngIf=\"tableFormDialogModel.showEditForm\" #dialog [styleClass]=\"'address-form'\"\n    [header]=\"tableFormDialogModel.header | translate\" [popupSize]=\"tableFormDialogModel.popupSize\"\n    (onHide)=\"tableFormDialogModel.showEditForm = false\">\n    <table-detail-form #formBase [parentSetting]=\"setting\" [schema]=\"tableFormSchema\" [data]=\"tableFormDialogModel.data\"\n        (onSaved)=\"handleSavedTableRow($event)\" (onCancel)=\"tableFormDialogModel.showEditForm = false\">\n    </table-detail-form>\n</tn-dialog>",
                 providers: [ComponentContextService],
                 styles: [".label-only{font-weight:700;margin-bottom:1em}div.label{position:relative}div.label .star-required{color:red;position:absolute;padding-left:.2em;padding-top:.1em}th>span.star-required{color:red;padding-left:.2em;padding-top:.3em}div.type-container.not-show-in-box-holder{padding:0}.--table-schema-footer{display:flex;align-items:center;font-weight:600;padding:.5em;background:#f8f9fa;color:#495057;border:1px solid #e9ecef}.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-weight:700;font-size:.85em}.view-mode>span:not(:empty){display:inline-block;width:100%;padding:5px 0}.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{font-size:1.2rem;font-weight:700;color:#025ba7;border-bottom:1px solid #cfcfcf;text-transform:uppercase;padding:5px;margin-bottom:5px}.crud-form-control.type-title>.label{margin-bottom:0}.control-description,.crud-form-control .subControl-description{font-size:.8rem;font-weight:700;color:#007eff;margin-bottom:5px}.control-description{padding-left:.75rem}.th-sticky{text-align:center!important;z-index:2!important;position:sticky!important;top:0;background:inherit}.th-sticky.stt{left:0}.cell-header-function{display:flex;align-items:center}.cell-header-function>span{text-align:center;flex:1 1}.cell-header-function button{width:24px;height:24px;padding:0;margin:0}.no-value{font-size:.8em}@keyframes fadeIn{0%{opacity:0;top:-25px}to{opacity:1;top:0}}@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-control .tn-check-box-list{margin-top:5px}::ng-deep crud-form .crud-form-control>div.label{margin-bottom:5px;font-size:.9rem;height:1.15em}::ng-deep crud-form .crud-form-control>div.label+*{width:100%}::ng-deep crud-form .crud-form-control>.error-container .error-item{overflow:visible;animation:shrink .1s;min-height:20px;padding-top:5px}::ng-deep crud-form .crud-form-control>.error-container .error-item .error-content{display:flex;position:relative;color:red;font-size:.9em;animation:fadeIn .1s}::ng-deep crud-form .crud-form-control>.error-container .error-item .error-content i{font-size:.9em;display:flex;padding-top:1px}::ng-deep crud-form .crud-form-control>.error-container .error-item .error-content span{display:flex;padding-left:5px}::ng-deep crud-form .crud-form-control .control-message{margin-top:5px;font-size:.9rem}::ng-deep crud-form .crud-form-control .control-message .green{color:#00af00}::ng-deep crud-form .crud-form-control .control-message .red{color:red}::ng-deep crud-form .crud-form-control .control-message .blue{color:#0095ff}::ng-deep crud-form .crud-form-control.no-label>div.label{display:none}::ng-deep crud-form .crud-form-control.error .p-dropdown,::ng-deep crud-form .crud-form-control.error .p-inputtext,::ng-deep crud-form .crud-form-control.error .p-multiselect,::ng-deep crud-form .crud-form-control.error .tn-dropdown,::ng-deep crud-form .crud-form-control.error input,::ng-deep crud-form .crud-form-control.error select,::ng-deep crud-form .crud-form-control.error textarea{border-color:#ff5722!important}::ng-deep crud-form .crud-form-control.error .p-autocomplete-multiple-container:not(.p-disabled).p-focus,::ng-deep crud-form .crud-form-control.error .p-inputtext:enabled:focus,::ng-deep crud-form .crud-form-control.error .tn-dropdown:not(.p-disabled).p-focus{box-shadow:0 0 0 .2rem #ffc4b3}::ng-deep crud-form .crud-form-control.error div.crud-form-control:not(.error) .p-dropdown,::ng-deep crud-form .crud-form-control.error div.crud-form-control:not(.error) .p-inputtext,::ng-deep crud-form .crud-form-control.error div.crud-form-control:not(.error) .p-multiselect,::ng-deep crud-form .crud-form-control.error div.crud-form-control:not(.error) .tn-dropdown,::ng-deep crud-form .crud-form-control.error div.crud-form-control:not(.error) input,::ng-deep crud-form .crud-form-control.error div.crud-form-control:not(.error) select,::ng-deep crud-form .crud-form-control.error div.crud-form-control:not(.error) textarea{border-color:#ced4da!important}::ng-deep crud-form .crud-form-control.error div.crud-form-control:not(.error) .p-autocomplete-multiple-container:not(.p-disabled).p-focus,::ng-deep crud-form .crud-form-control.error div.crud-form-control:not(.error) .p-dropdown.tn-dropdown.p-focus,::ng-deep crud-form .crud-form-control.error div.crud-form-control:not(.error) .p-inputtext:enabled:focus{box-shadow:0 0 0 .2rem #a6d5fa}::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}@media screen and (min-width:768px){::ng-deep crud-form .grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}::ng-deep crud-form .grid .p-md-1{width:unset;grid-column:span 1}::ng-deep crud-form .grid .p-md-2{width:unset;grid-column:span 2}::ng-deep crud-form .grid .p-md-3{width:unset;grid-column:span 3}::ng-deep crud-form .grid .p-md-4{width:unset;grid-column:span 4}::ng-deep crud-form .grid .p-md-5{width:unset;grid-column:span 5}::ng-deep crud-form .grid .p-md-6{width:unset;grid-column:span 6}::ng-deep crud-form .grid .p-md-7{width:unset;grid-column:span 7}::ng-deep crud-form .grid .p-md-8{width:unset;grid-column:span 8}::ng-deep crud-form .grid .p-md-9{width:unset;grid-column:span 9}::ng-deep crud-form .grid .p-md-10{width:unset;grid-column:span 10}::ng-deep crud-form .grid .p-md-11{width:unset;grid-column:span 11}::ng-deep crud-form .grid .p-md-12{width:unset;grid-column:span 12}::ng-deep crud-form .grid .row-span-1{grid-row:span 1}::ng-deep crud-form .grid .row-span-2{grid-row:span 2}::ng-deep crud-form .grid .row-span-3{grid-row:span 3}::ng-deep crud-form .grid .row-span-4{grid-row:span 4}::ng-deep crud-form .grid .row-span-5{grid-row:span 5}::ng-deep crud-form .grid .row-span-6{grid-row:span 6}::ng-deep crud-form .grid .row-span-7{grid-row:span 7}::ng-deep crud-form .grid .row-span-8{grid-row:span 8}::ng-deep crud-form .grid .row-span-9{grid-row:span 9}::ng-deep crud-form .grid .row-span-10{grid-row:span 10}::ng-deep crud-form .grid .row-span-11{grid-row:span 11}::ng-deep crud-form .grid .row-span-12{grid-row:span 12}::ng-deep crud-form .grid .row-span-13{grid-row:span 13}::ng-deep crud-form .grid .row-span-14{grid-row:span 14}::ng-deep crud-form .grid .row-span-15{grid-row:span 15}::ng-deep crud-form .grid .row-span-16{grid-row:span 16}::ng-deep crud-form .grid .row-span-17{grid-row:span 17}::ng-deep crud-form .grid .row-span-18{grid-row:span 18}::ng-deep crud-form .grid .row-span-19{grid-row:span 19}::ng-deep crud-form .grid .row-span-20{grid-row:span 20}::ng-deep crud-form .grid .row-span-21{grid-row:span 21}::ng-deep crud-form .grid .row-span-22{grid-row:span 22}::ng-deep crud-form .grid .row-span-23{grid-row:span 23}::ng-deep crud-form .grid .row-span-24{grid-row:span 24}::ng-deep crud-form .grid .row-span-25{grid-row:span 25}::ng-deep crud-form .grid .row-span-26{grid-row:span 26}::ng-deep crud-form .grid .row-span-27{grid-row:span 27}::ng-deep crud-form .grid .row-span-28{grid-row:span 28}::ng-deep crud-form .grid .row-span-29{grid-row:span 29}::ng-deep crud-form .grid .row-span-30{grid-row:span 30}::ng-deep crud-form .grid .row-span-31{grid-row:span 31}::ng-deep crud-form .grid .row-span-32{grid-row:span 32}::ng-deep crud-form .grid .row-span-33{grid-row:span 33}::ng-deep crud-form .grid .row-span-34{grid-row:span 34}::ng-deep crud-form .grid .row-span-35{grid-row:span 35}::ng-deep crud-form .grid .row-span-36{grid-row:span 36}::ng-deep crud-form .grid .row-span-37{grid-row:span 37}::ng-deep crud-form .grid .row-span-38{grid-row:span 38}::ng-deep crud-form .grid .row-span-39{grid-row:span 39}::ng-deep crud-form .grid .row-span-40{grid-row:span 40}::ng-deep crud-form .grid .row-span-41{grid-row:span 41}::ng-deep crud-form .grid .row-span-42{grid-row:span 42}::ng-deep crud-form .grid .row-span-43{grid-row:span 43}::ng-deep crud-form .grid .row-span-44{grid-row:span 44}::ng-deep crud-form .grid .row-span-45{grid-row:span 45}::ng-deep crud-form .grid .row-span-46{grid-row:span 46}::ng-deep crud-form .grid .row-span-47{grid-row:span 47}::ng-deep crud-form .grid .row-span-48{grid-row:span 48}::ng-deep crud-form .grid .row-span-49{grid-row:span 49}::ng-deep crud-form .grid .row-span-50{grid-row:span 50}}: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-property:box-shadow,border-color;transition-duration:.3s,.3s;transition-timing-function:ease,ease;transition-delay:0s,0s}:host ::ng-deep .rq .tox .tox-edit-area{border-left-color:#ff4c46}:host ::ng-deep .table-schema-paging{margin-bottom:40px;display:block}"]
             },] }
@@ -34994,6 +35048,7 @@ class GlobalService {
     advanceFilterEvent() {
         return this._hasAdvanceFilter;
     }
+    nativeGlobal() { return window; }
 }
 GlobalService.ɵprov = i0.ɵɵdefineInjectable({ factory: function GlobalService_Factory() { return new GlobalService(); }, token: GlobalService, providedIn: "root" });
 GlobalService.decorators = [
@@ -44643,6 +44698,7 @@ class TnTinymceComponent extends ComponentBase {
         this.keydown = new EventEmitter();
         this.onBlur = new EventEmitter();
         this.onChanged = new EventEmitter();
+        this.onKeyUp = new EventEmitter();
         this.model = '';
         this.id = nanoid(8);
         this.dataEquation = {};
@@ -44703,21 +44759,6 @@ class TnTinymceComponent extends ComponentBase {
     }
     getTinyMceConfigByMode(mode) {
         const $this = this;
-        tinymce.PluginManager.add('equation', function (editor) {
-            const openDialog = function () {
-                $this.header = 'Công thức toán học (dùng laTex)';
-                $this.equationFormModel.show = true;
-                $this.popupSize = { width: 1200, height: 700 };
-            };
-            editor.ui.registry.addButton('equation', {
-                tooltip: 'Công thức toán học vào nội dung',
-                // icon: 'insert-character',
-                icon: 'ltr',
-                onAction: function () {
-                    openDialog();
-                }
-            });
-        });
         tinymce.PluginManager.add('addNews', function (editor) {
             const openDialog = function () {
                 $this.header = 'Thêm/Chọn tin bài';
@@ -44824,6 +44865,10 @@ class TnTinymceComponent extends ComponentBase {
                 if (e.target.nodeName.toLowerCase() == 'img' && e.target.classList.contains('latex')) {
                     this.openDialog({ content: e.target.getAttribute('alt'), style: e.target.getAttribute('style'), height: e.target.getAttribute('height') });
                 }
+            }).on('keyup', (e) => {
+                const content = editor.getContent();
+                this.onChange(content);
+                this.onKeyUp.emit(content);
             });
             editor.on('blur', (e) => {
                 this.handleBlur();
@@ -44869,33 +44914,33 @@ class TnTinymceComponent extends ComponentBase {
             },
             mobile: {
                 theme: 'silver',
-                plugins: ['advlist autolink lists link image charmap print preview anchor textcolor searchreplace visualblocks code fullscreen insertdatetime media table media code lists colorpicker imagetools tabfocus textcolor equation'],
+                plugins: ['advlist autolink lists link image charmap print preview anchor textcolor searchreplace visualblocks code fullscreen insertdatetime media table media code lists colorpicker imagetools tabfocus textcolor'],
             }
         };
         if (mode == 'full') {
             config.plugins = [
-                'advlist autolink lists link image charmap print preview anchor textcolor searchreplace visualblocks code fullscreen insertdatetime media table media code lists colorpicker imagetools tabfocus editFileNew addNews equation'
+                'advlist autolink lists link image charmap print preview anchor textcolor searchreplace visualblocks code fullscreen insertdatetime media table media code lists colorpicker imagetools tabfocus editFileNew addNews'
             ];
-            config.toolbar = 'formatselect | bold italic Strikethrough forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | table link editFileNew addNews | print removeformat undo redo | equation | fullscreen ';
-            config.mobile.toolbar = 'bold italic Strikethrough forecolor backcolor | bullist numlist | equation | fullscreen';
+            config.toolbar = 'formatselect | bold italic Strikethrough forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | table link editFileNew addNews | print removeformat undo redo | fullscreen ';
+            config.mobile.toolbar = 'bold italic Strikethrough forecolor backcolor | bullist numlist | fullscreen';
             return config;
         }
         else if (mode == 'medium') {
-            config.plugins = ['advlist autolink lists link image charmap print preview anchor textcolor searchreplace visualblocks code fullscreen insertdatetime media table media code lists colorpicker imagetools tabfocus textcolor equation'];
-            config.toolbar = 'formatselect | bold italic Strikethrough forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | table link  | print removeformat undo redo | equation | fullscreen';
-            config.mobile.toolbar = 'bold italic Strikethrough forecolor backcolor | bullist numlist | equation | fullscreen';
+            config.plugins = ['advlist autolink lists link image charmap print preview anchor textcolor searchreplace visualblocks code fullscreen insertdatetime media table media code lists colorpicker imagetools tabfocus textcolor'];
+            config.toolbar = 'formatselect | bold italic Strikethrough forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | table link  | print removeformat undo redo | fullscreen';
+            config.mobile.toolbar = 'bold italic Strikethrough forecolor backcolor | bullist numlist | fullscreen';
             return config;
         }
         else if (mode == 'simple') {
-            config.plugins = ['advlist autolink lists link image charmap print preview anchor textcolor searchreplace visualblocks code fullscreen insertdatetime media table media code lists colorpicker imagetools tabfocus textcolor equation'];
-            config.toolbar = 'bold italic Strikethrough forecolor backcolor | bullist numlist | equation | fullscreen';
-            config.mobile.toolbar = 'fullscreen | bold italic Strikethrough forecolor backcolor | bullist numlist | equation';
+            config.plugins = ['advlist autolink lists link image charmap print preview anchor textcolor searchreplace visualblocks code fullscreen insertdatetime media table media code lists colorpicker imagetools tabfocus textcolor'];
+            config.toolbar = 'bold italic Strikethrough forecolor backcolor | bullist numlist | fullscreen';
+            config.mobile.toolbar = 'fullscreen | bold italic Strikethrough forecolor backcolor | bullist numlist';
             return config;
         }
         else {
-            config.plugins = ['advlist autolink lists link image charmap print preview anchor textcolor searchreplace visualblocks code fullscreen insertdatetime media table media code lists colorpicker imagetools tabfocus textcolor equation'];
-            config.toolbar = 'formatselect | bold italic Strikethrough forecolor backcolor| alignleft aligncenter alignright alignjustify | bullist numlist | equation';
-            config.toolbar = 'bold italic Strikethrough forecolor backcolor | bullist numlist | equation | fullscreen';
+            config.plugins = ['advlist autolink lists link image charmap print preview anchor textcolor searchreplace visualblocks code fullscreen insertdatetime media table media code lists colorpicker imagetools tabfocus textcolor'];
+            config.toolbar = 'formatselect | bold italic Strikethrough forecolor backcolor| alignleft aligncenter alignright alignjustify | bullist numlist';
+            config.toolbar = 'bold italic Strikethrough forecolor backcolor | bullist numlist | fullscreen';
         }
         config.paste_data_images = true;
         return config;
@@ -45053,7 +45098,7 @@ class TnTinymceComponent extends ComponentBase {
 TnTinymceComponent.decorators = [
     { type: Component, args: [{
                 selector: 'tn-tinymce',
-                template: "<input *ngIf=\"!_deviceDetectorService.isDesktop()\" class=\"input-tab-trap\" (focus)=\"focusTrap($event)\" />\n<textarea class=\"tinymce-control\" id={{id}} [ngStyle]=\"{height: height+'px'}\"></textarea>\n<tn-dialog #dialog *ngIf=\"equationFormModel.show\" [closeOnEscape]=\"false\"\n    [header]=\"'C\u00F4ng th\u1EE9c to\u00E1n h\u1ECDc (d\u00F9ng laTex)' | translate\" [popupSize]=\"popupSize\"\n    (onHide)=\"equationFormModel.show = false\">\n    <tn-custom-scrollbar #scrollbar>\n        <equation-editor [data]=\"dataEquation\">\n        </equation-editor>\n    </tn-custom-scrollbar>\n    <ng-template #footer>\n        <button icon=\"fas fa-check\" class=\"p-button-text\" [disabled]=\"model.submitting\" pButton type=\"button\"\n            (click)=\"handleOk($event)\" [label]=\"'X\u00E1c nh\u1EADn' | translate\"></button>\n        <button icon=\"fas fa-undo\" [disabled]=\"model.submitting\" pButton class=\"p-button-text p-button-secondary\"\n            type=\"button\" (click)=\"equationFormModel.show = false\" [label]=\"'FORM.CANCEL' | translate\"></button>\n    </ng-template>\n</tn-dialog>\n\n<tn-dialog *ngIf=\"isAddNews\" #dialog [styleClass]=\"'address-form'\" [header]=\"header | translate\" [popupSize]=\"popupSize\"\n    (onHide)=\"isAddNews = false\">\n    <add-news #listBase [languageCode]=\"languageCode\" (showChange)=\"showChanged($event)\"></add-news>\n</tn-dialog>\n\n<tn-dialog *ngIf=\"showTemplate\" #dialog [styleClass]=\"'address-form'\" [header]=\"header | translate\"\n    [popupSize]=\"popupSize\" (onHide)=\"showTemplate = false\">\n    <tn-template (onChanged)=\"addTemplate($event)\"></tn-template>\n</tn-dialog>\n\n<tn-dialog *ngIf=\"isAddFile\" #dialog [styleClass]=\"'address-form'\" [header]=\"header | translate\" [popupSize]=\"popupSize\"\n    (onHide)=\"isAddFile = false\">\n    <file-picker-dialog #formBase [parentModel]=\" model\" [parentContext]=\"context\" (closeForm)=\"isAddFile = false\"\n        (onCancel)=\"handleRFCancel($event)\" (onChanged)=\"showChanged($event)\">\n    </file-picker-dialog>\n</tn-dialog>",
+                template: "<input *ngIf=\"!_deviceDetectorService.isDesktop()\" class=\"input-tab-trap\" (focus)=\"focusTrap($event)\" />\n<textarea class=\"tinymce-control\" id={{id}} [ngStyle]=\"{height: height+'px'}\"></textarea>\n\n<tn-dialog #dialog *ngIf=\"equationFormModel.show\" [closeOnEscape]=\"false\"\n    [header]=\"'C\u00F4ng th\u1EE9c to\u00E1n h\u1ECDc (d\u00F9ng laTex)' | translate\" [popupSize]=\"popupSize\"\n    (onHide)=\"equationFormModel.show = false\">\n    <tn-custom-scrollbar #scrollbar>\n        <equation-editor [data]=\"dataEquation\">\n        </equation-editor>\n    </tn-custom-scrollbar>\n    <ng-template #footer>\n        <button icon=\"fas fa-check\" class=\"p-button-text\" [disabled]=\"model.submitting\" pButton type=\"button\"\n            (click)=\"handleOk($event)\" [label]=\"'X\u00E1c nh\u1EADn' | translate\"></button>\n        <button icon=\"fas fa-undo\" [disabled]=\"model.submitting\" pButton class=\"p-button-text p-button-secondary\"\n            type=\"button\" (click)=\"equationFormModel.show = false\" [label]=\"'FORM.CANCEL' | translate\"></button>\n    </ng-template>\n</tn-dialog>\n<tn-dialog *ngIf=\"isAddNews\" #dialog [styleClass]=\"'address-form'\" [header]=\"header | translate\" [popupSize]=\"popupSize\"\n    (onHide)=\"isAddNews = false\">\n    <add-news #listBase [languageCode]=\"languageCode\" (showChange)=\"showChanged($event)\"></add-news>\n</tn-dialog>\n\n<tn-dialog *ngIf=\"showTemplate\" #dialog [styleClass]=\"'address-form'\" [header]=\"header | translate\"\n    [popupSize]=\"popupSize\" (onHide)=\"showTemplate = false\">\n    <tn-template (onChanged)=\"addTemplate($event)\"></tn-template>\n</tn-dialog>\n\n<tn-dialog *ngIf=\"isAddFile\" #dialog [styleClass]=\"'address-form'\" [header]=\"header | translate\" [popupSize]=\"popupSize\"\n    (onHide)=\"isAddFile = false\">\n    <file-picker-dialog #formBase [parentModel]=\" model\" [parentContext]=\"context\" (closeForm)=\"isAddFile = false\"\n        (onCancel)=\"handleRFCancel($event)\" (onChanged)=\"showChanged($event)\">\n    </file-picker-dialog>\n</tn-dialog>",
                 providers: [
                     {
                         provide: NG_VALUE_ACCESSOR,
@@ -45084,7 +45129,8 @@ TnTinymceComponent.propDecorators = {
     onInit: [{ type: Output }],
     keydown: [{ type: Output }],
     onBlur: [{ type: Output }],
-    onChanged: [{ type: Output }]
+    onChanged: [{ type: Output }],
+    onKeyUp: [{ type: Output }]
 };
 
 class CoCauToChucTestService extends BaseService {
@@ -46754,6 +46800,123 @@ FileSizePipe.decorators = [
             },] }
 ];
 
+/* eslint-disable prefer-const */
+class HtmlPreviewComponent extends ComponentBase {
+    constructor(_injector, gs) {
+        super(_injector);
+        this.gs = gs;
+        this.content = '';
+        this.control = new HtmlPreviewControlSchema();
+        this.contentChange = new EventEmitter();
+    }
+    ngOnChanges(changes) {
+        if (changes['content']) {
+            this.renderMath();
+        }
+    }
+    renderMath() {
+        this.mathJaxObject = this.gs.nativeGlobal()['MathJax'];
+        if (!this.mathJaxObject && !this.mathContent) {
+            return;
+        }
+        setTimeout(() => {
+            var _a, _b;
+            const autoScrollBottom = !!((_a = this.control) === null || _a === void 0 ? void 0 : _a.autoScrollBottom);
+            const output = this.mathContent.nativeElement;
+            output.innerHTML = ((_b = this.content) === null || _b === void 0 ? void 0 : _b.trim()) || '';
+            this.mathJaxObject.texReset();
+            this.mathJaxObject.typesetClear();
+            this.mathJaxObject.typesetPromise([output]).catch(function (err) {
+                output.innerHTML = '';
+                output.appendChild(document.createTextNode(err.message));
+                console.error(err);
+            }).then(function () {
+                // Do something after typeset
+                if (autoScrollBottom) {
+                    const box = document.querySelector('#math-preview-box');
+                    const elem = box.getElementsByClassName('ps--active-y')[0];
+                    if (elem) {
+                        elem.scrollTop = elem.scrollHeight;
+                    }
+                }
+            });
+            return this.mathJaxObject.startup.defaultPageReady();
+        });
+    }
+    loadMathConfig() {
+        var _a, _b, _c;
+        const wd = this.gs.nativeGlobal();
+        wd.MathJax = {
+            'loader': { load: ['input/asciimath', 'output/chtml', 'ui/menu', 'output/svg', '[mml]/mml3'] },
+            'tex': {
+                inlineMath: [['$', '$'], ['\\(', '\\)']],
+                processEscapes: true
+            },
+            'startup': {
+                pageReady: () => this.renderMath()
+            },
+            'svg': {
+                scale: 1,
+                minScale: .5
+            },
+            'options': {
+                enableMenu: !!((_a = this.control) === null || _a === void 0 ? void 0 : _a.useMathJaxMenu),
+                menuOptions: {
+                    settings: {
+                        texHints: true,
+                        semantics: false,
+                        zoom: 'Double-Click',
+                        zscale: '200%',
+                        renderer: ((_b = this.control) === null || _b === void 0 ? void 0 : _b.mathJaxType) ? this.control.mathJaxType : 'CHTML',
+                        scale: 1,
+                        inTabOrder: true,
+                        assistiveMml: true,
+                        collapsible: false,
+                        explorer: false, // true if the expression explorer should be active
+                    },
+                    annotationTypes: {
+                        TeX: ['TeX', 'LaTeX', 'application/x-tex'],
+                        StarMath: ['StarMath 5.0'],
+                        Maple: ['Maple'],
+                        ContentMathML: ['MathML-Content', 'application/mathml-content+xml'],
+                        OpenMath: ['OpenMath']
+                    }
+                }
+            }
+        };
+        const script = document.createElement('script');
+        if (((_c = this.control) === null || _c === void 0 ? void 0 : _c.mathJaxType) == 'SVG') {
+            script.src = 'assets/vendor/mathjax/tex-mml-svg.js';
+        }
+        else {
+            script.src = 'assets/vendor/mathjax/tex-mml-chtml.js';
+        }
+        script.setAttribute('id', 'MathJax-script');
+        document.head.appendChild(script);
+    }
+    ngOnInit() {
+        this.loadMathConfig();
+    }
+}
+HtmlPreviewComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'html-preview',
+                template: "<div class=\"preview-box\" id=\"math-preview-box\" [ngStyle]=\"{'height': control.height + 'px'}\">\n    <tn-custom-scrollbar [showScrollHorizontal]=\"true\">\n        <!-- <span #mathContent id=\"mathPreview\" [innerHTML]=\"content | safeHtml\"></span> -->\n        <div #mathContent id=\"mathPreview\"></div>\n    </tn-custom-scrollbar>\n</div>",
+                providers: [ComponentContextService],
+                styles: ["::ng-deep html-preview .preview-box{border:1px solid #ced4da;padding:10px}"]
+            },] }
+];
+HtmlPreviewComponent.ctorParameters = () => [
+    { type: Injector },
+    { type: GlobalService }
+];
+HtmlPreviewComponent.propDecorators = {
+    mathContent: [{ type: ViewChild, args: ['mathContent',] }],
+    content: [{ type: Input }],
+    control: [{ type: Input }],
+    contentChange: [{ type: Output }]
+};
+
 function coreDeclaration() {
     return [
         AddressComponent,
@@ -46879,7 +47042,8 @@ function coreDeclaration() {
         SettingsWorkflowComponent,
         SettingAuthorizeButtonComponent,
         SettingsWorkflowNo1Component,
-        CommonLibComponent
+        CommonLibComponent,
+        HtmlPreviewComponent
     ];
 }
 function coreModuleImport() {
@@ -47048,5 +47212,5 @@ class Pair {
  * Generated bundle index. Do not edit.
  */
 
-export { AccessDeniedComponent, Action, ActionChoYKienBase, ActionThuHoiBase, ActionUpdateModel, AddressControlSchema, AddressService, AdvanceSearchData, AdvanceSearchSetting, AfterViewCheckedComponent, AnnouncementReadsService, AnnouncementsService, AppComponentBase, AppListService, ApplicationContextService, ApprovalPipe, ArrayPair, AtLeastOneRowTableValidator, AuthenService, AuthorizeDirective, AutoCompleteControlSchema, AutoCompletePickerControlSchema, AutocompleteDatasourceComponent, AvatarUploaderComponent, BaseMenuService, BaseModule, BaseService, BooleanFormatPipe, ButtonAction, ButtonControlSchema, ButtonPermission, ButtonPermissions, ButtonTextActionCongViec, CONFIG_CALENDAR_VIETNAMESE, CalculationEngineService, CanBoHoSoService, CanBo_HoSo_CoCauToChucService, CauHinhWorkflowService, CccdValidator, CellExcel, ChatBoxComponent, ChatSendMessageBoxComponent, CheckBoxListControlSchema, CheckControlVisibleService, CheckDuplicateFieldsValidator, CheckDuplicateValidator, CheckboxControlSchema, ChipsControlSchema, ClientV5Service, CoCauToChucControlSchema, CoCauToChucNewService, CoCauToChucPickerComponent, CoCauToChucPickerControlSchema, CoCauToChucPickerControlSchemaNew, CoCauToChucService, CodeValidator, ColorBlack, ColorControlSchema, ColorPickerControlSchema, ColorWhite, Column, ColumnSchemaBase, ColumnSetting, ColumnSettingDetail, ComCtxConstants, CommandType, CommonDashboardComponent, CommonErrorCode, CommonLibComponent, CommonSearchFormComponent, CommonService, CompareValidator, ComponentBase, ComponentBaseWithButton, ComponentConstants, ComponentContextService, ConditionalBuilderService, CongViecPickerControlSchema, CongViecService, ContainerSchema, ControlTreeNode, ControlType, ConvertMoneyToWordPipe, CoreConfigService, CrudBase, CrudFormComponent, CrudFormCustomFunction, CrudFormData, CrudFormSetting, CrudListComponent, CrudListConfig, CrudListCustomFunction, CrudListData, CrudListHelper, CrudListSetting, CrudService, CustomControlSchema, CustomRouterService, CustomizeUiModel, CustomizeUiService, DanhmucApiService, DataExcel, DataFormBase, DataListBase, DataSourceControlSchema, DataSourceGioiTinh, DataSourcePermissionBase, DataSourceWorkflowCoreStatus, DataType, DateCompareValidator, DateTimeControlSchema, DateTimeRangeControlSchema, DbOrganizationOrganizationService, DbOrganizationPositionService, Deadline, DeadlineType, DhvinhGuardService, DialogModel, DmChucVuService, DmLoaiCongViecService, DomService, DownloadLinkService, DropdownComponent, DropdownControlSchema, DropdownOptions, DummyWorkflowCode, DynamicComponentService, ENUM_DON_VI_HANH_CHINH, EXPLORER_TYPES, EXPORT_VERSION_V4, EXPORT_VERSION_V5, EditFileCommand, EditorControlSchema, EformService, EmailValidator, EntityMedataDataSetting, EntityMetadataService, EntityPickerColumn, EntityPickerControlSchema, EntityWorkflowHistoryService, EntityWorkflowType, EnumActionType, EnumAppSwitcherCode, EnumCanBo, EnumControlPickerType, EnumFileLayout, EnumGetRefType, EnumGioiTinh, EnumHocHamHocVi, EnumLoaiVanBanBase$1 as EnumLoaiVanBanBase, EnumPermissionType, EnumProcessWorkflowType, EnumProperties, EnumStateType, EnumTargetType, EnumTypeSplash, EnumUserRule, EnumUserSource, EnumWFNhomTrangThai, EnumWorkflowCheckboxOption, EnumWorkflowCoreCodeSettingKey, EnumWorkflowHistoryStatus, ErrorType, EventData, EventType, ExactOneValueInTableValidator, ExportAllMode, ExportItem, ExportItemType, ExportItemsMode, ExportManyModel, ExportManyResultModel, ExportModel, ExportService, ExportWithoutTemplateModel, Extension, ExtensionsConst, FILE_TYPES, FederationService, FieldCheckboxCrudList, FieldColExpandCrudList, FieldColReorderCrudList, FieldDefineHasTask, FieldDefineIsTaskFormControl, FieldDefineIsWorkflowControl, FieldFunctionCrudList, FieldIndexInDataSource, FieldOrderCrudList, FieldRowSpan, FieldWorkflowCodeInCrudForm, FileDataService, FileExplorerService, FileExtensions, FileManagerComponent, FileManagerControlSchema, FileManagerMode, FileManagerSetting, FileObjectService, FilePickerDialogComponent, FilePickerSetting, FileType, FileTypeFlag, FileUploadComponent, FileUploadControlSchema, FileUploadMode, FileUploadSetting, FileV4Service, Filter, FolderService, FormControlBase, FormControlBaseWithService, FormSchemaBase, FormSchemaBaseWithService, FormState, Gender, GenerateLinkDownloadDTO, GenericGuardChildService, GenericGuardService, GlobalService, GmailCorrector, GridInfo, GuardService, GuardSvService, HeightType, HighPerformanceService, HighlightPipe, HoSoDoiTacService, HtmlFormatPipe, HttpOptions, ImageService, ImageUploaderControlSchema, Include, KeyFieldGetRefType, KeyFilterStateByMenuCongViec, KeyFlashShow, KeyFunctionReload, KeyValueComponent, KeyValueControlSchema, LabelSchema, LabelWFNhomTrangThai, LabelWorkflowCoreStatus, LengthValidator, ListHelperService, LoaiPhieuDeXuat, LocalCacheService, LowerCorrector, MA_THONG_BAO_PHAN_HE, MaActionBatDauQuyTrinh, ManagerType, MaskControlSchema, MasterDataItem, MasterDataPipe, MasterDataService, MenuService, MenuSource, MergeConfigModel, MethodResult, ModelKySoDonVi, ModelSchema, ModuleConfigService, MultiTranslateHttpLoader, MultipleReferenceDataFormatPipe, NameValidator, NotificationObjectType, NotificationService, NotifierService, NotifierType, NumberCompareValidator, NumberOnlyValidator, NumberRangeControlSchema, Operator, OrganizationFormatPipe, OrganizationNameFormatPipe, OrganizationPickerControlSchema, OrganizationService, OrganizationsFormatPipe, PageInfo, PageSetting, Pair, PassportValidator, PasswordValidator, Pattern, PercentControlSchema, PermissionBase, PermissionConstant, PermissionName, PermissionService, PermissionStorage, PermissionTypes, PermissionUtilsComponent, PersonalSetting, PhanQuyenModel, PhoneNumberValidator, PhoneValidator, PopupSize, PositionService, PrintService, PublicFunction, QueryBuilderComponent, QueryBuilderGroupComponent, QueryBuilderRuleComponent, QueryGroup, QueryRule, RELOAD_FILE_LIST, RadioButtonListControlSchema, RandomDataService, RefField, ReferenceDataFormatPipe, ReferenceTextControlSchema, RegexSplitFieldByItem, ReponseResult, RequiredFieldsValidator, RequiredValidator, RowColorOption, RowExcel, SHARE_COMPONENT_ID, SHARE_EVENT, SafeHtmlPipe, SafeStylePipe, SafeUrlPipe, SameValueValidator, ScalarValueValidator, SchemaBase, SecurePipe, ServiceFileUploadComponent, ServiceRequestModel, ServiceRequestModelV5, SessionTypes, SharedFolderType, SignalRService, SimpleDicItem, SimpleDictionary, Sort, SortDirs, SpanControlSchema, SplashComponentComponent, StartupBusinessComponentBase, StateMachinesService, Status, StatusAction, StatusGroup, StatusOption, StatusOrg, StatusUser, StorageService, StorageUpdatedService, StringCompareOption, StringFormatPipe, SummaryPipe, SwitchControlSchema, TBL_DM_COSODAOTAO_CONSTS, TBL_DM_PHONGHOC_CONSTS, TBL_KTX_NGUOITHUE_HOSO, TBL_TS_PHIEUDEXUAT, TBL_TS_TAISANCODINH_CONSTS, TabViewData, TableSchema, TagSeparator, TaiLieuComponent, TaxCodeValidator, TemplateConstant, TemplateControlSchema, TemplateInstanceService, TemplateService, TemplateTextItem, TemplateTextMany, TemplateTextV4Service, TemplateType, TemplateV4Service, TenContainer, TextAlign, TextAreaControlSchema, TextControlSchema, TextControlSchemaWithService, TitleSchema, TnClientCommand, TnClientService, TnComponentConfig, TnCustomScrollbarComponent, TnDatePipe, TnMenu, TnMenuItem, TnReorderableColumnDirective, TnReorderableRowDirective, TnSortIcon, TnSortableColumnDirective, TnTreeTableToggler, TnUser, TnxSharedModule, TopicReloadCongViecV5, TopicReloadCountCongViecV5, TopicReloadNotification, TrangThaiMasterData, TrangThais, TreeDataOption, TreeListBase, TreeNode, TrimCorrector, TrimEndCorrector, TrimStartCorrector, TypeDanhMucAPI, UniqueFieldInTableValidator, UniqueNumberService, UpperCorrector, UserGroupRealService, UserGroupService, UserOnlineDetailsService, UserPickerControlSchema, UserPickerDialogComponent, UserPublicInfo, UserService, UserType, UserV5Service, Validation, ValueType, VanBanPickerControlSchema, ViewContainerRefDirective, VirtualBaseService, WfAction, WfItem, WfMachine, WfSchema, WorkflowConfigAdvance, WorkflowCoreStatusEnum, WorkflowFieldStateCode, WorkflowHistoryService, WorkflowPermissionDetailService, WorkflowService, WorkflowSetting, WorkflowSettingNew, WorkflowSettingsService, WorkflowTargetDefaultValue, WrapPickerControlSchema, addDay, addZero, appendDefaultFilter, clearAll, clone, cloneOld, coreDeclaration, coreModuleImport, coreProvider, dataSourceIcon, dateDiff, fileTypeSource, genQueryFromFilters, getDateFromStringDateVN, getDayOfWeek, getEnvironmentByName, getEnvironmentData, getListMenuByName, getMenuData, getMonday, getStringDate, getStringDateTime, getStringDateVN, getStringDateVNLocal, getTimeSpan, isArray, isBoolean, isDate, isFunction, isLiteralObject, isNumber, isObjectOld, isRegular, isSimpleType, isString, isValidDate, isValidTime, keyUserSurveyLocal, loadRemoteModule, loadRemotePageModule, mapProperty, maximumPageSize, mergeJSON, mergeJSONOld, moduleConfigFunc, monthDiff, multipleSort, romanize, ɵ0$2 as ɵ0, ɵ1$1 as ɵ1, ɵ2$1 as ɵ2, ɵ3, ɵ4, LoggerService as ɵa, DropdownService as ɵb, ImageUploaderComponent as ɵba, CheckBoxListComponent as ɵbb, CoCauToChucPickerListComponent as ɵbc, CoCauToChucPickerListNewComponent as ɵbd, FormBuilderComponent as ɵbe, DatetimePickerComponent as ɵbf, DatetimePickerRangeComponent as ɵbg, EntityPickerBoxComponent as ɵbh, EntityPickerDataComponent as ɵbi, EntityPickerSelectedComponent as ɵbj, EntityPickerComponent as ɵbk, EntityPickerSearchFormComponent as ɵbl, EntityPickerDialogComponent as ɵbm, EntityPickerTreeDataComponent as ɵbn, EntityPickerTreeSelectedComponent as ɵbo, EntityPermissionComponent as ɵbp, EquationEditorComponent as ɵbq, MaskComponent as ɵbr, NumberPickerRangeComponent as ɵbs, PagingNextBackOnlyComponent as ɵbt, RadioButtonListComponent as ɵbu, VanBanPickerComponent as ɵbv, VanBanDenService as ɵbw, VanBanDiService as ɵbx, VanBanPickerDialogComponent as ɵby, VanbanDiPickerComponent as ɵbz, EntityPickerService as ɵc, VanbanDenPickerComponent as ɵca, CongViecPickerComponent as ɵcb, SettingsComponent as ɵcc, SettingsRowComponent as ɵcd, ShareLinkByPermissionComponent as ɵce, TnCheckboxComponent as ɵcf, TnDialogComponent as ɵcg, TnColorPickerComponent as ɵch, TnTinymceComponent as ɵci, TnTabViewComponent as ɵcj, TableDetailFormComponent as ɵck, FileIconPipe as ɵcl, FileSizePipe as ɵcm, QuickAddFormComponent as ɵcn, PreventShiftTabDirective as ɵco, TnTemplateDirective as ɵcp, UserPickerComponent as ɵcq, UserPickerBoxComponent as ɵcr, CoCauToChucTestService as ɵcs, TnAppHelpComponent as ɵct, PathNameService as ɵcu, HelperCurrentPageComponent as ɵcv, TnAppNotificationListComponent as ɵcw, TnAppNotificationComponent as ɵcx, FolderFormComponent as ɵcy, FileFormComponent as ɵcz, ExceptionHandlerService as ɵd, FileViewerComponent as ɵda, FileVersionListComponent as ɵdb, ViewDetailComponent as ɵdc, ReferenceTextBoxComponent as ɵdd, QrCodeGeneratorComponent as ɵde, AddNewsComponent as ɵdf, ArticleService as ɵdg, NewsCategoryService as ɵdh, UniversalLinkProcessorComponent as ɵdi, SignatureDetailComponent as ɵdj, KySoSimDanhSachChuKyComponent as ɵdk, KySoSimChuKyUserService as ɵdl, FileKySoSimComponent as ɵdm, KySoSimSignPDFService as ɵdn, TaiLieuCuaToiComponent as ɵdo, KhaiThacTaiLieuDungChungComponent as ɵdp, DanhMucDungChungService as ɵdq, TnTemplateComponent as ɵdr, DropdownSettingFormComponent as ɵds, CheckReadyComponent as ɵdt, TnAccordionTabComponent as ɵdu, SettingsWorkflowComponent as ɵdv, SettingAuthorizeButtonComponent as ɵdw, BasePermissionService as ɵdx, SettingsWorkflowNo1Component as ɵdy, ListBase as ɵe, ListComponentBase as ɵf, TreeTableComponent as ɵg, NotFoundComponent as ɵh, SendAccessTokenInterceptor as ɵi, LogInterceptor as ɵj, PermissionUtilsInterceptor as ɵk, TraceInterceptor as ɵl, EntityPermissionService as ɵm, ChatService as ɵn, MyDriveService as ɵo, ContentsService as ɵp, StatusExtendsService as ɵq, MessageBoardService as ɵr, FileExplorerNewService as ɵs, FileVersionService as ɵt, FileManagerService as ɵu, DM_ChucVuService as ɵv, RoleService as ɵw, AddressComponent as ɵx, AdvanceSearchComponent as ɵy, AutoCompletePickerComponent as ɵz };
+export { AccessDeniedComponent, Action, ActionChoYKienBase, ActionThuHoiBase, ActionUpdateModel, AddressControlSchema, AddressService, AdvanceSearchData, AdvanceSearchSetting, AfterViewCheckedComponent, AnnouncementReadsService, AnnouncementsService, AppComponentBase, AppListService, ApplicationContextService, ApprovalPipe, ArrayPair, AtLeastOneRowTableValidator, AuthenService, AuthorizeDirective, AutoCompleteControlSchema, AutoCompletePickerControlSchema, AutocompleteDatasourceComponent, AvatarUploaderComponent, BaseMenuService, BaseModule, BaseService, BooleanFormatPipe, ButtonAction, ButtonControlSchema, ButtonPermission, ButtonPermissions, ButtonTextActionCongViec, CONFIG_CALENDAR_VIETNAMESE, CalculationEngineService, CanBoHoSoService, CanBo_HoSo_CoCauToChucService, CauHinhWorkflowService, CccdValidator, CellExcel, ChatBoxComponent, ChatSendMessageBoxComponent, CheckBoxListControlSchema, CheckControlVisibleService, CheckDuplicateFieldsValidator, CheckDuplicateValidator, CheckboxControlSchema, ChipsControlSchema, ClientV5Service, CoCauToChucControlSchema, CoCauToChucNewService, CoCauToChucPickerComponent, CoCauToChucPickerControlSchema, CoCauToChucPickerControlSchemaNew, CoCauToChucService, CodeValidator, ColorBlack, ColorControlSchema, ColorPickerControlSchema, ColorWhite, Column, ColumnSchemaBase, ColumnSetting, ColumnSettingDetail, ComCtxConstants, CommandType, CommonDashboardComponent, CommonErrorCode, CommonLibComponent, CommonSearchFormComponent, CommonService, CompareValidator, ComponentBase, ComponentBaseWithButton, ComponentConstants, ComponentContextService, ConditionalBuilderService, CongViecPickerControlSchema, CongViecService, ContainerSchema, ControlTreeNode, ControlType, ConvertMoneyToWordPipe, CoreConfigService, CrudBase, CrudFormComponent, CrudFormCustomFunction, CrudFormData, CrudFormSetting, CrudListComponent, CrudListConfig, CrudListCustomFunction, CrudListData, CrudListHelper, CrudListSetting, CrudService, CustomControlSchema, CustomRouterService, CustomizeUiModel, CustomizeUiService, DanhmucApiService, DataExcel, DataFormBase, DataListBase, DataSourceControlSchema, DataSourceGioiTinh, DataSourcePermissionBase, DataSourceWorkflowCoreStatus, DataType, DateCompareValidator, DateTimeControlSchema, DateTimeRangeControlSchema, DbOrganizationOrganizationService, DbOrganizationPositionService, Deadline, DeadlineType, DhvinhGuardService, DialogModel, DmChucVuService, DmLoaiCongViecService, DomService, DownloadLinkService, DropdownComponent, DropdownControlSchema, DropdownOptions, DummyWorkflowCode, DynamicComponentService, ENUM_DON_VI_HANH_CHINH, EXPLORER_TYPES, EXPORT_VERSION_V4, EXPORT_VERSION_V5, EditFileCommand, EditorControlSchema, EformService, EmailValidator, EntityMedataDataSetting, EntityMetadataService, EntityPickerColumn, EntityPickerControlSchema, EntityWorkflowHistoryService, EntityWorkflowType, EnumActionType, EnumAppSwitcherCode, EnumCanBo, EnumControlPickerType, EnumFileLayout, EnumGetRefType, EnumGioiTinh, EnumHocHamHocVi, EnumLoaiVanBanBase$1 as EnumLoaiVanBanBase, EnumPermissionType, EnumProcessWorkflowType, EnumProperties, EnumStateType, EnumTargetType, EnumTypeSplash, EnumUserRule, EnumUserSource, EnumWFNhomTrangThai, EnumWorkflowCheckboxOption, EnumWorkflowCoreCodeSettingKey, EnumWorkflowHistoryStatus, ErrorType, EventData, EventType, ExactOneValueInTableValidator, ExportAllMode, ExportItem, ExportItemType, ExportItemsMode, ExportManyModel, ExportManyResultModel, ExportModel, ExportService, ExportWithoutTemplateModel, Extension, ExtensionsConst, FILE_TYPES, FederationService, FieldCheckboxCrudList, FieldColExpandCrudList, FieldColReorderCrudList, FieldDefineHasTask, FieldDefineIsTaskFormControl, FieldDefineIsWorkflowControl, FieldFunctionCrudList, FieldIndexInDataSource, FieldOrderCrudList, FieldRowSpan, FieldWorkflowCodeInCrudForm, FileDataService, FileExplorerService, FileExtensions, FileManagerComponent, FileManagerControlSchema, FileManagerMode, FileManagerSetting, FileObjectService, FilePickerDialogComponent, FilePickerSetting, FileType, FileTypeFlag, FileUploadComponent, FileUploadControlSchema, FileUploadMode, FileUploadSetting, FileV4Service, Filter, FolderService, FormControlBase, FormControlBaseWithService, FormSchemaBase, FormSchemaBaseWithService, FormState, Gender, GenerateLinkDownloadDTO, GenericGuardChildService, GenericGuardService, GlobalService, GmailCorrector, GridInfo, GuardService, GuardSvService, HeightType, HighPerformanceService, HighlightPipe, HoSoDoiTacService, HtmlFormatPipe, HtmlPreviewControlSchema, HttpOptions, ImageService, ImageUploaderControlSchema, Include, KeyFieldGetRefType, KeyFilterStateByMenuCongViec, KeyFlashShow, KeyFunctionReload, KeyValueComponent, KeyValueControlSchema, LabelSchema, LabelWFNhomTrangThai, LabelWorkflowCoreStatus, LengthValidator, ListHelperService, LoaiPhieuDeXuat, LocalCacheService, LowerCorrector, MA_THONG_BAO_PHAN_HE, MaActionBatDauQuyTrinh, ManagerType, MaskControlSchema, MasterDataItem, MasterDataPipe, MasterDataService, MenuService, MenuSource, MergeConfigModel, MethodResult, ModelKySoDonVi, ModelSchema, ModuleConfigService, MultiTranslateHttpLoader, MultipleReferenceDataFormatPipe, NameValidator, NotificationObjectType, NotificationService, NotifierService, NotifierType, NumberCompareValidator, NumberOnlyValidator, NumberRangeControlSchema, Operator, OrganizationFormatPipe, OrganizationNameFormatPipe, OrganizationPickerControlSchema, OrganizationService, OrganizationsFormatPipe, PageInfo, PageSetting, Pair, PassportValidator, PasswordValidator, Pattern, PercentControlSchema, PermissionBase, PermissionConstant, PermissionName, PermissionService, PermissionStorage, PermissionTypes, PermissionUtilsComponent, PersonalSetting, PhanQuyenModel, PhoneNumberValidator, PhoneValidator, PopupSize, PositionService, PrintService, PublicFunction, QueryBuilderComponent, QueryBuilderGroupComponent, QueryBuilderRuleComponent, QueryGroup, QueryRule, RELOAD_FILE_LIST, RadioButtonListControlSchema, RandomDataService, RefField, ReferenceDataFormatPipe, ReferenceTextControlSchema, RegexSplitFieldByItem, ReponseResult, RequiredFieldsValidator, RequiredValidator, RowColorOption, RowExcel, SHARE_COMPONENT_ID, SHARE_EVENT, SafeHtmlPipe, SafeStylePipe, SafeUrlPipe, SameValueValidator, ScalarValueValidator, SchemaBase, SecurePipe, ServiceFileUploadComponent, ServiceRequestModel, ServiceRequestModelV5, SessionTypes, SharedFolderType, SignalRService, SimpleDicItem, SimpleDictionary, Sort, SortDirs, SpanControlSchema, SplashComponentComponent, StartupBusinessComponentBase, StateMachinesService, Status, StatusAction, StatusGroup, StatusOption, StatusOrg, StatusUser, StorageService, StorageUpdatedService, StringCompareOption, StringFormatPipe, SummaryPipe, SwitchControlSchema, TBL_DM_COSODAOTAO_CONSTS, TBL_DM_PHONGHOC_CONSTS, TBL_KTX_NGUOITHUE_HOSO, TBL_TS_PHIEUDEXUAT, TBL_TS_TAISANCODINH_CONSTS, TabViewData, TableSchema, TagSeparator, TaiLieuComponent, TaxCodeValidator, TemplateConstant, TemplateControlSchema, TemplateInstanceService, TemplateService, TemplateTextItem, TemplateTextMany, TemplateTextV4Service, TemplateType, TemplateV4Service, TenContainer, TextAlign, TextAreaControlSchema, TextControlSchema, TextControlSchemaWithService, TitleSchema, TnClientCommand, TnClientService, TnComponentConfig, TnCustomScrollbarComponent, TnDatePipe, TnMenu, TnMenuItem, TnReorderableColumnDirective, TnReorderableRowDirective, TnSortIcon, TnSortableColumnDirective, TnTreeTableToggler, TnUser, TnxSharedModule, TopicReloadCongViecV5, TopicReloadCountCongViecV5, TopicReloadNotification, TrangThaiMasterData, TrangThais, TreeDataOption, TreeListBase, TreeNode, TrimCorrector, TrimEndCorrector, TrimStartCorrector, TypeDanhMucAPI, UniqueFieldInTableValidator, UniqueNumberService, UpperCorrector, UserGroupRealService, UserGroupService, UserOnlineDetailsService, UserPickerControlSchema, UserPickerDialogComponent, UserPublicInfo, UserService, UserType, UserV5Service, Validation, ValueType, VanBanPickerControlSchema, ViewContainerRefDirective, VirtualBaseService, WfAction, WfItem, WfMachine, WfSchema, WorkflowConfigAdvance, WorkflowCoreStatusEnum, WorkflowFieldStateCode, WorkflowHistoryService, WorkflowPermissionDetailService, WorkflowService, WorkflowSetting, WorkflowSettingNew, WorkflowSettingsService, WorkflowTargetDefaultValue, WrapPickerControlSchema, addDay, addZero, appendDefaultFilter, clearAll, clone, cloneOld, coreDeclaration, coreModuleImport, coreProvider, dataSourceIcon, dateDiff, fileTypeSource, genQueryFromFilters, getDateFromStringDateVN, getDayOfWeek, getEnvironmentByName, getEnvironmentData, getListMenuByName, getMenuData, getMonday, getStringDate, getStringDateTime, getStringDateVN, getStringDateVNLocal, getTimeSpan, isArray, isBoolean, isDate, isFunction, isLiteralObject, isNumber, isObjectOld, isRegular, isSimpleType, isString, isValidDate, isValidTime, keyUserSurveyLocal, loadRemoteModule, loadRemotePageModule, mapProperty, maximumPageSize, mergeJSON, mergeJSONOld, moduleConfigFunc, monthDiff, multipleSort, romanize, ɵ0$2 as ɵ0, ɵ1$1 as ɵ1, ɵ2$1 as ɵ2, ɵ3, ɵ4, LoggerService as ɵa, DropdownService as ɵb, ImageUploaderComponent as ɵba, CheckBoxListComponent as ɵbb, CoCauToChucPickerListComponent as ɵbc, CoCauToChucPickerListNewComponent as ɵbd, FormBuilderComponent as ɵbe, DatetimePickerComponent as ɵbf, DatetimePickerRangeComponent as ɵbg, EntityPickerBoxComponent as ɵbh, EntityPickerDataComponent as ɵbi, EntityPickerSelectedComponent as ɵbj, EntityPickerComponent as ɵbk, EntityPickerSearchFormComponent as ɵbl, EntityPickerDialogComponent as ɵbm, EntityPickerTreeDataComponent as ɵbn, EntityPickerTreeSelectedComponent as ɵbo, EntityPermissionComponent as ɵbp, EquationEditorComponent as ɵbq, MaskComponent as ɵbr, NumberPickerRangeComponent as ɵbs, PagingNextBackOnlyComponent as ɵbt, RadioButtonListComponent as ɵbu, VanBanPickerComponent as ɵbv, VanBanDenService as ɵbw, VanBanDiService as ɵbx, VanBanPickerDialogComponent as ɵby, VanbanDiPickerComponent as ɵbz, EntityPickerService as ɵc, VanbanDenPickerComponent as ɵca, CongViecPickerComponent as ɵcb, SettingsComponent as ɵcc, SettingsRowComponent as ɵcd, ShareLinkByPermissionComponent as ɵce, TnCheckboxComponent as ɵcf, TnDialogComponent as ɵcg, TnColorPickerComponent as ɵch, TnTinymceComponent as ɵci, TnTabViewComponent as ɵcj, TableDetailFormComponent as ɵck, FileIconPipe as ɵcl, FileSizePipe as ɵcm, QuickAddFormComponent as ɵcn, PreventShiftTabDirective as ɵco, TnTemplateDirective as ɵcp, UserPickerComponent as ɵcq, UserPickerBoxComponent as ɵcr, CoCauToChucTestService as ɵcs, TnAppHelpComponent as ɵct, PathNameService as ɵcu, HelperCurrentPageComponent as ɵcv, TnAppNotificationListComponent as ɵcw, TnAppNotificationComponent as ɵcx, FolderFormComponent as ɵcy, FileFormComponent as ɵcz, ExceptionHandlerService as ɵd, FileViewerComponent as ɵda, FileVersionListComponent as ɵdb, ViewDetailComponent as ɵdc, ReferenceTextBoxComponent as ɵdd, QrCodeGeneratorComponent as ɵde, AddNewsComponent as ɵdf, ArticleService as ɵdg, NewsCategoryService as ɵdh, UniversalLinkProcessorComponent as ɵdi, SignatureDetailComponent as ɵdj, KySoSimDanhSachChuKyComponent as ɵdk, KySoSimChuKyUserService as ɵdl, FileKySoSimComponent as ɵdm, KySoSimSignPDFService as ɵdn, TaiLieuCuaToiComponent as ɵdo, KhaiThacTaiLieuDungChungComponent as ɵdp, DanhMucDungChungService as ɵdq, TnTemplateComponent as ɵdr, DropdownSettingFormComponent as ɵds, CheckReadyComponent as ɵdt, TnAccordionTabComponent as ɵdu, SettingsWorkflowComponent as ɵdv, SettingAuthorizeButtonComponent as ɵdw, BasePermissionService as ɵdx, SettingsWorkflowNo1Component as ɵdy, HtmlPreviewComponent as ɵdz, ListBase as ɵe, ListComponentBase as ɵf, TreeTableComponent as ɵg, NotFoundComponent as ɵh, SendAccessTokenInterceptor as ɵi, LogInterceptor as ɵj, PermissionUtilsInterceptor as ɵk, TraceInterceptor as ɵl, EntityPermissionService as ɵm, ChatService as ɵn, MyDriveService as ɵo, ContentsService as ɵp, StatusExtendsService as ɵq, MessageBoardService as ɵr, FileExplorerNewService as ɵs, FileVersionService as ɵt, FileManagerService as ɵu, DM_ChucVuService as ɵv, RoleService as ɵw, AddressComponent as ɵx, AdvanceSearchComponent as ɵy, AutoCompletePickerComponent as ɵz };
 //# sourceMappingURL=tnx-shared.js.map