indentation
This commit is contained in:
parent
5d861c406a
commit
73ade91f43
|
@ -10,19 +10,19 @@ import { DsmSearchComponent, DsmResultsComponent, DsmApiComponent } from './dsm/
|
|||
import { MdstoreInspectorComponent, MdstoresComponent } from './mdstores/mdstores.component';
|
||||
|
||||
const routes: Routes = [
|
||||
{ path:"" , redirectTo:'info', pathMatch: 'full' },
|
||||
{ path:"info" , component:InfoComponent },
|
||||
{ path:"resources/:type" , component:ResourcesComponent },
|
||||
{ path:"adv_resources/context" , component:ContextsComponent },
|
||||
{ path:"adv_resources/vocabulary" , component:VocabulariesComponent },
|
||||
{ path:"adv_resources/protocol" , component:ProtocolsComponent },
|
||||
{ path:"wf_history" , component:WfHistoryComponent },
|
||||
{ path:"ctx_viewer" , component:ContextViewerComponent },
|
||||
{ path:"voc_editor" , component:VocabularyEditorComponent },
|
||||
{ path:"dsm/search" , component:DsmSearchComponent },
|
||||
{ path:"dsm/results/:page/:size" , component:DsmResultsComponent },
|
||||
{ path:"mdstores" , component:MdstoresComponent },
|
||||
{ path:"mdrecords/:versionId/:limit" , component:MdstoreInspectorComponent }
|
||||
{ path: "", redirectTo: 'info', pathMatch: 'full' },
|
||||
{ path: "info", component: InfoComponent },
|
||||
{ path: "resources/:type", component: ResourcesComponent },
|
||||
{ path: "adv_resources/context", component: ContextsComponent },
|
||||
{ path: "adv_resources/vocabulary", component: VocabulariesComponent },
|
||||
{ path: "adv_resources/protocol", component: ProtocolsComponent },
|
||||
{ path: "wf_history", component: WfHistoryComponent },
|
||||
{ path: "ctx_viewer", component: ContextViewerComponent },
|
||||
{ path: "voc_editor", component: VocabularyEditorComponent },
|
||||
{ path: "dsm/search", component: DsmSearchComponent },
|
||||
{ path: "dsm/results/:page/:size", component: DsmResultsComponent },
|
||||
{ path: "mdstores", component: MdstoresComponent },
|
||||
{ path: "mdrecords/:versionId/:limit", component: MdstoreInspectorComponent }
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
|
|
|
@ -1,17 +1,17 @@
|
|||
.sidenav-container {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.sidenav {
|
||||
.sidenav {
|
||||
width: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
.sidenav .mat-toolbar {
|
||||
.sidenav .mat-toolbar {
|
||||
background: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.mat-toolbar.mat-primary {
|
||||
.mat-toolbar.mat-primary {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -21,4 +21,3 @@
|
|||
</div>
|
||||
</mat-sidenav-content>
|
||||
</mat-sidenav-container>
|
||||
|
||||
|
|
|
@ -18,7 +18,6 @@ export class AppComponent {
|
|||
shareReplay()
|
||||
);
|
||||
|
||||
constructor(private breakpointObserver: BreakpointObserver, public spinnerService: SpinnerService) {}
|
||||
constructor(private breakpointObserver: BreakpointObserver, public spinnerService: SpinnerService) { }
|
||||
|
||||
}
|
||||
|
||||
|
|
|
@ -100,6 +100,6 @@ import { MdstoresComponent, MdstoreInspectorComponent, MDStoreVersionsDialog, Ad
|
|||
useClass: SpinnerHttpInterceptor,
|
||||
multi: true
|
||||
}],
|
||||
bootstrap: [ AppComponent ]
|
||||
bootstrap: [AppComponent]
|
||||
})
|
||||
export class AppModule { }
|
||||
|
|
|
@ -14,7 +14,7 @@ export class SpinnerService {
|
|||
constructor() { this.visibility = new BehaviorSubject(false); }
|
||||
|
||||
show() { this.visibility.next(true); }
|
||||
hide() { this.visibility.next(false);}
|
||||
hide() { this.visibility.next(false); }
|
||||
}
|
||||
|
||||
@Injectable()
|
||||
|
|
|
@ -14,25 +14,29 @@
|
|||
|
||||
<ul>
|
||||
<li *ngFor="let cat of categories" class="context-node">
|
||||
<a (click)="populateNode(0, cat)" *ngIf="!(cat.populated || cat.nChilds == 0)" style="margin-right: 0.5em;">[+{{cat.nChilds}}]</a>
|
||||
<a (click)="populateNode(0, cat)" *ngIf="!(cat.populated || cat.nChilds == 0)"
|
||||
style="margin-right: 0.5em;">[+{{cat.nChilds}}]</a>
|
||||
<a title="{{cat.label}}" (click)="showParamsDialog(cat.parameters)" style="margin-right: 0.5em;">{{cat.id}}</a>
|
||||
<span class="badge-label badge-info" *ngIf="cat.claim">claim</span>
|
||||
|
||||
<ul *ngIf="cat.childs && cat.childs.length > 0">
|
||||
<li *ngFor="let c0 of cat.childs" class="context-node">
|
||||
<a (click)="populateNode(1, c0)" *ngIf="!(c0.populated || c0.nChilds == 0)" style="margin-right: 0.5em;">[+{{c0.nChilds}}]</a>
|
||||
<a (click)="populateNode(1, c0)" *ngIf="!(c0.populated || c0.nChilds == 0)"
|
||||
style="margin-right: 0.5em;">[+{{c0.nChilds}}]</a>
|
||||
<a title="{{c0.label}" (click)="showParamsDialog(c0.parameters)" style="margin-right: 0.5em;">{{c0.id}}</a>
|
||||
<span class="badge-label badge-info" *ngIf="c0.claim">claim</span>
|
||||
|
||||
<ul *ngIf="c0.childs && c0.childs.length > 0">
|
||||
<li *ngFor="let c1 of c0.childs" class="context-node">
|
||||
<a (click)="populateNode(2, c1)" *ngIf="!(c1.populated || c1.nChilds == 0)" style="margin-right: 0.5em;">[+{{c1.nChilds}}]</a>
|
||||
<a (click)="populateNode(2, c1)" *ngIf="!(c1.populated || c1.nChilds == 0)"
|
||||
style="margin-right: 0.5em;">[+{{c1.nChilds}}]</a>
|
||||
<a title="{{c1.label}}" (click)="showParamsDialog(c1.parameters)" style="margin-right: 0.5em;">{{c1.id}}</a>
|
||||
<span class="badge-label badge-info" *ngIf="c1.claim">claim</span>
|
||||
|
||||
<ul *ngIf="c1.childs && c1.childs.length > 0">
|
||||
<li *ngFor="let c2 of c1.childs" class="context-node">
|
||||
<a title="{{c2.label}}" (click)="showParamsDialog(c2.parameters)" style="margin-right: 0.5em;">{{c2.id}}</a>
|
||||
<a title="{{c2.label}}" (click)="showParamsDialog(c2.parameters)"
|
||||
style="margin-right: 0.5em;">{{c2.id}}</a>
|
||||
<span class="badge-label badge-info" *ngIf="c2.claim">claim</span>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
|
@ -1,4 +1,3 @@
|
|||
|
||||
.context-node {
|
||||
padding-top: 1em;
|
||||
}
|
||||
|
|
|
@ -8,19 +8,22 @@
|
|||
<table mat-table [dataSource]="contextsDatasource" matSort class="mat-elevation-z8">
|
||||
|
||||
<ng-container matColumnDef="id">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 20%;" mat-sort-header sortActionDescription="Sort by Context ID"> Id </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 20%;" mat-sort-header
|
||||
sortActionDescription="Sort by Context ID"> Id </th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
<a [routerLink]="['/ctx_viewer']" [queryParams]="{id: element.id}">{{element.id}}</a>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="label">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 40%;" mat-sort-header sortActionDescription="Sort by Context Label"> Label </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 40%;" mat-sort-header
|
||||
sortActionDescription="Sort by Context Label"> Label </th>
|
||||
<td mat-cell *matCellDef="let element"> {{element.label}} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="type">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 10%;" mat-sort-header sortActionDescription="Sort by Context Type"> Type </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 10%;" mat-sort-header
|
||||
sortActionDescription="Sort by Context Type"> Type </th>
|
||||
<td mat-cell *matCellDef="let element"> {{element.type}} </td>
|
||||
</ng-container>
|
||||
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { Component, Inject,AfterViewInit, OnInit, ViewChild } from '@angular/core';
|
||||
import { Component, Inject, AfterViewInit, OnInit, ViewChild } from '@angular/core';
|
||||
import { ISService } from '../common/is.service';
|
||||
import { MatTableDataSource } from '@angular/material/table';
|
||||
import { MatSort } from '@angular/material/sort';
|
||||
|
@ -11,7 +11,7 @@ import { MatDialog, MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dial
|
|||
templateUrl: './contexts.component.html',
|
||||
styleUrls: ['./contexts.component.css']
|
||||
})
|
||||
export class ContextsComponent implements AfterViewInit ,OnInit {
|
||||
export class ContextsComponent implements AfterViewInit, OnInit {
|
||||
contextsDatasource: MatTableDataSource<Context> = new MatTableDataSource<Context>([]);
|
||||
|
||||
colums: string[] = ['id', 'label', 'type', 'buttons'];
|
||||
|
@ -26,7 +26,7 @@ export class ContextsComponent implements AfterViewInit ,OnInit {
|
|||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
if(this.sort) this.contextsDatasource.sort = this.sort;
|
||||
if (this.sort) this.contextsDatasource.sort = this.sort;
|
||||
}
|
||||
|
||||
reload() {
|
||||
|
@ -69,8 +69,8 @@ export class ContextParamsDialog {
|
|||
})
|
||||
export class ContextViewerComponent implements OnInit {
|
||||
|
||||
context?:Context
|
||||
categories:ContextNode[] = [];
|
||||
context?: Context
|
||||
categories: ContextNode[] = [];
|
||||
|
||||
constructor(public service: ISService, public route: ActivatedRoute, public dialog: MatDialog) {
|
||||
}
|
||||
|
@ -78,18 +78,18 @@ export class ContextViewerComponent implements OnInit {
|
|||
ngOnInit() {
|
||||
this.route.queryParams.subscribe((params) => {
|
||||
this.service.loadContext(params['id'], (data: Context) => this.context = data);
|
||||
this.service.loadContextCategories(params['id'], (data:ContextNode[]) => this.categories = data);
|
||||
this.service.loadContextCategories(params['id'], (data: ContextNode[]) => this.categories = data);
|
||||
});
|
||||
}
|
||||
|
||||
populateNode(level:number, node:ContextNode): void {
|
||||
this.service.loadContextConcepts(level, node.id, (data:ContextNode[]) => {
|
||||
populateNode(level: number, node: ContextNode): void {
|
||||
this.service.loadContextConcepts(level, node.id, (data: ContextNode[]) => {
|
||||
node.populated = true;
|
||||
node.childs = data
|
||||
});
|
||||
}
|
||||
|
||||
showParamsDialog(params:ContextParam[] | undefined): void {
|
||||
showParamsDialog(params: ContextParam[] | undefined): void {
|
||||
if (params) {
|
||||
this.dialog.open(ContextParamsDialog, {
|
||||
data: params,
|
||||
|
|
|
@ -62,14 +62,14 @@
|
|||
<input matInput formControlName="baseurl" />
|
||||
<mat-error *ngIf="addApiForm.get('baseurl')?.invalid">
|
||||
Invalid URL
|
||||
<span *ngIf="addApiForm.get('baseurl')?.hasError('required')">: This field is <strong>required</strong></span>
|
||||
<span *ngIf="addApiForm.get('baseurl')?.hasError('required')">: This field is
|
||||
<strong>required</strong></span>
|
||||
</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
<ng-container *ngFor="let p of selProtParams">
|
||||
<ng-container *ngIf="!p.hasSelFunction">
|
||||
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;"
|
||||
*ngIf="p.type != 'BOOLEAN'">
|
||||
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;" *ngIf="p.type != 'BOOLEAN'">
|
||||
<mat-label>
|
||||
<b>{{selectedProtocol}}</b> - {{p.label}}
|
||||
<b *ngIf="p.type == 'LIST'">(Comma separeted values)</b>
|
||||
|
@ -78,8 +78,7 @@
|
|||
<input matInput [formControlName]="paramPrefix + p.name" />
|
||||
<mat-error *ngIf="addApiForm.get(paramPrefix + p.name)?.invalid">Invalid value</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;"
|
||||
*ngIf="p.type == 'BOOLEAN'">
|
||||
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;" *ngIf="p.type == 'BOOLEAN'">
|
||||
<mat-label><b>{{selectedProtocol}}</b> - {{p.label}} <b>(true/false)</b></mat-label>
|
||||
<mat-select matInput [formControlName]="paramPrefix + p.name">
|
||||
<mat-option></mat-option>
|
||||
|
@ -91,7 +90,8 @@
|
|||
</ng-container>
|
||||
|
||||
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;" *ngIf="p.hasSelFunction">
|
||||
<mat-label><b>{{selectedProtocol}}</b> - {{p.label}} <b *ngIf="p.type == 'LIST'">(multiple choice)</b></mat-label>
|
||||
<mat-label><b>{{selectedProtocol}}</b> - {{p.label}} <b *ngIf="p.type == 'LIST'">(multiple
|
||||
choice)</b></mat-label>
|
||||
<mat-select matInput [formControlName]="paramPrefix + p.name" [multiple]="p.type == 'LIST'">
|
||||
<mat-option *ngIf="p.type != 'LIST'"></mat-option>
|
||||
<mat-option value="0">0 - TODO</mat-option>
|
||||
|
|
|
@ -9,14 +9,17 @@
|
|||
<table mat-table [dataSource]="datasource" matSort class="mat-elevation-z8">
|
||||
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 70%;" mat-sort-header sortActionDescription="Sort by Term">Name</th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 70%;" mat-sort-header sortActionDescription="Sort by Term">
|
||||
Name</th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
<a [routerLink]="['/dsm/results/0/50']" [queryParams]="{field: data.field, value: element.term}" mat-dialog-close>{{element.name}}</a>
|
||||
<a [routerLink]="['/dsm/results/0/50']" [queryParams]="{field: data.field, value: element.term}"
|
||||
mat-dialog-close>{{element.name}}</a>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="total">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 30%;" mat-sort-header sortActionDescription="Sort by Total"> # datasources </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 30%;" mat-sort-header sortActionDescription="Sort by Total"> #
|
||||
datasources </th>
|
||||
<td mat-cell *matCellDef="let element"> {{element.total}} </td>
|
||||
</ng-container>
|
||||
|
||||
|
|
|
@ -11,13 +11,8 @@
|
|||
<input matInput [(ngModel)]="filterText" placeholder="Filter..." autofocus />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-paginator (page)="changePage($event)"
|
||||
[pageIndex]="currPage"
|
||||
[pageSize]="pageSize"
|
||||
[length]="nResults"
|
||||
[pageSize]="pageSize"
|
||||
[pageSizeOptions]="[10, 25, 50, 100]"
|
||||
aria-label="Select page">
|
||||
<mat-paginator (page)="changePage($event)" [pageIndex]="currPage" [pageSize]="pageSize" [length]="nResults"
|
||||
[pageSize]="pageSize" [pageSizeOptions]="[10, 25, 50, 100]" aria-label="Select page">
|
||||
</mat-paginator>
|
||||
|
||||
<mat-card *ngFor="let r of results | searchFilter: filterText" style="margin-top: 10px;">
|
||||
|
@ -44,14 +39,16 @@
|
|||
<td>{{r.collectedFrom}}</td>
|
||||
</tr>
|
||||
<tr *ngIf="r.websiteUrl">
|
||||
<th>URL</th><td><a href="{{r.websiteUrl}}" target="_blank">{{r.websiteUrl}}</a></td>
|
||||
<th>URL</th>
|
||||
<td><a href="{{r.websiteUrl}}" target="_blank">{{r.websiteUrl}}</a></td>
|
||||
</tr>
|
||||
<tr *ngIf="r.organizations && r.organizations.length > 0">
|
||||
<th>Organization(s)</th>
|
||||
<td>
|
||||
<span *ngFor="let o of r.organizations">
|
||||
{{o.name}}
|
||||
<img src="assets/images/flags/{{o.country}}.gif" title="{{o.country}}" alt="{{o.country}}" *ngIf="o.country"/>
|
||||
<img src="assets/images/flags/{{o.country}}.gif" title="{{o.country}}" alt="{{o.country}}"
|
||||
*ngIf="o.country" />
|
||||
<br />
|
||||
</span>
|
||||
</td>
|
||||
|
@ -67,7 +64,7 @@
|
|||
<span class="badge-label badge-success" *ngIf="a.active">active</span>
|
||||
<span class="badge-label badge-failure" *ngIf="!a.active">not active</span>
|
||||
<span *ngIf="a.aggrDate">
|
||||
<br/>
|
||||
<br />
|
||||
<b>Last aggregation:</b>
|
||||
{{a.aggrDate}}
|
||||
<b>(total: {{a.aggrTotal}})</b>
|
||||
|
@ -97,11 +94,6 @@
|
|||
|
||||
|
||||
|
||||
<mat-paginator (page)="changePage($event)"
|
||||
[pageIndex]="currPage"
|
||||
[pageSize]="pageSize"
|
||||
[length]="nResults"
|
||||
[pageSize]="pageSize"
|
||||
[pageSizeOptions]="[10, 25, 50, 100]"
|
||||
aria-label="Select page">
|
||||
<mat-paginator (page)="changePage($event)" [pageIndex]="currPage" [pageSize]="pageSize" [length]="nResults"
|
||||
[pageSize]="pageSize" [pageSizeOptions]="[10, 25, 50, 100]" aria-label="Select page">
|
||||
</mat-paginator>
|
|
@ -15,4 +15,3 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -7,7 +7,8 @@
|
|||
border-bottom: 1pt solid lightgrey;
|
||||
}
|
||||
|
||||
.dsm-result-table th, .dsm-result-table td{
|
||||
.dsm-result-table th,
|
||||
.dsm-result-table td {
|
||||
text-align: left;
|
||||
font-size: 0.9em;
|
||||
vertical-align: top;
|
||||
|
|
|
@ -17,8 +17,8 @@ import { MatSelectChange } from '@angular/material/select';
|
|||
styleUrls: ['./dsm.component.css']
|
||||
})
|
||||
export class DsmSearchComponent implements OnInit {
|
||||
searchText:string = '';
|
||||
browsableFields:KeyValue[] = [];
|
||||
searchText: string = '';
|
||||
browsableFields: KeyValue[] = [];
|
||||
|
||||
constructor(public service: ISService, public route: ActivatedRoute, public router: Router, public dialog: MatDialog) {
|
||||
}
|
||||
|
@ -33,7 +33,7 @@ export class DsmSearchComponent implements OnInit {
|
|||
});
|
||||
}
|
||||
|
||||
browseField(field:string, label:string) {
|
||||
browseField(field: string, label: string) {
|
||||
const dialogRef = this.dialog.open(DsmBrowseDialog, {
|
||||
data: { field: field, label: label },
|
||||
width: '80%'
|
||||
|
@ -48,23 +48,23 @@ export class DsmSearchComponent implements OnInit {
|
|||
styleUrls: ['./dsm.component.css']
|
||||
})
|
||||
export class DsmResultsComponent implements OnInit {
|
||||
filterText:string = '';
|
||||
results:Datasource[] = [];
|
||||
nResults:number = 0;
|
||||
currPage:number = 0;
|
||||
nPages:number = 0;
|
||||
pageSize:number = 0;
|
||||
field?:string;
|
||||
value:string = '';
|
||||
filterText: string = '';
|
||||
results: Datasource[] = [];
|
||||
nResults: number = 0;
|
||||
currPage: number = 0;
|
||||
nPages: number = 0;
|
||||
pageSize: number = 0;
|
||||
field?: string;
|
||||
value: string = '';
|
||||
|
||||
constructor(public service: ISService, public route: ActivatedRoute, public router: Router, public dialog: MatDialog) {
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
combineLatest([ this.route.params, this.route.queryParams ],
|
||||
combineLatest([this.route.params, this.route.queryParams],
|
||||
(params: Params, queryParams: Params) => ({ params, queryParams })
|
||||
).subscribe((res: { params: Params; queryParams: Params }) => {
|
||||
const { params, queryParams} = res;
|
||||
const { params, queryParams } = res;
|
||||
this.currPage = parseInt(params['page']);
|
||||
this.pageSize = parseInt(params['size']);
|
||||
this.field = queryParams['field'];
|
||||
|
@ -75,13 +75,13 @@ export class DsmResultsComponent implements OnInit {
|
|||
|
||||
reload() {
|
||||
if (this.field) {
|
||||
this.service.dsmSearchByField(this.field, this.value, this.currPage, this.pageSize, (page:Page<Datasource>) => {
|
||||
this.service.dsmSearchByField(this.field, this.value, this.currPage, this.pageSize, (page: Page<Datasource>) => {
|
||||
this.results = page.content;
|
||||
this.nResults = page.totalElements;
|
||||
this.nPages = page.totalPages;
|
||||
});
|
||||
} else {
|
||||
this.service.dsmSearch(this.value, this.currPage, this.pageSize, (page:Page<Datasource>) => {
|
||||
this.service.dsmSearch(this.value, this.currPage, this.pageSize, (page: Page<Datasource>) => {
|
||||
this.results = page.content;
|
||||
this.nResults = page.totalElements;
|
||||
this.nPages = page.totalPages;
|
||||
|
@ -100,7 +100,7 @@ export class DsmResultsComponent implements OnInit {
|
|||
});
|
||||
}
|
||||
|
||||
openAddApiDialog(dsId:string, dsName:string) {
|
||||
openAddApiDialog(dsId: string, dsName: string) {
|
||||
const dialogRef = this.dialog.open(DsmAddApiDialog, {
|
||||
data: { dsId: dsId, dsName: dsName },
|
||||
width: '80%'
|
||||
|
@ -138,7 +138,7 @@ export class DsmBrowseDialog implements OnInit {
|
|||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.service.dsmBrowse(this.data.field, (res:BrowseTerm[]) => this.datasource.data = res);
|
||||
this.service.dsmBrowse(this.data.field, (res: BrowseTerm[]) => this.datasource.data = res);
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
|
@ -162,30 +162,30 @@ export class DsmBrowseDialog implements OnInit {
|
|||
styleUrls: ['./dsm.component.css']
|
||||
})
|
||||
export class DsmAddApiDialog {
|
||||
selectedProtocol:string = '';
|
||||
selectedProtocol: string = '';
|
||||
|
||||
apiPrefix:string = '';
|
||||
paramPrefix:string = '__PARAM_';
|
||||
apiPrefix: string = '';
|
||||
paramPrefix: string = '__PARAM_';
|
||||
|
||||
protocols:string[] = [];
|
||||
compatibilityLevels:string[] = [];
|
||||
contentDescTypes:string[] = [];
|
||||
protocols: string[] = [];
|
||||
compatibilityLevels: string[] = [];
|
||||
contentDescTypes: string[] = [];
|
||||
|
||||
protocolsMap:any = {};
|
||||
selProtParams:ProtocolParam[] = [];
|
||||
protocolsMap: any = {};
|
||||
selProtParams: ProtocolParam[] = [];
|
||||
|
||||
addApiForm:FormGroup = new FormGroup({
|
||||
addApiForm: FormGroup = new FormGroup({
|
||||
apiIdSuffix: new FormControl('', [Validators.required]),
|
||||
compatibility : new FormControl('', [Validators.required]),
|
||||
contentdescription : new FormControl('', [Validators.required]),
|
||||
protocol : new FormControl('', [Validators.required]),
|
||||
baseurl : new FormControl('', [Validators.required, Validators.pattern('^(http|https|ftp|file|sftp|jar|mongodb):\/\/')]),
|
||||
metadataIdentifierPath : new FormControl('', [Validators.required])
|
||||
compatibility: new FormControl('', [Validators.required]),
|
||||
contentdescription: new FormControl('', [Validators.required]),
|
||||
protocol: new FormControl('', [Validators.required]),
|
||||
baseurl: new FormControl('', [Validators.required, Validators.pattern('^(http|https|ftp|file|sftp|jar|mongodb):\/\/')]),
|
||||
metadataIdentifierPath: new FormControl('', [Validators.required])
|
||||
});
|
||||
|
||||
constructor(public dialogRef: MatDialogRef<DsmAddApiDialog>, @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService) {
|
||||
this.apiPrefix = 'api_________::' + data.dsId + '::';
|
||||
this.service.dsmConf((conf:DsmConf) => {
|
||||
this.service.dsmConf((conf: DsmConf) => {
|
||||
this.compatibilityLevels = conf.compatibilityLevels;
|
||||
this.contentDescTypes = conf.contentDescTypes;
|
||||
conf.protocols.forEach((p) => {
|
||||
|
@ -195,7 +195,7 @@ export class DsmAddApiDialog {
|
|||
});
|
||||
}
|
||||
|
||||
onChangeProtocol(e:MatSelectChange):void {
|
||||
onChangeProtocol(e: MatSelectChange): void {
|
||||
this.selectedProtocol = e.value;
|
||||
|
||||
Object.keys(this.addApiForm.controls).forEach(k => {
|
||||
|
@ -207,7 +207,7 @@ export class DsmAddApiDialog {
|
|||
if (this.protocolsMap[e.value]) {
|
||||
this.selProtParams = this.protocolsMap[e.value];
|
||||
this.selProtParams.forEach(p => {
|
||||
let validations:ValidatorFn[] = [];
|
||||
let validations: ValidatorFn[] = [];
|
||||
if (!p.optional) { validations.push(Validators.required); }
|
||||
if (p.type == 'INT') { validations.push(Validators.pattern('^[0-9]*$')); }
|
||||
this.addApiForm.addControl(this.paramPrefix + p.name, new FormControl('', validations));
|
||||
|
@ -217,8 +217,8 @@ export class DsmAddApiDialog {
|
|||
}
|
||||
}
|
||||
|
||||
onSubmit():void {
|
||||
let api:ApiInsert = {
|
||||
onSubmit(): void {
|
||||
let api: ApiInsert = {
|
||||
id: this.apiPrefix + this.addApiForm.get('apiIdSuffix')?.value,
|
||||
protocol: this.selectedProtocol,
|
||||
datasource: this.data.dsId,
|
||||
|
@ -227,7 +227,7 @@ export class DsmAddApiDialog {
|
|||
compatibility: this.addApiForm.get('compatibility')?.value,
|
||||
metadataIdentifierPath: this.addApiForm.get('metadataIdentifierPath')?.value,
|
||||
baseurl: this.addApiForm.get('baseurl')?.value,
|
||||
apiParams : []
|
||||
apiParams: []
|
||||
};
|
||||
|
||||
Object.keys(this.addApiForm.controls).forEach(k => {
|
||||
|
|
|
@ -15,21 +15,21 @@ export interface KeyValueDatasource {
|
|||
})
|
||||
export class InfoComponent {
|
||||
|
||||
kvDatasources:KeyValueDatasource[] = [];
|
||||
moduleDatasource:MatTableDataSource<Module> = new MatTableDataSource<Module>([]);
|
||||
kvDatasources: KeyValueDatasource[] = [];
|
||||
moduleDatasource: MatTableDataSource<Module> = new MatTableDataSource<Module>([]);
|
||||
|
||||
displayedKVColumns: string[] = ['k', 'v'];
|
||||
displayedModuleColumns: string[] = ['group', 'name', 'versions', 'files'];
|
||||
|
||||
constructor(public service:ISService) {
|
||||
this.service.loadInfo((data:any[]) => {
|
||||
constructor(public service: ISService) {
|
||||
this.service.loadInfo((data: any[]) => {
|
||||
data.forEach(section => {
|
||||
if (section['name'] == 'Modules') {
|
||||
this.moduleDatasource.data = section['data'];
|
||||
} else {
|
||||
this.kvDatasources.push({
|
||||
name: section['name'],
|
||||
datasource : new MatTableDataSource(section['data'])
|
||||
datasource: new MatTableDataSource(section['data'])
|
||||
});
|
||||
}
|
||||
})
|
||||
|
|
|
@ -5,13 +5,21 @@
|
|||
padding-right: 0.4em;
|
||||
border-radius: 1em;
|
||||
color: #fff;
|
||||
background-color:cornflowerblue;
|
||||
background-color: cornflowerblue;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.collapse-buttons { text-align: right; }
|
||||
.collapse-buttons button { font-size: 0.6em; }
|
||||
.mat-expansion-panel-spacing { margin: 0; }
|
||||
.collapse-buttons {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.collapse-buttons button {
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
.mat-expansion-panel-spacing {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
padding-top: 0.3em;
|
||||
|
|
|
@ -12,11 +12,11 @@ import { MatAccordion } from '@angular/material/expansion';
|
|||
export class MainMenuPanelsComponent {
|
||||
|
||||
@ViewChild(MatAccordion)
|
||||
accordion!:MatAccordion;
|
||||
accordion!: MatAccordion;
|
||||
|
||||
resTypes:ResourceType[] = [];
|
||||
resTypes: ResourceType[] = [];
|
||||
|
||||
constructor(public service:ISService) {
|
||||
this.service.loadResourceTypes((data:ResourceType[]) => this.resTypes = data);
|
||||
constructor(public service: ISService) {
|
||||
this.service.loadResourceTypes((data: ResourceType[]) => this.resTypes = data);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
|
||||
<mat-label>ID</mat-label>
|
||||
<input matInput readonly value="{{data.id}}"/>
|
||||
<input matInput readonly value="{{data.id}}" />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
|
||||
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
|
||||
<mat-label>ID</mat-label>
|
||||
<input matInput readonly value="{{data.id}}"/>
|
||||
<input matInput readonly value="{{data.id}}" />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
|
||||
|
|
|
@ -9,12 +9,14 @@
|
|||
|
||||
<mat-card *ngFor="let r of resources | searchFilter: searchText" style="margin-top: 10px;">
|
||||
<mat-card-header>
|
||||
<mat-card-title title="{{r.id}}">{{r.name}} <span class="badge-label badge-info" style="font-size: 0.7em;">{{type.contentType}}</span></mat-card-title>
|
||||
<mat-card-title title="{{r.id}}">{{r.name}} <span class="badge-label badge-info"
|
||||
style="font-size: 0.7em;">{{type.contentType}}</span></mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<p>{{r.description}}</p>
|
||||
<p class="muted small">
|
||||
<b>Id:</b> {{r.id}}<br /> <b>Creation date:</b> {{r.creationDate}}<br /> <b>Modification date:</b> {{r.modificationDate}}
|
||||
<b>Id:</b> {{r.id}}<br /> <b>Creation date:</b> {{r.creationDate}}<br /> <b>Modification date:</b>
|
||||
{{r.modificationDate}}
|
||||
</p>
|
||||
</mat-card-content>
|
||||
<mat-card-actions>
|
||||
|
@ -23,7 +25,4 @@
|
|||
<a href="./api/resources/{{r.id}}/content" mat-stroked-button color="link" target="_blank">raw content</a>
|
||||
<button mat-stroked-button color="warn" (click)="deleteResource(r)">delete</button>
|
||||
</mat-card-actions>
|
||||
</mat-card>
|
||||
|
||||
|
||||
|
||||
</mat-card>
|
||||
|
|
|
@ -11,10 +11,10 @@ import { FormControl, FormGroup } from '@angular/forms';
|
|||
styleUrls: ['./resources.component.css']
|
||||
})
|
||||
export class ResourcesComponent implements OnInit {
|
||||
typeId:string = '';
|
||||
type:ResourceType = { id: '', name: '', contentType: '', count: 0, simple: true };
|
||||
resources:SimpleResource[] = [];
|
||||
searchText:string = '';
|
||||
typeId: string = '';
|
||||
type: ResourceType = { id: '', name: '', contentType: '', count: 0, simple: true };
|
||||
resources: SimpleResource[] = [];
|
||||
searchText: string = '';
|
||||
|
||||
constructor(public service: ISService, public route: ActivatedRoute, public dialog: MatDialog) {
|
||||
}
|
||||
|
@ -44,7 +44,7 @@ export class ResourcesComponent implements OnInit {
|
|||
});
|
||||
}
|
||||
|
||||
openMetadataDialog(r:SimpleResource): void {
|
||||
openMetadataDialog(r: SimpleResource): void {
|
||||
const dialogRef = this.dialog.open(ResMetadataDialog, {
|
||||
data: r,
|
||||
width: '80%'
|
||||
|
@ -55,7 +55,7 @@ export class ResourcesComponent implements OnInit {
|
|||
});
|
||||
}
|
||||
|
||||
openContentDialog(r:SimpleResource): void {
|
||||
openContentDialog(r: SimpleResource): void {
|
||||
this.service.loadSimpleResourceContent(r.id, (data: string) => {
|
||||
const dialogRef = this.dialog.open(ResContentDialog, {
|
||||
data: {
|
||||
|
@ -72,7 +72,7 @@ export class ResourcesComponent implements OnInit {
|
|||
});
|
||||
}
|
||||
|
||||
deleteResource(r:SimpleResource) {
|
||||
deleteResource(r: SimpleResource) {
|
||||
if (confirm('Are you sure?')) {
|
||||
this.service.deleteSimpleResource(r.id, (data: void) => this.reload());
|
||||
}
|
||||
|
@ -89,14 +89,14 @@ export class ResContentDialog {
|
|||
contentFormControl = new FormControl('');
|
||||
|
||||
contentForm = new FormGroup({
|
||||
content : this.contentFormControl
|
||||
content: this.contentFormControl
|
||||
});
|
||||
|
||||
constructor(public dialogRef: MatDialogRef<ResContentDialog>, @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService) {
|
||||
this.contentFormControl.setValue(data.content);
|
||||
}
|
||||
|
||||
onSubmit():void {
|
||||
onSubmit(): void {
|
||||
let content = this.contentFormControl.value;
|
||||
if (content) {
|
||||
this.service.saveSimpleResourceContent(this.data.id, content, (data: void) => this.dialogRef.close(1), this.contentForm)
|
||||
|
@ -116,7 +116,7 @@ export class ResContentDialog {
|
|||
export class ResMetadataDialog {
|
||||
metadataForm = new FormGroup({
|
||||
name: new FormControl(''),
|
||||
description : new FormControl('')
|
||||
description: new FormControl('')
|
||||
});
|
||||
|
||||
constructor(public dialogRef: MatDialogRef<ResMetadataDialog>, @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService) {
|
||||
|
@ -126,7 +126,7 @@ export class ResMetadataDialog {
|
|||
}
|
||||
}
|
||||
|
||||
onSubmit():void {
|
||||
onSubmit(): void {
|
||||
const res = Object.assign({}, this.data, this.metadataForm.value);
|
||||
this.service.saveSimpleResourceMedatata(res, (data: void) => this.dialogRef.close(1), this.metadataForm);
|
||||
}
|
||||
|
@ -144,17 +144,17 @@ export class ResMetadataDialog {
|
|||
export class ResCreateNewDialog {
|
||||
newResourceForm = new FormGroup({
|
||||
name: new FormControl(''),
|
||||
description : new FormControl(''),
|
||||
content : new FormControl('')
|
||||
description: new FormControl(''),
|
||||
content: new FormControl('')
|
||||
});
|
||||
|
||||
constructor(public dialogRef: MatDialogRef<ResCreateNewDialog>, @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService) {}
|
||||
constructor(public dialogRef: MatDialogRef<ResCreateNewDialog>, @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService) { }
|
||||
|
||||
onSubmit():void {
|
||||
let name:string = this.newResourceForm.get('name')?.value!;
|
||||
let type:string = this.data.id!;
|
||||
let description:string = this.newResourceForm.get('description')?.value!;
|
||||
let content:string = this.newResourceForm.get('content')?.value!;
|
||||
onSubmit(): void {
|
||||
let name: string = this.newResourceForm.get('name')?.value!;
|
||||
let type: string = this.data.id!;
|
||||
let description: string = this.newResourceForm.get('description')?.value!;
|
||||
let content: string = this.newResourceForm.get('content')?.value!;
|
||||
|
||||
this.service.addSimpleResource(name, type, description, content, (data: void) => this.dialogRef.close(1), this.newResourceForm);
|
||||
}
|
||||
|
|
|
@ -47,18 +47,12 @@
|
|||
<ng-container matColumnDef="buttons">
|
||||
<th mat-header-cell *matHeaderCellDef style="text-align: right; width: 8em;"></th>
|
||||
<td mat-cell *matCellDef="let index = index" class="table-buttons">
|
||||
<button mat-stroked-button
|
||||
color="warn"
|
||||
type="button"
|
||||
(click)="removeSynonym(index)">
|
||||
<button mat-stroked-button color="warn" type="button" (click)="removeSynonym(index)">
|
||||
delete
|
||||
</button>
|
||||
</td>
|
||||
<td mat-footer-cell *matFooterCellDef class="table-buttons">
|
||||
<button mat-stroked-button
|
||||
color="primary"
|
||||
type="button"
|
||||
(click)="addSynonym()"
|
||||
<button mat-stroked-button color="primary" type="button" (click)="addSynonym()"
|
||||
[disabled]="!isNewSynonymValid()">
|
||||
add
|
||||
</button>
|
||||
|
|
|
@ -10,19 +10,22 @@
|
|||
<table mat-table [dataSource]="vocsDatasource" matSort class="mat-elevation-z8">
|
||||
|
||||
<ng-container matColumnDef="id">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 20%;" mat-sort-header sortActionDescription="Sort by ID"> Id </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 20%;" mat-sort-header sortActionDescription="Sort by ID"> Id
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
<a [routerLink]="['/voc_editor']" [queryParams]="{id: element.id}">{{element.id}}</a>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 20%;" mat-sort-header sortActionDescription="Sort by Name"> Name </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 20%;" mat-sort-header sortActionDescription="Sort by Name"> Name
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let element"> {{element.name}} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="description">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 40%;" mat-sort-header sortActionDescription="Sort by Description"> Description </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 40%;" mat-sort-header
|
||||
sortActionDescription="Sort by Description"> Description </th>
|
||||
<td mat-cell *matCellDef="let element"> {{element.description}} </td>
|
||||
</ng-container>
|
||||
|
||||
|
|
|
@ -109,7 +109,7 @@ export class VocabularyEditorComponent implements OnInit, AfterViewInit {
|
|||
newVocabularyTermDialog(): void {
|
||||
if (this.voc?.id) {
|
||||
const dialogRef = this.dialog.open(VocTermDialog, {
|
||||
data: { vocabulary: this.voc.id, code: '', name: '', encoding: 'OPENAIRE', synonyms: []},
|
||||
data: { vocabulary: this.voc.id, code: '', name: '', encoding: 'OPENAIRE', synonyms: [] },
|
||||
width: '80%'
|
||||
});
|
||||
|
||||
|
@ -201,10 +201,10 @@ export class VocTermDialog {
|
|||
let oldCode = this.data.code;
|
||||
let voc = this.data.vocabulary;
|
||||
|
||||
let term:VocabularyTerm = {
|
||||
code : this.termForm.get('code')?.value!,
|
||||
name : this.termForm.get('name')?.value!,
|
||||
encoding : this.termForm.get('encoding')?.value!,
|
||||
let term: VocabularyTerm = {
|
||||
code: this.termForm.get('code')?.value!,
|
||||
name: this.termForm.get('name')?.value!,
|
||||
encoding: this.termForm.get('encoding')?.value!,
|
||||
synonyms: this.synonymsDatasource.data,
|
||||
vocabulary: voc
|
||||
}
|
||||
|
@ -216,7 +216,7 @@ export class VocTermDialog {
|
|||
}, this.termForm);
|
||||
}
|
||||
|
||||
removeSynonym(pos:number) {
|
||||
removeSynonym(pos: number) {
|
||||
this.synonymsDatasource.data.splice(pos, 1);
|
||||
this.synonymsTable?.renderRows();
|
||||
}
|
||||
|
|
|
@ -29,7 +29,8 @@
|
|||
|
||||
<!-- Row shown when there is no matching data. -->
|
||||
<tr class="mat-row" *matNoDataRow>
|
||||
<td class="mat-cell" colspan="2" style="padding: 0 16px;">No data matching the filter "{{filterParams.value}}"</td>
|
||||
<td class="mat-cell" colspan="2" style="padding: 0 16px;">No data matching the filter "{{filterParams.value}}"
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
|
|
|
@ -20,39 +20,48 @@
|
|||
<table mat-table [dataSource]="historyDatasource" matSort class="mat-elevation-z8">
|
||||
|
||||
<ng-container matColumnDef="processId">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 15%;" mat-sort-header sortActionDescription="Sort by Process ID"> Process Id </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 15%;" mat-sort-header
|
||||
sortActionDescription="Sort by Process ID"> Process Id </th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
<a (click)="openWfDialog(element)">{{element.processId}}</a>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 15%;" mat-sort-header sortActionDescription="Sort by WF Name"> Workflow Name </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 15%;" mat-sort-header sortActionDescription="Sort by WF Name">
|
||||
Workflow Name </th>
|
||||
<td mat-cell *matCellDef="let element"> {{element.name}} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="family">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 10%;" mat-sort-header sortActionDescription="Sort by WF Family"> Workflow Family </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 10%;" mat-sort-header sortActionDescription="Sort by WF Family">
|
||||
Workflow Family </th>
|
||||
<td mat-cell *matCellDef="let element"> {{element.family}} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="dsName">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 20%;" mat-sort-header sortActionDescription="Sort by Datasource"> Datasource </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 20%;" mat-sort-header
|
||||
sortActionDescription="Sort by Datasource"> Datasource </th>
|
||||
<td mat-cell *matCellDef="let element"> {{element.dsName}} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="status">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 10%;" mat-sort-header sortActionDescription="Sort by Status"> Status </th>
|
||||
<td mat-cell *matCellDef="let element"><span class="badge-label" [ngClass]="{'badge-success' : element.status === 'success', 'badge-failure' : element.status === 'failure'}">{{element.status}}</span> </td>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 10%;" mat-sort-header sortActionDescription="Sort by Status">
|
||||
Status </th>
|
||||
<td mat-cell *matCellDef="let element"><span class="badge-label"
|
||||
[ngClass]="{'badge-success' : element.status === 'success', 'badge-failure' : element.status === 'failure'}">{{element.status}}</span>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="startDate">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 15%;" mat-sort-header sortActionDescription="Sort by Start Date"> Start Date </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 15%;" mat-sort-header
|
||||
sortActionDescription="Sort by Start Date"> Start Date </th>
|
||||
<td mat-cell *matCellDef="let element"> {{element.startDate}} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="endDate">
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 15%;" mat-sort-header sortActionDescription="Sort by End Date"> End Date </th>
|
||||
<th mat-header-cell *matHeaderCellDef style="width: 15%;" mat-sort-header sortActionDescription="Sort by End Date">
|
||||
End Date </th>
|
||||
<td mat-cell *matCellDef="let element"> {{element.endDate}} </td>
|
||||
</ng-container>
|
||||
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { Component, Inject,AfterViewInit, OnInit, ViewChild } from '@angular/core';
|
||||
import { Component, Inject, AfterViewInit, OnInit, ViewChild } from '@angular/core';
|
||||
import { ISService } from '../common/is.service';
|
||||
import { MatTableDataSource } from '@angular/material/table';
|
||||
import { MatSort } from '@angular/material/sort';
|
||||
|
@ -12,7 +12,7 @@ import { MatDialog, MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dial
|
|||
templateUrl: './wf-history.component.html',
|
||||
styleUrls: ['./wf-history.component.css']
|
||||
})
|
||||
export class WfHistoryComponent implements AfterViewInit , OnInit{
|
||||
export class WfHistoryComponent implements AfterViewInit, OnInit {
|
||||
|
||||
historyDatasource: MatTableDataSource<WfHistoryEntry> = new MatTableDataSource<WfHistoryEntry>([]);
|
||||
|
||||
|
@ -26,10 +26,10 @@ export class WfHistoryComponent implements AfterViewInit , OnInit{
|
|||
}
|
||||
|
||||
ngOnInit() {
|
||||
combineLatest([ this.route.params, this.route.queryParams ],
|
||||
combineLatest([this.route.params, this.route.queryParams],
|
||||
(params: Params, queryParams: Params) => ({ params, queryParams })
|
||||
).subscribe((res: { params: Params; queryParams: Params }) => {
|
||||
const { params, queryParams} = res;
|
||||
const { params, queryParams } = res;
|
||||
let totalP = queryParams['total'];
|
||||
let fromP = queryParams['from'];
|
||||
let toP = queryParams['to'];
|
||||
|
@ -45,7 +45,7 @@ export class WfHistoryComponent implements AfterViewInit , OnInit{
|
|||
@ViewChild(MatSort) sort: MatSort | undefined
|
||||
|
||||
ngAfterViewInit() {
|
||||
if(this.sort) this.historyDatasource.sort = this.sort;
|
||||
if (this.sort) this.historyDatasource.sort = this.sort;
|
||||
}
|
||||
|
||||
applyFilter(event: Event) {
|
||||
|
@ -68,9 +68,9 @@ export class WfHistoryComponent implements AfterViewInit , OnInit{
|
|||
|
||||
})
|
||||
export class WfDialog {
|
||||
startDate:string = '';
|
||||
endDate:string = '';
|
||||
duration:string = '';
|
||||
startDate: string = '';
|
||||
endDate: string = '';
|
||||
duration: string = '';
|
||||
|
||||
wfDatasource: MatTableDataSource<KeyValue> = new MatTableDataSource<KeyValue>([]);
|
||||
colums: string[] = ['k', 'v'];
|
||||
|
@ -79,10 +79,10 @@ export class WfDialog {
|
|||
public dialogRef: MatDialogRef<WfDialog>,
|
||||
@Inject(MAT_DIALOG_DATA) public data: WfHistoryEntry,
|
||||
) {
|
||||
let list:KeyValue[] = [];
|
||||
let list: KeyValue[] = [];
|
||||
let map = new Map(Object.entries(data.details));
|
||||
for (let [key, value] of map) {
|
||||
list.push({k: key, v: value});
|
||||
list.push({ k: key, v: value });
|
||||
}
|
||||
this.wfDatasource.data = list;
|
||||
this.startDate = data.startDate;
|
||||
|
@ -101,7 +101,7 @@ export class WfDialog {
|
|||
}
|
||||
|
||||
|
||||
calculateDateDiff(start:number, end:number):string {
|
||||
calculateDateDiff(start: number, end: number): string {
|
||||
if (start <= 0 || end <= 0) {
|
||||
return '-';
|
||||
}
|
||||
|
@ -147,7 +147,7 @@ export class WfDialog {
|
|||
}
|
||||
|
||||
return res;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>DnetIsApplication</title>
|
||||
|
@ -10,7 +11,9 @@
|
|||
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body class="mat-typography">
|
||||
<app-root></app-root>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
|
@ -1,10 +1,22 @@
|
|||
/* You can add global styles to this file, and also import other style files */
|
||||
|
||||
html, body { height: 100%; }
|
||||
body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.small { font-size: 0.9em !important; }
|
||||
.muted { color: darkgray; }
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: Roboto, "Helvetica Neue", sans-serif;
|
||||
}
|
||||
|
||||
.small {
|
||||
font-size: 0.9em !important;
|
||||
}
|
||||
|
||||
.muted {
|
||||
color: darkgray;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
|
@ -15,9 +27,12 @@ tr {
|
|||
height: auto !important;
|
||||
}
|
||||
|
||||
th.mat-sort-header-sorted { color: black !important; }
|
||||
th.mat-sort-header-sorted {
|
||||
color: black !important;
|
||||
}
|
||||
|
||||
th, td {
|
||||
th,
|
||||
td {
|
||||
white-space: nowrap !important;
|
||||
overflow: hidden !important;
|
||||
text-overflow: ellipsis !important;
|
||||
|
@ -27,7 +42,10 @@ th, td {
|
|||
text-align: left;
|
||||
}
|
||||
|
||||
.table-buttons { text-align: right !important; }
|
||||
.table-buttons {
|
||||
text-align: right !important;
|
||||
}
|
||||
|
||||
.table-buttons button {
|
||||
font-size: 0.8em !important;
|
||||
padding: 0 !important;
|
||||
|
@ -42,7 +60,8 @@ th, td {
|
|||
font-family: monospace;
|
||||
}
|
||||
|
||||
a, a:not([href]) {
|
||||
a,
|
||||
a:not([href]) {
|
||||
cursor: pointer;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
|
@ -52,7 +71,8 @@ a, a:not([href]) {
|
|||
color: #336699;
|
||||
}
|
||||
|
||||
a:hover, a:not([href]):hover {
|
||||
a:hover,
|
||||
a:not([href]):hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
|
@ -68,20 +88,20 @@ a:hover, a:not([href]):hover {
|
|||
}
|
||||
|
||||
.badge-default {
|
||||
background-color:#336699;
|
||||
background-color: #336699;
|
||||
}
|
||||
|
||||
|
||||
.badge-success {
|
||||
background-color:darkgreen;
|
||||
background-color: darkgreen;
|
||||
}
|
||||
|
||||
.badge-failure {
|
||||
background-color:red;
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
.badge-warning {
|
||||
background-color:darkorange;
|
||||
background-color: darkorange;
|
||||
}
|
||||
|
||||
.badge-info {
|
||||
|
@ -104,5 +124,6 @@ a:hover, a:not([href]):hover {
|
|||
z-index: 10000;
|
||||
}
|
||||
|
||||
.spinner * { margin: auto; }
|
||||
|
||||
.spinner * {
|
||||
margin: auto;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue