blob: 4cd33f3210fb23ad15a34956c0698c052b622682 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
|
<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="​{{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="!isPNF() && !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 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>
</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>
|
