Commit c4e931730a3243381e44071858fe79721c7381ca
1 parent
632c4ac2ff
Exists in
master
add vessel list
Showing 5 changed files with 46 additions and 3 deletions Side-by-side Diff
src/app/component/app.component.html
View file @
c4e9317
src/app/component/import-vessels/import-vessels.component.ts
View file @
c4e9317
src/app/component/list-vessel/list-vessel.component.html
View file @
c4e9317
1 | + | |
2 | +<div class="list-group border" id="list-tab" role="tablist"> | |
3 | + <h2 class="side-title">Vessel</h2> | |
4 | + <a *ngFor="let vessel of vessels | keyvalue" class=" list-group-item list-group-item-action" id="{{vessel.value.mmsi}}" | |
5 | + data-toggle="list" role="tab"> | |
6 | + {{vessel.value.mmsi}} - {{vessel.value.vesselName}} | |
7 | + </a> | |
8 | +</div> |
src/app/component/list-vessel/list-vessel.component.scss
View file @
c4e9317
1 | +h2.side-title { | |
2 | + margin-right: 0; | |
3 | + margin-bottom: 10px; | |
4 | + padding: 10px; | |
5 | + font-size: 20px; | |
6 | + color: #333; | |
7 | + text-transform: uppercase; | |
8 | +} | |
9 | + | |
10 | +h2.side-title:after { | |
11 | + content: ''; | |
12 | + width: 60px; | |
13 | + height: 1px; | |
14 | + background: #ff173c; | |
15 | + display: block; | |
16 | + margin-top: 6px; | |
17 | +} | |
18 | + | |
19 | +.list-group { | |
20 | + margin-right: 80%; | |
21 | + height: 94.7vh; | |
22 | +} |
src/app/component/list-vessel/list-vessel.component.ts
View file @
c4e9317
1 | -import { Component, OnInit } from '@angular/core'; | |
1 | +import {Component, OnInit} from '@angular/core'; | |
2 | +import {Vessel} from '../../model/vessel'; | |
3 | +import {VesselsService} from '../../service/vessels.service'; | |
2 | 4 | |
3 | 5 | @Component({ |
4 | 6 | selector: 'app-list-vessel', |
5 | 7 | |
6 | 8 | |
7 | 9 | |
... | ... | @@ -6,11 +8,17 @@ |
6 | 8 | styleUrls: ['./list-vessel.component.scss'] |
7 | 9 | }) |
8 | 10 | export class ListVesselComponent implements OnInit { |
11 | + vessels: Map<number, Vessel>; | |
9 | 12 | |
10 | - constructor() { } | |
11 | 13 | |
12 | - ngOnInit(): void { | |
14 | + constructor(private vesselsService: VesselsService) { | |
13 | 15 | } |
14 | 16 | |
17 | + ngOnInit(): void { | |
18 | + this.vesselsService.currentVessels.subscribe(vessels => { | |
19 | + this.vessels = vessels; | |
20 | + console.log(this.vessels); | |
21 | + }); | |
22 | + } | |
15 | 23 | } |