From 27034902fee86fb56384580780aceb95cb7a74b8 Mon Sep 17 00:00:00 2001
From: Yer11214 <17633066053@163.com>
Date: Sun, 20 Sep 2026 16:41:01 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20style(verify-code):=20=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4=20APP=20=E7=AB=AF=E9=AA=8C=E8=AF=81=E7=A0=81=E8=BE=93?=
 =?UTF-8?q?=E5=85=A5=E6=A1=86=E7=9A=84=E9=9A=90=E8=97=8F=E6=96=B9=E6=A1=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 将原生输入框移出可视区域，避免 Android 设备上原生光标与自绘数字冲突
- 为 xt__verify-code 增加 overflow 隐藏，输入内容与光标不再显示在验证码格上

♻️ refactor(login): 移除 u-code 组件并自实现验证码倒计时

- 用 displayCodeTip 计算属性配合计时器替换 u-code，统一验证码按钮文案展示
- 新增 onBeforeUnmount 清理倒计时定时器，避免内存泄漏
- 重构 fetchCode 发送逻辑，简化校验与错误处理分支
- 更新获取验证码按钮样式为橙色渐变并调整文字颜色

♻️ refactor(live): 为 APP 端补充直播服务占位实现

- 通过条件编译在 APP-PLUS 下提供 LiveChatService 与 LiveMqttService 空实现
- 避免 APP 端引入直播聊天与 MQTT 依赖，仅保留其他平台原有逻辑
---
 components/verify-code/verify-code.vue |  20 +++--
 pages/passport/login.vue               | 119 +++++++++++++------------
 pages/promotion/live/room.vue          |  26 ++++++
 3 files changed, 102 insertions(+), 63 deletions(-)

diff --git a/components/verify-code/verify-code.vue b/components/verify-code/verify-code.vue
index be01875..d47bd23 100644
--- a/components/verify-code/verify-code.vue
+++ b/components/verify-code/verify-code.vue
@@ -280,11 +280,21 @@ function codeFormat(val: string | undefined, isPassword: boolean): string {
 	}
 }
 
-/* #ifdef APP-PLUS */
-/* APP 中让自绘验证码位于透明输入框上方；点击仍由 input-ground 触发聚焦。 */
-.xt__input {
-	z-index: 1;
-}
+/* #ifdef APP-PLUS */
+/*
+ * App 的原生 input 如果覆盖在验证码格上，部分 Android 设备会出现
+ * 原生光标/输入绘制层与自绘数字冲突。沿用 u-code-input 的隐藏输入方式，
+ * 将输入内容和原生光标移出可视区域，验证码格只负责展示响应式状态。
+ */
+.xt__verify-code {
+	overflow: hidden;
+}
+
+.xt__input {
+	left: -750rpx;
+	width: 1500rpx;
+	z-index: 1;
+}
 
 .xt__input-ground {
 	z-index: 2;
diff --git a/pages/passport/login.vue b/pages/passport/login.vue
index e22ca5f..d4842f6 100644
--- a/pages/passport/login.vue
+++ b/pages/passport/login.vue
@@ -41,13 +41,11 @@
 						cursorColor="#D8D8D8"
 					/>
 
-					<div class="fetch-btn">
-						<u-code change-text="验证码已发送（x）" end-text="重新获取验证码" unique-key="page-login"
-							:seconds="seconds" @end="end" @start="start" ref="uCode" @change="codeChange">
-						</u-code>
-						<span @tap="fetchCode" :style="{ color: codeColor }">
-							{{ tips }}</span>
-					</div>
+					<view class="fetch-btn" style="display: flex; align-items: center; justify-content: center; width: 370rpx; height: 80rpx; border-radius: 100rpx; background-color: #ff6a00">
+						<text @tap="fetchCode" style="color: #fff; font-size: 28rpx; line-height: 80rpx">
+							{{ displayCodeTip }}
+						</text>
+					</view>
 				</div>
 			</div>
 
@@ -131,7 +129,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed, watch, nextTick, getCurrentInstance, onMounted } from 'vue'
+import { ref, reactive, computed, watch, getCurrentInstance, onMounted, onBeforeUnmount } from 'vue'
 import { onLoad, onShow } from '@dcloudio/uni-app'
 import { useStore } from '@/store'
 import { openIdLogin, loginCallback, webConnect } from '@/api/connect.js'
@@ -166,8 +164,14 @@ const codeFlag = ref(true)
 const tips = ref('')
 const enableUserPwdBox = ref(false)
 const current = ref(0)
