## 主要改进 ### 1. 题型标题和分值说明显示优化 - 将 Ant Design Text 组件改为原生 span 元素,确保在打印时不换行 - 将分值说明嵌套到题型标题内部,强制同行显示 - 适用于所有题型:填空题、判断题、单选题、多选题、简答题、论述题 ### 2. 打印分页控制优化 - 添加 page-break-after: avoid 和 page-break-inside: avoid 到关键元素 - 试卷标题和考试说明保持在同一页 - 考试说明和填空题不分页 - 题型标题和第一道题保持在同一页 - 每道题目的所有部分(题干、选项、答题区域)保持完整,不被分页打断 - 题型之间尽量紧密排列,减少空白 ### 3. 样式细节调整 - 题型标题使用 flex 布局,确保标题和说明在同一行 - 统一使用 marginLeft: 8px 作为标题和说明之间的间距 - 保持 A4 纸张 1cm 页边距设置 ## 修改文件 - web/src/pages/ExamPrint.module.less - 打印样式优化 - web/src/pages/ExamPrint.tsx - 题型标题结构调整 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
AnKao Web 项目
这是一个使用Go语言和Gin框架构建的Web应用项目。
项目结构
AnKao/
├── main.go # 主程序入口
├── internal/ # 私有应用代码
│ ├── handlers/ # HTTP请求处理器
│ ├── middleware/ # 中间件
│ └── models/ # 数据模型
├── pkg/ # 公共库代码
│ └── config/ # 配置管理
├── web/ # 前端项目目录
│ ├── src/ # 源代码
│ │ ├── pages/ # 页面组件
│ │ ├── components/ # 可复用组件
│ │ └── main.tsx # 入口文件
│ ├── vite.config.ts # Vite配置(含API代理)
│ └── package.json # 前端依赖
├── go.mod # Go模块文件
├── CLAUDE.md # 开发规范文档
└── README.md # 项目说明
快速开始
后端服务器
# 安装依赖
go mod tidy
# 运行服务器
go run main.go
服务器将在 http://localhost:8080 启动
前端开发服务器
# 进入前端目录
cd web
# 安装依赖 (使用 yarn)
yarn install
# 运行开发服务器
yarn dev
前端开发服务器将在 http://localhost:3000 启动
注意: 前端使用 Vite 代理,所有 /api/* 请求会自动转发到后端服务器,无需配置 CORS。
API端点
用户相关
POST /api/login- 用户登录POST /api/register- 用户注册
练习题相关
GET /api/practice/questions- 获取练习题目列表 (支持分页和类型过滤)GET /api/practice/questions/:id- 获取指定练习题目POST /api/practice/submit- 提交练习答案 (简答题自动AI评分)
其他
GET /api/health- 健康检查端点
开发
安装依赖
go mod tidy
构建
go build -o bin/server.exe main.go
运行编译后的程序
# Windows
.\bin\server.exe
# Linux/Mac
./bin/server
特性
- 基于 Gin 框架的高性能 HTTP 服务器
- 自定义日志中间件
- RESTful API 结构
- 健康检查端点
- 用户登录系统(基于PostgreSQL数据库)
- 题目练习功能
- 答题统计功能
- AI智能评分 - 简答题使用AI进行智能评分和反馈
- React + TypeScript + Vite 前端
- Ant Design Mobile UI组件库
数据库配置
项目使用 PostgreSQL 数据库存储用户数据。
数据库连接信息
数据库配置位于 pkg/config/config.go:
- 主机: pgsql.yuchat.top
- 端口: 5432
- 数据库: ankao
- 用户: postgres
数据库表结构
users 表:
id- 主键username- 用户名(唯一索引)password- 密码(bcrypt加密)avatar- 头像URLnickname- 昵称created_at- 创建时间updated_at- 更新时间deleted_at- 软删除时间
practice_questions 表:
id- 主键question_id- 题目ID(唯一索引,来自JSON数据)type- 题型(fill-in-blank/true-false/multiple-choice/multiple-selection/short-answer)type_name- 题型名称(中文)question- 题目内容answer_data- 答案数据(JSON格式)options_data- 选项数据(JSON格式,选择题使用)created_at- 创建时间updated_at- 更新时间deleted_at- 软删除时间
AI评分配置
项目使用AI对简答题进行智能评分。AI服务配置位于 pkg/config/config.go:
默认配置
- API地址: https://ai.yuchat.top
- 模型: deepseek-v3
- 评分方式: 基于题目和标准答案,AI会给出分数(0-100)、评语和改进建议
环境变量配置(可选)
可以通过环境变量覆盖默认配置:
export AI_BASE_URL="你的API地址"
export AI_API_KEY="你的API密钥"
export AI_MODEL="你的模型名称"
AI评分返回格式
对简答题提交答案时,响应会包含 ai_grading 字段:
{
"success": true,
"data": {
"correct": true,
"user_answer": "用户的答案",
"correct_answer": "标准答案",
"ai_grading": {
"score": 85,
"feedback": "答案基本正确,要点全面",
"suggestion": "可以补充一些具体的例子"
}
}
}
前端开发
前端项目位于 web/ 目录,使用 yarn 作为包管理工具。
安装依赖
cd web
yarn install
运行开发服务器
yarn dev
开发服务器运行在 http://localhost:3000
构建生产版本
yarn build
API代理
开发环境下,Vite已配置代理,前端 /api/* 请求会自动转发到 http://localhost:8080,无需担心CORS问题。
页面结构
- 登录页 (
/login) - 用户登录和注册,支持密码可见性切换 - 首页 (
/) - 题型选择、错题本、题目列表等功能 - 我的 (
/profile) - 用户信息、退出登录
特性
后端特性
- 基于 Gin 框架的高性能 HTTP 服务器
- 自定义日志中间件
- RESTful API 结构
- 健康检查端点
- 用户登录和注册系统(基于PostgreSQL数据库)
- 密码bcrypt加密存储
- 练习题管理系统(236道练习题,5种题型)
- 支持分页查询和题型筛选
- AI智能评分系统 - 使用deepseek-v3对简答题进行智能评分和反馈
前端特性
- React + TypeScript + Vite 技术栈
- Ant Design Mobile UI组件库
- 移动端优化,防止双指缩放
- CSS Modules 样式隔离
- 现代化的登录/注册界面
- 密码可见性切换功能
技术栈
后端
- Go 1.25.1
- Gin v1.11.0 - Web 框架
- GORM v1.31.1 - ORM框架
- PostgreSQL - 数据库
- bcrypt - 密码加密
- go-openai v1.41.2 - OpenAI SDK (用于AI评分)
前端
- React 18 - UI框架
- TypeScript - 类型安全
- Vite - 构建工具
- Ant Design Mobile - UI组件库
- React Router - 路由管理
- Less - CSS预处理器
- Yarn - 包管理工具
开发工具
- API代理配置(Vite)
- CSS Modules
- 清晰的项目架构,易于扩展
Description
Languages
TypeScript
53.7%
Go
30.6%
Less
15.1%
HTML
0.6%