Skip to content

Commit

Permalink
PR changes
Browse files Browse the repository at this point in the history
  • Loading branch information
@fcv-iteratorIt
fcv-iteratorIt committed Sep 26, 2024
1 parent 5a059b7 commit 5f02a0d
Show file tree
Hide file tree
Showing 3 changed files with 99 additions and 92 deletions.
122 changes: 63 additions & 59 deletions .../iot-device-change-application-dialog/iot-device-change-application-dialog.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,45 +2,48 @@
<h1 mat-dialog-title>{{ "IOTDEVICE.CHANGE-APPLICATION.TITLE" | translate }}</h1>
<div mat-dialog-content>
<label class="form-label" for="organizationSelect">{{
"IOTDEVICE.CHANGE-APPLICATION.CHOOSE-ORGANIZATION" | translate
}}</label>
"IOTDEVICE.CHANGE-APPLICATION.CHOOSE-ORGANIZATION" | translate
}}</label>
<mat-select
id="organizationSelect"
class="form-control"
panelClass="overflow-x-hidden"
(selectionChange)="onOrganizationChange()"
[(value)]="iotDeviceUpdate.organizationId"
[compareWith]="compare"
(selectionChange)="onOrganizationChange()"
class="form-control"
id="organizationSelect"
panelClass="overflow-x-hidden"
>
<mat-option *ngFor="let organization of organizations | async" [value]="organization.id">
{{ organization.name }}
</mat-option>
</mat-select>
<label class="form-label" for="organizationSelect">{{
"IOTDEVICE.CHANGE-APPLICATION.CHOOSE-APPLICATION" | translate
}}</label>
"IOTDEVICE.CHANGE-APPLICATION.CHOOSE-APPLICATION" | translate
}}</label>
<mat-select
id="applicationSelect"
class="form-control"
panelClass="overflow-x-hidden"
(selectionChange)="onApplicationChange()"
[(value)]="iotDeviceUpdate.applicationId"
[compareWith]="compare"
(selectionChange)="onApplicationChange()"
class="form-control"
id="applicationSelect"
panelClass="overflow-x-hidden"
>
<mat-option *ngFor="let application of filteredApplications | async" [value]="application.id">
{{ application.name }}
</mat-option>
</mat-select>
<label class="form-label" for="organizationSelect">{{
"IOTDEVICE.CHANGE-APPLICATION.CHOOSE-DEVICE-MODEL" | translate
}}</label>
"IOTDEVICE.CHANGE-APPLICATION.CHOOSE-DEVICE-MODEL" | translate
}}</label>
<mat-select
id="deviceModelSelect"
class="form-control"
panelClass="overflow-x-hidden"
[(value)]="iotDeviceUpdate.deviceModelId"
[compareWith]="compare"
class="form-control"
id="deviceModelSelect"
panelClass="overflow-x-hidden"
>
<mat-option [value]="0">
{{ "QUESTION.DEVICE-MODEL-SELECT-NON" | translate }}
</mat-option>
<mat-option *ngFor="let deviceModel of deviceModels" [value]="deviceModel.id">
{{ deviceModel.body.name }}
</mat-option>
Expand All @@ -49,61 +52,62 @@ <h1 mat-dialog-title>{{ "IOTDEVICE.CHANGE-APPLICATION.TITLE" | translate }}</h1>

