|
|
@@ -21,6 +21,22 @@
|
|
|
ref="richText"
|
|
|
v-model="scope.row.con"
|
|
|
:inline="true"
|
|
|
+ :item-index="scope.$index"
|
|
|
+ :font-size="data?.unified_attrib?.font_size"
|
|
|
+ :font-family="data?.unified_attrib?.font"
|
|
|
+ toolbar="fontselect fontsizeselect forecolor backcolor | underline | bold italic strikethrough alignleft aligncenter alignright"
|
|
|
+ @handleRichTextBlur="handleBlurCon"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column v-if="isEnable(data.property.view_pinyin)" prop="con" label="拼音" width="150">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <RichText
|
|
|
+ ref="richText"
|
|
|
+ v-model="scope.row.pinyin"
|
|
|
+ :inline="true"
|
|
|
+ :font-size="data?.unified_attrib?.font_size"
|
|
|
+ :font-family="data?.unified_attrib?.font"
|
|
|
toolbar="fontselect fontsizeselect forecolor backcolor | underline | bold italic strikethrough alignleft aligncenter alignright"
|
|
|
/>
|
|
|
</template>
|
|
|
@@ -45,6 +61,17 @@
|
|
|
/>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
+ <!-- <el-table-column prop="img_list" label="图片" width="300">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <UploadPicture
|
|
|
+ :file-info="scope.row.file_list[0]"
|
|
|
+ :item-index="scope.$index"
|
|
|
+ :show-upload="!scope.row.file_list[0]"
|
|
|
+ @upload="uploadPic"
|
|
|
+ @deleteFile="deletePic"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </el-table-column> -->
|
|
|
<el-table-column label="操作" width="150">
|
|
|
<template slot-scope="scope">
|
|
|
<el-button size="mini" type="text" @click="handleDelete(scope.$index)">删除</el-button>
|
|
|
@@ -54,22 +81,65 @@
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<el-button icon="el-icon-plus" style="margin: 24px 0" @click="addElement">增加一个</el-button>
|
|
|
+ <el-form :model="data.property" label-width="72px" label-position="left">
|
|
|
+ <el-form-item label="拼音">
|
|
|
+ <el-switch v-model="data.property.view_pinyin" active-value="true" inactive-value="false" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="拼音位置">
|
|
|
+ <el-radio
|
|
|
+ v-for="{ value, label } in pinyinPositionLists"
|
|
|
+ :key="value"
|
|
|
+ v-model="data.property.pinyin_position"
|
|
|
+ :label="value"
|
|
|
+ :disabled="!isEnable(data.property.view_pinyin)"
|
|
|
+ >
|
|
|
+ {{ label }}
|
|
|
+ </el-radio>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="">
|
|
|
+ <el-checkbox
|
|
|
+ v-model="data.property.is_first_sentence_first_hz_pinyin_first_char_upper_case"
|
|
|
+ :disabled="!isEnable(data.property.view_pinyin)"
|
|
|
+ true-label="true"
|
|
|
+ false-label="false"
|
|
|
+ >句首大写</el-checkbox
|
|
|
+ >
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import RichText from '@/components/RichText.vue';
|
|
|
+import UploadPicture from '../new_word/components/UploadPicture.vue';
|
|
|
+import { pinyinPositionLists } from '@/views/book/courseware/data/notes';
|
|
|
+import { isEnable } from '@/views/book/courseware/data/common';
|
|
|
export default {
|
|
|
name: 'NotesPage',
|
|
|
components: {
|
|
|
RichText,
|
|
|
+ UploadPicture,
|
|
|
},
|
|
|
props: ['dataNotes'],
|
|
|
data() {
|
|
|
return {
|
|
|
data: this.dataNotes,
|
|
|
+ pinyinPositionLists,
|
|
|
+ isEnable,
|
|
|
};
|
|
|
},
|
|
|
+ watch: {
|
|
|
+ 'data.property.is_first_sentence_first_hz_pinyin_first_char_upper_case': {
|
|
|
+ handler(val, oldVal) {
|
|
|
+ if (val === oldVal) return;
|
|
|
+
|
|
|
+ if (isEnable(this.data.property.view_pinyin)) {
|
|
|
+ this.handlePinyin();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep: true,
|
|
|
+ },
|
|
|
+ },
|
|
|
methods: {
|
|
|
// 删除行
|
|
|
handleDelete(index) {
|
|
|
@@ -110,6 +180,30 @@ export default {
|
|
|
this.data.option[index].file_list[0] = '';
|
|
|
this.data.file_id_list = this.data.file_id_list.filter((item) => item !== file_id);
|
|
|
},
|
|
|
+ handleBlurCon(i) {
|
|
|
+ let text = this.data.option[i].con.replace(/<[^>]+>/g, '');
|
|
|
+ this.data.option[i].pinyin = cnchar
|
|
|
+ .spell(
|
|
|
+ text,
|
|
|
+ 'array',
|
|
|
+ this.data.property.is_first_sentence_first_hz_pinyin_first_char_upper_case === 'true' ? 'high' : 'low',
|
|
|
+ 'tone',
|
|
|
+ )
|
|
|
+ .join(' ');
|
|
|
+ },
|
|
|
+ handlePinyin() {
|
|
|
+ this.data.option.forEach((item) => {
|
|
|
+ let text = item.con.replace(/<[^>]+>/g, '');
|
|
|
+ item.pinyin = cnchar
|
|
|
+ .spell(
|
|
|
+ text,
|
|
|
+ 'array',
|
|
|
+ this.data.property.is_first_sentence_first_hz_pinyin_first_char_upper_case === 'true' ? 'high' : 'low',
|
|
|
+ 'tone',
|
|
|
+ )
|
|
|
+ .join(' ');
|
|
|
+ });
|
|
|
+ },
|
|
|
},
|
|
|
};
|
|
|
</script>
|