Files
hv2-all-in-one/ui/hv2-ui/src/app/flat-details/flat-details.component.html
2021-09-10 11:59:08 +02:00

85 lines
4.1 KiB
HTML

<section class="mat-typography">
<mat-card class="defaultCard">
<mat-card-header>
<mat-card-title>
{{flat?.description}} {{flat?.flat_no}} {{premise?.description}}
</mat-card-title>
<mat-card-subtitle>
ID: {{flat?.id}}
</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
<div>
<form (ngSubmit)="saveFlat()">
<div>
<mat-form-field appearance="outline">
<mat-label>Beschreibung</mat-label>
<input matInput name="description" [(ngModel)]="flat.description"/>
</mat-form-field>
<mat-form-field appearance="outline">
<mat-label>Haus</mat-label>
<mat-select [(ngModel)]="flat.premise" name="premise">
<mat-option *ngFor="let p of premises" [value]="p.id">{{p.description}}</mat-option>
</mat-select>
</mat-form-field>
</div><div>
<mat-form-field appearance="outline">
<mat-label>Fläche</mat-label>
<input type="number" matInput name="area" [(ngModel)]="flat.area"/>
</mat-form-field>
<mat-form-field appearance="outline">
<mat-label>Wohnungsnummer</mat-label>
<input type="number" matInput name="flat_no" [(ngModel)]="flat.flat_no"/>
</mat-form-field>
</div>
<button #submitButton type="submit" mat-raised-button color="primary">Speichern</button>
</form>
</div>
</mat-card-content>
</mat-card>
<mat-card class="defaultCard">
<mat-card-header>
<mat-card-title>
Betriebskostenzuordnungen
</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="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;"></tr>
</table>
</div>
<div>
<form (ngSubmit)="addOverheadAdvance()">
<mat-form-field appearance="standard" id="addoverheadfield">
<mat-label>Betriebskostensatz</mat-label>
<mat-select #mapSelect [(ngModel)]="selectedOverheadAdvance" name="overheadadvance">
<mat-option *ngFor="let p of allOverheadAdvances" [value]="p.id">{{p.description}} {{p.startdate}}</mat-option>
</mat-select>
</mat-form-field>
<button #mapButton type="submit" mat-raised-button color="primary">Zuordnen</button>
</form>
</div>
</mat-card-content>
</mat-card>
</section>