|
|
@@ -201,10 +201,11 @@
|
|
|
v-model="fenci"
|
|
|
active-color="#735CFF"
|
|
|
:width="26"
|
|
|
- style="margin-right: 34px"
|
|
|
+ style="margin-right: 24px"
|
|
|
inactive-text="分词"
|
|
|
/>
|
|
|
- <el-switch v-model="pinyinShow" active-color="#735CFF" :width="26" inactive-text="显示拼音" />
|
|
|
+ <el-switch v-model="pinyinShow" active-color="#735CFF" :width="26" inactive-text="显示拼音"/>
|
|
|
+ <el-switch v-if="pinyinShow" v-model="pinyinBottom" active-color="#735CFF" :width="26" inactive-text="拼音在下" style="margin-left: 24px" />
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="right_main">
|
|
|
@@ -270,7 +271,7 @@
|
|
|
<span class="word">
|
|
|
<span class="text">
|
|
|
<span
|
|
|
- v-if="pinyinShow"
|
|
|
+ v-if="pinyinShow&&!pinyinBottom"
|
|
|
:class="['pinyin']"
|
|
|
:style="{
|
|
|
fontSize: pinyinFontsize + 'px',
|
|
|
@@ -323,9 +324,93 @@
|
|
|
>{{ word.word }}</span>
|
|
|
</template>
|
|
|
</span>
|
|
|
+ <br v-if="pinyinShow" />
|
|
|
+ <span
|
|
|
+ v-if="pinyinShow&&pinyinBottom"
|
|
|
+ :class="['pinyin']"
|
|
|
+ :style="{
|
|
|
+ fontSize: pinyinFontsize + 'px',
|
|
|
+ lineHeight: pinyinLineHeight + 'px',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ {{ itemss.pinyin_lt }}
|
|
|
+ </span>
|
|
|
</span>
|
|
|
<span class="texts">
|
|
|
- <template v-if="pinyinShow">
|
|
|
+ <template v-if="pinyinShow&&!pinyinBottom">
|
|
|
+ <span
|
|
|
+ :class="['pinyin']"
|
|
|
+ :style="{
|
|
|
+ fontSize: pinyinFontsize + 'px',
|
|
|
+ lineHeight: pinyinLineHeight + 'px',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <!-- {{ itemss.pinyinStr }} -->
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ <br v-if="pinyinShow" />
|
|
|
+ <span>
|
|
|
+ <template v-for="(word, indexsss) in itemss.texts">
|
|
|
+ <span
|
|
|
+ class="hanzi"
|
|
|
+ :key="indexsss + 'word'"
|
|
|
+ :style="{
|
|
|
+ fontSize: wordFontsize + 'px',
|
|
|
+ lineHeight: wordLineHeight + 'px',
|
|
|
+ background: word.color ? word.color : '',
|
|
|
+ color: word.color
|
|
|
+ ? '#000'
|
|
|
+ : !xifen
|
|
|
+ ? leftNavIndex == 0
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.P_G) != -1
|
|
|
+ ? levelMap[word.levels.P_G].color
|
|
|
+ : '#000'
|
|
|
+ : leftNavIndex == 1
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.W_G) != -1
|
|
|
+ ? levelMap[word.levels.W_G].color
|
|
|
+ : '#000'
|
|
|
+ : leftNavIndex == 2
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.C_G) != -1
|
|
|
+ ? levelMap[word.levels.C_G].color
|
|
|
+ : '#000'
|
|
|
+ : '#000'
|
|
|
+ : leftNavIndex == 0
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.P_L) != -1
|
|
|
+ ? levelMap[word.levels.P_L].color
|
|
|
+ : '#000'
|
|
|
+ : leftNavIndex == 1
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.W_L) != -1
|
|
|
+ ? levelMap[word.levels.W_L].color
|
|
|
+ : '#000'
|
|
|
+ : leftNavIndex == 2
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.C_L) != -1
|
|
|
+ ? levelMap[word.levels.C_L].color
|
|
|
+ : '#000'
|
|
|
+ : '#000',
|
|
|
+ }"
|
|
|
+ >{{ word.word }}</span>
|
|
|
+ </template>
|
|
|
+ </span>
|
|
|
+ <br v-if="pinyinShow" />
|
|
|
+ <template v-if="pinyinShow&&pinyinBottom">
|
|
|
+ <span
|
|
|
+ :class="['pinyin']"
|
|
|
+ :style="{
|
|
|
+ fontSize: pinyinFontsize + 'px',
|
|
|
+ lineHeight: pinyinLineHeight + 'px',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <!-- {{ itemss.pinyinStr }} -->
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <span :class="['word']">
|
|
|
+ <!-- <template v-if="word.isShow"> -->
|
|
|
+ <span class="text">
|
|
|
+ <template v-if="pinyinShow&&!pinyinBottom">
|
|
|
<span
|
|
|
:class="['pinyin']"
|
|
|
:style="{
|
|
|
@@ -333,13 +418,14 @@
|
|
|
lineHeight: pinyinLineHeight + 'px',
|
|
|
}"
|
|
|
>
|
|
|
- <!-- {{ itemss.pinyinStr }} -->
|
|
|
+ {{ itemss.pinyinStr }}
|
|
|
</span>
|
|
|
</template>
|
|
|
<br v-if="pinyinShow" />
|
|
|
<span>
|
|
|
- <template v-for="(word, indexsss) in itemss.texts">
|
|
|
+ <template v-for="(word, indexsss) in itemss.text">
|
|
|
<span
|
|
|
+ v-if="word.isShow"
|
|
|
class="hanzi"
|
|
|
:key="indexsss + 'word'"
|
|
|
:style="{
|
|
|
@@ -379,72 +465,21 @@
|
|
|
>{{ word.word }}</span>
|
|
|
</template>
|
|
|
</span>
|
|
|
- </span>
|
|
|
- </span>
|
|
|
-
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- <span :class="['word']">
|
|
|
- <!-- <template v-if="word.isShow"> -->
|
|
|
- <span class="text">
|
|
|
- <template v-if="pinyinShow">
|
|
|
- <span
|
|
|
- :class="['pinyin']"
|
|
|
- :style="{
|
|
|
- fontSize: pinyinFontsize + 'px',
|
|
|
- lineHeight: pinyinLineHeight + 'px',
|
|
|
- }"
|
|
|
- >
|
|
|
- {{ itemss.pinyinStr }}
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- <br v-if="pinyinShow" />
|
|
|
- <span>
|
|
|
- <template v-for="(word, indexsss) in itemss.text">
|
|
|
+ <br v-if="pinyinShow" />
|
|
|
+ <template v-if="pinyinShow&&pinyinBottom">
|
|
|
<span
|
|
|
- v-if="word.isShow"
|
|
|
- class="hanzi"
|
|
|
- :key="indexsss + 'word'"
|
|
|
- :style="{
|
|
|
- fontSize: wordFontsize + 'px',
|
|
|
- lineHeight: wordLineHeight + 'px',
|
|
|
- background: word.color ? word.color : '',
|
|
|
- color: word.color
|
|
|
- ? '#000'
|
|
|
- : !xifen
|
|
|
- ? leftNavIndex == 0
|
|
|
- ? seleLevelMapList.indexOf(word.levels.P_G) != -1
|
|
|
- ? levelMap[word.levels.P_G].color
|
|
|
- : '#000'
|
|
|
- : leftNavIndex == 1
|
|
|
- ? seleLevelMapList.indexOf(word.levels.W_G) != -1
|
|
|
- ? levelMap[word.levels.W_G].color
|
|
|
- : '#000'
|
|
|
- : leftNavIndex == 2
|
|
|
- ? seleLevelMapList.indexOf(word.levels.C_G) != -1
|
|
|
- ? levelMap[word.levels.C_G].color
|
|
|
- : '#000'
|
|
|
- : '#000'
|
|
|
- : leftNavIndex == 0
|
|
|
- ? seleLevelMapList.indexOf(word.levels.P_L) != -1
|
|
|
- ? levelMap[word.levels.P_L].color
|
|
|
- : '#000'
|
|
|
- : leftNavIndex == 1
|
|
|
- ? seleLevelMapList.indexOf(word.levels.W_L) != -1
|
|
|
- ? levelMap[word.levels.W_L].color
|
|
|
- : '#000'
|
|
|
- : leftNavIndex == 2
|
|
|
- ? seleLevelMapList.indexOf(word.levels.C_L) != -1
|
|
|
- ? levelMap[word.levels.C_L].color
|
|
|
- : '#000'
|
|
|
- : '#000',
|
|
|
- }"
|
|
|
- >{{ word.word }}</span>
|
|
|
+ :class="['pinyin']"
|
|
|
+ :style="{
|
|
|
+ fontSize: pinyinFontsize + 'px',
|
|
|
+ lineHeight: pinyinLineHeight + 'px',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ {{ itemss.pinyinStr }}
|
|
|
+ </span>
|
|
|
</template>
|
|
|
</span>
|
|
|
- </span>
|
|
|
<span class="texts">
|
|
|
- <template v-if="pinyinShow">
|
|
|
+ <template v-if="pinyinShow&&!pinyinBottom">
|
|
|
<span
|
|
|
:class="['pinyin']"
|
|
|
:style="{
|
|
|
@@ -498,6 +533,18 @@
|
|
|
>{{ word.word }}</span>
|
|
|
</template>
|
|
|
</span>
|
|
|
+ <br v-if="pinyinShow" />
|
|
|
+ <template v-if="pinyinShow&&pinyinBottom">
|
|
|
+ <span
|
|
|
+ :class="['pinyin']"
|
|
|
+ :style="{
|
|
|
+ fontSize: pinyinFontsize + 'px',
|
|
|
+ lineHeight: pinyinLineHeight + 'px',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <!-- {{ itemss.pinyinStr }} -->
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
</span>
|
|
|
<!-- </template> -->
|
|
|
</span>
|
|
|
@@ -509,7 +556,7 @@
|
|
|
<span class="word" :style="{padding: `0 ${wordsMargin<3?'1':wordsMargin>5?'2':wordsMargin-2}px`}">
|
|
|
<span class="text">
|
|
|
<span
|
|
|
- v-if="pinyinShow"
|
|
|
+ v-if="pinyinShow&&!pinyinBottom"
|
|
|
:class="['pinyin']"
|
|
|
:style="{
|
|
|
fontSize: pinyinFontsize + 'px',
|
|
|
@@ -562,9 +609,20 @@
|
|
|
>{{ word.word }}</span>
|
|
|
</template>
|
|
|
</span>
|
|
|
+ <br v-if="pinyinShow" />
|
|
|
+ <span
|
|
|
+ v-if="pinyinShow&&pinyinBottom"
|
|
|
+ :class="['pinyin']"
|
|
|
+ :style="{
|
|
|
+ fontSize: pinyinFontsize + 'px',
|
|
|
+ lineHeight: pinyinLineHeight + 'px',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ {{ itemss.pinyin_lt }}
|
|
|
+ </span>
|
|
|
</span>
|
|
|
<span class="texts">
|
|
|
- <template v-if="pinyinShow">
|
|
|
+ <template v-if="pinyinShow&&!pinyinBottom">
|
|
|
<span
|
|
|
:class="['pinyin']"
|
|
|
:style="{
|
|
|
@@ -618,14 +676,88 @@
|
|
|
>{{ word.word }}</span>
|
|
|
</template>
|
|
|
</span>
|
|
|
+ <br v-if="pinyinShow" />
|
|
|
+ <template v-if="pinyinShow&&pinyinBottom">
|
|
|
+ <span
|
|
|
+ :class="['pinyin']"
|
|
|
+ :style="{
|
|
|
+ fontSize: pinyinFontsize + 'px',
|
|
|
+ lineHeight: pinyinLineHeight + 'px',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <!-- {{ itemss.pinyinStr }} -->
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
</span>
|
|
|
</span>
|
|
|
</template>
|
|
|
<template v-else>
|
|
|
<span v-for="(word, indexsss) in itemss.text" :key="indexsss + 'word'" class="word" :style="{padding: word.isShow ? `0 ${wordsMargin<3?'1':wordsMargin>5?'2':wordsMargin-2}px`:'',display:'initial'}">
|
|
|
- <template v-if="word.isShow">
|
|
|
+ <template v-if="word.isShow">
|
|
|
+ <span
|
|
|
+ v-if="pinyinShow&&!pinyinBottom"
|
|
|
+ :class="['pinyin']"
|
|
|
+ :style="{
|
|
|
+ fontSize: pinyinFontsize + 'px',
|
|
|
+ lineHeight: pinyinLineHeight + 'px',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ {{ word.pinyin }}
|
|
|
+ </span>
|
|
|
+ <br v-if="pinyinShow" />
|
|
|
+ <span
|
|
|
+ class="hanzi"
|
|
|
+ :style="{
|
|
|
+ fontSize: wordFontsize + 'px',
|
|
|
+ lineHeight: wordLineHeight + 'px',
|
|
|
+ background: word.color ? word.color : '',
|
|
|
+ color: word.color
|
|
|
+ ? '#000'
|
|
|
+ : !xifen
|
|
|
+ ? leftNavIndex == 0
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.P_G) != -1
|
|
|
+ ? levelMap[word.levels.P_G].color
|
|
|
+ : '#000'
|
|
|
+ : leftNavIndex == 1
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.W_G) != -1
|
|
|
+ ? levelMap[word.levels.W_G].color
|
|
|
+ : '#000'
|
|
|
+ : leftNavIndex == 2
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.C_G) != -1
|
|
|
+ ? levelMap[word.levels.C_G].color
|
|
|
+ : '#000'
|
|
|
+ : '#000'
|
|
|
+ : leftNavIndex == 0
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.P_L) != -1
|
|
|
+ ? levelMap[word.levels.P_L].color
|
|
|
+ : '#000'
|
|
|
+ : leftNavIndex == 1
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.W_L) != -1
|
|
|
+ ? levelMap[word.levels.W_L].color
|
|
|
+ : '#000'
|
|
|
+ : leftNavIndex == 2
|
|
|
+ ? seleLevelMapList.indexOf(word.levels.C_L) != -1
|
|
|
+ ? levelMap[word.levels.C_L].color
|
|
|
+ : '#000'
|
|
|
+ : '#000',
|
|
|
+ }"
|
|
|
+ >{{ word.word }}</span>
|
|
|
+ <br v-if="pinyinShow" />
|
|
|
+ <span
|
|
|
+ v-if="pinyinShow&&pinyinBottom"
|
|
|
+ :class="['pinyin']"
|
|
|
+ :style="{
|
|
|
+ fontSize: pinyinFontsize + 'px',
|
|
|
+ lineHeight: pinyinLineHeight + 'px',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ {{ word.pinyin }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </span>
|
|
|
+ <span v-for="(word, indexsss) in itemss.texts" :key="indexsss + 'words'" class="word" :style="{display:'initial'}">
|
|
|
<span
|
|
|
- v-if="pinyinShow"
|
|
|
+ v-if="pinyinShow&&!pinyinBottom"
|
|
|
:class="['pinyin']"
|
|
|
:style="{
|
|
|
fontSize: pinyinFontsize + 'px',
|
|
|
@@ -672,11 +804,9 @@
|
|
|
: '#000',
|
|
|
}"
|
|
|
>{{ word.word }}</span>
|
|
|
- </template>
|
|
|
- </span>
|
|
|
- <span v-for="(word, indexsss) in itemss.texts" :key="indexsss + 'words'" class="word" :style="{display:'initial'}">
|
|
|
+ <br v-if="pinyinShow" />
|
|
|
<span
|
|
|
- v-if="pinyinShow"
|
|
|
+ v-if="pinyinShow&&pinyinBottom"
|
|
|
:class="['pinyin']"
|
|
|
:style="{
|
|
|
fontSize: pinyinFontsize + 'px',
|
|
|
@@ -685,44 +815,6 @@
|
|
|
>
|
|
|
{{ word.pinyin }}
|
|
|
</span>
|
|
|
- <br v-if="pinyinShow" />
|
|
|
- <span
|
|
|
- class="hanzi"
|
|
|
- :style="{
|
|
|
- fontSize: wordFontsize + 'px',
|
|
|
- lineHeight: wordLineHeight + 'px',
|
|
|
- background: word.color ? word.color : '',
|
|
|
- color: word.color
|
|
|
- ? '#000'
|
|
|
- : !xifen
|
|
|
- ? leftNavIndex == 0
|
|
|
- ? seleLevelMapList.indexOf(word.levels.P_G) != -1
|
|
|
- ? levelMap[word.levels.P_G].color
|
|
|
- : '#000'
|
|
|
- : leftNavIndex == 1
|
|
|
- ? seleLevelMapList.indexOf(word.levels.W_G) != -1
|
|
|
- ? levelMap[word.levels.W_G].color
|
|
|
- : '#000'
|
|
|
- : leftNavIndex == 2
|
|
|
- ? seleLevelMapList.indexOf(word.levels.C_G) != -1
|
|
|
- ? levelMap[word.levels.C_G].color
|
|
|
- : '#000'
|
|
|
- : '#000'
|
|
|
- : leftNavIndex == 0
|
|
|
- ? seleLevelMapList.indexOf(word.levels.P_L) != -1
|
|
|
- ? levelMap[word.levels.P_L].color
|
|
|
- : '#000'
|
|
|
- : leftNavIndex == 1
|
|
|
- ? seleLevelMapList.indexOf(word.levels.W_L) != -1
|
|
|
- ? levelMap[word.levels.W_L].color
|
|
|
- : '#000'
|
|
|
- : leftNavIndex == 2
|
|
|
- ? seleLevelMapList.indexOf(word.levels.C_L) != -1
|
|
|
- ? levelMap[word.levels.C_L].color
|
|
|
- : '#000'
|
|
|
- : '#000',
|
|
|
- }"
|
|
|
- >{{ word.word }}</span>
|
|
|
</span>
|
|
|
</template>
|
|
|
</template>
|
|
|
@@ -772,6 +864,7 @@ export default {
|
|
|
wordsMargin: 3,
|
|
|
fenci: false,
|
|
|
pinyinShow: false,
|
|
|
+ pinyinBottom: false, // 拼音在下
|
|
|
leftNavIndex: 2,
|
|
|
leftList: null,
|
|
|
colorValue: '#FF3737',
|
natasha