修改切换句子bug及录音数据保存

src/components/Adult/preview/Voicefullscreen.vue

@@ -1101,7 +1101,7 @@ export default {
       this.pCanvas = document.getElementById("playChart");
       this.pCtx = this.pCanvas.getContext("2d");
     },
-    initaudioImage() {
+    initaudioImage(src) {
       this.loading = true;
       this.wavesurfer = WaveSurfer.create({
         container: this.$refs.waveform,
@@ -1166,6 +1166,7 @@ export default {
           that.wavesurfer_big.setMute(true);
         });
       });
+
       that.wavesurfer.on("play", function (e) {
         that.isPlaying = true;
       });
@@ -1466,6 +1467,15 @@ export default {
           wavesurfer_ly.on("pause", function (e) {
             _this.isPlaying = false;
           });
+          if (_this.curQue.Bookanswer.practiceModel[_this.curSentIndex]) {
+            _this.curQue.Bookanswer.practiceModel[_this.curSentIndex] = {
+              recordSrc: objectUrl,
+            };
+          } else {
+            _this.curQue.Bookanswer.practiceModel[_this.curSentIndex] = {
+              recordSrc: objectUrl,
+            };
+          }
           // _this.wavesurfer.load(objectUrl);
           // _this.wavesurfer_big.load(objectUrl);
           // let start = _this.bg / 1000;
@@ -1628,17 +1638,72 @@ export default {
     showPrevNext(bool, key) {
       this[key] = bool;
     },
-    prevSentence() {
+    curjuzi(src) {
       let _this = this;
-      if (_this.curSentIndex == 0) {
-        _this.$message.warning("已经是第一个句子了");
+      let start = this.bg / 1000;
+      let end = this.ed / 1000;
+      _this.wavesurfer.play(start, end);
+      _this.wavesurfer_big.play(start, end);
+      if (src) {
+        let node = document.getElementById("waveform_big");
+        node.children[0].style.height = "130px";
+        let lynode = document.getElementById("ly_big");
+        lynode.style.display = "flex";
+        // wavesurfer_ly = WaveSurfer.create({
+        //   container: _this.$refs.waveform_ly,
+        //   barWidth: 1,
+        //   progressColor: "#FF5C5C",
+        //   backend: "MediaElement",
+        //   waveColor: "#FF5C5C",
+        //   cursorColor: "#1370F6",
+        //   cursorWidth: 3,
+        //   barHeight: 0.8,
+        //   barGap: 6,
+        //   height: 130,
+        //   width: 400,
+        //   interact: false,
+        //   plugins: [
+        //     Timeline.create({
+        //       container: "#timeline_ly",
+        //       primaryColor: "#c0c0c0",
+        //       secondaryColor: "#c0c0c0",
+        //       primaryFontColor: "#c0c0c0",
+        //       secondaryFontColor: "#c0c0c0",
+        //       formatTimeCallback: _this.formatTimeCallback,
+        //       timeInterval: 0.025,
+        //       primaryLabelInterval: 4,
+        //       secondaryLabelInterval: 400,
+        //       notchPercentHeight: 40,
+        //     }),
+        //   ],
+        // });
+        wavesurfer_ly.load(src);
+        // wavesurfer_ly.on("ready", function (e) {
+        //   wavesurfer_ly.zoom(Number(600));
+        // });
+        wavesurfer_ly.on("play", function (e) {
+          _this.isPlaying = true;
+        });
+        wavesurfer_ly.on("pause", function (e) {
+          _this.isPlaying = false;
+        });
+      } else {
+        let node = document.getElementById("waveform_big");
+        node.children[0].style.height = "308px";
+        let lynode = document.getElementById("ly_big");
+        lynode.style.display = "none";
+      }
+    },
+    prevSentence() {
+      if (this.curSentIndex == 0) {
+        this.$message.warning("已经是第一个句子了");
         return;
       }
-      _this.curSentIndex = _this.curSentIndex - 1;
-      _this.getSentence();
-      if (_this.isAuto) {
-        _this.curTime = _this.bg;
-        _this.$refs.audioLineSent.onTimeupdateTime(_this.bg / 1000);
+      this.curSentIndex = this.curSentIndex - 1;
+      this.getSentence();
+      if (this.isAuto) {
+        this.curTime = this.bg;
+        this.$refs.audioLineSent.onTimeupdateTime(this.bg / 1000);
       }
     },
     nextSentence() {
@@ -1765,6 +1830,13 @@ export default {
       } else {
         _this.maxTime = maxTime;
       }
+      if (this.curQue.Bookanswer.practiceModel[this.curSentIndex]) {
+        this.curjuzi(
+          this.curQue.Bookanswer.practiceModel[this.curSentIndex].recordSrc
+        );
+      } else {
+        this.curjuzi();
+      }
       _this.checkCollStatus();
     },
     pauseAudio() {
@@ -1923,7 +1995,7 @@ export default {
           let end = this.ed / 1000;
           if (time * 1000 == this.ed || time * 1000 == 0) {
             this.wavesurfer.play(start, end);
-            this.wavesurfer_big.play(start, end); 
+            this.wavesurfer_big.play(start, end);
           } else {
             this.wavesurfer.play(null, end);
             this.wavesurfer_big.play(null, end);
@@ -1969,9 +2041,9 @@ export default {
         } else if (e.keyCode == 40) {
           _this.nextSentence();
         } else if (e.keyCode == 13) {
-          _this.$nextTick(() => {
-            _this.$refs.Soundrecorddiff.microphone();
-          });
+          // _this.$nextTick(() => {
+          //   _this.$refs.Soundrecorddiff.microphone();
+          // });
         }
       }
     });