topology-img.component.html

<div nz-row class="breadcrumbs">
  <div nz-col nzSpan="16">
    <nz-breadcrumb class="padding-8-0">
      <nz-breadcrumb-item>
        首页
      </nz-breadcrumb-item>
      <nz-breadcrumb-item>
        <a>网络拓扑</a>
      </nz-breadcrumb-item>
      <nz-breadcrumb-item>
        拓扑图标管理
      </nz-breadcrumb-item>
    </nz-breadcrumb>
  </div>
  <div nz-col nzSpan="8" class="text-right">
    <button nz-button nzType="primary"><i class="anticon anticon-search"></i></button>
    <button nz-button nzType="primary"><i class="anticon anticon-sync"></i></button>
    <button nz-button nzType="primary"><i class="anticon anticon-arrows-alt"></i></button>
  </div>
</div>
<div nz-row class="search-form">
  <div nz-col nzSpan="12">
    <nz-select style="width: 200px;" nzShowSearch nzAllowClear nzPlaceHolder="选择类型" (ngModelChange)="getList()">
      <!--<ng-container *ngFor="let item of groupList;let i = index;">-->
        <!--<nz-option nzLabel="选择类型"></nz-option>-->
      <!--</ng-container>-->
    </nz-select>
  </div>
  <div nz-col nzSpan="12" class="text-right">
    <button nz-button (click)="addIcon()" nzType="default"><i class="anticon anticon-plus"></i>添加图标</button>
  </div>
</div>
<nz-table #nzTable [nzData]="iconList">
  <thead>
  <tr>
    <th>一级类型</th>
    <th>默认图标</th>
    <th>所有图标</th>
    <th>操作</th>
  </tr>
  </thead>
  <tbody>
  <tr *ngFor="let data of iconList">
    <td>{{data.firstTypeName}}</td>
    <td>{{data.defaultIcon}}</td>
    <td>
      <img style="width: 40px;" [src]="imgUrl + data.url">
    </td>
    <td class="handle">
      <span (click)="deleteIcon(data)">删除</span>
      <ng-container *ngIf="data.defaultIcon == 0">
        <span (click)="setDefault(data)">设为默认</span>
      </ng-container>
    </td>
  </tr>
  </tbody>
</nz-table>
<smart-icon #smartIcon (done)="getList()"></smart-icon>