From aa955a1b3b96f1d6963da97aa398874a8032886e Mon Sep 17 00:00:00 2001 From: phil Date: Wed, 15 May 2024 15:05:17 +0200 Subject: [PATCH] Admin basket: fix import error message and import date display update --- .../admin/admin-basket/basket.component.ts | 193 +++++++++--------- .../admin/admin-list/admin-list.component.ts | 184 ++++++++--------- 2 files changed, 194 insertions(+), 183 deletions(-) diff --git a/src/app/admin/admin-basket/basket.component.ts b/src/app/admin/admin-basket/basket.component.ts index fb16cae..851c9b1 100644 --- a/src/app/admin/admin-basket/basket.component.ts +++ b/src/app/admin/admin-basket/basket.component.ts @@ -1,5 +1,7 @@ -import { Component, OnInit, Input, ViewChild, ElementRef, - ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core' +import { + Component, OnInit, Input, ViewChild, ElementRef, + ChangeDetectorRef, ChangeDetectionStrategy +} from '@angular/core' import { ActivatedRoute } from '@angular/router' import { UntypedFormGroup, UntypedFormControl } from '@angular/forms' @@ -14,101 +16,108 @@ import { AdminBasket, AdminService, FileImport } from '../../openapi' import { HtmlSnackbarComponent } from '../../custom-snackbar/custom-snackbar.component' @Component({ - selector: 'gisaf-admin-basket', - templateUrl: './basket.component.html', - styleUrls: ['./basket.component.css'], - changeDetection: ChangeDetectionStrategy.OnPush, + selector: 'gisaf-admin-basket', + templateUrl: './basket.component.html', + styleUrls: ['./basket.component.css'], + changeDetection: ChangeDetectionStrategy.OnPush, }) export class AdminBasketComponent implements OnInit { - constructor( - public adminDataService: AdminDataService, - private route: ActivatedRoute, - private snackBar: MatSnackBar, - private cdr: ChangeDetectorRef, - public adminService: AdminService, - ) {} + constructor( + public adminDataService: AdminDataService, + private route: ActivatedRoute, + private snackBar: MatSnackBar, + private cdr: ChangeDetectorRef, + public adminService: AdminService, + ) { } - basket: AdminBasket - dataSource: MatTableDataSource - @ViewChild(MatPaginator, {static: true}) paginator: MatPaginator - @ViewChild(MatSort, {static: true}) sort: MatSort - selection = new SelectionModel(true, []) - unlockDeleteFormGroup: UntypedFormGroup = new UntypedFormGroup({}) - columns: string[] = [ - 'name', - 'status', - 'time', - 'store', - 'project', - 'surveyor', - 'equipment', - 'import', - 'delete', - ] - filterText: string + basket: AdminBasket + dataSource: MatTableDataSource + @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator + @ViewChild(MatSort, { static: true }) sort: MatSort + selection = new SelectionModel(true, []) + unlockDeleteFormGroup: UntypedFormGroup = new UntypedFormGroup({}) + columns: string[] = [ + 'name', + 'status', + 'time', + 'store', + 'project', + 'surveyor', + 'equipment', + 'import', + 'delete', + ] + filterText: string - ngOnInit() { - this.route.data.subscribe( - (basket: object) => { - this.basket = basket['basket'] - this.dataSource = new MatTableDataSource(this.basket.files) - this.dataSource.sort = this.sort - this.dataSource.paginator = this.paginator - this.cdr.markForCheck() - } - ) - this.unlockDeleteFormGroup = new UntypedFormGroup({ - 'canDelete': new UntypedFormControl(), + ngOnInit() { + this.route.data.subscribe( + (basket: object) => { + this.basket = basket['basket'] + this.dataSource = new MatTableDataSource(this.basket.files) + this.dataSource.sort = this.sort + this.dataSource.paginator = this.paginator + this.cdr.markForCheck() + } + ) + this.unlockDeleteFormGroup = new UntypedFormGroup({ + 'canDelete': new UntypedFormControl(), + }) + } + + getColumns() { + return this.columns.filter( + col => this.basket.columns.indexOf(col) != -1 + ) + } + + applyFilter() { + this.dataSource.filter = this.filterText.trim().toLowerCase() + } + + download(item: FileImport) { + window.open('/api/admin/basket/download/' + this.basket.name + '/' + item.id + '/' + item.name) + } + + importItem(item: FileImport, dryRun: boolean) { + return this.adminService.importBasketFileApiAdminBasketImportBasketFileIdGet({ + basket: this.basket.name, + fileId: item.id, + dryRun: dryRun + }).subscribe({ + next: resp => { + this.basket.files.find(row => row.id == item.id).time = new Date(resp.time) + this.snackBar.openFromComponent(HtmlSnackbarComponent, { + data: resp, + //duration: 3000 }) - } - - getColumns() { - return this.columns.filter( - col => this.basket.columns.indexOf(col) != -1 + this.cdr.markForCheck() + }, + error: err => { + this.snackBar.open( + `Cannot import: ${err.body['detail'] || err.message || err.statusText}`, + 'Got it', + { 'politeness': 'assertive' } ) - } + } + }) + } - applyFilter() { - this.dataSource.filter = this.filterText.trim().toLowerCase() - } + deleteItem(item: FileImport) { + return this.adminService.deleteBasketFileApiAdminBasketDeleteBasketFileIdGet({ + basket: this.basket.name, + fileId: item.id + }).subscribe( + id => { + let dsi = this.dataSource.data.findIndex(fi => fi['id'] == id) + this.dataSource.data.splice(dsi, 1) + // Force Angular change detection (??) + this.dataSource.data = this.dataSource.data + this.cdr.markForCheck() + } + ) + } - download(item: FileImport) { - window.open('/api/admin/basket/download/' + this.basket.name + '/' + item.id + '/' + item.name) - } - - importItem(item: FileImport, dryRun: boolean) { - return this.adminService.importBasketFileApiAdminBasketImportBasketFileIdGet({ - basket: this.basket.name, - fileId: item.id, - dryRun: dryRun - }).subscribe( - resp => { - this.basket.files.find(row => row.id == item.id).time = new Date(resp.time).toLocaleString() - this.snackBar.openFromComponent(HtmlSnackbarComponent, { - data: resp, - //duration: 3000 - }) - this.cdr.markForCheck() - } - ) - } - - deleteItem(item: FileImport) { - return this.adminService.deleteBasketFileApiAdminBasketDeleteBasketFileIdGet({ - basket: this.basket.name, - fileId: item.id - }).subscribe( - id => { - let dsi = this.dataSource.data.findIndex(fi => fi['id'] == id) - this.dataSource.data.splice(dsi, 1) - // Force Angular change detection (??) - this.dataSource.data = this.dataSource.data - this.cdr.markForCheck() - } - ) - } - - isDate(val: any) { - return val instanceof Date && isFinite(val) - } -} \ No newline at end of file + isDate(val: any) { + return val instanceof Date && isFinite(val) + } +} diff --git a/src/app/admin/admin-list/admin-list.component.ts b/src/app/admin/admin-list/admin-list.component.ts index 7ed9796..c660f77 100644 --- a/src/app/admin/admin-list/admin-list.component.ts +++ b/src/app/admin/admin-list/admin-list.component.ts @@ -1,5 +1,7 @@ -import { Component, Input, ViewChild, OnInit, HostBinding, - ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core' +import { + Component, Input, ViewChild, OnInit, HostBinding, + ChangeDetectorRef, ChangeDetectionStrategy +} from '@angular/core' import { ActivatedRoute, ParamMap, Router } from '@angular/router' import { SelectionModel } from '@angular/cdk/collections' @@ -16,106 +18,106 @@ import { ModelDataService, ModelIntrospection, FieldIntrospection } from '../../ //import { TableDataSource } from './datasource' @Component({ - selector: 'gisaf-admin-list', - templateUrl: './admin-list.component.html', - styleUrls: ['./admin-list.component.css'], - changeDetection: ChangeDetectionStrategy.OnPush, - animations: [ slideInDownAnimation ] + selector: 'gisaf-admin-list', + templateUrl: './admin-list.component.html', + styleUrls: ['./admin-list.component.css'], + changeDetection: ChangeDetectionStrategy.OnPush, + animations: [slideInDownAnimation] }) export class AdminListComponent implements OnInit { - /* - @HostBinding('@slideInDownAnimation') slideInDownAnimation = true - @HostBinding('style.display') display = 'block' - @HostBinding('style.position') position = 'absolute' - */ + /* + @HostBinding('@slideInDownAnimation') slideInDownAnimation = true + @HostBinding('style.display') display = 'block' + @HostBinding('style.position') position = 'absolute' + */ - dataSource: MatTableDataSource - @ViewChild(MatPaginator, {static: true}) paginator: MatPaginator - @ViewChild(MatSort, {static: true}) sort: MatSort - model: ModelIntrospection - allColumns: string[] = [] - pageIndex: number - pageSize: number - selection = new SelectionModel(true, []) + dataSource: MatTableDataSource + @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator + @ViewChild(MatSort, { static: true }) sort: MatSort + model: ModelIntrospection + allColumns: string[] = [] + pageIndex: number + pageSize: number + selection = new SelectionModel(true, []) - constructor( - protected route: ActivatedRoute, - protected router: Router, - protected dataService: ModelDataService, - public snackBar: MatSnackBar, - private cdr: ChangeDetectorRef, - ) {} + constructor( + protected route: ActivatedRoute, + protected router: Router, + protected dataService: ModelDataService, + public snackBar: MatSnackBar, + private cdr: ChangeDetectorRef, + ) { } - ngOnInit() { - this.route.params.subscribe(params => { - this.setModel(params['modelName']) - }) + ngOnInit() { + this.route.params.subscribe(params => { + this.setModel(params['modelName']) + }) + } + + setModel(modelName) { + if (!modelName) { + return } + this.dataService.introspect(modelName).subscribe( + res => { + this.model = res + this.allColumns = ['select', 'actions'].concat(this.model.columns()) + this.getData() + }, + ) + } - setModel(modelName) { - if (!modelName) { - return + getData() { + this.dataService.all(this.model).pipe(map(data => { + return data[this.model.name] + })).subscribe({ + next: data => { + if (data) { + this.dataSource = new MatTableDataSource(data) + this.dataSource.paginator = this.paginator + this.dataSource.sort = this.sort } - this.dataService.introspect(modelName).subscribe( - res => { - this.model = res - this.allColumns = ['select', 'actions'].concat(this.model.columns()) - this.getData() - }, - ) - } - - getData() { - this.dataService.all(this.model).pipe(map(data => { - return data[this.model.name] - })).subscribe({ - next: data => { - if (data) { - this.dataSource = new MatTableDataSource(data) - this.dataSource.paginator = this.paginator - this.dataSource.sort = this.sort - } - else { - this.dataSource = new MatTableDataSource([]) - } - this.cdr.markForCheck() - }, - error: err => { - this.snackBar.open(err, 'close', {duration: 3000}) - } - }) - } - - /** Whether the number of selected elements matches the total number of rows. */ - isAllSelected() { - const numSelected = this.selection.selected.length - const numRows = this.dataSource.data.length - return numSelected === numRows - } - - /** Selects all rows if they are not all selected; otherwise clear selection. */ - masterToggle() { - this.isAllSelected() ? - this.selection.clear() : - this.dataSource.data.forEach(row => this.selection.select(row)) - } - - applyFilter(target: EventTarget) { - let filterValue = target['value'] - this.dataSource.filter = filterValue.trim().toLowerCase() - - if (this.dataSource.paginator) { - this.dataSource.paginator.firstPage() + else { + this.dataSource = new MatTableDataSource([]) } - } + this.cdr.markForCheck() + }, + error: err => { + this.snackBar.open(err, 'close', { duration: 3000 }) + } + }) + } - showDetail(item) { - this.router.navigate(['/admin/model', this.model.name, item[this.model.pkFields()[0].name]]) - } + /** Whether the number of selected elements matches the total number of rows. */ + isAllSelected() { + const numSelected = this.selection.selected.length + const numRows = this.dataSource.data.length + return numSelected === numRows + } - add() { - } + /** Selects all rows if they are not all selected; otherwise clear selection. */ + masterToggle() { + this.isAllSelected() ? + this.selection.clear() : + this.dataSource.data.forEach(row => this.selection.select(row)) + } - deleteSelected() { + applyFilter(target: EventTarget) { + let filterValue = target['value'] + this.dataSource.filter = filterValue.trim().toLowerCase() + + if (this.dataSource.paginator) { + this.dataSource.paginator.firstPage() } + } + + showDetail(item) { + this.router.navigate(['/admin/model', this.model.name, item[this.model.pkFields()[0].name]]) + } + + add() { + } + + deleteSelected() { + } }