@sunbird-cb/tree-hierarchy 0.0.7-cbrelease-4.8.26 → 0.0.9-cbrelease-4.8.26
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.
- package/esm2022/lib/components/org-hierarchy-add-modal/org-hierarchy-add-modal.component.mjs +22 -3
- package/esm2022/lib/components/term-card/term-card.component.mjs +2 -2
- package/esm2022/lib/components/tree-column-view/tree-column-view.component.mjs +3 -3
- package/esm2022/lib/components/tree-view/tree-view.component.mjs +6 -5
- package/esm2022/lib/services/connector.service.mjs +27 -4
- package/esm2022/lib/services/framework.service.mjs +2 -2
- package/fesm2022/sunbird-cb-tree-hierarchy.mjs +57 -14
- package/fesm2022/sunbird-cb-tree-hierarchy.mjs.map +1 -1
- package/lib/components/org-hierarchy-add-modal/org-hierarchy-add-modal.component.d.ts +2 -0
- package/lib/components/org-hierarchy-add-modal/org-hierarchy-add-modal.component.d.ts.map +1 -1
- package/lib/components/tree-view/tree-view.component.d.ts.map +1 -1
- package/lib/services/connector.service.d.ts +1 -0
- package/lib/services/connector.service.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -7193,7 +7193,7 @@ class FrameworkService {
|
|
|
7193
7193
|
if (this.localConfig.connectionType === 'online') {
|
|
7194
7194
|
let url = `/${this.proxiesPath}/framework/v1/read/`;
|
|
7195
7195
|
if (_orgData) {
|
|
7196
|
-
url = url + _orgData.
|
|
7196
|
+
url = url + _orgData.orgHierarchyFrameworkId;
|
|
7197
7197
|
}
|
|
7198
7198
|
else {
|
|
7199
7199
|
url = url + this.environment.frameworkName;
|
|
@@ -9867,12 +9867,31 @@ class OrgHierarchyAddModalComponent {
|
|
|
9867
9867
|
this.filteredOptions = [...this.orgOptions];
|
|
9868
9868
|
}
|
|
9869
9869
|
}
|
|
9870
|
+
handleKeydown(event) {
|
|
9871
|
+
if (event.key === 'Enter') {
|
|
9872
|
+
event.preventDefault();
|
|
9873
|
+
event.stopPropagation();
|
|
9874
|
+
return false;
|
|
9875
|
+
}
|
|
9876
|
+
return true;
|
|
9877
|
+
}
|
|
9878
|
+
handleSearchKeydown(event) {
|
|
9879
|
+
if (event.key === 'Enter') {
|
|
9880
|
+
event.preventDefault();
|
|
9881
|
+
event.stopPropagation();
|
|
9882
|
+
return false;
|
|
9883
|
+
}
|
|
9884
|
+
if (event.key === ' ' && event.target instanceof HTMLInputElement) {
|
|
9885
|
+
event.stopPropagation();
|
|
9886
|
+
}
|
|
9887
|
+
return true;
|
|
9888
|
+
}
|
|
9870
9889
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OrgHierarchyAddModalComponent, deps: [{ token: i1$3.MatLegacyDialogRef }, { token: MAT_LEGACY_DIALOG_DATA }, { token: TreeHierarchyService }, { token: FrameworkService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9871
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OrgHierarchyAddModalComponent, selector: "sb-cb-tree-org-hierarchy-add-modal", ngImport: i0, template: "<div class=\"org-hierarchy-modal\">\n <!-- Modal Header -->\n <div class=\"modal-header\">\n <div class=\"header-title\">\n <h2 class=\"m-0\">Update Organisation Hierarchy</h2>\n </div>\n <button mat-icon-button class=\"close-button\" (click)=\"onClose()\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n\n <!-- Modal Content -->\n <div class=\"modal-content\">\n <div class=\"content-container\">\n <div class=\"flex flex-col org-container\">\n <label class=\"orgTypeName\">{{data?.selectedOrgData?.sbOrgType}}</label>\n <label class=\"orgTypeSelected\">{{data?.selectedOrgData?.orgName?.toLowerCase()}}</label>\n <div class=\"dashed-line\"></div>\n </div>\n <ng-container *ngIf=\"data?.previous?.length > 0\">\n <div class=\"flex flex-col org-container\" *ngFor=\"let item of data?.previous;let i = index\"\n [ngStyle]=\"{'margin-left': 30 * (i+1) + 'px'}\">\n <label class=\"orgTypeName\">{{item?.category?.toLowerCase()}}</label>\n <label class=\"orgTypeSelected\">{{item?.name?.toLowerCase()}}</label>\n <div class=\"dashed-line\"></div>\n </div>\n </ng-container>\n <ng-container *ngIf=\"data?.currentData\">\n <div class=\"flex flex-col org-container\" \n [ngStyle]=\"{'margin-left': 30 * (data?.previous?.length + 1) + 'px'}\">\n <label class=\"orgTypeName\">{{data?.currentData?.code?.toLowerCase()}}</label>\n \n <!-- Searchable multi-select -->\n <div class=\"select-search-container\">\n <mat-form-field appearance=\"outline\" class=\"w-full custom-height-select\">\n <mat-select [formControl]=\"selectedOrgsControl\" placeholder=\"Select\" #singleSelect\n [panelClass]=\"'mat-select-panel-below'\" disableOptionCentering [disableOptionCentering]=\"true\"\n multiple> <!-- Added the multiple attribute here -->\n <!-- Search container -->\n <div class=\"search-container\">\n <input type=\"text\" [formControl]=\"searchControl\" placeholder=\"Search...\"\n (keydown)=\"$event.key === ' ' ? $event.stopPropagation() : null\" (click)=\"$event.stopPropagation()\"\n class=\"search-input\" #searchInput>\n </div>\n <mat-option *ngFor=\"let organization of filteredOptions\" [value]=\"organization.identifier\">\n {{organization.orgName}}\n </mat-option>\n <mat-option *ngIf=\"filteredOptions.length === 0\" disabled>\n No data found\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n \n </div>\n </ng-container>\n </div>\n </div>\n\n <!-- Modal Footer -->\n <div class=\"modal-footer\">\n <button mat-stroked-button class=\"btn-common btn-secondary\" (click)=\"onClose()\" type=\"button\">\n Cancel\n </button>\n <button \n mat-stroked-button \n class=\"btn-common btn-primary\" \n [disabled]=\"!selectedOrgsControl.value?.length\" \n (click)=\"onSave()\" \n type=\"button\">\n Save\n </button>\n </div>\n</div>", styles: [":host{display:block;height:100%}.custom-height-select{width:100%;margin-top:5px}.custom-height-select ::ng-deep .mat-mdc-select{height:35px;line-height:35px}.custom-height-select ::ng-deep .mat-form-field-flex{height:35px!important;min-height:35px!important}.custom-height-select ::ng-deep .mat-form-field-infix{min-height:35px!important;height:35px!important;display:flex;align-items:center;border:0;position:relative;padding:4px 8px 0}.custom-height-select ::ng-deep .mat-form-field-wrapper{height:35px;padding:0;margin:0}.custom-height-select ::ng-deep .mdc-notched-outline{border-radius:20px!important}.custom-height-select ::ng-deep .mdc-notched-outline__leading{display:none}.custom-height-select ::ng-deep .mdc-notched-outline__notch{border-color:#00000029!important}.custom-height-select ::ng-deep .mdc-notched-outline__trailing{border-color:#00000029!important;border-radius:20px!important;border-left:1px solid rgba(0,0,0,.1607843137)!important;border-right:1px solid rgba(0,0,0,.1607843137)!important}.custom-height-select ::ng-deep .mat-select-arrow-wrapper{padding-top:15px;transform:translateY(-4px)}.custom-height-select ::ng-deep .mat-select-value{line-height:35px}::ng-deep .right-side-modal.cdk-global-overlay-wrapper{justify-content:flex-end}::ng-deep .right-side-modal .mat-dialog-container{border-radius:0!important;padding:0!important;overflow-x:hidden;display:flex!important;flex-direction:column!important;height:100vh!important}::ng-deep .right-side-modal .cdk-overlay-pane{margin-right:0!important;max-width:90vw!important}::ng-deep .mat-pseudo-checkbox-checked{background-color:#1b4ca1!important;border-color:#1b4ca1!important}.org-hierarchy-modal{display:flex;flex-direction:column;height:100%}.org-hierarchy-modal .modal-header{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;border-bottom:1px solid rgba(0,0,0,.08);flex-shrink:0}.org-hierarchy-modal .modal-header .header-title h2{font-size:16px;font-weight:600;color:#000000de}.org-hierarchy-modal .modal-header .close-button{color:#666}.org-hierarchy-modal .modal-content{flex:1;overflow-y:auto;padding:12px 24px;min-height:0}.org-hierarchy-modal .modal-content .content-container{max-width:800px;margin:0 auto}.org-hierarchy-modal .modal-content .form-field{margin-bottom:16px}.org-hierarchy-modal .modal-content .form-field .w-full{width:100%}.org-hierarchy-modal .modal-footer{display:flex;justify-content:flex-end;padding:12px 24px;border-top:1px solid rgba(0,0,0,.08);gap:16px;flex-shrink:0}.org-hierarchy-modal .modal-footer .cancel-btn,.org-hierarchy-modal .modal-footer .save-btn{min-width:100px}.searchable-select-container{margin-top:16px;margin-bottom:24px}.selected-items-container{margin-top:8px;margin-bottom:16px}.selected-items-container .selected-chips{display:flex;flex-wrap:wrap;gap:8px}::ng-deep .searchable-select-panel .mat-select-panel{max-height:350px}::ng-deep .searchable-select-panel .search-box{position:relative;padding:8px}::ng-deep .searchable-select-panel .search-box input{width:100%;height:36px;border:1px solid #ddd;border-radius:4px;padding:8px 36px 8px 12px;outline:none;font-size:14px}::ng-deep .searchable-select-panel .search-box input:focus{border-color:#1b4ca1}::ng-deep .searchable-select-panel .search-box .clear-search{position:absolute;right:8px;top:8px;width:24px;height:24px;line-height:24px}::ng-deep .searchable-select-panel .search-box .clear-search .mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}::ng-deep .mat-chip{font-size:12px;min-height:26px}::ng-deep .mat-chip .mat-icon{font-size:16px;width:16px;height:16px}::ng-deep .mat-mdc-chip{font-size:12px;min-height:26px}::ng-deep .mat-mdc-chip .mat-icon{font-size:16px;width:16px!important;height:16px!important}::ng-deep .mat-mdc-chip-option[disabled]{opacity:1}::ng-deep .mat-mdc-chip-option[disabled] .mdc-evolution-chip__text-label{opacity:1}.m-0{margin:0}.w-full{width:100%}.orgTypeName{font-weight:700;font-size:14px;text-transform:capitalize}.orgTypeSelected{padding:5px 15px;border:1px solid rgba(0,0,0,.1607843137);background:#e8e9eb;border-radius:20px;margin-top:5px;font-size:14px;font-weight:400;text-transform:capitalize}.search-container{position:relative;width:100%;padding:8px;box-sizing:border-box}.search-container:before{content:\"\";position:absolute;left:16px;top:50%;transform:translateY(-50%);width:16px;height:16px;background-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\" fill=\"%23757575\"/></svg>');background-repeat:no-repeat;background-size:contain;z-index:1}.search-container .search-input{width:calc(100% - 8px);height:28px;border:1px solid rgba(0,0,0,.1607843137);border-radius:20px;padding:4px 12px 4px 36px;outline:none;font-size:14px;box-sizing:border-box}.search-container .search-input:focus{border-color:#1b4ca1}.dashed-line{height:25px;border-left:2px dashed #1B4CA1;margin-left:10px}.org-container{position:relative}.org-container:not(:first-child){margin-top:0}.org-container:not(:first-child):before{content:\"\";position:absolute;left:-20px;top:4px;height:8px;border-left:2px dashed #1B4CA1;z-index:0;border-bottom:2px dashed #1B4CA1;width:10px}.org-container:not(:first-child):after{content:\"\";position:absolute;left:-15px;top:8px;width:8px;height:8px;border-right:2px solid #1B4CA1;border-bottom:2px solid #1B4CA1;transform:rotate(-45deg);z-index:1;background-color:transparent}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i6$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i17$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
|
|
9890
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OrgHierarchyAddModalComponent, selector: "sb-cb-tree-org-hierarchy-add-modal", ngImport: i0, template: "<div class=\"org-hierarchy-modal\">\n <!-- Modal Header -->\n <div class=\"modal-header\">\n <div class=\"header-title\">\n <h2 class=\"m-0\">Update Organisation Hierarchy</h2>\n </div>\n <button mat-icon-button class=\"close-button\" (click)=\"onClose()\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n\n <!-- Modal Content -->\n <div class=\"modal-content\">\n <div class=\"content-container\">\n <div class=\"flex flex-col org-container\">\n <label class=\"orgTypeName\">{{data?.selectedOrgData?.sbOrgType}}</label>\n <label class=\"orgTypeSelected\">{{data?.selectedOrgData?.orgName?.toLowerCase()}}</label>\n <div class=\"dashed-line\"></div>\n </div>\n <ng-container *ngIf=\"data?.previous?.length > 0\">\n <div class=\"flex flex-col org-container\" *ngFor=\"let item of data?.previous;let i = index\"\n [ngStyle]=\"{'margin-left': 30 * (i+1) + 'px'}\">\n <label class=\"orgTypeName\">{{item?.category?.toLowerCase()}}</label>\n <label class=\"orgTypeSelected\">{{item?.name?.toLowerCase()}}</label>\n <div class=\"dashed-line\"></div>\n </div>\n </ng-container>\n <ng-container *ngIf=\"data?.currentData\">\n <div class=\"flex flex-col org-container\" \n [ngStyle]=\"{'margin-left': 30 * (data?.previous?.length + 1) + 'px'}\">\n <label class=\"orgTypeName\">{{data?.currentData?.code?.toLowerCase()}}</label>\n \n <!-- Searchable multi-select -->\n <div class=\"select-search-container\">\n <mat-form-field appearance=\"outline\" class=\"w-full custom-height-select\">\n <mat-select [formControl]=\"selectedOrgsControl\" placeholder=\"Select\" #singleSelect\n [panelClass]=\"'mat-select-panel-below'\" \n disableOptionCentering \n [disableOptionCentering]=\"true\"\n (keydown)=\"handleKeydown($event)\"\n multiple>\n <!-- Search container -->\n <div class=\"search-container\" (click)=\"$event.stopPropagation()\">\n <input type=\"text\" [formControl]=\"searchControl\" placeholder=\"Search...\"\n (keydown)=\"handleSearchKeydown($event)\"\n class=\"search-input\" #searchInput>\n </div>\n <mat-option *ngFor=\"let organization of filteredOptions\" [value]=\"organization.identifier\">\n {{organization.orgName}}\n </mat-option>\n <mat-option *ngIf=\"filteredOptions.length === 0\" disabled>\n No data found\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n \n </div>\n </ng-container>\n </div>\n </div>\n\n <!-- Modal Footer -->\n <div class=\"modal-footer\">\n <button mat-stroked-button class=\"btn-common btn-secondary\" (click)=\"onClose()\" type=\"button\">\n Cancel\n </button>\n <button \n mat-stroked-button \n class=\"btn-common btn-primary\" \n [disabled]=\"!selectedOrgsControl.value?.length\" \n (click)=\"onSave()\" \n type=\"button\">\n Save\n </button>\n </div>\n</div>", styles: [":host{display:block;height:100%}.custom-height-select{width:100%;margin-top:5px}.custom-height-select ::ng-deep .mat-mdc-select{height:35px;line-height:35px}.custom-height-select ::ng-deep .mat-form-field-flex{height:35px!important;min-height:35px!important}.custom-height-select ::ng-deep .mat-form-field-infix{min-height:35px!important;height:35px!important;display:flex;align-items:center;border:0;position:relative;padding:4px 8px 0}.custom-height-select ::ng-deep .mat-form-field-wrapper{height:35px;padding:0;margin:0}.custom-height-select ::ng-deep .mdc-notched-outline{border-radius:20px!important}.custom-height-select ::ng-deep .mdc-notched-outline__leading{display:none}.custom-height-select ::ng-deep .mdc-notched-outline__notch{border-color:#00000029!important}.custom-height-select ::ng-deep .mdc-notched-outline__trailing{border-color:#00000029!important;border-radius:20px!important;border-left:1px solid rgba(0,0,0,.1607843137)!important;border-right:1px solid rgba(0,0,0,.1607843137)!important}.custom-height-select ::ng-deep .mat-select-arrow-wrapper{padding-top:15px;transform:translateY(-4px)}.custom-height-select ::ng-deep .mat-select-value{line-height:35px}::ng-deep .right-side-modal.cdk-global-overlay-wrapper{justify-content:flex-end}::ng-deep .right-side-modal .mat-dialog-container{border-radius:0!important;padding:0!important;overflow-x:hidden;display:flex!important;flex-direction:column!important;height:100vh!important}::ng-deep .right-side-modal .cdk-overlay-pane{margin-right:0!important;max-width:90vw!important}::ng-deep .mat-pseudo-checkbox-checked{background-color:#1b4ca1!important;border-color:#1b4ca1!important}.org-hierarchy-modal{display:flex;flex-direction:column;height:100%}.org-hierarchy-modal .modal-header{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;border-bottom:1px solid rgba(0,0,0,.08);flex-shrink:0}.org-hierarchy-modal .modal-header .header-title h2{font-size:16px;font-weight:600;color:#000000de}.org-hierarchy-modal .modal-header .close-button{color:#666}.org-hierarchy-modal .modal-content{flex:1;overflow-y:auto;padding:12px 24px;min-height:0}.org-hierarchy-modal .modal-content .content-container{max-width:800px;margin:0 auto}.org-hierarchy-modal .modal-content .form-field{margin-bottom:16px}.org-hierarchy-modal .modal-content .form-field .w-full{width:100%}.org-hierarchy-modal .modal-footer{display:flex;justify-content:flex-end;padding:12px 24px;border-top:1px solid rgba(0,0,0,.08);gap:16px;flex-shrink:0}.org-hierarchy-modal .modal-footer .cancel-btn,.org-hierarchy-modal .modal-footer .save-btn{min-width:100px}.searchable-select-container{margin-top:16px;margin-bottom:24px}.selected-items-container{margin-top:8px;margin-bottom:16px}.selected-items-container .selected-chips{display:flex;flex-wrap:wrap;gap:8px}::ng-deep .searchable-select-panel .mat-select-panel{max-height:350px}::ng-deep .searchable-select-panel .search-box{position:relative;padding:8px}::ng-deep .searchable-select-panel .search-box input{width:100%;height:36px;border:1px solid #ddd;border-radius:4px;padding:8px 36px 8px 12px;outline:none;font-size:14px}::ng-deep .searchable-select-panel .search-box input:focus{border-color:#1b4ca1}::ng-deep .searchable-select-panel .search-box .clear-search{position:absolute;right:8px;top:8px;width:24px;height:24px;line-height:24px}::ng-deep .searchable-select-panel .search-box .clear-search .mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}::ng-deep .mat-chip{font-size:12px;min-height:26px}::ng-deep .mat-chip .mat-icon{font-size:16px;width:16px;height:16px}::ng-deep .mat-mdc-chip{font-size:12px;min-height:26px}::ng-deep .mat-mdc-chip .mat-icon{font-size:16px;width:16px!important;height:16px!important}::ng-deep .mat-mdc-chip-option[disabled]{opacity:1}::ng-deep .mat-mdc-chip-option[disabled] .mdc-evolution-chip__text-label{opacity:1}.m-0{margin:0}.w-full{width:100%}.orgTypeName{font-weight:700;font-size:14px;text-transform:capitalize}.orgTypeSelected{padding:5px 15px;border:1px solid rgba(0,0,0,.1607843137);background:#e8e9eb;border-radius:20px;margin-top:5px;font-size:14px;font-weight:400;text-transform:capitalize}.search-container{position:relative;width:100%;padding:8px;box-sizing:border-box}.search-container:before{content:\"\";position:absolute;left:16px;top:50%;transform:translateY(-50%);width:16px;height:16px;background-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\" fill=\"%23757575\"/></svg>');background-repeat:no-repeat;background-size:contain;z-index:1}.search-container .search-input{width:calc(100% - 8px);height:28px;border:1px solid rgba(0,0,0,.1607843137);border-radius:20px;padding:4px 12px 4px 36px;outline:none;font-size:14px;box-sizing:border-box}.search-container .search-input:focus{border-color:#1b4ca1}.dashed-line{height:25px;border-left:2px dashed #1B4CA1;margin-left:10px}.org-container{position:relative}.org-container:not(:first-child){margin-top:0}.org-container:not(:first-child):before{content:\"\";position:absolute;left:-20px;top:4px;height:8px;border-left:2px dashed #1B4CA1;z-index:0;border-bottom:2px dashed #1B4CA1;width:10px}.org-container:not(:first-child):after{content:\"\";position:absolute;left:-15px;top:8px;width:8px;height:8px;border-right:2px solid #1B4CA1;border-bottom:2px solid #1B4CA1;transform:rotate(-45deg);z-index:1;background-color:transparent}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i6$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i17$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
|
|
9872
9891
|
}
|
|
9873
9892
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OrgHierarchyAddModalComponent, decorators: [{
|
|
9874
9893
|
type: Component,
|
|
9875
|
-
args: [{ selector: 'sb-cb-tree-org-hierarchy-add-modal', template: "<div class=\"org-hierarchy-modal\">\n <!-- Modal Header -->\n <div class=\"modal-header\">\n <div class=\"header-title\">\n <h2 class=\"m-0\">Update Organisation Hierarchy</h2>\n </div>\n <button mat-icon-button class=\"close-button\" (click)=\"onClose()\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n\n <!-- Modal Content -->\n <div class=\"modal-content\">\n <div class=\"content-container\">\n <div class=\"flex flex-col org-container\">\n <label class=\"orgTypeName\">{{data?.selectedOrgData?.sbOrgType}}</label>\n <label class=\"orgTypeSelected\">{{data?.selectedOrgData?.orgName?.toLowerCase()}}</label>\n <div class=\"dashed-line\"></div>\n </div>\n <ng-container *ngIf=\"data?.previous?.length > 0\">\n <div class=\"flex flex-col org-container\" *ngFor=\"let item of data?.previous;let i = index\"\n [ngStyle]=\"{'margin-left': 30 * (i+1) + 'px'}\">\n <label class=\"orgTypeName\">{{item?.category?.toLowerCase()}}</label>\n <label class=\"orgTypeSelected\">{{item?.name?.toLowerCase()}}</label>\n <div class=\"dashed-line\"></div>\n </div>\n </ng-container>\n <ng-container *ngIf=\"data?.currentData\">\n <div class=\"flex flex-col org-container\" \n [ngStyle]=\"{'margin-left': 30 * (data?.previous?.length + 1) + 'px'}\">\n <label class=\"orgTypeName\">{{data?.currentData?.code?.toLowerCase()}}</label>\n \n <!-- Searchable multi-select -->\n <div class=\"select-search-container\">\n <mat-form-field appearance=\"outline\" class=\"w-full custom-height-select\">\n <mat-select [formControl]=\"selectedOrgsControl\" placeholder=\"Select\" #singleSelect\n
|
|
9894
|
+
args: [{ selector: 'sb-cb-tree-org-hierarchy-add-modal', template: "<div class=\"org-hierarchy-modal\">\n <!-- Modal Header -->\n <div class=\"modal-header\">\n <div class=\"header-title\">\n <h2 class=\"m-0\">Update Organisation Hierarchy</h2>\n </div>\n <button mat-icon-button class=\"close-button\" (click)=\"onClose()\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n\n <!-- Modal Content -->\n <div class=\"modal-content\">\n <div class=\"content-container\">\n <div class=\"flex flex-col org-container\">\n <label class=\"orgTypeName\">{{data?.selectedOrgData?.sbOrgType}}</label>\n <label class=\"orgTypeSelected\">{{data?.selectedOrgData?.orgName?.toLowerCase()}}</label>\n <div class=\"dashed-line\"></div>\n </div>\n <ng-container *ngIf=\"data?.previous?.length > 0\">\n <div class=\"flex flex-col org-container\" *ngFor=\"let item of data?.previous;let i = index\"\n [ngStyle]=\"{'margin-left': 30 * (i+1) + 'px'}\">\n <label class=\"orgTypeName\">{{item?.category?.toLowerCase()}}</label>\n <label class=\"orgTypeSelected\">{{item?.name?.toLowerCase()}}</label>\n <div class=\"dashed-line\"></div>\n </div>\n </ng-container>\n <ng-container *ngIf=\"data?.currentData\">\n <div class=\"flex flex-col org-container\" \n [ngStyle]=\"{'margin-left': 30 * (data?.previous?.length + 1) + 'px'}\">\n <label class=\"orgTypeName\">{{data?.currentData?.code?.toLowerCase()}}</label>\n \n <!-- Searchable multi-select -->\n <div class=\"select-search-container\">\n <mat-form-field appearance=\"outline\" class=\"w-full custom-height-select\">\n <mat-select [formControl]=\"selectedOrgsControl\" placeholder=\"Select\" #singleSelect\n [panelClass]=\"'mat-select-panel-below'\" \n disableOptionCentering \n [disableOptionCentering]=\"true\"\n (keydown)=\"handleKeydown($event)\"\n multiple>\n <!-- Search container -->\n <div class=\"search-container\" (click)=\"$event.stopPropagation()\">\n <input type=\"text\" [formControl]=\"searchControl\" placeholder=\"Search...\"\n (keydown)=\"handleSearchKeydown($event)\"\n class=\"search-input\" #searchInput>\n </div>\n <mat-option *ngFor=\"let organization of filteredOptions\" [value]=\"organization.identifier\">\n {{organization.orgName}}\n </mat-option>\n <mat-option *ngIf=\"filteredOptions.length === 0\" disabled>\n No data found\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n \n </div>\n </ng-container>\n </div>\n </div>\n\n <!-- Modal Footer -->\n <div class=\"modal-footer\">\n <button mat-stroked-button class=\"btn-common btn-secondary\" (click)=\"onClose()\" type=\"button\">\n Cancel\n </button>\n <button \n mat-stroked-button \n class=\"btn-common btn-primary\" \n [disabled]=\"!selectedOrgsControl.value?.length\" \n (click)=\"onSave()\" \n type=\"button\">\n Save\n </button>\n </div>\n</div>", styles: [":host{display:block;height:100%}.custom-height-select{width:100%;margin-top:5px}.custom-height-select ::ng-deep .mat-mdc-select{height:35px;line-height:35px}.custom-height-select ::ng-deep .mat-form-field-flex{height:35px!important;min-height:35px!important}.custom-height-select ::ng-deep .mat-form-field-infix{min-height:35px!important;height:35px!important;display:flex;align-items:center;border:0;position:relative;padding:4px 8px 0}.custom-height-select ::ng-deep .mat-form-field-wrapper{height:35px;padding:0;margin:0}.custom-height-select ::ng-deep .mdc-notched-outline{border-radius:20px!important}.custom-height-select ::ng-deep .mdc-notched-outline__leading{display:none}.custom-height-select ::ng-deep .mdc-notched-outline__notch{border-color:#00000029!important}.custom-height-select ::ng-deep .mdc-notched-outline__trailing{border-color:#00000029!important;border-radius:20px!important;border-left:1px solid rgba(0,0,0,.1607843137)!important;border-right:1px solid rgba(0,0,0,.1607843137)!important}.custom-height-select ::ng-deep .mat-select-arrow-wrapper{padding-top:15px;transform:translateY(-4px)}.custom-height-select ::ng-deep .mat-select-value{line-height:35px}::ng-deep .right-side-modal.cdk-global-overlay-wrapper{justify-content:flex-end}::ng-deep .right-side-modal .mat-dialog-container{border-radius:0!important;padding:0!important;overflow-x:hidden;display:flex!important;flex-direction:column!important;height:100vh!important}::ng-deep .right-side-modal .cdk-overlay-pane{margin-right:0!important;max-width:90vw!important}::ng-deep .mat-pseudo-checkbox-checked{background-color:#1b4ca1!important;border-color:#1b4ca1!important}.org-hierarchy-modal{display:flex;flex-direction:column;height:100%}.org-hierarchy-modal .modal-header{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;border-bottom:1px solid rgba(0,0,0,.08);flex-shrink:0}.org-hierarchy-modal .modal-header .header-title h2{font-size:16px;font-weight:600;color:#000000de}.org-hierarchy-modal .modal-header .close-button{color:#666}.org-hierarchy-modal .modal-content{flex:1;overflow-y:auto;padding:12px 24px;min-height:0}.org-hierarchy-modal .modal-content .content-container{max-width:800px;margin:0 auto}.org-hierarchy-modal .modal-content .form-field{margin-bottom:16px}.org-hierarchy-modal .modal-content .form-field .w-full{width:100%}.org-hierarchy-modal .modal-footer{display:flex;justify-content:flex-end;padding:12px 24px;border-top:1px solid rgba(0,0,0,.08);gap:16px;flex-shrink:0}.org-hierarchy-modal .modal-footer .cancel-btn,.org-hierarchy-modal .modal-footer .save-btn{min-width:100px}.searchable-select-container{margin-top:16px;margin-bottom:24px}.selected-items-container{margin-top:8px;margin-bottom:16px}.selected-items-container .selected-chips{display:flex;flex-wrap:wrap;gap:8px}::ng-deep .searchable-select-panel .mat-select-panel{max-height:350px}::ng-deep .searchable-select-panel .search-box{position:relative;padding:8px}::ng-deep .searchable-select-panel .search-box input{width:100%;height:36px;border:1px solid #ddd;border-radius:4px;padding:8px 36px 8px 12px;outline:none;font-size:14px}::ng-deep .searchable-select-panel .search-box input:focus{border-color:#1b4ca1}::ng-deep .searchable-select-panel .search-box .clear-search{position:absolute;right:8px;top:8px;width:24px;height:24px;line-height:24px}::ng-deep .searchable-select-panel .search-box .clear-search .mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}::ng-deep .mat-chip{font-size:12px;min-height:26px}::ng-deep .mat-chip .mat-icon{font-size:16px;width:16px;height:16px}::ng-deep .mat-mdc-chip{font-size:12px;min-height:26px}::ng-deep .mat-mdc-chip .mat-icon{font-size:16px;width:16px!important;height:16px!important}::ng-deep .mat-mdc-chip-option[disabled]{opacity:1}::ng-deep .mat-mdc-chip-option[disabled] .mdc-evolution-chip__text-label{opacity:1}.m-0{margin:0}.w-full{width:100%}.orgTypeName{font-weight:700;font-size:14px;text-transform:capitalize}.orgTypeSelected{padding:5px 15px;border:1px solid rgba(0,0,0,.1607843137);background:#e8e9eb;border-radius:20px;margin-top:5px;font-size:14px;font-weight:400;text-transform:capitalize}.search-container{position:relative;width:100%;padding:8px;box-sizing:border-box}.search-container:before{content:\"\";position:absolute;left:16px;top:50%;transform:translateY(-50%);width:16px;height:16px;background-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\" fill=\"%23757575\"/></svg>');background-repeat:no-repeat;background-size:contain;z-index:1}.search-container .search-input{width:calc(100% - 8px);height:28px;border:1px solid rgba(0,0,0,.1607843137);border-radius:20px;padding:4px 12px 4px 36px;outline:none;font-size:14px;box-sizing:border-box}.search-container .search-input:focus{border-color:#1b4ca1}.dashed-line{height:25px;border-left:2px dashed #1B4CA1;margin-left:10px}.org-container{position:relative}.org-container:not(:first-child){margin-top:0}.org-container:not(:first-child):before{content:\"\";position:absolute;left:-20px;top:4px;height:8px;border-left:2px dashed #1B4CA1;z-index:0;border-bottom:2px dashed #1B4CA1;width:10px}.org-container:not(:first-child):after{content:\"\";position:absolute;left:-15px;top:8px;width:8px;height:8px;border-right:2px solid #1B4CA1;border-bottom:2px solid #1B4CA1;transform:rotate(-45deg);z-index:1;background-color:transparent}\n"] }]
|
|
9876
9895
|
}], ctorParameters: function () { return [{ type: i1$3.MatLegacyDialogRef }, { type: undefined, decorators: [{
|
|
9877
9896
|
type: Inject,
|
|
9878
9897
|
args: [MAT_LEGACY_DIALOG_DATA]
|
|
@@ -9985,17 +10004,27 @@ class ConnectorService {
|
|
|
9985
10004
|
}
|
|
9986
10005
|
let container = treeViewComponent.querySelector('#leader-line-container');
|
|
9987
10006
|
if (!container) {
|
|
10007
|
+
let overflowWrapper = document.createElement('div');
|
|
10008
|
+
overflowWrapper.id = 'leader-line-overflow-wrapper';
|
|
10009
|
+
overflowWrapper.style.position = 'absolute';
|
|
10010
|
+
overflowWrapper.style.top = '80px';
|
|
10011
|
+
overflowWrapper.style.bottom = '0';
|
|
10012
|
+
overflowWrapper.style.left = '0';
|
|
10013
|
+
overflowWrapper.style.right = '0';
|
|
10014
|
+
overflowWrapper.style.overflow = 'hidden';
|
|
10015
|
+
overflowWrapper.style.pointerEvents = 'none';
|
|
9988
10016
|
container = document.createElement('div');
|
|
9989
10017
|
container.id = 'leader-line-container';
|
|
9990
10018
|
container.style.position = 'absolute';
|
|
9991
10019
|
container.style.top = '0';
|
|
10020
|
+
container.style.bottom = '0';
|
|
9992
10021
|
container.style.left = '0';
|
|
10022
|
+
container.style.right = '0';
|
|
9993
10023
|
container.style.width = '100%';
|
|
9994
10024
|
container.style.height = '100%';
|
|
9995
10025
|
container.style.pointerEvents = 'none';
|
|
9996
|
-
container
|
|
9997
|
-
|
|
9998
|
-
treeViewComponent.appendChild(container);
|
|
10026
|
+
overflowWrapper.appendChild(container);
|
|
10027
|
+
treeViewComponent.appendChild(overflowWrapper);
|
|
9999
10028
|
}
|
|
10000
10029
|
this.elmWrapper = container;
|
|
10001
10030
|
let sourceElement = source;
|
|
@@ -10152,6 +10181,19 @@ class ConnectorService {
|
|
|
10152
10181
|
}
|
|
10153
10182
|
this.updateConnectorsMap({});
|
|
10154
10183
|
}
|
|
10184
|
+
repositionAllLines() {
|
|
10185
|
+
if (this.connectorMap) {
|
|
10186
|
+
Object.values(this.connectorMap).forEach((connector) => {
|
|
10187
|
+
if (connector && connector.lines) {
|
|
10188
|
+
connector.lines.forEach((item) => {
|
|
10189
|
+
if (item.line && typeof item.line.position === 'function') {
|
|
10190
|
+
item.line.position();
|
|
10191
|
+
}
|
|
10192
|
+
});
|
|
10193
|
+
}
|
|
10194
|
+
});
|
|
10195
|
+
}
|
|
10196
|
+
}
|
|
10155
10197
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConnectorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
10156
10198
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConnectorService }); }
|
|
10157
10199
|
}
|
|
@@ -10447,11 +10489,11 @@ class TermCardComponent {
|
|
|
10447
10489
|
this.cardAction.emit({ action: type, data: _item });
|
|
10448
10490
|
}
|
|
10449
10491
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TermCardComponent, deps: [{ token: FrameworkService }, { token: LocalConnectionService }, { token: ApprovalService }, { token: i1$3.MatLegacyDialog }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10450
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TermCardComponent, selector: "lib-term-card", inputs: { data: "data" }, outputs: { isSelected: "isSelected", selectedCard: "selectedCard", cardAction: "cardAction" }, ngImport: i0, template: "<ng-container [ngSwitch]=\"( (data && data?.cardSubType) || 'cardMinimal')\">\n <ng-container *ngSwitchCase=\"'standard'\" [ngTemplateOutlet]=\"cardStandard\"></ng-container>\n <ng-container *ngSwitchCase=\"'space-saving'\" [ngTemplateOutlet]=\"cardSpaceSaving\"></ng-container>\n <ng-container *ngSwitchDefault [ngTemplateOutlet]=\"cardMinimal\"></ng-container>\n</ng-container>\n\n<ng-template #cardMinimal>\n <div #cardRef class=\"term-card clickable {{data.index}}\" (click)=\"cardClicked(data, cardRef)\"\n [ngClass]=\"[data.children.selected?'selected':'', data.children.approvalStatus === 'Draft'? 'inDraft':'',\n data.children.associationProperties?.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length || data.children.highlight && isApprovalRequired ? 'inAssociationDraft':'']\"\n id=\"{{data.children.name}}\"\n [ngStyle]=\"{'background-color':getColor(data.index,cardRef,'bgColor',data)}\">\n <!-- (click)=\"data.selected=!data.selected\" --> \n <div class=\"term-card-parent\">\n <!-- <Below element is to show id on top left of the card> -->\n <!-- <div class=\"id\" [hidden]=\"true\">{{data.children.code}}</div> -->\n \n <div class=\"term-card-content\">\n <!-- <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"ribbon\">{{data?.children?.refId}}</div>\n </ng-container> -->\n\n <ng-container *ngIf=\"data?.children?.additionalProperties?.competencyArea?.name\">\n <div class=\"mb-2\">\n <span class=\"comp-area {{data?.children?.additionalProperties?.competencyArea?.name?.toLowerCase()}}\">{{data?.children?.additionalProperties?.competencyArea?.name}}</span>\n </div>\n </ng-container>\n <div class=\"card-title\">{{data.children.name}}\n <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"refIdCard mt-2\">\n <span>{{data?.children?.refId}} </span>\n </div>\n </ng-container> \n </div>\n <!-- <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"refIdCard px-4\">\n <span>{{data?.children?.refId}} </span>\n </div>\n </ng-container> -->\n <!-- <span>++{{data.children.selected}}+++</span>\n <span>=={{data.children.status}}==</span> -->\n <div class=\"card-description flex flex-middle gap-1\">\n <mat-icon svgIcon=\"frac\"></mat-icon> \n <span>{{(data.children.children) ? data.children.children?.length : 0}} Child Org</span>\n </div>\n </div>\n </div>\n\n <!-- <p>{{data.children.approvalStatus}}, {{data.children.associationProperties?.approvalStatus}}</p> -->\n <!-- *ngIf=\"!data.isViewOnly && data.children.approvalStatus === 'Draft' && isApprovalRequired\" -->\n\n <!-- (click)=\"$event.stopPropagation();\" -->\n <ng-container *ngIf=\"data?.columnInfo?.config?.enableThreeDot\" >\n <button type=\"button\" mat-icon-button i18n-aria-label aria-label=\"action items\"\n [matMenuTriggerFor]=\"orgMenu\" [matMenuTriggerData]=\"{'data':data, 'cardRef': cardRef}\" class=\"action-btn\">\n <mat-icon>more_vert</mat-icon>\n </button>\n </ng-container>\n <!-- <div class=\"term-card-checkbox\">\n <mat-checkbox color=\"primary\" *ngIf=\"data.children.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length || \n data.children.associationProperties?.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length ||\n data.children.highlight && isApprovalRequired\" [checked]=\"data.children.highlight\" class=\"termSelection\"\n (change)=\"handleProductClick(data.children, $event)\" (click)=\"$event.stopPropagation()\"></mat-checkbox>\n <mat-icon color=\"primary\" class=\"approve-flag\"\n *ngIf=\"data.children.highlight && isApprovalRequired\">{{app_strings.flag}}</mat-icon>\n </div> -->\n </div>\n</ng-template>\n\n<ng-template #cardStandard>\n <div>\n {{data.children.name}} \n </div>\n <div>\n {{data.children.description}} s\n </div>\n</ng-template>\n\n<ng-template #cardSpaceSaving>\n <div>\n {{data.children.name}}\n </div>\n</ng-template>\n\n<mat-menu #cardMenu=\"matMenu\" class=\"menu-sec\">\n <ng-template matMenuContent let-rowData=\"data\" let-cardRef=\"cardRef\">\n <!-- <div > -->\n <button *ngIf=\"data.columnInfo.config.enableView\" (click)=\"view(data, data.children, data.index)\" mat-menu-item name=\"channel-analytics-button\"\n class=\"ws-mat-primary-text\" i18n-aria-label aria-label=\"Analytics\">\n <mat-icon>visibility</mat-icon> <span>View</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enabaleEdit\" (click)=\"edit(data, data.children,data.index, cardRef)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>edit</mat-icon>\n <span>Edit</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableAdd\" (click)=\"create(data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>add</mat-icon>\n <span>Add</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableDelete\" (click)=\"delete(data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>delete</mat-icon>\n <span>Delete</span>\n </button>\n </ng-template>\n</mat-menu>\n\n<mat-menu #orgMenu=\"matMenu\" class=\"menu-sec\">\n <ng-template matMenuContent let-rowData=\"data\" let-cardRef=\"cardRef\">\n <button *ngIf=\"data.columnInfo.config.enableUpdateHierarchy\" (click)=\"menuAction('update-hierarchy', data)\" mat-menu-item name=\"channel-analytics-button\"\n class=\"ws-mat-primary-text\" i18n-aria-label aria-label=\"Analytics\">\n <mat-icon>edit</mat-icon> <span>Update Hierarchy</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enabaleRemoveConnection\" (click)=\"menuAction('remove-term', data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>close</mat-icon>\n <span>Remove Connection</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableManageOrganization\" (click)=\"menuAction('manage-org', data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>settings</mat-icon>\n <span>Manage Organisation</span>\n </button>\n </ng-template>\n</mat-menu>", styles: [".term-card{border:1px solid rgba(0,0,0,.08);padding:.9rem;margin:0 0 1em;background-color:#fff;border-radius:8px;overflow:hidden;position:relative;z-index:45;display:flex;align-items:center;box-shadow:#0000001a 0 1px 3px,#0000000f 0 1px 2px;word-break:break-word}.term-card .termSelection{position:absolute;right:10px;top:10px}.term-card .term-card-parent{display:flex;flex:1 1 0%}.term-card .term-card-parent .term-card-content{white-space:initial}.term-card .term-card-parent .term-card-content .card-title{margin-bottom:.5em;font-family:Lato;font-size:14px;font-weight:400}.term-card .term-card-parent .term-card-content .card-description{color:#000;font-size:12px!important;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.term-card .term-card-parent .term-card-content .card-description mat-icon{width:16px;height:16px;color:#1b4ca1}.term-card .term-card-checkbox{width:10%}.term-card.selected{color:#000;border-style:none}.term-card.selected .card-description{color:#000!important}.term-card.selected .card-description mat-icon{color:#000!important}.term-card.clickable{cursor:pointer}.approve-flag{position:absolute;right:5px;top:35px;font-size:24px}::ng-deep .menu-sec{min-height:0px!important;background:#fff!important}::ng-deep .mat-mdc-menu-panel{background-color:#fff!important}::ng-deep .mat-mdc-menu-content,::ng-deep .mat-mdc-menu-item{background-color:#fff!important}.menu-sec{background:#fff!important}.refIdCard{border-radius:12px;width:fit-content;border:1px solid #bbb;padding:0 8px;font-size:8px!important;display:flex;align-items:center}.comp-area{font-family:Inter;font-size:12px;font-weight:600;line-height:16px;text-align:left;padding:8px;border-radius:12px}.comp-area.functional{background:#e24577;color:#fff}.comp-area.domain{background:#7b47a4;color:#fff}.comp-area.behavioural{background:#f9bf71}.ribbon{font-size:8px;font-weight:700;color:#fff}.ribbon{--f: .5em;--r: .8em;position:absolute;top:8px;right:calc(-1 * var(--f));padding-inline:.25em;padding-right:8px;line-height:1.8;background:#fa6900;border-bottom:var(--f) solid rgba(0,0,0,.3333333333);border-left:var(--r) solid rgba(0,0,0,0);clip-path:polygon(var(--r) 0,100% 0,100% calc(100% - var(--f)),calc(100% - var(--f)) 100%,calc(100% - var(--f)) calc(100% - var(--f)),var(--r) calc(100% - var(--f)),0 calc(50% - var(--f) / 2))}.refId-card{font-size:10px}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i5.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i14.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i14.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i14.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i14.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }] }); }
|
|
10492
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TermCardComponent, selector: "lib-term-card", inputs: { data: "data" }, outputs: { isSelected: "isSelected", selectedCard: "selectedCard", cardAction: "cardAction" }, ngImport: i0, template: "<ng-container [ngSwitch]=\"( (data && data?.cardSubType) || 'cardMinimal')\">\n <ng-container *ngSwitchCase=\"'standard'\" [ngTemplateOutlet]=\"cardStandard\"></ng-container>\n <ng-container *ngSwitchCase=\"'space-saving'\" [ngTemplateOutlet]=\"cardSpaceSaving\"></ng-container>\n <ng-container *ngSwitchDefault [ngTemplateOutlet]=\"cardMinimal\"></ng-container>\n</ng-container>\n\n<ng-template #cardMinimal>\n <div #cardRef class=\"term-card clickable {{data.index}}\" (click)=\"cardClicked(data, cardRef)\"\n [ngClass]=\"[data.children.selected?'selected':'', data.children.approvalStatus === 'Draft'? 'inDraft':'',\n data.children.associationProperties?.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length || data.children.highlight && isApprovalRequired ? 'inAssociationDraft':'']\"\n id=\"{{data.children.name}}\"\n [ngStyle]=\"{'background-color':getColor(data.index,cardRef,'bgColor',data)}\">\n <!-- (click)=\"data.selected=!data.selected\" --> \n <div class=\"term-card-parent\">\n <!-- <Below element is to show id on top left of the card> -->\n <!-- <div class=\"id\" [hidden]=\"true\">{{data.children.code}}</div> -->\n \n <div class=\"term-card-content\">\n <!-- <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"ribbon\">{{data?.children?.refId}}</div>\n </ng-container> -->\n\n <ng-container *ngIf=\"data?.children?.additionalProperties?.competencyArea?.name\">\n <div class=\"mb-2\">\n <span class=\"comp-area {{data?.children?.additionalProperties?.competencyArea?.name?.toLowerCase()}}\">{{data?.children?.additionalProperties?.competencyArea?.name}}</span>\n </div>\n </ng-container>\n <div class=\"card-title\">{{data.children.name}}\n <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"refIdCard mt-2\">\n <span>{{data?.children?.refId}} </span>\n </div>\n </ng-container> \n </div>\n <!-- <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"refIdCard px-4\">\n <span>{{data?.children?.refId}} </span>\n </div>\n </ng-container> -->\n <!-- <span>++{{data.children.selected}}+++</span>\n <span>=={{data.children.status}}==</span> -->\n <div class=\"card-description flex flex-middle gap-1\">\n <mat-icon svgIcon=\"frac\"></mat-icon> \n <span>{{(data.children.children) ? data.children.children?.length : 0}} Child Org</span>\n </div>\n </div>\n </div>\n\n <!-- <p>{{data.children.approvalStatus}}, {{data.children.associationProperties?.approvalStatus}}</p> -->\n <!-- *ngIf=\"!data.isViewOnly && data.children.approvalStatus === 'Draft' && isApprovalRequired\" -->\n\n <!-- (click)=\"$event.stopPropagation();\" -->\n <ng-container *ngIf=\"data?.columnInfo?.config?.enableThreeDot\" >\n <button type=\"button\" mat-icon-button i18n-aria-label aria-label=\"action items\"\n [matMenuTriggerFor]=\"orgMenu\" [matMenuTriggerData]=\"{'data':data, 'cardRef': cardRef}\" class=\"action-btn\">\n <mat-icon>more_vert</mat-icon>\n </button>\n </ng-container>\n <!-- <div class=\"term-card-checkbox\">\n <mat-checkbox color=\"primary\" *ngIf=\"data.children.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length || \n data.children.associationProperties?.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length ||\n data.children.highlight && isApprovalRequired\" [checked]=\"data.children.highlight\" class=\"termSelection\"\n (change)=\"handleProductClick(data.children, $event)\" (click)=\"$event.stopPropagation()\"></mat-checkbox>\n <mat-icon color=\"primary\" class=\"approve-flag\"\n *ngIf=\"data.children.highlight && isApprovalRequired\">{{app_strings.flag}}</mat-icon>\n </div> -->\n </div>\n</ng-template>\n\n<ng-template #cardStandard>\n <div>\n {{data.children.name}} \n </div>\n <div>\n {{data.children.description}} s\n </div>\n</ng-template>\n\n<ng-template #cardSpaceSaving>\n <div>\n {{data.children.name}}\n </div>\n</ng-template>\n\n<mat-menu #cardMenu=\"matMenu\" class=\"menu-sec\">\n <ng-template matMenuContent let-rowData=\"data\" let-cardRef=\"cardRef\">\n <!-- <div > -->\n <button *ngIf=\"data.columnInfo.config.enableView\" (click)=\"view(data, data.children, data.index)\" mat-menu-item name=\"channel-analytics-button\"\n class=\"ws-mat-primary-text\" i18n-aria-label aria-label=\"Analytics\">\n <mat-icon>visibility</mat-icon> <span>View</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enabaleEdit\" (click)=\"edit(data, data.children,data.index, cardRef)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>edit</mat-icon>\n <span>Edit</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableAdd\" (click)=\"create(data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>add</mat-icon>\n <span>Add</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableDelete\" (click)=\"delete(data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>delete</mat-icon>\n <span>Delete</span>\n </button>\n </ng-template>\n</mat-menu>\n\n<mat-menu #orgMenu=\"matMenu\" class=\"menu-sec\">\n <ng-template matMenuContent let-rowData=\"data\" let-cardRef=\"cardRef\">\n <button *ngIf=\"data.columnInfo.config.enableUpdateHierarchy\" (click)=\"menuAction('update-hierarchy', data)\" mat-menu-item name=\"channel-analytics-button\"\n class=\"ws-mat-primary-text\" i18n-aria-label aria-label=\"Analytics\">\n <mat-icon>edit</mat-icon> <span>Update Hierarchy</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enabaleRemoveConnection\" (click)=\"menuAction('remove-term', data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>close</mat-icon>\n <span>Remove Connection</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableManageOrganization\" (click)=\"menuAction('manage-org', data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>settings</mat-icon>\n <span>Manage Organisation</span>\n </button>\n </ng-template>\n</mat-menu>", styles: [".term-card{border:1px solid rgba(0,0,0,.08);padding:.9rem;margin:0 5px 1em;background-color:#fff;border-radius:8px;overflow:hidden;position:relative;z-index:45;display:flex;align-items:center;box-shadow:#0000001a 0 1px 3px,#0000000f 0 1px 2px;word-break:break-word}.term-card .termSelection{position:absolute;right:10px;top:10px}.term-card .term-card-parent{display:flex;flex:1 1 0%}.term-card .term-card-parent .term-card-content{white-space:initial}.term-card .term-card-parent .term-card-content .card-title{margin-bottom:.5em;font-family:Lato;font-size:14px;font-weight:400}.term-card .term-card-parent .term-card-content .card-description{color:#000;font-size:12px!important;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.term-card .term-card-parent .term-card-content .card-description mat-icon{width:16px;height:16px;color:#1b4ca1}.term-card .term-card-checkbox{width:10%}.term-card.selected{color:#000;border-style:none}.term-card.selected .card-description{color:#000!important}.term-card.selected .card-description mat-icon{color:#000!important}.term-card.clickable{cursor:pointer}.approve-flag{position:absolute;right:5px;top:35px;font-size:24px}::ng-deep .menu-sec{min-height:0px!important;background:#fff!important}::ng-deep .mat-mdc-menu-panel{background-color:#fff!important}::ng-deep .mat-mdc-menu-content,::ng-deep .mat-mdc-menu-item{background-color:#fff!important}.menu-sec{background:#fff!important}.refIdCard{border-radius:12px;width:fit-content;border:1px solid #bbb;padding:0 8px;font-size:8px!important;display:flex;align-items:center}.comp-area{font-family:Inter;font-size:12px;font-weight:600;line-height:16px;text-align:left;padding:8px;border-radius:12px}.comp-area.functional{background:#e24577;color:#fff}.comp-area.domain{background:#7b47a4;color:#fff}.comp-area.behavioural{background:#f9bf71}.ribbon{font-size:8px;font-weight:700;color:#fff}.ribbon{--f: .5em;--r: .8em;position:absolute;top:8px;right:calc(-1 * var(--f));padding-inline:.25em;padding-right:8px;line-height:1.8;background:#fa6900;border-bottom:var(--f) solid rgba(0,0,0,.3333333333);border-left:var(--r) solid rgba(0,0,0,0);clip-path:polygon(var(--r) 0,100% 0,100% calc(100% - var(--f)),calc(100% - var(--f)) 100%,calc(100% - var(--f)) calc(100% - var(--f)),var(--r) calc(100% - var(--f)),0 calc(50% - var(--f) / 2))}.refId-card{font-size:10px}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i5.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i14.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i14.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i14.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i14.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }] }); }
|
|
10451
10493
|
}
|
|
10452
10494
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TermCardComponent, decorators: [{
|
|
10453
10495
|
type: Component,
|
|
10454
|
-
args: [{ selector: 'lib-term-card', template: "<ng-container [ngSwitch]=\"( (data && data?.cardSubType) || 'cardMinimal')\">\n <ng-container *ngSwitchCase=\"'standard'\" [ngTemplateOutlet]=\"cardStandard\"></ng-container>\n <ng-container *ngSwitchCase=\"'space-saving'\" [ngTemplateOutlet]=\"cardSpaceSaving\"></ng-container>\n <ng-container *ngSwitchDefault [ngTemplateOutlet]=\"cardMinimal\"></ng-container>\n</ng-container>\n\n<ng-template #cardMinimal>\n <div #cardRef class=\"term-card clickable {{data.index}}\" (click)=\"cardClicked(data, cardRef)\"\n [ngClass]=\"[data.children.selected?'selected':'', data.children.approvalStatus === 'Draft'? 'inDraft':'',\n data.children.associationProperties?.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length || data.children.highlight && isApprovalRequired ? 'inAssociationDraft':'']\"\n id=\"{{data.children.name}}\"\n [ngStyle]=\"{'background-color':getColor(data.index,cardRef,'bgColor',data)}\">\n <!-- (click)=\"data.selected=!data.selected\" --> \n <div class=\"term-card-parent\">\n <!-- <Below element is to show id on top left of the card> -->\n <!-- <div class=\"id\" [hidden]=\"true\">{{data.children.code}}</div> -->\n \n <div class=\"term-card-content\">\n <!-- <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"ribbon\">{{data?.children?.refId}}</div>\n </ng-container> -->\n\n <ng-container *ngIf=\"data?.children?.additionalProperties?.competencyArea?.name\">\n <div class=\"mb-2\">\n <span class=\"comp-area {{data?.children?.additionalProperties?.competencyArea?.name?.toLowerCase()}}\">{{data?.children?.additionalProperties?.competencyArea?.name}}</span>\n </div>\n </ng-container>\n <div class=\"card-title\">{{data.children.name}}\n <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"refIdCard mt-2\">\n <span>{{data?.children?.refId}} </span>\n </div>\n </ng-container> \n </div>\n <!-- <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"refIdCard px-4\">\n <span>{{data?.children?.refId}} </span>\n </div>\n </ng-container> -->\n <!-- <span>++{{data.children.selected}}+++</span>\n <span>=={{data.children.status}}==</span> -->\n <div class=\"card-description flex flex-middle gap-1\">\n <mat-icon svgIcon=\"frac\"></mat-icon> \n <span>{{(data.children.children) ? data.children.children?.length : 0}} Child Org</span>\n </div>\n </div>\n </div>\n\n <!-- <p>{{data.children.approvalStatus}}, {{data.children.associationProperties?.approvalStatus}}</p> -->\n <!-- *ngIf=\"!data.isViewOnly && data.children.approvalStatus === 'Draft' && isApprovalRequired\" -->\n\n <!-- (click)=\"$event.stopPropagation();\" -->\n <ng-container *ngIf=\"data?.columnInfo?.config?.enableThreeDot\" >\n <button type=\"button\" mat-icon-button i18n-aria-label aria-label=\"action items\"\n [matMenuTriggerFor]=\"orgMenu\" [matMenuTriggerData]=\"{'data':data, 'cardRef': cardRef}\" class=\"action-btn\">\n <mat-icon>more_vert</mat-icon>\n </button>\n </ng-container>\n <!-- <div class=\"term-card-checkbox\">\n <mat-checkbox color=\"primary\" *ngIf=\"data.children.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length || \n data.children.associationProperties?.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length ||\n data.children.highlight && isApprovalRequired\" [checked]=\"data.children.highlight\" class=\"termSelection\"\n (change)=\"handleProductClick(data.children, $event)\" (click)=\"$event.stopPropagation()\"></mat-checkbox>\n <mat-icon color=\"primary\" class=\"approve-flag\"\n *ngIf=\"data.children.highlight && isApprovalRequired\">{{app_strings.flag}}</mat-icon>\n </div> -->\n </div>\n</ng-template>\n\n<ng-template #cardStandard>\n <div>\n {{data.children.name}} \n </div>\n <div>\n {{data.children.description}} s\n </div>\n</ng-template>\n\n<ng-template #cardSpaceSaving>\n <div>\n {{data.children.name}}\n </div>\n</ng-template>\n\n<mat-menu #cardMenu=\"matMenu\" class=\"menu-sec\">\n <ng-template matMenuContent let-rowData=\"data\" let-cardRef=\"cardRef\">\n <!-- <div > -->\n <button *ngIf=\"data.columnInfo.config.enableView\" (click)=\"view(data, data.children, data.index)\" mat-menu-item name=\"channel-analytics-button\"\n class=\"ws-mat-primary-text\" i18n-aria-label aria-label=\"Analytics\">\n <mat-icon>visibility</mat-icon> <span>View</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enabaleEdit\" (click)=\"edit(data, data.children,data.index, cardRef)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>edit</mat-icon>\n <span>Edit</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableAdd\" (click)=\"create(data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>add</mat-icon>\n <span>Add</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableDelete\" (click)=\"delete(data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>delete</mat-icon>\n <span>Delete</span>\n </button>\n </ng-template>\n</mat-menu>\n\n<mat-menu #orgMenu=\"matMenu\" class=\"menu-sec\">\n <ng-template matMenuContent let-rowData=\"data\" let-cardRef=\"cardRef\">\n <button *ngIf=\"data.columnInfo.config.enableUpdateHierarchy\" (click)=\"menuAction('update-hierarchy', data)\" mat-menu-item name=\"channel-analytics-button\"\n class=\"ws-mat-primary-text\" i18n-aria-label aria-label=\"Analytics\">\n <mat-icon>edit</mat-icon> <span>Update Hierarchy</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enabaleRemoveConnection\" (click)=\"menuAction('remove-term', data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>close</mat-icon>\n <span>Remove Connection</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableManageOrganization\" (click)=\"menuAction('manage-org', data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>settings</mat-icon>\n <span>Manage Organisation</span>\n </button>\n </ng-template>\n</mat-menu>", styles: [".term-card{border:1px solid rgba(0,0,0,.08);padding:.9rem;margin:0
|
|
10496
|
+
args: [{ selector: 'lib-term-card', template: "<ng-container [ngSwitch]=\"( (data && data?.cardSubType) || 'cardMinimal')\">\n <ng-container *ngSwitchCase=\"'standard'\" [ngTemplateOutlet]=\"cardStandard\"></ng-container>\n <ng-container *ngSwitchCase=\"'space-saving'\" [ngTemplateOutlet]=\"cardSpaceSaving\"></ng-container>\n <ng-container *ngSwitchDefault [ngTemplateOutlet]=\"cardMinimal\"></ng-container>\n</ng-container>\n\n<ng-template #cardMinimal>\n <div #cardRef class=\"term-card clickable {{data.index}}\" (click)=\"cardClicked(data, cardRef)\"\n [ngClass]=\"[data.children.selected?'selected':'', data.children.approvalStatus === 'Draft'? 'inDraft':'',\n data.children.associationProperties?.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length || data.children.highlight && isApprovalRequired ? 'inAssociationDraft':'']\"\n id=\"{{data.children.name}}\"\n [ngStyle]=\"{'background-color':getColor(data.index,cardRef,'bgColor',data)}\">\n <!-- (click)=\"data.selected=!data.selected\" --> \n <div class=\"term-card-parent\">\n <!-- <Below element is to show id on top left of the card> -->\n <!-- <div class=\"id\" [hidden]=\"true\">{{data.children.code}}</div> -->\n \n <div class=\"term-card-content\">\n <!-- <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"ribbon\">{{data?.children?.refId}}</div>\n </ng-container> -->\n\n <ng-container *ngIf=\"data?.children?.additionalProperties?.competencyArea?.name\">\n <div class=\"mb-2\">\n <span class=\"comp-area {{data?.children?.additionalProperties?.competencyArea?.name?.toLowerCase()}}\">{{data?.children?.additionalProperties?.competencyArea?.name}}</span>\n </div>\n </ng-container>\n <div class=\"card-title\">{{data.children.name}}\n <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"refIdCard mt-2\">\n <span>{{data?.children?.refId}} </span>\n </div>\n </ng-container> \n </div>\n <!-- <ng-container *ngIf=\"data?.children?.refId\">\n <div class=\"refIdCard px-4\">\n <span>{{data?.children?.refId}} </span>\n </div>\n </ng-container> -->\n <!-- <span>++{{data.children.selected}}+++</span>\n <span>=={{data.children.status}}==</span> -->\n <div class=\"card-description flex flex-middle gap-1\">\n <mat-icon svgIcon=\"frac\"></mat-icon> \n <span>{{(data.children.children) ? data.children.children?.length : 0}} Child Org</span>\n </div>\n </div>\n </div>\n\n <!-- <p>{{data.children.approvalStatus}}, {{data.children.associationProperties?.approvalStatus}}</p> -->\n <!-- *ngIf=\"!data.isViewOnly && data.children.approvalStatus === 'Draft' && isApprovalRequired\" -->\n\n <!-- (click)=\"$event.stopPropagation();\" -->\n <ng-container *ngIf=\"data?.columnInfo?.config?.enableThreeDot\" >\n <button type=\"button\" mat-icon-button i18n-aria-label aria-label=\"action items\"\n [matMenuTriggerFor]=\"orgMenu\" [matMenuTriggerData]=\"{'data':data, 'cardRef': cardRef}\" class=\"action-btn\">\n <mat-icon>more_vert</mat-icon>\n </button>\n </ng-container>\n <!-- <div class=\"term-card-checkbox\">\n <mat-checkbox color=\"primary\" *ngIf=\"data.children.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length || \n data.children.associationProperties?.approvalStatus === 'Draft' && isApprovalRequired && !approvalList.length ||\n data.children.highlight && isApprovalRequired\" [checked]=\"data.children.highlight\" class=\"termSelection\"\n (change)=\"handleProductClick(data.children, $event)\" (click)=\"$event.stopPropagation()\"></mat-checkbox>\n <mat-icon color=\"primary\" class=\"approve-flag\"\n *ngIf=\"data.children.highlight && isApprovalRequired\">{{app_strings.flag}}</mat-icon>\n </div> -->\n </div>\n</ng-template>\n\n<ng-template #cardStandard>\n <div>\n {{data.children.name}} \n </div>\n <div>\n {{data.children.description}} s\n </div>\n</ng-template>\n\n<ng-template #cardSpaceSaving>\n <div>\n {{data.children.name}}\n </div>\n</ng-template>\n\n<mat-menu #cardMenu=\"matMenu\" class=\"menu-sec\">\n <ng-template matMenuContent let-rowData=\"data\" let-cardRef=\"cardRef\">\n <!-- <div > -->\n <button *ngIf=\"data.columnInfo.config.enableView\" (click)=\"view(data, data.children, data.index)\" mat-menu-item name=\"channel-analytics-button\"\n class=\"ws-mat-primary-text\" i18n-aria-label aria-label=\"Analytics\">\n <mat-icon>visibility</mat-icon> <span>View</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enabaleEdit\" (click)=\"edit(data, data.children,data.index, cardRef)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>edit</mat-icon>\n <span>Edit</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableAdd\" (click)=\"create(data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>add</mat-icon>\n <span>Add</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableDelete\" (click)=\"delete(data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>delete</mat-icon>\n <span>Delete</span>\n </button>\n </ng-template>\n</mat-menu>\n\n<mat-menu #orgMenu=\"matMenu\" class=\"menu-sec\">\n <ng-template matMenuContent let-rowData=\"data\" let-cardRef=\"cardRef\">\n <button *ngIf=\"data.columnInfo.config.enableUpdateHierarchy\" (click)=\"menuAction('update-hierarchy', data)\" mat-menu-item name=\"channel-analytics-button\"\n class=\"ws-mat-primary-text\" i18n-aria-label aria-label=\"Analytics\">\n <mat-icon>edit</mat-icon> <span>Update Hierarchy</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enabaleRemoveConnection\" (click)=\"menuAction('remove-term', data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>close</mat-icon>\n <span>Remove Connection</span>\n </button>\n <button *ngIf=\"data.columnInfo.config.enableManageOrganization\" (click)=\"menuAction('manage-org', data)\"\n mat-menu-item name=\"channel-analytics-button\" class=\"ws-mat-primary-text\" i18n-aria-label\n aria-label=\"Analytics\">\n <mat-icon>settings</mat-icon>\n <span>Manage Organisation</span>\n </button>\n </ng-template>\n</mat-menu>", styles: [".term-card{border:1px solid rgba(0,0,0,.08);padding:.9rem;margin:0 5px 1em;background-color:#fff;border-radius:8px;overflow:hidden;position:relative;z-index:45;display:flex;align-items:center;box-shadow:#0000001a 0 1px 3px,#0000000f 0 1px 2px;word-break:break-word}.term-card .termSelection{position:absolute;right:10px;top:10px}.term-card .term-card-parent{display:flex;flex:1 1 0%}.term-card .term-card-parent .term-card-content{white-space:initial}.term-card .term-card-parent .term-card-content .card-title{margin-bottom:.5em;font-family:Lato;font-size:14px;font-weight:400}.term-card .term-card-parent .term-card-content .card-description{color:#000;font-size:12px!important;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.term-card .term-card-parent .term-card-content .card-description mat-icon{width:16px;height:16px;color:#1b4ca1}.term-card .term-card-checkbox{width:10%}.term-card.selected{color:#000;border-style:none}.term-card.selected .card-description{color:#000!important}.term-card.selected .card-description mat-icon{color:#000!important}.term-card.clickable{cursor:pointer}.approve-flag{position:absolute;right:5px;top:35px;font-size:24px}::ng-deep .menu-sec{min-height:0px!important;background:#fff!important}::ng-deep .mat-mdc-menu-panel{background-color:#fff!important}::ng-deep .mat-mdc-menu-content,::ng-deep .mat-mdc-menu-item{background-color:#fff!important}.menu-sec{background:#fff!important}.refIdCard{border-radius:12px;width:fit-content;border:1px solid #bbb;padding:0 8px;font-size:8px!important;display:flex;align-items:center}.comp-area{font-family:Inter;font-size:12px;font-weight:600;line-height:16px;text-align:left;padding:8px;border-radius:12px}.comp-area.functional{background:#e24577;color:#fff}.comp-area.domain{background:#7b47a4;color:#fff}.comp-area.behavioural{background:#f9bf71}.ribbon{font-size:8px;font-weight:700;color:#fff}.ribbon{--f: .5em;--r: .8em;position:absolute;top:8px;right:calc(-1 * var(--f));padding-inline:.25em;padding-right:8px;line-height:1.8;background:#fa6900;border-bottom:var(--f) solid rgba(0,0,0,.3333333333);border-left:var(--r) solid rgba(0,0,0,0);clip-path:polygon(var(--r) 0,100% 0,100% calc(100% - var(--f)),calc(100% - var(--f)) 100%,calc(100% - var(--f)) calc(100% - var(--f)),var(--r) calc(100% - var(--f)),0 calc(50% - var(--f) / 2))}.refId-card{font-size:10px}\n"] }]
|
|
10455
10497
|
}], ctorParameters: function () { return [{ type: FrameworkService }, { type: LocalConnectionService }, { type: ApprovalService }, { type: i1$3.MatLegacyDialog }]; }, propDecorators: { data: [{
|
|
10456
10498
|
type: Input
|
|
10457
10499
|
}], isSelected: [{
|
|
@@ -10759,11 +10801,11 @@ class TreeColumnViewComponent {
|
|
|
10759
10801
|
this.cardAction.emit(event);
|
|
10760
10802
|
}
|
|
10761
10803
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TreeColumnViewComponent, deps: [{ token: FrameworkService }, { token: ConnectorService }, { token: ApprovalService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10762
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TreeColumnViewComponent, selector: "lib-tree-column-view", inputs: { column: "column", containerId: "containerId" }, outputs: { updateTaxonomyTerm: "updateTaxonomyTerm", updateTermList: "updateTermList", cardsCount: "cardsCount", cardAction: "cardAction" }, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"column?.config?.showSearch\">\n <div class=\"w-full sticky\">\n <div class=\"search mb-2\">\n <div class
|
|
10804
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TreeColumnViewComponent, selector: "lib-tree-column-view", inputs: { column: "column", containerId: "containerId" }, outputs: { updateTaxonomyTerm: "updateTaxonomyTerm", updateTermList: "updateTermList", cardsCount: "cardsCount", cardAction: "cardAction" }, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"column?.config?.showSearch\">\n <div class=\"w-full sticky\">\n <div class=\"search mb-2\">\n <div class=\"rsearch\">\n <div class=\"sinput mat-field-rounded flex flex-middle\">\n <mat-icon class=\"search-icon\">search</mat-icon>\n <input type=\"search\" [formControl]=\"searchValue\" placeholder=\"Search\" #search>\n <button *ngIf=\"search.value\" class=\"clear-btn flex\" (click)=\"clearSearch()\">\n <mat-icon>clear</mat-icon>\n </button>\n </div>\n </div>\n </div>\n </div>\n</ng-container>\n<ng-container *ngIf=\"columnItems && columnItems.length > 0; else noDataTemplate;\">\n <ng-container *ngFor=\"let child of columnItems; let j = index\">\n <div #cardEle id=\"{{column.code}}Card{{j+1}}\" >\n <lib-term-card\n [data]=\"{'children': child, 'selected' : false, 'category':column.code, cardSubType: 'minimal', isViewOnly:false,'index':column.index, columnInfo: column}\"\n (isSelected)=\"updateSelection1($event)\" (selectedCard)=\"selectedCard($event)\" (cardAction)=\"cardActionEmit($event)\">\n </lib-term-card>\n </div>\n </ng-container>\n</ng-container>\n<ng-template #noDataTemplate>\n <!-- <div>No {{column.name}} associated</div> -->\n</ng-template>\n\n<div class=\"w-full flex justify-center\" *ngIf=\"!disableLoadButton\">\n <button (click)=\"loadMore()\" class=\"mat-raised-button mat-button-base loadMore\" [ngClass]=\"{'disablBtn': disableLoadButton}\"\n [disabled]=\"disableLoadButton\">Load more...</button>\n</div>\n", styles: [".flex{display:flex}.w-full{width:100%}.mb1{margin-bottom:1em}flex-center{flex-wrap:nowrap;align-items:start;justify-content:center}.flex-1{flex:1}.felx-col{flex-direction:column}.padding-x2{padding:0 2.5em}.heightFix{height:100vh;overflow:hidden}.cat-columns:hover{overflow-y:scroll}.container{overflow-y:scroll;scrollbar-width:none;-ms-overflow-style:none}.container::-webkit-scrollbar{width:0;height:0}#this{display:none}#this:target{display:block}.search{width:100%;box-sizing:border-box}.search .search-icon{font-size:20px;width:20px;height:20px}.search .rsearch{display:flex;position:relative;flex:1 1 auto;border:1px solid #e0e0e0;border-radius:20px}.search .sinput{width:100%;padding:4px 8px;box-sizing:border-box}.search .sinput input{border:0!important;outline:none!important;margin-top:2px}input[type=search]::-webkit-search-decoration:hover,input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}input[type=search]::-webkit-search-cancel-button{appearance:none}.clear-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:#888;font-size:16px;cursor:pointer;display:none}.sinput:valid~.clear-btn{display:block}.clear-btn:hover{color:#333}.sticky{position:sticky;top:0;z-index:46}.loadMore{background:#1b4ca1!important;color:#fff!important;font-family:Lato;font-size:14px;font-weight:700}.disablBtn{opacity:.6;pointer-events:none}.w-full.sticky{position:sticky;top:0;z-index:100;background-color:#fff}.category-heading-sticky{position:sticky;top:0;z-index:10;background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: TermCardComponent, selector: "lib-term-card", inputs: ["data"], outputs: ["isSelected", "selectedCard", "cardAction"] }] }); }
|
|
10763
10805
|
}
|
|
10764
10806
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TreeColumnViewComponent, decorators: [{
|
|
10765
10807
|
type: Component,
|
|
10766
|
-
args: [{ selector: 'lib-tree-column-view', template: "<ng-container *ngIf=\"column?.config?.showSearch\">\n <div class=\"w-full sticky\">\n <div class=\"search mb-2\">\n <div class
|
|
10808
|
+
args: [{ selector: 'lib-tree-column-view', template: "<ng-container *ngIf=\"column?.config?.showSearch\">\n <div class=\"w-full sticky\">\n <div class=\"search mb-2\">\n <div class=\"rsearch\">\n <div class=\"sinput mat-field-rounded flex flex-middle\">\n <mat-icon class=\"search-icon\">search</mat-icon>\n <input type=\"search\" [formControl]=\"searchValue\" placeholder=\"Search\" #search>\n <button *ngIf=\"search.value\" class=\"clear-btn flex\" (click)=\"clearSearch()\">\n <mat-icon>clear</mat-icon>\n </button>\n </div>\n </div>\n </div>\n </div>\n</ng-container>\n<ng-container *ngIf=\"columnItems && columnItems.length > 0; else noDataTemplate;\">\n <ng-container *ngFor=\"let child of columnItems; let j = index\">\n <div #cardEle id=\"{{column.code}}Card{{j+1}}\" >\n <lib-term-card\n [data]=\"{'children': child, 'selected' : false, 'category':column.code, cardSubType: 'minimal', isViewOnly:false,'index':column.index, columnInfo: column}\"\n (isSelected)=\"updateSelection1($event)\" (selectedCard)=\"selectedCard($event)\" (cardAction)=\"cardActionEmit($event)\">\n </lib-term-card>\n </div>\n </ng-container>\n</ng-container>\n<ng-template #noDataTemplate>\n <!-- <div>No {{column.name}} associated</div> -->\n</ng-template>\n\n<div class=\"w-full flex justify-center\" *ngIf=\"!disableLoadButton\">\n <button (click)=\"loadMore()\" class=\"mat-raised-button mat-button-base loadMore\" [ngClass]=\"{'disablBtn': disableLoadButton}\"\n [disabled]=\"disableLoadButton\">Load more...</button>\n</div>\n", styles: [".flex{display:flex}.w-full{width:100%}.mb1{margin-bottom:1em}flex-center{flex-wrap:nowrap;align-items:start;justify-content:center}.flex-1{flex:1}.felx-col{flex-direction:column}.padding-x2{padding:0 2.5em}.heightFix{height:100vh;overflow:hidden}.cat-columns:hover{overflow-y:scroll}.container{overflow-y:scroll;scrollbar-width:none;-ms-overflow-style:none}.container::-webkit-scrollbar{width:0;height:0}#this{display:none}#this:target{display:block}.search{width:100%;box-sizing:border-box}.search .search-icon{font-size:20px;width:20px;height:20px}.search .rsearch{display:flex;position:relative;flex:1 1 auto;border:1px solid #e0e0e0;border-radius:20px}.search .sinput{width:100%;padding:4px 8px;box-sizing:border-box}.search .sinput input{border:0!important;outline:none!important;margin-top:2px}input[type=search]::-webkit-search-decoration:hover,input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}input[type=search]::-webkit-search-cancel-button{appearance:none}.clear-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:#888;font-size:16px;cursor:pointer;display:none}.sinput:valid~.clear-btn{display:block}.clear-btn:hover{color:#333}.sticky{position:sticky;top:0;z-index:46}.loadMore{background:#1b4ca1!important;color:#fff!important;font-family:Lato;font-size:14px;font-weight:700}.disablBtn{opacity:.6;pointer-events:none}.w-full.sticky{position:sticky;top:0;z-index:100;background-color:#fff}.category-heading-sticky{position:sticky;top:0;z-index:10;background-color:#fff}\n"] }]
|
|
10767
10809
|
}], ctorParameters: function () { return [{ type: FrameworkService }, { type: ConnectorService }, { type: ApprovalService }]; }, propDecorators: { column: [{
|
|
10768
10810
|
type: Input
|
|
10769
10811
|
}], containerId: [{
|
|
@@ -11237,7 +11279,7 @@ class TreeViewComponent {
|
|
|
11237
11279
|
}
|
|
11238
11280
|
}
|
|
11239
11281
|
};
|
|
11240
|
-
if (
|
|
11282
|
+
if (prev && prevTrem) {
|
|
11241
11283
|
prevTrem = prevTrem.filter((ele) => ele.category === prev.code)[0];
|
|
11242
11284
|
if (prevTrem && prevTrem.associations && prevTrem.associations.length > 0) {
|
|
11243
11285
|
prevTrem.associations.forEach((ele) => {
|
|
@@ -11427,7 +11469,8 @@ class TreeViewComponent {
|
|
|
11427
11469
|
});
|
|
11428
11470
|
if (term.associations && term.associations.length > 0) {
|
|
11429
11471
|
term.associations.forEach((assoc) => {
|
|
11430
|
-
tempData
|
|
11472
|
+
const getIndex = tempData.findIndex((item) => item.ids && item.ids.includes(term.code));
|
|
11473
|
+
tempData[getIndex]['assocIds'].push(assoc.code);
|
|
11431
11474
|
});
|
|
11432
11475
|
}
|
|
11433
11476
|
}
|
|
@@ -11483,11 +11526,11 @@ class TreeViewComponent {
|
|
|
11483
11526
|
}
|
|
11484
11527
|
}
|
|
11485
11528
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TreeViewComponent, deps: [{ token: FrameworkService }, { token: LocalConnectionService }, { token: i1$3.MatLegacyDialog }, { token: ApprovalService }, { token: i5$2.MatLegacySnackBar }, { token: ConnectorService }, { token: i0.ChangeDetectorRef }, { token: TreeHierarchyService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11486
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TreeViewComponent, selector: "lib-tree-view", inputs: { approvalList: "approvalList", isApprovalView: "isApprovalView", workFlowStatus: "workFlowStatus", environment: "environment", taxonomyConfig: "taxonomyConfig", orgSelectedData: "orgSelectedData" }, outputs: { sentForApprove: "sentForApprove", loaderEnable: "loaderEnable", manageOrg: "manageOrg" }, usesOnChanges: true, ngImport: i0, template: "<!-- <div class=\"flex flex-1 connectionSettings\">\n <button mat-raised-button color=\"accent\" (click)=\"newConnection()\">\n <mat-icon>{{app_strings.build}}</mat-icon>\n </button>\n</div> -->\n\n<div *ngIf=\"list && list.length > 0\" class=\"flex heightFix overflow-container\" id=\"treeViewContainer\">\n <ng-container *ngFor=\"let column of list; let i = index;\">\n <div class=\"flex-1 felx-col col-container containers{{list.length}}\" id=\"box{{i+1}}Container\">\n <div class=\"category-heading-sticky\">\n <div class=\"category-heading-container\">\n <div class='category-header'>\n <div class=\"category-header-items w-full flex padding-remove\" id=\"box{{i}}Header\">\n <span class=\"flex gap-1 mat-body-1\">\n <ng-container *ngIf=\"column?.config?.iconEnabled\">\n <mat-icon [ngStyle]=\"{'color':column.config.color}\">{{column.config.icon}}</mat-icon>\n </ng-container>\n <!-- {{column.name}} -->\n {{column?.config?.categoryDisplayName || column.name }}\n <ng-container *ngIf=\"i != 0 && categoryList?.length > 0; else firstColumn\">\n <ng-container *ngIf=\"column.index !== 1\">\n <span class=\"count\">({{getCount(column.code)}})</span>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"column?.config?.levelNameEdit\">\n <button mat-icon-button type=\"button\" class=\"edit-btn flex\" (click)=\"editCategoryName(column, i)\">\n <mat-icon>edit</mat-icon>\n </button>\n </ng-container>\n </span>\n <ng-template #firstColumn>\n <span *ngIf=\"i == 0\" id=\"box{{i+1}}count\" class=\"count\">({{column.children.length}})</span>\n </ng-template>\n <ng-container class=\"\" *ngIf=\"column?.config?.createBtnEnabled && !column?.config?.addOrgEnabled\">\n <button mat-button class=\"add-btn margin-left-auto\" [ngClass]=\"{'button-enabled': configCodeBtn== column?.code, 'button-disabled': configCodeBtn!== column?.code}\"\n (click)=\"openCreateTermDialog(column, i)\" type=\"button\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </ng-container>\n <ng-container *ngIf=\"column?.config?.addOrgEnabled && !column?.config?.createBtnEnabled\">\n <button mat-button class=\"add-btn margin-left-auto\" (click)=\"openOrganizationDialog(column, i)\" type=\"button\" \n [ngClass]=\"{'button-enabled': isCurrentOrNextTerm(column, i), 'button-disabled': !isCurrentOrNextTerm(column, i)}\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </ng-container>\n <div class=\"arrow\" id=\"box{{i+1}}count\"></div>\n </div>\n </div>\n <!-- <div>\n Put search button here in future\n </div> -->\n </div>\n </div>\n <!-- {{column.code}} -->\n <div class=\"padding-x2 cat-columns container-box\" id=\"box{{i+1}}\">\n <ng-container *ngIf=\"column?.children && column?.children.length > 0\">\n <lib-tree-column-view *ngIf=\"loaded[column.code]\" #selectedTaxonomyTerm [column]=\"column\"\n [containerId]=\"'box'+(i+1)\" (updateTaxonomyTerm)=\"updateTaxonomyTerm($event)\"\n (updateTermList)=\"updateDraftStatusTerms($event)\" (cardsCount)=\"getNoOfCards($event)\" \n (retireTermData)=\"removeConnection($event)\" (cardAction)=\"cardActionEmit($event)\">\n </lib-tree-column-view>\n </ng-container>\n <ng-container *ngIf=\"shouldShowSvgBorderWrapper(column, i)\">\n <div class=\"svg-border-wrapper\">\n <svg width=\"100%\" height=\"100%\">\n <rect x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" fill=\"none\" stroke=\"#1B213352\" stroke-width=\"2\" \n stroke-dasharray=\"20, 10\" rx=\"10\" ry=\"10\"/>\n </svg>\n <div class=\"content flex flex-col w-full\">\n <div class=\"icon-container\">\n <mat-icon svgIcon=\"frac-no-connection\"></mat-icon>\n </div>\n <label>Select an organization to add or see further connections</label>\n <button mat-button class=\"add-btn\" (click)=\"openOrganizationDialog(column, i)\" type=\"button\" \n [ngClass]=\"{'button-enabled': isCurrentOrNextTerm(column, i), 'button-disabled': !isCurrentOrNextTerm(column, i)}\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </div>\n </div>\n </ng-container>\n </div>\n </div>\n </ng-container>\n <lib-action-bar *ngIf=\"showActionBar\" [actionType]=\"isApprovalView\" [configType]=\"workFlowStatus\"\n (sendApproval)=\"sendForApproval()\" (closeAction)=\"closeActionBar($event)\"></lib-action-bar>\n</div>\n<div *ngIf=\"!(list && list.length > 0 ) && isFraworkLoading\" class=\"flex heightFix \">\n <h1 i18n>{{app_strings.loading}}</h1>\n</div>", styles: [".connectionSettings{flex-direction:row-reverse;z-index:40;position:fixed;padding:0 4px 4px 0;bottom:0;right:0}.flex{display:flex}.w-full{width:100%;align-items:center;display:flex}.w-full.addCardButton{padding:.25em .8em;text-align:left;border:2px dotted #b1b1b1;color:#666;border-radius:8px}.w-full.addCardButton .mat-icon{position:absolute;top:0%;right:3%;height:100%;display:flex;align-items:center}.w-full .button-enabled{opacity:1;pointer-events:auto}.w-full .button-disabled{opacity:.5;pointer-events:none}.w-full.addCardButtonNew{padding:8px 12px;text-align:center;border-radius:24px;height:24px;background:#1b4ca1;color:#fff!important}.w-full.addCardButtonNew .mat-icon-custom{font-size:21px}.w-full.addCardButtonNew:disabled{opacity:.6}.mb1{margin-bottom:1em}flex-center{flex-wrap:nowrap;align-items:start;justify-content:center}.flex-1{flex:1}.felx-col{flex-direction:column}.padding-x2{padding:0 2.5em}.heightFix{height:100%;width:100%;justify-content:space-around;position:relative}.cat-columns{position:relative;height:inherit}.col-container{height:inherit;min-width:350px}.category-heading-sticky{top:0;position:sticky;width:100%;background:#fff;margin-bottom:16px;z-index:10}.category-heading-container{box-sizing:content-box;position:relative;display:block;padding:2px 2.5em}.category-heading-container .category-header{display:flex;align-items:center}.category-heading-container .category-header-items{display:flex;align-items:center;padding:0 10px}.category-heading-container .category-header h4{padding:0 10px;color:#00000080}.category-heading-container .category-header .count{padding:0 2px}.category-heading-container .category-header .category-header-items{font-size:12px;font-weight:600;font-family:Lato;color:#7c7c7c}.cat-columns:hover{overflow-y:scroll}.container-box{overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none;height:calc(100% - 70px)}.container-box::-webkit-scrollbar{width:0;height:0}.spinner{position:fixed;display:flex;top:50%;left:50%}.arrow{left:30px;position:relative}@media only screen and (max-width: 1024px){::ng-deep mat-checkbox .mat-checkbox-inner-container{height:.8em;width:.8em}}@media only screen and (max-width: 1024px){.containers4{max-width:250px;font-size:10px}.containers5{max-width:230px}.containers6{max-width:150px}.containers7{max-width:100px}.w-full{height:3.5em}.w-full.mat-stroked-button{font-size:8px}.padding-x2,.category-heading-container{padding:0 2em}mat-icon{font-size:12px;width:1.25em;height:1.25em}.connectionSettings .mat-raised-button{min-width:auto;padding:0 .5em;line-height:2em}}@media only screen and (max-width: 992px){.containers4{max-width:220px;font-size:9px}.padding-x2,.category-heading-container{padding:0 1.5em}}@media only screen and (max-width: 768px){.containers4{max-width:165px;font-size:8px}.w-full{height:2.5em}.padding-x2,.category-heading-container{padding:0 1em}mat-icon{font-size:8px;width:1em;height:1em}.connectionSettings .mat-raised-button{min-width:auto;padding:0 .3em;line-height:1.5em}}.add-btn{height:24px;background:#1b4ca1;color:#fff!important;display:flex;flex-direction:row-reverse;justify-content:space-between;border-radius:12px}.overflow-container{width:100%;max-width:calc(100vw - 340px);overflow-x:auto;white-space:nowrap}.svg-border-wrapper{position:relative;width:100%;height:95%;min-height:100px}.svg-border-wrapper .content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.content{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;text-align:center}.content label{max-width:90%;margin:10px 0;font-size:16px;line-height:1.4;color:#000000b3;white-space:normal;word-wrap:break-word;font-weight:700}.icon-container{background:#0000000a;position:relative;width:40px;height:40px;border-radius:5px}.icon-container mat-icon{width:30px;height:30px;margin:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.edit-btn{width:24px;height:24px;padding:0;display:flex;align-items:center;justify-content:center;position:relative}.edit-btn mat-icon{font-size:16px;position:absolute;top:50%;height:16px;left:50%;width:16px;transform:translate(-50%,-50%)}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TreeColumnViewComponent, selector: "lib-tree-column-view", inputs: ["column", "containerId"], outputs: ["updateTaxonomyTerm", "updateTermList", "cardsCount", "cardAction"] }, { kind: "component", type: ActionBarComponent, selector: "lib-action-bar", inputs: ["actionType", "configType"], outputs: ["sendApproval", "closeAction"] }] }); }
|
|
11529
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TreeViewComponent, selector: "lib-tree-view", inputs: { approvalList: "approvalList", isApprovalView: "isApprovalView", workFlowStatus: "workFlowStatus", environment: "environment", taxonomyConfig: "taxonomyConfig", orgSelectedData: "orgSelectedData" }, outputs: { sentForApprove: "sentForApprove", loaderEnable: "loaderEnable", manageOrg: "manageOrg" }, usesOnChanges: true, ngImport: i0, template: "<!-- <div class=\"flex flex-1 connectionSettings\">\n <button mat-raised-button color=\"accent\" (click)=\"newConnection()\">\n <mat-icon>{{app_strings.build}}</mat-icon>\n </button>\n</div> -->\n\n<div *ngIf=\"list && list.length > 0\" class=\"flex heightFix overflow-container\" id=\"treeViewContainer\">\n <ng-container *ngFor=\"let column of list; let i = index;\">\n <div class=\"flex-1 flex-col col-container containers{{list.length}}\" id=\"box{{i+1}}Container\">\n <div class=\"category-heading-sticky\">\n <div class=\"category-heading-container\">\n <div class='category-header'>\n <div class=\"category-header-items w-full flex padding-remove\" id=\"box{{i}}Header\">\n <span class=\"flex gap-1 mat-body-1\">\n <ng-container *ngIf=\"column?.config?.iconEnabled\">\n <mat-icon [ngStyle]=\"{'color':column.config.color}\">{{column.config.icon}}</mat-icon>\n </ng-container>\n <!-- {{column.name}} -->\n {{column?.config?.categoryDisplayName || column.name }}\n <ng-container *ngIf=\"i != 0 && categoryList?.length > 0; else firstColumn\">\n <ng-container *ngIf=\"column.index !== 1\">\n <span class=\"count\">({{getCount(column.code)}})</span>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"column?.config?.levelNameEdit\">\n <button mat-icon-button type=\"button\" class=\"edit-btn flex\" (click)=\"editCategoryName(column, i)\">\n <mat-icon>edit</mat-icon>\n </button>\n </ng-container>\n </span>\n <ng-template #firstColumn>\n <span *ngIf=\"i == 0\" id=\"box{{i+1}}count\" class=\"count\">({{column.children.length}})</span>\n </ng-template>\n <ng-container class=\"\" *ngIf=\"column?.config?.createBtnEnabled && !column?.config?.addOrgEnabled\">\n <button mat-button class=\"add-btn margin-left-auto\" [ngClass]=\"{'button-enabled': configCodeBtn== column?.code, 'button-disabled': configCodeBtn!== column?.code}\"\n (click)=\"openCreateTermDialog(column, i)\" type=\"button\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </ng-container>\n <ng-container *ngIf=\"column?.config?.addOrgEnabled && !column?.config?.createBtnEnabled\">\n <button mat-button class=\"add-btn margin-left-auto\" (click)=\"openOrganizationDialog(column, i)\" type=\"button\" \n [ngClass]=\"{'button-enabled': isCurrentOrNextTerm(column, i), 'button-disabled': !isCurrentOrNextTerm(column, i)}\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </ng-container>\n <div class=\"arrow\" id=\"box{{i+1}}count\"></div>\n </div>\n </div>\n <!-- <div>\n Put search button here in future\n </div> -->\n </div>\n </div>\n <!-- {{column.code}} -->\n <div class=\"padding-x2 cat-columns container-box\" id=\"box{{i+1}}\">\n <ng-container *ngIf=\"column?.children && column?.children.length > 0\">\n <lib-tree-column-view *ngIf=\"loaded[column.code]\" #selectedTaxonomyTerm [column]=\"column\"\n [containerId]=\"'box'+(i+1)\" (updateTaxonomyTerm)=\"updateTaxonomyTerm($event)\"\n (updateTermList)=\"updateDraftStatusTerms($event)\" (cardsCount)=\"getNoOfCards($event)\" \n (retireTermData)=\"removeConnection($event)\" (cardAction)=\"cardActionEmit($event)\">\n </lib-tree-column-view>\n </ng-container>\n <ng-container *ngIf=\"shouldShowSvgBorderWrapper(column, i)\">\n <div class=\"svg-border-wrapper\">\n <svg width=\"100%\" height=\"100%\">\n <rect x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" fill=\"none\" stroke=\"#1B213352\" stroke-width=\"2\" \n stroke-dasharray=\"20, 10\" rx=\"10\" ry=\"10\"/>\n </svg>\n <div class=\"content flex flex-col w-full\">\n <div class=\"icon-container\">\n <mat-icon svgIcon=\"frac-no-connection\"></mat-icon>\n </div>\n <label>Select an organization to add or see further connections</label>\n <button mat-button class=\"add-btn\" (click)=\"openOrganizationDialog(column, i)\" type=\"button\" \n [ngClass]=\"{'button-enabled': isCurrentOrNextTerm(column, i), 'button-disabled': !isCurrentOrNextTerm(column, i)}\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </div>\n </div>\n </ng-container>\n </div>\n </div>\n </ng-container>\n <lib-action-bar *ngIf=\"showActionBar\" [actionType]=\"isApprovalView\" [configType]=\"workFlowStatus\"\n (sendApproval)=\"sendForApproval()\" (closeAction)=\"closeActionBar($event)\"></lib-action-bar>\n</div>\n<div *ngIf=\"!(list && list.length > 0 ) && isFraworkLoading\" class=\"flex heightFix \">\n <h1 i18n>{{app_strings.loading}}</h1>\n</div>", styles: [".connectionSettings{flex-direction:row-reverse;z-index:40;position:fixed;padding:0 4px 4px 0;bottom:0;right:0}.flex{display:flex}.w-full{width:100%;align-items:center;display:flex}.w-full.addCardButton{padding:.25em .8em;text-align:left;border:2px dotted #b1b1b1;color:#666;border-radius:8px}.w-full.addCardButton .mat-icon{position:absolute;top:0%;right:3%;height:100%;display:flex;align-items:center}.w-full .button-enabled{opacity:1;pointer-events:auto}.w-full .button-disabled{opacity:.5;pointer-events:none}.w-full.addCardButtonNew{padding:8px 12px;text-align:center;border-radius:24px;height:24px;background:#1b4ca1;color:#fff!important}.w-full.addCardButtonNew .mat-icon-custom{font-size:21px}.w-full.addCardButtonNew:disabled{opacity:.6}.mb1{margin-bottom:1em}flex-center{flex-wrap:nowrap;align-items:start;justify-content:center}.flex-1{flex:1}.felx-col{flex-direction:column}.padding-x2{padding:0 2.5em}.heightFix{height:100%;width:100%;justify-content:space-around;position:relative}.cat-columns{position:relative;height:inherit}.col-container{display:flex;flex-direction:column;height:inherit;min-width:350px;max-width:300px}.category-heading-sticky{position:sticky;top:0;z-index:10;width:100%;background-color:#fff;margin-bottom:16px}.category-heading-container{box-sizing:content-box;position:relative;display:block;padding:2px 2.5em}.category-heading-container .category-header{display:flex;align-items:center}.category-heading-container .category-header-items{display:flex;align-items:center;padding:0 10px}.category-heading-container .category-header h4{padding:0 10px;color:#00000080}.category-heading-container .category-header .count{padding:0 2px}.category-heading-container .category-header .category-header-items{font-size:12px;font-weight:600;font-family:Lato;color:#7c7c7c}.cat-columns:hover{overflow-y:scroll}.container-box{overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none;height:calc(100% - 70px)}.container-box::-webkit-scrollbar{width:0;height:0}.spinner{position:fixed;display:flex;top:50%;left:50%}.arrow{left:30px;position:relative}@media only screen and (max-width: 1024px){::ng-deep mat-checkbox .mat-checkbox-inner-container{height:.8em;width:.8em}}@media only screen and (max-width: 1024px){.containers4{max-width:250px;font-size:10px}.containers5{max-width:230px}.containers6{max-width:150px}.containers7{max-width:100px}.w-full{height:3.5em}.w-full.mat-stroked-button{font-size:8px}.padding-x2,.category-heading-container{padding:0 2em}mat-icon{font-size:12px;width:1.25em;height:1.25em}.connectionSettings .mat-raised-button{min-width:auto;padding:0 .5em;line-height:2em}}@media only screen and (max-width: 992px){.containers4{max-width:220px;font-size:9px}.padding-x2,.category-heading-container{padding:0 1.5em}}@media only screen and (max-width: 768px){.containers4{max-width:165px;font-size:8px}.w-full{height:2.5em}.padding-x2,.category-heading-container{padding:0 1em}mat-icon{font-size:8px;width:1em;height:1em}.connectionSettings .mat-raised-button{min-width:auto;padding:0 .3em;line-height:1.5em}}.add-btn{height:24px;background:#1b4ca1;color:#fff!important;display:flex;flex-direction:row-reverse;justify-content:space-between;border-radius:12px}.overflow-container{width:100%;max-width:calc(100vw - 340px);overflow-x:auto;overflow-y:hidden;white-space:nowrap}.svg-border-wrapper{position:relative;width:100%;height:95%;min-height:100px}.svg-border-wrapper .content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.content{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;text-align:center}.content label{max-width:90%;margin:10px 0;font-size:16px;line-height:1.4;color:#000000b3;white-space:normal;word-wrap:break-word;font-weight:700}.icon-container{background:#0000000a;position:relative;width:40px;height:40px;border-radius:5px}.icon-container mat-icon{width:30px;height:30px;margin:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.edit-btn{width:24px;height:24px;padding:0;display:flex;align-items:center;justify-content:center;position:relative}.edit-btn mat-icon{font-size:16px;position:absolute;top:50%;height:16px;left:50%;width:16px;transform:translate(-50%,-50%)}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TreeColumnViewComponent, selector: "lib-tree-column-view", inputs: ["column", "containerId"], outputs: ["updateTaxonomyTerm", "updateTermList", "cardsCount", "cardAction"] }, { kind: "component", type: ActionBarComponent, selector: "lib-action-bar", inputs: ["actionType", "configType"], outputs: ["sendApproval", "closeAction"] }] }); }
|
|
11487
11530
|
}
|
|
11488
11531
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TreeViewComponent, decorators: [{
|
|
11489
11532
|
type: Component,
|
|
11490
|
-
args: [{ selector: 'lib-tree-view', template: "<!-- <div class=\"flex flex-1 connectionSettings\">\n <button mat-raised-button color=\"accent\" (click)=\"newConnection()\">\n <mat-icon>{{app_strings.build}}</mat-icon>\n </button>\n</div> -->\n\n<div *ngIf=\"list && list.length > 0\" class=\"flex heightFix overflow-container\" id=\"treeViewContainer\">\n <ng-container *ngFor=\"let column of list; let i = index;\">\n <div class=\"flex-1 felx-col col-container containers{{list.length}}\" id=\"box{{i+1}}Container\">\n <div class=\"category-heading-sticky\">\n <div class=\"category-heading-container\">\n <div class='category-header'>\n <div class=\"category-header-items w-full flex padding-remove\" id=\"box{{i}}Header\">\n <span class=\"flex gap-1 mat-body-1\">\n <ng-container *ngIf=\"column?.config?.iconEnabled\">\n <mat-icon [ngStyle]=\"{'color':column.config.color}\">{{column.config.icon}}</mat-icon>\n </ng-container>\n <!-- {{column.name}} -->\n {{column?.config?.categoryDisplayName || column.name }}\n <ng-container *ngIf=\"i != 0 && categoryList?.length > 0; else firstColumn\">\n <ng-container *ngIf=\"column.index !== 1\">\n <span class=\"count\">({{getCount(column.code)}})</span>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"column?.config?.levelNameEdit\">\n <button mat-icon-button type=\"button\" class=\"edit-btn flex\" (click)=\"editCategoryName(column, i)\">\n <mat-icon>edit</mat-icon>\n </button>\n </ng-container>\n </span>\n <ng-template #firstColumn>\n <span *ngIf=\"i == 0\" id=\"box{{i+1}}count\" class=\"count\">({{column.children.length}})</span>\n </ng-template>\n <ng-container class=\"\" *ngIf=\"column?.config?.createBtnEnabled && !column?.config?.addOrgEnabled\">\n <button mat-button class=\"add-btn margin-left-auto\" [ngClass]=\"{'button-enabled': configCodeBtn== column?.code, 'button-disabled': configCodeBtn!== column?.code}\"\n (click)=\"openCreateTermDialog(column, i)\" type=\"button\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </ng-container>\n <ng-container *ngIf=\"column?.config?.addOrgEnabled && !column?.config?.createBtnEnabled\">\n <button mat-button class=\"add-btn margin-left-auto\" (click)=\"openOrganizationDialog(column, i)\" type=\"button\" \n [ngClass]=\"{'button-enabled': isCurrentOrNextTerm(column, i), 'button-disabled': !isCurrentOrNextTerm(column, i)}\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </ng-container>\n <div class=\"arrow\" id=\"box{{i+1}}count\"></div>\n </div>\n </div>\n <!-- <div>\n Put search button here in future\n </div> -->\n </div>\n </div>\n <!-- {{column.code}} -->\n <div class=\"padding-x2 cat-columns container-box\" id=\"box{{i+1}}\">\n <ng-container *ngIf=\"column?.children && column?.children.length > 0\">\n <lib-tree-column-view *ngIf=\"loaded[column.code]\" #selectedTaxonomyTerm [column]=\"column\"\n [containerId]=\"'box'+(i+1)\" (updateTaxonomyTerm)=\"updateTaxonomyTerm($event)\"\n (updateTermList)=\"updateDraftStatusTerms($event)\" (cardsCount)=\"getNoOfCards($event)\" \n (retireTermData)=\"removeConnection($event)\" (cardAction)=\"cardActionEmit($event)\">\n </lib-tree-column-view>\n </ng-container>\n <ng-container *ngIf=\"shouldShowSvgBorderWrapper(column, i)\">\n <div class=\"svg-border-wrapper\">\n <svg width=\"100%\" height=\"100%\">\n <rect x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" fill=\"none\" stroke=\"#1B213352\" stroke-width=\"2\" \n stroke-dasharray=\"20, 10\" rx=\"10\" ry=\"10\"/>\n </svg>\n <div class=\"content flex flex-col w-full\">\n <div class=\"icon-container\">\n <mat-icon svgIcon=\"frac-no-connection\"></mat-icon>\n </div>\n <label>Select an organization to add or see further connections</label>\n <button mat-button class=\"add-btn\" (click)=\"openOrganizationDialog(column, i)\" type=\"button\" \n [ngClass]=\"{'button-enabled': isCurrentOrNextTerm(column, i), 'button-disabled': !isCurrentOrNextTerm(column, i)}\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </div>\n </div>\n </ng-container>\n </div>\n </div>\n </ng-container>\n <lib-action-bar *ngIf=\"showActionBar\" [actionType]=\"isApprovalView\" [configType]=\"workFlowStatus\"\n (sendApproval)=\"sendForApproval()\" (closeAction)=\"closeActionBar($event)\"></lib-action-bar>\n</div>\n<div *ngIf=\"!(list && list.length > 0 ) && isFraworkLoading\" class=\"flex heightFix \">\n <h1 i18n>{{app_strings.loading}}</h1>\n</div>", styles: [".connectionSettings{flex-direction:row-reverse;z-index:40;position:fixed;padding:0 4px 4px 0;bottom:0;right:0}.flex{display:flex}.w-full{width:100%;align-items:center;display:flex}.w-full.addCardButton{padding:.25em .8em;text-align:left;border:2px dotted #b1b1b1;color:#666;border-radius:8px}.w-full.addCardButton .mat-icon{position:absolute;top:0%;right:3%;height:100%;display:flex;align-items:center}.w-full .button-enabled{opacity:1;pointer-events:auto}.w-full .button-disabled{opacity:.5;pointer-events:none}.w-full.addCardButtonNew{padding:8px 12px;text-align:center;border-radius:24px;height:24px;background:#1b4ca1;color:#fff!important}.w-full.addCardButtonNew .mat-icon-custom{font-size:21px}.w-full.addCardButtonNew:disabled{opacity:.6}.mb1{margin-bottom:1em}flex-center{flex-wrap:nowrap;align-items:start;justify-content:center}.flex-1{flex:1}.felx-col{flex-direction:column}.padding-x2{padding:0 2.5em}.heightFix{height:100%;width:100%;justify-content:space-around;position:relative}.cat-columns{position:relative;height:inherit}.col-container{height:inherit;min-width:350px}.category-heading-sticky{top:0;position:sticky;width:100%;background:#fff;margin-bottom:16px;z-index:10}.category-heading-container{box-sizing:content-box;position:relative;display:block;padding:2px 2.5em}.category-heading-container .category-header{display:flex;align-items:center}.category-heading-container .category-header-items{display:flex;align-items:center;padding:0 10px}.category-heading-container .category-header h4{padding:0 10px;color:#00000080}.category-heading-container .category-header .count{padding:0 2px}.category-heading-container .category-header .category-header-items{font-size:12px;font-weight:600;font-family:Lato;color:#7c7c7c}.cat-columns:hover{overflow-y:scroll}.container-box{overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none;height:calc(100% - 70px)}.container-box::-webkit-scrollbar{width:0;height:0}.spinner{position:fixed;display:flex;top:50%;left:50%}.arrow{left:30px;position:relative}@media only screen and (max-width: 1024px){::ng-deep mat-checkbox .mat-checkbox-inner-container{height:.8em;width:.8em}}@media only screen and (max-width: 1024px){.containers4{max-width:250px;font-size:10px}.containers5{max-width:230px}.containers6{max-width:150px}.containers7{max-width:100px}.w-full{height:3.5em}.w-full.mat-stroked-button{font-size:8px}.padding-x2,.category-heading-container{padding:0 2em}mat-icon{font-size:12px;width:1.25em;height:1.25em}.connectionSettings .mat-raised-button{min-width:auto;padding:0 .5em;line-height:2em}}@media only screen and (max-width: 992px){.containers4{max-width:220px;font-size:9px}.padding-x2,.category-heading-container{padding:0 1.5em}}@media only screen and (max-width: 768px){.containers4{max-width:165px;font-size:8px}.w-full{height:2.5em}.padding-x2,.category-heading-container{padding:0 1em}mat-icon{font-size:8px;width:1em;height:1em}.connectionSettings .mat-raised-button{min-width:auto;padding:0 .3em;line-height:1.5em}}.add-btn{height:24px;background:#1b4ca1;color:#fff!important;display:flex;flex-direction:row-reverse;justify-content:space-between;border-radius:12px}.overflow-container{width:100%;max-width:calc(100vw - 340px);overflow-x:auto;white-space:nowrap}.svg-border-wrapper{position:relative;width:100%;height:95%;min-height:100px}.svg-border-wrapper .content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.content{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;text-align:center}.content label{max-width:90%;margin:10px 0;font-size:16px;line-height:1.4;color:#000000b3;white-space:normal;word-wrap:break-word;font-weight:700}.icon-container{background:#0000000a;position:relative;width:40px;height:40px;border-radius:5px}.icon-container mat-icon{width:30px;height:30px;margin:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.edit-btn{width:24px;height:24px;padding:0;display:flex;align-items:center;justify-content:center;position:relative}.edit-btn mat-icon{font-size:16px;position:absolute;top:50%;height:16px;left:50%;width:16px;transform:translate(-50%,-50%)}\n"] }]
|
|
11533
|
+
args: [{ selector: 'lib-tree-view', template: "<!-- <div class=\"flex flex-1 connectionSettings\">\n <button mat-raised-button color=\"accent\" (click)=\"newConnection()\">\n <mat-icon>{{app_strings.build}}</mat-icon>\n </button>\n</div> -->\n\n<div *ngIf=\"list && list.length > 0\" class=\"flex heightFix overflow-container\" id=\"treeViewContainer\">\n <ng-container *ngFor=\"let column of list; let i = index;\">\n <div class=\"flex-1 flex-col col-container containers{{list.length}}\" id=\"box{{i+1}}Container\">\n <div class=\"category-heading-sticky\">\n <div class=\"category-heading-container\">\n <div class='category-header'>\n <div class=\"category-header-items w-full flex padding-remove\" id=\"box{{i}}Header\">\n <span class=\"flex gap-1 mat-body-1\">\n <ng-container *ngIf=\"column?.config?.iconEnabled\">\n <mat-icon [ngStyle]=\"{'color':column.config.color}\">{{column.config.icon}}</mat-icon>\n </ng-container>\n <!-- {{column.name}} -->\n {{column?.config?.categoryDisplayName || column.name }}\n <ng-container *ngIf=\"i != 0 && categoryList?.length > 0; else firstColumn\">\n <ng-container *ngIf=\"column.index !== 1\">\n <span class=\"count\">({{getCount(column.code)}})</span>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"column?.config?.levelNameEdit\">\n <button mat-icon-button type=\"button\" class=\"edit-btn flex\" (click)=\"editCategoryName(column, i)\">\n <mat-icon>edit</mat-icon>\n </button>\n </ng-container>\n </span>\n <ng-template #firstColumn>\n <span *ngIf=\"i == 0\" id=\"box{{i+1}}count\" class=\"count\">({{column.children.length}})</span>\n </ng-template>\n <ng-container class=\"\" *ngIf=\"column?.config?.createBtnEnabled && !column?.config?.addOrgEnabled\">\n <button mat-button class=\"add-btn margin-left-auto\" [ngClass]=\"{'button-enabled': configCodeBtn== column?.code, 'button-disabled': configCodeBtn!== column?.code}\"\n (click)=\"openCreateTermDialog(column, i)\" type=\"button\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </ng-container>\n <ng-container *ngIf=\"column?.config?.addOrgEnabled && !column?.config?.createBtnEnabled\">\n <button mat-button class=\"add-btn margin-left-auto\" (click)=\"openOrganizationDialog(column, i)\" type=\"button\" \n [ngClass]=\"{'button-enabled': isCurrentOrNextTerm(column, i), 'button-disabled': !isCurrentOrNextTerm(column, i)}\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </ng-container>\n <div class=\"arrow\" id=\"box{{i+1}}count\"></div>\n </div>\n </div>\n <!-- <div>\n Put search button here in future\n </div> -->\n </div>\n </div>\n <!-- {{column.code}} -->\n <div class=\"padding-x2 cat-columns container-box\" id=\"box{{i+1}}\">\n <ng-container *ngIf=\"column?.children && column?.children.length > 0\">\n <lib-tree-column-view *ngIf=\"loaded[column.code]\" #selectedTaxonomyTerm [column]=\"column\"\n [containerId]=\"'box'+(i+1)\" (updateTaxonomyTerm)=\"updateTaxonomyTerm($event)\"\n (updateTermList)=\"updateDraftStatusTerms($event)\" (cardsCount)=\"getNoOfCards($event)\" \n (retireTermData)=\"removeConnection($event)\" (cardAction)=\"cardActionEmit($event)\">\n </lib-tree-column-view>\n </ng-container>\n <ng-container *ngIf=\"shouldShowSvgBorderWrapper(column, i)\">\n <div class=\"svg-border-wrapper\">\n <svg width=\"100%\" height=\"100%\">\n <rect x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" fill=\"none\" stroke=\"#1B213352\" stroke-width=\"2\" \n stroke-dasharray=\"20, 10\" rx=\"10\" ry=\"10\"/>\n </svg>\n <div class=\"content flex flex-col w-full\">\n <div class=\"icon-container\">\n <mat-icon svgIcon=\"frac-no-connection\"></mat-icon>\n </div>\n <label>Select an organization to add or see further connections</label>\n <button mat-button class=\"add-btn\" (click)=\"openOrganizationDialog(column, i)\" type=\"button\" \n [ngClass]=\"{'button-enabled': isCurrentOrNextTerm(column, i), 'button-disabled': !isCurrentOrNextTerm(column, i)}\">\n <span>Add</span>\n <mat-icon class=\"margin-remove\">\n {{app_strings.add}}\n </mat-icon>\n </button>\n </div>\n </div>\n </ng-container>\n </div>\n </div>\n </ng-container>\n <lib-action-bar *ngIf=\"showActionBar\" [actionType]=\"isApprovalView\" [configType]=\"workFlowStatus\"\n (sendApproval)=\"sendForApproval()\" (closeAction)=\"closeActionBar($event)\"></lib-action-bar>\n</div>\n<div *ngIf=\"!(list && list.length > 0 ) && isFraworkLoading\" class=\"flex heightFix \">\n <h1 i18n>{{app_strings.loading}}</h1>\n</div>", styles: [".connectionSettings{flex-direction:row-reverse;z-index:40;position:fixed;padding:0 4px 4px 0;bottom:0;right:0}.flex{display:flex}.w-full{width:100%;align-items:center;display:flex}.w-full.addCardButton{padding:.25em .8em;text-align:left;border:2px dotted #b1b1b1;color:#666;border-radius:8px}.w-full.addCardButton .mat-icon{position:absolute;top:0%;right:3%;height:100%;display:flex;align-items:center}.w-full .button-enabled{opacity:1;pointer-events:auto}.w-full .button-disabled{opacity:.5;pointer-events:none}.w-full.addCardButtonNew{padding:8px 12px;text-align:center;border-radius:24px;height:24px;background:#1b4ca1;color:#fff!important}.w-full.addCardButtonNew .mat-icon-custom{font-size:21px}.w-full.addCardButtonNew:disabled{opacity:.6}.mb1{margin-bottom:1em}flex-center{flex-wrap:nowrap;align-items:start;justify-content:center}.flex-1{flex:1}.felx-col{flex-direction:column}.padding-x2{padding:0 2.5em}.heightFix{height:100%;width:100%;justify-content:space-around;position:relative}.cat-columns{position:relative;height:inherit}.col-container{display:flex;flex-direction:column;height:inherit;min-width:350px;max-width:300px}.category-heading-sticky{position:sticky;top:0;z-index:10;width:100%;background-color:#fff;margin-bottom:16px}.category-heading-container{box-sizing:content-box;position:relative;display:block;padding:2px 2.5em}.category-heading-container .category-header{display:flex;align-items:center}.category-heading-container .category-header-items{display:flex;align-items:center;padding:0 10px}.category-heading-container .category-header h4{padding:0 10px;color:#00000080}.category-heading-container .category-header .count{padding:0 2px}.category-heading-container .category-header .category-header-items{font-size:12px;font-weight:600;font-family:Lato;color:#7c7c7c}.cat-columns:hover{overflow-y:scroll}.container-box{overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none;height:calc(100% - 70px)}.container-box::-webkit-scrollbar{width:0;height:0}.spinner{position:fixed;display:flex;top:50%;left:50%}.arrow{left:30px;position:relative}@media only screen and (max-width: 1024px){::ng-deep mat-checkbox .mat-checkbox-inner-container{height:.8em;width:.8em}}@media only screen and (max-width: 1024px){.containers4{max-width:250px;font-size:10px}.containers5{max-width:230px}.containers6{max-width:150px}.containers7{max-width:100px}.w-full{height:3.5em}.w-full.mat-stroked-button{font-size:8px}.padding-x2,.category-heading-container{padding:0 2em}mat-icon{font-size:12px;width:1.25em;height:1.25em}.connectionSettings .mat-raised-button{min-width:auto;padding:0 .5em;line-height:2em}}@media only screen and (max-width: 992px){.containers4{max-width:220px;font-size:9px}.padding-x2,.category-heading-container{padding:0 1.5em}}@media only screen and (max-width: 768px){.containers4{max-width:165px;font-size:8px}.w-full{height:2.5em}.padding-x2,.category-heading-container{padding:0 1em}mat-icon{font-size:8px;width:1em;height:1em}.connectionSettings .mat-raised-button{min-width:auto;padding:0 .3em;line-height:1.5em}}.add-btn{height:24px;background:#1b4ca1;color:#fff!important;display:flex;flex-direction:row-reverse;justify-content:space-between;border-radius:12px}.overflow-container{width:100%;max-width:calc(100vw - 340px);overflow-x:auto;overflow-y:hidden;white-space:nowrap}.svg-border-wrapper{position:relative;width:100%;height:95%;min-height:100px}.svg-border-wrapper .content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.content{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;text-align:center}.content label{max-width:90%;margin:10px 0;font-size:16px;line-height:1.4;color:#000000b3;white-space:normal;word-wrap:break-word;font-weight:700}.icon-container{background:#0000000a;position:relative;width:40px;height:40px;border-radius:5px}.icon-container mat-icon{width:30px;height:30px;margin:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.edit-btn{width:24px;height:24px;padding:0;display:flex;align-items:center;justify-content:center;position:relative}.edit-btn mat-icon{font-size:16px;position:absolute;top:50%;height:16px;left:50%;width:16px;transform:translate(-50%,-50%)}\n"] }]
|
|
11491
11534
|
}], ctorParameters: function () { return [{ type: FrameworkService }, { type: LocalConnectionService }, { type: i1$3.MatLegacyDialog }, { type: ApprovalService }, { type: i5$2.MatLegacySnackBar }, { type: ConnectorService }, { type: i0.ChangeDetectorRef }, { type: TreeHierarchyService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { approvalList: [{
|
|
11492
11535
|
type: Input
|
|
11493
11536
|
}], isApprovalView: [{
|