From c0d026f89609e0d77de482d80d1b1bb53584895b Mon Sep 17 00:00:00 2001 From: pjs Date: Mon, 19 Jan 2026 18:48:39 +0900 Subject: [PATCH] =?UTF-8?q?index=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../madeuhome/common/ctrl/MenuController.java | 10 +- .../web/webhome/WebHomeController.java | 8 +- .../css/web/service/makeReservation.css | 885 +++++++++--------- .../templates/web/layout/layoutHead.html | 2 +- 4 files changed, 458 insertions(+), 447 deletions(-) diff --git a/src/main/java/com/madeuhome/common/ctrl/MenuController.java b/src/main/java/com/madeuhome/common/ctrl/MenuController.java index 78c2da8..581851a 100644 --- a/src/main/java/com/madeuhome/common/ctrl/MenuController.java +++ b/src/main/java/com/madeuhome/common/ctrl/MenuController.java @@ -1,6 +1,5 @@ package com.madeuhome.common.ctrl; -import java.util.ArrayList; import java.util.List; import org.springframework.beans.factory.annotation.Autowired; @@ -24,12 +23,13 @@ public class MenuController { String requestURI = request.getRequestURI(); // 특정 URL 패턴에만 메뉴 추가 - if (requestURI.endsWith("Intro.do") || requestURI.startsWith("/index") ) { - return menuService.getMenuHierarchy("MAIN"); - } + /* + * if (requestURI.endsWith("Intro.do") || requestURI.startsWith("/index") ) { + * return menuService.getMenuHierarchy("MAIN"); } + */ - return new ArrayList<>(); + return menuService.getMenuHierarchy("MAIN"); } } diff --git a/src/main/java/com/madeuhome/controller/web/webhome/WebHomeController.java b/src/main/java/com/madeuhome/controller/web/webhome/WebHomeController.java index 02afc1f..8a05da2 100644 --- a/src/main/java/com/madeuhome/controller/web/webhome/WebHomeController.java +++ b/src/main/java/com/madeuhome/controller/web/webhome/WebHomeController.java @@ -5,7 +5,7 @@ import jakarta.servlet.http.HttpServletRequest; import jakarta.servlet.http.HttpSession; import lombok.extern.slf4j.Slf4j; import org.springframework.stereotype.Controller; -import org.springframework.web.bind.annotation.RequestMapping; +import org.springframework.web.bind.annotation.GetMapping; @Slf4j @@ -19,16 +19,16 @@ public class WebHomeController extends ManagerDraftAction{ * @param response * @return */ - @RequestMapping(value="/") + @GetMapping("/") public String homeIntro(HttpSession session,HttpServletRequest request) { log.debug("WebHomeController homeIntro START"); log.debug("WebHomeController homeIntro END"); - return "/intro"; + return "/index"; } - @RequestMapping(value="/index") + @GetMapping("/index") public String homeIndex(HttpSession session,HttpServletRequest request) { log.debug("WebHomeController homeIndex START"); diff --git a/src/main/resources/static/css/web/service/makeReservation.css b/src/main/resources/static/css/web/service/makeReservation.css index 753770d..b2ceb7b 100644 --- a/src/main/resources/static/css/web/service/makeReservation.css +++ b/src/main/resources/static/css/web/service/makeReservation.css @@ -1,459 +1,470 @@ * { - box-sizing: border-box; - } - - body { - font-family: 'Noto Sans KR', sans-serif; - margin: 0; - background: #fafafa; - color: #222; - height: 100vh; - display: flex; - flex-direction: column; - } + box-sizing: border-box; +} - /* Main container */ - .reservation-container { - display: flex; - max-width: 1280px !important; - margin: 0 auto; - gap: 20px; - height: 100%; - flex: 1; - padding: 20px 0; - margin-top:65px; - } +body { + font-family: 'Noto Sans KR', sans-serif; + margin: 0; + background: #fafafa; + color: #222; + height: 100vh; + display: flex; + flex-direction: column; +} - .box { - background: #fff; - border-radius: 16px; - box-shadow: 0 2px 8px rgba(0,0,0,0.06); - padding: 24px 16px; - flex: 1 1 0; - min-width: 260px; - display: flex; - flex-direction: column; - height: fit-content; - min-height: 600px; - } +/* Main container */ +.reservation-container { + display: flex; + max-width: 1280px !important; + margin: 0 auto; + gap: 20px; + height: 100%; + flex: 1; + padding: 20px 0; + margin-top: 65px; +} - .step-title { - color: #b23c3c; - font-weight: 700; - font-size: 1.1em; - margin-bottom: 12px; - letter-spacing: 0.02em; - transition: color 0.3s ease; - } +.box { + background: #fff; + border-radius: 16px; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); + padding: 24px 16px; + flex: 1 1 0; + min-width: 260px; + display: flex; + flex-direction: column; + height: fit-content; + min-height: 600px; +} - .step-title.completed { - color: #008000 !important; - } +.step-title { + color: #b23c3c; + font-weight: 700; + font-size: 1.1em; + margin-bottom: 12px; + letter-spacing: 0.02em; + transition: color 0.3s ease; +} - /* Service section */ - .service-list { - flex: 1; - margin-bottom: 24px; - } - - .service-item { - display: flex; - justify-content: space-between; - align-items: center; - font-size: 1.1em; - margin-bottom: 10px; - } - - .service-item .del { - cursor: pointer; - color: #b23c3c; - margin-left: 8px; - font-size: 1.2em; - transition: color 0.3s ease, opacity 0.3s ease; - } - - .service-item .del:hover { - color: #ff0000; - } - - .service-item .del.disabled { - color: #ccc; - cursor: not-allowed; - opacity: 0.5; - } - - .service-item .del.disabled:hover { - color: #ccc; - } - - .service-item .price { - font-weight: bold; - color: #b23c3c; - } +.step-title.completed { + color: #008000 !important; +} - /* Service count indicator */ - .service-count-info { - font-size: 0.85em; - color: #888; - margin-bottom: 8px; - text-align: center; - padding: 4px 8px; - background: #f8f9fa; - border-radius: 4px; - } +/* Service section */ +.service-list { + flex: 1; + margin-bottom: 24px; +} - .service-count-info.single { - color: #ff8c00; - background: #fff3e0; - border: 1px solid #ffcc80; - } +.service-item { + display: flex; + justify-content: space-between; + align-items: center; + font-size: 1.1em; + margin-bottom: 10px; +} - .total { - border-top: 1px solid #eee; - margin-top: auto; - padding-top: 16px; - display: flex; - justify-content: space-between; - font-size: 1.1em; - font-weight: bold; - } - - .total .price { - color: #b23c3c; - } - - .total small { - font-weight: normal; - color: #888; - font-size: 0.9em; - margin-right: 8px; - } +.service-item .del { + cursor: pointer; + color: #b23c3c; + margin-left: 8px; + font-size: 1.2em; + transition: color 0.3s ease, opacity 0.3s ease; +} - /* Calendar section */ - .calendar-box { - margin-bottom: 20px; - } - - .calendar-header { - display: flex; - justify-content: center; - align-items: center; - gap: 8px; - margin-bottom: 8px; - } - - .calendar-header button { - background: none; - border: none; - font-size: 1.2em; - cursor: pointer; - color: #b23c3c; - padding: 0 6px; - } - - .calendar-table { - width: 100%; - border-collapse: collapse; - text-align: center; - margin-bottom: 8px; - } - - .calendar-table th, - .calendar-table td { - width: 2em; - height: 2em; - padding: 2px; - font-size: 1em; - border-radius: 50%; - cursor: pointer; - transition: background 0.15s; - } - - .calendar-table th { - color: #b23c3c; - font-weight: 500; - background: none; - } - - .calendar-table td.selected { - background: #b23c3c; - color: #fff; - } - - .calendar-table td.today { - border: 1.5px solid #b23c3c; - } - - .calendar-table td:not(.selected):hover { - background: #f5eaea; - } - - .calendar-table td.disabled { - color: #ccc; - pointer-events: none; - background: none; - } +.service-item .del:hover { + color: #ff0000; +} - /* Time slots */ - .time-slots { - display: flex; - flex-wrap: wrap; - gap: 8px; - margin-bottom: 12px; - } - - .time-btn { - flex: 1 0 30%; - min-width: 80px; - padding: 8px 0; - border: 1px solid #b23c3c; - border-radius: 20px; - background: #fff; - color: #b23c3c; - font-size: 1em; - cursor: pointer; - transition: background 0.15s, color 0.15s; - } - - .time-btn.selected, - .time-btn:active { - background: #b23c3c; - color: #fff; - } - - .time-btn:disabled { - color: #ccc; - border-color: #eee; - background: #f5f5f5; - cursor: not-allowed; - } +.service-item .del.disabled { + color: #ccc; + cursor: not-allowed; + opacity: 0.5; +} - .person-count { - margin-top: 12px; - font-size: 0.98em; - color: #888; - } +.service-item .del.disabled:hover { + color: #ccc; +} - /* Form section */ - .form-group { - margin-bottom: 16px; - } - - .form-group label { - display: block; - margin-bottom: 4px; - font-weight: 500; - } - - .form-group input, - .form-group textarea { - width: 100%; - padding: 8px 10px; - border: 1px solid #ddd; - border-radius: 6px; - font-size: 1em; - resize: none; - transition: border-color 0.3s ease; - } - - .form-group textarea { - min-height: 60px; - } +.service-item .price { + font-weight: bold; + color: #b23c3c; +} - .checkbox-group { - display: flex; - align-items: center; - margin-bottom: 18px; - font-size: 0.98em; - } - - .checkbox-group input[type="checkbox"] { - margin-right: 8px; - accent-color: #b23c3c; - } +/* Service count indicator */ +.service-count-info { + font-size: 0.85em; + color: #888; + margin-bottom: 8px; + text-align: center; + padding: 4px 8px; + background: #f8f9fa; + border-radius: 4px; +} - .submit-btn { - width: 100%; - padding: 14px 0; - background: #ddd; - color: #888; - border: none; - border-radius: 8px; - font-size: 1.1em; - font-weight: bold; - cursor: not-allowed; - transition: all 0.3s ease; - } - - .submit-btn.step-progress { - background: linear-gradient(45deg, #ddd, #bbb); - color: #666; - font-size: 0.95em; - } - - .submit-btn.ready { - background: #b23c3c; - color: #fff; - cursor: pointer; - animation: pulse 2s infinite; - } +.service-count-info.single { + color: #ff8c00; + background: #fff3e0; + border: 1px solid #ffcc80; +} - @keyframes pulse { - 0% { transform: scale(1); } - 50% { transform: scale(1.02); } - 100% { transform: scale(1); } - } +.total { + border-top: 1px solid #eee; + margin-top: auto; + padding-top: 16px; + display: flex; + justify-content: space-between; + font-size: 1.1em; + font-weight: bold; +} - /* Phone message styles (common.js PhoneValidator용) */ - .phone-message { - font-size: 12px; - margin-top: 5px; - padding: 4px 8px; - border-radius: 4px; - font-weight: 500; - transition: all 0.3s ease; - } - - .phone-message.error { - color: #ff0000; - background-color: #ffebee; - border: 1px solid #ffcdd2; - } - - .phone-message.warning { - color: #ff8c00; - background-color: #fff3e0; - border: 1px solid #ffcc80; - } - - .phone-message.success { - color: #008000; - background-color: #f1f8e9; - border: 1px solid #c8e6c9; - } - - .phone-message.info { - color: #2196f3; - background-color: #e3f2fd; - border: 1px solid #90caf9; - } +.total .price { + color: #b23c3c; +} - /* Birth date message styles */ - .birth-date-message { - font-size: 12px; - margin-top: 5px; - padding: 4px 8px; - border-radius: 4px; - font-weight: 500; - transition: all 0.3s ease; - } - - .birth-date-message.error { - color: #ff0000; - background-color: #ffebee; - border: 1px solid #ffcdd2; - } - - .birth-date-message.warning { - color: #ff8c00; - background-color: #fff3e0; - border: 1px solid #ffcc80; - } - - .birth-date-message.success { - color: #008000; - background-color: #f1f8e9; - border: 1px solid #c8e6c9; - } - - .birth-date-message.info { - color: #2196f3; - background-color: #e3f2fd; - border: 1px solid #90caf9; - } +.total small { + font-weight: normal; + color: #888; + font-size: 0.9em; + margin-right: 8px; +} - /* Responsive Design */ - @media (max-width: 1199.98px) { - .reservation-container { - max-width: 960px !important; - gap: 16px; - padding: 20px 15px; - } - .box { - padding: 20px 14px; - } - } +/* Calendar section */ +.calendar-box { + margin-bottom: 20px; +} - @media (max-width: 991.98px) { - .reservation-container { - max-width: 720px !important; - flex-direction: column; - gap: 24px; - height: auto; - padding: 20px 15px; - } - .box { - min-height: unset; - min-width: unset; - } - - } +.calendar-header { + display: flex; + justify-content: center; + align-items: center; + gap: 8px; + margin-bottom: 8px; +} - @media (max-width: 767.98px) { - .reservation-container { - max-width: 540px !important; - padding: 15px; - gap: 20px; - } - .box { - padding: 16px 12px; - } - .calendar-table th, - .calendar-table td { - width: 1.8em; - height: 1.8em; - } - .time-btn { - min-width: 70px; - font-size: 0.95em; - } - } +.calendar-header button { + background: none; + border: none; + font-size: 1.2em; + cursor: pointer; + color: #b23c3c; + padding: 0 6px; +} - @media (max-width: 575.98px) { - .reservation-container { - max-width: 100% !important; - padding: 10px; - gap: 16px; - } - .box { - padding: 16px 8px; - } - .calendar-table th, - .calendar-table td { - width: 1.5em; - height: 1.5em; - font-size: 0.9em; - } - .time-btn { - min-width: 60px; - font-size: 0.9em; - padding: 6px 0; - } - .step-title { - font-size: 1em; - } - .service-item { - font-size: 1em; - } - } - .calendar-table td.disabled { - color: #ccc; - cursor: not-allowed; - pointer-events: none; - background: none !important; - } - - .calendar-table td.disabled:hover { - background: none !important; - cursor: not-allowed !important; - } \ No newline at end of file +.calendar-table { + width: 100%; + border-collapse: collapse; + text-align: center; + margin-bottom: 8px; +} + +.calendar-table th, +.calendar-table td { + width: 2em; + height: 2em; + padding: 2px; + font-size: 1em; + border-radius: 50%; + cursor: pointer; + transition: background 0.15s; +} + +.calendar-table th { + color: #b23c3c; + font-weight: 500; + background: none; +} + +.calendar-table td.selected { + background: #b23c3c; + color: #fff; +} + +.calendar-table td.today { + border: 1.5px solid #b23c3c; +} + +.calendar-table td:not(.selected):hover { + background: #f5eaea; +} + +.calendar-table td.disabled { + color: #ccc; + pointer-events: none; + background: none; +} + +/* Time slots */ +.time-slots { + display: flex; + flex-wrap: wrap; + gap: 8px; + margin-bottom: 12px; +} + +.time-btn { + flex: 1 0 30%; + min-width: 80px; + padding: 8px 0; + border: 1px solid #b23c3c; + border-radius: 20px; + background: #fff; + color: #b23c3c; + font-size: 1em; + cursor: pointer; + transition: background 0.15s, color 0.15s; +} + +.time-btn.selected, +.time-btn:active { + background: #b23c3c; + color: #fff; +} + +.time-btn:disabled { + color: #ccc; + border-color: #eee; + background: #f5f5f5; + cursor: not-allowed; +} + +.person-count { + margin-top: 12px; + font-size: 0.98em; + color: #888; +} + +/* Form section */ +.form-group { + margin-bottom: 16px; +} + +.form-group label { + display: block; + margin-bottom: 4px; + font-weight: 500; +} + +.form-group input, +.form-group textarea { + width: 100%; + padding: 8px 10px; + border: 1px solid #ddd; + border-radius: 6px; + font-size: 1em; + resize: none; + transition: border-color 0.3s ease; +} + +.form-group textarea { + min-height: 60px; +} + +.checkbox-group { + display: flex; + align-items: center; + margin-bottom: 18px; + font-size: 0.98em; +} + +.checkbox-group input[type="checkbox"] { + margin-right: 8px; + accent-color: #b23c3c; +} + +.submit-btn { + width: 100%; + padding: 14px 0; + background: #ddd; + color: #888; + border: none; + border-radius: 8px; + font-size: 1.1em; + font-weight: bold; + cursor: not-allowed; + transition: all 0.3s ease; +} + +.submit-btn.step-progress { + background: linear-gradient(45deg, #ddd, #bbb); + color: #666; + font-size: 0.95em; +} + +.submit-btn.ready { + background: #b23c3c; + color: #fff; + cursor: pointer; + animation: pulse 2s infinite; +} + +@keyframes pulse { + 0% { transform: scale(1); } + 50% { transform: scale(1.02); } + 100% { transform: scale(1); } +} + +/* Phone message styles (common.js PhoneValidator용) */ +.phone-message { + font-size: 12px; + margin-top: 5px; + padding: 4px 8px; + border-radius: 4px; + font-weight: 500; + transition: all 0.3s ease; +} + +.phone-message.error { + color: #ff0000; + background-color: #ffebee; + border: 1px solid #ffcdd2; +} + +.phone-message.warning { + color: #ff8c00; + background-color: #fff3e0; + border: 1px solid #ffcc80; +} + +.phone-message.success { + color: #008000; + background-color: #f1f8e9; + border: 1px solid #c8e6c9; +} + +.phone-message.info { + color: #2196f3; + background-color: #e3f2fd; + border: 1px solid #90caf9; +} + +/* Birth date message styles */ +.birth-date-message { + font-size: 12px; + margin-top: 5px; + padding: 4px 8px; + border-radius: 4px; + font-weight: 500; + transition: all 0.3s ease; +} + +.birth-date-message.error { + color: #ff0000; + background-color: #ffebee; + border: 1px solid #ffcdd2; +} + +.birth-date-message.warning { + color: #ff8c00; + background-color: #fff3e0; + border: 1px solid #ffcc80; +} + +.birth-date-message.success { + color: #008000; + background-color: #f1f8e9; + border: 1px solid #c8e6c9; +} + +.birth-date-message.info { + color: #2196f3; + background-color: #e3f2fd; + border: 1px solid #90caf9; +} + +/* Disabled calendar cell - 강화된 스타일 */ +.calendar-table td.disabled { + color: #ccc; + cursor: not-allowed; + pointer-events: none; + background: none !important; +} + +.calendar-table td.disabled:hover { + background: none !important; + cursor: not-allowed !important; +} + +/* Responsive Design */ +@media (max-width: 1199.98px) { + .reservation-container { + max-width: 960px !important; + gap: 16px; + padding: 20px 15px; + } + + .box { + padding: 20px 14px; + } +} + +@media (max-width: 991.98px) { + .reservation-container { + max-width: 720px !important; + flex-direction: column; + gap: 24px; + height: auto; + padding: 20px 15px; + } + + .box { + min-height: unset; + min-width: unset; + } +} + +@media (max-width: 767.98px) { + .reservation-container { + max-width: 540px !important; + padding: 15px; + gap: 20px; + } + + .box { + padding: 16px 12px; + } + + .calendar-table th, + .calendar-table td { + width: 1.8em; + height: 1.8em; + } + + .time-btn { + min-width: 70px; + font-size: 0.95em; + } +} + +@media (max-width: 575.98px) { + .reservation-container { + max-width: 100% !important; + padding: 10px; + gap: 16px; + } + + .box { + padding: 16px 8px; + } + + .calendar-table th, + .calendar-table td { + width: 1.5em; + height: 1.5em; + font-size: 0.9em; + } + + .time-btn { + min-width: 60px; + font-size: 0.9em; + padding: 6px 0; + } + + .step-title { + font-size: 1em; + } + + .service-item { + font-size: 1em; + } +} diff --git a/src/main/resources/templates/web/layout/layoutHead.html b/src/main/resources/templates/web/layout/layoutHead.html index 8e17df2..e20fff7 100644 --- a/src/main/resources/templates/web/layout/layoutHead.html +++ b/src/main/resources/templates/web/layout/layoutHead.html @@ -23,7 +23,7 @@ - + 메이드유