打分表格元素新增

src/modules/paper-export/assets/styles/paper-temp-preview.scss

@@ -128,6 +128,25 @@
     list-style: decimal;
   }
 }
+// elem-score-table
+.elem-score-table {
+  text-align: center;
+
+  .score-table {
+    min-width: 80%;
+    max-width: 100%;
+    border-spacing: 0;
+    border-collapse: collapse;
+    margin: 0 auto;
+  }
+  td,
+  th {
+    border: 1px solid #000;
+    padding: 6px 2px;
+  }
+}
+
+// paper-template-view
 .paper-template-view {
   .element-item-paper-struct {
     height: auto !important;

src/modules/paper-export/components/RightClickMenu.vue

@@ -18,7 +18,7 @@
         </li>
       </ul>
       <ul v-else>
-        <li @click="toEdit">
+        <li v-if="!NO_EDIT_ELEMENT" @click="toEdit">
           <i class="el-icon-edit-outline"></i>
           {{ IS_CONTAINER_ELEMENT ? "编辑元素" : "编辑编辑框" }}
         </li>
@@ -69,6 +69,9 @@ export default {
           this.curElement.container.type === "PANE_BOX")
       );
     },
+    NO_EDIT_ELEMENT() {
+      return ["SCORE_TABLE"].includes(this.curElement.type);
+    },
   },
   mounted() {
     this.init();

src/modules/paper-export/components/TopicElementEdit.vue

@@ -3,7 +3,7 @@
     <element-resize
       v-model="elemData"
       :class="{ 'element-resize-act': curElement.id === data.id }"
-      :active="['b']"
+      :active="isStaticElement ? [] : ['b']"
       :move="false"
       :min-height="data.minHeight"
       :fit-parent="['h']"
@@ -30,6 +30,7 @@ import { checkElementisCovered } from "../store";
 
 import EditPaneBox from "../elements/pane-box/ElemPaneBoxEdit.vue";
 import EditPaperStruct from "../elements/paper-struct/ElemPaperStruct";
+import EditScoreTable from "../elements/score-table/ElemScoreTable.vue";
 
 import ElementResize from "../../card/components/common/ElementResize";
 import TopicNumber from "../../card/components/common/TopicNumber";
@@ -39,6 +40,7 @@ export default {
   components: {
     EditPaneBox,
     EditPaperStruct,
+    EditScoreTable,
     ElementResize,
     TopicNumber,
   },
@@ -80,6 +82,11 @@ export default {
         },
       ];
     },
