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

dsm setup

This commit is contained in:
Michele Artini 2023-01-31 11:05:11 +01:00
parent a5b318a065
commit 23a3f2546e
13 changed files with 53 additions and 186 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
frontends/dnet-is-application/src/app/app-routing.module.ts
View File

@ -6,6 +6,7 @@ import { WfHistoryComponent } from './wf-history/wf-history.component';
import { ResourcesComponent } from './resources/resources.component';
import { VocabulariesComponent, VocabularyEditorComponent } from './vocabularies/vocabularies.component';
import { ContextViewerComponent, ContextsComponent } from './contexts/contexts.component';
import { DsmSearchComponent, DsmResultsComponent, DsmApiComponent, DsmAddApiComponent } from './dsm/dsm.component';
const routes: Routes = [
{ path:"info" , component:InfoComponent },
@ -16,6 +17,10 @@ const routes: Routes = [
{ 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:"dsm/addApi" , component:DsmAddApiComponent },
{ path:"dsm/api" , component:DsmApiComponent }
];
@NgModule({

9
frontends/dnet-is-application/src/app/app.module.ts
View File

@ -14,7 +14,6 @@ import { MatSidenavModule } from '@angular/material/sidenav';
import { MatIconModule } from '@angular/material/icon';
import { MatListModule } from '@angular/material/list';
import { MatTreeModule } from '@angular/material/tree';
import { MainMenuTreeComponent } from './main-menu-tree/main-menu-tree.component';
import { MatBadgeModule } from '@angular/material/badge';
import { MatCardModule } from '@angular/material/card';
import { MatFormFieldModule } from '@angular/material/form-field';
@ -30,13 +29,13 @@ import { ResourcesComponent, ResContentDialog, ResCreateNewDialog, ResMetadataDi
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { ContextsComponent, ContextViewerComponent, ContextParamsDialog } from './contexts/contexts.component';
import { VocabulariesComponent, VocabularyEditorComponent, VocDialog, VocTermDialog } from './vocabularies/vocabularies.component';
import { DsmSearchComponent, DsmResultsComponent, DsmApiComponent, DsmAddApiComponent } from './dsm/dsm.component';
@NgModule({
declarations: [
AppComponent,
FilterPipe,
MainMenuPanelsComponent,
MainMenuTreeComponent,
InfoComponent,
ProtocolsComponent,
WfHistoryComponent,
@ -51,7 +50,11 @@ import { VocabulariesComponent, VocabularyEditorComponent, VocDialog, VocTermDia
VocabulariesComponent,
VocabularyEditorComponent,
VocDialog,
VocTermDialog
VocTermDialog,
DsmSearchComponent,
DsmResultsComponent,
DsmApiComponent,
DsmAddApiComponent
],
imports: [
BrowserModule,

1
frontends/dnet-is-application/src/app/dsm/dsm-add-api.component.html Normal file
View File

@ -0,0 +1 @@
<p>dsm search</p>

1
frontends/dnet-is-application/src/app/dsm/dsm-api.component.html Normal file
View File

@ -0,0 +1 @@
<p>dsm search</p>

1
frontends/dnet-is-application/src/app/dsm/dsm-results.component.html Normal file
View File

@ -0,0 +1 @@
<p>dsm search</p>

1
frontends/dnet-is-application/src/app/dsm/dsm-search.component.html Normal file
View File

@ -0,0 +1 @@
<p>dsm search</p>

0
frontends/dnet-is-application/src/app/dsm/dsm.component.css Normal file
View File

37
frontends/dnet-is-application/src/app/dsm/dsm.component.ts Normal file
View File

@ -0,0 +1,37 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-dsm-search',
templateUrl: './dsm-search.component.html',
styleUrls: ['./dsm.component.css']
})
export class DsmSearchComponent {
}
@Component({
selector: 'app-dsm-results',
templateUrl: './dsm-results.component.html',
styleUrls: ['./dsm.component.css']
})
export class DsmResultsComponent {
}
@Component({
selector: 'app-dsm-api',
templateUrl: './dsm-api.component.html',
styleUrls: ['./dsm.component.css']
})
export class DsmApiComponent {
}
@Component({
selector: 'app-dsm-add-api',
templateUrl: './dsm-add-api.component.html',
styleUrls: ['./dsm.component.css']
})
export class DsmAddApiComponent {
}

2
frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.html
View File

@ -15,7 +15,7 @@
<mat-panel-title>Datasources</mat-panel-title>
</mat-expansion-panel-header>
<div>
<a class="menu-item" [routerLink]="['ds/search']">Search</a>
<a class="menu-item" [routerLink]="['dsm/search']">Search</a>
</div>
</mat-expansion-panel>

4
frontends/dnet-is-application/src/app/main-menu-tree/main-menu-tree.component.css
View File

@ -1,4 +0,0 @@
.type-icon {
color: #757575;
margin-right: 5px;
}

40
frontends/dnet-is-application/src/app/main-menu-tree/main-menu-tree.component.html
View File

@ -1,40 +0,0 @@
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl">
<mat-tree-node *matTreeNodeDef="let node" matTreeNodeToggle matTreeNodePadding>
<button mat-icon-button disabled></button>
<mat-icon class="type-icon" [attr.aria-label]="node.type + 'icon'">
{{ node.type === 'menuitem' ? 'description' : 'folder' }}
</mat-icon>
<div *ngIf="!node.badge">
<a [routerLink]="[node.route]" *ngIf="node.route">{{node.name}}</a>
<span *ngIf="!node.route">{{node.name}}</span>
</div>
<div matBadge="{{node.badge}}" matBadgeOverlap="false" *ngIf="node.badge">
<a [routerLink]="[node.route]" *ngIf="node.route">{{node.name}}</a>
<span *ngIf="!node.route">{{node.name}}</span>
</div>
</mat-tree-node>
<mat-tree-node *matTreeNodeDef="let node; when: hasChild" matTreeNodePadding>
<button mat-icon-button matTreeNodeToggle
[attr.aria-label]="'Toggle ' + node.name">
<mat-icon class="mat-icon-rtl-mirror">
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
</mat-icon>
</button>
<mat-icon class="type-icon" [attr.aria-label]="node.type + 'icon'">
{{ node.type ==='menuitem' ? 'description' : 'folder' }}
</mat-icon>
<div *ngIf="!node.badge">
<a [routerLink]="[node.route]" *ngIf="node.route">{{node.name}}</a>
<span *ngIf="!node.route">{{node.name}}</span>
</div>
<div matBadge="{{node.badge}}" matBadgeOverlap="false" *ngIf="node.badge">
<a [routerLink]="[node.route]" *ngIf="node.route">{{node.name}}</a>
<span *ngIf="!node.route">{{node.name}}</span>
</div>
</mat-tree-node>
</mat-tree>

114
frontends/dnet-is-application/src/app/main-menu-tree/main-menu-tree.component.ts
View File

@ -1,114 +0,0 @@
import { Component } from '@angular/core';
import { MatTreeFlatDataSource, MatTreeFlattener } from '@angular/material/tree';
import { FlatTreeControl } from '@angular/cdk/tree';
import { menuData } from './menu-data';
import { ResourceType } from '../model/controller.model';
import { ISService } from '../is.service';
export interface MenuNode {
name: string;
type: string;
route?: string;
badge?: string;
children?: MenuNode[];
}
export interface FlatTreeNode {
name: string;
type: string;
level: number;
route?: string;
badge?: string;
expandable: boolean;
}
@Component({
selector: 'app-main-menu-tree',
templateUrl: './main-menu-tree.component.html',
styleUrls: ['./main-menu-tree.component.css']
})
export class MainMenuTreeComponent {
/** The TreeControl controls the expand/collapse state of tree nodes. */
treeControl: FlatTreeControl<FlatTreeNode>;
/** The TreeFlattener is used to generate the flat list of items from hierarchical data. */
treeFlattener: MatTreeFlattener<MenuNode, FlatTreeNode>;
/** The MatTreeFlatDataSource connects the control and flattener to provide data. */
dataSource: MatTreeFlatDataSource<MenuNode, FlatTreeNode>;
constructor(public service:ISService) {
this.treeFlattener = new MatTreeFlattener(
this.transformer,
this.getLevel,
this.isExpandable,
this.getChildren);
this.service.loadResourceTypes((data:ResourceType[]) => {
let simpleResources: MenuNode[] = []
let advancedResources: MenuNode[] = []
data.forEach(resType => {
let item:MenuNode = {
name: resType.name,
type: 'menuitem',
badge: resType.count.toString()
}
if (resType.simple) {
item.route = '/resources/' + resType.id;
simpleResources.push(item)
} else {
item.route = '/adv_resources/' + resType.id;
advancedResources.push(item)
}
})
menuData.forEach(m => {
if (m.name=='Simple Resources') {
m.children = simpleResources
} else if (m.name=='Advanced Resources') {
m.children = advancedResources
}
})
this.dataSource.data = menuData;
});
this.treeControl = new FlatTreeControl(this.getLevel, this.isExpandable);
this.dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener);
this.dataSource.data = menuData;
}
/** Transform the data to something the tree can read. */
transformer(node: MenuNode, level: number): FlatTreeNode {
return {
name: node.name,
type: node.type,
route: node.route,
badge: node.badge,
level,
expandable: !!node.children
};
}
/** Get the level of the node */
getLevel(node: FlatTreeNode): number {
return node.level;
}
/** Get whether the node is expanded or not. */
isExpandable(node: FlatTreeNode): boolean {
return node.expandable;
}
/** Get whether the node has children or not. */
hasChild(index: number, node: FlatTreeNode): boolean {
return node.expandable;
}
/** Get the children for the node. */
getChildren(node: MenuNode): MenuNode[] | null | undefined {
return node.children;
}
}

24
frontends/dnet-is-application/src/app/main-menu-tree/menu-data.ts
View File

@ -1,24 +0,0 @@
export const menuData = [
{ name: 'Home', type: 'menuitem' },
{
name: 'Datasources',
type: 'menu',
children: [
{ name: 'Search', type: 'menuitem' }
]
},
{
name: 'Simple Resources',
type: 'menu',
children: []
},
{
name: 'Advanced Resources',
type: 'menu',
children: []
},
{ name: 'Workflow History', type: 'menuitem' },
{ name: 'Container Info', type: 'menuitem', route: 'info' },
{ name: 'API Documentation', type: 'menuitem' }
];