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

ui

This commit is contained in:
Michele Artini 2023-02-02 09:37:24 +01:00
parent 0e3a3f11c6
commit e620975813
17 changed files with 93 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontends/dnet-is-application/src/app/contexts/context-params-dialog.html
View File

@ -4,7 +4,7 @@
<p *ngIf="!data || data.length == 0">No parameters</p>
<div *ngFor="let p of data">
<mat-form-field appearance="fill" style="width: 100%; font-size: 0.8em;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%; font-size: 0.8em;">
<mat-label>{{p.name}}</mat-label>
<input matInput required readonly value="{{p.value}}" />
</mat-form-field>

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

@ -1,6 +1,6 @@
<h2>Contexts</h2>
<mat-form-field style="width: 100%; margin-top: 10px;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%; margin-top: 10px;">
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Filter..." #input />
</mat-form-field>

116
frontends/dnet-is-application/src/app/dsm/dsm-add-api.dialog.html
View File

@ -2,45 +2,7 @@
<h1 mat-dialog-title>Add a new API</h1>
<div mat-dialog-content>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-label>Datasource ID</mat-label>
<input matInput readonly value="{{data.dsId}}" />
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-label>Datasource Name</mat-label>
<input matInput readonly value="{{data.dsName}}" />
</mat-form-field>
<mat-form-field appearance="fill" style="width: 30%;">
<mat-label>Api ID (prefix)</mat-label>
<input matInput readonly value="{{apiPrefix}}" />
</mat-form-field>
<mat-form-field appearance="fill" style="width: 70%;">
<mat-label>Api ID (suffix)</mat-label>
<input matInput formControlName="apiId" required />
<mat-error *ngIf="addApiForm.get('apiId')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-label>Compatibility level</mat-label>
<mat-select matInput formControlName="compatibility" required>
<mat-option *ngFor="let i of compatibilityLevels" [value]="i">{{i}}</mat-option>
</mat-select>
<mat-error *ngIf="addApiForm.get('compatibility')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-label>Content description</mat-label>
<mat-select matInput formControlName="contentdescription" required>
<mat-option *ngFor="let i of contentDescTypes" [value]="i">{{i}}</mat-option>
</mat-select>
<mat-error *ngIf="addApiForm.get('contentdescription')?.invalid">This field is
<strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Protocol</mat-label>
<mat-select matInput formControlName="protocol" required (selectionChange)="onChangeProtocol($event)">
<mat-option *ngFor="let i of protocols" [value]="i">{{i}}</mat-option>
@ -48,26 +10,70 @@
<mat-error *ngIf="addApiForm.get('protocol')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-label>Base URL</mat-label>
<input matInput formControlName="baseurl" required />
<mat-error *ngIf="addApiForm.get('baseurl')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-card style="margin-top: 10px;" *ngIf="addApiForm.get('protocol')?.value">
<mat-card-header>
<mat-card-title>API Description</mat-card-title>
</mat-card-header>
<mat-card-content style="padding-top: 1em;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Datasource (ID: {{data.dsId}})</mat-label>
<input matInput readonly value="{{data.dsName}}" />
</mat-form-field>
<ng-container *ngIf="addApiForm.get('protocol')?.value">
<mat-form-field appearance="fill" style="width: 100%;" *ngFor="let p of selProtParams">
<mat-label>Protocol: {{addApiForm.get('protocol')?.value}} - Parameter: {{p.name}}</mat-label>
<input matInput required />
</mat-form-field>
</ng-container>
<mat-form-field appearance="fill" floatLabel="always" style="width: 30%;">
<mat-label>Api ID (prefix)</mat-label>
<input matInput readonly value="{{apiPrefix}}" />
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-label>XPath for Metatadata Identifier</mat-label>
<input matInput formControlName="metadataIdentifierPath" required />
<mat-error *ngIf="addApiForm.get('metadataIdentifierPath')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" floatLabel="always" style="width: 70%;">
<mat-label>Api ID (suffix)</mat-label>
<input matInput formControlName="apiId" required placeholder="example: {{addApiForm.get('protocol')?.value}}_01" />
<mat-error *ngIf="addApiForm.get('apiId')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" floatLabel="always" style="width: 50%;">
<mat-label>Compatibility level</mat-label>
<mat-select matInput formControlName="compatibility" required>
<mat-option *ngFor="let i of compatibilityLevels" [value]="i">{{i}}</mat-option>
</mat-select>
<mat-error *ngIf="addApiForm.get('compatibility')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" floatLabel="always" style="width: 50%;">
<mat-label>Content description</mat-label>
<mat-select matInput formControlName="contentdescription" required>
<mat-option *ngFor="let i of contentDescTypes" [value]="i">{{i}}</mat-option>
</mat-select>
<mat-error *ngIf="addApiForm.get('contentdescription')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
</mat-card-content>
</mat-card>
<mat-card style="margin-top: 10px;" *ngIf="addApiForm.get('protocol')?.value">
<mat-card-header>
<mat-card-title>Configuration Parameters</mat-card-title>
</mat-card-header>
<mat-card-content style="padding-top: 1em;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Base URL</mat-label>
<input matInput formControlName="baseurl" required />
<mat-error *ngIf="addApiForm.get('baseurl')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;" *ngFor="let p of selProtParams">
<mat-label>Protocol: {{addApiForm.get('protocol')?.value}} - Parameter: {{p.name}}</mat-label>
<input matInput required />
</mat-form-field>
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>XPath for Metatadata Identifier</mat-label>
<input matInput formControlName="metadataIdentifierPath" required />
<mat-error *ngIf="addApiForm.get('metadataIdentifierPath')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
</mat-card-content>
</mat-card>
</div>
<div mat-dialog-actions>
<button mat-stroked-button color="primary" type="submit" [disabled]="!addApiForm.valid">Submit</button>
<button mat-stroked-button color="primary" mat-dialog-close>Close</button>

2
frontends/dnet-is-application/src/app/dsm/dsm-browse-dialog.html
View File

@ -1,7 +1,7 @@
<h1 mat-dialog-title>{{data.label}}</h1>
<div mat-dialog-content>
<mat-form-field style="width: 100%; margin-top: 10px;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%; margin-top: 10px;">
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Filter..." #input />
</mat-form-field>

4
frontends/dnet-is-application/src/app/dsm/dsm-results.component.html
View File

@ -6,7 +6,7 @@
<span *ngIf="!field && !value">Returning all the datasources</span>
</p>
<mat-form-field style="width: 100%; margin-top: 10px;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%; margin-top: 10px;">
<mat-label><b>Filter in current page</b> (Total: {{(results | searchFilter: filterText).length}})</mat-label>
<input matInput [(ngModel)]="filterText" placeholder="Filter..." autofocus />
</mat-form-field>
@ -20,7 +20,7 @@
aria-label="Select page">
</mat-paginator>
<mat-card class="example-card" *ngFor="let r of results | searchFilter: filterText" style="margin-top: 10px;">
<mat-card *ngFor="let r of results | searchFilter: filterText" style="margin-top: 10px;">
<mat-card-header>
<mat-card-title>{{r.name}}</mat-card-title>
<mat-card-subtitle *ngIf="r.otherName && r.name != r.otherName">{{r.otherName}}</mat-card-subtitle>

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

@ -1,7 +1,7 @@
<h2>Datasource Manager: Search</h2>
<form (ngSubmit)="search()">
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Search...</mat-label>
<input matInput [(ngModel)]="searchText" name="searchText" autofocus />
</mat-form-field>

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

@ -1,6 +1,6 @@
<h2>Container Info</h2>
<mat-form-field style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Filter..." #input />
</mat-form-field>

4
frontends/dnet-is-application/src/app/resources/content-dialog.html
View File

@ -4,12 +4,12 @@
<div mat-dialog-content>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>ID</mat-label>
<input matInput readonly value="{{data.id}}"/>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Content ({{data.contentType}})</mat-label>
<textarea matInput formControlName="content" required rows="16" style="font-size: 0.8em;"></textarea>
<mat-error *ngIf="contentForm.get('content')?.invalid">This field is <strong>required</strong></mat-error>

8
frontends/dnet-is-application/src/app/resources/metadata-dialog.html
View File

@ -3,23 +3,23 @@
<div mat-dialog-content>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>ID</mat-label>
<input matInput readonly value="{{data.id}}"/>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Type</mat-label>
<input matInput readonly value="{{data.type}}" />
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Name</mat-label>
<input matInput formControlName="name" required />
<mat-error *ngIf="metadataForm.get('name')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Description</mat-label>
<textarea matInput formControlName="description" rows="8"></textarea>
</mat-form-field>

6
frontends/dnet-is-application/src/app/resources/new-dialog.html
View File

