diff --git a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.html b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.html
index fcf91ef4..dd24590d 100644
--- a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.html
+++ b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.html
@@ -1,4 +1,4 @@
-
+
Images
diff --git a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.less b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.less
index 7482ea45..42fb5e5a 100644
--- a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.less
+++ b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.less
@@ -24,10 +24,19 @@
.resize-mobile {
max-width:100%;
}
+
+ .mobilePlateContainer {
+ flex-direction: column;
+ }
}
+
@media only screen and (min-width: 1027px) {
.resize-mobile {
max-height: 300px;
max-width: 500px;
}
+
+ .mobilePlateContainer {
+ flex-direction: row;
+ }
}
\ No newline at end of file
diff --git a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.ts b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.ts
index bd1e8997..8ed17602 100644
--- a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.ts
+++ b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plate/plate.component.ts
@@ -1,5 +1,5 @@
import { DatePipe } from '@angular/common';
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnDestroy, OnInit } from '@angular/core';
import { SnackbarService } from 'app/snackbar/snackbar.service';
import { SnackBarType } from 'app/snackbar/snackbartype';
import { Lightbox } from 'ngx-lightbox';
@@ -7,13 +7,14 @@ import { Url } from 'url';
import { PlateService } from '../plate.service';
import { Plate } from './plate';
import { PlateStatisticsData } from './plateStatistics';
+import { Subscription } from 'rxjs';
@Component({
selector: 'app-plate',
templateUrl: './plate.component.html',
styleUrls: ['./plate.component.less']
})
-export class PlateComponent implements OnInit {
+export class PlateComponent implements OnInit, OnDestroy {
@Input() plate: Plate;
public loadingImage: boolean;
@@ -27,6 +28,8 @@ export class PlateComponent implements OnInit {
public plateStatistics: PlateStatisticsData[] = [];
public displayedColumns: string[] = ['key', 'value'];
+ private statisticsSubscription = new Subscription();
+
constructor(
private lightbox: Lightbox,
private plateService: PlateService,
@@ -40,9 +43,13 @@ export class PlateComponent implements OnInit {
this.getPlateStatistics();
}
+ ngOnDestroy(): void {
+ this.statisticsSubscription.unsubscribe();
+ }
+
private getPlateStatistics() {
this.loadingStatistics = true;
- this.plateService.getPlateStatistics(this.plate.plateNumber).subscribe(result => {
+ this.statisticsSubscription = this.plateService.getPlateStatistics(this.plate.plateNumber).subscribe(result => {
this.loadingStatistics = false;
this.plateStatistics.push({
key: "Confidence",
diff --git a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.html b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.html
index 2fd21e7b..0587b2dd 100644
--- a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.html
+++ b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.html
@@ -23,7 +23,7 @@
-
+
@@ -57,7 +57,7 @@
-
+
Filters
@@ -70,7 +70,7 @@
-
+
Plate Number
Invalid regex pattern
Invalid search term
-
-
- -
- Include Ignored Plates
-
- -
- Regex Search
-
- -
- Lenient Matches
-
- -
- Plates Seen Less Than 10 Times
-
-
-
+
+ -
+ Include Ignored Plates
+
+ -
+ Regex Search
+
+ -
+ Lenient Matches
+
+ -
+ Plates Seen Less Than 10 Times
+
+
+ [disabled]="!this.filterPlateNumberIsValid">Apply
+ (click)="clearFilters()">Clear
diff --git a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.less b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.less
index 057dd8a0..f5c1ac88 100644
--- a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.less
+++ b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.less
@@ -26,6 +26,11 @@
animation: none;
}
+ul {
+ list-style-type: none;
+ padding-left: 0px;
+}
+
@-webkit-keyframes pulse {
0% {
-webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
diff --git a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.ts b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.ts
index 9cccbcf5..78862376 100644
--- a/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.ts
+++ b/OpenAlprWebhookProcessor/angularapp/src/app/plates/plates.component.ts
@@ -96,7 +96,8 @@ export class PlatesComponent implements OnInit, OnDestroy, AfterViewInit {
private eventSubscriptions = new Subscription();
private searchSubscription = new Subscription();
-
+ private filterSubscription = new Subscription();
+
@ViewChild(MatPaginator) paginator: MatPaginator;
constructor(
@@ -125,6 +126,7 @@ export class PlatesComponent implements OnInit, OnDestroy, AfterViewInit {
ngOnDestroy(): void {
this.eventSubscriptions.unsubscribe();
this.searchSubscription.unsubscribe();
+ this.filterSubscription.unsubscribe();
}
ngAfterViewInit(): void {
@@ -166,7 +168,7 @@ export class PlatesComponent implements OnInit, OnDestroy, AfterViewInit {
}
public populateFilters() {
- this.plateService.getFilters().subscribe(result => {
+ this.filterSubscription = this.plateService.getFilters().subscribe(result => {
this.vehicleFilters = result;
});
}
diff --git a/OpenAlprWebhookProcessor/angularapp/src/app/snackbar/snackbar.component.html b/OpenAlprWebhookProcessor/angularapp/src/app/snackbar/snackbar.component.html
index 3bb93e6d..167d278b 100644
--- a/OpenAlprWebhookProcessor/angularapp/src/app/snackbar/snackbar.component.html
+++ b/OpenAlprWebhookProcessor/angularapp/src/app/snackbar/snackbar.component.html
@@ -1,8 +1,8 @@
-
-
- {{getIcon}}
-
-
- {{data.message}}
-
-
\ No newline at end of file
+
+
+ {{getIcon}}
+
+
+ {{data.message}}
+
+
\ No newline at end of file