tenant details form

ui/hv2-ui/src/app/app-routing.module.ts

@@ -8,6 +8,7 @@ import { MyPremisesComponent } from './my-premises/my-premises.component';
 import { MyFlatsComponent } from './my-flats/my-flats.component';
 import { MyParkingsComponent } from './my-parkings/my-parkings.component';
 import { MyCommercialUnitsComponent } from './my-commercial-units/my-commercial-units.component';
+import { TenantDetailsComponent } from './tenant-details/tenant-details.component';
 
 
 const routes: Routes = [
@@ -16,6 +17,7 @@ const routes: Routes = [
   { path: 'flats', component: MyFlatsComponent, canActivate: [ AuthGuardService ] },
   { path: 'parkings', component: MyParkingsComponent, canActivate: [ AuthGuardService ] },
   { path: 'commercialunits', component: MyCommercialUnitsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'tenant/:id', component: TenantDetailsComponent, canActivate: [ AuthGuardService ] },
   { path: 'logout', component: LogoutComponent },
   { path: 'login', component: LoginComponent }
 ]

ui/hv2-ui/src/app/app.module.ts

@@ -21,13 +21,14 @@ import { LogoutComponent } from './logout/logout.component';
 import { LoginComponent } from './login/login.component';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatInputModule } from '@angular/material/input';
+import { MatFormFieldModule } from '@angular/material/form-field'
 import { MyTenantsComponent } from './my-tenants/my-tenants.component';
 import { MatTableModule } from '@angular/material/table';
 import { MyPremisesComponent } from './my-premises/my-premises.component';
 import { MyFlatsComponent } from './my-flats/my-flats.component';
 import { MyParkingsComponent } from './my-parkings/my-parkings.component';
 import { MyCommercialUnitsComponent } from './my-commercial-units/my-commercial-units.component';
-
+import { TenantDetailsComponent } from './tenant-details/tenant-details.component';
 
 @NgModule({
   declarations: [
@@ -41,7 +42,8 @@ import { MyCommercialUnitsComponent } from './my-commercial-units/my-commercial-
     MyPremisesComponent,
     MyFlatsComponent,
     MyParkingsComponent,
-    MyCommercialUnitsComponent
+    MyCommercialUnitsComponent,
+    TenantDetailsComponent
   ],
   imports: [
     BrowserModule,
@@ -58,7 +60,8 @@ import { MyCommercialUnitsComponent } from './my-commercial-units/my-commercial-
     FormsModule,
     ReactiveFormsModule,
     MatTableModule,
-    MatInputModule
+    MatInputModule,
+    MatFormFieldModule
   ],
   providers: [
     { provide: HTTP_INTERCEPTORS, useClass: ErrorHandlerInterceptor, multi: true },

ui/hv2-ui/src/app/data-object-service.ts

@@ -42,6 +42,12 @@ export class AccountService {
     this.messageService.add(`AccountService: fetch data`);
     return this.http.get<Account[]>(`${serviceBaseUrl}/v1/accounts`).toPromise()
   }
+
+  async getAccount(id: number): Promise<Account> {
+    this.messageService.add(`AccountService: fetch data for ${id}`);
+    return this.http.get<Account>(`${serviceBaseUrl}/v1/accounts/${id}`).toPromise()
+  }
+
 }
 
 @Injectable({ providedIn: 'root' })
@@ -52,6 +58,12 @@ export class TenantService {
     this.messageService.add(`TenantService: fetch data`);
     return this.http.get<Tenant[]>(`${serviceBaseUrl}/v1/tenants`).toPromise()
   }
+
+  async getTenant(id: number): Promise<Tenant> {
+    this.messageService.add(`TenantService: fetch data for ${id}`);
+    return this.http.get<Tenant>(`${serviceBaseUrl}/v1/tenants/${id}`).toPromise()
+  }
+
 }
 
 @Injectable({ providedIn: 'root' })
@@ -62,6 +74,12 @@ export class PremiseService {
     this.messageService.add(`PremiseService: fetch data`);
     return this.http.get<Premise[]>(`${serviceBaseUrl}/v1/premises`).toPromise()
   }
+
+  async getPremise(id: number): Promise<Premise> {
+    this.messageService.add(`PremiseService: fetch data for ${id}`);
+    return this.http.get<Premise>(`${serviceBaseUrl}/v1/premises/${id}`).toPromise()
+  }
+
 }
 
 @Injectable({ providedIn: 'root' })
