information-system-gui/src/main/webapp/app/table-screen-es/table-screen-es.component.ts

/* eslint-disable @typescript-eslint/no-unnecessary-condition */
/* eslint-disable @typescript-eslint/explicit-function-return-type */
/* eslint-disable no-console */
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 { IEService } from 'app/services/i-e-service';
import { ResourcesImplService } from 'app/services/resources-impl.service';
import { ResourceAddComponent } from 'app/resource-add/resource-add.component';
import { GenericInfoComponent } from 'app/generic-info/generic-info.component';
import { IResource } from 'app/services/i-resource';
import { IResourceType } from 'app/services/i-resource-type';
import { FacetComposerComponent } from 'app/facet-composer/facet-composer.component';
import { FacetEditorComponent } from 'app/facet-editor/facet-editor.component';

@Component({
  selector: 'jhi-table-screen-es',
  templateUrl: './table-screen-es.component.html',
  //NB: css è unico per tutti i template!
  styleUrls: ['../table-screen/table-screen.component.scss'],
  providers: [ResourcesImplService],
})

export class TableScreenEsComponent implements OnInit, AfterViewInit, OnChanges{
  //NB 'actions' CI DEVE ESSERE, altrimenti la tabella non viene visualizzata
  //displayedColumns: string[] = ['name', 'id', 'status', 'lastMod', 'artifact', 'group', 'version', 'endpoint','actions'];
  displayedColumns: string[] = ['name', 'id', 'status', 'lastMod',  'endpoint','actions'];
  dataFromService: IEService[];
  dataSource = new MatTableDataSource();
  tableDetail: IEService;
  dialogAddRef: MatDialogRef<ResourceAddComponent> |undefined;
  dialogInfoRef: MatDialogRef<GenericInfoComponent> |undefined;
 

  @Input() currentCtx: IContextNode; //fetching event from parent
  @Input() currentCtxPath: string; //fetching event from parent
  @Input() typeObject: IResource; 
  @Output() jsonEmitter = new EventEmitter<IEService>();
  @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[] = [];
  dummyRes: string;
  
  
  
  constructor(private myDataService: ResourcesImplService, private createDialog: MatDialog, private editDialog: MatDialog) {
    this.currentCtx = {} as IContextNode;
    this.tableDetail = {} as IEService;
    this.dataFromService = [];
    this.sort = new MatSort();
    this.paginator = {} as MatPaginator;
    this.typeObject = {} as IResourceType;
    this.currentCtxPath = '';
    this.dummyRes = '';
  }

  ngAfterViewInit(): void {
    this.dataSource.sort = this.sort;
    this.dataSource.paginator = this.paginator;
  }
  
  ngOnInit(): void {
	  
	    let ctxPath = '';
	  	// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
	  	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.resourceType*/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();
  }

 // per tabbed pane (versione con aggiunta dinamica)

  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);
  }
    openDialogDescription(): void {
    this.dialogInfoRef = this.createDialog.open(GenericInfoComponent, {
      data: {description: this.typeObject.description}
    });
  }
  
  
 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);
  }
  

  
}