# <center>19^th^ August, 2019</center>

###### tags: `Daily Internship Documentation`
---
## 34^th^ Day of Internship

## Summary

Today I make the Submit button in the report repair page only appear when the description field is not null. I also try to send the repair result into the database.

URL:
* [**NTUST_RepairmanApp Github ver 2019.08.19**](https://github.com/ianjoseph2204/NTUST_RepairmanApp/tree/e8fb9cf027aaf28c57c2d3b2116dd4d5a34595be)

---
## Documentation

### 1. Static Variable Class
#### 1.1 static-variable.ts

1. Add a key for the mission number.

    public static KEY__MISSION_NUMBER: "mission_number";

### 2. Home Page
#### 2.1 home.page.ts

1. Insert the mission number from the data in the *setDetailReportToPref()* method.

    await this.pref.setData(StaticVariables.KEY__MISSION_NUMBER, data['MissionNumber'])
  }

### 3. Report Repair Page
#### 3.1 report-repair.page.ts

1. Import the DispenserApi service.

mport {DispenserAPIService} from '../../services/DispenserAPI/dispenser-api.service';

Import the api to the constructor.

  constructor(
      private alertCtrl: AlertController,
      private pref: PreferenceManagerService,
      private api: DispenserAPIService,
      private navCtrl: NavController) { }

2. Create variables for the mission number and the result description.

  public mission_number: any;

  public result_description: string = '';

3. Get mission number from preference.

  async getPrefData(){
    this.device_id = await this.pref.getData(StaticVariables.KEY__DEVICE_ID);
    this.device_type = await this.pref.getData(StaticVariables.KEY__DEVICE_TYPE);
@ -35,8 +43,12 @@ export class ReportRepairPage implements OnInit {
    this.device_building_position = await this.pref.getData(StaticVariables.KEY__DEVICE_BUILDING_LOC);
    this.device_placement_position = await this.pref.getData(StaticVariables.KEY__DEVICE_PLACEMENT_LOC);
    this.problem_description = await this.pref.getData(StaticVariables.KEY__PROBLEM_DESCRIPTION);
    this.mission_number = await this.pref.getData(StaticVariables.KEY__MISSION_NUMBER)
  }

4. Create a function for the submit button activity.

  /**
   * Send the report repair data into database, show alert, & go back to the Home page.
   */
  async submitButton(){

    console.log(this.result_description);

    await this.api.repairCompleteReport(this.fileImage, this.mission_number, this.result_description);

    let alert: any;

    alert = await this.alertCtrl.create({
      mode: "ios",
      header: 'Submission Success!',
      buttons: [
        {
          text: 'OK',
          handler: () => {
          }
        }
      ]
    });

    await alert.present(); //Display the alert message

    this.backButton();
  }

#### 3.2 report-repair.page.html

1. Show the Submit button when the repair description field is not null.

<span *ngIf="result_description!=''" class="submit-button" (click)="submitButton()">Submit</span>

2. Clear the dispenser position information when the preference is null.

    <span *ngIf="device_building_position!=null && device_placement_position!=null" class="detail-information">{{device_building_position}}, {{device_placement_position}}</span>
    <span *ngIf="device_building_position==null && device_placement_position==null" class="detail-information"> </span>

---
## Result