<script setup lang="ts">
/**
 * 文件职责：分类统计条展示组件。
 */
import type { CategoryStatsViewModel } from '../types';

interface Props {
  stats: CategoryStatsViewModel;
}

defineProps<Props>();
</script>

<template>
  <div class="pcat-stats">
    <span class="pcat-stat-item">
      <span>分类总数</span>
      <strong>{{ stats.totalCategories }}</strong>
    </span>
    <span class="pcat-stat-item">
      <span>已启用</span>
      <strong>{{ stats.enabledCategories }}</strong>
    </span>
    <span class="pcat-stat-item">
      <span>商品总数</span>
      <strong>{{ stats.totalProducts }}</strong>
    </span>
    <span>
      渠道覆盖
      <span class="pcat-ch-stat">
        <span class="pcat-ch-dot wm"></span>外卖
        <strong>{{ stats.wmCount }}</strong>
      </span>
      <span class="pcat-ch-stat">
        <span class="pcat-ch-dot zt"></span>自提
        <strong>{{ stats.pickupCount }}</strong>
      </span>
      <span class="pcat-ch-stat">
        <span class="pcat-ch-dot ts"></span>堂食
        <strong>{{ stats.dineInCount }}</strong>
      </span>
    </span>
  </div>
</template>
