diff options
Diffstat (limited to 'catalog-ui/src/app/ng2/pages/automated-upgrade')
20 files changed, 839 insertions, 0 deletions
diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-models/ui-component-to-upgrade.ts b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-models/ui-component-to-upgrade.ts new file mode 100644 index 0000000000..97fb71e210 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-models/ui-component-to-upgrade.ts @@ -0,0 +1,103 @@ +import {ComponentState} from "../../../../utils/constants"; +import {IDependenciesServerResponse} from "../../../services/responses/dependencies-server-response"; +import {UiBaseObject} from "../../../../models/ui-models/ui-base-object"; + +/** + * Created by ob0695 on 5/1/2018. + */ +export enum AutomatedUpgradeInstanceType { + VF, SERVICE_PROXY, ALLOTTED_RESOURCE +} +export class ServiceContainerToUpgradeUiObject extends UiBaseObject { + + icon:string; + version:string; + isLock:boolean; // true if service is in check-out or ceritification-in-progress + vspInstances:Array<VspInstanceUiObject>; // list of instances of the vsp contain in the service - intances can be vf, proxy or allotted + isAlreadyUpgrade:boolean; // true if all instances is in latest version + + constructor(componentToUpgrade:IDependenciesServerResponse) { + super(componentToUpgrade.uniqueId, componentToUpgrade.type, componentToUpgrade.name); + this.icon = componentToUpgrade.icon; + this.version = componentToUpgrade.version; + this.isAlreadyUpgrade = true; + this.isLock = componentToUpgrade.state === ComponentState.CERTIFICATION_IN_PROGRESS || componentToUpgrade.state === ComponentState.NOT_CERTIFIED_CHECKOUT; + this.vspInstances = []; + } + + public addVfInstance = (vsp: IDependenciesServerResponse, latestVersion:string):void => { + let isNeededUpgrade = parseInt(vsp.version) < parseInt(latestVersion); + this.vspInstances.push(new VspInstanceUiObject(vsp.uniqueId, vsp.name, vsp.version, vsp.icon)); + if (isNeededUpgrade) { + this.isAlreadyUpgrade = false; + } + } + + public addProxyInstance = (vsp: IDependenciesServerResponse, isNeededUpgrade:boolean, instanceName:string):void => { + this.vspInstances.push(new ProxyVspInstanceUiObject(vsp.uniqueId, vsp.name, vsp.version, vsp.icon, instanceName)); + if (isNeededUpgrade) { + this.isAlreadyUpgrade = false; + } + } + + public addAllottedResourceInstance = (vsp: IDependenciesServerResponse, isNeededUpgrade:boolean, instanceName:string, vfName:string, vfId:string):void => { + this.vspInstances.push(new AllottedResourceInstanceUiObject(vsp.uniqueId, vsp.name, vsp.version, vsp.icon, instanceName, vfName, vfId)); + if (isNeededUpgrade) { + this.isAlreadyUpgrade = false; + } + } + + public addMultipleInstances = (vsp: IDependenciesServerResponse, vspLatestVersion:string, instancesNames:Array<string>, allottedOriginVf: IDependenciesServerResponse):void => { + _.forEach(instancesNames, (instanceName:string) => { + let isNeededUpgrade = parseInt(vsp.version) < parseInt(vspLatestVersion); + if (allottedOriginVf) { + this.addAllottedResourceInstance(vsp, isNeededUpgrade, instanceName, allottedOriginVf.name, allottedOriginVf.uniqueId); + } else { + this.addProxyInstance(vsp, isNeededUpgrade, instanceName); + } + }) + } +} + +export class VspInstanceUiObject { + + vspName:string; + vspVersion:string; + vspId:string; + icon:string; + instanceType:AutomatedUpgradeInstanceType; + + constructor(uniqueId:string, vspName:string, vspVersion:string, icon:string) { + this.vspId = uniqueId; + this.vspName = vspName; + this.vspVersion = vspVersion; + this.icon = icon; + this.instanceType = AutomatedUpgradeInstanceType.VF; + } +} + +export class ProxyVspInstanceUiObject extends VspInstanceUiObject { + + instanceName:string; + + constructor(uniqueId:string, vspName:string, vspVersion:string, icon:string, instanceName: string) { + super(uniqueId, vspName, vspVersion, icon); + this.instanceName = instanceName; + this.instanceType = AutomatedUpgradeInstanceType.SERVICE_PROXY; + } +} + +export class AllottedResourceInstanceUiObject extends VspInstanceUiObject { + + instanceName:string; + originVfName:string; + originVfId:string; + + constructor(uniqueId:string, vspName:string, vspVersion:string, icon:string, instanceName:string, originVfName:string, originVfId:string) { + super(uniqueId, vspName, vspVersion, icon) + this.instanceName = instanceName; + this.originVfId = originVfId; + this.originVfName = originVfName; + this.instanceType = AutomatedUpgradeInstanceType.ALLOTTED_RESOURCE; + } +} diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-status/automated-upgrade-status.component.html b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-status/automated-upgrade-status.component.html new file mode 100644 index 0000000000..12a3b72b92 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-status/automated-upgrade-status.component.html @@ -0,0 +1,10 @@ +<div class="automated-upgrade-component"> + <span innerHTML="{{statusText}}"> </span> + <div class="components-to-upgrade-list"> + <ul> + <li class="components-to-upgrade-list-item " *ngFor="let component of upgradedComponentsList"> + <upgrade-list-status-item [upgradedComponent]="component" [upgradeComponentStatus]="upgradeStatusMap[component.name]"></upgrade-list-status-item> + </li> + </ul> + </div> +</div> diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-status/automated-upgrade-status.component.ts b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-status/automated-upgrade-status.component.ts new file mode 100644 index 0000000000..0bc342ce65 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-status/automated-upgrade-status.component.ts @@ -0,0 +1,24 @@ +/** + * Created by ob0695 on 4/24/2018. + */ +import {Component, Input} from "@angular/core"; +import Dictionary = _.Dictionary; +import {AutomatedUpgradeStatusResponse} from "../../../services/responses/automated-upgrade-response"; +import {ServiceContainerToUpgradeUiObject} from "../automated-upgrade-models/ui-component-to-upgrade"; + +@Component({ + selector: 'automated-upgrade-status', + templateUrl: './automated-upgrade-status.component.html', + styleUrls: ['./../automated-upgrade.component.less'] +}) +export class AutomatedUpgradeStatusComponent { + + @Input() upgradedComponentsList: Array<ServiceContainerToUpgradeUiObject>; + @Input() upgradeStatusMap: Dictionary<AutomatedUpgradeStatusResponse>; + @Input() statusText: string; + + constructor () { + + } + +} diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-inner-content/list-item-inner-content.component.html b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-inner-content/list-item-inner-content.component.html new file mode 100644 index 0000000000..2a03d94c8c --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-inner-content/list-item-inner-content.component.html @@ -0,0 +1,25 @@ +<ul class="list-item-inner-content"> + <li *ngFor="let vspInstance of vspInstances" class="first-line"> + <div [ngSwitch]="vspInstance.instanceType"> + + <div *ngSwitchCase="automatedUpgradeType.VF"> + <upgrade-line-item arrowName="arrow2-right-child" text="{{vspInstance.vspName}} ({{vspInstance.vspVersion}})"></upgrade-line-item> + </div> + + <div *ngSwitchCase="automatedUpgradeType.SERVICE_PROXY"> + <upgrade-line-item arrowName="arrow2-right-child" prefix="Service Proxy: " text="{{vspInstance.instanceName}}"></upgrade-line-item> + <div class="second-line"> + <upgrade-line-item arrowName="arrow2-right-child" icon="{{vspInstance.icon}}" text="{{ vspInstance.vspName }} ({{vspInstance.vspVersion}})"></upgrade-line-item> + </div> + </div> + + <div *ngSwitchCase="automatedUpgradeType.ALLOTTED_RESOURCE"> + <upgrade-line-item class="allotted-resource-line" arrowName="arrow2-right-child" prefix=" VNF: " text="{{vspInstance.originVfName}}"></upgrade-line-item> + <upgrade-line-item arrowName="arrow2-right" prefix=" VFC: " text="{{vspInstance.instanceName}}"></upgrade-line-item> + <div class="second-line"> + <upgrade-line-item arrowName="arrow2-right-child" icon="vspInstance.icon" prefix=" VFC: " text="{{ vspInstance.vspName }} ({{vspInstance.vspVersion}})"></upgrade-line-item> + </div> + </div> + </div> + </li> +</ul>
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-inner-content/list-item-inner-content.component.less b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-inner-content/list-item-inner-content.component.less new file mode 100644 index 0000000000..24f8107e84 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-inner-content/list-item-inner-content.component.less @@ -0,0 +1,25 @@ +@import "./../../../../../../assets/styles/override"; + +.list-item-inner-content { + .first-line { + + padding: 2px 20px 2px 65px; + border-bottom: 1px solid @sdcui_color_silver; + + &:last-child { + border-bottom: none; + } + } + + .second-line { + padding-left: 45px; + font-weight: bold; + } + + .allotted-resource-line { + + float: left; + margin-right: 15px; + + } +}
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-inner-content/list-item-inner-content.component.ts b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-inner-content/list-item-inner-content.component.ts new file mode 100644 index 0000000000..0fa467c3ae --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-inner-content/list-item-inner-content.component.ts @@ -0,0 +1,24 @@ +/** + * Created by ob0695 on 5/7/2018. + */ +/** + * Created by ob0695 on 5/2/2018. + */ +import {Component, Input} from "@angular/core"; +import { + VspInstanceUiObject, + AutomatedUpgradeInstanceType +} from "../../automated-upgrade-models/ui-component-to-upgrade"; + + +@Component({ + selector: 'upgrade-list-item-inner-content', + templateUrl: './list-item-inner-content.component.html', + styleUrls: ['./list-item-inner-content.component.less'] +}) +export class UpgradeListItemInnerContent { + + @Input() vspInstances:Array<VspInstanceUiObject>; + + automatedUpgradeType = AutomatedUpgradeInstanceType; +} diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-order-pipe/list-item-order-pipe.ts b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-order-pipe/list-item-order-pipe.ts new file mode 100644 index 0000000000..abebe0bdd8 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/list-item-order-pipe/list-item-order-pipe.ts @@ -0,0 +1,42 @@ +import {Pipe, PipeTransform} from "@angular/core"; +import {ServiceContainerToUpgradeUiObject} from "../../automated-upgrade-models/ui-component-to-upgrade"; + +/* + This filter needs to return all not upgraded components sorted by name first, after that all upgraded components sorted by name + And in the end all the locked components sorted by name + */ + +@Pipe({ + name: 'upgradeListItemOrderBy' +}) +export class UpgradeListItemOrderPipe implements PipeTransform { + + private orderByName = (firstName:string, secondName:string):number => { + var textA = firstName.toLocaleLowerCase(); + var textB = secondName.toLocaleLowerCase(); + return (textA < textB) ? -1 : (textA > textB) ? 1 : 0; + } + + transform(array:Array<ServiceContainerToUpgradeUiObject>):Array<ServiceContainerToUpgradeUiObject> { + array.sort((first:ServiceContainerToUpgradeUiObject, second:ServiceContainerToUpgradeUiObject) => { + if (first.isLock && second.isLock) { + return this.orderByName(first.name, second.name); + } else if (first.isLock) { + return 1; + } else if (second.isLock) { + return -1; + } else { + if (first.isAlreadyUpgrade && second.isAlreadyUpgrade) { + return this.orderByName(first.name, second.name); + } else if (first.isAlreadyUpgrade) { + return 1; + } else if (second.isAlreadyUpgrade) { + return -1; + } else { + return this.orderByName(first.name, second.name); + } + } + }); + return array; + } +}
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-line-item/upgrade-line-item.component.html b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-line-item/upgrade-line-item.component.html new file mode 100644 index 0000000000..e848283f67 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-line-item/upgrade-line-item.component.html @@ -0,0 +1,6 @@ +<div class="upgrade-line-item"> + <svg-icon *ngIf="arrowName" name="{{arrowName}}" size="medium" mode="secondary"></svg-icon> + <div *ngIf="icon" class="line-item-icon small sprite-services-icons {{icon}}"></div> + <span *ngIf="prefix" class="line-item-prefix">{{prefix}}</span> + <span class="line-item-text">{{text}}</span> +</div>
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-line-item/upgrade-line-item.component.less b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-line-item/upgrade-line-item.component.less new file mode 100644 index 0000000000..d558e881c2 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-line-item/upgrade-line-item.component.less @@ -0,0 +1,17 @@ +.upgrade-line-item{ + + display: flex; + align-items: center; + + .line-item-icon { + margin-left: 10px; + } + + .line-item-prefix { + margin-left: 7px; + } + + .line-item-text { + margin-left: 7px; + } +}
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-line-item/upgrade-line-item.component.ts b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-line-item/upgrade-line-item.component.ts new file mode 100644 index 0000000000..b256d7efe8 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-line-item/upgrade-line-item.component.ts @@ -0,0 +1,19 @@ +import {Component, Input} from "@angular/core"; + +@Component({ + selector: 'upgrade-line-item', + templateUrl: './upgrade-line-item.component.html', + styleUrls: ['./upgrade-line-item.component.less'] +}) + +export class UpgradeLineItemComponent { + + @Input() arrowName:string; + @Input() icon:string; + @Input() prefix:string; + @Input() text:string; + + constructor() { + + } +} diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item-status/upgrade-list-status-item.component.html b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item-status/upgrade-list-status-item.component.html new file mode 100644 index 0000000000..c6d3add7e6 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item-status/upgrade-list-status-item.component.html @@ -0,0 +1,13 @@ +<div class="components-to-upgrade-list-item"> + <div class="component-to-upgrade-data"> + <div class="component-to-upgrade-icon small sprite-services-icons {{upgradedComponent.icon}}"></div> + <span class="component-to-upgrade-name">{{upgradedComponent.name}} ({{upgradedComponent.version}})</span> + <svg-icon-label class="upgraded-component-status" *ngIf="upgradeComponentStatus.status === 'OK'" + name="success-circle-o" mode="success" size="medium" clickable="false"></svg-icon-label> + <svg-icon-label class="upgraded-component-status" *ngIf="upgradeComponentStatus.status !== 'OK'" + name="x-circle-o" mode="error" + size="medium" [label]="'Update Failed'" clickable="false" disabled="false" labelPlacement="left"></svg-icon-label> + </div> + + <upgrade-list-item-inner-content [vspInstances]="upgradedComponent.vspInstances"></upgrade-list-item-inner-content> +</div>
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item-status/upgrade-list-status-item.component.ts b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item-status/upgrade-list-status-item.component.ts new file mode 100644 index 0000000000..726bc67fcf --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item-status/upgrade-list-status-item.component.ts @@ -0,0 +1,19 @@ +import {Component, Input} from "@angular/core"; +import {AutomatedUpgradeStatusResponse} from "../../../../services/responses/automated-upgrade-response"; +import {ServiceContainerToUpgradeUiObject} from "../../automated-upgrade-models/ui-component-to-upgrade"; + +@Component({ + selector: 'upgrade-list-status-item', + templateUrl: './upgrade-list-status-item.component.html', + styleUrls: ['./../upgrade-list-item.component.less'] +}) +export class UpgradeListItemStatusComponent { + + @Input() upgradedComponent: ServiceContainerToUpgradeUiObject; + @Input() upgradeComponentStatus: AutomatedUpgradeStatusResponse; + + constructor () { + + } + +} diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item.component.less b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item.component.less new file mode 100644 index 0000000000..4507929b7f --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item.component.less @@ -0,0 +1,44 @@ +@import "./../../../../../assets/styles/override"; + +.components-to-upgrade-list-item { + border: 1px solid @sdcui_color_light-gray; + box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.11); + margin-bottom: 10px; + line-height: 40px; + + .component-to-upgrade-data { + display: flex; + background-color: @sdcui_color_light-silver; + height: 40px; + padding: 0 10px; + align-items: center; + + .component-to-upgrade-icon { + margin-left: 26px; + } + + .component-to-upgrade-name { + margin-left: 8px; + } + + .component-to-upgrade-checkbox { + height: 24px; // Workaround can not vertical center + } + + .upgraded-component-status { + margin-left: auto; + } + } + + .vsp-data { + align-items: center; + display: flex; + border-bottom: 1px solid @sdcui_color_silver; + padding: 0 10px 0 64px; + .vsp-data-label { + color: @sdcui_color_text-black; + margin-left: 7px; + font-weight: 600; + } + } +}
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item/upgrade-list-item.component.html b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item/upgrade-list-item.component.html new file mode 100644 index 0000000000..6e6af0cd1c --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item/upgrade-list-item.component.html @@ -0,0 +1,19 @@ +<div class="components-to-upgrade-list-item "> + <div class="component-to-upgrade-data"> + <sdc-checkbox class="component-to-upgrade-checkbox" + *ngIf="!componentToUpgrade.isAlreadyUpgrade && !componentToUpgrade.isLock" + [checked]="true" + [disabled]="disabled" + (checkedChange)="onComponentChecked(componentToUpgrade.uniqueId)"> + </sdc-checkbox> + <svg-icon *ngIf="componentToUpgrade.isAlreadyUpgrade" name="success-circle-o" mode="success" + size="medium"></svg-icon> + <svg-icon *ngIf="!componentToUpgrade.isAlreadyUpgrade && componentToUpgrade.isLock" name="locked" mode="info" + size="small"></svg-icon> + <div class="component-to-upgrade-icon small sprite-services-icons {{componentToUpgrade.icon}}"></div> + <span class="component-to-upgrade-name">{{componentToUpgrade.name}} ({{componentToUpgrade.version}})</span> + </div> + + <upgrade-list-item-inner-content [vspInstances]="componentToUpgrade.vspInstances"></upgrade-list-item-inner-content> + +</div>
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item/upgrade-list-item.component.ts b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item/upgrade-list-item.component.ts new file mode 100644 index 0000000000..806b83126f --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade-ui-components/upgrade-list-item/upgrade-list-item.component.ts @@ -0,0 +1,23 @@ +import {Component, Input, Output, EventEmitter} from "@angular/core"; +import {ServiceContainerToUpgradeUiObject, AutomatedUpgradeInstanceType} from "../../automated-upgrade-models/ui-component-to-upgrade"; + +@Component({ + selector: 'upgrade-list-item', + templateUrl: './upgrade-list-item.component.html', + styleUrls: ['./../upgrade-list-item.component.less'] +}) +export class UpgradeListItemComponent { + + @Input() componentToUpgrade:ServiceContainerToUpgradeUiObject; + @Input() disabled: boolean; + @Output() onCheckedChange:EventEmitter<any> = new EventEmitter<any>(); + + constructor() { + } + + onComponentChecked = ():void => { + this.onCheckedChange.emit(); + } + + +} diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.component.html b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.component.html new file mode 100644 index 0000000000..67e7f08436 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.component.html @@ -0,0 +1,25 @@ +<div class="automated-upgrade-component"> + + <div *ngIf="certificationStatusText" class="certification-status"> + <svg-icon-label + name="success-circle-o" + mode="success" + size="medium" + clickable="false" + disabled="false" + labelPlacement="right"> + </svg-icon-label> + <span class="certification-status-text">{{certificationStatusText}}</span> + </div> + + <div> + <span innerHTML="{{informationText}}"> </span> + <div class="components-to-upgrade-list"> + <ul> + <li *ngFor="let component of componentsToUpgrade | upgradeListItemOrderBy"> + <upgrade-list-item (onCheckedChange)= "onComponentSelected(component.uniqueId)" [disabled]="disabled" [componentToUpgrade]="component"></upgrade-list-item> + </li> + </ul> + </div> + </div> +</div>
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.component.less b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.component.less new file mode 100644 index 0000000000..2ab21303d6 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.component.less @@ -0,0 +1,23 @@ +.automated-upgrade-component { + + min-height: 280px; + .certification-status { + border: 1px solid #4ca90c; + border-left: 5px solid #4ca90c; + margin-bottom: 20px; + padding: 5px 5px 5px 10px; + font-weight: bold; + display: flex; + line-height: 21px; + + .certification-status-text { + padding-left: 5px; + } + } + .components-to-upgrade-list { + + overflow: auto; + max-height: 300px; + margin-top: 15px; + } +}
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.component.ts b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.component.ts new file mode 100644 index 0000000000..9ae73497ef --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.component.ts @@ -0,0 +1,65 @@ +/** + * Created by ob0695 on 4/18/2018. + */ +/*- + * ============LICENSE_START======================================================= + * SDC + * ================================================================================ + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * ================================================================================ + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ============LICENSE_END========================================================= + */ + +import {Component, Input, Inject, forwardRef} from "@angular/core"; +import {TranslateService} from "../../shared/translator/translate.service"; +import {ServiceContainerToUpgradeUiObject} from "./automated-upgrade-models/ui-component-to-upgrade"; +import {AutomatedUpgradeService} from "./automated-upgrade.service"; + +@Component({ + selector: 'upgrade-vsp', + templateUrl: './automated-upgrade.component.html', + styleUrls: ['./automated-upgrade.component.less'], + providers: [TranslateService] +}) +export class AutomatedUpgradeComponent { + + @Input() componentsToUpgrade: Array<ServiceContainerToUpgradeUiObject>; + @Input() certificationStatusText: string; + @Input() informationText: string; + @Input() disabled: string; + private selectedComponentsToUpgrade: Array<string> = []; + + constructor (@Inject(forwardRef(() => AutomatedUpgradeService)) private automatedUpgradeService: AutomatedUpgradeService) { + } + + ngOnInit(): void { // We need to check all elements that needed upgrade as default + this.selectedComponentsToUpgrade = _.filter(this.componentsToUpgrade, (componentToUpgrade:ServiceContainerToUpgradeUiObject) => { + return !componentToUpgrade.isAlreadyUpgrade && !componentToUpgrade.isLock; + }).map(element => element.uniqueId) + } + + onComponentSelected = (uniqueId:string):void => { + + if(this.selectedComponentsToUpgrade.indexOf(uniqueId) > -1) { + this.selectedComponentsToUpgrade = _.without(this.selectedComponentsToUpgrade, uniqueId); + } else { + this.selectedComponentsToUpgrade.push(uniqueId); + } + if(this.selectedComponentsToUpgrade.length === 0) { + this.automatedUpgradeService.changeUpgradeButtonState(true); + } else { + this.automatedUpgradeService.changeUpgradeButtonState(false); + } + } +} diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.module.ts b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.module.ts new file mode 100644 index 0000000000..19f6412071 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.module.ts @@ -0,0 +1,34 @@ +/** + * Created by ob0695 on 4/18/2018. + */ +import { NgModule } from "@angular/core"; +import {SdcUiComponentsModule} from "sdc-ui/lib/angular/index"; +import {CommonModule} from "@angular/common"; +import {AutomatedUpgradeStatusComponent} from "./automated-upgrade-status/automated-upgrade-status.component"; +import {AutomatedUpgradeComponent} from "./automated-upgrade.component"; +import {UpgradeListItemComponent} from "./automated-upgrade-ui-components/upgrade-list-item/upgrade-list-item.component"; +import {UpgradeListItemStatusComponent} from "./automated-upgrade-ui-components/upgrade-list-item-status/upgrade-list-status-item.component"; +import {TranslateService} from "../../shared/translator/translate.service"; +import {UpgradeListItemInnerContent} from "./automated-upgrade-ui-components/list-item-inner-content/list-item-inner-content.component"; +import {UpgradeLineItemComponent} from "./automated-upgrade-ui-components/upgrade-line-item/upgrade-line-item.component"; +import {UpgradeListItemOrderPipe} from "./automated-upgrade-ui-components/list-item-order-pipe/list-item-order-pipe"; + +@NgModule({ + declarations: [ + AutomatedUpgradeStatusComponent, + UpgradeListItemComponent, + UpgradeListItemStatusComponent, + AutomatedUpgradeComponent, + UpgradeListItemInnerContent, + UpgradeLineItemComponent, + UpgradeListItemOrderPipe + ], + imports: [CommonModule, SdcUiComponentsModule], + exports: [], + entryComponents: [ + AutomatedUpgradeComponent, AutomatedUpgradeStatusComponent + ], + providers: [TranslateService] +}) +export class AutomatedUpgradeModule { +}
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.service.ts b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.service.ts new file mode 100644 index 0000000000..0acfececaa --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/automated-upgrade/automated-upgrade.service.ts @@ -0,0 +1,279 @@ +import {SdcUiComponents} from "sdc-ui/lib/angular"; +import {Injectable, Inject} from "@angular/core"; +import {IModalConfig} from "sdc-ui/lib/angular/modals/models/modal-config"; +import {AutomatedUpgradeComponent} from "./automated-upgrade.component"; +import {Component} from "../../../models/components/component"; +import {ComponentServiceNg2} from "../../services/component-services/component.service"; +import {GeneralStatus, ComponentType} from "../../../utils/constants"; +import {IDependenciesServerResponse} from "../../services/responses/dependencies-server-response"; +import {AutomatedUpgradeStatusComponent} from "./automated-upgrade-status/automated-upgrade-status.component"; +import {AutomatedUpgradeStatusResponse} from "../../services/responses/automated-upgrade-response"; +import Dictionary = _.Dictionary; +import {TranslateService, ITranslateArgs} from "../../shared/translator/translate.service"; +import { + ServiceContainerToUpgradeUiObject, + AllottedResourceInstanceUiObject, VspInstanceUiObject +} from "./automated-upgrade-models/ui-component-to-upgrade"; + +export interface IAutomatedUpgradeRequestObj { + serviceId:string; + resourceId?:string; +} + +export enum Placement { + left = "left" +} + +@Injectable() +export class AutomatedUpgradeService { + + private vspComponent:Component; + private uiComponentsToUpgrade:Array<ServiceContainerToUpgradeUiObject>; + private componentType:string; + + constructor(private modalService:SdcUiComponents.ModalService, + private componentService:ComponentServiceNg2, + private translateService:TranslateService) { + } + + + public convertToServerRequest = (selectedServices:Array<string>):Array<IAutomatedUpgradeRequestObj> => { + + let automatedRequest:Array<IAutomatedUpgradeRequestObj> = []; + _.forEach(selectedServices, (serviceId:string) => { + let serviceToUpgrade:ServiceContainerToUpgradeUiObject = _.find(this.uiComponentsToUpgrade, (service:ServiceContainerToUpgradeUiObject) => { + return serviceId === service.uniqueId; + }); + + if (serviceToUpgrade.vspInstances[0] instanceof AllottedResourceInstanceUiObject) { // If this is allotted resource instances, we need to take the origin vf id (all the instances have the save origin vspId + automatedRequest.push({ + serviceId: serviceId, + resourceId: (<AllottedResourceInstanceUiObject> serviceToUpgrade.vspInstances[0]).originVfId + }); + } else { + automatedRequest.push({serviceId: serviceId}); + } + }); + return automatedRequest; + } + + private getStatusText = (statusMap:Dictionary<AutomatedUpgradeStatusResponse>):string => { + let failedUpgraded = _.filter(_.flatMap(statusMap), (upgradeStatus:AutomatedUpgradeStatusResponse) => { + return upgradeStatus.status !== GeneralStatus.OK + }); + + if (failedUpgraded.length > 0) { + return this.getTextByComponentType("_UPGRADE_STATUS_FAIL"); + } + return this.getTextByComponentType("_UPGRADE_STATUS_SUCCESS"); + } + + private disabledAllModalButtons = ():void => { + this.modalService.getCurrentInstance().innerModalContent.instance.disabled = true; + this.modalService.getCurrentInstance().buttons[0].show_spinner = true; + this.modalService.getCurrentInstance().buttons[1].disabled = true; + } + + public changeUpgradeButtonState = (isDisabled:boolean):void => { + if (this.modalService.getCurrentInstance().buttons[0].disabled !== isDisabled) { + this.modalService.getCurrentInstance().buttons[0].disabled = isDisabled; + } + } + + //TODO We will need to replace this function after sdc-ui modal new design, this is just a workaround + public automatedUpgrade = ():void => { + + let selectedServices = this.modalService.getCurrentInstance().innerModalContent.instance.selectedComponentsToUpgrade; + this.disabledAllModalButtons(); + this.componentService.automatedUpgrade(this.vspComponent.componentType, this.vspComponent.uniqueId, this.convertToServerRequest(selectedServices)).subscribe((automatedUpgradeStatus:any) => { + + if (automatedUpgradeStatus.status === GeneralStatus.OK) { + + let statusMap:Dictionary<AutomatedUpgradeStatusResponse> = _.keyBy(automatedUpgradeStatus.componentToUpgradeStatus, 'name'); + // In the status modal we only showing the upgraded component that the user selected, not the entire list + let upgradedComponent:Array<ServiceContainerToUpgradeUiObject> = _.filter(this.uiComponentsToUpgrade, (component:ServiceContainerToUpgradeUiObject) => { + return selectedServices.indexOf(component.uniqueId) > -1; + }); + + _.forEach(upgradedComponent, (upgradedComponent:ServiceContainerToUpgradeUiObject) => { // If upgrade success we need to upgrade the version all success + if (statusMap[upgradedComponent.name].status === GeneralStatus.OK) { + upgradedComponent.version = statusMap[upgradedComponent.name].version; + _.forEach(upgradedComponent.vspInstances, (instance:VspInstanceUiObject) => { + instance.vspVersion = this.vspComponent.version; + }); + } + }); + + let statusModalTitle = this.getTextByComponentType("_UPGRADE_STATUS_TITLE"); + this.modalService.getCurrentInstance().setTitle(statusModalTitle); + this.modalService.getCurrentInstance().getButtons().splice(0, 1); // Remove the upgrade button + this.modalService.getCurrentInstance().buttons[0].disabled = false; // enable close again + this.modalService.getCurrentInstance().innerModalContent.destroy(); + this.modalService.createInnnerComponent(AutomatedUpgradeStatusComponent, { + upgradedComponentsList: upgradedComponent, + upgradeStatusMap: statusMap, + statusText: this.getStatusText(statusMap) + }); + } + }); + } + + public isAlreadyAdded = (uniqueId:string):ServiceContainerToUpgradeUiObject => { + let componentToUpgrade = _.find(this.uiComponentsToUpgrade, (componentToUpgrade:ServiceContainerToUpgradeUiObject) => { + return componentToUpgrade.uniqueId === uniqueId; + }); + return componentToUpgrade; + } + + public initVfUpgradeData = (serviceToUpgrade:IDependenciesServerResponse, vsp:IDependenciesServerResponse) => { + + let existed = this.isAlreadyAdded(serviceToUpgrade.uniqueId); + if (existed) { // We will take the VF with the lower version existed - only one exist all the time in vf upgrade + if (vsp.version < existed.vspInstances[0].vspVersion) { + existed.vspInstances = []; + existed.addVfInstance(vsp, this.vspComponent.version); + } + } else { + let dependencyUiObj:ServiceContainerToUpgradeUiObject = new ServiceContainerToUpgradeUiObject(serviceToUpgrade); + dependencyUiObj.addVfInstance(vsp, this.vspComponent.version); + this.uiComponentsToUpgrade.push(dependencyUiObj); + } + } + + // Service data will create instances of proxy or allotted resources + public initServiceUpgradeData = (serviceToUpgrade:IDependenciesServerResponse, vsp:IDependenciesServerResponse, instanceNames:Array<string>, allottedOriginVf?:IDependenciesServerResponse) => { + + let existedService = this.isAlreadyAdded(serviceToUpgrade.uniqueId); + if (existedService) { + existedService.addMultipleInstances(vsp, this.vspComponent.version, instanceNames, allottedOriginVf); + } + else { + let dependencyUiObj:ServiceContainerToUpgradeUiObject = new ServiceContainerToUpgradeUiObject(serviceToUpgrade); + dependencyUiObj.addMultipleInstances(vsp, this.vspComponent.version, instanceNames, allottedOriginVf); + this.uiComponentsToUpgrade.push(dependencyUiObj); + } + } + + /* + The server return response of 3 level nested object + First level - Vsp data by version + Each vsp have a decencies (the services contains the vsp - By default this is vf upgrade + If instancesNames exist - this can be proxy or allotted + If we have second layer of dependencies than this is allotted + Since we display the data the opposite way the BE return, this function will order the data in order to display it + */ + public convertToComponentsToUpgradeUiObjArray = (dependenciesServerResponse:Array<IDependenciesServerResponse>):void => { + + this.uiComponentsToUpgrade = []; + + _.forEach(dependenciesServerResponse, (vsp:IDependenciesServerResponse) => { // 3 nested levels - 1 level for vf, 2 level proxy, 3 levels allotted + if (vsp.dependencies) { + _.forEach(vsp.dependencies, (dependency:IDependenciesServerResponse) => { + if (dependency.instanceNames) { // Init service upgrade data + if (dependency.dependencies) { + _.forEach(dependency.dependencies, (serviceContainer:IDependenciesServerResponse) => { // Initiate allotted_resource instances + this.initServiceUpgradeData(serviceContainer, vsp, dependency.instanceNames, dependency); + }); + } else { //Init service_proxy instances + this.initServiceUpgradeData(dependency, vsp, dependency.instanceNames); + } + } else { // Init vf upgrade data + this.initVfUpgradeData(dependency, vsp); + } + }) + } + }); + } + + public isAllComponentsUpgraded = ():boolean => { + let isAllComponentUpgrade = _.filter(this.uiComponentsToUpgrade, (component:ServiceContainerToUpgradeUiObject) => { + return !component.isAlreadyUpgrade; + }); + return isAllComponentUpgrade.length === 0; + } + + public isAllComponentsLocked = ():boolean => { + let unLockedComponents = _.filter(this.uiComponentsToUpgrade, (component:ServiceContainerToUpgradeUiObject) => { + return !component.isLock; + }); + return unLockedComponents.length === 0; + } + + public isUpgradeNeeded = ():boolean => { + let neededUpgradeList = _.filter(this.uiComponentsToUpgrade, (component:ServiceContainerToUpgradeUiObject) => { + return !component.isLock && !component.isAlreadyUpgrade; + }); + return neededUpgradeList.length > 0; + } + + private getTextByComponentType (textLabel: string, params?:ITranslateArgs) { + return this.translateService.translate(this.componentType + textLabel, params); + } + public getInformationTextToDisplay = ():string => { + + let isAllComponentsUpgraded = this.isAllComponentsUpgraded(); + let isAllComponentsLocked = this.isAllComponentsLocked(); + let params = {vspName: this.vspComponent.name, vspVersion: this.vspComponent.version}; + + if (this.uiComponentsToUpgrade.length === 0) { + return this.getTextByComponentType("_NOTHING_TO_UPGRADE", params); + } + + switch (true) { + + case this.isUpgradeNeeded(): + { + return this.getTextByComponentType("_AUTOMATED_UPGRADE_WITH_COMPONENTS_TO_UPGRADE", params); + } + case !this.isUpgradeNeeded() && isAllComponentsLocked: + { + return this.getTextByComponentType("_AUTOMATED_UPGRADE_ALL_COMPONENTS_LOCKED", params); + } + case !this.isUpgradeNeeded() && !isAllComponentsLocked && isAllComponentsUpgraded: + { + return this.getTextByComponentType("_AUTOMATED_UPGRADE_ALL_COMPONENTS_UPGRADED", params); + } + case !this.isUpgradeNeeded() && !isAllComponentsLocked && !isAllComponentsUpgraded: + { + return this.getTextByComponentType("_AUTOMATED_UPGRADE_ALL_COMPONENTS_LOCKED", params); + } + } + } + + public openAutomatedUpgradeModal = (componentsToUpgrade:Array<IDependenciesServerResponse>, component:Component, isAfterCertification?:boolean):void => { + + this.vspComponent = component; + this.componentType = this.vspComponent.isResource() ? ComponentType.RESOURCE : ComponentType.SERVICE; + + this.convertToComponentsToUpgradeUiObjArray(componentsToUpgrade); + let informationalText = this.getInformationTextToDisplay(); + let modalTitle = this.getTextByComponentType("_UPGRADE_TITLE"); + let certificationText = isAfterCertification ? this.getTextByComponentType("_CERTIFICATION_STATUS_TEXT", {resourceName: this.vspComponent.name}) : undefined; + + let upgradeVspModalConfig:IModalConfig = { + title: modalTitle, + size: "md", + type: "custom", + testId: "upgradeVspModal", + buttons: [ + { + text: this.vspComponent.isResource() ? "UPGRADE" : "UPDATE", + spinner_position: Placement.left, + size: 'sm', + callback: this.automatedUpgrade, + closeModal: false, + disabled: !this.isUpgradeNeeded(), + + }, + {text: 'CLOSE', size: 'sm', closeModal: true, type: 'secondary'} + ] + }; + + this.modalService.openCustomModal(upgradeVspModalConfig, AutomatedUpgradeComponent, { + componentsToUpgrade: this.uiComponentsToUpgrade, + informationText: informationalText, + certificationStatusText: certificationText + }); + } +} + |