tanshu
1350870f9e
Added prettier and also prettied all the typescript files using prettier ESLint is using the AirBnB rules which are the most strict to lint the files.
80 lines
2.6 KiB
HTML
80 lines
2.6 KiB
HTML
<mat-card>
|
|
<mat-card-title-group>
|
|
<mat-card-title>Accounts</mat-card-title>
|
|
<a mat-button [routerLink]="['/accounts', '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">
|
|
<!-- Name Column -->
|
|
<ng-container matColumnDef="name">
|
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Name</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">
|
|
<a [routerLink]="['/accounts', row.id]">
|
|
<mat-icon matSuffix *ngIf="row.isStarred" class="gold">star </mat-icon>
|
|
{{ row.name }}
|
|
</a>
|
|
</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Type Column -->
|
|
<ng-container matColumnDef="type">
|
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Type</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.type }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Is Active? Column -->
|
|
<ng-container matColumnDef="isActive">
|
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Is Active?</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.isActive }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Is Reconcilable? Column -->
|
|
<ng-container matColumnDef="isReconcilable">
|
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Is Reconcilable?</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.isReconcilable }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Cost Centre Column -->
|
|
<ng-container matColumnDef="costCentre">
|
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Cost Centre</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.costCentre }}</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>
|