diff --git a/src/main/webapp/app/app.module.ts b/src/main/webapp/app/app.module.ts index 37fb86e..0d54b73 100755 --- a/src/main/webapp/app/app.module.ts +++ b/src/main/webapp/app/app.module.ts @@ -24,6 +24,7 @@ import { SharedModule } from 'app/shared/shared.module'; import { MatIconModule } from '@angular/material/icon'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { RscTreeComponent } from './rsc-tree/rsc-tree.component'; +import { TableScreenComponent } from './table-screen/table-screen.component'; @NgModule({ imports: [ @@ -38,6 +39,7 @@ import { RscTreeComponent } from './rsc-tree/rsc-tree.component'; MatIconModule, BrowserModule, BrowserAnimationsModule, + TableScreenComponent, TabsModule.forRoot(), ], providers: [ diff --git a/src/main/webapp/app/rsc-tree/rsc-tree.component.html b/src/main/webapp/app/rsc-tree/rsc-tree.component.html index b841448..43dd211 100644 --- a/src/main/webapp/app/rsc-tree/rsc-tree.component.html +++ b/src/main/webapp/app/rsc-tree/rsc-tree.component.html @@ -1,50 +1,62 @@ -
-
+
+
-
-
+ +
+ VALUE:...{{ contextInput.value }} + - Select a context - + Select Context + + - - {{ item.name }} | - UUID: {{ item.id }} + + {{ ctx.name }} | + UUID: {{ ctx.id }}
- -

Resource tree

-
- - - - - - -
- - +
+

Resource tree

+
+ + -
-
- -
- - + + +
+ + + +
+
+ +
+
+ +
+
+ +
diff --git a/src/main/webapp/app/rsc-tree/rsc-tree.component.scss b/src/main/webapp/app/rsc-tree/rsc-tree.component.scss index 89b4f7e..68fd8ed 100644 --- a/src/main/webapp/app/rsc-tree/rsc-tree.component.scss +++ b/src/main/webapp/app/rsc-tree/rsc-tree.component.scss @@ -37,3 +37,8 @@ /* Do you changes here */ min-width: 450px; } + +.mat-mdc-form-field { + font-size: 14px; + width: 100%; +} diff --git a/src/main/webapp/app/rsc-tree/rsc-tree.component.ts b/src/main/webapp/app/rsc-tree/rsc-tree.component.ts index f6fd730..2bc1bcf 100644 --- a/src/main/webapp/app/rsc-tree/rsc-tree.component.ts +++ b/src/main/webapp/app/rsc-tree/rsc-tree.component.ts @@ -6,8 +6,8 @@ import { ResourcesLoaderService } from 'app/services/resources-loader.service'; import { IResource } from 'app/services/i-resource'; import { ContextsLoaderService } from 'app/services/contexts-loader.service'; import { IContextNode } from 'app/services/i-context-node'; -import { FormControl } from '@angular/forms'; import { Observable, map, startWith } from 'rxjs'; +import { FormGroup, FormControl, Validators, FormBuilder } from '@angular/forms'; @Component({ selector: 'jhi-rsc-tree', @@ -19,32 +19,34 @@ export class RscTreeComponent implements OnInit { nestedTreeControl = new NestedTreeControl(node => node.children); nestedDataSource = new MatTreeNestedDataSource(); @Output() treeNode = new EventEmitter(); //emitting event to parent + allContexts: IContextNode[]; - rootName: string; + filteredContexts: Observable | any; + myForm: FormGroup | any; - filteredContexts: Observable; - contextCtrl: FormControl = new FormControl(); + contextCtrl: FormControl; - constructor(private resLoader: ResourcesLoaderService, private ctxLoader: ContextsLoaderService) { - // this.selected = "option2"; + constructor(private resLoader: ResourcesLoaderService, private ctxLoader: ContextsLoaderService, private formBuilder: FormBuilder) { this.allContexts = {} as IContextNode[]; - this.rootName = ''; - this.filteredContexts = {} as Observable; + this.contextCtrl = new FormControl(); } ngOnInit(): void { this.resLoader.getResourcesByContext().subscribe(res => { this.nestedDataSource.data = res; }); + // per la form dei contesti this.ctxLoader.getData().subscribe(res => { this.allContexts = res; console.log('*******numero contesti...', res.length); - this.rootName = this.allContexts[0].name; - console.log('*******contesto root...', this.rootName); }); + this.myForm = this.formBuilder.group({ + context: [], + }); + this.filteredContexts = this.contextCtrl.valueChanges.pipe( startWith(''), - map(ctx => (ctx ? this._filterContexts(ctx) : Array.from(this.allContexts).slice())) + map(val => (val ? this.filterContexts(val) : Array.from(this.allContexts).slice())) ); } @@ -56,11 +58,10 @@ export class RscTreeComponent implements OnInit { } } - private _filterContexts(value: string): IContextNode[] { + private filterContexts(value: string): IContextNode[] { const filterValue = value.toLowerCase(); - return this.allContexts.filter(ctx => ctx.name.toLowerCase().includes(filterValue)); + return this.allContexts.filter(ctx => ctx.name.toLowerCase().includes(value.toLowerCase())); } - /* TODO: modificare per gestire eventuali eventi sulla onselect onSelectedContext(uid:string):void { this.resLoader.getResourcesByContext().subscribe(res => { diff --git a/src/main/webapp/app/rsc-tree/rsc-tree.module.ts b/src/main/webapp/app/rsc-tree/rsc-tree.module.ts index 7bd0f54..3380781 100644 --- a/src/main/webapp/app/rsc-tree/rsc-tree.module.ts +++ b/src/main/webapp/app/rsc-tree/rsc-tree.module.ts @@ -6,8 +6,9 @@ import { MatButtonModule } from '@angular/material/button'; import { MatMenuModule } from '@angular/material/menu'; import { MatIconModule } from '@angular/material/icon'; import { MatInputModule } from '@angular/material/input'; -import { FormsModule, ReactiveFormsModule } from '@angular/forms'; +import { FormBuilder, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { MatAutocompleteModule } from '@angular/material/autocomplete'; +import { TableScreenComponent } from 'app/table-screen/table-screen.component'; @NgModule({ declarations: [], @@ -20,9 +21,9 @@ import { MatAutocompleteModule } from '@angular/material/autocomplete'; MatIconModule, MatInputModule, FormsModule, - FormsModule, MatAutocompleteModule, ReactiveFormsModule, + TableScreenComponent, ], }) export class RscTreeModule {}