feat: 合并feat/correction-switch分支的特定文件

src/apis/engagement.ts

@@ -65,23 +65,23 @@ const engagementApis = {
             }
         })
     },
-    // 获取下一个学生的ID
-    getNextStudentId: (assignmentId: number, studentId: number) => {
+    // 获取下一个学生作业ID
+    getNextStudentAssignment: (assignmentId: number, studentId: number) => {
         return axiosInstance.get(`${ENGAGE_PREFIX}/next`, {
             params: {
                 assignmentId,
                 studentId
             }
-        });
+        })
     },
-    // 获取作业的批改统计
-    getEngagementStats: (assignmentId: number) => {
-    return axiosInstance.get(`${ENGAGE_PREFIX}/number`, {
-      params: {
-        assignmentId
-      }
-    });
-  }
+    // 获取当前作业参与及批改情况
+    getAssignmentCorrectionStats: (assignmentId: number) => {
+        return axiosInstance.get(`${ENGAGE_PREFIX}/number`, {
+            params: {
+                assignmentId
+            }
+        })
+    }
 }
 
 export default engagementApis

src/router/index.ts

@@ -16,14 +16,17 @@ const router = createRouter({
     },
 
     // 登录与注册
+    // {
+    //   path: "/",
+    //   redirect: () => {
+    //     window.location.href = "https://p-nju.seec.seecoder.cn/login?from=https://air.seec.seecoder.cn/";
+    //     // {本地门户首页地址}?from={本地eai首页地址}
+    //     return "/"; // 占位返回值，实际不会执行
+    // },
+    // },
     {
       path: "/",
-      redirect: () => {
-        // window.location.href = "https://p-nju.seec.seecoder.cn/login?from=https://air.seec.seecoder.cn/";
-        window.location.href = "http://localhost:8000/login?from=http://localhost:4000/";
-        // {本地门户首页地址}?from={本地eai首页地址}
-        return "/"; // 占位返回值，实际不会执行
-    },
+      redirect: "/login"
     },
     {
       path: '/login',
@@ -32,7 +35,7 @@ const router = createRouter({
     },
     {
       path: '/register',
-      name: 'register',
+      name: 'register', 
       component: () => import('../views/LoginPage/RegisterPage.vue')
     },
     {
@@ -205,9 +208,9 @@ const router = createRouter({
         }
 
         // 如果当前路径是公开路径，允许继续；否则跳转到首页
-        // if (!publicPaths.includes(to.path)) {
-        //     return '/home';
-        // }
+        if (!publicPaths.includes(to.path)) {
+            return '/home';
+        }
     } catch (error) {
         console.error('Token验证失败:', error);
         // 验证失败，清除无效的 token
@@ -217,17 +220,17 @@ const router = createRouter({
         localStorage.removeItem('User');
     }
     }
-
+  
     if (publicPaths.includes(to.path)) return true;
-
+  
     if (!store.user?.role) {
       return '/login';
     }
-
-    if (to.meta?.roles && !(to.meta.roles as string[]).includes(store.user.role)) {
+  
+    if (to.meta?.roles && !to.meta.roles.includes(store.user.role)) {
       return '/login';
     }
-
+  
     return true;
   });
 

src/views/AiSpeakingPage/SpeakingRecord.vue

@@ -251,28 +251,39 @@
               score-template="{value} 分"
             />
           </div>
-          <!-- <el-button style="background-color:#597D3B;color:white" @click="submitComment" class="submit-button"
-            >提交评语</el-button
-          > -->
-          <div class="submit-next-group">
-            <el-button 
-              style="background-color:#597D3B;color:white" 
-              @click="submitComment" 
-              class="submit-button"
-            >
-              提交评语
-            </el-button>
-            <el-button
-              style="background-color:#597D3B;color:white"  
-              class="next-button" 
-              @click="goToNextStudent"
-            >
-              下一个学生
-            </el-button>
-          </div>
-          <div class="engagement-stats">
-            已批改：{{ engagementStats.correctNumber }}
-            未批改：{{ engagementStats.engageNumber - engagementStats.correctNumber }}
+          <div class="correction-actions">
+            <div class="button-container">
+              <div class="left-buttons">
+                <el-button 
+                  style="background-color:#597D3B;color:white;width:200px" 
+                  @click="submitComment" 
+                  class="submit-button"
+                  :loading="submitting"
+                >
+                  提交评语
+                </el-button>
+                
+                <el-button
+                  style="background-color:#597D3B;color:white;width:200px;margin-top:50px"
+                  @click="handleNext"
+                  :disabled="isAllCorrected"
+                >
+                  下一个
+                </el-button>
+
+                <el-button
+                  style="background-color:#597D3B;color:white;width:200px;margin-top:50px;"
+                  @click="goBack"
+                >
+                  返回
+                </el-button>
+              </div>
+              
+              <!-- 批改进度显示 -->
+              <div class="progress-numbers">
+                已批改/未批改：{{ correctionStats.correctNumber }}/{{ uncorrectedNumber }}
+              </div>
+            </div>
           </div>
         </template>
       </div>
@@ -281,7 +292,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted, onBeforeUnmount, nextTick, defineProps } from "vue";
+import { ref, onMounted, onBeforeUnmount, nextTick, defineProps, computed } from "vue";
 import doubaoApis from "@/apis/doubao";
 import engagementApis from "@/apis/engagement";
 import mediaApis from "@/apis/media";
@@ -339,13 +350,56 @@ const engagement = ref({
   remark: "",
 });
 
-const engagementStats = ref({
-  correctNumber: 0,
+const isSuggestionLoading = ref(true);
+const isVideoEmotionLoading = ref(true);
+const submitting = ref(false);
+
+// 批改进度统计
+const correctionStats = ref({
   engageNumber: 0,
+  correctNumber: 0
 });
 
-const isSuggestionLoading = ref(true);
-const isVideoEmotionLoading = ref(true);
+// 计算批改进度百分比
+const progressPercentage = computed(() => {
+  if (correctionStats.value.engageNumber === 0) return 0;
+  return Math.round((correctionStats.value.correctNumber / correctionStats.value.engageNumber) * 100);
+});
+
+// 计算未批改数量
+const uncorrectedNumber = computed(() => {
+  return correctionStats.value.engageNumber - correctionStats.value.correctNumber;
+});
+
+// 判断是否全部批改完成
+const isAllCorrected = computed(() => {
+  return uncorrectedNumber.value === 0;
+});
+
+// 获取批改进度统计
+const fetchCorrectionStats = async () => {
+  try {
+    const res = await engagementApis.getAssignmentCorrectionStats(props.assignmentId);
+    if (res.data.code === 200) {
+      correctionStats.value = res.data.data;
+    }
+  } catch (error) {
+    console.error('获取批改进度失败:', error);
+  }
+};
+
+// 获取下一个学生作业ID
+const getNextStudentAssignment = async () => {
+  try {
+    const res = await engagementApis.getNextStudentAssignment(props.assignmentId, props.userId);
+    if (res.data.code === 200) {
+      return res.data.data;
+    }
+  } catch (error) {
+    console.error('获取下一个学生失败:', error);
+  }
+  return null;
+};
 
 const emotionChartRef = ref(null);
 let emotionChartInstance = null;
@@ -395,55 +449,35 @@ const createEmotionPieChart = (emotionList) => {
   window.addEventListener("resize", () => emotionChartInstance.resize());
 };
 
-// 跳转到下一个学生
-const goToNextStudent = async () => {
-  try {
-    // 获取下一个学生的 ID
-    const nextStudentRes = await engagementApis.getNextStudentId(props.assignmentId, props.userId);
-    if (nextStudentRes.data.code !== 200 || !nextStudentRes.data.data) {
-      ElMessage.error("获取下一个学生失败");
-      return;
-    }
-
-    // 获取当前作业的批改统计数据
-    const statsRes = await engagementApis.getEngagementStats(props.assignmentId);
-    if (statsRes.data.code !== 200 || !statsRes.data.data) {
-      ElMessage.error("获取批改统计数据失败");
-      return;
-    }
-
-    const { engageNumber, correctNumber } = statsRes.data.data;
-
-    // 判断是否已经完成所有批改
-    if (correctNumber === engageNumber) {
-      ElMessage.info("已全部批改完毕");
-      router.push(`/home/myCorrect/assignment/${props.assignmentId}`);
-      return;
-    }
-
-    // 如果未完成所有批改，跳转到下一个学生
-    const nextStudentId = nextStudentRes.data.data;
+// 处理下一个按钮点击
+const handleNext = async () => {
+  const nextStudentId = await getNextStudentAssignment();
+  if (nextStudentId) {
     router.push({
-      path: `/home/myCorrect/assignment/${props.assignmentId}/airecord`,
+      path: `/home/assignment/${props.assignmentId}/airecord`,
       query: {
-      userId: nextStudentId,
-      assignmentId: props.assignmentId,
-      assignmentName: props.assignmentName || ''
-  },
-});
-  } catch (err) {
-    console.error("跳转失败", err);
-    ElMessage.error("获取下一个学生或批改统计数据失败");
+        userId: nextStudentId,
+        assignmentId: props.assignmentId,
+        assignmentName: props.assignmentName
+      }
+    }).then(() => {
+      window.location.reload();
+    });
+    ElMessage.success("已自动跳转到下一个学生");
+  } else {
+    ElMessage.info("没有下一个学生");
   }
 };
-// 提交评语
+
+// 修改提交评语函数,移除跳转逻辑
 const submitComment = async () => {
   if (!engagement.value.remark || engagement.value.score === 0) {
     ElMessage.warning("请填写评语和评分");
     return;
   }
+  
+  submitting.value = true;
   try {
-    // 调用 API 提交评语和评分
     const response = await engagementApis.engagementCorrect(
       props.userId,
       props.assignmentId,
@@ -454,12 +488,15 @@ const submitComment = async () => {
     );
     if (response.data.code === 200) {
       ElMessage.success("评语提交成功");
+      await fetchCorrectionStats();
     } else {
       ElMessage.error("评语提交失败");
     }
   } catch (error) {
     console.error("提交评语失败:", error);
     ElMessage.error("网络错误，请重试");
+  } finally {
+    submitting.value = false;
   }
 };
 
@@ -857,7 +894,10 @@ onBeforeUnmount(() => {
 });
 
 const goBack = () => {
-  router.go(-1);
+  router.push({
+    name: 'myCorrectWithAssignmentId',
+    params: { assignmentId: props.assignmentId }
+  });
 };
 
 const ROLE = store.user.role;
@@ -906,17 +946,6 @@ onMounted(async () => {
         speakingAIDialogue.value.videoAnalysis.emotion_percentage_dict
       );
     }
-
-    const statsRes = await engagementApis.getEngagementStats(props.assignmentId);
-    if (statsRes.data.code === 200 && statsRes.data.data) {
-      engagementStats.value = {
-        correctNumber: statsRes.data.data.correctNumber,
-       engageNumber: statsRes.data.data.engageNumber
-      };
-    } else {
-      console.warn("获取批改统计失败");
-    }
-
     const engagementRes = await engagementApis.getEngagement(
       props.userId,
       props.assignmentId
@@ -926,6 +955,10 @@ onMounted(async () => {
       score: engagementRes.data.data.score || 0,
       remark: engagementRes.data.data.remark || "",
     };
+    
+    // 获取批改进度统计
+    await fetchCorrectionStats();
+    
     // 渲染每个对话的图表
     nextTick(() => {
       renderAvgScoreChart();
@@ -1127,8 +1160,8 @@ onMounted(async () => {
   margin-left: 40%;
 }
 
-.submit-button ,.next-button{
-  width: 300px;
+.submit-button {
+  width: 30%;
   margin-top: 50px;
 }
 
@@ -1184,15 +1217,37 @@ onMounted(async () => {
   margin-bottom: 30px !important;
 }
 
-.submit-next-group {
+.correction-actions {
   display: flex;
   justify-content: center;
-  /* gap: 20px; */
-  margin-top: 50px;
+  margin-top: 10px;
+}
+
+.button-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+}
+
+.left-buttons {
+  display: flex;
+  gap: 20px;
+  margin-bottom: 10px;
 }
 
-.engagement-stats
-{
-  margin: 0 auto;
+.left-buttons .el-button.is-disabled {
+  background-color: #a8a8a8 !important;
+  border-color: #a8a8a8 !important;
+  color: #ffffff !important;
+  cursor: not-allowed;
+}
+
+.progress-numbers {
+  font-size: 16px;
+  color: #666;
+  font-weight: 700;
+  margin-top: 10px;
 }
 </style>

src/views/CorrectPage/CorrectPage.vue

@@ -30,19 +30,6 @@
       <div class="my-correct-remark">
         <Remark :studentId="studentId" :assignmentId="assignmentId" />
       </div>
-
-      <div class="my-correct-number">
-        已批改：{{ engagementStats.correctNumber }}
-        未批改：{{ engagementStats.engageNumber - engagementStats.correctNumber }}
-      </div>
-
-      <div class="my-correct-next">
-        <el-button color="#597D3B" @click="goToNextStudent">下一个</el-button>
-      </div>
-
-      <div class="my-correct-goback">
-        <el-button color="#597D3B" @click="goBack">返回</el-button>
-      </div>
     </div>
   </div>
 
@@ -84,7 +71,7 @@ import { useRoute } from 'vue-router'
 import StudentEssay from "../Home/component/StudentEssay/StudentEssay.vue";
 import StudentWritingRequirements from "../Home/component/StudentEssay/StudentWritingRequirements.vue";
 import Remark from "../Home/component/Remark/Remark.vue";
-import { ElMessage } from 'element-plus';
+
 
 // 获得路由中的assignmentId
 const route = useRoute()
@@ -108,11 +95,6 @@ const dataForm = reactive<{
   engagement: {} as engagementVO
 })
 
-const engagementStats = reactive({
-  engageNumber: 0,
-  correctNumber: 0
-});
-
 // 获取数据
 async function fetchData() {
   await apis.getAIDialogues(assignmentId, studentId)
@@ -136,17 +118,6 @@ async function fetchData() {
       console.log(_err)
       router.push("/login")
     })
-
-    await apis.getEngagementStats(assignmentId)
-    .then((_res: any) => {
-      if (_res.data.code === 200 && _res.data.data) {
-        engagementStats.engageNumber = _res.data.data.engageNumber;
-        engagementStats.correctNumber = _res.data.data.correctNumber;
-      }
-    })
-    .catch((err: any) => {
-      console.error("获取批改统计数据失败", err);
-    });
 }
 
 const getBehaviorRecords = () => {
@@ -172,106 +143,6 @@ const downloadAllFiles = () => {
   showDialog.value = false;
 };
 
-
-//跳转到下一个学生
-const goToNextStudent = async () => {
-  try {
-    // 获取当前作业的批改统计数据
-    const statsRes = await apis.getEngagementStats(assignmentId);
-    if (statsRes.data.code !== 200 || !statsRes.data.data) {
-      ElMessage.error("获取批改统计数据失败");
-      return;
-    }
-
-    const { engageNumber, correctNumber } = statsRes.data.data;
-
-    // 判断是否已经完成所有批改
-    if (correctNumber === engageNumber) 
-      {
-      ElMessage.info("已全部批改完毕");
-      router.push(`/home/myCorrect/assignment/${assignmentId}`);
-      return;
-    }
-
-    // 获取下一个学生的 ID
-    const nextStudentRes = await apis.getNextStudentId(assignmentId, studentId);
-    if (nextStudentRes.data.code !== 200 || !nextStudentRes.data.data) 
-    {
-      ElMessage.error("获取下一个学生失败");
-      return;
-    }
-
-    const nextStudentId = nextStudentRes.data.data;
-
-    // 如果未完成所有批改，跳转到下一个学生
-    router.push({
-      path: `/home/myCorrect/assignment/${assignmentId}`,
-      query: { studentId: nextStudentId },
-    });
-  } catch (err) {
-    console.error("跳转失败", err);
-    ElMessage.error("获取下一个学生或批改统计数据失败");
-  }
-};
-
-
-// const goToNextStudent = async () => {
-//   try {
-//     const res = await apis.getNextStudentId(assignmentId, studentId);
-//     if (res.data.code === 200) {
-//       const nextStudentId = res.data.data;
-//       if (nextStudentId && nextStudentId !== -1) {
-//         router.push(`/home/myCorrect/assignment/${assignmentId}?studentId=${nextStudentId}`);
-//       } else {
-//         ElMessage.success("所有作业已批改完成！");
-//         router.push(`/home/myCorrect/assignment/${assignmentId}`);
-//       }
-//     } else {
-//       ElMessage.error("获取下一个学生失败" + res.data.msg);
-//     }
-//   } catch (err) {
-//     console.log(err);
-//     ElMessage.error("请求失败，请稍后重试");
-//   }
-// };
-
-// const goToNextStudent = async () => {
-//   try {
-//     // 获取下一个学生的 ID
-//     const nextStudentRes = await apis.getNextStudentId(assignmentId, studentId);
-//     if (nextStudentRes.data.code !== 200 || !nextStudentRes.data.data) {
-//       ElMessage.error("获取下一个学生失败");
-//       return;
-//     }
-
-//     // 获取当前作业的批改统计数据
-//     const statsRes = await apis.getEngagementStats(assignmentId);
-//     if (statsRes.data.code !== 200 || !statsRes.data.data) {
-//       ElMessage.error("获取批改统计数据失败");
-//       return;
-//     }
-    
-
-//     const { engageNumber, correctNumber } = statsRes.data.data;
-
-//     // 判断是否已经完成所有批改
-//     if (correctNumber === engageNumber) 
-//       {
-//       ElMessage.info("已全部批改完毕");
-//       router.push(`/home/myCorrect/assignment/${assignmentId}`);
-//       return;
-//     }
-
-//     // 如果未完成所有批改，跳转到下一个学生
-//     const nextStudentId = nextStudentRes.data.data;
-//     router.push(`/home/myCorrect/assignment/${assignmentId}?studentId=${nextStudentId}`);
-//   } catch (err) {
-//     console.error("跳转失败", err);
-//     ElMessage.error("获取下一个学生或批改统计数据失败");
-//   }
-// };
-
-
 onMounted(() => {
   fetchData()
   getBehaviorRecords()

src/views/Home/component/Remark/Remark.vue

@@ -10,7 +10,50 @@
       <textarea v-model="correction.remark" placeholder="暂无评语" :readonly="isStudent"></textarea>
     </div>
 
-    <el-button color="#597D3B" @click="handleCorrect" v-if="!isStudent">提交批改</el-button>
+    <div class="correction-actions">
+      <div class="button-group">
+        <div class="left-buttons">
+          <el-button 
+            color="#597D3B" 
+            @click="handleCorrect" 
+            v-if="!isStudent"
+            :loading="submitting"
+          >
+            提交批改
+          </el-button>
+          
+          <el-button
+            color="#597D3B"
+            @click="handleNext"
+            v-if="!isStudent"
+            :disabled="isAllCorrected" 
+          >
+            下一个
+          </el-button>
+
+          <!-- 批改进度显示 -->
+          <span class="progress-text" v-if="!isStudent">
+            已批改/未批改：{{ correctionStats.correctNumber }}/{{ uncorrectedNumber }}
+          </span>
+          
+          <!-- 批改进度条显示 -->
+          <div class="correction-progress" v-if="!isStudent">
+            <el-progress 
+              :percentage="progressPercentage" 
+              :stroke-width="6"
+              color="#597D3B"
+              class="progress-bar"
+            />
+          </div>
+
+        </div>
+
+        <div class="right-buttons">
+          <el-button color="#597D3B" @click="goBack">返回</el-button>
+        </div>
+      </div>
+      
+    </div>
   </div>
 </template>
 
@@ -24,7 +67,6 @@ import { useStore } from "@/store";
 
 const store = useStore()
 
-
 export default defineComponent({
   props: {
     studentId: {
@@ -38,6 +80,7 @@ export default defineComponent({
   },
   setup(props) {
     const isStudent = computed(() => store.user.role === 'STUDENT');
+    const submitting = ref(false);
 
     //定义一个correction接收后端传过来的批改信息（如果有） 
     const correction = ref({
@@ -45,6 +88,41 @@ export default defineComponent({
       remark: ''
     });
 
+    // 批改进度统计
+    const correctionStats = ref({
+      engageNumber: 0,
+      correctNumber: 0
+    });
+
+    // 计算批改进度百分比
+    const progressPercentage = computed(() => {
+      if (correctionStats.value.engageNumber === 0) return 0;
+      return Math.round((correctionStats.value.correctNumber / correctionStats.value.engageNumber) * 100);
+    });
+
+    // 计算未批改数量
+    const uncorrectedNumber = computed(() => {
+      return correctionStats.value.engageNumber - correctionStats.value.correctNumber;
+    });
+
+    // 判断是否全部批改完成
+    const isAllCorrected = computed(() => {
+      return uncorrectedNumber.value === 0;
+    });
+
+    // 获取批改进度统计
+    const fetchCorrectionStats = async () => {
+      const apis = useApis();
+      try {
+        const res = await apis.getAssignmentCorrectionStats(props.assignmentId);
+        if (res.data.code === 200) {
+          correctionStats.value = res.data.data;
+        }
+      } catch (error) {
+        console.error('获取批改进度失败:', error);
+      }
+    };
+
     //新增：获取后台批改数据
     const fetchCorrection = async () => {
       const apis = useApis();
@@ -63,38 +141,137 @@ export default defineComponent({
       }
     };
 
+    // 获取下一个学生作业ID
+    const getNextStudentAssignment = async () => {
+      const apis = useApis();
+      try {
+        console.log(props.assignmentId, props.studentId);
+        const res = await apis.getNextStudentAssignment(props.assignmentId, props.studentId);
+        if (res.data.code === 200) {
+          return res.data.data;
+        }
+      } catch (error) {
+        console.error('获取下一个学生失败:', error);
+      }
+      return null;
+    };
 
     onMounted(() => {
       fetchCorrection();
+      fetchCorrectionStats();
     });
 
     const handleCorrect = async () => {
+      console.log(correction.value.score, correction.value.remark);
+      if (!correction.value.score) {
+        ElMessage.error("请先评分");
+        return;
+      }
+      if (!correction.value.remark) {
+        ElMessage.error("请先输入评语");
+        return;
+      }
       if (isStudent.value) {
         ElMessage.error("学生不能提交批改");
         return;
       } else {
+        submitting.value = true;
         const apis = useApis();
         try {
           await apis.engagementCorrect(props.studentId, props.assignmentId, correction.value)
-            .then(res => {
+            .then(async (res) => {
               if (res.data.code === 200) {
                 ElMessage.success("批改成功");
-             //   router.push(`/home/myCorrect/assignment/${props.assignmentId}`);
+                await fetchCorrectionStats();
               } else {
                 ElMessage.error("批改异常" + res.data.msg);
               }
             });
         } catch (err) {
-          console.log(err)
+          console.log(err);
+          ElMessage.error("批改失败，请重试");
+        } finally {
+          submitting.value = false;
+        }
+      }
+    };
+
+    const handleNext = async () => {
+      if (isStudent.value) {
+        ElMessage.error("学生不能跳转到下一个学生");
+        return;
+      } else {
+        const nextStudentId = await getNextStudentAssignment();
+        if (nextStudentId) {
+          router.push({
+            name: 'correct',
+            params: { assignmentId: props.assignmentId },
+            query: { studentId: nextStudentId }
+          }).then(() => {
+            // 强制刷新页面以重新加载数据
+            window.location.reload();
+          });
+          ElMessage.success("已自动跳转到下一个学生");
+        } else {
+          ElMessage.info("没有下一个学生");
         }
       }
     };
 
+    const goBack = () => {
+      router.push({
+        name: 'myCorrectWithAssignmentId',
+        params: { assignmentId: props.assignmentId }
+      });
+    };
+
     return {
       correction,
       handleCorrect,
-      isStudent
+      handleNext,
+      isStudent,
+      submitting,
+      correctionStats,
+      progressPercentage,
+      uncorrectedNumber,
+      isAllCorrected,
+      goBack
     };
   }
 });  
 </script>
+
+<style lang="scss" scoped>
+.correction-actions {
+  margin-top: 20px;
+  
+  .button-group {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 10px;
+    width: 100%;
+
+    .left-buttons {
+      display: flex;
+      gap: 10px;
+    }
+
+    .progress-text {
+      color: #666;
+      font-size: 16px;
+      flex: 1;
+      text-align: center;
+    }
+
+    .right-buttons {
+      display: flex;
+      gap: 10px;
+    }
+  }
+
+  .correction-progress {
+    margin-top: 10px;
+  }
+}
+</style>

src/views/Home/component/Remark/index.scss

@@ -1,4 +1,3 @@
-
 .remark {  
   display: flex;  
   flex-direction: column; // 垂直布局  
@@ -43,4 +42,47 @@ textarea {
   border-radius: 4px; // 边框圆角  
   font-size: 18px;  
   resize: none; // 禁止用户调整大小
+}   
+
+.correction-actions {
+  display: flex;
+  flex-direction: column;
+  gap: 15px;
+  margin-top: 10px;
+  
+  // 让按钮保持原来的宽度
+  .el-button {
+    width: fit-content;
+    align-self: flex-start;
+  }
+}
+
+.button-with-progress {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  
+  .progress-numbers {
+    font-size: 13px;
+    color: #999;
+    font-weight: 400;
+  }
+}
+
+.progress-text {
+  font-size: 14px;
+  color: #666;
+  font-weight: 700;
+  margin-top: 5px;
+  margin-left: 10px;
+}
+
+.correction-progress {
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+  
+  .progress-bar {
+    width: 200px;
+  }
 }