解决所有bug 优化table内容

src/views/basic/basicclass/form.vue

@@ -74,8 +74,8 @@
           <el-form-item label="班号" prop="classNo">
             <el-input 
               v-model="form.classNo" 
-              placeholder="请输入班号" 
-              clearable />
+            placeholder="自动填充班号" 
+            :disabled="true" />
           </el-form-item>
         </el-col>
 
@@ -92,8 +92,8 @@
           <el-form-item label="班级规范名称" prop="classProName">
             <el-input 
               v-model="form.classProName" 
-              placeholder="请输入班级规范名称" 
-              clearable />
+            placeholder="自动拼接班级规范名称" 
+            :disabled="true" />
           </el-form-item>
         </el-col>
 
@@ -101,8 +101,8 @@
           <el-form-item label="入学年份" prop="grade">
             <el-input 
               v-model="form.grade" 
-              placeholder="请输入入学年份" 
-              clearable />
+            placeholder="自动填充入学年份" 
+            :disabled="true" />
           </el-form-item>
         </el-col>
 
@@ -159,9 +159,9 @@
 </template>
 
 <script setup lang="ts" name="BasicClassDialog">
-import { ref, reactive, nextTick, onMounted } from 'vue'
+import { ref, reactive, nextTick, onMounted, watch, computed } from 'vue'
 import { useMessage } from "/@/hooks/message";
-import { getObj, addObj, putObj, getMajorNameList, getDeptList } from '/@/api/basic/basicclass'
+import { getDetail, addObj, putObj, getMajorNameList, getDeptList } from '/@/api/basic/basicclass'
 import { getTeacherBaseList } from '/@/api/professional/professionaluser/teacherbase'
 
 const emit = defineEmits(['refresh']);
@@ -173,6 +173,8 @@ const loading = ref(false)
 const majorList = ref<any[]>([])
 const deptList = ref<any[]>([])
 const teacherList = ref<any[]>([])
