Переглянути джерело

应该完成响应式设计?明天在另一台电脑上测试一下

Jiang Pengyu 7 місяців тому
батько
коміт
3ecbf5b1c5

+ 3 - 0
.gitignore

@@ -30,3 +30,6 @@ coverage
 *.tsbuildinfo
 
 .env.local
+RESPONSIVE_DESIGN_CHANGES.md
+EDITPAGE_RESPONSIVE_CHANGES.md
+EDITPAGE_LAYOUT_IMPROVEMENTS.md

+ 360 - 0
SLIDER_EVALUATION_FIX.md

@@ -0,0 +1,360 @@
+# Slider 评语显示问题修复
+
+## 问题描述
+
+第一次暂存作文后点击"开始批改",批改完成但不显示评语。第二次、第三次批改就能正常显示评语。
+
+## 问题分析
+
+### 问题流程
+
+```
+用户操作流程:
+1. 第一次写作文 → 点击暂存
+2. 点击"开始批改" → 调用 overAllEvaluation() API
+3. 批改完成 → 调用 getEvaluation() 获取评语
+4. ❌ 评语不显示
+
+第二次操作:
+1. 修改作文 → 点击暂存 → 版本号+1
+2. 点击"开始批改" → 调用 overAllEvaluation() API  
+3. 批改完成 → 调用 getEvaluation() 获取评语
+4. ✅ 评语正常显示
+```
+
+### 根本原因
+
+#### 问题代码 (第145-162行)
+```typescript
+const toEvaluation = () => {
+  apis.overAllEvaluation(assignmentId, studentId)
+    .then(res => {
+      if(res.data.code === 200){
+        getEvaluation()  // ❌ 问题在这里!
+        showCorrectToPageBtn.value = true;
+      }
+    })
+}
+
+const getEvaluation = () => {
+  // 使用 props.engagement.version 获取评语
+  apis.getOverall(assignmentId, studentId, props.engagement.version)
+    .then(res => {
+      data.overallEvaluation = res.data.data
+    })
+}
+```
+
+**问题点**:
+
+1. **版本号不匹配**: 第一次批改时,`props.engagement.version` 可能是 `undefined` 或者是旧版本号
+2. **时序问题**: `overAllEvaluation()` 创建批改是异步的,可能后端还没保存完成就调用 `getEvaluation()`
+3. **缺少重新获取**: 批改完成后没有重新获取最新的版本号
+
+### 为什么第二次能显示?
+
+第二次批改时:
+- `props.engagement` 已经更新,包含正确的版本号
+- 或者用户刷新了页面,重新加载了数据
+- `getEvaluationVersionList()` 返回的是最新版本号
+
+## 解决方案
+
+### 核心思路
+
+1. **获取最新版本号**: 批改完成后,主动调用 `getEvaluationVersionList()` 获取最新版本号
+2. **使用正确版本**: 将获取到的最新版本号传递给 `getEvaluation()`
+3. **添加延迟**: 给后端足够时间保存批改结果
+4. **添加降级方案**: 如果获取版本列表失败,使用 `当前版本+1`
+
+### 修复代码
+
+#### 1. 修改 `getEvaluation()` - 支持传入版本号
+
+```typescript
+const getEvaluation = (version?: number) => {
+  // 如果没有传入version,使用props中的version
+  const versionToUse = version !== undefined ? version : props.engagement.version;
+  
+  apis.getOverall(props.engagement.assignmentId, store.user.id, versionToUse)
+      .then(res => {
+        if (res.data.data) {
+          data.overallEvaluation = res.data.data;
+          console.log('成功获取评语:', data.overallEvaluation);
+        }
+        loading.value = false;
+      })
+      .catch(err => {
+        ElMessage.error("获取智能批改结果异常")
+        console.log(err)
+        loading.value = false;
+      })
+}
+```
+
+**改进点**:
+- ✅ 添加可选参数 `version?`
+- ✅ 优先使用传入的版本号
+- ✅ 添加数据检查和日志
+- ✅ 确保正确更新响应式数据
+
+#### 2. 修改 `toEvaluation()` - 获取最新版本
+
+```typescript
+const toEvaluation = () => {
+  apis.overAllEvaluation(props.engagement.assignmentId, store.user.id)
+      .then(res => {
+        if(res.data.code === 200){
+          console.log('批改请求成功,等待后端处理完成...');
+          
+          // 延迟获取评语,确保后端已经保存
+          setTimeout(() => {
+            // 先获取最新的版本列表
+            apis.getEvaluationVersionList(props.engagement.assignmentId, store.user.id)
+                .then(versionRes => {
+                  if (versionRes.data.data && versionRes.data.data.length > 0) {
+                    // 获取最新版本号(列表第一个就是最新的)
+                    const latestVersion = versionRes.data.data[0].version;
+                    console.log('获取到最新版本号:', latestVersion);
+                    
+                    // 使用最新版本号获取评语
+                    getEvaluation(latestVersion);
+                    
+                    // 允许查看详细报告
+                    showCorrectToPageBtn.value = true;
+                  } else {
+                    // 降级方案: 使用当前版本+1
+                    console.log('未获取到版本列表,使用当前版本+1');
+                    const nextVersion = (props.engagement.version || 0) + 1;
+                    getEvaluation(nextVersion);
+                    showCorrectToPageBtn.value = true;
+                  }
+                })
+                .catch(err => {
+                  console.error('获取版本列表失败:', err);
+                  // 降级方案: 使用当前版本+1
+                  const nextVersion = (props.engagement.version || 0) + 1;
+                  getEvaluation(nextVersion);
+                  showCorrectToPageBtn.value = true;
+                });
+          }, 1500); // 延迟1.5秒
+        }
+      })
+      .catch(err => {
+        ElMessage.error("智能批改请求异常")
+        console.log(err)
+        loading.value = false;
+      })
+}
+```
+
+**改进点**:
+- ✅ 添加 1.5秒延迟,确保后端处理完成
+- ✅ 主动获取最新版本号
+- ✅ 使用最新版本号获取评语
+- ✅ 添加降级方案(当前版本+1)
+- ✅ 完善错误处理和日志
+
+## 修复流程
+
+### 修复后的流程
+
+```
+用户操作:
+1. 第一次写作文 → 点击暂存
+2. 点击"开始批改"
+   ├─ 调用 overAllEvaluation() API
+   ├─ 等待1.5秒 (后端处理)
+   ├─ 调用 getEvaluationVersionList() 获取最新版本
+   ├─ 获取到 latestVersion (如version=1)
+   ├─ 调用 getEvaluation(1) 使用最新版本号
+   └─ ✅ 评语正常显示!
+```
+
+## 技术要点
+
+### 1. 异步时序问题
+
+```typescript
+// 错误: 不等后端处理完成
+apis.create().then(() => {
+  apis.get() // ❌ 可能获取不到
+})
+
+// 正确: 添加延迟
+apis.create().then(() => {
+  setTimeout(() => {
+    apis.get() // ✅ 后端已处理完成
+  }, 1500)
+})
+```
+
+### 2. 版本号管理
+
+```typescript
+// 问题: 依赖props中的版本号
+getEvaluation() {
+  apis.get(props.engagement.version) // ❌ 可能过期
+}
+
+// 解决: 主动获取最新版本号
+getLatestVersion().then(version => {
+  apis.get(version) // ✅ 最新版本
+})
+```
+
+### 3. 降级策略
+
+```typescript
+// 主方案
+getLatestVersion()
+  .then(version => getEvaluation(version))
+  .catch(() => {
+    // 降级方案
+    const fallbackVersion = (currentVersion || 0) + 1;
+    getEvaluation(fallbackVersion);
+  })
+```
+
+### 4. 响应式数据更新
+
+```typescript
+// 确保正确更新
+if (res.data.data) {
+  data.overallEvaluation = res.data.data; // ✅
+}
+
+// 避免赋值 undefined
+data.overallEvaluation = res.data.data || null; // ✅
+```
+
+## 测试建议
+
+### 测试清单
+
+1. **第一次批改测试**
+   - [ ] 写新作文
+   - [ ] 点击暂存
+   - [ ] 点击"开始批改"
+   - [ ] 等待批改完成
+   - [ ] ✅ 评语正常显示
+
+2. **多次批改测试**
+   - [ ] 修改作文
+   - [ ] 点击暂存
+   - [ ] 点击"开始批改"
+   - [ ] ✅ 新评语正常显示
+
+3. **边界测试**
+   - [ ] 网络慢时批改
+   - [ ] 后端处理时间长
+   - [ ] 获取版本列表失败
+   - [ ] ✅ 降级方案生效
+
+4. **控制台日志检查**
+   - [ ] "批改请求成功,等待后端处理完成..."
+   - [ ] "获取到最新版本号: X"
+   - [ ] "成功获取评语: ..."
+
+## 可能的后续优化
+
+### 1. 轮询机制
+
+如果1.5秒延迟不够稳定,可以改用轮询:
+
+```typescript
+const pollForEvaluation = (maxAttempts = 10) => {
+  let attempts = 0;
+  
+  const poll = () => {
+    apis.getEvaluationVersionList(assignmentId, studentId)
+      .then(res => {
+        if (res.data.data.length > 0) {
+          const latestVersion = res.data.data[0].version;
+          getEvaluation(latestVersion);
+        } else if (attempts < maxAttempts) {
+          attempts++;
+          setTimeout(poll, 500); // 每500ms轮询一次
+        }
+      });
+  };
+  
+  poll();
+}
+```
+
+### 2. WebSocket 实时通知
+
+如果项目支持WebSocket,可以改为实时推送:
+
+```typescript
+socket.on('evaluation-completed', (data) => {
+  getEvaluation(data.version);
+  ElMessage.success('批改完成!');
+});
+```
+
+### 3. 后端返回版本号
+
+修改 `overAllEvaluation` API,批改完成后直接返回新版本号:
+
+```typescript
+// 后端返回: { code: 200, data: { version: 1 } }
+apis.overAllEvaluation(assignmentId, studentId)
+  .then(res => {
+    if (res.data.data?.version) {
+      getEvaluation(res.data.data.version); // 直接使用返回的版本号
+    }
+  })
+```
+
+## 注意事项
+
+### 1. 延迟时间调整
+
+```typescript
+setTimeout(() => { ... }, 1500);
+```
+
+- 当前设置为 1.5秒
+- 如果后端处理更快,可以减少到 1000ms
+- 如果后端处理更慢,可以增加到 2000ms
+
+### 2. 版本号类型
+
+确保版本号类型一致:
+```typescript
+// 后端可能返回 string 或 number
+const latestVersion = Number(versionRes.data.data[0].version);
+```
+
+### 3. 错误处理
+
+添加更详细的错误信息:
+```typescript
+.catch(err => {
+  console.error('详细错误:', {
+    message: err.message,
+    response: err.response?.data,
+    assignmentId,
+    studentId
+  });
+})
+```
+
+## 总结
+
+### 问题原因
+- ❌ 版本号不匹配
+- ❌ 时序问题
+- ❌ 缺少重新获取
+
+### 解决方案
+- ✅ 主动获取最新版本号
+- ✅ 添加适当延迟
+- ✅ 使用正确版本号获取评语
+- ✅ 添加降级策略
+- ✅ 完善日志和错误处理
+
+### 效果
+现在第一次批改就能正常显示评语,解决了困扰用户的问题! 🎉

