pswqm3ot6
/
spring-boot-online-exam
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Default Changelist

Browse Source
feature/qzw
秦泽旺 1 month ago
parent 57d4bd7794
commit 90f47d711d
6 changed files with 258 additions and 137 deletions
Show Stats Download Patch File Download Diff File

2
doc/sql/exam.sql
Unescape View File

@ -1208,7 +1208,7 @@ CREATE TABLE `user` (
PRIMARY KEY (`user_id`) USING BTREE,-- 主键约束
-- 唯一性约束：
-- 分别为`user_username`、`user_email`和`user_phone`字段设置唯一性约束，并使用B树（BTREE）索引。
-- 这确保了用户名、邮箱和手机号在表中是唯一的，不会出现重复值。
-- 这确保了用户名、邮箱和手机号在表中是唯一的，不会出现重复值。0
UNIQUE KEY `user_username` (`user_username`) USING BTREE,
UNIQUE KEY `user_email` (`user_email`) USING BTREE,
UNIQUE KEY `user_phone` (`user_phone`) USING BTREE

125
frontend/public/index.html vendored
Unescape View File

@ -1,24 +1,127 @@
<!DOCTYPE html>
<!-- 声明文档类型，这里是HTML5 -->
<html lang="zh-cmn-Hans">
<head>
<!-- 开始HTML文档，指定语言为简体中文（简体，汉字） -->
<head>
<!-- 文档的头部 -->
<meta charset="utf-8">
<!-- 设置文档的字符编码为UTF-8 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- 告诉IE浏览器使用最新的渲染引擎 -->
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<!-- 设置视口，以确保页面在不同设备上都能正确显示 -->
<link rel="icon" href="<%= BASE_URL %>logo.png">
<!-- 设置网页的图标，图标路径使用了模板变量BASE_URL -->
<title>在线考试系统</title>
<style>#loading-mask{position:fixed;left:0;top:0;height:100%;width:100%;background:#fff;user-select:none;z-index:9999;overflow:hidden}.loading-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-100%)}.loading-dot{animation:antRotate 1.2s infinite linear;transform:rotate(45deg);position:relative;display:inline-block;font-size:64px;width:64px;height:64px;box-sizing:border-box}.loading-dot i{width:22px;height:22px;position:absolute;display:block;background-color:#1890ff;border-radius:100%;transform:scale(.75);transform-origin:50% 50%;opacity:.3;animation:antSpinMove 1s infinite linear alternate}.loading-dot i:nth-child(1){top:0;left:0}.loading-dot i:nth-child(2){top:0;right:0;-webkit-animation-delay:.4s;animation-delay:.4s}.loading-dot i:nth-child(3){right:0;bottom:0;-webkit-animation-delay:.8s;animation-delay:.8s}.loading-dot i:nth-child(4){bottom:0;left:0;-webkit-animation-delay:1.2s;animation-delay:1.2s}@keyframes antRotate{to{-webkit-transform:rotate(405deg);transform:rotate(405deg)}}@-webkit-keyframes antRotate{to{-webkit-transform:rotate(405deg);transform:rotate(405deg)}}@keyframes antSpinMove{to{opacity:1}}@-webkit-keyframes antSpinMove{to{opacity:1}}</style>
</head>
<body>
<noscript>
<!-- 设置网页的标题 -->
<style>
/* 内嵌样式表 */
#loading-mask {
/* 加载遮罩层的样式 */
position: fixed;
left: 0;
top: 0;
height: 100%;
width: 100%;
background: #fff;
user-select: none;
z-index: 9999;
overflow: hidden;
}
.loading-wrapper {
/* 加载动画容器的样式 */
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -100%); /* 修正位置 */
}
.loading-dot {
/* 加载动画点的样式 */
animation: antRotate 1.2s infinite linear;
transform: rotate(45deg);
position: relative;
display: inline-block;
font-size: 64px;
width: 64px;
height: 64px;
box-sizing: border-box;
}
.loading-dot i {
/* 加载动画点内部的小圆圈的样式 */
width: 22px;
height: 22px;
position: absolute;
display: block;
background-color: #1890ff;
border-radius: 100%;
transform: scale(.75);
transform-origin: 50% 50%;
opacity: .3;
animation: antSpinMove 1s infinite linear alternate;
}
.loading-dot i:nth-child(1),
.loading-dot i:nth-child(2),
.loading-dot i:nth-child(3),
.loading-dot i:nth-child(4) {
/* 分别设置四个小圆圈的位置和动画延迟 */
}
@keyframes antRotate {
/* 定义旋转动画 */
to {
-webkit-transform: rotate(405deg);
transform: rotate(405deg);
}
}
@-webkit-keyframes antRotate {
/* 为旧版WebKit浏览器定义旋转动画 */
to {
-webkit-transform: rotate(405deg);
transform: rotate(405deg);
}
}
@keyframes antSpinMove {
/* 定义透明度变化动画 */
to {
opacity: 1;
}
}
@-webkit-keyframes antSpinMove {
/* 为旧版WebKit浏览器定义透明度变化动画 */
to {
opacity: 1;
}
}
</style>
</head>
<body>
<!-- 文档的主体 -->
<noscript>
<!-- 如果浏览器禁用了JavaScript，显示此消息 -->
<strong>We're sorry but vue-antd-pro doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app">
</noscript>
<div id="app">
<!-- Vue应用的挂载点 -->
<div id="loading-mask">
<!-- 加载遮罩层 -->
<div class="loading-wrapper">
<span class="loading-dot loading-dot-spin"><i></i><i></i><i></i><i></i></span>
<!-- 加载动画的容器 -->
<span class="loading-dot loading-dot-spin">
<!-- 加载动画，包含四个小圆圈 -->
<i></i><i></i><i></i><i></i>
</span>
</div>
</div>
</div>
<!-- built files will be auto injected -->
</body>
</div>
<!-- built files will be auto injected -->
<!-- 注释说明构建后的文件会自动注入，通常指Vue单页应用的JavaScript和CSS文件 -->
</body>
</html>

85
frontend/src/api/exam.js
Unescape View File

@ -1,44 +1,49 @@
// 考试相关的接口，包括考试、问题、选项和评分等接口
// 导入api对象，它包含了所有API端点的路径
import api from './index';
// 导入axios库，用于发送HTTP请求
import { axios } from '../utils/request';
import api from './index'
import { axios } from '../utils/request'
export function getQuestionList (parameter) {
// 获取问题列表的函数
export function getQuestionList(parameter) {
return axios({
url: api.ExamQuestionList,
url: api.ExamQuestionList, // API端点
method: 'get',
params: parameter
params: parameter // 查询参数
})
}
export function getQuestionAll () {
// 获取所有问题的函数
export function getQuestionAll() {
return axios({
url: api.ExamQuestionAll,
method: 'get'
})
}
export function questionUpdate (parameter) {
console.log(parameter)
// 更新问题的函数
export function questionUpdate(parameter) {
console.log(parameter); // 打印参数，用于调试
return axios({
url: api.ExamQuestionUpdate,
method: 'post',
data: parameter
data: parameter // 请求体中的数据
})
}
export function getQuestionSelection () {
// 获取分类选项的函数
export function getQuestionSelection() {
return axios({
url: api.ExamQuestionSelection,
method: 'get',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
'Content-Type': 'application/json;charset=UTF-8' // 设置请求头，指定内容类型
}
})
}
export function questionCreate (parameter) {
console.log(parameter)
// 创建新问题的函数
export function questionCreate(parameter) {
console.log(parameter);
return axios({
url: api.ExamQuestionCreate,
method: 'post',
@ -46,7 +51,8 @@ export function questionCreate (parameter) {
})
}
export function getExamList (parameter) {
// 获取考试列表的函数
export function getExamList(parameter) {
return axios({
url: api.ExamList,
method: 'get',
@ -54,15 +60,16 @@ export function getExamList (parameter) {
})
}
export function getExamAll () {
// 获取所有考试信息的函数
export function getExamAll() {
return axios({
url: api.ExamAll,
method: 'get'
})
}
// 获取所有问题，按照单选、多选和判断进行分类
export function getExamQuestionTypeList () {
// 获取考试类型列表的函数，按照单选、多选和判断分类
export function getExamQuestionTypeList() {
return axios({
url: api.ExamQuestionTypeList,
method: 'get',
@ -72,7 +79,8 @@ export function getExamQuestionTypeList () {
})
}
export function getExamCardList () {
// 获取考试卡片列表的函数
export function getExamCardList() {
return axios({
url: api.ExamCardList,
method: 'get',
@ -82,8 +90,9 @@ export function getExamCardList () {
})
}
export function examCreate (parameter) {
console.log(parameter)
// 创建考试的函数
export function examCreate(parameter) {
console.log(parameter);
return axios({
url: api.ExamCreate,
method: 'post',
@ -91,8 +100,9 @@ export function examCreate (parameter) {
})
}
export function examUpdate (parameter) {
console.log(parameter)
// 更新考试信息的函数
export function examUpdate(parameter) {
console.log(parameter);
return axios({
url: api.ExamUpdate,
method: 'post',
@ -100,9 +110,10 @@ export function examUpdate (parameter) {
})
}
export function getExamDetail (examId) {
// 根据考试ID获取考试详情的函数
export function getExamDetail(examId) {
return axios({
url: api.ExamDetail + examId,
url: api.ExamDetail + examId, // 动态拼接URL
method: 'get',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
@ -110,9 +121,10 @@ export function getExamDetail (examId) {
})
}
export function getExamRecordDetail (recordId) {
// 根据记录ID获取考试记录详情的函数
export function getExamRecordDetail(recordId) {
return axios({
url: api.recordDetail + recordId,
url: api.recordDetail + recordId, // 动态拼接URL
method: 'get',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
@ -120,9 +132,10 @@ export function getExamRecordDetail (recordId) {
})
}
export function getQuestionDetail (questionId) {
// 根据问题ID获取问题详情的函数
export function getQuestionDetail(questionId) {
return axios({
url: api.QuestionDetail + questionId,
url: api.QuestionDetail + questionId, // 动态拼接URL
method: 'get',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
@ -130,19 +143,21 @@ export function getQuestionDetail (questionId) {
})
}
export function finishExam (examId, answersMap) {
console.log(answersMap)
// 提交考试并获取成绩的函数
export function finishExam(examId, answersMap) {
console.log(answersMap); // 打印答案，用于调试
return axios({
url: api.FinishExam + examId,
url: api.FinishExam + examId, // 动态拼接URL
method: 'post',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
},
data: answersMap
data: answersMap // 请求体中的答案数据
})
}
export function getExamRecordList () {
// 获取当前用户所有考试记录的函数
export function getExamRecordList() {
return axios({
url: api.ExamRecordList,
method: 'get',

64
frontend/src/api/index.js
Unescape View File

@ -1,38 +1,34 @@
const api = {
Login: '/auth/login',
Logout: '/auth/logout',
ForgePassword: '/auth/forge-password',
Register: '/auth/register',
twoStepCode: '/auth/2step-code',
SendSms: '/account/sms',
SendSmsErr: '/account/sms_err',
// get my info
UserInfo: '/user/info',
// 用户认证相关接口
Login: '/auth/login', // 用户登录接口
Logout: '/auth/logout', // 用户登出接口
ForgePassword: '/auth/forge-password', // 重置密码接口
Register: '/auth/register', // 用户注册接口
twoStepCode: '/auth/2step-code', // 双因素认证接口
SendSms: '/account/sms', // 发送短信接口
SendSmsErr: '/account/sms_err', // 发送短信错误处理接口
// 下面是自己的用户认证的接口
UserRegister: '/user/register',
UserLogin: '/user/login',
// 用户相关接口
UserRegister: '/user/register', // 用户注册接口
UserLogin: '/user/login', // 用户登录接口
// 考试的接口
ExamQuestionList: '/exam/question/list',
ExamQuestionAll: '/exam/question/all',
ExamQuestionUpdate: '/exam/question/update',
ExamQuestionSelection: '/exam/question/selection',
ExamQuestionCreate: '/exam/question/create',
ExamList: '/exam/list',
ExamAll: '/exam/all',
// 获取问题列表，按照单选、多选和判断进行分类
ExamQuestionTypeList: '/exam/question/type/list',
ExamCreate: '/exam/create',
ExamUpdate: '/exam/update',
ExamCardList: '/exam/card/list',
// 获取考试详情
ExamDetail: '/exam/detail/',
// 获取考试详情
QuestionDetail: '/exam/question/detail/',
// 交卷
FinishExam: '/exam/finish/',
ExamRecordList: '/exam/record/list',
recordDetail: '/exam/record/detail/'
// 考试相关接口
ExamQuestionList: '/exam/question/list', // 获取问题列表接口
ExamQuestionAll: '/exam/question/all', // 获取所有问题接口
ExamQuestionUpdate: '/exam/question/update', // 更新问题接口
ExamQuestionSelection: '/exam/question/selection', // 获取问题分类选项接口
ExamQuestionCreate: '/exam/question/create', // 创建问题接口
ExamList: '/exam/list', // 获取考试列表接口
ExamAll: '/exam/all', // 获取所有考试接口
ExamQuestionTypeList: '/exam/question/type/list', // 获取问题类型列表接口
ExamCreate: '/exam/create', // 创建考试接口
ExamUpdate: '/exam/update', // 更新考试信息接口
ExamCardList: '/exam/card/list', // 获取考试卡片列表接口
ExamDetail: '/exam/detail/', // 获取考试详情接口
QuestionDetail: '/exam/question/detail/', // 获取问题详情接口
FinishExam: '/exam/finish/', // 提交考试接口
ExamRecordList: '/exam/record/list', // 获取考试记录列表接口
recordDetail: '/exam/record/detail' // 获取考试记录详情接口
}
export default api
export default api;

58
frontend/src/api/login.js
Unescape View File

@ -1,62 +1,62 @@
import api from './index'
import { axios } from '../utils/request'
// 导入api对象，它包含了所有API端点的路径
import api from './index';
// 导入axios库，用于发送HTTP请求
import { axios } from '../utils/request';
/**
* login func
* parameter: {
* username: '',
* password: '',
* remember_me: true,
* captcha: '12345'
* }
* @param parameter
* @returns {*}
* 用户登录函数
* @param {Object} parameter - 登录所需的参数对象，包含用户名、密码、记住我、验证码等属性
* @returns {Promise} - 返回axios请求的Promise对象
*/
export function login (parameter) {
export function login(parameter) {
return axios({
// 用户登录接口改成自己的
url: api.UserLogin,
// 用户登录接口改成自己的登录接口
url: api.UserLogin, // 使用从api对象中导入的UserLogin路径
method: 'post',
data: parameter
data: parameter // 将登录参数对象传递给服务器
})
}
export function getSmsCaptcha (parameter) {
// 获取验证码的函数
export function getSmsCaptcha(parameter) {
return axios({
url: api.SendSms,
url: api.SendSms, // 发送短信的API端点
method: 'post',
data: parameter
data: parameter // 传递给服务器的参数，用于获取验证码
})
}
export function getInfo () {
// 获取用户信息的函数
export function getInfo() {
return axios({
url: api.UserInfo,
url: api.UserInfo, // 获取用户信息的API端点
method: 'get',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
'Content-Type': 'application/json;charset=UTF8' // 设置请求头，指定内容类型
}
})
}
export function logout () {
// 用户登出的函数
export function logout() {
return axios({
url: api.Logout,
url: api.Logout, // 登出的API端点
method: 'post',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
'Content-Type': 'application/json;charset=UTF8' // 设置请求头，指定内容类型
}
})
}
/**
* get user 2step code open?
* @param parameter {*}
* 获取用户双因素认证的第二步代码
* @param {Object} parameter - 用于双因素认证的参数对象
* @returns {Promise} - 返回axios请求的Promise对象
*/
export function get2step (parameter) {
export function get2step(parameter) {
return axios({
url: api.twoStepCode,
url: api.twoStepCode, // 双因素认证的第二步接口
method: 'post',
data: parameter
data: parameter // 传递给服务器的参数，用于双因素认证
})
}

35
frontend/src/api/user.js
Unescape View File

@ -1,20 +1,27 @@
// 自己的借口呀:用户的注册和登录等服务，注意所有的接口应该都现在index.js里面注册，方便统一管理
// 导入api对象，它包含了所有API端点的路径
// 这些端点应该在index.js文件中定义，以便于统一管理
import api from './index';
// 导入axios库，用于发送HTTP请求
import { axios } from '../utils/request';
import api from './index'
import { axios } from '../utils/request'
export function login (parameter) {
// 定义登录函数
// 该函数接收一个参数对象，包含登录所需的信息
export function login(parameter) {
// 使用axios发送POST请求到用户登录的API端点
return axios({
url: api.UserLogin,
method: 'post',
data: parameter
})
url: api.UserLogin, // 用户登录的API端点
method: 'post', // 请求方法为POST
data: parameter // 发送到服务器的数据，即登录参数
});
}
export function register (parameter) {
// 定义注册函数
// 该函数接收一个参数对象，包含注册所需的信息
export function register(parameter) {
// 使用axios发送POST请求到用户注册的API端点
return axios({
url: api.UserRegister,
method: 'post',
data: parameter
})
url: api.UserRegister, // 用户注册的API端点
method: 'post', // 请求方法为POST
data: parameter // 发送到服务器的数据，即注册参数
});
}
Write Preview
Loading…
Cancel
Save