<div class="detail" *ngIf="!maskFlag">
  <div class="title">
    查看详情<i class="icon_transport transport-guanbi" (click)="close()"></i>
  </div>
  <div class="box">
    <div class="tab display_flex">
      <div
        [ngClass]="{ item: true, flex_1: true, checked: tabType == 1 }"
        (click)="checkTab(1)"
      >
        详情信息
      </div>
      <div
        [ngClass]="{ item: true, flex_1: true, checked: tabType == 4 }"
        (click)="checkTab(4)"
      >
        医废信息
      </div>
    </div>

    <!-- 详情信息 -->
    <overlay-scrollbars
      #osComponentRef3
      style="flex: 1"
      *ngIf="tabType == 1"
    >
      <div class="content orders">
        <div class="top">
          <div class="info" nz-row>
            <div nz-col nzSpan="8">
              批次号：{{ orderInfo.batchNo }}
            </div>
            <div nz-col nzSpan="8">
              凭证编号：{{ orderInfo.credentialsNumber }}
            </div>
            <div nz-col nzSpan="8">
              出库时间：{{ orderInfo.outTime | date: "yyyy-MM-dd HH:mm:ss" }}
            </div>
          </div>
          <div class="info" nz-row>
            <div nz-col nzSpan="16">
              医废类型：{{ orderInfo.clinicalWasteTypeNames }}
            </div>
            <div nz-col nzSpan="8">
              操作人：{{ orderInfo.operator ? orderInfo.operator.name : '' }}
            </div>
          </div>
          <div class="info" nz-row>
            <div nz-col nzSpan="6">
              总重量：{{ orderInfo.totalWeight }}kg
            </div>
            <div nz-col nzSpan="6">
              总袋数：{{ orderInfo.totalBags }}袋
            </div>
            <div nz-col nzSpan="6">
              总箱数：{{ orderInfo.totalBox }}箱
            </div>
            <div nz-col nzSpan="6">
              总桶数：{{ orderInfo.totalBucket }}桶
            </div>
          </div>
        </div>
        <div class="top">
          <div class="info" nz-row>
            <div nz-col nzSpan="8">
              运输单位：{{ orderInfo.transportCompany ? orderInfo.transportCompany.name : '' }}
            </div>
            <div nz-col nzSpan="8">
              司机姓名：{{ orderInfo.driver ? orderInfo.driver.name : '' }}
            </div>
            <div nz-col nzSpan="8">
              司机联系方式：{{ orderInfo.driver ? orderInfo.driver.mphone : '' }}
            </div>
          </div>
          <div class="info" nz-row>
            <div nz-col nzSpan="8">
              车牌号码：{{ orderInfo.carNo }}
            </div>
            <div nz-col nzSpan="8">
              营运证件号：{{ orderInfo.transportCompany ? orderInfo.transportCompany.businessCode : '' }}
            </div>
          </div>
          <div class="info" nz-row>
            <div nz-col nzSpan="24">
              运输单位地址：{{ orderInfo.transportCompany ? orderInfo.transportCompany.address : '' }}
            </div>
          </div>
        </div>
        <div class="top">
          <div class="info" nz-row>
            <div nz-col nzSpan="8">
              接收单位：{{ orderInfo.receptionCompany ? orderInfo.receptionCompany.name : '' }}
            </div>
            <div nz-col nzSpan="8">
              危险物经营许可证编号：{{ orderInfo.receptionCompany ? orderInfo.receptionCompany.businessCode : '' }}
            </div>
            <div nz-col nzSpan="8">
              联系人：{{ orderInfo.receptionCompany ? orderInfo.receptionCompany.contacts : '' }}
            </div>
          </div>
          <div class="info" nz-row>
            <div nz-col nzSpan="8">
              联系电话：{{ orderInfo.receptionCompany ? orderInfo.receptionCompany.mphone : '' }}
            </div>
            <div nz-col nzSpan="16">
              接收单位地址：{{ orderInfo.receptionCompany ? orderInfo.receptionCompany.address : '' }}
            </div>
          </div>
        </div>
      </div>
    </overlay-scrollbars>
    <!-- 医废信息 -->
    <overlay-scrollbars
      #osComponentRef2
      style="flex:1;"
      *ngIf="tabType == 4"
    >
      <div class="content jifen">
        <div class="table">
          <nz-table
            class="integralTable"
            [nzData]="[1, 2]"
            nzSize="middle"
            [nzShowPagination]="null" [nzLoading]="hsLoading"
          >
            <thead>
              <tr class="thead">
                <th nzWidth="14%">医废类型</th>
                <th nzWidth="14%">序号</th>
                <th nzWidth="14%">重量（KG）</th>
                <th nzWidth="14%">科室名称</th>
                <th nzWidth="14%">收取人</th>
                <th nzWidth="14%">收取时间</th>
                <th nzWidth="16%">备注</th>
              </tr>
            </thead>
            <tbody>
              <tr *ngFor="let item of list; let i = index">
                <td>{{ item.clinicalWasteType ? item.clinicalWasteType.typeName : "" }}</td>
                <td>{{ item.clinicalWasteSn }}</td>
                <td>{{ item.weight }}</td>
                <td>{{ item.dept ? item.dept.dept : "" }}</td>
                <td>{{ item.receivor ? item.receivor.name : "" }}</td>
                <td>{{ item.receiveTime | date:'yyyy-MM-dd HH:mm:ss' }}</td>
                <td>{{ item.remark }}</td>
              </tr>
            </tbody>
          </nz-table>
          <div class="pagination">
            <ng-template #totalTemplate let-total> 共 {{ total }} 条 </ng-template>
            <nz-pagination [(nzPageIndex)]="pageIndex" [(nzTotal)]="total"
              [(nzPageSize)]="pageSize" (nzPageIndexChange)="getList()"
              (nzPageSizeChange)="getList()" [nzShowTotal]="totalTemplate">
            </nz-pagination>
          </div>
        </div>
      </div>
    </overlay-scrollbars>
  </div>
  <div class="btns">
    <button class="btn cancel" nz-button nzType="default" (click)="close()">
      关闭
    </button>
  </div>
</div>

<!-- 遮罩 -->
<app-mask *ngIf="maskFlag"></app-mask>
