<script setup lang="ts">
import type { MarketingCalendarStatsDto } from '#/api/marketing';

import { formatCurrency } from '../composables/marketing-calendar-page/helpers';

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

<template>
  <div class="mc-stats">
    <div class="mc-stat-card">
      <div class="mc-stat-label">本月活动</div>
      <div class="mc-stat-value primary">{{ stats.totalActivityCount }}</div>
    </div>
    <div class="mc-stat-card">
      <div class="mc-stat-label">进行中</div>
      <div class="mc-stat-value green">{{ stats.ongoingCount }}</div>
    </div>
    <div class="mc-stat-card">
      <div class="mc-stat-label">最大并行数</div>
      <div class="mc-stat-value orange">{{ stats.maxConcurrentCount }}</div>
    </div>
    <div class="mc-stat-card">
      <div class="mc-stat-label">本月预计优惠</div>
      <div class="mc-stat-value">
        {{ formatCurrency(stats.estimatedDiscountAmount) }}
      </div>
    </div>
  </div>
</template>
