tanshu
4c4c1b994e
This is due to enabling strict mode in Typescript and changing the list department from string to object. But the html was not updated.
101 lines
3.5 KiB
HTML
101 lines
3.5 KiB
HTML
<mat-card>
|
|
<mat-card-title-group>
|
|
<mat-card-title>Employees</mat-card-title>
|
|
<button mat-button mat-icon-button *ngIf="dataSource.data.length" (click)="exportCsv()">
|
|
<mat-icon>save_alt</mat-icon>
|
|
</button>
|
|
<a mat-button [routerLink]="['/employees', 'new']">
|
|
<mat-icon>add_box</mat-icon>
|
|
Add
|
|
</a>
|
|
</mat-card-title-group>
|
|
<mat-card-content>
|
|
<form [formGroup]="form" fxLayout="column">
|
|
<div
|
|
fxLayout="row"
|
|
fxLayout.lt-md="column"
|
|
fxLayoutGap="20px"
|
|
fxLayoutGap.lt-md="0px"
|
|
fxLayoutAlign="space-around start"
|
|
>
|
|
<mat-form-field fxFlex>
|
|
<input
|
|
type="text"
|
|
matInput
|
|
#filterElement
|
|
placeholder="Filter"
|
|
formControlName="filter"
|
|
autocomplete="off"
|
|
/>
|
|
</mat-form-field>
|
|
</div>
|
|
</form>
|
|
<mat-table #table [dataSource]="dataSource" matSort aria-label="Elements">
|
|
<!-- Code Column -->
|
|
<ng-container matColumnDef="code">
|
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Code</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.code }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Name Column -->
|
|
<ng-container matColumnDef="name">
|
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Name</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">
|
|
<a [routerLink]="['/employees', row.id]">
|
|
<mat-icon matSuffix *ngIf="row.isStarred" class="gold">star </mat-icon>
|
|
{{ row.name }}
|
|
</a>
|
|
</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Designation Column -->
|
|
<ng-container matColumnDef="designation">
|
|
<mat-header-cell *matHeaderCellDef>Designation</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.designation }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Salary Column -->
|
|
<ng-container matColumnDef="salary">
|
|
<mat-header-cell *matHeaderCellDef class="right">Salary</mat-header-cell>
|
|
<mat-cell *matCellDef="let row" class="right">{{ row.salary | currency: 'INR' }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Points Column -->
|
|
<ng-container matColumnDef="points">
|
|
<mat-header-cell *matHeaderCellDef class="right">Points</mat-header-cell>
|
|
<mat-cell *matCellDef="let row" class="right">{{ row.points | number: '1.2-2' }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Department Column -->
|
|
<ng-container matColumnDef="department">
|
|
<mat-header-cell *matHeaderCellDef>Department</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.costCentre.name }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- JoiningDate Column -->
|
|
<ng-container matColumnDef="joiningDate">
|
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Joining On</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.joiningDate }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- LeavingDate Column -->
|
|
<ng-container matColumnDef="leavingDate">
|
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Left On</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.leavingDate }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
|
|
<mat-row *matRowDef="let row; columns: displayedColumns"></mat-row>
|
|
</mat-table>
|
|
|
|
<mat-paginator
|
|
#paginator
|
|
[length]="dataSource.data.length"
|
|
[pageIndex]="0"
|
|
[pageSize]="50"
|
|
[pageSizeOptions]="[25, 50, 100, 250]"
|
|
>
|
|
</mat-paginator>
|
|
</mat-card-content>
|
|
</mat-card>
|