@@ -72,6 +90,12 @@ export class FlatService {
     this.messageService.add(`FlatService: fetch data`);
     return this.http.get<Flat[]>(`${serviceBaseUrl}/v1/flats`).toPromise()
   }
+
+  async getFlat(id: number): Promise<Flat> {
+    this.messageService.add(`FlatService: fetch data for ${id}`);
+    return this.http.get<Flat>(`${serviceBaseUrl}/v1/flats/${id}`).toPromise()
+  }
+
 }
 
 @Injectable({ providedIn: 'root' })
@@ -82,6 +106,12 @@ export class OverheadAdvanceService {
     this.messageService.add(`OverheadAdvanceService: fetch data`);
     return this.http.get<OverheadAdvance[]>(`${serviceBaseUrl}/v1/overhead_advances`).toPromise()
   }
+
+  async getOverheadAdvance(id: number): Promise<OverheadAdvance> {
+    this.messageService.add(`OverheadAdvanceService: fetch data for ${id}`);
+    return this.http.get<OverheadAdvance>(`${serviceBaseUrl}/v1/overhead_advances/${id}`).toPromise()
+  }
+
 }
 
 @Injectable({ providedIn: 'root' })
@@ -92,6 +122,12 @@ export class OverheadAdvanceFlatMappingService {
     this.messageService.add(`OverheadAdvanceFlatMappingService: fetch data`);
     return this.http.get<OverheadAdvanceFlatMapping[]>(`${serviceBaseUrl}/v1/overhead_advance_flat_mappings`).toPromise()
   }
+
+  async getOverheadAdvanceFlatMapping(id: number): Promise<OverheadAdvanceFlatMapping> {
+    this.messageService.add(`OverheadAdvanceFlatMappingService: fetch data for ${id}`);
+    return this.http.get<OverheadAdvanceFlatMapping>(`${serviceBaseUrl}/v1/overhead_advance_flat_mappings/${id}`).toPromise()
+  }
+
 }
 
 @Injectable({ providedIn: 'root' })
@@ -102,6 +138,12 @@ export class ParkingService {
     this.messageService.add(`ParkingService: fetch data`);
     return this.http.get<Parking[]>(`${serviceBaseUrl}/v1/parkings`).toPromise()
   }
+
+  async getParking(id: number): Promise<Parking> {
+    this.messageService.add(`ParkingService: fetch data for ${id}`);
+    return this.http.get<Parking>(`${serviceBaseUrl}/v1/parkings/${id}`).toPromise()
+  }
+
 }
 
 @Injectable({ providedIn: 'root' })
@@ -112,6 +154,12 @@ export class CommercialPremiseService {
     this.messageService.add(`CommercialPremiseService: fetch data`);
     return this.http.get<CommercialPremise[]>(`${serviceBaseUrl}/v1/commercial_premises`).toPromise()
   }
+
+  async getCommercialPremise(id: number): Promise<CommercialPremise> {
+    this.messageService.add(`CommercialPremiseService: fetch data for ${id}`);
+    return this.http.get<CommercialPremise>(`${serviceBaseUrl}/v1/commercial_premises/${id}`).toPromise()
+  }
+
 }
 
 @Injectable({ providedIn: 'root' })
@@ -122,6 +170,12 @@ export class TenancyService {
     this.messageService.add(`TenancyService: fetch data`);
     return this.http.get<Tenancy[]>(`${serviceBaseUrl}/v1/tenancys`).toPromise()
   }
+
+  async getTenancy(id: number): Promise<Tenancy> {
+    this.messageService.add(`TenancyService: fetch data for ${id}`);
+    return this.http.get<Tenancy>(`${serviceBaseUrl}/v1/tenancys/${id}`).toPromise()
+  }
+
 }
 
 @Injectable({ providedIn: 'root' })
@@ -132,6 +186,12 @@ export class FeeService {
     this.messageService.add(`FeeService: fetch data`);
     return this.http.get<Fee[]>(`${serviceBaseUrl}/v1/fees`).toPromise()
   }
