bug fix

src/assets/styles/card-preview.scss

@@ -713,7 +713,7 @@
 .card-head-body-auto-resize {
   margin-left: -5px;
   margin-right: -5px;
-  display: flex;
+  overflow: hidden;
 
   &.col-item-auto-height {
     .card-head-body-spin {
@@ -727,19 +727,15 @@
     }
   }
 
-  &::before {
-    display: table;
-    content: "";
-  }
   .rect-col {
-    float: left;
-    height: 100%;
     padding: 5px;
     &:first-child {
-      width: 324px;
+      float: left;
+      width: 289px;
     }
     &:last-child {
-      width: 440px;
+      float: right;
+      width: 424px;
     }
 
     &-item {

src/modules/card/components/SavePage.vue

@@ -9,11 +9,21 @@ import { mapState } from "vuex";
 import { CARD_VERSION } from "../enumerate";
 import { deepCopy } from "@/plugins/utils";
 
+const initIndex = {
+  question: 1,
+  absent: 1,
+  paperType: 1,
+  examNumber: 1,
+  selective: 1
+};
+
 export default {
   name: "save-page",
   data() {
     return {
-      fillAreaIndex: 0,
+      fillAreaIndex: {
+        ...initIndex
+      },
       VALID_ELEMENTS_FOR_EXTERNAL: [
         "LOCATOR",
         "BARCODE",
@@ -29,8 +39,8 @@ export default {
     ...mapState("card", ["pages", "cardConfig", "paperParams"])
   },
   methods: {
-    getFillAreaIndex() {
-      return this.fillAreaIndex++;
+    getFillAreaIndex(type) {
+      return this.fillAreaIndex[type]++;
     },
     getElementHumpName(cont) {
       return cont
@@ -68,7 +78,7 @@ export default {
         page.exchange = exchange;
       });
 
-      this.fillAreaIndex = 0;
+      this.fillAreaIndex = { ...initIndex };
 
       return pages;
     },
@@ -123,7 +133,7 @@ export default {
 
         fill_area.push({
           field: "examNumber",
-          index: this.getFillAreaIndex(),
+          index: this.getFillAreaIndex("examNumber"),
           single: true,
           horizontal: false,
           items: listInfos
@@ -139,16 +149,16 @@ export default {
       if (element.missAndFill && !element.isSimple) {
         fill_area.push({
           field: "absent",
-          index: this.getFillAreaIndex(),
+          index: this.getFillAreaIndex("absent"),
           single: true,
           horizontal: true,
           items: [
             {
               main_number: null,
               sub_number: null,
-              options: this.getOffsetInfo(
-                document.getElementById("dynamic-miss-area")
-              )
+              options: [
+                this.getOffsetInfo(document.getElementById("dynamic-miss-area"))
+              ]
             }
           ]
         });
@@ -174,7 +184,7 @@ export default {
             });
           fill_area.push({
             field: "paperType",
-            index: this.getFillAreaIndex(),
+            index: this.getFillAreaIndex("paperType"),
             single: true,
             horizontal: true,
             items: [
@@ -189,7 +199,7 @@ export default {
       }
 
       return {
-        info_area: headArea,
+        info_area: [headArea],
         fill_area,
         barcode
       };
@@ -219,7 +229,7 @@ export default {
           });
         fillAreas.push({
           field: "question",
-          index: this.getFillAreaIndex(),
+          index: this.getFillAreaIndex("question"),
           single,
           horizontal,
           items: listInfos
@@ -264,7 +274,7 @@ export default {
         fill_area: [
           {
             field: "question",
-            index: this.getFillAreaIndex(),
+            index: this.getFillAreaIndex("question"),
             single: true,
             horizontal: element.optionDirection === "horizontal",
             items: listInfos

src/modules/card/components/elementEdit/CardHeadBodyAutoResize.vue

@@ -41,26 +41,22 @@ export default {
   data() {
     return {
       orgHeights: {
-        stdinfo: 196,
-        notice: 205,
-        stdno: 306,
-        dynamic: 109
+        stdinfo: 40,
+        notice: 40,
+        stdno: 40,
+        dynamic: 40
       },
       heights: {
-        stdinfo: 196,
-        notice: 205,
-        stdno: 306,
-        dynamic: 109
-      },
-      isOrg: true
+        stdinfo: 40,
+        notice: 40,
+        stdno: 40,
+        dynamic: 40
+      }
     };
   },
   computed: {
     classes() {
-      return [
-        "card-head-body-auto-resize",
-        this.isOrg ? "col-item-auto-height" : "col-item-full-height"
-      ];
+      return ["card-head-body-auto-resize", "col-item-auto-height"];
     }
   },
   mounted() {
@@ -68,29 +64,40 @@ export default {
   },
   methods: {
     initStyles() {
-      this.isOrg = true;
-      this.$nextTick(() => {
-        const containers = ["stdinfo", "notice", "stdno", "dynamic"];
-        containers.forEach(container => {
-          const dom =
-            this.$refs[`${container}Container`] &&
-            this.$refs[`${container}Container`].firstChild;
-          this.orgHeights[container] = dom ? dom.offsetHeight : 0;
-        });
-        this.heights = { ...this.orgHeights };
-        this.resizeRect();
-        this.isOrg = false;
+      const containers = ["stdinfo", "notice", "stdno", "dynamic"];
+      containers.forEach(container => {
+        const dom =
+          this.$refs[`${container}Container`] &&
+          this.$refs[`${container}Container`].firstChild;
+        this.orgHeights[container] = dom ? dom.offsetHeight : 0;
+      });
+      Object.keys(this.orgHeights).map(key => {
+        this.heights[key] = this.orgHeights[key] + 2;
       });
+      this.resizeRect();
     },
     resizeRect() {
-      const col1 = this.orgHeights.stdinfo + this.orgHeights.notice;
-      const col2 = this.orgHeights.stdno + this.orgHeights.dynamic;
-      if (col1 > col2) {
-        this.heights.stdno = col1 - col2 + this.orgHeights.stdno + 10;
+      let col1 = this.orgHeights.stdinfo + this.orgHeights.notice;
+      let col2 = this.orgHeights.stdno + this.orgHeights.dynamic;
+      if (this.$slots.dynamic) {
+        if (col1 > col2) {
+          this.heights.stdno = col1 - col2 + this.orgHeights.stdno + 2;
+          this.heights.dynamic = this.orgHeights.dynamic + 2;
+        } else {
+          const splitHeight = (col2 - col1) / 2;
+          this.heights.stdinfo = splitHeight + this.orgHeights.stdinfo + 2;
+          this.heights.notice = splitHeight + this.orgHeights.notice + 2;
+        }
       } else {
-        const splitHeight = (col2 - col1) / 2;
-        this.heights.stdinfo = splitHeight + this.orgHeights.stdinfo;
-        this.heights.notice = splitHeight + this.orgHeights.notice;
+        col1 += 14;
+        col2 -= 2;
+        if (col1 > col2) {
+          this.heights.stdno = col1;
+        } else {
+          const splitHeight = (col2 - col1) / 2;
+          this.heights.stdinfo = splitHeight + this.orgHeights.stdinfo + 2;
+          this.heights.notice = splitHeight + this.orgHeights.notice + 2;
+        }
       }
     }
   }

src/modules/card/previewTemp.js

@@ -731,9 +731,6 @@ const css =
   .card-head-body-auto-resize {\
     margin-left: -5px;\
     margin-right: -5px;\
-    display: -webkit-box;\
-    display: -ms-flexbox;\
-    display: flex;\
   }\
   .card-head-body-auto-resize.col-item-auto-height .card-head-body-spin {\
     height: auto;\
@@ -741,20 +738,16 @@ const css =
   .card-head-body-auto-resize .head-dynamic-2 .head-dynamic-part {\
     height: auto;\
   }\
-  .card-head-body-auto-resize::before {\
-    display: table;\
-    content: "";\
-  }\
   .card-head-body-auto-resize .rect-col {\
-    float: left;\
-    height: 100%;\
     padding: 5px;\
   }\
   .card-head-body-auto-resize .rect-col:first-child {\
-    width: 324px;\
+    float: left;\
+    width: 289px;\
   }\
   .card-head-body-auto-resize .rect-col:last-child {\
-    width: 440px;\
+    float: right;\
+    width: 424px;\
   }\
   .card-head-body-auto-resize .rect-col-item {\
     border: 1px solid #333;\