notes

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

@@ -1,4 +1,4 @@
-import { Component, Input, OnInit, ViewChild } from '@angular/core';
+import { Component, Input, OnInit, OnChanges, ViewChild } from '@angular/core';
 import { MatButton } from '@angular/material/button';
 import { MatTableDataSource } from '@angular/material/table';
 import { AccountEntryService, AccountService } from '../data-object-service';
@@ -82,4 +82,9 @@ export class AccountComponent implements OnInit {
     this.getAccount()
   }
 
+  ngOnChanges(): void {
+    this.messageService.add(`AccountComponent.ngOnChanges, account: ${this.selectedAccountId}`)
+    this.getAccount()
+  }
+
 }

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

@@ -43,7 +43,8 @@ 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 { AccountComponent } from './account/account.component'
+import { AccountComponent } from './account/account.component';
+import { NoteComponent } from './note/note.component'
 
 registerLocaleData(localeDe)
 
@@ -69,7 +70,8 @@ registerLocaleData(localeDe)
     OverheadAdvanceDetailsComponent,
     FeeListComponent,
     FeeDetailsComponent,
-    AccountComponent
+    AccountComponent,
+    NoteComponent
   ],
   imports: [
     BrowserModule,

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

@@ -25,6 +25,7 @@ import { Tenancy } from './data-objects';
 import { Fee } from './data-objects';
 import { TenancyFeeMapping } from './data-objects';
 import { AccountEntry } from './data-objects';
+import { Note } from './data-objects';
 
 
 
@@ -452,4 +453,34 @@ export class AccountEntryService {
 
 }
 
+@Injectable({ providedIn: 'root' })
+export class NoteService {
+  constructor(private messageService: MessageService, private http: HttpClient) { }
+  
+  async getNotes(): Promise<Note[]> {
+    this.messageService.add(`NoteService: get data`);
+    return this.http.get<Note[]>(`${serviceBaseUrl}/v1/notes`).toPromise()
+  }
+
+  async getNote(id: number): Promise<Note> {
+    this.messageService.add(`NoteService: get data for ${id}`);
+    return this.http.get<Note>(`${serviceBaseUrl}/v1/notes/${id}`).toPromise()
+  }
+
+  async postNote(item: Note): Promise<Note> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`NoteService: post data for ${itemStr}`);
+    return this.http.post<Note>(`${serviceBaseUrl}/v1/notes`, item).toPromise()
+  }
+
+
+
+  async getNotesByTenant(id: number): Promise<Note[]> {
+    this.messageService.add(`NoteService: get data by Tenant ${id}`);
+    return this.http.get<Note[]>(`${serviceBaseUrl}/v1/notes/tenant/${id}`).toPromise()
+  }
+
+
+}
+
 

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

@@ -188,4 +188,17 @@ export const NULL_AccountEntry: AccountEntry = {
     ,amount:   undefined
 }
 
+export interface Note {
+    id: number
+    created_at: string
+    tenant: number
+    note: string
+}
+export const NULL_Note: Note = {
+    id: 0
+    ,created_at:   ''
+    ,tenant:   undefined
+    ,note:   ''
+}
+
 

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

@@ -0,0 +1,40 @@
+table {
+    width: 75%;
+}
+
+.spacer {
+    flex: 1 1 auto;
+}
+
+#addEntryfield {
+    margin-right: 15px;
+}
+
+#divider {
+    margin-top: 20px;
+}
+
+#firstblock {
+    margin-bottom: 20px;
+}
+
+#secondblock {
+    margin-top: 20px;
+}
+
+.rightaligned {
+    justify-self: right;
+}
+
+.large {
+    font-size: large;
+}
+
+.notearea {
+    width: 75%;
+}
+
+.topalign {
+    vertical-align: top;
+    padding-right: 10px;
+}

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

