Feaure: Showing Hours worked with styling in attendances.

This commit is contained in:
tanshu 2018-06-13 15:23:20 +05:30
parent 927c693a6f
commit 7376779f3a
6 changed files with 62 additions and 46 deletions

View File

@ -8,46 +8,46 @@
justify-content: center;
}
.present {
.present :not(.no-bg){
background-color: #228B22;
}
.off-day {
.off-day :not(.no-bg){
background-color: #87CEFA;
}
.on-leave {
.on-leave :not(.no-bg){
background-color: #CD5C5C;
}
.absent {
.absent :not(.no-bg){
background-color: #CD0000;
}
.half-day {
.half-day :not(.no-bg){
background-color: #98FB98;
}
.double-duty {
.double-duty :not(.no-bg){
background-color: #006400;
}
.paid-leave-availed {
.paid-leave-availed :not(.no-bg){
background-color: #EEEE00;
}
.casual-leave-availed {
.casual-leave-availed :not(.no-bg){
background-color: #800080;
}
.compensatory-off {
.compensatory-off :not(.no-bg){
background-color: #F5DEB3;
}
.half-day-pl {
.half-day-pl :not(.no-bg){
background-color: #FFF68F;
}
.half-day-cl {
.half-day-cl :not(.no-bg){
background-color: #FF00FF;
}

View File

@ -54,9 +54,15 @@
<!-- Prints Column -->
<ng-container matColumnDef="prints">
<mat-header-cell *matHeaderCellDef>Prints</mat-header-cell>
<mat-cell *matCellDef="let row; let i = index">
<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.hours.length" class="no-bg" [selected]="row.worked !== 'Error'"
[color]="row.worked === true ? 'primary' : 'warn'">
{{row.hours}}
</mat-chip>
</mat-chip-list>
</mat-cell>
</ng-container>

View File

@ -8,6 +8,7 @@ import {
MatButtonModule,
MatCardModule,
MatCheckboxModule,
MatChipsModule,
MatDatepickerModule,
MatDialogModule,
MatFormFieldModule,
@ -52,6 +53,7 @@ export const MY_FORMATS = {
MatButtonModule,
MatCardModule,
MatCheckboxModule,
MatChipsModule,
MatDatepickerModule,
MatDialogModule,
MatFormFieldModule,

View File

@ -8,46 +8,46 @@
justify-content: center;
}
.present {
.present :not(.no-bg){
background-color: #228B22;
}
.off-day {
.off-day :not(.no-bg){
background-color: #87CEFA;
}
.on-leave {
.on-leave :not(.no-bg){
background-color: #CD5C5C;
}
.absent {
.absent :not(.no-bg){
background-color: #CD0000;
}
.half-day {
.half-day :not(.no-bg){
background-color: #98FB98;
}
.double-duty {
.double-duty :not(.no-bg){
background-color: #006400;
}
.paid-leave-availed {
.paid-leave-availed :not(.no-bg){
background-color: #EEEE00;
}
.casual-leave-availed {
.casual-leave-availed :not(.no-bg){
background-color: #800080;
}
.compensatory-off {
.compensatory-off :not(.no-bg){
background-color: #F5DEB3;
}
.half-day-pl {
.half-day-pl :not(.no-bg){
background-color: #FFF68F;
}
.half-day-cl {
.half-day-cl :not(.no-bg){
background-color: #FF00FF;
}

View File

@ -54,9 +54,15 @@
<!-- Prints Column -->
<ng-container matColumnDef="prints">
<mat-header-cell *matHeaderCellDef>Prints</mat-header-cell>
<mat-cell *matCellDef="let row; let i = index">
<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.hours.length" class="no-bg" [selected]="row.worked !== 'Error'"
[color]="row.worked === true ? 'primary' : 'warn'">
{{row.hours}}
</mat-chip>
</mat-chip-list>
</mat-cell>
</ng-container>

View File

@ -8,6 +8,7 @@ import {
MatButtonModule,
MatCardModule,
MatCheckboxModule,
MatChipsModule,
MatDatepickerModule,
MatDialogModule,
MatFormFieldModule,
@ -52,6 +53,7 @@ export const MY_FORMATS = {
MatButtonModule,
MatCardModule,
MatCheckboxModule,
MatChipsModule,
MatDatepickerModule,
MatDialogModule,
MatFormFieldModule,