zy-pc/src/app/views/quick-combination/quick-combination.component.html

<div class="list-template">
  <div class="list-template__content">
    <div class="list-template__top" nz-row>
      <div nz-col nzXl="15" class="list-template__btns justify-content_flex-start">
        <h2 class="qName">方案名称：{{queryParamsName}}</h2>
        <button class="btn default mr8" nzType="primary" nz-button (click)="takeEffect()">生效</button>
        <button class="btn default mr8" nz-button (click)="goToOther()">切换</button>
        <button class="btn default" nz-button (click)="goToWorkAssignment()">返回</button>
      </div>
      <div nz-col nzXl="9" class="list-template__btns">
        <button class="btn default" nzType="primary" nz-button (click)="addModal()">新增快捷组合</button>
        <button [disabled]="!checkedDepIds.length||!listOfData.length" class="btn default ml8" nzType="primary"
          nz-button (click)="showDelModal($event,checkedDepIds,'是否确定批量删除选中的快捷组合？','删除','del')">批量删除</button>
      </div>
    </div>
    <div class="list-template__top" nz-row>
      <div nz-col nzXl='15' class="list-template__searchBox">
        <div class="list-template__searchItem">
          <span class="label label--big">快捷组合名称：</span>
          <input nz-input class="formItem" placeholder="请输入关键字" [(ngModel)]="searchCriteria.name" />
        </div>
        <div class="list-template__searchItem">
          <span class="label">工作模式：</span>
          <nz-select [nzDropdownMatchSelectWidth]="false" class="formItem" nzShowSearch nzPlaceHolder="请选择工作模式"
            [(ngModel)]="searchCriteria.workModel">
            <nz-option nzLabel="{{data.name}}" nzValue="{{data.id}}" *ngFor="let data of allWorkModel"></nz-option>
          </nz-select>
        </div>
      </div>
      <div nz-col nzXl="9" class="list-template__btns">
        <button class="btn default" nzType="primary" nz-button (click)="reset()">重置</button>
        <button class="btn default ml8" nzType="primary" nz-button (click)="getList(1)">搜索</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%" nzShowCheckbox [(nzChecked)]="isAllDisplayDataChecked"
              (nzCheckedChange)="checkAll($event)"></th>
            <th [nzWidth]="queryParamsType==1?'10%':'19%'">名称</th>
            <th [nzWidth]="queryParamsType==1?'10%':'19%'">班次</th>
            <th nzWidth="8%">任务类型</th>
            <th nzWidth="16%">工作模式</th>
            <th nzWidth="10%" *ngIf="queryParamsType==1">科室</th>
            <th nzWidth="8%" *ngIf="queryParamsType==1">分配人员/组</th>
            <th nzWidth="8%" *ngIf="queryParamsType==2">分配组</th>
            <th nzWidth="33%">操作</th>
          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let data of listOfData;let i = index" (click)="selectedListData(data.id)">
            <td nzShowCheckbox [(nzChecked)]="mapOfCheckedId[data.id]" (nzCheckedChange)="refreshStatus()"></td>
            <td>{{data.configName||'-'}}</td>
            <td>
              {{data.classes?data.classes.name:'-'}}
            </td>
            <td>
              <div class="orderPlanTimeShow1" nz-tooltip nzTooltipTitle="{{data.taskTypesName?data.taskTypesName.join('、'):''}}">
                {{data.taskTypesName?data.taskTypesName.join('、'):''}}</div>
            </td>
            <td>
              {{data.ruleTypeName||'-'}}
            </td>
            <td *ngIf="queryParamsType==1">
              <div class="orderPlanTimeShow3" nz-tooltip nzTooltipTitle="{{data.departmentDTOSName?data.departmentDTOSName.join('、'):''}}">
                {{data.departmentDTOSName?data.departmentDTOSName.join('、'):''}}</div>
            </td>
            <td *ngIf="queryParamsType==1">
              <div class="orderPlanTimeShow2" nz-tooltip nzTooltipTitle="{{data.allName?data.allName.join('、'):''}}">
                {{data.allName?data.allName.join('、'):''}}</div>
            </td>
            <td *ngIf="queryParamsType==2">
              <div class="orderPlanTimeShow2" nz-tooltip nzTooltipTitle="{{data.allName?data.allName.join('、'):''}}">
                {{data.allName?data.allName.join('、'):''}}</div>
            </td>
            <td>
              <div class="coop">
                <span (click)="addPersonModal($event,data)" *ngIf="data.ruleType == 3&&queryParamsType==1">分配人员</span>
                <span (click)="addGroupsModal($event,data)"
                  *ngIf="(data.ruleType == 2||data.ruleType == 4)&&queryParamsType==1">分配分组</span>
                <span (click)="copy($event,data)">复制</span>
                <span (click)="edit($event,data)">修改</span>
                <span (click)="showDelModal($event,data.id,'是否确定删除【'+data.configName+'】快捷组合？','删除','del')">删除</span>
              </div>
            </td>
          </tr>
        </tbody>
      </nz-table>
      <div class="list-template__pagination">
        <nz-pagination nzShowSizeChanger [(nzPageIndex)]="pageIndex" [(nzTotal)]="listLength" [(nzPageSize)]="pageSize"
          (nzPageIndexChange)="getList(0)" (nzPageSizeChange)="getList(0)">
        </nz-pagination>
      </div>
    </div>
  </div>

  <!-- 新增/编辑模态框 -->
  <div class="save display_flex justify-content_flex-center align-items_center add" *ngIf="modal">
    <div class="modalBody">
      <div class="title">{{add?"新增":"编辑"}}快捷组合<i class="icon_transport transport-guanbi" (click)="hideAddModal()"></i>
      </div>
      <div class="content">
        <form nz-form [formGroup]="validateForm" class="addForm">
          <nz-form-item>
            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="quickCombinationName">快捷组合名称</nz-form-label>
            <nz-form-control nzErrorTip="请输入快捷组合名称!">
              <nz-input-group>
                <input nz-input formControlName="quickCombinationName" placeholder="请输入快捷组合名称" />
              </nz-input-group>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item>
            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="quickCombinationClass">班次</nz-form-label>
            <nz-form-control nzErrorTip="请输入班次!">
              <nz-select [nzDropdownMatchSelectWidth]="false" formControlName="quickCombinationClass" nzShowSearch
                nzPlaceHolder="请输入班次" nzServerSearch (nzOpenChange)="getClassList($event)"
                (ngModelChange)="selectClass($event)">
                <ng-container *ngFor="let data of classList">
                  <nz-option *ngIf="!cLoading" nzLabel="{{data.name}}" nzValue="{{data.id}}"></nz-option>
                </ng-container>
                <nz-option *ngIf="cLoading" nzDisabled nzCustomContent>
                  <i nz-icon nzType="loading" class="loading-icon"></i> 搜索中...
                </nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item>
            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="quickCombinationType">任务类型</nz-form-label>
            <nz-form-control nzErrorTip="请输入任务类型!">
              <nz-select [nzMode]="'multiple'" [nzDropdownMatchSelectWidth]="false"
                formControlName="quickCombinationType" nzShowSearch nzAllowClear nzPlaceHolder="请输入任务类型" nzServerSearch
                (nzOnSearch)="searchTaskList($event)" (nzOpenChange)="searchTaskList1($event)"
                (ngModelChange)="selectTaskList($event)">
                <ng-container *ngFor="let data of taskList">
                  <nz-option *ngIf="!tLoading" nzLabel="{{data.taskName}}" nzValue="{{data.id}}"
                    [nzDisabled]="data.showFlag === 0"></nz-option>
                </ng-container>
                <nz-option *ngIf="tLoading" nzDisabled nzCustomContent>
                  <i nz-icon nzType="loading" class="loading-icon"></i> 搜索中...
                </nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item>
            <nz-form-label [nzSm]="24" [nzXs]="24" nzRequired nzFor="quickCombinationModel">工作模式</nz-form-label>
            <nz-form-control nzErrorTip="请输入工作模式!">
              <nz-radio-group [(ngModel)]="quickCombinationModel" formControlName="quickCombinationModel"
                [nzDisabled]="!taskListFlag" (ngModelChange)="radioIt()">
                <label nz-radio nzValue="1">自由抢单</label>
                <label nz-radio nzValue="2" *ngIf="queryParamsType==1">指定分组</label>
                <label nz-radio nzValue="3">科室绑定人员</label>
                <label nz-radio nzValue="4" *ngIf="queryParamsType==1">科室绑定分组</label>
                <label nz-radio nzValue="5" *ngIf="queryParamsType==2">科室绑定分组</label>
                <label nz-radio nzValue="6" *ngIf="queryParamsType==2">绑定分组</label>
              </nz-radio-group>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item *ngIf="queryParamsType==1"
            [hidden]="quickCombinationModel == 1||quickCombinationModel==2||quickCombinationModel===''">
            <nz-form-label [nzSm]="6" [nzXs]="24" [nzRequired]="requireDept" nzFor="quickCombinationDept">选择科室
            </nz-form-label>
            <nz-form-control nzErrorTip="请选择科室!">
              <nz-select [nzMode]="'multiple'" [nzDropdownMatchSelectWidth]="false"
                formControlName="quickCombinationDept" nzShowSearch nzAllowClear nzPlaceHolder="请选择科室" nzServerSearch
                (nzOnSearch)="searchDeptList($event)" (nzOpenChange)="getDeptList($event)"
                (ngModelChange)="selectDeptList($event)">
                <ng-container *ngFor="let data of deptList">
                  <nz-option *ngIf="!dLoading" nzLabel="{{data.dept}}" 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>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item [hidden]="
          (queryParamsType==1&&(quickCombinationModel != 2||quickCombinationModel===''))||
          (queryParamsType==2&&((quickCombinationModel != 5 && quickCombinationModel != 6)||quickCombinationModel===''))">
            <nz-form-label [nzSm]="6" [nzXs]="24" [nzRequired]="requireGroup" nzFor="quickCombinationGroup">选择分组
            </nz-form-label>
            <nz-form-control nzErrorTip="请选择分组!">
              <nz-select [nzMode]="quickCombinationModel == 6?'default':'multiple'" [nzDropdownMatchSelectWidth]="false"
                formControlName="quickCombinationGroup" nzShowSearch nzAllowClear nzPlaceHolder="请选择分组" nzServerSearch
                (nzOnSearch)="searchGroupList($event)" (nzOpenChange)="getGroupList($event)"
                (ngModelChange)="selectGroupList($event)">
                <ng-container *ngFor="let data of groupList">
                  <nz-option *ngIf="!gLoading" nzLabel="{{data.groupName}}" nzValue="{{data.id}}"></nz-option>
                </ng-container>
                <nz-option *ngIf="gLoading" nzDisabled nzCustomContent>
                  <i nz-icon nzType="loading" class="loading-icon"></i> 搜索中...
                </nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item [hidden]="!(queryParamsType == 1 && quickCombinationModel == 1)">
            <nz-form-label [nzSm]="24" [nzXs]="24" nzRequired nzFor="quickCombinationDispatchMethod">派单方式</nz-form-label>
            <nz-form-control nzErrorTip="请选择派单方式!">
              <nz-radio-group formControlName="quickCombinationDispatchMethod" (ngModelChange)="radioDispatchMethod($event)">
                <label nz-radio [nzValue]="item.value" *ngFor="let item of dispatchMethods">{{item.name}}</label>
              </nz-radio-group>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item [hidden]="!(queryParamsType == 1 && quickCombinationModel == 1 && validateForm.value.quickCombinationDispatchMethod == 2)">
            <nz-form-label [nzSm]="24" [nzXs]="24" nzRequired nzFor="quickCombinationDispatchType">自动派单类型</nz-form-label>
            <nz-form-control nzErrorTip="请选择自动派单类型!">
              <nz-radio-group formControlName="quickCombinationDispatchType" (ngModelChange)="radioDispatchType($event)">
                <label nz-radio [nzValue]="item.value" *ngFor="let item of dispatchTypes">{{item.name}}</label>
              </nz-radio-group>
            </nz-form-control>
          </nz-form-item>
          <nz-form-item [hidden]="!(queryParamsType == 1 && quickCombinationModel == 1 && validateForm.value.quickCombinationDispatchMethod == 2 && validateForm.value.quickCombinationDispatchType == 1)">
            <nz-form-label [nzSm]="24" [nzXs]="24" nzRequired nzFor="quickCombinationDispatchWeight">最高权重</nz-form-label>
            <nz-form-control nzErrorTip="请选择最高权重!">
              <nz-input-group>
                <input nz-input type="number" formControlName="quickCombinationDispatchWeight" placeholder="请输入最高权重" />
              </nz-input-group>
            </nz-form-control>
          </nz-form-item>
        </form>
      </div>
      <div class=" display_flex justify-content_flex-center">
        <button nzType="primary" nz-button (click)="submitForm()" [nzLoading]="btnLoading">保存</button>
        <button class="btn cancel" nz-button nzType="default" (click)="hideAddModal()">取消</button>
      </div>
    </div>
  </div>
  <!-- 分配人员模态框 -->
  <div class="save display_flex justify-content_flex-center align-items_center add" *ngIf="personModal">
    <div class="modalBody">
      <div class="title">分配人员<i class="icon_transport transport-guanbi" (click)="hidePersonModal()"></i>
      </div>
      <div class="content">
        <form nz-form [formGroup]="validatePersonForm" class="addForm" (ngSubmit)="submitPersonForm()">
          <nz-form-item>
            <nz-form-label [nzSm]="24" [nzXs]="24" nzRequired nzFor="quickCombinationPerson">人员选择</nz-form-label>
            <nz-form-control [nzSm]="24" [nzXs]="24" nzErrorTip="请选择人员!">
              <nz-select [nzDropdownMatchSelectWidth]="false"
                formControlName="quickCombinationPerson" nzShowSearch nzAllowClear nzPlaceHolder="请选择人员" nzServerSearch
                (nzOnSearch)="searchPersonList($event)" (nzOpenChange)="getPersonList($event)">
                <ng-container *ngFor="let data of personList">
                  <nz-option *ngIf="!pLoading" nzLabel="{{data.name}}" nzValue="{{data.id}}"></nz-option>
                </ng-container>
                <nz-option *ngIf="pLoading" 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)="submitPersonForm()" [nzLoading]="btnLoading">确定</button>
        <button class="btn cancel" nz-button nzType="default" (click)="hidePersonModal()">取消</button>
      </div>
    </div>
  </div>
  <!-- 分配分组模态框 -->
  <div class="save display_flex justify-content_flex-center align-items_center add" *ngIf="groupsModal">
    <div class="modalBody">
      <div class="title">分配分组<i class="icon_transport transport-guanbi" (click)="hideGroupsModal()"></i>
      </div>
      <div class="content">
        <form nz-form [formGroup]="validateGroupForm" class="addForm" (ngSubmit)="submitGroupsForm()">
          <nz-form-item>
            <nz-form-label [nzSm]="24" [nzXs]="24" nzRequired nzFor="quickCombinationGroups">分组选择</nz-form-label>
            <nz-form-control [nzSm]="24" [nzXs]="24" nzErrorTip="请选择分组!">
              <nz-select [nzMode]="'multiple'" [nzDropdownMatchSelectWidth]="false"
                formControlName="quickCombinationGroups" nzShowSearch nzAllowClear nzPlaceHolder="请选择分组" nzServerSearch
                (nzOnSearch)="searchGroupsList($event)" (nzOpenChange)="getGroupsList($event)">
                <ng-container *ngFor="let data of groupsList">
                  <nz-option *ngIf="!gpLoading" nzLabel="{{data.groupName}}" nzValue="{{data.id}}"></nz-option>
                </ng-container>
                <nz-option *ngIf="gpLoading" 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)="submitGroupsForm()" [nzLoading]="btnLoading">确定</button>
        <button class="btn cancel" nz-button nzType="default" (click)="hideGroupsModal()">取消</button>
      </div>
    </div>
  </div>
  <!-- 删除模态框 -->
  <app-dialog-delete [delModal]="delModal" (hideDelModalEvent)="hideDelModal()" [btnLoading]="btnLoading"
    (confirmDelEvent)="confirmDel()" [content]="tipsMsg1"></app-dialog-delete>
</div>
<!-- 提示模态框 -->
<div class="save display_flex justify-content_flex-center align-items_center" *ngIf="tipModal">
  <div class="modalBody">
    <div class="title">提示<i class="icon_transport transport-guanbi" (click)="hideTipModal()"></i></div>
    <div class="content">
      <div class="icon"><i class="icon_transport transport-wenhao"></i></div>
      <div class="defeat" style="font-size: 16px;">是否确定离开该界面，如果未点击生效，数据可能会遗失？</div>
    </div>
    <div class="display_flex justify-content_flex-center">
      <button nz-button nzType="primary" (click)="confirmTip()">确认</button>
      <button class="btn cancel " nz-button nzType="default" (click)="hideTipModal()">关闭</button>
    </div>
  </div>
</div>
<!-- 操作成功/失败提示框 -->
<app-prompt-modal *ngIf="promptModalShow" [content]="promptContent" [success]="ifSuccess" [show]="promptModalShow"
  [info]="promptInfo" [loading]="showLoading">
</app-prompt-modal>
<!-- 查看详情 -->
<router-outlet></router-outlet>
<!-- 遮罩 -->
<app-mask *ngIf="maskFlag"></app-mask>