cd-project-management-web/src/app/routes/project-manage-archives/add/serviceta/serviceta.component.html

<!-- 服务 -->
<form nz-form>
  <div nz-row [nzGutter]="24">
    <div nz-col [nzSpan]="6">
      <nz-form-item>
        <nz-form-label [nzSpan]="8">客户编码</nz-form-label>
        <nz-form-control [nzSm]="16" [nzXs]="24">{{projectManageArchives.cusCode}}</nz-form-control>
      </nz-form-item>
    </div>
    <div nz-col [nzSpan]="6">
      <nz-form-item>
        <nz-form-label [nzSpan]="8">客户名称</nz-form-label>
        <nz-form-control [nzSm]="16" [nzXs]="24">{{projectManageArchives.cusName}}</nz-form-control>
      </nz-form-item>
    </div>
    <div nz-col [nzSpan]="6">
      <nz-form-item>
        <nz-form-label [nzSpan]="8">服务项目经理</nz-form-label>
        <nz-form-control [nzSm]="16" [nzXs]="24">{{projectManageArchives.seManager}}</nz-form-control>
      </nz-form-item>
    </div>
    <div nz-col [nzSpan]="6">
      <nz-form-item>
        <nz-form-label [nzSpan]="8">服务工程师</nz-form-label>
        <nz-form-control [nzSm]="16" [nzXs]="24">{{projectManageArchives.seEngineer}}</nz-form-control>
      </nz-form-item>
    </div>
  </div>
</form>

<!-- 汇款信息 -->
<nz-card nzTitle="回款信息" nzSize="small">
  <nz-table nzBordered nzSize="small" [nzNoResult]="' '" [nzShowPagination]="false">
    <tbody>
      <tr>
        <td><strong>服务金额</strong></td>
        <td>第一笔</td>
        <td>{{remittanceInformation.price1}}</td>
        <td>第二笔</td>
        <td>{{remittanceInformation.price2}}</td>
        <td>第三笔</td>
        <td>{{remittanceInformation.price3}}</td>
        <td>第四笔</td>
        <td>{{remittanceInformation.price4}}</td>
        <td>第五笔</td>
        <td>{{remittanceInformation.price5}}</td>
      </tr>
      <tr>
        <td><strong>实际回款</strong></td>
        <td>{{remittanceInformation.milestone1}}</td>
        <td>{{remittanceInformation.desc1}}</td>
        <td>{{remittanceInformation.milestone2}}</td>
        <td>{{remittanceInformation.desc2}}</td>
        <td>{{remittanceInformation.milestone3}}</td>
        <td>{{remittanceInformation.desc3}}</td>
        <td>{{remittanceInformation.milestone4}}</td>
        <td>{{remittanceInformation.desc4}}</td>
        <td>{{remittanceInformation.milestone5}}</td>
        <td>{{remittanceInformation.desc5}}</td>
      </tr>
    </tbody>
  </nz-table>
</nz-card>

<!-- 实施计划 -->
<nz-card nzTitle="服务计划" nzSize="small">
  <div nz-row [nzGutter]="24">
    <div nz-col [nzSpan]="24">
      <!-- 新增按钮 -->
      <button (click)="addParent()" nz-button nzType="primary">{{ 'button.add' | translate }}</button>
    </div>
  </div>
  <div nz-row [nzGutter]="24">
    <div nz-col [nzSpan]="24">
      <nz-table style="padding-top: 5px;" nzSize="small" class="tableTdPadding" #expandTable [nzData]="listOfMapData"
        nzTableLayout="fixed" [nzShowPagination]="false" [nzFrontPagination]="false">
        <thead>
          <tr>
            <th style="width: 8%;" ></th>
            <th style="width: 5%;">编码</th>
            <th style="width: 12%;">里程碑</th>
            <th style="width: 10%;">开始时间</th>
            <th style="width: 10%;">结束时间</th>
            <th style="width: 10%;">计划人天</th>
            <th style="width: 20%;">执行人</th>
            <th style="width: 10%;">实际人天</th>
            <th style="width: 10%;">操作</th>
          </tr>
        </thead>
        <tbody>
          <ng-container *ngFor="let data of expandTable.data">
            <ng-container *ngFor="let item of mapOfExpandedData[data.key]">


              <tr *ngIf="(item.parent && item.parent.expand) || !item.parent">
                <td [nzIndentSize]="item.level! * 20" [nzShowExpand]="!!item.children" [(nzExpand)]="item.expand"
                  (nzExpandChange)="collapse(mapOfExpandedData[data.key], item, $event)">*
                </td>
                <td><input nz-input [(ngModel)]="item.code" maxlength=6/></td>
                <td>
                  <ng-container *ngIf="item.id">
                    {{ item.name }}
                  </ng-container>
                  <ng-container *ngIf="!item.id">
                    <input nz-input [(ngModel)]="item.name" maxlength=20/>
                  </ng-container>
                </td>
                <td>
                  <nz-date-picker [(ngModel)]="item.startDate" (ngModelChange)="startChange(item,$event)"></nz-date-picker>
                </td>
                <td>
                  <nz-date-picker [(ngModel)]="item.endDate" (ngModelChange)="startChange(item,$event)"></nz-date-picker>
                </td>
                <td>
                  <nz-input-number [(ngModel)]="item.planTime" [nzMin]="0" [nzStep]="1" (nzBlur)="planTimeKeyup(item)" [nzMax]=1000></nz-input-number>
                </td>
                <td>
                  <!-- <nz-select style="width: 100%;" [nzMaxTagCount]="3" nzMode="multiple" nzPlaceHolder="请选择"
                    [(ngModel)]="item.executor">
                    <nz-option *ngFor="let item of personnelList" [nzLabel]="item.id" [nzValue]="item.name"></nz-option>
                  </nz-select> -->
                  <nz-tree-select style="width: 100%" [nzNodes]="personnelList" nzShowSearch [nzMultiple]="true"
                  nzPlaceHolder="请选择"
                  [(ngModel)]="item.executors" [nzMaxTagCount]="3" [nzAllowClear]="true" [nzDefaultExpandedKeys]="expandKeys">
                </nz-tree-select>
                </td>
                <td>
                  <nz-input-number [(ngModel)]="item.realTime" [nzMin]="0" [nzStep]="1" [nzMax]=1000></nz-input-number>
                </td>
                <td>
                  <a (click)="addChild(item.key)">{{ 'button.leve.lower' | translate }}</a>
                  <nz-divider nzType="vertical"></nz-divider>
                  <a nz-popconfirm nzTitle="{{'isdelete'|translate}}" nzOkText="{{ 'yes' | translate }}"
                    nzCancelText="{{ 'no' | translate }}"
                    (nzOnConfirm)="deleteRow(mapOfExpandedData[data.key],item,item.key)">{{ 'milestone.delete' | translate }}</a>
                </td>
              </tr>
            </ng-container>
          </ng-container>
        </tbody>
      </nz-table>
    </div>
  </div>
</nz-card>