fix: 优化二维码加载错误显示

Yi.Ai.Vue3/src/components/LoginDialog/components/QrCodeLogin/index.vue

@@ -28,7 +28,7 @@ const sceneStr = ref(''); // 场景值，用于标识二维码
 const userStore = useUserStore();
 const router = useRouter();
 const sessionStore = useSessionStore();
-
+const isQrCodeError = ref(false);
 // 二维码倒计时实例
 const { start: qrStart, stop: qrStop } = useCountdown(shallowRef(600), {
   interval: 1000,
@@ -37,7 +37,10 @@ const { start: qrStart, stop: qrStop } = useCountdown(shallowRef(600), {
     stopPolling();
   },
 });
-
+// 计算
+const isLoading = computed(() => {
+  return qrCodeUrl.value ? false : !isQrCodeError.value;
+});
 // 确认登录倒计时实例
 const { start: confirmStart, stop: confirmStop } = useCountdown(confirmCountdownSeconds, {
   interval: 1000,
@@ -54,19 +57,22 @@ let statusPolling: number | null = null;
 // 获取登录二维码图片和二维码标识
 async function fetchQRCodeInfo() {
   try {
+    isQrCodeError.value = false;
     const param = {
       sceneType: QrCodeType,
     };
     const response = await getQrCode(param);
-    if (response && response.data.qrCodeUrl && response.data.scene) {
+    const urlObj = new URL(response.data.qrCodeUrl);
+    const params = new URLSearchParams(urlObj.search);
+    const ticketValue = params.get('ticket');
+    if (response && response.data.qrCodeUrl && response.data.scene && ticketValue) {
       qrCodeUrl.value = response.data.qrCodeUrl;
       sceneStr.value = response.data.scene;
       return true;
     }
     return false;
   }
-  catch (error) {
-    console.error('获取二维码失败:', error);
+  catch (err: any) {
     return false;
   }
 }
@@ -185,6 +191,7 @@ function stopPolling() {
 /** 刷新二维码 */
 async function handleRefresh() {
   isExpired.value = false;
+  isQrCodeError.value = false;
   isScanned.value = false;
   isConfirming.value = false;
   stopPolling();
@@ -195,6 +202,8 @@ async function handleRefresh() {
     startStatusPolling();
   }
   else {
+    isQrCodeError.value = true;
+    stopPolling();
     ElMessage.error('刷新二维码失败');
   }
 }
@@ -218,6 +227,8 @@ onMounted(async () => {
     startStatusPolling();
   }
   else {
+    isQrCodeError.value = true;
+    stopPolling();
     ElMessage.error('初始化二维码失败');
   }
 });
@@ -241,12 +252,25 @@ onMounted(() => {
     </div>
 
     <div class="qr-img-wrapper">
-      <el-image v-loading="!qrCodeUrl" :src="qrCodeUrl" alt="登录二维码" class="qr-img">
+      <el-image v-loading="isLoading" :src="qrCodeUrl" alt="登录二维码" class="qr-img">
         <template #error>
           <el-icon><IconPicture /></el-icon>
         </template>
       </el-image>
 
+      <!-- 失败覆盖层 -->
+      <div v-if="isQrCodeError" class="expired-overlay" @click.stop="handleRefresh">
+        <div class="expired-content">
+          <p class="expired-text">
+            二维码获取失败
+          </p>
+          <el-button class="refresh-btn" link>
+            <el-icon><Refresh /></el-icon>
+            点击刷新
+          </el-button>
+        </div>
+      </div>
+
       <!-- 过期覆盖层 -->
       <div v-if="isExpired" class="expired-overlay" @click.stop="handleRefresh">
         <div class="expired-content">