feat:Unificaction of radhathakare's PR (#1879)

* feat:Clients Translate Module

* feat: Collections Translate Module

* feat:Loan Translate Module

* feat:Search Translate Module

* feat English Json File

---------

Co-authored-by: radhathakare <radhathakare322@gmail.com>

src/app/clients/clients-view/family-members-tab/add-family-member/add-family-member.component.html

@@ -5,68 +5,68 @@
     <div fxLayout="row wrap" fxLayout.lt-md="column" fxLayoutAlign="start center">
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>First Name</mat-label>
+        <mat-label>{{"labels.inputs.First Name" |translate}}</mat-label>
         <input formControlName="firstName" required matInput />
         <mat-error *ngIf="addFamilyMemberForm.controls.firstName.hasError('required')">
-          First Name is <strong>required</strong>
+          {{"labels.inputs.First Name" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Middle Name</mat-label>
+        <mat-label>{{"labels.inputs.Middle Name" |translate}}</mat-label>
         <input formControlName="middleName" matInput />
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Last Name</mat-label>
+        <mat-label>{{"labels.inputs.Last Name" |translate}}</mat-label>
         <input formControlName="lastName" required matInput />
         <mat-error *ngIf="addFamilyMemberForm.controls.lastName.hasError('required')">
-          Last Name is <strong>required</strong>
+          {{"labels.inputs.Last Name" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Qualification</mat-label>
+        <mat-label>{{"labels.inputs.Qualification" |translate}}</mat-label>
         <input formControlName="qualification" matInput />
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Age</mat-label>
+        <mat-label>{{"labels.inputs.Age" |translate}}</mat-label>
         <input type="number" formControlName="age" required matInput [min]="minAge" />
         <mat-error *ngIf="addFamilyMemberForm.controls.age.hasError('required')">
-          Age is <strong>required and cannot be negative</strong>
+          {{"labels.inputs.Age" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required and cannot be negative" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
-      <mat-checkbox formControlName="isDependent" labelPosition="before" fxFlex="calc(50% - 25px)">Is Dependent?
+      <mat-checkbox formControlName="isDependent" labelPosition="before" fxFlex="calc(50% - 25px)">{{"labels.inputs.Is Dependent" |translate}}?
       </mat-checkbox>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Relationship</mat-label>
+        <mat-label>{{"labels.inputs.Relationship" |translate}}</mat-label>
         <mat-select formControlName="relationshipId" required>
           <mat-option *ngFor="let relation of addFamilyMemberTemplate.relationshipIdOptions" [value]="relation.id">
             {{ relation.name  }}
           </mat-option>
         </mat-select>
         <mat-error *ngIf="addFamilyMemberForm.controls.relationshipId.hasError('required')">
-          Relationship is <strong>required</strong>
+          {{"labels.inputs.Relationship" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Gender</mat-label>
+        <mat-label>{{"labels.inputs.Gender" |translate}}</mat-label>
         <mat-select formControlName="genderId" required>
           <mat-option *ngFor="let gender of addFamilyMemberTemplate.genderIdOptions" [value]="gender.id">
             {{ gender.name }}
           </mat-option>
         </mat-select>
         <mat-error *ngIf="addFamilyMemberForm.controls.genderId.hasError('required')">
-          Gender is <strong>required</strong>
+          {{"labels.inputs.Gender" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Profession</mat-label>
+        <mat-label>{{"labels.inputs.Profession" |translate}}</mat-label>
         <mat-select formControlName="professionId">
           <mat-option *ngFor="let profession of addFamilyMemberTemplate.professionIdOptions" [value]="profession.id">
             {{ profession.name }}
@@ -75,7 +75,7 @@
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Marital Status</mat-label>
+        <mat-label>{{"labels.inputs.Marital Status" |translate}}</mat-label>
         <mat-select formControlName="maritalStatusId">
           <mat-option *ngFor="let maritalStatus of addFamilyMemberTemplate.maritalStatusIdOptions"
             [value]="maritalStatus.id">
@@ -86,22 +86,21 @@
 
 
       <mat-form-field fxFlex (click)="dueDatePicker.open()">
-        <mat-label>Date Of Birth</mat-label>
+        <mat-label>{{"labels.inputs.Date Of Birth" |translate}}</mat-label>
         <input formControlName="dateOfBirth" matInput [max]="maxDate" [matDatepicker]="dueDatePicker"
           required>
         <mat-datepicker-toggle matSuffix [for]="dueDatePicker"></mat-datepicker-toggle>
         <mat-datepicker #dueDatePicker></mat-datepicker>
         <mat-error *ngIf="addFamilyMemberForm.controls.dateOfBirth.hasError('required')">
-          Date of birth
-          is <strong>required</strong>
+          {{"labels.inputs.Date of birth" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
     </div>
     
     <div fxLayout="row" fxLayoutGap="32px" fxLayoutAlign="center">
-      <button type="button" mat-raised-button [routerLink]="['../']">Cancel</button>
-      <button type="submit" mat-raised-button color="primary" [disabled]="!addFamilyMemberForm.valid">Submit</button>
+      <button type="button" mat-raised-button [routerLink]="['../']">{{ "labels.buttons.Cancel" |translate}}</button>
+      <button type="submit" mat-raised-button color="primary" [disabled]="!addFamilyMemberForm.valid">{{ "labels.buttons.Submit" |translate}}</button>
     </div>
 
   </form>

src/app/clients/clients-view/family-members-tab/edit-family-member/edit-family-member.component.html

@@ -5,36 +5,36 @@
     <div fxLayout="row wrap" fxLayout.lt-md="column" fxLayoutAlign="start center">
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>First Name</mat-label>
+        <mat-label>{{"labels.inputs.First Name" |translate}}</mat-label>
         <input formControlName="firstName" required matInput />
         <mat-error *ngIf="editFamilyMemberForm.controls.firstName.hasError('required')">
-          First Name is <strong>required</strong>
+          {{"labels.inputs.First Name" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Middle Name</mat-label>
+        <mat-label>{{"labels.inputs.Middle Name" |translate}}</mat-label>
         <input formControlName="middleName" matInput />
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Last Name</mat-label>
+        <mat-label>{{"labels.inputs.Last Name" |translate}}</mat-label>
         <input formControlName="lastName" required matInput />
         <mat-error *ngIf="editFamilyMemberForm.controls.lastName.hasError('required')">
-          Last Name is <strong>required</strong>
+          {{"labels.inputs.Last Name" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Qualification</mat-label>
+        <mat-label>{{"labels.inputs.Qualification" |translate}}</mat-label>
         <input formControlName="qualification" matInput />
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Age</mat-label>
+        <mat-label>{{"labels.inputs.Age" |translate}}</mat-label>
         <input type="number" formControlName="age" required matInput />
         <mat-error *ngIf="editFamilyMemberForm.controls.age.hasError('required')">
-          Age is <strong>required</strong>
+          {{"labels.inputs.Age" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required and cannot be negative" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
@@ -42,31 +42,31 @@
       </mat-checkbox>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Relationship</mat-label>
+        <mat-label>{{"labels.inputs.Relationship" |translate}}</mat-label>
         <mat-select formControlName="relationshipId" required>
           <mat-option *ngFor="let relation of addFamilyMemberTemplate.relationshipIdOptions" [value]="relation.id">
             {{ relation.name  }}
           </mat-option>
         </mat-select>
         <mat-error *ngIf="editFamilyMemberForm.controls.relationshipId.hasError('required')">
-          Relationship is <strong>required</strong>
+          {{"labels.inputs.Relationship" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Gender</mat-label>
+        <mat-label>{{"labels.inputs.Gender" |translate}}</mat-label>
         <mat-select formControlName="genderId" required>
           <mat-option *ngFor="let gender of addFamilyMemberTemplate.genderIdOptions" [value]="gender.id">
             {{ gender.name }}
           </mat-option>
         </mat-select>
         <mat-error *ngIf="editFamilyMemberForm.controls.genderId.hasError('required')">
-          Gender is <strong>required</strong>
+          {{"labels.inputs.Gender" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Profession</mat-label>
+        <mat-label>{{"labels.inputs.Profession" |translate}}</mat-label>
         <mat-select formControlName="professionId">
           <mat-option *ngFor="let profession of addFamilyMemberTemplate.professionIdOptions" [value]="profession.id">
             {{ profession.name }}
@@ -75,7 +75,7 @@
       </mat-form-field>
 
       <mat-form-field fxFlex="calc(50% - 25px)">
-        <mat-label>Marital Status</mat-label>
+        <mat-label>{{"labels.inputs.Marital Status" |translate}}</mat-label>
         <mat-select formControlName="maritalStatusId">
           <mat-option *ngFor="let maritalStatus of addFamilyMemberTemplate.maritalStatusIdOptions"
             [value]="maritalStatus.id">
@@ -86,22 +86,21 @@
 
 
       <mat-form-field fxFlex (click)="dueDatePicker.open()">
-        <mat-label>Date Of Birth</mat-label>
+        <mat-label>{{"labels.inputs.Date Of Birth" |translate}}</mat-label>
         <input formControlName="dateOfBirth" matInput [max]="maxDate" [matDatepicker]="dueDatePicker"
           required>
         <mat-datepicker-toggle matSuffix [for]="dueDatePicker"></mat-datepicker-toggle>
         <mat-datepicker #dueDatePicker></mat-datepicker>
         <mat-error *ngIf="editFamilyMemberForm.controls.dateOfBirth.hasError('required')">
-          Date of birth
-          is <strong>required</strong>
+          {{"labels.inputs.Date of birth" |translate}} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
         </mat-error>
       </mat-form-field>
 
     </div>
     
     <div fxLayout="row" fxLayoutGap="32px" fxLayoutAlign="center">
-      <button type="button" mat-raised-button [routerLink]="['../../']">Cancel</button>
-      <button type="submit" mat-raised-button color="primary" [disabled]="editFamilyMemberForm.pristine||!editFamilyMemberForm.valid">Submit</button>
+      <button type="button" mat-raised-button [routerLink]="['../../']">{{ "labels.buttons.Cancel" |translate}}</button>
+      <button type="submit" mat-raised-button color="primary" [disabled]="editFamilyMemberForm.pristine||!editFamilyMemberForm.valid">{{ "labels.buttons.Submit" |translate}}</button>
     </div>
 
   </form>

src/app/clients/clients-view/family-members-tab/family-members-tab.component.html

@@ -2,12 +2,11 @@
 
   <router-outlet>
 
-    <h3>Family Members</h3>
+    <h3>{{"labels.heading.Family Members" |translate}}</h3>
 
     <div fxLayout="row" fxLayoutAlign="flex-end">
       <button mat-raised-button color="primary" [routerLink]="['./add']">
-        <fa-icon icon="plus" class="m-r-10"></fa-icon>
-        Add
+        <fa-icon icon="plus" class="m-r-10"></fa-icon>{{ "labels.buttons.Add" |translate}}
       </button>
     </div>
 
@@ -36,17 +35,17 @@
         </div>
 
         <p>
-          First Name : {{member.firstName}}<br />
-          Middle Name : {{member.middleName}}<br />
-          Last Name : {{member.lastName}}<br />
-          Qualification : {{member.qualification}}<br />
-          Mobile Number : {{member.mobileNumber}}<br />
-          Age : {{member.age}}<br />
-          Is Dependent : {{member.isDependent}}<br />
-          Martial Status : {{member.maritalStatus}}<br />
-          Gender : {{member.gender}}<br />
-          Profession : {{member.profession}}<br />
-          Date Of Birth : {{member.dateOfBirth | dateFormat}}<br />
+          {{"labels.inputs.First Name" |translate}} : {{member.firstName}}<br />
+          {{"labels.inputs.Middle Name" |translate}} : {{member.middleName}}<br />
+          {{"labels.inputs.Last Name" |translate}} : {{member.lastName}}<br />
+          {{"labels.inputs.Qualification" |translate}} : {{member.qualification}}<br />
+          {{"labels.inputs.Mobile Number" |translate}} : {{member.mobileNumber}}<br />
+          {{"labels.inputs.Age" |translate}} : {{member.age}}<br />
+          {{"labels.inputs.Is Dependent" |translate}} : {{member.isDependent}}<br />
+          {{"labels.inputs.Martial Status" |translate}} : {{member.maritalStatus}}<br />
+          {{"labels.inputs.Gender" |translate}} : {{member.gender}}<br />
+          {{"labels.inputs.Profession" |translate}} : {{member.profession}}<br />
+          {{"labels.inputs.Date Of Birth" |translate}} : {{member.dateOfBirth  | dateFormat}}<br />
         </p>
 
       </mat-expansion-panel>