From db1b3baa60306c728af696e314fc16e225e8ad24 Mon Sep 17 00:00:00 2001
From: yuzhiran <contact@yuzhiran.com>
Date: Sun, 5 Jul 2026 19:19:16 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=BD=95=E9=9F=B3UX=20+=20=E5=8F=91?=
 =?UTF-8?q?=E9=80=81=E6=8C=89=E9=92=AE=E5=BD=95=E9=9F=B3=E4=B8=AD=E7=A6=81?=
 =?UTF-8?q?=E7=94=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 发送按钮录音中禁用 (disabled: isRecording)
- sendAnswer() 加 isRecording 守卫
- 麦克风按钮录音时下方显示'松开结束'提示
- 默认标签改为'按住'
---
 zhiyin-app/src/pages/interview/interview.vue | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 deletions(-)

diff --git a/zhiyin-app/src/pages/interview/interview.vue b/zhiyin-app/src/pages/interview/interview.vue
index 7beb125..42d90db 100644
--- a/zhiyin-app/src/pages/interview/interview.vue
+++ b/zhiyin-app/src/pages/interview/interview.vue
@@ -60,15 +60,18 @@
     </scroll-view>
 
     <view class="input-bar" v-if="!isComplete">
-      <view class="mic-btn" :class="{ recording: isRecording }" @touchstart="startRecord" @touchend="stopRecord" @touchcancel="stopRecord" @mousedown="startRecord" @mouseup="stopRecord" @mouseleave="stopRecord">
-        <text class="mic-icon">{{ isRecording ? '🔴' : '🎤' }}</text>
-        <text class="mic-label">{{ isRecording ? recordingDuration + 's' : '按住' }}</text>
+      <view class="mic-wrap">
+        <view class="mic-btn" :class="{ recording: isRecording }" @touchstart="startRecord" @touchend="stopRecord" @touchcancel="stopRecord" @mousedown="startRecord" @mouseup="stopRecord" @mouseleave="stopRecord">
+          <text class="mic-icon">{{ isRecording ? '🔴' : '🎤' }}</text>
+          <text class="mic-label">{{ isRecording ? recordingDuration + 's' : '按住' }}</text>
+        </view>
+        <text class="mic-hint" v-if="isRecording">松开结束</text>
       </view>
       <view class="input-box">
         <textarea class="input-area" v-model="inputText" placeholder="按住🎤说话或输入回答..." :auto-height="true" :maxlength="2000" :disabled="aiLoading || isRecording" @confirm="sendAnswer" />
       </view>
-      <view class="send-btn" :class="{ disabled: (!inputText.trim() && !isRecording) || aiLoading }" @click="sendAnswer">
-        <text class="send-icon">{{ isRecording ? '◉' : '➤' }}</text>
+      <view class="send-btn" :class="{ disabled: !inputText.trim() || isRecording || aiLoading }" @click="sendAnswer">
+        <text class="send-icon">➤</text>
       </view>
     </view>
 
@@ -306,7 +309,7 @@ const startInterview = async () => {
 }
 
 const sendAnswer = async () => {
-  if (!inputText.value.trim() || aiLoading.value || isComplete.value) return
+  if (!inputText.value.trim() || aiLoading.value || isRecording.value || isComplete.value) return
   if (!token()) { checkLogin(); return }
   const answer = inputText.value.trim()
 
@@ -519,9 +522,10 @@ function stopRecord() {
 }
 .input-box { flex: 1; background: var(--color-bg); border-radius: var(--radius-md); padding: 12rpx 20rpx; }
 .input-area { width: 100%; font-size: 26rpx; color: var(--color-text); max-height: 160rpx; line-height: 1.5; }
+.mic-wrap { display: flex; flex-direction: column; align-items: center; gap: 4rpx; flex-shrink: 0; }
 .mic-btn {
   width: 80rpx; height: 80rpx; border-radius: 50%; background: #F3F4F6;
-  display: flex; flex-direction: column; align-items: center; justify-content: center; flex-shrink: 0;
+  display: flex; flex-direction: column; align-items: center; justify-content: center;
   transition: all 0.2s; gap: 2rpx;
 }
 .mic-btn:active { transform: scale(0.9); }
@@ -529,6 +533,7 @@ function stopRecord() {
 .mic-icon { font-size: 28rpx; line-height: 1; }
 .mic-label { font-size: 16rpx; color: #9CA3AF; line-height: 1; }
 .mic-btn.recording .mic-label { color: #EF4444; font-weight: 600; }
+.mic-hint { font-size: 18rpx; color: #EF4444; font-weight: 500; line-height: 1; white-space: nowrap; }
 @keyframes mic-pulse {
   0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4); }
   50% { box-shadow: 0 0 0 16rpx rgba(239, 68, 68, 0); }