课堂观察

src/components/pages/classroomObservation/components/chatArea.vue

@@ -56,11 +56,7 @@
 				class="editorBar"
 				:showGetTextLoading="showGetTextLoading"
 				v-model="editorBarData.content"
-				v-if="
-					pageStatus == 2 &&
-					!showIndexPage &&
-					editorBarData.type == '0'
-				"
+				v-if="pageStatus == 2 && !showIndexPage && editorBarData.type == '0'"
 				v-loading="uploadFileLoading"
 			>
 				<el-button
@@ -72,7 +68,12 @@
 			</EditorBar>
 			<iframe
 				ref="viframe"
-				v-if="pageStatus == 2 && !showIndexPage && editorBarData.type == '1' && /\.(xlsx|doc|docx)$/i.test(editorBarData.url)"
+				v-if="
+					pageStatus == 2 &&
+					!showIndexPage &&
+					editorBarData.type == '1' &&
+					/\.(xlsx|doc|docx)$/i.test(editorBarData.url)
+				"
 				style="width: 100%; height: 100%; border: none"
 				v-loading="uploadFileLoading"
 				:src="
@@ -80,7 +81,16 @@
 					encodeURIComponent(editorBarData.url)
 				"
 			></iframe>
-			<vpdf style="width: 100%; height: 100%;border: none" :pdfUrl="editorBarData.url" v-if="pageStatus == 2 && !showIndexPage && editorBarData.type == '1' && /\.(pdf)$/i.test(editorBarData.url)" />
+			<vpdf
+				style="width: 100%; height: 100%; border: none"
+				:pdfUrl="editorBarData.url"
+				v-if="
+					pageStatus == 2 &&
+					!showIndexPage &&
+					editorBarData.type == '1' &&
+					/\.(pdf)$/i.test(editorBarData.url)
+				"
+			/>
 			<!-- </div> -->
 		</div>
 		<div class="ca-bottom">
@@ -92,7 +102,7 @@
 							<div class="ca-b-o-h-s-l-text">课堂观察</div>
 							<span class="ca-b-o-h-s-l-icon2 el-icon-caret-top"></span>
 						</div> -->
-<!-- 
+						<!-- 
 						<div class="ca-b-o-h-l-select" style="color: #3681fc">
 							<div
 								style="cursor: pointer"
@@ -365,7 +375,7 @@ import Recorder from "js-audio-recorder";
 import MarkdownIt from "markdown-it";
 import EditorBar from "./wangEnduit.vue";
 const lamejs = require("lamejs");
