Moved from tslint to eslint as tslint was depreciated.

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.

overlord/src/app/employee-benefits/employee-benefits.component.html

@@ -6,86 +6,134 @@
     <form [formGroup]="form" fxLayout="column">
       <div fxLayout="row" fxLayout.lt-md="column" fxLayoutGap="20px" fxLayoutGap.lt-md="0px">
         <mat-form-field fxFlex>
-          <input matInput [matDatepicker]="date" (focus)="date.open()" placeholder="Date" formControlName="date"
-                 autocomplete="off">
+          <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>
       </div>
-      <div formGroupName="addRow" fxLayout="row" fxLayout.lt-md="column" fxLayoutGap="20px" fxLayoutGap.lt-md="0px">
+      <div
+        formGroupName="addRow"
+        fxLayout="row"
+        fxLayout.lt-md="column"
+        fxLayoutGap="20px"
+        fxLayoutGap.lt-md="0px"
+      >
         <mat-form-field fxFlex="60">
-          <input type="text" matInput #employeeElement placeholder="Employee" [matAutocomplete]="auto"
-                 formControlName="employee" autocomplete="off">
-          <mat-autocomplete #auto="matAutocomplete" autoActiveFirstOption [displayWith]="displayEmployeeName"
-                            (optionSelected)="employeeSelected($event)">
-            <mat-option *ngFor="let employee of employees | async" [value]="employee">{{employee.name}}</mat-option>
+          <input
+            type="text"
+            matInput
+            #employeeElement
+            placeholder="Employee"
+            [matAutocomplete]="auto"
+            formControlName="employee"
+            autocomplete="off"
+          />
+          <mat-autocomplete
+            #auto="matAutocomplete"
+            autoActiveFirstOption
+            [displayWith]="displayEmployeeName"
+            (optionSelected)="employeeSelected($event)"
+          >
+            <mat-option *ngFor="let employee of employees | async" [value]="employee">{{
+              employee.name
+            }}</mat-option>
           </mat-autocomplete>
         </mat-form-field>
         <mat-form-field fxFlex="15">
           <mat-label>Gross Salary</mat-label>
-          <input type="text" matInput placeholder="Gross Salary" formControlName="grossSalary" autocomplete="off">
+          <input
+            type="text"
+            matInput
+            placeholder="Gross Salary"
+            formControlName="grossSalary"
+            autocomplete="off"
+          />
         </mat-form-field>
         <mat-form-field fxFlex="15">
           <mat-label>Days Worked</mat-label>
-          <input type="text" matInput placeholder="Days Worked" formControlName="daysWorked" autocomplete="off">
+          <input
+            type="text"
+            matInput
+            placeholder="Days Worked"
+            formControlName="daysWorked"
+            autocomplete="off"
+          />
         </mat-form-field>
 
         <button mat-raised-button color="primary" (click)="addRow()" fxFlex="10">Add</button>
       </div>
       <mat-table #table [dataSource]="dataSource">
-
         <!-- Name Column -->
         <ng-container matColumnDef="name">
           <mat-header-cell *matHeaderCellDef>Name</mat-header-cell>
-          <mat-cell *matCellDef="let row">{{row.employee.name}}</mat-cell>
+          <mat-cell *matCellDef="let row">{{ row.employee.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.employee.designation}}</mat-cell>
+          <mat-cell *matCellDef="let row">{{ row.employee.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.employee.costCentre.name}}</mat-cell>
+          <mat-cell *matCellDef="let row">{{ row.employee.costCentre.name }}</mat-cell>
         </ng-container>
 
         <!-- GrossSalary Column -->
         <ng-container matColumnDef="grossSalary">
           <mat-header-cell *matHeaderCellDef class="right">GrossSalary</mat-header-cell>
-          <mat-cell *matCellDef="let row" class="right">{{row.grossSalary | currency:'INR'}}</mat-cell>
+          <mat-cell *matCellDef="let row" class="right">{{
+            row.grossSalary | currency: 'INR'
+          }}</mat-cell>
         </ng-container>
 
         <!-- DaysWorked Column -->
         <ng-container matColumnDef="daysWorked">
           <mat-header-cell *matHeaderCellDef class="right">DaysWorked</mat-header-cell>