+
+  async getFee(id: number): Promise<Fee> {
+    this.messageService.add(`FeeService: fetch data for ${id}`);
+    return this.http.get<Fee>(`${serviceBaseUrl}/v1/fees/${id}`).toPromise()
+  }
+
 }
 
 @Injectable({ providedIn: 'root' })
@@ -142,6 +202,12 @@ export class TenancyFeeMappingService {
     this.messageService.add(`TenancyFeeMappingService: fetch data`);
     return this.http.get<TenancyFeeMapping[]>(`${serviceBaseUrl}/v1/tenancy_fee_mappings`).toPromise()
   }
+
+  async getTenancyFeeMapping(id: number): Promise<TenancyFeeMapping> {
+    this.messageService.add(`TenancyFeeMappingService: fetch data for ${id}`);
+    return this.http.get<TenancyFeeMapping>(`${serviceBaseUrl}/v1/tenancy_fee_mappings/${id}`).toPromise()
+  }
+
 }
 
 @Injectable({ providedIn: 'root' })
@@ -152,6 +218,12 @@ export class AccountEntryService {
     this.messageService.add(`AccountEntryService: fetch data`);
     return this.http.get<AccountEntry[]>(`${serviceBaseUrl}/v1/account_entrys`).toPromise()
   }
+
+  async getAccountEntry(id: number): Promise<AccountEntry> {
+    this.messageService.add(`AccountEntryService: fetch data for ${id}`);
+    return this.http.get<AccountEntry>(`${serviceBaseUrl}/v1/account_entrys/${id}`).toPromise()
+  }
+
 }
 
 

ui/hv2-ui/src/app/data-object-service.ts.tmpl

@@ -30,6 +30,12 @@ export class ${JsNameConverter($table.name)}Service {
     this.messageService.add(`${JsNameConverter($table.name)}Service: fetch data`);
     return this.http.get<${JsNameConverter($table.name)}[]>(`\${serviceBaseUrl}/v1/${table.name}s`).toPromise()
   }
+
+  async get${JsNameConverter($table.name)}(id: number): Promise<${JsNameConverter($table.name)}> {
+    this.messageService.add(`${JsNameConverter($table.name)}Service: fetch data for \${id}`);
+    return this.http.get<${JsNameConverter($table.name)}>(`\${serviceBaseUrl}/v1/${table.name}s/\${id}`).toPromise()
+  }
+
 }
 
 #end for          

ui/hv2-ui/src/app/data-objects.ts

@@ -7,10 +7,12 @@
 
 
 export interface Account {
+    id: number
     description: string
 }
 
 export interface Tenant {
+    id: number
     salutation: string
     firstname: string
     lastname: string
@@ -26,6 +28,7 @@ export interface Tenant {
 }
 
 export interface Premise {
+    id: number
     description: string
     street: string
     zip: string
@@ -33,6 +36,7 @@ export interface Premise {
 }
 
 export interface Flat {
+    id: number
     description: string
     premise: number
     area: number
@@ -40,6 +44,7 @@ export interface Flat {
 }
 
 export interface OverheadAdvance {
+    id: number
     description: string
     amount: number
     startdate: string
@@ -47,21 +52,25 @@ export interface OverheadAdvance {
 }
 
 export interface OverheadAdvanceFlatMapping {
+    id: number
     overhead_advance: number
     flat: number
 }
 
 export interface Parking {
+    id: number
     description: string
     premise: number
 }
 
 export interface CommercialPremise {
+    id: number
     description: string
     premise: number
 }
 
 export interface Tenancy {
+    id: number
     description: string
     tenant: number
     flat: number
@@ -72,6 +81,7 @@ export interface Tenancy {
 }
 
 export interface Fee {
+    id: number
     description: string
     amount: number
     fee_type: string
@@ -80,11 +90,13 @@ export interface Fee {
 }
 
 export interface TenancyFeeMapping {
+    id: number
     tenancy: number
     fee: number
 }
 
 export interface AccountEntry {
+    id: number
     description: string
     account: number
     created_at: string

ui/hv2-ui/src/app/data-objects.ts.tmpl

@@ -4,6 +4,7 @@ $GENERATED_TS_COMMENT
 
 #for $table in $tables    
 export interface $JsNameConverter($table.name) {
+    id: number
 #for $column in $table.columns
     ${column.name}: ${column.jstype}
 #end for

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