Revize c3e17dae

Re #8787 - Přidat unit - úprava formuláře

• add unit is now in the nav-bar

src/app/dashboard/components/dashboard.component.html

@@ -14 +14 @@
           <div class="col-md-8"><h3>{{ unit.unit.description}}</h3></div>
           <div class="col-md-4 text-right">
             <p-button label="Sensors graph" icon="pi pi-chart-line" [routerLink]="['/dashboard/unit', unit.unit.unitId]"></p-button>
-            <p-splitButton label="Add sensor" (onClick)="insertSensorPopup($event, unit.unit)" icon="pi pi-plus-circle" (onDropdownClick)="showItems($event, unit.unit)" [model]="items" styleClass="p-button-warning"></p-splitButton>
+            <p-splitButton *ngIf="loggedUser?.userInfo?.rightsId == 0 || loggedUser?.userInfo?.rightsId == 1" label="Add sensor" (onClick)="insertSensorPopup($event, unit.unit)" icon="pi pi-plus-circle" (onDropdownClick)="showItems($event, unit.unit)" [model]="items" styleClass="p-button-warning"></p-splitButton>
           </div>
         </div>
       </p-header>
       <div>
-        <app-sensors *ngFor="let sensor of unit.sensors" [sensor]="sensor" [unitId]="unit.unit.unitId" [phenomenons]="phenomenons"></app-sensors>
+        <app-sensors *ngFor="let sensor of unit.sensors" [sensor]="sensor" [unitId]="unit.unit.unitId" [phenomenons]="phenomenons" [loggedUser]="loggedUser"></app-sensors>
       </div>
     </p-accordionTab>
 </p-accordion>
 </div>
 
 <app-unit-popup *ngIf="editedUnit" [(isVisible)]="showEditUnitPopup" [unit]="editedUnit"></app-unit-popup>
-<app-unit-insert-popup [(isVisible)]="showInsertUnitPopup" [phenomenons]="phenomenons"></app-unit-insert-popup>
 <app-sensor-insert-popup *ngIf="editedUnit" [unit]="editedUnit" [(isVisible)]="showInsertSensorPopup" [phenomenons]="phenomenons"></app-sensor-insert-popup>
 
 

src/app/dashboard/components/dashboard.component.ts

@@ -14 +14 @@
 import {ToastService} from '../../shared/services/toast.service';
 import {map} from 'rxjs/operators';
 import {HttpResponse} from '@angular/common/http';
