tnx-shared 5.1.349 → 5.1.352

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/bundles/tnx-shared.umd.js +268 -141
  2. package/bundles/tnx-shared.umd.js.map +1 -1
  3. package/bundles/tnx-shared.umd.min.js +1 -1
  4. package/bundles/tnx-shared.umd.min.js.map +1 -1
  5. package/classes/base/data-form-base.d.ts.map +1 -1
  6. package/classes/form-schema.d.ts +3 -2
  7. package/classes/form-schema.d.ts.map +1 -1
  8. package/components/common-app-component/app.menu.component.d.ts +3 -2
  9. package/components/common-app-component/app.menu.component.d.ts.map +1 -1
  10. package/components/common-app-component/common-app-component.d.ts +1 -0
  11. package/components/common-app-component/common-app-component.d.ts.map +1 -1
  12. package/components/crud/crud-form/crud-form.component.d.ts.map +1 -1
  13. package/components/file-explorer/file-manager/file-manager.component.d.ts +7 -5
  14. package/components/file-explorer/file-manager/file-manager.component.d.ts.map +1 -1
  15. package/components/file-explorer/services/file-data.service.d.ts +4 -0
  16. package/components/file-explorer/services/file-data.service.d.ts.map +1 -1
  17. package/components/tn-tabview/tn-tabview.component.d.ts +7 -7
  18. package/components/tn-tabview/tn-tabview.component.d.ts.map +1 -1
  19. package/components/workflow/process-workflow-form/process-workflow-form.component.d.ts.map +1 -1
  20. package/esm2015/classes/base/data-form-base.js +3 -3
  21. package/esm2015/classes/form-schema.js +12 -12
  22. package/esm2015/components/common-app-component/app.menu.component.js +20 -13
  23. package/esm2015/components/common-app-component/common-app-component.js +4 -3
  24. package/esm2015/components/crud/crud-form/crud-form.component.js +6 -2
  25. package/esm2015/components/crud/crud-list/crud-list.component.js +2 -2
  26. package/esm2015/components/file-explorer/file-manager/file-manager.component.js +15 -10
  27. package/esm2015/components/file-explorer/services/file-data.service.js +84 -32
  28. package/esm2015/components/tn-tabview/tn-tabview.component.js +54 -42
  29. package/esm2015/components/workflow/process-workflow-form/process-workflow-form.component.js +13 -1
  30. package/esm2015/public-api.js +2 -1
  31. package/esm2015/services/menu.service.js +13 -15
  32. package/esm2015/services/notification.service.js +9 -1
  33. package/esm2015/services/permission.service.js +3 -5
  34. package/fesm2015/tnx-shared.js +220 -123
  35. package/fesm2015/tnx-shared.js.map +1 -1
  36. package/package.json +2 -2
  37. package/public-api.d.ts +1 -0
  38. package/public-api.d.ts.map +1 -1
  39. package/services/menu.service.d.ts.map +1 -1
  40. package/services/notification.service.d.ts +3 -0
  41. package/services/notification.service.d.ts.map +1 -1
  42. package/services/permission.service.d.ts.map +1 -1
  43. package/tnx-shared.metadata.json +1 -1
@@ -1710,6 +1710,17 @@
1710
1710
  _this.rowButtonTemplate = null;
1711
1711
  _this.summaryTemplate = null;
1712
1712
  _this.headerTemplate = null;
1713
+ _this.disableChildrenControl = function (schemas) {
1714
+ schemas.forEach(function (schema) {
1715
+ schema.disabled = true;
1716
+ if (schema instanceof TableSchema) {
1717
+ _this.disableChildrenControl(schema.rowTemplate);
1718
+ }
1719
+ else if (schema instanceof ContainerSchema) {
1720
+ _this.disableChildrenControl(schema.controls);
1721
+ }
1722
+ });
1723
+ };
1713
1724
  for (var key in init) {
1714
1725
  _this[key] = init[key];
1715
1726
  }
@@ -1718,18 +1729,6 @@
1718
1729
  TableSchema.prototype.disableControl = function () {
1719
1730
  this.disableChildrenControl(this.rowTemplate);
1720
1731
  };
1721
- TableSchema.prototype.disableChildrenControl = function (schemas) {
1722
- var _this = this;
1723
- schemas.forEach(function (schema) {
1724
- schema.disabled = true;
1725
- if (schema instanceof TableSchema) {
1726
- _this.disableChildrenControl(schema.rowTemplate);
1727
- }
1728
- else if (schema instanceof ContainerSchema) {
1729
- _this.disableChildrenControl(schema.controls);
1730
- }
1731
- });
1732
- };
1733
1732
  return TableSchema;
1734
1733
  }(FormControlBase));
