# 17st July Report

## Progress

**09:40** - Entering BMW Lab.

## Add Modal Page
Added by following yesterday tutorial.

### Result

<center>
<img src="https://imgur.com/2XyGS8Y.gif" stye="height" 300px>
</center>
<br>

## Make second slide display first

Add option in html.

 <ion-slides [options]="slideOpts">

Add in ts.

 slideOpts = {
    initialSlide: 1,
    speed: 400
  };

## Add Button

In html.

<ion-footer>

  <section class="full-width">
    <ion-button expand="full" *ngIf="!Arrived" (click)="arrived()">Arrived</ion-button>

    <ion-grid *ngIf="Arrived">
      <ion-row>
        <ion-col size="6">
          <div>
            <ion-button expand="full" (click)="applyForComponent()">Apply for<br> Component</ion-button>
          </div>
        </ion-col>
        <ion-col size="6">
          <div>
            <ion-button expand="full" (click)="compleRepair()">Comple Repair</ion-button>
          </div>
        </ion-col>
      </ion-row>
    </ion-grid>
  </section>
  <!-- <ion-segment>
    <ion-segment-button>
      <ion-label>Apply for<br> Component</ion-label>
    </ion-segment-button>
    <ion-segment-button>
      <ion-label>Comple Repair</ion-label>
    </ion-segment-button>
  </ion-segment> -->
</ion-footer>

In ts.

Arrived = false;


  dismiss() {
    this.modalController.dismiss();
  }

  arrived() {
    this.Arrived = true;
  }

  applyForComponent() {
  }

  compleRepair() {
  }

### Result

<center>
<img src="https://imgur.com/d3ZXreH.gif" stye="height" 300px>
</center>
<br>

## To Do Next
- Change color when card click
- Change modal size when
- Add select image function

**18:00** - Leave BMW Lab.

###### tags: `on-intern`