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.
94 lines
3.5 KiB
HTML
94 lines
3.5 KiB
HTML
<mat-card>
|
|
<mat-card-title-group>
|
|
<mat-card-title>Attendance</mat-card-title>
|
|
</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">
|
|
<mat-form-field fxFlex="80">
|
|
<input
|
|
matInput
|
|
[matDatepicker]="date"
|
|
(focus)="date.open()"
|
|
placeholder="Date"
|
|
formControlName="date"
|
|
autocomplete="off"
|
|
/>
|
|
<mat-datepicker-toggle matSuffix [for]="date"></mat-datepicker-toggle>
|
|
<mat-datepicker #date></mat-datepicker>
|
|
</mat-form-field>
|
|
<button mat-raised-button color="primary" (click)="show()" fxFlex="20">Show</button>
|
|
</div>
|
|
<mat-table #table [dataSource]="dataSource" formArrayName="attendances">
|
|
<!-- Code Column -->
|
|
<ng-container matColumnDef="code">
|
|
<mat-header-cell *matHeaderCellDef class="right">Code</mat-header-cell>
|
|
<mat-cell *matCellDef="let row" class="right">{{ row.code }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Name Column -->
|
|
<ng-container matColumnDef="name">
|
|
<mat-header-cell *matHeaderCellDef>Name</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.name }}</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>
|
|
|
|
<!-- Department Column -->
|
|
<ng-container matColumnDef="department">
|
|
<mat-header-cell *matHeaderCellDef>Department</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.department }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Status Column -->
|
|
<ng-container matColumnDef="status">
|
|
<mat-header-cell *matHeaderCellDef>Status</mat-header-cell>
|
|
<mat-cell *matCellDef="let row; let i = index" [formGroupName]="i" fxFlex>
|
|
<mat-select formControlName="attendanceType" name="attendanceType">
|
|
<mat-option *ngFor="let at of attendanceTypes" [value]="at.id">
|
|
{{ at.name }}
|
|
</mat-option>
|
|
</mat-select>
|
|
</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Prints Column -->
|
|
<ng-container matColumnDef="prints">
|
|
<mat-header-cell *matHeaderCellDef>Prints</mat-header-cell>
|
|
<mat-cell *matCellDef="let row; let i = index" class="no-bg">
|
|
{{ row.prints }}
|
|
<mat-icon *ngIf="!form.controls.attendances.controls[i].pristine"
|
|
>new_releases</mat-icon
|
|
>
|
|
<mat-chip-list class="no-bg">
|
|
<mat-chip
|
|
*ngIf="row.hoursWorked.length"
|
|
class="no-bg"
|
|
[selected]="true"
|
|
[color]="row.fullDay === true ? 'primary' : 'warn'"
|
|
>
|
|
{{ row.hoursWorked }}
|
|
</mat-chip>
|
|
</mat-chip-list>
|
|
</mat-cell>
|
|
</ng-container>
|
|
|
|
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
|
|
<mat-row
|
|
*matRowDef="let row; let i = index; columns: displayedColumns"
|
|
[class]="getClass(i)"
|
|
></mat-row>
|
|
</mat-table>
|
|
</form>
|
|
</mat-card-content>
|
|
<mat-card-actions>
|
|
<button mat-raised-button color="primary" (click)="save()" [disabled]="form.pristine">
|
|
Save
|
|
</button>
|
|
</mat-card-actions>
|
|
</mat-card>
|