qms-angular 1.0.76 → 1.0.77

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.
@@ -6907,7 +6907,7 @@
6907
6907
  RelatedPopupComponent.decorators = [
6908
6908
  { type: i0.Component, args: [{
6909
6909
  selector: 'qms-related-popup',
6910
- template: "<div id=\"qmslib_related_popup\" class=\"qmslib__related__popup__container\">\r\n <div id=\"qmslib_related_popup_header\">\r\n <span mat-icon-button class=\"button__close\" (click)=\"onCloseClick()\">\r\n <mat-icon mat-icon>close</mat-icon>\r\n </span>\r\n <div id=\"qmslib_related_popup_header_001\" mat-dialog-content>\r\n <span>{{ moduleName | uppercase }}</span>\r\n </div>\r\n </div>\r\n\r\n <div id=\"qmslib_related_popup_search\" class=\"input__field\">\r\n <input\r\n type=\"text\"\r\n placeholder=\"{{ LANG.SEARCH }}\"\r\n matInput\r\n [formControl]=\"myControl\"\r\n [matAutocomplete]=\"auto\"\r\n />\r\n <mat-icon>search</mat-icon>\r\n </div>\r\n\r\n <div class=\"line__divider\"></div>\r\n\r\n <mat-autocomplete\r\n #auto=\"matAutocomplete\"\r\n class=\"mat-autocomplete_related-viewport\"\r\n (optionSelected)=\"selectRelated($event.option.value)\"\r\n [displayWith]=\"displayWhenSelectRelatedOption\"\r\n >\r\n <cdk-virtual-scroll-viewport\r\n qms-scrollbar\r\n itemSize=\"10\"\r\n [class.related-viewport]=\"isInputValue\"\r\n >\r\n <ng-container *ngFor=\"let type of searchOrder\">\r\n <div\r\n class=\"search__module-result\"\r\n *ngIf=\"canShowSearchOption(type.value)\"\r\n >\r\n <span class=\"search__module-title\">{{ getTitle(type.value) }}</span>\r\n <mat-option\r\n class=\"search__option\"\r\n *ngFor=\"let option of getModuleFilteredOptions(type.value)\"\r\n [value]=\"option\"\r\n [disabled]=\"option.disabled\"\r\n >\r\n <qms-list-item type=\"image-square\">\r\n <mat-icon\r\n leading-icon\r\n type=\"image-square\"\r\n [svgIcon]=\"getNodeIcon(option)\"\r\n ></mat-icon>\r\n <div qms-list-header>\r\n <div\r\n qms-line\r\n type=\"caption\"\r\n qms-tool-tip=\"{{\r\n isEllipsisActive(searchItemResult) ? option.parentName : ''\r\n }}\"\r\n mode=\"dark\"\r\n *ngIf=\"getParentName(option)\"\r\n >\r\n <span #searchItemResult class=\"search__result__parent-name\">\r\n {{ option.parentName }}\r\n </span>\r\n </div>\r\n <div qms-line type=\"subtitle\" class=\"search__option-name\">\r\n {{ option.itemName }}\r\n </div>\r\n <div\r\n class=\"caption\"\r\n *ngIf=\"option.breadcumbs && option.breadcumbs.length\"\r\n >\r\n <qms-breadcrumb\r\n class=\"breadcrumb-containe\"\r\n type=\"table\"\r\n numDisplayItem=\"1\"\r\n [nodes]=\"option.breadcumbs\"\r\n >\r\n </qms-breadcrumb>\r\n </div>\r\n </div>\r\n <div qms-line color=\"default-subtitle\" *ngIf=\"getItemId(option)\">\r\n <span class=\"material-icons-outlined search__description-icon\">\r\n local_offer\r\n </span>\r\n {{ getItemId(option) }}\r\n </div>\r\n </qms-list-item>\r\n </mat-option>\r\n </div>\r\n </ng-container>\r\n </cdk-virtual-scroll-viewport>\r\n </mat-autocomplete>\r\n\r\n <div class=\"row\">\r\n <div\r\n class=\"qms-scrollbar qmslib_related_popup_content\"\r\n [ngClass]=\"{\r\n panel__content_item: checkedNodeList.length,\r\n panel__content: !checkedNodeList.length,\r\n 'col-6': splitView,\r\n 'col-12': !splitView\r\n }\"\r\n >\r\n <ng-container *ngIf=\"treeData1.length > 0\">\r\n <mat-expansion-panel\r\n hideToggle\r\n id=\"qmslib_related_popup_common_001\"\r\n [expanded]=\"isCommonExpanded\"\r\n (opened)=\"isCommonExpanded = true\"\r\n (closed)=\"isCommonExpanded = false\"\r\n class=\"panel-tree\"\r\n >\r\n <mat-expansion-panel-header class=\"padding-5\">\r\n <mat-panel-title *ngIf=\"moduleId === module.documentProcess\">\r\n {{ LANG.PROCESSES | uppercase }}\r\n </mat-panel-title>\r\n <mat-panel-title *ngIf=\"moduleId === module.deviation\">\r\n {{ LANG.DEVIATION | uppercase }}\r\n </mat-panel-title>\r\n <mat-panel-title *ngIf=\"moduleId === module.checklist\">\r\n {{ LANG.CHECKLIST | uppercase }}\r\n </mat-panel-title>\r\n <mat-panel-title *ngIf=\"moduleId === module.risk\">\r\n {{ LANG.ASSESSMENT | uppercase }}\r\n </mat-panel-title>\r\n <button qms-btn-icon class=\"related_popup_toggle-btn\">\r\n <mat-icon>\r\n {{\r\n isCommonExpanded ? \"keyboard_arrow_up\" : \"keyboard_arrow_down\"\r\n }}\r\n </mat-icon>\r\n </button>\r\n </mat-expansion-panel-header>\r\n <div id=\"qmslib_related_popup_common_002\">\r\n <qms-tree\r\n [treeData]=\"treeData1\"\r\n [treeConfig]=\"treeConfig1\"\r\n [selectedData]=\"selectedData\"\r\n [selectedRiskData]=\"selectedRiskData\"\r\n [disabledList]=\"disabledList\"\r\n (checkBoxEvent)=\"getCommonCheckedNode($event)\"\r\n (nodeExpandEvent)=\"getChildrenOfFolder($event, dataType.area)\"\r\n (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n [expandOnTitleClick]=\"!splitView\"\r\n [parentNodeOnClick]=\"parentNodeSelected\"\r\n (treeControlNodes)=\"selectTreeControlNodeProcess($event)\"\r\n ></qms-tree>\r\n </div>\r\n </mat-expansion-panel>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"treeData2.length > 0\">\r\n <div\r\n *ngIf=\"moduleId === module.documentProcess\"\r\n class=\"line__divider\"\r\n ></div>\r\n\r\n <mat-expansion-panel\r\n hideToggle\r\n *ngIf=\"moduleId === module.documentProcess\"\r\n id=\"qmslib_related_popup_document_001\"\r\n [expanded]=\"isDocumentExpanded\"\r\n (opened)=\"isDocumentExpanded = true\"\r\n (closed)=\"isDocumentExpanded = false\"\r\n class=\"panel-tree\"\r\n >\r\n <mat-expansion-panel-header class=\"padding-5\">\r\n <mat-panel-title>\r\n {{ LANG.DOCUMENTS | uppercase }}\r\n </mat-panel-title>\r\n <button qms-btn-icon class=\"related_popup_toggle-btn\">\r\n <mat-icon>\r\n {{\r\n isDocumentExpanded\r\n ? \"keyboard_arrow_up\"\r\n : \"keyboard_arrow_down\"\r\n }}\r\n </mat-icon>\r\n </button>\r\n </mat-expansion-panel-header>\r\n <div id=\"qmslib_related_popup_document_002\">\r\n <qms-tree\r\n [treeData]=\"treeData2\"\r\n [treeConfig]=\"treeConfig2\"\r\n [selectedData]=\"selectedData2\"\r\n [disabledList]=\"disabledList2\"\r\n (checkBoxEvent)=\"getDocumentCheckedNode($event)\"\r\n (nodeExpandEvent)=\"getChildrenOfFolder($event, dataType.folder)\"\r\n (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n [expandOnTitleClick]=\"!splitView\"\r\n [parentNodeOnClick]=\"parentNodeSelected\"\r\n (treeControlNodes)=\"selectTreeControlNodeDocument($event)\"\r\n ></qms-tree>\r\n </div>\r\n </mat-expansion-panel>\r\n </ng-container>\r\n </div>\r\n <div\r\n *ngIf=\"splitView\"\r\n class=\"\r\n qms-scrollbar\r\n qmslib-related-popup-splitview qmslib_related_popup_content\r\n col-6\r\n \"\r\n [ngClass]=\"{\r\n panel__content_item: checkedNodeList.length,\r\n panel__content: !checkedNodeList.length\r\n }\"\r\n >\r\n <div class=\"splitview-header\" *ngIf=\"selectedFolder\">\r\n {{ splitViewTitle }}\r\n </div>\r\n <div class=\"expand-node\" *ngFor=\"let node of itemInSplitview\">\r\n <mat-checkbox\r\n qms-group-options\r\n [disabled]=\"node.disabled\"\r\n color=\"default\"\r\n [checked]=\"isNodeSelected(node)\"\r\n (change)=\"toggleSelectItem(node)\"\r\n ></mat-checkbox>\r\n <mat-icon\r\n class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n [svgIcon]=\"getNodeIcon(node)\"\r\n ></mat-icon>\r\n <span class=\"text-node\">{{ node.itemName }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"checkedNodeList.length\" class=\"line__divider\"></div>\r\n\r\n <div *ngIf=\"checkedNodeList.length\" class=\"panel__item qms-scrollbar\">\r\n <div class=\"related__item__inline\" *ngFor=\"let item of checkedNodeList\">\r\n <button\r\n *ngIf=\"item.itemName\"\r\n mat-button\r\n class=\"related__item__content\"\r\n qms-tool-tip=\"{{\r\n isEllipsisActive(itemName) ? getItemChipName(item) : ''\r\n }}\"\r\n mode=\"dark\"\r\n >\r\n <span class=\"related__item__content_name\" #itemName>{{\r\n getItemChipName(item)\r\n }}</span>\r\n <mat-icon\r\n *ngIf=\"!(treeConfig1?.selectOne || treeConfig2?.selectOne)\"\r\n (click)=\"removeCheckedNodeList(item)\"\r\n >cancel</mat-icon\r\n >\r\n </button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"line__divider\"></div>\r\n\r\n <div class=\"confirm__button__groups\">\r\n <button\r\n *ngIf=\"!checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 7px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }}\r\n </button>\r\n <button\r\n *ngIf=\"checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 0px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }} ({{ checkedNodeList.length }})\r\n </button>\r\n <button\r\n qms-btn-text\r\n [ngStyle]=\"{ 'margin-top': checkedNodeList.length ? '0px' : '7px' }\"\r\n (click)=\"onCloseClick()\"\r\n >\r\n {{ LANG.CANCEL }}\r\n </button>\r\n </div>\r\n</div>\r\n",
6910
+ template: "<div id=\"qmslib_related_popup\" class=\"qmslib__related__popup__container\">\r\n <div id=\"qmslib_related_popup_header\">\r\n <span mat-icon-button class=\"button__close\" (click)=\"onCloseClick()\">\r\n <mat-icon mat-icon>close</mat-icon>\r\n </span>\r\n <div id=\"qmslib_related_popup_header_001\" mat-dialog-content>\r\n <span>{{ moduleName | uppercase }}</span>\r\n </div>\r\n </div>\r\n\r\n <div id=\"qmslib_related_popup_search\" class=\"input__field\">\r\n <input\r\n type=\"text\"\r\n placeholder=\"{{ LANG.SEARCH }}\"\r\n matInput\r\n [formControl]=\"myControl\"\r\n [matAutocomplete]=\"auto\"\r\n />\r\n <mat-icon>search</mat-icon>\r\n </div>\r\n\r\n <div class=\"line__divider\"></div>\r\n\r\n <mat-autocomplete\r\n #auto=\"matAutocomplete\"\r\n class=\"mat-autocomplete_related-viewport\"\r\n (optionSelected)=\"selectRelated($event.option.value)\"\r\n [displayWith]=\"displayWhenSelectRelatedOption\"\r\n >\r\n <cdk-virtual-scroll-viewport\r\n qms-scrollbar\r\n itemSize=\"10\"\r\n [class.related-viewport]=\"isInputValue\"\r\n *ngIf=\"filteredOptions.length\"\r\n >\r\n <ng-container *ngFor=\"let type of searchOrder\">\r\n <div\r\n class=\"search__module-result\"\r\n *ngIf=\"canShowSearchOption(type.value)\"\r\n >\r\n <span class=\"search__module-title\">{{ getTitle(type.value) }}</span>\r\n <mat-option\r\n class=\"search__option\"\r\n *ngFor=\"let option of getModuleFilteredOptions(type.value)\"\r\n [value]=\"option\"\r\n [disabled]=\"option.disabled\"\r\n >\r\n <qms-list-item type=\"image-square\">\r\n <mat-icon\r\n leading-icon\r\n type=\"image-square\"\r\n [svgIcon]=\"getNodeIcon(option)\"\r\n ></mat-icon>\r\n <div qms-list-header>\r\n <div\r\n qms-line\r\n type=\"caption\"\r\n qms-tool-tip=\"{{\r\n isEllipsisActive(searchItemResult) ? option.parentName : ''\r\n }}\"\r\n mode=\"dark\"\r\n *ngIf=\"getParentName(option)\"\r\n >\r\n <span #searchItemResult class=\"search__result__parent-name\">\r\n {{ option.parentName }}\r\n </span>\r\n </div>\r\n <div qms-line type=\"subtitle\" class=\"search__option-name\">\r\n {{ option.itemName }}\r\n </div>\r\n <div\r\n class=\"caption\"\r\n *ngIf=\"option.breadcumbs && option.breadcumbs.length\"\r\n >\r\n <qms-breadcrumb\r\n class=\"breadcrumb-containe\"\r\n type=\"table\"\r\n numDisplayItem=\"1\"\r\n [nodes]=\"option.breadcumbs\"\r\n >\r\n </qms-breadcrumb>\r\n </div>\r\n </div>\r\n <div qms-line color=\"default-subtitle\" *ngIf=\"getItemId(option)\">\r\n <span class=\"material-icons-outlined search__description-icon\">\r\n local_offer\r\n </span>\r\n {{ getItemId(option) }}\r\n </div>\r\n </qms-list-item>\r\n </mat-option>\r\n </div>\r\n </ng-container>\r\n </cdk-virtual-scroll-viewport>\r\n </mat-autocomplete>\r\n\r\n <div class=\"row\">\r\n <div\r\n class=\"qms-scrollbar qmslib_related_popup_content\"\r\n [ngClass]=\"{\r\n panel__content_item: checkedNodeList.length,\r\n panel__content: !checkedNodeList.length,\r\n 'col-6': splitView,\r\n 'col-12': !splitView\r\n }\"\r\n >\r\n <ng-container *ngIf=\"treeData1.length > 0\">\r\n <mat-expansion-panel\r\n hideToggle\r\n id=\"qmslib_related_popup_common_001\"\r\n [expanded]=\"isCommonExpanded\"\r\n (opened)=\"isCommonExpanded = true\"\r\n (closed)=\"isCommonExpanded = false\"\r\n class=\"panel-tree\"\r\n >\r\n <mat-expansion-panel-header class=\"padding-5\">\r\n <mat-panel-title *ngIf=\"moduleId === module.documentProcess\">\r\n {{ LANG.PROCESSES | uppercase }}\r\n </mat-panel-title>\r\n <mat-panel-title *ngIf=\"moduleId === module.deviation\">\r\n {{ LANG.DEVIATION | uppercase }}\r\n </mat-panel-title>\r\n <mat-panel-title *ngIf=\"moduleId === module.checklist\">\r\n {{ LANG.CHECKLIST | uppercase }}\r\n </mat-panel-title>\r\n <mat-panel-title *ngIf=\"moduleId === module.risk\">\r\n {{ LANG.ASSESSMENT | uppercase }}\r\n </mat-panel-title>\r\n <button qms-btn-icon class=\"related_popup_toggle-btn\">\r\n <mat-icon>\r\n {{\r\n isCommonExpanded ? \"keyboard_arrow_up\" : \"keyboard_arrow_down\"\r\n }}\r\n </mat-icon>\r\n </button>\r\n </mat-expansion-panel-header>\r\n <div id=\"qmslib_related_popup_common_002\">\r\n <qms-tree\r\n [treeData]=\"treeData1\"\r\n [treeConfig]=\"treeConfig1\"\r\n [selectedData]=\"selectedData\"\r\n [selectedRiskData]=\"selectedRiskData\"\r\n [disabledList]=\"disabledList\"\r\n (checkBoxEvent)=\"getCommonCheckedNode($event)\"\r\n (nodeExpandEvent)=\"getChildrenOfFolder($event, dataType.area)\"\r\n (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n [expandOnTitleClick]=\"!splitView\"\r\n [parentNodeOnClick]=\"parentNodeSelected\"\r\n (treeControlNodes)=\"selectTreeControlNodeProcess($event)\"\r\n ></qms-tree>\r\n </div>\r\n </mat-expansion-panel>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"treeData2.length > 0\">\r\n <div\r\n *ngIf=\"moduleId === module.documentProcess\"\r\n class=\"line__divider\"\r\n ></div>\r\n\r\n <mat-expansion-panel\r\n hideToggle\r\n *ngIf=\"moduleId === module.documentProcess\"\r\n id=\"qmslib_related_popup_document_001\"\r\n [expanded]=\"isDocumentExpanded\"\r\n (opened)=\"isDocumentExpanded = true\"\r\n (closed)=\"isDocumentExpanded = false\"\r\n class=\"panel-tree\"\r\n >\r\n <mat-expansion-panel-header class=\"padding-5\">\r\n <mat-panel-title>\r\n {{ LANG.DOCUMENTS | uppercase }}\r\n </mat-panel-title>\r\n <button qms-btn-icon class=\"related_popup_toggle-btn\">\r\n <mat-icon>\r\n {{\r\n isDocumentExpanded\r\n ? \"keyboard_arrow_up\"\r\n : \"keyboard_arrow_down\"\r\n }}\r\n </mat-icon>\r\n </button>\r\n </mat-expansion-panel-header>\r\n <div id=\"qmslib_related_popup_document_002\">\r\n <qms-tree\r\n [treeData]=\"treeData2\"\r\n [treeConfig]=\"treeConfig2\"\r\n [selectedData]=\"selectedData2\"\r\n [disabledList]=\"disabledList2\"\r\n (checkBoxEvent)=\"getDocumentCheckedNode($event)\"\r\n (nodeExpandEvent)=\"getChildrenOfFolder($event, dataType.folder)\"\r\n (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n [expandOnTitleClick]=\"!splitView\"\r\n [parentNodeOnClick]=\"parentNodeSelected\"\r\n (treeControlNodes)=\"selectTreeControlNodeDocument($event)\"\r\n ></qms-tree>\r\n </div>\r\n </mat-expansion-panel>\r\n </ng-container>\r\n </div>\r\n <div\r\n *ngIf=\"splitView\"\r\n class=\"\r\n qms-scrollbar\r\n qmslib-related-popup-splitview qmslib_related_popup_content\r\n col-6\r\n \"\r\n [ngClass]=\"{\r\n panel__content_item: checkedNodeList.length,\r\n panel__content: !checkedNodeList.length\r\n }\"\r\n >\r\n <div class=\"splitview-header\" *ngIf=\"selectedFolder\">\r\n {{ splitViewTitle }}\r\n </div>\r\n <div class=\"expand-node\" *ngFor=\"let node of itemInSplitview\">\r\n <mat-checkbox\r\n qms-group-options\r\n [disabled]=\"node.disabled\"\r\n color=\"default\"\r\n [checked]=\"isNodeSelected(node)\"\r\n (change)=\"toggleSelectItem(node)\"\r\n ></mat-checkbox>\r\n <mat-icon\r\n class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n [svgIcon]=\"getNodeIcon(node)\"\r\n ></mat-icon>\r\n <span class=\"text-node\">{{ node.itemName }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"checkedNodeList.length\" class=\"line__divider\"></div>\r\n\r\n <div *ngIf=\"checkedNodeList.length\" class=\"panel__item qms-scrollbar\">\r\n <div class=\"related__item__inline\" *ngFor=\"let item of checkedNodeList\">\r\n <button\r\n *ngIf=\"item.itemName\"\r\n mat-button\r\n class=\"related__item__content\"\r\n qms-tool-tip=\"{{\r\n isEllipsisActive(itemName) ? getItemChipName(item) : ''\r\n }}\"\r\n mode=\"dark\"\r\n >\r\n <span class=\"related__item__content_name\" #itemName>{{\r\n getItemChipName(item)\r\n }}</span>\r\n <mat-icon\r\n *ngIf=\"!(treeConfig1?.selectOne || treeConfig2?.selectOne)\"\r\n (click)=\"removeCheckedNodeList(item)\"\r\n >cancel</mat-icon\r\n >\r\n </button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"line__divider\"></div>\r\n\r\n <div class=\"confirm__button__groups\">\r\n <button\r\n *ngIf=\"!checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 7px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }}\r\n </button>\r\n <button\r\n *ngIf=\"checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 0px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }} ({{ checkedNodeList.length }})\r\n </button>\r\n <button\r\n qms-btn-text\r\n [ngStyle]=\"{ 'margin-top': checkedNodeList.length ? '0px' : '7px' }\"\r\n (click)=\"onCloseClick()\"\r\n >\r\n {{ LANG.CANCEL }}\r\n </button>\r\n </div>\r\n</div>\r\n",
6911
6911
  encapsulation: i0.ViewEncapsulation.None,
6912
6912
  styles: [".qms-scrollbar::-webkit-scrollbar{width:12px}.qms-scrollbar::-webkit-scrollbar-track{background:rgba(0,0,0,.12);background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb{background:rgba(0,0,0,.38);border-radius:20px;width:4px;border:4px solid transparent;background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.5);background-clip:content-box;border:4px solid transparent}.qms-scrollbar.none-scroll-bg::-webkit-scrollbar-track{background:transparent;background-clip:content-box}.qms__popup .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qms__danger button{border:none;color:#fff;padding:0;text-align:center;text-decoration:none;display:inline-block;cursor:pointer;height:20px;width:20px;font-family:Open Sans;font-size:12px;font-weight:600;font-style:normal;line-height:16px}.qms__danger .red{background-color:#9e360f;margin-left:10px}.qms__danger .yellow{background-color:#e4cf53;margin-left:10px;color:#323232}.qms__danger .green{background-color:#00804c;margin-left:10px}.confirm__button__groups{margin-top:11px}.confirm__button__groups button{min-height:36px;width:auto;font-family:Open Sans;font-weight:500;font-size:14px;letter-spacing:1px;line-height:16px;padding-left:15px;padding-right:15px;margin-right:5px;float:right}.confirm__button__groups .confirm{background:#f8f9f9}.confirm__button__groups .confirm:hover{background:#001983;color:#fff}.confirm__button__groups .confirm:disabled{cursor:not-allowed}.confirm__button__groups .cancel{background:#f8f9f9}.confirm__button__groups .cancel:hover{background:#001983;color:#fff}.qmslib__related__popup__container .input__field{display:flex;align-items:center}.qmslib__related__popup__container .input__field input{width:100%;padding:10px;outline:none;border:none;background:#eee}.qmslib__related__popup__container .input__field .mat-icon{margin-left:-30px;cursor:pointer;vertical-align:middle}.qmslib__related__popup__container .line__divider{border-bottom:1px solid #ccc;height:1px;margin-top:10px;min-width:300px;max-width:100%}.qmslib__related__popup__container .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qmslib__related__popup__container .panel__content{height:450px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel__content_item{height:350px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel-tree .mat-expansion-panel-body{padding:0 12px 12px}.qmslib__related__popup__container .mat-expansion-panel-header{height:30px;font-size:12px;letter-spacing:1px;font-family:Raleway;font-weight:600;padding:0}.qmslib__related__popup__container .mat-expansion-panel-header .mat-expansion-panel-header-title{align-items:center;margin-left:12px}.qmslib__related__popup__container .mat-expansion-panel-header .related_popup_toggle-btn{width:1.5rem;height:1.5rem;line-height:1.5rem}.qmslib__related__popup__container .mat-expansion-panel:not([class*=mat-elevation-z]){box-shadow:none}.qmslib__related__popup__container .panel__item{height:100px;margin-top:12px;overflow-x:hidden;overflow-y:auto;padding-right:5px;width:100%;max-width:100%;display:flex;flex-wrap:wrap;align-content:flex-start}.qmslib__related__popup__container .panel__item .related__item__inline{max-width:100%}.qmslib__related__popup__container .panel__item .related__item__content{height:32px;line-height:32px;background-color:#e5e5e5;max-width:100%;margin-bottom:5px;margin-left:2.5px;margin-right:2.5px}.qmslib__related__popup__container .panel__item .related__item__content .mat-icon{color:#8e8e8e;font-size:24px}.qmslib__related__popup__container .panel__item .related__item__content span.related__item__content_name{display:inline-block;min-width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:278px}.qmslib__related__popup__container .qmslib-related-popup-splitview{background-color:#fff;border-left:1px solid #ccc;height:450px;overflow-y:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview.panel__content{height:450px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview.panel__content_item{height:350px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview .splitview-header{height:30px;font-size:12px;letter-spacing:1px;font-family:RALEWAY;font-weight:600;display:flex;align-items:center}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options{padding:0}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options .mat-checkbox-inner-container{margin-right:11px}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options.mat-checkbox-checked{background:transparent!important}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node{margin-left:8px;display:flex;align-items:center;min-height:40px}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node .mat-icon{color:rgba(0,0,0,.6);margin-right:17px;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node .mat-icon svg{display:block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}cdk-virtual-scroll-viewport{overflow-x:hidden}cdk-virtual-scroll-viewport .search__module-result{margin:1.5rem;padding:0 0 .5rem}cdk-virtual-scroll-viewport .search__module-result .search__module-title{font-size:14px;font-weight:600}cdk-virtual-scroll-viewport .search__module-result .search__option{height:auto;line-height:normal;padding:8px 0;border-bottom:1px solid #e0e0e0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item.mat-2-line.image-item{height:auto}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content{margin:0;border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square{width:2.5rem;height:100%;background:transparent;align-self:center;margin-right:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square img{width:24px;height:24px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .material-icons-outlined.leading-icon,cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content mat-icon.leading-icon{padding:4px 0 4px 4px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .subtitle{font-weight:400}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption{overflow:hidden;line-height:normal;white-space:normal;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:0;margin:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption span.search__result__parent-name{display:inline-block;width:auto;width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .default-subtitle{color:rgba(0,0,0,.38)}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .search__description-icon{margin-right:0;width:12px;height:12px;font-size:12px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .qms-list-text{border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .breadcrumb-containe .qms-breadcrumb-item .mat-icon{font-size:16px!important;padding-bottom:1px}cdk-virtual-scroll-viewport .search__module-result .mat-option[aria-disabled=true] .breadcrumb-containe .qms-breadcrumb-item-text,cdk-virtual-scroll-viewport .search__module-result .mat-option[aria-disabled=true] .breadcrumb-containe .qms-breadcrumb-item .mat-icon,cdk-virtual-scroll-viewport .search__module-result .mat-option[aria-disabled=true] .subtitle{color:rgba(0,0,0,.38)}cdk-virtual-scroll-viewport .search__module-result svg{display:block}#qmslib_related_popup_header_001{margin-bottom:20px;padding:0;font-weight:600;font-family:Raleway}.padding-5{padding:5px}.mat-autocomplete_related-viewport{height:100%;max-height:100%!important}.mat-autocomplete_related-viewport .cdk-virtual-scroll-content-wrapper{width:100%}.mat-autocomplete_related-viewport .related-viewport{min-height:300px}"]
6913
6913
  },] }
@@ -19185,7 +19185,7 @@
19185
19185
  SelectIncludeChildrenPopUpComponent.decorators = [
19186
19186
  { type: i0.Component, args: [{
19187
19187
  selector: 'qms-select-include-children-popup',
19188
- template: "<div id=\"qmslib_related_popup\" class=\"qmslib__related__popup__container\">\r\n <div id=\"qmslib_related_popup_header\">\r\n <span mat-icon-button class=\"button__close\" (click)=\"onCloseClick()\">\r\n <mat-icon mat-icon>close</mat-icon>\r\n </span>\r\n <div id=\"qmslib_related_popup_header_001\" mat-dialog-content>\r\n <span>{{ headerName | uppercase }}</span>\r\n </div>\r\n </div>\r\n\r\n <div\r\n id=\"qmslib_related_popup_search\"\r\n class=\"input__field\"\r\n (click)=\"showSearchResult()\"\r\n >\r\n <input\r\n #name\r\n type=\"text\"\r\n placeholder=\"{{ LANG.SEARCH }}\"\r\n matInput\r\n [formControl]=\"myControl\"\r\n [matAutocomplete]=\"auto\"\r\n #autoCompleteInputSearch\r\n />\r\n <mat-icon>search</mat-icon>\r\n </div>\r\n <div class=\"select__toggle-include\">\r\n <mat-slide-toggle\r\n [checked]=\"includeChildren\"\r\n (change)=\"setValue($event)\"\r\n color=\"default\"\r\n qms-group-options\r\n >\r\n <span class=\"text-label\">{{ selectIncludeLabel }}</span>\r\n </mat-slide-toggle>\r\n </div>\r\n <div class=\"line__divider\"></div>\r\n\r\n <mat-autocomplete\r\n #auto=\"matAutocomplete\"\r\n [displayWith]=\"displayRelated\"\r\n class=\"mat-autocomplete_related-viewport\"\r\n >\r\n <cdk-virtual-scroll-viewport\r\n qms-scrollbar\r\n itemSize=\"10\"\r\n class=\"related-viewport\"\r\n >\r\n <div class=\"search__module-result\" *ngIf=\"filteredOptions\">\r\n <mat-option\r\n class=\"search__option\"\r\n *ngFor=\"let option of filteredOptions\"\r\n [value]=\"option\"\r\n (click)=\"selectSearchOption(option)\"\r\n >\r\n <qms-list-item type=\"image-square\">\r\n <mat-icon\r\n leading-icon\r\n *ngIf=\"getItemIconType(option) === itemIconType.name\"\r\n class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n type=\"image-square\"\r\n >\r\n {{ option.itemIcon }}\r\n </mat-icon>\r\n\r\n <mat-icon\r\n leading-icon\r\n *ngIf=\"getItemIconType(option) === itemIconType.svg\"\r\n class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n type=\"image-square\"\r\n [svgIcon]=\"option.itemIconSvg\"\r\n >\r\n </mat-icon>\r\n\r\n <img\r\n leading-icon\r\n *ngIf=\"getItemIconType(option) === itemIconType.path\"\r\n class=\"mat-icon\"\r\n [src]=\"option.itemIconPath\"\r\n type=\"image-square\"\r\n />\r\n\r\n <img\r\n leading-icon\r\n *ngIf=\"getItemIconType(option) === itemIconType.base64\"\r\n class=\"mat-icon image-base64\"\r\n [src]=\"getImagePath(option)\"\r\n type=\"image-square\"\r\n />\r\n <div qms-list-header>\r\n <div qms-line type=\"subtitle\" class=\"search__option-name\">\r\n {{ option.itemName }}\r\n </div>\r\n </div>\r\n </qms-list-item>\r\n </mat-option>\r\n </div>\r\n </cdk-virtual-scroll-viewport>\r\n </mat-autocomplete>\r\n\r\n <div class=\"row\">\r\n <div\r\n class=\"qms-scrollbar qmslib_related_popup_content col-12\"\r\n [ngClass]=\"{\r\n panel__content_item: checkedNodeList.length,\r\n panel__content: !checkedNodeList.length\r\n }\"\r\n >\r\n <div id=\"qmslib_related_popup_common_002\">\r\n <qms-tree\r\n [treeData]=\"treeData\"\r\n [treeConfig]=\"treeConfig\"\r\n [selectedData]=\"selectedData\"\r\n [selectedRiskData]=\"selectedRiskData\"\r\n [disabledList]=\"disabledList\"\r\n (checkBoxEvent)=\"getCommonCheckedNode($event)\"\r\n (nodeExpandEvent)=\"getChildrenOfFolder($event)\"\r\n (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n ></qms-tree>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"checkedNodeList.length\" class=\"line__divider\"></div>\r\n\r\n <div *ngIf=\"checkedNodeList.length\" class=\"panel__item qms-scrollbar\">\r\n <div class=\"related__item__inline\" *ngFor=\"let item of checkedNodeList\">\r\n <button\r\n *ngIf=\"item.itemName\"\r\n mat-button\r\n class=\"related__item__content\"\r\n qms-tool-tip=\"{{\r\n isEllipsisActive(itemName) ? getItemChipName(item) : ''\r\n }}\"\r\n mode=\"dark\"\r\n >\r\n <span class=\"related__item__content_name\" #itemName>\r\n {{ getItemChipName(item) }}\r\n <span\r\n class=\"select__include-children__count\"\r\n *ngIf=\"item.noSelectedChildren > 0\"\r\n >\r\n {{ getItemSelectedChildrenRatio(item) }}\r\n </span>\r\n </span>\r\n\r\n <mat-icon (click)=\"removeCheckedNodeList(item)\">cancel</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"line__divider\"></div>\r\n\r\n <div class=\"confirm__button__groups\">\r\n <button\r\n *ngIf=\"!checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 7px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }}\r\n </button>\r\n <button\r\n *ngIf=\"checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 0px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }} ({{ checkedNodeList.length }})\r\n </button>\r\n <button\r\n qms-btn-text\r\n [ngStyle]=\"{ 'margin-top': checkedNodeList.length ? '0px' : '7px' }\"\r\n (click)=\"onCloseClick()\"\r\n >\r\n {{ LANG.CANCEL }}\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n",
19188
+ template: "<div id=\"qmslib_related_popup\" class=\"qmslib__related__popup__container\">\r\n <div id=\"qmslib_related_popup_header\">\r\n <span mat-icon-button class=\"button__close\" (click)=\"onCloseClick()\">\r\n <mat-icon mat-icon>close</mat-icon>\r\n </span>\r\n <div id=\"qmslib_related_popup_header_001\" mat-dialog-content>\r\n <span>{{ headerName | uppercase }}</span>\r\n </div>\r\n </div>\r\n\r\n <div\r\n id=\"qmslib_related_popup_search\"\r\n class=\"input__field\"\r\n (click)=\"showSearchResult()\"\r\n >\r\n <input\r\n #name\r\n type=\"text\"\r\n placeholder=\"{{ LANG.SEARCH }}\"\r\n matInput\r\n [formControl]=\"myControl\"\r\n [matAutocomplete]=\"auto\"\r\n #autoCompleteInputSearch\r\n />\r\n <mat-icon>search</mat-icon>\r\n </div>\r\n <div class=\"select__toggle-include\">\r\n <mat-slide-toggle\r\n [checked]=\"includeChildren\"\r\n (change)=\"setValue($event)\"\r\n color=\"default\"\r\n qms-group-options\r\n >\r\n <span class=\"text-label\">{{ selectIncludeLabel }}</span>\r\n </mat-slide-toggle>\r\n </div>\r\n <div class=\"line__divider\"></div>\r\n\r\n <mat-autocomplete\r\n #auto=\"matAutocomplete\"\r\n [displayWith]=\"displayRelated\"\r\n class=\"mat-autocomplete_related-viewport\"\r\n >\r\n <cdk-virtual-scroll-viewport\r\n qms-scrollbar\r\n itemSize=\"10\"\r\n class=\"related-viewport\"\r\n *ngIf=\"filteredOptions.length\"\r\n >\r\n <div class=\"search__module-result\" *ngIf=\"filteredOptions\">\r\n <mat-option\r\n class=\"search__option\"\r\n *ngFor=\"let option of filteredOptions\"\r\n [value]=\"option\"\r\n (click)=\"selectSearchOption(option)\"\r\n >\r\n <qms-list-item type=\"image-square\">\r\n <mat-icon\r\n leading-icon\r\n *ngIf=\"getItemIconType(option) === itemIconType.name\"\r\n class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n type=\"image-square\"\r\n >\r\n {{ option.itemIcon }}\r\n </mat-icon>\r\n\r\n <mat-icon\r\n leading-icon\r\n *ngIf=\"getItemIconType(option) === itemIconType.svg\"\r\n class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n type=\"image-square\"\r\n [svgIcon]=\"option.itemIconSvg\"\r\n >\r\n </mat-icon>\r\n\r\n <img\r\n leading-icon\r\n *ngIf=\"getItemIconType(option) === itemIconType.path\"\r\n class=\"mat-icon\"\r\n [src]=\"option.itemIconPath\"\r\n type=\"image-square\"\r\n />\r\n\r\n <img\r\n leading-icon\r\n *ngIf=\"getItemIconType(option) === itemIconType.base64\"\r\n class=\"mat-icon image-base64\"\r\n [src]=\"getImagePath(option)\"\r\n type=\"image-square\"\r\n />\r\n <div qms-list-header>\r\n <div qms-line type=\"subtitle\" class=\"search__option-name\">\r\n {{ option.itemName }}\r\n </div>\r\n </div>\r\n </qms-list-item>\r\n </mat-option>\r\n </div>\r\n </cdk-virtual-scroll-viewport>\r\n </mat-autocomplete>\r\n\r\n <div class=\"row\">\r\n <div\r\n class=\"qms-scrollbar qmslib_related_popup_content col-12\"\r\n [ngClass]=\"{\r\n panel__content_item: checkedNodeList.length,\r\n panel__content: !checkedNodeList.length\r\n }\"\r\n >\r\n <div id=\"qmslib_related_popup_common_002\">\r\n <qms-tree\r\n [treeData]=\"treeData\"\r\n [treeConfig]=\"treeConfig\"\r\n [selectedData]=\"selectedData\"\r\n [selectedRiskData]=\"selectedRiskData\"\r\n [disabledList]=\"disabledList\"\r\n (checkBoxEvent)=\"getCommonCheckedNode($event)\"\r\n (nodeExpandEvent)=\"getChildrenOfFolder($event)\"\r\n (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n ></qms-tree>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"checkedNodeList.length\" class=\"line__divider\"></div>\r\n\r\n <div *ngIf=\"checkedNodeList.length\" class=\"panel__item qms-scrollbar\">\r\n <div class=\"related__item__inline\" *ngFor=\"let item of checkedNodeList\">\r\n <button\r\n *ngIf=\"item.itemName\"\r\n mat-button\r\n class=\"related__item__content\"\r\n qms-tool-tip=\"{{\r\n isEllipsisActive(itemName) ? getItemChipName(item) : ''\r\n }}\"\r\n mode=\"dark\"\r\n >\r\n <span class=\"related__item__content_name\" #itemName>\r\n {{ getItemChipName(item) }}\r\n <span\r\n class=\"select__include-children__count\"\r\n *ngIf=\"item.noSelectedChildren > 0\"\r\n >\r\n {{ getItemSelectedChildrenRatio(item) }}\r\n </span>\r\n </span>\r\n\r\n <mat-icon (click)=\"removeCheckedNodeList(item)\">cancel</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"line__divider\"></div>\r\n\r\n <div class=\"confirm__button__groups\">\r\n <button\r\n *ngIf=\"!checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 7px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }}\r\n </button>\r\n <button\r\n *ngIf=\"checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 0px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }} ({{ checkedNodeList.length }})\r\n </button>\r\n <button\r\n qms-btn-text\r\n [ngStyle]=\"{ 'margin-top': checkedNodeList.length ? '0px' : '7px' }\"\r\n (click)=\"onCloseClick()\"\r\n >\r\n {{ LANG.CANCEL }}\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n",
19189
19189
  encapsulation: i0.ViewEncapsulation.None,
19190
19190
  styles: [".qms-scrollbar::-webkit-scrollbar{width:12px}.qms-scrollbar::-webkit-scrollbar-track{background:rgba(0,0,0,.12);background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb{background:rgba(0,0,0,.38);border-radius:20px;width:4px;border:4px solid transparent;background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.5);background-clip:content-box;border:4px solid transparent}.qms-scrollbar.none-scroll-bg::-webkit-scrollbar-track{background:transparent;background-clip:content-box}.qms__popup .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qms__danger button{border:none;color:#fff;padding:0;text-align:center;text-decoration:none;display:inline-block;cursor:pointer;height:20px;width:20px;font-family:Open Sans;font-size:12px;font-weight:600;font-style:normal;line-height:16px}.qms__danger .red{background-color:#9e360f;margin-left:10px}.qms__danger .yellow{background-color:#e4cf53;margin-left:10px;color:#323232}.qms__danger .green{background-color:#00804c;margin-left:10px}.confirm__button__groups{margin-top:11px}.confirm__button__groups button{min-height:36px;width:auto;font-family:Open Sans;font-weight:500;font-size:14px;letter-spacing:1px;line-height:16px;padding-left:15px;padding-right:15px;margin-right:5px;float:right}.confirm__button__groups .confirm{background:#f8f9f9}.confirm__button__groups .confirm:hover{background:#001983;color:#fff}.confirm__button__groups .confirm:disabled{cursor:not-allowed}.confirm__button__groups .cancel{background:#f8f9f9}.confirm__button__groups .cancel:hover{background:#001983;color:#fff}.qmslib__related__popup__container .input__field{display:flex;align-items:center}.qmslib__related__popup__container .input__field input{width:100%;padding:10px;outline:none;border:none;background:#eee}.qmslib__related__popup__container .input__field .mat-icon{margin-left:-30px;cursor:pointer;vertical-align:middle}.qmslib__related__popup__container .line__divider{border-bottom:1px solid #ccc;height:1px;margin-top:10px;min-width:300px;max-width:100%}.qmslib__related__popup__container .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qmslib__related__popup__container .panel__content{height:450px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel__content_item{height:350px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel-tree .mat-expansion-panel-body{padding:0 12px 12px}.qmslib__related__popup__container .mat-expansion-panel-header{height:30px;font-size:12px;letter-spacing:1px;font-family:Raleway;font-weight:600;padding:0}.qmslib__related__popup__container .mat-expansion-panel-header .mat-expansion-panel-header-title{align-items:center;margin-left:12px}.qmslib__related__popup__container .mat-expansion-panel-header .related_popup_toggle-btn{width:1.5rem;height:1.5rem;line-height:1.5rem}.qmslib__related__popup__container .mat-expansion-panel:not([class*=mat-elevation-z]){box-shadow:none}.qmslib__related__popup__container .panel__item{height:100px;margin-top:12px;overflow-x:hidden;overflow-y:auto;padding-right:5px;width:100%;max-width:100%;display:flex;flex-wrap:wrap;align-content:flex-start}.qmslib__related__popup__container .panel__item .related__item__inline{max-width:100%}.qmslib__related__popup__container .panel__item .select__toggle-include{width:100%}.qmslib__related__popup__container .panel__item .related__item__content{height:32px;line-height:32px;background-color:#e5e5e5;max-width:100%;margin-bottom:5px;margin-left:2.5px;margin-right:2.5px}.qmslib__related__popup__container .panel__item .related__item__content .mat-icon{color:#8e8e8e;font-size:24px}.qmslib__related__popup__container .panel__item .related__item__content span.related__item__content_name{display:inline-block;min-width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px}.qmslib__related__popup__container .panel__item .related__item__content span.related__item__content_name .select__include-children__count{font-size:.75rem;color:rgba(0,0,0,.38)}.qmslib__related__popup__container .qmslib-related-popup-splitview{background-color:#fff;border-left:1px solid #ccc;height:450px;overflow-y:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview.panel__content{height:450px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview.panel__content_item{height:350px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview .splitview-header{height:30px;font-size:12px;letter-spacing:1px;font-family:RALEWAY;font-weight:600;display:flex;align-items:center}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options{padding:0}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options .mat-checkbox-inner-container{margin-right:11px}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options.mat-checkbox-checked{background:transparent!important}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node{margin-left:8px;display:flex;align-items:center;min-height:40px}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node .mat-icon{color:rgba(0,0,0,.6);margin-right:17px;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node .mat-icon svg{display:block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}cdk-virtual-scroll-viewport{overflow-x:hidden}cdk-virtual-scroll-viewport .search__module-result{margin:1.5rem;padding:0 0 .5rem}cdk-virtual-scroll-viewport .search__module-result .search__module-title{font-size:14px;font-weight:600}cdk-virtual-scroll-viewport .search__module-result .search__option{height:auto;line-height:normal;padding:8px 0;border-bottom:1px solid #e0e0e0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item.mat-2-line.image-item{height:auto}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content{margin:0;border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square{width:2.5rem;height:100%;background:transparent;align-self:center;margin-right:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square img{width:24px;height:24px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .material-icons-outlined.leading-icon,cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content mat-icon.leading-icon{padding:4px 0 4px 4px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .subtitle{font-weight:400}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption{overflow:hidden;line-height:normal;white-space:normal;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:0;margin:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption span.search__result__parent-name{display:inline-block;width:auto;width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .default-subtitle{color:rgba(0,0,0,.38)}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .search__description-icon{margin-right:0;width:12px;height:12px;font-size:12px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .qms-list-text{border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .breadcrumb-containe .qms-breadcrumb-item .mat-icon{font-size:16px!important;padding-bottom:1px}cdk-virtual-scroll-viewport .search__module-result svg{display:block}#qmslib_related_popup_header_001{margin-bottom:20px;padding:0;font-weight:600;font-family:Raleway}.padding-5{padding:5px}.mat-autocomplete_related-viewport{height:100%;max-height:100%!important}.mat-autocomplete_related-viewport .cdk-virtual-scroll-content-wrapper{width:100%}.mat-autocomplete_related-viewport .related-viewport{min-height:10.25rem}"]
19191
19191
  },] }
@@ -19753,7 +19753,7 @@
19753
19753
  SelectOneDialog.decorators = [
19754
19754
  { type: i0.Component, args: [{
19755
19755
  selector: 'qms-select-one',
19756
- template: "<div id=\"qmslib_related_popup\" class=\"qmslib__related__popup__container\">\r\n <div id=\"qmslib_related_popup_header\">\r\n <span mat-icon-button class=\"button__close\" (click)=\"onCloseClick()\">\r\n <mat-icon mat-icon>close</mat-icon>\r\n </span>\r\n <div id=\"qmslib_related_popup_header_001\" mat-dialog-content>\r\n <span>{{ moduleName }}</span>\r\n </div>\r\n </div>\r\n\r\n <div\r\n id=\"qmslib_related_popup_search\"\r\n class=\"input__field\"\r\n (click)=\"showSearchResult()\"\r\n >\r\n <input\r\n #name\r\n type=\"text\"\r\n placeholder=\"{{ LANG.SEARCH }}\"\r\n matInput\r\n [formControl]=\"myControl\"\r\n [matAutocomplete]=\"auto\"\r\n #autoCompleteInputSearch\r\n />\r\n <mat-icon>search</mat-icon>\r\n </div>\r\n\r\n <div class=\"line__divider\"></div>\r\n\r\n <mat-autocomplete\r\n #auto=\"matAutocomplete\"\r\n [displayWith]=\"displayRelated\"\r\n class=\"mat-autocomplete_related-viewport\"\r\n >\r\n <cdk-virtual-scroll-viewport\r\n qms-scrollbar\r\n itemSize=\"10\"\r\n class=\"related-viewport\"\r\n >\r\n <div class=\"search__module-result\" *ngIf=\"filteredOptions.length\">\r\n <mat-option\r\n class=\"search__option\"\r\n *ngFor=\"let option of getModuleFilteredOptions()\"\r\n [value]=\"option\"\r\n (click)=\"selectItemSearched(option)\"\r\n >\r\n <qms-list-item type=\"image-square\">\r\n <mat-icon\r\n leading-icon\r\n type=\"image-square\"\r\n [svgIcon]=\"getNodeIcon(option)\"\r\n ></mat-icon>\r\n <div qms-list-header>\r\n <div\r\n qms-line\r\n type=\"caption\"\r\n qms-tool-tip=\"{{\r\n isEllipsisActive(searchItemResult) ? option.parentName : ''\r\n }}\"\r\n mode=\"dark\"\r\n *ngIf=\"getParentName(option)\"\r\n >\r\n <span #searchItemResult class=\"search__result__parent-name\">\r\n {{ option.parentName }}\r\n </span>\r\n </div>\r\n <div qms-line type=\"subtitle\" class=\"search__option-name\">\r\n {{ option.itemName }}\r\n </div>\r\n <div\r\n class=\"caption\"\r\n *ngIf=\"option.breadcumbs && option.breadcumbs.length\"\r\n >\r\n <qms-breadcrumb\r\n class=\"breadcrumb-containe\"\r\n type=\"table\"\r\n numDisplayItem=\"1\"\r\n [nodes]=\"option.breadcumbs\"\r\n >\r\n </qms-breadcrumb>\r\n </div>\r\n </div>\r\n <div qms-line color=\"default-subtitle\" *ngIf=\"getItemId(option)\">\r\n <span class=\"material-icons-outlined search__description-icon\">\r\n local_offer\r\n </span>\r\n {{ getItemId(option) }}\r\n </div>\r\n </qms-list-item>\r\n </mat-option>\r\n </div>\r\n </cdk-virtual-scroll-viewport>\r\n </mat-autocomplete>\r\n\r\n <div class=\"row\">\r\n <div\r\n class=\"qms-scrollbar col-12 qmslib_related_popup_content\"\r\n [ngClass]=\"{\r\n panel__content_item: checkedNodeList.length,\r\n panel__content: !checkedNodeList.length\r\n }\"\r\n >\r\n <mat-expansion-panel\r\n hideToggle\r\n id=\"qmslib_related_popup_common_001\"\r\n [expanded]=\"isCommonExpanded\"\r\n (opened)=\"isCommonExpanded = true\"\r\n (closed)=\"isCommonExpanded = false\"\r\n class=\"panel-tree\"\r\n >\r\n <div id=\"qmslib_related_popup_common_002\">\r\n <qms-tree\r\n [treeData]=\"treeData\"\r\n [treeConfig]=\"treeConfig\"\r\n [selectedData]=\"selectedData\"\r\n [selectedRiskData]=\"selectedRiskData\"\r\n [disabledList]=\"disabledList\"\r\n (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n [expandOnTitleClick]=\"false\"\r\n [expandToChildNode]=\"expandToChildNode\"\r\n ></qms-tree>\r\n </div>\r\n </mat-expansion-panel>\r\n </div>\r\n </div>\r\n\r\n <!-- <div *ngIf=\"checkedNodeList.length\" class=\"line__divider\"></div>\r\n\r\n <div *ngIf=\"checkedNodeList.length\" class=\"panel__item qms-scrollbar\">\r\n <div class=\"related__item__inline\" *ngFor=\"let item of checkedNodeList\">\r\n <button\r\n *ngIf=\"item.itemName\"\r\n mat-button\r\n class=\"related__item__content\"\r\n qms-tool-tip=\"{{\r\n isEllipsisActive(itemName) ? getItemChipName(item) : ''\r\n }}\"\r\n mode=\"dark\"\r\n >\r\n <span class=\"related__item__content_name\" #itemName>{{\r\n getItemChipName(item)\r\n }}</span>\r\n <mat-icon (click)=\"removeCheckedNodeList()\">cancel</mat-icon>\r\n </button>\r\n </div>\r\n </div> -->\r\n\r\n <div class=\"line__divider\"></div>\r\n\r\n <div class=\"confirm__button__groups\">\r\n <button\r\n *ngIf=\"!checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 7px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }}\r\n </button>\r\n <button\r\n *ngIf=\"checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 0px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }} ({{ checkedNodeList.length }})\r\n </button>\r\n <button\r\n qms-btn-text\r\n [ngStyle]=\"{ 'margin-top': checkedNodeList.length ? '0px' : '7px' }\"\r\n (click)=\"onCloseClick()\"\r\n >\r\n {{ LANG.CANCEL }}\r\n </button>\r\n </div>\r\n</div>\r\n",
19756
+ template: "<div id=\"qmslib_related_popup\" class=\"qmslib__related__popup__container\">\r\n <div id=\"qmslib_related_popup_header\">\r\n <span mat-icon-button class=\"button__close\" (click)=\"onCloseClick()\">\r\n <mat-icon mat-icon>close</mat-icon>\r\n </span>\r\n <div id=\"qmslib_related_popup_header_001\" mat-dialog-content>\r\n <span>{{ moduleName }}</span>\r\n </div>\r\n </div>\r\n\r\n <div\r\n id=\"qmslib_related_popup_search\"\r\n class=\"input__field\"\r\n (click)=\"showSearchResult()\"\r\n >\r\n <input\r\n #name\r\n type=\"text\"\r\n placeholder=\"{{ LANG.SEARCH }}\"\r\n matInput\r\n [formControl]=\"myControl\"\r\n [matAutocomplete]=\"auto\"\r\n #autoCompleteInputSearch\r\n />\r\n <mat-icon>search</mat-icon>\r\n </div>\r\n\r\n <div class=\"line__divider\"></div>\r\n\r\n <mat-autocomplete\r\n #auto=\"matAutocomplete\"\r\n [displayWith]=\"displayRelated\"\r\n class=\"mat-autocomplete_related-viewport\"\r\n >\r\n <cdk-virtual-scroll-viewport\r\n qms-scrollbar\r\n itemSize=\"10\"\r\n class=\"related-viewport\"\r\n *ngIf=\"filteredOptions.length\"\r\n >\r\n <div class=\"search__module-result\" *ngIf=\"filteredOptions.length\">\r\n <mat-option\r\n class=\"search__option\"\r\n *ngFor=\"let option of getModuleFilteredOptions()\"\r\n [value]=\"option\"\r\n (click)=\"selectItemSearched(option)\"\r\n >\r\n <qms-list-item type=\"image-square\">\r\n <mat-icon\r\n leading-icon\r\n type=\"image-square\"\r\n [svgIcon]=\"getNodeIcon(option)\"\r\n ></mat-icon>\r\n <div qms-list-header>\r\n <div\r\n qms-line\r\n type=\"caption\"\r\n qms-tool-tip=\"{{\r\n isEllipsisActive(searchItemResult) ? option.parentName : ''\r\n }}\"\r\n mode=\"dark\"\r\n *ngIf=\"getParentName(option)\"\r\n >\r\n <span #searchItemResult class=\"search__result__parent-name\">\r\n {{ option.parentName }}\r\n </span>\r\n </div>\r\n <div qms-line type=\"subtitle\" class=\"search__option-name\">\r\n {{ option.itemName }}\r\n </div>\r\n <div\r\n class=\"caption\"\r\n *ngIf=\"option.breadcumbs && option.breadcumbs.length\"\r\n >\r\n <qms-breadcrumb\r\n class=\"breadcrumb-containe\"\r\n type=\"table\"\r\n numDisplayItem=\"1\"\r\n [nodes]=\"option.breadcumbs\"\r\n >\r\n </qms-breadcrumb>\r\n </div>\r\n </div>\r\n <div qms-line color=\"default-subtitle\" *ngIf=\"getItemId(option)\">\r\n <span class=\"material-icons-outlined search__description-icon\">\r\n local_offer\r\n </span>\r\n {{ getItemId(option) }}\r\n </div>\r\n </qms-list-item>\r\n </mat-option>\r\n </div>\r\n </cdk-virtual-scroll-viewport>\r\n </mat-autocomplete>\r\n\r\n <div class=\"row\">\r\n <div\r\n class=\"qms-scrollbar col-12 qmslib_related_popup_content\"\r\n [ngClass]=\"{\r\n panel__content_item: checkedNodeList.length,\r\n panel__content: !checkedNodeList.length\r\n }\"\r\n >\r\n <mat-expansion-panel\r\n hideToggle\r\n id=\"qmslib_related_popup_common_001\"\r\n [expanded]=\"isCommonExpanded\"\r\n (opened)=\"isCommonExpanded = true\"\r\n (closed)=\"isCommonExpanded = false\"\r\n class=\"panel-tree\"\r\n >\r\n <div id=\"qmslib_related_popup_common_002\">\r\n <qms-tree\r\n [treeData]=\"treeData\"\r\n [treeConfig]=\"treeConfig\"\r\n [selectedData]=\"selectedData\"\r\n [selectedRiskData]=\"selectedRiskData\"\r\n [disabledList]=\"disabledList\"\r\n (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n [expandOnTitleClick]=\"false\"\r\n [expandToChildNode]=\"expandToChildNode\"\r\n ></qms-tree>\r\n </div>\r\n </mat-expansion-panel>\r\n </div>\r\n </div>\r\n\r\n <!-- <div *ngIf=\"checkedNodeList.length\" class=\"line__divider\"></div>\r\n\r\n <div *ngIf=\"checkedNodeList.length\" class=\"panel__item qms-scrollbar\">\r\n <div class=\"related__item__inline\" *ngFor=\"let item of checkedNodeList\">\r\n <button\r\n *ngIf=\"item.itemName\"\r\n mat-button\r\n class=\"related__item__content\"\r\n qms-tool-tip=\"{{\r\n isEllipsisActive(itemName) ? getItemChipName(item) : ''\r\n }}\"\r\n mode=\"dark\"\r\n >\r\n <span class=\"related__item__content_name\" #itemName>{{\r\n getItemChipName(item)\r\n }}</span>\r\n <mat-icon (click)=\"removeCheckedNodeList()\">cancel</mat-icon>\r\n </button>\r\n </div>\r\n </div> -->\r\n\r\n <div class=\"line__divider\"></div>\r\n\r\n <div class=\"confirm__button__groups\">\r\n <button\r\n *ngIf=\"!checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 7px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }}\r\n </button>\r\n <button\r\n *ngIf=\"checkedNodeList.length\"\r\n qms-btn\r\n style=\"margin-top: 0px\"\r\n (click)=\"onAddClick()\"\r\n >\r\n {{ LANG.ADD }} ({{ checkedNodeList.length }})\r\n </button>\r\n <button\r\n qms-btn-text\r\n [ngStyle]=\"{ 'margin-top': checkedNodeList.length ? '0px' : '7px' }\"\r\n (click)=\"onCloseClick()\"\r\n >\r\n {{ LANG.CANCEL }}\r\n </button>\r\n </div>\r\n</div>\r\n",
19757
19757
  encapsulation: i0.ViewEncapsulation.None,
19758
19758
  styles: [".qms-scrollbar::-webkit-scrollbar{width:12px}.qms-scrollbar::-webkit-scrollbar-track{background:rgba(0,0,0,.12);background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb{background:rgba(0,0,0,.38);border-radius:20px;width:4px;border:4px solid transparent;background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.5);background-clip:content-box;border:4px solid transparent}.qms-scrollbar.none-scroll-bg::-webkit-scrollbar-track{background:transparent;background-clip:content-box}.qms__popup .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qms__danger button{border:none;color:#fff;padding:0;text-align:center;text-decoration:none;display:inline-block;cursor:pointer;height:20px;width:20px;font-family:Open Sans;font-size:12px;font-weight:600;font-style:normal;line-height:16px}.qms__danger .red{background-color:#9e360f;margin-left:10px}.qms__danger .yellow{background-color:#e4cf53;margin-left:10px;color:#323232}.qms__danger .green{background-color:#00804c;margin-left:10px}.confirm__button__groups{margin-top:11px}.confirm__button__groups button{min-height:36px;width:auto;font-family:Open Sans;font-weight:500;font-size:14px;letter-spacing:1px;line-height:16px;padding-left:15px;padding-right:15px;margin-right:5px;float:right}.confirm__button__groups .confirm{background:#f8f9f9}.confirm__button__groups .confirm:hover{background:#001983;color:#fff}.confirm__button__groups .confirm:disabled{cursor:not-allowed}.confirm__button__groups .cancel{background:#f8f9f9}.confirm__button__groups .cancel:hover{background:#001983;color:#fff}.qmslib__related__popup__container .input__field{display:flex;align-items:center}.qmslib__related__popup__container .input__field input{width:100%;padding:10px;outline:none;border:none;background:#eee}.qmslib__related__popup__container .input__field .mat-icon{margin-left:-30px;cursor:pointer;vertical-align:middle}.qmslib__related__popup__container .line__divider{border-bottom:1px solid #ccc;height:1px;margin-top:10px;min-width:300px;max-width:100%}.qmslib__related__popup__container .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qmslib__related__popup__container .panel__content{height:450px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel__content_item{height:350px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel-tree .mat-expansion-panel-body{padding:0 12px 12px}.qmslib__related__popup__container .mat-expansion-panel-header{height:30px;font-size:12px;letter-spacing:1px;font-family:Raleway;font-weight:600;padding:0}.qmslib__related__popup__container .mat-expansion-panel-header .mat-expansion-panel-header-title{align-items:center;margin-left:12px}.qmslib__related__popup__container .mat-expansion-panel-header .related_popup_toggle-btn{width:1.5rem;height:1.5rem;line-height:1.5rem}.qmslib__related__popup__container .mat-expansion-panel:not([class*=mat-elevation-z]){box-shadow:none}.qmslib__related__popup__container .panel__item{height:100px;margin-top:12px;overflow-x:hidden;overflow-y:auto;padding-right:5px;width:100%;max-width:100%;display:flex;flex-wrap:wrap;align-content:flex-start}.qmslib__related__popup__container .panel__item .related__item__inline{max-width:100%}.qmslib__related__popup__container .panel__item .related__item__content{height:32px;line-height:32px;background-color:#e5e5e5;max-width:100%;margin-bottom:5px;margin-left:2.5px;margin-right:2.5px}.qmslib__related__popup__container .panel__item .related__item__content .mat-icon{color:#8e8e8e;font-size:24px}.qmslib__related__popup__container .panel__item .related__item__content span.related__item__content_name{display:inline-block;min-width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px}cdk-virtual-scroll-viewport{overflow-x:hidden}cdk-virtual-scroll-viewport .search__module-result{margin:1.5rem;padding:0 0 .5rem}cdk-virtual-scroll-viewport .search__module-result .search__module-title{font-size:14px;font-weight:600}cdk-virtual-scroll-viewport .search__module-result .search__option{height:auto;line-height:normal;padding:8px 0;border-bottom:1px solid #e0e0e0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item.mat-2-line.image-item{height:auto}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content{margin:0;border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square{width:2.5rem;height:100%;background:transparent;align-self:center;margin-right:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square img{width:24px;height:24px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .material-icons-outlined.leading-icon,cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content mat-icon.leading-icon{padding:4px 0 4px 4px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .subtitle{font-weight:400}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption{overflow:hidden;line-height:normal;white-space:normal;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:0;margin:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption span.search__result__parent-name{display:inline-block;width:auto;width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .default-subtitle{color:rgba(0,0,0,.38)}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .search__description-icon{margin-right:0;width:12px;height:12px;font-size:12px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .qms-list-text{border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .breadcrumb-containe .qms-breadcrumb-item .mat-icon{font-size:16px!important;padding-bottom:1px}cdk-virtual-scroll-viewport .search__module-result svg{display:block}#qmslib_related_popup_header_001{margin-bottom:20px;padding:0;font-weight:600;font-family:Raleway}.padding-5{padding:5px}.mat-autocomplete_related-viewport{height:100%;max-height:100%!important}.mat-autocomplete_related-viewport .cdk-virtual-scroll-content-wrapper{width:100%}.mat-autocomplete_related-viewport .related-viewport{min-height:10.25rem}"]
19759
19759
  },] }
@@ -21960,8 +21960,8 @@
21960
21960
  QMSNavigationDrawerComponent.decorators = [
21961
21961
  { type: i0.Component, args: [{
21962
21962
  selector: 'app-qms-navigation-drawer',
21963
- template: "\r\n<mat-tree class=\"qms-navigation-drawer-container\" [dataSource]=\"dataSource\" [treeControl]=\"treeControl\" cdkDropList\r\n (cdkDropListDropped)=\"drop($event)\" [cdkDropListDisabled]=\"dragDropListDisabled\">\r\n <!-- This is the tree node template for leaf nodes -->\r\n <mat-tree-node *matTreeNodeDef=\"let node\" (mouseover)=\"onOver(node)\" matTreeNodePadding matTreeNodePaddingIndent=\"34\"\r\n cdkDrag [cdkDragData]=\"node\" (mouseenter)=\"dragHover(node)\" (mouseleave)=\"dragHoverEnd()\"\r\n (cdkDragStarted)=\"dragStart()\" (cdkDragReleased)=\"dragEnd()\"\r\n [ngClass]=\"{'expand-node' : treeControl.isExpanded(node), 'collapse-node': !treeControl.isExpanded(node), 'active': activeNode == node.id}\">\r\n <div *cdkDragPreview class=\"node-preview-item\">{{ node.name }}</div>\r\n <div *ngIf=\"!node.isReadOnly\" (click)=\"onClickNode(node, true)\" class=\"tree-content\">\r\n <button tabindex=\"-1\" qms-btn-outlined disabled class=\"border-0 bg-transparent\">\r\n <img class=\"img-icon\" [src]=\"faIconPath\" alt=\"\" />\r\n </button>\r\n <div class=\"span-text\">{{ node.name }}</div>\r\n <button tabindex=\"-1\" class=\"button-icon add-icon\"\r\n *ngIf=\"showFavoriteIcon && (node.id === hoverNode.id || node.favorite)\"\r\n (click)=\"addFavoriteNode(node.id, $event)\" (mouseenter)=\"setHoverFavorite(node.id)\"\r\n (mouseleave)=\"setHoverFavorite(null)\" [ngClass]=\"{'btn-favorite': (node.id === hoverNode.id && isHover)}\"\r\n qms-tool-tip=\"{{!node.favorite ? addFavoriteTooltip : deleteFavoriteTooltip}}\" mode=\"dark\" position=\"bottom\"\r\n qms-btn-icon>\r\n <mat-icon class=\"mat-icon-rtl-mirror blur-icon\" [class.favorite]=\"true\"\r\n [class.not-favorite]=\"!node.favorite && node.id === hoverNode.id && isHover\">\r\n {{node.favorite && node.id === hoverNode.id && isHover ? 'star_rate_outline' : ''}}\r\n {{!node.favorite && node.id === hoverNode.id && isHover ? 'star_border' : ''}}\r\n </mat-icon>\r\n </button>\r\n <button tabindex=\"-1\" class=\"button-icon add-icon\" *ngIf=\"node.id === hoverNode.id && isHover\"\r\n qms-tool-tip=\"{{addNodeTooltip}}\" (click)=\"addNewNode(node.id, $event)\" mode=\"dark\" position=\"bottom\" qms-btn-icon>\r\n <mat-icon class=\"mat-icon-rtl-mirror\">\r\n add\r\n </mat-icon>\r\n </button>\r\n </div>\r\n </mat-tree-node>\r\n <!-- This is the tree node template for expandable nodes -->\r\n <mat-tree-node *matTreeNodeDef=\"let node;when: hasChild\" (mouseover)=\"onOver(node)\" matTreeNodePadding\r\n matTreeNodePaddingIndent=\"34\" cdkDrag [cdkDragData]=\"node\" (mouseenter)=\"dragHover(node)\"\r\n (mouseleave)=\"dragHoverEnd()\" (cdkDragStarted)=\"dragStart()\" (cdkDragReleased)=\"dragEnd()\"\r\n [ngClass]=\"\r\n {'expand-node' : treeControl.isExpanded(node), 'collapse-node': !treeControl.isExpanded(node), 'active': activeNode == node.id}\">\r\n <div *cdkDragPreview class=\"node-preview-item\">{{ node.name }}</div>\r\n <div *ngIf=\"!node.isReadOnly\" class=\"tree-content\"\r\n (keydown)=\"onKeyDownNode($event, node)\">\r\n <button matTreeNodeToggle (click)=\"onClickNode(node, false)\" tabindex=\"-1\" class=\"button-icon collapse-expand-icon\" qms-btn-icon [attr.aria-label]=\"'toggle ' + node.name\">\r\n <mat-icon class=\"mat-icon-rtl-mirror arrow-icon left-icon\">\r\n {{treeControl.isExpanded(node) ? 'expand_less' : 'expand_more'}}\r\n </mat-icon>\r\n </button>\r\n <div class=\"span-text\" matTreeNodeToggle (click)=\"onClickNode(node, true)\">{{ node.name }}</div>\r\n <button tabindex=\"-1\" class=\"button-icon add-icon\"\r\n qms-tool-tip=\"{{!node.favorite ? addFavoriteTooltip : deleteFavoriteTooltip}}\"\r\n *ngIf=\"showFavoriteIcon && (node.id === hoverNode.id || node.favorite)\"\r\n (click)=\"addFavoriteNode(node.id, $event)\" [ngClass]=\"{'btn-favorite': (node.id === hoverNode.id && isHover)}\"\r\n (mouseenter)=\"setHoverFavorite(node.id)\" (mouseleave)=\"setHoverFavorite(null)\" mode=\"dark\" position=\"below\"\r\n qms-btn-icon>\r\n <mat-icon class=\"mat-icon-rtl-mirror blur-icon\" [class.favorite]=\"true\"\r\n [class.not-favorite]=\"!node.favorite && node.id === hoverNode.id && isHover\">\r\n {{node.favorite && node.id === hoverNode.id && isHover ? 'star_rate_outline' : ''}}\r\n {{!node.favorite && node.id === hoverNode.id && isHover ? 'star_border' : ''}}\r\n </mat-icon>\r\n </button>\r\n <button tabindex=\"-1\" class=\"button-icon add-icon\" *ngIf=\"node.id === hoverNode.id && isHover\"\r\n qms-tool-tip=\"{{addNodeTooltip}}\" mode=\"dark\" position=\"bottom\" (click)=\"addNewNode(node.id, $event)\" qms-btn-icon>\r\n <mat-icon class=\"mat-icon-rtl-mirror\">\r\n add\r\n </mat-icon>\r\n </button>\r\n </div>\r\n </mat-tree-node>\r\n</mat-tree>\r\n",
21964
- styles: ["::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node{min-width:272px!important;height:48px!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node{min-height:34px;margin:16px 0;padding-right:34px}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.active{background-color:#f2f7fd;color:#1954a9!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.active img{filter:opacity(.5) drop-shadow(0 0 0 #1954A9)}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.active:hover{background-color:#e5eefb!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content{width:100%;position:relative;cursor:pointer;align-items:center}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .arrow-icon{color:#00324e}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .collapse-expand-icon{color:#3e57b7}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .collapse-expand-icon:hover{background:rgba(0,0,0,.08)}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .add-icon:hover{background:rgba(0,0,0,.08)}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .left-icon{color:#919191}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.expand-node{padding-left:0;position:static;height:32px;left:calc(50% - 216px/2);top:0;font-family:Open Sans;font-style:normal;font-weight:400;font-size:14px;line-height:19px;display:flex;align-items:center;color:#1954a9;flex:none;order:0;align-self:stretch;flex-grow:1}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.expand-node ::ng-deep mat-icon{color:#1954a9}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.expand-node:hover{background-color:#e5eefb!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.collapse-node{position:static;height:32px;left:calc(50% - 176px/2);top:0;font-family:Open Sans;font-style:normal;font-weight:400;font-size:14px;line-height:19px;display:flex;align-items:center;color:#323232;flex:none;order:0;align-self:stretch;flex-grow:1}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content{display:flex}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .button-icon{width:40px;height:40px;line-height:30px!important;border-radius:50%}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .button-icon:hover{border-radius:50%}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .img-icon{max-height:25px;max-width:25px}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .add-icon{position:absolute;right:-34px}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .add-icon mat-icon{top:3px;right:3px;border-radius:50%;color:rgba(0,0,0,.6)}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .favorite{color:#b13514!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .not-favorite{color:rgba(0,0,0,.6)!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .btn-favorite{right:6px;color:unset}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .space-icon{position:absolute;top:-5px;left:0}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .span-text{position:relative;overflow:hidden;text-overflow:ellipsis;padding-left:7px;max-width:calc(100% - 56px);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .span-text:after{content:\"\";display:block;clear:both}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node:first-child{margin:0}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.collapse-node:hover{background:#00000014}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.collapse-node:active{background:#0000001f}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.expand-node:active{background:#f2f7fd}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node:hover .span-text{max-width:calc(100% - 96px)}.node-preview-item{display:flex;background-color:#0000001f;min-width:272px!important;height:48px!important;margin:0 auto;align-items:center;padding:0 16px}"]
21963
+ template: "\r\n<mat-tree class=\"qms-navigation-drawer-container\" [dataSource]=\"dataSource\" [treeControl]=\"treeControl\" cdkDropList\r\n (cdkDropListDropped)=\"drop($event)\" [cdkDropListDisabled]=\"dragDropListDisabled\">\r\n <!-- This is the tree node template for leaf nodes -->\r\n <mat-tree-node [class.pr-34]=\"showAddIcon\" *matTreeNodeDef=\"let node\" (mouseover)=\"onOver(node)\" matTreeNodePadding matTreeNodePaddingIndent=\"34\"\r\n cdkDrag [cdkDragData]=\"node\" (mouseenter)=\"dragHover(node)\" (mouseleave)=\"dragHoverEnd()\"\r\n (cdkDragStarted)=\"dragStart()\" (cdkDragReleased)=\"dragEnd()\"\r\n [ngClass]=\"{'expand-node' : treeControl.isExpanded(node), 'collapse-node': !treeControl.isExpanded(node), 'active': activeNode == node.id}\">\r\n <div *cdkDragPreview class=\"node-preview-item\">{{ node.name }}</div>\r\n <div *ngIf=\"!node.isReadOnly\" (click)=\"onClickNode(node, true)\" class=\"tree-content\">\r\n <button tabindex=\"-1\" qms-btn-outlined disabled class=\"border-0 bg-transparent\">\r\n <img class=\"img-icon\" [src]=\"faIconPath\" alt=\"\" />\r\n </button>\r\n <div class=\"span-text\">{{ node.name }}</div>\r\n <button tabindex=\"-1\" class=\"button-icon add-icon\"\r\n *ngIf=\"showFavoriteIcon && (node.id === hoverNode.id || node.favorite)\"\r\n (click)=\"addFavoriteNode(node.id, $event)\" (mouseenter)=\"setHoverFavorite(node.id)\"\r\n (mouseleave)=\"setHoverFavorite(null)\" [ngClass]=\"{'btn-favorite': (node.id === hoverNode.id && isHover)}\"\r\n qms-tool-tip=\"{{!node.favorite ? addFavoriteTooltip : deleteFavoriteTooltip}}\" mode=\"dark\" position=\"bottom\"\r\n qms-btn-icon>\r\n <mat-icon class=\"mat-icon-rtl-mirror blur-icon\" [class.favorite]=\"true\"\r\n [class.not-favorite]=\"!node.favorite && node.id === hoverNode.id && isHover\">\r\n {{node.favorite && node.id === hoverNode.id && isHover ? 'star_rate_outline' : ''}}\r\n {{!node.favorite && node.id === hoverNode.id && isHover ? 'star_border' : ''}}\r\n </mat-icon>\r\n </button>\r\n <button tabindex=\"-1\" class=\"button-icon add-icon\" *ngIf=\"node.id === hoverNode.id && showAddIcon && isHover\"\r\n qms-tool-tip=\"{{addNodeTooltip}}\" (click)=\"addNewNode(node.id, $event)\" mode=\"dark\" position=\"bottom\" qms-btn-icon>\r\n <mat-icon class=\"mat-icon-rtl-mirror\">\r\n add\r\n </mat-icon>\r\n </button>\r\n </div>\r\n </mat-tree-node>\r\n <!-- This is the tree node template for expandable nodes -->\r\n <mat-tree-node [class.pr-34]=\"showAddIcon\" *matTreeNodeDef=\"let node;when: hasChild\" (mouseover)=\"onOver(node)\" matTreeNodePadding\r\n matTreeNodePaddingIndent=\"34\" cdkDrag [cdkDragData]=\"node\" (mouseenter)=\"dragHover(node)\"\r\n (mouseleave)=\"dragHoverEnd()\" (cdkDragStarted)=\"dragStart()\" (cdkDragReleased)=\"dragEnd()\"\r\n [ngClass]=\"\r\n {'expand-node' : treeControl.isExpanded(node), 'collapse-node': !treeControl.isExpanded(node), 'active': activeNode == node.id}\">\r\n <div *cdkDragPreview class=\"node-preview-item\">{{ node.name }}</div>\r\n <div *ngIf=\"!node.isReadOnly\" class=\"tree-content\"\r\n (keydown)=\"onKeyDownNode($event, node)\">\r\n <button matTreeNodeToggle (click)=\"onClickNode(node, false)\" tabindex=\"-1\" class=\"button-icon collapse-expand-icon\" qms-btn-icon [attr.aria-label]=\"'toggle ' + node.name\">\r\n <mat-icon class=\"mat-icon-rtl-mirror arrow-icon left-icon\">\r\n {{treeControl.isExpanded(node) ? 'expand_less' : 'expand_more'}}\r\n </mat-icon>\r\n </button>\r\n <div class=\"span-text\" matTreeNodeToggle (click)=\"onClickNode(node, true)\">{{ node.name }}</div>\r\n <button tabindex=\"-1\" class=\"button-icon add-icon\"\r\n qms-tool-tip=\"{{!node.favorite ? addFavoriteTooltip : deleteFavoriteTooltip}}\"\r\n *ngIf=\"showFavoriteIcon && (node.id === hoverNode.id || node.favorite)\"\r\n (click)=\"addFavoriteNode(node.id, $event)\" [ngClass]=\"{'btn-favorite': (node.id === hoverNode.id && isHover)}\"\r\n (mouseenter)=\"setHoverFavorite(node.id)\" (mouseleave)=\"setHoverFavorite(null)\" mode=\"dark\" position=\"below\"\r\n qms-btn-icon>\r\n <mat-icon class=\"mat-icon-rtl-mirror blur-icon\" [class.favorite]=\"true\"\r\n [class.not-favorite]=\"!node.favorite && node.id === hoverNode.id && isHover\">\r\n {{node.favorite && node.id === hoverNode.id && isHover ? 'star_rate_outline' : ''}}\r\n {{!node.favorite && node.id === hoverNode.id && isHover ? 'star_border' : ''}}\r\n </mat-icon>\r\n </button>\r\n <button tabindex=\"-1\" class=\"button-icon add-icon\" *ngIf=\"node.id === hoverNode.id && showAddIcon && isHover\"\r\n qms-tool-tip=\"{{addNodeTooltip}}\" mode=\"dark\" position=\"bottom\" (click)=\"addNewNode(node.id, $event)\" qms-btn-icon>\r\n <mat-icon class=\"mat-icon-rtl-mirror\">\r\n add\r\n </mat-icon>\r\n </button>\r\n </div>\r\n </mat-tree-node>\r\n</mat-tree>\r\n",
21964
+ styles: ["::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node{min-width:272px!important;height:48px!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node{min-height:34px;margin:16px 0}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.active{background-color:#f2f7fd;color:#1954a9!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.active img{filter:opacity(.5) drop-shadow(0 0 0 #1954A9)}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.active:hover{background-color:#e5eefb!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content{width:100%;position:relative;cursor:pointer;align-items:center}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .arrow-icon{color:#00324e}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .collapse-expand-icon{color:#3e57b7}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .collapse-expand-icon:hover{background:rgba(0,0,0,.08)}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .add-icon:hover{background:rgba(0,0,0,.08)}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .left-icon{color:#919191}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.expand-node{padding-left:0;position:static;height:32px;left:calc(50% - 216px/2);top:0;font-family:Open Sans;font-style:normal;font-weight:400;font-size:14px;line-height:19px;display:flex;align-items:center;color:#1954a9;flex:none;order:0;align-self:stretch;flex-grow:1}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.expand-node ::ng-deep mat-icon{color:#1954a9}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.expand-node:hover{background-color:#e5eefb!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.collapse-node{position:static;height:32px;left:calc(50% - 176px/2);top:0;font-family:Open Sans;font-style:normal;font-weight:400;font-size:14px;line-height:19px;display:flex;align-items:center;color:#323232;flex:none;order:0;align-self:stretch;flex-grow:1}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content{display:flex}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .button-icon{width:40px;height:40px;line-height:30px!important;border-radius:50%}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .button-icon:hover{border-radius:50%}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .img-icon{max-height:25px;max-width:25px}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .add-icon{position:absolute;right:-34px}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .add-icon mat-icon{top:3px;right:3px;border-radius:50%;color:rgba(0,0,0,.6)}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .favorite{color:#b13514!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .not-favorite{color:rgba(0,0,0,.6)!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .btn-favorite{right:6px;color:unset}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .space-icon{position:absolute;top:-5px;left:0}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .span-text{position:relative;overflow:hidden;text-overflow:ellipsis;padding-left:7px;max-width:calc(100% - 56px);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .span-text:after{content:\"\";display:block;clear:both}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node:first-child{margin:0}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.collapse-node:hover{background:#00000014}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.collapse-node:active{background:#0000001f}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.expand-node:active{background:#f2f7fd}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node:hover .span-text{max-width:calc(100% - 96px)}::ng-deep mat-tree.qms-navigation-drawer-container .pr-34{padding-right:34px}.node-preview-item{display:flex;background-color:#0000001f;min-width:272px!important;height:48px!important;margin:0 auto;align-items:center;padding:0 16px}"]
21965
21965
  },] }
21966
21966
  ];
21967
21967
  QMSNavigationDrawerComponent.ctorParameters = function () { return []; };