gateway-admin-ui/src/app/topology.component.ts

/*
 * Licensed to the Apache Software Foundation (ASF) under one or more
 * contributor license agreements.  See the NOTICE file distributed with
 * this work for additional information regarding copyright ownership.
 * The ASF licenses this file to You 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.
 */
import { Component, OnInit } from '@angular/core';
import { Topology } from './topology';
import { TopologyService } from './topology.service';
import { Subscription }   from 'rxjs/Subscription';


@Component({
    selector: 'topology',
    template: `
        <div class="table-responsive" style="max-height: 400px; width:100%; overflow: auto;">
            <table class="table table-striped table-hover">
              <thead>
                <tr>
                  <th>Topology Name</th>
                  <th>Timestamp</th>
                </tr>
              </thead>
         <tbody>
         <tr *ngFor="let topology of topologies"
          [class.selected]="topology === selectedTopology"
        (click)="onSelect(topology)">
         <td>{{topology.name}}</td> 
         <td>{{topology.timestamp | date:'medium'}}</td> 
         </tr>
        </tbody>
        </table>
        </div>
       `
})
export class TopologyComponent implements OnInit {

    value :any;
    topologies: Topology[];
    selectedTopology: Topology;


    constructor(private topologyService : TopologyService) {
    }

    getTopologies(): void {
        this.topologyService.getTopologies().then(topologies => this.topologies = topologies);
    }

    ngOnInit(): void {
        this.getTopologies();
        this.topologyService.changedTopology$.subscribe(value => this.getTopologies());
    }

    onSelect(topology: Topology): void {
        this.selectedTopology = topology;
        this.topologyService.selectedTopology(topology);
    }
}