<div class="container row" class="mt-3" mat-dialog-content>
<a (click)="addRow()" class="btn btn-secondary my-2 mb-3 mt-3">{{
"IOTDEVICE.CHANGE-APPLICATION.CHOOSE-DATA-TARGET" | translate
}}</a>
"IOTDEVICE.CHANGE-APPLICATION.CHOOSE-DATA-TARGET" | translate
}}</a>
<ng-container *ngIf="payloadDecoders && iotDeviceUpdate.dataTargetToPayloadDecoderIds?.length > 0">
<table class="table table-striped table-bordered">
<tbody>
<tr
*ngFor="let element of iotDeviceUpdate.dataTargetToPayloadDecoderIds; let i = index"
[attr.data-index]="i"
>
<td>
<div class="row">
<mat-form-field appearance="fill">
<mat-label>{{ "IOTDEVICE.CHANGE-APPLICATION.ADD-DATA-TARGET" | translate }}</mat-label>
<mat-select name="dataTarget" [(value)]="element.dataTargetId">
<mat-option *ngFor="let dataTarget of dataTargets" [value]="dataTarget.id">{{
<tr
*ngFor="let element of iotDeviceUpdate.dataTargetToPayloadDecoderIds; let i = index"
[attr.data-index]="i"
>
<td>
<div class="row">
<mat-form-field appearance="fill">
<mat-label>{{ "IOTDEVICE.CHANGE-APPLICATION.ADD-DATA-TARGET" | translate }}</mat-label>
<mat-select [(value)]="element.dataTargetId" name="dataTarget">
<mat-option *ngFor="let dataTarget of dataTargets" [value]="dataTarget.id">{{
dataTarget.name
}}</mat-option>
</mat-select>
</mat-form-field>
</div>
</td>
<td>
<div class="row">
<mat-form-field appearance="fill">
<mat-label>{{ "QUESTION.DATATARGET.SELECT-PAYLOADDECODER" | translate }}</mat-label>
<mat-select matNativeControl name="payloadDecoder" [(value)]="element.payloadDecoderId">
<mat-option [value]="0">
{{ "QUESTION.DATATARGET.NO-PAYLOAD-DECODER-SELECTED" | translate }}
</mat-option>
<mat-option *ngFor="let payloadDecoder of payloadDecoders" [value]="payloadDecoder.id">
{{ payloadDecoder.name }}
</mat-option>
</mat-select>
</mat-form-field>
}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
</td>
<td>
<div class="row">
<mat-form-field appearance="fill">
<mat-label>{{ "QUESTION.DATATARGET.SELECT-PAYLOADDECODER" | translate }}</mat-label>
<mat-select [(value)]="element.payloadDecoderId" matNativeControl name="payloadDecoder">
<mat-option [value]="0">
{{ "QUESTION.DATATARGET.NO-PAYLOAD-DECODER-SELECTED" | translate }}
</mat-option>
<mat-option *ngFor="let payloadDecoder of payloadDecoders" [value]="payloadDecoder.id">
{{ payloadDecoder.name }}
</mat-option>
</mat-select>
</mat-form-field>
</div>
</td>
<td>
<a (click)="deleteRow(i)">
<div class="text-center m-2">
<fa-icon [icon]="faTimesCircle"></fa-icon>
<p>{{ "DATATARGET.DELETE" | translate }}</p>
</div>
</td>
<td>
<a (click)="deleteRow(i)">
<div class="text-center m-2">
<fa-icon [icon]="faTimesCircle"></fa-icon>
<p>{{ "DATATARGET.DELETE" | translate }}</p>
</div>
</a>
</td>
</tr>
</a>
</td>
</tr>
</tbody>
</table>
</ng-container>
</div>

<div mat-dialog-actions class="d-flex flex-row mat-dialog-actions">
<div class="d-flex flex-row mat-dialog-actions" mat-dialog-actions>
<button (click)="onSubmit()" class="btn btn-primary">
{{ "GEN.SAVE" | translate }}
</button>
<button mat-dialog-close [mat-dialog-close]="false" class="btn btn-secondary ml-2">
<button [mat-dialog-close]="false" class="btn btn-secondary ml-2" mat-dialog-close>
{{ "GEN.CANCEL" | translate }}
</button>
</div>
Expand Down
59 changes: 34 additions & 25 deletions ...es/iot-device-change-application-dialog/iot-device-change-application-dialog.component.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Component, Inject, OnInit } from "@angular/core";
import { Component, Inject, OnDestroy, OnInit } from "@angular/core";
import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";
import { MatSnackBar } from "@angular/material/snack-bar";
import { Organisation } from "@app/admin/organisation/organisation.model";
Expand All @@ -9,18 +9,13 @@ import { Application } from "@applications/application.model";
import { ApplicationService } from "@applications/application.service";
import { TranslateService } from "@ngx-translate/core";
import { IoTDeviceApplicationDialogModel } from "@shared/models/dialog.model";
import { SharedVariableService } from "@shared/shared-variable/shared-variable.service";
import { ReplaySubject, Subscription } from "rxjs";
import { ReplaySubject } from "rxjs";
import { IotDevice, UpdateIoTDeviceApplication } from "../iot-device.model";
import { IoTDeviceService } from "../iot-device.service";
import { PayloadDecoder, PayloadDecoderMappedResponse } from "@payload-decoder/payload-decoder.model";
import { PayloadDecoderService } from "@payload-decoder/payload-decoder.service";
import { DatatargetService } from "@applications/datatarget/datatarget.service";
import { Datatarget } from "@applications/datatarget/datatarget.model";
import {
PayloadDeviceDatatarget,
PayloadDeviceDatatargetGetByDataTargetResponse,
} from "@payload-decoder/payload-device-data.model";
import { PayloadDeviceDatatargetService } from "@payload-decoder/payload-device-datatarget.service";
import { faTimesCircle } from "@fortawesome/free-solid-svg-icons";

