philorg/gisaf-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Admin basket: fix import error message and import date display update

Browse source
This commit is contained in:
phil 2024-05-15 15:05:17 +02:00
parent 3b59249531
commit aa955a1b3b
2 changed files with 194 additions and 183 deletions
Download patch file Download diff file Expand all files Collapse all files

193
src/app/admin/admin-basket/basket.component.ts
View file

@ -1,5 +1,7 @@
import { Component, OnInit, Input, ViewChild, ElementRef, import {
ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core' Component, OnInit, Input, ViewChild, ElementRef,
ChangeDetectorRef, ChangeDetectionStrategy
} from '@angular/core'
import { ActivatedRoute } from '@angular/router' import { ActivatedRoute } from '@angular/router'
import { UntypedFormGroup, UntypedFormControl } from '@angular/forms' import { UntypedFormGroup, UntypedFormControl } from '@angular/forms'
@ -14,101 +16,108 @@ import { AdminBasket, AdminService, FileImport } from '../../openapi'
import { HtmlSnackbarComponent } from '../../custom-snackbar/custom-snackbar.component' import { HtmlSnackbarComponent } from '../../custom-snackbar/custom-snackbar.component'
@Component({ @Component({
selector: 'gisaf-admin-basket', selector: 'gisaf-admin-basket',
templateUrl: './basket.component.html', templateUrl: './basket.component.html',
styleUrls: ['./basket.component.css'], styleUrls: ['./basket.component.css'],
changeDetection: ChangeDetectionStrategy.OnPush, changeDetection: ChangeDetectionStrategy.OnPush,
}) })
export class AdminBasketComponent implements OnInit { export class AdminBasketComponent implements OnInit {
constructor( constructor(
public adminDataService: AdminDataService, public adminDataService: AdminDataService,
private route: ActivatedRoute, private route: ActivatedRoute,
private snackBar: MatSnackBar, private snackBar: MatSnackBar,
private cdr: ChangeDetectorRef, private cdr: ChangeDetectorRef,
public adminService: AdminService, public adminService: AdminService,
) {} ) { }
basket: AdminBasket basket: AdminBasket
dataSource: MatTableDataSource<object> dataSource: MatTableDataSource<object>
@ViewChild(MatPaginator, {static: true}) paginator: MatPaginator @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator
@ViewChild(MatSort, {static: true}) sort: MatSort @ViewChild(MatSort, { static: true }) sort: MatSort
selection = new SelectionModel(true, []) selection = new SelectionModel(true, [])
unlockDeleteFormGroup: UntypedFormGroup = new UntypedFormGroup({}) unlockDeleteFormGroup: UntypedFormGroup = new UntypedFormGroup({})
columns: string[] = [ columns: string[] = [
'name', 'name',
'status', 'status',
'time', 'time',
'store', 'store',
'project', 'project',
'surveyor', 'surveyor',
'equipment', 'equipment',
'import', 'import',
'delete', 'delete',
] ]
filterText: string filterText: string
ngOnInit() { ngOnInit() {
this.route.data.subscribe( this.route.data.subscribe(
(basket: object) => { (basket: object) => {
this.basket = basket['basket'] this.basket = basket['basket']
this.dataSource = new MatTableDataSource(this.basket.files) this.dataSource = new MatTableDataSource(this.basket.files)
this.dataSource.sort = this.sort this.dataSource.sort = this.sort
this.dataSource.paginator = this.paginator this.dataSource.paginator = this.paginator
this.cdr.markForCheck() this.cdr.markForCheck()
} }
) )
this.unlockDeleteFormGroup = new UntypedFormGroup({ this.unlockDeleteFormGroup = new UntypedFormGroup({
'canDelete': new UntypedFormControl(), '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
}) })
} this.cdr.markForCheck()
},
getColumns() { error: err => {
return this.columns.filter( this.snackBar.open(
col => this.basket.columns.indexOf(col) != -1 `Cannot import: ${err.body['detail'] || err.message || err.statusText}`,
'Got it',
{ 'politeness': 'assertive' }
) )
} }
})
}
applyFilter() { deleteItem(item: FileImport) {
this.dataSource.filter = this.filterText.trim().toLowerCase() 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) { isDate(val: any) {
window.open('/api/admin/basket/download/' + this.basket.name + '/' + item.id + '/' + item.name) return val instanceof Date && isFinite(<any>val)
} }
}
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(<any>val)
}
}

184
src/app/admin/admin-list/admin-list.component.ts
View file

@ -1,5 +1,7 @@
import { Component, Input, ViewChild, OnInit, HostBinding, import {
ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core' Component, Input, ViewChild, OnInit, HostBinding,
ChangeDetectorRef, ChangeDetectionStrategy
} from '@angular/core'
import { ActivatedRoute, ParamMap, Router } from '@angular/router' import { ActivatedRoute, ParamMap, Router } from '@angular/router'
import { SelectionModel } from '@angular/cdk/collections' import { SelectionModel } from '@angular/cdk/collections'
@ -16,106 +18,106 @@ import { ModelDataService, ModelIntrospection, FieldIntrospection } from '../../
//import { TableDataSource } from './datasource' //import { TableDataSource } from './datasource'
@Component({ @Component({
selector: 'gisaf-admin-list', selector: 'gisaf-admin-list',
templateUrl: './admin-list.component.html', templateUrl: './admin-list.component.html',
styleUrls: ['./admin-list.component.css'], styleUrls: ['./admin-list.component.css'],
changeDetection: ChangeDetectionStrategy.OnPush, changeDetection: ChangeDetectionStrategy.OnPush,
animations: [ slideInDownAnimation ] animations: [slideInDownAnimation]
}) })
export class AdminListComponent implements OnInit { export class AdminListComponent implements OnInit {
/* /*
@HostBinding('@slideInDownAnimation') slideInDownAnimation = true @HostBinding('@slideInDownAnimation') slideInDownAnimation = true
@HostBinding('style.display') display = 'block' @HostBinding('style.display') display = 'block'
@HostBinding('style.position') position = 'absolute' @HostBinding('style.position') position = 'absolute'
*/ */
dataSource: MatTableDataSource<object> dataSource: MatTableDataSource<object>
@ViewChild(MatPaginator, {static: true}) paginator: MatPaginator @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator
@ViewChild(MatSort, {static: true}) sort: MatSort @ViewChild(MatSort, { static: true }) sort: MatSort
model: ModelIntrospection model: ModelIntrospection
allColumns: string[] = [] allColumns: string[] = []
pageIndex: number pageIndex: number
pageSize: number pageSize: number
selection = new SelectionModel(true, []) selection = new SelectionModel(true, [])
constructor( constructor(
protected route: ActivatedRoute, protected route: ActivatedRoute,
protected router: Router, protected router: Router,
protected dataService: ModelDataService, protected dataService: ModelDataService,
public snackBar: MatSnackBar, public snackBar: MatSnackBar,
private cdr: ChangeDetectorRef, private cdr: ChangeDetectorRef,
) {} ) { }
ngOnInit() { ngOnInit() {
this.route.params.subscribe(params => { this.route.params.subscribe(params => {
this.setModel(params['modelName']) 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) { getData() {
if (!modelName) { this.dataService.all(this.model).pipe(map(data => {
return 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( else {
res => { this.dataSource = new MatTableDataSource([])
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()
} }
} this.cdr.markForCheck()
},
error: err => {
this.snackBar.open(err, 'close', { duration: 3000 })
}
})
}
showDetail(item) { /** Whether the number of selected elements matches the total number of rows. */
this.router.navigate(['/admin/model', this.model.name, item[this.model.pkFields()[0].name]]) 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() {
}
} }