쇼핑몰 > 연령확인 팝업

This commit is contained in:
이대환
2026-04-30 16:16:58 +09:00
parent fd385fe898
commit f3918ed7b1
4 changed files with 125 additions and 2 deletions

View File

@@ -1015,4 +1015,14 @@ public class MainController {
);
}
/**
* 연령확인 팝업
* @return
*/
@Policy(AuthPolicy.PUBLIC)
@RequestMapping(value="/sopmal/main/selectAgeChkPopup", produces = MediaType.APPLICATION_JSON_VALUE)
public String selectAgeChkPopup(HttpServletRequest request) {
return Util.getDeviceType(request)+"/main/AgeChkPopupR";
}
}

View File

@@ -372,9 +372,8 @@
fn_reflesh_cart_cnt()
/*비밀번호 변경 알림 여부 확인*/
$(document).ready(function () {
/*비밀번호 변경 알림 여부 확인*/
const url = '<c:url value="/sopmal/mbr/selectPasswordChng"/>';
const originalUrl = window.location.href;
let passwordAt = '<%=(String)session.getAttribute("passwordChngDeAt")%>'
@@ -383,6 +382,15 @@
location.href = url + '?originalUrl=' + encodeURIComponent(originalUrl);
}
/*연령확인 여부 확인*/
let ageChked = getCookieValue("ageChk");
if(!ageChked) {
fn_open_modal(
'#ageChkPopupDiv',
'#ageChkPopup',
'/sopmal/main/selectAgeChkPopup'
);
}
})
@@ -398,6 +406,7 @@
}%>
<input type="hidden" id="adscriptMbrId" value="${adscriptMbrId}"/>
<div id="mbrMarktClauseAgreeDiv"></div>
<div id="ageChkPopupDiv"></div>
<script>
@@ -466,6 +475,14 @@
}
//쿠키 값 가져오기
const getCookieValue = function(name) {
let matches = document.cookie.match(
new RegExp('(?:^|; )' + name + '=([^;]*)')
);
return matches ? matches[1] : null;
}
</script>
<!--로딩영역-->

View File

@@ -90,6 +90,9 @@
<%--theme적용--%>
<link rel="stylesheet" type="text/css" href="<c:out value="${sopmallInfo.themaPath}"/>">
<%--font적용--%>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR&family=Noto+Sans+JP&display=swap" rel="stylesheet">
<%--Web-App연동 스크립트--%>
<script src="/mobile/js/bnft/common/Common_app.js" defer=""></script>
@@ -361,6 +364,8 @@
loadRecentSearches();
passwordChngDeAt();
ageChkAt();
fn_save_mbrdvc_info(${isAuthenticated});
});
@@ -470,6 +475,31 @@
}
}
/*연령확인 여부 확인 */
function ageChkAt() {
let ageChked = getCookieValue("ageChk");
if(!ageChked) {
openModal('confirm_ageChk_alert');
}
}
const fn_ageChk_yes = function() {
closeModal('confirm_ageChk_alert')
document.cookie = "ageChk=true; path=/; max-age=86400";
}
const fn_ageChk_no = function() {
window.location.href = "https://m.search.naver.com/search.naver?query=사케일잔";
}
//쿠키 값 가져오기
const getCookieValue = function(name) {
let matches = document.cookie.match(
new RegExp('(?:^|; )' + name + '=([^;]*)')
);
return matches ? matches[1] : null;
}
// 최근 검색어 저장
function saveSearch(param) {
let searches = JSON.parse(localStorage.getItem('recentSearches')) || [];
@@ -755,6 +785,32 @@
</div>
</div>
<%--연령확인 모달--%>
<div class="microModal microAlert" id="confirm_ageChk_alert" aria-hidden="true" style="font-family: 'Noto Sans JP', 'Noto Sans KR', sans-serif;">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true" style="width: 350px;">
<div class="microModal__body">
<div class="microModal__top">
<p class="alert-content__text" style="font-size: 20px;">
満20歳以上ですか?<br>
(만20세 이상입니까?)
</p>
<br>
<p class="alert-content__text--sm" style="font-size: 15px;">
20歳未満の飲酒は法律で禁止されています。<br>
(20세 미만의 음주는 법으로 금지되어 있습니다.)
</p>
<br>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" onclick="fn_ageChk_yes();">はい (예)</button>
<button class="microModal__btn" onclick="fn_ageChk_no()">いいえ (아니오)</button>
</div>
</div>
</div>
</div>
<%--cutom 확인 모달--%>
<div class="microModal microAlert" id="custom_confirm_alert" aria-hidden="true" style="position: relative; z-index: 1010;">
<div class="microModal__overlay" tabindex="-1">

View File

@@ -0,0 +1,40 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%--
Class Name : NtcntalkAtmcSndngTmplatUpdtPopupU.jsp
Description : 메시지 자동 발송 상세
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024.05.16 이대환 최초 생성
--%>
<script>
const fn_ageChk_yes = function() {
document.cookie = "ageChk=true; path=/; max-age=86400";
}
const fn_ageChk_no = function() {
window.location.href = "https://search.naver.com/search.naver?query=사케일잔";
}
</script>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR&family=Noto+Sans+JP&display=swap" rel="stylesheet">
<div id="ageChkPopup" class="modal alert" style="max-width: 800px; font-family: 'Noto Sans JP', 'Noto Sans KR', sans-serif;">
<div class="alert-content">
<p class="alert-content__text" style="font-size: 35px;">
満20歳以上ですか?<br>
(만20세 이상입니까?)
</p>
<p class="alert-content__text--sm" style="font-size: 25px;">
20歳未満の飲酒は法律で禁止されています。<br>
(20세 미만의 음주는 법으로 금지되어 있습니다.)
</p>
</div>
<div class="alert-btn-container">
<a href="javascript:void(0);" onclick="fn_ageChk_yes();" rel="modal:close" class="alert-btn alert-btn--confirm" style="font-size: 20px;">はい (예)</a>
<a href="javascript:void(0);" onclick="fn_ageChk_no();" rel="modal:close" class="alert-btn alert-btn--confirm" style="font-size: 20px;">いいえ (아니오)</a>
</div>
</div>