<div class="TaskTypeManagement">
  <div class="taskTypeInfo">
    <div class="top">
      <div class="item" (click)="tabModal('characteristics')" [ngClass]="{'items':tabModalName=='characteristics'}">
        特性配置
      </div>
      <div class="item" (click)="tabModal('automaticOrderCreation')" [ngClass]="{'items':tabModalName=='automaticOrderCreation'}">
        自动建单配置
      </div>
    </div>
    <div class="list" *ngIf="!loading">
      <!-- 特性配置 -->
      <div *ngIf="tabModalName=='characteristics'">
        <!-- 多人模式支持 -->
        <div class="display_flex align-items_center mb8">
          <nz-form-label class="label">多人模式支持</nz-form-label>
          <nz-checkbox-group [(ngModel)]="clinicalMultiplayerMode" (ngModelChange)="changeMultiplayerMode($event)"></nz-checkbox-group>
        </div>
        <!-- 积分计算方式 -->
        <div class="display_flex align-items_center mb8" *ngIf="clinicalMultiplayerMode[0].checked">
          <nz-form-label class="label" nzRequired>积分计算方式</nz-form-label>
          <nz-select class="w320px" [nzDropdownMatchSelectWidth]="false" nzPlaceHolder="请选择" [(ngModel)]="clinicalIntegralCalculationMethod">
            <ng-container *ngFor="let data of clinicalIntegralCalculationMethods">
              <nz-option *ngIf="!dLoading" nzLabel="{{data.name}}" nzValue="{{data.id}}"></nz-option>
            </ng-container>
            <nz-option *ngIf="dLoading" nzDisabled nzCustomContent>
              <i nz-icon nzType="loading" class="loading-icon"></i> 搜索中...
            </nz-option>
          </nz-select>
        </div>
        <!-- 执行方式 -->
        <div class="display_flex align-items_center mb8" *ngIf="clinicalMultiplayerMode[0].checked">
          <nz-form-label class="label" nzRequired>执行方式</nz-form-label>
          <nz-select class="w320px" [nzDropdownMatchSelectWidth]="false" nzPlaceHolder="请选择" [(ngModel)]="clinicalExecutionMethod">
            <ng-container *ngFor="let data of clinicalExecutionMethods">
              <nz-option *ngIf="!dLoading" nzLabel="{{data.name}}" nzValue="{{data.id}}"></nz-option>
            </ng-container>
            <nz-option *ngIf="dLoading" nzDisabled nzCustomContent>
              <i nz-icon nzType="loading" class="loading-icon"></i> 搜索中...
            </nz-option>
          </nz-select>
        </div>
        <!-- 关联任务类型 -->
        <div class="display_flex align-items_center mb8" *ngIf="clinicalMultiplayerMode[0].checked">
          <nz-form-label class="label" nzRequired>关联任务类型</nz-form-label>
          <nz-select nzMode="multiple" class="w320px" [nzDropdownMatchSelectWidth]="false" nzServerSearch nzShowSearch nzAllowClear
            (nzOnSearch)="changeTasktype($event)" nzPlaceHolder="请选择关联任务类型" [(ngModel)]="clinicalTaskIds">
            <ng-container *ngFor="let option of taskTypes">
              <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="display_flex align-items_center mb8" *ngIf="clinicalMultiplayerMode[0].checked">
          <nz-form-label class="label">列表是否显示追加人按钮</nz-form-label>
          <nz-checkbox-group [(ngModel)]="showAppendUser"></nz-checkbox-group>
        </div>
      </div>
      <!-- 自动建单配置 -->
      <div *ngIf="tabModalName=='automaticOrderCreation'">
      </div>
      <div class="bottom">
        <button class="login-form-button" nzType="primary" [nzLoading]="btnLoading" nz-button (click)="submitForm()">保存</button>
      </div>
    </div>
    <div class="list" *ngIf="loading">
      <div class="loadingFull display_flex justify-content_flex-center align-items_center">
        <div class="loadingFullInner">
          <img src="../../../assets/images/loading.gif" alt="">
          <div>加载中...</div>
        </div>
      </div>
    </div>
  </div>
</div>
