update
修复头像更改页逻辑 Signed-off-by: Chenx221 <chenx221@yandex.com>
This commit is contained in:
parent
fe8003faf5
commit
4f60452bd8
Binary file not shown.
@ -140,32 +140,33 @@
|
||||
<div class="tab-pane fade show active" id="ex1-tabs-1" role="tabpanel"
|
||||
aria-labelledby="ex1-tab-1">
|
||||
<div class="card-body" style="min-width: 175px">
|
||||
<form action="save_avatar" method="post">
|
||||
<div class="row">
|
||||
<div class="col-lg-2 text-center">
|
||||
<p>
|
||||
Avatar:
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-lg-2">
|
||||
<i class="far fa-circle-user fa-8x" id="default_avatar"></i>
|
||||
<img src="#" class="img-fluid rounded-circle" alt="avatar"
|
||||
style="height: 128px;width: 128px;display: none"
|
||||
id="custom_avatar"/>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<label class="form-label" for="customFile">请选择要上传的图片</label>
|
||||
<input type="file" class="form-control" id="customFile" name="avatar"/>
|
||||
</div>
|
||||
<div class="note note-primary mb-3" id="note" style="display: none">
|
||||
<strong>提示:</strong> 用户头像更新成功
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-2 text-center">
|
||||
<p>
|
||||
头像设置:
|
||||
</p>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-12 text-center mt-lg-5">
|
||||
<button type="submit" class="btn btn-secondary btn-lg" onclick="save()">
|
||||
SAVE
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-lg-2">
|
||||
<i class="far fa-circle-user fa-8x" id="default_avatar"
|
||||
style="display: none"></i>
|
||||
<img src="/person/image" class="img-fluid rounded-circle" alt="avatar"
|
||||
style="height: 128px;width: 128px;display: none"
|
||||
id="custom_avatar"/>
|
||||
</div>
|
||||
</form>
|
||||
<div class="col-lg-4">
|
||||
<label class="form-label"
|
||||
for="customFile">请选择要上传的图片(大小<15MB)</label>
|
||||
<input type="file" class="form-control" id="customFile" name="avatar"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-12 text-center mt-lg-5">
|
||||
<%-- Todo: 换成消息框--%>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -212,7 +213,21 @@
|
||||
$('#exampleModal').modal('show');
|
||||
</c:if>
|
||||
|
||||
$('#customFile').on('change', function() {
|
||||
fetch("/person/image")
|
||||
.then(function (response) {
|
||||
if (response.ok) {
|
||||
// 图像存在，显示自定义头像
|
||||
$('#custom_avatar').show();
|
||||
} else {
|
||||
// 图像不存在，显示默认头像
|
||||
$('#default_avatar').show();
|
||||
}
|
||||
})
|
||||
.catch(function (error) {
|
||||
console.log("请求失败:", error);
|
||||
});
|
||||
|
||||
$('#customFile').on('change', function () {
|
||||
var file = this.files[0]; // 获取选择的文件
|
||||
|
||||
// 检查是否选择了文件
|
||||
@ -232,12 +247,12 @@
|
||||
data: formData,
|
||||
processData: false, // 告诉jQuery不要处理FormData对象
|
||||
contentType: false, // 告诉jQuery不要设置Content-Type请求头
|
||||
success: function(response) {
|
||||
// 成功上传后的操作
|
||||
success: function () {
|
||||
$('#default_avatar').hide(); // 隐藏默认头像
|
||||
$('#custom_avatar').attr('src', response.avatarUrl).show(); // 更新自定义头像的图像源
|
||||
$('#custom_avatar').show(); // 显示自定义头像
|
||||
$('#note').show(); // 显示提示消息
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
error: function (xhr, status, error) {
|
||||
console.log('上传失败:', error);
|
||||
alert('上传失败，请重试');
|
||||
}
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
Target Server Version : 80033 (8.0.33)
|
||||
File Encoding : 65001
|
||||
|
||||
Date: 19/06/2023 10:39:55
|
||||
Date: 19/06/2023 16:23:38
|
||||
*/
|
||||
|
||||
SET NAMES utf8mb4;
|
||||
@ -80,7 +80,7 @@ CREATE TABLE `score` (
|
||||
INDEX `fk_course`(`CourseID` ASC) USING BTREE,
|
||||
CONSTRAINT `fk_course` FOREIGN KEY (`CourseID`) REFERENCES `course` (`CourseID`) ON DELETE RESTRICT ON UPDATE RESTRICT,
|
||||
CONSTRAINT `fk_student` FOREIGN KEY (`StudentID`) REFERENCES `student` (`id`) ON DELETE RESTRICT ON UPDATE RESTRICT
|
||||
) ENGINE = InnoDB AUTO_INCREMENT = 122 CHARACTER SET = utf8mb4 COLLATE = utf8mb4_0900_ai_ci ROW_FORMAT = DYNAMIC;
|
||||
) ENGINE = InnoDB AUTO_INCREMENT = 123 CHARACTER SET = utf8mb4 COLLATE = utf8mb4_0900_ai_ci ROW_FORMAT = DYNAMIC;
|
||||
|
||||
-- ----------------------------
|
||||
-- Records of score
|
||||
@ -206,6 +206,7 @@ INSERT INTO `score` VALUES (118, 667, 9, 47, 0);
|
||||
INSERT INTO `score` VALUES (119, 586, 5, 9, 0);
|
||||
INSERT INTO `score` VALUES (120, 849, 11, 32, 0);
|
||||
INSERT INTO `score` VALUES (121, 1, 1, 100, 0);
|
||||
INSERT INTO `score` VALUES (122, 1, 2, 0, 0);
|
||||
|
||||
-- ----------------------------
|
||||
-- Table structure for student
|
||||
@ -1285,25 +1286,26 @@ INSERT INTO `teacher` VALUES (22, '无名氏4', '男', '2023-06-17', 1, '2班',
|
||||
DROP TABLE IF EXISTS `user`;
|
||||
CREATE TABLE `user` (
|
||||
`id` int NOT NULL AUTO_INCREMENT COMMENT '用户ID',
|
||||
`username` varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NULL DEFAULT NULL COMMENT '用户名',
|
||||
`username` varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NOT NULL COMMENT '用户名',
|
||||
`password` varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NULL DEFAULT NULL COMMENT '密码',
|
||||
`roles` varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NULL DEFAULT 'admin' COMMENT '角色(admin,student,teacher)',
|
||||
`disabled` int NULL DEFAULT 0 COMMENT '禁用(default: 0 false)',
|
||||
`detail` int NULL DEFAULT NULL COMMENT 'link to roles id',
|
||||
PRIMARY KEY (`id`) USING BTREE
|
||||
`photo` varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NULL DEFAULT NULL COMMENT 'link to avatar filename',
|
||||
PRIMARY KEY (`id`, `username`) USING BTREE
|
||||
) ENGINE = InnoDB AUTO_INCREMENT = 10 CHARACTER SET = utf8mb4 COLLATE = utf8mb4_0900_ai_ci ROW_FORMAT = DYNAMIC;
|
||||
|
||||
-- ----------------------------
|
||||
-- Records of user
|
||||
-- ----------------------------
|
||||
INSERT INTO `user` VALUES (1, 'admin', '8c6976e5b5410415bde908bd4dee15dfb167a9c873fc4bb8a81f6f2ab448a918', 'admin', 0, NULL);
|
||||
INSERT INTO `user` VALUES (2, 'guest', '84983c60f7daadc1cb8698621f802c0d9f9a3c3c295c810748fb048115c186ec', 'admin', 1, NULL);
|
||||
INSERT INTO `user` VALUES (3, 'chenx221', '62982ab94542113a449fc9528779583bb6b93988ac4678c3fd6c010b66e7a851', 'admin', 1, NULL);
|
||||
INSERT INTO `user` VALUES (4, 'chenx2210', '2bd27a9cb9135ff37aee523b7e439873a46da4d5b482145927b991a95baf43bb', 'admin', 0, NULL);
|
||||
INSERT INTO `user` VALUES (5, 'newuser1', '7dcf407fa84a0e0519c7991154c4148de0244d7589020c0d9842db9efad82094', 'admin', 0, NULL);
|
||||
INSERT INTO `user` VALUES (6, 'guest2', '6b93ccba414ac1d0ae1e77f3fac560c748a6701ed6946735a49d463351518e16', 'admin', 0, NULL);
|
||||
INSERT INTO `user` VALUES (7, 'student1', '49fe07d0f041bced9ba827a10c2cd31b2089229d4b4e3a63b074ed7a4370e88f', 'student', 0, 0);
|
||||
INSERT INTO `user` VALUES (8, 'student2', '2d850eb5460ffb6bb9ae11186a2d78cc22d9df387f9cdbd3a297e0d1ea08a54b', 'student', 0, 4);
|
||||
INSERT INTO `user` VALUES (9, 'teacher1', '0829db2785c8de0ad7d0231c903be3083f6729679bc69b092bf4cfd3dc629006', 'teacher', 0, 1);
|
||||
INSERT INTO `user` VALUES (1, 'admin', '8c6976e5b5410415bde908bd4dee15dfb167a9c873fc4bb8a81f6f2ab448a918', 'admin', 0, NULL, 'efe7ea02-053b-4b77-b8b1-719d13b18d18_010 (2)_512.png');
|
||||
INSERT INTO `user` VALUES (2, 'guest', '84983c60f7daadc1cb8698621f802c0d9f9a3c3c295c810748fb048115c186ec', 'admin', 1, NULL, NULL);
|
||||
INSERT INTO `user` VALUES (3, 'chenx221', '62982ab94542113a449fc9528779583bb6b93988ac4678c3fd6c010b66e7a851', 'admin', 1, NULL, NULL);
|
||||
INSERT INTO `user` VALUES (4, 'chenx2210', '2bd27a9cb9135ff37aee523b7e439873a46da4d5b482145927b991a95baf43bb', 'admin', 0, NULL, NULL);
|
||||
INSERT INTO `user` VALUES (5, 'newuser1', '7dcf407fa84a0e0519c7991154c4148de0244d7589020c0d9842db9efad82094', 'admin', 0, NULL, NULL);
|
||||
INSERT INTO `user` VALUES (6, 'guest2', '6b93ccba414ac1d0ae1e77f3fac560c748a6701ed6946735a49d463351518e16', 'admin', 0, NULL, NULL);
|
||||
INSERT INTO `user` VALUES (7, 'student1', '49fe07d0f041bced9ba827a10c2cd31b2089229d4b4e3a63b074ed7a4370e88f', 'student', 0, 0, NULL);
|
||||
INSERT INTO `user` VALUES (8, 'student2', '2d850eb5460ffb6bb9ae11186a2d78cc22d9df387f9cdbd3a297e0d1ea08a54b', 'student', 0, 4, NULL);
|
||||
INSERT INTO `user` VALUES (9, 'teacher1', '0829db2785c8de0ad7d0231c903be3083f6729679bc69b092bf4cfd3dc629006', 'teacher', 0, 1, NULL);
|
||||
|
||||
SET FOREIGN_KEY_CHECKS = 1;
|
||||
|
||||
@ -54,9 +54,8 @@ public class PersonController {
|
||||
user.setAvatar(object);
|
||||
userMapper.setAvatar(user);
|
||||
// 设置返回的avatarUrl值
|
||||
response.put("avatarUrl", "/person/image");
|
||||
// response.put("avatarUrl", "/person/image");
|
||||
// response.put("avatarUrl", avatarUrl);
|
||||
|
||||
// 返回成功消息和avatarUrl
|
||||
return ResponseEntity.ok(response);
|
||||
} catch (Exception e) {
|
||||
|
||||
@ -140,33 +140,33 @@
|
||||
<div class="tab-pane fade show active" id="ex1-tabs-1" role="tabpanel"
|
||||
aria-labelledby="ex1-tab-1">
|
||||
<div class="card-body" style="min-width: 175px">
|
||||
<form action="save_avatar" method="post">
|
||||
<div class="row">
|
||||
<div class="col-lg-2 text-center">
|
||||
<p>
|
||||
Avatar:
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-lg-2">
|
||||
<i class="far fa-circle-user fa-8x" id="default_avatar"></i>
|
||||
<img src="#" class="img-fluid rounded-circle" alt="avatar"
|
||||
style="height: 128px;width: 128px;display: none"
|
||||
id="custom_avatar"/>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<label class="form-label" for="customFile">请选择要上传的图片</label>
|
||||
<input type="file" class="form-control" id="customFile" name="avatar"/>
|
||||
</div>
|
||||
<div class="note note-primary mb-3" id="note" style="display: none">
|
||||
<strong>提示:</strong> 用户头像更新成功
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-2 text-center">
|
||||
<p>
|
||||
头像设置:
|
||||
</p>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-12 text-center mt-lg-5">
|
||||
<%-- <button type="submit" class="btn btn-secondary btn-lg" onclick="save()">--%>
|
||||
<%-- SAVE--%>
|
||||
<%-- </button>--%>
|
||||
<%-- Todo: 换成消息框--%>
|
||||
</div>
|
||||
<div class="col-lg-2">
|
||||
<i class="far fa-circle-user fa-8x" id="default_avatar"
|
||||
style="display: none"></i>
|
||||
<img src="/person/image" class="img-fluid rounded-circle" alt="avatar"
|
||||
style="height: 128px;width: 128px;display: none"
|
||||
id="custom_avatar"/>
|
||||
</div>
|
||||
</form>
|
||||
<div class="col-lg-4">
|
||||
<label class="form-label"
|
||||
for="customFile">请选择要上传的图片(大小<15MB)</label>
|
||||
<input type="file" class="form-control" id="customFile" name="avatar"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-12 text-center mt-lg-5">
|
||||
<%-- Todo: 换成消息框--%>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -213,7 +213,21 @@
|
||||
$('#exampleModal').modal('show');
|
||||
</c:if>
|
||||
|
||||
$('#customFile').on('change', function() {
|
||||
fetch("/person/image")
|
||||
.then(function (response) {
|
||||
if (response.ok) {
|
||||
// 图像存在，显示自定义头像
|
||||
$('#custom_avatar').show();
|
||||
} else {
|
||||
// 图像不存在，显示默认头像
|
||||
$('#default_avatar').show();
|
||||
}
|
||||
})
|
||||
.catch(function (error) {
|
||||
console.log("请求失败:", error);
|
||||
});
|
||||
|
||||
$('#customFile').on('change', function () {
|
||||
var file = this.files[0]; // 获取选择的文件
|
||||
|
||||
// 检查是否选择了文件
|
||||
@ -233,12 +247,12 @@
|
||||
data: formData,
|
||||
processData: false, // 告诉jQuery不要处理FormData对象
|
||||
contentType: false, // 告诉jQuery不要设置Content-Type请求头
|
||||
success: function(response) {
|
||||
// 成功上传后的操作
|
||||
success: function () {
|
||||
$('#default_avatar').hide(); // 隐藏默认头像
|
||||
$('#custom_avatar').attr('src', response.avatarUrl).show(); // 更新自定义头像的图像源
|
||||
$('#custom_avatar').show(); // 显示自定义头像
|
||||
$('#note').show(); // 显示提示消息
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
error: function (xhr, status, error) {
|
||||
console.log('上传失败:', error);
|
||||
alert('上传失败，请重试');
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user