宽度问题，关键字加粗，loding问题。

src/components/Adult/preview/components/WordPhraseDetail.vue

@@ -685,11 +685,11 @@ export default {
                 });
             })
             .catch((err) => {
-              this.loading2 = false;
+              this.loading3 = false;
             });
         })
         .catch((err) => {
-          this.loading1 = false;
+          this.loading3 = false;
         });
     },
     // handleExample(list) {
@@ -751,10 +751,21 @@ export default {
             let sentence = JSON.parse(JSON.stringify(item.sentence));
             let arr = sentence.split("");
             arr.forEach((items, indexs) => {
-              if (indexs == item.begin_position) {
-                arr[
-                  indexs
-                ] = `<span style=color:#DE4444;>${arr[indexs]}</span>`;
+              if (item.end_position - item.begin_position > 1) {
+                if (
+                  indexs >= item.begin_position &&
+                  indexs < item.end_position
+                ) {
+                  arr[
+                    indexs
+                  ] = `<span style=color:#DE4444;font-weight:700;>${arr[indexs]}</span>`;
+                }
+              } else {
+                if (indexs == item.begin_position) {
+                  arr[
+                    indexs
+                  ] = `<span style=color:#DE4444;font-weight:700;>${arr[indexs]}</span>`;
+                }
               }
             });
             let data = this.changefiveword(arr, item.begin_position, type);
@@ -763,10 +774,21 @@ export default {
             let sentence = JSON.parse(JSON.stringify(item.sentence));
             let arr = sentence.split("");
             arr.forEach((items, indexs) => {
-              if (indexs == item.begin_position) {
-                arr[
-                  indexs
-                ] = `<span style=color:#DE4444;>${arr[indexs]}</span>`;
+              if (item.end_position - item.begin_position > 1) {
+                if (
+                  indexs >= item.begin_position &&
+                  indexs < item.end_position
+                ) {
+                  arr[
+                    indexs
+                  ] = `<span style=color:#DE4444;font-weight:700;>${arr[indexs]}</span>`;
+                }
+              } else {
+                if (indexs == item.begin_position) {
+                  arr[
+                    indexs
+                  ] = `<span style=color:#DE4444;font-weight:700;>${arr[indexs]}</span>`;
+                }
               }
             });
             let data = this.changefiveword(arr, item.begin_position, type);
@@ -775,10 +797,21 @@ export default {
             let sentence = JSON.parse(JSON.stringify(item.sentence));
             let arr = sentence.split("");
             arr.forEach((items, indexs) => {
-              if (indexs == item.begin_position) {
-                arr[
-                  indexs
-                ] = `<span style=color:#DE4444;>${arr[indexs]}</span>`;
+              if (item.end_position - item.begin_position > 1) {
+                if (
+                  indexs >= item.begin_position &&
+                  indexs < item.end_position
+                ) {
+                  arr[
+                    indexs
+                  ] = `<span style=color:#DE4444;font-weight:700;>${arr[indexs]}</span>`;
+                }
+              } else {
+                if (indexs == item.begin_position) {
+                  arr[
+                    indexs
+                  ] = `<span style=color:#DE4444;font-weight:700;>${arr[indexs]}</span>`;
+                }
               }
             });
             let data = this.changefiveword(arr, item.begin_position, type);
@@ -1293,12 +1326,14 @@ export default {
               > div {
                 display: flex;
               }
+              > :nth-child(1) {
+                width: 36px;
+              }
               .p1 {
                 width: 117px;
                 white-space: nowrap;
                 overflow: hidden;
                 text-overflow: ellipsis;
-                margin-left: 16px;
               }
               .p2 {
                 font-family: "FZJCGFKTK";
@@ -1318,7 +1353,7 @@ export default {
                   direction: rtl;
                   unicode-bidi: plaintext;
                   text-align: right;
-                  width: 227.5px;
+                  width: 224px;
                   white-space: nowrap;
                   overflow: hidden;
                 }
@@ -1326,7 +1361,7 @@ export default {
                   direction: ltr;
                   unicode-bidi: plaintext;
                   text-align: left;
-                  width: 227.5px;
+                  width: 224px;
                   white-space: nowrap;
                   overflow: hidden;
                 }