groupbasedpolicy-ui/module/src/main/resources/gbp/resolved-policy/epg-sidepanel.tpl.html

   1 <md-content>
   2         <div ng-if="selectedNode == null">
   3                 <div layout="row" class="layout-padding-lr15 layout-row">
   4                         <ul class="breadcrumbs">
   5                                 <li class="breadcrumb">Endpoint-groups</li>
   6                         </ul>
   7                 </div>
   8                 <md-divider></md-divider>
   9                 <md-divider></md-divider>
  10             <md-subheader class="md-primary">Endpoint-groups ({{sidePanelObject.length}})</md-subheader>
  11             <md-list>
  12                 <ng-repeat ng-repeat="epg in sidePanelObject">
  13                         <md-list-item class="md-2-line"
  14                               ng-click="openSidePanel('resolved-policy/epg-sidepanel', epg, null)"
  15                               ng-mouseenter="highlightNode(epg.id)"
  16                               ng-mouseleave="fadeAll()">
  17                     <div class="md-list-item-text" flex>
  18                         <h3>{{epg.id}}</h3>
  19                     </div>
  20                         </md-list-item>
  21                 </ng-repeat>
  22             </md-list>
  23         </div>
  24         <div ng-if="selectedNode">
  25                 <div layout="row" class="layout-padding-lr15 layout-row">
  26                         <ul class="breadcrumbs">
  27                                 <li class="breadcrumb" ng-click="deselectEpg()" role="button">Endpoint-groups</li>
  28                                 <li class="breadcrumb"><i class="material-icons">keyboard_arrow_right</i></li>
  29                                 <li class="breadcrumb">{{sidePanelObject.id}}</li>
  30                         </ul>
  31                 </div>
  32                 <md-divider></md-divider>
  33                 <md-divider></md-divider>
  34                 <md-subheader class="md-primary">Endpoint-group info</md-subheader>
  35                 <div layout="row" class="layout-padding-lr15 layout-row">
  36                     <span flex="50" class="flex-50"><strong>Endpoint-group ID</strong></span>
  37                     <span flex="" class="ng-binding flex">{{sidePanelObject.id}}</span>
  38                 </div>
  39                 <md-divider></md-divider>
  40                 <div ng-if="sidePanelObject['provided-contracts'].length">
  41                     <md-subheader class="md-primary">Provided contracts ({{sidePanelObject['provided-contracts'].length}})</md-subheader>
  42                     <md-list>
  43                 <md-list-item class="md-2-line"
  44                               ng-click="openSidePanelContract(providedContract);"
  45                               ng-repeat="providedContract in sidePanelObject['provided-contracts']">
  46                     <div class="md-list-item-text" flex>
  47                         <h3>{{providedContract}}</h3>
  48                     </div>
  49                 </md-list-item>
  50                     </md-list>
  51             </div>
  52                 <div ng-if="sidePanelObject['consumed-contracts'].length">
  53                     <md-subheader class="md-primary">Consumed contracts ({{sidePanelObject['consumed-contracts'].length}})</md-subheader>
  54                     <md-list>
  55                 <md-list-item class="md-2-line"
  56                               ng-click="openSidePanelContract(consumedContract);"
  57                               ng-repeat="consumedContract in sidePanelObject['consumed-contracts']">
  58                     <div class="md-list-item-text" flex>
  59                         <h3>{{consumedContract}}</h3>
  60                     </div>
  61                 </md-list-item>
  62                     </md-list>
  63             </div>
  64             <md-divider></md-divider>
  65             <md-subheader class="md-primary">
  66                 <div layout="row" class="layout-row">
  67                         <span>Endpoints ({{endpoints.data.length}})</span>
  68                 </div>
  69             </md-subheader>
  70             <md-list class="expander">
  71                         <md-list-item class="md-3-line" layout="row" ng-repeat="endpoint in endpoints.data">
  72                                 <div layout-padding flex="15">
  73                                         <h3>{{endpoint.getEndpointContextTypeAcronym()}}</h3>
  74                                         <md-tooltip md-direction="right">{{endpoint.data['context-type']}}</md-tooltip>
  75                                 </div>
  76                                 <div class="md-list-item-text" flex>
  77                                         <h3>{{endpoint.data['context-id']}}</h3>
  78                                         <p>Address: {{endpoint.data.address}} </p>
  79                                         <p>Network Domain: {{endpoint.data['network-containment']['network-domain-id']}} </p>
  80                     <p>SGT: {{endpointSgtList.findSgtsForEndpoint(endpoint)}} </p>
  81                                 </div>
  82                                 <div flex="10">
  83                                         <md-button class="md-icon-button" ng-click="rootOpenEndpointDialog('edit', endpoint)">
  84                                                 <md-icon>edit</md-icon>
  85                                         </md-button>
  86                                 </div>
  87                                 <div flex="10">
  88                                         <md-button class="md-icon-button" ng-click="rootDeleteEndpointDialog(endpoint)">
  89                                                 <md-icon>delete</md-icon>
  90                                         </md-button>
  91                                 </div>
  92                         </md-list-item>
  93             </md-list>
  94     </div>
  95 </md-content>