qms-angular 1.1.17 → 1.1.18

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 (37) hide show
  1. package/bundles/qms-angular.umd.js +297 -98
  2. package/bundles/qms-angular.umd.js.map +1 -1
  3. package/esm2015/lib/common/models/qms-tree-node.model.js +1 -1
  4. package/esm2015/lib/components/select-access-dialog/common/animation.js +12 -2
  5. package/esm2015/lib/components/select-access-dialog/model/select-access-config.model.js +20 -0
  6. package/esm2015/lib/components/select-access-dialog/model/select-access-data.js +1 -1
  7. package/esm2015/lib/components/select-access-dialog/public-api.js +2 -1
  8. package/esm2015/lib/components/select-access-dialog/select-access-dialog.component.js +141 -51
  9. package/esm2015/lib/components/select-department/select-department.component.js +17 -9
  10. package/esm2015/lib/components/select-department-tree/animation/animation.js +12 -2
  11. package/esm2015/lib/components/select-department-tree/select-department-tree.component.js +18 -32
  12. package/esm2015/lib/model/en.js +2 -1
  13. package/esm2015/lib/model/no.js +2 -1
  14. package/esm2015/lib/qms-ckeditor-components/common/models/qms-ckeditor-plugin.model.js +2 -1
  15. package/esm2015/lib/qms-ckeditor-components/components/qms-ckeditor-link-simple/qms-ckeditor-link-simple.component.js +54 -0
  16. package/esm2015/lib/qms-ckeditor-components/qms-ckeditor.component.js +20 -7
  17. package/esm2015/lib/qms-ckeditor-components/qms-ckeditor.module.js +7 -3
  18. package/esm2015/public-api.js +2 -1
  19. package/fesm2015/qms-angular.js +281 -96
  20. package/fesm2015/qms-angular.js.map +1 -1
  21. package/lib/common/models/qms-tree-node.model.d.ts +1 -0
  22. package/lib/components/select-access-dialog/model/select-access-config.model.d.ts +18 -0
  23. package/lib/components/select-access-dialog/public-api.d.ts +1 -0
  24. package/lib/components/select-access-dialog/select-access-dialog.component.d.ts +11 -9
  25. package/lib/components/select-department/select-department.component.d.ts +4 -4
  26. package/lib/components/select-department-tree/select-department-tree.component.d.ts +1 -1
  27. package/lib/model/en.d.ts +1 -0
  28. package/lib/model/no.d.ts +1 -0
  29. package/lib/qms-ckeditor-components/common/models/qms-ckeditor-plugin.model.d.ts +1 -0
  30. package/lib/qms-ckeditor-components/components/qms-ckeditor-link-simple/qms-ckeditor-link-simple.component.d.ts +17 -0
  31. package/package.json +1 -1
  32. package/public-api.d.ts +1 -0
  33. package/qms-angular.metadata.json +1 -1
  34. package/src/assets/qms-ckeditor-plugin/build/ckeditor.js +1 -1
  35. package/src/lib/components/select-access-dialog/select-access-dialog.component.scss +90 -6
  36. package/src/lib/components/select-department-tree/select-department-tree.component.scss +83 -3
  37. package/src/lib/qms-ckeditor-components/components/qms-ckeditor-link-simple/qms-ckeditor-link-simple.component.scss +1 -0
@@ -53,7 +53,7 @@ import { STEPPER_GLOBAL_OPTIONS } from '@angular/cdk/stepper';
53
53
  import { MatStepperModule } from '@angular/material/stepper';
54
54
  import { MatSlideToggleModule } from '@angular/material/slide-toggle';
55
55
  import { DragDropModule } from '@angular/cdk/drag-drop';
56
- import { query, style, group, animate, trigger, transition, state } from '@angular/animations';
56
+ import { query, style, group, animate, trigger, transition, state, stagger } from '@angular/animations';
57
57
  import { MatDividerModule } from '@angular/material/divider';
58
58
  import { MatPaginatorModule } from '@angular/material/paginator';
59
59
  import { NgxMatSelectSearchModule } from 'ngx-mat-select-search';
