puzhibing
2026-08-28 e92cd56bb56b111c1afe9922191f9897215ff6b0
yuyueMiniProgram/src/components/MiniLoginPrompt.vue
@@ -14,6 +14,7 @@
const visible = computed(() => authStore.loginPromptVisible)
const needPhoneAuthorize = computed(() => authStore.needPhoneAuthorize)
const shouldRenderPrompt = ref(true)
const message = computed(() => {
  if (needPhoneAuthorize.value) {
    return '首次登录需授权手机号完成身份识别'
@@ -22,6 +23,7 @@
})
function hideLoginPrompt() {
  shouldRenderPrompt.value = true
  authStore.hideLoginPrompt()
}
@@ -29,7 +31,7 @@
  return !normalizeProfileDisplayName(authStore.profile?.displayName)
}
function openProfileEditorIfNeeded() {
async function openProfileEditorIfNeeded() {
  if (!shouldForceEditProfile()) {
    return false
  }
@@ -54,7 +56,7 @@
    hideLoginPrompt()
    uni.$emit('mini-login-success')
    emit('login-success')
    if (openProfileEditorIfNeeded()) {
    if (await openProfileEditorIfNeeded()) {
      return
    }
    uni.showToast({
@@ -78,11 +80,13 @@
}
async function handlePhoneAuthorize(event: any) {
  shouldRenderPrompt.value = true
  if (loginSubmitting.value) {
    return
  }
  const phoneCode = event?.detail?.code
  if (!phoneCode) {
    authStore.showLoginPrompt()
    uni.showToast({
      title: '未获取到手机号授权',
      icon: 'none',
@@ -98,7 +102,7 @@
    hideLoginPrompt()
    uni.$emit('mini-login-success')
    emit('login-success')
    if (openProfileEditorIfNeeded()) {
    if (await openProfileEditorIfNeeded()) {
      return
    }
    uni.showToast({
@@ -107,6 +111,7 @@
    })
  }
  catch (error) {
    authStore.showLoginPrompt()
    uni.showToast({
      title: error instanceof Error ? error.message : '登录失败',
      icon: 'none',
@@ -116,14 +121,27 @@
    loginSubmitting.value = false
  }
}
function handleBeforePhoneAuthorize() {
  if (loginSubmitting.value) {
    return
  }
  shouldRenderPrompt.value = false
}
</script>
<template>
  <view v-if="visible" class="fixed inset-0 z-40 bg-[rgba(0,0,0,0.55)]" @click="!needPhoneAuthorize && hideLoginPrompt()" />
  <view
    v-if="visible"
    class="fixed inset-0 z-40 bg-[rgba(0,0,0,0.55)]"
    :class="shouldRenderPrompt ? '' : 'opacity-0 pointer-events-none'"
    @click="!needPhoneAuthorize && hideLoginPrompt()"
  />
  <view
    v-if="visible"
    class="fixed left-[50%] top-[50%] z-50 w-[520rpx] translate-x-[-50%] translate-y-[-50%] rounded-[28rpx] bg-white px-[40rpx] pb-[36rpx] pt-[28rpx]"
    :class="shouldRenderPrompt ? '' : 'opacity-0 pointer-events-none'"
  >
    <view class="mb-[16rpx] text-center text-[34rpx] text-[#1A1A1A] font-medium">
      提示
@@ -146,6 +164,7 @@
        class="m-0 h-[80rpx] flex flex-1 items-center justify-center rounded-full border-none bg-[#0C6FFF] p-0 text-[30rpx] text-white after:border-none"
        :disabled="loginSubmitting"
        open-type="getPhoneNumber"
        @tap="handleBeforePhoneAuthorize"
        @getphonenumber="handlePhoneAuthorize"
      >
        {{ loginSubmitting ? '授权中...' : '授权手机号' }}