JLBA202505130001_关于吉林银行新建AI智能培训系统的需求_继续开发语音按钮

This commit is contained in:
田岩
2026-03-03 17:58:22 +08:00
parent d307b6b6d7
commit 60e7f272d8
18 changed files with 385 additions and 223 deletions
+1
View File
@@ -58,6 +58,7 @@
"@dcloudio/vite-plugin-uni": "3.0.0-4060620250520001", "@dcloudio/vite-plugin-uni": "3.0.0-4060620250520001",
"@vue/runtime-core": "^3.4.21", "@vue/runtime-core": "^3.4.21",
"sass": "1.77.0", "sass": "1.77.0",
"typescript": "^5.9.3",
"vite": "5.2.8" "vite": "5.2.8"
} }
} }
+8 -3
View File
@@ -47,8 +47,8 @@ export enum ControlCode {
AI_ANSWER_OVER = 0b0100, // 本轮AI回答的文本内容已经全部返回 AI_ANSWER_OVER = 0b0100, // 本轮AI回答的文本内容已经全部返回
AI_CLUE = 0b0101, // 需要AI提示命令(发后端) AI_CLUE = 0b0101, // 需要AI提示命令(发后端)
AI_CLUE_OVER = 0b0110, // AI提示命令已经全部返回 AI_CLUE_OVER = 0b0110, // AI提示命令已经全部返回
FRNOT_TO_SERVER_OVER = 0b0111, // 语音按钮已经抬起 FRONT_TO_SERVER_OVER = 0b0111, // 语音按钮已经抬起
SERVER_TO_FRNOT_OVER = 0b1000, // 后端已经返回本次全部内容 SERVER_TO_FRONT_OVER = 0b1000, // 后端已经返回本次全部内容
} }
@@ -97,6 +97,11 @@ export enum ControlCommand {
FINISH_PLAY = 0b0010, // 一句话播放结束 FINISH_PLAY = 0b0010, // 一句话播放结束
} }
export interface ControlBody {
type: ControlCode; // type 是必选属性,关联你的 ControlCode 枚举
[key: string]: any; // 索引签名:兼容后端返回的任意动态属性(txt/ossKey 等)
}
/** /**
* 解包返回结果接口 * 解包返回结果接口
*/ */
@@ -108,7 +113,7 @@ export interface UnpackedResult {
compression : CompressionType; compression : CompressionType;
compressionName : keyof typeof CompressionType; compressionName : keyof typeof CompressionType;
sequence : number; // 消息顺序号(0~65535,默认0 sequence : number; // 消息顺序号(0~65535,默认0
body : Uint8Array | string | object | unknown[] | null; // PING 消息可能返回 null body : Uint8Array | string | object | unknown[] | null | ControlBody; // PING 消息可能返回 null
} }
/** /**
-2
View File
@@ -83,12 +83,10 @@ const hideLoading = () => uni.hideLoading()
// 根据姓名的长度生成对应的带星号格式 // 根据姓名的长度生成对应的带星号格式
export const formatName = (name) => { export const formatName = (name) => {
// 处理空值或非字符串情况 // 处理空值或非字符串情况
if (!name || typeof name !== 'string') { if (!name || typeof name !== 'string') {
return ''; return '';
} }
const familyName = name.charAt(0); // 取姓氏(第一个字符) const familyName = name.charAt(0); // 取姓氏(第一个字符)
const givenNameLength = name.length - 1; // 名字部分的长度 const givenNameLength = name.length - 1; // 名字部分的长度
Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.5 KiB

+1 -1
View File
@@ -1,4 +1,4 @@
.talk-btns { .talk-btns-components {
position: flex; position: flex;
left: 0; left: 0;
bottom: 0; bottom: 0;
+117 -68
View File
@@ -3,66 +3,74 @@
flex-direction: column; flex-direction: column;
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background-color: rgba(0, 0, 0, 0.8); background-color: rgba(0, 0, 0, 0.85);
position: relative; position: relative;
} }
/* 1. 定义通用的向右移出动画(核心:添加时长,解决秒没) */ /* 1. 定义通用的向右移出动画(核心:添加时长,解决秒没) */
@keyframes moveRightOut { @keyframes moveRightOut {
0% { 0% {
right: 0; /* 初始位置 */ right: 0; /* 初始位置 */
} }
100% { 100% {
right: -400rpx; /* 目标位置:向右移出400rpx */ right: -400rpx; /* 目标位置:向右移出400rpx */
} }
} }
/* 2. 定义通用的向左移出动画(适配 btn-box-1) */ /* 2. 定义通用的向左移出动画(适配 btn-box-1) */
@keyframes moveLeftOut { @keyframes moveLeftOut {
0% { 0% {
left: 0; /* 初始位置 */ left: 0; /* 初始位置 */
} }
100% { 100% {
left: -400rpx; /* 目标位置:向左移出400rpx */ left: -400rpx; /* 目标位置:向左移出400rpx */
} }
} }
/* 2. 定义通用的向左移出动画(适配 btn-box-1) */ /* 2. 定义通用的向左移出动画(适配 btn-box-1) */
@keyframes moveBottomOut { @keyframes moveBottomOut {
0% { 0% {
transform: translateY(0%); transform: translateY(0%);
} }
100% { 100% {
transform: translateY(100%); transform: translateY(130%);
} }
} }
@keyframes fadeIn { @keyframes fadeIn {
0% { 0% {
opacity: 0; opacity: 0;
} }
100% { 100% {
opacity: 1; opacity: 1;
} }
}
.page-box {
position: relative;
height: 500rpx;
transition: margin-bottom 0.2s ease-out;
} }
.page-1 { .page-1 {
position: absolute; position: absolute;
width: 100%; width: 100%;
bottom: 0; bottom: 0;
&.voice_to_text{ &.voice_to_text {
.btn-box-1 { .btn-box-1 {
animation: moveLeftOut 0.3s ease-out forwards; animation: moveLeftOut 0.3s ease-out forwards;
/* 清除冲突样式 */ }
transform: none !important; .btn-box-2 {
transition: none !important; animation: moveRightOut 0.3s ease-out forwards;
} }
.circle-bg-box {
.btn-box-2 { animation: moveBottomOut 0.3s ease-out forwards;
animation: moveRightOut 0.3s ease-out forwards; }
/* 清除冲突样式 */ }
transform: none !important; // 仅语音
transition: none !important; &.voice-only {
} .btn-box-1,
.circle-bg-box{ .btn-box-2 {
animation: moveBottomOut 0.3s ease-out forwards; display: none;
} }
.btn-box-3 {
display: block !important;
}
} }
// 两侧按钮 // 两侧按钮
.btns-box { .btns-box {
@@ -73,7 +81,6 @@
z-index: 1200; z-index: 1200;
justify-content: space-around; justify-content: space-around;
position: relative; position: relative;
.btn-box { .btn-box {
position: absolute; position: absolute;
height: 164rpx; height: 164rpx;
@@ -90,6 +97,13 @@
transition: right 0.3s ease-out; transition: right 0.3s ease-out;
right: -40rpx; right: -40rpx;
} }
.btn-box-3 {
position: absolute;
height: 124rpx;
transform: scale(1.2);
bottom: 30rpx;
display: none;
}
} }
// 底部半圆 // 底部半圆
.circle-bg-box { .circle-bg-box {
@@ -110,40 +124,52 @@
} }
} }
} }
.page-2{ .page-2 {
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
padding-bottom: 50rpx;
font-size: 28rpx; font-size: 28rpx;
text-align: center; text-align: center;
display: none; display: none;
z-index: 12000; z-index: 1200;
justify-content: space-around; justify-content: space-around;
margin-bottom:234rpx;; margin-bottom: 214rpx;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
opacity: 0; opacity: 0;
visibility: hidden; // 初始不可见且不占交互位置 visibility: hidden; // 初始不可见且不占交互位置
&.voice_to_text { &.voice_to_text {
display: flex !important; display: flex !important;
visibility: visible; // 激活后可见 visibility: visible; // 激活后可见
animation: fadeIn 0.4s ease-out 0.1s forwards; animation: fadeIn 0.4s ease-out 0.1s forwards;
} }
.transVoiceIng { .transVoiceIng {
width: 154rpx; width: 154rpx;
height: 154rpx; height: 154rpx;
overflow: hidden; overflow: visible;
position: relative; position: relative;
z-index: 12010; z-index: 1200;
&.cancel-btn { &.cancel-btn {
background: url(@/static/images/course/cancel-btn.png) no-repeat; background: url(@/static/images/course/cancel-btn.png) no-repeat;
background-size: cover; background-size: cover;
} }
&.trans-btn { &.trans-btn {
background: url(@/static/images/course/trans-btn.png) no-repeat; background: url(@/static/images/course/trans-btn.png) no-repeat;
background-size: cover; background-size: cover;
} }
.btn-text {
position: absolute;
top: calc(100% + 15rpx); /* 按钮底部+10rpx间距,避免贴边 */
left: 50%;
transform: translateX(-50%);
/* 2. 强制显示 + 最高层级,防止被遮挡 */
display: block !important;
z-index: 10000;
color: rgb(163, 163, 163);
font-size: 28rpx;
white-space: nowrap;
}
} }
.send-btn { .send-btn {
position: relative; position: relative;
@@ -154,12 +180,36 @@
background-color: #d8d8d8; background-color: #d8d8d8;
border-radius: 77rpx; border-radius: 77rpx;
font-size: 33rpx; font-size: 33rpx;
z-index: 12010; z-index: 1200;
display: flex;
align-items: center;
justify-content: center;
.send-btn-loading,
.send-btn-text {
display: none;
}
}
&.init > .send-btn > .send-btn-loading {
display: block !important;
pointer-events: none;
cursor: not-allowed;
}
&.success > .send-btn > .send-btn-text {
display: block !important;
}
&.failed .send-btn {
pointer-events: none;
cursor: not-allowed;
background-color: rgb(80, 80, 80);
color: rgb(106, 106, 106);
.send-btn-text {
display: block !important;
}
} }
} }
.talk-dialog-box{ .talk-dialog-box {
position: absolute; position: relative;
bottom: 520rpx ; // bottom: 560rpx;
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
@@ -173,7 +223,7 @@
// 滑动到离开变红 // 滑动到离开变红
&.is-out { &.is-out {
background-color: #ff3e49; background-color: #ff3e49;
&::after { &::after {
background-color: #ff3e49; background-color: #ff3e49;
} }
@@ -199,9 +249,11 @@
transition: left 0.3s ease-out; // 时长0.3秒,ease-out缓动(结束时变慢,更自然) transition: left 0.3s ease-out; // 时长0.3秒,ease-out缓动(结束时变慢,更自然)
} }
// 控制下边箭头指向发送 // 控制下边箭头指向发送
&.init::after { &.init::after,
&.success::after {
left: 78% !important; left: 78% !important;
} }
&.failed { &.failed {
width: 506rpx; width: 506rpx;
height: 114rpx; height: 114rpx;
@@ -211,11 +263,15 @@
background-color: #ff3e49; background-color: #ff3e49;
} }
// 激活错误提示框 // 激活错误提示框
.error-tip-div{ .error-tip-div {
display: flex !important; display: flex !important;
visibility: visible; // 激活后可见 visibility: visible; // 激活后可见
// animation: fadeIn 0.4s ease-out 0.1s forwards; // animation: fadeIn 0.4s ease-out 0.1s forwards;
} }
.textarea {
// display: none;
visibility: hidden; // 初始不可见且不占交互位置
}
} }
} }
.talk-dialog { .talk-dialog {
@@ -239,29 +295,22 @@
top: 50%; top: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
} }
.error-tip-div{ .error-tip-div {
top: 50%; top: 50%;
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
position: absolute; position: absolute;
display: none; display: none;
visibility: hidden; // 初始不可见且不占交互位置 visibility: hidden; // 初始不可见且不占交互位置
display: flex; display: flex;
align-items: center; align-items: center;
color: #ffffff; color: #ffffff;
font-size: 24rpx; font-size: 24rpx;
font-weight: 400; font-weight: 400;
.img{ .img {
margin-right: 10rpx; margin-right: 10rpx;
width: 26rpx; width: 26rpx;
height: 26rpx; height: 26rpx;
} }
} }
} }
@@ -4,7 +4,11 @@ export { default as cancelBtn } from './assets/cancel.png';
export { default as cancelActiveBtn } from './assets/cancel-active.png'; export { default as cancelActiveBtn } from './assets/cancel-active.png';
export { default as translateBtn } from './assets/translate.png'; export { default as translateBtn } from './assets/translate.png';
export { default as translateActiveBtn } from './assets/translate-active.png'; export { default as translateActiveBtn } from './assets/translate-active.png';
export { default as closeBtn } from './assets/close.png';
export { default as closeActiveBtn } from './assets/close-active.png';
export { default as voiceWhiteBtn } from './assets/voice-white.gif'; export { default as voiceWhiteBtn } from './assets/voice-white.gif';
export const icKeyboardSvg = () : string => { export const icKeyboardSvg = () : string => {
const svgXml = ` const svgXml = `
<svg t="1772357429950" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1775" width="200" height="200"><path d="M513.788813 938.289925c-113.566274 0-220.223734-44.167967-300.444149-124.388381-80.220415-80.220415-124.388382-186.877876-124.388382-300.44415s44.167967-220.227983 124.388382-300.448398c165.543834-165.548083 435.348714-165.548083 600.892548 0 165.548083 165.548083 165.548083 435.348714 0 600.892548-80.220415 80.220415-186.877876 124.388382-300.44415 124.388381z m0-785.973112c-92.538158 0-185.072066 35.453344-255.379651 105.756681-68.2001 68.204349-105.75668 158.63927-105.756681 255.3839s37.556581 187.175303 105.756681 255.379652c68.204349 68.2001 158.936697 106.054108 255.379651 105.75668 96.74888 0 187.179552-37.556581 255.379652-105.75668 140.912598-140.912598 140.912598-369.850954 0-510.759303-70.303336-70.307585-162.841494-105.75668-255.379652-105.756681z" fill="#515151" p-id="1776"></path><path d="M318.672199 341.705826h46.313693c11.047303 0 19.545228 8.497925 19.545228 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332h-46.738589c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695436v-46.738589c0-10.622407 8.497925-19.120332 19.120332-19.120332zM488.630705 341.705826h46.313693c11.047303 0 19.545228 8.497925 19.545229 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332h-46.73859c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695436v-46.738589c0-10.622407 8.497925-19.120332 19.120332-19.120332zM658.589212 341.705826h46.313693c11.047303 0 19.545228 8.497925 19.545228 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332h-46.738589c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695436v-46.738589c0-10.622407 8.497925-19.120332 19.120332-19.120332zM318.672199 469.174705h46.313693c10.622407 0 19.120332 8.497925 19.120332 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332H318.672199c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695435v-46.73859c0-10.622407 8.497925-19.120332 19.120332-19.120332zM488.630705 469.174705h46.313693c10.622407 0 19.120332 8.497925 19.120332 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332h-46.313693c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695435v-46.73859c0-10.622407 8.497925-19.120332 19.120332-19.120332zM658.589212 469.174705h46.313693c10.622407 0 19.120332 8.497925 19.120332 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332h-46.313693c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695435v-46.73859c0-10.622407 8.497925-19.120332 19.120332-19.120332zM458.887967 660.378025h106.224066c17.420747 0 31.86722 14.446473 31.86722 31.86722s-14.446473 31.86722-31.86722 31.86722h-106.224066c-17.420747 0-31.86722-14.446473-31.86722-31.86722s14.446473-31.86722 31.86722-31.86722z" fill="#515151" p-id="1777"></path></svg> <svg t="1772357429950" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1775" width="200" height="200"><path d="M513.788813 938.289925c-113.566274 0-220.223734-44.167967-300.444149-124.388381-80.220415-80.220415-124.388382-186.877876-124.388382-300.44415s44.167967-220.227983 124.388382-300.448398c165.543834-165.548083 435.348714-165.548083 600.892548 0 165.548083 165.548083 165.548083 435.348714 0 600.892548-80.220415 80.220415-186.877876 124.388382-300.44415 124.388381z m0-785.973112c-92.538158 0-185.072066 35.453344-255.379651 105.756681-68.2001 68.204349-105.75668 158.63927-105.756681 255.3839s37.556581 187.175303 105.756681 255.379652c68.204349 68.2001 158.936697 106.054108 255.379651 105.75668 96.74888 0 187.179552-37.556581 255.379652-105.75668 140.912598-140.912598 140.912598-369.850954 0-510.759303-70.303336-70.307585-162.841494-105.75668-255.379652-105.756681z" fill="#515151" p-id="1776"></path><path d="M318.672199 341.705826h46.313693c11.047303 0 19.545228 8.497925 19.545228 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332h-46.738589c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695436v-46.738589c0-10.622407 8.497925-19.120332 19.120332-19.120332zM488.630705 341.705826h46.313693c11.047303 0 19.545228 8.497925 19.545229 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332h-46.73859c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695436v-46.738589c0-10.622407 8.497925-19.120332 19.120332-19.120332zM658.589212 341.705826h46.313693c11.047303 0 19.545228 8.497925 19.545228 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332h-46.738589c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695436v-46.738589c0-10.622407 8.497925-19.120332 19.120332-19.120332zM318.672199 469.174705h46.313693c10.622407 0 19.120332 8.497925 19.120332 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332H318.672199c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695435v-46.73859c0-10.622407 8.497925-19.120332 19.120332-19.120332zM488.630705 469.174705h46.313693c10.622407 0 19.120332 8.497925 19.120332 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332h-46.313693c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695435v-46.73859c0-10.622407 8.497925-19.120332 19.120332-19.120332zM658.589212 469.174705h46.313693c10.622407 0 19.120332 8.497925 19.120332 19.120332v46.313693c0 10.622407-8.497925 19.120332-19.120332 19.120332h-46.313693c-10.622407 0.424896-19.120332-8.073029-19.120332-18.695435v-46.73859c0-10.622407 8.497925-19.120332 19.120332-19.120332zM458.887967 660.378025h106.224066c17.420747 0 31.86722 14.446473 31.86722 31.86722s-14.446473 31.86722-31.86722 31.86722h-106.224066c-17.420747 0-31.86722-14.446473-31.86722-31.86722s14.446473-31.86722 31.86722-31.86722z" fill="#515151" p-id="1777"></path></svg>
+83 -62
View File
@@ -1,11 +1,13 @@
import { ErrorCode, ShowErrorTipOptions } from './touch-btn.types'; import { ErrorCode, ShowErrorTipOptions } from './touch-btn.types';
import { get_base_url } from '@/api/request.js'; import { get_base_url } from '@/api/request.js';
import { getToken } from '@/common/common.js'; import { getToken, getPhoneEnvBool } from '@/common/common.js';
const IsAndEnv = getPhoneEnvBool('AND')
// const url = '/trapractice/voiceCallSocket/voiceCall' // const url = '/trapractice/voiceCallSocket/voiceCall'
// const url = '/traapp/voiceTransSocket/open'; // const url = '/traapp/voiceTransSocket/open';
const url = '/traapp/voiceAiModelSocket/open'; // const url = '/traapp/asrAiModelSocket/open';
const url = '/traapp/asrAiModelSocket/open';
const _baseUrl = get_base_url(url).split('http').join('ws'); const _baseUrl = get_base_url(url).split('http').join('ws');
// const _baseUrl = '';
export const wsUrl = _baseUrl + url + '?summary=' + getToken(); export const wsUrl = _baseUrl + url + '?summary=' + getToken();
const windowInfo = uni.getWindowInfo(); const windowInfo = uni.getWindowInfo();
// 安全区域信息 // 安全区域信息
@@ -17,58 +19,48 @@ export const bottomAreaTopBoundary = safeArea.bottom - btnHeight;
// 屏幕横向分割线 // 屏幕横向分割线
export const horizontalSplitX = safeArea.right / 2; export const horizontalSplitX = safeArea.right / 2;
// 假设你在 Vue3 环境中,ws、wsStatus 是 ref 响应式变量
import { ref } from 'vue';
const ws = ref(null);
const wsStatus = ref(false);
/** /**
* 封装WebSocket连接为Promise * 封装WebSocket连接为Promise
* @param {string} wsUrl - WebSocket连接地址 * @param {string} wsUrl - WebSocket连接地址
* @returns {Promise<UniApp.SocketTask>} 成功时返回WS实例,失败时reject错误信息 * @returns {Promise<UniApp.SocketTask>} 成功时返回WS实例,失败时reject错误信息
*/ */
export const initWebSocket = (wsUrl: string): Promise<UniApp.SocketTask> => { export const initWebSocket = (wsUrl : string) : Promise<UniApp.SocketTask> => {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
// 1. 创建WS连接 // 1. 创建WS连接
const ws = uni.connectSocket({ const ws = uni.connectSocket({
url: wsUrl, url: wsUrl,
fail: (err) => { fail: (err) => {
console.error('WS连接创建失败:', err); console.error('WS连接创建失败:', err);
// 连接创建失败直接reject // 连接创建失败直接reject
reject(new Error(`WS连接创建失败:${err.errMsg || err.message}`)); reject(new Error(`WS连接创建失败:${err.errMsg || err.message}`));
}, },
success: () => { success: () => {
console.log('WS连接创建请求已发送'); }
} });
});
// 2. 监听连接成功(核心:连接成功时resolve,返回WS实例)
const onOpenHandler = (res) => {
resolve(ws);
};
// 2. 监听连接成功(核心:连接成功时resolve,返回WS实例 // 4. 监听连接错误(出错时reject
const onOpenHandler = (res) => { const onErrorHandler = (err) => {
console.log('ws已连接', res); console.log('WS连接错误', err);
// resolve返回WS实例 // reject返回错误信息
resolve(ws); reject(new Error(`WS连接错误:${err.errMsg || err.message}`));
}; };
// 4. 监听连接错误(出错时reject // 5. 监听连接关闭(如果在open前关闭,也reject
const onErrorHandler = (err) => { const onCloseHandler = (err) => {
console.log('WS连接错误', err); console.log('WS连接已关闭', err);
// reject返回错误信息 // 连接未成功就关闭,执行reject
reject(new Error(`WS连接错误${err.errMsg || err.message}`)); reject(new Error(`WS连接已关闭${err.errMsg || err.message}`));
}; };
// 绑定监听事件
// 5. 监听连接关闭(如果在open前关闭,也reject) ws.onOpen(onOpenHandler);
const onCloseHandler = (err) => { ws.onError(onErrorHandler);
console.log('WS连接已关闭', err); ws.onClose(onCloseHandler);
// 连接未成功就关闭,执行reject });
reject(new Error(`WS连接已关闭:${err.errMsg || err.message}`));
};
// 绑定监听事件
ws.onOpen(onOpenHandler);
ws.onError(onErrorHandler);
ws.onClose(onCloseHandler);
});
}; };
/** /**
@@ -78,19 +70,48 @@ export const initWebSocket = (wsUrl: string): Promise<UniApp.SocketTask> => {
* @returns 固定返回false(保持原有返回值类型) * @returns 固定返回false(保持原有返回值类型)
*/ */
export function showErrorTip( export function showErrorTip(
errorCode: ErrorCode, errorCode : ErrorCode,
options: ShowErrorTipOptions = {} options : ShowErrorTipOptions = {}
): boolean { ) : boolean {
// 解构可选参数,设置默认延迟时间为200ms // 解构可选参数,设置默认延迟时间为200ms
const { delayTime = 200 } = options; const { delayTime = 200 } = options;
// 延迟显示对应的错误提示 // 延迟显示对应的错误提示
setTimeout(() => { setTimeout(() => {
uni.showToast({ uni.showToast({
title: errorCode, // 直接使用枚举值作为提示文本 title: errorCode, // 直接使用枚举值作为提示文本
icon: 'none' icon: 'none'
}); });
}, delayTime); // 使用传入的延迟时间(或默认200ms) }, delayTime); // 使用传入的延迟时间(或默认200ms)
return false;
}
/**
* 跨平台震动反馈封装(适配安卓/iOS)轻震
* @returns {Promise<boolean>} 是否成功触发震动
*/
export const vibrateLight = () : void => {
// #ifdef APP-PLUS
try {
if (IsAndEnv) {
uni.vibrateShort({
success: function () {
console.log('success');
}
});
} else {
let UIImpactFeedbackGenerator = plus.ios.importClass(
'UIImpactFeedbackGenerator'
)
let impact = new UIImpactFeedbackGenerator()
impact.prepare()
impact.init(1)
impact.impactOccurred()
}
} catch (error) {
console.error('震动功能执行异常:', error);
}
// #endif
}
return false;
}
+35 -3
View File
@@ -6,7 +6,7 @@
* - 'text_input' : 文字输入中状态(文字输入面板展开,用户正在输入) * - 'text_input' : 文字输入中状态(文字输入面板展开,用户正在输入)
* - 'voice_to_text' : 语音转文字状态(独立的语音转文字页面/面板展开) * - 'voice_to_text' : 语音转文字状态(独立的语音转文字页面/面板展开)
*/ */
export type StatusType = 'default' | 'voice_recording' | 'text_input' | 'voice_to_text'; export type StatusType = 'default' | 'voice_recording' | 'text_input' | 'voice_to_text' | 'voice_send_ing';
/** /**
* 语音转文字的子状态(仅当主状态为 voice_to_text 时生效) * 语音转文字的子状态(仅当主状态为 voice_to_text 时生效)
@@ -14,7 +14,7 @@ export type StatusType = 'default' | 'voice_recording' | 'text_input' | 'voice_t
export type VoiceToTextSubStatus = export type VoiceToTextSubStatus =
| '' // 纯空 | '' // 纯空
| 'init' // 初始化(刚进入语音转文字页面) | 'init' // 初始化(刚进入语音转文字页面)
| 'loading' // 转换中(正在处理语音→文字) // | 'loading' // 转换中(正在处理语音→文字)
| 'success' // 转换完成(成功得到文字结果) | 'success' // 转换完成(成功得到文字结果)
| 'failed'; // 转换失败(网络/识别错误等) | 'failed'; // 转换失败(网络/识别错误等)
@@ -31,4 +31,36 @@ export enum ErrorCode {
export interface ShowErrorTipOptions { export interface ShowErrorTipOptions {
// 提示框延迟显示时间(毫秒),默认200ms // 提示框延迟显示时间(毫秒),默认200ms
delayTime?: number; delayTime?: number;
} }
/**
* 触摸按钮组件的自定义事件类型定义
* 包含录音、提交、加载相关的所有事件及参数规范
*/
export type TouchBtnEmits = {
/**
* 提交语音内容(语音转文字完成后触发)
* @param voiceData - 语音相关数据(包含ossKey、识别文本等核心字段)
* @param duration - 录音时长(单位:毫秒),用于校验最短录音时长
*/
submitVoice: [params: { ossKey: string; text: string }];
/**
* 提交文字答案(用户确认识别结果/手动编辑后触发)
* @param answerText - 最终提交的文字答案内容
* @param isManualEdit - 是否手动编辑过识别结果(true=手动修改,false=纯语音识别)
*/
submitAnswer: [answerText: string, isManualEdit: boolean];
/**
* 开始录音(用户点击录音按钮时触发)
* @param recordParams - 录音初始化参数(可选,默认使用组件内置配置)
*/
startRecord: [recordParams?: { sampleRate: number; channels: number }];
/**
* 发送加载状态(提交语音/文字时触发,控制父组件加载动画)
* @param isLoading - 是否处于加载中(true=显示加载,false=隐藏加载)
* @param loadingText - 加载提示文本(可选,默认:"处理中..."
*/
sendLoading: [params: { recordId: string; loadingText?: string }];
};
+103 -64
View File
@@ -1,29 +1,28 @@
<template> <template>
<view> <view>
<view class="talk-btns" :class="{action:isRecording, inputMode:!isInputVisible}"> <view class="talk-btns-components" :class="{action:isRecording, inputMode:!isInputVisible}">
<view class="touch-btn" @click="disabled_click"> <view class="touch-btn" @click="disabled_click">
<button v-if="!isTextOnlyMode && isInputVisible" class="voice-btn" @touchstart="startRecord" <button v-if="!isTextOnlyMode && isInputVisible" class="voice-btn" @touchstart="startRecord"
@touchend="stopRecord()" @touchmove="handleMove" @touchcancel="stopRecord()" :plain="true"> @touchend="stopRecord()" @touchmove="handleMove" @touchcancel="stopRecord()" :plain="true">
<text class="voice-text">{{ isRecording ? '松开发送' : '按住说话' }}</text> <text class="voice-text">{{ isRecording ? '松开发送' : '按住说话' }}</text>
</button> </button>
<input v-if="!isVoiceOnlyMode && !isInputVisible" class="input-box" ref="inputRef" v-model="inputText" <input v-if="!isVoiceOnlyMode && !isInputVisible" class="input-box" ref="inputRef" v-model="inputText"
:maxlength="props.textValueLength" :adjustPosition="true" :maxlength="props.maxlength" :adjustPosition="true"
placeholderStyle="color:#999999;font-size:26rpx" placeholder="请输入文字" placeholderStyle="color:#999999;font-size:26rpx" placeholder="请输入文字"
:disabled="props.isDisabled"></input> :disabled="props.isDisabled" @click="disabled_click"></input>
</view> </view>
<view class="talk-right-icon-div" v-if="!isTextOnlyMode && !isVoiceOnlyMode"> <view class="talk-right-icon-div" v-if="!isTextOnlyMode && !isVoiceOnlyMode">
<image class="talk-right-icon" :src="talkRightIcon" mode="widthFix" @click="changeBtn"></image> <image class="talk-right-icon" :src="talkRightIcon" mode="widthFix" @click="changeBtn"></image>
</view> </view>
</view> </view>
<!-- :class="{ 'is-out': isOutStatus === '02', 'is-translate': isOutStatus === '03', voice_to_text_status: status === 'voice_to_text'}" --> <uni-popup ref="popupRef" class="popup" @touchmove.stop.prevent="false">
<uni-popup ref="popupRef" class="popup"> <view class="overlay-box" >
<view class="overlay-box">
<view class="fl1"></view> <view class="fl1"></view>
<view class="talk-dialog-box"> <view class="talk-dialog-box">
<view class="talk-dialog-div" :class="dialogDynamicClasses"> <view class="talk-dialog-div" :class="dialogDynamicClasses">
<view class="talk-dialog" > <view class="talk-dialog" >
<image :src="voiceWhiteBtn" mode="" class="gif-box"></image> <image :src="voiceWhiteBtn" mode="" class="gif-box"></image>
<uv-textarea ref="inputRef" v-model="textAreaText" :maxlength="255" @click.stop <uv-textarea class="textarea" ref="inputRef" v-model="textAreaText" :maxlength="255" @click.stop
customStyle="background: #ffffff00; padding-bottom: 50rpx; color: #fff; caret-color: #fff" customStyle="background: #ffffff00; padding-bottom: 50rpx; color: #fff; caret-color: #fff"
text-style="color: #fff" border="none" placeholderStyle="color:#999999;font-size:26rpx;" text-style="color: #fff" border="none" placeholderStyle="color:#999999;font-size:26rpx;"
placeholder=""></uv-textarea> placeholder=""></uv-textarea>
@@ -37,32 +36,36 @@
</view> </view>
</view> </view>
<!-- 第一形态两侧按钮 --> <!-- 第一形态两侧按钮 -->
<view class="page-1" :class="[ status]"> <view class="page-box" :style="{marginBottom:pageBoxMarginBottom}">
<view class="page-1" :class="[status, props.mode]">
<view class="btns-box"> <view class="btns-box">
<!-- 左侧取消按钮 --> <!-- 左侧取消按钮 -->
<image class="btn-box btn-box-1" :src="isOutStatus == '02' ? cancelActiveBtn : cancelBtn" <image class="btn-box btn-box-1" :src="isOutStatus == '02' ? cancelActiveBtn : cancelBtn"
mode="heightFix" @click="closePopup()"></image> mode="heightFix" @click="closePopup()"></image>
<!-- 右侧转文字按钮 --> <!-- 右侧转文字按钮 -->
<image class="btn-box btn-box-2" :src="isOutStatus == '03' ? translateActiveBtn : translateBtn" <image class="btn-box btn-box-2" :src="isOutStatus == '03' ? translateActiveBtn : translateBtn"
mode="heightFix"></image> mode="heightFix"></image>
<image class="btn-box-3" :src="isOutStatus == '02'? closeActiveBtn : closeBtn"
mode="heightFix" @click="closePopup()"></image>
</view>
<!-- 下方按钮 -->
<view class="circle-bg-box">
<view class="tips-box">松开发送</view>
</view>
</view> </view>
<!-- 下方按钮 --> <!-- 第二形态 -->
<view class="circle-bg-box"> <view class="page-2" :class="[ status, voice_to_text_status]" >
<view class="tips-box">松开发送</view> <!-- 左侧XX -->
<view class="transVoiceIng cancel-btn" @click="closePopup()"><text class="btn-text">取消</text></view>
<!-- 中间发送原语音 -->
<view class="transVoiceIng trans-btn" @click="testFun()"><text class="btn-text">发送原语音</text></view>
<!-- 右侧发送按钮椭圆 -->
<view class="send-btn" @click="send_msg()">
<view class="send-btn-text">发送</view>
<CommonLoading class="send-btn-loading" color="#444"/>
</view>
</view> </view>
</view> </view>
<!-- 第二形态 -->
<view class="page-2" :class="[ status, voice_to_text_status]">
<!-- 左侧XX -->
<view class="transVoiceIng cancel-btn" @click="closePopup()"></view>
<!-- 中间发送原语音 -->
<view class="transVoiceIng trans-btn" @click="testFun()"></view>
<!-- 右侧发送按钮椭圆 -->
<view class="send-btn">发送</view>
</view>
</view> </view>
</uni-popup> </uni-popup>
</view> </view>
@@ -70,26 +73,32 @@
<script setup lang="ts"> <script setup lang="ts">
// 导出图片 // 导出图片
import { cancelBtn, cancelActiveBtn, translateBtn, translateActiveBtn, voiceWhiteBtn, icKeyboardSvg, iconMicSvg, iconSendSvg, iconRecognizeErrorSvg } from './touch-btn.images'; import { cancelBtn, cancelActiveBtn, translateBtn, translateActiveBtn, voiceWhiteBtn,closeBtn,closeActiveBtn, icKeyboardSvg, iconMicSvg, iconSendSvg, iconRecognizeErrorSvg } from './touch-btn.images';
import { StatusType, VoiceToTextSubStatus,ErrorCode } from './touch-btn.types'; import { StatusType, VoiceToTextSubStatus,ErrorCode } from './touch-btn.types';
import { wsUrl, bottomAreaTopBoundary, horizontalSplitX, initWebSocket, showErrorTip } from './touch-btn'; import type {TouchBtnEmits } from './touch-btn.types';
import { wsUrl, bottomAreaTopBoundary, horizontalSplitX, initWebSocket, showErrorTip, vibrateLight } from './touch-btn';
import { ref, computed, onMounted, nextTick, watch, reactive } from 'vue'; import { ref, computed, onMounted, nextTick, watch, reactive } from 'vue';
import common from '@/common/common';
import { onHide, onLaunch } from '@dcloudio/uni-app'; import { onHide, onLaunch } from '@dcloudio/uni-app';
import common from '@/common/common';
import {setupKeyboardHeightListener} from '@/common/common';
import { startAudioRecord, stopAudioRecord, preRequestRecordPermission } from '@/uni_modules/ty-recording'; import { startAudioRecord, stopAudioRecord, preRequestRecordPermission } from '@/uni_modules/ty-recording';
import { ProtocolCodec, MessageType, ControlCommand, ControlCode } from '@/common/protocolCodec'; import { ProtocolCodec, MessageType, ControlCommand, ControlCode, ControlBody } from '@/common/protocolCodec';
import permissionApi from '@/common/permission'; import permissionApi from '@/common/permission';
const emit = defineEmits(['submit']); const emit = defineEmits<TouchBtnEmits>();
const pageBoxMarginBottom = ref('0px'); // 适配输入法
const ws = ref(null); const ws = ref(null);
const wsStatus = ref(false); const wsStatus = ref(false);
const status = ref<StatusType>('default'); const status = ref<StatusType>('default');
const voice_to_text_status = ref<VoiceToTextSubStatus>('init'); const voice_to_text_status = ref<VoiceToTextSubStatus>('init');
const popupRef = ref(null); const popupRef = ref(null);
// 'uploadVoice'
// const emit = defineEmits(['submitVoice', 'submitAnswer', 'startRecord', 'sendLoading']);
const props = defineProps({ const props = defineProps({
// mode控制功能模式 // mode控制功能模式
mode: { mode: {
type: String, type: String,
default: 'both', default: 'voice-only',
validator: (value : string) => { validator: (value : string) => {
return ['voice-only', 'text-only', 'both'].includes(value); return ['voice-only', 'text-only', 'both'].includes(value);
} }
@@ -106,6 +115,7 @@
default: '发送回答中,请稍后再试!', default: '发送回答中,请稍后再试!',
type: String type: String
}, },
// 禁用时候点击反馈的文本
disabledText: { disabledText: {
default: '请稍后再试!', default: '请稍后再试!',
type: String type: String
@@ -118,7 +128,7 @@
default: '当前状态不能发送内容!', default: '当前状态不能发送内容!',
type: String type: String
}, },
textValueLength: { maxlength: {
type: Number, type: Number,
default: 500 default: 500
}, },
@@ -144,6 +154,7 @@
return classes; return classes;
}); });
const recordId = ref('');
const allText = ref(''); const allText = ref('');
const tempText = ref(''); const tempText = ref('');
const inputText = ref(''); const inputText = ref('');
@@ -167,6 +178,8 @@
const isOutStatus = computed(() => { const isOutStatus = computed(() => {
const { y: touchY, x: touchX } = touchPos; const { y: touchY, x: touchX } = touchPos;
if (touchY >= bottomAreaTopBoundary) return '01'; if (touchY >= bottomAreaTopBoundary) return '01';
// 仅语音模式只能返回02,就是取消
if(props.mode === 'voice-only') return '02';
return touchX < horizontalSplitX ? '02' : '03'; return touchX < horizontalSplitX ? '02' : '03';
}); });
// 监听按下移动 // 监听按下移动
@@ -180,10 +193,11 @@
} }
// 开启语音 // 开启语音
const startRecord = async (obj : { touches : any[]; }) => { const startRecord = async (obj : { touches : any[]; }) => {
if(props.isDisabled) return;
try { try {
const state = await permissionApi.judgeIosPermission('record'); const state = await permissionApi.judgeIosPermission('record');
if (state === 'not determined') { // 苹果专用 if (state === 'not determined') { // 苹果专用
preRequestRecordPermission(() => { }) preRequestRecordPermission(() => {})
return; return;
} }
} catch (e) { } catch (e) {
@@ -203,11 +217,29 @@
ws.value.onMessage((res : { data : Uint8Array | ArrayBuffer; }) => { ws.value.onMessage((res : { data : Uint8Array | ArrayBuffer; }) => {
try { try {
const { msgType, body } = ProtocolCodec.unpack(res.data); const { msgType, body } = ProtocolCodec.unpack(res.data);
console.log('msgType', msgType, body);
if (msgType === MessageType.TEXT_MESSAGE) { if (msgType === MessageType.TEXT_MESSAGE) {
tempText.value = ''; tempText.value = '';
allText.value = allText.value + body; allText.value = allText.value + body;
} else if (msgType === MessageType.TIP_MESSAGE) { } else if (msgType === MessageType.TIP_MESSAGE) {
// tempText.value = body;A tempText.value = body as string;
} else if (msgType === MessageType.CONTROL_CMD) { // 返回结束消息
const controlBody = body as ControlBody;
if(controlBody.type === ControlCode.SERVER_TO_FRONT_OVER) {
if(controlBody?.txt === '') { //说明没有识别到文字
voice_to_text_status.value = 'failed'
// todo
} else { // 识别成功
voice_to_text_status.value = 'success'
const ossKey = controlBody?.ossKey;
const text = controlBody?.txt;
// todo
console.log('ossKey', ossKey);
emit('submitVoice', {ossKey,text})
}
}
} }
} catch (e) { } catch (e) {
console.log('后端发来的信息有问题'); console.log('后端发来的信息有问题');
@@ -218,11 +250,7 @@
console.log('网络出现问题'); console.log('网络出现问题');
}) })
pressTimer.value = setTimeout(() => { pressTimer.value = setTimeout(() => {
uni.vibrateShort({ vibrateLight() // 触感震动
success: function () {
console.log('success');
}
});
// 重设按下位置 // 重设按下位置
const changedTouche = obj.touches[0]; const changedTouche = obj.touches[0];
touchPos.x = changedTouche.clientX; touchPos.x = changedTouche.clientX;
@@ -233,15 +261,13 @@
popupRef.value.open(); popupRef.value.open();
startAudioRecord({ startAudioRecord({
onFrame: (pcmData : any) => { onFrame: (pcmData : any) => {
if (wsStatus.value) { if (wsStatus.value && ws.value) {
console.log('已连接', pcmData.length); ws.value.send({ data: ProtocolCodec.pack(MessageType.AUDIO_DATA, pcmData)});
ws.value.send({
data: ProtocolCodec.pack(MessageType.AUDIO_DATA, pcmData)
});
} }
}, },
onStart: (res : any) => { onStart: (res : any) => {
console.log('启动', res); console.log('启动', res);
recordId.value = res.recordId ?? ''
}, },
onStop: () => { onStop: () => {
console.log('关闭'); console.log('关闭');
@@ -253,7 +279,7 @@
} }
} }
}); });
}, 140) }, 120)
}; };
// 结束录音 // 结束录音
@@ -263,9 +289,14 @@
const stopRecord = async (errrStatus='') => { const stopRecord = async (errrStatus='') => {
clearTimeout(pressTimer.value); clearTimeout(pressTimer.value);
if (!isRecording.value) return; // 未处于录音状态 if (!isRecording.value) return; // 未处于录音状态
if (isOutStatus.value === '03') { // 转换文字状态 if (isOutStatus.value === '03') {
console.log('已发送', '03转文字'); status.value = 'voice_to_text' //主状态设置为转文字
switchFromVoiceToText() voice_to_text_status.value = 'init'
} else if(isOutStatus.value === '01') {
status.value = 'voice_send_ing' //主状态设置为语音发送中
}
if(['01', '03'].includes(isOutStatus.value)) { // 向后端发送抬手动作
ws.value && ws.value.send({ data: ProtocolCodec.pack(MessageType.CONTROL_CMD, { type: ControlCode.FRONT_TO_SERVER_OVER})});
} }
const recordDurationMs = Date.now() - recordStartTime.value; const recordDurationMs = Date.now() - recordStartTime.value;
if (isOutStatus.value !== '02') { // 取消的时候,不校验最低时间 if (isOutStatus.value !== '02') { // 取消的时候,不校验最低时间
@@ -290,7 +321,8 @@
}); });
} }
stopAudioRecord(); // 关掉录音 stopAudioRecord(); // 关掉录音
if (isOutStatus.value !== '03' || errrStatus === 'networkError') { // 转文字时候不关遮罩层,网络错误必须关
if (isOutStatus.value !== '03' || errrStatus === 'networkError') { // 转文字时候不关遮罩层,网络错误必须关遮罩层
popupRef.value.close(); popupRef.value.close();
// 关掉弹窗后的提示 // 关掉弹窗后的提示
if(errrStatus === 'networkError') { if(errrStatus === 'networkError') {
@@ -299,22 +331,18 @@
return showErrorTip(ErrorCode.ShortRecord) return showErrorTip(ErrorCode.ShortRecord)
} }
} }
if(isOutStatus.value === '01' && status.value == 'voice_send_ing') {
emit('sendLoading', {recordId:recordId.value})
}
}; };
// 从录音状态切换成转文字状态
const switchFromVoiceToText = () => {
status.value = 'voice_to_text'
ws.value && ws.value.send({ data: ProtocolCodec.pack(MessageType.CONTROL_CMD, { type: ControlCode.FRNOT_TO_SERVER_OVER, ossID: '', text: '' }) });
voice_to_text_status.value = 'init'
// 执行动画
}
// 发送文本 // 发送文本
const showKeyboard = () => { const showKeyboard = () => {
if (isInputVisible.value) { if (isInputVisible.value) {
const inputTextTram = inputText.value.trim(); const inputTextTram = inputText.value.trim();
if (inputTextTram) { if (inputTextTram) {
emit('submit', 'text', inputTextTram); // emit('submit', 'text', inputTextTram);
} else { } else {
common.msg('不能发送空白消息!'); common.msg('不能发送空白消息!');
} }
@@ -322,18 +350,29 @@
isInputVisible.value = !isInputVisible.value; isInputVisible.value = !isInputVisible.value;
} }
}; };
// 切换键盘语音 // 切换键盘语音
const changeBtn = () => { const changeBtn = () => {
if (props.isDisabled) return; if (props.isDisabled) return;
isInputVisible.value = !isInputVisible.value; isInputVisible.value = !isInputVisible.value;
inputText.value = ''; inputText.value = '';
}; };
// 禁用时点击给的提示 // 禁用时点击给的提示
const disabled_click = () => { const disabled_click = () => {
console.log('禁用时点击给的提示'); console.log('禁用时点击给的提示');
if (props.isDisabled) common.msg(props.disabledText); if (props.isDisabled) common.msg(props.disabledText);
}; };
const send_msg = () => {
console.log('点击发送');
}
setupKeyboardHeightListener((height:number) => {
const _height = Math.max(height - 100, 0)
pageBoxMarginBottom.value = `${_height}px`;
});
// 外面调用放弃这次 // 外面调用放弃这次
const give_up = () => { const give_up = () => {
console.log('调用结束语音回答'); console.log('调用结束语音回答');
+7 -7
View File
@@ -111,13 +111,13 @@
</view> </view>
</scroll-view> </scroll-view>
</view> </view>
<!-- <TouchBtn class="talk-btns" @uploadVoice="uploadRecordNow" @submitAnswer="submitAnswerNow" <TouchBtn class="talk-btns" @uploadVoice="uploadRecordNow" @submitAnswer="submitAnswerNow"
@startRecord="startRecordCallback" :loadingText="sendLoadingText" :isLoading="!answerIsOver"
:adjustPosition="true" :isDisabled="isHistory" /> -->
<touch-btn @uploadVoice="uploadRecordNow" @submitAnswer="submitAnswerNow"
@startRecord="startRecordCallback" :loadingText="sendLoadingText" :isLoading="!answerIsOver" @startRecord="startRecordCallback" :loadingText="sendLoadingText" :isLoading="!answerIsOver"
:adjustPosition="true" :isDisabled="isHistory" /> :adjustPosition="true" :isDisabled="isHistory" />
<!-- <touch-btn @uploadVoice="uploadRecordNow" @submitAnswer="submitAnswerNow"
@startRecord="startRecordCallback" :loadingText="sendLoadingText" :isLoading="!answerIsOver"
:adjustPosition="true" :isDisabled="isHistory" /> -->
<History ref="historyRef" @showDetail="showHistoryDetail"></History> <History ref="historyRef" @showDetail="showHistoryDetail"></History>
<PreviewVue ref="previewRef" /> <PreviewVue ref="previewRef" />
</scroll-view> </scroll-view>
@@ -146,7 +146,7 @@
import { import {
setupKeyboardHeightListener setupKeyboardHeightListener
} from '@/common/common'; } from '@/common/common';
// import TouchBtn from '@/pages/course/components/touchBtn.vue'; import TouchBtn from '@/pages/course/components/touchBtn.vue';
import TalkingItem from './components/talking-item.vue'; import TalkingItem from './components/talking-item.vue';
import PreviewVue from './components/preview.vue'; import PreviewVue from './components/preview.vue';
import { import {
@@ -707,6 +707,7 @@
const sendText = (item) => { const sendText = (item) => {
submitAnswerNow(item); submitAnswerNow(item);
}; };
// 发送语音 // 发送语音
const uploadRecordNow = (voicePath, voiceTime) => { const uploadRecordNow = (voicePath, voiceTime) => {
// /traask/traAskchat/voiceTrans // /traask/traAskchat/voiceTrans
@@ -823,7 +824,6 @@
const getQuestionList = () => { const getQuestionList = () => {
queryHotQuestionApi().then((res) => { queryHotQuestionApi().then((res) => {
console.log(res);
questionList.value = res.body questionList.value = res.body
.map((t) => { .map((t) => {
return { return {
+12 -4
View File
@@ -80,7 +80,7 @@
:onlyVoice="true" :onlyVoice="true"
:answerMethod="answerMethod" :answerMethod="answerMethod"
/> />
<TouchBtn <!-- <TouchBtn
v-else v-else
class="talk-btns" class="talk-btns"
ref="touchBtnRef" ref="touchBtnRef"
@@ -91,7 +91,16 @@
:adjustPosition="false" :adjustPosition="false"
:isDisabled="false" :isDisabled="false"
:answerMethod="answerMethod" :answerMethod="answerMethod"
/> -->
<touch-btn
v-else
class="talk-btns"
ref="touchBtnRef"
@uploadVoice="touchBtnSubmit('voice', $event)"
@submitAnswer="touchBtnSubmit('text', $event)"
:isLoading="touchIsDisabled"
loadingText="只能进行一条回答"
:answerMethod="answerMethod"
/> />
</view> </view>
@@ -112,7 +121,7 @@
import Subject from '@/components/examination/subject.vue'; import Subject from '@/components/examination/subject.vue';
import CharactersSubject from '@/components/examination/characters-subject.vue'; import CharactersSubject from '@/components/examination/characters-subject.vue';
// import TouchBtn from '@/components/examination/touchBtn.vue'; // import TouchBtn from '@/components/examination/touchBtn.vue';
import TouchBtn from '@/pages/course/components/touchBtn.vue'; // import TouchBtn from '@/pages/course/components/touchBtn.vue';
import TouchBtnOnlyVoice from '@/pages/course/components/touchBtnOnlyVoice.vue'; import TouchBtnOnlyVoice from '@/pages/course/components/touchBtnOnlyVoice.vue';
import common from '@/common/common'; import common from '@/common/common';
import { setPageCache, formatSeconds, getPageCache, setupKeyboardHeightListener } from '@/common/common'; import { setPageCache, formatSeconds, getPageCache, setupKeyboardHeightListener } from '@/common/common';
@@ -395,7 +404,6 @@
practiceStartTime = new Date().getTime(); practiceStartTime = new Date().getTime();
setupKeyboardHeightListener((height) => { setupKeyboardHeightListener((height) => {
popup_input_bottom.value = `${height}px`; popup_input_bottom.value = `${height}px`;
console.log('需要卸载吗');
}); });
}); });
const result_click = async ({ key }) => { const result_click = async ({ key }) => {
@@ -1,3 +1,3 @@
{ {
"minSdkVersion": "21" "minSdkVersion": "35"
} }
@@ -22,7 +22,8 @@ const minBufferSize = AudioRecord.getMinBufferSize(sampleRate, channelConfig, au
const bufferSize = minBufferSize * 2; const bufferSize = minBufferSize * 2;
let audioRecord : AudioRecord | null = null; let audioRecord : AudioRecord | null = null;
let recordThread : Thread | null = null; let recordThread : Thread | null = null;
// 新增:录音启动时间戳(毫秒)
let recordStartTime: number | null = null;
// ========== 2. 对外暴露的便捷方法(符合UTS导出规范) ========== // ========== 2. 对外暴露的便捷方法(符合UTS导出规范) ==========
@UTSJS.keepAlive @UTSJS.keepAlive
export function startAudioRecord(options : StartAudioRecordOptions) : void { export function startAudioRecord(options : StartAudioRecordOptions) : void {
@@ -43,9 +44,12 @@ export function startAudioRecord(options : StartAudioRecordOptions) : void {
isRecording.set(true) isRecording.set(true)
const _recordThread = new Thread(() => { const _recordThread = new Thread(() => {
_audioRecord.startRecording(); // 开始采集 _audioRecord.startRecording(); // 开始采集
const recordId = `${new Date().getTime()}_${Math.floor(Math.random() * 10000)}`;
recordStartTime = new Date().getTime();
options.onStart?.({ options.onStart?.({
startTime:1111111 startTime: recordStartTime as number,
sampleRate:sampleRate as number,
recordId: recordId
} as AudioStartRes); } as AudioStartRes);
console.log('AudioRecord已启动采集'); console.log('AudioRecord已启动采集');
const buffer = new ByteArray(bufferSize); // 缓冲区只创建一次,避免重复分配内存 const buffer = new ByteArray(bufferSize); // 缓冲区只创建一次,避免重复分配内存
@@ -96,5 +100,4 @@ export function stopAudioRecord() : void {
} }
} }
} }
export function preRequestRecordPermission(callback?: (granted: boolean) => void) {} export function preRequestRecordPermission(callback ?: (granted : boolean) => void) { callback?.(true); }
@@ -125,7 +125,7 @@ export function startAudioRecord(options: StartAudioRecordOptions): void {
console.log("硬件原生格式:", inputFormat.commonFormat); console.log("硬件原生格式:", inputFormat.commonFormat);
recordStartTime = new Date().getTime(); recordStartTime = new Date().getTime();
// 1. 生成录音唯一标识(UUID,方便多录音实例管理) // 1. 生成录音唯一标识(UUID,方便多录音实例管理)
const recordId = `${new Date().getTime()}-${Math.floor(Math.random() * 10000)}`; const recordId = `${new Date().getTime()}_${Math.floor(Math.random() * 10000)}`;
options.onStart?.({ options.onStart?.({
recordId: recordId, // 唯一标识 recordId: recordId, // 唯一标识
sampleRate: inputFormat.sampleRate, // 采样率 sampleRate: inputFormat.sampleRate, // 采样率
@@ -6,7 +6,7 @@
// 成功开启录音的回调参数:返回录音基础配置 // 成功开启录音的回调参数:返回录音基础配置
export type AudioStartRes = { export type AudioStartRes = {
recordId ?: string; // 录音唯一标识(方便多录音实例管理) recordId : string; // 录音唯一标识(方便多录音实例管理)
sampleRate ?: number; // 采样率(如16000 sampleRate ?: number; // 采样率(如16000
startTime : number; // 开启时间戳(毫秒) startTime : number; // 开启时间戳(毫秒)
}; };
+3 -1
View File
@@ -3,6 +3,7 @@
"moduleResolution": "NodeNext", // "Node" "moduleResolution": "NodeNext", // "Node"
"module": "NodeNext", // moduleResolution "module": "NodeNext", // moduleResolution
"target": "ES2022", "target": "ES2022",
"strict": false, //
"jsx": "preserve", "jsx": "preserve",
"lib": ["ES2022", "DOM"], "lib": ["ES2022", "DOM"],
"baseUrl": ".", // tsconfig.json "baseUrl": ".", // tsconfig.json
@@ -11,5 +12,6 @@
"@/*": ["src/*"] "@/*": ["src/*"]
} }
}, },
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"] "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
"exclude": ["node_modules"]
} }