This repository has been archived by the owner on Dec 31, 2023. It is now read-only.
-
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #57 from hardingadonis/vuong_profile_page
Vương: Profile Page
- Loading branch information
Showing
11 changed files
with
280 additions
and
9 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
114 changes: 114 additions & 0 deletions
114
src/main/java/io/hardingadonis/miu/controller/web/ProfileServlet.java
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,114 @@ | ||
| package io.hardingadonis.miu.controller.web; | ||
|
|
||
| import io.hardingadonis.miu.model.*; | ||
| import io.hardingadonis.miu.model.detail.*; | ||
| import io.hardingadonis.miu.services.*; | ||
| import java.io.*; | ||
| import java.util.*; | ||
| import javax.servlet.*; | ||
| import javax.servlet.annotation.*; | ||
| import javax.servlet.http.*; | ||
| import org.apache.commons.fileupload.*; | ||
| import org.apache.commons.fileupload.disk.*; | ||
| import org.apache.commons.fileupload.servlet.*; | ||
|
|
||
| @WebServlet(name = "ProfileServlet", urlPatterns = {"/profile"}) | ||
| @MultipartConfig | ||
| public class ProfileServlet extends HttpServlet { | ||
|
|
||
| public static final String UPLOAD_AVATAR_DIRECTORY = "assets/images/avatars"; | ||
|
|
||
| public static final int MEMORY_THRESHOLD = 1024 * 1024 * 3; | ||
| public static final int MAX_FILE_SIZE = 1024 * 1024 * 3; | ||
| public static final int MAX_REQUEST_SIZE = 1024 * 1024 * 10; | ||
|
|
||
| @Override | ||
| protected void doGet(HttpServletRequest request, HttpServletResponse response) | ||
| throws ServletException, IOException { | ||
| request.setCharacterEncoding("UTF-8"); | ||
| response.setContentType("text/html; charset=UTF-8"); | ||
|
|
||
| User user = (User) request.getSession().getAttribute("user"); | ||
|
|
||
| if (user == null) { | ||
| response.sendRedirect("login"); | ||
| return; | ||
| } | ||
|
|
||
| request.setAttribute("gender", user.getGender().toString()); | ||
|
|
||
| request.getRequestDispatcher("/view/web/profile.jsp").forward(request, response); | ||
| } | ||
|
|
||
| @Override | ||
| protected void doPost(HttpServletRequest request, HttpServletResponse response) | ||
| throws ServletException, IOException { | ||
| request.setCharacterEncoding("UTF-8"); | ||
| response.setContentType("text/html; charset=UTF-8"); | ||
|
|
||
| User user = (User) request.getSession().getAttribute("user"); | ||
|
|
||
| try { | ||
| String uploadPath = getServletContext().getRealPath("") + UPLOAD_AVATAR_DIRECTORY; | ||
|
|
||
| DiskFileItemFactory factory = new DiskFileItemFactory(MEMORY_THRESHOLD, new File(System.getProperty("java.io.tmpdir"))); | ||
|
|
||
| ServletFileUpload upload = new ServletFileUpload(factory); | ||
| upload.setFileSizeMax(MAX_FILE_SIZE); | ||
| upload.setSizeMax(MAX_REQUEST_SIZE); | ||
|
|
||
| List<FileItem> items = upload.parseRequest(request); | ||
|
|
||
| for (FileItem item : items) { | ||
| if (!item.isFormField() && item.getSize() > 0) { | ||
| String fileName = new File(item.getName()).getName(); | ||
| fileName = Hash.SHA256(fileName + System.currentTimeMillis()) + "." + getFileExtension(fileName); | ||
|
|
||
| String filePath = uploadPath + File.separator + fileName; | ||
|
|
||
| File storeFile = new File(filePath); | ||
| if (!storeFile.exists()) { | ||
| item.write(storeFile); | ||
| user.setAvatarPath(UPLOAD_AVATAR_DIRECTORY + File.separator + fileName); | ||
| } | ||
| } else { | ||
| switch (item.getFieldName()) { | ||
| case "full-name": { | ||
| String fullName = item.getString("UTF-8"); | ||
| user.setFullName(fullName); | ||
| break; | ||
| } | ||
|
|
||
| case "birth-year": { | ||
| int birthYear = Integer.parseInt(item.getString("UTF-8")); | ||
| user.setBirthYear(birthYear); | ||
| break; | ||
| } | ||
|
|
||
| case "gender": { | ||
| UserGender gender = UserGender.create(item.getString("UTF-8")); | ||
| user.setGender(gender); | ||
| break; | ||
| } | ||
| } | ||
| } | ||
| } | ||
| } catch (Exception ex) { | ||
| System.err.println(ex.getMessage()); | ||
| } | ||
|
|
||
| Singleton.userDAO.update(user); | ||
|
|
||
| this.doGet(request, response); | ||
| } | ||
|
|
||
| private static String getFileExtension(String fileName) { | ||
| int dotIndex = fileName.lastIndexOf('.'); | ||
|
|
||
| if (dotIndex > 0 && dotIndex < fileName.length() - 1) { | ||
| return fileName.substring(dotIndex + 1); | ||
| } else { | ||
| return ""; | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| .option { | ||
| transition: background-color 0.3s; | ||
| } | ||
|
|
||
| .option:hover { | ||
| background-color: #d1d8e0; | ||
| } | ||
|
|
||
| .option:active { | ||
| background-color: rgba(109, 121, 134, 0.9); | ||
| color: #ffffff; | ||
| } | ||
|
|
||
| .option-selected { | ||
| background-color: rgba(165, 175, 185, 0.9); | ||
| color: #ffffff; | ||
| } | ||
|
|
||
| .form-check-input:checked { | ||
| background-color: #000 !important; | ||
| border-color: #000 !important; | ||
| color: #fff !important; | ||
| } | ||
|
|
||
| .input-field-gender { | ||
| display: flex; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| const form = document.getElementById('profile-form'); | ||
| const fullNameInput = document.getElementById('full-name'); | ||
| const birthYearInput = document.getElementById('birth-year'); | ||
|
|
||
| form.addEventListener('submit', function (event) { | ||
| event.preventDefault(); | ||
|
|
||
| removeExtraSpaces(fullNameInput); | ||
|
|
||
| this.submit(); | ||
| }); | ||
|
|
||
| birthYearInput.addEventListener('input', function () { | ||
| removeNonNumericCharacters(birthYearInput); | ||
|
|
||
| if (birthYearInput.value.length > 4) { | ||
| birthYearInput.value = birthYearInput.value.slice(0, 4); | ||
| } | ||
| }); | ||
|
|
||
| function removeExtraSpaces(input) { | ||
| input.value = input.value.replace(/\s+/g, ' ').trim(); | ||
| } | ||
|
|
||
| function removeNonNumericCharacters(input) { | ||
| input.value = input.value.replace(/[^0-9]/g, ''); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,96 @@ | ||
| <%@ page contentType="text/html" pageEncoding="UTF-8" %> | ||
| <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> | ||
|
|
||
| <!DOCTYPE html> | ||
|
|
||
| <html> | ||
|
|
||
| <head> | ||
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> | ||
|
|
||
| <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" /> | ||
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" /> | ||
| <link rel="stylesheet" href="<%=request.getContextPath()%>/assets/css/web/common/common.css" /> | ||
| <link rel="stylesheet" href="<%=request.getContextPath()%>/assets/css/web/profile.css" /> | ||
|
|
||
| <link rel="icon" type="image/x-icon" href="<%=request.getContextPath()%>/assets/images/favicon/favicon.png"> | ||
|
|
||
| <title>Miu Shop | Thông tin chung</title> | ||
| </head> | ||
|
|
||
| <body> | ||
| <%@include file="common/_header.jsp" %> | ||
|
|
||
| <section class="py-5 my-5"> | ||
| <div class="container"> | ||
| <div class="row"> | ||
| <div class="col-lg-3 col-sm-12 text-center"> | ||
| <img src="./${sessionScope.user.avatarPath}" alt="Avatar" class="img-thumbnail rounded"> | ||
| <h3 class="my-4">${sessionScope.user.fullName}</h3> | ||
| <ul class="nav flex-column"> | ||
| <li class="nav-item"> | ||
| <a href="profile" class="nav-link text-muted option option-selected">Thông tin chung</a> | ||
| <a href="delivery-address" class="nav-link text-muted option">Địa chỉ giao hàng</a> | ||
| <a href="purchase-history" class="nav-link text-muted option">Lịch sử mua hàng</a> | ||
| <a href="change-password" class="nav-link text-muted option">Đổi mật khẩu</a> | ||
| </li> | ||
| </ul> | ||
| </div> | ||
|
|
||
| <div class="col-lg-9 col-sm-12"> | ||
| <div class="container-fluid p-3 border border-dark"> | ||
| <h6 class="m-3 text-center display-6">Thông tin chung</h6> | ||
|
|
||
| <form id="profile-form" action="profile" method="post" enctype="multipart/form-data" class="px-5"> | ||
| <div class="mb-3"> | ||
| <label for="full-name" class="form-label">Họ và tên</label> | ||
| <input name="full-name" class="form-control" type="text" id="full-name" value="${sessionScope.user.fullName}" required> | ||
| </div> | ||
|
|
||
| <div class="mb-3"> | ||
| <label for="email" class="form-label">Email</label> | ||
| <input name="email" type="text" class="form-control" id="email" value="${sessionScope.user.email}" disabled required> | ||
| </div> | ||
|
|
||
| <div class="mb-3"> | ||
| <label for="birth-year" class="form-label">Năm sinh</label> | ||
| <input name="birth-year" class="form-control" type="text" id="birth-year" value="${sessionScope.user.birthYear}" required> | ||
| </div> | ||
|
|
||
| <div class="mb-3 input-field-gender"> | ||
| <label class="form-label me-3">Giới Tính</label> | ||
| <div class="justify-content-around d-flex"> | ||
| <div class="form-check mx-3"> | ||
| <input class="form-check-input" type="radio" name="gender" id="male" value="male" ${gender eq 'male' ? 'checked' : ''}> | ||
| <label class="form-check-label" for="male">Nam</label> | ||
| </div> | ||
| <div class="form-check mx-3"> | ||
| <input class="form-check-input" type="radio" name="gender" id="female" value="female" ${gender eq 'female' ? 'checked' : ''}> | ||
| <label class="form-check-label" for="female">Nữ</label> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="mb-3"> | ||
| <label for="formImageFile" class="form-label">Chọn ảnh avatar mới</label> | ||
| <input name="avatar-image" class="form-control" type="file" id="formImageFile" accept="image/*"> | ||
| </div> | ||
|
|
||
| <div class="my-3 text-center"> | ||
| <button type="submit" class="btn btn-outline-dark">Xác Nhận</button> | ||
| </div> | ||
| </form> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
| <%@include file="common/_footer.jsp" %> | ||
|
|
||
| <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script> | ||
| <script src="<%=request.getContextPath()%>/assets/js/web/common/commonHandler.js"></script> | ||
| <script src="<%=request.getContextPath()%>/assets/js/web/profileHandler.js"></script> | ||
| </body> | ||
|
|
||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters