tenant details form

ui/hv2-ui/src/app/tenant-details/tenant-details.component.html

@@ -0,0 +1,69 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                {{tenant?.firstname}} {{tenant?.lastname}}
+            </mat-card-title>
+            <mat-card-subtitle>
+                ID: {{tenant?.id}}
+            </mat-card-subtitle>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <form (ngSubmit)="updateTenant()">
+                    <div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Anrede</mat-label>
+                            <input matInput name="salutation" [(ngModel)]="tenant.salutation"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Vorname</mat-label>
+                            <input matInput name="firstname" [(ngModel)]="tenant.firstname"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Nachname</mat-label>
+                            <input matInput name="lastname" [(ngModel)]="tenant.lastname"/>
+                        </mat-form-field>
+                    </div><div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Adresse 1 (Straße)</mat-label>
+                            <input matInput name="address" [(ngModel)]="tenant.address1"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Adresse 2</mat-label>
+                            <input matInput name="address2" [(ngModel)]="tenant.address2"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Adresse 3</mat-label>
+                            <input matInput name="address3" [(ngModel)]="tenant.address3"/>
+                        </mat-form-field>
+                    </div><div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>PLZ</mat-label>
+                            <input matInput name="zip" [(ngModel)]="tenant.zip"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Ort</mat-label>
+                            <input matInput name="city" [(ngModel)]="tenant.city"/>
+                        </mat-form-field>
+                    </div><div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Telefon 1</mat-label>
+                            <input matInput name="phone1" [(ngModel)]="tenant.phone1"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Telefon 2</mat-label>
+                            <input matInput name="phone2" [(ngModel)]="tenant.phone2"/>
+                        </mat-form-field>
+                    </div><div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>IBAN</mat-label>
+                            <input matInput name="iban" [(ngModel)]="tenant.iban"/>
+                        </mat-form-field>
+                    </div>
+                    <button type="submit" mat-raised-button color="primary">Speichern</button>
+                </form>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/tenant-details/tenant-details.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TenantDetailsComponent } from './tenant-details.component';
+
+describe('TenantDetailsComponent', () => {
+  let component: TenantDetailsComponent;
+  let fixture: ComponentFixture<TenantDetailsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ TenantDetailsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TenantDetailsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/tenant-details/tenant-details.component.ts

@@ -0,0 +1,57 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { TenantService } from '../data-object-service';
+import { Tenant } from '../data-objects';
+import { MessageService } from '../message.service';
+import { Location } from '@angular/common'
+
+@Component({
+  selector: 'app-tenant-details',
+  templateUrl: './tenant-details.component.html',
+  styleUrls: ['./tenant-details.component.css']
+})
+export class TenantDetailsComponent implements OnInit {
+
+  tenant: Tenant = {
+    id: 0, 
+    salutation: '', 
+    firstname: '', 
+    lastname: '', 
+    address1: '', 
+    address2: '', 
+    address3: '', 
+    zip: '', 
+    city: '', 
+    phone1: '', 
+    phone2: '', 
+    iban: '', 
+    account: 0
+  }
+
+
+  constructor(
+    private tenantService: TenantService, 
+    private messageService: MessageService,
+    private route: ActivatedRoute,
+    private location: Location
+  ) { }
+
+  async getTenant(): Promise<void> {
+    try {
+      const id = +this.route.snapshot.paramMap.get('id')
+      this.tenant = await this.tenantService.getTenant(id)
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  updateTenant() {
+    this.messageService.add("updateTenant")
+    this.messageService.add(JSON.stringify(this.tenant, undefined, 4))
+  }
+
+  ngOnInit(): void {
+    this.getTenant()
+  }
+
+}