题卡修改

card/assets/styles/card-preview.scss

@@ -301,6 +301,7 @@
   &-rect {
     left: 25%;
     transform: translateX(-50%);
+    -webkit-transform: translateX(-50%);
   }
   &-rect-list {
     font-size: 0;
@@ -534,6 +535,7 @@
           > i {
             display: inline-block;
             transform: scale(0.67, 0.67);
+            -webkit-transform: scale(0.67, 0.67);
           }
         }
       }
@@ -626,18 +628,19 @@
         span {
           display: block;
         }
+        .head-dynamic-content {
+          height: 14px;
+          line-height: 14px;
+        }
         .dynamic-miss-title {
           width: 54px;
           float: left;
         }
         .dynamic-miss-body {
           margin-left: 54px;
+          height: 14px;
           text-align: center;
         }
-        .head-dynamic-rect {
-          margin: auto;
-          vertical-align: middle;
-        }
       }
       &-fill {
         padding: 10px;
@@ -763,6 +766,7 @@
         > i {
           display: inline-block;
           transform: scale(0.67, 0.67);
+          -webkit-transform: scale(0.67, 0.67);
         }
       }
       &-aorb {
@@ -796,6 +800,7 @@
             left: 0;
             width: 100%;
             transform: translateY(-50%);
+            -webkit-transform: translateY(-50%);
             z-index: auto;
           }
         }
@@ -1085,6 +1090,7 @@
 
   .elem-body {
     padding: 10px 5px;
+    font-size: 0;
   }
 
   .group-item {
@@ -1102,10 +1108,10 @@
     vertical-align: middle;
     padding: 0;
     width: 18px;
-    height: 12px;
+    height: 10px;
     text-align: center;
     font-size: 12px;
-    line-height: 10px;
+    line-height: 8px;
     // border-rect
     border: 1px solid #000;
     color: #000;
@@ -1114,16 +1120,18 @@
     > i {
       display: inline-block;
       transform: scale(0.67, 0.67);
+      -webkit-transform: scale(0.67, 0.67);
     }
 
     &:first-child {
       text-align: center;
       border: none;
       font-size: 12px;
-      line-height: 12px;
+      line-height: 10px;
       color: #000;
       > i {
         transform: scale(0.9, 0.9);
+        -webkit-transform: scale(0.9, 0.9);
       }
     }
     &:last-child {
@@ -1225,6 +1233,7 @@
           padding-bottom: 5px;
           padding-right: 3px;
           transform: translateY(-100%);
+          -webkit-transform: translateY(-100%);
         }
       }
       &.elem-fill-comma {
@@ -1233,6 +1242,7 @@
         right: -10px;
         z-index: 9;
         transform: translateY(-100%);
+        -webkit-transform: translateY(-100%);
         width: 10px;
         padding-bottom: 4px;
         background-color: #fff;
@@ -1352,6 +1362,7 @@
       > i {
         display: inline-block;
         transform: scale(0.67, 0.67);
+        -webkit-transform: scale(0.67, 0.67);
       }
     }
   }
@@ -1438,6 +1449,7 @@
     left: 0;
     top: 50%;
     transform: translateY(-50%);
+    -webkit-transform: translateY(-50%);
 
     font-size: 30px;
     text-align: center;

card/assets/styles/card-temp.css

@@ -1,3 +1,13 @@
+.card-preview {
+  padding: 10px 0;
+  background-color: #f0f0f0;
+  color: #000;
+}
+.card-preview .page-box {
+  margin: 10px auto;
+  box-shadow: 0 0 4px #ddd;
+}
+
 .card-print {
   padding: 0;
 }
