re base code
[sdc.git] / catalog-ui / src / app / view-models / workspace / workspace-view.html
1 <div class="sdc-workspace-container">
2     <loader data-display="isLoading"></loader>
3     <div class="w-sdc-main-container">
4         <div class="w-sdc-left-sidebar" data-ng-if="!isComposition">
5             <div class="menu-header" tooltips tooltip-content="{{menuComponentTitle}}">
6                 {{menuComponentTitle}}
7             </div>
8             <div class="i-sdc-designer-sidebar-section-content-item" ng-class="{'selected': isSelected(menuItem)}" ng-repeat="menuItem in leftBarTabs.menuItems track by $index">
9                 <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>
10             </div>
11         </div>
12
13         <div include-padding="true" class="w-sdc-main-right-container" data-ng-class="{'composition':isComposition, 'deployment':isDeployment}">
14             <loader data-display="isCreateProgress" data-ng-show="isCreateProgress" relative="false"></loader>
15
16             <div class="sdc-workspace-top-bar">
17                 <div class="version-container">
18
19                 <span data-ng-if="!isCreateMode() && !component.isLatestVersion()" class="not-latest"></span>
20                     <select class="version-selector" data-ng-if="!isCreateMode()" data-tests-id="versionHeader" data-ng-model="changeVersion.selectedVersion" data-ng-class="{'disabled': unsavedChanges}"
21                             ng-options="'V'+version.versionNumber for version in versionsList" data-ng-change="onVersionChanged(changeVersion.selectedVersion.versionId)">
22                     </select>
23                 </div>
24
25                 <div class="lifecycle-state">
26                     <div data-ng-show="showLifecycleIcon()" class="lifecycle-state-icon" data-ng-class="{'in-design-status-icon': isCreateMode(), '{{sdcMenu.LifeCycleStatuses[component.lifecycleState].icon}}': !isCreateMode()}"></div>
27                     <span class="lifecycle-state-text" data-tests-id="formlifecyclestate">{{getStatus()}}</span>
28                 </div>
29
30                 <div class="archive-state-label" ng-if="component.archived">
31                     <div class="sprite-new archive-label" ></div>
32                 </div>
33
34                 <div class="progress-container" >
35                     <top-progress class="general-view-top-progress" progress-value="progressService.getProgressValue(component.uniqueId)" progress-message="progressMessage"></top-progress>
36                 </div>
37
38                 <div class="sdc-workspace-top-bar-buttons">
39
40                     <span ng-if="!isCreateMode() && !component.isLatestVersion() && !showChangeStateButton()" [disabled]="unsavedChanges">Switch to the&nbsp;<a ng-click="getLatestVersion()">latest version</a></span>
41
42                  <button ng-if="isDesigner() && !isCreateMode() && component.lifecycleState === 'CERTIFIED' && (component.isService() || component.getComponentSubType() === 'VF')"
43                             ng-click="openAutomatedUpgradeModal()"
44                             class="tlv-btn blue"
45                             data-ng-class="{'disabled' : component.archived}"
46                             data-tests-id="open-upgrade-vsp-popup"
47                             sdc-smart-tooltip="" prevent-double-click>{{component.isResource() ? 'Upgrade Services' : 'Update Services'}}</button>
48
49
50                     <button ng-repeat="(key,button) in changeLifecycleStateButtons"
51                             ng-click="changeLifecycleState(key)"
52                             ng-if="showChangeStateButton() && key != 'deleteVersion'"
53                             data-ng-disabled="isCreateMode() || button.disabled || disabledButtons || !isValidForm || unsavedChanges || component.archived"
54                             class="change-lifecycle-state-btn tlv-btn"
55                             ng-class="$first ? 'outline green' : 'grey'"
56                             data-tests-id="{{button.text  | testsId}}" prevent-double-click>
57                             {{button.text}}
58
59                         </button>
60
61
62                     <button ng-if="!isCreateMode() && component.archived"
63                         data-ng-class="{'disabled' :!isDesigner() || !component.isLatestVersion()}"
64                         ng-click="restoreComponent()"
65                         class="tlv-btn blue"
66                         data-tests-id="restore-component-button"
67                         prevent-double-click>Restore</button>
68
69                     <button ng-if="!isViewMode() && isCreateMode()" data-ng-disabled="!isValidForm || isDisableMode() || isLoading || unsavedChanges" ng-click="create()" class="tlv-btn outline green" data-tests-id="create/save">Create</button>
70
71                     <span data-ng-if="isDesigner() && !isCreateMode() && component.lifecycleState === 'NOT_CERTIFIED_CHECKOUT' && !component.archived" sdc-smart-tooltip=""
72                         data-ng-class="{'disabled' : !isValidForm || isDisableMode() || isViewMode() || unsavedChanges}" ng-click="changeLifecycleState('deleteVersion')"
73                         class="sprite-new delete-btn" data-tests-id="delete_version" sdc-smart-tooltip="Delete" prevent-double-click>Delete</span>
74
75                     <span data-ng-click = "archiveComponent()"
76                         ng-model-options="{ debounce: 300 }"
77                         data-ng-class="{'disabled' : !component.isLatestVersion()}"
78                         data-ng-if = "isDesigner() && component.lifecycleState !== 'NOT_CERTIFIED_CHECKOUT' && !isCreateMode() && !component.archived"
79                         data-tests-id="archive-component-button"
80                         class="sprite-new archive-btn" sdc-smart-tooltip="Archive" prevent-double-click>Archive</span>
81
82
83
84                     <span class="delimiter"></span>
85                     <span class="sprite-new x-btn" data-ng-click="goToBreadcrumbHome()" data-ng-class="{'disabled' : unsavedChanges}" sdc-smart-tooltip="">Close</span>
86
87                 </div>
88             </div>
89             <div class="w-sdc-main-container-body-content-wrapper">
90                 <div class="w-sdc-main-container-body-content-header">
91                     <div class="tab-title" data-ng-if="!isComposition && !isDeployment && !isPlugins">
92                         {{getTabTitle()}}
93                     </div>
94                 </div>
95                 <div class="w-sdc-main-container-body-content" data-ng-class="{'third-party':thirdParty}" data-ui-view></div>
96             </div>
97         </div>
98     </div>
99     <top-nav [hide-search]="true" [menu-model]="breadcrumbsModel" [version]="version" [unsaved-changes]="unsavedChanges" [unsaved-changes-callback]="unsavedChangesCallback"></top-nav>
100 </div>