语音训练代码调整
This commit is contained in:
joylink_cuiweidong
parent
5678d8dfad
commit
330416f0e0
@ -2,30 +2,34 @@
|
||||
<div>
|
||||
<el-card style="width: 80%;margin: 30px auto;">
|
||||
<div slot="header" style="text-align: center;display: flex;align-items: center;justify-content: space-between;">
|
||||
<span class="userBubble">
|
||||
<el-button class="chat-box-footer-create chat-box-footer-send" :class="{'active': recordSending}" size="mini" type="primary" @click="startRecording()">
|
||||
<el-progress id="record_progress_bar" type="circle" :show-text="false" :percentage="100/60*seconds" :width="40" :stroke-width="2" status="success" />
|
||||
<i v-if="recordSending" class="el-icon-close close_icon" @click.stop="cancleRecording()" />
|
||||
<span class="iconfont icon-yuyin"></span>
|
||||
</el-button>
|
||||
<span class="userBubble">
|
||||
<el-button class="chat-box-footer-create chat-box-footer-send" :class="{'active': recordSending}" size="mini" type="primary" @click="startRecording()">
|
||||
<el-progress id="record_progress_bar" type="circle" :show-text="false" :percentage="100/60*seconds" :width="40" :stroke-width="2" status="success" />
|
||||
<i v-if="recordSending" class="el-icon-close close_icon" @click.stop="cancleRecording()" />
|
||||
<span class="iconfont icon-yuyin"></span>
|
||||
</el-button>
|
||||
</span>
|
||||
<span style="font-size: 20px;color: #000;">语音识别训练</span>
|
||||
<el-button style="float: right; padding: 3px 0" type="text" @click="messageList=[]">清空</el-button>
|
||||
</div>
|
||||
<div>
|
||||
<div v-for="(chatContent,index) in messageList" :key="index" class="chatContentInClass">
|
||||
<div class="userHeader" style="display:flex;justify-content:flex-start;align-items:center;margin-bottom: 2px;padding: 7px 17px;">
|
||||
<div style="display: flex;flex-direction: column;">
|
||||
<audio :src="getUrl(chatContent)" controls="controls">
|
||||
Your browser does not support the audio tag.
|
||||
</audio>
|
||||
</div>
|
||||
<div style="flex: 1;padding: 7px; 17px">
|
||||
<div style="word-break: break-all"> {{chatContent.result||"无"}} </div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="userHeader" style="display:flex;justify-content:flex-start;align-items:center;margin-bottom: 2px;padding: 7px 17px;">
|
||||
<div style="display: flex;flex-direction: column;">
|
||||
<audio :src="getUrl(chatContent)" controls="controls">
|
||||
Your browser does not support the audio tag.
|
||||
</audio>
|
||||
</div>
|
||||
<div style="flex: 1;padding: 7px 17px">
|
||||
<div style="word-break: break-all"> {{ chatContent.result||"无" }} </div>
|
||||
</div>
|
||||
<div style="">
|
||||
<el-input type="textarea" style="width:300px;vertical-align:top;margin-right:100px;" placeholder="备注" />
|
||||
<el-button type="text" style="margin-right:10px;" @click="deleteRecord(index)">删除</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!messageList.length" style="text-align: center;padding: 17px;color: #a1a1a1;">暂无数据</div>
|
||||
<div v-if="!messageList.length" style="text-align: center;padding: 17px;color: #a1a1a1;">暂无数据</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
@ -46,10 +50,10 @@ export default {
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
getUrl(el) {
|
||||
return `https://oss.joylink.club/oss/joylink${el.filePath}`;
|
||||
},
|
||||
covertTime(time) {
|
||||
getUrl(el) {
|
||||
return `https://oss.joylink.club/oss/joylink${el.filePath}`;
|
||||
},
|
||||
covertTime(time) {
|
||||
const date = new Date(time);
|
||||
let hour = date.getHours();
|
||||
let minute = date.getMinutes();
|
||||
@ -66,60 +70,60 @@ export default {
|
||||
if (!this.recordSending && !this.recorders && !this.microphone) {
|
||||
const StereoAudioRecorder = RecordRTC.StereoAudioRecorder;
|
||||
navigator.getUserMedia({ audio: true }, function (stream) {
|
||||
that.microphone = stream;
|
||||
that.recorders = new RecordRTC(that.microphone, {
|
||||
type: 'audio',
|
||||
recorderType: StereoAudioRecorder,
|
||||
numberOfAudioChannels: 1,
|
||||
bitsPerSecond:256000,
|
||||
desiredSampRate: 16000
|
||||
});
|
||||
that.recorders.startRecording();
|
||||
that.recordSending = true;
|
||||
that.audioPlay = false;
|
||||
that.inter = setInterval(() => {
|
||||
if (that.seconds < 60) {
|
||||
that.seconds++;
|
||||
} else {
|
||||
clearInterval(that.inter);
|
||||
that.stopRecording();
|
||||
}
|
||||
}, 1000);
|
||||
}, function (error) {
|
||||
switch (error.code || error.name) {
|
||||
case 'PERMISSION_DENIED':
|
||||
case 'PermissionDeniedError':
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '用户拒绝提供信息',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
case 'NOT_SUPPORTED_ERROR':
|
||||
case 'NotSupportedError':
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '浏览器不支持硬件设备',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
case 'MANDATORY_UNSATISFIED_ERROR':
|
||||
case 'MandatoryUnsatisfiedError':
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '无法发现指定的硬件设备',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
default:
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '无法打开麦克风',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
that.microphone = stream;
|
||||
that.recorders = new RecordRTC(that.microphone, {
|
||||
type: 'audio',
|
||||
recorderType: StereoAudioRecorder,
|
||||
numberOfAudioChannels: 1,
|
||||
bitsPerSecond:256000,
|
||||
desiredSampRate: 16000
|
||||
});
|
||||
that.recorders.startRecording();
|
||||
that.recordSending = true;
|
||||
that.audioPlay = false;
|
||||
that.inter = setInterval(() => {
|
||||
if (that.seconds < 60) {
|
||||
that.seconds++;
|
||||
} else {
|
||||
clearInterval(that.inter);
|
||||
that.stopRecording();
|
||||
}
|
||||
}, 1000);
|
||||
}, function (error) {
|
||||
switch (error.code || error.name) {
|
||||
case 'PERMISSION_DENIED':
|
||||
case 'PermissionDeniedError':
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '用户拒绝提供信息',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
case 'NOT_SUPPORTED_ERROR':
|
||||
case 'NotSupportedError':
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '浏览器不支持硬件设备',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
case 'MANDATORY_UNSATISFIED_ERROR':
|
||||
case 'MandatoryUnsatisfiedError':
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '无法发现指定的硬件设备',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
default:
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '无法打开麦克风',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
} else {
|
||||
@ -149,7 +153,7 @@ export default {
|
||||
uploadAudioFiles(fd)
|
||||
.then((resp) => {
|
||||
that.audioPlay = false;
|
||||
that.messageList.push(resp.data);
|
||||
that.messageList.push(resp.data);
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
@ -163,6 +167,9 @@ export default {
|
||||
that.recorders = null;
|
||||
}
|
||||
});
|
||||
},
|
||||
deleteRecord(index) {
|
||||
this.messageList.splice(index, 1);
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -232,4 +239,5 @@ export default {
|
||||
padding: 3px;
|
||||
}
|
||||
}
|
||||
.deleteRecord{}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user