文章录音

src/components/Adult/preview/ArticleViewChs/PhraseModelChs.vue

@@ -175,6 +175,9 @@
           :changeWordCard="changeWordCard"
           :themeColor="themeColor"
           :currentTreeID="currentTreeID"
+          :TaskModel="TaskModel"
+          :writeList="curQue.Bookanswer.writeModel"
+          @changeCurQue="changeCurQue"
         />
       </div>
     </template>
@@ -195,6 +198,7 @@ export default {
     "noFont",
     "currentTreeID",
     "config",
+    "TaskModel",
   ],
   components: {
     AudioLine,
@@ -439,6 +443,18 @@ export default {
     getScreenHeight() {
       this.screenHeight = window.innerHeight;
     },
+    changeCurQue(answer) {
+      if (answer) {
+        let writeModel = this.curQue.Bookanswer.writeModel;
+        let hz = answer.hz;
+        if (writeModel.hasOwnProperty(hz)) {
+          writeModel[hz].push(answer);
+        } else {
+          writeModel[hz] = [answer];
+        }
+        console.log(this.curQue.Bookanswer);
+      }
+    },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {},

src/components/Adult/preview/ArticleViewChs/Practicechs.vue

@@ -246,12 +246,19 @@
           >
             <div class="Soundrecord-content-inner">
               <Soundrecord
-                @handleWav="handleWav"
                 type="promax"
                 class="luyin-box"
                 @getWavblob="getWavblob"
                 @handleParentPlay="handleParentPlay"
                 @sentPause="sentPause"
+                :TaskModel="TaskModel"
+                :answerRecordList="
+                  curQue.Bookanswer.practiceModel[index] &&
+                  curQue.Bookanswer.practiceModel[index].recordList
+                "
+                :tmIndex="index"
+                @handleWav="handleWav"
+                v-if="refresh"
               />
               <div
                 class="compare-box"
@@ -289,6 +296,8 @@
         :NNPENewWordList="NNPENewWordList"
         :currentTreeID="currentTreeID"
         :config="config"
+        :TaskModel="TaskModel"
+        @handleWav="handleWav"
         @changePinyin="changePinyin"
         @changeEN="changeEN"
         @exitFullscreen="exitFullscreen"
@@ -335,6 +344,7 @@ export default {
       isFull: false,
       mathNum: Math.random().toString(36).substr(2),
       ed: undefined,
+      refresh: true,
     };
   },
   computed: {
@@ -355,6 +365,19 @@ export default {
       },
       deep: true,
     },
+    isFull: {
+      handler: function (newVal, oldVal) {
+        let _this = this;
+        _this.refresh = false;
+        if (!newVal) {
+          _this.$nextTick(() => {
+            // 重新渲染组件
+            _this.refresh = true;
+          });
+        }
+      },
+      deep: true,
+    },
   },
   //方法集合
   methods: {
@@ -580,7 +603,17 @@ export default {
     emptyEd() {
       this.ed = undefined;
     },
-    handleWav(data) {},
+    handleWav(list, tmIndex) {
+      tmIndex = tmIndex ? tmIndex : 0;
+      this.curQue.Bookanswer.practiceModel[tmIndex] = {
+        recordList: [],
+      };
+      this.$set(
+        this.curQue.Bookanswer.practiceModel[tmIndex],
+        "recordList",
+        list
+      );
+    },
     // 录音时暂停音频播放
     handleParentPlay() {
       this.stopAudio = true;

src/components/Adult/preview/ArticleViewChs/WordModelChs.vue

@@ -180,6 +180,9 @@
           :changeWordCard="changeWordCard"
           :themeColor="themeColor"
           :currentTreeID="currentTreeID"
+          :TaskModel="TaskModel"
+          :writeList="curQue.Bookanswer.writeModel"
+          @changeCurQue="changeCurQue"
         />
       </div>
     </template>
@@ -199,6 +202,7 @@ export default {
     "themeColor",
     "currentTreeID",
     "config",
+    "TaskModel",
   ],
   components: {
     AudioLine,
@@ -432,6 +436,18 @@ export default {
     getScreenHeight() {
       this.screenHeight = window.innerHeight;
     },
+    changeCurQue(answer) {
+      if (answer) {
+        let writeModel = this.curQue.Bookanswer.writeModel;
+        let hz = answer.hz;
+        if (writeModel.hasOwnProperty(hz)) {
+          writeModel[hz].push(answer);
+        } else {
+          writeModel[hz] = [answer];
+        }
+        console.log(this.curQue.Bookanswer);
+      }
+    },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {},

src/components/Adult/preview/DialogueArticleViewChs/Practicechs.vue

@@ -350,6 +350,7 @@
                 "
                 :tmIndex="index"
                 @handleWav="handleWav"
+                v-if="refresh"
               />
               <div
                 class="compare-box"
@@ -487,6 +488,7 @@ export default {
       isFull: false,
       mathNum: Math.random().toString(36).substr(2),
       ed: undefined,
+      refresh: true,
     };
   },
   computed: {
@@ -507,6 +509,19 @@ export default {
       },
       deep: true,
     },
+    isFull: {
+      handler: function (newVal, oldVal) {
+        let _this = this;
+        _this.refresh = false;
+        if (!newVal) {
+          _this.$nextTick(() => {
+            // 重新渲染组件
+            _this.refresh = true;
+          });
+        }
+      },
+      deep: true,
+    },
   },
   //方法集合
   methods: {

src/components/Adult/preview/NewWordShow.vue

@@ -61,7 +61,7 @@
           >
             <div
               class="strockplay-newWord"
-              @click="freeWrite(items, index, indexs + 1)"
+              @click="freeWrite(items, index, indexs)"
             >
               <!-- <div
                 @click.stop="playHanzi(index, indexs, items)"
@@ -110,6 +110,10 @@
         :rowIndex="activeIndex"
         :colIndex="activeColIndex"
         :closeifFreeShow="closeifFreeShow"
+        :TaskModel="TaskModel"
+        :writeList="curQue.Bookanswer.writeModel"
+        @changeCurQue="changeCurQue"
+        @deleteWriteRecord="deleteWriteRecord"
       />
     </div>
   </div>
@@ -123,7 +127,7 @@ import { getContentFile, LearnWebSI } from "../../../api/ajax";
 import FreeWriteQP from "./components/FreeWriteQP.vue";
 export default {
   components: { Strockplayredline, Practice, FreewriteLettle, FreeWriteQP },
-  props: ["curQue", "themeColor", "indexStr", "currentTreeID"],
+  props: ["curQue", "themeColor", "indexStr", "currentTreeID", "TaskModel"],
   data() {
     return {
       isPraShow: false,
@@ -135,6 +139,9 @@ export default {
       currentHz: "", //当前汉字
       currenHzData: null, //当前汉字数据
       playStatus: false, //播放状态
+      userAnswer: {
+        writeModel: {}, //生词/取词模式
+      },
     };
   },
   computed: {},
@@ -205,6 +212,7 @@ export default {
           }
         });
       });
+      console.log(this.curQue.option);
     },
     changePraShow() {
       this.isPraShow = false;
@@ -245,11 +253,35 @@ export default {
       this.activeColIndex = indexs;
       this.currentHz = this.curQue.option[index].con;
       this.currenHzData = imgUrl;
-      console.log(this.currenHzData);
+      //console.log(this.currenHzData);
+    },
+    //删除记录
+    deleteWriteRecord(rowIndex, colIndex) {
+      this.$set(this.curQue.option[rowIndex].imgarr, colIndex, {});
+    },
+    changeCurQue(answer, rowIndex) {
+      if (answer) {
+        let writeModel = this.curQue.Bookanswer.writeModel;
+        let hz = answer.hz;
+        if (writeModel.hasOwnProperty(hz)) {
+          writeModel[hz][rowIndex] = answer;
+        } else {
+          writeModel[hz] = [];
+          for (let i = 0; i < 6; i++) {
+            writeModel[hz].push(null);
+          }
+          writeModel[hz][0] = answer;
+        }
+        console.log(this.curQue.Bookanswer);
+      }
     },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {
+    let _this = this;
+    if (!_this.curQue.Bookanswer) {
+      _this.curQue.Bookanswer = JSON.parse(JSON.stringify(_this.userAnswer));
+    }
     this.handleData();
   },
   //生命周期 - 挂载完成（可以访问DOM元素）

src/components/Adult/preview/Soundrecord.vue

@@ -3,7 +3,11 @@
   <div class="NNPE-Book-record">
     <template v-if="(type && type == 'normal') || (type && type == 'mini')">
       <div
-        :class="['record', microphoneStatus ? 'active' : '', !TaskModel||TaskModel!='ANSWER'?'':'notAllow']"
+        :class="[
+          'record',
+          microphoneStatus ? 'active' : '',
+          !TaskModel || TaskModel != 'ANSWER' ? '' : 'notAllow',
+        ]"
         @click="microphone"
       />
       <span
@@ -30,7 +34,11 @@
     </template>
     <template v-else-if="type && type == 'pro'">
       <div
-        :class="['record', microphoneStatus ? 'active' : '', !TaskModel||TaskModel!='ANSWER'?'':'notAllow']"
+        :class="[
+          'record',
+          microphoneStatus ? 'active' : '',
+          !TaskModel || TaskModel != 'ANSWER' ? '' : 'notAllow',
+        ]"
         @click="microphone"
       />
       <el-select
