更新

TUICallKit-Vue3/tongji/composables/useSpeechToText.js

@@ -0,0 +1,260 @@
+import { ref, onUnmounted } from 'vue'
+
+const MIN_HOLD_MS = 280
+
+/**
+ * 语音转文字（长按说话）：微信小程序 WechatSI；H5 Web Speech API。
+ *
+ * @param {{ onResult?: (text: string) => void, showToast?: (msg: string) => void }} options
+ */
+export function useSpeechToText({ onResult, showToast } = {}) {
+    const sttListening = ref(false)
+    const sttHolding = ref(false)
+    const sttSupported = ref(false)
+
+    let wxRecordManager = null
+    let h5Recognition = null
+    let holdStartTs = 0
+    let holdSessionId = 0
+    let startRequested = false
+    let recordAuthorized = null
+
+    function notify(msg) {
+        if (!msg) return
+        if (typeof showToast === 'function') {
+            showToast(msg)
+            return
+        }
+        uni.showToast({ title: msg, icon: 'none', duration: 2000 })
+    }
+
+    function emitResult(text) {
+        const t = String(text || '').trim()
+        const heldMs = Date.now() - holdStartTs
+        if (!t) {
+            if (heldMs < MIN_HOLD_MS) return
+            notify('没听清，请再试一次')
+            return
+        }
+        if (typeof onResult === 'function') {
+            onResult(t)
+        }
+    }
+
+    function stopListening() {
+        // #ifdef MP-WEIXIN
+        if (wxRecordManager && (sttListening.value || startRequested)) {
+            try {
+                wxRecordManager.stop()
+            } catch (e) {}
+        }
+        // #endif
+
+        // #ifdef H5
+        if (h5Recognition && sttListening.value) {
+            try {
+                h5Recognition.stop()
+            } catch (e) {}
+        }
+        // #endif
+
+        startRequested = false
+        sttListening.value = false
+    }
+
+    function ensureRecordAuth(onGranted) {
+        // #ifdef MP-WEIXIN
+        if (recordAuthorized === true) {
+            onGranted()
+            return
+        }
+        uni.authorize({
+            scope: 'scope.record',
+            success() {
+                recordAuthorized = true
+                onGranted()
+            },
+            fail() {
+                recordAuthorized = false
+                sttHolding.value = false
+                uni.showModal({
+                    title: '需要麦克风权限',
+                    content: '请在设置中允许使用麦克风，以便长按说话',
+                    confirmText: '去设置',
+                    success(res) {
+                        if (res.confirm) {
+                            uni.openSetting({})
+                        }
+                    }
+                })
+            }
+        })
+        // #endif
+        // #ifndef MP-WEIXIN
+        onGranted()
+        // #endif
+    }
+
+    function startWechatRecord(session) {
+        // #ifdef MP-WEIXIN
+        if (!wxRecordManager || session !== holdSessionId || !sttHolding.value) {
+            return
+        }
+        try {
+            startRequested = true
+            wxRecordManager.start({
+                duration: 60000,
+                lang: 'zh_CN'
+            })
+        } catch (e) {
+            startRequested = false
+            sttHolding.value = false
+            notify('无法开始录音')
+        }
+        // #endif
+    }
+
+    function startH5Record() {
+        // #ifdef H5
+        if (!h5Recognition) {
+            notify('当前浏览器不支持语音输入')
+            sttHolding.value = false
+            return
+        }
+        try {
+            startRequested = true
+            h5Recognition.start()
+            sttListening.value = true
+        } catch (e) {
+            startRequested = false
+            sttHolding.value = false
+            notify('无法开始语音识别，请检查麦克风权限')
+        }
+        // #endif
+    }
+
+    /** 长按开始：手指按下 */
+    function beginHoldSpeech() {
+        if (!sttSupported.value) {
+            notify('当前环境不支持语音输入')
+            return
+        }
+        if (sttHolding.value) return
+
+        const session = ++holdSessionId
+        holdStartTs = Date.now()
+        sttHolding.value = true
+
+        // #ifdef MP-WEIXIN
+        ensureRecordAuth(() => startWechatRecord(session))
+        // #endif
+        // #ifdef H5
+        startH5Record()
+        // #endif
+        // #ifndef MP-WEIXIN
+        // #ifndef H5
+        sttHolding.value = false
+        notify('当前端暂不支持语音输入')
+        // #endif
+        // #endif
+    }
+
+    /** 松手结束：手指抬起 */
+    function endHoldSpeech() {
+        if (!sttHolding.value && !sttListening.value && !startRequested) {
+            return
+        }
+        sttHolding.value = false
+        if (sttListening.value || startRequested) {
+            stopListening()
+            return
+        }
+        holdSessionId += 1
+    }
+
+    // #ifdef MP-WEIXIN
+    try {
+        // eslint-disable-next-line no-undef
+        const plugin = requirePlugin('WechatSI')
+        wxRecordManager = plugin.getRecordRecognitionManager()
+        sttSupported.value = !!wxRecordManager
+
+        wxRecordManager.onStart = () => {
+            if (!sttHolding.value) {
+                try {
+                    wxRecordManager.stop()
+                } catch (e) {}
+                return
+            }
+            startRequested = false
+            sttListening.value = true
+        }
+        wxRecordManager.onStop = (res) => {
+            sttListening.value = false
+            startRequested = false
+            emitResult(res?.result)
+        }
+        wxRecordManager.onError = (res) => {
+            sttListening.value = false
+            startRequested = false
+            sttHolding.value = false
+            notify(res?.msg || '语音识别失败')
+        }
+    } catch (e) {
+        console.warn('WechatSI record recognition not available', e)
+    }
+    // #endif
+
+    // #ifdef H5
+    try {
+        if (typeof window !== 'undefined') {
+            const SR = window.SpeechRecognition || window.webkitSpeechRecognition
+            if (SR) {
+                h5Recognition = new SR()
+                h5Recognition.lang = 'zh-CN'
+                h5Recognition.interimResults = false
+                h5Recognition.continuous = false
+                h5Recognition.maxAlternatives = 1
+                sttSupported.value = true
+
+                h5Recognition.onresult = (event) => {
+                    const item = event.results?.[0]?.[0]
+                    emitResult(item?.transcript || '')
+                }
+                h5Recognition.onend = () => {
+                    sttListening.value = false
+                    startRequested = false
+                    sttHolding.value = false
+                }
+                h5Recognition.onerror = (event) => {
+                    sttListening.value = false
+                    startRequested = false
+                    sttHolding.value = false
+                    if (event?.error === 'not-allowed') {
+                        notify('请允许浏览器使用麦克风')
+                    } else if (event?.error !== 'aborted') {
+                        notify('语音识别失败')
+                    }
+                }
+            }
+        }
+    } catch (e) {
+        console.warn('H5 SpeechRecognition not available', e)
+    }
+    // #endif
+
+    onUnmounted(() => {
+        sttHolding.value = false
+        holdSessionId += 1
+        stopListening()
+    })
+
+    return {
+        sttListening,
+        sttHolding,
+        sttSupported,
+        beginHoldSpeech,
+        endHoldSpeech,
+        stopSpeechToText: endHoldSpeech
+    }
+}

