hv2/hv2-all-in-one
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Mietzahlung eintragen

Browse Source
This commit is contained in:
Wolfgang Hottgenroth 2021-09-13 16:47:56 +02:00
parent a8296ee210
commit db089a9f2a
Signed by: wn
GPG Key ID: 6C1E5E531E0D5D7F
13 changed files with 177 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ui/hv2-ui/src/app/account/account.component.css
View File

@ -3,6 +3,10 @@ table {
border-spacing: 20px;
}
.mat-table {
border-spacing: 20px;
}
.spacer {
flex: 1 1 auto;
}

130
ui/hv2-ui/src/app/account/account.component.html
View File

@ -1,76 +1,54 @@
<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, Saldo: {{saldo?.saldo | number:'1.2-2'}} €
</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>Kategorie</mat-label>
<mat-select [(ngModel)]="newAccountEntry.account_entry_category" name="category" disabled="shallBeRentPayment">
<mat-option *ngFor="let p of accountEntryCategories" [value]="p.id">{{p.description}}</mat-option>
</mat-select>
</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 class="large">
Saldo: {{saldo?.saldo | number:'1.2-2'}} €
</div>
<div id="secondBlock">
<table mat-table [dataSource]="accountEntriesDataSource" #zftable>
<ng-container matColumnDef="createdAt">
<th mat-header-cell *matHeaderCellDef>Datum</th>
<td mat-cell *matCellDef="let element">{{element.rawAccountEntry.created_at | date}}</td>
</ng-container>
<ng-container matColumnDef="description">
<th mat-header-cell *matHeaderCellDef>Beschreibung</th>
<td mat-cell *matCellDef="let element">{{element.rawAccountEntry.description}}</td>
</ng-container>
<ng-container matColumnDef="amount">
<th mat-header-cell *matHeaderCellDef>Betrag</th>
<td mat-cell *matCellDef="let element" class="rightaligned">{{element.rawAccountEntry.amount | number:'1.2-2'}} €</td>
</ng-container>
<ng-container matColumnDef="category">
<th mat-header-cell *matHeaderCellDef>Kategorie</th>
<td mat-cell *matCellDef="let element">{{element.accountEntryCategory}}</td>
</ng-container>
<ng-container matColumnDef="overhead_relevant">
<th mat-header-cell *matHeaderCellDef>BK relevant</th>
<td mat-cell *matCellDef="let element">{{element.overheadRelevant}}</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>
<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>Kategorie</mat-label>
<mat-select [(ngModel)]="newAccountEntry.account_entry_category" name="category" disabled="shallBeRentPayment">
<mat-option *ngFor="let p of accountEntryCategories" [value]="p.id">{{p.description}}</mat-option>
</mat-select>
</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 class="large">
Saldo: {{saldo?.saldo | number:'1.2-2'}} €
</div>
<div id="secondBlock">
<table mat-table [dataSource]="accountEntriesDataSource" #zftable>
<ng-container matColumnDef="createdAt">
<th mat-header-cell *matHeaderCellDef>Datum</th>
<td mat-cell *matCellDef="let element">{{element.rawAccountEntry.created_at | date}}</td>
</ng-container>
<ng-container matColumnDef="description">
<th mat-header-cell *matHeaderCellDef>Beschreibung</th>
<td mat-cell *matCellDef="let element">{{element.rawAccountEntry.description}}</td>
</ng-container>
<ng-container matColumnDef="amount">
<th mat-header-cell *matHeaderCellDef>Betrag</th>
<td mat-cell *matCellDef="let element" class="rightaligned">{{element.rawAccountEntry.amount | number:'1.2-2'}} €</td>
</ng-container>
<ng-container matColumnDef="category">
<th mat-header-cell *matHeaderCellDef>Kategorie</th>
<td mat-cell *matCellDef="let element">{{element.accountEntryCategory}}</td>
</ng-container>
<ng-container matColumnDef="overhead_relevant">
<th mat-header-cell *matHeaderCellDef>BK relevant</th>
<td mat-cell *matCellDef="let element">{{element.overheadRelevant}}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="accountEntriesDisplayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: accountEntriesDisplayedColumns;"></tr>
</table>
</div>

5
ui/hv2-ui/src/app/account/account.component.ts
View File

