diff --git a/src/app/socket.interface.ts b/src/app/socket.interface.ts new file mode 100644 index 0000000..f6e95a9 --- /dev/null +++ b/src/app/socket.interface.ts @@ -0,0 +1,7 @@ +// src/app/socket.interface.ts +export interface TasmotaSocket { + id: string; // Ein eindeutiger Bezeichner für die Steckdose (z.B. '1', '2') + name: string; // Der Anzeigename der Steckdose (z.B. 'Aktiv Kohle Lüfter') + path: string; // Der Tasmota-Endpunkt, der für diese Steckdose verwendet wird (z.B. '/tasmota1') + status: boolean; // Der aktuelle Schaltzustand der Steckdose (true für 'Ein', false für 'Aus') +} diff --git a/src/app/tasmota-control/tasmota-control.component.html b/src/app/tasmota-control/tasmota-control.component.html index 52e6894..de82049 100644 --- a/src/app/tasmota-control/tasmota-control.component.html +++ b/src/app/tasmota-control/tasmota-control.component.html @@ -2,7 +2,19 @@

Tasmota Steckdosen Steuerung

-
+ +
+

{{ socket.name }}

+ + Status: {{ socket.status ? 'Ein' : 'Aus' }} +
+ + +
diff --git a/src/app/tasmota-control/tasmota-control.component.ts b/src/app/tasmota-control/tasmota-control.component.ts index 37f4802..522e618 100644 --- a/src/app/tasmota-control/tasmota-control.component.ts +++ b/src/app/tasmota-control/tasmota-control.component.ts @@ -1,6 +1,7 @@ // tasmota-control.component.ts import { Component, OnInit } from '@angular/core'; import { TasmotaService } from '../tasmota.service'; +import { TasmotaSocket } from '../socket.interface'; // NEU: Import des Interfaces @Component({ selector: 'app-tasmota-control', @@ -8,17 +9,30 @@ import { TasmotaService } from '../tasmota.service'; styleUrls: ['./tasmota-control.component.css'] }) export class TasmotaControlComponent implements OnInit { - socket1Status = false; - socket2Status = false; + // ALT: socket1Status = false; + // ALT: socket2Status = false; + + // NEU: Ein Array, das die Socket-Informationen und ihren Status hält + sockets: TasmotaSocket[] = []; constructor(private tasmotaService: TasmotaService) { } ngOnInit(): void { + // NEU: Initialisiere das `sockets`-Array aus dem Service beim Start der Komponente + this.sockets = this.tasmotaService.sockets; this.updateSocketStatuses(); } updateSocketStatuses(): void { - this.tasmotaService.getSocketStatus(this.tasmotaService.socket1Path) + // NEU: Iteriere über das Array, um den Status jeder Steckdose abzurufen + this.sockets.forEach(socket => { + this.tasmotaService.getSocketStatus(socket.path) + .subscribe({ + next: (status) => socket.status = status, + error: (error) => console.error(`Fehler beim Abrufen des Status von Steckdose ${socket.name}:`, error) + }); + }); + /* this.tasmotaService.getSocketStatus(this.tasmotaService.socket1Path) .subscribe({ next: (status) => this.socket1Status = status, error: (error) => console.error('Fehler beim Abrufen des Status von Steckdose 1:', error) @@ -28,10 +42,19 @@ export class TasmotaControlComponent implements OnInit { .subscribe({ next: (status) => this.socket2Status = status, error: (error) => console.error('Fehler beim Abrufen des Status von Steckdose 2:', error) + }); */ + } + + // NEU: Eine generische Methode zum Schalten einer beliebigen Steckdose + toggleSocket(socket: TasmotaSocket): void { + this.tasmotaService.toggleSocket(socket.path, socket.status) + .subscribe({ + next: (newStatus) => socket.status = newStatus, // Aktualisiert den Status im Array + error: (error) => console.error(`Fehler beim Schalten von Steckdose ${socket.name}:`, error) }); } - toggleSocket1(): void { + /* toggleSocket1(): void { this.tasmotaService.toggleSocket(this.tasmotaService.socket1Path, this.socket1Status) .subscribe({ next: (status) => this.socket1Status = status, @@ -45,6 +68,6 @@ export class TasmotaControlComponent implements OnInit { next: (status) => this.socket2Status = status, error: (error) => console.error('Fehler beim Schalten von Steckdose 2:', error) }); - } + } */ } diff --git a/src/app/tasmota.service.ts b/src/app/tasmota.service.ts index 1fedd34..0902fdd 100644 --- a/src/app/tasmota.service.ts +++ b/src/app/tasmota.service.ts @@ -4,6 +4,7 @@ import { HttpClient, HttpHeaders } from '@angular/common/http'; import { Observable } from 'rxjs'; import { map } from 'rxjs/operators'; import { environment } from '../environments/environment'; +import { TasmotaSocket } from './socket.interface'; // NEU: Import des Interfaces @Injectable({ providedIn: 'root' @@ -13,8 +14,18 @@ export class TasmotaService { ? '' : ''; - private SOCKET1_PATH = this.baseUrl + '/tasmota1'; - private SOCKET2_PATH = this.baseUrl + '/tasmota2'; + // private SOCKET1_PATH = this.baseUrl + '/tasmota1'; + // private SOCKET2_PATH = this.baseUrl + '/tasmota2'; + + // NEU: Ein öffentliches Array, das alle zu steuernden Steckdosen und ihre Konfiguration enthält + public sockets: TasmotaSocket[] = [ + // { id: '1', name: 'Aktiv Kohle Lüfter', path: this.baseUrl + '/tasmota1', status: false }, + // { id: '2', name: 'Bambu P1P', path: this.baseUrl + '/tasmota2', status: false } + // anstatt der baseurl die adressen der stecker aus dem reverseproxy eingefügt + { id: '1', name: 'Aktiv Kohle Lüfter', path: 'http://stecker1.neugasse.lan', status: false }, + { id: '2', name: 'Bambu P1P', path: 'http://stecker1.neugasse.lan', status: false } + // Hier können weitere Steckdosen-Objekte hinzugefügt werden + ]; private httpOptions = { headers: new HttpHeaders({ @@ -40,11 +51,10 @@ export class TasmotaService { ); } - get socket1Path(): string { - return this.SOCKET1_PATH; - } - - get socket2Path(): string { - return this.SOCKET2_PATH; - } + // ALT: Die Getter `socket1Path` und `socket2Path` werden entfernt, + // da die Pfade nun direkt aus dem `sockets`-Array im Service oder in der Komponente bezogen werden. + /* + get socket1Path(): string { return this.SOCKET1_PATH; } + get socket2Path(): string { return this.SOCKET2_PATH; } + */ }