Jinan_project/src/app/home/basic-info/unit/unit.component.html

<div class="orbox">
  <div class="lefttop">
    <span>单位基本信息</span>
  </div>
  <div class="topbox">
    <input [(ngModel)]="searchValue.unit" type="text" nz-input placeholder="请输入单位" />
    <nz-select [(ngModel)]="searchValue.uniytype" nzAllowClear nzPlaceHolder="单位类型">
      <nz-option *ngFor="let item of BuildingTypes" [nzValue]="item.id" [nzLabel]="item.buildingTypeName"></nz-option>
    </nz-select>
    <nz-tree-select [nzExpandedKeys]="expandKeys" [nzNodes]="nodes" nzShowSearch nzPlaceHolder="所属机构"
      [(ngModel)]="searchValue.or" [nzExpandedIcon]="multiExpandedIconTpl" [nzDropdownClassName]="'maxHeightTreeSelect'"
      [nzAllowClear]="false"></nz-tree-select>
    <ng-template #multiExpandedIconTpl let-node let-origin="origin">
      <ng-container *ngIf="node.children.length == 0; else elseTemplate">

      </ng-container>
      <ng-template #elseTemplate>
        <i nz-icon [nzType]="node.isExpanded ? 'caret-down' : 'caret-right'" class="ant-tree-switcher-line-icon"></i>
      </ng-template>
    </ng-template>
    <nz-select [(ngModel)]="searchValue.property" nzAllowClear nzPlaceHolder="单位级别">
      <nz-option nzValue="一般单位" nzLabel="一般单位"></nz-option>
      <nz-option nzValue="重点单位" nzLabel="重点单位"></nz-option>
      <nz-option nzValue="其他单位" nzLabel="其他单位"></nz-option>
      <nz-option nzValue="九小场所" nzLabel="九小场所"></nz-option>
    </nz-select>
    <button (click)="search()" nz-button nzType="primary"><i nz-icon nzType="search" nzTheme="outline"></i>查询</button>
    <button (click)="reset()" nz-button><i nz-icon nzType="reload" nzTheme="outline"></i>重置</button>
  </div>
  <div class="translate">
    <button nz-button nzType="primary" (click)="addUnit()"><i nz-icon nzType="plus-circle"
        nzTheme="outline"></i>新增</button>
    <!-- <button nz-button nzType="primary"><i nz-icon nzType="edit" nzTheme="outline"></i>修改</button>
    <button nz-button nzType="primary" nzDanger><i nz-icon nzType="delete" nzTheme="outline"></i>删除</button> -->
  </div>
  <nz-table [nzLoading]="nzLoading" [nzBordered]="true" #basicTable [nzData]="listOfData" [nzShowPagination]='false'>
    <thead>
      <tr>
        <th nzWidth="17%">单位名称</th>
        <th nzWidth="8%">信息完整度</th>
        <th nzWidth="10%">所属机构</th>
        <th nzWidth="13%">单位类型</th>
        <th nzWidth="13%">使用性质</th>
        <th nzWidth="9%">单位级别</th>
        <th nzWidth="18%">单位地址</th>
        <th>操作</th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let data of basicTable.data">
        <td>{{ data.companyName }}</td>
        <td class="progresssquare">
          <nz-progress [nzShowInfo]="false" nzStrokeLinecap="square" nzStrokeWidth="16" nzStrokeColor="#42B983"
            [nzPercent]="(data.integrity * 100).toFixed()">
          </nz-progress>
          <span class="num">{{(data.integrity * 100).toFixed()}}%</span>
        </td>
        <td>{{ data.organization.name }}</td>
        <td>{{ data.buildingType ? data.buildingType.buildingTypeName : ''}}</td>
        <td>{{ data.useNature }}</td>
        <td>
          {{data.companyLevel}}
        </td>
        <td>{{ data.address }}</td>
        <td class="operation">
          <a class="bule" (click)="look(data)">查看</a>
          <a class="bule" (click)="edit(data)">编辑</a>
          <a class="bule" (click)="download(data)">下载</a>
          <a class="red" (click)="delete(data)">删除</a>
        </td>
      </tr>
    </tbody>
  </nz-table>
  <div class="pagination">
    <nz-pagination [nzHideOnSinglePage]="false" [nzPageIndex]="PageNumber" [nzTotal]="totalCount" [nzPageSize]="10"
      [nzShowTotal]="totalTemplate" nzShowQuickJumper (nzPageIndexChange)="pageChange($event)">
    </nz-pagination>
    <ng-template #totalTemplate let-total> 10条/页,共{{totalCount}}条 </ng-template>
  </div>

</div>