-import vpdf from './vpdf'
+import vpdf from "./vpdf";
 const recorder = new Recorder({
 	sampleBits: 16, // 采样位数，支持 8 或 16，默认是16
 	sampleRate: 48000, // 采样率，支持 11025、16000、22050、24000、44100、48000，根据浏览器默认值，我的chrome是48000
@@ -484,7 +494,7 @@ export default {
 			textareaValue: "",
 			textareaLoading: false,
 			showRoleList: false,
-			showGetTextLoading:false,
+			showGetTextLoading: false,
 			roleListIndex: 0,
 			recordedForm: {
 				time: "00:00:00", //时间
@@ -576,9 +586,11 @@ export default {
 			input.onchange = () => {
 				this.uploadFileLoading = true;
 				let file = input.files[0];
-				if(!/\.(wav|txt|pdf|xlsx|doc|docx)$/i.test(file.name)){
+				if (!/\.(wav|txt|pdf|xlsx|doc|docx)$/i.test(file.name)) {
 					this.uploadFileLoading = false;
-					return this.$message.info("请上传.wav,.txt,.pdf,.xlsx,.doc,.docx格式的文件")
+					return this.$message.info(
+						"请上传.wav,.txt,.pdf,.xlsx,.doc,.docx格式的文件"
+					);
 				}
 				this.uploadFile(file);
 				// this.uploadWavFileAndGetText(file);
@@ -591,10 +603,10 @@ export default {
 				this.controlsStatus = 3;
 			} else if (this.pageStatus == 1 || this.pageStatus == 2) {
 				// 原文速览&&转录文稿
-				
-				if([1,2].includes(this.recordedForm.status)){
+
+				if ([1, 2].includes(this.recordedForm.status)) {
 					this.controlsStatus = 1;
-				}else{
+				} else {
 					this.controlsStatus = 2;
 				}
 			}
@@ -602,10 +614,10 @@ export default {
 		},
 		cutTape(val) {
 			if (val == 0) {
-				if([1,2].includes(this.recordedForm.status)){
+				if ([1, 2].includes(this.recordedForm.status)) {
 					this.controlsStatus = 1;
 					this.showIndexPage = true;
-				}else if (this.audioUrl) {
+				} else if (this.audioUrl) {
 					this.controlsStatus = 2;
 					this.pageStatus = 1;
 				} else {
@@ -709,7 +721,7 @@ export default {
 			this.showIndexPage = false;
 			this.pageStatus = 1;
 			this.controlsStatus = 2;
-			this.recordedForm.status = 3
+			this.recordedForm.status = 3;
 			// let file = this.convertToMp3(recorder.getWAV());
 			const mp3Blob = recorder.getWAVBlob();
 			let audioFile = this.dataURLtoAudio(mp3Blob, "wav");
@@ -730,7 +742,7 @@ export default {
 		changeAudioUrl(newValue) {
 			if (!newValue) return;
 			this.audioUrl = newValue;
-			if(![1,2].includes(this.pageStatus))this.pageStatus = 1;
+			if (![1, 2].includes(this.pageStatus)) this.pageStatus = 1;
 			this.controlsStatus = 2;
 			this.showIndexPage = false;
 		},
@@ -774,7 +786,7 @@ export default {
 							index: this.chatList.length,
 							is_mind_map: false,
 							fileid: _item.assistantName,
-							createtime:new Date().toLocaleString().replaceAll("/",'-')
+							createtime: new Date().toLocaleString().replaceAll("/", "-"),
 						});
 					} else {
 						this.chatList.push({
@@ -790,7 +802,7 @@ export default {
 							index: this.chatList.length,
 							is_mind_map: false,
 							fileid: _item.assistantName,
-							createtime:new Date().toLocaleString().replaceAll("/",'-')
+							createtime: new Date().toLocaleString().replaceAll("/", "-"),
 						});
 					}
 					this.scrollBottom();
@@ -835,7 +847,7 @@ export default {
 					filename: "",
 					index: this.chatList.length,
 					is_mind_map: false,
-					createtime:new Date().toLocaleString().replaceAll("/",'-'),
+					createtime: new Date().toLocaleString().replaceAll("/", "-"),
 					loading: true,
 				});
 				this.scrollBottom();
@@ -1021,6 +1033,7 @@ export default {
 		},
 		wavFileGetText(audioFile) {
 			let flag = true;
+			let textList = [];
 			// if (flag) {
 			// 	// 这里上传文件
 			// 	// _this.uploadWavFile(audioFile);
@@ -1031,16 +1044,60 @@ export default {
 			// 	flag = false;
 			// 	this.uploadFileLoading = false;
 			// }
+			// let num = 0;
+			// let timer = null;
 			// this.showGetTextLoading = true;
-			// this.transcriptionData.content += "这是测试";
-			// this.editorBarData.content += "这是测试";
+			// timer = setInterval(()=>{
+			// 	console.log(`这是第：${num}个`)
+			// 	let privText = `这是第- ${num} -个`
+			// 	textList.push({
+			// 		value:privText,
+			// 		startTime:"",
+			// 		endTime:"",
+			// 		time:"",
+			// 	})
+			// 	this.transcriptionData.content += privText;
+			// 	num++;
+			// 	let _result =`
+			// 		<table
+			// 			border="0"
+			// 			width="100%"
+			// 			cellpadding="0"
+			// 			cellspacing="0"
+			// 			style="text-align: center"
+			// 		>
+			// 			<tbody>
+			// 				<tr>
+			// 					<th>序号</th>
+			// 					<th>发言内容</th>
+			// 			</tr>
+			// 	`
+			// 	textList.forEach((item,index)=>{
+			// 		_result += `<tr>
+			// 			<td>${index+1}</td>
+			// 				<td>${item.value}</td>
+			// 			</tr>`
+			// 	})
+
+			// 	_result+=`
+			// 	<tr>
+			// 				<td></td>
+			// 				<td></td>
+			// 			</tr>
+			// 		</tbody>
+			// 	</table>`
+			// 	this.editorBarData.content = _result;
+			// 	if(num>=30)return clearInterval(timer);
+			// },2000)
 
 			// setTimeout(()=>{
 			// 	this.showGetTextLoading = false;
-			// },4000)
+
+			// },66000)
 			// return;
 			let iiframe = this.$refs["iiframe"];
 			let _this = this;
+
 			iiframe.contentWindow.window.document.getElementById(
 				"languageOptions"
 			).selectedIndex = 2;
@@ -1055,24 +1112,62 @@ export default {
 					_this.editorBarData.type = "0";
 					flag = false;
 					_this.uploadFileLoading = false;
-					_this.transcriptionData.content = ""
-					_this.editorBarData.content = ""
+					_this.transcriptionData.content = "";
+					_this.editorBarData.content = "";
+					textList = [];
 				}
 				_this.showGetTextLoading = true;
 				let privText = e.privText;
-				console.log(privText)
+				console.log("👇转译对象👇");
+				console.log(e);
+				console.log("👇转译结果👇");
+				console.log(privText);
+				textList.push({
+					value: privText,
+					startTime: "",
+					endTime: "",
+					time: "",
+				});
 				_this.transcriptionData.content += privText;
-				_this.editorBarData.content += privText;
+
+				let _result = `
+					<table
+						border="0"
+						width="100%"
+						cellpadding="0"
+						cellspacing="0"
+						style="text-align: center"
+					>
+						<tbody>
+							<tr>
+								<th>序号</th>
+								<th>发言内容</th>
+						</tr>
+				`;
+				textList.forEach((item, index) => {
+					_result += `<tr>
+						<td>${index + 1}</td>
+							<td>${item.value}</td>
+						</tr>`;
+				});
+				_result += `
+				<tr>
+							<td></td>
+							<td></td>
+						</tr>
+					</tbody>
+				</table>`;
+				_this.editorBarData.content = _result;
+				// _this.editorBarData.content += privText;
 			};
 
-			
-			iiframe.contentWindow.onSessionStopped = function(e){
-				console.log('转译完成')
-				console.log(e)
-				_this.$message.success("转译完成")
+			iiframe.contentWindow.onSessionStopped = function (e) {
+				console.log("转译完成");
+				console.log(e);
+				_this.$message.success("转译完成");
 				_this.showGetTextLoading = false;
 				_this.saveEditorBar();
-			}
+			};
 
 			iiframe.contentWindow.doContinuousPronunciationAssessment("", {
 				files: [audioFile],
@@ -1299,12 +1394,16 @@ export default {
 			this.getPublicRoleList();
 			this.getChatList().then((_) => {
 				this.loading = false;
-				this.scrollBottom()
+				this.scrollBottom();
 			});
 		},
 		// 保存转录文稿和原文速览
 		saveEditorBar(flag = false) {
-			if (this.editorBarData.type == "0" && flag && this.editorBarData.content) {
+			if (
+				this.editorBarData.type == "0" &&
+				flag &&
+				this.editorBarData.content
+			) {
 				// 如果是文本则转成txt并保存
 				var text = this.editorBarData.content;
 
@@ -1315,12 +1414,16 @@ export default {
 				this.uploadFile(blob);
 			} else {
 				this.loading = true;
-				this.$emit("updateTranscription", {
-					transcriptionData: this.transcriptionData.content,
-					editorBarData: this.editorBarData,
-				},()=>{
-					this.loading = false;
-				});
+				this.$emit(
+					"updateTranscription",
+					{
+						transcriptionData: this.transcriptionData.content,
+						editorBarData: this.editorBarData,
+					},
+					() => {
+						this.loading = false;
+					}
+				);
 			}
 		},
 		changeEditorBar({ transcriptionData, editorBarData }) {
@@ -1332,7 +1435,7 @@ export default {
 			return new Promise((resolve, reject) => {
 				if (this.chatLoading) return this.$message.info("请稍等...");
 				this.chatList = [];
-				if(!this.tid)return setTimeout(()=>this.getChatList(),100)
+				if (!this.tid) return setTimeout(() => this.getChatList(), 100);
 				this.chatLoading = true;
 				let params = {
 					userid: "602def61-005d-11ee-91d8-005056b86db5",
@@ -1360,7 +1463,7 @@ export default {
 									index: i,
 									is_mind_map: false,
 									fileid: _data[i].fileid,
-									createtime:_data[i].createtime
+									createtime: _data[i].createtime,
 								});
 							}
 							this.chatList = _chatList;
@@ -1402,9 +1505,7 @@ export default {
 				.then((res) => {});
 		},
 	},
-	mounted() {
-
-	},
+	mounted() {},
 };
 </script>