dsm ui
This commit is contained in:
parent
f18cabe650
commit
345a2bfb1d
|
|
@ -30,6 +30,7 @@ const routes: Routes = [
|
|||
{ path: "voc_editor", component: VocabularyEditorComponent },
|
||||
{ path: "dsm/search", component: DsmSearchComponent },
|
||||
{ path: "dsm/results/:page/:size", component: DsmResultsComponent },
|
||||
{ path: "dsm/api", component: DsmApiComponent },
|
||||
{ path: "mdstores", component: MdstoresComponent },
|
||||
{ path: "mdrecords/:versionId/:limit", component: MdstoreInspectorComponent },
|
||||
{ path: "cleaner", component: CleanerTesterComponent },
|
||||
|
|
|
|||
|
|
@ -1,9 +1,7 @@
|
|||
import { Injectable, OnInit } from '@angular/core';
|
||||
import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
|
||||
import { Page, DsmConf, ResourceType, Protocol, WfHistoryEntry, SimpleResource, Context, ContextNode, Vocabulary, VocabularyTerm, KeyValue, BrowseTerm, Datasource, MDStore, MDStoreVersion, MDStoreRecord, EmailTemplate, WfConf, WfSubscription, WfProcessStatus, WfSection } from './is.model';
|
||||
import { Injectable } from '@angular/core';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { FormGroup } from '@angular/forms';
|
||||
import { MatSnackBar } from '@angular/material/snack-bar';
|
||||
import { firstValueFrom, Observable } from 'rxjs';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
|
|
|
|||
|
|
@ -137,13 +137,12 @@ export interface ApiInsert {
|
|||
apiParams: ApiParam[]
|
||||
};
|
||||
|
||||
export interface Organization {
|
||||
export interface SimpleOrganization {
|
||||
name: string,
|
||||
country: string
|
||||
}
|
||||
|
||||
|
||||
export interface Datasource {
|
||||
export interface SimpleDatasource {
|
||||
id: string,
|
||||
name: string,
|
||||
otherName?: string,
|
||||
|
|
@ -153,7 +152,7 @@ export interface Datasource {
|
|||
consenttermsofuse?: boolean,
|
||||
fulltextdownload?: boolean,
|
||||
collectedFrom: string,
|
||||
organizations: Organization[],
|
||||
organizations: SimpleOrganization[],
|
||||
apis: Api[]
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1 +1,130 @@
|
|||
<p>dsm api page</p>
|
||||
<h2>Datasource Manager</h2>
|
||||
|
||||
<mat-card style="margin-top: 10px;">
|
||||
<mat-card-header>
|
||||
<mat-card-title>{{ds.officialname}}</mat-card-title>
|
||||
<mat-card-subtitle><a href="/proxy/byType/datasource_manager/api/ds/{{ds.id}}"
|
||||
target="_blank">{{ds.id}}</a></mat-card-subtitle>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<table class="dsm-result-table">
|
||||
<tr>
|
||||
<th align="left" width="20%">Contact email</th>
|
||||
<td width="80%">{{ds.contactemail}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th align="left">Namespace Prefix</th>
|
||||
<td>{{ds.namespaceprefix}}</td>
|
||||
</tr>
|
||||
<tr *ngIf="ds.collectedfrom">
|
||||
<th align="left">Collected From</th>
|
||||
<td>{{ds.collectedfrom}}</td>
|
||||
</tr>
|
||||
<tr *ngIf="ds.websiteurl">
|
||||
<th align="left">URL</th>
|
||||
<td><a href="{{ds.websiteurl}}" target="_blank">{{ds.websiteurl}}</a></td>
|
||||
</tr>
|
||||
<tr *ngIf="ds.organizations && ds.organizations.length > 0">
|
||||
<th align="left">Organization(s)</th>
|
||||
<td>
|
||||
<span *ngFor="let o of ds.organizations">
|
||||
{{o.legalname}}
|
||||
<img src="assets/images/flags/{{o.country}}.gif" title="{{o.country}}" alt="{{o.country}}"
|
||||
*ngIf="o.country" />
|
||||
<br />
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th align="left">Consent terms of use</th>
|
||||
<td>
|
||||
<mat-icon fontIcon="check" *ngIf="ds.consentTermsOfUse" style="color:darkgreen;"></mat-icon>
|
||||
<mat-icon fontIcon="not_interested" *ngIf="ds.consentTermsOfUse != null && !ds.consentTermsOfUse"
|
||||
style="color:darkred;"></mat-icon>
|
||||
<mat-icon fontIcon="question_mark" *ngIf="ds.consentTermsOfUse == null" style="color:lightgrey;"></mat-icon>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th align="left">Fulltext download</th>
|
||||
<td>
|
||||
<mat-icon fontIcon="check" *ngIf="ds.fullTextDownload" style="color:darkgreen;"></mat-icon>
|
||||
<mat-icon fontIcon="not_interested" *ngIf="ds.fullTextDownload != null && !ds.fullTextDownload"
|
||||
style="color:darkred;"></mat-icon>
|
||||
<mat-icon fontIcon="question_mark" *ngIf="ds.fullTextDownload == null" style="color:lightgrey;"></mat-icon>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
|
||||
<mat-card style="margin-top: 10px;">
|
||||
<mat-card-header>
|
||||
<mat-card-title>Api Details</mat-card-title>
|
||||
<mat-card-subtitle>ID: {{apiId}}</mat-card-subtitle>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<table class="dsm-result-table">
|
||||
<tr>
|
||||
<th align="left" width="20%">is Active</th>
|
||||
<td width="80%">TODO
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th align="left" width="20%">is Removable</th>
|
||||
<td width="80%">TODO
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th align="left" width="20%">Medatata ID PATH</th>
|
||||
<td width="80%">{{api.metadataIdentifierPath}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th align="left" width="20%">Protocol</th>
|
||||
<td width="80%">{{api.protocol}} <span style="float: right;">TODO CONFIG</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th align="left" width="20%">Compliance</th>
|
||||
<td width="80%">
|
||||
<span *ngIf="api.compatibilityOverrided">{{api.compatibilityOverride}}</span>
|
||||
<span *ngIf="!api.compatibilityOverrided">{{api.compatibility}}</span>
|
||||
|
||||
<span style="float: right;">OVERRIDE</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr *ngIf="api.lastColletionMdid">
|
||||
<th align="left" width="20%">Last Collection</th>
|
||||
<td width="80%">
|
||||
{{api.lastCollectionDate}}
|
||||
<a [routerLink]="['/mdstores/' + api.lastCollectionMdid]" style="float: right;">Total:
|
||||
{{api.lastAggregationTotal}}</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr *ngIf="api.lastAggregationMdid">
|
||||
<th align="left" width="20%">Last Transformation</th>
|
||||
<td width="80%">
|
||||
{{api.lastCollectionDate}}
|
||||
<a [routerLink]="['/mdstores/' + api.lastAggregationMdid]" style="float: right;">Total:
|
||||
{{api.lastAggregationTotal}}</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
<mat-card style="margin-top: 10px;">
|
||||
<mat-card-header>
|
||||
<mat-card-title>Aggregation Workflows</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
TODO
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
|
||||
|
||||
DS
|
||||
<pre>{{ds | json}}</pre>
|
||||
|
||||
API
|
||||
<pre>{{api | json}}</pre>
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@
|
|||
<table class="dsm-result-table">
|
||||
<tr>
|
||||
<th align="left" width="20%">Id</th>
|
||||
<td width="80%">{{r.id}}</td>
|
||||
<td width="80%"><a href="/proxy/byType/datasource_manager/api/ds/{{r.id}}" target="_blank">{{r.id}}</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th align="left">Type</th>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
import { Page, DsmConf, KeyValue, BrowseTerm, Datasource } from '../common/is.model';
|
||||
import { Page, DsmConf, KeyValue, BrowseTerm, SimpleDatasource } from '../common/is.model';
|
||||
import { ISClient } from '../common/is.client';
|
||||
|
||||
@Injectable({
|
||||
|
|
@ -22,11 +22,19 @@ export class DsmClient extends ISClient {
|
|||
}
|
||||
|
||||
dsmSearchByField(field: string, value: string, page: number, pageSize: number, onSuccess: Function) {
|
||||
this.httpGet<Page<Datasource>>(this.baseUrl + '/search/' + page + '/' + pageSize + '?field=' + encodeURIComponent(field) + '&value=' + encodeURIComponent(value), onSuccess);
|
||||
this.httpGet<Page<SimpleDatasource>>(this.baseUrl + '/search/' + page + '/' + pageSize + '?field=' + encodeURIComponent(field) + '&value=' + encodeURIComponent(value), onSuccess);
|
||||
}
|
||||
|
||||
dsmSearch(value: string, page: number, pageSize: number, onSuccess: Function) {
|
||||
this.httpGet<Page<Datasource>>(this.baseUrl + '/search/' + page + '/' + pageSize + '?value=' + encodeURIComponent(value), onSuccess);
|
||||
this.httpGet<Page<SimpleDatasource>>(this.baseUrl + '/search/' + page + '/' + pageSize + '?value=' + encodeURIComponent(value), onSuccess);
|
||||
}
|
||||
|
||||
dsmGetDs(id: string, onSuccess: Function) {
|
||||
this.httpGet<any>(this.baseUrl + '/ds/' + encodeURIComponent(id), onSuccess);
|
||||
}
|
||||
|
||||
dsmGetApi(id: string, onSuccess: Function) {
|
||||
this.httpGet<any>(this.baseUrl + '/ds-api/' + encodeURIComponent(id), onSuccess);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { Component, Inject, Injectable, OnInit, ViewChild } from '@angular/core';
|
||||
import { Page, BrowseTerm, Datasource, KeyValue, DsmConf, ProtocolParam, Api, ApiInsert } from '../common/is.model';
|
||||
import { Page, BrowseTerm, SimpleDatasource, KeyValue, DsmConf, ProtocolParam, Api, ApiInsert } from '../common/is.model';
|
||||
import { ActivatedRoute, Params } from '@angular/router';
|
||||
import { MatDialog, MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
|
||||
import { MatTableDataSource } from '@angular/material/table';
|
||||
|
|
@ -48,7 +48,7 @@ export class DsmSearchComponent implements OnInit {
|
|||
})
|
||||
export class DsmResultsComponent implements OnInit {
|
||||
filterText: string = '';
|
||||
results: Datasource[] = [];
|
||||
results: SimpleDatasource[] = [];
|
||||
nResults: number = 0;
|
||||
currPage: number = 0;
|
||||
nPages: number = 0;
|
||||
|
|
@ -74,13 +74,13 @@ export class DsmResultsComponent implements OnInit {
|
|||
|
||||
reload() {
|
||||
if (this.field) {
|
||||
this.client.dsmSearchByField(this.field, this.value, this.currPage, this.pageSize, (page: Page<Datasource>) => {
|
||||
this.client.dsmSearchByField(this.field, this.value, this.currPage, this.pageSize, (page: Page<SimpleDatasource>) => {
|
||||
this.results = page.content;
|
||||
this.nResults = page.totalElements;
|
||||
this.nPages = page.totalPages;
|
||||
});
|
||||
} else {
|
||||
this.client.dsmSearch(this.value, this.currPage, this.pageSize, (page: Page<Datasource>) => {
|
||||
this.client.dsmSearch(this.value, this.currPage, this.pageSize, (page: Page<SimpleDatasource>) => {
|
||||
this.results = page.content;
|
||||
this.nResults = page.totalElements;
|
||||
this.nPages = page.totalPages;
|
||||
|
|
@ -117,8 +117,35 @@ export class DsmResultsComponent implements OnInit {
|
|||
templateUrl: './dsm-api.component.html',
|
||||
styleUrls: ['./dsm.component.css']
|
||||
})
|
||||
export class DsmApiComponent {
|
||||
export class DsmApiComponent implements OnInit {
|
||||
|
||||
apiId: string = '';
|
||||
api: any = {};
|
||||
ds: any = {};
|
||||
|
||||
constructor(public client: DsmClient, public route: ActivatedRoute, public router: Router, public dialog: MatDialog) {
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
combineLatest([this.route.params, this.route.queryParams],
|
||||
(params: Params, queryParams: Params) => ({ params, queryParams })
|
||||
).subscribe((res: { params: Params; queryParams: Params }) => {
|
||||
const { params, queryParams } = res;
|
||||
this.apiId = queryParams['id'];
|
||||
this.reload();
|
||||
});
|
||||
}
|
||||
|
||||
reload() {
|
||||
if (this.apiId) {
|
||||
this.client.dsmGetApi(this.apiId, (api: any) => {
|
||||
this.api = api;
|
||||
this.client.dsmGetDs(api.datasource, (ds: any) => {
|
||||
this.ds = ds;
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
|
|
|
|||
Loading…
Reference in New Issue