aboutsummaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/relationship-operations-step/interface-operation-list/interface-operation-list.component.html
diff options
context:
space:
mode:
Diffstat (limited to 'catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/relationship-operations-step/interface-operation-list/interface-operation-list.component.html')
-rw-r--r--catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/relationship-operations-step/interface-operation-list/interface-operation-list.component.html118
1 files changed, 118 insertions, 0 deletions
diff --git a/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/relationship-operations-step/interface-operation-list/interface-operation-list.component.html b/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/relationship-operations-step/interface-operation-list/interface-operation-list.component.html
new file mode 100644
index 0000000000..360af52dbf
--- /dev/null
+++ b/catalog-ui/src/app/ng2/pages/composition/graph/connection-wizard/relationship-operations-step/interface-operation-list/interface-operation-list.component.html
@@ -0,0 +1,118 @@
+<!--
+ ~ ============LICENSE_START=======================================================
+ ~ Copyright (C) 2021 Nordix Foundation
+ ~ ================================================================================
+ ~ 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.
+ ~
+ ~ SPDX-License-Identifier: Apache-2.0
+ ~ ============LICENSE_END=========================================================
+ -->
+
+<div class="operation-list">
+
+ <div
+ class="empty-list-container"
+ *ngIf="!(interfaceOperationList$ | async)?.length">
+ <span>No operation provided</span>
+ </div>
+
+ <div *ngIf="(interfaceOperationList$ | async)?.length">
+
+ <div class="expand-collapse">
+ <a
+ class="link"
+ data-tests-id="expand-all"
+ [ngClass]="{'disabled': isAllExpanded()}"
+ (click)="toggleAllExpand()">
+ {{ 'INTERFACE_EXPAND_ALL' | translate }}
+ </a> |
+ <a
+ class="link"
+ data-tests-id="collapse-all"
+ [ngClass]="{'disabled': isAllCollapsed()}"
+ (click)="toggleAllCollapse()">
+ {{ 'INTERFACE_COLLAPSE_ALL' | translate }}
+ </a>
+ </div>
+
+ <div
+ class="interface-row"
+ *ngFor="let interfaceType of getKeys(interfaceTypeMap)">
+
+ <div
+ class="interface-accordion"
+ (click)="toggleCollapse(interfaceType)">
+ <span
+ class="chevron-container"
+ [ngClass]="{'isCollapsed': isInterfaceCollapsed(interfaceType)}">
+ <svg-icon
+ name="caret1-down-o"
+ mode="primary"
+ size="small">
+ </svg-icon>
+ </span>
+ <span class="interface-name">{{interfaceType}}</span>
+ </div>
+
+ <div class="generic-table" *ngIf="isInterfaceCollapsed(interfaceType)">
+ <div class="header-row table-row">
+ <span
+ class="cell header-cell field-name">
+ {{ 'OPERATION_NAME' | translate }}
+ </span>
+ <span
+ class="cell header-cell field-description">
+ {{ 'OPERATION_IMPLEMENTATION' | translate }}
+ </span>
+ <span
+ class="cell header-cell field-actions header-actions">
+ ●●●
+ </span>
+ </div>
+ <div
+ class="data-row"
+ *ngFor="let operation of interfaceTypeMap.get(interfaceType)"
+ [attr.data-tests-id]="'operation-' + operation.operationType"
+ (click)="onEditOperation(operation)">
+ <span
+ class="cell field-name"
+ [attr.data-tests-id]="'operation-' + operation.operationType + '-name'">
+ {{operation.operationType}}
+ </span>
+ <span
+ class="cell field-description"
+ [attr.data-tests-id]="'operation-' + operation.operationType + '-implementation'">
+ {{operation.implementation}}
+ </span>
+ <span class="cell field-actions">
+ <span
+ class="delete-action"
+ [attr.data-tests-id]="'remove-operation-' + operation.operationType"
+ (click)="onRemoveOperation($event, operation)">
+ <svg-icon
+ *ngIf="!isReadOnly"
+ name="trash-o"
+ mode="info"
+ size="small"
+ [clickable]="true">
+ </svg-icon>
+ </span>
+ </span>
+ </div>
+
+ </div>
+
+ </div>
+
+ </div>
+
+</div> \ No newline at end of file