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

menu with panels

This commit is contained in:
Michele Artini 2023-01-20 13:19:34 +01:00
parent 93560e881e
commit 8791d61303
7 changed files with 118 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -4,7 +4,7 @@
[mode]="(isHandset$ | async) ? 'over' : 'side'"
[opened]="(isHandset$ | async) === false">
<mat-toolbar>Menu</mat-toolbar>
<app-main-menu-tree></app-main-menu-tree>
<app-main-menu-panels></app-main-menu-panels>
</mat-sidenav>
<mat-sidenav-content>
<mat-toolbar color="primary">

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

@ -22,6 +22,8 @@ import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input'
import { MatTableModule } from '@angular/material/table';
import { ProtocolsComponent } from './protocols/protocols.component';
import { MainMenuPanelsComponent } from './main-menu-panels/main-menu-panels.component';
import { MatExpansionModule } from '@angular/material/expansion';
@NgModule({
declarations: [
@ -29,7 +31,8 @@ import { ProtocolsComponent } from './protocols/protocols.component';
InfoComponent,
DatafilterPipe,
MainMenuTreeComponent,
ProtocolsComponent
ProtocolsComponent,
MainMenuPanelsComponent
],
imports: [
BrowserModule,
@ -48,7 +51,8 @@ import { ProtocolsComponent } from './protocols/protocols.component';
MatCardModule,
MatFormFieldModule,
MatInputModule,
MatTableModule
MatTableModule,
MatExpansionModule
],
providers: [],
bootstrap: [AppComponent]

13
frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.css Normal file
View File

@ -0,0 +1,13 @@
.menu-count {
padding-top: 0.1em;
padding-bottom: 0.1em;
padding-left: 0.4em;
padding-right: 0.4em;
border-radius: 1em;
font-size: 0.7em;
color: #fff;
background-color:cornflowerblue;
width: 2em;
text-align: center;
float: right;
}

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

@ -0,0 +1,57 @@
<mat-accordion>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>Home</mat-panel-title>
</mat-expansion-panel-header>
<p>...</p>
</mat-expansion-panel>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>Datasources</mat-panel-title>
</mat-expansion-panel-header>
<mat-nav-list>
<a mat-list-item [routerLink]="['ds/search']">Search</a>
</mat-nav-list>
</mat-expansion-panel>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>Simple Resources</mat-panel-title>
</mat-expansion-panel-header>
<mat-nav-list>
<ng-container *ngFor="let r of resTypes">
<a mat-list-item [routerLink]="['resources/' + r.id]" *ngIf="r.simple">{{r.name}} <span class="menu-count">{{r.count}}</span></a>
</ng-container>
</mat-nav-list>
</mat-expansion-panel>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>Advanced Resources</mat-panel-title>
</mat-expansion-panel-header>
<mat-nav-list>
<ng-container *ngFor="let r of resTypes">
<a mat-list-item [routerLink]="['adv_resources/' + r.id]" *ngIf="!r.simple">{{r.name}} <span class="menu-count">{{r.count}}</span></a>
</ng-container>
</mat-nav-list>
</mat-expansion-panel>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>Logs</mat-panel-title>
</mat-expansion-panel-header>
<mat-nav-list>
<a mat-list-item [routerLink]="['wf_history']">Workflow History</a>
</mat-nav-list>
</mat-expansion-panel>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>Info</mat-panel-title>
</mat-expansion-panel-header>
<mat-nav-list>
<a mat-list-item [routerLink]="['info']">Container Info</a>
</mat-nav-list>
</mat-expansion-panel>
</mat-accordion>

23
frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.spec.ts Normal file
View File

@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { MainMenuPanelsComponent } from './main-menu-panels.component';
describe('MainMenuPanelsComponent', () => {
let component: MainMenuPanelsComponent;
let fixture: ComponentFixture<MainMenuPanelsComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ MainMenuPanelsComponent ]
})
.compileComponents();
fixture = TestBed.createComponent(MainMenuPanelsComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

17
frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.ts Normal file
View File

@ -0,0 +1,17 @@
import { Component } from '@angular/core';
import { ResourceType } from '../model/controller.model';
import { ISCommonService } from '../iscommon.service';
@Component({
selector: 'app-main-menu-panels',
templateUrl: './main-menu-panels.component.html',
styleUrls: ['./main-menu-panels.component.css']
})
export class MainMenuPanelsComponent {
resTypes:ResourceType[] = [];
constructor(public service:ISCommonService) {
this.service.loadResourceTypes().subscribe((data:ResourceType[]) => this.resTypes = data);
}
}

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

@ -3,7 +3,7 @@
<mat-card-title>Harvesting Protocols</mat-card-title>
</mat-card-header>
<mat-card-content>
<div style="margin-top: 20px;" *ngFor="let prot of protDatasources">
<div style="margin-top: 3em;" *ngFor="let prot of protDatasources">
<h3>{{prot.protocol}}</h3>
<table mat-table [dataSource]="prot.datasource" class="mat-elevation-z8">