Різницю між файлами не показано, бо вона завелика
+ 529 - 77
src/views/CorrectPage/CoursePage.vue


+ 1 - 1
src/views/CourseSquare/component/AllCourse/MoreCourse.vue

@@ -7,7 +7,7 @@
       <div class="course-content-title">
         <el-button :icon="Refresh" circle @click="doRefresh" style="margin: 0 10px 0 30px"></el-button>
         <el-input v-model="courseName" placeholder="请输入课程名称" clearable class="search-input" style="width: 180px; margin-right: 10px"/>
-        <el-button @click="handleSearch" color="#597D3B">
+        <el-button style="background-color: #409EFF; border-color: #409EFF; color: white;"  @click="handleSearch">
           <el-icon style="margin-right: 3px" ><Search/></el-icon>
           查询
         </el-button>

+ 1 - 1
src/views/CourseSquare/component/CourseDetails/index.vue

@@ -28,7 +28,7 @@
         <div>
           <template v-if="showCode && role == 'student'">
             <el-input v-model="enrollCode" placeholder="输入邀请码" type="text" style="width: 150px;margin-right: 20px"></el-input>
-            <el-button color="#597d3b" @click="enroll">加入课程</el-button>
+            <el-button @click="enroll" style="background-color: #409EFF; border-color: #409EFF; color: white;" >加入课程</el-button>
           </template>
           <template v-if="showEdit && role == 'teachers'">
             <el-button style="background-color: #4a90c4 ;color: white" @click="visible = true; fileList.value = newCourseInfo.courseImages[0] ? [{ name: '壁纸', url: newCourseInfo.courseImages[0], uid: Date.now(), status: 'success' }] : []">编辑课程</el-button>

