场次考试时长修改

src/features/examwork/ActivityManagement/ActivityEdit.vue

@@ -39,6 +39,7 @@
               placeholder="选择日期时间"
               style="width: 188px;"
               value-format="timestamp"
+              @change="getMaxDurationSeconds(item)"
             >
             </el-date-picker>
           </el-form-item>
@@ -49,14 +50,23 @@
               placeholder="选择日期时间"
               style="width: 188px;"
               value-format="timestamp"
+              @change="getMaxDurationSeconds(item)"
             >
             </el-date-picker>
           </el-form-item>
-          <el-form-item label="考试时长" prop="maxDurationSeconds">
-            <MinuteInput
+          <el-form-item label="考试时长">
+            <div
+              class="el-input el-input--small el-input-group el-input-group--append"
+            >
+              <div class="el-input__inner">
+                {{ item.maxDurationSeconds | minuteFilter }}
+              </div>
+              <div class="el-input-group__append">分钟</div>
+            </div>
+            <!-- <MinuteInput
               v-model="item.maxDurationSeconds"
               style="width: 125px;"
-            />
+            /> -->
           </el-form-item>
           <el-form-item label="候考时间" prop="prepareSeconds">
             <MinuteInput v-model="item.prepareSeconds" style="width: 125px;" />
@@ -114,7 +124,6 @@ export default {
           maxDurationSeconds: 0,
         },
       ],
-
       exam: {},
       activity: {},
       loading: false,
@@ -153,6 +162,7 @@ export default {
     // };
     // }
   },
+
   methods: {
     rules(index) {
       return {
@@ -230,6 +240,15 @@ export default {
         openingSeconds: [{ required: true, message: "迟到时长必填" }],
       };
     },
+    getMaxDurationSeconds(item) {
+      const ft = item.finishTime;
+      const st = item.startTime;
+      if (!st || !ft || ft <= st) {
+        item.maxDurationSeconds = 0;
+      } else {
+        item.maxDurationSeconds = ft - st;
+      }
+    },
     addActivity() {
       this.form.push({
         id: "",

src/features/examwork/ActivityManagement/ActivityManagementDialog.vue

@@ -20,6 +20,7 @@
             type="datetime"
             placeholder="选择日期时间"
             value-format="timestamp"
+            @change="getMaxDurationSeconds"
           >
           </el-date-picker>
         </el-form-item>
@@ -31,13 +32,22 @@
             type="datetime"
             placeholder="选择日期时间"
             value-format="timestamp"
+            @change="getMaxDurationSeconds"
           >
           </el-date-picker>
         </el-form-item>
       </el-row>
       <el-row>
-        <el-form-item label="考试时长" prop="maxDurationSeconds">
-          <MinuteInput v-model="form.maxDurationSeconds" />
+        <el-form-item label="考试时长">
+          <!-- <MinuteInput v-model="form.maxDurationSeconds" /> -->
+          <div
+            class="el-input el-input--small el-input-group el-input-group--append"
+          >
+            <div class="el-input__inner">
+              {{ form.maxDurationSeconds | minuteFilter }}
+            </div>
+            <div class="el-input-group__append">分钟</div>
+          </div>
         </el-form-item>
       </el-row>
       <el-row>
@@ -239,6 +249,15 @@ export default {
     closeDialog() {
       this.visible = false;
     },
+    getMaxDurationSeconds() {
+      const ft = this.form.finishTime;
+      const st = this.form.startTime;
+      if (!st || !ft || ft <= st) {
+        this.form.maxDurationSeconds = 0;
+      } else {
+        this.form.maxDurationSeconds = ft - st;
+      }
+    },
     async submitForm() {
       try {
         await this.$refs.form.validate();

src/filters/index.js

@@ -64,3 +64,6 @@ Vue.filter("examRecordStatusFilter", function (val) {
   if (val === null) return "";
   return EXAM_RECORD_STATUS[val];
 });
+Vue.filter("minuteFilter", function (val) {
+  return Math.floor(val / (1000 * 60));
+});