<script setup lang="ts">
definePageMeta({ layout: false });

const auth = useAuth();
const router = useRouter();
const authForm = ref<InstanceType<typeof AuthForm> | null>(null);
const loading = ref(false);

async function handleSubmit(data: { username: string; password: string; captchaToken: string; captchaCode: string }) {
  loading.value = true;
  try {
    const result = await auth.register(data.username, data.password, data.captchaToken, data.captchaCode);
    if (result.success) {
      router.push("/");
    } else {
      authForm.value?.setError(result.message || "注册失败");
      authForm.value?.refreshCaptcha();
    }
  } catch {
    authForm.value?.setError("网络错误，请重试");
    authForm.value?.refreshCaptcha();
  } finally {
    loading.value = false;
  }
}
</script>

<template>
  <div class="flex flex-col items-center justify-center min-h-screen px-5" style="background: #f5f5f7;">
    <AuthForm ref="authForm" mode="register" @submit="handleSubmit" />
  </div>
</template>
