学期信息新增重复校验

frontend/src/views/teachBusiness/semester/index.vue

@@ -84,26 +84,30 @@
 
     <!-- 学期信息弹窗 -->
     <el-dialog :title="title" :visible.sync="open" width="900px" append-to-body class="semester-dialog">
+      <el-alert v-if="isSemesterNameDuplicated()" class="semester-dup-alert" type="warning" show-icon
+        title="该学期已存在，不能重复添加" :closable="false" />
       <el-form ref="form" class="semester-dialog-form" :model="form" :rules="rules" label-width="96px"
         label-position="right">
         <el-row :gutter="20" class="semester-dialog-body">
           <!-- 左侧表单区 -->
           <el-col :span="15" class="semester-form-col">
             <el-form-item label="学期名称">
-              <el-input :value="getSemesterName(buildNd(form.xn, form.xq))" readonly placeholder="由年份+学期类型自动拼接"
+              <el-input :value="getSemesterName(buildNd(form.xn, form.xq))" readonly placeholder="请在下方选择年份和学期类型"
                 prefix-icon="el-icon-office-building" />
             </el-form-item>
             <el-row :gutter="14">
               <el-col :span="12">
                 <el-form-item label="年份" prop="xn">
-                  <el-select v-model="form.xn" placeholder="请选择年份" :disabled="!isAdd" style="width: 100%">
+                  <el-select v-model="form.xn" placeholder="请选择年份" :disabled="!isAdd" style="width: 100%"
+                    @change="checkSemesterNameUnique">
                     <el-option v-for="item in yearOptions" :key="item" :label="item + '年'" :value="item" />
                   </el-select>
                 </el-form-item>
               </el-col>
               <el-col :span="12">
                 <el-form-item label="学期类型" prop="xq">
-                  <el-select v-model="form.xq" placeholder="请选择学期类型" :disabled="!isAdd" style="width: 100%">
+                  <el-select v-model="form.xq" placeholder="请选择学期类型" :disabled="!isAdd" style="width: 100%"
+                    @change="checkSemesterNameUnique">
                     <el-option v-for="item in semesterOptions" :key="item.value" :label="item.label"
                       :value="item.value" />
                   </el-select>
@@ -305,6 +309,17 @@ export default {
       const s = String(nd)
       return { xn: s.slice(0, 4), xq: s.slice(4) }
     },
+    /** 新增时校验学期名称（年份+学期类型拼接）是否已存在于表格 */
+    isSemesterNameDuplicated() {
+      if (!this.isAdd) return false
+      const nd = this.buildNd(this.form.xn, this.form.xq)
+      if (!nd) return false
+      return this.semesterList.some(item => String(item.nd) === String(nd))
+    },
+    /** 年份/学期类型切换时实时刷新顶部重复提示 */
+    checkSemesterNameUnique() {
+      this.$forceUpdate()
+    },
     /** 课时系数方案编号 -> 名称 */
     getCoefficientLabel(value) {
       if (!value && value !== 0) return '-'
@@ -430,6 +445,10 @@ export default {
     },
     /** 提交表单 */
     submitForm() {
+      if (this.isSemesterNameDuplicated()) {
+        this.$modal.msgWarning("该学期已存在，不能重复添加")
+        return
+      }
       this.$refs["form"].validate(valid => {
         if (valid) {
           const payload = this.buildPayload(this.form)
@@ -507,6 +526,11 @@ export default {
     display: block;
   }
 
+  /* 顶部学期重复提示与表单间距 */
+  .semester-dup-alert {
+    margin-bottom: 16px;
+  }
+
   .semester-form-col {
     padding-right: 4px;
   }