catalog-ui/src/app/ng2/pages/workspace/deployment-artifacts/deployment-artifacts-page.component.ts

   1 import { Component, OnInit, ViewChild } from '@angular/core';
   2 import { Select, Store } from '@ngxs/store';
   3 import { ArtifactModel } from 'app/models';
   4 import * as _ from 'lodash';
   5 import { SdcUiCommon, SdcUiComponents, SdcUiServices } from 'onap-ui-angular';
   6 import { Observable } from 'rxjs/index';
   7 import { map } from 'rxjs/operators';
   8 import { GabConfig } from '../../../../models/gab-config';
   9 import { PathsAndNamesDefinition } from '../../../../models/paths-and-names';
  10 import { GenericArtifactBrowserComponent } from '../../../../ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component';
  11 import { ArtifactGroupType, ArtifactType } from '../../../../utils/constants';
  12 import { ArtifactsService } from '../../../components/forms/artifacts-form/artifacts.service';
  13 import { PopoverContentComponent } from '../../../components/ui/popover/popover-content.component';
  14 import { CacheService } from '../../../services/cache.service';
  15 import { TranslateService } from '../../../shared/translator/translate.service';
  16 import { GetArtifactsByTypeAction } from '../../../store/actions/artifacts.action';
  17 import { ArtifactsState } from '../../../store/states/artifacts.state';
  18 import { WorkspaceState, WorkspaceStateModel } from '../../../store/states/workspace.state';
  19 import { WorkspaceService } from '../workspace.service';
  20 import { ModalService } from 'app/ng2/services/modal.service';
  21
  22 export interface IPoint {
  23     x: number;
  24     y: number;
  25 }
  26
  27 @Component({
  28     selector: 'deployment-artifact-page',
  29     templateUrl: './deployment-artifacts-page.component.html',
  30     styleUrls: ['./deployment-artifacts-page.component.less', '../../../../../assets/styles/table-style.less']
  31 })
  32 export class DeploymentArtifactsPageComponent implements OnInit {
  33
  34     public componentId: string;
  35     public componentType: string;
  36     public deploymentArtifacts$: Observable<ArtifactModel[]>;
  37     public isComponentInstanceSelected: boolean;
  38
  39     @Select(WorkspaceState) workspaceState$: Observable<WorkspaceStateModel>;
  40     @ViewChild('informationArtifactsTable') table: any;
  41     @ViewChild('popoverForm') popoverContentComponent: PopoverContentComponent;
  42
  43     constructor(private workspaceService: WorkspaceService,
  44                 private artifactsService: ArtifactsService,
  45                 private store: Store,
  46                 private popoverService: SdcUiServices.PopoverService,
  47                 private cacheService: CacheService,
  48                 private modalService: SdcUiServices.ModalService,
  49                 private translateService: TranslateService) {
  50     }
  51
  52     private getEnvArtifact = (heatArtifact: ArtifactModel, artifacts: ArtifactModel[]): ArtifactModel => {
  53         return _.find(artifacts, (item: ArtifactModel) => {
  54             return item.generatedFromId === heatArtifact.uniqueId;
  55         });
  56     };
  57
  58     // we need to sort the artifact in a way that the env artifact is always under the artifact he is connected to- this is cause of the way the ngx databale work
  59     private sortArtifacts = ((artifacts) => {
  60         const sortedArtifacts = [];
  61         _.forEach(artifacts, (artifact: ArtifactModel): void => {
  62             const envArtifact = this.getEnvArtifact(artifact, artifacts);
  63             if (!artifact.generatedFromId) {
  64                 sortedArtifacts.push(artifact);
  65             }
  66             if (envArtifact) {
  67                 sortedArtifacts.push(envArtifact);
  68             }
  69         });
  70         return sortedArtifacts;
  71     })
  72
  73     ngOnInit(): void {
  74         this.componentId = this.workspaceService.metadata.uniqueId;
  75         this.componentType = this.workspaceService.metadata.componentType;
  76
  77         this.store.dispatch(new GetArtifactsByTypeAction({
  78             componentType: this.componentType,
  79             componentId: this.componentId,
  80             artifactType: ArtifactGroupType.DEPLOYMENT
  81         }));
  82         this.deploymentArtifacts$ = this.store.select(ArtifactsState.getArtifactsByType).pipe(map((filterFn) => filterFn(ArtifactType.DEPLOYMENT))).pipe(map(artifacts => {
  83             return this.sortArtifacts(artifacts);
  84         }));
  85     }
  86
  87     onActivate(event) {
  88         if (event.type === 'click') {
  89             this.table.rowDetail.toggleExpandRow(event.row);
  90         }
  91     }
  92
  93     public addOrUpdateArtifact = (artifact: ArtifactModel, isViewOnly: boolean) => {
  94         this.artifactsService.openArtifactModal(this.componentId, this.componentType, artifact, ArtifactGroupType.DEPLOYMENT, isViewOnly);
  95     }
  96
  97     public deleteArtifact = (artifactToDelete) => {
  98         this.artifactsService.deleteArtifact(this.componentType, this.componentId, artifactToDelete);
  99     }
 100
 101     private openPopOver = (title: string, content: string, positionOnPage: IPoint, location: string) => {
 102         this.popoverService.createPopOver(title, content, positionOnPage, location);
 103     }
 104
 105     public updateEnvParams = (artifact: ArtifactModel, isViewOnly: boolean) => {
 106         this.artifactsService.openUpdateEnvParams(this.componentType, this.componentId, artifact );
 107     }
 108
 109     private openGenericArtifactBrowserModal = (artifact: ArtifactModel): void => {
 110         const titleStr = 'Generic Artifact Browser';
 111         const modalConfig = {
 112             size: 'sdc-xl',
 113             title: titleStr,
 114             type: SdcUiCommon.ModalType.custom,
 115             buttons: [{
 116                 id: 'closeGABButton',
 117                 text: 'Close',
 118                 size: 'sm',
 119                 closeModal: true
 120             }] as SdcUiCommon.IModalButtonComponent[]
 121         };
 122
 123         const uiConfiguration: any = this.cacheService.get('UIConfiguration');
 124         let noConfig: boolean = false;
 125         let pathsandnamesArr: PathsAndNamesDefinition[] = [];
 126
 127         if (typeof uiConfiguration.gab === 'undefined') {
 128             noConfig = true;
 129         } else {
 130             const gabConfig: GabConfig = uiConfiguration.gab
 131                 .find((config) => config.artifactType === artifact.artifactType);
 132             if (typeof gabConfig === 'undefined') {
 133                 noConfig = true;
 134             } else {
 135                 pathsandnamesArr = gabConfig.pathsAndNamesDefinitions;
 136             }
 137         }
 138
 139
 140         if (noConfig) {
 141             const msg = this.translateService.translate('DEPLOYMENT_ARTIFACT_GAB_NO_CONFIG');
 142             this.modalService.openAlertModal(titleStr, msg);
 143         }
 144
 145         const modalInputs = {
 146             pathsandnames: pathsandnamesArr,
 147             artifactid: artifact.esId,
 148             resourceid: this.componentId
 149         };
 150
 151         this.modalService.openCustomModal(modalConfig, GenericArtifactBrowserComponent, modalInputs);
 152
 153     }
 154
 155 }