<div class="list-template">
  <div class="list-template__content">
    <div class="list-template__top" nz-row>
      <div nz-col nzLg='18' class="list-template__searchBox">
				<div class="list-template__searchItem" *ngIf="coopBtns.strideLook">
				  <span class="label">维修科室</span>：
				  <nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzShowSearch
				     nzAllowClear nzPlaceHolder="请选择维修科室" [(ngModel)]="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>
          <input nz-input class="formItem" [(ngModel)]="title" placeholder="请输入标题" nzSize="default" />
        </div>
        <div class="list-template__searchItem">
          <span class="label">编号：</span>
          <input nz-input class="formItem" [(ngModel)]="solutionNumber" placeholder="请输入编号" nzSize="default" />
        </div>
        <div class="list-template__searchItem">
          <span class="label">创建人</span>：
          <nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzServerSearch nzShowSearch
            (nzOnSearch)="changeUser($event)" nzAllowClear nzPlaceHolder="请选择创建人" [(ngModel)]="createUserId">
            <ng-container *ngFor="let option of createUserList">
              <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>
      <div nz-col nzLg="6" class="list-template__btns">
        <button class="btn default" (click)='search()'>搜索</button>
        <button class="btn default ml8" (click)='reset()'>重置</button>
				<button *ngIf="coopBtns.add" class="btn default ml8" (click)='addForm()'>新增</button>
      </div>
    </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%">序号</th>
						<th nzWidth="10%">知识库编号</th>
            <th nzWidth="25%">标题</th>
            <th nzWidth="15%">版本号 | 分类</th>
            <th nzWidth="15%">创建人 | 日期</th>
						<th nzWidth="10%">状态</th>
            <th nzWidth="20%">操作</th>
          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let data of listOfData let index=index;" (click)="selectedListData(data.id)">
            <td>{{index+(pageIndex-1) * pageSize + 1}}</td>
						<td>{{ data.solutionNumber }}</td>
						<td>{{ data.title }}</td>
						<td>
							<div>V{{ data.versionNumber }}</div>
							<div>{{ data.type ? data.type.name : '-' }}</div>
						</td>
						<td>
							<div>{{ data.createUser.name }}</div>
							<div>{{ data.createTime|date:'yyyy-MM-dd HH:mm' }}</div>
						</td>
						<td>{{ data.status ? data.status.name : '-' }}</td>
            <td>
              <div class="coop">
								<span *ngIf="coopBtns.edit && (data.status.name=='暂存' || data.status.name=='待整改')" (click)="edit($event,data)">编辑</span>
								<span *ngIf="coopBtns.look" (click)="look($event,data)">查看</span>
								<span *ngIf="coopBtns.upgrade && data.status.name=='已发布'" (click)="upgrade($event,data)">升级</span>
								<span *ngIf="coopBtns.audit && data.status.name=='待审核'" (click)="audit($event,data)">审核</span>
								<span *ngIf="coopBtns.pause && data.status.name=='已发布'" (click)="pause($event,data)">停用</span>
								<span *ngIf="coopBtns.renew && data.status.name=='已停用'" (click)="renew($event,data)">恢复</span>
								<span *ngIf="coopBtns.del" (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 add display_flex align-items_center justify-content_flex-center" *ngIf="modal">
    <div class="modalBody">
      <div class="title">{{optType=='audit'?'审核':'查看'}}</div>
      <!-- <overlay-scrollbars #osComponentRef1 class="content"> -->
       <div class="view-box">
				 <div class="view-item left-box">
					 <div class="item-left-list"
					 [ngClass]="{'activeClass': index == vIndex}"
					 *ngFor="let item of detailData let index=index;" (click)="versionsClick(item, index)">V{{item.versionNumber}}</div>
				 </div>
				 <div class="view-item center-box" *ngIf="lookData&&lookData.title">
					 <div class="title">{{lookData.title}}</div>
					 <div class="title-sign">
						 <div class="width-180">知识分类：{{lookData.type.name}}</div>
						 <div>报修可见：{{lookData.repairVisible=='1'?'是':'否'}}</div>
						 <div>版本号：V{{lookData.versionNumber || ''}}</div>
					 </div>
					 <div class="title-sign">
						 <div class="width-180" *ngIf="lookData.type.name=='故障现象'">关联故障：{{lookData.incidentCategory?lookData.incidentCategory.mutiCategory: ''}}</div>
						 <div class="width-180" *ngIf="lookData.type.name=='日常巡检'">关联巡检：{{lookData.inspectionForm?lookData.inspectionForm.name: ''}}</div>
						 <div>关联产品：{{lookData.assetProduct?lookData.assetProduct.name:''}}</div>
					 </div>
					 <div class="content-class" *ngIf="richText" [innerHTML]="richText"></div>
					 <div class="file-box" *ngIf="fileData.length>0">
						 <div>附件列表：</div>
						 <div>
							 <div class="file-class" *ngFor="let item of fileData" (click)="fileClick(item)">
								 {{item.name}}
								<span nz-icon nzType="download" nzTheme="outline" class="download-icon"></span>
							 </div>
						 </div>
					 </div>
				 </div>
				 <div class="view-item right-box" *ngIf="solutionLogs">
					 <nz-steps [nzCurrent]="stepLength" nzDirection="vertical" nzSize="small">
						<ng-container *ngFor="let item of solutionLogs; let index = index">
						    <nz-step
						      [nzDescription]="tpl"
						    >
						    </nz-step>
						    <ng-template #tpl>
									<div *ngIf="index==solutionLogs.length-1" class="step-size">
										<div>
											<span style="color: #49B856;">{{item.operationStatus.name}}</span>
											&nbsp;&nbsp;&nbsp;
											<span style="color:#333;">{{item.operationUser.name}}</span>
										</div>
										<div style="color:#333;">{{ item.time }}</div>
										<div class="back-class" nz-tooltip [nzTooltipTitle]="item.rejectedReason" *ngIf="item.operationStatus.name=='审核驳回'">(驳回原因)</div>
									</div>
									<div *ngIf="index!=solutionLogs.length-1" class="step-size">
										<div>
											<span>{{item.operationStatus.name}}</span>
											&nbsp;&nbsp;&nbsp;
											<span>{{item.operationUser.name}}</span>
										</div>
										<div>{{ item.time }}</div>
										<div class="back-class" nz-tooltip [nzTooltipTitle]="item.rejectedReason" *ngIf="item.operationStatus.name=='审核驳回'">(驳回原因)</div>
									</div>
						    </ng-template>
						  </ng-container>
					 </nz-steps>
				 </div>
			 </div>
      <!-- </overlay-scrollbars> -->
      <div class="display_flex justify-content_flex-center">
        <button class="btn" *ngIf="optType=='audit' && vIndex==0" nz-button nzType="primary" (click)="submitForm(1)" [nzLoading]="btnLoading1">通过</button>
				<button class="btn" *ngIf="optType=='audit' && vIndex==0" nz-button nzType="primary" (click)="submitForm(2)" [nzLoading]="btnLoading2">驳回</button>
				<button class="btn cancel" *ngIf="optType=='audit'" nz-button nzType="default" (click)="hideModal()">取消</button>
				<button class="btn" *ngIf="optType=='look'" nz-button nzType="primary" (click)="hideModal()">知道了</button>

			</div>
			<div class="mask-style" *ngIf="isSpinning">
				<nz-spin nzSimple class="spin-style"></nz-spin>
			</div>
    </div>
  </div>
  <!-- 删除模态框 -->
  <app-dialog-delete [delModal]="delModal" (hideDelModalEvent)="hideDelModal()" [btnLoading]="btnLoading"
    (confirmDelEvent)="confirmDel()" content="您确认要删除此知识库吗？"></app-dialog-delete>

	<!-- 停用模态框 -->
	<app-dialog-delete [delModal]="pauseModal" (hideDelModalEvent)="hideDelModal2()" [btnLoading]="btnLoading"
	  (confirmDelEvent)="confirmDel2()" content="您确认要停用此知识库吗？"></app-dialog-delete>

	<!-- 恢复模态框 -->
	<app-dialog-delete [delModal]="renewModal" (hideDelModalEvent)="hideDelModal3()" [btnLoading]="btnLoading"
		(confirmDelEvent)="confirmDel3()" content="您确认要恢复此知识库吗？"></app-dialog-delete>

	<!-- 审核通过模态框 -->
	<app-dialog-delete [delModal]="auditModal" (hideDelModalEvent)="hideDelModal4()" [btnLoading]="btnLoading"
		(confirmDelEvent)="confirmDel4()" content="您确认通过此知识库的审核吗？"></app-dialog-delete>

	<!-- 审核驳回模态框 -->
	<nz-modal [(nzVisible)]="rejectModal" nzTitle="您确认驳回此知识库吗？" (nzOnCancel)="rejectCancel()" (nzOnOk)="rejectOk()">
		<textarea
			nz-input
			[(ngModel)]="rejectData"
			placeholder="请输入整改意见"
			[nzAutosize]="{ minRows: 2, maxRows: 6 }"

		></textarea>
	</nz-modal>

  <!-- 编辑模态框 -->
  <app-dialog-delete [delModal]="editModal" (hideDelModalEvent)="hideDelModal1()" [btnLoading]="saveLoading"
    (confirmDelEvent)="confirmDel1()" [content]="'保存后会重置您的发药科室的药品信息，您确认吗？'"></app-dialog-delete>

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

