cd-project-management-web/src/app/routes/invoice-management/invoice-sales/add/add.component.html

<nz-spin [nzSpinning]="isLoadingSave">
  <form nz-form [formGroup]="validateForm" (ngSubmit)="submitForm()">
    <div nz-row [nzGutter]="24">
      <div nz-col [nzSpan]="8">
        <nz-form-item>
          <nz-form-label [nzSm]="6" [nzXs]="24">单据编码</nz-form-label>
          <nz-form-control [nzSm]="14" [nzXs]="24">
            自动生成
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col [nzSpan]="8">
        <nz-form-item>
          <nz-form-label [nzSm]="6" [nzXs]="24">项目编码</nz-form-label>
          <nz-form-control [nzSm]="14" [nzXs]="24">
            {{invoiceManagePurchase.proCode}}
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col [nzSpan]="8">
        <nz-form-item>
          <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>项目名称</nz-form-label>
          <nz-form-control [nzSm]="14" [nzXs]="24">
            <nz-select style="widows: 100%;" nzShowSearch nzAllowClear formControlName="proArchivesId"
              id="proArchivesId" [(ngModel)]="invoiceManagePurchase.proArchivesId" nzPlaceHolder="请选择"
              (ngModelChange)="proChange($event)">
              <nz-option *ngFor="let i of proList" [nzValue]="i.id" [nzLabel]="i.proName"></nz-option>
            </nz-select>
            <nz-form-explain
              *ngIf="validateForm.get('proArchivesId')?.dirty && validateForm.get('proArchivesId')?.errors">
              请选择项目名称
            </nz-form-explain>
          </nz-form-control>
        </nz-form-item>
      </div>
    </div>
  </form>


<nz-card>
  <div nz-row [nzGutter]="24">
    <div nz-col [nzSpan]="24">
      <!-- 新增按钮 -->
      <button (click)="addRow()" 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" #basicTable
        [nzData]="itemDataList" [nzFrontPagination]="false" [nzShowPagination]="false" >
        <thead>
          <tr>
            <th nzAlign="center">序号</th>
            <th>首付款条线</th>
            <th>里程碑</th>
            <th>金额</th>
            <th>未收票金额</th>
            <th>本次收票金额</th>
            <th>操作</th>
          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let data of basicTable.data;let i=index">
            <td nzAlign="center">{{i+1}}</td>
            <td style="width: 20%;">
              <nz-select style="width: 100%;" nzShowSearch [(ngModel)]="data.coArchivesId" nzPlaceHolder="请选择" (ngModelChange)="coArchivesChange(data)">
              <nz-option *ngFor="let i of coArchivesList" [nzValue]="i.id" [nzLabel]="i.planName" ></nz-option>
            </nz-select>
            </td>
            <td style="width: 20%;" >
              <nz-select style="width: 100%;" nzShowSearch [(ngModel)]="data.proBusinessId" nzPlaceHolder="请选择"
              (ngModelChange)="proBusinessChange(data)">
              <nz-option *ngFor="let i of data.proBusinessList" [nzValue]="i.mileId" [nzLabel]="i.mileName"></nz-option>
            </nz-select>
            </td>
            <td>
              <!-- <nz-input-number [(ngModel)]="data.price" [nzMin]="0" [nzStep]="1" [nzFormatter]="formatterDollar" [nzParser]="parserDollar"></nz-input-number> -->
              {{data.price}}
            </td>
            <td>
              <!-- <nz-input-number [(ngModel)]="data.uncoPrice" [nzMin]="0" [nzStep]="1" [nzFormatter]="formatterDollar" [nzParser]="parserDollar"></nz-input-number> -->
              {{data.uncoPrice}}
            </td>
            <td>
              <nz-input-number [(ngModel)]="data.coPrice" [nzMin]="0" [nzMax]="data.uncoPriceMax" [nzStep]="1" [nzFormatter]="formatterDollar" [nzParser]="parserDollar" (ngModelChange)="coPriceKeyUp(data)"></nz-input-number>
            </td>
            <td ><a nz-popconfirm nzTitle="是否删除?"
                (nzOnConfirm)="deleteRow(data.sort)">{{'table.delete'|translate}}</a></td>
          </tr>
        </tbody>
      </nz-table>
    </div>
  </div>
</nz-card>
</nz-spin>
<!-- 按钮 -->
<div class="base">
  <strong>填写人:</strong>{{invoiceManagePurchase.currentUser}} <strong>填写时间:</strong>{{invoiceManagePurchase.createTime}}
  <!-- 关闭按钮 -->
  <a nz-popconfirm nzTitle="{{'pm.contract.contract.add.button.cancel'|translate}}" (nzOnConfirm)="close()"
    style="padding-right: 8px">
    <button nz-button>{{'pm.quotation.cancel'|translate}}</button>
  </a>
  <!-- 保存按钮 -->
  <button nz-button nzType="primary" class="ant-btn ant-btn-primary" (click)="submitForm()"
    [nzLoading]="isLoadingSave"><span>{{'pm.finish' | translate}}</span></button>
</div>