# <center>Improving Mantenace Records Page </center>

Update HTML file

<ion-header>
  <div class="header">
    <div class="topleft">
      <img src="assets/icon/[e-mail]" height="40px" width="76px">
    </div>
    <div class="topright">
      <img src="assets/icon/[e-mail]" height="30px" width="30px">
    </div>
    <div class="center">
      <img src="assets/icon/group-6.png" height="54px" width="54px">
      <p class="Text">Maintenace records</p>
    </div>
  </div>
</ion-header>


<ion-content padding>
  <ion-list>
    <ion-item *ngFor="let dataDevice of datas?.Data">
      <ion-avatar slot="start">
        <img src="assets/icon/[e-mail]" style="width: 75%; height: 75%">
      </ion-avatar>

      <ion-label text-wrap>
        <ion-datetime displayFormat="YYYY MMMM" value="dataDevice.CompleteTime"></ion-datetime>
        <h3 style="font-weight: bold;">{{dataDevice.CompleteTime}}</h3>
        <h4 *ngIf=" dataDevice.ErrorType == '1'">Button does not respond</h4>
        <h4 *ngIf=" dataDevice.ErrorType == '2'">Unable to water</h4>
        <h4 *ngIf=" dataDevice.ErrorType == '3'">Leaking water</h4>
        <h4 *ngIf=" dataDevice.ErrorType == '4'">Screen not shown</h4>
        <h4 *ngIf=" dataDevice.ErrorType == '5'">Other</h4>
        <p>{{dataDevice.Description}}</p>
      </ion-label>

      <ion-icon name="arrow-forward"></ion-icon>
    </ion-item>
  </ion-list>
  <ion-item>
    <ion-label>MMMM</ion-label>
    <ion-datetime displayFormat="YYYY MMMM" value="2012-12-15 13:47:20"></ion-datetime>
  </ion-item>
</ion-content>

## Display

Note
+ Need to change date format