<div class="task-rounds">
  <div class="title">
    <span class="text-base font-medium">排查任务轮次</span>
  </div>
  <div class="content custom-scroll-bar">
    @for (round of rounds; track $index) {
      <div
        class="item"
        [class.active]="round.meta.id === selectedRoundId"
        (click)="onRoundChange(round)"
        [style.--color]="getTimeStateColor(round.state)"
      >
        <span>
          @if (getFilled(round.meta)) {
            <span nz-icon nzType="icons:document-check" class="text-green-500 text-xl relative top-[2px]"></span>
          } @else {
            <span nz-icon nzType="icons:document-uncheck" class="text-gray-500 text-xl relative top-[2px]"></span>
          }
        </span>
        <span class="text-center flex-1"> {{ round.time }}</span>
        <span class="tag" [class.active]="round.meta.id === selectedRoundId">
          {{ getTimeStateText(round.state) }}
        </span>
      </div>
    }
  </div>
</div>
