frontend/inventory/schemas.component.html

<div class="netopeer-content">

<div class="items_manipulation">
  <button (click)="getSchemas()">Refresh</button>
  <button (click)="showAddSchema()">Add</button>
  <div *ngIf="addingSchema">
    <hr/>
    <div class="buttons">
      <input #uploadSchema type="file" (change)="upload(uploadSchema.files[0])" name="schema" placeholder="Upload schema"/>      
      <span [ngSwitch]="addingResult">
        <span *ngSwitchCase="0" class="msg-rounded msg-failure"><span class="msg-close" (click)="addingResult=-1">x</span>Parsing {{uploadSchema.value.replace("C:\\fakepath\\","")}} failed.</span>
        <span *ngSwitchCase="1" class="msg-rounded msg-success"><span class="msg-close" (click)="addingResult=-1">x</span>Schema {{uploadSchema.value.replace("C:\\fakepath\\","")}} successfully added.</span>
      </span>
    </div>
  </div>
  <hr/>
</div>

<table class="items">
  <tr class="item_header">
    <th class="item_left">&nbsp;</th>
    <th>name</th>
    <th class="item_right">revision</th>
  </tr>
  <tr class="item" [class.selected]="schema === selectedSchema" *ngFor="let schema of schemas">
    <td class="item_left item_actions">
        <img class="item_action_delete" (click)="remove(schema)"
            src="assets/netopeer/icons/close.svg" alt="x" title="delete"
            onmouseover="this.src='assets/netopeer/icons/close_active.svg'"
            onmouseout="this.src='assets/netopeer/icons/close.svg'"/>
    </td>
    <td class="schema schema-name" (click)="onSelect(schema)">{{schema.name}}</td>
    <td class="item_right schema schema-revision" (click)="onSelect(schema)">{{schema.revision}}</td>
  </tr>
</table>

<div *ngIf="selectedSchema">
  <h3>{{selectedSchema.name}}<span *ngIf="selectedSchema.revision">@{{selectedSchema.revision}}</span></h3>
</div>

</div>