zy-pc/src/app/views/building-distance/building-distance.component.html

<div class="buildingDistance">
  <div class="content" *ngIf="(!loading1&&!loading2);else loadingBlock">
    <div class="top display_flex align-items_center justify-content_space-between" nz-row>
      <div nz-col nzLg='22' class="searchBox"></div>
      <div nz-col nzLg="2" class="btns">
        <button *ngIf="coopBtns.add" class="btn fr default" (click)="addBuilding()">新增</button>
      </div>
    </div>
    <div class="bottom">
      <div class="table">
        <div class="box">
          <div nz-row class="b_header">
            <div nz-col nzSpan="22">楼栋距离</div>
            <div nz-col nzSpan="2">百分比</div>
          </div>
          <div nz-row class="b_list" *ngFor="let building of buildings;trackBy:trackById">
            <div nz-col nzSpan="22" nz-row class="b_list_content">
              <nz-select nz-col nzSpan="11" [nzDisabled]="!coopBtns.edit" [(ngModel)]="building.buildingStart"
                nzPlaceHolder="请选择楼栋" [class.active]="building.border==='red'?'red':''">
                <nz-option [nzValue]="item.id" [nzLabel]="item.buildingName"
                  *ngFor="let item of buildingList;trackBy:trackById"></nz-option>
              </nz-select>
              <nz-select nz-col nzSpan="11" [nzDisabled]="!coopBtns.edit" [(ngModel)]="building.buildingEnd"
                nzPlaceHolder="请选择楼栋" [class.active]="building.border==='red'?'red':''">
                <nz-option [nzValue]="item.id" [nzLabel]="item.buildingName"
                  *ngFor="let item of buildingList;trackBy:trackById"></nz-option>
              </nz-select>
            </div>
            <div nz-col nzSpan="2" class="b_percent">
              <nz-input-number [nzDisabled]="!coopBtns.edit" [nzFormatter]="formatterPercent" [nzParser]="parserPercent"
                [(ngModel)]="building.percentage" [nzMin]="0" [nzMax]="1000" [nzStep]="1"></nz-input-number>
              <i class="icon_transport transport-lajitong" (click)="delete(building)" *ngIf="coopBtns.del"></i>
            </div>
          </div>
          <div class="b_save"><button nz-button nzType="primary" (click)="save()" *ngIf="buildings.length"
              [nzLoading]="loading3">保存</button>
          </div>
        </div>
      </div>
    </div>
  </div>
  <ng-template #loadingBlock>
    <div class="content loading display_flex justify-content_flex-center align-items_center">
      <div class="txtC">
        <img src="../../../assets/images/loading.gif" alt="">
        <div>加载中...</div>
      </div>
    </div>
  </ng-template>
  <!-- 删除模态框 -->
  <app-dialog-delete [delModal]="delModal" (hideDelModalEvent)="hideDelModal()" [btnLoading]="loading4"
    (confirmDelEvent)="confirmDel()" content="是否确认删除此配置？"></app-dialog-delete>
</div>