wip

client/admin/angular.json

@@ -83,5 +83,8 @@
         }
       }
     }
+  },
+  "cli": {
+    "analytics": false
   }
 }

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 },

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));
   }
 }

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>

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() {

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}`)
+  }
 }