WIP: upgrade views

This commit is contained in:
Michał Zieliński
2023-08-22 11:38:18 +02:00
parent e8c64059fb
commit 8b109c4f1b
5 changed files with 82 additions and 99 deletions

View File

@@ -1,56 +1,60 @@
<div>
<form [formGroup]="form" novalidate>
<mat-card appearance="outlined">
<mat-toolbar color="secondary">
Layer details
<span class="fill-to-right"></span>
</mat-toolbar>
<mat-card-content>
<mat-grid-list cols="2" rowHeight="90px">
<mat-grid-tile>
<mat-form-field appearance="outline">
<mat-label>Name</mat-label>
<input matInput formControlName="name">
</mat-form-field>
</mat-grid-tile>
<form [formGroup]="form" novalidate *ngIf="document">
<mat-card>
<mat-card-header>
Layer details
</mat-card-header>
<mat-card-content>
<div class="row">
<div class="col">
<mat-form-field class="full-width" appearance="outline">
<mat-label>Name</mat-label>
<input matInput formControlName="name">
</mat-form-field>
</div>
<div class="col">
<mat-form-field class="full-width" appearance="outline">
<mat-label>Source</mat-label>
<input matInput formControlName="source">
</mat-form-field>
</div>
</div>
<div class="row">
<div class="col">
<mat-form-field class="full-width" appearance="outline">
<mat-label>Created</mat-label>
<input matInput disabled [value]="document.created">
</mat-form-field>
</div>
<div class="col"></div>
</div>
<mat-grid-tile>
<mat-form-field appearance="outline">
<mat-label>Source</mat-label>
<input matInput formControlName="source">
</mat-form-field>
</mat-grid-tile>
<mat-grid-tile *ngIf="document">
<mat-form-field appearance="outline">
<mat-label>Created</mat-label>
<input matInput disabled [value]="document.created">
</mat-form-field>
</mat-grid-tile>
</mat-grid-list>
<mat-table #table [dataSource]="dataSource" [trackBy]="trackByUid" matSort class="animate">
<ng-container matColumnDef="code">
<mat-header-cell *matHeaderCellDef mat-sort-header>Code</mat-header-cell>
<mat-cell *matCellDef="let item">{{item.code}}</mat-cell>
</ng-container>
<mat-table #table [dataSource]="dataSource" [trackBy]="trackByUid" matSort class="animate">
<ng-container matColumnDef="value">
<mat-header-cell *matHeaderCellDef mat-sort-header>Value</mat-header-cell>
<mat-cell *matCellDef="let item">{{item.value1 | number:'1.2-2'}}</mat-cell>
<!--
<td mat-footer-cell *matFooterCellDef>Checksum: {{valueSum}}</td>
-->
</ng-container>
<ng-container matColumnDef="code">
<mat-header-cell *matHeaderCellDef mat-sort-header>Code</mat-header-cell>
<mat-cell *matCellDef="let item">{{item.code}}</mat-cell>
</ng-container>
<ng-container matColumnDef="desc1">
<mat-header-cell *matHeaderCellDef mat-sort-header>Account</mat-header-cell>
<mat-cell *matCellDef="let item">{{item.desc1}}</mat-cell>
</ng-container>
<ng-container matColumnDef="value">
<mat-header-cell *matHeaderCellDef mat-sort-header>Value</mat-header-cell>
<mat-cell *matCellDef="let item">{{item.value | number:'1.2-2'}}</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let item; columns: displayedColumns;"></mat-row>
<!--
<tr mat-footer-row *matFooterRowDef="displayedColumns"></tr>
-->
</mat-table>
<ng-container matColumnDef="desc1">
<mat-header-cell *matHeaderCellDef mat-sort-header>Account</mat-header-cell>
<mat-cell *matCellDef="let item">{{item.desc1}}</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let item; columns: displayedColumns;"></mat-row>
</mat-table>
Checksum: {{valueSum}}
</mat-card-content>
</mat-card>
</form>
</div>
</mat-card-content>
</mat-card>
</form>