@@ -41,7 +49,7 @@
       >
         <el-option
           v-for="(item, index) in recordList"
-          :key="'select'+item.id"
+          :key="'select' + item.id"
           :label="item.name"
           :value="index"
         />
@@ -57,13 +65,23 @@
         "
       />
       <a
-        :class="['record-delete', hasMicro&&(!TaskModel||TaskModel!='ANSWER') ? 'record-delete-has' : '', !TaskModel||TaskModel!='ANSWER'?'':'notAllow']"
+        :class="[
+          'record-delete',
+          hasMicro && (!TaskModel || TaskModel != 'ANSWER')
+            ? 'record-delete-has'
+            : '',
+          !TaskModel || TaskModel != 'ANSWER' ? '' : 'notAllow',
+        ]"
         @click="handleDelete"
       />
     </template>
     <template v-else>
       <div
-        :class="['record', microphoneStatus ? 'active' : '', !TaskModel||TaskModel!='ANSWER'?'':'notAllow']"
+        :class="[
+          'record',
+          microphoneStatus ? 'active' : '',
+          !TaskModel || TaskModel != 'ANSWER' ? '' : 'notAllow',
+        ]"
         @click="microphone"
       />
       <span
@@ -81,7 +99,7 @@
       >
         <el-option
           v-for="(item, index) in recordList"