@@ -138,6 +138,7 @@ const en = {
138
138
  "TYPE": "Type",
139
139
  "SEARCH_WITH_NAME": "Search first and last name",
140
140
  "RESULT_SEARCH_FOR": "Results search for ",
141
+ "TOOLTIP_INCLUDE_CHILD": "{0} - includes {1} children",
141
142
  "ERROR": {
142
143
  "SELECT_DANGER": "You must select one or more events"
143
144
  },
@@ -522,6 +523,7 @@ const no = {
522
523
  "TYPE": "Type",
523
524
  "SEARCH_WITH_NAME": "Søk for- og etternavn",
524
525
  "RESULT_SEARCH_FOR": "Resultater søk etter ",
526
+ "TOOLTIP_INCLUDE_CHILD": "{0} – inkluderer {1} barn",
525
527
  "ERROR": {
526
528
  "SELECT_DANGER": "Du må velge en eller flere hendelser"
527
529
  },
@@ -23202,6 +23204,50 @@ QMSCKEditorFlowchartComponent.propDecorators = {
23202
23204
  onMessage: [{ type: HostListener, args: ['window:message', ['$event'],] }]
23203
23205
  };
23204
23206
 
23207
+ class QmsCkeditorLinkSimpleComponent extends QMSCKEditorBaseComponent {
23208
+ constructor(dialogRef, translate, data) {
23209
+ super();
23210
+ this.dialogRef = dialogRef;
23211
+ this.translate = translate;
23212
+ this.data = data;
23213
+ this.urlFormControl = new FormControl('', [Validators.required]);
23214
+ }
23215
+ ngOnInit() {
23216
+ this.translate.getLanguageSubject$.pipe(takeUntil(this.ngUnsubcribe)).subscribe((res) => {
23217
+ if (res) {
23218
+ this.LANG = this.translate.getObjectLang(res);
23219
+ }
23220
+ });
23221
+ if (this.data.edit) {
23222
+ if (this.data.url) {
23223
+ this.url = this.data.url;
23224
+ }
23225
+ }
23226
+ }
23227
+ setLink() {
23228
+ this.urlFormControl.markAsTouched();
23229
+ if (this.urlFormControl.hasError('required')) {
23230
+ return;
23231
+ }
23232
+ const link = new QMSCKEditorLink();
23233
+ link.targetId = TargetType.new;
23234
+ link.url = `${LinkType.url}${ProtocolType.http}${this.url}`;
23235
+ this.dialogRef.close(link);
23236
+ }
23237
+ }
23238
+ QmsCkeditorLinkSimpleComponent.decorators = [
23239
+ { type: Component, args: [{
23240
+ selector: 'lib-qms-ckeditor-link-simple',
23241
+ template: "<div id=\"qmsckeditor_link-simple\" class=\"qmsckeditor qmsckeditor__link-simple__container\">\r\n <div id=\"qmsckeditor_link-simple_header\">\r\n <span mat-icon-button class=\"qmsckeditor button__close\" [mat-dialog-close]=\"false\">\r\n <mat-icon>close</mat-icon>\r\n </span>\r\n <div mat-dialog-content>\r\n <h2>\r\n {{LANG.QMSCKEDITOR.LINK}}\r\n </h2>\r\n </div>\r\n </div>\r\n <div id=\"qmsckeditor_link-simple_body\" class=\"row\">\r\n <div id=\"qmsckeditor_link-simple_url\">\r\n <mat-form-field class=\"col-12\" appearance=\"fill\">\r\n <mat-label>{{ LANG.QMSCKEDITOR.LINK_URL }}</mat-label>\r\n <input matInput [(ngModel)]=\"url\" name=\"url\" [formControl]=\"urlFormControl\" />\r\n <mat-error *ngIf=\"urlFormControl.hasError('required')\">\r\n </mat-error>\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n <div id=\"qmsckeditor_link-simple_footer\">\r\n <div id=\"qmsckeditor_link-simple_action\" align=\"end\">\r\n <button qms-btn-text [mat-dialog-close]=\"false\">{{LANG.CANCEL}}</button>\r\n <button qms-btn (click)=\"setLink()\">{{LANG.SAVE}}</button>\r\n </div>\r\n </div>\r\n</div>",
23242
+ styles: [".mt5{margin-top:5px!important}.mt10{margin-top:10px!important}.mt7{margin-top:7px!important}.mt15{margin-top:15px!important}.mt20{margin-top:20px!important}.mt30{margin-top:30px!important}.mt40{margin-top:40px!important}.ml2{margin-left:2px!important}.ml3{margin-left:3px!important}.ml5{margin-left:5px!important}.ml15{margin-left:15px!important}.ml10{margin-left:10px!important}.ml12{margin-left:12px!important}.ml16{margin-left:16px!important}.ml-auto{margin-left:auto!important}.ml-25{margin-left:-25px!important}.mr5{margin-right:5px!important}.mr12{margin-right:12px!important}.mr15{margin-right:15px!important}.mb5{margin-bottom:5px!important}.mb10{margin-bottom:10px!important}.mb15{margin-bottom:15px!important}.pt8{padding-top:8px!important}.pt10{padding-top:10px!important}.pt15{padding-top:15px!important}.pt16{padding-top:16px!important}.pl15{padding-left:15px!important}.pl0{padding-left:0!important}.pr0{padding-right:0!important}.pr15{padding-right:15px!important}.fs12{font-size:12px}.fs14{font-size:14px!important}.fs16{font-size:16px!important}.fs22{font-size:22px!important}.fw500{font-weight:500!important}.italic-text{font-style:italic}.display-flex{display:flex}.qmsckeditor{font-family:Roboto,Helvetica Neue,sans-serif;font-size:14px;font-weight:400}.qmsckeditor h2{font-size:20px;font-weight:400}.qmsckeditor .mat-dialog-content{padding:0}.qmsckeditor .mat-icon{color:#909497}.qmsckeditor__fullscreen{position:fixed;top:0;left:0;right:0;bottom:0;background:#fff;overflow-y:auto;max-height:100vh;overflow-x:hidden}.qmsckeditor__cursor{cursor:pointer}.qmsckeditor__notallowed{cursor:not-allowed}.qmsckeditor.button__close,.qmsckeditor.button__done{float:right;top:-24px;right:-24px;cursor:pointer}.qmsckeditor.button__done{margin-right:20px}.qmsckeditor.button__done .mat-icon{color:#28a745;font-weight:700}.qmsckeditor.button__groups button{min-height:40px;width:100%;border-radius:4px;border:1px solid #c5c5c5;font-family:Open Sans;font-weight:600;font-size:14px;letter-spacing:1px;line-height:16px}.qmsckeditor.button__groups .save{background:#f8f9f9}.qmsckeditor.button__groups .save:hover{background:#e5e7e9}.qmsckeditor.button__groups .save:disabled{cursor:not-allowed}.qmsckeditor.button__groups .cancel{background:#f8f9f9}.qmsckeditor.button__groups .cancel:hover{background:#e5e7e9}.qmsckeditor.button__groups .cancel:disabled{cursor:not-allowed}.qmsckeditor.button__groups .delete{background:#f8f9f9}.qmsckeditor.button__groups .delete:hover{background:#e5e7e9}.qmsckeditor.button__groups .delete:disabled{cursor:not-allowed}.qmsckeditor.confirm__button__groups button{min-height:36px;border-radius:4px;width:auto;border:1px solid #c5c5c5;font-family:Open Sans;font-weight:600;font-size:14px;letter-spacing:1px;line-height:16px;padding-left:15px;padding-right:15px}.qmsckeditor.confirm__button__groups .confirm{background:#f8f9f9}.qmsckeditor.confirm__button__groups .confirm:hover{background:#e5e7e9}.qmsckeditor.confirm__button__groups .cancel{background:#f8f9f9}.qmsckeditor.confirm__button__groups .cancel:hover{background:#e5e7e9}.qmsckeditor.template-content.height{min-height:420px;max-height:520px;overflow:auto}.qmsckeditor.template-content.title{margin-left:-9px}.qmsckeditor.link__content.height{min-height:400px;max-height:520px}.qmsckeditor.card{margin-bottom:10px;min-height:60px;box-shadow:none;border:1px solid #e5e5e5}.qmsckeditor.card .title{font-weight:700}.qmsckeditor.card .content{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.qmsckeditor.card .material-icons{font-size:20px}.qmsckeditor.tooltip-content.height{min-height:400px;max-height:472px;overflow:auto}.qmsckeditor.save__as__template.height{height:125px}.ck-content .ck-horizontal-line,.ck-content .page-break{width:100%}.ck-content hr{background:#ccc}.ck-font-size-dropdown .ck-dropdown__panel ul{max-height:320px;overflow-y:auto}.ck-font-size-dropdown .ck-dropdown__panel ul li .ck-fontsize-option .ck-button__label{line-height:50px}"]
23243
+ },] }
23244
+ ];
23245
+ QmsCkeditorLinkSimpleComponent.ctorParameters = () => [
23246
+ { type: MatDialogRef },
23247
+ { type: TranslateLibraryService },
23248
+ { type: QMSCKEditorLink, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] }
23249
+ ];
23250
+
23205
23251
  class QMSCKEditorComponent extends QMSCKEditorBaseComponent {
23206
23252
  /**
23207
23253
  * Constructor
@@ -23495,12 +23541,24 @@ class QMSCKEditorComponent extends QMSCKEditorBaseComponent {
23495
23541
  data.editorContent = this.qmsckContentInput;
23496
23542
  data.module = this.qmsckData.module;
23497
23543
  data.entityId = this.qmsckData.entityId;
23498
- const dialogTemplate = this.dialog.open(QMSCKEditorLinkComponent, {
23499
- width: '650px',
23500
- height: '660px',
23501
- data,
23502
- disableClose: true
23503
- });
23544
+ let dialogTemplate;
23545
+ if (!this.qmsckPlugin.simpleMode) {
23546
+ dialogTemplate = this.dialog.open(QMSCKEditorLinkComponent, {
23547
+ width: '650px',
23548
+ height: '660px',
23549
+ data,
23550
+ disableClose: true
23551
+ });
23552
+ }
23553
+ else {
23554
+ dialogTemplate = this.dialog.open(QmsCkeditorLinkSimpleComponent, {
23555
+ width: '650px',
23556
+ height: '200px',
23557
+ data,
23558
+ disableClose: true,
23559
+ autoFocus: false,
23560
+ });
23561
+ }
23504
23562
  dialogTemplate
23505
23563
  .afterClosed()
23506
23564
  .pipe(takeUntil(this.ngUnsubcribe))
@@ -23835,7 +23893,8 @@ QMSCKEditorModule.decorators = [
23835
23893
  QMSCKEditorBpmnComponent,
23836
23894
  SaveTemplateComponent,
23837
23895
  QMSCKEditorAboutComponent,
23838
- QMSCKEditorFlowchartComponent
23896
+ QMSCKEditorFlowchartComponent,
23897
+ QmsCkeditorLinkSimpleComponent
23839
23898
  ],
23840
23899
  imports: [
23841
23900
  CKEditorModule$1,
@@ -23863,7 +23922,8 @@ QMSCKEditorModule.decorators = [
23863
23922
  HttpClientModule,
23864
23923
  MatTabsModule,
23865
23924
  MatProgressBarModule,
23866
- SharedModule
23925
+ QMSButtonModule,
23926
+ SharedModule,
23867
23927
  ],
23868
23928
  providers: [],
23869
23929
  exports: [QMSCKEditorComponent],
@@ -23902,6 +23962,7 @@ class QMSCKEditorPlugin {
23902
23962
  constructor() {
23903
23963
  this.pluginObject = null;
23904
23964
  this.itemToolbar = '';
23965
+ this.simpleMode = false;
23905
23966
  }
23906
23967
  }
23907
23968
 
@@ -28944,6 +29005,16 @@ const AnimationTreeDepartment = [
28944
29005
  animate('0.5s ease', style({ opacity: 1 }))
28945
29006
  ]),
28946
29007
  ]),
29008
+ trigger('listAnimation', [
29009
+ transition('* => *', [
29010
+ query(':enter', [
29011
+ style({ opacity: 0, transform: 'translateY(-100%)' }),
29012
+ stagger(25, [
29013
+ animate('0.4s cubic-bezier(0.23, 1, 0.320, 1)', style({ opacity: 1, transform: 'none' }))
29014
+ ])
29015
+ ], { optional: true })
29016
+ ])
29017
+ ])
28947
29018
  ];
28948
29019
 
28949
29020
  class SelectDepartmentTreeComponent {
@@ -28991,7 +29062,7 @@ class SelectDepartmentTreeComponent {
28991
29062
  this.checkListSelection = new SelectionModel(true);
28992
29063
  this.checkListSelectionSearch = new SelectionModel(true);
28993
29064
  this.formSearchControl = new FormControl('');
28994
- this.isSearching = false;
29065
+ this.getLoading$ = new BehaviorSubject(false);
28995
29066
  this.textResultSearch = '';
28996
29067
  this.itemIconType = ItemIconType;
28997
29068
  this._transformer = (node, level) => {
@@ -29060,7 +29131,7 @@ class SelectDepartmentTreeComponent {
29060
29131
  }
29061
29132
  this.currentPaginationConfig.pageIndex = 0;
29062
29133
  this.currentPaginationConfig.pageSize = 10;
29063
- this.isSearching = false;
29134
+ this.getLoading$.next(false);
29064
29135
  this.textResultSearch = this.formSearchControl.value;
29065
29136
  this.onPagingSearchResult(this.currentPaginationConfig);
29066
29137
  this._mapToResultSearch();
@@ -29081,27 +29152,10 @@ class SelectDepartmentTreeComponent {
29081
29152
  })).subscribe(_ => {
29082
29153
  this.activeNode = '';
29083
29154
  });
29084
- // this.checkListSelectionSearch.changed
29085
- // .pipe(takeUntil(this.ngUnsubscribe))
29086
- // .subscribe(result =>{
29087
- // const { added, removed } = result;
29088
- // if(added.length){
29089
- // const nodes = added.map(item =>({
29090
- // id: item.id,
29091
- // name: item.name,
29092
- // children: null,
29093
- // } as QMSTreeNode)).filter(item => !this.treeControl.dataNodes.find(x => item.id == x.id));
29094
- // this.resultSelected.push(...nodes);
29095
- // }
29096
- // if(removed.length){
29097
- // removed.forEach(item =>{
29098
- // const index = this.resultSelected.findIndex(x => x.id === item.id );
29099
- // if(index>=0){
29100
- // this.resultSelected.splice(index, 1);
29101
- // }
29102
- // })
29103
- // }
29104
- // });
29155
+ this.getLoading$.pipe(takeUntil(this.ngUnsubscribe))
29156
+ .subscribe(res => {
29157
+ res ? this.formSearchControl.disable() : this.formSearchControl.enable();
29158
+ });
29105
29159
  }
29106
29160
  set treeData(value) {
29107
29161
  this.treeDataSourceConfig.treeData = value || [];
@@ -29256,6 +29310,7 @@ class SelectDepartmentTreeComponent {
29256
29310
  this.checkListSelection.deselect(flatNode);
29257
29311
  flatNode && this._handleCheckNode(flatNode);
29258
29312
  this._checkStateCheckboxAllSearch();
29313
+ this.onValueChangeEvent.emit(this.resultSelected);
29259
29314
  }
29260
29315
  isIndeterminate(node) {
29261
29316
  const childSelected = this.getListChildrenOfNode(node).filter(item => this.checkListSelection.isSelected(item));
@@ -29407,7 +29462,8 @@ class SelectDepartmentTreeComponent {
29407
29462
  }
29408
29463
  onSearch() {
29409
29464
  if (this.formSearchControl.value) {
29410
- this.isSearching = true;
29465
+ this.getLoading$.next(true);
29466
+ this.setIndexView(1);
29411
29467
  this.onSearchEvent.emit(this.formSearchControl.value);
29412
29468
  return;
29413
29469
  }
@@ -29465,11 +29521,13 @@ class SelectDepartmentTreeComponent {
29465
29521
  };
29466
29522
  if (this.treeDataSourceConfig.includeChildren) {
29467
29523
  const mainGroup = this.pagingResultSearch.filter((item) => {
29468
- const node = this.treeControl.dataNodes.find(x => x.id === item.id);
29469
- const existItemGroup = this._getAllParentNode(node).filter(x => this.pagingResultSearch.some(x1 => x1.id === x.id));
29470
- return existItemGroup.length === 0;
29524
+ const mainGroup = this.pagingResultSearch.filter((item) => {
29525
+ const node = this.treeControl.dataNodes.find(x => x.id === item.id);
29526
+ const existItemGroup = this._getAllParentNode(node).filter(x => this.pagingResultSearch.some(x1 => x1.id === x.id));
29527
+ return existItemGroup.length === 0;
29528
+ });
29529
+ handle(mainGroup);
29471
29530
  });
29472
- handle(mainGroup);
29473
29531
  }
29474
29532
  else {
29475
29533
  handle(this.pagingResultSearch);
@@ -29491,7 +29549,6 @@ class SelectDepartmentTreeComponent {
29491
29549
  this.onPagingSearchEvent.emit(val);
29492
29550
  }
29493
29551
  scrollToNode(nodeId) {
29494
- // this.getActiveNodeEvent$.next(nodeId);
29495
29552
  this.scrollToNodeEvent$.next(nodeId);
29496
29553
  }
29497
29554
  setIndexView(index) {
@@ -29510,11 +29567,11 @@ class SelectDepartmentTreeComponent {
29510
29567
  SelectDepartmentTreeComponent.decorators = [
29511
29568
  { type: Component, args: [{
29512
29569
  selector: 'qms-select-department-tree',
29513
- template: "<div class=\"qms-select-department-tree-container\">\r\n <div class=\"input-select-department\">\r\n <form (ngSubmit)=\"!isSearching && onSearch()\" *ngIf=\"enableTreeSearch\" class=\"input-field\">\r\n <mat-form-field class=\"w100\" qms-form qms-search-field>\r\n <input [formControl]=\"formSearchControl\" type=\"text\" placeholder=\"Search\" matInput />\r\n <button *ngIf=\"!isSearching\" type=\"submit\" qms-btn-icon color=\"light\" matSuffix>\r\n <mat-icon>search</mat-icon>\r\n </button>\r\n <mat-progress-spinner\r\n [@inOutAnimation]\r\n matSuffix\r\n mode=\"indeterminate\"\r\n diameter=\"20\"\r\n *ngIf=\"isSearching\"\r\n ></mat-progress-spinner>\r\n <div *ngIf=\"!!formSearchControl.value && !isSearching\" qms-input-clear matSuffix>\r\n <button qms-btn-icon color=\"light\" [@inOutAnimation]\r\n aria-label=\"Clear\" (click)=\"formSearchControl.reset()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </div>\r\n </mat-form-field>\r\n </form>\r\n <div [@inOutAnimation] *ngIf=\"indexView === 1 && textResultSearch\" class=\"sub-text ms-1 fw500\">\r\n {{LANG.RESULT_SEARCH_FOR}}<i><b>\"{{textResultSearch}}\"</b></i>\r\n </div>\r\n <div [class.justify-content-between]=\"enableIncludeChild\" class=\"select__toggle-include toggle-include-child mt-1 d-flex justify-content-end align-items-center\">\r\n <mat-slide-toggle *ngIf=\"enableIncludeChild\" [disabled]=\"indexView === 1\"\r\n [(ngModel)]=\"treeDataSourceConfig.includeChildren\" (ngModelChange)=\"onSlideToggleChange()\" color=\"default\"\r\n qms-group-options>\r\n <span class=\"text-label\">{{treeDataSourceConfig.selectIncludeLabel || LANG.SELECT_INCLUDE_CHILD}}</span>\r\n </mat-slide-toggle>\r\n <button [@inOutAnimation] *ngIf=\"indexView === 1 && enableTreeSearch\" (click)=\"setIndexView(0)\" qms-btn-icon\r\n color=\"light\" [qms-tool-tip]=\"LANG.BACK_TO_TREE\" mode=\"dark\" position=\"top\">\r\n <mat-icon>arrow_back</mat-icon>\r\n </button>\r\n <button [@inOutAnimation] *ngIf=\"indexView === 0 && enableTreeSearch\" (click)=\"setIndexView(1)\" qms-btn-icon\r\n color=\"light\" [qms-tool-tip]=\"LANG.GOTO_SEACH_RESULT\" mode=\"dark\" position=\"top\">\r\n <mat-icon>arrow_forward</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <div [@animateSlideView]=\"indexView\" class=\"tree-department-wrapper\">\r\n <mat-tree *ngIf=\"indexView === 0\" class=\"select-department-tree\" [dataSource]=\"dataSource\"\r\n [treeControl]=\"treeControl\">\r\n <!-- This is the tree node template for leaf nodes -->\r\n <mat-tree-node [@triggerColor]=\"activeNode == node.id\" *matTreeNodeDef=\"let node\" matTreeNodeToggle\r\n matTreeNodePadding [ngClass]=\"{\r\n 'mat-tree-node-disabled-all': node.disabled\r\n }\">\r\n <button class=\"btn-toggle\" qms-btn-icon color=\"light\" disabled></button>\r\n <ng-container [ngTemplateOutlet]=\"showCheckboxTemplate\" [ngTemplateOutletContext]=\"{ node: node }\">\r\n </ng-container>\r\n </mat-tree-node>\r\n <!-- This is the tree node template for expandable nodes -->\r\n <mat-tree-node [@triggerColor]=\"activeNode == node.id\" *matTreeNodeDef=\"let node; when: hasChild\"\r\n matTreeNodePadding [ngClass]=\"{\r\n 'expand-node': treeControl.isExpanded(node),\r\n 'collapse-node': !treeControl.isExpanded(node),\r\n 'mat-tree-node-disabled': node.disabled\r\n }\">\r\n <div class=\"node-content-wraper\">\r\n <button class=\"btn-toggle\" qms-btn-icon color=\"light\" (click)=\"onExpandNode(node)\" matTreeNodeToggle>\r\n <mat-icon>\r\n {{ treeControl.isExpanded(node) ? \"expand_more\" : \"chevron_right\" }}\r\n </mat-icon>\r\n </button>\r\n <ng-container [ngTemplateOutlet]=\"showCheckboxTemplate\r\n \" [ngTemplateOutletContext]=\"{ node: node }\"></ng-container>\r\n <mat-progress-bar *ngIf=\"false\" mode=\"indeterminate\" class=\"example-tree-progress-bar\">\r\n </mat-progress-bar>\r\n </div>\r\n </mat-tree-node>\r\n </mat-tree>\r\n <div *ngIf=\"indexView === 1\" class=\"qms-view-search-result\">\r\n <div class=\"\">\r\n <mat-checkbox *ngIf=\"!!resultSearch.length\" [disabled]=\"!resultSearch.length || isSelectOne || isDisableChecboxAllSearch()\" #checkAllSearch [indeterminate]=\"indeterminateSearchResult\"\r\n [checked]=\"isSelectAllResultSearch\" qms-group-options color=\"default\" label=\"none\"\r\n class=\"checkbox-all\"\r\n (click)=\"!isSelectOne && onSelectAllSearchResult(checkAllSearch.checked)\">\r\n <span class=\"text-label header-title\">{{LANG.CHOOSE_ALL}}</span>\r\n <span>(<b>{{pagingResultSearch.length}}</b>)</span>\r\n </mat-checkbox>\r\n </div>\r\n <div [@inOutAnimation] *ngIf=\"pagingResultSearch.length\" [class.active-paging]=\"resultSearch.length > 10 && enablePagingSearch\" class=\"result\">\r\n <div *ngFor=\"let item of pagingResultSearch\"\r\n (click)=\"$event.stopPropagation();onClickResultItem(item)\"\r\n [class.active]=\"checkListSelectionSearch.isSelected(item)\" class=\"result-item user-select-none\" matRipple>\r\n <mat-checkbox [disabled]=\"item.disabled\" (click)=\"$event.stopImmediatePropagation(); !item.disabled && onCheckItemSearchResult(item)\"\r\n [checked]=\"checkListSelectionSearch.isSelected(item)\" qms-group-options color=\"default\" label=\"none\">\r\n </mat-checkbox>\r\n <div class=\"item-result-content-wraper\">\r\n <div class=\"text-gray fw-bold fs-base mb0\">{{item.name}}</div>\r\n <qms-breadcrumb [numDisplayItem]=\"6\" (onItemClick)=\"onBreadCrumbItemClick($event)\" *ngIf=\"item.path.length > 1\"\r\n class=\"breadcrumb-container\" [nodes]=\"item.path\">\r\n </qms-breadcrumb>\r\n\r\n <div *ngIf=\"item.path.length === 1\" class=\"d-flex align-items-center\">\r\n <!-- <mat-icon class=\"me-1\">arrow_right</mat-icon> -->\r\n <span class=\"item-breadcrumb-disable\">{{item.path[0].name}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div [@inOutAnimation] *ngIf=\"!pagingResultSearch.length\" class=\"result no-result\">\r\n <ng-container *ngTemplateOutlet=\"noResult\"></ng-container>\r\n </div>\r\n <mat-divider *ngIf=\"resultSearch.length > 10 && enablePagingSearch\" class=\"mx-auto\"></mat-divider>\r\n <qms-paginator *ngIf=\"resultSearch.length > 10 && enablePagingSearch\" [length]=\"resultSearch.length\"\r\n [numHidden]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 100]\" (page)='onPagingSearchResult($event)'\r\n [size]='PAGINATION_SIZE.medium'>\r\n </qms-paginator>\r\n </div>\r\n </div>\r\n\r\n <!-- Template for Checkbox -->\r\n <ng-template #showCheckboxTemplate let-node=\"node\">\r\n <mat-checkbox [id]=\"'node-'+node.id\" qms-group-options color=\"default\" label=\"none\" class=\"flex-direction-row\"\r\n [checked]=\"checkListSelection.isSelected(node)\" (click)=\"onCheckNode(node)\" [attr.disabled]=\"node.disabled\">\r\n <img *ngIf=\"node.itemIconSvg\" class=\"material-icons type-icon\" [src]=\"node.itemIconSvg\" />\r\n <span *ngIf=\"node.itemIcon\" [class]=\"node.itemIcon\" [qmsTransformIcon]=\"node.itemIcon\"\r\n class=\"material-icons-outlined type-icon\"></span>\r\n <span *ngIf=\"node.itemMatIcon\" class=\"material-icons-outlined type-icon\">{{\r\n node.itemMatIcon }}\r\n </span>\r\n <span class=\"text-name cursor-pointer ml5 123\" [ngClass]=\"{ disabled: node.disabled }\">{{ node.name\r\n }}\r\n </span>\r\n </mat-checkbox>\r\n </ng-template>\r\n</div>\r\n<ng-template #noResult>\r\n <svg width=\"89\" height=\"88\" viewBox=\"0 0 89 88\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"0.5\" width=\"88\" height=\"88\" rx=\"44\" fill=\"white\"/>\r\n <rect x=\"0.5\" width=\"88\" height=\"88\" rx=\"44\" fill=\"#0163B2\" fill-opacity=\"0.12\"/>\r\n <path d=\"M44.5 56.6936L58.096 64.8996L54.488 49.4336L66.5 39.0276L50.682 37.6856L44.5 23.0996L38.318 37.6856L22.5 39.0276L34.512 49.4336L30.904 64.8996L44.5 56.6936Z\" fill=\"#0163B3\"/>\r\n </svg>\r\n</ng-template>\r\n",
29570
+ template: "<div class=\"qms-select-department-tree-container\">\r\n <div class=\"input-select-department\">\r\n <form (ngSubmit)=\"!getLoading$.value && onSearch()\" *ngIf=\"enableTreeSearch\" class=\"input-field\">\r\n <mat-form-field class=\"w100\" qms-form qms-search-field>\r\n <input [formControl]=\"formSearchControl\" type=\"text\" placeholder=\"Search\" matInput />\r\n <button *ngIf=\"!getLoading$.value\" type=\"submit\" qms-btn-icon color=\"light\" matSuffix>\r\n <mat-icon>search</mat-icon>\r\n </button>\r\n <mat-progress-spinner [@inOutAnimation] matSuffix mode=\"indeterminate\" diameter=\"20\"\r\n *ngIf=\"getLoading$.value\"></mat-progress-spinner>\r\n <div *ngIf=\"!!formSearchControl.value && !getLoading$.value\" qms-input-clear matSuffix>\r\n <button qms-btn-icon color=\"light\" [@inOutAnimation] aria-label=\"Clear\" (click)=\"formSearchControl.reset()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </div>\r\n </mat-form-field>\r\n </form>\r\n <div [@inOutAnimation] *ngIf=\"indexView === 1 && textResultSearch\" class=\"sub-text ms-1 fw500\">\r\n {{LANG.RESULT_SEARCH_FOR}}<i><b>\"{{textResultSearch}}\"</b></i>\r\n </div>\r\n <div [class.justify-content-between]=\"enableIncludeChild && !isSelectOne\"\r\n class=\"select__toggle-include toggle-include-child mt-1 d-flex justify-content-end align-items-center\">\r\n <mat-slide-toggle *ngIf=\"enableIncludeChild && !isSelectOne\" [disabled]=\"indexView === 1\"\r\n [(ngModel)]=\"treeDataSourceConfig.includeChildren\" (ngModelChange)=\"onSlideToggleChange()\" color=\"default\"\r\n qms-group-options>\r\n <span class=\"text-label\">{{treeDataSourceConfig.selectIncludeLabel || LANG.SELECT_INCLUDE_CHILD}}</span>\r\n </mat-slide-toggle>\r\n <button class=\"btn-arrow\" [@inOutAnimation] *ngIf=\"indexView === 1 && enableTreeSearch\" (click)=\"setIndexView(0)\"\r\n qms-btn-icon color=\"light\" [qms-tool-tip]=\"LANG.BACK_TO_TREE\" mode=\"dark\" position=\"top\">\r\n <mat-icon>arrow_back</mat-icon>\r\n </button>\r\n <button class=\"btn-arrow\" [@inOutAnimation] *ngIf=\"indexView === 0 && enableTreeSearch && textResultSearch\"\r\n (click)=\"setIndexView(1)\" qms-btn-icon color=\"light\" [qms-tool-tip]=\"LANG.GOTO_SEACH_RESULT\" mode=\"dark\"\r\n position=\"top\">\r\n <mat-icon>arrow_forward</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <div [@animateSlideView]=\"indexView\" class=\"tree-department-wrapper\">\r\n <mat-tree [@listAnimation] *ngIf=\"indexView === 0\" class=\"select-department-tree\" [dataSource]=\"dataSource\"\r\n [treeControl]=\"treeControl\">\r\n <!-- This is the tree node template for leaf nodes -->\r\n <mat-tree-node\r\n [ngClass]=\"{'w-100': isSelectOne, 'selected-theme': this.checkListSelection.isSelected(node) && isSelectOne}\"\r\n [@triggerColor]=\"activeNode == node.id\" *matTreeNodeDef=\"let node\" matTreeNodeToggle matTreeNodePadding\r\n [ngClass]=\"{\r\n 'mat-tree-node-disabled-all': node.disabled\r\n }\">\r\n <button class=\"btn-toggle\" qms-btn-icon color=\"light\" disabled></button>\r\n <ng-container [ngTemplateOutlet]=\"isSelectOne ? nodeWithoutCheckboxTemplate : showCheckboxTemplate\"\r\n [ngTemplateOutletContext]=\"{ node: node }\">\r\n </ng-container>\r\n </mat-tree-node>\r\n <!-- This is the tree node template for expandable nodes -->\r\n <mat-tree-node [@triggerColor]=\"activeNode == node.id\" *matTreeNodeDef=\"let node; when: hasChild\"\r\n [class.selected-theme]=\"this.checkListSelection.isSelected(node) && isSelectOne\" matTreeNodePadding [ngClass]=\"{\r\n 'expand-node': treeControl.isExpanded(node),\r\n 'collapse-node': !treeControl.isExpanded(node),\r\n 'mat-tree-node-disabled': node.disabled\r\n }\">\r\n <div class=\"node-content-wraper\" [ngClass]=\"{'w-100': isSelectOne}\">\r\n <button class=\"btn-toggle\" qms-btn-icon color=\"light\" (click)=\"onExpandNode(node)\" matTreeNodeToggle>\r\n <mat-icon>\r\n {{ treeControl.isExpanded(node) ? \"expand_more\" : \"chevron_right\" }}\r\n </mat-icon>\r\n </button>\r\n <ng-container [ngTemplateOutlet]=\"isSelectOne ? nodeWithoutCheckboxTemplate : showCheckboxTemplate\"\r\n [ngTemplateOutletContext]=\"{ node: node }\"></ng-container>\r\n <mat-progress-bar *ngIf=\"false\" mode=\"indeterminate\" class=\"example-tree-progress-bar\">\r\n </mat-progress-bar>\r\n </div>\r\n </mat-tree-node>\r\n </mat-tree>\r\n <div *ngIf=\"indexView === 1\" class=\"qms-view-search-result\">\r\n <div class=\"\">\r\n <mat-checkbox [@inOutAnimation] *ngIf=\"!!resultSearch.length && !getLoading$.value\"\r\n [disabled]=\"!resultSearch.length || isSelectOne || isDisableChecboxAllSearch()\" #checkAllSearch\r\n [indeterminate]=\"indeterminateSearchResult\" [checked]=\"isSelectAllResultSearch\" qms-group-options\r\n color=\"default\" label=\"none\" class=\"checkbox-all\"\r\n (click)=\"!isSelectOne && onSelectAllSearchResult(checkAllSearch.checked)\">\r\n <span class=\"text-label header-title\">{{LANG.CHOOSE_ALL}}</span>\r\n <span>(<b>{{pagingResultSearch.length}}</b>)</span>\r\n </mat-checkbox>\r\n </div>\r\n <ng-container *ngIf=\"getLoading$.value; then loading\"></ng-container>\r\n <div [@inOutAnimation] *ngIf=\"pagingResultSearch.length && !getLoading$.value\"\r\n [class.active-paging]=\"resultSearch.length > 10 && enablePagingSearch\" class=\"result\">\r\n <div *ngFor=\"let item of pagingResultSearch\" (click)=\"$event.stopPropagation();onClickResultItem(item)\"\r\n [class.active]=\"checkListSelectionSearch.isSelected(item)\" class=\"result-item user-select-none\" matRipple>\r\n <mat-checkbox [disabled]=\"item.disabled\"\r\n (click)=\"$event.stopImmediatePropagation(); !item.disabled && onCheckItemSearchResult(item)\"\r\n [checked]=\"checkListSelectionSearch.isSelected(item)\" qms-group-options color=\"default\" label=\"none\">\r\n </mat-checkbox>\r\n <div class=\"item-result-content-wraper\">\r\n <div class=\"text-gray fw-bold fs-base mb0\">{{item.name}}</div>\r\n <qms-breadcrumb [numDisplayItem]=\"6\" (onItemClick)=\"onBreadCrumbItemClick($event)\"\r\n *ngIf=\"item.path.length > 1\" class=\"breadcrumb-container\" [nodes]=\"item.path\">\r\n </qms-breadcrumb>\r\n\r\n <div *ngIf=\"item.path.length === 1\" class=\"d-flex align-items-center\">\r\n <!-- <mat-icon class=\"me-1\">arrow_right</mat-icon> -->\r\n <span class=\"item-breadcrumb-disable\">{{item.path[0].name}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div [@inOutAnimation] *ngIf=\"!pagingResultSearch.length && !getLoading$.value\" class=\"result no-result\">\r\n <ng-container *ngTemplateOutlet=\"noResult\"></ng-container>\r\n </div>\r\n <mat-divider *ngIf=\"resultSearch.length > 10 && enablePagingSearch\" class=\"mx-auto\"></mat-divider>\r\n <qms-paginator *ngIf=\"resultSearch.length > 10 && enablePagingSearch && !getLoading$.value\"\r\n [length]=\"resultSearch.length\" [numHidden]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 100]\"\r\n (page)='onPagingSearchResult($event)' [size]='PAGINATION_SIZE.medium'>\r\n </qms-paginator>\r\n </div>\r\n </div>\r\n\r\n <!-- Template for Checkbox -->\r\n <ng-template #showCheckboxTemplate let-node=\"node\">\r\n <mat-checkbox [id]=\"'node-'+node.id\" qms-group-options color=\"default\" label=\"none\" class=\"flex-direction-row\"\r\n [checked]=\"checkListSelection.isSelected(node)\" (click)=\"onCheckNode(node)\" [attr.disabled]=\"node.disabled\">\r\n <img *ngIf=\"node.itemIconSvg\" class=\"material-icons type-icon\" [src]=\"node.itemIconSvg\" />\r\n <span *ngIf=\"node.itemIcon\" [class]=\"node.itemIcon\" [qmsTransformIcon]=\"node.itemIcon\"\r\n class=\"material-icons-outlined type-icon\"></span>\r\n <span *ngIf=\"node.itemMatIcon\" class=\"material-icons-outlined type-icon\">{{\r\n node.itemMatIcon }}\r\n </span>\r\n <span class=\"text-name cursor-pointer ml5 123\" [ngClass]=\"{ disabled: node.disabled }\">{{ node.name\r\n }}\r\n </span>\r\n </mat-checkbox>\r\n </ng-template>\r\n\r\n <ng-template #nodeWithoutCheckboxTemplate let-node=\"node\">\r\n <div [id]=\"'node-'+node.id\" (click)=\"onCheckNode(node)\" class=\"node-without-checkbox\">\r\n <div class=\"node-info\">\r\n <span *ngIf=\"node.itemIcon\" [class]=\"node.itemIcon\" [qmsTransformIcon]=\"node.itemIcon\"\r\n class=\"material-icons-outlined type-icon\"></span>\r\n <span *ngIf=\"node.itemMatIcon\" class=\"material-icons-outlined type-icon\">{{\r\n node.itemMatIcon }}\r\n </span>\r\n <span class=\"text-name cursor-pointer ml5 123\" [ngClass]=\"{ disabled: node.disabled }\">{{ node.name\r\n }}\r\n </span>\r\n </div>\r\n <div class=\"node-state\">\r\n <mat-icon *ngIf=\"checkListSelection.isSelected(node)\">check</mat-icon>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</div>\r\n\r\n<ng-template #noResult>\r\n <svg width=\"89\" height=\"88\" viewBox=\"0 0 89 88\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"0.5\" width=\"88\" height=\"88\" rx=\"44\" fill=\"white\" />\r\n <rect x=\"0.5\" width=\"88\" height=\"88\" rx=\"44\" fill=\"#0163B2\" fill-opacity=\"0.12\" />\r\n <path\r\n d=\"M44.5 56.6936L58.096 64.8996L54.488 49.4336L66.5 39.0276L50.682 37.6856L44.5 23.0996L38.318 37.6856L22.5 39.0276L34.512 49.4336L30.904 64.8996L44.5 56.6936Z\"\r\n fill=\"#0163B3\" />\r\n </svg>\r\n</ng-template>\r\n\r\n<!-- Template loading -->\r\n<ng-template #loading>\r\n <div class=\"loading-container\">\r\n <div class=\"loader\" *ngFor=\"let item of [1,1,1,1,1,1]\">\r\n <div class=\"loader__wrapper\">\r\n <div class=\"row-loader\">\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-template>\r\n",
29514
29571
  animations: [
29515
29572
  AnimationTreeDepartment
29516
29573
  ],
29517
- styles: ["@charset \"UTF-8\";@font-face{font-family:icomoon;src:url(../assets/fonts/icomoon.eot?aghldx);src:url(../assets/fonts/icomoon.eot?aghldx#iefix) format(\"embedded-opentype\"),url(../assets/fonts/icomoon.ttf?aghldx) format(\"truetype\"),url(../assets/fonts/icomoon.woff?aghldx) format(\"woff\"),url(../assets/fonts/icomoon.svg?aghldx#icomoon) format(\"svg\");font-weight:400;font-style:normal;font-display:block}[class^=icon-]{font-family:icomoon!important;speak:never;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-acutely-toxic .path1:before{content:\"\uE91B\";color:#e32730}.icon-acutely-toxic .path2:before{content:\"\uE922\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path3:before{content:\"\uE923\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path4:before{content:\"\uE924\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path5:before{content:\"\uE925\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path6:before{content:\"\uE926\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path7:before{content:\"\uE927\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path8:before{content:\"\uE928\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path9:before{content:\"\uE929\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path10:before{content:\"\uE92A\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path11:before{content:\"\uE92B\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path12:before{content:\"\uE92C\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path13:before{content:\"\uE92D\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path14:before{content:\"\uE92E\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path15:before{content:\"\uE92F\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path16:before{content:\"\uE930\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path17:before{content:\"\uE931\";margin-left:-1em;color:#323232}.icon-add-column:before{content:\"\uE932\"}.icon-add-tooltip:before{content:\"\uE933\"}.icon-admin:before{content:\"\uE934\"}.icon-annual-cycle:before{content:\"\uE935\"}.icon-assignment-repete:before{content:\"\uE936\"}.icon-barrier-add:before{content:\"\uE937\"}.icon-barrier-edit:before{content:\"\uE938\"}.icon-barrier-view:before{content:\"\uE939\"}.icon-button-group:before{content:\"\uE93A\"}.icon-chemical-manager:before{content:\"\uE93B\"}.icon-chronic-health-hazard .path1:before{content:\"\uE93C\";color:#e32730}.icon-chronic-health-hazard .path2:before{content:\"\uE93D\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path3:before{content:\"\uE93E\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path4:before{content:\"\uE93F\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path5:before{content:\"\uE940\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path6:before{content:\"\uE941\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path7:before{content:\"\uE942\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path8:before{content:\"\uE943\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path9:before{content:\"\uE944\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path10:before{content:\"\uE945\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path11:before{content:\"\uE946\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path12:before{content:\"\uE947\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path13:before{content:\"\uE948\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path14:before{content:\"\uE949\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path15:before{content:\"\uE94A\";margin-left:-1em;color:#323232}.icon-contingency:before{content:\"\uE94B\"}.icon-corrosive .path1:before{content:\"\uE94C\";color:#323232}.icon-corrosive .path2:before{content:\"\uE94D\";margin-left:-1em;color:#323232}.icon-corrosive .path3:before{content:\"\uE94E\";margin-left:-1em;color:#323232}.icon-corrosive .path4:before{content:\"\uE94F\";margin-left:-1em;color:#323232}.icon-corrosive .path5:before{content:\"\uE950\";margin-left:-1em;color:#323232}.icon-corrosive .path6:before{content:\"\uE951\";margin-left:-1em;color:#323232}.icon-corrosive .path7:before{content:\"\uE952\";margin-left:-1em;color:#323232}.icon-corrosive .path8:before{content:\"\uE953\";margin-left:-1em;color:#323232}.icon-corrosive .path9:before{content:\"\uE954\";margin-left:-1em;color:#323232}.icon-corrosive .path10:before{content:\"\uE955\";margin-left:-1em;color:#323232}.icon-corrosive .path11:before{content:\"\uE956\";margin-left:-1em;color:#323232}.icon-corrosive .path12:before{content:\"\uE957\";margin-left:-1em;color:#323232}.icon-corrosive .path13:before{content:\"\uE958\";margin-left:-1em;color:#323232}.icon-corrosive .path14:before{content:\"\uE959\";margin-left:-1em;color:#323232}.icon-corrosive .path15:before{content:\"\uE95A\";margin-left:-1em;color:#323232}.icon-corrosive .path16:before{content:\"\uE95B\";margin-left:-1em;color:#323232}.icon-corrosive .path17:before{content:\"\uE95C\";margin-left:-1em;color:#323232}.icon-corrosive .path18:before{content:\"\uE95D\";margin-left:-1em;color:#323232}.icon-corrosive .path19:before{content:\"\uE95E\";margin-left:-1em;color:#323232}.icon-corrosive .path20:before{content:\"\uE95F\";margin-left:-1em;color:#323232}.icon-corrosive .path21:before{content:\"\uE960\";margin-left:-1em;color:#e32730}.icon-dashboard:before{content:\"\uE961\"}.icon-database-sds:before{content:\"\uE962\"}.icon-description-add:before{content:\"\uE963\"}.icon-description-edit:before{content:\"\uE964\"}.icon-description-view:before{content:\"\uE965\";color:#666}.icon-document-read .path1:before{content:\"\uE966\";color:#000;opacity:.6}.icon-document-read .path2:before{content:\"\uE967\";margin-left:-1em;color:#fff}.icon-document-read .path3:before{content:\"\uE968\";margin-left:-1em;color:#000;opacity:.6}.icon-draft:before{content:\"\uE969\"}.icon-expired-off:before{content:\"\uE96A\"}.icon-expired-on:before{content:\"\uE96B\"}.icon-explosive .path1:before{content:\"\uE96C\";color:#e32730}.icon-explosive .path2:before{content:\"\uE96D\";margin-left:-1em;color:#323232}.icon-explosive .path3:before{content:\"\uE96E\";margin-left:-1em;color:#323232}.icon-explosive .path4:before{content:\"\uE96F\";margin-left:-1em;color:#323232}.icon-explosive .path5:before{content:\"\uE970\";margin-left:-1em;color:#323232}.icon-explosive .path6:before{content:\"\uE971\";margin-left:-1em;color:#323232}.icon-explosive .path7:before{content:\"\uE972\";margin-left:-1em;color:#323232}.icon-explosive .path8:before{content:\"\uE973\";margin-left:-1em;color:#323232}.icon-explosive .path9:before{content:\"\uE974\";margin-left:-1em;color:#323232}.icon-explosive .path10:before{content:\"\uE975\";margin-left:-1em;color:#323232}.icon-explosive .path11:before{content:\"\uE976\";margin-left:-1em;color:#323232}.icon-explosive .path12:before{content:\"\uE977\";margin-left:-1em;color:#323232}.icon-explosive .path13:before{content:\"\uE978\";margin-left:-1em;color:#323232}.icon-explosive .path14:before{content:\"\uE979\";margin-left:-1em;color:#323232}.icon-explosive .path15:before{content:\"\uE97A\";margin-left:-1em;color:#323232}.icon-explosive .path16:before{content:\"\uE97B\";margin-left:-1em;color:#323232}.icon-explosive .path17:before{content:\"\uE97C\";margin-left:-1em;color:#323232}.icon-explosive .path18:before{content:\"\uE97D\";margin-left:-1em;color:#323232}.icon-explosive .path19:before{content:\"\uE97E\";margin-left:-1em;color:#323232}.icon-explosive .path20:before{content:\"\uE97F\";margin-left:-1em;color:#323232}.icon-explosive .path21:before{content:\"\uE980\";margin-left:-1em;color:#323232}.icon-explosive .path22:before{content:\"\uE981\";margin-left:-1em;color:#323232}.icon-explosive .path23:before{content:\"\uE982\";margin-left:-1em;color:#323232}.icon-explosive .path24:before{content:\"\uE983\";margin-left:-1em;color:#323232}.icon-explosive .path25:before{content:\"\uE984\";margin-left:-1em;color:#323232}.icon-explosive .path26:before{content:\"\uE985\";margin-left:-1em;color:#323232}.icon-explosive .path27:before{content:\"\uE986\";margin-left:-1em;color:#323232}.icon-explosive .path28:before{content:\"\uE987\";margin-left:-1em;color:#323232}.icon-explosive .path29:before{content:\"\uE988\";margin-left:-1em;color:#323232}.icon-explosive .path30:before{content:\"\uE989\";margin-left:-1em;color:#323232}.icon-explosive .path31:before{content:\"\uE98A\";margin-left:-1em;color:#323232}.icon-explosive .path32:before{content:\"\uE98B\";margin-left:-1em;color:#323232}.icon-explosive .path33:before{content:\"\uE98C\";margin-left:-1em;color:#323232}.icon-explosive .path34:before{content:\"\uE98D\";margin-left:-1em;color:#323232}.icon-explosive .path35:before{content:\"\uE98E\";margin-left:-1em;color:#323232}.icon-explosive .path36:before{content:\"\uE98F\";margin-left:-1em;color:#323232}.icon-explosive .path37:before{content:\"\uE990\";margin-left:-1em;color:#323232}.icon-explosive .path38:before{content:\"\uE991\";margin-left:-1em;color:#323232}.icon-explosive .path39:before{content:\"\uE992\";margin-left:-1em;color:#323232}.icon-explosive .path40:before{content:\"\uE993\";margin-left:-1em;color:#323232}.icon-explosive .path41:before{content:\"\uE994\";margin-left:-1em;color:#323232}.icon-explosive .path42:before{content:\"\uE995\";margin-left:-1em;color:#323232}.icon-explosive .path43:before{content:\"\uE996\";margin-left:-1em;color:#323232}.icon-explosive .path44:before{content:\"\uE997\";margin-left:-1em;color:#323232}.icon-explosive .path45:before{content:\"\uE998\";margin-left:-1em;color:#323232}.icon-explosive .path46:before{content:\"\uE999\";margin-left:-1em;color:#323232}.icon-file-excel:before{content:\"\uE99A\"}.icon-file-pdf:before{content:\"\uE99B\"}.icon-file-pdf-verified .path1:before{content:\"\uE99C\";color:#000;opacity:.6}.icon-file-pdf-verified .path2:before{content:\"\uE99D\";margin-left:-1em;color:#fff}.icon-file-pdf-verified .path3:before{content:\"\uE99E\";margin-left:-1em;color:#000;opacity:.6}.icon-file-word:before{content:\"\uE99F\"}.icon-filter-alt:before{content:\"\uE9A0\"}.icon-flammable .path1:before{content:\"\uE9A1\";color:#323232}.icon-flammable .path2:before{content:\"\uE9A2\";margin-left:-1em;color:#323232}.icon-flammable .path3:before{content:\"\uE9A3\";margin-left:-1em;color:#e32730}.icon-gas-under-pressure .path1:before{content:\"\uE9A4\";color:#323232}.icon-gas-under-pressure .path2:before{content:\"\uE9A5\";margin-left:-1em;color:#e32730}.icon-health-hazard .path1:before{content:\"\uE9A6\";color:#323232}.icon-health-hazard .path2:before{content:\"\uE9A7\";margin-left:-1em;color:#e32730}.icon-line-break:before{content:\"\uE9A8\"}.icon-location:before{content:\"\uE9A9\"}.icon-measure-add:before{content:\"\uE9AA\"}.icon-measure-edit:before{content:\"\uE9AB\"}.icon-measure-view:before{content:\"\uE9AC\";color:#666}.icon-messages:before{content:\"\uE9AD\"}.icon-monitoring:before{content:\"\uE9AE\";color:#666}.icon-move:before{content:\"\uE9AF\"}.icon-oxidizing .path1:before{content:\"\uE9B0\";color:#e32730}.icon-oxidizing .path2:before{content:\"\uE9B1\";margin-left:-1em;color:#323232}.icon-oxidizing .path3:before{content:\"\uE9B2\";margin-left:-1em;color:#323232}.icon-oxidizing .path4:before{content:\"\uE9B3\";margin-left:-1em;color:#323232}.icon-process-area-closed:before{content:\"\uE9B4\"}.icon-process-area-open:before{content:\"\uE9B5\"}.icon-process-linked .path1:before{content:\"\uE9B6\";color:#000;opacity:.6}.icon-process-linked .path2:before{content:\"\uE9B7\";margin-left:-1em;color:#666}.icon-risk:before{content:\"\uE9B8\"}.icon-search-in-file:before{content:\"\uE9B9\"}.icon-sort-ascending:before{content:\"\uE9BA\"}.icon-sort-descending:before{content:\"\uE9BB\"}.icon-subscript:before{content:\"\uE9BC\"}.icon-superscript:before{content:\"\uE9BD\"}.icon-syncronice-favorites:before{content:\"\uE9BE\"}.icon-system-settings:before{content:\"\uE9BF\"}.icon-view-three-outlined:before{content:\"\uE9C0\"}.icon-workplace-safety:before{content:\"\uE9C1\"}.icon-checklist:before{content:\"\uE900\"}.icon-department-document .path1:before{content:\"\uE901\";color:#000;opacity:.6}.icon-department-document .path2:before{content:\"\uE902\";margin-left:-1em;color:#00804c}.icon-department-folder-closed .path1:before{content:\"\uE903\";color:#000;opacity:.6}.icon-department-folder-closed .path2:before{content:\"\uE904\";margin-left:-1em;color:#00804c}.icon-department-folder-open .path1:before{content:\"\uE905\";color:#000;opacity:.6}.icon-department-folder-open .path2:before{content:\"\uE906\";margin-left:-1em;color:#00804c}.icon-deviation:before{content:\"\uE907\"}.icon-dropdown-folder .path1:before{content:\"\uE908\";color:#00324e}.icon-dropdown-folder .path2:before{content:\"\uE909\";margin-left:-1em;color:#fff;opacity:.6}.icon-enterprise-document .path1:before{content:\"\uE90A\";color:#000;opacity:.6}.icon-enterprise-document .path2:before{content:\"\uE90B\";margin-left:-1em;color:#cf4714}.icon-enterprise-folder-closed .path1:before{content:\"\uE90C\";color:#000;opacity:.6}.icon-enterprise-folder-closed .path2:before{content:\"\uE90D\";margin-left:-1em;color:#cf4714}.icon-enterprise-folder-open .path1:before{content:\"\uE90E\";color:#000;opacity:.6}.icon-enterprise-folder-open .path2:before{content:\"\uE90F\";margin-left:-1em;color:#cf4714}.icon-folder-closed:before{content:\"\uE910\"}.icon-folder-open:before{content:\"\uE911\"}.icon-keyboard_arrow_down:before{content:\"\uE912\"}.icon-keyboard_arrow_up:before{content:\"\uE913\"}.icon-local-document .path1:before{content:\"\uE914\";color:#000;opacity:.6}.icon-local-document .path2:before{content:\"\uE915\";margin-left:-1em;color:#1954a9}.icon-local-folder-closed .path1:before{content:\"\uE916\";color:#000;opacity:.6}.icon-local-folder-closed .path2:before{content:\"\uE917\";margin-left:-1em;color:#1954a9}.icon-local-folder-open .path1:before{content:\"\uE918\";color:#000;opacity:.6}.icon-local-folder-open .path2:before{content:\"\uE919\";margin-left:-1em;color:#1954a9}.icon-process:before{content:\"\uE91A\"}.icon-regional-document .path1:before{content:\"\uE91C\";color:#000;opacity:.6}.icon-regional-document .path2:before{content:\"\uE91D\";margin-left:-1em;color:#662e0d}.icon-regional-folder-closed .path1:before{content:\"\uE91E\";color:#000;opacity:.6}.icon-regional-folder-closed .path2:before{content:\"\uE91F\";margin-left:-1em;color:#662e0d}.icon-regional-folder-open .path1:before{content:\"\uE920\";color:#000;opacity:.6}.icon-regional-folder-open .path2:before{content:\"\uE921\";margin-left:-1em;color:#662e0d}.qms-select-department-tree-container .mr10{margin-right:10px}.qms-select-department-tree-container .mt5{margin-bottom:5px}.qms-select-department-tree-container .mb5{margin-top:5px}.qms-select-department-tree-container .w100{width:100%}.qms-select-department-tree-container .fw500{font-weight:500!important}.qms-select-department-tree-container .text-right{text-align:right}.qms-select-department-tree-container .mt20{margin-top:20px}.qms-select-department-tree-container .text-selected{color:rgba(0,0,0,.6);font-size:12px;line-height:16px;margin-top:1rem}.qms-select-department-tree-container .input-field{display:flex;align-items:center;position:relative}.qms-select-department-tree-container .input-field input.input-search{width:100%;padding:10px;outline:none;border:none;background:var(--background-input-text)}.qms-select-department-tree-container .input-field .btn-search{cursor:pointer;vertical-align:middle;position:absolute;top:50%;right:10px;transform:translateY(-50%)}.qms-select-department-tree-container .input-field .line__divider{border-bottom:1px solid #ccc;height:1px;margin-top:10px;min-width:300px;max-width:100%}.qms-select-department-tree-container .tree-department-wrapper{height:375px;padding-right:4px;overflow-y:auto;overflow-x:hidden;position:relative}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node{border-radius:4px}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node:hover{background:rgba(0,0,0,.08)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node:active{background:rgba(0,0,0,.12)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active{color:var(--primary);background:var(--primary-light-6-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active:active{background:var(--primary-light-12-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active .mat-icon-rtl-mirror,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active .text-name,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active .type-icon,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active button,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node.active .mat-icon-rtl-mirror,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node.active .text-name,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node.active .type-icon,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node.active button{color:var(--primary)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node.active:hover{background:var(--primary-light-6-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node.active:active{background:var(--primary-light-12-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node .mat-icon-rtl-mirror,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node .text-name,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node .type-icon,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node button{color:var(--primary)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node:hover{background:var(--primary-light-6-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node:active{background:var(--primary-light-12-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .type-icon{margin-right:5px;color:var(--ws-action-active)}.qms-select-department-tree-container .mat-tree.select-department-tree .text-name{color:var(--default-color)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-icon-rtl-mirror{color:rgba(0,0,0,.6)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-icon-button.btn-toggle{width:35px;height:35px;line-height:35px}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all{cursor:default!important;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all .mat-icon-rtl-mirror,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all .type-icon,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all button.mat-button-disabled{color:rgba(0,0,0,.38)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all .text-name.disabled{color:rgba(0,0,0,.38);cursor:default!important;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all.active{background-color:transparent}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled .type-icon,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled button.mat-button-disabled{color:rgba(0,0,0,.38)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled .text-name.disabled{color:rgba(0,0,0,.38);cursor:default!important;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled.active,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled.expand-node:active,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled.expand-node:hover,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled:active,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled:hover{background-color:transparent}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node>.node-content-wraper{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;position:relative;display:flex;justify-content:center;align-items:center}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node>.node-content-wraper>.mat-progress-bar{height:3px;width:100%;position:absolute;bottom:0;left:10px}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node>.node-content-wraper>.mat-progress-bar .mat-progress-bar-fill:after{background:var(--primary)}.qms-select-department-tree-container .text-name{position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;cursor:pointer;width:100%}.qms-select-department-tree-container .cursor-pointer{cursor:pointer}.qms-select-department-tree-container .ml5{margin-left:10px!important}.qms-select-department-tree-container ::ng-deep .mat-checkbox.qms-group-options.flex-direction-row .mat-checkbox-layout{white-space:normal}.qms-select-department-tree-container ::ng-deep .mat-checkbox.qms-group-options.flex-direction-row .mat-checkbox-label{flex-direction:row;align-items:center;position:relative;padding-bottom:2px}.qms-select-department-tree-container .qms-view-search-result{height:375px;width:100%}.qms-select-department-tree-container .qms-view-search-result .result{max-height:calc(100% - 44px);overflow-y:auto;margin-bottom:4px;padding-right:4px}.qms-select-department-tree-container .qms-view-search-result .result.active-paging{max-height:calc(100% - 104px)}.qms-select-department-tree-container .qms-view-search-result .result.no-result{height:100%;display:flex;justify-content:center;align-items:center}.qms-select-department-tree-container .qms-view-search-result .result-item{border-radius:4px;display:grid;grid-template-columns:45px 1fr;align-items:center;cursor:pointer;transition:background .3s ease}.qms-select-department-tree-container .qms-view-search-result .result-item:not(:first-child){margin-top:4px!important}.qms-select-department-tree-container .qms-view-search-result .result-item.active,.qms-select-department-tree-container .qms-view-search-result .result-item:hover{background:linear-gradient(0deg,rgba(1,99,178,.12),rgba(1,99,178,.12)),#fff}.qms-select-department-tree-container .qms-view-search-result .result-item .item-result-content-wraper{padding:5px 15px}.qms-select-department-tree-container .qms-view-search-result ::ng-deep .mat-checkbox.qms-group-options{display:flex;height:100%}.qms-select-department-tree-container ::ng-deep .breadcrumb-container{flex-wrap:wrap}.qms-select-department-tree-container ::ng-deep .mat-button-focus-overlay{background-color:transparent}.qms-select-department-tree-container ::ng-deep .qms-breadcrumb-item{margin:0}.qms-select-department-tree-container ::ng-deep .qms-breadcrumb-item-text{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;transition:color .3s ease}.qms-select-department-tree-container ::ng-deep .qms-breadcrumb-item-text:not(:last-child){max-width:150px!important}.qms-select-department-tree-container ::ng-deep .qms-breadcrumb-item-text:not(:last-child):hover{color:var(--primary)}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-icon{display:flex;align-items:center;justify-content:center}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-form-field-wrapper{padding-bottom:0}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container{min-height:40px}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container .qms-total-result{margin-bottom:0;margin-right:12px;height:100%;display:flex;justify-content:center;align-items:center}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container .qms-total-result span{font-weight:600;font-size:13px;color:rgba(0,0,0,.8)}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container .qms-paginator-range-actions{margin-bottom:0;grid-column-gap:2px;-moz-column-gap:2px;column-gap:2px}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container .qms-paginator-range-actions>.qms-total-result{margin-bottom:0}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container .qms-paginator-range-actions>.qms-btn-icon{width:30px;height:30px;line-height:30px}.qms-select-department-tree-container ::ng-deep .qms-paginator>.qms-btn-icon-wrapper{width:30px;height:30px;display:flex;justify-content:center;align-items:center}.qms-select-department-tree-container ::ng-deep .qms-paginator .qms-paginator-page-size{margin-right:12px;height:100%;display:flex;align-items:center;justify-content:center}.qms-select-department-tree-container ::ng-deep .qms-paginator .qms-paginator-page-size>.qms-form-page-size .mat-form-field-flex{width:60px;height:30px;display:flex;align-items:center;padding:0 4px}.qms-select-department-tree-container ::ng-deep .qms-paginator .qms-paginator-page-size>.qms-form-page-size .mat-form-field-flex .mat-form-field-infix{height:30px}.qms-select-department-tree-container ::ng-deep .qms-paginator .qms-paginator-page-size>.qms-pagesize-label{display:none}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-form-field.qms-form .mat-select-min-line,.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-form-field.qms-form mat-select-trigger{font-size:14px}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-select-value{text-align:center}.qms-select-department-tree-container .text-gray{color:#242424}.qms-select-department-tree-container .mb0{margin-bottom:0!important}.qms-select-department-tree-container .fs-base{font-size:14px!important}.qms-select-department-tree-container .user-select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.qms-select-department-tree-container .item-breadcrumb-disable{cursor:not-allowed;color:rgba(0,0,0,.6);font-weight:400;font-size:14px}.qms-select-department-tree-container ::ng-deep .mat-checkbox.checkbox-all .mat-checkbox-label{flex-direction:row;align-items:center;grid-column-gap:4px;-moz-column-gap:4px;column-gap:4px}"]
29574
+ styles: ["@charset \"UTF-8\";@font-face{font-family:icomoon;src:url(../assets/fonts/icomoon.eot?aghldx);src:url(../assets/fonts/icomoon.eot?aghldx#iefix) format(\"embedded-opentype\"),url(../assets/fonts/icomoon.ttf?aghldx) format(\"truetype\"),url(../assets/fonts/icomoon.woff?aghldx) format(\"woff\"),url(../assets/fonts/icomoon.svg?aghldx#icomoon) format(\"svg\");font-weight:400;font-style:normal;font-display:block}[class^=icon-]{font-family:icomoon!important;speak:never;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-acutely-toxic .path1:before{content:\"\uE91B\";color:#e32730}.icon-acutely-toxic .path2:before{content:\"\uE922\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path3:before{content:\"\uE923\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path4:before{content:\"\uE924\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path5:before{content:\"\uE925\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path6:before{content:\"\uE926\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path7:before{content:\"\uE927\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path8:before{content:\"\uE928\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path9:before{content:\"\uE929\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path10:before{content:\"\uE92A\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path11:before{content:\"\uE92B\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path12:before{content:\"\uE92C\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path13:before{content:\"\uE92D\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path14:before{content:\"\uE92E\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path15:before{content:\"\uE92F\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path16:before{content:\"\uE930\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path17:before{content:\"\uE931\";margin-left:-1em;color:#323232}.icon-add-column:before{content:\"\uE932\"}.icon-add-tooltip:before{content:\"\uE933\"}.icon-admin:before{content:\"\uE934\"}.icon-annual-cycle:before{content:\"\uE935\"}.icon-assignment-repete:before{content:\"\uE936\"}.icon-barrier-add:before{content:\"\uE937\"}.icon-barrier-edit:before{content:\"\uE938\"}.icon-barrier-view:before{content:\"\uE939\"}.icon-button-group:before{content:\"\uE93A\"}.icon-chemical-manager:before{content:\"\uE93B\"}.icon-chronic-health-hazard .path1:before{content:\"\uE93C\";color:#e32730}.icon-chronic-health-hazard .path2:before{content:\"\uE93D\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path3:before{content:\"\uE93E\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path4:before{content:\"\uE93F\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path5:before{content:\"\uE940\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path6:before{content:\"\uE941\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path7:before{content:\"\uE942\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path8:before{content:\"\uE943\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path9:before{content:\"\uE944\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path10:before{content:\"\uE945\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path11:before{content:\"\uE946\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path12:before{content:\"\uE947\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path13:before{content:\"\uE948\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path14:before{content:\"\uE949\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path15:before{content:\"\uE94A\";margin-left:-1em;color:#323232}.icon-contingency:before{content:\"\uE94B\"}.icon-corrosive .path1:before{content:\"\uE94C\";color:#323232}.icon-corrosive .path2:before{content:\"\uE94D\";margin-left:-1em;color:#323232}.icon-corrosive .path3:before{content:\"\uE94E\";margin-left:-1em;color:#323232}.icon-corrosive .path4:before{content:\"\uE94F\";margin-left:-1em;color:#323232}.icon-corrosive .path5:before{content:\"\uE950\";margin-left:-1em;color:#323232}.icon-corrosive .path6:before{content:\"\uE951\";margin-left:-1em;color:#323232}.icon-corrosive .path7:before{content:\"\uE952\";margin-left:-1em;color:#323232}.icon-corrosive .path8:before{content:\"\uE953\";margin-left:-1em;color:#323232}.icon-corrosive .path9:before{content:\"\uE954\";margin-left:-1em;color:#323232}.icon-corrosive .path10:before{content:\"\uE955\";margin-left:-1em;color:#323232}.icon-corrosive .path11:before{content:\"\uE956\";margin-left:-1em;color:#323232}.icon-corrosive .path12:before{content:\"\uE957\";margin-left:-1em;color:#323232}.icon-corrosive .path13:before{content:\"\uE958\";margin-left:-1em;color:#323232}.icon-corrosive .path14:before{content:\"\uE959\";margin-left:-1em;color:#323232}.icon-corrosive .path15:before{content:\"\uE95A\";margin-left:-1em;color:#323232}.icon-corrosive .path16:before{content:\"\uE95B\";margin-left:-1em;color:#323232}.icon-corrosive .path17:before{content:\"\uE95C\";margin-left:-1em;color:#323232}.icon-corrosive .path18:before{content:\"\uE95D\";margin-left:-1em;color:#323232}.icon-corrosive .path19:before{content:\"\uE95E\";margin-left:-1em;color:#323232}.icon-corrosive .path20:before{content:\"\uE95F\";margin-left:-1em;color:#323232}.icon-corrosive .path21:before{content:\"\uE960\";margin-left:-1em;color:#e32730}.icon-dashboard:before{content:\"\uE961\"}.icon-database-sds:before{content:\"\uE962\"}.icon-description-add:before{content:\"\uE963\"}.icon-description-edit:before{content:\"\uE964\"}.icon-description-view:before{content:\"\uE965\";color:#666}.icon-document-read .path1:before{content:\"\uE966\";color:#000;opacity:.6}.icon-document-read .path2:before{content:\"\uE967\";margin-left:-1em;color:#fff}.icon-document-read .path3:before{content:\"\uE968\";margin-left:-1em;color:#000;opacity:.6}.icon-draft:before{content:\"\uE969\"}.icon-expired-off:before{content:\"\uE96A\"}.icon-expired-on:before{content:\"\uE96B\"}.icon-explosive .path1:before{content:\"\uE96C\";color:#e32730}.icon-explosive .path2:before{content:\"\uE96D\";margin-left:-1em;color:#323232}.icon-explosive .path3:before{content:\"\uE96E\";margin-left:-1em;color:#323232}.icon-explosive .path4:before{content:\"\uE96F\";margin-left:-1em;color:#323232}.icon-explosive .path5:before{content:\"\uE970\";margin-left:-1em;color:#323232}.icon-explosive .path6:before{content:\"\uE971\";margin-left:-1em;color:#323232}.icon-explosive .path7:before{content:\"\uE972\";margin-left:-1em;color:#323232}.icon-explosive .path8:before{content:\"\uE973\";margin-left:-1em;color:#323232}.icon-explosive .path9:before{content:\"\uE974\";margin-left:-1em;color:#323232}.icon-explosive .path10:before{content:\"\uE975\";margin-left:-1em;color:#323232}.icon-explosive .path11:before{content:\"\uE976\";margin-left:-1em;color:#323232}.icon-explosive .path12:before{content:\"\uE977\";margin-left:-1em;color:#323232}.icon-explosive .path13:before{content:\"\uE978\";margin-left:-1em;color:#323232}.icon-explosive .path14:before{content:\"\uE979\";margin-left:-1em;color:#323232}.icon-explosive .path15:before{content:\"\uE97A\";margin-left:-1em;color:#323232}.icon-explosive .path16:before{content:\"\uE97B\";margin-left:-1em;color:#323232}.icon-explosive .path17:before{content:\"\uE97C\";margin-left:-1em;color:#323232}.icon-explosive .path18:before{content:\"\uE97D\";margin-left:-1em;color:#323232}.icon-explosive .path19:before{content:\"\uE97E\";margin-left:-1em;color:#323232}.icon-explosive .path20:before{content:\"\uE97F\";margin-left:-1em;color:#323232}.icon-explosive .path21:before{content:\"\uE980\";margin-left:-1em;color:#323232}.icon-explosive .path22:before{content:\"\uE981\";margin-left:-1em;color:#323232}.icon-explosive .path23:before{content:\"\uE982\";margin-left:-1em;color:#323232}.icon-explosive .path24:before{content:\"\uE983\";margin-left:-1em;color:#323232}.icon-explosive .path25:before{content:\"\uE984\";margin-left:-1em;color:#323232}.icon-explosive .path26:before{content:\"\uE985\";margin-left:-1em;color:#323232}.icon-explosive .path27:before{content:\"\uE986\";margin-left:-1em;color:#323232}.icon-explosive .path28:before{content:\"\uE987\";margin-left:-1em;color:#323232}.icon-explosive .path29:before{content:\"\uE988\";margin-left:-1em;color:#323232}.icon-explosive .path30:before{content:\"\uE989\";margin-left:-1em;color:#323232}.icon-explosive .path31:before{content:\"\uE98A\";margin-left:-1em;color:#323232}.icon-explosive .path32:before{content:\"\uE98B\";margin-left:-1em;color:#323232}.icon-explosive .path33:before{content:\"\uE98C\";margin-left:-1em;color:#323232}.icon-explosive .path34:before{content:\"\uE98D\";margin-left:-1em;color:#323232}.icon-explosive .path35:before{content:\"\uE98E\";margin-left:-1em;color:#323232}.icon-explosive .path36:before{content:\"\uE98F\";margin-left:-1em;color:#323232}.icon-explosive .path37:before{content:\"\uE990\";margin-left:-1em;color:#323232}.icon-explosive .path38:before{content:\"\uE991\";margin-left:-1em;color:#323232}.icon-explosive .path39:before{content:\"\uE992\";margin-left:-1em;color:#323232}.icon-explosive .path40:before{content:\"\uE993\";margin-left:-1em;color:#323232}.icon-explosive .path41:before{content:\"\uE994\";margin-left:-1em;color:#323232}.icon-explosive .path42:before{content:\"\uE995\";margin-left:-1em;color:#323232}.icon-explosive .path43:before{content:\"\uE996\";margin-left:-1em;color:#323232}.icon-explosive .path44:before{content:\"\uE997\";margin-left:-1em;color:#323232}.icon-explosive .path45:before{content:\"\uE998\";margin-left:-1em;color:#323232}.icon-explosive .path46:before{content:\"\uE999\";margin-left:-1em;color:#323232}.icon-file-excel:before{content:\"\uE99A\"}.icon-file-pdf:before{content:\"\uE99B\"}.icon-file-pdf-verified .path1:before{content:\"\uE99C\";color:#000;opacity:.6}.icon-file-pdf-verified .path2:before{content:\"\uE99D\";margin-left:-1em;color:#fff}.icon-file-pdf-verified .path3:before{content:\"\uE99E\";margin-left:-1em;color:#000;opacity:.6}.icon-file-word:before{content:\"\uE99F\"}.icon-filter-alt:before{content:\"\uE9A0\"}.icon-flammable .path1:before{content:\"\uE9A1\";color:#323232}.icon-flammable .path2:before{content:\"\uE9A2\";margin-left:-1em;color:#323232}.icon-flammable .path3:before{content:\"\uE9A3\";margin-left:-1em;color:#e32730}.icon-gas-under-pressure .path1:before{content:\"\uE9A4\";color:#323232}.icon-gas-under-pressure .path2:before{content:\"\uE9A5\";margin-left:-1em;color:#e32730}.icon-health-hazard .path1:before{content:\"\uE9A6\";color:#323232}.icon-health-hazard .path2:before{content:\"\uE9A7\";margin-left:-1em;color:#e32730}.icon-line-break:before{content:\"\uE9A8\"}.icon-location:before{content:\"\uE9A9\"}.icon-measure-add:before{content:\"\uE9AA\"}.icon-measure-edit:before{content:\"\uE9AB\"}.icon-measure-view:before{content:\"\uE9AC\";color:#666}.icon-messages:before{content:\"\uE9AD\"}.icon-monitoring:before{content:\"\uE9AE\";color:#666}.icon-move:before{content:\"\uE9AF\"}.icon-oxidizing .path1:before{content:\"\uE9B0\";color:#e32730}.icon-oxidizing .path2:before{content:\"\uE9B1\";margin-left:-1em;color:#323232}.icon-oxidizing .path3:before{content:\"\uE9B2\";margin-left:-1em;color:#323232}.icon-oxidizing .path4:before{content:\"\uE9B3\";margin-left:-1em;color:#323232}.icon-process-area-closed:before{content:\"\uE9B4\"}.icon-process-area-open:before{content:\"\uE9B5\"}.icon-process-linked .path1:before{content:\"\uE9B6\";color:#000;opacity:.6}.icon-process-linked .path2:before{content:\"\uE9B7\";margin-left:-1em;color:#666}.icon-risk:before{content:\"\uE9B8\"}.icon-search-in-file:before{content:\"\uE9B9\"}.icon-sort-ascending:before{content:\"\uE9BA\"}.icon-sort-descending:before{content:\"\uE9BB\"}.icon-subscript:before{content:\"\uE9BC\"}.icon-superscript:before{content:\"\uE9BD\"}.icon-syncronice-favorites:before{content:\"\uE9BE\"}.icon-system-settings:before{content:\"\uE9BF\"}.icon-view-three-outlined:before{content:\"\uE9C0\"}.icon-workplace-safety:before{content:\"\uE9C1\"}.icon-checklist:before{content:\"\uE900\"}.icon-department-document .path1:before{content:\"\uE901\";color:#000;opacity:.6}.icon-department-document .path2:before{content:\"\uE902\";margin-left:-1em;color:#00804c}.icon-department-folder-closed .path1:before{content:\"\uE903\";color:#000;opacity:.6}.icon-department-folder-closed .path2:before{content:\"\uE904\";margin-left:-1em;color:#00804c}.icon-department-folder-open .path1:before{content:\"\uE905\";color:#000;opacity:.6}.icon-department-folder-open .path2:before{content:\"\uE906\";margin-left:-1em;color:#00804c}.icon-deviation:before{content:\"\uE907\"}.icon-dropdown-folder .path1:before{content:\"\uE908\";color:#00324e}.icon-dropdown-folder .path2:before{content:\"\uE909\";margin-left:-1em;color:#fff;opacity:.6}.icon-enterprise-document .path1:before{content:\"\uE90A\";color:#000;opacity:.6}.icon-enterprise-document .path2:before{content:\"\uE90B\";margin-left:-1em;color:#cf4714}.icon-enterprise-folder-closed .path1:before{content:\"\uE90C\";color:#000;opacity:.6}.icon-enterprise-folder-closed .path2:before{content:\"\uE90D\";margin-left:-1em;color:#cf4714}.icon-enterprise-folder-open .path1:before{content:\"\uE90E\";color:#000;opacity:.6}.icon-enterprise-folder-open .path2:before{content:\"\uE90F\";margin-left:-1em;color:#cf4714}.icon-folder-closed:before{content:\"\uE910\"}.icon-folder-open:before{content:\"\uE911\"}.icon-keyboard_arrow_down:before{content:\"\uE912\"}.icon-keyboard_arrow_up:before{content:\"\uE913\"}.icon-local-document .path1:before{content:\"\uE914\";color:#000;opacity:.6}.icon-local-document .path2:before{content:\"\uE915\";margin-left:-1em;color:#1954a9}.icon-local-folder-closed .path1:before{content:\"\uE916\";color:#000;opacity:.6}.icon-local-folder-closed .path2:before{content:\"\uE917\";margin-left:-1em;color:#1954a9}.icon-local-folder-open .path1:before{content:\"\uE918\";color:#000;opacity:.6}.icon-local-folder-open .path2:before{content:\"\uE919\";margin-left:-1em;color:#1954a9}.icon-process:before{content:\"\uE91A\"}.icon-regional-document .path1:before{content:\"\uE91C\";color:#000;opacity:.6}.icon-regional-document .path2:before{content:\"\uE91D\";margin-left:-1em;color:#662e0d}.icon-regional-folder-closed .path1:before{content:\"\uE91E\";color:#000;opacity:.6}.icon-regional-folder-closed .path2:before{content:\"\uE91F\";margin-left:-1em;color:#662e0d}.icon-regional-folder-open .path1:before{content:\"\uE920\";color:#000;opacity:.6}.icon-regional-folder-open .path2:before{content:\"\uE921\";margin-left:-1em;color:#662e0d}.qms-select-department-tree-container .mr10{margin-right:10px}.qms-select-department-tree-container .mt5{margin-bottom:5px}.qms-select-department-tree-container .mb5{margin-top:5px}.qms-select-department-tree-container .w100{width:100%}.qms-select-department-tree-container .fw500{font-weight:500!important}.qms-select-department-tree-container .text-right{text-align:right}.qms-select-department-tree-container .mt20{margin-top:20px}.qms-select-department-tree-container .text-selected{color:rgba(0,0,0,.6);font-size:12px;line-height:16px;margin-top:1rem}.qms-select-department-tree-container .input-field{display:flex;align-items:center;position:relative}.qms-select-department-tree-container .input-field ::ng-deep .mat-form-field-wrapper{padding-bottom:8px!important}.qms-select-department-tree-container .input-field ::ng-deep .mat-form-field-underline{bottom:8px!important}.qms-select-department-tree-container .input-field input.input-search{width:100%;padding:10px;outline:none;border:none;background:var(--background-input-text)}.qms-select-department-tree-container .input-field .btn-search{cursor:pointer;vertical-align:middle;position:absolute;top:50%;right:10px;transform:translateY(-50%)}.qms-select-department-tree-container .input-field .line__divider{border-bottom:1px solid #ccc;height:1px;margin-top:10px;min-width:300px;max-width:100%}.qms-select-department-tree-container .tree-department-wrapper{height:375px;padding-right:4px;overflow-y:auto;overflow-x:hidden;position:relative}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node{border-radius:4px}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node:hover{background:rgba(0,0,0,.08)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node:active{background:rgba(0,0,0,.12)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active{color:var(--primary);background:var(--primary-light-6-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active:active{background:var(--primary-light-12-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active .mat-icon-rtl-mirror,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active .text-name,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active .type-icon,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.active button,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node:not(.selected-theme).active .mat-icon-rtl-mirror,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node:not(.selected-theme).active .text-name,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node:not(.selected-theme).active .type-icon,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node:not(.selected-theme).active button{color:var(--primary)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node:not(.selected-theme).active:hover{background:var(--primary-light-6-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.collapse-node:not(.selected-theme).active:active,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.selected-theme{background:var(--primary-light-12-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node .mat-icon-rtl-mirror,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node .text-name,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node .type-icon,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node button{color:var(--primary)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node:hover{background:var(--primary-light-6-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.expand-node:active{background:var(--primary-light-12-opacity)}.qms-select-department-tree-container .mat-tree.select-department-tree .type-icon{margin-right:5px;color:var(--ws-action-active)}.qms-select-department-tree-container .mat-tree.select-department-tree .text-name{color:var(--default-color)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-icon-rtl-mirror{color:rgba(0,0,0,.6)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-icon-button.btn-toggle{width:35px;height:35px;line-height:35px}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all{cursor:default!important;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all .mat-icon-rtl-mirror,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all .type-icon,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all button.mat-button-disabled{color:rgba(0,0,0,.38)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all .text-name.disabled{color:rgba(0,0,0,.38);cursor:default!important;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled-all.active{background-color:transparent}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled .type-icon,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled button.mat-button-disabled{color:rgba(0,0,0,.38)}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled .text-name.disabled{color:rgba(0,0,0,.38);cursor:default!important;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled.active,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled.expand-node:active,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled.expand-node:hover,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled:active,.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node.mat-tree-node-disabled:hover{background-color:transparent}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node .node-without-checkbox{cursor:pointer;width:100%;display:flex;justify-content:space-between;align-items:center}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node .node-without-checkbox .mat-icon{color:var(--primary);margin-right:4px}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node>.node-content-wraper{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;position:relative;display:flex;justify-content:center;align-items:center}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node>.node-content-wraper>.mat-progress-bar{height:3px;width:100%;position:absolute;bottom:0;left:10px}.qms-select-department-tree-container .mat-tree.select-department-tree .mat-tree-node>.node-content-wraper>.mat-progress-bar .mat-progress-bar-fill:after{background:var(--primary)}.qms-select-department-tree-container .text-name{position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;cursor:pointer;width:100%}.qms-select-department-tree-container .cursor-pointer{cursor:pointer}.qms-select-department-tree-container .ml5{margin-left:10px!important}.qms-select-department-tree-container ::ng-deep .mat-checkbox.qms-group-options.flex-direction-row .mat-checkbox-layout{white-space:normal}.qms-select-department-tree-container ::ng-deep .mat-checkbox.qms-group-options.flex-direction-row .mat-checkbox-label{flex-direction:row;align-items:center;position:relative;padding-bottom:2px}.qms-select-department-tree-container .qms-view-search-result{height:375px;width:100%;overflow:hidden}.qms-select-department-tree-container .qms-view-search-result .result{max-height:calc(100% - 44px);overflow-y:auto;margin-bottom:4px;padding-right:4px}.qms-select-department-tree-container .qms-view-search-result .result.active-paging{max-height:calc(100% - 80px)}.qms-select-department-tree-container .qms-view-search-result .result.no-result{height:100%;display:flex;justify-content:center;align-items:center}.qms-select-department-tree-container .qms-view-search-result .result-item{border-radius:4px;display:grid;grid-template-columns:45px 1fr;align-items:center;cursor:pointer;transition:background .3s ease}.qms-select-department-tree-container .qms-view-search-result .result-item:not(:first-child){margin-top:4px!important}.qms-select-department-tree-container .qms-view-search-result .result-item.active,.qms-select-department-tree-container .qms-view-search-result .result-item:hover{background:linear-gradient(0deg,rgba(1,99,178,.12),rgba(1,99,178,.12)),#fff}.qms-select-department-tree-container .qms-view-search-result .result-item .item-result-content-wraper{padding:5px 15px}.qms-select-department-tree-container .qms-view-search-result ::ng-deep .mat-checkbox.qms-group-options{display:flex;height:100%}.qms-select-department-tree-container ::ng-deep .breadcrumb-container{flex-wrap:wrap}.qms-select-department-tree-container ::ng-deep .mat-button-focus-overlay{background-color:transparent}.qms-select-department-tree-container ::ng-deep .qms-breadcrumb-item{margin:0}.qms-select-department-tree-container ::ng-deep .qms-breadcrumb-item-text{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;transition:color .3s ease}.qms-select-department-tree-container ::ng-deep .qms-breadcrumb-item-text:not(:last-child){max-width:150px!important}.qms-select-department-tree-container ::ng-deep .qms-breadcrumb-item-text:not(:last-child):hover{color:var(--primary)}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-icon{display:flex;align-items:center;justify-content:center}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-form-field-wrapper{padding-bottom:0}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container{min-height:40px}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container .qms-total-result{margin-bottom:0;margin-right:12px;height:100%;display:flex;justify-content:center;align-items:center}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container .qms-total-result span{font-weight:600;font-size:13px;color:rgba(0,0,0,.8)}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container .qms-paginator-range-actions{margin-bottom:0;grid-column-gap:2px;-moz-column-gap:2px;column-gap:2px}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container .qms-paginator-range-actions>.qms-total-result{margin-bottom:0}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-paginator-container .qms-paginator-range-actions>.qms-btn-icon{width:30px;height:30px;line-height:30px}.qms-select-department-tree-container ::ng-deep .qms-paginator>.qms-btn-icon-wrapper{width:30px;height:30px;display:flex;justify-content:center;align-items:center}.qms-select-department-tree-container ::ng-deep .qms-paginator .qms-paginator-page-size{margin-right:12px;height:100%;display:flex;align-items:center;justify-content:center}.qms-select-department-tree-container ::ng-deep .qms-paginator .qms-paginator-page-size>.qms-form-page-size .mat-form-field-flex{width:60px;height:30px;display:flex;align-items:center;padding:0 4px}.qms-select-department-tree-container ::ng-deep .qms-paginator .qms-paginator-page-size>.qms-form-page-size .mat-form-field-flex .mat-form-field-infix{height:30px}.qms-select-department-tree-container ::ng-deep .qms-paginator .qms-paginator-page-size>.qms-pagesize-label{display:none}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-form-field.qms-form .mat-select-min-line,.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-form-field.qms-form mat-select-trigger{font-size:14px}.qms-select-department-tree-container ::ng-deep .qms-paginator .mat-select-value{text-align:center}.qms-select-department-tree-container .text-gray{color:#242424}.qms-select-department-tree-container .mb0{margin-bottom:0!important}.qms-select-department-tree-container .fs-base{font-size:14px!important}.qms-select-department-tree-container .user-select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.qms-select-department-tree-container .item-breadcrumb-disable{cursor:not-allowed;color:rgba(0,0,0,.6);font-weight:400;font-size:14px}.qms-select-department-tree-container ::ng-deep .mat-checkbox.checkbox-all .mat-checkbox-label{flex-direction:row;align-items:center;grid-column-gap:4px;-moz-column-gap:4px;column-gap:4px}.qms-select-department-tree-container ::ng-deep .btn-arrow{width:40px;height:40px;line-height:40px}.qms-select-department-tree-container .loading-container{overflow:hidden;height:100%;display:grid;grid-template-rows:repeat(auto-fill,minmax(60px,60px))}.qms-select-department-tree-container .loading-container .loader{position:relative;width:100%;height:100%;padding:10px 0;overflow:hidden}.qms-select-department-tree-container .loading-container .loader:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background:linear-gradient(110deg,hsla(0,0%,91%,0),hsla(0,0%,89%,0) 40%,hsla(0,0%,89%,.5) 50%,hsla(0,0%,89%,0) 60%,hsla(0,0%,89%,0));-webkit-animation:animate-loading 1.2s linear infinite;animation:animate-loading 1.2s linear infinite}.qms-select-department-tree-container .loading-container .loader__wrapper{position:relative;width:100%;height:100%}.qms-select-department-tree-container .loading-container .loader__wrapper .row-loader{background-color:#eee;position:absolute;left:0;width:100%;height:40px}@-webkit-keyframes animate-loading{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}@keyframes animate-loading{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}"]
29518
29575
  },] }
29519
29576
  ];
29520
29577
  SelectDepartmentTreeComponent.ctorParameters = () => [
@@ -29649,8 +29706,7 @@ const ɵ0$1 = {
29649
29706
  clickAction: 'noop'
29650
29707
  };
29651
29708
  class SelectDepartmentComponent {
29652
- constructor(selectTreeDepartmentService, selectDepartmentService, cdRef, dialogRef, data, trans) {
29653
- this.selectTreeDepartmentService = selectTreeDepartmentService;
29709
+ constructor(selectDepartmentService, cdRef, dialogRef, data, trans) {
29654
29710
  this.selectDepartmentService = selectDepartmentService;
29655
29711
  this.cdRef = cdRef;
29656
29712
  this.dialogRef = dialogRef;
@@ -29677,9 +29733,6 @@ class SelectDepartmentComponent {
29677
29733
  this.treeDepartment.setResultSearch(result);
29678
29734
  });
29679
29735
  }
29680
- get currentTreeData() {
29681
- return this.selectTreeDepartmentService.getDataTree$.value;
29682
- }
29683
29736
  ngAfterViewInit() {
29684
29737
  this.cdRef.detectChanges();
29685
29738
  }
@@ -29704,11 +29757,25 @@ class SelectDepartmentComponent {
29704
29757
  getChildrenNode(node) {
29705
29758
  this.treeDepartment.getListChildrenOfNode(this.treeDepartment.convertToFlatNode(node));
29706
29759
  }
29760
+ onResultDepartmentChange(data) {
29761
+ this.resultSelected = data.map(item => {
29762
+ var _a;
29763
+ return Object.assign(Object.assign({}, item), { tooltip: ((_a = item.children) === null || _a === void 0 ? void 0 : _a.length) ? this.formatString(this.LANG.TOOLTIP_INCLUDE_CHILD, item.name, item.children.length.toString()) : item.name });
29764
+ });
29765
+ }
29766
+ formatString(...replacements) {
29767
+ let result = arguments[0];
29768
+ for (let i = 0; i < arguments.length - 1; i++) {
29769
+ const reg = new RegExp(`\\{${i}\\}`, 'gm');
29770
+ result = result.replace(reg, arguments[i + 1]);
29771
+ }
29772
+ return result;
29773
+ }
29707
29774
  }
29708
29775
  SelectDepartmentComponent.decorators = [
29709
29776
  { type: Component, args: [{
29710
29777
  selector: 'qms-select-department',
29711
- template: "<div class=\"qms-select-department\">\r\n <div class=\"header-dialog mb-2\">\r\n <span>{{popupData.headerName}}</span>\r\n <button matDialogClose qms-btn-icon>\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </div>\r\n <div>\r\n <div class=\"qms-scrollbar\">\r\n <div>\r\n <qms-select-department-tree\r\n #treeDepartment\r\n [treeData]=\"popupData.treeData\"\r\n [isSelectOne]=\"popupData.isSelectOne\"\r\n [enableIncludeChild]=\"popupData.includeChildren && !popupData.isSelectOne\"\r\n [selectIncludeLabel]=\"popupData.selectIncludeLabel\"\r\n [enableTreeSearch]=\"popupData.enableSearch\"\r\n [enablePagingSearch]=\"popupData.enablePagingSearch\"\r\n [activeViewSearch]=\"isActiveViewSearch\"\r\n [selectedList]=\"popupData.selectedList\"\r\n [checkSearchMappingTree]=\"true\"\r\n (onSearchEvent)=\"onSearchEvent.emit($event)\"\r\n >\r\n </qms-select-department-tree>\r\n </div>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <div *ngIf=\"!!resultSelected.length && treeDepartment\" class=\"line__divider\"></div>\r\n <div [@heightAnimation] *ngIf=\"!!treeDepartment?.resultSelected.length\" class=\" pr-0 pe-0\">\r\n <div class=\"header-title\">{{LANG.RESULTS}}</div>\r\n <div class=\"result-content pr-0 pe-0\">\r\n <mat-chip-list class=\"panel__item qms-scrollbar\">\r\n <mat-chip [qms-tool-tip]=\"item.name\" position=\"top\" mode=\"dark\"\r\n *ngFor=\"let item of treeDepartment?.resultSelected\" qms-chip [removable]=\"true\">\r\n <span (click)=\"onScrollToNode(item)\" qms-chip-body>\r\n <span class=\"related__item__content_name\" #itemName>\r\n {{item.name}}\r\n <span class=\"select__include-children__count\" *ngIf=\"item?.children\">\r\n {{item.children.length}}/{{item.childCount}}\r\n </span>\r\n </span>\r\n </span>\r\n <mat-icon (click)=\"onRemoveNode(item)\">cancel</mat-icon>\r\n </mat-chip>\r\n </mat-chip-list>\r\n </div>\r\n </div>\r\n <mat-divider *ngIf=\"!!treeDepartment?.resultSelected.length\" class=\"mx-auto\"></mat-divider>\r\n <div class=\"confirm__button__groups\">\r\n <button (click)=\"onCloseDialog()\" class=\"btn-add\" [disabled]=\"!treeDepartment?.resultSelected.length\"\r\n [class.qms-btn-disabled]=\"!treeDepartment?.resultSelected.length\" qms-btn>\r\n <span>{{LANG.ADD}}</span>\r\n <span *ngIf=\"!!treeDepartment?.resultSelected\">\r\n ({{treeDepartment?.resultSelected.length}})\r\n </span>\r\n </button>\r\n <button qms-btn-text mat-dialog-close>\r\n Cancel\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n",
29778
+ template: "<div class=\"qms-select-department\">\r\n <div class=\"header-dialog mb-2\">\r\n <span>{{popupData.headerName}}</span>\r\n <button matDialogClose qms-btn-icon>\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </div>\r\n <div>\r\n <div class=\"qms-scrollbar\">\r\n <div>\r\n <qms-select-department-tree #treeDepartment [treeData]=\"popupData.treeData\"\r\n [isSelectOne]=\"popupData.isSelectOne\"\r\n [enableIncludeChild]=\"popupData.includeChildren && !popupData.isSelectOne\"\r\n [selectIncludeLabel]=\"popupData.selectIncludeLabel\" [enableTreeSearch]=\"popupData.enableSearch\"\r\n [enablePagingSearch]=\"popupData.enablePagingSearch\" [activeViewSearch]=\"isActiveViewSearch\"\r\n [selectedList]=\"popupData.selectedList\" [checkSearchMappingTree]=\"true\"\r\n (onSearchEvent)=\"onSearchEvent.emit($event)\" (onValueChangeEvent)=\"onResultDepartmentChange($event)\">\r\n </qms-select-department-tree>\r\n </div>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <div *ngIf=\"!!resultSelected.length\" class=\"line__divider\"></div>\r\n <div [@heightAnimation] *ngIf=\"!!resultSelected.length\" class=\" pr-0 pe-0\">\r\n <div class=\"header-title\">{{LANG.RESULTS}}</div>\r\n <div class=\"result-content pr-0 pe-0\">\r\n <mat-chip-list class=\"panel__item qms-scrollbar\">\r\n <mat-chip [qms-tool-tip]=\"item?.tooltip || item.name\" position=\"top\" mode=\"dark\"\r\n *ngFor=\"let item of resultSelected\" qms-chip [removable]=\"true\">\r\n <span (click)=\"onScrollToNode(item)\" qms-chip-body>\r\n <span class=\"related__item__content_name\" #itemName>\r\n {{item.name}}\r\n <span class=\"select__include-children__count\" *ngIf=\"item?.children\">\r\n {{item.children.length}}/{{item.childCount}}\r\n </span>\r\n </span>\r\n </span>\r\n <mat-icon (click)=\"onRemoveNode(item)\">cancel</mat-icon>\r\n </mat-chip>\r\n </mat-chip-list>\r\n </div>\r\n </div>\r\n <mat-divider *ngIf=\"!!resultSelected.length\" class=\"mx-auto\"></mat-divider>\r\n <div class=\"confirm__button__groups\">\r\n <button (click)=\"onCloseDialog()\" class=\"btn-add\" [disabled]=\"!resultSelected.length\"\r\n [class.qms-btn-disabled]=\"!resultSelected.length\" qms-btn>\r\n <span>{{LANG.ADD}}</span>\r\n <span *ngIf=\"!!resultSelected\">\r\n ({{resultSelected.length}})\r\n </span>\r\n </button>\r\n <button qms-btn-text mat-dialog-close>\r\n Cancel\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n",
29712
29779
  providers: [
29713
29780
  {
29714
29781
  provide: MAT_CHECKBOX_DEFAULT_OPTIONS,
@@ -29720,7 +29787,6 @@ SelectDepartmentComponent.decorators = [
29720
29787
  },] }
29721
29788
  ];
29722
29789
  SelectDepartmentComponent.ctorParameters = () => [
29723
- { type: QMSSelectDepartmentTreeGlobalService },
29724
29790
  { type: QMSSelectDepartmentGlobalService },
29725
29791
  { type: ChangeDetectorRef },
29726
29792
  { type: MatDialogRef },
@@ -29820,36 +29886,51 @@ const SelectAccessAnimationTrigger = [
29820
29886
  animate('0.3s ease-out', style({ opacity: 1 }))
29821
29887
  ]),
29822
29888
  ]),
29889
+ trigger('listAnimation', [
29890
+ transition('* => *', [
29891
+ query(':enter', [
29892
+ style({ opacity: 0, transform: 'translateY(-100%)' }),
29893
+ stagger(25, [
29894
+ animate('0.4s cubic-bezier(0.23, 1, 0.320, 1)', style({ opacity: 1, transform: 'none' }))
29895
+ ])
29896
+ ], { optional: true })
29897
+ ])
29898
+ ])
29823
29899
  ];
29824
29900
 
29901
+ class QMSSelectAccessDialog {
29902
+ constructor() {
29903
+ this.enableSelectPerson = true;
29904
+ this.enableSelectUserGroup = true;
29905
+ this.enableSelectDepartment = true;
29906
+ this.modeSelectOneDepartment = false;
29907
+ this.modeSelectOnePerson = false;
29908
+ this.modeSelectOneUserGroup = false;
29909
+ this.data = new QMSSelectAccessData();
29910
+ this.treeDepartmentConfig = {
29911
+ selectIncludeChildLabel: '',
29912
+ enableIncludeChild: true,
29913
+ enableTreeSearch: true
29914
+ };
29915
+ this.titleDialog = '';
29916
+ this.titleResult = '';
29917
+ }
29918
+ }
29919
+
29825
29920
  const ɵ0 = {
29826
29921
  clickAction: 'noop'
29827
29922
  };
29828
29923
  class QMSSelectAccessDialogComponent {
29829
- constructor(dialogRef, dataDialog, translate, _fb, qmsSelectAccessService, cdRef) {
29924
+ constructor(dialogRef, dialogData, translate, _fb, cdRef) {
29830
29925
  this.dialogRef = dialogRef;
29831
- this.dataDialog = dataDialog;
29926
+ this.dialogData = dialogData;
29832
29927
  this.translate = translate;
29833
29928
  this._fb = _fb;
29834
- this.qmsSelectAccessService = qmsSelectAccessService;
29835
29929
  this.cdRef = cdRef;
29836
29930
  this.ngUnsubcribe = new Subject();
29837
29931
  this.optionSelect = new FormControl();
29838
29932
  this.OPTION_ENUM = OptionSelectAccessEnum;
29839
- this.options = [
29840
- {
29841
- displayName: 'PERSON',
29842
- type: this.OPTION_ENUM.PERSON
29843
- },
29844
- {
29845
- displayName: 'USER_GROUP',
29846
- type: this.OPTION_ENUM.USER_GROUP
29847
- },
29848
- {
29849
- displayName: 'DEPARTMENT',
29850
- type: this.OPTION_ENUM.DEPARTMENT
29851
- }
29852
- ];
29933
+ this.options = [];
29853
29934
  this.userGroupForm = new FormControl('');
29854
29935
  this.getLoading$ = new BehaviorSubject(false);
29855
29936
  this.onSearchPersonEvent = new EventEmitter();
@@ -29870,17 +29951,17 @@ class QMSSelectAccessDialogComponent {
29870
29951
  pageSize: 10,
29871
29952
  length: 0
29872
29953
  };
29873
- this.resultAccess = _.cloneDeep(this.dataDialog.selectedData);
29954
+ this.resultAccess = _.cloneDeep(this.dialogData.data.selectedData);
29874
29955
  this.optionSelect.valueChanges
29875
29956
  .pipe(takeUntil(this.ngUnsubcribe))
29876
29957
  .subscribe(_ => {
29877
29958
  this.resetPagingConfig();
29878
29959
  });
29879
29960
  // Filtered Option select person
29880
- this.filteredSearchTextBox.role.next(this.dataDialog.accessUserGroups);
29881
- this.filteredSearchTextBox.department.next(this.dataDialog.accessDepartments);
29882
- this.updatePersonFilter(this.dataDialog.accessPersons);
29883
- this.updateUserGroupFilter(this.dataDialog.accessUserGroups);
29961
+ this.filteredSearchTextBox.role.next(this.dialogData.data.accessUserGroups);
29962
+ this.filteredSearchTextBox.department.next(this.dialogData.data.accessDepartments);
29963
+ this.updatePersonFilter(this.dialogData.data.accessPersons);
29964
+ this.updateUserGroupFilter(this.dialogData.data.accessUserGroups);
29884
29965
  }
29885
29966
  set tree(data) {
29886
29967
  if (data) {
@@ -29901,6 +29982,7 @@ class QMSSelectAccessDialogComponent {
29901
29982
  }
29902
29983
  ngAfterViewInit() {
29903
29984
  this.cdRef.detectChanges();
29985
+ this.cdRef.detectChanges();
29904
29986
  }
29905
29987
  ngOnInit() {
29906
29988
  this.translate.getLanguageSubject$.pipe().subscribe((res) => {
@@ -29908,43 +29990,46 @@ class QMSSelectAccessDialogComponent {
29908
29990
  this.LANG = this.translate.getObjectLang(res);
29909
29991
  }
29910
29992
  });
29993
+ this._buildOptionSelect();
29911
29994
  this.buildPersonForm();
29912
29995
  // Filter person by roles
29913
29996
  this.personForm.get('roleFilter').valueChanges
29914
29997
  .pipe(takeUntil(this.ngUnsubcribe), debounceTime(500))
29915
29998
  .subscribe(keyword => {
29916
- if (!this.dataDialog.accessUserGroups) {
29999
+ if (!this.dialogData.data.accessUserGroups) {
29917
30000
  return;
29918
30001
  }
29919
30002
  if (!keyword) {
29920
- this.filteredSearchTextBox.role.next(this.dataDialog.accessUserGroups);
30003
+ this.filteredSearchTextBox.role.next(this.dialogData.data.accessUserGroups);
29921
30004
  return;
29922
30005
  }
29923
- this.filteredSearchTextBox.role.next(this.dataDialog.accessUserGroups.filter(role => role.name.toLocaleLowerCase().includes(keyword.toLocaleLowerCase())));
30006
+ this.filteredSearchTextBox.role.next(this.dialogData.data.accessUserGroups.filter(role => role.name.toLocaleLowerCase().includes(keyword.toLocaleLowerCase())));
29924
30007
  });
29925
30008
  // Filter person by departments
29926
30009
  this.personForm.get('departmentFilter').valueChanges
29927
30010
  .pipe(takeUntil(this.ngUnsubcribe))
29928
30011
  .subscribe(() => {
29929
- if (!this.dataDialog.accessDepartments) {
30012
+ if (!this.dialogData.data.accessDepartments) {
29930
30013
  return;
29931
30014
  }
29932
30015
  let search = this.personForm.get('departmentFilter').value;
29933
30016
  if (!search) {
29934
- this.filteredSearchTextBox.department.next(this.dataDialog.accessDepartments.slice());
30017
+ this.filteredSearchTextBox.department.next(this.dialogData.data.accessDepartments.slice());
29935
30018
  }
29936
30019
  else {
29937
30020
  search = search.toLowerCase();
29938
- this.filteredSearchTextBox.department.next(this.dataDialog.accessDepartments.filter(x => x.name.toLowerCase().indexOf(search) > -1));
30021
+ this.filteredSearchTextBox.department.next(this.dialogData.data.accessDepartments.filter(x => x.name.toLowerCase().indexOf(search) > -1));
29939
30022
  }
29940
30023
  });
29941
30024
  this.getLoading$.pipe(takeUntil(this.ngUnsubcribe))
29942
30025
  .subscribe(response => {
29943
30026
  if (response) {
29944
30027
  this.personForm.disable();
30028
+ this.userGroupForm.disable();
29945
30029
  }
29946
30030
  else {
29947
30031
  this.personForm.enable();
30032
+ this.userGroupForm.enable();
29948
30033
  }
29949
30034
  });
29950
30035
  }
@@ -29952,12 +30037,48 @@ class QMSSelectAccessDialogComponent {
29952
30037
  this.ngUnsubcribe.next();
29953
30038
  this.ngUnsubcribe.complete();
29954
30039
  }
30040
+ _buildOptionSelect() {
30041
+ const optionObj = {
30042
+ enableSelectDepartment: {
30043
+ displayName: 'DEPARTMENT',
30044
+ type: this.OPTION_ENUM.DEPARTMENT
30045
+ },
30046
+ enableSelectPerson: {
30047
+ displayName: 'PERSON',
30048
+ type: this.OPTION_ENUM.PERSON
30049
+ },
30050
+ enableSelectUserGroup: {
30051
+ displayName: 'USER_GROUP',
30052
+ type: this.OPTION_ENUM.USER_GROUP
30053
+ }
30054
+ };
30055
+ for (let item in this.dialogData) {
30056
+ if (!!this.dialogData[item] && optionObj[item]) {
30057
+ this.options.push(optionObj[item]);
30058
+ }
30059
+ }
30060
+ if (this.options.length === 1) {
30061
+ this.dialogRef.updateSize('732px');
30062
+ this.optionSelect.setValue(this.options[0].type);
30063
+ }
30064
+ }
30065
+ getResultTabActive() {
30066
+ const resultObj = {
30067
+ 0: this.resultAccess.persons,
30068
+ 1: this.resultAccess.userGroups,
30069
+ 2: this.resultAccess.departments
30070
+ };
30071
+ return resultObj[this.optionSelect.value];
30072
+ }
30073
+ checkExistOptionSelect(option) {
30074
+ return !!this.options.find(item => item.type === option);
30075
+ }
29955
30076
  buildPersonForm() {
29956
30077
  this.personForm = this._fb.group({
29957
30078
  roleId: new FormControl(''),
29958
30079
  departmentId: new FormControl(),
29959
30080
  departmentFilter: new FormControl(''),
29960
- recursive: new FormControl({ value: true, disabled: true }),
30081
+ recursive: new FormControl({ value: false, disabled: true }),
29961
30082
  keyword: new FormControl(''),
29962
30083
  roleFilter: new FormControl(''),
29963
30084
  excludedQuitDepartmentId: true
@@ -29971,25 +30092,65 @@ class QMSSelectAccessDialogComponent {
29971
30092
  };
29972
30093
  }
29973
30094
  onFilterPerson() {
30095
+ this.getLoading$.next(true);
29974
30096
  this.onSearchPersonEvent.emit(this.personForm.value);
29975
30097
  this.getLoading$.next(true);
29976
30098
  }
29977
30099
  onSearchPersonFreeText() {
30100
+ this.getLoading$.next(true);
29978
30101
  this.getLoading$.next(true);
29979
30102
  this.onSearchPersonFreeTextEvent.emit(this.personForm.get('keyword').value);
29980
30103
  }
29981
30104
  onFilterUserGroup() {
30105
+ this.getLoading$.next(true);
29982
30106
  this.onSearchUserGroupEvent.emit(this.userGroupForm.value);
29983
30107
  }
29984
- onSelectPerson(employee) {
29985
- employee.selected = !employee.selected;
29986
- employee.selected ? this.resultAccess.persons.push(employee) : this.resultAccess.persons = this.resultAccess.persons.filter(item => item.id !== employee.id);
29987
- }
29988
- onSelectUserGroup(userGroup) {
29989
- userGroup.selected = !userGroup.selected;
29990
- userGroup.selected ? this.resultAccess.userGroups.push(userGroup) : this.resultAccess.userGroups = this.resultAccess.userGroups.filter(item => item.id !== userGroup.id);
30108
+ onSelectItem(type, item) {
30109
+ item.selected = !item.selected;
30110
+ switch (type) {
30111
+ case OptionSelectAccessEnum.PERSON:
30112
+ {
30113
+ if (this.dialogData.modeSelectOnePerson) {
30114
+ this.resultAccess.persons = item.selected ? [item] : [];
30115
+ this.personFiltered.forEach(item => {
30116
+ if (item.id !== item.id) {
30117
+ item.selected = false;
30118
+ }
30119
+ });
30120
+ return;
30121
+ }
30122
+ if (item.selected) {
30123
+ this.resultAccess.persons.push(item);
30124
+ return;
30125
+ }
30126
+ const indexItem = this.resultAccess.persons.findIndex(x => x.id === item.id);
30127
+ indexItem > -1 && this.resultAccess.persons.splice(indexItem, 1);
30128
+ }
30129
+ break;
30130
+ case OptionSelectAccessEnum.USER_GROUP:
30131
+ {
30132
+ if (this.dialogData.modeSelectOneUserGroup) {
30133
+ this.resultAccess.userGroups = item.selected ? [item] : [];
30134
+ this.userGroupFiltered.forEach(item => {
30135
+ if (item.id !== item.id) {
30136
+ item.selected = false;
30137
+ }
30138
+ });
30139
+ return;
30140
+ }
30141
+ if (item.selected) {
30142
+ this.resultAccess.userGroups.push(item);
30143
+ return;
30144
+ }
30145
+ const indexItem = this.resultAccess.userGroups.findIndex(x => x.id === item.id);
30146
+ indexItem > -1 && this.resultAccess.userGroups.splice(indexItem, 1);
30147
+ }
30148
+ break;
30149
+ default:
30150
+ return;
30151
+ }
29991
30152
  }
29992
- onRemoveChip(type, index) {
30153
+ onRemoveChip(type, item, index) {
29993
30154
  switch (type) {
29994
30155
  case this.OPTION_ENUM.PERSON:
29995
30156
  this.resultAccess.persons.splice(index, 1);
@@ -30003,6 +30164,9 @@ class QMSSelectAccessDialogComponent {
30003
30164
  this.userGroupFiltered[index].selected = false;
30004
30165
  }
30005
30166
  break;
30167
+ case this.OPTION_ENUM.DEPARTMENT:
30168
+ this.resultAccess.departments.splice(index, 1);
30169
+ this.treeDepartment.onRemoveNode(item.id);
30006
30170
  default:
30007
30171
  return;
30008
30172
  }
@@ -30016,14 +30180,12 @@ class QMSSelectAccessDialogComponent {
30016
30180
  (_a = this.personForm.get(controlName)) === null || _a === void 0 ? void 0 : _a.setValue(values[_index]);
30017
30181
  });
30018
30182
  }
30019
- getPersonSelected() {
30020
- }
30021
30183
  isCheckAll(type) {
30022
30184
  switch (type) {
30023
30185
  case this.OPTION_ENUM.PERSON:
30024
- return this.personFiltered.length && this.getPaging(this.personFiltered).every(x => x.selected);
30186
+ return !this.dialogData.modeSelectOnePerson && this.personFiltered.length && this.getPaging(this.personFiltered).every(x => x.selected);
30025
30187
  case this.OPTION_ENUM.USER_GROUP:
30026
- return this.userGroupFiltered.length && this.getPaging(this.userGroupFiltered).every(x => x.selected);
30188
+ return !this.dialogData.modeSelectOneUserGroup && this.userGroupFiltered.length && this.getPaging(this.userGroupFiltered).every(x => x.selected);
30027
30189
  default:
30028
30190
  return false;
30029
30191
  }
@@ -30032,9 +30194,9 @@ class QMSSelectAccessDialogComponent {
30032
30194
  var _a, _b;
30033
30195
  switch (type) {
30034
30196
  case this.OPTION_ENUM.PERSON:
30035
- return !this.isCheckAll(type) && ((_a = this.getPaging(this.personFiltered)) === null || _a === void 0 ? void 0 : _a.some(x => x.selected));
30197
+ return !this.dialogData.modeSelectOnePerson && !this.isCheckAll(type) && ((_a = this.getPaging(this.personFiltered)) === null || _a === void 0 ? void 0 : _a.some(x => x.selected));
30036
30198
  case this.OPTION_ENUM.USER_GROUP:
30037
- return !this.isCheckAll(type) && ((_b = this.getPaging(this.userGroupFiltered)) === null || _b === void 0 ? void 0 : _b.some(x => x.selected));
30199
+ return !this.dialogData.modeSelectOneUserGroup && !this.isCheckAll(type) && ((_b = this.getPaging(this.userGroupFiltered)) === null || _b === void 0 ? void 0 : _b.some(x => x.selected));
30038
30200
  default:
30039
30201
  return false;
30040
30202
  }
@@ -30043,6 +30205,10 @@ class QMSSelectAccessDialogComponent {
30043
30205
  $event.checked = !$event.checked;
30044
30206
  switch (type) {
30045
30207
  case this.OPTION_ENUM.PERSON: {
30208
+ if (this.dialogData.modeSelectOnePerson) {
30209
+ $event.checked = false;
30210
+ return;
30211
+ }
30046
30212
  const userPaging = this.getPaging(this.personFiltered) || [];
30047
30213
  if (!userPaging.length)
30048
30214
  return;
@@ -30058,6 +30224,10 @@ class QMSSelectAccessDialogComponent {
30058
30224
  break;
30059
30225
  }
30060
30226
  case this.OPTION_ENUM.USER_GROUP: {
30227
+ if (this.dialogData.modeSelectOneUserGroup) {
30228
+ $event.checked = false;
30229
+ return;
30230
+ }
30061
30231
  const userGroupPaging = this.getPaging(this.userGroupFiltered);
30062
30232
  userGroupPaging.forEach(x => x.selected = $event.checked);
30063
30233
  const idFiltered = userGroupPaging.map(x => x.id);
@@ -30090,11 +30260,13 @@ class QMSSelectAccessDialogComponent {
30090
30260
  this.resetPagingConfig();
30091
30261
  this.getPerson$.next(data);
30092
30262
  this.getLoading$.next(false);
30263
+ this.getLoading$.next(false);
30093
30264
  }
30094
30265
  updateUserGroupFilter(data) {
30095
30266
  this.resetPagingConfig();
30096
30267
  this.getUserGroup$.next(data);
30097
30268
  this.getLoading$.next(false);
30269
+ this.getLoading$.next(false);
30098
30270
  }
30099
30271
  onPagingEvent(val) {
30100
30272
  this.currentPaginationConfig = val;
@@ -30105,13 +30277,27 @@ class QMSSelectAccessDialogComponent {
30105
30277
  return source.slice(this.currentPaginationConfig.pageIndex * this.currentPaginationConfig.pageSize, (this.currentPaginationConfig.pageIndex * this.currentPaginationConfig.pageSize) + this.currentPaginationConfig.pageSize);
30106
30278
  }
30107
30279
  onResultDepartmentChange(event) {
30108
- this.resultAccess.departments = event;
30280
+ this.resultAccess.departments = event.map(item => {
30281
+ var _a;
30282
+ return Object.assign(Object.assign({}, item), { tooltip: ((_a = item.children) === null || _a === void 0 ? void 0 : _a.length) ? this.formatString(this.LANG.TOOLTIP_INCLUDE_CHILD, item.name, item.children.length.toString()) : item.name });
30283
+ });
30284
+ }
30285
+ formatString(...replacements) {
30286
+ let result = arguments[0];
30287
+ for (let i = 0; i < arguments.length - 1; i++) {
30288
+ const reg = new RegExp(`\\{${i}\\}`, 'gm');
30289
+ result = result.replace(reg, arguments[i + 1]);
30290
+ }
30291
+ return result;
30292
+ }
30293
+ hasItemSelected() {
30294
+ return Object.keys(this.resultAccess).some(key => { var _a; return !!((_a = this.resultAccess[key]) === null || _a === void 0 ? void 0 : _a.length); });
30109
30295
  }
30110
30296
  }
30111
30297
  QMSSelectAccessDialogComponent.decorators = [
30112
30298
  { type: Component, args: [{
30113
30299
  selector: 'qms-select-access-dialog',
30114
- template: "<div qms-dialog-container-v2 class=\"select-access-dialog-container\">\r\n <div qms-dialog-header>\r\n <div class=\"access-dialog-header mb-2\">\r\n <span class=\"header-title\">{{LANG.SELECT_ACCESS}}</span>\r\n <button matDialogClose qms-btn-icon>\r\n <mat-icon class=\"mat-icons-outlined\">close</mat-icon>\r\n </button>\r\n </div>\r\n <mat-form-field qms-form qms-select-input class=\"field-select-option w-100\" appearance=\"fill\">\r\n <mat-label qms-select-input>{{LANG.TYPE}}</mat-label>\r\n <mat-select (selectionChange)=\"onSelectionTypeChange($event)\" [formControl]=\"optionSelect\" placeholder=\"Select\"\r\n disableOptionCentering #singleSelect panelClass=\"qms-select-panel\" qms-select>\r\n\r\n <mat-option *ngFor=\"let item of options\" [value]=\"item.type\">\r\n {{ LANG[item.displayName] }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n <div qms-dialog-content class=\"access-dialog-wraper\">\r\n <!-- Person Access -->\r\n <div class=\"option-selected-content\">\r\n <ng-container *ngIf=\"optionSelect.value === OPTION_ENUM.PERSON\">\r\n <form [formGroup]=\"personForm\">\r\n <mat-dialog-content>\r\n <div class=\"group-filter-person-option\">\r\n <mat-form-field class=\"w-100 input-option-filter\" qms-form>\r\n <mat-label qms-select-input>{{LANG.ROLE}}</mat-label>\r\n <mat-select panelClass=\"qms-select-panel\" qms-select disableOptionCentering formControlName=\"roleId\">\r\n <mat-option>\r\n <ngx-mat-select-search formControlName=\"roleFilter\" placeholderLabel=\"{{ LANG.ROLE }}\"\r\n noEntriesFoundLabel=\"\">\r\n </ngx-mat-select-search>\r\n </mat-option>\r\n <mat-option *ngFor=\"let item of filteredSearchTextBox.role | async\" [value]=\"item.id\">\r\n {{ item.name }}\r\n </mat-option>\r\n </mat-select>\r\n <!-- <mat-progress-spinner [@inOutAnimation] *ngIf=\"getLoading$.value\" matSuffix mode=\"indeterminate\" diameter=\"20\"></mat-progress-spinner> -->\r\n <span [@inOutAnimation] (click)=\"personForm.get('roleId').setValue('')\" class=\"pointer \" matSuffix\r\n aria-label=\"Clear\" *ngIf=\"personForm.get('roleId').value && !getLoading$.value\">\r\n <mat-icon>close</mat-icon>\r\n </span>\r\n </mat-form-field>\r\n\r\n <mat-form-field class=\"w-100 input-select-option\" qms-form qms-select-input>\r\n <mat-label>{{LANG.DEPARTMENT_UNIT}}</mat-label>\r\n <mat-select panelClass=\"qms-select-panel\" qms-select disableOptionCentering\r\n formControlName=\"departmentId\">\r\n <mat-option>\r\n <ngx-mat-select-search formControlName=\"departmentFilter\" [placeholderLabel]=\"LANG.DEPARTMENT_UNIT\"\r\n noEntriesFoundLabel=\"\">\r\n </ngx-mat-select-search>\r\n </mat-option>\r\n <mat-option *ngFor=\"let item of filteredSearchTextBox.department | async\" [value]=\"item.id\">\r\n {{item.name}}\r\n </mat-option>\r\n </mat-select>\r\n <!-- <mat-progress-spinner [@inOutAnimation] *ngIf=\"getLoading$.value\" matSuffix mode=\"indeterminate\" diameter=\"20\"></mat-progress-spinner> -->\r\n <span (click)=\"setFormControlValue(['recursive','departmentId'], [false,''])\" [@inOutAnimation]\r\n class=\"pointer\" matSuffix aria-label=\"Clear\" *ngIf=\"personForm.get('departmentId').value && !getLoading$.value\">\r\n <mat-icon>close</mat-icon>\r\n </span>\r\n </mat-form-field>\r\n </div>\r\n\r\n <mat-slide-toggle class=\"w-100 slide-toggle\" formControlName=\"recursive\"\r\n [disabled]=\"!this.personForm.controls['departmentId'].value\"\r\n color=\"default\" qms-group-options>\r\n <span class=\"text-label\">{{LANG.INCLUDE_SUB_DEPARTMENTS}}</span>\r\n </mat-slide-toggle>\r\n\r\n <mat-form-field class=\"w-100\" appearance=\"fill\" qms-form qms-search-field>\r\n <!-- <mat-label>{{LANG.SEARCH_WITH_NAME}}</mat-label> -->\r\n <input matInput appearance=\"off\" [placeholder]=\"LANG.SEARCH_WITH_NAME\"\r\n formControlName=\"keyword\" type=\"text\" autocomplete=\"off\" />\r\n <button *ngIf=\"!getLoading$.value\" qms-btn-icon color=\"light\" [@inOutAnimation] (click)=\"onSearchPersonFreeText()\" class=\"pointer me-1\" matSuffix\r\n aria-label=\"Search\">\r\n <mat-icon>search</mat-icon>\r\n </button>\r\n <mat-progress-spinner [@inOutAnimation] *ngIf=\"getLoading$.value\" matSuffix mode=\"indeterminate\" diameter=\"20\"></mat-progress-spinner>\r\n <span [@inOutAnimation] (click)=\"personForm.get('keyword').setValue('')\"\r\n class=\"pointer btn-icon-clear d-flex justify-content-center align-items-center \" matSuffix aria-label=\"Clear\"\r\n *ngIf=\"personForm.get('keyword').value && !getLoading$.value\">\r\n <button qms-btn-icon color=\"light\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n <button (click)=\"onFilterPerson()\" qms-btn-outlined class=\"w-100 my-1\">\r\n {{LANG.FILTER}}\r\n </button>\r\n </mat-dialog-content>\r\n\r\n <mat-dialog-content class=\"items-list\">\r\n <div qms-scrollbar>\r\n <div class=\"item\">\r\n <mat-checkbox [disabled]=\"!personFiltered.length\" #checkPerson class=\"w-100 mb-1 checkbox-all\" (click)=\"personFiltered.length && onCheckAll(OPTION_ENUM.PERSON,checkPerson)\"\r\n [checked]=\"isCheckAll(OPTION_ENUM.PERSON)\" [indeterminate]=\"isIndeterminate(OPTION_ENUM.PERSON)\"\r\n color=\"default\" qms-group-options>\r\n <span class=\"text-label header-title\">{{LANG.CHOOSE_ALL}} </span>\r\n <span>(<b>{{getPaging(personFiltered).length}}</b>)</span>\r\n </mat-checkbox>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <div [@inOutAnimation] *ngIf=\"getPaging(personFiltered).length\" class=\"item-list-wrapper\">\r\n <div class=\"item mt-1\" *ngFor=\"let employee of getPaging(personFiltered); trackBy: trackByFn\">\r\n <mat-checkbox [checked]=\"employee.selected\" (click)=\"onSelectPerson(employee)\" class=\"w-100\"\r\n color=\"default\" qms-group-options>\r\n <div class=\"text-label\">\r\n <span class=\"text-label label-item fs-14 \">\r\n {{ employee.name }}\r\n </span>\r\n <span *ngIf=\"employee.subName\" class=\"ms-1 sub-label\">({{employee.subName}})</span>\r\n </div>\r\n <small class=\"text-help px-1 fs-12 sub-label\">{{ employee.helpText }}</small>\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n <div [@inOutAnimation] *ngIf=\"!getPaging(personFiltered).length\" class=\"item-list-wrapper no-result\">\r\n <ng-container *ngTemplateOutlet=\"noResult\"></ng-container>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <qms-paginator *ngIf=\"personFiltered.length > 10\" [length]=\"personFiltered.length\"\r\n [numHidden]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 100]\" (page)='onPagingEvent($event)'\r\n [size]='PAGINATION_SIZE.medium'>\r\n </qms-paginator>\r\n </div>\r\n </mat-dialog-content>\r\n </form>\r\n </ng-container>\r\n\r\n <!-- UserGroup Access -->\r\n <ng-container *ngIf=\"optionSelect.value === OPTION_ENUM.USER_GROUP\">\r\n <form>\r\n <mat-dialog-content>\r\n <mat-form-field class=\"w-100\" qms-form qms-search-field>\r\n <input [formControl]=\"userGroupForm\" matInput type=\"text\" autocomplete=\"off\" placeholder=\"User group\" />\r\n <button [@inOutAnimation] *ngIf=\"!getLoading$.value\" (click)=\"onFilterUserGroup()\" qms-btn-icon color=\"light\" matSuffix>\r\n <mat-icon>search</mat-icon>\r\n </button>\r\n <mat-progress-spinner [@inOutAnimation] *ngIf=\"getLoading$.value\" matSuffix mode=\"indeterminate\" diameter=\"20\"></mat-progress-spinner>\r\n <div [@inOutAnimation] *ngIf=\"!!userGroupForm.value && !getLoading$.value\" matSuffix qms-input-clear>\r\n <button (click)=\"userGroupForm.setValue('')\" qms-btn-icon color=\"light\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </div>\r\n </mat-form-field>\r\n </mat-dialog-content>\r\n <mat-dialog-content class=\"items-list\">\r\n <div qms-scrollbar>\r\n <div class=\"item\">\r\n <mat-checkbox [disabled]=\"!userGroupFiltered.length\" #checkUserGroup class=\"w-100 checkbox-all mb-1\" color=\"default\"\r\n [checked]=\"isCheckAll(OPTION_ENUM.USER_GROUP)\"\r\n [indeterminate]=\"isIndeterminate(OPTION_ENUM.USER_GROUP)\"\r\n (click)=\"userGroupFiltered.length && onCheckAll(OPTION_ENUM.USER_GROUP,checkUserGroup)\" qms-group-options>\r\n <span class=\"text-label header-title\">{{LANG.CHOOSE_ALL}}</span>\r\n <span>(<b>{{getPaging(userGroupFiltered).length}}</b>)</span>\r\n </mat-checkbox>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <div *ngIf=\"getPaging(userGroupFiltered).length\" class=\"item-list-wrapper\">\r\n <div class=\"item mt-1\" *ngFor=\"let userGroup of getPaging(userGroupFiltered)\">\r\n <mat-checkbox (click)=\"onSelectUserGroup(userGroup)\" [checked]=\"userGroup.selected\" class=\"w-100\"\r\n color=\"default\" qms-group-options>\r\n <span class=\"text-label\">\r\n {{userGroup.name}}\r\n </span>\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n <div [@inOutAnimation] *ngIf=\"!getPaging(userGroupFiltered).length\" class=\"item-list-wrapper no-result\">\r\n <ng-container *ngTemplateOutlet=\"noResult\"></ng-container>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <qms-paginator *ngIf=\"userGroupFiltered.length > 10\" [length]=\"userGroupFiltered.length\" [numHidden]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 100]\" (page)='onPagingEvent($event)'\r\n [size]='PAGINATION_SIZE.medium'>\r\n </qms-paginator>\r\n </div>\r\n </mat-dialog-content>\r\n </form>\r\n </ng-container>\r\n\r\n <!-- Department Access -->\r\n <ng-container *ngIf=\"optionSelect.value === OPTION_ENUM.DEPARTMENT\" class=\"person-access\">\r\n <qms-select-department-tree\r\n #treeDepartment\r\n [treeData]=\"dataDialog.accessDepartments\"\r\n [selectIncludeLabel]=\"dataDialog.selectIncludeChildTreeLabel\"\r\n [enableIncludeChild]=\"true\"\r\n [enableTreeSearch]=\"true\"\r\n [selectedList]=\"resultAccess.departments\"\r\n (onSearchEvent)=\"onSearchDepartmentEvent.emit($event)\"\r\n (onValueChangeEvent)=\"onResultDepartmentChange($event)\"\r\n >\r\n </qms-select-department-tree>\r\n </ng-container>\r\n </div>\r\n <mat-divider *ngIf=\"optionSelect.value !== null\" class=\"mx-auto\"></mat-divider>\r\n <div *ngIf=\"optionSelect.value !== null\" class=\"header-title my-1\">{{LANG.RESULTS}}</div>\r\n\r\n <div *ngIf=\"optionSelect.value !== null\" class=\"result-selected-container\">\r\n <!-- Result Person -->\r\n <mat-expansion-panel qms-expansion [expanded]=\"optionSelect.value === OPTION_ENUM.PERSON\">\r\n <mat-expansion-panel-header>\r\n <div class=\"title-content\">\r\n <div class=\"qms-list-text\">\r\n <div qms-line color=\"default-subtitle\">{{LANG.PERSON}} <span\r\n class=\"fw-600\">({{resultAccess.persons.length}})</span>\r\n </div>\r\n </div>\r\n </div>\r\n </mat-expansion-panel-header>\r\n <mat-chip-list class=\"panel__item qms-scrollbar\">\r\n <mat-chip class=\"chip-item-result\" [qms-tool-tip]=\"item.name\" position=\"top\" mode=\"dark\"\r\n *ngFor=\"let item of resultAccess.persons; let i = index\" qms-chip [removable]=\"true\">\r\n <span qms-chip-body>\r\n <span class=\"text-label\">\r\n {{ item.name }}\r\n <span *ngIf=\"item.subName\">({{ item.subName }})</span>\r\n </span>\r\n </span>\r\n <mat-icon (click)=\"onRemoveChip(OPTION_ENUM.PERSON,i)\" class=\"remove-chip-icon\">cancel</mat-icon>\r\n </mat-chip>\r\n </mat-chip-list>\r\n </mat-expansion-panel>\r\n\r\n <!-- Result User group -->\r\n <mat-expansion-panel qms-expansion [expanded]=\"optionSelect.value === OPTION_ENUM.USER_GROUP\">\r\n <mat-expansion-panel-header>\r\n <div class=\"title-content\">\r\n <div class=\"qms-list-text\">\r\n <div qms-line color=\"default-subtitle\">{{LANG.USER_GROUP}}\r\n <span class=\"fw-600\">\r\n ({{resultAccess.userGroups.length}})\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </mat-expansion-panel-header>\r\n <mat-chip-list class=\"panel__item qms-scrollbar\">\r\n <mat-chip class=\"chip-item-result\" [qms-tool-tip]=\"item.name\" position=\"top\" mode=\"dark\"\r\n *ngFor=\"let item of resultAccess.userGroups; let i = index\" qms-chip [removable]=\"true\">\r\n <span qms-chip-body>\r\n <span class=\"text-label\">\r\n {{item.name}}\r\n <span *ngIf=\"item.subName\">({{ item.subName }})</span>\r\n </span>\r\n </span>\r\n <mat-icon (click)=\"onRemoveChip(OPTION_ENUM.USER_GROUP,i)\" class=\"remove-chip-icon\">cancel</mat-icon>\r\n </mat-chip>\r\n </mat-chip-list>\r\n </mat-expansion-panel>\r\n\r\n <!-- Result Department -->\r\n <mat-expansion-panel qms-expansion [expanded]=\"optionSelect.value === OPTION_ENUM.DEPARTMENT\">\r\n <mat-expansion-panel-header>\r\n <div class=\"title-content\">\r\n <div class=\"qms-list-text\">\r\n <div qms-line color=\"default-subtitle\">{{LANG.DEPARTMENT}}\r\n <span class=\"fw-600\">\r\n ({{resultAccess.departments.length}})\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </mat-expansion-panel-header>\r\n\r\n <mat-chip-list class=\"panel__item qms-scrollbar\">\r\n <mat-chip class=\"chip-item-result item-department\" [qms-tool-tip]=\"item.name\" position=\"top\" mode=\"dark\"\r\n *ngFor=\"let item of resultAccess.departments\" qms-chip [removable]=\"true\">\r\n <span (click)=\"onScollToNodeTreeDepartment(item)\" qms-chip-body>\r\n <span class=\"chip-item__content_name\" #itemName>\r\n {{item.name}}\r\n </span>\r\n <span class=\"chip-item-children__count ms-1\" *ngIf=\"item?.children\">\r\n {{item.children.length}}/{{item.childCount}}\r\n </span>\r\n </span>\r\n <mat-icon class=\"remove-chip-icon\" (click)=\"onRemoveTreeNodeDepartment(item)\">cancel</mat-icon>\r\n </mat-chip>\r\n </mat-chip-list>\r\n </mat-expansion-panel>\r\n </div>\r\n <!-- <mat-divider class=\"mx-auto\"></mat-divider> -->\r\n </div>\r\n <div qms-dialog-footer class=\"confirm__button__groups\" [class.none-option]=\"optionSelect.value === null\">\r\n <button *ngIf=\"optionSelect.value !== null\"\r\n [disabled]=\"!(!!resultAccess.departments.length || !!resultAccess.persons.length || !!resultAccess.userGroups.length)\"\r\n class=\"btn-add\"\r\n [class.qms-btn-disabled]=\"!(!!resultAccess.departments.length || !!resultAccess.persons.length || !!resultAccess.userGroups.length)\"\r\n [mat-dialog-close]=\"resultAccess\" qms-btn>\r\n <span>{{LANG.ADD}}</span>\r\n </button>\r\n <button qms-btn-text mat-dialog-close>\r\n {{LANG.CANCEL}}\r\n </button>\r\n </div>\r\n</div>\r\n\r\n<ng-template #noResult>\r\n <svg width=\"89\" height=\"88\" viewBox=\"0 0 89 88\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"0.5\" width=\"88\" height=\"88\" rx=\"44\" fill=\"white\"/>\r\n <rect x=\"0.5\" width=\"88\" height=\"88\" rx=\"44\" fill=\"#0163B2\" fill-opacity=\"0.12\"/>\r\n <path d=\"M44.5 56.6936L58.096 64.8996L54.488 49.4336L66.5 39.0276L50.682 37.6856L44.5 23.0996L38.318 37.6856L22.5 39.0276L34.512 49.4336L30.904 64.8996L44.5 56.6936Z\" fill=\"#0163B3\"/>\r\n </svg>\r\n</ng-template>\r\n<ng-template #loading>\r\n <mat-progress-spinner mode=\"indeterminate\" diameter=\"20\"></mat-progress-spinner>\r\n</ng-template>\r\n",
30300
+ template: "<div qms-dialog-container-v2 class=\"select-access-dialog-container\">\r\n <div qms-dialog-header>\r\n <div class=\"access-dialog-header mb-2\">\r\n <span class=\"header-title\">{{dialogData.titleDialog || LANG.SELECT_ACCESS}}</span>\r\n <button matDialogClose qms-btn-icon>\r\n <mat-icon class=\"mat-icons-outlined\">close</mat-icon>\r\n </button>\r\n </div>\r\n <mat-form-field *ngIf=\"options.length > 1\" qms-form qms-select-input class=\"field-select-option w-100\"\r\n appearance=\"fill\">\r\n <mat-label qms-select-input>{{LANG.TYPE}}</mat-label>\r\n <mat-select (selectionChange)=\"onSelectionTypeChange($event)\" [formControl]=\"optionSelect\" placeholder=\"Select\"\r\n disableOptionCentering #singleSelect panelClass=\"qms-select-panel\" qms-select>\r\n\r\n <mat-option *ngFor=\"let item of options\" [value]=\"item.type\">\r\n {{ LANG[item.displayName] }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n <div qms-dialog-content class=\"access-dialog-wraper\">\r\n <!-- Person Access -->\r\n <div class=\"option-selected-content\">\r\n <ng-container *ngIf=\"optionSelect.value === OPTION_ENUM.PERSON\">\r\n <form [formGroup]=\"personForm\">\r\n <mat-dialog-content>\r\n <div class=\"group-filter-person-option\">\r\n <mat-form-field class=\"w-100 input-option-filter\" qms-form>\r\n <mat-label qms-select-input>{{LANG.ROLE}}</mat-label>\r\n <mat-select panelClass=\"qms-select-panel\" qms-select disableOptionCentering formControlName=\"roleId\">\r\n <mat-option>\r\n <ngx-mat-select-search formControlName=\"roleFilter\" placeholderLabel=\"{{ LANG.ROLE }}\"\r\n noEntriesFoundLabel=\"\">\r\n </ngx-mat-select-search>\r\n </mat-option>\r\n <mat-option *ngFor=\"let item of filteredSearchTextBox.role | async\" [value]=\"item.id\">\r\n {{ item.name }}\r\n </mat-option>\r\n </mat-select>\r\n <!-- <mat-progress-spinner [@inOutAnimation] *ngIf=\"getLoading$.value\" matSuffix mode=\"indeterminate\" diameter=\"20\"></mat-progress-spinner> -->\r\n <span [@inOutAnimation] (click)=\"personForm.get('roleId').setValue('')\" class=\"pointer \" matSuffix\r\n aria-label=\"Clear\" *ngIf=\"personForm.get('roleId').value && !getLoading$.value\">\r\n <mat-icon>close</mat-icon>\r\n </span>\r\n </mat-form-field>\r\n\r\n <mat-form-field class=\"w-100 input-select-option\" qms-form qms-select-input>\r\n <mat-label>{{LANG.DEPARTMENT_UNIT}}</mat-label>\r\n <mat-select panelClass=\"qms-select-panel\" qms-select disableOptionCentering\r\n formControlName=\"departmentId\">\r\n <mat-option>\r\n <ngx-mat-select-search formControlName=\"departmentFilter\" [placeholderLabel]=\"LANG.DEPARTMENT_UNIT\"\r\n noEntriesFoundLabel=\"\">\r\n </ngx-mat-select-search>\r\n </mat-option>\r\n <mat-option *ngFor=\"let item of filteredSearchTextBox.department | async\" [value]=\"item.id\">\r\n {{item.name}}\r\n </mat-option>\r\n </mat-select>\r\n <span (click)=\"setFormControlValue(['recursive','departmentId'], [false,''])\" [@inOutAnimation]\r\n class=\"pointer\" matSuffix aria-label=\"Clear\"\r\n *ngIf=\"personForm.get('departmentId').value && !getLoading$.value\">\r\n <mat-icon>close</mat-icon>\r\n </span>\r\n </mat-form-field>\r\n </div>\r\n\r\n <mat-slide-toggle class=\"w-100 slide-toggle\" formControlName=\"recursive\"\r\n [disabled]=\"!this.personForm.controls['departmentId'].value\" color=\"default\" qms-group-options>\r\n <span class=\"text-label\">{{LANG.INCLUDE_SUB_DEPARTMENTS}}</span>\r\n </mat-slide-toggle>\r\n\r\n <mat-form-field class=\"w-100\" appearance=\"fill\" qms-form qms-search-field>\r\n <input matInput appearance=\"off\" [placeholder]=\"LANG.SEARCH_WITH_NAME\" formControlName=\"keyword\"\r\n type=\"text\" autocomplete=\"off\" />\r\n <button *ngIf=\"!getLoading$.value\" qms-btn-icon color=\"light\" [@inOutAnimation]\r\n (click)=\"onSearchPersonFreeText()\" class=\"pointer me-1\" matSuffix aria-label=\"Search\">\r\n <mat-icon>search</mat-icon>\r\n </button>\r\n <mat-progress-spinner [@inOutAnimation] *ngIf=\"getLoading$.value\" matSuffix mode=\"indeterminate\"\r\n diameter=\"20\"></mat-progress-spinner>\r\n <span [@inOutAnimation] (click)=\"personForm.get('keyword').setValue('')\"\r\n class=\"pointer btn-icon-clear d-flex justify-content-center align-items-center \" matSuffix\r\n aria-label=\"Clear\" *ngIf=\"personForm.get('keyword').value && !getLoading$.value\">\r\n <button qms-btn-icon color=\"light\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n <button (click)=\"onFilterPerson()\" qms-btn-outlined class=\"w-100 my-1\">\r\n {{LANG.FILTER}}\r\n </button>\r\n </mat-dialog-content>\r\n\r\n <mat-dialog-content class=\"items-list\">\r\n <div qms-scrollbar>\r\n <div class=\"item\">\r\n <mat-checkbox [@inOutAnimation] *ngIf=\"!getLoading$.value\"\r\n [disabled]=\"!personFiltered.length || dialogData.modeSelectOnePerson\" #checkPerson\r\n class=\"w-100 mb-1 checkbox-all\"\r\n (click)=\"personFiltered.length && onCheckAll(OPTION_ENUM.PERSON,checkPerson)\"\r\n [checked]=\"isCheckAll(OPTION_ENUM.PERSON)\" [indeterminate]=\"isIndeterminate(OPTION_ENUM.PERSON)\"\r\n color=\"default\" qms-group-options>\r\n <span class=\"text-label header-title\">{{LANG.CHOOSE_ALL}} </span>\r\n <span>(<b>{{getPaging(personFiltered).length}}</b>)</span>\r\n </mat-checkbox>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <ng-container *ngIf=\"getLoading$.value; then loading\">\r\n </ng-container>\r\n <div [@inOutAnimation] *ngIf=\"getPaging(personFiltered).length && !getLoading$.value\" [@listAnimation]\r\n class=\"item-list-wrapper\">\r\n <div class=\"item mt-1\" [@inOutAnimation]\r\n *ngFor=\"let employee of getPaging(personFiltered); trackBy: trackByFn\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"dialogData.modeSelectOnePerson ?itemWithoutCheckboxTemplate : itemCheckboxTemplate\"\r\n [ngTemplateOutletContext]=\"{item: employee, type: OPTION_ENUM.PERSON}\">\r\n </ng-container>\r\n </div>\r\n </div>\r\n <div [@inOutAnimation] *ngIf=\"!getPaging(personFiltered).length && !getLoading$.value\"\r\n class=\"item-list-wrapper no-result\">\r\n <ng-container *ngTemplateOutlet=\"noResult\"></ng-container>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <qms-paginator class=\"my-1\" *ngIf=\"personFiltered.length > 10 && !getLoading$.value\"\r\n [length]=\"personFiltered.length\" [numHidden]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 100]\"\r\n (page)='onPagingEvent($event)' [size]='PAGINATION_SIZE.medium'>\r\n </qms-paginator>\r\n </div>\r\n </mat-dialog-content>\r\n </form>\r\n </ng-container>\r\n\r\n <!-- UserGroup Access -->\r\n <ng-container *ngIf=\"optionSelect.value === OPTION_ENUM.USER_GROUP\">\r\n <form>\r\n <mat-dialog-content>\r\n <mat-form-field class=\"w-100\" qms-form qms-search-field>\r\n <input [formControl]=\"userGroupForm\" matInput type=\"text\" autocomplete=\"off\" placeholder=\"User group\" />\r\n <button [@inOutAnimation] *ngIf=\"!getLoading$.value\" (click)=\"onFilterUserGroup()\" qms-btn-icon\r\n color=\"light\" matSuffix>\r\n <mat-icon>search</mat-icon>\r\n </button>\r\n <mat-progress-spinner [@inOutAnimation] *ngIf=\"getLoading$.value\" matSuffix mode=\"indeterminate\"\r\n diameter=\"20\"></mat-progress-spinner>\r\n <div [@inOutAnimation] *ngIf=\"!!userGroupForm.value && !getLoading$.value\" matSuffix qms-input-clear>\r\n <button (click)=\"userGroupForm.setValue('')\" qms-btn-icon color=\"light\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </div>\r\n </mat-form-field>\r\n </mat-dialog-content>\r\n <mat-dialog-content class=\"items-list\">\r\n <div qms-scrollbar>\r\n <div class=\"item\">\r\n <mat-checkbox [@inOutAnimation] *ngIf=\"!getLoading$.value\"\r\n [disabled]=\"!userGroupFiltered.length || dialogData.modeSelectOneUserGroup\" #checkUserGroup\r\n class=\"w-100 checkbox-all mb-1\" color=\"default\" [checked]=\"isCheckAll(OPTION_ENUM.USER_GROUP)\"\r\n [indeterminate]=\"isIndeterminate(OPTION_ENUM.USER_GROUP)\"\r\n (click)=\"userGroupFiltered.length && onCheckAll(OPTION_ENUM.USER_GROUP,checkUserGroup)\"\r\n qms-group-options>\r\n <span class=\"text-label header-title\">{{LANG.CHOOSE_ALL}}</span>\r\n <span>(<b>{{getPaging(userGroupFiltered).length}}</b>)</span>\r\n </mat-checkbox>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <ng-container *ngIf=\"getLoading$.value;then loading\">\r\n </ng-container>\r\n <div *ngIf=\"getPaging(userGroupFiltered).length && !getLoading$.value\" [@listAnimation]\r\n class=\"item-list-wrapper\">\r\n <div [@inOutAnimation] class=\"item mt-1\" *ngFor=\"let userGroup of getPaging(userGroupFiltered)\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"dialogData.modeSelectOneUserGroup ?itemWithoutCheckboxTemplate : itemCheckboxTemplate\"\r\n [ngTemplateOutletContext]=\"{item: userGroup,type: OPTION_ENUM.USER_GROUP}\">\r\n </ng-container>\r\n </div>\r\n </div>\r\n <div [@inOutAnimation] *ngIf=\"!getPaging(userGroupFiltered).length && !getLoading$.value\"\r\n class=\"item-list-wrapper no-result\">\r\n <ng-container *ngTemplateOutlet=\"noResult\"></ng-container>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n <qms-paginator class=\"my-1\" *ngIf=\"userGroupFiltered.length > 10 && !getLoading$.value\"\r\n [length]=\"userGroupFiltered.length\" [numHidden]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 100]\"\r\n (page)='onPagingEvent($event)' [size]='PAGINATION_SIZE.medium'>\r\n </qms-paginator>\r\n </div>\r\n </mat-dialog-content>\r\n </form>\r\n </ng-container>\r\n\r\n <!-- Department Access -->\r\n <ng-container *ngIf=\"optionSelect.value === OPTION_ENUM.DEPARTMENT\" class=\"person-access\">\r\n <qms-select-department-tree #treeDepartment [treeData]=\"dialogData.data.accessDepartments\"\r\n [selectIncludeLabel]=\"dialogData.treeDepartmentConfig.selectIncludeChildLabel\"\r\n [enableIncludeChild]=\"dialogData.treeDepartmentConfig.enableIncludeChild\"\r\n [enableTreeSearch]=\"dialogData.treeDepartmentConfig.enableTreeSearch\"\r\n [isSelectOne]=\"dialogData.modeSelectOneDepartment\" [selectedList]=\"resultAccess.departments\"\r\n (onSearchEvent)=\"onSearchDepartmentEvent.emit($event)\"\r\n (onValueChangeEvent)=\"onResultDepartmentChange($event)\">\r\n </qms-select-department-tree>\r\n </ng-container>\r\n </div>\r\n <mat-divider *ngIf=\"optionSelect.value !== null\" class=\"mx-auto\"></mat-divider>\r\n <div [@inOutAnimation]\r\n *ngIf=\"(options.length === 1 && hasItemSelected()) || (options.length > 1 && optionSelect.value !== null)\"\r\n class=\"header-title my-1\">\r\n {{\r\n dialogData.titleResult || LANG.RESULTS}}\r\n <span *ngIf=\"options.length === 1 && hasItemSelected()\">\r\n ({{getResultTabActive().length}})\r\n </span>\r\n </div>\r\n <div *ngIf=\"optionSelect.value !== null\" class=\"result-selected-container\">\r\n <!-- Result Person -->\r\n <ng-container *ngIf=\"checkExistOptionSelect(OPTION_ENUM.PERSON)\"\r\n [ngTemplateOutlet]=\"options.length == 1 ? listChip : viewResultCollapse\"\r\n [ngTemplateOutletContext]=\"{data:resultAccess.persons, type:OPTION_ENUM.PERSON, title:LANG.PERSON}\">\r\n </ng-container>\r\n <!-- Result User group -->\r\n <ng-container *ngIf=\"checkExistOptionSelect(OPTION_ENUM.USER_GROUP)\"\r\n [ngTemplateOutlet]=\"options.length == 1 ? listChip : viewResultCollapse\"\r\n [ngTemplateOutletContext]=\"{data:resultAccess.userGroups, type:OPTION_ENUM.USER_GROUP, title:LANG.USER_GROUP}\">\r\n </ng-container>\r\n <!-- Result Department -->\r\n <ng-container *ngIf=\"checkExistOptionSelect(OPTION_ENUM.DEPARTMENT)\"\r\n [ngTemplateOutlet]=\"options.length == 1 ? listChip : viewResultCollapse\"\r\n [ngTemplateOutletContext]=\"{data:resultAccess.departments, type:OPTION_ENUM.DEPARTMENT, title:LANG.DEPARTMENT}\">\r\n </ng-container>\r\n </div>\r\n <mat-divider class=\"mx-auto\"></mat-divider>\r\n </div>\r\n <div qms-dialog-footer class=\"confirm__button__groups\" [class.none-option]=\"optionSelect.value === null\">\r\n <button *ngIf=\"optionSelect.value !== null\" [disabled]=\"!hasItemSelected()\" class=\"btn-add\"\r\n [class.qms-btn-disabled]=\"!hasItemSelected()\" [mat-dialog-close]=\"resultAccess\" qms-btn>\r\n <span>{{LANG.ADD}}</span>\r\n </button>\r\n <button qms-btn-text mat-dialog-close>\r\n {{LANG.CANCEL}}\r\n </button>\r\n </div>\r\n</div>\r\n\r\n<!-- Template -->\r\n<ng-template #noResult>\r\n <svg width=\"89\" height=\"88\" viewBox=\"0 0 89 88\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"0.5\" width=\"88\" height=\"88\" rx=\"44\" fill=\"white\" />\r\n <rect x=\"0.5\" width=\"88\" height=\"88\" rx=\"44\" fill=\"#0163B2\" fill-opacity=\"0.12\" />\r\n <path\r\n d=\"M44.5 56.6936L58.096 64.8996L54.488 49.4336L66.5 39.0276L50.682 37.6856L44.5 23.0996L38.318 37.6856L22.5 39.0276L34.512 49.4336L30.904 64.8996L44.5 56.6936Z\"\r\n fill=\"#0163B3\" />\r\n </svg>\r\n</ng-template>\r\n\r\n<!-- Template list chip -->\r\n<ng-template #listChip let-data=\"data\" let-type=\"type\">\r\n <mat-chip-list class=\"panel__item qms-scrollbar\">\r\n <mat-chip class=\"chip-item-result\" [qms-tool-tip]=\"item?.tooltip || item.name\" position=\"top\" mode=\"dark\"\r\n *ngFor=\"let item of data; let i = index\" qms-chip [removable]=\"true\">\r\n <span qms-chip-body>\r\n <span class=\"text-label\">\r\n {{item.name}}\r\n <span *ngIf=\"item.subName\">({{ item.subName }})</span>\r\n </span>\r\n <span class=\"chip-item-children__count ms-1\" *ngIf=\"item?.children\">\r\n {{item.children.length}}/{{item.childCount}}\r\n </span>\r\n </span>\r\n <mat-icon (click)=\"onRemoveChip(type,item, i)\" class=\"remove-chip-icon\">cancel</mat-icon>\r\n </mat-chip>\r\n </mat-chip-list>\r\n</ng-template>\r\n\r\n<!-- Template result with collapse -->\r\n<ng-template #viewResultCollapse let-title=\"title\" let-data=\"data\" let-type=\"type\">\r\n <mat-expansion-panel qms-expansion [expanded]=\"optionSelect.value === type\">\r\n <mat-expansion-panel-header>\r\n <div class=\"title-content\">\r\n <div class=\"qms-list-text\">\r\n <div qms-line color=\"default-subtitle\">{{title}}\r\n <span class=\"fw-600\">\r\n ({{data.length}})\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </mat-expansion-panel-header>\r\n <ng-container [ngTemplateOutlet]=\"listChip\" [ngTemplateOutletContext]=\"{data: data,type: type}\">\r\n </ng-container>\r\n </mat-expansion-panel>\r\n</ng-template>\r\n\r\n<!-- Template row without checkbox -->\r\n<ng-template #itemWithoutCheckboxTemplate let-item=\"item\" let-type=\"type\">\r\n <div (click)=\"onSelectItem(type,item)\" class=\"item-without-checkbox w-100\" [class.active]=\"item.selected\">\r\n <div class=\"item-content\">\r\n <div class=\"text-label\">\r\n <span class=\"text-label label-item fs-14 \">\r\n {{ item.name }}\r\n </span>\r\n <span *ngIf=\"item.subName\" class=\"ms-1 sub-label\">({{item.subName}})</span>\r\n </div>\r\n <small *ngIf=\"item.helpText\" class=\"text-help px-1 fs-12 sub-label\">{{ item.helpText }}</small>\r\n </div>\r\n <div class=\"item-state\">\r\n <mat-icon [@inOutAnimation] *ngIf=\"item.selected\">check</mat-icon>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<!-- Template checkbox -->\r\n<ng-template #itemCheckboxTemplate let-item=\"item\" let-type=\"type\">\r\n <mat-checkbox [checked]=\"item.selected\" (click)=\"onSelectItem(type,item)\" class=\"w-100\" color=\"default\"\r\n qms-group-options>\r\n <div class=\"text-label\">\r\n <span class=\"text-label label-item fs-14 \">\r\n {{ item.name }}\r\n </span>\r\n <span *ngIf=\"item.subName\" class=\"ms-1 sub-label\">({{item.subName}})</span>\r\n </div>\r\n <small *ngIf=\"item.helpText\" class=\"text-help px-1 fs-12 sub-label\">{{ item.helpText }}</small>\r\n </mat-checkbox>\r\n</ng-template>\r\n\r\n<!-- Template loading -->\r\n<ng-template #loading>\r\n <div class=\"loading-container\">\r\n <div class=\"loader\" *ngFor=\"let item of [1,1,1,1]\">\r\n <div class=\"loader__wrapper\">\r\n <div class=\"row-loader\">\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-template>\r\n",
30115
30301
  animations: [SelectAccessAnimationTrigger],
30116
30302
  providers: [
30117
30303
  {
@@ -30120,15 +30306,14 @@ QMSSelectAccessDialogComponent.decorators = [
30120
30306
  }
30121
30307
  ],
30122
30308
  encapsulation: ViewEncapsulation.None,
30123
- styles: ["@charset \"UTF-8\";@font-face{font-family:icomoon;src:url(../assets/fonts/icomoon.eot?aghldx);src:url(../assets/fonts/icomoon.eot?aghldx#iefix) format(\"embedded-opentype\"),url(../assets/fonts/icomoon.ttf?aghldx) format(\"truetype\"),url(../assets/fonts/icomoon.woff?aghldx) format(\"woff\"),url(../assets/fonts/icomoon.svg?aghldx#icomoon) format(\"svg\");font-weight:400;font-style:normal;font-display:block}[class^=icon-]{font-family:icomoon!important;speak:never;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-acutely-toxic .path1:before{content:\"\uE91B\";color:#e32730}.icon-acutely-toxic .path2:before{content:\"\uE922\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path3:before{content:\"\uE923\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path4:before{content:\"\uE924\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path5:before{content:\"\uE925\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path6:before{content:\"\uE926\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path7:before{content:\"\uE927\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path8:before{content:\"\uE928\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path9:before{content:\"\uE929\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path10:before{content:\"\uE92A\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path11:before{content:\"\uE92B\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path12:before{content:\"\uE92C\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path13:before{content:\"\uE92D\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path14:before{content:\"\uE92E\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path15:before{content:\"\uE92F\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path16:before{content:\"\uE930\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path17:before{content:\"\uE931\";margin-left:-1em;color:#323232}.icon-add-column:before{content:\"\uE932\"}.icon-add-tooltip:before{content:\"\uE933\"}.icon-admin:before{content:\"\uE934\"}.icon-annual-cycle:before{content:\"\uE935\"}.icon-assignment-repete:before{content:\"\uE936\"}.icon-barrier-add:before{content:\"\uE937\"}.icon-barrier-edit:before{content:\"\uE938\"}.icon-barrier-view:before{content:\"\uE939\"}.icon-button-group:before{content:\"\uE93A\"}.icon-chemical-manager:before{content:\"\uE93B\"}.icon-chronic-health-hazard .path1:before{content:\"\uE93C\";color:#e32730}.icon-chronic-health-hazard .path2:before{content:\"\uE93D\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path3:before{content:\"\uE93E\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path4:before{content:\"\uE93F\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path5:before{content:\"\uE940\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path6:before{content:\"\uE941\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path7:before{content:\"\uE942\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path8:before{content:\"\uE943\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path9:before{content:\"\uE944\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path10:before{content:\"\uE945\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path11:before{content:\"\uE946\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path12:before{content:\"\uE947\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path13:before{content:\"\uE948\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path14:before{content:\"\uE949\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path15:before{content:\"\uE94A\";margin-left:-1em;color:#323232}.icon-contingency:before{content:\"\uE94B\"}.icon-corrosive .path1:before{content:\"\uE94C\";color:#323232}.icon-corrosive .path2:before{content:\"\uE94D\";margin-left:-1em;color:#323232}.icon-corrosive .path3:before{content:\"\uE94E\";margin-left:-1em;color:#323232}.icon-corrosive .path4:before{content:\"\uE94F\";margin-left:-1em;color:#323232}.icon-corrosive .path5:before{content:\"\uE950\";margin-left:-1em;color:#323232}.icon-corrosive .path6:before{content:\"\uE951\";margin-left:-1em;color:#323232}.icon-corrosive .path7:before{content:\"\uE952\";margin-left:-1em;color:#323232}.icon-corrosive .path8:before{content:\"\uE953\";margin-left:-1em;color:#323232}.icon-corrosive .path9:before{content:\"\uE954\";margin-left:-1em;color:#323232}.icon-corrosive .path10:before{content:\"\uE955\";margin-left:-1em;color:#323232}.icon-corrosive .path11:before{content:\"\uE956\";margin-left:-1em;color:#323232}.icon-corrosive .path12:before{content:\"\uE957\";margin-left:-1em;color:#323232}.icon-corrosive .path13:before{content:\"\uE958\";margin-left:-1em;color:#323232}.icon-corrosive .path14:before{content:\"\uE959\";margin-left:-1em;color:#323232}.icon-corrosive .path15:before{content:\"\uE95A\";margin-left:-1em;color:#323232}.icon-corrosive .path16:before{content:\"\uE95B\";margin-left:-1em;color:#323232}.icon-corrosive .path17:before{content:\"\uE95C\";margin-left:-1em;color:#323232}.icon-corrosive .path18:before{content:\"\uE95D\";margin-left:-1em;color:#323232}.icon-corrosive .path19:before{content:\"\uE95E\";margin-left:-1em;color:#323232}.icon-corrosive .path20:before{content:\"\uE95F\";margin-left:-1em;color:#323232}.icon-corrosive .path21:before{content:\"\uE960\";margin-left:-1em;color:#e32730}.icon-dashboard:before{content:\"\uE961\"}.icon-database-sds:before{content:\"\uE962\"}.icon-description-add:before{content:\"\uE963\"}.icon-description-edit:before{content:\"\uE964\"}.icon-description-view:before{content:\"\uE965\";color:#666}.icon-document-read .path1:before{content:\"\uE966\";color:#000;opacity:.6}.icon-document-read .path2:before{content:\"\uE967\";margin-left:-1em;color:#fff}.icon-document-read .path3:before{content:\"\uE968\";margin-left:-1em;color:#000;opacity:.6}.icon-draft:before{content:\"\uE969\"}.icon-expired-off:before{content:\"\uE96A\"}.icon-expired-on:before{content:\"\uE96B\"}.icon-explosive .path1:before{content:\"\uE96C\";color:#e32730}.icon-explosive .path2:before{content:\"\uE96D\";margin-left:-1em;color:#323232}.icon-explosive .path3:before{content:\"\uE96E\";margin-left:-1em;color:#323232}.icon-explosive .path4:before{content:\"\uE96F\";margin-left:-1em;color:#323232}.icon-explosive .path5:before{content:\"\uE970\";margin-left:-1em;color:#323232}.icon-explosive .path6:before{content:\"\uE971\";margin-left:-1em;color:#323232}.icon-explosive .path7:before{content:\"\uE972\";margin-left:-1em;color:#323232}.icon-explosive .path8:before{content:\"\uE973\";margin-left:-1em;color:#323232}.icon-explosive .path9:before{content:\"\uE974\";margin-left:-1em;color:#323232}.icon-explosive .path10:before{content:\"\uE975\";margin-left:-1em;color:#323232}.icon-explosive .path11:before{content:\"\uE976\";margin-left:-1em;color:#323232}.icon-explosive .path12:before{content:\"\uE977\";margin-left:-1em;color:#323232}.icon-explosive .path13:before{content:\"\uE978\";margin-left:-1em;color:#323232}.icon-explosive .path14:before{content:\"\uE979\";margin-left:-1em;color:#323232}.icon-explosive .path15:before{content:\"\uE97A\";margin-left:-1em;color:#323232}.icon-explosive .path16:before{content:\"\uE97B\";margin-left:-1em;color:#323232}.icon-explosive .path17:before{content:\"\uE97C\";margin-left:-1em;color:#323232}.icon-explosive .path18:before{content:\"\uE97D\";margin-left:-1em;color:#323232}.icon-explosive .path19:before{content:\"\uE97E\";margin-left:-1em;color:#323232}.icon-explosive .path20:before{content:\"\uE97F\";margin-left:-1em;color:#323232}.icon-explosive .path21:before{content:\"\uE980\";margin-left:-1em;color:#323232}.icon-explosive .path22:before{content:\"\uE981\";margin-left:-1em;color:#323232}.icon-explosive .path23:before{content:\"\uE982\";margin-left:-1em;color:#323232}.icon-explosive .path24:before{content:\"\uE983\";margin-left:-1em;color:#323232}.icon-explosive .path25:before{content:\"\uE984\";margin-left:-1em;color:#323232}.icon-explosive .path26:before{content:\"\uE985\";margin-left:-1em;color:#323232}.icon-explosive .path27:before{content:\"\uE986\";margin-left:-1em;color:#323232}.icon-explosive .path28:before{content:\"\uE987\";margin-left:-1em;color:#323232}.icon-explosive .path29:before{content:\"\uE988\";margin-left:-1em;color:#323232}.icon-explosive .path30:before{content:\"\uE989\";margin-left:-1em;color:#323232}.icon-explosive .path31:before{content:\"\uE98A\";margin-left:-1em;color:#323232}.icon-explosive .path32:before{content:\"\uE98B\";margin-left:-1em;color:#323232}.icon-explosive .path33:before{content:\"\uE98C\";margin-left:-1em;color:#323232}.icon-explosive .path34:before{content:\"\uE98D\";margin-left:-1em;color:#323232}.icon-explosive .path35:before{content:\"\uE98E\";margin-left:-1em;color:#323232}.icon-explosive .path36:before{content:\"\uE98F\";margin-left:-1em;color:#323232}.icon-explosive .path37:before{content:\"\uE990\";margin-left:-1em;color:#323232}.icon-explosive .path38:before{content:\"\uE991\";margin-left:-1em;color:#323232}.icon-explosive .path39:before{content:\"\uE992\";margin-left:-1em;color:#323232}.icon-explosive .path40:before{content:\"\uE993\";margin-left:-1em;color:#323232}.icon-explosive .path41:before{content:\"\uE994\";margin-left:-1em;color:#323232}.icon-explosive .path42:before{content:\"\uE995\";margin-left:-1em;color:#323232}.icon-explosive .path43:before{content:\"\uE996\";margin-left:-1em;color:#323232}.icon-explosive .path44:before{content:\"\uE997\";margin-left:-1em;color:#323232}.icon-explosive .path45:before{content:\"\uE998\";margin-left:-1em;color:#323232}.icon-explosive .path46:before{content:\"\uE999\";margin-left:-1em;color:#323232}.icon-file-excel:before{content:\"\uE99A\"}.icon-file-pdf:before{content:\"\uE99B\"}.icon-file-pdf-verified .path1:before{content:\"\uE99C\";color:#000;opacity:.6}.icon-file-pdf-verified .path2:before{content:\"\uE99D\";margin-left:-1em;color:#fff}.icon-file-pdf-verified .path3:before{content:\"\uE99E\";margin-left:-1em;color:#000;opacity:.6}.icon-file-word:before{content:\"\uE99F\"}.icon-filter-alt:before{content:\"\uE9A0\"}.icon-flammable .path1:before{content:\"\uE9A1\";color:#323232}.icon-flammable .path2:before{content:\"\uE9A2\";margin-left:-1em;color:#323232}.icon-flammable .path3:before{content:\"\uE9A3\";margin-left:-1em;color:#e32730}.icon-gas-under-pressure .path1:before{content:\"\uE9A4\";color:#323232}.icon-gas-under-pressure .path2:before{content:\"\uE9A5\";margin-left:-1em;color:#e32730}.icon-health-hazard .path1:before{content:\"\uE9A6\";color:#323232}.icon-health-hazard .path2:before{content:\"\uE9A7\";margin-left:-1em;color:#e32730}.icon-line-break:before{content:\"\uE9A8\"}.icon-location:before{content:\"\uE9A9\"}.icon-measure-add:before{content:\"\uE9AA\"}.icon-measure-edit:before{content:\"\uE9AB\"}.icon-measure-view:before{content:\"\uE9AC\";color:#666}.icon-messages:before{content:\"\uE9AD\"}.icon-monitoring:before{content:\"\uE9AE\";color:#666}.icon-move:before{content:\"\uE9AF\"}.icon-oxidizing .path1:before{content:\"\uE9B0\";color:#e32730}.icon-oxidizing .path2:before{content:\"\uE9B1\";margin-left:-1em;color:#323232}.icon-oxidizing .path3:before{content:\"\uE9B2\";margin-left:-1em;color:#323232}.icon-oxidizing .path4:before{content:\"\uE9B3\";margin-left:-1em;color:#323232}.icon-process-area-closed:before{content:\"\uE9B4\"}.icon-process-area-open:before{content:\"\uE9B5\"}.icon-process-linked .path1:before{content:\"\uE9B6\";color:#000;opacity:.6}.icon-process-linked .path2:before{content:\"\uE9B7\";margin-left:-1em;color:#666}.icon-risk:before{content:\"\uE9B8\"}.icon-search-in-file:before{content:\"\uE9B9\"}.icon-sort-ascending:before{content:\"\uE9BA\"}.icon-sort-descending:before{content:\"\uE9BB\"}.icon-subscript:before{content:\"\uE9BC\"}.icon-superscript:before{content:\"\uE9BD\"}.icon-syncronice-favorites:before{content:\"\uE9BE\"}.icon-system-settings:before{content:\"\uE9BF\"}.icon-view-three-outlined:before{content:\"\uE9C0\"}.icon-workplace-safety:before{content:\"\uE9C1\"}.icon-checklist:before{content:\"\uE900\"}.icon-department-document .path1:before{content:\"\uE901\";color:#000;opacity:.6}.icon-department-document .path2:before{content:\"\uE902\";margin-left:-1em;color:#00804c}.icon-department-folder-closed .path1:before{content:\"\uE903\";color:#000;opacity:.6}.icon-department-folder-closed .path2:before{content:\"\uE904\";margin-left:-1em;color:#00804c}.icon-department-folder-open .path1:before{content:\"\uE905\";color:#000;opacity:.6}.icon-department-folder-open .path2:before{content:\"\uE906\";margin-left:-1em;color:#00804c}.icon-deviation:before{content:\"\uE907\"}.icon-dropdown-folder .path1:before{content:\"\uE908\";color:#00324e}.icon-dropdown-folder .path2:before{content:\"\uE909\";margin-left:-1em;color:#fff;opacity:.6}.icon-enterprise-document .path1:before{content:\"\uE90A\";color:#000;opacity:.6}.icon-enterprise-document .path2:before{content:\"\uE90B\";margin-left:-1em;color:#cf4714}.icon-enterprise-folder-closed .path1:before{content:\"\uE90C\";color:#000;opacity:.6}.icon-enterprise-folder-closed .path2:before{content:\"\uE90D\";margin-left:-1em;color:#cf4714}.icon-enterprise-folder-open .path1:before{content:\"\uE90E\";color:#000;opacity:.6}.icon-enterprise-folder-open .path2:before{content:\"\uE90F\";margin-left:-1em;color:#cf4714}.icon-folder-closed:before{content:\"\uE910\"}.icon-folder-open:before{content:\"\uE911\"}.icon-keyboard_arrow_down:before{content:\"\uE912\"}.icon-keyboard_arrow_up:before{content:\"\uE913\"}.icon-local-document .path1:before{content:\"\uE914\";color:#000;opacity:.6}.icon-local-document .path2:before{content:\"\uE915\";margin-left:-1em;color:#1954a9}.icon-local-folder-closed .path1:before{content:\"\uE916\";color:#000;opacity:.6}.icon-local-folder-closed .path2:before{content:\"\uE917\";margin-left:-1em;color:#1954a9}.icon-local-folder-open .path1:before{content:\"\uE918\";color:#000;opacity:.6}.icon-local-folder-open .path2:before{content:\"\uE919\";margin-left:-1em;color:#1954a9}.icon-process:before{content:\"\uE91A\"}.icon-regional-document .path1:before{content:\"\uE91C\";color:#000;opacity:.6}.icon-regional-document .path2:before{content:\"\uE91D\";margin-left:-1em;color:#662e0d}.icon-regional-folder-closed .path1:before{content:\"\uE91E\";color:#000;opacity:.6}.icon-regional-folder-closed .path2:before{content:\"\uE91F\";margin-left:-1em;color:#662e0d}.icon-regional-folder-open .path1:before{content:\"\uE920\";color:#000;opacity:.6}.icon-regional-folder-open .path2:before{content:\"\uE921\";margin-left:-1em;color:#662e0d}.select-access-dialog-container{font-family:Open Sans}.select-access-dialog-container .mat-expansion-panel .mat-expansion-panel-body{padding-top:0!important}.select-access-dialog-container .mat-expansion-panel-header{font-size:12px!important;font-weight:800!important}.select-access-dialog-container .w-100{width:100%}.select-access-dialog-container .h-100{height:100%}.select-access-dialog-container .pointer{cursor:pointer}.select-access-dialog-container .fw-600{font-weight:600}.select-access-dialog-container .label-item{font-weight:600;color:var(--ws-text-primary)}.select-access-dialog-container .sub-label{color:var(--ws-text-secondary)}.select-access-dialog-container .fs-14{font-size:14px}.select-access-dialog-container .fs-12{font-size:12px}.select-access-dialog-container .header-title{font-weight:600;color:var(--ws-text-primary);font-size:16px}.select-access-dialog-container .chip-item-result{max-width:250px}.select-access-dialog-container .chip-item-result.item-department .qms-chip-body{display:flex;justify-content:center;align-items:center}.select-access-dialog-container .remove-chip-icon{color:rgba(0,0,0,.3);cursor:pointer}.select-access-dialog-container .remove-chip-icon:hover{color:rgba(0,0,0,.7)}.select-access-dialog-container .mat-form-field-wrapper{padding-bottom:5px!important}.select-access-dialog-container .mat-expansion-panel{border-radius:unset!important}.select-access-dialog-container .mat-expansion-panel-header:not([aria-disabled=true]){background:unset}.select-access-dialog-container .mat-expansion-panel.mat-expanded .mat-expansion-panel-header{background:#e5eefb}.select-access-dialog-container .mat-expansion-panel.mat-expanded .mat-expansion-panel-header .qms-line{color:var(--primary-light)!important}.select-access-dialog-container .access-dialog-header{display:flex;justify-content:space-between;align-items:center}.select-access-dialog-container .access-dialog-wraper{width:100%}.select-access-dialog-container .access-dialog-wraper .field-select-option .mat-form-field-wrapper{padding-bottom:16px!important}.select-access-dialog-container .access-dialog-wraper .field-select-option .mat-form-field-underline{bottom:16px!important}.select-access-dialog-container .mat-chip-list-wrapper{margin:unset!important}.select-access-dialog-container .result-selected-container{max-height:175px;overflow-y:auto}.select-access-dialog-container .item-list-wrapper{max-height:28vh;padding-right:4px;overflow-y:auto}.select-access-dialog-container .item-list-wrapper.no-result{height:28vh;display:flex;justify-content:center;align-items:center}.select-access-dialog-container .item-list-wrapper .item{min-height:40px}.select-access-dialog-container .confirm__button__groups .btn-add>.qms-btn-wrapper{display:flex;justify-content:center;align-items:center}.select-access-dialog-container .option-selected-content .group-filter-person-option{display:flex;flex-direction:row-reverse;justify-content:center;align-items:center;grid-gap:8px;gap:8px}.select-access-dialog-container span.chip-item__content_name{display:inline-block;max-width:175px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.select-access-dialog-container span.chip-item-children__count{font-size:.75rem;color:rgba(0,0,0,.5);font-weight:600}.select-access-dialog-container .mat-slide-toggle.qms-group-options{padding:unset!important}.select-access-dialog-container .input-option-filter .mat-form-field-wrapper{padding-bottom:8px!important}.select-access-dialog-container .input-option-filter .mat-form-field-underline{bottom:8px!important}.select-access-dialog-container .slide-toggle{margin-bottom:8px}.select-access-dialog-container .confirm__button__groups.none-option{margin-top:85px}.select-access-dialog-container .btn-icon-clear{position:relative;padding:0 1rem}.select-access-dialog-container .btn-icon-clear .qms-btn-icon{margin-right:unset!important}.select-access-dialog-container .btn-icon-clear:after{position:absolute;content:\"\";left:0;top:0;height:100%;width:1px;background:rgba(0,0,0,.3)}.select-access-dialog-container .qms-paginator .mat-icon{display:flex;align-items:center;justify-content:center}.select-access-dialog-container .qms-paginator .mat-form-field-wrapper{padding-bottom:0}.select-access-dialog-container .qms-paginator .mat-paginator-container{min-height:40px}.select-access-dialog-container .qms-paginator .mat-paginator-container .qms-total-result{margin-bottom:2px;margin-right:12px;height:30px}.select-access-dialog-container .qms-paginator .mat-paginator-container .qms-total-result span{font-weight:600;font-size:13px;color:rgba(0,0,0,.8)}.select-access-dialog-container .qms-paginator .mat-paginator-container .qms-paginator-range-actions{margin-bottom:0;grid-column-gap:2px;-moz-column-gap:2px;column-gap:2px}.select-access-dialog-container .qms-paginator .mat-paginator-container .qms-paginator-range-actions>.qms-total-result{margin-bottom:0}.select-access-dialog-container .qms-paginator .mat-paginator-container .qms-paginator-range-actions>.qms-btn-icon{width:30px;height:30px;line-height:30px}.select-access-dialog-container .qms-paginator>.qms-btn-icon-wrapper{width:30px;height:30px;display:flex;justify-content:center;align-items:center}.select-access-dialog-container .qms-paginator .qms-paginator-page-size{margin-right:12px}.select-access-dialog-container .qms-paginator .qms-paginator-page-size>.qms-pagesize-label{display:none}.select-access-dialog-container .qms-paginator .qms-paginator-page-size>.qms-form-page-size .mat-form-field-flex{width:60px!important;height:30px;display:flex;align-items:center;padding:0 4px}.select-access-dialog-container .qms-paginator .qms-paginator-page-size>.qms-form-page-size .mat-form-field-flex .mat-form-field-infix{height:30px}.select-access-dialog-container .qms-paginator .mat-form-field.qms-form .mat-select-min-line,.select-access-dialog-container .qms-paginator .mat-form-field.qms-form mat-select-trigger{font-size:14px}.select-access-dialog-container .qms-paginator .mat-select-value{text-align:center}.select-access-dialog-container .mat-checkbox.checkbox-all .mat-checkbox-label{flex-direction:row!important;align-items:center!important;grid-column-gap:4px!important;-moz-column-gap:4px!important;column-gap:4px!important}"]
30309
+ styles: ["@charset \"UTF-8\";@font-face{font-family:icomoon;src:url(../assets/fonts/icomoon.eot?aghldx);src:url(../assets/fonts/icomoon.eot?aghldx#iefix) format(\"embedded-opentype\"),url(../assets/fonts/icomoon.ttf?aghldx) format(\"truetype\"),url(../assets/fonts/icomoon.woff?aghldx) format(\"woff\"),url(../assets/fonts/icomoon.svg?aghldx#icomoon) format(\"svg\");font-weight:400;font-style:normal;font-display:block}[class^=icon-]{font-family:icomoon!important;speak:never;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-acutely-toxic .path1:before{content:\"\uE91B\";color:#e32730}.icon-acutely-toxic .path2:before{content:\"\uE922\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path3:before{content:\"\uE923\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path4:before{content:\"\uE924\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path5:before{content:\"\uE925\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path6:before{content:\"\uE926\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path7:before{content:\"\uE927\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path8:before{content:\"\uE928\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path9:before{content:\"\uE929\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path10:before{content:\"\uE92A\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path11:before{content:\"\uE92B\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path12:before{content:\"\uE92C\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path13:before{content:\"\uE92D\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path14:before{content:\"\uE92E\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path15:before{content:\"\uE92F\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path16:before{content:\"\uE930\";margin-left:-1em;color:#323232}.icon-acutely-toxic .path17:before{content:\"\uE931\";margin-left:-1em;color:#323232}.icon-add-column:before{content:\"\uE932\"}.icon-add-tooltip:before{content:\"\uE933\"}.icon-admin:before{content:\"\uE934\"}.icon-annual-cycle:before{content:\"\uE935\"}.icon-assignment-repete:before{content:\"\uE936\"}.icon-barrier-add:before{content:\"\uE937\"}.icon-barrier-edit:before{content:\"\uE938\"}.icon-barrier-view:before{content:\"\uE939\"}.icon-button-group:before{content:\"\uE93A\"}.icon-chemical-manager:before{content:\"\uE93B\"}.icon-chronic-health-hazard .path1:before{content:\"\uE93C\";color:#e32730}.icon-chronic-health-hazard .path2:before{content:\"\uE93D\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path3:before{content:\"\uE93E\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path4:before{content:\"\uE93F\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path5:before{content:\"\uE940\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path6:before{content:\"\uE941\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path7:before{content:\"\uE942\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path8:before{content:\"\uE943\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path9:before{content:\"\uE944\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path10:before{content:\"\uE945\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path11:before{content:\"\uE946\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path12:before{content:\"\uE947\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path13:before{content:\"\uE948\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path14:before{content:\"\uE949\";margin-left:-1em;color:#323232}.icon-chronic-health-hazard .path15:before{content:\"\uE94A\";margin-left:-1em;color:#323232}.icon-contingency:before{content:\"\uE94B\"}.icon-corrosive .path1:before{content:\"\uE94C\";color:#323232}.icon-corrosive .path2:before{content:\"\uE94D\";margin-left:-1em;color:#323232}.icon-corrosive .path3:before{content:\"\uE94E\";margin-left:-1em;color:#323232}.icon-corrosive .path4:before{content:\"\uE94F\";margin-left:-1em;color:#323232}.icon-corrosive .path5:before{content:\"\uE950\";margin-left:-1em;color:#323232}.icon-corrosive .path6:before{content:\"\uE951\";margin-left:-1em;color:#323232}.icon-corrosive .path7:before{content:\"\uE952\";margin-left:-1em;color:#323232}.icon-corrosive .path8:before{content:\"\uE953\";margin-left:-1em;color:#323232}.icon-corrosive .path9:before{content:\"\uE954\";margin-left:-1em;color:#323232}.icon-corrosive .path10:before{content:\"\uE955\";margin-left:-1em;color:#323232}.icon-corrosive .path11:before{content:\"\uE956\";margin-left:-1em;color:#323232}.icon-corrosive .path12:before{content:\"\uE957\";margin-left:-1em;color:#323232}.icon-corrosive .path13:before{content:\"\uE958\";margin-left:-1em;color:#323232}.icon-corrosive .path14:before{content:\"\uE959\";margin-left:-1em;color:#323232}.icon-corrosive .path15:before{content:\"\uE95A\";margin-left:-1em;color:#323232}.icon-corrosive .path16:before{content:\"\uE95B\";margin-left:-1em;color:#323232}.icon-corrosive .path17:before{content:\"\uE95C\";margin-left:-1em;color:#323232}.icon-corrosive .path18:before{content:\"\uE95D\";margin-left:-1em;color:#323232}.icon-corrosive .path19:before{content:\"\uE95E\";margin-left:-1em;color:#323232}.icon-corrosive .path20:before{content:\"\uE95F\";margin-left:-1em;color:#323232}.icon-corrosive .path21:before{content:\"\uE960\";margin-left:-1em;color:#e32730}.icon-dashboard:before{content:\"\uE961\"}.icon-database-sds:before{content:\"\uE962\"}.icon-description-add:before{content:\"\uE963\"}.icon-description-edit:before{content:\"\uE964\"}.icon-description-view:before{content:\"\uE965\";color:#666}.icon-document-read .path1:before{content:\"\uE966\";color:#000;opacity:.6}.icon-document-read .path2:before{content:\"\uE967\";margin-left:-1em;color:#fff}.icon-document-read .path3:before{content:\"\uE968\";margin-left:-1em;color:#000;opacity:.6}.icon-draft:before{content:\"\uE969\"}.icon-expired-off:before{content:\"\uE96A\"}.icon-expired-on:before{content:\"\uE96B\"}.icon-explosive .path1:before{content:\"\uE96C\";color:#e32730}.icon-explosive .path2:before{content:\"\uE96D\";margin-left:-1em;color:#323232}.icon-explosive .path3:before{content:\"\uE96E\";margin-left:-1em;color:#323232}.icon-explosive .path4:before{content:\"\uE96F\";margin-left:-1em;color:#323232}.icon-explosive .path5:before{content:\"\uE970\";margin-left:-1em;color:#323232}.icon-explosive .path6:before{content:\"\uE971\";margin-left:-1em;color:#323232}.icon-explosive .path7:before{content:\"\uE972\";margin-left:-1em;color:#323232}.icon-explosive .path8:before{content:\"\uE973\";margin-left:-1em;color:#323232}.icon-explosive .path9:before{content:\"\uE974\";margin-left:-1em;color:#323232}.icon-explosive .path10:before{content:\"\uE975\";margin-left:-1em;color:#323232}.icon-explosive .path11:before{content:\"\uE976\";margin-left:-1em;color:#323232}.icon-explosive .path12:before{content:\"\uE977\";margin-left:-1em;color:#323232}.icon-explosive .path13:before{content:\"\uE978\";margin-left:-1em;color:#323232}.icon-explosive .path14:before{content:\"\uE979\";margin-left:-1em;color:#323232}.icon-explosive .path15:before{content:\"\uE97A\";margin-left:-1em;color:#323232}.icon-explosive .path16:before{content:\"\uE97B\";margin-left:-1em;color:#323232}.icon-explosive .path17:before{content:\"\uE97C\";margin-left:-1em;color:#323232}.icon-explosive .path18:before{content:\"\uE97D\";margin-left:-1em;color:#323232}.icon-explosive .path19:before{content:\"\uE97E\";margin-left:-1em;color:#323232}.icon-explosive .path20:before{content:\"\uE97F\";margin-left:-1em;color:#323232}.icon-explosive .path21:before{content:\"\uE980\";margin-left:-1em;color:#323232}.icon-explosive .path22:before{content:\"\uE981\";margin-left:-1em;color:#323232}.icon-explosive .path23:before{content:\"\uE982\";margin-left:-1em;color:#323232}.icon-explosive .path24:before{content:\"\uE983\";margin-left:-1em;color:#323232}.icon-explosive .path25:before{content:\"\uE984\";margin-left:-1em;color:#323232}.icon-explosive .path26:before{content:\"\uE985\";margin-left:-1em;color:#323232}.icon-explosive .path27:before{content:\"\uE986\";margin-left:-1em;color:#323232}.icon-explosive .path28:before{content:\"\uE987\";margin-left:-1em;color:#323232}.icon-explosive .path29:before{content:\"\uE988\";margin-left:-1em;color:#323232}.icon-explosive .path30:before{content:\"\uE989\";margin-left:-1em;color:#323232}.icon-explosive .path31:before{content:\"\uE98A\";margin-left:-1em;color:#323232}.icon-explosive .path32:before{content:\"\uE98B\";margin-left:-1em;color:#323232}.icon-explosive .path33:before{content:\"\uE98C\";margin-left:-1em;color:#323232}.icon-explosive .path34:before{content:\"\uE98D\";margin-left:-1em;color:#323232}.icon-explosive .path35:before{content:\"\uE98E\";margin-left:-1em;color:#323232}.icon-explosive .path36:before{content:\"\uE98F\";margin-left:-1em;color:#323232}.icon-explosive .path37:before{content:\"\uE990\";margin-left:-1em;color:#323232}.icon-explosive .path38:before{content:\"\uE991\";margin-left:-1em;color:#323232}.icon-explosive .path39:before{content:\"\uE992\";margin-left:-1em;color:#323232}.icon-explosive .path40:before{content:\"\uE993\";margin-left:-1em;color:#323232}.icon-explosive .path41:before{content:\"\uE994\";margin-left:-1em;color:#323232}.icon-explosive .path42:before{content:\"\uE995\";margin-left:-1em;color:#323232}.icon-explosive .path43:before{content:\"\uE996\";margin-left:-1em;color:#323232}.icon-explosive .path44:before{content:\"\uE997\";margin-left:-1em;color:#323232}.icon-explosive .path45:before{content:\"\uE998\";margin-left:-1em;color:#323232}.icon-explosive .path46:before{content:\"\uE999\";margin-left:-1em;color:#323232}.icon-file-excel:before{content:\"\uE99A\"}.icon-file-pdf:before{content:\"\uE99B\"}.icon-file-pdf-verified .path1:before{content:\"\uE99C\";color:#000;opacity:.6}.icon-file-pdf-verified .path2:before{content:\"\uE99D\";margin-left:-1em;color:#fff}.icon-file-pdf-verified .path3:before{content:\"\uE99E\";margin-left:-1em;color:#000;opacity:.6}.icon-file-word:before{content:\"\uE99F\"}.icon-filter-alt:before{content:\"\uE9A0\"}.icon-flammable .path1:before{content:\"\uE9A1\";color:#323232}.icon-flammable .path2:before{content:\"\uE9A2\";margin-left:-1em;color:#323232}.icon-flammable .path3:before{content:\"\uE9A3\";margin-left:-1em;color:#e32730}.icon-gas-under-pressure .path1:before{content:\"\uE9A4\";color:#323232}.icon-gas-under-pressure .path2:before{content:\"\uE9A5\";margin-left:-1em;color:#e32730}.icon-health-hazard .path1:before{content:\"\uE9A6\";color:#323232}.icon-health-hazard .path2:before{content:\"\uE9A7\";margin-left:-1em;color:#e32730}.icon-line-break:before{content:\"\uE9A8\"}.icon-location:before{content:\"\uE9A9\"}.icon-measure-add:before{content:\"\uE9AA\"}.icon-measure-edit:before{content:\"\uE9AB\"}.icon-measure-view:before{content:\"\uE9AC\";color:#666}.icon-messages:before{content:\"\uE9AD\"}.icon-monitoring:before{content:\"\uE9AE\";color:#666}.icon-move:before{content:\"\uE9AF\"}.icon-oxidizing .path1:before{content:\"\uE9B0\";color:#e32730}.icon-oxidizing .path2:before{content:\"\uE9B1\";margin-left:-1em;color:#323232}.icon-oxidizing .path3:before{content:\"\uE9B2\";margin-left:-1em;color:#323232}.icon-oxidizing .path4:before{content:\"\uE9B3\";margin-left:-1em;color:#323232}.icon-process-area-closed:before{content:\"\uE9B4\"}.icon-process-area-open:before{content:\"\uE9B5\"}.icon-process-linked .path1:before{content:\"\uE9B6\";color:#000;opacity:.6}.icon-process-linked .path2:before{content:\"\uE9B7\";margin-left:-1em;color:#666}.icon-risk:before{content:\"\uE9B8\"}.icon-search-in-file:before{content:\"\uE9B9\"}.icon-sort-ascending:before{content:\"\uE9BA\"}.icon-sort-descending:before{content:\"\uE9BB\"}.icon-subscript:before{content:\"\uE9BC\"}.icon-superscript:before{content:\"\uE9BD\"}.icon-syncronice-favorites:before{content:\"\uE9BE\"}.icon-system-settings:before{content:\"\uE9BF\"}.icon-view-three-outlined:before{content:\"\uE9C0\"}.icon-workplace-safety:before{content:\"\uE9C1\"}.icon-checklist:before{content:\"\uE900\"}.icon-department-document .path1:before{content:\"\uE901\";color:#000;opacity:.6}.icon-department-document .path2:before{content:\"\uE902\";margin-left:-1em;color:#00804c}.icon-department-folder-closed .path1:before{content:\"\uE903\";color:#000;opacity:.6}.icon-department-folder-closed .path2:before{content:\"\uE904\";margin-left:-1em;color:#00804c}.icon-department-folder-open .path1:before{content:\"\uE905\";color:#000;opacity:.6}.icon-department-folder-open .path2:before{content:\"\uE906\";margin-left:-1em;color:#00804c}.icon-deviation:before{content:\"\uE907\"}.icon-dropdown-folder .path1:before{content:\"\uE908\";color:#00324e}.icon-dropdown-folder .path2:before{content:\"\uE909\";margin-left:-1em;color:#fff;opacity:.6}.icon-enterprise-document .path1:before{content:\"\uE90A\";color:#000;opacity:.6}.icon-enterprise-document .path2:before{content:\"\uE90B\";margin-left:-1em;color:#cf4714}.icon-enterprise-folder-closed .path1:before{content:\"\uE90C\";color:#000;opacity:.6}.icon-enterprise-folder-closed .path2:before{content:\"\uE90D\";margin-left:-1em;color:#cf4714}.icon-enterprise-folder-open .path1:before{content:\"\uE90E\";color:#000;opacity:.6}.icon-enterprise-folder-open .path2:before{content:\"\uE90F\";margin-left:-1em;color:#cf4714}.icon-folder-closed:before{content:\"\uE910\"}.icon-folder-open:before{content:\"\uE911\"}.icon-keyboard_arrow_down:before{content:\"\uE912\"}.icon-keyboard_arrow_up:before{content:\"\uE913\"}.icon-local-document .path1:before{content:\"\uE914\";color:#000;opacity:.6}.icon-local-document .path2:before{content:\"\uE915\";margin-left:-1em;color:#1954a9}.icon-local-folder-closed .path1:before{content:\"\uE916\";color:#000;opacity:.6}.icon-local-folder-closed .path2:before{content:\"\uE917\";margin-left:-1em;color:#1954a9}.icon-local-folder-open .path1:before{content:\"\uE918\";color:#000;opacity:.6}.icon-local-folder-open .path2:before{content:\"\uE919\";margin-left:-1em;color:#1954a9}.icon-process:before{content:\"\uE91A\"}.icon-regional-document .path1:before{content:\"\uE91C\";color:#000;opacity:.6}.icon-regional-document .path2:before{content:\"\uE91D\";margin-left:-1em;color:#662e0d}.icon-regional-folder-closed .path1:before{content:\"\uE91E\";color:#000;opacity:.6}.icon-regional-folder-closed .path2:before{content:\"\uE91F\";margin-left:-1em;color:#662e0d}.icon-regional-folder-open .path1:before{content:\"\uE920\";color:#000;opacity:.6}.icon-regional-folder-open .path2:before{content:\"\uE921\";margin-left:-1em;color:#662e0d}.select-access-dialog-container{font-family:Open Sans}.select-access-dialog-container .mat-expansion-panel .mat-expansion-panel-body{padding-top:0!important}.select-access-dialog-container .mat-expansion-panel-header{font-size:12px!important;font-weight:800!important}.select-access-dialog-container .w-100{width:100%}.select-access-dialog-container .h-100{height:100%}.select-access-dialog-container .pointer{cursor:pointer}.select-access-dialog-container .fw-600{font-weight:600}.select-access-dialog-container .label-item{font-weight:600;color:var(--ws-text-primary)}.select-access-dialog-container .sub-label{color:var(--ws-text-secondary)}.select-access-dialog-container .fs-14{font-size:14px}.select-access-dialog-container .fs-12{font-size:12px}.select-access-dialog-container .color-primary{color:var(--primary-light)!important}.select-access-dialog-container .header-title{font-weight:600;color:var(--ws-text-primary);font-size:16px}.select-access-dialog-container .chip-item-result{max-width:250px}.select-access-dialog-container .chip-item-result.item-department .qms-chip-body{display:flex;justify-content:center;align-items:center}.select-access-dialog-container .remove-chip-icon{color:rgba(0,0,0,.3);cursor:pointer}.select-access-dialog-container .remove-chip-icon:hover{color:rgba(0,0,0,.7)}.select-access-dialog-container .mat-form-field-wrapper{padding-bottom:5px!important}.select-access-dialog-container .mat-expansion-panel{border-radius:unset!important}.select-access-dialog-container .mat-expansion-panel-header:not([aria-disabled=true]){background:unset}.select-access-dialog-container .mat-expansion-panel.mat-expanded .mat-expansion-panel-header{background:#e5eefb}.select-access-dialog-container .mat-expansion-panel.mat-expanded .mat-expansion-panel-header .qms-line{color:var(--primary-light)!important}.select-access-dialog-container .access-dialog-header{display:flex;justify-content:space-between;align-items:center}.select-access-dialog-container .access-dialog-wraper{width:100%}.select-access-dialog-container .access-dialog-wraper .field-select-option .mat-form-field-wrapper{padding-bottom:16px!important}.select-access-dialog-container .access-dialog-wraper .field-select-option .mat-form-field-underline{bottom:16px!important}.select-access-dialog-container .mat-chip-list-wrapper{margin:unset!important}.select-access-dialog-container .result-selected-container{max-height:175px;overflow-y:auto;padding-right:4px}.select-access-dialog-container .item-list-wrapper{max-height:28vh;padding:4px 4px 4px 0;overflow-y:auto}.select-access-dialog-container .item-list-wrapper.no-result{height:28vh;display:flex;justify-content:center;align-items:center}.select-access-dialog-container .item-list-wrapper .item{min-height:40px}.select-access-dialog-container .item-list-wrapper .item-without-checkbox{min-height:45px;display:flex;justify-content:space-between;align-items:center;padding:4px 8px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:4px;transition:background .3s ease}.select-access-dialog-container .item-list-wrapper .item-without-checkbox.active{background:var(--primary-light-12-opacity)}.select-access-dialog-container .item-list-wrapper .item-without-checkbox:hover{background:var(--primary-light-6-opacity)}.select-access-dialog-container .item-list-wrapper .item-without-checkbox .mat-icon{color:var(--primary-light)!important}.select-access-dialog-container .confirm__button__groups .btn-add>.qms-btn-wrapper{display:flex;justify-content:center;align-items:center}.select-access-dialog-container .option-selected-content .group-filter-person-option{display:flex;flex-direction:row-reverse;justify-content:center;align-items:center;grid-gap:8px;gap:8px}.select-access-dialog-container span.chip-item__content_name{display:inline-block;max-width:175px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.select-access-dialog-container span.chip-item-children__count{font-size:.75rem;color:rgba(0,0,0,.5);font-weight:600}.select-access-dialog-container .mat-slide-toggle.qms-group-options{padding:unset!important}.select-access-dialog-container .input-option-filter .mat-form-field-wrapper{padding-bottom:8px!important}.select-access-dialog-container .input-option-filter .mat-form-field-underline{bottom:8px!important}.select-access-dialog-container .slide-toggle{margin-bottom:8px}.select-access-dialog-container .confirm__button__groups.none-option{margin-top:85px}.select-access-dialog-container .btn-icon-clear{position:relative;padding:0 1rem}.select-access-dialog-container .btn-icon-clear .qms-btn-icon{margin-right:unset!important}.select-access-dialog-container .btn-icon-clear:after{position:absolute;content:\"\";left:0;top:0;height:100%;width:1px;background:rgba(0,0,0,.3)}.select-access-dialog-container .qms-paginator .mat-icon{display:flex;align-items:center;justify-content:center}.select-access-dialog-container .qms-paginator .mat-form-field-wrapper{padding-bottom:0}.select-access-dialog-container .qms-paginator .mat-paginator-container{min-height:40px}.select-access-dialog-container .qms-paginator .mat-paginator-container .qms-total-result{margin-bottom:2px;margin-right:12px;height:30px}.select-access-dialog-container .qms-paginator .mat-paginator-container .qms-total-result span{font-weight:600;font-size:13px;color:rgba(0,0,0,.8)}.select-access-dialog-container .qms-paginator .mat-paginator-container .qms-paginator-range-actions{margin-bottom:0;grid-column-gap:2px;-moz-column-gap:2px;column-gap:2px}.select-access-dialog-container .qms-paginator .mat-paginator-container .qms-paginator-range-actions>.qms-total-result{margin-bottom:0}.select-access-dialog-container .qms-paginator>.qms-btn-icon-wrapper{width:30px;height:30px;display:flex;justify-content:center;align-items:center}.select-access-dialog-container .qms-paginator .qms-paginator-page-size{margin-right:12px}.select-access-dialog-container .qms-paginator .qms-paginator-page-size>.qms-pagesize-label{display:none}.select-access-dialog-container .qms-paginator .qms-paginator-page-size>.qms-form-page-size .mat-form-field-flex{width:60px!important;height:30px;display:flex;align-items:center;padding:0 4px}.select-access-dialog-container .qms-paginator .qms-paginator-page-size>.qms-form-page-size .mat-form-field-flex .mat-form-field-infix{height:30px}.select-access-dialog-container .qms-paginator .mat-form-field.qms-form .mat-select-min-line,.select-access-dialog-container .qms-paginator .mat-form-field.qms-form mat-select-trigger{font-size:14px}.select-access-dialog-container .qms-paginator .mat-select-value{text-align:center}.select-access-dialog-container .mat-checkbox.checkbox-all .mat-checkbox-label{flex-direction:row!important;align-items:center!important;grid-column-gap:4px!important;-moz-column-gap:4px!important;column-gap:4px!important}.select-access-dialog-container .mat-expansion-panel.qms-expansion{margin:0!important}.select-access-dialog-container .qms-btn-icon{width:30px!important;height:30px!important;line-height:30px!important}.select-access-dialog-container .loading-container{height:25vh;display:grid;grid-template-rows:repeat(auto-fill,minmax(60px,60px))}.select-access-dialog-container .loading-container .loader{position:relative;width:100%;height:100%;padding:10px 0;overflow:hidden}.select-access-dialog-container .loading-container .loader:after{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background:linear-gradient(110deg,hsla(0,0%,91%,0),hsla(0,0%,89%,0) 40%,hsla(0,0%,89%,.5) 50%,hsla(0,0%,89%,0) 60%,hsla(0,0%,89%,0));-webkit-animation:animate-loading 1.2s linear infinite;animation:animate-loading 1.2s linear infinite}.select-access-dialog-container .loading-container .loader__wrapper{position:relative;width:100%;height:100%}.select-access-dialog-container .loading-container .loader__wrapper .row-loader{background-color:#eee;position:absolute;left:0;width:100%;height:40px;overflow:hidden}@-webkit-keyframes animate-loading{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}@keyframes animate-loading{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}"]
30124
30310
  },] }
30125
30311
  ];
30126
30312
  QMSSelectAccessDialogComponent.ctorParameters = () => [
30127
30313
  { type: MatDialogRef },
30128
- { type: QMSSelectAccessData, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] },
30314
+ { type: QMSSelectAccessDialog, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] },
30129
30315
  { type: TranslateLibraryService },
30130
30316
  { type: FormBuilder },
30131
- { type: QMSSelectAccessGlobalService },
30132
30317
  { type: ChangeDetectorRef }
30133
30318
  ];
30134
30319
  QMSSelectAccessDialogComponent.propDecorators = {
@@ -30182,5 +30367,5 @@ QMSSelectAccessDialogModule.decorators = [
30182
30367
  * Generated bundle index. Do not edit.
30183
30368
  */
30184
30369
 
30185
- export { AnimationTreeDepartment, AutocompleteOffDirective, BREADCRUMB_DROPDOWN_ICON, BUTTON_TOGGLE_DEFAULT_OPTIONS, BUTTON_TOGGLE_GROUP, BUTTON_TOGGLE_GROUP_VALUE_ACCESSOR, BannerType, BpmnService, BreadcrumbNode, BreadcrumbType, ButtonToggleChange, CHECKLIST_ICON, CKEditorEventConst, CKEditorModule, CdkDetailRowDirective, ConfirmDialog, DEPARTMENT_FOLDER_ICON, DEPARTMENT_FOLDER_OUTLINED_ICON, DEVIATION_ICON, DOCUMENT_DEPARTMENT_ICON, DOCUMENT_ENTERPRISE_ICON, DOCUMENT_ICON, DOCUMENT_LOCAL_ICON, DOCUMENT_REGIONAL_ICON, DataType$1 as DataType, DateFormatPipe, DepartmentLocationBreadCrumb, DepartmentSearchResultModel, DocumentNodeType$1 as DocumentNodeType, ENTERPRISE_FOLDER_ICON, ENTERPRISE_FOLDER_OUTLINED_ICON, FileErrorType, FileType, FlatNodeNavDrawer, FlowChartConst, FlowchartViewMode, ISelectOneItem, InformationCoverItem, KEYBOARD_DOWN_ICON, KEYBOARD_UP_ICON, LOCAL_FOLDER_ICON, LOCAL_FOLDER_OUTLINED_ICON, LinkAnchor, LinkType, MarginDirective, MfeUtil, ModuleType$1 as ModuleType, NORMAL_FOLDER_ICON, NORMAL_FOLDER_OUTLINED_ICON, NavigatorElementView, NavigatorLinkView, NewTreeComponent, NewTreeModel, OptionSelectAccessEnum, OptionSelectAccessModel, PROCESS_AREA_ICON, PROCESS_AREA_OUTLINED_ICON, PROCESS_ICON, PaginationSize, PopupData, ProtocolType, ProtocolTypeName, QMSAccessItem, QMSAnchor, QMSAppBar, QMSAppIconModule, QMSAttachmentListDirective, QMSBasicTreeComponent, QMSBreadcrumb, QMSBreadcrumbDirectionIconDirective, QMSBreadcrumbItemDirective, QMSBreadcrumbModule, QMSButton, QMSButtonIcon, QMSButtonModule, QMSButtonToggle, QMSButtonToggleGroup, QMSCKEditorBaseComponent, QMSCKEditorBaseService, QMSCKEditorBpmn, QMSCKEditorBpmnApiService, QMSCKEditorBpmnComponent, QMSCKEditorBpmnTemplate, QMSCKEditorComponent, QMSCKEditorConfirmComponent, QMSCKEditorData, QMSCKEditorDialogData, QMSCKEditorDocumentType, QMSCKEditorFlowchart, QMSCKEditorFlowchartService, QMSCKEditorFullscreenComponent, QMSCKEditorGlobalService, QMSCKEditorInjector, QMSCKEditorLinkAnchorDocument, QMSCKEditorLinkComponent, QMSCKEditorLinkService, QMSCKEditorLoadTemplateComponent, QMSCKEditorModule, QMSCKEditorPlugin, QMSCKEditorRelatedComponent, QMSCKEditorRelation, QMSCKEditorSaveAsTemplate, QMSCKEditorTemplate, QMSCKEditorTemplateService, QMSCKEditorToastService, QMSCKEditorTreeComponent, QMSCKEdtiorInputData, QMSChipBodyDirective, QMSChipInputChipListDirective, QMSChipInputDirective, QMSChipInputSelectDropDownDirective, QMSChipInputSelectFieldDirective, QMSChipInputSelectTriggerDirective, QMSCollapseGroupDirective, QMSComment, QMSConfirmDialog, QMSDialogConfig, QMSDialogContainer, QMSDialogContainerV2, QMSDialogContent, QMSDialogFooter, QMSDialogHeader, QMSDrawerContentDirective, QMSDrawerDirective, QMSDrawerHeaderActionDirective, QMSDrawerHeaderDirective, QMSDropdownMenuItem, QMSEditFileNameDialog, QMSEditFileNameDialogModule, QMSFileAttachment, QMSFileUploadDirective, QMSFileUploadDisplayDirective, QMSFileUploadMultipleDirective, QMSFileUploadMultipleDisplayDirective, QMSFileUploadMultipleSelectorDirective, QMSFileUploadSelectorDirective, QMSFlatNodeTree, QMSFormDialog, QMSFormFieldDatePickerDirective, QMSFormFieldDirective, QMSFormFieldTextareaDirective, QMSGroupOptionDirective, QMSIconRegistryService, QMSInputChipDirective, QMSInputClearDirective, QMSList, QMSListExpansion, QMSListExpansionHeader, QMSListHeader, QMSListItem, QMSListLeadingIcon, QMSListLine, QMSListModule, QMSMultiIconDirective, QMSNavDrawerComponent, QMSNavDrawerModule, QMSNavigationDrawerComponent, QMSNavigationDrawerModule, QMSNewTreeModule, QMSPaginatorComponent, QMSProcessDocumentItem, QMSRangeSliderDirective, QMSRangeSliderLockUpDirective, QMSRangeSliderModule, QMSRelatedGlobalService, QMSRelatedModule, QMSRichText, QMSRichTextModule, QMSRowDetailDirective, QMSScrolableAttachmentListDirective, QMSScrollbarDirective, QMSSearchFieldDirective, QMSSelectAccessData, QMSSelectAccessDialogComponent, QMSSelectAccessDialogModule, QMSSelectAccessGlobalService, QMSSelectAccessResult, QMSSelectDepartmentGlobalService, QMSSelectDepartmentModule, QMSSelectDepartmentTreeConfig, QMSSelectDepartmentTreeGlobalService, QMSSelectDepartmentTreeModule, QMSSelectIncludeChildrenGlobalService, QMSSelectIncludeChildrenModule, QMSSelectOneGlobalService, QMSSelectOneModule, QMSSelectProcessDocumentGlobalService, QMSSelectProcessDocumentModule, QMSSideSheetModule, QMSSnackbarConfig, QMSSuffixDirective, QMSSuffixFieldDirective, QMSTabGroupAdvancedDirective, QMSTabGroupDirective, QMSTabLabelDirective, QMSTabModule, QMSTableAction, QMSTableActionBlock, QMSTableChildrenDirective, QMSTableDirective, QMSTableModule, QMSTableRowDirective, QMSTextBlockDirective, QMSTextBlockLine, QMSTextTruncateDirective, QMSThemingLibraryService, QMSToolTipComponent, QMSToolTipRendererDirective, QMSTooltipImageDirective, QMSTooltipModule, QMSTreeConfig, QMSTreeGlobalService, QMSTreeModel, QMSTreeModule, QMSUploadFileErrorDialog, QMSUploadFileErrorDialogModule, QMSUploadingFileGuard, QMS_THEMES, QMS_THEME_DEFAULT, QmsAngularComponent, QmsAngularModule, QmsAngularService, QmsAppBarComponent, QmsAppBarModule, QmsBadgesComponent, QmsBadgesModule, QmsBannerButtonType, QmsBannerComponent, QmsBannerConfirmButton, QmsBannerConfirmButtonClick, QmsBannerConfirmComponent, QmsBannerConfirmModule, QmsBannerContent, QmsBannerLoadingComponent, QmsBannerLoadingModule, QmsBannerModule, QmsPaginatorModule, QmsReportContentPortraitComponent, QmsReportCoverPortraitComponent, QmsReportModule, QmsStatusDropdownComponent, QmsStatusDropdownModule, QmsStatusDropdownOption, QmsStatusDropdownType, QmsStepperComponent, QmsStepperModule, REGIONAL_FOLDER_ICON, REGIONAL_FOLDER_OUTLINED_ICON, RISK_ICON, RelatedConst, RelatedContentComponent, RelatedItemType, RelatedListComponent, RelatedPopupComponent, Result, RiskAnalysis, RiskAnalysisComponent, RiskDanger, RiskListComponent, RiskResult, RiskResultComponent, SaveTemplateComponent, ScrollToSelectedDirective, SelectConst, SelectDepartmentComponent, SelectDepartmentPopupData, SelectDepartmentTreeComponent, SelectDialog, SelectIncludeChildrenPopUpComponent, SelectOneDialog, SelectOneNextData, SelectOneNextDialog, SelectOnePopupData, SelectOption, SelectOptionTypes, SelectPopupData, SelectProcessDocumentPopupComponent, SelectProcessDocumentPopupData, SelectedOption, SelectedProcessDocumentItem, SharedModule, ShowHideSearchResultConst, SideNav, SideNavItem, SidenavComponent, TargetType, TargetTypeName, TranslateLibraryService, TreeComponent, TreeConfig, TreeFlatNode, TreeModel, TreeModelNavDrawer, TreeNode$1 as TreeNode, UploadErrorData, app, basic, en, erd, fsa, mixinColor, no, notExceedSize, org, pn, requiredFileType, standard, uml, ɵ2, SharedMaterialModule as ɵa, TreeComponent as ɵb, QMSTreeModule as ɵc, QMSBasicTreeComponent as ɵd, QMSCKEditorTreeService as ɵe, QMSCKEditorTemplateComponent as ɵf, LinkAttachmentComponent as ɵg, QMSCKEditorTooltipComponent as ɵh, QMSCKEditorTooltip as ɵi, QMSCKEditorImageMapComponent as ɵj, QMSCKEditorImageMap as ɵk, QMSCKEditorUploadService as ɵl, QMSCKEditorBpmnData as ɵm, QMSCKEditorAboutComponent as ɵn, QMSCKEditorFlowchartComponent as ɵo };
30370
+ export { AnimationTreeDepartment, AutocompleteOffDirective, BREADCRUMB_DROPDOWN_ICON, BUTTON_TOGGLE_DEFAULT_OPTIONS, BUTTON_TOGGLE_GROUP, BUTTON_TOGGLE_GROUP_VALUE_ACCESSOR, BannerType, BpmnService, BreadcrumbNode, BreadcrumbType, ButtonToggleChange, CHECKLIST_ICON, CKEditorEventConst, CKEditorModule, CdkDetailRowDirective, ConfirmDialog, DEPARTMENT_FOLDER_ICON, DEPARTMENT_FOLDER_OUTLINED_ICON, DEVIATION_ICON, DOCUMENT_DEPARTMENT_ICON, DOCUMENT_ENTERPRISE_ICON, DOCUMENT_ICON, DOCUMENT_LOCAL_ICON, DOCUMENT_REGIONAL_ICON, DataType$1 as DataType, DateFormatPipe, DepartmentLocationBreadCrumb, DepartmentSearchResultModel, DocumentNodeType$1 as DocumentNodeType, ENTERPRISE_FOLDER_ICON, ENTERPRISE_FOLDER_OUTLINED_ICON, FileErrorType, FileType, FlatNodeNavDrawer, FlowChartConst, FlowchartViewMode, ISelectOneItem, InformationCoverItem, KEYBOARD_DOWN_ICON, KEYBOARD_UP_ICON, LOCAL_FOLDER_ICON, LOCAL_FOLDER_OUTLINED_ICON, LinkAnchor, LinkType, MarginDirective, MfeUtil, ModuleType$1 as ModuleType, NORMAL_FOLDER_ICON, NORMAL_FOLDER_OUTLINED_ICON, NavigatorElementView, NavigatorLinkView, NewTreeComponent, NewTreeModel, OptionSelectAccessEnum, OptionSelectAccessModel, PROCESS_AREA_ICON, PROCESS_AREA_OUTLINED_ICON, PROCESS_ICON, PaginationSize, PopupData, ProtocolType, ProtocolTypeName, QMSAccessItem, QMSAnchor, QMSAppBar, QMSAppIconModule, QMSAttachmentListDirective, QMSBasicTreeComponent, QMSBreadcrumb, QMSBreadcrumbDirectionIconDirective, QMSBreadcrumbItemDirective, QMSBreadcrumbModule, QMSButton, QMSButtonIcon, QMSButtonModule, QMSButtonToggle, QMSButtonToggleGroup, QMSCKEditorBaseComponent, QMSCKEditorBaseService, QMSCKEditorBpmn, QMSCKEditorBpmnApiService, QMSCKEditorBpmnComponent, QMSCKEditorBpmnTemplate, QMSCKEditorComponent, QMSCKEditorConfirmComponent, QMSCKEditorData, QMSCKEditorDialogData, QMSCKEditorDocumentType, QMSCKEditorFlowchart, QMSCKEditorFlowchartService, QMSCKEditorFullscreenComponent, QMSCKEditorGlobalService, QMSCKEditorInjector, QMSCKEditorLinkAnchorDocument, QMSCKEditorLinkComponent, QMSCKEditorLinkService, QMSCKEditorLoadTemplateComponent, QMSCKEditorModule, QMSCKEditorPlugin, QMSCKEditorRelatedComponent, QMSCKEditorRelation, QMSCKEditorSaveAsTemplate, QMSCKEditorTemplate, QMSCKEditorTemplateService, QMSCKEditorToastService, QMSCKEditorTreeComponent, QMSCKEdtiorInputData, QMSChipBodyDirective, QMSChipInputChipListDirective, QMSChipInputDirective, QMSChipInputSelectDropDownDirective, QMSChipInputSelectFieldDirective, QMSChipInputSelectTriggerDirective, QMSCollapseGroupDirective, QMSComment, QMSConfirmDialog, QMSDialogConfig, QMSDialogContainer, QMSDialogContainerV2, QMSDialogContent, QMSDialogFooter, QMSDialogHeader, QMSDrawerContentDirective, QMSDrawerDirective, QMSDrawerHeaderActionDirective, QMSDrawerHeaderDirective, QMSDropdownMenuItem, QMSEditFileNameDialog, QMSEditFileNameDialogModule, QMSFileAttachment, QMSFileUploadDirective, QMSFileUploadDisplayDirective, QMSFileUploadMultipleDirective, QMSFileUploadMultipleDisplayDirective, QMSFileUploadMultipleSelectorDirective, QMSFileUploadSelectorDirective, QMSFlatNodeTree, QMSFormDialog, QMSFormFieldDatePickerDirective, QMSFormFieldDirective, QMSFormFieldTextareaDirective, QMSGroupOptionDirective, QMSIconRegistryService, QMSInputChipDirective, QMSInputClearDirective, QMSList, QMSListExpansion, QMSListExpansionHeader, QMSListHeader, QMSListItem, QMSListLeadingIcon, QMSListLine, QMSListModule, QMSMultiIconDirective, QMSNavDrawerComponent, QMSNavDrawerModule, QMSNavigationDrawerComponent, QMSNavigationDrawerModule, QMSNewTreeModule, QMSPaginatorComponent, QMSProcessDocumentItem, QMSRangeSliderDirective, QMSRangeSliderLockUpDirective, QMSRangeSliderModule, QMSRelatedGlobalService, QMSRelatedModule, QMSRichText, QMSRichTextModule, QMSRowDetailDirective, QMSScrolableAttachmentListDirective, QMSScrollbarDirective, QMSSearchFieldDirective, QMSSelectAccessData, QMSSelectAccessDialog, QMSSelectAccessDialogComponent, QMSSelectAccessDialogModule, QMSSelectAccessGlobalService, QMSSelectAccessResult, QMSSelectDepartmentGlobalService, QMSSelectDepartmentModule, QMSSelectDepartmentTreeConfig, QMSSelectDepartmentTreeGlobalService, QMSSelectDepartmentTreeModule, QMSSelectIncludeChildrenGlobalService, QMSSelectIncludeChildrenModule, QMSSelectOneGlobalService, QMSSelectOneModule, QMSSelectProcessDocumentGlobalService, QMSSelectProcessDocumentModule, QMSSideSheetModule, QMSSnackbarConfig, QMSSuffixDirective, QMSSuffixFieldDirective, QMSTabGroupAdvancedDirective, QMSTabGroupDirective, QMSTabLabelDirective, QMSTabModule, QMSTableAction, QMSTableActionBlock, QMSTableChildrenDirective, QMSTableDirective, QMSTableModule, QMSTableRowDirective, QMSTextBlockDirective, QMSTextBlockLine, QMSTextTruncateDirective, QMSThemingLibraryService, QMSToolTipComponent, QMSToolTipRendererDirective, QMSTooltipImageDirective, QMSTooltipModule, QMSTreeConfig, QMSTreeGlobalService, QMSTreeModel, QMSTreeModule, QMSUploadFileErrorDialog, QMSUploadFileErrorDialogModule, QMSUploadingFileGuard, QMS_THEMES, QMS_THEME_DEFAULT, QmsAngularComponent, QmsAngularModule, QmsAngularService, QmsAppBarComponent, QmsAppBarModule, QmsBadgesComponent, QmsBadgesModule, QmsBannerButtonType, QmsBannerComponent, QmsBannerConfirmButton, QmsBannerConfirmButtonClick, QmsBannerConfirmComponent, QmsBannerConfirmModule, QmsBannerContent, QmsBannerLoadingComponent, QmsBannerLoadingModule, QmsBannerModule, QmsCkeditorLinkSimpleComponent, QmsPaginatorModule, QmsReportContentPortraitComponent, QmsReportCoverPortraitComponent, QmsReportModule, QmsStatusDropdownComponent, QmsStatusDropdownModule, QmsStatusDropdownOption, QmsStatusDropdownType, QmsStepperComponent, QmsStepperModule, REGIONAL_FOLDER_ICON, REGIONAL_FOLDER_OUTLINED_ICON, RISK_ICON, RelatedConst, RelatedContentComponent, RelatedItemType, RelatedListComponent, RelatedPopupComponent, Result, RiskAnalysis, RiskAnalysisComponent, RiskDanger, RiskListComponent, RiskResult, RiskResultComponent, SaveTemplateComponent, ScrollToSelectedDirective, SelectConst, SelectDepartmentComponent, SelectDepartmentPopupData, SelectDepartmentTreeComponent, SelectDialog, SelectIncludeChildrenPopUpComponent, SelectOneDialog, SelectOneNextData, SelectOneNextDialog, SelectOnePopupData, SelectOption, SelectOptionTypes, SelectPopupData, SelectProcessDocumentPopupComponent, SelectProcessDocumentPopupData, SelectedOption, SelectedProcessDocumentItem, SharedModule, ShowHideSearchResultConst, SideNav, SideNavItem, SidenavComponent, TargetType, TargetTypeName, TranslateLibraryService, TreeComponent, TreeConfig, TreeFlatNode, TreeModel, TreeModelNavDrawer, TreeNode$1 as TreeNode, UploadErrorData, app, basic, en, erd, fsa, mixinColor, no, notExceedSize, org, pn, requiredFileType, standard, uml, ɵ2, SharedMaterialModule as ɵa, TreeComponent as ɵb, QMSTreeModule as ɵc, QMSBasicTreeComponent as ɵd, QMSCKEditorTreeService as ɵe, QMSCKEditorTemplateComponent as ɵf, LinkAttachmentComponent as ɵg, QMSCKEditorTooltipComponent as ɵh, QMSCKEditorTooltip as ɵi, QMSCKEditorImageMapComponent as ɵj, QMSCKEditorImageMap as ɵk, QMSCKEditorUploadService as ɵl, QMSCKEditorBpmnData as ɵm, QMSCKEditorAboutComponent as ɵn, QMSCKEditorFlowchartComponent as ɵo };
30186
30371
  //# sourceMappingURL=qms-angular.js.map