@@ -233,6 +243,7 @@
 .page-number-rect {
   left: 25%;
   transform: translateX(-50%);
+  -webkit-transform: translateX(-50%);
 }
 .page-number-rect-list {
   font-size: 0;
@@ -452,6 +463,7 @@
 .card-head-body .head-stdno .stdno-fill-option > i {
   display: inline-block;
   transform: scale(0.67, 0.67);
+  -webkit-transform: scale(0.67, 0.67);
 }
 .card-head-body .head-stdno .stdno-auto-barcode {
   height: 70px;
@@ -528,18 +540,19 @@
 .card-head-body .head-dynamic-miss span {
   display: block;
 }
+.card-head-body .head-dynamic-miss .head-dynamic-content {
+  height: 14px;
+  line-height: 14px;
+}
 .card-head-body .head-dynamic-miss .dynamic-miss-title {
   width: 54px;
   float: left;
 }
 .card-head-body .head-dynamic-miss .dynamic-miss-body {
   margin-left: 54px;
+  height: 14px;
   text-align: center;
 }
-.card-head-body .head-dynamic-miss .head-dynamic-rect {
-  margin: auto;
-  vertical-align: middle;
-}
 .card-head-body .head-dynamic-fill {
   padding: 10px;
 }
@@ -609,6 +622,7 @@
 .card-head-body .head-dynamic-rect > i {
   display: inline-block;
   transform: scale(0.67, 0.67);
+  -webkit-transform: scale(0.67, 0.67);
 }
 .card-head-body .head-dynamic-aorb {
   display: table;
@@ -640,6 +654,7 @@
   left: 0;
   width: 100%;
   transform: translateY(-50%);
+  -webkit-transform: translateY(-50%);
   z-index: auto;
 }
 .card-head-body .head-dynamic-aorb .dynamic-aorb-barcode img {
@@ -879,6 +894,7 @@
 }
 .elem-fill-question .elem-body {
   padding: 10px 5px;
+  font-size: 0;
 }
 .elem-fill-question .group-item {
   font-family: "Times New Roman", Arial, sans-serif;
@@ -894,10 +910,10 @@
   vertical-align: middle;
   padding: 0;
   width: 18px;
-  height: 12px;
+  height: 10px;
   text-align: center;
   font-size: 12px;
-  line-height: 10px;
+  line-height: 8px;
   border: 1px solid #000;
   color: #000;
   box-sizing: border-box;
@@ -905,16 +921,18 @@
 .elem-fill-question .option-item > i {
   display: inline-block;
   transform: scale(0.67, 0.67);
+  -webkit-transform: scale(0.67, 0.67);
 }
 .elem-fill-question .option-item:first-child {
   text-align: center;
   border: none;
   font-size: 12px;
-  line-height: 12px;
+  line-height: 10px;
   color: #000;
 }
 .elem-fill-question .option-item:first-child > i {
   transform: scale(0.9, 0.9);
+  -webkit-transform: scale(0.9, 0.9);
 }
 .elem-fill-question .option-item:last-child {
   margin-right: 0 !important;
@@ -1002,6 +1020,7 @@
   padding-bottom: 5px;
   padding-right: 3px;
   transform: translateY(-100%);
+  -webkit-transform: translateY(-100%);
 }
 .elem-fill-line .elem-fill-quesiton li.elem-fill-comma {
   position: absolute;
@@ -1009,6 +1028,7 @@
   right: -10px;
   z-index: 9;
   transform: translateY(-100%);
+  -webkit-transform: translateY(-100%);
   width: 10px;
   padding-bottom: 4px;
   background-color: #fff;
@@ -1112,6 +1132,7 @@
 .elem-fill-number .fill-number-option > i {
   display: inline-block;
   transform: scale(0.67, 0.67);
+  -webkit-transform: scale(0.67, 0.67);
 }
 
 .elem-fill-field {
@@ -1187,6 +1208,7 @@
   left: 0;
   top: 50%;
   transform: translateY(-50%);
+  -webkit-transform: translateY(-50%);
   font-size: 30px;
   text-align: center;
 }

card/elements/fill-question/model.js

@@ -108,7 +108,7 @@ const getFullModel = (model, { pageSize, columnNumber }) => {
     if (model.optionDirection === "vertical") {
       const optionCount = model.optionCount + 1;
       const optionsHeight =
-        12 * optionCount + (optionCount - 1) * model.optionGap + 20;
+        10 * optionCount + (optionCount - 1) * model.optionGap + 20;
       child.h = i ? optionsHeight : optionsHeight + 34;
     } else {
       const optionCount =
@@ -116,7 +116,7 @@ const getFullModel = (model, { pageSize, columnNumber }) => {
           ? Math.min(child.questionsCount, model.questionCountPerGroup)
           : Math.ceil(child.questionsCount / groupPerLine);
       const optionsHeight =
-        12 * optionCount + (optionCount - 1) * model.questionGap + 20;
+        10 * optionCount + (optionCount - 1) * model.questionGap + 20;
       child.h = i ? optionsHeight : optionsHeight + 34;
     }
     child.minHeight = child.h;