Browse Source

字词卡片移动端

natasha 2 weeks ago
parent
commit
3e2079ae7a

+ 1 - 0
src/views/book/courseware/preview/components/article/NormalModelChs.vue

@@ -1179,6 +1179,7 @@
         :style="{
         :style="{
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           left: windowWidth > 642 ? '' : '0px',
           left: windowWidth > 642 ? '' : '0px',
+          width: isMobile ? '100%' : '',
         }"
         }"
       >
       >
         <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" :isMobile="isMobile" />
         <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" :isMobile="isMobile" />

+ 4 - 2
src/views/book/courseware/preview/components/article/PhraseModelChs.vue

@@ -867,6 +867,7 @@
           :bg="activeWord ? activeWord.bg : null"
           :bg="activeWord ? activeWord.bg : null"
           :ed="activeWord ? activeWord.ed : null"
           :ed="activeWord ? activeWord.ed : null"
           :attrib="attrib"
           :attrib="attrib"
+          :isMobile="isMobile"
           @changeCurQue="changeCurQue"
           @changeCurQue="changeCurQue"
         />
         />
       </div>
       </div>
@@ -878,9 +879,10 @@
         :style="{
         :style="{
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           left: windowWidth > 642 ? '' : '0px',
           left: windowWidth > 642 ? '' : '0px',
+          width: isMobile ? '100%' : '',
         }"
         }"
       >
       >
-        <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" />
+        <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" :isMobile="isMobile" />
       </div>
       </div>
     </template>
     </template>
   </div>
   </div>
@@ -890,7 +892,6 @@
 import AudioLine from '../voice_matrix/components/AudioLine.vue';
 import AudioLine from '../voice_matrix/components/AudioLine.vue';
 import Wordcard from './components/Wordcard.vue'; // 卡片
 import Wordcard from './components/Wordcard.vue'; // 卡片
 import Notecard from './components/Notecard.vue'; // 注释
 import Notecard from './components/Notecard.vue'; // 注释
