zy-pc/src/app/components/configurationCenter/configuration-manHour/configuration-manHour.component.html

<div class="content">
  <div class="contentInner">
    <div class="address">
      <div class="contentHead">工时大类
				<div>
					<button nz-button class="mar-rig-10 btn cancel" nzType="default" nzSize="small" *ngIf="activeCategory1.id && categoryList1.length" (click)="delCategoryModal(1)">删除</button>
          <button nz-button class="mar-rig-10 btn" nzType="primary" nzSize="small" *ngIf="activeCategory1.id && categoryList1.length" (click)="editCategoryModal(1)">编辑</button>
					<button nz-button nzType="primary" nzSize="small" (click)="addCategoryModal(1)">新增</button>
				</div>
			</div>
      <overlay-scrollbars #osComponentRef1 class="contentBody">
        <nz-spin nzSimple [nzSpinning]="categoryLoading1" class="mt8 text_align_center"></nz-spin>
        <div [hidden]="categoryLoading1" class="contentItem" [title]="item.workName" [ngClass]="{ active: item.id === activeCategory1.id }" (click)="clickCategory(item, 1)" *ngFor="let item of categoryList1">{{ item.workName }}</div>
      </overlay-scrollbars>
    </div>
    <div class="address">
      <div class="contentHead">工时小类
				<div>
					<button nz-button class="mar-rig-10 btn cancel" *ngIf="activeCategory2.id && activeCategory1.id" nzType="default" nzSize="small" (click)="delCategoryModal(2)">删除</button>
          <button nz-button class="mar-rig-10 btn" *ngIf="activeCategory2.id && activeCategory1.id" nzType="primary" nzSize="small" (click)="editCategoryModal(2)">编辑</button>
					<button nz-button nzType="primary" nzSize="small" *ngIf="activeCategory1.id" (click)="addCategoryModal(2)">新增</button>
				</div>
			</div>
      <overlay-scrollbars #osComponentRef2 class="contentBody">
        <nz-spin nzSimple [nzSpinning]="categoryLoading2" class="mt8 text_align_center"></nz-spin>
        <div [hidden]="categoryLoading2" class="contentItem" [title]="item.workName" [ngClass]="{ active: item.id === activeCategory2.id }" (click)="clickCategory(item, 2)" *ngFor="let item of categoryList2">{{ item.workName }}</div>
      </overlay-scrollbars>
    </div>
  </div>
</div>


<!-- 新增-->
<div class="save display_flex justify-content_flex-center align-items_center add" *ngIf="modalCategory">
  <div class="modalBody">
    <div class="title">新增<i class="icon_transport transport-guanbi" (click)="hideCategoryModal()"></i></div>
    <div class="content">
      <form nz-form [formGroup]="validateCategoryForm" class="addForm">
				<nz-form-item *ngIf="coopType === 2 && add">
				  <nz-form-label [nzSpan]="6" nzFor="workName">工时大类名称</nz-form-label>
				  <nz-form-control [nzSpan]="18">
				    <nz-input-group>
							<div>
								{{activeCategory1.workName}}
							</div>
						</nz-input-group>
				  </nz-form-control>
				</nz-form-item>
        <nz-form-item *ngIf="coopType === 2 && !add">
          <nz-form-label [nzSpan]="5" nzRequired nzFor="parent">工时大类</nz-form-label>
          <nz-form-control [nzSpan]="19" nzErrorTip="请选择工时大类!">
            <nz-select [nzDropdownMatchSelectWidth]="false" nzShowSearch nzAllowClear formControlName="parent" nzPlaceHolder="请选择工时大类">
              <ng-container *ngFor="let option of categoryList1">
                <nz-option *ngIf="!isLoading" [nzLabel]="option.workName" [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>
          </nz-form-control>
        </nz-form-item>

				<nz-form-item>
				  <nz-form-label [nzSpan]="5" nzRequired nzFor="workName">工时名称</nz-form-label>
				  <nz-form-control [nzSpan]="19" nzErrorTip="请填写工时名称!">
				    <nz-input-group>
				      <input nz-input formControlName="workName" placeholder="请填写工时名称" />
				    </nz-input-group>
				  </nz-form-control>
				</nz-form-item>
				<nz-form-item>
				  <nz-form-label [nzSpan]="5" nzRequired nzFor="workUnit">单位</nz-form-label>
				  <nz-form-control [nzSpan]="19" nzErrorTip="请填写单位(2个字以内)!">
				    <nz-input-group>
				      <input nz-input (input)="handleInput($event)" formControlName="workUnit" placeholder="请填写单位(2个字以内)" />
				    </nz-input-group>
				  </nz-form-control>
				</nz-form-item>
				<nz-form-item>
				  <nz-form-label [nzSpan]="5" nzRequired nzFor="wage">工价</nz-form-label>
				  <nz-form-control [nzSpan]="19" nzErrorTip="请填写工价!">
				   <nz-input-number
							formControlName="wage"
				    	[nzMin]="0"
							[nzPrecision]="2"
				    	[nzMax]="999999"
				    	[nzStep]="0.1"
				    	[nzPlaceHolder]="'请填写工价(保留2位小数)'"
				    ></nz-input-number>
				  </nz-form-control>
				</nz-form-item>
        <nz-form-item>
          <nz-form-label [nzSpan]="5" nzRequired nzFor="integral">工时积分</nz-form-label>
          <nz-form-control [nzSpan]="19" nzErrorTip="请选择工时积分!">
            <nz-select [nzDropdownMatchSelectWidth]="false" nzShowSearch nzAllowClear formControlName="integral" nzPlaceHolder="请选择工时积分">
              <ng-container *ngFor="let option of scoreList">
                <nz-option *ngIf="!isLoading" [nzLabel]="option.value" [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>
          </nz-form-control>
        </nz-form-item>
      </form>
    </div>
    <div class=" display_flex justify-content_flex-center">
      <button nzType="primary" nz-button (click)="submitCategoryForm()" [nzLoading]="btnLoading">确认</button>
      <button class="btn cancel" nz-button nzType="default" (click)="hideCategoryModal()">取消</button>
    </div>
  </div>
</div>

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

<!-- 删除模态框 -->
<app-dialog-delete [delModal]="delModal" (hideDelModalEvent)="hideDelModal()" [btnLoading]="btnLoading"
  (confirmDelEvent)="confirmDel()" (cancelDelEvent)="cancelDel()" [content]="delContent" confirmTxt="是" cancelTxt="否">
</app-dialog-delete>