WordPhrase

src/components/Adult/preview/WordPhrase.vue

@@ -59,8 +59,14 @@
                     :src="sItem.mp3_list[0].url"
                   ></audio>
                 </template>
-
-                <span class="tabNum" v-if="sIndex == 0">{{ index + 1 }}.</span>
+                <template v-else>
+                  <span style="width: 24px; height: 24px"></span>
+                </template>
+                <span class="tabNum"
+                  ><template v-if="sIndex == 0"
+                    >{{ index + 1 }}.</template
+                  ></span
+                >
 
                 <span class="NPC-word-tab-common NPC-word-tab-pinyin">
                   {{ sItem.pinyin }}
@@ -68,8 +74,8 @@
                 <span class="NPC-word-tab-common NPC-word-tab-word">
                   {{ sItem.new_word }}
                 </span>
-                <span class="NPC-word-tab-common NPC-word-tab-def">
-                  {{ sItem.speech }}
+                <span class="NPC-word-tab-common NPC-word-tab-cixing">
+                  {{ sItem.cixing }}
                 </span>
                 <span
                   class="NPC-word-tab-common NPC-word-tab-def"
@@ -307,9 +313,15 @@ export default {
     if (this.curQue.type == "NewWord_chs") {
       this.curQue.option.forEach((item, index) => {
         item.index = index + 1;
-        item.def_str = item.definition_list.join("；");
+        item.forEach((sItem, sIndex) => {
+          sItem.def_str =
+            sItem.definition_list.length > 0
+              ? sItem.definition_list.join("；")
+              : "";
+        });
       });
     }
+    console.log(this.curQue);
   },
   //生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {
@@ -400,19 +412,29 @@ export default {
   .NPC-word-table {
     width: 100%;
     > .NPC-word-tr {
-      padding: 8px 16px;
+      background: #fff;
+      border-radius: 8px;
+      padding: 8px 16px 0px 16px;
+      margin-bottom: 8px;
       .NPC-word-row {
         cursor: pointer;
         display: flex;
         justify-content: flex-start;
+        padding-bottom: 8px;
         > span {
           font-size: 16px;
           line-height: 150%;
           color: #000000;
         }
       }
+      .tabNum {
+        width: 28px;
+        text-align: right;
+        margin-left: 4px;
+      }
       .NPC-word-tab-common {
         padding-left: 8px;
+        width: 112px;
       }
       .NPC-word-tab-pinyin {
         font-family: "GB-PINYINOK-B";
@@ -422,7 +444,12 @@ export default {
         font-family: "sourceR";
         white-space: nowrap;
       }
+      .NPC-word-tab-cixing {
+        font-family: "robot";
+        width: 40px;
+      }
       .NPC-word-tab-def {
+        width: 284px;
         font-family: "robot";
         word-break: break-word;
       }