<!-- 快速登录/注册 -->
<template>
  <CtDialog
    :visible="openDialog"
    :widthType="2"
    :footer="false"
    titleClass="text-h6"
    title="快速登录"
    @close="openDialog = false"
  >
    <div class="my-5">
      <phoneFrom ref="phoneRef" @handleEnter="handleLogin"></phoneFrom>
      <v-btn :loading="loginLoading" color="primary" class="white--text mt-5" min-width="350" @click="handleLogin">
        {{ $t('login.loginOrRegister') }}
      </v-btn>
    </div>
  </CtDialog>
</template>

<script setup>
import phoneFrom from '@/components/VerificationCode'
import { useUserStore } from '@/store/user'; const userStore = useUserStore()
import { nextTick, ref } from 'vue'
defineOptions({name: 'shareJob-login'})
const emit = defineEmits(['loginSuccess'])

const openDialog = ref(false)
nextTick(() => {
  openDialog.value = true
})

// 验证码登录
const phoneRef = ref()
const loginLoading = ref(false)

const handleLogin = async () => {
  localStorage.removeItem('currentRole')
  const { valid } = await phoneRef.value.phoneForm.validate()
  if (!valid) return
  loginLoading.value = true
  try {
    const params = { ...phoneRef.value.loginData } // 只能验证码登录
    await userStore.handleSmsLogin(params)
    emit('loginSuccess')
  } catch (error) {
    console.error('error', error)
  }
}

</script>
<style lang="scss" scoped>
</style>
