<div class="container">
  <div class="row">
    <div class="content-block">
      <h2 class="title">修改站點資料</h2>
      <form #editSiteData="ngForm">
        <div class="form-group">
    <div class="form-group">
      <label for="country">城市</label>
      <span *ngIf="country.invalid && (country.dirty || country.touched)">
        <span class="invalidMessage" *ngIf="country?.errors.required">*此欄必填</span>
      </span>
      <input type="text" class="form-control" id="country" name="country" #country="ngModel" [(ngModel)]="selectedItem.Country"
        required placeholder="城市">
    </div>
    <div class="form-group">
        <label for="area">行政區</label>
        <span *ngIf="area.invalid && (area.dirty || area.touched)">
          <span class="invalidMessage" *ngIf="area?.errors.required">*此欄必填</span>
        </span>
        <!-- <input type="text" class="form-control" id="area" name="area" #area="ngModel" [(ngModel)]="selectedItem.Area"
          required placeholder="行政區">
         -->

         <select class="form-control" id="area" name="area" #area="ngModel" [(ngModel)]="selectedItem.Area">
          <option value= "" selected>請選擇區域</option>
          <option value= "中壢區">中壢區</option>
          <option value= "平鎮區">平鎮區</option>
          <option value= "龍潭區">龍潭區</option>
          <option value= "楊梅區">楊梅區</option>
          <option value= "新屋區">新屋區</option>
          <option value= "觀音區">觀音區</option>
          <option value= "桃園區">桃園區</option>
          <option value= "龜山區">龜山區</option>
          <option value= "八德區">八德區</option>
          <option value= "大溪區">大溪區</option>
          <option value= "復興區">復興區</option>
          <option value= "大園區">大園區</option>
          <option value= "蘆竹區">蘆竹區</option>
        </select>
      </div>
      <div class="form-group">
        <label for="siteID">站點ID</label>
        <span *ngIf="siteID.invalid && (siteID.dirty || siteID.touched)">
          <span class="invalidMessage" *ngIf="siteID?.errors.required">*此欄必填</span>
        </span>
        <input type="text" class="form-control" id="siteID" name="siteID" #siteID="ngModel" [(ngModel)]="selectedItem.SiteID" required placeholder="站點ID">
      </div>
    <div class="form-group">
      <label for="siteName">站點名稱</label>
      <span *ngIf="siteName.invalid && (siteName.dirty || siteName.touched)">
        <span class="invalidMessage" *ngIf="siteName?.errors.required">*此欄必填</span>
      </span>
      <input type="text" class="form-control" id="siteName" name="siteName" #siteName="ngModel" [(ngModel)]="selectedItem.SiteName" required placeholder="站點名稱">
    </div>
    <div class="form-group">
        <label for="eventType">事件類型</label>
        <span *ngIf="eventType.invalid && (eventType.dirty || eventType.touched)">
          <span class="invalidMessage" *ngIf="eventType?.errors.required">*此欄必填</span>
        </span>
        <!-- <input type="text" class="form-control" id="eventType" name="eventType" #eventType="ngModel" [(ngModel)]="selectedItem.EventType" required placeholder="事件類型"> -->

        <select class="form-control" id="EventTypeId" name="EventTypeId" [(ngModel)]="selectedItem.EventType" #eventType="ngModel" required>
          <option value="">請選擇事件類型</option>
          <option *ngFor="let eventType of EventTypeList" [value]="eventType.Id">{{eventType.EventName}}</option>
        </select>
      </div>
      <div class="form-group">
        <label for="company">負責廠商</label>
        <span *ngIf="company.invalid && (company.dirty || company.touched)">
          <span class="invalidMessage" *ngIf="company?.errors.required">*此欄必填</span>
        </span>
        <select class="form-control" [(ngModel)]="selectedItem.CompanyCode" name="company" id="company" #company="ngModel">
          <option [ngValue]="companyInfo.CompanyCode" *ngFor="let companyInfo of companyAllInfo" >{{companyInfo.CompanyName}}</option>
        </select>
      </div>
    <div class="form-group">
      <label for="laws">法規</label>
      <span *ngIf="laws.invalid && (laws.dirty || laws.touched)">
        <span class="invalidMessage" *ngIf="laws?.errors.required">*此欄必填</span>
      </span>
      <input type="text" class="form-control" id="laws" name="laws" #laws="ngModel" [(ngModel)]="selectedItem.Laws"
        required placeholder="法規">
    </div>
        <div class="btn-footer">
          <button type="submit" class="btn btn-danger" (click)="backPreviousPage()">
            <i class="fa fa-chevron-left" aria-hidden="true"></i> 回上一頁
          </button>
          <button type="button" class="btn btn-success" [disabled]="!editSiteData.form.valid" (click)="doEditSite()">
            送出
            <i class="fa fa-chevron-right" aria-hidden="true"></i>
          </button>
        </div>
        </div>
      </form>
    </div>
  </div>
</div>
