DiunaBI/Frontend/src/app/modules/layers/layer-detail/layer-detail.component.html

<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>

          <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>

          <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>

          <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>