zy-pc/src/app/views/washing-batch-view/washing-batch-view.component.html

<div class="washingBatchView">
  <!-- 头部 -->
  <div class="head">
    <div class="logo"><img [src]="tool.logoUrl" [alt]="tool.logoTitle"></div>
    <div class="title">被服洗涤</div>
  </div>
  <!-- 主体 -->
  <div class="main">
    <div class="search top display_flex justify-content_space-between align-items_center">
      <div class="flex_1 display_flex">
        <div class="searchItem">
          <span class="label">父级被服分类</span>：
          <nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" [nzShowSearch]="false" nzAllowClear
            nzPlaceHolder="请选择父级被服分类" [(ngModel)]="searchDto.parent">
            <ng-container *ngFor="let data of parentList">
              <nz-option [nzLabel]="data.name" [nzValue]="data.id"></nz-option>
            </ng-container>
          </nz-select>
        </div>
        <div class="searchItem">
          <span class="label">被服分类</span>：
          <nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" [nzShowSearch]="false" nzAllowClear
            nzPlaceHolder="请选择被服分类" [(ngModel)]="searchDto.child">
            <ng-container *ngFor="let data of childList">
              <nz-option [nzLabel]="data.name" [nzValue]="data.id"></nz-option>
            </ng-container>
          </nz-select>
        </div>
      </div>
      <div class="display_flex align-items_center">
        <button nzType="primary" nz-button (click)="getList()">搜索</button>
        <button nzType="primary" nz-button (click)="reset()">重置</button>
        <button nzType="primary" nz-button>打印功能</button>
        <button nzType="primary" nz-button (click)="viewDetail()">查看异常</button>
        <button nzType="primary" nz-button (click)="showDelModal()" [disabled]="checkedDepIds.length === 0">批量送回</button>
      </div>
    </div>
    <div class="list">
      <nz-table class="list-template__nzTable" [nzData]="listOfData" nzSize="middle" [nzShowPagination]="false"
        [nzLoading]="loading" [nzScroll]="{ x: '100%', y: scrollY + 'px' }">
        <thead>
          <tr class="thead">
            <!-- 多选框 -->
            <th nzLeft="0px" nzAlign="center" nzWidth="40px" nzShowCheckbox [(nzChecked)]="isAllDisplayDataChecked"
              (nzCheckedChange)="checkAll($event)"></th>
            <!-- 固定列-first -->
            <th nzLeft="40px" nzAlign="center" nzWidth="140px">{{ row }}</th>
            <!-- 动态列 -->
            <th nzAlign="center" nzWidth="65px" *ngFor="let row of rows[1]">{{ row }}</th>
            <!-- 固定列-last -->
            <th [nzRight]="last ? '0px' : (first ? null : '100px')" nzAlign="center" [nzWidth]="(last ? '100px' : (first ? null : '65px'))" *ngFor="let row of rows[2];let first = first;let last = last;">{{ row }}</th>
          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let data of listOfData" (click)="selectedListData(data)">
            <td nzLeft="0px" nzAlign="center" nzShowCheckbox [nzDisabled]="data[0][1] == 5" [(nzChecked)]="mapOfCheckedId[data[0][0]]" (nzCheckedChange)="refreshStatus()"></td>
            <td nzLeft="40px" nzAlign="center"><span>{{ data[0][data[0].length - 1] }}</span></td>
            <td nzAlign="center" *ngFor="let row of data[1];let index = index;"><span (click)="clickNum($event, row)" class="table_hover" [ngClass]="{ red: row.exception == 1 }">{{ row.sendBackNum }}</span></td>
            <td [nzRight]="last ? '0px' : (first ? null : '100px')" nzAlign="center" *ngFor="let row of data[2];let first = first;let last = last;"><span>{{ row }}</span></td>
          </tr>
        </tbody>
      </nz-table>
    </div>
    <div class="bottom">
      <strong>总件数：{{totalData.totalNum}}件</strong>
      <strong>总费用：{{totalData.totalPrice}}元</strong>
    </div>
  </div>
</div>
<!-- 批量送回模态框 -->
<app-dialog-delete [delModal]="delModal" (hideDelModalEvent)="hideDelModal()" [btnLoading]="loading3"
(confirmDelEvent)="confirmDel()" [content]="content"></app-dialog-delete>

<!-- 修改数量模态框 -->
<div class="save display_flex justify-content_flex-center align-items_center add" *ngIf="washingModal">
  <div class="modalBody">
    <div class="title">提示<i class="icon_transport transport-guanbi" (click)="hideWashingModal()"></i>
    </div>
    <div class="content">
      <form nz-form [formGroup]="validateForm" class="addForm" (ngSubmit)="confirmWashing()">
        <nz-form-item>
          <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="sendBackNum">调整数量</nz-form-label>
          <nz-form-control nzErrorTip="请输入调整数量!">
            <nz-input-group>
              <nz-input-number formControlName="sendBackNum" placeholder="请输入调整数量" [nzStep]="1" [nzPrecision]="0"></nz-input-number>
            </nz-input-group>
          </nz-form-control>
        </nz-form-item>
        <nz-form-item>
          <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="clothesExceptionResId">调整原因</nz-form-label>
          <nz-form-control nzErrorTip="请选择调整原因!">
            <nz-select formControlName="clothesExceptionResId" nzPlaceHolder="请选择调整原因">
              <nz-option *ngFor="let option of dictionaryList" [nzLabel]="option.name" [nzValue]="option.id">
              </nz-option>
            </nz-select>
          </nz-form-control>
        </nz-form-item>
        <nz-form-item>
          <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="remarks">备注</nz-form-label>
          <nz-form-control nzErrorTip="请输入备注!">
            <nz-input-group>
              <input nz-input formControlName="remarks" placeholder="请输入备注" />
            </nz-input-group>
          </nz-form-control>
        </nz-form-item>

      </form>
    </div>
    <div class="display_flex justify-content_flex-center">
      <button nzType="primary" [nzLoading]="btnLoading" nz-button (click)="confirmWashing()">确认</button>
      <button class="btn cancel" nz-button nzType="default" (click)="hideWashingModal()">取消</button>
    </div>
  </div>
</div>

<!-- 操作成功/失败提示框 -->
<app-prompt-modal *ngIf="promptModalShow" [content]="promptContent" [success]="ifSuccess" [show]="promptModalShow"
  [info]="promptInfo"></app-prompt-modal>

<!-- 异常查看 -->
<app-businessData-detail-modal
  *ngIf="washingExceptionModalShow"
  [show]="washingExceptionModalShow"
  type="washingException"
  [orderId]="route.snapshot.paramMap.get('id')"
  (closeModelHs)="closeModelWashingException($event)"
></app-businessData-detail-modal>