-          <mat-cell *matCellDef="let row" class="right">{{row.daysWorked | number:'1.2-2'}}</mat-cell>
+          <mat-cell *matCellDef="let row" class="right">{{
+            row.daysWorked | number: '1.2-2'
+          }}</mat-cell>
         </ng-container>
 
         <!-- Esi Employee Column -->
         <ng-container matColumnDef="esiEmployee">
           <mat-header-cell *matHeaderCellDef class="right">Esi EE</mat-header-cell>
-          <mat-cell *matCellDef="let row" class="right">{{row.esiEmployee | currency:'INR'}}</mat-cell>
+          <mat-cell *matCellDef="let row" class="right">{{
+            row.esiEmployee | currency: 'INR'
+          }}</mat-cell>
         </ng-container>
 
         <!-- Pf Employee Column -->
         <ng-container matColumnDef="pfEmployee">
           <mat-header-cell *matHeaderCellDef class="right">Pf EE</mat-header-cell>
-          <mat-cell *matCellDef="let row" class="right">{{row.pfEmployee | currency:'INR'}}</mat-cell>
+          <mat-cell *matCellDef="let row" class="right">{{
+            row.pfEmployee | currency: 'INR'
+          }}</mat-cell>
         </ng-container>
 
         <!-- Esi Employer Column -->
         <ng-container matColumnDef="esiEmployer">
           <mat-header-cell *matHeaderCellDef class="right">Esi ER</mat-header-cell>
-          <mat-cell *matCellDef="let row" class="right">{{row.esiEmployer | currency:'INR'}}</mat-cell>
+          <mat-cell *matCellDef="let row" class="right">{{
+            row.esiEmployer | currency: 'INR'
+          }}</mat-cell>
         </ng-container>
 
         <!-- Pf Employer Column -->
         <ng-container matColumnDef="pfEmployer">
           <mat-header-cell *matHeaderCellDef class="right">Pf ER</mat-header-cell>
-          <mat-cell *matCellDef="let row" class="right">{{row.pfEmployer | currency:'INR'}}</mat-cell>
+          <mat-cell *matCellDef="let row" class="right">{{
+            row.pfEmployer | currency: 'INR'
+          }}</mat-cell>
         </ng-container>
 
         <!-- Action Column -->
@@ -98,27 +146,37 @@
           </mat-cell>
         </ng-container>
 
-
         <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
-        <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
+        <mat-row *matRowDef="let row; columns: displayedColumns"></mat-row>
       </mat-table>
     </form>
   </mat-card-content>
   <mat-card-actions>
     <button mat-raised-button color="primary" (click)="save()" [disabled]="!canSave()">
-      {{(voucher.id) ? 'Update' : 'Save'}}
+      {{ voucher.id ? 'Update' : 'Save' }}
     </button>
-    <button mat-raised-button (click)="post()" *ngIf="voucher.id"
-            [disabled]="voucher.posted || auth.user.perms.indexOf('post-vouchers') === -1">
-      {{(voucher.posted) ? 'Posted' : 'Post'}}
+    <button
+      mat-raised-button
+      (click)="post()"
+      *ngIf="voucher.id"
+      [disabled]="voucher.posted || auth.user.perms.indexOf('post-vouchers') === -1"
+    >
+      {{ voucher.posted ? 'Posted' : 'Post' }}
     </button>
-    <button mat-raised-button color="warn" (click)="confirmDelete()" *ngIf="voucher.id" [disabled]="!canSave()">
+    <button
+      mat-raised-button
+      color="warn"
+      (click)="confirmDelete()"
+      *ngIf="voucher.id"
+      [disabled]="!canSave()"
+    >
       Delete
     </button>
   </mat-card-actions>
   <mat-card-subtitle *ngIf="voucher.id">
-    Created on <strong>{{voucher.creationDate | localTime}}</strong> and
-    Last Edited on <strong>{{voucher.lastEditDate | localTime}}</strong>
-    by <strong>{{voucher.user.name}}</strong>. {{(voucher.poster) ? 'Posted by ' + voucher.poster : ''}}
+    Created on <strong>{{ voucher.creationDate | localTime }}</strong> and Last Edited on
+    <strong>{{ voucher.lastEditDate | localTime }}</strong> by
+    <strong>{{ voucher.user.name }}</strong
+    >. {{ voucher.poster ? 'Posted by ' + voucher.poster : '' }}
   </mat-card-subtitle>
 </mat-card>