|
@@ -26,7 +26,7 @@
|
|
|
<div class="content">
|
|
|
<label class="title-little">题目:</label>
|
|
|
<ul>
|
|
|
- <li v-for="(item, i) in data.option_list" :key="i" v-loading="item.loadings" class="content-item">
|
|
|
+ <li v-for="(item, i) in data.option_list" :key="i" v-loading="loading_list[i].loadings" class="content-item">
|
|
|
<span
|
|
|
v-if="data.property.learn_type === 'dictation'"
|
|
|
class="question-number"
|
|
@@ -39,11 +39,12 @@
|
|
|
v-model="item.content"
|
|
|
:maxlength="data.property.learn_type === 'dictation' ? null : 1"
|
|
|
:placeholder="data.property.learn_type === 'dictation' ? '输入汉字或词汇' : '输入一个汉字'"
|
|
|
- @blur="handleChineseStrokes(item)"
|
|
|
+ @blur="handleChineseStrokes(item, i)"
|
|
|
/>
|
|
|
<el-input
|
|
|
v-model="item.pinyin"
|
|
|
:placeholder="data.property.learn_type === 'dictation' ? '拼音间用空格隔开' : '输入拼音'"
|
|
|
+ @blur="handleSplitPy(item)"
|
|
|
/>
|
|
|
<UploadAudio
|
|
|
v-if="data.other.audio_generation_method === 'upload'"
|
|
@@ -56,7 +57,7 @@
|
|
|
/>
|
|
|
<div v-else-if="data.other.audio_generation_method === 'auto'" class="auto-matically">
|
|
|
<AudioPlay v-if="item.audio_file_id" :file-id="item.audio_file_id" theme-color="gray" />
|
|
|
- <span v-loading="item.loading" class="auto-btn" @click="handleMatically(item)">{{
|
|
|
+ <span v-loading="loading_list[i].loading" class="auto-btn" @click="handleMatically(item, i)">{{
|
|
|
item.audio_file_id ? '已生成' : '自动生成'
|
|
|
}}</span>
|
|
|
</div>
|
|
@@ -195,11 +196,29 @@ export default {
|
|
|
data: JSON.parse(JSON.stringify(chineseData)),
|
|
|
changeOptionType,
|
|
|
handleInputNumber,
|
|
|
+ loading_list: [
|
|
|
+ {
|
|
|
+ loading: false,
|
|
|
+ loadings: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ loading: false,
|
|
|
+ loadings: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ loading: false,
|
|
|
+ loadings: false,
|
|
|
+ },
|
|
|
+ ],
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
addOption() {
|
|
|
this.data.option_list.push(getOption());
|
|
|
+ this.loading_list.push({
|
|
|
+ loading: false,
|
|
|
+ loadings: false,
|
|
|
+ });
|
|
|
},
|
|
|
uploads(file_id, index) {
|
|
|
this.data.option_list[index].audio_file_id = file_id;
|
|
@@ -219,27 +238,28 @@ export default {
|
|
|
.then(() => {
|
|
|
this.data.option_list.splice(i, 1);
|
|
|
this.data.file_id_list.splice(this.data.file_id_list.indexOf(file_id), 1);
|
|
|
+ this.loading_list.splice(i, 1);
|
|
|
})
|
|
|
.catch(() => {});
|
|
|
},
|
|
|
// 自动生成音频
|
|
|
- handleMatically(item) {
|
|
|
+ handleMatically(item, i) {
|
|
|
if (item.pinyin.trim()) {
|
|
|
- this.$set(item, 'loading', true);
|
|
|
+ this.loading_list[i].loading = true;
|
|
|
let MethodName = 'tool-PinyinToVoiceFile';
|
|
|
let data = {
|
|
|
pinyin: item.pinyin.trim(),
|
|
|
};
|
|
|
GetStaticResources(MethodName, data)
|
|
|
.then((res) => {
|
|
|
- item.loading = false;
|
|
|
+ this.loading_list[i].loading = false;
|
|
|
if (res.status === 1) {
|
|
|
item.audio_file_id = res.file_id;
|
|
|
this.data.file_id_list.push(res.file_id);
|
|
|
}
|
|
|
})
|
|
|
.catch(() => {
|
|
|
- item.loading = false;
|
|
|
+ this.loading_list[i].loading = false;
|
|
|
});
|
|
|
}
|
|
|
},
|
|
@@ -254,9 +274,9 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
// 生成汉字
|
|
|
- handleChineseStrokes(item) {
|
|
|
+ handleChineseStrokes(item, i) {
|
|
|
if (item.content.trim()) {
|
|
|
- this.$set(item, 'loadings', true);
|
|
|
+ this.loading_list[i].loadings = true;
|
|
|
let content_arr = item.content.trim().split('');
|
|
|
let content_arrs = [];
|
|
|
let content_arr_strokes = [];
|
|
@@ -279,11 +299,22 @@ export default {
|
|
|
content_arr_strokes[indexc] = obj;
|
|
|
});
|
|
|
});
|
|
|
- item.loadings = false;
|
|
|
+ this.loading_list[i].loadings = false;
|
|
|
|
|
|
item.hz_strokes_list = content_arr_strokes;
|
|
|
}
|
|
|
},
|
|
|
+ // 切割拼音
|
|
|
+ handleSplitPy(item) {
|
|
|
+ let pinyin_list = item.pinyin.trim().split(' ');
|
|
|
+ item.pinyin_item_list = [];
|
|
|
+ pinyin_list.forEach((itemp) => {
|
|
|
+ let obj = {
|
|
|
+ pinyin_item: itemp,
|
|
|
+ };
|
|
|
+ item.pinyin_item_list.push(obj);
|
|
|
+ });
|
|
|
+ },
|
|
|
},
|
|
|
};
|
|
|
</script>
|