1735
1734
  var ColumnSchemaBase = /** @class */ (function (_super) {
@@ -11402,7 +11401,7 @@
11402
11401
  switch (_d.label) {
11403
11402
  case 0:
11404
11403
  _d.trys.push([0, 2, , 3]);
11405
- user = (this._userService.getCurrentUser());
11404
+ user = this._userService.getCurrentUser();
11406
11405
  if (i0.isDevMode()) {
11407
11406
  return [2 /*return*/, true];
11408
11407
  }
@@ -11493,10 +11492,8 @@
11493
11492
  var tempUserPointer = userPermissionPointer;
11494
11493
  var tempToCheckPointer = permissionToCheckPointer;
11495
11494
  while (userPermission[tempUserPointer] != '}') {
11496
- var userChar_1 = userPermission[tempUserPointer].toLowerCase();
11497
- var permissionChar = permissionToCheck[tempToCheckPointer].toLowerCase();
11498
11495
  // ký tự khác nhau => break khỏi vòng kiểm tra trong
11499
- if (userChar_1 != permissionChar) {
11496
+ if (userPermission[tempUserPointer].toLowerCase() != permissionToCheck[tempToCheckPointer].toLowerCase()) {
11500
11497
  breakInnerLoop = true;
11501
11498
  break;
11502
11499
  }
@@ -16995,7 +16992,7 @@
16995
16992
  CrudFormComponent.decorators = [
16996
16993
  { type: i0.Component, args: [{
16997
16994
  selector: 'crud-form',
16998
- template: "<div [class]=\"_styleClass\">\r\n <form #formElement autocomplete=\"off\" autocorrect=\"off\" spellcheck=\"false\"\r\n [class]=\"'p-grid form-group crud-form' + (formClass ? ' ' + formClass : '')\"\r\n (keydown.shift.tab)=\"preventBlur($event)\">\r\n <div class=\"p-grid p-col-12\" style=\"margin: 0\">\r\n <ng-container *ngFor=\"let control of setting.schema\">\r\n <ng-container\r\n *ngTemplateOutlet=\"customControl; context: {control: control, data: _modelData, parentPath: '', path: control.field, showLabel: control.showLabel, mdWidth: control.mdWidth}\">\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </form>\r\n</div>\r\n<p-contextMenu #contextMenu [appendTo]=\"'body'\" [model]=\"buttonContexts\">\r\n</p-contextMenu>\r\n<ng-template #customControl let-data=\"data\" let-control=\"control\" let-showLabel=\"showLabel\" let-mdWidth=\"mdWidth\"\r\n let-rowIndex=\"index\" let-path=\"path\" let-parentPath=\"parentPath\" let-tablePath=\"tablePath\">\r\n <div *ngIf=\"!checkHidden(control, data, path)\" id=\"{{path}}-holder\"\r\n class=\"p-col-{{control.gWidth}} p-md-{{mdWidth}} {{control.class}} crud-form-control type-{{control.dataType}}\"\r\n [class.error]=\"data._errors[control.field].length > 0\"\r\n [class.not-show-in-box-holder]=\"control.showInBox === false\"\r\n [class.show-in-box-holder]=\"control.showInBox === true\" [ngStyle]=\"control.style\">\r\n <div class=\"label\" *ngIf=\"showLabel\">\r\n <label *ngIf=\"control.label\" [pTooltip]=\"control.fullLabel\" tooltipPosition=\"top\">{{control.label}}\r\n <span *ngIf=\"control.required\" class=\"star-required\">*</span></label>\r\n <span *ngIf=\"control.description\" class=\"control-description\">({{control.description}})</span>\r\n </div>\r\n <ng-container [ngSwitch]=\"control.controlType\">\r\n <ng-container *ngSwitchCase=\"'label'\">\r\n <ng-container [ngTemplateOutlet]=\"labelControl\"\r\n [ngTemplateOutletContext]=\"{control: control, data: data}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'title'\">\r\n <label *ngIf=\"!control.ishtml\" [for]=\"control.for\">{{control.text | translate}}</label>\r\n <label *ngIf=\"control.ishtml\" [innerHTML]=\"control.text | translate\"></label>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'text'\">\r\n <div class=\"p-inputgroup\" *ngIf=\"control.suffFix\">\r\n <input [placeholder]=\"control.placeholder\"\r\n [required]=\"control.validators && control.validators.required\"\r\n [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText\r\n [type]=\"control.dataFormat\" [(ngModel)]=\"data[control.field]\" [max]=\"control.max\"\r\n [min]=\"control.min\" [maxlength]=\"control.maxLength\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (key.enter)=\"handleFieldValueChange(control, $event, eventType.ENTER, data, parentPath)\" />\r\n <span class=\"p-inputgroup-addon\">({{control.suffFix}})</span>\r\n </div>\r\n <input *ngIf=\"!control.suffFix\" [placeholder]=\"control.placeholder\"\r\n [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText [type]=\"control.dataFormat\"\r\n [(ngModel)]=\"data[control.field]\" [max]=\"control.max\" [min]=\"control.min\"\r\n [maxlength]=\"control.maxLength\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (key.enter)=\"handleFieldValueChange(control, $event, eventType.ENTER, data, parentPath)\" />\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'reference-text'\">\r\n <reference-textbox [control]=\"control\" [value]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"></reference-textbox>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'template'\">\r\n <ng-container [ngTemplateOutlet]=\"control.template\"\r\n [ngTemplateOutletContext]=\"{$implicit: _rootNode, control: control, data: data, tablePath: tablePath, parentPath: parentPath, rowIndex: rowIndex, funcUpdateModel: updateModelFromExternal}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'mask'\">\r\n <tn-mask [prefix]=\"control.prefix\" [decimalPlaces]=\"control.decimalPlaces\" [suffix]=\"control.suffix\"\r\n [placeholder]=\"control.placeholder\" [disabled]=\"checkDisabled(data, control)\"\r\n [maskType]=\"control.maskType\" [autoFormat]=\"control.autoFormat\" [min]=\"control.min\"\r\n [max]=\"control.max\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </tn-mask>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'numberrange'\">\r\n <tn-number-picker-range [decimalPlaces]=\"control.decimalPlaces\"\r\n [disabled]=\"checkDisabled(data, control)\" [maskType]=\"control.maskType\" [min]=\"control.min\"\r\n [max]=\"control.max\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (search)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (blur)=\"handleFieldValueChange(control, $event, eventType.BLUR, data, parentPath)\">\r\n </tn-number-picker-range>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'money'\">\r\n <input currencyMask [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText type=\"tel\"\r\n [(ngModel)]=\"data[control.field]\"\r\n [options]=\"{prefix: '', thousands: '.', decimal: ',',precision:control.dataFormat === 'money'?0:0 }\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\" />\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'phoneOrfax'\">\r\n <input [placeholder]=\"control.dataFormat==='phone'?'(999) 999-9999':'999-999-9999'\"\r\n [attr.disabled]=\"checkDisabled(data, control) ? true : null\" type=\"tel\" pInputText\r\n [(ngModel)]=\"data[control.field]\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\" />\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'textarea'\">\r\n <textarea pInputTextarea [rows]=\"control.rows ? control.rows : 5\"\r\n [attr.disabled]=\"checkDisabled(data, control) ? true : null\" [(ngModel)]=\"data[control.field]\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"></textarea>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'editor'\">\r\n <tn-tinymce *ngIf=\"!checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n [required]=\"control.validators && control.validators.required\" [mode]=\"control.mode\"\r\n [height]=\"control.height ? control.height : 250\" [languageCode]=\"control.languageCode\"\r\n [disabled]=\"control.disabled || (control.disableCheck && control.disableCheck(model))\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </tn-tinymce>\r\n <div *ngIf=\"checkDisabled(data, control)\" class=\"html-box\"\r\n [innerHTML]=\"data[control.field] ? (data[control.field] | safeHtml) : ''\">\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'datetime'\">\r\n <datetime-picker [(ngModel)]=\"data[control.field]\" [disabled]=\"checkDisabled(data, control)\"\r\n [control]=\"control\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </datetime-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocomplete'\">\r\n <app-autocomplete-datasource [control]=\"control\"\r\n [suggestions]=\"data._source[control.field] || control.dataSource\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onValueChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </app-autocomplete-datasource>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'datetimerange'\">\r\n <tn-datetime-picker-range [disabled]=\"control.disabled\" [control]=\"control\"\r\n [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </tn-datetime-picker-range>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dropdown'\">\r\n <dropdown [control]=\"control\" [dataSource]=\"getControlDataSource(control, data)\"\r\n [(value)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleChangeDropdown(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onHideSmartEvent)=\"handleChangeDropdown(control, $event, eventType.HIDE, data, parentPath)\"\r\n (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\r\n (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\"\r\n (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n </dropdown>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'fileManager'\">\r\n <file-manager [control]=\"control\" [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\r\n [entityKey]=\"control.entityKey ? control.entityKey : data[control.entityKeyField]\"\r\n [readonly]=\"control.disabled\" [layout]=\"control.layout\" [maxFileSize]=\"control.maxFileSize\"\r\n [inTaiLieu]=\"control.inTaiLieu\" [inTaiLieuChung]=\"control.inTaiLieuChung\"\r\n [copyToFolderId]=\"control.copyToFolderId\"\r\n [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\r\n [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\r\n [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\r\n [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\r\n [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\r\n [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\"\r\n [(value)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onSelected)=\"control.onSelected($event)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n </file-manager>\r\n </ng-container>\r\n <span *ngSwitchCase=\"'fileUpload'\">\r\n <file-upload [(ngModel)]=\"data[control.field]\" [sharedFolderType]=\"control.sharedFolderType\"\r\n [maxFileSize]=\"control.maxFileSize\"\r\n [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\r\n [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\r\n [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\r\n [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\r\n [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\r\n [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\"\r\n [readonly]=\"control.readonly\" [accept]=\"control.accept\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </file-upload>\r\n </span>\r\n <span *ngSwitchCase=\"'serviceFileUpload'\">\r\n <service-file-upload [(ngModel)]=\"data[control.field]\" [parentContext]=\"context\"\r\n [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\r\n [entityKey]=\"data[control.entityKeyField]\" [control]=\"control\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </service-file-upload>\r\n </span>\r\n <ng-container *ngSwitchCase=\"'user-picker'\">\r\n <user-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [readOnlyValues]=\"data[control.field + '_readOnly']\" [(ngModel)]=\"data[control.field]\"\r\n [multiple]=\"control.multiple\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n </user-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'switch'\">\r\n <p-inputSwitch [(ngModel)]=\"data[control.field]\" [disabled]=\"checkDisabled(data, control)\"\r\n (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </p-inputSwitch>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'checkbox'\">\r\n <div [class]=\"control.class\" role=\"checkbox-alone\">\r\n <p-checkbox [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n [label]=\"!control.hiddenLabel ? control.label : null\"\r\n (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\" binary=\"true\">\r\n </p-checkbox>\r\n <!-- <tn-checkbox [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [(ngModel)]=\"data[control.field]\"\r\n (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"></tn-checkbox> -->\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'button'\">\r\n <button type=\"button\" pButton [class]=\"control.btClass\" [icon]=\"control.icon\"\r\n [label]=\"control.label | translate\" [ngStyle]=\"control.btStyle\"\r\n (click)=\"handleButtonClick(control, $event, parentPath)\"></button>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'container'\">\r\n <div class=\"p-grid p-col-12\" style=\"margin: 0\" [class.not-show-in-box]=\"!control.showInBox\"\r\n [class.show-in-box]=\"control.showInBox\" [ngStyle]=\"control.boxStyle\">\r\n <ng-container *ngFor=\"let subControl of control.controls\">\r\n <ng-container\r\n *ngTemplateOutlet=\"customControl; context: {control: subControl, data: data[control.field], parentPath: path, rowIndex: rowIndex, path: path + '.' + subControl.field, showLabel: subControl.showLabel, mdWidth: subControl.mdWidth}\">\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'checkboxlist'\">\r\n <check-box-list [control]=\"control\" [dataSource]=\"data._source[control.field] || control.dataSource\"\r\n [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onSelect)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n </check-box-list>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'radiobuttonlist'\">\r\n <radio-button-list [control]=\"control\" [dataSource]=\"control.dataSource\"\r\n [disabled]=\"checkDisabled(data, control)\" [(value)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\r\n (onReady)=\"handleReadyControlPicker(control, parentPath)\"\r\n (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\">\r\n </radio-button-list>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'colorPicker'\">\r\n <tn-color-picker [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </tn-color-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'spanControl'\">\r\n <span *ngIf=\"!control.ishtml\">{{data[control.field]}}</span>\r\n <span *ngIf=\"control.ishtml\" [innerHTML]=\"data[control.field]\"></span>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'colorControl'\">\r\n <span class=\"show-color-control\" [ngStyle]=\"{ backgroundColor: data[control.sourceField]}\"></span>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'address'\">\r\n <address-picker [control]=\"control\" [showSubLabel]=\"control.showSubLabel\"\r\n [disabled]=\"checkDisabled(data, control)\" [(data)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onSelect)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n </address-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocomplete-picker'\">\r\n <autocomplete-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [required]=\"control.required\" [readOnlyValues]=\"data[control.field + '_readOnly']\"\r\n [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n </autocomplete-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'entity-picker'\">\r\n <entity-picker [control]=\"control\" [children]=\"children\" [disabled]=\"checkDisabled(data, control)\"\r\n [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </entity-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'cocautochuc'\">\r\n <cocautochuc-picker [control]=\"control\" [parentOrgId]=\"control.parentOrgId\"\r\n [disabled]=\"checkDisabled(data, control)\" [parentOrgCode]=\"control.parentOrgCode\"\r\n [filter]=\"control.filter\" [multiple]=\"control.multiple\" [required]=\"control.required\"\r\n [isUsingId]=\"control.isUsingId\" [disabledParentItem]=\"control.disabledParentItem\"\r\n [rootParentId]=\"control.rootParentId\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </cocautochuc-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'cocautochuc-picker'\">\r\n <cocautochuc-picker-list [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [required]=\"control.required\" [readOnlyValues]=\"data[control.field + '_readOnly']\"\r\n [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n </cocautochuc-picker-list>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'vanban'\">\r\n <vanban-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [required]=\"control.required\" [readOnly]=\"control.readOnly\" [loaiVanBan]=\"control.loaiVanBan\"\r\n [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </vanban-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'congviec'\">\r\n <div>\r\n <congviec-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </congviec-picker>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'percent'\">\r\n <div>\r\n <tn-mask [suffix]=\"'%'\" [placeholder]=\"control.placeholder\" [maskType]=\"'int'\"\r\n [autoFormat]=\"control.autoFormat\" [min]=\"0\" [max]=\"100\"\r\n [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </tn-mask>\r\n <p-slider [step]=\"1\" [min]=\"0\" [max]=\"100\" [disabled]=\"checkDisabled(data, control)\"\r\n [(ngModel)]=\"data[control.field]\"\r\n (onSlideEnd)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </p-slider>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'table'\">\r\n <div [class]=\"control.class\">\r\n <tn-custom-scrollbar class=\"--has-border\" [showScrollHorizontal]=\"true\">\r\n <p-table class=\"new-table scr-table table-control\" [value]=\"data[control.field]\"\r\n [columns]=\"control.headerTemplate\" [responsive]=\"true\" [scrollable]=\"false\"\r\n [rowTrackBy]=\"trackByFuncId\"\r\n (onRowReorder)=\"handleRowOrdered(control, $event, eventType.ROW_REORDER, data, parentPath)\">\r\n <ng-template pTemplate=\"colgroup\">\r\n <colgroup>\r\n <col *ngIf=\"control.showNumber\" style=\"width: 40px\" />\r\n <ng-container *ngFor=\"let subControl of control.rowTemplate\">\r\n <col [style.width]=\"subControl.width\" />\r\n </ng-container>\r\n <col *ngIf=\"control.enableReorderRow\" style=\"width: 30px\" />\r\n <col *ngIf=\"control.showFunction\" [style.width]=\"control.widthFunctionColumn\" />\r\n </colgroup>\r\n </ng-template>\r\n <ng-template *ngIf=\"getComponentByType(_prefixCustomHeader + control.field)\"\r\n pTemplate=\"header\" let-columns>\r\n <ng-container\r\n *ngTemplateOutlet=\"getComponentByType(_prefixCustomHeader + control.field), context: {$implicit: control.headerTemplate, crudForm: this, containerSticky: containerSticky}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"!getComponentByType(_prefixCustomHeader + control.field)\"\r\n pTemplate=\"header\" let-rowData let-columns>\r\n <tr>\r\n <th *ngIf=\"control.showNumber\" style=\"text-align: center\">\r\n {{ 'TT' |translate}}\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <ng-container *ngFor=\"let subControl of control.rowTemplate\">\r\n <th *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\r\n [pTooltip]=\"subControl.fullLabel || subControl.label\" tooltipPosition=\"top\"\r\n style=\"text-align: center;\">\r\n {{subControl.label}}\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </ng-container>\r\n <th *ngIf=\"control.enableReorderRow\">\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <th *ngIf=\"control.showFunction\" class=\"table-function column-function\">\r\n <div class=\"cell-header-function\"><span>Ch\u1EE9c n\u0103ng</span></div>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-ri=\"rowIndex\">\r\n <tr [pReorderableRow]=\"ri\">\r\n <td *ngIf=\"control.showNumber\" class=\"stt\"\r\n style=\"text-align: center; vertical-align: inherit\">\r\n <span>\r\n {{ri + 1}}\r\n </span>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <ng-container *ngFor=\"let subControl of control.rowTemplate; let i = index\">\r\n <td *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\r\n [class.control-inside]=\"true\" [class]=\"subControl.class\"\r\n [ngStyle]=\"{'text-align': getTextAlign(subControl.textAlign), 'vertical-align': 'inherit'}\">\r\n <span class=\"p-column-title\">{{subControl.label}}</span>\r\n <ng-template [ngIf]=\"getControlType(subControl) != 'column'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"customControl; context: getContextTd(subControl, rowData, ri, path)\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template [ngIf]=\"getControlType(subControl) == 'column'\">\r\n <span>{{_modelData[control.field][ri][subControl.field]}}</span>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n </ng-container>\r\n <td *ngIf=\"control.enableReorderRow\" class=\"no-padding center v-center\">\r\n <i class=\"fas fa-arrows-alt\" style=\"cursor:pointer; padding: 8px; color: #555;\"\r\n pReorderableRowHandle></i>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <td *ngIf=\"control.showFunction\" style=\"text-align: center\"\r\n class=\"column-function text-center\">\r\n <div *ngIf=\"!control.rowButtonTemplate\"\r\n class=\"p-toolbar-group-center button-group\">\r\n <button *ngIf=\"control.showSave\" [disabled]=\"rowData._disableSave\"\r\n type=\"button\" pButton class=\"p-button-text p-button-rounded\"\r\n icon=\"pi pi-save\" [pTooltip]=\"'L\u01B0u' | translate\" tooltipPosition=\"top\"\r\n (click)=\"saveRow(ri, control, path)\"></button>\r\n <button *ngIf=\"control.showEdit\" [disabled]=\"rowData._disableEdit\"\r\n type=\"button\" pButton class=\"p-button-text p-button-rounded\"\r\n icon=\"pi pi-pencil\" [pTooltip]=\"'S\u1EEDa' | translate\" tooltipPosition=\"top\"\r\n (click)=\"editRow(ri, control, path)\"></button>\r\n <button *ngIf=\"control.showDelete\" [disabled]=\"rowData._disableDelete\"\r\n type=\"button\" pButton\r\n class=\"p-button-text p-button-danger p-button-rounded\"\r\n icon=\"pi pi-trash\" [pTooltip]=\"'X\u00F3a' | translate\" tooltipPosition=\"top\"\r\n (click)=\"deleteRow(ri, control, path)\"></button>\r\n <button *ngIf=\"control.rowButtons\" type=\"button\" pButton\r\n icon=\"pi pi-ellipsis-v\"\r\n class=\"link-or-action p-button-text p-button-rounded\"\r\n pTooltip=\"Ch\u1EE9c n\u0103ng kh\u00E1c\" tooltipPosition=\"top\"\r\n (click)=\"showContextMenu($event, rowData, control)\"></button>\r\n </div>\r\n <div *ngIf=\"control.rowButtonTemplate\"\r\n class=\"p-toolbar-group-center button-group\">\r\n <ng-container\r\n *ngTemplateOutlet=\"control.rowButtonTemplate; context: {rowData: _modelData[control.field][ri], rowIndex: ri, path: path, control: control}\">\r\n </ng-container>\r\n </div>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n <ng-template *ngIf=\"control.summaryTemplate\" pTemplate=\"summary\" let-rowData>\r\n <ng-container *ngTemplateOutlet=\"control.summaryTemplate; context: {rowData: rowData}\">\r\n </ng-container>\r\n </ng-template>\r\n </p-table>\r\n </tn-custom-scrollbar>\r\n <div *ngIf=\"control.showFooter\" class=\"--table-schema-footer\">\r\n <button *ngIf=\"control.showAdd\" type=\"button\" pButton style=\"width:auto\" label=\"Th\u00EAm m\u1EDBi\"\r\n icon=\"pi pi-plus\" class=\"p-button-text\" (click)=\"addNewRow(control, path)\"></button>\r\n <span *ngIf=\"control.showDialog\" style=\"font-weight: normal;\">\r\n <p-checkbox label=\"M\u1EDF dialog\" [binary]=\"true\" [(ngModel)]=\"control.showEdit\">\r\n </p-checkbox>\r\n </span>\r\n <button *ngIf=\"control.enableAddMulti\" type=\"button\" pButton\r\n style=\"width:auto; margin-left:10px;\" label=\"Th\u00EAm nhi\u1EC1u\" icon=\"pi pi-clone\"\r\n class=\"p-button-text\" (click)=\"addMultiRow(control, 5, path)\"></button>\r\n <button *ngFor=\"let bt of control.footerButtons\" type=\"button\" pButton [class]=\"bt.class\"\r\n [icon]=\"bt.icon\" [label]=\"bt.label | translate\" style=\"width:auto; margin-left:10px;\"\r\n (click)=\"messageRow( -1, control, path)\"></button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container [ngTemplateOutlet]=\"getComponentByType(control.field)\" [ngTemplateOutletContext]=\"{\r\n crudForm: this, data: data, index: rowIndex, parentPath: parentPath, control: control, changeFunc: handleFieldValueChange\r\n }\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"validation; context: {control: control, data: data}\">\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n<ng-template #validation let-control=\"control\" let-data=\"data\">\r\n <ng-container *ngIf=\"data._errors[control.field].length > 0\">\r\n <div class=\"error-container\">\r\n <ng-container *ngFor=\"let error of data._errors[control.field]\">\r\n <div class=\"error-item\" *ngIf=\"error\">\r\n <ng-container [ngTemplateOutlet]=\"errorMessage\" [ngTemplateOutletContext]=\"{content: error}\">\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #errorMessage let-content=\"content\">\r\n <div class=\"error-content\">\r\n <i class=\"pi pi-ban\"></i>\r\n <span> {{content}}</span>\r\n </div>\r\n</ng-template>\r\n<ng-template #labelControl let-control=\"control\">\r\n <ng-container>\r\n <label [class]=\"getLabelClass(control)\" *ngIf=\"!control.ishtml\" [attr.label-index]=\"control.indexLabel\"\r\n [pTooltip]=\"control.title\" tooltipPosition=\"top\" tooltipStyleClass=\"wrap\" [escape]=\"false\"\r\n [for]=\"control.for\">{{control.text | translate}}</label>\r\n <label [class]=\"getLabelClass(control)\" *ngIf=\"control.ishtml\" [innerHTML]=\"control.text | safeHtml\"\r\n [attr.label-index]=\"control.indexLabel\"></label>\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #containerSticky>\r\n <span class=\"fix-sticky top\"></span>\r\n <span class=\"fix-sticky right\"></span>\r\n <span class=\"fix-sticky left\"></span>\r\n</ng-template>\r\n<ng-template #templateCongViecForm let-control=\"control\">\r\n <base-congviec-form [control]=\"control\" [parentSetting]=\"congViecSetting\" [tenCongViec]=\"control.data.tenCongViec\">\r\n </base-congviec-form>\r\n</ng-template>\r\n<tn-dialog *ngIf=\"tableFormShow\" #dialog [styleClass]=\"'address-form'\" [header]=\"tableFormTitle | translate\"\r\n [popupSize]=\"tableFormPopupSize\" (onHide)=\"tableFormShow = false\">\r\n <table-detail-form #formBase [parentSetting]=\"setting\" [schema]=\"tableFormSchema\" [data]=\"tableFormData\"\r\n (onSaved)=\"handleSavedTableRow($event)\" (onCancel)=\"tableFormShow = false\">\r\n </table-detail-form>\r\n</tn-dialog>",
16995
+ template: "<div [class]=\"_styleClass\">\r\n <form #formElement autocomplete=\"off\" autocorrect=\"off\" spellcheck=\"false\"\r\n [class]=\"'p-grid form-group crud-form' + (formClass ? ' ' + formClass : '')\"\r\n (keydown.shift.tab)=\"preventBlur($event)\">\r\n <div class=\"p-grid p-col-12\" style=\"margin: 0\">\r\n <ng-container *ngFor=\"let control of setting.schema\">\r\n <ng-container\r\n *ngTemplateOutlet=\"customControl; context: {control: control, data: _modelData, parentPath: '', path: control.field, showLabel: control.showLabel, mdWidth: control.mdWidth}\">\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </form>\r\n</div>\r\n<p-contextMenu #contextMenu [appendTo]=\"'body'\" [model]=\"buttonContexts\">\r\n</p-contextMenu>\r\n<ng-template #customControl let-data=\"data\" let-control=\"control\" let-showLabel=\"showLabel\" let-mdWidth=\"mdWidth\"\r\n let-rowIndex=\"index\" let-path=\"path\" let-parentPath=\"parentPath\" let-tablePath=\"tablePath\">\r\n <div *ngIf=\"!checkHidden(control, data, path)\" id=\"{{path}}-holder\"\r\n class=\"p-col-{{control.gWidth}} p-md-{{mdWidth}} {{control.class}} crud-form-control type-{{control.dataType}}\"\r\n [class.error]=\"data._errors[control.field].length > 0\"\r\n [class.not-show-in-box-holder]=\"control.showInBox === false\"\r\n [class.show-in-box-holder]=\"control.showInBox === true\" [ngStyle]=\"control.style\">\r\n <div class=\"label\" *ngIf=\"showLabel\">\r\n <label *ngIf=\"control.label\" [pTooltip]=\"control.fullLabel\" tooltipPosition=\"top\">{{control.label}}\r\n <span *ngIf=\"control.required\" class=\"star-required\">*</span></label>\r\n <span *ngIf=\"control.description\" class=\"control-description\">({{control.description}})</span>\r\n </div>\r\n <ng-container [ngSwitch]=\"control.controlType\">\r\n <ng-container *ngSwitchCase=\"'label'\">\r\n <ng-container [ngTemplateOutlet]=\"labelControl\"\r\n [ngTemplateOutletContext]=\"{control: control, data: data}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'title'\">\r\n <label *ngIf=\"!control.ishtml\" [for]=\"control.for\">{{control.text | translate}}</label>\r\n <label *ngIf=\"control.ishtml\" [innerHTML]=\"control.text | translate\"></label>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'text'\">\r\n <div class=\"p-inputgroup\" *ngIf=\"control.suffFix\">\r\n <input [placeholder]=\"control.placeholder\"\r\n [required]=\"control.validators && control.validators.required\"\r\n [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText\r\n [type]=\"control.dataFormat\" [(ngModel)]=\"data[control.field]\" [max]=\"control.max\"\r\n [min]=\"control.min\" [maxlength]=\"control.maxLength\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (key.enter)=\"handleFieldValueChange(control, $event, eventType.ENTER, data, parentPath)\" />\r\n <span class=\"p-inputgroup-addon\">({{control.suffFix}})</span>\r\n </div>\r\n <input *ngIf=\"!control.suffFix\" [placeholder]=\"control.placeholder\"\r\n [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText [type]=\"control.dataFormat\"\r\n [(ngModel)]=\"data[control.field]\" [max]=\"control.max\" [min]=\"control.min\"\r\n [maxlength]=\"control.maxLength\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (key.enter)=\"handleFieldValueChange(control, $event, eventType.ENTER, data, parentPath)\" />\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'reference-text'\">\r\n <reference-textbox [control]=\"control\" [value]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"></reference-textbox>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'template'\">\r\n <ng-container [ngTemplateOutlet]=\"control.template\"\r\n [ngTemplateOutletContext]=\"{$implicit: _rootNode, control: control, data: data, tablePath: tablePath, parentPath: parentPath, rowIndex: rowIndex, funcUpdateModel: updateModelFromExternal}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'mask'\">\r\n <tn-mask [prefix]=\"control.prefix\" [decimalPlaces]=\"control.decimalPlaces\" [suffix]=\"control.suffix\"\r\n [placeholder]=\"control.placeholder\" [disabled]=\"checkDisabled(data, control)\"\r\n [maskType]=\"control.maskType\" [autoFormat]=\"control.autoFormat\" [min]=\"control.min\"\r\n [max]=\"control.max\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </tn-mask>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'numberrange'\">\r\n <tn-number-picker-range [decimalPlaces]=\"control.decimalPlaces\"\r\n [disabled]=\"checkDisabled(data, control)\" [maskType]=\"control.maskType\" [min]=\"control.min\"\r\n [max]=\"control.max\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (search)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (blur)=\"handleFieldValueChange(control, $event, eventType.BLUR, data, parentPath)\">\r\n </tn-number-picker-range>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'money'\">\r\n <input currencyMask [attr.disabled]=\"checkDisabled(data, control) ? true : null\" pInputText type=\"tel\"\r\n [(ngModel)]=\"data[control.field]\"\r\n [options]=\"{prefix: '', thousands: '.', decimal: ',',precision:control.dataFormat === 'money'?0:0 }\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\" />\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'phoneOrfax'\">\r\n <input [placeholder]=\"control.dataFormat==='phone'?'(999) 999-9999':'999-999-9999'\"\r\n [attr.disabled]=\"checkDisabled(data, control) ? true : null\" type=\"tel\" pInputText\r\n [(ngModel)]=\"data[control.field]\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\" />\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'textarea'\">\r\n <textarea pInputTextarea [rows]=\"control.rows ? control.rows : 5\"\r\n [attr.disabled]=\"checkDisabled(data, control) ? true : null\" [(ngModel)]=\"data[control.field]\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"></textarea>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'editor'\">\r\n <tn-tinymce *ngIf=\"!checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n [required]=\"control.validators && control.validators.required\" [mode]=\"control.mode\"\r\n [height]=\"control.height ? control.height : 250\" [languageCode]=\"control.languageCode\"\r\n [disabled]=\"control.disabled || (control.disableCheck && control.disableCheck(model))\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </tn-tinymce>\r\n <div *ngIf=\"checkDisabled(data, control)\" class=\"html-box\"\r\n [innerHTML]=\"data[control.field] ? (data[control.field] | safeHtml) : ''\">\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'datetime'\">\r\n <datetime-picker [(ngModel)]=\"data[control.field]\" [disabled]=\"checkDisabled(data, control)\"\r\n [control]=\"control\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </datetime-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocomplete'\">\r\n <app-autocomplete-datasource [control]=\"control\"\r\n [suggestions]=\"data._source[control.field] || control.dataSource\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onValueChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </app-autocomplete-datasource>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'datetimerange'\">\r\n <tn-datetime-picker-range [disabled]=\"control.disabled\" [control]=\"control\"\r\n [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </tn-datetime-picker-range>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dropdown'\">\r\n <dropdown [control]=\"control\" [dataSource]=\"getControlDataSource(control, data)\"\r\n [(value)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleChangeDropdown(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onHideSmartEvent)=\"handleChangeDropdown(control, $event, eventType.HIDE, data, parentPath)\"\r\n (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\r\n (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\"\r\n (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n </dropdown>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'fileManager'\">\r\n <file-manager *ngIf=\"control.entityKey || data[control.entityKeyField]\" [control]=\"control\"\r\n [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\r\n [entityKey]=\"control.entityKey ? control.entityKey : data[control.entityKeyField]\"\r\n [readonly]=\"control.disabled\" [layout]=\"control.layout\" [rootFolderId]=\"control.rootFolderId\"\r\n [maxFileSize]=\"control.maxFileSize\" [inTaiLieu]=\"control.inTaiLieu\"\r\n [inTaiLieuChung]=\"control.inTaiLieuChung\" [copyToFolderId]=\"control.copyToFolderId\"\r\n [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\r\n [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\r\n [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\r\n [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\r\n [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\r\n [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\"\r\n [(value)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onSelected)=\"control.onSelected($event)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n </file-manager>\r\n </ng-container>\r\n <span *ngSwitchCase=\"'fileUpload'\">\r\n <file-upload [(ngModel)]=\"data[control.field]\" [sharedFolderType]=\"control.sharedFolderType\"\r\n [maxFileSize]=\"control.maxFileSize\"\r\n [invalidFileSizeMessageSummary]=\"control.invalidFileSizeMessageSummary\"\r\n [invalidFileSizeMessageDetail]=\"control.invalidFileSizeMessageDetail\"\r\n [invalidFileTypeMessageSummary]=\"control.invalidFileTypeMessageSummary\"\r\n [invalidFileTypeMessageDetail]=\"control.invalidFileTypeMessageDetail\"\r\n [invalidFileLimitMessageSummary]=\"control.invalidFileLimitMessageSummary\"\r\n [invalidFileLimitMessageDetail]=\"control.invalidFileLimitMessageDetail\"\r\n [readonly]=\"control.readonly\" [accept]=\"control.accept\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </file-upload>\r\n </span>\r\n <span *ngSwitchCase=\"'serviceFileUpload'\">\r\n <service-file-upload [(ngModel)]=\"data[control.field]\" [parentContext]=\"context\"\r\n [serviceCode]=\"control.serviceCode\" [entity]=\"control.entity\"\r\n [entityKey]=\"data[control.entityKeyField]\" [control]=\"control\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </service-file-upload>\r\n </span>\r\n <ng-container *ngSwitchCase=\"'user-picker'\">\r\n <user-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [readOnlyValues]=\"data[control.field + '_readOnly']\" [(ngModel)]=\"data[control.field]\"\r\n [multiple]=\"control.multiple\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n </user-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'switch'\">\r\n <p-inputSwitch [(ngModel)]=\"data[control.field]\" [disabled]=\"checkDisabled(data, control)\"\r\n (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </p-inputSwitch>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'checkbox'\">\r\n <div [class]=\"control.class\" role=\"checkbox-alone\">\r\n <p-checkbox [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n [label]=\"!control.hiddenLabel ? control.label : null\"\r\n (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n binary=\"true\">\r\n </p-checkbox>\r\n <!-- <tn-checkbox [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [(ngModel)]=\"data[control.field]\"\r\n (onChange)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"></tn-checkbox> -->\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'button'\">\r\n <button type=\"button\" pButton [class]=\"control.btClass\" [icon]=\"control.icon\"\r\n [label]=\"control.label | translate\" [ngStyle]=\"control.btStyle\"\r\n (click)=\"handleButtonClick(control, $event, parentPath)\"></button>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'container'\">\r\n <div class=\"p-grid p-col-12\" style=\"margin: 0\" [class.not-show-in-box]=\"!control.showInBox\"\r\n [class.show-in-box]=\"control.showInBox\" [ngStyle]=\"control.boxStyle\">\r\n <ng-container *ngFor=\"let subControl of control.controls\">\r\n <ng-container\r\n *ngTemplateOutlet=\"customControl; context: {control: subControl, data: data[control.field], parentPath: path, rowIndex: rowIndex, path: path + '.' + subControl.field, showLabel: subControl.showLabel, mdWidth: subControl.mdWidth}\">\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'checkboxlist'\">\r\n <check-box-list [control]=\"control\" [dataSource]=\"data._source[control.field] || control.dataSource\"\r\n [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onSelect)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n </check-box-list>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'radiobuttonlist'\">\r\n <radio-button-list [control]=\"control\" [dataSource]=\"control.dataSource\"\r\n [disabled]=\"checkDisabled(data, control)\" [(value)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (adjustValue)=\"handleAdjustValueDropdownEvent(control, parentPath)\"\r\n (onReady)=\"handleReadyControlPicker(control, parentPath)\"\r\n (onDataSourceLoaded)=\"handleDataSourceLoaded(control, parentPath, $event)\">\r\n </radio-button-list>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'colorPicker'\">\r\n <tn-color-picker [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (change)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </tn-color-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'spanControl'\">\r\n <span *ngIf=\"!control.ishtml\">{{data[control.field]}}</span>\r\n <span *ngIf=\"control.ishtml\" [innerHTML]=\"data[control.field]\"></span>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'colorControl'\">\r\n <span class=\"show-color-control\" [ngStyle]=\"{ backgroundColor: data[control.sourceField]}\"></span>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'address'\">\r\n <address-picker [control]=\"control\" [showSubLabel]=\"control.showSubLabel\"\r\n [disabled]=\"checkDisabled(data, control)\" [(data)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onSelect)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleControlReadyEvent(control, parentPath)\">\r\n </address-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocomplete-picker'\">\r\n <autocomplete-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [required]=\"control.required\" [readOnlyValues]=\"data[control.field + '_readOnly']\"\r\n [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n </autocomplete-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'entity-picker'\">\r\n <entity-picker [control]=\"control\" [children]=\"children\" [disabled]=\"checkDisabled(data, control)\"\r\n [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </entity-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'cocautochuc'\">\r\n <cocautochuc-picker [control]=\"control\" [parentOrgId]=\"control.parentOrgId\"\r\n [disabled]=\"checkDisabled(data, control)\" [parentOrgCode]=\"control.parentOrgCode\"\r\n [filter]=\"control.filter\" [multiple]=\"control.multiple\" [required]=\"control.required\"\r\n [isUsingId]=\"control.isUsingId\" [disabledParentItem]=\"control.disabledParentItem\"\r\n [rootParentId]=\"control.rootParentId\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </cocautochuc-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'cocautochuc-picker'\">\r\n <cocautochuc-picker-list [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [required]=\"control.required\" [readOnlyValues]=\"data[control.field + '_readOnly']\"\r\n [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\"\r\n (onReady)=\"handleReadyControlPicker(control, parentPath)\">\r\n </cocautochuc-picker-list>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'vanban'\">\r\n <vanban-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [required]=\"control.required\" [readOnly]=\"control.readOnly\" [loaiVanBan]=\"control.loaiVanBan\"\r\n [(ngModel)]=\"data[control.field]\" (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </vanban-picker>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'congviec'\">\r\n <div>\r\n <congviec-picker [control]=\"control\" [disabled]=\"checkDisabled(data, control)\"\r\n [required]=\"control.required\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </congviec-picker>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'percent'\">\r\n <div>\r\n <tn-mask [suffix]=\"'%'\" [placeholder]=\"control.placeholder\" [maskType]=\"'int'\"\r\n [autoFormat]=\"control.autoFormat\" [min]=\"0\" [max]=\"100\"\r\n [disabled]=\"checkDisabled(data, control)\" [(ngModel)]=\"data[control.field]\"\r\n (onInit)=\"handleLoadedControl($event, control, parentPath)\"\r\n (onChanged)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </tn-mask>\r\n <p-slider [step]=\"1\" [min]=\"0\" [max]=\"100\" [disabled]=\"checkDisabled(data, control)\"\r\n [(ngModel)]=\"data[control.field]\"\r\n (onSlideEnd)=\"handleFieldValueChange(control, $event, eventType.CHANGE, data, parentPath)\">\r\n </p-slider>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'table'\">\r\n <div [class]=\"control.class\">\r\n <tn-custom-scrollbar class=\"--has-border\" [showScrollHorizontal]=\"true\">\r\n <p-table class=\"new-table scr-table table-control\" [value]=\"data[control.field]\"\r\n [columns]=\"control.headerTemplate\" [responsive]=\"true\" [scrollable]=\"false\"\r\n [rowTrackBy]=\"trackByFuncId\"\r\n (onRowReorder)=\"handleRowOrdered(control, $event, eventType.ROW_REORDER, data, parentPath)\">\r\n <ng-template pTemplate=\"colgroup\">\r\n <colgroup>\r\n <col *ngIf=\"control.showNumber\" style=\"width: 40px\" />\r\n <ng-container *ngFor=\"let subControl of control.rowTemplate\">\r\n <col [style.width]=\"subControl.width\" />\r\n </ng-container>\r\n <col *ngIf=\"control.enableReorderRow\" style=\"width: 30px\" />\r\n <col *ngIf=\"control.showFunction\" [style.width]=\"control.widthFunctionColumn\" />\r\n </colgroup>\r\n </ng-template>\r\n <ng-template *ngIf=\"getComponentByType(_prefixCustomHeader + control.field)\"\r\n pTemplate=\"header\" let-columns>\r\n <ng-container\r\n *ngTemplateOutlet=\"getComponentByType(_prefixCustomHeader + control.field), context: {$implicit: control.headerTemplate, crudForm: this, containerSticky: containerSticky}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"!getComponentByType(_prefixCustomHeader + control.field)\"\r\n pTemplate=\"header\" let-rowData let-columns>\r\n <tr>\r\n <th *ngIf=\"control.showNumber\" style=\"text-align: center\">\r\n {{ 'TT' |translate}}\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <ng-container *ngFor=\"let subControl of control.rowTemplate\">\r\n <th *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\r\n [pTooltip]=\"subControl.fullLabel || subControl.label\" tooltipPosition=\"top\"\r\n style=\"text-align: center;\">\r\n {{subControl.label}}\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </ng-container>\r\n <th *ngIf=\"control.enableReorderRow\">\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <th *ngIf=\"control.showFunction\" class=\"table-function column-function\">\r\n <div class=\"cell-header-function\"><span>Ch\u1EE9c n\u0103ng</span></div>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-ri=\"rowIndex\">\r\n <tr [pReorderableRow]=\"ri\">\r\n <td *ngIf=\"control.showNumber\" class=\"stt\"\r\n style=\"text-align: center; vertical-align: inherit\">\r\n <span>\r\n {{ri + 1}}\r\n </span>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <ng-container *ngFor=\"let subControl of control.rowTemplate; let i = index\">\r\n <td *ngIf=\"subControl && !subControl.hidden && subControl.visibleInList\"\r\n [class.control-inside]=\"true\" [class]=\"subControl.class\"\r\n [ngStyle]=\"{'text-align': getTextAlign(subControl.textAlign), 'vertical-align': 'inherit'}\">\r\n <span class=\"p-column-title\">{{subControl.label}}</span>\r\n <ng-template [ngIf]=\"getControlType(subControl) != 'column'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"customControl; context: getContextTd(subControl, rowData, ri, path)\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template [ngIf]=\"getControlType(subControl) == 'column'\">\r\n <span>{{_modelData[control.field][ri][subControl.field]}}</span>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n </ng-container>\r\n <td *ngIf=\"control.enableReorderRow\" class=\"no-padding center v-center\">\r\n <i class=\"fas fa-arrows-alt\" style=\"cursor:pointer; padding: 8px; color: #555;\"\r\n pReorderableRowHandle></i>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <td *ngIf=\"control.showFunction\" style=\"text-align: center\"\r\n class=\"column-function text-center\">\r\n <div *ngIf=\"!control.rowButtonTemplate\"\r\n class=\"p-toolbar-group-center button-group\">\r\n <button *ngIf=\"control.showSave\" [disabled]=\"rowData._disableSave\"\r\n type=\"button\" pButton class=\"p-button-text p-button-rounded\"\r\n icon=\"pi pi-save\" [pTooltip]=\"'L\u01B0u' | translate\" tooltipPosition=\"top\"\r\n (click)=\"saveRow(ri, control, path)\"></button>\r\n <button *ngIf=\"control.showEdit\" [disabled]=\"rowData._disableEdit\"\r\n type=\"button\" pButton class=\"p-button-text p-button-rounded\"\r\n icon=\"pi pi-pencil\" [pTooltip]=\"'S\u1EEDa' | translate\" tooltipPosition=\"top\"\r\n (click)=\"editRow(ri, control, path)\"></button>\r\n <button *ngIf=\"control.showDelete\" [disabled]=\"rowData._disableDelete\"\r\n type=\"button\" pButton\r\n class=\"p-button-text p-button-danger p-button-rounded\"\r\n icon=\"pi pi-trash\" [pTooltip]=\"'X\u00F3a' | translate\" tooltipPosition=\"top\"\r\n (click)=\"deleteRow(ri, control, path)\"></button>\r\n <button *ngIf=\"control.rowButtons\" type=\"button\" pButton\r\n icon=\"pi pi-ellipsis-v\"\r\n class=\"link-or-action p-button-text p-button-rounded\"\r\n pTooltip=\"Ch\u1EE9c n\u0103ng kh\u00E1c\" tooltipPosition=\"top\"\r\n (click)=\"showContextMenu($event, rowData, control)\"></button>\r\n </div>\r\n <div *ngIf=\"control.rowButtonTemplate\"\r\n class=\"p-toolbar-group-center button-group\">\r\n <ng-container\r\n *ngTemplateOutlet=\"control.rowButtonTemplate; context: {rowData: _modelData[control.field][ri], rowIndex: ri, path: path, control: control}\">\r\n </ng-container>\r\n </div>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n <ng-template *ngIf=\"control.summaryTemplate\" pTemplate=\"summary\" let-rowData>\r\n <ng-container *ngTemplateOutlet=\"control.summaryTemplate; context: {rowData: rowData}\">\r\n </ng-container>\r\n </ng-template>\r\n </p-table>\r\n </tn-custom-scrollbar>\r\n <div *ngIf=\"control.showFooter\" class=\"--table-schema-footer\">\r\n <button *ngIf=\"control.showAdd\" type=\"button\" pButton style=\"width:auto\" label=\"Th\u00EAm m\u1EDBi\"\r\n icon=\"pi pi-plus\" class=\"p-button-text\" (click)=\"addNewRow(control, path)\"></button>\r\n <span *ngIf=\"control.showDialog\" style=\"font-weight: normal;\">\r\n <p-checkbox label=\"M\u1EDF dialog\" [binary]=\"true\" [(ngModel)]=\"control.showEdit\">\r\n </p-checkbox>\r\n </span>\r\n <button *ngIf=\"control.enableAddMulti\" type=\"button\" pButton\r\n style=\"width:auto; margin-left:10px;\" label=\"Th\u00EAm nhi\u1EC1u\" icon=\"pi pi-clone\"\r\n class=\"p-button-text\" (click)=\"addMultiRow(control, 5, path)\"></button>\r\n <button *ngFor=\"let bt of control.footerButtons\" type=\"button\" pButton [class]=\"bt.class\"\r\n [icon]=\"bt.icon\" [label]=\"bt.label | translate\" style=\"width:auto; margin-left:10px;\"\r\n (click)=\"messageRow( -1, control, path)\"></button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container [ngTemplateOutlet]=\"getComponentByType(control.field)\" [ngTemplateOutletContext]=\"{\r\n crudForm: this, data: data, index: rowIndex, parentPath: parentPath, control: control, changeFunc: handleFieldValueChange\r\n }\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"validation; context: {control: control, data: data}\">\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n<ng-template #validation let-control=\"control\" let-data=\"data\">\r\n <ng-container *ngIf=\"data._errors[control.field].length > 0\">\r\n <div class=\"error-container\">\r\n <ng-container *ngFor=\"let error of data._errors[control.field]\">\r\n <div class=\"error-item\" *ngIf=\"error\">\r\n <ng-container [ngTemplateOutlet]=\"errorMessage\" [ngTemplateOutletContext]=\"{content: error}\">\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #errorMessage let-content=\"content\">\r\n <div class=\"error-content\">\r\n <i class=\"pi pi-ban\"></i>\r\n <span> {{content}}</span>\r\n </div>\r\n</ng-template>\r\n<ng-template #labelControl let-control=\"control\">\r\n <ng-container>\r\n <label [class]=\"getLabelClass(control)\" *ngIf=\"!control.ishtml\" [attr.label-index]=\"control.indexLabel\"\r\n [pTooltip]=\"control.title\" tooltipPosition=\"top\" tooltipStyleClass=\"wrap\" [escape]=\"false\"\r\n [for]=\"control.for\">{{control.text | translate}}</label>\r\n <label [class]=\"getLabelClass(control)\" *ngIf=\"control.ishtml\" [innerHTML]=\"control.text | safeHtml\"\r\n [attr.label-index]=\"control.indexLabel\"></label>\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #containerSticky>\r\n <span class=\"fix-sticky top\"></span>\r\n <span class=\"fix-sticky right\"></span>\r\n <span class=\"fix-sticky left\"></span>\r\n</ng-template>\r\n<ng-template #templateCongViecForm let-control=\"control\">\r\n <base-congviec-form [control]=\"control\" [parentSetting]=\"congViecSetting\" [tenCongViec]=\"control.data.tenCongViec\">\r\n </base-congviec-form>\r\n</ng-template>\r\n<tn-dialog *ngIf=\"tableFormShow\" #dialog [styleClass]=\"'address-form'\" [header]=\"tableFormTitle | translate\"\r\n [popupSize]=\"tableFormPopupSize\" (onHide)=\"tableFormShow = false\">\r\n <table-detail-form #formBase [parentSetting]=\"setting\" [schema]=\"tableFormSchema\" [data]=\"tableFormData\"\r\n (onSaved)=\"handleSavedTableRow($event)\" (onCancel)=\"tableFormShow = false\">\r\n </table-detail-form>\r\n</tn-dialog>",
16999
16996
  providers: [ComponentContextService],
17000
16997
  styles: [".label-only{font-weight:700;margin-bottom:1em}div.label{position:relative}div.label .star-required{color:red;padding-left:.2em;padding-top:.3em;position:absolute}div.type-container.not-show-in-box-holder{padding:0}.--table-schema-footer{align-items:center;background:#f8f9fa;border:1px solid #e9ecef;color:#495057;display:flex;font-weight:600;padding:.5em}.show-in-box{border:1px solid #ced4da;border-radius:5px}.not-show-in-box{padding:0}.view-mode div.label{padding-bottom:3px}.view-mode div.label label{font-size:.85em;font-weight:700}.view-mode>span:not(:empty){display:inline-block;padding:5px 0;width:100%}.view-mode.type-table div.label+div{padding:5px 0}td>.view-mode{display:inline-block;padding:.25rem .5rem}td>.view-mode .view-mode{padding:0}.crud-form-control div[role=checkbox-alone]{margin-top:24px}.crud-form-control div[role=checkbox-alone].mg-top-0{margin-top:0}.crud-form-control .label+div[role=checkbox-alone]{margin-top:11px}.crud-form-control.type-table div[role=checkbox-alone]{margin-top:6px;text-align:center}.crud-form-control.type-table div[role=checkbox-alone].mg-top-0{margin-top:0}.crud-form-control.type-table div[role=checkbox-alone].align-left{text-align:left}.crud-form-control.type-title{border-bottom:1px solid #cfcfcf;color:#025ba7;font-size:1.2rem;font-weight:700;margin-bottom:5px;padding:5px;text-transform:uppercase}.crud-form-control.type-title>.label{margin-bottom:0}.control-description{color:#6c757d;font-size:.8rem;margin-bottom:5px;margin-left:10px}.cell-header-function{align-items:center;display:flex}.cell-header-function>span{flex:1 1;text-align:center}.cell-header-function button{height:24px;margin:0;padding:0;width:24px}::ng-deep .crud-form-control .tn-check-box-list{margin-top:5px}::ng-deep .crud-form-control>div.label{font-size:.9em;height:1.15em;margin-bottom:5px}::ng-deep .crud-form-control>div.label+*{width:100%}::ng-deep .crud-form-control>.error-container .error-item{-webkit-animation:shrink .1s;animation:shrink .1s;min-height:20px;overflow:visible;padding-top:5px}::ng-deep .crud-form-control>.error-container .error-item .error-content{-webkit-animation:fadeIn .1s;animation:fadeIn .1s;color:red;display:flex;font-size:.9em;position:relative}::ng-deep .crud-form-control>.error-container .error-item .error-content i{display:flex;font-size:.9em;padding-top:1px}::ng-deep .crud-form-control>.error-container .error-item .error-content span{display:flex;padding-left:5px}::ng-deep .crud-form-control.no-label>div.label{display:none}::ng-deep .crud-form-control.error .p-dropdown,::ng-deep .crud-form-control.error .p-inputtext,::ng-deep .crud-form-control.error .p-multiselect,::ng-deep .crud-form-control.error .tn-dropdown,::ng-deep .crud-form-control.error input,::ng-deep .crud-form-control.error select,::ng-deep .crud-form-control.error textarea{border-color:#ff5722!important}::ng-deep .crud-form-control.error .p-autocomplete-multiple-container:not(.p-disabled).p-focus,::ng-deep .crud-form-control.error .p-inputtext:enabled:focus,::ng-deep .crud-form-control.error .tn-dropdown:not(.p-disabled).p-focus{box-shadow:0 0 0 .2rem #ffc4b3}::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-dropdown,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-inputtext,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-multiselect,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .tn-dropdown,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) input,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) select,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) textarea{border-color:#ced4da!important}::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-autocomplete-multiple-container:not(.p-disabled).p-focus,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-dropdown.tn-dropdown.p-focus,::ng-deep .crud-form-control.error div.crud-form-control:not(.error) .p-inputtext:enabled:focus{box-shadow:0 0 0 .2rem #a6d5fa}@-webkit-keyframes fadeIn{0%{opacity:0;top:-25px}to{opacity:1;top:0}}@keyframes fadeIn{0%{opacity:0;top:-25px}to{opacity:1;top:0}}@-webkit-keyframes shrink{0%{height:0}to{height:20px}}@keyframes shrink{0%{height:0}to{height:20px}}@media screen and (min-width:40.063em){.label-right{padding-left:2em}}::ng-deep crud-form .crud-form-container{padding:.5rem .5rem 0}::ng-deep crud-form .p-datatable .p-datatable-tbody tr td.control-inside,::ng-deep crud-form .p-datatable .p-datatable-tbody tr td.control-inside .show-in-box:not(.crud-form-control),::ng-deep crud-form base-congviec-form crud-form>.crud-form-container{padding:0}:host ::ng-deep .tox-tinymce{border:none;border-top:1px solid #ccc;overflow:unset}:host ::ng-deep .tox-tinymce .tox-editor-container{overflow:unset}:host ::ng-deep .tox-tinymce .tox-toolbar{border:1px solid #ccc;border-bottom:none}:host ::ng-deep .tox-tinymce .tox-edit-area{border:1px solid #ccc}:host ::ng-deep .tox-tinymce .tox-edit-area iframe{box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}:host ::ng-deep .tox-tinymce .tox-menubar{border:1px solid #ccc}:host ::ng-deep .tox .tox-edit-area.tinymce-focus{border:1px solid #66afe9;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 3px 0 #66afe9;transition:box-shadow .3s,border-color .3s;transition-delay:0s,0s;transition-duration:.3s,.3s;transition-property:box-shadow,border-color;transition-timing-function:ease,ease}:host ::ng-deep .rq .tox .tox-edit-area{border-left-color:#ff4c46}.no-value{font-size:.8em}:host ::ng-deep .table-schema-paging{display:block;margin-bottom:40px}"]
17001
16998
  },] }
@@ -17356,6 +17353,10 @@
17356
17353
  tableNode.model = [];
17357
17354
  }
17358
17355
  tableNode.model.splice(0, tableNode.model.length);
17356
+ if (dataSource.length == 0) {
17357
+ tableNode.reinitChildNodes();
17358
+ return;
17359
+ }
17359
17360
  for (var i = 0; i < dataSource.length; i++) {
17360
17361
  this.rootNode._crudForm.addNewRow(tableNode.control, path, null, true, dataSource[i], i == dataSource.length - 1);
17361
17362
  }
@@ -22866,7 +22867,7 @@
22866
22867
  { type: i0.Component, args: [{
22867
22868
  // tslint:disable-next-line: component-selector
22868
22869
  selector: 'crud-list',
22869
- template: "<div #container class=\"custom-card card card-w-title flex-container-fit-child\" [attr.height-type]=\"setting.heightType\"\r\n [ngStyle]=\"_style\">\r\n <div class=\"ui-helper-clearfix crud-list-header-area\">\r\n <div *ngIf=\"searchCustom\" class=\"p-grid ui-fluid custom-p-col custom-search-area\">\r\n <div class=\"p-col-12 main-container-search\">\r\n <div class=\"p-grid main-container-search-inner\">\r\n <ng-container>\r\n <ng-container *ngTemplateOutlet=\"searchCustom; context: {$implicit: this}\"></ng-container>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!setting.hiddenHeader\" class=\"p-grid ui-fluid custom-p-col page-title-area\">\r\n <div *ngIf=\"!setting.hiddenPageTitle\" class=\"main-title\">\r\n <h1 *ngIf=\"!hasTemplate('customTitle')\">\r\n {{setting.title != null ? setting.title : 'Danh s\u00E1ch ' + setting.objectName}}\r\n </h1>\r\n\r\n <ng-container *ngIf=\"hasTemplate('customTitle')\" [ngTemplateOutlet]=\"getTemplate('customTitle')\"\r\n [ngTemplateOutletContext]=\"{crudList: this}\">\r\n </ng-container>\r\n </div>\r\n\r\n <div *ngIf=\"!setting.hiddenPageSetting\" class=\"paginator-table\">\r\n <paging-next-back-only [model]=\"model\" [setting]=\"setting\" (onChanged)=\"getData()\"\r\n (onChangeLimitPage)=\"savePageSize()\">\r\n </paging-next-back-only>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"hasTemplate('topGrid')\" class=\"extend-content-top-grid\">\r\n <ng-container [ngTemplateOutletContext]=\"{selectedItems: model.selectedItems, crudList: this}\"\r\n [ngTemplateOutlet]=\"getTemplate('topGrid')\"></ng-container>\r\n </div>\r\n <div class=\"fit-content crud-list-body-area\">\r\n <div class=\"crud-list-body-area-inner\" style=\"overflow: unset;\">\r\n <div class=\"flex-container-fit-child\" style=\"overflow: unset;\">\r\n <div *ngIf=\"!setting.hiddenToolbar\" class=\"p-grid crudListToolbar\">\r\n <ng-container>\r\n <div *ngIf=\"!setting.hiddenButtons && hasTemplate('toolbar')\"\r\n [ngClass]=\"setting.hiddenAdvanceSearch ? 'p-md-12 p-lg-12' : 'p-md-7 p-lg-8'\"\r\n class=\"p-col-12 button-group function-topbar custom-toolbar\">\r\n <ng-container\r\n [ngTemplateOutletContext]=\"{selectedItems: model.selectedItems, crudList: this}\"\r\n [ngTemplateOutlet]=\"getTemplate('toolbar')\"></ng-container>\r\n </div>\r\n <div *ngIf=\"!setting.hiddenButtons && !hasTemplate('toolbar')\"\r\n [ngClass]=\"setting.hiddenAdvanceSearch ? 'p-md-12 p-lg-12' : 'p-md-7 p-lg-8'\"\r\n class=\"p-col-12 button-group function-topbar\">\r\n <button type=\"button\" pButton label=\"\u0110\u00E1nh STT\" class=\"p-button-text\" style=\"display: none\"\r\n (click)=\"danhSoThuTuGroupLastest()\"></button>\r\n <button *ngIf=\"!hiddenAdd\" type=\"button\" pButton pRipple label=\"Th\u00EAm m\u1EDBi\" icon=\"pi pi-plus\"\r\n class=\"p-button-text\" [disabled]=\"!model.baseReady\" (click)=\"add()\"></button>\r\n <button *ngIf=\"setting.showExportSelectedItems && model.selectedItems.length > 0\"\r\n type=\"button\" pButton pRipple\r\n label=\"Xu\u1EA5t c\u00E1c m\u1EE5c \u0111\u00E3 ch\u1ECDn ({{model.selectedItems.length}})\" icon=\"fas fa-file-excel\"\r\n class=\"p-button-text p-button-success\" (click)=\"xuatCacMucDaChon()\"></button>\r\n <button *ngIf=\"!hiddenDelete && model.selectedItems.length > 0 && !disableMultipleDelete()\"\r\n type=\"button\" pButton pRipple\r\n [label]=\"'X\u00F3a ' + (model.selectedItems.length) | translate\" icon=\"pi pi-trash\"\r\n class=\"p-button-text p-button-danger\" (click)=\"deleteMutiple()\"></button>\r\n <button *ngIf=\"!setting.disableShare && model.selectedItems.length > 0\"\r\n label=\"Chia s\u1EBB li\u00EAn k\u1EBFt\" type=\"button\" pButton pRipple\r\n [pTooltip]=\"'Chia s\u1EBB li\u00EAn k\u1EBFt' | translate\" tooltipPosition=\"top\"\r\n class=\"p-button-text p-button-info link-or-action\" icon=\"pi pi-link\"\r\n (click)=\"createShareLinkMultiple()\"></button>\r\n <ng-container [ngTemplateOutlet]=\"getTemplate('buttonAfterToolbar')\"\r\n [ngTemplateOutletContext]=\"{crudList: this}\"></ng-container>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"!setting.hiddenAdvanceSearch\" class=\"p-col-12 advance-search-container\"\r\n [ngClass]=\"setting.hiddenButtons ? 'p-md-12 p-lg-12' : 'p-md-5 p-lg-4'\">\r\n <advance-search #advanceSearch [parentSetting]=\"setting\" [searchInfo]=\"searchInfo\"\r\n [loading]=\"model.loading\" (onSearch)=\"handleSearchAdvs($event)\"\r\n (onInit)=\"handleInitAdvanceSearch($event)\">\r\n </advance-search>\r\n </div>\r\n </div>\r\n <div *ngIf=\"hasTemplate('topGrid')\" class=\"extend-content-top-grid\">\r\n <ng-container [ngTemplateOutletContext]=\"{selectedItems: model.selectedItems, crudList: this}\"\r\n [ngTemplateOutlet]=\"getTemplate('topGrid')\"></ng-container>\r\n </div>\r\n <div class=\"container-table fit-content\" [class.--table-responsive]=\"responsive\">\r\n <div class=\"container-table-inner\">\r\n <ng-container *ngIf=\"!_groupField\">\r\n <tn-custom-scrollbar *ngIf=\"showScrollBar\" #scrollbar [config]=\"configScrollBar\"\r\n [showScrollHorizontal]=\"showScrollHorizontal\">\r\n <ng-container *ngTemplateOutlet=\"tableGetGroupFieldFalse\">\r\n </ng-container>\r\n <ng-container *ngIf=\"hasTemplate('afterCrudList')\">\r\n <ng-container [ngTemplateOutlet]=\"getTemplate('afterCrudList')\"></ng-container>\r\n </ng-container>\r\n </tn-custom-scrollbar>\r\n <div *ngIf=\"!showScrollBar\">\r\n <ng-container *ngTemplateOutlet=\"tableGetGroupFieldFalse\">\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"_groupField\">\r\n <tn-custom-scrollbar *ngIf=\"showScrollBar\" #scrollbar [config]=\"configScrollBar\"\r\n [showScrollHorizontal]=\"showScrollHorizontal\">\r\n <ng-container *ngTemplateOutlet=\"tableGetGroupFieldTrue\">\r\n </ng-container>\r\n <ng-container *ngIf=\"hasTemplate('afterCrudList')\">\r\n <ng-container [ngTemplateOutlet]=\"getTemplate('afterCrudList')\"></ng-container>\r\n </ng-container>\r\n </tn-custom-scrollbar>\r\n <div *ngIf=\"!showScrollBar\">\r\n <ng-container *ngTemplateOutlet=\"tableGetGroupFieldTrue\">\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n\r\n <div class=\"table-border-line --top\"></div>\r\n <div class=\"table-border-line --right\"></div>\r\n <div class=\"table-border-line --bottom\"></div>\r\n <div class=\"table-border-line --left\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<after-view-checked (loaded)=\"handleReady()\"></after-view-checked>\r\n<settings *ngIf=\"_showSettings && !setting.hiddenSetting\" [entityMetadataService]=\"entityMetadataService\"\r\n [parentContext]=\"context\" [parentSetting]=\"setting\" [parentModel]=\"model\" (onSave)=\"onSaveSettings($event)\"\r\n (onDelete)=\"onDeleteSettings()\" (onCancel)=\"_showSettings = false\">\r\n</settings>\r\n<settings-row *ngIf=\"_showSettingsRowColor && !setting.hiddenSetting\" [entityMetadataService]=\"entityMetadataService\"\r\n [parentContext]=\"context\" [parentSetting]=\"setting\" [parentModel]=\"model\" (onSave)=\"onSaveColorSettings($event)\"\r\n (onCancel)=\"_showSettingsRowColor = false\">\r\n</settings-row>\r\n<workflow-setting-dialog *ngIf=\"_showSettingsWorkflow && !setting.hiddenSettingWorkflow\" [parentSetting]=\"setting\"\r\n [parentContext]=\"context\" [parentModel]=\"model\" (onSaved)=\"onSaveWorkflowSettings($event)\"\r\n (onRemoved)=\"onRemoveWorkflowSettings($event)\" (onCancel)=\"_showSettingsWorkflow = false\"></workflow-setting-dialog>\r\n<tn-dialog *ngIf=\"workflowSettingModel.showEditForm\" [header]=\"'C\u1EA5u h\u00ECnh quy tr\u00ECnh nghi\u1EC7p v\u1EE5' | translate\"\r\n [popupSize]=\"workflowSettingModel.popupSize\" (onHide)=\"workflowSettingModel.showEditForm = false\">\r\n <workflow-setting-new #formBase [parentSetting]=\"setting\" (onSaved)=\"onSaveWorkflowSettingsNew($event)\"\r\n (onCancel)=\"workflowSettingModel.showEditForm = false\"></workflow-setting-new>\r\n</tn-dialog>\r\n<entity-permission *ngIf=\"_showSettingsPermission && !setting.hiddenSettingPermission\" [parentSetting]=\"setting\"\r\n [parentContext]=\"context\" [parentModel]=\"model\" [searchInfo]=\"searchInfo\"\r\n (onCancel)=\"_showSettingsPermission = false\">\r\n</entity-permission>\r\n<p-contextMenu #contextMenu [appendTo]=\"'body'\" [styleClass]=\"'allow-selected'\" [model]=\"buttonContexts\">\r\n</p-contextMenu>\r\n<tn-dialog *ngIf=\"processWorkflowModel.showEditForm\" #dialog [header]=\"processWorkflowModel.header | translate\"\r\n [popupSize]=\"processWorkflowModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"processWorkflowModel.showEditForm = false\">\r\n <div style=\"height: 100%; padding: 1rem\">\r\n <process-workflow-form #formBase [businessSetting]=\"processWorkflowModel.data.setting\" [item]=\"currentItem\"\r\n [workflow]=\"processWorkflowModel.data.workflow\" [action]=\"processWorkflowModel.data.action\"\r\n (onSaved)=\"handleProcessedWorkflowBase()\" (onCancel)=\"processWorkflowModel.showEditForm = false\">\r\n </process-workflow-form>\r\n </div>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"choYKienModel.showEditForm\" #dialog [header]=\"choYKienModel.header | translate\"\r\n [popupSize]=\"choYKienModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"choYKienModel.showEditForm = false\">\r\n <div style=\"height: 100%\">\r\n <cho-y-kien-form #formBase [bussinessSetting]=\"choYKienModel.data.setting\"\r\n [rowItem]=\"choYKienModel.data.rowData\" (onSaved)=\"choYKienModel.showEditForm = false\"\r\n (onCancel)=\"choYKienModel.showEditForm = false\">\r\n </cho-y-kien-form>\r\n </div>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"workflowHistoryModel.showEditForm\" #dialog [header]=\"workflowHistoryModel.header | translate\"\r\n [popupSize]=\"workflowHistoryModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"workflowHistoryModel.showEditForm = false\">\r\n <div style=\"height: 100%\">\r\n <workflow-history-new #formBase [businessSetting]=\"workflowHistoryModel.data.setting\"\r\n [tableName]=\"workflowHistoryModel.data.tableName\" [item]=\"currentItem\"\r\n [workflowSetting]=\"workflowHistoryModel.data.workflowSetting\"\r\n (onCancel)=\"workflowHistoryModel.showEditForm = false\">\r\n </workflow-history-new>\r\n </div>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"detailTaskModel.showEditForm\" #dialog [header]=\"detailTaskModel.header | translate\"\r\n [popupSize]=\"detailTaskModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"detailTaskModel.showEditForm = false\">\r\n <base-congviec-form #formBase [model]=\"detailTaskModel.data.taskFormModel\" [forceOnlyView]=\"true\"\r\n (onCancel)=\"detailTaskModel.showEditForm = false\">\r\n </base-congviec-form>\r\n</tn-dialog>\r\n\r\n<!-- <tn-dialog *ngIf=\"showDetailForm\" #dialog [styleClass]=\"'congviec-form tn-form-dialog'\"\r\n [header]=\"setting.popupHeader | translate\" [popupSize]=\"setting.popupSize\" (onHide)=\"showDetailForm = false\">\r\n <base-congviec-form #formBase [parentModel]=\"model\" [parentSetting]=\"setting\" [parentContext]=\"context\"\r\n [model]=\"formModel\" [crudList]=\"crudList\" (onSaved)=\"showDetailForm = false;crudList.reload()\"\r\n (onCancel)=\"_handleCancel($event)\" (onAfterSaved)=\"onAfterSaved($event)\">\r\n </base-congviec-form>\r\n</tn-dialog> -->\r\n\r\n<tn-dialog *ngIf=\"permissionSharingModel.showEditForm\" #dialog [header]=\"permissionSharingModel.header | translate\"\r\n [popupSize]=\"permissionSharingModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"permissionSharingModel.showEditForm = false\">\r\n <div style=\"height: 100%\">\r\n <permission-sharing #formBase [item]=\"rowDataCurrent\" [baseService]=\"setting.baseService\"\r\n (onCancel)=\"permissionSharingModel.showEditForm = false\">\r\n </permission-sharing>\r\n </div>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"permissionListModel.showEditForm\" #dialog [header]=\"permissionListModel.header | translate\"\r\n [popupSize]=\"permissionListModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\" [useDefaultScrollBar]=\"true\"\r\n (onHide)=\"permissionListModel.showEditForm = false\">\r\n <div style=\"height: 100%\">\r\n <workflow-permission #formBase [item]=\"rowDataCurrent\" [businessSetting]=\"setting\"\r\n (onCancel)=\"permissionListModel.showEditForm = false\">\r\n </workflow-permission>\r\n </div>\r\n</tn-dialog>\r\n<workflow-history-dialog *ngIf=\"showHistoryWorkflow\" [baseService]=\"setting.baseService\" [item]=\"currentItem\"\r\n [workflowSetting]=\"setting.workflowSetting\" (onHide)=\"handleHideHistoryWorkflow()\">\r\n</workflow-history-dialog>\r\n<tn-dialog *ngIf=\"startWorkflowModel.showEditForm\" #dialog [header]=\"startWorkflowModel.header | translate\"\r\n [popupSize]=\"startWorkflowModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"startWorkflowModel.showEditForm = false\">\r\n <div style=\"height: 100%\">\r\n <start-workflow #formBase [workflows]=\"startWorkflowModel.data.workflows\"\r\n [defaultWorkflow]=\"startWorkflowModel.data.defaultWorkflow\"\r\n (onCancel)=\"startWorkflowModel.showEditForm = false\" (onSaved)=\"handleStartWorkflowFromDialog($event)\">\r\n </start-workflow>\r\n </div>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"congViecModel.showEditForm\" #dialog [styleClass]=\"'congviec-form tn-form-dialog'\"\r\n [header]=\"congViecModel.header | translate\" [popupSize]=\"congViecModel.popupSize\"\r\n (onHide)=\"congViecModel.showEditForm = false\">\r\n <base-congviec-form #formBase [parentSetting]=\"congViecModel.data.congViecSetting\"\r\n [model]=\"congViecModel.data.model\" (onSaved)=\"congViecModel.showEditForm = false;getData()\"\r\n (onCancel)=\"congViecModel.showEditForm = false\">\r\n </base-congviec-form>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"shareLinkModel.showEditForm\" #dialog [styleClass]=\"'congviec-form tn-form-dialog'\"\r\n [header]=\"shareLinkModel.header | translate\" [popupSize]=\"shareLinkModel.popupSize\" [useDefaultScrollBar]=\"true\"\r\n (onHide)=\"shareLinkModel.showEditForm = false\">\r\n <share-link-by-permission #formBase [setting]=\"setting\" [lstItem]=\"shareLinkModel.data.lstItem\"\r\n (onCancel)=\"congViecModel.showEditForm = false\">\r\n </share-link-by-permission>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"attachedTaskModel.showEditForm\" [header]=\"attachedTaskModel.header | translate\"\r\n [popupSize]=\"attachedTaskModel.popupSize\" [useDefaultScrollBar]=\"true\"\r\n (onHide)=\"attachedTaskModel.showEditForm = false\">\r\n <base-congviec [serviceCode]=\"setting.baseService.serviceCode\" [entity]=\"setting.baseService.entityName\"\r\n [itemIdAttach]=\"rowDataCurrent.id\"></base-congviec>\r\n</tn-dialog>\r\n<ng-template #tableGetGroupFieldFalse>\r\n <p-table #table [dataKey]=\"'id'\" [scrollable]=\"pTableScrollable\" [scrollHeight]=\"pTableScrollHeight\"\r\n [columns]=\"setting.cols\" [paginator]=\"false\" [value]=\"_dataSource\" (onSort)=\"onSort($event, table)\"\r\n [class]=\"_tableClass\" [responsive]=\"responsive\" [lazy]=\"lazy\" [loading]=\"model.loading\"\r\n [(selection)]=\"model.selectedItems\" (onRowReorder)=\"handleRowOrdered($event)\">\r\n <ng-template *ngIf=\"colgroup\" pTemplate=\"colgroup\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"colgroup; context: {$implicit: columns}\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"!colgroup\" pTemplate=\"colgroup\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"baseColgroup; context: {$implicit: columns}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"header\" pTemplate=\"header\" let-columns>\r\n <ng-container\r\n *ngTemplateOutlet=\"header, context: {$implicit: columns, crudList: this, rowHeaderFilter: rowHeaderFilter, contentTh: contentTh, containerSticky: containerSticky, funcCheckAll: handleCheckAll}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"!header\" pTemplate=\"header\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"trHeader; context: {$implicit: columns, funcCheckAll: handleCheckAll}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-index=\"rowIndex\" let-expanded=\"expanded\">\r\n <ng-container\r\n *ngTemplateOutlet=\"trBody; context: {$implicit: rowData, columns: columns, index: index, expanded: expanded, eventSelectRow: handleSelectRow, eventChecked: handleCheckRowData}\">\r\n </ng-container>\r\n <after-view-checked *ngIf=\"index == _dataSource.length - 1\" style=\"display: none;\" [renderKey]=\"_dataSource\"\r\n (loaded)=\"handleTableRendered()\">\r\n </after-view-checked>\r\n </ng-template>\r\n <ng-template *ngIf=\"rowExpansion\" pTemplate=\"rowexpansion\" let-rowData let-expanded=\"expanded\">\r\n <ng-container\r\n *ngTemplateOutlet=\"rowExpansion; context: {rowData: rowData, expanded: expanded, getColSpanGroup: getColSpanGroup}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"summary\" pTemplate=\"summary\">\r\n <ng-container *ngTemplateOutlet=\"summary\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"footer\" pTemplate=\"footer\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"footer; context: {$implicit: columns}\"></ng-container>\r\n </ng-template>\r\n </p-table>\r\n</ng-template>\r\n<ng-template #tableGetGroupFieldTrue>\r\n <p-table #tableGroup [scrollable]=\"pTableScrollable\" [scrollHeight]=\"pTableScrollHeight\" [columns]=\"setting.cols\"\r\n [paginator]=\"false\" [value]=\"_dataSource\" [metaKeySelection]=\"false\" (onSort)=\"onSort($event, tableGroup)\"\r\n [class]=\"_tableClass\" [customSort]=\"true\" [responsive]=\"responsive\" [lazy]=\"true\" [loading]=\"model.loading\"\r\n [(selection)]=\"model.selectedItems\" [expandedRowKeys]=\"model.expandedRowKeys\" [dataKey]=\"_groupField\">\r\n <ng-template *ngIf=\"colgroup\" pTemplate=\"colgroup\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"colgroup; context: {$implicit: columns}\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"!colgroup\" pTemplate=\"colgroup\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"baseColgroup; context: {$implicit: columns}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"header\" pTemplate=\"header\" let-columns>\r\n <ng-container\r\n *ngTemplateOutlet=\"header, context: {$implicit: columns, crudList: this, rowHeaderFilter: rowHeaderFilter, contentTh: contentTh, containerSticky: containerSticky, funcCheckAll: handleCheckAll_Group}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"!header\" pTemplate=\"header\" let-columns>\r\n <ng-container\r\n *ngTemplateOutlet=\"trHeader; context: {$implicit: columns, funcCheckAll: handleCheckAll_Group}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-rowIndex=\"rowIndex\" let-expanded=\"expanded\" let-columns=\"columns\">\r\n <tr *ngIf=\"rowGroupMetadata[rowData[_groupField]] && rowGroupMetadata[rowData[_groupField]].index == rowIndex\"\r\n class=\"p-widget-header group-row\" style=\"border: 0px; border-bottom: 1px solid #eee\">\r\n <td *ngIf=\"!setting.hiddenCheckbox\" class=\"center chkbox\" [class.sticky]=\"setting.stickyColumn\">\r\n <p-checkbox [(ngModel)]=\"rowGroupChecked[rowData[_groupField]]\" binary=\"true\"\r\n (onChange)=\"handleCheckRowGroup(rowData)\">\r\n </p-checkbox>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <ng-container *ngIf=\"!rowGroup\">\r\n <td [colSpan]=\"getColSpanGroup()\" [class]=\"_classRowGroup\">\r\n <div class=\"container-row-group\">\r\n <a href=\"javascript:;\" [pRowToggler]=\"rowData\" class=\"container-row-group-toggle\"\r\n [class.sticky]=\"setting.stickyColumn\">\r\n <i style=\"margin-right:5px\"\r\n [ngClass]=\"expanded ? 'fas fa-fw fa-caret-down' : 'fas fa-fw fa-caret-right'\"></i>\r\n <span class=\"content-row-group\">\r\n <ng-container *ngIf=\"!contentRowGroup\">\r\n <ng-container [ngTemplateOutlet]=\"_contentRowGroup\"\r\n [ngTemplateOutletContext]=\"getContextRowGroup(rowData)\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"contentRowGroup\">\r\n <ng-container [ngTemplateOutlet]=\"contentRowGroup\"\r\n [ngTemplateOutletContext]=\"getContextRowGroup(rowData)\">\r\n </ng-container>\r\n </ng-container>\r\n </span>\r\n </a>\r\n </div>\r\n </td>\r\n </ng-container>\r\n <ng-container *ngIf=\"rowGroup\">\r\n <ng-container [ngTemplateOutlet]=\"rowGroup\"\r\n [ngTemplateOutletContext]=\"getContextRowGroupRoot(rowData, expanded)\">\r\n </ng-container>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"rowexpansion\" let-columns=\"columns\" let-rowData let-index=\"rowIndex\">\r\n <ng-container\r\n *ngTemplateOutlet=\"trBody; context: {$implicit: rowData, columns: columns, index: index, expanded: false, eventSelectRow: handleSelectRowGroup, eventChecked: handleCheckRowData_Group}\">\r\n </ng-container>\r\n <after-view-checked *ngIf=\"index == _dataSource.length - 1\" style=\"display: none;\" [renderKey]=\"_dataSource\"\r\n (loaded)=\"handleTableRendered()\">\r\n </after-view-checked>\r\n </ng-template>\r\n <ng-template *ngIf=\"summary\" pTemplate=\"summary\">\r\n <ng-container *ngTemplateOutlet=\"summary\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"footer\" pTemplate=\"footer\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"footer; context: {$implicit: columns}\"></ng-container>\r\n </ng-template>\r\n </p-table>\r\n <after-view-checked></after-view-checked>\r\n</ng-template>\r\n<ng-template #baseColgroup let-columns>\r\n <colgroup>\r\n <col *ngIf=\"!setting.hiddenCheckbox\" [style.width]=\"widthCheckbox\" />\r\n <col *ngIf=\"!setting.hiddenOrderColumn\" [style.width]=\"widthOrderColumn\" />\r\n <col *ngIf=\"rowExpansion\" style=\"width: 2.5rem\" />\r\n <ng-container *ngFor=\"let col of columns; let i = index\">\r\n <col *ngIf=\"col && col.visible && col.field!='function'\" [style.width]=\"col.width\" />\r\n </ng-container>\r\n <col *ngIf=\"enableReorderRow\" style=\"width: 30px\" />\r\n <col *ngIf=\"!setting.hiddenFunctionColumn\" [style.width]=\"widthFunctionColumn || _widthFunctionColumn\" />\r\n </colgroup>\r\n</ng-template>\r\n<ng-template #trHeader let-columns let-funcCheckAll=\"funcCheckAll\">\r\n <tr class=\"title-row\">\r\n <ng-container *ngIf=\"!setting.hiddenCheckbox\">\r\n <th class=\"chkbox link-or-action cell-checkbox\" [class.sticky]=\"setting.stickyColumn\">\r\n <button *ngIf=\"!hasTemplate('headerCheckbox')\" type=\"button\" pButton pRipple icon=\"pi pi-refresh\"\r\n class=\"p-button-rounded p-button-text btnReload\" pTooltip=\"L\u00E0m m\u1EDBi d\u1EEF li\u1EC7u\" tooltipPosition=\"top\"\r\n [disabled]=\"model.loading\" (click)=\"reload()\"></button>\r\n <ng-container *ngIf=\"hasTemplate('headerCheckbox')\">\r\n <ng-container [ngTemplateOutletContext]=\"{crudList: this}\"\r\n [ngTemplateOutlet]=\"getTemplate('headerCheckbox')\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </ng-container>\r\n <th *ngIf=\"!setting.hiddenOrderColumn\" class=\"stt nopad center\" [class.sticky]=\"setting.stickyColumn\"\r\n (dblclick)=\"reload()\">\r\n {{ 'TT' |translate}}\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <th *ngIf=\"rowExpansion\" class=\"nopad row-expansion-toggle center\" style=\"width: 2.5rem\"\r\n [class.sticky]=\"setting.stickyColumn\">\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <ng-container *ngFor=\"let col of columns; let i = index\">\r\n <th *ngIf=\"col && col.visible && col.field!='function'\" [ngStyle]=\"col.extendData.headerStyle\"\r\n [pTooltip]=\"col.fullLabel\" tooltipStyleClass=\"unset-width\" [class]=\"col.extendData.headerClass\"\r\n [class.first-th]=\"i==0\" [escape]=\"false\" tooltipPosition=\"top\" [tnSortableColumn]=\"col.field\"\r\n [tnSortableColumnDisabled]=\"!col.sort\">\r\n <ng-container *ngTemplateOutlet=\"contentTh; context: {$implicit: col}\"></ng-container>\r\n <ng-container *ngIf=\"col.sort || col.sortClient\">\r\n <ng-container *ngTemplateOutlet=\"sortIcon; context: {field: col.field}\"></ng-container>\r\n </ng-container>\r\n </th>\r\n </ng-container>\r\n <th *ngIf=\"enableReorderRow\" style=\"width: 30px\">\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <ng-container *ngTemplateOutlet=\"colFunctionHeader\"></ng-container>\r\n </tr>\r\n <ng-container *ngTemplateOutlet=\"rowHeaderFilter; context: {columns: columns, funcCheckAll: funcCheckAll}\">\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #rowHeaderFilter let-columns=\"columns\" let-funcCheckAll=\"funcCheckAll\">\r\n <tr class=\"filter-row\" *ngIf=\"!setting.hiddenFilterRow\">\r\n <th *ngIf=\"!setting.hiddenCheckbox\" class=\"chkbox nopad center\" [class.sticky]=\"setting.stickyColumn\"\r\n [class.tricheckbox-custom-false]=\"checkedAll === false\">\r\n <p-triStateCheckbox [(ngModel)]=\"checkedAll\" binary=\"true\" (onChange)=\"funcCheckAll()\">\r\n </p-triStateCheckbox>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <th *ngIf=\"!setting.hiddenOrderColumn\" class=\"stt center v-top\" [class.sticky]=\"setting.stickyColumn\">\r\n <div *ngIf=\"!setting.hiddenSetting\" class=\"pick-color-row\" pTooltip=\"C\u1EA5u h\u00ECnh hi\u1EC3n th\u1ECB m\u00E0u\"\r\n tooltipPosition=\"top\" (click)=\"showSettingRowColor()\">\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n </div>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <th *ngIf=\"rowExpansion\" class=\"nopad center row-expansion-toggle\" [class.sticky]=\"setting.stickyColumn\">\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <ng-container *ngFor=\"let col of columns; let i = index\">\r\n <th *ngIf=\"col.visible && col.field != 'function'\" class=\"cell-header-filter center\">\r\n <ng-container *ngIf=\"col.allowFilter\">\r\n <ng-container *ngIf=\"col.templateFilter\">\r\n <ng-container [ngTemplateOutlet]=\"col.templateFilter\"\r\n [ngTemplateOutletContext]=\"{col: col, filterData: filterData, onSearch: onSearch, onShowFilterDropdownPanel: onShowFilterDropdownPanel, onHideFilterDropdownPanel: onHideFilterDropdownPanel}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!col.templateFilter\" [ngSwitch]=\"col.controlType\">\r\n <ng-container *ngSwitchCase=\"'dropdown'\">\r\n <ng-container [ngTemplateOutlet]=\"filterDropdown\"\r\n [ngTemplateOutletContext]=\"{col: col.rawColumn}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'number'\">\r\n <ng-container [ngTemplateOutlet]=\"filterNumber\" [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ng-container [ngTemplateOutlet]=\"filterDate\" [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'datetime'\">\r\n <ng-container [ngTemplateOutlet]=\"filterDate\" [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container [ngSwitch]=\"col.dataType\">\r\n <ng-container *ngSwitchCase=\"'int'\">\r\n <ng-container [ngTemplateOutlet]=\"filterNumber\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'decimal'\">\r\n <ng-container [ngTemplateOutlet]=\"filterNumber\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ng-container [ngTemplateOutlet]=\"filterDate\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'datetime'\">\r\n <ng-container [ngTemplateOutlet]=\"filterDate\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'boolean'\">\r\n <ng-container [ngTemplateOutlet]=\"filterBoolean\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container [ngTemplateOutlet]=\"filterText\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </ng-container>\r\n <th *ngIf=\"enableReorderRow\" style=\"width: 30px\">\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <th *ngIf=\"!setting.hiddenFunctionColumn\" class=\"center setting-cell column-function\"\r\n [class.sticky]=\"setting.stickyColumn\">\r\n <button *ngIf=\"!setting.hiddenSetting\" type=\"button\" pButton pRipple icon=\"pi pi-cog\"\r\n class=\"p-button-rounded p-button-text\" pTooltip=\"C\u1EA5u h\u00ECnh hi\u1EC3n th\u1ECB\" tooltipPosition=\"top\"\r\n (click)=\"showSettings()\"></button>\r\n <button *ngIf=\"!setting.hiddenSettingPermission\" type=\"button\" pButton pRipple icon=\"pi pi-users\"\r\n class=\"p-button-rounded p-button-text\" pTooltip=\"Ph\u00E2n quy\u1EC1n d\u1EEF li\u1EC7u\" tooltipPosition=\"left\"\r\n [disabled]=\"!checkPermissionToUseButton(BUTTON_PHAN_QUYEN)\" (click)=\"showSettingsPermission()\"></button>\r\n <button *ngIf=\"!setting.hiddenSettingWorkflow\" type=\"button\" pButton pRipple icon=\"pi pi-sitemap\"\r\n class=\"p-button-rounded p-button-text\" pTooltip=\"C\u1EA5u h\u00ECnh quy tr\u00ECnh\" tooltipPosition=\"left\"\r\n [disabled]=\"!checkPermissionToUseButton(BUTTON_CAU_HINH_QUY_TRINH)\"\r\n (click)=\"showSettingsWorkflowNew()\"></button>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </tr>\r\n</ng-template>\r\n<ng-template #colFunctionHeader>\r\n <ng-container *ngIf=\"!setting.hiddenFunctionColumn\">\r\n <th class=\"column-function\" [class.sticky]=\"setting.stickyColumn\">\r\n <div class=\"cell-header-function\">\r\n <span>{{'GRID.FUNCTION'| translate}}</span>\r\n </div>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #contentTh let-col>\r\n <ng-container *ngIf=\"templateHeaderContent[col.field]\">\r\n <ng-container *ngTemplateOutlet=\"templateHeaderContent[col.field]\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!templateHeaderContent[col.field]\">\r\n {{col.label}}\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n</ng-template>\r\n<ng-template #trBody let-rowData let-columns=\"columns\" let-index=\"index\" let-expanded=\"expanded\"\r\n let-eventSelectRow=\"eventSelectRow\" let-eventChecked=\"eventChecked\">\r\n <tr [tnReorderableRow]=\"index\" [attr.rowIndex]=\"index\" [ngClass]=\"rowData.objStyleClass\"\r\n [class.ui-state-highlight]=\"rowData._checked\" [pTooltip]=\"rowData.tooltip\" tooltipPosition=\"top\"\r\n [tooltipStyleClass]=\"rowData.tooltipClass\" [escape]=\"escape\" (click)=\"eventSelectRow($event, rowData)\">\r\n <ng-container *ngIf=\"!setting.hiddenCheckbox\">\r\n <td class=\"chkbox link-or-action cell-checkbox\" [class.sticky]=\"setting.stickyColumn\">\r\n <ng-container *ngIf=\"!rowData.hiddenCheckBox\">\r\n <ng-container *ngIf=\"!hasTemplate('checkbox')\">\r\n <p-checkbox [(ngModel)]=\"rowData._checked\" binary=\"true\" (onChange)=\"eventChecked(rowData)\">\r\n </p-checkbox>\r\n </ng-container>\r\n <ng-container *ngIf=\"hasTemplate('checkbox')\">\r\n <ng-container [ngTemplateOutlet]=\"getTemplate('checkbox')\"\r\n [ngTemplateOutletContext]=\"{rowData: rowData, rowIndex: index}\"></ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n </ng-container>\r\n <td *ngIf=\"!setting.hiddenOrderColumn && (!rowData.hidden || !rowData.hidden[fieldOrder])\" class=\"stt\"\r\n style=\"text-align: center;\" [class.sticky]=\"setting.stickyColumn\"\r\n [attr.colSpan]=\"rowData.colSpan && rowData.colSpan[fieldOrder]\"\r\n [attr.rowSpan]=\"rowData.rowSpan && rowData.rowSpan[fieldOrder]\">\r\n <span class=\"row-card\" [ngStyle]=\"rowData.bookmarkStyle\"></span>\r\n {{rowData[fieldOrder]}}\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <td *ngIf=\"rowExpansion\" class=\"no-padding center row-expansion-toggle\" [class.sticky]=\"setting.stickyColumn\">\r\n <ng-container *ngTemplateOutlet=\"iconToggleRowData; context: {rowData: rowData, expanded: expanded}\">\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <ng-container\r\n *ngTemplateOutlet=\"dynamicColBodys; context: {$implicit: columns, rowData: rowData, index: index, expanded: expanded}\">\r\n </ng-container>\r\n <td *ngIf=\"enableReorderRow\" class=\"no-padding center\">\r\n <i class=\"fas fa-arrows-alt\" style=\"cursor:pointer; padding: 8px; color: #555;\" pReorderableRowHandle></i>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <ng-container *ngIf=\"!setting.hiddenFunctionColumn\">\r\n <td class=\"text-center column-function\" style=\"text-align: center;\" [class.sticky]=\"setting.stickyColumn\">\r\n <div *ngIf=\"hasTemplate('function')\" class=\"p-toolbar-group-center button-group\">\r\n <ng-container [ngTemplateOutlet]=\"getTemplate('function')\"\r\n [ngTemplateOutletContext]=\"{rowData: rowData, rowIndex: index}\"></ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </div>\r\n <div *ngIf=\"!hasTemplate('function')\" class=\"p-toolbar-group-center button-group\">\r\n <ng-container [ngTemplateOutletContext]=\"{rowData: rowData, rowIndex: index}\"\r\n [ngTemplateOutlet]=\"getTemplate('buttonBefore')\"></ng-container>\r\n <button *ngIf=\"setting.showVersionButton\" type=\"button\" pButton pRipple icon=\"pi pi-calendar\"\r\n class=\"p-button-rounded p-button-success link-or-action\" pTooltip=\"Xem l\u1ECBch s\u1EED phi\u00EAn b\u1EA3n\"\r\n tooltipPosition=\"top\" (click)=\"showListVersion(rowData)\"></button>\r\n <button *ngIf=\"!rowData.hiddenEdit\" type=\"button\" pButton pRipple [disabled]=\"disableEdit(rowData)\"\r\n [pTooltip]=\"'FORM.EDIT' | translate\" tooltipPosition=\"top\"\r\n class=\"p-button-rounded p-button-text p-button-info link-or-action\" icon=\"pi pi-pencil\"\r\n (click)=\"edit(rowData)\"></button>\r\n <button *ngIf=\"!rowData.hiddenDelete\" type=\"button\" pButton pRipple\r\n [disabled]=\"disableDelete(rowData)\" [pTooltip]=\"'FORM.DELETE' | translate\" tooltipPosition=\"top\"\r\n class=\"p-button-rounded p-button-text p-button-danger link-or-action\" icon=\"pi pi-trash\"\r\n (click)=\"delete(rowData)\"></button>\r\n <button *ngIf=\"showMenuButtons && this.menuButtons\" type=\"button\" pButton icon=\"pi pi-ellipsis-v\"\r\n class=\"link-or-action p-button-text p-button-info p-button-rounded\" pTooltip=\"Ch\u1EE9c n\u0103ng kh\u00E1c\"\r\n tooltipPosition=\"top\" (click)=\"showContextMenu($event, rowData)\"></button>\r\n <ng-container [ngTemplateOutletContext]=\"{rowData: rowData, rowIndex: index}\"\r\n [ngTemplateOutlet]=\"getTemplate('buttonAfter')\"></ng-container>\r\n </div>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n</ng-template>\r\n<ng-template #dynamicColBodys let-columns let-rowData=\"rowData\" let-index=\"index\" let-expanded=\"expanded\">\r\n <ng-container *ngFor=\"let col of columns; let i = index\">\r\n <ng-container\r\n *ngTemplateOutlet=\"contentTd; context: {$implicit: rowData, col: col, index: index, i: i, expanded: expanded}\">\r\n </ng-container>\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #contentTd let-rowData let-col=\"col\" let-index=\"index\" let-expanded=\"expanded\" let-i=\"i\">\r\n <td *ngIf=\"col && col.visible && col.field != 'function' && (!rowData.hidden || !rowData.hidden[col.field])\"\r\n [attr.colSpan]=\"rowData.colSpan && rowData.colSpan[col.field]\"\r\n [attr.rowSpan]=\"rowData.rowSpan && rowData.rowSpan[col.field]\" [ngStyle]=\"col.extendData.style\"\r\n [class]=\"col.cellClass\" [class.first-td]=\"i == 0\">\r\n <span *ngIf=\"col.pipe\">\r\n <span class=\"p-column-title\" [pTooltip]=\"col.fullLabel\" [escape]=\"false\"\r\n tooltipPosition=\"top\">{{col.label}}</span>\r\n {{rowData['pipe__' + col.field]}}\r\n </span>\r\n <span *ngIf=\"!col.pipe\">\r\n <span class=\"p-column-title\" [pTooltip]=\"col.fullLabel\" [escape]=\"false\"\r\n tooltipPosition=\"top\">{{col.label}}</span>\r\n <span *ngIf=\"setting.showEditLink && col.showEditLink\" [pTooltip]=\"config.tooltipView\" tooltipPosition=\"top\"\r\n class=\"link-or-action\">\r\n <a href=\"javascript:;\" (click)=\"view(rowData)\" [pTooltip]=\"config.tooltipView\" tooltipPosition=\"top\">\r\n <ng-container [ngTemplateOutlet]=\"contentCell\"\r\n [ngTemplateOutletContext]=\"getContextCell(rowData, index, col, expanded, this)\">\r\n </ng-container>\r\n </a>\r\n </span>\r\n <span *ngIf=\"!setting.showEditLink || !col.showEditLink\">\r\n <ng-container [ngTemplateOutlet]=\"contentCell\"\r\n [ngTemplateOutletContext]=\"getContextCell(rowData, index, col, expanded, this)\">\r\n </ng-container>\r\n </span>\r\n </span>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n</ng-template>\r\n<ng-template #contentCell let-col=\"col\" let-rowData=\"rowData\" let-rowIndex=\"rowIndex\" let-field=\"field\"\r\n let-expanded=\"expanded\">\r\n <ng-container *ngIf=\"col.template\">\r\n <ng-container [ngTemplateOutlet]=\"col.template\"\r\n [ngTemplateOutletContext]=\"getContextCell(rowData, rowIndex, col, expanded,this)\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!col.template\">\r\n <ng-container [ngSwitch]=\"col.dataType\">\r\n <span *ngSwitchCase=\"'color'\" style=\"display:block;text-align:center;\">\r\n <div [pTooltip]=\"rowData[field]\" tooltipPosition=\"top\" [ngStyle]=\"{'background-color':rowData[field]}\"\r\n style=\"width:30px;height:30px;margin:0 auto;\"></div>\r\n </span>\r\n <span *ngSwitchCase=\"'icon'\" style=\"display:block;text-align:center;\">\r\n <i [pTooltip]=\"rowData[field]\" tooltipPosition=\"top\" style=\"text-align: center;\"\r\n [ngClass]=\"rowData[field]\"></i>\r\n </span>\r\n <span *ngSwitchCase=\"'date'\" [pTooltip]=\"rowData[field] | date:'dd/MM/yyyy'\" tooltipPosition=\"top\">\r\n {{rowData[field] | tnDate:col.dataType:col.format}}\r\n </span>\r\n <span *ngSwitchCase=\"'datetime'\" [pTooltip]=\"rowData[field] | date:'dd/MM/yyyy HH:mm'\"\r\n tooltipPosition=\"top\">\r\n {{rowData[field] | tnDate:col.dataType:col.format}}\r\n </span>\r\n <span *ngSwitchCase=\"'user'\" class=\"user\">\r\n {{rowData[field] | userFormat | async}}\r\n </span>\r\n <div *ngSwitchCase=\"'users'\" [innerHTML]=\"rowData[field] | usersFormat | async\">\r\n </div>\r\n <span *ngSwitchCase=\"'int'\">\r\n {{rowData[field]}}\r\n </span>\r\n <span *ngSwitchCase=\"'decimal'\">\r\n {{rowData[field]}}\r\n </span>\r\n <span *ngSwitchCase=\"'boolean'\">\r\n <p-checkbox class=\"boolean-data-type\" [(ngModel)]=\"rowData[field]\" binary=\"true\"\r\n [disabled]=\"col.disableCheckBox\">\r\n </p-checkbox>\r\n </span>\r\n <span *ngSwitchCase=\"'html'\">\r\n <div *ngIf=\"rowData[field]==null?'':rowData[field]\" [innerHTML]=\"rowData[field] | safeHtml\"></div>\r\n </span>\r\n <span *ngSwitchCase=\"'metadataStatus'\">\r\n <span *ngIf=\"rowData['rejectReason']\" class=\"label-danger\" [pTooltip]=\"rowData['rejectReason']\"\r\n tooltipStyleClass=\"unset-width\" [escape]=\"false\" tooltipPosition=\"top\">T\u1EEB ch\u1ED1i</span>\r\n <span *ngIf=\"rowData[field] == '0' && !rowData['rejectReason']\" class=\"label-secondary\">Ch\u01B0a\r\n duy\u1EC7t</span>\r\n <span *ngIf=\"rowData[field] == '1' && !rowData['rejectReason']\" class=\"label-warning\">Ch\u1EDD duy\u1EC7t</span>\r\n <span *ngIf=\"rowData[field] == '2'\" class=\"label-primary\">\u0110\u00E3 duy\u1EC7t</span>\r\n </span>\r\n <ng-container *ngSwitchCase=\"'fileUpload'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"fileUploadColumn; context: {$implicit: rowData, field: col.field, fileSetting: col.fileSetting}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'fileManager'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"fileManagerColumn; context: {$implicit: rowData, field: col.field, fileSetting: col.fileSetting}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'string'\">\r\n <ng-container *ngTemplateOutlet=\"contentCellString; context: {$implicit: rowData, field: col.field}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"null\">\r\n <ng-container *ngTemplateOutlet=\"contentCellString; context: {$implicit: rowData, field: col.field}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container [ngTemplateOutlet]=\"getComponentByType(col.dataType)\"\r\n [ngTemplateOutletContext]=\"getContextCell(rowData, rowIndex, col, expanded, this)\">\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #contentCellString let-rowData let-field=\"field\">\r\n <span>\r\n <!-- __sv: Short Value -->\r\n <ng-container *ngIf=\"rowData[field + '__sv']\">\r\n <ng-container *ngIf=\"!rowData[field + '__showFull']\">\r\n {{rowData[field + '__sv']}}\r\n <span class=\"toggle-showfull\" (click)=\"toggleShowFull(rowData, field)\" pTooltip=\"B\u1EA5m \u0111\u1EC3 xem th\u00EAm\"\r\n tooltipPosition=\"top\">[...]</span>\r\n </ng-container>\r\n <ng-container *ngIf=\"rowData[field + '__showFull']\">\r\n {{rowData[field]}}\r\n <span class=\"toggle-showfull\" (click)=\"toggleShowFull(rowData, field)\">Thu g\u1ECDn</span>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!rowData[field + '__sv']\">\r\n {{rowData[field]}}\r\n </ng-container>\r\n </span>\r\n</ng-template>\r\n<ng-template #iconToggleRowGroup let-rowData=\"rowData\" let-expanded=\"expanded\">\r\n <a href=\"javascript:;\" (click)=\"handleToggleRow(rowData, $event)\">\r\n <i style=\"margin-right:5px\" [ngClass]=\"expanded ? 'fas fa-fw fa-caret-down' : 'fas fa-fw fa-caret-right'\"></i>\r\n </a>\r\n</ng-template>\r\n<ng-template #iconToggleRowData let-rowData=\"rowData\" let-expanded=\"expanded\">\r\n <button type=\"button\" pButton pRipple class=\"link-or-action p-button-text p-button-rounded p-button-plain\"\r\n [icon]=\"expanded ? 'pi pi-chevron-down' : 'pi pi-chevron-right'\"\r\n (click)=\"handleToggleRow(rowData, $event)\"></button>\r\n</ng-template>\r\n<ng-template #_contentRowGroup let-rowData=\"rowData\" let-groupCol=\"groupCol\" let-groupField=\"_groupField\">\r\n <ng-container [ngTemplateOutlet]=\"contentCell\"\r\n [ngTemplateOutletContext]=\"{rowData: rowData, col: groupCol, field: _groupField}\">\r\n </ng-container>\r\n <span> ({{rowGroupMetadata[rowData[_groupField]].size}})</span>\r\n</ng-template>\r\n<ng-template #trangThaiV5 let-rowData=\"rowData\">\r\n <div class=\"container-text-workflow\">\r\n <button *ngIf=\"!rowData.__workflowCode && !rowData.hiddenWorkflowAction && !rowData.hiddenStartWorkflow\" pButton\r\n class=\"p-button-text link-or-action\" label=\"B\u1EAFt \u0111\u1EA7u\" style=\"border: 1px solid #7ca9cd;\"\r\n pTooltip=\"B\u1EAFt \u0111\u1EA7u ch\u1EA1y quy tr\u00ECnh\" tooltipPosition=\"top\"\r\n [disabled]=\"rowData.__startingWorkflow && !rowData.__notReadyForStart\"\r\n (click)=\"showFormStartWorkflow(rowData)\"></button>\r\n <ng-container *ngIf=\"rowData.__workflowCode\">\r\n <span class=\"content\">{{rowData.__textTrangThai}}</span>\r\n <button *ngIf=\"!rowData.hiddenWorkflowAction\" type=\"button\" pButton icon=\"pi pi-ellipsis-v\"\r\n class=\"link-or-action p-button-text p-button-rounded\" pTooltip=\"H\u00E0nh \u0111\u1ED9ng\" tooltipPosition=\"top\"\r\n [disabled]=\"showingActionWorkflow\" (click)=\"showActionWorkflow($event, rowData)\"></button>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n<ng-template #viewHistory let-rowData=\"rowData\">\r\n <button pButton icon=\"pi pi-calendar\" class=\"p-button-text p-button-rounded link-or-action\" pTooltip=\"Xem l\u1ECBch s\u1EED\"\r\n tooltipPosition=\"top\" (click)=\"viewHistoryWorkflow(setting, rowData)\"></button>\r\n</ng-template>\r\n<ng-template #containerSticky>\r\n <span class=\"fix-sticky top\"></span>\r\n <span class=\"fix-sticky right\"></span>\r\n <!-- <span class=\"fix-sticky bottom\"></span> -->\r\n <span class=\"fix-sticky left\"></span>\r\n</ng-template>\r\n<ng-template #sortIcon let-field=\"field\">\r\n <i class=\"p-sortable-column-icon pi\" style=\"font-size: 0.8em;\"\r\n [ngClass]=\"{'pi-sort-amount-up-alt': field == _sortField && _sortDir === 1, 'pi-sort-amount-down': field == _sortField && _sortDir === -1, 'pi-sort-alt': field != _sortField || _sortDir === 0}\"></i>\r\n</ng-template>\r\n<ng-template #filterDropdown let-col=\"col\">\r\n <div #filterBox style=\"width: 100%; border-radius: 4px;\">\r\n <dropdown *ngIf=\"col && filterSchema.dropdown[col.field]\" [control]=\"filterSchema.dropdown[col.field]\"\r\n [dataSource]=\"filterSchema.dropdown[col.field].dataSource\" [(value)]=\"filterData[col.field]\"\r\n (onHideSmartEvent)=\"onSearch()\" (onShow)=\"onShowFilterDropdownPanel($event)\"\r\n (onHide)=\"onHideFilterDropdownPanel($event)\" (mousedown)=\"initFilterBoxFocus(filterBox)\"></dropdown>\r\n </div>\r\n</ng-template>\r\n<ng-template #filterText let-col=\"col\">\r\n <div #filterBox class=\"text-filter filter-box\" tabindex=\"-1\" (mousedown)=\"initFilterBoxFocus(filterBox)\">\r\n <div tabindex=\"-1\">\r\n <input pInputText type=\"text\" class=\"input-search\" [placeholder]=\"col.label\"\r\n [(ngModel)]=\"filterData[col.field]\" (change)=\"onSearch()\"\r\n (keyup.esc)=\"onClearSearch(filterBox, col.field)\">\r\n </div>\r\n <span [ngClass]=\"{'action-clear': true, 'dirty': filterData[col.field] != null && filterData[col.field] !== ''}\"\r\n [pTooltip]=\"'B\u1ECF filter'\" tooltipPosition=\"top\" (mousedown)=\"onClearSearch(filterBox, col.field)\"\r\n tabindex=\"-1\"><i class=\"pi pi-filter-slash\"></i></span>\r\n <after-view-checked style=\"display: none;\" (loaded)=\"initFilterBoxFocus(filterBox)\">\r\n </after-view-checked>\r\n </div>\r\n</ng-template>\r\n<ng-template #filterNumber let-col=\"col\">\r\n <div #filterBox class=\"number-picker-range filter-box\" tabindex=\"-1\" (mousedown)=\"initFilterBoxFocus(filterBox)\">\r\n <div tabindex=\"-1\">\r\n <tn-number-picker-range #numberRange [maskType]=\"col.dataType\" [(ngModel)]=\"filterData[col.field]\"\r\n [min]=\"col.min\" [max]=\"col.max\" (change)=\"onSearch()\">\r\n </tn-number-picker-range>\r\n </div>\r\n <span\r\n [ngClass]=\"{'action-clear': true, 'dirty': filterData[col.field] && ((filterData[col.field][0] != null && filterData[col.field][0] !== '') || (filterData[col.field][1] != null && filterData[col.field][1] !== ''))}\"\r\n [pTooltip]=\"'B\u1ECF filter'\" tooltipPosition=\"top\" (mousedown)=\"onClearNumberSearch(filterBox, numberRange)\"\r\n tabindex=\"-1\">\r\n <i class=\"pi pi-filter-slash\"></i></span>\r\n <after-view-checked style=\"display: none;\" (loaded)=\"initFilterBoxFocus(filterBox)\">\r\n </after-view-checked>\r\n </div>\r\n</ng-template>\r\n<ng-template #filterDate let-col=\"col\">\r\n <div #filterBox class=\"date-picker-range filter-box\" tabindex=\"-1\" (mousedown)=\"initFilterBoxFocus(filterBox)\">\r\n <div tabindex=\"-1\">\r\n <tn-datetime-picker-range #dateRange [control]=\"filterSchema.dateRange\"\r\n (onChanged)=\"onChangeDateTime($event, col.field)\">\r\n </tn-datetime-picker-range>\r\n </div>\r\n <span\r\n [ngClass]=\"{'action-clear': true, 'dirty': filterData[col.field] && ((filterData[col.field][0] != null && filterData[col.field][0] !== '') || (filterData[col.field][1] != null && filterData[col.field][1] !== ''))}\"\r\n [pTooltip]=\"'B\u1ECF filter'\" tooltipPosition=\"top\"\r\n (mousedown)=\"onClearDateSearch(filterBox, dateRange, col.field)\" tabindex=\"-1\"><i\r\n class=\"pi pi-filter-slash\"></i></span>\r\n <after-view-checked style=\"display: none;\" (loaded)=\"initFilterBoxFocus(filterBox)\">\r\n </after-view-checked>\r\n </div>\r\n</ng-template>\r\n<ng-template #filterBoolean let-col=\"col\">\r\n <div class=\"filter-boolean-box\">\r\n <p-selectButton *ngIf=\"!col.minimizeFilter\"\r\n [options]=\"[{value: true, label: 'C\u00F3', icon: 'pi pi-check'}, {value: false, label: 'Kh\u00F4ng', icon: 'pi pi-times'}]\"\r\n [multiple]=\"true\" [(ngModel)]=\"filterData[col.field]\" (onChange)=\"onChangeBoolean($event, col.field)\">\r\n <ng-template let-item>\r\n <i style=\"padding: 3px 0;\" [class]=\"item.icon\"></i>\r\n </ng-template>\r\n </p-selectButton>\r\n <ng-container *ngIf=\"col.minimizeFilter\">\r\n <button *ngIf=\"!filterData[col.field]\" type=\"button\" pButton icon=\"pi pi-filter-slash\"\r\n class=\"btn-filter-boolean\" (click)=\"showCheckBoxFilterMenu($event, col.field)\"></button>\r\n <button *ngIf=\"filterData[col.field]\" type=\"button\" pButton icon=\"pi pi-filter\"\r\n class=\"btn-filter-boolean p-button-primary\"\r\n (click)=\"showCheckBoxFilterMenu($event, col.field)\"></button>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n<ng-template #fileUploadColumn let-field=\"field\" let-rowData let-fileSetting=\"fileSetting\">\r\n <file-upload *ngIf=\"fileSetting.mode == FileUploadMode.usingFileInstanceId\"\r\n [sharedFolderType]=\"fileSetting.control.sharedFolderType\" [readonly]=\"fileSetting.control.readonly\"\r\n [accept]=\"fileSetting.control.accept\" [(ngModel)]=\"rowData[field]\">\r\n </file-upload>\r\n <service-file-upload *ngIf=\"fileSetting.control.mode == FileUploadMode.usingServiceFile\"\r\n [serviceCode]=\"fileSetting.control.serviceCode\" [parentContext]=\"context\" [entity]=\"fileSetting.control.entity\"\r\n [entityKey]=\"rowData[fileSetting.control.entityKeyField]\" [control]=\"fileSetting.control\"\r\n [fileDataService]=\"fileSetting.control.fileDataService\" [(ngModel)]=\"rowData.field\">\r\n </service-file-upload>\r\n</ng-template>\r\n<ng-template #fileManagerColumn let-rowData let-fileSetting=\"fileSetting\" let-field=\"field\">\r\n <file-manager [control]=\"fileSetting.control\" [serviceCode]=\"fileSetting.control.serviceCode\"\r\n [entity]=\"fileSetting.control.entity\" [entityKey]=\"rowData[fileSetting.control.entityKeyField]\"\r\n [readonly]=\"fileSetting.control.readonly\" [layout]=\"fileSetting.control.layout\"\r\n [maxFileSize]=\"fileSetting.control.maxFileSize\" [inTaiLieu]=\"fileSetting.control.inTaiLieu\"\r\n [(value)]=\"rowData[field]\">\r\n </file-manager>\r\n</ng-template>",
22870
+ template: "<div #container class=\"custom-card card card-w-title flex-container-fit-child\" [attr.height-type]=\"setting.heightType\"\r\n [ngStyle]=\"_style\">\r\n <div class=\"ui-helper-clearfix crud-list-header-area\">\r\n <div *ngIf=\"searchCustom\" class=\"p-grid ui-fluid custom-p-col custom-search-area\">\r\n <div class=\"p-col-12 main-container-search\">\r\n <div class=\"p-grid main-container-search-inner\">\r\n <ng-container>\r\n <ng-container *ngTemplateOutlet=\"searchCustom; context: {$implicit: this}\"></ng-container>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!setting.hiddenHeader\" class=\"p-grid ui-fluid custom-p-col page-title-area\">\r\n <div *ngIf=\"!setting.hiddenPageTitle\" class=\"main-title\">\r\n <h1 *ngIf=\"!hasTemplate('customTitle')\">\r\n {{setting.title != null ? setting.title : 'Danh s\u00E1ch ' + setting.objectName}}\r\n </h1>\r\n\r\n <ng-container *ngIf=\"hasTemplate('customTitle')\" [ngTemplateOutlet]=\"getTemplate('customTitle')\"\r\n [ngTemplateOutletContext]=\"{crudList: this}\">\r\n </ng-container>\r\n </div>\r\n\r\n <div *ngIf=\"!setting.hiddenPageSetting\" class=\"paginator-table\">\r\n <paging-next-back-only [model]=\"model\" [setting]=\"setting\" (onChanged)=\"getData()\"\r\n (onChangeLimitPage)=\"savePageSize()\">\r\n </paging-next-back-only>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"hasTemplate('topGrid')\" class=\"extend-content-top-grid\">\r\n <ng-container [ngTemplateOutletContext]=\"{selectedItems: model.selectedItems, crudList: this}\"\r\n [ngTemplateOutlet]=\"getTemplate('topGrid')\"></ng-container>\r\n </div>\r\n <div class=\"fit-content crud-list-body-area\">\r\n <div class=\"crud-list-body-area-inner\" style=\"overflow: unset;\">\r\n <div class=\"flex-container-fit-child\" style=\"overflow: unset;\">\r\n <div *ngIf=\"!setting.hiddenToolbar\" class=\"p-grid crudListToolbar\">\r\n <ng-container>\r\n <div *ngIf=\"!setting.hiddenButtons && hasTemplate('toolbar')\"\r\n [ngClass]=\"setting.hiddenAdvanceSearch ? 'p-md-12 p-lg-12' : 'p-md-7 p-lg-8'\"\r\n class=\"p-col-12 button-group function-topbar custom-toolbar\">\r\n <ng-container\r\n [ngTemplateOutletContext]=\"{selectedItems: model.selectedItems, crudList: this}\"\r\n [ngTemplateOutlet]=\"getTemplate('toolbar')\"></ng-container>\r\n </div>\r\n <div *ngIf=\"!setting.hiddenButtons && !hasTemplate('toolbar')\"\r\n [ngClass]=\"setting.hiddenAdvanceSearch ? 'p-md-12 p-lg-12' : 'p-md-7 p-lg-8'\"\r\n class=\"p-col-12 button-group function-topbar\">\r\n <ng-container [ngTemplateOutlet]=\"getTemplate('buttonBeforeToolbar')\"\r\n [ngTemplateOutletContext]=\"{crudList: this}\"></ng-container>\r\n <button type=\"button\" pButton label=\"\u0110\u00E1nh STT\" class=\"p-button-text\" style=\"display: none\"\r\n (click)=\"danhSoThuTuGroupLastest()\"></button>\r\n <button *ngIf=\"!hiddenAdd\" type=\"button\" pButton pRipple label=\"Th\u00EAm m\u1EDBi\" icon=\"pi pi-plus\"\r\n class=\"p-button-text\" [disabled]=\"!model.baseReady\" (click)=\"add()\"></button>\r\n <button *ngIf=\"setting.showExportSelectedItems && model.selectedItems.length > 0\"\r\n type=\"button\" pButton pRipple\r\n label=\"Xu\u1EA5t c\u00E1c m\u1EE5c \u0111\u00E3 ch\u1ECDn ({{model.selectedItems.length}})\" icon=\"fas fa-file-excel\"\r\n class=\"p-button-text p-button-success\" (click)=\"xuatCacMucDaChon()\"></button>\r\n <button *ngIf=\"!hiddenDelete && model.selectedItems.length > 0 && !disableMultipleDelete()\"\r\n type=\"button\" pButton pRipple\r\n [label]=\"'X\u00F3a ' + (model.selectedItems.length) | translate\" icon=\"pi pi-trash\"\r\n class=\"p-button-text p-button-danger\" (click)=\"deleteMutiple()\"></button>\r\n <button *ngIf=\"!setting.disableShare && model.selectedItems.length > 0\"\r\n label=\"Chia s\u1EBB li\u00EAn k\u1EBFt\" type=\"button\" pButton pRipple\r\n [pTooltip]=\"'Chia s\u1EBB li\u00EAn k\u1EBFt' | translate\" tooltipPosition=\"top\"\r\n class=\"p-button-text p-button-info link-or-action\" icon=\"pi pi-link\"\r\n (click)=\"createShareLinkMultiple()\"></button>\r\n <ng-container [ngTemplateOutlet]=\"getTemplate('buttonAfterToolbar')\"\r\n [ngTemplateOutletContext]=\"{crudList: this}\"></ng-container>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"!setting.hiddenAdvanceSearch\" class=\"p-col-12 advance-search-container\"\r\n [ngClass]=\"setting.hiddenButtons ? 'p-md-12 p-lg-12' : 'p-md-5 p-lg-4'\">\r\n <advance-search #advanceSearch [parentSetting]=\"setting\" [searchInfo]=\"searchInfo\"\r\n [loading]=\"model.loading\" (onSearch)=\"handleSearchAdvs($event)\"\r\n (onInit)=\"handleInitAdvanceSearch($event)\">\r\n </advance-search>\r\n </div>\r\n </div>\r\n <div *ngIf=\"hasTemplate('topGrid')\" class=\"extend-content-top-grid\">\r\n <ng-container [ngTemplateOutletContext]=\"{selectedItems: model.selectedItems, crudList: this}\"\r\n [ngTemplateOutlet]=\"getTemplate('topGrid')\"></ng-container>\r\n </div>\r\n <div class=\"container-table fit-content\" [class.--table-responsive]=\"responsive\">\r\n <div class=\"container-table-inner\">\r\n <ng-container *ngIf=\"!_groupField\">\r\n <tn-custom-scrollbar *ngIf=\"showScrollBar\" #scrollbar [config]=\"configScrollBar\"\r\n [showScrollHorizontal]=\"showScrollHorizontal\">\r\n <ng-container *ngTemplateOutlet=\"tableGetGroupFieldFalse\">\r\n </ng-container>\r\n <ng-container *ngIf=\"hasTemplate('afterCrudList')\">\r\n <ng-container [ngTemplateOutlet]=\"getTemplate('afterCrudList')\"></ng-container>\r\n </ng-container>\r\n </tn-custom-scrollbar>\r\n <div *ngIf=\"!showScrollBar\">\r\n <ng-container *ngTemplateOutlet=\"tableGetGroupFieldFalse\">\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"_groupField\">\r\n <tn-custom-scrollbar *ngIf=\"showScrollBar\" #scrollbar [config]=\"configScrollBar\"\r\n [showScrollHorizontal]=\"showScrollHorizontal\">\r\n <ng-container *ngTemplateOutlet=\"tableGetGroupFieldTrue\">\r\n </ng-container>\r\n <ng-container *ngIf=\"hasTemplate('afterCrudList')\">\r\n <ng-container [ngTemplateOutlet]=\"getTemplate('afterCrudList')\"></ng-container>\r\n </ng-container>\r\n </tn-custom-scrollbar>\r\n <div *ngIf=\"!showScrollBar\">\r\n <ng-container *ngTemplateOutlet=\"tableGetGroupFieldTrue\">\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n\r\n <div class=\"table-border-line --top\"></div>\r\n <div class=\"table-border-line --right\"></div>\r\n <div class=\"table-border-line --bottom\"></div>\r\n <div class=\"table-border-line --left\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<after-view-checked (loaded)=\"handleReady()\"></after-view-checked>\r\n<settings *ngIf=\"_showSettings && !setting.hiddenSetting\" [entityMetadataService]=\"entityMetadataService\"\r\n [parentContext]=\"context\" [parentSetting]=\"setting\" [parentModel]=\"model\" (onSave)=\"onSaveSettings($event)\"\r\n (onDelete)=\"onDeleteSettings()\" (onCancel)=\"_showSettings = false\">\r\n</settings>\r\n<settings-row *ngIf=\"_showSettingsRowColor && !setting.hiddenSetting\" [entityMetadataService]=\"entityMetadataService\"\r\n [parentContext]=\"context\" [parentSetting]=\"setting\" [parentModel]=\"model\" (onSave)=\"onSaveColorSettings($event)\"\r\n (onCancel)=\"_showSettingsRowColor = false\">\r\n</settings-row>\r\n<workflow-setting-dialog *ngIf=\"_showSettingsWorkflow && !setting.hiddenSettingWorkflow\" [parentSetting]=\"setting\"\r\n [parentContext]=\"context\" [parentModel]=\"model\" (onSaved)=\"onSaveWorkflowSettings($event)\"\r\n (onRemoved)=\"onRemoveWorkflowSettings($event)\" (onCancel)=\"_showSettingsWorkflow = false\"></workflow-setting-dialog>\r\n<tn-dialog *ngIf=\"workflowSettingModel.showEditForm\" [header]=\"'C\u1EA5u h\u00ECnh quy tr\u00ECnh nghi\u1EC7p v\u1EE5' | translate\"\r\n [popupSize]=\"workflowSettingModel.popupSize\" (onHide)=\"workflowSettingModel.showEditForm = false\">\r\n <workflow-setting-new #formBase [parentSetting]=\"setting\" (onSaved)=\"onSaveWorkflowSettingsNew($event)\"\r\n (onCancel)=\"workflowSettingModel.showEditForm = false\"></workflow-setting-new>\r\n</tn-dialog>\r\n<entity-permission *ngIf=\"_showSettingsPermission && !setting.hiddenSettingPermission\" [parentSetting]=\"setting\"\r\n [parentContext]=\"context\" [parentModel]=\"model\" [searchInfo]=\"searchInfo\"\r\n (onCancel)=\"_showSettingsPermission = false\">\r\n</entity-permission>\r\n<p-contextMenu #contextMenu [appendTo]=\"'body'\" [styleClass]=\"'allow-selected'\" [model]=\"buttonContexts\">\r\n</p-contextMenu>\r\n<tn-dialog *ngIf=\"processWorkflowModel.showEditForm\" #dialog [header]=\"processWorkflowModel.header | translate\"\r\n [popupSize]=\"processWorkflowModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"processWorkflowModel.showEditForm = false\">\r\n <div style=\"height: 100%; padding: 1rem\">\r\n <process-workflow-form #formBase [businessSetting]=\"processWorkflowModel.data.setting\" [item]=\"currentItem\"\r\n [workflow]=\"processWorkflowModel.data.workflow\" [action]=\"processWorkflowModel.data.action\"\r\n (onSaved)=\"handleProcessedWorkflowBase()\" (onCancel)=\"processWorkflowModel.showEditForm = false\">\r\n </process-workflow-form>\r\n </div>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"choYKienModel.showEditForm\" #dialog [header]=\"choYKienModel.header | translate\"\r\n [popupSize]=\"choYKienModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"choYKienModel.showEditForm = false\">\r\n <div style=\"height: 100%\">\r\n <cho-y-kien-form #formBase [bussinessSetting]=\"choYKienModel.data.setting\"\r\n [rowItem]=\"choYKienModel.data.rowData\" (onSaved)=\"choYKienModel.showEditForm = false\"\r\n (onCancel)=\"choYKienModel.showEditForm = false\">\r\n </cho-y-kien-form>\r\n </div>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"workflowHistoryModel.showEditForm\" #dialog [header]=\"workflowHistoryModel.header | translate\"\r\n [popupSize]=\"workflowHistoryModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"workflowHistoryModel.showEditForm = false\">\r\n <div style=\"height: 100%\">\r\n <workflow-history-new #formBase [businessSetting]=\"workflowHistoryModel.data.setting\"\r\n [tableName]=\"workflowHistoryModel.data.tableName\" [item]=\"currentItem\"\r\n [workflowSetting]=\"workflowHistoryModel.data.workflowSetting\"\r\n (onCancel)=\"workflowHistoryModel.showEditForm = false\">\r\n </workflow-history-new>\r\n </div>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"detailTaskModel.showEditForm\" #dialog [header]=\"detailTaskModel.header | translate\"\r\n [popupSize]=\"detailTaskModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"detailTaskModel.showEditForm = false\">\r\n <base-congviec-form #formBase [model]=\"detailTaskModel.data.taskFormModel\" [forceOnlyView]=\"true\"\r\n (onCancel)=\"detailTaskModel.showEditForm = false\">\r\n </base-congviec-form>\r\n</tn-dialog>\r\n\r\n<!-- <tn-dialog *ngIf=\"showDetailForm\" #dialog [styleClass]=\"'congviec-form tn-form-dialog'\"\r\n [header]=\"setting.popupHeader | translate\" [popupSize]=\"setting.popupSize\" (onHide)=\"showDetailForm = false\">\r\n <base-congviec-form #formBase [parentModel]=\"model\" [parentSetting]=\"setting\" [parentContext]=\"context\"\r\n [model]=\"formModel\" [crudList]=\"crudList\" (onSaved)=\"showDetailForm = false;crudList.reload()\"\r\n (onCancel)=\"_handleCancel($event)\" (onAfterSaved)=\"onAfterSaved($event)\">\r\n </base-congviec-form>\r\n</tn-dialog> -->\r\n\r\n<tn-dialog *ngIf=\"permissionSharingModel.showEditForm\" #dialog [header]=\"permissionSharingModel.header | translate\"\r\n [popupSize]=\"permissionSharingModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"permissionSharingModel.showEditForm = false\">\r\n <div style=\"height: 100%\">\r\n <permission-sharing #formBase [item]=\"rowDataCurrent\" [baseService]=\"setting.baseService\"\r\n (onCancel)=\"permissionSharingModel.showEditForm = false\">\r\n </permission-sharing>\r\n </div>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"permissionListModel.showEditForm\" #dialog [header]=\"permissionListModel.header | translate\"\r\n [popupSize]=\"permissionListModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\" [useDefaultScrollBar]=\"true\"\r\n (onHide)=\"permissionListModel.showEditForm = false\">\r\n <div style=\"height: 100%\">\r\n <workflow-permission #formBase [item]=\"rowDataCurrent\" [businessSetting]=\"setting\"\r\n (onCancel)=\"permissionListModel.showEditForm = false\">\r\n </workflow-permission>\r\n </div>\r\n</tn-dialog>\r\n<workflow-history-dialog *ngIf=\"showHistoryWorkflow\" [baseService]=\"setting.baseService\" [item]=\"currentItem\"\r\n [workflowSetting]=\"setting.workflowSetting\" (onHide)=\"handleHideHistoryWorkflow()\">\r\n</workflow-history-dialog>\r\n<tn-dialog *ngIf=\"startWorkflowModel.showEditForm\" #dialog [header]=\"startWorkflowModel.header | translate\"\r\n [popupSize]=\"startWorkflowModel.popupSize\" [scrollBarStyleClass]=\"'fit-content'\"\r\n (onHide)=\"startWorkflowModel.showEditForm = false\">\r\n <div style=\"height: 100%\">\r\n <start-workflow #formBase [workflows]=\"startWorkflowModel.data.workflows\"\r\n [defaultWorkflow]=\"startWorkflowModel.data.defaultWorkflow\"\r\n (onCancel)=\"startWorkflowModel.showEditForm = false\" (onSaved)=\"handleStartWorkflowFromDialog($event)\">\r\n </start-workflow>\r\n </div>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"congViecModel.showEditForm\" #dialog [styleClass]=\"'congviec-form tn-form-dialog'\"\r\n [header]=\"congViecModel.header | translate\" [popupSize]=\"congViecModel.popupSize\"\r\n (onHide)=\"congViecModel.showEditForm = false\">\r\n <base-congviec-form #formBase [parentSetting]=\"congViecModel.data.congViecSetting\"\r\n [model]=\"congViecModel.data.model\" (onSaved)=\"congViecModel.showEditForm = false;getData()\"\r\n (onCancel)=\"congViecModel.showEditForm = false\">\r\n </base-congviec-form>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"shareLinkModel.showEditForm\" #dialog [styleClass]=\"'congviec-form tn-form-dialog'\"\r\n [header]=\"shareLinkModel.header | translate\" [popupSize]=\"shareLinkModel.popupSize\" [useDefaultScrollBar]=\"true\"\r\n (onHide)=\"shareLinkModel.showEditForm = false\">\r\n <share-link-by-permission #formBase [setting]=\"setting\" [lstItem]=\"shareLinkModel.data.lstItem\"\r\n (onCancel)=\"congViecModel.showEditForm = false\">\r\n </share-link-by-permission>\r\n</tn-dialog>\r\n<tn-dialog *ngIf=\"attachedTaskModel.showEditForm\" [header]=\"attachedTaskModel.header | translate\"\r\n [popupSize]=\"attachedTaskModel.popupSize\" [useDefaultScrollBar]=\"true\"\r\n (onHide)=\"attachedTaskModel.showEditForm = false\">\r\n <base-congviec [serviceCode]=\"setting.baseService.serviceCode\" [entity]=\"setting.baseService.entityName\"\r\n [itemIdAttach]=\"rowDataCurrent.id\"></base-congviec>\r\n</tn-dialog>\r\n<ng-template #tableGetGroupFieldFalse>\r\n <p-table #table [dataKey]=\"'id'\" [scrollable]=\"pTableScrollable\" [scrollHeight]=\"pTableScrollHeight\"\r\n [columns]=\"setting.cols\" [paginator]=\"false\" [value]=\"_dataSource\" (onSort)=\"onSort($event, table)\"\r\n [class]=\"_tableClass\" [responsive]=\"responsive\" [lazy]=\"lazy\" [loading]=\"model.loading\"\r\n [(selection)]=\"model.selectedItems\" (onRowReorder)=\"handleRowOrdered($event)\">\r\n <ng-template *ngIf=\"colgroup\" pTemplate=\"colgroup\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"colgroup; context: {$implicit: columns}\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"!colgroup\" pTemplate=\"colgroup\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"baseColgroup; context: {$implicit: columns}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"header\" pTemplate=\"header\" let-columns>\r\n <ng-container\r\n *ngTemplateOutlet=\"header, context: {$implicit: columns, crudList: this, rowHeaderFilter: rowHeaderFilter, contentTh: contentTh, containerSticky: containerSticky, funcCheckAll: handleCheckAll}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"!header\" pTemplate=\"header\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"trHeader; context: {$implicit: columns, funcCheckAll: handleCheckAll}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-index=\"rowIndex\" let-expanded=\"expanded\">\r\n <ng-container\r\n *ngTemplateOutlet=\"trBody; context: {$implicit: rowData, columns: columns, index: index, expanded: expanded, eventSelectRow: handleSelectRow, eventChecked: handleCheckRowData}\">\r\n </ng-container>\r\n <after-view-checked *ngIf=\"index == _dataSource.length - 1\" style=\"display: none;\" [renderKey]=\"_dataSource\"\r\n (loaded)=\"handleTableRendered()\">\r\n </after-view-checked>\r\n </ng-template>\r\n <ng-template *ngIf=\"rowExpansion\" pTemplate=\"rowexpansion\" let-rowData let-expanded=\"expanded\">\r\n <ng-container\r\n *ngTemplateOutlet=\"rowExpansion; context: {rowData: rowData, expanded: expanded, getColSpanGroup: getColSpanGroup}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"summary\" pTemplate=\"summary\">\r\n <ng-container *ngTemplateOutlet=\"summary\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"footer\" pTemplate=\"footer\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"footer; context: {$implicit: columns}\"></ng-container>\r\n </ng-template>\r\n </p-table>\r\n</ng-template>\r\n<ng-template #tableGetGroupFieldTrue>\r\n <p-table #tableGroup [scrollable]=\"pTableScrollable\" [scrollHeight]=\"pTableScrollHeight\" [columns]=\"setting.cols\"\r\n [paginator]=\"false\" [value]=\"_dataSource\" [metaKeySelection]=\"false\" (onSort)=\"onSort($event, tableGroup)\"\r\n [class]=\"_tableClass\" [customSort]=\"true\" [responsive]=\"responsive\" [lazy]=\"true\" [loading]=\"model.loading\"\r\n [(selection)]=\"model.selectedItems\" [expandedRowKeys]=\"model.expandedRowKeys\" [dataKey]=\"_groupField\">\r\n <ng-template *ngIf=\"colgroup\" pTemplate=\"colgroup\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"colgroup; context: {$implicit: columns}\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"!colgroup\" pTemplate=\"colgroup\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"baseColgroup; context: {$implicit: columns}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"header\" pTemplate=\"header\" let-columns>\r\n <ng-container\r\n *ngTemplateOutlet=\"header, context: {$implicit: columns, crudList: this, rowHeaderFilter: rowHeaderFilter, contentTh: contentTh, containerSticky: containerSticky, funcCheckAll: handleCheckAll_Group}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"!header\" pTemplate=\"header\" let-columns>\r\n <ng-container\r\n *ngTemplateOutlet=\"trHeader; context: {$implicit: columns, funcCheckAll: handleCheckAll_Group}\">\r\n </ng-container>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-rowIndex=\"rowIndex\" let-expanded=\"expanded\" let-columns=\"columns\">\r\n <tr *ngIf=\"rowGroupMetadata[rowData[_groupField]] && rowGroupMetadata[rowData[_groupField]].index == rowIndex\"\r\n class=\"p-widget-header group-row\" style=\"border: 0px; border-bottom: 1px solid #eee\">\r\n <td *ngIf=\"!setting.hiddenCheckbox\" class=\"center chkbox\" [class.sticky]=\"setting.stickyColumn\">\r\n <p-checkbox [(ngModel)]=\"rowGroupChecked[rowData[_groupField]]\" binary=\"true\"\r\n (onChange)=\"handleCheckRowGroup(rowData)\">\r\n </p-checkbox>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <ng-container *ngIf=\"!rowGroup\">\r\n <td [colSpan]=\"getColSpanGroup()\" [class]=\"_classRowGroup\">\r\n <div class=\"container-row-group\">\r\n <a href=\"javascript:;\" [pRowToggler]=\"rowData\" class=\"container-row-group-toggle\"\r\n [class.sticky]=\"setting.stickyColumn\">\r\n <i style=\"margin-right:5px\"\r\n [ngClass]=\"expanded ? 'fas fa-fw fa-caret-down' : 'fas fa-fw fa-caret-right'\"></i>\r\n <span class=\"content-row-group\">\r\n <ng-container *ngIf=\"!contentRowGroup\">\r\n <ng-container [ngTemplateOutlet]=\"_contentRowGroup\"\r\n [ngTemplateOutletContext]=\"getContextRowGroup(rowData)\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"contentRowGroup\">\r\n <ng-container [ngTemplateOutlet]=\"contentRowGroup\"\r\n [ngTemplateOutletContext]=\"getContextRowGroup(rowData)\">\r\n </ng-container>\r\n </ng-container>\r\n </span>\r\n </a>\r\n </div>\r\n </td>\r\n </ng-container>\r\n <ng-container *ngIf=\"rowGroup\">\r\n <ng-container [ngTemplateOutlet]=\"rowGroup\"\r\n [ngTemplateOutletContext]=\"getContextRowGroupRoot(rowData, expanded)\">\r\n </ng-container>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"rowexpansion\" let-columns=\"columns\" let-rowData let-index=\"rowIndex\">\r\n <ng-container\r\n *ngTemplateOutlet=\"trBody; context: {$implicit: rowData, columns: columns, index: index, expanded: false, eventSelectRow: handleSelectRowGroup, eventChecked: handleCheckRowData_Group}\">\r\n </ng-container>\r\n <after-view-checked *ngIf=\"index == _dataSource.length - 1\" style=\"display: none;\" [renderKey]=\"_dataSource\"\r\n (loaded)=\"handleTableRendered()\">\r\n </after-view-checked>\r\n </ng-template>\r\n <ng-template *ngIf=\"summary\" pTemplate=\"summary\">\r\n <ng-container *ngTemplateOutlet=\"summary\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"footer\" pTemplate=\"footer\" let-columns>\r\n <ng-container *ngTemplateOutlet=\"footer; context: {$implicit: columns}\"></ng-container>\r\n </ng-template>\r\n </p-table>\r\n <after-view-checked></after-view-checked>\r\n</ng-template>\r\n<ng-template #baseColgroup let-columns>\r\n <colgroup>\r\n <col *ngIf=\"!setting.hiddenCheckbox\" [style.width]=\"widthCheckbox\" />\r\n <col *ngIf=\"!setting.hiddenOrderColumn\" [style.width]=\"widthOrderColumn\" />\r\n <col *ngIf=\"rowExpansion\" style=\"width: 2.5rem\" />\r\n <ng-container *ngFor=\"let col of columns; let i = index\">\r\n <col *ngIf=\"col && col.visible && col.field!='function'\" [style.width]=\"col.width\" />\r\n </ng-container>\r\n <col *ngIf=\"enableReorderRow\" style=\"width: 30px\" />\r\n <col *ngIf=\"!setting.hiddenFunctionColumn\" [style.width]=\"widthFunctionColumn || _widthFunctionColumn\" />\r\n </colgroup>\r\n</ng-template>\r\n<ng-template #trHeader let-columns let-funcCheckAll=\"funcCheckAll\">\r\n <tr class=\"title-row\">\r\n <ng-container *ngIf=\"!setting.hiddenCheckbox\">\r\n <th class=\"chkbox link-or-action cell-checkbox\" [class.sticky]=\"setting.stickyColumn\">\r\n <button *ngIf=\"!hasTemplate('headerCheckbox')\" type=\"button\" pButton pRipple icon=\"pi pi-refresh\"\r\n class=\"p-button-rounded p-button-text btnReload\" pTooltip=\"L\u00E0m m\u1EDBi d\u1EEF li\u1EC7u\" tooltipPosition=\"top\"\r\n [disabled]=\"model.loading\" (click)=\"reload()\"></button>\r\n <ng-container *ngIf=\"hasTemplate('headerCheckbox')\">\r\n <ng-container [ngTemplateOutletContext]=\"{crudList: this}\"\r\n [ngTemplateOutlet]=\"getTemplate('headerCheckbox')\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </ng-container>\r\n <th *ngIf=\"!setting.hiddenOrderColumn\" class=\"stt nopad center\" [class.sticky]=\"setting.stickyColumn\"\r\n (dblclick)=\"reload()\">\r\n {{ 'TT' |translate}}\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <th *ngIf=\"rowExpansion\" class=\"nopad row-expansion-toggle center\" style=\"width: 2.5rem\"\r\n [class.sticky]=\"setting.stickyColumn\">\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <ng-container *ngFor=\"let col of columns; let i = index\">\r\n <th *ngIf=\"col && col.visible && col.field!='function'\" [ngStyle]=\"col.extendData.headerStyle\"\r\n [pTooltip]=\"col.fullLabel\" tooltipStyleClass=\"unset-width\" [class]=\"col.extendData.headerClass\"\r\n [class.first-th]=\"i==0\" [escape]=\"false\" tooltipPosition=\"top\" [tnSortableColumn]=\"col.field\"\r\n [tnSortableColumnDisabled]=\"!col.sort\">\r\n <ng-container *ngTemplateOutlet=\"contentTh; context: {$implicit: col}\"></ng-container>\r\n <ng-container *ngIf=\"col.sort || col.sortClient\">\r\n <ng-container *ngTemplateOutlet=\"sortIcon; context: {field: col.field}\"></ng-container>\r\n </ng-container>\r\n </th>\r\n </ng-container>\r\n <th *ngIf=\"enableReorderRow\" style=\"width: 30px\">\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <ng-container *ngTemplateOutlet=\"colFunctionHeader\"></ng-container>\r\n </tr>\r\n <ng-container *ngTemplateOutlet=\"rowHeaderFilter; context: {columns: columns, funcCheckAll: funcCheckAll}\">\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #rowHeaderFilter let-columns=\"columns\" let-funcCheckAll=\"funcCheckAll\">\r\n <tr class=\"filter-row\" *ngIf=\"!setting.hiddenFilterRow\">\r\n <th *ngIf=\"!setting.hiddenCheckbox\" class=\"chkbox nopad center\" [class.sticky]=\"setting.stickyColumn\"\r\n [class.tricheckbox-custom-false]=\"checkedAll === false\">\r\n <p-triStateCheckbox [(ngModel)]=\"checkedAll\" binary=\"true\" (onChange)=\"funcCheckAll()\">\r\n </p-triStateCheckbox>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <th *ngIf=\"!setting.hiddenOrderColumn\" class=\"stt center v-top\" [class.sticky]=\"setting.stickyColumn\">\r\n <div *ngIf=\"!setting.hiddenSetting\" class=\"pick-color-row\" pTooltip=\"C\u1EA5u h\u00ECnh hi\u1EC3n th\u1ECB m\u00E0u\"\r\n tooltipPosition=\"top\" (click)=\"showSettingRowColor()\">\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n </div>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <th *ngIf=\"rowExpansion\" class=\"nopad center row-expansion-toggle\" [class.sticky]=\"setting.stickyColumn\">\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <ng-container *ngFor=\"let col of columns; let i = index\">\r\n <th *ngIf=\"col.visible && col.field != 'function'\" class=\"cell-header-filter center\">\r\n <ng-container *ngIf=\"col.allowFilter\">\r\n <ng-container *ngIf=\"col.templateFilter\">\r\n <ng-container [ngTemplateOutlet]=\"col.templateFilter\"\r\n [ngTemplateOutletContext]=\"{col: col, filterData: filterData, onSearch: onSearch, onShowFilterDropdownPanel: onShowFilterDropdownPanel, onHideFilterDropdownPanel: onHideFilterDropdownPanel}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!col.templateFilter\" [ngSwitch]=\"col.controlType\">\r\n <ng-container *ngSwitchCase=\"'dropdown'\">\r\n <ng-container [ngTemplateOutlet]=\"filterDropdown\"\r\n [ngTemplateOutletContext]=\"{col: col.rawColumn}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'number'\">\r\n <ng-container [ngTemplateOutlet]=\"filterNumber\" [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ng-container [ngTemplateOutlet]=\"filterDate\" [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'datetime'\">\r\n <ng-container [ngTemplateOutlet]=\"filterDate\" [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container [ngSwitch]=\"col.dataType\">\r\n <ng-container *ngSwitchCase=\"'int'\">\r\n <ng-container [ngTemplateOutlet]=\"filterNumber\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'decimal'\">\r\n <ng-container [ngTemplateOutlet]=\"filterNumber\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ng-container [ngTemplateOutlet]=\"filterDate\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'datetime'\">\r\n <ng-container [ngTemplateOutlet]=\"filterDate\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'boolean'\">\r\n <ng-container [ngTemplateOutlet]=\"filterBoolean\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container [ngTemplateOutlet]=\"filterText\"\r\n [ngTemplateOutletContext]=\"{col: col}\">\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </ng-container>\r\n <th *ngIf=\"enableReorderRow\" style=\"width: 30px\">\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n <th *ngIf=\"!setting.hiddenFunctionColumn\" class=\"center setting-cell column-function\"\r\n [class.sticky]=\"setting.stickyColumn\">\r\n <button *ngIf=\"!setting.hiddenSetting\" type=\"button\" pButton pRipple icon=\"pi pi-cog\"\r\n class=\"p-button-rounded p-button-text\" pTooltip=\"C\u1EA5u h\u00ECnh hi\u1EC3n th\u1ECB\" tooltipPosition=\"top\"\r\n (click)=\"showSettings()\"></button>\r\n <button *ngIf=\"!setting.hiddenSettingPermission\" type=\"button\" pButton pRipple icon=\"pi pi-users\"\r\n class=\"p-button-rounded p-button-text\" pTooltip=\"Ph\u00E2n quy\u1EC1n d\u1EEF li\u1EC7u\" tooltipPosition=\"left\"\r\n [disabled]=\"!checkPermissionToUseButton(BUTTON_PHAN_QUYEN)\" (click)=\"showSettingsPermission()\"></button>\r\n <button *ngIf=\"!setting.hiddenSettingWorkflow\" type=\"button\" pButton pRipple icon=\"pi pi-sitemap\"\r\n class=\"p-button-rounded p-button-text\" pTooltip=\"C\u1EA5u h\u00ECnh quy tr\u00ECnh\" tooltipPosition=\"left\"\r\n [disabled]=\"!checkPermissionToUseButton(BUTTON_CAU_HINH_QUY_TRINH)\"\r\n (click)=\"showSettingsWorkflowNew()\"></button>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </tr>\r\n</ng-template>\r\n<ng-template #colFunctionHeader>\r\n <ng-container *ngIf=\"!setting.hiddenFunctionColumn\">\r\n <th class=\"column-function\" [class.sticky]=\"setting.stickyColumn\">\r\n <div class=\"cell-header-function\">\r\n <span>{{'GRID.FUNCTION'| translate}}</span>\r\n </div>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </th>\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #contentTh let-col>\r\n <ng-container *ngIf=\"templateHeaderContent[col.field]\">\r\n <ng-container *ngTemplateOutlet=\"templateHeaderContent[col.field]\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!templateHeaderContent[col.field]\">\r\n {{col.label}}\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n</ng-template>\r\n<ng-template #trBody let-rowData let-columns=\"columns\" let-index=\"index\" let-expanded=\"expanded\"\r\n let-eventSelectRow=\"eventSelectRow\" let-eventChecked=\"eventChecked\">\r\n <tr [tnReorderableRow]=\"index\" [attr.rowIndex]=\"index\" [ngClass]=\"rowData.objStyleClass\"\r\n [class.ui-state-highlight]=\"rowData._checked\" [pTooltip]=\"rowData.tooltip\" tooltipPosition=\"top\"\r\n [tooltipStyleClass]=\"rowData.tooltipClass\" [escape]=\"escape\" (click)=\"eventSelectRow($event, rowData)\">\r\n <ng-container *ngIf=\"!setting.hiddenCheckbox\">\r\n <td class=\"chkbox link-or-action cell-checkbox\" [class.sticky]=\"setting.stickyColumn\">\r\n <ng-container *ngIf=\"!rowData.hiddenCheckBox\">\r\n <ng-container *ngIf=\"!hasTemplate('checkbox')\">\r\n <p-checkbox [(ngModel)]=\"rowData._checked\" binary=\"true\" (onChange)=\"eventChecked(rowData)\">\r\n </p-checkbox>\r\n </ng-container>\r\n <ng-container *ngIf=\"hasTemplate('checkbox')\">\r\n <ng-container [ngTemplateOutlet]=\"getTemplate('checkbox')\"\r\n [ngTemplateOutletContext]=\"{rowData: rowData, rowIndex: index}\"></ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n </ng-container>\r\n <td *ngIf=\"!setting.hiddenOrderColumn && (!rowData.hidden || !rowData.hidden[fieldOrder])\" class=\"stt\"\r\n style=\"text-align: center;\" [class.sticky]=\"setting.stickyColumn\"\r\n [attr.colSpan]=\"rowData.colSpan && rowData.colSpan[fieldOrder]\"\r\n [attr.rowSpan]=\"rowData.rowSpan && rowData.rowSpan[fieldOrder]\">\r\n <span class=\"row-card\" [ngStyle]=\"rowData.bookmarkStyle\"></span>\r\n {{rowData[fieldOrder]}}\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <td *ngIf=\"rowExpansion\" class=\"no-padding center row-expansion-toggle\" [class.sticky]=\"setting.stickyColumn\">\r\n <ng-container *ngTemplateOutlet=\"iconToggleRowData; context: {rowData: rowData, expanded: expanded}\">\r\n </ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <ng-container\r\n *ngTemplateOutlet=\"dynamicColBodys; context: {$implicit: columns, rowData: rowData, index: index, expanded: expanded}\">\r\n </ng-container>\r\n <td *ngIf=\"enableReorderRow\" class=\"no-padding center\">\r\n <i class=\"fas fa-arrows-alt\" style=\"cursor:pointer; padding: 8px; color: #555;\" pReorderableRowHandle></i>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n <ng-container *ngIf=\"!setting.hiddenFunctionColumn\">\r\n <td class=\"text-center column-function\" style=\"text-align: center;\" [class.sticky]=\"setting.stickyColumn\">\r\n <div *ngIf=\"hasTemplate('function')\" class=\"p-toolbar-group-center button-group\">\r\n <ng-container [ngTemplateOutlet]=\"getTemplate('function')\"\r\n [ngTemplateOutletContext]=\"{rowData: rowData, rowIndex: index}\"></ng-container>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </div>\r\n <div *ngIf=\"!hasTemplate('function')\" class=\"p-toolbar-group-center button-group\">\r\n <ng-container [ngTemplateOutletContext]=\"{rowData: rowData, rowIndex: index}\"\r\n [ngTemplateOutlet]=\"getTemplate('buttonBefore')\"></ng-container>\r\n <button *ngIf=\"setting.showVersionButton\" type=\"button\" pButton pRipple icon=\"pi pi-calendar\"\r\n class=\"p-button-rounded p-button-success link-or-action\" pTooltip=\"Xem l\u1ECBch s\u1EED phi\u00EAn b\u1EA3n\"\r\n tooltipPosition=\"top\" (click)=\"showListVersion(rowData)\"></button>\r\n <button *ngIf=\"!rowData.hiddenEdit\" type=\"button\" pButton pRipple [disabled]=\"disableEdit(rowData)\"\r\n [pTooltip]=\"'FORM.EDIT' | translate\" tooltipPosition=\"top\"\r\n class=\"p-button-rounded p-button-text p-button-info link-or-action\" icon=\"pi pi-pencil\"\r\n (click)=\"edit(rowData)\"></button>\r\n <button *ngIf=\"!rowData.hiddenDelete\" type=\"button\" pButton pRipple\r\n [disabled]=\"disableDelete(rowData)\" [pTooltip]=\"'FORM.DELETE' | translate\" tooltipPosition=\"top\"\r\n class=\"p-button-rounded p-button-text p-button-danger link-or-action\" icon=\"pi pi-trash\"\r\n (click)=\"delete(rowData)\"></button>\r\n <button *ngIf=\"showMenuButtons && this.menuButtons\" type=\"button\" pButton icon=\"pi pi-ellipsis-v\"\r\n class=\"link-or-action p-button-text p-button-info p-button-rounded\" pTooltip=\"Ch\u1EE9c n\u0103ng kh\u00E1c\"\r\n tooltipPosition=\"top\" (click)=\"showContextMenu($event, rowData)\"></button>\r\n <ng-container [ngTemplateOutletContext]=\"{rowData: rowData, rowIndex: index}\"\r\n [ngTemplateOutlet]=\"getTemplate('buttonAfter')\"></ng-container>\r\n </div>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n</ng-template>\r\n<ng-template #dynamicColBodys let-columns let-rowData=\"rowData\" let-index=\"index\" let-expanded=\"expanded\">\r\n <ng-container *ngFor=\"let col of columns; let i = index\">\r\n <ng-container\r\n *ngTemplateOutlet=\"contentTd; context: {$implicit: rowData, col: col, index: index, i: i, expanded: expanded}\">\r\n </ng-container>\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #contentTd let-rowData let-col=\"col\" let-index=\"index\" let-expanded=\"expanded\" let-i=\"i\">\r\n <td *ngIf=\"col && col.visible && col.field != 'function' && (!rowData.hidden || !rowData.hidden[col.field])\"\r\n [attr.colSpan]=\"rowData.colSpan && rowData.colSpan[col.field]\"\r\n [attr.rowSpan]=\"rowData.rowSpan && rowData.rowSpan[col.field]\" [ngStyle]=\"col.extendData.style\"\r\n [class]=\"col.cellClass\" [class.first-td]=\"i == 0\">\r\n <span *ngIf=\"col.pipe\">\r\n <span class=\"p-column-title\" [pTooltip]=\"col.fullLabel\" [escape]=\"false\"\r\n tooltipPosition=\"top\">{{col.label}}</span>\r\n {{rowData['pipe__' + col.field]}}\r\n </span>\r\n <span *ngIf=\"!col.pipe\">\r\n <span class=\"p-column-title\" [pTooltip]=\"col.fullLabel\" [escape]=\"false\"\r\n tooltipPosition=\"top\">{{col.label}}</span>\r\n <span *ngIf=\"setting.showEditLink && col.showEditLink\" [pTooltip]=\"config.tooltipView\" tooltipPosition=\"top\"\r\n class=\"link-or-action\">\r\n <a href=\"javascript:;\" (click)=\"view(rowData)\" [pTooltip]=\"config.tooltipView\" tooltipPosition=\"top\">\r\n <ng-container [ngTemplateOutlet]=\"contentCell\"\r\n [ngTemplateOutletContext]=\"getContextCell(rowData, index, col, expanded, this)\">\r\n </ng-container>\r\n </a>\r\n </span>\r\n <span *ngIf=\"!setting.showEditLink || !col.showEditLink\">\r\n <ng-container [ngTemplateOutlet]=\"contentCell\"\r\n [ngTemplateOutletContext]=\"getContextCell(rowData, index, col, expanded, this)\">\r\n </ng-container>\r\n </span>\r\n </span>\r\n <ng-container *ngTemplateOutlet=\"containerSticky\"></ng-container>\r\n </td>\r\n</ng-template>\r\n<ng-template #contentCell let-col=\"col\" let-rowData=\"rowData\" let-rowIndex=\"rowIndex\" let-field=\"field\"\r\n let-expanded=\"expanded\">\r\n <ng-container *ngIf=\"col.template\">\r\n <ng-container [ngTemplateOutlet]=\"col.template\"\r\n [ngTemplateOutletContext]=\"getContextCell(rowData, rowIndex, col, expanded,this)\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!col.template\">\r\n <ng-container [ngSwitch]=\"col.dataType\">\r\n <span *ngSwitchCase=\"'color'\" style=\"display:block;text-align:center;\">\r\n <div [pTooltip]=\"rowData[field]\" tooltipPosition=\"top\" [ngStyle]=\"{'background-color':rowData[field]}\"\r\n style=\"width:30px;height:30px;margin:0 auto;\"></div>\r\n </span>\r\n <span *ngSwitchCase=\"'icon'\" style=\"display:block;text-align:center;\">\r\n <i [pTooltip]=\"rowData[field]\" tooltipPosition=\"top\" style=\"text-align: center;\"\r\n [ngClass]=\"rowData[field]\"></i>\r\n </span>\r\n <span *ngSwitchCase=\"'date'\" [pTooltip]=\"rowData[field] | date:'dd/MM/yyyy'\" tooltipPosition=\"top\">\r\n {{rowData[field] | tnDate:col.dataType:col.format}}\r\n </span>\r\n <span *ngSwitchCase=\"'datetime'\" [pTooltip]=\"rowData[field] | date:'dd/MM/yyyy HH:mm'\"\r\n tooltipPosition=\"top\">\r\n {{rowData[field] | tnDate:col.dataType:col.format}}\r\n </span>\r\n <span *ngSwitchCase=\"'user'\" class=\"user\">\r\n {{rowData[field] | userFormat | async}}\r\n </span>\r\n <div *ngSwitchCase=\"'users'\" [innerHTML]=\"rowData[field] | usersFormat | async\">\r\n </div>\r\n <span *ngSwitchCase=\"'int'\">\r\n {{rowData[field]}}\r\n </span>\r\n <span *ngSwitchCase=\"'decimal'\">\r\n {{rowData[field]}}\r\n </span>\r\n <span *ngSwitchCase=\"'boolean'\">\r\n <p-checkbox class=\"boolean-data-type\" [(ngModel)]=\"rowData[field]\" binary=\"true\"\r\n [disabled]=\"col.disableCheckBox\">\r\n </p-checkbox>\r\n </span>\r\n <span *ngSwitchCase=\"'html'\">\r\n <div *ngIf=\"rowData[field]==null?'':rowData[field]\" [innerHTML]=\"rowData[field] | safeHtml\"></div>\r\n </span>\r\n <span *ngSwitchCase=\"'metadataStatus'\">\r\n <span *ngIf=\"rowData['rejectReason']\" class=\"label-danger\" [pTooltip]=\"rowData['rejectReason']\"\r\n tooltipStyleClass=\"unset-width\" [escape]=\"false\" tooltipPosition=\"top\">T\u1EEB ch\u1ED1i</span>\r\n <span *ngIf=\"rowData[field] == '0' && !rowData['rejectReason']\" class=\"label-secondary\">Ch\u01B0a\r\n duy\u1EC7t</span>\r\n <span *ngIf=\"rowData[field] == '1' && !rowData['rejectReason']\" class=\"label-warning\">Ch\u1EDD duy\u1EC7t</span>\r\n <span *ngIf=\"rowData[field] == '2'\" class=\"label-primary\">\u0110\u00E3 duy\u1EC7t</span>\r\n </span>\r\n <ng-container *ngSwitchCase=\"'fileUpload'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"fileUploadColumn; context: {$implicit: rowData, field: col.field, fileSetting: col.fileSetting}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'fileManager'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"fileManagerColumn; context: {$implicit: rowData, field: col.field, fileSetting: col.fileSetting}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'string'\">\r\n <ng-container *ngTemplateOutlet=\"contentCellString; context: {$implicit: rowData, field: col.field}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"null\">\r\n <ng-container *ngTemplateOutlet=\"contentCellString; context: {$implicit: rowData, field: col.field}\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container [ngTemplateOutlet]=\"getComponentByType(col.dataType)\"\r\n [ngTemplateOutletContext]=\"getContextCell(rowData, rowIndex, col, expanded, this)\">\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n</ng-template>\r\n<ng-template #contentCellString let-rowData let-field=\"field\">\r\n <span>\r\n <!-- __sv: Short Value -->\r\n <ng-container *ngIf=\"rowData[field + '__sv']\">\r\n <ng-container *ngIf=\"!rowData[field + '__showFull']\">\r\n {{rowData[field + '__sv']}}\r\n <span class=\"toggle-showfull\" (click)=\"toggleShowFull(rowData, field)\" pTooltip=\"B\u1EA5m \u0111\u1EC3 xem th\u00EAm\"\r\n tooltipPosition=\"top\">[...]</span>\r\n </ng-container>\r\n <ng-container *ngIf=\"rowData[field + '__showFull']\">\r\n {{rowData[field]}}\r\n <span class=\"toggle-showfull\" (click)=\"toggleShowFull(rowData, field)\">Thu g\u1ECDn</span>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!rowData[field + '__sv']\">\r\n {{rowData[field]}}\r\n </ng-container>\r\n </span>\r\n</ng-template>\r\n<ng-template #iconToggleRowGroup let-rowData=\"rowData\" let-expanded=\"expanded\">\r\n <a href=\"javascript:;\" (click)=\"handleToggleRow(rowData, $event)\">\r\n <i style=\"margin-right:5px\" [ngClass]=\"expanded ? 'fas fa-fw fa-caret-down' : 'fas fa-fw fa-caret-right'\"></i>\r\n </a>\r\n</ng-template>\r\n<ng-template #iconToggleRowData let-rowData=\"rowData\" let-expanded=\"expanded\">\r\n <button type=\"button\" pButton pRipple class=\"link-or-action p-button-text p-button-rounded p-button-plain\"\r\n [icon]=\"expanded ? 'pi pi-chevron-down' : 'pi pi-chevron-right'\"\r\n (click)=\"handleToggleRow(rowData, $event)\"></button>\r\n</ng-template>\r\n<ng-template #_contentRowGroup let-rowData=\"rowData\" let-groupCol=\"groupCol\" let-groupField=\"_groupField\">\r\n <ng-container [ngTemplateOutlet]=\"contentCell\"\r\n [ngTemplateOutletContext]=\"{rowData: rowData, col: groupCol, field: _groupField}\">\r\n </ng-container>\r\n <span> ({{rowGroupMetadata[rowData[_groupField]].size}})</span>\r\n</ng-template>\r\n<ng-template #trangThaiV5 let-rowData=\"rowData\">\r\n <div class=\"container-text-workflow\">\r\n <button *ngIf=\"!rowData.__workflowCode && !rowData.hiddenWorkflowAction && !rowData.hiddenStartWorkflow\" pButton\r\n class=\"p-button-text link-or-action\" label=\"B\u1EAFt \u0111\u1EA7u\" style=\"border: 1px solid #7ca9cd;\"\r\n pTooltip=\"B\u1EAFt \u0111\u1EA7u ch\u1EA1y quy tr\u00ECnh\" tooltipPosition=\"top\"\r\n [disabled]=\"rowData.__startingWorkflow && !rowData.__notReadyForStart\"\r\n (click)=\"showFormStartWorkflow(rowData)\"></button>\r\n <ng-container *ngIf=\"rowData.__workflowCode\">\r\n <span class=\"content\">{{rowData.__textTrangThai}}</span>\r\n <button *ngIf=\"!rowData.hiddenWorkflowAction\" type=\"button\" pButton icon=\"pi pi-ellipsis-v\"\r\n class=\"link-or-action p-button-text p-button-rounded\" pTooltip=\"H\u00E0nh \u0111\u1ED9ng\" tooltipPosition=\"top\"\r\n [disabled]=\"showingActionWorkflow\" (click)=\"showActionWorkflow($event, rowData)\"></button>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n<ng-template #viewHistory let-rowData=\"rowData\">\r\n <button pButton icon=\"pi pi-calendar\" class=\"p-button-text p-button-rounded link-or-action\" pTooltip=\"Xem l\u1ECBch s\u1EED\"\r\n tooltipPosition=\"top\" (click)=\"viewHistoryWorkflow(setting, rowData)\"></button>\r\n</ng-template>\r\n<ng-template #containerSticky>\r\n <span class=\"fix-sticky top\"></span>\r\n <span class=\"fix-sticky right\"></span>\r\n <!-- <span class=\"fix-sticky bottom\"></span> -->\r\n <span class=\"fix-sticky left\"></span>\r\n</ng-template>\r\n<ng-template #sortIcon let-field=\"field\">\r\n <i class=\"p-sortable-column-icon pi\" style=\"font-size: 0.8em;\"\r\n [ngClass]=\"{'pi-sort-amount-up-alt': field == _sortField && _sortDir === 1, 'pi-sort-amount-down': field == _sortField && _sortDir === -1, 'pi-sort-alt': field != _sortField || _sortDir === 0}\"></i>\r\n</ng-template>\r\n<ng-template #filterDropdown let-col=\"col\">\r\n <div #filterBox style=\"width: 100%; border-radius: 4px;\">\r\n <dropdown *ngIf=\"col && filterSchema.dropdown[col.field]\" [control]=\"filterSchema.dropdown[col.field]\"\r\n [dataSource]=\"filterSchema.dropdown[col.field].dataSource\" [(value)]=\"filterData[col.field]\"\r\n (onHideSmartEvent)=\"onSearch()\" (onShow)=\"onShowFilterDropdownPanel($event)\"\r\n (onHide)=\"onHideFilterDropdownPanel($event)\" (mousedown)=\"initFilterBoxFocus(filterBox)\"></dropdown>\r\n </div>\r\n</ng-template>\r\n<ng-template #filterText let-col=\"col\">\r\n <div #filterBox class=\"text-filter filter-box\" tabindex=\"-1\" (mousedown)=\"initFilterBoxFocus(filterBox)\">\r\n <div tabindex=\"-1\">\r\n <input pInputText type=\"text\" class=\"input-search\" [placeholder]=\"col.label\"\r\n [(ngModel)]=\"filterData[col.field]\" (change)=\"onSearch()\"\r\n (keyup.esc)=\"onClearSearch(filterBox, col.field)\">\r\n </div>\r\n <span [ngClass]=\"{'action-clear': true, 'dirty': filterData[col.field] != null && filterData[col.field] !== ''}\"\r\n [pTooltip]=\"'B\u1ECF filter'\" tooltipPosition=\"top\" (mousedown)=\"onClearSearch(filterBox, col.field)\"\r\n tabindex=\"-1\"><i class=\"pi pi-filter-slash\"></i></span>\r\n <after-view-checked style=\"display: none;\" (loaded)=\"initFilterBoxFocus(filterBox)\">\r\n </after-view-checked>\r\n </div>\r\n</ng-template>\r\n<ng-template #filterNumber let-col=\"col\">\r\n <div #filterBox class=\"number-picker-range filter-box\" tabindex=\"-1\" (mousedown)=\"initFilterBoxFocus(filterBox)\">\r\n <div tabindex=\"-1\">\r\n <tn-number-picker-range #numberRange [maskType]=\"col.dataType\" [(ngModel)]=\"filterData[col.field]\"\r\n [min]=\"col.min\" [max]=\"col.max\" (change)=\"onSearch()\">\r\n </tn-number-picker-range>\r\n </div>\r\n <span\r\n [ngClass]=\"{'action-clear': true, 'dirty': filterData[col.field] && ((filterData[col.field][0] != null && filterData[col.field][0] !== '') || (filterData[col.field][1] != null && filterData[col.field][1] !== ''))}\"\r\n [pTooltip]=\"'B\u1ECF filter'\" tooltipPosition=\"top\" (mousedown)=\"onClearNumberSearch(filterBox, numberRange)\"\r\n tabindex=\"-1\">\r\n <i class=\"pi pi-filter-slash\"></i></span>\r\n <after-view-checked style=\"display: none;\" (loaded)=\"initFilterBoxFocus(filterBox)\">\r\n </after-view-checked>\r\n </div>\r\n</ng-template>\r\n<ng-template #filterDate let-col=\"col\">\r\n <div #filterBox class=\"date-picker-range filter-box\" tabindex=\"-1\" (mousedown)=\"initFilterBoxFocus(filterBox)\">\r\n <div tabindex=\"-1\">\r\n <tn-datetime-picker-range #dateRange [control]=\"filterSchema.dateRange\"\r\n (onChanged)=\"onChangeDateTime($event, col.field)\">\r\n </tn-datetime-picker-range>\r\n </div>\r\n <span\r\n [ngClass]=\"{'action-clear': true, 'dirty': filterData[col.field] && ((filterData[col.field][0] != null && filterData[col.field][0] !== '') || (filterData[col.field][1] != null && filterData[col.field][1] !== ''))}\"\r\n [pTooltip]=\"'B\u1ECF filter'\" tooltipPosition=\"top\"\r\n (mousedown)=\"onClearDateSearch(filterBox, dateRange, col.field)\" tabindex=\"-1\"><i\r\n class=\"pi pi-filter-slash\"></i></span>\r\n <after-view-checked style=\"display: none;\" (loaded)=\"initFilterBoxFocus(filterBox)\">\r\n </after-view-checked>\r\n </div>\r\n</ng-template>\r\n<ng-template #filterBoolean let-col=\"col\">\r\n <div class=\"filter-boolean-box\">\r\n <p-selectButton *ngIf=\"!col.minimizeFilter\"\r\n [options]=\"[{value: true, label: 'C\u00F3', icon: 'pi pi-check'}, {value: false, label: 'Kh\u00F4ng', icon: 'pi pi-times'}]\"\r\n [multiple]=\"true\" [(ngModel)]=\"filterData[col.field]\" (onChange)=\"onChangeBoolean($event, col.field)\">\r\n <ng-template let-item>\r\n <i style=\"padding: 3px 0;\" [class]=\"item.icon\"></i>\r\n </ng-template>\r\n </p-selectButton>\r\n <ng-container *ngIf=\"col.minimizeFilter\">\r\n <button *ngIf=\"!filterData[col.field]\" type=\"button\" pButton icon=\"pi pi-filter-slash\"\r\n class=\"btn-filter-boolean\" (click)=\"showCheckBoxFilterMenu($event, col.field)\"></button>\r\n <button *ngIf=\"filterData[col.field]\" type=\"button\" pButton icon=\"pi pi-filter\"\r\n class=\"btn-filter-boolean p-button-primary\"\r\n (click)=\"showCheckBoxFilterMenu($event, col.field)\"></button>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n<ng-template #fileUploadColumn let-field=\"field\" let-rowData let-fileSetting=\"fileSetting\">\r\n <file-upload *ngIf=\"fileSetting.mode == FileUploadMode.usingFileInstanceId\"\r\n [sharedFolderType]=\"fileSetting.control.sharedFolderType\" [readonly]=\"fileSetting.control.readonly\"\r\n [accept]=\"fileSetting.control.accept\" [(ngModel)]=\"rowData[field]\">\r\n </file-upload>\r\n <service-file-upload *ngIf=\"fileSetting.control.mode == FileUploadMode.usingServiceFile\"\r\n [serviceCode]=\"fileSetting.control.serviceCode\" [parentContext]=\"context\" [entity]=\"fileSetting.control.entity\"\r\n [entityKey]=\"rowData[fileSetting.control.entityKeyField]\" [control]=\"fileSetting.control\"\r\n [fileDataService]=\"fileSetting.control.fileDataService\" [(ngModel)]=\"rowData.field\">\r\n </service-file-upload>\r\n</ng-template>\r\n<ng-template #fileManagerColumn let-rowData let-fileSetting=\"fileSetting\" let-field=\"field\">\r\n <file-manager [control]=\"fileSetting.control\" [serviceCode]=\"fileSetting.control.serviceCode\"\r\n [entity]=\"fileSetting.control.entity\" [entityKey]=\"rowData[fileSetting.control.entityKeyField]\"\r\n [readonly]=\"fileSetting.control.readonly\" [layout]=\"fileSetting.control.layout\"\r\n [maxFileSize]=\"fileSetting.control.maxFileSize\" [inTaiLieu]=\"fileSetting.control.inTaiLieu\"\r\n [(value)]=\"rowData[field]\">\r\n </file-manager>\r\n</ng-template>",
22870
22871
  providers: [i3.DecimalPipe, i3.DatePipe],
22871
22872
  styles: [".container-table{display:flex;flex-direction:column;overflow:hidden}.container-table .container-table-inner{display:flex;height:auto;max-height:100%;min-height:60px;position:relative}.container-table-inner>tn-custom-scrollbar{width:100%}.cell-checkbox{text-align:center}.pick-color-row{border:1px solid #d1d1d1;border-radius:2px;bottom:0;cursor:pointer;display:flex;flex-wrap:wrap;height:1.4em;left:0;margin:auto;position:absolute;right:0;top:0;width:1.4em}.pick-color-row>div{background:#84d140;border:1px solid #fff;flex:0 0 50%}.pick-color-row>div:nth-child(2){background:#fc6868}.pick-color-row>div:nth-child(3){background:#fbc02d}.pick-color-row>div:nth-child(4){background:#7dc5ff}.cell-header-function{align-items:center;display:flex}.cell-header-function>span{flex:1 1;text-align:center}.cell-header-function button{height:24px;margin:0;padding:0;width:24px}.group-icon{color:#256aa2;font-weight:400}.group-icon i{font-size:.8em;margin-right:5px}.center{text-align:center!important}.row-card{height:100%;left:0;position:absolute;top:0;width:5px}.column-function{min-width:100px;padding:0}.custom-search-area{background-color:#f2f2f2;margin:-.5em -1em .5em;padding-left:.5em;padding-right:.5em}.main-container-search-inner{margin-bottom:-.5em}.main-title>h1{font-size:1.2em}.filter-row>th:not(.sticky):not(.chkbox){padding:3px!important}.container-text-workflow{align-items:center;display:flex;justify-content:center}.container-text-workflow .link-or-action{color:#2196f3;cursor:pointer}.container-text-workflow .content{flex:1 1}.btnReload{height:2rem;left:50%;position:absolute;top:50%;transform:translate(-50%,calc(-50% - 1px));width:2rem}.toggle-showfull{color:#00f;cursor:pointer;font-size:.8rem;font-weight:700;white-space:nowrap}.col-share-permission>div:not(:last-child){margin-bottom:5px}.advance-search-container{display:flex;justify-content:flex-end}.btn-filter-boolean{height:26px;width:26px}.btn-filter-boolean:not(.p-button-primary),.btn-filter-boolean:not(.p-button-primary):hover{background:#f5f6f8;border-color:#ced4da;color:#6c757d}::ng-deep crud-list advance-search{display:block;flex:1;max-width:400px}::ng-deep crud-list .ps__rail-x,::ng-deep crud-list .ps__rail-y{z-index:5}::ng-deep crud-list .main-title>*>h1{font-size:1.2em}::ng-deep crud-list .p-datatable .p-datatable-thead>tr>th.cell-fixed-filter{z-index:999}::ng-deep crud-list .p-datatable .p-datatable-thead>tr>th.cell-fixed-filter .fixed-filter{min-width:200px;position:fixed;z-index:10}::ng-deep crud-list .p-datatable .p-datatable-thead>tr>th .container-icon-loading{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}::ng-deep crud-list .check-all-custom{height:0;position:absolute;width:0}::ng-deep crud-list .cell-header-filter{position:relative}::ng-deep crud-list .cell-header-filter .tn-dropdown{height:32px}::ng-deep crud-list .cell-header-filter tn-mask .p-inputtext{width:100%}::ng-deep crud-list .cell-header-filter .filter-box{background-color:#fff;border-radius:3px;display:flex;min-width:0}::ng-deep crud-list .cell-header-filter .filter-box>div{border:1px solid #ced4da;border-radius:3px 0 0 3px;border-right:none;flex:1;outline:none;overflow:hidden}::ng-deep crud-list .cell-header-filter .filter-box>span{align-items:center;background:#f5f6f8;border:1px solid #ced4da;color:#6c757d;cursor:pointer;display:inline-flex;flex-basis:32px;height:32px;justify-content:center;min-width:unset;outline:none}::ng-deep crud-list .cell-header-filter .filter-box>span.action-clear{border-radius:0 3px 3px 0}::ng-deep crud-list .cell-header-filter .filter-box>span.action-clear.dirty{color:#008eff}::ng-deep crud-list .cell-header-filter .filter-box input{border:none;box-shadow:none!important;padding-left:5px;padding-right:5px}::ng-deep crud-list .cell-header-filter .filter-box:not(.no-transition){transition:min-width .1s}::ng-deep crud-list .cell-header-filter .filter-box.boolean-filter>div{flex:0 0 109px;width:109px}::ng-deep crud-list .cell-header-filter .p-multiselect-label.p-placeholder{padding-left:.5rem;padding-right:.5rem}::ng-deep crud-list .cell-header-filter.focus-within,::ng-deep crud-list .cell-header-filter:focus-within{z-index:10!important}::ng-deep crud-list .cell-header-filter.focus-within .filter-boolean-box .p-button,::ng-deep crud-list .cell-header-filter:focus-within .filter-boolean-box .p-button{z-index:10}::ng-deep crud-list .cell-header-filter.focus-within .filter-box>div,::ng-deep crud-list .cell-header-filter:focus-within .filter-box>div{border-color:#2196f3;box-shadow:0 0 0 .2rem #a6d5fa;z-index:0}::ng-deep crud-list .cell-header-filter.focus-within .short-filter-box,::ng-deep crud-list .cell-header-filter:focus-within .short-filter-box{box-shadow:5px 0 15px 1px rgba(0,0,0,.27058823529411763);min-width:250px;position:absolute;top:calc(50% - 16px);z-index:2}::ng-deep crud-list .cell-header-filter.focus-within .short-filter-box>div,::ng-deep crud-list .cell-header-filter:focus-within .short-filter-box>div{border-color:#2196f3;box-shadow:0 0 0 .2rem #a6d5fa;flex:1;z-index:0}::ng-deep crud-list .cell-header-filter.focus-within .short-filter-box>span.action-clear,::ng-deep crud-list .cell-header-filter:focus-within .short-filter-box>span.action-clear{display:flex}::ng-deep crud-list .cell-header-filter.focus-within .short-filter-box.boolean-filter,::ng-deep crud-list .cell-header-filter:focus-within .short-filter-box.boolean-filter{min-width:140px}::ng-deep crud-list .cell-header-filter.focus-within .short-filter-box.boolean-filter>div,::ng-deep crud-list .cell-header-filter:focus-within .short-filter-box.boolean-filter>div{flex:0 0 109px;width:109px}::ng-deep crud-list .cell-header-filter.focus-within:nth-last-child(2) .short-filter-box,::ng-deep crud-list .cell-header-filter:focus-within:nth-last-child(2) .short-filter-box{left:50%;transform:translateX(-50%)}::ng-deep crud-list .cell-header-filter:last-child .filter-box{right:3px}::ng-deep crud-list .table-border-line{background-color:#eee;position:absolute;z-index:5}::ng-deep crud-list .table-border-line.--left,::ng-deep crud-list .table-border-line.--right{bottom:0;top:0;width:1px}::ng-deep crud-list .table-border-line.--bottom,::ng-deep crud-list .table-border-line.--top{height:1px;left:0;right:0}::ng-deep crud-list .table-border-line.--left{left:0}::ng-deep crud-list .table-border-line.--right{right:0}::ng-deep crud-list .table-border-line.--top{top:0}::ng-deep crud-list .table-border-line.--bottom{bottom:0}::ng-deep crud-list .filter-boolean-box{text-align:center}::ng-deep crud-list .filter-boolean-box .p-selectbutton{white-space:nowrap}::ng-deep crud-list .custom-search-area crud-form{width:100%}::ng-deep crud-list .custom-search-area .main-container-search-inner .container-control{overflow:hidden}::ng-deep crud-list>p-contextmenu{display:none}@media (max-width:640px){::ng-deep crud-list .--table-responsive .p-datatable-wrapper{padding:1px}}"]
22872
22873
  },] }
@@ -31279,7 +31280,6 @@
31279
31280
  menus.forEach(function (item) {
31280
31281
  if (item.activated) {
31281
31282
  result.push(item);
31282
- return;
31283
31283
  }
31284
31284
  });
31285
31285
  if (result.length > lastLength && result[result.length - 1].items && result[result.length - 1].items.length > 0) {
@@ -31353,28 +31353,28 @@
31353
31353
  });
31354
31354
  });
31355
31355
  };
31356
- MenuService.prototype.setVisibleMenu = function (element) {
31356
+ MenuService.prototype.setVisibleMenu = function (menuElem) {
31357
31357
  return __awaiter(this, void 0, void 0, function () {
31358
31358
  var root, service, permission, isAuthorized;
31359
31359
  var _this = this;
31360
31360
  return __generator(this, function (_a) {
31361
31361
  switch (_a.label) {
31362
31362
  case 0:
31363
- if (element.isRootMenu) {
31363
+ if (menuElem.isRootMenu) {
31364
31364
  return [2 /*return*/];
31365
31365
  }
31366
- if (!element.isCustomAuthen) return [3 /*break*/, 1];
31366
+ if (!menuElem.isCustomAuthen) return [3 /*break*/, 1];
31367
31367
  return [3 /*break*/, 7];
31368
31368
  case 1:
31369
- if (!element.allowAnonymous) return [3 /*break*/, 2];
31370
- element.visible = true;
31369
+ if (!menuElem.allowAnonymous) return [3 /*break*/, 2];
31370
+ menuElem.visible = true;
31371
31371
  return [3 /*break*/, 7];
31372
31372
  case 2:
31373
- if (!(element.items && element.items.length > 0)) return [3 /*break*/, 4];
31374
- return [4 /*yield*/, this._commonService.asyncForEach(element.items, function (element) { return __awaiter(_this, void 0, void 0, function () {
31373
+ if (!(menuElem.items && menuElem.items.length > 0)) return [3 /*break*/, 4];
31374
+ return [4 /*yield*/, this._commonService.asyncForEach(menuElem.items, function (item) { return __awaiter(_this, void 0, void 0, function () {
31375
31375
  return __generator(this, function (_a) {
31376
31376
  switch (_a.label) {
31377
- case 0: return [4 /*yield*/, this.setVisibleMenu(element)];
31377
+ case 0: return [4 /*yield*/, this.setVisibleMenu(item)];
31378
31378
  case 1:
31379
31379
  _a.sent();
31380
31380
  return [2 /*return*/];
@@ -31383,20 +31383,20 @@
31383
31383
  }); })];
31384
31384
  case 3:
31385
31385
  _a.sent();
31386
- element.visible = element.items.some(function (x) { return x.visible; });
31386
+ menuElem.visible = menuElem.items.some(function (x) { return x.visible; });
31387
31387
  return [3 /*break*/, 7];
31388
31388
  case 4:
31389
31389
  root = this._applicationContext.getRootContext();
31390
31390
  if (!(root.data.currentUser && root.data.currentUser.userId)) return [3 /*break*/, 6];
31391
31391
  service = root.data.currentAppMetadata.code;
31392
- permission = ("" + root.data.currentAppMetadata.code + element.routerLink).toUpperCase();
31392
+ permission = ("" + root.data.currentAppMetadata.code + (menuElem.routerLink || menuElem.permission)).toUpperCase();
31393
31393
  return [4 /*yield*/, this._permissionService.isAuthorized(service, permission, true)];
31394
31394
  case 5:
31395
31395
  isAuthorized = _a.sent();
31396
- element.visible = isAuthorized;
31396
+ menuElem.visible = isAuthorized;
31397
31397
  return [3 /*break*/, 7];
31398
31398
  case 6:
31399
- element.visible = false;
31399
+ menuElem.visible = false;
31400
31400
  _a.label = 7;
31401
31401
  case 7: return [2 /*return*/];
31402
31402
  }
@@ -31577,6 +31577,7 @@
31577
31577
  this._commonService = _commonService;
31578
31578
  this._moduleConfigService = _moduleConfigService;
31579
31579
  this._title = _title;
31580
+ this.autoRenderMenu = true;
31580
31581
  this.model = [];
31581
31582
  this.theme = 'blue';
31582
31583
  this.layout = 'blue';
@@ -31589,17 +31590,9 @@
31589
31590
  // Nếu là môi trường triển khai thì cộng thêm tiền tố phân hệ vào router link để có thể chuột phải mở tab mới
31590
31591
  funcSetNewTabLink = function (link) { return "/" + appCodeLowerCase + link; };
31591
31592
  }
31592
- this._menuService.renderMenuByAppCode(appCode);
31593
- this.model = this._menuService.getMenuItems();
31594
- this._router.events.pipe(operators.filter(function (event) { return event instanceof i3$1.NavigationEnd; }))
31595
- .subscribe(function (event) {
31596
- for (var i in _this.model) {
31597
- var item = _this.model[i];
31598
- _this.activeItem(item);
31599
- }
31600
- });
31601
31593
  this._menuService.menuChanged.subscribe(function (rawMenus) {
31602
31594
  // reformat lại toàn bộ menu
31595
+ _this.model = rawMenus;
31603
31596
  _this.deQuySetNewTabLink(_this.model, funcSetNewTabLink, 1);
31604
31597
  _this._applicationContext.getRootContext().fireEvent(ComCtxConstants.ROOT.MENU_RELOAD);
31605
31598
  });
@@ -31624,6 +31617,20 @@
31624
31617
  });
31625
31618
  };
31626
31619
  AppMenuComponent.prototype.ngOnInit = function () {
31620
+ var _this = this;
31621
+ if (this.autoRenderMenu === true) {
31622
+ this.environment = this._moduleConfigService.getConfig().environment;
31623
+ var appCode = this._moduleConfigService.getConfig().appCode;
31624
+ this._menuService.renderMenuByAppCode(appCode);
31625
+ this.model = this._menuService.getMenuItems();
31626
+ this._router.events.pipe(operators.filter(function (event) { return event instanceof i3$1.NavigationEnd; }))
31627
+ .subscribe(function (event) {
31628
+ for (var i in _this.model) {
31629
+ var item = _this.model[i];
31630
+ _this.activeItem(item);
31631
+ }
31632
+ });
31633
+ }
31627
31634
  };
31628
31635
  AppMenuComponent.prototype.activeItem = function (item) {
31629
31636
  if (item.url) {
@@ -31721,6 +31728,7 @@
31721
31728
  { type: platformBrowser.Title }
31722
31729
  ]; };
31723
31730
  AppMenuComponent.propDecorators = {
31731
+ autoRenderMenu: [{ type: i0.Input }],
31724
31732
  reset: [{ type: i0.Input }]
31725
31733
  };
31726
31734
 
@@ -33417,6 +33425,7 @@
33417
33425
  this._customizeUiService = _customizeUiService;
33418
33426
  this.showQuickNote = true;
33419
33427
  this.allowAnonymous = false;
33428
+ this.autoRenderMenu = true;
33420
33429
  this._unsubscribeAll = new rxjs.Subject();
33421
33430
  // rootVersionDeploy = '1.3';
33422
33431
  this.currentRoute = '';
@@ -33439,7 +33448,6 @@
33439
33448
  this.currentKeyPressIndex = 0;
33440
33449
  this.EnumTypeSplash = exports.EnumTypeSplash;
33441
33450
  this.layoutLoadingPage = exports.EnumTypeSplash.NEW_V1;
33442
- console.log('test 1');
33443
33451
  this.environment = this._moduleConfigService.getConfig().environment;
33444
33452
  this.appCode = this._moduleConfigService.getConfig().appCode;
33445
33453
  if (this.environment.keyPressPermissionUtils) {
@@ -34154,7 +34162,7 @@
34154
34162
  CommonAppComponentComponent.decorators = [
34155
34163
  { type: i0.Component, args: [{
34156
34164
  selector: 'common-app-component',
34157
- template: "<ng-container *ngIf=\"!pageLoaded\">\r\n <ng-container [ngSwitch]=\"layoutLoadingPage\">\r\n <ng-container *ngSwitchDefault>\r\n <loading-page-v1></loading-page-v1>\r\n </ng-container>\r\n\r\n <!-- <ng-container *ngSwitchCase=\"EnumTypeSplash.NEW_V2\">\r\n <loading-page-v2></loading-page-v2>\r\n </ng-container> -->\r\n </ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"pageLoaded\" [style.display]=\"pageLoaded ? '' : 'none'\" class=\"layout-wrapper\"\r\n (click)=\"_commonService.onLayoutClick()\" [ngClass]=\"{'menu-layout-static': !_commonService.isOverlay(),\r\n 'menu-layout-overlay': _commonService.isOverlay(),\r\n 'layout-menu-overlay-active': _commonService.overlayMenuActive,\r\n 'menu-layout-horizontal': _commonService.isHorizontal(),\r\n 'menu-layout-slim': _commonService.isSlim(),\r\n 'layout-menu-static-desktop-inactive': _commonService.staticMenuDesktopInactive,\r\n 'layout-menu-static-desktop-active': !_commonService.staticMenuDesktopInactive,\r\n 'layout-menu-static-mobile-inactive': !_commonService.staticMenuMobileActive,\r\n 'layout-menu-static-mobile-active': _commonService.staticMenuMobileActive,\r\n 'layout-menu-static-inactive': _commonService.staticMenuDesktopInactive,\r\n 'layout-menu-static-active': _commonService.staticMenuMobileActive}\">\r\n\r\n <app-topbar *ngIf=\"_globalService.getHeaderState()\"></app-topbar>\r\n\r\n <div *ngIf=\"_globalService.getMenuState()\" class=\"layout-menu-container\"\r\n [ngClass]=\"{'layout-menu-dark':_commonService.darkMenu}\" (click)=\"_commonService.onMenuClick($event)\">\r\n <app-root-menu></app-root-menu>\r\n <div class=\"layout-menu-block\">\r\n <tn-custom-scrollbar #scrollbar [style]=\"{'padding-top': '16px'}\">\r\n <app-inline-profile *ngIf=\"_commonService.profileMode == 'inline' &&!_commonService.isHorizontal()\">\r\n </app-inline-profile>\r\n <app-menu [reset]=\"_commonService.resetMenu\" (onMenuActive)=\"handleMenuActive($event)\"></app-menu>\r\n </tn-custom-scrollbar>\r\n </div>\r\n <div class=\"search-area layout-menu-search-area\">\r\n <p-autoComplete [(ngModel)]=\"searchMenuInput\" [style]=\"{'width':'100%'}\" [suggestions]=\"searchMenuResult\"\r\n (completeMethod)=\"onSearchMenu($event)\" [autoHighlight]=\"true\"\r\n [placeholder]=\"'T\u00ECm ki\u1EBFm ch\u1EE9c n\u0103ng' | translate\" [delay]=\"200\" [scrollHeight]=\"'400px'\"\r\n class=\"search-input\" [readonly]=\"!(menuModel && menuModel.length)\"\r\n (onSelect)=\"onSelectMenuSuggestion($event)\" field=\"label\">\r\n <ng-template let-item pTemplate=\"item\">\r\n <div innerHTML=\"{{ item.label | highlight : searchMenuInput}}\"></div>\r\n </ng-template>\r\n </p-autoComplete>\r\n <span class=\"icon-search\"><i class=\"pi pi-search\"></i></span>\r\n </div>\r\n </div>\r\n\r\n <div [class]=\"'layout-main'\" [ngClass]=\"{'no-header': _globalService.getHeaderState() ? false : true}\">\r\n <router-outlet></router-outlet>\r\n </div>\r\n\r\n <div class=\"layout-mask\"></div>\r\n <div #quickNoteBt *ngIf=\"!onlyShowMainContent && showQuickNote\" class=\"quick-note-button-holder\" cdkDrag\r\n cdkDragBoundary=\".layout-wrapper\" oncontextmenu=\"return false\" (cdkDragEnded)=\"quickNoteDropped($event)\"\r\n (cdkDragStarted)=\"quickNoteStarted($event)\">\r\n <a #quickNoteBt1 href=\"javascript:;\" class=\"all-note-button\" tabindex=\"0\" (click)=\"quickNoteShowAllNotes()\">\r\n <i class=\"fas fa-sticky-note\"></i></a>\r\n <a #quickNoteBt2 href=\"javascript:;\" class=\"setting-note-button\" tabindex=\"0\" (click)=\"quickNoteShowSettings()\">\r\n <i class=\"fas fa-cog\"></i></a>\r\n <a href=\"javascript:;\" (press)=\"quickNotePress($event)\" (pressup)=\"quickNotePressUp($event)\"\r\n class=\"quick-note-button\" tabindex=\"0\" (click)=\"quickNoteAddNote()\">\r\n <i class=\"fas fa-plus\"></i></a>\r\n </div>\r\n <div #pinnedNotes *ngIf=\"!onlyShowMainContent\" class=\"pinned-notes-holder\" cdkDrag cdkDragBoundary=\".layout-wrapper\"\r\n oncontextmenu=\"return false\" (cdkDragEnded)=\"pinnedNotesDropped($event)\"\r\n (cdkDragStarted)=\"pinnedNotesStarted($event)\">\r\n <div class=\"pinned-notes ui-g\" tabindex=\"0\">\r\n <div *ngIf=\"pinnedNotesMinimizeStatus\" class=\"pinned-notes-minimize-button\"\r\n (click)=\"pinnedNotesMinimize(pinnedNotesMinimizeStatus)\">\r\n <i class=\"pi pi-window-maximize\"></i>\r\n </div>\r\n <div *ngIf=\"pinnedNotesMaximizeStatus\" class=\" pinned-notes-minimize-button\"\r\n (click)=\"pinnedNotesMinimize(pinnedNotesMinimizeStatus)\">\r\n <i class=\"pi pi-window-minimize\"></i>\r\n </div>\r\n <div *ngFor=\"let note of pinnedNoteData\" class=\"pinned-note ui-g-12\">\r\n <div class=\"pinned-note-header-line\" [style.background-color]=\"note.colorCode\">\r\n </div>\r\n <div class=\"pinned-note-body\">\r\n <span class=\"pinned-note-line-title\" [style.paddingBottom]=\"note.titlePaddingBottom\">\r\n <div class=\"pinned-note-header-right\">\r\n <span class=\"pinned-note-header-time\">{{note.created | date: 'dd/MM'}}</span>\r\n <img src=\"../assets/layout/images/ico/unpin-1.ico\" class=\"pinned-note-header-button-unpin\"\r\n (click)=\"unPinNote(note)\">\r\n <i *ngIf=\"!note.isCompleted\" class=\"far fa-flag pinned-note-header-button-complete\"\r\n (click)=\"completeNote(note)\"></i>\r\n <i *ngIf=\"note.isCompleted\" class=\"fas fa-flag-checkered pinned-note-header-button-complete\"\r\n (click)=\"inCompleteNote(note)\"></i>\r\n </div>\r\n <div>{{note.name}}</div>\r\n </span>\r\n <div class=\"pinned-note-contents\" [style.display]=\"note.contentDisplay\">\r\n <span *ngFor=\"let content of note.contents\" class=\"pinned-note-line\">\r\n {{content}}\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <report-queue [header]=\"'Xu\u1EA5t d\u1EEF li\u1EC7u'\">\r\n </report-queue>\r\n</div>\r\n<div class=\"waiting-box\" [class.show]=\"waiting\">\r\n <div class=\"overlay\"></div>\r\n <div class=\"content-loading\">\r\n <div class=\"lds-ellipsis\">\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n </div>\r\n <div class=\"message-loading\">\r\n <span *ngFor=\"let x of messageWaiting\">{{x}}</span>\r\n </div>\r\n </div>\r\n</div>\r\n<p-toast [position]=\"'top-right'\" [autoZIndex]=\"true\"></p-toast>\r\n<p-confirmDialog #cd [closable]=\"false\">\r\n <p-footer>\r\n <button #okButton type=\"button\" pButton icon=\"pi pi-check\" class=\"p-button-rounded p-button-text\" label=\"\u0110\u1ED3ng \u00FD\"\r\n (keydown.shift.tab)=\"focusTrap($event, false)\" (click)=\"cd.accept()\"></button>\r\n <button *ngIf=\"showRejectConfirm\" #cancelButton type=\"button\" pButton\r\n class=\"p-button-rounded p-button-text p-button-secondary\" icon=\"pi pi-times\" label=\"B\u1ECF qua\"\r\n (keydown.tab)=\"focusTrap($event, true)\" (click)=\"cd.reject()\"></button>\r\n </p-footer>\r\n</p-confirmDialog>\r\n<!-- <user-action-manager></user-action-manager> -->\r\n<permission-utils *ngIf=\"rootData.showPermissionUtils\"></permission-utils>\r\n",
34165
+ template: "<ng-container *ngIf=\"!pageLoaded\">\r\n <ng-container [ngSwitch]=\"layoutLoadingPage\">\r\n <ng-container *ngSwitchDefault>\r\n <loading-page-v1></loading-page-v1>\r\n </ng-container>\r\n\r\n <!-- <ng-container *ngSwitchCase=\"EnumTypeSplash.NEW_V2\">\r\n <loading-page-v2></loading-page-v2>\r\n </ng-container> -->\r\n </ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"pageLoaded\" [style.display]=\"pageLoaded ? '' : 'none'\" class=\"layout-wrapper\"\r\n (click)=\"_commonService.onLayoutClick()\" [ngClass]=\"{'menu-layout-static': !_commonService.isOverlay(),\r\n 'menu-layout-overlay': _commonService.isOverlay(),\r\n 'layout-menu-overlay-active': _commonService.overlayMenuActive,\r\n 'menu-layout-horizontal': _commonService.isHorizontal(),\r\n 'menu-layout-slim': _commonService.isSlim(),\r\n 'layout-menu-static-desktop-inactive': _commonService.staticMenuDesktopInactive,\r\n 'layout-menu-static-desktop-active': !_commonService.staticMenuDesktopInactive,\r\n 'layout-menu-static-mobile-inactive': !_commonService.staticMenuMobileActive,\r\n 'layout-menu-static-mobile-active': _commonService.staticMenuMobileActive,\r\n 'layout-menu-static-inactive': _commonService.staticMenuDesktopInactive,\r\n 'layout-menu-static-active': _commonService.staticMenuMobileActive}\">\r\n\r\n <app-topbar *ngIf=\"_globalService.getHeaderState()\"></app-topbar>\r\n\r\n <div *ngIf=\"_globalService.getMenuState()\" class=\"layout-menu-container\"\r\n [ngClass]=\"{'layout-menu-dark':_commonService.darkMenu}\" (click)=\"_commonService.onMenuClick($event)\">\r\n <app-root-menu></app-root-menu>\r\n <div class=\"layout-menu-block\">\r\n <tn-custom-scrollbar #scrollbar [style]=\"{'padding-top': '16px'}\">\r\n <app-inline-profile *ngIf=\"_commonService.profileMode == 'inline' &&!_commonService.isHorizontal()\">\r\n </app-inline-profile>\r\n <app-menu [autoRenderMenu]=\"autoRenderMenu\" [reset]=\"_commonService.resetMenu\"\r\n (onMenuActive)=\"handleMenuActive($event)\"></app-menu>\r\n </tn-custom-scrollbar>\r\n </div>\r\n <div class=\"search-area layout-menu-search-area\">\r\n <p-autoComplete [(ngModel)]=\"searchMenuInput\" [style]=\"{'width':'100%'}\" [suggestions]=\"searchMenuResult\"\r\n (completeMethod)=\"onSearchMenu($event)\" [autoHighlight]=\"true\"\r\n [placeholder]=\"'T\u00ECm ki\u1EBFm ch\u1EE9c n\u0103ng' | translate\" [delay]=\"200\" [scrollHeight]=\"'400px'\"\r\n class=\"search-input\" [readonly]=\"!(menuModel && menuModel.length)\"\r\n (onSelect)=\"onSelectMenuSuggestion($event)\" field=\"label\">\r\n <ng-template let-item pTemplate=\"item\">\r\n <div innerHTML=\"{{ item.label | highlight : searchMenuInput}}\"></div>\r\n </ng-template>\r\n </p-autoComplete>\r\n <span class=\"icon-search\"><i class=\"pi pi-search\"></i></span>\r\n </div>\r\n </div>\r\n\r\n <div [class]=\"'layout-main'\" [ngClass]=\"{'no-header': _globalService.getHeaderState() ? false : true}\">\r\n <router-outlet></router-outlet>\r\n </div>\r\n\r\n <div class=\"layout-mask\"></div>\r\n <div #quickNoteBt *ngIf=\"!onlyShowMainContent && showQuickNote\" class=\"quick-note-button-holder\" cdkDrag\r\n cdkDragBoundary=\".layout-wrapper\" oncontextmenu=\"return false\" (cdkDragEnded)=\"quickNoteDropped($event)\"\r\n (cdkDragStarted)=\"quickNoteStarted($event)\">\r\n <a #quickNoteBt1 href=\"javascript:;\" class=\"all-note-button\" tabindex=\"0\" (click)=\"quickNoteShowAllNotes()\">\r\n <i class=\"fas fa-sticky-note\"></i></a>\r\n <a #quickNoteBt2 href=\"javascript:;\" class=\"setting-note-button\" tabindex=\"0\" (click)=\"quickNoteShowSettings()\">\r\n <i class=\"fas fa-cog\"></i></a>\r\n <a href=\"javascript:;\" (press)=\"quickNotePress($event)\" (pressup)=\"quickNotePressUp($event)\"\r\n class=\"quick-note-button\" tabindex=\"0\" (click)=\"quickNoteAddNote()\">\r\n <i class=\"fas fa-plus\"></i></a>\r\n </div>\r\n <div #pinnedNotes *ngIf=\"!onlyShowMainContent\" class=\"pinned-notes-holder\" cdkDrag cdkDragBoundary=\".layout-wrapper\"\r\n oncontextmenu=\"return false\" (cdkDragEnded)=\"pinnedNotesDropped($event)\"\r\n (cdkDragStarted)=\"pinnedNotesStarted($event)\">\r\n <div class=\"pinned-notes ui-g\" tabindex=\"0\">\r\n <div *ngIf=\"pinnedNotesMinimizeStatus\" class=\"pinned-notes-minimize-button\"\r\n (click)=\"pinnedNotesMinimize(pinnedNotesMinimizeStatus)\">\r\n <i class=\"pi pi-window-maximize\"></i>\r\n </div>\r\n <div *ngIf=\"pinnedNotesMaximizeStatus\" class=\" pinned-notes-minimize-button\"\r\n (click)=\"pinnedNotesMinimize(pinnedNotesMinimizeStatus)\">\r\n <i class=\"pi pi-window-minimize\"></i>\r\n </div>\r\n <div *ngFor=\"let note of pinnedNoteData\" class=\"pinned-note ui-g-12\">\r\n <div class=\"pinned-note-header-line\" [style.background-color]=\"note.colorCode\">\r\n </div>\r\n <div class=\"pinned-note-body\">\r\n <span class=\"pinned-note-line-title\" [style.paddingBottom]=\"note.titlePaddingBottom\">\r\n <div class=\"pinned-note-header-right\">\r\n <span class=\"pinned-note-header-time\">{{note.created | date: 'dd/MM'}}</span>\r\n <img src=\"../assets/layout/images/ico/unpin-1.ico\" class=\"pinned-note-header-button-unpin\"\r\n (click)=\"unPinNote(note)\">\r\n <i *ngIf=\"!note.isCompleted\" class=\"far fa-flag pinned-note-header-button-complete\"\r\n (click)=\"completeNote(note)\"></i>\r\n <i *ngIf=\"note.isCompleted\" class=\"fas fa-flag-checkered pinned-note-header-button-complete\"\r\n (click)=\"inCompleteNote(note)\"></i>\r\n </div>\r\n <div>{{note.name}}</div>\r\n </span>\r\n <div class=\"pinned-note-contents\" [style.display]=\"note.contentDisplay\">\r\n <span *ngFor=\"let content of note.contents\" class=\"pinned-note-line\">\r\n {{content}}\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <report-queue [header]=\"'Xu\u1EA5t d\u1EEF li\u1EC7u'\">\r\n </report-queue>\r\n</div>\r\n<div class=\"waiting-box\" [class.show]=\"waiting\">\r\n <div class=\"overlay\"></div>\r\n <div class=\"content-loading\">\r\n <div class=\"lds-ellipsis\">\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n </div>\r\n <div class=\"message-loading\">\r\n <span *ngFor=\"let x of messageWaiting\">{{x}}</span>\r\n </div>\r\n </div>\r\n</div>\r\n<p-toast [position]=\"'top-right'\" [autoZIndex]=\"true\"></p-toast>\r\n<p-confirmDialog #cd [closable]=\"false\">\r\n <p-footer>\r\n <button #okButton type=\"button\" pButton icon=\"pi pi-check\" class=\"p-button-rounded p-button-text\" label=\"\u0110\u1ED3ng \u00FD\"\r\n (keydown.shift.tab)=\"focusTrap($event, false)\" (click)=\"cd.accept()\"></button>\r\n <button *ngIf=\"showRejectConfirm\" #cancelButton type=\"button\" pButton\r\n class=\"p-button-rounded p-button-text p-button-secondary\" icon=\"pi pi-times\" label=\"B\u1ECF qua\"\r\n (keydown.tab)=\"focusTrap($event, true)\" (click)=\"cd.reject()\"></button>\r\n </p-footer>\r\n</p-confirmDialog>\r\n<!-- <user-action-manager></user-action-manager> -->\r\n<permission-utils *ngIf=\"rootData.showPermissionUtils\"></permission-utils>",
34158
34166
  providers: [ComponentContextService, EntityMetadataService],
34159
34167
  styles: [".layout-menu-search-area{position:relative}.icon-search{align-items:center;background-color:transparent;box-shadow:none;color:#888;display:flex;font-size:14px;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.layout-menu-static-inactive .search-area{margin-left:-303px}.layout-menu-container{bottom:0;display:flex;flex-direction:column;height:auto;overflow:hidden;top:60px}.layout-menu-block{display:flex;flex:1;overflow:hidden}.layout-menu-block>tn-custom-scrollbar{width:100%}::ng-deep .layout-menu-search-area .ui-inputtext{border-color:#dadada;border-radius:0;padding-right:40px;width:calc(100% + 1px)}::ng-deep .layout-menu-search-area .ui-inputtext:not(:focus){box-shadow:none}::ng-deep .layout-menu-search-area input{border-left:0;border-radius:0;border-right:0;width:100%}::ng-deep .layout-menu-search-area .p-autocomplete-panel{max-width:100%}::ng-deep .layout-menu-search-area .p-autocomplete-item{white-space:normal}::ng-deep .layout-menu-search-area .p-autocomplete-item mark{background-color:var(--tn-primary-color);border-radius:0;color:#fff;padding:0}.waiting-box{display:none;height:100%;left:0;position:fixed;top:0;width:100%;z-index:9999}.waiting-box .overlay{background-color:red;background-color:hsla(0,0%,42.7%,.5019607843137255);height:100%;width:100%}.waiting-box .content-loading{left:50%;position:absolute;text-align:center;top:50%;transform:translate(-50%,-50%)}.waiting-box .content-loading .lds-ellipsis{display:inline-block;height:60px;position:relative;width:80px}.waiting-box .content-loading .lds-ellipsis div{-webkit-animation-timing-function:cubic-bezier(0,1,1,0);animation-timing-function:cubic-bezier(0,1,1,0);background:#fff;border-radius:50%;height:13px;position:absolute;top:33px;width:13px}.waiting-box .content-loading .lds-ellipsis div:first-child{-webkit-animation:lds-ellipsis1 .6s infinite;animation:lds-ellipsis1 .6s infinite;left:8px}.waiting-box .content-loading .lds-ellipsis div:nth-child(2){-webkit-animation:lds-ellipsis2 .6s infinite;animation:lds-ellipsis2 .6s infinite;left:8px}.waiting-box .content-loading .lds-ellipsis div:nth-child(3){-webkit-animation:lds-ellipsis2 .6s infinite;animation:lds-ellipsis2 .6s infinite;left:32px}.waiting-box .content-loading .lds-ellipsis div:nth-child(4){-webkit-animation:lds-ellipsis3 .6s infinite;animation:lds-ellipsis3 .6s infinite;left:56px}.waiting-box .message-loading{font-size:1.75em}.waiting-box .message-loading span{-webkit-animation:message-opacity 1s infinite;animation:message-opacity 1s infinite;color:#fff;margin-right:1px}.waiting-box .message-loading span:last-child{margin-right:0}.waiting-box .message-loading span:nth-child(16n+1){-webkit-animation-delay:0;-webkit-animation-delay:0s;animation-delay:0;animation-delay:0s}.waiting-box .message-loading span:nth-child(16n+2){-webkit-animation-delay:.1s;animation-delay:.1s}.waiting-box .message-loading span:nth-child(16n+3){-webkit-animation-delay:.2s;animation-delay:.2s}.waiting-box .message-loading span:nth-child(16n+4){-webkit-animation-delay:.3s;animation-delay:.3s}.waiting-box .message-loading span:nth-child(16n+5){-webkit-animation-delay:.4s;animation-delay:.4s}.waiting-box .message-loading span:nth-child(16n+6){-webkit-animation-delay:.5s;animation-delay:.5s}.waiting-box .message-loading span:nth-child(16n+7){-webkit-animation-delay:.6s;animation-delay:.6s}.waiting-box .message-loading span:nth-child(16n+8){-webkit-animation-delay:.7s;animation-delay:.7s}.waiting-box .message-loading span:nth-child(16n+9){-webkit-animation-delay:.8s;animation-delay:.8s}.waiting-box .message-loading span:nth-child(16n+10){-webkit-animation-delay:.9s;animation-delay:.9s}.waiting-box .message-loading span:nth-child(16n+11){-webkit-animation-delay:1s;animation-delay:1s}.waiting-box .message-loading span:nth-child(16n+12){-webkit-animation-delay:1.1s;animation-delay:1.1s}.waiting-box .message-loading span:nth-child(16n+13){-webkit-animation-delay:1.2s;animation-delay:1.2s}.waiting-box .message-loading span:nth-child(16n+14){-webkit-animation-delay:1.3s;animation-delay:1.3s}.waiting-box .message-loading span:nth-child(16n+15){-webkit-animation-delay:1.4s;animation-delay:1.4s}.waiting-box .message-loading span:nth-child(16n+16){-webkit-animation-delay:1.5s;animation-delay:1.5s}.waiting-box.show{display:block}@-webkit-keyframes lds-ellipsis1{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes lds-ellipsis1{0%{transform:scale(0)}to{transform:scale(1)}}@-webkit-keyframes lds-ellipsis3{0%{transform:scale(1)}to{transform:scale(0)}}@keyframes lds-ellipsis3{0%{transform:scale(1)}to{transform:scale(0)}}@-webkit-keyframes lds-ellipsis2{0%{transform:translate(0)}to{transform:translate(24px)}}@keyframes lds-ellipsis2{0%{transform:translate(0)}to{transform:translate(24px)}}@-webkit-keyframes message-opacity{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@keyframes message-opacity{0%{opacity:1}50%{opacity:.5}to{opacity:1}}"]
34160
34168
  },] }
@@ -34202,6 +34210,7 @@
34202
34210
  scrollBarMenu: [{ type: i0.ViewChild, args: ['scrollbar',] }],
34203
34211
  showQuickNote: [{ type: i0.Input }],
34204
34212
  allowAnonymous: [{ type: i0.Input }],
34213
+ autoRenderMenu: [{ type: i0.Input }],
34205
34214
  handleShowPopupPermissionUtils: [{ type: i0.HostListener, args: ['document:keypress', ['$event'],] }]
34206
34215
  };
34207
34216
 
@@ -38523,10 +38532,8 @@
38523
38532
  _this.invalidFileTypeMessageDetail = 'định dạng file cho phép: {0}.';
38524
38533
  _this.invalidFileLimitMessageSummary = 'Quá số lượng file cho phép, ';
38525
38534
  _this.invalidFileLimitMessageDetail = 'tối đa {0} file.';
38526
- _this._hasLoadedSource = false;
38527
38535
  _this.readonly = false;
38528
- // Dùng cho component tài liệu
38529
- _this.inTaiLieu = false;
38536
+ _this.inTaiLieu = false; // Dùng cho component tài liệu
38530
38537
  _this.inTaiLieuChung = false;
38531
38538
  _this.copyToFolderId = _this._commonService.guidEmpty();
38532
38539
  _this.multipleCheckWhenClickRow = true;
@@ -38540,8 +38547,8 @@
38540
38547
  _this._unsubcribleAll = new rxjs.Subject();
38541
38548
  _this._dataSource = [];
38542
38549
  _this._layout = exports.EnumFileLayout;
38543
- // InstanceId thư mục gốc.
38544
- _this.rootFolderId = null;
38550
+ _this._hasLoadedSource = false;
38551
+ _this._rootFolderId = null; // InstanceId thư mục gốc.
38545
38552
  _this.progressValue = 0;
38546
38553
  _this.apiUploadUrl = '';
38547
38554
  _this.chooseLabel = 'Chọn';
@@ -38602,6 +38609,17 @@
38602
38609
  configurable: true
38603
38610
  });
38604
38611
  ;
38612
+ Object.defineProperty(FileManagerComponent.prototype, "rootFolderId", {
38613
+ get: function () {
38614
+ return this._rootFolderId;
38615
+ },
38616
+ set: function (value) {
38617
+ this._rootFolderId = value;
38618
+ this.data.currentFolderId = this.rootFolderId;
38619
+ },
38620
+ enumerable: false,
38621
+ configurable: true
38622
+ });
38605
38623
  Object.defineProperty(FileManagerComponent.prototype, "value", {
38606
38624
  set: function (value) {
38607
38625
  if (this._value != value) {
@@ -38686,7 +38704,6 @@
38686
38704
  };
38687
38705
  FileManagerComponent.prototype.setRootFolderId = function (rootFolderId) {
38688
38706
  this.rootFolderId = rootFolderId;
38689
- this.data.currentFolderId = this.rootFolderId;
38690
38707
  };
38691
38708
  FileManagerComponent.prototype.setDatasource = function (dataSource) {
38692
38709
  if (dataSource === void 0) { dataSource = []; }
@@ -39871,6 +39888,7 @@
39871
39888
  serviceCode: [{ type: i0.Input }],
39872
39889
  entity: [{ type: i0.Input }],
39873
39890
  entityKey: [{ type: i0.Input }],
39891
+ rootFolderId: [{ type: i0.Input }],
39874
39892
  readonly: [{ type: i0.Input }],
39875
39893
  inTaiLieu: [{ type: i0.Input }],
39876
39894
  inTaiLieuChung: [{ type: i0.Input }],
@@ -47085,6 +47103,14 @@
47085
47103
  NotificationService.prototype.markReadAllByUserCurrent = function () {
47086
47104
  return this.defaultPost(this.serviceUri + "/MarkReadAllByCurrentUser", {});
47087
47105
  };
47106
+ NotificationService.prototype.markReadByFilter = function (filter) {
47107
+ var url = this.serviceUri + "/MarkReadByFilter";
47108
+ return this.defaultPost(url, filter);
47109
+ };
47110
+ NotificationService.prototype.markUnReadByFilter = function (filter) {
47111
+ var url = this.serviceUri + "/MarkUnReadByFilter";
47112
+ return this.defaultPost(url, filter);
47113
+ };
47088
47114
  return NotificationService;
47089
47115
  }(BaseService));
47090
47116
  NotificationService.ɵprov = i0.ɵɵdefineInjectable({ factory: function NotificationService_Factory() { return new NotificationService(i0.ɵɵinject(i1$1.HttpClient), i0.ɵɵinject(i0.INJECTOR), i0.ɵɵinject(ModuleConfigService)); }, token: NotificationService, providedIn: "root" });
@@ -48462,45 +48488,46 @@
48462
48488
  function TnTabViewComponent(_commonService) {
48463
48489
  this._commonService = _commonService;
48464
48490
  this.data = [];
48465
- this._hiddenTab = [];
48466
- this.hiddenInfo = {};
48467
48491
  this.allowViewAll = false;
48468
48492
  this.isDynamicHeight = false;
48469
48493
  this.onTabChange = new i0.EventEmitter();
48470
- this.activeIndexChange = new i0.EventEmitter();
48494
+ this.activeCodeChange = new i0.EventEmitter();
48471
48495
  this.template = {};
48472
48496
  this.onlyIcon = false;
48473
48497
  this.styleClass = 'tn-tabview-beauty';
48474
48498
  this.height = '100%';
48475
48499
  this.ready = false;
48476
48500
  }
48477
- Object.defineProperty(TnTabViewComponent.prototype, "vertical", {
48501
+ Object.defineProperty(TnTabViewComponent.prototype, "children", {
48502
+ get: function () {
48503
+ return this._children;
48504
+ },
48478
48505
  set: function (value) {
48479
- this._vertical = value;
48480
- this.setStyleClass();
48506
+ this._children = value;
48507
+ if (this.ready) {
48508
+ this.setTemplateTab();
48509
+ this.setActiveTabCodeAndFireEvent();
48510
+ }
48481
48511
  },
48482
48512
  enumerable: false,
48483
48513
  configurable: true
48484
48514
  });
48485
48515
  ;
48486
- Object.defineProperty(TnTabViewComponent.prototype, "hiddenTab", {
48516
+ Object.defineProperty(TnTabViewComponent.prototype, "vertical", {
48487
48517
  set: function (value) {
48488
- if (value) {
48489
- this._hiddenTab = value;
48490
- }
48491
- else {
48492
- this._hiddenTab = [];
48493
- }
48494
- if (this.ready) {
48495
- this.setHiddenInfo();
48496
- }
48518
+ this._vertical = value;
48519
+ this.setStyleClass();
48497
48520
  },
48498
48521
  enumerable: false,
48499
48522
  configurable: true
48500
48523
  });
48501
- Object.defineProperty(TnTabViewComponent.prototype, "activeIndex", {
48524
+ ;
48525
+ Object.defineProperty(TnTabViewComponent.prototype, "activeCode", {
48502
48526
  set: function (value) {
48503
- this.currentTabIndex = value;
48527
+ this.currentTabCode = value;
48528
+ if (this.ready) {
48529
+ this.setActiveTabCodeAndFireEvent();
48530
+ }
48504
48531
  },
48505
48532
  enumerable: false,
48506
48533
  configurable: true
@@ -48510,17 +48537,19 @@
48510
48537
  if (this.isDynamicHeight) {
48511
48538
  this.height = null;
48512
48539
  }
48513
- if (this.currentTabIndex === null || this.currentTabIndex === undefined) {
48540
+ if (this.currentTabCode === null || this.currentTabCode === undefined) {
48514
48541
  var currentTabIndex = this.data.findIndex(function (q) { return q.active; });
48515
- if (currentTabIndex == -1) {
48516
- currentTabIndex = 0;
48542
+ if (currentTabIndex > -1) {
48543
+ this.currentTabCode = this.data[currentTabIndex].code;
48517
48544
  }
48518
- this.currentTabIndex = currentTabIndex;
48519
48545
  }
48520
48546
  this.ready = true;
48521
- this.setHiddenInfo();
48547
+ this.setActiveTabCodeAndFireEvent();
48522
48548
  };
48523
48549
  TnTabViewComponent.prototype.ngAfterContentInit = function () {
48550
+ this.setTemplateTab();
48551
+ };
48552
+ TnTabViewComponent.prototype.setTemplateTab = function () {
48524
48553
  var _this = this;
48525
48554
  this.onlyIcon = true;
48526
48555
  this.data.forEach(function (item) {
@@ -48531,13 +48560,6 @@
48531
48560
  });
48532
48561
  this.setStyleClass();
48533
48562
  };
48534
- TnTabViewComponent.prototype.setHiddenInfo = function () {
48535
- var _this = this;
48536
- this.hiddenInfo = {};
48537
- this._hiddenTab.forEach(function (tabCode) {
48538
- _this.hiddenInfo[tabCode] = true;
48539
- });
48540
- };
48541
48563
  TnTabViewComponent.prototype.setStyleClass = function () {
48542
48564
  var result = 'tn-tabview-beauty';
48543
48565
  if (this._vertical) {
@@ -48549,18 +48571,26 @@
48549
48571
  this.styleClass = result;
48550
48572
  };
48551
48573
  TnTabViewComponent.prototype.handleTabChange = function (evt) {
48552
- var e_1, _a;
48553
48574
  this.currentTabIndex = evt.index;
48554
- var index = 0;
48575
+ this.setActiveTabCodeAndFireEvent();
48576
+ };
48577
+ TnTabViewComponent.prototype.setActiveTabCodeAndFireEvent = function () {
48578
+ var e_1, _a;
48579
+ var index = -1;
48580
+ var firsItem = null;
48581
+ var lastItem = null;
48555
48582
  try {
48556
48583
  for (var _b = __values(this.data), _c = _b.next(); !_c.done; _c = _b.next()) {
48557
48584
  var item = _c.value;
48558
- if (!item.hidden && !this.hiddenInfo[item.code]) {
48559
- if (index == this.currentTabIndex) {
48560
- this.currentTabCode = item.code;
48585
+ if (!item.hidden && this.template[item.code]) {
48586
+ index++;
48587
+ if (!firsItem) {
48588
+ firsItem = item;
48589
+ }
48590
+ lastItem = item;
48591
+ if (!this.currentTabCode || this.currentTabCode == item.code) {
48561
48592
  break;
48562
48593
  }
48563
- index++;
48564
48594
  }
48565
48595
  }
48566
48596
  }
@@ -48571,18 +48601,26 @@
48571
48601
  }
48572
48602
  finally { if (e_1) throw e_1.error; }
48573
48603
  }
48574
- this.activeIndexChange.emit(this.currentTabIndex);
48575
- this.onTabChange.emit({
48576
- index: this.currentTabIndex,
48577
- code: this.currentTabCode
48578
- });
48604
+ // Nếu có item display thì ms set active
48605
+ if (index > -1) {
48606
+ this.currentTabIndex = index;
48607
+ if (lastItem.code != this.currentTabCode) {
48608
+ this.currentTabIndex = 0;
48609
+ this.currentTabCode = firsItem.code;
48610
+ }
48611
+ this.activeCodeChange.emit(this.currentTabCode);
48612
+ this.onTabChange.emit({
48613
+ index: this.currentTabIndex,
48614
+ code: this.currentTabCode
48615
+ });
48616
+ }
48579
48617
  };
48580
48618
  return TnTabViewComponent;
48581
48619
  }());
48582
48620
  TnTabViewComponent.decorators = [
48583
48621
  { type: i0.Component, args: [{
48584
48622
  selector: 'tn-tabview',
48585
- template: "<div [style.height]=\"height\">\r\n <p-tabView #tab orientation=\"top\" [styleClass]=\"styleClass\" [activeIndex]=\"currentTabIndex\"\r\n (onChange)=\"handleTabChange($event)\">\r\n <ng-container *ngFor=\"let item of data; let i = index\">\r\n <p-tabPanel *ngIf=\"!item.hidden && !hiddenInfo[item.code]\" [leftIcon]=\"item.icon\" [header]=\"item.label\"\r\n [headerStyleClass]=\"item.headerStyleClass\">\r\n <ng-container *ngIf=\"allowViewAll || item.alwayRender || currentTabCode == item.code\">\r\n <tn-custom-scrollbar *ngIf=\"item.useScrollbar\">\r\n <ng-container *ngTemplateOutlet=\"template[item.code]; context: {$implicit: item}\">\r\n </ng-container>\r\n </tn-custom-scrollbar>\r\n <ng-container *ngIf=\"!item.useScrollbar\">\r\n <ng-container *ngTemplateOutlet=\"template[item.code]; context: {$implicit: item}\">\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </p-tabPanel>\r\n </ng-container>\r\n </p-tabView>\r\n</div>",
48623
+ template: "<div [style.height]=\"height\">\r\n <p-tabView #tab orientation=\"top\" [styleClass]=\"styleClass\" [activeIndex]=\"currentTabIndex\"\r\n (onChange)=\"handleTabChange($event)\">\r\n <ng-container *ngFor=\"let item of data; let i = index\">\r\n <p-tabPanel *ngIf=\"!item.hidden && template[item.code]\" [leftIcon]=\"item.icon\"\r\n [header]=\"item.label\" [headerStyleClass]=\"item.headerStyleClass\">\r\n <ng-container *ngIf=\"allowViewAll || item.alwayRender || currentTabCode == item.code\">\r\n <tn-custom-scrollbar *ngIf=\"item.useScrollbar\">\r\n <ng-container *ngTemplateOutlet=\"template[item.code]; context: {$implicit: item}\">\r\n </ng-container>\r\n </tn-custom-scrollbar>\r\n <ng-container *ngIf=\"!item.useScrollbar\">\r\n <ng-container *ngTemplateOutlet=\"template[item.code]; context: {$implicit: item}\">\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </p-tabPanel>\r\n </ng-container>\r\n </p-tabView>\r\n</div>",
48586
48624
  styles: [".accordion-link{flex:1 1;text-align:right}.accordion-link ul{list-style:none;margin-bottom:0;margin-top:0;padding-left:0}.accordion-link ul li{background-color:#a4a5a4;border-radius:4px;color:#fff;display:inline-block;line-height:20px;margin-bottom:.5rem;margin-left:.5rem;padding:6px 12px;transition:all .3s ease-out}.accordion-link ul li:hover{background-color:#3db762;cursor:pointer}.accordion-link ul li.tab-active{background-color:#23a349}.tn-l-toolbar{display:flex;padding:.5rem .5rem 0}.hoso-container{height:auto;max-height:none}.tab-number{align-items:center;background:#a4a5a4;border-radius:2px;color:#fff;display:inline-flex;font-size:.9em;height:20px;justify-content:center;margin-right:.5rem;padding-top:2px;width:20px}.tab-number.active{background:#23a349}::ng-deep tn-accordion-tab{display:flex;flex-direction:column;height:100%}::ng-deep tn-accordion-tab .p-accordion-header{position:-webkit-sticky;position:sticky;top:1px;z-index:6}::ng-deep tn-accordion-tab .tn-l-p-accordion-wrapper{border-radius:4px;display:flex;flex:1;margin-left:.5rem;margin-right:.5rem;overflow:auto}::ng-deep tn-accordion-tab .tn-l-p-accordion-wrapper tn-custom-scrollbar{width:100%}::ng-deep tn-accordion-tab .ps__rail-x,::ng-deep tn-accordion-tab .ps__rail-y{z-index:7}::ng-deep tn-accordion-tab .tn-l-toolbar .toolbar{flex:0 0 auto;padding-top:0}@media (max-width:640px){.accordion-link,.toolbar{overflow-x:auto;white-space:nowrap}.tn-l-custom-wrapper{display:block}.accordion-link ul{margin-top:0}.tn-l-toolbar{display:block}}"]
48587
48625
  },] }
48588
48626
  ];
@@ -48593,12 +48631,11 @@
48593
48631
  children: [{ type: i0.ContentChildren, args: [i0.TemplateRef,] }],
48594
48632
  vertical: [{ type: i0.Input }],
48595
48633
  data: [{ type: i0.Input }],
48596
- hiddenTab: [{ type: i0.Input }],
48597
48634
  allowViewAll: [{ type: i0.Input }],
48598
- activeIndex: [{ type: i0.Input }],
48635
+ activeCode: [{ type: i0.Input }],
48599
48636
  isDynamicHeight: [{ type: i0.Input }],
48600
48637
  onTabChange: [{ type: i0.Output }],
48601
- activeIndexChange: [{ type: i0.Output }]
48638
+ activeCodeChange: [{ type: i0.Output }]
48602
48639
  };
48603
48640
 
48604
48641
  var TnTemplateComponent = /** @class */ (function (_super) {
@@ -51122,8 +51159,21 @@
51122
51159
  return _this;
51123
51160
  }
51124
51161
  ProcessWorkflowFormComponent.prototype.ngOnInit = function () {
51162
+ var _this = this;
51125
51163
  _super.prototype.ngOnInit.call(this);
51126
51164
  this.init();
51165
+ var missingNames = [];
51166
+ if (!this.businessSetting.baseService.objectName) {
51167
+ missingNames.push('tên đối tượng (base service)');
51168
+ }
51169
+ if (!this.businessSetting.displayField) {
51170
+ missingNames.push('display field (crud list setting)');
51171
+ }
51172
+ if (missingNames.length) {
51173
+ setTimeout(function () {
51174
+ _this._notifierService.showWarning("B\u1EA1n ch\u01B0a c\u1EA5u h\u00ECnh " + missingNames.join(', '));
51175
+ }, 0);
51176
+ }
51127
51177
  };
51128
51178
  ProcessWorkflowFormComponent.prototype.init = function () {
51129
51179
  this.setting.baseService = this._stateMachinesService;
@@ -51856,73 +51906,148 @@
51856
51906
  }
51857
51907
  };
51858
51908
  FileDataService.prototype.getData = function () {
51909
+ if (this._fileManagerControls.length > 0) {
51910
+ this.getDataSourceForFileManagerControls();
51911
+ }
51912
+ else if (this._fileUploadControls.length > 0) {
51913
+ this.getDataSourceForFileUploadControls();
51914
+ }
51915
+ };
51916
+ FileDataService.prototype.getDataSourceForFileUploadControls = function () {
51859
51917
  var e_1, _a;
51860
51918
  var _this = this;
51861
- if (this._fileManagerControls.length > 0) {
51862
- var dataPosts_1 = [];
51863
- this._fileManagerControls.forEach(function (control) {
51864
- dataPosts_1.push({
51919
+ var entityKeys = [];
51920
+ try {
51921
+ for (var _b = __values(this._fileUploadControls), _c = _b.next(); !_c.done; _c = _b.next()) {
51922
+ var control = _c.value;
51923
+ entityKeys.push(control.entityKey);
51924
+ }
51925
+ }
51926
+ catch (e_1_1) { e_1 = { error: e_1_1 }; }
51927
+ finally {
51928
+ try {
51929
+ if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
51930
+ }
51931
+ finally { if (e_1) throw e_1.error; }
51932
+ }
51933
+ var fileFilter = new Filter({ field: 'entityKey', operator: exports.Operator.in, value: JSON.stringify(entityKeys) });
51934
+ this._fileService.getAll([fileFilter], null, [new Sort({ field: 'created', dir: -1 })]).then(function (res) {
51935
+ var e_2, _a;
51936
+ if (res.data == null || !res.success)
51937
+ return;
51938
+ var filesData = res.data;
51939
+ var _loop_1 = function (control) {
51940
+ var fileObject = filesData.find(function (x) { return x.entityKey == control.entityKey; });
51941
+ if (fileObject == null || fileObject == undefined) {
51942
+ return "continue";
51943
+ }
51944
+ control.setFileObject(fileObject);
51945
+ };
51946
+ try {
51947
+ for (var _b = __values(_this._fileUploadControls), _c = _b.next(); !_c.done; _c = _b.next()) {
51948
+ var control = _c.value;
51949
+ _loop_1(control);
51950
+ }
51951
+ }
51952
+ catch (e_2_1) { e_2 = { error: e_2_1 }; }
51953
+ finally {
51954
+ try {
51955
+ if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
51956
+ }
51957
+ finally { if (e_2) throw e_2.error; }
51958
+ }
51959
+ });
51960
+ };
51961
+ FileDataService.prototype.getDataSourceForFileManagerControls = function () {
51962
+ var dataPosts = [];
51963
+ var rootFolderIds = [];
51964
+ this._fileManagerControls.forEach(function (control) {
51965
+ if (!control.rootFolderId) {
51966
+ dataPosts.push({
51865
51967
  serviceCode: control.serviceCode,
51866
51968
  entity: control.entity,
51867
51969
  entityKey: control._entityKey
51868
51970
  });
51869
- });
51870
- this._folderService.getSimpleDataByEntityKeys(dataPosts_1)
51871
- .then(function (res) { return _this._crudService.handleResponse(res, '', function (f) {
51872
- var dataFile = _this.processDatasourceFile(res.data);
51873
- var key = '';
51874
- _this._fileManagerControls.forEach(function (control) {
51875
- key = control.serviceCode + "/" + control.entity + "/" + control._entityKey;
51876
- if (dataFile[key]) {
51877
- control.setRootFolderId(dataFile[key].folderId);
51878
- control.setDatasource(dataFile[key].lstFile);
51879
- }
51880
- });
51881
- }); });
51971
+ return;
51972
+ }
51973
+ rootFolderIds.push(control.rootFolderId);
51974
+ });
51975
+ if (rootFolderIds.length > 0) {
51976
+ this.getDataForControlsWithRootId(rootFolderIds);
51882
51977
  }
51883
- else if (this._fileUploadControls.length > 0) {
51884
- var entityKeys = [];
51978
+ if (dataPosts.length > 0) {
51979
+ this.getDataControlsWithServiceRequestModel(dataPosts);
51980
+ }
51981
+ };
51982
+ FileDataService.prototype.getDataForControlsWithRootId = function (rootFolderIds) {
51983
+ var _this = this;
51984
+ this._fileService.getAll([new Filter({ field: 'folderId', operator: exports.Operator.in, value: JSON.stringify(rootFolderIds) })]).then(function (res) {
51985
+ var e_3, _a, e_4, _b;
51986
+ if (!res || !res.success || !res.data) {
51987
+ return;
51988
+ }
51989
+ var dataSourceObject = {};
51885
51990
  try {
51886
- for (var _b = __values(this._fileUploadControls), _c = _b.next(); !_c.done; _c = _b.next()) {
51887
- var control = _c.value;
51888
- entityKeys.push(control.entityKey);
51991
+ for (var _c = __values(res.data), _d = _c.next(); !_d.done; _d = _c.next()) {
51992
+ var file = _d.value;
51993
+ if (!file.folderId) {
51994
+ continue;
51995
+ }
51996
+ var folderId = file.folderId;
51997
+ if (dataSourceObject[folderId] == null) {
51998
+ dataSourceObject[folderId] = [file];
51999
+ continue;
52000
+ }
52001
+ dataSourceObject[folderId].push(file);
51889
52002
  }
51890
52003
  }
51891
- catch (e_1_1) { e_1 = { error: e_1_1 }; }
52004
+ catch (e_3_1) { e_3 = { error: e_3_1 }; }
51892
52005
  finally {
51893
52006
  try {
51894
- if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
52007
+ if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
51895
52008
  }
51896
- finally { if (e_1) throw e_1.error; }
52009
+ finally { if (e_3) throw e_3.error; }
51897
52010
  }
51898
- var fileFilter = new Filter({ field: 'entityKey', operator: exports.Operator.in, value: JSON.stringify(entityKeys) });
51899
- this._fileService.getAll([fileFilter], null, [new Sort({ field: 'created', dir: -1 })]).then(function (res) {
51900
- var e_2, _a;
51901
- if (res.data == null || !res.success)
51902
- return;
51903
- var filesData = res.data;
51904
- var _loop_1 = function (control) {
51905
- var fileObject = filesData.find(function (x) { return x.entityKey == control.entityKey; });
51906
- if (fileObject == null || fileObject == undefined) {
51907
- return "continue";
52011
+ try {
52012
+ for (var _e = __values(_this._fileManagerControls), _f = _e.next(); !_f.done; _f = _e.next()) {
52013
+ var control = _f.value;
52014
+ if (!(control.rootFolderId && rootFolderIds.indexOf(control.rootFolderId) >= 0)) {
52015
+ continue;
51908
52016
  }
51909
- control.setFileObject(fileObject);
51910
- };
51911
- try {
51912
- for (var _b = __values(_this._fileUploadControls), _c = _b.next(); !_c.done; _c = _b.next()) {
51913
- var control = _c.value;
51914
- _loop_1(control);
52017
+ var lstFile = dataSourceObject[control.rootFolderId];
52018
+ if (!lstFile) {
52019
+ continue;
51915
52020
  }
52021
+ lstFile.sort(multipleSort({ name: 'fileExplorerItemType', reverse: true }, // Sắp xếp folder lên trên file
52022
+ { name: 'name', primer: function (a) { return a.toLowerCase(); } } // Order theo tên (nhưng phải toLower vì T < b < t)
52023
+ ));
52024
+ control.setRootFolderId(control.rootFolderId);
52025
+ control.setDatasource(lstFile);
51916
52026
  }
51917
- catch (e_2_1) { e_2 = { error: e_2_1 }; }
51918
- finally {
51919
- try {
51920
- if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
51921
- }
51922
- finally { if (e_2) throw e_2.error; }
52027
+ }
52028
+ catch (e_4_1) { e_4 = { error: e_4_1 }; }
52029
+ finally {
52030
+ try {
52031
+ if (_f && !_f.done && (_b = _e.return)) _b.call(_e);
52032
+ }
52033
+ finally { if (e_4) throw e_4.error; }
52034
+ }
52035
+ });
52036
+ };
52037
+ FileDataService.prototype.getDataControlsWithServiceRequestModel = function (dataPosts) {
52038
+ var _this = this;
52039
+ this._folderService.getSimpleDataByEntityKeys(dataPosts)
52040
+ .then(function (res) { return _this._crudService.handleResponse(res, '', function () {
52041
+ var dataFile = _this.processDatasourceFile(res.data);
52042
+ var key = '';
52043
+ _this._fileManagerControls.forEach(function (control) {
52044
+ key = control.serviceCode + "/" + control.entity + "/" + control._entityKey;
52045
+ if (dataFile[key]) {
52046
+ control.setRootFolderId(dataFile[key].folderId);
52047
+ control.setDatasource(dataFile[key].lstFile);
51923
52048
  }
51924
52049
  });
51925
- }
52050
+ }); });
51926
52051
  };
51927
52052
  FileDataService.prototype.processDatasourceFile = function (fileData) {
51928
52053
  var _this = this;
@@ -59931,6 +60056,8 @@
59931
60056
  exports.SchemaBase = SchemaBase;
59932
60057
  exports.SecurePipe = SecurePipe;
59933
60058
  exports.ServiceFileUploadComponent = ServiceFileUploadComponent;
60059
+ exports.ServiceRequestModel = ServiceRequestModel;
60060
+ exports.ServiceRequestModelV5 = ServiceRequestModelV5;
59934
60061
  exports.SessionTypes = SessionTypes;
59935
60062
  exports.SignalRService = SignalRService;
59936
60063
  exports.SimpleDicItem = SimpleDicItem;