work in progress
This commit is contained in:
parent
b2c7130612
commit
ea2ef3c355
|
|
@ -0,0 +1,150 @@
|
|||
# This file is inspired by https://github.com/alexkaratarakis/gitattributes
|
||||
#
|
||||
# Auto detect text files and perform LF normalization
|
||||
# http://davidlaing.com/2012/09/19/customise-your-gitattributes-to-become-a-git-ninja/
|
||||
* text=auto
|
||||
|
||||
# The above will handle all files NOT found below
|
||||
# These files are text and should be normalized (Convert crlf => lf)
|
||||
|
||||
*.bat text eol=crlf
|
||||
*.cmd text eol=crlf
|
||||
*.ps1 text eol=crlf
|
||||
*.coffee text
|
||||
*.css text
|
||||
*.cql text
|
||||
*.df text
|
||||
*.ejs text
|
||||
*.html text
|
||||
*.java text
|
||||
*.js text
|
||||
*.json text
|
||||
*.less text
|
||||
*.properties text
|
||||
*.sass text
|
||||
*.scss text
|
||||
*.sh text eol=lf
|
||||
*.sql text
|
||||
*.txt text
|
||||
*.ts text
|
||||
*.xml text
|
||||
*.yaml text
|
||||
*.yml text
|
||||
|
||||
# Documents
|
||||
*.doc diff=astextplain
|
||||
*.DOC diff=astextplain
|
||||
*.docx diff=astextplain
|
||||
*.DOCX diff=astextplain
|
||||
*.dot diff=astextplain
|
||||
*.DOT diff=astextplain
|
||||
*.pdf diff=astextplain
|
||||
*.PDF diff=astextplain
|
||||
*.rtf diff=astextplain
|
||||
*.RTF diff=astextplain
|
||||
*.markdown text
|
||||
*.md text
|
||||
*.adoc text
|
||||
*.textile text
|
||||
*.mustache text
|
||||
*.csv text
|
||||
*.tab text
|
||||
*.tsv text
|
||||
*.txt text
|
||||
AUTHORS text
|
||||
CHANGELOG text
|
||||
CHANGES text
|
||||
CONTRIBUTING text
|
||||
COPYING text
|
||||
copyright text
|
||||
*COPYRIGHT* text
|
||||
INSTALL text
|
||||
license text
|
||||
LICENSE text
|
||||
NEWS text
|
||||
readme text
|
||||
*README* text
|
||||
TODO text
|
||||
|
||||
# Graphics
|
||||
*.png binary
|
||||
*.jpg binary
|
||||
*.jpeg binary
|
||||
*.gif binary
|
||||
*.tif binary
|
||||
*.tiff binary
|
||||
*.ico binary
|
||||
# SVG treated as an asset (binary) by default. If you want to treat it as text,
|
||||
# comment-out the following line and uncomment the line after.
|
||||
*.svg binary
|
||||
#*.svg text
|
||||
*.eps binary
|
||||
|
||||
# These files are binary and should be left untouched
|
||||
# (binary is a macro for -text -diff)
|
||||
*.class binary
|
||||
*.jar binary
|
||||
*.war binary
|
||||
|
||||
## LINTERS
|
||||
.csslintrc text
|
||||
.eslintrc text
|
||||
.jscsrc text
|
||||
.jshintrc text
|
||||
.jshintignore text
|
||||
.stylelintrc text
|
||||
|
||||
## CONFIGS
|
||||
*.conf text
|
||||
*.config text
|
||||
.editorconfig text
|
||||
.gitattributes text
|
||||
.gitconfig text
|
||||
.gitignore text
|
||||
.htaccess text
|
||||
*.npmignore text
|
||||
|
||||
## HEROKU
|
||||
Procfile text
|
||||
.slugignore text
|
||||
|
||||
## AUDIO
|
||||
*.kar binary
|
||||
*.m4a binary
|
||||
*.mid binary
|
||||
*.midi binary
|
||||
*.mp3 binary
|
||||
*.ogg binary
|
||||
*.ra binary
|
||||
|
||||
## VIDEO
|
||||
*.3gpp binary
|
||||
*.3gp binary
|
||||
*.as binary
|
||||
*.asf binary
|
||||
*.asx binary
|
||||
*.fla binary
|
||||
*.flv binary
|
||||
*.m4v binary
|
||||
*.mng binary
|
||||
*.mov binary
|
||||
*.mp4 binary
|
||||
*.mpeg binary
|
||||
*.mpg binary
|
||||
*.swc binary
|
||||
*.swf binary
|
||||
*.webm binary
|
||||
|
||||
## ARCHIVES
|
||||
*.7z binary
|
||||
*.gz binary
|
||||
*.rar binary
|
||||
*.tar binary
|
||||
*.zip binary
|
||||
|
||||
## FONTS
|
||||
*.ttf binary
|
||||
*.eot binary
|
||||
*.otf binary
|
||||
*.woff binary
|
||||
*.woff2 binary
|
||||
|
|
@ -0,0 +1,74 @@
|
|||
<div class="p-3">
|
||||
<div class="d-flex flex-row">
|
||||
<mat-form-field class="mb-3 pe-3">
|
||||
<mat-label>Search by Name</mat-label>
|
||||
<input matInput (keyup)="applyFilter($event)" placeholder="type in..." #input />
|
||||
</mat-form-field>
|
||||
<div id="btn-group" class="col-md-3 ps-3 mt-3">
|
||||
<button mat-raised-button color="primary" (click)="reloadTable()" >
|
||||
<mat-icon>replay</mat-icon><span>Reload</span>
|
||||
</button>
|
||||
<button mat-raised-button color="primary" (click)="openFacetComposer()">
|
||||
<mat-icon>add</mat-icon><span>Add new</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mat-elevation-z4">
|
||||
<table mat-table [dataSource]="dataSource" matSort>
|
||||
|
||||
<ng-container matColumnDef="id">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Id</th>
|
||||
<td mat-cell *matCellDef="let item" >{{ item.id }} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="lastMod">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Last Modified</th>
|
||||
<td mat-cell *matCellDef="let item">{{ item.lastMod }}</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header disabled>Actions</th>
|
||||
<td mat-cell *matCellDef="let item">
|
||||
<!--<div class="d-flex flex-row py-4">-->
|
||||
<div class="d-flex flex-row">
|
||||
<button mat-button class="action-btn" color="primary" (click)="addTab(this.item.id)" ><mat-icon>visibility</mat-icon></button>
|
||||
<button mat-button class="action-btn" color="primary" (click)="openFacetEditor(this.item.id)"><mat-icon>edit</mat-icon></button>
|
||||
<button mat-button class="action-btn" color="primary"><mat-icon>delete</mat-icon></button>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- rows visualization -->
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
|
||||
|
||||
<!-- Rows shown when there is no matching data. -->
|
||||
<tr class="mat-row" *matNoDataRow>
|
||||
<td class="mat-cell" colspan="4">No data matching the filter "{{ input.value }}"</td>
|
||||
</tr>
|
||||
</table>
|
||||
<mat-paginator [pageSizeOptions]="[10, 20, 30]" showFirstLastButtons> </mat-paginator>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-3">
|
||||
<mat-tab-group [selectedIndex]="selectedIdx">
|
||||
<ng-container *ngFor="let tab of tabs; let index = index">
|
||||
<mat-tab>
|
||||
<!--stile linguetta tab begin-->
|
||||
<ng-template mat-tab-label>
|
||||
<div class="col" style="margin-left: 20px">{{ tab.title }}</div>
|
||||
<button *ngIf="tab.title !== 'JSON View'" style="color: black" mat-icon-button (click)="closeTab(index)">
|
||||
<mat-icon>close</mat-icon>
|
||||
</button>
|
||||
</ng-template>
|
||||
<!-- tab close-->
|
||||
<div *ngIf="tab.title !== 'JSON View'; else defaultTab">
|
||||
<jhi-rawjson-pane [chosenId]="tab.id" [resourceTypeName]="typeObject.name" ></jhi-rawjson-pane>
|
||||
</div>
|
||||
<ng-template #defaultTab>
|
||||
</ng-template>
|
||||
</mat-tab>
|
||||
</ng-container>
|
||||
</mat-tab-group>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,187 @@
|
|||
/* eslint-disable @typescript-eslint/no-unnecessary-condition */
|
||||
import {
|
||||
Component,
|
||||
Output,
|
||||
EventEmitter,
|
||||
OnInit,
|
||||
ViewChild,
|
||||
AfterViewInit,
|
||||
OnChanges,
|
||||
SimpleChanges,
|
||||
Input,
|
||||
QueryList,
|
||||
} from '@angular/core';
|
||||
|
||||
import { MatTableDataSource } from '@angular/material/table';
|
||||
import { MatSort} from '@angular/material/sort';
|
||||
import { IContextNode } from 'app/services/i-context-node';
|
||||
import { MatPaginator} from '@angular/material/paginator';
|
||||
import { MatTab, MatTabGroup } from '@angular/material/tabs';
|
||||
import { MatDialogRef, MatDialog, MatDialogConfig } from '@angular/material/dialog';
|
||||
import { ITabbedEntity } from 'app/i-tabbed-entity';
|
||||
import { ResourcesImplService } from 'app/services/resources-impl.service';
|
||||
import { IResource } from 'app/services/i-resource';
|
||||
import { IResourceType } from 'app/services/i-resource-type';
|
||||
import { MatFormFieldControl } from '@angular/material/form-field';
|
||||
|
||||
import { FacetComposerComponent } from 'app/facet-composer/facet-composer.component';
|
||||
import { FacetEditorComponent } from 'app/facet-editor/facet-editor.component';
|
||||
import { IVirtualService } from 'app/services/i-virtual-service';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'jhi-table-screen-vs',
|
||||
templateUrl: './table-screen-vs.component.html',
|
||||
styleUrls: ['./table-screen-vs.component.scss'],
|
||||
//NB->dialog form is a provider
|
||||
providers: [{provide:MatFormFieldControl,
|
||||
// useExisting:ResourceAddComponent },
|
||||
useExisting:FacetComposerComponent },
|
||||
ResourcesImplService]
|
||||
})
|
||||
|
||||
|
||||
export class TableScreenVsComponent implements OnInit, AfterViewInit, OnChanges {
|
||||
displayedColumns: string[] = ['id','lastMod'];
|
||||
dataFromService: IVirtualService[];
|
||||
dataSource = new MatTableDataSource();
|
||||
tableDetail: IVirtualService;
|
||||
dialogAddRef: MatDialogRef<TableScreenVsComponent> |undefined;
|
||||
errorMessage = '';
|
||||
|
||||
@Input() currentCtx: IContextNode; //fetching event from parent
|
||||
@Input() currentCtxPath: string; //fetching event from parent
|
||||
@Input() typeObject: IResource;
|
||||
@Output() jsonEmitter = new EventEmitter<IVirtualService>();
|
||||
@ViewChild(MatSort) sort: MatSort;
|
||||
@ViewChild(MatPaginator) paginator: MatPaginator;
|
||||
|
||||
//per tabbed view
|
||||
@ViewChild(MatTab)
|
||||
public tabGroup: MatTabGroup | any;
|
||||
public tabNodes: QueryList<MatTab> | any;
|
||||
public closedTabs = [];
|
||||
public tabs: ITabbedEntity[] = [{ title: 'JSON View', content: '', type: 0, id: '' }];
|
||||
selectedIdx = 0;
|
||||
chosenIds: string[] = [];
|
||||
rawJson: string;
|
||||
////////// fine tabbed view
|
||||
|
||||
constructor(private myDataService: ResourcesImplService, private createDialog: MatDialog, private editDialog: MatDialog) {
|
||||
this.currentCtx = {} as IContextNode;
|
||||
this.tableDetail = {} as IVirtualService;
|
||||
this.dataFromService = [];
|
||||
this.sort = new MatSort();
|
||||
this.paginator = {} as MatPaginator;
|
||||
//this.resourceType = '';
|
||||
this.typeObject = {} as IResourceType;
|
||||
this.currentCtxPath = '';
|
||||
this.rawJson = '';
|
||||
}
|
||||
|
||||
ngAfterViewInit(): void {
|
||||
this.dataSource.sort = this.sort;
|
||||
this.dataSource.paginator = this.paginator;
|
||||
}
|
||||
|
||||
|
||||
ngOnInit(): void {
|
||||
|
||||
let ctxPath = '';
|
||||
if(this.currentCtx.path !== undefined){
|
||||
ctxPath = this.currentCtx.path;
|
||||
}else if(this.currentCtxPath !== undefined){
|
||||
ctxPath = this.currentCtxPath
|
||||
}
|
||||
|
||||
this.myDataService.fetchResourceImpls(ctxPath,this.typeObject.name).subscribe(res => {
|
||||
this.dataFromService = res;
|
||||
this.dataSource.data = res;
|
||||
//this is to filter only on the 'name' property
|
||||
this.dataSource.filterPredicate = function (record:any,filter:string) {
|
||||
return record.name.indexOf(filter)!==-1;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges): void {
|
||||
|
||||
for (const propName in changes) {
|
||||
if (propName === 'currentCtx') {
|
||||
const param = changes[propName];
|
||||
this.currentCtx = <IContextNode>param.currentValue;
|
||||
//controllo che l'oggetto non sia vuoto
|
||||
if (Object.keys(this.currentCtx).length !== 0) {
|
||||
this.myDataService.fetchResourceImpls(this.currentCtx.path,this.typeObject.name).subscribe(res => {
|
||||
this.dataFromService = res;
|
||||
this.dataSource.data = res;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
applyFilter(event: Event): void {
|
||||
const filterValue = (event.target as HTMLInputElement).value;
|
||||
this.dataSource.filter = filterValue.trim().toLowerCase();
|
||||
}
|
||||
|
||||
// for the dynamic tabbed pane
|
||||
|
||||
removeTab(index: number): void {
|
||||
this.tabs.splice(index, 1);
|
||||
}
|
||||
|
||||
addTab(itemId: string): void {
|
||||
if (!this.chosenIds.includes(itemId)) {
|
||||
const newItem = {
|
||||
id: itemId,
|
||||
title: itemId.substring(0, 20) + '...',
|
||||
//TODO: content a regime è la stringa JSON
|
||||
content: itemId,
|
||||
type: 0,
|
||||
};
|
||||
this.selectedIdx++;
|
||||
this.chosenIds.push(itemId);
|
||||
this.tabs.push(newItem);
|
||||
}
|
||||
}
|
||||
|
||||
reloadTable():void{
|
||||
this.myDataService.fetchResourceImpls(this.currentCtx.path,this.typeObject.name).subscribe(res => {
|
||||
this.dataFromService = res;
|
||||
this.dataSource.data = res;
|
||||
})
|
||||
}
|
||||
|
||||
closeTab(index: number): void {
|
||||
|
||||
const x = this.chosenIds.indexOf(this.tabs[index].id);
|
||||
if (x !== -1) {
|
||||
this.chosenIds.splice(x, 1);
|
||||
}
|
||||
|
||||
// this.closedTabs.push(index);
|
||||
this.tabGroup.selectedIndex = this.tabs.length - 1;
|
||||
//this.chosenIds.indexOf();
|
||||
this.tabs.splice(index, 1);
|
||||
}
|
||||
|
||||
openFacetComposer(): void {
|
||||
const dialogConfig = new MatDialogConfig();
|
||||
dialogConfig.disableClose = true;
|
||||
dialogConfig.autoFocus = true;
|
||||
dialogConfig.data= {type: this.typeObject, context: this.currentCtx};
|
||||
this.createDialog.open(FacetComposerComponent,dialogConfig);
|
||||
|
||||
}
|
||||
|
||||
openFacetEditor(uid: string): void {
|
||||
const dialogConfig = new MatDialogConfig();
|
||||
dialogConfig.disableClose = true;
|
||||
dialogConfig.autoFocus = true;
|
||||
dialogConfig.data= {type: this.typeObject, context: this.currentCtx, uid};
|
||||
this.editDialog.open(FacetEditorComponent,dialogConfig);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { SharedModule } from 'app/shared/shared.module';
|
||||
import { MatTableModule } from '@angular/material/table';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatSortModule } from '@angular/material/sort';
|
||||
import { MatPaginatorModule } from '@angular/material/paginator';
|
||||
import { RawjsonPaneComponent } from 'app/rawjson-pane/rawjson-pane.component';
|
||||
import { MAT_DIALOG_DEFAULT_OPTIONS, MatDialogModule } from '@angular/material/dialog';
|
||||
import { ResourceAddComponent } from 'app/resource-add/resource-add.component';
|
||||
import { TypeHeadlineModule } from 'app/type-headline/type-headline.module';
|
||||
import { AsyncPipe } from '@angular/common';
|
||||
import { RouterModule } from '@angular/router';
|
||||
import { TableScreenVsComponent } from './table-screen-vs.component';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
SharedModule,MatTableModule,MatIconModule,MatSortModule,
|
||||
MatPaginatorModule, MatDialogModule, RawjsonPaneComponent,
|
||||
TypeHeadlineModule, AsyncPipe, RouterModule
|
||||
],
|
||||
|
||||
declarations:[TableScreenVsComponent],
|
||||
exports: [TableScreenVsComponent],
|
||||
//NB: QUI VA DICHIARATO IL DIALOG DI DATAENTRY COME COMPONENT
|
||||
entryComponents: [ResourceAddComponent],
|
||||
bootstrap: [TableScreenVsComponent],
|
||||
})
|
||||
|
||||
|
||||
|
||||
export class TableScreenVsModule { }
|
||||
|
|
@ -24,10 +24,8 @@ import { MatDialogRef, MatDialog, MatDialogConfig } from '@angular/material/dial
|
|||
import { ITabbedEntity } from 'app/i-tabbed-entity';
|
||||
import { IHostingNode } from 'app/services/i-hosting-node';
|
||||
import { ResourcesImplService } from 'app/services/resources-impl.service';
|
||||
//import { ResourceAddComponent } from 'app/resource-add/resource-add.component';
|
||||
import { IResource } from 'app/services/i-resource';
|
||||
import { IResourceType } from 'app/services/i-resource-type';
|
||||
import { DummyService } from 'app/services/dummy.service';
|
||||
import { MatFormFieldControl } from '@angular/material/form-field';
|
||||
|
||||
import { FacetComposerComponent } from 'app/facet-composer/facet-composer.component';
|
||||
|
|
@ -41,7 +39,7 @@ import { FacetEditorComponent } from 'app/facet-editor/facet-editor.component';
|
|||
providers: [{provide:MatFormFieldControl,
|
||||
// useExisting:ResourceAddComponent },
|
||||
useExisting:FacetComposerComponent },
|
||||
ResourcesImplService, DummyService],
|
||||
ResourcesImplService]
|
||||
})
|
||||
export class TableScreenComponent implements OnInit, AfterViewInit, OnChanges {
|
||||
//NB 'actions' CI DEVE ESSERE, altrimenti la tabella non viene visualizzata
|
||||
|
|
|
|||
|
|
@ -23,10 +23,6 @@ import { RouterModule } from '@angular/router';
|
|||
//NB: QUI VA DICHIARATO IL DIALOG DI DATAENTRY COME COMPONENT
|
||||
entryComponents: [ResourceAddComponent],
|
||||
bootstrap: [TableScreenComponent],
|
||||
/*
|
||||
providers: [{provide: MAT_DIALOG_DEFAULT_OPTIONS,
|
||||
useValue: { height: '200px', width: '250px', autoFocus: true }}]
|
||||
*/
|
||||
})
|
||||
|
||||
export class TableScreenModule {
|
||||
|
|
|
|||
Loading…
Reference in New Issue