new pipe filter table + rm display all tables on search page

version_2
floxx2112 1 year ago
parent dc25dc6da9
commit cc47e34572
  1. 21
      src/CustomInfoTableSearchPipe.ts
  2. 2
      src/app/app.module.ts
  3. 4
      src/app/joins/joins-page/joins-page.component.html
  4. 2
      src/app/search/request-page/request-page.component.html
  5. 41
      src/app/search/request-page/request-page.component.ts
  6. 8
      src/app/service/info-table.service.ts

@ -0,0 +1,21 @@
import { InfoTable } from './app/model/info-table';
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'filtertable',
pure: false
})
export class CustomFilterTable implements PipeTransform {
transform(items: InfoTable[], filter: string): any {
if (!items || !filter) {
return items;
}
// filter items array, items which match and return true will be
// kept, false will be filtered out
if(filter){
return items.filter(item => item.nameTable.toLowerCase().indexOf(filter) !== -1);
}
}
}

@ -26,6 +26,7 @@ import { ScriptManagementComponent } from './manager/script-management/script-ma
import { AddScriptComponent } from './manager/add-script/add-script.component'; import { AddScriptComponent } from './manager/add-script/add-script.component';
import { DndDirective } from './directives/dnd.directive' import { DndDirective } from './directives/dnd.directive'
import { CustomFilterScript } from 'src/CustomFilterScript'; import { CustomFilterScript } from 'src/CustomFilterScript';
import { CustomFilterTable } from 'src/CustomInfoTableSearchPipe';
import { EditScriptComponent } from './manager/edit-script/edit-script.component'; import { EditScriptComponent } from './manager/edit-script/edit-script.component';
import { TagsManagementComponent } from './manager/tags-management/tags-management.component'; import { TagsManagementComponent } from './manager/tags-management/tags-management.component';
import { NgMultiSelectDropDownModule } from 'ng-multiselect-dropdown'; import { NgMultiSelectDropDownModule } from 'ng-multiselect-dropdown';
@ -43,6 +44,7 @@ import {MatTooltipModule} from '@angular/material/tooltip';
RequestPageComponent, RequestPageComponent,
Custom_Ng2SearchPipe, Custom_Ng2SearchPipe,
CustomFilterScript, CustomFilterScript,
CustomFilterTable,
JoinsPageComponent, JoinsPageComponent,
CreateJoinsPageComponent, CreateJoinsPageComponent,
JoinsTableComponent, JoinsTableComponent,

@ -20,7 +20,7 @@
<input type="text" class="block w-full my-2 pl-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" [(ngModel)]="filterFirstTable" placeholder="Rechercher..."> <input type="text" class="block w-full my-2 pl-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" [(ngModel)]="filterFirstTable" placeholder="Rechercher...">
<select [(ngModel)]="firstTableData" (change)="getColumnsForJoinTwo()" size="5" class="mb-4 bg-gray-50 text-sm text-slate-800 rounded-lg focus:ring-slate-800 focus:border-slate-800 block w-full p-2.5"> <select [(ngModel)]="firstTableData" (change)="getColumnsForJoinTwo()" size="5" class="mb-4 bg-gray-50 text-sm text-slate-800 rounded-lg focus:ring-slate-800 focus:border-slate-800 block w-full p-2.5">
<option *ngFor="let table of tablesByFirstSchema | filter : filterFirstTable" id="{{ table.id }}" [ngValue]="table">{{ table.nameTable }}</option> <option *ngFor="let table of tablesByFirstSchema | filtertable : filterFirstTable" id="{{ table.id }}" [ngValue]="table">{{ table.nameTable }}</option>
</select> </select>
</div> </div>
</div> </div>
@ -50,7 +50,7 @@
<input type="text" class="block w-full my-2 pl-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" [(ngModel)]="filterSecondTable" placeholder="Rechercher..."> <input type="text" class="block w-full my-2 pl-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" [(ngModel)]="filterSecondTable" placeholder="Rechercher...">
<select [(ngModel)]="secondTableData" (change)="getColumnsForJoinTwo()" size="5" class="mb-4 bg-gray-50 text-sm text-slate-800 rounded-lg focus:ring-slate-800 focus:border-slate-800 block w-full p-2.5"> <select [(ngModel)]="secondTableData" (change)="getColumnsForJoinTwo()" size="5" class="mb-4 bg-gray-50 text-sm text-slate-800 rounded-lg focus:ring-slate-800 focus:border-slate-800 block w-full p-2.5">
<option *ngFor="let table of tablesBySecondSchema | filter : filterSecondTable" id="{{ table.id }}" [ngValue]="table">{{ table.nameTable }}</option> <option *ngFor="let table of tablesBySecondSchema | filtertable : filterSecondTable" id="{{ table.id }}" [ngValue]="table">{{ table.nameTable }}</option>
</select> </select>
</div> </div>
</div> </div>

