<div class="header">
  <div class="display_flex align-items_center flex-wrap">
    <div class="dept"><i class="icon icon_transport transport-fanhui" (click)='goBack()'></i></div>
    <div class="patient">
      <span class="label">预约时间:</span>
      <nz-range-picker nzShowTime [(ngModel)]="dateRange" (nzOnCalendarChange)="onCalendarChangeDate($event)"></nz-range-picker>
    </div>
    <div class="patient">
      <span class="label">科室:</span>
      <nz-select class="formItem" [nzDisabled]="disableDept" [nzDropdownMatchSelectWidth]="false" nzPlaceHolder="请选择科室" [(ngModel)]="searchDto.deptId" nzAllowClear nzServerSearch nzShowSearch (nzOnSearch)="changeInp('department', $event)" (nzOpenChange)="openChangeDepartment($event)" (ngModelChange)="setIsSelecting(true)">
        <ng-container *ngFor="let option of departmentList">
          <nz-option *ngIf="!isLoading" [nzLabel]="option.dept" [nzValue]="option.id"></nz-option>
        </ng-container>
        <nz-option *ngIf="isLoading" nzDisabled nzCustomContent>
          <i nz-icon nzType="loading" class="loading-icon"></i> 搜索中...
        </nz-option>
      </nz-select>
    </div>
    <div class="patient">
      <span class="label">患者:</span>
      <nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzPlaceHolder="请选择患者" [(ngModel)]="searchDto.patientId" nzAllowClear nzServerSearch nzShowSearch (nzOnSearch)="changeInp('patient', $event)" (nzOpenChange)="openChangePatient($event)" (ngModelChange)="setIsSelecting(true)">
        <ng-container *ngFor="let option of patientList">
          <nz-option *ngIf="!isLoading" [nzLabel]="option.patientName" [nzValue]="option.id"></nz-option>
        </ng-container>
        <nz-option *ngIf="isLoading" nzDisabled nzCustomContent>
          <i nz-icon nzType="loading" class="loading-icon"></i> 搜索中...
        </nz-option>
      </nz-select>
    </div>
    <div class="patient">
      <span class="label">状态:</span>
      <nz-select nzMode="multiple" class="formItem" [nzDropdownMatchSelectWidth]="false" nzPlaceHolder="请选择状态" [(ngModel)]="searchDto.stateValue" nzAllowClear>
        <ng-container *ngFor="let option of statusList">
          <nz-option *ngIf="!isLoading" [nzLabel]="option.name" [nzValue]="option.value"></nz-option>
        </ng-container>
        <nz-option *ngIf="isLoading" nzDisabled nzCustomContent>
          <i nz-icon nzType="loading" class="loading-icon"></i> 搜索中...
        </nz-option>
      </nz-select>
    </div>
    <div class="patient">
      <label nz-checkbox [(ngModel)]="autoRefresh" (ngModelChange)="changeAutoRefresh($event)">自动刷新</label>
      <nz-input-number [(ngModel)]="autoRefreshSecond" [nzMin]="15" [nzStep]="1" [nzPrecision]="0" [nzParser]="parserPercent" [nzFormatter]="formatterPercent"></nz-input-number>
    </div>
  </div>
  <div class="display_flex align-items_center ml8">
    <button nz-button class="btn default" (click)='reset()'>重置</button>
    <button nz-button class="btn default ml8" (click)='search()'>搜索</button>
  </div>
</div>
<div class="table">
  <nz-table class="list-template__nzTable" [nzData]="listOfData" nzSize="middle" [nzShowPagination]="false" [nzLoading]="loading1">
    <thead>
      <tr class="thead">
        <th nzWidth="13%">科室信息</th>
        <th nzWidth="13%">患者信息</th>
        <th nzWidth="13%">护理信息</th>
        <th nzWidth="13%">陪检方式</th>
        <th nzWidth="15%">检查项目</th>
        <th nzWidth="13%">签到信息</th>
        <th nzWidth="13%">状态</th>
        <th nzWidth="7%">操作</th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let data of listOfData">
        <td>{{data.deptName}}<br>{{data.deptDTO?.pcode}}</td>
        <td>{{data.patientName}}<ng-container *ngIf="data.age !== undefined">({{data.age}}岁)</ng-container><br><ng-container *ngIf="data.patientType && data.patientType.value == 'I'">住：{{data.patientCode}}（{{data.bedNum}}）</ng-container><ng-container *ngIf="data.patientType && data.patientType.value == 'O'">门诊：{{data.patientCode}}</ng-container><ng-container *ngIf="data.patientType && data.patientType.value == 'E'">急：{{data.patientCode}}</ng-container></td>
        <td>{{data.careLevel?.name}}<br>{{data.illnessState?.name}}</td>
        <td>{{data.tripTypeDTO?.inspectMode}}</td>
        <td><ng-container *ngFor="let item of data.inspectList;let last = last">{{item.inspectName}}<ng-container *ngIf="!last"><br></ng-container></ng-container></td>
        <td>{{ data.signTime | date: "yyyy-MM-dd HH:mm" }}<br>{{ data.signDeptDTO?.dept }}<br>{{ data.signUserDTO?.name }}</td>
        <td>{{data.state?.name}}</td>
        <td>
          <div class="coop">
            <span *ngIf="coopBtns.tagBackDepartment && data.state && data.state.value == '4'" (click)="showDelModal(data, '您确认' + data.patientName + '患者已回科吗？', '操作', 'tagBackDepartment')">已回科</span>
          </div>
        </td>
      </tr>
    </tbody>
  </nz-table>
</div>
<div class="footer display_flex align-items_center justify-content_flex-end">
  <nz-pagination [(nzPageIndex)]="pageIndex" [(nzTotal)]="listLength" [(nzPageSize)]="pageSize" nzShowSizeChanger (nzPageIndexChange)="getList(0)" (nzPageSizeChange)="getList(0)"></nz-pagination>
</div>
<!-- 操作成功/失败提示框 -->
<app-prompt-modal *ngIf="promptModalShow" [content]="promptContent" [success]="ifSuccess" [show]="promptModalShow"
  [info]="promptInfo">
</app-prompt-modal>

<!-- 删除模态框 -->
<app-dialog-delete [delModal]="delModal" (hideDelModalEvent)="hideDelModal()" [btnLoading]="btnLoading"
(confirmDelEvent)="confirmDel()" [content]="tipsMsg1"></app-dialog-delete>
