Compare commits

...

7 Commits

Author SHA1 Message Date
lbw
fcf381b8f1 fix(exam): 优化考试单词识别与文件上传功能
- 修改application.yml默认激活环境为pro,调整上传文件大小限制为30MB
- 更新pro配置中的模板文件版本和路径
- 修复考试单词ID乱序问题,添加生成试卷成功日志
- 优化考试识别逻辑,确保ansSheetPath变量正确处理,完善异常捕获与文件删除机制
- 增加上传文件格式白名单校验,强化文件存储路径和命名安全性
- 用NIO替换File操作,确保上传目录存在并合理创建
- 优化PngUtil图像二值化处理,增加自适应阈值和形态学操作减少噪声
- 修改未背熟单词识别阈值,调整检测区域坐标和日志输出
- 注释部分冗余图像预处理代码,完善日志和异常信息提示
- 统一文件上传与识别过程的错误处理和日志记录,提升系统稳定性和可维护性
2026-01-06 14:48:01 +08:00
lbw
fb29acc145 feat(ui): 提升界面响应式支持和移动端适配体验
- 新增移动端全屏对话框支持及标签宽度和位置动态调整,优化新增班级、年级和学生弹窗布局
- 所有对话框增加屏幕宽度监听,实现自动切换移动端和桌面端样式
- 表格组件增加移动端列表视图,隐藏侧边栏并改进分页和按钮自适应,提升小屏幕浏览体验
- Dialog及详情弹窗添加最大高度限制并启用滚动,防止移动端显示区域拥挤
- 登录页增加安全区域内边距,保证iOS等设备显示完整性
- 新增移动端菜单抽屉组件,支持手机端侧边栏交互显示
- 学生详情页调整词汇热力图列数,实现移动端更合理布局
- 表格和按钮统一增设触控友好大尺寸区域,提升移动端操作便利性
- 修正后端空词汇ID查询问题,避免空列表导致查询异常
- 统一隐藏小屏幕时的固定侧边栏,避免界面混乱和重复显示
- 搜索页和上传页表格添加移动端适配样式和展开收起逻辑,提升列表浏览灵活性
2026-01-05 18:47:50 +08:00
lbw
7182371c92 fix(enlish-service): 优化单词数据处理及模板配置更新
- 修改开发和生产环境配置中的数据库连接及模板文件路径
- ExamWordsController新增单词列表拆分为两部分返回
- ExamWordsServiceImpl增加单词数量不足时补充逻辑,确保单词数量满足要求
- LessonPlansServiceImpl优化教案数据组装,增加班级信息及单词列表拆分功能
- PngUtil调整图像二值化阈值,完善轮廓检测及未背熟单词识别逻辑,移除冗余代码
- SaTokenConfigure更新路由权限配置,添加对tts接口的不拦截支持
- 删除StudentExamWordsDOMapper中is_completed条件,调整查询方式
- UserController修正接口日志注释,准确描述修改用户信息功能
- VocabularyBankDOMapper新增根据年级与排除ID查询单词接口及SQL映射
- WordExportUtil更新导出配置,支持拆分单词列表绑定两个集合以适应新结构
2026-01-05 18:09:36 +08:00
lbw
09b326c07a feat(login): 优化登录注册页UI和交互体验
- 使用全屏背景图和渐变叠加提升视觉效果
- 增加登录注册切换标签及动画过渡效果
- 表单输入框增加图标和玻璃质感样式
- 调整表单布局,简化登录表单,丰富注册表单字段
- 替换原有按钮为渐变风格提升点击感
- 引入FontAwesome图标库支持图标显示
- 增加输入框聚焦和悬停状态样式
- 优化Loading状态文案展示逻辑
2026-01-05 12:56:32 +08:00
lbw
49963bb49c feat(user): 添加用户信息修改功能及对应验证码校验
- 在管理员页面新增修改用户信息表单,支持姓名、手机号、密码修改
- 实现验证码发送倒计时与发送状态管理
- 新增接口支持用户信息更新,包含密码和手机号校验
- 后端校验验证码有效性,编码密码后更新用户信息
- 修改用户信息后强制登出,确保安全性
- 优化登录状态判断,登出后跳转至登录页
- 取消部分日志打印,调整发送验证码缓存过期时间为5分钟
2026-01-05 12:07:15 +08:00
lbw
bf2a80917c style(ui): 优化页面容器及布局样式,调整头部组件图标和交互
- 为多个页面容器添加最小高度类,保证页面满屏显示
- 调整部分主内容区高度样式,增强布局一致性和视觉整洁
- 替换头部组件Logo为自定义SVG图标,提升品牌识别度
- 优化头部用户菜单按钮交互和样式,统一暗黑模式视觉效果
- 调整TTS页面词汇列表布局,支持移动端和桌面端不同显示方式
- 修改学生详情页面样式,提升各模块容器的统一性和分隔感
- 修正历史数据日期格式,将“T”替换为空格以增强可读性
2026-01-05 11:21:55 +08:00
lbw
deabd5f7f5 feat(exam): 优化考试判卷逻辑并完善相关接口
- 新增获取未完成判卷数量接口 getExamUnfinishedCount
- 修改定时任务 autoJudgeExamWords 使用未完成判卷数量判断
- Mapper 添加 selectUnfinishedCount 方法,SQL查询未完成记录数
- 优化文件上传判卷时日志输出,增加“上传文件成功”日志
- 修正判卷时未识别学生和考试的提示信息
- 移除学生查询页面中班级和年级ID显示,仅保留名称显示
- 测试类中添加判卷方法调用测试逻辑
- 配置文件增加 Sa-Token 相关日志调试配置
2026-01-04 18:52:50 +08:00
51 changed files with 1137 additions and 450 deletions

View File

@@ -25,11 +25,13 @@ public class SaTokenConfigure implements WebMvcConfigurer {
SaRouter.match("/**")
.notMatch("/login/**")
.notMatch("plan/word/voice")
.notMatch("/plan/word/voice")
.notMatch("/plan/word/voice/tts")
.check(r -> StpUtil.checkLogin());
SaRouter.match("/admin/**")
.notMatch("plan/word/voice")
.notMatch("/plan/word/voice")
.notMatch("/plan/word/voice/tts")
.check(r -> StpUtil.checkRole("root"));
}))

View File