@ -1,5 +1,7 @@
import { ViewFlags } from '@angular/compiler/src/core';
import { Component, Input, OnInit, OnChanges, ViewChild } from '@angular/core';
import { MatButton } from '@angular/material/button';
import { MatExpansionPanel } from '@angular/material/expansion';
import { MatTableDataSource } from '@angular/material/table';
import { AccountEntryCategoryService, AccountEntryService, AccountService } from '../data-object-service';
import { Account, AccountEntry, AccountEntryCategory, NULL_AccountEntry } from '../data-objects';
@ -27,8 +29,6 @@ export class AccountComponent implements OnInit {
@Input() shallBeRentPayment: boolean
@ViewChild('addAccountEntryButton') addAccountEntryButton: MatButton
collapse: boolean = false
account: Account
accountEntries: DN_AccountEntry[]
accountEntriesDataSource: MatTableDataSource<DN_AccountEntry>
@ -50,6 +50,7 @@ export class AccountComponent implements OnInit {
private messageService: MessageService
) { }
async getAccount(): Promise<void> {
try {
if (this.selectedAccountId) {

2
ui/hv2-ui/src/app/app-routing.module.ts
View File

@ -17,6 +17,7 @@ import { OverheadAdvanceListComponent } from './overhead-advance-list/overhead-a
import { OverheadAdvanceDetailsComponent } from './overhead-advance-details/overhead-advance-details.component';
import { FeeListComponent } from './fee-list/fee-list.component';
import { FeeDetailsComponent } from './fee-details/fee-details.component';
import { EnterPaymentComponent } from './enter-payment/enter-payment.component';
const routes: Routes = [
@ -41,6 +42,7 @@ const routes: Routes = [
{ path: 'fees', component: FeeListComponent, canActivate: [ AuthGuardService ] },
{ path: 'fee/:id', component: FeeDetailsComponent, canActivate: [ AuthGuardService ] },
{ path: 'fee', component: FeeDetailsComponent, canActivate: [ AuthGuardService ] },
{ path: 'enterPayment', component: EnterPaymentComponent, canActivate: [ AuthGuardService ] },
{ path: 'logout', component: LogoutComponent },
{ path: 'login', component: LoginComponent }
]

6
ui/hv2-ui/src/app/app.module.ts
View File

@ -45,7 +45,8 @@ import { FeeDetailsComponent } from './fee-details/fee-details.component';
import { MatExpansionModule } from '@angular/material/expansion';
import { AccountComponent } from './account/account.component';
import { NoteComponent } from './note/note.component'
import { MatMomentDateModule, MAT_MOMENT_DATE_ADAPTER_OPTIONS } from '@angular/material-moment-adapter'
import { MatMomentDateModule, MAT_MOMENT_DATE_ADAPTER_OPTIONS } from '@angular/material-moment-adapter';
import { EnterPaymentComponent } from './enter-payment/enter-payment.component'
registerLocaleData(localeDe)
@ -72,7 +73,8 @@ registerLocaleData(localeDe)
FeeListComponent,
FeeDetailsComponent,
AccountComponent,
NoteComponent
NoteComponent,
EnterPaymentComponent
],
imports: [
BrowserModule,

0
ui/hv2-ui/src/app/enter-payment/enter-payment.component.css Normal file
View File

22
ui/hv2-ui/src/app/enter-payment/enter-payment.component.html Normal file
View File

@ -0,0 +1,22 @@
<mat-card class="defaultCard">
<mat-card-header>
<mat-card-title>
Mietzahlung eintragen
</mat-card-title>
</mat-card-header>
<mat-card-content>
<div>
<span>Mieter auswählen: </span>
<mat-form-field appearance="outline">
<mat-select #mapSelect [(ngModel)]="accountId" name="tenantAccount">
<mat-label>Mieter</mat-label>
<mat-option *ngFor="let p of tenants" [value]="p.id">{{p.firstname}} {{p.lastname}}</mat-option>
</mat-select>
</mat-form-field>
</div>
<app-account [selectedAccountId]="accountId" [shallBeRentPayment]="true"></app-account>
</mat-card-content>
</mat-card>

25
ui/hv2-ui/src/app/enter-payment/enter-payment.component.spec.ts Normal file
View File

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

37
ui/hv2-ui/src/app/enter-payment/enter-payment.component.ts Normal file
View File

@ -0,0 +1,37 @@
import { Component, OnInit } from '@angular/core';
import { TenantService } from '../data-object-service';
import { Tenant } from '../data-objects';
import { MessageService } from '../message.service';
@Component({
selector: 'app-enter-payment',
templateUrl: './enter-payment.component.html',
styleUrls: ['./enter-payment.component.css']
})
export class EnterPaymentComponent implements OnInit {
tenants: Tenant[]
accountId: number
constructor(
private tenantService: TenantService,
private messageService: MessageService
) { }
async getTenants(): Promise<void> {
try {
this.messageService.add("Trying to load tenants")
this.tenants = await this.tenantService.getTenants()
this.messageService.add("Tenants loaded")
} catch (err) {
this.messageService.add(JSON.stringify(err, undefined, 4))
}
}
ngOnInit(): void {
this.getTenants()
}
}

2
ui/hv2-ui/src/app/navigation/navigation.component.html
View File

@ -8,6 +8,8 @@
<a mat-list-item href="/login">Anmelden</a>
</mat-nav-list>
<mat-nav-list *ngIf="authenticated">
<a mat-list-item href="/enterPayment">Mietzahlung eintragen</a>
</mat-nav-list><mat-divider *ngIf="authenticated"></mat-divider><mat-nav-list *ngIf="authenticated">
<a mat-list-item href="/tenants">Meine Mieter/innen</a>
</mat-nav-list><mat-divider *ngIf="authenticated"></mat-divider><mat-nav-list *ngIf="authenticated">
<a mat-list-item href="/flats">Meine Wohnungen</a>

24
ui/hv2-ui/src/app/tenant-details/tenant-details.component.html
View File

@ -256,7 +256,27 @@
</mat-card-content>
</mat-card>
<app-account [selectedAccountId]="tenant.account" [shallBeRentPayment]="true"></app-account>
<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)="collapseAccount = true"
(closed)="collapseAccount = false" #mep>
<mat-expansion-panel-header>
<mat-panel-title *ngIf="!collapseAccount">
Kontoübersicht, Saldo: {{saldo?.saldo | number:'1.2-2'}} €
</mat-panel-title>
<mat-panel-description>
</mat-panel-description>
</mat-expansion-panel-header>
<app-account [selectedAccountId]="tenant.account" [shallBeRentPayment]="true"></app-account>
</mat-expansion-panel>
</mat-accordion>
</mat-card-content>
</mat-card>
</section>

1
ui/hv2-ui/src/app/tenant-details/tenant-details.component.ts
View File

@ -52,6 +52,7 @@ export class TenantDetailsComponent implements OnInit {
collapseTenantDetails: boolean = false
collapseTenancies: boolean = false
collapseTenancyMapping: boolean = false
collapseAccount: boolean = false
selectedTenancy: Tenancy = undefined
mappedFees: Fee[]

1
ui/hv2-ui/src/styles.css
View File

@ -10,7 +10,6 @@ body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
table {
width: 75%;
border-spacing: 20px;
}