bugfix

src/modules/card/assets/styles/card-preview.scss

@@ -18,7 +18,7 @@
   }
   // 印刷模式：隐藏客观题强调标记
   .elem-fill-question-first {
-    &::before {
+    .fill-question-sign {
       display: none;
     }
   }
@@ -809,8 +809,7 @@
   white-space: normal;
 
   // 客观题强调标记
-  &-first::before {
-    content: "";
+  .fill-question-sign {
     position: absolute;
     right: 0;
     top: 0;
@@ -820,26 +819,23 @@
     line-height: 1;
     font-size: 18px;
     border-bottom-left-radius: 10px;
-  }
+    display: none;
 
-  &-first.elem-fill-question-simple {
-    &::before {
-      content: "单选";
+    &.is-simple {
       background-color: mix(#fff, $--color-success, 20%);
     }
-  }
-  &-first.elem-fill-question-multiply {
-    &::before {
-      content: "多选";
+    &.is-multiply {
       background-color: $--color-primary-light;
     }
-  }
-  &-first.elem-fill-question-boolean {
-    &::before {
-      content: "判断";
+    &.is-boolean {
       background-color: mix(#fff, $--color-warning, 20%);
     }
   }
+  &-first {
+    .fill-question-sign {
+      display: block;
+    }
+  }
 
   .elem-body {
     padding: 18px 0 18px 16px;

src/modules/card/assets/styles/card-temp.css

@@ -18,7 +18,7 @@
   box-shadow: none;
   page-break-after: always;
 }
-.card-print .elem-fill-question::before {
+.card-print .elem-fill-question-first .fill-question-sign {
   display: none;
 }
 
@@ -47,8 +47,15 @@
   width: 1586px;
   height: 1122px;
 }
-.page-box-A3 .page-main-inner {
-  padding: 60px 80px 86px;
+.page-box-A3.page-box-0 .page-main-inner {
+  padding: 60px 40px 86px 160px;
+}
+.page-box-A3.page-box-1 .page-main-inner {
+  padding: 60px 160px 86px 40px;
+}
+.page-box-A3.page-box-1 .page-main-side {
+  right: 40px;
+  left: auto;
 }
 .page-box-A3 .page-main-1 .page-column-forbid-area::before {
   width: 2000px;
@@ -61,12 +68,12 @@
   transform: rotate(-34.326deg);
 }
 .page-box-A3 .page-main-2 .page-column-forbid-area::before {
-  -webkit-transform: rotate(54.216deg);
-  transform: rotate(54.216deg);
+  -webkit-transform: rotate(54.98deg);
+  transform: rotate(54.98deg);
 }
 .page-box-A3 .page-main-2 .page-column-forbid-area::after {
-  -webkit-transform: rotate(-54.216deg);
-  transform: rotate(-54.216deg);
+  -webkit-transform: rotate(-54.98deg);
+  transform: rotate(-54.98deg);
 }
 .page-box-A3 .page-main-3 .page-column-forbid-area::before {
   -webkit-transform: rotate(64.6555deg);
@@ -108,13 +115,34 @@
   transform: rotate(-70.5109deg);
 }
 
+.page-main-side {
+  position: absolute;
+  top: 60px;
+  bottom: 86px;
+  width: 90px;
+  left: 40px;
+  z-index: 10;
+}
+.page-main-side .free-topic-preview {
+  position: absolute;
+}
+.page-main-side .element-item-gutter {
+  height: 100% !important;
+}
+.page-main-side .element-item-fill-field {
+  -webkit-transform: rotate(-90deg);
+  transform: rotate(-90deg);
+  -webkit-transform-origin: 0 0;
+  transform-origin: 0 0;
+}
+
 .page-main-inner {
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
-  padding: 60px 80px 86px;
+  padding: 60px 40px 86px 40px;
   z-index: 9;
   font-size: 0;
 }
@@ -154,7 +182,7 @@
   display: block;
   position: absolute;
   width: 1200px;
-  border-bottom: 1px solid #acacac;
+  border-bottom: 1px solid rgb(172, 172, 172);
   top: 0;
   left: 0;
   -webkit-transform: rotate(54.216deg);
@@ -168,7 +196,7 @@
   display: block;
   position: absolute;
   width: 1200px;
-  border-bottom: 1px solid #acacac;
+  border-bottom: 1px solid rgb(172, 172, 172);
   bottom: 0;
   left: 0;
   -webkit-transform: rotate(-54.216deg);
@@ -251,12 +279,18 @@
   .element-item-card-head.element-item-type-pre::before {
   border-bottom: none;
 }
+.page-column .page-number {
+  position: absolute;
+  width: 100%;
+  text-align: center;
+  bottom: -20px;
+}
 
 .page-locators {
   position: absolute;
   top: 60px;
-  left: 80px;
-  right: 80px;
+  left: 160px;
+  right: 40px;
   bottom: 86px;
   z-index: 8;
 }
@@ -276,7 +310,7 @@
 }
 .page-locator-group:last-child {
   left: auto;
-  right: 96px;
+  right: 0;
 }
 .page-locator-group li {
   position: absolute;
@@ -291,16 +325,15 @@
   bottom: -46px;
 }
 
-.page-box-1 .page-locator-group:first-child {
-  left: -30px;
+.page-box-1 .page-locators {
+  left: 40px;
+  right: 160px;
 }
 
-.page-number {
+.page-number-rect {
   position: absolute;
   bottom: 40px;
-}
-.page-number-rect {
-  left: 152px;
+  left: 240px;
 }
 .page-number-rect-list {
   font-size: 0;
@@ -309,18 +342,15 @@
   display: inline-block;
   vertical-align: top;
   font-size: 14px;
-  width: 24px;
-  height: 16px;
+  width: 30px;
+  height: 20px;
   border: 1px solid #000;
   margin-right: 10px;
 }
 .page-number-rect-list li.rect-li-act {
   height: 0;
   border: none;
-  border-bottom: 16px solid #000;
-}
-.page-number-text {
-  right: 25%;
+  border-bottom: 20px solid #000;
 }
 .page-number-text-cont {
   height: 16px;
@@ -330,7 +360,7 @@
 .elem-title {
   padding: 10px;
   font-size: 14px;
-  color: black;
+  color: rgb(0, 0, 0);
   line-height: 1;
   white-space: normal;
 }
@@ -363,53 +393,30 @@
   vertical-align: middle;
 }
 
-.card-head-top {
+.card-head-title {
   text-align: center;
   color: #000;
-}
-.card-head-title {
   font-size: 24px;
   font-weight: bold;
   overflow: hidden;
 }
 .card-head-title > h1 {
-  line-height: 33px;
+  line-height: 40px;
   white-space: nowrap;
   letter-spacing: -1px;
 }
-.card-head-subtitle {
-  height: 44px;
-  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
-    "Microsoft YaHei", Arial, sans-serif;
-  font-size: 14px;
-  overflow: hidden;
-  white-space: normal;
-  margin-bottom: 10px;
-}
-.card-head-subtitle > p {
-  padding: 0 10px;
-  line-height: 22px;
-  white-space: pre;
-}
-.card-head-body {
-  font-weight: normal;
+.card-head-info {
+  padding-bottom: 30px;
 }
-.card-head-body .el-col {
-  padding-top: 5px;
-  padding-bottom: 5px;
-}
-.card-head-body-spin {
-  padding: 5px 12px;
-  white-space: normal;
-  word-break: break-all;
-}
-.card-head-body .stdinfo-item {
+.card-head-info .info-item {
   height: 30px;
   line-height: 30px;
   position: relative;
   overflow: hidden;
+  width: 80%;
+  margin: 0 auto;
 }
-.card-head-body .stdinfo-item::after {
+.card-head-info .info-item::after {
   content: "";
   display: block;
   position: absolute;
@@ -419,217 +426,77 @@
   left: 0;
   z-index: 1;
 }
-.card-head-body .stdinfo-item > span {
+.card-head-info .info-item > span {
   z-index: 2;
   display: block;
   position: relative;
   font-size: 14px;
 }
-.card-head-body .stdinfo-item > span:first-child {
+.card-head-info .info-item > span:first-child {
   float: left;
   background-color: #fff;
   text-align: justify;
 }
-.card-head-body .stdinfo-item > span:first-child::after {
-  content: "";
-  display: inline-block;
-  width: 100%;
-  height: 0;
-  line-height: 0;
-}
-.card-head-body .stdinfo-item > span:nth-of-type(2) {
+.card-head-info .info-item > span:nth-of-type(2) {
   float: left;
   width: 20px;
   background-color: #fff;
 }
-.card-head-body .stdinfo-item > span:last-child {
-  margin-left: 80px;
-  height: 100%;
-}
-.card-head-body .head-stdno {
-  height: 100%;
-  padding: 0;
-}
-.card-head-body .head-stdno .stdno-empty {
-  font-weight: bold;
-  letter-spacing: 3px;
-  text-align: center;
-}
-.card-head-body .head-stdno .stdno-fill {
-  min-height: 284px;
-  height: 100%;
-  position: relative;
-}
-.card-head-body .head-stdno .stdno-fill-rect {
-  font-size: 0;
-  height: 27px;
-  border-bottom: 1px solid #333;
-}
-.card-head-body .head-stdno .stdno-fill-number {
-  display: inline-block;
-  vertical-align: top;
-  width: 7.692%;
+.card-head-info .info-item > span:last-child {
   height: 100%;
 }
-.card-head-body .head-stdno .stdno-fill-number:not(:last-child) {
-  border-right: 1px solid #333;
-}
-.card-head-body .head-stdno .stdno-fill-head {
-  position: absolute;
-  width: 100%;
-  height: 51px;
-  top: 0;
-  left: 0;
-  z-index: 9;
-}
-.card-head-body .head-stdno .stdno-fill-head > h5 {
-  border-bottom: 1px solid #333;
-  line-height: 24px;
-  font-size: 16px;
-  font-weight: bold;
-  text-align: center;
-}
-.card-head-body .head-stdno .stdno-fill-body {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  padding-top: 51px;
-  display: table;
-  width: 100%;
-}
-.card-head-body .head-stdno .stdno-fill-list {
-  display: table-cell;
-  width: 7.692%;
-  padding: 1px 0;
-}
-.card-head-body .head-stdno .stdno-fill-option {
-  margin: 8px auto;
-  width: 20px;
-  height: 14px;
-  font-size: 12px;
-  line-height: 1;
-  text-align: center;
-  color: #000;
+.card-head-notice {
   border: 1px solid #000;
-  font-family: "Times New Roman", Arial, sans-serif;
-}
-.card-head-body .head-stdno .stdno-fill-option > i {
-  display: inline-block;
-  -webkit-transform: scale(0.67, 0.67);
-  transform: scale(0.67, 0.67);
-}
-.card-head-body .head-stdno .stdno-auto-barcode {
-  height: 70px;
-  text-align: center;
+  padding: 6px 8px;
 }
-.card-head-body .head-stdno .stdno-auto-barcode > img {
-  display: block;
-  height: 50px;
-  width: 300px;
-  margin: 0 auto;
-}
-.card-head-body .head-stdno .stdno-auto-barcode > p {
-  line-height: 20px;
-}
-.card-head-body .head-notice > h4 {
+.card-head-notice > h4 {
   font-weight: normal;
   margin-bottom: 8px;
 }
-.card-head-body .head-notice-cont {
+.card-head-notice-cont {
   line-height: 1.5;
   font-size: 12px;
   margin-bottom: 5px;
 }
-.card-head-body .head-notice-cont > span {
+.card-head-notice-cont > span {
   display: block;
 }
-.card-head-body .head-notice-cont > span:first-child {
+.card-head-notice-cont > span:first-child {
   width: 20px;
   white-space: nowrap;
   float: left;
 }
-.card-head-body .head-notice-cont > span:last-child {
+.card-head-notice-cont > span:last-child {
   margin-left: 20px;
+  white-space: normal;
 }
-.card-head-body .head-notice-exam-number-fill span {
-  display: inline;
-}
-.card-head-body .head-notice-exam-number-fill span:first-child {
-  float: none;
-}
-.card-head-body .head-notice-exam-number-fill span:last-child {
-  margin: 0;
-}
-.card-head-body .head-dynamic {
-  padding: 0;
-  font-size: 12px;
-  border-spacing: 0;
-  border-collapse: collapse;
-}
-.card-head-body .head-dynamic-part:not(:last-child) {
-  border-bottom: 1px solid #000;
-}
-.card-head-body .head-dynamic-write {
-  padding: 5px 12px;
-}
-.card-head-body .head-dynamic-write .stdinfo-item {
-  margin-bottom: 0;
-}
-.card-head-body .head-dynamic-write > p {
-  line-height: 18px;
-}
-.card-head-body .head-dynamic-missfill {
-  display: table;
-  width: 100%;
-}
-.card-head-body .head-dynamic-miss {
-  padding: 10px;
-  display: table-cell;
-  vertical-align: middle;
-}
-.card-head-body .head-dynamic-miss:nth-of-type(2) {
-  border-left: 1px solid #000;
-}
-.card-head-body .head-dynamic-miss span {
-  display: block;
-}
-.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;
-  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;
+.card-head-dynamic {
+  padding: 6px 8px;
+  border: 1px solid #000;
+  border-top: none;
 }
-.card-head-body .head-dynamic-fill p {
+.card-head-dynamic p {
   display: inline-block;
   vertical-align: middle;
   line-height: 18px;
   word-wrap: normal;
 }
-.card-head-body .head-dynamic-fill p:first-child {
-  margin-right: 20px;
+.card-head-dynamic p:first-child {
+  margin-right: 100px;
 }
-.card-head-body .head-dynamic-fill p > span,
-.card-head-body .head-dynamic-fill p > i {
+.card-head-dynamic p > span,
+.card-head-dynamic p > i {
   display: inline-block;
   vertical-align: middle;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
 }
-.card-head-body .head-dynamic-fill p:first-child i {
+.card-head-dynamic p:first-child i {
   width: 28px;
   height: 14px;
   background-color: #000;
 }
-.card-head-body .head-dynamic-fill p:last-child > i {
+.card-head-dynamic p:last-child > i {
   width: 28px;
   height: 14px;
   border: 1px solid #000;
@@ -639,10 +506,10 @@
   line-height: 12px;
   text-align: center;
 }
-.card-head-body .head-dynamic-fill p:last-child > i:last-child {
+.card-head-dynamic p:last-child > i:last-child {
   margin-right: 0;
 }
-.card-head-body .head-dynamic-fill p:last-child > i:nth-of-type(3)::before {
+.card-head-dynamic p:last-child > i:nth-of-type(3)::before {
   content: "";
   display: inline-block;
   vertical-align: top;
@@ -651,7 +518,7 @@
   width: 5px;
   background-color: #000;
 }
-.card-head-body .head-dynamic-fill p:last-child > i:nth-of-type(4)::before {
+.card-head-dynamic p:last-child > i:nth-of-type(4)::before {
   content: "";
   display: inline-block;
   margin-top: 1px;
@@ -660,120 +527,6 @@
   border-radius: 50%;
   background-color: #000;
 }
-.card-head-body .head-dynamic-rect {
-  display: inline-block;
-  width: 30px;
-  height: 14px;
-  border: 1px solid #000;
-  font-size: 12px;
-  text-align: center;
-  line-height: 1;
-  color: #000;
-  margin: 0 5px;
-  font-family: "Times New Roman", Arial, sans-serif;
-}
-.card-head-body .head-dynamic-rect > i {
-  display: inline-block;
-  -webkit-transform: scale(0.67, 0.67);
-  transform: scale(0.67, 0.67);
-}
-.card-head-body .head-dynamic-aorb {
-  display: table;
-  width: 100%;
-}
-.card-head-body .head-dynamic-aorb .dynamic-aorb-item {
-  display: table-cell;
-  vertical-align: middle;
-  text-align: center;
-}
-.card-head-body .head-dynamic-aorb .dynamic-aorb-item:not(:last-child) {
-  border-right: 1px solid #333;
-}
-.card-head-body .head-dynamic-aorb-fill .dynamic-aorb-item:first-child {
-  border: none;
-}
-.card-head-body .head-dynamic-aorb .dynamic-aorb-title {
-  width: 83px;
-}
-.card-head-body .head-dynamic-aorb .dynamic-aorb-info {
-  width: 50px;
-  font-size: 16px;
-  position: relative;
-  overflow: hidden;
-}
-.card-head-body .head-dynamic-aorb .dynamic-aorb-info .dynamic-aorb-content {
-  position: absolute;
-  top: 50%;
-  left: 0;
-  width: 100%;
-  -webkit-transform: translateY(-50%);
-  transform: translateY(-50%);
-  z-index: auto;
-}
-.card-head-body .head-dynamic-aorb .dynamic-aorb-barcode img {
-  display: block;
-  position: relative;
-  margin: 0 auto;
-  width: 200px;
-  height: 26px;
-  padding: 7px 0;
-}
-.card-head-body .head-dynamic-aorb .dynamic-aorb-rects {
-  padding: 16px 10px;
-}
-.card-head-part {
-  border: 1px solid #333;
-}
-.card-head-part:not(:last-child) {
-  margin-bottom: 10px;
-}
-.card-head-normal .head-dynamic-1 .head-dynamic-part {
-  height: 100%;
-}
-.card-head-narrow .head-stdno {
-  height: 138px;
-}
-.card-head-narrow .head-stdno .stdno-auto {
-  position: relative;
-  top: 50%;
-  margin-top: -40px;
-}
-.card-head-handle.card-head-narrow .head-stdno {
-  height: 286px;
-}
-
-.card-head-body-auto-resize {
-  margin-left: -5px;
-  margin-right: -5px;
-  overflow: hidden;
-}
-.card-head-body-auto-resize.col-item-auto-height .card-head-body-spin {
-  height: auto;
-}
-.card-head-body-auto-resize .head-dynamic-2 .head-dynamic-part {
-  height: auto;
-}
-.card-head-body-auto-resize .rect-col {
-  padding: 5px;
-}
-.card-head-body-auto-resize .rect-col:first-child {
-  float: left;
-  width: 289px;
-}
-.card-head-body-auto-resize .rect-col:last-child {
-  float: right;
-  width: 424px;
-}
-.card-head-body-auto-resize .rect-col-item {
-  border: 1px solid #333;
-}
-.card-head-body-auto-resize .rect-col-item:nth-of-type(2) {
-  margin-top: 10px;
-}
-.card-head-body-auto-resize .rect-col-item-none {
-  border: none;
-  margin: 0 !important;
-}
 
 .elem-topic-head {
   text-align: center;
@@ -914,8 +667,7 @@
 .elem-fill-question {
   white-space: normal;
 }
-.elem-fill-question::before {
-  content: "";
+.elem-fill-question .fill-question-sign {
   position: absolute;
   right: 0;
   top: 0;
@@ -925,21 +677,23 @@
   line-height: 1;
   font-size: 18px;
   border-bottom-left-radius: 10px;
+  display: none;
 }
-.elem-fill-question-simple::before {
-  content: "单选";
+.elem-fill-question .fill-question-sign.is-simple {
   background-color: #65d5ad;
 }
-.elem-fill-question-multiply::before {
-  content: "多选";
+.elem-fill-question .fill-question-sign.is-multiply {
   background-color: #617bea;
 }
-.elem-fill-question-boolean::before {
-  content: "判断";
+.elem-fill-question .fill-question-sign.is-boolean {
   background-color: #ffa952;
 }
+.elem-fill-question-first .fill-question-sign {
+  display: block;
+}
 .elem-fill-question .elem-body {
   padding: 18px 0 18px 16px;
+  font-size: 0px;
 }
 .elem-fill-question .group-item {
   font-family: "Times New Roman", Arial, sans-serif;
@@ -1214,13 +968,6 @@
   background-color: #fff;
   text-align: justify;
 }
-.fill-field-content > span:first-child::after {
-  content: "";
-  display: inline-block;
-  width: 100%;
-  height: 0;
-  line-height: 0;
-}
 .fill-field-content > span:nth-of-type(2) {
   width: 10px;
   background-color: #fff;
@@ -1240,6 +987,33 @@
   border: 1px solid #000;
 }
 
+.elem-gutter {
+  position: relative;
+  width: 30px;
+  height: 100%;
+}
+.elem-gutter-left {
+  border-right: 1px solid #000;
+}
+.elem-gutter-right {
+  border-left: 1px solid #000;
+}
+.elem-gutter-content {
+  position: absolute;
+  width: 100%;
+  top: 50%;
+  left: 0;
+  -webkit-transform: translateY(-50%);
+  transform: translateY(-50%);
+}
+.elem-gutter-content > span {
+  display: block;
+  padding: 5px;
+  line-height: 20px;
+  -webkit-transform: rotate(-90deg);
+  transform: rotate(-90deg);
+}
+
 .card-free-preview:not(.card-print) {
   padding: 10px 0;
   background-color: #f0f0f0;

src/modules/card/elements/fill-question/ElemFillQuestion.vue

@@ -32,6 +32,7 @@
         </li>
       </ul>
     </div>
+    <div :class="signClasses">{{ signName }}</div>
   </div>
 </template>
 
@@ -62,6 +63,25 @@ export default {
         },
       ];
     },
+    signName() {
+      if (this.data.isBoolean) {
+        return "判断";
+      } else if (this.data.isMultiply) {
+        return "多选";
+      } else {
+        return "单选";
+      }
+    },
+    signClasses() {
+      return [
+        "fill-question-sign",
+        {
+          "is-simple": !this.data.isMultiply && !this.data.isBoolean,
+          "is-multiply": this.data.isMultiply,
+          "is-boolean": this.data.isBoolean,
+        },
+      ];
+    },
     groupGapStyles() {
       return {
         marginRight: this.data.groupGap + "px",

src/modules/questions/views/EditPaper.vue

@@ -677,7 +677,6 @@
             <el-form-item label="时长">
               <el-input-number
                 v-model="quesModel.control.maxAnswerTime"
-                size="small"
                 :precision="0"
                 :min="1"
                 :disabled="updatePorperty"