@@ -0,0 +1,53 @@
+<mat-card class="defaultCard">
+    <mat-card-header>
+        <mat-card-title>
+            Notizen
+        </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">
+                        Übersicht
+                    </mat-panel-title>
+                    <mat-panel-description>
+                    </mat-panel-description>
+                </mat-expansion-panel-header>
+    <div id="firstBlock">
+            <form (ngSubmit)="addNote()">
+                <div>
+                    <mat-form-field appearance="outline" class="notearea">
+                        <mat-label>Text</mat-label>
+                        <textarea matInput 
+                            cdkTextareaAutosize
+                            #autosize="cdkTextareaAutosize"
+                            cdkAutosizeMinRows="5"
+                            cdkAutosizeMaxRows="10"            
+                            name="note" [(ngModel)]="newNote.note"></textarea>
+                    </mat-form-field>
+                </div><div>
+                    <button #addNoteButton type="submit" mat-raised-button color="primary">Speichern</button>
+                </div>
+            </form>
+        </div>
+        <div id="secondBlock">
+            <table mat-table [dataSource]="notesDataSource" #zftable>
+                <ng-container matColumnDef="createdAt">
+                    <th mat-header-cell *matHeaderCellDef>Datum</th>
+                    <td mat-cell *matCellDef="let element" class="topalign">{{element.created_at | date}}</td>
+                </ng-container>
+                <ng-container matColumnDef="note">
+                    <th mat-header-cell *matHeaderCellDef>Notiz</th>
+                    <td mat-cell *matCellDef="let element" class="topalign">{{element.note}}</td>
+                </ng-container>
+                <tr mat-header-row *matHeaderRowDef="notesDisplayedColumns"></tr>
+                <tr mat-row *matRowDef="let row; columns: notesDisplayedColumns;"></tr>
+            </table>
+        </div>
+    </mat-expansion-panel>
+</mat-accordion>
+
+    </mat-card-content>
+</mat-card>

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

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

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

@@ -0,0 +1,77 @@
+import { Component, Input, OnInit, OnChanges, ViewChild } from '@angular/core';
+import { MatButton } from '@angular/material/button';
+import { MatTableDataSource } from '@angular/material/table';
+import { NoteService } from '../data-object-service';
+import { Note, NULL_Note } from '../data-objects';
+import { MessageService } from '../message.service';
+
+@Component({
+  selector: 'app-note',
+  templateUrl: './note.component.html',
+  styleUrls: ['./note.component.css']
+})
+export class NoteComponent implements OnInit {
+
+  @Input() selectedTenantId: number
+  @ViewChild('addNoteButton') addNoteButton: MatButton
+
+  collapse: boolean = false
+
+  notes: Note[]
+  notesDataSource: MatTableDataSource<Note>
+  notesDisplayedColumns: string[] = [ "createdAt", "note" ]
+
+  newNote : Note = NULL_Note
+
+  constructor(
+    private noteService: NoteService,
+    private messageService: MessageService
+  ) { }
+
+
+  async getNotes(): Promise<void> {
+    try {
+      if (this.selectedTenantId) {
+        this.messageService.add(`Trying to load note for  ${this.selectedTenantId}`)
+        this.notes = await this.noteService.getNotesByTenant(this.selectedTenantId)
+        this.notes.reverse()
+        this.messageService.add(`Notes: ${JSON.stringify(this.notes, undefined, 4)}`)
+        this.notesDataSource = new MatTableDataSource<Note>(this.notes)
+      }
+    } catch (err) {
+      this.messageService.add(`Error in getNotes: ${JSON.stringify(err, undefined, 4)}`)
+    }
+  }
+
+  
+  async addNote(): Promise<void> {
+    try {
+      this.addNoteButton.disabled = true
+      this.newNote.tenant = this.selectedTenantId
+      this.newNote.created_at = new Date().toDateString()
+      this.messageService.add(`addNote: ${ JSON.stringify(this.newNote, undefined, 4) }`)
+      this.newNote = await this.noteService.postNote(this.newNote)
+      this.messageService.add(`New addNote created: ${this.newNote.id}`)
+      this.newNote = { 'tenant': this.selectedTenantId, 'note': '', 'created_at': '', 'id': 0 }
+      this.getNotes()
+    } catch (err) {
+      this.messageService.add(`Error in addNote: ${JSON.stringify(err, undefined, 4)}`)
+      } finally {
+      this.addNoteButton.disabled = false
+    }
+  }
+
+
+  ngOnInit(): void {
+    this.messageService.add(`NoteComponent.ngOnInit, account: ${this.selectedTenantId}`)
+    this.getNotes()
+
+  }
+
+  ngOnChanges(): void {
+    this.messageService.add(`NoteComponent.ngOnChanges, account: ${this.selectedTenantId}`)
+    this.getNotes()
+
+  }
+
+}

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

@@ -203,6 +203,8 @@
         </mat-card-content>
     </mat-card>
 
-    <app-account [selectedAccountId]="tenantId"></app-account>
+    <app-note [selectedTenantId]="tenantId"></app-note>
+
+    <app-account [selectedAccountId]="tenant.account"></app-account>
 
 </section>