语音对比

src/components/common/AudioLine.vue

@@ -360,7 +360,7 @@ export default {
     },
     changeRepeat() {
       let _this = this;
-      _this.isRepeat = !_this.isRepeat;
+    //   _this.isRepeat = !_this.isRepeat;
     },
   },
   // 生命周期-创建之前

src/views/bookShelf/components/HistoryRecordList.vue

@@ -302,7 +302,6 @@ export default {
             _this.$emit("handleChangeTime",_this.timeData.s,_this.timeData.e)
             _this.timeC = setInterval(() => {
                 if(_this.curTime>=_this.timeData.e){
-                    console.log(_this.curTime)
                     clearInterval(_this.timeC)
                     _this.playWavdata()
                 }

src/views/bookShelf/components/PracticeModel.vue

@@ -161,7 +161,7 @@
                         <svg-icon icon-class="Go-start" :style="{color:colorObj.type==='white'||colorObj.type==='darkGreen'?'#000':'#fff'}"></svg-icon>
                         <span :style="{color:colorObj.type==='armyGreen'?'#7C8983':''}">上一句</span>
                     </div>
-                    <div class="operate-item">
+                    <div class="operate-item" @click="compare">
                         <svg-icon icon-class="Type-drive" :style="{color:colorObj.type==='white'||colorObj.type==='darkGreen'?'#000':'#fff'}"></svg-icon>
                         <span :style="{color:colorObj.type==='armyGreen'?'#7C8983':''}">听对比</span>
                     </div>
@@ -304,6 +304,7 @@ export default {
       hasMicro: "", // 录音后的样式class
       wavblob: null,
       audio: new window.Audio(),
+      audioc: new window.Audio(), // 对比
       recordList: [], // 录音文件数组
       recordtime: 0, // 录音时长
       timer: null, // 计时器
@@ -317,7 +318,8 @@ export default {
       historySentRecordList: [], // 单句历史录音list
       ed: undefined,
       showEd: false, //是否看ed的值
-      historyLoading: false
+      historyLoading: false,
+      timeC: null
     };
   },
   computed: {
@@ -340,6 +342,8 @@ export default {
   //方法集合
   methods: {
     changePlaySent(type){
+        this.audio.pause();
+        this.audioc.pause();
         for(let i=0; i<this.resArr.timeList.length;i++){
             if(this.curTime>=this.resArr.timeList[i].s&&this.curTime<this.resArr.timeList[i].e){
                 this.playSentIndex = i
@@ -395,6 +399,8 @@ export default {
       console.log(this.resArr)
     },
     handleChangeTime(time,ed,flag) {
+      this.audio.pause();
+      this.audioc.pause();
       if(flag){
         this.$refs.audioLine.PlayAudio()
       }else{
@@ -428,6 +434,8 @@ export default {
     // 开始录音
     microphone() {
       let _this = this;
+      this.audio.pause();
+      this.audioc.pause();
       if(_this.$refs.audioLine.audio.playing){
             _this.$refs.audioLine.PlayAudio()
             _this.showEd = false
@@ -502,6 +510,7 @@ export default {
       _this.$emit("getMicrophoneStatus", _this.microphoneStatus);
     },
     playmicrophone(totalTimes) {
+      this.audioc.pause();
       if (this.hasMicro) {
         this.isPlayings = true;
         if (this.selectIndex || this.selectIndex == 0) {
@@ -566,6 +575,8 @@ export default {
     lookHistory(index){
         this.historyFlag = true
         this.historyLoading = true
+        this.audio.pause();
+        this.audioc.pause();
         if(this.$refs.audioLine.audio.playing){
             this.$refs.audioLine.PlayAudio()
         }
@@ -602,7 +613,48 @@ export default {
         .then((res) => {
             
         })
-    }
+    },
+    // 对比
+    compare(){
+        let _this = this;
+        let curTime = _this.resArr.timeList[_this.playSentIndex].s
+        for(let i=0; i<this.resArr.timeList.length;i++){
+            if(curTime>=this.resArr.timeList[i].s&&curTime<this.resArr.timeList[i].e){
+                this.playSentIndex = i
+                break
+            }
+        }
+        let playSentIndex = _this.playSentIndex
+        if(this.playSentIndex===-1){
+            this.$message.warning('请先选择要对比的句子')
+            return
+        }
+        if(!this.wavblob){
+            this.$message.warning('请先录音')
+            return
+        }
+        this.audio.pause()
+        if (!this.audioc.paused) {
+            this.audioc.pause();
+        } else {
+            _this.audioc.pause();
+            _this.audioc.load();
+            _this.curTime = _this.resArr.timeList[playSentIndex].s
+            _this.handleChangeTime(_this.resArr.timeList[playSentIndex].s,_this.resArr.timeList[playSentIndex].e)
+            console.log(playSentIndex)
+            _this.timeC = setInterval(() => {
+                if(_this.curTime>=_this.resArr.timeList[playSentIndex].e){
+                    clearInterval(_this.timeC)
+                    _this.playWavdata()
+                }
+            }, 500);
+        }
+    },
+    playWavdata(){
+        let _this = this;
+        _this.audioc.src = _this.wavblob;
+        _this.audioc.play();
+    },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {},
@@ -616,7 +668,9 @@ export default {
   beforeMount() {}, //生命周期 - 挂载之前
   beforeUpdate() {}, //生命周期 - 更新之前
   updated() {}, //生命周期 - 更新之后
-  beforeDestroy() {}, //生命周期 - 销毁之前
+  beforeDestroy() {
+    clearInterval(this.timeC)
+  }, //生命周期 - 销毁之前
   destroyed() {}, //生命周期 - 销毁完成
   activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
 };

src/views/reporter/index.vue

@@ -28,6 +28,7 @@
 //例如：import 《组件名称》from ‘《组件路径》';
 import Header from "../../components/Header.vue";
 import vueWaterfallEasy from "vue-waterfall-easy";
+import { getLogin } from "@/api/ajax";
 export default {
   //import引入的组件需要注入到对象中才能使用
   components: { Header, vueWaterfallEasy },
@@ -62,6 +63,8 @@ export default {
       loading: false,
       imgsArr: [],
       page: 0,
+      pageSize: 50,
+      pageNumber: 1
     }
   },
   //计算属性 类似于data概念
@@ -77,86 +80,101 @@ export default {
         
     },
     getData() {
-      var list = [
-        {
-          src:
-            "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-C0IWU6OZL84WHX1KRY.jpg",
-        },
-        {
-          src:
-            "http://cdn-chenxi.auoktalk.com/invite-share/749dcf7ae3a948ad9b99695800d2493f.jpg",
-        },
-        {
-          src:
-            "http://cdn-chenxi.auoktalk.com/invite-share/7e8f79358274441a85ac397fbd8a2253.jpg",
-        },
-        {
-          src:
-            "http://cdn-chenxi.auoktalk.com/invite-share/a39bca7b3e2446de9607547e7473d0d2.jpg",
-        },
-        {
-          src:
-            "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-GEW2JO59G9Q2X1YHMF.png",
-        },
-        {
-          src:
-            "https://file-kf.helxsoft.cn/CSFileStore/001/00102/D-U2XDHVDGILVMLTPZI3/F-WEOZPDNMXU8L4YV7RG.png",
-        },
-        {
-          src:
-            "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-C0IWU6OZL84WHX1KRY.jpg",
-        },
-        {
-          src:
-            "http://cdn-chenxi.auoktalk.com/invite-share/749dcf7ae3a948ad9b99695800d2493f.jpg",
-        },
-        {
-          src:
-            "http://cdn-chenxi.auoktalk.com/invite-share/7e8f79358274441a85ac397fbd8a2253.jpg",
-        },
-        {
-          src:
-            "http://cdn-chenxi.auoktalk.com/invite-share/a39bca7b3e2446de9607547e7473d0d2.jpg",
-        },
-        {
-          src:
-            "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-GEW2JO59G9Q2X1YHMF.png",
-        },
-        {
-          src:
-            "https://file-kf.helxsoft.cn/CSFileStore/001/00102/D-U2XDHVDGILVMLTPZI3/F-WEOZPDNMXU8L4YV7RG.png",
-        },
-        {
-          src:
-            "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-C0IWU6OZL84WHX1KRY.jpg",
-        },
-        {
-          src:
-            "http://cdn-chenxi.auoktalk.com/invite-share/749dcf7ae3a948ad9b99695800d2493f.jpg",
-        },
-        {
-          src:
-            "http://cdn-chenxi.auoktalk.com/invite-share/7e8f79358274441a85ac397fbd8a2253.jpg",
-        },
-        {
-          src:
-            "http://cdn-chenxi.auoktalk.com/invite-share/a39bca7b3e2446de9607547e7473d0d2.jpg",
-        },
-        {
-          src:
-            "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-GEW2JO59G9Q2X1YHMF.png",
-        },
-        {
-          src:
-            "https://file-kf.helxsoft.cn/CSFileStore/001/00102/D-U2XDHVDGILVMLTPZI3/F-WEOZPDNMXU8L4YV7RG.png",
+    //   var list = [
+    //     {
+    //       src:
+    //         "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-C0IWU6OZL84WHX1KRY.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "http://cdn-chenxi.auoktalk.com/invite-share/749dcf7ae3a948ad9b99695800d2493f.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "http://cdn-chenxi.auoktalk.com/invite-share/7e8f79358274441a85ac397fbd8a2253.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "http://cdn-chenxi.auoktalk.com/invite-share/a39bca7b3e2446de9607547e7473d0d2.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-GEW2JO59G9Q2X1YHMF.png",
+    //     },
+    //     {
+    //       src:
+    //         "https://file-kf.helxsoft.cn/CSFileStore/001/00102/D-U2XDHVDGILVMLTPZI3/F-WEOZPDNMXU8L4YV7RG.png",
+    //     },
+    //     {
+    //       src:
+    //         "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-C0IWU6OZL84WHX1KRY.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "http://cdn-chenxi.auoktalk.com/invite-share/749dcf7ae3a948ad9b99695800d2493f.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "http://cdn-chenxi.auoktalk.com/invite-share/7e8f79358274441a85ac397fbd8a2253.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "http://cdn-chenxi.auoktalk.com/invite-share/a39bca7b3e2446de9607547e7473d0d2.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-GEW2JO59G9Q2X1YHMF.png",
+    //     },
+    //     {
+    //       src:
+    //         "https://file-kf.helxsoft.cn/CSFileStore/001/00102/D-U2XDHVDGILVMLTPZI3/F-WEOZPDNMXU8L4YV7RG.png",
+    //     },
+    //     {
+    //       src:
+    //         "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-C0IWU6OZL84WHX1KRY.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "http://cdn-chenxi.auoktalk.com/invite-share/749dcf7ae3a948ad9b99695800d2493f.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "http://cdn-chenxi.auoktalk.com/invite-share/7e8f79358274441a85ac397fbd8a2253.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "http://cdn-chenxi.auoktalk.com/invite-share/a39bca7b3e2446de9607547e7473d0d2.jpg",
+    //     },
+    //     {
+    //       src:
+    //         "https://file-kf.helxsoft.cn/CSFileStore/002/00201/D-SZE3JLEDEHCOEYLDKS/F-GEW2JO59G9Q2X1YHMF.png",
+    //     },
+    //     {
+    //       src:
+    //         "https://file-kf.helxsoft.cn/CSFileStore/001/00102/D-U2XDHVDGILVMLTPZI3/F-WEOZPDNMXU8L4YV7RG.png",
+    //     }
+    //   ];
+    //   this.page += 1;
+    //   if (this.page == 6) {
+    //     this.$refs.waterfall.waterfallOver();
+    //   } else {
+    //     this.imgsArr = this.imgsArr.concat(list);
+    //   }
+        let MethodName = "/PaperServer/Client/Xjz/XjzArticleList";
+        let data = {
+            page_capacity:this.pageSize,
+            cur_page:this.pageNumber
         }
-      ];
-      this.page += 1;
-      if (this.page == 6) {
-        this.$refs.waterfall.waterfallOver();
-      } else {
-        this.imgsArr = this.imgsArr.concat(list);
-      }
+        getLogin(MethodName, data)
+        .then((res) => {
+            if(res.status===1){
+                if (this.pageNumber === res.data.total_page ) {
+                    this.$refs.waterfall.waterfallOver();
+                } else {
+                    this.imgsArr = this.imgsArr.concat(res.data.list);
+                }
+            }
+        })
     },
   },
   //生命周期 - 创建完成（可以访问当前this实例）