<ion-header style="background-color: #F3F4F4;">

</ion-header>

<ion-content  color='light' style="height: 100%">
  <h1 style="
            font-size: 16px;
            padding-left: 5px;
            border-left: 5px solid #28c9bd;
            line-height: 25px;
            margin-bottom: 5px;">模式状态</h1>
  <ion-item lines="full">
    <ion-label>运行模式</ion-label>
    <ion-select multiple="false" cancelText="取消" okText="确认" [(ngModel)]="workModeSetting.workMode" [(value)]="workModeSetting.workMode"  (ionChange)="workModeEvent()">
      <ion-select-option value="0">手控模式</ion-select-option>
      <ion-select-option value="1">自控模式</ion-select-option>
      <ion-select-option value="2">智慧模式</ion-select-option>
    </ion-select>
  </ion-item>

  <h1 style="
            font-size: 16px;
            padding-left: 5px;
            border-left: 5px solid #28c9bd;
            line-height: 25px;
            margin-bottom: 5px;">供液泵状态</h1>
    <ion-item lines="full">
      <div [ngClass]="{'sucCir': bump.online, 'errCir': !bump.online}"></div>&nbsp;
      <span style="font-size: 13px">{{bump.online ? '在线' : '离线'}}</span>
      <span style="font-size: 13px; margin-left: 30px">压力:  {{bump.press}} Mpa</span>
    </ion-item>
  <h1 style="
            font-size: 16px;
            padding-left: 5px;
            border-left: 5px solid #28c9bd;
            line-height: 25px;
            margin-bottom: 5px;">时间参数</h1>
  <ion-item lines="full" *ngFor="let a of workarea.param" insert="false">
    <span style="font-size: 13px;">{{a.name}}喷淋时间        {{a.workTime}} 秒</span>
  </ion-item>
  <ion-item lines="full" insert="false">
    <span style="font-size: 13px;">间隔时间        {{workarea.Interval}} 秒</span>
  </ion-item>
  <h1 style="
            font-size: 16px;
            padding-left: 5px;
            border-left: 5px solid #28c9bd;
            line-height: 25px;
            margin-bottom: 5px;">控制/状态</h1>
  <!--<ion-item *ngFor="let a of allBtns" lines="full" insert="false"  >-->
    <!--&lt;!&ndash;<v-switch [value]="a.value" (click)="toggle(a)" [loading]="a.loading"></v-switch>&ndash;&gt;-->
    <!--<ion-label>一键控制{{a.l}}</ion-label>-->
    <!--<v-switch [value]="a.v" (click)="allCheck(a)" [loading]="a.d"></v-switch>-->
  <!--</ion-item>-->
  <div>
    <ion-card *ngFor="let a of workarea.param" class="card" color="white">
      <ion-card-header>
        <ion-card-title>{{a.name}}</ion-card-title>
      </ion-card-header>

      <ion-card-content>
        <span>压力    {{a.press}} MPa</span><br>
        <v-switch [value]="a.runningState" (click)="toggle(a)" style="float: none;display: inline-block;margin-top: 5px"></v-switch>
      </ion-card-content>
    </ion-card>
  </div>
</ion-content>