TUICallKit-Vue3/tongji/pages/weekly.vue

@@ -47,21 +47,7 @@
 
         <view class="st-main">
             <!-- 1. 录入今日血糖 -->
-            <view class="st-cta" @click="openInputForm()">
-                <TongjiIcon name="plus" size="md" color="#FFFFFF" />
-                <text>录入今日血糖</text>
-            </view>
-
-            <view class="st-game-entry" @click="goGamePage">
-                <view class="st-game-entry-icon">
-                    <TongjiIcon name="activity" size="md" color="#006c49" />
-                </view>
-                <view class="st-game-entry-body">
-                    <text class="st-game-entry-title">糖分突袭</text>
-                    <text class="st-game-entry-sub">消除棋盘食物，边玩边学控糖</text>
-                </view>
-                <TongjiIcon name="chevron-right" size="sm" color="#64748b" />
-            </view>
+          
 
             <!-- 2. 血糖趋势 -->
             <view v-if="diagnosisId" class="st-chart-card">
@@ -134,6 +120,21 @@
                         </cover-view>
                     </cover-view>
                 </view>
+                <view class="st-cta" @click="openInputForm()">
+                <TongjiIcon name="plus" size="md" color="#FFFFFF" />
+                <text>录入今日血糖</text>
+            </view>
+
+            <view class="st-game-entry" @click="goGamePage">
+                <view class="st-game-entry-icon">
+                    <TongjiIcon name="activity" size="md" color="#006c49" />
+                </view>
+                <view class="st-game-entry-body">
+                    <text class="st-game-entry-title">糖分突袭</text>
+                    <text class="st-game-entry-sub">消除棋盘食物，边玩边学控糖</text>
+                </view>
+                <TongjiIcon name="chevron-right" size="sm" color="#64748b" />
+            </view>
             </view>
 
             <!-- 3. 最新测量 & 概览 -->
@@ -237,12 +238,21 @@
                     class="st-float-input"
                     type="text"
                     :value="dietAiAskText"
