<template>
  <Button
    :label="`发送验证码${isCounting ? `(${countdownTime}s)` : ''}`"
    variant="link"
    @click="sendSms"
    :loading="isSending"
    :disabled="isSending || isCounting"
  />
</template>

<script setup lang="ts">
const { countdownTime, triggerCountdown, isCounting } = useCountdown($__DEV__ ? 5 : 60);

const isSending = ref(false);
const sendSms = async () => {
  console.debug('[sendSms]');
  isSending.value = true;
  try {
    await new Promise((resolve) => setTimeout(resolve, 1000));
    triggerCountdown();
    ToastService.add({ severity: 'info', summary: '提示', life: 3000, detail: '验证码发送成功' });
  } finally {
    isSending.value = false;
  }
};
</script>
