<div style="width:100%;display: flex;justify-content: end;">

  <div style="width:30%;display: flex;justify-content: end;align-items: flex-end;">
    <ng-container *ngFor="let button of schema?.buttons">
      <button *ngIf="button?.place=='top'&&button?.show({queryParams:queryParams})" mat-raised-button color="primary" (click)="batchHandle(button)" >{{button?.name }}</button>
    </ng-container>
  </div>
</div>

<nz-table #editRowTable nzBordered [nzData]="list" *ngIf="showMode=='list'"
  [nzNoResult]="currentLang=='cn'?'暂无数据':'No Data'"
  [nzLoading]="isLoading" nzFrontPagination="false"
>
    <thead>
      <tr>
        <ng-container *ngFor="let field of headerArray">
            <th >{{field?.name}}</th>
        </ng-container>
            <th >状态</th>
            <th >操作</th>
    </tr>
    </thead>
    <tbody>
      <ng-container *ngFor="let object of editRowTable.data">
        <tr class="editable-row" *ngIf="object?.get('isDeleted')!=true">
          <ng-container *ngFor="let field of headerArray">
            <!-- 单行数据每个字段渲染 -->
            <td > 
              <ng-contianer [ngSwitch]="field?.type">
                <ng-container *ngSwitchCase="'Pointer'">
                  {{ pointerShowMap?.[object?.get(field.key)?.objectId||object?.get(field.key)?.id] || "-" }}
                  <!-- 设备: cluster 单元切换 -->
                  <!-- <comp-select-cluster *ngIf="field?.className=='MinerCluster' && object?.className!='MinerCluster'" [device]="object" [unit]="object?.get(field.key)"></comp-select-cluster> -->
                </ng-container>
                <ng-container *ngSwitchCase="'Boolean'">
                  <ng-container *ngIf="currentLang=='cn'">
                    <mat-slide-toggle [checked]="object.get(field.key)" (change)="toggleFiled(object,field.key)">{{object.get(field.key)?"是":"否"}}</mat-slide-toggle>
                  </ng-container>
                  <ng-container *ngIf="currentLang=='en'">
                    <mat-slide-toggle [checked]="object.get(field.key)" (change)="toggleFiled(object,field.key)">{{object.get(field.key)?"Yes":"No"}}</mat-slide-toggle>
                  </ng-container>
                </ng-container>
                <ng-container *ngSwitchDefault>
                  {{ (object.get(field.key) || "-")  }}
                  <!-- 设备: position 位置切换 -->
                  <!-- <comp-select-position [unit]="unit" *ngIf="queryParams?.where?.type=='miner' && field.key=='position' && object?.className=='MinerDevice'" [device]="object" [position]="object?.get(field.key)"></comp-select-position> -->

                </ng-container>
              </ng-contianer>
            </td>
          </ng-container>
          <td>
            <!-- 在线时间：优先显示最后在线时间，若无则显示数据更新时间 -->
            {{(object?.get("onlineAt") || object?.updatedAt) | utilnow:currentLang }}
          </td>
          <td >
            <ng-container *ngFor="let button of schema?.buttons">
              <button *ngIf="button?.place=='item'&&button?.show({object:object})" mat-raised-button [color]="button?.color||'primary'" (click)="buttonHandle(button,object)" >{{button?.name }}</button>
            </ng-container>
          </td>
        </tr>
      </ng-container>

    </tbody>
  </nz-table>

  <div style="display:flex;flex-wrap: wrap;width:100%;" *ngIf="showMode=='grid'">
    <ng-container *ngFor="let object of list">
      <div style="width:33%;padding:10px;">
        <!-- <comp-monitor-card [monitor]="object"></comp-monitor-card> -->
      </div>
    </ng-container>
    <nz-empty *ngIf="!list?.length" nzNotFoundImage="simple" [nzNotFoundContent]="currentLang=='cn'?'暂无数据':'No Data'"></nz-empty>
  </div>

  <div style="width:100%;display: flex;justify-content: center;align-items: center;">
    <nz-pagination 
    [nzPageIndex]="pageIndex"
    [nzPageSize]="pageSize" [nzTotal]="pageTotal" (nzPageIndexChange)="onPageIndexChange($event)"
    ></nz-pagination>
  </div>