Browse Source

feat: 样式修改

zhangjie 2 tháng trước cách đây
mục cha
commit
5e6fc13083

+ 3 - 0
src/assets/styles/element-ui-costom.scss

@@ -397,6 +397,9 @@
     padding-left: 10px;
     padding-right: 10px;
   }
+  .cell {
+    line-height: 22px;
+  }
   // caret-wrapper
   .caret-wrapper {
     width: 20px;

+ 41 - 8
src/assets/styles/pages.scss

@@ -1034,17 +1034,50 @@
     justify-content: space-between;
     margin-bottom: 10px;
   }
-  .answer-column {
-    padding: 1px;
-    .el-form-item {
-      margin: 12px 0;
+  // .answer-column {
+  //   padding: 1px;
+  //   .el-form-item {
+  //     margin: 12px 0;
+  //   }
+
+  //   .el-form-item__error {
+  //     padding-top: 0px;
+  //   }
+  //   .el-form-item__content {
+  //     line-height: 32px;
+  //   }
+  // }
+}
+.modify-mark-params {
+  // el-table
+  .el-table__body {
+    .el-table__cell {
+      padding-top: 6px;
+      padding-bottom: 6px;
     }
+    .input-column {
+      .cell {
+        padding: 0 2px;
+        margin: -6px 0;
+      }
 
-    .el-form-item__error {
-      padding-top: 0px;
+      .el-table__cell {
+        padding: 1px 0;
+      }
+      .el-input__inner {
+        border-radius: 3px;
+        padding-left: 8px;
+        padding-right: 8px;
+      }
+
+      .error-tips {
+        font-size: 12px;
+        line-height: 1;
+        margin: 0;
+      }
     }
-    .el-form-item__content {
-      line-height: 32px;
+    .el-input.is-error .el-input__inner {
+      border-color: $--color-danger;
     }
   }
 }

+ 1 - 0
src/modules/mark/components/markParam/MarkParamGroup.vue

@@ -194,6 +194,7 @@ export default {
     this.getPaperList();
     this.getCardPages();
     this.registResize();
+    this.updateList();
   },
   methods: {
     ...mapMutations("markParam", [

+ 47 - 57
src/modules/mark/components/markParam/MarkParamObjectiveAnswer.vue

@@ -40,8 +40,8 @@
         ref="TableList"
         :data="tableData"
         :row-class-name="getRowClassName"
-        border
         :height="tableHeight"
+        border
       >
         <el-table-column width="50" align="center">
           <template slot-scope="scope" v-if="scope.row.mainFirstSub">
@@ -75,31 +75,28 @@
         ></el-table-column>
         <el-table-column prop="totalScore" label="小题满分" width="85">
         </el-table-column>
-        <el-table-column label="答案" width="140px" class-name="answer-column">
-          <div
-            slot-scope="scope"
-            :class="['el-form-item', { 'is-error': scope.row.answerError }]"
-          >
-            <div class="el-form-item__content">
-              <el-input
-                v-model.trim="scope.row.answer"
-                :placeholder="
-                  scope.row.type === 3 ? 'A:正确,B:错误' : '请输入答案'
-                "
-                :maxlength="scope.row.optionCount"
-                clearable
-                @change="answerChange(scope.row)"
-              ></el-input>
-              <div v-if="scope.row.answerError" class="el-form-item__error">
-                {{ scope.row.answerError }}
-              </div>
-            </div>
-          </div>
+        <el-table-column label="答案" width="140px" class-name="input-column">
+          <template slot-scope="scope">
+            <el-input
+              v-model.trim="scope.row.answer"
+              :placeholder="
+                scope.row.type === 3 ? 'A:正确,B:错误' : '请输入答案'
+              "
+              :maxlength="scope.row.optionCount"
+              size="mini"
+              clearable
+              :class="{ 'is-error': scope.row.answerError }"
+              @change="answerChange(scope.row)"
+            ></el-input>
+            <p v-if="scope.row.answerError" class="color-danger error-tips">
+              {{ scope.row.answerError }}
+            </p>
+          </template>
         </el-table-column>
         <el-table-column
           label="判分策略"
-          width="270px"
-          class-name="answer-column"
+          width="250px"
+          class-name="input-column"
         >
           <template slot="header">
             <span>判分策略</span>
@@ -121,7 +118,8 @@
             <template v-if="scope.row.questionType === 2">
               <el-select
                 v-model="scope.row.objectivePolicy"
-                style="width: 120px"
+                style="width: 130px"
+                size="mini"
                 @change="objectivePolicyChange(scope.row)"
               >
                 <el-option
@@ -133,39 +131,29 @@
               </el-select>
               <div
                 v-if="scope.row.objectivePolicy === 'LEAK'"
-                :class="[
-                  'el-form-item',
-                  { 'is-error': scope.row.objectivePolicyError },
-                ]"
+                :class="[{ 'is-error': scope.row.objectivePolicyError }]"
                 style="display: inline-block"
               >
-                <div class="el-form-item__content">
-                  <el-input-number
-                    v-model="scope.row.objectivePolicyScore"
-                    :disabled="scope.row.answer.length <= 1"
-                    style="width: 110px; margin-left: 5px"
-                    size="small"
-                    :min="0"
-                    :max="100"
-                    :step="0.1"
-                    step-strictly
-                    :controls="false"
-                    placeholder="每个选项得分"
-                    @change="objectivePolicyScoreChange(scope.row)"
-                  ></el-input-number>
-                  <div
-                    v-if="scope.row.objectivePolicyError"
-                    class="el-form-item__error"
-                    style="
-                      right: 0;
-                      left: auto;
-                      width: 210px;
-                      text-align: right;
-                    "
-                  >
-                    {{ scope.row.objectivePolicyError }}
-                  </div>
-                </div>
+                <el-input-number
+                  v-model="scope.row.objectivePolicyScore"
+                  :disabled="!scope.row.answer || scope.row.answer.length <= 1"
+                  style="width: 110px; margin-left: 5px"
+                  size="mini"
+                  :min="0"
+                  :max="100"
+                  :step="0.1"
+                  step-strictly
+                  :controls="false"
+                  placeholder="每个选项得分"
+                  @change="objectivePolicyScoreChange(scope.row)"
+                ></el-input-number>
+              </div>
+              <div
+                v-if="scope.row.objectivePolicyError"
+                class="color-danger error-tips"
+                style="text-align: right"
+              >
+                {{ scope.row.objectivePolicyError }}
               </div>
             </template>
             <template
@@ -175,7 +163,8 @@
             >
               <el-select
                 v-model="scope.row.objectivePolicy"
-                style="width: 120px"
+                style="width: 130px"
+                size="mini"
               >
                 <el-option
                   v-for="(val, key) in QUESTION_SCORE_TYPE_SIMPLE"
@@ -319,7 +308,7 @@ export default {
       this.tableData = this.tableDict[this.curPaperType];
     },
     getRowClassName({ row }) {
-      let classNames = [];
+      let classNames = ["row-vertical-top"];
       if (row.mainFirstSub) {
         classNames.push("row-main-first-sub");
       }
@@ -416,6 +405,7 @@ export default {
     },
     objectivePolicyChange(row) {
       row.objectivePolicyScore = undefined;
+      row.objectivePolicyError = "";
     },
     async save() {
       if (!this.checkData()) return;

+ 22 - 8
src/modules/mark/components/markParam/MarkParamStructure.vue

@@ -135,7 +135,7 @@
           label="小题号"
           width="80"
         ></el-table-column>
-        <el-table-column label="每题分值" width="120">
+        <el-table-column label="每题分值" width="100" class-name="input-column">
           <template slot="header">
             <span>每题分值</span>
             <el-tooltip effect="dark" placement="top">
@@ -152,7 +152,7 @@
             <el-input-number
               v-model="scoresPerTopic[scope.row.mainId]"
               class="width-full"
-              size="small"
+              size="mini"
               :min="0"
               :max="500"
               :step="0.1"
@@ -163,12 +163,17 @@
             ></el-input-number>
           </template>
         </el-table-column>
-        <el-table-column prop="totalScore" label="小题满分" width="120">
+        <el-table-column
+          prop="totalScore"
+          label="小题满分"
+          width="100"
+          class-name="input-column"
+        >
           <template slot-scope="scope">
             <el-input-number
               v-model="scope.row.totalScore"
               class="width-full"
-              size="small"
+              size="mini"
               :min="0"
               :max="500"
               :step="0.1"
@@ -179,7 +184,11 @@
             ></el-input-number>
           </template>
         </el-table-column>
-        <el-table-column label="每题最小分" width="120">
+        <el-table-column
+          label="每题最小分"
+          width="120"
+          class-name="input-column"
+        >
           <template
             slot-scope="scope"
             v-if="scope.row.mainFirstSub && !scope.row.objective"
@@ -187,7 +196,7 @@
             <el-input-number
               v-model="intervalScorePerTopic[scope.row.mainId]"
               class="width-full"
-              size="small"
+              size="mini"
               :min="0.1"
               :max="500"
               :step="0.1"
@@ -198,7 +207,12 @@
             ></el-input-number>
           </template>
         </el-table-column>
-        <el-table-column prop="intervalScore" label="最小分" width="120">
+        <el-table-column
+          prop="intervalScore"
+          label="最小分"
+          width="120"
+          class-name="input-column"
+        >
           <template slot="header">
             <span>最小分</span>
             <el-tooltip effect="dark" placement="top">
@@ -220,7 +234,7 @@
             <el-input-number
               v-model="scope.row.intervalScore"
               class="width-full"
-              size="small"
+              size="mini"
               :min="0.1"
               :max="scope.row.totalScore"
               :step="0.1"