<script setup lang="ts">
import { NTooltip } from 'naive-ui'
</script>

<template>
  <div class="mb-4">
    <div class="flex items-center justify-between">
      <div class="text-14px text-gray-500 font-bold tracking-wide uppercase">
        实时排行数据与修正 (LIVE CORRECTION)
      </div>
      <div class="text-12px text-red-500">
        * 修改题目得分后，总分与名次将实时重算
      </div>
    </div>
  </div>

  <div
    class="grid grid-cols-[80px_200px_150px_150px_150px_200px_auto] gap-4 bg-gray-50 px-4 py-2 text-13px text-gray-600 font-bold"
  >
    <div>排名</div>
    <div>队伍名称</div>
    <div>所属小组</div>
    <div class="flex items-center">
      正确题数
      <NTooltip placement="top" trigger="hover">
        <template #trigger>
          <span>
            <SvgIcon icon="mdi:information-variant" class="text-xl text-yellow-500" />
          </span>
        </template>
        做题数量因加时赛可能有所不同
      </NTooltip>
    </div>
    <div>总积分 (Total)</div>
    <div>更新时间</div>
    <div class="text-right">
      操作
    </div>
  </div>
</template>
