字句模式添加汉字json，对接接口数据赋值

src/views/wordcard/cread.vue

@@ -441,6 +441,43 @@ export default {
     },
     //处理输入内容
     creadEvent() {
+      // 大 一行8个    中 一行10个  小 一行12个
+      let data = {
+        option: [],
+        typeIndex: this.typeIndex,
+        playStorkes: this.from.playStorkes,
+        StorkesUnfold: this.from.StorkesUnfold,
+        BoxbgType: this.from.BoxbgType,
+        miaoRedBgcolor: this.from.miaoRedBgcolor,
+        writeColor: this.from.writeColor,
+        borderColor: this.from.borderColor,
+        fontColor: this.from.fontColor,
+        writeBoxNumber: this.from.writeBoxNumber,
+        miaoRedBoxNumber: this.from.miaoRedBoxNumber,
+        lastNullrow: this.from.lastNullrow,
+      };
+      if (this.from.fontSize == "big") {
+        data.width = "62px";
+        data.fontSize = "48px";
+        data.rowNumber = 8;
+        data.pageNumber = 9;
+        data.marginBottom = "15px";
+        data.playWidth = "11px";
+      } else if (this.from.fontSize == "center") {
+        data.width = "49px";
+        data.fontSize = "38px";
+        data.rowNumber = 10;
+        data.pageNumber = 12;
+        data.marginBottom = "8px";
+        data.playWidth = "9px";
+      } else {
+        data.width = "41px";
+        data.fontSize = "31px";
+        data.rowNumber = 12;
+        data.pageNumber = 14;
+        data.marginBottom = "7px";
+        data.playWidth = "8px";
+      }
       if (this.from.content == "") {
         this.$message.warning("请先输入内容");
         return;
@@ -500,12 +537,20 @@ export default {
           if (contentItem) option.push(contentItem);
         }
       }
-      let hz_str = option.join();
-      this.getMultHZStrokesContent(hz_str);
+      console.log(option);
+      let hz_str = "";
+      if (data.typeIndex == 0) {
+        option.forEach((item) => {
+          hz_str += item.con;
+        });
+      } else {
+        hz_str = option.join();
+      }
+      this.getMultHZStrokesContent(hz_str, data);
     },
 
     //得到多个汉字笔画内容
