zhangjie 2 роки тому
батько
коміт
d54db9a88d

+ 9 - 0
src/components/vEditor/renderJSON.js

@@ -66,6 +66,15 @@ function renderBlock(block, inline) {
           return document.createElement(nodeName);
         });
 
+      if (!nodes.length && block.param.width) {
+        const spanDom = document.createElement("span");
+        spanDom.style.display = "inline-block";
+        spanDom.style.verticalAlign = "middle";
+        spanDom.style.textAlign = "right";
+        spanDom.style.width = block.param.width + "px";
+        nodes.push(spanDom);
+      }
+
       nodes.push(document.createTextNode(block.value));
       // 将不为空的元素依次append
       node = nodes.reduceRight((p, c) => {

+ 1 - 0
src/modules/paper-export/elements/rich-text/ElemRichText.vue

@@ -3,6 +3,7 @@
     <rich-text
       v-if="data.contType !== 'gap'"
       :text-json="data.content"
+      :style="data.textStyles"
     ></rich-text>
   </div>
 </template>

+ 1 - 0
src/modules/paper-export/elements/rich-text/model.js

@@ -13,6 +13,7 @@ const MODEL = {
   h: 50,
   contType: "content",
   styles: {},
+  textStyles: {},
   content: {
     sections: [{ blocks: [] }],
   },

+ 1 - 1
src/modules/paper-export/previewTemp.js

@@ -15,8 +15,8 @@ export default (domeStr) => {
         <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
         <title>试卷</title>
 
+        <style>${resetCss}${previewCss}${paperCss}${otherCss}</style>
       </head>
-      <style>${resetCss}${previewCss}${paperCss}${otherCss}</style>
       <body>${domeStr}</body>
     </html>
   `;

+ 72 - 13
src/modules/paper-export/views/PaperTemplateBuild.vue

@@ -89,6 +89,8 @@ export default {
       downloading: false,
       fieldData: {},
       paperStructs: [],
+      TEXT_INDENT_SIZE: 28,
+      textIndent: 28,
     };
   },
   mounted() {
@@ -99,6 +101,12 @@ export default {
     this.initData();
   },
   methods: {
+    getTextIndexStyle() {
+      return {
+        textIndent: `-${this.textIndent}px`,
+        paddingLeft: `${this.textIndent}px`,
+      };
+    },
     async initFrame() {
       try {
         const paperSet = window.parent.paperSet;
@@ -303,7 +311,11 @@ export default {
                 const obodys = this.parseTitleOption(
                   op.optionBody,
                   `${numberToUpperCase(op.number)}、`,
-                  "option"
+                  true,
+                  {
+                    contType: "option",
+                    textStyles: { paddingLeft: `${this.textIndent}px` },
+                  }
                 );
                 renderStructList.push(...obodys);
               });
@@ -402,7 +414,11 @@ export default {
 
       const tbodys = this.parseTitleOption(
         quesBody,
-        `${question.questionSeq}、`
+        `${question.questionSeq}、`,
+        true,
+        {
+          textStyles: { paddingLeft: `${this.textIndent}px` },
+        }
       );
       contents.push(...tbodys);
       const hasNobody = !tbodys.length;
@@ -410,12 +426,26 @@ export default {
       if (question.quesOptions && question.quesOptions.length) {
         question.quesOptions.forEach((op, oIndex) => {
           let noVal = `${numberToUpperCase(op.number)}、`;
-          if (hasNobody && !oIndex) {
+          if (!hasNobody) {
+            const obodys = this.parseTitleOption(op.optionBody, noVal, false, {
+              contType: "option",
+              textStyles: { paddingLeft: `${this.textIndent}px` },
+            });
+            contents.push(...obodys);
+            return;
+          }
+
+          if (!oIndex) {
             // 针对如完形填空的小题做的特殊处理
             noVal = `${question.questionSeq}、${noVal}`;
           }
-          const obodys = this.parseTitleOption(op.optionBody, noVal, "option");
+          this.textIndent = 2 * this.TEXT_INDENT_SIZE;
+          const obodys = this.parseTitleOption(op.optionBody, noVal, true, {
+            contType: "option",
+            textStyles: { paddingLeft: `${this.textIndent}px` },
+          });
           contents.push(...obodys);
+          this.textIndent = this.TEXT_INDENT_SIZE;
         });
       }
       return contents;
@@ -424,7 +454,11 @@ export default {
       let content = this.getRichStruct([
         {
           type: "text",
-          value: `${data.cnNum}、${data.name}(共${data.unitCount}小题,满分${data.score}分)`,
+          value: `${data.cnNum}、`,
+        },
+        {
+          type: "text",
+          value: `${data.name}(共${data.unitCount}小题,满分${data.score}分)`,
         },
       ]);
       return getRichTextModel({
@@ -432,23 +466,48 @@ export default {
         content,
       });
     },
-    parseTitleOption(richJson, noVal, contType = "content") {
+    parseTitleOption(
+      richJson,
+      noVal,
+      needIndent = false,
+      modelData = { textStyles: null, styles: null, contType: "" }
+    ) {
       if (!richJson) return [];
+      const { textStyles, styles, contType } = modelData;
       const bodys = this.transformRichJson(richJson);
 
       return bodys.map((body, index) => {
+        let presetData = {
+          content: body,
+        };
+        if (contType) presetData.contType = contType;
+        if (textStyles) presetData.textStyles = textStyles;
+        if (styles) {
+          presetData.styles = styles;
+        } else {
+          presetData.styles = {
+            width: contType === "option" ? "auto" : "100%",
+          };
+        }
+
         if (index === 0 && noVal) {
-          body.sections[0].blocks.unshift({
+          let cont = {
             type: "text",
             value: noVal,
-          });
+          };
+          if (needIndent) {
+            cont.param = {
+              width: this.textIndent,
+            };
+            presetData.textStyles = {
+              ...(presetData.textStyles || {}),
+              ...this.getTextIndexStyle(),
+            };
+          }
+          body.sections[0].blocks.unshift(cont);
         }
 
-        return getRichTextModel({
-          contType,
-          styles: { width: contType !== "option" ? "100%" : "auto" },
-          content: body,
-        });
+        return getRichTextModel(presetData);
       });
     },
     parseLineGap() {