<div class="textbook-table">
  <div class="tool">
    <div class="search">
      <nz-input-group style="width: 280px" [nzPrefix]="prefixTemplateUser">
        <input
          type="text"
          nz-input
          placeholder="输入教材名称 / ISBN / 作者名搜索"
          [(ngModel)]="searchValue"
          (ngModelChange)="onSearch($event)"
        />
      </nz-input-group>
      <ng-template #prefixTemplateUser
        ><span nz-icon nzType="search"></span
      ></ng-template>
    </div>
    <div class="sbt" (click)="export()">导出评审明细</div>
  </div>
  <nz-table
    #tableData
    [nzData]="reviewList"
    [nzTotal]="count"
    [(nzPageSize)]="limit"
    [nzPageIndex]="pageIndex"
    style="margin: 10px 0"
    [nzLoading]="loading"
    nzSize="middle"
    [nzFrontPagination]="false"
    [nzScroll]="{ x: (maxWidth || '800') + 'px', y: '580px' }"
    nzTableLayout="fixed"
    [nzPageSizeOptions]="[10, 20, 30, 40, 50]"
    nzShowSizeChanger
    (nzPageIndexChange)="pageIndexChange($event)"
    (nzPageSizeChange)="onPageSizeChange($event)"
  >
    <thead>
      <tr>
        <th nzEllipsis nzWidth="120px" nzLeft>申报编号</th>
        <th nzEllipsis nzWidth="120px">教材名称</th>
        @if (filterObj.showGroup) {
        <th
          nzEllipsis
          nzWidth="120px"
          [nzShowFilter]="true"
          [nzFilters]="listOfFilter"
          (nzFilterChange)="listOfColumns.lang.onChange($event)"
        >
          所属评审组
        </th>
        }
        <th nzEllipsis nzWidth="80px">评审专家</th>
        <th nzEllipsis nzWidth="120px">提交时间</th>
        <th nzEllipsis nzWidth="80px" nzRight>分值</th>
      </tr>
    </thead>
    @if (reviewList.length > 0) {
    <tbody>
      @for (data of reviewList; track data.id) {
      <tr>
        <td nzEllipsis nzLeft>
          {{ data?.get("eduTextbook")?.get("code") ?? "-" }}
        </td>
        <td
          nzEllipsis
          class="activeTd"
          (click)="toUrl('/common/textbook/details/' + data?.get('eduTextbook')?.id)"
          nz-popover
          [nzPopoverContent]="contentTemplatetitle"
        >
          {{ data?.get("eduTextbook")?.get("title") || "-" }}
          <ng-template #contentTemplatetitle>
            <div style="max-width: 400px">
              {{ data?.get("eduTextbook")?.get("title") || "-" }}
            </div>
          </ng-template>
        </td>
        @if (filterObj.showGroup) {
        <td nzEllipsis>
          {{ filterObj.bookMap[data?.get("eduTextbook")?.id].name }}
        </td>
        }
        <td nzEllipsis nz-popover [nzPopoverContent]="contentTemplateName">
          {{ data?.get("profile")?.get("user")?.get("name") || "-" }}
          <ng-template #contentTemplateName>
            <div style="max-width: 400px">
              {{ data?.get("profile")?.get("user")?.get("name") || "-" }}
            </div>
          </ng-template>
        </td>
        <td nzEllipsis>
          {{ data.updatedAt | date : "yyyy-MM-dd HH:mm" }}
        </td>
        <td nzEllipsis nzRight>{{ data?.get("score") ?? "-" }}</td>
      </tr>
      }
    </tbody>
    }
  </nz-table>
  @if (reviewList.length == 0) {
  <nz-empty nzNotFoundImage="/img/group-empty.png"></nz-empty>
  }

  <div class="loading" [hidden]="!showLoading">
    <nz-spin nzSimple [nzSize]="'large'"></nz-spin>
  </div>
</div>