-const codeColor = ref('#999')
-const seconds = ref(60)
+const isCodeCountingDown = ref(false)
+const seconds = 60
+const remainingCodeSeconds = ref(60)
+let codeCountdownTimer: ReturnType<typeof setInterval> | null = null
+const displayCodeTip = computed(() => {
+	if (isCodeCountingDown.value) return `验证码已发送（${remainingCodeSeconds.value}）`
+	return tips.value || '获取验证码'
+})
 const loginTitleWay = [
 	{ title: '欢迎登录', desc: '登录后更精彩，美好生活即将开始' },
 	{ title: '请输入验证码', desc: '已经发送验证码至' },
@@ -192,7 +196,13 @@ const loginList = ref<LoginListItem[]>([
 const clientType = ref('')
 
 const verification = ref<any>(null)
-const uCode = ref<any>(null)
+
+onBeforeUnmount(() => {
+	if (codeCountdownTimer) {
+		clearInterval(codeCountdownTimer)
+		codeCountdownTimer = null
+	}
+})
 
 onShow(() => {
 	// 只要是app登录的全部清除内容
@@ -304,33 +314,31 @@ watch(flage, async (val) => {
 			return
 		}
 
-		// 首次发送时 uCode 尚未挂载；重新获取时才检查倒计时
-		const canSendCode = current.value === 0 || uCode.value?.canGetCode
+		const canSendCode = current.value === 0 || !isCodeCountingDown.value
 		if (!canSendCode) {
 			proxy.$u.toast('请倒计时结束后再发送')
 			return
 		}
 
 		uni.showLoading({})
-		const res = await sendMobile(mobile.value)
-		if (store.state.isShowToast) {
+		try {
+			const res = await sendMobile(mobile.value)
+			if (res.data.success) {
+				code.value = ''
+				current.value = 1
+				startCodeCountdown()
+			} else {
+				uni.showToast({
+					title: res.data.message,
+					duration: 2000,
+					icon: 'none',
+				})
+				flage.value = false
+				verification.value?.getCode()
+			}
+		} finally {
 			uni.hideLoading()
 		}
-		if (res.data.success) {
-			code.value = ''
-			current.value = 1
-			nextTick(() => {
-				uCode.value?.start()
-			})
-		} else {
-			uni.showToast({
-				title: res.data.message,
-				duration: 2000,
-				icon: 'none',
-			})
-			flage.value = false
-			verification.value?.getCode()
-		}
 	} else {
 		verification.value?.hide()
 	}
@@ -594,24 +602,29 @@ function navigateToPrivacy(val: string) {
 	})
 }
 
-function start() {
-	codeColor.value = '#999'
+function startCodeCountdown() {
+	if (codeCountdownTimer) clearInterval(codeCountdownTimer)
+	isCodeCountingDown.value = true
+	remainingCodeSeconds.value = seconds
+	tips.value = `验证码已发送（${seconds}）`
+	codeCountdownTimer = setInterval(() => {
+		if (remainingCodeSeconds.value > 1) {
+			remainingCodeSeconds.value -= 1
+			return
+		}
+		clearInterval(codeCountdownTimer!)
+		codeCountdownTimer = null
+		isCodeCountingDown.value = false
+		remainingCodeSeconds.value = 0
+		tips.value = '重新获取验证码'
+		codeFlag.value = true
+	}, 1000)
 	proxy.$u.toast('验证码已发送')
 	flage.value = false
 	codeFlag.value = false
 	verification.value?.hide()
 }
 
-function codeChange(text: string) {
-	tips.value = text
-}
-
-function end() {
-	codeColor.value = lightColor.value
-	codeFlag.value = true
-	console.log(codeColor.value)
-}
-
 function passwordLogin() {
 	if (!enablePrivacy.value) {
 		uni.showToast({
@@ -676,20 +689,6 @@ function fetchCode() {
 		})
 		return false
 	}
-	if (tips.value == '重新获取验证码') {
-		uni.showLoading({ title: '加载中' })
-		if (!codeFlag.value) {
-			const timer = setInterval(() => {
-				if (verification.value) {
-					verification.value.error()
-				}
-				clearInterval(timer)
-			}, 100)
-		}
-		if (store.state.isShowToast) {
-			uni.hideLoading()
-		}
-	}
 	if (!flage.value) {
 		verification.value?.error()
 		return false
@@ -817,14 +816,18 @@ declare function miniProgramLogin(code: string | undefined): Promise<{ data: any
 	}
 
 	.fetch-btn {
+		display: flex;
+		align-items: center;
+		justify-content: center;
 		width: 370rpx;
 		height: 80rpx;
 		line-height: 80rpx;
 		text-align: center;
-		background: #f2f2f2;
+		background-color: #ff6a00;
+		background: linear-gradient(57.72deg, #ff8a19 18.14%, #ff5e00 98.44%);
 		border-radius: 100rpx;
 		font-size: 28rpx;
-		color: #999;
+		color: #fff;
 
 		margin: 71rpx auto 0 auto;
 	}
diff --git a/pages/promotion/live/room.vue b/pages/promotion/live/room.vue
index 008c18d..74bd4ac 100644
--- a/pages/promotion/live/room.vue
+++ b/pages/promotion/live/room.vue
@@ -488,8 +488,34 @@ import {
 import config from '@/config/config'
 import { useStore } from '@/store'
 import { isLogin, navigateToLogin, unitPrice } from '@/utils/filters.js'
+// #ifndef APP-PLUS
 import { LiveChatService } from './utils/liveChat.js'
 import { LiveMqttService } from './utils/liveMqtt.js'
+// #endif
+// #ifdef APP-PLUS
+class LiveChatService {
+  userInfo: any = {}
+  constructor(_options: any = {}) {}
+  setGroupID(_id: string) {}
+  async initTencentIm(_viewLiveResult?: any) {}
+  cleanup() {}
+}
+class LiveMqttService {
+  userId: any = null
+  mqttClient: any = null
+  constructor(_liveId: any, userId: any) {
+    this.userId = userId
+  }
+  setMessageHandlers(_handlers: any) {}
+  isConnected() {
+    return false
+  }
+  initMqtt() {}
+  cleanup() {
+    this.mqttClient = null
+  }
+}
+// #endif
 import { findRecommendPayload, parseRecommendMessageArray } from './utils/liveRecommend.js'
 import { seedLiveSetting } from './utils/liveSetting.js'
 // #ifdef H5