WrenchBoardIonic2023/src/app/components/interest-card/interest-card.component.html

<ion-grid class="jobIntGrid">
  <ion-row>
    <ion-col>
      <ion-list>
        <ion-item>
          <ion-icon aria-hidden="true" name="people" slot="start"></ion-icon>
          <ion-label>{{intData.client_name}}</ion-label>
        </ion-item>
        <ion-item>
          <ion-icon aria-hidden="true" name="time" slot="start"></ion-icon>
          <ion-label>Member Since : {{intData.client_added | date}}</ion-label>
        </ion-item>
        <ion-item>
          <ion-icon aria-hidden="true" name="chatbox-ellipses" slot="start"></ion-icon>
          <ion-label>Interest Date : {{intData.sent | date}}</ion-label>
        </ion-item>
        <ion-item>
<!--          <ion-icon aria-hidden="true" name="chatbox-ellipses" slot="start"></ion-icon>-->
          <ion-button  fill="clear"  size ="small" shape="round" (click)="jobHx(intData)">{{job_hx_button}}</ion-button>
        </ion-item>
      </ion-list>
    </ion-col>
  </ion-row>

  <ion-row *ngIf="job_hx_open==true;">
    <ion-col>
      <div class="job-hx">
        <ion-label>Completed : {{job_completed}}</ion-label>
        <ion-label>Active : {{job_active}}</ion-label>
        <ion-label>% Completed : {{job_percent_complete}}</ion-label>
      </div>
    </ion-col>
    <ion-col>
      <div class="job-hx">
        <ion-label>Last Complt. : {{job_last_date}}</ion-label>
        <ion-label>Uncompleted : {{job_uncompleted}}</ion-label>
        <ion-label>Pending : {{job_pending}}</ion-label>
      </div>
    </ion-col>
  </ion-row>

</ion-grid>
<ion-grid [fixed]="true">
  <ion-row>
    <ion-col>
      <ion-button expand="block" color="danger"  size ="small" shape="round"  (click)="rejectStart(intData)">Reject</ion-button>
    </ion-col>
    <ion-col>
      <ion-button  expand="block" size ="small" shape="round" (click)="approveStart(intData)">Approve Start</ion-button>
    </ion-col>
  </ion-row>
</ion-grid>