catalog-ui/src/app/view-models/dashboard/dashboard-view.html

   1
   2 <div class="sdc-catalog-container">
   3     <loader data-display="isLoading"></loader>
   4     <!-- HEADER -->
   5 <!--
   6     <ecomp-header menu-data="menuItems" version="{{version}}"></ecomp-header>
   7 -->
   8
   9     <div class="w-sdc-main-container">
  10
  11         <perfect-scrollbar include-padding="true" class="w-sdc-main-right-container">
  12
  13             <div class='w-sdc-row-flex-items'>
  14
  15                 <!-- ADD Component -->
  16                 <div ng-if="user.role === 'DESIGNER'" class="w-sdc-dashboard-card-new"
  17                     data-ng-mouseleave="displayActions = false"
  18                     data-ng-mouseover="displayActions = true"
  19                     data-ng-init="displayActions = false">
  20                     <div class="w-sdc-dashboard-card-new-content" data-tests-id="AddButtonsArea">
  21                         <div class="w-sdc-dashboard-card-new-content-plus" data-ng-show="!displayActions"></div>
  22                         <div class="sdc-dashboard-create-element-container" data-ng-show="displayActions">
  23                             <button data-ng-if="roles[user.role].dashboard.showCreateNew" data-tests-id="createResourceButton" class="tlv-btn outline blue" data-ng-click="openCreateModal('RESOURCE')">Add VF</button>
  24                             <button data-ng-if="roles[user.role].dashboard.showCreateNew" data-tests-id="createPNFButton" class="tlv-btn outline blue" data-ng-click="createPNF()">Add PNF</button>
  25                             <button data-ng-if="roles[user.role].dashboard.showCreateNew" data-tests-id="createServiceButton" class="tlv-btn outline blue" data-ng-click="openCreateModal('SERVICE')">Add Service</button>
  26                         </div>
  27                     </div>
  28                 </div>
  29
  30                 <!-- Import Component -->
  31                 <div ng-if="user.role === 'DESIGNER'" class="w-sdc-dashboard-card-new"
  32                     data-ng-mouseleave="displayActions = false"
  33                     data-ng-mouseover="displayActions = true"
  34                     data-ng-init="displayActions = false">
  35                     <div class="w-sdc-dashboard-card-new-content" data-tests-id="importButtonsArea"  >
  36                         <div class="w-sdc-dashboard-card-import-content-plus" data-ng-show="!displayActions"></div>
  37                         <div class="sdc-dashboard-import-element-container" data-ng-show="displayActions">
  38                             <div data-ng-if="roles[user.role].dashboard.showCreateNew" class="tlv-btn outline blue">Import VFC
  39                                 <file-opener on-file-upload="onImportVfc(file)" data-tests-id="importVFCbutton" extensions="{{sdcConfig.toscaFileExtension}}" data-ng-click="displayActions=false"></file-opener>
  40                             </div>
  41                             <div data-ng-if="roles[user.role].dashboard.showCreateNew" class="tlv-btn outline blue" data-ng-click="notificationIconCallback()">Import VSP</div>
  42                             <div data-ng-if="roles[user.role].dashboard.showCreateNew" class="tlv-btn outline blue import-dcae">Import DCAE asset
  43                                 <file-opener on-file-upload="onImportVf(file)" data-tests-id="importVFbutton" extensions="{{sdcConfig.csarFileExtension}}" data-ng-click="displayActions=false"></file-opener>
  44                             </div>
  45                         </div>
  46                     </div>
  47                 </div>
  48
  49                 <!-- Tile new -->
  50                 <div class="sdc-tile-catalog sdc-tile-fix-width" data-ng-repeat="component in components | filter:{resourceType:('!'+vfcmtType)} | entityFilter:checkboxesFilter | filter:search">
  51
  52                     <div class="sdc-tile-header">
  53                         <div class='sdc-tile-header-type' data-ng-class="{'purple': component.isResource(), 'blue': !component.isResource()}">
  54                             <div data-ng-if="component.isResource()" data-tests-id="asset-type">{{component.getComponentSubType()}}</div>
  55                             <div data-ng-if="component.isService()">S</div>
  56                         </div>
  57                     </div>
  58                     <div class='sdc-tile-content' data-tests-id="dashboard-Elements" data-ng-click="goToComponent(component)">
  59                         <div class='sdc-tile-content-icon'>
  60                             <div class="{{component.iconSprite}} {{component.icon}}"
  61                                 data-ng-class="{'sprite-resource-icons': component.isResource(), 'sprite-services-icons': component.isService()}"
  62                                 data-tests-id="{{component.name}}"></div>
  63                         </div>
  64                         <div class='sdc-tile-content-info'>
  65                             <div class="sdc-tile-content-info-item-name" data-tests-id="{{component.name | resourceName}}" sdc-smart-tooltip>{{component.name | resourceName}}</div>
  66                             <div class="sdc-tile-content-info-version-info">
  67                                 <div class="sdc-tile-content-info-version-info-text" data-tests-id="{{component.name}}Version">V {{component.version}}</div>
  68                             </div>
  69                         </div>
  70                     </div>
  71                     <div class='sdc-tile-footer'>
  72                         <div class='sdc-tile-footer-text'>{{component.getStatus(sdcMenu)}}</div>
  73                     </div>
  74
  75                 </div>
  76                 <!-- Tile new -->
  77
  78             </div>
  79
  80         </perfect-scrollbar>
  81
  82         <div class="w-sdc-left-sidebar">
  83             <div class="i-sdc-left-sidebar-item "
  84                  data-ng-repeat="folder in folders.getFolders()"
  85                  data-ng-class="{'category-title': folder.isGroup(), 'selectedLink': folder.isSelected()}"
  86                  >
  87                 <span data-ng-if="folder.isGroup()">{{folder.text}}</span>
  88
  89                 <sdc-checkbox data-ng-if="!folder.isGroup() && !folder.dist"
  90                               elem-id="checkbox-{{folder.text | lowercase | clearWhiteSpaces}}"
  91                               sdc-checklist-model="checkboxesFilter.selectedStatuses"
  92                               sdc-checklist-value="folder.state"
  93                               text="{{folder.text}}"></sdc-checkbox>
  94
  95                 <sdc-checkbox data-ng-if="!folder.isGroup() && folder.dist"
  96                               elem-id="checkbox-{{folder.text | lowercase | clearWhiteSpaces}}"
  97                               sdc-checklist-model="checkboxesFilter.distributed"
  98                               sdc-checklist-value="folder.dist"
  99                               text="{{folder.text}}"></sdc-checkbox>
 100                 <span class="i-sdc-left-sidebar-item-state-count">{{entitiesCount(folder)}}</span>
 101             </div>
 102         </div>
 103
 104     </div>
 105
 106     <top-nav top-lvl-selected-index="0" version="{{version}}" search-bind="search.filterTerm" notification-icon-callback="notificationIconCallback" version="{{version}}"></top-nav>
 107
 108 </div>
 109 <div data-ui-view=""></div>
 110
 111
 112 <ecomp-footer></ecomp-footer>