Quellcode durchsuchen

试卷导入新增总分校验参数

zhangjie vor 2 Jahren
Ursprung
Commit
a94dc49e2e

+ 1 - 0
src/modules/paper-export/elementModel.js

@@ -17,6 +17,7 @@ const EDITABLE_ELEMENT = [
   "LINE_VERTICAL",
   "LINES",
   "TEXT",
+  // "FIELD_TEXT",
   "IMAGE",
   "GRIDS",
   "PANE",

+ 137 - 0
src/modules/paper-export/elements/field-text/EditText.vue

@@ -0,0 +1,137 @@
+<template>
+  <div class="edit-text">
+    <el-form
+      ref="modalFormComp"
+      :key="modalForm.id"
+      :model="modalForm"
+      :rules="rules"
+      label-width="100px"
+    >
+      <el-form-item label="字号:">
+        <size-select
+          v-model="modalForm.fontSize"
+          style="width: 100%"
+        ></size-select>
+      </el-form-item>
+      <el-form-item label="字体:">
+        <font-family-select
+          v-model="modalForm.fontFamily"
+          style="width: 100%"
+        ></font-family-select>
+      </el-form-item>
+      <el-form-item label="颜色:">
+        <color-select v-model="modalForm.color"></color-select>
+      </el-form-item>
+      <el-form-item label="加粗:">
+        <el-checkbox v-model="isBold" @change="boldChange"
+          >是否加粗</el-checkbox
+        >
+      </el-form-item>
+      <el-form-item label="对齐:">
+        <el-radio-group v-model="modalForm.textAlign">
+          <el-radio-button label="left">左</el-radio-button>
+          <el-radio-button label="center">居中</el-radio-button>
+          <el-radio-button label="right">右</el-radio-button>
+          <el-radio-button label="justify">两端</el-radio-button>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item prop="field" label="字段:"> </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import SizeSelect from "../../components/common/SizeSelect";
+import ColorSelect from "../../components/common/ColorSelect";
+import FontFamilySelect from "../../components/common/FontFamilySelect";
+
+const initModalForm = {
+  id: "",
+  fontSize: "14px",
+  color: "",
+  fontFamily: "",
+  fontWeight: 400,
+  rotation: 0,
+  textAlign: null,
+  content: [],
+  contentStr: "",
+};
+
+export default {
+  name: "EditText",
+  components: {
+    SizeSelect,
+    ColorSelect,
+    FontFamilySelect,
+  },
+  props: {
+    instance: {
+      type: Object,
+      default() {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+      modalForm: { ...initModalForm },
+      isBold: false,
+      rules: {
+        contentStr: [
+          {
+            required: true,
+            message: "请输入文本内容",
+            trigger: "change",
+          },
+        ],
+      },
+    };
+  },
+  mounted() {
+    this.initData(this.instance);
+  },
+  methods: {
+    initData(val) {
+      const contentStr = val.content
+        .map((item) => {
+          return item.type === "text"
+            ? item.content
+            : "${" + item.content + "}";
+        })
+        .join("");
+      this.modalForm = { ...val, contentStr };
+      this.isBold = val.fontWeight > 400;
+    },
+    boldChange(isBold) {
+      this.modalForm.fontWeight = isBold ? 700 : 400;
+    },
+    contentChange() {
+      const constentStr = this.modalForm.contentStr;
+      const rexp = new RegExp(/\$\{.+?\}/, "g");
+      const variates = constentStr.match(rexp);
+      const texts = constentStr.split(rexp);
+      let contents = [];
+
+      texts.forEach((text, index) => {
+        if (text)
+          contents.push({
+            type: "text",
+            content: text,
+          });
+
+        if (variates && variates[index])
+          contents.push({
+            type: "variate",
+            content: variates[index].replace("${", "").replace("}", ""),
+          });
+      });
+      this.modalForm.content = contents;
+    },
+    async submit() {
+      const valid = await this.$refs.modalFormComp.validate().catch(() => {});
+      if (!valid) return;
+      this.$emit("modified", this.modalForm);
+    },
+  },
+};
+</script>

+ 53 - 0
src/modules/paper-export/elements/field-text/ElemText.vue

@@ -0,0 +1,53 @@
+<template>
+  <div class="elem-text" :style="elemStyles">
+    <div class="text-body" :style="styles">
+      <div>{{ content }}</div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "ElemText",
+  props: {
+    data: {
+      type: Object,
+      default() {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+      content: "",
+    };
+  },
+  computed: {
+    styles() {
+      return {
+        fontWeight: this.data.fontWeight,
+        fontFamily: this.data.fontFamily,
+        fontSize: this.data.fontSize,
+        color: this.data.color,
+        textAlign: this.data.textAlign || null,
+      };
+    },
+    elemStyles() {
+      if (this.data.mode === "side") {
+        return {
+          position: "absolute",
+          width: this.data.h + "px",
+          height: this.data.w + "px",
+          transform: "rotate(-90deg)",
+          "transform-origin": "0 100%",
+          bottom: 0,
+          left: this.data.w + "px",
+        };
+      } else {
+        return null;
+      }
+    },
+  },
+  methods: {},
+};
+</script>

+ 39 - 0
src/modules/paper-export/elements/field-text/model.js

@@ -0,0 +1,39 @@
+import { getElementId, randomCode, deepCopy } from "../../plugins/utils";
+
+const MODEL = {
+  type: "FIELD_TEXT",
+  x: 0,
+  y: 0,
+  w: 200,
+  h: 30,
+  sign: "",
+  textAlign: null,
+  fontWeight: 400,
+  fontFamily: "宋体",
+  fontSize: "14px",
+  color: "#000",
+  mode: "normal", // side:侧边模式,normal:正常模式
+  field: "",
+  content: "样例内容",
+};
+
+const getModel = () => {
+  return {
+    id: getElementId(),
+    key: randomCode(),
+    ...deepCopy(MODEL),
+  };
+};
+
+const FIELD_LIST = [
+  {
+    name: "试卷名称",
+    field: "paperName",
+  },
+  {
+    name: "科目名称",
+    field: "courseName",
+  },
+];
+
+export { MODEL, FIELD_LIST, getModel };

+ 9 - 7
src/modules/question/components/QuestionImportDialog.vue

@@ -49,13 +49,13 @@
         </el-input>
       </el-form-item>
       <el-form-item v-if="modalForm.useOriginalPaper" label="总分校验">
-        <el-radio-group v-model="scoreCheck">
+        <el-radio-group v-model="modalForm.checkTotalScore">
           <el-radio :label="true">开启</el-radio>
           <el-radio :label="false">关闭</el-radio>
         </el-radio-group>
       </el-form-item>
       <el-form-item
-        v-if="scoreCheck && modalForm.useOriginalPaper"
+        v-if="modalForm.checkTotalScore && modalForm.useOriginalPaper"
         label="试卷总分"
         prop="totalScore"
       >
@@ -94,6 +94,7 @@ import { mapState } from "vuex";
 const initModalForm = {
   courseId: null,
   name: "",
+  checkTotalScore: false,
   useOriginalPaper: false,
   totalScore: 0,
 };
@@ -104,7 +105,6 @@ export default {
   data() {
     return {
       modalIsShow: false,
-      scoreCheck: false,
       importType: "docx",
       modalForm: {
         ...initModalForm,
@@ -160,10 +160,12 @@ export default {
         }
       },
     },
-    scoreCheck(val) {
-      if (!val) {
-        this.modalForm.totalScore = 0;
-      }
+    "modalForm.checkTotalScore": {
+      handler(val) {
+        if (!val) {
+          this.modalForm.totalScore = 0;
+        }
+      },
     },
     importType(val) {
       if (val === "zip") {