D-Net
/
dnet-applications
23
1
Fork 0
Code Issues Pull Requests Releases Wiki Activity

context viewer

This commit is contained in:
Michele Artini 2023-01-27 15:00:41 +01:00
parent f47cd2a8e7
commit ea1b5a0b89
6 changed files with 117 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
frontends/dnet-is-application/src/app/contexts/context-viewer.component.html
View File

@ -1 +1,44 @@
CONTEXT EDITOR
<h2>Context Viewer</h2>
<p>
<b>Context ID: </b>{{context?.id}}<br />
<b>Label: </b>{{context?.label}}<br />
<b>Type: </b>{{context?.type}}<br />
</p>
<p>
<a mat-stroked-button color="primary" [routerLink]="['/adv_resources/context']">Return to contexts list</a>
<button mat-stroked-button color="primary" (click)="showParamsDialog(context?.parameters)">Global parameters</button>
<a mat-stroked-button color="primary" href="/api/contexts/{{context?.id}}" target="_blank">Download</a>
</p>
<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 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 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 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>
<span class="badge-label badge-info" *ngIf="c2.claim">claim</span>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>

12
frontends/dnet-is-application/src/app/contexts/contexts.component.css
View File

@ -4,3 +4,15 @@
padding: 0 !important;
height: 2.5em !important;
}
.context-node {
padding-top: 1em;
}
.context-node a {
text-decoration: none;
}
.context-node a:hover {
text-decoration: underline;
}

2
frontends/dnet-is-application/src/app/contexts/contexts.component.html
View File

@ -27,7 +27,7 @@
<ng-container matColumnDef="buttons">
<th mat-header-cell *matHeaderCellDef style="text-align: right;">Parameters</th>
<td mat-cell *matCellDef="let element" class="table-buttons">
<button mat-stroked-button color="primary" (click)="openEditDialog(element)">show</button>
<button mat-stroked-button color="primary" (click)="showParamsDialog(element)">show</button>
</td>
</ng-container>

48
frontends/dnet-is-application/src/app/contexts/contexts.component.ts
View File

@ -2,12 +2,12 @@ import { Component, Inject,AfterViewInit, OnInit, ViewChild } from '@angular/cor
import { ISService } from '../is.service';
import { MatTableDataSource } from '@angular/material/table';
import { MatSort, Sort } from '@angular/material/sort';
import { Context, WfHistoryEntry } from '../model/controller.model';
import { Context, ContextNode, WfHistoryEntry } from '../model/controller.model';
import { ActivatedRoute, Params } from '@angular/router';
import { Observable, combineLatest } from 'rxjs';
import { map } from 'rxjs/operators';
import { MatDialog, MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { KeyValue } from '../model/controller.model';
import { KeyValue, ContextParam } from '../model/controller.model';
import { FormControl, FormGroup, FormGroupDirective, NgForm, Validators } from '@angular/forms';
@Component({
@ -22,7 +22,7 @@ export class ContextsComponent implements AfterViewInit ,OnInit {
@ViewChild(MatSort) sort: MatSort | undefined
constructor(public service: ISService, public route: ActivatedRoute, public contextDialog: MatDialog) {
constructor(public service: ISService, public route: ActivatedRoute, public dialog: MatDialog) {
}
ngOnInit() {
@ -42,20 +42,13 @@ export class ContextsComponent implements AfterViewInit ,OnInit {
this.contextsDatasource.filter = filterValue;
}
openEditDialog(context: Context): void {
const dialogRef = this.contextDialog.open(ContextParamsDialog, {
showParamsDialog(context: Context): void {
const dialogRef = this.dialog.open(ContextParamsDialog, {
data: context.parameters,
width: '80%'
});
}
deleteContext(ctx:Context) {
if (confirm('Are you sure?')) {
this.service.deleteContext(ctx.id, (data: void) => this.reload());
}
}
}
@Component({
@ -78,6 +71,35 @@ export class ContextParamsDialog {
templateUrl: './context-viewer.component.html',
styleUrls: ['./contexts.component.css']
})
export class ContextViewerComponent {
export class ContextViewerComponent implements OnInit {
context?:Context
categories:ContextNode[] = [];
constructor(public service: ISService, public route: ActivatedRoute, public dialog: MatDialog) {
}
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);
});
}
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 {
if (params) {
this.dialog.open(ContextParamsDialog, {
data: params,
width: '80%'
});
}
}
}

19
frontends/dnet-is-application/src/app/is.service.ts
View File

@ -1,6 +1,6 @@
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
import { ResourceType, Protocol, WfHistoryEntry, SimpleResource, Context } from './model/controller.model';
import { ResourceType, Protocol, WfHistoryEntry, SimpleResource, Context, ContextNode } from './model/controller.model';
import { Observable, Observer } from 'rxjs';
import { FormGroup } from '@angular/forms';
import { MatSnackBar } from '@angular/material/snack-bar';
@ -112,15 +112,22 @@ export class ISService {
});
}
addContext(context: Context, onSuccess: Function, relatedForm?: FormGroup): void {
this.client.post<void>('/ajax/contexts/', context).subscribe({
loadContext(ctxId:string, onSuccess: Function): void {
this.client.get<Context>('./ajax/contexts/' + encodeURIComponent(ctxId)).subscribe({
next: data => onSuccess(data),
error: error => this.showError(error, relatedForm)
error: error => this.showError(error)
});
}
deleteContext(contextId: string, onSuccess: Function): void {
this.client.delete<void>('/ajax/contexts/' + encodeURIComponent(contextId)).subscribe({
loadContextCategories(ctxId:string, onSuccess: Function): void {
this.client.get<ContextNode[]>('./ajax/contexts/' + encodeURIComponent(ctxId) + '/categories').subscribe({
next: data => onSuccess(data),
error: error => this.showError(error)
});
}
loadContextConcepts(level:number, nodeId:string, onSuccess: Function): void {
this.client.get<ContextNode[]>('./ajax/contexts/' + encodeURIComponent(level) + '/' + encodeURIComponent(nodeId) + '/concepts').subscribe({
next: data => onSuccess(data),
error: error => this.showError(error)
});

13
frontends/dnet-is-application/src/app/model/controller.model.ts
View File

@ -64,4 +64,15 @@ export interface Context {
parameters: ContextParam[],
nChilds: number,
type: string
}
}
export interface ContextNode {
id: string,
label: string,
parameters: ContextParam[],
nChilds: number,
claim: boolean,
parent: string,
populated?: boolean,
childs?: ContextNode[]
}