+const yearLast = ref('') // 年份后两位
+const majorName = ref('') // 专业名称
 
 // 提交表单数据
 const form = reactive({
@@ -243,6 +245,10 @@ const openDialog = (id?: string) => {
     preStuNum: 0,
     remark: ''
   })
+  
+  // 重置辅助变量
+  yearLast.value = ''
+  majorName.value = ''
 
   // 清除表单验证状态，不触发验证
   nextTick(() => {
@@ -269,11 +275,17 @@ const onSubmit = async () => {
 
   try {
     loading.value = true;
+    // 构建提交数据，将班主任工号放到 teacherNo 字段
+    const submitData = {
+      ...form,
+      teacherNo: form.teacherNos // 将 teacherNos 的值赋值给 teacherNo
+    };
+    
     if (form.id) {
-      await putObj(form);
+      await putObj(submitData);
       useMessage().success('编辑成功');
     } else {
-      await addObj(form);
+      await addObj(submitData);
       useMessage().success('新增成功');
     }
     visible.value = false;
@@ -286,9 +298,10 @@ const onSubmit = async () => {
 };
 
 // 获取详情
-const getBasicClassData = (id: string) => {
+const getBasicClassData = async (id: string) => {
   loading.value = true
-  getObj(id).then((res: any) => {
+  try {
+    const res = await getDetail(id)
     if (res.data) {
       Object.assign(form, {
         id: res.data.id || '',
@@ -304,17 +317,29 @@ const getBasicClassData = (id: string) => {
         preStuNum: res.data.preStuNum || 0,
         remark: res.data.remark || ''
       })
+      
+      // 设置辅助变量（编辑时不自动填充，保持原有数据）
+      if (res.data.enterDate && res.data.enterDate.length >= 4) {
+        yearLast.value = res.data.enterDate.substring(2, 4)
+      }
+      // 确保专业列表已加载后再设置专业名称
+      if (res.data.majorCode && majorList.value.length > 0) {
+        const major = majorList.value.find(item => item.majorCode === res.data.majorCode)
+        if (major) {
+          majorName.value = major.majorName || ''
+        }
+      }
     }
-  }).catch((err: any) => {
+  } catch (err: any) {
     console.error('获取详情失败', err)
     useMessage().error('获取详情失败')
-  }).finally(() => {
+  } finally {
     loading.value = false
     // 数据加载完成后，清除验证状态，避免触发验证
     nextTick(() => {
       dataFormRef.value?.clearValidate();
     });
-  })
+  }
 }
 
 // 获取专业列表
@@ -356,6 +381,59 @@ const getTeacherListData = async () => {
   }
 }
 
+// 拼接班级规范名称
+const montageClassProName = () => {
+  // 只在新增模式下自动填充，编辑模式下不覆盖已有数据
+  if (!form.id && yearLast.value && majorName.value) {
+    form.classProName = yearLast.value + majorName.value
+    if (form.classNo) {
+      form.classProName = yearLast.value + majorName.value + '(' + form.classNo + ')'
+    }
+    console.log('classProName', form.classProName)
+  }
+}
+
+// 监听入学日期,取年份后两位
+watch(() => form.enterDate, (newVal) => {
+  if (newVal && newVal.length >= 4) {
+    console.log('newdate:', newVal)
+    yearLast.value = newVal.substring(2, 4)
+    // 只在新增模式下自动填充入学年份
+    if (!form.id) {
+      form.grade = newVal.substring(0, 4)
+    }
+    montageClassProName()
+  }
+})
+
+// 监听班级代码,取后四位为班号
+watch(() => form.classCode, (newVal) => {
+  if (newVal) {
+    const length = newVal.length
+    if (length > 4) {
+      // 只在新增模式下自动填充班号，编辑模式下如果班号为空才填充
+      if (!form.id || !form.classNo) {
+        form.classNo = newVal.substring(length - 4, length)
+        montageClassProName()
+      }
+    }
+  }
+})
+
+// 监听专业代码变化，获取专业名称
+watch(() => form.majorCode, (newVal) => {
+  if (newVal) {
+    const major = majorList.value.find(item => item.majorCode === newVal)
+    if (major) {
+      majorName.value = major.majorName || ''
+      montageClassProName()
+    }
+  } else {
+    majorName.value = ''
+    montageClassProName()
+  }
+})
+
 // 初始化
 onMounted(() => {
   getMajorListData()

src/views/basic/basicclass/index.vue

@@ -122,27 +122,84 @@
         border 
         :cell-style="tableStyle.cellStyle" 
         :header-cell-style="tableStyle.headerCellStyle"
+        row-key="id"
+        @selection-change="handleSelectionChange"
         @sort-change="sortChangeHandle">
-        <el-table-column type="index" label="序号" align="center" />
-        <el-table-column prop="deptName" label="学院" show-overflow-tooltip />
-        <el-table-column prop="classNo" label="班号" show-overflow-tooltip />
-        <el-table-column prop="classProName" label="班级规范名称" show-overflow-tooltip />
-        <el-table-column prop="teacherRealName" label="班主任" show-overflow-tooltip />
-        <el-table-column prop="teacherTel" label="班主任电话号码" show-overflow-tooltip />
-        <el-table-column label="班级人数/原始人数" show-overflow-tooltip>
-          <template #default="scope">
-            {{ scope.row.stuNum || 0 }}/{{ scope.row.preStuNum || 0 }}
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column type="index" label="序号" align="center">
+          <template #header>
+            <el-icon><List /></el-icon>
           </template>
         </el-table-column>
-        <el-table-column prop="ruleName" label="门禁规则" show-overflow-tooltip />
-        <el-table-column prop="classStatus" label="班级状态" show-overflow-tooltip>
+        <el-table-column prop="deptName" label="学院" show-overflow-tooltip>
+          <template #header>
+            <el-icon><OfficeBuilding /></el-icon>
+            <span style="margin-left: 4px">学院</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="classNo" label="班号" show-overflow-tooltip>
+          <template #header>
+            <el-icon><Grid /></el-icon>
+            <span style="margin-left: 4px">班号</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="classProName" label="班级规范名称" show-overflow-tooltip>
+          <template #header>
+            <el-icon><Document /></el-icon>
+            <span style="margin-left: 4px">班级规范名称</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="teacherRealName" label="班主任" show-overflow-tooltip>
+          <template #header>
+            <el-icon><UserFilled /></el-icon>
+            <span style="margin-left: 4px">班主任</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="teacherTel" label="班主任电话号码" show-overflow-tooltip>
+          <template #header>
+            <el-icon><Phone /></el-icon>
+            <span style="margin-left: 4px">班主任电话</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="班级人数/原始人数" show-overflow-tooltip>
+          <template #header>
+            <el-icon><User /></el-icon>
+            <span style="margin-left: 4px">班级人数/原始人数</span>
+          </template>
           <template #default="scope">
-            <span>{{ scope.row.classStatus === '0' ? '正常' : scope.row.classStatus === '1' ? '离校' : '-' }}</span>
+            <el-tag size="small" type="primary" effect="plain">
+              {{ scope.row.stuNum || 0 }}/{{ scope.row.preStuNum || 0 }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column prop="ruleName" label="门禁规则" show-overflow-tooltip>
+          <template #header>
+            <el-icon><Lock /></el-icon>
+            <span style="margin-left: 4px">门禁规则</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="classStatus" label="班级状态" show-overflow-tooltip>
+          <template #header>
+            <el-icon><CircleCheck /></el-icon>
+            <span style="margin-left: 4px">班级状态</span>
+          </template>
+          <template #default="scope">
+            <StatusTag 
+              :value="scope.row.classStatus"
+              :options="[{ label: '正常', value: '0' }, { label: '离校', value: '1' }]"
+              :type-map="{ '0': { type: 'success', effect: 'light' }, '1': { type: 'warning', effect: 'light' } }"
+            />
           </template>
         </el-table-column>
         <el-table-column prop="stuLoseRate" label="流失率" show-overflow-tooltip>
+          <template #header>
+            <el-icon><TrendCharts /></el-icon>
+            <span style="margin-left: 4px">流失率</span>
+          </template>
           <template #default="scope">
-            <span>{{ scope.row.stuLoseRate ? `${scope.row.stuLoseRate}%` : '-' }}</span>
+            <el-tag size="small" type="danger" effect="plain">
+              {{ scope.row.stuLoseRate ? `${scope.row.stuLoseRate}%` : '0%' }}
+            </el-tag>
           </template>
         </el-table-column>
         <el-table-column label="操作" align="center" fixed="right" width="200">
@@ -193,22 +250,6 @@
       draggable
       width="600px">
       <el-form :model="linkRuleForm" label-width="120px">
-        <el-form-item label="选择班级">
-          <el-select 
-            v-model="linkRuleForm.classCodes" 
-            placeholder="请选择班级" 
-            clearable
-            filterable
-            multiple
-            style="width: 100%">
-            <el-option
-              v-for="item in classList"
-              :key="item.classCode"
-              :label="item.classNo"
-              :value="item.classCode">
-            </el-option>
-          </el-select>
-        </el-form-item>
         <el-form-item label="选择规则">
           <el-select 
             v-model="linkRuleForm.ruleId" 
@@ -242,6 +283,9 @@ import { fetchList, delObj, putObjs, classExportData, getDeptList, getClassListB
 import { useMessage, useMessageBox } from "/@/hooks/message";
 import { fetchList as getRuleList } from "/@/api/stuwork/entrancerule";
 import { downBlobFile, adaptationUrl } from "/@/utils/other";
+import { List, OfficeBuilding, Grid, Document, UserFilled, Phone, User, Lock, CircleCheck, TrendCharts, Setting } from '@element-plus/icons-vue'
+import { defineAsyncComponent as defineStatusTag } from 'vue'
+const StatusTag = defineStatusTag(() => import('/@/components/StatusTag/index.vue'))
 
 // 引入组件
 const FormDialog = defineAsyncComponent(() => import('./form.vue'));
@@ -258,6 +302,7 @@ const classList = ref<any[]>([])
 const ruleList = ref<any[]>([])
 const linkRuleDialogVisible = ref(false)
 const linkRuleLoading = ref(false)
+const selectedClassCodes = ref<string[]>([])
 
 // 搜索表单
 const searchForm = reactive({
@@ -272,7 +317,6 @@ const searchForm = reactive({
 
 // 关联门禁规则表单
 const linkRuleForm = reactive({
-  classCodes: [] as string[],
   ruleId: ''
 })
 
@@ -296,6 +340,13 @@ const {
   tableStyle
 } = useTable(state)
 
+// 表格多选
+const handleSelectionChange = (rows: any[]) => {
+  selectedClassCodes.value = (rows || [])
+    .map((item) => item.classCode)
+    .filter((item) => !!item)
+}
+
 // 学院选择变化
 const handleDeptChange = () => {
   // 可以根据需要清空班号选择
@@ -352,8 +403,11 @@ const handleViewDetail = (row: any) => {
 
 // 关联门禁规则
 const handleLinkRule = () => {
+  if (!selectedClassCodes.value.length) {
+    useMessage().warning('请先勾选要关联的班级')
+    return
+  }
   linkRuleDialogVisible.value = true
-  linkRuleForm.classCodes = []
   linkRuleForm.ruleId = ''
   // 加载规则列表
   getRuleListData()
@@ -361,12 +415,12 @@ const handleLinkRule = () => {
 
 // 确认关联门禁规则
 const confirmLinkRule = async () => {
-  if (!linkRuleForm.ruleId) {
-    useMessage().warning('请选择门禁规则')
+  if (!selectedClassCodes.value.length) {
+    useMessage().warning('请先勾选要关联的班级')
     return
   }
-  if (!linkRuleForm.classCodes || linkRuleForm.classCodes.length === 0) {
-    useMessage().warning('请选择班级')
+  if (!linkRuleForm.ruleId) {
+    useMessage().warning('请选择门禁规则')
     return
   }
 
@@ -374,7 +428,7 @@ const confirmLinkRule = async () => {
     linkRuleLoading.value = true
     await putObjs({
       ruleId: linkRuleForm.ruleId,
-      classCodes: linkRuleForm.classCodes
+      classCodes: selectedClassCodes.value
     })
     useMessage().success('关联成功')
     linkRuleDialogVisible.value = false
@@ -396,10 +450,9 @@ const handleExport = async () => {
   }
 }
 
-// 生成考核班级
+// 生成考核班级（占位，待确认接口）
 const handleGenerateAssessment = () => {
-  // TODO: 需要确认接口地址
-  useMessage().warning('生成考核班级功能待实现，请确认接口地址')
+  useMessage().warning('生成考核班级功能待确认接口后启用')
 }
 
 // 获取学院列表