Layer type on list

This commit is contained in:
Michał Zieliński
2023-08-22 19:26:08 +02:00
parent f4978009b5
commit dd64b34fa3
7 changed files with 110 additions and 135 deletions

View File

@@ -1,7 +1,7 @@
import { HttpClient } from '@angular/common/http';
import { Component, HostListener, OnInit, ViewChild } from '@angular/core';
import { MatSort, MatSortable, MatSortModule } from '@angular/material/sort';
import { MatTableDataSource, MatTableModule } from '@angular/material/table';
import { Component, HostListener, OnInit } from '@angular/core';
import { MatSortModule } from '@angular/material/sort';
import { MatTableModule } from '@angular/material/table';
import { Layer } from 'src/app/models/layer.model';
import { MatInputModule } from '@angular/material/input';
import { MatFormFieldModule } from '@angular/material/form-field';
@@ -24,10 +24,8 @@ import { NgFor } from '@angular/common';
MatChipsModule, MatIconModule, NgFor]
})
export class LayersListComponent implements OnInit {
displayedColumns = ['number', 'name', 'source'];
dataSource!: MatTableDataSource<Layer>;
@ViewChild(MatSort) sort!: MatSort;
displayedColumns = ['number', 'name', 'type'];
dataSource!: Layer[];
start = 0;
limit = 50;
@@ -46,8 +44,7 @@ export class LayersListComponent implements OnInit {
public async onScroll(event: any) {
if (event.target.offsetHeight + event.target.scrollTop >= event.target.scrollHeight - 1 && !this.loadingInProgress) {
this.loadingInProgress = true;
const data: Layer[] = await Layer.getList(this._http, this.start, this.limit, this.codes);
this.dataSource.data = this.dataSource.data.concat(data);
this.dataSource = await Layer.getList(this._http, this.start, this.limit, this.codes);
this.start = this.end;
this.end = this.limit + this.start;
setTimeout(() => {
@@ -56,9 +53,7 @@ export class LayersListComponent implements OnInit {
}
}
async ngOnInit() {
this.dataSource = new MatTableDataSource(await Layer.getList(this._http, this.start, this.limit, this.codes));
this.dataSource.sort = this.sort;
this.dataSource.sort.sort({ id: 'number', start: 'desc' } as MatSortable);
this.dataSource = await Layer.getList(this._http, this.start, this.limit, this.codes);
this.start = this.end;
this.end = this.limit + this.start;
}
@@ -71,7 +66,7 @@ export class LayersListComponent implements OnInit {
this.start = 0;
this.end = this.limit + this.start;
this.codes.splice(index, 1);
this.dataSource.data = await Layer.getList(this._http, this.start, this.limit, this.codes);
this.dataSource = await Layer.getList(this._http, this.start, this.limit, this.codes);
}
}
// eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -81,7 +76,7 @@ export class LayersListComponent implements OnInit {
this.start = 0;
this.end = this.limit + this.start;
this.codes.push(value);
this.dataSource.data = await Layer.getList(this._http, this.start, this.limit, this.codes);
this.dataSource = await Layer.getList(this._http, this.start, this.limit, this.codes);
}
event.target.value = '';
}