<div class="list-template">
  <div class="list-template__content">
    <div class="list-template__top" nz-row>
      <div nz-col nzXl='17' class="list-template__searchBox">
        <div class="list-template__searchItem">
          <span class="label">工单单号</span>：
          <input nz-input class="formItem" placeholder="请输入工单单号" [(ngModel)]="gdcode" />
        </div>
        <div class="list-template__searchItem">
          <span class="label">统计分类</span>：
          <nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" [nzShowSearch]="false" nzAllowClear
            nzPlaceHolder="请选择统计分类" [ngModel]="statisticsDateType" (ngModelChange)="selectStatisticsDateType($event)">
            <nz-option *ngFor="let option of statisticsDateTypeList" [nzLabel]="option.name" [nzValue]="option.id"></nz-option>
          </nz-select>
        </div>
        <div class="list-template__searchItem">
          <span class="label label--big">任务类型</span>：
          <nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzServerSearch nzShowSearch
            (nzOnSearch)="changeTasktype($event)" nzAllowClear nzPlaceHolder="请选择任务类型" [(ngModel)]="tasktype">
            <ng-container *ngFor="let option of allTasktype">
              <nz-option *ngIf="!isLoading" [nzLabel]="option.taskName" [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" nzServerSearch nzShowSearch
            (nzOnSearch)="changeUser($event)" nzAllowClear nzPlaceHolder="请选择执行人员" [(ngModel)]="worker" [nzDisabled]="coopBtns.currentUser && !coopBtns.allOrders">
            <ng-container *ngFor="let option of allWorker">
              <nz-option *ngIf="!isLoading" [nzLabel]="option.name" [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" nzServerSearch nzShowSearch
            (nzOnSearch)="changeInp($event)" nzAllowClear nzPlaceHolder="请选择申请科室" [(ngModel)]="department" [nzDisabled]="coopBtns.currentDept && !coopBtns.allOrders">
            <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)]="gdState">
            <nz-option nzLabel="{{data.name}}" nzValue="{{data.id}}" *ngFor="let data of gdStates"></nz-option>
          </nz-select>
        </div>
        <div class="list-template__searchItem">
          <span class="label">发起时间</span>：
          <!-- <nz-range-picker [(ngModel)]="dateRange" (ngModelChange)="changeDate($event)"
            [nzDisabled]="checkOptionsOne[2]?.checked"></nz-range-picker> -->
          <nz-range-picker nzShowTime [(ngModel)]="dateRange" (nzOnCalendarChange)="onCalendarChangeDate($event)" (ngModelChange)="changeDate($event)"></nz-range-picker>
        </div>
      </div>
      <div nz-col nzXl='7' class="list-template__btns">
        <!-- <button nz-button class="btn default" *ngIf="coopBtns.del"
          [disabled]="!checkedDepIds.length||(checkOptionsOne[3]?.checked)" (click)='showDelModals($event)'>批量删除</button> -->
        <button nz-button class="btn default" *ngIf="coopBtns.del"
          [disabled]="!checkedDepIds.length||(checkOptionsOne[2]?.checked)" (click)='showDelModals($event)'>批量删除</button>
        <button nz-button class="btn default ml8" (click)='search()'>搜索</button>
        <button nz-button *ngIf="coopBtns.export" class="btn default ml8" (click)='export()'
          [nzLoading]="loading2">导出</button>
        <button nz-button class="btn default ml8" (click)='reset()'>重置</button>
				<button nz-button class="btn default ml8" (click)='showSearchModal()'>详细搜索</button>
			</div>
    </div>
    <div class="list-template__checkBoxes">
      <nz-checkbox-group [(ngModel)]="checkOptionsOne" (ngModelChange)="log(checkOptionsOne)"></nz-checkbox-group>
    </div>
    <div class="list-template__bottom">
      <nz-table class="list-template__nzTable" [nzData]="listOfData" nzSize="middle" [nzShowPagination]="false"
        [nzLoading]="loading1">
        <thead>
          <tr class="thead">
            <th nzWidth="5%" nzShowCheckbox [(nzChecked)]="isAllDisplayDataChecked"
              (nzCheckedChange)="checkAll($event)"></th>
            <th nzWidth="5%">序号</th>
            <th nzWidth="9%">单号|申请科室</th>
            <th nzWidth="18%">起点科室|终点科室</th>
            <th nzWidth="9%">统计分类|任务类型</th>
            <th nzWidth="27%">发起时间|备注</th>
            <th nzWidth="8%">执行人员|总积分</th>
            <th nzWidth="8%">状态|执行时长</th>
            <th nzWidth="11%">操作</th>
          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let data of listOfData;let index=index;" (click)="selectedListData(data)">
            <td nzShowCheckbox [nzDisabled]="data.gdState.value == 6 || data.gdState.value == 7"
              [(nzChecked)]="mapOfCheckedId[data.id]" (nzCheckedChange)="refreshStatus()"></td>
            <td>{{index+(pageIndex-1) * pageSize + 1}}</td>
            <td>{{ data.gdcode }}<br>{{ data.createDeptDTO ? data.createDeptDTO.dept : '' }}</td>
            <td>{{ data.startDept ? data.startDept.dept : '' }}<br>{{ data.endDeptsName || '' }}</td>
            <td>{{ data.taskType.statisticsDateType ? data.taskType.statisticsDateType.name : ''}}<br>{{ data.taskType.taskName }}<ng-container *ngIf="data.goodsRemark">-{{data.goodsRemark}}</ng-container></td>
            <td>{{ data.startTime|date:'yyyy-MM-dd HH:mm'}}<br>{{ data.workOrderRemark }}</td>
            <td>{{ data.worker?data.worker.name:'' }}<br>{{ data.grade ? data.grade.gradeTotal : '' }}</td>
            <td>{{ data.gdState.name }}<br>{{data.showTimeNum}}</td>
            <td>
              <div class="coop">
                <span *ngIf="coopBtns.look" (click)="detail($event,data.id)">查看</span>
                <!-- <span *ngIf="coopBtns.del&&data.gdState.value!=6&&data.gdState.value!=7&&!(checkOptionsOne[3]?.checked)"
                  (click)="showDelModal($event,data.id)">删除</span> -->
                <span *ngIf="coopBtns.del&&data.gdState.value!=6&&data.gdState.value!=7&&!(checkOptionsOne[2]?.checked)"
                  (click)="showDelModal($event,data.id)">删除</span>
              </div>
            </td>
          </tr>
        </tbody>
      </nz-table>
      <div class="list-template__pagination">
        <nz-pagination [(nzPageIndex)]="pageIndex" [(nzTotal)]="listLength" nzShowSizeChanger [(nzPageSize)]="pageSize"
          (nzPageIndexChange)="getList()" (nzPageSizeChange)="getList()">
        </nz-pagination>
      </div>
    </div>
  </div>
	
	<!-- 详细搜索模态框 -->
	<div class="save display_flex justify-content_flex-center align-items_center add" *ngIf="searchModal">
	  <div class="modalBody">
	    <div class="title">{{modelName}}<i class="icon_transport transport-guanbi" (click)="hideSearchModal()"></i></div>
	    <div class="content">
	      <form nz-form [formGroup]="validateSearchForm" class="addForm">
					<nz-form-item>
					  <nz-form-label [nzSpan]="6" nzFor="specialCloseFlag">特殊情况关闭</nz-form-label>
					  <nz-form-control [nzSpan]="18" nzErrorTip="请选择特殊情况关闭!">
							<nz-select class="formItem" formControlName="specialCloseFlag" [nzDropdownMatchSelectWidth]="false" [nzShowSearch]="false" nzAllowClear
							  nzPlaceHolder="请选择特殊情况关闭">
							  <nz-option nzLabel="是" nzValue="1"></nz-option>
							  <nz-option nzLabel="否" nzValue="0"></nz-option>
							</nz-select>
					  </nz-form-control>
					</nz-form-item>
	        <nz-form-item>
	          <nz-form-label [nzSpan]="6" nzFor="workOrderRemark">工单备注</nz-form-label>
	          <nz-form-control [nzSpan]="18" nzErrorTip="请选择工单备注!">
	            <input nz-input formControlName="workOrderRemark" class="formItem" placeholder="请输入工单备注" />
	          </nz-form-control>
	        </nz-form-item>
					<nz-form-item>
					  <nz-form-label [nzSpan]="6" nzFor="busiParent">业务父级</nz-form-label>
					  <nz-form-control [nzSpan]="18" nzErrorTip="请选择业务父级!">
					    <nz-select nzAllowClear [nzDropdownMatchSelectWidth]="false" formControlName="busiParent" nzShowSearch
					      nzPlaceHolder="请选择业务父级" nzServerSearch (nzOnSearch)="changeDeptInp($event)"
					      (nzOpenChange)="openDeptSelect($event)">
					      <ng-container *ngFor="let data of allParentdepart">
					        <nz-option *ngIf="!isLoading" [nzLabel]="data.dept" [nzValue]="data.id">
					        </nz-option>
					      </ng-container>
					      <nz-option *ngIf="isLoading" nzDisabled nzCustomContent>
					        <i nz-icon nzType="loading" class="loading-icon"></i> 搜索中...
					      </nz-option>
					    </nz-select>
					  </nz-form-control>
					</nz-form-item>

	      </form>
	    </div>
	    <div class="display_flex justify-content_flex-center">
	      <button nzType="primary" nz-button (click)="submitSearchModal()" [nzLoading]="btnLoading">确认搜索</button>
	      <button class="btn cancel" nz-button nzType="default" (click)="hideSearchModal()">取消</button>
	    </div>
	  </div>
	</div>
	
  <!-- 删除模态框 -->
  <app-dialog-delete [delModal]="delModal" (hideDelModalEvent)="hideDelModal()" [btnLoading]="loading3"
    (confirmDelEvent)="confirmDel()" content="您确认要删除工单吗？"></app-dialog-delete>

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

<!-- 查看详情 -->
<router-outlet></router-outlet>
