|
|
@@ -71,7 +71,7 @@
|
|
|
<div class="voice-text font22 fw400">
|
|
|
{{voiceText}}
|
|
|
</div>
|
|
|
- <img :src="`${assetsUrl}talk-voice-${isRecording?'delete':'open'}.png`" mode="aspectFill" class="voice-img" @longpress="handleLongPress" @touchmove="handleTouchMove" @touchend="handleTouchEnd"></img>
|
|
|
+ <img :src="`${assetsUrl}talk-voice-${isRecording?'delete':'open'}.png`" mode="aspectFill" class="voice-img"@touchstart="handleTouchStart" @touchmove="handleTouchMove" @touchend="handleTouchEnd"></img>
|
|
|
</div>
|
|
|
<div class="emoji-panel" :style="{'height':`${showActionIndex===3?'200px':'0px'}`}">
|
|
|
<Emoji @enterEmoji="appendMessage"></Emoji>
|
|
|
@@ -100,6 +100,8 @@
|
|
|
import Emoji from '../../components/Emoji/emoji.vue'
|
|
|
import {assetsUrl,hasSafeArea} from '../../util/index.js';
|
|
|
import {getPolicy,computeSignature,getKey} from '@/util/oss.js';
|
|
|
+ import Recorder from 'js-audio-recorder';
|
|
|
+
|
|
|
export default {
|
|
|
components: {
|
|
|
Emoji,
|
|
|
@@ -125,6 +127,7 @@
|
|
|
inputText:'',
|
|
|
showSendBtn:false,
|
|
|
showActionIndex:-1,
|
|
|
+ recorder:null,
|
|
|
voiceText:'按住说话，松手发送',
|
|
|
recordTimeTotal:60,//最大长度，30秒
|
|
|
isRecording:false,
|
|
|
@@ -153,7 +156,13 @@
|
|
|
return JSON.parse(localStorage.getItem('otherInfo'))
|
|
|
}
|
|
|
},
|
|
|
-
|
|
|
+ created(){
|
|
|
+ this.recorder = new Recorder({
|
|
|
+ sampleBits: 16, // 采样位数，支持 8 或 16，默认是16
|
|
|
+ sampleRate: 16000, // 采样率，支持 11025、16000、22050、24000、44100、48000，根据浏览器默认值，我的chrome是48000
|
|
|
+ numChannels: 1,
|
|
|
+ });
|
|
|
+ },
|
|
|
mounted() {
|
|
|
this.$on('videoPlayerHandler', value => {
|
|
|
console.log(value);
|
|
|
@@ -161,7 +170,7 @@
|
|
|
this.videoMessage = value.message;
|
|
|
});
|
|
|
this.conversationID=this.$route.params.conversationid;
|
|
|
- console.log(this.conversationID)
|
|
|
+ console.log('conversationID:',this.conversationID)
|
|
|
this.$TUIKit.setMessageRead({
|
|
|
conversationID:this.conversationID
|
|
|
})
|
|
|
@@ -313,76 +322,31 @@
|
|
|
appendMessage(e) {
|
|
|
this.inputText+=e.detail.message;
|
|
|
},
|
|
|
- startRecordManage(){
|
|
|
- // 加载声音录制管理器
|
|
|
- this.recorderManager = uni.getRecorderManager();
|
|
|
- console.log(this.recorderManager)
|
|
|
- this.recorderManager.onStop(res => {
|
|
|
- console.log(res)
|
|
|
- clearInterval(this.recordTimer);
|
|
|
- // 兼容 uniapp 打包app，duration 和 fileSize 需要用户自己补充
|
|
|
- // 文件大小 ＝ (音频码率) x 时间长度(单位:秒) / 8
|
|
|
- let msg = {
|
|
|
- duration: res.duration ? res.duration : this.recordTime * 1000,
|
|
|
- tempFilePath: res.tempFilePath,
|
|
|
- fileSize: res.fileSize ? res.fileSize : ((48 * this.recordTime) / 8) * 1024
|
|
|
- };
|
|
|
- uni.hideLoading();
|
|
|
- // 兼容 uniapp 语音消息没有duration
|
|
|
- if (this.canSend) {
|
|
|
- if (msg.duration < 1000) {
|
|
|
- uni.showToast({
|
|
|
- title: '录音时间太短',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- } else {
|
|
|
- // res.tempFilePath 存储录音文件的临时路径
|
|
|
- const message = uni.$TUIKit.createAudioMessage({
|
|
|
- to: String(this.userInfo.id),
|
|
|
- conversationType: this.conversation.type,
|
|
|
- payload: {
|
|
|
- file: msg
|
|
|
- }
|
|
|
- });
|
|
|
- this.$sendTIMMessage(message);
|
|
|
+ handleLongPress(e) {
|
|
|
+ this.recorder.start().then(()=>{
|
|
|
+ this.startPoint=e.touches[0];
|
|
|
+ this.voiceText='正在录音,上划可取消';
|
|
|
+ this.isRecording=true;
|
|
|
+ this.recordTime=0;
|
|
|
+ this.recordTimer = setInterval(() => {
|
|
|
+ this.recordTime++;
|
|
|
+ if(this.recorTime>=this.recordTimeTotal){
|
|
|
+ this.recorder.stop();
|
|
|
+ clearInterval(this.recordTimer);
|
|
|
+ this.recordTimer=null;
|
|
|
}
|
|
|
- }
|
|
|
- this.startPoint=0;
|
|
|
- this.isRecording=false;
|
|
|
- this.canSend=true;
|
|
|
- this.voiceText='按住说话，松手发送';
|
|
|
- });
|
|
|
- this.recorderManager.onError(err=>{
|
|
|
- console.log(err)
|
|
|
+ }, 1000);
|
|
|
+ }).catch(err=>{
|
|
|
+ console.log(err);
|
|
|
})
|
|
|
+
|
|
|
},
|
|
|
- handleLongPress(e) {
|
|
|
- uni.vibrateShort();
|
|
|
- this.recorderManager.start({
|
|
|
- duration: 60000,
|
|
|
- // 录音的时长，单位 ms，最大值 600000（10 分钟）
|
|
|
- sampleRate: 44100,
|
|
|
- // 采样率
|
|
|
- numberOfChannels: 1,
|
|
|
- // 录音通道数
|
|
|
- encodeBitRate: 192000,
|
|
|
- // 编码码率
|
|
|
- format: 'aac' // 音频格式，选择此格式创建的音频消息，可以在即时通信 IM 全平台（Android、iOS、微信小程序和Web）互通
|
|
|
- });
|
|
|
- this.startPoint=e.touches[0];
|
|
|
- this.voiceText='正在录音,上划可取消';
|
|
|
- this.isRecording=true;
|
|
|
- this.recordTime=0;
|
|
|
- this.recordTimer = setInterval(() => {
|
|
|
- this.recordTime++;
|
|
|
- if(this.recorTime>=this.recordTimeTotal){
|
|
|
- this.recorderManager.stop();
|
|
|
- clearInterval(this.recordTimer);
|
|
|
- this.recordTimer=null;
|
|
|
- }
|
|
|
- }, 1000);
|
|
|
+ handleTouchStart(e){
|
|
|
+ this.timeOutEvent = setTimeout(()=> {
|
|
|
+ this.handleLongPress(e);
|
|
|
+ }, 500);
|
|
|
+ return false;
|
|
|
},
|
|
|
-
|
|
|
// 录音时的手势上划移动距离对应文案变化
|
|
|
handleTouchMove(e) {
|
|
|
if (this.isRecording) {
|
|
|
@@ -402,8 +366,8 @@
|
|
|
handleTouchEnd() {
|
|
|
this.isRecording=false;
|
|
|
this.voiceText='按住说话，松手发送';
|
|
|
- uni.hideLoading();
|
|
|
- this.recorderManager.stop();
|
|
|
+ let voiceFile=this.recorder.getPCMBlob();
|
|
|
+ console.log(voiceFile)
|
|
|
},
|
|
|
sendTextMessage() {
|
|
|
const to = String(this.userInfo.id);
|
|
|
@@ -434,7 +398,7 @@
|
|
|
if (!this.isCompleted) {
|
|
|
this.$TUIKit
|
|
|
.getMessageList({
|
|
|
- conversationID: conversation.conversationID,
|
|
|
+ conversationID: this.conversationID,
|
|
|
nextReqMessageID: this.nextReqMessageID,
|
|
|
count: 15
|
|
|
})
|
dwh