学员信息维护成绩表单展示

frontend/src/api/studentRecords/studentRecords.js

@@ -45,7 +45,7 @@ export function delStudentRecord(bh) {
   })
 }
 
-// 分页查询学员课程成绩（kcbh/xydbh/xh/nd 查询）
+// 分页查询学员课程成绩（xybh/nd 查询）
 export function listStudentGrades(query) {
   return request({
     url: '/student-records/grades',
@@ -54,7 +54,7 @@ export function listStudentGrades(query) {
   })
 }
 
-// 分页查询学员课程过程成绩（kcbh/xydbh/xh/nd 查询）
+// 分页查询学员课程过程成绩（xybh/nd 查询）
 export function listStudentProcessGrades(query) {
   return request({
     url: '/student-records/process-grades',
@@ -63,7 +63,7 @@ export function listStudentProcessGrades(query) {
   })
 }
 
-// 导出学员课程成绩 Excel（kcbh/xydbh/xh/nd 查询）
+// 导出指定学员的课程成绩 Excel（xybh 必传）
 export function exportStudentGrades(query) {
   return request({
     url: '/student-records/export-grades',
@@ -73,7 +73,7 @@ export function exportStudentGrades(query) {
   })
 }
 
-// 导出学员课程过程成绩 Excel（kcbh/xydbh/xh/nd 查询）
+// 导出指定学员的课程过程成绩 Excel（xybh 必传）
 export function exportStudentProcessGrades(query) {
   return request({
     url: '/student-records/export-process-grades',
@@ -81,4 +81,4 @@ export function exportStudentProcessGrades(query) {
     params: query,
     responseType: 'blob'
   })
-}
+}

frontend/src/views/student/studentInfo/index.vue

@@ -210,25 +210,55 @@
     <el-dialog
       :visible="gradesVisible"
       title="学员成绩"
-      width="600px"
+      width="80%"
       :close-on-click-modal="false"
       @update:visible="val => gradesVisible = val"
     >
-      <p><strong>学员：</strong>{{ gradesStudent }}</p>
+      <div class="student-summary">
+        <span><strong>学员：</strong>{{ gradesStudent || '-' }}</span>
+        <span><strong>学号：</strong>{{ gradesStudentNo || '-' }}</span>
+      </div>
       <el-tabs v-model="gradesTab">
         <el-tab-pane label="成绩" name="grades">
-          <div v-loading="gradesLoading">
-            <pre v-if="gradesData">{{ gradesData }}</pre>
-          </div>
+          <el-table v-loading="gradesLoading" :data="gradesData" stripe border max-height="420">
+            <el-table-column type="index" label="序号" width="55" align="center" />
+            <el-table-column prop="nd" label="年度" width="85" align="center" />
+            <el-table-column prop="kmbh" label="科目编号" min-width="120" align="center" show-overflow-tooltip />
+            <el-table-column prop="klx" label="课类型" width="90" align="center" />
+            <el-table-column prop="kscj" label="考试成绩" width="90" align="center" />
+            <el-table-column prop="pscj" label="平时成绩" width="90" align="center" />
+            <el-table-column prop="zzcj" label="最终成绩" width="90" align="center" />
+            <el-table-column prop="qwxf" label="期望学分" width="90" align="center" />
+            <el-table-column prop="bkcj" label="补考成绩" width="90" align="center" />
+            <el-table-column prop="bkcs" label="补考次数" width="90" align="center" />
+            <el-table-column prop="ksqk" label="考试情况" width="100" align="center" />
+            <el-table-column label="考试结果" width="90" align="center">
+              <template slot-scope="{ row }">{{ formatPassStatus(row.ytg) }}</template>
+            </el-table-column>
+            <el-table-column prop="bz" label="备注" min-width="120" align="center" show-overflow-tooltip />
+          </el-table>
         </el-tab-pane>
         <el-tab-pane label="进程成绩" name="process">
-          <div v-loading="gradesLoading">
-            <pre v-if="processGradesData">{{ processGradesData }}</pre>
-          </div>
+          <el-table v-loading="gradesLoading" :data="processGradesData" stripe border max-height="420">
+            <el-table-column type="index" label="序号" width="55" align="center" />
+            <el-table-column prop="nd" label="年度" width="85" align="center" />
+            <el-table-column prop="kmbh" label="科目编号" min-width="120" align="center" show-overflow-tooltip />
+            <el-table-column prop="klx" label="课类型" width="90" align="center" />
+            <el-table-column prop="yscj" label="原始成绩" width="100" align="center" />
+            <el-table-column prop="zzcj" label="最终成绩" width="90" align="center" />
+            <el-table-column prop="bkcj1" label="补考成绩1" width="100" align="center" />
+            <el-table-column prop="bkcj2" label="补考成绩2" width="100" align="center" />
+            <el-table-column prop="bkcj3" label="补考成绩3" width="100" align="center" />
+            <el-table-column prop="bkcs" label="补考次数" width="90" align="center" />
+            <el-table-column prop="ksqk" label="考试情况" width="100" align="center" />
+            <el-table-column prop="bz" label="备注" min-width="120" align="center" show-overflow-tooltip />
+          </el-table>
         </el-tab-pane>
       </el-tabs>
       <div slot="footer">
-        <el-button type="primary" @click="handleExportGrades">导出成绩</el-button>
+        <el-button type="primary" :loading="gradesExporting" @click="handleExportGrades">
+          {{ gradesTab === 'grades' ? '导出成绩' : '导出进程成绩' }}
+        </el-button>
       </div>
     </el-dialog>
   </div>
@@ -240,7 +270,11 @@ import {
   getStudentRecord,
   addStudentRecord,
   updateStudentRecord,
-  delStudentRecord
+  delStudentRecord,
+  listStudentGrades,
+  listStudentProcessGrades,
+  exportStudentGrades,
+  exportStudentProcessGrades
 } from "@/api/studentRecords/studentRecords"
 import { getDicts } from '@/api/system/dict/data'
 
@@ -301,11 +335,13 @@ export default {
       // ==================== 成绩弹窗 ====================
       gradesVisible: false,
       gradesTab: 'grades',
-      gradesData: null,
-      processGradesData: null,
+      gradesData: [],
+      processGradesData: [],
       gradesStudent: '',
+      gradesStudentNo: '',
       currentBh: '',
-      gradesLoading: false
+      gradesLoading: false,
+      gradesExporting: false
     }
   },
   created() {
@@ -479,25 +515,65 @@ export default {
     },
 
     // ==================== 成绩弹窗 ====================
-    // TODO: 后端接口未提供，成绩数据为前端模拟；接口就绪后替换为 getStudentGrades / getStudentProcessGrades
-    handleGrades(row) {
+    async handleGrades(row) {
       this.gradesStudent = row.xm || ''
+      this.gradesStudentNo = row.xh || ''
       this.currentBh = row.bh || ''
-      this.gradesData = null
-      this.processGradesData = null
+      this.gradesData = []
+      this.processGradesData = []
       this.gradesTab = 'grades'
       this.gradesVisible = true
       this.gradesLoading = true
-      setTimeout(() => {
-        this.gradesData = { 学员: row.xm, 学号: row.xh, 课程: '通信原理', 成绩: 92, 学分: 3.0 }
-        this.processGradesData = { 进程成绩: [{ 名称: '平时成绩', 得分: 95 }, { 名称: '期末成绩', 得分: 88 }] }
+
+      const emptyResponse = { data: { records: [] } }
+      const query = { pageNum: 1, pageSize: 1000, xybh: this.currentBh }
+      try {
+        const [gradesResponse, processGradesResponse] = await Promise.all([
+          listStudentGrades(query).catch(() => emptyResponse),
+          listStudentProcessGrades(query).catch(() => emptyResponse)
+        ])
+        this.gradesData = gradesResponse.data.records || []
+        this.processGradesData = processGradesResponse.data.records || []
+      } finally {
         this.gradesLoading = false
-      }, 300)
+      }
     },
 
-    // TODO: 后端接口未提供，导出为前端模拟；接口就绪后替换为 exportStudentGrades
-    handleExportGrades() {
-      this.$message.success(`已导出学员${this.gradesStudent}成绩（前端模拟）`)
+    formatPassStatus(value) {
+      if (value === 1 || value === '1') {
+        return '已通过'
+      }
+      if (value === 0 || value === '0') {
+        return '未通过'
+      }
+      return '-'
+    },
+
+    downloadGradesFile(blob, fileName) {
+      const link = document.createElement('a')
+      link.href = URL.createObjectURL(blob)
+      link.download = fileName
+      link.click()
+      URL.revokeObjectURL(link.href)
+    },
+
+    async handleExportGrades() {
+      if (!this.currentBh) {
+        this.$message.warning('缺少学员编号，无法导出成绩')
+        return
+      }
+
+      this.gradesExporting = true
+      try {
+        const isProcessGrades = this.gradesTab === 'process'
+        const request = isProcessGrades ? exportStudentProcessGrades : exportStudentGrades
+        const blob = await request({ xybh: this.currentBh })
+        const suffix = isProcessGrades ? '课程过程成绩' : '课程成绩'
+        this.downloadGradesFile(blob, `${this.gradesStudent || '学员'}_${suffix}.xlsx`)
+        this.$message.success(`${suffix}导出成功`)
+      } finally {
+        this.gradesExporting = false
+      }
     }
   }
 }
@@ -578,5 +654,13 @@ export default {
     width: 100%;
   }
 
+  .student-summary {
+    display: flex;
+    gap: 32px;
+    margin-bottom: 8px;
+    color: #303133;
+    line-height: 24px;
+  }
+
 }
 </style>