account at tenant

ui/hv2-ui/src/app/account/account.component.css

@@ -0,0 +1,23 @@
+table {
+    width: 75%;
+}
+
+.spacer {
+    flex: 1 1 auto;
+}
+
+#addEntryfield {
+    margin-right: 15px;
+}
+
+#divider {
+    margin-top: 20px;
+}
+
+#firstblock {
+    margin-bottom: 20px;
+}
+
+#secondblock {
+    margin-top: 20px;
+}

ui/hv2-ui/src/app/account/account.component.html

@@ -0,0 +1,59 @@
+<mat-card class="defaultCard">
+    <mat-card-header>
+        <mat-card-title>
+            {{account?.description}} ({{account?.id}})
+        </mat-card-title>
+    </mat-card-header>
+    <mat-card-content>
+        <mat-accordion>
+            <mat-expansion-panel (opened)="collapse = true"
+                                (closed)="collapse = false">
+                <mat-expansion-panel-header>
+                    <mat-panel-title *ngIf="!collapse">
+                        Kontoübersicht
+                    </mat-panel-title>
+                    <mat-panel-description>
+                    </mat-panel-description>
+                </mat-expansion-panel-header>
+    <div id="firstBlock">
+            <form (ngSubmit)="addAccountEntry()">
+                <mat-form-field appearance="outline" id="addEntryfield">
+                    <mat-label>Datum</mat-label>
+                    <input matInput name="createdAt" [(ngModel)]="newAccountEntry.created_at" [matDatepicker]="createdAtPicker"/>
+                    <mat-datepicker-toggle matSuffix [for]="createdAtPicker"></mat-datepicker-toggle>
+                    <mat-datepicker #createdAtPicker></mat-datepicker>
+                </mat-form-field>
+                <mat-form-field appearance="outline">
+                    <mat-label>Betrag (€)</mat-label>
+                    <input matInput type="number" name="amount" [(ngModel)]="newAccountEntry.amount"/>
+                </mat-form-field>
+                <mat-form-field appearance="outline">
+                    <mat-label>Beschreibung</mat-label>
+                    <input matInput name="description" [(ngModel)]="newAccountEntry.description"/>
+                </mat-form-field>
+                <button #addAccountEntryButton type="submit" mat-raised-button color="primary">Buchung speichern</button>
+            </form>
+        </div>
+        <div id="secondBlock">
+            <table mat-table [dataSource]="accountEntriesDataSource" #zftable>
+                <ng-container matColumnDef="description">
+                    <th mat-header-cell *matHeaderCellDef>Beschreibung</th>
+                    <td mat-cell *matCellDef="let element">{{element.description}}</td>
+                </ng-container>
+                <ng-container matColumnDef="amount">
+                    <th mat-header-cell *matHeaderCellDef>Betrag</th>
+                    <td mat-cell *matCellDef="let element">{{element.amount}} €</td>
+                </ng-container>
+                <ng-container matColumnDef="createdAt">
+                    <th mat-header-cell *matHeaderCellDef>Datum</th>
+                    <td mat-cell *matCellDef="let element">{{element.created_at}}</td>
+                </ng-container>
+                <tr mat-header-row *matHeaderRowDef="accountEntriesDisplayedColumns"></tr>
+                <tr mat-row *matRowDef="let row; columns: accountEntriesDisplayedColumns;"></tr>
+            </table>
+        </div>
+    </mat-expansion-panel>
+</mat-accordion>
+
+    </mat-card-content>
+</mat-card>

ui/hv2-ui/src/app/account/account.component.spec.ts

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

ui/hv2-ui/src/app/account/account.component.ts