-                    placeholder="输入食物名称或健康疑问，咨询 AI..."
+                    placeholder="长按麦克风说话，或输入文字咨询 AI..."
                     placeholder-class="st-float-placeholder"
                     confirm-type="send"
                     @input="onDietAiAskInput"
                     @confirm="askDietAiFood"
                 />
+                <view
+                    class="st-float-mic"
+                    :class="{ listening: sttListening || sttHolding, disabled: dietAiAsking || !sttSupported }"
+                    @touchstart.stop.prevent="onDietAiSpeechStart"
+                    @touchend.stop.prevent="onDietAiSpeechEnd"
+                    @touchcancel.stop.prevent="onDietAiSpeechEnd"
+                >
+                    <TongjiIcon name="mic" size="sm" :color="(sttListening || sttHolding) ? '#ffffff' : '#006c49'" />
+                </view>
                 <view
                     class="st-float-send"
                     :class="{ disabled: dietAiAsking }"
@@ -251,6 +261,9 @@
                     <TongjiIcon name="send" size="sm" color="#ffffff" />
                 </view>
             </view>
+            <view v-if="sttHolding && !dietAiAsking" class="st-float-hold-hint">
+                <text>{{ sttListening ? '松手结束' : '准备录音…' }}</text>
+            </view>
             <view v-if="dietAiAsking || dietAiAskResult.advice" class="st-float-result">
                 <view v-if="dietAiAskResult.level_label" class="st-float-badge">
                     <text>{{ dietAiAskResult.level_label }}</text>
@@ -419,6 +432,7 @@ import { onLoad, onShow, onHide, onUnload, onPullDownRefresh, onShareAppMessage
 import SugarTreeGraphic from '../components/SugarTreeGraphic.vue'
 import TongjiIcon from '../components/TongjiIcon.vue'
 import { useDietAi } from '../composables/useDietAi.js'
+import { useSpeechToText } from '../composables/useSpeechToText.js'
 
 const { proxy } = getCurrentInstance()
 
@@ -487,6 +501,30 @@ const {
     openDietForm
 } = useDietAi(proxy, { diagnosisId, showUserToast, formatUserMessage })
 
+const {
+    sttListening,
+    sttHolding,
+    sttSupported,
+    beginHoldSpeech,
+    endHoldSpeech,
+    stopSpeechToText
+} = useSpeechToText({
+    onResult(text) {
+        const prev = String(dietAiAskText.value || '').trim()
+        dietAiAskText.value = prev ? `${prev} ${text}` : text
+    },
+    showToast: (msg) => showUserToast(msg)
+})
+
+function onDietAiSpeechStart() {
+    if (dietAiAsking.value) return
+    beginHoldSpeech()
+}
+
+function onDietAiSpeechEnd() {
+    endHoldSpeech()
+}
+
 /** AI 饮食建议依据：近7天 / 近30天 血糖统计 */
 const dietAnalysisList = computed(() => {
     const list = dietAiRecommend.value && Array.isArray(dietAiRecommend.value.analysis)
@@ -2495,10 +2533,12 @@ onPullDownRefresh(async () => {
 
 onHide(() => {
     ttsStop()
+    stopSpeechToText()
 })
 
 onUnload(() => {
     ttsStop()
+    stopSpeechToText()
 })
 
 // ============ 邀请观看（家人分享页）============

TUICallKit-Vue3/tongji/styles/weekly-stitch.scss

@@ -647,6 +647,45 @@
     font-size: 28rpx;
 }
 
+.weekly-page .st-float-mic {
+    width: 72rpx;
+    height: 72rpx;
+    border-radius: 50%;
+    background: rgba(0, 108, 73, 0.1);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    transition: background 0.2s ease, transform 0.15s ease;
+}
+
+.weekly-page .st-float-mic.listening {
+    background: var(--primary);
+    animation: st-float-mic-pulse 1.2s ease-in-out infinite;
+}
+
+.weekly-page .st-float-mic.disabled {
+    opacity: 0.45;
+    pointer-events: none;
+}
+
+.weekly-page .st-float-mic:active {
+    transform: scale(0.94);
+}
+
+.weekly-page .st-float-hold-hint {
+    margin-top: 12rpx;
+    text-align: center;
+    font-size: 24rpx;
+    color: var(--primary);
+    line-height: 1.4;
+}
+
+@keyframes st-float-mic-pulse {
+    0%, 100% { box-shadow: 0 0 0 0 rgba(0, 108, 73, 0.35); }
+    50% { box-shadow: 0 0 0 12rpx rgba(0, 108, 73, 0); }
+}
+
 .weekly-page .st-float-send {
     width: 80rpx;
     height: 80rpx;