From 7c8bbaed42aec5da71c257ba679306055697b34d Mon Sep 17 00:00:00 2001
From: Daniel Ponte <amigan@gmail.com>
Date: Fri, 8 Nov 2024 21:35:20 -0500
Subject: [PATCH] wip

---
 client/admin/angular.json                     |  3 +++
 client/admin/src/app/app.routes.ts            |  2 ++
 .../talkgroup-record.component.ts             | 23 +++++++++++++++----
 .../app/talkgroups/talkgroups.component.html  |  2 +-
 .../app/talkgroups/talkgroups.component.ts    | 17 ++++++++++++--
 .../src/app/talkgroups/talkgroups.service.ts  |  4 ++++
 6 files changed, 44 insertions(+), 7 deletions(-)

diff --git a/client/admin/angular.json b/client/admin/angular.json
index 6b18863..6943477 100644
--- a/client/admin/angular.json
+++ b/client/admin/angular.json
@@ -83,5 +83,8 @@
         }
       }
     }
+  },
+  "cli": {
+    "analytics": false
   }
 }
diff --git a/client/admin/src/app/app.routes.ts b/client/admin/src/app/app.routes.ts
index 0aa8a2a..894a2a8 100644
--- a/client/admin/src/app/app.routes.ts
+++ b/client/admin/src/app/app.routes.ts
@@ -3,6 +3,7 @@ import { Routes } from '@angular/router';
 import { HomeComponent } from './home/home.component';
 import { LoginComponent } from './login/login.component';
 import { TalkgroupsComponent } from './talkgroups/talkgroups.component';
+import { TalkgroupRecordComponent } from './talkgroups/talkgroup-record/talkgroup-record.component';
 import { CallsComponent } from './calls/calls.component';
 import { IncidentsComponent } from './incidents/incidents.component';
 import { AlertsComponent } from './alerts/alerts.component';
@@ -13,6 +14,7 @@ export const routes: Routes = [
   { path: 'home', component: HomeComponent, canActivate: [AuthGuard] },
   { path: 'login', component: LoginComponent },
   { path: 'talkgroups', component: TalkgroupsComponent },
+  { path: 'talkgroups/:sys/:tg', component: TalkgroupRecordComponent },
   { path: 'calls', component: CallsComponent },
   { path: 'incidents', component: IncidentsComponent },
   { path: 'alerts', component: AlertsComponent },
diff --git a/client/admin/src/app/talkgroups/talkgroup-record/talkgroup-record.component.ts b/client/admin/src/app/talkgroups/talkgroup-record/talkgroup-record.component.ts
index 994ab3e..fb9a88e 100644
--- a/client/admin/src/app/talkgroups/talkgroup-record/talkgroup-record.component.ts
+++ b/client/admin/src/app/talkgroups/talkgroup-record/talkgroup-record.component.ts
@@ -1,5 +1,9 @@
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { Talkgroup } from '../../talkgroup';
+import { TalkgroupService } from '../talkgroups.service';
+
+import { Router, ActivatedRoute, ParamMap } from '@angular/router';
+import { Observable } from 'rxjs';
 
 @Component({
   selector: 'talkgroup-record',
@@ -9,8 +13,19 @@ import { Talkgroup } from '../../talkgroup';
   styleUrl: './talkgroup-record.component.css',
 })
 export class TalkgroupRecordComponent {
-  tg: Talkgroup;
-  constructor(tg: Talkgroup) {
-    this.tg = tg;
+  tg$: Observable<Talkgroup>;
+  tgService: TalkgroupService = inject(TalkgroupService);
+  constructor(private route: ActivatedRoute, private router: Router) {
+    const sysId = this.route.snapshot.paramMap.get('sys');
+    const tgId = this.route.snapshot.paramMap.get('tg');
+
+    this.tg$ = this.tgService.getTalkgroup(Number(sysId), Number(tgId));
+  }
+
+  ngOnInit() {
+    const sysId = this.route.snapshot.paramMap.get('sys');
+    const tgId = this.route.snapshot.paramMap.get('tg');
+
+    this.tg$ = this.tgService.getTalkgroup(Number(sysId), Number(tgId));
   }
 }
diff --git a/client/admin/src/app/talkgroups/talkgroups.component.html b/client/admin/src/app/talkgroups/talkgroups.component.html
index 9b8d7ff..e9a8ac9 100644
--- a/client/admin/src/app/talkgroups/talkgroups.component.html
+++ b/client/admin/src/app/talkgroups/talkgroups.component.html
@@ -18,7 +18,7 @@
           <td>{{ tg.system.id }}</td>
           <td>{{ tg.name }}</td>
           <td>{{ tg.tgid }}</td>
-          <td><ng-icon name="ionCreateOutline"></ng-icon></td>
+          <td><a routerLink='/talkgroup/{{tg.system.id}}/{{tg.tgid}}'><ng-icon name="ionCreateOutline"></ng-icon></a></td>
         </tr>
       }
     </tbody>
diff --git a/client/admin/src/app/talkgroups/talkgroups.component.ts b/client/admin/src/app/talkgroups/talkgroups.component.ts
index 0422691..fc5d357 100644
--- a/client/admin/src/app/talkgroups/talkgroups.component.ts
+++ b/client/admin/src/app/talkgroups/talkgroups.component.ts
@@ -3,6 +3,9 @@ import { TalkgroupService } from './talkgroups.service';
 import { Talkgroup } from '../talkgroup';
 import { NgIconComponent, provideIcons } from '@ng-icons/core';
 import { ionCreateOutline } from '@ng-icons/ionicons';
+import { ActivatedRoute } from '@angular/router';
+import { Observable } from 'rxjs';
+import { switchMap } from 'rxjs/operators';
 
 @Component({
   selector: 'talkgroups',
@@ -13,11 +16,21 @@ import { ionCreateOutline } from '@ng-icons/ionicons';
   providers: [provideIcons({ ionCreateOutline })],
 })
 export class TalkgroupsComponent {
-  tgs: Talkgroup[] = [];
+  selectedSys: number = 0;
+  selectedId: number = 0;
+  talkgroups$: Observable<Talkgroup[]> = [];
   tgService: TalkgroupService = inject(TalkgroupService);
 
+  constructor(private route: ActivatedRoute) {}
+
   ngOnInit() {
-    this.getTalkgroups();
+    this.talkgroups$ = this.route.paramMap.pipe(
+      switchMap(params => {
+        this.selectedSys = Number(params.get('sys'));
+        this.selectedId = Number(params.get('tg'));
+        return this.tgService.getTalkgroups();
+      })
+    );
   }
 
   getTalkgroups() {
diff --git a/client/admin/src/app/talkgroups/talkgroups.service.ts b/client/admin/src/app/talkgroups/talkgroups.service.ts
index 237d4f0..0059043 100644
--- a/client/admin/src/app/talkgroups/talkgroups.service.ts
+++ b/client/admin/src/app/talkgroups/talkgroups.service.ts
@@ -13,4 +13,8 @@ export class TalkgroupService {
   getTalkgroups(): Observable<Talkgroup[]> {
     return this.http.get<Talkgroup[]>('/api/talkgroup/');
   }
+
+  getTalkgroup(sys: number, tg: number): Observable<Talkgroup> {
+    return this.http.get<Talkgroup>(`/api/talkgroup/${sys}/${tg}`)
+  }
 }