fee pages
This commit is contained in:
parent
356c8c0bbd
commit
cf35af9c1e
@ -15,6 +15,8 @@ import { ParkingDetailsComponent } from './parking-details/parking-details.compo
|
||||
import { CommercialUnitDetailsComponent } from './commercial-unit-details/commercial-unit-details.component';
|
||||
import { OverheadAdvanceListComponent } from './overhead-advance-list/overhead-advance-list.component';
|
||||
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';
|
||||
|
||||
|
||||
const routes: Routes = [
|
||||
@ -36,6 +38,9 @@ const routes: Routes = [
|
||||
{ path: 'overheadadvances', component: OverheadAdvanceListComponent, canActivate: [ AuthGuardService ] },
|
||||
{ path: 'overheadadvance/:id', component: OverheadAdvanceDetailsComponent, canActivate: [ AuthGuardService ] },
|
||||
{ path: 'overheadadvance', component: OverheadAdvanceDetailsComponent, canActivate: [ AuthGuardService ] },
|
||||
{ path: 'fees', component: FeeListComponent, canActivate: [ AuthGuardService ] },
|
||||
{ path: 'fee/:id', component: FeeDetailsComponent, canActivate: [ AuthGuardService ] },
|
||||
{ path: 'fee', component: FeeDetailsComponent, canActivate: [ AuthGuardService ] },
|
||||
{ path: 'logout', component: LogoutComponent },
|
||||
{ path: 'login', component: LoginComponent }
|
||||
]
|
||||
|
@ -38,6 +38,8 @@ import { OverheadAdvanceListComponent } from './overhead-advance-list/overhead-a
|
||||
import { OverheadAdvanceDetailsComponent } from './overhead-advance-details/overhead-advance-details.component'
|
||||
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';
|
||||
|
||||
|
||||
@NgModule({
|
||||
@ -59,7 +61,9 @@ import { MatNativeDateModule } from '@angular/material/core';
|
||||
ParkingDetailsComponent,
|
||||
CommercialUnitDetailsComponent,
|
||||
OverheadAdvanceListComponent,
|
||||
OverheadAdvanceDetailsComponent
|
||||
OverheadAdvanceDetailsComponent,
|
||||
FeeListComponent,
|
||||
FeeDetailsComponent
|
||||
],
|
||||
imports: [
|
||||
BrowserModule,
|
||||
|
49
ui/hv2-ui/src/app/fee-details/fee-details.component.html
Normal file
49
ui/hv2-ui/src/app/fee-details/fee-details.component.html
Normal file
@ -0,0 +1,49 @@
|
||||
<section class="mat-typography">
|
||||
<mat-card class="defaultCard">
|
||||
<mat-card-header>
|
||||
<mat-card-title>
|
||||
{{fee?.description}}
|
||||
</mat-card-title>
|
||||
<mat-card-subtitle>
|
||||
ID: {{fee?.id}}
|
||||
</mat-card-subtitle>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div>
|
||||
<form (ngSubmit)="saveFee()">
|
||||
<div>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Beschreibung</mat-label>
|
||||
<input matInput name="description" [(ngModel)]="fee.description"/>
|
||||
</mat-form-field>
|
||||
</div><div>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Betrag (€)</mat-label>
|
||||
<input matInput type="number" name="amount" [(ngModel)]="fee.amount" [readonly]="readonly"/>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Typ</mat-label>
|
||||
<mat-select [(ngModel)]="fee.fee_type" name="fee_type">
|
||||
<mat-option *ngFor="let p of fee_types" [value]="p">{{p}}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div><div>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Beginn</mat-label>
|
||||
<input matInput name="startdate" [(ngModel)]="fee.startdate" [matDatepicker]="startdatepicker" [readonly]="readonly"/>
|
||||
<mat-datepicker-toggle matSuffix [for]="startdatepicker" [disabled]="readonly"></mat-datepicker-toggle>
|
||||
<mat-datepicker #startdatepicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Ende</mat-label>
|
||||
<input matInput name="enddate" [(ngModel)]="fee.enddate" [matDatepicker]="enddatepicker"/>
|
||||
<mat-datepicker-toggle matSuffix [for]="enddatepicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #enddatepicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<button #submitButton type="submit" mat-raised-button color="primary">Speichern</button>
|
||||
</form>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</section>
|
25
ui/hv2-ui/src/app/fee-details/fee-details.component.spec.ts
Normal file
25
ui/hv2-ui/src/app/fee-details/fee-details.component.spec.ts
Normal file
@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { FeeDetailsComponent } from './fee-details.component';
|
||||
|
||||
describe('FeeDetailsComponent', () => {
|
||||
let component: FeeDetailsComponent;
|
||||
let fixture: ComponentFixture<FeeDetailsComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ FeeDetailsComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(FeeDetailsComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
73
ui/hv2-ui/src/app/fee-details/fee-details.component.ts
Normal file
73
ui/hv2-ui/src/app/fee-details/fee-details.component.ts
Normal file
@ -0,0 +1,73 @@
|
||||
import { Component, OnInit, ViewChild } from '@angular/core';
|
||||
import { MatButton } from '@angular/material/button';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { FeeService } from '../data-object-service';
|
||||
import { NULL_Fee, Fee } from '../data-objects';
|
||||
import { MessageService } from '../message.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-fee-details',
|
||||
templateUrl: './fee-details.component.html',
|
||||
styleUrls: ['./fee-details.component.css']
|
||||
})
|
||||
export class FeeDetailsComponent implements OnInit {
|
||||
|
||||
@ViewChild('submitButton') submitButton: MatButton
|
||||
|
||||
fee: Fee = NULL_Fee
|
||||
fee_types: string[] = [ "total", "per_area" ]
|
||||
readonly: boolean
|
||||
|
||||
constructor(
|
||||
private feeService: FeeService,
|
||||
private messageService: MessageService,
|
||||
private route: ActivatedRoute,
|
||||
private router: Router
|
||||
) { }
|
||||
|
||||
async getFee(): Promise<void> {
|
||||
try {
|
||||
const id = +this.route.snapshot.paramMap.get('id')
|
||||
this.readonly = false
|
||||
if (id != 0) {
|
||||
this.fee = await this.feeService.getFee(id)
|
||||
this.readonly = true
|
||||
}
|
||||
this.messageService.add(`Fee is ${ JSON.stringify(this.fee, undefined, 4)}`)
|
||||
} catch (err) {
|
||||
this.messageService.add(`Error in getFee: ${ JSON.stringify(err, undefined, 4) }`)
|
||||
}
|
||||
}
|
||||
|
||||
async saveFee() {
|
||||
try {
|
||||
this.submitButton.disabled = true
|
||||
this.messageService.add("saveFee")
|
||||
this.messageService.add(JSON.stringify(this.fee, undefined, 4))
|
||||
if (this.fee.enddate == null) {
|
||||
this.fee.enddate = ''
|
||||
}
|
||||
if (this.fee.startdate == null) {
|
||||
this.fee.startdate = ''
|
||||
}
|
||||
if (this.fee.id == 0) {
|
||||
this.messageService.add("about to insert new fee")
|
||||
this.fee = await this.feeService.postFee(this.fee)
|
||||
this.messageService.add(`Successfully added fee with id ${this.fee.id}`)
|
||||
} else {
|
||||
this.messageService.add("about to update existing fee")
|
||||
this.fee = await this.feeService.putFee(this.fee)
|
||||
this.messageService.add(`Successfully changed fee with id ${this.fee.id}`)
|
||||
}
|
||||
this.router.navigate(['/fees'])
|
||||
} finally {
|
||||
this.submitButton.disabled = false
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
ngOnInit(): void {
|
||||
this.getFee()
|
||||
}
|
||||
|
||||
}
|
8
ui/hv2-ui/src/app/fee-list/fee-list.component.css
Normal file
8
ui/hv2-ui/src/app/fee-list/fee-list.component.css
Normal file
@ -0,0 +1,8 @@
|
||||
table {
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
.spacer {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
39
ui/hv2-ui/src/app/fee-list/fee-list.component.html
Normal file
39
ui/hv2-ui/src/app/fee-list/fee-list.component.html
Normal file
@ -0,0 +1,39 @@
|
||||
<section class="mat-typography">
|
||||
<mat-card class="defaultCard">
|
||||
<mat-card-header>
|
||||
<mat-card-title>
|
||||
<span>Mietsätze</span>
|
||||
<span class="spacer"></span>
|
||||
<a mat-button routerLink="/fee">Neu anlegen</a>
|
||||
</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<div>
|
||||
<table mat-table [dataSource]="dataSource" #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="fee_type">
|
||||
<th mat-header-cell *matHeaderCellDef>Typ</th>
|
||||
<td mat-cell *matCellDef="let element">{{element.fee_type}}</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="startdate">
|
||||
<th mat-header-cell *matHeaderCellDef>Beginn</th>
|
||||
<td mat-cell *matCellDef="let element">{{element.startdate}}</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="enddate">
|
||||
<th mat-header-cell *matHeaderCellDef>Ende</th>
|
||||
<td mat-cell *matCellDef="let element">{{element.enddate}}</td>
|
||||
</ng-container>
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="['/fee/', row.id]"></tr>
|
||||
</table>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</section>
|
25
ui/hv2-ui/src/app/fee-list/fee-list.component.spec.ts
Normal file
25
ui/hv2-ui/src/app/fee-list/fee-list.component.spec.ts
Normal file
@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { FeeListComponent } from './fee-list.component';
|
||||
|
||||
describe('FeeListComponent', () => {
|
||||
let component: FeeListComponent;
|
||||
let fixture: ComponentFixture<FeeListComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ FeeListComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(FeeListComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
42
ui/hv2-ui/src/app/fee-list/fee-list.component.ts
Normal file
42
ui/hv2-ui/src/app/fee-list/fee-list.component.ts
Normal file
@ -0,0 +1,42 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { MatTableDataSource } from '@angular/material/table';
|
||||
import { FeeService } from '../data-object-service';
|
||||
import { Fee } from '../data-objects';
|
||||
import { MessageService } from '../message.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-fee-list',
|
||||
templateUrl: './fee-list.component.html',
|
||||
styleUrls: ['./fee-list.component.css']
|
||||
})
|
||||
export class FeeListComponent implements OnInit {
|
||||
|
||||
fees: Fee[]
|
||||
dataSource: MatTableDataSource<Fee>
|
||||
displayedColumns: string[] = [ "description", "amount", "fee_type", "startdate", "enddate" ]
|
||||
|
||||
|
||||
|
||||
constructor(
|
||||
private feeService: FeeService,
|
||||
private messageService: MessageService
|
||||
) { }
|
||||
|
||||
async getFees(): Promise<void> {
|
||||
try {
|
||||
this.messageService.add("Trying to load fees")
|
||||
this.fees = await this.feeService.getFees()
|
||||
this.messageService.add("Fees loaded")
|
||||
|
||||
this.dataSource = new MatTableDataSource<Fee>(this.fees)
|
||||
} catch (err) {
|
||||
this.messageService.add(`Error in getFees: ${ JSON.stringify(err, undefined, 4) }`)
|
||||
}
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.messageService.add("FeeListComponent.ngOnInit")
|
||||
this.getFees()
|
||||
}
|
||||
|
||||
}
|
@ -12,6 +12,7 @@
|
||||
<a mat-list-item href="/commercialunits">Meine Büros</a>
|
||||
</mat-nav-list><hr/><mat-nav-list>
|
||||
<a mat-list-item href="/overheadadvances">Betriebskostensätze</a>
|
||||
<a mat-list-item href="/fees">Mietsätze</a>
|
||||
</mat-nav-list><hr/><mat-nav-list>
|
||||
<a mat-list-item href="/premises">Meine Häuser</a>
|
||||
</mat-nav-list>
|
||||
|
@ -19,18 +19,20 @@
|
||||
</div><div>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Betrag (€)</mat-label>
|
||||
<input matInput type="number" name="amount" [(ngModel)]="overheadAdvance.amount"/>
|
||||
<input matInput type="number" name="amount" [(ngModel)]="overheadAdvance.amount" [readonly]="readonly"/>
|
||||
</mat-form-field>
|
||||
</div><div>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Beginn</mat-label>
|
||||
<input matInput name="startdate" [(ngModel)]="overheadAdvance.startdate" [matDatepicker]="startdatepicker"/>
|
||||
<mat-datepicker-toggle matSuffix [for]="startdatepicker"></mat-datepicker-toggle>
|
||||
<input matInput name="startdate" [(ngModel)]="overheadAdvance.startdate" [matDatepicker]="startdatepicker" [readonly]="readonly"/>
|
||||
<mat-datepicker-toggle matSuffix [for]="startdatepicker" [disabled]="readonly"></mat-datepicker-toggle>
|
||||
<mat-datepicker #startdatepicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Ende</mat-label>
|
||||
<input matInput name="enddate" [(ngModel)]="overheadAdvance.enddate"/>
|
||||
<input matInput name="enddate" [(ngModel)]="overheadAdvance.enddate" [matDatepicker]="enddatepicker"/>
|
||||
<mat-datepicker-toggle matSuffix [for]="enddatepicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #enddatepicker></mat-datepicker>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<button #submitButton type="submit" mat-raised-button color="primary">Speichern</button>
|
||||
|
@ -15,6 +15,7 @@ export class OverheadAdvanceDetailsComponent implements OnInit {
|
||||
@ViewChild('submitButton') submitButton: MatButton
|
||||
|
||||
overheadAdvance: OverheadAdvance = NULL_OverheadAdvance
|
||||
readonly: boolean
|
||||
|
||||
constructor(
|
||||
private overheadAdvanceService: OverheadAdvanceService,
|
||||
@ -26,8 +27,10 @@ export class OverheadAdvanceDetailsComponent implements OnInit {
|
||||
async getOverheadAdvance(): Promise<void> {
|
||||
try {
|
||||
const id = +this.route.snapshot.paramMap.get('id')
|
||||
this.readonly = false
|
||||
if (id != 0) {
|
||||
this.overheadAdvance = await this.overheadAdvanceService.getOverheadAdvance(id)
|
||||
this.readonly = true
|
||||
}
|
||||
} catch (err) {
|
||||
this.messageService.add(JSON.stringify(err, undefined, 4))
|
||||
@ -39,6 +42,12 @@ export class OverheadAdvanceDetailsComponent implements OnInit {
|
||||
this.submitButton.disabled = true
|
||||
this.messageService.add("saveOverheadAdvance")
|
||||
this.messageService.add(JSON.stringify(this.overheadAdvance, undefined, 4))
|
||||
if (this.overheadAdvance.enddate == null) {
|
||||
this.overheadAdvance.enddate = ''
|
||||
}
|
||||
if (this.overheadAdvance.startdate == null) {
|
||||
this.overheadAdvance.startdate = ''
|
||||
}
|
||||
if (this.overheadAdvance.id == 0) {
|
||||
this.messageService.add("about to insert new overheadAdvance")
|
||||
this.overheadAdvance = await this.overheadAdvanceService.postOverheadAdvance(this.overheadAdvance)
|
||||
@ -56,6 +65,7 @@ export class OverheadAdvanceDetailsComponent implements OnInit {
|
||||
|
||||
|
||||
ngOnInit(): void {
|
||||
this.getOverheadAdvance()
|
||||
}
|
||||
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user