文章主题色

src/views/book/courseware/preview/components/article/NormalModelChs.vue

@@ -32,21 +32,15 @@
           icon-class="pin-btn"
           size="16"
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changePinyin"
         />
-        <!-- <span
-          :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
-          @click="changePinyin"
-          v-if="config.isHasPY"
-        ></span> -->
-        <!-- <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
           v-if="config.isHasEN"
           icon-class="en-btn"
           size="16"
           :class="['EN-16', config.isShowEN ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changeEN"
         />
       </div>
@@ -922,24 +916,18 @@
       <div class="aduioLine-right">
         <SvgIcon
           v-if="config.isHasPY"
-          icon-class="PinYin"
+          icon-class="pin-btn"
           size="16"
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changePinyin"
         />
-        <!-- <span
-          :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
-          @click="changePinyin"
-          v-if="config.isHasPY"
-        ></span> -->
-        <!-- <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
           v-if="config.isHasEN"
-          icon-class="PinYin"
+          icon-class="en-btn"
           size="16"
           :class="['EN-16', config.isShowEN ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changeEN"
         />
       </div>
@@ -969,7 +957,7 @@ export default {
     AudioLine,
     Notecard,
   },
-  props: ['curQue', 'noFont', 'config', 'NNPEAnnotationList', 'colLength', 'themeColor', 'multilingual'],
+  props: ['curQue', 'noFont', 'config', 'NNPEAnnotationList', 'colLength', 'themeColor', 'multilingual', 'attrib'],
   data() {
     return {
       resArr: [],

src/views/book/courseware/preview/components/article/PhraseModelChs.vue

@@ -31,18 +31,18 @@
         <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
           v-if="config.isHasPY"
-          icon-class="PinYin"
+          icon-class="pin-btn"
           size="16"
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changePinyin"
         />
         <SvgIcon
           v-if="config.isHasEN"
-          icon-class="PinYin"
+          icon-class="en-btn"
           size="16"
           :class="['EN-16', config.isShowEN ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changeEN"
         />
       </div>
@@ -625,18 +625,18 @@
         <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
           v-if="config.isHasPY"
-          icon-class="PinYin"
+          icon-class="pin-btn"
           size="16"
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changePinyin"
         />
         <SvgIcon
           v-if="config.isHasEN"
-          icon-class="PinYin"
+          icon-class="en-btn"
           size="16"
           :class="['EN-16', config.isShowEN ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changeEN"
         />
       </div>
@@ -708,6 +708,7 @@ export default {
     'NNPEAnnotationList',
     'colLength',
     'multilingual',
+    'attrib',
   ],
   data() {
     return {

src/views/book/courseware/preview/components/article/Practicechs.vue

@@ -29,34 +29,35 @@
         </template>
       </div>
       <div class="aduioLine-right">
-        <!-- <span :class="['Repeat-16', isRepeat ? '' : 'disabled']" @click="changeRepeat"></span>
-        <span
-          :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
-          @click="changePinyin"
-          v-if="config.isHasPY"
-        ></span>
-        <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
-          icon-class="repeat"
+          v-if="config.isHasPY"
+          icon-class="repeat-1"
           size="16"
           :class="['Repeat-16', isRepeat ? '' : 'disabled']"
-          :style="{ color: isRepeat ? themeColor : 'rgba(0,0,0,0.1)' }"
+          :style="{ color: isRepeat ? (attrib ? attrib.topic_color : '') : '#DCDFE6', cursor: 'pointer' }"
           @click="changeRepeat"
         />
+        <!-- <span
+          :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
+          @click="changePinyin"
+          v-if="config.isHasPY"
+        ></span>
+        <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
           v-if="config.isHasPY"
-          icon-class="PinYin"
+          icon-class="pin-btn"
           size="16"
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changePinyin"
         />
+        <!-- <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
           v-if="config.isHasEN"
-          icon-class="PinYin"
+          icon-class="en-btn"
           size="16"
           :class="['EN-16', config.isShowEN ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changeEN"
         />
       </div>
@@ -461,26 +462,34 @@
         ></span>
         <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
-          icon-class="repeat"
+          v-if="config.isHasPY"
+          icon-class="repeat-1"
           size="16"
           :class="['Repeat-16', isRepeat ? '' : 'disabled']"
-          :style="{ color: isRepeat ? themeColor : 'rgba(0,0,0,0.1)' }"
+          :style="{ color: isRepeat ? (attrib ? attrib.topic_color : '') : '#DCDFE6', cursor: 'pointer' }"
           @click="changeRepeat"
         />
+        <!-- <span
+          :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
+          @click="changePinyin"
+          v-if="config.isHasPY"
+        ></span>
+        <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
           v-if="config.isHasPY"
-          icon-class="PinYin"
+          icon-class="pin-btn"
           size="16"
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changePinyin"
         />
+        <!-- <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
           v-if="config.isHasEN"
-          icon-class="PinYin"
+          icon-class="en-btn"
           size="16"
           :class="['EN-16', config.isShowEN ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changeEN"
         />
       </div>
@@ -532,6 +541,7 @@ export default {
     'colLength',
     'isFull',
     'multilingual',
+    'attrib',
   ],
   data() {
     return {

src/views/book/courseware/preview/components/article/Voicefullscreen.vue

@@ -611,6 +611,7 @@ export default {
     'config',
     'TaskModel',
     'NpcNewWordMp3',
+    'attrib',
   ],
   data() {
     return {

src/views/book/courseware/preview/components/article/WordModelChs.vue

@@ -31,18 +31,18 @@
         <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
           v-if="config.isHasPY"
-          icon-class="PinYin"
+          icon-class="pin-btn"
           size="16"
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changePinyin"
         />
         <SvgIcon
           v-if="config.isHasEN"
-          icon-class="PinYin"
+          icon-class="en-btn"
           size="16"
           :class="['EN-16', config.isShowEN ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changeEN"
         />
       </div>
@@ -597,18 +597,18 @@
         <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
         <SvgIcon
           v-if="config.isHasPY"
-          icon-class="PinYin"
+          icon-class="pin-btn"
           size="16"
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changePinyin"
         />
         <SvgIcon
           v-if="config.isHasEN"
-          icon-class="PinYin"
+          icon-class="en-btn"
           size="16"
           :class="['EN-16', config.isShowEN ? '' : 'disabled']"
-          :style="{ color: themeColor }"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changeEN"
         />
       </div>
@@ -662,6 +662,7 @@ export default {
     'colLength',
     'noFont',
     'multilingual',
+    'attrib',
   ],
   data() {
     return {

src/views/book/courseware/preview/components/article/index.vue

@@ -81,6 +81,7 @@
             :col-length="colLength"
             @changeConfig="changeConfig"
             :multilingual="showLang && getLang() ? getLang() : ''"
+            :attrib="data.unified_attrib"
           />
           <PhraseModel
             v-if="showPhrases"
@@ -99,6 +100,7 @@
             :NpcNewWordMp3="NpcNewWordMp3"
             @changeConfig="changeConfig"
             :multilingual="showLang && getLang() ? getLang() : ''"
+            :attrib="data.unified_attrib"
           />
           <Practice
             v-if="showPractice"
@@ -116,6 +118,7 @@
             :is-full="isFull"
             @changeConfig="changeConfig"
             :multilingual="showLang && getLang() ? getLang() : ''"
+            :attrib="data.unified_attrib"
           />
           <WordModel
             v-if="showWord"
@@ -133,6 +136,7 @@
             :col-length="colLength"
             @changeConfig="changeConfig"
             :multilingual="showLang && getLang() ? getLang() : ''"
+            :attrib="data.unified_attrib"
           />
         </div>
         <div :id="'screen-' + mathNum" class="voice-full-screen">
@@ -155,6 +159,7 @@
             @changeEN="changeENs"
             @exitFullscreen="exitFullscreen"
             @changeIsFull="changeIsFull"
+            :attrib="data.unified_attrib"
           />
         </div>
       </div>
@@ -727,6 +732,8 @@ export default {
   }
 
   .pinyin-16 {
+    cursor: pointer;
+
     // background: url('@/assets/icon/pinyin-16-normal-red.png') no-repeat left top;
     // background-size: 100% 100%;
 
@@ -737,6 +744,8 @@ export default {
   }
 
   .EN-16 {
+    cursor: pointer;
+
     // background: url('@/assets/icon/EN-16-normal-red.png') no-repeat left top;
     // background-size: 100% 100%;
 

src/views/book/courseware/preview/components/dialogue_article/NormalModelChs.vue

@@ -520,12 +520,22 @@
         </template>
       </div>
       <div class="aduioLine-right">
-        <span
+        <SvgIcon
+          v-if="config.isHasPY"
+          icon-class="pin-btn"
+          size="16"
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changePinyin"
-          v-if="config.isHasPY"
-        ></span>
-        <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span>
+        />
+        <SvgIcon
+          v-if="config.isHasEN"
+          icon-class="en-btn"
+          size="16"
+          :class="['EN-16', config.isShowEN ? '' : 'disabled']"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
+          @click="changeEN"
+        />
       </div>
     </div>
     <template v-if="isNoteShow">

src/views/book/courseware/preview/components/dialogue_article/PhraseModelChs.vue

@@ -370,12 +370,22 @@
         </template>
       </div>
       <div class="aduioLine-right">
-        <span
+        <SvgIcon
+          v-if="config.isHasPY"
+          icon-class="pin-btn"
+          size="16"
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changePinyin"
-          v-if="config.isHasPY"
-        ></span>
-        <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span>
+        />
+        <SvgIcon
+          v-if="config.isHasEN"
+          icon-class="en-btn"
+          size="16"
+          :class="['EN-16', config.isShowEN ? '' : 'disabled']"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
+          @click="changeEN"
+        />
       </div>
     </div>
     <template v-if="isShow">

src/views/book/courseware/preview/components/dialogue_article/Practicechs.vue

@@ -30,7 +30,15 @@
         </template>
       </div>
       <div class="aduioLine-right">
-        <span :class="['Repeat-16', isRepeat ? '' : 'disabled']" @click="changeRepeat"></span>
+        <!-- <span :class="['Repeat-16', isRepeat ? '' : 'disabled']" @click="changeRepeat"></span> -->
+        <SvgIcon
+          v-if="config.isHasPY"
+          icon-class="repeat-1"
+          size="16"
+          :class="['Repeat-16', isRepeat ? '' : 'disabled']"
+          :style="{ color: isRepeat ? (attrib ? attrib.topic_color : '') : '#DCDFE6', cursor: 'pointer' }"
+          @click="changeRepeat"
+        />
         <!-- <span
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
           @click="changePinyin"
@@ -537,13 +545,37 @@
         </template>
       </div>
       <div class="aduioLine-right">
-        <span :class="['Repeat-16', isRepeat ? '' : 'disabled']" @click="changeRepeat"></span>
-        <span
+        <SvgIcon
+          v-if="config.isHasPY"
+          icon-class="repeat-1"
+          size="16"
+          :class="['Repeat-16', isRepeat ? '' : 'disabled']"
+          :style="{ color: isRepeat ? (attrib ? attrib.topic_color : '') : '#DCDFE6', cursor: 'pointer' }"
+          @click="changeRepeat"
+        />
+        <!-- <span
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
           @click="changePinyin"
           v-if="config.isHasPY"
         ></span>
-        <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span>
+        <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
+        <SvgIcon
+          v-if="config.isHasPY"
+          icon-class="pin-btn"
+          size="16"
+          :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
+          @click="changePinyin"
+        />
+        <!-- <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span> -->
+        <SvgIcon
+          v-if="config.isHasEN"
+          icon-class="en-btn"
+          size="16"
+          :class="['EN-16', config.isShowEN ? '' : 'disabled']"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
+          @click="changeEN"
+        />
       </div>
     </div>
     <div class="voice-full-screen" :id="'screen-' + mathNum">

src/views/book/courseware/preview/components/dialogue_article/WordModelChs.vue

@@ -352,12 +352,22 @@
         </template>
       </div>
       <div class="aduioLine-right">
-        <span
+        <SvgIcon
+          v-if="config.isHasPY"
+          icon-class="pin-btn"
+          size="16"
           :class="['pinyin-16', config.isShowPY ? '' : 'disabled']"
+          :style="{ color: config.isShowPY ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
           @click="changePinyin"
-          v-if="config.isHasPY"
-        ></span>
-        <span :class="['EN-16', config.isShowEN ? '' : 'disabled']" @click="changeEN" v-if="config.isHasEN"></span>
+        />
+        <SvgIcon
+          v-if="config.isHasEN"
+          icon-class="en-btn"
+          size="16"
+          :class="['EN-16', config.isShowEN ? '' : 'disabled']"
+          :style="{ color: config.isShowEN ? (attrib ? attrib.topic_color : '') : '#DCDFE6' }"
+          @click="changeEN"
+        />
       </div>
     </div>
     <template v-if="isShow">

src/views/book/courseware/preview/components/dialogue_article/index.vue

@@ -145,6 +145,7 @@
             @exitFullscreen="exitFullscreen"
             @changeIsFull="changeIsFull"
             :NpcNewWordMp3="NpcNewWordMp3"
+            :attrib="data.unified_attrib"
           />
         </div>
       </div>