Expand All @@ -29,14 +24,7 @@ import { faTimesCircle } from "@fortawesome/free-solid-svg-icons";
templateUrl: "./iot-device-change-application-dialog.component.html",
styleUrls: ["./iot-device-change-application-dialog.component.scss"],
})
export class IoTDeviceChangeApplicationDialogComponent implements OnInit {
public iotDevicesSubscription: Subscription;
public applicationsSubscription: Subscription;
public organizationsSubscription: Subscription;
public deviceModelSubscription: Subscription;
private payloadDecoderSubscription: Subscription;
private dataTargetSubscription: Subscription;
private payloadDeviceDatatargetSubscription: Subscription;
export class IoTDeviceChangeApplicationDialogComponent implements OnInit, OnDestroy {
public iotDevice: IotDevice;
public iotDeviceUpdate: UpdateIoTDeviceApplication;
public organizations: ReplaySubject<Organisation[]> = new ReplaySubject<Organisation[]>(1);
Expand All @@ -47,6 +35,7 @@ export class IoTDeviceChangeApplicationDialogComponent implements OnInit {
public payloadDecoders: PayloadDecoder[] = [];
public dataTargets: Datatarget[] = [];
faTimesCircle = faTimesCircle;
private subscriptions = [];

constructor(
private iotDeviceService: IoTDeviceService,
Expand Down Expand Up @@ -74,8 +63,12 @@ export class IoTDeviceChangeApplicationDialogComponent implements OnInit {
this.getIoTDeviceAndDefaultData(this.dialogModel.deviceId);
}

ngOnDestroy(): void {
this.subscriptions.forEach(s => s?.unsubscribe());
}

getIoTDeviceAndDefaultData(id: number): void {
this.iotDevicesSubscription = this.iotDeviceService.getIoTDevice(id).subscribe((iotDevice: IotDevice) => {
const iotDevicesSubscription = this.iotDeviceService.getIoTDevice(id).subscribe((iotDevice: IotDevice) => {
this.iotDevice = iotDevice;
this.getOrganizations();
this.getApplications();
Expand All @@ -90,58 +83,72 @@ export class IoTDeviceChangeApplicationDialogComponent implements OnInit {

this.getIoTDeviceCurrentDataTargetsAndPayloadDecoders(this.dialogModel.deviceId);
});

this.subscriptions.push(iotDevicesSubscription);
}

getIoTDeviceCurrentDataTargetsAndPayloadDecoders(id: number): void {
this.payloadDeviceDatatargetSubscription = this.payloadDeviceDatatargetService
const payloadDeviceDatatargetSubscription = this.payloadDeviceDatatargetService
.getByIoTDevice(id)
.subscribe(dataTargetsAndPayloadDecoders => {
const dataTargetsAndPayloadIds = dataTargetsAndPayloadDecoders.data.map(val => {
return { dataTargetId: val.dataTarget.id, payloadDecoderId: val.payloadDecoder?.id };
});
this.iotDeviceUpdate.dataTargetToPayloadDecoderIds.push(...dataTargetsAndPayloadIds);
});

this.subscriptions.push(payloadDeviceDatatargetSubscription);
}

getOrganizations() {
this.organizationsSubscription = this.organizationService.getMultipleWithApplicationAdmin().subscribe(res => {
const organizationsSubscription = this.organizationService.getMultipleWithApplicationAdmin().subscribe(res => {
this.organizations.next(res.data.slice());
});

this.subscriptions.push(organizationsSubscription);
}

getApplications(): void {
this.applicationsSubscription = this.applicationService
const applicationsSubscription = this.applicationService
.getApplications(1000, 0, "asc", "id")
.subscribe(applicationData => {
this.applications = applicationData.data;
this.filteredApplications.next(
this.applications.filter(app => app.belongsTo.id === this.iotDevice.application.belongsTo.id)
);
});

this.subscriptions.push(applicationsSubscription);
}

getPayloadDecoders() {
this.payloadDecoderSubscription = this.payloadDecoderService
const payloadDecoderSubscription = this.payloadDecoderService
.getMultiple(1000, 0, "id", "ASC")
.subscribe((response: PayloadDecoderMappedResponse) => {
this.payloadDecoders = response.data.sort((a, b) => a.name.localeCompare(b.name, "en", { numeric: true }));
});

this.subscriptions.push(payloadDecoderSubscription);
}

getDataTargets(applicationId: number) {
this.dataTargetSubscription = this.dateTargetService
const dataTargetSubscription = this.dateTargetService
.getByApplicationId(1000, 0, applicationId)
.subscribe(response => {
this.dataTargets = response.data;
});

this.subscriptions.push(dataTargetSubscription);
}

getDeviceModels(organizationId: number) {
this.deviceModelSubscription = this.deviceModelService
const deviceModelSubscription = this.deviceModelService
.getMultiple(1000, 0, "asc", "id", organizationId)
.subscribe(res => {
this.deviceModels = res.data;
this.deviceModels = res.data.sort((a, b) => a.body.name.localeCompare(b.body.name, "en", { numeric: true }));
});

this.subscriptions.push(deviceModelSubscription);
}

public addRow() {
Expand Down Expand Up @@ -179,12 +186,12 @@ export class IoTDeviceChangeApplicationDialogComponent implements OnInit {
if (
!this.iotDeviceUpdate.applicationId ||
!this.iotDeviceUpdate.organizationId ||
!this.iotDeviceUpdate.deviceModelId ||
this.iotDeviceUpdate.deviceModelId == null ||
this.iotDeviceUpdate.dataTargetToPayloadDecoderIds.some(val => !val.dataTargetId)
)
return;

this.iotDevicesSubscription = this.iotDeviceService
const iotDevicesSubscription = this.iotDeviceService
.changeIoTDeviceApplication(this.iotDevice.id, this.iotDeviceUpdate)
.subscribe(savedIoTDevice => {
this.snackBar.open(
Expand All @@ -200,5 +207,7 @@ export class IoTDeviceChangeApplicationDialogComponent implements OnInit {
this.dialog.close(true);
this.snackBar._openedSnackBarRef.afterDismissed().subscribe(() => location.reload());
});

this.subscriptions.push(iotDevicesSubscription);
}
}
10 changes: 2 additions & 8 deletions src/app/applications/iot-devices/iot-devices-table/iot-devices-table.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -116,16 +116,13 @@ export class IotDevicesTableComponent implements AfterViewInit, OnInit {
public pageSizeOptions = DefaultPageSizeOptions;
public canEdit = false;
deviceTypes = DeviceType;

private readonly CHIRPSTACK_BATTERY_NOT_AVAILIBLE = 255;

batteryStatusColor = "green";
resultsLength = 0;
isLoadingResults = true;

displayedColumns: string[] = [];

iotDeviceSavedColumns = "iotDeviceSavedColumns";
protected readonly columnDefinitions = columnDefinitions;
private readonly CHIRPSTACK_BATTERY_NOT_AVAILIBLE = 255;

constructor(
private restService: RestService,
Expand Down Expand Up @@ -247,7 +244,6 @@ export class IotDevicesTableComponent implements AfterViewInit, OnInit {
}

onOpenChangeApplicationDialog(id: number) {
this.data[0].type === DeviceType.SIGFOX;
this.changeApplicationDialog.open(IoTDeviceChangeApplicationDialogComponent, {
data: {
deviceId: id,
Expand All @@ -273,6 +269,4 @@ export class IotDevicesTableComponent implements AfterViewInit, OnInit {
}
return text.substring(0, maxLength) + "...";
}

protected readonly columnDefinitions = columnDefinitions;
}

0 comments on commit 5f02a0d

Please sign in to comment.