@@ -0,0 +1,54 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { MatTableDataSource } from '@angular/material/table';
+import { AccountEntryService, AccountService } from '../data-object-service';
+import { Account, AccountEntry, NULL_AccountEntry } from '../data-objects';
+import { MessageService } from '../message.service';
+
+@Component({
+  selector: 'app-account',
+  templateUrl: './account.component.html',
+  styleUrls: ['./account.component.css']
+})
+export class AccountComponent implements OnInit {
+
+  @Input() selectedAccountId: number
+
+  account: Account
+  accountEntries: AccountEntry[]
+  accountEntriesDataSource: MatTableDataSource<AccountEntry>
+  accountEntriesDisplayedColumns: string[] = [ "description", "amount", "createdAt" ]
+
+  newAccountEntry: AccountEntry = NULL_AccountEntry
+
+
+  constructor(
+    private accountService: AccountService,
+    private accountEntryService: AccountEntryService,
+    private messageService: MessageService
+  ) { }
+
+  async getAccountAndEntries(): Promise<void> {
+    try {
+      if (this.selectedAccountId) {
+        this.messageService.add(`Trying to load account ${this.selectedAccountId} and entries`)
+        this.account = await this.accountService.getAccount(this.selectedAccountId)
+        this.messageService.add(`Account: ${JSON.stringify(this.account, undefined, 4)}`)
+        this.accountEntries = await this.accountEntryService.getAccountEntrysByAccount(this.selectedAccountId)
+        this.messageService.add(`AccountEntries: ${JSON.stringify(this.accountEntries, undefined, 4)}`)
+        this.accountEntriesDataSource = new MatTableDataSource<AccountEntry>(this.accountEntries)
+      }
+    } catch (err) {
+      this.messageService.add(`Error in getAccountAndEntries: ${JSON.stringify(err, undefined, 4)}`)
+    }
+  }
+
+  addAccountEntry() {
+
+  }
+
+  ngOnInit(): void {
+    this.messageService.add(`AccountComponent.ngOnInit, account: ${this.selectedAccountId}`)
+    this.getAccountAndEntries()
+  }
+
+}

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

@@ -40,7 +40,8 @@ import { MatDatepickerModule } from '@angular/material/datepicker'
 import { MatNativeDateModule } from '@angular/material/core';
 import { FeeListComponent } from './fee-list/fee-list.component';
 import { FeeDetailsComponent } from './fee-details/fee-details.component';
-import { MatExpansionModule } from '@angular/material/expansion'
+import { MatExpansionModule } from '@angular/material/expansion';
+import { AccountComponent } from './account/account.component'
 
 @NgModule({
   declarations: [
@@ -63,7 +64,8 @@ import { MatExpansionModule } from '@angular/material/expansion'
     OverheadAdvanceListComponent,
     OverheadAdvanceDetailsComponent,
     FeeListComponent,
-    FeeDetailsComponent
+    FeeDetailsComponent,
+    AccountComponent
   ],
   imports: [
     BrowserModule,

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

@@ -173,7 +173,7 @@
                     </ng-container>
                     <ng-container matColumnDef="fee_type">
                         <th mat-header-cell *matHeaderCellDef>Typ</th>
-                        <td mat-cell *matCellDef="let element">{{element.fee_type}} €</td>
+                        <td mat-cell *matCellDef="let element">{{element.fee_type}}</td>
                     </ng-container>
                     <ng-container matColumnDef="startdate">
                         <th mat-header-cell *matHeaderCellDef>Beginn</th>
@@ -203,4 +203,6 @@
         </mat-card-content>
     </mat-card>
 
+    <app-account [selectedAccountId]="tenantId"></app-account>
+
 </section>

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

@@ -23,6 +23,7 @@ interface DN_Tenancy {
 export class TenantDetailsComponent implements OnInit {
 
   tenant: Tenant = NULL_Tenant
+  tenantId: number
 
   account: Account = NULL_Account
 
@@ -64,6 +65,7 @@ export class TenantDetailsComponent implements OnInit {
     try {
       const id = +this.route.snapshot.paramMap.get('id')
       if (id != 0) {
+        this.tenantId = id
         this.tenant = await this.tenantService.getTenant(id)
         this.account = await this.accountService.getAccount(this.tenant.account)
         this.getTenancies()