修改模版和信息渲染

src/views/oa/base/printTemplate/template.vue

@@ -23,7 +23,7 @@ const templateData = {
   data1: '合同总价-1',
   data2: '大写数字-1',
   '中文字段': 'zhongwenziduan',
-  table1: [
+  table0: [
     {
       field1: '1',
       field2: '2',
@@ -88,7 +88,6 @@ const options = ref({
   },
   onSave: async (e) => {
     const editor = editorRef.value;
-    console.log(e.json);
     template.value.templateData = JSON.stringify(e.json);
     const res = await updatePrintTemplate(template.value);
     ElMessage.success(res.msg);
@@ -103,13 +102,84 @@ const renderTemplate = (str, data) => {
     return path.split('.').reduce((o, k) => o?.[k], data) ?? '';
   });
 };
-const fillData = (e) => {
+const rowRenderTemplate = (str, data) => {
+  console.log(str, data);
+  return str.replace(/\^\{(.*?)\}/g, (_, path) => {
+    return path.split('.').reduce((o, k) => o?.[k], data) ?? '';
+  });
+};
+const hasCaretPattern = (arr) => {
+  // 正则匹配 ^{xxx}
+  const regex = /\^\{.*?\}/;
+
+  function traverse(items) {
+    for (const item of items) {
+      if (item.text && regex.test(item.text)) {
+        return true; // 找到匹配
+      }
+      if (item.content && Array.isArray(item.content)) {
+        if (traverse(item.content)) {
+          return true;
+        }
+      }
+    }
+    return false;
+  }
+
+  return traverse(arr);
+};
+
+const fillRowData = (e, data) => {
   if (Array.isArray(e.content)) {
     e.content.map((item) => {
-      return fillData(item);
+      return fillRowData(item, data);
     });
   } else {
-    e.text = renderTemplate(e.text || '', templateData);
+    e.text = rowRenderTemplate(e.text || '', data);
+  }
+  return e;
+};
+const tableTemplate = (table, index) => {
+  let field = `table${index}`;
+  let requestData = templateData[field];
+  const tableRowTemplate = (rows, data) => {
+    let arr = [];
+    data.forEach((item) => {
+      arr.push(rows);
+    });
+    return arr;
+  };
+  let data = JSON.parse(JSON.stringify(table));
+  let arr = [];
+  data.forEach((item) => {
+    let bol = hasCaretPattern(JSON.parse(JSON.stringify(item.content)));
+    if (bol) {
+      let obj = item;
+      let rows = tableRowTemplate(item.content, requestData);
+      rows.forEach((row, key) => {
+        // arr.push({ ...item, content: row });
+        arr.push(fillRowData(JSON.parse(JSON.stringify({ ...obj, content: row })), requestData[key]));
+      });
+    } else {
+      let obj = fillData(item);
+      arr.push(obj);
+    }
+  });
+  return arr.filter((item) => item);
+};
+const fillData = (e) => {
+  let index = 0;
+  if (e.type === 'table') {
+    e.content = tableTemplate(e.content, index);
+    index++;
+  } else {
+    if (Array.isArray(e.content)) {
+      e.content.map((item) => {
+        return fillData(item);
+      });
+    } else {
+      e.text = renderTemplate(e.text || '', templateData);
+    }
   }
   return e;
 };
@@ -120,8 +190,8 @@ onMounted(async () => {
     let docData = JSON.parse(e.data.templateData || '{}');
     let data = fillData(docData);
     console.log(data);
-    // editor.setContent(JSON.parse(e.data.templateData || '{}'));
+    editor.setContent(JSON.parse(e.data.templateData || '{}'));
-    editor.setContent(data);
+    // editor.setContent(data);
   });
 });
 let obj1 = {};