summaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/view-models/workspace
diff options
context:
space:
mode:
Diffstat (limited to 'catalog-ui/src/app/view-models/workspace')
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.html101
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.less80
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.ts123
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes-view-model.ts99
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes-view.html68
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes.less54
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view-model.ts501
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html159
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/composition.less955
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view-model.ts352
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view.html84
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts.less173
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view-model.ts201
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html181
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details.less81
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties-view-model.ts244
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties-view.html133
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties.less39
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations-view-model.ts177
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations-view.html77
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations.less14
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view-model.ts101
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view.html23
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view-model.ts125
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view.html25
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/structure/structure-view.html29
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/structure/structure-view.ts34
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-description-popover.html39
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-view-model.ts352
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-view.html147
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts.less201
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment-view-model.ts146
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment-view.html26
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment.less34
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal-view-model.ts104
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal-view.html146
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal.less40
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution-view-model.ts131
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution-view.html198
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution.less362
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/general/general-view-model.ts209
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/general/general-view.html58
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/general/general.less5
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts-view-model.ts158
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts-view.html82
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts.less57
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/inputs/inputs.less225
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/interface-operation/interface-operation-view-model.ts1
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/interface-operation/interface-operation-view.html1
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/management-workflow/management-workflow-view.html1
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/network-call-flow/network-call-flow-view.html1
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view-model.ts94
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view.html20
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context.less2
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/properties/properties-view-model.ts23
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/properties/properties-view.html1
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-editable-view.html247
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-view-model.ts471
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-view.html159
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities.less418
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts-view-model.ts105
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts-view.html65
-rw-r--r--catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts.less77
-rw-r--r--catalog-ui/src/app/view-models/workspace/workspace-view-model.ts585
-rw-r--r--catalog-ui/src/app/view-models/workspace/workspace-view.html16
-rw-r--r--catalog-ui/src/app/view-models/workspace/workspace.less65
66 files changed, 526 insertions, 8779 deletions
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.html b/catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.html
deleted file mode 100644
index c5ab3cc110..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.html
+++ /dev/null
@@ -1,101 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<div class="activity-log">
-
- <div class="title-wrapper">
- <div class="top-search">
- <input type="text"
- class="search-text"
- placeholder="Search"
- data-ng-model="searchBind"
- data-tests-id="main-menu-input-search"
- ng-model-options="{ debounce: 500 }" />
- <span class="w-sdc-search-icon magnification"></span>
- </div>
- </div>
-
- <div class="table-container-flex">
- <div class="table" data-ng-class="{'view-mode': isViewMode()}">
-
- <!-- Table headers -->
- <div class="head flex-container">
- <div class="table-header head-row hand flex-item" ng-repeat="header in tableHeadersList track by $index" data-ng-click="sort(header.property)">{{header.title}}
- <span data-ng-show="sortBy === header.property" class="table-header-sort-arrow" data-ng-class="{'down': reverse, 'up':!reverse}"> </span>
- </div>
- </div>
-
- <!-- Table body -->
- <div class="body">
- <perfect-scrollbar suppress-scroll-x="true" scroll-y-margin-offset="0" include-padding="true" class="scrollbar-container">
-
- <!-- In case the logs are empty -->
- <div data-ng-if="!activityLog || activityLog.length===0" class="no-row-text">
- There are no logs to display
- </div>
-
- <!-- Loop on logs list -->
- <div data-ng-repeat="item in activityLog | filter: searchBind | orderBy:sortBy:reverse track by $index"
- data-ng-init="item.dateFormat = ( item.TIMESTAMP.replace(' UTC', '') | stringToDateFilter | date: 'MM/dd/yyyy':'UTC')+' | '+(item.TIMESTAMP.replace(' UTC', '') | stringToDateFilter | date: 'shortTime':'UTC' )"
- class="flex-container data-row"
- data-ng-class="{'selected': component === selectedComponent}"
- data-ng-click="doSelectComponent(component);"
- >
-
- <!-- Date -->
- <div class="table-col-general flex-item" sdc-smart-tooltip>
- {{item.dateFormat}}
- </div>
-
- <!-- Action -->
- <div class="table-col-general flex-item" sdc-smart-tooltip>
- {{item.ACTION}}
- </div>
-
- <!-- Comment -->
- <div class="table-col-general flex-item" sdc-smart-tooltip>
- {{item.COMMENT}}
- </div>
-
- <!-- Username -->
- <div class="table-col-general flex-item" sdc-smart-tooltip>
- {{item.MODIFIER}}
- </div>
-
- <!-- Status -->
- <div class="table-col-general flex-item" sdc-smart-tooltip>
- {{item.STATUS}}
- <span data-ng-class="{'success': item.STATUS>='200' && item.STATUS<='204','error': item.STATUS<'200' || item.STATUS>='300'}"></span>
- </div>
-
- </div>
-
- </perfect-scrollbar>
- </div><!-- End table body -->
- </div><!-- End table -->
- </div><!-- End table-container-flex -->
-
-</div>
-
-
-
-<!--<div ng-repeat="activityDate in activityDateArray " class="w-sdc-component-viewer-right-activity-log" >
- <div class="w-sdc-component-viewer-right-activity-log-date" >{{activityDate | date: 'longDate'}}</div>
- <div ng-repeat="activity in activityLog[activityDate] | orderBy: '-TIMESTAMP'">
- <div class="w-sdc-component-viewer-right-activity-log-time">{{activity.TIMESTAMP.replace(" UTC", '') | stringToDateFilter | date: 'mediumTime':'UTC'}}</div>
- <div class="w-sdc-component-viewer-right-activity-log-content">{{"Action: " + parseAction(activity.ACTION) + " Performed by: " + activity.MODIFIER + " Status: " + activity.STATUS}}</div>
- </div>
-</div>-->
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.less b/catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.less
deleted file mode 100644
index 24f83ec503..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.less
+++ /dev/null
@@ -1,80 +0,0 @@
-.activity-log {
- .title-wrapper {
- display: flex;
- justify-content: flex-end;
- }
-
- .table-container-flex .table .body .scrollbar-container {
- max-height: 448px;
- }
-
- .view-mode {
- background-color: @main_color_p;
- }
-
- .table{
- height: 490px;
- margin-bottom: 0;
- }
-
- .table-container-flex {
- margin-top: 10px;
-
- .flex-item:nth-child(1) { width: 200px; }
- .flex-item:nth-child(2) { flex-grow: 20; }
- .flex-item:nth-child(3) { flex-grow: 30; }
- .flex-item:nth-child(4) { flex-grow: 20; }
- .flex-item:nth-child(5) { width: 80px; }
-
- .success {
- position: absolute;
- top: 11px;
- right: 20px;
- .sprite-new;
- .sdc-success;
- }
-
- .error {
- position: absolute;
- top: 11px;
- right: 20px;
- .sprite-new;
- .sdc-error;
- }
-
- }
-
- .data-row {
- position: relative;
- }
-
- .top-search {
- float: right;
- position: relative;
-
- input.search-text {
- .border-radius(2px);
- width: 245px;
- height: 32px;
- line-height: 32px;
- border: 1px solid @main_color_o;
- margin: 0;
- outline: none;
- text-indent: 10px;
-
- &::-webkit-input-placeholder { font-style: italic; } /* Safari, Chrome and Opera */
- &:-moz-placeholder { font-style: italic; } /* Firefox 18- */
- &::-moz-placeholder { font-style: italic; } /* Firefox 19+ */
- &:-ms-input-placeholder { font-style: italic; } /* IE 10+ */
- &:-ms-input-placeholder { font-style: italic; } /* Edge */
- }
-
- .magnification {
- position: absolute;
- top: 10px;
- right: 10px;
- }
-
- }
-
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.ts b/catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.ts
deleted file mode 100644
index 452224a829..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/activity-log/activity-log.ts
+++ /dev/null
@@ -1,123 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import * as _ from "lodash";
-import {IWorkspaceViewModelScope} from "app/view-models/workspace/workspace-view-model";
-import {Activity} from "app/models";
-import {ActivityLogService} from "app/services";
-
-export interface IActivityLogViewModelScope extends IWorkspaceViewModelScope {
- activityDateArray:Array<any>; //this is in order to sort the dates
- activityLog:Array<Activity>;
- preVersion:string;
-
- tableHeadersList:Array<any>;
- reverse:boolean;
- sortBy:string;
- searchBind:string;
-
- getActivityLog(uniqueId:string):void;
- onVersionChanged(version:any):void;
- parseAction(action:string):string;
- sort(sortBy:string):void;
-}
-
-export class ActivityLogViewModel {
-
- static '$inject' = [
- '$scope',
- '$state',
- 'Sdc.Services.ActivityLogService'
- ];
-
- constructor(private $scope:IActivityLogViewModelScope,
- private $state:ng.ui.IStateService,
- private activityLogService:ActivityLogService) {
-
- this.initScope();
- this.$scope.setValidState(true);
- this.initSortedTableScope();
-
- // Set default sorting
- this.$scope.sortBy = 'logDate';
- }
-
- private initScope():void {
-
- this.$scope.preVersion = this.$scope.component.version;
-
- this.$scope.onVersionChanged = (version:any):void => {
- if (version.versionNumber != this.$scope.component.version) {
- this.$scope.isLoading = true;
- this.$scope.getActivityLog(version.versionId);
- }
- };
-
- this.$scope.getActivityLog = (uniqueId:any):void => {
-
- let onError = (response) => {
- this.$scope.isLoading = false;
- console.info('onFaild', response);
-
- };
-
- let onSuccess = (response:Array<Activity>) => {
- this.$scope.activityLog = _.sortBy(response, function (o) {
- return o.TIMESTAMP;
- }); //response; //
- this.$scope.isLoading = false;
- };
-
- this.$scope.isLoading = true;
- if (this.$scope.component.isResource()) {
- this.activityLogService.getActivityLogService('resources', uniqueId).then(onSuccess, onError);
- }
- if (this.$scope.component.isService()) {
- this.activityLogService.getActivityLogService('services', uniqueId).then(onSuccess, onError);
- }
-
- };
-
- if (!this.$scope.activityLog || this.$scope.preVersion != this.$scope.component.version) {
- this.$scope.getActivityLog(this.$scope.component.uniqueId);
- }
-
- this.$scope.parseAction = (action:string) => {
- return action ? action.split(/(?=[A-Z])/).join(' ') : '';
- };
-
- }
-
- private initSortedTableScope = ():void => {
- this.$scope.tableHeadersList = [
- {title: 'Date', property: 'dateFormat'},
- {title: 'Action', property: 'ACTION'},
- {title: 'Comment', property: 'COMMENT'},
- {title: 'Username', property: 'MODIFIER'},
- {title: 'Status', property: 'STATUS'}
- ];
-
- this.$scope.sort = (sortBy:string):void => {
- this.$scope.reverse = (this.$scope.sortBy === sortBy) ? !this.$scope.reverse : false;
- this.$scope.sortBy = sortBy;
- };
- };
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes-view-model.ts
deleted file mode 100644
index 312a663e8f..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes-view-model.ts
+++ /dev/null
@@ -1,99 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import {IWorkspaceViewModelScope} from "app/view-models/workspace/workspace-view-model";
-import {Component, AttributeModel} from "app/models";
-import {ModalsHandler} from "app/utils";
-import {ComponentServiceNg2} from "../../../../ng2/services/component-services/component.service";
-import {ComponentGenericResponse} from "../../../../ng2/services/responses/component-generic-response";
-
-interface IAttributesViewModelScope extends IWorkspaceViewModelScope {
- tableHeadersList:Array<any>;
- reverse:boolean;
- sortBy:string;
-
- addOrUpdateAttribute(attribute?:AttributeModel):void;
- delete(attribute:AttributeModel):void;
- sort(sortBy:string):void;
-}
-
-export class AttributesViewModel {
-
- static '$inject' = [
- '$scope',
- '$filter',
- '$uibModal',
- 'ModalsHandler',
- 'ComponentServiceNg2'
- ];
-
-
- constructor(private $scope:IAttributesViewModelScope,
- private $filter:ng.IFilterService,
- private $uibModal:ng.ui.bootstrap.IModalService,
- private ModalsHandler:ModalsHandler,
- private ComponentServiceNg2: ComponentServiceNg2) {
-
- this.initComponentAttributes();
- }
-
- private initComponentAttributes = () => {
- if(this.$scope.component.attributes) {
- this.initScope();
- } else {
- this.ComponentServiceNg2.getComponentAttributes(this.$scope.component).subscribe((response:ComponentGenericResponse) => {
- this.$scope.component.attributes = response.attributes;
- this.initScope();
- });
- }
- }
-
-
- private initScope = ():void => {
-
- this.$scope.sortBy = 'name';
- this.$scope.reverse = false;
- this.$scope.setValidState(true);
- this.$scope.tableHeadersList = [
- {title: 'Name', property: 'name'},
- {title: 'Type', property: 'type'},
- {title: 'Default Value', property: 'defaultValue'}
- ];
- this.$scope.sort = (sortBy:string):void => {
- this.$scope.reverse = (this.$scope.sortBy === sortBy) ? !this.$scope.reverse : false;
- this.$scope.sortBy = sortBy;
- };
-
- this.$scope.addOrUpdateAttribute = (attribute?:AttributeModel):void => {
- this.ModalsHandler.openEditAttributeModal(attribute ? attribute : new AttributeModel(), this.$scope.component);
- };
-
- this.$scope.delete = (attribute:AttributeModel):void => {
-
- let onOk = ():void => {
- this.$scope.component.deleteAttribute(attribute.uniqueId);
- };
- let title:string = this.$filter('translate')("ATTRIBUTE_VIEW_DELETE_MODAL_TITLE");
- let message:string = this.$filter('translate')("ATTRIBUTE_VIEW_DELETE_MODAL_TEXT", "{'name': '" + attribute.name + "'}");
- this.ModalsHandler.openConfirmationModal(title, message, false).then(onOk);
- };
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes-view.html b/catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes-view.html
deleted file mode 100644
index 675ae0c5c6..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes-view.html
+++ /dev/null
@@ -1,68 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<div class="workspace-attributes">
- <div class="add-btn" data-tests-id="add-attribute-button" ng-if="!isViewMode()"
- data-ng-class="{'disabled': isDisableMode()}" data-ng-click="addOrUpdateAttribute()" data-tests-id="add-attribute-button">Add</div>
- <div class="table-container-flex">
- <div class="table" data-ng-class="{'view-mode': isViewMode()}">
- <div class="head flex-container">
- <div class="table-header head-row hand flex-item" data-ng-repeat="header in tableHeadersList track by $index" data-ng-click="sort(header.property)">{{header.title}}
- <span data-ng-if="sortBy === header.property" class="table-header-sort-arrow" data-ng-class="{'down': reverse, 'up':!reverse}"> </span>
- </div>
- <div class="table-no-text-header head-row flex-item" ng-if="!isViewMode()"></div>
- <!--div class="table-no-text-header head-row flex-item"></div-->
- </div>
-
- <div class="body">
- <perfect-scrollbar scroll-y-margin-offset="0" include-padding="true" class="scrollbar-container">
- <div data-ng-if="component.attributes.length === 0" class="no-row-text" data-ng-class="{'disabled': isDisableMode()}">
- There are no attributes to display <br>
- <span ng-if="!isViewMode()"> click <a data-ng-click="addOrUpdateAttribute()">here</a> to add one </span>
-
- </div>
- <div data-ng-repeat-start="attribute in component.attributes | orderBy:sortBy:reverse track by $index"
- class="flex-container data-row" data-ng-class="{'selected': attribute.selected}"
- data-ng-click="attribute.selected = !attribute.selected" data-tests-id="attributes-table-row">
-
- <div class="table-col-general flex-item text">
- <span class="sprite table-arrow" data-ng-class="{'opened': attribute.selected}"></span>
- <span data-tests-id="{{attribute.name}}" tooltips tooltip-content="{{attribute.name}}">{{attribute.name}}</span>
-
- </div>
-
- <div class="table-col-general flex-item text" data-tests-id="{{attribute.type}}" data-ng-bind="attribute.type"></div>
-
- <div class="table-col-general flex-item text">
- <span tooltips tooltip-content="{{attribute.defaultValue}}" data-tests-id="{{attribute.defaultValue}}" data-ng-bind="attribute.defaultValue"></span>
- </div>
-
- <div class="table-btn-col flex-item" ng-if="!isViewMode()">
- <button class="table-edit-btn" data-tests-id="edit_{{attribute.name}}" data-ng-show="attribute.parentUniqueId==component.uniqueId"
- data-ng-click="addOrUpdateAttribute(attribute); $event.stopPropagation();" data-ng-class="{'disabled': isViewMode()}"> </button>
- <button class="table-delete-btn" data-tests-id="delete_{{attribute.name}}" data-ng-show="attribute.parentUniqueId==component.uniqueId"
- data-ng-click="delete(attribute); $event.stopPropagation();" data-ng-class="{'disabled': isViewMode()}"> </button>
- </div>
- </div>
- <div data-ng-repeat-end="" data-ng-if="attribute.selected && attribute.description" class="item-opened" data-ng-bind="attribute.description">
- </div>
- </perfect-scrollbar>
- </div>
-
- </div>
- </div>
-
-</div>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes.less b/catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes.less
deleted file mode 100644
index 932daa167d..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/attributes/attributes.less
+++ /dev/null
@@ -1,54 +0,0 @@
-.workspace-attributes {
-
- width: 93%;
- display: inline-block;
- .w-sdc-classic-btn {
- float: right;
- margin-bottom: 10px;
- }
-
- .table{
- height:490px;
- margin-bottom: 0;
- }
-
- .table-container-flex {
- margin-top: 0;
-
- .text{
- overflow: hidden;
- text-overflow: ellipsis;
- display: inline-block;
- white-space: nowrap;
- }
-
- .flex-item:nth-child(1) {
- flex-grow: 15;
-
- .hand;
- span.table-arrow {
- margin-right: 7px;
- }
- }
-
- .flex-item:nth-child(2) {
- flex-grow: 6;
- }
-
- .flex-item:nth-child(3) {
- flex-grow: 9;
- }
-
- .flex-item:nth-child(4) {
- flex-grow: 3;
- padding-top: 10px;
- }
-
- .flex-item:nth-child(5) {
- flex-grow: 1;
-
- }
-
- }
-
-}
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
deleted file mode 100644
index 2270a7b06e..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view-model.ts
+++ /dev/null
@@ -1,501 +0,0 @@
-/*-
- * ============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=========================================================
- */
-'use strict';
-import * as _ from "lodash";
-import { Component, ComponentInstance, IAppMenu, Requirement, Capability, ButtonModel } from "app/models";
-import { SharingService, CacheService, EventListenerService, LeftPaletteLoaderService } from "app/services";
-import { ModalsHandler, GRAPH_EVENTS, ComponentFactory, ChangeLifecycleStateHandler, MenuHandler, EVENTS, ComponentInstanceFactory } from "app/utils";
-import { IWorkspaceViewModelScope } from "../../workspace-view-model";
-import { ComponentGenericResponse } from "app/ng2/services/responses/component-generic-response";
-import { Resource } from "app/models/components/resource";
-import { ResourceType, ComponentType } from "app/utils/constants";
-import { ComponentServiceFactoryNg2 } from "app/ng2/services/component-services/component.service.factory";
-import { ServiceGenericResponse } from "app/ng2/services/responses/service-generic-response";
-import { Service } from "app/models/components/service";
-import { ZoneInstance } from "app/models/graph/zones/zone-instance";
-import { ComponentServiceNg2 } from "app/ng2/services/component-services/component.service";
-import { ModalService as ModalServiceSdcUI} from "sdc-ui/lib/angular/modals/modal.service"
-import { IModalConfig, IModalButtonComponent } from "sdc-ui/lib/angular/modals/models/modal-config";
-import { ValueEditComponent } from "app/ng2/components/ui/forms/value-edit/value-edit.component";
-import { UnsavedChangesComponent } from "../../../../ng2/components/ui/forms/unsaved-changes/unsaved-changes.component";
-import { ModalButtonComponent } from "sdc-ui/lib/angular/components";
-
-
-
-export interface ICompositionViewModelScope extends IWorkspaceViewModelScope {
-
- currentComponent:Component;
-
- //Added for now, in the future need to remove and use only id and type to pass to tabs.
- selectedComponent: Component;
- selectedZoneInstance: ZoneInstance;
-
- componentInstanceNames: Array<string>;
- isLoading:boolean;
- graphApi:any;
- sharingService:SharingService;
- sdcMenu:IAppMenu;
- version:string;
- isViewOnly:boolean;
- isCanvasTagging:boolean;
- isLoadingRightPanel:boolean;
- disabledTabs:boolean;
- openVersionChangeModal(pathsToDelete:string[]):ng.IPromise<any>;
- onComponentInstanceVersionChange(component:Component);
- isComponentInstanceSelected():boolean;
- updateSelectedComponent():void;
- openUpdateModal();
- deleteSelectedComponentInstance():void;
- onBackgroundClick():void;
- setSelectedInstance(componentInstance:ComponentInstance):void;
- setSelectedZoneInstance(zoneInstance: ZoneInstance):void;
- changeZoneInstanceName(newName:string):void;
- printScreen():void;
- isPNF():boolean;
- isConfiguration():boolean;
- preventMoveTab(state: boolean):void;
- registerCreateInstanceEvent(callback: Function):void;
- unregisterCreateInstanceEvent():void;
- registerChangeComponentInstanceNameEvent(callback: Function):void;
- unregisterChangeComponentInstanceNameEvent():void;
-
- ComponentServiceNg2:ComponentServiceNg2,
- cacheComponentsInstancesFullData:Component;
-}
-
-export class CompositionViewModel {
-
- static '$inject' = [
- '$scope',
- '$log',
- 'sdcMenu',
- 'MenuHandler',
- '$uibModal',
- '$state',
- 'Sdc.Services.SharingService',
- '$filter',
- 'Sdc.Services.CacheService',
- 'ComponentFactory',
- 'ChangeLifecycleStateHandler',
- 'LeftPaletteLoaderService',
- 'ModalsHandler',
- 'ModalServiceSdcUI',
- 'EventListenerService',
- 'ComponentServiceFactoryNg2',
- 'ComponentServiceNg2',
- 'Notification'
- ];
-
- constructor(private $scope:ICompositionViewModelScope,
- private $log:ng.ILogService,
- private sdcMenu:IAppMenu,
- private MenuHandler:MenuHandler,
- private $uibModal:ng.ui.bootstrap.IModalService,
- private $state:ng.ui.IStateService,
- private sharingService:SharingService,
- private $filter:ng.IFilterService,
- private cacheService:CacheService,
- private ComponentFactory:ComponentFactory,
- private ChangeLifecycleStateHandler:ChangeLifecycleStateHandler,
- private LeftPaletteLoaderService:LeftPaletteLoaderService,
- private ModalsHandler:ModalsHandler,
- private ModalServiceSdcUI: ModalServiceSdcUI,
- private eventListenerService:EventListenerService,
- private ComponentServiceFactoryNg2: ComponentServiceFactoryNg2,
- private ComponentServiceNg2:ComponentServiceNg2,
- private Notification:any
- ) {
-
- this.$scope.setValidState(true);
- this.initScope();
- this.initGraphData();
- this.registerGraphEvents(this.$scope);
- }
-
-
- private initGraphData = ():void => {
- if(!this.hasCompositionGraphData(this.$scope.component)) {
- this.$scope.isLoading = true;
- let service = this.ComponentServiceFactoryNg2.getComponentService(this.$scope.component);
- service.getComponentCompositionData(this.$scope.component).subscribe((response:ComponentGenericResponse) => {
- if (this.$scope.component.isService()) {
- (<Service> this.$scope.component).forwardingPaths = (<ServiceGenericResponse>response).forwardingPaths;
- }
- this.$scope.component.componentInstances = response.componentInstances || [];
- this.$scope.component.componentInstancesRelations = response.componentInstancesRelations || [];
- this.$scope.component.policies = response.policies || [];
- this.$scope.component.groupInstances = response.groupInstances || [];
- this.$scope.isLoading = false;
- this.initComponent();
- this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_COMPOSITION_GRAPH_DATA_LOADED);
- });
- } else {
- this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_COMPOSITION_GRAPH_DATA_LOADED);
- }
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_COMPOSITION_GRAPH_DATA_LOADED);
- };
-
- private hasCompositionGraphData = (component:Component):boolean => {
- return !!(component.componentInstances && component.componentInstancesRelations && component.policies && component.groupInstances);
- };
-
- private cacheComponentsInstancesFullData:Array<Component>;
-
- private initComponent = ():void => {
- this.$scope.currentComponent = this.$scope.component;
- this.$scope.selectedComponent = this.$scope.currentComponent;
- this.$scope.selectedZoneInstance = null;
- this.updateUuidMap();
- this.$scope.isViewOnly = this.$scope.isViewMode();
- };
-
- private registerGraphEvents = (scope:ICompositionViewModelScope):void => {
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_NODE_SELECTED, scope.setSelectedInstance);
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_ZONE_INSTANCE_SELECTED, scope.setSelectedZoneInstance);
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_GRAPH_BACKGROUND_CLICKED, scope.onBackgroundClick);
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_CANVAS_TAG_START, () => {
- scope.isCanvasTagging = true;
- this.eventListenerService.notifyObservers(EVENTS.ON_WORKSPACE_UNSAVED_CHANGES, true, this.showUnsavedChangesAlert);
- });
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_CANVAS_TAG_END, () => {
- scope.isCanvasTagging = false;
- this.resetUnsavedChanges();
- });
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_ZONE_INSTANCE_NAME_CHANGED, scope.changeZoneInstanceName);
- this.eventListenerService.registerObserverCallback(EVENTS.UPDATE_PANEL, this.removeSelectedZoneInstance);
- };
-
- private showUnsavedChangesAlert = (afterSave?:Function):Promise<any> => {
- let deferred = new Promise<any>((resolve, reject)=> {
- const modal = this.ModalServiceSdcUI.openCustomModal(
- {
- title: "Unsaved Changes",
- size: 'sm',
- type: 'custom',
-
- buttons: [
- {id: 'cancelButton', text: 'Cancel', type: 'secondary', size: 'xsm', closeModal: true, callback: () => reject()},
- {id: 'discardButton', text: 'Discard', type: 'secondary', size: 'xsm', closeModal: true, callback: () => { this.resetUnsavedChanges(); resolve()}},
- {id: 'saveButton', text: 'Save', type: 'primary', size: 'xsm', closeModal: true, callback: () => { reject(); this.saveUnsavedChanges(afterSave); }}
- ] as IModalButtonComponent[]
- }, UnsavedChangesComponent, { isValidChangedData: true});
- });
-
- return deferred;
- }
-
- private unRegisterGraphEvents = (scope: ICompositionViewModelScope):void => {
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_NODE_SELECTED, scope.setSelectedInstance);
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_ZONE_INSTANCE_SELECTED, scope.setSelectedZoneInstance);
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_GRAPH_BACKGROUND_CLICKED, scope.onBackgroundClick);
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_CANVAS_TAG_START);
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_CANVAS_TAG_END);
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_ZONE_INSTANCE_NAME_CHANGED, scope.changeZoneInstanceName);
- this.eventListenerService.unRegisterObserver(EVENTS.UPDATE_PANEL, this.removeSelectedZoneInstance);
-
- };
-
- private resetUnsavedChanges = () => {
- this.eventListenerService.notifyObservers(EVENTS.ON_WORKSPACE_UNSAVED_CHANGES, false);
- }
-
- private saveUnsavedChanges = (afterSaveFunction?:Function):void => {
- this.$scope.selectedZoneInstance.forceSave.next(afterSaveFunction);
- this.eventListenerService.notifyObservers(EVENTS.ON_WORKSPACE_UNSAVED_CHANGES, false);
- }
-
- private openUpdateComponentInstanceNameModal = ():void => {
-
- let modalConfig:IModalConfig = {
- title: "Edit Name",
- size: "sm",
- type: "custom",
- testId: "renameInstanceModal",
- buttons: [
- {id: 'saveButton', text: 'OK', size: 'xsm', callback: this.saveInstanceName, closeModal: false},
- {id: 'cancelButton', text: 'Cancel', size: 'sm', closeModal: true}
- ]
- };
-
- this.ModalServiceSdcUI.openCustomModal(modalConfig, ValueEditComponent, {name: this.$scope.currentComponent.selectedInstance.name, validityChangedCallback: this.enableOrDisableSaveButton});
-
- };
-
-
- private enableOrDisableSaveButton = (shouldEnable: boolean): void => {
- let saveButton: ModalButtonComponent = this.ModalServiceSdcUI.getCurrentInstance().getButtonById('saveButton');
- saveButton.disabled = !shouldEnable;
- }
-
- private saveInstanceName = () => {
- let currentModal = this.ModalServiceSdcUI.getCurrentInstance();
- let nameFromModal:string = currentModal.innerModalContent.instance.name;
-
- if(nameFromModal != this.$scope.currentComponent.selectedInstance.name){
- currentModal.buttons[0].disabled = true;
- let componentInstanceModel:ComponentInstance = ComponentInstanceFactory.createComponentInstance(this.$scope.currentComponent.selectedInstance);
- componentInstanceModel.name = nameFromModal;
-
- let onFailed = (error) => {
- currentModal.buttons[0].disabled = false;
- };
- let onSuccess = (componentInstance:ComponentInstance) => {
-
- this.$scope.currentComponent.selectedInstance.name = componentInstance.name;
- //update requirements and capabilities owner name
- _.forEach(this.$scope.currentComponent.selectedInstance.requirements, (requirementsArray:Array<Requirement>) => {
- _.forEach(requirementsArray, (requirement:Requirement):void => {
- requirement.ownerName = componentInstance.name;
- });
- });
-
- _.forEach(this.$scope.currentComponent.selectedInstance.capabilities, (capabilitiesArray:Array<Capability>) => {
- _.forEach(capabilitiesArray, (capability:Capability):void => {
- capability.ownerName = componentInstance.name;
- });
- });
- this.ModalServiceSdcUI.closeModal();
- this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_COMPONENT_INSTANCE_NAME_CHANGED, this.$scope.currentComponent.selectedInstance);
- };
-
- this.$scope.currentComponent.updateComponentInstance(componentInstanceModel).then(onSuccess, onFailed);
- } else {
- this.ModalServiceSdcUI.closeModal();
- }
-
- };
-
- private removeSelectedComponentInstance = ():void => {
- this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_DELETE_COMPONENT_INSTANCE, this.$scope.currentComponent.selectedInstance)
- this.$scope.currentComponent.selectedInstance = null;
- this.$scope.selectedComponent = this.$scope.currentComponent;
- };
-
- private removeSelectedZoneInstance = ():void => {
- this.$scope.currentComponent.selectedInstance = null;
- this.$scope.selectedZoneInstance = null;
- this.$scope.selectedComponent = this.$scope.currentComponent;
- }
-
- private updateUuidMap = ():void => {
- /**
- * In case user press F5, the page is refreshed and this.sharingService.currentEntity will be undefined,
- * but after loadService or loadResource this.sharingService.currentEntity will be defined.
- * Need to update the uuidMap with the new resource or service.
- */
- this.sharingService.addUuidValue(this.$scope.currentComponent.uniqueId, this.$scope.currentComponent.uuid);
- };
-
- private initScope = ():void => {
- this.$scope.sharingService = this.sharingService;
- this.$scope.sdcMenu = this.sdcMenu;
- this.$scope.isLoading = false;
- this.$scope.isLoadingRightPanel = false;
- this.$scope.isCanvasTagging = false;
- this.$scope.graphApi = {};
- this.$scope.version = this.cacheService.get('version');
- this.initComponent();
-
- this.cacheComponentsInstancesFullData = new Array<Component>();
-
- this.$scope.isComponentInstanceSelected = ():boolean => {
- return this.$scope.currentComponent && this.$scope.currentComponent.selectedInstance != undefined && this.$scope.currentComponent.selectedInstance != null;
- };
-
- this.$scope.$on('$destroy', () => {
- this.unRegisterGraphEvents(this.$scope);
- })
-
- this.$scope.restoreComponent = ():void => {
- this.ComponentServiceNg2.restoreComponent(this.$scope.selectedComponent.componentType, this.$scope.selectedComponent.uniqueId).subscribe(() => {
- this.Notification.success({
- message: '&lt;' + this.$scope.component.name + '&gt; ' + this.$filter('translate')("ARCHIVE_SUCCESS_MESSAGE_TEXT"),
- title: this.$filter('translate')("ARCHIVE_SUCCESS_MESSAGE_TITLE")
- });
- this.$scope.selectedComponent.archived = false;
- }
- )
- };
-
- 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 === parentComponentUid;
- });
- if (componentParent) {
- this.$scope.selectedComponent = componentParent;
- }
- else {
- try {
- let onSuccess = (component:Component) => {
- this.$scope.isLoadingRightPanel = false;
- this.$scope.selectedComponent = component;
- this.cacheComponentsInstancesFullData.push(component);
- };
- let onError = (component:Component) => {
- console.log("Error updating selected component");
- this.$scope.isLoadingRightPanel = false;
- };
- 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;
- }
- }
- }
- else {
-
- this.$scope.selectedComponent = this.$scope.currentComponent;
- }
- };
-
- this.$scope.setSelectedInstance = (selectedComponent:ComponentInstance):void => {
-
- this.$log.debug('composition-view-model::onNodeSelected:: with id: ' + selectedComponent.uniqueId);
- this.$scope.currentComponent.setSelectedInstance(selectedComponent);
- this.$scope.selectedZoneInstance = null;
- this.$scope.updateSelectedComponent();
-
- if (this.$state.current.name === 'workspace.composition.api') {
- this.$state.go('workspace.composition.details');
- }
- if(!selectedComponent.isServiceProxy() && (this.$state.current.name === 'workspace.composition.consumption' || this.$state.current.name === 'workspace.composition.dependencies')) {
- this.$state.go('workspace.composition.details');
- }
- };
-
- this.$scope.setSelectedZoneInstance = (zoneInstance: ZoneInstance): void => {
- this.$scope.currentComponent.selectedInstance = null;
- this.$scope.selectedZoneInstance = zoneInstance;
- };
-
- this.$scope.onBackgroundClick = ():void => {
- this.$scope.currentComponent.selectedInstance = null;
- this.$scope.selectedZoneInstance = null;
- this.$scope.selectedComponent = this.$scope.currentComponent;
-
- if (this.$state.current.name === 'workspace.composition.api' || this.$state.current.name === 'workspace.composition.consumption' || this.$state.current.name === 'workspace.composition.dependencies') {
- this.$state.go('workspace.composition.details');
- }
-
- if(this.$scope.selectedComponent.isService() && this.$state.current.name === 'workspace.composition.relations'){
- this.$state.go('workspace.composition.api');
- }
- };
-
- this.$scope.openUpdateModal = ():void => {
- this.openUpdateComponentInstanceNameModal();
- };
-
- this.$scope.changeZoneInstanceName = (newName:string):void => {
- this.$scope.selectedZoneInstance.instanceData.name = newName;
- };
-
- this.$scope.deleteSelectedComponentInstance = ():void => {
- const {currentComponent} = this.$scope;
- const {title, message} = this.$scope.sdcMenu.alertMessages['deleteInstance'];
- let modalText = message.format([currentComponent.selectedInstance.name]);
-
- if (currentComponent.isService()) {
- const {forwardingPaths} = (<Service>currentComponent);
- const instanceId = currentComponent.selectedInstance.uniqueId;
-
- const relatedPaths = _.filter(forwardingPaths, forwardingPath => {
- const pathElements = forwardingPath.pathElements.listToscaDataDefinition;
- return pathElements.find(path => path.fromNode === instanceId || path.toNode === instanceId);
- });
-
- if (relatedPaths.length) {
- const pathNames = _.map(relatedPaths, path => path.name).join(', ');
- modalText += `<p>The following service paths will be erased: ${pathNames}</p>`;
- }
- }
- this.ModalServiceSdcUI.openAlertModal(title, modalText, "OK", this.removeSelectedComponentInstance, "deleteInstanceModal");
- };
-
- this.$scope.openVersionChangeModal = (pathsToDelete:string[]):ng.IPromise<any> => {
- const {currentComponent} = this.$scope;
- const {forwardingPaths} = <Service>currentComponent;
-
- const relatedPaths = _.filter(forwardingPaths, path =>
- _.find(pathsToDelete, id =>
- path.uniqueId === id
- )
- ).map(path => path.name);
- const pathNames = _.join(relatedPaths, ', ') || 'none';
-
- const {title, message} = this.$scope.sdcMenu.alertMessages['upgradeInstance'];
- return this.ModalsHandler.openConfirmationModal(title, message.format([pathNames]), false);
- };
-
- this.$scope.onComponentInstanceVersionChange = (component:Component):void => {
- let onChange = () => {
- this.$scope.currentComponent = component;
- this.$scope.setComponent(this.$scope.currentComponent);
- this.$scope.updateSelectedComponent();
- this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_VERSION_CHANGED, this.$scope.currentComponent);
- };
-
- if (component.isService()) {
- const service = this.ComponentServiceFactoryNg2.getComponentService(component);
- service.getComponentCompositionData(component).subscribe((response:ServiceGenericResponse) => {
- (<Service>component).forwardingPaths = response.forwardingPaths;
- onChange();
- });
- } else {
- onChange();
- }
- };
-
- this.$scope.isPNF = (): boolean => {
- 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.$scope.preventMoveTab = (state: boolean): void => {
- this.$scope.disabledTabs = state;
- };
-
- this.eventListenerService.registerObserverCallback(EVENTS.ON_LIFECYCLE_CHANGE, this.$scope.reload);
-
- this.$scope.registerCreateInstanceEvent = (callback: Function): void => {
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_CREATE_COMPONENT_INSTANCE, callback);
- };
-
- this.$scope.unregisterCreateInstanceEvent = (): void => {
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_CREATE_COMPONENT_INSTANCE);
- };
-
- this.$scope.registerChangeComponentInstanceNameEvent = (callback: Function): void => {
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_COMPONENT_INSTANCE_NAME_CHANGED, callback);
- };
-
- this.$scope.unregisterChangeComponentInstanceNameEvent = (): void => {
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_COMPONENT_INSTANCE_NAME_CHANGED);
- };
- }
-}
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
deleted file mode 100644
index c2d6007edc..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition-view.html
+++ /dev/null
@@ -1,159 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<div class="workspace-composition">
- <loader data-display="isLoading"></loader>
- <div class="w-sdc-designer-canvas" data-ng-class="{sidebaractive: displayDesignerRightSidebar}">
- <palette current-component="currentComponent"
- is-view-only="isViewOnly || isCanvasTagging"
- is-loading="isLoading"></palette>
-
- <ng2-palette-popup-panel></ng2-palette-popup-panel>
-
- <composition-graph component="currentComponent" data-tests-id="canvas"
- is-view-only="isViewOnly" with-sidebar="displayDesignerRightSidebar"></composition-graph>
- </div>
-
- <div class="w-sdc-designer-sidebar-toggle" data-ng-class="{'active': displayDesignerRightSidebar}"
- data-ng-init="displayDesignerRightSidebar = true"
- data-ng-click="displayDesignerRightSidebar = !displayDesignerRightSidebar">
- <div class="w-sdc-designer-sidebar-toggle-icon sprite-new pointer menu-open-left"></div>
- </div>
-
- <div class="w-sdc-designer-sidebar" data-ng-class="{'view-mode':isViewOnly}">
-
- <div ng-if="!selectedZoneInstance">
-
- <div class="w-sdc-designer-sidebar-head" data-tests-id="w-sdc-designer-sidebar-head">
- <div class="w-sdc-designer-sidebar-logo-ph">
- <div class=" large {{selectedComponent.iconSprite}} {{selectedComponent.icon}}"
- ng-class="{'archive-component':selectedComponent.archived}">
- <div ng-if="isComponentInstanceSelected()"
- data-ng-class="{'non-certified':'CERTIFIED' !== selectedComponent.lifecycleState}"
- tooltips tooltip-side="top" tooltip-content="Not certified"></div>
- </div>
- </div>
-
- <div class="w-sdc-designer-sidebar-logo">
- <span class="w-sdc-designer-sidebar-logo-title" data-tests-id="selectedCompTitle" tooltips
- tooltip-class="tooltip-custom break-word-tooltip"
- tooltip-content="&#8203;{{isComponentInstanceSelected() ? currentComponent.selectedInstance.name : currentComponent.name | resourceName}}"
- data-ng-bind="isComponentInstanceSelected() ? currentComponent.selectedInstance.name : currentComponent.name | resourceName"></span>
- </div>
- <div class="sprite e-sdc-small-icon-pencil w-sdc-designer-update-resource-icon"
- data-tests-id="renameInstance"
- data-ng-if="!isViewOnly && isComponentInstanceSelected() && !selectedComponent.archived"
- data-ng-click="openUpdateModal()" id="editPencil"></div>
-
- <div class="sprite e-sdc-small-icon-delete w-sdc-designer-delete-resource-icon"
- data-tests-id="deleteInstance"
- data-ng-if="!isViewOnly && isComponentInstanceSelected() && !selectedComponent.archived"
- data-ng-click="!isLoading && deleteSelectedComponentInstance()" title="Delete Resource Instance"></div>
- </div>
-
- <div class="w-sdc-designer-sidebar-tabs">
- <button class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active"
- data-ui-sref="workspace.composition.details"
- tooltips tooltip-class="tooltip-custom tab-tooltip" tooltip-content="Information"
- data-tests-id="information-tab"
- data-ng-class="{'disabled': disabledTabs}">
- <div class="i-sdc-designer-sidebar-tab-icon sprite-new info"></div>
- </button>
- <!--<button class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active"-->
- <!--ui-sref="workspace.composition.structure"-->
- <!--tooltips tooltip-class="tooltip-custom tab-tooltip" tooltip-content="Composition">-->
- <!--<div class="i-sdc-designer-sidebar-tab-icon sprite-new structure"></div>-->
- <!--</button>-->
- <button class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active"
- 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="!isConfiguration() && !(isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy())"
- data-ng-class="{'disabled': disabledTabs}">
- <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() || (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"
- data-ng-class="{'disabled': disabledTabs}">
- <div class="i-sdc-designer-sidebar-tab-icon sprite-new"
- 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"
- data-ng-class="{'disabled': disabledTabs}">
- <div class="i-sdc-designer-sidebar-tab-icon sprite-new information-artifacts"></div>
- </button>
- <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 {{currentComponent.selectedInstance.isServiceProxy() ? '' : 'tooltip-rightside'}}"
- data-tests-id="requirements-and-capabilities"
- tooltip-content="Requirements and Capabilities"
- data-ng-class="{'disabled': disabledTabs}">
- <div class="i-sdc-designer-sidebar-tab-icon sprite-new relations"></div>
- </button>
- <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"
- data-ng-class="{'disabled': disabledTabs}">
- <div class="i-sdc-designer-sidebar-tab-icon sprite-new api"></div>
- </button>
- <button class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active"
- data-ui-sref="workspace.composition.consumption"
- tooltips tooltip-class="tooltip-custom tab-tooltip" tooltip-content="Operation Consumption"
- data-tests-id="service-consumption-tab"
- data-ng-if="(isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy())"
- data-ng-class="{'disabled': disabledTabs}">
- <div class="i-sdc-designer-sidebar-tab-icon sprite-new import-icon"></div>
- </button>
- <button class="i-sdc-designer-sidebar-tab" data-ui-sref-active="active"
- data-ui-sref="workspace.composition.dependencies"
- tooltips tooltip-class="tooltip-custom tab-tooltip " tooltip-content="Service Dependencies"
- data-tests-id="service-dependency-tab"
- data-ng-if="(isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy())"
- data-ng-class="{'disabled': disabledTabs}">
- <div class="i-sdc-designer-sidebar-tab-icon sprite-new dependencies-icon"></div>
- </button>
-
- </div>
- <div data-ui-view="" class="w-sdc-designer-sidebar-tab-content-view"></div>
-
- </div>
-
- <!-- Solution for now to support policies and groups working with Angular 2 components -->
- <!-- isCertified not relevant for group or policy -->
- <!-- (selectedZoneInstanceType === ZoneInstanceType.GROUP || selectedZoneInstanceType === ZoneInstanceType.POLICY) -->
- <div ng-if="selectedZoneInstance">
-
- <ng2-composition-panel
- [is-loading]="isLoading"
- [is-view-only]="isViewOnly || isCanvasTagging"
- [selected-zone-instance-name]="selectedZoneInstance.instanceData.name"
- [selected-zone-instance-id]="selectedZoneInstance.instanceData.uniqueId"
- [selected-zone-instance-type]="selectedZoneInstance.type"
- [topology-template]="currentComponent"
- >
- </ng2-composition-panel>
- </div>
-
- <loader data-display="isLoadingRightPanel" relative="true" size="medium"></loader>
-
- </div>
-</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
deleted file mode 100644
index f37a492572..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/composition.less
+++ /dev/null
@@ -1,955 +0,0 @@
- .i-sdc-designer-leftbar-section-popup-panel {
- position: absolute;
- display: inline-block;
- background-color: white;
- border: solid 1px #d2d2d2;
- border-top: solid 3px #13a7df;
- width: 140px;
- height: 40px;
- z-index: 10000;
- }
-
- .i-sdc-designer-leftbar-section-popup-panel-group {
- padding-left: 8px;
- padding-top: 8px;
- }
-
- .i-sdc-designer-leftbar-section-popup-panel-plus {
- border-radius: 50%;
- color: white;
- background-color: #13a7df;
- width: 20px;
- text-align: center;
- display: inline-block;
- cursor: pointer;
- }
-
- .i-sdc-designer-leftbar-section-popup-panel-title {
- padding-left: 10px;
- display: inline-block;
- }
-
-.composition{
- .sdc-workspace-container{
- .w-sdc-main-container{
- .w-sdc-main-right-container{
- left:0;
- //overflow-y: scroll;
- .sdc-workspace-top-bar {
- padding-left: 295px;
- .not-latest{
- left: 270px;
- }
- }
- .w-sdc-main-container-body-content{
- padding: 0 0 0 247px;
- }
-
- > div:first-child{
- padding: 0;
- }
- }
- }
- }
-
- .custom-modal {
- /* Hack solution to hide canvas tooltips under modals */
- z-index: 20000 !important;
- }
-}
-
-.workspace-composition {
- height:100%;
- display: block;
- text-align: left;
- align-items: left;
- padding: 0;
-
-
-
- // ---------------------------------------------------------------------------------------------------
- // Sidebar
- // ---------------------------------------------------------------------------------------------------
-
-
-
- .w-sdc-designer-sidebar-toggle {
- background-color: @main_color_p;
- border-left: 1px solid @main_color_o;
- border-bottom: 1px solid @main_color_o;
- height: 21px;
- position: absolute;
- right: 0;
- top: 53px;
- width: 17px;
- transition: right 0.2s;
- z-index: 10;
- .box-shadow(-1px 1px 3px 0 @main_color_n);
-
- &.active {
- right: 302px;
- .w-sdc-designer-sidebar-toggle-icon{
- transform: rotate(180deg);
- }
- }
-
- }
-
- .w-sdc-designer-sidebar-toggle-icon {
- margin-left: 6px;
- margin-top: 6px;
- }
-
- .w-sdc-designer-sidebar {
- background-color:@main_color_p ;
- .noselect;
- bottom: 0;
- position: fixed;
- right: -302px;
- width: 302px;
- top: 103px;
- transition: right 0.2s;
- z-index: 9;
- .box-shadow(-7px -3px 6px -8px @main_color_n);
-
- }
-
- .w-sdc-designer-sidebar-toggle.active + .w-sdc-designer-sidebar {
- right: 0;
-
- }
-
- .w-sdc-designer-sidebar-head {
- padding: 36px 30px 30px 30px;
- height: 120px;
- }
-
- .w-sdc-designer-sidebar-logo-ph {
- display: inline-block;
- vertical-align: middle;
- line-height: 60px;
- height: 60px;
- }
-
- .w-sdc-designer-sidebar-logo {
- .g_6;
- display: inline-block;
- margin-left: 10px;
- font-weight: 500;
- }
-
- .w-sdc-designer-sidebar-logo-title {
- .s_16_r;
- .selectable;
- vertical-align: middle;
- text-overflow: ellipsis;
- max-width: 167px;
- display: inline-block;
- white-space: nowrap;
- overflow: hidden;
- }
-
- .w-sdc-designer-update-resource-icon {
- .hand;
- position: absolute;
- right: 20px;
- top: 10px;
- }
-
- .w-sdc-designer-delete-resource-icon {
- .hand;
- position: absolute;
- right: 40px;
- top: 10px;
- }
-
- .w-sdc-designer-restore-button {
- .hand;
- position:absolute;
- right: 20px;
- top:10px;
- width:65px;
- }
- .w-sdc-designer-sidebar-tabs {
- .bg_c;
- }
-
- .w-sdc-designer-sidebar-tabs::after {
- clear: both;
- content: '';
- display: table;
- }
-
- .i-sdc-designer-sidebar-tab {
- background-color: @main_color_p;
- border: 1px solid @tlv_color_u;;
- border-left: none;
- display: inline-block;
- float: left;
- height: 36px;
- padding-top: 9px;
- text-align: center;
- width: 60px;
- .hand;
-
- &:focus {
- outline: none;
- }
- &.tab-disabled {
- /* .disabled; */
- }
- &.active, &:hover:enabled {
- background-color: @tlv_color_u;
- .i-sdc-designer-sidebar-tab-icon {
- opacity: 1;
-
-
- }
-
- }
-
- div& {
- padding-top: 0;
- }
- /*for tooltip on disabled buttons*/
- }
-
- .i-sdc-designer-sidebar-tab-icon {
- margin-top: 5px ;
- &.import-icon {
- transform: rotate(270deg);
- }
- // opacity: .4;
- }
-
- .w-sdc-designer-sidebar-tab-content {
- .perfect-scrollbar;
- height: 100%;
- }
-
- .w-sdc-designer-sidebar-tab-content-view {
- position: absolute;
- top: 156px;
- bottom: 0;
- width: 100%;
- padding-bottom: 10px;
-
- }
-
- .w-sdc-designer-sidebar-section {
- }
-
- .w-sdc-designer-sidebar-section-title {
- .m_14_m;
- background-color: @tlv_color_u;
- .hand;
- clear: both;
- height: 32px;
- line-height: 32px;
- margin-top: 1px;
- padding: 0 10px 0 20px;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- position: relative;
- width: 100%;
- display: block;
-
- &.expanded {
- .w-sdc-designer-sidebar-section-title-icon {
- transform: rotate(180deg);
- }
- }
- }
-
- .w-sdc-designer-sidebar-section-title-text {
- max-width: 240px;
- display: inline-block;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- position: relative;
- }
-
- .w-sdc-designer-sidebar-section-title-icon {
- .hand;
- .sprite-new;
- .arrow-up;
- right: 16px;
- top: 13px;
- transition: .3s all;
- position: absolute;
- }
-
- .w-sdc-designer-sidebar-section-content {
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- }
-
- .w-sdc-designer-sidebar-section-title {
- text-transform: uppercase;
- }
-
- .w-sdc-designer-sidebar-section-title + .w-sdc-designer-sidebar-section-content {
- margin: 0 auto;
- }
-
- .w-sdc-designer-sidebar-section-title.expanded + .w-sdc-designer-sidebar-section-content {
- margin: 0 auto 1px;
-
- }
-
- .i-sdc-designer-sidebar-section-content-item {
- .b_7;
- font-size: 13px;
- margin-bottom: 5px;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- //max-width: 250px;
-
- &.description {
- margin-top: 28px;
- white-space: normal;
- word-wrap: break-word;
- }
- }
-
- .i-sdc-designer-sidebar-section-content-item-tag {
- .g_7;
- .bg_c;
- border-radius: 4px;
- //fix long name for firefox:
- display: block;
- float: left;
- line-height: 25px;
- margin: 0 4px 6px 0;
- min-width: 50px;
- padding: 0 9px;
- text-align: center;
- max-width: 280px;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- }
-
- .w-sdc-designer-sidebar-section-footer {
- margin-top: 10px;
- text-align: center;
- width: 100%;
- }
-
-
-
- .w-sdc-designer-sidebar-section-footer-action {
- width: 180px;
- margin-top: 10px;
- }
-
- //////////////////////Relationship
- .w-sdc-designer-sidebar-section-requirements {
- border-bottom: 1px solid @color_e;
- margin: 0 13px 20px 13px;
- padding: 15px 0 0;
- }
-
- .w-sdc-designer-sidebar-section-requirements-item {
- margin-bottom: 20px;
- }
-
- .w-sdc-designer-sidebar-section-requirements-label {
- display: inline-block;
- overflow: hidden;
- text-overflow: ellipsis;
- vertical-align: middle;
- white-space: nowrap;
- width: 102px;
- }
-
- .w-sdc-designer-sidebar-section-requirements-select {
- border: 1px solid @color_e;
- min-height: 30px;
- padding: 4px 13px;
- width: 168px;
- }
-
- //////////////////////Properties
- .i-sdc-designer-sidebar-section-content-item-property-and-attribute {
- .b_7;
- border-bottom: 1px solid @color_e;
- min-height: 72px;
- padding: 15px 10px 10px 18px;
- position: relative;
-
- &:first-child {
- //margin-top: -18px;
- }
-
- &:hover {
- // .bg_c_hover;
- .bg_c;
- transition: all .3s;
-
- .i-sdc-designer-sidebar-section-content-item-button {
- display: block;
- }
- }
- }
-
- .i-sdc-designer-sidebar-section-content-item-property-and-attribute-label {
- overflow: hidden;
- text-overflow: ellipsis;
- max-width: 200px;
- white-space: nowrap;
- display: inline-block;
- &:hover {
- .a_7;
- }
- }
-
- .i-sdc-designer-sidebar-section-content-item-property-value {
- overflow: hidden;
- text-overflow: ellipsis;
- max-width: 200px;
- display: inline-block;
- white-space: nowrap;
-
- }
-
- .i-sdc-designer-sidebar-section-content-item-property-label-value {
- }
-
- .i-sdc-designer-sidebar-section-content-item-button {
- display: none;
- position: absolute;
- top: 25px;
-
- &.update {
- background-color: transparent;
- border: 0;
- right: 60px;
- }
-
- &.delete {
- background-color: transparent;
- border: 0;
- right: 13px;
- }
-
- &.download {
- background-color: transparent;
- border: 0;
- right: 35px;
- }
-
- &.download-env {
- background-color: transparent;
- border: 0;
- right: 35px;
- margin-top: 65px;
- }
-
- &.update-env {
- background-color: transparent;
- border: 0;
- right: 15px;
- margin-top: 65px;
- }
-
- &.attach {
- background-color: transparent;
- border: 0;
- right: 15px;
- }
- }
-
- // ---------------------------------------------------------------------------------------------------
- // Canvas
- // ---------------------------------------------------------------------------------------------------
- .w-sdc-designer-canvas {
- height:100%;
- .noselect;
- .bg_c;
- bottom: 0;
- // position: fixed;
- //right: 0;
- //left: 240px;
- //top: 94px;
- .view-mode{
- background-color: #f8f8f8;
- border:0;
- }
- }
-
- .w-sdc-designer-canvas.sidebaractive {
- //right: 300px;
- }
-
- .w-sdc-designer-element {
- .hand;
- width: 200px;
- height: 100px;
- position: absolute;
- text-align: center;
- top: 50%;
- margin-top: -200px;
- left: 50%;
- margin-left: -50px;
- }
-
- .w-sdc-designer-resource-label {
- .q_7;
- }
-
- .w-sdc-designer-resource-label-indicator {
- .bg_q;
- border-radius: 50%;
- display: inline-block;
- height: 10px;
- margin-right: 6px;
- vertical-align: middle;
- width: 10px;
-
- &.valid {
- .bg_l;
- }
-
- &.invalid {
- .bg_h;
- }
- }
-
- // ---------------------------------------------------------------------------------------------------
- // Leftbar
- // ---------------------------------------------------------------------------------------------------
- .w-sdc-designer-leftbar {
- background-color: @main_color_p;
- bottom: 0;
- left: 0;
- overflow-y: scroll;
- overflow-x: hidden;
- position: absolute;
- top: 0;
- width: 244px;
- .box-shadow(7px -3px 6px -8px @main_color_n);
-
- }
-
- .w-sdc-designer-leftbar-title {
-
- .p_16_m;
- background-color: @main_color_n;
- line-height: 40px;
- padding: 0 17px;
- }
-
- .w-sdc-designer-leftbar-title-count {
- float: right;
- }
-
- .w-scd-diagram-container {
- // left: 240px;
- //right: 300px;
- }
-
- .w-sdc-designer-leftbar-search {
- background-color: @tlv_color_u;
- padding: 10px;
- white-space: nowrap;
- position: relative;
- }
-
- .w-sdc-designer-leftbar-search-input {
- border: 1px solid @color_e;
- .border-radius(4px);
- height: 30px;
- margin: 0;
- padding: 0px 28px 3px 10px;
- vertical-align: 4px;
- width: 100%;
- outline: none;
- font-style: italic;
- }
-
- .w-sdc-designer-leftbar-search-filter {
-
- }
-
- .i-sdc-designer-leftbar-section {
- .hand;
- }
-
- .i-sdc-designer-leftbar-section-title {
- .m_14_m;
- background-color: @tlv_color_u;
- .hand;
- clear: both;
- height: 40px;
- line-height: 40px;
- margin-top: 1px;
- padding: 0 10px;
- position: relative;
- text-transform: uppercase;
- font-weight: bold;
- }
-
- .i-sdc-designer-leftbar-section-title-icon {
- .hand;
- .sprite-new;
- .arrow-up;
- width: 15px;
- height: 9px;
- position: absolute;
- right: 13px;
- top: 18px;
- transition: .3s all;
- }
-
- .i-sdc-designer-leftbar-section.expanded .i-sdc-designer-leftbar-section-title-icon {
- transform: rotate(180deg);
- margin-right: 2px;
- }
-
- .i-sdc-designer-leftbar-section-content {
- background-color: @main_color_o;
- }
-
- .i-sdc-designer-leftbar-section-content-item {
- background-color: @main_color_p;
- overflow: hidden;
-
- &:hover {
- background-color: @main_color_p;
- }
-
- .cp{
- margin: 6px;
- }
-
- .vl{
- margin: 6px;
- }
- }
-
- .i-sdc-designer-leftbar-section-content-subcat {
- .m_14_m;
- background-color: @tlv_color_t;
- line-height: 35px;
- padding: 0 10px;
- cursor: default;
-
-
- &:hover {
- background-color: @func_color_r;
- }
-
-
- }
-
- .i-sdc-designer-leftbar-section .i-sdc-designer-leftbar-section-content .i-sdc-designer-leftbar-section-content-item {
- max-height: 0px;
- margin: 0 auto;
- transition: all .3s;
- }
-
- .i-sdc-designer-leftbar-section.expanded .i-sdc-designer-leftbar-section-content .i-sdc-designer-leftbar-section-content-item {
- max-height: 64px;
- margin: 0 auto 1px auto;
- // padding: 4px 13px;
- }
-
- .i-sdc-designer-leftbar-section.expanded .i-sdc-designer-leftbar-section-content .i-sdc-designer-leftbar-section-content-subcat {
- margin: 0;
- }
-
- .i-sdc-designer-leftbar-section-content-item-icon-ph {
- 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: -4px;
- top: -4px;
- .sprite;
- .s-sdc-state-non-certified;
- display: block;
-
- &.smaller-icon {
- bottom: 6px;
- left: 13px;
- }
- }
-
-
-
- }
-
- .non-certified {
- position: relative;
- left: 0px;
- top: 0px;
- .sprite;
- .s-sdc-state-non-certified;
- display: block;
-
- &.smaller-icon {
- left: 35px;
- bottom: -14px;
- }
- }
- /*
- .i-sdc-composition-leftbar-section-content-item-icon {
- background-image: url('../../../styles/images/resource-icons/default.png');
- // position: absolute;
- right: 20px;
- top: 10px;
- height: 40px;
- width: 40px;
- background-size: 40px;
- }
- */
-
- .i-sdc-designer-leftbar-section-content-item-info {
- display: inline-block;
- // margin-left: 10px;
- //overflow: hidden;
- // vertical-align: middle;
- width: 160px;
- padding: 0 0 0 10px;
- }
-
- .i-sdc-designer-leftbar-section-content-item-info-title {
- .m_13_m;
- line-height: 14px;
- overflow: hidden;
- text-overflow: ellipsis;
- max-width: 120px;
- display: inline-block;
- white-space: nowrap;
- vertical-align: bottom;
- }
-
- .i-sdc-designer-leftbar-section-content-item-info-text {
- .m_13_r;
- line-height: 15px;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- }
-
- .i-sdc-designer-leftbar-section-content-item-info-text-link {
- color: @color_s;
- text-decoration: underline;
- float: right;
- position: absolute;
- right: 17px;
- // bottom: 5px;
- }
-
- // ---------------------------------------------------------------------------------------------------
- // Form actions
- // ---------------------------------------------------------------------------------------------------
- .w-sdc-form-actions-container.add-property {
- text-align: center;
- width: 100%;
- margin-top: 2px;
- margin-bottom: 12px;
-
- .w-sdc-form-action {
- width: 245px;
- }
- .w-sdc-form-action.add-property-add-another {
- .bg_a;
- margin-left: 35px;
- }
- .w-sdc-form-action.add-property-done {
- margin-left: 312px;
- }
- .w-sdc-form-action.save {
- margin-left: 327px;
- margin-bottom: 30px;
- }
-
- }
-
- // ---------------------------------------------------------------------------------------------------
- // Top menu
- // ---------------------------------------------------------------------------------------------------
- .w-sdc-header-menu {
- padding: 25px 0;
- text-align: center;
- white-space: nowrap;
- }
-
- .i-sdc-header-menu-item {
- cursor: pointer;
- display: inline-block;
- height: 43px;
- min-width: 93px;
- padding: 0 38px;
- position: relative;
- vertical-align: middle;
-
- &::after {
- border-right: 1px solid @color_m;
- content: '';
- display: block;
- height: 43px;
- right: 0;
- position: absolute;
- top: 0;
- width: 2px;
- }
-
- &:first-child {
- &::before {
- border-right: 1px solid @color_m;
- content: '';
- display: block;
- height: 43px;
- left: 0;
- position: absolute;
- top: 0;
- width: 2px;
- }
- }
- }
-
- .i-sdc-header-menu-item-icon {
- display: inline-block;
- height: 20px;
- width: 28px;
- }
-
- .i-sdc-header-menu-item-label {
- .g_1;
- line-height: 18px;
- }
-
- .service-path-buttons {
- margin-top: 12px;
- position: absolute;
- right: 70px;
- top: 53px;
- &.with-sidebar {
- right: 380px;
- }
- }
- //Canvas search menu
- .w-sdc-search-menu {
- position:absolute;
- right: 18px;
- top:53px;
- transition: right 0.2s;
- display: flex;
- flex-direction: column;
- align-items: flex-end;
- margin-right:10px;
- pointer-events: none;
-
- & > * {
- pointer-events: all;
- }
-
- &.with-sidebar {
- right:320px;
- }
-
- .search-with-autocomplete-container.composition-search {
- margin-top: 12px;
-
- .search-bar-input {
- width: 250px;
- padding:2px 50px 2px 10px;
- transition:all 0.4s;
- }
- .search-bar-container {
- position:relative;
- }
-
- &:not(:hover):not(.autocomplete-visible):not(.active){
- border-radius: 0;
- box-shadow:none;
-
- .search-bar-input:not(:focus){
- width: 0px;
- padding:0;
- border:none;
- }
- .clear-search-x {
- display:none;
- }
- .search-bar-input:not(:focus) ~ .search-bar-button {
- border-radius: 2px;
- border:solid 1px #fff;
- }
- }
- }
-
- .zoom-icons {
- border:solid 1px #fff;
- border-radius: 2px;
- box-shadow: 0px 2px 3.88px 0.12px rgba(0, 0, 0, 0.29);
- background-color: rgba(234, 234, 234, 0.88);
- background-repeat: no-repeat;
- margin-top: 10px;
-
- &:hover {
- cursor:pointer;
- }
-
- &:active {
- border:none;
- background-color: rgba(31, 171, 223, 0.88);
- }
- }
- }
-
- // ---------------------------------------------------------------------------------------------------
- // Canvas inline menu
- // ---------------------------------------------------------------------------------------------------
- .w-sdc-canvas-menu-list {
- .w-sdc-canvas-menu-item-view {
- &::before {
- content: '';
- display: inline-block;
-
- .sprite-new;
- .view-icon;
- vertical-align: top;
- margin: 2px 6px 2px 4px;
- }
- }
-
- .w-sdc-canvas-menu-item-delete {
- &::before {
- content: '';
- display: inline-block;
-
- .sprite-new;
- .delete-icon;
- vertical-align: bottom;
- margin: 1px 10px 0 7px;
- }
- }
- }
-}
-/*.right-tab-loader {
- border: 16px solid #f3f3f3; !* Light grey *!
- border-top: 16px solid #3498db; !* Blue *!
- border-radius: 50%;
- width: 120px;
- height: 120px;
- animation: spin 2s linear infinite;
-}*/
-
-@keyframes spin {
- 0% { transform: rotate(0deg); }
- 100% { transform: rotate(360deg); }
-}
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
deleted file mode 100644
index 2af341b2c1..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view-model.ts
+++ /dev/null
@@ -1,352 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import * as _ from "lodash";
-import {
- ArtifactModel,
- Service,
- IAppConfigurtaion,
- Resource,
- Component,
- ComponentInstance,
- ArtifactGroupModel,
- IFileDownload
-} from "app/models";
-import {ICompositionViewModelScope} from "../../composition-view-model";
-import {ArtifactsUtils, ModalsHandler, ArtifactGroupType} from "app/utils";
-import {GRAPH_EVENTS} from "app/utils/constants";
-import {EventListenerService} from "app/services/event-listener-service";
-import {Dictionary} from "../../../../../../utils/dictionary/dictionary";
-
-export interface IArtifactsViewModelScope extends ICompositionViewModelScope {
- artifacts:Array<ArtifactModel>;
- artifactType:string;
- downloadFile:IFileDownload;
- isLoading:boolean;
- allowDeleteAndUpdateArtifactMap:Dictionary<string, boolean>;
- getTitle():string;
- addOrUpdate(artifact:ArtifactModel):void;
- delete(artifact:ArtifactModel):void;
- download(artifact:ArtifactModel):void;
- openEditEnvParametersModal(artifact:ArtifactModel):void;
- getEnvArtifact(heatArtifact:ArtifactModel):any;
- getEnvArtifactName(artifact:ArtifactModel):string;
- isLicenseArtifact(artifact:ArtifactModel):boolean;
- isVfOrPnf():boolean;
- //isVFiArtifact(artifact:ArtifactModel):boolean;
-}
-
-export class ResourceArtifactsViewModel {
-
- static '$inject' = [
- '$scope',
- '$filter',
- '$state',
- 'sdcConfig',
- 'ArtifactsUtils',
- 'ModalsHandler',
- '$q',
- 'EventListenerService'
- ];
-
- constructor(private $scope:IArtifactsViewModelScope,
- private $filter:ng.IFilterService,
- private $state:any,
- private sdcConfig:IAppConfigurtaion,
- private artifactsUtils:ArtifactsUtils,
- private ModalsHandler:ModalsHandler,
- private $q:ng.IQService,
- private eventListenerService: EventListenerService) {
-
- this.initScope();
- }
-
-
- private initArtifactArr = (artifactType:string):void => {
- let artifacts:Array<ArtifactModel> = [];
-
- if (this.$scope.selectedComponent) {
- if ('interface' == artifactType) {
- let interfaces = this.$scope.currentComponent.interfaces;
- if (interfaces && interfaces.standard && interfaces.standard.operations) {
-
- angular.forEach(interfaces.standard.operations, (operation:any, interfaceName:string):void => {
- let item:ArtifactModel = <ArtifactModel>{};
- if (operation.implementation) {
- item = <ArtifactModel> operation.implementation;
- }
- item.artifactDisplayName = interfaceName;
- item.artifactLabel = interfaceName;
- item.mandatory = false;
- artifacts.push(item);
- });
- }
- } else {
- //init normal artifacts, deployment or api artifacts
- let artifactsObj:ArtifactGroupModel;
- switch (artifactType) {
- case "api":
- artifactsObj = (<Service>this.$scope.currentComponent).serviceApiArtifacts;
- break;
- case "deployment":
- if (!this.$scope.isComponentInstanceSelected()) {
- artifactsObj = this.$scope.currentComponent.deploymentArtifacts;
- } else {
- artifactsObj = this.$scope.currentComponent.selectedInstance.deploymentArtifacts;
- }
- break;
- default:
- //artifactsObj = this.$scope.selectedComponent.artifacts;
- if (!this.$scope.isComponentInstanceSelected()) {
- artifactsObj = this.$scope.currentComponent.artifacts;
- } else {
- artifactsObj = this.$scope.currentComponent.selectedInstance.artifacts;
- }
- break;
- }
- _.forEach(artifactsObj, (artifact:ArtifactModel, key) => {
- artifacts.push(artifact);
- });
- }
- }
- this.$scope.artifacts = artifacts;
- this.$scope.allowDeleteAndUpdateArtifactMap = new Dictionary<string, boolean>();
- _.forEach(this.$scope.artifacts, (artifact:ArtifactModel)=>{
- this.$scope.allowDeleteAndUpdateArtifactMap[artifact.artifactLabel] = this.allowDeleteAndUpdateArtifact(artifact);
- });
- this.$scope.isLoading = false;
- this.$scope.preventMoveTab(false);
- };
-
-
- private convertToArtifactUrl = (artifactType:string):string => {
-
- switch (artifactType) {
- case 'deployment':
- return 'DEPLOYMENT';
- case 'api':
- return 'SERVICE_API';
- default:
- return 'INFORMATIONAL';
- }
-
- }
-
- private loadComponentArtifactIfNeeded = (forceLoad?: boolean) => {
-
- let onGetComponentArtifactsSuccess = (artifacts:ArtifactGroupModel)=> {
- switch (this.$scope.artifactType) {
- case 'deployment':
- this.$scope.currentComponent.deploymentArtifacts = artifacts;
- break;
- case 'api':
- (<Service>this.$scope.currentComponent).serviceApiArtifacts = artifacts;
- break;
- default:
- this.$scope.currentComponent.artifacts = artifacts;
- break;
- }
- this.$scope.isLoading = false;
- this.initArtifactArr(this.$scope.artifactType);
- }
-
- let onError = ()=> {
- this.$scope.isLoading = false;
- };
-
- switch (this.$scope.artifactType) {
- case 'deployment':
- if(forceLoad || !this.$scope.currentComponent.deploymentArtifacts) {
- this.$scope.component.getArtifactByGroupType(this.convertToArtifactUrl(this.$scope.artifactType)).then(onGetComponentArtifactsSuccess, onError);
- } else {
- this.initArtifactArr(this.$scope.artifactType);
- }
-
- break;
- case 'api':
- if(!(<Service>this.$scope.currentComponent).serviceApiArtifacts) {
- this.$scope.component.getArtifactByGroupType(this.convertToArtifactUrl(this.$scope.artifactType)).then(onGetComponentArtifactsSuccess, onError);
- } else {
- this.initArtifactArr(this.$scope.artifactType);
- }
- break;
- default:
- if(!this.$scope.currentComponent.artifacts) {
- this.$scope.component.getArtifactByGroupType(this.convertToArtifactUrl(this.$scope.artifactType)).then(onGetComponentArtifactsSuccess, onError);
- } else {
- this.initArtifactArr(this.$scope.artifactType);
- }
- break;
- }
- }
- private loadArtifacts = (forceLoad?: boolean):void => {
-
- let onGetInstanceArtifactsSuccess = (artifacts:ArtifactGroupModel)=> {
- switch (this.$scope.artifactType) {
- case 'deployment':
- this.$scope.currentComponent.selectedInstance.deploymentArtifacts = artifacts;
- break;
- default:
- this.$scope.currentComponent.selectedInstance.artifacts = artifacts;
- break;
- }
- this.initArtifactArr(this.$scope.artifactType);
- };
-
- let onError = ()=> {
- this.$scope.isLoading = false;
- };
-
- this.$scope.isLoading = true;
- this.$scope.preventMoveTab(true);
- if (this.$scope.isComponentInstanceSelected()) {
- this.$scope.component.getComponentInstanceArtifactsByGroupType(this.$scope.component.selectedInstance.uniqueId, this.convertToArtifactUrl(this.$scope.artifactType)).then(onGetInstanceArtifactsSuccess, onError);
- } else {
- this.loadComponentArtifactIfNeeded(forceLoad);
- }
- }
-
- private updateArtifactsIfNeeded = ():void => {
- if (this.$scope.artifactType === "deployment") {
- this.loadArtifacts(true);
- } else {
- this.initArtifactArr(this.$scope.artifactType);
- }
- };
-
- private openEditArtifactModal = (artifact:ArtifactModel):void => {
- this.ModalsHandler.openArtifactModal(artifact, this.$scope.currentComponent).then(():void => {
- this.updateArtifactsIfNeeded();
- });
- };
-
- 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
- return (!artifact.isHEAT() && !artifact.isThirdParty() && !this.$scope.isLicenseArtifact(artifact));
- }
- }
- return false;
-};
-
- private initScope = ():void => {
-
- this.$scope.isLoading = false;
- this.$scope.artifactType = this.artifactsUtils.getArtifactTypeByState(this.$state.current.name);
- this.$scope.getTitle = ():string => {
- return this.artifactsUtils.getTitle(this.$scope.artifactType, this.$scope.currentComponent);
- };
-
- // Bug 310499 - user should be unable to delete RI artifact. (also talked to David and agreed this function isn't necessary)
- // this.$scope.isVFiArtifact = (artifact:ArtifactModel):boolean=> {
- // if (artifact.artifactGroupType === ArtifactGroupType.INFORMATION) {//fix DE256847
- // return this.$scope.currentComponent.artifacts && (!this.$scope.currentComponent.artifacts[artifact.artifactLabel] || !this.$scope.currentComponent.artifacts[artifact.artifactLabel].artifactName);
- // }
- // return this.$scope.currentComponent.selectedInstance && this.$scope.currentComponent.selectedInstance.deploymentArtifacts && this.$scope.currentComponent.selectedInstance.deploymentArtifacts[artifact.artifactLabel];
- // };
-
- this.$scope.addOrUpdate = (artifact:ArtifactModel):void => {
- this.artifactsUtils.setArtifactType(artifact, this.$scope.artifactType);
- let artifactCopy = new ArtifactModel(artifact);
- this.openEditArtifactModal(artifactCopy);
- };
-
-
- this.$scope.delete = (artifact:ArtifactModel):void => {
-
- let onOk = ():void => {
- this.$scope.isLoading = true;
- this.artifactsUtils.removeArtifact(artifact, this.$scope.artifacts);
-
- let success = (responseArtifact:ArtifactModel):void => {
- this.initArtifactArr(this.$scope.artifactType);
- this.$scope.isLoading = false;
- };
-
- let error = (error:any):void => {
- console.log('Delete artifact returned error:', error);
- this.initArtifactArr(this.$scope.artifactType);
- this.$scope.isLoading = false;
- };
- if (this.$scope.isComponentInstanceSelected()) {
- this.$scope.currentComponent.deleteInstanceArtifact(artifact.uniqueId, artifact.artifactLabel).then(success, error);
- } else {
- this.$scope.currentComponent.deleteArtifact(artifact.uniqueId, artifact.artifactLabel).then(success, error);//TODO simulate error (make sure error returns)
- }
- };
- let title:string = this.$filter('translate')("ARTIFACT_VIEW_DELETE_MODAL_TITLE");
- let message:string = this.$filter('translate')("ARTIFACT_VIEW_DELETE_MODAL_TEXT", "{'name': '" + artifact.artifactDisplayName + "'}");
- this.ModalsHandler.openConfirmationModal(title, message, false).then(onOk);
- };
-
-
- this.$scope.getEnvArtifact = (heatArtifact:ArtifactModel):any=> {
- return _.find(this.$scope.artifacts, (item:ArtifactModel)=> {
- return item.generatedFromId === heatArtifact.uniqueId;
- });
- };
-
- this.$scope.getEnvArtifactName = (artifact:ArtifactModel):string => {
- let envArtifact = this.$scope.getEnvArtifact(artifact);
- if (envArtifact) {
- return envArtifact.artifactDisplayName;
- }
- };
-
- this.$scope.isLicenseArtifact = (artifact:ArtifactModel):boolean => {
- let isLicense:boolean = false;
- if (this.$scope.component.isResource() && (<Resource>this.$scope.component).isCsarComponent()) {
- isLicense = this.artifactsUtils.isLicenseType(artifact.artifactType);
- }
-
- return isLicense;
- };
-
- this.$scope.openEditEnvParametersModal = (artifact:ArtifactModel):void => {
- this.ModalsHandler.openEditEnvParametersModal(artifact, this.$scope.currentComponent).then(()=> {
- this.updateArtifactsIfNeeded();
- }, ()=> {
- // ERROR
- });
- };
-
- this.$scope.isVfOrPnf = ():boolean => {
- if (this.$scope.selectedComponent.isResource()) {
- let selectedResourceType = (<Resource>this.$scope.selectedComponent).resourceType;
- return selectedResourceType == 'VF' || selectedResourceType == 'PNF';
- }
- return false;
- }
-
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_NODE_SELECTED, this.loadArtifacts);
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_GRAPH_BACKGROUND_CLICKED, this.loadArtifacts);
-
- this.$scope.$on('$destroy', () => {
-
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_NODE_SELECTED, this.loadArtifacts);
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_GRAPH_BACKGROUND_CLICKED, this.loadArtifacts);
- });
-
- this.loadArtifacts();
- }
-}
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
deleted file mode 100644
index ec81ed81ee..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts-view.html
+++ /dev/null
@@ -1,84 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<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>
- <div class="w-sdc-designer-sidebar-section-title-icon"></div>
- </expand-collapse>
-
- <div class="w-sdc-designer-sidebar-section-content">
- <div class="i-sdc-designer-sidebar-section-content-item">
- <div class="i-sdc-designer-sidebar-section-content-item-artifact"
- data-ng-repeat="artifact in artifacts | orderBy: ['-mandatory', 'artifactDisplayName'] track by $index"
- data-ng-if="(!isComponentInstanceSelected() || artifact.esId) && 'HEAT_ENV' !== artifact.artifactType"
- data-tests-id="artifact-item-{{artifact.artifactDisplayName}}">
- <span data-ng-if="artifact.heatParameters.length" class="i-sdc-designer-sidebar-section-content-item-file-link"></span>
- <div class="i-sdc-designer-sidebar-section-content-item-artifact-details" data-ng-class="{'heat':artifact.isHEAT() && artifact.heatParameters.length}">
- <div class="i-sdc-designer-sidebar-section-content-item-artifact-filename" data-tests-id="artifactName-{{artifact.artifactDisplayName}}"
- data-ng-bind="artifact.artifactName" tooltips tooltip-content="{{artifact.artifactName}}"
- 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': 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>
- <button class="i-sdc-designer-sidebar-section-content-item-button update-env sprite e-sdc-small-icon-pencil" data-tests-id="edit_{{artifact.artifactDisplayName}}"
- data-ng-if="!isViewMode()" data-ng-click="addOrUpdate(getEnvArtifact(artifact))"></button>
- <download-artifact class="i-sdc-designer-sidebar-section-content-item-button download-env sprite e-sdc-small-download hand" artifact="getEnvArtifact(artifact)"
- component="currentComponent" instance="isComponentInstanceSelected()"
- data-tests-id="download_env_{{artifact.artifactDisplayName}}"></download-artifact>
- </div>
- </div>
-
- <div class="i-sdc-designer-sidebar-section-content-item-artifact-details-desc">
- <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="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"
- data-ng-click="openEditEnvParametersModal(getEnvArtifact(artifact))" type="button"
- data-tests-id="edit-parameters-of-{{artifact.artifactDisplayName}}"></button>
- <!--need to remove this 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"
- data-ng-click="openEditEnvParametersModal(artifact)" type="button"
- data-tests-id="edit-parameters-of-{{artifact.artifactDisplayName}}"></button>
-
- <download-artifact ng-if="artifact.esId && 'deployment' != artifactType" class="i-sdc-designer-sidebar-section-content-item-button download sprite e-sdc-small-download hand"
- artifact="artifact" component="currentComponent" data-tests-id="download_{{artifact.artifactDisplayName}}" instance="isComponentInstanceSelected()"></download-artifact>
- <download-artifact ng-if="artifact.esId && 'deployment' == artifactType" class="i-sdc-designer-sidebar-section-content-item-button download sprite e-sdc-small-download hand"
- artifact="artifact" component="currentComponent" instance="isComponentInstanceSelected()" data-tests-id="download_{{artifact.artifactDisplayName}}"
- show-loader="artifact.isHEAT()"
- download-icon-class="i-sdc-designer-sidebar-section-content-item-button download sprite e-sdc-small-download hand"></download-artifact>
- <button ng-if="!isViewMode() && !artifact.esId && artifactType==='deployment' && !isComponentInstanceSelected() && !artifact.isThirdParty()" class="i-sdc-designer-sidebar-section-content-item-button attach sprite e-sdc-small-icon-upload"
- data-ng-click="addOrUpdate(artifact)" type="button" data-tests-id="add_Artifact"></button>
- </div>
- </div>
-
- </div>
- <div class="w-sdc-designer-sidebar-section-footer" data-ng-if="!isViewMode() && artifactType!=='api' && (!isComponentInstanceSelected()||isVfOrPnf()) && ('deployment' != artifactType || selectedComponent.isComplex())">
- <button class="w-sdc-designer-sidebar-section-footer-action tlv-btn blue" data-tests-id="add_Artifact_Button" data-ng-click="addOrUpdate({})" type="button">Add Artifact</button>
- </div>
- </div>
-</perfect-scrollbar>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts.less b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts.less
deleted file mode 100644
index 5256542788..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/artifacts/artifacts.less
+++ /dev/null
@@ -1,173 +0,0 @@
-.w-sdc-designer-sidebar-tab-content.artifacts {
-
- .i-sdc-designer-sidebar-section-content-item-artifact.hand {
- .hand;
- }
-
- .w-sdc-designer-sidebar-section-content {
- padding: 0;
- }
- .w-sdc-designer-sidebar-section-title {
- &.expanded {
- margin-bottom: 0;
- }
- }
-
- .i-sdc-designer-sidebar-section-content-item-artifact-details {
- display: inline-block;
- margin-left: 5px;
- vertical-align: middle;
- width: 180px;
- &.heat {
- line-height: 18px;
- width: 250px;
- }
- }
-
- .i-sdc-designer-sidebar-section-content-item-artifact-details-name {
- .s_14_r;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- max-width:220px;
- display: inline-block;
- //text-transform: capitalize;
- &.enabled {
- &:hover {
- .a_7;
- font-family: @font-opensans-regular
- }
- }
-
- }
-
- .i-sdc-designer-sidebar-section-content-item-artifact-heat-env {
- .g_7;
- margin-top: 6px;
- line-height: 42px;
- padding-top: 10px;
- border-top:1px solid #c8cdd1;
- .enabled {
- &:hover {
- .hand;
- .a_7;
- }
- }
- }
-
- .i-sdc-designer-sidebar-section-content-item-artifact-filename {
- .g_7;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- max-width: 225px;
- display: inline-block;
- .bold;
- &.enabled {
- &:hover {
- .a_7;
- }
- }
- }
-
-
- .i-sdc-designer-sidebar-section-content-item-file-link{
- border-left: 1px #848586 solid;
- height: 58px;
- margin-left: -11px;
- margin-top: 11px;
- border-top: 1px #848586 solid;
- border-bottom: 1px #848586 solid;
- width: 12px;
- float: left;
- }
-
- .i-sdc-designer-sidebar-section-content-item-artifact-details-desc {
- display: none;
- line-height: 16px;
- word-wrap: break-word;
- white-space: normal;
- }
-
- .i-sdc-designer-sidebar-section-content-item-artifact-details-desc-label {
- .b_3;
- }
-
-
- .i-sdc-designer-sidebar-section-content-item-artifact {
- border-bottom: 1px solid #c8cdd1;
- padding: 5px 10px 5px 18px;
- position: relative;
- // line-height: 36px;
- min-height: 61px;
- //cursor: default;
- display: flex;
- align-items: center;
-
-
- .i-sdc-designer-sidebar-section-content-item-button {
- top: 20px;
- line-height: 10px;
- }
-
- &:hover {
- //background-color: @color_c;
- .bg_c;
- transition: all .3s;
-
- .i-sdc-designer-sidebar-section-content-item-button {
- display: block;
-
- }
-
- }
- }
-
-}
-
-///////////////////Lifecycle Management
-.i-sdc-designer-sidebar-section-content-item-lm {
- .b_7;
- border-bottom: 1px solid @color_e;
- cursor: pointer;
- height: 65px;
- padding: 22px 0;
- position: relative;
-
- &:hover {
- .bg_c_hover;
- margin-left: -10px;
- margin-right: -10px;
- padding: 22px 10px;
-
- .i-sdc-designer-sidebar-section-content-item-lm-icon {
- right: 16px;
- }
- }
-}
-
-.i-sdc-designer-sidebar-section-content-item-lm:first-child {
- margin-top: -18px;
-}
-
-.i-sdc-designer-sidebar-section-content-item-lm-icon {
- position: absolute;
- right: 6px;
-
- //TODO: Replace the icons.
- &.icon-view {
- background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAJCAYAAAACTR1pAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdGMDNBRUJDMDkxNjExRTVCMjRBOEI5QzMxQTlBQjY4IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdGMDNBRUJEMDkxNjExRTVCMjRBOEI5QzMxQTlBQjY4Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6N0YwM0FFQkEwOTE2MTFFNUIyNEE4QjlDMzFBOUFCNjgiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6N0YwM0FFQkIwOTE2MTFFNUIyNEE4QjlDMzFBOUFCNjgiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4U2decAAABRUlEQVR42pyRPUvDUBSG39t2UyyaBgvWQZMqKoFq4lBH0U0UqXSxKPaPieCoWPAPKIgdjG1ohaghOrSR1iaLKMXpmnMhQVfPcLmc8zxwPhjnHFE4rx3eMO/w4rr4+vwQuZHRMcwqClaMVeRnplnEskg8O7/g96YJSZLgBz5+R0bKIAgC6IaBvdKukBP0HJ+cctu2cVCtQsrIUFUVlcp+LE6EItWIIVaIV9c3/PnRRqlcxkJeYV2vi+/hEO/9QSx6b56oEUMsOal6/TacQcXinCpaGE+n0QnljufFIuUoiAlZTk6iWFyD6zpoWi3RwvrmBlLJZCzRn3IUxBBLjlgO9e06T9ja3sGyrqPX66NtWQLWCgVks5Owmg1c1mpQ8vM4OqywP1s1w1PkpnJY0jTIsizy/sDHQ7sFmt0ITxJtlf33jj8CDADhB52tEX6ifAAAAABJRU5ErkJggg==');
- height: 9px;
- top: 29px;
- width: 14px;
- }
-
- //TODO: Replace the icons.
- &.icon-alert {
- background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAANCAYAAAB2HjRBAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjhBM0YxQTBCMDkyMDExRTVBNzlCQUYxNEYwMDUwOTQ5IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjhBM0YxQTBDMDkyMDExRTVBNzlCQUYxNEYwMDUwOTQ5Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6OEEzRjFBMDkwOTIwMTFFNUE3OUJBRjE0RjAwNTA5NDkiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6OEEzRjFBMEEwOTIwMTFFNUE3OUJBRjE0RjAwNTA5NDkiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7exgceAAAB5klEQVR42oySy2tTQRTGfzN3cpvbpFTaUlzUjeCuVFyJf4DuCl34wL/CrbpUunLnwpUuFFy48IFiwYWhpYuW+gCLrbWKBQumaRIba5ub3MccJ5WECCV44MDMme873/lmBhGhnZulcn/3/sfrO7J/45R017pT0xUS2bC93vy2LAOLt5DfCeUn14RD4h/ysbHRDii/8pyo7DmFiP7VZ4Rbu9KT3I7i+qJklp7ibQt2J6HeNOhXV/gv8tDcbaLtXYLJKeTcZfxqSPPzvGu6ID3J1Q8z0ny/hIkM5swF8qenUFUfwixHCtd7Kwez04jOgEmc+hq6tuZ8N9E6xG5U+Pn2kRxKLs7eE7tRc0XlToRM2sD+2sGmDiY+kWsSFG528Kr1Xgfjfn0n5uElvFrrzVqVDHqkiTKjxCsV9LBx08QkgcY/eZH+89Oqo+x9eumkwQaQaoPEKWpsHHN8ArItgLt5UdiG6736mFLxixyQt+bviik8QPuaNFRIkjqQRZ2YJDo6QWydjTRtOcGPPdJKgnlxFfN9fVmGNhecR4U3mLrL6nPTRTQHXZO5+4jyyI4Iqs99GJvgBiKjcySlj3897y6/kbreI4w0QS7ASxrsa4/cXkxkIzK5PKmNqRMw7NfdeczA+Fn1R4ABAPnMAeCjkgf5AAAAAElFTkSuQmCC');
- height: 13px;
- top: 27px;
- width: 15px;
- }
-
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view-model.ts
deleted file mode 100644
index 36ceabfb42..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view-model.ts
+++ /dev/null
@@ -1,201 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import * as _ from "lodash";
-import {Component, ModalModel, ButtonModel} from "app/models";
-import {GRAPH_EVENTS} from "app/utils";
-import {LeftPaletteLoaderService, EventListenerService} from "app/services";
-import {ICompositionViewModelScope} from "../../composition-view-model";
-import {LeftPaletteComponent} from "../../../../../../models/components/displayComponent";
-import {ComponentServiceFactoryNg2} from "app/ng2/services/component-services/component.service.factory";
-import {ServiceServiceNg2} from 'app/ng2/services/component-services/service.service';
-import {Service} from "app/models/components/service";
-import {ModalService} from 'app/ng2/services/modal.service';
-
-export interface IEditResourceVersion {
- allVersions:any;
- changeVersion:string;
-}
-
-interface IDetailsViewModelScope extends ICompositionViewModelScope {
- isLoading:boolean;
- $parent:ICompositionViewModelScope;
- expandedSection:Array<string>;
- editForm:ng.IFormController;
- editResourceVersion:IEditResourceVersion;
-
- onChangeResourceVersion():void;
- alertBeforeChangeResourceVersion():void;
- changeVersion():void;
- cancelChangeResourceVersion():void;
-}
-
-export class DetailsViewModel {
-
- static '$inject' = [
- '$scope',
- '$filter',
- 'LeftPaletteLoaderService',
- 'EventListenerService',
- 'ComponentServiceFactoryNg2',
- 'ServiceServiceNg2',
- 'ModalServiceNg2'
- ];
-
- constructor(private $scope:IDetailsViewModelScope,
- private $filter:ng.IFilterService,
- private LeftPaletteLoaderService:LeftPaletteLoaderService,
- private eventListenerService:EventListenerService,
- private ComponentServiceFactoryNg2: ComponentServiceFactoryNg2,
- private serviceService: ServiceServiceNg2,
- private ModalServiceNg2: ModalService) {
- this.initScope();
- }
-
- private clearSelectedVersion = ():void => {
- this.$scope.editResourceVersion = {
- allVersions: {},
- changeVersion: null
- };
- };
-
- private versioning:Function = (versionNumber:string):string => {
- let version:Array<string> = versionNumber.split('.');
- return '00000000'.slice(version[0].length) + version[0] + '.' + '00000000'.slice(version[1].length) + version[1];
- };
-
- private initEditResourceVersion = ():void => {
- this.clearSelectedVersion();
- this.$scope.editResourceVersion.allVersions[this.$scope.currentComponent.selectedInstance.componentVersion] = this.$scope.currentComponent.selectedInstance.componentUid;
- _.merge(this.$scope.editResourceVersion.allVersions, angular.copy(this.$scope.selectedComponent.allVersions));
- let sorted:any = _.sortBy(_.toPairs(this.$scope.editResourceVersion.allVersions), (item)=> {
- return this.versioning(item[0]);
- });
- this.clearSelectedVersion();
- _.forEach(sorted, (item)=> {
- this.$scope.editResourceVersion.allVersions[item[0]] = item[1];
- });
-
- let highestVersion = _.last(Object.keys(this.$scope.selectedComponent.allVersions));
-
- if (parseFloat(highestVersion) % 1) { //if highest is minor, make sure it is the latest checked in -
- let latestVersionComponent:LeftPaletteComponent = _.maxBy(_.filter(this.LeftPaletteLoaderService.getLeftPanelComponentsForDisplay(this.$scope.currentComponent), (component:LeftPaletteComponent) => { //latest checked in
- return (component.systemName === this.$scope.selectedComponent.systemName
- || component.uuid === this.$scope.selectedComponent.uuid);
- }),(component)=>{return component.version});
-
- let latestVersion:string = latestVersionComponent ? latestVersionComponent.version : highestVersion;
-
- if (highestVersion != latestVersion) { //highest is checked out - remove from options
- this.$scope.editResourceVersion.allVersions = _.omit(this.$scope.editResourceVersion.allVersions, highestVersion);
- }
- }
- this.$scope.editResourceVersion.changeVersion = this.$scope.currentComponent.selectedInstance.componentVersion;
- };
-
- private initScope = ():void => {
- this.$scope.isLoading = false;
- this.$scope.$parent.isLoading = false;
- this.$scope.expandedSection = ['general', 'tags'];
- //this.clearSelectedVersion();
-
- this.$scope.$watch('selectedComponent', (component:Component) => {
- if (this.$scope.isComponentInstanceSelected()) {
- this.initEditResourceVersion();
- }
- });
-
- this.$scope.onChangeResourceVersion = ():void => {
- if(this.$scope.isComponentInstanceSelected() && this.$scope.currentComponent.selectedInstance.isServiceProxy()) {
- this.$scope.alertBeforeChangeResourceVersion();
- }
- else {
- this.$scope.changeVersion();
- }
- };
-
- this.$scope.alertBeforeChangeResourceVersion = ():void => {
- let modalApproveTxt:string = this.$filter('translate')("MODAL_APPROVE");
- let modalCancelTxt:string = this.$filter('translate')("MODAL_CANCEL");
- let changeVersionModalTitle:string = this.$filter('translate')("DETAILS_TAB_CHANGE_VERSION_MODAL_TITLE");
- let changeVersionModalMsg:string = this.$filter('translate')("DETAILS_TAB_CHANGE_VERSION_MODAL_MSG");
-
- let actionButton: ButtonModel = new ButtonModel(modalApproveTxt, 'blue', this.$scope.changeVersion);
- let cancelButton: ButtonModel = new ButtonModel(modalCancelTxt, 'grey', this.$scope.cancelChangeResourceVersion);
- let modalModel: ModalModel = new ModalModel('sm', changeVersionModalTitle, changeVersionModalMsg, [actionButton, cancelButton]);
- let customModal = this.ModalServiceNg2.createCustomModal(modalModel);
- customModal.instance.open();
- };
-
- this.$scope.cancelChangeResourceVersion = () => {
- this.ModalServiceNg2.closeCurrentModal();
- this.$scope.editResourceVersion.changeVersion = this.$scope.currentComponent.selectedInstance.componentVersion;
- };
-
- this.$scope.changeVersion = ():void => {
- this.ModalServiceNg2.closeCurrentModal();
- this.$scope.isLoading = true;
- this.$scope.$parent.isLoading = true;
-
- let service = <Service>this.$scope.currentComponent;
- let {changeVersion} = this.$scope.editResourceVersion;
- let componentUid:string = this.$scope.editResourceVersion.allVersions[changeVersion];
-
- let onCancel = (error:any) => {
- this.$scope.isLoading = false;
- this.$scope.$parent.isLoading = false;
- this.$scope.editResourceVersion.changeVersion = this.$scope.currentComponent.selectedInstance.componentVersion;
-
- if (error) {
- console.log(error);
- }
- };
-
- let onUpdate = () => {
- let onSuccess = (component:Component) => {
- this.$scope.isLoading = false;
- this.$scope.$parent.isLoading = false;
- this.$scope.onComponentInstanceVersionChange(component);
- };
-
- this.$scope.currentComponent.changeComponentInstanceVersion(componentUid).then(onSuccess, onCancel);
- };
-
- if (this.$scope.currentComponent.isService()) {
- this.serviceService.checkComponentInstanceVersionChange(service, componentUid).subscribe((pathsToDelete:string[]) => {
- if (pathsToDelete && pathsToDelete.length) {
- this.$scope.isLoading = false;
- this.$scope.$parent.isLoading = false;
- this.$scope.$parent.openVersionChangeModal(pathsToDelete).then(() => {
- this.$scope.isLoading = true;
- this.$scope.$parent.isLoading = true;
- onUpdate();
- }, onCancel);
- } else {
- onUpdate();
- }
- }, onCancel);
- } else {
- onUpdate();
- }
- };
- }
-}
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
deleted file mode 100644
index db5322a859..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html
+++ /dev/null
@@ -1,181 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<perfect-scrollbar include-padding="true" class="w-sdc-designer-sidebar-tab-content details">
-
- <div class="w-sdc-designer-sidebar-section">
- <loader data-display="isLoading"></loader>
- <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content.general" class="w-sdc-designer-sidebar-section-title">
-
- General Info
- <div class="w-sdc-designer-sidebar-section-title-icon"></div>
- </expand-collapse>
-
- <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="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>
- <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-if="selectedComponent.isResource()" data-ng-bind="selectedComponent.resourceType"
- tooltips tooltip-content="&#8203;{{selectedComponent.resourceType | resourceTypeName}}"
- data-tests-id="rightTab_resourceType"></span>
- </div>
- <div class="i-sdc-designer-sidebar-section-content-item">
-
- <span class="i-sdc-designer-sidebar-section-content-item-label">Version:</span>
- <span class="i-sdc-designer-sidebar-section-content-item-value"
- data-ng-if="!isComponentInstanceSelected()" data-tests-id="rightTab_version" data-ng-bind="selectedComponent.version"></span>
-
- <ng-form name="editForm" data-ng-if="isComponentInstanceSelected()">
- <select data-ng-model="editResourceVersion.changeVersion" name="changeVersion" data-tests-id="changeVersion"
- data-ng-disabled="$parent.isViewOnly || selectedComponent.uniqueId != editResourceVersion.allVersions[editResourceVersion.changeVersion] || selectedComponent.archived"
- class="i-sdc-designer-sidebar-section-content-item-value i-sdc-form-select"
- data-ng-class="{'minor': (editResourceVersion.changeVersion)%1, 'disabled':selectedComponent.archived}"
- data-ng-change="onChangeResourceVersion()">
- <option class="select-instance-version" data-ng-class="{'minor': key%1}"
- ng-repeat="(key, value) in editResourceVersion.allVersions">{{key}}</option>
- </select></ng-form>
- </div>
- <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.categories && selectedComponent.categories[0]">
- <span class="i-sdc-designer-sidebar-section-content-item-label">Category:</span>
- <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.categories[0].name"
- tooltips tooltip-content="&#8203;{{selectedComponent.categories[0].name}}"
- data-tests-id="rightTab_category"></span>
- </div>
- <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.categories && selectedComponent.categories[0] && selectedComponent.categories[0].subcategories">
- <span class="i-sdc-designer-sidebar-section-content-item-label">Sub Category:</span>
- <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.categories[0].subcategories[0].name"
- tooltips tooltip-content="&#8203;{{selectedComponent.categories[0].subcategories[0].name}}"
- data-tests-id="rightTab_subCategory"></span>
- </div>
- <div class="i-sdc-designer-sidebar-section-content-item">
- <span class="i-sdc-designer-sidebar-section-content-item-label">Creation Date:</span>
- <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.creationDate | date: 'MM/dd/yyyy'"
- data-tests-id="rightTab_creationDate"></span>
- </div>
- <div class="i-sdc-designer-sidebar-section-content-item">
- <span class="i-sdc-designer-sidebar-section-content-item-label">Author:</span>
- <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.creatorFullName"
- tooltips tooltip-content="&#8203;{{selectedComponent.creatorFullName}}"
- data-tests-id="rightTab_author">
- </span>
- </div>
- <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.isService()">
- <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_PROJECT_CODE"></span>
- <span class="i-sdc-designer-sidebar-section-content-item-value"
- data-tests-id="rightTab_projectCode" data-ng-bind="selectedComponent.projectCode"></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">Vendor Name:</span>
- <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.vendorName"
- tooltips tooltip-content="&#8203;{{selectedComponent.vendorName}}"
- data-tests-id="rightTab_vendorName">
- </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">Vendor Release:</span>
- <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.vendorRelease"
- tooltips tooltip-class="tooltip-custom break-word-tooltip" tooltip-content="&#8203;{{selectedComponent.vendorRelease}}"
- data-tests-id="rightTab_vendorRelease">
- </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" translate="GENERAL_LABEL_RESOURCE_MODEL_NUMBER"></span>
- <span class="i-sdc-designer-sidebar-section-content-item-value vendor-model-number" data-ng-bind="selectedComponent.resourceVendorModelNumber"
- tooltips tooltip-class="tooltip-custom break-word-tooltip" tooltip-content="&#8203;{{selectedComponent.resourceVendorModelNumber}}"
- data-tests-id="rightTab_resourceVendorModelNumber">
- </span>
- </div>
- <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.isService()">
- <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_SERVICE_TYPE"></span>
- <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.serviceType"
- tooltips tooltip-class="tooltip-custom break-word-tooltip" tooltip-content="&#8203;{{selectedComponent.serviceType}}"
- data-tests-id="rightTab_serviceType">
- </span>
- </div>
- <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.isService()">
- <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_SERVICE_ROLE"></span>
- <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.serviceRole"
- tooltips tooltip-class="tooltip-custom break-word-tooltip" tooltip-content="&#8203;{{selectedComponent.serviceRole}}"
- data-tests-id="rightTab_serviceRole">
- </span>
- </div>
- <div class="i-sdc-designer-sidebar-section-content-item">
- <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_CONTACT_ID"></span>
- <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="&#8203;{{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" 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>
- <div class="i-sdc-designer-sidebar-section-content-item description">
- <span class="i-sdc-designer-sidebar-section-content-item-label">Description:
-
- <span class="i-sdc-designer-sidebar-section-content-description-item-value" ellipsis="selectedComponent.description" max-chars="55"
- data-tests-id="rightTab_description"></span>
- </span>
- </div>
-
- </div>
- </div>
-
- <div class="w-sdc-designer-sidebar-section additionalInformation">
- <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content.additionalInformation" class="w-sdc-designer-sidebar-section-title">
- Additional Information
- <div class="w-sdc-designer-sidebar-section-title-icon"></div>
- </expand-collapse>
-
- <div class="w-sdc-designer-sidebar-section-content additionalInformation">
- <div class="i-sdc-designer-sidebar-section-content-item" data-ng-repeat="additionalInformation in selectedComponent.getAdditionalInformation() track by $index">
- <span class="i-sdc-designer-sidebar-section-content-item-label additional-information" data-ng-bind="additionalInformation.key" tooltips tooltip-content="{{additionalInformation.key}}"></span>
- <span class="i-sdc-designer-sidebar-section-content-item-label">:</span>
- <span class="i-sdc-designer-sidebar-section-content-item-value additional-information" data-ng-bind="additionalInformation.value"
- tooltips tooltip-class="tooltip-custom break-word-tooltip" tooltip-content="{{additionalInformation.value}}"></span>
- </div>
- </div>
- </div>
-
-
- <div class="w-sdc-designer-sidebar-section tags">
- <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content.tags" class="w-sdc-designer-sidebar-section-title">
- Tags
- <div class="w-sdc-designer-sidebar-section-title-icon"></div>
- </expand-collapse>
-
- <div class="w-sdc-designer-sidebar-section-content tags">
- <div class="i-sdc-designer-sidebar-section-content-item">
- <span class="i-sdc-designer-sidebar-section-content-item-tag" data-ng-if="selectedComponent.tags.indexOf(selectedComponent.name)===-1" data-ng-bind="selectedComponent.name"
- data-tests-id="rightTab_tag" tooltips tooltip-content="{{selectedComponent.name}}"></span>
- <span class="i-sdc-designer-sidebar-section-content-item-tag" data-ng-repeat="tag in selectedComponent.tags track by $index" data-ng-bind="tag"
- data-tests-id="rightTab_tag" tooltips tooltip-content="{{tag}}"></span>
- </div>
- </div>
- </div>
- </div>
-
-</perfect-scrollbar>
-
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
deleted file mode 100644
index 90bb5658c8..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details.less
+++ /dev/null
@@ -1,81 +0,0 @@
-.w-sdc-designer-sidebar-tab-content.details {
-
- .w-sdc-designer-sidebar-section-title + .w-sdc-designer-sidebar-section-content {
- padding: 0 10px 0 18px;
- }
-
- .w-sdc-designer-sidebar-section-title.expanded + .w-sdc-designer-sidebar-section-content {
- padding: 10px 10px 10px 18px;
- }
-
- .i-sdc-designer-sidebar-section-content-item-label {
- font-family: @font-opensans-medium;
- color: #191919;
- font-size: 13px;
- &.additional-information{
- max-width:100px;
- display: inline-block;
- text-overflow: ellipsis;
- overflow: hidden;
- vertical-align: bottom;
- }
-
- }
-
-
-
- .i-sdc-designer-sidebar-section-content-item-value {
- // .hyphenate;
- font-family: @font-opensans-regular;
- color: #191919;
- font-size: 13px;
- padding-left: 10px;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- //display: inline-block; fix long name for firefox
- max-width: 160px;
- vertical-align:bottom;
- font-weight: normal;
- &.vendor-model-number{
- max-width: 110px;
- }
- &.additional-information{
- max-width:160px;
- display: inline-block;
- }
- &.i-sdc-form-select {
- .b_1;
- border: 1px solid @border_color_f;
- width: 210px;
- max-width: 210px;
- padding-left: 4px;
-
- .select-instance-version {
- .b_1;
- &.minor {
- .h_1;
- }
- }
- }
- &.minor {
- .h_1;
- }
- }
- .i-sdc-designer-sidebar-section-content-description-item-value{
- max-width: none;
- font-weight: normal;
- font-family: @font-opensans-regular;
- }
-
- .customization-uuid{
- .f-type._12_m;
- }
-
- .w-sdc-designer-sidebar-section.tags {
- .i-sdc-designer-sidebar-section-content-item {
- white-space: normal;
- }
- }
-
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties-view-model.ts
deleted file mode 100644
index e3ddecd9a5..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties-view-model.ts
+++ /dev/null
@@ -1,244 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import * as _ from "lodash";
-import {
- AttributeModel,
- AttributesGroup,
- Component,
- ComponentInstance,
- PropertyModel,
- PropertiesGroup
-} from "app/models";
-import {ICompositionViewModelScope} from "../../composition-view-model";
-import {ModalsHandler} from "app/utils";
-import {ComponentServiceNg2} from "app/ng2/services/component-services/component.service";
-import {ComponentGenericResponse} from "app/ng2/services/responses/component-generic-response";
-
-interface IResourcePropertiesAndAttributesViewModelScope extends ICompositionViewModelScope {
- properties:PropertiesGroup;
- attributes:AttributesGroup;
- propertiesMessage:string;
- groupPropertiesByInstance:boolean;
- showGroupsOfInstanceProperties:Array<boolean>;
- addProperty():void;
- updateProperty(property:PropertyModel):void;
- deleteProperty(property:PropertyModel):void;
- viewAttribute(attribute:AttributeModel):void;
- groupNameByKey(key:string):string;
- isPropertyOwner():boolean;
- getComponentInstanceNameFromInstanceByKey(key:string):string;
-}
-
-export class ResourcePropertiesViewModel {
-
- static '$inject' = [
- '$scope',
- '$filter',
- '$uibModal',
- 'ModalsHandler',
- 'ComponentServiceNg2'
-
- ];
-
-
- constructor(private $scope:IResourcePropertiesAndAttributesViewModelScope,
- private $filter:ng.IFilterService,
- private $uibModal:ng.ui.bootstrap.IModalService,
- private ModalsHandler:ModalsHandler,
- private ComponentServiceNg2:ComponentServiceNg2) {
-
- this.getComponentInstancesPropertiesAndAttributes();
- }
-
- private initComponentProperties = ():void => {
- let result:PropertiesGroup = {};
-
- if (this.$scope.selectedComponent) {
- this.$scope.propertiesMessage = undefined;
- this.$scope.groupPropertiesByInstance = false;
- if (this.$scope.isComponentInstanceSelected()) {
- if (this.$scope.currentComponent.selectedInstance.originType === 'VF') {
- this.$scope.groupPropertiesByInstance = true;
- }
- result[this.$scope.currentComponent.selectedInstance.uniqueId] = this.$scope.currentComponent.componentInstancesProperties[this.$scope.currentComponent.selectedInstance.uniqueId];
- } else if (this.$scope.currentComponent.isService()) {
- // Temporally fix to hide properties for service (UI stack when there are many properties)
- result = this.$scope.currentComponent.componentInstancesProperties;
- this.$scope.propertiesMessage = "Note: properties for service are disabled";
- } else {
- let key = this.$scope.selectedComponent.uniqueId;
- result[key] = Array<PropertyModel>();
- let derived = Array<PropertyModel>();
- _.forEach(this.$scope.selectedComponent.properties, (property:PropertyModel) => {
- if (key == property.parentUniqueId) {
- result[key].push(property);
- } else {
- property.readonly = true;
- derived.push(property);
- }
- });
- if (derived.length) {
- result['derived'] = derived;
- }
- }
- this.$scope.properties = result;
- }
- };
-
-
- private initComponentAttributes = ():void => {
- let result:AttributesGroup = {};
-
- if (this.$scope.selectedComponent) {
- if (this.$scope.isComponentInstanceSelected()) {
- result[this.$scope.currentComponent.selectedInstance.uniqueId] = this.$scope.currentComponent.componentInstancesAttributes[this.$scope.currentComponent.selectedInstance.uniqueId];
- } else if (this.$scope.currentComponent.isService()) {
- result = this.$scope.currentComponent.componentInstancesAttributes;
- }
- this.$scope.attributes = result;
- }
- };
-
- /**
- * This function is checking if the component is the value owner of the current property
- * in order to notify the edit property modal which fields to disable
- */
- private isPropertyValueOwner = ():boolean => {
- return this.$scope.currentComponent.isService() || !!this.$scope.currentComponent.selectedInstance;
- };
-
- /**
- * The function opens the edit property modal.
- * It checks if the property is from the VF or from one of it's resource instances and sends the needed property list.
- * For create property reasons an empty array is transferd
- *
- * @param property the wanted property to edit/create
- */
- private openEditPropertyModal = (property:PropertyModel):void => {
- this.ModalsHandler.openEditPropertyModal(property,
- this.$scope.component,
- (this.$scope.isPropertyOwner() ?
- this.$scope.properties[property.parentUniqueId] :
- this.$scope.properties[property.resourceInstanceUniqueId]) || [],
- this.isPropertyValueOwner(), "component", property.resourceInstanceUniqueId).then((updatedProperty:PropertyModel) => {
- if(updatedProperty){
- let oldProp = _.find(this.$scope.properties[updatedProperty.resourceInstanceUniqueId], (prop:PropertyModel) => {return prop.uniqueId == updatedProperty.uniqueId;});
- oldProp.value = updatedProperty.value;
- }
- });
- };
-
- private openAttributeModal = (atrribute:AttributeModel):void => {
-
- let modalOptions:ng.ui.bootstrap.IModalSettings = {
- template: 'app/view-models/forms/attribute-form/attribute-form-view.html',
- controller: 'Sdc.ViewModels.AttributeFormViewModel',
- size: 'sdc-md',
- backdrop: 'static',
- keyboard: false,
- resolve: {
- attribute: ():AttributeModel => {
- return atrribute;
- },
- component: ():Component => {
- return this.$scope.currentComponent;
- }
- }
- };
- this.$uibModal.open(modalOptions);
- };
-
- private getComponentInstancesPropertiesAndAttributes = () => {
-
- this.ComponentServiceNg2.getComponentInstanceAttributesAndProperties(this.$scope.currentComponent).subscribe((genericResponse:ComponentGenericResponse) => {
- this.$scope.currentComponent.componentInstancesAttributes = genericResponse.componentInstancesAttributes;
- this.$scope.currentComponent.componentInstancesProperties = genericResponse.componentInstancesProperties;
- this.initScope();
- });
- };
-
- private initScope = ():void => {
-
-
- this.initComponentProperties();
- this.initComponentAttributes();
-
- this.$scope.$watchCollection('currentComponent.properties', (newData:any):void => {
- this.initComponentProperties();
- });
-
- this.$scope.$watch('currentComponent.selectedInstance', (newInstance:ComponentInstance):void => {
- if (angular.isDefined(newInstance)) {
- this.initComponentProperties();
- this.initComponentAttributes();
-
- }
- });
-
- this.$scope.isPropertyOwner = ():boolean => {
- return this.$scope.currentComponent && this.$scope.currentComponent.isResource() && !this.$scope.isComponentInstanceSelected();
- };
-
- this.$scope.updateProperty = (property:PropertyModel):void => {
- this.openEditPropertyModal(property);
- };
-
- this.$scope.deleteProperty = (property:PropertyModel):void => {
-
- let onOk = ():void => {
- this.$scope.currentComponent.deleteProperty(property.uniqueId);
- };
-
- let title:string = this.$filter('translate')("PROPERTY_VIEW_DELETE_MODAL_TITLE");
- let message:string = this.$filter('translate')("PROPERTY_VIEW_DELETE_MODAL_TEXT", "{'name': '" + property.name + "'}");
- this.ModalsHandler.openConfirmationModal(title, message, false).then(onOk);
- };
-
- this.$scope.viewAttribute = (attribute:AttributeModel):void => {
- this.openAttributeModal(attribute);
- };
-
- this.$scope.groupNameByKey = (key:string):string => {
- switch (key) {
- case 'derived':
- return "Derived";
-
- case this.$scope.currentComponent.uniqueId:
- return this.$filter("resourceName")(this.$scope.currentComponent.name);
-
- default:
- let componentInstance = _.find(this.$scope.currentComponent.componentInstances, {uniqueId: key});
- if(componentInstance)
- return this.$filter("resourceName")(componentInstance.name);
- }
- };
-
- this.$scope.getComponentInstanceNameFromInstanceByKey = (key:string):string => {
- let instanceName:string = "";
- if (key !== undefined && this.$scope.selectedComponent.uniqueId == this.$scope.currentComponent.selectedInstance.componentUid) {
- instanceName = this.$filter("resourceName")((_.find(this.$scope.selectedComponent.componentInstances, {uniqueId: key})).name);
- }
- return instanceName;
- };
-
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties-view.html
deleted file mode 100644
index cdd69682dc..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties-view.html
+++ /dev/null
@@ -1,133 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<perfect-scrollbar class="w-sdc-designer-sidebar-tab-content properties" id="main-scroll">
-
- <div class="w-sdc-designer-sidebar-section">
-
- <!--expand-collapse data-ng-if="isPropertyOwner() && !currentComponent.properties.length" expanded-selector=".w-sdc-composition-sidebar-section-content.{{currentComponent.name}}"
- class="w-sdc-composition-sidebar-section-title">
- <span class="w-sdc-composition-sidebar-section-title-text" tooltips tooltip-content="{{currentComponent.name | resourceName}}&nbsp;Properties"
- data-ng-bind="(currentComponent.name | resourceName)+ ' Properties'"></span>
- <div class="w-sdc-composition-sidebar-section-title-icon"></div>
- </expand-collapse-->
- <!--properties-->
- <expand-collapse data-ng-repeat-start="(key, group) in properties"
- expanded-selector=".w-sdc-designer-sidebar-section-content.properties.{{$index}}">
- <div class="first-level">
- <div class="expand-collapse-title-icon"></div>
- <span class="w-sdc-designer-sidebar-section-title-text" data-ng-bind="groupNameByKey(key) + ' Properties'"
- tooltips tooltip-content="{{groupNameByKey(key)}}&nbsp;Properties"
- data-tests-id="vfi-properties"></span>
- </div>
- </expand-collapse>
-
- <div data-ng-repeat-end="" class="w-sdc-designer-sidebar-section-content properties {{$index}}"> <!--data-ng-show="isShowDetailsSection" -->
- <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="!groupPropertiesByInstance">
- <div class="i-sdc-designer-sidebar-section-content-item-property-and-attribute" data-tests-id="propertyRow"
- data-ng-repeat="property in group | orderBy: 'name' track by $index">
- <div>
- <span class="i-sdc-designer-sidebar-section-content-item-property-and-attribute-label"
- data-ng-class="{'hand enabled': !$parent.isViewOnly}"
- tooltips tooltip-content="{{property.name}}"
- data-ng-click="!$parent.isViewOnly && updateProperty(property)"
- data-tests-id="{{property.name}}">{{property.name}}</span>
- </div>
- <div>
- <span class="i-sdc-designer-sidebar-section-content-item-property-value" data-ng-if="isPropertyOwner()"
- tooltips tooltip-content="{{property.defaultValue}}">{{property.defaultValue}}</span>
- <span class="i-sdc-designer-sidebar-section-content-item-property-value" data-ng-if="!isPropertyOwner()"
- tooltips tooltip-content="{{property.value}}"
- data-tests-id="value_{{property.name}}">{{property.value}}</span>
- </div>
- <button class="i-sdc-designer-sidebar-section-content-item-button delete sprite e-sdc-small-icon-delete"
- data-ng-if="!$parent.isViewOnly&&(isPropertyOwner() && !property.readonly)"
- data-ng-click="deleteProperty(property)" type="button"></button>
- </div>
- </div>
- <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="groupPropertiesByInstance">
- <div data-ng-repeat-start="(instancesIds , InstanceProperties) in (group | groupBy:'path')"
- class="vfci-properties-group"
- data-ng-click="showGroupsOfInstanceProperties[$index]=!showGroupsOfInstanceProperties[$index]"
- data-ng-class="{'expanded':showGroupsOfInstanceProperties[$index]}">
- <div class="second-level">
- <div class="expand-collapse-title-icon"></div>
- <span class="w-sdc-designer-sidebar-section-title-text" data-ng-bind="getComponentInstanceNameFromInstanceByKey(InstanceProperties[0].path[1]) + ' Properties'"
- tooltips tooltip-content="{{getComponentInstanceNameFromInstanceByKey(InstanceProperties[0].path[1])}}&nbsp;Properties"
- data-tests-id="vfci-properties"></span>
- </div>
- </div>
- <div data-ng-repeat-end="" class="w-sdc-designer-sidebar-section-content instance-properties {{$index}}" data-ng-if="showGroupsOfInstanceProperties[$index]">
- <div class="i-sdc-designer-sidebar-section-content-item">
- <div class="i-sdc-designer-sidebar-section-content-item-property-and-attribute" data-tests-id="propertyRow"
- data-ng-repeat="instanceProperty in InstanceProperties | orderBy: 'name'">
- <div>
- <span class="i-sdc-designer-sidebar-section-content-item-property-and-attribute-label"
- data-ng-class="{'hand enabled': !$parent.isViewOnly}"
- tooltips tooltip-content="{{instanceProperty.name}}"
- data-tests-id="vfci-property">{{instanceProperty.name}}</span>
- </div>
- <div>
- <span class="i-sdc-designer-sidebar-section-content-item-property-value"
- tooltips tooltip-content="{{instanceProperty.value === undefined ? instanceProperty.defaultValue : instanceProperty.value}}">
- {{instanceProperty.value === undefined ? instanceProperty.defaultValue : instanceProperty.value}}</span>
- </div>
- </div>
- </div>
- </div>
- </div>
- <!--<div class="w-sdc-designer-sidebar-section-footer" data-ng-if="(!$parent.isViewOnly && isPropertyOwner()) || showAddPropertyButton">-->
- <!--<button class="w-sdc-designer-sidebar-section-footer-action tlv-btn blue" data-tests-id="addGrey" data-ng-click="addProperty()" type="button">-->
- <!--Add Property-->
- <!--</button>-->
- <!--</div>-->
- </div>
-
-
- <!--attributes-->
- <expand-collapse data-ng-repeat-start="(key, group) in attributes"
- expanded-selector=".w-sdc-designer-sidebar-section-content.attributes.{{$index}}">
- <div class="first-level">
- <div class="expand-collapse-title-icon"></div>
- <span class="w-sdc-designer-sidebar-section-title-text" data-ng-bind="groupNameByKey(key) + ' Attributes'"
- tooltips tooltip-content="{{groupNameByKey(key)}}&nbsp;Attributes"></span>
- </div>
- </expand-collapse>
-
- <div data-ng-repeat-end="" class="w-sdc-designer-sidebar-section-content attributes {{$index}}"> <!--data-ng-show="isShowDetailsSection" -->
- <div class="i-sdc-designer-sidebar-section-content-item">
- <div class="i-sdc-designer-sidebar-section-content-item-property-and-attribute"
- data-ng-repeat="attribute in group | orderBy: 'name' track by $index">
- <div>
- <span class="i-sdc-designer-sidebar-section-content-item-property-and-attribute-label"
- data-ng-class="{'hand enabled': !$parent.isViewOnly}"
- tooltips tooltip-content="{{attribute.name}}"
- data-ng-click="!$parent.isViewOnly && viewAttribute(attribute)"
- data-tests-id="{{attribute.name}}-attr">{{attribute.name}}</span>
- </div>
- <div>
- <span class="i-sdc-designer-sidebar-section-content-item-property-value" data-ng-if="isPropertyOwner()"
- tooltips tooltip-content="{{attribute.defaultValue}}">{{attribute.defaultValue}}</span>
- <span class="i-sdc-designer-sidebar-section-content-item-property-value" data-ng-if="!isPropertyOwner()"
- tooltips tooltip-content="{{attribute.value}}" data-tests-id="value-of-{{attribute.name}}">{{attribute.value}}</span>
- </div>
- </div>
- </div>
-
- </div>
-
- </div>
-</perfect-scrollbar>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties.less b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties.less
deleted file mode 100644
index ce5acc83e5..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/properties-and-attributes/properties.less
+++ /dev/null
@@ -1,39 +0,0 @@
-.w-sdc-designer-sidebar-tab-content.properties {
- .i-sdc-designer-sidebar-section-content-item-property-and-attribute-label{
- display:block;
- font-weight: bold;
- }
- .i-sdc-designer-sidebar-section-content-item-button.update{
- right: 17px;
- }
- .i-sdc-designer-sidebar-section-content-item-button.delete{
- right: 35px;
- }
-
- .w-sdc-designer-sidebar-properties-disabled {
- .s_14_m;
- padding: 20px 20px;
- }
-
- .vfci-properties-group{
- background-color: @func_color_r;
- }
-
- .expand-collapse-title-icon{
- .hand;
- .sprite-new;
- .expand-collapse-plus-icon;
- vertical-align: middle;
- margin: 0 6px;
- }
-
- .expanded {
- .expand-collapse-title-icon {
- .expand-collapse-minus-icon;
- }
- }
-
- .w-sdc-designer-sidebar-section-title-text{
- vertical-align: middle;
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations-view-model.ts
deleted file mode 100644
index ce44aaff50..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations-view-model.ts
+++ /dev/null
@@ -1,177 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import * as _ from "lodash";
-import {ICompositionViewModelScope} from "../../composition-view-model";
-import {CapabilitiesGroup, Requirement, RequirementsGroup} from "app/models";
-import {ComponentServiceNg2} from "app/ng2/services/component-services/component.service";
-import {ComponentGenericResponse} from "app/ng2/services/responses/component-generic-response";
-import {GRAPH_EVENTS} from "app/utils";
-import {EventListenerService} from "app/services";
-import {ComponentInstance, Capability} from "app/models";
-
-interface IRelationsViewModelScope extends ICompositionViewModelScope {
- isLoading:boolean;
- $parent:ICompositionViewModelScope;
- getRelation(requirement:any):any;
- capabilities:Array<Capability>;
- requirements:Array<Requirement>;
-
- //for complex components
- capabilitiesInstancesMap:InstanceCapabilitiesMap;
- requirementsInstancesMap:InstanceRequirementsMap;
-}
-export class InstanceCapabilitiesMap {
- [key:string]:Array<Capability>;
-}
-
-export class InstanceRequirementsMap {
- [key:string]:Array<Requirement>;
-}
-
-export class RelationsViewModel {
-
- static '$inject' = [
- '$scope',
- '$filter',
- 'ComponentServiceNg2',
- 'EventListenerService'
- ];
-
- constructor(private $scope:IRelationsViewModelScope,
- private $filter:ng.IFilterService,
- private ComponentServiceNg2:ComponentServiceNg2,
- private eventListenerService:EventListenerService) {
- this.initScope();
- }
-
- private loadComplexComponentData = () => {
- this.$scope.isLoading = true;
- this.ComponentServiceNg2.getCapabilitiesAndRequirements(this.$scope.currentComponent.componentType, this.$scope.currentComponent.uniqueId).subscribe((response:ComponentGenericResponse) => {
- this.$scope.currentComponent.capabilities = response.capabilities;
- this.$scope.currentComponent.requirements = response.requirements;
- this.setScopeCapabilitiesRequirements(this.$scope.currentComponent.capabilities, this.$scope.currentComponent.requirements);
- this.initInstancesMap();
- this.$scope.isLoading = false;
- });
- }
-
-
- private extractValuesFromMap = (map:CapabilitiesGroup | RequirementsGroup):Array<any> => {
- let values = [];
- _.forEach(map, (capabilitiesOrRequirements:Array<Capability> | Array<Requirement>, key) => {
- values = values.concat(capabilitiesOrRequirements)
- }
- );
- return values;
- }
-
- private setScopeCapabilitiesRequirements = (capabilities:CapabilitiesGroup, requirements:RequirementsGroup) => {
- this.$scope.capabilities = this.extractValuesFromMap(capabilities);
- this.$scope.requirements = this.extractValuesFromMap(requirements);
- }
-
-
- private initInstancesMap = ():void => {
-
- this.$scope.capabilitiesInstancesMap = new InstanceCapabilitiesMap();
- _.forEach(this.$scope.capabilities, (capability:Capability) => {
- if (this.$scope.capabilitiesInstancesMap[capability.ownerName]) {
- this.$scope.capabilitiesInstancesMap[capability.ownerName] = this.$scope.capabilitiesInstancesMap[capability.ownerName].concat(capability);
- } else {
- this.$scope.capabilitiesInstancesMap[capability.ownerName] = new Array<Capability>(capability);
- }
- });
-
- this.$scope.requirementsInstancesMap = new InstanceRequirementsMap();
- _.forEach(this.$scope.requirements, (requirement:Requirement) => {
- if (this.$scope.requirementsInstancesMap[requirement.ownerName]) {
- this.$scope.requirementsInstancesMap[requirement.ownerName] = this.$scope.requirementsInstancesMap[requirement.ownerName].concat(requirement);
- } else {
- this.$scope.requirementsInstancesMap[requirement.ownerName] = new Array<Requirement>(requirement);
- }
- });
- }
-
- private initRequirementsAndCapabilities = (needUpdate?: boolean) => {
-
- // if instance selected, we take the requirement and capabilities of the instance - always exist because we load them with the graph
- if (this.$scope.isComponentInstanceSelected()) {
- this.$scope.isLoading = false;
- this.setScopeCapabilitiesRequirements(this.$scope.currentComponent.selectedInstance.capabilities, this.$scope.currentComponent.selectedInstance.requirements);
- if (this.$scope.currentComponent.selectedInstance.originType === 'VF') {
- this.initInstancesMap();
- }
- } else {
- // if instance not selected, we take the requirement and capabilities of the VF/SERVICE, if not exist we call api
- if (needUpdate || !this.$scope.currentComponent.capabilities || !this.$scope.currentComponent.requirements) {
- this.loadComplexComponentData();
-
- } else {
- this.$scope.isLoading = false;
- this.setScopeCapabilitiesRequirements(this.$scope.currentComponent.capabilities, this.$scope.currentComponent.requirements);
- this.initInstancesMap();
- }
- }
- }
-
- private updateRequirementCapabilities = () => {
- if (!this.$scope.isComponentInstanceSelected()) {
- this.loadComplexComponentData();
- }
- }
-
- private initEvents = ():void => {
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_NODE_SELECTED, this.initRequirementsAndCapabilities);
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_GRAPH_BACKGROUND_CLICKED, this.updateRequirementCapabilities);
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_CREATE_COMPONENT_INSTANCE, this.updateRequirementCapabilities);
- this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_DELETE_COMPONENT_INSTANCE, this.updateRequirementCapabilities);
- }
-
- private initScope = ():void => {
-
- this.$scope.requirements = [];
- this.$scope.capabilities = [];
-
- this.initEvents();
- this.initRequirementsAndCapabilities();
-
- this.$scope.isCurrentDisplayComponentIsComplex = ():boolean => {
- if (this.$scope.isComponentInstanceSelected()) {
- if (this.$scope.currentComponent.selectedInstance.originType === 'VF') {
- return true;
- }
- return false;
- } else {
- return this.$scope.currentComponent.isComplex();
- }
- }
-
- this.$scope.$on('$destroy', () => {
-
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_NODE_SELECTED, this.initRequirementsAndCapabilities);
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_GRAPH_BACKGROUND_CLICKED, this.updateRequirementCapabilities);
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_CREATE_COMPONENT_INSTANCE, this.updateRequirementCapabilities);
- this.eventListenerService.unRegisterObserver(GRAPH_EVENTS.ON_DELETE_COMPONENT_INSTANCE, this.updateRequirementCapabilities);
- });
-
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations-view.html
deleted file mode 100644
index 889f129dac..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations-view.html
+++ /dev/null
@@ -1,77 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<perfect-scrollbar class="w-sdc-designer-sidebar-tab-content sdc-general-tab relations">
- <div ng-if="!isCurrentDisplayComponentIsComplex()">
- <div class="w-sdc-designer-sidebar-section w-sdc-designer-sidebar-section-relations">
- <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content.capabilities" class="w-sdc-designer-sidebar-section-title"> Capabilities
- <div class="w-sdc-designer-sidebar-section-title-icon"></div>
- </expand-collapse>
- <div class="w-sdc-designer-sidebar-section-content capabilities">
- <capabilities-list capabilities="capabilities"></capabilities-list>
- </div>
- </div>
- <div class="w-sdc-designer-sidebar-section w-sdc-designer-sidebar-section-relations">
- <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content.requirements" class="w-sdc-designer-sidebar-section-title"> Requirements
- <div class="w-sdc-designer-sidebar-section-title-icon"></div>
- </expand-collapse>
-
- <div class="w-sdc-designer-sidebar-section-content requirements">
- <requirements-list component='currentComponent' requirements="requirements"></requirements-list>
- </div>
- </div>
- </div>
-
- <div ng-if="isCurrentDisplayComponentIsComplex()">
- <div class="w-sdc-designer-sidebar-section w-sdc-designer-sidebar-section-relations">
- <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content.capabilities" class="w-sdc-designer-sidebar-section-title"> Capabilities
- <div class="w-sdc-designer-sidebar-section-title-icon"></div>
- </expand-collapse>
- </div>
- <div class="w-sdc-designer-sidebar-section-content capabilities">
- <expand-collapse expanded-selector=".capabilities-component-instances.{{$index}}" is-close-on-init="true" class="general-tab-expand-collapse"
- data-ng-repeat-start="(key, instanceCapabilities) in capabilitiesInstancesMap track by $index">
- <div class="expand-collapse-title second-level">
- <div class="expand-collapse-title-icon"></div>
- <span class="expand-collapse-title-text" data-ng-bind="key"></span>
- </div>
- </expand-collapse>
-
- <div data-ng-repeat-end="" class="capabilities-component-instances {{$index}}">
- <capabilities-list capabilities="instanceCapabilities"></capabilities-list>
- </div>
- </div>
-
- <div class="w-sdc-designer-sidebar-section w-sdc-designer-sidebar-section-relations">
- <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content.requirements" class="w-sdc-designer-sidebar-section-title"> Requirements
- <div class="w-sdc-designer-sidebar-section-title-icon"></div>
- </expand-collapse>
- </div>
- <div class="w-sdc-designer-sidebar-section-content requirements">
- <expand-collapse expanded-selector=".requirements-component-instances.{{$index}}" is-close-on-init="true" class="general-tab-expand-collapse"
- data-ng-repeat-start="(key, instanceRequirements) in requirementsInstancesMap track by $index">
- <div class="expand-collapse-title second-level">
- <div class="expand-collapse-title-icon"></div>
- <span class="expand-collapse-title-text" data-ng-bind="key"></span>
- </div>
- </expand-collapse>
-
- <div data-ng-repeat-end="" class="requirements-component-instances {{$index}}">
- <requirements-list component='currentComponent' requirements="instanceRequirements"></requirements-list>
- </div>
- </div>
- </div>
-</perfect-scrollbar>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations.less b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations.less
deleted file mode 100644
index c3b224d5a6..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/relations/relations.less
+++ /dev/null
@@ -1,14 +0,0 @@
-.w-sdc-designer-sidebar-tab-content.relations {
-
- .w-sdc-designer-sidebar-section-content {
- padding: 0;
- }
-
- .w-sdc-designer-sidebar-section-title {
- &.expanded {
- margin-bottom: 0;
- }
- }
-}
-
-
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view-model.ts
deleted file mode 100644
index 737002303b..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view-model.ts
+++ /dev/null
@@ -1,101 +0,0 @@
-/*!
-* Copyright © 2016-2018 European Support Limited
-*
-* 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.
-*/
-
-
-import {ICompositionViewModelScope} from "../../composition-view-model";
-import {
- Service,
- PropertiesGroup,
- InputsGroup,
- ServiceInstanceObject,
- InterfaceModel,
- InputBEModel,
- CapabilitiesGroup,
- Capability,
- ComponentInstance
-} from 'app/models';
-import {ComponentGenericResponse} from "app/ng2/services/responses/component-generic-response";
-import {ServiceServiceNg2} from "app/ng2/services/component-services/service.service";
-
-interface IServiceConsumptionViewModelScope extends ICompositionViewModelScope {
- service: Service;
- instancesMappedList: Array<ServiceInstanceObject>;
- componentInstancesProperties: PropertiesGroup;
- componentInstancesInputs: InputsGroup;
- componentInstancesInterfaces: Map<string, Array<InterfaceModel>>;
- componentInputs: Array<InputBEModel>;
- componentCapabilities: Array<Capability>;
- instancesCapabilitiesMap: Map<string, Array<Capability>>;
-}
-
-
-export class ServiceConsumptionViewModel {
-
- static '$inject' = [
- '$scope',
- 'ServiceServiceNg2'
- ];
-
- constructor(private $scope:IServiceConsumptionViewModelScope, private ServiceServiceNg2:ServiceServiceNg2) {
- this.$scope.service = <Service>this.$scope.currentComponent;
- this.initInstances();
- this.initScope();
- }
-
- private initInstances = ():void => {
- this.ServiceServiceNg2.getServiceConsumptionData(this.$scope.service).subscribe((genericResponse:ComponentGenericResponse) => {
- this.$scope.componentInstancesProperties = genericResponse.componentInstancesProperties;
- this.$scope.componentInstancesInputs = genericResponse.componentInstancesInputs;
- this.$scope.componentInstancesInterfaces = genericResponse.componentInstancesInterfaces;
- this.$scope.componentInputs = genericResponse.inputs;
- this.buildInstancesCapabilitiesMap(genericResponse.componentInstances);
- this.updateInstanceAttributes();
- });
- }
-
- buildInstancesCapabilitiesMap = (componentInstances: Array<ComponentInstance>): void => {
- this.$scope.instancesCapabilitiesMap = new Map();
- let flattenCapabilities = [];
- _.forEach(componentInstances, componentInstance => {
- flattenCapabilities = CapabilitiesGroup.getFlattenedCapabilities(componentInstance.capabilities);
- this.$scope.instancesCapabilitiesMap[componentInstance.uniqueId] = _.filter(flattenCapabilities, cap => cap.properties && cap.ownerId === componentInstance.uniqueId);
- });
- }
-
- private updateInstanceAttributes = ():void => {
- if (this.$scope.isComponentInstanceSelected() && this.$scope.componentInstancesProperties) {
- this.$scope.instancesMappedList = this.$scope.service.componentInstances.map(coInstance => new ServiceInstanceObject({
- id: coInstance.uniqueId,
- name: coInstance.name,
- properties: this.$scope.componentInstancesProperties[coInstance.uniqueId] || [],
- inputs: this.$scope.componentInstancesInputs[coInstance.uniqueId] || [],
- interfaces: this.$scope.componentInstancesInterfaces[coInstance.uniqueId] || []
- }));
- }
- }
-
- private initScope = ():void => {
- this.$scope.$watch('currentComponent.selectedInstance', ():void => {
- this.updateInstanceAttributes();
- });
-
- this.$scope.registerCreateInstanceEvent(() => {
- this.initInstances();
- });
-
- this.$scope.$on('$destroy', this.$scope.unregisterCreateInstanceEvent);
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view.html
deleted file mode 100644
index 8404a7f653..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-consumption/service-consumption-view.html
+++ /dev/null
@@ -1,23 +0,0 @@
-<perfect-scrollbar class="w-sdc-designer-sidebar-tab-content service-consumption">
- <div class="w-sdc-designer-sidebar-section">
- <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" tooltips tooltip-content="Operation Consumption">Operation Consumption</span>
- <div class="w-sdc-designer-sidebar-section-title-icon"></div>
- </expand-collapse>
-
- <div class="w-sdc-designer-sidebar-section-content">
- <div class="i-sdc-designer-sidebar-section-content-item">
- <ng2-service-consumption
- [parent-service]="service"
- [selected-service]="selectedComponent"
- [selected-service-instance-id]="currentComponent.selectedInstance.uniqueId"
- [instances-mapped-list]="instancesMappedList"
- [parent-service-inputs]="componentInputs"
- [instances-capabilities-map]="instancesCapabilitiesMap"
- [readonly]="isViewMode() || !isDesigner()">
- </ng2-service-consumption>
- </div>
- </div>
- </div>
-</perfect-scrollbar> \ No newline at end of file
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view-model.ts
deleted file mode 100644
index b634e6021f..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view-model.ts
+++ /dev/null
@@ -1,125 +0,0 @@
-/*!
- * Copyright © 2016-2018 European Support Limited
- *
- * 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.
- */
-
-
-import {ICompositionViewModelScope} from "../../composition-view-model";
-import {Service, ComponentInstance, PropertiesGroup, ServiceInstanceObject, PropertyBEModel} from 'app/models';
-import {ComponentServiceNg2} from "app/ng2/services/component-services/component.service";
-import {ConstraintObject} from "app/ng2/components/logic/service-dependencies/service-dependencies.component";
-import {ComponentGenericResponse} from 'app/ng2/services/responses/component-generic-response';
-import {DEPENDENCY_EVENTS} from "app/utils/constants";
-import {EventListenerService} from 'app/services';
-
-interface IServiceDependenciesViewModelScope extends ICompositionViewModelScope {
- service: Service;
- selectedInstanceSiblings: Array<ServiceInstanceObject>;
- componentInstancesConstraints: Array<any>;
- selectedInstanceConstraints: Array<ConstraintObject>;
- selectedInstanceProperties: Array<PropertyBEModel>;
- updateSelectedInstanceConstraints(constraintsList:Array<ConstraintObject>): void;
- loadConstraints(): void;
- componentInstanceProperties: PropertiesGroup;
- notifyDependencyEventsObserver: Function;
-}
-
-
-
-export class ServiceDependenciesViewModel {
-
- static '$inject' = [
- '$scope',
- 'ComponentServiceNg2',
- 'EventListenerService'
- ];
-
- constructor(private $scope:IServiceDependenciesViewModelScope, private ComponentServiceNg2:ComponentServiceNg2, private eventListenerService: EventListenerService) {
- this.$scope.service = <Service>this.$scope.currentComponent;
- this.$scope.notifyDependencyEventsObserver = this.notifyDependencyEventsObserver;
- this.initInstancesWithProperties();
- this.loadConstraints();
-
- this.initScope();
- }
-
- private initInstancesWithProperties = ():void => {
- this.ComponentServiceNg2.getComponentInstanceProperties(this.$scope.currentComponent).subscribe((genericResponse:ComponentGenericResponse) => {
- this.$scope.componentInstanceProperties = genericResponse.componentInstancesProperties;
- this.updateInstanceAttributes();
- });
- }
-
- private updateInstanceAttributes = ():void => {
- if (this.$scope.isComponentInstanceSelected() && this.$scope.componentInstanceProperties) {
- let instancesMappedList = this.$scope.service.componentInstances.map(coInstance => new ServiceInstanceObject({
- id: coInstance.uniqueId,
- name: coInstance.name,
- properties: this.$scope.componentInstanceProperties[coInstance.uniqueId] || []
- }));
- this.$scope.selectedInstanceProperties = this.$scope.componentInstanceProperties[this.$scope.currentComponent.selectedInstance.uniqueId];
- this.$scope.selectedInstanceSiblings = instancesMappedList.filter(coInstance => coInstance.id !== this.$scope.currentComponent.selectedInstance.uniqueId);
- }
- }
-
- private initScope = ():void => {
- this.$scope.$watch('currentComponent.selectedInstance', (newInstance:ComponentInstance):void => {
- if (angular.isDefined(newInstance) && this.$scope.componentInstancesConstraints) {
- this.updateInstanceAttributes();
- this.$scope.selectedInstanceConstraints = this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId] ?
- this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId].properties :
- [];
- }
- });
- this.$scope.$watch('componentInstancesConstraints', (constraints: Array<any>):void => {
- if (angular.isDefined(constraints)) {
- if(this.$scope.isComponentInstanceSelected()) {
- this.$scope.selectedInstanceConstraints = this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId] ?
- this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId].properties || [] :
- [];
- }
- }
- });
-
- this.$scope.updateSelectedInstanceConstraints = (constraintsList:Array<ConstraintObject>):void => {
- this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId].properties = constraintsList;
- this.$scope.selectedInstanceConstraints = this.$scope.componentInstancesConstraints[this.$scope.currentComponent.selectedInstance.uniqueId].properties;
- }
-
- this.$scope.loadConstraints = ():void => {
- this.loadConstraints();
- }
-
- this.$scope.registerCreateInstanceEvent(() => {
- this.initInstancesWithProperties();
- });
-
- this.$scope.registerChangeComponentInstanceNameEvent((updatedComponentInstance) => {
- this.$scope.currentComponent.selectedInstance = updatedComponentInstance;
- });
-
- this.$scope.$on('$destroy', this.$scope.unregisterCreateInstanceEvent);
- this.$scope.$on('$destroy', this.$scope.unregisterChangeComponentInstanceNameEvent);
- }
-
- private loadConstraints = ():void => {
- this.ComponentServiceNg2.getServiceFilterConstraints(this.$scope.service).subscribe((response) => {
- this.$scope.componentInstancesConstraints = response.nodeFilterData;
- });
- }
-
- public notifyDependencyEventsObserver = (isChecked: boolean):void => {
- this.eventListenerService.notifyObservers(DEPENDENCY_EVENTS.ON_DEPENDENCY_CHANGE, isChecked);
- }
-} \ No newline at end of file
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view.html
deleted file mode 100644
index ba50994529..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/service-dependencies/service-dependencies-view.html
+++ /dev/null
@@ -1,25 +0,0 @@
-
-<perfect-scrollbar class="w-sdc-designer-sidebar-tab-content service-dependencies">
- <div class="w-sdc-designer-sidebar-section">
- <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" tooltips tooltip-content="Service Dependencies">Service Dependencies</span>
- <div class="w-sdc-designer-sidebar-section-title-icon"></div>
- </expand-collapse>
- <div class="w-sdc-designer-sidebar-section-content" data-ng-if="isComponentInstanceSelected()">
- <div class="i-sdc-designer-sidebar-section-content-item">
- <ng2-service-dependencies
- [composite-service]="service"
- [current-service-instance]="currentComponent.selectedInstance"
- [selected-instance-properties]="selectedInstanceProperties"
- [selected-instance-siblings]="selectedInstanceSiblings"
- [selected-instance-constraints]="selectedInstanceConstraints"
- [readonly]="isViewMode() || !isDesigner()"
- (dependency-status)="notifyDependencyEventsObserver($event)"
- (update-rules-list-event)="updateSelectedInstanceConstraints($event)"
- (load-rules-list-event)="loadConstraints()">
- </ng2-service-dependencies>
- </div>
- </div>
- </div>
-</perfect-scrollbar> \ No newline at end of file
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/structure/structure-view.html b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/structure/structure-view.html
deleted file mode 100644
index 4d89625e67..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/structure/structure-view.html
+++ /dev/null
@@ -1,29 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<perfect-scrollbar include-padding="true" class="w-sdc-designer-sidebar-tab-content">
-
- <div class="w-sdc-designer-sidebar-section">
- <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content" class="w-sdc-designer-sidebar-section-title">
- Composition
- <div class="w-sdc-designer-sidebar-section-title-icon"></div>
- </expand-collapse>
-
- <div class="w-sdc-designer-sidebar-section-content" ng-show="selectedComponent.isComplex()">
- <structure-tree component="selectedComponent"></structure-tree>
- </div>
- </div>
-</perfect-scrollbar>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/structure/structure-view.ts b/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/structure/structure-view.ts
deleted file mode 100644
index 41f24dc8e8..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/structure/structure-view.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import {ICompositionViewModelScope} from "../../composition-view-model";
-
-interface IStructureViewModel extends ICompositionViewModelScope {
-}
-
-export class StructureViewModel {
- static '$inject' = [
- '$scope'
- ];
-
- constructor(private $scope:IStructureViewModel) {
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-description-popover.html b/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-description-popover.html
deleted file mode 100644
index 94c28a0796..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-description-popover.html
+++ /dev/null
@@ -1,39 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<!-- Description Popover -->
-<div >
- <span data-tests-id='popover-x-button' data-ng-click='closeDescriptionPopover()' class='tlv-sprite tlv-x-btn close-popover-btn'></span>
- <div class="w-sdc-form-item" ng-form="descriptionForm" data-ng-class="{error:(descriptionForm.$dirty && descriptionForm.$invalid)}">
- <textarea class="i-sdc-form-textarea {{$index}}" data-ng-class="{'view-mode': isViewMode()}"
- data-ng-maxlength="256"
- maxlength="256"
- data-ng-required="true"
- name="description"
- data-ng-model="artifact.description"
- data-ng-model-options="{ debounce: 200 }"
- data-ng-pattern="getValidationPattern('string')"
- ng-readonly="isViewMode()"
- data-tests-id="description">
- </textarea>
-
- <div class="input-error" data-ng-show="descriptionForm.$dirty && descriptionForm.$invalid">
- <span ng-show="descriptionForm.$error.required" translate="ADD_ARTIFACT_ERROR_DESCRIPTION_REQUIRED"></span>
- <span ng-show="descriptionForm.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '256' }"></span>
- <span ng-show="descriptionForm.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span>
- </div>
- </div>
-</div>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-view-model.ts
deleted file mode 100644
index fc3de6e9e1..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-view-model.ts
+++ /dev/null
@@ -1,352 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * SDC
- * ================================================================================
- * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
- * Modifications Copyright (C) 2019 Nokia. 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=========================================================
- */
-
-//@require "./*.html"
-'use strict';
-import * as _ from "lodash";
-import {IWorkspaceViewModelScope} from "app/view-models/workspace/workspace-view-model";
-import {ArtifactModel, ArtifactGroupModel, Resource} from "app/models";
-import {ArtifactsUtils, ModalsHandler, ValidationUtils} from "app/utils";
-import {ComponentServiceNg2} from "app/ng2/services/component-services/component.service";
-import {ComponentGenericResponse} from "../../../../ng2/services/responses/component-generic-response";
-import {GenericArtifactBrowserComponent} from "../../../../ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component";
-import {PathsAndNamesDefinition} from "../../../../models/paths-and-names";
-import {ModalService as ModalServiceSdcUI} from "sdc-ui/lib/angular/modals/modal.service";
-import {IModalConfig} from "sdc-ui/lib/angular/modals/models/modal-config";
-import {CacheService} from "../../../../services/cache-service";
-import {GabConfig} from "../../../../models/gab-config";
-
-interface IDeploymentArtifactsViewModelScope extends IWorkspaceViewModelScope {
- tableHeadersList:Array<any>;
- reverse:boolean;
- sortBy:string;
- artifacts:Array<ArtifactModel>;
- editForm:ng.IFormController;
- isLoading:boolean;
- artifactDescriptions:any;
- selectedArtifactId:string;
- popoverTemplate:string;
-
- addOrUpdate(artifact:ArtifactModel):void;
- updateSelectedArtifact():void;
- delete(artifact:ArtifactModel):void;
- sort(sortBy:string):void;
- noArtifactsToShow():boolean;
- getValidationPattern(validationType:string, parameterType?:string):RegExp;
- validateJson(json:string):boolean;
- resetValue(parameter:any):void;
- viewModeOrCsarComponent():boolean;
- isLicenseArtifact(artifact:ArtifactModel):void;
- getEnvArtifact(heatArtifact:ArtifactModel):ArtifactModel;
- getEnvArtifactName(artifact:ArtifactModel):string;
- openEditEnvParametersModal(artifact:ArtifactModel):void;
- openDescriptionPopover(artifactId:string):void;
- closeDescriptionPopover():void;
-}
-
-export class DeploymentArtifactsViewModel {
-
- static '$inject' = [
- '$scope',
- '$templateCache',
- '$filter',
- 'Sdc.Services.CacheService',
- 'ValidationUtils',
- 'ArtifactsUtils',
- 'ModalsHandler',
- 'ComponentServiceNg2',
- 'ModalServiceSdcUI'
- ];
-
- constructor(private $scope:IDeploymentArtifactsViewModelScope,
- private $templateCache:ng.ITemplateCacheService,
- private $filter:ng.IFilterService,
- private cacheService:CacheService,
- private validationUtils:ValidationUtils,
- private artifactsUtils:ArtifactsUtils,
- private ModalsHandler:ModalsHandler,
- private ComponentServiceNg2: ComponentServiceNg2,
- private ModalServiceSdcUI: ModalServiceSdcUI) {
- this.initScope();
- }
-
- private initDescriptions = ():void => {
- this.$scope.artifactDescriptions = {};
- _.forEach(this.$scope.component.deploymentArtifacts, (artifact:ArtifactModel):void => {
- this.$scope.artifactDescriptions[artifact.artifactLabel] = artifact.description;
- });
- };
-
- private setArtifact = (artifact:ArtifactModel):void => {
- if (!artifact.description || !this.$scope.getValidationPattern('string').test(artifact.description)) {
- artifact.description = this.$scope.artifactDescriptions[artifact.artifactLabel];
- }
- };
-
- private initScopeArtifacts = ()=> {
- this.$scope.artifacts = <ArtifactModel[]>_.values(this.$scope.component.deploymentArtifacts);
- _.forEach(this.$scope.artifacts, (artifact:ArtifactModel):void => {
- artifact.envArtifact = this.getEnvArtifact(artifact);
- });
- };
-
- private initArtifacts = (loadFromServer:boolean):void => {
- if (loadFromServer) {
- this.$scope.isLoading = true;
- this.ComponentServiceNg2.getComponentDeploymentArtifacts(this.$scope.component).subscribe((response:ComponentGenericResponse) => {
- this.$scope.component.deploymentArtifacts = response.deploymentArtifacts;
- this.initScopeArtifacts();
- this.$scope.isLoading = false;
- });
- } else {
- this.initScopeArtifacts();
- }
-
- };
-
- private getEnvArtifact = (heatArtifact:ArtifactModel):ArtifactModel=> {
- return _.find(this.$scope.artifacts, (item:ArtifactModel)=> {
- return item.generatedFromId === heatArtifact.uniqueId;
- });
- };
-
- private getCurrentArtifact = ():ArtifactModel => {
- if (!this.$scope.selectedArtifactId) {
- return null;
- }
- let artifact:ArtifactModel = this.$scope.artifacts.filter((art) => {
- return art.uniqueId == this.$scope.selectedArtifactId;
- })[0];
- return artifact;
- }
-
- private initScope = ():void => {
- let self = this;
- this.$scope.isLoading = false;
- this.$scope.selectedArtifactId = null;
- this.initDescriptions();
- if(this.$scope.component.deploymentArtifacts) {
- this.initArtifacts(false);
- } else {
- this.initArtifacts(true);
- }
- this.$scope.setValidState(true);
-
- this.$scope.tableHeadersList = [
- {title: 'Name', property: 'artifactDisplayName'},
- {title: 'Type', property: 'artifactType'},
- {title: 'Deployment timeout', property: 'timeout'},
- {title: 'Version', property: 'artifactVersion'},
- {title: 'UUID', property: 'artifactUUID'}
- ];
-
- this.$templateCache.put("deployment-artifacts-description-popover.html", require('app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-description-popover.html'));
- this.$scope.popoverTemplate = "deployment-artifacts-description-popover.html";
-
- this.$scope.isLicenseArtifact = (artifact:ArtifactModel):boolean => {
- let isLicense:boolean = false;
- if (this.$scope.component.isResource() && (<Resource>this.$scope.component).isCsarComponent()) {
-
- isLicense = this.artifactsUtils.isLicenseType(artifact.artifactType);
- }
-
- return isLicense;
- };
-
- this.$scope.sort = (sortBy:string):void => {
- this.$scope.reverse = (this.$scope.sortBy === sortBy) ? !this.$scope.reverse : false;
- this.$scope.sortBy = sortBy;
- };
-
- this.$scope.getValidationPattern = (validationType:string, parameterType?:string):RegExp => {
- return this.validationUtils.getValidationPattern(validationType, parameterType);
- };
-
- this.$scope.validateJson = (json:string):boolean => {
- if (!json) {
- return true;
- }
- return this.validationUtils.validateJson(json);
- };
-
- this.$scope.viewModeOrCsarComponent = ():boolean => {
- return this.$scope.isViewMode() || (this.$scope.component.isResource() && (<Resource>this.$scope.component).isCsarComponent());
- };
-
- this.$scope.addOrUpdate = (artifact:ArtifactModel):void => {
- artifact.artifactGroupType = 'DEPLOYMENT';
- let artifactCopy = new ArtifactModel(artifact);
-
- let success = (response:any):void => {
- this.$scope.artifactDescriptions[artifactCopy.artifactLabel] = artifactCopy.description;
- this.initArtifacts(true);
- // this.$scope.artifacts = _.values(this.$scope.component.deploymentArtifacts);
- };
-
- let error = (err:any):void => {
- console.log(err);
- this.initArtifacts(true);
- // self.$scope.artifacts = _.values(self.$scope.component.deploymentArtifacts);
- };
-
- this.ModalsHandler.openArtifactModal(artifactCopy, this.$scope.component).then(success, error);
- };
-
- this.$scope.noArtifactsToShow = ():boolean => {
- return !_.some(this.$scope.artifacts, 'esId');
- };
-
- this.$scope.resetValue = (parameter:any):void => {
- if (!parameter.currentValue && parameter.defaultValue) {
- parameter.currentValue = parameter.defaultValue;
- }
- else if ('boolean' == parameter.type) {
- parameter.currentValue = parameter.currentValue.toUpperCase();
- }
- };
-
- this.$scope.$watch('editForm.$valid', ():void => {
- if (this.$scope.editForm) {
- // this.$scope.setValidState(this.$scope.editForm.$valid);
- }
- });
-
- this.$scope.updateSelectedArtifact = ():void => {
- if (!this.$scope.isViewMode() && !this.$scope.isLoading) {
- let artifact:ArtifactModel = this.getCurrentArtifact();
- this.setArtifact(artifact); //resets artifact description to original value if invalid.
- if (artifact && artifact.originalDescription != artifact.description) {
- this.$scope.isLoading = true;
- let onSuccess = (responseArtifact:ArtifactModel):void => {
- this.$scope.artifactDescriptions[responseArtifact.artifactLabel] = responseArtifact.description;
- // this.$scope.artifacts = _.values(this.$scope.component.deploymentArtifacts);
- this.initArtifacts(true);
- this.$scope.isLoading = false;
- };
-
- let onFailed = (error:any):void => {
- console.log('Delete artifact returned error:', error);
- this.$scope.isLoading = false;
- };
-
- this.$scope.component.addOrUpdateArtifact(artifact).then(onSuccess, onFailed);
- }
- }
- };
-
- this.$scope.delete = (artifact:ArtifactModel):void => {
- let onOk = ():void => {
- this.$scope.isLoading = true;
- let onSuccess = ():void => {
- this.$scope.isLoading = false;
- this.initArtifacts(true);
- //this.$scope.artifacts = _.values(this.$scope.component.deploymentArtifacts);
- };
-
- let onFailed = (error:any):void => {
- this.$scope.isLoading = false;
- console.log('Delete artifact returned error:', error);
- };
-
- this.$scope.component.deleteArtifact(artifact.uniqueId, artifact.artifactLabel).then(onSuccess, onFailed);
- };
-
- let title:string = self.$filter('translate')("ARTIFACT_VIEW_DELETE_MODAL_TITLE");
- let message:string = self.$filter('translate')("ARTIFACT_VIEW_DELETE_MODAL_TEXT", "{'name': '" + artifact.artifactDisplayName + "'}");
- this.ModalsHandler.openConfirmationModal(title, message, false).then(onOk);
- };
-
- this.$scope.getEnvArtifactName = (artifact:ArtifactModel):string => {
- let envArtifact = this.$scope.getEnvArtifact(artifact);
- if (envArtifact) {
- return envArtifact.artifactDisplayName;
- }
- };
-
- this.$scope.openGenericArtifactBrowserModal = (artifact:ArtifactModel):void => {
- let self = this;
- const title = 'Generic Artifact Browser';
- let modalConfig: IModalConfig = {
- size: 'xl',
- title: title,
- type: 'custom',
- buttons: [{
- id: 'closeGABButton',
- text: 'Close',
- size: "'x-small'",
- closeModal: true
- }]
- };
-
- const uiConfiguration: any = this.cacheService.get('UIConfiguration');
- let noConfig: boolean = false;
- let pathsandnames: PathsAndNamesDefinition[] = [];
-
- if(typeof uiConfiguration.gab === 'undefined') {
- noConfig = true;
- } else {
- const gabConfig: GabConfig = uiConfiguration.gab
- .find(config => config.artifactType === artifact.artifactType);
- if(typeof gabConfig === 'undefined') {
- noConfig = true;
- } else {
- pathsandnames = gabConfig.pathsAndNamesDefinitions;
- }
- }
-
- if(noConfig) {
- const msg = self.$filter('translate')("DEPLOYMENT_ARTIFACT_GAB_NO_CONFIG");
- this.ModalServiceSdcUI.openAlertModal(title, msg);
- }
-
- const modalInputs = {
- pathsandnames: pathsandnames,
- artifactid: artifact.esId,
- resourceid: this.$scope.component.uniqueId
- };
-
- this.ModalServiceSdcUI.openCustomModal(modalConfig, GenericArtifactBrowserComponent, modalInputs);
- };
-
- this.$scope.openEditEnvParametersModal = (artifact:ArtifactModel):void => {
- this.ModalsHandler.openEditEnvParametersModal(artifact, this.$scope.component).then(()=> {
- this.initArtifacts(true);
- }, ()=> {
- this.initArtifacts(true);
- });
- };
-
- this.$scope.openDescriptionPopover = (artifactId:string):void => {
- if (this.$scope.selectedArtifactId && this.$scope.selectedArtifactId != artifactId) {
- this.$scope.updateSelectedArtifact();
- }
- this.$scope.selectedArtifactId = artifactId;
-
- };
-
- this.$scope.closeDescriptionPopover = ():void => {
- if (this.$scope.selectedArtifactId) {
- this.$scope.updateSelectedArtifact();
- this.$scope.selectedArtifactId = null;
- }
- };
- };
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-view.html b/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-view.html
deleted file mode 100644
index a26bcdeccd..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts-view.html
+++ /dev/null
@@ -1,147 +0,0 @@
-<!--
- ~ Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
- ~ Modifications Copyright (C) 2019 Nokia. 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.
--->
-
-<div class="workspace-deployment-artifact">
-
- <div data-tests-id="add-deployment-artifact-button" ng-if="!isViewMode()" data-ng-class="{'disabled': isDisableMode()}" data-tests-id="add-property-button" class="add-btn" data-ng-click="addOrUpdate({})">Add</div>
-
- <div class="table-container-flex">
-
- <div class="table" data-ng-class="{'view-mode': isViewMode()}">
- <loader data-display="isLoading"></loader>
- <div class="head flex-container">
- <div class="table-header head-row hand flex-item" data-ng-repeat="header in tableHeadersList track by $index" data-ng-click="sort(header.property)">{{header.title}}
- <span data-ng-if="sortBy === header.property" class="table-header-sort-arrow" data-ng-class="{'down': reverse, 'up':!reverse}"> </span>
- </div>
- <div class="table-no-text-header head-row flex-item"></div>
- </div>
-
- <form class="body" name="editForm">
-
- <perfect-scrollbar scroll-y-margin-offset="0" include-padding="true" class="scrollbar-container">
-
- <!-- Artifact row -->
- <div ng-if="noArtifactsToShow()" data-ng-class="{'disabled': isDisableMode()}" class="no-row-text" translate="DEPLOYMENT_ARTIFACT_NO_ARTIFACTS_TO_DISPLAY"></div>
- <div data-ng-repeat-start="artifact in artifacts | orderBy:sortBy:reverse track by $index"
- class="flex-container data-row"
- data-ng-class="{'selected': selectedArtifactId == artifact.uniqueId }"
- data-ng-if="artifact.esId && 'HEAT_ENV' !== artifact.artifactType"
- data-tests-id="artifact-item-{{artifact.artifactDisplayName}}">
- <div class="table-col-general flex-item" >
- <div class="heat-env-connect-container" ng-class="{'heat-env-connect-container-view-mode': isViewMode()}" data-ng-if="artifact.envArtifact">
- <span class="heat-env-connect"></span>
- </div>
- <span data-tests-id="artifactDisplayName_{{artifact.artifactDisplayName}}" class="artifact-name text" tooltips tooltip-content="{{artifact.artifactDisplayName}}">{{artifact.artifactDisplayName}}</span>
-
- <span class="sprite-new show-desc hand description-popover-icon"
- uib-popover-template="popoverTemplate"
- popover-class="parameter-description-popover deployment-artifact-view top"
- popover-title="Description"
- popover-placement="auto top-left"
- popover-is-open="selectedArtifactId == artifact.uniqueId && !isLoading"
- popover-trigger="'none'"
- popover-append-to-body="false"
- data-ng-click="openDescriptionPopover(artifact.uniqueId)"
- data-tests-id="descriptionIcon_{{artifact.artifactDisplayName}}"></span>
- </div>
-
- <div class="table-col-general flex-item text" data-tests-id="artifactType_{{artifact.artifactDisplayName}}" tooltips tooltip-content="{{artifact.artifactType}}">
- {{artifact.artifactType}}
- </div>
- <div class="table-col-general flex-item" data-tests-id="timeout_{{artifact.artifactDisplayName}}">
- {{artifact.timeout? artifact.timeout:''}}
- </div>
- <div class="table-col-general flex-item" data-tests-id="artifactVersion_{{artifact.artifactDisplayName}}">
- {{artifact.artifactVersion}}
- </div>
- <div class="table-col-general flex-item text" data-tests-id="artifactUUID_{{artifact.artifactDisplayName}}" tooltips tooltip-content="{{artifact.artifactUUID}}">
- <span>{{artifact.artifactUUID}}</span>
- </div>
-
- <div class="table-btn-col flex-item">
- <button class="table-edit-btn" data-tests-id="edit_{{artifact.artifactDisplayName}}"
- data-ng-if="!isViewMode() && !artifact.isHEAT() && !artifact.isThirdParty() && !isLicenseArtifact(artifact)" data-ng-click="addOrUpdate(artifact)"></button>
- <button class="table-delete-btn" data-tests-id="delete_{{artifact.artifactDisplayName}}"
- data-ng-if="!isViewMode() && !artifact.isHEAT() && !artifact.isThirdParty() && !isLicenseArtifact(artifact)" data-ng-click="delete(artifact)"> </button>
- <button class="table-download-btn" download-artifact data-tests-id="download_{{artifact.artifactDisplayName}}"
- data-ng-if="artifact.artifactDisplayName" component="component" artifact="artifact"></button>
- <button ng-if="artifact.isGenericBrowseable()"
- class="table-magnifier-btn"
- data-ng-click="openGenericArtifactBrowserModal(artifact)" component="component" artifact="artifact"
- data-tests-id="gab-{{artifact.artifactDisplayName}}"></button>
- <button ng-if="!isViewMode() && artifact.isHEAT()"
- class="sprite e-sdc-small-icon-pad edit-paramtes-button"
- data-ng-click="openEditEnvParametersModal(artifact)" type="button"
- data-tests-id="edit-parameters-of-{{artifact.artifactDisplayName}}"></button>
- </div>
- </div>
- <div data-ng-repeat-end="" class="flex-container data-row" data-ng-if="artifact.envArtifact">
-
- <div class="table-col-general flex-item" zzdata-ng-click="!isViewMode() && addOrUpdate(artifact.envArtifact)">
- <span>{{artifact.envArtifact.artifactDisplayName}}</span>
- </div>
-
- <div class="table-col-general flex-item" data-tests-id="{{artifact.envArtifact.artifactType}}">
- {{artifact.envArtifact.artifactType}}
- </div>
- <div class="table-col-general flex-item" data-tests-id="{{artifact.envArtifact.timeout}}">
- {{artifact.envArtifact.timeout? artifact.envArtifact.timeout:''}}
- </div>
- <div class="table-col-general flex-item" data-tests-id="artifactEnvVersion_{{artifact.artifactDisplayName}}">
- {{artifact.envArtifact.artifactVersion}}
- </div>
- <div class="table-col-general flex-item text" data-tests-id="{{artifact.envArtifact.artifactUUID}}" tooltips tooltip-content="{{artifact.envArtifact.artifactUUID}}">
- <span>{{artifact.envArtifact.artifactUUID}}</span>
- </div>
-
-
- <div class="table-btn-col flex-item" >
- <button class="table-edit-btn" data-tests-id="edit_{{artifact.artifactLabel}}env"
- data-ng-if="!isViewMode()" data-ng-click="addOrUpdate(artifact.envArtifact)"></button>
- <button class="table-download-btn" data-tests-id="download_env_{{artifact.artifactDisplayName}}" download-artifact
- data-ng-if="artifact.artifactName" component="component" artifact="artifact.envArtifact"></button>
-
- </div>
- </div>
-
- <!--<div class="i-sdc-designer-sidebar-section-content-item-artifact-heat-env" ng-if="artifact.heatParameters.length">-->
- <!--<span class="enabled" data-ng-bind="getEnvArtifactName(artifact)" data-ng-click="!isViewMode() && addOrUpdate(getEnvArtifact(artifact))"></span>-->
- <!--<download-artifact class="i-sdc-designer-sidebar-section-content-item-button download-env sprite e-sdc-small-download hand" artifact="getEnvArtifact(artifact)"-->
- <!--component="currentComponent" instance="true"-->
- <!--data-tests-id="download"></download-artifact>-->
- <!--</div>-->
-
-
-
- <!-- Add artifacts buttons -->
- <!--<button class="add-button" data-ng-repeat="artifact in artifacts track by $index"-->
- <!--type="button"-->
- <!--data-ng-show="!artifact.esId"-->
- <!--data-ng-if="!viewModeOrCsarComponent()"-->
- <!--data-ng-class="{'disabled': isDisableMode() || component.isCsarComponent()}"-->
- <!--data-tests-id="{{artifact.artifactDisplayName}} deployment_artifact"-->
- <!--translate="DEPLOYMENT_ARTIFACT_BUTTON_ADD_HEAT"-->
- <!--translate-values="{'name': '{{artifact.artifactDisplayName}}'}"-->
- <!--data-ng-click="addOrUpdate(artifact)"></button>-->
-
- <!-- Top add button -->
- <button class="add-button" type="button" data-ng-if="!isViewMode()" data-ng-class="{'disabled': isDisableMode()}" translate="DEPLOYMENT_ARTIFACT_BUTTON_ADD_OTHER" data-ng-click="addOrUpdate({})"></button>
- </perfect-scrollbar>
- </form>
- </div>
- </div>
-</div>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts.less b/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts.less
deleted file mode 100644
index f67d088b5a..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/deployment-artifacts/deployment-artifacts.less
+++ /dev/null
@@ -1,201 +0,0 @@
-.workspace-deployment-artifact {
- width: 93%;
- display: inline-block;
- .table-container-flex .table .body .data-row + div.item-opened {
- align-items: center;
- padding: 10px 40px 10px 30px;
- }
-
- .w-sdc-classic-btn {
- float: right;
- margin-bottom: 10px;
- }
-
-
- .heat-env-connect-container{
- background-color: white;
- position: absolute;
- height: 70px;
- width:20px;
- left: 0;
- top:0;
- }
- .heat-env-connect-container-view-mode{
- background-color: @tlv_color_t;
- }
- .heat-env-connect{
- border-left: 1px #848586 solid;
- height: 50px;
- margin-left: 10px;
- margin-top: 10px;
- border-top: 1px #848586 solid;
- border-bottom: 1px #848586 solid;
- width: 11px;
- float: left;
-
- }
-
- .artifact-name{
- width:85%;
- }
-
- .table-container-flex .table .body .data-row div .heat-env-connect-container{
- border-right: none;
- }
-
- .i-sdc-designer-sidebar-section-content-item-file-link::before{
- content:"";
- background-color: white;
- width: 12px;
-
- }
-
-
-
- .table {
- height:490px;
- margin-bottom: 0;
- }
-
- .parameter-description {
- .circle(18px, @color_p);
- content: '?';
- line-height: 18px;
- vertical-align: middle;
- margin-left: 5px;
- cursor: default;
- display: inline-block;
- position: absolute;
- top: 16px;
- }
-
- .table-container-flex {
-
- margin-top: 0;
-
- .text{
- overflow: hidden;
- text-overflow: ellipsis;
- display: inline-block;
- white-space: nowrap;
- }
-
- .flex-item:nth-child(1) {
- flex-grow: 15;
- .hand;
- padding-left: 30px;
- position: relative;
- span.table-arrow {
- margin-right: 7px;
- }
- .description-popover-icon{
- float:right;
- margin-top:6px;
- }
- }
-
- .flex-item:nth-child(2) {
- flex-grow: 6;
- }
-
- .flex-item:nth-child(3) {
- flex-grow: 9;
- }
-
- .flex-item:nth-child(4) {
- flex-grow: 3;
- }
-
- .flex-item:nth-child(5) {
- flex-grow: 20;
- }
-
- .flex-item:nth-child(6) {
- flex-grow: 5;
-
- &.table-btn-col {
- display: flex;
- justify-content: space-between;
- align-items: center;
-
- button {
- flex: 0 1 auto;
- background-color: transparent;
- border: 0;
- margin: 0;
- }
- .edit-paramtes-button {
- order: -1;
- }
- }
- }
- }
- .w-sdc-form{
- text-align: left;
-
- .w-sdc-env-params{
- border-top: 1px solid #cdcdcd;
- margin: 25px 0 10px 0;
- }
-
- .i-sdc-form-textarea {
- border: 1px solid @color_e;
- min-height: 60px;
- padding: 10px 13px;
- width: 100%;
- resize: none;
-
- }
-
- .w-sdc-form-item {
- &.error {
- .i-sdc-form-input,
- .i-sdc-form-select,
- .i-sdc-form-textarea {
- border-color: @color_h;
- outline: none;
- box-sizing: border-box;
- }
- }
- }
-
- .i-sdc-env-form-label{
- font-family: @font-opensans-medium;
- color: @main_color_m;
- overflow: hidden;
- max-width: 450px;
- text-overflow: ellipsis;
- display: inline-block;
- white-space: nowrap;
- margin-top: 14px;
-
- &.required::before {
- color: #f33;
- content: '*';
- margin-right: 4px;
- }
- }
- }
-}
-
-.table-container-flex .table .body .scrollbar-container {
- overflow-x:auto !important; //need to override the overflow-hidden for the table so that the popover auto positioning works
- min-height: 400px;
-}
-
-.parameter-description-popover.deployment-artifact-view {
- margin-left: -22px;
- z-index: 1040;
- min-width: 300px;
- .input-error {
- .q_12_m;
- }
- .error textarea{
- border-color: @main_color_g;
- color: @color_h;
- outline: none;
- }
- .popover-content textarea {
- width:100%;
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment-view-model.ts
deleted file mode 100644
index 9df377c5fc..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment-view-model.ts
+++ /dev/null
@@ -1,146 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import {IWorkspaceViewModelScope} from "app/view-models/workspace/workspace-view-model";
-import {ComponentFactory, MenuHandler, ChangeLifecycleStateHandler, ModalsHandler} from "app/utils";
-import {LeftPaletteLoaderService, CacheService, SharingService} from "app/services";
-import {Component, IAppMenu, Tab, ComponentInstance} from "app/models";
-import {GRAPH_EVENTS} from "../../../../utils/constants";
-import {ComponentGenericResponse} from "../../../../ng2/services/responses/component-generic-response";
-import {EventListenerService} from "../../../../services/event-listener-service";
-import {ComponentServiceNg2} from "../../../../ng2/services/component-services/component.service";
-
-export interface IDeploymentViewModelScope extends IWorkspaceViewModelScope {
-
- currentComponent:Component;
- selectedComponent:Component;
- isLoading:boolean;
- sharingService:SharingService;
- sdcMenu:IAppMenu;
- version:string;
- isViewOnly:boolean;
- tabs:Array<Tab>;
- selectedTab: Tab;
- isComponentInstanceSelected():boolean;
- updateSelectedComponent():void
- openUpdateModal();
- deleteSelectedComponentInstance():void;
- onBackgroundClick():void;
- setSelectedInstance(componentInstance:ComponentInstance):void;
- printScreen():void;
-
-}
-
-export class DeploymentViewModel {
-
- static '$inject' = [
- '$scope',
- '$templateCache',
- 'sdcMenu',
- 'MenuHandler',
- '$state',
- 'Sdc.Services.SharingService',
- '$filter',
- 'Sdc.Services.CacheService',
- 'ComponentFactory',
- 'ChangeLifecycleStateHandler',
- 'LeftPaletteLoaderService',
- 'ModalsHandler',
- 'EventListenerService',
- 'ComponentServiceNg2'
- ];
-
- constructor(private $scope:IDeploymentViewModelScope,
- private $templateCache:ng.ITemplateCacheService,
- private sdcMenu:IAppMenu,
- private MenuHandler:MenuHandler,
- private $state:ng.ui.IStateService,
- private sharingService:SharingService,
- private $filter:ng.IFilterService,
- private cacheService:CacheService,
- private ComponentFactory:ComponentFactory,
- private ChangeLifecycleStateHandler:ChangeLifecycleStateHandler,
- private LeftPaletteLoaderService:LeftPaletteLoaderService,
- private ModalsHandler:ModalsHandler,
- private eventListenerService: EventListenerService,
- private ComponentServiceNg2: ComponentServiceNg2) {
-
- this.$scope.setValidState(true);
- this.initScope();
- this.initGraphData();
- }
-
-
- private initComponent = ():void => {
-
- this.$scope.currentComponent = this.$scope.component;
- this.$scope.selectedComponent = this.$scope.currentComponent;
- this.updateUuidMap();
- this.$scope.isViewOnly = this.$scope.isViewMode();
- };
-
-
- private updateUuidMap = ():void => {
- /**
- * In case user press F5, the page is refreshed and this.sharingService.currentEntity will be undefined,
- * but after loadService or loadResource this.sharingService.currentEntity will be defined.
- * Need to update the uuidMap with the new resource or service.
- */
- this.sharingService.addUuidValue(this.$scope.currentComponent.uniqueId, this.$scope.currentComponent.uuid);
- };
-
- private initRightTabs = ()=> {
- if (this.$scope.currentComponent.modules) {
- this.$templateCache.put("hierarchy-view.html", require('app/view-models/tabs/hierarchy/hierarchy-view.html'));
- let hierarchyTab = new Tab("hierarchy-view.html", 'Sdc.ViewModels.HierarchyViewModel', 'hierarchy', this.$scope.isViewMode(), this.$scope.currentComponent, 'hierarchy');
- this.$scope.tabs.push(hierarchyTab)
- }
- }
-
- private initGraphData = ():void => {
- if(!this.$scope.component.componentInstances || !this.$scope.component.componentInstancesRelations || !this.$scope.component.modules) {
- this.ComponentServiceNg2.getDeploymentGraphData(this.$scope.component).subscribe((response:ComponentGenericResponse) => {
- this.$scope.component.componentInstances = response.componentInstances;
- this.$scope.component.componentInstancesRelations = response.componentInstancesRelations;
- this.$scope.component.modules = response.modules;
- this.$scope.isLoading = false;
- this.initComponent();
- this.initRightTabs();
- this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_DEPLOYMENT_GRAPH_DATA_LOADED);
- this.$scope.selectedTab = this.$scope.tabs[0];
- });
- } else {
- this.$scope.isLoading = false;
- this.initRightTabs();
- this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_DEPLOYMENT_GRAPH_DATA_LOADED);
-
- }
- };
-
- private initScope = ():void => {
- this.$scope.isLoading = true;
- this.$scope.sharingService = this.sharingService;
- this.$scope.sdcMenu = this.sdcMenu;
- this.$scope.version = this.cacheService.get('version');
- this.initComponent();
- this.$scope.tabs = Array<Tab>();
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment-view.html b/catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment-view.html
deleted file mode 100644
index aae03135a3..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment-view.html
+++ /dev/null
@@ -1,26 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<div class="deployment-view">
- <loader display="isLoading"></loader>
- <div class="w-sdc-deployment-canvas" data-ng-class="{sidebaractive: displayDesignerRightSidebar}">
- <deployment-graph component="currentComponent" is-view-only="isViewOnly"></deployment-graph>
- </div>
-
- <div class="w-sdc-deployment-right-bar">
- <ng1-tabs tabs="tabs" is-view-only="isViewOnly" selected-tab="selectedTab"></ng1-tabs>
- </div>
-</div>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment.less b/catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment.less
deleted file mode 100644
index f51ff6220d..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/deployment/deployment.less
+++ /dev/null
@@ -1,34 +0,0 @@
-.deployment-view {
-
- display: inline-block;
- text-align: left;
- align-items: left;
- padding: 0;
- width: 100%;
- height: 100%;
-
- .w-sdc-deployment-canvas {
- .noselect;
- .bg_c;
- position: relative;
- bottom: 0;
- width: 100%;
- height: 100%;
- z-index: 0;
-
- .view-mode{
- background-color: #f8f8f8;
- border:0;
- }
- }
-
- .w-sdc-deployment-right-bar {
-
- .noselect;
- bottom: 0;
- position: absolute;
- right: 0px;
- transition: right 0.2s;
- top: @action_nav_height;
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal-view-model.ts
deleted file mode 100644
index eab06f28e8..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal-view-model.ts
+++ /dev/null
@@ -1,104 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import * as _ from "lodash";
-import {Distribution, DistributionComponent, ExportExcel} from "app/models";
-
-interface IDistributionStatusModalViewModelScope {
- distribution:Distribution;
- status:string;
- getStatusCount(distributionComponent:Array<DistributionComponent>):any;
- getUrlName(url:string):string;
- modalDitributionStatus:ng.ui.bootstrap.IModalServiceInstance;
- footerButtons:Array<any>;
- //exportExcelData:ExportExcel;
- close():void;
- initDataForExportExcel():ExportExcel;
-}
-
-export class DistributionStatusModalViewModel {
-
- static '$inject' = ['$scope', '$uibModalInstance', 'data', '$filter'];
-
- constructor(private $scope:IDistributionStatusModalViewModelScope,
- private $uibModalInstance:ng.ui.bootstrap.IModalServiceInstance,
- private data:any,
- private $filter:ng.IFilterService) {
- this.initScope();
- }
-
- private generateMetaDataForExportExcel = ():Array<string>=> {
- let metaData = [];
- metaData[0] = 'Name:' + this.data.component.name + '| UUID:' + this.data.component.uuid + '| Invariant UUID:' + this.data.component.invariantUUID;
- metaData[1] = 'Distribution ID:' + this.$scope.distribution.distributionID +
- '| USER ID:' + this.$scope.distribution.userId +
- '| Time[UTC]:' + this.$filter('date')(this.$scope.distribution.timestamp, 'MM/dd/yyyy h:mma', 'UTC') +
- '| Status:' + this.$scope.distribution.deployementStatus;
- return metaData;
- };
-
- private generateDataObjectForExportExcel = ():any=> {
- let correctFormatDataObj = [];
- _.each(this.$scope.distribution.distributionComponents, (dComponent:DistributionComponent) => {
- if (dComponent.status == this.$scope.status) {
- correctFormatDataObj.push({
- 'omfComponentID': dComponent.omfComponentID,
- 'artiFactName': this.$scope.getUrlName(dComponent.url),
- 'url': dComponent.url,
- 'timestamp': this.$filter('date')(dComponent.timestamp, 'MM/dd/yyyy h:mma', 'UTC'),
- 'status': dComponent.status
- });
- }
- });
- return correctFormatDataObj;
- };
-
- private initScope = ():void => {
- this.$scope.distribution = this.data.distribution;
- this.$scope.status = this.data.status;
- this.$scope.modalDitributionStatus = this.$uibModalInstance;
-
-
- this.$scope.getUrlName = (url:string):string => {
- let urlName:string = _.last(url.split('/'));
- return urlName;
- };
-
- this.$scope.initDataForExportExcel = ():ExportExcel => {
- let exportExcelData = new ExportExcel();
- exportExcelData.fileName = this.$scope.status;
- exportExcelData.groupByField = "omfComponentID";
- exportExcelData.tableHeaders = ["Component ID", "Artifact Name", "URL", "Time(UTC)", "Status"];
- exportExcelData.metaData = this.generateMetaDataForExportExcel();
- exportExcelData.dataObj = this.generateDataObjectForExportExcel();
- return exportExcelData;
- };
-
- this.$scope.close = ():void => {
- this.$uibModalInstance.close();
- };
-
- this.$scope.footerButtons = [
- {'name': 'Close', 'css': 'blue', 'callback': this.$scope.close}
- ];
-
- };
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal-view.html b/catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal-view.html
deleted file mode 100644
index 0e58959e9a..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal-view.html
+++ /dev/null
@@ -1,146 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<ng1-modal modal="modalDitributionStatus" type="classic" class="w-sdc-classic-top-line-modal" buttons="footerButtons" header="Distribution by Status" show-close-button="true">
-
- <div class="w-sdc-distribution-view">
- <div class="w-sdc-distribution-view-header">
-
- </div>
-
- <div class="actions-buttons">
- <json-export-excel init-export-excel-data="initDataForExportExcel()">
- </json-export-excel>
- </div>
-
- <perfect-scrollbar include-padding="true" class="w-sdc-distribution-view-content">
- <div class="w-sdc-distribution-view-content-section w-sdc-distribute-parent-block">
- <ul>
- <li class="w-sdc-distribute-parent-block" >
- <div class="w-sdc-distribute-row w-sdc-distribute-row-extends extends">
-
- <div class="w-sdc-distribute-row-content">
- <div class="w-sdc-distribute-content">
- <div class="title-section item-1">
- <div class="title">Distribution ID</div>
- <div data-ng-bind="distribution.distributionID"></div>
- </div>
- <div class="title-section item-2">
- <div class="title" translate="DISTRIBUTION_VIEW_TITLE_USER_ID"></div>
- <div data-ng-bind="distribution.userId"></div>
- </div>
- <div class="title-section item-3">
- <div class="title">Time[UTC]:</div>
- <div
- data-ng-bind="distribution.timestamp | stringToDateFilter | date: 'MM/dd/yyyy h:mma':'UTC'"></div>
- </div>
- <div class="title-section item-4">
- <span class="sprite-new status-icon" data-ng-class="distribution.deployementStatus"></span>
- <span class="sprite-new" data-ng-bind="distribution.deployementStatus"></span>
- </div>
- </div>
- <div class="w-sdc-distribute-status-block" data-ng-show="distribution.statusCount">
- <div class="status-item-1">Status: {{status}} <span data-ng-bind="(distribution.distributionComponents | filter:status:true).length"
- class="blue-font"></span></div>
-
- </div>
- </div>
- </div>
-
- <ul class="w-sdc-distribute-components-block disable-hover">
- <li data-ng-repeat="(omfComponentID,omfComponentList) in distribution.distributionComponents | orderBy: '-timestamp' | filter:status:true | groupBy:'omfComponentID'"
- class="disable-hover">
- <div class="w-sdc-distribute-row omf-component-row w-sdc-distribute-row-extends "
- data-ng-class="{'extends': omfComponentListExtends}">
- <div class="w-sdc-distribution-arrow-btn" data-ng-click="omfComponentListExtends=!omfComponentListExtends"
- ng-class="{'extends': omfComponentListExtends}"
- data-ng-init="omfComponentListExtends=false"
- ></div>
- <div class="w-sdc-distribute-status-block">
- <div class="status-item-1">{{omfComponentID}} <span class="blue-font">{{omfComponentList.length}}</span>
- </div>
- </div>
- </div>
- <div data-ng-show="omfComponentListExtends"
- class="w-sdc-distribute-omfComponent-block disable-hover">
- <div class="w-sdc-distribute-row-extends disable-hover">
- <div class="disable-hover">
- <div class="w-sdc-distribute-row omfComponent-table-head">
- <div class="title item-1">Component ID</div>
- <div class="title item-2">Artifact Name</div>
- <div class="title item-3">URL</div>
- <div class="title item-4">Time(UTC)</div>
- <div class="title item-5">Status</div>
- </div>
-
- <div class="w-sdc-distribute-row omfComponent-table-row"
- data-ng-repeat-start="(url,urlList) in omfComponentList | orderBy: '-timestamp' | groupBy:'url'"
- data-ng-class="urlListExtends?'extends row-{{$index}}':'row-{{$index}}'" >
- <div class="w-sdc-distribute-cell item-1">
- <div class="w-sdc-distribution-arrow-btn" data-ng-click="urlListExtends=!urlListExtends"
- data-ng-class="{'extends': urlListExtends}"
- data-ng-init="urlListListExtends=false"
- ></div>
- {{urlList[0].omfComponentID}}
- </div>
- <div class="w-sdc-distribute-cell item-2" sdc-smart-tooltip>
- {{getUrlName(urlList[0].url)}}
- </div>
- <div class="w-sdc-distribute-cell item-3 disable-hover">
- <div sdc-smart-tooltip class="distribution-url">{{urlList[0].url}}</div>
- <div sdc-smart-tooltip title="Copy url" clipboard text="urlList[0].url"
- class="sprite-new link-btn copy-link disable-hover"></div>
- </div>
- <div class="w-sdc-distribute-cell item-4"><span
- data-ng-bind="urlList[0].timestamp | date: 'MM/dd/yyyy h:mma':'UTC'"></span>
- </div>
- <div class="w-sdc-distribute-cell item-5">{{urlList[0].status}}</div>
- </div>
-
-
- <div data-ng-repeat-end data-ng-show="urlListExtends" class="disable-hover">
- <div class="w-sdc-distribute-row extends disable-hover">
- <ul data-ng-show="urlListExtends"
- class="w-sdc-distribute-url-block disable-hover">
- <li data-ng-repeat="distributionComponent in urlList | orderBy: '-timestamp'"
- class="disable-hover">
- <span
- data-ng-bind="distributionComponent.timestamp | date: 'MM/dd/yyyy h:mma':'UTC'"
- class="disable-hover"></span>
- <span
- class="disable-hover">{{distributionComponent.status}}</span>
- <span
- class="disable-hover reason" data-ng-show="distributionComponent.status == 'NOT_NOTIFIED'">Reason: Component has determined artifact is not needed.</span>
- <span
- class="disable-hover reason" data-ng-show="distributionComponent.errorReason">Reason: {{distributionComponent.errorReason}}</span>
- </li>
- </ul>
- </div>
- </div>
- </div>
- </div>
- </div>
- </li>
- </ul>
- </li>
- </ul>
- </div>
-
- </perfect-scrollbar>
- </div>
-
-
-</ng1-modal>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal.less b/catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal.less
deleted file mode 100644
index d167083a2b..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/distribution/disribution-status-modal/disribution-status-modal.less
+++ /dev/null
@@ -1,40 +0,0 @@
-.w-sdc-classic-top-line-modal {
-
- .w-sdc-modal-head {
- // border-bottom: none;
- }
- .w-sdc-distribution-view {
- .actions-buttons {
- height: 29px;
- padding: 0 25px 0 0px;
- span{
- float: right;
- }
- }
-
- .w-sdc-distribution-view-content {
- height: 500px;
- }
-
- .w-sdc-distribution-view-content-section {
-
- .w-sdc-distribute-parent-block {
- .w-sdc-distribute-components-block {
-
- .omf-component-row {
- .w-sdc-distribute-status-block {
- margin-left: 0;
- }
-
- }
- div {
- padding-left: 0;
- }
- }
-
- }
-
- }
- }
-}
-
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution-view-model.ts
deleted file mode 100644
index 47ec1fd9e3..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution-view-model.ts
+++ /dev/null
@@ -1,131 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import * as _ from "lodash";
-import {Distribution, DistributionComponent, Service} from "app/models";
-import {ModalsHandler, Dictionary} from "app/utils";
-import {IWorkspaceViewModelScope} from "app/view-models/workspace/workspace-view-model";
-
-interface IDistributionViewModel extends IWorkspaceViewModelScope {
- modalDistribution:ng.ui.bootstrap.IModalServiceInstance;
- service:Service;
- distributions:Array<Distribution>;
- showComponents(distribution:Distribution):void;
- markAsDeployed(distribution:Distribution):void;
- getStatusCount(distributionComponent:Array<DistributionComponent>):any;
- initDistributions():void;
- getUrlName(url:string):string;
- close():void;
- openDisributionStatusModal:Function;
-}
-
-export class DistributionViewModel {
-
- static '$inject' = [
- '$scope',
- 'ModalsHandler'
-
- ];
-
- constructor(private $scope:IDistributionViewModel,
- private ModalsHandler:ModalsHandler) {
- this.initScope();
- this.$scope.setValidState(true);
- }
-
- private initScope = ():void => {
- this.$scope.service = <Service>this.$scope.component;
-
-
- // Open Distribution status modal
- this.$scope.openDisributionStatusModal = (distribution:Distribution, status:string):void => {
- this.ModalsHandler.openDistributionStatusModal(distribution, status, this.$scope.component).then(()=> {
- // OK
- }, ()=> {
- // ERROR
- });
- };
-
-
- this.$scope.showComponents = (distribution:Distribution):void => {
- let onError = (response) => {
- console.info('onError showComponents', response);
- };
- let onSuccess = (distributionComponents:Array<DistributionComponent>) => {
- distribution.distributionComponents = distributionComponents;
- distribution.statusCount = this.$scope.getStatusCount(distribution.distributionComponents);
- // distribution.components = this.aggregateDistributionComponent(distributionComponents);;
- };
- this.$scope.service.getDistributionsComponent(distribution.distributionID).then(onSuccess, onError);
- };
-
- this.$scope.getStatusCount = (distributionComponent:Array<DistributionComponent>):any => {
- return _.countBy(distributionComponent, 'status')
- };
-
- this.$scope.getUrlName = (url:string):string => {
- let urlName:string = _.last(url.split('/'));
- return urlName;
- };
-
- this.$scope.markAsDeployed = (distribution:Distribution):void => {
- let onError = (response) => {
- console.info('onError markAsDeployed', response);
- };
- let onSuccess = (result:any) => {
- distribution.deployementStatus = 'Deployed';
- };
- this.$scope.service.markAsDeployed(distribution.distributionID).then(onSuccess, onError);
-
- };
-
- this.$scope.initDistributions = ():void => {
- let onError = (response) => {
- console.info('onError initDistributions', response);
- };
- let onSuccess = (distributions:Array<Distribution>) => {
- this.$scope.distributions = distributions;
- };
- this.$scope.service.getDistributionsList().then(onSuccess, onError);
- };
-
- this.$scope.initDistributions();
-
- };
-
-
- private aggregateDistributionComponent = (distributionComponents:Array<DistributionComponent>):any => {
- let aggregateDistributions:Dictionary<string,Dictionary<string,Array<DistributionComponent>>> = new Dictionary<string,Dictionary<string,Array<DistributionComponent>>>();
- let tempAggregateDistributions:any = _.groupBy(distributionComponents, 'omfComponentID');
- let aa = new Dictionary<string,Array<DistributionComponent>>();
-
- let tempAggregate:any;
- _.forEach(tempAggregateDistributions, (distributionComponents:Array<DistributionComponent>, omfComponentID:string)=> {
-
- let urls:any = _.groupBy(distributionComponents, 'url');
- aggregateDistributions.setValue(omfComponentID, urls);
- // aggregateDistributions[omfComponentID] = ;
-
- });
- console.log(aggregateDistributions);
- return aggregateDistributions;
- };
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution-view.html b/catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution-view.html
deleted file mode 100644
index babe5c2e5a..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution-view.html
+++ /dev/null
@@ -1,198 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<div class="w-sdc-distribution-view">
- <div class="w-sdc-distribution-view-header">
- <div class="w-sdc-distribution-view-title">DISTRIBUTION <span data-ng-bind="'[' + distributions.length +']'"
- class="blue-font"></span></div>
- <div class="header-spacer"></div>
- <div class="top-search">
- <input type="text"
- style="width: auto;"
- class="search-text"
- data-tests-id="searchTextbox"
- placeholder="Search"
- data-ng-model="searchBind"
- data-tests-id="main-menu-input-search"
- ng-model-options="{ debounce: 500 }"/>
- <span class="w-sdc-search-icon magnification"></span>
- </div>
- <div class="sprite-new refresh-btn" data-tests-id="refreshButton" data-ng-click="initDistributions()" sdc-smart-tooltip=""
- title="Refresh"></div>
- </div>
-
-
- <perfect-scrollbar include-padding="true" class="w-sdc-distribution-view-content">
- <div class="w-sdc-distribution-view-content-section" data-tests-id="ditributionTable">
- <ul>
- <li data-ng-repeat="item in distributions | orderBy: '-timestamp' | filter:searchBind"
- data-ng-init="item.dateFormat = ( item.timestamp | stringToDateFilter | date: 'MM/dd/yyyy h:mma':'UTC' )"
- class="w-sdc-distribute-parent-block" data-tests-id="record_{{$index}}" data-ng-class="{'extends': item.showDetails}">
- <div class="w-sdc-distribute-row w-sdc-distribute-row-extends"
- data-ng-class="{'extends': item.showDetails && item.distributionComponents.length}">
- <div class="w-sdc-distribution-arrow-btn" data-tests-id="ShowRecordButton_{{$index}}" data-ng-click="showComponents(item); item.showDetails=!item.showDetails"
- data-ng-class="{'extends': item.showDetails}"
- ></div>
- <div class="w-sdc-distribute-row-content">
- <div class="w-sdc-distribute-content">
- <div class="title-section item-1">
- <div class="title">Distribution ID</div>
- <div data-ng-bind="item.distributionID"></div>
- </div>
- <div class="title-section item-2">
- <div class="title" translate="DISTRIBUTION_VIEW_TITLE_USER_ID"></div>
- <div data-ng-bind="item.userId"></div>
- </div>
- <div class="title-section item-3">
- <div class="title">Time[UTC]:</div>
- <div
- data-ng-bind="item.dateFormat"></div>
- </div>
- <div class="title-section item-4">
- <span class="sprite-new status-icon" data-ng-class="item.deployementStatus"></span>
- <span class="sprite-new" data-ng-bind="item.deployementStatus"></span>
- </div>
- <div>
- <div class="sprite-new distribution-bth item-5"
- data-ng-class="{'disable':item.deployementStatus==='Deployed'}"
- data-ng-click="(item.deployementStatus==='Deployed') || markAsDeployed(item)"></div>
- </div>
- </div>
- <div class="w-sdc-distribute-status-block" data-ng-if="item.statusCount">
- <div class="status-item-1">Total Artifacts:<span data-ng-bind="(item.statusCount.NOT_NOTIFIED || 0) + (item.statusCount.NOTIFIED || 0) "
- class="blue-font" data-tests-id="totalArtifacts_{{$index}}"></span></div>
- <div class="status-item-2 " ><sapn class="link" data-ng-click="openDisributionStatusModal(item,'NOTIFIED')">Notified:</sapn><span
- data-ng-bind="item.statusCount.NOTIFIED || 0" class="blue-font" data-tests-id="notified_{{$index}}"></span></div>
-
- <div class="status-item-3 link" ><sapn class="link" data-ng-click="openDisributionStatusModal(item,'DOWNLOAD_OK')">Downloaded:</sapn><span
- data-ng-bind="item.statusCount.DOWNLOAD_OK || 0" class="blue-font" data-tests-id="downloaded_{{$index}}"></span></div>
-
- <div class="status-item-4 link"><sapn class="link" data-ng-click="openDisributionStatusModal(item,'DEPLOY_OK')">Deployed:</sapn><span
- data-ng-bind="item.statusCount.DEPLOY_OK || 0" class="blue-font" data-tests-id="deployed_{{$index}}" ></span><span
- data-ng-class="{'deployed':(item.statusCount.DEPLOY_OK > 0)}"></span></div>
- <div class="status-item-5 link" ><sapn class="link" data-ng-click="openDisributionStatusModal(item,'NOT_NOTIFIED')">Not Notified:</sapn><span
- data-ng-bind="item.statusCount.NOT_NOTIFIED || 0" class="blue-font" data-tests-id="NotNotified_{{$index}}"></span></div>
- <div class="status-item-6"><sapn class="link" data-ng-click="openDisributionStatusModal(item,'DEPLOY_ERROR')" >Deploy Errors:</sapn><span
- data-ng-bind="item.statusCount.DEPLOY_ERROR || 0" class="red-font "></span><span
- data-ng-class="{'error':(item.statusCount.DEPLOY_ERROR > 0)}" data-tests-id="errors_{{$index}}"></span></div>
- <div class="status-item-7"><sapn class="link" data-ng-click="openDisributionStatusModal(item,'DOWNLOAD_ERROR')" >Download Errors:</sapn><span
- data-ng-bind="item.statusCount.DOWNLOAD_ERROR || 0" class="red-font "></span><span
- data-ng-class="{'error':(item.statusCount.DOWNLOAD_ERROR > 0)}" data-tests-id="errors_{{$index}}"></span></div>
- </div>
- </div>
- </div>
-
- <ul data-ng-if="item.showDetails && item.distributionComponents.length"
- class="w-sdc-distribute-components-block disable-hover">
-
- <li data-ng-repeat="(omfComponentID,omfComponentList) in ::item.distributionComponents | orderBy: '-timestamp' | filter:searchBind | groupBy:'omfComponentID' "
- class="disable-hover"
- data-ng-init="statusCount = getStatusCount(omfComponentList);">
- <div class="w-sdc-distribute-row omf-component-row w-sdc-distribute-row-extends"
- data-ng-class="{'extends': omfComponentListExtends}">
- <div class="w-sdc-distribution-arrow-btn" data-ng-click="omfComponentListExtends=!omfComponentListExtends"
- ng-class="{'extends': omfComponentListExtends}"
- data-ng-init="omfComponentListExtends=false"
- ></div>
- <div class="w-sdc-distribute-status-block">
- <div class="status-item-1">{{omfComponentID}} <span class="blue-font">{{(statusCount.NOT_NOTIFIED || 0) + (statusCount.NOTIFIED || 0) }}</span>
- </div>
- <div class="status-item-2">Notified:<span data-ng-bind="statusCount.NOTIFIED || 0"
- class="blue-font"></span></div>
- <div class="status-item-3">Downloaded:<span
- data-ng-bind="statusCount.DOWNLOAD_OK || 0" class="blue-font"></span></div>
- <div class="status-item-4">Deployed:<span data-ng-bind="statusCount.DEPLOY_OK || 0"
- class="blue-font"></span><span
- data-ng-class="{'deployed':(statusCount.DEPLOY_OK > 0)}"></span></div>
- <div class="status-item-5">Not Notified:<span
- data-ng-bind="statusCount.NOT_NOTIFIED || 0" class="blue-font"></span></div>
- <div class="status-item-6">Deploy Errors:<span
- data-ng-bind="statusCount.DEPLOY_ERROR || 0" class="red-font"></span><span
- data-ng-class="{'error':(statusCount.DEPLOY_ERROR > 0)}"></span></div>
- <div class="status-item-7">Download Errors:<span
- data-ng-bind="statusCount.DOWNLOAD_ERROR || 0" class="red-font"></span><span
- data-ng-class="{'error':(statusCount.DOWNLOAD_ERROR > 0)}"></span></div>
- </div>
- </div>
- <div data-ng-if="omfComponentListExtends"
- class="w-sdc-distribute-omfComponent-block disable-hover">
- <div class="w-sdc-distribute-row-extends disable-hover">
- <div class="disable-hover">
- <div class="w-sdc-distribute-row omfComponent-table-head">
- <div class="title item-1">Component ID</div>
- <div class="title item-2">Artifact Name</div>
- <div class="title item-3">URL</div>
- <div class="title item-4">Time(UTC)</div>
- <div class="title item-5">Status</div>
- </div>
-
- <div class="w-sdc-distribute-row omfComponent-table-row"
- data-ng-repeat-start="(url,urlList) in ::omfComponentList | orderBy: '-timestamp' | groupBy:'url'"
- data-ng-class="urlListExtends?'extends row-{{$index}}':'row-{{$index}}'">
- <div class="w-sdc-distribute-cell item-1" sdc-smart-tooltip>
- <div class="w-sdc-distribution-arrow-btn" data-ng-click="urlListExtends=!urlListExtends"
- data-ng-class="{'extends': urlListExtends}"
- data-ng-init="urlListListExtends=false;urlList[0].displayUrl=getUrlName(urlList[0].url)"
- ></div>
- {{urlList[0].omfComponentID}}
- </div>
- <div class="w-sdc-distribute-cell item-2" sdc-smart-tooltip>
- {{urlList[0].displayUrl}}
- </div>
- <div class="w-sdc-distribute-cell item-3 disable-hover">
- <div sdc-smart-tooltip class="distribution-url">{{urlList[0].url}}</div>
- <div sdc-smart-tooltip title="Copy url" clipboard text="urlList[0].url"
- class="sprite-new link-btn copy-link disable-hover"></div>
- </div>
- <div class="w-sdc-distribute-cell item-4"><span
- data-ng-bind="urlList[0].timestamp | date: 'MM/dd/yyyy h:mma':'UTC'"></span>
- </div>
- <div class="w-sdc-distribute-cell item-5" sdc-smart-tooltip>
- {{urlList[0].status}}
- </div>
- </div>
-
-
- <div data-ng-repeat-end data-ng-if="urlListExtends" class="disable-hover" >
- <div class="w-sdc-distribute-row extends disable-hover">
- <ul data-ng-if="urlListExtends"
- class="w-sdc-distribute-url-block disable-hover">
- <li data-ng-repeat="distributionComponent in ::urlList | orderBy: '-timestamp'"
- class="disable-hover">
- <span
- data-ng-bind="distributionComponent.timestamp | date: 'MM/dd/yyyy h:mma':'UTC'"
- class="disable-hover"></span>
- <span
- class="disable-hover">{{distributionComponent.status}}</span>
- <span
- class="disable-hover reason" data-ng-if="distributionComponent.status == 'NOT_NOTIFIED'">Reason: Component has determined artifact is not needed.</span>
- <span
- class="disable-hover reason" data-ng-if="distributionComponent.errorReason">Reason: {{distributionComponent.errorReason}}</span>
- </li>
- </ul>
- </div>
- </div>
- </div>
- </div>
- </div>
- </li>
- </ul>
- </li>
- </ul>
- </div>
-
- </perfect-scrollbar>
-</div>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution.less b/catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution.less
deleted file mode 100644
index ee1f7ed2d6..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution.less
+++ /dev/null
@@ -1,362 +0,0 @@
-
-.w-sdc-distribution-view {
- text-align: left;
-
- .g_1;
- min-height: 500px;
-
- .w-sdc-distribution-view-distributed-green-text {
- .l_9;
- .bold;
- }
- .w-sdc-distribution-view-distributed-error-red-text {
- .h_9;
- .bold;
- }
-
- .bg_c;
- vertical-align: top;
- padding: 30px 10px;
- width: 100%;
-
- .w-sdc-distribution-view-header {
- display: flex;
- -webkit-justify-content: space-between;
- margin: 0 25px 5px 40px;
-
- .header-spacer {
- flex-grow: 5;
- }
- }
-
- .top-search {
- position: relative;
- input {
- &.search-text {
- height: 26px;
- line-height: 26px;
- margin: 0 18px 4px 20px;
- padding-right: 25px;
- }
-
- }
- .magnification {
- top: 8px;
- right: 25px;
- }
- }
-
- .w-sdc-distribution-view-content {
- .perfect-scrollbar;
- padding: 0 25px 0 0px;
- margin-bottom: 25px;
- height: 700px;
- overflow: hidden;
- position: relative;
-
- }
-
- .w-sdc-distribution-view-title {
- .s_14_r;
-
- line-height: 30px;
-
- span {
- padding-left: 5px;
- }
- }
-
- .blue-font {
- .a_14_m;
-
- }
-
- .red-font {
- .q_14_m;
- }
-
- .w-sdc-distribution-view-block {
- div {
- display: inline-block;
- }
- }
-
- .w-sdc-distribution-view-content-section {
- ul {
- list-style-type: none;
- }
-
- .distribution-bth {
- .hand;
- &.disabled {
- cursor: none;
- }
- }
-
- .copy-link {
- padding-right: 19px;
- margin-left: 8px;
- cursor: pointer;
-
- }
-
- .w-sdc-distribute-row-extends {
- border-Left: solid 4px transparent;
- &.extends {
- border-left: solid 4px @main_color_c;
- border-bottom: 1px solid @border_color_f;
- margin-bottom: 10px;
- }
- }
- .w-sdc-distribute-parent-block {
- border: 1px solid @main_color_o;;
- width: 100%;
- margin-bottom: 6px;
-
- .status-icon {
- vertical-align: middle;
- margin-bottom: 4px;
- }
-
- &.extends {
- background-color: @tlv_color_t;
- }
-
- :not(.disable-hover):hover {
- background-color: @tlv_color_u;
- }
-
- .title-section {
- display: inline-block;
- margin-right: 10px;
- flex-basis: 0;
- }
-
- .title {
- .l_12_m;
- font-weight: bold;
- }
- .w-sdc-distribute-content {
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-left: 10px;
- }
-
- .w-sdc-distribution-arrow-btn {
- .sprite-new;
- .arrow-up-small;
- margin: 0 6px;
- display: inline-table;
- }
- .extends.w-sdc-distribution-arrow-btn {
- -webkit-transform: rotate(180deg);
- -ms-transform: rotate(180deg);
- transform: rotate(180deg);
- }
-
- .w-sdc-distribute-row {
- display: flex;
- align-items: center;
- justify-content: space-between;
-
- .w-sdc-distribute-row-content {
- margin: 15px 31px 10px 0;
- width: 100%;
- .w-sdc-distribute-status-block {
- border-top: solid 1px @main_color_o;
- }
- .item-1 {
- flex-grow: 2;
- }
- .item-2 {
- flex-grow: 1;
- }
- .item-3 {
- flex-grow: 1;
- }
- .item-4 {
- flex-grow: 1;
- }
- .item-5 {
- flex-grow: 1;
- }
- }
- }
-
- .w-sdc-distribute-status-block {
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin: 10px 5px 0 5px;
- padding: 5px 5px 0 5px;;
- width: 100%;
- div {
- border-left: 1px solid @main_color_o;
- padding: 0 12px;
- }
-
- .link {
- .a_14_m;
- cursor: pointer;
- &:hover{
- text-decoration: underline;
- .b_14_m;
- }
- }
-
- span {
- padding: 2px;
- }
-
- .deployed {
- margin-left: 10px;
- .sprite-new;
- .success-circle-small;
- }
-
- .error {
- .q_14_m;
- margin-left: 10px;
- .sprite-new;
- .error-icon;
- }
-
- .status-item-1 {
- border-left: 0;
- }
-
- .status-item-6 {
- flex-grow: 1;
- border-left: none;
- text-align: right;
- }
- }
-
- .w-sdc-distribute-components-block {
- padding: 0;
- padding-bottom: 5px;
- list-style-type: none;
-
- li {
- margin: 5px 2px;
- }
-
- .omf-component-row {
- border: 1px solid @border_color_f;
- padding-left: 3px;
- background-color: white;
- margin: 0 30px;
- &.extends {
- padding-left: 0;
- border-Left: solid 4px @main_color_c;
-
- }
-
- .w-sdc-distribute-status-block {
- margin: 5px;
- padding: 5px;
- }
-
- .blue-font {
- .a_16_m;
-
- }
-
- &:hover {
- background-color: @tlv_color_u;
- }
-
- }
-
- }
-
- .w-sdc-distribute-omfComponent-block {
- background-color: white;
- margin: 0 30px;
- padding: 8px 10px;
- border: 1px solid @border_color_f;
-
- .omfComponent-table-head {
- margin-bottom: 5px;
- background-color: @tlv_color_u;
- .title {
- padding: 6px 10px;
- border-left: 1px solid @border_color_f;
- &:first-child {
- border: none;
- }
- }
- }
-
- .omfComponent-table-row {
- border-bottom: 1px solid @border_color_f;
- &.row-0 {
- border-top: 1px solid @border_color_f;
- }
- .w-sdc-distribute-cell {
- padding: 10px;
- border-left: 1px solid @border_color_f;
- &:last-child {
- border-right: 1px solid @border_color_f;
- }
- &.item-5 {
- .m_14_m;
- }
- }
- }
-
- .distribution-url {
-
- }
-
- .w-sdc-distribute-row.extends {
- border-Left: solid 4px @main_color_c;
- .item-1 {
- border: none;
- }
-
- }
-
- .item-1 {
- width: 20%;
- }
- .item-2 {
- width: 20%;
- }
-
- .item-3 {
- width: 24%;
- display: flex;
- }
-
- .item-4 {
- width: 18%;
- }
-
- .item-5 {
- width: 18%;
- }
- }
-
- .w-sdc-distribute-url-block {
-
- padding: 10px 15px;
- border: none;
- border-right: 1px solid @border_color_f;
- border-bottom: 1px solid @border_color_f;
- width: 100%;
- li {
- border: none;
- span {
- padding-right: 30px;
- .m_12_r;
- }
- }
-
- }
- }
-
- }
-}
-
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 b4529700cf..e2709281b7 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
@@ -7,9 +7,9 @@
* 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.
@@ -22,11 +22,13 @@
import * as _ from "lodash";
import {ModalsHandler, ValidationUtils, EVENTS, CHANGE_COMPONENT_CSAR_VERSION_FLAG, ComponentType, DEFAULT_ICON,
ResourceType, ComponentState, instantiationType, ComponentFactory} from "app/utils";
-import {CacheService, EventListenerService, ProgressService, OnboardingService} from "app/services";
+import { EventListenerService, ProgressService} from "app/services";
+import {CacheService, OnboardingService, ImportVSPService} from "app/services-ng2";
import {IAppConfigurtaion, IValidate, IMainCategory, Resource, ISubCategory,Service, ICsarComponent, Component} from "app/models";
import {IWorkspaceViewModelScope} from "app/view-models/workspace/workspace-view-model";
import {Dictionary} from "lodash";
import { PREVIOUS_CSAR_COMPONENT } from "../../../../utils/constants";
+import { Observable, Subject } from "rxjs";
export class Validation {
@@ -37,7 +39,6 @@ export class Validation {
VendorNameValidationPattern:RegExp;
VendorModelNumberValidationPattern:RegExp;
commentValidationPattern:RegExp;
- projectCodeValidationPattern:RegExp;
}
export class componentCategories {//categories field bind to this obj in order to solve this bug: DE242059
@@ -61,7 +62,7 @@ export interface IGeneralScope extends IWorkspaceViewModelScope {
isShowFileBrowse:boolean;
isShowOnboardingSelectionBrowse:boolean;
importedToscaBrowseFileText:string;
- importCsarProgressKey:string;
+ importCsarProProgressKey:string;
browseFileLabel:string;
componentCategories:componentCategories;
instantiationTypes:Array<instantiationType>;
@@ -86,6 +87,7 @@ export interface IGeneralScope extends IWorkspaceViewModelScope {
possibleToUpdateIcon():boolean;
}
+// tslint:disable-next-line:max-classes-per-file
export class GeneralViewModel {
static '$inject' = [
@@ -100,7 +102,6 @@ export class GeneralViewModel {
'CommentValidationPattern',
'ValidationUtils',
'sdcConfig',
- 'ProjectCodeValidationPattern',
'$state',
'ModalsHandler',
'EventListenerService',
@@ -109,8 +110,10 @@ export class GeneralViewModel {
'$interval',
'$filter',
'$timeout',
- 'Sdc.Services.OnboardingService',
- 'ComponentFactory'
+ 'OnboardingService',
+ 'ComponentFactory',
+ 'ImportVSPService',
+ '$stateParams'
];
constructor(private $scope:IGeneralScope,
@@ -124,7 +127,6 @@ export class GeneralViewModel {
private CommentValidationPattern:RegExp,
private ValidationUtils:ValidationUtils,
private sdcConfig:IAppConfigurtaion,
- private ProjectCodeValidationPattern:RegExp,
private $state:ng.ui.IStateService,
private ModalsHandler:ModalsHandler,
private EventListenerService:EventListenerService,
@@ -133,8 +135,10 @@ export class GeneralViewModel {
protected $interval:any,
private $filter:ng.IFilterService,
private $timeout:ng.ITimeoutService,
- private onBoardingService:OnboardingService,
- private ComponentFactory:ComponentFactory) {
+ private onBoardingService: OnboardingService,
+ private ComponentFactory:ComponentFactory,
+ private importVSPService: ImportVSPService,
+ private $stateParams: any) {
this.initScopeValidation();
this.initScopeMethods();
@@ -153,13 +157,11 @@ export class GeneralViewModel {
this.$scope.validation.VendorNameValidationPattern = this.VendorNameValidationPattern;
this.$scope.validation.VendorModelNumberValidationPattern = this.VendorModelNumberValidationPattern;
this.$scope.validation.commentValidationPattern = this.CommentValidationPattern;
- this.$scope.validation.projectCodeValidationPattern = this.ProjectCodeValidationPattern;
};
- private loadOnboardingFileCache = ():ng.IPromise<Dictionary<any>> =>{
-
+ private loadOnboardingFileCache = (): Observable<Dictionary<Dictionary<string>>> => {
let onboardCsarFilesMap:Dictionary<Dictionary<string>>;
- let onSuccess = (vsps:Array<ICsarComponent>) =>{
+ let onSuccess = (vsps:Array<ICsarComponent>) => {
onboardCsarFilesMap = {};
_.each(vsps, (vsp:ICsarComponent)=>{
onboardCsarFilesMap[vsp.packageId] = onboardCsarFilesMap[vsp.packageId] || {};
@@ -170,8 +172,8 @@ export class GeneralViewModel {
};
let onError = (): void =>{
console.log("Error getting onboarding list");
- };
- return this.onBoardingService.getOnboardingVSPs().then(onSuccess, onError);
+ };
+ return this.onBoardingService.getOnboardingVSPs().map(onSuccess, onError);
};
private setImportedFileText = ():void => {
@@ -179,7 +181,7 @@ export class GeneralViewModel {
if(!this.$scope.isShowOnboardingSelectionBrowse) return;
//these variables makes it easier to read this logic
- let csarUUID:string = (<Resource>this.$scope.component).csarUUID;
+ let csarUUID:string = (<Resource>this.$scope.component).csarUUID;
let csarVersion:string = (<Resource>this.$scope.component).csarVersion;
let onboardCsarFilesMap:Dictionary<Dictionary<string>> = this.cacheService.get('onboardCsarFilesMap');
@@ -187,21 +189,25 @@ export class GeneralViewModel {
if(this.$scope.component.vspArchived){
this.$scope.importedToscaBrowseFileText = 'VSP is archived';
} else {
- this.$scope.importedToscaBrowseFileText = onboardCsarFilesMap[csarUUID][csarVersion];
+ if(this.$stateParams.componentCsar && this.$scope.component.lifecycleState === 'NOT_CERTIFIED_CHECKIN' && !this.$scope.isCreateMode()) {
+ this.$scope.importedToscaBrowseFileText = this.$scope.originComponent.name + ' (' + (this.$scope.originComponent as Resource).csarVersion + ')';
+ } else {
+ this.$scope.importedToscaBrowseFileText = onboardCsarFilesMap[csarUUID][csarVersion];
+ }
}
}
-
+
if(this.$scope.component.vspArchived || (onboardCsarFilesMap && onboardCsarFilesMap[csarUUID] && onboardCsarFilesMap[csarUUID][csarVersion])){ //check that the file name is already in cache
assignFileName();
} else {
- this.loadOnboardingFileCache().then((onboardingFiles) => {
+ this.loadOnboardingFileCache().subscribe((onboardingFiles) => {
onboardCsarFilesMap = onboardingFiles;
this.cacheService.set('onboardCsarFilesMap', onboardingFiles);
assignFileName();
}, ()=> {});
}
-
+
}
isCreateModeAvailable(verifyObj:string): boolean {
@@ -211,10 +217,9 @@ export class GeneralViewModel {
private initScope = ():void => {
-
this.$scope.importCsarProgressKey = "importCsarProgressKey";
- this.$scope.browseFileLabel = this.$scope.component.isResource() && (<Resource>this.$scope.component).resourceType === ResourceType.VF ? "Upload file" : "Upload VFC";
+ this.$scope.browseFileLabel = this.$scope.component.isResource() && (<Resource>this.$scope.component).resourceType === ResourceType.VF ? 'VSP' : 'Upload VFC';
this.$scope.progressService = this.progressService;
this.$scope.componentCategories = new componentCategories();
this.$scope.componentCategories.selectedCategory = this.$scope.component.selectedCategory;
@@ -236,7 +241,7 @@ export class GeneralViewModel {
if (resource.importedFile) { // Component has imported file.
this.$scope.isShowFileBrowse = true;
}
- if (this.$scope.isEditMode() && resource.resourceType == ResourceType.VF && !resource.csarUUID) {
+ if (resource.resourceType === ResourceType.VF && !resource.csarUUID) {
this.$scope.isShowFileBrowse = true;
}
} else if(this.$scope.component.isService()){
@@ -244,30 +249,35 @@ export class GeneralViewModel {
this.$scope.initInstantiationTypes();
}
- // Work around to change the csar version
- if (this.cacheService.get(CHANGE_COMPONENT_CSAR_VERSION_FLAG)) {
- //(<Resource>this.$scope.component).csarVersion = this.cacheService.get(CHANGE_COMPONENT_CSAR_VERSION_FLAG);
- this.cacheService.remove(CHANGE_COMPONENT_CSAR_VERSION_FLAG);
- this.$scope.updateUnsavedFileFlag(true);
+ if (this.cacheService.get(PREVIOUS_CSAR_COMPONENT)) { //keep the old component in the cache until checkout, so we dont need to pass it around
+ this.$scope.setOriginComponent(this.cacheService.get(PREVIOUS_CSAR_COMPONENT));
+ this.cacheService.remove(PREVIOUS_CSAR_COMPONENT);
+ }
- if (!this.$scope.isViewMode() && this.cacheService.get(PREVIOUS_CSAR_COMPONENT)) { //keep the old component in the cache until checkout, so we dont need to pass it around
- this.$scope.setOriginComponent(this.cacheService.get(PREVIOUS_CSAR_COMPONENT));
- this.cacheService.remove(PREVIOUS_CSAR_COMPONENT);
+ if (this.$stateParams.componentCsar && !this.$scope.isCreateMode()) {
+ this.$scope.updateUnsavedFileFlag(true);
+ // We are coming from update VSP modal we need to automatically checkout (if needed) and save the VF
+ if (this.$scope.component.lifecycleState !== ComponentState.NOT_CERTIFIED_CHECKOUT) {
+ // Checkout is needed after that a save will be invoked in workspace-view.handleLifeCycleStateChange
+ this.EventListenerService.notifyObservers(EVENTS.ON_LIFECYCLE_CHANGE_WITH_SAVE, 'checkOut');
+ // if(this.$scope.component.lifecycleState !== 'NOT_CERTIFIED_CHECKIN') {
+ // (<Resource>this.$scope.component).csarVersion = this.$stateParams.componentCsar.csarVersion;
+ // }
+ } else {
+ this.$scope.save();
}
}
- // Init the decision if to show onboarding
- if (this.$scope.component.isResource() && this.$scope.isEditMode() &&
- ((<Resource>this.$scope.component).resourceType == ResourceType.VF ||
- (<Resource>this.$scope.component).resourceType == ResourceType.PNF)
- && (<Resource>this.$scope.component).csarUUID) {
+ if (this.$scope.component.isResource() &&
+ (this.$scope.component as Resource).resourceType === ResourceType.VF ||
+ (this.$scope.component as Resource).resourceType === ResourceType.PNF && (this.$scope.component as Resource).csarUUID) {
this.$scope.isShowOnboardingSelectionBrowse = true;
this.setImportedFileText();
} else {
this.$scope.isShowOnboardingSelectionBrowse = false;
}
-
+
//init file extensions based on the file that was imported.
if (this.$scope.component.isResource() && (<Resource>this.$scope.component).importedFile) {
@@ -304,7 +314,7 @@ export class GeneralViewModel {
this.$scope.originComponent.contactId = this.$scope.component.contactId;
}
-
+
this.$scope.$on('$destroy', () => {
this.EventListenerService.unRegisterObserver(EVENTS.ON_LIFECYCLE_CHANGE_WITH_SAVE);
this.EventListenerService.unRegisterObserver(EVENTS.ON_LIFECYCLE_CHANGE);
@@ -313,7 +323,7 @@ export class GeneralViewModel {
};
// Convert category string MainCategory_#_SubCategory to Array with one item (like the server except)
- private convertCategoryStringToOneArray = ():Array<IMainCategory> => {
+ private convertCategoryStringToOneArray = ():IMainCategory[] => {
let tmp = this.$scope.component.selectedCategory.split("_#_");
let mainCategory = tmp[0];
let subCategory = tmp[1];
@@ -333,14 +343,14 @@ export class GeneralViewModel {
}
let tmpSelected = <IMainCategory> mainCategoryClone;
- let result:Array<IMainCategory> = [];
+ let result:IMainCategory[] = [];
result.push(tmpSelected);
return result;
};
private updateComponentNameInBreadcrumbs = ():void => {
- //update breadcrum after changing name
+ // update breadcrum after changing name
this.$scope.breadcrumbsModel[1].updateSelectedMenuItemText(this.$scope.component.getComponentSubType() + ': ' + this.$scope.component.name);
this.$scope.updateMenuComponentName(this.$scope.component.name);
};
@@ -436,24 +446,20 @@ export class GeneralViewModel {
if(this.$scope.component.vspArchived) return;
let csarUUID = (<Resource>this.$scope.component).csarUUID;
let csarVersion = (<Resource>this.$scope.component).csarVersion;
- this.ModalsHandler.openOnboadrdingModal('Update', csarUUID, csarVersion).then((result)=> {
-
- if(result){
- this.ComponentFactory.getComponentWithMetadataFromServer(result.type.toUpperCase(), result.previousComponent.uniqueId).then(
- (component:Component)=> {
- if (result.componentCsar && component.isResource()){
- this.cacheService.set(PREVIOUS_CSAR_COMPONENT, angular.copy(component));
- component = this.ComponentFactory.updateComponentFromCsar(result.componentCsar, <Resource>component);
- }
-
- this.$scope.setComponent(component);
- this.$scope.updateUnsavedFileFlag(true);
- this.setImportedFileText();
- }, ()=> {
- // ERROR
- });
- }
- }, () => {});
+ this.importVSPService.openOnboardingModal(csarUUID, csarVersion).subscribe((result) => {
+ this.ComponentFactory.getComponentWithMetadataFromServer(result.type.toUpperCase(), result.previousComponent.uniqueId).then(
+ (component:Component)=> {
+ if (result.componentCsar && component.isResource()){
+ this.cacheService.set(PREVIOUS_CSAR_COMPONENT, angular.copy(component));
+ component = this.ComponentFactory.updateComponentFromCsar(result.componentCsar, <Resource>component);
+ }
+ this.$scope.setComponent(component);
+ this.$scope.save();
+ this.setImportedFileText();
+ }, ()=> {
+ // ERROR
+ });
+ })
};
this.$scope.updateIcon = ():void => {
@@ -491,17 +497,17 @@ export class GeneralViewModel {
return;
}
- let subtype:string = ComponentType.RESOURCE == this.$scope.componentType ? this.$scope.component.getComponentSubType() : undefined;
+ const subtype:string = ComponentType.RESOURCE == this.$scope.componentType ? this.$scope.component.getComponentSubType() : undefined;
- let onFailed = (response) => {
- //console.info('onFaild', response);
- //this.$scope.isLoading = false;
+ const onFailed = (response) => {
+ // console.info('onFaild', response);
+ // this.$scope.isLoading = false;
};
- let onSuccess = (validation:IValidate) => {
- this.$scope.editForm["componentName"].$setValidity('nameExist', validation.isValid);
+ const onSuccess = (validation:IValidate) => {
+ this.$scope.editForm['componentName'].$setValidity('nameExist', validation.isValid);
if (validation.isValid) {
- //update breadcrumb after changing name
+ // update breadcrumb after changing name
this.updateComponentNameInBreadcrumbs();
}
};
@@ -522,48 +528,57 @@ export class GeneralViewModel {
&& !this.$scope.editForm["componentName"].$error.pattern
&& (!this.$scope.originComponent.name || this.$scope.component.name.toUpperCase() !== this.$scope.originComponent.name.toUpperCase())
) {
- if (!(this.$scope.componentType === ComponentType.RESOURCE && (<Resource>this.$scope.component).csarUUID !== undefined)
+ if (!(this.$scope.componentType === ComponentType.RESOURCE && (this.$scope.component as Resource).csarUUID !== undefined)
) {
this.$scope.component.validateName(name, subtype).then(onSuccess, onFailed);
}
- } else if (this.$scope.originComponent.name && this.$scope.component.name.toUpperCase() === this.$scope.originComponent.name.toUpperCase()) {
+ } else if (this.$scope.editForm && this.$scope.originComponent.name && this.$scope.component.name.toUpperCase() === this.$scope.originComponent.name.toUpperCase()) {
// Clear the error
- this.$scope.editForm["componentName"].$setValidity('nameExist', true);
+ this.$scope.editForm['componentName'].$setValidity('nameExist', true);
}
}
};
this.EventListenerService.registerObserverCallback(EVENTS.ON_LIFECYCLE_CHANGE_WITH_SAVE, (nextState) => {
- if (this.$state.current.data.unsavedChanges && this.$scope.isValidForm){
+ if (this.$state.current.data.unsavedChanges && this.$scope.isValidForm) {
this.$scope.save().then(() => {
this.$scope.handleChangeLifecycleState(nextState);
}, () => {
- console.error("Save failed, unable to change lifecycle state to " + nextState);
+ console.error('Save failed, unable to change lifecycle state to ' + nextState);
});
} else if(!this.$scope.isValidForm){
- console.error("Form is not valid");
+ console.error('Form is not valid');
} else {
let newCsarVersion:string;
- if(this.$scope.unsavedFile){
- newCsarVersion = (<Resource>this.$scope.component).csarVersion;
+ if(this.$scope.unsavedFile) {
+ newCsarVersion = (this.$scope.component as Resource).csarVersion;
+ }
+ if(this.$stateParams.componentCsar && !this.$scope.isCreateMode()) {
+ const onError = (): void => {
+ if (this.$scope.component.lifecycleState === 'NOT_CERTIFIED_CHECKIN') {
+ this.$scope.revert();
+ }
+ };
+ this.$scope.handleChangeLifecycleState(nextState, newCsarVersion, onError);
+
+ } else {
+ this.$scope.handleChangeLifecycleState(nextState, newCsarVersion);
}
- this.$scope.handleChangeLifecycleState(nextState, newCsarVersion);
}
});
-
this.$scope.revert = ():void => {
- //in state of import file leave the file in place
+ // in state of import file leave the file in place
this.$scope.setComponent(this.ComponentFactory.createComponent(this.$scope.originComponent));
if (this.$scope.component.isResource() && this.$scope.restoreFile) {
- (<Resource>this.$scope.component).importedFile = angular.copy(this.$scope.restoreFile);
- }
-
- this.setImportedFileText();
- this.$scope.updateBreadcrumbs(this.$scope.component); //update on workspace
+ (this.$scope.component as Resource).importedFile = angular.copy(this.$scope.restoreFile);
+ }
+
+ this.setImportedFileText();
+ this.$scope.updateBreadcrumbs(this.$scope.component); // update on workspace
this.$scope.componentCategories.selectedCategory = this.$scope.originComponent.selectedCategory;
this.setUnsavedChanges(false);
@@ -573,8 +588,8 @@ export class GeneralViewModel {
this.$scope.onImportFileChange = () => {
- if( !this.$scope.restoreFile && this.$scope.editForm.fileElement.value && this.$scope.editForm.fileElement.value.filename || //if file started empty but we have added a new one
- this.$scope.restoreFile && !angular.equals(this.$scope.restoreFile, this.$scope.editForm.fileElement.value)){ //or file was swapped for a new one
+ if( !this.$scope.restoreFile && this.$scope.editForm.fileElement.value && this.$scope.editForm.fileElement.value.filename || // if file started empty but we have added a new one
+ this.$scope.restoreFile && !angular.equals(this.$scope.restoreFile, this.$scope.editForm.fileElement.value)){ // or file was swapped for a new one
this.$scope.updateUnsavedFileFlag(true);
} else {
this.$scope.updateUnsavedFileFlag(false);
@@ -582,46 +597,46 @@ export class GeneralViewModel {
}
};
- this.$scope.$watchCollection('component.name', (newData:any):void => {
+ this.$scope.$watchCollection('component.name', (newData: any): void => {
this.$scope.validateName(false);
});
// Notify the parent if this step valid or not.
- this.$scope.$watch("editForm.$valid", (newVal, oldVal) => {
+ this.$scope.$watch('editForm.$valid', (newVal, oldVal) => {
this.$scope.setValidState(newVal);
});
- this.$scope.$watch("editForm.$dirty", (newVal, oldVal) => {
+ this.$scope.$watch('editForm.$dirty', (newVal, oldVal) => {
if (newVal && !this.$scope.isCreateMode()) {
this.setUnsavedChanges(true);
}
});
- this.$scope.onCategoryChange = ():void => {
+ this.$scope.onCategoryChange = (): void => {
this.$scope.component.selectedCategory = this.$scope.componentCategories.selectedCategory;
this.$scope.component.categories = this.convertCategoryStringToOneArray();
this.$scope.component.icon = DEFAULT_ICON;
};
- this.$scope.onEcompGeneratedNamingChange = ():void =>{
- if(!(<Service>this.$scope.component).ecompGeneratedNaming){
- (<Service>this.$scope.component).namingPolicy = '';
+ this.$scope.onEcompGeneratedNamingChange = (): void => {
+ if (!(this.$scope.component as Service).ecompGeneratedNaming) {
+ (this.$scope.component as Service).namingPolicy = '';
}
};
- this.$scope.onVendorNameChange = (oldVendorName:string):void => {
+ this.$scope.onVendorNameChange = (oldVendorName: string): void => {
if (this.$scope.component.icon === oldVendorName) {
this.$scope.component.icon = DEFAULT_ICON;
}
};
this.EventListenerService.registerObserverCallback(EVENTS.ON_LIFECYCLE_CHANGE, this.$scope.reload);
- };
+ }
- private setUnsavedChanges = (hasChanges:boolean):void => {
+ private setUnsavedChanges = (hasChanges: boolean): void => {
this.$state.current.data.unsavedChanges = hasChanges;
- };
+ }
}
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 07f1e4d6ed..86f1feba0c 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
@@ -13,13 +13,12 @@
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
-
<div include-padding="true" class="sdc-workspace-general-step">
<div class="w-sdc-main-container-body-content-action-buttons">
- <div data-ng-if="unsavedFile && !isCreateMode() && !isViewMode()" class="unsaved-file-warning">
+ <div data-ng-if="unsavedFile && !isCreateMode() && !isViewMode()" data-tests-id="save-warning" class="unsaved-file-warning">
<span class="sprite-new sdc-warning"></span> Click save to update to the new VSP
</div>
- <button class="tlv-btn blue" data-ng-if="isDesigner()" data-ng-show="isGeneralView()" data-ng-class="{'disabled' : !isValidForm || isDisableMode() || isViewMode() || isCreateMode()}"
+ <button class="tlv-btn blue" data-ng-if="isDesigner()" data-ng-show="isGeneralView()" data-ng-class="{'disabled' : !isValidForm || isDisableMode() || isViewMode() || isCreateMode()}"
data-ng-click="save()" data-tests-id="create/save" tooltips tooltip-content="Save">Save</button>
<span data-ng-if="isDesigner()" data-ng-class="{'disabled' :isDisableMode() || isViewMode() || isCreateMode()}" ng-click="revert()" class="sprite-new revert-btn" data-tests-id="revert"
data-ng-show="isGeneralView()" tooltips tooltip-content="Revert"></span>
@@ -160,7 +159,7 @@
<div class="w-sdc-form-column">
<!--------------------- IMPORT TOSCA FILE USING BROWSE (ALSO VFC) -------------------->
<div class="i-sdc-form-item" ng-if="isShowFileBrowse">
-
+
<!-- // element-disabled="{{!isCreateMode()&&!(isEditMode()&&component.resourceType=='VF')&&component.vspArchived}} || {{isViewMode()}}" -->
<label class="i-sdc-form-label" data-ng-class="{'required':isCreateMode()}">{{browseFileLabel}}</label>
@@ -173,17 +172,17 @@
on-file-changed-in-directive="onImportFileChange"
extensions="{{importedFileExtension}}"
default-text="'Browse to select file'"
- data-ng-class="{'error':!(isEditMode()&&component.resourceType=='VF') && (!editForm.fileElement.$valid || !component.importedFile.filename)}"></file-upload>
+ ></file-upload>
</div>
<!--------------------- IMPORT TOSCA FILE USING ONBOARDING -------------------->
<div class="i-sdc-form-item" ng-if="isShowOnboardingSelectionBrowse">
- <label class="i-sdc-form-label required">Select VSP</label>
+ <label class="i-sdc-form-label required">VSP</label>
<div class="i-sdc-form-file-upload i-sdc-form-input">
<span class="i-sdc-form-file-name" data-ng-disabled="component.vspArchived" data-tests-id="filename">{{(fileModel && fileModel.filename) || importedToscaBrowseFileText }}</span>
<div class="i-sdc-form-file-upload-x-btn" ng-click="cancel()" data-ng-show="fileModel.filename && fileModel.filename!=='' && elementDisabled!=='true'"></div>
- <input type="button" data-ng-disabled="component.vspArchived" name="fileElement" />
- <div class="file-upload-browse-btn" data-ng-click="openOnBoardingModal()" data-ng-disabled="!component.vspArchived" data-tests-id="browseButton">Browse</div>
+ <input type="button" data-ng-class="{'disabled': !isEditMode() && component.vspArchived}" data-ng-disabled="component.vspArchived" name="fileElement" />
+ <div class="file-upload-browse-btn" data-ng-class="{'disabled': !isEditMode() && !component.vspArchived}" data-ng-click="openOnBoardingModal()" data-ng-disabled="!component.vspArchived" data-tests-id="browseButton">Browse</div>
</div>
</div>
@@ -218,28 +217,6 @@
</div>
<!--------------------- USER ID -------------------->
- <!--------------------- PROJECT CODE -------------------->
- <div class="i-sdc-form-item" data-ng-if="!component.isResource()"
- data-ng-class="{'error': validateField(editForm.projectCode)}">
- <label class="i-sdc-form-label required" translate="GENERAL_LABEL_PROJECT_CODE"></label>
- <input class="i-sdc-form-input" type="text"
- data-ng-model="component.projectCode"
- data-ng-class="{'view-mode': isViewMode()}"
- data-ng-model-options="{ debounce: 500 }"
- data-ng-maxlength="50"
- data-required
- name="projectCode"
- data-ng-pattern="validation.projectCodeValidationPattern"
- data-tests-id="projectCode"
- />
-
- <div class="input-error" data-ng-show="validateField(editForm.projectCode)">
- <span ng-show="editForm.contactId.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '50' }"></span>
- <span ng-show="editForm.projectCode.$error.required" translate="NEW_SERVICE_RESOURCE_ERROR_PROJECT_CODE_REQUIRED"></span>
- <span ng-show="editForm.projectCode.$error.pattern" translate="NEW_SERVICE_RESOURCE_ERROR_PROJECT_CODE_NOT_VALID"></span>
- </div>
- </div>
-
<!--------------------- VENDOR NAME -------------------->
<div ng-if="component.isResource()" class="i-sdc-form-item" data-ng-class="{'error': validateField(editForm.vendorName)}">
<label class="i-sdc-form-label required">Vendor</label>
@@ -401,6 +378,27 @@
</div>
<!--------------------- Service Role -------------------->
+ <!--------------------- Service Function -------------------->
+ <div ng-if="component.isService()"
+ class="i-sdc-form-item"
+ data-ng-class="{'error': validateField(editForm.serviceFunction)}">
+ <label class="i-sdc-form-label" translate="GENERAL_TAB_LABEL_SERVICE_FUNCTION"></label>
+ <input class="i-sdc-form-input" type="text"
+ data-ng-class="{'view-mode': isViewMode()}"
+ data-ng-model="component.serviceFunction"
+ data-ng-model-options="{ debounce: 500 }"
+ name="serviceFunction"
+ data-tests-id="serviceFunction"
+ data-ng-maxlength="256"
+ data-ng-pattern="validation.ServiceTypeAndRoleValidationPattern"
+ />
+ <div class="input-error" data-ng-show="validateField(editForm.serviceFunction)">
+ <span ng-show="editForm.serviceFunction.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '256' }"></span>
+ <span ng-show="editForm.serviceFunction.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span>
+ </div>
+ </div>
+ <!--------------------- Service Function -------------------->
+
<!-------------------- ENVIRONMENT CONTEXT ----------------->
<div ng-if="component.isService()" class="i-sdc-form-item">
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/general/general.less b/catalog-ui/src/app/view-models/workspace/tabs/general/general.less
index b60e4b8de4..8b2cc01d75 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/general/general.less
+++ b/catalog-ui/src/app/view-models/workspace/tabs/general/general.less
@@ -27,6 +27,7 @@
.file-upload-browse-btn {
.noselect;
.bg_n;
+ color:#191919;
padding: 4px 6px;
cursor: pointer;
z-index: 999;
@@ -35,10 +36,6 @@
text-align: center;
border-left: solid 1px #cfcfcf;
- &.disabled {
- cursor: default;
- }
-
&:hover:not(.disabled) {
background-color: #dbdee2;
}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts-view-model.ts
deleted file mode 100644
index 47a96fb385..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts-view-model.ts
+++ /dev/null
@@ -1,158 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import * as _ from "lodash";
-import {ModalsHandler} from "app/utils";
-import {SharingService} from "app/services";
-import {IAppConfigurtaion, ArtifactModel, IFileDownload} from "app/models";
-import {IWorkspaceViewModelScope} from "app/view-models/workspace/workspace-view-model";
-import {ComponentServiceNg2} from "../../../../ng2/services/component-services/component.service";
-import {ArtifactGroupModel} from "../../../../models/artifacts";
-import {ComponentGenericResponse} from "../../../../ng2/services/responses/component-generic-response";
-
-export interface IInformationArtifactsScope extends IWorkspaceViewModelScope {
- artifacts:Array<ArtifactModel>;
- tableHeadersList:Array<any>;
- artifactType:string;
- isResourceInstance:boolean;
- downloadFile:IFileDownload;
- isLoading:boolean;
- sortBy:string;
- reverse:boolean;
-
- getTitle():string;
- addOrUpdate(artifact:ArtifactModel):void;
- delete(artifact:ArtifactModel):void;
- download(artifact:ArtifactModel):void;
- clickArtifactName(artifact:any):void;
- openEditEnvParametersModal(artifactResource:ArtifactModel):void;
- sort(sortBy:string):void;
- showNoArtifactMessage():boolean;
-}
-
-export class InformationArtifactsViewModel {
-
- static '$inject' = [
- '$scope',
- '$filter',
- '$state',
- 'sdcConfig',
- 'ModalsHandler',
- 'ComponentServiceNg2'
- ];
-
- constructor(private $scope:IInformationArtifactsScope,
- private $filter:ng.IFilterService,
- private $state:any,
- private sdcConfig:IAppConfigurtaion,
- private ModalsHandler:ModalsHandler,
- private ComponentServiceNg2: ComponentServiceNg2) {
- this.initInformationalArtifacts();
- }
-
- private initInformationalArtifacts = ():void => {
- if(!this.$scope.component.artifacts) {
- this.$scope.isLoading = true;
- this.ComponentServiceNg2.getComponentInformationalArtifacts(this.$scope.component).subscribe((response:ComponentGenericResponse) => {
- this.$scope.component.artifacts = response.artifacts;
- this.initScope();
- this.$scope.isLoading = false;
- });
- } else {
- this.initScope();
- }
- }
-
- private initScope = ():void => {
-
- this.$scope.isLoading = false;
- this.$scope.sortBy = 'artifactDisplayName';
- this.$scope.reverse = false;
- this.$scope.setValidState(true);
- this.$scope.artifactType = 'informational';
- this.$scope.getTitle = ():string => {
- return this.$filter("resourceName")(this.$scope.component.name) + ' Artifacts';
-
- };
-
- this.$scope.tableHeadersList = [
- {title: 'Name', property: 'artifactDisplayName'},
- {title: 'Type', property: 'artifactType'},
- {title: 'Version', property: 'artifactVersion'},
- {title: 'UUID', property: 'artifactUUID'}
- ];
-
- this.$scope.artifacts = <ArtifactModel[]>_.values(this.$scope.component.artifacts);
- this.$scope.sort = (sortBy:string):void => {
- this.$scope.reverse = (this.$scope.sortBy === sortBy) ? !this.$scope.reverse : false;
- this.$scope.sortBy = sortBy;
- };
-
-
- this.$scope.addOrUpdate = (artifact:ArtifactModel):void => {
- artifact.artifactGroupType = 'INFORMATIONAL';
- this.ModalsHandler.openArtifactModal(artifact, this.$scope.component).then(() => {
- this.$scope.artifacts = <ArtifactModel[]>_.values(this.$scope.component.artifacts);
- });
- };
-
- this.$scope.showNoArtifactMessage = ():boolean => {
- let artifacts:any = [];
- artifacts = _.filter(this.$scope.artifacts, (artifact:ArtifactModel)=> {
- return artifact.esId;
- });
-
- if (artifacts.length === 0) {
- return true;
- }
- return false;
- };
-
- this.$scope.delete = (artifact:ArtifactModel):void => {
-
- let onOk = ():void => {
- this.$scope.isLoading = true;
- let onSuccess = ():void => {
- this.$scope.isLoading = false;
- this.$scope.artifacts = <ArtifactModel[]>_.values(this.$scope.component.artifacts);
- };
-
- let onFailed = (error:any):void => {
- console.log('Delete artifact returned error:', error);
- this.$scope.isLoading = false;
- };
-
- this.$scope.component.deleteArtifact(artifact.uniqueId, artifact.artifactLabel).then(onSuccess, onFailed);
- };
-
- let title:string = this.$filter('translate')("ARTIFACT_VIEW_DELETE_MODAL_TITLE");
- let message:string = this.$filter('translate')("ARTIFACT_VIEW_DELETE_MODAL_TEXT", "{'name': '" + artifact.artifactDisplayName + "'}");
- this.ModalsHandler.openConfirmationModal(title, message, false).then(onOk);
- };
-
- this.$scope.clickArtifactName = (artifact:any) => {
- if (!artifact.esId) {
- this.$scope.addOrUpdate(artifact);
- }
-
- };
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts-view.html b/catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts-view.html
deleted file mode 100644
index eacadb376c..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts-view.html
+++ /dev/null
@@ -1,82 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<div class="workspace-information-artifact">
- <div data-tests-id="add-information-artifact-button" ng-if="!isViewMode()"
- data-ng-class="{'disabled': isDisableMode()}"
- data-tests-id="addGrey" class="add-btn" data-ng-click="addOrUpdate({})" type="button">Add </div>
- <div class="table-container-flex">
- <div class="table" data-ng-class="{'view-mode': isViewMode()}">
- <div class="head flex-container">
- <div class="table-header head-row hand flex-item" ng-repeat="header in tableHeadersList track by $index" data-ng-click="sort(header.property)">{{header.title}}
- <span data-ng-show="sortBy === header.property" class="table-header-sort-arrow" data-ng-class="{'down': reverse, 'up':!reverse}"> </span>
- </div>
- <div class="table-no-text-header head-row flex-item"></div>
- </div>
- <div class="body">
- <perfect-scrollbar suppress-scroll-x="true" scroll-y-margin-offset="0" include-padding="true" class="scrollbar-container">
- <div data-ng-if="showNoArtifactMessage()" class="no-row-text" data-ng-class="{'disabled': isDisableMode()}">
- There are no information artifacts to display
- </div>
- <div data-ng-repeat-start="artifact in artifacts| orderBy:sortBy:reverse track by $index" data-tests-id="InformationalArtifactRow"
- class="flex-container data-row"
- data-ng-class="{'selected': artifact.selected}"
- data-ng-if="artifact.esId">
-
- <div class="table-col-general flex-item" data-ng-click="artifact.selected = !artifact.selected" data-tests-id="artifactDisplayName_{{artifact.artifactDisplayName}}">
- <span class="sprite table-arrow" data-ng-class="{'opened': artifact.selected}" data-tests-id="artifact_arrow_{{artifact.artifactDisplayName}}"></span>
- {{artifact.artifactDisplayName}}
- </div>
-
- <div class="table-col-general flex-item" data-ng-click="artifact.selected = !artifact.selected" data-tests-id="artifactType_{{artifact.artifactDisplayName}}">
- {{artifact.artifactType}}
- </div>
-
- <div class="table-col-general flex-item" data-ng-click="artifact.selected = !artifact.selected" data-tests-id="artifactVersion_{{artifact.artifactDisplayName}}">
- {{artifact.artifactVersion}}
- </div>
-
- <div class="table-col-general flex-item text" data-ng-click="artifact.selected = !artifact.selected" data-tests-id="artifactUUID_{{artifact.artifactDisplayName}}"
- tooltips tooltip-content="{{artifact.artifactUUID}}">
- <span>{{artifact.artifactUUID}}</span>
- </div>
-
- <div class="table-btn-col flex-item">
- <button class="table-edit-btn" data-tests-id="edit_{{artifact.artifactDisplayName}}" data-ng-if="!isViewMode() && !artifact.isThirdParty()" data-ng-click="addOrUpdate(artifact)" data-ng-class="{'disabled': isDisableMode()}"></button>
- <button class="table-delete-btn" data-tests-id="delete_{{artifact.artifactDisplayName}}" data-ng-if="!isViewMode() && !artifact.isThirdParty()" data-ng-click="delete(artifact)" data-ng-class="{'disabled': isDisableMode()}"> </button>
- <button class="table-download-btn" download-artifact data-tests-id="download_{{artifact.artifactDisplayName}}"
- data-ng-if="artifact.artifactName" component="component" artifact="artifact"></button>
- </div>
- </div>
- <div data-ng-repeat-end="" data-ng-if="artifact.selected" class="item-opened" data-tests-id="{{artifact.artifactDisplayName}}Description" data-ng-bind="artifact.description"></div>
- <button class="add-button" data-ng-repeat="artifact in artifacts track by $index"
- data-ng-show="!artifact.esId"
- data-tests-id="{{artifact.artifactDisplayName}}"
- ng-if="!isViewMode()"
- data-ng-class="{'disabled': isDisableMode()}"
- translate="DEPLOYMENT_ARTIFACT_BUTTON_ADD_HEAT"
- translate-values="{'name': '{{artifact.artifactDisplayName}}'}"
- data-ng-click="addOrUpdate(artifact)"></button>
- <button class="add-button"
- ng-if="!isViewMode()"
- data-ng-class="{'disabled': isDisableMode()}"
- translate="DEPLOYMENT_ARTIFACT_BUTTON_ADD_OTHER"
- data-ng-click="addOrUpdate({})"></button>
- </perfect-scrollbar>
- </div>
- </div>
- </div>
-</div>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts.less b/catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts.less
deleted file mode 100644
index 5e69c44e9b..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/information-artifacts/information-artifacts.less
+++ /dev/null
@@ -1,57 +0,0 @@
-.workspace-information-artifact {
- width: 93%;
- display: inline-block;
- .w-sdc-classic-btn {
- float: right;
- margin-bottom: 10px;
- }
-
- .table{
- height: 490px;
- margin-bottom: 0;
- }
-
- .table-container-flex {
- margin-top: 0;
-
- .item-opened{
- word-wrap: break-word;
- }
-
- .text{
- overflow: hidden;
- text-overflow: ellipsis;
- display: inline-block;
- white-space: nowrap;
- }
-
- .flex-item:nth-child(1) {
- flex-grow: 15;
- .hand;
- span.table-arrow {
- margin-right: 7px;
- }
- }
-
- .flex-item:nth-child(2) {
- flex-grow: 6;
- }
-
- .flex-item:nth-child(3) {
- flex-grow: 3;
- }
-
- .flex-item:nth-child(4) {
- flex-grow: 20;
- }
-
- .flex-item:nth-child(5) {
- flex-grow: 5;
- padding-top: 10px;
- }
-
- }
-
-}
-
-
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/inputs/inputs.less b/catalog-ui/src/app/view-models/workspace/tabs/inputs/inputs.less
deleted file mode 100644
index 17c18e1741..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/inputs/inputs.less
+++ /dev/null
@@ -1,225 +0,0 @@
-.workspace-inputs {
-
- .sdc-workspace-container .w-sdc-main-right-container .w-sdc-main-container-body-content {
- padding: 25px 8% 25px 8%;
- }
-
- .w-sdc-main-container .w-sdc-main-right-container > div:first-child {
- /* scroll fix */
- padding-bottom: 0px;
- }
-
-
- width: 100%;
- display: flex;
-
- .text {
- padding-left: 15px;
- .no-overflow;
- }
-
- .title-text {
- color: @main_color_m;
- .f-type._13_m;
- .bold;
- text-overflow: ellipsis;
- overflow: hidden;
- }
-
- .no-overflow {
- text-overflow: ellipsis;
- overflow: hidden;
- white-space: nowrap;
- }
-
- .title-blue-text {
- color: @main_color_a;
- .f-type._13_m;
-
- &.property-name-text {
- padding-right: 13px;
- border-right: 1px solid rgba(120, 136, 148, 0.26);
- flex-grow: 1;
- .no-overflow;
- }
- }
-
- .instance-name-text {
- flex-grow: 1;
- }
-
- ng-include {
- width: 45%;
- }
-
- .w-sdc-inputs-search {
- padding: 10px 20px 20px 0;
- white-space: nowrap;
- position: relative;
- width: 60%;
- height: 64px;
-
- .inputs-search-icon {
- top: 9px;
- right: 11px;
- }
-
- .magnification-white {
- .sprite-new;
- .search-white-icon;
- .hand;
- }
-
- .search-icon-container {
- width: 35px;
- height: 30px;
- background-color: @main_color_a;
- white-space: nowrap;
- float: right;
- position: relative;
- bottom: 31px;
- right: 1px;
- border-radius: 0px 4px 4px 0px;
- .hand
- }
- }
-
- .total-inputs-count {
- width: 100%;
- font-weight: bold;
- text-align: left;
- }
-
- .new-input-button {
- margin: 9px 0 0 0;
- }
-
- .w-sdc-inputs-search-input {
- border: 1px solid @color_e;
- .border-radius(4px);
- height: 32px;
- margin: 0;
- padding: 0px 28px 3px 10px;
- vertical-align: 4px;
- width: 100%;
- outline: none;
- font-style: italic;
- }
-
- .w-sdc-classic-btn {
- float: right;
- margin-bottom: 10px;
- }
-
- .prop-to-input-button {
- position: absolute;
- top: 50%;
- margin-right: -20px;
- margin-bottom: -10px;
-
- }
-
- .table-container-flex {
-
- .flex-item {
- line-height: 22px;
- }
- .expand-collapse-table-row {
-
- .data-row {
- background: @tlv_color_u;
- .hand;
- align-items: center;
- padding: 0 12px;
- margin: 1px 0px 1px 0px;
- min-height: 40px;
- }
-
- .data-row:hover {
- .bg_j;
- }
- }
- }
-
- .table {
- height: 640px;
- margin-bottom: 0;
- clear: both;
-
- .empty-row {
- padding: 3px;
- }
-
- .flex-item {
- line-height: 22px;
- }
-
- .table-header {
-
- line-height: 14px;
- background-color: @main_color_a;
- color: @main_color_p;
- text-align: left;
- padding: 7px 5px 7px 10px;
- .f-type._14_m;
- }
- .head {
- background-color: #e6e6e6;
- }
-
- .body {
- .scrollbar-container {
- .perfect-scrollbar;
- max-height: 610px;
- }
-
- .expand-collapse-inputs-table-icon {
- .hand;
- .sprite-new;
- .arrow-up;
- transition: .3s all;
- position: relative;
- left: 8px;
- border: none !important;
- padding: 0px 10px 0px 10px;
- }
-
- .table-col-text {
- margin-left: 14px;
- }
- }
- }
-
- .inputs-header {
- width: 100%;
- position: relative;
- bottom: 31px;
- }
-
- .inputs-tables-container {
- width: 100%;
- min-width: 100%;
- display: flex;
- }
-
- .inputs-button-container {
- width: 8%;
- min-width: 8%;
- display: flex;
-
- .right-arrow-btn {
- .sprite-new;
- .blue-right-arrow-circle;
- margin: auto;
- cursor: pointer;
- }
- }
-
- .table-container-flex {
- margin-top: 0;
- width: 46%;
- min-width: 46%;
- display: inline-block;
- float: left;
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/interface-operation/interface-operation-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/interface-operation/interface-operation-view-model.ts
index 180d78954a..83a2be2a60 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/interface-operation/interface-operation-view-model.ts
+++ b/catalog-ui/src/app/view-models/workspace/tabs/interface-operation/interface-operation-view-model.ts
@@ -27,7 +27,6 @@
* limitations under the License.
*/
-
'use strict';
import {IWorkspaceViewModelScope} from "app/view-models/workspace/workspace-view-model";
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/interface-operation/interface-operation-view.html b/catalog-ui/src/app/view-models/workspace/tabs/interface-operation/interface-operation-view.html
index 0e7c355c47..236289feff 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/interface-operation/interface-operation-view.html
+++ b/catalog-ui/src/app/view-models/workspace/tabs/interface-operation/interface-operation-view.html
@@ -13,7 +13,6 @@
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
-
<div class="workspace-interface-operation">
<interface-operation
[component]="component"
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/management-workflow/management-workflow-view.html b/catalog-ui/src/app/view-models/workspace/tabs/management-workflow/management-workflow-view.html
index 4a97b64daf..ddabd68d7b 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/management-workflow/management-workflow-view.html
+++ b/catalog-ui/src/app/view-models/workspace/tabs/management-workflow/management-workflow-view.html
@@ -13,7 +13,6 @@
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
-
<loader data-display="isLoading"></loader>
<div class="workspace-management-workflow" ng-if="vendorModel">
<punch-out name="'sequence-diagram'" data="vendorModel" user="user" on-event="onVendorEvent"></punch-out>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/network-call-flow/network-call-flow-view.html b/catalog-ui/src/app/view-models/workspace/tabs/network-call-flow/network-call-flow-view.html
index a1efb33301..01343a35ac 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/network-call-flow/network-call-flow-view.html
+++ b/catalog-ui/src/app/view-models/workspace/tabs/network-call-flow/network-call-flow-view.html
@@ -13,7 +13,6 @@
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
-
<loader data-display="isLoading"></loader>
<div ng-if="vendorMessageModel" class="workspace-network-call-flow">
<punch-out name="'sequence-diagram'" data="vendorMessageModel" user="user" on-event="onVendorEvent"></punch-out>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view-model.ts
deleted file mode 100644
index d3ccbe3325..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view-model.ts
+++ /dev/null
@@ -1,94 +0,0 @@
-/*
-
-* Copyright (c) 2018 AT&T Intellectual Property.
-
-*
-
-* 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.
-
-*/
-
-import {IUserProperties, Plugin} from "app/models";
-import {CacheService} from "app/services";
-import {PluginsService} from "../../../../ng2/services/plugins.service";
-import {IWorkspaceViewModelScope} from "../../workspace-view-model";
-
-
-interface IPluginsContextViewModelScope extends IWorkspaceViewModelScope {
- plugin: Plugin;
- user: IUserProperties;
- queryParams: Object;
- isLoading: boolean;
- show: boolean;
-
- onLoadingDone(plugin: Plugin): void;
-}
-
-export class PluginsContextViewModel {
- static '$inject' = [
- '$scope',
- '$stateParams',
- 'Sdc.Services.CacheService',
- 'PluginsService'
- ];
-
- constructor(private $scope: IPluginsContextViewModelScope,
- private $stateParams: any,
- private cacheService: CacheService,
- private pluginsService: PluginsService) {
-
- this.initScope();
- }
-
- private initScope = (): void => {
- this.$scope.show = false;
- this.$scope.plugin = this.pluginsService.getPluginByStateUrl(this.$stateParams.path);
- this.$scope.user = this.cacheService.get('user');
-
- this.$scope.isLoading = true;
-
- this.$scope.queryParams = {
- userId: this.$scope.user.userId,
- userRole: this.$scope.user.role,
- displayType: "context",
- contextType: this.$scope.component.getComponentSubType(),
- uuid: this.$scope.component.uuid,
- lifecycleState: this.$scope.component.lifecycleState,
- isOwner: this.$scope.component.lastUpdaterUserId === this.$scope.user.userId,
- version: this.$scope.component.version,
- parentUrl: window.location.origin,
- eventsClientId: this.$scope.plugin.pluginId
- };
-
- if (this.$stateParams.queryParams) {
- _.assign(this.$scope.queryParams, this.$stateParams.queryParams);
- }
-
- this.$scope.onLoadingDone = (plugin: Plugin) => {
- if (plugin.pluginId == this.$scope.plugin.pluginId) {
- this.$scope.isLoading = false;
- }
- };
-
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view.html b/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view.html
deleted file mode 100644
index 44c04e4e71..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view.html
+++ /dev/null
@@ -1,20 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<loader display="isLoading && plugin.isOnline" ></loader>
-<div class="workspace-plugins">
- <plugin-frame (on-loading-done)="onLoadingDone(plugin)" [plugin]="plugin" [query-params]="queryParams"></plugin-frame>
-</div>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context.less b/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context.less
deleted file mode 100644
index c913af1931..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context.less
+++ /dev/null
@@ -1,2 +0,0 @@
-.workspace-plugins {
-}
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 b09662d7a2..9794209757 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
@@ -19,12 +19,12 @@
*/
'use strict';
-import {IWorkspaceViewModelScope} from "app/view-models/workspace/workspace-view-model";
-import {PropertyModel} from "app/models";
-import {ModalsHandler} from "app/utils";
-import {COMPONENT_FIELDS} from "../../../../utils/constants";
-import {ComponentGenericResponse} from "../../../../ng2/services/responses/component-generic-response";
-import {ComponentServiceNg2} from "../../../../ng2/services/component-services/component.service";
+import { IWorkspaceViewModelScope } from "app/view-models/workspace/workspace-view-model";
+import { PropertyModel } from "app/models";
+import { ModalsHandler } from "app/utils";
+import { ComponentGenericResponse } from "../../../../ng2/services/responses/component-generic-response";
+import { ComponentServiceNg2 } from "../../../../ng2/services/component-services/component.service";
+import { SdcUiCommon, SdcUiServices, SdcUiComponents } from "onap-ui-angular";
interface IPropertiesViewModelScope extends IWorkspaceViewModelScope {
tableHeadersList:Array<any>;
@@ -43,14 +43,16 @@ export class PropertiesViewModel {
'$scope',
'$filter',
'ModalsHandler',
- 'ComponentServiceNg2'
+ 'ComponentServiceNg2',
+ 'ModalServiceSdcUI'
];
constructor(private $scope:IPropertiesViewModelScope,
private $filter:ng.IFilterService,
private ModalsHandler:ModalsHandler,
- private ComponentServiceNg2:ComponentServiceNg2) {
+ private ComponentServiceNg2:ComponentServiceNg2,
+ private modalService: SdcUiServices.ModalService) {
this.initComponentProperties();
}
@@ -101,12 +103,13 @@ export class PropertiesViewModel {
this.$scope.delete = (property:PropertyModel):void => {
- let onOk = ():void => {
+ let onOk: Function = ():void => {
this.$scope.component.deleteProperty(property.uniqueId);
};
let title:string = this.$filter('translate')("PROPERTY_VIEW_DELETE_MODAL_TITLE");
let message:string = this.$filter('translate')("PROPERTY_VIEW_DELETE_MODAL_TEXT", "{'name': '" + property.name + "'}");
- this.ModalsHandler.openConfirmationModal(title, message, false).then(onOk);
+ const okButton = {testId: "OK", text: "OK", type: SdcUiCommon.ButtonType.info, callback: onOk, closeModal: true} as SdcUiComponents.ModalButtonComponent;
+ this.modalService.openInfoModal(title, message, 'delete-modal', [okButton]);
};
}
}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/properties/properties-view.html b/catalog-ui/src/app/view-models/workspace/tabs/properties/properties-view.html
index 1505e8397d..1d8a2ff78c 100644
--- a/catalog-ui/src/app/view-models/workspace/tabs/properties/properties-view.html
+++ b/catalog-ui/src/app/view-models/workspace/tabs/properties/properties-view.html
@@ -13,7 +13,6 @@
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
-
<div class="workspace-properties">
<div id="left-top-bar">
<span id="properties-count">Total Properties: {{component.properties.length}}</span>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-editable-view.html b/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-editable-view.html
deleted file mode 100644
index 566cc5fc2c..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-editable-view.html
+++ /dev/null
@@ -1,247 +0,0 @@
-<!--
- ~ Copyright © 2016-2018 European Support Limited
- ~
- ~ 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.
--->
-
-<div class="workspace-req-and-cap-editable">
- <loader data-display="isLoading"></loader>
-
- <div class="tabs-header">
- <div class="req-and-cap-tabs">
- <div data-tests-id="req-tab" data-ng-click="onSwitchTab()" class="tab"
- data-ng-class="{'selected':mode=='requirements'}">Requirements
- </div>
- <div data-tests-id="cap-tab" data-ng-click="onSwitchTab()" class="tab"
- data-ng-class="{'selected':mode=='capabilities'}">Capabilities
- </div>
- </div>
- <div class="buttons-in-right" data-ng-if="!isListEmpty()">
- <div class="search">
- <input id="search-box" data-ng-if="filter.show" data-tests-id="search-box" placeholder="Search"
- data-ng-model-options="{debounce: 200}" data-ng-model="filter.txt" data-ng-change="onFilter()"/>
- <div class="search-icon-container" data-tests-id="search-icon">
- <svg-icon
- class="hand"
- [name]="'search-o'"
- [mode]="'primary'"
- [size]="'small'"
- [clickable]="'true'"
- data-ng-click="onSearchIconClick()">
- </svg-icon>
- </div>
- </div>
- <div class="add-button-icon-and-label" data-ng-if="isEditable" data-ng-click="onAddBtnClicked()"
- data-ng-class="{'disabled': isReadonly()}" data-tests-id="add-button">
- <svg-icon
- name="plus"
- mode="primary"
- size="small"
- clickable="true"
- [disabled]="isReadonly()"
- labelPlacement="top">
- </svg-icon>
- <span class="icon-label-txt">{{mode === 'requirements' ? 'Add Requirement' : 'Add Capability'}}</span>
- </div>
- </div>
- </div>
-
- <div class="empty-list-container" data-ng-if="isListEmpty() && !isLoading" data-tests-id="empty-list-container">
- <div class="empty-list-add-btn add-button-icon-and-label" data-ng-class="{'disabled': isReadonly()}"
- data-ng-click="onAddBtnClicked()" data-tests-id="empty-list-add-btn">
- <svg-icon
- name="plus-circle"
- mode="primary"
- size="x_large"
- clickable="true"
- [disabled]="isReadonly()">
- </svg-icon>
- <div class="icon-label-txt">{{mode === 'requirements' ? 'Add Requirement' : 'Add Capability'}}</div>
- </div>
- </div>
-
- <div class="table-container-flex requirements-table" data-ng-if="mode=='requirements' && !isListEmpty()">
- <div class="table" data-ng-class="{'view-mode': isViewMode()}" data-tests-id="requirement-table">
- <div class="head flex-container">
- <div data-ng-repeat="header in editableRequirementsTableHeadersList track by $index"
- data-ng-click="sort(header.property, requirementsSortTableDefined, false)"
- class="table-header head-row hand flex-item {{header.property}}"
- data-tests-id="table-header-{{header.property}}">
- {{header.title}}
- <span data-ng-if="requirementsSortTableDefined.sortByField === header.property"
- class="table-header-sort-arrow" data-tests-id="table-header-sort-arrow"
- data-ng-class="{'down': requirementsSortTableDefined.reverse, 'up':!requirementsSortTableDefined.reverse}"> </span>
- </div>
- </div>
-
- <div class="body">
- <perfect-scrollbar scroll-y-margin-offset="0" include-padding="true" class="editable-table-data">
- <div data-ng-if="filteredRequirementsList.length === 0" class="no-row-text"
- data-tests-id="no-rows-in-table">
- There are no requirements to display
-
- </div>
- <div data-ng-repeat="req in filteredRequirementsList | orderBy:requirementsSortTableDefined.sortByField:requirementsSortTableDefined.reverse track by $index"
- data-tests-id="reqRow">
- <div class="flex-container data-row" data-ng-class="{'editable-row': req.isCreatedManually}"
- data-ng-click="req.isCreatedManually && onEditRequirement(req)">
- <div class="table-col-general flex-item text ellipsis-text" tooltips
- tooltip-content="{{(!req.isCreatedManually ? req.ownerName + '.' : '') + req.name}}">
- <span data-tests-id="{{(!req.isCreatedManually ? req.ownerName + '.' : '') + req.name}}">{{(!req.isCreatedManually ? req.ownerName + '.' : '') + req.name}}</span>
- </div>
- <div class="table-col-general flex-item text ellipsis-text" tooltips
- tooltip-content="{{req.capability}}">
- <span data-tests-id="{{req.capability}}">{{req.capability && cutToscaTypePrefix(req.capability, 'capabilities.')}}</span>
- </div>
- <div class="table-col-general flex-item text ellipsis-text" tooltips
- tooltip-content="{{req.node}}">
- <span data-tests-id="{{req.node}}">{{req.node && cutToscaTypePrefix(req.node, "nodes.")}}</span>
- </div>
- <div class="table-col-general flex-item text ellipsis-text" tooltips
- tooltip-content="{{req.relationship}}">
- <span data-tests-id="{{req.relationship}}">{{req.relationship && cutToscaTypePrefix(req.relationship, "relationships.")}}</span>
- </div>
- <div class="table-col-general flex-item text ellipsis-text occurrences-col" tooltips
- tooltip-content="{{req.minOccurrences}} - {{req.maxOccurrences}}">
- <span data-tests-id="{{req.minOccurrences}} - {{req.maxOccurrences}}">{{req.minOccurrences}} - {{req.maxOccurrences}}</span>
- </div>
- <div class="table-col-general flex-item text other-col" data-tests-id="delete-req"
- data-ng-class="{'disabled': isReadonly()}">
- <svg-icon name="trash-o" class="trash-icon" size="small"
- data-ng-if="req.isCreatedManually && !isReadonly()"
- data-ng-click="onDeleteReq($event, req)"></svg-icon>
- </div>
- </div>
- </div>
- </perfect-scrollbar>
- </div>
-
- </div>
- </div>
- <div class="table-container-flex capabilities-table" data-ng-if="mode=='capabilities' && !isListEmpty()"
- data-tests-id="capabilities-table">
- <div class="table" data-ng-class="{'view-mode': isViewMode()}">
- <div class="head flex-container">
- <div data-ng-repeat="header in editableCapabilitiesTableHeadersList track by $index"
- data-ng-click="sort(header.property, capabilitiesSortTableDefined, true)"
- class="table-header head-row hand flex-item {{header.property}}"
- data-tests-id="header-{{header.property}}">
- {{header.title}}
- <span data-ng-if="capabilitiesSortTableDefined.sortByField === header.property"
- class="table-header-sort-arrow" data-tests-id=="table-header-sort-arrow"
- data-ng-class="{'down': capabilitiesSortTableDefined.reverse, 'up':!capabilitiesSortTableDefined.reverse}"> </span>
- </div>
- </div>
-
- <div class="body">
- <perfect-scrollbar scroll-y-margin-offset="0" include-padding="true" class="editable-table-data">
- <div data-ng-if="filteredCapabilitiesList.length === 0" class="no-row-text"
- data-tests-id="no-rows-in-table">
- There are no capabilities to display
- </div>
- <div data-ng-repeat-start="capability in filteredCapabilitiesList | orderBy:capabilitiesSortTableDefined.sortByField:capabilitiesSortTableDefined.reverse track by $index"
- class="flex-container data-row"
- data-ng-class="{'selected': capability.selected, 'editable-row': capability.isCreatedManually}"
- data-ng-click="capability.isCreatedManually && onEditCapability(capability)"
- data-tests-id="capabilities-table-row">
-
- <div class="table-col-general flex-item text ellipsis-text" tooltips
- tooltip-content="{{(!capability.isCreatedManually ? capability.ownerName + '.' : '') + capability.name}}">
- <span class="sprite-new arrow-up-small hand"
- data-ng-class="{'hideme': !capability.properties.length, 'opened': capability.selected}"
- data-ng-click="capability.selected = !capability.selected; $event.stopPropagation();"></span>
- <span data-tests-id="{{(!capability.isCreatedManually ? capability.ownerName + '.' : '') + capability.name}}"
- class="name-col" data-ng-class="{'opened': capability.selected}">
- {{(!capability.isCreatedManually ? capability.ownerName + '.' : '') + capability.name}}
- </span>
- </div>
- <div class="table-col-general flex-item text ellipsis-text" tooltips
- tooltip-content="{{capability.type}}">
- <span data-tests-id="{{capability.type}}">{{capability.type && cutToscaTypePrefix(capability.type, 'capabilities.')}}</span>
- </div>
-
- <div class="table-col-general flex-item text description-col">
- <div data-tests-id="{{capability.description}}" class="multiline-ellipsis"
- ellipsis="capability.description" max-chars="60">{{capability.description}}
- </div>
- </div>
-
- <div class="table-col-general flex-item text ellipsis-text" tooltips
- tooltip-content="{{capability.validSourceTypes.join(',')}}">
- <span data-tests-id="{{capability.validSourceTypes.join(',')}}">{{capability.validSourceTypes.join(',')}}</span>
- </div>
-
- <div class="table-col-general flex-item text ellipsis-text occurrences-col" tooltips
- tooltip-content="{{capability.minOccurrences}} - {{capability.maxOccurrences}}">
- <span data-tests-id="{{capability.minOccurrences}} - {{capability.maxOccurrences}}">{{capability.minOccurrences}} - {{capability.maxOccurrences}}</span>
- </div>
-
- <div class="table-col-general flex-item text other-col" data-tests-id="delete-cap"
- data-ng-class="{'disabled': isReadonly()}">
- <svg-icon name="trash-o" class="trash-icon" size="small"
- data-ng-if="capability.isCreatedManually && !isReadonly()"
- data-ng-click="onDeleteCap($event, capability)"></svg-icon>
- </div>
- </div>
- <div data-ng-repeat-end data-ng-if="capability.selected" class="item-opened properties-section">
- <p class="properties-title">Properties</p>
- <div class="table-container-flex properties-table">
- <div class="table" data-ng-class="{'view-mode': true}">
- <div class="head flex-container">
- <div class="table-header head-row hand flex-item"
- data-ng-repeat="header in capabilityPropertiesTableHeadersList track by $index"
- data-ng-click="sort(header.property, propertiesSortTableDefined, false)">
- {{header.title}}
- <span data-ng-if="propertiesSortTableDefined.sortByField === header.property"
- class="table-header-sort-arrow"
- data-ng-class="{'down': propertiesSortTableDefined.reverse, 'up':!propertiesSortTableDefined.reverse}"> </span>
- </div>
- </div>
-
- <div class="body">
- <div data-ng-repeat="property in capability.properties | orderBy:propertiesSortTableDefined.sortByField:propertiesSortTableDefined.reverse track by $index"
- data-tests-id="propertyRow"
- class="flex-container data-row">
- <div class="table-col-general flex-item text"
- data-tests-id="{{property.name}}"
- tooltips tooltip-content="{{property.name}}">
- {{property.name}}
- </div>
- <div class="table-col-general flex-item text"
- data-tests-id="{{property.type}}"
- tooltips tooltip-content="{{property.type}}">
- {{property.type}}
- </div>
- <div class="table-col-general flex-item text"
- data-tests-id="{{property.schema.property.type}}"
- tooltips tooltip-content="{{property.schema.property.type}}">
- {{property.schema.property.type}}
- </div>
- <div class="table-col-general flex-item text"
- tooltips tooltip-content="{{property.description}}"
- data-tests-id="{{property.description}}">
- {{property.description}}
- </div>
- </div>
- </div>
-
- </div>
- </div>
- </div>
- </perfect-scrollbar>
- </div>
-
- </div>
- </div>
-</div>
-
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-view-model.ts
deleted file mode 100644
index 14b45cbdf3..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-view-model.ts
+++ /dev/null
@@ -1,471 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-/**
- * Created by rcohen on 9/22/2016.
- */
-'use strict';
-import * as _ from "lodash";
-import {ComponentRef} from '@angular/core';
-import {IWorkspaceViewModelScope} from "app/view-models/workspace/workspace-view-model";
-import {ModalsHandler, ResourceType} from "app/utils";
-import {ComponentType} from "app/utils/constants";
-import {
- Capability, PropertyModel, Requirement, Resource,
- RelationshipTypesMap, NodeTypesMap, CapabilityTypesMap
-} from "app/models";
-import {ComponentGenericResponse} from "app/ng2/services/responses/component-generic-response";
-import {ComponentServiceNg2} from "app/ng2/services/component-services/component.service";
-import {ToscaTypesServiceNg2} from "app/ng2/services/tosca-types.service";
-import {ModalComponent} from 'app/ng2/components/ui/modal/modal.component';
-import {ModalService} from 'app/ng2/services/modal.service';
-import {RequirementsEditorComponent} from 'app/ng2/pages/req-and-capabilities-editor/requirements-editor/requirements-editor.component';
-import {CapabilitiesEditorComponent} from 'app/ng2/pages/req-and-capabilities-editor/capabilities-editor/capabilities-editor.component';
-import {ModalService as ModalServiceSdcUI} from "sdc-ui/lib/angular/modals/modal.service";
-import {IModalConfig} from "sdc-ui/lib/angular/modals/models/modal-config";
-import {ModalButtonComponent} from "sdc-ui/lib/angular/components";
-
-export class SortTableDefined {
- reverse:boolean;
- sortByField:string;
-}
-
-class RequirementUI extends Requirement {
- isCreatedManually: boolean;
-
- constructor(input: Requirement, componentUniqueId: string) {
- super(input);
- this.isCreatedManually = input.ownerId === componentUniqueId;
- }
-}
-class CapabilityUI extends Capability {
- isCreatedManually: boolean;
-
- constructor(input: Capability, componentUniqueId: string) {
- super(input);
- this.isCreatedManually = input.ownerId === componentUniqueId;
- }
-}
-
-interface IReqAndCapabilitiesViewModelScope extends IWorkspaceViewModelScope {
- requirementsTableHeadersList:Array<any>;
- editableRequirementsTableHeadersList: Array<any>;
- capabilitiesTableHeadersList:Array<any>;
- editableCapabilitiesTableHeadersList: Array<any>;
- capabilityPropertiesTableHeadersList:Array<any>;
- requirementsSortTableDefined:SortTableDefined;
- capabilitiesSortTableDefined:SortTableDefined;
- propertiesSortTableDefined:SortTableDefined;
- requirements: Array<RequirementUI>;
- filteredRequirementsList: Array<RequirementUI>;
- capabilities: Array<CapabilityUI>;
- filteredCapabilitiesList: Array<CapabilityUI>;
- mode:string;
- filteredProperties:Array<Array<PropertyModel>>;
- searchText:string;
- isEditable: boolean;
- modalInstance: ComponentRef<ModalComponent>;
- filter: {txt: string; show: boolean};
-
- sort(sortBy: string, sortByTableDefined: SortTableDefined, autoCollapseCapabilitiesRows: boolean): void;
- sortByIsCreatedManually(arrToSort: Array<RequirementUI|CapabilityUI>): Array<any>;
- updateProperty(property:PropertyModel, indexInFilteredProperties:number):void;
- allCapabilitiesSelected(selected:boolean):void;
- onAddBtnClicked(): void;
- onEditRequirement(req: RequirementUI): void;
- onEditCapability(cap: CapabilityUI): void;
- onDeleteReq(event, req: RequirementUI): void;
- onDeleteCap(event, cap: CapabilityUI): void;
- onFilter(): void;
- isListEmpty(): boolean;
- onSwitchTab(): void;
- onSearchIconClick(): void;
- cutToscaTypePrefix(valToCut: string, textToStartCut: string): string;
- isReadonly(): boolean;
-}
-
-export class ReqAndCapabilitiesViewModel {
-
- static '$inject' = [
- '$scope',
- '$filter',
- 'ModalsHandler',
- 'ComponentServiceNg2',
- 'ToscaTypesServiceNg2',
- 'ModalServiceNg2',
- 'ModalServiceSdcUI'
- ];
-
-
- constructor(private $scope:IReqAndCapabilitiesViewModelScope,
- private $filter:ng.IFilterService,
- private ModalsHandler:ModalsHandler,
- private ComponentServiceNg2: ComponentServiceNg2,
- private ToscaTypesServiceNg2: ToscaTypesServiceNg2,
- private ModalServiceNg2: ModalService,
- private ModalServiceSdcUI: ModalServiceSdcUI) {
-
- this.initCapabilitiesAndRequirements();
- this.fetchCapabilitiesRelatedData();
- }
-
- private initCapabilitiesAndRequirements = (): void => {
-
- this.$scope.isEditable = this.getIsEditableByComponentType();
- this.$scope.isLoading = true;
- this.ComponentServiceNg2.getCapabilitiesAndRequirements(this.$scope.component.componentType, this.$scope.component.uniqueId).subscribe((response: ComponentGenericResponse) => {
- this.$scope.component.capabilities = response.capabilities;
- this.$scope.component.requirements = response.requirements;
- this.initScope();
- this.$scope.isLoading = false;
- }, () => {
- this.$scope.isLoading = false;
- });
-
- }
-
- private openEditPropertyModal = (property:PropertyModel, indexInFilteredProperties:number):void => {
- //...because there is not be api
- _.forEach(this.$scope.filteredProperties[indexInFilteredProperties], (prop:PropertyModel)=> {
- prop.readonly = true;
- });
- this.ModalsHandler.openEditPropertyModal(property, this.$scope.component, this.$scope.filteredProperties[indexInFilteredProperties], false, "component", this.$scope.component.uniqueId).then(() => {
-
- });
- };
-
- private initScope = (currentMode = 'requirements'): void => {
- this.$scope.isReadonly = (): boolean => {
- return this.$scope.isViewMode() || !this.$scope.isDesigner();
- };
- this.$scope.filter = {txt: '', show: false};
- this.$scope.requirementsSortTableDefined = {
- reverse: false,
- sortByField: this.$scope.isEditable ? 'other' : 'name'
- };
- this.$scope.capabilitiesSortTableDefined = {
- reverse: false,
- sortByField: this.$scope.isEditable ? 'other' : 'name'
- };
- this.$scope.propertiesSortTableDefined = {
- reverse: false,
- sortByField: 'name'
- };
-
- this.$scope.setValidState(true);
- this.$scope.requirementsTableHeadersList = [
- {title: 'Name', property: 'name'},
- {title: 'Capability', property: 'capability'},
- {title: 'Node', property: 'node'},
- {title: 'Relationship', property: 'relationship'},
- {title: 'Connected To', property: ''},
- {title: 'Occurrences', property: ''}
- ];
- this.$scope.capabilitiesTableHeadersList = [
- {title: 'Name', property: 'name'},
- {title: 'Type', property: 'type'},
- {title: 'Description', property: ''},
- {title: 'Valid Source', property: ''},
- {title: 'Occurrences', property: ''}
- ];
- this.$scope.editableRequirementsTableHeadersList = [
- {title: 'Name', property: 'name'},
- {title: 'Capability', property: 'capability'},
- {title: 'Node', property: 'node'},
- {title: 'Relationship', property: 'relationship'},
- {title: 'Occurrences', property: 'occurrences'},
- {title: '●●●', property: 'other'}
- ];
- this.$scope.editableCapabilitiesTableHeadersList = [
- {title: 'Name', property: 'name'},
- {title: 'Type', property: 'type'},
- {title: 'Description', property: 'description'},
- {title: 'Valid Sources', property: 'valid-sources'},
- {title: 'Occurrences', property: 'occurrences'},
- {title: '●●●', property: 'other'}
- ];
- this.$scope.capabilityPropertiesTableHeadersList = [
- {title: 'Name', property: 'name'},
- {title: 'Type', property: 'type'},
- {title: 'Schema', property: 'schema.property.type'},
- {title: 'Description', property: 'description'},
- ];
- this.$scope.filteredProperties = [];
-
- this.$scope.mode = currentMode;
- this.$scope.requirements = [];
- _.forEach(this.$scope.component.requirements, (req:Array<Requirement>, capName)=> {
- let reqUIList: Array<RequirementUI> = _.map(req, reqObj => new RequirementUI(reqObj, this.$scope.component.uniqueId));
- this.$scope.requirements = this.$scope.requirements.concat(reqUIList);
- });
- this.$scope.filteredRequirementsList = this.$scope.requirements;
-
- this.$scope.capabilities = [];
- _.forEach(this.$scope.component.capabilities, (cap:Array<Capability>, capName)=> {
- let capUIList: Array<CapabilityUI> = _.map(cap, capObj => new CapabilityUI(capObj, this.$scope.component.uniqueId));
- this.$scope.capabilities = this.$scope.capabilities.concat(capUIList);
- });
-
- this.$scope.sortByIsCreatedManually = (arrToSort: Array<RequirementUI|CapabilityUI>): Array<any> => {
- return arrToSort.sort((elem1: RequirementUI|CapabilityUI, elem2: RequirementUI|CapabilityUI) => +elem2.isCreatedManually - (+elem1.isCreatedManually));
- };
- this.$scope.filteredCapabilitiesList = this.$scope.sortByIsCreatedManually(this.$scope.capabilities);
- this.$scope.filteredRequirementsList = this.$scope.sortByIsCreatedManually(this.$scope.requirements);
-
- this.$scope.sort = (sortBy: string, sortByTableDefined: SortTableDefined, autoCollapseCapabilitiesRows: boolean): void => {
- sortByTableDefined.reverse = (sortByTableDefined.sortByField === sortBy) ? !sortByTableDefined.reverse : false;
- sortByTableDefined.sortByField = sortBy;
- if (autoCollapseCapabilitiesRows) {
- this.$scope.allCapabilitiesSelected(false);
- }
- };
-
- this.$scope.updateProperty = (property:PropertyModel, indexInFilteredProperties:number):void => {
- this.openEditPropertyModal(property, indexInFilteredProperties);
- };
-
- this.$scope.allCapabilitiesSelected = (selected:boolean):void => {
- _.forEach(this.$scope.capabilities, (cap:Capability)=> {
- cap.selected = selected;
- });
- };
- this.$scope.onAddBtnClicked = (): void => {
- switch (this.$scope.mode) {
- case 'requirements':
- this.openRequirementsModal();
- break;
- case 'capabilities':
- this.openCapabilitiesModal();
- break;
- }
- };
- this.$scope.onEditRequirement = (req: RequirementUI): void => {
- this.openRequirementsModal(req);
- };
- this.$scope.onEditCapability = (cap: CapabilityUI): void => {
- this.openCapabilitiesModal(cap);
- };
- this.$scope.onDeleteReq = (event: Event, req: RequirementUI): void => {
- event.stopPropagation();
- this.ModalServiceSdcUI.openAlertModal('Delete Requirement',
- `Are you sure you want to delete requirement: ${req.name}?`, 'OK', () => this.deleteRequirement(req), 'Cancel');
- };
- this.$scope.onDeleteCap = (event: Event, cap: CapabilityUI): void => {
- event.stopPropagation();
- this.ModalServiceSdcUI.openAlertModal('Delete Capability',
- `Are you sure you want to delete capability: ${cap.name}?`, 'OK', () => this.deleteCapability(cap), 'Cancel');
- };
- this.$scope.onSearchIconClick = (): void => {
- this.$scope.filter.show = !!this.$scope.filter.txt || !this.$scope.filter.show;
- };
- this.$scope.onFilter = (): void => {
- switch (this.$scope.mode) {
- case 'requirements':
- this.$scope.filteredRequirementsList = _.filter(this.$scope.requirements, req => req.name.includes(this.$scope.filter.txt));
- break;
- case 'capabilities':
- this.$scope.filteredCapabilitiesList = _.filter(this.$scope.capabilities, cap => cap.name.includes(this.$scope.filter.txt));
- break;
- }
- };
- this.$scope.isListEmpty = (): boolean => {
- switch (this.$scope.mode) {
- case 'requirements':
- return this.$scope.requirements.length === 0;
- case 'capabilities':
- return this.$scope.capabilities.length === 0;
- }
- };
- this.$scope.onSwitchTab = (): void => {
- this.$scope.mode = this.$scope.mode === 'requirements' ? 'capabilities' : 'requirements';
- this.$scope.filter.txt = '';
- this.$scope.filter.show = false;
- this.$scope.filteredRequirementsList = this.$scope.requirements;
- this.$scope.filteredCapabilitiesList = this.$scope.capabilities;
- };
- this.$scope.cutToscaTypePrefix = (valToCut: string, textToStartCut: string): string => {
- let index = valToCut.indexOf(textToStartCut);
- return index !== -1 ? valToCut.substr(index + textToStartCut.length) : valToCut;
- };
- };
-
- private getIsEditableByComponentType() {
- if (this.$scope.componentType === ComponentType.SERVICE) {
- return true;
- }
- if (this.$scope.component.isResource()) {
- let componentAsResource: Resource = <Resource>this.$scope.component;
- return componentAsResource.resourceType === ResourceType.VF ||
- componentAsResource.resourceType === ResourceType.PNF;
- }
- return false;
- };
-
- private fetchCapabilitiesRelatedData() {
- if (this.$scope.isEditable) {
- this.$scope.capabilityTypesList = [];
- this.ToscaTypesServiceNg2.fetchCapabilityTypes().subscribe((result: CapabilityTypesMap) => {
- _.forEach(result, capabilityType => this.$scope.capabilityTypesList.push(capabilityType));
- });
- this.$scope.nodeTypesList = [];
- this.ToscaTypesServiceNg2.fetchNodeTypes().subscribe((result: NodeTypesMap) => {
- _.forEach(result, nodeType => this.$scope.nodeTypesList.push(nodeType));
- });
- this.$scope.relationshipTypesList = [];
- this.ToscaTypesServiceNg2.fetchRelationshipTypes().subscribe((result: RelationshipTypesMap) => {
- _.forEach(result, relshipType => this.$scope.relationshipTypesList.push(relshipType));
- });
- }
- }
-
- private openRequirementsModal(req?: RequirementUI) {
- let modalConfig: IModalConfig = {
- size: 'md',
- title: (req ? 'Update' : 'Add') + ' Requirement',
- type: 'custom',
- buttons: [
- {
- id: 'saveButton',
- text: (req ? 'Update' : 'Create'),
- size: "'x-small'",
- callback: () => this.createOrUpdateRequirement(),
- closeModal: true
- },
- {text: "Cancel", size: "'x-small'", closeModal: true}]
- };
- let modalInputs = {
- requirement: req,
- relationshipTypesList: this.$scope.relationshipTypesList,
- nodeTypesList: this.$scope.nodeTypesList,
- capabilityTypesList: this.$scope.capabilityTypesList,
- isReadonly: this.$scope.isViewMode() || !this.$scope.isDesigner(),
- validityChangedCallback: this.getDisabled
- };
-
- this.ModalServiceSdcUI.openCustomModal(modalConfig, RequirementsEditorComponent, {input: modalInputs});
- }
-
- private openCapabilitiesModal(cap?: CapabilityUI) {
- let modalConfig: IModalConfig = {
- size: 'md',
- title: (cap ? 'Update' : 'Add') + ' Capability',
- type: 'custom',
- buttons: [
- {
- id: 'saveButton',
- text: (cap ? 'Update' : 'Create'),
- size: "'x-small'",
- callback: () => this.createOrUpdateCapability(),
- closeModal: true
- },
- {text: "Cancel", size: "'x-small'", closeModal: true}]
- };
- let modalInputs = {
- capability: cap,
- capabilityTypesList: this.$scope.capabilityTypesList,
- isReadonly: this.$scope.isViewMode() || !this.$scope.isDesigner(),
- validityChangedCallback: this.getDisabled
- };
-
- this.ModalServiceSdcUI.openCustomModal(modalConfig, CapabilitiesEditorComponent, {input: modalInputs});
- }
-
- getDisabled = (shouldEnable: boolean): void => {
- let saveButton: ModalButtonComponent = this.ModalServiceSdcUI.getCurrentInstance().getButtonById('saveButton');
- saveButton.disabled = this.$scope.isViewMode() || !this.$scope.isDesigner() || !shouldEnable;
- };
-
- private createOrUpdateRequirement() {
- let requirement = this.ModalServiceSdcUI.getCurrentInstance().innerModalContent.instance.requirementData;
- this.$scope.isLoading = true;
- if (!requirement.uniqueId) {
- this.ComponentServiceNg2.createRequirement(this.$scope.component, requirement).subscribe(result => {
- this.$scope.requirements.unshift(new RequirementUI(result[0], this.$scope.component.uniqueId));
- this.$scope.isLoading = false;
- }, () => {
- this.$scope.isLoading = false;
- });
- }
- else {
- this.ComponentServiceNg2.updateRequirement(this.$scope.component, requirement).subscribe(result => {
- let index = this.$scope.requirements.findIndex(req => result[0].uniqueId === req.uniqueId);
- this.$scope.requirements[index] = new RequirementUI(result[0], this.$scope.component.uniqueId);
- this.$scope.isLoading = false;
- this.$scope.$apply();
- }, () => {
- this.$scope.isLoading = false;
- });
- }
- }
-
- private createOrUpdateCapability() {
- let capability = this.ModalServiceSdcUI.getCurrentInstance().innerModalContent.instance.capabilityData;
- this.$scope.isLoading = true;
- if (!capability.uniqueId) {
- this.ComponentServiceNg2.createCapability(this.$scope.component, capability).subscribe(result => {
- this.$scope.capabilities.unshift(new CapabilityUI(result[0], this.$scope.component.uniqueId));
- this.$scope.isLoading = false;
- }, () => {
- this.$scope.isLoading = false;
- });
- }
- else {
- this.ComponentServiceNg2.updateCapability(this.$scope.component, capability).subscribe(result => {
- let index = this.$scope.capabilities.findIndex(cap => result[0].uniqueId === cap.uniqueId);
- this.$scope.capabilities[index] = new CapabilityUI(result[0], this.$scope.component.uniqueId);
- this.$scope.isLoading = false;
- this.$scope.$apply();
- }, () => {
- this.$scope.isLoading = false;
- });
- }
- }
-
- private deleteRequirement(req) {
- this.$scope.isLoading = true;
- this.ComponentServiceNg2.deleteRequirement(this.$scope.component, req.uniqueId).subscribe(() => {
- this.ComponentServiceNg2.getCapabilitiesAndRequirements(this.$scope.componentType, this.$scope.component.uniqueId).subscribe(response => {
- this.$scope.component.requirements = response.requirements;
- this.initScope('requirements');
- this.$scope.isLoading = false;
- }, () => {
- this.$scope.isLoading = false;
- });
- }, () => {
- this.$scope.isLoading = false;
- });
- }
-
- private deleteCapability(cap) {
- this.$scope.isLoading = true;
- this.ComponentServiceNg2.deleteCapability(this.$scope.component, cap.uniqueId).subscribe(() => {
- this.ComponentServiceNg2.getCapabilitiesAndRequirements(this.$scope.componentType, this.$scope.component.uniqueId).subscribe(response => {
- this.$scope.component.capabilities = response.capabilities;
- this.initScope('capabilities');
- this.$scope.isLoading = false;
- }, () => {
- this.$scope.isLoading = false;
- });
- }, () => {
- this.$scope.isLoading = false;
- });
- }
-}
-
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-view.html b/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-view.html
deleted file mode 100644
index c661afe0ba..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities-view.html
+++ /dev/null
@@ -1,159 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<div class="workspace-req-and-cap">
- <div class="tabs">
- <button data-tests-id="req-tab" data-ng-click="mode='requirements';filterTerms='';" class="tlv-btn" data-ng-class="{'selected':mode=='requirements'}">Requirements({{requirements.length||'0'}})</button>
- <button data-tests-id="cap-tab" data-ng-click="mode='capabilities';filterTerms='';" class="tlv-btn" data-ng-class="{'selected':mode=='capabilities'}">Capabilities({{capabilities.length||'0'}})</button>
- </div>
- <div class="expand-collapse-buttons" data-ng-if="mode=='capabilities'">
- <span class="sprite-new expand-all" data-ng-click="allCapabilitiesSelected(true)"></span>
- <span class="sprite-new collapse-all" data-ng-click="allCapabilitiesSelected(false)"></span>
- </div>
- <div class="search">
- <input id="search-box" data-tests-id="search-box" type="search" placeholder="Search" data-ng-model-options="{debounce: 200}" data-ng-model="filterTerms"/>
- <div class="search-icon-container">
- <span class="search-icon sprite-new search-white-icon"></span>
- </div>
- </div>
- <div class="table-container-flex requirements-table" data-ng-if="mode=='requirements'">
- <div class="table" data-ng-class="{'view-mode': isViewMode()}">
- <div class="head flex-container">
- <div class="table-header head-row hand flex-item" data-ng-repeat="header in requirementsTableHeadersList track by $index" data-ng-click="sort(header.property, requirementsSortTableDefined)">{{header.title}}
- <span data-ng-if="requirementsSortTableDefined.sortByField === header.property" class="table-header-sort-arrow" data-ng-class="{'down': requirementsSortTableDefined.reverse, 'up':!requirementsSortTableDefined.reverse}"> </span>
- </div>
- </div>
-
- <div class="body">
- <perfect-scrollbar scroll-y-margin-offset="0" include-padding="true" class="scrollbar-container">
- <div data-ng-if="requirements.length === 0" class="no-row-text">
- There are no requirements to display
-
- </div>
- <div data-ng-repeat="req in requirements | orderBy:requirementsSortTableDefined.sortByField:requirementsSortTableDefined.reverse | filter: {filterTerm:filterTerms} track by $index"
- class="flex-container data-row" data-tests-id="reqRow">
-
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{req.name}}">
- <span data-tests-id="{{req.name}}">{{req.name}}</span>
- </div>
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{req.capability}}">
- <span data-tests-id="{{req.capability}}">{{req.capability.substring("tosca.capabilities.".length)}}</span>
- </div>
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{req.node}}">
- <span data-tests-id="{{req.node}}">{{req.node.substring("tosca.nodes.".length)}}</span>
- </div>
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{req.relationship}}">
- <span data-tests-id="{{req.relationship}}">{{req.relationship.substring("tosca.relationships.".length)}}</span>
- </div>
- <div class="table-col-general flex-item text" data-tests-id="{{}}" data-ng-bind=""></div>
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{req.minOccurrences}},{{req.maxOccurrences}}">
- <span data-tests-id="{{req.minOccurrences}},{{req.maxOccurrences}}">{{req.minOccurrences}},{{req.maxOccurrences}}</span>
- </div>
- </div>
- </perfect-scrollbar>
- </div>
-
- </div>
- </div>
- <div class="table-container-flex capabilities-table" data-ng-if="mode=='capabilities'">
- <div class="table" data-ng-class="{'view-mode': isViewMode()}">
- <div class="head flex-container">
- <div class="table-header head-row hand flex-item" data-ng-repeat="header in capabilitiesTableHeadersList track by $index" data-ng-click="sort(header.property, capabilitiesSortTableDefined)">{{header.title}}
- <span data-ng-if="capabilitiesSortTableDefined.sortByField === header.property" class="table-header-sort-arrow" data-ng-class="{'down': capabilitiesSortTableDefined.reverse, 'up':!capabilitiesSortTableDefined.reverse}"> </span>
- </div>
- </div>
-
- <div class="body">
- <perfect-scrollbar scroll-y-margin-offset="0" include-padding="true" class="scrollbar-container">
- <div data-ng-if="capabilities.length === 0" class="no-row-text">
- There are no capabilities to display
-
- </div>
- <div data-ng-repeat-start="capability in capabilities | orderBy:capabilitiesSortTableDefined.sortByField:capabilitiesSortTableDefined.reverse | filter: {filterTerm:filterTerms} track by $index"
- class="flex-container data-row" data-ng-class="{'selected': capability.selected}"
- data-ng-click="capability.selected = !capability.selected" data-tests-id="capabilities-table-row">
-
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{capability.name}}">
- <span class="sprite-new arrow-up-small" data-ng-class="{'opened': capability.selected}"></span>
- <span data-tests-id="{{capability.name}}">{{capability.name}}</span>
- </div>
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{capability.type}}">
- <span data-tests-id="{{capability.type}}">{{capability.type.replace("tosca.capabilities.","")}}</span>
- </div>
-
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{capability.description}}">
- <span data-tests-id="{{capability.description}}">{{capability.description}}</span>
- </div>
-
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{capability.validSourceTypes.join(',')}}">
- <span data-tests-id="{{capability.validSourceTypes.join(',')}}">{{capability.validSourceTypes.join(',')}}</span>
- </div>
-
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{capability.minOccurrences}},{{capability.maxOccurrences}}">
- <span data-tests-id="{{capability.minOccurrences}},{{capability.maxOccurrences}}">{{capability.minOccurrences}},{{capability.maxOccurrences}}</span>
- </div>
- </div>
- <div data-ng-repeat-end="" data-ng-if="capability.selected" class="item-opened">
- <p class="properties-title">Properties</p>
- <div class="table-container-flex properties-table">
- <div class="table" data-ng-class="{'view-mode': isViewMode()}">
- <div class="head flex-container">
- <div class="table-header head-row hand flex-item" data-ng-repeat="header in capabilityPropertiesTableHeadersList track by $index" data-ng-click="sort(header.property, propertiesSortTableDefined)">{{header.title}}
- <span data-ng-if="propertiesSortTableDefined.sortByField === header.property" class="table-header-sort-arrow" data-ng-class="{'down': propertiesSortTableDefined.reverse, 'up':!propertiesSortTableDefined.reverse}"> </span>
- </div>
- </div>
-
- <div class="body">
- <div data-ng-if="capability.properties.length === 0" class="no-row-text">
- There are no properties to display
- </div>
- <div data-ng-repeat="property in filteredProperties[$parent.$index]=(capability.properties | orderBy:propertiesSortTableDefined.sortByField:propertiesSortTableDefined.reverse) track by $index"
- data-tests-id="propertyRow"
- class="flex-container data-row">
-
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{property.name}}">
- <a data-tests-id="{{property.name}}"
- data-ng-click="updateProperty(property, $parent.$index); $event.stopPropagation();"
- data-ng-class="{'disabled': isViewMode()}">{{property.name}}</a>
-
- </div>
-
- <div class="table-col-general flex-item text"
- data-tests-id="{{property.type}}"
- tooltips tooltip-content="{{property.type}}"
- data-ng-bind="property.type">
- </div>
- <div class="table-col-general flex-item text"
- data-tests-id="{{property.schema.property.type}}"
- tooltips tooltip-content="{{property.schema.property.type}}"
- data-ng-bind="property.schema.property.type">
- </div>
- <div class="table-col-general flex-item text" tooltips tooltip-content="{{property.description}}">
- <span data-tests-id="{{property.description}}" data-ng-bind="property.description"></span>
- </div>
- </div>
- </div>
-
- </div>
- </div>
- </div>
- </perfect-scrollbar>
- </div>
-
- </div>
- </div>
-</div>
-
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities.less b/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities.less
deleted file mode 100644
index 928f6719c6..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/req-and-capabilities/req-and-capabilities.less
+++ /dev/null
@@ -1,418 +0,0 @@
-.workspace-req-and-cap {
-
- width: 93%;
- display: inline-block;
-
- .tabs{
- float: left;
- position: relative;
- top: 6px;
- button{
- float: left;
- width: 233px;
- height: 38px;
- background-color: @tlv_color_t;
- border: 1px solid @main_color_o;
- color: black;
- &:nth-child(1){
- border-radius: 10px 0 0 0;
- }
- &:nth-child(2){
- border-radius: 0 10px 0 0;
- }
- &.selected{
- background-color: @main_color_a;
- border: 1px solid @main_color_a;
- color: white;
- }
- }
- }
- .search{
- margin-bottom: 12px;
- float: right;
- ::-webkit-input-placeholder {
- font-style: italic;
- }
- :-moz-placeholder {
- font-style: italic;
- }
- ::-moz-placeholder {
- font-style: italic;
- }
- :-ms-input-placeholder {
- font-style: italic;
- }
- #search-box{
- -webkit-border-radius: 2px 0 0 2px;
- -moz-border-radius: 2px 0 0 2px;
- border-radius: 2px 0 0 2px;
- width: 213px;
- height: 32px;
- line-height: 32px;
- border: 1px solid @main_color_o;
- text-indent: 10px;
- float: left;
- }
- .search-icon-container{
- background-color: @main_color_a;
- height: 32px;
- width: 32px;
- border-radius: 0 2px 2px 0;
- float: left;
- .search-icon{
- position: relative;
- top: 9px;
- }
- }
- }
- .add-button {
- color: @main_color_a;
- }
- .add-button, .expand-collapse-buttons {
- float: right;
- margin-left: 11px;
- margin-top: 10px;
- &, span {
- .hand;
- }
- }
-
-
-
- .table{
- height:490px;
- margin-bottom: 0;
- }
-
- .arrow-up-small{
- &.opened{
- .arrow-up-small-hover;
- }
- }
-
- .item-opened{
- background-color: @tlv_color_t;
- }
-
- .properties-title{
- margin:0;
- font-weight: bold;
- }
-
- .table-container-flex {
- margin-top: 10px;
-
- .text{
- overflow: hidden;
- text-overflow: ellipsis;
- display: inline-block;
- white-space: nowrap;
- }
-
- .editable-table-data {
- max-height: 430px;
- }
-
- .data-row {
- &:not(.editable-row) {
- background: @tlv_color_t;
- color: @main_color_n;
- }
- &.editable-row {
- cursor: pointer;
- }
- .sprite-new.delete-icon {
- visibility: hidden;
- }
- &:hover {
- .sprite-new.delete-icon {
- visibility: visible;
- }
- }
- }
-
- &.requirements-table{
- border-top: 4px solid @main_color_a;
- .flex-item:nth-child(1) {
- flex-grow: 20;
- }
-
- .flex-item:nth-child(2) {
- flex-grow: 20;
- }
-
- .flex-item:nth-child(3) {
- flex-grow: 20;
- }
-
- .flex-item:nth-child(4) {
- flex-grow: 20;
- }
-
- .flex-item:nth-child(5) {
- flex-grow: 20;
- }
-
- .flex-item:nth-child(6) {
- flex-grow: 20;
- }
- }
-
- &.capabilities-table{
- border-top: 4px solid @main_color_a;
- .selected{
- .flex-item:nth-child(1) {
- border-left: 4px solid @main_color_a;
- padding-right: 11px;
- }
- }
- .flex-item:nth-child(1) {
- flex-grow: 10;
- }
-
- .flex-item:nth-child(2) {
- flex-grow: 10;
- }
-
- .flex-item:nth-child(3) {
- flex-grow: 10;
- }
-
- .flex-item:nth-child(4) {
- flex-grow: 10;
- }
-
- .flex-item:nth-child(5) {
- flex-grow: 10;
- }
-
- }
-
- &.properties-table{
- .table{
- height: auto;
- }
-
- .flex-item:nth-child(1) {
- flex-grow: 15;
- a{
- .hand
- }
- }
-
- .flex-item:nth-child(2) {
- flex-grow: 6;
- }
-
- .flex-item:nth-child(3) {
- flex-grow: 6;
- }
-
- .flex-item:nth-child(4) {
- flex-grow: 20;
-
- }
- }
-
- }
-
-}
-
-.workspace-req-and-cap-editable {
- .tabs-header {
- display: flex;
- justify-content: space-between;
- border-bottom: 1px solid @main_color_o;
- .req-and-cap-tabs {
- display: flex;
- .tab {
- font-family: @font-opensans-regular;
- font-size: 22px;
- padding: 5px;
- .hand;
- &:first-of-type {
- margin-right: 35px;
- }
- &.selected {
- color: @main_color_a;
- border-bottom: 2px solid @main_color_a;
- }
- }
- }
- .buttons-in-right {
- display: flex;
- .search {
- display: flex;
- height: min-content;
- margin-top: 10px;
- padding-right: 11px;
- border-right: 1px solid @main_color_o;
- #search-box {
- border: none;
- border-bottom: 1px solid @main_color_o;
- text-indent: 10px;
- &:focus {
- outline: none;
- }
- }
- .search-icon-container {
- margin-top: 3px;
- padding-top: 4px;
- }
-
- }
- .add-button-icon-and-label {
- font-size: 14px;
- margin-left: 11px;
- margin-top: 10px;
- padding-top: 5px;
- /deep/ svg-icon {
- vertical-align: bottom;
- }
- &:hover {
- &:not(.disabled) {
- cursor: pointer;
- color: @sdcui_color_light-blue;
- }
- }
- }
- }
- }
- .add-button-icon-and-label {
- .icon-label-txt {
- text-transform: uppercase;
- font-family: @font-opensans-medium;
- color: @main_color_a;
- &:hover {
- &:not(.disabled) {
- color: @sdcui_color_light-blue;
- }
- }
- }
- }
- .empty-list-container {
- width: 100%;
- display: flex;
- justify-content: center;
-
- .empty-list-add-btn {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- border: 1px solid @main_color_o;
- margin-top: 50px;
- height: 229px;
- width: 480px;
- &.disabled {
- pointer-events: none;
- }
- &:hover {
- &:not(.disabled) {
- border: 1px solid @main_color_a;
- cursor: pointer;
- }
- }
- .icon-label-txt {
- margin-top: 15px;
- font-size: 16px;
- }
- }
- }
- .table-container-flex .table {
- .head .head-row {
- text-align: left;
- &.description {
- flex: 2;
- }
- &.other {
- flex: 0.25;
- text-align: center;
- }
- &.occurrences {
- flex: 0.75;
- }
- }
- .body .data-row {
- border-bottom: none;
- border-top: @main_color_o solid 1px;
- .ellipsis-text {
- overflow: hidden;
- text-overflow: ellipsis;
- }
- &:not(.editable-row) {
- background-color: @tlv_color_t;
- cursor: default;
- color: @main_color_n;
- }
- &.editable-row {
- cursor: pointer;
- .table-col-general:hover {
- color: @main_color_b;
- }
- }
- &.selected {
- background-color: @tlv_color_v;
- .name-col {
- color: @main_color_a;
- }
- .sprite-new.arrow-up-small {
- background-position: -858px -137px;
- margin-bottom: 2px;
- }
- }
- .description-col {
- flex: 2;
- }
- .occurrences-col {
- flex: 0.75;
- }
- .other-col {
- display: flex;
- justify-content: center;
- align-items: center;
- flex: 0.25;
- .trash-icon {
- visibility: hidden;
- }
- }
- &:hover {
- .trash-icon {
- visibility: visible;
- }
- }
- .multiline-ellipsis {
- line-height: 1.5em;
- padding: 1px 0 1px 0;
- /deep/ .ellipsis-directive-more-less {
- float: none;
- margin-left: 5px;
- color: @main_color_a;
- }
- }
- }
- }
-
- .item-opened.properties-section {
- border: 4px solid @tlv_color_v !important;
- max-height: 263px;
- overflow: auto;
- .properties-title {
- .s_10;
- margin-top: 10px;
- }
- .properties-table {
- &.table-container-flex {
- margin-top: 18px;
- }
- .table {
- .head {
- border-bottom: 1px solid @main_color_o;
- }
- .head, .table-col-general {
- background-color: @main_color_p;
- }
- }
- }
- }
-} \ No newline at end of file
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts-view-model.ts b/catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts-view-model.ts
deleted file mode 100644
index a1f8152cea..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts-view-model.ts
+++ /dev/null
@@ -1,105 +0,0 @@
-/*-
- * ============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=========================================================
- */
-
-'use strict';
-import * as _ from "lodash";
-import {ArtifactModel, IFileDownload} from "app/models";
-import {IWorkspaceViewModelScope} from "app/view-models/workspace/workspace-view-model";
-import {ComponentGenericResponse} from "../../../../ng2/services/responses/component-generic-response";
-import {ComponentServiceNg2} from "../../../../ng2/services/component-services/component.service";
-
-export interface IToscaArtifactsScope extends IWorkspaceViewModelScope {
- artifacts:Array<ArtifactModel>;
- tableHeadersList:Array<any>;
- artifactType:string;
- downloadFile:IFileDownload;
- isLoading:boolean;
- sortBy:string;
- reverse:boolean;
-
- getTitle():string;
- download(artifact:ArtifactModel):void;
- sort(sortBy:string):void;
- showNoArtifactMessage():boolean;
-}
-
-export class ToscaArtifactsViewModel {
-
- static '$inject' = [
- '$scope',
- '$filter',
- 'ComponentServiceNg2'
- ];
-
- constructor(private $scope:IToscaArtifactsScope,
- private $filter:ng.IFilterService,
- private ComponentServiceNg2:ComponentServiceNg2) {
- this.initToscaArtifacts();
- }
-
- private initToscaArtifacts = (): void => {
-
- if(!this.$scope.component.toscaArtifacts) {
- this.$scope.isLoading = true;
- this.ComponentServiceNg2.getComponentToscaArtifacts(this.$scope.component).subscribe((response:ComponentGenericResponse) => {
- this.$scope.component.toscaArtifacts = response.toscaArtifacts;
- this.initScope();
- this.$scope.isLoading = false;
- }, () => {
- this.$scope.isLoading = false;
- });
- } else {
- this.initScope();
- }
- }
-
- private initScope = ():void => {
- this.$scope.isLoading = false;
- this.$scope.sortBy = 'artifactDisplayName';
- this.$scope.reverse = false;
- this.$scope.setValidState(true);
- this.$scope.artifactType = 'informational';
- this.$scope.getTitle = ():string => {
- return this.$filter("resourceName")(this.$scope.component.name) + ' Artifacts';
-
- };
-
- this.$scope.tableHeadersList = [
- {title: 'Name', property: 'artifactDisplayName'},
- {title: 'Type', property: 'artifactType'},
- {title: 'Version', property: 'artifactVersion'}
- ];
-
- this.$scope.artifacts = <ArtifactModel[]>_.values(this.$scope.component.toscaArtifacts);
- this.$scope.sort = (sortBy:string):void => {
- this.$scope.reverse = (this.$scope.sortBy === sortBy) ? !this.$scope.reverse : false;
- this.$scope.sortBy = sortBy;
- };
-
-
- this.$scope.showNoArtifactMessage = ():boolean => {
- if (this.$scope.artifacts.length === 0) {
- return true;
- }
- return false;
- };
-
- }
-}
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts-view.html b/catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts-view.html
deleted file mode 100644
index b354e7a544..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts-view.html
+++ /dev/null
@@ -1,65 +0,0 @@
-<!--
- ~ Copyright (C) 2018 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.
--->
-
-<div class="workspace-tosca-artifact">
- <div class="table-container-flex">
- <div class="table" data-ng-class="{'view-mode': isViewMode()}">
- <div class="head flex-container">
- <div class="table-header head-row hand flex-item" ng-repeat="header in tableHeadersList track by $index" data-ng-click="sort(header.property)">{{header.title}}
- <span data-ng-show="sortBy === header.property" class="table-header-sort-arrow" data-ng-class="{'down': reverse, 'up':!reverse}"> </span>
- </div>
- <div class="table-no-text-header head-row flex-item"></div>
- </div>
- <div class="body">
- <perfect-scrollbar suppress-scroll-x="true" scroll-y-margin-offset="0" include-padding="true" class="scrollbar-container">
- <div data-ng-if="showNoArtifactMessage()" class="no-row-text" data-ng-class="{'disabled': isDisableMode()}">
- There are no TOSCA artifacts to display
- </div>
- <div data-ng-repeat-start="artifact in artifacts| orderBy:sortBy:reverse track by $index"
- class="flex-container data-row" data-tests-id="{{artifact.artifactDisplayName}}"
- data-ng-class="{'selected': artifact.selected}">
-
- <div class="table-col-general flex-item" data-ng-click="artifact.selected = !artifact.selected" data-tests-id="name-{{$index}}">
- <span class="sprite table-arrow" data-ng-class="{'opened': artifact.selected}"></span>
- {{artifact.artifactDisplayName}}
- </div>
-
- <div class="table-col-general flex-item" data-ng-click="artifact.selected = !artifact.selected" data-tests-id="type-{{$index}}">
- {{artifact.artifactType}}
- </div>
-
- <div class="table-col-general flex-item" data-ng-click="artifact.selected = !artifact.selected" data-tests-id="version-{{$index}}">
- {{artifact.artifactVersion}}
- </div>
-
- <div class="table-btn-col flex-item download-icon-container">
- <button class="table-download-btn tosca" download-artifact data-tests-id="download-{{artifact.artifactDisplayName}}"
- data-ng-if="artifact.artifactName" component="component" artifact="artifact" show-loader="true"></button>
- </div>
- </div>
- <div data-ng-repeat-end="" data-ng-if="artifact.selected" class="item-opened" data-tests-id="details-{{$index}}">
- <div><span class="details-title">Label:</span> {{artifact.artifactLabel}}</div>
- <div><span class="details-title">UUID:</span> {{artifact.artifactUUID}}</div>
- <div><span class="details-title">Description:</span> {{artifact.description}}</div>
-
-
- </div>
-
- </perfect-scrollbar>
- </div>
- </div>
- </div>
-</div>
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts.less b/catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts.less
deleted file mode 100644
index 23be3c3548..0000000000
--- a/catalog-ui/src/app/view-models/workspace/tabs/tosca-artifacts/tosca-artifacts.less
+++ /dev/null
@@ -1,77 +0,0 @@
-.workspace-tosca-artifact {
- width: 100%;
- display: inline-block;
- .w-sdc-classic-btn {
- float: right;
- margin-bottom: 10px;
- }
-
- .details-title{
- font-weight: bold;
- margin-right: 5px;
- }
-
- .table{
- height: 490px;
- margin-bottom: 0;
- }
-
-
- .table-container-flex {
- margin-top: 0;
- .item-opened{
- word-wrap: break-word;
- }
-
-
- .flex-item:nth-child(1) {
- flex-grow: 15;
- .hand;
- span.table-arrow {
- margin-right: 7px;
- }
- }
-
- .flex-item:nth-child(2) {
- flex-grow: 6;
- }
-
- .flex-item:nth-child(3) {
- flex-grow: 1;
- }
-
- .flex-item:nth-child(4) {
- flex-grow: 1;
- }
-
-
-
-
- .table-download-btn{
- &.tosca{
- margin-left: 0;
- margin-top: 8px;
- }
- }
-
- .download-icon-container{
- position: relative;
-
- .loader{
- left: 60%;
- top: 45px;
- border: none;
- background-color: transparent;
- height: 0px;
- width: 63px;
- outline: none;
-
- }
- }
-
-
- }
-
-}
-
-
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 f4bbed2c96..11667283b2 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
@@ -22,103 +22,110 @@
* Created by obarda on 3/30/2016.
*/
'use strict';
-import * as _ from "lodash";
+import * as _ from 'lodash';
import {
- IUserProperties, IAppMenu, Resource, Component, Plugin, PluginsConfiguration, PluginDisplayOptions,
- RelationshipTypeModel, NodeTypeModel, CapabilityTypeModel
-} from "app/models";
+ IUserProperties,
+ IAppMenu,
+ Resource,
+ Component,
+ Plugin,
+ PluginsConfiguration,
+ PluginDisplayOptions
+} from 'app/models';
import {
- WorkspaceMode, ComponentFactory, ChangeLifecycleStateHandler, Role, ComponentState, MenuItemGroup, MenuHandler,
- MenuItem, ModalsHandler, States, EVENTS, CHANGE_COMPONENT_CSAR_VERSION_FLAG, ResourceType, PREVIOUS_CSAR_COMPONENT
-} from "app/utils";
+ MenuItem, ModalsHandler, States, EVENTS, CHANGE_COMPONENT_CSAR_VERSION_FLAG, ResourceType, PREVIOUS_CSAR_COMPONENT,
+ WorkspaceMode, ComponentFactory, ChangeLifecycleStateHandler, Role, ComponentState, MenuItemGroup, MenuHandler
+} from 'app/utils';
import {
EventListenerService,
- EntityService,
- ProgressService,
- CacheService,
- LeftPaletteLoaderService
-} from "app/services";
-import {FileUploadModel} from "../../directives/file-upload/file-upload";
-import {AutomatedUpgradeService} from "../../ng2/pages/automated-upgrade/automated-upgrade.service";
-import {ComponentServiceNg2} from "../../ng2/services/component-services/component.service";
-import {EventBusService} from "../../ng2/services/event-bus.service";
-import {PluginsService} from "../../ng2/services/plugins.service";
-import {IDependenciesServerResponse} from "../../ng2/services/responses/dependencies-server-response";
+ LeftPaletteLoaderService,
+ ProgressService
+} from 'app/services';
+import {
+ CacheService
+} from 'app/services-ng2';
+import { AutomatedUpgradeService } from '../../ng2/pages/automated-upgrade/automated-upgrade.service';
+import { CatalogService } from '../../ng2/services/catalog.service';
+import { ComponentServiceNg2 } from '../../ng2/services/component-services/component.service';
+import { EventBusService } from '../../ng2/services/event-bus.service';
+import { HomeService } from '../../ng2/services/home.service';
+import { PluginsService } from '../../ng2/services/plugins.service';
+import { IDependenciesServerResponse } from '../../ng2/services/responses/dependencies-server-response';
+import { WorkspaceNg1BridgeService } from '../../ng2/pages/workspace/workspace-ng1-bridge-service';
+import { WorkspaceService } from '../../ng2/pages/workspace/workspace.service';
export interface IWorkspaceViewModelScope extends ng.IScope {
- isLoading:boolean;
- isCreateProgress:boolean;
- component:Component;
- originComponent:Component;
- componentType:string;
- importFile:any;
- leftBarTabs:MenuItemGroup;
- isNew:boolean;
- isFromImport:boolean;
- isValidForm:boolean;
- isActiveTopBar:boolean;
- mode:WorkspaceMode;
- breadcrumbsModel:Array<MenuItemGroup>;
- sdcMenu:IAppMenu;
- changeLifecycleStateButtons:any;
- version:string;
- versionsList:Array<any>;
- changeVersion:any;
- isComposition:boolean;
- isDeployment:boolean;
- isPlugins:boolean;
- $state:ng.ui.IStateService;
- user:IUserProperties;
- thirdParty:boolean;
- disabledButtons:boolean;
- menuComponentTitle:string;
- progressService:ProgressService;
- progressMessage:string;
+ isLoading: boolean;
+ isCreateProgress: boolean;
+ component: Component;
+ originComponent: Component;
+ componentType: string;
+ importFile: any;
+ leftBarTabs: MenuItemGroup;
+ isNew: boolean;
+ isFromImport: boolean;
+ isValidForm: boolean;
+ isActiveTopBar: boolean;
+ mode: WorkspaceMode;
+ breadcrumbsModel: Array<MenuItemGroup>;
+ sdcMenu: IAppMenu;
+ changeLifecycleStateButtons: any;
+ version: string;
+ versionsList: Array<any>;
+ changeVersion: any;
+ isComposition: boolean;
+ isDeployment: boolean;
+ isPlugins: boolean;
+ $state: ng.ui.IStateService;
+ user: IUserProperties;
+ thirdParty: boolean;
+ disabledButtons: boolean;
+ menuComponentTitle: string;
+ progressService: ProgressService;
+ progressMessage: string;
ComponentServiceNg2: ComponentServiceNg2;
// leftPanelComponents:Array<Models.Components.Component>; //this is in order to load the left panel once, and not wait long time when moving to composition
- unsavedChanges:boolean;
- unsavedChangesCallback:Function;
- unsavedFile:boolean;
- capabilityTypesList: Array<CapabilityTypeModel>;
- relationshipTypesList: Array<RelationshipTypeModel>;
- nodeTypesList: Array<NodeTypeModel>;
-
-
- startProgress(message:string):void;
- stopProgress():void;
- updateBreadcrumbs(component:Component):void;
- updateUnsavedFileFlag(isUnsaved:boolean):void;
- showChangeStateButton():boolean;
- getComponent():Component;
- setComponent(component:Component):void;
- setOriginComponent(component:Component):void;
- onMenuItemPressed(state:string, params:any):ng.IPromise<boolean>;
- create():void;
- save():Promise<void>;
- setValidState(isValid:boolean):void;
- changeLifecycleState(state:string):void;
- handleChangeLifecycleState(state:string, newCsarVersion?:string):void;
- disableMenuItems():void;
- enableMenuItems():void;
- isDesigner():boolean;
- isViewMode():boolean;
- isEditMode():boolean;
- isCreateMode():boolean;
- isDisableMode():boolean;
- isGeneralView():boolean;
- goToBreadcrumbHome():void;
- onVersionChanged(selectedId:string):void;
- getLatestVersion():void;
- getStatus():string;
- showLifecycleIcon():boolean;
- updateSelectedMenuItem(state:string):void;
- isSelected(menuItem:MenuItem):boolean;
- uploadFileChangedInGeneralTab():void;
- updateMenuComponentName(ComponentName:string):void;
- getTabTitle():string;
- reload(component:Component):void;
+ unsavedChanges: boolean;
+ unsavedChangesCallback: Function;
+ unsavedFile: boolean;
+ hasNoDependencies: boolean;
+
+
+ startProgress(message: string): void;
+ stopProgress(): void;
+ updateBreadcrumbs(component: Component): void;
+ updateUnsavedFileFlag(isUnsaved: boolean): void;
+ showChangeStateButton(): boolean;
+ getComponent(): Component;
+ setComponent(component: Component): void;
+ setOriginComponent(component: Component): void;
+ onMenuItemPressed(state: string, params: any): ng.IPromise<boolean>;
+ create(): void;
+ save(): Promise<void>;
+ setValidState(isValid: boolean): void;
+ changeLifecycleState(state: string): void;
+ handleChangeLifecycleState(state: string, newCsarVersion?: string, errorFunction?: Function): void;
+ disableMenuItems(): void;
+ enableMenuItems(): void;
+ isDesigner(): boolean;
+ isViewMode(): boolean;
+ isEditMode(): boolean;
+ isCreateMode(): boolean;
+ isDisableMode(): boolean;
+ isGeneralView(): boolean;
+ goToBreadcrumbHome(): void;
+ onVersionChanged(selectedId: string): void;
+ getLatestVersion(): void;
+ getStatus(): string;
+ showLifecycleIcon(): boolean;
+ updateSelectedMenuItem(state: string): void;
+ isSelected(menuItem: MenuItem): boolean;
+ uploadFileChangedInGeneralTab(): void;
+ updateMenuComponentName(ComponentName: string): void;
+ getTabTitle(): string;
+ reload(component: Component): void;
}
export class WorkspaceViewModel {
@@ -133,53 +140,55 @@ export class WorkspaceViewModel {
'MenuHandler',
'Sdc.Services.CacheService',
'ChangeLifecycleStateHandler',
- 'ModalsHandler',
'LeftPaletteLoaderService',
'$filter',
'EventListenerService',
- 'Sdc.Services.EntityService',
'Notification',
'$stateParams',
+ 'HomeService',
+ 'CatalogService',
'Sdc.Services.ProgressService',
'ComponentServiceNg2',
'AutomatedUpgradeService',
'EventBusService',
- 'PluginsService'
+ 'PluginsService',
+ 'WorkspaceNg1BridgeService',
+ 'workspaceService'
];
- constructor(private $scope:IWorkspaceViewModelScope,
- private injectComponent:Component,
- private ComponentFactory:ComponentFactory,
- private $state:ng.ui.IStateService,
- private sdcMenu:IAppMenu,
- private $q:ng.IQService,
- private MenuHandler:MenuHandler,
- private cacheService:CacheService,
- private ChangeLifecycleStateHandler:ChangeLifecycleStateHandler,
- private ModalsHandler:ModalsHandler,
- private LeftPaletteLoaderService:LeftPaletteLoaderService,
- private $filter:ng.IFilterService,
- private EventListenerService:EventListenerService,
- private EntityService:EntityService,
- private Notification:any,
- private $stateParams:any,
- private progressService:ProgressService,
- private ComponentServiceNg2:ComponentServiceNg2,
- private AutomatedUpgradeService:AutomatedUpgradeService,
- private eventBusService:EventBusService,
- private pluginsService:PluginsService) {
-
-
-
- this.initScope();
- this.initAfterScope();
- this.$scope.updateSelectedMenuItem(this.$state.current.name);
+ constructor(private $scope: IWorkspaceViewModelScope,
+ private injectComponent: Component,
+ private ComponentFactory: ComponentFactory,
+ private $state: ng.ui.IStateService,
+ private sdcMenu: IAppMenu,
+ private $q: ng.IQService,
+ private MenuHandler: MenuHandler,
+ private cacheService: CacheService,
+ private ChangeLifecycleStateHandler: ChangeLifecycleStateHandler,
+ private LeftPaletteLoaderService: LeftPaletteLoaderService,
+ private $filter: ng.IFilterService,
+ private EventListenerService: EventListenerService,
+ private Notification: any,
+ private $stateParams: any,
+ private homeService: HomeService,
+ private catalogService: CatalogService,
+ private progressService: ProgressService,
+ private ComponentServiceNg2: ComponentServiceNg2,
+ private AutomatedUpgradeService: AutomatedUpgradeService,
+ private eventBusService: EventBusService,
+ private pluginsService: PluginsService,
+ private workspaceNg1BridgeService: WorkspaceNg1BridgeService,
+ private workspaceService: WorkspaceService) {
+
+ this.initScope();
+ // this.initAfterScope();
+ this.$scope.updateSelectedMenuItem(this.$state.current.name);
}
- private role:string;
- private category:string;
- private components:Array<Component>;
-
+ private role: string;
+ private category: string;
+ private components: Component[];
+
private initViewMode = ():WorkspaceMode => {
let mode = WorkspaceMode.VIEW;
@@ -187,35 +196,34 @@ export class WorkspaceViewModel {
mode = WorkspaceMode.CREATE;
} else {
if (this.$scope.component.lifecycleState === ComponentState.NOT_CERTIFIED_CHECKOUT &&
- this.$scope.component.lastUpdaterUserId === this.cacheService.get("user").userId) {
- if ((this.$scope.component.isService() || this.$scope.component.isResource()) && this.role == Role.DESIGNER) {
+ this.$scope.component.lastUpdaterUserId === this.cacheService.get('user').userId) {
+ if ((this.$scope.component.isService() || this.$scope.component.isResource()) && this.role === Role.DESIGNER) {
mode = WorkspaceMode.EDIT;
}
}
}
+ this.workspaceNg1BridgeService.updateIsViewOnly(mode === WorkspaceMode.VIEW);
return mode;
- };
+ }
- private initChangeLifecycleStateButtons = ():void => {
- let state = this.$scope.component.isService() && (Role.OPS == this.role || Role.GOVERNOR == this.role) ? this.$scope.component.distributionStatus : this.$scope.component.lifecycleState;
+ private initChangeLifecycleStateButtons = (): void => {
+ let state: string;
+ if (this.$scope.component.isService() && this.$scope.component.lifecycleState === 'CERTIFIED') {
+ state = this.$scope.component.distributionStatus;
+ } else {
+ state = this.$scope.component.lifecycleState;
+ }
this.$scope.changeLifecycleStateButtons = (this.sdcMenu.roles[this.role].changeLifecycleStateButtons[state] || [])[this.$scope.component.componentType.toUpperCase()];
+ }
- };
-
- private initLeftPalette = ():void => {
- //this.LeftPaletteLoaderService.loadLeftPanel(this.$scope.component);
- };
-
- private initScope = ():void => {
-
+ private initScope = (): void => {
this.$scope.component = this.injectComponent;
- //this.initLeftPalette();
this.$scope.menuComponentTitle = this.$scope.component.name;
this.$scope.disabledButtons = false;
this.$scope.originComponent = this.ComponentFactory.createComponent(this.$scope.component);
this.$scope.componentType = this.$scope.component.componentType;
this.$scope.version = this.cacheService.get('version');
- this.$scope.user = this.cacheService.get("user");
+ this.$scope.user = this.cacheService.get('user');
this.role = this.$scope.user.role;
this.category = this.$scope.component.selectedCategory;
this.$scope.mode = this.initViewMode();
@@ -229,10 +237,11 @@ export class WorkspaceViewModel {
this.$scope.progressService = this.progressService;
this.$scope.unsavedChanges = false;
- this.EventListenerService.registerObserverCallback(EVENTS.ON_WORKSPACE_UNSAVED_CHANGES, this.setWorkspaceButtonState);
- //this.EventListenerService.registerObserverCallback(EVENTS.ON_UPDATE_VSP_FILE, this.updateVspFlag);
+ this.$scope.hasNoDependencies = true;
+ this.verifyIfDependenciesExist();
- this.$scope.getComponent = ():Component => {
+ this.EventListenerService.registerObserverCallback(EVENTS.ON_WORKSPACE_UNSAVED_CHANGES, this.setWorkspaceButtonState);
+ this.$scope.getComponent = (): Component => {
return this.$scope.component;
};
@@ -261,17 +270,17 @@ export class WorkspaceViewModel {
this.$scope.archiveComponent = ():void => {
this.$scope.isLoading = true;
const typeComponent = this.$scope.component.componentType;
- this.ComponentServiceNg2.archiveComponent(typeComponent, this.$scope.component.uniqueId).subscribe(()=>{
+ this.ComponentServiceNg2.archiveComponent(typeComponent, this.$scope.component.uniqueId).subscribe(()=> {
this.$scope.isLoading = false;
- if(this.$state.params.previousState){
- switch(this.$state.params.previousState){
+ if (this.$state.params.previousState) {
+ switch (this.$state.params.previousState) {
case 'catalog':
case 'dashboard':
this.$state.go(this.$state.params.previousState);
break;
default:
break;
- }
+ }
}
this.$scope.component.archived = true;
this.deleteArchiveCache();
@@ -281,17 +290,17 @@ export class WorkspaceViewModel {
title: this.$filter('translate')("ARCHIVE_SUCCESS_MESSAGE_TITLE")
});
}, (error) => { this.$scope.isLoading = false; });
- }
+ }
this.$scope.restoreComponent = ():void => {
this.$scope.isLoading = true;
const typeComponent = this.$scope.component.componentType;
- this.ComponentServiceNg2.restoreComponent(typeComponent, this.$scope.component.uniqueId).subscribe(()=>{
+ this.ComponentServiceNg2.restoreComponent(typeComponent, this.$scope.component.uniqueId).subscribe(()=> {
this.$scope.isLoading = false;
this.Notification.success({
- message: this.$scope.component.name + ' ' + this.$filter('translate')("RESTORE_SUCCESS_MESSAGE_TEXT"),
- title: this.$filter('translate')("RESTORE_SUCCESS_MESSAGE_TITLE")
- });
+ message: this.$scope.component.name + ' ' + this.$filter('translate')("RESTORE_SUCCESS_MESSAGE_TEXT"),
+ title: this.$filter('translate')("RESTORE_SUCCESS_MESSAGE_TITLE")
+ });
});
this.$scope.component.archived = false;
this.deleteArchiveCache();
@@ -304,13 +313,13 @@ export class WorkspaceViewModel {
if(this.$scope.isValidForm){
this.$scope.save().then(() => {
this.$scope.onMenuItemPressed(toState.name, toParams);
- }, ()=> {
+ }, ()=> {
console.error("Save failed, unable to navigate to " + toState.name);
})
} else {
console.error("Form is invalid, unable to navigate to " + toState.name);
}
- }
+ }
}
});
@@ -384,7 +393,7 @@ export class WorkspaceViewModel {
};
this.$scope.create = () => {
-
+
this.$scope.startProgress("Creating Asset...");
_.first(this.$scope.leftBarTabs.menuItems).isDisabled = true;//disabled click on general tab (DE246274)
@@ -429,7 +438,7 @@ export class WorkspaceViewModel {
};
this.$scope.save = ():Promise<void> => {
-
+
this.EventListenerService.notifyObservers(EVENTS.ON_WORKSPACE_SAVE_BUTTON_CLICK);
this.$scope.startProgress("Updating Asset...");
@@ -445,6 +454,7 @@ export class WorkspaceViewModel {
let onFailed = () => {
stopProgressAndEnableUI();
+ this.$scope.updateUnsavedFileFlag(true);
this.EventListenerService.notifyObservers(EVENTS.ON_WORKSPACE_SAVE_BUTTON_ERROR);
reject();
@@ -459,7 +469,7 @@ export class WorkspaceViewModel {
});
this.$scope.updateBreadcrumbs(component);
-
+
//update the component
this.$scope.setComponent(component);
this.$scope.originComponent = this.ComponentFactory.createComponent(this.$scope.component);
@@ -467,13 +477,14 @@ export class WorkspaceViewModel {
if (this.cacheService.contains(CHANGE_COMPONENT_CSAR_VERSION_FLAG)) {
this.cacheService.remove(CHANGE_COMPONENT_CSAR_VERSION_FLAG);
}
- if (this.cacheService.contains(PREVIOUS_CSAR_COMPONENT)){
+ if (this.cacheService.contains(PREVIOUS_CSAR_COMPONENT)) {
this.cacheService.remove(PREVIOUS_CSAR_COMPONENT);
}
//clear edit flags
this.$state.current.data.unsavedChanges = false;
this.$scope.unsavedFile = false;
+ this.$scope.reload(component);
resolve();
};
@@ -497,35 +508,40 @@ export class WorkspaceViewModel {
this.$state.go('dashboard');
};
- this.$scope.handleChangeLifecycleState = (state:string, newCsarVersion?:string) => {
+ this.$scope.handleChangeLifecycleState = (state:string, newCsarVersion?:string, onError?: Function) => {
if ('monitor' === state) {
this.$state.go('workspace.distribution');
return;
}
let data = this.$scope.changeLifecycleStateButtons[state];
- let onSuccess = (component:Component, url:string):void => {
- //Updating the component from server response
-
+ if (!data && this.$stateParams.componentCsar && !this.$scope.isCreateMode()) {
+ data = {text: 'Check Out', url: 'lifecycleState/CHECKOUT'};
+ }
+ const onSuccess = (component, url:string):void => {
+ // Updating the component from server response
+
// Creating the data object to notify the plugins with
- let eventData: any = {
+ const eventData: any = {
uuid: this.$scope.component.uuid,
version: this.$scope.component.version
};
- //the server returns only metaData (small component) except checkout (Full component) ,so we update only the statuses of distribution & lifecycle
+ // the server returns only metaData (small component) except checkout (Full component) ,so we update only the statuses of distribution & lifecycle
this.$scope.component.lifecycleState = component.lifecycleState;
this.$scope.component.distributionStatus = component.distributionStatus;
switch (url) {
case 'lifecycleState/CHECKOUT':
+ this.workspaceNg1BridgeService.updateIsViewOnly(false);
this.eventBusService.notify("CHECK_OUT", eventData, false).subscribe(() => {
// only checkOut get the full component from server
// this.$scope.component = component;
// Work around to change the csar version
if(newCsarVersion) {
this.cacheService.set(CHANGE_COMPONENT_CSAR_VERSION_FLAG, newCsarVersion);
- }
+ (this.$scope.component as Resource).csarVersion = newCsarVersion;
+ }
//when checking out a minor version uuid remains
const bcIdx = _.findIndex(this.components, (item) => {
@@ -542,6 +558,7 @@ export class WorkspaceViewModel {
this.initVersionObject();
this.$scope.isLoading = false;
this.EventListenerService.notifyObservers(EVENTS.ON_CHECKOUT, component);
+ this.workspaceService.setComponentMetadata(component);
this.Notification.success({
message: this.$filter('translate')("CHECKOUT_SUCCESS_MESSAGE_TEXT"),
@@ -551,6 +568,7 @@ export class WorkspaceViewModel {
});
break;
case 'lifecycleState/CHECKIN':
+ this.workspaceNg1BridgeService.updateIsViewOnly(true);
defaultActionAfterChangeLifecycleState();
this.Notification.success({
message: this.$filter('translate')("CHECKIN_SUCCESS_MESSAGE_TEXT"),
@@ -566,77 +584,25 @@ export class WorkspaceViewModel {
});
});
break;
- case 'lifecycleState/certificationRequest':
- defaultActionAfterChangeLifecycleState();
- this.Notification.success({
- message: this.$filter('translate')("SUBMIT_FOR_TESTING_SUCCESS_MESSAGE_TEXT"),
- title: this.$filter('translate')("SUBMIT_FOR_TESTING_SUCCESS_MESSAGE_TITLE")
- });
- break;
- //Tester Role
- case 'lifecycleState/failCertification':
- defaultActionAfterChangeLifecycleState();
- this.Notification.success({
- message: this.$filter('translate')("REJECT_SUCCESS_MESSAGE_TEXT"),
- title: this.$filter('translate')("REJECT_SUCCESS_MESSAGE_TITLE")
- });
- break;
case 'lifecycleState/certify':
-
this.$scope.handleCertification(component);
-
+ this.verifyIfDependenciesExist();
+ this.$scope.reload(component);
break;
- //DE203504 Bug Fix Start
- case 'lifecycleState/startCertification':
- this.initChangeLifecycleStateButtons();
- this.Notification.success({
- message: this.$filter('translate')("START_TESTING_SUCCESS_MESSAGE_TEXT"),
- title: this.$filter('translate')("START_TESTING_SUCCESS_MESSAGE_TITLE")
- });
- break;
- case 'lifecycleState/cancelCertification':
- this.initChangeLifecycleStateButtons();
- this.Notification.success({
- message: this.$filter('translate')("CANCEL_TESTING_SUCCESS_MESSAGE_TEXT"),
- title: this.$filter('translate')("CANCEL_TESTING_SUCCESS_MESSAGE_TITLE")
- });
- break;
- //Ops Role
- case 'distribution/PROD/activate':
- this.initChangeLifecycleStateButtons();
+ case 'distribution/PROD/activate':
this.Notification.success({
message: this.$filter('translate')("DISTRIBUTE_SUCCESS_MESSAGE_TEXT"),
title: this.$filter('translate')("DISTRIBUTE_SUCCESS_MESSAGE_TITLE")
});
- break;
- //Governor Role
- case 'distribution-state/reject':
this.initChangeLifecycleStateButtons();
- this.Notification.success({
- message: this.$filter('translate')("REJECT_SUCCESS_MESSAGE_TEXT"),
- title: this.$filter('translate')("REJECT_SUCCESS_MESSAGE_TITLE")
- });
break;
- case 'distribution-state/approve':
- this.initChangeLifecycleStateButtons();
- this.$state.go('catalog');
- this.Notification.success({
- message: this.$filter('translate')("APPROVE_SUCCESS_MESSAGE_TEXT"),
- title: this.$filter('translate')("APPROVE_SUCCESS_MESSAGE_TITLE")
- });
- break;
- //DE203504 Bug Fix End
-
default :
defaultActionAfterChangeLifecycleState();
-
}
- if (data.url != 'lifecycleState/CHECKOUT') {
+ if (data.url !== 'lifecycleState/CHECKOUT') {
this.$scope.isLoading = false;
}
};
- //this.$scope.isLoading = true;
-
this.ChangeLifecycleStateHandler.changeLifecycleState(this.$scope.component, data, this.$scope, onSuccess);
};
@@ -663,6 +629,21 @@ export class WorkspaceViewModel {
return this.$scope.mode === WorkspaceMode.CREATE;
};
+ this.$scope.checkDisableButton = (button: any):boolean => {
+ // Logic moved from html to component
+ if (this.$scope.isCreateMode() || button.disabled || this.$scope.disabledButtons || !this.$scope.isValidForm || this.$scope.unsavedChanges || this.$scope.component.archived){
+ return true;
+ }
+
+ // Specific verification for Checkout - enabled only in case the component is the latest version.
+ let result: boolean = false;
+
+ if (button.url === 'lifecycleState/CHECKOUT') {
+ result = !this.$scope.component.isLatestVersion();
+ }
+ return result;
+ };
+
this.$scope.isEditMode = ():boolean => {
return this.$scope.mode === WorkspaceMode.EDIT;
};
@@ -686,18 +667,14 @@ export class WorkspaceViewModel {
this.initMenuItems();
- this.$scope.showChangeStateButton = ():boolean => {
- let result:boolean = true;
- if (!this.$scope.component.isLatestVersion() && Role.OPS != this.role && Role.GOVERNOR != this.role) {
+ this.$scope.showLatestVersion = (): boolean => {
+ let result: boolean = true;
+ if (!this.$scope.component.isLatestVersion()) {
result = false;
}
if (ComponentState.NOT_CERTIFIED_CHECKOUT === this.$scope.component.lifecycleState && this.$scope.isViewMode()) {
result = false;
}
- if (ComponentState.CERTIFIED != this.$scope.component.lifecycleState &&
- (Role.OPS == this.role || Role.GOVERNOR == this.role)) {
- result = false;
- }
return result;
};
@@ -705,20 +682,20 @@ export class WorkspaceViewModel {
let stateArray:Array<string> = state.split('.', 2);
let stateWithoutInternalNavigate:string = stateArray[0] + '.' + stateArray[1];
let selectedItem:MenuItem = _.find(this.$scope.leftBarTabs.menuItems, (item:MenuItem) => {
- let itemStateArray: Array<string> = item.state.split('.', 2);
+ let itemStateArray:Array<string> = item.state.split('.', 2);
let itemStateWithoutNavigation:string = itemStateArray[0] + '.' + itemStateArray[1];
return (itemStateWithoutNavigation === stateWithoutInternalNavigate);
});
let selectedIndex = selectedItem ? this.$scope.leftBarTabs.menuItems.indexOf(selectedItem) : 0;
- if (stateArray[1] === 'plugins') {
+ if (stateArray[1] === 'plugins') {
_.forEach(PluginsConfiguration.plugins, (plugin) => {
if (plugin.pluginStateUrl == this.$state.params.path) {
return false;
}
else if (this.pluginsService.isPluginDisplayedInContext(plugin, this.role, this.$scope.component.getComponentSubType())) {
- selectedIndex++;
+ selectedIndex++;
}
});
}
@@ -726,11 +703,11 @@ export class WorkspaceViewModel {
this.$scope.leftBarTabs.selectedIndex = selectedIndex;
};
- this.$scope.isSelected = (menuItem:MenuItem): boolean => {
+ this.$scope.isSelected = (menuItem: MenuItem): boolean => {
return this.$scope.leftBarTabs.selectedIndex === _.indexOf(this.$scope.leftBarTabs.menuItems, menuItem);
};
- this.$scope.$watch('$state.current.name', (newVal:string):void => {
+ this.$scope.$watch('$state.current.name', (newVal: string): void => {
if (newVal) {
this.$scope.isComposition = (newVal.indexOf(States.WORKSPACE_COMPOSITION) > -1);
this.$scope.isDeployment = newVal == States.WORKSPACE_DEPLOYMENT;
@@ -738,20 +715,26 @@ export class WorkspaceViewModel {
}
});
- this.$scope.getTabTitle = ():string => {
- return this.$scope.leftBarTabs.menuItems.find((menuItem:MenuItem) => {
+ this.$scope.getTabTitle = (): string => {
+ return this.$scope.leftBarTabs.menuItems.find((menuItem: MenuItem) => {
return menuItem.state == this.$scope.$state.current.name;
}).text;
};
- this.$scope.reload = (component:Component):void => {
- this.$state.go(this.$state.current.name, {id: component.uniqueId}, {reload: true});
+ this.$scope.reload = (component: Component): void => {
+ const isGeneralTab = this.$state.current.name === 'workspace.general';
+ // nullify the componentCsar in case we are in general tab so we know we didnt came from updateVsp Modal
+ if (isGeneralTab) {
+ this.$state.go(this.$state.current.name, {id: component.uniqueId, componentCsar: null}, {reload: true});
+ } else {
+ this.$state.go(this.$state.current.name, {id: component.uniqueId}, {reload: true});
+ }
};
this.$scope.$on('$destroy', () => {
this.EventListenerService.unRegisterObserver(EVENTS.ON_WORKSPACE_UNSAVED_CHANGES);
});
-
+
this.$scope.openAutomatedUpgradeModal = ():void => {
this.$scope.isLoading = true;
this.ComponentServiceNg2.getDependencies(this.$scope.component.componentType, this.$scope.component.uniqueId).subscribe((response:Array<IDependenciesServerResponse>)=> {
@@ -761,14 +744,14 @@ export class WorkspaceViewModel {
}
this.$scope.handleCertification = (certifyComponent): void => {
- if (this.$scope.component.getComponentSubType() === ResourceType.VF) {
+ if (this.$scope.component.getComponentSubType() === ResourceType.VF || this.$scope.component.isService()) {
this.ComponentServiceNg2.getDependencies(this.$scope.component.componentType, this.$scope.component.uniqueId).subscribe((response:Array<IDependenciesServerResponse>) => {
this.$scope.isLoading = false;
- let isUpgradeNeeded = _.filter(response, (componentToUpgrade:IDependenciesServerResponse) => {
+ const isUpgradeNeeded = _.filter(response, (componentToUpgrade:IDependenciesServerResponse) => {
return componentToUpgrade.dependencies && componentToUpgrade.dependencies.length > 0;
});
- if(isUpgradeNeeded.length === 0) {
+ if (isUpgradeNeeded.length === 0) {
this.onSuccessWithoutUpgradeNeeded();
return;
}
@@ -781,52 +764,54 @@ export class WorkspaceViewModel {
}
this.$scope.disableMenuItems = () => {
- this.$scope.leftBarTabs.menuItems.forEach((item:MenuItem) => {
- item.isDisabled = (States.WORKSPACE_GENERAL != item.state);
+ this.$scope.leftBarTabs.menuItems.forEach((item: MenuItem) => {
+ item.isDisabled = (States.WORKSPACE_GENERAL !== item.state);
});
}
-
+
this.$scope.enableMenuItems = () => {
- this.$scope.leftBarTabs.menuItems.forEach((item:MenuItem) => {
+ this.$scope.leftBarTabs.menuItems.forEach((item: MenuItem) => {
item.isDisabled = false;
});
- }
+ };
- this.$scope.startProgress = (message:string):void => {
+ this.$scope.startProgress = (message: string): void => {
this.progressService.initCreateComponentProgress(this.$scope.component.uniqueId);
this.$scope.isCreateProgress = true;
this.$scope.progressMessage = message;
};
- this.$scope.stopProgress = ():void => {
+ this.$scope.stopProgress = (): void => {
this.$scope.isCreateProgress = false;
this.progressService.deleteProgressValue(this.$scope.component.uniqueId);
}
- this.$scope.updateBreadcrumbs = (component:Component):void => {
+ this.$scope.updateBreadcrumbs = (component: Component): void => {
// Update the components list for breadcrumbs
const bcIdx = this.MenuHandler.findBreadcrumbComponentIndex(this.components, component);
if (bcIdx !== -1) {
this.components[bcIdx] = component;
this.initBreadcrumbs(); // re-calculate breadcrumbs
}
- }
+ };
this.$scope.updateUnsavedFileFlag = (isUnsaved:boolean) => {
this.$scope.unsavedFile = isUnsaved;
- }
+ };
- };
+ }
- private onSuccessWithoutUpgradeNeeded = ():void => {
+ private onSuccessWithoutUpgradeNeeded = (): void => {
this.$scope.isLoading = false;
this.Notification.success({
- message: this.$filter('translate')("ACCEPT_TESTING_SUCCESS_MESSAGE_TEXT"),
- title: this.$filter('translate')("ACCEPT_TESTING_SUCCESS_MESSAGE_TITLE")
+ message: this.$filter('translate')('SERVICE_CERTIFICATION_STATUS_TEXT'),
+ title: this.$filter('translate')('SERVICE_CERTIFICATION_STATUS_TITLE')
});
- this.$state.go('dashboard');
+ this.initVersionObject();
+ this.initChangeLifecycleStateButtons();
}
+
private refreshDataAfterChangeLifecycleState = (component:Component):void => {
this.$scope.isLoading = false;
this.$scope.mode = this.initViewMode();
@@ -835,42 +820,42 @@ export class WorkspaceViewModel {
this.EventListenerService.notifyObservers(EVENTS.ON_LIFECYCLE_CHANGE, component);
}
- private initAfterScope = ():void => {
+ private initAfterScope = (): void => {
// In case user select csar from the onboarding modal, need to disable checkout and submit for testing.
if (this.$state.params['disableButtons'] === true) {
this.$scope.uploadFileChangedInGeneralTab();
}
};
- private initVersionObject = ():void => {
+ private initVersionObject = (): void => {
this.$scope.versionsList = (this.$scope.component.getAllVersionsAsSortedArray()).reverse();
this.$scope.changeVersion = {
- selectedVersion: _.find(this.$scope.versionsList, (versionObj)=> {
+ selectedVersion: _.find(this.$scope.versionsList, (versionObj) => {
return versionObj.versionId === this.$scope.component.uniqueId;
})
};
- };
+ }
- private getNewComponentBreadcrumbItem = ():MenuItem => {
- let text = "";
+ private getNewComponentBreadcrumbItem = (): MenuItem => {
+ let text = '';
if (this.$scope.component.isResource() && (<Resource>this.$scope.component).isCsarComponent()) {
text = this.$scope.component.getComponentSubType() + ': ' + this.$scope.component.name;
} else {
text = 'Create new ' + this.$state.params['type'];
}
return new MenuItem(text, null, States.WORKSPACE_GENERAL, 'goToState', [this.$state.params]);
- };
+ }
- private updateMenuItemByRole = (menuItems:Array<any>, role:string) => {
- let tempMenuItems:Array<any> = new Array<any>();
- menuItems.forEach((item:any) => {
+ private updateMenuItemByRole = (menuItems: any[], role: string) => {
+ const tempMenuItems: any[] = new Array<any>();
+ menuItems.forEach((item: any) => {
//remove item if role is disabled
if (!(item.disabledRoles && item.disabledRoles.indexOf(role) > -1)) {
tempMenuItems.push(item);
}
});
return tempMenuItems;
- };
+ }
private updateMenuItemByCategory = (menuItems:Array<any>, category:string) => {
let tempMenuItems:Array<any> = new Array<any>();
@@ -888,15 +873,15 @@ export class WorkspaceViewModel {
private deleteArchiveCache = () => {
- this.cacheService.remove("archiveComponents"); //delete the cache to ensure the archive is reloaded from server
- };
+ this.cacheService.remove('archiveComponents'); // delete the cache to ensure the archive is reloaded from server
+ }
private initBreadcrumbs = () => {
this.components = this.cacheService.get('breadcrumbsComponents');
- let breadcrumbsComponentsLvl = this.MenuHandler.generateBreadcrumbsModelFromComponents(this.components, this.$scope.component);
+ const breadcrumbsComponentsLvl = this.MenuHandler.generateBreadcrumbsModelFromComponents(this.components, this.$scope.component);
if (this.$scope.isCreateMode()) {
- let createItem = this.getNewComponentBreadcrumbItem();
+ const createItem = this.getNewComponentBreadcrumbItem();
if (!breadcrumbsComponentsLvl.menuItems) {
breadcrumbsComponentsLvl.menuItems = [];
}
@@ -905,25 +890,23 @@ export class WorkspaceViewModel {
}
this.$scope.breadcrumbsModel = [breadcrumbsComponentsLvl, this.$scope.leftBarTabs];
- };
+ }
private initMenuItems() {
- let inCreateMode = this.$scope.isCreateMode();
+ const inCreateMode = this.$scope.isCreateMode();
this.$scope.leftBarTabs = new MenuItemGroup();
- //const menuItemsObjects:Array<any> = this.updateMenuItemByRole(this.sdcMenu.component_workspace_menu_option[this.$scope.component.getComponentSubType()], this.role);
- let menuItemsObjects:Array<any> = this.updateMenuItemByRole(this.sdcMenu.component_workspace_menu_option[this.$scope.component.getComponentSubType()], this.role);
- if(this.$scope.component.getComponentSubType()==="SERVICE")
- {
- let menuItemsObjectsCategory:Array<any> = this.updateMenuItemByCategory(menuItemsObjects, this.category);
- menuItemsObjects = menuItemsObjectsCategory;
+ let menuItemsObjects: any[] = this.updateMenuItemByRole(this.sdcMenu.component_workspace_menu_option[this.$scope.component.getComponentSubType()], this.role);
+ if (this.$scope.component.getComponentSubType() === 'SERVICE') {
+ const menuItemsObjectsCategory: any[] = this.updateMenuItemByCategory(menuItemsObjects, this.category);
+ menuItemsObjects = menuItemsObjectsCategory;
}
// Only adding plugins to the workspace if they can be displayed for the current user role
_.each(PluginsConfiguration.plugins, (plugin: Plugin) => {
if (this.pluginsService.isPluginDisplayedInContext(plugin, this.role, this.$scope.component.getComponentSubType())) {
menuItemsObjects.push({
- text: plugin.pluginDisplayOptions["context"].displayName,
+ text: plugin.pluginDisplayOptions['context'].displayName,
action: 'onMenuItemPressed',
state: 'workspace.plugins',
params: {path: plugin.pluginStateUrl}
@@ -931,7 +914,7 @@ export class WorkspaceViewModel {
}
});
- this.$scope.leftBarTabs.menuItems = menuItemsObjects.map((item:MenuItem) => {
+ this.$scope.leftBarTabs.menuItems = menuItemsObjects.map((item: MenuItem) => {
const menuItem = new MenuItem(item.text, item.callback, item.state, item.action, item.params, item.blockedForTypes, item.disabledCategory);
if (menuItem.params) {
menuItem.params.state = menuItem.state;
@@ -940,7 +923,7 @@ export class WorkspaceViewModel {
menuItem.params = {state: menuItem.state};
}
menuItem.callback = () => this.$scope[menuItem.action](menuItem.state, menuItem.params);
- menuItem.isDisabled = (inCreateMode && States.WORKSPACE_GENERAL != menuItem.state) ||
+ menuItem.isDisabled = (inCreateMode && States.WORKSPACE_GENERAL !== menuItem.state) ||
(States.WORKSPACE_DEPLOYMENT === menuItem.state && this.$scope.component.modules
&& this.$scope.component.modules.length === 0 && this.$scope.component.isResource()) ||
(menuItem.disabledCategory === true);
@@ -950,20 +933,54 @@ export class WorkspaceViewModel {
if (this.cacheService.get('breadcrumbsComponents')) {
this.initBreadcrumbs();
}
+ else {
+ this.initBreadcrumbsComponents();
+ }
}
-
-
private showSuccessNotificationMessage = ():void => {
this.Notification.success({
- message: this.$filter('translate')("IMPORT_VF_MESSAGE_CREATE_FINISHED_DESCRIPTION"),
- title: this.$filter('translate')("IMPORT_VF_MESSAGE_CREATE_FINISHED_TITLE")
+ message: this.$filter('translate')('IMPORT_VF_MESSAGE_CREATE_FINISHED_DESCRIPTION'),
+ title: this.$filter('translate')('IMPORT_VF_MESSAGE_CREATE_FINISHED_TITLE')
});
- };
+ }
- private setWorkspaceButtonState = (newState:boolean, callback?:Function) => {
+ private setWorkspaceButtonState = (newState: boolean, callback?: Function) => {
this.$scope.unsavedChanges = newState;
this.$scope.unsavedChangesCallback = callback;
}
+ private initBreadcrumbsComponents = (): void => {
+ let breadcrumbsComponentsObservable;
+ if (this.$stateParams.previousState === 'dashboard') {
+ breadcrumbsComponentsObservable = this.homeService.getAllComponents(true);
+ } else if (this.$stateParams.previousState === 'catalog') {
+ breadcrumbsComponentsObservable = this.catalogService.getCatalog();
+ } else {
+ this.cacheService.remove('breadcrumbsComponentsState');
+ this.cacheService.remove('breadcrumbsComponents');
+ return;
+ }
+ breadcrumbsComponentsObservable.subscribe((components) => {
+ this.cacheService.set('breadcrumbsComponentsState', this.$stateParams.previousState);
+ this.cacheService.set('breadcrumbsComponents', components);
+ this.initBreadcrumbs();
+ });
+
+ }
+
+ private verifyIfDependenciesExist(): void {
+ let containsDependencies = [];
+ if (this.$scope.component.componentType && this.$scope.component.uniqueId &&
+ this.$scope.component.lifecycleState === 'CERTIFIED' && (this.$scope.component.isService() || this.$scope.component.getComponentSubType() === 'VF')) {
+ this.ComponentServiceNg2.getDependencies(this.$scope.component.componentType, this.$scope.component.uniqueId).subscribe((response: IDependenciesServerResponse[]) => {
+ containsDependencies = response.filter((version) => version.dependencies);
+ if (containsDependencies.length > 0) {
+ this.$scope.hasNoDependencies = false;
+ } else {
+ this.$scope.hasNoDependencies = true;
+ }
+ });
+ }
+ }
}
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 d22262c94a..79dde943dc 100644
--- a/catalog-ui/src/app/view-models/workspace/workspace-view.html
+++ b/catalog-ui/src/app/view-models/workspace/workspace-view.html
@@ -22,7 +22,8 @@
{{menuComponentTitle}}
</div>
<div class="i-sdc-designer-sidebar-section-content-item" ng-class="{'selected': isSelected(menuItem)}" ng-repeat="menuItem in leftBarTabs.menuItems track by $index">
- <div class="expand-collapse-menu-box-item-text" ng-class="{'disabled': menuItem.isDisabled }" data-tests-id="{{menuItem.text}}LeftSideMenu" ><button type="button" class="i-sdc-designer-sidebar-section-content-item-service-cat" ng-click="menuItem.callback()" ng-disabled={{menuItem.disabledCategory}}>{{menuItem.text}}</button></div>
+ <!--<div class="expand-collapse-menu-box-item-text" ng-click="menuItem.callback()" ng-class="{'disabled': menuItem.isDisabled }" data-tests-id="{{menuItem.text}}LeftSideMenu">{{menuItem.text}}</div>-->
+ <div class="expand-collapse-menu-box-item-text" ng-class="{'disabled': menuItem.isDisabled }"><button data-tests-id="{{menuItem.text}}LeftSideMenu" type="button" class="i-sdc-designer-sidebar-section-content-item-service-cat" ng-click="menuItem.callback()" ng-disabled={{menuItem.disabledCategory}}>{{menuItem.text}}</button></div>
</div>
</div>
@@ -53,9 +54,11 @@
<div class="sdc-workspace-top-bar-buttons">
- <span ng-if="!isCreateMode() && !component.isLatestVersion() && !showChangeStateButton()" [disabled]="unsavedChanges">Switch to the&nbsp;<a ng-click="getLatestVersion()">latest version</a></span>
+ <span ng-if="!isCreateMode() && !component.isLatestVersion() && !showLatestVersion()" [disabled]="unsavedChanges">Switch to the&nbsp;<a data-tests-id="latest-version" ng-click="getLatestVersion()">latest version</a></span>
+
<button ng-if="isDesigner() && !isCreateMode() && component.lifecycleState === 'CERTIFIED' && (component.isService() || component.getComponentSubType() === 'VF')"
+ ng-disabled="hasNoDependencies"
ng-click="openAutomatedUpgradeModal()"
class="tlv-btn blue"
data-ng-class="{'disabled' : component.archived}"
@@ -65,13 +68,12 @@
<button ng-repeat="(key,button) in changeLifecycleStateButtons"
ng-click="changeLifecycleState(key)"
- ng-if="showChangeStateButton() && key != 'deleteVersion'"
- data-ng-disabled="isCreateMode() || button.disabled || disabledButtons || !isValidForm || unsavedChanges || component.archived"
+ ng-if="key != 'deleteVersion'"
+ data-ng-disabled="checkDisableButton(button)"
class="change-lifecycle-state-btn tlv-btn"
ng-class="$first ? 'outline green' : 'grey'"
data-tests-id="{{button.text | testsId}}" prevent-double-click>
{{button.text}}
-
</button>
@@ -104,11 +106,11 @@
</div>
<div class="w-sdc-main-container-body-content-wrapper">
<div class="w-sdc-main-container-body-content-header">
- <div class="tab-title" data-ng-if="!isComposition && !isDeployment && !isPlugins">
+ <div class="workspace-tab-title" data-ng-if="!isComposition && !isDeployment && !isPlugins">
{{getTabTitle()}}
</div>
</div>
- <div class="w-sdc-main-container-body-content" data-ng-class="{'third-party':thirdParty}" data-ui-view></div>
+ <div class="w-sdc-main-container-body-content" data-ng-class="{'deploy-body-content': isDeployment}" data-ng-class="{'third-party':thirdParty}" data-ui-view></div>
</div>
</div>
</div>
diff --git a/catalog-ui/src/app/view-models/workspace/workspace.less b/catalog-ui/src/app/view-models/workspace/workspace.less
index 518272d45c..5c479c7370 100644
--- a/catalog-ui/src/app/view-models/workspace/workspace.less
+++ b/catalog-ui/src/app/view-models/workspace/workspace.less
@@ -109,7 +109,7 @@
.general-view-top-progress {
width: 30%;
margin: 0 auto;
- min-width: 150px;
+ min-width: 140px;
}
}
@@ -189,7 +189,7 @@
display: inline-block;
}
}
- .tab-title{
+ .workspace-tab-title {
height: 110px;
padding-left: 100px;
line-height: 110px;
@@ -199,6 +199,11 @@
.w-sdc-main-container-body-content {
height: 100%;
}
+
+ .w-sdc-main-container-body-content-wrapper {
+ height: 100%;
+ overflow:hidden;
+ }
}
.w-sdc-main-container-body-content {
// height:calc(~'100% - @{action_nav_height} - @{tab_title}');
@@ -219,7 +224,7 @@
height: calc(~'100% - @{action_nav_height}');
.w-sdc-main-container-body-content-header {
display: flex;
- .tab-title {
+ .workspace-tab-title {
flex-grow: 1;
}
.w-sdc-main-container-body-content-action-buttons {
@@ -239,4 +244,58 @@
}
}
}
+// Fix till we remove everything to angular5 and fix all workspace style
+.composition{
+ .sdc-workspace-container{
+ .w-sdc-main-container{
+ .w-sdc-main-right-container{
+ left:0;
+ //overflow-y: scroll;
+ .sdc-workspace-top-bar {
+ position: absolute;
+ left: 245px;
+ right: 0;
+ z-index: 1;
+ .not-latest{
+ left: 270px;
+ }
+ }
+ .w-sdc-main-container-body-content{
+ padding: 0 0 0 0;
+ }
+
+ > div:first-child{
+ padding: 0;
+ }
+ }
+ }
+ }
+}
+
+.deployment {
+
+ .sdc-workspace-container{
+ .w-sdc-main-container{
+ .w-sdc-main-right-container{
+ left:0;
+ //overflow-y: scroll;
+ .sdc-workspace-top-bar {
+ position: absolute;
+ left: 245px;
+ right: 0;
+ z-index: 1;
+ .not-latest{
+ left: 270px;
+ }
+ }
+ > div:first-child{
+ padding: 0;
+ }
+ .w-sdc-main-container-body-content-wrapper {
+ padding: 0px;
+ }
+ }
+ }
+ }
+}