|
@@ -5,11 +5,47 @@
|
|
|
{{dataType}}
|
|
|
<ul>
|
|
|
<li v-for="(items, indexs) in curQue.option" :key="indexs">
|
|
|
+ <b v-if="items.number">{{ items.number }}.</b>
|
|
|
<p :class="[oldsrc==items.mp3_list[0].url?palyClass:'']" @click="handlePlayVoice(items.mp3_list[0].url)" v-if="items.mp3_list&&items.mp3_list.length>0">
|
|
|
</p>
|
|
|
- <b v-if="items.number">{{ items.number }}.</b>
|
|
|
- <span class="item-con">{{items.con}}</span>
|
|
|
- <template v-if="curQue.ChildType=='sentence_answer'">
|
|
|
+ <!-- 句子内容 -->
|
|
|
+ <div class="item-content">
|
|
|
+ <!-- 如果不是填空题 不替换 -->
|
|
|
+ <template v-if="dataType.indexOf('sentence_input_chs')==-1">
|
|
|
+ <template v-if="items.detail.wordsList.length==0">
|
|
|
+ <p :class="['content-con',items.en?'':'content-con-small']" v-if="items.detail.sentence">{{items.detail.sentence}}</p>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <div class="con-box">
|
|
|
+ <div :class="['con-item',indexCon===0?'con-item-0':'']" v-for="(itemCon,indexCon) in items.detail.resArr" :key="indexCon" v-show="itemCon.isShow">
|
|
|
+ <template v-if="items.detail.wordsList[indexCon + 1] && items.detail.wordsList[indexCon + 1].chs && chsFhList.indexOf(items.detail.wordsList[indexCon + 1].chs) > -1">
|
|
|
+ <div class="synthesis-box">
|
|
|
+ <div>
|
|
|
+ <span class="pinyin">{{itemCon.pinyin}}</span>
|
|
|
+ <span class="hanzi content-con">{{itemCon.chs}}</span>
|
|
|
+ </div>
|
|
|
+ <div style="text-align: left">
|
|
|
+ <span class="pinyin">{{items.detail.wordsList[indexCon + 1].pinyin}}</span>
|
|
|
+ <span class="hanzi content-con">{{items.detail.wordsList[indexCon + 1].chs}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <span class="pinyin">{{itemCon.pinyin}}</span>
|
|
|
+ <span class="hanzi content-con">{{itemCon.chs}}</span>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <b class="content-en" v-if="items.en">{{items.en}}</b>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+
|
|
|
+
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ <template v-if="dataType.indexOf('sentence_answer_chs')>-1">
|
|
|
<input
|
|
|
@input="handleInput"
|
|
|
:class="['item-input']"
|
|
@@ -17,17 +53,22 @@
|
|
|
placeholder="输入"
|
|
|
>
|
|
|
</template>
|
|
|
- <template v-if="curQue.ChildType=='sentence_judge'">
|
|
|
+ <template v-if="dataType.indexOf('sentence_judge_chs')>-1">
|
|
|
<div class="judge-box">
|
|
|
<a :class="['right-btn',curQue.Bookanswer[indexs]=='right'?'active':'']" @click="handleSelectJudge('right',indexs)"></a>
|
|
|
<a :class="['error-btn',curQue.Bookanswer[indexs]=='error'?'active':'']" @click="handleSelectJudge('error',indexs)"></a>
|
|
|
</div>
|
|
|
</template>
|
|
|
- <template v-if="curQue.ChildType=='sentence_Record'">
|
|
|
- <Soundrecord @handleWav="handleWav" type="mini" class="luyin-box"/>
|
|
|
+ <template v-if="dataType.indexOf('sentence_record_chs')>-1">
|
|
|
+ <Soundrecord @handleWav="handleWav" type="mini" class="luyin-box" v-if="items.IsRecord"/>
|
|
|
</template>
|
|
|
</li>
|
|
|
</ul>
|
|
|
+
|
|
|
+ <Soundrecord @handleWav="handleWav" type="mini" class="luyin-box" style="width:64px;border: 1px solid rgba(0, 0, 0, 0.1);border-radius: 8px;padding:0 12px;"/>
|
|
|
+ <Soundrecord @handleWav="handleWav" type="normal" class="luyin-box" style="width:129px;border: 1px solid rgba(0, 0, 0, 0.1);border-radius: 8px;padding:0 12px;"/>
|
|
|
+ <Soundrecord @handleWav="handleWav" type="pro" class="luyin-box" style="width:200px;border: 1px solid rgba(0, 0, 0, 0.1);border-radius: 8px;padding:0 12px;"/>
|
|
|
+ <Soundrecord @handleWav="handleWav" type="promax" class="luyin-box" style="width:280px;border: 1px solid rgba(0, 0, 0, 0.1);border-radius: 8px;padding:0 12px;"/>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -42,6 +83,7 @@ export default {
|
|
|
oldsrc: '', // 存储播放音频的src 用来比对是否点击的是同一个音频
|
|
|
palyClass: '',
|
|
|
dataType: [], // 题型
|
|
|
+ chsFhList: [",", "。", "“", ":", "》", "《", "?", "!", ";"],
|
|
|
};
|
|
|
},
|
|
|
computed: {},
|
|
@@ -86,12 +128,52 @@ export default {
|
|
|
_this.dataType.push(item.type)
|
|
|
}
|
|
|
})
|
|
|
+ let curQue = JSON.parse(JSON.stringify(this.curQue));
|
|
|
+ curQue.option.forEach((dItem, dIndex) => {
|
|
|
+ let paraArr = []
|
|
|
+ dItem.detail.wordsList.forEach((sItem, sIndex) => {
|
|
|
+ this.mergeWordSymbol(dItem.detail.wordsList, sItem, sIndex);
|
|
|
+ let obj = {
|
|
|
+ pinyin: sItem.pinyin,
|
|
|
+ chs: sItem.chs,
|
|
|
+ isShow: sItem.isShow,
|
|
|
+ };
|
|
|
+ paraArr.push(obj);
|
|
|
+ })
|
|
|
+ this.$set(_this.curQue.option[dIndex].detail,'resArr',paraArr)
|
|
|
+ if(paraArr.length==0){
|
|
|
+ let str = '就那天___'
|
|
|
+ let arrs = str.split(/_{2,}/g)
|
|
|
+
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //词和标点合一起
|
|
|
+ mergeWordSymbol(sItem, wItem, curIndex) {
|
|
|
+ let leg = sItem.length;
|
|
|
+ if (curIndex < leg - 1) {
|
|
|
+ if (this.chsFhList.indexOf(wItem.chs) > -1) {
|
|
|
+ wItem.isShow = false;
|
|
|
+ } else {
|
|
|
+ wItem.isShow = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
},
|
|
|
// 判断题选择
|
|
|
handleSelectJudge(obj,index){
|
|
|
this.$set(this.curQue.Bookanswer, index, obj);
|
|
|
},
|
|
|
+ handleWav(data) {
|
|
|
|
|
|
+ },
|
|
|
+ handleDatas (str, type) {
|
|
|
+ str = str.trim();
|
|
|
+ str = str.replace(/_{2,}/g, "^ ");
|
|
|
+ str =
|
|
|
+ type == "hanzi" ? str.replace(/\s+/g, "") : str.replace(/\s+/g, " ");
|
|
|
+ let resArr = type == "hanzi" ? str.split("") : str.split(/\s+/);
|
|
|
+ return resArr;
|
|
|
+ },
|
|
|
},
|
|
|
//生命周期 - 创建完成(可以访问当前this实例)
|
|
|
created() {
|
|
@@ -168,15 +250,50 @@ export default {
|
|
|
background-size: 24px;
|
|
|
}
|
|
|
}
|
|
|
- .item-con{
|
|
|
+ .item-content{
|
|
|
flex: 1;
|
|
|
- font-size: 16px;
|
|
|
- line-height: 150%;
|
|
|
- color: #000000;
|
|
|
- margin-right: 8px;
|
|
|
- word-break: break-word;
|
|
|
- // margin-top: 4px;
|
|
|
- font-family: 'FZJCGFKTK';
|
|
|
+ .content-con{
|
|
|
+ font-size: 20px;
|
|
|
+ line-height: 150%;
|
|
|
+ color: #000000;
|
|
|
+ font-family: 'FZJCGFKTK';
|
|
|
+ margin: 0;
|
|
|
+ &.content-con-small{
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .content-en{
|
|
|
+ font-weight: normal;
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 150%;
|
|
|
+ color: #000000;
|
|
|
+ font-family: 'robot';
|
|
|
+ }
|
|
|
+ .con-box{
|
|
|
+ display: flex;
|
|
|
+ flex-flow: wrap;
|
|
|
+ .con-item{
|
|
|
+ text-align: center;
|
|
|
+ padding: 0 3px;
|
|
|
+ &.con-item-0{
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ span{
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ .pinyin{
|
|
|
+ font-family: 'GB-PINYINOK-B';
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 130%;
|
|
|
+ color: #000000;
|
|
|
+ height: 18px;
|
|
|
+ }
|
|
|
+ .synthesis-box{
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
input{
|
|
|
width: 68px;
|
|
@@ -219,7 +336,7 @@ export default {
|
|
|
.luyin-box{
|
|
|
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
border-radius: 8px;
|
|
|
- width: 68px;
|
|
|
+ width: 64px;
|
|
|
}
|
|
|
}
|
|
|
}
|