blob: 7c7e32c7612d58190a4fccdb80446f5e0e108da9 [file] [log] [blame]
<!--
~ Copyright 2018-present Open Networking Foundation
~
~ Licensed under the Apache License, Version 2.0 (the "License");
~ you may not use this file except in compliance with the License.
~ You may obtain a copy of the License at
~
~ http://www.apache.org/licenses/LICENSE-2.0
~
~ Unless required by applicable law or agreed to in writing, software
~ distributed under the License is distributed on an "AS IS" BASIS,
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
<div id="ov-host">
<div class="tabular-header">
<h2>Hosts ({{tableData.length}} total)</h2>
<div class="ctrl-btns">
<div class="refresh" (click)="toggleRefresh()">
<!-- See icon.theme.css for the defintions of the classes active and refresh-->
<onos-icon classes="{{ autoRefresh?'active refresh':'refresh' }}" iconId="refresh" iconSize="42" toolTip="{{ autoRefreshTip }}"></onos-icon>
</div>
</div>
</div>
<div class="summary-list" onosTableResize>
<div class="table-header">
<table>
<tr>
<td colId="type" class="table-icon"></td>
<td colId="name" (click)="onSort('name')">Friendly Name
<onos-icon classes="active-sort" [iconSize]="10" [iconId]="sortIcon('name')"></onos-icon>
</td>
<td colId="id" (click)="onSort('id')">Host ID
<onos-icon classes="active-sort" [iconSize]="10" [iconId]="sortIcon('id')"></onos-icon>
</td>
<td colId="mac" (click)="onSort('mac')">MAC Address
<onos-icon classes="active-sort" [iconSize]="10" [iconId]="sortIcon('mac')"></onos-icon>
</td>
<td colId="vlan" (click)="onSort('vlan')">VLAN ID
<onos-icon classes="active-sort" [iconSize]="10" [iconId]="sortIcon('vlan')"></onos-icon>
</td>
<td colId="configured" (click)="onSort('configured')">Configured
<onos-icon classes="active-sort" [iconSize]="10" [iconId]="sortIcon('configured')"></onos-icon>
</td>
<td colId="ips" (click)="onSort('ips')">IP Addresses
<onos-icon classes="active-sort" [iconSize]="10" [iconId]="sortIcon('ips')"></onos-icon>
</td>
<td colId="location" (click)="onSort('location')">Location
<onos-icon classes="active-sort" [iconSize]="10" [iconId]="sortIcon('location')"></onos-icon>
</td>
</tr>
</table>
</div>
<div class="table-body">
<table>
<tr *ngIf="tableData.length === 0" class="no-data">
<td colspan="8">{{ annots.noRowsMsg }}</td>
</tr>
<tr *ngFor="let host of tableData" (click)="selectCallback($event, host)" [ngClass]="{selected: host.id === selId, 'data-change': isChanged(host.id)}">
<td class="table-icon">
<onos-icon classes="{{host._iconid_type? 'active-type':undefined}}" iconId="{{host._iconid_type}}"></onos-icon>
</td>
<td>{{host.name}}</td>
<td>{{host.id}}</td>
<td>{{host.mac}}</td>
<td>{{host.vlan}}</td>
<td>{{host.configured}}</td>
<td>{{host.ips}}</td>
<td>{{host.location}}</td>
</tr>
</table>
</div>
</div>
<onos-hostdetails class="floatpanels" id="{{ selId }}" (closeEvent)="deselectRow($event)"></onos-hostdetails>
</div>