update

src/components/pptEasyClass/index.vue

@@ -51,7 +51,9 @@
         </div>
         <div class="pec_h_right">
           <div class="pec_h_r_btnArea">
-            <div class="pec_h_r_btn_refresh" :class="{ 'recording': recordedForm.status == 1 }" @click="toggleRecording" v-show="(jArray.includes(oid) || jArray.includes(org)) && courseDetail.userid == userid">
+            <!-- openObserveDialog -->
+            <!-- toggleRecording -->
+            <div class="pec_h_r_btn_refresh" :class="{ 'recording': recordedForm.status == 1 }" @click="toggleRecording" v-show="(jArray.includes(oid) || jArray.includes(org)) && courseDetail.userid == userid && classId">
               <span>{{ recordedForm.status == 1 ? '结束录音' : '开始录音' }}</span>
             </div>
             <div class="pec_h_r_btn_afterClass" @click="afterClass" v-if="courseDetail.userid == userid">
@@ -71,6 +73,24 @@
           v-if="showIframe" style="width: 100%; height: 100%; border: none" ref="ppt"></iframe>
       </div>
     </div>
+
+    <!-- 课堂观察弹窗 -->
+    <el-dialog
+      :visible.sync="showObserveDialog"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :show-close="true"
+      width="90%"
+      top="5vh"
+      class="observe-dialog"
+    >
+      <iframe
+        v-if="showObserveDialog"
+        :src="observeDialogUrl"
+        frameborder="0"
+        style="width: 100%; height: 85vh; border: none;"
+      ></iframe>
+    </el-dialog>
   </div>
 </template>
 
@@ -124,6 +144,12 @@ export default {
         content: ""
       },
       showGetTextLoading: false, // 显示获取文本加载状态
+      // 弹窗相关
+      showObserveDialog: false, // 显示课堂观察弹窗
+      observeDialogUrl: "", // 课堂观察链接
+      // 录音时间记录
+      recordingStartTime: "", // 开始录音时间
+      recordingEndTime: "", // 结束录音时间
     };
   },
   methods: {
@@ -154,6 +180,11 @@ export default {
       let flag = true;
       console.log("开始录音", iiframe);
       this.recordedForm.status = 1;
+      // 记录开始录音时间
+      this.recordingStartTime = new Date().toLocaleString("zh-CN", {
+        hour12: false,
+        timeZone: "Asia/Shanghai"
+      }).replace(/\//g, "-");
       iiframe.contentWindow.window.onRecognizedResult = e => {
         console.log("onRecognizedResult", e);
         this.recordedForm.endTime = this.recordedForm.timeDuration;
@@ -226,6 +257,13 @@ export default {
           });
           // 存储文件和文本到全局对象
           this.storeRecordingData(file);
+          // 记录结束录音时间
+          this.recordingEndTime = new Date().toLocaleString("zh-CN", {
+            hour12: false,
+            timeZone: "Asia/Shanghai"
+          }).replace(/\//g, "-");
+          // 调用 addPPTClass 接口
+          this.addPPTClass();
           iiframe.contentWindow.onSessionStopped = null;
           iiframe.contentWindow.window.onRecognizedResult = null;
         };
@@ -240,6 +278,13 @@ export default {
         let file = new File([blob], "recordedFile.wav", { type: "audio/wav" });
         // 存储文件和文本到全局对象
         this.storeRecordingData(file);
+        // 记录结束录音时间
+        this.recordingEndTime = new Date().toLocaleString("zh-CN", {
+          hour12: false,
+          timeZone: "Asia/Shanghai"
+        }).replace(/\//g, "-");
+        // 调用 addPPTClass 接口
+        this.addPPTClass();
       }
     },
     storeRecordingData(file) {
@@ -252,6 +297,29 @@ export default {
       window.recordingData.textList = this.recordedForm.textList;
       console.log("录音数据已存储到全局对象:", window.recordingData);
     },
+    openObserveDialog(pptid) {
+      this.observeDialogUrl = `https://observe.cocorobo.cn/#/newClassroom?userid=${this.userid}&oid=${this.oid}&org=${this.org}&pptid=${pptid}`;
+      this.showObserveDialog = true;
+    },
+    addPPTClass() {
+      let params = {
+        pptid: this.id,
+        cid: this.classId,
+        st: this.recordingStartTime,
+        et: this.recordingEndTime
+      };
+      this.ajax
+        .post(this.$store.state.api + "addPPTClass", params)
+        .then(res => {
+          console.log("addPPTClass", res);
+          let id = res.data[0][0].id;
+          this.openObserveDialog(id);
+        })
+        .catch(err => {
+          console.error(err);
+          this.$message.error("保存录音信息失败");
+        });
+    },
     updateRecordedTime({ duration }) {
       // 格式化录音时间
       const minutes = Math.floor(duration / 60);
@@ -694,4 +762,18 @@ export default {
   border: none !important;
   cursor: unset !important;
 }
+
+.observe-dialog >>> .el-dialog__header {
+  padding: 0;
+}
+
+.observe-dialog >>> .el-dialog__body {
+  padding: 0;
+}
+
+.observe-dialog >>> .el-dialog__headerbtn {
+  top: 22px;
+  right: 20px;
+  z-index: 100;
+}
 </style>