-    getMultHZStrokesContent(hz_str) {
+    getMultHZStrokesContent(hz_str, oldData) {
       this.loading = true;
       let MethodName = "hz_resource_manager-GetMultHZStrokesContent";
       let data = {
@@ -514,54 +559,22 @@ export default {
       getLogin(MethodName, data)
         .then((res) => {
           this.loading = false;
+          for (let key in res) {
+            if (key != "status") {
+              res[key] = JSON.parse(res[key]);
+            }
+          }
           let hzDetailList = res;
-          this.handleEvent(hzDetailList);
+          this.handleEvent(hzDetailList, oldData);
         })
         .catch(() => {
           this.loading = false;
         });
     },
     // 生成
-    handleEvent(hzDetailList) {
+    handleEvent(hzDetailList, oldData) {
       this.writeTableData = null;
-      // 大 一行8个    中 一行10个  小 一行12个
-      let data = {
-        option: [],
-        typeIndex: this.typeIndex,
-        playStorkes: this.from.playStorkes,
-        StorkesUnfold: this.from.StorkesUnfold,
-        BoxbgType: this.from.BoxbgType,
-        miaoRedBgcolor: this.from.miaoRedBgcolor,
-        writeColor: this.from.writeColor,
-        borderColor: this.from.borderColor,
-        fontColor: this.from.fontColor,
-        writeBoxNumber: this.from.writeBoxNumber,
-        miaoRedBoxNumber: this.from.miaoRedBoxNumber,
-        lastNullrow: this.from.lastNullrow,
-      };
-      if (this.from.fontSize == "big") {
-        data.width = "62px";
-        data.fontSize = "48px";
-        data.rowNumber = 8;
-        data.pageNumber = 9;
-        data.marginBottom = "15px";
-        data.playWidth = "11px";
-      } else if (this.from.fontSize == "center") {
-        data.width = "49px";
-        data.fontSize = "38px";
-        data.rowNumber = 10;
-        data.pageNumber = 12;
-        data.marginBottom = "8px";
-        data.playWidth = "9px";
-      } else {
-        data.width = "41px";
-        data.fontSize = "31px";
-        data.rowNumber = 12;
-        data.pageNumber = 14;
-        data.marginBottom = "7px";
-        data.playWidth = "8px";
-      }
-      
+      let data = JSON.parse(JSON.stringify(oldData));
       let contentArr = this.from.content.split("\n");
       for (let i = 0; i < contentArr.length; i++) {
         if (data.typeIndex == 0) {
@@ -601,232 +614,211 @@ export default {
           let res = JSON.parse(JSON.stringify(hzDetailList[item.con]));
           this.$set(data.option[i].hzDetail, "hz_json", res);
         });
-        let hzTimer = setInterval(() => {
-          if (!this.loading) {
-            clearInterval(hzTimer);
-            hzTimer = null;
-            if (data.StorkesUnfold) {
-              let allArr = [];
-              let timer = setInterval(() => {
-                if (!this.loading) {
-                  data.option.forEach((item) => {
-                    let arr = [];
-                    let hzLength = 1;
-                    let arrOption = [];
-                    // 拆分字和笔画为每一项
-                    arr.push({
-                      con: item.con,
-                      hzDetail: JSON.parse(
-                        JSON.stringify(item.hzDetail.hz_json)
-                      ),
-                    });
-                    if (
-                      item.hzDetail &&
-                      item.hzDetail.hz_json &&
-                      item.hzDetail.hz_json.medians
-                    ) {
-                      hzLength += item.hzDetail.hz_json.medians.length;
-                      item.hzDetail.hz_json.medians.forEach((items, indexs) => {
-                        arr.push({
+        if (data.StorkesUnfold) {
+          data.option.forEach((item) => {
+            let arr = [];
+            let hzLength = 1;
+            let arrOption = [];
+            // 拆分字和笔画为每一项
+            arr.push({
+              con: item.con,
+              hzDetail: JSON.parse(JSON.stringify(item.hzDetail.hz_json)),
+            });
+            if (
+              item.hzDetail &&
+              item.hzDetail.hz_json &&
+              item.hzDetail.hz_json.medians
+            ) {
+              hzLength += item.hzDetail.hz_json.medians.length;
+              item.hzDetail.hz_json.medians.forEach((items, indexs) => {
+                arr.push({
+                  con: item.con,
+                  answer: indexs + 1,
+                  hzDetail: JSON.parse(JSON.stringify(item.hzDetail.hz_json)),
+                });
+              });
+            }
+            // 如果不满一行则补满
+            let newarr = [];
+            if (arr.length % data.rowNumber != 0) {
+              let num = data.rowNumber - (arr.length % data.rowNumber);
+              for (let i = 0; i < num; i++) {
+                arr.push({});
+              }
+              if (arr.length > data.rowNumber) {
+                newarr = this.arrSplice(arr, data.rowNumber);
+                newarr.forEach((itemss) => {
+                  allArr.push(itemss);
+                });
+              } else {
+                allArr.push(arr);
+              }
+            } else {
+              allArr.push(arr);
+            }
+            // 添加书写行
+            if (data.writeBoxNumber) {
+              for (let i = 0; i < data.writeBoxNumber; i++) {
+                let numrow = [];
+                for (let k = 0; k < data.rowNumber; k++) {
+                  numrow.push({
+                    con: item.con,
+                    write: true,
+                  });
+                }
+                // 描红格
+                if (i == 0 && data.miaoRedBoxNumber) {
+                  let m =
+                    Math.ceil(data.miaoRedBoxNumber / data.rowNumber) >
+                    data.writeBoxNumber
+                      ? data.writeBoxNumber
+                      : Math.ceil(data.miaoRedBoxNumber / data.rowNumber);
+                  for (let j = 0; j < m; j++) {
+                    let miaoArr = [];
+                    for (let l = 0; l < data.rowNumber; l++) {
+                      if (j * data.rowNumber + l < data.miaoRedBoxNumber) {
+                        miaoArr[l] = {
                           con: item.con,
-                          answer: indexs + 1,
-                          hzDetail: JSON.parse(
-                            JSON.stringify(item.hzDetail.hz_json)
-                          ),
-                        });
-                      });
-                    }
-                    // 如果不满一行则补满
-                    let newarr = [];
-                    if (arr.length % data.rowNumber != 0) {
-                      let num = data.rowNumber - (arr.length % data.rowNumber);
-                      for (let i = 0; i < num; i++) {
-                        arr.push({});
-                      }
-                      if (arr.length > data.rowNumber) {
-                        newarr = this.arrSplice(arr, data.rowNumber);
-                        newarr.forEach((itemss) => {
-                          allArr.push(itemss);
-                        });
+                          miaoRed: true,
+                          write: true,
+                        };
                       } else {
-                        allArr.push(arr);
-                      }
-                    } else {
-                      allArr.push(arr);
-                    }
-                    // 添加书写行
-                    if (data.writeBoxNumber) {
-                      for (let i = 0; i < data.writeBoxNumber; i++) {
-                        let numrow = [];
-                        for (let k = 0; k < data.rowNumber; k++) {
-                          numrow.push({
-                            con: item.con,
-                            write: true,
-                          });
-                        }
-                        // 描红格
-                        if (i == 0 && data.miaoRedBoxNumber) {
-                          let m =
-                            Math.ceil(data.miaoRedBoxNumber / data.rowNumber) >
-                            data.writeBoxNumber
-                              ? data.writeBoxNumber
-                              : Math.ceil(
-                                  data.miaoRedBoxNumber / data.rowNumber
-                                );
-                          for (let j = 0; j < m; j++) {
-                            let miaoArr = [];
-                            for (let l = 0; l < data.rowNumber; l++) {
-                              if (
-                                j * data.rowNumber + l <
-                                data.miaoRedBoxNumber
-                              ) {
-                                miaoArr[l] = {
-                                  con: item.con,
-                                  miaoRed: true,
-                                  write: true,
-                                };
-                              } else {
-                                miaoArr[l] = {
-                                  con: item.con,
-                                  write: true,
-                                };
-                              }
-                            }
-                            arrOption.push(JSON.parse(JSON.stringify(miaoArr)));
-                          }
-                        }
-                        arrOption.push(numrow);
-                        arrOption = arrOption.slice(0, data.writeBoxNumber);
-                      }
-                      arrOption.forEach((itemA) => {
-                        allArr.push(itemA);
-                      });
-                    }
-                  });
-                  if (data.lastNullrow) {
-                    for (let i = 0; i < data.lastNullrow; i++) {
-                      let numrow = [];
-                      for (let k = 0; k < data.rowNumber; k++) {
-                        numrow.push({
+                        miaoArr[l] = {
+                          con: item.con,
                           write: true,
-                        });
+                        };
                       }
-                      allArr.push(numrow);
                     }
+                    arrOption.push(JSON.parse(JSON.stringify(miaoArr)));
                   }
-                  data.result = this.arrSplice(allArr, data.pageNumber);
-                  this.writeTableData = data;
-                  clearInterval(timer);
-                  timer = null;
                 }
-              }, 100);
-            } else {
-              let allArr = [];
-              data.option.forEach((item) => {
-                let arr = [];
-                let arrOption = [];
-                // 拆分字和笔画为每一项
-                arr.push({
-                  con: item.con,
-                  hzDetail: JSON.parse(JSON.stringify(item.hzDetail.hz_json)),
+                arrOption.push(numrow);
+                arrOption = arrOption.slice(0, data.writeBoxNumber);
+              }
+              arrOption.forEach((itemA) => {
+                allArr.push(itemA);
+              });
+            }
+          });
+          if (data.lastNullrow) {
+            for (let i = 0; i < data.lastNullrow; i++) {
+              let numrow = [];
+              for (let k = 0; k < data.rowNumber; k++) {
+                numrow.push({
+                  write: true,
                 });
-                // 如果不满一行则补满
-                let newarr = [];
-                let areadyMiao = 0;
-                if (arr.length % data.rowNumber != 0) {
-                  let num = data.rowNumber - (arr.length % data.rowNumber);
-                  for (let i = 0; i < num; i++) {
-                    if (data.miaoRedBoxNumber && i < data.miaoRedBoxNumber) {
-                      arr.push({
-                        con: item.con,
-                        miaoRed: true,
-                        write: true,
-                      });
-                      areadyMiao++;
-                    } else {
-                      arr.push({});
-                    }
-                  }
-                  if (arr.length > data.rowNumber) {
-                    newarr = this.arrSplice(arr, data.rowNumber);
-                    newarr.forEach((itemss) => {
-                      allArr.push(itemss);
-                    });
-                  } else {
-                    allArr.push(arr);
-                  }
+              }
+              allArr.push(numrow);
+            }
+          }
+          data.result = this.arrSplice(allArr, data.pageNumber);
+          this.writeTableData = data;
+          clearInterval(timer);
+          timer = null;
+        } else {
+          let allArr = [];
+          data.option.forEach((item) => {
+            let arr = [];
+            let arrOption = [];
+            // 拆分字和笔画为每一项
+            arr.push({
+              con: item.con,
+              hzDetail: JSON.parse(JSON.stringify(item.hzDetail.hz_json)),
+            });
+            // 如果不满一行则补满
+            let newarr = [];
+            let areadyMiao = 0;
+            if (arr.length % data.rowNumber != 0) {
+              let num = data.rowNumber - (arr.length % data.rowNumber);
+              for (let i = 0; i < num; i++) {
+                if (data.miaoRedBoxNumber && i < data.miaoRedBoxNumber) {
+                  arr.push({
+                    con: item.con,
+                    miaoRed: true,
+                    write: true,
+                  });
+                  areadyMiao++;
                 } else {
-                  allArr.push(arr);
+                  arr.push({});
                 }
-                // 添加书写行
-                if (data.writeBoxNumber) {
-                  for (let i = 0; i < data.writeBoxNumber; i++) {
-                    let numrow = [];
-                    for (let k = 0; k < data.rowNumber; k++) {
-                      numrow.push({
-                        con: item.con,
-                        write: true,
-                      });
-                    }
-                    // 描红格
-                    if (i == 0 && data.miaoRedBoxNumber) {
-                      let m =
-                        Math.ceil(
+              }
+              if (arr.length > data.rowNumber) {
+                newarr = this.arrSplice(arr, data.rowNumber);
+                newarr.forEach((itemss) => {
+                  allArr.push(itemss);
+                });
+              } else {
+                allArr.push(arr);
+              }
+            } else {
+              allArr.push(arr);
+            }
+            // 添加书写行
+            if (data.writeBoxNumber) {
+              for (let i = 0; i < data.writeBoxNumber; i++) {
+                let numrow = [];
+                for (let k = 0; k < data.rowNumber; k++) {
+                  numrow.push({
+                    con: item.con,
+                    write: true,
+                  });
+                }
+                // 描红格
+                if (i == 0 && data.miaoRedBoxNumber) {
+                  let m =
+                    Math.ceil(
+                      (data.miaoRedBoxNumber - areadyMiao) / data.rowNumber
+                    ) > data.writeBoxNumber
+                      ? data.writeBoxNumber
+                      : Math.ceil(
                           (data.miaoRedBoxNumber - areadyMiao) / data.rowNumber
-                        ) > data.writeBoxNumber
-                          ? data.writeBoxNumber
-                          : Math.ceil(
-                              (data.miaoRedBoxNumber - areadyMiao) /
-                                data.rowNumber
-                            );
-                      for (let j = 0; j < m; j++) {
-                        let miaoArr = [];
-                        for (let l = 0; l < data.rowNumber; l++) {
-                          if (
-                            j * data.rowNumber + l <
-                            data.miaoRedBoxNumber - areadyMiao
-                          ) {
-                            miaoArr[l] = {
-                              con: item.con,
-                              miaoRed: true,
-                              write: true,
-                            };
-                          } else {
-                            miaoArr[l] = {
-                              con: item.con,
-                              write: true,
-                            };
-                          }
-                        }
-                        arrOption.push(JSON.parse(JSON.stringify(miaoArr)));
+                        );
+                  for (let j = 0; j < m; j++) {
+                    let miaoArr = [];
+                    for (let l = 0; l < data.rowNumber; l++) {
+                      if (
+                        j * data.rowNumber + l <
+                        data.miaoRedBoxNumber - areadyMiao
+                      ) {
+                        miaoArr[l] = {
+                          con: item.con,
+                          miaoRed: true,
+                          write: true,
+                        };
+                      } else {
+                        miaoArr[l] = {
+                          con: item.con,
+                          write: true,
+                        };
                       }
                     }
-                    arrOption.push(numrow);
-                    arrOption = arrOption.slice(0, data.writeBoxNumber);
+                    arrOption.push(JSON.parse(JSON.stringify(miaoArr)));
                   }
-                  arrOption.forEach((itemA) => {
-                    allArr.push(itemA);
-                  });
                 }
+                arrOption.push(numrow);
+                arrOption = arrOption.slice(0, data.writeBoxNumber);
+              }
+              arrOption.forEach((itemA) => {
+                allArr.push(itemA);
               });
-              if (data.lastNullrow) {
-                for (let i = 0; i < data.lastNullrow; i++) {
-                  let numrow = [];
-                  for (let k = 0; k < data.rowNumber; k++) {
-                    numrow.push({
-                      write: true,
-                    });
-                  }
-                  allArr.push(JSON.parse(JSON.stringify(numrow)));
-                }
+            }
+          });
+          if (data.lastNullrow) {
+            for (let i = 0; i < data.lastNullrow; i++) {
+              let numrow = [];
+              for (let k = 0; k < data.rowNumber; k++) {
+                numrow.push({
+                  write: true,
+                });
               }
-              data.result = this.arrSplice(allArr, data.pageNumber);
-              this.writeTableData = data;
+              allArr.push(JSON.parse(JSON.stringify(numrow)));
             }
-            this.$forceUpdate();
-            this.isCread = true;
           }
-        }, 100);
+          data.result = this.arrSplice(allArr, data.pageNumber);
+          this.writeTableData = data;
+        }
+        this.$forceUpdate();
+        this.isCread = true;
       } else {
         // 处理句模式数据
         let allArr = [];
@@ -857,16 +849,6 @@ export default {
                     con: item[k * data.rowNumber + s],
                     miaoRed: true,
                   };
-                  let MethodName = "hz_resource_manager-GetHZStrokesContent";
-                  getLogin(MethodName, { hz: item[k * data.rowNumber + s] })
-                    .then((res) => {
-                      this.$set(sentenceItemMiao[s], "hzDetail", {
-                        hz_json: res,
-                      });
-                    })
-                    .catch(() => {
-                      this.loading = false;
-                    });
                 } else {
                   sentenceItemMiao[s] = {};
                 }
@@ -915,34 +897,20 @@ export default {
         }
 
         data.result = this.arrSplice(allArr, data.pageNumber);
-        this.loading = true;
-        let MethodName = "hz_resource_manager-GetHZStrokesContent";
-        data.result.forEach((items, index) => {
-          items.forEach((itemss, indexs) => {
-            itemss.forEach((itemsss, indexss) => {
-              let obj = {
-                hz: itemsss.con,
-              };
-              itemsss.hzDetail = null;
-              getLogin(MethodName, obj)
-                .then((res) => {
-                  itemsss.hzDetail = res;
-                  if (
-                    index == data.result.length - 1 &&
-                    indexs == items.length - 1 &&
-                    indexss == itemss.length - 1
-                  ) {
-                    this.writeTableData = data;
-                    this.loading = false;
-                  }
-                })
-                .catch(() => {
-                  this.loading = false;
-                });
+        data.result.forEach((item, index) => {
+          item.forEach((items, indexs) => {
+            items.forEach((itemss, indexss) => {
+              if (itemss.con) {
+                let res = JSON.parse(JSON.stringify(hzDetailList[itemss.con]));
+                itemss.hzDetail = {
+                  hz_json: null,
+                };
+                this.$set(data.result[index][indexs][indexss], "hzDetail", res);
+              }
             });
           });
         });
-
+        this.writeTableData = data;
         this.$forceUpdate();
         this.isCread = true;
       }