@@ -62,7 +62,7 @@ public class ExamWordsController {
// bug: 获取单词后单词的id会乱序、 需要重新更新考试记录中的 id
examWordsDO.setWordIds(assessmentWords.stream().map(Word::getId).toList());
examWordsService.updateExamWordsWordIdsOrder(examWordsDO);
log.info("生成试卷成功 {}", examWordsDO);
List<StudentDetail> studentDetailList = studentService.getStudentDetailList(Collections.singletonList(studentId));
List<Map<String, Object>> maps = studentDetailList.stream().map(studentDetail -> {
Map<String, Object> data = new HashMap<>();
@@ -72,6 +72,12 @@ public class ExamWordsController {
data.put("examStr", examWordsDO.getTitle());
data.put("words", assessmentWords);
data.put("answer", assessmentWords);
List<Word> words1 = assessmentWords.subList(0, assessmentWords.size() / 2);
List<Word> words2 = assessmentWords.subList(assessmentWords.size() / 2, assessmentWords.size());
data.put("words1", words1);
data.put("words2", words2);
return data;
}).toList();

View File

@@ -1,16 +1,22 @@
package com.yinlihupo.enlish.service.controller;
import cn.dev33.satoken.stp.StpUtil;
import com.yinlihupo.enlish.service.domain.dataobject.UserDO;
import com.yinlihupo.enlish.service.model.vo.user.FindUserInfoRspVO;
import com.yinlihupo.enlish.service.model.vo.user.UpdateUserInfoReqVO;
import com.yinlihupo.enlish.service.service.UserService;
import com.yinlihupo.framework.biz.operationlog.aspect.ApiOperationLog;
import com.yinlihupo.framework.common.response.Response;
import jakarta.annotation.Resource;
import lombok.extern.slf4j.Slf4j;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
@RequestMapping("/user/")
@Slf4j
public class UserController {
@Resource
@@ -27,4 +33,23 @@ public class UserController {
return Response.success(findUserInfoRspVO);
}
@PostMapping("update-user-info")
@ApiOperationLog(description = "修改用户信息")
public Response<String> updatePassword(@RequestBody UpdateUserInfoReqVO updateUserInfoReqVO) {
try {
String code = updateUserInfoReqVO.getCode();
String newPassword = updateUserInfoReqVO.getNewPassword();
String phone = updateUserInfoReqVO.getPhone();
String name = updateUserInfoReqVO.getName();
userService.updateUserInfo(newPassword, code, phone, name);
StpUtil.logout();
return Response.success();
} catch (Exception e) {
log.error("修改密码失败 {}", e.getMessage());
return Response.fail(e.getMessage());
}
}
}

View File

@@ -19,6 +19,8 @@ public interface ExamWordsJudgeResultDOMapper {
Integer selectCount();
Integer selectUnfinishedCount();
ExamWordsJudgeResultDO selectDetailById(@Param("id") Integer id);
List<ExamWordsJudgeResultDO> selectByStudentId(@Param("studentId") Integer studentId);

View File

@@ -11,6 +11,10 @@ public interface UserDOMapper {
void insert(UserDO userDO);
void updatePassword(@Param("id") Long id, @Param("password") String password);
void updateUserInfo(@Param("id") Long id, @Param("name") String name, @Param("password") String password, @Param("phone") String phone);
UserDO selectById(Long id);
List<UserDO> selectUserDOList(@Param("name") String name, @Param("startIndex") Integer startIndex, @Param("pageSize") Integer pageSize);

View File

@@ -26,4 +26,6 @@ public interface VocabularyBankDOMapper {
Integer selectWordTotal();
List<VocabularyBankDO> selectByUnitIds(@Param("unitIds") List<Integer> unitIds);
List<VocabularyBankDO> selectByGradeIdAndNotMatchIds(@Param("gradeId") Integer gradeId, @Param("ids") List<Integer> ids, @Param("wordCount") Integer wordCount);
}

View File

@@ -0,0 +1,18 @@
package com.yinlihupo.enlish.service.model.vo.user;
import lombok.AllArgsConstructor;
import lombok.Builder;
import lombok.Data;
import lombok.NoArgsConstructor;
@AllArgsConstructor
@NoArgsConstructor
@Builder
@Data
public class UpdateUserInfoReqVO {
private String newPassword;
private String name;
private String phone;
private String code;
}

View File

@@ -13,6 +13,8 @@ public interface ExamWordsJudgeService {
Integer getExamWordsJudgeResultCount();
Integer getExamUnfinishedCount();
ExamWordsJudgeResultDO getExamWordsJudgeResultDOById(Integer id);
List<ExamWordsJudgeResultDO> getStudentExamWordsResultList(Integer studentId);

View File

@@ -13,4 +13,6 @@ public interface UserService {
Integer findUserTotal();
void createUser(UserDO userDO);
void updateUserInfo(String password, String reqCode, String phone, String name);
}

View File

@@ -10,16 +10,17 @@ import org.checkerframework.checker.nullness.qual.NonNull;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
import org.springframework.util.StringUtils;
import org.springframework.web.multipart.MultipartFile;
import java.io.File;
import java.io.IOException;
import java.nio.file.Files;
import java.nio.file.Path;
import java.nio.file.Paths;
import java.time.LocalDate;
import java.time.LocalDateTime;
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
import java.util.UUID;
import java.util.*;
@Service
@Slf4j
@@ -47,7 +48,6 @@ public class ExamWordsServiceImpl implements ExamWordsService {
@Transactional(rollbackFor = RuntimeException.class)
public ExamWordsDO generateExamWords(Integer studentId, Integer type) {
ExamWordsDO examWordsDO;
if (type == ExamWordsConstant.EXAM_TYPE_BASELINE) {
@@ -61,6 +61,16 @@ public class ExamWordsServiceImpl implements ExamWordsService {
examWordsDO = generateFinalExamWords(studentId);
}
List<Integer> wordIds = new ArrayList<>(examWordsDO.getWordIds());
if (wordIds.size() < wordCount) {
log.info("单词数量不足,补充单词");
StudentDO studentDO = studentDOMapper.selectStudentById(studentId);
List<VocabularyBankDO> vocabularyBankDOS = vocabularyBankDOMapper.selectByGradeIdAndNotMatchIds(studentDO.getGradeId(), wordIds, wordCount - wordIds.size());
List<Integer> list = new ArrayList<>(vocabularyBankDOS.stream().map(VocabularyBankDO::getId).toList());
wordIds.addAll(list);
examWordsDO.setWordIds(wordIds);
}
return examWordsDO;
}
@@ -109,7 +119,7 @@ public class ExamWordsServiceImpl implements ExamWordsService {
StudentDO studentDO = studentDOMapper.selectStudentById(studentId);
Integer gradeId = studentDO.getGradeId();
List<UnitDO> unitDOS = unitDOMapper.selectByUnitName(ExamWordsConstant.getGradeName(gradeId) + "");
ExamWordsDO examWordsDO = getExamWordsDO(studentId, studentDO, gradeId, unitDOS);
ExamWordsDO examWordsDO = getExamWordsDO(studentId, studentDO, gradeId, unitDOS, ExamWordsConstant.EXAM_TYPE_MIDTERM);
examWordsDO.setTitle("期中测试" + studentDO.getName());
return getExamWordsDO(studentId, examWordsDO);
@@ -119,13 +129,13 @@ public class ExamWordsServiceImpl implements ExamWordsService {
StudentDO studentDO = studentDOMapper.selectStudentById(studentId);
Integer gradeId = studentDO.getGradeId();
List<UnitDO> unitDOS = unitDOMapper.selectByUnitName(ExamWordsConstant.getGradeName(gradeId));
ExamWordsDO examWordsDO = getExamWordsDO(studentId, studentDO, gradeId, unitDOS);
ExamWordsDO examWordsDO = getExamWordsDO(studentId, studentDO, gradeId, unitDOS, ExamWordsConstant.EXAM_TYPE_FINAL);
examWordsDO.setTitle("期末测试" + studentDO.getName());
return getExamWordsDO(studentId, examWordsDO);
}
@NonNull
private ExamWordsDO getExamWordsDO(Integer studentId, StudentDO studentDO, Integer gradeId, List<UnitDO> unitDOS) {
private ExamWordsDO getExamWordsDO(Integer studentId, StudentDO studentDO, Integer gradeId, List<UnitDO> unitDOS, Integer type) {
if (unitDOS.isEmpty()) {
throw new RuntimeException("没有找到对应的单元");
}
@@ -134,7 +144,7 @@ public class ExamWordsServiceImpl implements ExamWordsService {
ExamWordsDO examWordsDO = ExamWordsDO.builder()
.gradeId(gradeId)
.level(1)
.type(ExamWordsConstant.EXAM_TYPE_BASELINE)
.type(type)
.title(studentDO.getName())
.createdAt(LocalDateTime.now())
.wordIds(vocabularyBankDOS.stream().map(VocabularyBankDO::getId).toList())
@@ -161,29 +171,55 @@ public class ExamWordsServiceImpl implements ExamWordsService {
@Override
@Transactional(rollbackFor = RuntimeException.class)
public int saveExamWordsPngToDbAndLocal(MultipartFile file) {
File dir = new File(tmpPng);
if (!dir.exists()) {
dir.mkdirs();
// 1. 基础校验:判空
if (file == null || file.isEmpty()) {
throw new RuntimeException("上传文件不能为空");
}
// 2. 安全校验:检查后缀名白名单
String originalFilename = file.getOriginalFilename();
String extension = StringUtils.getFilenameExtension(originalFilename); // Spring工具类
List<String> allowedExtensions = Arrays.asList("png", "jpg", "jpeg");
if (extension == null || !allowedExtensions.contains(extension.toLowerCase())) {
throw new RuntimeException("不支持的文件格式,仅支持: " + allowedExtensions);
}
// 3. 准备目录 (使用 NIO)
// 假设 tmpPng 是配置好的基础路径字符串
Path directoryPath = Paths.get(tmpPng);
try {
String originalFilename = file.getOriginalFilename();
String suffix = "";
if (originalFilename != null && originalFilename.contains(".")) {
suffix = originalFilename.substring(originalFilename.lastIndexOf("."));
if (!Files.exists(directoryPath)) {
Files.createDirectories(directoryPath);
}
String newFileName = UUID.randomUUID() + suffix;
String path = tmpPng + newFileName;
File dest = new File(path);
file.transferTo(dest);
// 4. 生成文件名 (防止文件名冲突)
String newFileName = UUID.randomUUID().toString() + "." + extension;
// 5. 组合最终路径 (自动处理分隔符)
Path targetPath = directoryPath.resolve(newFileName);
// 6. 保存文件
file.transferTo(targetPath.toAbsolutePath().toFile());
String string = targetPath.toAbsolutePath().toFile().toString();
log.info("文件上传成功路径为 {}", string);
if (!targetPath.toFile().exists()) {
log.error("文件上传失败: {}", newFileName);
throw new RuntimeException("文件上传失败");
}
// 7. 入库
// 建议:存相对路径或文件名,不要存 targetPath.toString() 的绝对路径
// 这里为了演示,假设 insert 依然接受字符串,建议存 newFileName
int insert = examWordsJudgeResultDOMapper.insert(targetPath.toString());
log.info("上传文件成功: {}", newFileName);
return insert;
return examWordsJudgeResultDOMapper.insert(path);
} catch (IOException e) {
throw new RuntimeException("上传失败", e);
log.error("文件上传失败: {}", originalFilename, e);
throw new RuntimeException("上传失败,请稍后重试", e);
}
}
@Override

View File

@@ -50,19 +50,20 @@ public class ExamWordsJudgeServiceImpl implements ExamWordsJudgeService {
private String tessdataPath;
@Override
@Transactional(rollbackFor = Exception.class)
public void judgeExamWords(int count) {
List<ExamWordsJudgeResultDO> examWordsJudgeResultDOS = examWordsJudgeResultDOMapper.selectUnfinishedExamWordsJudgeResultDOList(count);
for (ExamWordsJudgeResultDO examWordsJudgeResultDO : examWordsJudgeResultDOS) {
String ansSheetPath = null;
try {
String ansSheetPath = examWordsJudgeResultDO.getAnsSheetPath();
ansSheetPath = examWordsJudgeResultDO.getAnsSheetPath();
List<CoordinatesXY> coordinatesXIES = PngUtil.analysisXY(ansSheetPath);
// 从图片中获取学生 id 和考试 id
StudentExamId studentExamId = PngUtil.analyzeExamWordsIdAndStudentId(ansSheetPath, tessdataPath, coordinatesXIES);
Integer examWordsJudgeResultDOId = examWordsJudgeResultDO.getId();
if (studentExamId == null) {
log.info("未找到学生 id 和考试 id");
examWordsJudgeResultDOMapper.updateMsg(examWordsJudgeResultDOId, "未识别学生 id 和考试 id");
examWordsJudgeResultDOMapper.updateMsg(examWordsJudgeResultDOId, "未识别学生和考试");
continue;
}
@@ -80,7 +81,7 @@ public class ExamWordsJudgeServiceImpl implements ExamWordsJudgeService {
}
ExamWordsDO examWordsDO = examWordsDOMapper.selectById(examWordsId);
if(examWordsDO == null) {
if (examWordsDO == null) {
examWordsJudgeResultDOMapper.updateMsg(examWordsJudgeResultDOId, "未找到考试");
continue;
}
@@ -147,9 +148,14 @@ public class ExamWordsJudgeServiceImpl implements ExamWordsJudgeService {
boolean delete = new File(ansSheetPath).delete();
if (delete) {
log.info("删除文件成功:{}", ansSheetPath);
} else {
log.error("删除文件失败:{}", ansSheetPath);
}
} catch (Exception e) {
log.error("识别考试失败 {}", e.getMessage());
if (ansSheetPath != null) {
new File(ansSheetPath).delete();
}
examWordsJudgeResultDOMapper.updateMsg(examWordsJudgeResultDO.getId(), e.getMessage());
}
}
@@ -351,6 +357,11 @@ public class ExamWordsJudgeServiceImpl implements ExamWordsJudgeService {
return examWordsJudgeResultDOMapper.selectCount();
}
@Override
public Integer getExamUnfinishedCount() {
return examWordsJudgeResultDOMapper.selectUnfinishedCount();
}
@Override
public ExamWordsJudgeResultDO getExamWordsJudgeResultDOById(Integer id) {
return examWordsJudgeResultDOMapper.selectDetailById(id);

View File

@@ -21,6 +21,7 @@ import org.springframework.transaction.annotation.Transactional;
import java.time.Duration;
import java.util.Objects;
import java.util.concurrent.TimeUnit;
@Service
@Slf4j
@@ -83,7 +84,9 @@ public class LoginServiceImpl implements LoginService {
@Override
public void sendVerificationCode(String phone) {
String code = RandomUtil.randomNumbers(6);
redisTemplate.opsForValue().set(UserRedisConstants.buildUserLoginCode(phone), code, Duration.ofSeconds(60));
String key = UserRedisConstants.buildUserLoginCode(phone);
redisTemplate.opsForValue().set(key, code);
redisTemplate.expire(key, 5, TimeUnit.MINUTES);
String signName = "短信测试";
String templateCode = "SMS_154950909";
String templateParam = String.format("{\"code\":\"%s\"}", code);

View File

@@ -50,7 +50,8 @@ public class LessonPlansServiceImpl implements LessonPlansService {
private PlanExamDOMapper planExamDOMapper;
@Resource
private RedisTemplate<String, Object> redisTemplate;
@Resource
private ClassDOMapper classDOMapper;
@Override
public void generateLessonPlans(Integer studentId, Integer unitId, Integer wordSize) {
@@ -227,11 +228,16 @@ public class LessonPlansServiceImpl implements LessonPlansService {
examWordsDOMapper.insert(examWordsDO);
studentExamWordsDOMapper.insertStudentsExam(studentId, examWordsDO.getId());
ClassDO classDO = classDOMapper.selectClassDOById(studentDOMapper.selectStudentById(studentId).getClassId());
data.put("examId", examWordsDO.getId());
data.put("studentId", studentId);
data.put("studentStr", studentDO.getName());
data.put("studentStr", gradeDO.getTitle() + " " + classDO.getTitle() + " " + studentDO.getName());
data.put("examStr", ExamTitle);
data.put("checkList", words);
List<VocabularyBankDO> words1 = words.subList(0, words.size() / 2);
List<VocabularyBankDO> words2 = words.subList(words.size() / 2, words.size());
data.put("words1", words1);
data.put("words2", words2);
// LoopRowTableRenderPolicy policy = new LoopRowTableRenderPolicy();
// Configure config = Configure.builder()
// .bind("checkList", policy)
@@ -250,6 +256,7 @@ public class LessonPlansServiceImpl implements LessonPlansService {
List<VocabularyBankDO> checkList,
int day,
GradeDO gradeDO, UnitDO unitDO, Integer studentId) throws Exception {
String title = gradeDO.getTitle() + " " + unitDO.getTitle() + " " + "" + day + "";
Map<String, Object> data = new HashMap<>();
data.put("title", title);
@@ -258,7 +265,6 @@ public class LessonPlansServiceImpl implements LessonPlansService {
data.put("reviewVocabList", reviewVocabList);
data.put("checkList", checkList);
data.put("checkListAns", checkList);
// 中译英
List<Word> list = syncVocabList.stream().map(vocabularyBankDO -> Word.builder().title(vocabularyBankDO.getWord()).definition(vocabularyBankDO.getDefinition()).build()).toList();
list.forEach(word -> word.setTitle(" "));
@@ -344,7 +350,12 @@ public class LessonPlansServiceImpl implements LessonPlansService {
data.put("studentId", studentId);
data.put("studentStr", studentDO.getName());
data.put("examStr", ExamTitle);
data.put("words", words);
List<VocabularyBankDO> words1 = words.subList(0, wordIds.size() / 2);
List<VocabularyBankDO> words2 = words.subList(wordIds.size() / 2, wordIds.size());
data.put("words1", words1);
data.put("words2", words2);
log.info("生成教案小测成功");
// LoopRowTableRenderPolicy policy = new LoopRowTableRenderPolicy();

View File

@@ -120,7 +120,10 @@ public class StudentServiceImpl implements StudentService {
List<Integer> wordIds = new java.util.ArrayList<>(examWordsJudgeResultDOS.stream().map(ExamWordsJudgeResultDO::getCorrectWordIds).flatMap(List::stream).toList());
wordIds.addAll(examWordsJudgeResultDOS.stream().map(ExamWordsJudgeResultDO::getWrongWordIds).flatMap(List::stream).toList());
List<VocabularyBankDO> vocabularyBankDOS = vocabularyBankMapper.selectVocabularyBankDOListByIds(wordIds);
List<VocabularyBankDO> vocabularyBankDOS = new ArrayList<>();
if (!wordIds.isEmpty()) {
vocabularyBankDOS = vocabularyBankMapper.selectVocabularyBankDOListByIds(wordIds);
}
Map<Integer, VocabularyBankDO> id2Word = vocabularyBankDOS.stream().collect(Collectors.toMap(VocabularyBankDO::getId, vocabularyBankDO -> vocabularyBankDO));
List<ExamWordsJudgeResultDetail> examWordsJudgeResultDetails = new ArrayList<>();

View File

@@ -1,14 +1,18 @@
package com.yinlihupo.enlish.service.service.user;
import cn.dev33.satoken.stp.StpUtil;
import com.yinlihupo.enlish.service.constant.UserRedisConstants;
import com.yinlihupo.enlish.service.domain.dataobject.UserDO;
import com.yinlihupo.enlish.service.domain.mapper.UserDOMapper;
import com.yinlihupo.enlish.service.service.UserService;
import jakarta.annotation.Resource;
import lombok.extern.slf4j.Slf4j;
import org.springframework.data.redis.core.RedisTemplate;
import org.springframework.security.crypto.password.PasswordEncoder;
import org.springframework.stereotype.Service;
import java.util.List;
import java.util.Objects;
@Service
@Slf4j
@@ -17,8 +21,10 @@ public class UserServiceImpl implements UserService {
@Resource
private UserDOMapper userDOMapper;
@Resource
private RedisTemplate<String, Object> redisTemplate;
@Resource
private PasswordEncoder passwordEncoder;
@Override
public UserDO findUser() {
@@ -43,4 +49,21 @@ public class UserServiceImpl implements UserService {
userDOMapper.insert(userDO);
}
@Override
public void updateUserInfo(String password, String reqCode, String phone, String name) {
long id = Integer.parseInt(String.valueOf(StpUtil.getLoginId()));
UserDO userDO = userDOMapper.selectById(id);
String key = UserRedisConstants.buildUserLoginCode(userDO.getPhone());
String code = Objects.requireNonNull(redisTemplate.opsForValue().get(key)).toString();
if (code == null || !code.equals(reqCode)) {
throw new RuntimeException("验证码错误");
}
if (password != null) {
password = passwordEncoder.encode(password);
}
userDOMapper.updateUserInfo(id, name, password, phone);
}
}

View File

@@ -15,7 +15,7 @@ public class AutoJudgeExamWordsTask {
@Scheduled(fixedRate = 5000)
public void autoJudgeExamWords() {
if (examWordsJudgeService.getExamWordsJudgeResultCount() != 0) {
if (examWordsJudgeService.getExamUnfinishedCount() != 0) {
log.info("有试卷待检测,开始检测");
examWordsJudgeService.judgeExamWords(5);
}

View File

@@ -15,6 +15,7 @@ import org.opencv.imgproc.Imgproc;
import java.awt.image.BufferedImage;
import java.awt.image.DataBufferByte;
import java.io.File;
import java.util.ArrayList;
import java.util.Comparator;
import java.util.List;
@@ -31,29 +32,11 @@ public class PngUtil {
// 获取起始坐标
public static List<CoordinatesXY> analysisXY(String imagePath) {
Mat binary = image2BinaryMath(imagePath);
Mat src = Imgcodecs.imread(imagePath);
if (src.empty()) {
System.out.println("无法读取图片,请检查路径。");
return null;
}
// 3. 预处理
// 3.1 转换为灰度图
Mat gray = new Mat();
Imgproc.cvtColor(src, gray, Imgproc.COLOR_BGR2GRAY);
// 3.2 二值化处理 (Thresholding)
// 使用 THRESH_BINARY_INV (反转二值化),因为我们需要找的是白色背景上的黑色块。
// 反转后,黑色块变成白色(255),背景变成黑色(0),方便 findContours 查找。
Mat binary = new Mat();
// 阈值设为 50 左右即可,因为块是纯黑的
Imgproc.threshold(gray, binary, 50, 255, Imgproc.THRESH_BINARY_INV);
// 4. 查找轮廓
List<MatOfPoint> contours = new ArrayList<>();
Mat hierarchy = new Mat();
// RETR_EXTERNAL 只检测最外层轮廓,忽略块内部可能存在的噪点
Imgproc.findContours(binary, contours, hierarchy, Imgproc.RETR_EXTERNAL, Imgproc.CHAIN_APPROX_SIMPLE);
System.out.println("检测到的轮廓总数: " + contours.size());
@@ -89,67 +72,44 @@ public class PngUtil {
System.out.println("------------------------------------------------");
list.add(CoordinatesXY.builder().x(rect.x).y(rect.y).width(rect.width).height(rect.height).build());
// 可选:在原图上画出框,用于调试验证
// Imgproc.rectangle(src, rect, new Scalar(0, 0, 255), 2); // 红色框
// Imgproc.putText(src, "#" + blockCount, new Point(rect.x, rect.y - 5), Imgproc.FONT_HERSHEY_SIMPLEX, 0.5, new Scalar(0, 0, 255), 1);
// Imgcodecs.imwrite("output_red.png", src);
Imgproc.rectangle(src, rect, new Scalar(0, 0, 255), 2); // 红色框
Imgproc.putText(src, "#" + blockCount, new Point(rect.x, rect.y - 5), Imgproc.FONT_HERSHEY_SIMPLEX, 0.5, new Scalar(0, 0, 255), 1);
}
}
Imgcodecs.imwrite("output_red.png", src);
System.out.println("找到 " + blockCount + " 个黑色块。");
// 获取每一列的宽度
list.sort(Comparator.comparingInt(CoordinatesXY::getHeight));
int height = list.get(list.size() - 1).getHeight() / ExamWordsConstant.PGN_COL;
// 删除两列答题卡区块
list.sort(Comparator.comparingInt(CoordinatesXY::getWidth));
list.remove(list.size() - 1);
list.remove(list.size() - 1);
// 计算起始坐标
list.sort(Comparator.comparingInt(CoordinatesXY::getX));
// 计算起始坐标
List<CoordinatesXY> ans = getCoordinatesXIES(list, height);
list.forEach(coordinatesXY -> coordinatesXY.setHeight(coordinatesXY.getHeight() / 51));
list.forEach(coordinatesXY -> coordinatesXY.setWidth(coordinatesXY.getWidth() / 3));
list.forEach(coordinatesXY -> coordinatesXY.setX(coordinatesXY.getX() + coordinatesXY.getWidth() * 2));
src.release();
binary.release();
hierarchy.release();
binary.release();
log.info("起始坐标: {}", list);
return ans;
return list;
}
// 获取(未背熟)单词的 id
public static List<Integer> analyzePngForUnmemorizedWordIds(String filePath, List<Integer> wordIds, List<CoordinatesXY> coordinatesXYList) {
Mat src = Imgcodecs.imread(filePath);
if (src.empty()) {
log.error("无法读取图片,请检查路径: {}", filePath);
throw new RuntimeException("无法读取图片");
}
Mat gray = new Mat();
Mat binary = new Mat();
Mat binary = image2BinaryMath(filePath);
try {
Imgproc.cvtColor(src, gray, Imgproc.COLOR_BGR2GRAY);
// 建议:如果光照不均匀,考虑使用 THRESH_OTSU 自动阈值,或者自适应阈值
Imgproc.threshold(gray, binary, 150, 255, Imgproc.THRESH_BINARY_INV);
// 调试时打印
// Imgcodecs.imwrite("output_binary.png", binary);
List<Integer> answer = new ArrayList<>();
int words_index = 0;
for (int i = 0; i < coordinatesXYList.size(); i++) {
CoordinatesXY coordinatesXY = coordinatesXYList.get(i);
for (CoordinatesXY coordinatesXY : coordinatesXYList) {
int width = coordinatesXY.getWidth();
int height = coordinatesXY.getHeight();
int currentX = coordinatesXY.getX();
int currentY = coordinatesXY.getY();
int count = i == 0 ? ExamWordsConstant.PGN_COL - 1 : ExamWordsConstant.PGN_COL;
int currentY = coordinatesXY.getY() + height;
// 内层循环:遍历这一列的每一行
for (int j = 0; j < count; j++) {
for (int j = 0; j < 50; j++) {
// 安全检查:防止单词列表比格子少导致越界
if (words_index >= wordIds.size()) {
log.warn("单词列表耗尽,停止检测。格子数多于单词数。");
@@ -168,12 +128,15 @@ public class PngUtil {
Rect rect = new Rect(currentX + 1, currentY + 1, width - 2, height - 2);
Mat region = binary.submat(rect);
int countNonZero = Core.countNonZero(region);
if (countNonZero > 500) {
log.info("当前位置为 words_index={},坐标为 x={} y={} 当前区域非零像素数: {}", words_index, currentX, currentY, countNonZero);
if (countNonZero > 1000) {
Integer id = wordIds.get(words_index);
answer.add(id);
log.info("检测到标记未背熟ID={}, 当前坐标 x = {} y = {} ", id, currentX + 1, currentY + 1);
}
if (countNonZero == 0) {
break;
}
region.release();
words_index++;
@@ -185,8 +148,6 @@ public class PngUtil {
} finally {
src.release();
gray.release();
binary.release();
}
}
@@ -206,21 +167,21 @@ public class PngUtil {
Rect roiRect = new Rect(0, 0, left.getX(), left.getY());
Mat roi = new Mat(src, roiRect);
// 3. 图像预处理 (提高 OCR 准确率)
// 3.1 转为灰度图
Mat gray = new Mat();
Imgproc.cvtColor(roi, gray, Imgproc.COLOR_BGR2GRAY);
// 3.2 二值化 (Thresholding)
// 使用 OTSU 算法自动寻找最佳阈值,或者手动指定阈值
Mat binary = new Mat();
Imgproc.threshold(gray, binary, 0, 255, Imgproc.THRESH_BINARY | Imgproc.THRESH_OTSU);
// // 3. 图像预处理 (提高 OCR 准确率)
// // 3.1 转为灰度图
// Mat gray = new Mat();
// Imgproc.cvtColor(roi, gray, Imgproc.COLOR_BGR2GRAY);
//
// // 3.2 二值化 (Thresholding)
// // 使用 OTSU 算法自动寻找最佳阈值,或者手动指定阈值
// Mat binary = new Mat();
// Imgproc.threshold(gray, binary, 0, 255, Imgproc.THRESH_BINARY | Imgproc.THRESH_OTSU);
// 可选:保存预处理后的图片查看效果
// Imgcodecs.imwrite("debug_roi.jpg", binary);
Imgcodecs.imwrite("debug_roi.jpg", src);
// 4. 将 OpenCV Mat 转换为 BufferedImage (供 Tess4J 使用)
BufferedImage processedImage = matToBufferedImage(binary);
BufferedImage processedImage = matToBufferedImage(src);
// 5. 使用 Tesseract 进行 OCR 识别
ITesseract instance = new Tesseract();
@@ -245,6 +206,50 @@ public class PngUtil {
return null;
}
private static Mat image2BinaryMath(String imagePath) {
if (!new File(imagePath).exists()) {
log.error("图片不存在,请检查路径: {}", imagePath);
throw new RuntimeException("图片不存在");
}
Mat src = Imgcodecs.imread(imagePath);
if (src.empty()) {
log.info("无法读取图片,请检查路径: {}", imagePath);
throw new RuntimeException("无法读取图片");
}
Mat gray = new Mat();
//转换为灰度图
Imgproc.cvtColor(src, gray, Imgproc.COLOR_BGR2GRAY);
Imgproc.GaussianBlur(gray, gray, new Size(5, 5), 0);
Mat binary = new Mat();
Imgproc.adaptiveThreshold(gray, binary, 255,
Imgproc.ADAPTIVE_THRESH_GAUSSIAN_C,
Imgproc.THRESH_BINARY_INV, 25, 10);
Mat kernel = Imgproc.getStructuringElement(Imgproc.MORPH_RECT, new Size(3, 3));
//开运算 (Open):先腐蚀后膨胀,用于去除背景中的微小噪点
Imgproc.morphologyEx(binary, binary, Imgproc.MORPH_OPEN, kernel);
// 闭运算 (Close):先膨胀后腐蚀,用于连接断裂的区域并填充块内部的空洞
// 如果块比较大且内部反光严重,可以将 Size(3,3) 改为 Size(5,5) 或更大
Mat closeKernel = Imgproc.getStructuringElement(Imgproc.MORPH_RECT, new Size(7, 7));
Imgproc.morphologyEx(binary, binary, Imgproc.MORPH_CLOSE, closeKernel);
// 保存二值化过程图用于调试 (生产环境可注释)
Imgcodecs.imwrite("debug_binary_natural.png", binary);
src.release();
gray.release();
return binary;
}
private static @NonNull StudentExamId getStudentExamId(Pattern pattern, String result) {
Matcher matcher = pattern.matcher(result);
StudentExamId studentExamId = new StudentExamId(0, 0);
@@ -276,21 +281,4 @@ public class PngUtil {
return image;
}
private static @NonNull List<CoordinatesXY> getCoordinatesXIES(List<CoordinatesXY> list, int height) {
List<CoordinatesXY> ans = new ArrayList<>();
CoordinatesXY left = new CoordinatesXY();
left.setX(list.get(1).getX());
left.setWidth(list.get(1).getWidth());
left.setHeight(height);
left.setY(list.get(0).getY() + left.getHeight());
ans.add(left);
CoordinatesXY right = new CoordinatesXY();
right.setX(list.get(2).getX());
right.setY(list.get(0).getY());
right.setWidth(list.get(1).getWidth());
right.setHeight(height);
ans.add(right);
return ans;
}
}

View File

@@ -36,6 +36,8 @@ public class WordExportUtil {
LoopRowTableRenderPolicy policy = new LoopRowTableRenderPolicy();
config = Configure.builder()
.bind("words", policy)
.bind("words1", policy)
.bind("words2", policy)
.bind("answer", policy)
.build();
@@ -52,12 +54,14 @@ public class WordExportUtil {
.bind("checkListAns", policyLessonPlanWeekday)
.bind("sentences", policyLessonPlanWeekday)
.bind("sentencesAns", policyLessonPlanWeekday)
.bind("words", policyLessonPlanWeekday)
.bind("words1", policy)
.bind("words2", policy)
.build();
LoopRowTableRenderPolicy policyLessonPlan = new LoopRowTableRenderPolicy();
configLessonPlanWeekend = Configure.builder()
.bind("checkList", policyLessonPlan)
.bind("words1", policy)
.bind("words2", policy)
.build();
}

View File

@@ -2,7 +2,7 @@ spring:
datasource:
driver-class-name: com.mysql.cj.jdbc.Driver # 指定数据库驱动类
# 数据库连接信息
url: jdbc:mysql://124.220.58.5:3306/enlish?allowMultiQueries=true
url: jdbc:mysql://124.220.58.5:3306/dev_english?allowMultiQueries=true
username: root # 数据库用户名
password: YLHP@admin123 # 数据库密码
data:
@@ -31,15 +31,15 @@ spring:
templates:
word: C:\project\java\enlish_edu\enlish\enlish-service\src\main\resources\templates\assessment_v5.docx
word: C:\project\java\enlish_edu\enlish\enlish-service\src\main\resources\templates\assessment_v9.docx
count: 100
data: C:\project\tess
plan:
weekday: C:\project\java\enlish_edu\enlish\enlish-service\src\main\resources\templates\tem_study_plan_v6.docx
weekend: C:\project\java\enlish_edu\enlish\enlish-service\src\main\resources\templates\study_plan_review_v2.docx
weekday: C:\project\java\enlish_edu\enlish\enlish-service\src\main\resources\templates\tem_study_plan_v7.docx
weekend: C:\project\java\enlish_edu\enlish\enlish-service\src\main\resources\templates\study_plan_review_v3.docx
plan_day: 7
tmp:
png: C:\project\java\enlish_edu\enlish\enlish-service\src\main\resources\tmp\png\
png:
ai:
key: app-loC6IrJpj4cS54MAYp73QtGl

View File

@@ -31,15 +31,15 @@ spring:
templates:
word: assessment_v5.docx
word: assessment_v9.docx
count: 100
data: eng.traineddata
data:
plan:
weekday: tem_study_plan_v5.docx
weekend: study_plan_review_v2.docx
weekday: tem_study_plan_v7.docx
weekend: study_plan_review_v3.docx
plan_day: 7
tmp:
png: tmp\png\
png:
ai:
key: app-loC6IrJpj4cS54MAYp73QtGl

View File

@@ -3,12 +3,16 @@ server:
spring:
profiles:
active: dev # 默认激活 dev 本地开发环境
active: pro # 默认激活 dev 本地开发环境
servlet:
multipart:
max-file-size: 30MB
max-request-size: 30MB
mybatis:
# MyBatis xml 配置文件路径
mapper-locations: classpath:/mapper/**/*.xml
############## Sa-Token 配置 (文档: https://sa-token.cc) ##############
sa-token:
# token 名称(同时也是 cookie 名称)
@@ -27,3 +31,6 @@ sa-token:
is-share: true
# 是否输出操作日志
is-log: true
#logging:
# level:
# com.yinlihupo.enlish.service.domain.mapper: debug

View File

@@ -61,7 +61,6 @@
<select id="selectCount" resultType="java.lang.Integer">
select count(1)
from exam_words_judge_result
where is_finished = 0
</select>
<select id="selectDetailById" resultMap="ResultMapWithBLOBs">
@@ -95,4 +94,10 @@
limit #{startIndex}, #{pageSize}
</select>
<select id="selectUnfinishedCount" resultType="java.lang.Integer">
select count(*)
from exam_words_judge_result
where is_finished = 0
</select>
</mapper>

View File

@@ -21,7 +21,6 @@
from student_exam_words
where student_id = #{studentId}
and exam_words_id = #{examWordsId}
and is_completed = 0
</select>
<update id="updateStudentExamWordsFinished">

View File

@@ -20,6 +20,28 @@
values (#{phone}, #{name}, #{password})
</insert>
<update id="updatePassword">
update user
set password = #{password}
where id = #{id}
</update>
<update id="updateUserInfo">
update user
<set>
<if test="password != null">
password = #{password},
</if>
<if test="name != null">
`name` = #{name},
</if>
<if test="phone != null">
phone = #{phone},
</if>
</set>
where id = #{id}
</update>
<select id="selectByPhone" resultMap="BaseResultMap">
select *
from user

View File

@@ -145,5 +145,21 @@
order by rand()
limit 100
</select>
<select id="selectByGradeIdAndNotMatchIds"
resultType="com.yinlihupo.enlish.service.domain.dataobject.VocabularyBankDO">
select *
from vocabulary_bank
where unit_id in (
select unit_id
from grade_unit
where grade_id = #{gradeId}
)
and id not in
<foreach item="id" collection="ids" separator="," open="(" close=")">
#{id}
</foreach>
order by rand()
limit #{wordCount}
</select>
</mapper>

View File

@@ -5,6 +5,7 @@ import com.deepoove.poi.config.Configure;
import com.deepoove.poi.plugin.table.LoopRowTableRenderPolicy;
import com.yinlihupo.enlish.service.domain.dataobject.ExamWordsDO;
import com.yinlihupo.enlish.service.domain.dataobject.VocabularyBankDO;
import com.yinlihupo.enlish.service.domain.mapper.ExamWordsJudgeResultDOMapper;
import com.yinlihupo.enlish.service.model.bo.Word;
import com.yinlihupo.enlish.service.service.ExamWordsService;
import com.yinlihupo.enlish.service.service.VocabularyService;
@@ -24,6 +25,8 @@ public class ExamTest {
private ExamWordsService examWordsService;
@Resource
private VocabularyService vocabularyService;
@Resource
private ExamWordsJudgeResultDOMapper examWordsJudgeResultDOMapper;
@Test
public void test() {
// ExamWordsDO examWordsDO = examWordsService.generateExamWords(5, 0);

View File

@@ -54,6 +54,11 @@ public class ExamWordsJudgeServiceTest {
// }
}
@Test
public void judege() {
examWordsJudgeService.judgeExamWords(5);
}
@Test
public void selectExamWordsJudgeResult() {
// List<ExamWordsJudgeResultDO> examWordsJudgeResult = examWordsJudgeService.getExamWordsJudgeResult(1, 10);

View File

@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>enlish-vue</title>
</head>
<body>

View File

@@ -1 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
<svg width="40" height="40" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5 6C5 4.89543 5.89543 4 7 4H12C13.6569 4 15 5.34315 15 7V17C15 18.6569 13.6569 20 12 20H7C5.89543 20 5 19.1046 5 18V6ZM7 6V10H12C12.5523 10 13 9.55228 13 9C13 8.44772 12.5523 8 12 8H8.5C7.67157 8 7 7.32843 7 6.5V6ZM7 18L7 14H10C10.5523 14 11 13.5523 11 13C11 12.4477 10.5523 12 10 12H7V17.5C7 17.7761 7.22386 18 7.5 18H12C12.5523 18 13 17.5523 13 17V17C13 16.4477 12.5523 16 12 16H8.5C7.67157 16 7 16.6716 7 17.5V18Z"
fill="#0056D2" />
<circle cx="17.5" cy="6.5" r="2.5" fill="#FFAB00" />
</svg>

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 865 B

View File

@@ -3,12 +3,17 @@
<template>
<el-config-provider :locale="locale">
<router-view />
<el-drawer v-model="mobileSidebarOpen" class="md:hidden" title="菜单" size="260px">
<Sidebar />
</el-drawer>
</el-config-provider>
</template>
<script setup>
import zhCn from 'element-plus/es/locale/lang/zh-cn'
const locale = zhCn
import Sidebar from '@/layouts/components/Sidebar.vue'
import { mobileSidebarOpen } from '@/composables/ui.js'
</script>
<style>

View File

@@ -15,3 +15,7 @@ export function getVerificationCode(data) {
export function getUserInfo() {
return axios.post("/user/info")
}
export function updateUserInfo(data) {
return axios.post("/user/update-user-info", data)
}

View File

@@ -43,3 +43,34 @@ html, body, #app {
radial-gradient(1000px at 90% 10%, rgba(2,132,199,0.3) 0%, transparent 40%),
linear-gradient(180deg, #0f172a 0%, #111827 100%);
}
.safe-area {
padding-top: env(safe-area-inset-top);
padding-bottom: env(safe-area-inset-bottom);
padding-left: env(safe-area-inset-left);
padding-right: env(safe-area-inset-right);
}
.media-fluid img,
.media-fluid video {
max-width: 100%;
height: auto;
display: block;
}
.touch-target {
min-height: 44px;
min-width: 44px;
}
@media (max-width: 768px) {
.sidebar-fixed {
display: none;
width: 0;
min-width: 0;
flex: 0 0 auto;
}
.panel-shell {
border-radius: 0.5rem;
}
}

View File

@@ -0,0 +1,12 @@
import { ref } from 'vue'
export const mobileSidebarOpen = ref(false)
export function openMobileSidebar() {
mobileSidebarOpen.value = true
}
export function closeMobileSidebar() {
mobileSidebarOpen.value = false
}

View File

@@ -1,28 +1,28 @@
<template>
<el-dialog v-model="visible" title="新增班级" width="480px" :close-on-click-modal="false">
<el-dialog v-model="visible" title="新增班级" width="480px" :fullscreen="isMobile" :close-on-click-modal="false">
<div class="space-y-4" v-loading="loading">
<el-form label-width="80px">
<el-form :label-width="isMobile ? 0 : 80" :label-position="isMobile ? 'top' : 'right'">
<el-form-item label="班级名称">
<el-input v-model="name" placeholder="请输入班级名称,如:二班" clearable />
<el-input v-model="name" placeholder="请输入班级名称,如:二班" clearable class="w-full" />
</el-form-item>
<el-form-item label="年级">
<el-select v-model="gradeId" placeholder="请选择年级" style="width: 260px">
<el-select v-model="gradeId" placeholder="请选择年级" class="w-full sm:w-[260px]">
<el-option v-for="g in gradeOptions" :key="g.id" :label="g.title" :value="g.id" />
</el-select>
</el-form-item>
</el-form>
</div>
<template #footer>
<div class="flex justify-end gap-2">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" :disabled="!canSubmit" @click="handleSubmit">确定</el-button>
<div class="footer-actions flex sm:justify-end gap-2 sm:flex-row flex-col">
<el-button class="w-full sm:w-auto touch-target" @click="visible = false">取消</el-button>
<el-button class="w-full sm:w-auto touch-target" type="primary" :disabled="!canSubmit" @click="handleSubmit">确定</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { ref, computed, watch } from 'vue'
import { ref, computed, watch, onMounted, onBeforeUnmount } from 'vue'
import { getGradeList } from '@/api/grade'
import { addClass } from '@/api/class'
@@ -41,6 +41,7 @@ const loading = ref(false)
const name = ref('')
const gradeId = ref(null)
const gradeOptions = ref([])
const isMobile = ref(false)
const canSubmit = computed(() => name.value.trim().length > 0 && !!gradeId.value)
@@ -71,6 +72,10 @@ async function handleSubmit() {
}
}
function updateIsMobile() {
isMobile.value = window.matchMedia('(max-width: 768px)').matches
}
watch(
() => props.modelValue,
(v) => {
@@ -78,9 +83,22 @@ watch(
name.value = ''
gradeId.value = props.defaultGradeId ? Number(props.defaultGradeId) : null
fetchGrades()
updateIsMobile()
}
}
)
onMounted(() => {
updateIsMobile()
window.addEventListener('resize', updateIsMobile)
})
onBeforeUnmount(() => {
window.removeEventListener('resize', updateIsMobile)
})
</script>
<style scoped></style>
<style scoped>
.footer-actions :deep(.el-button + .el-button) {
margin-left: 0;
}
</style>

View File

@@ -1,19 +1,19 @@
<template>
<el-dialog v-model="visible" title="新增年级" width="420px" :close-on-click-modal="false">
<el-dialog v-model="visible" title="新增年级" width="420px" :fullscreen="isMobile" :close-on-click-modal="false">
<div class="space-y-4" v-loading="loading">
<el-input v-model="name" placeholder="请输入年级名称,如:一年级" clearable />
<el-input v-model="name" placeholder="请输入年级名称,如:一年级" clearable class="w-full" />
</div>
<template #footer>
<div class="flex justify-end gap-2">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" :disabled="!canSubmit" @click="handleSubmit">确定</el-button>
<div class="footer-actions flex sm:justify-end gap-2 sm:flex-row flex-col">
<el-button class="w-full sm:w-auto touch-target" @click="visible = false">取消</el-button>
<el-button class="w-full sm:w-auto touch-target" type="primary" :disabled="!canSubmit" @click="handleSubmit">确定</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { ref, computed, watch } from 'vue'
import { ref, computed, watch, onMounted, onBeforeUnmount } from 'vue'
import { addGrade } from '@/api/grade'
const props = defineProps({
@@ -29,6 +29,7 @@ const visible = computed({
const loading = ref(false)
const name = ref('')
const canSubmit = computed(() => name.value.trim().length > 0)
const isMobile = ref(false)
async function handleSubmit() {
if (!canSubmit.value) return
@@ -43,12 +44,29 @@ async function handleSubmit() {
}
}
function updateIsMobile() {
isMobile.value = window.matchMedia('(max-width: 768px)').matches
}
watch(
() => props.modelValue,
(v) => {
if (v) name.value = ''
updateIsMobile()
}
)
onMounted(() => {
updateIsMobile()
window.addEventListener('resize', updateIsMobile)
})
onBeforeUnmount(() => {
window.removeEventListener('resize', updateIsMobile)
})
</script>
<style scoped></style>
<style scoped>
.footer-actions :deep(.el-button + .el-button) {
margin-left: 0;
}
</style>

View File

@@ -1,17 +1,17 @@
<template>
<el-dialog v-model="visible" title="新增学生" width="560px" :close-on-click-modal="false">
<el-dialog v-model="visible" title="新增学生" width="560px" :fullscreen="isMobile" :close-on-click-modal="false" class="responsive-dialog">
<div class="space-y-4" v-loading="loading">
<el-form label-width="90px">
<el-form :label-width="isMobile ? 0 : 90" :label-position="isMobile ? 'top' : 'right'">
<el-form-item label="姓名">
<el-input v-model="name" placeholder="请输入学生姓名" clearable />
<el-input v-model="name" placeholder="请输入学生姓名" clearable class="w-full" />
</el-form-item>
<el-form-item label="年级">
<el-select v-model="gradeId" placeholder="请选择年级" style="width: 260px" @change="handleGradeChange">
<el-select v-model="gradeId" placeholder="请选择年级" class="w-full sm:w-[260px]" @change="handleGradeChange">
<el-option v-for="g in gradeOptions" :key="g.id" :label="g.title" :value="g.id" />
</el-select>
</el-form-item>
<el-form-item label="班级">
<el-select v-model="classId" placeholder="请选择班级" style="width: 260px">
<el-select v-model="classId" placeholder="请选择班级" class="w-full sm:w-[260px]">
<el-option v-for="c in filteredClassOptions" :key="c.id" :label="c.title" :value="c.id" />
</el-select>
<div v-if="gradeId && filteredClassOptions.length === 0" class="mt-2 flex items-center gap-2">
@@ -20,15 +20,15 @@
</div>
</el-form-item>
<el-form-item label="入学时间">
<el-date-picker v-model="startDate" type="datetime" placeholder="选择日期时间"
<el-date-picker v-model="startDate" type="datetime" placeholder="选择日期时间" class="w-full"
format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" />
</el-form-item>
</el-form>
</div>
<template #footer>
<div class="flex justify-end gap-2">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" :disabled="!canSubmit" @click="handleSubmit">确定</el-button>
<div class="footer-actions flex sm:justify-end gap-2 sm:flex-row flex-col">
<el-button class="w-full sm:w-auto touch-target" @click="visible = false">取消</el-button>
<el-button class="w-full sm:w-auto touch-target" type="primary" :disabled="!canSubmit" @click="handleSubmit">确定</el-button>
</div>
</template>
</el-dialog>
@@ -36,7 +36,7 @@
</template>
<script setup>
import { ref, computed, watch } from 'vue'
import { ref, computed, watch, onMounted, onBeforeUnmount } from 'vue'
import { getGradeList } from '@/api/grade'
import { getClassList } from '@/api/class'
import { addStudent } from '@/api/student'
@@ -61,6 +61,7 @@ const classId = ref(null)
const startDate = ref('')
const gradeOptions = ref([])
const classOptions = ref([])
const isMobile = ref(false)
const filteredClassOptions = computed(() => {
if (!gradeId.value) return []
@@ -116,6 +117,10 @@ async function handleSubmit() {
}
}
function updateIsMobile() {
isMobile.value = window.matchMedia('(max-width: 768px)').matches
}
watch(
() => props.modelValue,
async (v) => {
@@ -126,9 +131,26 @@ watch(
startDate.value = ''
await fetchBaseOptions()
if (gradeId.value) handleGradeChange()
updateIsMobile()
}
}
)
onMounted(() => {
updateIsMobile()
window.addEventListener('resize', updateIsMobile)
})
onBeforeUnmount(() => {
window.removeEventListener('resize', updateIsMobile)
})
</script>
<style scoped></style>
<style scoped>
.footer-actions :deep(.el-button + .el-button) {
margin-left: 0;
}
.responsive-dialog :deep(.el-dialog__body) {
max-height: 70vh;
overflow-y: auto;
}
</style>

View File

@@ -1,5 +1,5 @@
<template>
<el-dialog v-model="visible" title="词条记录详情" width="820px" :close-on-click-modal="false">
<el-dialog v-model="visible" title="词条记录详情" width="820px" :fullscreen="isMobile" :close-on-click-modal="false" class="responsive-dialog">
<div class="space-y-4" v-loading="loading">
<el-card shadow="hover">
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
@@ -79,7 +79,7 @@
</template>
<script setup>
import { ref, computed, watch } from 'vue'
import { ref, computed, watch, onMounted, onBeforeUnmount } from 'vue'
import { getExamWordsDetailResult } from '@/api/exam'
import { getStudentDetail } from '@/api/student'
import { getWordsListByIds } from '@/api/words'
@@ -101,6 +101,7 @@ const activeNames = ref(['correct', 'wrong'])
const correctTitles = ref([])
const wrongTitles = ref([])
const studentDetail = ref(null)
const isMobile = ref(false)
async function fetchDetail() {
if (!props.id && props.id !== 0) return
@@ -149,10 +150,17 @@ async function fetchStudent() {
studentDetail.value = res?.data?.data ?? null
}
function updateIsMobile() {
isMobile.value = window.matchMedia('(max-width: 768px)').matches
}
watch(
() => props.modelValue,
(v) => {
if (v) fetchDetail()
if (v) {
updateIsMobile()
fetchDetail()
}
}
)
watch(
@@ -161,6 +169,19 @@ watch(
if (visible.value && v !== undefined && v !== null) fetchDetail()
}
)
onMounted(() => {
updateIsMobile()
window.addEventListener('resize', updateIsMobile)
})
onBeforeUnmount(() => {
window.removeEventListener('resize', updateIsMobile)
})
</script>
<style scoped></style>
<style scoped>
.responsive-dialog :deep(.el-dialog__body) {
max-height: 70vh;
overflow-y: auto;
}
</style>

View File

@@ -3,53 +3,63 @@
<div class="p-2">
<div class="panel-shell">
<nav class="fluent-nav px-4 lg:px-6 py-2.5">
<div class="flex flex-wrap justify-between items-center">
<a href="#" class="flex items-center">
<img src="https://flowbite.com/docs/images/logo.svg" class="mr-3 h-6 sm:h-9" alt="Flowbite Logo" width="24" height="24" />
<span class="self-center text-xl font-semibold whitespace-nowrap">Flowbite</span>
</a>
<div class="flex items-center lg:order-2">
<template v-if="userName">
<div class="relative" ref="menuRef">
<button @click="menuOpen = !menuOpen"
class="fluent-btn font-medium rounded-lg text-sm px-4 lg:px-5 py-2 lg:py-2.5 mr-2 flex items-center">
<span class="mr-2">{{ userName }}</span>
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M19 9l-7 7-7-7" />
<div class="flex flex-wrap justify-between items-center">
<a href="#" class="flex items-center">
<svg width="40" height="40" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5 6C5 4.89543 5.89543 4 7 4H12C13.6569 4 15 5.34315 15 7V17C15 18.6569 13.6569 20 12 20H7C5.89543 20 5 19.1046 5 18V6ZM7 6V10H12C12.5523 10 13 9.55228 13 9C13 8.44772 12.5523 8 12 8H8.5C7.67157 8 7 7.32843 7 6.5V6ZM7 18L7 14H10C10.5523 14 11 13.5523 11 13C11 12.4477 10.5523 12 10 12H7V17.5C7 17.7761 7.22386 18 7.5 18H12C12.5523 18 13 17.5523 13 17V17C13 16.4477 12.5523 16 12 16H8.5C7.67157 16 7 16.6716 7 17.5V18Z"
fill="#0056D2" />
<circle cx="17.5" cy="6.5" r="2.5" fill="#FFAB00" />
</svg>
<span class="self-center text-xl font-semibold whitespace-nowrap">英语教育</span>
</a>
<div class="flex items-center lg:order-2">
<template v-if="userName">
<div class="relative" ref="menuRef">
<button @click="menuOpen = !menuOpen"
class="fluent-btn font-medium rounded-lg text-sm px-4 lg:px-5 py-2 lg:py-2.5 mr-2 flex items-center">
<span class="mr-2">{{ userName }}</span>
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M19 9l-7 7-7-7" />
</svg>
</button>
<div v-if="menuOpen" class="fluent-card absolute right-0 mt-2 z-50">
<router-link to="/admid" @click="menuOpen = false"
class="block px-4 py-2 fluent-link">
后台
</router-link>
<button @click="handleLogout"
class="w-full text-left block px-4 py-2 fluent-link">
登出
</button>
</div>
</div>
</template>
<button data-collapse-toggle="mobile-menu-2" type="button" @click="openMobileSidebar()"
class="inline-flex items-center p-2 ml-1 text-sm rounded-lg lg:hidden fluent-btn"
aria-controls="mobile-menu-2" aria-expanded="false">
<span class="sr-only">Open main menu</span>
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
clip-rule="evenodd"></path>
</svg>
<svg class="hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
clip-rule="evenodd"></path>
</svg>
</button>
<div v-if="menuOpen" class="fluent-card absolute right-0 mt-2 z-50">
<router-link to="/admid" @click="menuOpen = false" class="block px-4 py-2 fluent-link">
后台
</router-link>
<button @click="handleLogout" class="w-full text-left block px-4 py-2 fluent-link">
登出
</button>
</div>
</div>
</template>
<button data-collapse-toggle="mobile-menu-2" type="button"
class="inline-flex items-center p-2 ml-1 text-sm rounded-lg lg:hidden fluent-btn"
aria-controls="mobile-menu-2" aria-expanded="false">
<span class="sr-only">Open main menu</span>
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
clip-rule="evenodd"></path>
</svg>
<svg class="hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
clip-rule="evenodd"></path>
</svg>
</button>
</div>
<div class="hidden justify-between items-center w-full lg:flex lg:w-auto lg:order-1" id="mobile-menu-2">
<div class="hidden justify-between items-center w-full lg:flex lg:w-auto lg:order-1"
id="mobile-menu-2">
</div>
</div>
</div>
</div>
</nav>
</div>
</div>
@@ -64,6 +74,7 @@ import { getUserInfo, logout } from '@/api/user'
import { removeToken } from '@/composables/auth'
import { useRouter } from 'vue-router'
import { showMessage } from '@/composables/util.js'
import { openMobileSidebar } from '@/composables/ui.js'
const showLogin = ref(false)
const userName = ref('')
const menuOpen = ref(false)
@@ -73,9 +84,14 @@ async function refreshUser() {
try {
const r = await getUserInfo()
const d = r?.data
userName.value = d?.success ? (d?.data?.name || '') : ''
console.log("header" + d.success)
if (d?.success) {
userName.value = d?.data?.name || ''
} else {
handleLogout()
}
} catch {
userName.value = ''
handleLogout()
}
}
async function handleLogout() {
@@ -86,7 +102,7 @@ async function handleLogout() {
userName.value = ''
menuOpen.value = false
showMessage('已退出登录', 'success')
router.push('/')
router.push('/login')
}
}
function onDocClick(e) {
@@ -111,10 +127,12 @@ onBeforeUnmount(() => {
backdrop-filter: none;
min-height: 56px;
}
:global(.dark) .fluent-nav {
background: transparent;
border-bottom: 0;
}
.fluent-card {
background: rgba(255, 255, 255, 0.6);
border: 1px solid rgba(255, 255, 255, 0.4);
@@ -123,14 +141,17 @@ onBeforeUnmount(() => {
backdrop-filter: blur(16px);
transition: box-shadow 200ms ease, transform 200ms ease;
}
:global(.dark) .fluent-card {
background: rgba(55, 65, 81, 0.4);
border-color: rgba(148, 163, 184, 0.25);
}
.fluent-card:hover {
box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
transform: translateY(-1px);
}
.fluent-btn {
color: #0f172a;
background: rgba(255, 255, 255, 0.6);
@@ -139,32 +160,39 @@ onBeforeUnmount(() => {
box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
transition: background 200ms ease, box-shadow 200ms ease, transform 200ms ease;
}
.fluent-btn:hover {
background: rgba(255, 255, 255, 0.7);
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
}
:global(.dark) .fluent-btn {
color: #e5e7eb;
background: rgba(55, 65, 81, 0.4);
border-color: rgba(148, 163, 184, 0.25);
}
.fluent-link {
color: #2563eb;
border-radius: 10px;
transition: color 200ms ease, background 200ms ease, box-shadow 200ms ease;
}
.fluent-link:hover {
color: #1d4ed8;
background: rgba(255, 255, 255, 0.35);
box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.25);
}
:global(.dark) .fluent-link:hover {
background: rgba(55, 65, 81, 0.35);
box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.25);
}
.fluent-card {
overflow: visible;
}
:global(.el-header) {
overflow: visible;
padding: 0;

View File

@@ -25,7 +25,7 @@ function sortData(arr) {
function toSource(arr) {
return sortData(arr).map(it => ({
startTime: it.startTime,
startTime: it.startTime.replace('T', ' '),
totalCount: Number(it.totalCount) || 0,
planId: it.planId ?? null,
id: it.id ?? null

View File

@@ -1,13 +1,13 @@
<template>
<div class="common-layout">
<el-container>
<el-container class="min-h-screen">
<el-header>
<Header></Header>
</el-header>
<el-container class="pt-4">
<el-aside width="200px" class="">
<el-aside width="200px" class="hidden md:block sidebar-fixed">
<Sidebar />
</el-aside>
@@ -19,40 +19,77 @@
<el-button type="primary" @click="onSearch">查询</el-button>
<el-button @click="onReset">重置</el-button>
</div>
<el-table ref="tableRef" :data="rows" border class="w-full" v-loading="loading" row-key="id">
<el-table-column type="expand">
<template #default="{ row }">
<div class="p-3">
<div class="text-sm font-semibold mb-2">学案</div>
<el-table :data="row.plans || []" size="small" border>
<el-table-column prop="title" label="标题" min-width="280" />
<el-table-column label="状态" width="120">
<template #default="{ row: plan }">
<el-tag :type="plan.isFinished === 1 ? 'success' : 'info'"
effect="plain">
{{ plan.isFinished === 1 ? '已完成' : '未完成' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="200" fixed="right">
<template #default="{ row: plan }">
<el-button type="primary" size="small"
:loading="downloadingIds.includes(plan.id)"
@click="onDownload(plan)">下载</el-button>
<el-button class="ml-2" type="primary" size="small"
:disabled="plan.isFinished === 1"
:loading="finishingIds.includes(plan.id)"
@click="onFinish(row.id, plan.id, plan)">完成</el-button>
</template>
</el-table-column>
</el-table>
<div class="hidden sm:block overflow-x-auto">
<el-table ref="tableRef" :data="rows" border class="min-w-[720px]" v-loading="loading" row-key="id">
<el-table-column type="expand">
<template #default="{ row }">
<div class="p-3">
<div class="text-sm font-semibold mb-2">学案</div>
<div class="overflow-x-auto">
<el-table :data="row.plans || []" size="small" border class="min-w-[600px]">
<el-table-column prop="title" label="标题" min-width="280" />
<el-table-column label="状态" width="120">
<template #default="{ row: plan }">
<el-tag :type="plan.isFinished === 1 ? 'success' : 'info'"
effect="plain">
{{ plan.isFinished === 1 ? '已完成' : '未完成' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="200" fixed="right">
<template #default="{ row: plan }">
<el-button type="primary" size="small"
:loading="downloadingIds.includes(plan.id)"
@click="onDownload(plan)">下载</el-button>
<el-button class="ml-2" type="primary" size="small"
:disabled="plan.isFinished === 1"
:loading="finishingIds.includes(plan.id)"
@click="onFinish(row.id, plan.id, plan)">完成</el-button>
</template>
</el-table-column>
</el-table>
</div>
</div>
</template>
</el-table-column>
<el-table-column prop="name" label="姓名" min-width="140" />
<el-table-column prop="className" label="班级" min-width="140" />
<el-table-column prop="gradeName" label="年级" min-width="140" />
</el-table>
</div>
<div class="sm:hidden space-y-3">
<div v-for="row in rows" :key="row.id" class="panel-shell p-4">
<div class="text-base font-semibold mb-2">{{ row.name }}</div>
<div class="text-sm text-gray-700 mb-1">班级{{ row.className }}</div>
<div class="text-sm text-gray-700 mb-3">年级{{ row.gradeName }}</div>
<div class="flex justify-between items-center">
<div class="text-sm font-medium">学案</div>
<el-button size="small" @click="toggleMobileExpand(row.id)">
{{ mobileExpanded[row.id] ? '收起' : '展开' }}
</el-button>
</div>
<div v-if="mobileExpanded[row.id]" class="mt-3 space-y-2">
<div v-for="plan in (row.plans || [])" :key="plan.id"
class="rounded-lg border border-white/30 bg-white/50 p-3">
<div class="text-sm font-medium mb-2">{{ plan.title }}</div>
<div class="mb-2">
<el-tag :type="plan.isFinished === 1 ? 'success' : 'info'" effect="plain">
{{ plan.isFinished === 1 ? '已完成' : '未完成' }}
</el-tag>
</div>
<div class="flex gap-2">
<el-button type="primary" size="small"
:loading="downloadingIds.includes(plan.id)"
@click="onDownload(plan)">下载</el-button>
<el-button type="primary" size="small"
:disabled="plan.isFinished === 1"
:loading="finishingIds.includes(plan.id)"
@click="onFinish(row.id, plan.id, plan)">完成</el-button>
</div>
</div>
</template>
</el-table-column>
<el-table-column prop="name" label="姓名" min-width="120" />
<el-table-column prop="className" label="班级" min-width="120" />
<el-table-column prop="gradeName" label="年级" min-width="120" />
</el-table>
</div>
</div>
</div>
<div class="mt-4 flex justify-end">
<el-pagination background layout="prev, pager, next, sizes, total" :total="totalCount"
:page-size="pageSize" :current-page="pageNo" @current-change="handlePageChange"
@@ -84,6 +121,12 @@ const searchName = ref('')
const tableRef = ref(null)
const downloadingIds = ref([])
const finishingIds = ref([])
const mobileExpanded = ref({})
function toggleMobileExpand(id) {
const v = mobileExpanded.value[id]
mobileExpanded.value[id] = !v
}
async function fetchLessonPlans() {
loading.value = true

View File

@@ -1,72 +1,94 @@
<template>
<div class="w-screen h-screen overflow-hidden flex">
<div class="flex-1 bg-black">
<el-image fit="cover" src="https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg"
style="width: 100%; height: 100%" />
</div>
<div class="w-[500px] z-10 bg-white dark:bg-gray-800 p-8">
<div class="mb-4 grid grid-cols-2 gap-2 justify-center pt-64">
<button type="button" @click="switchMode('login')" class="w-full px-3 py-1.5 rounded text-sm"
:class="mode === 'login' ? 'bg-blue-500 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'">
登录
</button>
<button type="button" @click="switchMode('register')" class="w-full px-3 py-1.5 rounded text-sm"
:class="mode === 'register' ? 'bg-blue-500 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'">
注册
</button>
<div
class="min-h-screen relative flex items-center justify-center bg-scroll md:bg-fixed bg-cover bg-center bg-[url('https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg')] safe-area">
<div class="absolute inset-0 bg-gradient-to-br from-[rgba(30,20,50,0.4)] to-[rgba(10,10,20,0.6)]"></div>
<div
class="relative z-10 w-full sm:w-[400px] max-w-[420px] sm:max-w-[92%] bg-white/10 backdrop-blur-2xl border border-white/20 rounded-2xl p-6 sm:p-8 shadow-2xl text-white">
<div class="text-center mb-6">
<h2 class="text-xl sm:text-2xl font-semibold tracking-wide mb-1">Welcome Back</h2>
<p class="text-sm text-white/80">智慧英语 · 让学习更简单</p>
</div>
<div class="mb-4">
<h1 class="text-2xl font-bold" v-if="mode === 'login'">登录</h1>
<h1 class="text-2xl font-bold" v-else>注册新用户</h1>
<p class="text-sm text-gray-500" v-if="mode === 'login'">请输入手机号和密码进行登录</p>
<p class="text-sm text-gray-500" v-else>请填写以下信息进行注册</p>
<div class="flex justify-center mb-6 border-b border-white/10">
<button class="px-4 sm:px-5 py-2 text-white/70 hover:text-white transition"
:class="mode === 'login' ? 'font-bold text-white border-b-2 border-white' : ''"
@click="switchMode('login')">登录</button>
<button class="px-4 sm:px-5 py-2 text-white/70 hover:text-white transition"
:class="mode === 'register' ? 'font-bold text-white border-b-2 border-white' : ''"
@click="switchMode('register')">注册</button>
</div>
<el-form :model="form" :rules="rules" ref="formRef" class="space-y-4">
<el-form :model="form" :rules="rules" ref="formRef" class="mt-2">
<el-form-item prop="phone">
<el-input v-model="form.phone" maxlength="11" placeholder="手机号" />
<div class="input-glass relative mb-4 w-full">
<el-input v-model="form.phone" maxlength="11" placeholder="请输入手机号 / 账号" />
<i class="fas fa-user absolute left-4 top-1/2 -translate-y-1/2 text-white/80 text-lg pointer-events-none"></i>
</div>
</el-form-item>
<template v-if="mode === 'login'">
<el-form-item prop="password">
<el-input v-model="form.password" type="password" maxlength="20" placeholder="密码" />
</el-form-item>
</template>
<template v-else>
<el-form-item prop="name">
<el-input v-model="form.name" maxlength="20" placeholder="姓名" />
</el-form-item>
<el-form-item prop="password">
<el-input v-model="form.password" type="password" maxlength="20" placeholder="设置密码" />
</el-form-item>
<el-form-item prop="password_repeat">
<el-input v-model="form.password_repeat" type="password" maxlength="20" placeholder="重复密码" />
</el-form-item>
<el-form-item prop="invitationCode">
<el-input v-model="form.invitationCode" maxlength="6" placeholder="邀请码" />
</el-form-item>
<el-form-item prop="code">
<div class="flex items-center gap-2 w-full">
<el-input v-model="form.code" maxlength="6" placeholder="验证码" />
<el-button type="primary" @click="sendCode" :disabled="codeDisabled || !form.phone">
{{ codeBtnText }}
</el-button>
</div>
</el-form-item>
</template>
<transition name="tabfade" mode="out-in">
<div :key="mode">
<template v-if="mode === 'login'">
<el-form-item prop="password">
<div class="input-glass relative mb-4 w-full">
<el-input v-model="form.password" type="password" maxlength="20" placeholder="请输入密码" />
<i class="fas fa-lock absolute left-4 top-1/2 -translate-y-1/2 text-white/80 text-lg pointer-events-none"></i>
</div>
</el-form-item>
</template>
<template v-else>
<el-form-item prop="name">
<div class="input-glass relative mb-4 w-full">
<el-input v-model="form.name" maxlength="20" placeholder="姓名" />
<i class="fas fa-id-card absolute left-4 top-1/2 -translate-y-1/2 text-white/80 text-lg pointer-events-none"></i>
</div>
</el-form-item>
<el-form-item prop="password">
<div class="input-glass relative mb-4 w-full">
<el-input v-model="form.password" type="password" maxlength="20" placeholder="设置密码" />
<i class="fas fa-lock absolute left-4 top-1/2 -translate-y-1/2 text-white/80 text-lg pointer-events-none"></i>
</div>
</el-form-item>
<el-form-item prop="password_repeat">
<div class="input-glass relative mb-4 w-full">
<el-input v-model="form.password_repeat" type="password" maxlength="20" placeholder="重复密码" />
<i class="fas fa-lock absolute left-4 top-1/2 -translate-y-1/2 text-white/80 text-lg pointer-events-none"></i>
</div>
</el-form-item>
<el-form-item prop="invitationCode">
<div class="input-glass relative mb-4 w-full">
<el-input v-model="form.invitationCode" maxlength="6" placeholder="邀请码" />
<i class="fas fa-ticket absolute left-4 top-1/2 -translate-y-1/2 text-white/80 text-lg pointer-events-none"></i>
</div>
</el-form-item>
<el-form-item prop="code">
<div class="relative mb-2 flex items-center gap-2">
<div class="input-glass relative flex-1">
<el-input v-model="form.code" maxlength="6" placeholder="验证码" />
<i class="fas fa-shield absolute left-4 top-1/2 -translate-y-1/2 text-white/80 text-lg pointer-events-none"></i>
</div>
<el-button class="rounded-lg bg-gradient-to-r from-blue-600 to-blue-400 text-white px-3 py-2"
@click="sendCode" :disabled="codeDisabled || !form.phone">
{{ codeBtnText }}
</el-button>
</div>
</el-form-item>
</template>
</div>
</transition>
</el-form>
<div class="mt-6">
<el-button :type="mode === 'login' ? 'success' : 'warning'" plain class="w-full" :disabled="loading"
@click="userLogin">
<span v-if="!loading && mode === 'login'">立即登录</span>
<span v-if="loading && mode === 'login'">登录中...</span>
<span v-if="!loading && mode === 'register'">立即注册</span>
<span v-if="loading && mode === 'register'">处理中...</span>
</el-button>
</div>
</div>
<div class="absolute bottom-2 left-6 text-white drop-shadow">
<h2 class="text-xl">欢迎来到智慧英语</h2>
<button
class="w-full mt-3 px-4 py-3 rounded-xl bg-gradient-to-r from-blue-600 to-blue-400 text-white font-semibold shadow-lg hover:-translate-y-0.5 hover:shadow-xl transition disabled:opacity-70 disabled:cursor-not-allowed"
:disabled="loading" @click="userLogin">
<span v-if="!loading && mode === 'login'">立即登录</span>
<span v-if="loading && mode === 'login'">登录中...</span>
<span v-if="!loading && mode === 'register'">立即注册</span>
<span v-if="loading && mode === 'register'">处理中...</span>
</button>
</div>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
</div>
</template>
@@ -200,4 +222,26 @@ async function sendCode() {
}
</script>
<style scoped></style>
<style scoped>
.input-glass :deep(.el-input__wrapper) {
@apply w-full bg-white/10 border border-white/10 rounded-xl pl-10 transition;
}
.input-glass :deep(.el-input__wrapper:hover),
.input-glass :deep(.el-input__wrapper.is-focus) {
@apply bg-white/15 border-white/50;
}
.input-glass :deep(.el-input__inner) {
@apply text-white placeholder:text-white/70;
}
.tabfade-enter-active, .tabfade-leave-active {
transition: all .25s ease;
}
.tabfade-enter-from {
opacity: 0;
transform: translateY(8px) scale(.98);
}
.tabfade-leave-to {
opacity: 0;
transform: translateY(-8px) scale(.98);
}
</style>

View File

@@ -1,54 +1,63 @@
<template>
<div class="common-layout">
<el-container>
<el-header>
<Header></Header>
</el-header>
<el-container>
<el-aside width="200px" class="pt-4">
<Sidebar />
</el-aside>
<el-main class="p-4">
<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
<el-container class="pt-4">
<el-main class="p-2">
<div class="panel-shell p-6">
<div class="text-lg font-semibold mb-4">TTS</div>
<div class="flex items-center gap-3 mb-4">
<el-input v-model="planIdInput" placeholder="planId" style="max-width: 220px" />
<div class="flex flex-col sm:flex-row items-stretch sm:items-center gap-3 mb-4">
<!-- <el-input v-model="planIdInput" placeholder="planId" class="w-full sm:w-auto" style="max-width: 220px" /> -->
<el-button type="primary" :loading="loadingWords" @click="onLoadWords">加载词汇</el-button>
<el-select v-model="voice" placeholder="选择声线" style="max-width: 160px">
<!-- <el-select v-model="voice" placeholder="选择声线" class="w-full sm:w-auto" style="max-width: 160px">
<el-option label="alloy" value="alloy" />
<el-option label="verse" value="verse" />
<el-option label="nova" value="nova" />
</el-select>
<el-select v-model="format" placeholder="格式" style="max-width: 120px">
</el-select> -->
<!-- <el-select v-model="format" placeholder="格式" class="w-full sm:w-auto" style="max-width: 120px">
<el-option label="mp3" value="mp3" />
<el-option label="wav" value="wav" />
<el-option label="ogg" value="ogg" />
</el-select>
<el-button type="success" :disabled="words.length === 0" :loading="generatingAll"
@click="onGenerateAll">生成全部音频</el-button>
</el-select> -->
<el-button type="success" :disabled="words.length === 0" :loading="generatingAll" class="!ml-0"
@click="onGenerateAll">生成音频</el-button>
</div>
<el-table :data="tableData" border class="w-full" v-loading="loadingWords">
<el-table-column prop="word" label="词汇/短语" min-width="260" />
<el-table-column label="状态" width="160">
<template #default="{ row }">
<div class="sm:hidden">
<div v-for="row in tableData" :key="row.word" class="panel-shell p-4 mb-3">
<div class="flex items-center justify-between">
<div class="font-medium">{{ row.word }}</div>
<el-tag :type="row.audioUrl ? 'success' : 'info'" effect="plain">
{{ row.audioUrl ? '已生成' : '未生成' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="360" fixed="right">
<template #default="{ row }">
<el-button size="small" type="primary" :loading="row.loading"
@click="onGenerateOne(row)">生成音频</el-button>
<el-button size="small" class="ml-2" :disabled="!row.audioUrl"
@click="onPlay(row)">播放</el-button>
<el-button size="small" class="ml-2" :disabled="!row.audioUrl"
@click="onDownload(row)">下载</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="mt-3 flex flex-wrap gap-2">
<el-button size="small" type="primary" :loading="row.loading" @click="onGenerateOne(row)">生成音频</el-button>
<el-button size="small" :disabled="!row.audioUrl" @click="onPlay(row)">播放</el-button>
<el-button size="small" :disabled="!row.audioUrl" @click="onDownload(row)">下载</el-button>
</div>
</div>
</div>
<div class="hidden sm:block overflow-x-auto">
<el-table :data="tableData" border class="min-w-[640px]" v-loading="loadingWords" size="small">
<el-table-column prop="word" label="词汇/短语" min-width="200" />
<el-table-column label="状态" width="120">
<template #default="{ row }">
<el-tag :type="row.audioUrl ? 'success' : 'info'" effect="plain">
{{ row.audioUrl ? '已生成' : '未生成' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="240" fixed="right">
<template #default="{ row }">
<el-button size="small" type="primary" :loading="row.loading" @click="onGenerateOne(row)">生成音频</el-button>
<el-button size="small" class="ml-2" :disabled="!row.audioUrl" @click="onPlay(row)">播放</el-button>
<el-button size="small" class="ml-2" :disabled="!row.audioUrl" @click="onDownload(row)">下载</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="mt-3 text-sm text-gray-500">
{{ words.length }}
</div>

View File

@@ -48,6 +48,40 @@
<el-alert type="success" :closable="false" :title="`邀请码:${inviteCode}`" show-icon />
</div>
</div>
<div class="panel-shell p-6">
<div class="flex items-center justify-between mb-4">
<span class="text-lg font-semibold">修改用户信息</span>
</div>
<el-form :model="pwForm" :rules="pwRules" ref="pwFormRef" label-width="120px">
<el-form-item label="姓名" prop="name">
<el-input v-model="pwForm.name" />
</el-form-item>
<el-form-item label="新密码" prop="newPassword">
<el-input v-model="pwForm.newPassword" type="password" show-password />
</el-form-item>
<el-form-item label="确认密码" prop="confirmPassword">
<el-input v-model="pwForm.confirmPassword" type="password" show-password />
</el-form-item>
<el-form-item label="手机号" prop="phone">
<el-input v-model="pwForm.phone" />
</el-form-item>
<el-form-item label="验证码" prop="code">
<el-input v-model="pwForm.code">
<template #append>
<el-button :disabled="codeCountdown > 0 || codeSending || !pwForm.phone"
@click="sendCode">
{{ codeCountdown > 0 ? `${codeCountdown}s` : '获取验证码' }}
</el-button>
</template>
</el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" :loading="pwLoading" @click="submitPw">修改用户信息</el-button>
<el-button class="ml-2" @click="resetPw">重置</el-button>
</el-form-item>
</el-form>
</div>
</div>
<el-dialog v-model="createVisible" title="新增用户" width="420px">
@@ -76,8 +110,9 @@
<script setup>
import Header from '@/layouts/components/Header.vue'
import { ref, reactive, onMounted } from 'vue'
import { ref, reactive, onMounted, onUnmounted } from 'vue'
import { getUserList, createUser, createInvitationCode } from '@/api/admin'
import { updateUserInfo, getVerificationCode } from '@/api/user'
import { showMessage } from '@/composables/util.js'
import Sidebar from '@/layouts/components/Sidebar.vue'
@@ -203,4 +238,109 @@ function submitInvite() {
})
}
const pwForm = reactive({ name: '', phone: '', newPassword: '', confirmPassword: '', code: '' })
const pwFormRef = ref()
const pwLoading = ref(false)
const pwRules = {
phone: [{ required: true, message: '请输入手机号', trigger: 'blur' }],
newPassword: [],
confirmPassword: [
{
validator: (rule, value, callback) => {
if (pwForm.newPassword) {
if (!value) {
callback(new Error('请确认密码'))
return
}
if (value !== pwForm.newPassword) {
callback(new Error('两次输入的密码不一致'))
return
}
}
callback()
},
trigger: 'blur'
}
],
code: [{ required: true, message: '请输入验证码', trigger: 'blur' }],
}
function resetPw() {
if (codeTimer) {
clearInterval(codeTimer)
codeTimer = null
}
codeCountdown.value = 0
codeSending.value = false
pwForm.name = ''
pwForm.phone = ''
pwForm.newPassword = ''
pwForm.confirmPassword = ''
pwForm.code = ''
}
const codeCountdown = ref(0)
const codeSending = ref(false)
let codeTimer = null
async function sendCode() {
if (!pwForm.phone) {
showMessage('请输入手机号', 'warning')
return
}
if (codeSending.value || codeCountdown.value > 0) return
codeSending.value = true
try {
const r = await getVerificationCode({ phone: pwForm.phone })
const d = r?.data
if (d?.success) {
showMessage('验证码已发送', 'success')
codeCountdown.value = 60
codeTimer = setInterval(() => {
if (codeCountdown.value > 0) {
codeCountdown.value -= 1
} else {
clearInterval(codeTimer)
codeTimer = null
}
}, 1000)
} else {
showMessage(d?.message || '发送验证码失败', 'error')
}
} finally {
codeSending.value = false
}
}
onUnmounted(() => {
if (codeTimer) {
clearInterval(codeTimer)
codeTimer = null
}
})
function submitPw() {
pwFormRef.value?.validate(async (valid) => {
if (!valid) return
pwLoading.value = true
try {
const r = await updateUserInfo({
newPassword: pwForm.newPassword || '',
name: pwForm.name || '',
phone: pwForm.phone,
code: pwForm.code
})
const d = r?.data
if (d?.success) {
showMessage('用户信息修改成功', 'success')
resetPw()
} else {
showMessage(d?.message || '用户信息修改失败', 'error')
}
} finally {
pwLoading.value = false
}
})
}
</script>

View File

@@ -1,31 +1,42 @@
<template>
<div class="common-layout">
<el-container>
<el-container class="min-h-screen">
<el-header>
<Header></Header>
</el-header>
<el-container class="pt-4">
<el-aside width="200px">
<el-aside width="200px" class="hidden md:block sidebar-fixed">
<Sidebar></Sidebar>
</el-aside>
<el-main class="">
<el-main class="h-full">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="lg:col-span-1 flex flex-col gap-6">
<div class="panel-shell p-6">
<div class="text-lg font-semibold mb-4">班级列表</div>
<el-table ref="classTableRef" :data="classes" border class="w-full" v-loading="loading" highlight-current-row
row-key="id" :current-row-key="selectedClassId" @row-click="onClassRowClick">
<el-table-column prop="title" label="班级名称" min-width="120" />
<el-table-column prop="gradeName" label="年级" min-width="120" />
<div class="hidden sm:block overflow-x-auto">
<el-table ref="classTableRef" :data="classes" border class="min-w-[520px]" v-loading="loading" highlight-current-row
row-key="id" :current-row-key="selectedClassId" @row-click="onClassRowClick">
<el-table-column prop="title" label="班级名称" min-width="160" />
<el-table-column prop="gradeName" label="年级" min-width="120" />
<el-table-column label="操作" width="120" fixed="right">
<template #default="{ row }">
<el-button type="danger" size="small"
@click.stop="onDeleteClass(row)">删除</el-button>
<el-button type="danger" size="small" @click.stop="onDeleteClass(row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="sm:hidden space-y-3">
<div v-for="row in classes" :key="row.id" class="panel-shell p-4">
<div class="text-base font-semibold mb-1">{{ row.title }}</div>
<div class="text-sm mb-2">年级{{ row.gradeName }}</div>
<div class="flex gap-2">
<el-button size="small" type="primary" @click="onClassRowClick(row)">选择</el-button>
<el-button size="small" type="danger" @click="onDeleteClass(row)">删除</el-button>
</div>
</div>
</div>
<div class="mt-4 flex justify-end">
<el-pagination background layout="prev, pager, next, sizes, total"
:total="totalCount" :page-size="pageSize" :current-page="pageNo"
@@ -43,10 +54,8 @@
<div class="text-lg font-semibold mb-4">学生查询</div>
<div class="flex flex-wrap items-center gap-3 mb-4">
<el-input v-model="studentName" placeholder="按姓名查询" clearable style="max-width: 220px" />
<el-tag v-if="selectedClassId" effect="plain">班级{{ selectedClassTitle }} (ID: {{
selectedClassId }})</el-tag>
<el-tag v-if="selectedGradeId" effect="plain">年级{{ selectedGradeTitle }} (ID: {{
selectedGradeId }})</el-tag>
<el-tag v-if="selectedClassId" effect="plain">班级{{ selectedClassTitle }}</el-tag>
<el-tag v-if="selectedGradeId" effect="plain">年级{{ selectedGradeTitle }}</el-tag>
<el-button type="primary" @click="fetchStudents">查询</el-button>
<el-button @click="resetStudentFilters">重置</el-button>
<el-button type="success" :disabled="selectedStudentIds.length !== 1"
@@ -58,40 +67,61 @@
生成学案
</el-button>
</div>
<el-table ref="studentTableRef" :data="students" border class="w-full"
v-loading="studentLoading" @selection-change="onStudentSelectionChange">
<el-table-column type="selection" width="48" />
<el-table-column prop="name" label="姓名" min-width="120" />
<el-table-column prop="className" label="班级" min-width="120" />
<el-table-column prop="gradeName" label="级" min-width="120" />
<el-table-column prop="phone" label="学案" min-width="120">
<template #default="{ row }">
<template v-if="generatingPercents[row.id] !== undefined">
<div class="flex items-center gap-2">
<el-progress :percentage="generatingPercents[row.id]"
:stroke-width="8" />
</div>
<div class="hidden sm:block overflow-x-auto">
<el-table ref="studentTableRef" :data="students" border class="min-w-[760px]"
v-loading="studentLoading" @selection-change="onStudentSelectionChange">
<el-table-column type="selection" width="48" />
<el-table-column prop="name" label="姓名" min-width="120" />
<el-table-column prop="className" label="级" min-width="120" />
<el-table-column prop="gradeName" label="年级" min-width="120" />
<el-table-column prop="phone" label="学案" min-width="120">
<template #default="{ row }">
<template v-if="generatingPercents[row.id] !== undefined">
<div class="flex items-center gap-2">
<el-progress :percentage="generatingPercents[row.id]" :stroke-width="8" />
</div>
</template>
<template v-else>
<div class="flex items-center gap-2">
<el-button type="primary" size="small" @click="planStudentId = row.id; showPlanListDialog = true">查看学案</el-button>
</div>
</template>
</template>
<template v-else>
<div class="flex items-center gap-2">
<el-button type="primary" size="small"
@click="planStudentId = row.id; showPlanListDialog = true">查看学案</el-button>
</div>
</el-table-column>
<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>
</el-table-column>
</el-table>
</div>
<div class="sm:hidden space-y-3">
<div v-for="row in students" :key="row.id" class="panel-shell p-4">
<div class="flex items-center justify-between mb-1">
<div class="text-base font-semibold">{{ row.name }}</div>
<el-checkbox
:model-value="isStudentSelected(row.id)"
@change="(val) => setStudentSelection(row.id, val)">
选中
</el-checkbox>
</div>
<div class="text-sm mb-1">班级{{ row.className }}</div>
<div class="text-sm mb-2">年级{{ row.gradeName }}</div>
<template v-if="generatingPercents[row.id] !== undefined">
<div class="mb-2">
<el-progress :percentage="generatingPercents[row.id]" :stroke-width="8" />
</div>
</template>
</el-table-column>
<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>
</el-table-column>
</el-table>
<div class="flex flex-wrap gap-2">
<el-button size="small" @click="planStudentId = row.id; showPlanListDialog = true">查看学案</el-button>
<el-button size="small" type="info" @click="onShowAnalysis(row)">学情分析</el-button>
<el-button size="small" type="primary" @click="onViewStudent(row)">详情</el-button>
<el-button size="small" type="danger" @click="onDeleteStudent(row)">删除</el-button>
</div>
</div>
</div>
<div class="mt-4 flex justify-end">
<el-pagination background layout="prev, pager, next, sizes, total"
:total="studentTotalCount" :page-size="studentPageSize"
@@ -115,10 +145,21 @@
<div class="panel-shell p-6" v-loading="gradeLoading">
<div class="text-lg font-semibold mb-4">年级列表</div>
<el-table ref="gradeTableRef" :data="grades" border class="w-full" highlight-current-row
row-key="id" :current-row-key="selectedGradeId" @row-click="onGradeRowClick">
<el-table-column prop="title" label="年级名称" min-width="160" />
</el-table>
<div class="hidden sm:block overflow-x-auto">
<el-table ref="gradeTableRef" :data="grades" border class="min-w-[360px]" highlight-current-row
row-key="id" :current-row-key="selectedGradeId" @row-click="onGradeRowClick">
<el-table-column prop="title" label="年级名称" min-width="160" />
</el-table>
</div>
<div class="sm:hidden space-y-3">
<div v-for="row in grades" :key="row.id" class="panel-shell p-4">
<div class="text-base font-semibold mb-1">{{ row.title }}</div>
<div class="flex gap-2">
<el-button size="small" type="primary" @click="onGradeRowClick(row)">选择</el-button>
<el-button size="small" type="danger" @click="onDeleteGrade(row)">删除</el-button>
</div>
</div>
</div>
<div class="mt-4 flex justify-end">
<el-pagination background layout="prev, pager, next, sizes, total"
:total="gradeTotalCount" :page-size="gradePageSize" :current-page="gradePageNo"
@@ -192,6 +233,18 @@ const planStudentId = ref(null)
const showAnalysisDialog = ref(false)
const analysisStudentId = ref(null)
function isStudentSelected(id) {
return selectedStudentIds.value.includes(id)
}
function setStudentSelection(id, selected) {
const exists = selectedStudentIds.value.includes(id)
if (selected && !exists) {
selectedStudentIds.value = [...selectedStudentIds.value, id]
} else if (!selected && exists) {
selectedStudentIds.value = selectedStudentIds.value.filter(x => x !== id)
}
}
const units = ref([])
const unitPageNo = ref(1)
const unitPageSize = ref(10)

View File

@@ -1,17 +1,14 @@
<template>
<div class="common-layout">
<el-container>
<el-container class="min-h-screen">
<el-header>
<Header></Header>
</el-header>
<el-container>
<el-aside width="200px" class="pt-4">
<Sidebar />
</el-aside>
<el-main class="p-4">
<el-container class="pt-4">
<el-main class="h-full">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6" v-loading="loading">
<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
<div class="panel-shell p-4 sm:p-6">
<div class="text-lg font-semibold mb-4">学生详情</div>
<template v-if="detail">
<el-descriptions :column="1" border>
@@ -19,45 +16,42 @@
<el-descriptions-item label="姓名">{{ detail.name }}</el-descriptions-item>
<el-descriptions-item label="班级">{{ detail.className }}</el-descriptions-item>
<el-descriptions-item label="年级">{{ detail.gradeName }}</el-descriptions-item>
<el-descriptions-item label="学生实际水平年级">{{ detail.actualGrade
}}</el-descriptions-item>
<el-descriptions-item label="学生实际水平年级">{{ detail.actualGrade }}</el-descriptions-item>
</el-descriptions>
</template>
<template v-else>
<el-empty description="请从班级页跳转" />
</template>
</div>
<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
<div class="panel-shell p-4 sm:p-6">
<div class="text-lg font-semibold mb-4">学生词汇统计</div>
<template v-if="wordStat">
<el-descriptions :column="1" border>
<el-descriptions-item label="已掌握">{{ wordStat.masteredWordCount
}}</el-descriptions-item>
<el-descriptions-item label="未掌握">{{ wordStat.unmasteredWordCount
}}</el-descriptions-item>
<el-descriptions-item label="待复习">{{ wordStat.pendingReviewWordCount
}}</el-descriptions-item>
<el-descriptions-item label="已掌握">{{ wordStat.masteredWordCount }}</el-descriptions-item>
<el-descriptions-item label="未掌握">{{ wordStat.unmasteredWordCount }}</el-descriptions-item>
<el-descriptions-item label="待复习">{{ wordStat.pendingReviewWordCount }}</el-descriptions-item>
</el-descriptions>
</template>
<template v-else>
<el-empty description="暂无统计" />
</template>
</div>
<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
<div class="panel-shell p-4 sm:p-6">
<div class="text-md font-semibold mb-3">学生考试记录</div>
<ExamHistoryChart :data="history" />
</div>
<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
<div class="panel-shell p-4 sm:p-6">
<div class="text-md font-semibold mb-3">学生学案记录</div>
<PlanHistoryChart :student-id="route.params.id" />
</div>
<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
<div class="panel-shell p-4 sm:p-6 lg:col-span-2">
<div class="text-md font-semibold mb-3">词汇掌握热力图</div>
<WordMasteryHeatmap :student-id="route.params.id" :columns="50" />
<WordMasteryHeatmap :student-id="route.params.id" :columns="heatmapColumns" />
</div>
<div class="panel-shell p-4 sm:p-6 lg:col-span-2">
<div class="text-md font-semibold mb-3">学情分析</div>
<StudyAnalysis :student-id="route.params.id" />
</div>
<StudyAnalysis :student-id="route.params.id" />
</div>
</el-main>
</el-container>
@@ -83,6 +77,12 @@ const detail = ref(null)
const route = useRoute()
const history = ref([])
const wordStat = ref(null)
const isMobile = ref(false)
const heatmapColumns = computed(() => isMobile.value ? 20 : 50)
function updateIsMobile() {
isMobile.value = window.matchMedia('(max-width: 768px)').matches
}
async function fetchDetail() {
const id = route.params.id
@@ -105,6 +105,10 @@ async function fetchExamHistory() {
history.value = Array.isArray(d?.data) ? d.data.slice().sort((a, b) => {
return new Date(a.startDate).getTime() - new Date(b.startDate).getTime()
}) : []
// 遍历 history 中的 startDate 去掉其中的 T
history.value.forEach(item => {
item.startDate = item.startDate.replace('T', ' ')
})
}
async function fetchWordStat() {
@@ -119,5 +123,7 @@ onMounted(() => {
fetchDetail()
fetchExamHistory()
fetchWordStat()
updateIsMobile()
window.addEventListener('resize', updateIsMobile)
})
</script>

View File

@@ -1,12 +1,12 @@
<template>
<div class="common-layout">
<el-container>
<el-container class="min-h-screen">
<el-header>
<Header></Header>
</el-header>
<el-container class="pt-4">
<el-aside width="200px" class="">
<el-aside width="200px" class="hidden md:block sidebar-fixed">
<Sidebar />
</el-aside>
<el-main class="">
@@ -14,11 +14,12 @@
<div class="panel-shell p-6">
<div class="text-lg font-semibold mb-4">上传图片</div>
<el-upload :show-file-list="false" :http-request="doUpload" accept="image/*">
<el-button type="primary">选择图片并上传</el-button>
<el-button type="primary" class="w-full sm:w-auto touch-target">选择图片并上传</el-button>
</el-upload>
</div>
<div class="panel-shell p-6">
<div class="text-lg font-semibold mb-4">结果集</div>
<div class="hidden sm:block">
<el-form :inline="true" class="mb-4">
<el-form-item label="班级">
<el-select v-model="classId" placeholder="选择班级" clearable filterable
@@ -43,26 +44,53 @@
<el-button @click="handleReset">重置</el-button>
</el-form-item>
</el-form>
<el-table :data="list" border class="w-full" v-loading="loading"
@row-click="handleRowClick">
<el-table-column prop="studentName" label="学生姓名" min-width="70" />
<el-table-column prop="examWordsTitle" label="试题名称" min-width="100" />
<el-table-column prop="correctWordCount" label="正确词数" width="110" />
<el-table-column prop="wrongWordCount" label="错误词数" width="110" />
<el-table-column label="完成状态" width="110">
<template #default="{ row }">
</div>
<div class="hidden sm:block overflow-x-auto">
<el-table :data="list" border class="min-w-[800px]" v-loading="loading"
@row-click="handleRowClick">
<el-table-column prop="studentName" label="学生姓名" min-width="120" />
<el-table-column prop="examWordsTitle" label="试题名称" min-width="160" />
<el-table-column prop="correctWordCount" label="正确词数" width="120" />
<el-table-column prop="wrongWordCount" label="错误词数" width="120" />
<el-table-column label="完成状态" width="120">
<template #default="{ row }">
<el-tag :type="row.isFinished === 1 ? 'success' : 'info'">
{{ row.isFinished === 1 ? '已完成' : '未完成' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="startDate" label="开始时间" min-width="160">
<template #default="{ row }">
{{ row.startDate.replace('T', ' ') }}
</template>
</el-table-column>
<el-table-column prop="msg" label="判卷结算" min-width="180" />
</el-table>
</div>
<div class="sm:hidden space-y-3">
<div class="mb-3 grid grid-cols-1 gap-3">
<el-select v-model="classId" placeholder="选择班级" clearable filterable @change="onClassChange" />
<el-select v-model="gradeId" placeholder="选择年级" clearable filterable />
<el-input v-model="studentName" placeholder="学生姓名" clearable />
<div class="flex gap-2">
<el-button type="primary" class="flex-1" @click="handleSearch">查询</el-button>
<el-button class="flex-1" @click="handleReset">重置</el-button>
</div>
</div>
<div v-for="row in list" :key="row.id" class="panel-shell p-4">
<div class="text-base font-semibold mb-1">{{ row.studentName }}</div>
<div class="text-sm mb-1">试题{{ row.examWordsTitle }}</div>
<div class="text-sm mb-1">正确{{ row.correctWordCount }}错误{{ row.wrongWordCount }}</div>
<div class="text-sm mb-1">开始{{ row.startDate.replace('T', ' ') }}</div>
<div class="text-sm mb-2">结算{{ row.msg }}</div>
<div class="flex items-center justify-between">
<el-tag :type="row.isFinished === 1 ? 'success' : 'info'">
{{ row.isFinished === 1 ? '已完成' : '未完成' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="startDate" label="开始时间" min-width="160">
<template #default="{ row }">
{{ row.startDate.replace('T', ' ') }}
</template>
</el-table-column>
<el-table-column prop="msg" label="判卷结算" min-width="160" />
</el-table>
<el-button size="small" type="primary" @click="handleRowClick(row)">查看详情</el-button>
</div>
</div>
</div>
<div class="mt-4 flex justify-end">
<el-pagination background layout="prev, pager, next, sizes, total" :total="totalCount"
:page-size="pageSize" :current-page="pageNo" @current-change="handlePageChange"