sgApp/src/app/es-apply-scan/es-apply-scan.page.html

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-menu-button></ion-menu-button>
    </ion-buttons>
    <ion-title>入库单号扫描</ion-title>
    <ion-buttons slot="end">
      <ion-button [disabled]="esStoreList.length===0" (click)="saveStore()">
        保存
      </ion-button>
      /
      <ion-button (click)="qrscan()">
        <ion-icon name="qr-scanner"></ion-icon>
      </ion-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-item>
    <ion-label>入库申请单号：</ion-label>
    <ion-input #scanInput clear-on-edit autofocus (ionFocus)="hideKeyboard()" (ionChange)="getStoreDetail()"
      [(ngModel)]="scanCode"></ion-input>
  </ion-item>
  <!-- <ion-list style="margin-bottom: 0px;" *ngFor="let es of esStoreList index as i"> -->
  <ion-grid *ngFor="let es of esStoreDetailList">
    <ion-row *ngFor="let store of es.detailList;let i = index">
      <!-- <form #esApplyForm="ngForm"> -->
        <div class="divider"></div>
        <ion-col size="3" class="ion-col">
          <ion-label class="disabled-input">
            PO号:
          </ion-label>
          <ion-input class="ion-input" [(ngModel)]="store.scpPoCode" name="scpPoCode" #scpPoCode="ngModel" disabled>
          </ion-input>
        </ion-col>
        <ion-col size="3" class="ion-col">
          <ion-label class="disabled-input">
            我司货号:
          </ion-label>
          <ion-input class="ion-input" [(ngModel)]="store.scpCode" name="scpCode" #scpCode="ngModel" disabled>
          </ion-input>
        </ion-col>
        <ion-col size="3" class="ion-col">
          <ion-label class="disabled-input">
            客户货号:
          </ion-label>
          <ion-input class="ion-input" [(ngModel)]="store.scpCustomercode" name="scpCustomercode"
            #scpCustomercode="ngModel" disabled>
          </ion-input>
        </ion-col>
        <ion-col size="9" class="ion-col">
          <ion-label class="disabled-input">
            中文品名:
          </ion-label>
          <ion-input class="ion-input" [(ngModel)]="store.scpCnname" name="scpCnname" #scpCnname="ngModel" disabled>
          </ion-input>
        </ion-col>
        <ion-col size="3" class="ion-col">
          <ion-label class="disabled-input">
            总箱数:
          </ion-label>
          <ion-input class="ion-input" [(ngModel)]="store.boxsCount" name="boxsCount" #boxsCount="ngModel" disabled>
          </ion-input>
        </ion-col>
        <ion-col size="3" class="ion-col">
          <ion-label class="disabled-input">
            qc员:
          </ion-label>
          <ion-input class="ion-input" [(ngModel)]="store.qcName" name="qcName" #qcName="ngModel" disabled>
          </ion-input>
        </ion-col>
        <ion-col size="6" class="mode-input">
          <div>
            <ion-label>
              外箱长度：
            </ion-label>
            <ion-input style="--padding-top: 0;" [(ngModel)]="store.outboxlength" type="number"
              (ionFocus)="hideKeyboard()" name="outboxlength" required></ion-input>
          </div>
          <ion-text class="mode-input-danger" color="danger">
            <p style="padding-left: 0;" [hidden]="!(!store.outboxlength&&clicked)" class="ion-padding-start">
              请输入外箱长度
            </p>
          </ion-text>
        </ion-col>
        <ion-col size="3" class="mode-input">
          <div>
            <ion-label>
              外箱宽度：
            </ion-label>
            <ion-input style="--padding-top: 0;" [(ngModel)]="store.outboxwidth" type="number"
              (ionFocus)="hideKeyboard()" name="outboxwidth" required></ion-input>
          </div>
          <ion-text class="mode-input-danger" color="danger">
            <p style="padding-left: 0;" [hidden]="!(!store.outboxwidth&&clicked)" class="ion-padding-start">
              请输入外箱宽度
            </p>
          </ion-text>
        </ion-col>
        <ion-col size="3" class="mode-input">
          <div>
            <ion-label>
              外箱高度：
            </ion-label>
            <ion-input style="--padding-top: 0;" [(ngModel)]="store.outboxheigt" type="number"
              (ionFocus)="hideKeyboard()" name="outboxheigt" required></ion-input>
          </div>
          <ion-text class="mode-input-danger" color="danger">
            <p style="padding-left: 0;" [hidden]="!(!store.outboxheigt&&clicked)" class="ion-padding-start">
              请输入外箱高度
            </p>
          </ion-text>
        </ion-col>
        <ion-col size="3" class="mode-input">
          <div>
            <ion-label>
              毛重:
            </ion-label>
            <ion-input style="--padding-top: 0;" [(ngModel)]="store.grossweight" type="number"
              (ionFocus)="hideKeyboard()" name="grossweight" required></ion-input>
          </div>
          <ion-text class="mode-input-danger" color="danger">
            <p style="padding-left: 0;" [hidden]="!(!store.grossweight&&clicked)" class="ion-padding-start">
              请输入毛重:
            </p>
          </ion-text>
        </ion-col>
        <ion-col size="3" class="mode-input">
          <div>
            <ion-label>
              仓位编号:
            </ion-label>
            <ion-input style="--padding-top: 0;" [(ngModel)]="store.storelocation" type="number"
              (ionFocus)="hideKeyboard()" name="storelocation" required></ion-input>
          </div>
          <ion-text class="mode-input-danger" color="danger">
            <p style="padding-left: 0;" [hidden]="!(!store.storelocation&&clicked)" class="ion-padding-start">
              请输入仓位编号
            </p>
          </ion-text>
        </ion-col>
      <!-- </form> -->
    </ion-row>
  </ion-grid>

  <!-- </ion-list> -->
  <div class="ion-padding">
    <ion-button color="primary" type="submit" expand="block" (click)="saveRecord()"
      [disabled]="esStoreDetailList.length===0">记 录</ion-button>
  </div>
  <ion-list>
    <ion-item-group>
      <ion-item-divider sticky>
        <ion-label>
          已扫描条形码编号
        </ion-label>
      </ion-item-divider>
    </ion-item-group>
    <ion-item *ngFor="let item of esStoreList index as i">
      <ion-label color="primary" (click)="getStoreDetail(item)">入库申请单号:({{item.scanCode}})</ion-label>
      <ion-icon name="trash" (click)="deleteStore(item, i)"></ion-icon>
    </ion-item>
  </ion-list>
</ion-content>