Feaure: Showing Hours worked with styling in attendances.
This commit is contained in:
tanshu
parent
927c693a6f
commit
7376779f3a
|
|
@ -8,46 +8,46 @@
|
|||
justify-content: center;
|
||||
}
|
||||
|
||||
.present {
|
||||
background-color: #228B22;
|
||||
.present :not(.no-bg){
|
||||
background-color: #228B22;
|
||||
}
|
||||
|
||||
.off-day {
|
||||
background-color: #87CEFA;
|
||||
.off-day :not(.no-bg){
|
||||
background-color: #87CEFA;
|
||||
}
|
||||
|
||||
.on-leave {
|
||||
background-color: #CD5C5C;
|
||||
.on-leave :not(.no-bg){
|
||||
background-color: #CD5C5C;
|
||||
}
|
||||
|
||||
.absent {
|
||||
background-color: #CD0000;
|
||||
.absent :not(.no-bg){
|
||||
background-color: #CD0000;
|
||||
}
|
||||
|
||||
.half-day {
|
||||
background-color: #98FB98;
|
||||
.half-day :not(.no-bg){
|
||||
background-color: #98FB98;
|
||||
}
|
||||
|
||||
.double-duty {
|
||||
background-color: #006400;
|
||||
.double-duty :not(.no-bg){
|
||||
background-color: #006400;
|
||||
}
|
||||
|
||||
.paid-leave-availed {
|
||||
background-color: #EEEE00;
|
||||
.paid-leave-availed :not(.no-bg){
|
||||
background-color: #EEEE00;
|
||||
}
|
||||
|
||||
.casual-leave-availed {
|
||||
background-color: #800080;
|
||||
.casual-leave-availed :not(.no-bg){
|
||||
background-color: #800080;
|
||||
}
|
||||
|
||||
.compensatory-off {
|
||||
background-color: #F5DEB3;
|
||||
.compensatory-off :not(.no-bg){
|
||||
background-color: #F5DEB3;
|
||||
}
|
||||
|
||||
.half-day-pl {
|
||||
background-color: #FFF68F;
|
||||
.half-day-pl :not(.no-bg){
|
||||
background-color: #FFF68F;
|
||||
}
|
||||
|
||||
.half-day-cl {
|
||||
background-color: #FF00FF;
|
||||
.half-day-cl :not(.no-bg){
|
||||
background-color: #FF00FF;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
|
|
|
|||
|
|
@ -8,46 +8,46 @@
|
|||
justify-content: center;
|
||||
}
|
||||
|
||||
.present {
|
||||
background-color: #228B22;
|
||||
.present :not(.no-bg){
|
||||
background-color: #228B22;
|
||||
}
|
||||
|
||||
.off-day {
|
||||
background-color: #87CEFA;
|
||||
.off-day :not(.no-bg){
|
||||
background-color: #87CEFA;
|
||||
}
|
||||
|
||||
.on-leave {
|
||||
background-color: #CD5C5C;
|
||||
.on-leave :not(.no-bg){
|
||||
background-color: #CD5C5C;
|
||||
}
|
||||
|
||||
.absent {
|
||||
background-color: #CD0000;
|
||||
.absent :not(.no-bg){
|
||||
background-color: #CD0000;
|
||||
}
|
||||
|
||||
.half-day {
|
||||
background-color: #98FB98;
|
||||
.half-day :not(.no-bg){
|
||||
background-color: #98FB98;
|
||||
}
|
||||
|
||||
.double-duty {
|
||||
background-color: #006400;
|
||||
.double-duty :not(.no-bg){
|
||||
background-color: #006400;
|
||||
}
|
||||
|
||||
.paid-leave-availed {
|
||||
background-color: #EEEE00;
|
||||
.paid-leave-availed :not(.no-bg){
|
||||
background-color: #EEEE00;
|
||||
}
|
||||
|
||||
.casual-leave-availed {
|
||||
background-color: #800080;
|
||||
.casual-leave-availed :not(.no-bg){
|
||||
background-color: #800080;
|
||||
}
|
||||
|
||||
.compensatory-off {
|
||||
background-color: #F5DEB3;
|
||||
.compensatory-off :not(.no-bg){
|
||||
background-color: #F5DEB3;
|
||||
}
|
||||
|
||||
.half-day-pl {
|
||||
background-color: #FFF68F;
|
||||
.half-day-pl :not(.no-bg){
|
||||
background-color: #FFF68F;
|
||||
}
|
||||
|
||||
.half-day-cl {
|
||||
background-color: #FF00FF;
|
||||
.half-day-cl :not(.no-bg){
|
||||
background-color: #FF00FF;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
|
|
|
|||
Loading…
Reference in New Issue