From: Srinivasan Date: Fri, 26 Mar 2021 12:44:37 +0000 (+0530) Subject: ROBO UI changes X-Git-Url: https://gerrit.akraino.org/r/gitweb?a=commitdiff_plain;h=5f7e757b5f667f7d9e4f3fbccaabae91ffd0feec;p=ealt-edge.git ROBO UI changes Signed-off-by: Srinivasan Change-Id: I6c4c43a9ca898368dd571a912a4256e3a86da0a4 --- diff --git a/example-apps/ROBO/RoboUI/package-lock.json b/example-apps/ROBO/RoboUI/package-lock.json index 0a18af4..2fee7e1 100644 --- a/example-apps/ROBO/RoboUI/package-lock.json +++ b/example-apps/ROBO/RoboUI/package-lock.json @@ -14406,8 +14406,7 @@ "zone.js": { "version": "0.10.3", "resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.10.3.tgz", - "integrity": "sha512-LXVLVEq0NNOqK/fLJo3d0kfzd4sxwn2/h67/02pjCjfKDxgx1i9QqpvtHD8CrBnSSwMw5+dy11O7FRX5mkO7Cg==", - "dev": true + "integrity": "sha512-LXVLVEq0NNOqK/fLJo3d0kfzd4sxwn2/h67/02pjCjfKDxgx1i9QqpvtHD8CrBnSSwMw5+dy11O7FRX5mkO7Cg==" } } } diff --git a/example-apps/ROBO/RoboUI/src/app/app.component.html b/example-apps/ROBO/RoboUI/src/app/app.component.html index 5ee3604..66c780b 100644 --- a/example-apps/ROBO/RoboUI/src/app/app.component.html +++ b/example-apps/ROBO/RoboUI/src/app/app.component.html @@ -6,8 +6,8 @@

ROBO Usecase

- Inventory Data Upload - Inventory Management + Shelf Data Upload + Shelf Management Backup and Restore
@@ -22,8 +22,8 @@ - Inventory Data Upload - Inventory Management + Shelf Data Upload + Shelf Management Backup and Restore diff --git a/example-apps/ROBO/RoboUI/src/app/backuprestore/backuprestore.component.html b/example-apps/ROBO/RoboUI/src/app/backuprestore/backuprestore.component.html index aa91015..0ffb5a0 100644 --- a/example-apps/ROBO/RoboUI/src/app/backuprestore/backuprestore.component.html +++ b/example-apps/ROBO/RoboUI/src/app/backuprestore/backuprestore.component.html @@ -20,11 +20,26 @@ NAME {{apps.name}} + STATUS {{apps.status}} + + + IP @@ -36,6 +51,16 @@ {{apps.node}} + + + + @@ -72,12 +97,26 @@ {{pvs.volume}} + + + STORAGE CLASS {{pvs.storageclass}} + + VOLUMEMODE {{pvs.volumemode}} @@ -96,7 +135,7 @@
- +
diff --git a/example-apps/ROBO/RoboUI/src/app/data-fetch/data-fetch.component.ts b/example-apps/ROBO/RoboUI/src/app/data-fetch/data-fetch.component.ts index 5841a0c..58260f7 100644 --- a/example-apps/ROBO/RoboUI/src/app/data-fetch/data-fetch.component.ts +++ b/example-apps/ROBO/RoboUI/src/app/data-fetch/data-fetch.component.ts @@ -160,6 +160,7 @@ export class DataFetchComponent implements OnInit { } onCameraIDSelection() { + console.log("Spotted...") var index: number console.log("Inside onCameraIDSelection.......") debugger; @@ -172,7 +173,7 @@ export class DataFetchComponent implements OnInit { console.log(data) }, error => console.log(error)); - + index = null; } diff --git a/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.html b/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.html index a983446..36cda5e 100644 --- a/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.html +++ b/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.html @@ -3,7 +3,7 @@
-

INVENTORY STATUS

+

SHELF STATUS

