sdnr/wireless-transport/code-Carbon-SR1/ux/mwtnBrowser/mwtnBrowser-module/src/main/resources/mwtnBrowser/templates/frame.tpl.html

   1 <ht-header help-link='sdnr/pnfConfig/0.4.0/README.md'></ht-header>
   2 <mwtn-select-network-element></mwtn-select-network-element>
   3
   4 <div class="owl container" ng-if="networkElements.length !== 0 && networkElement" style="width: 100%;">
   5   <div class="row">
   6     <uib-accordion close-others="oneAtATime">
   7       <div class="col-md-12">
   8         <div uib-accordion-group class="panel-primary" is-open="status.ne">
   9           <uib-accordion-heading>
  10             <i class="fa" ng-class="{'fa-chevron-down': status.ne, 'fa-chevron-right': !status.ne}"></i>
  11             <span>{{'MWTN_NETWORKELEMENT' | translate}} '{{onfNetworkElement.getName()}}' </span>
  12             <span> (#{{'MWTN_LTPS' | translate}}: {{onfNetworkElement.getLogicalTerminationPoints().length}})</span>
  13             <i class="fa fa-spinner fa-pulse" ng-show="spinner.ne"></i>
  14           </uib-accordion-heading>
  15           <mwtn-json-viewer network-element="networkElement" data="onfNetworkElement.getData()" ne="true" ng-if="status.ne"></mwtn-json-viewer>
  16           <br/>
  17
  18           <uib-accordion close-others="oneAtATime">
  19             <div uib-accordion-group class="panel-default" is-open="status.neCurrentProblems" ng-if="neCurrentProblems">
  20               <uib-accordion-heading>
  21                 <i class="fa" ng-class="{'fa-chevron-down': status.neCurrentProblems, 'fa-chevron-right': !status.neCurrentProblems}"></i>
  22                 <span>{{'MWTN_CURRENT_PROBLEM_LIST' | translate}}</span>
  23                 <i class="fa fa-spinner fa-pulse" ng-show="spinner.neCurrentProblems"></i>
  24               </uib-accordion-heading>
  25
  26               <mwtn-grid network-element="networkElement" data="neCurrentProblems" ng-if="neCurrentProblems && !spinner.neCurrentProblems"></mwtn-grid>
  27             </div>
  28
  29             <div uib-accordion-group class="panel-default" is-open="status.forwardingDomain" ng-show="forwardingDomain">
  30               <uib-accordion-heading>
  31                 <i class="fa" ng-class="{'fa-chevron-down': status.forwardingDomain, 'fa-chevron-right': !status.forwardingDomain}"></i>
  32                 <span>{{'MWTN_FORWARDING_DOMAIN' | translate}}</span>
  33                 <i class="fa fa-spinner fa-pulse" ng-show="spinner.forwardingDomain"></i>
  34               </uib-accordion-heading>
  35
  36               <mwtn-json-viewer network-element="networkElement" data="forwardingDomain" ng-if="status.forwardingDomain"></mwtn-json-viewer>
  37             </div>
  38
  39             <div uib-accordion-group class="panel-default" is-open="status.forwardingConstructs" ng-show="forwardingConstructs">
  40               <uib-accordion-heading>
  41                 <i class="fa" ng-class="{'fa-chevron-down': status.forwardingConstructs, 'fa-chevron-right': !status.forwardingConstructs}"></i>
  42                 <span>{{'MWTN_FORWARDING_CONSTRUCTS' | translate}}</span>
  43                 <i class="fa fa-spinner fa-pulse" ng-show="spinner.forwardingConstructs"></i>
  44               </uib-accordion-heading>
  45
  46               <mwtn-grid network-element="networkElement" data="forwardingConstructs" ng-if="forwardingConstructs && !spinner.forwardingConstructs"></mwtn-grid>
  47
  48               <!-- create fc -->
  49               <div class="row">
  50                 <div class="col col-md-3">
  51                   <label class="owl-dark" for="vlan">{{'MWTN_LTP1' | translate}}</label><br/>
  52                   <select class="form-control" ng-model="fcCreation.ltp1">
  53                     <option ng-repeat="ltp in forwardingDomain.ltp" value="{{ltp}}">{{ltp}}</option>
  54                   </select>
  55                 </div>
  56                 <div class="col col-md-3">
  57                   <label class="owl-dark" for="vlan">{{'MWTN_LTP2' | translate}}</label><br/>
  58                   <select class="form-control" ng-model="fcCreation.ltp2">
  59                     <option ng-repeat="ltp in forwardingDomain.ltp" value="{{ltp}}">{{ltp}}</option>
  60                   </select>
  61                 </div>
  62                 <div class="col col-md-1 form-group">
  63                   <label class="owl-dark" for="vlan">{{'MWTN_SERVICE_ID' | translate}}</label><br/>
  64                   <input class="form-control" type="number" value="42" id="example-number-input" ng-model="fcCreation.vlan">
  65                 </div>
  66                 <div class="col col-md-2">
  67                   <label style="color:white;" for="create">create</label><br/>
  68                   <button type="button" class="btn btn-warning" ng-click="createForwardingConstruct()">
  69                       <i class="fa fa-plus" aria-hidden="true"></i>
  70                       <span style="color:white;">{{'MWTN_CREATE' | translate}}</span>
  71                   </button>
  72                 </div>
  73                 <div class="col col-md-3">
  74                   <span class="owl-dark" ng-if="!fcCreation.error">{{fcCreation.info}}</span>
  75                   <span class="error" ng-if="fcCreation.error">{{fcCreation.error}}</span>
  76                 </div>
  77               </div>
  78
  79               <!-- delete fc -->
  80               <div class="row">
  81                 <div class="col col-md-6 form-group">
  82                   <label class="owl-dark" for="vlan">{{'MWTN_FC_UUID' | translate}}</label><br/>
  83                   <select class="form-control" ng-model="fcDeletion.ltp">
  84                     <option ng-repeat="fc in forwardingConstructs" value="{{fc.uuid}}">{{fc.uuid}}</option>
  85                   </select>
  86                 </div>
  87                 <div class="col col-md-2 col-md-offset-1" >
  88                   <label style="color:white;" for="delete">delete</label><br/>
  89                   <button type="button" class="btn btn-danger" ng-click="deleteForwardingConstruct()">
  90                       <i class="fa fa-times" aria-hidden="true"></i>
  91                       <span style="color:white;">{{'MWTN_DELETE' | translate}}</span>
  92                   </button>
  93                 </div>
  94                 <div class="col col-md-3">
  95                   <span class="owl-dark" ng-if="!fcDeletion.error">{{fcDeletion.info}}</span>
  96                   <span class="error" ng-if="fcDeletion.error">{{fcDeletion.error}}</span>
  97                 </div>
  98               </div>
  99
 100             </div>
 101
 102             <div ng-repeat="ltp in onfLtps" ng-show="status.ne" uib-accordion-group class="panel-default" is-open="status['ltp' + separator + ltp.getData().uuid]">
 103               <uib-accordion-heading>
 104                 <i class="fa" ng-class="{'fa-chevron-down': status['ltp' + separator + ltp.getData().uuid], 'fa-chevron-right': !status['ltp' + separator + ltp.getData().uuid]}"></i>
 105                 <span>{{'MWTN_LTP' | translate}}(</span>
 106                 <b>{{ltp.getLayerProtocols()[0].getItuLabel().toUpperCase()}}</b>
 107                 <span>): {{ltp.getName()}} (ID: {{ltp.getId()}})</span>
 108               </uib-accordion-heading>
 109
 110               <mwtn-json-viewer network-element="networkElement" data="ltp.getData()" ng-if="status['ltp' + separator + ltp.getData().uuid]"></mwtn-json-viewer>
 111             </div>
 112           </uib-accordion>
 113         </div>
 114
 115         <div uib-accordion-group class="panel-default" is-open="status.clock" ng-if="clock">
 116           <uib-accordion-heading>
 117             <i class="fa" ng-class="{'fa-chevron-down': status.clock, 'fa-chevron-right': !status.clock}"></i>
 118             <span>{{'MWTN_CLOCK' | translate}}</span>
 119             <i class="fa fa-spinner fa-pulse" ng-show="spinner.clock"></i>
 120           </uib-accordion-heading>
 121
 122           <!-- <mwtn-json-viewer network-element="networkElement" data="clock.getData()" ng-if="clock.getData() && !spinner.clock"></mwtn-json-viewer> -->
 123           <mwtn-ptp-clock-viewer network-element="networkElement" data="clock.getData()" ng-if="clock.getData() && !spinner.clock"></mwtn-ptp-clock-viewer>
 124         </div>
 125
 126
 127       </div>
 128
 129
 130     </uib-accordion>
 131   </div>
 132
 133   <div class="row" ng-repeat="orderedPac in orderedPacs" ng-if="pacs[orderedPac]">
 134     <uib-accordion close-others="oneAtATime">
 135       <div ng-class="{ 'col-md-12': pacs[orderedPac].length === 1, 'col-md-6': pacs[orderedPac].length !== 1 }" style="margin-top: 5px;"
 136         ng-repeat="pac in pacs[orderedPac]">
 137         <div uib-accordion-group class="panel-primary" is-open="status[ [orderedPac, pac['layer-protocol']].join(separator) ]">
 138           <uib-accordion-heading>
 139             <i class="fa" ng-class="{'fa-chevron-down': status[ [orderedPac, pac['layer-protocol']].join(separator) ], 'fa-chevron-right': !status[ [orderedPac, pac['layer-protocol']].join(separator) ]}"></i>
 140             <span>{{ ['mwtn', orderedPac].join('-').replaceAll('-', '_').toUpperCase() | translate }} '{{pac['layer-protocol']}}'</span>
 141           </uib-accordion-heading>
 142
 143           <div ng-repeat="part in parts" uib-accordion-group class="panel-default" is-open="status[ [orderedPac, pac['layer-protocol'], pac[part].id].join(separator) ]">
 144             <uib-accordion-heading>
 145               <i class="fa" ng-class="{'fa-chevron-down': status[ [orderedPac, pac['layer-protocol'], pac[part].id].join(separator) ], 'fa-chevron-right': !status[ [orderedPac, pac['layer-protocol'], pac[part].id].join(separator) ]}"></i>
 146               <span>{{ ['mwtn', part].join('-').replaceAll('-', '_').toUpperCase() | translate}}</span>
 147               <i class="fa fa-spinner fa-pulse" ng-show="spinner[ [orderedPac, pac['layer-protocol'], pac[part].id].join(separator) ]"></i>
 148             </uib-accordion-heading>
 149
 150
 151             <!-- current-problem-list -->
 152             <mwtn-grid network-element="networkElement" data="pac[part].data['current-problem-list']" ng-if="pac[part].data['current-problem-list'] && !spinner[ [orderedPac, pac['layer-protocol'], pac[part].id].join(separator) ]"></mwtn-grid>
 153             <div ng-if="pac[part].data['current-problem-list'].length === 0">Alarm free ;)</div>
 154
 155             <!-- PM Current -->
 156             <mwtn-json-viewer network-element="networkElement" data="pac[part].data['current-performance-data-list'][0]"
 157                               path="[orderedPac, pac['layer-protocol'], pac[part].id].join(separator)"
 158                               ng-if="part === 'current-performance' && pac[part].data && !spinner[ [orderedPac, pac['layer-protocol'], pac[part].id].join(separator) ]"></mwtn-json-viewer>
 159             <hr ng-if="part === 'current-performance' && pac[part].data && !spinner[ [orderedPac, pac['layer-protocol'], pac[part].id].join(separator) ]">
 160             <mwtn-json-viewer network-element="networkElement" data="pac[part].data['current-performance-data-list'][1]"
 161                               path="[orderedPac, pac['layer-protocol'], pac[part].id].join(separator)"
 162                               ng-if="part === 'current-performance' && pac[part].data && !spinner[ [orderedPac, pac['layer-protocol'], pac[part].id].join(separator) ]"></mwtn-json-viewer>
 163
 164             <!-- PM history -->
 165             <mwtn-grid network-element="networkElement" data="pac[part].data['historical-performance-data-list']"
 166                        path="[orderedPac, pac['layer-protocol'], pac[part].id].join(separator)"
 167                        ng-if="pac[part].data['historical-performance-data-list'] && !spinner[ [orderedPac, pac['layer-protocol'], pac[part].id].join(separator) ]"></mwtn-grid>
 168
 169             <!-- else -->
 170             <mwtn-json-viewer network-element="networkElement" data="pac[part].data"
 171                               path="[orderedPac, pac['layer-protocol'], pac[part].id].join(separator)"
 172                               ng-if="status[ [orderedPac, pac['layer-protocol'], pac[part].id].join(separator)] &&
 173                                     pac[part].data &&
 174                                     part !== 'current-problems' &&
 175                                     part !== 'current-performance' &&
 176                                     part !== 'historical-performances' &&
 177                                     !spinner[ [orderedPac, pac['layer-protocol'], pac[part].id].join(separator) ]"></mwtn-json-viewer>
 178
 179           </div>
 180         </div>
 181       </div>
 182       <hr class="white">
 183     </uib-accordion>
 184   </div>
 185
 186 </div>
 187
 188 <hr />
 189 <div class="owl">
 190         <span class="white">ONAP SDN-R | ONF Wireless for @distversion@ - Build: @buildtime@</span>
 191 </div>