<script setup lang="ts">
/**
 * 文件职责：自提模式切换条。
 * 1. 展示大时段/精细时段切换入口。
 * 2. 抛出模式变更事件。
 */
import type { PickupMode } from '#/api/store-pickup';

interface Props {
  mode: PickupMode;
  options: Array<{ label: string; value: PickupMode }>;
}

const props = defineProps<Props>();

const emit = defineEmits<{
  (event: 'change', mode: PickupMode): void;
}>();
</script>

<template>
  <div class="pickup-mode-switch">
    <button
      v-for="item in props.options"
      :key="item.value"
      type="button"
      class="pickup-mode-item"
      :class="{ active: props.mode === item.value }"
      @click="emit('change', item.value)"
    >
      {{ item.label }}
    </button>
  </div>
</template>
