<script setup lang="ts">
/**
 * 文件职责：秒杀活动统计条。
 */
import type { SeckillStatsViewModel } from '../types';

import {
  formatInteger,
  trimDecimal,
} from '../composables/seckill-page/helpers';

defineProps<{
  stats: SeckillStatsViewModel;
}>();
</script>

<template>
  <div class="sk-stats">
    <span>
      秒杀活动
      <strong>{{ formatInteger(stats.totalCount) }}</strong>
    </span>
    <span>
      进行中
      <strong>{{ formatInteger(stats.ongoingCount) }}</strong>
    </span>
    <span>
      本月秒杀销量
      <strong>{{ formatInteger(stats.monthlySeckillSalesCount) }}</strong>
      单
    </span>
    <span>
      秒杀转化率
      <strong>{{ trimDecimal(stats.conversionRate) }}%</strong>
    </span>
  </div>
</template>
