<div class="modal display_flex align-items_center">
  <div class="modalBody">
    <div class="title">待回访<i class="icon_transport transport-guanbi" (click)="hideModal()"></i></div>
    <div class="content">
      <div class="tabs">
        <div class="tab" [ngClass]="{'active': queryTask == item.key}" (click)="changeTab(item.key)" *ngFor="let item of tabs">{{item.value}}<span [ngClass]="{ red: item.isRed && item.num > 0}">({{item.num}})</span></div>
      </div>
      <div class="list-template w100" style="padding: 16px;">
        <div class="list-template__content">
          <div class="list-template__top" nz-row style="padding: 0;">
            <div nz-col nzXl='20' class="list-template__searchBox">
              <div class="list-template__searchItem" *ngIf="coopBtns.strideLook && queryTask!='todo' && queryTask!='doing' && queryTask!='storage'">
                <span class="label">维修科室</span>：
                <nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzShowSearch
                   (ngModelChange)="deptChange($event)" nzAllowClear nzPlaceHolder="请选择维修科室" [(ngModel)]="searchDTO.maintainDepartment">
                  <ng-container *ngFor="let option of maintainDept">
                    <nz-option [nzLabel]="option.hosName" [nzValue]="option.id"></nz-option>
                  </ng-container>
                </nz-select>
              </div>
              <div class="list-template__searchItem">
                <span class="label">登记时间</span>：
                <nz-range-picker style="width: 373px;" nzShowTime [(ngModel)]="searchDTO.dateRange" (nzOnCalendarChange)="onCalendarChangeDate($event)"></nz-range-picker>
              </div>
              <div class="list-template__searchItem">
                <span class="label">事件单号</span>：
                <input nz-input class="formItem" placeholder="请输入事件单号" [(ngModel)]="searchDTO.incidentsign" />
              </div>
              <div class="list-template__searchItem">
                <span class="label">报修科室</span>：
                <nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzServerSearch nzShowSearch
                  (nzOnSearch)="changeInp($event)" nzAllowClear nzPlaceHolder="请选择报修科室" [(ngModel)]="searchDTO.department">
                  <ng-container *ngFor="let option of alldepart">
                    <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="list-template__searchItem">
                <span class="label">状态</span>：
                <nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" [nzShowSearch]="false" nzAllowClear
                  nzPlaceHolder="请选择状态" [(ngModel)]="searchDTO.statusId">
                  <nz-option [nzLabel]="data.name" [nzValue]="data.id" *ngFor="let data of gdStates"></nz-option>
                </nz-select>
              </div>
            </div>
            <div nz-col nzXl='4' class="list-template__btns">
              <button nz-button class="btn default ml8 mt0" (click)='search()'>搜索</button>
              <button nz-button class="btn default ml8 mt0" (click)='reset()'>重置</button>
            </div>
          </div>
        </div>
      </div>
      <div class="tableWrap">
        <nz-table class="hospitalTable" [nzData]="listOfData" nzSize="small" [nzShowPagination]="false" [nzLoading]="loading1">
          <thead>
            <tr class="thead">
              <th nzWidth="5%">序号</th>
              <th nzWidth="27%">故障信息</th>
              <th nzWidth="14%">详细地址</th>
              <th nzWidth="12%">联系信息</th>
              <th nzWidth="12%">受理人|处理人/组</th>
              <th nzWidth="10%">延期记录</th>
              <th nzWidth="8%">状态</th>
              <th nzWidth="12%">操作</th>
            </tr>
          </thead>
          <tbody>
            <tr *ngFor="let data of listOfData;let index=index;" (click)="detail($event,data)">
              <td>{{index+(pageIndex-1) * pageSize + 1}}</td>
              <td class="text_align_left">
                <span [ngClass]="priorityColor(data.priorityId)">{{ data.priorityDTO?.name }}</span>
                {{ data.incidentsign }} {{ data.acceptDate | date: 'yyyy-MM-dd HH:mm' }}<br>{{ data.description }}
                <i class="icon_transport transport-a-11111 ml8" *ngIf="data.reqAttachment"></i>
                <i class="icon_transport transport-luyin ml8" *ngIf="data.reqRecord"></i>
              </td>
              <td class="text_align_left">
                {{ data.hosName || '无' }}<br>
                <ng-container *ngIf="data.repairIncidentType.value === 'public'">
                  {{ data.repairIncidentType.name }}<br>
                </ng-container>
                <ng-container *ngIf="data.repairIncidentType.value === 'dept'">
                  {{ data.department?.dept || '无' }}<br>
                </ng-container>
                {{ data.place ? data.place.building.buildingName : '' }}{{ data.place ? data.place.floorName + '层' : '' }}{{ data.houseNumber }}
              </td>
              <td class="text_align_left">
                {{ data.requester?.name || '无' }}<br>
                联电：{{ data.contactsInformation || '无' }}<br>
                来电：{{ data.incomingPhone || '无' }}
                <i class="icon_transport transport-luyin ml8" *ngIf="data.callID"></i>
              </td>
              <td>
                {{ data.acceptUser?.name || '无' }}<br>
                {{ transferSynergetic(data) }}<br>
                <ng-container *ngIf="(data.state.value === 'pending' || data.state.value === 'reassign') && data.overdueResponseDate"><span [ngStyle]="{ color: data.acceptColourInfo ? data.acceptColourInfo.value : '' }">{{ data.overdueResponseDate | date: 'MM-dd HH:mm' }}</span>前接单</ng-container>
                <ng-container *ngIf="data.state.value === 'handler' && data.overdueTime"><span [ngStyle]="{ color: data.handleColourInfo ? data.handleColourInfo.value : '' }">{{ data.overdueTime | date: 'MM-dd HH:mm' }}</span>前处理</ng-container>
              </td>
              <td [innerHTML]="data.overtimeRemark"></td>
              <td>{{ data.state?.name }}</td>
              <td>
                <div class="coop">
                  <span *ngIf="data.computedVisitFlag" (click)="visit($event,data)">回访</span>
                </div>
              </td>
            </tr>
          </tbody>
        </nz-table>
        <div class="pagination">
          <ng-template #totalTemplate let-total> 共 {{ total }} 条 </ng-template>
          <nz-pagination [(nzPageIndex)]="pageIndex" [(nzTotal)]="listLength"
            [(nzPageSize)]="pageSize" (nzPageIndexChange)="getList()"
            (nzPageSizeChange)="getList()" [nzShowTotal]="totalTemplate">
          </nz-pagination>
        </div>
      </div>
    </div>
  </div>
</div>
<!-- 操作成功/失败提示框 -->
<app-prompt-modal *ngIf="promptModalShow" [content]="promptContent" [success]="ifSuccess" [show]="promptModalShow" [info]="promptInfo"></app-prompt-modal>

<!-- 详情 -->
<app-incident-detail [id]="coopData.id" *ngIf="detailModalShow" (closeModelHs)="closeDetailModelOrder($event)" (confirmModelHs)="confirmDetailModelOrder($event)"></app-incident-detail>

<!-- 回访 -->
<app-incident-visit [id]="coopData.id" *ngIf="visitModalShow" (closeModelHs)="closeVisitModelOrder($event)" (confirmModelHs)="confirmVisitModelOrder($event)"></app-incident-visit>