+import {AuthService} from '../../auth/services/auth.service';
+import {User} from '../../auth/models/user';
 
 @Component({
   selector: 'app-dashboard',
@@ -22 +24 @@
 })
 export class DashboardComponent implements OnInit {
 
+  loggedUser: User;
   items: MenuItem[] = [];
   position: 'bottom';
   groups: Group[];
   units: Array<{ drivers?: Drivers; generalInfo?: GeneralInfo; holder?: any; lastpos?: Lastpos; sensors?: Array<Sensor>; unit?: Unit }>;
-  showInsertUnitPopup = false;
   editedUnit: Unit;
   showEditUnitPopup = false;
   showInsertSensorPopup = false;
@@ -38 +40 @@
     private confirmationService: ConfirmationService,
     private messageService: MessageService,
     private managementService: ManagementService,
-    private toastService: ToastService
+    private toastService: ToastService,
+    private authService: AuthService
   ) {
     this.sensorService.getPhenomenons().subscribe(
       response => this.phenomenons = response
@@ -46 +49 @@
   }
 
   ngOnInit(): void {
+    this.setUser();
     this.getUnits();
   }
 
+  setUser(){
+    this.authService.getUserState().subscribe(res => {
+      if(res){
+        this.loggedUser = res;
+      }
+    });
+  }
+
   getUnits() {
     this.dataService.getData().subscribe(data => {
       this.units = data;
@@ -62 +74 @@
     this.showEditUnitPopup = true;
   }
 
-  insertUnitPopup() {
-    this.showInsertUnitPopup = true;
-  }
-
   insertSensorPopup($event: any, unit: Unit) {
     $event.stopPropagation();
     this.showInsertSensorPopup = true;

src/app/dashboard/components/sensors/sensors.component.html

@@ -6 +6 @@
   </div>
   <div class="col-md-7 text-right">
     <button pButton type="button" label="View graph" [routerLink]="['/dashboard/unit', unitId, 'sensor', sensor.sensorId]" title="Sensor" icon="pi pi-chart-line"></button>
-    <div class="dashboard-button-separator"></div>
-    <button pButton type="button" label="Edit sensor" icon="pi pi-cog" (click)="editSensor($event, sensor)" [className]="'p-button-warning'"></button>
-    <button pButton type="button" label="Delete sensor" icon="pi pi-times" (click)="deleteSensor($event, sensor)" [className]="'p-button-danger'"></button>
+    <ng-container *ngIf="loggedUser?.userInfo?.rightsId == 0 || loggedUser?.userInfo?.rightsId == 1">
+      <div class="dashboard-button-separator"></div>
+      <button pButton type="button" label="Edit sensor" icon="pi pi-cog" (click)="editSensor($event, sensor)" [className]="'p-button-warning'"></button>
+      <button pButton type="button" label="Delete sensor" icon="pi pi-times" (click)="deleteSensor($event, sensor)" [className]="'p-button-danger'"></button>
+    </ng-container>
   </div>
 </div>
 

src/app/dashboard/components/sensors/sensors.component.ts

@@ -5 +5 @@
 import {map} from 'rxjs/operators';
 import {HttpResponse} from '@angular/common/http';
 import {ToastService} from '../../../shared/services/toast.service';
+import {User} from '../../../auth/models/user';
 
 @Component({
   selector: 'app-sensors',
@@ -16 +17 @@
   @Input() sensor: Sensor;
   @Input() unitId: number;
   @Input() phenomenons;
+  @Input() loggedUser: User;
   showSensorPopup = false;
   editedSensor: Sensor;
   constructor(
@@ -43 +45 @@
         // TODO this.processSensorDeletion(sensor);
       },
       reject: () => {
-        console.log('REJECTED');
+        this.toastService.operationRejected();
       },
       key: 'positionDialog'
     });

src/app/dashboard/components/unit-insert-popup/unit-insert-popup.component.html

@@ -1 @@
-<p-dialog [visible]="isVisible" [modal]="true" [closable]="false" [draggable]="false" header="Add unit!" [style]="{width: '70vw'}"
-          [baseZIndex]="10000" (onShow)="clearFormArray()">
-
-  <form [formGroup]="insertForm">
-    <div class="input-group form-group">
-      <div class="input-group-prepend">
-        <span class="input-group-text">Unit ID</span>
-      </div>
-      <input type="text" formControlName="unitId" class="form-control" id="unitId" placeholder="unitId"/>
-    </div>
-    <div class="input-group form-group">
-      <div class="input-group-prepend">
-        <span class="input-group-text">Description</span>
-      </div>
-      <input type="text" formControlName="unitDescription" class="form-control" id="unitDescription"
-             placeholder="unitDescription"/>
-    </div>
-    <hr>
-    <div class="input-group form-group">
-      <div formArrayName="sensors" *ngFor="let item of insertForm.get('sensors')['controls']; let i = index;">
-        <div [formGroupName]="i">
-          <div class="input-group form-group">
-            <div class="input-group-prepend">
-              <span class="input-group-text">Sensor ID</span>
-            </div>
-            <input type="text" formControlName="sensorId" class="form-control" id="sensorId" placeholder="sensorId"/>
-          </div>
-          <div class="input-group form-group">
-            <div class="input-group-prepend">
-              <span class="input-group-text">Sensor name</span>
-            </div>
-            <input type="text" formControlName="sensorName" class="form-control" id="sensorName"
-                   placeholder="sensorName"/>
-          </div>
-          <div class="input-group form-group">
-            <div class="input-group-prepend">
-              <span class="input-group-text">Sensor type</span>
-            </div>
-            <input type="text" formControlName="sensorType" class="form-control" id="sensorType"
-                   placeholder="sensorType"/>
-          </div>
-          <div class="input-group form-group">
-            <div class="input-group-prepend">
-              <span class="input-group-text">Sensor name</span>
-            </div>
-            <select formControlName="phenomenons" id="phenomenons">
-              <option *ngFor="let phenomenon of phenomenons; let i = index" [value]="phenomenons[i].phenomenonId">
-                {{phenomenons[i].phenomenonName}} ( {{ phenomenons[i].unit}})
-              </option>
-            </select>
-          </div>
-        </div>
-        <br>
-      </div>
-    </div>
-  </form>
-
-
-  <p-button type="button" (click)="addSensor()" class="pr-2">Add Sensor</p-button>
-
-
-  <p-footer>
-    <div class="row justify-content-end align-items-center">
-      <div>
-        <p-button icon="pi pi-check" (click)="processInsertion()" type="submit" label="Uložit" class="pr-2"></p-button>
-        <p-button icon="pi pi-times" (click)="close()" label="Zavřít" class="pr-2"></p-button>
-      </div>
-    </div>
-  </p-footer>
-</p-dialog>

src/app/dashboard/components/unit-insert-popup/unit-insert-popup.component.ts

@@ -1 @@
-import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
-import {FormArray, FormBuilder, FormGroup, Validators} from '@angular/forms';
-import {InsertUnit} from '../../../shared/api/endpoints/models/insert-unit';
-import {InsertSensor} from '../../../shared/api/endpoints/models/insert-sensor';
-import {ManagementService} from '../../../shared/api/endpoints/services/management.service';
-import {ToastService} from '../../../shared/services/toast.service';
-import {HttpResponse} from '@angular/common/http';
-import {map} from 'rxjs/operators';
-
-@Component({
-  selector: 'app-unit-insert-popup',
-  templateUrl: './unit-insert-popup.component.html',
-  styleUrls: ['./unit-insert-popup.component.scss']
-})
-export class UnitInsertPopupComponent implements OnInit {
-
-  insertForm: FormGroup;
-  items: FormArray;
-
-
-  @Input() phenomenons;
-  @Input() isVisible;
-  @Output() isVisibleChange: EventEmitter<boolean> = new EventEmitter<boolean>();
-
-  constructor(
-    private formBuilder: FormBuilder,
-    private managementService: ManagementService,
-    private toastService: ToastService
-  ) {
-    this.initForm();
-  }
-
-  ngOnInit(): void {
-  }
-
-  close() {
-    this.isVisibleChange.emit(false);
-  }
-
-  initForm() {
-    this.insertForm = this.formBuilder.group({
-      unitId: ['', [Validators.required]],
-      unitDescription: ['', Validators.required],
-      sensors: this.formBuilder.array([this.createSensor()])
-    });
-  }
-
-  createSensor(): FormGroup {
-    return this.formBuilder.group({
-      sensorId: '',
-      sensorName: '',
-      sensorType: '',
-      phenomenons: ['']
-    });
-  }
-
-  addSensor(): void {
-    this.items = this.insertForm.get('sensors') as FormArray;
-    this.items.push(this.createSensor());
-  }
-
-  clearFormArray() {
-    const frmArray = this.insertForm?.get('sensors') as FormArray;
-    if (frmArray) {
-      frmArray.clear();
-    }
-    this.addSensor();
-    this.insertForm.reset();
-  }
-
-  processInsertion() {
-    if (this.insertForm.valid) {
-      const unit: InsertUnit = {
-        unit_id: this.insertForm.controls.unitId.value,
-        description: this.insertForm.controls.unitDescription.value
-      };
-      const sensors: InsertSensor[] = [];
-      const frmArray = this.insertForm?.get('sensors') as FormArray;
-
-      frmArray.controls.forEach(control => {
-        const sensor: InsertSensor = {
-          sensor_id: control.get('sensorId').value,
-          sensor_name: control.get('sensorName').value,
-          sensor_type: control.get('sensorType').value,
-          phenomenon: {
-            phenomenon_id: control.get('phenomenons').value
-          },
-        }
-        sensors.push(sensor);
-      });
-
-      this.managementService.insertUnit$Response({ body: { unit, sensors}}).pipe(
-        map((response: HttpResponse<any>) => {
-          if (response.status === 200) {
-            this.toastService.showSuccessMessage('Unit ' + response.body.unitId + ' inserted!');
-            this.close()
-          } else {
-          }
-        })
-      ).toPromise().then().catch(err => this.toastService.showError(err.error.message));
-    }
-  }
-}

src/app/dashboard/dashboard.module.ts

@@ -9 +9 @@
 import { UnitPopupComponent } from './components/unit-popup/unit-popup.component';
 import {DialogModule} from 'primeng/dialog';
 import { SensorPopupComponent } from './components/sensor-popup/sensor-popup.component';
-import { UnitInsertPopupComponent } from './components/unit-insert-popup/unit-insert-popup.component';
 import {ReactiveFormsModule} from '@angular/forms';
 import { SensorInsertPopupComponent } from './components/sensor-insert-popup/sensor-insert-popup.component';
 import {ConfirmDialogModule} from 'primeng/confirmdialog';
@@ -18 +17 @@
 
 
 @NgModule({
-  declarations: [DashboardComponent, SensorsComponent, UnitPopupComponent, SensorPopupComponent, UnitInsertPopupComponent,
-    SensorInsertPopupComponent],
+  declarations: [DashboardComponent, SensorsComponent, UnitPopupComponent, SensorPopupComponent, SensorInsertPopupComponent],
   imports: [
     CommonModule,
     NavBarModule,

src/app/shared/nav-bar/components/nav-bar.component.html

@@ -13 +13 @@
             <li *ngIf="loggedUser?.userInfo?.rightsId == 0" class="nav-item">
               <a class="nav-link" (click)="addUser()"><h2><i class="fas fa-user-plus"></i>&nbsp;Add user</h2></a>
             </li>
-            <li class="nav-item">
-              <a class="nav-link" [routerLink]="['/add-unit']"><h2><i class="fas fa-folder-plus"></i>&nbsp;Add unit</h2></a>
+            <li *ngIf="loggedUser?.userInfo?.rightsId == 0 || loggedUser?.userInfo?.rightsId == 1" class="nav-item">
+              <a class="nav-link" (click)="insertUnitPopup()"><h2><i class="fas fa-folder-plus"></i>&nbsp;Add unit</h2></a>
             </li>
           </ul>
           <a class="navbar-brand" href="/">
@@ -36 +36 @@
 </div>
 
 <app-user-insert-popup *ngIf="showAddUserPopup" [(isVisible)]="showAddUserPopup"></app-user-insert-popup>
+<app-unit-insert-popup [(isVisible)]="showInsertUnitPopup" [phenomenons]="phenomenons"></app-unit-insert-popup>

src/app/shared/nav-bar/components/nav-bar.component.ts

@@ -3 +3 @@
 import {User} from '../../../auth/models/user';
 import {Subscription} from 'rxjs';
 import {Right} from '../../api/endpoints/models/right';
+import {Phenomenon} from '../../api/endpoints/models/phenomenon';
+import {SensorsService} from '../../api/endpoints/services/sensors.service';
 
 @Component({
   selector: 'app-nav-bar',
@@ -15 +17 @@
   subscription: Subscription[] = [];
   showAddUserPopup = false;
   rights: Right[];
+  showInsertUnitPopup = false;
+  phenomenons: Phenomenon[];
   constructor(
-    private authService: AuthService
+    private authService: AuthService,
+    private sensorService: SensorsService
   ) {
   }
 
@@ -32 +37 @@
     });
   }
 
+  insertUnitPopup() {
+    this.sensorService.getPhenomenons().subscribe(
+      response => this.phenomenons = response
+    );
+    this.showInsertUnitPopup = true;
+  }
+
   logOut(): void {
     this.authService.doLogout();
   }

src/app/shared/nav-bar/components/unit-insert-popup/unit-insert-popup.component.html

@@ +1 @@
+<p-dialog [visible]="isVisible" [modal]="true" [closable]="false" [draggable]="false" header="Add unit!" [style]="{width: '70vw'}"
+          [baseZIndex]="10000" (onShow)="clearFormArray()">
+
+  <form [formGroup]="insertForm">
+    <div class="input-group form-group">
+      <div class="input-group-prepend">
+        <span class="input-group-text">Unit ID</span>
+      </div>
+      <input type="text" formControlName="unitId" class="form-control" id="unitId" placeholder="unitId"/>
+    </div>
+    <div class="input-group form-group">
+      <div class="input-group-prepend">
+        <span class="input-group-text">Description</span>
+      </div>
+      <input type="text" formControlName="unitDescription" class="form-control" id="unitDescription"
+             placeholder="unitDescription"/>
+    </div>
+    <hr>
+    <div class="input-group form-group">
+      <div formArrayName="sensors" *ngFor="let item of insertForm.get('sensors')['controls']; let i = index;">
+        <div [formGroupName]="i">
+          <div class="input-group form-group">
+            <div class="input-group-prepend">
+              <span class="input-group-text">Sensor ID</span>
+            </div>
+            <input type="text" formControlName="sensorId" class="form-control" id="sensorId" placeholder="sensorId"/>
+          </div>
+          <div class="input-group form-group">
+            <div class="input-group-prepend">
+              <span class="input-group-text">Sensor name</span>
+            </div>
+            <input type="text" formControlName="sensorName" class="form-control" id="sensorName"
+                   placeholder="sensorName"/>
+          </div>
+          <div class="input-group form-group">
+            <div class="input-group-prepend">
+              <span class="input-group-text">Sensor type</span>
+            </div>
+            <input type="text" formControlName="sensorType" class="form-control" id="sensorType"
+                   placeholder="sensorType"/>
+          </div>
+          <div class="input-group form-group">
+            <div class="input-group-prepend">
+              <span class="input-group-text">Sensor name</span>
+            </div>
+            <select formControlName="phenomenons" id="phenomenons">
+              <option *ngFor="let phenomenon of phenomenons; let i = index" [value]="phenomenons[i].phenomenonId">
+                {{phenomenons[i].phenomenonName}} ( {{ phenomenons[i].unit}})
+              </option>
+            </select>
+          </div>
+        </div>
+        <br>
+      </div>
+    </div>
+  </form>
+
+
+  <p-button type="button" (click)="addSensor()" class="pr-2">Add Sensor</p-button>
+
+
+  <p-footer>
+    <div class="row justify-content-end align-items-center">
+      <div>
+        <p-button icon="pi pi-check" (click)="processInsertion()" type="submit" label="Uložit" class="pr-2"></p-button>
+        <p-button icon="pi pi-times" (click)="close()" label="Zavřít" class="pr-2"></p-button>
+      </div>
+    </div>
+  </p-footer>
+</p-dialog>

src/app/shared/nav-bar/components/unit-insert-popup/unit-insert-popup.component.ts

@@ +1 @@
+import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
+import {FormArray, FormBuilder, FormGroup, Validators} from '@angular/forms';
+import {HttpResponse} from '@angular/common/http';
+import {map} from 'rxjs/operators';
+import {ManagementService} from '../../../api/endpoints/services/management.service';
+import {ToastService} from '../../../services/toast.service';
+import {InsertUnit} from '../../../api/endpoints/models/insert-unit';
+import {InsertSensor} from '../../../api/endpoints/models/insert-sensor';
+import {Phenomenon} from '../../../api/endpoints/models/phenomenon';
+import {SensorsService} from '../../../api/endpoints/services/sensors.service';
+
+@Component({
+  selector: 'app-unit-insert-popup',
+  templateUrl: './unit-insert-popup.component.html',
+  styleUrls: ['./unit-insert-popup.component.scss']
+})
+export class UnitInsertPopupComponent implements OnInit {
+
+  insertForm: FormGroup;
+  items: FormArray;
+
+  @Input()phenomenons: Phenomenon[];
+  @Input() isVisible;
+  @Output() isVisibleChange: EventEmitter<boolean> = new EventEmitter<boolean>();
+
+  constructor(
+    private formBuilder: FormBuilder,
+    private managementService: ManagementService,
+    private toastService: ToastService,
+    private sensorService: SensorsService
+  ) {
+    this.initForm();
+  }
+
+  ngOnInit(): void {
+  }
+
+  close() {
+    this.isVisibleChange.emit(false);
+  }
+
+  initForm() {
+    this.insertForm = this.formBuilder.group({
+      unitId: ['', [Validators.required]],
+      unitDescription: ['', Validators.required],
+      sensors: this.formBuilder.array([this.createSensor()])
+    });
+  }
+
+  createSensor(): FormGroup {
+    return this.formBuilder.group({
+      sensorId: '',
+      sensorName: '',
+      sensorType: '',
+      phenomenons: ['']
+    });
+  }
+
+  addSensor(): void {
+    this.items = this.insertForm.get('sensors') as FormArray;
+    this.items.push(this.createSensor());
+  }
+
+  clearFormArray() {
+    const frmArray = this.insertForm?.get('sensors') as FormArray;
+    if (frmArray) {
+      frmArray.clear();
+    }
+    this.addSensor();
+    this.insertForm.reset();
+  }
+
+  processInsertion() {
+    if (this.insertForm.valid) {
+      const unit: InsertUnit = {
+        unit_id: this.insertForm.controls.unitId.value,
+        description: this.insertForm.controls.unitDescription.value
+      };
+      const sensors: InsertSensor[] = [];
+      const frmArray = this.insertForm?.get('sensors') as FormArray;
+
+      frmArray.controls.forEach(control => {
+        const sensor: InsertSensor = {
+          sensor_id: control.get('sensorId').value,
+          sensor_name: control.get('sensorName').value,
+          sensor_type: control.get('sensorType').value,
+          phenomenon: {
+            phenomenon_id: control.get('phenomenons').value
+          },
+        }
+        sensors.push(sensor);
+      });
+
+      this.managementService.insertUnit$Response({ body: { unit, sensors}}).pipe(
+        map((response: HttpResponse<any>) => {
+          if (response.status === 200) {
+            this.toastService.showSuccessMessage('Unit ' + response.body.unitId + ' inserted!');
+            this.close()
+          } else {
+          }
+        })
+      ).toPromise().then().catch(err => this.toastService.showError(err.error.message));
+    }
+  }
+}

src/app/shared/nav-bar/nav-bar.module.ts

@@ -6 +6 @@
 import { UserInsertPopupComponent } from './components/user-insert-popup/user-insert-popup.component';
 import {DialogModule} from 'primeng/dialog';
 import {ReactiveFormsModule} from '@angular/forms';
+import {UnitInsertPopupComponent} from './components/unit-insert-popup/unit-insert-popup.component';
 
 
 @NgModule({
-  declarations: [NavBarComponent, UserInsertPopupComponent],
+  declarations: [NavBarComponent, UserInsertPopupComponent, UnitInsertPopupComponent],
   exports: [
     NavBarComponent
   ],