catalog-ui/src/app/view-models/workspace/tabs/composition/tabs/details/details-view.html

   1 <!--
   2   ~ Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
   3   ~
   4   ~ Licensed under the Apache License, Version 2.0 (the "License");
   5   ~ you may not use this file except in compliance with the License.
   6   ~ You may obtain a copy of the License at
   7   ~
   8   ~      http://www.apache.org/licenses/LICENSE-2.0
   9   ~
  10   ~ Unless required by applicable law or agreed to in writing, software
  11   ~ distributed under the License is distributed on an "AS IS" BASIS,
  12   ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13   ~ See the License for the specific language governing permissions and
  14   ~ limitations under the License.
  15 -->
  16
  17 <perfect-scrollbar include-padding="true" class="w-sdc-designer-sidebar-tab-content details">
  18
  19     <div class="w-sdc-designer-sidebar-section">
  20         <loader data-display="isLoading"></loader>
  21         <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content.general" class="w-sdc-designer-sidebar-section-title">
  22
  23             General Info
  24             <div class="w-sdc-designer-sidebar-section-title-icon"></div>
  25         </expand-collapse>
  26
  27         <div class="w-sdc-designer-sidebar-section-content general">
  28             <div class="i-sdc-designer-sidebar-section-content-item">
  29                 <span class="i-sdc-designer-sidebar-section-content-item-label">Type:</span>
  30                 <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>
  31             </div>
  32             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.isResource()">
  33                 <span class="i-sdc-designer-sidebar-section-content-item-label">Resource Type:</span>
  34                 <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-if="selectedComponent.isResource()" data-ng-bind="selectedComponent.resourceType"
  35                       tooltips tooltip-content="&#8203;{{selectedComponent.resourceType | resourceTypeName}}"
  36                       data-tests-id="rightTab_resourceType"></span>
  37             </div>
  38             <div class="i-sdc-designer-sidebar-section-content-item">
  39
  40                 <span class="i-sdc-designer-sidebar-section-content-item-label">Version:</span>
  41                 <span class="i-sdc-designer-sidebar-section-content-item-value"
  42                       data-ng-if="!isComponentInstanceSelected()"  data-tests-id="rightTab_version" data-ng-bind="selectedComponent.version"></span>
  43
  44                 <ng-form name="editForm" data-ng-if="isComponentInstanceSelected()">
  45                     <select data-ng-model="editResourceVersion.changeVersion" name="changeVersion" data-tests-id="changeVersion"
  46                             data-ng-disabled="$parent.isViewOnly || selectedComponent.uniqueId != editResourceVersion.allVersions[editResourceVersion.changeVersion] || selectedComponent.archived"
  47                             class="i-sdc-designer-sidebar-section-content-item-value i-sdc-form-select"
  48                             data-ng-class="{'minor': (editResourceVersion.changeVersion)%1, 'disabled':selectedComponent.archived}"
  49                             data-ng-change="onChangeResourceVersion()">
  50                         <option class="select-instance-version" data-ng-class="{'minor': key%1}"
  51                                 ng-repeat="(key, value) in editResourceVersion.allVersions">{{key}}</option>
  52                     </select></ng-form>
  53             </div>
  54             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.categories && selectedComponent.categories[0]">
  55                 <span class="i-sdc-designer-sidebar-section-content-item-label">Category:</span>
  56                 <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.categories[0].name"
  57                         tooltips tooltip-content="&#8203;{{selectedComponent.categories[0].name}}"
  58                         data-tests-id="rightTab_category"></span>
  59             </div>
  60             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.categories && selectedComponent.categories[0] && selectedComponent.categories[0].subcategories">
  61                 <span class="i-sdc-designer-sidebar-section-content-item-label">Sub Category:</span>
  62                 <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.categories[0].subcategories[0].name"
  63                       tooltips tooltip-content="&#8203;{{selectedComponent.categories[0].subcategories[0].name}}"
  64                       data-tests-id="rightTab_subCategory"></span>
  65             </div>
  66             <div class="i-sdc-designer-sidebar-section-content-item">
  67                 <span class="i-sdc-designer-sidebar-section-content-item-label">Creation Date:</span>
  68                 <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.creationDate | date: 'MM/dd/yyyy'"
  69                       data-tests-id="rightTab_creationDate"></span>
  70             </div>
  71             <div class="i-sdc-designer-sidebar-section-content-item">
  72                 <span class="i-sdc-designer-sidebar-section-content-item-label">Author:</span>
  73                 <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.creatorFullName"
  74                       tooltips tooltip-content="&#8203;{{selectedComponent.creatorFullName}}"
  75                       data-tests-id="rightTab_author">
  76                 </span>
  77             </div>
  78             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.isService()">
  79                 <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_PROJECT_CODE"></span>
  80                 <span class="i-sdc-designer-sidebar-section-content-item-value"
  81                       data-tests-id="rightTab_projectCode" data-ng-bind="selectedComponent.projectCode"></span>
  82             </div>
  83             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.isResource()">
  84                 <span class="i-sdc-designer-sidebar-section-content-item-label">Vendor Name:</span>
  85                 <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.vendorName"
  86                       tooltips tooltip-content="&#8203;{{selectedComponent.vendorName}}"
  87                       data-tests-id="rightTab_vendorName">
  88                 </span>
  89             </div>
  90             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.isResource()">
  91                 <span class="i-sdc-designer-sidebar-section-content-item-label">Vendor Release:</span>
  92                 <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.vendorRelease"
  93                       tooltips tooltip-class="tooltip-custom break-word-tooltip" tooltip-content="&#8203;{{selectedComponent.vendorRelease}}"
  94                       data-tests-id="rightTab_vendorRelease">
  95                 </span>
  96             </div>
  97             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.isResource()">
  98                 <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_RESOURCE_MODEL_NUMBER"></span>
  99                 <span class="i-sdc-designer-sidebar-section-content-item-value vendor-model-number" data-ng-bind="selectedComponent.resourceVendorModelNumber"
 100                       tooltips tooltip-class="tooltip-custom break-word-tooltip" tooltip-content="&#8203;{{selectedComponent.resourceVendorModelNumber}}"
 101                       data-tests-id="rightTab_resourceVendorModelNumber">
 102                 </span>
 103             </div>
 104             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.isService()">
 105                 <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_SERVICE_TYPE"></span>
 106                 <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.serviceType"
 107                       tooltips tooltip-class="tooltip-custom break-word-tooltip" tooltip-content="&#8203;{{selectedComponent.serviceType}}"
 108                       data-tests-id="rightTab_serviceType">
 109                 </span>
 110             </div>
 111             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="selectedComponent.isService()">
 112                 <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_SERVICE_ROLE"></span>
 113                 <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.serviceRole"
 114                       tooltips tooltip-class="tooltip-custom break-word-tooltip" tooltip-content="&#8203;{{selectedComponent.serviceRole}}"
 115                       data-tests-id="rightTab_serviceRole">
 116                 </span>
 117             </div>
 118             <div class="i-sdc-designer-sidebar-section-content-item">
 119                 <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_CONTACT_ID"></span>
 120                 <span class="i-sdc-designer-sidebar-section-content-item-value" data-ng-bind="selectedComponent.contactId"
 121                       data-tests-id="rightTab_contactId"></span>
 122             </div>
 123
 124             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="isComponentInstanceSelected() && currentComponent.selectedInstance.isServiceProxy()">
 125                 <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_SOURCE_SERVICE_NAME"></span>
 126                 <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}}"
 127                       data-tests-id="rightTab_sourceModelName"></span>
 128             </div>
 129
 130             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-if="isViewMode() && currentComponent.isService() && selectedComponent.isResource()">
 131                 <span class="i-sdc-designer-sidebar-section-content-item-label" translate="GENERAL_LABEL_RESOURCE_CUSTOMIZATION_UUID"></span><br>
 132                 <span class="customization-uuid selectable" data-ng-bind="currentComponent.selectedInstance.customizationUUID"
 133                       data-tests-id="rightTab_customizationModuleUUID"></span><br>
 134             </div>
 135             <div class="i-sdc-designer-sidebar-section-content-item description">
 136                 <span class="i-sdc-designer-sidebar-section-content-item-label">Description:
 137
 138                     <span class="i-sdc-designer-sidebar-section-content-description-item-value" ellipsis="selectedComponent.description" max-chars="55"
 139                           data-tests-id="rightTab_description"></span>
 140                 </span>
 141             </div>
 142
 143         </div>
 144     </div>
 145
 146     <div class="w-sdc-designer-sidebar-section additionalInformation">
 147         <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content.additionalInformation" class="w-sdc-designer-sidebar-section-title">
 148             Additional Information
 149             <div class="w-sdc-designer-sidebar-section-title-icon"></div>
 150         </expand-collapse>
 151
 152         <div class="w-sdc-designer-sidebar-section-content additionalInformation">
 153             <div class="i-sdc-designer-sidebar-section-content-item" data-ng-repeat="additionalInformation in selectedComponent.getAdditionalInformation() track by $index">
 154                 <span class="i-sdc-designer-sidebar-section-content-item-label additional-information" data-ng-bind="additionalInformation.key" tooltips tooltip-content="{{additionalInformation.key}}"></span>
 155                <span class="i-sdc-designer-sidebar-section-content-item-label">:</span>
 156                 <span class="i-sdc-designer-sidebar-section-content-item-value additional-information" data-ng-bind="additionalInformation.value"
 157                       tooltips tooltip-class="tooltip-custom break-word-tooltip" tooltip-content="{{additionalInformation.value}}"></span>
 158             </div>
 159         </div>
 160     </div>
 161
 162
 163     <div class="w-sdc-designer-sidebar-section tags">
 164         <expand-collapse expanded-selector=".w-sdc-designer-sidebar-section-content.tags" class="w-sdc-designer-sidebar-section-title">
 165             Tags
 166             <div class="w-sdc-designer-sidebar-section-title-icon"></div>
 167         </expand-collapse>
 168
 169         <div class="w-sdc-designer-sidebar-section-content tags">
 170             <div class="i-sdc-designer-sidebar-section-content-item">
 171                 <span class="i-sdc-designer-sidebar-section-content-item-tag" data-ng-if="selectedComponent.tags.indexOf(selectedComponent.name)===-1" data-ng-bind="selectedComponent.name"
 172                       data-tests-id="rightTab_tag" tooltips tooltip-content="{{selectedComponent.name}}"></span>
 173                 <span class="i-sdc-designer-sidebar-section-content-item-tag" data-ng-repeat="tag in selectedComponent.tags track by $index" data-ng-bind="tag"
 174                 data-tests-id="rightTab_tag" tooltips tooltip-content="{{tag}}"></span>
 175             </div>
 176         </div>
 177     </div>
 178     </div>
 179
 180 </perfect-scrollbar>
 181