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

<form [formGroup]="form" novalidate>
  <mat-card>
    <mat-card-header style="display: block;">
      <mat-card-title style="display:flex">
        Layer details
        <span style="flex: 1;"></span>
        <button mat-button (click)="export()">Export</button>
      </mat-card-title>
      <mat-card-subtitle>&nbsp;</mat-card-subtitle>
    </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" *ngIf="document">
            <mat-label>Created</mat-label>
            <input matInput disabled [value]="document.created">
          </mat-form-field>
        </div>
        <div class="col"></div>
      </div>

      <table mat-table [dataSource]="dataSource" matSort matSortActive="code" matSortDisableClear
        matSortDirection="desc">
        <ng-container matColumnDef="code">
          <th mat-header-cell *matHeaderCellDef mat-sort-header>Code</th>
          <td mat-cell *matCellDef="let row"> {{row.code}} </td>
          <td mat-footer-cell *matFooterCellDef><b>Value1 sum</b></td>
        </ng-container>

        <ng-container matColumnDef="value1">
          <th mat-header-cell *matHeaderCellDef mat-sort-header>Value1</th>
          <td mat-cell *matCellDef="let row"> {{row.value1 | number:'1.2-2'}} </td>
          <td mat-footer-cell *matFooterCellDef><b>{{valueSum | number:'1.2-2'}}</b></td>
        </ng-container>

        <tr mat-header-row *matHeaderRowDef="displayedColumns, sticky: true"></tr>
        <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
        <tr mat-footer-row *matFooterRowDef="displayedColumns"></tr>
      </table>
    </mat-card-content>
  </mat-card>
</form>