@ -24,7 +24,7 @@
<div class="my-2"> <div class="my-2">
<label class="text-black">Tables : </label> <label class="text-black">Tables : </label>
<input type="text" class="block w-full my-2 pl-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" [(ngModel)]="filterTable" placeholder="Rechercher..."> <input type="text" class="block w-full my-2 pl-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" [(ngModel)]="filterTable" (ngModelChange)="sortCorrectly()" placeholder="Rechercher..." >
<select [(ngModel)]="tableData" (change)="useSchemaWithTableName()" *ngIf="!tablesBySchema" size="5" class="mb-4 bg-gray-50 text-sm text-slate-800 rounded-lg focus:ring-slate-800 focus:border-slate-800 block w-full p-2.5"> <select [(ngModel)]="tableData" (change)="useSchemaWithTableName()" *ngIf="!tablesBySchema" size="5" class="mb-4 bg-gray-50 text-sm text-slate-800 rounded-lg focus:ring-slate-800 focus:border-slate-800 block w-full p-2.5">
<option *ngFor="let table of infoTable | filter : filterTable" id="{{ table.id }}" [ngValue]="table">{{ table.nameTable }}</option> <option *ngFor="let table of infoTable | filter : filterTable" id="{{ table.id }}" [ngValue]="table">{{ table.nameTable }}</option>

@ -47,7 +47,7 @@ export class RequestPageComponent implements OnInit {
ngOnInit(): void {; ngOnInit(): void {;
this.getSchemas(); this.getSchemas();
this.getTables(); //this.getTables();
} }
public getSchemas():void { public getSchemas():void {
@ -72,6 +72,25 @@ export class RequestPageComponent implements OnInit {
); );
} }
public sortCorrectly(){
if(this.filterTable.length > 2){
if(this.schemaName){
this.infoTableService.getTablesWithFilterAndSchema(this.filterTable, this.schemaName).subscribe(
(response: InfoTable[]) => {
console.log(response);
this.tablesBySchema = response;
});
} else {
this.infoTableService.getTablesWithFilter(this.filterTable).subscribe(
(response: InfoTable[]) => {
console.log(response);
this.infoTable = response;
});
}
}
}
public divideColumns(nameSch: String, tempsTab: InfoTable):void { public divideColumns(nameSch: String, tempsTab: InfoTable):void {
console.log(nameSch, tempsTab.nameTable) console.log(nameSch, tempsTab.nameTable)
this.infoColumnService.getSelectedColumns(nameSch, tempsTab.nameTable).subscribe( this.infoColumnService.getSelectedColumns(nameSch, tempsTab.nameTable).subscribe(
@ -110,18 +129,17 @@ export class RequestPageComponent implements OnInit {
if(this.schemaName){ if(this.schemaName){
this.selectedSchema = this.schemaName; this.selectedSchema = this.schemaName;
} else { } else {
console.log(this.schemaData)
this.selectedSchema = this.schemaData.nameSchema; this.selectedSchema = this.schemaData.nameSchema;
} }
if(this.selectedSchema){ if(this.selectedSchema){
this.infoTableService.getTablesBySchema(this.selectedSchema).subscribe( // this.infoTableService.getTablesBySchema(this.selectedSchema).subscribe(
(response : InfoTable[]) => { // (response : InfoTable[]) => {
this.tablesBySchema = response; // this.tablesBySchema = response;
}, // },
(error: HttpErrorResponse) => { // (error: HttpErrorResponse) => {
alert(error.message) // alert(error.message)
} // }
); // );
if(this.tableData){ if(this.tableData){
this.divideColumns(this.selectedSchema, this.tableData); this.divideColumns(this.selectedSchema, this.tableData);
} }
@ -158,6 +176,9 @@ export class RequestPageComponent implements OnInit {
this.infoColumn = undefined; this.infoColumn = undefined;
this.currentTable = undefined; this.currentTable = undefined;
this.tableData = undefined; this.tableData = undefined;
this.filterTable = "";
this.infoTable = undefined;
this.schemaName = undefined;
} }
} }

@ -32,4 +32,12 @@ export class InfoTableService {
public getSchemasByTable(nameTable : String): Observable<InfoTable[]>{ public getSchemasByTable(nameTable : String): Observable<InfoTable[]>{
return this.http.get<InfoTable[]>(`${this.apiServerUrl}/api/schemas/${nameTable}`); return this.http.get<InfoTable[]>(`${this.apiServerUrl}/api/schemas/${nameTable}`);
} }
public getTablesWithFilter(filter : String): Observable<InfoTable[]>{
return this.http.get<InfoTable[]>(`${this.apiServerUrl}/api/tables/filter/${filter}`);
}
public getTablesWithFilterAndSchema(filter : String, schema: String): Observable<InfoTable[]>{
return this.http.get<InfoTable[]>(`${this.apiServerUrl}/api/tables/filter/${schema}/${filter}`);
}
} }

Loading…
Cancel
Save