diff options
Diffstat (limited to 'catalog-ui/src/app/view-models/workspace')
13 files changed, 135 insertions, 112 deletions
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view-model.ts index 4b9dd6fc00..5236259f30 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view-model.ts +++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view-model.ts @@ -25,7 +25,7 @@ import {IWorkspaceViewModelScope} from "../../workspace-view-model"; import {ComponentServiceNg2} from "app/ng2/services/component-services/component.service"; import {ComponentGenericResponse} from "app/ng2/services/responses/component-generic-response"; import {Resource} from "app/models/components/resource"; -import {ResourceType} from "../../../../utils/constants"; +import {ResourceType,ComponentType} from "../../../../utils/constants"; export interface ICompositionViewModelScope extends IWorkspaceViewModelScope { @@ -48,6 +48,7 @@ export interface ICompositionViewModelScope extends IWorkspaceViewModelScope { setSelectedInstance(componentInstance:ComponentInstance):void; printScreen():void; isPNF():boolean; + isConfiguration():boolean; cacheComponentsInstancesFullData:Component; } @@ -167,9 +168,12 @@ export class CompositionViewModel { this.$scope.updateSelectedComponent = ():void => { if (this.$scope.currentComponent.selectedInstance) { - + let parentComponentUid = this.$scope.currentComponent.selectedInstance.componentUid + if(this.$scope.currentComponent.selectedInstance.originType === ComponentType.SERVICE_PROXY){ + parentComponentUid = this.$scope.currentComponent.selectedInstance.sourceModelUid; + } let componentParent = _.find(this.cacheComponentsInstancesFullData, (component) => { - return component.uniqueId === this.$scope.currentComponent.selectedInstance.componentUid; + return component.uniqueId === parentComponentUid; }); if (componentParent) { this.$scope.selectedComponent = componentParent; @@ -185,7 +189,7 @@ export class CompositionViewModel { console.log("Error updating selected component"); this.$scope.isLoadingRightPanel = false; }; - this.ComponentFactory.getComponentFromServer(this.$scope.currentComponent.selectedInstance.originType, this.$scope.currentComponent.selectedInstance.componentUid).then(onSuccess, onError); + this.ComponentFactory.getComponentFromServer(this.$scope.currentComponent.selectedInstance.originType, parentComponentUid).then(onSuccess, onError); } catch (e) { console.log("Error updating selected component", e); this.$scope.isLoadingRightPanel = false; @@ -247,6 +251,10 @@ export class CompositionViewModel { return this.$scope.selectedComponent.isResource() && (<Resource>this.$scope.selectedComponent).resourceType === ResourceType.PNF; }; + this.$scope.isConfiguration = (): boolean => { + return this.$scope.selectedComponent.isResource() && (<Resource>this.$scope.selectedComponent).resourceType === ResourceType.CONFIGURATION; + }; + this.eventListenerService.registerObserverCallback(EVENTS.ON_CHECKOUT, this.$scope.reload); } diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html index e05574e8c8..bfb2865348 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html +++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html @@ -58,29 +58,30 @@ data-ui-sref="workspace.composition.deployment" tooltips tooltip-class="tooltip-custom tab-tooltip" tooltip-content="Deployment Artifacts" data-tests-id="deployment-artifact-tab" - data-ng-if="!isPNF()"> + data-ng-if="!isPNF() && !isConfiguration() && !(isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy())"> <div class="i-sdc-designer-sidebar-tab-icon sprite-new deployment-artifacts"></div> </button> <button tooltips tooltip-class="tooltip-custom tab-tooltip" - tooltip-content="{{selectedComponent.isResource() ? 'Properties and Attributes': 'Inputs'}}" + tooltip-content="{{selectedComponent.isResource() || (isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy()) ? 'Properties and Attributes': 'Inputs'}}" class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active" data-ui-sref="workspace.composition.properties" data-tests-id="properties-and-attributes-tab"> <div class="i-sdc-designer-sidebar-tab-icon sprite-new" - ng-class="selectedComponent.isResource() ? 'properties': 'inputs'"></div> + ng-class="selectedComponent.isResource() || (isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy()) ? 'properties': 'inputs'"></div> </button> <button class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active" data-ui-sref="workspace.composition.artifacts" + data-ng-if="!isConfiguration() && !(isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy())" tooltips tooltip-class="tooltip-custom tab-tooltip" tooltip-content="Information Artifacts"> <div class="i-sdc-designer-sidebar-tab-icon sprite-new information-artifacts"></div> </button> - <button data-ng-show="!selectedComponent.isService()" class="i-sdc-designer-sidebar-tab" + <button data-ng-if="!selectedComponent.isService() || (isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy())" class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active" ui-sref="workspace.composition.relations" tooltips tooltip-class="tooltip-custom tab-tooltip tooltip-rightside" tooltip-content="Requirements and Capabilities"> <div class="i-sdc-designer-sidebar-tab-icon sprite-new relations"></div> </button> - <button data-ng-show="selectedComponent.isService()" class="i-sdc-designer-sidebar-tab" + <button data-ng-if="selectedComponent.isService() && !(isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy())" class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active" ui-sref="workspace.composition.api" data-tests-id="tab-api" tooltips tooltip-class="tooltip-custom tab-tooltip tooltip-rightside" tooltip-content="API"> <div class="i-sdc-designer-sidebar-tab-icon sprite-new api"></div> diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition.less b/catalog-ui/src/app/view-models/workspace/tabs/composition/composition.less index 262dfd9be8..624ed03431 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition.less +++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/composition.less @@ -21,6 +21,11 @@ } } } + + .custom-modal { + /* Hack solution to hide canvas tooltips under modals */ + z-index: 20000 !important; + } } .workspace-composition { @@ -68,7 +73,7 @@ .w-sdc-designer-sidebar { background-color:@main_color_p ; .noselect; - bottom: @footer_height; + bottom: 0; position: fixed; right: -302px; width: 302px; @@ -92,8 +97,8 @@ .w-sdc-designer-sidebar-logo-ph { display: inline-block; vertical-align: middle; - line-height: 48px; - height: 48px; + line-height: 60px; + height: 60px; } .w-sdc-designer-sidebar-logo { @@ -129,7 +134,7 @@ } .w-sdc-designer-sidebar-tabs { - .bg_e; + .bg_c; } .w-sdc-designer-sidebar-tabs::after { @@ -275,7 +280,9 @@ .g_7; .bg_c; border-radius: 4px; - display: inline-block; + //fix long name for firefox: + display: block; + float: left; line-height: 25px; margin: 0 4px 6px 0; min-width: 50px; @@ -620,7 +627,11 @@ display: inline-block; margin: 12px 0 12px 10px; pointer-events: auto; - + height: 45px; + width: 40px; + float: left; + display: flex; + align-items: center; .non-certified { position: relative; left: 27px; @@ -849,82 +860,30 @@ // --------------------------------------------------------------------------------------------------- // Canvas inline menu // --------------------------------------------------------------------------------------------------- - .w-sdc-canvas-menu { - position: fixed; - z-index: 100; - - border-style: solid; - border-width: 1px; - border-color: #d8d8d8; - box-sizing: border-box; - background-color: #ffffff; - box-shadow: 0px 2px 2px 0px rgba(24, 24, 25, 0.1); - width: 91px; - - /* &.vl-type-select{ - width: 173px; - } - */ + .w-sdc-canvas-menu-list { + .w-sdc-canvas-menu-item-view { + &::before { + content: ''; + display: inline-block; - h3 { - color: @func_color_s; - font-size: 14px; - font-weight: bold; - margin: 0; - padding: 7px 11px; - border-bottom: 1px solid #e5e5e5; + .sprite-new; + .view-icon; + vertical-align: top; + margin: 2px 6px 2px 4px; + } } - .w-sdc-canvas-menu-content { - padding: 5px 5px; - - &.vl-select{ - border-bottom: #d8d8d8 solid 1px; - line-height: 15px; - - .tlv-radio { - padding: 3px 0px; - - .tlv-radio-label { - padding: 3px 0px; - - &::before { - margin-right: 10px; - } - } - } - } + .w-sdc-canvas-menu-item-delete { + &::before { + content: ''; + display: inline-block; - .w-sdc-canvas-menu-content-update-button { - .sprite; - .sprite.e-sdc-small-icon-delete; - .hand; - position: absolute; - top: 15px; - right: 10px; + .sprite-new; + .delete-icon; + vertical-align: bottom; + margin: 1px 10px 0 7px; } - .w-sdc-canvas-menu-content-delete-button { - .sprite; - .sprite.e-sdc-small-icon-delete; - .hand; - margin: 0 8px 0 6px; - } - } - - .w-sdc-canvas-menu-arrow { - //TODO: Missing image for small blue triangle. - background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkE1OTIzNDI1MENFQjExRTU4ODRERTI1MDM2REZCOUYzIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkE1OTIzNDI2MENFQjExRTU4ODRERTI1MDM2REZCOUYzIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QTU5MjM0MjMwQ0VCMTFFNTg4NERFMjUwMzZERkI5RjMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QTU5MjM0MjQwQ0VCMTFFNTg4NERFMjUwMzZERkI5RjMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4gBXTlAAAAOElEQVR42mK0rp7NgASMgZgFiE/CBJjQJPcA8U4gNkdXAJMUAGJ+ZEVMaJIwAFfEhEUSRRFAgAEAVtgJyiLAPWAAAAAASUVORK5CYII='); - content: ''; - display: block; - height: 21px; - position: absolute; - right: 12px; - top: -24px; - width: 184px; - background-repeat: no-repeat; - background-position: 175px 16px; } - } } /*.right-tab-loader { diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view-model.ts index f0c8b1d86b..b80b63cac9 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view-model.ts +++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view-model.ts @@ -40,7 +40,7 @@ export interface IArtifactsViewModelScope extends ICompositionViewModelScope { artifactType:string; downloadFile:IFileDownload; isLoading:boolean; - displayDeleteButtonMap:Dictionary<string, boolean>; + allowDeleteAndUpdateArtifactMap:Dictionary<string, boolean>; getTitle():string; addOrUpdate(artifact:ArtifactModel):void; delete(artifact:ArtifactModel):void; @@ -126,9 +126,9 @@ export class ResourceArtifactsViewModel { } } this.$scope.artifacts = artifacts; - this.$scope.displayDeleteButtonMap = new Dictionary<string, boolean>(); + this.$scope.allowDeleteAndUpdateArtifactMap = new Dictionary<string, boolean>(); _.forEach(this.$scope.artifacts, (artifact:ArtifactModel)=>{ - this.$scope.displayDeleteButtonMap[artifact.artifactLabel] = this.displayDeleteButton(artifact); + this.$scope.allowDeleteAndUpdateArtifactMap[artifact.artifactLabel] = this.allowDeleteAndUpdateArtifact(artifact); }); this.$scope.isLoading = false; }; @@ -234,8 +234,8 @@ export class ResourceArtifactsViewModel { }); }; - private displayDeleteButton = (artifact:ArtifactModel):boolean => { - if(!this.$scope.isViewMode() && artifact.esId){ + private allowDeleteAndUpdateArtifact = (artifact:ArtifactModel):boolean => { + if(!this.$scope.isViewMode()){ if(this.$scope.isComponentInstanceSelected()){//is artifact of instance return !this.$scope.selectedComponent.deploymentArtifacts || !this.$scope.selectedComponent.deploymentArtifacts[artifact.artifactLabel];//if the artifact is not from instance parent }else{//is artifact of main component diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view.html index dfbd639eb4..f4102977b9 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view.html +++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view.html @@ -1,5 +1,6 @@ <perfect-scrollbar class="w-sdc-designer-sidebar-tab-content artifacts"> <div class="w-sdc-designer-sidebar-section"> + <loader data-display="isLoading"></loader> <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content" class="w-sdc-designer-sidebar-section-title"> <span class="w-sdc-designer-sidebar-section-title-text" data-ng-bind="getTitle()" tooltips tooltip-content="{{getTitle()}}"></span> @@ -19,8 +20,8 @@ data-ng-if="artifact.artifactName"></div> <div> <span class="i-sdc-designer-sidebar-section-content-item-artifact-details-name" data-tests-id="artifact_Display_Name-{{artifact.artifactDisplayName}}" - data-ng-class="{'hand enabled': !isViewMode() && !artifact.isHEAT() && !artifact.isThirdParty() && !isLicenseArtifact(artifact)}" - data-ng-bind="artifact.artifactDisplayName" data-ng-click="!isViewMode() && !isLoading && !isComponentInstanceSelected() && !artifact.isHEAT() && !artifact.isThirdParty() && !isLicenseArtifact(artifact) && addOrUpdate(artifact)" + data-ng-class="{'hand enabled': allowDeleteAndUpdateArtifactMap[artifact.artifactLabel]}" + data-ng-bind="artifact.artifactDisplayName" data-ng-click="!isLoading && allowDeleteAndUpdateArtifactMap[artifact.artifactLabel] && addOrUpdate(artifact)" tooltips tooltip-content="{{artifact.artifactDisplayName}}"></span> <div class="i-sdc-designer-sidebar-section-content-item-artifact-heat-env" ng-if="artifact.heatParameters.length"> <span data-ng-bind="getEnvArtifactName(artifact)"data-tests-id="heat_env_{{artifact.artifactDisplayName}}"></span> @@ -36,7 +37,7 @@ <span class="i-sdc-designer-sidebar-section-content-item-artifact-details-desc-label" data-ng-show="artifact.description">Description:</span>{{artifact.description}} </div> </div> - <button ng-if="displayDeleteButtonMap[artifact.artifactLabel]" class="i-sdc-designer-sidebar-section-content-item-button delete sprite e-sdc-small-icon-delete" + <button ng-if="artifact.esId && allowDeleteAndUpdateArtifactMap[artifact.artifactLabel]" class="i-sdc-designer-sidebar-section-content-item-button delete sprite e-sdc-small-icon-delete" data-tests-id="delete_{{artifact.artifactDisplayName}}" data-ng-click="delete(artifact)" type="button"></button> <button ng-if="!isViewMode() && artifact.isHEAT() && isComponentInstanceSelected() && artifact.heatParameters.length" class="i-sdc-designer-sidebar-section-content-item-button attach sprite e-sdc-small-icon-pad" diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html index 0418515789..5020c73df4 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html +++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html @@ -11,7 +11,7 @@ <div class="w-sdc-designer-sidebar-section-content general"> <div class="i-sdc-designer-sidebar-section-content-item"> <span class="i-sdc-designer-sidebar-section-content-item-label">Type:</span> - <span class="i-sdc-designer-sidebar-section-content-item-value" data-tests-id="rightTab_componentType" data-ng-bind="selectedComponent.componentType"></span> + <span class="i-sdc-designer-sidebar-section-content-item-value" data-tests-id="rightTab_componentType" data-ng-bind="isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy() ? 'Service Proxy' : selectedComponent.componentType"></span> </div> <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.isResource()"> <span class="i-sdc-designer-sidebar-section-content-item-label">Resource Type:</span> @@ -103,8 +103,15 @@ <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.contactId" data-tests-id="rightTab_contactId"></span> </div> + + <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy()"> + <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_SOURCE_SERVICE_NAME"></span> + <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="currentComponent.selectedInstance.sourceModelName" tooltips tooltip-class="tooltip-custom break-word-tooltip" tooltip-content="​{{currentComponent.selectedInstance.sourceModelName}}" + data-tests-id="rightTab_sourceModelName"></span> + </div> + <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="isViewMode() && currentComponent.isService() && selectedComponent.isResource()"> - <span class="i-sdc-designer-sidebar-section-content-item-label">Resource Customization UUID:</span><br> + <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_RESOURCE_CUSTOMIZATION_UUID"></span><br> <span class="customization-uuid selectable" data-ng-bind="currentComponent.selectedInstance.customizationUUID" data-tests-id="rightTab_customizationModuleUUID"></span><br> </div> diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details.less b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details.less index 0ed72e2f00..90bb5658c8 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details.less +++ b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details.less @@ -33,7 +33,7 @@ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; - display: inline-block; + //display: inline-block; fix long name for firefox max-width: 160px; vertical-align:bottom; font-weight: normal; diff --git a/catalog-ui/src/app/view-models/workspace/tabs/general/general-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/general/general-view-model.ts index c60a490b4b..6060130191 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/general/general-view-model.ts +++ b/catalog-ui/src/app/view-models/workspace/tabs/general/general-view-model.ts @@ -41,11 +41,16 @@ export class componentCategories {//categories field bind to this obj in order t selectedCategory:string; } +export interface IEnvironmentContext { + defaultValue:string; + validValues:Array<string>; +} export interface IGeneralScope extends IWorkspaceViewModelScope { validation:Validation; editForm:ng.IFormController; categories:Array<IMainCategory>; + environmentContextObj:IEnvironmentContext; latestCategoryId:string; latestVendorName:string; importedFileExtension:any; @@ -67,6 +72,7 @@ export interface IGeneralScope extends IWorkspaceViewModelScope { onEcompGeneratedNamingChange():void; openOnBoardingModal():void; initCategoreis():void; + initEnvironmentContext():void; updateIcon():void; possibleToUpdateIcon():boolean; } @@ -195,6 +201,9 @@ export class GeneralViewModel { // Init categories this.$scope.initCategoreis(); + // Init Environment Context + this.$scope.initEnvironmentContext(); + // Init the decision if to show file browse. this.$scope.isShowFileBrowse = false; if (this.$scope.component.isResource()) { @@ -239,6 +248,7 @@ export class GeneralViewModel { //TODO remove this after handling contact in UI if (this.$scope.isCreateMode()) { this.$scope.component.contactId = this.cacheService.get("user").userId; + this.$scope.originComponent.contactId = this.$scope.component.contactId; } }; @@ -288,6 +298,19 @@ export class GeneralViewModel { } }; + + this.$scope.initEnvironmentContext = ():void => { + if (this.$scope.componentType === ComponentType.SERVICE) { + this.$scope.environmentContextObj = this.cacheService.get('UIConfiguration').environmentContext; + var environmentContext:string =(<Service>this.$scope.component).environmentContext; + var isCheckout:boolean = ComponentState.NOT_CERTIFIED_CHECKOUT === this.$scope.component.lifecycleState; + // In creation new service OR check outing old service without environmentContext parameter - set default value + if(this.$scope.isCreateMode() || (isCheckout && !environmentContext)){ + (<Service>this.$scope.component).environmentContext = this.$scope.environmentContextObj.defaultValue; + } + } + }; + this.$scope.validateField = (field:any):boolean => { if (field && field.$dirty && field.$invalid) { return true; @@ -416,5 +439,8 @@ export class GeneralViewModel { } }; this.EventListenerService.registerObserverCallback(EVENTS.ON_CHECKOUT, this.$scope.reload); + this.EventListenerService.registerObserverCallback(EVENTS.ON_REVERT, ()=>{ + this.$scope.componentCategories.selectedCategory = this.$scope.originComponent.selectedCategory; + }); }; } diff --git a/catalog-ui/src/app/view-models/workspace/tabs/general/general-view.html b/catalog-ui/src/app/view-models/workspace/tabs/general/general-view.html index 3a3b2d316d..e3eb903a36 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/general/general-view.html +++ b/catalog-ui/src/app/view-models/workspace/tabs/general/general-view.html @@ -343,9 +343,9 @@ data-ng-model-options="{ debounce: 500 }" name="serviceType" data-tests-id="serviceType" - data-ng-maxlength="25" - data-ng-pattern="validation.VendorReleaseValidationPattern" - maxlength="25" + data-ng-maxlength="256" + data-ng-pattern="validation.ServiceTypeAndRoleValidationPattern" + maxlength="256" /> <div class="input-error" data-ng-show="validateField(editForm.serviceType)"> <span ng-show="editForm.serviceType.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '25' }"></span> @@ -365,9 +365,9 @@ data-ng-model-options="{ debounce: 500 }" name="serviceRole" data-tests-id="serviceRole" - data-ng-maxlength="25" - data-ng-pattern="validation.VendorReleaseValidationPattern" - maxlength="25" + data-ng-maxlength="256" + data-ng-pattern="validation.ServiceTypeAndRoleValidationPattern" + maxlength="256" /> <div class="input-error" data-ng-show="validateField(editForm.serviceRole)"> <span ng-show="editForm.serviceRole.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '25' }"></span> @@ -376,6 +376,26 @@ </div> <!--------------------- Service Role --------------------> + <!-------------------- ENVIRONMENT CONTEXT -----------------> + + <div ng-if="component.isService()" class="i-sdc-form-item"> + <loader data-display="!environmentContextObj && !initEnvironmentContext()" relative="true"></loader> + <label class="i-sdc-form-label">Environment Context</label> + <select class="i-sdc-form-select" + name="environmentContext" + data-ng-class="{'view-mode': isViewMode()}" + data-ng-model="component.environmentContext" + data-tests-id="environmentContext" + > + <option data-ng-repeat="environmentContextVal in (environmentContextObj.validValues) | orderBy" + value="{{environmentContextVal}}" + data-tests-id="{{environmentContextVal}}">{{environmentContextVal}}</option> + </select> + + </div> + <!--------------------- ENVIRONMENT CONTEXT ------------------> + + <div class="meta-data" data-ng-if="component.creationDate"> <div> <b>Created:</b> diff --git a/catalog-ui/src/app/view-models/workspace/tabs/properties/properties-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/properties/properties-view-model.ts index 3c9c7e9e4b..0360c9c805 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/properties/properties-view-model.ts +++ b/catalog-ui/src/app/view-models/workspace/tabs/properties/properties-view-model.ts @@ -71,7 +71,8 @@ export class PropertiesViewModel { } private openEditPropertyModal = (property:PropertyModel):void => { - this.ModalsHandler.openEditPropertyModal(property, this.$scope.component, this.$scope.filteredProperties, false).then(() => { + this.ModalsHandler.openEditPropertyModal(property, this.$scope.component, this.$scope.filteredProperties, false).then((updatedProperty:PropertyModel) => { + //property = updatedProperty; }); }; diff --git a/catalog-ui/src/app/view-models/workspace/workspace-view-model.ts b/catalog-ui/src/app/view-models/workspace/workspace-view-model.ts index a3af8ca68e..226785e06f 100644 --- a/catalog-ui/src/app/view-models/workspace/workspace-view-model.ts +++ b/catalog-ui/src/app/view-models/workspace/workspace-view-model.ts @@ -393,7 +393,7 @@ export class WorkspaceViewModel { } else { this.$scope.component = this.ComponentFactory.createComponent(this.$scope.originComponent); } - + this.EventListenerService.notifyObservers(EVENTS.ON_REVERT); }; this.$scope.changeLifecycleState = (state:string):void => { diff --git a/catalog-ui/src/app/view-models/workspace/workspace-view.html b/catalog-ui/src/app/view-models/workspace/workspace-view.html index a7c9da05c4..0663074dbc 100644 --- a/catalog-ui/src/app/view-models/workspace/workspace-view.html +++ b/catalog-ui/src/app/view-models/workspace/workspace-view.html @@ -7,11 +7,11 @@ {{menuComponentTitle}} </div> <div class="i-sdc-designer-sidebar-section-content-item" ng-class="{'selected': menuItem.state == $state.current.name}" ng-repeat="menuItem in leftBarTabs.menuItems track by $index"> - <div class="expand-collapse-menu-box-item-text" ng-click="onMenuItemPressed(menuItem.state)" ng-class="{'disabled': menuItem.isDisabled }" data-tests-id="{{menuItem.text}}">{{menuItem.text}}</div> + <div class="expand-collapse-menu-box-item-text" ng-click="onMenuItemPressed(menuItem.state)" ng-class="{'disabled': menuItem.isDisabled }" data-tests-id="{{menuItem.text}}LeftSideMenu">{{menuItem.text}}</div> </div> </div> - <div include-padding="true" class="w-sdc-main-right-container" data-ng-class="{'composition':isComposition}"> + <div include-padding="true" class="w-sdc-main-right-container" data-ng-class="{'composition':isComposition, 'deployment':isDeployment}"> <loader data-display="isCreateProgress" data-ng-show="isCreateProgress" relative="false"></loader> <div class="sdc-workspace-top-bar"> @@ -63,8 +63,7 @@ <span data-ng-if="isDesigner()" data-ng-class="{'disabled' :isDisableMode() || isViewMode()}" ng-click="revert()" class="sprite-new revert-btn" data-tests-id="revert" data-ng-show="showFullIcons()" sdc-smart-tooltip="">Revert</span> - - <span data-ng-if="isComposition" class="sprite-new print-screen-btn" entity="component" print-graph-screen data-tests-id="printScreen"></span> + <span class="delimiter"></span> <span class="sprite-new x-btn" data-ng-click="goToBreadcrumbHome()" sdc-smart-tooltip="">Close</span> @@ -78,6 +77,5 @@ </div> </div> </div> - <top-nav search-bind="search.filterTerm" hide-search="true" menu-model="breadcrumbsModel" version="{{version}}"></top-nav> - <ecomp-footer></ecomp-footer> + <top-nav [hide-search]="true" [menu-model]="breadcrumbsModel" [version]="version"></top-nav> </div> diff --git a/catalog-ui/src/app/view-models/workspace/workspace.less b/catalog-ui/src/app/view-models/workspace/workspace.less index 8b8b6d624a..84a3599d47 100644 --- a/catalog-ui/src/app/view-models/workspace/workspace.less +++ b/catalog-ui/src/app/view-models/workspace/workspace.less @@ -170,8 +170,10 @@ line-height: 110px; .f-type ._28; } - &.composition .w-sdc-main-container-body-content { - height: calc(~'100% - @{action_nav_height}'); //composition is the only tab without a tab title. need to exclude from calculation. + &.composition, &.deployment{ + .w-sdc-main-container-body-content { + height: 100%; + } } .w-sdc-main-container-body-content { // height:calc(~'100% - @{action_nav_height} - @{tab_title}'); |