对话练习

src/components/Adult/preview/DialogueArticleViewChs/DialogueAnswerViewChs.vue

@@ -46,46 +46,44 @@
             <span class="number" v-if="item.number && !isPhone">{{
               item.number
             }}</span>
-            <div class="dialogue-item">
-              <div
-                class="dialogue-img"
-                v-if="item.img_list && item.img_list.length > 0"
-              >
-                <el-image
-                  :style="{
-                    width: isPhone ? '110px' : '196px',
-                    height: isPhone ? '120px' : '164px'
-                  }"
-                  :src="item.img_list[0].id"
-                  fit="scale-down"
-                  :preview-src-list="[item.img_list[0].id]"
-                ></el-image>
-              </div>
-              <div class="dialogue-answer-model">
-                <AnswerModel
-                  :curQue="item"
-                  :Bookanswer="curQue.Bookanswer[index]"
-                  :pyPosition="curQue.pyPosition"
-                  :enPosition="curQue.enPosition"
-                  :colorBox="colorBox"
-                  :TaskModel="TaskModel"
-                  :listIndex="index"
-                  :judgeAnswer="judgeAnswer"
-                  :audioWidth="item.number ? 592 : 620"
-                />
-              </div>
-              <template
-                v-if="
-                  curQue.option &&
-                    curQue.option.length > 0 &&
-                    curQue.option[index] &&
-                    curQue.option[index].detail &&
-                    curQue.option[index].detail.length > 0
-                "
-              >
-                <OptionModel :curOption="curQue.option[index]" :index="index" />
-              </template>
+            <div
+              class="dialogue-img"
+              v-if="item.img_list && item.img_list.length > 0"
+            >
+              <el-image
+                :style="{
+                  width: isPhone ? '110px' : '196px',
+                  height: isPhone ? '120px' : '164px'
+                }"
+                :src="item.img_list[0].id"
+                fit="scale-down"
+                :preview-src-list="[item.img_list[0].id]"
+              ></el-image>
             </div>
+            <div class="dialogue-answer-model">
+              <AnswerModel
+                :curQue="item"
+                :Bookanswer="curQue.Bookanswer[index]"
+                :pyPosition="curQue.pyPosition"
+                :enPosition="curQue.enPosition"
+                :colorBox="colorBox"
+                :TaskModel="TaskModel"
+                :listIndex="index"
+                :judgeAnswer="judgeAnswer"
+                :audioWidth="item.number ? 592 : 620"
+              />
+            </div>
+            <template
+              v-if="
+                curQue.option &&
+                  curQue.option.length > 0 &&
+                  curQue.option[index] &&
+                  curQue.option[index].detail &&
+                  curQue.option[index].detail.length > 0
+              "
+            >
+              <OptionModel :curOption="curQue.option[index]" :index="index" />
+            </template>
           </div>
         </div>
       </el-collapse-transition>
@@ -100,59 +98,57 @@
         >
           <template v-if="isShowQue(index)">
             <span class="number" v-if="item.number">{{ item.number }}</span>
-            <div class="dialogue-item">
-              <div
-                class="dialogue-img"
-                v-if="item.img_list && item.img_list.length > 0"
-              >
-                <el-image
-                  :style="{
-                    width: isPhone ? '110px' : '196px',
-                    height: isPhone ? '120px' : '164px'
-                  }"
-                  :src="item.img_list[0].id"
-                  fit="scale-down"
-                  :preview-src-list="[item.img_list[0].id]"
-                ></el-image>
-              </div>
-              <div class="dialogue-answer-model">
-                <AnswerModel
-                  :curQue="item"
-                  :Bookanswer="curQue.Bookanswer[index]"
-                  :pyPosition="curQue.pyPosition"
-                  :enPosition="curQue.enPosition"
-                  :colorBox="colorBox"
-                  :listIndex="index"
-                  :TaskModel="TaskModel"
-                  :judgeAnswer="judgeAnswer"
-                  :audioWidth="item.number ? 592 : 620"
-                />
-              </div>
-              <template
-                v-if="
-                  curQue.option &&
-                    curQue.option.length > 0 &&
-                    curQue.option[index] &&
-                    curQue.option[index].detail &&
-                    curQue.option[index].detail.length > 0
-                "
-              >
-                <OptionModel :curOption="curQue.option[index]" :index="index" />
-              </template>
-              <template
-                v-if="
-                  curQue.wordcard &&
-                    curQue.wordcard.length > 0 &&
-                    curQue.wordcard[index]
-                "
-              >
-                <WordcardModel
-                  :curWordcard="curQue.wordcard[index]"
-                  :index="index"
-                  :pyPosition="curQue.pyPosition"
-                />
-              </template>
+            <div
+              class="dialogue-img"
+              v-if="item.img_list && item.img_list.length > 0"
+            >
+              <el-image
+                :style="{
+                  width: isPhone ? '110px' : '196px',
+                  height: isPhone ? '120px' : '164px'
+                }"
+                :src="item.img_list[0].id"
+                fit="scale-down"
+                :preview-src-list="[item.img_list[0].id]"
+              ></el-image>
+            </div>
+            <div class="dialogue-answer-model">
+              <AnswerModel
+                :curQue="item"
+                :Bookanswer="curQue.Bookanswer[index]"
+                :pyPosition="curQue.pyPosition"
+                :enPosition="curQue.enPosition"
+                :colorBox="colorBox"
+                :listIndex="index"
+                :TaskModel="TaskModel"
+                :judgeAnswer="judgeAnswer"
+                :audioWidth="item.number ? 592 : 620"
+              />
             </div>
+            <template
+              v-if="
+                curQue.option &&
+                  curQue.option.length > 0 &&
+                  curQue.option[index] &&
+                  curQue.option[index].detail &&
+                  curQue.option[index].detail.length > 0
+              "
+            >
+              <OptionModel :curOption="curQue.option[index]" :index="index" />
+            </template>
+            <template
+              v-if="
+                curQue.wordcard &&
+                  curQue.wordcard.length > 0 &&
+                  curQue.wordcard[index]
+              "
+            >
+              <WordcardModel
+                :curWordcard="curQue.wordcard[index]"
+                :index="index"
+                :pyPosition="curQue.pyPosition"
+              />
+            </template>
           </template>
         </div>
       </div>