read.vue 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. <script setup lang='ts'>
  2. import frame from '~/assets/caiji/framerx.webp'
  3. const router = useRouter()
  4. function onClickLeft() {
  5. router.back()
  6. }
  7. const leftTime = ref(15)
  8. const timer = ref()
  9. onMounted(() => {
  10. timer.value = setInterval(() => {
  11. leftTime.value--
  12. if (leftTime.value === 0) {
  13. clearInterval(timer.value)
  14. }
  15. }, 1000)
  16. })
  17. </script>
  18. <template>
  19. <van-nav-bar title="人像采集" left-arrow @click-left="onClickLeft"></van-nav-bar>
  20. <div class="flex-auto w-full flex flex-col items-center justify-between py-72px px-6 box-border">
  21. <div class="w-full flex flex-col items-center mb-12">
  22. <img class="w-108px mt-6px" :src="frame" alt="">
  23. <div class="text-xl mt-16px">定制你的专属人像</div>
  24. <div class="text-base mt-22px">保持环境安静</div>
  25. <div class="text-base">按照指令做出动作</div>
  26. </div>
  27. <van-button v-if="leftTime" type="danger" size="large" block disabled>{{leftTime}}s 我已知悉</van-button>
  28. <van-button v-else type="success" size="large" block icon="success" @click="router.replace({name:'caiji-rx-name'})" >我已知悉</van-button>
  29. </div>
  30. </template>