58 lines
2.3 KiB
HTML
58 lines
2.3 KiB
HTML
<div class="tab-container mat-typography">
|
|
|
|
<router-outlet>
|
|
|
|
<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>{{"labels.buttons.Add" | translate}}
|
|
</button>
|
|
</div>
|
|
|
|
<mat-accordion>
|
|
|
|
<mat-expansion-panel *ngFor="let member of clientFamilyMembers;index as i" class="family-member">
|
|
|
|
<mat-expansion-panel-header>
|
|
<mat-panel-title>
|
|
{{member.firstName+' '+member.middleName+' '+member.lastName}}
|
|
</mat-panel-title>
|
|
<mat-panel-description>
|
|
{{member.relationship}}
|
|
</mat-panel-description>
|
|
</mat-expansion-panel-header>
|
|
|
|
<mat-divider [inset]="true"></mat-divider>
|
|
|
|
<div class="family-member-actions" fxLayout="row" fxLayoutAlign="flex-end">
|
|
<button mat-button color="primary">
|
|
<fa-icon icon="edit" [routerLink]="[member.id,'edit']"></fa-icon>
|
|
</button>
|
|
<button mat-button color="warn" (click)="deleteFamilyMember(member.clientId,member.id,member.firstName,i)">
|
|
<fa-icon icon="trash"></fa-icon>
|
|
</button>
|
|
</div>
|
|
|
|
<p>
|
|
{{"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>
|
|
|
|
</mat-accordion>
|
|
|
|
</router-outlet>
|
|
|
|
</div>
|