<template>
  <div class="boot">
    <el-button :loading="loading" v-if="loading">正在烧烤...</el-button>
    <el-button @click="initService" v-else>重新烧烤</el-button>
  </div>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { ElMessage } from 'element-plus'
import { useRoute, useRouter } from 'vue-router'
import { initBaseData } from '@/business/common'
import { useLoginStore } from '@/stores'
import service from '@/services'
import socket from '@/services/socket'

const { getToken } = useLoginStore()
const route = useRoute()
const router = useRouter()
const loading = ref(false)

const initService = async () => {
  loading.value = true

  // 等待服务初始化
  await service.onReady().catch((err) => {
    ElMessage.error(err)
    loading.value = false
  })

  if (getToken()) {
    // 等待连接交易服务
    await socket.connectTrade().catch((err) => {
      ElMessage.error(err)
      loading.value = false
    })

    // 等待业务数据初始化
    await initBaseData().catch((err) => {
      ElMessage.error(err)
      loading.value = false
    })
  }

  // 路由跳转
  const redirect = route.query.redirect
  if (redirect) {
    router.replace(redirect.toString())
  } else {
    router.replace('/')
  }
}

initService()
</script>

<style lang="less" scoped>
@import './index.less';
</style>