-          :key="'selectbig' + item.id + index "
+          :key="'selectbig' + item.id + index"
           :label="item.name"
           :value="index"
         />
@@ -97,7 +115,13 @@
         "
       />
       <a
-        :class="['record-delete', hasMicro&&(!TaskModel||TaskModel!='ANSWER') ? 'record-delete-has' : '', !TaskModel||TaskModel!='ANSWER'?'':'notAllow']"
+        :class="[
+          'record-delete',
+          hasMicro && (!TaskModel || TaskModel != 'ANSWER')
+            ? 'record-delete-has'
+            : '',
+          !TaskModel || TaskModel != 'ANSWER' ? '' : 'notAllow',
+        ]"
         @click="handleDelete"
       />
     </template>
@@ -115,7 +139,7 @@ export default {
     "selectData",
     "tmIndex",
     "answerRecordList",
-    "TaskModel"
+    "TaskModel",
   ],
   data() {
     return {
@@ -154,9 +178,12 @@ export default {
   // 生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {
     let _this = this;
-    _this.recordList = _this.answerRecordList ? JSON.parse(JSON.stringify(_this.answerRecordList)) : [];
+    _this.recordList = _this.answerRecordList
+      ? JSON.parse(JSON.stringify(_this.answerRecordList))
+      : [];
     if (_this.recordList.length > 0) {
       _this.selectIndex = 0;
+      _this.recordFile = _this.recordList.length + 1;
       _this.handleChangeRecord(0);
     }
     _this.audio.addEventListener("play", function () {
@@ -183,65 +210,65 @@ export default {
     // 开始录音
     microphone() {
       let _this = this;
-      if(!this.TaskModel||this.TaskModel!='ANSWER'){
-          if (!_this.microphoneStatus) {
-            _this.hasMicro = "";
-            _this.$root.isRecording = true;
-            _this.$emit("getWavblob", null);
-            this.$emit("getSelectData", { type: "" });
-            // 开始录音
-            this.recorder.start();
-            this.microphoneStatus = true;
-            this.recordtime = 0;
-            this.isPlaying = false;
-            clearInterval(_this.timer);
-                _this.timer = setInterval(() => {
-                _this.recordtime++;
-            }, 1000);
-            this.$emit("handleParentPlay");
-            let obj = {
-                name: _this.fileName
-                    ? _this.fileName + _this.recordFile
-                    : "新录音" + _this.recordFile,
-                id: _this.recordFile + Math.round(Math.random() * 10),
-            };
-            if (this.selectData) obj.selectData = this.selectData;
-                _this.recordList.push(obj);
+      if (!this.TaskModel || this.TaskModel != "ANSWER") {
+        if (!_this.microphoneStatus) {
+          _this.hasMicro = "";
+          _this.$root.isRecording = true;
+          _this.$emit("getWavblob", null);
+          this.$emit("getSelectData", { type: "" });
+          // 开始录音
+          this.recorder.start();
+          this.microphoneStatus = true;
+          this.recordtime = 0;
+          this.isPlaying = false;
+          clearInterval(_this.timer);
+          _this.timer = setInterval(() => {
+            _this.recordtime++;
+          }, 1000);
+          this.$emit("handleParentPlay");
+          let obj = {
+            name: _this.fileName
+              ? _this.fileName + _this.recordFile
+              : "新录音" + _this.recordFile,
+            id: _this.recordFile + Math.round(Math.random() * 10),
+          };
+          if (this.selectData) obj.selectData = this.selectData;
+          _this.recordList.push(obj);
 
-                _this.recordFile++;
-                _this.selectIndex = _this.recordList.length - 1;
-            } else {
-                this.hasMicro = "normal";
-                this.recorder.stop();
-                _this.$root.isRecording = false;
-                clearInterval(_this.timer);
-                let toltime = this.recorder.duration; // 录音总时长
-                let fileSize = this.recorder.fileSize; // 录音总大小
-                // 录音结束，获取取录音数据
-                let PCMBlob = this.recorder.getPCMBlob(); // 获取 PCM 数据
-                let wav = this.recorder.getWAVBlob(); // 获取 WAV 数据
-                // this.wavblob = wav;
-                this.microphoneStatus = false;
-                let reader = new window.FileReader();
-                reader.readAsDataURL(wav);
-                reader.onloadend = () => {
-                _this.recordList[_this.selectIndex].wavData = reader.result;
-                _this.recordList[_this.selectIndex].toltime = Math.floor(toltime);
-                _this.recordList[_this.selectIndex].fileSize = fileSize;
-                _this.wavblob = _this.recordList[_this.selectIndex].wavData;
-                _this.$emit("getWavblob", _this.wavblob);
-                _this.$emit(
-                    "handleWav",
-                    JSON.parse(JSON.stringify(_this.recordList)),
-                    _this.tmIndex
-                );
+          _this.recordFile++;
+          _this.selectIndex = _this.recordList.length - 1;
+        } else {
+          this.hasMicro = "normal";
+          this.recorder.stop();
+          _this.$root.isRecording = false;
+          clearInterval(_this.timer);
+          let toltime = this.recorder.duration; // 录音总时长
+          let fileSize = this.recorder.fileSize; // 录音总大小
+          // 录音结束，获取取录音数据
+          let PCMBlob = this.recorder.getPCMBlob(); // 获取 PCM 数据
+          let wav = this.recorder.getWAVBlob(); // 获取 WAV 数据
+          // this.wavblob = wav;
+          this.microphoneStatus = false;
+          let reader = new window.FileReader();
+          reader.readAsDataURL(wav);
+          reader.onloadend = () => {
+            _this.recordList[_this.selectIndex].wavData = reader.result;
+            _this.recordList[_this.selectIndex].toltime = Math.floor(toltime);
+            _this.recordList[_this.selectIndex].fileSize = fileSize;
+            _this.wavblob = _this.recordList[_this.selectIndex].wavData;
+            _this.$emit("getWavblob", _this.wavblob);
+            _this.$emit(
+              "handleWav",
+              JSON.parse(JSON.stringify(_this.recordList)),
+              _this.tmIndex
+            );
             if (this.recordList[this.selectIndex].selectData)
-                this.$emit(
+              this.$emit(
                 "getSelectData",
                 this.recordList[this.selectIndex].selectData
-                );
+              );
             //   }
-            };
+          };
         }
       }
     },
@@ -253,11 +280,11 @@ export default {
           let _this = this;
           if (!this.audio.paused) {
             this.audio.pause();
-            this.hasMicro = 'normal'
+            this.hasMicro = "normal";
             clearInterval(_this.timer);
           } else if (this.audio.paused && _this.oldIndex == _this.selectIndex) {
             _this.audio.play();
-            this.hasMicro = 'active'
+            this.hasMicro = "active";
             if (_this.recordtime == 0) {
               _this.recordtime = totalTimes;
               _this.playtime = 0;
@@ -271,7 +298,7 @@ export default {
               }
             }, 1000);
           } else {
-            _this.hasMicro = 'active'
+            _this.hasMicro = "active";
             _this.audio.pause();
             _this.audio.load();
             _this.audio.src = _this.wavblob;
@@ -334,7 +361,7 @@ export default {
     },
     handleDelete() {
       let _this = this;
-      if (_this.hasMicro&&(!this.TaskModel||this.TaskModel!='ANSWER')) {
+      if (_this.hasMicro && (!this.TaskModel || this.TaskModel != "ANSWER")) {
         if (_this.selectIndex || _this.selectIndex == 0) {
           _this.recordList.splice(_this.selectIndex, 1);
           _this.$emit(
@@ -421,11 +448,11 @@ export default {
         no-repeat;
       background-size: 100%;
     }
-    &.notAllow{
-        cursor: not-allowed;
-        background: url("../../../assets/newImage/common/luyin-notAllow.png") center
-            no-repeat;
-        background-size: 100%;
+    &.notAllow {
+      cursor: not-allowed;
+      background: url("../../../assets/newImage/common/luyin-notAllow.png")
+        center no-repeat;
+      background-size: 100%;
     }
   }
   .record-time {
@@ -462,8 +489,8 @@ export default {
         background-size: 100%;
       }
     }
-    &.notAllow{
-        cursor: not-allowed;
+    &.notAllow {
+      cursor: not-allowed;
     }
   }
 }

src/components/Adult/preview/Soundrecorddiff.vue

@@ -37,6 +37,7 @@
         v-model="selectIndex"
         placeholder="无录音"
         @change="handleChangeRecord"
+        :popper-append-to-body="false"
       >
         <el-option
           v-for="(item, index) in recordList"
@@ -45,7 +46,11 @@
           :value="index"
         />
       </el-select>
-      <a class="record-delete" @click="handleDelete" />
+      <a
+        class="record-delete"
+        @click="handleDelete"
+        v-if="TaskModel != 'ANSWER'"
+      />
     </div>
   </div>
 </template>
@@ -105,7 +110,15 @@ export default {
       : [];
     if (_this.recordList.length > 0) {
       _this.selectIndex = 0;
+      _this.recordFile = _this.recordList.length + 1;
       _this.handleChangeRecord(0);
+      if (_this.TaskModel != "ANSWER") {
+        _this.$emit(
+          "getRerordStatus",
+          !_this.microphoneStatus && _this.recordList.length > 0
+        );
+      }
+      _this.$forceUpdate();
     }
     _this.audio.addEventListener("play", function () {
       _this.changeStatus("active");
@@ -175,19 +188,20 @@ export default {
           _this.recordList[_this.selectIndex].wavData = reader.result;
           _this.recordList[_this.selectIndex].toltime = Math.floor(toltime);
           _this.recordList[_this.selectIndex].fileSize = fileSize;
-          //   if (
-          //     (_this.type && _this.type == "normal") ||
-          //     (_this.type && _this.type == "mini")
-          //   ) {
+
           _this.wavblob = _this.recordList[_this.selectIndex].wavData;
           _this.$emit("getWavblob", _this.wavblob);
+          _this.$emit(
+            "handleWav",
+            JSON.parse(JSON.stringify(_this.recordList)),
+            _this.tmIndex
+          );
           if (this.recordList[this.selectIndex].selectData) {
             this.$emit(
               "getSelectData",
               this.recordList[this.selectIndex].selectData
             );
           }
-          //   }
         };
       }
       _this.$emit(
@@ -285,6 +299,11 @@ export default {
       if (this.hasMicro) {
         if (this.selectIndex || this.selectIndex == 0) {
           this.recordList.splice(this.selectIndex, 1);
+          _this.$emit(
+            "handleWav",
+            JSON.parse(JSON.stringify(_this.recordList)),
+            _this.tmIndex
+          );
           this.selectIndex =
             this.recordList.length > 0 ? this.recordList.length - 1 : null;
           this.hasMicro = this.recordList.length > 0 ? "normal" : "";
@@ -435,6 +454,10 @@ export default {
       background: url("../../../assets/NPC/del-24.png") center no-repeat;
       background-size: 100%;
       display: block;
+      &-disabled {
+        background: url("../../../assets/NPC/del-24.png") center no-repeat;
+        background-size: 100%;
+      }
     }
     &-white {
       background: rgba(255, 255, 255, 0.1);

src/components/Adult/preview/Voicefullscreen.vue

@@ -430,7 +430,6 @@
         ></div>
       </div>
     </div>
-
     <div
       class="voicefull-bottom"
       @mouseover="setBottomShow(true)"

src/components/Adult/preview/components/Freewrite.vue

@@ -126,7 +126,6 @@ export default {
       this.imgarr = [];
       let hz =
         this.tabIndex == 0 ? this.cur.stem[0].con : this.cur.stem[0].TChinese;
-      debugger;
       let imgarr = JSON.parse(JSON.stringify(this.writeList));
       this.imgarr = imgarr[hz].map((item) => {
         item.history = JSON.parse(item.strokes_content);

src/components/Adult/preview/components/FreewriteLettle.vue

@@ -68,6 +68,8 @@ export default {
     "closeifFreeShow",
     "rowIndex",
     "colIndex",
+    "TaskModel",
+    "writeList",
   ],
   data() {
     return {
@@ -154,6 +156,27 @@ export default {
       this.imgOrCans = false;
       this.$refs.esign.reset();
       this.data.strokes_image_url = "";
+      //this.removeImage();
+    },
+    removeImage() {
+      let _this = this;
+      if (_this.data) {
+        // if (_this.hasPlay) {
+        //   _this.$message.warning("正在播放，不能删除");
+        //   return;
+        // }
+        let MethodName =
+          "teaching-practice_manager-DeleteMyHZHandwrittenRecord";
+        let data = {
+          hz_handwritten_record_id: this.data.hz_handwritten_record_id,
+        };
+        LearnWebSI(MethodName, data).then((res) => {
+          _this.$message.success("删除成功");
+          _this.data = {};
+          _this.$emit("deleteWriteRecord", _this.rowIndex, _this.colIndex);
+          //this.resetHuahua();
+        });
+      }
     },
     handleWriteImg() {
       this.$refs.esign
@@ -161,6 +184,13 @@ export default {
         .then((res) => {
           let Book_img = res.replace("data:image/png;base64,", "");
           let write_img = "data:image/png;base64," + Book_img;
+          let answer = {};
+          answer = {
+            hz: this.currentHz,
+            strokes_content: JSON.stringify(this.$refs.esign.history),
+            strokes_image_url: write_img,
+          };
+          this.$emit("changeCurQue", answer, this.rowIndex);
           let data = {
             courseware_id: this.currentTreeID,
             hz: this.currentHz,

src/views/courseView.vue

@@ -222,7 +222,10 @@ export default {
     },
     saveAnswer() {
       let answer = this.$refs.preview.saveAnswer();
+      console.log("保存答案：");
       console.log(answer);
+      let answerStr = JSON.stringify(answer);
+      localStorage.setItem("Bookanswer", answerStr);
     },
   },
 };