@ -3,18 +3,18 @@
<div mat-dialog-content>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Name</mat-label>
<input matInput formControlName="name" required />
<mat-error *ngIf="newResourceForm.get('name')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Description</mat-label>
<textarea matInput formControlName="description" rows="2"></textarea>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Content ({{data.contentType}})</mat-label>
<textarea matInput formControlName="content" required rows="10" style="font-size: 0.8em;"></textarea>
<mat-error *ngIf="newResourceForm.get('content')?.invalid">This field is <strong>required</strong></mat-error>

5
frontends/dnet-is-application/src/app/resources/resources.component.html
View File

@ -2,13 +2,12 @@
<button mat-stroked-button color="primary" (click)="openNewDialog()">create a new resource</button>
<mat-form-field style="width: 100%; margin-top: 10px;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%; margin-top: 10px;">
<mat-label><b>Filter</b> (Total: {{(resources | searchFilter: searchText).length}})</mat-label>
<input matInput [(ngModel)]="searchText" placeholder="Filter..." autofocus />
</mat-form-field>
<mat-card class="example-card" *ngFor="let r of resources | searchFilter: searchText" style="margin-top: 10px;">
<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-header>

6
frontends/dnet-is-application/src/app/vocabularies/voc-dialog.html
View File

@ -3,19 +3,19 @@
<h1 mat-dialog-title *ngIf="!data.id">New vocabulary</h1>
<div mat-dialog-content>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>ID</mat-label>
<input matInput required formControlName="id" [readonly]="data.id.length > 0" />
<mat-error *ngIf="vocForm.get('id')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Name</mat-label>
<input matInput formControlName="name" required />
<mat-error *ngIf="vocForm.get('name')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Description</mat-label>
<textarea matInput formControlName="description" rows="4"></textarea>
</mat-form-field>

14
frontends/dnet-is-application/src/app/vocabularies/voc-term-dialog.html
View File

@ -3,19 +3,19 @@
<h1 mat-dialog-title *ngIf="!data.code">New term</h1>
<div mat-dialog-content>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Code</mat-label>
<input matInput formControlName="code" required />
<mat-error *ngIf="termForm.get('id')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Name</mat-label>
<input matInput formControlName="name" required />
<mat-error *ngIf="termForm.get('name')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Encoding</mat-label>
<input matInput formControlName="encoding" />
</mat-form-field>
@ -26,7 +26,7 @@
<th mat-header-cell *matHeaderCellDef>Term</th>
<td mat-cell *matCellDef="let element">{{element.term}}</td>
<td mat-footer-cell *matFooterCellDef>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>New term</mat-label>
<input matInput formControlName="tmpSynonymTerm" />
</mat-form-field>
@ -37,7 +37,7 @@
<th mat-header-cell *matHeaderCellDef style="width: 20%;">Encoding</th>
<td mat-cell *matCellDef="let element">{{element.encoding}}</td>
<td mat-footer-cell *matFooterCellDef>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>New encoding</mat-label>
<input matInput formControlName="tmpSynonymEncoding" />
</mat-form-field>
@ -100,13 +100,13 @@
<tfoot>
<tr>
<td>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>New term</mat-label>
<input matInput formControlName="tmpSynonymTerm" />
</mat-form-field>
</td>
<td>
<mat-form-field appearance="fill" style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>New encoding</mat-label>
<input matInput formControlName="tmpSynonymEncoding" />
</mat-form-field>

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

@ -2,7 +2,7 @@
<button mat-stroked-button color="primary" (click)="newVocabularyDialog()">create a new vocabulary</button>
<mat-form-field style="width: 100%; margin-top: 10px;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%; margin-top: 10px;">
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Filter..." #input />
</mat-form-field>

2
frontends/dnet-is-application/src/app/vocabularies/vocabulary-editor.component.html
View File

@ -12,7 +12,7 @@
<a mat-stroked-button color="primary" href="/api/vocs/{{voc?.id}}/terms" target="_blank">Download</a>
</p>
<mat-form-field style="width: 100%; margin-top: 10px;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%; margin-top: 10px;">
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Filter..." #input />
</mat-form-field>

2
frontends/dnet-is-application/src/app/wf-history/wf-dialog.html
View File

@ -7,7 +7,7 @@
<b>Duration: </b>{{duration}}<br />
</p>
<mat-form-field style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Filter..." #filterParams />
</mat-form-field>

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

@ -1,6 +1,6 @@
<h2>Workflow History</h2>
<mat-form-field style="width: 100%;">
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Filter..." #input />
</mat-form-field>