-import $ from 'jquery';
 export default {
 export default {
   name: 'PhraseModelChs',
   name: 'PhraseModelChs',
   components: {
   components: {
@@ -911,6 +912,7 @@ export default {
     'colLength',
     'colLength',
     'multilingual',
     'multilingual',
     'attrib',
     'attrib',
+    'isMobile',
   ],
   ],
   data() {
   data() {
     return {
     return {

+ 5 - 1
src/views/book/courseware/preview/components/article/Voicefullscreen.vue

@@ -515,6 +515,8 @@
           :bg="wordbgs"
           :bg="wordbgs"
           :ed="wordeds"
           :ed="wordeds"
           :attrib="attrib"
           :attrib="attrib"
+          :isMobile="isMobile"
+          :isFull="true"
         />
         />
       </div>
       </div>
     </template>
     </template>
@@ -543,9 +545,10 @@
         :style="{
         :style="{
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           left: windowWidth > 642 ? '' : '0px',
           left: windowWidth > 642 ? '' : '0px',
+          width: isMobile ? '100%' : '',
         }"
         }"
       >
       >
-        <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" />
+        <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" :isMobile="isMobile" />
       </div>
       </div>
     </template>
     </template>
   </div>
   </div>
@@ -583,6 +586,7 @@ export default {
     'TaskModel',
     'TaskModel',
     'NpcNewWordMp3',
     'NpcNewWordMp3',
     'attrib',
     'attrib',
+    'isMobile',
   ],
   ],
   data() {
   data() {
     return {
     return {

+ 1 - 0
src/views/book/courseware/preview/components/article/WordModelChs.vue

@@ -824,6 +824,7 @@
           :TaskModel="TaskModel"
           :TaskModel="TaskModel"
           :write-list="curQue.Bookanswer.writeModel"
           :write-list="curQue.Bookanswer.writeModel"
           :attrib="attrib"
           :attrib="attrib"
+          :isMobile="isMobile"
           @changeCurQue="changeCurQue"
           @changeCurQue="changeCurQue"
         />
         />
       </div>
       </div>

+ 7 - 2
src/views/book/courseware/preview/components/article/components/Notecard.vue

@@ -1,6 +1,6 @@
 <!--  -->
 <!--  -->
 <template>
 <template>
-  <div v-if="item" class="NoteCard">
+  <div v-if="item" class="NoteCard" :class="[isMobile ? 'NoteCard-phone' : '']">
     <div class="closeBox">
     <div class="closeBox">
       <i class="el-icon-close" @click="changeCard(false)"></i>
       <i class="el-icon-close" @click="changeCard(false)"></i>
     </div>
     </div>
@@ -36,7 +36,7 @@
 <script>
 <script>
 export default {
 export default {
   components: {},
   components: {},
-  props: ['item', 'changeCard', 'attrib'],
+  props: ['item', 'changeCard', 'attrib', 'isMobile'],
   data() {
   data() {
     return {};
     return {};
   },
   },
@@ -150,5 +150,10 @@ export default {
   :deep p {
   :deep p {
     margin: 0;
     margin: 0;
   }
   }
+
+  &-phone {
+    width: 100%;
+    margin: 0;
+  }
 }
 }
 </style>
 </style>

+ 6 - 3
src/views/book/courseware/preview/components/article/components/Wordcard.vue

@@ -239,6 +239,7 @@ export default {
     'bg',
     'bg',
     'ed',
     'ed',
     'attrib',
     'attrib',
+    'isMobile',
   ],
   ],
   data() {
   data() {
     return {
     return {
@@ -643,12 +644,14 @@ export default {
 
 
     > span {
     > span {
       width: 100%;
       width: 100%;
-      overflow: hidden;
+
+      // overflow: hidden;
       font-size: 14px;
       font-size: 14px;
       line-height: 22px;
       line-height: 22px;
       color: rgba(0, 0, 0, 85%);
       color: rgba(0, 0, 0, 85%);
-      text-overflow: ellipsis;
-      white-space: nowrap;
+
+      // text-overflow: ellipsis;
+      // white-space: nowrap;
 
 
       :deep p {
       :deep p {
         margin: 0;
         margin: 0;

+ 3 - 1
src/views/book/courseware/preview/components/dialogue_article/NormalModelChs.vue

@@ -690,9 +690,10 @@
         :style="{
         :style="{
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           left: windowWidth > 642 ? '' : '0px',
           left: windowWidth > 642 ? '' : '0px',
+          width: isMobile ? '100%' : '',
         }"
         }"
       >
       >
-        <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" />
+        <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" :isMobile="isMobile" />
       </div>
       </div>
     </template>
     </template>
   </div>
   </div>
@@ -751,6 +752,7 @@ export default {
     'isPhone',
     'isPhone',
     'multilingual',
     'multilingual',
     'attrib',
     'attrib',
+    'isMobile',
   ],
   ],
   data() {
   data() {
     return {
     return {

+ 6 - 4
src/views/book/courseware/preview/components/dialogue_article/PhraseModelChs.vue

@@ -18,7 +18,7 @@
             :mp3="curQue.mp3_list[0].url"
             :mp3="curQue.mp3_list[0].url"
             :get-cur-time="getCurTime"
             :get-cur-time="getCurTime"
             :mp3-source="curQue.mp3_list[0].source"
             :mp3-source="curQue.mp3_list[0].source"
-            :width="colLength == 2 ? 200 : isPhone ? 200 : 790"
+            :width="colLength == 2 ? 200 : isMobile ? 200 : 790"
             :attrib="attrib"
             :attrib="attrib"
           />
           />
         </template>
         </template>
@@ -455,7 +455,7 @@
             :mp3="curQue.mp3_list[0].url"
             :mp3="curQue.mp3_list[0].url"
             :get-cur-time="getCurTime"
             :get-cur-time="getCurTime"
             :mp3-source="curQue.mp3_list[0].source"
             :mp3-source="curQue.mp3_list[0].source"
-            :width="colLength == 2 ? 200 : isPhone ? 200 : 790"
+            :width="colLength == 2 ? 200 : isMobile ? 200 : 790"
             :attrib="attrib"
             :attrib="attrib"
           />
           />
         </template>
         </template>
@@ -504,6 +504,7 @@
           :bg="wordbgs"
           :bg="wordbgs"
           :ed="wordeds"
           :ed="wordeds"
           :attrib="attrib"
           :attrib="attrib"
+          :isMobile="isMobile"
           @changeCurQue="changeCurQue"
           @changeCurQue="changeCurQue"
         />
         />
       </div>
       </div>
@@ -515,9 +516,10 @@
         :style="{
         :style="{
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           left: windowWidth > 642 ? '' : '0px',
           left: windowWidth > 642 ? '' : '0px',
+          width: isMobile ? '100%' : '',
         }"
         }"
       >
       >
-        <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" />
+        <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" :isMobile="isMobile" />
       </div>
       </div>
     </template>
     </template>
   </div>
   </div>
@@ -578,7 +580,7 @@ export default {
     'TaskModel',
     'TaskModel',
     'colLength',
     'colLength',
     'NpcNewWordMp3',
     'NpcNewWordMp3',
-    'isPhone',
+    'isMobile',
     'multilingual',
     'multilingual',
   ],
   ],
   data() {
   data() {

+ 6 - 4
src/views/book/courseware/preview/components/dialogue_article/WordModelChs.vue

@@ -18,7 +18,7 @@
             :mp3="curQue.mp3_list[0].url"
             :mp3="curQue.mp3_list[0].url"
             :get-cur-time="getCurTime"
             :get-cur-time="getCurTime"
             :mp3-source="curQue.mp3_list[0].source"
             :mp3-source="curQue.mp3_list[0].source"
-            :width="colLength == 2 ? 200 : isPhone ? 200 : 790"
+            :width="colLength == 2 ? 200 : isMobile ? 200 : 790"
             :attrib="attrib"
             :attrib="attrib"
           />
           />
         </template>
         </template>
@@ -431,7 +431,7 @@
             :mp3="curQue.mp3_list[0].url"
             :mp3="curQue.mp3_list[0].url"
             :get-cur-time="getCurTime"
             :get-cur-time="getCurTime"
             :mp3-source="curQue.mp3_list[0].source"
             :mp3-source="curQue.mp3_list[0].source"
-            :width="colLength == 2 ? 200 : isPhone ? 200 : 790"
+            :width="colLength == 2 ? 200 : isMobile ? 200 : 790"
           />
           />
         </template>
         </template>
       </div>
       </div>
@@ -476,6 +476,7 @@
           :TaskModel="TaskModel"
           :TaskModel="TaskModel"
           :write-list="curQue.Bookanswer.writeModel"
           :write-list="curQue.Bookanswer.writeModel"
           :attrib="attrib"
           :attrib="attrib"
+          :isMobile="isMobile"
           @changeCurQue="changeCurQue"
           @changeCurQue="changeCurQue"
         />
         />
       </div>
       </div>
@@ -487,9 +488,10 @@
         :style="{
         :style="{
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           marginLeft: windowWidth > 642 ? '-321px' : '0px',
           left: windowWidth > 642 ? '' : '0px',
           left: windowWidth > 642 ? '' : '0px',
+          width: isMobile ? '100%' : '',
         }"
         }"
       >
       >
-        <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" />
+        <Notecard :item="curNoteCon" :change-card="changeCard" :attrib="attrib" :isMobile="isMobile" />
       </div>
       </div>
     </template>
     </template>
   </div>
   </div>
@@ -548,7 +550,7 @@ export default {
     'config',
     'config',
     'TaskModel',
     'TaskModel',
     'colLength',
     'colLength',
-    'isPhone',
+    'isMobile',
     'multilingual',
     'multilingual',
   ],
   ],
   data() {
   data() {