Commit c125d276 authored by Vitali Stupin's avatar Vitali Stupin
Browse files

Adding router, creating subsystem view

parent d3c734e2
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MethodListComponent } from './method-list/method-list.component';
import { SubsystemComponent } from './subsystem/subsystem.component';
const routes: Routes = [
{ path: '', redirectTo: '/list', pathMatch: 'full' },
{ path: 'list', component: MethodListComponent },
{ path: 'subsystem/:id', component: SubsystemComponent },
];
@NgModule({
imports: [ RouterModule.forRoot(routes, {scrollPositionRestoration: 'enabled'}) ],
exports: [ RouterModule ]
})
export class AppRoutingModule {}
\ No newline at end of file
......@@ -8,8 +8,9 @@
<p>Subsystems with the <span class="badge badge-danger">Error</span> icon either could not be reached by RIA's Monitoring Security Server or there was some other error during the request.</p>
<p>Support: <a href="mailto:help@ria.ee">help@ria.ee</a></p>
<app-search></app-search>
<router-outlet></router-outlet>
<!--<app-search></app-search>
<app-method-list></app-method-list>
<app-method-list></app-method-list>-->
</div>
\ No newline at end of file
......@@ -8,18 +8,22 @@ import { AppComponent } from './app.component';
import { MethodListComponent } from './method-list/method-list.component';
import { SearchComponent } from './search/search.component';
import { SubsystemItemComponent } from './method-list/subsystem-item/subsystem-item.component';
import { AppRoutingModule } from './app-routing.module';
import { SubsystemComponent } from './subsystem/subsystem.component';
@NgModule({
declarations: [
AppComponent,
MethodListComponent,
SearchComponent,
SubsystemItemComponent
SubsystemItemComponent,
SubsystemComponent
],
imports: [
BrowserModule,
HttpClientModule,
FormsModule
FormsModule,
AppRoutingModule
],
providers: [],
bootstrap: [AppComponent]
......
<div class="card" *ngFor="let subsystem of subsystems">
<app-search></app-search>
<div *ngFor="let subsystem of subsystems">
<app-subsystem-item [subsystem]="subsystem"></app-subsystem-item>
</div>
......@@ -13,6 +13,7 @@ export class MethodListComponent implements OnInit {
constructor(private methodsService: MethodsService) { }
ngOnInit() {
this.getMethods();
// Service will tell when updated data is available!
this.methodsService.subsystemsUpdated.subscribe(signal => {
this.getMethods();
......
<div class="card-header pointerCursor" (click)="isHidden = !isHidden">
<div class="card">
<div class="card-header pointerCursor" (click)="showDetail()">
{{subsystem.fullSubsystemName}}
<span class="badge badge-secondary" *ngIf="!subsystem.methods.length && subsystem.subsystemStatus == 'OK'">Empty</span>
<span class="badge badge-danger" *ngIf="subsystem.subsystemStatus == 'ERROR'">Error</span>
</div>
<div class="card-body" [hidden]="isHidden" *ngIf="!subsystem.methods.length">
<p>No services found</p>
<div class="card-body" *ngIf="subsystem.subsystemStatus == 'ERROR'">
<p>Subsystem either could not be reached by RIA's Monitoring Security Server
or there was some other error during the request.</p>
</div>
<div class="card-body" [hidden]="isHidden" *ngIf="subsystem.methods.length">
<p *ngFor="let method of subsystem.methods">
<div class="card-body" *ngIf="subsystem.subsystemStatus == 'OK' && !subsystem.methods.length">
<p>Subsystem does not have any methods.</p>
</div>
<div class="card-body" *ngIf="subsystem.subsystemStatus == 'OK' && subsystem.methods.length">
<p *ngFor="let method of getMethodsPreview()">
{{method.fullMethodName}}
<a href="{{methodsService.apiUrlBase}}{{method.wsdl}}" class="badge badge-success"
*ngIf="method.wsdl">WSDL</a>
*ngIf="method.wsdl" [target]="'_blank'">WSDL</a>
<span class="badge badge-danger" *ngIf="!method.wsdl">Error while downloading or parsing of WSDL</span>
</p>
<p *ngIf="getNotInPreview() > 0" class="pointerCursor" (click)="showDetail()">
{{getNotInPreview()}} more methods...
</p>
</div>
</div>
\ No newline at end of file
import { Component, OnInit, Input } from '@angular/core';
import { Subsystem } from '../../subsystem';
import { Method } from '../../method';
import { MethodsService } from '../../methods.service';
import { Router } from '@angular/router';
@Component({
selector: 'app-subsystem-item',
......@@ -9,26 +11,29 @@ import { MethodsService } from '../../methods.service';
})
export class SubsystemItemComponent implements OnInit {
@Input() subsystem: Subsystem;
isHidden: boolean = true;
@Input() subsystem: Subsystem
private previewSize: number = 5
constructor(private methodsService: MethodsService) {
// Service will tell when detail should be opened or closed
this.methodsService.hideDetails.subscribe(signal => {
if (signal) {
this.isHidden = true
} else if (this.subsystem.methods.length) {
// Force opening only subsystems with methods
this.isHidden = false
}
});
}
constructor(
private methodsService: MethodsService,
private router: Router
) { }
ngOnInit() {
// New component asks service if detail should be opened or closed
if (this.subsystem.methods.length) {
// Force opening only subsystems with methods
this.isHidden = this.methodsService.getHideDetails()
}
getMethodsPreview(): Method[] {
return this.subsystem.methods.length ? this.subsystem.methods.slice(0, this.previewSize) : []
}
getNotInPreview(): number {
if (this.subsystem.methods.length - this.previewSize < 0) {
return 0
}
return this.subsystem.methods.length - this.previewSize
}
showDetail() {
this.router.navigateByUrl('/subsystem/' + encodeURIComponent(this.subsystem.fullSubsystemName))
}
}
......@@ -5,6 +5,8 @@ import { catchError } from 'rxjs/operators';
import { Subsystem } from './subsystem';
import { Method } from './method';
const MAX_LIMIT: number = 1000000;
@Injectable({
providedIn: 'root'
})
......@@ -18,7 +20,8 @@ export class MethodsService {
private filter: string = "";
private apiService = 'index.json';
private apiUrl = this.apiUrlBase + this.apiService;
private subsystems: Subsystem[];
private subsystems: Subsystem[] = [];
private loadingDone: boolean = false;
@Output() subsystemsUpdated: EventEmitter<any> = new EventEmitter();
@Output() hideDetails: EventEmitter<boolean> = new EventEmitter();
......@@ -30,6 +33,7 @@ export class MethodsService {
).subscribe(subsystems => {
this.subsystems = subsystems;
this.setFullNames();
this.loadingDone = true;
this.signalRefresh();
})
}
......@@ -99,6 +103,25 @@ export class MethodsService {
}
}
getLimit(): string {
if (this.limit == MAX_LIMIT) {
return 'All'
}
return this.limit.toString()
}
getNonEmpty(): boolean {
return this.nonEmpty
}
getfilter(): string {
return this.filter
}
isLoadingDone(): boolean {
return this.loadingDone
}
getMethods(): Subsystem[] {
return this.filteredSubsystems();
}
......@@ -117,7 +140,7 @@ export class MethodsService {
this.limit = 50;
break;
case 'All':
this.limit = 1000000;
this.limit = MAX_LIMIT;
break;
default:
this.limit = 10;
......@@ -139,6 +162,12 @@ export class MethodsService {
}
}
getSubsystem(name: string): Subsystem {
return this.subsystems.find(function(element) {
return element.fullSubsystemName === name;
})
}
getHideDetails(): boolean {
if (this.filter == '') {
return true
......
......@@ -8,13 +8,16 @@ import { MethodsService } from '../methods.service';
})
export class SearchComponent implements OnInit {
nonEmpty: boolean = false
limit: string = '10'
filter: string = ''
limit: string
nonEmpty: boolean
filter: string
constructor(private methodsService: MethodsService) { }
ngOnInit() {
this.limit = this.methodsService.getLimit()
this.nonEmpty = this.methodsService.getNonEmpty()
this.filter = this.methodsService.getfilter()
}
setNonEmpty(nonEmpty: boolean) {
......
<div *ngIf="loadingDone() && subsystem">
<div class="card">
<div class="card-header">
{{subsystem.fullSubsystemName}}
<span class="badge badge-secondary" *ngIf="!subsystem.methods.length && subsystem.subsystemStatus == 'OK'">Empty</span>
<span class="badge badge-danger" *ngIf="subsystem.subsystemStatus == 'ERROR'">Error</span>
</div>
<div class="card-body" *ngIf="subsystem.subsystemStatus == 'ERROR'">
<p>Subsystem either could not be reached by RIA's Monitoring Security Server
or there was some other error during the request.</p>
</div>
<div class="card-body" *ngIf="subsystem.subsystemStatus == 'OK' && !subsystem.methods.length">
<p>Subsystem does not have any methods.</p>
</div>
<div class="card-body" *ngIf="subsystem.subsystemStatus == 'OK' && subsystem.methods.length">
<p *ngFor="let method of subsystem.methods">
{{method.fullMethodName}}
<a href="{{methodsService.apiUrlBase}}{{method.wsdl}}" class="badge badge-success"
*ngIf="method.wsdl" [target]="'_blank'">WSDL</a>
<span class="badge badge-danger" *ngIf="!method.wsdl">Error while downloading or parsing of WSDL</span>
</p>
</div>
</div>
</div>
<div *ngIf="loadingDone() && !subsystem">
<p>
Subsystem "{{subsystemId}}" cannot be found!
</p>
</div>
<button type="button" class="btn btn-secondary" (click)="goToList()">Show all subsystems</button>
\ No newline at end of file
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { SubsystemComponent } from './subsystem.component';
describe('SubsystemComponent', () => {
let component: SubsystemComponent;
let fixture: ComponentFixture<SubsystemComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ SubsystemComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(SubsystemComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit } from '@angular/core';
import { MethodsService } from '../methods.service';
import { Subsystem } from '../subsystem';
import { ActivatedRoute, Router } from '@angular/router';
//import { Location } from '@angular/common';
@Component({
selector: 'app-subsystem',
templateUrl: './subsystem.component.html',
styleUrls: ['./subsystem.component.css']
})
export class SubsystemComponent implements OnInit {
subsystem: Subsystem
subsystemId: string
constructor(
private methodsService: MethodsService,
private route: ActivatedRoute,
private router: Router
//private location: Location
) { }
ngOnInit() {
this.getSubsystem()
}
loadingDone():boolean {
return this.methodsService.isLoadingDone()
}
getSubsystem() {
this.subsystemId = this.route.snapshot.paramMap.get('id')
this.subsystem = this.methodsService.getSubsystem(this.subsystemId)
// Service will tell when updated data is available!
this.methodsService.subsystemsUpdated.subscribe(signal => {
this.subsystem = this.methodsService.getSubsystem(this.subsystemId)
});
}
goToList(): void {
//this.location.back();
this.router.navigateByUrl('/list')
}
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment