feat(student): 添加学习分析功能组件及相关交互

- 在班级页面列表操作栏增加“学情分析”按钮，点击弹出学情分析对话框
- 新增StudyAnalysis组件，封装学习分析生成与展示逻辑
- 学生详情页替换原有学习分析区域，统一使用StudyAnalysis组件
- 移除学生页原有学习分析相关状态管理和接口调用，简化代码
- 通过定时器模拟加载进度条，提升生成学习分析时的用户体验

enlish-vue/src/layouts/components/student/StudyAnalysis.vue

@@ -0,0 +1,79 @@
+<template>
+	<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
+		<div class="flex items-center justify-between mb-3">
+			<div class="text-md font-semibold">学习分析</div>
+			<el-button type="primary" size="small" :loading="analyzeLoading" @click="fetchStudyAnalyze">
+				生成学习分析
+			</el-button>
+		</div>
+		<template v-if="analyzeLoading">
+			<div class="space-y-2">
+				<el-progress :percentage="analyzeProgress" :stroke-width="10" />
+				<div class="text-sm text-gray-500 dark:text-gray-400">正在生成学习分析，请稍候…</div>
+			</div>
+		</template>
+		<template v-else-if="analysisHtml">
+			<div class="leading-7 text-gray-700 dark:text-gray-200" v-html="analysisHtml"></div>
+		</template>
+		<template v-else>
+			<el-empty description="点击右上按钮生成学习分析" />
+		</template>
+	</div>
+</template>
+
+<script setup>
+import { ref, computed } from 'vue'
+import MarkdownIt from 'markdown-it'
+import { getStudentStudyAnalyze } from '@/api/student'
+
+const props = defineProps({
+	studentId: {
+		type: [String, Number],
+		required: true
+	}
+})
+
+const analyzeLoading = ref(false)
+const analyzeProgress = ref(0)
+let analyzeTimer = null
+const analysisText = ref('')
+const md = new MarkdownIt({
+	html: false,
+	linkify: true,
+	breaks: true
+})
+const analysisHtml = computed(() => {
+	return analysisText.value ? md.render(analysisText.value) : ''
+})
+
+async function fetchStudyAnalyze() {
+	const id = props.studentId
+	if (!id) return
+	analyzeLoading.value = true
+	analyzeProgress.value = 0
+	if (analyzeTimer) {
+		clearInterval(analyzeTimer)
+		analyzeTimer = null
+	}
+	analyzeTimer = setInterval(() => {
+		const inc = Math.floor(Math.random() * 8) + 3
+		const next = analyzeProgress.value + inc
+		analyzeProgress.value = next >= 90 ? 90 : next
+	}, 300)
+	try {
+		const res = await getStudentStudyAnalyze({
+			studentId: Number(id)
+		})
+		const d = res.data
+		const raw = typeof d?.data === 'string' ? d.data : ''
+		analysisText.value = raw.replace(/\\n/g, '\n')
+	} finally {
+		analyzeProgress.value = 100
+		if (analyzeTimer) {
+			clearInterval(analyzeTimer)
+			analyzeTimer = null
+		}
+		analyzeLoading.value = false
+	}
+}
+</script>

enlish-vue/src/pages/class.vue

@@ -73,8 +73,10 @@
                                     </template>
                                 </template>
                             </el-table-column>
-                            <el-table-column label="操作" width="180" fixed="right">
+                            <el-table-column label="操作" width="240" fixed="right">
                                 <template #default="{ row }">
+                                    <!-- 学情分析 -->
+                                    <el-button type="info" size="small" @click.stop="onShowAnalysis(row)">学情分析</el-button>
                                     <el-button type="primary" size="small" @click.stop="onViewStudent(row)">详情</el-button>
                                     <el-button type="danger" size="small" @click.stop="onDeleteStudent(row)">删除</el-button>
                                 </template>
@@ -105,6 +107,9 @@
                             v-model="showPlanListDialog"
                             :student-id="planStudentId"
                         />
+                        <el-dialog v-model="showAnalysisDialog" title="学情分析" width="60%">
+                            <StudyAnalysis v-if="showAnalysisDialog" :student-id="analysisStudentId" />
+                        </el-dialog>
                     </div>
 
                     <div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6" v-loading="gradeLoading">
@@ -139,6 +144,7 @@ import AddGradeDialog from '@/layouts/components/AddGradeDialog.vue'
 import AddStudentDialog from '@/layouts/components/AddStudentDialog.vue'
 import LessonPlanDialog from '@/layouts/components/LessonPlanDialog.vue'
 import StudentPlanListDialog from '@/layouts/components/StudentPlanListDialog.vue'
+import StudyAnalysis from '@/layouts/components/student/StudyAnalysis.vue'
 import { getUnitList, deleteUnit } from '@/api/unit'
 import AddUnitDialog from '@/layouts/components/AddUnitDialog.vue'
 import { useRouter, onBeforeRouteLeave } from 'vue-router'
@@ -180,6 +186,8 @@ const generatingPercents = ref({})
 const pollingTimers = {}
 const showPlanListDialog = ref(false)
 const planStudentId = ref(null)
+const showAnalysisDialog = ref(false)
+const analysisStudentId = ref(null)
 
 const units = ref([])
 const unitPageNo = ref(1)
@@ -275,6 +283,10 @@ function onStudentSelectionChange(rows) {
 function onViewStudent(row) {
     router.push(`/student/${row.id}`)
 }
+function onShowAnalysis(row) {
+    analysisStudentId.value = row.id
+    showAnalysisDialog.value = true
+}
 function onClassRowClick(row) {
     selectedClassId.value = row.id
     selectedClassTitle.value = row.title

enlish-vue/src/pages/student.vue

@@ -49,26 +49,7 @@
                         <div class="text-md font-semibold mb-3">词汇掌握热力图</div>
                         <WordMasteryHeatmap :student-id="route.params.id" :columns="50" />
                     </div>
-                    <div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
+                    <StudyAnalysis :student-id="route.params.id" />
-                        <div class="flex items-center justify-between mb-3">
-                            <div class="text-md font-semibold">学习分析</div>
-                            <el-button type="primary" size="small" :loading="analyzeLoading" @click="fetchStudyAnalyze">
-                                生成学习分析
-                            </el-button>
-                        </div>
-                        <template v-if="analyzeLoading">
-                            <div class="space-y-2">
-                                <el-progress :percentage="analyzeProgress" :stroke-width="10" />
-                                <div class="text-sm text-gray-500 dark:text-gray-400">正在生成学习分析，请稍候…</div>
-                            </div>
-                        </template>
-                        <template v-else-if="analysisHtml">
-                            <div class="leading-7 text-gray-700 dark:text-gray-200" v-html="analysisHtml"></div>
-                        </template>
-                        <template v-else>
-                            <el-empty description="点击右上按钮生成学习分析" />
-                        </template>
-                    </div>
                 </div>
             </el-main>
 
@@ -80,31 +61,19 @@
 import Header from '@/layouts/components/Header.vue'
 import { ref, onMounted, computed } from 'vue'
 import { useRoute } from 'vue-router'
-import { getStudentDetail, getStudentStudyAnalyze } from '@/api/student'
+import { getStudentDetail } from '@/api/student'
 import { getStudentExamHistory } from '@/api/exam'
 import { getWordStudentDetail } from '@/api/words'
 import ExamHistoryChart from '@/layouts/components/student/ExamHistoryChart.vue'
 import PlanHistoryChart from '@/layouts/components/student/PlanHistoryChart.vue'
 import WordMasteryHeatmap from '@/layouts/components/student/WordMasteryHeatmap.vue'
-import MarkdownIt from 'markdown-it'
+import StudyAnalysis from '@/layouts/components/student/StudyAnalysis.vue'
 
 const loading = ref(false)
 const detail = ref(null)
 const route = useRoute()
 const history = ref([])
-const analyzeLoading = ref(false)
-const analyzeProgress = ref(0)
-let analyzeTimer = null
-const analysisText = ref('')
 const wordStat = ref(null)
-const md = new MarkdownIt({
-    html: false,
-    linkify: true,
-    breaks: true
-})
-const analysisHtml = computed(() => {
-    return analysisText.value ? md.render(analysisText.value) : ''
-})
 
 async function fetchDetail() {
     const id = route.params.id
@@ -129,37 +98,6 @@ async function fetchExamHistory() {
     }) : []
 }
 
-async function fetchStudyAnalyze() {
-    const id = route.params.id
-    if (!id) return
-    analyzeLoading.value = true
-    analyzeProgress.value = 0
-    if (analyzeTimer) {
-        clearInterval(analyzeTimer)
-        analyzeTimer = null
-    }
-    analyzeTimer = setInterval(() => {
-        const inc = Math.floor(Math.random() * 8) + 3
-        const next = analyzeProgress.value + inc
-        analyzeProgress.value = next >= 90 ? 90 : next
-    }, 300)
-    try {
-        const res = await getStudentStudyAnalyze({
-            studentId: Number(id)
-        })
-        const d = res.data
-        const raw = typeof d?.data === 'string' ? d.data : ''
-        analysisText.value = raw.replace(/\\n/g, '\n')
-    } finally {
-        analyzeProgress.value = 100
-        if (analyzeTimer) {
-            clearInterval(analyzeTimer)
-            analyzeTimer = null
-        }
-        analyzeLoading.value = false
-    }
-}
-
 async function fetchWordStat() {
     const id = route.params.id
     if (!id) return