@@ -12,30 +12,36 @@ Shelf Name - {{monitor.shelfName}} + {{monitor.shelfName}} Object Type - {{monitor.ObjType}} + {{monitor.ObjType}} Current Count - {{monitor.currentCount}} + {{monitor.currentCount}} - - Total Count - {{monitor.totalCount}} + + Max Count + {{monitor.maxCount}} + + + + Status + {{monitor.status}} + Time - {{monitor.time}} + {{monitor.time}} - + diff --git a/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.scss b/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.scss index 5b4b5e1..62edbf7 100644 --- a/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.scss +++ b/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.scss @@ -28,4 +28,12 @@ .image-card { padding: 20px; } -} \ No newline at end of file +} + +// .warn{ +// color:orange; +// } + +// .success{ +// color:green; +// } \ No newline at end of file diff --git a/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.ts b/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.ts index 64bc2b6..e17ce7d 100644 --- a/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.ts +++ b/example-apps/ROBO/RoboUI/src/app/data-monitor/data-monitor.component.ts @@ -9,6 +9,8 @@ import { RoboService } from './../../app/robo.service'; import { DomSanitizer, SafeUrl } from "@angular/platform-browser"; +import { timer } from "rxjs" + @Component({ selector: 'app-data-monitor', templateUrl: './data-monitor.component.html', @@ -16,7 +18,7 @@ import { DomSanitizer, SafeUrl } from "@angular/platform-browser"; }) export class DataMonitorComponent implements OnInit { - monitorColumns: string [] = ['shelfName','objType','currentCount','totalCount','time']; + monitorColumns: string [] = ['shelfName','objType','currentCount','maxCount','status','time']; monitorDataSource = new MatTableDataSource(MONITOR_INFO_LIST); monitorArrayList = []; @@ -24,6 +26,7 @@ export class DataMonitorComponent implements OnInit { imageBlobUrl : any; image: any; thumbnail: any; + myvar: any monitorInfo = {} as monitorDetails; @@ -39,22 +42,45 @@ export class DataMonitorComponent implements OnInit { this.inventoryDetails(); } + timerFunc() { + debugger; + setInterval(this.refreshPage, 2000); + // setTimeout(this.refreshPage , 2000); + } + refreshPage() { + console.log("Inside refreshPage....") this.inventoryDetails(); this.monitorDetails(); } monitorDetails() { debugger; + // setInterval(function(){ + // console.log("Oooo Yeaaa!"); + // this.roboService.getMonitorImage() + // .subscribe( (data:any) => { + + // debugger; + // console.log(data); + // // referred https://stackoverflow.com/questions/55591871/view-blob-response-as-image-in-angular + + // let objectURL = 'data:image/jpeg;base64,' + data.image; + // this.thumbnail = this.sanitizer.bypassSecurityTrustUrl(objectURL); + + // }, + // error => console.log(error)); + + + // }, 2000); this.roboService.getMonitorImage() .subscribe( (data:any) => { debugger; - console.log(data); - // referred https://stackoverflow.com/questions/55591871/view-blob-response-as-image-in-angular let objectURL = 'data:image/jpeg;base64,' + data.image; this.thumbnail = this.sanitizer.bypassSecurityTrustUrl(objectURL); + debugger; }, error => console.log(error)); @@ -62,6 +88,21 @@ export class DataMonitorComponent implements OnInit { } inventoryDetails() { + console.log("inventoryDetails started....") + + // setInterval(function(){ + // console.log("Oooo!"); + // this.roboService.getMonitorInfo() + // .subscribe(data => { + // console.log(data); + // this.monitorInfo = data; + + // this.monitorArrayList = data.InventryData; + // this.monitorDataSource = new MatTableDataSource(this.monitorArrayList); + // this.monitorDataSource.paginator = this.paginator; + // }, + // error => console.log(error)); + // }, 2000); this.roboService.getMonitorInfo() .subscribe(data => { console.log(data); @@ -72,10 +113,23 @@ export class DataMonitorComponent implements OnInit { this.monitorDataSource.paginator = this.paginator; }, error => console.log(error)); + console.log("inventoryDetails finished...") + } + + getColor(clr) { + if(clr == "Mostly Filled"){ + return "green" + } + if(clr == "Partially Filled"){ + return "orange" + } + if(clr == "Needs Filling"){ + return "red" + } } } const MONITOR_INFO_LIST: monitorinfo[] = [ - { shelfName: '', ObjType: '', currentCount: '', totalCount: '', time: '' } + { shelfName: '', ObjType: '', currentCount: '', maxCount: '', status: '', time: '' } ]; diff --git a/example-apps/ROBO/RoboUI/src/app/datainterface.ts b/example-apps/ROBO/RoboUI/src/app/datainterface.ts index dad1e26..e244712 100644 --- a/example-apps/ROBO/RoboUI/src/app/datainterface.ts +++ b/example-apps/ROBO/RoboUI/src/app/datainterface.ts @@ -27,9 +27,10 @@ export interface monitorImage { export interface monitorinfo { shelfName: string; - ObjType: string; + ObjType: string; currentCount: string; - totalCount: string; + maxCount: string; + status: string; time: string; } diff --git a/example-apps/ROBO/RoboUI/src/app/robo.service.ts b/example-apps/ROBO/RoboUI/src/app/robo.service.ts index b74e7b7..6546fe7 100644 --- a/example-apps/ROBO/RoboUI/src/app/robo.service.ts +++ b/example-apps/ROBO/RoboUI/src/app/robo.service.ts @@ -3,6 +3,7 @@ import { Injectable } from '@angular/core'; import { HttpClient, HttpHeaders, HttpParams, HttpResponse } from '@angular/common/http'; import { Observable,throwError } from 'rxjs' import { timer, Subscription, pipe } from 'rxjs'; +import { switchMap } from 'rxjs/operators'; import { cameraData, camerainfo, cameraDetails, monitorDetails, monitorinfo, cameraID, appsPvcs, backupRestore, monitorImage } from './datainterface' @@ -20,7 +21,7 @@ export class RoboService { private cameraDetailsUrl = this.inventoryBaseUrl + '/v1/monitor/cameras' private cameraDetails_url = './../assets/data/sample.json' - private monitorDetails_url = './../assets/data/sample.json' + private monitorDetails_url = './../assets/data/inventory.json' private monitorDetailsUrl = this.inventoryBaseUrl + '/v1/inventry/table' private monitorImageUrl = this.inventoryBaseUrl + '/v1/inventry/image' @@ -32,7 +33,7 @@ export class RoboService { private backupRestoreDetailsUrl = this.baseUrl + '/v1/robo/backup-restore' - //private backupRestoreDetails_url = './../assets/data/backuprestore.json' + private backupRestoreDetails_url = './../assets/data/backuprestore.json' private postBackupDetailsUrl = this.baseUrl + '/v1/robo/backup' @@ -70,8 +71,15 @@ export class RoboService { return this.http.get(this.monitorDetailsUrl); } + + getMonitorImage(): Observable { debugger; + // return timer(0, 2000) + // .pipe( + + // switchMap(_ => this.http.get(this.monitorImageUrl)), + // ); return this.http.get(this.monitorImageUrl); } @@ -79,7 +87,9 @@ export class RoboService { triggerDetection(data): Observable { console.log(data); debugger; + this.triggerObjUrl = this.inventoryBaseUrl + '/v1/monitor/cameras/'; this.triggerObjUrl = this.triggerObjUrl + data; + debugger; console.log(this.triggerObjUrl); return this.http.get(this.triggerObjUrl) @@ -89,6 +99,10 @@ export class RoboService { return this.http.get(this.appsPvcsDetailsUrl); } + // getBackupRestoreInfo(): Observable { + // } + // return this.http.get(this.backupRestoreDetails_url); + getBackupRestoreInfo(): Observable { return this.http.get(this.backupRestoreDetailsUrl); } diff --git a/example-apps/ROBO/RoboUI/src/assets/data/inventory.json b/example-apps/ROBO/RoboUI/src/assets/data/inventory.json index 2300278..6806487 100644 --- a/example-apps/ROBO/RoboUI/src/assets/data/inventory.json +++ b/example-apps/ROBO/RoboUI/src/assets/data/inventory.json @@ -3,15 +3,20 @@ { "shelfName": "Shelf1", "ObjType": "Bottles", - "currentCount": "1", - "totalCount": "3", + "status": "Mostly Filled", "time": "Tue Feb 26 12:11:59 2020" }, { "shelfName": "Shelf2", "ObjType": "Bottles", - "currentCount": "3", - "totalCount": "3", + "time": "Tue Feb 26 12:15:00 2020", + "status": "Needs Filling" + + }, + { + "shelfName": "Shelf2", + "ObjType": "Bottles", + "status": "Partially Filled", "time": "Tue Feb 26 12:15:00 2020" } ] diff --git a/example-apps/ROBO/RoboUI/src/assets/images/common-appgridvue.png b/example-apps/ROBO/RoboUI/src/assets/images/common-appgridvue.png new file mode 100644 index 0000000..e23b89e Binary files /dev/null and b/example-apps/ROBO/RoboUI/src/assets/images/common-appgridvue.png differ diff --git a/example-apps/ROBO/RoboUI/src/assets/images/sample.jpg b/example-apps/ROBO/RoboUI/src/assets/images/sample.jpg new file mode 100644 index 0000000..0571429 Binary files /dev/null and b/example-apps/ROBO/RoboUI/src/assets/images/sample.jpg differ