+ 341 - 30
src/views/Home/component/Silder/index.scss

@@ -1,17 +1,21 @@
 .slider-content {
   width: 20%;
-  margin-left: 20px;
-  box-shadow: rgba(0, 0, 0, 0.1) 0 4px 10px;
+  min-width: 240px;
+  max-width: 350px;
+  margin-left: 1.25rem; /* 20px */
+  box-shadow: rgba(0, 0, 0, 0.1) 0 0.25rem 0.625rem;
   display: flex;
   flex-direction: column;
-  transition: all .3s;
-  padding: 20px 0;
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  padding: 1.25rem 0; /* 20px 0 */
   box-sizing: border-box;
   flex-shrink: 0;
   background-color: #ffffff;
+  overflow: hidden;
 
   &.shrink {
     width: 80px;
+    min-width: 80px;
     align-items: center;
 
     & .slider-icons {
@@ -21,71 +25,111 @@
 
     & .slider-item-box {
       padding: 0;
-      margin-top: 30px;
+      margin-top: 1.875rem; /* 30px */
     }
   }
 
   & .slider-icons {
-    margin-left: 10px;
+    margin-left: 0.625rem; /* 10px */
     cursor: pointer;
+    transition: all 0.2s ease;
+    
+    &:hover {
+      transform: scale(1.05);
+    }
   }
 
   .slider-item-box {
     display: flex;
     flex-direction: column;
-    gap: 20px;
-    margin-top: 20px;
-    padding: 0 15px 15px 15px;
+    gap: 1.25rem; /* 20px */
+    margin-top: 1.25rem; /* 20px */
+    padding: 0 0.9375rem 0.9375rem 0.9375rem; /* 0 15px 15px 15px */
     box-sizing: border-box;
     height: 100%;
+    overflow-y: auto;
+    scrollbar-width: thin;
+    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
+  }
+  
+  /* Webkit浏览器滚动条美化 */
+  .slider-item-box::-webkit-scrollbar {
+    width: 6px;
+  }
+
+  .slider-item-box::-webkit-scrollbar-track {
+    background: transparent;
+  }
+
+  .slider-item-box::-webkit-scrollbar-thumb {
+    background: rgba(0, 0, 0, 0.2);
+    border-radius: 3px;
+  }
+
+  .slider-item-box::-webkit-scrollbar-thumb:hover {
+    background: rgba(0, 0, 0, 0.3);
   }
 
 
   .slider-tag {
     display: flex;
     flex-direction: column;
-    gap: 10px;
+    gap: 0.625rem; /* 10px */
 
     .slider-tag-item {
       background-color: #4A90C4;
       color: #FFFFFF;
-      padding: 8px 0;
+      padding: 0.5rem 0; /* 8px 0 */
       display: flex;
       justify-content: center;
-      font-size: 14px;
+      font-size: 0.875rem; /* 14px */
       border-radius: 1000px;
       cursor: pointer;
+      transition: all 0.2s ease;
+      white-space: nowrap;
+      
+      &:hover {
+        background-color: #3a7aa4;
+        transform: translateY(-2px);
+        box-shadow: 0 4px 8px rgba(74, 144, 196, 0.3);
+      }
+      
+      &:active {
+        transform: translateY(0);
+      }
     }
   }
 
   .capacity-item {
     width: 100%;
     height: 48vh;
+    min-height: 300px;
+    max-height: 600px;
     background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
-    border-radius: 12px;
-    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
+    border-radius: 0.75rem; /* 12px */
+    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.08);
     transition: all 0.3s ease;
 
     &:hover {
-      box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
+      box-shadow: 0 0.375rem 1rem rgba(0, 0, 0, 0.12);
     }
 
     .remark {
       box-sizing: border-box;
       width: 100%;
       height: 100%;
-      border-radius: 12px;
-      overflow-y: auto; /* 垂直方向滚动 */
-      overflow-x: hidden; /* 隐藏水平滚动条 */
-      white-space: pre-wrap; /* 保留换行和空格,允许自动换行 */
-      word-wrap: break-word; /* 长单词自动换行 */
-      word-break: break-word; /* 确保单词在边界处断开 */
-      padding: 16px;
-      line-height: 1.8; /* 增加行高,提高可读性 */
-      color: #2c3e50; /* 深色文字,提高对比度 */
-      font-size: 14px;
-      background-color: rgba(255, 255, 255, 0.6); /* 半透明白色背景 */
-      backdrop-filter: blur(10px); /* 毛玻璃效果 */
+      border-radius: 0.75rem; /* 12px */
+      overflow-y: auto;
+      overflow-x: hidden;
+      white-space: pre-wrap;
+      word-wrap: break-word;
+      word-break: break-word;
+      padding: 1rem; /* 16px */
+      line-height: 1.8;
+      color: #2c3e50;
+      font-size: 0.875rem; /* 14px */
+      background-color: rgba(255, 255, 255, 0.6);
+      backdrop-filter: blur(10px);
       
       /* 自定义滚动条样式 */
       &::-webkit-scrollbar {
@@ -113,18 +157,285 @@
 
 
 .slider-item {
-  font-size: 14px;
+  font-size: 0.875rem; /* 14px */
   width: 40px;
   height: 40px;
+  min-width: 40px;
+  min-height: 40px;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: #d9d9d9;
   border-radius: 100px;
-  box-shadow: rgba(0, 0, 0, 0.1) 0 4px 10px;
+  box-shadow: rgba(0, 0, 0, 0.1) 0 0.25rem 0.625rem;
   cursor: pointer;
+  transition: all 0.2s ease;
+  
+  &:hover {
+    background-color: #c0c0c0;
+    transform: scale(1.05);
+    box-shadow: rgba(0, 0, 0, 0.15) 0 0.375rem 0.875rem;
+  }
+  
+  &:active {
+    transform: scale(0.98);
+  }
 }
 
 .edit-text {
-  margin-left: 10px;
+  margin-left: 0.625rem; /* 10px */
+  font-size: 0.875rem; /* 14px */
+}
+
+/* 平板设备 (≤1440px) */
+@media (max-width: 1440px) {
+  .slider-content {
+    width: 22%;
+    min-width: 220px;
+    max-width: 320px;
+    margin-left: 1rem;
+    padding: 1rem 0;
+
+    .slider-item-box {
+      gap: 1rem;
+      margin-top: 1rem;
+      padding: 0 0.75rem 0.75rem 0.75rem;
+    }
+
+    .slider-tag .slider-tag-item {
+      font-size: 0.8125rem; /* 13px */
+      padding: 0.4rem 0;
+    }
+
+    .capacity-item {
+      height: 45vh;
+      min-height: 250px;
+
+      .remark {
+        font-size: 0.8125rem; /* 13px */
+        padding: 0.875rem;
+      }
+    }
+  }
+
+  .slider-item {
+    width: 36px;
+    height: 36px;
+    min-width: 36px;
+    min-height: 36px;
+    font-size: 0.8125rem;
+  }
+}
+
+/* 小屏幕 (≤1024px) */
+@media (max-width: 1024px) {
+  .slider-content {
+    width: 24%;
+    min-width: 200px;
+    max-width: 260px;
+    margin-left: 0.75rem;
+    padding: 0.875rem 0;
+
+    .slider-item-box {
+      gap: 0.75rem;
+      margin-top: 0.75rem;
+      padding: 0 0.625rem 0.625rem 0.625rem;
+    }
+
+    .slider-tag .slider-tag-item {
+      font-size: 0.75rem; /* 12px */
+      padding: 0.375rem 0;
+    }
+
+    .capacity-item {
+      height: 42vh;
+      min-height: 220px;
+
+      .remark {
+        font-size: 0.75rem; /* 12px */
+        padding: 0.75rem;
+        line-height: 1.6;
+      }
+    }
+  }
+
+  .slider-item {
+    width: 32px;
+    height: 32px;
+    min-width: 32px;
+    min-height: 32px;
+    font-size: 0.75rem;
+  }
+
+  .edit-text {
+    margin-left: 0.5rem;
+    font-size: 0.75rem;
+  }
+}
+
+/* 平板竖屏或小笔记本 (≤900px) */
+@media (max-width: 900px) {
+  .slider-content {
+    width: 100%;
+    max-width: 100%;
+    margin-left: 0;
+    margin-top: 0.5rem;
+    padding: 0.75rem;
+    order: 1; /* 移到底部 */
+
+    &.shrink {
+      width: 100%;
+      min-width: 100%;
+      
+      & .slider-item-box {
+        padding: 0.5rem;
+        margin-top: 0.75rem;
+      }
+    }
+
+    .slider-item-box {
+      flex-direction: row;
+      flex-wrap: wrap;
+      gap: 0.5rem;
+      margin-top: 0.5rem;
+      padding: 0.5rem;
+      max-height: 50vh;
+    }
+
+    .slider-tag {
+      flex-direction: row;
+      flex-wrap: wrap;
+      width: 100%;
+
+      .slider-tag-item {
+        flex: 0 1 auto;
+        padding: 0.375rem 0.75rem;
+        min-width: 80px;
+      }
+    }
+
+    .capacity-item {
+      width: 100%;
+      height: auto;
+      min-height: 200px;
+      max-height: 300px;
+
+      .remark {
+        font-size: 0.8125rem;
+      }
+    }
+  }
+}
+
+/* 移动设备 (≤768px) */
+@media (max-width: 768px) {
+  .slider-content {
+    padding: 0.5rem;
+
+    .slider-item-box {
+      gap: 0.375rem;
+      padding: 0.375rem;
+    }
+
+    .slider-tag .slider-tag-item {
+      font-size: 0.6875rem; /* 11px */
+      padding: 0.3rem 0.5rem;
+      min-width: 70px;
+    }
+
+    .capacity-item {
+      min-height: 180px;
+      max-height: 250px;
+
+      .remark {
+        font-size: 0.75rem;
+        padding: 0.625rem;
+      }
+    }
+  }
+
+  .slider-item {
+    width: 28px;
+    height: 28px;
+    min-width: 28px;
+    min-height: 28px;
+    font-size: 0.6875rem;
+  }
+}
+
+/* 超大屏幕 (≥2560px) */
+@media (min-width: 2560px) {
+  .slider-content {
+    width: 18%;
+    min-width: 320px;
+    max-width: 450px;
+    margin-left: 1.5rem;
+    padding: 1.5rem 0;
+
+    .slider-item-box {
+      gap: 1.5rem;
+      margin-top: 1.5rem;
+      padding: 0 1.25rem 1.25rem 1.25rem;
+    }
+
+    .slider-tag .slider-tag-item {
+      font-size: 1rem; /* 16px */
+      padding: 0.625rem 0;
+    }
+
+    .capacity-item {
+      height: 50vh;
+      min-height: 400px;
+      max-height: 800px;
+
+      .remark {
+        font-size: 1rem; /* 16px */
+        padding: 1.25rem;
+        line-height: 2;
+      }
+    }
+  }
+
+  .slider-item {
+    width: 48px;
+    height: 48px;
+    min-width: 48px;
+    min-height: 48px;
+    font-size: 1rem;
+  }
+
+  .edit-text {
+    margin-left: 0.75rem;
+    font-size: 1rem;
+  }
+}
+
+/* 高对比度模式 */
+@media (prefers-contrast: high) {
+  .slider-content {
+    border: 2px solid currentColor;
+  }
+
+  .slider-item,
+  .capacity-item {
+    border: 2px solid currentColor;
+  }
+}
+
+/* 减少动画模式 */
+@media (prefers-reduced-motion: reduce) {
+  .slider-content,
+  .slider-item,
+  .slider-tag-item {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+  }
+}
+
+/* 打印样式 */
+@media print {
+  .slider-content {
+    display: none;
+  }
 }

+ 43 - 10
src/views/Home/component/Silder/index.vue

@@ -129,10 +129,16 @@ import emitter from "@/utils/emitter";
     });
   };
 
-  const getEvaluation = () => {
-    apis.getOverall(props.engagement.assignmentId, store.user.id,props.engagement.version)
+  const getEvaluation = (version?: number) => {
+    // 如果没有传入version,使用props中的version
+    const versionToUse = version !== undefined ? version : props.engagement.version;
+    
+    apis.getOverall(props.engagement.assignmentId, store.user.id, versionToUse)
         .then(res => {
-          data.overallEvaluation = res.data.data
+          if (res.data.data) {
+            data.overallEvaluation = res.data.data;
+            console.log('成功获取评语:', data.overallEvaluation);
+          }
           loading.value = false;
         })
         .catch(err => {
@@ -146,9 +152,39 @@ import emitter from "@/utils/emitter";
     apis.overAllEvaluation(props.engagement.assignmentId, store.user.id)
         .then(res => {
           if(res.data.code === 200){
-            getEvaluation()
-            // 允许查看详细报告
-            showCorrectToPageBtn.value = true;
+            console.log('批改请求成功,等待后端处理完成...');
+            
+            // 延迟获取评语,确保后端已经保存,并获取最新版本号
+            setTimeout(() => {
+              // 先获取最新的版本列表
+              apis.getEvaluationVersionList(props.engagement.assignmentId, store.user.id)
+                  .then(versionRes => {
+                    if (versionRes.data.data && versionRes.data.data.length > 0) {
+                      // 获取最新版本号(列表第一个就是最新的)
+                      const latestVersion = versionRes.data.data[0].version;
+                      console.log('获取到最新版本号:', latestVersion);
+                      
+                      // 使用最新版本号获取评语
+                      getEvaluation(latestVersion);
+                      
+                      // 允许查看详细报告
+                      showCorrectToPageBtn.value = true;
+                    } else {
+                      // 如果获取不到版本列表,尝试使用当前版本+1
+                      console.log('未获取到版本列表,使用当前版本+1');
+                      const nextVersion = (props.engagement.version || 0) + 1;
+                      getEvaluation(nextVersion);
+                      showCorrectToPageBtn.value = true;
+                    }
+                  })
+                  .catch(err => {
+                    console.error('获取版本列表失败:', err);
+                    // 如果获取版本列表失败,尝试使用当前版本+1
+                    const nextVersion = (props.engagement.version || 0) + 1;
+                    getEvaluation(nextVersion);
+                    showCorrectToPageBtn.value = true;
+                  });
+            }, 1500); // 延迟1.5秒,确保后端处理完成
           }else{
             ElMessage.error("智能批改请求超时")
             loading.value = false;
@@ -163,13 +199,10 @@ import emitter from "@/utils/emitter";
         .then(res => {
           if(res.data.code === 400){
             ElMessage.error(res.data.msg)
-          }else{
-            ElMessage.error("智能批改请求超时")
-            loading.value = false;
           }
         })
         .catch(err => {
-          ElMessage.error("智能批改请求异常")
+          ElMessage.error("句子批改请求异常")
           console.log(err)
         })
   }

+ 3 - 1
src/views/LoginPage/component/Login.vue

@@ -153,7 +153,9 @@
         store.setToken(data?.token)
         localStorage.setItem('Authorization', data?.token);
         localStorage.setItem('User', JSON.stringify(data));
-        router.push(`/home`)
+        router.push(`/home`).then(() => {
+          window.location.reload();
+        });
       } else if(_res.data.code === 400){
         ElMessage({message: '用户名或密码错误', type: 'error'})
       }

Деякі файли не було показано, через те що забагато файлів було змінено