fashion-ssr-vue3/pages/validate/index.vue

<!-- @format -->

<script lang="ts" setup>
import { validateRegisterApi } from '~/api/model/user'

const router = useRouter()
const route = useRoute()
const validate = ref(false)
async function validateRegister() {
  try {
    const token = route.query.t
    await validateRegisterApi({ token })
    validate.value = true
  }
  catch (error) {
    validate.value = false
    console.log(error)
  }
}
validateRegister()
function toHome() {
  router.push('/')
}
</script>

<template>
  <div>
    <div
      v-if="validate"
      class="flex flex-col items-center justify-center h-full py-200px"
    >
      <img
        src="~/assets/images/register_success.png"
        class="w-120px h-120px"
        alt=""
        srcset=""
      >
      <div class="mt-20px mb-30px text-20px text-#333">
        Your account has been created successfully
      </div>
      <el-button class="!bg-#C58C64 !text-#fff !w-245px !h-50px !text-18px !fw-500 !b-rd-6px " @click="toHome">
        Start exploring
      </el-button>
    </div>
    <div v-else class="flex flex-col items-center justify-center h-full py-200px">
      <img
        src="~/assets/images/register_fail.png"
        class="w-120px h-120px"
        alt=""
        srcset=""
      >
      <div class="mt-20px text-20px text-#333">
        The email verfication link has been expired,please re-register later
      </div>
    </div>
    <common-footer-guide />
  </div>
</template>

<style lang="less" scoped></style>