+    isStaticElement() {
+      return ["PAPER_STRUCT", "SCORE_TABLE", "PAPER_PROPS"].includes(
+        this.data.type
+      );
+    },
   },
   created() {
     this.init();

src/modules/paper-export/components/TopicElementPreview.vue

@@ -14,12 +14,14 @@
 <script>
 import PreviewPaneBox from "../elements/pane-box/ElemPaneBox.vue";
 import PreviewPaperStruct from "../elements/paper-struct/ElemPaperStruct";
+import PreviewScoreTable from "../elements/score-table/ElemScoreTable.vue";
 
 export default {
   name: "TopicElementPreview",
   components: {
     PreviewPaneBox,
     PreviewPaperStruct,
+    PreviewScoreTable,
   },
   props: {
     data: {

src/modules/paper-export/elementModel.js

@@ -12,6 +12,8 @@ import { getModel as createFillPane } from "../card/elements/fill-pane/model";
 import { getModel as createPaneBox } from "./elements/pane-box/model";
 import { getModel as createFieldText } from "./elements/field-text/model";
 import { getModel as createPaperStruct } from "./elements/paper-struct/model";
+import { getModel as createScoreTable } from "./elements/score-table/model";
+import { getModel as createPaperProps } from "./elements/paper-props/model";
 
 // available infos
 const EDITABLE_ELEMENT = [
@@ -28,7 +30,12 @@ const EDITABLE_ELEMENT = [
   "FILL_TABLE",
   "FILL_PANE",
 ];
-const EDITABLE_TOPIC = ["PANE_BOX", "PAPER_STRUCT"];
+const EDITABLE_TOPIC = [
+  "PANE_BOX",
+  "PAPER_STRUCT",
+  "SCORE_TABLE",
+  "PAPER_PROPS",
+];
 
 const ELEMENT_INFOS = {
   LINES: {
@@ -87,6 +94,14 @@ const ELEMENT_INFOS = {
     name: "试卷结构",
     getModel: createPaperStruct,
   },
+  SCORE_TABLE: {
+    name: "给分表格",
+    getModel: createScoreTable,
+  },
+  PAPER_PROPS: {
+    name: "试卷属性",
+    getModel: createPaperProps,
+  },
 };
 
 const ELEMENT_LIST = EDITABLE_ELEMENT.map((type) => {

src/modules/paper-export/elements/paper-props/ElemPaperProps.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="elem-paper-props">
+    <div v-for="item in propList" :key="item.field" class="paper-prop-item">
+      <span class="paper-prop-label">{{ item.name }}:</span>
+      <div class="paper-prop-content">
+        <template v-if="item.options"> </template>
+        <template v-else></template>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "ElemPaperProps",
+  props: {
+    data: {
+      type: Object,
+      default() {
+        return {
+          props: [],
+        };
+      },
+    },
+  },
+  data() {
+    return {
+      propList: [],
+    };
+  },
+  mounted() {
+    this.propList = this.data.props.filter((item) => item.enable);
+  },
+  methods: {},
+};
+</script>

src/modules/paper-export/elements/paper-props/model.js

@@ -0,0 +1,47 @@
+import {
+  getElementId,
+  randomCode,
+  deepCopy,
+  objAssign,
+} from "../../../card/plugins/utils";
+
+const MODEL = {
+  type: "PAPER_PROPS",
+  x: 0,
+  y: 0,
+  w: 200,
+  h: 50,
+  props: [
+    {
+      name: "试卷类型",
+      field: "paperType",
+      options: ["A", "B"],
+      value: "",
+      enable: true,
+    },
+    {
+      name: "考试形式",
+      field: "examType",
+      options: ["开", "闭"],
+      value: "",
+      enable: true,
+    },
+    {
+      name: "考试时间",
+      field: "examTime",
+      options: null,
+      value: "",
+      enable: true,
+      unit: "分钟",
+    },
+  ],
+};
+
+const getModel = (presetData) => {
+  const model = objAssign(deepCopy(MODEL), presetData);
+  model.id = getElementId();
+  model.key = randomCode();
+  return model;
+};
+
+export { MODEL, getModel };

src/modules/paper-export/elements/score-table/ElemScoreTable.vue

@@ -0,0 +1,50 @@
+<template>
+  <div class="elem-score-table">
+    <table class="score-table">
+      <tr>
+        <th style="width: 60px; min-width: 40px">题号</th>
+        <th v-for="item in detailNums" :key="item" style="min-width: 40px">
+          {{ item }}
+        </th>
+        <th style="width: 60px; min-width: 40px">总分</th>
+        <th style="width: 80px; min-width: 60px">总分人</th>
+      </tr>
+      <tr>
+        <td style="width: 60px; min-width: 40px">得分</td>
+        <td v-for="item in detailNums" :key="item" style="min-width: 40px"></td>
+        <td style="width: 60px; min-width: 40px"></td>
+        <td style="width: 80px; min-width: 60px"></td>
+      </tr>
+    </table>
+  </div>
+</template>
+
+<script>
+import { numberToChinese } from "@/plugins/utils";
+export default {
+  name: "ElemScoreTable",
+  props: {
+    data: {
+      type: Object,
+      default() {
+        return {
+          detailCount: 5,
+        };
+      },
+    },
+  },
+  data() {
+    return {
+      detailNums: [],
+    };
+  },
+  mounted() {
+    let detailNums = [];
+    for (let i = 0; i < this.data.detailCount; i++) {
+      detailNums[i] = numberToChinese(i + 1);
+    }
+    this.detailNums = detailNums;
+  },
+  methods: {},
+};
+</script>

src/modules/paper-export/elements/score-table/model.js

@@ -0,0 +1,24 @@
+import {
+  getElementId,
+  randomCode,
+  deepCopy,
+  objAssign,
+} from "../../../card/plugins/utils";
+
+const MODEL = {
+  type: "SCORE_TABLE",
+  x: 0,
+  y: 0,
+  w: 200,
+  h: 67,
+  detailCount: 5,
+};
+
+const getModel = (presetData) => {
+  const model = objAssign(deepCopy(MODEL), presetData);
+  model.id = getElementId();
+  model.key = randomCode();
+  return model;
+};
+
+export { MODEL, getModel };