초기소스

This commit is contained in:
jazz
2025-10-29 17:08:05 +09:00
parent e531aa9540
commit 439a379a02
7551 changed files with 1234427 additions and 3 deletions

View File

@@ -0,0 +1,269 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : Atend.jsp
Description : 출석참여
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-06-10 노태운 최초 생성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/atend/Atend.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("출석체크");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button id="statsButton" class="header__btn"><i class="icon icon_nav-home"></i><span class="visually-hidden">메인으로</span></button>
`);
// 메인으로 이동
$("#statsButton").on('click', function() {
window.location.href = "<c:url value='/'/>";
});
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- EL 태그를 사용하여 screeninfo 객체 설정 -->
<c:set var="rewardInfo" value="${mainScreenInfo.rewardInfo[0]}" />
<c:set var="screenInfo" value="${mainScreenInfo.screenInfo[0]}" />
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="eventAtt">
<div class="Att-box">
<div class="Att-bg">
<img src="<c:out value="${cdnurl}${screenInfo.scrReprsntImg}"/>"
onerror="this.src='/pc/images/image_placeholder.png'"
alt="오늘도 좋은하루~ 출석체크하고 선물받고!">
</div>
<div class="Att-cnt1">
<p class="tit">이번 달 출석</p>
<div class="cnt-wrap">
<p class="cnt1" id="currMonAttCnt">${attendanceCount}회</p>
<p class="cnt2" id="currMonMlgSum"><fmt:formatNumber value="${attendanceMileageInfo.totalAttendanceMileage}" type="number" maxFractionDigits="0"/>원</p>
</div>
</div>
<div class="Att-cnt2">
<ul>
<li>매일 1회 : 마일리지 <fmt:formatNumber value="${screenInfo.mlgRwdAmt}" type="number" maxFractionDigits="0"/>원 적립</li>
<li>누적 10회 / 20회 : 쿠폰 즉시 지급</li>
<c:forEach var="reward" items="${rewardInfo}">
<c:if test="${reward.rewardCondition == '100% 출석'}">
<li>100% 출석 : 마일리지 <fmt:formatNumber value="${reward.mlgRwdAmt}" type="number" maxFractionDigits="0"/>원<c:if test="${not empty reward.itmNm}"> + 특별경품 자동 응모</c:if></li>
</c:if>
</c:forEach>
</ul>
</div>
</div>
<div class="calendar-wrap">
<p class="month-tit"></p>
<div class="calendar">
<div class="weekdays">
<div class="day">일</div>
<div class="day">월</div>
<div class="day">화</div>
<div class="day">수</div>
<div class="day">목</div>
<div class="day">금</div>
<div class="day">토</div>
</div>
<div class="days">
<!-- Calendar days will be generated by JavaScript -->
</div>
</div>
</div>
<div class="sub-box">
<div class="eventAtt__btnContainer">
<a href="javascript:void(0);" class="btn Att-check full" id="check-attendance"><i class="ico_check_white"></i>출석체크 하기</a>
</div>
<div class="eventAtt__btnContainer">
<a href="javascript:void(0);" class="btn outline full" id="check-notification"><i class="ico_alarm"></i>알림 신청</a>
</div>
</div>
<div class="eventAtt-banner">
<a href="<c:out value="${screenInfo.scrRwdLinkUrl}"/>">
<img src="<c:out value="${cdnurl}${screenInfo.scrRwdImg}"/>"
onerror="this.src='/pc/images/image_placeholder.png'"
alt="100% 출석 시 추첨하여 선물로 드립니다. 뉴트리코어 발효녹용침향환 제품보러가기">
</a>
</div>
<div class="comment-box">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">이벤트 설명</p>
<p style="color:rgba(0,0,0,0.6); font-size:14px;">
<c:out value="${screenInfo.bnfWordsCn}" escapeXml="false" />
</p>
</div>
</div>
</div>
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- Attendance Modals -->
<div class="microModal microAlert" id="modal-1" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">출석체크 완료</h2>
</div>
<div class="microModal__content">
<i class="modal-icon-mile">마일리지</i>
<p class="sub_tit">마일리지 10원 적립되었습니다.</p>
<p>내일 또 만나요~</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<div class="microModal microAlert" id="modal-2" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">누적 10회 출석완료</h2>
</div>
<div class="microModal__content">
<i class="modal-icon-coupon">쿠폰</i>
<p class="sub_tit" data-default-text="쿠폰이 발급되었습니다.">쿠폰이 발급되었습니다.</p>
<p>누적 20회 출석까지 화이팅~</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<div class="microModal microAlert" id="modal-3" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">누적 20회 출석완료</h2>
</div>
<div class="microModal__content">
<i class="modal-icon-coupon">쿠폰</i>
<p class="sub_tit" data-default-text="쿠폰이 발급되었습니다.">쿠폰이 발급되었습니다.</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<div class="microModal microAlert" id="modal-4" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">축하합니다!<br>100% 출석하셨어요.</h2>
</div>
<div class="microModal__content">
<i class="modal-icon-mile">마일리지</i>
<i class="modal-icon-present">선물</i>
<p class="sub_tit" data-default-text="축하마일리지 적립완료\n특별경품 자동응모 완료">축하마일리지 적립완료<br>특별경품 자동응모 완료</p>
<p>100% 출석 고객께만 드립니다.</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<div class="microModal microAlert" id="modal-already-checked" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">이미 출석체크하셨습니다</h2>
</div>
<div class="microModal__content">
<p>내일 다시 만나요~</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 알림용 새로운 모달 추가 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<script>
const screenInfo = {
representativeImagePath: "${fn:escapeXml(screenInfo.scrReprsntImg)}",
rewardImagePath: "${fn:escapeXml(screenInfo.scrRwdImg)}",
scrRwdLinkUrl: "${fn:escapeXml(screenInfo.scrRwdLinkUrl)}",
bnfInnb: "${fn:escapeXml(screenInfo.bnfInnb)}"
};
</script>
</body>
</html>

View File

@@ -0,0 +1,291 @@
<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%
java.util.Map<String, String> bnfDvCdToImageMap = new java.util.HashMap<>();
bnfDvCdToImageMap.put("010", "bnf_list_icon01.png"); // 출석체크
bnfDvCdToImageMap.put("020", "bnf_list_icon02.png"); // 만보기
bnfDvCdToImageMap.put("030", "bnf_list_icon03.png"); // 행운복권
bnfDvCdToImageMap.put("040", "bnf_list_icon04.png"); // 룰렛게임
bnfDvCdToImageMap.put("050", "bnf_list_icon05.png"); // 캡슐만들기
bnfDvCdToImageMap.put("060", "bnf_list_icon06.png"); // 이벤트보기
bnfDvCdToImageMap.put("070", "bnf_list_icon07.png"); // 라이브쇼핑 참여
bnfDvCdToImageMap.put("080", "bnf_list_icon08.png"); // 할인소식 공유
bnfDvCdToImageMap.put("090", "bnf_list_icon09.png"); // 베스트 리뷰보기
bnfDvCdToImageMap.put("100", "bnf_list_icon10.png"); // 섭취챌린지
bnfDvCdToImageMap.put("120", "bnf_list_icon11.png"); // 관심건강분야 설정
bnfDvCdToImageMap.put("130", "bnf_list_icon12.png"); // OX퀴즈
bnfDvCdToImageMap.put("140", "bnf_list_icon13.png"); // 구매스탬프
bnfDvCdToImageMap.put("150", "bnf_list_icon14.png"); // QR코드 혜택
pageContext.setAttribute("bnfDvCdToImageMap", bnfDvCdToImageMap);
%>
<%
java.util.Map<String, String> bnftUrlMap = new java.util.HashMap<>();
bnftUrlMap.put("010", "attendanceCheckMain");
bnftUrlMap.put("020", "stepcntMain");
bnftUrlMap.put("030", "lucklottMain");
bnftUrlMap.put("040", "rougameMain");
bnftUrlMap.put("050", "selectCapsule");
bnftUrlMap.put("060", "evntviewMain");
bnftUrlMap.put("070", "lvshopMain");
bnftUrlMap.put("080", "discsharMain");
bnftUrlMap.put("090", "conrevMain");
bnftUrlMap.put("100", "intakchlMain");
bnftUrlMap.put("120", "hlthsetMain");
bnftUrlMap.put("130", "oxquizMain");
bnftUrlMap.put("140", "purstmpMain");
bnftUrlMap.put("150", "qrevntMain");
pageContext.setAttribute("bnftUrlMap", bnftUrlMap);
%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<script src="<%= request.getContextPath() %>/mobile/js/bnft/bnftMain/BnftMain.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("혜택");
// 뒤로가기 버튼 숨기기
$(".header__toBack__btn").hide();
// 헤더 버튼 영역 초기화
$(".header__btn-container").empty();
// QR 이벤트 테스트 버튼 클릭 이벤트 추가
// $('#spanQrEventTest').on('click', function() {
// // callback_link 함수에서 요구하는 데이터 형식으로 변경
// // data 파라미터는 'bnfDvCd|strInnb' 형식의 문자열이어야 함
// callback_link('NC', 'reward', '150|2');
// });
// [임시] 웹-앱 연동 테스트
$('#spanMbrDvcInfo').on('click', function() {
sessionStorage.removeItem("sessDvcId");
sessionStorage.removeItem("sessMbrId");
fn_save_mbrdvc_info(true);
});
$('#spanPushSend').on('click', function() {
fn_push_send();
});
});
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<!-- 배너 영역 - 배너가 있을 경우에만 표시 -->
<c:if test="${not empty bnftMain.bannerList}">
<div class="benefit_main_bannerWrap">
<div class="benefit_main_banner">
<c:forEach items="${bnftMain.bannerList}" var="banner">
<div class="benefit_bn">
<a href="${banner.linkUrl}">
<img src="${cdnurl}${banner.imgFilCours}" alt="${banner.bannerSj}">
</a>
</div>
</c:forEach>
</div>
<div class="pagination">
<!-- 페이지네이션 버튼은 JS에서 동적으로 추가됨 -->
</div>
</div>
</c:if>
<div class="benefit_main">
<h2 class="bnf_title">참여할때마다 마일리지, 쿠폰이!</h2>
<div class="benefitCategory">
<ul class="benefitCategory_list item_li">
<c:forEach items="${bnftMain.mainList}" var="menu">
<c:if test="${menu.bnfDvCd ne '080'}">
<li>
<a href="javascript:void(0);" class="bnft-menu-item"
data-bnf-dv-cd="${menu.bnfDvCd}"
data-bnf-url="<c:url value='/sopmal/bnft/${bnftUrlMap[menu.bnfDvCd]}'/>"
data-aval-at="${menu.avalAt}"
data-ntk-chl-at="${menu.ntkChlAt}"
data-ntk-bnf-innb="${menu.ntkBnfInnb}"
data-cpsl-progrs-at="${menu.cpslProgrsAt}"
data-cpsl-bnf-innb="${menu.cpslBnfInnb}"
data-intrst-aval-at="${menu.intrstAvalAt}">
<div class="img">
<img src="<c:url value='/mobile/images/bnft/${bnfDvCdToImageMap[menu.bnfDvCd]}'/>" alt="">
</div>
<!-- 라이브쇼핑 이벤트이고 현재 방송중이면 라이브 아이콘 표시 -->
<c:if test="${menu.bnfDvCd eq '070' and bnftMain.currentLiveShopping.isLiveOnAir eq 'Y'}">
<div class="live" style="display:block;">
<img src="<c:url value='/mobile/images/bnft/bnf_list_icon_live.png'/>" alt="방송중">
</div>
</c:if>
<div class="txt">
<p class="tit1">
${menu.menuSj1}
<!-- 룰렛게임이 아닌 경우에만 인라인 횟수 표시 (기존 방식 유지) -->
<c:if test="${menu.bnfDvCd ne '040'}">
<!-- 다른 게임들의 횟수 표시가 있다면 여기에 추가 -->
</c:if>
</p>
<p class="tit2">${menu.menuSj2}</p>
</div>
<!-- 룰렛게임인 경우: 기존 roulette-count 스타일을 참여완료 위치에 표시 -->
<c:if test="${menu.bnfDvCd eq '040'}">
<span class="roulette-count" style="position: absolute; right: 16px; top: 16px; display: inline-block; margin-left: 0; background: #ff6b6b; color: white; padding: 2px 6px; border-radius: 10px; font-size: 11px; font-weight: bold; vertical-align: middle; z-index: 2;">
<c:choose>
<c:when test="${empty menu.rouletteRemainingCnt}">0회</c:when>
<c:otherwise>${menu.rouletteRemainingCnt}회</c:otherwise>
</c:choose>
</span>
</c:if>
<!-- 룰렛게임이 아닌 경우에만 참여 완료 라벨 표시 -->
<c:if test="${menu.bnfDvCd ne '040'}">
<c:forEach items="${bnftMain.participatedEvents}" var="participated">
<c:if test="${participated.bnfDvCd eq menu.bnfDvCd}">
<label class="check_done">참여완료</label>
<c:set var="isParticipated" value="true"/>
</c:if>
</c:forEach>
</c:if>
<!-- 새로운 이벤트인지 확인 -->
<c:forEach items="${bnftMain.newEvents}" var="newEvent">
<c:if test="${newEvent.bnfDvCd eq menu.bnfDvCd}">
<label class="check_new">N</label>
<c:set var="isNew" value="true"/>
</c:if>
</c:forEach>
</a>
</li>
</c:if>
</c:forEach>
<!--
<li class="benefit-item" style="opacity: 0; transform: translateY(20px);">
<a href="#" onclick="return false;">
<div id="spanPushSend" class="txt">
<p class="tit1">* 푸시전송 테스트</p>
</div>
</a>
</li>
<li class="benefit-item" style="opacity: 0; transform: translateY(20px);">
<a href="#" onclick="return false;">
<div id="spanMbrDvcInfo" class="txt">
<p class="tit1">* 디바이스-회원 정보 등록 테스트</p>
</div>
</a>
</li>
-->
<!-- <li class="benefit-item" style="opacity: 0; transform: translateY(20px);">
<a href="#" onclick="return false;">
<div id="spanQrEventTest" class="txt">
<p class="tit1">* QR 이벤트 테스트</p>
</div>
</a>
</li> -->
</ul>
</div><!--//benefitCategory-->
<input type="hidden" id="mbrMarktAgreeAt" value="${bnftMain.mbrMarktAgreeAt.marktRecptnAgreAt}">
<input type="hidden" id="needDeviceIdCheck" value="${needDeviceIdCheck}">
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</div>
</main>
</div>
</div>
<%-- 만보기 권한 필요 모달 --%>
<div class="microModal microAlert" id="modal-stepcnt-permission" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p>만보기 혜택에 참여하시려면<br>신체 활동 권한이 필요합니다.</p>
<br>
<p>[설정] > [앱 정보] > [권한]에서<br>${pageContext.session.getAttribute('sopmalCd') eq 'NC' ? '뉴트리코어' : '닥터린'} 앱의 신체 활동 권한을<br>허용해주세요.</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<%-- 혜택 사용 가능 여부 모달 --%>
<div class="microModal microAlert" id="modal-bnft-unavailable" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p>현재 이용할 수 없는 혜택입니다.</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<%-- 행운복권 참여완료 모달 --%>
<div class="microModal microAlert" id="modal-lucky-participated" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p>오늘 행욱복권에 이미 참여하셨습니다.</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<%-- OX 퀴즈 참여완료 모달--%>
<div class="microModal microAlert" id="modal-oxquiz-participated" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p>오늘 OX 퀴즈에 이미 참여하셨습니다.</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,48 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!-- 푸터 -->
<footer class="footer">
<ul class="footer__first">
<li><a href="">이용약관</a></li>
<li><a href="">개인정보처리방침</a></li>
<li><a href="">공동구매·특판·수출 문의</a></li>
</ul>
<div class="footer__second">
<button class="footer__second__detailBtn">사업자 정보 확인</button>
<select class="family-site-link" title="해당 셀렉트에 대한 설명">
<option value="" disabled selected>FAMILY SITE</option>
<option value="https://nutricore.co.kr/">뉴트리코어</option>
<option value="https://www.chamdahan.com/">참다한홍삼</option>
<option value="https://pros-lab.com/">프로스랩</option>
<option value="https://naturalbottle.co.kr/">자연담은 유리병</option>
<option value="https://thezac.co.kr/">더작</option>
<option value="https://doctorlean.co.kr/">닥터린</option>
<option value="http://www.naver.com">라이프케어</option>
<option value="http://www.naver.com">바디닥터스</option>
<option value="http://www.naver.com">디디오랩</option>
<option value="http://www.naver.com">저스트마이데이</option>
<option value="http://www.naver.com">올프리</option>
</select>
</div>
<div class="footerHide">
<ul class="footer__third">
<li><span class="footer__third__th">사업자명</span><span class="footer__third__td">(주) 디사이드컴즈</span></li>
<li><span class="footer__third__th">대표자</span><span class="footer__third__td">임승희</span></li>
<li><span class="footer__third__th">주소</span><span class="footer__third__td">서울특별시 금천구 가산디지털 1로 171, 305-323호 (가산동, 에스케이브이원센터)</span></li>
<li><span class="footer__third__th">전화번호</span><span class="footer__third__td">1600-8182</span></li>
<li><span class="footer__third__th">이메일</span><span class="footer__third__td">custom@d-sidecomz.com</span></li>
<li><span class="footer__third__th">사업자 등록번호</span><span class="footer__third__td">445-88-02140</span>
<a href="" class="footer__underLine">사업자정보확인</a>
</li>
<li><span class="footer__third__th">개인정보관리책임자</span><span class="footer__third__td">신영일</span></li>
</ul>
<div class="footer__logo">
<img src="<%= request.getContextPath() %>/static/mobile/images/icon_footer-logo.png" alt="" loading="lazy">
</div>
<p class="footer__description">(주) 디사이드컴즈는 통신판매중계자이며, 통신판매의 당사자가 아닙니다. 상품 및 거래와 관련한 의무와 책임은 판매자에게 있습니다.</p>
<ul class="footer__sellerLink">
<li><a href="" class="footer__underLine">판매자 정보</a></li>
<li><a href="" class="footer__underLine">판매자 개인정보 처리방침</a></li>
</ul>
</div>
<p class="footer__copyright">ⓒD-SIDE COMZ CO.,LTD.All rights reserved.</p>
</footer>

View File

@@ -0,0 +1,44 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<meta charset="UTF-8">
<!-- M자형 디스플레이 위해 "viewport-fit=cover" 속성 필요 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, viewport-fit=cover">
<title>${param.pageTitle}</title>
<!-- 모든 사이트 공통 -->
<link rel="stylesheet" href="<c:url value='/mobile/css/default.css'/>">
<!-- 이벤트앱 추가 encomms -->
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 각 사이트별 색상, 이미지 -->
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/theme.css'/>">
<!-- jquery -->
<script src="<%= request.getContextPath() %>/mobile/vendor/jquery-3.7.1.min.js"></script>
<!-- 슬라이드 -->
<link rel="stylesheet" href="<c:url value='/mobile/vendor/swiper/swiper-bundle.min.css'/>">
<script src="<%= request.getContextPath() %>/mobile/vendor/swiper/swiper-bundle.min.js" defer></script>
<!-- 커스텀 셀렉트 박스 -->
<script src="<%= request.getContextPath() %>/mobile/vendor/jquery-nice-select/jquery.nice-select.min.js" defer></script>
<link rel="stylesheet" href="<c:url value='/mobile/vendor/jquery-nice-select/nice-select.css'/>">
<!-- Dropzone -->
<script src="<%= request.getContextPath() %>/mobile/vendor/dropzone/dropzone.min.js" defer></script>
<link rel="stylesheet" href="<c:url value='/mobile/vendor/dropzone/dropzone.min.css'/>">
<!-- 스크립트 -->
<script src="<%= request.getContextPath() %>/mobile/js/script.js" defer></script>
<script src="<%= request.getContextPath() %>/mobile/js/bottom-sheet.js" defer></script>
<!-- Date Picker -->
<link rel="stylesheet" href="<c:url value='/mobile/vendor/jquery-ui/jquery-ui.min.css'/>">
<link rel="stylesheet" href="<c:url value='/mobile/vendor/jquery-ui/jquery-ui.structure.css'/>">
<script src="<%= request.getContextPath() %>/mobile/vendor/jquery-ui/jquery-ui.min.js" defer></script>
<!-- micromodal -->
<!-- https://github.com/Ghosh/micromodal -->
<script src="<%= request.getContextPath() %>/mobile/vendor/micromodal/micromodal.min.js" defer></script>

View File

@@ -0,0 +1,41 @@
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!-- 헤더 영역 -->
<header class="header header--sub">
<div class="header__wrapper">
<div class="header__controls-wrapper">
<div class="header__controls">
<div class="header__toBack">
<c:if test="${param.showBackButton eq 'true'}">
<button class="header__toBack__btn" onclick="history.back();">
<span class="visually-hidden">뒤로가기</span>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<path fill="#1A1A1A" d="M16.598 3.338a.75.75 0 0 0-1.061 0l-8.132 8.131a.75.75 0 0 0 0 1.061l8.132 8.132a.75.75 0 0 0 1.06-1.06L8.998 12l7.6-7.602a.75.75 0 0 0 0-1.06Z"></path>
</svg>
</button>
</c:if>
</div>
<!-- 파라미터로 받은 타이틀 표시 -->
<h1 class="header__title">${param.pageTitle}</h1>
<!-- 파라미터로 받은 버튼 컨테이너 표시 -->
<c:if test="${not empty param.showButtons and param.showButtons == 'true'}">
<div class="header__btn-container">
<button id="statsButton" class="header__btn"><i class="icon icon_nav-calendar"></i><span class="visually-hidden">섭취챌린지 월별 통계보기</span></button>
<button id="settingsButton" class="header__btn"><i class="icon icon_nav-set"></i><span class="visually-hidden">설정</span></button>
</div>
</c:if>
<!-- 파라미터로 받은 값에 따라 창닫기 버튼을 표시 -->
<c:if test="${param.showCloseButton == 'true'}">
<div class="header__btn-container">
<button class="header__toBack__btn">
<span class="visually-hidden">창닫기</span>
<i class="icon icon_nav-close"></i>
</button>
</div>
</c:if>
</div>
</div>
</div>
</header>

View File

@@ -0,0 +1,32 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!-- 하단 탭바 -->
<aside class="tab-bar">
<nav class="tab-bar__nav">
<a class="tab-bar__link" href="https://www.naver.com">
<i class="icon icon_tab-bar-category"></i>
카테고리</a>
<a class="tab-bar__link" href="#">
<i class="icon icon_tab-bar-wishlist"></i>
위시리스트</a>
<div class="tab-bar__home-wrapper">
<div class="tab-bar__home">
<a href="" class="hide-text">
<i class="icon icon_tab-bar-home"></i>
<span class="visually-hidden">홈</span>
</a>
</div>
</div>
<a class="tab-bar__link" href="#">
<i class="icon icon_tab-bar-cart"></i>
장바구니</a>
<a class="tab-bar__link active" href="#">
<i class="icon icon_tab-bar-mypage"></i>
마이페이지
</a>
</nav>
<div class="tab-bar__bg">
<div class="tab-bar__bg-fraction"></div>
</div>
</aside>

View File

@@ -0,0 +1,8 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>

View File

@@ -0,0 +1,150 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : Conrev.jsp
Description : 리뷰보기
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-06-10 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/conrev/Conrev.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("베스트리뷰 보기");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button id="statsButton" class="header__btn"><i class="icon icon_nav-home"></i><span class="visually-hidden">메인으로</span></button>
`);
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
// 메인으로 이동
$("#statsButton").on('click', function() {
window.location.href = "<c:url value='/'/>";
});
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="bestReviewWrap">
<div class="brTop">
<p class="tit">생생해서<br>더 좋은 후기</p>
<p class="txt">제품 선택에 설명 보다 더 와닿는<br>최고의 리뷰를 만나보세요.</p>
</div>
<div class="revieBox">
<div class="reviewSlider">
<ul>
<c:forEach var="review" items="${reviewList.result}" varStatus="status">
<li data-link="${review.linkUrl}">
<div class="reviewTit"><b>${review.mbrNm}</b>님의 리뷰입니다.</div>
<div class="reviewProduct">
<p class="thum">
<img src="<c:out value="${cdnurl}${review.imgFilCours}"/>"
onerror="this.src='/mobile/images/image_placeholder.png'"
alt="썸네일">
</p>
<p class="tit">${review.cnSj}</p>
</div>
<div class="reviewText">
${review.wordsCn}
</div>
</li>
</c:forEach>
</ul>
</div>
<div class="pagination"></div>
</div>
</div>
<div class="review-bottom-fixed">
<div class="topupPoint noSticky">
<span>다른리뷰 더 보면 <i class="ico_mile"></i><b id="rewardAmount">0원</b>적립</span>
</div>
<div class="bottomBtnControls">
<button id="reviewButton" class="btn lg full theme">리뷰 보러가기</button>
</div>
</div>
<div class="comment-box">
${reviewList.guidance.guidance.wordsCn2}
</div>
</div>
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 알림용 새로운 모달 추가 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<input type="hidden" id="reviewDataInput" value='[
<c:forEach var="review" items="${reviewList.result}" varStatus="status">
{
"bnfInnb": "<c:out value="${review.bnfInnb}" escapeXml="false"/>",
"linkUrl": "<c:out value="${review.linkUrl}" escapeXml="false"/>",
"tmeSecnd": <c:out value="${review.tmeSecnd}" default="0"/>,
"imgFilCours": "<c:out value="${review.imgFilCours}" escapeXml="false"/>",
"imgFilNm": "<c:out value="${review.imgFilNm}" escapeXml="false"/>"
}<c:if test="${!status.last}">,</c:if>
</c:forEach>
]'>
</div>
</body>
</html>

View File

@@ -0,0 +1,157 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%
// 혜택 구분 코드에 따른 이미지 매핑
java.util.Map<String, String> bnfDvCdToImageMap = new java.util.HashMap<>();
bnfDvCdToImageMap.put("010", "bnf_list_icon01.png"); // 출석체크
bnfDvCdToImageMap.put("020", "bnf_list_icon02.png"); // 만보기
bnfDvCdToImageMap.put("030", "bnf_list_icon03.png"); // 행운복권
bnfDvCdToImageMap.put("040", "bnf_list_icon04.png"); // 룰렛게임
bnfDvCdToImageMap.put("050", "bnf_list_icon05.png"); // 캡슐만들기
bnfDvCdToImageMap.put("060", "bnf_list_icon06.png"); // 이벤트보기
bnfDvCdToImageMap.put("070", "bnf_list_icon07.png"); // 라이브쇼핑 참여
bnfDvCdToImageMap.put("080", "bnf_list_icon08.png"); // 할인소식 공유
bnfDvCdToImageMap.put("090", "bnf_list_icon09.png"); // 베스트 리뷰보기
bnfDvCdToImageMap.put("100", "bnf_list_icon10.png"); // 섭취챌린지
bnfDvCdToImageMap.put("120", "bnf_list_icon11.png"); // 관심건강분야 설정
bnfDvCdToImageMap.put("130", "bnf_list_icon12.png"); // OX퀴즈
bnfDvCdToImageMap.put("140", "bnf_list_icon13.png"); // 구매스탬프
bnfDvCdToImageMap.put("150", "bnf_list_icon14.png"); // QR코드 혜택
pageContext.setAttribute("bnfDvCdToImageMap", bnfDvCdToImageMap);
%>
<%--
Class Name : CpslmknCollectList.jsp
Description : 캡슐 만들기 리스트
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-09-06 노태운 최초 생성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/cpslmkn/CpslmknCollectList.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("캡슐만들기 리스트");
// 헤더 버튼 영역 초기화
$(".header__btn-container").empty();
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<!-- 내용 -->
<div class="capsuleCollectWrap">
<div class="capsuleCollectTop">
<h2 class="main-tit">오늘의 스페셜</h2>
<span class="sub-tit">${sopmalCd.sopmalCd eq 'NC' ? '초록잎을 더 많이' : '도토리를 더 많이'}!</span>
<div class="specialEventSlider">
<c:forEach var="event" items="${cpslmknCollectList.leafEventList}" varStatus="status">
<c:if test="${event.specialAt eq 'Y'}">
<div class="innerIcon" style="${status.index == 0 ? '' : 'display: none;'}">
<p class="img">
<img src="<c:url value='/mobile/images/bnft/${bnfDvCdToImageMap[event.bnfDvCd]}'/>"
onerror="this.src='/pc/images/image_placeholder.png'"
alt="${event.bnfSj}">
</p>
<p class="txt1">${event.bnfSj}</p>
<p class="txt2"><b>${event.pymntCnt}개의 ${sopmalCd.sopmalCd eq 'NC' ? '초록잎을' : '도토리를'}</b> 드려요.</p>
</div>
</c:if>
</c:forEach>
</div>
<div class="nowCoinCnt">현재보유 <i class="icon"></i> ${cpslmknCollectList.ownedLeafCount}개</div>
<div class="pagination">
<!-- Pagination buttons will be added here dynamically -->
</div>
</div>
<div class="capsuleCollectListWrap">
<h2 class="bnf_title">모두 참여하면 ${sopmalCd.sopmalCd eq 'NC' ? '초록잎' : '도토리'} <b>${cpslmknCollectList.totalLeafCnt}</b>개!!</h2>
<ul class="capsuleCollectList">
<c:forEach var="event" items="${cpslmknCollectList.leafEventList}">
<li>
<div class="img">
<img src="<c:url value='/mobile/images/bnft/${bnfDvCdToImageMap[event.bnfDvCd]}'/>"
onerror="this.src='/pc/images/image_placeholder.png'"
alt="${event.bnfSj}">
</div>
<div class="txt">
<p class="tit">${event.bnfSj}</p>
<p class="leaf">
${event.pymntCnt}
<i class="icon"></i>
${sopmalCd.sopmalCd eq 'NC' ? '초록잎' : '도토리'}
</p>
</div>
<c:if test="${event.specialAt eq 'Y'}">
<span class="specialBadge">
<img src="<c:url value='/mobile/images/bnft/bnf_special.png'/>"
alt="스페셜"
style="width: 40x; height: 40px; position: absolute; top: 5px; right: 5px;">
</span>
</c:if>
</li>
</c:forEach>
</ul>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 알림용 새로운 모달 추가 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,29 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!-- 얼러트 창 -->
<div class="microModal microAlert" id="modal-1" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
<b>초임계 식물성 알티지 오메가3</b><br>제품을 선택하셨네요.
</h2>
</div>
<div class="microModal__content">
<p>
${sessionScope.sopmalCd eq 'NC' ? '뉴트리캡슐' : '닥터린캡슐'}을 완성할 때까지<br>선택하신 선물은 변경할 수 없습니다.<br>그대로 시작할까요?
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn" data-micromodal-close="" aria-label="창 닫기">아니오</button>
<button class="microModal__btn microModal__btn-primary">예</button>
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,116 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<script src="<%= request.getContextPath() %>/mobile/js/bnft/cpslmkn/CpslmknCreateGameModal.js" defer></script>
<!-- 고정형 바텀시트 -->
<div class="microModal microBottomSheet" id="modal-1" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true" style="min-height:95vh;">
<div class="microModal__body">
<div class="microModal__top">
<button class="microModal__close2 right" aria-label="창 닫기" data-micromodal-close=""></button>
</div>
<div class="microModal__content mh90svh"><!--최대높이값지정 mh90svh-->
<div class="gameStatus">
<c:choose>
<c:when test="${not empty progressInfo && progressInfo.progrsStep < 5}">
<%-- 진행중인 경우 --%>
<p class="tit">${sopmalCd eq 'NC' ? '뉴트리' : '닥터린'} 캡슐 만들기<br>
<b>${progressInfo.progrsStep}단계</b> 진행중!!</p>
<div class="gameStatusBarWrap">
<div class="gameStatusBar">
<%-- 진행률 계산 및 적용 --%>
<c:set var="progressPercent" value="${(progressInfo.totUseLeafCnt / progressInfo.requiredLeaf) * 100}" />
<div class="per" style="width:${progressPercent}%;"></div>
<span class="first">시작</span>
<c:forEach var="i" begin="1" end="4">
<span class="step0${i} ${progressInfo.progrsStep >= i ? 'on' : ''}">
${i}단계
</span>
</c:forEach>
<span class="last ${progressInfo.progrsStep >= 5 ? 'on' : ''}">5단계</span>
</div>
</div>
<%-- 진행 중일 때는 선물 정보만 표시 --%>
<div class="gameGift">
<p class="tit">${sopmalCd eq 'NC' ? '뉴트리' : '닥터린'} 캡슐을 완성하면 받는 선물이예요.</p>
<div class="gameGiftInbox">
<p class="img"><img src="${cdnurl}${thumbnailPath}" alt="상품 이미지"></p>
<div class="txt">
<p class="txt1">${productDesc}</p>
<p class="txt2">${productName}</p>
</div>
</div>
<div class="alignR">
<a href="#" class="btn giftReset" data-micromodal-trigger="modal-2">
<i class="ico_giftReset"></i>다른선물로 다시 시작
</a>
</div>
</div>
</c:when>
<c:otherwise>
<%-- 완료된 경우 --%>
<div class="completion-animation">
<div class="fireworks"></div>
<div class="confetti"></div>
</div>
<p class="tit">${sopmalCd eq 'NC' ? '뉴트리' : '닥터린'} 캡슐 만들기 최종 완료!</p>
<p class="tit2">진짜 영양제 선물받고<br>새로운 캡슐 만들기 시작하세요.</p>
<div class="gameStatusBarWrap">
<div class="gameStatusBar">
<%-- 진행률 계산 및 적용 --%>
<c:set var="progressPercent" value="${(progressInfo.totUseLeafCnt / progressInfo.requiredLeaf) * 100}" />
<div class="per" style="width:${progressPercent}%;"></div>
<span class="first">시작</span>
<c:forEach var="i" begin="1" end="4">
<span class="step0${i} ${progressInfo.progrsStep >= i ? 'on' : ''}">
${i}단계
</span>
</c:forEach>
<span class="last ${progressInfo.progrsStep >= 5 ? 'on' : ''}">5단계</span>
</div>
</div>
<%-- 완료 시에만 쿠폰 정보와 새로 시작하기 버튼 표시 --%>
<c:if test="${progressInfo.progrsStep >= 5}">
<div class="gameCoupon">
<p class="tit">
<a href="javascript:goToCouponPage()"><i class="ico_present"></i>쿠폰함에 교환권이 전달되었습니다.</a>
</p>
<div class="gameCouponInbox">
<div class="barcode">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/ico_barcode.svg" width="80" height="80" alt="바코드">
</div>
<p class="img"><img src="${cdnurl}${thumbnailPath}" alt="상품 이미지"></p>
<div class="txt">
<p class="txt1">${productName}</p>
<p class="txt2">${productDesc}</p>
</div>
</div>
</div>
<%-- 새로 시작하기 버튼 추가 --%>
<div class="btnBox alignC" style="margin-top: 20px;">
<button type="button" class="btn lg theme newStartButton" onclick="startNewCapsule()">
새로운 캡슐 만들기 시작하기
</button>
</div>
</c:if>
</c:otherwise>
</c:choose>
<!-- comment-box 부분 제거 - JavaScript에서 동적으로 처리 -->
</div>
</div>
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,221 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : CpslmknCreateGame.jsp
Description : 캡슐 만들기 게임
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-09-06 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<script src="<%= request.getContextPath() %>/mobile/js/bnft/cpslmkn/CpslmknCreateGame.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("캡슐만들기");
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
<meta name="contextPath" content="${pageContext.request.contextPath}">
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- JSP 변수 설정 -->
<c:set var="sopmalCd" value="${sopmalCd.sopmalCd}" />
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<!-- hidden inputs -->
<input type="hidden" id="bnfInnb" value="${bnfInnb}">
<input type="hidden" id="bnfSttusInnb" value="${bnfSttusInnb}">
<input type="hidden" id="productName" value="${productName}">
<input type="hidden" id="productDesc" value="${productDesc}">
<input type="hidden" id="thumbnailPath" value="${cdnurl}${thumbnailPath}">
<input type="hidden" id="importantNotice" value="${importantNotice}">
<input type="hidden" id="progressPercent" value="${progressPercent}">
<input type="hidden" id="sopmalCd" value="${sopmalCd}">
<input type="hidden" id="cdnurl" value="${cdnurl}">
<!-- 추가: 게임 상태 관련 hidden 필드들 -->
<input type="hidden" id="leafCount" value="${leafCount}">
<input type="hidden" id="progressStep" value="${progressStep}">
<input type="hidden" id="stepProgressPercentage" value="${stepProgressPercentage}">
<input type="hidden" id="currentStep" value="${currentStep}">
<input type="hidden" id="leafInCurrentStep" value="${leafInCurrentStep}">
<input type="hidden" id="totalLeafNeeded" value="${totalLeafNeeded}">
<input type="hidden" id="leafPerStep" value="${leafPerStep}">
<div class="ncGameWrap">
<div class="ncGameTop">
<p>${sopmalCd eq 'NC' ? '뉴트리캡슐 만드는중...' : '닥터린캡슐 만드는중...'}</p>
<span>${sopmalCd eq 'NC' ? '초록잎으' : '도토리'}로 7개의 유리병을 모두 채워 주세요.</span>
</div>
<div class="ncGameBody">
<div class="bubble-container" id="bubbleContainer"></div>
<div class="flask-container">
<div class="flask1">
<div class="svgContainer">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask1-1.svg" alt="SVG1-1">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask1-2.svg" alt="SVG1-2">
</div>
</div>
<div class="flask2">
<div class="svgContainer">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask2-1.svg" alt="SVG2-1">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask2-2.svg" alt="SVG2-2">
</div>
</div>
<div class="flask3">
<div class="svgContainer">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask3-1.svg" alt="SVG3-1">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask3-2.svg" alt="SVG3-2">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask3-3.svg" alt="SVG3-3">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask3-4.svg" alt="SVG3-4">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask3-5.svg" alt="SVG3-5">
</div>
</div>
<div class="flask4">
<div class="svgContainer">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask4-1.svg" alt="SVG4-1">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask4-2.svg" alt="SVG4-2">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask4-3.svg" alt="SVG4-3">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask4-4.svg" alt="SVG4-4">
</div>
</div>
<div class="flask5">
<div class="svgContainer">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask5-1.svg" alt="SVG5-1">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask5-2.svg" alt="SVG5-2">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask5-3.svg" alt="SVG5-3">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/flask5-4.svg" alt="SVG5-4">
</div>
</div>
<div class="line1">
<div class="svgContainer">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line1-1.svg" alt="SVG6-1">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line1-2.svg" alt="SVG6-2">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line1-3.svg" alt="SVG6-3">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line1-4.svg" alt="SVG6-4">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line1-5.svg" alt="SVG6-5">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line1-6.svg" alt="SVG6-6">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line1-7.svg" alt="SVG6-7">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line1-8.svg" alt="SVG6-8">
</div>
</div>
<div class="line2">
<div class="svgContainer">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line2-1.svg" alt="SVG7-1">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line2-2.svg" alt="SVG7-2">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line2-3.svg" alt="SVG7-3">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line2-4.svg" alt="SVG7-4">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line2-5.svg" alt="SVG7-5">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line2-6.svg" alt="SVG7-6">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line2-7.svg" alt="SVG7-7">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line2-8.svg" alt="SVG7-8">
</div>
</div>
<div class="line3">
<div class="svgContainer">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line3-1.svg" alt="SVG8-1">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line3-2.svg" alt="SVG8-2">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line3-3.svg" alt="SVG8-3">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line3-4.svg" alt="SVG8-4">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line3-5.svg" alt="SVG8-5">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line3-6.svg" alt="SVG8-6">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line3-7.svg" alt="SVG8-7">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line3-8.svg" alt="SVG8-8">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line3-9.svg" alt="SVG8-9">
<img src="<%= request.getContextPath() %>/mobile/images/bnft/line3-10.svg" alt="SVG8-10">
</div>
</div>
</div><!--flask-container-->
<div class="bar-container flask0${progressStep}">
<div class="percentage-bar" style="width:${stepProgressPercentage}%"></div>
<div class="per-flask"><span>${progressStep}단계</span></div>
<p class="per-txt"><fmt:formatNumber value="${stepProgressPercentage}" type="number" maxFractionDigits="0"/>% 채웠어요.</p>
</div>
</div>
<div class="bottomFixed">
<div class="bottomBtnControls">
<button class="btn lg full theme" id="cntGameItem">${sopmalCd eq 'NC' ? '초록잎' : '도토리'} 넣기</button>
</div>
<div class="bottomBtnControls beetween">
<button class="btn sm outline theme2 inline-block">
<i class="${sopmalCd eq 'NC' ? 'ico_leaf' : 'ico_acorn'}"></i>${sopmalCd eq 'NC' ? '초록잎' : '도토리'} 모으기
</button>
<div class="leaf_cnt" id="ContingItem">
<i class="${sopmalCd eq 'NC' ? 'ico_leaf' : 'ico_acorn'}"></i>${leafCount}개
</div>
</div>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 알림용 새로운 모달 가 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 모달 include -->
<jsp:include page="CpslmknCreateGameModal.jsp" />
<jsp:include page="CpslmknCreateCompleteModal.jsp" />
<!-- 토스트 팝업 -->
<div id="acorn_toast" class="toastPop">${sopmalCd eq 'NC' ? '초록잎이' : '도토리가'} 부족합니다.</div>
<!-- 스크립트 설정 -->
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.uploaddirs.web')" var="uploaddirs"/>
</body>
</html>

View File

@@ -0,0 +1,26 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!-- 단계별 완성 안내 모달 -->
<div class="microModal microAlert" id="modal-2" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
<span id="completionStepText">첫번째 유리병이 가득 찼어요!</span>
</h2>
</div>
<div class="microModal__content">
<div class="ico_flask flask01" id="completionFlask">첫번째 유리병</div>
<p>
나머지 <span id="remainingFlasks">4</span>개의 유리병도 빨리 채워보세요.
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,39 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!-- 얼러트 창 -->
<div class="microModal microAlert gameIntro is-open" id="modal-1" aria-hidden="false">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<div class="gameIntroPaging">
<h1 class="gameTop">진짜 영양제를 무료로 받는 방법</h1>
<div class="gameIntroWrap">
<h2 class="tit">1. ${sopmalCd eq 'NC' ? '초록잎을' : '도토리를'} 모아주세요.</h2>
<i class="ico_intro01">아이콘</i>
<p>혜택 메뉴의 다양한 이벤트에 참여하면<br>${sopmalCd eq 'NC' ? '뉴트리캡슐' : '닥터린캡슐'} 만들기에 필요한<br>${sopmalCd eq 'NC' ? '초록잎을' : '도토리를'} 드려요.</p>
</div>
<div class="gameIntroWrap">
<h2 class="tit">2. 유리병에 넣어주세요.</h2>
<i class="ico_intro02">아이콘</i>
<p>보유한 ${sopmalCd eq 'NC' ? '초록잎을' : '도토리를'}<br>실험실의 유리병에 넣어주세요.<br>모든 유리병이 가득 채워지면<br>${sopmalCd eq 'NC' ? '뉴트리캡슐' : '닥터린캡슐'}이 완성됩니다.</p>
</div>
<div class="gameIntroWrap">
<h2 class="tit">3. 진짜 영양제로 교환하세요.</h2>
<i class="ico_intro03">아이콘</i>
<p>${sopmalCd eq 'NC' ? '뉴트리캡슐' : '닥터린캡슐'}을 완성하면<br>진짜 영양제를 선물로 보내드려요.<br>그럼, 지금부터 시작해 볼까요?</p>
</div>
</div>
<div class="gamePaging"></div>
</div>
</div>
<div class="microModal__btnContainer">
<button class="btn lg theme" type="button" id="goCapsuleMaking">${sopmalCd eq 'NC' ? '뉴트리캡슐' : '닥터린캡슐'} 만들러 가볼까?</button>
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,97 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : CpslmknOwnedList.jsp
Description : 초록잎 보유내역
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-09-06 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/cpslmkn/CpslmknOwnedList.js" defer></script>
<script>
$(document).ready(function() {
const sopmalCd = $('#sopmalCd').val();
$(".header__title").text(sopmalCd == 'NC' ? '초록잎' + " 보유내역" : '도토리' + " 보유내역");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").empty();
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap pdb0">
<main class="main">
<div class="sub-page">
<div class="acornListTop">
<p class="acornAll"><i class="${sopmalCd eq 'NC' ? 'ico_leaf' : 'ico_acorn'}"></i><c:out value="${leafHistory.ownedLeafCount}" />개</p>
<p class="acornDay">최근 6개월 이내</p>
</div>
<div class="acornListWrap">
<ul class="acornList" id="leafHistoryList">
<c:forEach var="item" items="${leafHistory.history}" varStatus="status">
<li>
<span class="tit">
<c:out value="${item.eventName}" />
<c:if test="${item.actionType eq 'USE'}">
<i class="ico_flask01"></i>
</c:if>
</span>
<span class="dayTime">
<fmt:parseDate value="${item.actionDatetime}" pattern="yyyy-MM-dd HH:mm" var="parsedDate" type="both" />
<fmt:formatDate value="${parsedDate}" pattern="yy-MM-dd HH:mm" />
</span>
<span class="cnt ${item.leafCount < 0 ? 'minus' : ''}">
<c:choose>
<c:when test="${item.leafCount > 0}">+</c:when>
<c:when test="${item.leafCount < 0}">-</c:when>
</c:choose>
<c:out value="${fn:replace(fn:replace(item.leafCount, '-', ''), '.0', '')}" />
</span>
</li>
</c:forEach>
</ul>
<div id="loading" class="loading-container" style="display: none;">
<div class="loading-spinner"></div>
</div>
</div>
</div>
<input type="hidden" id="sopmalCd" value="${sopmalCd}">
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,196 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : CpslmknSelectCapsule.jsp
Description : 캡슐만들기
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-06-10 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/cpslmkn/Cpslmkn.js"></script>
<script>
$(document).ready(function() {
$(".header__title").text("캡슐만들기");
// 헤더 버튼 영역 초기화
$(".header__btn-container").empty();
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="gameListWrap">
<div class="gameListTop">
<c:set var="sopmalCd" value="${rewardInfo.sopmalCd}" />
<p class="txt1">${sopmalCd eq 'NC' ? '초록잎을' : '도토리를'} 모아<br>${sopmalCd eq 'NC' ? '뉴트리캡슐' : '닥터린캡슐'}을 만들면<br>진짜 영양제를 선물로 드려요.</p>
<p class="txt2">받고 싶은 제품을 하나 골라주세요.</p>
</div>
<input type="hidden" id="capsuleDataInput" value='${productList}'>
<div class="productSelectWrap">
<c:forEach var="product" items="${productList}" varStatus="status">
<div class="gameProduct">
<input type="radio" name="gameproduct" id="gameproduct${status.index + 1}" value="${product.bnfInnb}">
<label for="gameproduct${status.index + 1}">제품${status.index + 1}</label>
<div class="thum">
<img src="${cdnurl}${product.imgFilCours}" alt="썸네일"
onerror="this.src='/pc/images/image_placeholder.png'">
</div>
<div class="gpTit">
<p class="tit">${product.cnSj}</p>
<p class="leafCount">필요한 ${sopmalCd eq 'NC' ? '초록잎' : '도토리'} ${product.rwdCndCnt}개</p>
</div>
<button type="button" class="btn sm outline theme"
onclick="window.location.href='${product.linkUrl}'">제품보기</button>
</div>
</c:forEach>
</div>
<div class="bottomBtnControls">
<button class="btn lg theme" type="button">만들기 시작</button>
</div>
</div>
<div class="comment-box">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">꼭! 알아두세요.</p>
<div id="participationGuide">
<p>${importantNotice.notice1}</p>
</div>
</div>
<input type="hidden" id="sopmalCd" value="${sopmalCd}">
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</div>
</main>
</div>
</div>
<!-- 얼러트창 -->
<div class="microModal microAlert" id="modal-1" role="dialog" aria-modal="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
<b><span id="selectedProductName"></span></b><br>제품을 선택하셨네요.
</h2>
</div>
<div class="microModal__content">
<p>
${sopmalCd eq 'NC' ? '뉴트리캡슐' : '닥터린캡슐'}을 완성할 때까지<br>선택하신 선물은 변경할 수 없습니다.<br>그대로 시작할까요?
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn" data-micromodal-close="" aria-label="창 닫기">아니오</button>
<button class="microModal__btn microModal__btn-primary">예</button>
</div>
</div>
</div>
</div>
<!-- 인트로 모달 -->
<div class="microModal microAlert gameIntro" id="intro-modal" role="dialog" aria-modal="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<div class="gameIntroPaging">
<h1 class="gameTop">진짜 영양제를 무료로 받는 방법</h1>
<div class="gameIntroWrap">
<h2 class="tit">1. ${sopmalCd eq 'NC' ? '초록잎을' : '도토리를'} 모아주세요.</h2>
<i class="ico_intro01">아이콘</i>
<p>혜택 메뉴의 다양한 이벤트에 참여하면<br>${sopmalCd eq 'NC' ? '뉴트리캡슐' : '닥터린캡슐'} 만들기에 필요한<br>${sopmalCd eq 'NC' ? '초록잎을' : '도토리를'} 드려요.</p>
</div>
<div class="gameIntroWrap">
<h2 class="tit">2. 유리병에 넣어주세요.</h2>
<i class="ico_intro02">아이콘</i>
<p>보유한 ${sopmalCd eq 'NC' ? '초록잎을' : '도토리를'}<br>
실험실의 유리병에 넣어주세요.<br>
모든 유리병이 가득 채워지면<br>
${sopmalCd eq 'NC' ? '뉴트리캡슐' : '닥터린캡슐'}이 완성됩니다.</p>
</div>
<div class="gameIntroWrap">
<h2 class="tit">3. 진짜 영양제로 교환하세요.</h2>
<i class="ico_intro03">아이콘</i>
<p>${sopmalCd eq 'NC' ? '뉴트리캡슐' : '닥터린캡슐'}을 완성하면<br>
진짜 영양제를 선물로 보내드려요.<br>
그럼, 지금부터 시작해 볼까요?</p>
</div>
</div>
<div class="gamePaging"></div>
</div>
</div>
<div class="microModal__btnContainer">
<button class="btn lg theme" type="button" id="goCapsuleMaking">${sopmalCd eq 'NC' ? '뉴트리캡슐' : '닥터린캡슐'} 만들러 가볼까?</button>
</div>
</div>
</div>
</div>
<!-- 알림용 새로운 모달 추가 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<%-- 기존의 sopmalCd 설정만 유지 --%>
<c:set var="sopmalCd" value="${rewardInfo.sopmalCd}" />
<%-- 모든 디버깅 관련 코드 제거 --%>
</body>
</html>

View File

@@ -0,0 +1,95 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : CpslmknSettings.jsp
Description : 캡슐 만들기 설정
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-09-06 노태운 최초 생성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/cpslmkn/CpslmknSettings.js" defer></script>
<script>
$(document).ready(function() {
const sopmalCd = $('#sopmalCd').val();
const bnfInnb = $('#bnfInnb').val();
$(".header__title").text(sopmalCd == 'NC' ? '뉴트리' + " 캡슐만들기" : '닥터린' + " 캡슐만들기");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체 (햄버거 메뉴 제외)
$(".header__btn-container").html(`
<button class="header__toBack__btn"><span class="visually-hidden">창닫기</span><i class="icon icon_nav-close"></i></button>
`);
// 뒤로가기 버튼 숨김 처리 (SVG 아이콘이 있는 경우)
$('button.header__toBack__btn').has('svg').remove();
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/createGame?bnfInnb=${bnfInnb}`;
});
});
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- sopmalCd 변수 설정 -->
<c:set var="sopmalCd" value="${sopmalCd.sopmalCd}" />
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<ul class="productManagement">
<li><a href="#">${sopmalCd eq 'NC' ? '초록잎' : '도토리'} 보유내역</a></li>
<li>
<fieldset class="toggle">
<label>
<span>알림설정</span>
<input role="switch" type="checkbox"
<c:if test="${notificationSettings.agreAt eq 'Y'}">checked</c:if>>
</label>
</fieldset>
</li>
</ul>
</div>
<div class="comment-box">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">참여방법 안내</p>
<div style="color:rgba(0,0,0,0.6); font-size:14px;">
<c:out value="${importantNotice.notice2}" escapeXml="false"/>
</div>
</div>
<input type="hidden" id="sopmalCd" value="${sopmalCd}">
<input type="hidden" id="bnfInnb" value="${bnfInnb}">
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,232 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : Discshar.jsp
Description : 할인소식 공유 페이지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-09 노태운 최초 생성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/discshar/Discshar.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("할인소식공유");
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonHeader.jsp" >
<jsp:param name="pageTitle" value="할인소식 공유" />
</jsp:include>
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<c:if test="${empty alertMessage}">
<div class="discountWrap">
<!-- currentDiscshar.list를 productList 변수에 저장 -->
<c:set var="productList" value="${currentDiscshar.list}" />
<c:set var="productBnft" value="${productList[0]}" />
<!-- 대표 이미지 부분 수정 -->
<div class="discountThumnail">
<img src="<c:out value="${cdnurl}${currentDiscshar.list[0].scrReprsntImg}"/>"
onerror="this.src='/mobile/images/image_placeholder.png'"
alt="할인소식 공유">
</div>
<!--슬라이드추가-->
<div class="discountSlider">
<ul class="discountList">
<c:forEach var="product" items="${currentDiscshar.list}">
<li>
<a href="${product.linkUrl}">
<div class="thumnail">
<img src="<c:out value="${cdnurl}${product.imgFilCours}${product.imgFilNm}"/>"
onerror="this.src='/mobile/images/image_placeholder.png'"
alt="${product.cnSj}">
</div>
<p class="tit">${product.cnSj}</p>
<p class="txt1">
<fmt:formatNumber value="${product.dscntRt}" pattern="#,##0"/>% 추가할인
</p>
<p class="txt2">
<fmt:formatNumber value="${product.mlgRwdAmt}" pattern="#,##0"/>원
</p>
</a>
<button type="button" class="btn green" onclick="Discshar.copyLink('${product.bnfInnb}')">링크복사</button>
<p class="txt3">
<fmt:parseDate value="${product.validDt}" pattern="yyyy-MM-dd'T'HH:mm:ss" var="parsedValidDt" type="both" />
<fmt:formatDate value="${parsedValidDt}" pattern="yyyy.MM.dd"/>까지 유효
</p>
</li>
</c:forEach>
</ul>
</div>
</div>
<div class="bottomBtnControls">
<a href="#" class="btn link_share" onclick="Discshar.showShareResult()"><i class="ico_share"></i>링크공유 결과보기</a>
</div>
</div>
<div class="comment-box">
${productBnft.bnfWordsCn}
</div>
</c:if>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonFooter.jsp" />
</div>
</div>
<!-- 얼러트 창1 -->
<div class="microModal microAlert" id="modal-1" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
링크주소가 복사되었습니다.
</h2>
</div>
<div class="microModal__content">
<p>
원하는 곳에 붙여넣기(Ctrl+V)하여<br>할인소식을 공유해 주세요.
</p>
<input type="text" id="linkToCopy" readonly style="width: 100%; margin-top: 10px;">
<button onclick="copyToClipboard()">복사하기</button>
<p class="mt10 c_blue">
링크 유효기간 : <span id="linkExpiryDate"></span>
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<script>
function copyToClipboard() {
const copyText = document.getElementById("linkToCopy");
copyText.select();
document.execCommand("copy");
alert("링크가 복사되었습니다: " + copyText.value);
}
</script>
<!-- 얼러트 창2 -->
<div class="microModal microAlert" id="modal-2" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
30일 이내에<br>확인된 구매가 없네요.
</h2>
</div>
<div class="microModal__content">
<p>
공유한 링크로 구매가 이뤄진 경우<br>구매확정 시점에 맞춰<br>마일리지가 적립됩니다.
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 얼러트 창3 -->
<div class="microModal microAlert" id="modal-3" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
30일 이내에<br>완료된 구매가 있습니다.
</h2>
</div>
<div class="microModal__content">
<p>
할인공유 적립내역은<br><span class="c_black">마이페이지 > 마일리지</span> 메뉴에서<br>확인하세요.
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn" data-micromodal-close="" aria-label="창 닫기">닫기</button>
<button class="microModal__btn microModal__btn-primary" onclick="location.href='/mypage/mileage'">마이페이지로</button>
</div>
</div>
</div>
</div>
<!-- 알림용 새로운 모달 추가 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- screenInfo 스크립트 수정 -->
<script>
const screenInfo = {
bnfInnb: "${fn:escapeXml(currentDiscshar.list[0].bnfInnb)}"
};
</script>
</body>
</html>

View File

@@ -0,0 +1,135 @@
<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : Envset.jsp
Description : 이벤트보기
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-10-07 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/intakchl/Envset.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("이벤트보기");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button class="header__btn" onclick="location.href='/sopmal/bnft/bnftMain'"><i class="icon icon_nav-home"></i><spanclass="visually-hidden">메인으로</span></button>
`);
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
// alert 대신 커스텀 모달 사용
<c:if test="${not empty alertMessage}">
showCustomAlert("<c:out value='${alertMessage}'/>");
<c:if test="${goBack eq 'Y'}">
$('#modal-alert .microModal__btn-primary').on('click', function() {
window.history.back();
});
</c:if>
</c:if>
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="setting_tit">알림설정</div>
<fieldset class="toggle">
<label>
<span class="md">혜택/마케팅 알림 수신 동의</span>
<input id="marketing-toggle" role="switch" type="checkbox">
</label>
</fieldset>
<!-- 토스트창1 -->
<div id="set_toast" class="toastPop">
<span class="agree">
<fmt:formatDate value="${now}" pattern="yyyy년 MM월 dd일"/> 뉴트리코어 앱 푸시기능을 통한 마케팅 정보 수신에 동의하셨습니다.
</span>
<span class="disagree">
<fmt:formatDate value="${now}" pattern="yyyy년 MM월 dd일"/> 뉴트리코어 앱 푸시기능을 통한 마케팅 정보 수신 동의를 철회하셨습니다.
</span>
</div>
<script>
$(document).ready(function() {
var $toastPop = $('#set_toast');
var $agreeMessage = $toastPop.find('.agree');
var $disagreeMessage = $toastPop.find('.disagree');
$('#marketing-toggle').on('change', function() {
var isChecked = $(this).prop('checked');
// 체크 상태에 따라 적절한 메시지 표시
if (isChecked) {
$agreeMessage.show();
$disagreeMessage.hide();
} else {
$agreeMessage.hide();
$disagreeMessage.show();
}
// 토스트 팝업 표시
$toastPop.addClass('show');
// 토스트 팝업 숨기기
setTimeout(function() {
$toastPop.removeClass('show');
}, 3000);
});
});
</script>
<ul class="setting_description">
<li>※ 이벤트 및 쿠폰 지급 등 다양한 혜택, 소식을 푸시알림으로 보내드려요.</li>
<li>※ 개별 이벤트에서 신청한 알림은 마케팅 알림을 꺼도 받을 수 있습니다.</li>
</ul>
<div class="setting_list">
<div class="setting_tit">앱 정보</div>
<div class="settingInbox between mt20">
<span>앱정보</span>
<p class="ver_comment">최신 버전입니다.</p>
<button type="button" class="btn xsm outline theme set_update">업데이트하기</button>
</div>
<div class="settingInbox"><a href="/sopmal/bnft/openLicense">오픈라이선스</a></div>
</div>
</div>
</main>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,91 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%--
File Name : OpenSourceLicense.jsp
Description : 오픈소스 라이선스 정보 페이지
Modification Information
수정일 수정자 수정내용
-------- -------- ----------------------
2024.10.07 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonHead.jsp">
<jsp:param name="pageTitle" value="뉴트리코어 - 환경설정" />
</jsp:include>
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/envset/Envset.js" defer></script>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonHeader.jsp">
<jsp:param name="pageTitle" value="오픈소스 라이선스" />
<jsp:param name="showBackButton" value="true" />
</jsp:include>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="licenseBox">
<h2>저작권</h2>
<p>
저작권(copyright)은 문학∙학술 또는 예술의 범위에 속하는 창작물(저작물)의 창작에 의하여
그 창작물에 대하여 창작자(저작자)가 취득하는 권리로서 창작물의 아이디어를 보호하는 것이
아니라 그 표현(expression)의 결과물을 보호하는 것이다. 저작권은 권리의 발생에 있어 등록과
같은요건이필요하지않고창작과동시에권리가발생한다(무방식주의). 따라서어떤프로그래머가
특정 SW를 개발하게 되면 컴퓨터프로그램저작권이 자동적으로 발생하며, 그 권리는 프로그래머
또는 그가 속한 회사에 부여된다. 저작권이 있는 저작물의 경우 누구도 원 저작자나 저작권자의
허가가 없이는 해당 저작물을 사용∙복제∙배포∙수정할 수 없다.
</p>
<h2>특허권</h2>
<p>
특허권(patent)은 발명에 관하여 발생하는 독점적∙배타적 지배권으로 법에 정해진 절차에
의해 출원을 하여야 하며, 심사를 통해 부여되는 권리이다. 특허기술을 사용하기 위해서는
반드시 특허권자의 허락을 얻어야만 한다. 특허권자는 자신이 허락하지 않은 사람이 해당 특허를
활용한 제품을 만들거나, 사용하거나, 판매하는 것을 막을 수 있다. 특허는 무엇인가 유용하게
하는 방식(method)이므로 특허받은 방식을 구현하는 SW라면 프로그래밍 언어가 다르거나
소스코드가 다르더라도 해당 특허권자의 명시적인 허락을 받아야 하며 이는 오픈소스SW 뿐만
아니라 상용 SW에도 마찬가지이다.
</p>
<h2>상표권</h2>
<p>
상표권(trademark right)이란 상표권자가 지정상품에 관하여 그 등록상표를 사용할 독점적인
권리로서 일정한 절차에 따라 등록하여야 효력이 발생한다. 이러한 상표를 사용하기 위해서는
반드시 상표권자의 허락을 얻어야 하며 허락받지 않고 상표를 이용할 경우 처벌을 받게 된다.
상표권을 취득한 SW의 경우 상표를 사용하려면 상표권자의 명시적인 허락을 받아야 한다.
</p>
<h2>영업비밀</h2>
<p>
영업비밀(trade secret)이란 공연히 알려져 있지 아니하고 독립된 경제적 가치를 지니는 것으
로서 상당한 노력에 의하여 비밀로 유지되는 생산 방법, 판매 방법, 기타 영업 활동에 유용한 비
밀유지의무가 있음에도 다른 사람에게 이를 누출하는 경우 처벌받게 된다. 공개되지 않은 SW
의 경우 영업비밀로서 보호를 받을 수 있으며, 공개된 SW라 하더라도 아이디어에 대한 부분은
영업비밀로 보호를 받을 수 있는 가능성이 있다. 단, 영업비밀로서의 SW보호는 널리 공개되어
유통되는 경우에는 보호받기가 어렵고, 이를 알지 못하고 사용한 제3자에게 법적으로 문제를
삼을 수 없는 한계가 있다.
</p>
<p>
이상과 같은 지적재산권에 의해 권리자는 SW에 대한 배타적인 권리를 가지게 되며, 원칙적으로
권리자만이 SW를 사용∙복제∙배포∙수정할 수 있다.
</p>
</div>
</div>
</main>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,150 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : EvntView.jsp
Description : 이벤트 보기 페이지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-01 노태운 최초 생성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/evntview/Evntview.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("이벤트 보기");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button id="statsButton" class="header__btn"><i class="icon icon_nav-home"></i><span class="visually-hidden">메인으로</span></button>
`);
// 메인으로 이동
$("#statsButton").on('click', function() {
window.location.href = "<c:url value='/'/>";
});
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div id="countdownTimer" class="topupPoint" style="display: none;">
<span><i class="ico_clock"></i><b id="countdown"></b>초 동안 화면 보면 적립</span>
</div>
<ul class="eventViewList">
<c:if test="${not empty eventInfo}">
<c:if test="${not empty eventInfo.benefitInfo}">
<c:forEach var="benefit" items="${eventInfo.benefitInfo}" varStatus="status">
<li>
<a href="#" onclick="EventView.start(
${benefit.bnfInnb},
'${benefit.eventDesc}',
${benefit.loadingTime},
${benefit.mlgRwdAmt},
'${benefit.eventLinkUrl}',
'${benefit.cnBgnDt}',
'${benefit.cnEndDt}'); return false;">
<p class="li_tit">${benefit.eventLinkTitle}</p>
<p class="li_txt">${benefit.eventDesc}</p>
<p class="li_date">
<fmt:parseDate value="${benefit.cnBgnDt}" pattern="yyyy-MM-dd HH:mm:ss" var="beginDate" />
<fmt:parseDate value="${benefit.cnEndDt}" pattern="yyyy-MM-dd HH:mm:ss" var="endDate" />
<fmt:formatDate value="${beginDate}" pattern="yyyy-MM-dd" /> ~ <fmt:formatDate value="${endDate}" pattern="yyyy-MM-dd" />
</p>
<div class="li_mile ${benefit.accumulatedYn eq 'Y' ? 'on' : ''}" data-bnf-innb="${benefit.bnfInnb}">
<c:choose>
<c:when test="${benefit.accumulatedYn eq 'Y'}">
<span>적립완료</span>
</c:when>
<c:otherwise>
<span>+<fmt:formatNumber value="${benefit.mlgRwdAmt}" pattern="#" />P</span>
</c:otherwise>
</c:choose>
</div>
</a>
</li>
</c:forEach>
</c:if>
</c:if>
</ul>
<!-- 이벤트 설명 영역 -->
<div class="comment-box">
${eventInfo.instruction.wordsCn}
</div>
</div>
</main>
</div>
</div>
<!-- 마일리지 적립 완료 모달 -->
<div class="microModal microAlert" id="modal-mileage-complete" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">마일리지 적립 완료</h2>
</div>
<div class="microModal__content">
<i class="modal-icon-mile">마일리지</i>
<p class="sub_tit">마일리지가 적립되었습니다!</p>
<p class="point-amount"><span id="rewardAmount">0</span>P</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 알림용 모달 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__content">
<p></p>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,139 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : Hlthset.jsp
Description : 관심분야 설정
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-23 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- CDN URL 추가 -->
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<script src="<%= request.getContextPath() %>/mobile/js/bnft/hlthset/Hlthset.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("관심분야설정");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button id="statsButton" class="header__btn"><i class="icon icon_nav-home"></i><span class="visually-hidden">메인으로</span></button>
`);
// 메인으로 이동
$("#statsButton").on('click', function() {
window.location.href = "<c:url value='/'/>";
});
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
// CDN URL을 JavaScript 전역 변수로 설정
window.cdnUrl = '<c:out value="${cdnurl}"/>';
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="favoriteWrap">
<div class="fvTop">
<p class="tit">내 관심분야는?</p>
<p class="txt">체크한 관심분야의 건강정보, 제품 소식을 전해드려요.</p>
</div>
<div class="favoriteBox">
<ul id="favoriteList" class="favoriteList">
<!-- 여기에 JavaScript로 목록 항목이 추가될 것입니다 -->
</ul>
</div>
</div>
<div class="favoriteAgree">
<div class="favoriteCheckbox">
<label class="b-checkbox is-medium checkbox">
<input type="checkbox" id="agreementCheckbox" value="">
<span class="check"></span>
<span class="control-label">관심분야 정보받기에 동의합니다.</span>
</label>
</div>
<ul class="bottomComment">
<li>· 관심분야 정보는 언제든지 변경할 수 있습니다.</li>
<li>· 설정 저장 시 마일리지는 매월 1회만 지급됩니다.</li>
</ul>
</div>
<div class="topupPoint noSticky">
<span>정보받기 동의하고 저장하면 <i class="ico_mile"></i><b>0 원</b>적립</span>
</div>
<div class="bottomBtnControls">
<button class="btn lg full theme" type="button" id="saveBtn">저장하기</button>
</div>
</div>
<div class="comment-box">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">이벤트 설명</p>
<p style="color:rgba(0,0,0,0.6); font-size:14px;">이벤트 설명을 불러오는 중입니다...</p>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 알림용모달 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 토스트 메시지 -->
<div id="toastPop" class="toastPop">
<i class="ico_check_circle"></i>
<p class="tit">관심분야 설정 저장</p>
<p class="txt">마일리지 0 원 적립 완료</p>
</div>
</body>
</html>

View File

@@ -0,0 +1,155 @@
<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : IntakchlDailyRecord.jsp
Description : 섭취챌린지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-09 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/intakchl/Intakchl.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("섭취챌린지");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button id="statsButton" class="header__btn"><i class="icon icon_nav-calendar"></i><span class="visually-hidden">섭취챌린지 월별 통계보기</span></button>
<button id="settingsButton" class="header__btn"><i class="icon icon_nav-set"></i><span class="visually-hidden">설정</span></button>
`);
// 뒤로가기 버튼 클릭 이벤트 추가
$(".header__toBack__btn").on("click", function() {
window.location.href = '/sopmal/bnft/bnftMain';
});
// 통계 버튼 클릭 이벤트
$("#statsButton").on("click", function() {
const bnfInnb = $("#bnfInnbHidden").val() || '';
window.location.href = '/sopmal/bnft/intakchlMileageSummary?source=main' + (bnfInnb ? '&bnfInnb=' + bnfInnb : '');
});
// 설정 버튼 클릭 이벤트
$("#settingsButton").on("click", function() {
const bnfInnb = $("#bnfInnbHidden").val() || '';
window.location.href = '/sopmal/bnft/intakchlChallengeSettings?source=main' + (bnfInnb ? '&bnfInnb=' + bnfInnb : '');
});
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<c:set var="screenInfo" value="${intakchscreenInfo.screenInfo}"/>
<c:set var="productList" value="${purchasedProductsInfo.resultList}"/>
<c:set var="wishlist" value="${wishlistInfo.resultList}"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="challengeWrap">
<div class="challengeIntro">
<b>섭취챌린지</b>와 함께 꾸준히 잘 챙겨 먹기 실천!<br>
매일, 매월 섭취 완료시마다 마일리지를 드려요.
</div>
<h3 class="challengeMain__innerTitle">섭취챌린지 대상 제품을 선택하여 추가해 주세요.</h3>
<nav class="headerTab">
<div class="headerTab__content">
<ul class="headerTab__list">
<li class="headerTab__item active" id="purchased-tab">
<a href="#">구매한 제품 (최근1년)</a>
</li>
<li class="headerTab__item" id="wishlist-tab">
<a href="#">위시리스트</a>
</li>
</ul>
</div>
</nav>
<ul class="challenge_checklist purchased">
<c:forEach items="${productList}" var="product">
<li>
<label class="b-checkbox checkbox">
<input type="checkbox" value="${product.goodsInnb}">
<span class="check"></span>
<div class="checkProduct">
<div class="thum"><img src="${cdnurl}${product.img}" alt="${product.goodsNm}"></div>
<div class="tit">${product.goodsNm}</div>
<div class="dayCheck">구매일: <fmt:formatDate value="${product.purchsDcsnDt}" pattern="yyyy-MM-dd"/></div>
</div>
</label>
</li>
</c:forEach>
</ul>
<ul class="challenge_checklist wishlist" style="display: none">
<c:forEach items="${wishlist}" var="product">
<li>
<label class="b-checkbox checkbox">
<input type="checkbox" value="${product.goodsInnb}">
<span class="check"></span>
<div class="checkProduct">
<div class="thum">
<img src="${cdnurl}${product.img}"
alt="${product.goodsNm}">
</div>
<div class="tit">${product.goodsNm}</div>
<div class="dayCheck">
<c:set var="discountAmount" value="${product.cnsmrpric - (product.orgSlepric - product.evtAditDscntAmt)}"/>
<c:set var="discountRate" value="${(discountAmount / product.cnsmrpric) * 100}"/>
<fmt:formatNumber value="${discountRate}" pattern="0.#" var="formattedRate"/>
<c:set var="finalPrice" value="${product.orgSlepric - product.evtAditDscntAmt}"/>
할인율: ${formattedRate}%
(<fmt:formatNumber value="${finalPrice}" pattern="#,###"/>원)
</div>
</div>
</label>
</li>
</c:forEach>
</ul>
<div class="ps_info">
${screenInfo.bnfWordsCn}
</div>
<div class="ps_info">
최근 1년 이내 구매 제품과 위시리스트에 저장한 제품만 선택 가능 합니다. 제품이 목록에 없는 경우 쇼핑몰에서 '위시리스트'에 먼저 저장해 주세요.
</div>
<div class="bottomBtnControls">
<button id="addToChallengeBtn" class="btn lg full theme">섭취챌린지에 추가</button>
</div>
</div>
</div>
<!-- Top 버튼 -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonTopButton.jsp"/>
</main>
</div>
</div>
<!-- 모달 include -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/intakchl/IntakchlModal.jsp"/>
<input type="hidden" id="bnfInnbHidden" value="${intakchscreenInfo.resultList[0].bnfInnb}">
</body>
</html>

View File

@@ -0,0 +1,152 @@
<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : IntakchlAlarmSettings.jsp
Description : 섭취챌린지 알림설정
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-09 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/intakchl/IntakchlAlarmSettings.js" defer></script>
<script>
// 서버에서 받은 데이터를 JavaScript로 전달
let notificationData = {
alertMessage: "<c:out value='${alertMessage}'/>",
goBack: "<c:out value='${goBack}'/>",
incompleteNotification: null,
timeNotifications: []
};
<c:if test="${not empty notificationSettings.incompleteNotification}">
notificationData.incompleteNotification = {
bnfPushEvtSetupInnb: "${notificationSettings.incompleteNotification.bnfPushEvtSetupInnb}",
useAt: "${notificationSettings.incompleteNotification.useAt}"
};
</c:if>
<c:if test="${not empty notificationSettings.timeNotifications}">
notificationData.timeNotifications = [
<c:forEach items="${notificationSettings.timeNotifications}" var="notification" varStatus="status">
{
bnfNtkNtcnInnb: "${notification.bnfNtkNtcnInnb}",
ntcnTme: "${notification.ntcnTme}",
useAt: "${notification.useAt}"
}<c:if test="${!status.last}">,</c:if>
</c:forEach>
];
</c:if>
// 페이지 로드 시 초기화
$(document).ready(function() {
$(".header__btn-container").empty();
// 초기 데이터 설정 및 초기화
Intakchl.setInitialData(notificationData, "${pageContext.request.contextPath}");
Intakchl.init();
});
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<%-- <div class="challengeAlarmSet">--%>
<%-- <fieldset class="toggle">--%>
<%-- <label>--%>
<%-- <span>오늘의 섭취 챌린지 결과가<br>입력되지 않으면 알려드려요.</span>--%>
<%-- <input role="switch" type="checkbox" id="mainAlarmToggle">--%>
<%-- </label>--%>
<%-- </fieldset>--%>
<%-- </div>--%>
<div class="challengeAlarmSetList">
<h3 class="sub-tit"><i class="ico_alarm"></i>하루 세 번, 섭취시간에 맞춰 알려드려요.</h3>
<ul class="alarmList">
<!-- 알람 목록은 JavaScript에서 동적으로 생성됩니다 -->
</ul>
</div><!--//challengeAlarmSet-->
</div>
</main>
</div>
</div>
<div class="microModal microBottomSheet" id="modal-1" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<button class="microModal__close2 right" aria-label="창 닫기" data-micromodal-close></button>
</div>
<div class="microModal__content">
<div class="challenge-time-picker">
<p class="tit">알림시간 설정</p>
<div class="challenge-picker-container">
<div class="challenge-picker-column">
<div class="challenge-arrow" onclick="Intakchl.adjustValue('ampm', 1)">이전</div>
<div id="ampm" class="challenge-value" onclick="Intakchl.showSelect('ampm')">오전</div>
<select id="ampm-select" class="challenge-select" onchange="Intakchl.updateValue('ampm')">
<option value="오전">오전</option>
<option value="오후">오후</option>
</select>
<div class="challenge-next" onclick="Intakchl.adjustValue('ampm', -1)">다음</div>
</div>
<div class="challenge-picker-column">
<div class="challenge-arrow" onclick="Intakchl.adjustValue('hour', 1)">이전</div>
<div id="hour" class="challenge-value" onclick="Intakchl.showSelect('hour')">12</div>
<select id="hour-select" class="challenge-select" onchange="Intakchl.updateValue('hour')"></select>
<div class="challenge-next" onclick="Intakchl.adjustValue('hour', -1)">다음</div>
</div>
<div class="challenge-picker-column">
<div class="challenge-arrow" onclick="Intakchl.adjustValue('minute', 1)">이전</div>
<div id="minute" class="challenge-value" onclick="Intakchl.showSelect('minute')">00</div>
<select id="minute-select" class="challenge-select" onchange="Intakchl.updateValue('minute')"></select>
<div class="challenge-next" onclick="Intakchl.adjustValue('minute', -1)">다음</div>
</div>
</div>
</div>
<div class="bottomBtnControls">
<button class="btn lg full theme">확인</button>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 알림 모달 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
<div class="microModal__btns">
<button class="microModal__btn-primary" data-micromodal-close>확인</button>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,150 @@
<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : IntakchlChallengeProductManagement.jsp
Description : 섭취챌린지 섭취제품 관리
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-09 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/intakchl/Intakchl.js" defer></script>
<script>
// 페이지 로드 시 초기화
$(document).ready(function() {
$(".header__btn-container").empty();
$(".header__title").text("섭취제품 관리");
$(".header__toBack__btn").click(function() {
// URL에서 현재 파라미터들 추출
const urlParams = new URLSearchParams(window.location.search);
const source = urlParams.get('source') || '';
const bnfInnb = urlParams.get('bnfInnb') || '';
// 이전 페이지 URL 구성
let backUrl = '/sopmal/bnft/intakchlChallengeSettings';
const params = [];
if (source) {
params.push('source=' + encodeURIComponent(source));
}
if (bnfInnb) {
params.push('bnfInnb=' + encodeURIComponent(bnfInnb));
}
if (params.length > 0) {
backUrl += '?' + params.join('&');
}
window.location.href = backUrl;
});
});
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="topProductBox">
<form action="">
<div class="sub-tab__trigger">
<button type="button" class="sub-tab__btn current">전체(${screenInfo.statistics.totalCount != null ? screenInfo.statistics.totalCount : 0})</button>
<button type="button" class="sub-tab__btn">섭취중(${screenInfo.statistics.activeCount != null ? screenInfo.statistics.activeCount : 0})</button>
<button type="button" class="sub-tab__btn">완료(${screenInfo.statistics.completedCount != null ? screenInfo.statistics.completedCount : 0})</button>
</div>
</form>
</div>
<div class="sub-box">
<c:forEach var="product" items="${screenInfo.challengeProducts}">
<div class="challengeProduct" data-completed="${product.isCompleted}" data-status="${product.bnfNtkSttusDvCd}">
<a href="#">
<div class="thum">
<c:choose>
<c:when test="${not empty product.imageUrl}">
<img src="${cdnurl}${product.imageUrl}" alt="${product.productName}">
</c:when>
<c:otherwise>
<img src="<c:url value='/resources/images/event/default_product.jpg'/>" alt="${product.productName}">
</c:otherwise>
</c:choose>
</div>
<div class="cpTit">
<p class="tit">${product.productName}</p>
<p class="dayCheck">목표 섭취 횟수: ${product.dailyIntakeCount}</p>
<p class="status">${product.statusName}</p>
<c:if test="${product.isCompleted == 'Y'}">
<span class="completion-badge">30일 완료</span>
</c:if>
</div>
<button type="button" class="btn-cpWrite" onclick="location.href='<c:url value='/sopmal/bnft/intakchlProductDetail?bnfNtkInnb=${product.bnfNtkInnb}&returnPage=productManagement&bnfInnb=${param.bnfInnb}'/>'">섭취정보 입력</button>
<p class="cpDate">
<fmt:parseDate value="${product.addedDate}" var="parsedDate" pattern="yyyy-MM-dd'T'HH:mm:ss" />
<fmt:formatDate value="${parsedDate}" pattern="yyyy-MM-dd" var="formattedDate" />
등록일: ${formattedDate}
</p>
</a>
</div>
</c:forEach>
</div>
</div>
<!--제품추가하기 버튼-->
<div class="challenge_add">
<button type="button" class="btn_add_challenge" onclick="location.href='<c:url value='/sopmal/bnft/intakchlMain'/>'">제품추가</button>
</div>
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonTopButton.jsp" />
</main>
</div>
</div>
<script>
$(document).ready(function() {
// 탭 버튼 클릭 이벤트
$('.sub-tab__btn').click(function() {
$('.sub-tab__btn').removeClass('current');
$(this).addClass('current');
var tabIndex = $(this).index();
// 탭 인덱스에 따른 필터링
if (tabIndex === 0) {
// 전체 탭 - 모든 제품 표시
$('.challengeProduct').show();
} else if (tabIndex === 1) {
// 섭취중 탭 - 완료되지 않고 섭취중인 제품만 표시
$('.challengeProduct').hide();
$('.challengeProduct[data-completed="N"][data-status="010"]').show();
} else if (tabIndex === 2) {
// 완료 탭 - 30일 완료된 제품만 표시
$('.challengeProduct').hide();
$('.challengeProduct[data-completed="Y"]').show();
}
});
});
</script>
</body>
</html>

View File

@@ -0,0 +1,108 @@
<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : IntakchlChallengeSettings.jsp
Description : 섭취챌린지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-09 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/intakchl/IntakchlChallengeSettings.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("섭취챌린지");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button class="header__toBack__btn">
<span class="visually-hidden">창닫기</span>
<i class="icon icon_nav-close"></i>
</button>
`);
$('button.header__toBack__btn').has('svg').remove();
// 창닫기 버튼 클릭 이벤트 추가
$(".header__toBack__btn").on("click", function() {
const urlParams = new URLSearchParams(window.location.search);
const bnfInnb = urlParams.get('bnfInnb') || ''; // URL에서 bnfInnb 값 가져오기
const source = urlParams.get('source') || ''; // 출처 정보 가져오기
// 출처에 따라 다른 페이지로 이동
if (source === 'main') {
// 메인 페이지에서 왔으면 메인 페이지로 돌아가기
window.location.href = '/sopmal/bnft/intakchlMain' + (bnfInnb ? '?bnfInnb=' + bnfInnb : '');
} else if (source === 'daily') {
// 일일 기록 페이지에서 왔으면 일일 기록 페이지로 돌아가기
window.location.href = '/sopmal/bnft/intakchlDailyRecordMain' + (bnfInnb ? '?bnfInnb=' + bnfInnb : '');
} else {
// 기본적으로 일일 기록 페이지로 이동
window.location.href = '/sopmal/bnft/intakchlDailyRecordMain' + (bnfInnb ? '?bnfInnb=' + bnfInnb : '');
}
});
// alert 대신 커스텀 모달 사용
<c:if test="${not empty alertMessage}">
showCustomAlert("<c:out value='${alertMessage}'/>");
<c:if test="${goBack eq 'Y'}">
$('#modal-alert .microModal__btn-primary').on('click', function() {
window.history.back();
});
</c:if>
</c:if>
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<ul class="productManagement">
<li><a href="#" id="manageProducts">섭취제품 관리</a></li>
<li><a href="#" id="setAlarms">알림설정</a></li>
</ul>
<div class="comment-box">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">참여방법 안내</p>
<p style="color:rgba(0,0,0,0.6); font-size:14px;"><c:out value="${settingInfo.resultList[0].bnfWordsCn}" escapeXml="false"/></p>
</div>
</div>
<!-- Top 버튼 -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonTopButton.jsp" />
</main>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,133 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : Intakch.jsp
Description : 섭취챌린지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-09 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/intakchl/IntakchlDailyRecord.js" defer></script>
<script>
// CDN URL을 JavaScript 변수로 전달
window.CDN_URL = '<c:out value="${cdnurl}"/>';
$(document).ready(function() {
$(".header__title").text("섭취챌린지");
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button id="statsButton" class="header__btn"><i class="icon icon_nav-calendar"></i><span class="visually-hidden">섭취챌린지 월별 통계보기</span></button>
<button id="settingsButton" class="header__btn"><i class="icon icon_nav-set"></i><span class="visually-hidden">설정</span></button>
`);
// 통계 버튼 클릭 이벤트
$("#statsButton").on("click", function() {
// URL에서 bnfInnb 파라미터 추출
const urlParams = new URLSearchParams(window.location.search);
const bnfInnb = urlParams.get('bnfInnb') || '';
// source=dailyRecord 파라미터 추가
window.location.href = '/sopmal/bnft/intakchlMileageSummary?source=dailyRecord' + (bnfInnb ? '&bnfInnb=' + bnfInnb : '');
});
// 설정 버튼 클릭 이벤트
$("#settingsButton").on("click", function() {
// URL에서 bnfInnb 파라미터 추출
const urlParams = new URLSearchParams(window.location.search);
const bnfInnb = urlParams.get('bnfInnb') || '';
// source=daily 파라미터를 추가하여 출처가 일일 기록 페이지임을 표시
window.location.href = '/sopmal/bnft/intakchlChallengeSettings?source=daily' + (bnfInnb ? '&bnfInnb=' + bnfInnb : '');
});
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-box">
<div class="day_calendarWrap">
<div class="day_calendar">
<div class="calendar-header">
<button type="button" class="btnDayCalendar" id="prevWeek">이전</button>
<span class="Month" id="currentMonth"></span>
<button type="button" class="btnDayCalendar" id="nextWeek">다음</button>
</div>
<div class="calendar-days" id="calendarDays"></div>
</div>
</div>
</div>
<div class="sub-box">
<div class="challengeBar-container">
<h3>오늘의 섭취기록</h3>
<div class="bar">
<div class="per" style="width:56.3%"></div>
<span class="per-txt">50%</span>
</div>
</div>
</div>
<div class="sub-box">
<div class="sub-box" id="challengeProductContainer">
<!-- 동적으로 생성될 challengeProduct 요소들이 여기에 추가됩니다 -->
</div>
</div>
<div class="topupPoint">
<span>오늘의 섭취기록 100% 도달시<i class="ico_mile"></i><b>마일리지 <fmt:formatNumber value="${dailyIntakeRecordsDetail.rewardInfo}" pattern="#,###" />원</b>적립</span>
</div>
<!--제품추가하기 버튼-->
<div class="challenge_add">
<button type="button" class="btn_add_challenge">제품추가</button>
</div>
<!-- Top 버튼 -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonTopButton.jsp"/>
</main>
</div>
<!-- 토스트 메시지 -->
<div id="toastPop" class="toastPop">
<p></p>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,18 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<div class="microModal microAlert" id="modal-1" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
섭취챌린지에서<br>제품을 삭제할까요?
</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn" data-micromodal-close="" aria-label="창 닫기">아니오</button>
<button class="microModal__btn microModal__btn-primary">예</button>
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,177 @@
<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : IntakchlMileageSummary.jsp
Description : 섭취챌린지 통계
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-09 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/intakchl/IntakchlMileageSummary.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("섭취챌린지");
// 뒤로가기 버튼 클릭 이벤트 추가
$(".header__toBack__btn").on("click", function() {
goBackToPreviousPage();
});
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").empty();
// 서버에서 받은 날짜별 상태 데이터를 JavaScript 변수로 전달
<c:if test="${not empty dashboardInfo.dateClasses}">
window.initialDateClasses = [
<c:forEach var="item" items="${dashboardInfo.dateClasses}" varStatus="status">
{
"date": "${item.date}",
"statsDone": "${item.statsDone}",
"statsIng": "${item.statsIng}",
"stats30done": "${item.stats30done}",
"doneCount": ${item.doneCount},
"ingCount": ${item.ingCount}
}<c:if test="${!status.last}">,</c:if>
</c:forEach>
];
</c:if>
<c:if test="${empty dashboardInfo.dateClasses}">
window.initialDateClasses = [];
</c:if>
});
/**
* 이전 페이지로 돌아가기 함수
*/
function goBackToPreviousPage() {
const urlParams = new URLSearchParams(window.location.search);
const bnfInnb = urlParams.get('bnfInnb');
const source = urlParams.get('source');
console.log('마일리지 써머리에서 이전 페이지로 돌아가기:', source);
switch (source) {
case 'main':
// 메인 페이지에서 왔을 경우
window.location.href = '/sopmal/bnft/intakchlMain' + (bnfInnb ? '?bnfInnb=' + bnfInnb : '');
break;
case 'dailyRecord':
// 일일 기록 페이지에서 왔을 경우
window.location.href = '/sopmal/bnft/intakchlDailyRecordMain' + (bnfInnb ? '?bnfInnb=' + bnfInnb : '');
break;
default:
// 기본값은 일일 기록 페이지
window.location.href = '/sopmal/bnft/intakchlDailyRecordMain' + (bnfInnb ? '?bnfInnb=' + bnfInnb : '');
break;
}
}
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<div class="content-wrap">
<main class="main">
<div class="challenge_stats01">
<h3 class="tit01">
<span class="inTit">챌린지 성공 연속<b id="consecutiveDays">${dashboardInfo.challengeStatus.totalSuccessDays}</b>일째!</span>
<span class="dday">30일 보너스까지 <b>${30 - (dashboardInfo.challengeStatus.totalSuccessDays != null ? dashboardInfo.challengeStatus.totalSuccessDays : 0)}</b>일 남음</span>
</h3>
<div class="stats-calendar">
<div class="stats-dates" id="stats-dates"></div>
</div>
</div>
<div class="challengeReward">
<h3 class="tit02">누적 보상</h3>
<ul class="rewardRegend">
<li class="c01">일별보상</li>
<li class="c02">연속 성공 보너스</li>
</ul>
<div class="rewardTotal">
<a href="" class="reward01"><fmt:formatNumber value="${dashboardInfo.cumulativeRewards.dailyRewardTotal != null ? dashboardInfo.cumulativeRewards.dailyRewardTotal : 0}" type="number"/>원</a>
<a href="" class="reward02"><fmt:formatNumber value="${dashboardInfo.cumulativeRewards.consecutiveRewardTotal != null ? dashboardInfo.cumulativeRewards.consecutiveRewardTotal : 0}" type="number"/>원</a>
<a href="" class="reward03"><fmt:formatNumber value="${dashboardInfo.cumulativeRewards.couponCount != null ? dashboardInfo.cumulativeRewards.couponCount : 0}" type="number"/>개</a>
</div>
</div>
<div class="challengeProductNow">
<h3 class="tit02">현재 챌린지중인 제품</h3>
<div class="sub-box">
<div class="challengeProductWrap" id="challengeProductWrap">
<c:if test="${empty dashboardInfo.currentProducts}">
<p class="no-products">현재 챌린지 중인 제품이 없습니다.</p>
</c:if>
<c:forEach var="product" items="${dashboardInfo.currentProducts}">
<div class="challengeProduct">
<a href="${pageContext.request.contextPath}/sopmal/bnft/intakchlProductDetail?bnfNtkInnb=${product.bnfNtkInnb}&returnPage=mileageSummary<c:if test='${not empty param.bnfInnb}'>&bnfInnb=${param.bnfInnb}</c:if>">
<div class="thum">
<img src="<c:choose>
<c:when test="${fn:startsWith(product.imageUrl, 'http://') or fn:startsWith(product.imageUrl, 'https://')}">
${product.imageUrl}
</c:when>
<c:when test="${not empty cdnurl and fn:startsWith(product.imageUrl, '/')}">
${cdnurl}${product.imageUrl}
</c:when>
<c:otherwise>
${product.imageUrl}
</c:otherwise>
</c:choose>" alt="${product.productName}">
</div>
<div class="cpTit">
<p class="tit">${product.productName}</p>
<p class="dayCheck">1일 ${product.dailyIntakeCount}회 ${product.dailyIntakeCount}정씩</p>
</div>
<div class="drugCheck">
<c:forEach var="status" items="${product.intakeStatuses}">
<c:choose>
<c:when test="${status}">
<span class="drug_on">섭취완료</span>
</c:when>
<c:otherwise>
<span class="drug_off">섭취미완료</span>
</c:otherwise>
</c:choose>
</c:forEach>
</div>
</a>
</div>
</c:forEach>
</div>
</div>
</div>
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonTopButton.jsp" />
</main>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,19 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!-- 얼러트 창 -->
<div class="microModal microAlert" id="modal-1" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
섭취챌린지에<br>추가되었습니다.
</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn" id="continueAdding" aria-label="계속추가">계속추가</button>
<button class="microModal__btn microModal__btn-primary" id="startChallenge">챌린지 시작</button>
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,118 @@
<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name :IntakchlProductDetail.jsp
Description : 섭취챌린지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-09 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/intakchl/IntakchlProductDetail.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("섭취챌린지");
$(".header__btn-container").html(
'<button class="header__toBack__btn" data-micromodal-trigger="modal-1"><i class="icon icon_nav-trash"></i><span class="visually-hidden">삭제하기</span></button>'
);
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="challengeInfo">
<h3 class="sub-tit">제품정보</h3>
<input type="hidden" id="bnfNtkInnb" name="bnfNtkInnb" value="${screenInfo.challengeProductDetail.bnfNtkInnb}">
<div class="ciProduct">
<div class="checkProduct">
<div class="thum"><img src="${cdnurl}${screenInfo.challengeProductDetail.thumbnail}" alt="${screenInfo.challengeProductDetail.goodsNm}"></div>
<div class="tit">${screenInfo.challengeProductDetail.goodsNm}</div>
<div class="dayCheck">${screenInfo.challengeProductDetail.intakeInstructions}</div>
</div>
</div>
</div>
<div class="challengeSet">
<h3 class="sub-tit">섭취설정</h3>
<span class="challengeDate">
<fmt:parseDate value="${screenInfo.challengeProductDetail.startDate}" pattern="yyyy-MM-dd'T'HH:mm:ss" var="parsedStartDate"/>
<fmt:formatDate value="${parsedStartDate}" pattern="yyyy.MM.dd"/>
</span>
<div class="ciSetBox">
<%--
<div class="custom-radio-container">
<div class="custom-radio is-medium">
<input type="radio" id="r-1" name="intakeStatus" value="010" ${screenInfo.challengeProductDetail.bnfNtkSttusDvCd eq '010' ? 'checked' : ''}>
<label for="r-1">섭취중</label>
</div>
<div class="custom-radio is-medium">
<input type="radio" id="r-2" name="intakeStatus" value="020" ${screenInfo.challengeProductDetail.bnfNtkSttusDvCd eq '020' ? 'checked' : ''}>
<label for="r-2">일시중단</label>
</div>
<div class="custom-radio is-medium">
<input type="radio" id="r-3" name="intakeStatus" value="030" ${screenInfo.challengeProductDetail.bnfNtkSttusDvCd eq '030' ? 'checked' : ''}>
<label for="r-3">종료</label>
</div>
</div>
--%>
<div class="ci_counter">
<span>1일</span>
<button id="decrease" class="ci_button">-</button>
<div id="count" class="ci_count">${screenInfo.challengeProductDetail.ntkCnt}</div>
<button id="increase" class="ci_button">+</button>
<span>회 섭취</span>
</div>
</div>
</div>
<div class="challengeMemo">
<h3 class="sub-tit">메모</h3>
<textarea class="white_textarea" rows="5" placeholder="최대 200자">${screenInfo.challengeProductDetail.memo}</textarea>
</div>
</div>
<div class="bottomBtnControls fixed">
<button class="btn lg full theme" type="button" id="save_toast">저장하기</button>
<div id="toastPop" class="toastPop">
<p>저장되었습니다.</p>
</div>
</div>
</main>
</div>
</div>
<!-- 모달 include -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/intakchl/IntakchlDeleteModal.jsp"/>
</body>
</html>

View File

@@ -0,0 +1,288 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : LuckyLottery.jsp
Description : 행운복권 페이지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-06-17 노태운 최초 생성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/lucklott/Lucklott.js" defer></script>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<script>
$(document).ready(function() {
$(".header__title").text("행운복권");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button id="statsButton" class="header__btn"><i class="icon icon_nav-home"></i><span class="visually-hidden">메인으로</span></button>
`);
// 메인으로 이동
$("#statsButton").on('click', function() {
window.location.href = "<c:url value='/'/>";
});
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
});
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- EL 태그를 사용하여 screeninfo 객체의 하위 객체들 설정 -->
<c:set var="benefitInfo" value="${screenInfo.benefitInfo}" />
<c:set var="rewardsAndCoupons" value="${screenInfo.rewardsAndCoupons}" />
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="luckyLottoryWrap">
<!-- 행운복권 시작 -->
<div class="LuckyLottory">
<c:if test="${not empty benefitInfo}">
<input type="hidden" id="bnfInnb" value="<c:out value='${benefitInfo.bnfInnb}'/>">
<!-- 디버깅용 로그 -->
<script>
console.log('benefitInfo:', {
bnfInnb: '<c:out value="${benefitInfo.bnfInnb}"/>',
bnfSj: '<c:out value="${benefitInfo.bnfSj}"/>',
sopmalCd: '<c:out value="${benefitInfo.sopmalCd}"/>'
});
</script>
</c:if>
<c:if test="${empty benefitInfo}">
<script>
console.error('benefitInfo가 비어있습니다.');
alert('혜택 정보를 불러올 수 없습니다. 관리자에게 문의해주세요.');
</script>
</c:if>
<div class="LottoImg">
<img src="<c:out value="${cdnurl}${benefitInfo.scrReprsntImg}"/>"
onerror="this.src='/pc/images/image_placeholder.png'"
alt="매일매일 100% 행운을 드려요. 같은그림 3개가 나오면 당첨! 복권을 긁기만해도 마일리지를 드립니다.">
</div>
<div class="LottoInbox">
<p class="tit">손가락으로 쓱!쓱! 긁어주세요.</p>
<div class="luckyScrachBox">
<canvas class="scrachMask"></canvas>
<ul class="scrachGift">
<li><img src="<c:url value='/mobile/images/bnft/lucky_award1.svg'/>" alt="1등"></li>
<li><img src="<c:url value='/mobile/images/bnft/lucky_award2.svg'/>" alt="2등"></li>
<li><img src="<c:url value='/mobile/images/bnft/lucky_award3.svg'/>" alt="3등"></li>
</ul>
</div>
<p class="tit2">복권을 긁기만 해도 마일리지를 드립니다.</p>
</div>
</div>
<!--// 행운복권 끝 -->
<!-- 행운복권경품안내 시작 -->
<div class="LuckyGift">
<p class="tit">행운복권 경품안내</p>
<div class="LuckyGiftInbox">
<img src="<c:out value="${cdnurl}${benefitInfo.scrRwdImg}"/>" alt="매일매일 100% 행운을 드려요. 같은그림 3개가 나오면 당첨! 복권을 긁기만해도 마일리지를 드립니다.">
</div>
</div>
<!--// 행운복권경품안내 끝 -->
</div>
<!-- 설명안내 시작 -->
<div class="comment-box">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">이벤트 설명</p>
<p style="color:rgba(0,0,0,0.6); font-size:14px; white-space: pre-wrap;">
<c:out value="${benefitInfo.bnfWordsCn}" escapeXml="false" />
</p>
</div>
<!--// 설명안내 끝 -->
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 당첨 얼러트 창 -->
<div class="microModal microAlert" id="modal-1" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
축하합니다!<br>1등 당첨!
</h2>
</div>
<div class="microModal__content">
<i class="modal-icon-present">선물</i>
<p class="sub_tit">
초임계 식물성 알티지 오메가3
</p>
<p>
MY혜택 > 쿠폰에서 확인하세요.
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 미당첨 얼러트 창 -->
<div class="microModal microAlert" id="modal-2" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
조금 아쉽지만 내일 또 도전!
</h2>
</div>
<div class="microModal__content">
<i class="modal-icon-mile">마일리지</i>
<p class="sub_tit">
마일리지 10원 적립
</p>
<p>
MY혜택 > 마일리지에서 확인하세요.
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 알림용 모달 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 품절 안내 모달 추가 -->
<div class="microModal microAlert" id="modal-sold-out" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">안내</h2>
</div>
<div class="microModal__content">
<p class="sub_tit">현재 모든 행운복권 수량이 품절되었습니다.</p>
<p>메인화면으로 이동합니다.</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" id="btn-go-main" aria-label="메인으로 이동">확인</button>
</div>
</div>
</div>
</div>
<script>
// data-micromodal-trigger 속성을 가진 버튼을 클릭하면 해당 ID의 모달이 열림
// 모달 배경화면 스크롤 방지
MicroModal.init(
{
disableScroll: true,
awaitCloseAnimation: true,
});
// 풀스크린 팝업
// 뒤로 가기 버튼(안드로이드) / 왼쪽 스와이프(아이폰)로 원래 화면으로 돌아가기
function openModal(modalId) {
MicroModal.show(modalId, {
onShow: function (modal) {
// 이미 존재하지 않는 경우에만 Hash 추가
if (window.location.hash !== '#' + modalId) {
window.history.pushState({ modal: 'open' }, '', '#' + modalId);
}
},
});
}
// 풀스크린 팝업 닫고, URL Hash 제거
function closeModal(modalId) {
document.body.style.overflow = '';
MicroModal.close(modalId);
// 추가적인 히스토리 항목을 생성하지 않기 위해 현재 상태를 교체
window.history.replaceState({}, '', window.location.pathname);
}
// 풀스크린 팝업 트리거 이벤트 리스너
$('.fullscreen-trigger').on('click', function (e) {
e.preventDefault();
var modalId = $(this).attr('data-micromodal-trigger');
openModal(modalId);
});
// 풀스크린 팝업 닫기 이벤트 리스너
$('.microModal .microModal__close').on('click', function () {
var modalId = $(this).closest('.microModal').attr('id');
closeModal(modalId);
});
// 풀스크린 팝업 뒤로가기 이벤트 리스너
window.addEventListener('popstate', function (event) {
var modalId = window.location.hash.replace('#', '');
if (modalId) {
closeModal(modalId);
} else {
$('.microModal').each(function () {
MicroModal.close($(this).attr('id'));
});
}
document.body.style.overflow = '';
});
if (window.location.hash) {
var modalId = window.location.hash.replace('#', '');
openModal(modalId);
}
</script>
</body>
</html>

View File

@@ -0,0 +1,475 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : Lvshop.jsp
Description : 라이브쇼핑 메인 페이지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-04 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<c:url value='/mobile/js/bnft/lvshop/Lvshop.js'/>" defer></script>
<script>
// 전역 변수로 참여 정보 저장 (App 콜백에서 사용)
let currentBnfPrtInnb = null;
let currentMileageReward = null;
$(document).ready(function() {
$(".header__title").text("라이브쇼핑"); // 헤더 제목 변경
// 헤더 버튼 제거 또는 필요한 버튼으로 수정
$(".header__btn-container").html(`
<button class="header__btn home-btn"><i class="icon icon_nav-home"></i><span class="visually-hidden">메인으로</span></button>
`);
$(".home-btn").on("click", function() {
window.location.href = '/';
});
// 알림용 모달 초기화
MicroModal.init({
openTrigger: 'data-micromodal-trigger',
closeTrigger: 'data-micromodal-close',
disableScroll: true,
disableFocus: false,
awaitCloseAnimation: false,
debugMode: false
});
// 남은 시간 및 경과 시간 업데이트 시작
updateTimes();
setInterval(updateTimes, 1000);
});
// 시간 업데이트 함수
function updateTimes() {
// 라이브 중 경과 시간 업데이트
$(".live_time[data-elapsed-seconds]").each(function() {
const seconds = parseInt($(this).attr("data-elapsed-seconds")) + 1;
$(this).attr("data-elapsed-seconds", seconds);
$(this).text(formatElapsedTime(seconds));
});
// 남은 시간 업데이트
$(".live_time[data-remaining-seconds], .txt3[data-remaining-seconds]").each(function() {
const seconds = Math.max(0, parseInt($(this).attr("data-remaining-seconds")) - 1);
$(this).attr("data-remaining-seconds", seconds);
$(this).text(formatRemainingTime(seconds));
});
}
// 알림용 모달 표시 함수
function showCustomAlert(message) {
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
// 시간 포맷 함수 복원
function formatRemainingTime(seconds) {
if (seconds <= 0) return "잠시 후 시작";
const days = Math.floor(seconds / (3600 * 24));
seconds %= (3600 * 24);
const hours = Math.floor(seconds / 3600);
seconds %= 3600;
const minutes = Math.floor(seconds / 60);
let result = "";
if (days > 0) result += days + "일 ";
if (hours > 0) result += hours + "시간 ";
if (minutes > 0 && days === 0 && hours === 0) result += minutes + "분 "; // 분만 남았을 때
else if (minutes > 0) result += minutes + "분 ";
return result.trim() + " 남음";
}
// 초를 HH:MM:SS 형식으로 변환하는 함수
function formatElapsedTime(seconds) {
if (seconds < 0) seconds = 0;
const hours = String(Math.floor(seconds / 3600)).padStart(2, '0');
const minutes = String(Math.floor((seconds % 3600) / 60)).padStart(2, '0');
const secs = String(seconds % 60).padStart(2, '0');
return `${hours}:${minutes}:${secs}`;
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<c:choose>
<%-- 1. 현재 라이브 진행 중 --%>
<c:when test="${not empty liveShoppingInfo.currentLiveInfo}">
<div class="liveThumnail">
<div class="live_status live">
<c:choose>
<c:when test="${not empty liveShoppingInfo.currentLiveInfo.elapsedTimeInSeconds}">
<p class="live_time" data-elapsed-seconds="${liveShoppingInfo.currentLiveInfo.elapsedTimeInSeconds}">
<c:set var="elapsed" value="${liveShoppingInfo.currentLiveInfo.elapsedTimeInSeconds}"/>
<fmt:parseNumber var="hours" integerOnly="true" value="${elapsed div 3600}"/>
<fmt:parseNumber var="minutes" integerOnly="true" value="${(elapsed mod 3600) div 60}"/>
<fmt:parseNumber var="secs" integerOnly="true" value="${elapsed mod 60}"/>
<c:out value="${String.format('%02d:%02d:%02d', hours, minutes, secs)}"/>
</p>
</c:when>
<c:otherwise>
<p class="live_time">LIVE</p>
</c:otherwise>
</c:choose>
</div>
<div class="live_img">
<img src="${cdnurl}${liveShoppingInfo.currentLiveInfo.thumbnailImageUrl}" alt="${liveShoppingInfo.currentLiveInfo.benefitTitle} 썸네일">
</div>
<div class="live_tit">
${fn:replace(liveShoppingInfo.currentLiveInfo.benefitTitle, '\\n', '<br/>')}
</div>
</div>
<div class="liveThum_tit">
${fn:replace(liveShoppingInfo.currentLiveInfo.broadcastDesc, '\\n', '<br/>')}
</div>
<c:if test="${not empty liveShoppingInfo.currentLiveInfo.mileageReward && liveShoppingInfo.currentLiveInfo.mileageReward > 0}">
<div class="topupPoint noSticky">
<span>방송 참여 시<i class="ico_mile"></i><b><fmt:formatNumber value="${liveShoppingInfo.currentLiveInfo.mileageReward}" pattern="#,###"/>원</b>적립</span>
</div>
</c:if>
<div class="bottomBtnControls">
<c:choose>
<c:when test="${not empty liveShoppingInfo.currentLiveInfo.participationUrl}">
<button class="btn lg full theme"
onclick="handleLiveParticipation(
'${liveShoppingInfo.currentLiveInfo.bnfInnb}',
'${liveShoppingInfo.currentLiveInfo.mileageReward}',
'${liveShoppingInfo.currentLiveInfo.participationUrl}'
)">
라이브쇼핑 참여하기
</button>
</c:when>
<c:otherwise>
<button class="btn lg full theme" disabled>참여 정보 없음</button>
</c:otherwise>
</c:choose>
</div>
<!-- 현재 라이브 중에도 알림신청 버튼은 항상 표시 -->
<div class="liveShopping__btnControls">
<button type="button"
class="btn live_btn ${liveShoppingInfo.notificationStatus eq 'Y' ? '' : 'outline'}"
onclick="toggleNotification(this)">
<i class="ico_alarm2"></i>
${liveShoppingInfo.notificationStatus eq 'Y' ? '알림신청 완료' : '알림신청'}
</button>
</div>
</c:when>
<%-- 2. 현재 라이브는 없지만, 예정된 방송이 있는 경우 --%>
<c:when test="${empty liveShoppingInfo.currentLiveInfo && not empty liveShoppingInfo.upcomingList}">
<c:set var="firstUpcoming" value="${liveShoppingInfo.upcomingList[0]}"/>
<div class="liveThumnail">
<div class="live_status">
<p class="live_time">
<c:if test="${not empty firstUpcoming.remainingTime && firstUpcoming.remainingTime > 0}">
<c:set var="remainingTime" value="${firstUpcoming.remainingTime}"/>
<c:set var="days" value="${remainingTime div (24 * 3600)}"/>
<c:set var="hours" value="${(remainingTime mod (24 * 3600)) div 3600}"/>
<c:set var="minutes" value="${(remainingTime mod 3600) div 60}"/>
<c:set var="seconds" value="${remainingTime mod 60}"/>
<fmt:parseNumber var="daysInt" integerOnly="true" value="${days}"/>
<fmt:parseNumber var="hoursInt" integerOnly="true" value="${hours}"/>
<fmt:parseNumber var="minutesInt" integerOnly="true" value="${minutes}"/>
<fmt:parseNumber var="secondsInt" integerOnly="true" value="${seconds}"/>
<c:if test="${daysInt > 0}">${daysInt}일 </c:if>
<c:if test="${hoursInt > 0}">${hoursInt}시간 </c:if>
<c:if test="${minutesInt > 0}">${minutesInt}분 </c:if>
<c:if test="${daysInt == 0 && hoursInt == 0 && minutesInt == 0 && secondsInt > 0}">${secondsInt}초 </c:if>
남음
</c:if>
<c:if test="${empty firstUpcoming.remainingTime || firstUpcoming.remainingTime <= 0}">
방송 예정
</c:if>
</p>
</div>
<div class="live_img">
<img src="${cdnurl}${firstUpcoming.thumbnailImageUrl}" alt="${firstUpcoming.benefitTitle} 썸네일">
</div>
<div class="live_tit">
${fn:replace(firstUpcoming.broadcastDesc, '\\n', '<br/>')}
</div>
</div>
<div class="liveThum_tit">
${fn:replace(firstUpcoming.benefitTitle, '\\n', '<br/>')}
</div>
<div class="liveShopping__btnControls">
<button type="button"
class="btn live_btn ${liveShoppingInfo.notificationStatus eq 'Y' ? '' : 'outline'}"
onclick="toggleNotification(this)">
<i class="ico_alarm2"></i>
${liveShoppingInfo.notificationStatus eq 'Y' ? '알림신청 완료' : '알림신청'}
</button>
</div>
</c:when>
<%-- 3. 현재 라이브도 없고, 예정된 방송도 없는 경우 --%>
<c:otherwise>
<div class="liveThumnail no-podcast">
<p class="tit">방송 준비중입니다.</p>
<p class="txt">다음 라이브 쇼핑을 기대해주세요.</p>
</div>
<div class="comment-box">
<p style="text-align: center; padding: 40px 0;">현재 진행중이거나 예정된 라이브 쇼핑이 없습니다.</p>
</div>
<!-- 방송이 없는 상태에서도 알림신청 버튼 추가 (모든 방송상태에서 표시) -->
<div class="liveShopping__btnControls">
<button type="button"
class="btn live_btn ${liveShoppingInfo.notificationStatus eq 'Y' ? '' : 'outline'}"
onclick="toggleNotification(this)">
<i class="ico_alarm2"></i>
${liveShoppingInfo.notificationStatus eq 'Y' ? '알림신청 완료' : '알림신청'}
</button>
</div>
</c:otherwise>
</c:choose>
<%-- 다음 라이브 목록 --%>
<c:if test="${not empty liveShoppingInfo.upcomingList}">
<ul class="liveThumList">
<c:choose>
<%-- 현재 라이브가 있는 경우 모든 예정 방송 표시 --%>
<c:when test="${not empty liveShoppingInfo.currentLiveInfo}">
<c:forEach items="${liveShoppingInfo.upcomingList}" var="upcoming">
<li>
<div class="thumnail">
<img src="${cdnurl}${upcoming.thumbnailImageUrl}" alt="${upcoming.benefitTitle} 썸네일">
<p>
<!-- 디버깅 테이블 제거하고 실제 로직 적용 -->
<c:choose>
<c:when test="${not empty upcoming.broadcastStartTime}">
<c:set var="dateTimeStr" value="${upcoming.broadcastStartTime}"/>
<!-- 2025-06-13T00:00:01 형태에서 날짜와 시간 추출 -->
<c:set var="datePart" value="${fn:substringBefore(dateTimeStr, 'T')}"/>
<c:set var="timePart" value="${fn:substringAfter(dateTimeStr, 'T')}"/>
<!-- 날짜 부분에서 월/일 추출 (2025-06-13 -> 6월 13일) -->
<c:set var="year" value="${fn:substringBefore(datePart, '-')}"/>
<c:set var="monthDay" value="${fn:substringAfter(datePart, '-')}"/>
<c:set var="month" value="${fn:substringBefore(monthDay, '-')}"/>
<c:set var="day" value="${fn:substringAfter(monthDay, '-')}"/>
<!-- 시간 부분에서 시:분 추출 (00:00:01 -> 00:00) -->
<c:set var="hour" value="${fn:substringBefore(timePart, ':')}"/>
<c:set var="minuteSecond" value="${fn:substringAfter(timePart, ':')}"/>
<c:set var="minute" value="${fn:substringBefore(minuteSecond, ':')}"/>
<!-- 0 제거하고 표시 -->
<fmt:parseNumber var="monthNum" value="${month}" integerOnly="true"/>
<fmt:parseNumber var="dayNum" value="${day}" integerOnly="true"/>
<fmt:parseNumber var="hourNum" value="${hour}" integerOnly="true"/>
<fmt:parseNumber var="minuteNum" value="${minute}" integerOnly="true"/>
${monthNum}월 ${dayNum}일<br>
<c:choose>
<c:when test="${hourNum < 10}">0${hourNum}</c:when>
<c:otherwise>${hourNum}</c:otherwise>
</c:choose>:<c:choose>
<c:when test="${minuteNum < 10}">0${minuteNum}</c:when>
<c:otherwise>${minuteNum}</c:otherwise>
</c:choose>
</c:when>
<c:otherwise>
방송 예정
</c:otherwise>
</c:choose>
</p>
</div>
<div class="txt1">다음라이브</div>
<div class="txt2">${upcoming.benefitTitle}</div>
<!-- 남은 시간 표시 -->
<c:choose>
<c:when test="${not empty upcoming.remainingTime && upcoming.remainingTime > 0}">
<div class="txt3" data-remaining-seconds="${upcoming.remainingTime}">
<c:set var="remainingTime" value="${upcoming.remainingTime}"/>
<c:set var="days" value="${remainingTime div (24 * 3600)}"/>
<c:set var="hours" value="${(remainingTime mod (24 * 3600)) div 3600}"/>
<c:set var="minutes" value="${(remainingTime mod 3600) div 60}"/>
<fmt:parseNumber var="daysInt" integerOnly="true" value="${days}"/>
<fmt:parseNumber var="hoursInt" integerOnly="true" value="${hours}"/>
<fmt:parseNumber var="minutesInt" integerOnly="true" value="${minutes}"/>
<c:if test="${daysInt > 0}">${daysInt}일 </c:if>
<c:if test="${hoursInt > 0}">${hoursInt}시간 </c:if>
<c:if test="${minutesInt > 0}">${minutesInt}분 </c:if>
남음
</div>
</c:when>
<c:otherwise>
<div class="txt3">방송 예정</div>
</c:otherwise>
</c:choose>
</li>
</c:forEach>
</c:when>
<%-- 현재 라이브가 없는 경우 첫 번째 이후 예정 방송 표시 --%>
<c:otherwise>
<c:if test="${fn:length(liveShoppingInfo.upcomingList) > 1}">
<c:forEach items="${liveShoppingInfo.upcomingList}" var="upcoming" begin="1">
<li>
<div class="thumnail">
<img src="${cdnurl}${upcoming.thumbnailImageUrl}" alt="${upcoming.benefitTitle} 썸네일">
<p>
<!-- 디버깅 테이블 제거하고 실제 로직 적용 -->
<c:choose>
<c:when test="${not empty upcoming.broadcastStartTime}">
<c:set var="dateTimeStr" value="${upcoming.broadcastStartTime}"/>
<!-- 2025-06-13T00:00:01 형태에서 날짜와 시간 추출 -->
<c:set var="datePart" value="${fn:substringBefore(dateTimeStr, 'T')}"/>
<c:set var="timePart" value="${fn:substringAfter(dateTimeStr, 'T')}"/>
<!-- 날짜 부분에서 월/일 추출 (2025-06-13 -> 6월 13일) -->
<c:set var="year" value="${fn:substringBefore(datePart, '-')}"/>
<c:set var="monthDay" value="${fn:substringAfter(datePart, '-')}"/>
<c:set var="month" value="${fn:substringBefore(monthDay, '-')}"/>
<c:set var="day" value="${fn:substringAfter(monthDay, '-')}"/>
<!-- 시간 부분에서 시:분 추출 (00:00:01 -> 00:00) -->
<c:set var="hour" value="${fn:substringBefore(timePart, ':')}"/>
<c:set var="minuteSecond" value="${fn:substringAfter(timePart, ':')}"/>
<c:set var="minute" value="${fn:substringBefore(minuteSecond, ':')}"/>
<!-- 0 제거하고 표시 -->
<fmt:parseNumber var="monthNum" value="${month}" integerOnly="true"/>
<fmt:parseNumber var="dayNum" value="${day}" integerOnly="true"/>
<fmt:parseNumber var="hourNum" value="${hour}" integerOnly="true"/>
<fmt:parseNumber var="minuteNum" value="${minute}" integerOnly="true"/>
${monthNum}월 ${dayNum}일<br>
<c:choose>
<c:when test="${hourNum < 10}">0${hourNum}</c:when>
<c:otherwise>${hourNum}</c:otherwise>
</c:choose>:<c:choose>
<c:when test="${minuteNum < 10}">0${minuteNum}</c:when>
<c:otherwise>${minuteNum}</c:otherwise>
</c:choose>
</c:when>
<c:otherwise>
방송 예정
</c:otherwise>
</c:choose>
</p>
</div>
<div class="txt1">다음라이브</div>
<div class="txt2">${upcoming.benefitTitle}</div>
<!-- 남은 시간 표시 -->
<c:choose>
<c:when test="${not empty upcoming.remainingTime && upcoming.remainingTime > 0}">
<div class="txt3" data-remaining-seconds="${upcoming.remainingTime}">
<c:set var="remainingTime" value="${upcoming.remainingTime}"/>
<c:set var="days" value="${remainingTime div (24 * 3600)}"/>
<c:set var="hours" value="${(remainingTime mod (24 * 3600)) div 3600}"/>
<c:set var="minutes" value="${(remainingTime mod 3600) div 60}"/>
<fmt:parseNumber var="daysInt" integerOnly="true" value="${days}"/>
<fmt:parseNumber var="hoursInt" integerOnly="true" value="${hours}"/>
<fmt:parseNumber var="minutesInt" integerOnly="true" value="${minutes}"/>
<c:if test="${daysInt > 0}">${daysInt}일 </c:if>
<c:if test="${hoursInt > 0}">${hoursInt}시간 </c:if>
<c:if test="${minutesInt > 0}">${minutesInt}분 </c:if>
남음
</div>
</c:when>
<c:otherwise>
<div class="txt3">방송 예정</div>
</c:otherwise>
</c:choose>
</li>
</c:forEach>
</c:if>
</c:otherwise>
</c:choose>
</ul>
</c:if>
<%-- 이벤트 설명 (다음 라이브 목록 아래로 이동) --%>
<c:if test="${not empty liveShoppingInfo.currentLiveInfo || not empty liveShoppingInfo.upcomingList}">
<div class="comment-box">
<c:choose>
<c:when test="${not empty liveShoppingInfo.currentLiveInfo}">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">이벤트 설명</p>
<p style="color:rgba(0,0,0,0.6); font-size:14px;">${fn:replace(liveShoppingInfo.currentLiveInfo.benefitDesc2, '\\n', '<br/>')}</p>
<c:if test="${not empty liveShoppingInfo.currentLiveInfo.contentDesc}">
<p style="font-size:14px; font-weight:bold; margin-top:10px; margin-bottom:5px;">방송 소개</p>
<p style="color:rgba(0,0,0,0.6); font-size:14px;">${fn:replace(liveShoppingInfo.currentLiveInfo.contentDesc, '\\n', '<br/>')}</p>
</c:if>
</c:when>
<c:otherwise>
<c:set var="firstUpcoming" value="${liveShoppingInfo.upcomingList[0]}"/>
<c:if test="${not empty firstUpcoming.benefitDesc2}">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">이벤트 설명</p>
<p style="color:rgba(0,0,0,0.6); font-size:14px;">${firstUpcoming.benefitDesc2}</p>
</c:if>
<c:if test="${not empty firstUpcoming.contentDesc}">
<p style="font-size:14px; font-weight:bold; margin-top:10px; margin-bottom:5px;">방송 소개</p>
<p style="color:rgba(0,0,0,0.6); font-size:14px;">${fn:replace(firstUpcoming.contentDesc, '\\n', '<br/>')}</p>
</c:if>
</c:otherwise>
</c:choose>
</div>
</c:if>
</div>
<!-- Top 버튼 -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonTopButton.jsp"/>
</main>
</div>
</div>
<input type="hidden" id="toggleNotificationUrl" value="<c:url value='/sopmal/bnft/toggleNotification'/>"/>
<input type="hidden" id="recordParticipationUrl" value="<c:url value='/sopmal/bnft/recordParticipation'/>"/>
<input type="hidden" id="awardRewardUrl" value="<c:url value='/sopmal/bnft/awardReward'/>"/>
<!-- 새로운 통합 API URL 추가 -->
<input type="hidden" id="recordAndRewardUrl" value="/sopmal/bnft/recordAndReward" />
<!-- 알림용 모달 추가 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p class="micromodal-box__text"></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,164 @@
<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<!DOCTYPE html>
<html lang="ko">
<head>
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonHead.jsp">
<jsp:param name="pageTitle" value="뉴트리코어 - 혜택" />
</jsp:include>
<script src="<%= request.getContextPath() %>/mobile/js/bnft/BnftMain.js" defer></script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header">
<div class="header__wrapper">
<div class="header__controls-wrapper">
<div class="header__controls">
<a class="header__home-link" href="">
<img src="<c:url value='/mobile/images/icon_top-logo.png'/>" alt="뉴트리코어">
</a>
<div class="header__btn-container">
<button class="header__btn"><i class="icon icon_nav-search"></i><span
class="visually-hidden">검색</span></button>
<button class="header__btn"><i class="icon icon_nav-cart"></i><span
class="visually-hidden">장바구니</span></button>
<button class="header__btn"><i class="icon icon_nav-menu"></i><span
class="visually-hidden">메뉴</span></button>
</div>
</div>
</div>
<nav class="home-category">
<div class="home-category__content">
<ul class="home-category__list">
<li class="home-category__item">
<a href="">성분별</a>
</li>
<li class="home-category__item">
<a href="">고민별</a>
</li>
<li class="home-category__item">
<a href="">베스트</a>
</li>
<li class="home-category__item">
<a href="">핫딜</a>
</li>
<li class="home-category__item">
<a href="">매거진</a>
</li>
<li class="home-category__item active">
<a href="">혜택</a>
</li>
<li class="home-category__item">
<a href="">카테고리</a>
</li>
</ul>
</div>
</nav>
</div>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonTabBar.jsp" />
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<!-- 배너 슬라이드 (배너가 있는 경우에만 표시) -->
<c:if test="${not empty banners}">
<div class="benefit_main_bannerWrap">
<div class="benefit_main_banner">
<c:forEach var="banner" items="${banners}">
<div class="benefit_bn">
<img src="${banner.scrReprsntImg}" alt="${banner.bnfSj}">
</div>
</c:forEach>
</div>
<div class="pagination">
<!-- Pagination buttons will be added here dynamically -->
</div>
</div>
</c:if>
<div class="benefit_main">
<h2 class="bnf_title">참여할때마다 마일리지, 쿠폰이!</h2>
<div class="benefitCategory">
<ul class="benefitCategory_list item_li">
<c:forEach var="benefit" items="${bnftMain.mainList}" varStatus="status">
<li class="benefit-item" style="opacity: 0; transform: translateY(20px);">
<c:choose>
<c:when test="${benefit.bnfDvCd eq '010'}">
<a href="<c:url value='/sopmal/bnft/attendanceCheckMain?bnfInnb=${benefit.bnfInnb}'/>">
</c:when>
<c:when test="${benefit.bnfDvCd eq '020'}">
<a href="<c:url value='/sopmal/bnft/stepcntMain?bnfInnb=${benefit.bnfInnb}'/>">
</c:when>
<c:when test="${benefit.bnfDvCd eq '030'}">
<a href="<c:url value='/sopmal/bnft/lucklottMain?bnfInnb=${benefit.bnfInnb}'/>">
</c:when>
<c:when test="${benefit.bnfDvCd eq '040'}">
<a href="<c:url value='/sopmal/bnft/rougameMain?bnfInnb=${benefit.bnfInnb}'/>">
</c:when>
<c:when test="${benefit.bnfDvCd eq '060'}">
<a href="<c:url value='/sopmal/bnft/evntviewMain?bnfInnb=${benefit.bnfInnb}'/>">
</c:when>
<c:when test="${benefit.bnfDvCd eq '070'}">
<a href="<c:url value='/sopmal/bnft/lvshopMain?bnfInnb=${benefit.bnfInnb}'/>">
</c:when>
<c:when test="${benefit.bnfDvCd eq '080'}">
<a href="<c:url value='/sopmal/bnft/discsharMain?bnfInnb=${benefit.bnfInnb}'/>">
</c:when>
<c:when test="${benefit.bnfDvCd eq '090'}">
<a href="<c:url value='/sopmal/bnft/conrevMain?bnfInnb=${benefit.bnfInnb}'/>">
</c:when>
<c:when test="${benefit.bnfDvCd eq '100'}">
<a href="<c:url value='/sopmal/bnft/intakchlMain?bnfInnb=${benefit.bnfInnb}'/>">
</c:when>
<c:when test="${benefit.bnfDvCd eq '120'}">
<a href="<c:url value='/sopmal/bnft/hlthsetMain?bnfInnb=${benefit.bnfInnb}'/>">
</c:when>
</c:choose>
<div class="img">
<img src="<c:url value='/mobile/images/bnft/bnf_list_icon${status.index + 1 < 10 ? "0" : ""}${status.index + 1}.png' />" alt="">
</div>
<c:if test="${benefit.isLive eq 'Y'}">
<div class="live" style="display:block;">
<img src="<c:url value='/mobile/images/bnft/bnf_list_icon_live.png'/>" alt="라이브">
</div>
</c:if>
<div class="txt">
<p class="tit1">${benefit.bnfSj}</p>
<p class="tit2">${benefit.cnDc}</p>
</div>
<c:choose>
<c:when test="${benefit.isParticipated eq 'Y'}">
<label class="check_done">참여완료</label>
</c:when>
<c:when test="${benefit.isRewarded eq 'Y'}">
<label class="check_done">혜택지급완료</label>
</c:when>
</c:choose>
<c:if test="${benefit.isNew eq 'Y' and (benefit.bnfDvCd eq '130' or benefit.bnfDvCd eq '150')}">
<label class="check_new">N</label>
</c:if>
</a>
</li>
</c:forEach>
</ul>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonFooter.jsp" />
</body>
</html>

View File

@@ -0,0 +1,90 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>앱 실행 페이지</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script>
document.addEventListener('DOMContentLoaded', function() {
console.log('[Called] Open App');
var sopmalCd = '<c:out value="${sopmalCd}" />';
var linkType = '<c:out value="${linkType}" />';
var bnfDvCd = '<c:out value="${bnfDvCd}" />';
var strInnb = '<c:out value="${strInnb}" />';
var schemeUrl = '';
var strparam = '?type=' + linkType + '&data=' + bnfDvCd + '|' + strInnb;
if(sopmalCd == 'NC') {
schemeUrl = 'nutricoreapp://benefit' + strparam;
} else if(sopmalCd == 'DT') {
schemeUrl = 'doctorleanapp://benefit' + strparam;
} else {
return;
}
console.log('schemeUrl : ' + schemeUrl);
var appAdrId = '';
var appIosId = '';
if(sopmalCd == 'NC') {
appAdrId = 'kr.co.nutricore.event.app';
appIosId = 'Nutricore 앱아이디';
} else if(sopmalCd == 'DT') {
appAdrId = 'kr.co.doctorlean.event.app';
appIosId = 'Doctorlean 앱아이디';
}
// Android & iOS fallback URL 설정
var adrFallbackUrl = 'https://play.google.com/store/apps/details?id=' + appAdrId;
var iosFallbackUrl = 'https://apps.apple.com'; // 임시로 App Store 메인
//var iosFallbackUrl = 'https://apps.apple.com/kr/app/' + appIosId;
// User Agent 기반 OS 체크
var ua = navigator.userAgent || navigator.vendor || window.opera;
var isAdr = /android/i.test(ua);
var isIos = /iPad|iPhone|iPod/.test(ua) && !window.MSStream;
console.log('isAdr : ' + isAdr);
console.log('isIos : ' + isIos);
var fallbackUrl = '';
if(isAdr) {
fallbackUrl = adrFallbackUrl;
} else if(isIos) {
fallbackUrl = iosFallbackUrl;
} else {
if(sopmalCd == 'NC') {
fallbackUrl = 'https://nutricore.co.kr';
} else if(sopmalCd == 'DT') {
fallbackUrl = 'https://doctorlean.co.kr';
}
}
// 0.5초후 앱 호출
setTimeout(function() {
window.location.href = schemeUrl;
}, 500);
// 사용자 이벤트 기반 앱 호출 처리
var btn = document.getElementById('openAppBtn');
btn.addEventListener('click', function() {
window.location.href = schemeUrl;
// 일정 시간 후 fallback
setTimeout(function() {
//window.location.href = fallbackUrl;
}, 2000); // 2초 후 fallback
});
});
</script>
</head>
<body>
<p>앱으로 이동하려면 아래 버튼을 눌러주세요.</p>
<button id="openAppBtn">앱 실행하기</button>
</body>
</html>

View File

@@ -0,0 +1,186 @@
ㅜ<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : OXquiz.jsp
Description : OX퀴즈
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-06-10 노태운 최초 생성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/oxquiz/Oxquiz.js"></script>
<script>
$(document).ready(function() {
$(".header__title").text("OX퀴즈");
$(".header__btn-container").empty();
// 헤더 버튼 제거 또는 필요한 버튼으로 수정
$(".header__btn-container").html(`
<button class="header__btn home-btn"><i class="icon icon_nav-home"></i><span class="visually-hidden">메인으로</span></button>
`);
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
$(".home-btn").on("click", function() {
window.location.href = '/';
});
});
// 알림용 모달 표시함수
function showCustomAlert(message) {
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="quizWrap">
<div class="quizThumnail">
<img src="<c:out value="${cdnurl}${screenInfo.basicInfo.scrReprsntImg}"/>"
onerror="this.src='/pc/images/image_placeholder.png'"
alt="도전! OX퀴즈 하루에 1문제씩 7개의 OX퀴즈를 맞춰주세요.">
</div>
<div class="quizDate">
<fmt:parseDate value="${screenInfo.basicInfo.bnfBgnDt}" pattern="yyyy-MM-dd'T'HH:mm:ss" var="parsedBgnDt" type="both" />
<fmt:parseDate value="${screenInfo.basicInfo.bnfEndDt}" pattern="yyyy-MM-dd'T'HH:mm:ss" var="parsedEndDt" type="both" />
<p><fmt:formatDate value="${parsedBgnDt}" pattern="yyyy.M.d" /> ~ <fmt:formatDate value="${parsedEndDt}" pattern="M.d" /></p>
</div>
<ul class="quizStamp">
<c:forEach var="quiz" items="${screenInfo.quizInfoList}" varStatus="status">
<li class="${quiz.isCorrect eq 'O' ? 'on' : ''}
${quiz.isCorrect eq 'X' ? 'on fail' : ''}
${quiz.quizSeq eq screenInfo.currentQuiz ? 'location' : ''}">
${quiz.quizSeq}
</li>
</c:forEach>
</ul>
</div>
<c:set var="currentQuiz" value="${screenInfo.quizInfoList.stream().filter(q -> q.quizSeq eq screenInfo.currentQuiz).findFirst().orElse(null)}" />
<div class="quizBox">
<div class="tit"><i class="ico_question"></i>
<c:choose>
<c:when test="${currentQuiz.quizSeq == 1}">첫 번째 퀴즈</c:when>
<c:when test="${currentQuiz.quizSeq == 2}">두 번째 퀴즈</c:when>
<c:when test="${currentQuiz.quizSeq == 3}">세 번째 퀴즈</c:when>
<c:when test="${currentQuiz.quizSeq == 4}">네 번째 퀴즈</c:when>
<c:when test="${currentQuiz.quizSeq == 5}">다섯 번째 퀴즈</c:when>
<c:when test="${currentQuiz.quizSeq == 6}">여섯 번째 퀴즈</c:when>
<c:when test="${currentQuiz.quizSeq == 7}">일곱 번째 퀴즈</c:when>
<c:otherwise>${currentQuiz.quizSeq}번째 퀴즈</c:otherwise>
</c:choose>
</div>
<div class="con">
<p class="txt">${currentQuiz.quizCn}</p>
<div class="qzSelect">
<a href="javascript:void(0);" class="checkO" data-answer="O">O</a>
<a href="javascript:void(0);" class="checkX" data-answer="X">X</a>
</div>
</div>
</div>
<div class="bottomBtnControls mg15">
<button class="btn lg theme outline" type="button" id="hintButton">힌트보기</button>
<c:choose>
<c:when test="${currentQuiz.userAnswer eq null}">
<button class="btn lg theme" type="button" id="quizResult">결과확인</button>
</c:when>
<c:otherwise>
<button class="btn lg gray" type="button" disabled>도전완료</button>
</c:otherwise>
</c:choose>
</div>
<div class="bottomAlram">
<p class="tit">OX퀴즈를 놓치지 않도록 알림신청 하세요.</p>
<button type="button" class="live_btn outline" id="notificationBtn">
<i class="ico_alarm2"></i><span id="notificationText">알림받기</span>
</button>
</div>
<div class="comment-box">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">이벤트 설명</p>
<p style="color:rgba(0,0,0,0.6); font-size:14px;">
<c:out value="${screenInfo.basicInfo.bnfWordsCn}" escapeXml="false" />
</p>
</div>
</div>
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/oxquiz/OxquizModal.jsp" />
</div>
</div>
<!-- 알림용 새로운 모달 추가 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<script>
const screenInfo = {
quizCount: ${screenInfo.quizCount},
currentQuiz: ${screenInfo.currentQuiz},
basicInfo: {
bnfInnb: ${screenInfo.basicInfo.bnfInnb},
bnfSj: "${fn:escapeXml(screenInfo.basicInfo.bnfSj)}",
scrReprsntImg: "${fn:escapeXml(screenInfo.basicInfo.scrReprsntImg)}",
bnfBgnDt: "${screenInfo.basicInfo.bnfBgnDt}",
bnfEndDt: "${screenInfo.basicInfo.bnfEndDt}",
bnfWordsCn: "${fn:escapeXml(screenInfo.basicInfo.bnfWordsCn)}"
},
quizInfoList: [
<c:forEach var="quiz" items="${screenInfo.quizInfoList}" varStatus="status">
{
bnfQuizInnb: ${quiz.bnfQuizInnb},
quizSeq: ${quiz.quizSeq},
quizCn: "${fn:escapeXml(quiz.quizCn)}",
quizCnsr: "${quiz.quizCnsr}",
hintUrl: "${quiz.hintUrl}",
userAnswer: ${quiz.userAnswer == null ? 'null' : '"'.concat(quiz.userAnswer).concat('"')},
isCorrect: ${quiz.isCorrect == null ? 'null' : '"'.concat(quiz.isCorrect).concat('"')}
}<c:if test="${!status.last}">,</c:if>
</c:forEach>
]
};
</script>
</body>
</html>

View File

@@ -0,0 +1,117 @@
<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<c:set var="currentQuiz" value="${quizInfo.quizInfoList[quizInfo.currentQuiz - 1]}" />
<!-- 정답 모달 -->
<div class="microModal microAlert" id="modal-1" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">잘 맞추셨네요!</h2>
</div>
<div class="microModal__content">
<p class="sub_tit">
${quizInfo.currentQuiz}번째 퀴즈, 정답은 <b class="c_blue">${currentQuiz.quizCnsr}</b>입니다.
</p>
<i class="modal-icon-mile">마일리지</i>
<p class="sub_tit">
마일리지 <fmt:formatNumber value="${quizInfo.rewardInfo['13010'].mlgRwdAmt}" type="number"/>원 획득
</p>
<p>
<c:choose>
<c:when test="${quizInfo.currentQuiz < quizInfo.quizCount}">
${quizInfo.currentQuiz + 1}번째 퀴즈도 내일 꼭! 도전하세요.
</c:when>
<c:otherwise>
모든 퀴즈에 도전해 주셔서 감사합니다!
</c:otherwise>
</c:choose>
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 오답 모달 -->
<div class="microModal microAlert" id="modal-2" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">아쉽네요!!</h2>
</div>
<div class="microModal__content">
<p class="sub_tit">
${quizInfo.currentQuiz}번째 퀴즈, 정답은 <b class="c_blue">${currentQuiz.quizCnsr}</b>입니다.
</p>
<i class="modal-icon-mile">마일리지</i>
<p class="sub_tit">
마일리지 <fmt:formatNumber value="${quizInfo.rewardInfo['13020'].mlgRwdAmt}" type="number"/>원 획득
</p>
<p>
<c:choose>
<c:when test="${quizInfo.currentQuiz < quizInfo.quizCount}">
${quizInfo.currentQuiz + 1}번째 퀴즈도 내일 꼭! 도전하세요.
</c:when>
<c:otherwise>
모든 퀴즈에 도전해 주셔서 감사합니다!
</c:otherwise>
</c:choose>
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 최종 성공 모달 -->
<div class="microModal microAlert" id="modal-3" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">도전! OX퀴즈 최종 성공!!</h2>
</div>
<div class="microModal__content">
<p class="sub_tit">
마지막 퀴즈, 정답은 <b class="c_blue">${currentQuiz.quizCnsr}</b>입니다.
</p>
<i class="modal-icon-mile">마일리지</i>
<i class="modal-icon-coupon2">쿠폰</i>
<p class="sub_tit">
마일리지 <fmt:formatNumber value="${quizInfo.rewardInfo['13030'].mlgRwdAmt}" type="number"/>원 &amp;
${quizInfo.rewardInfo['13030'].itmNm} 획득
</p>
<p>다음 OX 퀴즈에서 또 만나요!</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 힌트 모달 추가 -->
<div class="microModal microAlert" id="hintModal" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1" data-micromodal-close>
<div class="microModal__container" role="dialog" aria-modal="true">
<header class="microModal__header">
<h2 class="microModal__title" id="hintModalTitle">힌트</h2>
<button class="microModal__close" aria-label="Close modal" data-micromodal-close></button>
</header>
<main class="microModal__content" id="hintModalContent">
<!-- 힌트 내용이 여기에 로드됩니다 -->
</main>
</div>
</div>
</div>

View File

@@ -0,0 +1,125 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : PurstmpStampHistory.jsp
Description : 스탬프 적립내역
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-09-05 노태운 최초 생성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/atend/Atend.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("스탬프 적립내역");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").empty();
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/purstmpMain`;
});
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="stampCollectListWrap">
<div class="stampcollectTop">
<p class="txt1">${rewardProductInfo.stampList.exchangeTicketCount}장</p>
<p class="txt2">최근 12개월 이내</p>
</div>
<ul class="stampCollectList">
<!-- 스탬프가 실제로 적립된 내역만 필터링하여 표시 -->
<c:set var="hasStampHistory" value="false" />
<c:if test="${not empty rewardProductInfo.stampList.recentPurchases}">
<c:forEach var="stamp" items="${rewardProductInfo.stampList.recentPurchases}">
<!-- stmpCnt > 0인 경우만 표시 (실제 스탬프가 적립된 경우) -->
<c:if test="${stamp.stmpCnt > 0}">
<c:set var="hasStampHistory" value="true" />
<li>
<div class="txtTop">
<p class="shopName">${fn:escapeXml(stamp.branchName)}</p>
<fmt:parseDate value="${stamp.registDt}" pattern="yyyy-MM-dd HH:mm:ss" var="parsedDate" />
<p class="time"><fmt:formatDate value="${parsedDate}" pattern="yy-MM-dd HH:mm" /></p>
</div>
<div class="txtBm">
<p class="payment"><fmt:formatNumber value="${stamp.purchsAmt}" type="number"/>원 결제</p>
<p class="cnt">${stamp.stmpCnt}개</p>
</div>
</li>
</c:if>
</c:forEach>
</c:if>
<!-- 스탬프 적립내역이 없는 경우 안내 메시지 -->
<c:if test="${not hasStampHistory}">
<li>
<div style="text-align: center; padding: 40px 20px; color: #999;">
<p>스탬프 적립내역이 없습니다.</p>
<p style="font-size: 14px; margin-top: 10px;">오프라인 매장에서 구매하시면 스탬프가 적립됩니다.</p>
</div>
</li>
</c:if>
</ul><!--//stampCollectList-->
</div><!--//stampCollectListWrap-->
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/common/CommonFooter.jsp" />
</div>
</div>
<!-- 디버깅을 위한 스크립트 -->
<script>
console.log("Debug - 전체 구매내역 개수:", "${fn:length(rewardProductInfo.stampList.recentPurchases)}");
// 스탬프 적립내역 개수 계산
var stampCount = 0;
<c:forEach var="stamp" items="${rewardProductInfo.stampList.recentPurchases}">
<c:if test="${stamp.stmpCnt > 0}">
stampCount++;
</c:if>
</c:forEach>
console.log("Debug - 실제 스탬프 적립내역 개수:", stampCount);
</script>
</body>
</html>

View File

@@ -0,0 +1,67 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : PurstmpStampInProgress.jsp
Description : 모바일 스탬프
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-08-27 노태운 최초 생성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/purstmp/PurstmpStamp.js" defer></script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<!-- 여기에 모달이 열리지 않았을 때 표시할 내용을 넣을 수 있습니다 -->
</div>
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 모달 include -->
<jsp:include page="/WEB-INF/views/sopmal_m/bnft/purstmp/PurstmpStampModal.jsp" />
<script>
// CDN URL을 전역 변수로 설정
window.cdnUrl = "${cdnurl}";
document.addEventListener('DOMContentLoaded', function() {
// MicroModal 초기화 먼저
MicroModal.init({
disableScroll: true,
awaitCloseAnimation: true,
});
// DOM이 완전히 로드된 후 모달 열기
setTimeout(function() {
MicroModal.show('modal-stamp-collection');
}, 100);
});
</script>
</body>
</html>

View File

@@ -0,0 +1,166 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : PurstmpStamp.jsp
Description : 모바일 스탬프
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-08-28 홍길동 최초 생성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<script>
// screenInfo를 가장 먼저 정의
window.screenInfo = {
rewardImagePath: '<c:url value="/sopmal/bnft/image?path=${uploaddirs}${fn:escapeXml(stampList.purstmpScreenInfo[0].imgFilCours)}"/>',
bnfInnb: "${fn:escapeXml(stampList.purstmpScreenInfo[0].bnfInnb)}",
purstmpScreenInfo: [
<c:forEach var="screenInfo" items="${stampList.purstmpScreenInfo}" varStatus="screenStatus">
{
bnfInnb: "${fn:escapeXml(screenInfo.bnfInnb)}",
cnSj: "${fn:escapeXml(screenInfo.cnSj)}",
imgFilCours: "${fn:escapeXml(screenInfo.imgFilCours)}",
wordsCn: "${fn:escapeXml(screenInfo.wordsCn)}"
}<c:if test="${not screenStatus.last}">,</c:if>
</c:forEach>
],
couponList: [
<c:forEach var="coupon" items="${stampList.couponList}" varStatus="couponStatus">
{
exchangeable: "${fn:escapeXml(coupon.exchangeable)}",
sopmalCd: "${fn:escapeXml(coupon.sopmalCd)}",
strInnb: "${fn:escapeXml(coupon.strInnb)}",
stmpValidDt: "${fn:escapeXml(coupon.stmpValidDt)}",
extiketStmpCnt: ${coupon.extiketStmpCnt},
bnfExtiketInnb: ${coupon.bnfExtiketInnb},
mbrDvCd: "${fn:escapeXml(coupon.mbrDvCd)}",
storeName: "${fn:escapeXml(coupon.storeName)}",
registDt: "${fn:escapeXml(coupon.registDt)}",
exchngAt: "${fn:escapeXml(coupon.exchngAt)}",
updtDt: "${fn:escapeXml(coupon.updtDt)}",
isExchangeable: ${coupon.isExchangeable},
daysUntilExpiration: ${coupon.daysUntilExpiration},
mbrInnb: ${coupon.mbrInnb},
exchngDt: "${fn:escapeXml(coupon.exchngDt)}"
}<c:if test="${not couponStatus.last}">,</c:if>
</c:forEach>
],
totalStamps: ${stampList.totalStamps},
availableExchangeTickets: ${stampList.availableExchangeTickets},
mbrInnb: ${stampList.mbrInnb},
mbrDvCd: "${fn:escapeXml(stampList.mbrDvCd)}",
sopmalCd: "${fn:escapeXml(stampList.sopmalCd)}"
};
// 디버깅용 콘솔 출력
console.log("screenInfo 초기화 완료:", window.screenInfo);
console.log("쿠폰 목록 개수:", window.screenInfo.couponList.length);
console.log("전체 스탬프 수:", window.screenInfo.totalStamps);
// coupons 배열을 별도로 설정 (기존 코드 호환성)
window.screenInfo.coupons = window.screenInfo.couponList;
console.log("coupons 배열 설정 완료:", window.screenInfo.coupons.length);
</script>
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/purstmp/PurstmpStamp.js" defer></script>
<style>
#modal-close-btn {
border: none !important;
outline: none !important;
background: transparent !important;
padding: 0 !important;
}
#modal-close-btn:focus,
#modal-close-btn:active {
border: none !important;
outline: none !important;
box-shadow: none !important;
}
</style>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="availableReview">
<div class="microModal microFullScreen" id="modal-stamp-collection" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1" data-micromodal-close>
<div class="microModal__container" role="dialog" aria-modal="true" aria-labelledby="modal-stamp-collection-title">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title card__title" id="modal-stamp-collection-title">
<span class="card_title"><b></b>개의 적립카드가 있습니다.</span>
</h2>
<button class="microModal__close" aria-label="창 닫기" id="modal-close-btn"></button>
</div>
<div class="microModal__content">
<!-- 스탬프 카드 섹션 -->
<div class="stampCardWrap">
<!-- 스탬프 카드는 JavaScript로 동적 생성됩니다 -->
</div>
<div class="stampCardComement">
<p>발급된 교환권은 쿠폰함에서 확인하세요.</p>
<div class="fullBtnSection">
<a href="<c:url value='/sopmal/mpage/bnef/selectCouponDtlsForm'/>" class="btn outline sm theme full" style="font-size: 10px; white-space: nowrap; text-align: center; display: flex; align-items: center; justify-content: center; min-height: 40px;">내 쿠폰함</a>
<a href="<c:url value='/sopmal/bnft/purstmpHistory'/>" class="btn outline sm theme full" style="font-size: 11px; white-space: nowrap; text-align: center; display: flex; align-items: center; justify-content: center; min-height: 40px;">스탬프 적립내역</a>
</div>
</div>
<div class="stampCardGiftWrap">
<div class="stampCardGift">
<div class="productInfoBox">
<p class="img"><img src="" alt="이달의 선물" id="rewardImage"></p>
<div class="txt">
<p class="txt1">이달의 선물</p>
<p class="txt2" id="rewardName">이달의 선물</p>
</div>
</div>
<div class="ps">
※ 스탬프 적립매장에서만 교환 가능합니다.<br>
※ 교환 시점 기준으로 이달의 선물이 제공됩니다.
</div>
</div>
</div>
<div class="comment-box mg16">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">이벤트 설명</p>
<p style="color:rgba(0,0,0,0.6); font-size:14px;" id="eventDescription"></p>
</div>
</div>
</div>
<!-- 모달 내부에 토스트 추가 -->
<div id="modal_exchange_ticket_toast" class="toastPop">교환권 발급 완료</div>
</div>
</div>
</div>
</div>
</div>
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,247 @@
<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%--
Class Name : QREvntMain.jsp
Description : QR 이벤트
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-09-25 노태운 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/qrevnt/QREvntMain.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("모바일 스탬프");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button id="statsButton" class="header__btn"><i class="icon icon_nav-home"></i><span class="visually-hidden">메인으로</span></button>
`);
// 메인으로 이동
$("#statsButton").on('click', function() {
window.location.href = "<c:url value='/'/>";
});
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
});
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="qr-event-container">
<%-- strInnb 값을 hidden input에 저장 --%>
<input type="hidden" id="strInnb" value="${vo.strInnb}">
<%-- bnfInnb 값을 hidden input에 저장 --%>
<input type="hidden" id="bnfInnb" value="${bnfInnb}">
<!-- QR 이벤트 정보 표시 영역 -->
<div id="qrEventInfo">
<c:if test="${not empty qrEventData.eventInfo}">
<h1>${qrEventData.eventInfo[0].bnfSj}</h1>
</c:if>
<p>참여 매장: <span id="storeName">${qrEventData.storeInfo.strNm}</span></p>
</div>
</div>
</div>
</main>
</div>
</div>
<!-- 모달: 이미 참여함 또는 응모 불가능 -->
<div class="microModal microFullScreen" id="modal-message" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top bdb_none">
<button class="microModal__close" aria-label="창 닫기"></button>
</div>
<div class="microModal__content">
<div class="qrEventWrap">
<%-- 서버 응답 메시지 사용 --%>
<p class="txt01" id="modalMessage"></p>
<c:if test="${not empty qrEventData.eventInfo}">
<p class="date">이벤트 기간: ${fn:substring(qrEventData.eventInfo[0].bnfBgnDt, 0, 10)} ~ ${fn:substring(qrEventData.eventInfo[0].bnfEndDt, 0, 10)}</p>
</c:if>
<p class="txt02">기간 내 ID당 1회만 참여 가능합니다.</p>
<p class="txt03 ico01">다음 이벤트도 기대해 주세요.</p>
<div class="bottomBtnControls">
<button class="btn lg full theme" onclick="location.href='<c:url value="/"/>'">홈으로</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 모달: 당첨 시 안내 -->
<div class="microModal microFullScreen" id="modal-winning" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top bdb_none">
<button class="microModal__close" aria-label="창 닫기"></button>
</div>
<div class="microModal__content">
<div class="qrEventWrap">
<p class="txt01">축하합니다!</p>
<c:if test="${not empty qrEventData.eventInfo}">
<p class="date">이벤트 기간: ${fn:substring(qrEventData.eventInfo[0].bnfBgnDt, 0, 10)} ~ ${fn:substring(qrEventData.eventInfo[0].bnfEndDt, 0, 10)}</p>
</c:if>
<p class="txt02">기간 내 ID당 1회만 참여 가능합니다.</p>
<p class="txt03 ico02">
<%-- 당첨 처리 결과에서 매장명 사용 --%>
<span id="winningStoreName"></span>
QR코드 이벤트에 당첨되셨습니다.
</p>
<div class="bottomBtnControls">
<button class="btn lg full theme" onclick="QREvent.viewCoupon()">선물확인</button>
</div>
<p class="txt04">선물확인 후 매장에서 교환하세요.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 모달: 미당첨 -->
<div class="microModal microFullScreen" id="modal-notwinning" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top bdb_none">
<button class="microModal__close" aria-label="창 닫기"></button>
</div>
<div class="microModal__content">
<div class="qrEventWrap">
<p class="txt01">아쉬워요!</p>
<p class="txt02" id="notWinningMessage">이번에는 당첨되지 않았네요.</p> <%-- 서버 메시지 반영 가능 --%>
<p class="txt03 ico03">다음 이벤트를 기대해 주세요.</p>
<div class="bottomBtnControls">
<button class="btn lg full theme" onclick="location.href='<c:url value="/"/>'">홈으로</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 모달: 선물확인 (쿠폰 상세) -->
<div class="microModal microFullScreen" id="modal-coupon" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top bdb_none bg">
<button class="microModal__close" aria-label="창 닫기"></button>
</div>
<div class="microModal__content">
<div class="qrEventGiftWrap">
<p class="tit">지금 바로 매장에서 교환하세요.</p>
<div class="qrCouponBox">
<p class="qcNo">No. <span id="couponNo"></span></p>
<p class="qcCnt" id="couponContent"></p>
<p class="qcTxt01" id="couponDiscountType"></p>
<p class="qcTxt02" id="couponTerms"></p>
<p class="qcTxt03" id="couponValidity"></p>
</div>
<p class="txt">이 쿠폰은 <b id="couponStoreName"></b>에서만<br>사용 가능합니다.</p>
<a href="/sopmal/mpage/bnef/selectCouponDtlsForm" class="btn sm outline theme">내 쿠폰함에서 보기</a>
</div>
<div class="comment-box mg16">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">이벤트 설명</p>
<c:if test="${not empty qrEventData.eventInfo}">
<p style="color:rgba(0,0,0,0.6); font-size:14px;">${qrEventData.eventInfo[0].bnfWordsCn}</p>
</c:if>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 모달: 진행중인 이벤트 없음 -->
<div class="microModal microFullScreen" id="modal-no-event" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top bdb_none">
<button class="microModal__close" aria-label="창 닫기"></button>
</div>
<div class="microModal__content">
<div class="qrEventWrap">
<p class="txt01" id="noEventMessage">진행 중인 QR 이벤트가 없습니다.</p>
<p class="txt02" id="noEventDetailMessage">현재 운영 중인 QR 이벤트가 없거나 이벤트 기간이 아닙니다.</p>
<p class="txt03 ico01">새로운 이벤트를 기대해 주세요!</p>
<div class="bottomBtnControls">
<button class="btn lg full theme" onclick="location.href='<c:url value="/sopmal/bnft/bnftMain"/>'">혜택 메인으로</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
// 서버 데이터를 JS 전역 변수로 설정
<c:choose>
<c:when test="${not empty qrEventData}">
var participationResult = {
success: ${qrEventData.autoParticipation},
isWinner: ${qrEventData.isWinner},
alreadyParticipated: '${not empty qrEventData.participationStatus and not empty qrEventData.participationStatus.alreadyParticipated ? qrEventData.participationStatus.alreadyParticipated : "false"}' === 'true',
message: '${qrEventData.autoParticipation ? qrEventData.message : (empty qrEventData.participationStatus ? qrEventData.message : qrEventData.participationStatus.message)}',
participationId: ${not empty qrEventData.participationId ? qrEventData.participationId : 'null'}
};
// 에러 코드 및 메시지 설정
<c:if test="${not empty qrEventData.errorCode}">
var qrEventErrorCode = '${qrEventData.errorCode}';
var qrEventMessage = '${qrEventData.message}';
<c:if test="${not empty qrEventData.detailMessage}">
var qrEventDetailMessage = '${qrEventData.detailMessage}';
</c:if>
</c:if>
</c:when>
<c:otherwise>
// 데이터가 없는 경우 기본값 설정
var qrEventErrorCode = 'NO_EVENT';
var qrEventMessage = '진행 중인 QR 이벤트가 없습니다.';
var qrEventDetailMessage = '현재 운영 중인 QR 이벤트가 없거나 이벤트 기간이 아닙니다.';
</c:otherwise>
</c:choose>
<c:if test="${not empty qrEventData.storeInfo}">
var storeInfo = {
strNm: '${qrEventData.storeInfo.strNm}',
strAdres: '${qrEventData.storeInfo.strAdres}'
};
</c:if>
</script>
</body>
</html>

View File

@@ -0,0 +1,303 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : RouletteGame.jsp
Description : 룰렛게임 페이지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-06-20 노태운 최초 작성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/rougame/Rougame.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("룰렛게임");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button id="statsButton" class="header__btn"><i class="icon icon_nav-home"></i><span class="visually-hidden">메인으로</span></button>
`);
// 메인으로 이동
$("#statsButton").on('click', function() {
window.location.href = "<c:url value='/'/>";
});
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
});
// 알림용 모달 표시 함수
function showCustomAlert(message) {
// 기존 모달 스타일을 활용한 새로운 알림 모달
$('#modal-alert .microModal__content p').text(message);
MicroModal.show('modal-alert');
}
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- EL 태그를 사용하여 screeninfo 객체 설정 -->
<c:set var="screeninfo" value="${screenInfo}" />
<c:set var="remainingchancesinfo" value="${remainingChancesInfo}" />
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="rouletteWrap">
<!-- 룰렛게임 시작 -->
<div class="roulette">
<div class="rouletteImg">
<img src="<c:out value="${cdnurl}${screenInfo.scrReprsntImg}"/>"
onerror="this.src='/pc/images/image_placeholder.png'"
alt="뉴트리코어몰에서 구매하셨다면 잊지말고 돌려주세요! 구매한만큼 룰렛 돌리고 마일리지, 쿠폰 챙기자!">
</div>
<div class="rouletteCnt">
남은기회 <b>${remainingchancesinfo.remainingGameChances}</b>번
</div>
<div class="rouletteInbox">
<div class="roulette-container">
<!-- segments 데이터를 data 속성으로 저장 -->
<c:forEach var="reward" items="${screenInfo.rewards}" varStatus="status">
<input type="hidden"
class="segment-data"
data-rank="<c:choose>
<c:when test="${reward.bnfRwdCateDvCd eq '04010'}">1</c:when>
<c:when test="${reward.bnfRwdCateDvCd eq '04020'}">2</c:when>
<c:when test="${reward.bnfRwdCateDvCd eq '04030'}">3</c:when>
<c:when test="${reward.bnfRwdCateDvCd eq '04040'}">4</c:when>
<c:when test="${reward.bnfRwdCateDvCd eq '04050'}">5</c:when>
<c:when test="${reward.bnfRwdCateDvCd eq '04060'}">6</c:when>
<c:when test="${reward.bnfRwdCateDvCd eq '04070'}">7</c:when>
<c:when test="${reward.bnfRwdCateDvCd eq '04080'}">8</c:when>
<c:otherwise>0</c:otherwise>
</c:choose>"
data-code="${reward.bnfRwdCateDvCd}"
data-label="${reward.itmNm}">
</c:forEach>
<!-- screenInfo 데이터를 hidden input으로 저장 -->
<input type="hidden" id="scrRwdLinkUrl" value="${fn:escapeXml(screenInfo.scrRwdLinkUrl)}">
<input type="hidden" id="bnfInnb" value="${fn:escapeXml(screenInfo.bnfInnb)}">
<div class="ico_hand"></div>
<div class="roulette-pointer">룰렛포인터</div>
<div class="roulette-icons">
<i class="ri01">아이콘1</i>
<i class="ri02">아이콘2</i>
<i class="ri03">아이콘3</i>
</div>
<canvas id="rouletteCanvas" width="700" height="700"></canvas>
<button id="spinButton" type="button" class="rouletteBtn">돌리기</button>
</div>
<!-- 당첨 얼러트 창1 -->
<div class="microModal microAlert" id="resultPopup" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
당첨을 축하합니다!
</h2>
</div>
<div class="microModal__content">
<i class="modal-icon-present">선물</i>
<p class="sub_tit">
<p id="resultText">50% 할인쿠폰</p>
</p>
<p>
MY혜택 > 쿠폰에서 확인하세요.
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
</div>
</div>
<ul class="bm_txt">
<li>※ 구매금액 <fmt:formatNumber value="${screenInfo.benefitParticipation.amtForChg}" pattern="#,##0"/>원 당 1번씩의 기회가 주어집니다.</li>
<li>※ 구매금액 확인은 구매가 확정되는 시점을 기준으로 합니다.</li>
</ul>
<!--// 룰렛게임 끝 -->
</div>
<!-- 설명안내 시작 -->
<div class="comment-box">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">이벤트 설명</p>
<p style="color:rgba(0,0,0,0.6); font-size:14px; white-space: pre-wrap;">
<c:out value="${screeninfo.bnfWordsCn}" escapeXml="false" />
</p>
</div>
<!--// 설명안내 끝 -->
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<script>
// data-micromodal-trigger 속성을 가진 버튼을 클릭하면 해당 ID의 모달이 열림
// 모달 배경화면 스크롤 방지
MicroModal.init(
{
disableScroll: true,
awaitCloseAnimation: true,
});
// 풀스크린 팝업 트리거 이벤트 리스너
$('.fullscreen-trigger').on('click', function (e) {
e.preventDefault();
var modalId = $(this).attr('data-micromodal-trigger');
openModal(modalId);
});
// 풀스크린 팝업 닫기 이벤트 리스너
$('.microModal .microModal__close').on('click', function () {
var modalId = $(this).closest('.microModal').attr('id');
closeModal(modalId);
});
// 풀스크린 팝업 뒤로가기 이벤트 리스너
window.addEventListener('popstate', function (event) {
var modalId = window.location.hash.replace('#', '');
if (modalId) {
closeModal(modalId);
} else {
$('.microModal').each(function () {
MicroModal.close($(this).attr('id'));
});
}
document.body.style.overflow = '';
});
if (window.location.hash) {
var modalId = window.location.hash.replace('#', '');
openModal(modalId);
}
</script>
<!-- 당첨 얼러트 창1 -->
<div class="microModal microAlert" id="modal-1" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
당첨을 축하합니다!
</h2>
</div>
<div class="microModal__content">
<i class="modal-icon-present">선물</i>
<p class="sub_tit">
50% 할인쿠폰
</p>
<p>
MY혜택 > 쿠폰에서 확인하세요.
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 미당첨 얼러트 창2 -->
<div class="microModal microAlert" id="modal-2" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
조금 아쉽지만 내일 또 도전!
</h2>
</div>
<div class="microModal__content">
<i class="modal-icon-lose">꽝</i>
<p class="sub_tit">
마일리지 10원 적립
</p>
<p>
MY혜택 > 마일리지에서 확인하세요.
</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 알림용 새로운 모달 추가 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 품절 안내 모달 추가 -->
<div class="microModal microAlert" id="modal-no-reward" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">안내</h2>
</div>
<div class="microModal__content">
<p class="sub_tit">현재 모든 보상이 품절되었습니다.</p>
<p>다음 기회에 다시 도전해주세요!</p>
</div>
</div>
<div class="microModal__btnContainer">
<button id="btn-go-main" class="microModal__btn microModal__btn-primary" aria-label="메인으로 이동">확인</button>
</div>
</div>
</div>
</div>
</body>

View File

@@ -0,0 +1,281 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<%--
Class Name : Stepcnt.jsp
Description : 만보기 페이지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-06-27 노태운 최초 작성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/stepcnt/Stepcnt.js" defer></script>
<script src="<%= request.getContextPath() %>/mobile/js/bnft/stepcnt/Chart.bundle.min.js"></script>
<script>
$(document).ready(function() {
$(".header__title").text("만보기");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").html(`
<button class="header__btn" onclick="location.href='/sopmal/bnft/stepcntSettings'"><i class="icon icon_nav-set"></i><span class="visually-hidden">설정</span></button>
`);
// 뒤로 가기 버튼 클릭 이벤트
$(".header__toBack__btn").on("click", function() {
window.location.href = `/sopmal/bnft/bnftMain`;
});
});
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="stepTodayWrap">
<!-- 만보기차트 시작 -->
<div class="stepChart">
<div class="cnt_step">
<b><fmt:formatNumber value="${stepcntInfo.currentStepInfo.stepCount != null ? stepcntInfo.currentStepInfo.stepCount : 0}" pattern="#,###"/></b>걸음
</div>
<div class="cnt_detail">
<div class="cnt_km">
<b><fmt:formatNumber value="${stepcntInfo.distanceInKm != null ? stepcntInfo.distanceInKm : 0}" pattern="#,##0.00"/></b>km
</div>
<div class="cnt_kcal">
<b><fmt:formatNumber value="${stepcntInfo.caloriesBurned != null ? stepcntInfo.caloriesBurned : 0}" pattern="#,##0.0"/></b>kcal
</div>
</div>
<div class="stepGrpWrap">
<canvas id="myChart"></canvas>
<!-- 차트 이미지 추가 (캔버스에 차트가 그려지므로 스타일만 유지) -->
<p style="margin: 0 auto;"></p>
<p class="tit1">목표달성</p>
<p class="tit2"><b id="progressRateValue">${stepcntInfo.progressRate != null ? Math.round(stepcntInfo.progressRate) : 0}</b>%</p>
<p class="ico"><img src="<c:url value='/mobile/images/bnft/walk.gif'/>" alt="걷는사람"></p>
<p class="tit3">조금 더 걸어볼까요?</p>
</div>
<div class="stepInboxWrap">
<div class="step_inbox">
<p class="tit1">깜짝선물까지</p>
<i class="ico_step01"></i>
<c:choose>
<c:when test="${stepcntInfo.giftReceived == 'Y'}">
<span class="tit2" id="giftText" style="display: none;"></span>
<button type="button" class="tit2 btn-disabled" id="giftButton" disabled>수령완료</button>
</c:when>
<c:when test="${stepcntInfo.currentStepInfo.stepCount >= stepcntInfo.surpriseGiftInfo.surprisePosition}">
<span class="tit2" id="giftText" style="display: none;"></span>
<button type="button" class="tit2 btn Att-check" id="giftButton">
<i class="ico_check_white"></i>선물받기
</button>
</c:when>
<c:otherwise>
<span class="tit2" id="giftText">
<fmt:formatNumber value="${stepcntInfo.surpriseGiftInfo.surprisePosition - stepcntInfo.currentStepInfo.stepCount}" pattern="#,###"/> 걸음
</span>
<button type="button" class="tit2" id="giftButton" style="display: none;">선물받기</button>
</c:otherwise>
</c:choose>
</div>
<div class="step_inbox">
<p class="tit1">마일리지 획득까지</p>
<i class="ico_step02"></i>
<c:choose>
<c:when test="${stepcntInfo.mileageReceived == 'Y'}">
<span class="tit2" id="mileageText" style="display: none;"></span>
<button type="button" class="tit2 btn-disabled" id="mileageButton" disabled>수령완료</button>
</c:when>
<c:when test="${stepcntInfo.currentStepInfo.stepCount >= stepcntInfo.nextTarget.targetStep}">
<span class="tit2" id="mileageText" style="display: none;"></span>
<button type="button" class="tit2 btn Att-check" id="mileageButton">
<i class="ico_check_white"></i>마일리지받기
</button>
</c:when>
<c:otherwise>
<span class="tit2" id="mileageText">
<fmt:formatNumber value="${stepcntInfo.nextTarget.remainingSteps}" pattern="#,###"/> 걸음
</span>
<button type="button" class="tit2" id="mileageButton" style="display: none;">마일리지받기</button>
</c:otherwise>
</c:choose>
</div>
</div>
</div>
<!--// 만보기차트 끝 -->
<!-- 만보기도장 시작 -->
<div class="stepStamp">
<div class="stepStampBox1">
<p class="tit"><b>이번 달</b>,<br>만보 걷기 <b><span id="monthlySuccessCount">${stepcntInfo.achievementCount != null ? stepcntInfo.achievementCount : 0}</span>번 성공!</b></p>
<i class="ico_step"></i>
<ul class="stampPaper" id="stampList">
<!-- 스탬프는 JavaScript로 동적 생성됨 -->
<c:forEach begin="1" end="10" varStatus="status">
<c:choose>
<c:when test="${status.count <= stepcntInfo.achievementCount}">
<li class="success">성공</li>
</c:when>
<c:when test="${status.count == 10}">
<li>응모완료</li>
</c:when>
<c:otherwise>
<li>대기</li>
</c:otherwise>
</c:choose>
</c:forEach>
</ul>
</div>
<div class="stepStampBox2">
<c:set var="defaultImageUrl"><c:url value='/mobile/images/bnft/walk_product_default.png'/></c:set>
<a href="${stepcntInfo.baseInfo != null ? stepcntInfo.baseInfo.rewardLinkUrl : '#'}">
<div class="product_img">
<img src="${cdnurl}${stepcntInfo.baseInfo.rewardImg}" alt="보상 이미지">
</div>
<div class="product_txt">
<p class="tit1"><b>10번 성공시</b><br>이달의 제품받기 <b>자동응모!</b></p>
<c:choose>
<c:when test="${stepcntInfo.baseInfo != null && stepcntInfo.baseInfo.monthlyRewardName != null}">
<p class="tit2">이달의 상품 : ${stepcntInfo.baseInfo.monthlyRewardName}</p>
<p class="tit2">획득가능 마일리지 : <fmt:parseNumber value="${stepcntInfo.baseInfo.monthlyRewardMileage}" integerOnly="true" /> 원</p>
</c:when>
<c:otherwise>
<p class="tit2">획득가능 마일리지 : <fmt:parseNumber value="${stepcntInfo.baseInfo.monthlyRewardMileage}" integerOnly="true" /> 원</p>
</c:otherwise>
</c:choose>
</div>
</a>
</div>
<div class="stepStampBox3">
<ul class="walkAvg">
<li>
<p class="tit1">하루 평균</p>
<i class="ico_step03_1"></i>
<p class="tit2"><b>${stepcntInfo.monthlyStats.avgStepCount}</b>걸음</p>
</li>
<li>
<p class="tit1">마일리지</p>
<i class="ico_step03_2"></i>
<p class="tit2"><b><fmt:formatNumber value="${stepcntInfo.monthlyStats.totalMileage != null ? stepcntInfo.monthlyStats.totalMileage : 0}" pattern="#,###"/></b>원 획득</p>
</li>
<li>
<p class="tit1">깜짝선물</p>
<i class="ico_step03_3"></i>
<p class="tit2"><b id="surpriseGiftCountDisplay"><fmt:formatNumber value="${stepcntInfo.monthlyStats.surpriseGiftCount != null ? stepcntInfo.monthlyStats.surpriseGiftCount : 0}" pattern="#,###"/></b>회 획득</p>
</li>
</ul>
</div>
</div>
<!--// 만보기도장 끝 -->
<!-- 만보기달력 시작 -->
<div class="stepCalendar">
<p class="month-tit">
<!-- JavaScript에서 동적으로 채워집니다 -->
</p>
<div class="calendar">
<div class="weekdays">
<div class="day">일</div>
<div class="day">월</div>
<div class="day">화</div>
<div class="day">수</div>
<div class="day">목</div>
<div class="day">금</div>
<div class="day">토</div>
</div>
<div class="stepDays">
<!-- 달력 날짜는 JavaScript로 동적 생성됨 -->
</div>
</div>
</div>
<ul class="stepCalendarRegend">
<li><span>2,500~</span></li>
<li><span>5,000~</span></li>
<li><span>7,500~</span></li>
<li><span>10,000~</span></li>
</ul>
<!--// 만보기달력 끝 -->
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 히든 필드 -->
<input type="hidden" id="bnfInnb" name="bnfInnb" value="${stepcntInfo.surpriseGiftInfo.bnfInnb}">
<input type="hidden" id="todayGiftCategory" value="${stepcntInfo.surpriseGiftInfo.rewardCategoryCode}">
<input type="hidden" id="todayGiftCondition" value="${stepcntInfo.surpriseGiftInfo.surprisePosition}">
<input type="hidden" id="currentStepCount" value="${stepcntInfo.currentStepInfo.stepCount}">
<input type="hidden" id="progressRate" value="${stepcntInfo.progressRate}">
<input type="hidden" id="achievementCount" value="${stepcntInfo.achievementCount}">
<input type="hidden" id="giftReceived" value="${stepcntInfo.giftReceived}">
<input type="hidden" id="mileageReceived" value="${stepcntInfo.mileageReceived}">
<input type="hidden" id="monthlyRewardReceived" value="${stepcntInfo.monthlyRewardReceived}">
<input type="hidden" id="useAt" value="${stepcntInfo.useAt}">
<!-- 알림용 모달 -->
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p></p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" data-micromodal-close aria-label="창 닫기">확인</button>
</div>
</div>
</div>
</div>
<!-- 동의 안내 모달 -->
<div class="microModal microAlert" id="modal-consent" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__content">
<p style="text-align: center; font-weight: bold; margin-bottom: 15px;">만보기 서비스 이용 동의</p>
<p style="margin-bottom: 10px;">만보기 서비스를 이용하시려면<br>개인정보 수집·이용에 동의해주세요.</p>
<p style="font-size: 14px; color: #666;">설정 페이지에서 동의하실 수 있습니다.</p>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-secondary" data-micromodal-close aria-label="창 닫기">취소</button>
<button class="microModal__btn microModal__btn-primary" onclick="goToSettings()" aria-label="설정 페이지로 이동">동의하러 가기</button>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,66 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : StepcntSettings.jsp
Description : 만보기 설정 페이지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-06-27 노태운 최초 작성
--%>
<!DOCTYPE html>
<html>
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
<link rel="stylesheet" href="<c:url value='/mobile/css/bnft/bnft.css'/>">
<!-- 스크립트 추가 이벤트영역 encomms -->
<script src="<%= request.getContextPath() %>/mobile/js/bnft/stepcnt/StepcntSettings.js" defer></script>
<script>
$(document).ready(function() {
$(".header__title").text("만보기 설정");
// 기존 헤더의 버튼들을 커스텀 버튼으로 대체
$(".header__btn-container").empty();
});
</script>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<fieldset class="toggle">
<label>
<span>만보기 사용</span>
<input role="switch" type="checkbox" id="stepcntUseYn"
name="stepcntUseYn" value="Y">
</label>
</fieldset>
<div class="comment-box">
<p style="font-size:14px; font-weight:bold; margin-bottom:5px;">이벤트 설명</p>
<!-- JavaScript에서 동적으로 내용이 채워집니다 -->
</div>
</div>
</main>
</div>
</div>
<input type="hidden" id="bnfInnb" name="bnfInnb" value="${bnfInnb.bnfInnb}">
</body>
</html>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,677 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : NoticeListR.jsp
Description :모바일 샘플.jsp
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-02 최남식 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function () {
/*헤더에 타이틀 set*/
const title = '<c:out value="${resultMap.bbsInfo.bbsNm}"/>';
fn_set_header_title(title);
fn_collect_event();
//1.등록 버튼을 클릭한다
$("#regBtn").on("click", function () {
$("#closeModalTarget").val("confirm_reg_alert");
openConfirmModal(function (onSuccess) {
fn_regist_bbsctt(onSuccess);//등록함수
}, 'confirm_reg_alert'
, '#regCfrmBtn'
, 'success_reg_alert'
, '#regSuccessBtn'
, fn_move_list);
});
});
/*************************************************************
이벤트 함수
*************************************************************/
const fn_collect_event = () => {
MicroModal.init(
{
disableScroll: true,
awaitCloseAnimation: true,
});
/*휴대전화 포매팅 함수*/
fn_set_event("#answMbtlnb","input",fn_fmt_telno);
//내용 텍스트 <br>태그 엔터값으로 replace
const textarea = $("textarea[name=cn]");
let cn = textarea.attr("placeholder");
cn = fn_remove_tag(cn);
textarea.attr("placeholder", cn);
//분류 change시 hidden value값 set
$('#qesitmNmC').on('change', function () {
$("#qesitmInnb").val("");
$("#qesitmNm").val("");
$("#answCn").val("");
const option = $('option:selected', this);
console.log(option);
const qesitmInnb = $(option).attr('qesitm-innb');
const answCn = $(option).attr('answ-Cn');
const qesitmNm = $(option).attr('qesitm-nm');
if ($(this).val() !== "") {
$("#qesitmInnb").val(qesitmInnb);
$("#answCn").val(answCn);
$("#qesitmNm").val(qesitmNm);
$("#qesitmAt").val("Y");
} else {
$("#qesitmInnb").val("");
$("#answCn").val("");
$("#qesitmNm").val("");
$("#qesitmAt").val("N");
}
if(option.val() == '1022901') {
$('textarea[name="cn"]').val('회사명 or 판매자명 : \n웹사이트 주소(인스타그램,카페,홈페이지 등) : \n공동구매 희망 제품 : \n담당자 연락처 :');
} else {
$('textarea[name="cn"]').val('');
}
});
//추가입력 항목 라디오 'click' 이벤트
$('.answRadioC').on('click', function () {
const radio = $(this);
//추가입력 항목 내용 요소 get
const answ = radio.closest("div").find('[name="answCnArr[]"]');
//추가입력 항목 내용 요소 get
const qesitmInnb = radio.closest("div").find('[name="qesitmInnbArr[]"]');
//라디오 클릭으로 인한 제어 요소 get
const contrlTarget = radio.closest("div").find('.answRadio');
//항목 고유번호 내용 요소 get
const itmInnb = radio.closest("div").find('[name="itmInnbArr[]"]');
//라디오 클릭 시 disabled 비활성
if (radio.is(":checked")) {
//답변 내용 초기화
answ.val("");
const radioVal = $(radio).attr('itm-cn');
answ.val(radioVal);
//항목 내용 set
qesitmInnb.val("");
const qesitmInnbVal = $(radio).attr('qesitm-innb');
qesitmInnb.val(qesitmInnbVal);
//항목고유번호 내용 set
itmInnb.val("");
const itmInnbVal = $(radio).val();
itmInnb.val(itmInnbVal);
//라디오 주위 input값 disable false처리
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
radio.closest("div").find(".answRadioAt").val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
radio.closest("div").find(".answRadioAt").val("N");
});
}
});
//추가입력 항목 셀렉트 'change'이벤트
$(document).on('change', '.answSelectC', function () {
const select = $(this);
const answ = select.closest("div").find('[name="answCnArr[]"]');
const qesitmInnb = select.closest("div").find('[name="qesitmInnbArr[]"]');
const contrlTarget = select.closest("div").find('.answSelect');
const option = $('option:selected', this);
if (select.val() != "") {
//답변 내용 초기화
answ.val("");
const selectVal = $(option).attr('itm-cn');
answ.val(selectVal);
//항목 내용 set
qesitmInnb.val("");
const qesitmInnbVal = $(option).attr('qesitm-innb');
qesitmInnb.val(qesitmInnbVal);
//셀렉트 주위 input값 disable false처리
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
select.closest("div").find(".answSelectAt").val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
select.closest("div").find(".answSelectAt").val("N");
});
}
});
//추가입력 항목 체크박스 'click'이벤트
$(document).on('click', '.answChkC', function () {
const check = $(this);
const contrlTarget = check.closest("div").find('.answChk');
var isChecked = $(this).is(":checked");
//클릭한 체크박스 주위 input값 disable false처리
contrlTarget.each(function () {
if (isChecked) {
$(this).prop("disabled", false);
} else {
$(this).prop("disabled", true);
}
});
// 체크된 체크박스가 하나라도 있는지 확인
let anyChecked = $('.answChkC:checked').length > 0;
contrlTarget.each(function () {
if (anyChecked) {
check.closest("td").find(".answChkAt").val("Y");
} else {
check.closest("td").find(".answChkAt").val("N");
}
});
});
//추가입력 항목 텍스트 'input'이벤트
$(document).on('input', '.answTxtC', function () {
const txt = $(this);
const contrlTarget = txt.closest("div").find('.answTxt');
const contrlAt = txt.closest("div").find('.answTxtAt');
//클릭한 체크박스 주위 input값 disable false처리
if (txt.val() != "") {
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
contrlAt.val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
contrlAt.val("N");
});
}
});
//파일 업로드
$(document).on("change", "#fileUpload", function () {
addFiles(event, 0);
});
/*sms알림요청 체크 시에만 휴대전화 입력폼 활성화*/
$("#answSmsRecptn").on('click', function() {
const target = $(this).closest(".userForm__inputBox__item").find("#answMbtlnb");
if(this.checked) {
target.prop("disabled", false);
} else {
target.prop("disabled", true);
}
});
}
/*textarea내 태그 제거 함수*/
const fn_remove_tag = (cn) => {
cn = cn.replaceAll(/<br>/ig, '\n');
cn = cn.replaceAll(/<\/br>/ig, '\n');
cn = cn.replaceAll(/<br \/>/ig, '\n');
//내용 내 태그 없애기
cn = cn.replace(/<\/?[^>]+(>|$)/g, "");
cn = decodeHTMLEntities(cn);
return cn;
}
// HTML 엔티티 디코딩 함수
const decodeHTMLEntities = (str) => {
const txt = document.createElement('textarea');
txt.innerHTML = str;
return txt.value;
}
//목록 조회에서 취소 누를 시 해당 게시판 목록으로 이동
const fn_move_list = () => {
const form = document.createElement("form");
form.id = "listForm";
form.action = "/sopmal/csc/selectSubPageListForm";
form.method = "POST";
fn_create_input("bbsId", $("#bbsId").val(), form);
document.body.appendChild(form);
form.submit();
}
//input 생성 함수
const fn_create_input = (name, value, tgtForm) => {
const input = document.createElement('input');
input.setAttribute("type", "hidden");
input.setAttribute("name", name);
input.setAttribute("value", value);
tgtForm.appendChild(input);
}
/*********************************************************
* 게시글 등록
*********************************************************/
const fn_regist_bbsctt = function (onsuccess) {
let url = '<c:url value="/sopmal/csc/insertBbscttRegist"/>';
let saveForm = $('#bbsRegForm');
let formData = new FormData();
//파일 업로드
if ($("#image-dropzone").length > 0) {
let myDropzone = Dropzone.forElement("#image-dropzone");
myDropzone.files.forEach(function (file) {
formData.append("files", file);
});
}
$('.checkbox input[type="checkbox"]').each(function () {
if (!$(this).prop('checked')) {
fn_ctrl_disable([".checkbox"],);
}
});
//폼 내 input값 append
saveForm.serializeArray().forEach(function (item) {
formData.append(item.name, item.value);
});
//사용자 등록 시 노출 여부 Y
formData.append("expsrAt", "Y");
disableButton("#regCfrmBtn");
$.ajax({
type: 'post',
url: url,
enctype: "multipart/form-data",
data: formData,
processData: false,
contentType: false,
success: function (result) {
onsuccess();
}
});
enableButton("#regCfrmBtn");
fn_ctrl_disable("", [".checkbox"]);
}
const fn_prevent_click = (event) => {
event.preventDefault(); // 체크박스 상태 변경 방지
}
</script>
<body>
<c:set value = "${resultMap.regusrInfo}" var = "regusrInfo"/>
<c:set value = "${resultMap.bbscttVO}" var = "bbscttVO"/>
<c:set value = "${resultMap.bbsInfo}" var = "bbsInfo"/>
<c:set value = "${resultMap.qesitmList.qesitmList}" var = "qesitmList"/>
<c:set value = "${resultMap.qesitmList.itmCnList}" var = "itmCnList"/>
<c:set value = "${resultMap.itmList}" var = "itmList"/>
<!-- 메인 컨텐츠 영역 -->
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="myQnaEdit">
<div class="sub-box">
<form id="bbsRegForm">
<%--리스트에서 등록으로 왔는지 단순 등록인지 체크--%>
<input type = "hidden" id = "listAt" value = "<c:out value = '${bbscttVO.listAt}'/>" name = "listAt"/>
<input type = "hidden" id = "bbsId" value = "<c:out value = '${bbsInfo.bbsId}'/>" name = "bbsId"/>
<input type = "hidden" id = "bbsInfo" value = "<c:out value = '${bbsInfo.bbsInfo}'/>" name = "bbsInfo"/>
<input type = "hidden" id = "bbscttSndngMthCd" value = "<c:out value = '${bbsInfo.bbscttSndngMthCd}'/>" name = "bbscttSndngMthCd"/>
<input type = "hidden" id = "regusrDvCd" value = "<c:out value = '${bbscttVO.regusrDvCd}'/>" name = "regusrDvCd"/>
<div class="userForm">
<div class="userForm__inputBox">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">이름<span
class="required-asterisk">*</span>
</div>
<c:choose>
<c:when test="${regusrInfo.regusrDvCd eq '99'}">
<input type="text" class="input-text full" name="regusrNm"
placeholder="이름" title="이름">
</c:when>
<c:otherwise>
<div class="td-inner"><c:out value='${regusrInfo.regusrNm}'/></div>
<input type="hidden" name="regusrNm" value="tempNm">
</c:otherwise>
</c:choose>
</div>
<c:if test="${bbsInfo.answRegist eq 'Y' && bbsInfo.bbscttSndngMthCd ne '03'}"><%--답변사용여부와 게시글 문자사용여부 체크--%>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">답변받기</div>
<c:if test="${empty regusrInfo.answMbtlnb}">
<input class="input-text full" type="text" title="해당 인풋에 대한 설명"
placeholder="'-'없이 입력" id="answMbtlnb" name="answMbtlnb"
maxlength="13">
</c:if>
<div class="b-checkbox-container">
<label class="b-checkbox is-medium checkbox">
<input class="termCheck" type="checkbox" name="answSmsRecptn"
value="Y" id="answSmsRecptn" checked>
<span class="check"></span>
<span class="control-label">SMS 알림요청</span>
</label>
</div>
</div>
</c:if>
<c:if test="${not empty itmList}">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">문의 유형<span
class="required-asterisk">*</span></div>
<div class="select-box">
<%--문항답변필수여부 --%>
<input type="hidden" name="qesitmEssntlAtArr[]" value="Y">
<%--문항명 --%>
<input type="hidden" name="qesitmNmArr[]" id="qesitmNm" value="분류"/>
<%--문항고유번호 --%>
<input type="hidden" name="qesitmInnbArr[]" id="qesitmInnb"/>
<%--답변내용 --%>
<input type="hidden" name="answCnArr[]" id="answCn"/>
<%--답변여부 --%>
<input type="hidden" name="qesitmAtArr[]" id="qesitmAt" value="N">
<select class="md" id="qesitmNmC" name="itmInnbArr[]">
<option value="">선택</option>
<c:forEach var="itm" items="${itmList}" varStatus="status">
<option value="<c:out value="${itm.itmInnb}"/>"
qesitm-innb="${itm.qesitmInnb}"
answ-Cn="${itm.itmCn}"
qesitm-nm="${itm.qesitmNm}">
<c:out value="${itm.itmCn}"/>
</option>
</c:forEach>
</select>
</div>
</div>
</c:if>
<c:if test="${not empty qesitmList}">
<div class="reviewRadio">
<c:forEach var="qesitmList" items="${qesitmList}">
<c:if test="${ qesitmList.itmTyCd eq '01'}">
<%--라디오 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<div class="custom-radio-container">
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt}"
class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm}">
<input type="hidden" name="qesitmAtArr[]"
class="answRadioAt qesitmAtChk" value="N">
<input type="hidden" name="qesitmInnbArr[]"
class="answRadio"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" name="answCnArr[]" class="answRadio"
disabled>
<input type="hidden" name="itmInnbArr[]" class="answRadio"
disabled>
<c:forEach items="${itmCnList}" var="itmCnList1"
varStatus="status">
<c:if test="${itmCnList1.qesitmInnb eq qesitmList.qesitmInnb}">
<div class="custom-radio is-medium">
<input type="radio"
name="itmInnbArr<c:out value="${ qesitmList.qesitmInnb }"/>[]"
id="answCn<c:out value="${ status.index }"/>"
class="answRadioC"
value="<c:out value="${ itmCnList1.itmInnb}"/>"
qesitm-innb='<c:out value="${itmCnList1.qesitmInnb}"/>'
itm-cn="<c:out value="${ itmCnList1.itmCn }"/>">
<label for="answCn<c:out value="${ status.index }"/>">
<c:out value="${ itmCnList1.itmCn }"/>
</label>
</div>
</c:if>
</c:forEach>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '02'}">
<%--셀렉트 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }" class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answSelectAt qesitmAtChk" value="N">
<input type="hidden" name="qesitmInnbArr[]" class="answSelect"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" name="answCnArr[]" class="answSelect" disabled>
<div class="select-box">
<select class="md answSelectC" name="itmInnbArr[]">
<option value="">전체</option>
<c:forEach items="${itmCnList}" var="itmCnList2">
<c:if test="${itmCnList2.qesitmInnb eq qesitmList.qesitmInnb}">
<option value="${ itmCnList2.itmInnb }"
itm-cn="${ itmCnList2.itmCn}"
qesitm-innb='${itmCnList2.qesitmInnb}'>${ itmCnList2.itmCn }</option>
</c:if>
</c:forEach>
</select>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '03'}">
<%--체크박스 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }" class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answChkAt qesitmAtChk"
value="N">
<div class="b-checkbox-container">
<c:forEach items="${itmCnList}" var="itmCnList3">
<c:if test="${itmCnList3.qesitmInnb eq qesitmList.qesitmInnb}">
<label class="b-checkbox checkbox">
<input type="hidden" class="answChk"
name="qesitmInnbArr[]"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" class="answChk"
name="answCnArr[]"
value="${ itmCnList3.itmCn }" disabled>
<input type="checkbox" class="answChkC"
name="itmInnbArr[]"
value="${ itmCnList3.itmInnb }">
<span class="check"></span>
<span class="control-label">${ itmCnList3.itmCn }</span>
</label>
</c:if>
</c:forEach>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '04'}">
<%--텍스트 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<div class="reviewRadio__inputRow">
<c:forEach items="${itmCnList}" var="itmCnList4">
<c:if test="${itmCnList4.qesitmInnb eq qesitmList.qesitmInnb}">
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }"
class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answTxtAt qesitmAtChk" value="N">
<input type="hidden" class="answTxt"
name="qesitmInnbArr[]"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" class="answTxt"
name="itmInnbArr[]"
value="${ itmCnList4.itmInnb }" disabled>
<input class="input-text full answTxtC" type="text"
name="answCnArr[]" title="추가문항답변"
placeholder="${ itmCnList4.itmCn }"
maxlength="666">
</c:if>
</c:forEach>
</div>
</div>
</c:if>
</c:forEach>
</div>
</c:if>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">제목<span
class="required-asterisk">*</span></div>
<input class="input-text full" type="text" title="해당 인풋에 대한 설명" name="sj"
maxlength='100'
placeholder="제목을 입력하세요." value="">
<c:if test="${bbsInfo.secretBbsctt eq 'Y'}">
<div class="b-checkbox-container">
<label class="b-checkbox is-medium checkbox">
<input type="checkbox" value="Y" name="secretBbscttAt" class="secretBbsctt" checked
<c:if test = "${bbsInfo.bbsTyCd eq '05'}">onclick ="fn_prevent_click(event)"</c:if>>
<span class="check"></span>
<span class="control-label">비밀글</span>
</label>
</div>
</c:if>
</div>
<c:if test="${regusrInfo.regusrDvCd eq '99'}">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">비밀번호<span class="required-asterisk">*</span></div>
<input class="input-text full" type="password" title="비밀번호 입력란"
name="password" maxlength='20' placeholder="비밀번호를 입력하세요."/>
</div>
</c:if><%--추가 문항 영역--%>
<c:if test="${not empty qesitmList}">
<c:forEach var="qesitmList" items="${qesitmList}">
<c:if test="${ qesitmList.itmTyCd eq '01'}">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle"><c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}"><span class="required-asterisk">*</span></c:if>
</div>
</div>
</c:if>
</c:forEach>
</c:if>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">내용</div>
<textarea class="textarea" rows="9" name="cn" placeholder="<c:out value = "${bbsInfo.dftCn}"/>"></textarea>
</div>
<%--게시판설정(파일첨부사용여부)--%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.extensions.images')" var="acceptFileExtensions"/>
<c:if test="${bbsInfo.filAtch eq 'Y'}">
<div class="fileUplaod">
<div class="fileUplaod__title">이미지 등록(3장)</div>
<div class="dropzone-wrapper">
<div class="dropzone" id="image-dropzone"></div>
</div>
<ul class="infoList">
<li>사진첨부는 최대 10MB 이하이며 3개까지 등록할 수 있습니다.</li>
<li>등록 가능 파일은 ${acceptFileExtensions} 파일만 가능합니다.</li>
<li>상품과 무관한 내용이거나 음란 불법적인 내용은 통보없이 삭제할 수 있습니다.</li>
</ul>
</div>
<input type = "hidden" name = "acceptFileExtensions" id = "acceptFileExtensions" value = "${acceptFileExtensions}"/>
<input type = "hidden" value = "<c:out value = '${bbsInfo.filAtch}'/>" name ="filAtch">
</c:if>
<div class="bottomBtnControls">
<button type="button" class="btn xl theme" id = "regBtn"><spring:message code="button.insert"/>하기</button>
<button type="button" style="display:none;" data-micromodal-trigger="successRegModal" id = "successBtn"></button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</main>
</div>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/comm/mobile/Footer.jsp"/>
</div>
</body>
<%--등록 성공 모달--%>
<div class="microModal microAlert" id="successRegModal" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
<spring:message code="success.common.insert"/>
</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" id = "alertBtn"><spring:message code="button.ok"/></button>
</div>
</div>
</div>
</div>
<script>
// Dropzone 파일업로드
if ($("#image-dropzone").length > 0) {
const maxFiles = 3;
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("#image-dropzone", {
url: "/file-upload",
maxFilesize: 10,
maxFiles: maxFiles,
acceptedFiles: "${acceptFileExtensions}",
autoProcessQueue: false,
addRemoveLinks: true,
dictDefaultMessage: "",
dictRemoveFile: "삭제",
dictCancelUpload: "취소",
dictCancelUploadConfirmation: "업로드를 취소하시겠습니까?",
dictInvalidFileType: "이 파일은 업로드할 수 없습니다.",
dictFileTooBig: "파일이 너무 큽니다. ({{filesize}}MB). 최대 파일 크기: {{maxFilesize}}MB.",
dictMaxFilesExceeded: "파일을 더 이상 추가할 수 없습니다.",
dictResponseError: "서버에서 응답을 받지 못했습니다.",
});
var inputElement = $('input[type="file"].dz-hidden-input');
// name 부여
inputElement.attr('name', 'file');
// id 부여
inputElement.attr('id', 'fileUpload');
// 파일 추가 이벤트
myDropzone.on("addedfile", function(file) {
if (myDropzone.files.length >= maxFiles) {
$(".dz-message").hide();
}
});
myDropzone.on("removedfile", function(file) {
if (myDropzone.files.length < maxFiles) {
$(".dz-message").show();
}
});
myDropzone.on("maxfilesexceeded", function(file) {
const dictMaxFilesExceeded = myDropzone.options.dictMaxFilesExceeded;
alert(dictMaxFilesExceeded);
this.removeFile(file);
$(file.previewElement).find(".dz-remove").attr("disabled", true);
});
}
</script>
</html>

View File

@@ -0,0 +1,620 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : BbscttRegistPopupC.jsp
Description : 게시글 등록 팝업 폼
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-05-09 김혜인 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<script>
$(document).ready(function () {
/*파일 temp 배열 초기화*/
filesTempArr = [];
//내용 텍스트 <br>태그 엔터값으로 replace
const textarea = $("textarea[name=cn]");
let cn = textarea.attr("placeholder");
if (cn) {
cn = fn_remove_tag(cn);
textarea.attr("placeholder", cn);
}
fn_set_niceSelect_datePicker("#bbsRegForm");
/*휴대전화 포매팅*/
fn_set_event("#answMbtlnb", "keyup", fn_fmt_telno);
//분류 change시 hidden value값 set
$('#qesitmNmC').on('change', function () {
$("#qesitmInnb").val("");
$("#qesitmNm").val("");
$("#answCn").val("");
const option = $('option:selected', this);
const qesitmInnb = $(option).attr('qesitm-innb');
const answCn = $(option).attr('answ-Cn');
const qesitmNm = $(option).attr('qesitm-nm');
if ($(this).val() !== "") {
$("#qesitmInnb").val(qesitmInnb);
$("#answCn").val(answCn);
$("#qesitmNm").val(qesitmNm);
$("#qesitmAt").val("Y");
} else {
$("#qesitmInnb").val("");
$("#answCn").val("");
$("#qesitmNm").val("");
$("#qesitmAt").val("N");
}
});
//추가입력 항목 라디오 'click' 이벤트
$('.answRadioC').on('click', function () {
const radio = $(this);
//추가입력 항목 내용 요소 get
const answ = radio.closest(".custom-radio-container").find('[name="answCnArr[]"]');
//추가입력 항목 내용 요소 get
const qesitmInnb = radio.closest(".custom-radio-container").find('[name="qesitmInnbArr[]"]');
//라디오 클릭으로 인한 제어 요소 get
const contrlTarget = radio.closest(".custom-radio-container").find('.answRadio');
//항목 고유번호 내용 요소 get
const itmInnb = radio.closest(".custom-radio-container").find('[name="itmInnbArr[]"]');
//라디오 클릭 시 disabled 비활성
if (radio.is(":checked")) {
//답변 내용 초기화
answ.val("");
const radioVal = $(radio).attr('itm-cn');
answ.val(radioVal);
//항목 내용 set
qesitmInnb.val("");
const qesitmInnbVal = $(radio).attr('qesitm-innb');
qesitmInnb.val(qesitmInnbVal);
//항목고유번호 내용 set
itmInnb.val("");
const itmInnbVal = $(radio).val();
itmInnb.val(itmInnbVal);
//라디오 주위 input값 disable false처리
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
radio.closest(".custom-radio-container").find(".answRadioAt").val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
radio.closest(".custom-radio-container").find(".answRadioAt").val("N");
});
}
});
//추가입력 항목 셀렉트 'change'이벤트
$('.answSelectC').on('change', function () {
const select = $(this);
const answ = select.closest("reviewRadio__item").find('[name="answCnArr[]"]');
const qesitmInnb = select.closest("reviewRadio__item").find('[name="qesitmInnbArr[]"]');
const contrlTarget = select.closest("reviewRadio__item").find('.answSelect');
const option = $('option:selected', this);
if (select.val() != "") {
//답변 내용 초기화
answ.val("");
const selectVal = $(option).attr('itm-cn');
answ.val(selectVal);
//항목 내용 set
qesitmInnb.val("");
const qesitmInnbVal = $(option).attr('qesitm-innb');
qesitmInnb.val(qesitmInnbVal);
//셀렉트 주위 input값 disable false처리
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
select.closest("reviewRadio__item").find(".answSelectAt").val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
select.closest("reviewRadio__item").find(".answSelectAt").val("N");
});
}
});
//추가입력 항목 체크박스 'click'이벤트
$('.answChkC').on('click', function () {
const check = $(this);
const contrlTarget = check.closest("div").find('.answChk');
var isChecked = $(this).is(":checked");
//클릭한 체크박스 주위 input값 disable false처리
contrlTarget.each(function () {
if (isChecked) {
$(this).prop("disabled", false);
} else {
$(this).prop("disabled", true);
}
});
// 체크된 체크박스가 하나라도 있는지 확인
let anyChecked = $('.answChkC:checked').length > 0;
contrlTarget.each(function () {
if (anyChecked) {
check.closest("reviewRadio__item").find(".answChkAt").val("Y");
} else {
check.closest("reviewRadio__item").find(".answChkAt").val("N");
}
});
});
//추가입력 항목 텍스트 'input'이벤트
$('.answTxtC').on('input', function () {
const txt = $(this);
const contrlTarget = txt.closest(".reviewRadio__inputRow").find('.answTxt');
const contrlAt = txt.closest(".reviewRadio__inputRow").find('.answTxtAt');
//클릭한 체크박스 주위 input값 disable false처리
if (txt.val() != "") {
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
contrlAt.val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
contrlAt.val("N");
});
}
});
//파일 업로드
$("#fileUpload").on("change", function () {
addFiles(event, 0);
});
//등록 버튼 이벤트
$("#regBtn").on("click", function () {
$("#closeModalTarget").val("confirm_reg_alert");
if($("#reqDv").val() === 'goodsDtl') {//상품 상세에서 등록 시
openConfirmModal(function (onSuccess) {
fn_regist_bbsctt(onSuccess);//등록함수
}, 'confirm_reg_alert'
, '#regCfrmBtn'
, 'success_reg_alert'
, '#regSuccessBtn'
, fn_select_qna, '1');
}else{
openConfirmModal(function (onSuccess) {
fn_regist_bbsctt(onSuccess);//등록함수
}, 'confirm_reg_alert'
, '#regCfrmBtn'
, 'success_reg_alert'
, '#regSuccessBtn');
}
});
});
/*********************************************************
* 게시글 등록
*********************************************************/
if (typeof fn_regist_bbsctt === 'undefined') {
function fn_regist_bbsctt(onsuccss) {
let url = '<c:url value="/sopmal/csc/insertBbscttRegist"/>';
let saveForm = $('#bbsRegForm');
let formData = new FormData();
//파일 업로드
if ($("#image-dropzone").length > 0) {
let myDropzone = Dropzone.forElement("#image-dropzone");
myDropzone.files.forEach(function (file) {
formData.append("files", file);
});
}
//여부 N처리
$('.chkAt').each(function () {
if (!$(this).prop('checked')) {
$(this).val("N");
}
});
//폼 내 input값 append
saveForm.serializeArray().forEach(function (item) {
formData.append(item.name, item.value);
});
//사용자 등록 시 노출 여부 Y
formData.append("expsrAt", "Y");
disableButton("#regCfrmBtn");
$.ajax({
type: 'post',
url: url,
enctype: "multipart/form-data",
data: formData,
processData: false,
contentType: false,
success: function (result) {
closeModal("authPop");
onsuccss();
}
});
enableButton("#regCfrmBtn");
fn_ctrl_disable("", [".checkbox"]);
}
}
/*상품qna 버튼 클릭 제어*/
if (typeof fn_prevent_click === 'undefined') {
function fn_prevent_click(event){
event.preventDefault(); // 체크박스 상태 변경 방지
}
}
</script>
<body>
<c:set value = "${resultMap.regusrInfo}" var = "regusrInfo"/>
<c:set value = "${resultMap.bbscttVO}" var = "bbscttVO"/>
<c:set value = "${resultMap.bbsInfo}" var = "bbsInfo"/>
<c:set value = "${resultMap.qnaGoodsInfo}" var = "qnaGoodsInfo"/>
<c:set value = "${resultMap.qesitmList.qesitmList}" var = "qesitmList"/>
<c:set value = "${resultMap.qesitmList.itmCnList}" var = "itmCnList"/>
<c:set value = "${resultMap.itmList}" var = "itmList"/>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.extensions.images')" var="acceptFileExtensions"/><%--허용파일확장자--%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/><%--이미지경로--%>
<!--권한 조회 후 jsp 분기-->
<div class="microModal microFullScreen" id="authPop" aria-hidden="true" style="position: relative; z-index: 1000;">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
<c:out value="${bbsInfo.bbsNm}"/>
</h2>
<button class="microModal__close" onclick="closeModal('authPop');"></button>
</div>
<div class="microModal__content">
<div class="microModal__inner">
<form id="bbsRegForm">
<div class="userForm">
<div class="userForm__inputBox">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">이름<span class="required-asterisk">*</span></div>
<c:choose>
<c:when test = "${regusrInfo.regusrDvCd eq '99'}">
<input class="input-text full" type="text" title="해당 인풋에 대한 설명" name="regusrNm" title="작성자명">
</c:when>
<c:otherwise>
<input class="input-text full" type="text" title="해당 인풋에 대한 설명" name="regusrNm" title="작성자명"
value="<c:out value='${regusrInfo.regusrNm}'/>" readonly>
</c:otherwise>
</c:choose>
</div>
<c:if test="${bbsInfo.answRegist eq 'Y'&& bbsInfo.bbscttSndngMthCd ne '03'}"><%--답변사용여부와 게시글 문자사용여부 체크--%>
<div class="userForm__inputBox__item">
<c:if test="${empty regusrInfo.answMbtlnb}">
<div class="userForm__inputBox__itemTitle">휴대전화
<span class="required-asterisk">*</span>
</div>
<input class="input-text full" type="text" id="answMbtlnb" name="answMbtlnb"
placeholder="핸드폰번호'-'없이" title="답변핸드폰번호" maxlength="13">
</c:if>
<div class="b-checkbox-container">
<label class="b-checkbox is-medium checkbox">
<input class="termCheck" type="checkbox" name="answSmsRecptn" value="Y" id="answSmsRecptn" checked>
<span class="check"></span>
<span class="control-label">SMS 알림요청</span>
</label>
</div>
</div>
</c:if>
<c:if test="${not empty itmList}">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">문의 유형
</div>
<div class="select-box">
<%--문항답변필수여부 --%>
<input type="hidden" name="qesitmEssntlAtArr[]" value="Y">
<%--문항명 --%>
<input type="hidden" name="qesitmNmArr[]" id="qesitmNm" value="분류"/>
<%--문항고유번호 --%>
<input type="hidden" name="qesitmInnbArr[]" id="qesitmInnb"/>
<%--답변내용 --%>
<input type="hidden" name="answCnArr[]" id="answCn"/>
<%--답변여부 --%>
<input type="hidden" name="qesitmAtArr[]" id="qesitmAt" value="N">
<select class="lg" id="qesitmNmC" name="itmInnbArr[]">
<option value="" disabled="" selected="">문의 유형을 선택해 주세요.</option>
<c:forEach var="itm" items="${itmList}" varStatus="status">
<option value="<c:out value="${itm.itmInnb}"/>"
qesitm-innb="${itm.qesitmInnb}"
answ-Cn="${itm.itmCn}"
qesitm-nm="${itm.qesitmNm}">
<c:out value="${itm.itmCn}"/>
</option>
</c:forEach>
</select>
</div>
</div>
</c:if>
</div>
<c:if test="${not empty qesitmList}">
<div class="reviewRadio">
<c:forEach var="qesitmList" items="${qesitmList}">
<c:if test="${ qesitmList.itmTyCd eq '01'}">
<%--라디오 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<div class="custom-radio-container">
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt}"
class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm}">
<input type="hidden" name="qesitmAtArr[]"
class="answRadioAt qesitmAtChk" value="N">
<input type="hidden" name="qesitmInnbArr[]"
class="answRadio"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" name="answCnArr[]" class="answRadio"
disabled>
<input type="hidden" name="itmInnbArr[]" class="answRadio"
disabled>
<c:forEach items="${itmCnList}" var="itmCnList1"
varStatus="status">
<c:if test="${itmCnList1.qesitmInnb eq qesitmList.qesitmInnb}">
<div class="custom-radio is-medium">
<input type="radio"
name="itmInnbArr<c:out value="${ qesitmList.qesitmInnb }"/>[]"
id="answCn<c:out value="${ status.index }"/>"
class="answRadioC"
value="<c:out value="${ itmCnList1.itmInnb}"/>"
qesitm-innb='<c:out value="${itmCnList1.qesitmInnb}"/>'
itm-cn="<c:out value="${ itmCnList1.itmCn }"/>">
<label for="answCn<c:out value="${ status.index }"/>">
<c:out value="${ itmCnList1.itmCn }"/>
</label>
</div>
</c:if>
</c:forEach>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '02'}">
<%--셀렉트 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }" class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answSelectAt qesitmAtChk" value="N">
<input type="hidden" name="qesitmInnbArr[]" class="answSelect"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" name="answCnArr[]" class="answSelect" disabled>
<div class="select-box">
<select class="md answSelectC" name="itmInnbArr[]">
<option value="">전체</option>
<c:forEach items="${itmCnList}" var="itmCnList2">
<c:if test="${itmCnList2.qesitmInnb eq qesitmList.qesitmInnb}">
<option value="${ itmCnList2.itmInnb }"
itm-cn="${ itmCnList2.itmCn}"
qesitm-innb='${itmCnList2.qesitmInnb}'>${ itmCnList2.itmCn }</option>
</c:if>
</c:forEach>
</select>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '03'}">
<%--체크박스 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }" class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answChkAt qesitmAtChk"
value="N">
<div class="b-checkbox-container">
<c:forEach items="${itmCnList}" var="itmCnList3">
<c:if test="${itmCnList3.qesitmInnb eq qesitmList.qesitmInnb}">
<label class="b-checkbox checkbox">
<input type="hidden" class="answChk"
name="qesitmInnbArr[]"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" class="answChk"
name="answCnArr[]"
value="${ itmCnList3.itmCn }" disabled>
<input type="checkbox" class="answChkC"
name="itmInnbArr[]"
value="${ itmCnList3.itmInnb }">
<span class="check"></span>
<span class="control-label">${ itmCnList3.itmCn }</span>
</label>
</c:if>
</c:forEach>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '04'}">
<%--텍스트 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<div class="reviewRadio__inputRow">
<c:forEach items="${itmCnList}" var="itmCnList4">
<c:if test="${itmCnList4.qesitmInnb eq qesitmList.qesitmInnb}">
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }"
class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answTxtAt qesitmAtChk" value="N">
<input type="hidden" class="answTxt"
name="qesitmInnbArr[]"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" class="answTxt"
name="itmInnbArr[]"
value="${ itmCnList4.itmInnb }" disabled>
<input class="input-text full answTxtC" type="text"
name="answCnArr[]" title="추가문항답변"
placeholder="${ itmCnList4.itmCn }"
maxlength="666">
</c:if>
</c:forEach>
</div>
</div>
</c:if>
</c:forEach>
</div>
</c:if>
<div class="userForm__inputBox">
<c:if test ="${bbsInfo.bbsTyCd eq '05'}">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">문의상품</div>
<img src = "<c:out value = '${cdnurl}${qnaGoodsInfo.img}'/>" alt="qnaGoods">
<br>
<span><c:out value = '${qnaGoodsInfo.goodsNm}'/></span>
<input type = "hidden" name = "goodsInnbArr[]" value = "${qnaGoodsInfo.goodsInnb}"/>
</div>
</c:if>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">제목</div>
<input class="input-text full" type="text" title="제목 입력란" name="sj"
placeholder="제목을 입력하세요." maxlength="100">
<%--게시판설정(비밀글사용여부)--%>
<c:if test="${bbsInfo.secretBbsctt eq 'Y'}">
<div class="b-checkbox-container">
<label class="b-checkbox checkbox">
<input type="checkbox" value="Y" name="secretBbscttAt" class="chkAt"
checked <c:if test = "${bbsInfo.bbsTyCd eq '05'}"> onclick ="fn_prevent_click(event)"</c:if>>
<span class="check"></span>
<span class="control-label">비밀글</span>
</label>
</div>
</c:if>
</div>
<c:if test="${regusrInfo.regusrDvCd eq '99'}">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">비밀번호<span class="required-asterisk">*</span></div>
<input class="input-text full" type="password"
title="비밀번호 입력란"
name="password" maxlength='20'
placeholder="비밀번호를 입력하세요." value="">
</div>
</c:if>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">내용
</div>
<textarea class="textarea" rows="12" title="내용 입력란" name = "cn"
placeholder="<c:out value = "${bbsInfo.dftCn}"/>"></textarea>
</div>
<%--게시판설정(파일첨부사용여부)--%>
<input type="hidden" value="<c:out value = '${bbsInfo.filAtch}'/>" name="filAtch">
<c:if test="${bbsInfo.filAtch eq 'Y'}">
<div class="fileUplaod">
<div class="fileUplaod__title">이미지 등록(3장)</div>
<div class="dropzone-wrapper">
<div class="dropzone" id="image-dropzone">
</div>
</div>
<ul class="infoList">
<li>사진첨부는 최대 10MB 이하이며 3개까지 등록할 수 있습니다.</li>
<li>등록 가능 파일은 <c:out value="${acceptFileExtensions}"/> 파일만 가능합니다.</li>
<li>상품과 무관한 내용이거나 음란 불법적인 내용은 통보없이 삭제할 수
있습니다.
</li>
</ul>
</div>
</c:if>
</div>
</div>
<input type = "hidden" id = "listAt" value = "<c:out value = '${bbscttVO.listAt}'/>" name = "listAt"/>
<input type = "hidden" id = "sopmalCd" value = "<c:out value = '${bbscttVO.sopmalCd}'/>" name = "sopmalCd"/>
<input type = "hidden" id = "bbsId" value = "<c:out value = '${bbsInfo.bbsId}'/>" name = "bbsId"/>
<input type = "hidden" id = "bbsNm" value = "<c:out value = '${bbsInfo.bbsNm}'/>" name = "bbsNm"/>
<input type = "hidden" id = "regusrDvCd" value = "<c:out value = '${regusrInfo.regusrDvCd}'/>" name = "regusrDvCd"/>
<input type = "hidden" id = "bbscttSndngMthCd" value = "<c:out value = '${bbsInfo.bbscttSndngMthCd}'/>" name = "bbscttSndngMthCd"/>
<input type = "hidden" id = "reqDv" value = "<c:out value = '${bbscttVO.reqDv}'/>"/>
<input type="hidden" name="acceptFileExtensions" id="acceptFileExtensions" value="${acceptFileExtensions}"/>
</form>
<div class="bottomBtnControls">
<button class="btn lg" data-micromodal-close="" aria-label="창 닫기"><spring:message code="button.cancel"/></button>
<button class="btn lg theme" id = "regBtn"><spring:message code="button.insert"/></button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
// Dropzone 파일업로드
if ($("#image-dropzone").length > 0) {
const maxFiles = 3;
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("#image-dropzone", {
url: "/file-upload",
maxFilesize: 10,
maxFiles: maxFiles,
acceptedFiles: "${acceptFileExtensions}",
autoProcessQueue: false,
addRemoveLinks: true,
dictDefaultMessage: "",
dictRemoveFile: "삭제",
dictCancelUpload: "취소",
dictCancelUploadConfirmation: "업로드를 취소하시겠습니까?",
dictInvalidFileType: "이 파일은 업로드할 수 없습니다.",
dictFileTooBig: "파일이 너무 큽니다. ({{filesize}}MB). 최대 파일 크기: {{maxFilesize}}MB.",
dictMaxFilesExceeded: "파일을 더 이상 추가할 수 없습니다.",
dictResponseError: "서버에서 응답을 받지 못했습니다.",
});
var inputElement = $('input[type="file"].dz-hidden-input');
if(inputElement.length > 1){
inputElement.eq(0).remove();
}
// name 부여
inputElement.attr('name', 'file');
// id 부여
inputElement.attr('id', 'fileUpload');
// 파일 추가 이벤트
myDropzone.on("addedfile", function(file) {
if (myDropzone.files.length >= maxFiles) {
$(".dz-message").hide();
}
});
myDropzone.on("removedfile", function(file) {
if (myDropzone.files.length < maxFiles) {
$(".dz-message").show();
}
});
myDropzone.on("maxfilesexceeded", function(file) {
const dictMaxFilesExceeded = myDropzone.options.dictMaxFilesExceeded;
alert(dictMaxFilesExceeded);
this.removeFile(file);
$(file.previewElement).find(".dz-remove").attr("disabled", true);
});
}
</script>
</body>
</html>

View File

@@ -0,0 +1,901 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : BbscttRegistPopupC.jsp
Description : 게시글 등록 팝업 폼
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-05-09 김혜인 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<script>
$(document).ready(function () {
filesTempArr = [];
/*폼 기본 세팅*/
fn_select_cn();
//2.내용 텍스트 <br>태그 엔터값으로 replace
const target = $("#cnBbsUpdt");
let str = target.text();
str = str.trim();
target.val(str);
//3.나이스셀렉터 적용
fn_set_niceSelect_datePicker("#bbsUpdtForm");
/*4.휴대전화 포매팅*/
if($("#answMbtlnb").length > 0){
$("#answMbtlnb").val(fn_format_mbtlnb($("#answMbtlnb").val()));
fn_set_event("#answMbtlnb", "keyup", fn_fmt_telno);
}
//6.hidden value set
fn_update_hidden_value();
//분류 change시 hidden value값 set
$('#qesitmNmC').on('change', function () {
$("#qesitmInnb").val("");
$("#qesitmNm").val("");
$("#answCn").val("");
const option = $('option:selected', this);
const qesitmInnb = $(option).attr('qesitm-innb');
const answCn = $(option).attr('answ-Cn');
const qesitmNm = $(option).attr('qesitm-nm');
if ($(this).val() !== "") {
$("#qesitmInnb").val(qesitmInnb);
$("#answCn").val(answCn);
$("#qesitmNm").val(qesitmNm);
$("#qesitmAt").val("Y");
} else {
$("#qesitmInnb").val("");
$("#answCn").val("");
$("#qesitmNm").val("");
$("#qesitmAt").val("N");
}
});
//추가입력 항목 라디오 'click' 이벤트
$('.answRadioC').on('click', function () {
const radio = $(this);
//추가입력 항목 내용 요소 get
const answ = radio.closest(".custom-radio-container").find('[name="answCnArr[]"]');
//추가입력 항목 내용 요소 get
const qesitmInnb = radio.closest(".custom-radio-container").find('[name="qesitmInnbArr[]"]');
//라디오 클릭으로 인한 제어 요소 get
const contrlTarget = radio.closest(".custom-radio-container").find('.answRadio');
//항목 고유번호 내용 요소 get
const itmInnb = radio.closest(".custom-radio-container").find('[name="itmInnbArr[]"]');
//라디오 클릭 시 disabled 비활성
if (radio.is(":checked")) {
//답변 내용 초기화
answ.val("");
const radioVal = $(radio).attr('itm-cn');
answ.val(radioVal);
//항목 내용 set
qesitmInnb.val("");
const qesitmInnbVal = $(radio).attr('qesitm-innb');
qesitmInnb.val(qesitmInnbVal);
//항목고유번호 내용 set
itmInnb.val("");
const itmInnbVal = $(radio).val();
itmInnb.val(itmInnbVal);
//라디오 주위 input값 disable false처리
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
radio.closest(".custom-radio-container").find(".answRadioAt").val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
radio.closest(".custom-radio-container").find(".answRadioAt").val("N");
});
}
});
//추가입력 항목 셀렉트 'change'이벤트
$('.answSelectC').on('change', function () {
const select = $(this);
const answ = select.closest("reviewRadio__item").find('[name="answCnArr[]"]');
const qesitmInnb = select.closest("reviewRadio__item").find('[name="qesitmInnbArr[]"]');
const contrlTarget = select.closest("reviewRadio__item").find('.answSelect');
const option = $('option:selected', this);
if (select.val() != "") {
//답변 내용 초기화
answ.val("");
const selectVal = $(option).attr('itm-cn');
answ.val(selectVal);
//항목 내용 set
qesitmInnb.val("");
const qesitmInnbVal = $(option).attr('qesitm-innb');
qesitmInnb.val(qesitmInnbVal);
//셀렉트 주위 input값 disable false처리
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
select.closest("reviewRadio__item").find(".answSelectAt").val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
select.closest("reviewRadio__item").find(".answSelectAt").val("N");
});
}
});
//추가입력 항목 체크박스 'click'이벤트
$('.answChkC').on('click', function () {
const check = $(this);
const contrlTarget = check.closest("div").find('.answChk');
var isChecked = $(this).is(":checked");
//클릭한 체크박스 주위 input값 disable false처리
contrlTarget.each(function () {
if (isChecked) {
$(this).prop("disabled", false);
} else {
$(this).prop("disabled", true);
}
});
// 체크된 체크박스가 하나라도 있는지 확인
let anyChecked = $('.answChkC:checked').length > 0;
contrlTarget.each(function () {
if (anyChecked) {
check.closest("reviewRadio__item").find(".answChkAt").val("Y");
} else {
check.closest("reviewRadio__item").find(".answChkAt").val("N");
}
});
});
//추가입력 항목 텍스트 'input'이벤트
$('.answTxtC').on('input', function () {
const txt = $(this);
const contrlTarget = txt.closest(".reviewRadio__inputRow").find('.answTxt');
const contrlAt = txt.closest(".reviewRadio__inputRow").find('.answTxtAt');
//클릭한 체크박스 주위 input값 disable false처리
if (txt.val() != "") {
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
contrlAt.val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
contrlAt.val("N");
});
}
});
//파일 업로드
$("#fileUpload").on("change", function () {
addFiles(event, 0);
});
//수정 버튼 이벤트
$("#updtBtn").on("click", function () {
$("#closeModalTarget").val("confirm_updt_alert");
openConfirmModal(function (onSuccess) {
fn_update_bbsctt(onSuccess);//등록함수
}, 'confirm_updt_alert'
, '#updtCfrmBtn'
, 'success_updt_alert'
, '#updtSuccessBtn'
, fn_select_qna, '1');
});
});
/*********************************************************
* 게시글 내용 조회
*********************************************************/
if (typeof fn_select_cn === 'undefined') {
function fn_select_cn () {
let bbscttInnb = $("#bbscttInnb").val();
let bbsId = $("#bbsId").val();
let sopmalCd = $("#sopmalCd").val();
$.ajax({
type: "post",
url: "<c:url value ='/ajax/bbscttAjax/selectBOBbscttCnAjax'/>",
contentType: 'application/json',
data: JSON.stringify({
bbsId: bbsId,
bbscttInnb: bbscttInnb,
sopmalCd: sopmalCd
}),
success: function (data) {
let cn = data.result.cn;
$("#cnBbsUpdt").val(cn);
}
});
}
}
/*********************************************************
* 게시글 수정
*********************************************************/
if(typeof fn_update_hidden_value === 'undefined'){
function fn_update_hidden_value() {
//분류 항목
const option = $('option:selected', $("#qesitmNmC"));
const qesitmInnb = $(option).attr('qesitm-innb');
const answCn = $(option).attr('answ-Cn');
const qesitmNm = $(option).attr('qesitm-nm');
if ($("#qesitmNmC").val() != "") {
$("#qesitmInnb").val(qesitmInnb);
$("#answCn").val(answCn);
$("#qesitmAt").val("Y");
} else {
$("#qesitmInnb").val("");
$("#answCn").val("");
$("#qesitmAt").val("N");
}
// 추가평가항목 라디오
const radio = $(".answRadioC:checked");
radio.each(function (idx) {
if (radio.eq(idx).val()) {
let radioAnsw = radio.eq(idx).closest("reviewRadio__item").find('[name="answCnArr[]"]');
let radioQesitmInnb = radio.eq(idx).closest("reviewRadio__item").find('[name="qesitmInnbArr[]"]');
let radioItmInnb = radio.eq(idx).closest("reviewRadio__item").find('[name="itmInnbArr[]"]');
let radioQesitmAt = radio.eq(idx).closest("reviewRadio__item").find('[name="qesitmAtArr[]"]');
let radioContrlTarget = radio.eq(idx).closest("reviewRadio__item").find('.answRadio');
// 답변 내용 set
radioAnsw.val(radio.eq(idx).attr('itm-cn'));
// 항목 내용 set
radioQesitmInnb.val(radio.eq(idx).attr('qesitm-innb'));
// 항목고유번호 내용 set
radioItmInnb.val(radio.eq(idx).val());
// 답변 여부
radioQesitmAt.val("Y");
// 라디오 주위 input값 disable false처리
radioContrlTarget.each(function (idx) {
radioContrlTarget.eq(idx).prop("disabled", false);
});
} else {
let radioAnsw = radio.eq(idx).closest("reviewRadio__item").find('[name="answCnArr[]"]');
let radioQesitmInnb = radio.eq(idx).closest("reviewRadio__item").find('[name="qesitmInnbArr[]"]');
let radioItmInnb = radio.eq(idx).closest("reviewRadio__item").find('[name="itmInnbArr[]"]');
let radioQesitmAt = radio.eq(idx).closest("reviewRadio__item").find('[name="qesitmAtArr[]"]');
let radioContrlTarget = radio.eq(idx).closest("div").find('.answRadio');
// 답변 내용 set
radioAnsw.val("");
// 항목 내용 set
radioQesitmInnb.val("");
// 항목고유번호 내용 set
radioItmInnb.val("");
// 답변 여부
radioQesitmAt.val("N");
// 라디오 주위 input값 disable false처리
radioContrlTarget.each(function (idx) {
radioContrlTarget.eq(idx).prop("disabled", true);
});
}
});
//추가입력 항목 셀렉트 'change'이벤트
const select = $('select.answSelectC[name="itmInnbArr[]"]');
select.each(function (idx) {
let selectIndex = select.eq(idx).find('option:selected').index();
if (selectIndex > 0) {
let selectQesitmAt = select.eq(idx).closest("reviewRadio__item").find('[name="qesitmAtArr[]"]');
let selectQesitmInnb = select.eq(idx).closest("reviewRadio__item").find('[name="qesitmInnbArr[]"]');
let selectAnsw = select.eq(idx).closest("reviewRadio__item").find('[name="answCnArr[]"]');
let selectOption = $('option:selected', select.eq(idx));
let selectContrlTarget = select.eq(idx).closest("reviewRadio__item").find('.answSelect');
// 답변 여부
selectQesitmAt.val("Y");
// 항목 내용 set
selectQesitmInnb.val(selectOption.attr('qesitm-innb'));
// 답변 내용 set
selectAnsw.val(selectOption.attr('itm-cn'));
// 라디오 주위 input값 disable false처리
selectContrlTarget.each(function (idx) {
selectContrlTarget.eq(idx).prop("disabled", false);
});
} else {
let selectQesitmAt = select.eq(idx).closest("reviewRadio__item").find('[name="qesitmAtArr[]"]');
let selectQesitmInnb = select.eq(idx).closest("reviewRadio__item").find('[name="qesitmInnbArr[]"]');
let selectAnsw = select.eq(idx).closest("reviewRadio__item").find('[name="answCnArr[]"]');
let selectContrlTarget = select.eq(idx).closest("reviewRadio__item").find('.answSelect');
// 답변 여부
selectQesitmAt.val("N");
// 항목 내용 set
selectQesitmInnb.val("");
// 답변 내용 set
selectAnsw.val("");
// 라디오 주위 input값 disable false처리
selectContrlTarget.each(function (idx) {
selectContrlTarget.eq(idx).prop("disabled", true);
});
}
});
const check = $(".answChkC");
//클릭한 체크박스 주위 input값 disable false처리
check.each(function (idx) {
let checkContrlTarget = check.eq(idx).closest(".checkbox").find('.answChk');
let isChecked = check.eq(idx).is(":checked");
checkContrlTarget.each(function (index) {
if (isChecked) {
checkContrlTarget.eq(index).prop("disabled", false);
} else {
checkContrlTarget.eq(index).prop("disabled", true);
}
});
// 체크된 체크박스가 하나라도 있는지 확인
let anyChecked = check.eq(idx).closest("reviewRadio__inputRow").find(".answChkC:checked").length > 0;
if (anyChecked) {
check.eq(idx).closest("reviewRadio__inputRow").find(".answChkAt").val("Y");
} else {
check.eq(idx).closest("reviewRadio__inputRow").find(".answChkAt").val("N");
}
});
//추가입력 항목 텍스트 'input'이벤트
const txt = $('.answTxtC');
txt.each(function (idx) {
let contrlTarget = txt.eq(idx).closest("div").find('.answTxt');
let contrlAt = txt.eq(idx).closest("div").find('.answTxtAt');
//클릭한 체크박스 주위 input값 disable false처리
if (txt.val() != "") {
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
contrlAt.val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
contrlAt.val("N");
});
}
});
}
}
/*********************************************************
* 게시글 수정
*********************************************************/
if (typeof fn_update_bbsctt === 'undefined') {
function fn_update_bbsctt(onSuccess) {
let url = '<c:url value="/sopmal/csc/updateBbscttupdt"/>';
let saveForm = $('#bbsUpdtForm');
let formData = new FormData();
//파일 업로드
if ($("#image-dropzone").length > 0) {
let myDropzone = Dropzone.forElement("#image-dropzone");
myDropzone.files.forEach(function (file) {
formData.append("files", file);
});
}
/*문항 답변 체크박스 disabled*/
$('.answChk').each(function () {
if (!$(this).prop('checked')) {
fn_ctrl_disable([".answChk"],);
}
});
//여부 N처리
$('.chkAt').each(function () {
if (!$(this).prop('checked')) {
$(this).val("N");
}
});
//사용자 등록 시 노출 여부 Y
formData.append("expsrAt", "Y");
//폼 내 input값 append
saveForm.serializeArray().forEach(function (item) {
formData.append(item.name, item.value);
});
disableButton("#updtCfrmBtn");
$.ajax({
type: 'post',
url: url,
enctype: "multipart/form-data",
data: formData,
processData: false,
contentType: false,
success: function (result) {
disableButton("#updtCfrmBtn");
closeModal("updtPop");//등록모달 close
onSuccess();
}
});
disableButton("#updtCfrmBtn");
fn_ctrl_disable("", [".checkbox"]);
}
}
/*상품qna 버튼 클릭 제어*/
if (typeof fn_prevent_click === 'undefined') {
function fn_prevent_click(event) {
event.preventDefault(); // 체크박스 상태 변경 방지
}
}
</script>
<body>
<c:set value="${resultMap.bbscttInfo.bbscttInfo}" var="bbscttInfo"/>
<c:set value="${resultMap.bbscttVO}" var="bbscttVO"/>
<c:set value="${resultMap.bbscttInfo.qesitmAnswList}" var="qesitmAnswList"/>
<c:set value="${resultMap.bbscttInfo.fileInfoGson}" var="fileInfoGson"/>
<c:set value="${resultMap.bbscttInfo.goods}" var="goods"/>
<c:set value="${resultMap.bbscttInfo.wrter}" var="wrter"/>
<c:set value="${resultMap.bbsInfo}" var="bbsInfo"/>
<c:set value="${resultMap.qesitmList.qesitmList}" var="qesitmList"/>
<c:set value="${resultMap.qesitmList.itmCnList}" var="itmCnList"/>
<c:set value="${resultMap.itmList}" var="itmList"/>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.extensions.images')" var="acceptFileExtensions"/><%--허용파일확장자--%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/><%--이미지경로--%>
<!--권한 조회 후 jsp 분기-->
<div class="microModal microFullScreen" id="updtPop" aria-hidden="true" style="position: relative; z-index: 1000;">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
<c:out value="${bbsInfo.bbsNm}"/>
</h2>
<button class="microModal__close" onclick="closeModal('updtPop');"></button>
</div>
<div class="microModal__content">
<div class="microModal__inner">
<form id="bbsUpdtForm">
<input type="hidden" name="setupInfoInnb" value="${bbsInfo.setupInfoInnb }"/>
<input type="hidden" name="sopmalCd" value="${bbscttVO.sopmalCd }" id="sopmalCd"/>
<input type="hidden" name="filAtch" value="${bbsInfo.filAtch }"/>
<input type="hidden" name="regusrNm" value="${bbscttInfo.regusrNm}"/>
<input type="hidden" id = "bbsId" name="bbsId" value="${bbsInfo.bbsId }"/>
<input type="hidden" id = "bbsTyCd" name="bbsTyCd" value="${bbsInfo.bbsTyCd }"/>
<input type="hidden" id="reqDv" value="<c:out value = '${bbsctt.reqDv}'/>" name="reqDv"/>
<input type="hidden" id="pgeVtcCnt" name="pgeVtcCnt" value="${ bbsInfo.pgeVtcCnt }"/>
<input type="hidden" id="pgeWthCnt" name="pgeWthCnt" value="${ bbsInfo.pgeWthCnt }"/>
<input type="hidden" id="bbscttInnb" name="bbscttInnb" value="${ bbscttInfo.bbscttInnb }"/>
<input type="hidden" id="listAt" name="listAt" value="${ bbscttVO.listAt }"/>
<input type="hidden" id="prevNext" name="prevNext" value="${ bbsInfo.prevNext }"/>
<input type="hidden" id="sknTyCd" name="sknTyCd" value="${ bbsInfo.sknTyCd }"/>
<input type="hidden" id="acceptFileExtensions" name="acceptFileExtensions" value="${acceptFileExtensions}"/>
<div class="userForm">
<div class="userForm__inputBox">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">이름</div>
<c:out value = "${bbscttInfo.regusrNm}"/>
</div>
<c:if test="${bbsInfo.answRegist eq 'Y'&& bbsInfo.bbscttSndngMthCd ne '03'}"><%--답변사용여부와 게시글 문자사용여부 체크--%>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">휴대전화
<span class="required-asterisk">*</span>
</div>
<input class="input-text" type="text" title="해당 인풋에 대한 설명" name="answMbtlnb"
id="answMbtlnb" maxlength="13" value = "<c:out value = '${bbscttInfo.answMbtlnb}'/>"
placeholder="휴대폰번호'-'없이 입력">
<div class="b-checkbox-container">
<label class="b-checkbox is-medium checkbox">
<input class="termCheck" type="checkbox" name="answSmsRecptn" value="Y" id="answSmsRecptn"
<c:if test="${bbscttInfo.answSmsRecptn eq 'Y'}">checked</c:if>>
<span class="check"></span>
<span class="control-label">SMS 알림요청</span>
</label>
</div>
</div>
</c:if>
<c:if test="${not empty itmList}">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">문의 유형
</div>
<div class="select-box">
<%--문항답변필수여부 --%>
<input type="hidden" name="qesitmEssntlAtArr[]" value="Y">
<%--문항명 --%>
<input type="hidden" name="qesitmNmArr[]" id="qesitmNm" value="분류"/>
<%--문항고유번호 --%>
<input type="hidden" name="qesitmInnbArr[]" id="qesitmInnb"
<c:forEach var="itmAnswList" items="${qesitmAnswList}">
<c:if test="${itmAnswList.aditItmDvCd eq '03'}">
value = <c:out value="${itmAnswList.qesitmInnb}"/>
</c:if>
</c:forEach>/>
<%--답변내용 --%>
<input type="hidden" name="answCnArr[]" id="answCn"<c:forEach
var="itmAnswList" items="${qesitmAnswList}">
<c:if test="${itmAnswList.aditItmDvCd eq '03'}">
value = <c:out value="${itmAnswList.answCn}"/>
</c:if>
</c:forEach>/>
<%--답변여부 --%>
<input type="hidden" name="qesitmAtArr[]" id="qesitmAt"
<c:forEach var="itmAnswList" items="${qesitmAnswList}">
<c:if test="${itmAnswList.aditItmDvCd eq '03'}">
<c:choose>
<c:when test="${empty itmAnswList.answCn}">value="N"</c:when>
<c:otherwise>value="Y"</c:otherwise>
</c:choose>
</c:if>
</c:forEach>>
<select class="lg" id="qesitmNmC" name="itmInnbArr[]">
<option value="" disabled="" selected="">문의 유형을 선택해 주세요.</option>
<c:forEach var="itm" items="${itmList}" varStatus="status">
<option value="<c:out value="${itm.itmInnb}"/>"
qesitm-innb="${itm.qesitmInnb}" answ-Cn="${itm.itmCn}"
qesitm-nm="${itm.qesitmNm}"
<%--분류 답변 값 유지--%>
<c:forEach var="itmAnswList" items="${qesitmAnswList}">
<c:if test="${itmAnswList.aditItmDvCd eq '03'}">
<c:if test="${itm.itmInnb eq itmAnswList.itmInnb }">selected</c:if>
</c:if>
</c:forEach>>
<c:out value="${itm.itmCn}"/>
</option>
</c:forEach>
</select>
</div>
</div>
</c:if>
</div>
<c:if test="${not empty qesitmList}">
<div class="reviewRadio">
<c:forEach var="qesitmList" items="${qesitmList}">
<c:if test="${ qesitmList.itmTyCd eq '01'}">
<%--라디오 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<div class="custom-radio-container">
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt}"
class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm}">
<input type="hidden" name="qesitmAtArr[]"
class="answRadioAt qesitmAtChk" value="N">
<input type="hidden" name="qesitmInnbArr[]"
class="answRadio"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" name="answCnArr[]" class="answRadio"
disabled>
<input type="hidden" name="itmInnbArr[]" class="answRadio"
disabled>
<c:forEach items="${itmCnList}" var="itmCnList1" varStatus="status">
<c:if test="${itmCnList1.qesitmInnb eq qesitmList.qesitmInnb}">
<div class="custom-radio is-medium">
<input type="radio" id="answCn${ status.index }"
class="answRadioC"
qesitm-innb='${itmCnList1.qesitmInnb}'
name="itmInnbArr${ qesitmList.qesitmInnb}[]"
value="${ itmCnList1.itmInnb}"
itm-cn="${ itmCnList1.itmCn }"
<c:forEach var="qesitmAnswList1"
items="${qesitmAnswList}">
<c:if test="${qesitmAnswList1.itmTyCd eq '01'}">
<c:if test="${qesitmAnswList1.itmInnb eq itmCnList1.itmInnb}">checked</c:if>
</c:if>
</c:forEach>>
<label for="answCn${ status.index }">${ itmCnList1.itmCn }</label>
</div>
</c:if>
</c:forEach>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '02'}">
<%--셀렉트 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }" class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answSelectAt qesitmAtChk" value="N">
<input type="hidden" name="qesitmInnbArr[]" class="answSelect"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" name="answCnArr[]" class="answSelect" disabled>
<div class="select-box">
<select class="md answSelectC" name="itmInnbArr[]">
<option value="">전체</option>
<c:forEach items="${itmCnList}" var="itmCnList2">
<c:if test="${itmCnList2.qesitmInnb eq qesitmList.qesitmInnb}">
<c:set var="selected" value=""/>
<c:forEach var="qesitmAnswList2" items="${qesitmAnswList}">
<c:if test="${qesitmAnswList2.itmInnb eq itmCnList2.itmInnb}">
<c:set var="selected" value="selected"/>
</c:if>
</c:forEach>
<option value="${itmCnList2.itmInnb}"
itm-cn="${itmCnList2.itmCn}"
qesitm-innb="${itmCnList2.qesitmInnb}" ${selected}>
${itmCnList2.itmCn}
</option>
</c:if>
</c:forEach>
</select>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '03'}">
<%--체크박스 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }" class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answChkAt qesitmAtChk"
value="N">
<div class="b-checkbox-container">
<c:forEach items="${itmCnList}" var="itmCnList3">
<c:if test="${itmCnList3.qesitmInnb eq qesitmList.qesitmInnb}">
<label class="b-checkbox checkbox">
<input type="hidden" class="answChk"
name="qesitmInnbArr[]"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" class="answChk"
name="answCnArr[]"
value="${ itmCnList3.itmCn }" disabled>
<input type="checkbox" class="answChkC"
name="itmInnbArr[]"
value="${ itmCnList3.itmInnb }"
<c:forEach var="qesitmAnswList3" items="${qesitmAnswList}">
<c:if test="${qesitmAnswList3.itmInnb eq itmCnList3.itmInnb}">checked</c:if>
</c:forEach>>
<span class="check"></span>
<span class="control-label">${ itmCnList3.itmCn }</span>
</label>
</c:if>
</c:forEach>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '04'}">
<%--텍스트 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<div class="reviewRadio__inputRow">
<c:forEach items="${itmCnList}" var="itmCnList4">
<c:if test="${itmCnList4.qesitmInnb eq qesitmList.qesitmInnb}">
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }"
class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answTxtAt qesitmAtChk" value="N">
<input type="hidden" class="answTxt"
name="qesitmInnbArr[]"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" class="answTxt"
name="itmInnbArr[]"
value="${ itmCnList4.itmInnb }" disabled>
<input class="input-text full answTxtC" type="text"
name="answCnArr[]" title="추가문항답변"
placeholder="${ itmCnList4.itmCn }"
maxlength="666"
itm-cn="${ itmCnList4.itmCn }"
qesitm-innb="${itmCnList4.qesitmInnb}"
itm-innb="${itmCnList4.itmInnb}"
<c:forEach var="qesitmAnswList4"
items="${qesitmAnswList}">
<c:if test="${qesitmAnswList4.itmInnb eq itmCnList4.itmInnb}">
value="<c:out value = '${qesitmAnswList4.answCn}'/>"
</c:if>
</c:forEach>>
</c:if>
</c:forEach>
</div>
</div>
</c:if>
</c:forEach>
</div>
</c:if>
<div class="userForm__inputBox">
<c:if test ="${bbsInfo.bbsTyCd eq '05'}">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">문의상품</div>
<c:forEach var = "goods" items="${goods}">
<img src="${cdnurl}<c:out value = '${goods.img}'/>" onerror = "this.src='/pc/images/image_placeholder.png'" alt="qnaGoods"
width="100px" height="100px">
<span><c:out value='${goods.goodsNm}'/></span>
<input type="hidden" name="goodsInnbArr[]" value="${goods.goodsInnb}"/>
</c:forEach>
<br>
</div>
</c:if>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">제목</div>
<input class="input-text full" type="text" title="제목 입력란" name="sj"
placeholder="제목을 입력하세요." maxlength="100"
value="<c:out value = "${bbscttInfo.sj}"/>">
<%--게시판설정(비밀글사용여부)--%>
<c:if test="${bbsInfo.secretBbsctt eq 'Y'}">
<div class="b-checkbox-container">
<label class="b-checkbox checkbox">
<input type="checkbox" value="Y" name="secretBbscttAt" class="chkAt"
<c:if test="${bbscttInfo.secretBbscttAt eq 'Y'}">checked</c:if>
<c:if test="${bbsInfo.bbsTyCd eq '05'}"> onclick="fn_prevent_click(event);"</c:if>>
<span class="check"></span>
<span class="control-label">비밀글</span>
</label>
</div>
</c:if>
</div>
<c:if test="${regusrInfo.regusrDvCd eq '99'}">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">비밀번호<span class="required-asterisk">*</span></div>
<input class="input-text full" type="password"
title="비밀번호 입력란"
name="password" maxlength='20'
placeholder="비밀번호를 입력하세요." value="">
</div>
</c:if>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">내용
</div>
<textarea class="textarea" rows="12" title="내용 입력란" id="cnBbsUpdt" name = "cn">
<c:out value="${bbscttInfo.cn}"/>
</textarea>
</div>
<%--게시판설정(파일첨부사용여부)--%>
<c:if test="${bbsInfo.filAtch eq 'Y'}">
<div class="fileUplaod">
<div class="fileUplaod__title">이미지 등록(3장)</div>
<div class="dropzone-wrapper">
<div class="dropzone" id="image-dropzone">
</div>
</div>
<ul class="infoList">
<li>사진첨부는 최대 10MB 이하이며 3개까지 등록할 수 있습니다.</li>
<li>등록 가능 파일은 <c:out value="${acceptFileExtensions}"/> 파일만 가능합니다.</li>
<li>상품과 무관한 내용이거나 음란 불법적인 내용은 통보없이 삭제할 수
있습니다.
</li>
</ul>
</div>
</c:if>
</div>
</div>
</form>
<div class="bottomBtnControls">
<button class="btn lg" data-micromodal-close="" aria-label="창 닫기"><spring:message code="button.cancel"/></button>
<button class="btn lg theme" id = "updtBtn"><spring:message code="button.update"/></button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
// Dropzone 파일업로드
$(".dz-hidden-input").remove();
if ($("#image-dropzone").length > 0) {
const maxFiles = 3;
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("#image-dropzone", {
url: "/file-upload",
maxFilesize: 10,
maxFiles: maxFiles,
acceptedFiles: "${acceptFileExtensions}",
autoProcessQueue: false,
addRemoveLinks: true,
dictDefaultMessage: "",
dictRemoveFile: "삭제",
dictCancelUpload: "취소",
dictCancelUploadConfirmation: "업로드를 취소하시겠습니까?",
dictInvalidFileType: "이 파일은 업로드할 수 없습니다.",
dictFileTooBig: "파일이 너무 큽니다. ({{filesize}}MB). 최대 파일 크기: {{maxFilesize}}MB.",
dictMaxFilesExceeded: "파일을 더 이상 추가할 수 없습니다.",
dictResponseError: "서버에서 응답을 받지 못했습니다.",
init: function () {
let dropzoneInstance = this;
let imageData = ${fileInfoGson};
// 각 이미지를 Dropzone에 추가
$.each(imageData, function (index, image) {
// Dropzone 파일 객체 생성
let mockFile = {name: image.orginlFilNm, size: image.filMg};
dropzoneInstance.emit("addedfile", mockFile);
let cdnurl = '<c:out value="${cdnurl}"/>';
let filCours = `\${image.filCours}`;
let sysFilNm = `\${image.sysFilNm}`;
const imagePath = cdnurl + filCours + sysFilNm;
dropzoneInstance.emit("thumbnail", mockFile, imagePath);
// 이미지 오류 처리
$(mockFile.previewElement).find("img").on("error", function () {
this.src = '/mobile/images/image_placeholder.png'; // 대체 이미지 경로로 설정
});
// Dropzone에 파일 추가
mockFile.customId = image.bbscttAtchmnfilInnb;
dropzoneInstance.files.push(mockFile);
});
// 파일이 삭제될 때마다 호출되는 이벤트 핸들러
this.on("removedfile", function (file) {
const result = dropzoneDeleteFiles("" + file.customId + "", '<c:out value="${bbscttVO.sopmalCd}"/>', "BDFL", 1);
if (result === "N") {//파일 삭제 안할 시 복원
file.customData = {restored: true, customId: file.customId}; //삭제 취소에 의한 구분자 부여
myDropzone.emit("addedfile", file); // 파일을 다시 추가하여 삭제 취소
myDropzone.emit("thumbnail", file, file.dataURL); // 파일의 썸네일을 복원
}
if (myDropzone.files.length < maxFiles) {
$(".dz-message").show();
}
});
//파일 추가
this.on("addedfile", function (file) {
let restoreAt = '';
if (file.customData) { //파일 삭제 복구시
restoreAt = true;
} else {//새파일 추가시
restoreAt = false;
}
if (restoreAt) {// 파일 삭제 복구시 해당 id 재부여
file.customId = file.customData.customId;
} else {//새파일 추가시 임시 id 부여
let fileLength = myDropzone.files.length;
file.customId = "temp" + fileLength;
if (fileLength > maxFiles) {
const dictMaxFilesExceeded = myDropzone.options.dictMaxFilesExceeded;
this.removeFile(file);
$(file.previewElement).find(".dz-remove").attr("disabled", true);
}
}
});
// maxFiles 제한 관련 이벤트 핸들러
this.on("maxfilesexceeded", function (file) {
const dictMaxFilesExceeded = myDropzone.options.dictMaxFilesExceeded;
alert(dictMaxFilesExceeded);
this.removeFile(file);
});
}
});
if (myDropzone.files.length < maxFiles) {
$(".dz-message").show();
} else {
$(".dz-message").hide();
}
var inputElement = $('input[type="file"].dz-hidden-input');
// name 부여
inputElement.attr('name', 'file');
// id 부여
inputElement.attr('id', 'fileUpload');
}
</script>
</body>
</html>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,326 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : CmListR.jsp
Description : 댓글 조회
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-04-25 김혜인 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<%--(DEPTH0)댓글 목록--%>
<c:set value = "${resultMap.cmList.cmList}" var = "cmList"/>
<%--작성자 정보 추출(댓글 목록)--%>
<c:set value = "${resultMap.cmList.wrterList}" var = "wrterList"/>
<%--작성자 정보 (답글 등록자 정보)--%>
<c:set value = "${resultMap.regusrInfo}" var = "regusrInfo"/>
<%--게시글 정보 --%>
<c:set value = "${resultMap.cmVO}" var = "cmVO"/>
<%--게시판 설정 --%>
<c:set value="${resultMap.bbsInfo}" var="bbsInfo"/>
<input type = "hidden" id = "cmCntInfo" value = "<c:out value = "${ resultMap.paginationInfo.totalRecordCount }"/>">
<p id="comment_container"></p>
<c:choose>
<c:when test="${not empty cmList}">
<c:forEach var="cmList" items="${cmList}" varStatus="status">
<div class="comment-body__item mainCmContent">
<div class="comment-body__info">
<div class="comment-body__info-left">
<i class="icon icon_comment-user"></i>
<span class="comment-body__user">
<c:choose>
<c:when test="${cmList.regusrDvCd eq '99'}">
<c:out value="${cmList.maskingRegusrNm}"/>[비회원]
</c:when>
<c:when test="${cmList.regusrDvCd eq '02'}">
<c:out value="${cmList.mngrNm}"/>
</c:when>
<c:when test="${cmList.wrterIndictTyCd eq '01' && cmList.regusrDvCd eq '01'}">
<c:out value="${ cmList.maskingRegusrId}"/>(<c:out value="${ cmList.mbrGradNm}"/>)
</c:when>
<c:when test="${cmList.wrterIndictTyCd eq '02' && cmList.regusrDvCd eq '01'}">
<c:out value="${ cmList.maskingRegusrId}"/>
</c:when>
<c:when test="${cmList.wrterIndictTyCd eq '03' && cmList.regusrDvCd eq '01'}">
<c:out value="${ cmList.maskingRegusrNm}"/>(<c:out value="${ cmList.mbrGradNm}"/>)
</c:when>
<c:when test="${cmList.wrterIndictTyCd eq '04' && cmList.regusrDvCd eq '01'}">
<c:out value="${ cmList.maskingRegusrNm}"/>
</c:when>
<c:when test="${cmList.wrterIndictTyCd eq '05' && cmList.regusrDvCd eq '01'}">
<c:out value="${ cmList.maskingRegusrNm}"/><br>
(<c:out value="${ cmList.maskingRegusrId}"/>,<c:out value="${ cmList.mbrGradNm}"/>)
</c:when>
<c:when test="${cmList.wrterIndictTyCd eq '06' && cmList.regusrDvCd eq '01'}">
<c:out value="${ cmList.maskingRegusrNm}"/>(<c:out value="${ cmList.maskingRegusrId}"/>)
</c:when>
</c:choose>
</span>
<span class="comment-body__date"><c:out value="${cmList.registDt}"/></span>
<c:if test = "${cmList.newAt eq 'Y'}">
<i class="icon icon_new-post"></i>
</c:if>
</div>
<div class="comment-body__info-right">
<c:if test="${cmList.useAt eq 'Y'}">
<button type="button" class="comment-body__button cmUpdtBtn" value="<c:out value="${cmList.cmInnb}"/>">
<spring:message code="button.update"/>
</button>
<button type="button" class="comment-body__button cmDelBtn" value="<c:out value="${cmList.cmInnb}"/>">
<spring:message code="button.delete"/>
</button>
</c:if>
</div>
</div>
<div class="comment-body__content mainCmCn">
<%--1. 삭제된 글은 비밀 댓글이여도 삭제됐다고 보여준다--%>
<c:choose>
<c:when test="${cmList.useAt eq 'Y'}">
<%--2. 삭제 안된 글 중 비밀 댓글인지 확인한다.--%>
<c:choose>
<c:when test="${cmList.secretBbscttAt eq 'Y'}"><%--비밀댓글 적용 시--%>
<c:choose>
<c:when test="${cmList.regusr eq cmVO.mbrInnb}"><%--본인 꺼는 비밀 댓글 내용 보임--%>
<p class="cmCn" style="white-space: pre-wrap;"><i class="icon icon_lock"></i><c:out value="${fn:trim(cmList.cn)}"/></p>
</c:when>
<c:otherwise><%--비회원 댓글 조회--%>
<p class="cmCn" style="white-space: pre-wrap;"><i class="icon icon_lock"></i><button class="comment-body__privateComment comment-body__button secretCm" value="<c:out value="${cmList.cmInnb}"/>">비밀 댓글입니다.</button>
</p>
</c:otherwise>
</c:choose>
</c:when>
<c:otherwise>
<p class="cmCn" style="white-space: pre-wrap;"><c:out value="${fn:trim(cmList.cn)}"/></p>
</c:otherwise>
</c:choose>
</c:when>
<c:otherwise>
삭제된 댓글 입니다.
</c:otherwise>
</c:choose>
<div class="dtlCmDiv"><%--영역확인--%>
<input type="hidden" name="secretBbscttAt" value="${cmList.secretBbscttAt}">
<input type="hidden" name="password" value="${cmList.password}">
</div>
</div>
<div class="comment-body__reply-container">
<button class="comment-body__reply-button">답글 <em class="commentCnt">0</em></button>
<c:if test="${bbsInfo.cmEvlUseAt eq 'Y'}">
<div class="comment-like">
<button class="comment-like__btn comment-like__btn--like" value = "<c:out value ='${cmList.cmInnb}'/>">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M14.7749 16.583H5.6756V7.41637L11.3711 1.75293L11.7012 1.8747C11.9266 2.03069 12.0992 2.22513 12.2188 2.45803C12.3385 2.69094 12.3705 2.93292 12.315 3.18399L12.2941 3.20803L11.5345 7.41637H17.2429C17.6115 7.41637 17.9269 7.54751 18.1892 7.8098C18.4515 8.07208 18.5826 8.38752 18.5826 8.75612V9.62308C18.5826 9.72351 18.5749 9.81351 18.5594 9.8931C18.5439 9.97269 18.5153 10.0558 18.4736 10.1423L16.1052 15.7185C15.9865 15.9829 15.8075 16.193 15.5682 16.349C15.3289 16.505 15.0645 16.583 14.7749 16.583ZM6.75891 15.4997H14.7749C14.8337 15.4997 14.8938 15.4837 14.9552 15.4516C15.0167 15.4195 15.0634 15.3661 15.0955 15.2913L17.4993 9.68718V8.75612C17.4993 8.68133 17.4753 8.61989 17.4272 8.5718C17.3791 8.52372 17.3177 8.49968 17.2429 8.49968H10.2461L11.1868 3.4532L6.75891 7.86508V15.4997ZM5.6756 7.41637V8.49968H2.49931V15.4997H5.6756V16.583H1.41602V7.41637H5.6756Z"
fill="black"></path>
</svg>
<span class="comment-like__number recomendCnt"><c:out value="${cmList.recomendCnt}"/></span>
</button>
<%--게시판설정(댓글평가추천단계-비추천사용)--%>
<c:if test="${bbsInfo.cmEvlRecomendStep eq '02'}">
<button class="comment-like__btn comment-like__btn--dislike" value = "<c:out value ='${cmList.cmInnb}'/>">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M14.7749 16.583H5.6756V7.41637L11.3711 1.75293L11.7012 1.8747C11.9266 2.03069 12.0992 2.22513 12.2188 2.45803C12.3385 2.69094 12.3705 2.93292 12.315 3.18399L12.2941 3.20803L11.5345 7.41637H17.2429C17.6115 7.41637 17.9269 7.54751 18.1892 7.8098C18.4515 8.07208 18.5826 8.38752 18.5826 8.75612V9.62308C18.5826 9.72351 18.5749 9.81351 18.5594 9.8931C18.5439 9.97269 18.5153 10.0558 18.4736 10.1423L16.1052 15.7185C15.9865 15.9829 15.8075 16.193 15.5682 16.349C15.3289 16.505 15.0645 16.583 14.7749 16.583ZM6.75891 15.4997H14.7749C14.8337 15.4997 14.8938 15.4837 14.9552 15.4516C15.0167 15.4195 15.0634 15.3661 15.0955 15.2913L17.4993 9.68718V8.75612C17.4993 8.68133 17.4753 8.61989 17.4272 8.5718C17.3791 8.52372 17.3177 8.49968 17.2429 8.49968H10.2461L11.1868 3.4532L6.75891 7.86508V15.4997ZM5.6756 7.41637V8.49968H2.49931V15.4997H5.6756V16.583H1.41602V7.41637H5.6756Z"
fill="black"></path>
</svg>
<span class="comment-like__number nonrecomendCnt"><c:out value="${cmList.nonrecomendCnt}"/></span>
</button>
</c:if>
</div>
</c:if>
</div>
<c:if test="${cmList.depth eq 0}">
<div class="comment-body__nested-container">
</c:if>
<c:if test = "${not empty resultMap.cmList.cmAnswList}">
<c:forEach var="item" items="${resultMap.cmList.cmAnswList}">
<c:if test="${cmList.cmInnb eq item.parntsCmInnb}">
<div class="comment-body__item commentDiv">
<div class="comment-body__info">
<div class="comment-body__info-left">
<i class="icon icon_comment-user"></i>
<span class="comment-body__user">
<c:choose>
<c:when test="${item.regusrDvCd eq '99'}">
<c:out value="${item.maskingRegusrNm}"/>[비회원]
</c:when>
<c:when test="${item.regusrDvCd eq '02'}">
<c:out value="${item.mngrNm}"/>
</c:when>
<c:when test="${item.wrterIndictTyCd eq '01' && item.regusrDvCd eq '01'}">
<c:out value="${ item.maskingRegusrId}"/>(<c:out value="${ item.mbrGradNm}"/>)
</c:when>
<c:when test="${item.wrterIndictTyCd eq '02' && item.regusrDvCd eq '01'}">
<c:out value="${ item.maskingRegusrId}"/>
</c:when>
<c:when test="${item.wrterIndictTyCd eq '03' && item.regusrDvCd eq '01'}">
<c:out value="${ item.maskingRegusrNm}"/>(<c:out value="${ item.mbrGradNm}"/>)
</c:when>
<c:when test="${item.wrterIndictTyCd eq '04' && item.regusrDvCd eq '01'}">
<c:out value="${ item.maskingRegusrNm}"/>
</c:when>
<c:when test="${item.wrterIndictTyCd eq '05' && item.regusrDvCd eq '01'}">
<c:out value="${ item.maskingRegusrNm}"/><br>
(<c:out value="${ item.maskingRegusrId}"/>,<c:out value="${ item.mbrGradNm}"/>)
</c:when>
<c:when test="${item.wrterIndictTyCd eq '06' && item.regusrDvCd eq '01'}">
<c:out value="${ item.maskingRegusrNm}"/>(<c:out value="${ item.maskingRegusrId}"/>)
</c:when>
</c:choose>
</span>
<span class="comment-body__date"><c:out value="${item.registDt}"/></span>
<c:if test="${item.newAt eq 'Y'}">
<i class="icon icon_new-post"></i>
</c:if>
</div>
<div class="comment-body__info-right">
<button class="comment-body__button cmcmUpdtBtn" value="${item.cmInnb}" re-at="Y">수정
</button>
<button class="comment-body__button cmDelBtn" value="${item.cmInnb}" re-at="Y">삭제
</button>
</div>
</div>
<div class="comment-body__content replyCmDiv"> <%--답글--%>
<c:choose>
<c:when test="${item.secretBbscttAt eq 'Y'}">
<c:choose>
<c:when test="${item.regusr eq cmVO.mbrInnb}"><%--본인 꺼는 비밀 댓글 내용 보임--%>
<p class="cmcmCn" style="white-space: pre-wrap;"><i class="icon icon_lock"></i><c:out value="${item.cn}"/></p>
</c:when>
<c:otherwise>
<p class="cmcmCn" style="white-space: pre-wrap;"><i class="icon icon_lock"></i><button class="comment-body__privateComment secretCmCm cmcmCn" value="<c:out value = '${item.cmInnb}'/>">비밀 댓글입니다.</button></p>
</c:otherwise>
</c:choose>
</c:when>
<c:otherwise>
<p class="cmcmCn" style="white-space: pre-wrap;"><c:out value="${item.cn}"/></p>
</c:otherwise>
</c:choose>
</div>
<%--게시판설정(댓글평가사용여부)--%>
<c:if test="${bbsInfo.cmEvlUseAt eq 'Y'}">
<div class="comment-like">
<button class="comment-like__btn comment-like__btn--like" value = "<c:out value ='${item.cmInnb}'/>">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M14.7749 16.583H5.6756V7.41637L11.3711 1.75293L11.7012 1.8747C11.9266 2.03069 12.0992 2.22513 12.2188 2.45803C12.3385 2.69094 12.3705 2.93292 12.315 3.18399L12.2941 3.20803L11.5345 7.41637H17.2429C17.6115 7.41637 17.9269 7.54751 18.1892 7.8098C18.4515 8.07208 18.5826 8.38752 18.5826 8.75612V9.62308C18.5826 9.72351 18.5749 9.81351 18.5594 9.8931C18.5439 9.97269 18.5153 10.0558 18.4736 10.1423L16.1052 15.7185C15.9865 15.9829 15.8075 16.193 15.5682 16.349C15.3289 16.505 15.0645 16.583 14.7749 16.583ZM6.75891 15.4997H14.7749C14.8337 15.4997 14.8938 15.4837 14.9552 15.4516C15.0167 15.4195 15.0634 15.3661 15.0955 15.2913L17.4993 9.68718V8.75612C17.4993 8.68133 17.4753 8.61989 17.4272 8.5718C17.3791 8.52372 17.3177 8.49968 17.2429 8.49968H10.2461L11.1868 3.4532L6.75891 7.86508V15.4997ZM5.6756 7.41637V8.49968H2.49931V15.4997H5.6756V16.583H1.41602V7.41637H5.6756Z"
fill="black"></path>
</svg>
<span class="comment-like__number recomendCnt"><c:out value="${item.recomendCnt}"/></span>
</button>
<%--게시판설정(댓글평가추천단계-비추천사용)--%>
<c:if test="${bbsInfo.cmEvlRecomendStep eq '02'}">
<button class="comment-like__btn comment-like__btn--dislike" value = "<c:out value ='${item.cmInnb}'/>">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M14.7749 16.583H5.6756V7.41637L11.3711 1.75293L11.7012 1.8747C11.9266 2.03069 12.0992 2.22513 12.2188 2.45803C12.3385 2.69094 12.3705 2.93292 12.315 3.18399L12.2941 3.20803L11.5345 7.41637H17.2429C17.6115 7.41637 17.9269 7.54751 18.1892 7.8098C18.4515 8.07208 18.5826 8.38752 18.5826 8.75612V9.62308C18.5826 9.72351 18.5749 9.81351 18.5594 9.8931C18.5439 9.97269 18.5153 10.0558 18.4736 10.1423L16.1052 15.7185C15.9865 15.9829 15.8075 16.193 15.5682 16.349C15.3289 16.505 15.0645 16.583 14.7749 16.583ZM6.75891 15.4997H14.7749C14.8337 15.4997 14.8938 15.4837 14.9552 15.4516C15.0167 15.4195 15.0634 15.3661 15.0955 15.2913L17.4993 9.68718V8.75612C17.4993 8.68133 17.4753 8.61989 17.4272 8.5718C17.3791 8.52372 17.3177 8.49968 17.2429 8.49968H10.2461L11.1868 3.4532L6.75891 7.86508V15.4997ZM5.6756 7.41637V8.49968H2.49931V15.4997H5.6756V16.583H1.41602V7.41637H5.6756Z"
fill="black"></path>
</svg>
<span class="comment-like__number nonrecomendCnt"><c:out value="${item.nonrecomendCnt}"/></span>
</button>
</c:if>
</div>
</c:if>
</div>
<div class="dtlCmDiv">
<input type="hidden" name="secretBbscttAt" value="${item.secretBbscttAt}">
<input type="hidden" name="password" value="${item.password}">
</div>
</c:if>
</c:forEach>
</c:if>
<c:if test="${cmList.depth eq 0}">
<div class="comment-body__item cnWriteDiv">
<div class="comment-write">
<div class="comment-write__textarea-container">
<c:choose>
<c:when test = "${cmVO.authResult eq 'Y'}">
<textarea class="comment-write__textarea" rows="5"
placeholder="댓글을 입력하세요."
name="cn"
title="댓글 입력"></textarea>
</c:when>
<c:otherwise>
<textarea class="comment-write__textarea" rows="5"
placeholder="로그인 또는 댓글권한이 있을 경우 등록하실 수 있습니다." readonly></textarea>
</c:otherwise>
</c:choose>
</div>
<div class="comment-write__bottom">
<div class="comment-write__info">
<div class="comment-write__info-inner">
<c:if test = "${cmVO.authResult eq 'Y'}">
<div class="comment-write__info-item cmInputNm">
<input type="text" class="comment-write__info-input"
placeholder="이름"
name="regusrNm" maxlength="25"
value= "<c:out value="${cmVO.regusrNm}"/>"
title="이름 입력">
</div>
<c:if test="${cmVO.regusrDvCd eq '99'}">
<div class="comment-write__info-item cmInputPw">
<input type="password" class="comment-write__info-input"
name="password"
maxlength="25"
placeholder="비밀번호" title="비밀번호 입력">
</div>
</c:if>
</c:if>
</div>
</div>
<div class="comment-write__controls">
<c:choose>
<c:when test = "${cmVO.authResult eq 'Y'}">
<div class="b-checkbox-container">
<label class="b-checkbox checkbox secretBbscttAt">
<input type="checkbox" value="Y" name="secretBbscttAt"
id="secretChk">
<span class="check"></span>
<span class="control-label">비밀 댓글</span>
</label>
</div>
<button class="btn sm theme reCreBtn"><spring:message code="button.insert"/></button>
</c:when>
<c:otherwise>
<button class="btn sm theme" id="rejectAuthCmBtn" onclick = "openModal('login_alert')"><spring:message code="button.insert"/></button>
</c:otherwise>
</c:choose>
</div>
</div>
</div>
</div>
<input type="hidden" name="bbscttInnb" value="<c:out value ='${cmList.bbscttInnb}'/>"/>
<input type="hidden" name="bbsId" value="<c:out value ='${cmList.bbsId}'/>"/>
<input type="hidden" name="cmInnb" value="<c:out value ='${cmList.cmInnb}'/>" class="cmInnb"/>
<div class="comment-body__item close" tabindex="0">
답글접기
</div>
</div>
</c:if>
</div>
</c:forEach>
</c:when>
<c:otherwise>
<div class="comment-body__content">
<div class="table__no-result" style="padding:0px 0 0px;">
<img src="/pc/images/icon__no-result.png" alt="댓글 없음">
<p class="table__no-result-text">
<spring:message code="common.nodata"/>
</p>
</div>
</div>
</c:otherwise>
</c:choose>
</html>

View File

@@ -0,0 +1,129 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<c:set var="bbsInfo" value="${resultMap.bbsInfo}"/>
<c:set var="bbscttVO" value="${resultMap.bbsctt}"/>
<c:choose>
<c:when test="${not empty resultMap.resultList.resultList}">
<c:forEach var="resultList" items="${resultMap.resultList.resultList}">
<details class="myQnaList__item item"
password-at="<c:if test = "${resultList.secretBbscttAt eq 'Y' || not empty resultList.password}">Y</c:if>"
regusr="<c:out value="${ resultList.regusr}"/>"
bbsctt="<c:out value="${ resultList.bbscttInnb }"/>"
regusr-dv-cd="<c:out value="${ resultList.regusrDvCd }"/>">
<summary class="myQnaList__top">
<div class="myQnaList__right">
<div class="myQnaList__info">
<input type="hidden" name="bbscttInnb" value="${resultList.bbscttInnb}">
<p class="myQnaList__info__question">
<c:if test="${not empty resultList.answCn}">
[<c:out value="${resultList.answCn}"/>]
</c:if>
<c:out value="${resultList.sj}"/>
<c:if test="${resultList.isfiles eq 1}"><%--첨부파일여부--%>
<i class="icon icon_image-badge"></i>
</c:if>
<c:if test="${resultList.newAt eq 'Y'}"><%--새로운게시글여부--%>
<i class="icon icon_new-post"></i>
</c:if>
<c:if test="${resultList.popularAt eq 'Y'}"><%--인기게시글여부--%>
<i class="icon icon_hot-post"></i>
</c:if>
<c:if test="${ resultList.secretBbscttAt eq 'Y' }"><%--비밀글여부--%>
<i class="icon icon_lock"></i>
</c:if>
<c:if test="${resultList.cmtCnt > 0}"><%--댓글개수--%>
(<fmt:formatNumber value="${resultList.cmtCnt}" pattern="#,###"/>)
</c:if>
</p>
<p class="myQnaList__info__status">
<c:if test = "${bbsInfo.answRegist eq 'Y'}">
<c:choose>
<c:when test="${not empty resultList.answBbscttInnb}">
<span class="myQnaList__info__date">답변완료</span>
</c:when>
<c:otherwise>
<span class="myQnaList__info__date">답변대기</span>
</c:otherwise>
</c:choose>
</c:if>
<c:if test="${bbsInfo.ntcDeYn eq 'Y'}">
<c:choose>
<c:when test="${resultList.ntcAt eq 'Y' && resultList.ntcPdSetupAt eq 'Y'}">
<span class="myQnaList__info__date"><c:out value="${ resultList.ntcBgnDe }"/> ~ <c:out value="${ resultList.ntcEndDe }"/></span>
</c:when>
<c:when test="${ resultList.ntcAt eq 'Y' && resultList.ntcPdSetupAt eq 'N'}">
<span class="myQnaList__info__date">상시공지</span>
</c:when>
</c:choose>
</c:if>
<c:if test="${bbsInfo.regusrNmYn eq 'Y'}">
<span class="myQnaList__info__date">
<c:choose>
<c:when test="${resultList.regusrDvCd eq '99'}">
<c:out value="${ resultList.maskingRegusrNm}"/>[비회원]
</c:when>
<c:when test="${resultList.regusrDvCd eq '03'&& not empty resultList.npayBbscttSnb}">
naverpay
</c:when>
<c:when test="${resultList.regusrDvCd eq '02'}">
<c:out value="${ resultList.mngrNm}"/>
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '01' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.regusrId}"/>
(<c:out value="${ resultList.mbrGradNm}"/>)
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '02' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.regusrId}"/>
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '03' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>(<c:out
value="${ resultList.mbrGradNm}"/>)
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '04' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '05' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>
(<c:out value="${ resultList.regusrId}"/>,<c:out
value="${ resultList.mbrGradNm}"/>)
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '06' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>(<c:out
value="${ resultList.regusrId}"/>)
</c:when>
</c:choose>
</span>
</c:if>
<c:if test="${bbsInfo.inqireCntYn eq 'Y'}">
<span class="myQnaList__info__date">조회수 : <fmt:formatNumber value="${resultList.inqireCnt}" pattern="#,###"/></span>
</c:if>
<c:if test="${bbsInfo.registDtYn eq 'Y'}">
<span class="myQnaList__info__date"><c:out value="${ resultList.sumRegistDt}"/></span>
</c:if>
</p>
<span class="myQnaList__top__chevron"></span>
</div>
</div>
</summary>
<div class="myQnaList__answer">
</div>
</details>
</c:forEach>
</c:when>
<c:otherwise>
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png">
</div>
<p class="noResult__text"><spring:message code="common.nodata"/></p>
</div>
</c:otherwise>
</c:choose>
<input type = "hidden" id = "answAt" value = "Y"/>
<input type = "hidden" id = "regusr" value = "<c:out value="${bbscttVO.regusr}"/>"/>

View File

@@ -0,0 +1,149 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : EvtListR.jsp
Description : 이벤트 목록
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-04-30 김혜인 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<c:set var = "bbscttVO" value = "${resultMap.bbsctt}"/>
<c:set var = "bbsInfo" value = "${resultMap.bbsInfo}"/>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<c:choose>
<c:when test="${ not empty resultMap.resultList.resultList }">
<c:set var="rnumAt" value="false"/>
<c:forEach var="resultList" items="${ resultMap.resultList.resultList}">
<div class="progressEvents__item item">
<a class="dtlBtn" style="cursor:pointer">
<input type="hidden" class="passwordAt" value="<c:if test = "${resultList.secretBbscttAt eq 'Y'}">Y</c:if>">
<input type="hidden" class="regusr" value="<c:out value="${ resultList.regusr}"/>">
<input type="hidden" class="bbscttInnb" value="<c:out value="${ resultList.bbscttInnb }"/>">
<div class="progressEvents__image">
<input type = "hidden" value = "<c:out value="${resultList.reprsntImgSysFilNm}"/>"/>
<img src="<c:out value ="${cdnurl}${resultList.reprsntImgSysFilNm}"/>"
onerror= "this.src='/mobile/images/image_placeholder.png'" alt="해당 이미지에 대한 설명">
</div>
<div class="progressEvents__text">
<h4 class="progressEvents__title">
<c:out value ="${resultList.sj}"/>
<c:if test="${resultList.isfiles eq 1}"><%--첨부파일여부--%>
<i class="icon icon_image-badge"></i>
</c:if>
<c:if test="${resultList.newAt eq 'Y'}"><%--새로운게시글여부--%>
<i class="icon icon_new-post"></i>
</c:if>
<c:if test="${resultList.popularAt eq 'Y'}"><%--인기게시글여부--%>
<i class="icon icon_hot-post"></i>
</c:if>
<c:if test="${ resultList.secretBbscttAt eq 'Y' }"><%--비밀글여부--%>
<i class="icon icon_lock"></i>
</c:if>
<c:if test="${resultList.cmtCnt > 0}"><%--댓글개수--%>
(<fmt:formatNumber value="${resultList.cmtCnt}" pattern="#,###"/>)
</c:if>
</h4>
<div class="progressEvents__bottom">
<p class="progressEvents__date">
</p>
</div>
</div>
<ul class="eventList__list">
<c:if test="${bbsInfo.answRegist eq 'Y'}">
<c:choose>
<c:when test="${not empty resultList.answBbscttInnb}">
<li>답변완료</li>
</c:when>
<c:otherwise>
<li>답변대기</li>
</c:otherwise>
</c:choose>
</c:if>
<c:if test="${bbsInfo.ntcDeYn eq 'Y'}">
<c:choose>
<c:when test="${resultList.ntcAt eq 'Y' && resultList.ntcPdSetupAt eq 'Y'}">
<li><c:out value="${ resultList.ntcBgnDe }"/> ~ <c:out value="${ resultList.ntcEndDe }"/></li>
</c:when>
<c:when test="${ resultList.ntcAt eq 'Y' && resultList.ntcPdSetupAt eq 'N'}">
<li>상시공지</li>
</c:when>
</c:choose>
</c:if>
<c:if test="${bbsInfo.inqireCntYn eq 'Y'}">
<li>조회수 : <fmt:formatNumber value="${resultList.inqireCnt}" pattern="#,###"/></li>
</c:if>
<c:if test="${bbsInfo.registDtYn eq 'Y'}">
<li><c:out value="${ resultList.sumRegistDt}"/></li>
</c:if>
<c:if test="${bbsInfo.regusrNmYn eq 'Y'}">
<li>
<c:choose>
<c:when test="${resultList.regusrDvCd eq '99'}">
<c:out value="${ resultList.maskingRegusrNm}"/>[비회원]
</c:when>
<c:when test="${resultList.regusrDvCd eq '03'&& not empty resultList.npayBbscttSnb}">
naverpay
</c:when>
<c:when test="${resultList.regusrDvCd eq '02'}">
<c:out value="${ resultList.mngrNm}"/>
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '01' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.regusrId}"/>
(<c:out value="${ resultList.mbrGradNm}"/>)
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '02' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.regusrId}"/>
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '03' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>(<c:out
value="${ resultList.mbrGradNm}"/>)
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '04' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '05' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>
(<c:out value="${ resultList.regusrId}"/>,<c:out
value="${ resultList.mbrGradNm}"/>)
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '06' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>(<c:out
value="${ resultList.regusrId}"/>)
</c:when>
</c:choose>
</li>
</c:if>
</ul>
</a>
</div>
<c:if test="${resultList.rnum > 0}">
<c:set var="rnumAt" value="true"/>
</c:if>
<c:if test="${not rnumAt}"><%--조회된 데이터 없을 시 데이터 없음 노출--%>
<div class="progressEvents__item item"><spring:message code="common.nodata"/></div>
</c:if>
</c:forEach>
</c:when>
<c:otherwise>
<div class="sub-box">
<div class="progressEvents">
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png" alt="상품 이미지">
</div>
<spring:message code="common.nodata"/>
</div>
</div>
</div>
</c:otherwise>
</c:choose>
</html>

View File

@@ -0,0 +1,432 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : NoticeListR.jsp
Description :모바일 샘플.jsp
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-02 최남식 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function (){
/*헤더에 타이틀 set*/
const title = '<c:out value="${resultMap.bbsInfo.bbsNm}"/>';/*게시판이름*/
fn_set_header_title(title);
//엔터 submit 방지
$('#srchForm').on('keydown', function (e) {
if (e.keyCode == 13) {
e.preventDefault();
$('#srchBtn').trigger("click");
}
});
//분류 선택
$(".sub-tab__btn").on("click", function () {
let idx = $(this).index();
$(".sub-tab__btn").not($(this)).removeClass("current");
$(this).addClass("current");
fn_select_List(1, idx);
});
// 'sub-tab__trigger' 클래스를 가진 요소가 있는지 확인
if (!$(".sub-tab__trigger").length > 0) {
fn_select_List(1);
} else {
$(".sub-tab__btn").eq(0).click(); //클래스 부여 로직 필요
}
//검색
$(document).on("click", "#srchBtn", function () {
fn_select_List(1);
});
// 고객센터 메인 이동
$(document).on('click','.header__toBack__btn',function(){
location.href='/sopmal/csc/selectCscMainForm';
});
//상세보기
$(document).on("click", ".dtlBtn", function () {
const bbscttInnb = $(this).find(".bbscttInnb").val();
fn_select_crud_posbl_at(bbscttInnb, '', '', 'R');
});
});
//crud 가능 판단
const fn_select_crud_posbl_at = (bbsctt, idx, pwCnfirmAt, crudDv) => {
$.ajax({
type: 'post',
url: '<c:url value="/sopmal/csc/selectBbscttDtlMovePosblAt"/>',
data: {
"bbscttInnb": bbsctt,
"bbsId": $("#bbsId").val(),
"sknTyCd": $("#sknTyCd").val(),
"pwCnfirmAt": pwCnfirmAt,
"crudDv": crudDv
},
success: function (data) {
data = JSON.parse(data.resBody.result);
fn_branch_bbsctt_posble(data, idx);
}
});
}
//상세보기 가능 판단 여부에 따른 분기 처리
const fn_branch_bbsctt_posble = (data, idx) => {
const moveAt = data.result.moveAt;
const vo = data.vo;
if (moveAt === 'YES' || vo.pwCnfirmAt === 'Y') {//본인 o
if (vo.crudDv === 'R') {
fn_move_dtl(vo.bbscttInnb);
} else if (vo.crudDv === 'U') {
fn_move_qaUpdt(vo.bbscttInnb);
} else if (vo.crudDv === 'D') {
fn_delete_bbsctt(vo.bbscttInnb, vo.bbsId);
}
} else if (moveAt === 'OTHER') {//다른이용자 o
openModal("reject_modi_pop");
} else if (moveAt === 'LOGIN') {//로그인 o
openModal("login_alert");
} else {//비밀번호
$("#modalPw").val("");
openModal("confirm_pw_pop");
$("#modalBbscttInnb").val(vo.bbscttInnb);
$("#modalIdx").val(idx);
$("#modalCrudDv").val(vo.crudDv);
}
}
//리스트 조회
const fn_select_List = (pageIndex,idx) => {
const sknTyCd = $("#sknTyCd").val();
const bbsTyCd = $("#bbsTyCd").val();
let url;
if (!pageIndex) {
$('#pageIndex').val(1);
} else {
$('#pageIndex').val(pageIndex);
}
let pageUnit = 10;
if (bbsTyCd === '01') {
//일반게시글 스킨타입
if (sknTyCd === '01') {
url = '/sopmal/csc/selectCscListTy';//리스트
} else if (sknTyCd === '02') {
url = '/sopmal/csc/selectCscGalaryTy';//갤러리
} else {
url = '/sopmal/csc/selectCscAcordionTy';//아코디언
}
} else if (bbsTyCd === '02') {
url = '/sopmal/csc/selectNoticeListInqire'//공지사항
} else if (bbsTyCd === '04') {
url = '/sopmal/csc/selectFaqListInqire'//FAQ
}
let srchForm = $("#srchForm").serialize() + "&pageIndex=" + pageIndex + "&useAt=Y&expsrAt=Y";
let itmInnb;
//분류 조회
if (idx !== 0 && idx !== undefined) { //분류 클릭
itmInnb = $(".sub-tab__btn").eq(idx).val();
srchForm = srchForm + "&srchitmInnb=" + itmInnb;
} else {
if ($(".sub-tab__btn.current").index() > 0) { //검색어
srchForm = srchForm + "&srchitmInnb=" + $(".sub-tab__btn.current").val();
}
}
$.ajax({
type: "post",
data: srchForm,
url: url,
success: function (data) {
if ($(".content").html()) {
$(".content").remove();
}
$(".customerNotice").append(data);
//인피니티 스크롤 이벤트 감지 함수
fn_infinite_scroll(fn_add_list,'','footer');
}
});
}
//인피니티 스크롤 이벤트 콜백 함수
const fn_add_list = () => {
if ($("#evtOccrrncAt").val() === 'continue') {
/*다음 페이지로 이동*/
let pageIndex = parseInt($("#pageIndex").val(), 10);
$("#pageIndex").val(++pageIndex);
let idx = $(".sub-tab__btn.current").index();
/*검색 조건*/
let srchForm = $("#srchForm").serialize() + "&useAt=Y&expsrAt=Y&ntcAt=Y";
let itmInnb;
//분류 조회
if (idx >= 0) {
itmInnb = $(".sub-tab__btn").eq(idx).val();
srchForm = srchForm + "&srchitmInnb=" + itmInnb;
}
$.ajax({
type: "post",
data: srchForm,
url: "/sopmal/csc/selectAjaxListInqire",
success: function (data) {
data = JSON.parse(data.resBody.result);
fn_append_List(data);//DATA append 함수
}
});
}
}
// data append 함수
const fn_append_List = (data) => {
const result = data.resultList.resultList;
let list = ``;
const sknTyCd = $("#sknTyCd").val();
if(result.length > 0){
result.forEach(function (item) {
// 길이에 따른 span 태그 설정
let spanTop = item.sj.length > 35 ? `<span class="customerMain__boardDate">` : '';
let spanBottom = item.sj.length > 35 ? `</span>` : '';
// 아이콘 설정
let fileIcon = item.isfiles === 1 ? `<i class="icon icon_image-badge"></i>` : '';
let newIcon = item.newAt === 'Y' ? `<i class="icon icon_new-post"></i>` : '';
let hotIcon = item.popularAt === 'Y' ? `<i class="icon icon_hot-post"></i>` : '';
let lockIcon = item.secretBbscttAt === 'Y' ? `<i class="icon icon_lock"></i>` : '';
// 리스트 항목 추가
if(sknTyCd === '01'){
list += `<li>
<input type="hidden" name="bbscttInnb" value="\${item.bbscttInnb}\">
<details>
<summary>
\${item.sj}\
\${spanTop}\
\${fileIcon}\
\${newIcon}\
\${hotIcon}\
\${lockIcon}\
\${spanBottom}\
<span class="customerMain__boardDate">
\${item.sumRegistDt}\
</span>
</summary>
</details>
</li>`;
}else if(sknTyCd === '03'){
list += `<li>
<input type="hidden" name="bbscttInnb" value="\${item.bbscttInnb}\">
<details>
<summary>
\${item.sj}\
\${spanTop}\
\${fileIcon}\
\${newIcon}\
\${hotIcon}\
\${lockIcon}\
\${spanBottom}\
<span class="customerMain__boardDate">
\${item.sumRegistDt}\
</span>
</summary>
<div class="customerMain__boardContent">
\${item.cn}\
</div>
</details>
</li>`;
}
});
$("#evtOccrrncAt").val("continue");
// 리스트를 지정된 요소에 추가
$(".customerMain__boardList").append(list);
}else{
/*데이터 조회 null일시 그 전 페이지 인덱스로 변경*/
$("#evtOccrrncAt").val("stop");
let pageIndex = parseInt($("#pageIndex").val(), 10);
$("#pageIndex").val(pageIndex-1);
}
};
//상세 이동
const fn_move_dtl = (bbscttInnb) => {
$("#bbscttInnb").val(bbscttInnb);
$("#dtlForm").submit();
}
</script>
<body>
<%--게시판 정보--%>
<c:set var="bbsInfo" value="${resultMap.bbsInfo}"/>
<%--vo--%>
<c:set var="bbscttVO" value="${resultMap.bbsctt}"/>
<%--분류 목록--%>
<c:set var="itmList" value="${resultMap.itmList}"/>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<%--게시판 정보--%>
<div class="customerNotice">
<div class="topSearchBox">
<c:if test = "${not empty itmList}">
<div class="sub-tab__trigger">
<button type = "button" class="sub-tab__btn current">전체</button>
<c:forEach var="item" items="${itmList}">
<button type = "button" class="sub-tab__btn" value="<c:out value="${item.itmInnb}"/>"><c:out value="${item.itmCn}"/></button>
</c:forEach>
</div>
</c:if>
<form id="srchForm">
<div class="innerSearch">
<input type="hidden" name="bbsId" id="bbsId" value="<c:out value="${bbsInfo.bbsId}"/>">
<input type="hidden" name="sknTyCd" id="sknTyCd" value="<c:out value="${bbsInfo.sknTyCd}"/>">
<input type="hidden" name="bbsTyCd" id="bbsTyCd" value="<c:out value="${bbsInfo.bbsTyCd}"/>">
<input type="hidden" name="srchDv" id="srchDv" value="any">
<input type="hidden" name="pgeVtcCnt" id="pgeVtcCnt" value="<c:out value="${bbsInfo.pgeVtcCnt}"/>">
<input type="hidden" name="pgeWthCnt" id="pgeWthCnt" value="<c:out value="${bbsInfo.pgeWthCnt}"/>">
<input type="hidden" name="prevNext" id="prevNext" value="<c:out value="${bbsInfo.prevNext}"/>">
<input type="hidden" name="regusrDvCd" id="regusrDvCd" value="<c:out value="${bbscttVO.regusrDvCd}"/>">
<input type="hidden" name="pageIndex" id="pageIndex" value="<c:out value="${ resultMap.bbsctt.pageIndex}"/>"/><%--페이지인덱스--%>
<input type="hidden" id="evtOccrrncAt" value="continue"/><%--인피니티스크롤 이벤트 발생 여부--%>
<input type="hidden" name="slangFlterUseAt" id = "slangFlterUseAt" value = "<c:out value="${bbsInfo.slangFlterUseAt}"/>">
<input type="search" name="srchKeyword" id="srchKeyword" placeholder="궁금하신 내용을 입력해 주세요" title="검색어 입력"><%--검색어--%>
<button type="button" id="srchBtn"><i class="icon icon_nav-search"></i></button>
</div>
</form>
<form id = "dtlForm" action="/sopmal/csc/selectBbscttDtlInqire" method="get">
<input type="hidden" name="bbscttInnb" id="bbscttInnb"><%--게시글 고유번호--%>
<input type="hidden" name="bbsId" value="<c:out value = "${bbsInfo.bbsId}"/>"/><%--게시판아이디--%>
<input type="hidden" name="bbsTyCd" value="<c:out value = "${bbsInfo.bbsTyCd}"/>"/><%--게시판타입--%>
<input type="hidden" name="recomendGoodsExpsrAt" value="<c:out value = "${bbsInfo.recomendGoodsExpsrAt}"/>"/><%--추천상품노출여부--%>
<input type="hidden" name="prevNext" value="<c:out value = "${bbsInfo.prevNext}"/>"/><%--이전글다음글노출여부--%>
<input type="hidden" name="useAt" value="Y"/><%--사용자 노출 조건--%>
<input type="hidden" name="expsrAt" value="Y"/><%--사용자 노출 조건--%>
<input type="hidden" name="reqUrl" value="csc"/><%--권한체크 요청 url--%>
<input type="hidden" name="authDv" value="CM"/><%--상세 권한체크--%>
</form>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/comm/mobile/Footer.jsp"/>
</div>
</div>
</body>
<%--비밀번호 미입력--%>
<div class="microModal microAlert" id="reject_modi_pop" aria-modal="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
글작성자만 이용가능합니다.
</h2>
<button type="button" data-micromodal-close aria-label="창 닫기"></button>
</div>
</div>
<div class="microModal__btnContainer">
<button type="button" data-micromodal-close aria-label="창 닫기"><spring:message code="button.ok"/></button>
</div>
</div>
</div>
</div>
<%--비밀번호 미입력--%>
<div class="microModal microAlert" id="alert_undefined_pw" aria-modal="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
비밀번호를 입력해주세요
</h2>
<button type="button" data-micromodal-close aria-label="창 닫기"></button>
</div>
</div>
<div class="microModal__btnContainer">
<button type="button" data-micromodal-close aria-label="창 닫기"><spring:message code="button.ok"/></button>
</div>
</div>
</div>
</div>
<%--비밀번호 불일치--%>
<div class="microModal microAlert" id="alert_reject_pw" aria-modal="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
비밀번호가 일치하지 않습니다.
</h2>
<button type="button" data-micromodal-close aria-label="창 닫기"></button>
</div>
</div>
<div class="microModal__btnContainer">
<button type="button" data-micromodal-close aria-label="창 닫기"><spring:message code="button.ok"/></button>
</div>
</div>
</div>
</div>
<%--비밀번호 확인 모달--%>
<div class="microModal microAlert" id="confirm_pw_pop" aria-modal="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
등록시에 입력했던<br> 비밀번호를 입력해 주세요
</h2>
</div>
<div class="microModal__content">
<p>
<input class="input-text full" type="password" title="비밀번호 입력" placeholder="비밀번호 입력" name="password" id = "modalPw">
</p>
</div>
<input type="hidden" name="bbscttInnb" id="modalBbscttInnb">
<input type="hidden" id="modalIdx">
<input type="hidden" id="modalAnswAt">
<input type="hidden" id="reqAction">
<input type="hidden" id="modalcrudDv">
</div>
<div class="microModal__btnContainer">
<button type="button" class="microModal__btn" data-micromodal-close aria-label="창 닫기">
<spring:message code="button.cancel"/>
</button>
<button type="button" class="microModal__btn microModal__btn-primary" id="pwChkBtn">
<spring:message code="button.ok"/>
</button>
</div>
</div>
</div>
</div>
</html>

View File

@@ -0,0 +1,158 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<c:set var = "bbsInfo" value = "${resultMap.bbsInfo}"/>
<c:choose>
<c:when test="${ not empty resultMap.resultList.resultList }">
<div class="eventList">
<c:forEach var="resultList" items="${ resultMap.resultList.resultList}">
<a class="eventList__item dtlBtn item" style="cursor:pointer" >
<input type="hidden" class="passwordAt" value="<c:if test = "${resultList.secretBbscttAt eq 'Y'}">Y</c:if>">
<input type="hidden" class="regusr" value="<c:out value="${ resultList.regusr}"/>">
<input type="hidden" class="bbscttInnb" value="<c:out value="${ resultList.bbscttInnb }"/>">
<div class="eventList__top">
<c:choose>
<c:when test="${resultList.secretBbscttAt eq 'Y'}">
<c:choose>
<c:when test = "${resultList.regusrDvCd ne '02'}">
<c:if test="${not empty resultList.answCn}">
[<c:out value="${ resultList.answCn }"/>]
</c:if>
<span>${ resultList.maskingRegusrNm}</span>님의 ${resultMap.bbsInfo.bbsNm}
</c:when>
<c:otherwise>
비밀글입니다.
</c:otherwise>
</c:choose>
</c:when>
<c:otherwise>
<c:if test="${not empty resultList.answCn}">
[<c:out value="${ resultList.answCn }"/>]
</c:if>
<c:out value ="${resultList.sj}"/>
</c:otherwise>
</c:choose>
<c:if test="${resultList.isfiles eq 1}"><%--첨부파일여부--%>
<i class="icon icon_image-badge"></i>
</c:if>
<c:if test="${resultList.newAt eq 'Y'}"><%--새로운게시글여부--%>
<i class="icon icon_new-post"></i>
</c:if>
<c:if test="${resultList.popularAt eq 'Y'}"><%--인기게시글여부--%>
<i class="icon icon_hot-post"></i>
</c:if>
<c:if test="${ resultList.secretBbscttAt eq 'Y' }"><%--비밀글여부--%>
<i class="icon icon_lock"></i>
</c:if>
<c:if test="${resultList.cmtCnt > 0}"><%--댓글개수--%>
(<fmt:formatNumber value="${resultList.cmtCnt}" pattern="#,###"/>)
</c:if>
</div>
<ul class="eventList__list">
<c:if test="${bbsInfo.answRegist eq 'Y'}">
<c:choose>
<c:when test="${not empty resultList.answBbscttInnb}">
<li>답변완료</li>
</c:when>
<c:otherwise>
<li>답변대기</li>
</c:otherwise>
</c:choose>
</c:if>
<c:if test="${bbsInfo.ntcDeYn eq 'Y'}">
<c:choose>
<c:when test="${resultList.ntcAt eq 'Y' && resultList.ntcPdSetupAt eq 'Y'}">
<li><c:out value="${ resultList.ntcBgnDe }"/> ~ <c:out value="${ resultList.ntcEndDe }"/></li>
</c:when>
<c:when test="${ resultList.ntcAt eq 'Y' && resultList.ntcPdSetupAt eq 'N'}">
<li>상시공지</li>
</c:when>
</c:choose>
</c:if>
<c:if test="${bbsInfo.inqireCntYn eq 'Y'}">
<li>조회수 : <fmt:formatNumber value="${resultList.inqireCnt}" pattern="#,###"/></li>
</c:if>
<c:if test="${bbsInfo.registDtYn eq 'Y'}">
<li><c:out value="${ resultList.sumRegistDt}"/></li>
</c:if>
<c:if test="${bbsInfo.regusrNmYn eq 'Y'}">
<li>
<c:choose>
<c:when test="${resultList.regusrDvCd eq '99'}">
<c:out value="${ resultList.maskingRegusrNm}"/>[비회원]
</c:when>
<c:when test="${resultList.regusrDvCd eq '03'&& not empty resultList.npayBbscttSnb}">
naverpay
</c:when>
<c:when test="${resultList.regusrDvCd eq '02'}">
<c:out value="${ resultList.mngrNm}"/>
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '01' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.regusrId}"/>
(<c:out value="${ resultList.mbrGradNm}"/>)
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '02' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.regusrId}"/>
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '03' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>(<c:out
value="${ resultList.mbrGradNm}"/>)
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '04' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '05' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>
(<c:out value="${ resultList.regusrId}"/>,<c:out
value="${ resultList.mbrGradNm}"/>)
</c:when>
<c:when test="${bbsInfo.wrterIndictTyCd eq '06' && resultList.regusrDvCd eq '01'}">
<c:out value="${ resultList.maskingRegusrNm}"/>(<c:out
value="${ resultList.regusrId}"/>)
</c:when>
</c:choose>
</li>
</c:if>
</ul>
</a>
<c:if test="${bbsInfo.answRegist eq 'Y'}">
<c:if test="${not empty resultList.answBbscttInnb}">
<a class="eventList__item dtlBtn item" style="cursor:pointer" >
<input type="hidden" class="passwordAt" value="<c:if test = "${resultList.secretBbscttAt eq 'Y'}">Y</c:if>">
<input type="hidden" class="regusr" value="<c:out value="${ resultList.regusr}"/>">
<input type="hidden" class="bbscttInnb" value="<c:out value="${ resultList.bbscttInnb }"/>">
<div class="eventList__top">
<i class="icon icon_reply"></i>
<c:out value="${ resultList.maskingRegusrNm}"/>님의 소중한 문의입니다.
<c:if test="${resultList.newAt eq 'Y'}">
<i class="icon icon_new-post"></i>
</c:if>
<c:if test="${ resultList.secretBbscttAt eq 'Y' }">
<i class="icon icon_lock"></i>
</c:if>
</div>
<ul class="eventList__list">
<li><c:out value="${ resultList.mngrNm}"/></li>
<li><c:out value="${ resultList.sumAnswRegistDt}"/></li>
</ul>
</a>
</c:if>
</c:if>
</c:forEach>
</div>
</c:when>
<c:otherwise>
<div class="sub-box">
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png" alt="상품 이미지">
</div>
<p class="noResult__text"><spring:message code="common.nodata"/></p>
</div>
</div>
</c:otherwise>
</c:choose>

View File

@@ -0,0 +1,222 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : NoticeListR.jsp
Description :모바일 샘플.jsp
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-02 최남식 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function (){
/*헤더에 타이틀 set*/
fn_set_header_title("고객센터");
/*게시판 이동*/
$(".moveBbsBtn").on("click",function(){
const bbsId = $(this).val();
const authDv = $(this).attr("auth-dv");
const reqUrl = $(this).attr("req-url");
fn_move_bbs(bbsId,authDv,reqUrl);
});
//상세보기
$(".dtlBtn").on("click", function () {
const bbscttInnb = $(this).find(".bbscttInnb").val();
fn_move_dtl(bbscttInnb);
});
});
/*********************************************************
* 목록 조회 혹은 등록 폼 이동
* bbsId : 해당 게시판 아이디
* authDv : subpage인지 csc인지 (csc:이용안내, 공지사항, faq, 제안하기)
*********************************************************/
const fn_move_bbs = (bbsId, authDv, reqUrl) => {
const hiddenForm = $("#hiddenForm");
if (hiddenForm.length > 0) {
hiddenForm.remove();
}
const form = document.createElement("form");
form.id = "hiddenForm";
form.action = "/sopmal/csc/selectBbscttAuth";
form.method = "POST";
fn_create_input("bbsId", bbsId, form);
fn_create_input("authDv", authDv, form);
fn_create_input("reqUrl", reqUrl, form);
document.body.appendChild(form);
form.submit();
}
//input 생성 함수
const fn_create_input = (name, value, tgtForm) => {
const input = document.createElement('input');
input.setAttribute("type", "hidden");
input.setAttribute("name", name);
input.setAttribute("value", value);
tgtForm.appendChild(input);
}
//공지사항 상세 이동
const fn_move_dtl = (bbscttInnb) => {
$("#noticeBbscttInnb").val(bbscttInnb);
$("#noticeDtlForm").submit();
}
</script>
<body>
<%--쇼핑몰정보--%>
<c:set var = "sopmalInfo" value="${resultMap.sopmalInfo[0]}"/>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="customerMain">
<div class="btnTabLinks">
<c:if test="${!empty sopmallInfo}">
<c:forEach var="topMenuList" items="${sopmallInfo.menuList}" varStatus="status">
<c:if test="${topMenuList.ctgryDvCd eq '04'}">
<button class = "btnTabLinks__link" onclick="location.href='<c:out value="${topMenuList.url}"/>'" id = "<c:out value="${topMenuList.bbsId}"/>"><c:out value="${topMenuList.ctgryNm}"/></button>
</c:if>
</c:forEach>
</c:if>
</div>
<div class="sub-box">
<h3 class="customerMain__innerTitle">자주묻는질문</h3>
<ul class="customerMain__boardList">
<c:forEach var = "faqList" items="${resultMap.cscBbsctt.faqList}">
<li>
<details>
<summary>
<c:if test = "${not empty faqList.answCn}">
<span class="customerMain__boardCategory">[<c:out value="${faqList.answCn}"/>]</span>
</c:if>
<c:out value = "${faqList.sj}" escapeXml="false"/>
</summary>
<div class="customerMain__boardContent ck-content">
<c:out value = "${faqList.cn}" escapeXml="false"/>
</div>
</details>
</li>
</c:forEach>
</ul>
<button class="customerMain__more moveBbsBtn" value ="faq" auth-dv="REDNG" req-url = "csc">전체보기</button>
</div>
<div class="sub-box">
<h3 class="customerMain__innerTitle">공지사항</h3>
<c:set var = "noticeBbsInfo" value = "${resultMap.noticeBbsInfo}"/>
<form id = "noticeDtlForm" action="/sopmal/csc/selectBbscttDtlInqire" method="post">
<input type = "hidden" name = "bbsId" value = "<c:out value = "${noticeBbsInfo.bbsId}"/>"/><%--게시판아이디--%>
<input type = "hidden" name = "bbsTyCd" value = "<c:out value = "${noticeBbsInfo.bbsTyCd}"/>"/><%--게시판타입--%>
<input type = "hidden" name = "recomendGoodsExpsrAt" value = "<c:out value = "${noticeBbsInfo.recomendGoodsExpsrAt}"/>"/><%--추천상품노출여부--%>
<input type = "hidden" name = "prevNext" value = "<c:out value = "${noticeBbsInfo.prevNext}"/>"/><%--이전글다음글노출여부--%>
<input type = "hidden" name = "bbscttInnb" id = "noticeBbscttInnb" value = ""/><%--타겟 게시글 고유번호--%>
<input type = "hidden" name = "useAt" value = "Y"/><%--사용자 노출 조건--%>
<input type = "hidden" name = "expsrAt" value = "Y"/><%--사용자 노출 조건--%>
<input type = "hidden" name = "reqUrl" value = "csc"/><%--권한체크 요청 url--%>
<input type = "hidden" name = "authDv" value = "CM"/><%--상세 권한체크--%>
</form>
<ul class="customerMain__boardList">
<%--반복문 시작--%>
<c:forEach var = "noticeList" items="${resultMap.cscBbsctt.noticeList}">
<li class="dtlBtn">
<input type="hidden" class="bbscttInnb" value="<c:out value="${noticeList.bbscttInnb}"/>">
<a>
<c:out value="${noticeList.sj}" escapeXml="false"/>
<span class="customerMain__boardDate">
<c:out value="${noticeList.sumRegistDt}"/>
</span>
</a>
</li>
</c:forEach>
<%--반복문 종료--%>
</ul>
<button class="customerMain__more moveBbsBtn" value="notice" auth-dv="REDNG" req-url = "csc">전체보기</button><%--TODO::공지사항 목록 조회 이동--%>
</div>
<c:if test = "${sopmalInfo.cscTelnbOrdrPosblAt eq 'Y'}">
<div class="sub-box">
<div class="mainNotice__customerContact mainNotice__customerContact--moreInfo">
<i class="icon icon_notice03"></i>
<div class="mainNotice__customerContact__right">
<h4 class="notice__title customer-service">고객센터</h4>
<c:if test = "${not empty sopmalInfo.cscTelnb}">
<span class="notice__number"><c:out value="${sopmalInfo.cscTelnb}"/></span>
</c:if>
<p class="notice__paragraph">
<c:if test = "${not empty sopmalInfo.cscWkdayWorkTme}">
<span class="notice__text01"><c:out value = "${sopmalInfo.cscWkdayWorkTme}"/></span>
</c:if>
<c:if test = "${not empty sopmalInfo.cscLunchTme}">
<span class="notice__text02">(<c:out value = "${sopmalInfo.cscLunchTme}"/>)</span>
</c:if>
<c:if test = "${not empty sopmalInfo.cscRstde}">
<br><span class="notice__text03"><c:out value = "${sopmalInfo.cscRstde}"/></span>
</c:if>
</p>
<div class="notice__moreInfo">
<dl>
<dt>메일문의</dt>
<dd><c:out value = "${sopmalInfo.emailAtmcSndngDsptchAdres}"/></dd>
</dl>
<c:if test="${not empty resultMap.nbkkList.acntSetup}">
<c:set var="loopBreak" value="false"/>
<c:forEach var="acntSetup" items="${resultMap.nbkkList.acntSetup}">
<c:if test="${not loopBreak}">
<c:if test="${acntSetup.acntDtlDvCd eq '01'}">
<dl>
<dt>입금계좌</dt>
<dd><c:out value="${acntSetup.bankNm}"/> <c:out value="${acntSetup.acntnb}"/></dd>
</dl>
<dl>
<dt>예금주</dt>
<dd><c:out value="${acntSetup.dpstrNm}"/></dd>
</dl>
<c:set var="loopBreak" value="true"/>
</c:if>
</c:if>
</c:forEach>
</c:if>
</div>
</div>
</div>
</div>
</c:if>
<div class="fullBtnSection">
<button class="btn md gray2 full moveBbsBtn" value = "use_guidance" auth-dv="REDNG" req-url = "useGuidance">
사이트 이용안내
</button>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/comm/mobile/Footer.jsp"/>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,108 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : EvtListR.jsp
Description : 이벤트 목록
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-04-30 김혜인 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<c:set var = "bbscttVO" value = "${resultMap.bbsctt}"/>
<c:set var = "bbsInfo" value = "${resultMap.bbsInfo}"/>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<c:choose>
<c:when test="${ not empty resultMap.resultList.resultList }">
<c:forEach var="resultList" items="${ resultMap.resultList.resultList}">
<div class="progressEvents__item item">
<a class="dtlBtn" style="cursor:pointer">
<input type="hidden" class="passwordAt" value="<c:if test = "${resultList.secretBbscttAt eq 'Y'}">Y</c:if>">
<input type="hidden" class="regusr" value="<c:out value="${ resultList.regusr}"/>">
<input type="hidden" class="bbscttInnb" value="<c:out value="${ resultList.bbscttInnb }"/>">
<div class="progressEvents__image">
<img src="<c:out value ="${cdnurl}${resultList.reprsntImgSysFilNm}"/>"
onerror="this.src='/mobile/images/image_placeholder.png'" alt="해당 이미지에 대한 설명">
</div>
<div class="progressEvents__text">
<h4 class="progressEvents__title">
<c:out value ="${resultList.sj}" escapeXml="false"/>
<c:if test="${resultList.isfiles eq 1}"><%--첨부파일여부--%>
<i class="icon icon_image-badge"></i>
</c:if>
<c:if test="${resultList.newAt eq 'Y'}"><%--새로운게시글여부--%>
<i class="icon icon_new-post"></i>
</c:if>
<c:if test="${resultList.popularAt eq 'Y'}"><%--인기게시글여부--%>
<i class="icon icon_hot-post"></i>
</c:if>
<c:if test="${ resultList.secretBbscttAt eq 'Y' }"><%--비밀글여부--%>
<i class="icon icon_lock"></i>
</c:if>
<c:if test="${resultList.cmtCnt > 0}"><%--댓글개수--%>
(<fmt:formatNumber value="${resultList.cmtCnt}" pattern="#,###"/>)
</c:if>
</h4>
<div class="progressEvents__bottom">
<span class="progressEvents__dDay">
<c:choose>
<c:when test="${resultList.ntcePdSetupAt eq 'Y'}">
<c:choose>
<c:when test="${ resultList.dDay < 0}">종료</c:when>
<c:otherwise>D-<c:out value="${ resultList.dDay }"/></c:otherwise>
</c:choose>
</c:when>
<c:otherwise>
상시
</c:otherwise>
</c:choose>
</span>
<p class="progressEvents__date">
<c:choose>
<c:when test="${resultList.ntcePdSetupAt eq 'Y'}"><%--노출기간이 있는경우--%>
<c:out value="${ resultList.ntceBgnDe }"/>~<c:out value="${ resultList.ntceEndDe }"/>
</c:when>
<c:otherwise>
<c:out value="${ resultList.sumRegistDt }"/>~상시진행
</c:otherwise>
</c:choose>
</p>
</div>
<ul class="eventList__list">
<li><c:out value="${resultList.sumRegistDt}"/></li>
<li>조회 <fmt:formatNumber value="${resultList.inqireCnt}" pattern="#,###"/></li>
<c:if test = "${bbsInfo.bbscttEvlUseAt eq 'Y'}">
<li>
추천 <c:if test = "${bbsInfo.bbscttEvlRecomendStep eq '02'}">/비추천</c:if>
<fmt:formatNumber value="${resultList.recommendCnt}" pattern="#,###"/><c:if test = "${bbsInfo.bbscttEvlRecomendStep eq '02'}">/<fmt:formatNumber value="${resultList.nonrecommendCnt}" pattern="#,###"/></c:if>
</li>
</c:if>
<li><c:out value="${resultList.mngrNm}"/></li>
</ul>
</div>
</a>
</div>
</c:forEach>
</c:when>
<c:otherwise>
<div class="sub-box">
<div class="progressEvents">
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png" alt="상품 이미지">
</div>
<p class="noResult__text">진행중인 이벤트 내역이 없습니다.</p>
</div>
</div>
</div>
</c:otherwise>
</c:choose>
</html>

View File

@@ -0,0 +1,73 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : EvtListR.jsp
Description : 이벤트 목록
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-04-30 김혜인 최초 생성
--%>
<!DOCTYPE html>
<c:set var = "bbscttVO" value = "${resultMap.bbsctt}"/>
<html lang="ko">
<c:choose>
<c:when test="${ not empty resultMap.resultList.resultList }">
<div class="eventList">
<c:forEach var="resultList" items="${ resultMap.resultList.resultList}">
<a class="eventList__item dtlBtn item" style="cursor:pointer" >
<input type="hidden" class="passwordAt"
value="<c:if test = "${resultList.secretBbscttAt eq 'Y'}">Y</c:if>">
<input type="hidden" class="regusr" value="<c:out value="${ resultList.regusr}"/>">
<input type="hidden" class="bbscttInnb" value="<c:out value="${ resultList.bbscttInnb }"/>">
<!-- 이벤트 결과 썸네일 추가-->
<div class="progressEvents__image">
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<img src="<c:out value ="${cdnurl}${resultList.reprsntImgSysFilNm}"/>"
onerror="this.src='/mobile/images/image_placeholder.png'" alt="해당 이미지에 대한 설명">
</div>
<div class="eventList__top">
<span class="eventList__badge eventList__badge--closed">이벤트 종료</span>
<p class="eventList__date"><c:out value="${resultList.sumRegistDt}"/></p>
</div>
<p class="eventList__title">
<c:out value="${resultList.sj}" escapeXml="false"/>
<c:if test="${resultList.isfiles eq 1}"><%--첨부파일여부--%>
<i class="icon icon_image-badge"></i>
</c:if>
<c:if test="${resultList.newAt eq 'Y'}"><%--새로운게시글여부--%>
<i class="icon icon_new-post"></i>
</c:if>
<c:if test="${resultList.popularAt eq 'Y'}"><%--인기게시글여부--%>
<i class="icon icon_hot-post"></i>
</c:if>
<c:if test="${ resultList.secretBbscttAt eq 'Y' }"><%--비밀글여부--%>
<i class="icon icon_lock"></i>
</c:if>
<c:if test="${resultList.cmtCnt > 0}"><%--댓글개수--%>
(<c:out value="${resultList.cmtCnt}"/>)
</c:if>
</p>
</a>
</c:forEach>
</div>
</c:when>
<c:otherwise>
<div class="sub-box">
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png" alt="상품 이미지">
</div>
<p class="noResult__text">당첨자 발표 내역이 없습니다.</p>
</div>
</div>
</c:otherwise>
</c:choose>
</html>

View File

@@ -0,0 +1,55 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<div class="listTop content">
<span class="listTop__data">검색 <em><c:out value="${ resultMap.paginationInfo.totalRecordCount }"/></em> 건</span>
</div>
<div class="sub-box content">
<c:choose>
<c:when test="${not empty resultMap.resultList.resultList}">
<ul class="customerMain__boardList" id = "infinite-list">
<c:forEach var="resultList" items="${resultMap.resultList.resultList}">
<li>
<input type="hidden" name="bbscttInnb" value="${resultList.bbscttInnb}">
<details>
<summary>
<c:if test = "${not empty resultList.answCn}">
[<c:out value="${resultList.answCn}"/>]
</c:if>
<c:out value="${resultList.sj}" escapeXml="false"/>
<c:if test="${resultList.isfiles eq 1}"><%--첨부파일여부--%>
<i class="icon icon_image-badge"></i>
</c:if>
<c:if test="${resultList.newAt eq 'Y'}"><%--새로운게시글여부--%>
<i class="icon icon_new-post"></i>
</c:if>
<c:if test="${resultList.popularAt eq 'Y'}"><%--인기게시글여부--%>
<i class="icon icon_hot-post"></i>
</c:if>
<c:if test="${ resultList.secretBbscttAt eq 'Y' }"><%--비밀글여부--%>
<i class="icon icon_lock"></i>
</c:if>
<span class="customerMain__boardDate"><c:out value="${resultList.sumRegistDt}"/></span>
</summary>
<div class="customerMain__boardContent ck-content">
<c:out value="${resultList.cn}" escapeXml="false"/>
</div>
</details>
</li>
</c:forEach>
</ul>
</c:when>
<c:otherwise>
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png">
</div>
<p class="noResult__text"><spring:message code="common.nodata"/></p>
</div>
</c:otherwise>
</c:choose>
</div>

View File

@@ -0,0 +1,88 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : EvtListR.jsp
Description : 이벤트 목록
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-04-30 김혜인 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<c:set var = "bbscttVO" value = "${resultMap.bbsctt}"/>
<c:set var = "bbsInfo" value = "${resultMap.bbsInfo}"/>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<c:choose>
<c:when test="${ not empty resultMap.resultList.resultList }">
<c:set var="rnumAt" value="false"/>
<c:forEach var="resultList" items="${ resultMap.resultList.resultList}">
<div class="progressEvents__item item">
<a class="dtlBtn" style="cursor:pointer">
<input type="hidden" class="passwordAt" value="<c:if test = "${resultList.secretBbscttAt eq 'Y'}">Y</c:if>">
<input type="hidden" class="regusr" value="<c:out value="${ resultList.regusr}"/>">
<input type="hidden" class="bbscttInnb" value="<c:out value="${ resultList.bbscttInnb }"/>">
<div class="progressEvents__image">
<img src="<c:out value ="${cdnurl}${resultList.reprsntImgSysFilNm}"/>"
onerror="this.src='/mobile/images/image_placeholder.png'" alt="해당 이미지에 대한 설명">
</div>
<div class="progressEvents__text">
<h4 class="progressEvents__title">
<c:out value ="${resultList.sj}" escapeXml="false"/>
<c:if test="${resultList.isfiles eq 1}"><%--첨부파일여부--%>
<i class="icon icon_image-badge"></i>
</c:if>
<c:if test="${resultList.newAt eq 'Y'}"><%--새로운게시글여부--%>
<i class="icon icon_new-post"></i>
</c:if>
<c:if test="${resultList.popularAt eq 'Y'}"><%--인기게시글여부--%>
<i class="icon icon_hot-post"></i>
</c:if>
<c:if test="${ resultList.secretBbscttAt eq 'Y' }"><%--비밀글여부--%>
<i class="icon icon_lock"></i>
</c:if>
<c:if test="${resultList.cmtCnt > 0}"><%--댓글개수--%>
(<fmt:formatNumber value="${resultList.cmtCnt}" pattern="#,###"/>)
</c:if>
</h4>
<div class="progressEvents__bottom">
<p class="progressEvents__date">
</p>
</div>
</div>
<ul class="eventList__list">
<li><c:out value="${resultList.sumRegistDt}"/></li>
<li>조회 <fmt:formatNumber value="${resultList.inqireCnt}" pattern="#,###"/></li>
<c:if test = "${bbsInfo.bbscttEvlUseAt eq 'Y'}">
<li>
추천 <c:if test = "${bbsInfo.bbscttEvlRecomendStep eq '02'}">/비추천</c:if>
<fmt:formatNumber value="${resultList.recommendCnt}" pattern="#,###"/><c:if test = "${bbsInfo.bbscttEvlRecomendStep eq '02'}">/<fmt:formatNumber value="${resultList.nonrecommendCnt}" pattern="#,###"/></c:if>
</li>
</c:if>
<li><c:out value="${resultList.mngrNm}"/></li>
</ul>
</a>
</div>
</c:forEach>
</c:when>
<c:otherwise>
<div class="sub-box">
<div class="progressEvents">
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png" alt="상품 이미지">
</div>
<spring:message code="common.nodata"/>
</div>
</div>
</div>
</c:otherwise>
</c:choose>
</html>

View File

@@ -0,0 +1,84 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<div class="listTop content">
<span class="listTop__data">검색 <em><c:out value="${ resultMap.paginationInfo.totalRecordCount }"/></em> 건</span>
</div>
<div class="sub-box content">
<c:choose>
<c:when test="${not empty resultMap.resultList.resultList}">
<ul class="customerMain__boardList">
<script>
</script>
<c:forEach var="resultList" items="${resultMap.resultList.resultList}">
<c:choose>
<c:when test="${resultList.rnum eq 0}">
<li class="customerMain__boardFixed dtlBtn">
<input type="hidden" class="bbscttInnb" value="${resultList.bbscttInnb}">
<a>
<i class="icon icon_notice-speaker"></i>
<c:out value="${resultList.sj}" escapeXml="false"/>
<c:if test="${resultList.isfiles eq 1}"><%--첨부파일여부--%>
<i class="icon icon_image-badge"></i>
</c:if>
<c:if test="${resultList.newAt eq 'Y'}"><%--새로운게시글여부--%>
<i class="icon icon_new-post"></i>
</c:if>
<c:if test="${resultList.popularAt eq 'Y'}"><%--인기게시글여부--%>
<i class="icon icon_hot-post"></i>
</c:if>
<c:if test="${ resultList.secretBbscttAt eq 'Y' }"><%--비밀글여부--%>
<i class="icon icon_lock"></i>
</c:if>
<span class="customerMain__boardDate"><c:out value="${resultList.sumRegistDt}"/></span>
</a>
</li>
</c:when>
<c:otherwise>
<li class="dtlBtn">
<input type="hidden" class="bbscttInnb" value="${resultList.bbscttInnb}">
<a>
<c:out value="${resultList.sj}" escapeXml="false"/>
<c:if test="${fn:length(resultList.sj) > 35}"><%--글자수가 35 넘어가면 아이콘 줄바꿈 시작--%>
<span class="customerMain__boardDate">
</c:if>
<c:if test="${resultList.isfiles eq 1}"><%--첨부파일여부--%>
<i class="icon icon_image-badge"></i>
</c:if>
<c:if test="${resultList.newAt eq 'Y'}"><%--새로운게시글여부--%>
<i class="icon icon_new-post"></i>
</c:if>
<c:if test="${resultList.popularAt eq 'Y'}"><%--인기게시글여부--%>
<i class="icon icon_hot-post"></i>
</c:if>
<c:if test="${ resultList.secretBbscttAt eq 'Y' }"><%--비밀글여부--%>
<i class="icon icon_lock"></i>
</c:if>
<c:if test="${fn:length(resultList.sj) > 35}"><%--글자수가 35 넘어가면 아이콘 줄바꿈 종료--%>
</span>
</c:if>
<span class="customerMain__boardDate">
<c:out value="${resultList.sumRegistDt}"/>
</span>
</a>
</li>
</c:otherwise>
</c:choose>
</c:forEach>
</ul>
</c:when>
<c:otherwise>
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png">
</div>
<p class="noResult__text"><spring:message code="common.nodata"/></p>
</div>
</c:otherwise>
</c:choose>
</div>

View File

@@ -0,0 +1,109 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : RejectAuthR.jsp
Description : 게시글 사용 권한 없을 시 권한 거부 페이지
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-05-29 김혜인 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<c:if test = "${bbscttVO.reqDv ne 'goodsDtl'}">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="sub-box">
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
</body>
</c:if>
<div class="microModal microAlert" id="authPop" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<c:choose>
<c:when test = "${bbscttVO.authResult eq 'N'}">
<c:choose>
<c:when test = "${bbscttVO.authDv eq 'REDNG'}">
<c:out value="${bbscttVO.bbsNm}"/>을(를) 읽을 권한이 없습니다.
<br>고객센터에 문의해주세요.
</c:when>
<c:otherwise>
<c:out value="${bbscttVO.bbsNm}"/>을(를) 등록할 권한이 없습니다.
<br>고객센터에 문의해주세요.
</c:otherwise>
</c:choose>
</c:when>
<c:otherwise>
<c:choose>
<c:when test = "${bbscttVO.authDv eq 'REDNG'}">
<c:choose>
<c:when test = "${fn:length(bbscttVO.bbsNm) > 0}">
<c:out value="${bbscttVO.bbsNm}"/>은(는) 현재 사용하지 않는 게시판입니다.
</c:when>
<c:otherwise>
현재 사용하지 않는 게시판입니다.
</c:otherwise>
</c:choose>
</c:when>
<c:otherwise>
<c:out value="${bbscttVO.bbsNm}"/>등록 기능은 현재 사용하지 않습니다.
<br>고객센터에 문의해주세요.
</c:otherwise>
</c:choose>
</c:otherwise>
</c:choose>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn" id = "closeBtn"><spring:message code="button.ok"/></button>
</div>
</div>
</div>
</div>
<script>
//goodsDtl 상품 등록 팝업 아닐 시 모달 오픈
if($("#reqDv").val() !== 'goodsDtl'){
openModal("authPop");
}
//모달 닫으면서 뒤로가기
$("#closeBtn").on("click",function(){
closeModal("authPop");
});
</script>
<input type="hidden" value = "<c:out value="${bbscttVO.reqDv}"/>" id = 'reqDv'/>
</html>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,145 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : NoticeListR.jsp
Description :모바일 샘플.jsp
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-02 최남식 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function (){
/*헤더에 타이틀 set*/
fn_set_header_title("이용안내");
let listItem = $(".userGuideList__item");
listItem.on("click", function () {
let idx = $(this).index();
let itmInnb = $(this).attr("itm-innb");
fn_select_cn(idx, itmInnb);
});
// 고객센터 메인 이동
$(document).on('click', '.header__toBack__btn', function () {
location.href = '/sopmal/csc/selectCscMainForm';
});
});
//내용 조회
const fn_select_cn = (idx, itmInnb) => {
const bbsId = $("[name='bbsId']").val();
$.ajax({
type: "post",
data: {
itmInnb: itmInnb,
bbsId: bbsId
},
url: "/sopmal/csc/selectUseGuidanceInqire",
success: function (data) {
//내용 set
$(".userGuideList__item").eq(idx).find(".use-guide").empty();
fn_set_cn(idx, data);
}
});
}
// 내용 set
const fn_set_cn = (idx, data) => {
let cn = '';
data = JSON.parse(data.resBody.result);
if (data.resultList.length > 0) {
data.resultList.forEach(function (item) {
if (item !== null && item.cn !== null) {
cn += item.cn;
}
});
} else {
cn = `<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png">
</div>
<p class="noResult__text">이용안내가 없습니다</p>
</div>`;
}
$(".userGuideList__content").eq(idx).find(".use-guide").html(cn);
}
</script>
<body>
<%--게시판 정보--%>
<c:set var="bbsInfo" value="${resultMap.bbsInfo}"/>
<%--분류 목록--%>
<c:set var="itmList" value="${resultMap.itmList}"/>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="userGuide">
<div class="sub-box">
<form id="hiddenForm">
<input type="hidden" id = "bbsId" name="bbsId" value="<c:out value='${bbsInfo.bbsId}'/>">
<div class="userGuideList">
<c:choose>
<c:when test = "${not empty itmList}">
<c:forEach var="itm" items="${itmList}">
<details class="userGuideList__item" itm-innb ="<c:out value='${itm.itmInnb}'/>">
<summary class="userGuideList__top">
<div class="userGuideList__topInner">
<div class="userGuideList__info">
<p class="userGuideList__info__title"><c:out value = "${itm.itmCn}"/></p>
<span class="userGuideList__top__chevron"></span>
</div>
</div>
</summary>
<div class="userGuideList__content">
<h5 class="userGuideList__innerTitle"><c:out value = "${itm.itmCn}"/></h5>
<div class="use-guide"></div>
</div>
</details>
</c:forEach>
</c:when>
<c:otherwise>
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png">
</div>
<p class="noResult__text"><spring:message code="common.nodata"/></p>
</div>
</c:otherwise>
</c:choose>
</div>
</form>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/comm/mobile/Footer.jsp"/>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,433 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : RelateGoodsPopupR.jsp
Description : 장바구니 선택 팝업
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-23 유재현 최초 생성
--%>
<script defer>
fn_set_niceSelect_datePicker('.select-box')
/*************************************************************
장바구니 버튼 이벤트 (바텀시트)
**************************************************************/
// 일반옵션
// 라디오 버튼 클릭시, 상품 정보 배열에 추가 및 화면에 추가
$(".productOption .product-option__item").each(function () {
$(this).find("input[type=radio]").on("change", function () { // 라디오 버튼 클릭 시
if ($(this).prop('checked') == false) return; // 체크 해제시 리턴
const $title = $(this).closest(".product-option__item").find("label").text();
const $price = $(this).closest(".product-option__item").find(".product-option__price").text();
const $goodsOptnInnb = $(this).closest(".product-option__item").find('input[name="goodsOptnInnb"]').val()
const $goodsOptnTy = $(this).closest(".product-option__item").find('input[name="goodsOptnTy"]').val()
const $optnInfo = $(this).closest(".product-option__item").find('.product-option__monthly-payment').text();
const $priceNum = parseInt($price.replace(/,/g, ""));
//이미 추가된 상품인지 확인
var isItemAlreadyAdded = productArr.some(function (item) {
return item[4] === $goodsOptnInnb;
});
if (isItemAlreadyAdded){
fn_goods_duplicate_select_modal()
return;
}
productArr.push([$title, 1, $priceNum, $priceNum * 1, $goodsOptnInnb, $goodsOptnTy]); // 배열에 상품 정보 추가
$('#countContainer').append( // 화면에 상품 정보 추가
'<div class="product-count">' +
'<div class="product-count__amount-top">' +
'<span class="product-count__amount-title">' + $title + '</span>' +
'<button type="button" class="product-count__amount-delete"><span class="visually-hidden">삭제</span></button>' +
'</div>' +
'<div class="product-count__amount-bottom">' +
'<div class="product-count__amount-counter">' +
'<button type="button" class="product-count__amount-btn minus"><span class="visually-hidden">감소</span></button>' +
'<span class="product-count__amount-number">1</span>' +
'<button type="button" class="product-count__amount-btn plus"><span class="visually-hidden">추가</span></button>' +
'</div>' +
'<div class="product-count__amount-price-box">' +
'<span class="product-count__amount-monthly-price">'+$optnInfo+'</span>' +
'<span class="product-count__amount-price"><span class="comma product-count__priceNum">' + $price +
'</div>' +
'</div>' +
'</div>'
);
updateCounters(); // 화면에 상품 정보 업데이트
});
});
//재고옵션
$('#additionalSelect').on("change", "select", function () { // 셀렉트 선택 시
if ($('#additionalSelect').find('.option.selected.disabled').length > 0) return;
if ($('#additionalSelect').find('.option.selected').length == $('#additionalSelect').find('.nice-select').length) { // 모든 셀렉트가 선택되면
var $title = $('#addCartGoodsNm').val();
var $optInfo = $(this).closest('.select-box').find(".option.selected").attr("data-value").split('|');
var $priceNum = $optInfo[0];
var $goodsOptnInnb = $optInfo[1];
var $goodsOptnInfo = $optInfo[2];
var $goodsOptnTy = $optInfo[3];
var arr = [];
for (var i = 0; i < $('#additionalSelect').find('.nice-select').length; i++) {
arr.push($('#additionalSelect').find('.nice-select').eq(i).find('.option.selected').text());
}
//이미 추가된 상품인지 확인
var isItemAlreadyAdded = productArr.some(function (item) {
return item[4] === $goodsOptnInnb;
});
if (isItemAlreadyAdded){
fn_goods_duplicate_select_modal()
return;
}
productArr.push([$title, 1, $priceNum, $priceNum * 1, $goodsOptnInnb, $goodsOptnTy, arr]); // 배열에 상품 정보 추가
let additionalSelectText = '옵션 : ' + arr.join(' / ').replace(/\(\+.*?\)/g, '') // 추가정보 텍스트로 변환
$('#countContainer').append( // 화면에 상품 정보 추가
'<div class="product-count">' +
'<div class="product-count__amount-top">' +
'<span class="product-count__amount-title">' + $title + '</span>' +
'<div class="productDetailInfo__count__additionalSelect">' + additionalSelectText + '</div>' +
'<button type="button" class="product-count__amount-delete"><span class="visually-hidden">삭제</span></button>' +
'</div>' +
'<div class="product-count__amount-bottom">' +
'<div class="product-count__amount-counter">' +
'<button type="button" class="product-count__amount-btn minus"><span class="visually-hidden">감소</span></button>' +
'<span class="product-count__amount-number">1</span>' +
'<button type="button" class="product-count__amount-btn plus"><span class="visually-hidden">추가</span></button>' +
'</div>' +
'<div class="product-count__amount-price-box">' +
'<span class="product-count__amount-monthly-price">'+$goodsOptnInfo+'</span>' +
'<span class="product-count__amount-price"><span class="comma product-count__priceNum">' + $priceNum +
'</div>' +
'</div>' +
'</div>'
);
}
updateCounters(); // 화면에 상품 정보 업데이트
console.log(productArr); // 배열 정보확인
});
// 추가구성옵션
$("#moreItemsSelect").on("change",'select', function () {
const $moreItems = $('#moreItemsSelect').find(".select-box");
const $optInfoOptn3 = $(this).closest(".select-box").find(".option.selected").attr('data-value').split('|');
const $priceNumOptn3 = $optInfoOptn3[0];
const $goodsOptnInnbOptn3 = $optInfoOptn3[1];
const $goodsOptnInfoOptn3 = $optInfoOptn3[2];
const $goodsOptnTyOptn3 = $optInfoOptn3[3];
const $optnEssnlAtOptn3 = $(this).closest(".select-box").find('input[name="selectOptionItem__otpnEssntlAt__added"]').val();
var $title = $(this).closest(".select-box").find(".option.selected").text().replace('선택', ' ').replace(/\(\+.*?\)/g, '');
var $priceNum = $(this).find(".option.selected").attr("data-value");
//이미 추가된 상품인지 확인
var isItemAlreadyAdded = productArr.some(function (item) {
return item[4] === $goodsOptnInnbOptn3;
});
if (isItemAlreadyAdded){
fn_goods_duplicate_select_modal()
return;
}
productArr.push([$title, 1, $priceNumOptn3, $priceNumOptn3 * 1, $goodsOptnInnbOptn3, $goodsOptnTyOptn3, $optnEssnlAtOptn3]); // 배열에 상품 정보 추가
$('#countContainer').append( // 화면에 상품 정보 추가
'<div class="product-count">' +
'<div class="product-count__amount-top">' +
'<span class="product-count__amount-title">' + $title + '</span>' +
'<button type="button" class="product-count__amount-delete"><span class="visually-hidden">삭제</span></button>' +
'</div>' +
'<div class="product-count__amount-bottom">' +
'<div class="product-count__amount-counter">' +
'<button type="button" class="product-count__amount-btn minus"><span class="visually-hidden">감소</span></button>' +
'<span class="product-count__amount-number">1</span>' +
'<button type="button" class="product-count__amount-btn plus"><span class="visually-hidden">추가</span></button>' +
'</div>' +
'<div class="product-count__amount-price-box">' +
'<span class="product-count__amount-monthly-price">'+$goodsOptnInfoOptn3+'</span>' +
'<span class="product-count__amount-price"><span class="comma product-count__priceNum">' + $priceNum +
'</div>' +
'</div>' +
'</div>'
);
$(this).val('').niceSelect('update')
updateCounters(); // 화면에 상품 정보 업데이트
});
// 총 상품금액
var $totalPrice = $(".productDetailInfo__priceTotal__totalPriceNum");
// 수량 "-", "+" 버튼 클릭 시, 수량 증감 및 가격 변경 및 총 상품금액 변경
$("#countContainer").on("click", ".product-count__amount-btn", function () { // 수량 버튼 클릭 시
var $counter = $(this);
var $index = $counter.closest(".product-count").index(); // 해당 상품의 인덱스
console.log($index); // 인덱스 확인
if ($(this).hasClass("minus")) { // "-" 버튼 클릭 시
if (productArr[$index][1] <= 1) return;
productArr[$index][1]--; // 배열에서 해당 상품의 수량 감소
productArr[$index][3] = productArr[$index][1] * productArr[$index][2]; // 배열에서 해당 상품의 총 가격 변경
} else { // "+" 버튼 클릭 시
productArr[$index][1]++; // 배열에서 해당 상품의 수량 증가
productArr[$index][3] = productArr[$index][1] * productArr[$index][2]; // 배열에서 해당 상품의 총 가격 변경
}
updateCounters(); // 화면에 상품 정보 업데이트
})
//배열 내용을 바탕으로 각 아이템 텍스트 변경
function updateCounters() {
$(".productOption .product-count").each(function () {
var $counter = $(this);
var $index = $counter.index();
var $number = $counter.find(".product-count__amount-number");
var $price = $counter.find(".product-count__priceNum");
$number.text(productArr[$index][1]);
$price.text(addComma(productArr[$index][3]) + "원");
});
updateTotalPrice(); // 총 상품금액 업데이트
console.log(productArr); // 배열 정보확인
}
// 3자리마다 "," 추가
function addComma(num) {
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
// 총 상품금액 업데이트
function updateTotalPrice() {
var totalPrice = 0; // 총 상품금액
for (var i = 0; i < productArr.length; i++) {
totalPrice += productArr[i][3]; // 배열의 총 가격을 더함
}
$totalPrice.text(addComma(totalPrice)); // 총 상품금액 텍스트 변경
}
// x버튼 클릭 시 삭제
$("#countContainer").on("click", ".product-count__amount-delete", function () { // x 버튼 클릭 시
var $index = $(this).closest(".product-count").index();
productArr.splice($index, 1); // 배열에서 해당 상품 삭제
$(this).closest(".product-count").remove(); // 화면에서 해당 상품 삭제
updateCounters(); // 화면에 상품 정보 업데이트
//일반옵션이 하나일 경우 라디오 체크 해제(품절상품 제외) || 필수옵션 01이 상품 배열에 하나도 없을 경우
if($('.productOption .product-option .custom-radio:not(:has(span))').length ===1
|| productArr.filter(item => item[5] === '01').length === 0){
$("input[name='r-group01']").prop('checked', false)
}
});
// 마지막으로 생성된 상품에 각인 정보 추가 TODO :: 입력옵션
// $('#addTextBtn').on('click', function () {
// var $index = $(".productOption .product-count").length - 1;
// var $text = $('#addTextInput').val();
// console.log(productArr[$index]); // 인덱스 확인
// $(".productOption .product-count").eq($index).find(".product-count__amount-top").append('<div class="productDetailInfo__count__additionalSelect">각인문구 : ' + $text + '</div>');
//
// console.log(productArr); // 배열 정보확인
// });
</script>
<!-- 상품옵션 선택 -->
<div class="microModal microBottomSheet" id="product-option-sheet" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<button type="button" class="microModal__close" aria-label="창 닫기" onclick="closeModal('product-option-sheet')"></button>
</div>
<div class="microModal__content">
<c:if test="${addCartResultMap.goodsDtl.goodsSttusCd eq '01'}">
<input type="hidden" id="addCartGoodsInnb" value="${addCartResultMap.goodsDtl.goodsInnb}"/>
<input type="hidden" id="sopmalCd" value="${addCartResultMap.goodsDtl.sopmalCd}"/>
<input type="hidden" id="addCartGoodsNm" value="${addCartResultMap.goodsDtl.goodsNm}"/>
<input type="hidden" id="slepricDscntAmt" value="${addCartResultMap.goodsDtl.slepric }"/>
<c:forEach var="cardDv" items="${addCartResultMap.cartDvList}">
<input type="hidden" value="${cardDv.cd}" id="cartDv-${cardDv.cdNm}"/>
</c:forEach>
<c:choose>
<c:when test="${not empty addCartResultMap.optnList}">
<div class="productOption">
<c:if test="${not empty addCartResultMap.optnList.normalOptnList}">
<p class="productOption__title">옵션 선택</p>
<div class="product-option">
<c:forEach var="goodsOpt01" items="${addCartResultMap.optnList.normalOptnList}" varStatus="optList01">
<c:if test="${goodsOpt01.optnExpsrAt eq 'Y'}">
<c:if test="${goodsOpt01.invntrySldoutExpsrAt eq 'Y'}">
<div class="product-option__item">
<c:if test="${not empty goodsOpt01.optnVal1}">
<div class="custom-radio is-medium">
<input type="radio" id="r-${goodsOpt01.optnOrdr}" name="r-group01" <c:if test="${goodsOpt01.disableAt eq 'Y'}"> disabled</c:if> >
<label for="r-${goodsOpt01.optnOrdr}">${goodsOpt01.optnVal1}</label>
<input type="hidden" name="optnCd" value="${goodsOpt01.optnCd1}">
<input type="hidden" name="goodsOptnInnb" value="${goodsOpt01.goodsOptnInnb}"/>
<input type="hidden" name="goodsOptnTy" value="${goodsOpt01.optnTy}"/>
<input type="hidden" name="goodsSopmalCd" value="${goodsOpt01.sopmalCd}"/>
<c:if test="${goodsOpt01.disableAt eq 'Y'}"> <span>(품절)</span></c:if>
</div>
<div class="product-option__right">
<span class="product-option__price"><fmt:formatNumber value="${goodsOpt01.slepric}"/>원</span>
<span class="product-option__monthly-payment">${goodsOpt01.optnInfo}</span>
</div>
</c:if>
</div>
</c:if>
</c:if>
</c:forEach>
</div>
</c:if>
<c:if test="${not empty addCartResultMap.optnList.invntryOptnList}">
<p class="productOption__title">옵션 선택</p>
<div class="selectOptionItem" id="additionalSelect">
<c:if test="${not empty addCartResultMap.optnList.invntryOptnList[0].optnNm1}">
<div class="select-box">
<select class="full" title="해당 셀렉트에 대한 설명" id="selectAddCartInvntryOptn1" name="selectAddCartInvntryOptn">
<option value="" selected>선택</option>
<c:forEach var="goodsOpt02" items="${addCartResultMap.optnList.invntryOptnList}" varStatus="optList02">
<c:if test="${goodsOpt02.optnExpsrAt eq 'Y'}">
<c:if test="${goodsOpt02.invntrySldoutExpsrAt eq 'Y'}">
<c:if test="${goodsOpt02.optnVal1 ne addCartResultMap.optnList.invntryOptnList[optList02.index-1].optnVal1}">
<option value="${goodsOpt02.slepric}|${goodsOpt02.goodsOptnInnb}|${goodsOpt02.optnInfo}|${goodsOpt02.optnTy}" <c:if test="${goodsOpt02.disableAt eq 'Y'}"> disabled </c:if> >
<c:out value="${goodsOpt02.optnVal1}"/>
</option>
</c:if>
</c:if>
</c:if>
</c:forEach>
</select>
</div>
</c:if>
<c:if test="${not empty addCartResultMap.optnList.invntryOptnList[0].optnNm2}">
<div class="select-box">
<select class="full" title="해당 셀렉트에 대한 설명" id="selectAddCartInvntryOptn2" name="selectAddCartInvntryOptn">
<option value="" disabled selected>선택</option>
</select>
</div>
</c:if>
<c:if test="${not empty addCartResultMap.optnList.invntryOptnList[0].optnNm3}">
<div class="select-box">
<select class="full" title="해당 셀렉트에 대한 설명" id="selectAddCartInvntryOptn3" name="selectAddCartInvntryOptn">
<option value="" disabled selected>선택</option>
</select>
</div>
</c:if>
<c:if test="${not empty addCartResultMap.optnList.invntryOptnList[0].optnNm4}">
<div class="select-box">
<select class="full" title="해당 셀렉트에 대한 설명" id="selectAddCartInvntryOptn4" name="selectAddCartInvntryOptn">
<option value="" disabled selected>선택</option>
</select>
</div>
</c:if>
</div>
</c:if>
<c:if test="${not empty addCartResultMap.optnList.addedOptnList}">
<p class="productOption__title">추가구성</p>
<div class="selectOptionItem" id="moreItemsSelect">
<c:forEach var="goodsOpt03" items="${addCartResultMap.optnList.addedOptnList}" varStatus="optList03">
<c:if test="${not empty goodsOpt03.optnNm1}">
<c:if test="${addCartResultMap.optnList.addedOptnList[optList03.index-1].optnNm1 ne goodsOpt03.optnNm1}">
<div class="select-box">
<input type="hidden" name="selectOptionItem__otpnEssntlAt__added" <c:if test="${goodsOpt03.optnEssntlAt eq 'Y'}"> value="Y"</c:if>/>
<select class="full" title="해당 셀렉트에 대한 설명">
<option value="" disabled selected>${goodsOpt03.optnNm1} 선택</option>
<c:forEach var="goodsOptVal03" items="${addCartResultMap.optnList.addedOptnList}" varStatus="optVal03">
<c:if test="${goodsOptVal03.optnNm1 eq goodsOpt03.optnNm1}">
<c:if test="${goodsOptVal03.optnExpsrAt eq 'Y'}">
<c:if test="${goodsOptVal03.invntrySldoutExpsrAt eq 'Y'}">
<option value="${goodsOptVal03.slepric}|${goodsOptVal03.goodsOptnInnb}|${goodsOptVal03.optnInfo}|${goodsOptVal03.optnTy} " <c:if test="${goodsOptVal03.disableAt eq 'Y'}"> disabled</c:if> ><c:out value="${goodsOptVal03.optnVal1}"/> (+ <fmt:formatNumber value="${goodsOptVal03.slepric}"/>) <c:if test="${goodsOptVal03.disableAt eq 'Y'}"> <c:out value="(품절)"/> </c:if> </option>
</c:if>
</c:if>
</c:if>
</c:forEach>
</select>
</div>
</c:if>
</c:if>
</c:forEach>
</div>
</c:if>
<%-- <p class="productOption__title">상품정보 입력</p> TODO :: 입력옵션--%>
<%-- <div class="inputOptionItem">--%>
<%-- <input id="addTextInput" class="input-text full" type="text" title="해당 인풋에 대한 설명"--%>
<%-- placeholder="각인 문구를 입력해주세요" value="">--%>
<%-- <button type="button" id="addTextBtn" class="btn outline md">저장</button>--%>
<%-- </div>--%>
<div id="countContainer">
</div>
</div>
</c:when>
<c:otherwise>
<%--옵션없음--%>
</c:otherwise>
</c:choose>
</c:if>
<div class="productOption__bottom">
<div class="product-total__container">
<span class="product-total__text">총 상품금액</span>
<span class="product-total__price">
<span class="productDetailInfo__priceTotal__totalPriceNum">0</span><span
class="won">원</span></span>
</div>
<c:choose>
<c:when test="${addCartResultMap.goodsDtl.buttonRplcWordsUseAt ne 'Y'}">
<div class="product-btn-container">
<%-- <button type="button" class="gift-btn">선물</button> TODO :: 선물하기 추후--%>
<button type="button" class="btn theme outline addCart">장바구니</button>
<button type="button" class="btn theme purchsOrdr">구매하기</button>
</div>
</c:when>
<c:otherwise>
<div class="product-btn-container">
<a href="${addCartResultMap.goodsDtl.pcButtonRplcLink}"
<c:if test="${addCartResultMap.goodsDtl.buttonRplcLinkBrwsrDvCd eq '01'}"> target="_blank" </c:if> >
<button class="btn theme large"><c:out value="${addCartResultMap.goodsDtl.buttonRplcWords}"/></button>
</a>
</div>
</c:otherwise>
</c:choose>
<!-- 변경의 경우 -->
<!-- <div class="product-btn-container">
<button class="btn theme">변경하기</button>
</div> -->
</div>
</div>
</div>
</div>
</div>
</div>
<%--상품 중복담기 모달--%>
<div class="microModal microAlert" id="modal-error-confirm-add-cart-duplicate" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title" id="modal-error-content-add-cart-duplicate">
장바구니에 선택한 상품이 있습니다. <br/> 장바구니에 추가하시겠습니까?
</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button type="button" class="microModal__btn microModal__btn-primary" id="modal-error-confirm-yesButton" onclick="closeModal('modal-error-confirm-add-cart-duplicate');">예</button>
<button type="button" class="microModal__btn" id="modal-error-confirm-noButton" onclick="closeModal('modal-error-confirm-add-cart-duplicate');">아니오</button>
</div>
</div>
</div>
</div>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,214 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : GoodsListR.jsp
Description : 상품 목록 리스트
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-05 리브가
--%>
<div class="sub-page">
<div class="sub-box">
<!-- 상품 - 카테고리별 타입 (상품 2열) -->
<section class="subList__productList">
<div class="listTop">
<span class="listTop__data">총
<em><c:out value="${ resultMap.paginationInfo.totalRecordCount }" default="0"/> </em>건
</span>
<div class="subList__sort">
<button type="button" class="categoryTriggerBtn" role="button"
onclick="openModal('categorySelectPop01')">
인기순
</button>
</div>
</div>
<c:choose>
<c:when test="${ not empty resultMap.list }">
<div class="product-list-type-2cols">
<div class="product-list-type-2cols__list">
<c:forEach var="list" items="${resultMap.list}" varStatus="status">
<div class="product-unit">
<div class="product-unit-image">
<c:if test="${(list.evtTmeExpsrAt eq 'Y' and list.remainTime ne 'N')
or (list.rltmQyBannerExpsrAt eq 'Y' and list.remainQy > 0) }">
<div class="time-sale__top">
<c:if test="${list.evtTmeExpsrAt eq 'Y' and list.remainTime ne 'N'}">
<span class="time" id="remainTime${status.index}" name="remainTime"><c:out
value="${list.remainTime}"/> </span>
<input type="hidden" id="evtTmeExpsrAt${status.index}" name="evtTmeExpsrAt"
value="${list.evtTmeExpsrAt}">
</c:if>
<c:if test="${list.rltmQyBannerExpsrAt eq 'Y' and list.remainQy > 0 }">
<span class="left">남은수량 <fmt:formatNumber value="${list.remainQy}"/> 개</span>
</c:if>
</div>
</c:if>
<c:choose>
<c:when test="${list.goodsSttusCd eq '02'}">
<div class="sold-out">
<span>SOLD OUT</span>
</div>
</c:when>
<c:when test="${list.goodsSttusCd eq '03'}">
<div class="sold-out">
<span>${list.goodsSttusNm}</span>
</div>
</c:when>
<c:otherwise>
<%--정상일 경우 처리없음--%>
</c:otherwise>
</c:choose>
<form id="detailForm">
<a class="product-detail" href="javascript:void(0);"
onclick="fn_move_goods_dtl('<c:out value="${list.goodsInnb}"/>'); ">
<spring:eval
expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')"
var="cdnurl"/>
<img src="<c:out value="${cdnurl}${list.goodsImgCours}"/>"
onerror="this.src='/mobile/images/image_placeholder.png'"
alt="${list.goodsNm}" loading="lazy"/>
</a>
</form>
<c:if test="${not empty list.pricRplcWordsUseAt and list.pricRplcWordsUseAt ne 'Y'}">
<button type="button" class="product-unit-addToCart" onclick="fn_mbl_open_modal
('addGoodsCartDiv', 'product-option-sheet', '/sopmal/goods/selectAddCartGoodsPopup',
JSON.stringify({'goodsInnb' : `${list.goodsInnb}`}))">
<i class="icon icon_product-unit-addToCart"></i>
<span class="visually-hidden">장바구니에 담기</span>
</button>
</c:if>
</div>
<div class="product-unit-info d-flex flex-column" style="flex-direction:column">
<c:if test="${not empty list.iconCdNmList}">
<c:if test="${list.iconExpsrAt eq 'Y'}">
<div class="product-badge-container col order-${list.iconExpsrOrdr-1}" style="order: ${list.iconExpsrOrdr-1} ">
<c:forEach items="${fn:split(list.iconCdNmList, ',')}" var="iconCdNm" varStatus="iconStatus">
<c:choose>
<c:when test="${fn:contains(iconCdNm, '-')}">
<span class="product-badge ${fn:toLowerCase(iconCdNm)}">${fn:replace(fn:toUpperCase(iconCdNm), '-', ' ')}</span>
</c:when>
<c:otherwise>
<span class="product-badge ${fn:toLowerCase(iconCdNm)}">${fn:toUpperCase(iconCdNm)}</span>
</c:otherwise>
</c:choose>
</c:forEach>
</div>
</c:if>
</c:if>
<%-- <div class="product-unit-info__inner">--%>
<c:if test="${list.goodsNmExpsrAt eq 'Y'}">
<div class="product-unit-title col order-${list.goodsNmExpsrOrdr-1}" style="order:${list.goodsNmExpsrOrdr-1} ">
<a href="javascript:void(0);" onclick="fn_move_goods_dtl('<c:out value="${list.goodsInnb}"/>'); "><c:out value="${list.goodsNm}"/></a>
</div>
</c:if>
<c:if test="${list.pricExpsrAt eq 'Y'}">
<c:choose>
<c:when test="${not empty list.pricRplcWordsUseAt and list.pricRplcWordsUseAt ne 'Y'}">
<div class="product-unit-price col order-${list.pricExpsrOrdr-1}" style="order: ${list.pricExpsrOrdr-1}">
<div class="product-unit-price__price">
<span class="product-unit-price__original"><fmt:formatNumber
value="${list.cnsmrpric}"/> 원</span>
<span class="product-unit-price__current"><fmt:formatNumber
value="${list.slepric}"/> 원</span>
</div>
<div class="product-unit-price__sale">
<span class="percent"> <c:out value="${list.slePercent}"/> %</span>
</div>
</div>
</c:when>
<c:otherwise>
<div class="productDetailInfo__price">
<a href="${list.mblPricRplcLink}" <c:if test="${list.pricRplcLinkBrwsrDvCd eq'01'}"> target="_blank" </c:if> >
<span class="" style="font-size: 1rem;"> <c:out value="${list.pricRplcWords}"/></span>
</a>
</div>
</c:otherwise>
</c:choose>
</c:if>
<c:if test="${list.reprsntDcExpsrAt eq 'Y'}">
<div class="product-unit-price__monthly-payment col order-${list.reprsntDcExpsrOrdr-1}" style="order: ${list.reprsntDcExpsrOrdr-1}"><c:out value="${list.reprsntDc}"/></div>
</c:if>
<%-- </div>--%>
<c:if test="${list.rvwEvlScreExpsrAt eq 'Y'}">
<div class="product-unit-rating col order-${list.rvwEvlScreExpsrOrdr-1}" style="order: ${list.rvwEvlScreExpsrOrdr-1}">
<i class="icon icon_rating-star"></i>
<span class="product-unit-rating__score"><c:out value="${list.avgEvlScore}" default="0.0"/> </span>
<span class="product-unit-rating__count">(<fmt:formatNumber value="${list.cntEvlScor}"/>) </span>
</div>
</c:if>
<c:if test="${list.dlvyExpsrAt eq 'Y'}">
<div class="product-unit-price__monthly-payment col order-${list.dlvyExpsrOrdr-1}" style="order: ${list.dlvyExpsrOrdr-1}"><c:out value="${list.dlvyGroupNm}"/></div>
</c:if>
</div>
</div>
</c:forEach>
<div id="infinityScrollGoodsList"></div>
</div>
</div>
</c:when>
<c:otherwise>
<div class="product-list-type-2cols">
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png" alt="상품 이미지">
</div>
<p class="noResult__text">해당 상품이 없습니다.</p>
</div>
</div>
</c:otherwise>
</c:choose>
</section>
</div>
</div>
<!-- 240709 정렬 바텀시트 -->
<div class="microModal microBottomSheet" id="categorySelectPop01" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<button class="microModal__close" aria-label="창 닫기" data-micromodal-close></button>
</div>
<div class="microModal__content">
<div class="modalSelect">
<div class="modalSelect__list">
<label class="modalSelect__item">
<input type="radio" name="sortDv" value="avgEvlScore" >
<span>인기순</span>
</label>
<label class="modalSelect__item">
<input type="radio" name="sortDv" value="cntEvlScor" >
<span>리뷰 많은순</span>
</label>
<label class="modalSelect__item">
<input type="radio" name="sortDv" value="slepricAsc">
<span>낮은 가격순</span>
</label>
<label class="modalSelect__item">
<input type="radio" name="sortDv" value="slepricDesc">
<span>높은 가격순</span>
</label>
<label class="modalSelect__item">
<input type="radio" name="sortDv" value="goodsInnbDesc">
<span>신상품순</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<%--장바구니 버튼 선택 모달--%>
<div id="addGoodsCartDiv"></div>
<%--장바구니 담기 후 모달--%>
<div id="addCartDiv"></div>
<%--상품 중복선택 모달--%>
<div id="goodsDuplicateDiv"></div>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,210 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : GoodsSrchR.jsp
Description : 상품 검색 리스트
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-05 리브가
--%>
<div class="sub-page">
<div class="sub-box">
<!-- 상품 - 카테고리별 타입 (상품 2열) -->
<section class="subList__productList">
<div class="listTop">
<span class="listTop__data">총
<em><c:out value="${ resultMap.paginationInfo.totalRecordCount }" default="0"/> </em>건
</span>
<div class="subList__sort">
<button type="button" class="categoryTriggerBtn" role="button"
onclick="openModal('categorySelectPop01')">
인기순
</button>
</div>
</div>
<c:choose>
<c:when test="${ not empty resultMap.list }">
<div class="product-list-type-2cols">
<div class="product-list-type-2cols__list">
<c:forEach var="list" items="${resultMap.list}" varStatus="status">
<div class="product-unit">
<div class="product-unit-image">
<c:if test="${(list.evtTmeExpsrAt eq 'Y' and list.remainTime ne 'N')
or (list.rltmQyBannerExpsrAt eq 'Y' and list.remainQy > 0) }">
<div class="time-sale__top">
<c:if test="${list.evtTmeExpsrAt eq 'Y' and list.remainTime ne 'N'}">
<span class="time" id="remainTime${status.index}" name="remainTime"><c:out
value="${list.remainTime}"/> </span>
<input type="hidden" id="evtTmeExpsrAt${status.index}" name="evtTmeExpsrAt"
value="${list.evtTmeExpsrAt}">
</c:if>
<c:if test="${list.rltmQyBannerExpsrAt eq 'Y' and list.remainQy > 0 }">
<span class="left">남은수량 <fmt:formatNumber value="${list.remainQy}"/> 개</span>
</c:if>
</div>
</c:if>
<c:choose>
<c:when test="${list.goodsSttusCd eq '02'}">
<div class="sold-out">
<span>SOLD OUT</span>
</div>
</c:when>
<c:when test="${list.goodsSttusCd eq '03'}">
<div class="sold-out">
<span>${list.goodsSttusNm}</span>
</div>
</c:when>
</c:choose>
<form id="detailForm">
<a class="product-detail" href="javascript:void(0);"
onclick="fn_move_goods_dtl('<c:out value="${list.goodsInnb}"/>'); ">
<spring:eval
expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')"
var="cdnurl"/>
<img src="<c:out value="${cdnurl}${list.goodsImgCours}"/>"
onerror="this.src='/mobile/images/image_placeholder.png'"
alt="${list.goodsNm}" loading="lazy"/>
</a>
</form>
<c:if test="${not empty list.pricRplcWordsUseAt and list.pricRplcWordsUseAt ne 'Y'}">
<button type="button" class="product-unit-addToCart" onclick="fn_mbl_open_modal
('addGoodsCartDiv', 'product-option-sheet', '/sopmal/goods/selectAddCartGoodsPopup',
JSON.stringify({'goodsInnb' : `${list.goodsInnb}`}))">
<i class="icon icon_product-unit-addToCart"></i>
<span class="visually-hidden">장바구니에 담기</span>
</button>
</c:if>
</div>
<div class="product-unit-info d-flex flex-column" style="flex-direction:column">
<c:if test="${not empty list.iconCdNmList}">
<c:if test="${list.iconExpsrAt eq 'Y'}">
<div class="product-badge-container col order-${list.iconExpsrOrdr-1}" style="order: ${list.iconExpsrOrdr-1} ">
<c:forEach items="${fn:split(list.iconCdNmList, ',')}" var="iconCdNm" varStatus="iconStatus">
<c:choose>
<c:when test="${fn:contains(iconCdNm, '-')}">
<span class="product-badge ${fn:toLowerCase(iconCdNm)}">${fn:replace(fn:toUpperCase(iconCdNm), '-', ' ')}</span>
</c:when>
<c:otherwise>
<span class="product-badge ${fn:toLowerCase(iconCdNm)}">${fn:toUpperCase(iconCdNm)}</span>
</c:otherwise>
</c:choose>
</c:forEach>
</div>
</c:if>
</c:if>
<%-- <div class="product-unit-info__inner">--%>
<c:if test="${list.goodsNmExpsrAt eq 'Y'}">
<div class="product-unit-title col order-${list.goodsNmExpsrOrdr-1}" style="order:${list.goodsNmExpsrOrdr-1} ">
<a href="javascript:void(0);"><c:out value="${list.goodsNm}"/></a>
</div>
</c:if>
<c:if test="${list.pricExpsrAt eq 'Y'}">
<c:choose>
<c:when test="${not empty list.pricRplcWordsUseAt and list.pricRplcWordsUseAt ne 'Y'}">
<div class="product-unit-price col order-${list.pricExpsrOrdr-1}" style="order: ${list.pricExpsrOrdr-1}">
<div class="product-unit-price__price">
<span class="product-unit-price__original"><fmt:formatNumber
value="${list.cnsmrpric}"/> 원</span>
<span class="product-unit-price__current"><fmt:formatNumber
value="${list.slepric}"/> 원</span>
</div>
<div class="product-unit-price__sale">
<span class="percent"> <c:out value="${list.slePercent}"/> %</span>
</div>
</div>
</c:when>
<c:otherwise>
<div class="productDetailInfo__price">
<a href="${list.mblPricRplcLink}" <c:if test="${list.pricRplcLinkBrwsrDvCd eq'01'}"> target="_blank" </c:if> >
<span class="" style="font-size: 1rem;"> <c:out value="${list.pricRplcWords}"/></span>
</a>
</div>
</c:otherwise>
</c:choose>
</c:if>
<c:if test="${list.reprsntDcExpsrAt eq 'Y'}">
<div class="product-unit-price__monthly-payment col order-${list.reprsntDcExpsrOrdr-1}" style="order: ${list.reprsntDcExpsrOrdr-1}"><c:out value="${list.reprsntDc}"/></div>
</c:if>
<%-- </div>--%>
<c:if test="${list.rvwEvlScreExpsrAt eq 'Y'}">
<div class="product-unit-rating col order-${list.rvwEvlScreExpsrOrdr-1}" style="order: ${list.rvwEvlScreExpsrOrdr-1}">
<i class="icon icon_rating-star"></i>
<span class="product-unit-rating__score"><c:out value="${list.avgEvlScore}" default="0.0"/> </span>
<span class="product-unit-rating__count">(<fmt:formatNumber value="${list.cntEvlScor}"/>) </span>
</div>
</c:if>
<c:if test="${list.dlvyExpsrAt eq 'Y'}">
<div class="product-unit-price__monthly-payment col order-${list.dlvyExpsrOrdr-1}" style="order: ${list.dlvyExpsrOrdr-1}"><c:out value="${list.dlvyGroupNm}"/></div>
</c:if>
</div>
</div>
</c:forEach>
<div id="infinityScrollGoodsList"></div>
</div>
</div>
</c:when>
<c:otherwise>
<div class="product-list-type-2cols">
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png" alt="상품 이미지">
</div>
<p class="noResult__text">해당 상품이 없습니다.</p>
</div>
</div>
</c:otherwise>
</c:choose>
</section>
</div>
</div>
<!-- 240709 정렬 바텀시트 -->
<div class="microModal microBottomSheet" id="categorySelectPop01" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<button class="microModal__close" aria-label="창 닫기" data-micromodal-close></button>
</div>
<div class="microModal__content">
<div class="modalSelect">
<div class="modalSelect__list">
<label class="modalSelect__item">
<input type="radio" name="sortDv" value="avgEvlScore" >
<span>인기순</span>
</label>
<label class="modalSelect__item">
<input type="radio" name="sortDv" value="cntEvlScor" >
<span>리뷰 많은순</span>
</label>
<label class="modalSelect__item">
<input type="radio" name="sortDv" value="slepricAsc">
<span>낮은 가격순</span>
</label>
<label class="modalSelect__item">
<input type="radio" name="sortDv" value="slepricDesc">
<span>높은 가격순</span>
</label>
<label class="modalSelect__item">
<input type="radio" name="sortDv" value="goodsInnbDesc">
<span>신상품순</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<%--장바구니 버튼 선택 모달--%>
<div id="addGoodsCartDiv"></div>
<%--장바구니 담기 후 모달--%>
<div id="addCartDiv"></div>
<%--상품 중복선택 모달--%>
<div id="goodsDuplicateDiv"></div>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,131 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : QnaListR.jsp
Description : 상품qna 목록
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-05 김혜인
--%>
<!DOCTYPE html>
<html lang="ko">
<script>
$(document).ready(function(){
let goodsQnaCnt = '<c:out value="${resultMap.paginationInfo.totalRecordCount}"/>';
goodsQnaCnt = fn_format_comma(goodsQnaCnt);
$("#goodsQnaCnt").text(goodsQnaCnt);
});
</script>
<%--이미지 소스 url--%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<div class="productQnaList">
<div class="sub-box">
<div class="productQnaList__controls">
<button class="categoryTriggerBtn" id="srchitmInnbBtn">
전체
</button>
<button class="btn theme" id = "registBtn">문의하기</button>
</div>
<c:choose>
<c:when test="${ not empty resultMap.resultList.qnaList }">
<c:forEach var="resultList" items="${ resultMap.resultList.qnaList}">
<details class="productQnaList__item qnaList" bbsctt="<c:out value="${ resultList.bbscttInnb }"/>">
<summary class="productQnaList__top">
<div class="productQnaList__image">
<img src="<c:out value="${cdnurl}${ resultList.img }"/>" onerror='this.src = "/mobile/images/image_placeholder.png"' alt="상품 이미지">
</div>
<div class="productQnaList__right ">
<div class="productQnaList__info ">
<p class="productQnaList__info__question ">
<span class="category"><c:if test="${not empty resultList.answCn}">
[<c:out value="${resultList.answCn}"/>]</c:if></span>
<c:out value="${ resultList.regusrNm}"/>님의 소중한 질문입니다.
<c:if test="${resultList.isfiles eq 1}"><%--첨부파일여부--%>
<i class="icon icon_image-badge"></i>
</c:if>
<c:if test="${resultList.newAt eq 'Y'}"><%--새로운게시글여부--%>
<i class="icon icon_new-post"></i>
</c:if>
<c:if test="${ resultList.secretBbscttAt eq 'Y' }"><%--비밀글여부--%>
<i class="icon icon_lock"></i>
</c:if>
</p>
<p class="productQnaList__info__status ">
<c:choose>
<c:when test="${not empty resultList.answBbscttInnb}">
<span>답변완료</span>
</c:when>
<c:otherwise>
<span>답변대기</span>
</c:otherwise>
</c:choose>
<span class="productQnaList__info__date"><c:out value="${resultList.registDt}"/></span>
</p>
</div>
</div>
</summary>
<div class="productQnaList__answer">
</div>
</details>
</c:forEach>
<div class="fullBtnSection" id = "qnaMoreDiv">
<c:if test = "${resultMap.bbscttVO.pageUnit eq fn:length(resultMap.resultList.qnaList)}">
<button class="btn md outline full" id = "qnaMore">
<span class="fullBtnSection__more">
더보기
</span>
</button>
</c:if>
</div>
<input type="hidden" value = "<c:out value="${resultMap.bbscttVO.pageIndex}"/>" id = "qnaPageIndex">
</c:when>
<c:otherwise>
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png" alt="상품 이미지">
</div>
<p class="noResult__text">등록된 상품 문의가 없습니다.</p>
</div>
</c:otherwise>
</c:choose>
</div>
</div>
<%-- 상품qna 분류 --%>
<div class="microModal microBottomSheet" id="qnaItmPop" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<button class="microModal__close" aria-label="창 닫기" data-micromodal-close></button>
</div>
<div class="microModal__content">
<div class="modalSelect">
<div class="modalSelect__list">
<input type="hidden" value="" id="srchitmInnbVal">
<label class="modalSelect__item">
<input type="radio" name="srchitmInnb" value="" class="srchitmInnb">
<span>전체보기</span>
</label>
<c:forEach var="itm" items="${resultMap.itmList}">
<label class="modalSelect__item">
<input type="radio" name="srchitmInnb" value="<c:out value = '${itm.itmInnb}'/>" class="srchitmInnb">
<span><c:out value='${itm.itmCn}'/></span>
</label>
</c:forEach>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</html>

View File

@@ -0,0 +1,440 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : RelateGoodsPopupR.jsp
Description : 함께하면 좋은 상품(관련 상품) 팝업
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-23 유재현 최초 생성
--%>
<script defer>
/*************************************************************
함께하면 좋은상품 이벤트 (모달)
**************************************************************/
fn_set_niceSelect_datePicker('.select-box')
//일반옵션
// // 라디오 버튼 클릭시, 상품 정보 배열에 추가 및 화면에 추가
$("#relate-product-option-sheet .product-option__item").each(function () {
$(this).find("input[type=radio]").on("change", function () { // 라디오 버튼 클릭 시
if ($(this).prop('checked') == false) return; // 체크 해제시 리턴
const $title = $(this).closest(".product-option__item").find("label").text();
const $price = $(this).closest(".product-option__item").find(".product-option__price").text();
const $goodsOptnInnb = $(this).closest(".product-option__item").find('input[name="goodsOptnInnb"]').val()
const $goodsOptnTy = $(this).closest(".product-option__item").find('input[name="goodsOptnTy"]').val()
const $optnInfo = $(this).closest(".product-option__item").find('.product-option__monthly-payment').text();
const $priceNum = parseInt($price.replace(/,/g, ""));
//이미 추가된 상품인지 확인
var isItemAlreadyAdded = cartProductArr.some(function (item) {
return item[4] === $goodsOptnInnb;
});
if (isItemAlreadyAdded){
fn_goods_duplicate_select_modal()
return;
}
const $relateGoodsInnb = $(this).closest(".product-option__item").find('input[name="relateGoodsInnb"]').val()
cartProductArr.push([$title, 1, $priceNum, $priceNum * 1, $goodsOptnInnb, $goodsOptnTy, $relateGoodsInnb]); // 배열에 상품 정보 추가
$('#cartCountContainer').append( // 화면에 상품 정보 추가
'<div class="product-count">' +
'<div class="product-count__amount-top">' +
'<span class="product-count__amount-title">' + $title + '</span>' +
'<button class="product-count__amount-delete"><span class="visually-hidden">삭제</span></button>' +
'</div>' +
'<div class="product-count__amount-bottom">' +
'<div class="product-count__amount-counter">' +
'<button class="product-count__amount-btn minus"><span class="visually-hidden">감소</span></button>' +
'<span class="product-count__amount-number">1</span>' +
'<button class="product-count__amount-btn plus"><span class="visually-hidden">추가</span></button>' +
'</div>' +
'<div class="product-count__amount-price-box">' +
'<span class="product-count__amount-monthly-price">'+$optnInfo+'</span>' +
'<span class="product-count__amount-price"><span class="comma product-count__amount-priceNum">' + $price +
'</div>' +
'</div>' +
'</div>'
);
updateCartCounters(); // 화면에 상품 정보 업데이트
});
});
// 총 상품금액
var $cartTotalPrice = $(".product-total__price__totalPriceNum");
// 수량 "-", "+" 버튼 클릭 시, 수량 증감 및 가격 변경 및 총 상품금액 변경
$("#cartCountContainer").on("click", ".product-count__amount-btn", function () { // 수량 버튼 클릭 시
var $counter = $(this);
var $index = $counter.closest(".product-count").index(); // 해당 상품의 인덱스
if ($(this).hasClass("minus")) { // "-" 버튼 클릭 시
if (cartProductArr[$index][1] <= 1) return;
cartProductArr[$index][1]--; // 배열에서 해당 상품의 수량 감소
cartProductArr[$index][3] = cartProductArr[$index][1] * cartProductArr[$index][2]; // 배열에서 해당 상품의 총 가격 변경
} else { // "+" 버튼 클릭 시
cartProductArr[$index][1]++; // 배열에서 해당 상품의 수량 증가
cartProductArr[$index][3] = cartProductArr[$index][1] * cartProductArr[$index][2]; // 배열에서 해당 상품의 총 가격 변경
}
updateCartCounters(); // 화면에 상품 정보 업데이트
})
//
//배열 내용을 바탕으로 각 아이템 텍스트 변경
function updateCartCounters() {
$("#cartCountContainer .product-count").each(function () {
var $counter = $(this);
var $index = $counter.index();
var $number = $counter.find(".product-count__amount-number");
var $price = $counter.find(".product-count__amount-priceNum");
$number.text(cartProductArr[$index][1]);
$price.text(addComma(cartProductArr[$index][3]) + "원");
});
updateCartTotalPrice(); // 총 상품금액 업데이트
console.log(cartProductArr); // 배열 정보확인
}
// 3자리마다 "," 추가
function addComma(num) {
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
// 총 상품금액 업데이트
function updateCartTotalPrice() {
var totalPrice = 0; // 총 상품금액
for (var i = 0; i < cartProductArr.length; i++) {
totalPrice += cartProductArr[i][3]; // 배열의 총 가격을 더함
}
$cartTotalPrice.text(addComma(totalPrice)); // 총 상품금액 텍스트 변경
}
// x버튼 클릭 시 삭제
$("#cartCountContainer").on("click", ".product-count__amount-delete", function () { // x 버튼 클릭 시
var $index = $(this).closest(".product-count").index();
cartProductArr.splice($index, 1); // 배열에서 해당 상품 삭제
$(this).closest(".product-count").remove(); // 화면에서 해당 상품 삭제
updateCartCounters(); // 화면에 상품 정보 업데이트
//일반옵션이 하나일 경우 라디오 체크 해제(품절상품 제외) || 필수옵션 01이 상품 배열에 하나도 없을 경우
if($('#relate-product-option-sheet .product-option .custom-radio:not(:has(span))').length ===1
|| productArr.filter(item => item[5] === '01'&& $('#goodsInnb').val() ===item[6]).length === 0){
$("input[name='r-group01']").prop('checked', false)
}
});
//TODO :: 입력옵션
// // // 마지막으로 생성된 상품에 각인 정보 추가
// // $('#cartAddTextBtn').on('click', function () {
// // var $index = $(".modal .productDetailInfo__count").length - 1;
// // var $text = $('#cartAddTextInput').val();
// // console.log(cartProductArr[$index]); // 인덱스 확인
// // $(".modal .productDetailInfo__count").eq($index).find(".productDetailInfo__count__amountTop").append('<div class="productDetailInfo__count__additionalSelect">각인문구 : ' + $text + '</div>');
// //
// // console.log(cartProductArr); // 배열 정보확인
// // });
//
//재고옵션
$('#relateAdditionalSelect').on("change", "select", function () { // 셀렉트 선택 시
if ($('#relateAdditionalSelect').find('.option.selected.disabled').length > 0) return;
if ($('#relateAdditionalSelect').find('.option.selected').length == $('#relateAdditionalSelect').find('.nice-select').length) { // 모든 셀렉트가 선택되면
var $title =$(this).closest("#relateAdditionalSelect").find('input[name="relateGoodsNm"]').val()
var $optInfo = $(this).siblings('.nice-select').find(".option.selected").attr("data-value").split('|');
var $priceNum = $optInfo[0];
var $goodsOptnInnb = $optInfo[1];
var $goodsOptnInfo = $optInfo[2];
var $goodsOptnTy = $optInfo[3];
var arr = [];
for (var i = 0; i < $('#relateAdditionalSelect').find('.nice-select').length; i++) {
arr.push($('#relateAdditionalSelect').find('.nice-select').eq(i).find('.option.selected').text());
}
//이미 추가된 상품인지 확인
var isItemAlreadyAdded = cartProductArr.some(function (item) {
return item[4] === $goodsOptnInnb;
});
if (isItemAlreadyAdded) {
fn_goods_duplicate_select_modal()
return;
}
const $relateGoodsInnb = $(this).closest("#relateAdditionalSelect").find('input[name="relateGoodsInnb"]').val()
cartProductArr.push([$title, 1, $priceNum, $priceNum * 1, $goodsOptnInnb, $goodsOptnTy, $relateGoodsInnb, arr]); // 배열에 상품 정보 추가
let cartAdditionalSelectText = '옵션 : ' + arr.join(' / ').replace(/\(\+.*?\)/g, ''); // 추가정보 텍스트로 변환
$('#cartCountContainer').append( // 화면에 상품 정보 추가
'<div class="product-count">' +
'<div class="product-count__amount-top">' +
'<span class="product-count__amount-title">' + $title + '</span>' +
'<div class="productDetailInfo__count__additionalSelect">' + cartAdditionalSelectText + '</div>' +
'<button class="product-count__amount-delete"><span class="visually-hidden">삭제</span></button>' +
'</div>' +
'<div class="product-count__amount-bottom">' +
'<div class="product-count__amount-counter">' +
'<button class="product-count__amount-btn minus"><span class="visually-hidden">감소</span></button>' +
'<span class="product-count__amount-number">1</span>' +
'<button class="product-count__amount-btn plus"><span class="visually-hidden">추가</span></button>' +
'</div>' +
'<div class="product-count__amount-price-box">' +
'<span class="product-count__amount-monthly-price">'+$goodsOptnInfo+'</span>' +
'<span class="product-count__amount-price"><span class="comma product-count__amount-priceNum">' + $priceNum +
'</div>' +
'</div>' +
'</div>'
);
}
updateCartCounters(); // 화면에 상품 정보 업데이트
console.log(productArr); // 배열 정보확인
});
// 추가구성옵션
$("#relateMoreItemsSelect").on("change",'select', function () {
var $moreItems = $('#relateMoreItemsSelect').find(".select-box");
const $optInfoOptn3 = $(this).siblings(".nice-select").find(".option.selected").attr("data-value").split('|');
const $priceNumOptn3 = $optInfoOptn3[0];
const $goodsOptnInnbOptn3 = $optInfoOptn3[1];
const $goodsOptnInfoOptn3 = $optInfoOptn3[2];
const $goodsOptnTyOptn3 = $optInfoOptn3[3];
const $optnEssnlAtOptn3 = $(this).siblings('[name="selectOptionItem__otpnEssntlAt__added"]').val();
// $moreItems.each(function () {
// if ($(this).find('.option.selected.disabled').length > 0) return;
var $title = $(this).siblings('.nice-select').find('.option.selected').text().replace(' ', '').trim().replace('선택', ' ').replace(/\(\+.*?\)/g, '');
//이미 추가된 상품인지 확인
var isItemAlreadyAdded = cartProductArr.some(function (item) {
return item[4] === $goodsOptnInnbOptn3;
});
if (isItemAlreadyAdded){
fn_goods_duplicate_select_modal()
return;
}
const $relateGoodsInnb = $(this).closest("#relateMoreItemsSelect").find('input[name="relateGoodsInnb"]').val()
cartProductArr.push([$title, 1, $priceNumOptn3, $priceNumOptn3 * 1, $goodsOptnInnbOptn3, $goodsOptnTyOptn3, $relateGoodsInnb, $optnEssnlAtOptn3]); // 배열에 상품 정보 추가
$('#cartCountContainer').append( // 화면에 상품 정보 추가
'<div class="product-count">' +
'<div class="product-count__amount-top">' +
'<span class="product-count__amount-title">' + $title + '</span>' +
'<button class="product-count__amount-delete"><span class="visually-hidden">삭제</span></button>' +
'</div>' +
'<div class="product-count__amount-bottom">' +
'<div class="product-count__amount-counter">' +
'<button class="product-count__amount-btn minus"><span class="visually-hidden">감소</span></button>' +
'<span class="product-count__amount-number">1</span>' +
'<button class="product-count__amount-btn plus"><span class="visually-hidden">추가</span></button>' +
'</div>' +
'<div class="product-count__amount-price-box">' +
'<span class="product-count__amount-monthly-price">'+$goodsOptnInfoOptn3+'</span>' +
'<span class="product-count__amount-price"><span class="comma product-count__amount-priceNum">' + $priceNumOptn3 +
'</div>' +
'</div>' +
'</div>'
);
$(this).val('').niceSelect('update')
updateCartCounters(); // 화면에 상품 정보 업데이트
});
//prodctArr에 추가시 중복제거
function addUniqueProducts(productArr, cartProductArr) {
// cartProductArr의 중복 제거
var uniqueCartProductArr = cartProductArr.filter(function(cartProduct, index, self) {
return index === self.findIndex(function(t) {
return t[4] === cartProduct[4]; // 각 배열의 첫 번째 요소(goodsOptnInnb) 기준으로 중복 제거
});
});
// uniqueCartProductArr를 반복하면서 productArr에 없는 상품을 추가
uniqueCartProductArr.forEach(function(cartProduct) {
var existsInProductArr = productArr.some(function(product) {
return product[4] === cartProduct[4]; // 각 배열의 첫 번째 요소(goodsOptnInnb) 비교
});
// productArr에 존재하지 않는 경우에만 추가
if (!existsInProductArr) {
productArr.push(cartProduct);
}
});
}
// //함께 구매하기 버튼 클릭시
$(document).on('click', '#addGoodsDtl',function () {
//상품 선택 확인
// if(cartProductArr.length <= 0){
// alert('상품옵션을 선택해 주세요');
// return;
// }
//추가구성옵션 - 필수추가구성옵션 있는지 확인
var values = $('input[name="productDetailInfo__additionalSelect__otpnEssntlAt__relate"]').map(function() {
return $(this).val();
}).get();
if(values.includes('Y')){
var isAddedOptnEssntlAt = cartProductArr.some(function (item) {
return item[7] === 'Y'
});
if(!isAddedOptnEssntlAt){
alert('필수추가옵션을 선택해 주세요');
return;
}
}
//일반옵션 라디오 버튼 체크 해제
$('#relatedProductPop input[type="radio"]').prop('checked', false);
//상품 상세 화면에 추가
addUniqueProducts(productArr, cartProductArr)
$('#countContainer').append($('#cartCountContainer').find('.product-count'))
updateTotalPriceProd() // 함께하면 좋은 상품 가격 더하기
closeModal('relatedProductPop')
})
// 3자리마다 "," 추가
function addComma(num) {
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
//메인 상품 상세에 가격 더하기
function updateTotalPriceProd() {
var totalPrice = 0; // 총 상품금액
for (var i = 0; i < productArr.length; i++) {
totalPrice += productArr[i][3]; // 배열의 총 가격을 더함
}
$(".productDetailInfo__priceTotal__totalPriceNum").text(addComma(totalPrice)); // 총 상품금액 텍스트 변경
}
/*************************************************************
함께하면 좋은상품 이벤트 (모달) END
**************************************************************/
</script>
<div class="productOption" id="relate-product-option-sheet" style="padding-bottom: 0">
<input type="hidden" id="relateSlepricDscntAmt" value="${relateResultMap.goodsDtl.slepric}"/>
<c:if test="${not empty relateResultMap.optnList.normalOptnList}">
<p class="productOption__title">옵션 선택</p>
<div class="product-option">
<c:forEach var="goodsOpt01" items="${relateResultMap.optnList.normalOptnList}" varStatus="optList01">
<c:if test="${goodsOpt01.optnExpsrAt eq 'Y'}">
<c:if test="${goodsOpt01.invntrySldoutExpsrAt eq 'Y'}">
<div class="product-option__item">
<c:if test="${not empty goodsOpt01.optnVal1}">
<div class="custom-radio is-medium">
<input type="hidden" name="relateGoodsInnb" value="${goodsOpt01.goodsInnb}" />
<input type="radio" id="r-2${goodsOpt01.optnOrdr}" name="r-group01" <c:if test="${goodsOpt01.disableAt eq 'Y'}"> disabled</c:if> >
<label for="r-2${goodsOpt01.optnOrdr}">${goodsOpt01.optnVal1}</label>
<input type="hidden" name="optnCd" value="${goodsOpt01.optnCd1}">
<input type="hidden" name="goodsOptnInnb" value="${goodsOpt01.goodsOptnInnb}"/>
<input type="hidden" name="goodsOptnTy" value="${goodsOpt01.optnTy}"/>
<input type="hidden" name="goodsSopmalCd" value="${goodsOpt01.sopmalCd}"/>
<c:if test="${goodsOpt01.disableAt eq 'Y'}"> <span>(품절)</span></c:if>
</div>
<div class="product-option__right">
<span class="product-option__price"><fmt:formatNumber value="${goodsOpt01.slepric}"/>원</span>
<span class="product-option__monthly-payment">${goodsOpt01.optnInfo}</span>
</div>
</c:if>
</div>
</c:if>
</c:if>
</c:forEach>
</div>
</c:if>
<c:if test="${not empty relateResultMap.optnList.invntryOptnList}">
<p class="productOption__title">옵션 선택</p>
<div class="selectOptionItem" id="relateAdditionalSelect">
<c:if test="${not empty relateResultMap.optnList.invntryOptnList[0].optnNm1}">
<div class="select-box">
<input type="hidden" name="relateGoodsInnb" value="${relateResultMap.optnList.invntryOptnList[0].goodsInnb}" />
<input type="hidden" name="relateGoodsNm" value="${relateResultMap.goodsDtl.goodsNm}" />
<select class="full" title="해당 셀렉트에 대한 설명" id="selectRelateInvntryOptn1" name="selectRelateInvntryOptn">
<option value="" selected>선택</option>
<c:forEach var="goodsOpt02" items="${relateResultMap.optnList.invntryOptnList}" varStatus="optList02">
<c:if test="${goodsOpt02.optnExpsrAt eq 'Y'}">
<c:if test="${goodsOpt02.invntrySldoutExpsrAt eq 'Y'}">
<c:if test="${goodsOpt02.optnVal1 ne relateResultMap.optnList.invntryOptnList[optList02.index-1].optnVal1}">
<option value="${goodsOpt02.slepric}|${goodsOpt02.goodsOptnInnb}|${goodsOpt02.optnInfo}|${goodsOpt02.optnTy}" <c:if test="${goodsOpt02.disableAt eq 'Y'}"> disabled </c:if> >
<c:out value="${goodsOpt02.optnVal1}"/>
</option>
</c:if>
</c:if>
</c:if>
</c:forEach>
</select>
</div>
</c:if>
<c:if test="${not empty relateResultMap.optnList.invntryOptnList[0].optnNm2}">
<div class="select-box">
<select class="full" title="해당 셀렉트에 대한 설명" id="selectRelateInvntryOptn2" name="selectRelateInvntryOptn">
<option value="" disabled selected>선택</option>
</select>
</div>
</c:if>
<c:if test="${not empty relateResultMap.optnList.invntryOptnList[0].optnNm3}">
<div class="select-box">
<select class="full" title="해당 셀렉트에 대한 설명" id="selectRelateInvntryOptn3" name="selectRelateInvntryOptn">
<option value="" disabled selected>선택</option>
</select>
</div>
</c:if>
<c:if test="${not empty relateResultMap.optnList.invntryOptnList[0].optnNm4}">
<div class="select-box">
<select class="full" title="해당 셀렉트에 대한 설명" id="selectRelateInvntryOptn4" name="selectRelateInvntryOptn">
<option value="" disabled selected>선택</option>
</select>
</div>
</c:if>
</div>
</c:if>
<c:if test="${not empty relateResultMap.optnList.addedOptnList}">
<p class="productOption__title">추가구성</p>
<div class="selectOptionItem" id="relateMoreItemsSelect">
<input type="hidden" name="relateGoodsInnb" value="${relateResultMap.optnList.addedOptnList[0].goodsInnb}"/>
<c:forEach var="goodsOpt03" items="${relateResultMap.optnList.addedOptnList}" varStatus="optList03">
<c:if test="${not empty goodsOpt03.optnNm1}">
<c:if test="${relateResultMap.optnList.addedOptnList[optList03.index-1].optnNm1 ne goodsOpt03.optnNm1}">
<div class="select-box">
<input type="hidden" name="selectOptionItem__otpnEssntlAt__added" <c:if test="${goodsOpt03.optnEssntlAt eq 'Y'}"> value="Y"</c:if>/>
<select class="full" title="해당 셀렉트에 대한 설명" name="selectRelateAddedOptn">
<option value="" disabled selected>${goodsOpt03.optnNm1} 선택</option>
<c:forEach var="goodsOptVal03" items="${relateResultMap.optnList.addedOptnList}" varStatus="optVal03">
<c:if test="${goodsOptVal03.optnNm1 eq goodsOpt03.optnNm1}">
<c:if test="${goodsOptVal03.optnExpsrAt eq 'Y'}">
<c:if test="${goodsOptVal03.invntrySldoutExpsrAt eq 'Y'}">
<option value="${goodsOptVal03.slepric}|${goodsOptVal03.goodsOptnInnb}|${goodsOptVal03.optnInfo}|${goodsOptVal03.optnTy} " <c:if test="${goodsOptVal03.disableAt eq 'Y'}"> disabled</c:if> ><c:out value="${goodsOptVal03.optnVal1}"/> (+ <fmt:formatNumber value="${goodsOptVal03.slepric}"/>) <c:if test="${goodsOptVal03.disableAt eq 'Y'}"> <c:out value="(품절)"/> </c:if> </option>
</c:if>
</c:if>
</c:if>
</c:forEach>
</select>
</div>
</c:if>
</c:if>
</c:forEach>
</div>
</c:if>
<%-- <p class="productOption__title">상품정보 입력</p> TODO :: 입력옵션--%>
<%-- <div class="inputOptionItem">--%>
<%-- <input id="addTextInput" class="input-text full" type="text" title="해당 인풋에 대한 설명"--%>
<%-- placeholder="각인 문구를 입력해주세요" value="">--%>
<%-- <button type="button" id="addTextBtn" class="btn outline md">저장</button>--%>
<%-- </div>--%>
<div id="cartCountContainer">
</div>
</div>

View File

@@ -0,0 +1,29 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : QnaListR.jsp
Description : 상품qna 목록
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-05 김혜인
--%>
<!DOCTYPE html>
<html lang="ko">
<div class="sub-box">
<div id="productRefund" class="productDetailcontent__item">
<div class="userRefund">
<h5 class="userRefund__title">반품/교환정보</h5>
<div class="userRefund__inner">
<c:out value="${resultMap.infoCn}" escapeXml="false"/>
</div>
</div>
</div>
</div>
</html>

View File

@@ -0,0 +1,146 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : RvwListR.jsp
Description : 리뷰 리스트
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-05 김혜인
--%>
<!DOCTYPE html>
<html lang="ko">
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<div class="userReview">
<div class="productReview__subTitle">
<span class="productReview__subTitle__title">리뷰</span>
<span class="productReview__subTitle__num">
<span class="comma" id = "totCnt">3506</span><span class="unit">건</span>
</span>
<div class="userReview__sort">
<button class="categoryTriggerBtn rvwPop" id = "rvwSort">
랭킹순
</button>
<button class="categoryTriggerBtn rvwPop" id = "rvwKnd">
전체보기
</button>
</div>
</div>
<%--검색 키워드--%>
<div class="userReview__hashtag">
<c:forEach var = "srchKeyword" items="${resultMap.resultList.srchKewordList}">
<button type="button" class="userReview__hashtag__btn" value = "<c:out value = "${srchKeyword.qesitmNm}"/>">#<c:out value = "${srchKeyword.qesitmNm}"/></button>
</c:forEach>
<input type = "hidden" id = "hiddenSrch" value = "<c:out value = '${resultMap.bbscttVO.srchKeywordArr}'/>"/>
</div>
<c:choose>
<c:when test = "${not empty resultMap.resultList.rvwList}">
<c:forEach var="resultList" items="${resultMap.resultList.rvwList}">
<div class="userReviewItem">
<div class="userReviewItem__top">
<div class="userReviewItem__userImage">
<img src="/mobile/images/icon_user-info.png" alt="">
</div>
<div class="userReviewItem__top__info">
<c:if test = "${not empty resultList.evlScore}">
<div class="reviewStars__wrapper--sm">
<fmt:formatNumber value="${resultList.evlScore}" pattern="##" var="evlScore"/>
<div class="reviewStars star-<c:out value="${evlScore}"/>"></div>
<span class="reviewStars__num"><c:out value="${evlScore}"/></span>
</div>
</c:if>
<div class="userReviewItem__misc">
<span class="userReviewItem__misc__id"><c:out value = "${resultList.regusrId}"/></span>
<span class="userReviewItem__misc__date"><c:out value = "${resultList.registDt}"/></span>
<c:if test = "${resultList.bstAt eq 'Y'}">
<span class="reviewBadge reviewBadge--red">BEST</span>
</c:if>
<c:if test = "${resultList.bbsTyCd eq '07'}">
<span class="reviewBadge">한달사용기</span>
</c:if>
<c:if test = "${resultList.reOrderAt eq 'Y'}">
<span class="reviewBadge">재구매</span>
</c:if>
</div>
</div>
</div>
<div class="userReviewItem__body listPage">
<div class="listCn">
<c:out value="${resultList.cn}"/>
</div>
<c:forEach var="photoByBbsctt" items="${resultMap.resultList.photoByBbsctt}">
<c:if test="${resultList.bbscttInnb eq photoByBbsctt.bbscttInnb}">
<div class="userReviewItem__reviewImage listImage">
<c:if test="${not empty resultList.filCours}">
<img src="<c:out value = "${cdnurl}${photoByBbsctt.filCours}${photoByBbsctt.sysFilNm}"/>"
onerror='this.src = "/mobile/images/image_placeholder.png"'
alt="">
<span class="userReviewItem__reviewImage__num listPageImg">
<c:out value="${resultList.fileCnt}"/>
</span>
</c:if>
</div>
</c:if>
</c:forEach>
<c:if test="${resultList.bbscttEvlUseAt eq 'Y'}">
<button class="userReviewItem__like"
onclick = "fn_update_bbsctt_recomend('recommend', '<c:out value = '${resultList.bbscttInnb}'/>', this);">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M14.7749 16.583H5.6756V7.41637L11.3711 1.75293L11.7012 1.8747C11.9266 2.03069 12.0992 2.22513 12.2188 2.45803C12.3385 2.69094 12.3705 2.93292 12.315 3.18399L12.2941 3.20803L11.5345 7.41637H17.2429C17.6115 7.41637 17.9269 7.54751 18.1892 7.8098C18.4515 8.07208 18.5826 8.38752 18.5826 8.75612V9.62308C18.5826 9.72351 18.5749 9.81351 18.5594 9.8931C18.5439 9.97269 18.5153 10.0558 18.4736 10.1423L16.1052 15.7185C15.9865 15.9829 15.8075 16.193 15.5682 16.349C15.3289 16.505 15.0645 16.583 14.7749 16.583ZM6.75891 15.4997H14.7749C14.8337 15.4997 14.8938 15.4837 14.9552 15.4516C15.0167 15.4195 15.0634 15.3661 15.0955 15.2913L17.4993 9.68718V8.75612C17.4993 8.68133 17.4753 8.61989 17.4272 8.5718C17.3791 8.52372 17.3177 8.49968 17.2429 8.49968H10.2461L11.1868 3.4532L6.75891 7.86508V15.4997ZM5.6756 7.41637V8.49968H2.49931V15.4997H5.6756V16.583H1.41602V7.41637H5.6756Z"
fill="black" />
</svg>
<em class="recommendCnt">
<c:out value="${resultList.recomendCnt}"/>
</em>
</button>
<c:if test="${resultList.bbscttEvlRecomendStep eq '02'}">
<button class="userReviewItem__like userReviewItem__like--dislike"
onclick = "fn_update_bbsctt_recomend('nonrecommend', '<c:out value = '${resultList.bbscttInnb}'/>', this);">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M14.7749 16.583H5.6756V7.41637L11.3711 1.75293L11.7012 1.8747C11.9266 2.03069 12.0992 2.22513 12.2188 2.45803C12.3385 2.69094 12.3705 2.93292 12.315 3.18399L12.2941 3.20803L11.5345 7.41637H17.2429C17.6115 7.41637 17.9269 7.54751 18.1892 7.8098C18.4515 8.07208 18.5826 8.38752 18.5826 8.75612V9.62308C18.5826 9.72351 18.5749 9.81351 18.5594 9.8931C18.5439 9.97269 18.5153 10.0558 18.4736 10.1423L16.1052 15.7185C15.9865 15.9829 15.8075 16.193 15.5682 16.349C15.3289 16.505 15.0645 16.583 14.7749 16.583ZM6.75891 15.4997H14.7749C14.8337 15.4997 14.8938 15.4837 14.9552 15.4516C15.0167 15.4195 15.0634 15.3661 15.0955 15.2913L17.4993 9.68718V8.75612C17.4993 8.68133 17.4753 8.61989 17.4272 8.5718C17.3791 8.52372 17.3177 8.49968 17.2429 8.49968H10.2461L11.1868 3.4532L6.75891 7.86508V15.4997ZM5.6756 7.41637V8.49968H2.49931V15.4997H5.6756V16.583H1.41602V7.41637H5.6756Z"
fill="black" />
</svg>
<em class="nonrecommendCnt">
<c:out value="${resultList.nonrecomendCnt}"/>
</em>
</button>
</c:if>
</c:if>
<input type = "hidden" value = "<c:out value="${resultList.bbscttInnb}"/>"/>
</div>
</div>
</c:forEach>
<%--더보기 버튼--%>
<c:if test = "${resultMap.bbscttVO.pageUnit eq fn:length(resultMap.resultList.rvwList)}">
<div class="bottomBtnControls" id = "rvwMoreDiv">
<button class="btn md outline full" id = "rvwMore">
<span class="fullBtnSection__more">
리뷰 더보기
</span>
</button>
</div>
</c:if>
<input type="hidden" value = "<c:out value="${resultMap.bbscttVO.pageIndex}"/>" id = "rvwPageIndex">
</c:when>
<c:otherwise>
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png" alt="상품 이미지">
</div>
<p class="noResult__text"><spring:message code="common.nodata"/></p>
</div>
</c:otherwise>
</c:choose>
</div>
</html>

View File

@@ -0,0 +1,346 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : RvwListRForm.jsp
Description : 리뷰 목록 폼
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-04 김혜인
--%>
<!DOCTYPE html>
<html lang="ko">
<%--데이터 set--%>
<%--상품 리뷰 평가 정보--%>
<c:set value = "${resultMap.rvwInfo.evlInfo}" var = "evlInfo"/>
<%--상품 리뷰 추가 평가 통계--%>
<c:set value = "${resultMap.rvwInfo.itmStats}" var = "itmStats"/>
<%--상품 포토 리뷰 이미지 건수--%>
<c:set value = "${resultMap.rvwInfo.photoTot}" var = "photoTot"/>
<%--상품 포토 리뷰 리스트--%>
<c:set value = "${resultMap.rvwInfo.photoList}" var = "photoList"/>
<%--베스트 후기 건수--%>
<c:set value = "${resultMap.rvwInfo.bstTotCnt}" var = "bstTotCnt"/>
<%--베스트 후기 목록--%>
<c:set value = "${resultMap.rvwInfo.bstRvwList}" var = "bstRvwList"/>
<%--마일리지 적립 금액 조회--%>
<c:set value = "${resultMap.rvwBnefInfo}" var = "rvwBnefInfo"/>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<div class="sub-box">
<div class="productReview__status">
<div class="productReview__top">
<div class="productReview__rating">
<span class="productReview__status__title">사용자 총 평점</span>
<div class="allReviewStars__wrapper">
<span class="allReviewStars__numWrap">
<span class="allReviewStars__num"><c:out value = "${evlInfo.avgEvlScore}"/></span>
</span>
<div class="allReviewStars">
<!-- width 설정한 만큼 별에 노란색 생김 -->
<div style="width: <c:out value = "${evlInfo.starWidth}"/>%;" class="allReviewStars__fill"></div>
</div>
</div>
</div>
<div class="productReview__ratingStats">
<span class="productReview__status__title">평점 비율</span>
<div class="productReview__ratingStats__inner">
<div
class="productReview__ratingStats__item productReview__ratingStats__topRating">
<span class="productReview__ratingStats__star">5점</span>
<div class="productReview__ratingStats__bar">
<div style="width: <c:out value = "${evlInfo.fiveRate}"/>%;"
class="productReview__ratingStats__fill">
</div>
</div>
<span class="productReview__ratingStats__num"><fmt:formatNumber value="${evlInfo.fiveTot}" pattern="#,###"/></span>
</div>
</div>
<div class="productReview__ratingStats__item">
<span class="productReview__ratingStats__star">4점</span>
<div class="productReview__ratingStats__bar">
<div style="width: <c:out value = "${evlInfo.fourRate}"/>%;"
class="productReview__ratingStats__fill">
</div>
</div>
</div>
<div class="productReview__ratingStats__item">
<span class="productReview__ratingStats__star">3점</span>
<div class="productReview__ratingStats__bar">
<div style="width: <c:out value = "${evlInfo.threeRate}"/>%;"
class="productReview__ratingStats__fill">
</div>
</div>
</div>
<div class="productReview__ratingStats__item">
<span class="productReview__ratingStats__star">2점</span>
<div class="productReview__ratingStats__bar">
<div style="width: <c:out value = "${evlInfo.twoRate}"/>%;"
class="productReview__ratingStats__fill">
</div>
</div>
</div>
<div class="productReview__ratingStats__item">
<span class="productReview__ratingStats__star">1점</span>
<div class="productReview__ratingStats__bar">
<div style="width: <c:out value = "${evlInfo.oneRate}"/>%;"
class="productReview__ratingStats__fill"></div>
</div>
</div>
</div>
</div>
<%--문항 별 항목 --%>
<c:if test="${not empty itmStats}">
<div class="productReview__reviewStats">
<div class="productReview__reviewStats__item">
<span class="productReview__status__title">다른 구매자들은 이렇게 평가했어요</span>
<div class="otherReviews">
<c:forEach var = "itmStat" items="${itmStats}">
<div class="otherReviews__wrap">
<div class="otherReviews__item">
<span class="otherReviews__category"><c:out value = "${itmStat.key}"/></span>
<span class="otherReviews__title"><c:out value = "${itmStat.value[0].itmCn}"/></span>
<div class="otherReviews__line"></div>
<span class="otherReviews__percent"><fmt:formatNumber value="${itmStat.value[0].rateAnsw}" pattern="##"/>%</span>
</div>
<div class="otherReviewsDetail">
<c:forEach var = "itm" items="${itmStat.value}">
<div class="otherReviewsDetail__item">
<span class="otherReviewsDetail__title"><c:out value = "${itm.itmCn}"/></span>
<div class="otherReviewsDetail__bar">
<div style="width: <fmt:formatNumber value="${itm.rateAnsw}" pattern="##"/>%;"
class="otherReviewsDetail__fill">
</div>
</div>
<span class="otherReviewsDetail__num"><fmt:formatNumber value="${itm.rateAnsw}" pattern="##"/>%</span>
</div>
</c:forEach>
</div>
</div>
</c:forEach>
</div>
<div class="otherReviews__moreWrap">
<button class="otherReviews__moreBtn photo">더보기</button>
</div>
</div>
</div>
</c:if>
</div>
</div>
<c:if test = "${not empty bstRvwList}">
<div class="sub-box">
<div class="storePick">
<div class="productReview__subTitle">
<span class="productReview__subTitle__title">스토어 PICK</span>
<br>
<span class="productReview__subTitle__subText">판매자가 직접 선정한 베스트리뷰입니다</span>
</div>
<div class="swiper storePick__swiper">
<div class="swiper-pagination"></div>
<div class="swiper-wrapper">
<c:forEach var="bstList" items="${bstRvwList}" varStatus="status">
<div class="swiper-slide storePick__item fullscreen-trigger storePickReview-index"
data-micromodal-trigger="store-review-image">
<a class="storePick__box">
<input type = "hidden" name = "bbscttInnb" value = "<c:out value = "${bstList.bbscttInnb}"/>"/>
<div class="storePick__top">
<div class="storePick__top__info">
<div class="reviewStars__wrapper--sm">
<div class="reviewStars star-<fmt:formatNumber value="${bstList.evlScore}" pattern="##"/>"></div>
<span class="reviewStars__num"><fmt:formatNumber value="${bstList.evlScore}" pattern="##"/></span>
</div>
<div class="storePick__misc">
<span class="storePick__misc__id"><c:out value="${bstList.regusrId}"/>
<c:if test="${bstList.rvwKingAt eq 'Y'}">
<span class="storePick__misc__badge">리뷰왕</span>
</c:if>
</span>
<span class="storePick__misc__date"><c:out value="${bstList.registDt}"/></span>
<c:if test = "${bstList.bstAt eq 'Y'}">
<span class="reviewBadge reviewBadge--red">BEST</span>
</c:if>
<c:if test = "${bstList.bbsTyCd eq '07'}">
<span class="reviewBadge">한달사용기</span>
</c:if>
</div>
</div>
</div>
<div class="storePick__body">
<c:if test = "${not empty bstList.sysFilNm}">
<div class="storePick__reviewImage">
<img src="<c:out value="${cdnurl}${bstList.filCours}${bstList.sysFilNm}"/>"
onerror="this.src='/mobile/images/image_placeholder.png'" alt="">
<span class="storePick__reviewImage__num"><c:out value="${bstList.fileCnt}"/></span>
<input type="hidden" value="<c:out value="${bstList.sysFilNm}"/>"/>
</div>
</c:if>
<div class="storePick__reviewText">
<input type = "hidden" value = "${bstList.npayBbscttSnb}" class="npayBbscttSnb"/>
<c:out value="${bstList.cn}" escapeXml="false"/>
</div>
</div>
</a>
</div>
</c:forEach>
</div>
</div>
</div>
</div>
</c:if>
<c:if test = "${not empty photoList}">
<div class="sub-box">
<div class="photoReview">
<div class="productReview__subTitle">
<input type="hidden" value = "<c:out value='${photo.bbscttInnb}'/>" class="bbscttInnb">
<span class="productReview__subTitle__title">포토&동영상</span>
<span class="productReview__subTitle__num">
<span class="comma"><fmt:formatNumber value="${photoTot}" pattern="#,###"/></span><span class="unit">건</span>
</span>
<button class="productReview__more photoMore">더보기</button>
</div>
<div class="photoReview__thumbs">
<c:forEach var="photo" items="${photoList}" varStatus="status">
<c:choose>
<c:when test = "${!status.last}">
<a class="photoReview__thumbs__image photoReview-index photoImg photoDtl"
data-micromodal-trigger="photo-review-image">
<c:if test = "${not empty photo.sysFilNm}">
<img src="<c:out value='${cdnurl}${photo.filCours}${photo.sysFilNm}'/>"
onerror ="this.src='/mobile/images/image_placeholder.png'" alt="">
<span class="photoReview__thumbs__num"><fmt:formatNumber value="${photo.fileCnt}" pattern="#,###"/></span>
</c:if>
</a>
</c:when>
<c:otherwise>
<a class="photoReview__thumbs__moreImage photoImg photoMore"
id="photo-gallery-moreImage-trigger"
data-micromodal-trigger="photo-review-image">
<c:if test = "${not empty photo.sysFilNm}">
<img src="<c:out value='${cdnurl}${photo.filCours}${photo.sysFilNm}'/>"
onerror ="this.src='/mobile/images/image_placeholder.png'"alt="">
<span class="photoReview__thumbs__more">더보기</span>
</c:if>
</a>
</c:otherwise>
</c:choose>
<div style="display: none" class="photoRvwCn">
<input type="hidden" value="${photo.npayBbscttSnb}" class="npayBbscttSnb"/>
<c:out value="${photo.cn}" escapeXml="false"/>
</div>
</c:forEach>
</div>
</div>
</div>
</c:if>
<div class="sub-box rvwList">
</div>
<%--전체 리뷰수, 포토 리뷰수, 한달 리뷰수 리뷰 jsp 삽입 시 값 set--%>
<input type = "hidden" value = "<fmt:formatNumber value="${evlInfo.cntBbsctt}" pattern="#,###"/>" id = cntBbsctt>
<!-- 스토어 PICK 리뷰 -->
<div class="microModal microFullScreen storePickReviewPop" id="store-review-image" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
스토어 PICK
<div class="swiper-pagination storePickReviewSlide__fraction"></div>
</h2>
<button class="microModal__close" aria-label="창 닫기"></button>
</div>
<div class="microModal__content">
<div class="swiper storePickReviewSlide">
<div class="swiper-wrapper">
<c:forEach var="bstList" items="${resultMap.rvwInfo.bstRvwList}" varStatus="status">
<div class="swiper-slide">
<div class="storePickReviewSlide__content">
<div class="photoReviewDetail">
<div class="photoReviewDetail__rightTop">
<div class="photoReviewDetail__top__info">
<c:if test = "${not empty bstList.evlScore}">
<div class="reviewStars__wrapper--sm">
<div class="reviewStars star-<fmt:formatNumber value="${bstList.evlScore}" pattern="##"/>"></div>
<span class="reviewStars__num">
<fmt:formatNumber value="${bstList.evlScore}" pattern="##"/>
</span>
</div>
</c:if>
<div class="photoReviewDetail__misc">
<span class="photoReviewDetail__misc__id">
<c:out value="${bstList.regusrId}"/>
<%--리뷰왕 여부--%>
<c:if test="${bstList.rvwKingAt eq 'Y'}">
<span class="storePick__misc__badge">리뷰왕</span>
</c:if>
</span>
<span class="photoReviewDetail__misc__date"><c:out
value="${bstList.registDt}"/></span>
</div>
</div>
</div>
<div class="photoReviewDetail__reviewText storePickModalCn">
<input type = "hidden" class = "npayBbscttSnb" value = "<c:out value = "${bstList.npayBbscttSnb}"/>"/>
<c:out value="${bstList.cn}" escapeXml="false"/>
</div>
<ul class="storePickReviewSlide__imgList">
<c:forEach items = "${resultMap.rvwInfo.bstRvwFileList}" var = "bstPhotoList">
<c:forEach var = "photoList" items = "${bstPhotoList}">
<c:if test="${bstList.bbscttInnb eq photoList.bbscttInnb}">
<li>
<img src="<c:out value = "${cdnurl}${photoList.filCours}${photoList.sysFilNm}"/>" alt="">
</li>
</c:if>
</c:forEach>
</c:forEach>
</ul>
</div><%--리뷰 내용에 있는 사진들 다 li로 이동 시켜야함--%>
<c:if test="${bstList.bbscttEvlUseAt eq 'Y'}">
<div class="photoReviewDetail__rightBottom">
<span class="photoReviewDetail__reviewAsk">리뷰가 도움이 되었나요?</span>
<button class="userReviewItem__like" tabindex="0">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M14.7749 16.583H5.6756V7.41637L11.3711 1.75293L11.7012 1.8747C11.9266 2.03069 12.0992 2.22513 12.2188 2.45803C12.3385 2.69094 12.3705 2.93292 12.315 3.18399L12.2941 3.20803L11.5345 7.41637H17.2429C17.6115 7.41637 17.9269 7.54751 18.1892 7.8098C18.4515 8.07208 18.5826 8.38752 18.5826 8.75612V9.62308C18.5826 9.72351 18.5749 9.81351 18.5594 9.8931C18.5439 9.97269 18.5153 10.0558 18.4736 10.1423L16.1052 15.7185C15.9865 15.9829 15.8075 16.193 15.5682 16.349C15.3289 16.505 15.0645 16.583 14.7749 16.583ZM6.75891 15.4997H14.7749C14.8337 15.4997 14.8938 15.4837 14.9552 15.4516C15.0167 15.4195 15.0634 15.3661 15.0955 15.2913L17.4993 9.68718V8.75612C17.4993 8.68133 17.4753 8.61989 17.4272 8.5718C17.3791 8.52372 17.3177 8.49968 17.2429 8.49968H10.2461L11.1868 3.4532L6.75891 7.86508V15.4997ZM5.6756 7.41637V8.49968H2.49931V15.4997H5.6756V16.583H1.41602V7.41637H5.6756Z"
fill="black"></path>
</svg>
<em>
<c:out value="${bstList.recomendCnt}"/>
</em>
</button>
<c:if test="${bstList.bbscttEvlRecomendStep eq '02'}">
<button class="userReviewItem__like userReviewItem__like--dislike"
tabindex="0">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M14.7749 16.583H5.6756V7.41637L11.3711 1.75293L11.7012 1.8747C11.9266 2.03069 12.0992 2.22513 12.2188 2.45803C12.3385 2.69094 12.3705 2.93292 12.315 3.18399L12.2941 3.20803L11.5345 7.41637H17.2429C17.6115 7.41637 17.9269 7.54751 18.1892 7.8098C18.4515 8.07208 18.5826 8.38752 18.5826 8.75612V9.62308C18.5826 9.72351 18.5749 9.81351 18.5594 9.8931C18.5439 9.97269 18.5153 10.0558 18.4736 10.1423L16.1052 15.7185C15.9865 15.9829 15.8075 16.193 15.5682 16.349C15.3289 16.505 15.0645 16.583 14.7749 16.583ZM6.75891 15.4997H14.7749C14.8337 15.4997 14.8938 15.4837 14.9552 15.4516C15.0167 15.4195 15.0634 15.3661 15.0955 15.2913L17.4993 9.68718V8.75612C17.4993 8.68133 17.4753 8.61989 17.4272 8.5718C17.3791 8.52372 17.3177 8.49968 17.2429 8.49968H10.2461L11.1868 3.4532L6.75891 7.86508V15.4997ZM5.6756 7.41637V8.49968H2.49931V15.4997H5.6756V16.583H1.41602V7.41637H5.6756Z"
fill="black"></path>
</svg>
<em>
<c:out value="${bstList.nonrecomendCnt}"/>
</em>
</button>
</c:if>
</div>
</c:if>
</div>
</div>
</c:forEach>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</html>

View File

@@ -0,0 +1,148 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : RvwPhotoListR.jsp
Description : 포토 리뷰 리스트 모달
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-05 김혜인
--%>
<!DOCTYPE html>
<html lang="ko">
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<!-- 포토&동영상 리뷰 -->
<div class="microModal microFullScreen photoReviewPop" id="photo-review-image" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
포토&동영상
<div class="swiper-pagination photoReviewSlide__fraction"></div>
</h2>
<button class="microModal__close" id = "photoPickClose"></button>
</div>
<div class="microModal__content">
<div class="swiper photoReviewSlide">
<div class="swiper-wrapper" id = "photoSwiper">
<c:forEach var="photoList" items="${resultMap.resultList.photoList}">
<div class="swiper-slide">
<div class="photoReviewSlide__content">
<div class="photoReviewDetail">
<div class="photoReviewDetail__rightTop">
<div class="photoReviewDetail__top__info">
<div class="reviewStars__wrapper--sm">
<div class="reviewStars star-<fmt:formatNumber value="${photoList.evlScore}" pattern="##"/>"></div>
<span class="reviewStars__num"><fmt:formatNumber
value="${photoList.evlScore}" pattern="##"/></span>
</div>
<div class="photoReviewDetail__misc">
<span class="photoReviewDetail__misc__id">
<c:out value="${photoList.regusrId}"/>
<%--리뷰왕 여부--%>
<c:if test="${photoList.rvwKingAt eq 'Y'}">
<span class="storePick__misc__badge">리뷰왕</span>
</c:if>
</span>
<span class="photoReviewDetail__misc__date"><c:out
value="${photoList.registDt}"/></span>
</div>
</div>
</div>
<div class="photoReviewDetail__reviewText photoRvwModalCn">
<input type="hidden"
value="<c:out value = "${photoList.npayBbscttSnb}"/>"
class="npayBbscttSnb"/>
<c:out value="${photoList.cn}" escapeXml="false"/>
</div>
<ul class="photoReviewSlide__imgList">
<c:if test="${not empty resultMap.resultList.photoByBbsctt}">
<c:forEach items="${resultMap.resultList.photoByBbsctt}" var="photoRvwFile">
<c:if test="${photoList.bbscttInnb eq photoRvwFile.bbscttInnb}">
<li>
<img src="<c:out value = "${cdnurl}${photoRvwFile.filCours}${photoRvwFile.sysFilNm}"/>"
onerror="javascript:img=new Image();img.src='/mobile/images/image_placeholder.png';if(img.complete){this.src='/mobile/images/image_placeholder.png'} else{this.style.display='none';}"
alt="">
</li>
</c:if>
</c:forEach>
</c:if>
</ul>
</div>
<c:if test="${photoList.bbscttEvlUseAt eq 'Y'}">
<div class="photoReviewDetail__rightBottom">
<span class="photoReviewDetail__reviewAsk">리뷰가 도움이 되었나요?</span>
<button class="userReviewItem__like" tabindex="0">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M14.7749 16.583H5.6756V7.41637L11.3711 1.75293L11.7012 1.8747C11.9266 2.03069 12.0992 2.22513 12.2188 2.45803C12.3385 2.69094 12.3705 2.93292 12.315 3.18399L12.2941 3.20803L11.5345 7.41637H17.2429C17.6115 7.41637 17.9269 7.54751 18.1892 7.8098C18.4515 8.07208 18.5826 8.38752 18.5826 8.75612V9.62308C18.5826 9.72351 18.5749 9.81351 18.5594 9.8931C18.5439 9.97269 18.5153 10.0558 18.4736 10.1423L16.1052 15.7185C15.9865 15.9829 15.8075 16.193 15.5682 16.349C15.3289 16.505 15.0645 16.583 14.7749 16.583ZM6.75891 15.4997H14.7749C14.8337 15.4997 14.8938 15.4837 14.9552 15.4516C15.0167 15.4195 15.0634 15.3661 15.0955 15.2913L17.4993 9.68718V8.75612C17.4993 8.68133 17.4753 8.61989 17.4272 8.5718C17.3791 8.52372 17.3177 8.49968 17.2429 8.49968H10.2461L11.1868 3.4532L6.75891 7.86508V15.4997ZM5.6756 7.41637V8.49968H2.49931V15.4997H5.6756V16.583H1.41602V7.41637H5.6756Z"
fill="black"></path>
</svg>
<em class="recommendCnt">
<c:out value="${photoList.recomendCnt}"/>
</em>
</button>
<button class="userReviewItem__like userReviewItem__like--dislike"
tabindex="0">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20" fill="none">
<path
d="M14.7749 16.583H5.6756V7.41637L11.3711 1.75293L11.7012 1.8747C11.9266 2.03069 12.0992 2.22513 12.2188 2.45803C12.3385 2.69094 12.3705 2.93292 12.315 3.18399L12.2941 3.20803L11.5345 7.41637H17.2429C17.6115 7.41637 17.9269 7.54751 18.1892 7.8098C18.4515 8.07208 18.5826 8.38752 18.5826 8.75612V9.62308C18.5826 9.72351 18.5749 9.81351 18.5594 9.8931C18.5439 9.97269 18.5153 10.0558 18.4736 10.1423L16.1052 15.7185C15.9865 15.9829 15.8075 16.193 15.5682 16.349C15.3289 16.505 15.0645 16.583 14.7749 16.583ZM6.75891 15.4997H14.7749C14.8337 15.4997 14.8938 15.4837 14.9552 15.4516C15.0167 15.4195 15.0634 15.3661 15.0955 15.2913L17.4993 9.68718V8.75612C17.4993 8.68133 17.4753 8.61989 17.4272 8.5718C17.3791 8.52372 17.3177 8.49968 17.2429 8.49968H10.2461L11.1868 3.4532L6.75891 7.86508V15.4997ZM5.6756 7.41637V8.49968H2.49931V15.4997H5.6756V16.583H1.41602V7.41637H5.6756Z"
fill="black"></path>
</svg>
<em class="nonrecomendCnt">
<c:out value="${photoList.nonrecomendCnt}"/>
</em>
</button>
</div>
</c:if>
</div>
</div>
</c:forEach>
</div>
<div class="bottomBtnControls">
<button id="photo-gallery-trigger" class="btn md outline full">
전체보기
</button>
</div>
</div>
<div class="photoReviewGallery">
<ul class="photoReviewGallery__list">
<c:forEach var="photoList" items="${resultMap.resultList.photoList}">
<li class="photoReviewGallery__item" innb="${photoList.bbscttInnb}">
<c:if test="${not empty photoList.filCours}">
<button type = "button" class="photoReviewGallery__image">
<img src="${cdnurl}${photoList.filCours}${photoList.sysFilNm}"
onerror="/mobile/images/image_placeholder.png"
alt="">
<span class="photoReviewGallery__num">
<c:out value='${photoList.fileCnt}'/>
</span>
</button>
</c:if>
</li>
<div style="display: none" class="photoRvwModalGallaryCn" innb ="${photoList.bbscttInnb}">
<input type="hidden" value="<c:out value = "${photoList.npayBbscttSnb}"/>"
class="npayBbscttSnb"/>
<c:out value="${photoList.cn}" escapeXml="false"/>
</div>
</c:forEach>
<div id="end"></div>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<input type = "hidden" id = "photoRvwIndex" value = "<c:out value="${resultMap.bbscttVO.pageIndex}"/>"/>
<input type = "hidden" id = "evtOccrrncAt" value = "<c:out value="${resultMap.bbscttVO.pageIndex}"/>"/>
</html>

View File

@@ -0,0 +1,164 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<script defer>
//쿠폰받기 가능한 쿠폰이 없을경우 버튼, 전체선택버튼 비활성화
$(document).ready(function () {
let couponUsedChk = 0;
$('div .couponSelect__item.used').each(() => {
couponUsedChk++;
});
if ($('div .couponSelect__item.coupon__used__chk').length === couponUsedChk) {
$('#couponCheckAll').prop('disabled', true)
$('#selectCouponBtn').prop('disabled', true)
}
});
// 240729 1. 쿠폰 선택 우측 텍스트 영역 클릭해도, 체크박스 체크되도록 2. 전체선택 클릭 시, 전체 체크박스 체크/해제
$('.couponSelect__item__right').click(function () {
var checkbox = $(this).prev().find('input[type="checkbox"]');
checkbox.trigger('click');
});
$('#couponCheckAll').click(function () {
if ($('#couponCheckAll').is(':checked')) {
$('.couponCheck').prop('checked', true);
} else {
$('.couponCheck').prop('checked', false);
}
if ($('.couponCheck').closest('.couponSelect__item').hasClass('used')) {
$('.couponCheck:checked').prop('checked', false);
}
});
$('.couponCheck').click(function () {
if ($('.couponCheck').length == $('.couponCheck:checked').length) {
$('#couponCheckAll').prop('checked', true);
} else {
$('#couponCheckAll').prop('checked', false);
}
});
</script>
<!-- 쿠폰 받기 모달 -->
<!-- 240729 쿠폰 받기 바텀시트 -->
<div class="microModal microBottomSheet" id="coupon-select-popUp" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<button class="microModal__close" aria-label="창 닫기" onclick="closeModal('coupon-select-popUp')"></button>
</div>
<div class="microModal__content">
<div class="couponSelect" id="dwldCouponDiv">
<div class="couponSelect__item couponSelect__item--checkAll">
<div class="couponSelect__item__left">
<div class="b-checkbox-container">
<label class="b-checkbox checkbox">
<input id="couponCheckAll" type="checkbox" value="">
<span class="check"></span>
<span class="control-label"></span>
</label>
</div>
</div>
<div class="couponSelect__item__right">
<span class="couponSelect__item__checkAll">전체선택</span>
</div>
</div>
<c:choose>
<c:when test="${not empty resultMap.couponList}">
<c:forEach var="couponInfo" items="${resultMap.couponList}">
<c:choose>
<c:when test="${couponInfo.couponTrgetAt eq '1'}">
<div class="couponSelect__item coupon__used__chk <c:if test="${couponInfo.couponDownAt eq 'Y' }"> used</c:if>" > <%--사용한 쿠폰이거나 이미 다운로드 하였을 경우 used 클래스 적용--%>
<div class="couponSelect__item__left">
<div class="b-checkbox-container">
<label class="b-checkbox checkbox is-medium">
<input class="couponCheck dwldCheckBox" type="checkbox" value="">
<span class="check"></span>
<span class="control-label"></span>
</label>
</div>
</div>
<div class="couponSelect__item__right">
<span class="couponSelect__item__price"><fmt:formatNumber value="${couponInfo.aditDscntAmt}" />원
<c:if test="${couponInfo.couponDownAt eq 'Y'}"><span class="couponSelect__item__usedText">(이미 다운로드 한 쿠폰)</span></c:if>
<p class="couponSelect__item__detail"><c:out value="${couponInfo.couponSndngNm}"/></p>
<c:choose>
<c:when test="${couponInfo.cvalidpdKndCd eq '01'}">
<p class="couponSelect__item__date">~<c:out value="${couponInfo.validpdEndDt}"/> (<c:out value="${couponInfo.validpdDeCnt}"/> 일 남음)</p>
<input type="hidden" name="couponInnb" value="<c:out value="${ couponInfo.couponInnb }"/>"/>
<input type="hidden" name="couponSopmalCd" value="<c:out value="${ couponInfo.sopmalCd }"/>"/>
<input type="hidden" name="couponSndngInnb" value="<c:out value="${ couponInfo.couponSndngInnb }"/>"/>
</c:when>
<c:otherwise>
<p class="couponSelect__item__date">~<c:out value="${couponInfo.dwldEndDt}"/> (발급(다운로드)일로 부터 <c:out value="${couponInfo.validpdDeCnt}"/> 일)</p>
<input type="hidden" name="couponInnb" value="<c:out value="${ couponInfo.couponInnb }"/>"/>
<input type="hidden" name="couponSopmalCd" value="<c:out value="${ couponInfo.sopmalCd }"/>"/>
<input type="hidden" name="couponSndngInnb" value="<c:out value="${ couponInfo.couponSndngInnb }"/>"/>
</c:otherwise>
</c:choose>
</div>
</div>
</c:when>
<c:otherwise>
<div class="couponSelect__item used" >
<div class="couponSelect__item__left">
<div class="b-checkbox-container">
<label class="b-checkbox checkbox is-medium">
<input class="couponCheck dwldCheckBox" type="checkbox" value="">
<span class="check"></span>
<span class="control-label"></span>
</label>
</div>
</div>
<div class="couponSelect__item__right">
<span class="couponSelect__item__price"><fmt:formatNumber value="${couponInfo.aditDscntAmt}" />원
<span class="couponSelect__item__usedText">(쿠폰대상이 아닙니다)</span>
<p class="couponSelect__item__detail"><c:out value="${couponInfo.couponSndngNm}"/></p>
<c:choose>
<c:when test="${couponInfo.cvalidpdKndCd eq '01'}">
<p class="couponSelect__item__date">~<c:out value="${couponInfo.validpdEndDt}"/> (<c:out value="${couponInfo.validpdDeCnt}"/> 일 남음)</p>
<input type="hidden" name="couponInnb" value="<c:out value="${ couponInfo.couponInnb }"/>"/>
<input type="hidden" name="couponSopmalCd" value="<c:out value="${ couponInfo.sopmalCd }"/>"/>
<input type="hidden" name="couponSndngInnb" value="<c:out value="${ couponInfo.couponSndngInnb }"/>"/>
</c:when>
<c:otherwise>
<p class="couponSelect__item__date">~<c:out value="${couponInfo.dwldEndDt}"/> (발급(다운로드)일로 부터 <c:out value="${couponInfo.validpdDeCnt}"/> 일)</p>
<input type="hidden" name="couponInnb" value="<c:out value="${ couponInfo.couponInnb }"/>"/>
<input type="hidden" name="couponSopmalCd" value="<c:out value="${ couponInfo.sopmalCd }"/>"/>
<input type="hidden" name="couponSndngInnb" value="<c:out value="${ couponInfo.couponSndngInnb }"/>"/>
</c:otherwise>
</c:choose>
</div>
</div>
</c:otherwise>
</c:choose>
</c:forEach>
</c:when>
<c:otherwise>
<c:out value="다운로드 가능한 쿠폰이 없습니다."/>
</c:otherwise>
</c:choose>
</div>
<div class="productOption__bottom">
<div class="product-btn-container">
<button type="button" id="selectCouponBtn" class="btn theme" onclick="fn_coupon_dwld_regist();">선택한 쿠폰 받기</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,37 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : StorePickDtlR.jsp
Description : 리뷰 상세 모달
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-05 김혜인
--%>
<!DOCTYPE html>
<html lang="ko">
<%--상품 qna 작성 할 때 회원이 아닐 시--%>
<div class="microModal microAlert" id="authPop" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
이용하시려면 로그인이 필요합니다!
<br>
로그인하시겠습니까?
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" onclick = "fn_move_login()"><spring:message code="button.yes"/></button>
<button class="microModal__btn" data-micromodal-close="" aria-label="창 닫기"><spring:message code="button.no"/></button>
</div>
</div>
</div>
</div>
</html>

View File

@@ -0,0 +1,131 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : StrListForm.jsp
Description : 매장안내 폼
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-02-27 추지훈 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function(){
const sopmalCd = '<c:out value="${sopmalCd}"/>';
if (sopmalCd === 'TZ') {
const dv = "${dv}"; // 서버에서 렌더링된 dv 값
const message = {
type: "dv",
content: dv
};
$("#myiframe")[0].contentWindow.postMessage(message, "*");
maxHeight = '1000';
if (dv === 'company') {
$("#headerTitle").text("더작 스토리");
} else if (dv === 'ferment') {
$("#headerTitle").text("효소발효");
} else if (dv === 'freeze') {
$("#headerTitle").text("동결건조");
} else if (dv === 'organic') {
$("#headerTitle").text("유기농");
} else if (dv === 'production') {
maxHeight = '650';
$("#headerTitle").text("더작 생산현장");
} else if (dv === 'way') {
maxHeight = '450';
$("#headerTitle").text("오시는길");
}
}else{
$("#headerTitle").text("브랜드");
}
});
</script>
<body><%--todo:: 퍼블리싱 오면 해결하기--%>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<c:choose>
<c:when test = "${sopmalCd ne 'DT'}">
<iframe src="/sopmal/main/selectiframeBrandStroyForm?dv=${dv}" style="width: 100%;" id = "myiframe"></iframe>
</c:when>
<c:otherwise>
<div class="sub-wrapper">
<jsp:include page="/WEB-INF/views/html/pc/DT/brandStory.jsp"/>
</div>
</c:otherwise>
</c:choose>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
</body>
<script>
$("#myiframe").on('load', function() {
var iframe = $(this);
const sopmalCd = '<c:out value="${sopmalCd}"/>';
var htmlHeight = iframe.contents().find('html').prop('scrollHeight');
var bodyHeight = iframe.contents().find('body').prop('scrollHeight');
var maxHeight = Math.max(htmlHeight, bodyHeight);
if (sopmalCd === 'TZ') {
const dv = "${dv}"; // 서버에서 렌더링된 dv 값
const message = {
type: "dv",
content: dv
};
$("#myiframe")[0].contentWindow.postMessage(message, "*");
maxHeight = '1000';
if (dv === 'production') {
maxHeight = '650';
} else if (dv === 'way') {
maxHeight = '450';
}
}else if (sopmalCd === 'CH'){
const dv = "${dv}";
if (dv === 'technology') {
maxHeight = '1000';
}
}
iframe.css('height', maxHeight + 'px');
});
// iframe 메시지 수신 핸들러(iframe 높이 맞추기)
window.addEventListener('message', (event) => {
const msg = event.data;
const sopmalCd = '<c:out value="${sopmalCd}"/>';
if (sopmalCd === 'CH') {
if (msg === 'tech_1' && msg === 'technology') { //참다한기술
$("#myiframe").css('height', '1000px');
} else if (msg === 'tech_2') { // 첨단 생산설비
$("#myiframe").css('height', '600px');
} else if (msg === 'tech_3') { // 3무4무의진실
$("#myiframe").css('height', '1000px');
}
}
});
</script>

View File

@@ -0,0 +1,62 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : StrListForm.jsp
Description : 매장안내 폼
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-02-27 추지훈 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function(){
$(".header__title").text("브랜드");
});
</script>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<iframe src="/sopmal/main/selectiframeBrandValueForm" style="width: 100%;" id = "myiframe"></iframe>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
</body>
<script>
$("#myiframe").on('load', function() {
var iframe = $(this);
var htmlHeight = iframe.contents().find('html').prop('scrollHeight');
var bodyHeight = iframe.contents().find('body').prop('scrollHeight');
var maxHeight = Math.max(htmlHeight, bodyHeight);
iframe.css('height', maxHeight + 'px');
});
</script>

View File

@@ -0,0 +1,53 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function(){
$(".header__title").text($("#stplatNm").val());
});
</script>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="sub-box">
<div class="termsPage">
<div class="terms_wrap">
<div class="ck-content">
<c:forEach var="clauseList" items="${resultMap.clauseList}">
<c:out value="${clauseList.stplatCn}" escapeXml="false"/>
</c:forEach>
</div>
</div>
</div>
</div>
</div>
</main>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/comm/mobile/Footer.jsp"/>
</div>
<c:forEach var="stplat" items="${resultMap.stplat}">
<c:if test="${stplat.cd eq maSopmalVO.stplatDvCd}"><input type = "hidden" value = "<c:out value = "${stplat.cdNm}"/>" id = "stplatNm"/></c:if>
</c:forEach>
</div>
</body>

View File

@@ -0,0 +1,63 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : StrListForm.jsp
Description : 매장안내 폼
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-02-27 추지훈 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function(){
$(".header__title").text("브랜드");
});
</script>
<body><%--todo:: 퍼블리싱 오면 해결하기--%>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<iframe src="/sopmal/main/selectNbIngredientHtml" style="width: 100%;" id = "myiframe"></iframe>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
</body>
<script>
$("#myiframe").on('load', function() {
var iframe = $(this);
var htmlHeight = iframe.contents().find('html').prop('scrollHeight');
var bodyHeight = iframe.contents().find('body').prop('scrollHeight');
var maxHeight = Math.max(htmlHeight, bodyHeight);
iframe.css('height', maxHeight + 'px');
});
</script>

View File

@@ -0,0 +1,63 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : StrListForm.jsp
Description : 매장안내 폼
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-02-27 추지훈 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function(){
$(".header__title").text("브랜드");
});
</script>
<body><%--todo:: 퍼블리싱 오면 해결하기--%>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<iframe src="/sopmal/main/selectNbPromiseHtml" style="width: 100%;" id = "myiframe"></iframe>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
</body>
<script>
$("#myiframe").on('load', function() {
var iframe = $(this);
var htmlHeight = iframe.contents().find('html').prop('scrollHeight');
var bodyHeight = iframe.contents().find('body').prop('scrollHeight');
var maxHeight = Math.max(htmlHeight, bodyHeight);
iframe.css('height', maxHeight + 'px');
});
</script>

View File

@@ -0,0 +1,303 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : RtngudCanclRefndListFromR.jsp
Description :모바일_환불 내역.jsp
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-02 추지훈 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function (){
});
/******************************************************
* 매장 목록 이동
* ****************************************************/
const fn_store_list = function() {
$('#listForm').attr('action', '<c:url value="/sopmal/main/selectStrListForm"/>');
$('#listForm').attr('method', 'post');
$('#listForm').submit();
}
</script>
<style>
.wrap_map { position:relative; width:100%; }
.overlay_label {margin-bottom: 96px; display: inline-block;vertical-align: top; font-size: 13px; font-weight:bold; line-height: 24px; padding:0 5px; background-color:#fff; border:solid 1px gray; border-radius:0.3em; }
.map_btn_comm {float:left;display:block;width:70px;height:27px;background:url('http://t1.daumcdn.net/localimg/localimages/07/mapapidoc/sample_button_control.png') no-repeat}
.wrap_button {position:absolute;left:15px;top:12px;z-index:2}
.btn_linkMap {background-position:0 0;}
.btn_resetMap {background-position:-69px 0;}
.screen_out {display:block;overflow:hidden;position:absolute;left:-9999px;width:1px;height:1px;font-size:0;line-height:0;text-indent:-9999px}
</style>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<%@include file ="/WEB-INF/views/comm/mobile/Header.jsp" %>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<div class="sub-page">
<div class="sub-box">
<div class="swiper productDetailGallery">
<div class="swiper-wrapper">
<!-- 매장 메인 이미지 -->
<c:forEach var="image" items="${fn:split(resultMap.result.strImg, '|')}" varStatus="status">
<div class="swiper-slide">
<img src="${cdnurl}${image}" alt="매장상세이미지" onerror="this.src='/mobile/images/image_placeholder.png'">
</div>
</c:forEach>
</div>
<div class="swiper-pagination"></div>
</div>
<div class="storeDetail">
<div class="storeDetail__top">
<h3 class="storeDetail__storeName"><c:out value="${ resultMap.result.strNm }"/></h3>
<p class="storeDetail__text">
<c:if test="${ resultMap.result.reprsntBrand ne resultMap.paramVO.sopmalCd }">
${ resultMap.result.sopmalNm }가 ${ resultMap.result.reprsntBrandNm }에 입점되었습니다.
</c:if>
</p>
</div>
<div class="table-wrapper storeDetail__table">
<table class="table write">
<caption>해당 테이블에 대한 설명</caption>
<!-- 각 열 width 설정 -->
<colgroup>
<col style="width: 128px;">
<col style="width: auto;">
</colgroup>
<tbody>
<tr>
<th>매장주소</th>
<td>
<div class="td-inner">
<c:choose>
<c:when test="${ not empty resultMap.result.strRnmAdres && not empty resultMap.result.strAdres}">
<c:out value="${ resultMap.result.strRnmAdres }"/><c:out value="${ resultMap.result.strDtlAdres }"/>
</c:when>
<c:when test="${ not empty resultMap.result.strRnmAdres && empty resultMap.result.strAdres }">
<c:out value="${ resultMap.result.strRnmAdres }"/><c:out value="${ resultMap.result.strDtlAdres }"/>
</c:when>
<c:when test="${ empty resultMap.result.strRnmAdres && not empty resultMap.result.strAdres }">
<c:out value="${ resultMap.result.strAdres }"/><c:out value="${ resultMap.result.strDtlAdres }"/>
</c:when>
</c:choose>
</div>
</td>
</tr>
<tr>
<th>영업시간</th>
<td>
<div class="td-inner">
<c:out value="${ resultMap.result.bsnTme }"/>
</div>
</td>
</tr>
<tr>
<th>휴무안내</th>
<td>
<div class="td-inner">
<c:choose>
<c:when test="${ not empty resultMap.result.hvofDe && not empty resultMap.result.hvofDeAdit }">
<c:out value="${ resultMap.result.hvofDe }"/>
<br>
<c:out value="${ resultMap.result.hvofDeAdit }"/>
</c:when>
<c:when test="${ not empty resultMap.result.hvofDe && empty resultMap.result.hvofDeAdit }">
<c:out value="${ resultMap.result.hvofDe }"/>
</c:when>
<c:when test="${ empty resultMap.result.hvofDe && not empty resultMap.result.hvofDeAdit }">
<c:out value="${ resultMap.result.hvofDeAdit }"/>
</c:when>
</c:choose>
</div>
</td>
</tr>
<tr>
<th>전화번호</th>
<td>
<div class="td-inner">
<c:out value="${ resultMap.result.strTelnb }"/>
<a href="tel:<c:out value="${ resultMap.result.strTelnb }"/>"
class="btn outline sm storeDetail__phoneBtn">
<i class="icon icon_phone"></i>
전화걸기
</a>
</div>
</td>
</tr>
<tr>
<th>개점일</th>
<td>
<div class="td-inner">
<c:out value="${ resultMap.result.opbizDe }"/>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="storeDetail__top">
<h3 class="storeDetail__storeName">찾아오시는 길</h3>
</div>
<div class="wrap_map storeDetail__map">
<div id="map" style="display: flex; justify-content: center; align-items: center; background-color: #f5f5f5; height: 400px;" title="카카오지도 영역">
</div>
<div class="wrap_button">
<a href="javascript:void(0);" class="map_btn_comm btn_linkMap" target="_blank" onclick="moveKakaoMap(this)"><span class="screen_out">지도 크게보기</span></a> <!-- 지도 크게보기 버튼입니다 -->
<a href="javascript:void(0);" class="map_btn_comm btn_resetMap" onclick="resetKakaoMap()"><span class="screen_out">지도 초기화</span></a> <!-- 지도 설정 초기화 버튼입니다 -->
</div>
</div>
</div>
</div>
<div class="fullBtnSection">
<button type="button" class="btn md outline full" onclick="fn_store_list();">
목록
</button>
</div>
</div>
<form id="listForm">
<input type="hidden" id="strInnb" name ="strInnb" value="<c:out value="${ resultMap.paramVO.strInnb }"/>"/>
<input type="hidden" id="pageIndex" name="pageIndex" value="<c:out value="${ strVO.pageIndex }"/>"/>
<input type="hidden" id="recordCountPerPage" name="recordCountPerPage" value="<c:out value="${ strVO.recordCountPerPage }"/>"/>
<input type="hidden" id="pageUnit" name="pageUnit" value="<c:out value="${ strVO.pageUnit }"/>"/>
<input type="hidden" id="sopmalCd" name="sopmalCd" value=""/>
</form>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/comm/mobile/Footer.jsp"/>
</div>
</div>
<script>
// 매장 이미지 슬라이드
const mainSwiper = new Swiper(".productDetailGallery", {
loop: true,
pagination: {
el: ".swiper-pagination",
clickable: true,
},
});
</script>
</body>
<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=${kakaoKey}"></script> <!-- TODO : 추지훈 로컬로 설정한 카카오api 키인데 운영때 바꿔줘야함.(?) -->
<script type="text/javascript">
var map_y = '<c:out value="${ resultMap.result.la }"/>';
var map_x = '<c:out value="${ resultMap.result.lo }"/>';
var map_overlay = '<c:out value="${ resultMap.result.strNm }"/>';
var container = document.getElementById('map'); //지도를 담을 영역의 DOM 레퍼런스
var options = { //지도를 생성할 때 필요한 기본 옵션
center: new kakao.maps.LatLng(map_y, map_x), //지도의 중심좌표.
level: 4 //지도의 레벨(확대, 축소 정도)
};
var map = new kakao.maps.Map(container, options); //지도 생성 및 객체 리턴
// 마커가 표시될 위치입니다
var markerPosition = new kakao.maps.LatLng(map_y, map_x);
// 마커를 생성합니다
var marker = new kakao.maps.Marker({
position: markerPosition
});
// 마커가 지도 위에 표시되도록 설정합니다
marker.setMap(map);
// 아래 코드는 지도 위의 마커를 제거하는 코드입니다
// marker.setMap(null);
// 일반 지도와 스카이뷰로 지도 타입을 전환할 수 있는 지도타입 컨트롤을 생성합니다
var mapTypeControl = new kakao.maps.MapTypeControl();
// 지도에 컨트롤을 추가해야 지도위에 표시됩니다
// kakao.maps.ControlPosition은 컨트롤이 표시될 위치를 정의하는데 TOPRIGHT는 오른쪽 위를 의미합니다
map.addControl(mapTypeControl, kakao.maps.ControlPosition.TOPRIGHT);
// 지도 확대 축소를 제어할 수 있는 줌 컨트롤을 생성합니다
var zoomControl = new kakao.maps.ZoomControl();
map.addControl(zoomControl, kakao.maps.ControlPosition.RIGHT);
// 커스텀 오버레이에 표시할 내용입니다
// HTML 문자열 또는 Dom Element 입니다
var map_content = '<div class ="overlay_label">'+map_overlay+'</div>';
// 커스텀 오버레이가 표시될 위치입니다
var map_position = new kakao.maps.LatLng(map_y, map_x);
// 커스텀 오버레이를 생성합니다
var customOverlay = new kakao.maps.CustomOverlay({
position: map_position,
content: map_content
});
// 커스텀 오버레이를 지도에 표시합니다
customOverlay.setMap(map);
//지도 이동 이벤트 핸들러
function moveKakaoMap(self){
var center = map.getCenter(),
lat = center.getLat(),
lng = center.getLng();
self.href = 'https://map.kakao.com/link/map/' + encodeURIComponent(map_overlay) + ',' + lat + ',' + lng; //Kakao 지도로 보내는 링크
}
//지도 초기화 이벤트 핸들러
function resetKakaoMap(){
map.setCenter(options.center); //지도를 초기화 했던 값으로 다시 셋팅합니다.
map.setLevel(options.level);
}
</script>
</html>

View File

@@ -0,0 +1,161 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : RtngudCanclRefndListFromR.jsp
Description :모바일_환불 내역.jsp
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-02 추지훈 최초 생성
--%>
<script>
$(document).ready(function (){
});
</script>
<body>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<main class="main">
<form id="listForm">
<input type="hidden" id="strInnb" name="strInnb" value=""/>
<div class="sub-page">
<div class="storeList">
<div class="sub-box">
<div class="storeList__inner">
<div class="storeList__top">
<div class="storeList__topImage">
<img src="/pc/images/매장안내이미지.png" alt="">
</div>
<div class="storeList__topText">
<p class="storeList__title">전국 <c:out value="${ resultMap.resultCnt }"/>개</p>
<p class="storeList__subTitle">매장 한 눈에 보기</p>
</div>
</div>
<div class="storeList__tab__wrapper">
<div class="storeList__tab">
<button class="storeList__tabBtn current" type="button">
<span class="storeList__tabText">전체</span>
</button>
<c:forEach var="groupList" items="${ resultMap.resultGroupList }" varStatus="status">
<button class="storeList__tabBtn" type="button">
<span class="storeList__tabText">
<c:choose>
<c:when test="${ fn:substring(groupList.ctyDo, 0, 2) eq '충청'}">
<c:out value="${fn:substring(groupList.ctyDo, 0, 1)}"/><c:out value="${fn:substring(groupList.ctyDo, 2, 3)}"/>
</c:when>
<c:otherwise>
<c:out value="${fn:substring(groupList.ctyDo, 0, 2)}"/>
</c:otherwise>
</c:choose>
</span>
</button>
</c:forEach>
</div>
</div>
<div class="storeList__content">
<div class="storeList__section current">
<c:choose>
<c:when test="${ not empty resultMap.resultGroupList && fn:length(resultMap.resultGroupList) > 0 }">
<c:forEach var="groupList" items="${ resultMap.resultGroupList }" varStatus="status">
<div class="storeList__subList">
<div class="storeList__subList__top">
<span class="storeList__subList__title"><c:out value="${ groupList.ctyDo }"/></span>
<span class="storeList__subList__subTitle">(<c:out value="${ groupList.strCount}"/>개점)</span>
</div>
<div class="storeList__subList__bottom">
<ul class="storeList__subList__list">
<c:forEach var="list" items="${ resultMap.resultList }" varStatus="status">
<c:if test="${ groupList.ctyDo eq list.ctyDo }">
<li>
<a type="button" onclick="fn_move_store_dtl('<c:out value="${ list.strInnb }"/>');">
<span class="storeList__subList__name"><c:out value="${ list.ctyGunGu }"/></span>
<span class="storeList__subList__store"><c:out value="${ list.strNm }"/></span>
</a>
</li>
</c:if>
</c:forEach>
</ul>
</div>
</div>
</c:forEach>
</c:when>
</c:choose>
</div>
<c:choose>
<c:when test="${ not empty resultMap.resultGroupList && fn:length(resultMap.resultGroupList) > 0 }">
<c:forEach var="groupList" items="${ resultMap.resultGroupList }" varStatus="status">
<div class="storeList__section">
<div class="storeList__subList">
<div class="storeList__subList__top">
<span class="storeList__subList__title"><c:out value="${ groupList.ctyDo }"/></span>
<span class="storeList__subList__subTitle">(<c:out value="${ groupList.strCount}"/>개점)</span>
</div>
<div class="storeList__subList__bottom">
<ul class="storeList__subList__list">
<c:forEach var="list" items="${ resultMap.resultList }" varStatus="status">
<c:if test="${ groupList.ctyDo eq list.ctyDo }">
<li>
<a type="button" onclick="fn_move_store_dtl('<c:out value="${ list.strInnb }"/>');">
<span class="storeList__subList__name"><c:out value="${ list.ctyGunGu }"/></span>
<span class="storeList__subList__store"><c:out value="${ list.strNm }"/></span>
</a>
</li>
</c:if>
</c:forEach>
</ul>
</div>
</div>
</div>
</c:forEach>
</c:when>
</c:choose>
</div>
</div>
</div>
</div>
</div>
</form>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
<script>
// 매장 지역 탭
$('.storeList__tabBtn').on('click', function () {
var $this = $(this);
var index = $this.index();
var $tabContent = $('.storeList__section').eq(index);
$this.addClass('current').siblings().removeClass('current');
$tabContent.addClass('current').siblings().removeClass('current');
});
</script>

View File

@@ -0,0 +1,331 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : RtngudCanclRefndListFromR.jsp
Description :모바일_환불 내역.jsp
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-02 추지훈 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function (){
// const title = '매장 안내';
// fn_set_header_title(title);
let strInnb = '<c:out value="${ paramVO.strInnb }"/>';
if (strInnb) {
$('#srchListBtn').click();
} else {
$('#guidBtn').click();
}
// fn_start_display();
});
let pageIndexMain = '<c:out value="${ paramVO.pageIndex }"/>';
/******************************************************************
* 시작 화면 제어
******************************************************************/
const fn_start_display = function() {
}
/******************************************************
* 매장안내 목록 조회
* ****************************************************/
const fn_store_guidance = function() {
$.ajax({
type: "post",
url : '<c:url value="/sopmal/main/selectStrGuidance"/>',
success:function(resultHtml) {
$('#storeListDiv').empty();
$('#storeListDiv').html(resultHtml);
}
});
}
/******************************************************
* 매장검색 목록 조회
* ****************************************************/
const fn_srch_store = function() {
$.ajax({
type: "post",
url : '<c:url value="/sopmal/main/selectStrListSrchForm"/>',
success:function(resultHtml) {
$('#storeListDiv').empty();
$('#storeListDiv').html(resultHtml);
}
});
}
/**********************************************************
* 매장검색 목록 조회
* ********************************************************/
const fn_select_store = function(pageIndex, pageUnit) {
const url = '<c:url value="/sopmal/main/selectStrListInqire"/>';
let data;
$('#pageIndex').val(pageIndex);
if(!pageUnit) {
data = $('#listForm').serialize();
} else {
if($('#pageUnit').length){
$('#pageUnit').val(pageUnit);
data = $('#listForm').serialize();
} else {
data = $('#listForm').serialize()+'&pageUnit='+pageUnit;
}
}
$('#pageIndex').val(pageIndex);
$.ajax({
type: 'POST',
url: url,
data: data,
success: function (resultHtml) {
if ($('#pageDiv').html()) {
$('#pageDiv').empty();
}
$('#pageDiv').html(resultHtml);
$('#rowCnt').text(return_cnt());
fn_infinite_scroll(fn_add_store_list, '', '#strInfiniteListDiv');
}
});
}
/**********************************************************
* 인피니티 스크롤 매장 목록 추가
* ********************************************************/
const fn_add_store_list = function() {
const url = '<c:url value="/sopmal/main/selectStrListScrolInqire"/>';
let pageIndex = parseInt($("#pageIndex").val(), 10);
$("#pageIndex").val(pageIndex+1);
let data = $('#listForm').serialize();
$.ajax({
type: 'POST',
url: url,
data: data,
success: function (result) {
const resultList = result.resultList;
let list = '';
if (resultList != null && resultList.length > 0) {
resultList.forEach(function (item) {
list += '<div class="storeSearchList__item">';
list += ' <div class="storeSearchList__storeName" href="">';
list += ' <img src="/pc/images/brand_cham.png" onerror="this.src=\'/pc/images/image_placeholder.png\'" alt="' + item.strNm + '">' + item.strNm;
list += ' </div>';
list += ' <p class="storeSearchList__address"></p>';
if (item.strAdresDv === '01') {
list += item.strRnmAdres;
} else if (item.strAdresDv === '02') {
list += item.strAdres;
}
list += ' ' + item.strDtlAdres;
list += ' </p>';
list += ' </p>';
list += ' <p class="storeSearchList__phone">' + item.strTelnb + '</p>';
list += ' <a href="" class="btn outline sm" onclick="fn_move_store_dtl(\'' + item.strInnb + '\');">매장가기</a>';
list += '</div>';
});
$('#strInfiniteListDiv').before(list);
}
}
});
}
/* ************************************************************
* 인피니티 스크롤 공통 처리
* callBackFnNm : 스크롤 밑으로 끝까지 내려갈 시 발생할 함수 이름
* callBackFnParam : 그 함수의 파라미터
* evtOccrrncAt : 끝까지 검색 후 이벤트 발생 방지 파라미터 => N이면 이벤트 발생 안함
*************************************************************
const fn_infinite_scroll = (callBackFnNm, callBackFnParam) => {
$(window).on('scroll', function () {
// 페이지의 전체 높이와 스크롤된 높이
var documentHeight = $(document).height();
var scrollTop = $(window).scrollTop();
var windowHeight = $(window).height();
// const evtOccrrncAt = $("#evtOccrrncAt").val()
console.log(" 여기 진입을 못하는것같은데1");
if (scrollTop + windowHeight >= documentHeight) {
console.log(" 여기 진입을 못하는것같은데2");
// if (evtOccrrncAt === 'Y') {
callBackFnNm(callBackFnParam);
// }
}
});
}
*/
/******************************************************
* 매장 상세 이동
* ****************************************************/
const fn_move_store_dtl = function(strInnb) {
$('#listForm').attr('action', '<c:url value="/sopmal/main/selectStrDtlInqire"/>');
$('#listForm').attr('method', 'post');
$('#strInnb').val(strInnb);
$('#listForm').submit();
}
/* ********************************************************
* 대분류 선태값에 따른 중분류 생성
******************************************************** */
const fn_select_lrgeClCd = function(cdValue, target) {
let dataStr;
$.ajax({
type: "post",
url : "<c:url value="/sopmal/main/selecSidoGunguCmmnCdArray"/>",
data : dataStr,
success:function(data) {
let jsonData;
jsonData = JSON.parse(data.resBody.result).gunguCdList;
let filteredData = jsonData.filter(item => item.cd.startsWith(cdValue));
filteredData.forEach(item => {
let option = new Option(item.cdNm, item.cd);
target.add(option);
});
fn_create_selectBox(filteredData, target);
}
});
}
/* ********************************************************
* 중분류 셀렉트 생성
******************************************************** */
function fn_create_selectBox(jsonData, tartget) {
$('#middlClCdDiv').empty();
let trClone = '';
trClone = '<select class="full" name="srchCtyGunGu" title="군/구">'
+ '<option value="" selected disabled>군/구</option>'
+ '<option value="">전체</option>'
for (let i = 0; i < jsonData.length; i++) {
trClone +=' <option value="' + jsonData[i].cdNm + '">' + jsonData[i].cdNm + '</option>';
}
trClone += '</select>';
$('#middlClCdDiv').append(trClone);
$('#middlClCdDiv > select').niceSelect();
}
</script>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<%@include file ="/WEB-INF/views/comm/mobile/Header.jsp" %>
</header>
<div class="content-wrap">
<nav class="headerTab">
<div class="headerTab__content">
<ul class="headerTab__list">
<li class="headerTab__item active">
<button id="guidBtn" type="button" onclick="fn_store_guidance();">매장안내</button>
</li>
<li class="headerTab__item">
<button id="srchListBtn" type="button" onclick="fn_srch_store();">매장검색</button>
</li>
</ul>
</div>
</nav>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div id="storeListDiv">
</div>
<div class="boxTab__content">
</div>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/comm/mobile/Footer.jsp"/>
</div>
</div>
<script>
$('.headerTab__item').on('click', function (e) {
e.preventDefault(); // 링크 이동 방지
var index = $(this).index(); // 클릭한 탭의 인덱스
$(this).addClass('active'); // 클릭한 탭 활성화
$(this).siblings().removeClass('active'); // 클릭한 탭 활성화
$('.sub-page').eq(index).show(); // 클릭한 탭에 해당하는 페이지만 보이기
$('.sub-page').eq(index).siblings().hide(); // 클릭한 탭에 해당하는 페이지만 보이기
});
</script>
</body>
</html>

View File

@@ -0,0 +1,81 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : RtngudCanclRefndListFromR.jsp
Description :매장 검색 리스트 폼.jsp
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-02 추지훈 최초 생성
--%>
<script>
$(document).ready(function (){
$('select').niceSelect();
let pageUnit = '<c:out value="${ resultMap.paramVO.pageUnit }"/>';
fn_select_store(1, pageUnit);
$('#listForm').on('keydown', function(e) {
if (e.keyCode == 13) {
e.preventDefault();
$('#searchBtn').trigger("click");
}
});
});
</script>
<main class="main">
<div class="sub-page">
<div class="topSearchBox">
<form id="listForm">
<input type="hidden" id="strInnb" name="strInnb" value=""/>
<input type="hidden" id="pageIndex" name="pageIndex" value="${ resultMap.paramVO.pageIndex} }"/>
<input type="hidden" id="pageUnit" name="pageUnit" value="${ resultMap.paramVO.pageUnit} }"/>
<input type="hidden" id="evtOccrrncAt" name="evtOccrrncAt" value="continue"/>
<div class="select-box">
<select class="full" title="시도" name="srchCtyDo" onchange="fn_select_lrgeClCd($(this).val(), this);">
<option value="" selected disabled>시/도</option>
<option value="" >전체</option>
<c:forEach var="sidoList" items="${ resultMap.sidoCdList }">
<option value="<c:out value="${ sidoList.cd }"/>"><c:out value="${ sidoList.cdNm }"/></option>
</c:forEach>
</select>
</div>
<div class="select-box" id="middlClCdDiv">
<select class="full" disabled id="crm-right-category-2" name="srchCtyGunGu" title="해당 셀렉트에 대한 설명">
<option value="" selected disabled>군/구</option>
</select>
</div>
<div class="inputWithBtn">
<input class="input-text full" type="search" title="해당 인풋에 대한 설명" placeholder="매장명 검색"
name="srchKeyword" value="<c:out value="${ resultMap.paramVO.srchKeyword }"/>" maxlength="98">
<button id="searchBtn" type="button" class="btn md theme outline" onclick="fn_select_store(1); return false;">검색</button>
</div>
</form>
</div>
<div class="storeSearchList">
<div class="sub-box" id="pageDiv">
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>

View File

@@ -0,0 +1,75 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : RtngudCanclRefndListFromR.jsp
Description :모바일_환불 내역.jsp
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-02 추지훈 최초 생성
--%>
<script>
$(document).ready(function (){
});
function return_cnt() {
let listCnt = '<c:out value="${ fn:length(resultMap.resultList) }"/>';
return listCnt
}
</script>
<c:choose>
<c:when test="${ not empty resultMap.resultList && fn:length(resultMap.resultList) > 0 }">
<c:forEach var="list" items="${ resultMap.resultList }" varStatus="status">
<div class="storeSearchList__item">
<div class="storeSearchList__storeName" href="">
<c:choose>
<c:when test="${ list.reprsntBrand eq 'CH' }">
<img src="/pc/images/brand_cham.png" alt="">
</c:when>
<c:when test="${ list.reprsntBrand eq 'NC' }">
<img src="/pc/images/brand_nutri.png" alt="">
</c:when>
</c:choose>
<c:out value="${ list.strNm }"/>
</div>
<p class="storeSearchList__address">
<c:choose>
<c:when test="${ list.strAdresDv eq '01' }">
<c:out value="${ list.strRnmAdres}"/>
</c:when>
<c:when test="${ list.strAdresDv eq '02' }">
<c:out value="${ list.strAdres}"/>
</c:when>
</c:choose>
<c:out value="${ list.strDtlAdres }"/>
</p>
<p class="storeSearchList__phone">
<c:out value="${ list.strTelnb }"/>
</p>
<button type="button" class="btn outline sm" onclick="fn_move_store_dtl('<c:out value="${ list.strInnb }"/>');">매장가기</button>
</div>
</c:forEach>
<div id="strInfiniteListDiv"></div>
</c:when>
<c:otherwise>
<div class="noResult">
<div class="noResult__image">
<img src="/pc/images/icon__no-result.png" alt="상품 이미지">
</div>
<p class="noResult__text">매장이 없습니다.</p>
</div>
</c:otherwise>
</c:choose>

View File

@@ -0,0 +1,573 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : IdPasswordSearchR.jsp
Description : 아이디 패스워드 조회(모바일)
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-09-20 이대환 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script type="text/javascript">
$(document).ready(function() {
fn_set_header_title("아이디/비밀번호 찾기");
fn_select_tap('id');
fn_show_phoneAuth();
first = 0;
$(".login__inputBox__alertText").hide();
fn_alert_hide($("#srchIdMbrNm"), $("#srchIdMbrNmAlert"));
fn_alert_hide($("#srchIdPhoneNb"), $("#srchIdPhoneNbAlert"));
fn_alert_hide($("#srchIdSendungNb"), $("#srchIdSendungNbAlert"));
fn_alert_hide($("#srchPsMbrNm"), $("#srchPsMbrNmAlert"));
fn_alert_hide($("#srchPsMbrId"), $("#srchPsMbrIdAlert"));
fn_alert_hide($("#srchPsPhoneNb"), $("#srchPsPhoneNbAlert"));
fn_alert_hide($("#srchPsSendungNb"), $("#srchPsSendungNbAlert"));
$('.certInp').on('keydown', function(e) {
if (e.keyCode == 13) {
$('.phoneAuthBtn').first().click();
}
});
$('.certNb').on('keydown', function(e) {
if (e.keyCode == 13) {
fn_confim_own();
}
});
});
/* ********************************************************
* 아이디 패스워드 찾기 탭 변경
******************************************************** */
findType = '';
const fn_select_tap = function(_target) {
if (_target === 'id') {
$('#findId').addClass('active');
$('#findPswd').removeClass('active');
$('#reqIdForm').show();
$('#reqPswdForm').hide();
} else {
$('#findId').removeClass('active');
$('#findPswd').addClass('active');
$('#reqIdForm').hide();
$('#reqPswdForm').show();
}
findType = _target;
//입력값 초기화
first = 0;
certNb = '';
fn_stop_timer();
$('.input-text').val('');
if(isChkd_own){
$('.input-text').attr("readonly", false);
$('.phoneAuthBtn').show();
$('.phoneAuthOkBtn').hide();
$('#resIdForm').hide();
$('#resPswdForm').hide();
isChkd_own = false;
}
}
/* ********************************************************
* 아이디 찾기 탭이동
******************************************************** */
const fn_move_tapFindId = function (){
$('#findId').click();
}
/* ********************************************************
* 패스워드 찾기 탭이동
******************************************************** */
const fn_move_tapFindPwsd = function (){
$('#findPswd').click();
}
/* ********************************************************
* 휴대폰 인증 버튼 클릭시, 휴대폰 인증 박스 노출
******************************************************** */
const fn_show_phoneAuth = function() {
let phoneAuthBtn = $('.phoneAuthBtn');
let phoneAuthContent = $('.phoneAuthContent');
phoneAuthContent.hide();
phoneAuthBtn.click(function () {
if (findType === 'id') {
if(!$('#srchIdMbrNm').val()){
$('#srchIdMbrNm').focus();
fn_alert_show('이름을 입력해 주세요.');
return;
}else if(!$('#srchIdPhoneNb').val()){
$('#srchIdPhoneNb').focus();
fn_alert_show('휴대폰 번호를 입력해 주세요.');
return;
}
$('#reqIdForm .phoneAuthContent').show();
$('#srchIdSendungNb').focus();
}else {
if(!$('#srchPsMbrNm').val()){
$('#srchPsMbrNm').focus();
fn_alert_show('이름을 입력해 주세요.');
return;
}else if(!$('#srchPsMbrId').val()){
$('#srchPsMbrId').focus();
fn_alert_show('아이디를 입력해 주세요.');
return;
}else if(!$('#srchPsPhoneNb').val()){
$('#srchPsPhoneNb').focus();
fn_alert_show('휴대폰 번호를 입력해 주세요.');
return;
}
$('#reqPswdForm .phoneAuthContent').show();
$('#srchPsSendungNb').focus();
}
fn_sending_number();
});
}
/* ********************************************************
* 휴대폰 인증 카운터
******************************************************** */
let seconds;
let countdown;
let timerRunning = false;
const fn_set_timeOut = function() {
if (seconds >= 0) {
const minutes = Math.floor(seconds / 60).toString().padStart(2, '0');
const remainingSeconds = (seconds % 60).toString().padStart(2, '0');
$('.timer').text(minutes+":"+remainingSeconds);
seconds--;
} else {
fn_stop_timer();
fn_alert_show('인증번호 유효시간이 만료되었습니다.');
}
}
/* ********************************************************
* 휴대폰 인증 번호 발송
******************************************************** */
first = 0;
certNb = '';
const fn_sending_number = function() {
if(timerRunning){
return;
}
let phoneNb;
let mbrNm;
let mbtlnb;
if (findType === 'id') {
phoneNb = $('#srchIdPhoneNb').val();
mbrNm = $('#srchIdMbrNm').val();
mbtlnb = $('#srchIdPhoneNb').val();
} else {
phoneNb = $('#srchPsPhoneNb').val();
mbrNm = $('#srchPsMbrNm').val();
mbtlnb = $('#srchPsPhoneNb').val();
}
if(certNb === phoneNb){
first++;
}else{
first = 0;
}
certNb = phoneNb;
mbtlnb = mbtlnb.trim().replace(/-/g, '');
let params = {
'mbrNm' : mbrNm,
'mbtlnb': mbtlnb
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/insertPhoneAuth"/>',
data : params,
success : function (Data) {
let result = JSON.parse(Data.resBody.result);
if(result.result == "success"){
if (first > 0) {
fn_alert_show('인증번호가 재발송되었습니다.');
} else if (first === 0) {
fn_alert_show('인증번호가 발송되었습니다.');
first++;
} else {
return;
}
let sndngInnb = (findType === 'id') ? $('#srchIdForm .sndngInnb') : $('#srchPswdForm .sndngInnb');
sndngInnb.val(result.sndngInnb);
}else {
fn_alert_show('인증번호 발송에 실패했습니다.');
fn_stop_timer();
return;
}
}
});
$('.input-text').attr("readonly", true);
$('.certNb').attr("readonly", false);
clearInterval(countdown);
seconds = 180;
fn_set_timeOut();
countdown = setInterval(fn_set_timeOut, 1000);
timerRunning = true;
}
/* ********************************************************
* 타이머 정지 함수
******************************************************** */
const fn_stop_timer = function() {
if (timerRunning) {
clearInterval(countdown);
$('.timer').text('03:00');
$('.certNb').val('');
$('.phoneAuthContent').hide();
$('.input-text').attr("readonly", false);
timerRunning = false;
}
}
/* ********************************************************
* 휴대폰 인증 확인
******************************************************** */
isChkd_own = false;
const fn_confim_own = function() {
if (first <= 0) return;
let sndngInnb;
let mbtlnb;
let crtnb;
if (findType === 'id') {
sndngInnb = $('#srchIdForm .sndngInnb').val();
mbtlnb = $('#srchIdPhoneNb').val();
crtnb = $('#srchIdSendungNb').val();
} else {
sndngInnb = $('#srchPswdForm .sndngInnb').val();
mbtlnb = $('#srchPsPhoneNb').val();
crtnb = $('#srchPsSendungNb').val();
}
fn_stop_timer();
mbtlnb = mbtlnb.trim().replace(/-/g, '');
let params = {
'sndngInnb': sndngInnb,
'mbtlnb': mbtlnb,
'crtnb' : crtnb
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectPhoneAuth"/>',
data : params,
success : function (Data) {
let result = JSON.parse(Data.resBody.result);
if(result.result == "success"){
fn_alert_show('인증되었습니다.');
$('.phoneAuthOkBtn').show();
$('.phoneAuthBtn').hide();
isChkd_own = true;
fn_select_infor();
$('.input-text').attr("readonly", true);
}else {
fn_alert_show('인증번호가 일치하지 않습니다.');
return;
}
}
});
}
/* ********************************************************
* 아이디 패스워드 조회
******************************************************** */
const fn_select_infor = function() {
let mbrId = '';
let mbtlnb = '';
let mbrNm = '';
let url = '';
if (findType === 'id') {
url = '<c:url value="/sopmal/mbr/selectIdSearch"/>';
mbrNm = $('#srchIdMbrNm').val().trim();
mbtlnb = $('#srchIdPhoneNb').val().trim().replace(/-/g, '');
} else {
url = '<c:url value="/sopmal/mbr/selectPasswordSearch"/>';
mbrNm = $('#srchPsMbrNm').val().trim();
mbrId = $('#srchPsMbrId').val().trim();
mbtlnb = $('#srchPsPhoneNb').val().trim().replace(/-/g, '');
}
let params = {
'mbrId' : mbrId,
'mbtlnb': mbtlnb,
'mbrNm' : mbrNm
};
$.ajax({
type : 'post',
url : url,
data : params,
success : function(data) {
let result = JSON.parse(data.resBody.result);
if (findType === 'id') {
$('#reqIdForm').hide();
$('#resIdForm').show();
if(result.result == "success"){
$('#resIdForm').find('.userId').text(result.selectId);
$('.findSuccess').show();
$('.findFail').hide();
}else {
$('.findSuccess').hide();
$('.findFail').show();
}
} else if (findType === 'pswd') {
$('#reqPswdForm').hide();
$('#resPswdForm').show();
if(result.result == "success"){
let message = '회원님의 휴대폰(' + fn_hide_numbers(mbtlnb)+ ')';
$('#resPswdForm').find('.mbph').text(message);
$('.findSuccess').show();
$('.findFail').hide();
}
else {
$('.findSuccess').hide();
$('.findFail').show();
}
}
}
});
}
/* ********************************************************
* 핸드폰번호 가리기
******************************************************** */
const fn_hide_numbers = function (_arg){
let mbph = "";
for(var i = 0; i < _arg.length; i++){
if (i === 3) mbph += '-';
mbph += i > _arg.length - 8 ? "*" : _arg.charAt(i);
}
return mbph;
}
/* ********************************************************
* 사용자 입력값이 입력될 때 alertText 숨기기
******************************************************** */
const fn_alert_hide = (inputId, alertId) => {
inputId.on('input', function () {
alertId.hide();
if (!$(this).val()) {
alertId.show();
}
})
};
/* ********************************************************
* alert모달 세팅
******************************************************** */
const fn_alert_show = function(content) {
$('#modal-alert-content').text(content);
openModal('modal-alert');
}
</script>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
<nav class="headerTab">
<div class="headerTab__content">
<ul class="headerTab__list">
<li class="headerTab__item active" id="findId" onclick="fn_select_tap('id');">
<a style="cursor: pointer;">아이디 찾기</a>
</li>
<li class="headerTab__item" id="findPswd" onclick="fn_select_tap('pswd');">
<a style="cursor: pointer;">비밀번호 찾기</a>
</li>
</ul>
</div>
</nav>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="sub-box">
<div class="login">
<div class="login-content">
<div class="boxTab__content login-content current" id="reqIdForm">
<form id="srchIdForm">
<div class="login__inputBox">
<input class="input-text full" type="text" id="srchIdMbrNm" name="mbrNm" title="이름" placeholder="이름">
<p class="login__inputBox__alertText" id="srchIdMbrNmAlert">이름을 입력해 주세요.</p>
<div class="inputWithBtn">
<input type="text" class="input-text full number" id="srchIdPhoneNb" name="mbtlnb" title="휴대폰" placeholder="휴대폰번호 입력 (’-’ 없이)" oninput="fn_set_event(this, 'keyup', fn_fmt_telno)" maxlength="13">
<button type="button" class="btn md theme outline phoneAuthBtn"><spring:message code="button.certification"/></button>
<!-- 인증완료시 버튼 -->
<button type="button" class="btn md outline phoneAuthOkBtn" style="display:none;"><spring:message code="button.certificationDone"/></button>
</div>
<p class="login__inputBox__alertText" id="srchIdPhoneNbAlert">휴대폰번호를 입력해 주세요.</p>
<div class="inputWithBtn phoneAuthContent">
<input type="hidden" class="sndngInnb">
<div class="inputTimer">
<input type="text" class="input-text full number certNb" id="srchIdSendungNb" title="인증번호" placeholder="인증번호 입력" maxlength="6">
<span class="inputTimer__time timer">03:00</span>
</div>
<button type="button" class="btn md gray" onclick="fn_confim_own();"><spring:message code="button.ok"/></button>
</div>
<p class="login__inputBox__alertText" id="srchIdSendungNbAlert">인증번호를 입력해 주세요.</p>
</div>
</form>
</div>
<div id="resIdForm" style="display: none;">
<div class="login__findResult">
<p class="findSuccess">
고객님의 아이디는 <em class="userId"></em> 입니다.
</p>
<p class="findFail">
<span style="color:red;">일치하는 정보가 없습니다.</span><br>아이디 찾기 방법을 변경하거나 회원가입을 해주세요.
</p>
</div>
<div class="login__btnContainer-half">
<button type="button" class="btn xl full outline login__loginBtn findSuccess" onclick="fn_move_tapFindPwsd();">비밀번호 찾기</button>
<a href="<c:url value='/login'/>" class="btn xl full dark login__loginBtn findSuccess">로그인</a>
<button type="button" class="btn xl full outline login__loginBtn findFail" onclick="fn_move_tapFindId();">아이디 찾기</button>
<a href="<c:url value='/sopmal/mbr/selectJoinGuidance'/>" class="btn xl full dark login__loginBtn findFail">회원가입</a>
</div>
</div>
<div class="boxTab__content login-content" id="reqPswdForm">
<form id="srchPswdForm">
<div class="login__inputBox">
<input type="text" class="input-text full certInp" id="srchPsMbrNm" name="mbrNm" title="이름" placeholder="이름">
<p class="login__inputBox__alertText" id="srchPsMbrNmAlert">이름을 입력해 주세요.</p>
<input type="text" class="input-text full certInp" id="srchPsMbrId" name="mbrId" title="아이디" placeholder="아이디">
<p class="login__inputBox__alertText" id="srchPsMbrIdAlert">아이디를 입력해 주세요.</p>
<div class="inputWithBtn">
<input type="text" class="input-text full number certInp" id="srchPsPhoneNb" name="mbtlnb" title="휴대폰" placeholder="휴대폰번호 입력 (’-’ 없이)" oninput="fn_set_event(this, 'keyup', fn_fmt_telno)" maxlength="13">
<button type="button" class="btn md theme outline phoneAuthBtn"><spring:message code="button.certification"/></button>
<!-- 인증완료시 버튼 -->
<button type="button" class="btn md outline phoneAuthOkBtn" style="display:none;"><spring:message code="button.certificationDone"/></button>
</div>
<p class="login__inputBox__alertText" id="srchPsPhoneNbAlert">휴대폰번호를 입력해 주세요.</p>
<div class="inputWithBtn phoneAuthContent">
<input type="hidden" class="sndngInnb">
<div class="inputTimer">
<input type="text" class="input-text full number certNb" id="srchPsSendungNb" title="인증번호" placeholder="인증번호 입력" maxlength="6">
<span class="inputTimer__time timer">03:00</span>
</div>
<button type="button" class="btn md gray" onclick="fn_confim_own();"><spring:message code="button.ok"/></button>
</div>
<p class="login__inputBox__alertText" id="srchPsSendungNbAlert">인증번호를 입력해 주세요.</p>
</div>
</form>
</div>
<div id="resPswdForm" style="display: none;">
<div class="login__findResult">
<p class="findSuccess">
<em class="mbph"></em>으로<br>임시 비밀번호가
발송되었습니다.
<br>
SMS를 확인 부탁 드립니다.
</p>
<p class="findFail">
<span style="color:red;">일치하는 정보가 없습니다.</span><br>아이디 찾기 방법을 변경하거나 회원가입을 해주세요.
</p>
</div>
<a href="<c:url value='/login'/>" class="btn xl full dark login__loginBtn findSuccess">로그인</a>
<div class="login__btnContainer-half findFail">
<button type="button" class="btn xl full outline login__loginBtn" onclick="fn_move_tapFindPwsd();">비밀번호 찾기</button>
<a href="<c:url value='/sopmal/mbr/selectJoinGuidance'/>" class="btn xl full dark login__loginBtn">회원가입</a>
</div>
<p class="textInfo findSuccess"><i class="icon icon_textInfo--sm"></i>SNS 계정으로 가입한 회원의 비밀번호는 저장하지 있지 않으며, 해당
SNS
서비스 제공시에 문의하시길 바랍니다.
</p>
</div>
</div>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<%--alert 팝업--%>
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title" id="modal-alert-content">Alert 메시지</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button type = "button" class="microModal__btn" onclick="closeModal('modal-alert')">
<spring:message code="button.close"/>
</button>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,401 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : JoinAgreeTermsR.jsp
Description : 회원가입 약관(모바일)
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-09-12 이대환 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function() {
fn_set_header_title("회원가입");
$('#termCheckAll').prop('checked', false);
/* ********************************************************
* 약관 전체동의
******************************************************** */
$('#termCheckAll').click(function () {
if ($('#termCheckAll').is(':checked')) {
$('.termCheck').prop('checked', true);
$('[name=stplatDvCdAts]').val('Y');
} else {
$('.termCheck').prop('checked', false);
$('[name=stplatDvCdAts]').val('N');
}
if ($('[name="essntl"]:not(:checked)').length > 0) {
$('#submit').prop('disabled', true);
} else {
$('#submit').prop('disabled', false);
}
});
$('.termCheck').click(function () {
if($('.termCheck:not(:checked)').length == 0) {
$('#termCheckAll').prop('checked', true);
} else {
$('#termCheckAll').prop('checked', false);
}
if ($('[name="essntl"]:not(:checked)').length > 0) {
$('#submit').prop('disabled', true);
} else {
$('#submit').prop('disabled', false);
}
});
/* ********************************************************
* 모달 배경화면 스크롤 방지
******************************************************** */
MicroModal.init({
disableScroll: true,
awaitCloseAnimation: true,
});
/* ********************************************************
* 풀스크린 팝업 이벤트 리스너
******************************************************** */
$('.fullscreen-trigger').on('click', function (e) {
e.preventDefault();
var modalId = $(this).attr('data-micromodal-trigger');
openModal(modalId);
});
$('.microModal .microModal__close').on('click', function () {
var modalId = $(this).closest('.microModal').attr('id');
closeModal(modalId);
});
window.addEventListener('popstate', function (event) {
var modalId = window.location.hash.replace('#', '');
if (modalId) {
closeModal(modalId);
} else {
$('.microModal').each(function () {
MicroModal.close($(this).attr('id'));
});
}
document.body.style.overflow = '';
});
if (window.location.hash) {
var modalId = window.location.hash.replace('#', '');
openModal(modalId);
}
});
/* ********************************************************
* 회원가입 화면으로 이동
******************************************************** */
const fn_move_joinC = function() {
if ($('input[name="joinMthCd"]').length) {
disableButton('#submit');
if(!confirm('회원가입을 <spring:message code="confirm.common.predicate"/>')){
fn_regist_fail();
return;
}
let params = $('#termsForm').serialize();
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectMbrwithdrawalSearch"/>',
data : params,
success : function(result) {
let mbrWithDrawalList = JSON.parse(result.resBody.result).mbrWithDrawalList;
if(mbrWithDrawalList.length > 0) {
params = params + '&' + $.param({'extMember': mbrWithDrawalList[0].mbrInnb});
}
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/insertUsrJoinRegist"/>',
data : params,
success : function (result) {
const response = JSON.parse(result.resBody.result);
const errStatus = response.status;
if(errStatus === 500){
fn_alert_show('회원가입에 실패하였습니다. 회원가입 안내 화면으로 돌아갑니다.', '/sopmal/mbr/selectJoinGuidance');
fn_regist_fail();
return;
}
const mbrInnb = response.mbrInnb;
const marketingAgree = response.marketingAgree;
if (mbrInnb !== null) {
openSocialLoginPopup($('input[name="joinMthCd"]').val(), marketingAgree);
// location.replace('/sopmal/mbr/selectJoinCompleteR'+(marketingAgree=='Y'?'?stplatDvCdAts=Y':''));
}
}
});
}
});
}else{
$('#termsForm').attr('method', 'post');
$('#termsForm').attr('action', '<c:url value="/sopmal/mbr/selectJoinForm"/>');
$('#termsForm').submit();
}
}
/* ********************************************************
* 회원 가입 실패
******************************************************** */
const fn_regist_fail = function() {
enableButton('#submit');
}
/* ********************************************************
* 체크박스 값변경
******************************************************** */
const fn_set_checkbox = function(_target) {
if ($(_target).is(':checked')) {
$(_target).parent().find('.termBoolean').val('Y');
$(_target).parent().find('.termDisable').prop('disabled', false);
} else {
$(_target).parent().find('.termBoolean').val('N');
$(_target).parent().find('.termDisable').prop('disabled', true);
}
}
/* ********************************************************
* 약관 팝업 값 설정
******************************************************** */
const fn_set_termPop = function(termNm, index) {
$('#termNm').html('<c:if test="${integrated}">GC ONE </c:if>'+termNm);
$('#termCn').html($('#stplatCn'+index).html());
}
/* ********************************************************
* SNS 소셜 로그인
******************************************************** */
const openSocialLoginPopup = (provider, marketingAgree) => {
var accessUrl = '${accessUrl}';
var redirectUri = '/sopmal/mbr/selectJoinCompleteR'
+ '?joinMthCd='+(provider.length>5?provider.slice(3).toLowerCase():provider.toLowerCase())
+ (marketingAgree=='Y'?'&stplatDvCdAts=Y':'');
var width = 600;
var height = 600;
var left = (screen.width / 2) - (width / 2);
var top = (screen.height / 2) - (height / 2);
var url = '${ssoUrl}/oauth2/authorization/' + provider
+ '?redirect_uri=' + encodeURIComponent(redirectUri) + '&oauth2_type=login&access_url='+ encodeURIComponent(accessUrl);
window.open(url, 'SocialLoginPopup', 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=' + width + ', height=' + height + ', top=' + top + ', left=' + left);
}
const receiveMessage = (event) => {
if(event.origin !== "${ssoUrl}") {
return;
}
if(event.data.type === 'LOGIN_SUCCESS') {
window.location.href = event.data.redirectUrl;
}
}
window.addEventListener('message', receiveMessage, false);
/* ********************************************************
* alert모달 세팅
******************************************************** */
const fn_alert_show = function(content, redirectUri) {
$('#modal-alert-content').text(content);
openModal('modal-alert');
if(redirectUri){
$(".microModal__btn").on("click", function() {
if (typeof redirectUri == 'function') {
redirectUri();
} else if (typeof redirectUri == 'string') {
window.location.href = redirectUri;
}
});
}
}
</script>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<c:set var="terms" value="${resultMap.joinAgreeTerms}" />
<c:set var="sopmalInfo" value="${resultMap.sopmalInfo}" />
<c:set var="integrated" value="${sopmalInfo.sopmalTyCd == '01'}" />
<div class="sub-page">
<div class="signUpTerms">
<c:choose>
<c:when test="${integrated}">
<p class="signUpTerms__agreeText">GC ONE 회원 서비스 이용약관에 동의해 주세요.</p>
<div class="signUpTerms__all">
<div class="b-checkbox-container">
<label class="b-checkbox is-medium checkbox">
<input type="checkbox" value="" id="termCheckAll">
<span class="check"></span>
<span class="control-label">GC ONE 통합회원 전체 동의</span>
</label>
</div>
<div class="signUpTerms__all__description">
<p>통합 회원과 제휴 브랜드의 가입 및 혜택 정보 수신 동의 내용을 확인하고 전체 동의합니다.</p>
<p class="important">※ 선택 항목에 대한 동의를 거부하더라도 통합 회원가입에는 영향을 미치지 않습니다.</p>
<p>단, 미동의 해당 제휴 브랜드는 이용 제한이 있거나 혜택을 받으실 수 없습니다</p>
</div>
</div>
<div class="signUpTerms__gcone">
<a class="signUpTerms__gcone__link" href="">
<p><em>GC ONE</em> 마일리지/ 혜택 통합<br>멤버십 서비스</p>
<svg viewBox="0 0 306 306" xml:space="preserve">
<path d="M0,277.7L28.3,306L266,68.3v131.7h40V0H106.1v40h131.7L0,277.7z"></path>
</svg>
</a>
<p class="signUpTerms__gcone__text">GC ONE은 친환경 제품, 안전성이 검증된 원료로 최고의 품질을 갖춘 브랜드만 제휴합니다.</p>
</div>
</c:when>
<c:otherwise>
<p class="signUpTerms__agreeText">서비스 이용약관에 동의해 주세요.</p>
<div class="signUpTerms__all">
<div class="b-checkbox-container">
<label class="b-checkbox is-large checkbox">
<input type="checkbox" value="" id="termCheckAll">
<span class="check"></span>
<span class="control-label">전체 동의</span>
</label>
</div>
<div class="signUpTerms__all__description">
<p>모두 확인하였으며 동의합니다.</p>
<p>전체 동의에는 필수 및 선택 정보에 대한 동의가 포함되어 있으며, 개별적으로 동의를 선택 하실 수 있습니다.</p>
<p class="important">※ 선택 항목에 대한 동의를 거부하시는 경우에도 서비스 이용이 가능합니다.</p>
</div>
</div>
</c:otherwise>
</c:choose>
<form id="termsForm">
<div class="signUpTerms__misc">
<c:if test="${not empty vo.joinMthCd}">
<input type="hidden" name="joinMthCd" value='<c:out value="${vo.joinMthCd}"/>'>
<input type="hidden" name="extrlIntrlckId" value='<c:out value="${vo.extrlIntrlckId}"/>'>
<input type="hidden" name="mbtlnb" value='<c:out value="${vo.mbtlnb}"/>'>
<input type="hidden" name="mbrNm" value='<c:out value="${vo.mbrNm}"/>'>
<input type="hidden" name="email" value='<c:out value="${vo.email}"/>'>
<input type="hidden" name="sex" value='<c:out value="${vo.sex}"/>'>
<input type="hidden" name="brthDe" value='<c:out value="${vo.brthDe}"/>'>
</c:if>
<c:choose>
<c:when test="${ not empty terms}">
<c:forEach items="${ terms }" var="term" varStatus="status">
<div class="signUpTerms__misc__item">
<div class="b-checkbox-container">
<label class="b-checkbox is-medium checkbox">
<input type="hidden" class="termDisable" name="sopmalStplatInnb" value='<c:out value="${term.sopmalStplatInnb}"/>'>
<input type="hidden" class="termDisable" name="stplatDvCds" value='<c:out value="${term.stplatDvCd}"/>'>
<input type="hidden" class="termDisable termBoolean" name="stplatDvCdAts" value="N">
<input class="termCheck" type="checkbox" <c:if test="${term.essntlAt == 'Y'}">name="essntl"</c:if> onchange="fn_set_checkbox(this);">
<span class="check"></span>
<span class="control-label">
[<c:if test="${term.essntlAt == 'Y'}">필수</c:if><c:if test="${term.essntlAt == 'N'}">선택</c:if>]
${term.cdNm}
</span>
</label>
</div>
<c:if test="${term.cnWritngAt == 'Y'}">
<button class="signUpTerms__misc__detail fullscreen-trigger" onclick="fn_set_termPop('${term.cdNm}', ${status.count}); return false;" data-micromodal-trigger="terms-pop">보기</button>
<div id="stplatCn${status.count}" style="display:none"><c:out value="${term.stplatCn}" escapeXml="false"/></div>
</c:if>
</div>
</c:forEach>
</c:when>
</c:choose>
</div>
</form>
<div class="bottomBtnControls">
<button id="submit" class="btn lg theme" onclick="fn_move_joinC();" disabled>동의하고 가입하기</button>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 서비스 이용약관 동의 -->
<div class="microModal microFullScreen" id="terms-pop" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<div id="termNm"><c:if test="${integrated}">GC ONE </c:if></div>
<button class="microModal__close" aria-label="창 닫기"></button>
</div>
<div class="microModal__content">
<div class="microModal__inner">
<div class="terms_wrap ck-content" id="termCn"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<%--alert 팝업--%>
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title" id="modal-alert-content">Alert 메시지</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button type="button" class="microModal__btn" onclick="closeModal('modal-alert')">
<spring:message code="button.close"/>
</button>
</div>
</div>
</div>
</div>
</body>
</html>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,117 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : JoinAgreeTermsR.jsp
Description : 회원가입(모바일)
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-09-12 이대환 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script type="text/javascript">
$(document).ready(function() {
fn_set_header_title("회원가입");
var urlParams = new URLSearchParams(window.location.search);
urlParams.has('joinMthCd') && $('#joinMthCd').val(urlParams.get('joinMthCd'));
});
/* ********************************************************
* alert모달 세팅
******************************************************** */
const fn_alert_show = function(content) {
$('#modal-alert-content').text(content);
openModal('modal-alert');
}
</script>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<c:set var="sopmalInfo" value="${resultMap.sopmalInfo}" />
<c:set var="integrated" value="${sopmalInfo.sopmalTyCd == '01'}" />
<div class="sub-page">
<div class="signUp">
<div class="signUpComplete">
<div class="signUpComplete__inner">
<img src="/mobile/images/image_signUpComplete.png" alt="">
<div class="signUpComplete__box">
<c:out value='${sopmalInfo.joinComptWords}' escapeXml='false'/>
</div>
<div class="infoBox" style="text-align: center;">
<c:choose>
<c:when test="${StplatDvCdAt == 'Y'}">
<p class="textInfo">회원님은 <fmt:formatDate value="<%= new java.util.Date()%>" pattern="yyyy-MM-dd"/>에 <c:out value='${sopmalInfo.sopmalNm}'/>의 마케팅 정보 수신을 동의하셨습니다.</p>
</c:when>
<c:otherwise>
<p class="textInfo">회원님은 <fmt:formatDate value="<%= new java.util.Date()%>" pattern="yyyy-MM-dd"/>에 <c:out value='${sopmalInfo.sopmalNm}'/>의 마케팅 정보 수신을 거부하셨습니다.</p>
<p class="textInfo"><!--<i class="icon icon_textInfo--sm"></i>-->다양한 혜택 및 서비스를 받으시려면 마케팅 수신 활용에 동의해주시기 바랍니다.</p>
</c:otherwise>
</c:choose>
<input type="hidden" id="joinMthCd" value="general">
</div>
</div>
<div class="bottomBtnControls bottomBtnControls--vertical">
<a href="<c:url value='/index'/>" class="btn xl full outline">쇼핑하러 가기</a>
<c:if test="${!isAuthenticated}">
<a href="<c:url value='/login'/>" class="btn xl full theme">로그인</a>
</c:if>
</div>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<%--alert 팝업--%>
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title" id="modal-alert-content">Alert 메시지</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button type = "button" class="microModal__btn" onclick="closeModal('modal-alert')">
<spring:message code="button.close"/>
</button>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,152 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : JoinGuidanceR.jsp
Description : 회원가입 안내(모바일)
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-09-04 이대환 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function() {
fn_set_header_title("회원가입");
let signUpPromo = $('.signUp-promotion__col-3.ck-content');
let figureTable = signUpPromo.find('figure.table');
if(figureTable.length == 4){
signUpPromo.removeClass('signUp-promotion__col-3').addClass('signUp-promotion__col-2');
}
});
/* ********************************************************
* SNS 소셜 로그인
******************************************************** */
// 웹뷰 환경 감지 함수 추가
function isWebView() {
const ua = navigator.userAgent.toLowerCase();
return ua.includes('wv') ||
ua.includes('webview') ||
window.ReactNativeWebView !== undefined ||
(window.webkit && window.webkit.messageHandlers);
}
const openSocialLoginPopup = (provider) => {
var accessUrl = '${accessUrl}';
var redirectUri = accessUrl + '/sopmal/mbr/selectJoinAgreeTermsForm';
var width = 600;
var height = 600;
var left = (screen.width / 2) - (width / 2);
var top = (screen.height / 2) - (height / 2);
var url = '${ssoUrl}/oauth2/authorization/' + $('#sopmalCd').val() + "-" + provider
+ '?redirect_uri=' + encodeURIComponent(redirectUri) + '&oauth2_type=join&access_url='+ encodeURIComponent(accessUrl);
// 웹뷰 환경 체크 후 분기 처리
if (isWebView()) {
console.log('웹뷰 환경');
// 웹뷰에서는 현재 창에서 직접 이동
window.location.href = url;
} else {
console.log('일반 브라우저 환경');
// 일반 브라우저에서는 팝업 창으로 열기
window.open(url, 'SocialLoginPopup', 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=' + width + ', height=' + height + ', top=' + top + ', left=' + left);
}
}
const receiveMessage = (event) => {
if(event.origin !== "${ssoUrl}") {
return;
}
if(event.data.type === 'LOGIN_SUCCESS') {
var tempForm = $('<form>', {
method: 'post',
action: event.data.redirectUrl
});
$.each(event.data, function(key, value) {
$('<input>', {
type: 'hidden',
name: key,
value: value
}).appendTo(tempForm);
});
tempForm.appendTo('body');
tempForm.submit();
tempForm.remove();
}
}
window.addEventListener('message', receiveMessage, false);
</script>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<c:set var="sopmalInfo" value="${resultMap.sopmalInfo}" />
<c:set var="integrated" value="${sopmalInfo.sopmalTyCd == '01'}" />
<input type="hidden" id="sopmalCd" value="<c:out value="${sopmalInfo.sopmalCd}"/>">
<div class="sub-page">
<div class="signUp-promotion">
<div class="sub-box">
<div class="signUp-promotion__introBoxWrapper">
<div class="signUp-promotion__introBox ck-content">
<c:out value='${sopmalInfo.joinGuidanceWords}' escapeXml='false'/>
</div>
</div>
<c:if test="${!isAuthenticated}">
<div class="signUpLink">
<a href="<c:url value='/sopmal/mbr/selectJoinAgreeTermsForm'/>" class="btn lg theme">바로 가입 할래요</a>
<%--<a class="btn lg outline" onclick="$('html, body').animate({scrollTop: $('.signUp-promotion__section').offset().top}, 0);return false;" style="cursor: pointer;">가입시 혜택부터 볼래요</a>--%>
<div class="login__sns">
<c:if test="${sopmalInfo.kakaoIntrlckAt == 'Y'}"><button class="login__sns__btn kakao" onclick="openSocialLoginPopup('KAKAO');"><i class="icon icon_kakaoLogin"></i>카카오로 회원가입</button></c:if>
<c:if test="${sopmalInfo.naverIntrlckAt == 'Y'}"><button class="login__sns__btn naver" onclick="openSocialLoginPopup('NAVER');"><i class="icon icon_naverLogin"></i>네이버로 회원가입</button></c:if>
</div>
</div>
</c:if>
</div>
<div class="sub-box">
<div class="signUp-promotion__section">
<h5 class="signUp-promotion__section__title"><c:if test="${integrated}">GC ONE (통합 회원) </c:if>주요 혜택</h5>
<div class="signUp-promotion__col-3 ck-content">
<c:out value='${sopmalInfo.joinBnef}' escapeXml='false'/>
</div>
</div>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,46 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : MbrMarktAgreePopupR.jsp
Description : 마케팅 수신동의 팝업
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2025-02-08 유재현 최초 생성
--%>
<div id="mbrMarktClauseAgreePopup" class="microModal microAlert" aria-modal="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<div class="modal-header__title" id = "mbrMarktClauseAgree-sj">
<c:forEach var="stplat" items="${resultMap.stplat}">
<c:if test="${stplat.cd eq '05'}">
<c:out value="${stplat.cdNm}"/>
</c:if>
</c:forEach>
</div>
<button type="button" class="microModal__close" data-micromodal-close aria-label="창 닫기" onclick="closeModal('mbrMarktClauseAgreePopup')"></button>
</div>
<div class="microModal__content ck-content">
<c:forEach var="clauseList" items="${resultMap.clauseList}" varStatus="staus">
<c:if test="${staus.first}">
${clauseList.stplatCn}
</c:if>
</c:forEach>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" id="globalMbrMarktAgreeAt-Y" name="globalMbrMarktAgreeAt">동의</button>
<button class="microModal__btn" id="globalMbrMarktAgreeAt-N" name="globalMbrMarktAgreeAt">비동의</button>
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,379 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : PosJoinAgreeTermsR.jsp
Description : 회원가입 약관(POS)
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-12-27 이대환 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function() {
fn_set_header_title("회원가입");
$('#termCheckAll').prop('checked', false);
/* ********************************************************
* 약관 전체동의
******************************************************** */
$('#termCheckAll').click(function () {
if ($('#termCheckAll').is(':checked')) {
$('.termCheck').prop('checked', true);
$('[name=stplatDvCdAts]').val('Y');
} else {
$('.termCheck').prop('checked', false);
$('[name=stplatDvCdAts]').val('N');
}
if ($('[name="essntl"]:not(:checked)').length > 0) {
$('#submit').prop('disabled', true);
} else {
$('#submit').prop('disabled', false);
}
});
$('.termCheck').click(function () {
if($('.termCheck:not(:checked)').length == 0) {
$('#termCheckAll').prop('checked', true);
} else {
$('#termCheckAll').prop('checked', false);
}
if ($('[name="essntl"]:not(:checked)').length > 0) {
$('#submit').prop('disabled', true);
} else {
$('#submit').prop('disabled', false);
}
});
/* ********************************************************
* 모달 배경화면 스크롤 방지
******************************************************** */
MicroModal.init({
disableScroll: true,
awaitCloseAnimation: true,
});
/* ********************************************************
* 풀스크린 팝업 이벤트 리스너
******************************************************** */
$('.fullscreen-trigger').on('click', function (e) {
e.preventDefault();
var modalId = $(this).attr('data-micromodal-trigger');
openModal(modalId);
});
$('.microModal .microModal__close').on('click', function () {
var modalId = $(this).closest('.microModal').attr('id');
closeModal(modalId);
});
window.addEventListener('popstate', function (event) {
var modalId = window.location.hash.replace('#', '');
if (modalId) {
closeModal(modalId);
} else {
$('.microModal').each(function () {
MicroModal.close($(this).attr('id'));
});
}
document.body.style.overflow = '';
});
if (window.location.hash) {
var modalId = window.location.hash.replace('#', '');
openModal(modalId);
}
});
/* ********************************************************
* 회원가입 화면으로 이동
******************************************************** */
const fn_move_joinC = function() {
if ($('input[name="joinMthCd"]').length) {
if(!confirm('회원가입을 <spring:message code="confirm.common.predicate"/>')) return;
let params = $('#termsForm').serialize();
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectMbrwithdrawalSearch"/>',
data : params,
success : function(result) {
let mbrWithDrawalList = JSON.parse(result.resBody.result).mbrWithDrawalList;
if(mbrWithDrawalList.length > 0) {
params = params + '&' + $.param({'extMember': mbrWithDrawalList[0].mbrInnb});
}
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/insertUsrJoinRegist"/>',
data : params,
success : function (result) {
let mbrInnb = JSON.parse(result.resBody.result).mbrInnb;
let marketingAgree = JSON.parse(result.resBody.result).marketingAgree;
if (mbrInnb !== null) {
openSocialLoginPopup($('input[name="joinMthCd"]').val(), marketingAgree);
// location.replace('/sopmal/mbr/selectJoinCompleteR'+(marketingAgree=='Y'?'?stplatDvCdAts=Y':''));
}
}
});
}
});
}else{
const urlParams = new URLSearchParams(window.location.search);
if(urlParams.has('code') && urlParams.has('storeCode')){
$('<input>', {
type: 'hidden',
name: 'code',
value: urlParams.get('code')
}).appendTo('#termsForm');
$('<input>', {
type: 'hidden',
name: 'storeCode',
value: urlParams.get('storeCode')
}).appendTo('#termsForm');
}else{
alert("올바르지 않은 가입 요청입니다.")
return;
}
$('#termsForm').attr('method', 'post');
$('#termsForm').attr('action', '<c:url value="/sopmal/mbr/selectPosJoinForm"/>');
$('#termsForm').submit();
}
}
/* ********************************************************
* 체크박스 값변경
******************************************************** */
const fn_set_checkbox = function(_target) {
if ($(_target).is(':checked')) {
$(_target).parent().find('.termBoolean').val('Y');
$(_target).parent().find('.termDisable').prop('disabled', false);
} else {
$(_target).parent().find('.termBoolean').val('N');
$(_target).parent().find('.termDisable').prop('disabled', true);
}
}
/* ********************************************************
* 약관 팝업 값 설정
******************************************************** */
const fn_set_termPop = function(termNm, index) {
$('#termNm').html('<c:if test="${integrated}">GC ONE </c:if>'+termNm);
$('#termCn').html($('#stplatCn'+index).html());
}
/* ********************************************************
* SNS 소셜 로그인
******************************************************** */
const openSocialLoginPopup = (provider, marketingAgree) => {
var accessUrl = '${accessUrl}';
var redirectUri = '/sopmal/mbr/selectJoinCompleteR'
+ '?joinMthCd='+(provider.length>5?provider.slice(3).toLowerCase():provider.toLowerCase())
+ (marketingAgree=='Y'?'&stplatDvCdAts=Y':'');
var width = 600;
var height = 600;
var left = (screen.width / 2) - (width / 2);
var top = (screen.height / 2) - (height / 2);
var url = '${ssoUrl}/oauth2/authorization/' + provider
+ '?redirect_uri=' + encodeURIComponent(redirectUri) + '&oauth2_type=login&access_url='+ encodeURIComponent(accessUrl);
window.open(url, 'SocialLoginPopup', 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=' + width + ', height=' + height + ', top=' + top + ', left=' + left);
}
const receiveMessage = (event) => {
if(event.origin !== "${ssoUrl}") {
return;
}
if(event.data.type === 'LOGIN_SUCCESS') {
window.location.href = event.data.redirectUrl;
}
}
window.addEventListener('message', receiveMessage, false);
</script>
<style>
.content-wrap {
padding-top: 0px;
}
</style>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<%-- <header class="header header--sub">--%>
<%-- <jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>--%>
<%-- </header>--%>
<!-- 헤더 영역(POS 간편가입 전용) -->
<header>
<div class="header__wrapper">
<div class="header__controls-wrapper">
<div class="header__controls">
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<img src="${ cdnurl }${ topBarInfo.topbar.topFilCours }/${ topBarInfo.topbar.topSysFilNm }" alt="<c:out value="${sopmallInfo.shopInfo.sopmalNm}"/>">
<b>${resultMap.posStoreInfo.tentcpnNm}</b>
</div>
</div>
</div>
</header>
<!-- 하단 탭바 -->
<%-- <jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>--%>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<c:set var="terms" value="${resultMap.joinAgreeTerms}" />
<c:set var="sopmalInfo" value="${resultMap.sopmalInfo}" />
<c:set var="integrated" value="${sopmalInfo.sopmalTyCd == '01'}" />
<div class="sub-page">
<div class="signUpTerms">
<c:choose>
<c:when test="${integrated}">
<p class="signUpTerms__agreeText">GC ONE 회원 서비스 이용약관에 동의해 주세요.</p>
<div class="signUpTerms__all">
<div class="b-checkbox-container">
<label class="b-checkbox is-medium checkbox">
<input type="checkbox" value="" id="termCheckAll">
<span class="check"></span>
<span class="control-label">GC ONE 통합회원 전체 동의</span>
</label>
</div>
<div class="signUpTerms__all__description">
<p>통합 회원과 제휴 브랜드의 가입 및 혜택 정보 수신 동의 내용을 확인하고 전체 동의합니다.</p>
<p class="important">※ 선택 항목에 대한 동의를 거부하더라도 통합 회원가입에는 영향을 미치지 않습니다.</p>
<p>단, 미동의 해당 제휴 브랜드는 이용 제한이 있거나 혜택을 받으실 수 없습니다</p>
</div>
</div>
<div class="signUpTerms__gcone">
<a class="signUpTerms__gcone__link" href="">
<p><em>GC ONE</em> 마일리지/ 혜택 통합<br>멤버십 서비스</p>
<svg viewBox="0 0 306 306" xml:space="preserve">
<path d="M0,277.7L28.3,306L266,68.3v131.7h40V0H106.1v40h131.7L0,277.7z"></path>
</svg>
</a>
<p class="signUpTerms__gcone__text">GC ONE은 친환경 제품, 안전성이 검증된 원료로 최고의 품질을 갖춘 브랜드만 제휴합니다.</p>
</div>
</c:when>
<c:otherwise>
<p class="signUpTerms__agreeText">서비스 이용약관에 동의해 주세요.</p>
<div class="signUpTerms__all">
<div class="b-checkbox-container">
<label class="b-checkbox is-large checkbox">
<input type="checkbox" value="" id="termCheckAll">
<span class="check"></span>
<span class="control-label">전체 동의</span>
</label>
</div>
<div class="signUpTerms__all__description">
<p>모두 확인하였으며 동의합니다.</p>
<p>전체 동의에는 필수 및 선택 정보에 대한 동의가 포함되어 있으며, 개별적으로 동의를 선택 하실 수 있습니다.</p>
<p class="important">※ 선택 항목에 대한 동의를 거부하시는 경우에도 서비스 이용이 가능합니다.</p>
</div>
</div>
</c:otherwise>
</c:choose>
<form id="termsForm">
<div class="signUpTerms__misc">
<c:if test="${not empty vo.joinMthCd}">
<input type="hidden" name="joinMthCd" value='<c:out value="${vo.joinMthCd}"/>'>
<input type="hidden" name="extrlIntrlckId" value='<c:out value="${vo.extrlIntrlckId}"/>'>
<input type="hidden" name="mbtlnb" value='<c:out value="${vo.mbtlnb}"/>'>
<input type="hidden" name="mbrNm" value='<c:out value="${vo.mbrNm}"/>'>
<input type="hidden" name="email" value='<c:out value="${vo.email}"/>'>
<input type="hidden" name="sex" value='<c:out value="${vo.sex}"/>'>
<input type="hidden" name="brthDe" value='<c:out value="${vo.brthDe}"/>'>
</c:if>
<c:choose>
<c:when test="${ not empty terms}">
<c:forEach items="${ terms }" var="term" varStatus="status">
<div class="signUpTerms__misc__item">
<div class="b-checkbox-container">
<label class="b-checkbox is-medium checkbox">
<input type="hidden" class="termDisable" name="sopmalStplatInnb" value='<c:out value="${term.sopmalStplatInnb}"/>'>
<input type="hidden" class="termDisable" name="stplatDvCds" value='<c:out value="${term.stplatDvCd}"/>'>
<input type="hidden" class="termDisable termBoolean" name="stplatDvCdAts" value="N">
<input class="termCheck" type="checkbox" <c:if test="${term.essntlAt == 'Y'}">name="essntl"</c:if> onchange="fn_set_checkbox(this);">
<span class="check"></span>
<span class="control-label">
[<c:if test="${term.essntlAt == 'Y'}">필수</c:if><c:if test="${term.essntlAt == 'N'}">선택</c:if>]
${term.cdNm}
</span>
</label>
</div>
<c:if test="${term.cnWritngAt == 'Y'}">
<button class="signUpTerms__misc__detail fullscreen-trigger" onclick="fn_set_termPop('${term.cdNm}', ${status.count}); return false;" data-micromodal-trigger="terms-pop">보기</button>
<div id="stplatCn${status.count}" style="display:none"><c:out value="${term.stplatCn}" escapeXml="false"/></div>
</c:if>
</div>
</c:forEach>
</c:when>
</c:choose>
</div>
</form>
<div class="bottomBtnControls">
<button id="submit" class="btn lg theme" onclick="fn_move_joinC();" disabled>동의하고 가입하기</button>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 서비스 이용약관 동의 -->
<div class="microModal microFullScreen" id="terms-pop" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<div id="termNm"><c:if test="${integrated}">GC ONE </c:if></div>
<button class="microModal__close" aria-label="창 닫기"></button>
</div>
<div class="microModal__content">
<div class="microModal__inner">
<div class="terms_wrap ck-content" id="termCn"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,993 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : PosJoinC.jsp
Description : 회원가입(POS)
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-12-23 이대환 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function() {
fn_set_header_title("회원가입");
fn_set_birthYears();
fn_set_birthMonths();
fn_show_phoneAuth();
fn_check_stplat();
fn_fmt_telno($("#mbtlnb"));
first = 0;
$(".userForm__inputBox__alertText").hide();
fn_alert_hide($("#mbrNm"), $("#mbrNmAlert"));
fn_alert_hide($("#mbtlnb"), $("#mbtlnbAlert"));
fn_alert_hide($("#mbtlCert"), $("#mbtlCertAlert"));
fn_alert_hide($("#mbrId"), $("#mbrIdAlert"), 'id');
fn_alert_hide($("#mbrPassword"), $("#mbrPasswordAlert"), 'pw');
fn_alert_hide($("#mbrPasswordChk"), $("#mbrPasswordChkAlert"), 'pw');
fn_alert_hide($("#id"), $("#emailAlert"));
fn_alert_hide($('input[name="sex"]'), $("#sexAlert"));
fn_alert_hide($("#dtlAdres"), $("#postcodeAlert"));
fn_alert_hide_selected();
$('button').on('click', function(e) {
e.preventDefault();
});
$('#regForm').on('keydown', function(e) {
if (e.keyCode == 13) {
e.preventDefault();
}
});
$('#mbrNm').on('keydown', function(e) {
if (e.keyCode == 13) {
$('#phoneAuthBtn').click();
}
});
$('#mbtlnb').on('keydown', function(e) {
if (e.keyCode == 13) {
$('#phoneAuthBtn').click();
}
});
$('#mbtlCert').on('keydown', function(e) {
if (e.keyCode == 13) {
fn_confim_own();
}
});
$('#mbrId').on('keydown', function(e) {
if (e.keyCode == 13) {
fn_check_mbrid();
}
});
/* ********************************************************
* 모달 배경화면 스크롤 방지
******************************************************** */
MicroModal.init({
disableScroll: true,
awaitCloseAnimation: true,
});
/* ********************************************************
* 풀스크린 팝업 이벤트 리스너
******************************************************** */
$('.fullscreen-trigger').on('click', function (e) {
e.preventDefault();
var modalId = $(this).attr('data-micromodal-trigger');
openModal(modalId);
});
$('.microModal .microModal__close').on('click', function () {
var modalId = $(this).closest('.microModal').attr('id');
closeModal(modalId);
});
window.addEventListener('popstate', function (event) {
var modalId = window.location.hash.replace('#', '');
if (modalId) {
closeModal(modalId);
} else {
$('.microModal').each(function () {
MicroModal.close($(this).attr('id'));
});
}
document.body.style.overflow = '';
});
if (window.location.hash) {
var modalId = window.location.hash.replace('#', '');
openModal(modalId);
}
});
/* ********************************************************
* 약관동의 체크
******************************************************** */
const fn_check_stplat = function() {
if(!$('input[name="sopmalStplatInnb"]').val()){
fn_alert_show('약관 동의 처리에 문제가 발생했습니다. 다시 시도해 주세요.', fn_move_mainPage);
return true;
}
}
/* ********************************************************
* domain 넣기
******************************************************** */
const fn_set_domain = function(_value) {
$('#emailSelectBtn').text(_value);
$('.microModal__close').click();
}
/* ********************************************************
* email 합치기
******************************************************** */
const fn_make_email = function() {
let domain = $('input[name="emailSelect"]:checked').val();
let id = $('#id').val().trim();
$('[name=email]').val(domain == '직접입력' ? id : id + domain);
return $('[name=email]').val();
}
/* ********************************************************
* 생년월일 합치기
******************************************************** */
const fn_make_brthDe = function() {
var year = $('#select-brthYear').val();
var month = ($('#select-Month').val()< 10 ? '0' : '') + $('#select-Month').val();
$('[name=brthDe]').val(year + month + '01');
}
/* ********************************************************
* 전화번호 하이픈 제거
******************************************************** */
const fn_make_mbtlnb = function() {
var mbtlnb = $('#mbtlnb').val();
$('[name=mbtlnb]').val(mbtlnb.trim().replace(/-/g, ''));
}
/* ********************************************************
* password check
******************************************************** */
const fn_check_password = function() {
var regular = /^((?=.*[a-zA-Z])(?=.*\d|.*\W)|(?=.*\d)(?=.*\W))[a-zA-Z\d\W]{10,20}$/;
let mbrPassword = $('#mbrPassword');
let mbrPasswordChk = $('#mbrPasswordChk');
let mbrId = $('#mbrId');
if(!regular.test(mbrPassword.val())){
mbrPassword.focus();
fn_alert_show('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
return;
}
if(!regular.test(mbrPasswordChk.val())){
mbrPasswordChk.focus();
fn_alert_show('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
return;
}
if (mbrPassword.val() !== mbrPasswordChk.val()) {
mbrPassword.focus();
fn_alert_show('비밀번호가 일치하지 않습니다.');
return;
}
if (mbrPassword.val() == mbrId.val()) {
mbrPassword.focus();
fn_alert_show('비밀번호는 아이디와 동일할 수 없습니다.');
return;
}
return true;
}
/**********************************************
* 이메일 형식 유효성 체크 (올바른 이메일 형식일 때 True)
***********************************************/
const fn_check_email = function() {
let mbrEmail = fn_make_email();
var regular = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/i;
if(regular.test(mbrEmail)){
return true;
}else{
return false;
}
}
/* ********************************************************
* 우편번호 찾기
******************************************************** */
const fn_set_postcode = function(_data) {
$('#adresDv').val(_data.addressType)
$('#postcode').val(_data.postcode);
$('#address').val(_data.addressType == '01' ? _data.roadAddress : _data.jibunAddress);
}
/* ********************************************************
* 생년 콤보박스
******************************************************** */
const fn_set_birthYears = function() {
const selectYear = '<c:out value="${resultMap.posMbrInfo.birthYear}"/>'
let date = new Date();
let year = date.getFullYear();
let combo = '';
combo ='<select name="brthYear" id="select-brthYear" title="생년">';
combo +=' <option value="" selected disabled>년</option>';
for (let y = year - 14; y >= year - 101; y--) {
if(!fn_is_empty(selectYear) && parseInt(selectYear) === y){
combo +=' <option selected value="' + y + '">' + y + ' 년' + '</option>';
}else{
combo +=' <option value="' + y + '">' + y + ' 년' + '</option>';
}
}
combo +='</select>';
$('#birthYear').html(combo);
$('#select-brthYear').niceSelect();
}
/* ********************************************************
* 생월 콤보박스
******************************************************** */
const fn_set_birthMonths = function() {
const selectMonth = '<c:out value="${resultMap.posMbrInfo.birthMonth}"/>'
let combo = '';
combo ='<select name="brthMonth" id="select-Month" title="생월">';
combo +=' <option value="" selected disabled>월</option>';
for (let m = 1; m < 13; m++) {
if(!fn_is_empty(selectMonth) && parseInt(selectMonth) === m){
combo +=' <option selected value="' + m + '">' + m + ' 월' + '</option>';
}else{
combo +=' <option value="' + m + '">' + m + ' 월' + '</option>';
}
}
combo +='</select>';
$('#birthMonth').html(combo);
$('#select-Month').niceSelect();
}
/* ********************************************************
* 휴대폰 인증 카운터
******************************************************** */
let seconds;
let countdown;
let timerRunning = false;
const fn_set_timeOut = function() {
if (seconds >= 0) {
const minutes = Math.floor(seconds / 60).toString().padStart(2, '0');
const remainingSeconds = (seconds % 60).toString().padStart(2, '0');
$('#timer').text(minutes+":"+remainingSeconds);
seconds--;
} else {
fn_stop_timer();
fn_alert_show('인증번호 유효시간이 만료되었습니다.');
}
}
/* ********************************************************
* 휴대폰 인증 번호 발송
******************************************************** */
first = 0;
mbtlCert = '';
const fn_sending_number = function() {
if(timerRunning){
return;
}
if(mbtlCert === $('#mbtlnb').val()){
first++;
}else{
first = 0;
}
mbtlCert = $('#mbtlnb').val();
let mbrNm = $('#mbrNm').val();
let mbtlnb = $('#mbtlnb').val().trim().replace(/-/g, '');
let params = {
'mbrNm' : mbrNm,
'mbtlnb': mbtlnb
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/insertPhoneAuth"/>',
data : params,
success : function (Data) {
let result = JSON.parse(Data.resBody.result);
if(result.result == "success"){
if (first > 0) {
fn_alert_show('인증번호가 재발송되었습니다.');
} else if (first === 0) {
fn_alert_show('인증번호가 발송되었습니다.');
first++;
} else {
return;
}
$('#sndngInnb').val(result.sndngInnb);
}else {
fn_alert_show('인증번호 발송에 실패했습니다.');
fn_stop_timer();
return;
}
}
});
$('#mbrNm').attr("readonly", true);
$('#mbtlnb').attr("readonly", true);
clearInterval(countdown);
seconds = 180;
fn_set_timeOut();
countdown = setInterval(fn_set_timeOut, 1000);
timerRunning = true;
}
/* ********************************************************
* 타이머 정지 함수
******************************************************** */
const fn_stop_timer = function() {
if (timerRunning) {
clearInterval(countdown);
$('#timer').text('03:00');
$('#mbtlCert').val('');
$('#phoneAuthContent').hide();
$('#mbrNm').attr("readonly", false);
// $('#mbtlnb').attr("readonly", false);
timerRunning = false;
}
}
/* ********************************************************
* 휴대폰 인증 확인
******************************************************** */
isChkd_own = false;
const fn_confim_own = function() {
if (first <= 0) return;
let sndngInnb = $('#sndngInnb').val();
let mbtlnb = $('#mbtlnb').val().trim().replace(/-/g, '');
let crtnb = $('#mbtlCert').val();
fn_stop_timer();
let params = {
'sndngInnb': sndngInnb,
'mbtlnb': mbtlnb,
'crtnb' : crtnb
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectPhoneAuth"/>',
data : params,
success : function (Data) {
let result = JSON.parse(Data.resBody.result);
if(result.result == "success"){
fn_alert_show('인증되었습니다.');
$('#phoneAuthOkBtn').show();
$('#phoneAuthBtn').hide();
isChkd_own = true;
//TODO : 메서드명 변경 필요 탈퇴회원 → 기존가입여부
fn_check_mbrwithdrawal();
$('#mbrNm').attr("readonly", true);
$('#mbtlnb').attr("readonly", true);
}else {
fn_alert_show('인증번호가 일치하지 않습니다.');
return;
}
}
});
}
/* ********************************************************
* 기존 가입 여부 조회
******************************************************** */
const fn_check_mbrwithdrawal = function() {
let mbrNm = $('#mbrNm').val().trim();
$('#mbrNm').val(mbrNm);
let mbtlnb = $('#mbtlnb').val().trim().replace(/-/g, '');
let params = {
'mbrNm' : mbrNm,
'mbtlnb': mbtlnb
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectMbrwithdrawalSearch"/>',
data : params,
success : function(result) {
let mbrWithDrawalList = JSON.parse(result.resBody.result).mbrWithDrawalList;
fn_make_rejoinInforList(mbrWithDrawalList);
}
});
}
/* ********************************************************
* 기존 가입 내역
******************************************************** */
const fn_make_rejoinInforList = function(_data) {
let tbodyClone;
let isExtMember = false;
let snsMemberCnt = 0;
if (_data.length > 0) {
let extMember = _data[0].mbrInnb;
var sopmalNm = '<c:out value="${ resultMap.sopmalInfo.sopmalNm }"/>';
// $('#rejoinContainer').show();
for (let i = 0; i < _data.length; i++) {
if (_data[i].extrlIntrlckDv != 'pos' || sopmalNm != _data[i].brand) {
snsMemberCnt++;
isExtMember = true;
tbodyClone +='<tr>';
tbodyClone +=' <td style="display : none;">' + _data[i].mbrInnb + '</td>';
tbodyClone +=' <td>' + _data[i].brand + '</td>';
tbodyClone +=' <td>' + _data[i].extrlIntrlckDv + '</td>';
tbodyClone +=' <td>' + _data[i].emailAdres + '</td>';
tbodyClone +='</tr>';
break;
} else {
$('#rejoinContainer').hide();
fn_alert_show('이미 가입된 정보입니다. 고객센터에 문의해 주세요.');
snsMemberCnt = 0;
isExtMember = false;
// window.location.href = '<c:out value="${issuerUri}"/>/index';
// window.location.href = '/login';
}
}
tbodyClone +='<tr style="display:none;"><td><input type="text" name="extMember" value="'+_data[0].mbrInnb+'"/></td></tr>';
$('#rejoinSelect').html(tbodyClone);
if(snsMemberCnt > 1){
$('#rejoinSelect tr').each(function() {
if (!($(this).find('input[name="extMember"]').length) && $(this).find('td').eq(0).text().trim() !== String(extMember)) {
$(this).remove();
}
});
// window.location.href = '<c:out value="${issuerUri}"/>/index';
// window.location.href = '/login';
}
if (isExtMember) {
// fn_alert_show('인증되었습니다. 인증하신 정보로 가입된 계정 정보가 있습니다. 계정정보 연동을 진행합니다.');
// $('#mbrNm').attr("readonly", true);
// $('#mbtlnb').attr("readonly", true);
// $('#phoneAuthOkBtn').show();
// $('#phoneAuthBtn').hide();
// isChkd_own = true;
$('#rejoinContainer').hide();
fn_alert_show('이미 가입된 정보입니다. 고객센터에 문의해 주세요.');
snsMemberCnt = 0;
isExtMember = false;
}
}else {
fn_alert_show('인증되었습니다.');
$('#mbrNm').attr("readonly", true);
$('#mbtlnb').attr("readonly", true);
$('#phoneAuthOkBtn').show();
$('#phoneAuthBtn').hide();
isChkd_own = true;
}
}
/* ********************************************************
* 회원 가입
******************************************************** */
const fn_regist_member = function() {
disableButton('#registBtn');
if(fn_check_stplat()) {
fn_regist_fail();
return;
};
if (!isChkd_own) {
$('#mbtlnb').focus();
fn_alert_show('휴대폰 인증을 해주세요.');
fn_regist_fail();
return;
}
// if (!isChkd_Dup) {
// $('#mbrId').focus();
// fn_alert_show('아이디 중복 확인을 해주세요.');
// fn_regist_fail();
// return;
// }
//
// if(!fn_check_password()) {
// fn_regist_fail();
// return;
// }
// if(!fn_check_email()) {
// $('#id').focus();
// fn_alert_show('올바른 이메일 형식이 아닙니다.');
// fn_regist_fail();
// return;
// }
if ($('#select-brthYear').val() == null || $('#select-Month').val() == null) {
document.getElementById('birthYear').scrollIntoView();
fn_alert_show('생년월을 선택해 주세요.');
$("#brthDeAlert").show();
fn_regist_fail();
return;
}
if ($('input[name="sex"]:checked').val() == null) {
$('#men').focus();
fn_alert_show('성별을 선택해 주세요.');
$("#sexAlert").show();
fn_regist_fail();
return;
}
// if ($('#postcode').val().trim() == '' || $('#address').val().trim() == '') {
// document.getElementById('postcodeBtn').scrollIntoView();
// fn_alert_show('우편번호를 선택해 주세요.');
// $("#postcodeAlert").show();
// fn_regist_fail();
// return;
// }
//
// if ($('#dtlAdres').val().trim() == '') {
// $('#dtlAdres').focus();
// fn_alert_show('상세주소를 입력해 주세요.');
// fn_regist_fail();
// return;
// }
if(!confirm('회원가입을 <spring:message code="confirm.common.predicate"/>')){
fn_regist_fail();
return;
}
fn_make_brthDe();
fn_make_mbtlnb();
let params = $('#regForm').serialize();
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/insertUsrJoinRegist"/>',
data : params,
success : function (result) {
let mbrInnb = JSON.parse(result.resBody.result).mbrInnb;
let marketingAgree = JSON.parse(result.resBody.result).marketingAgree;
if (mbrInnb !== null) {
// fn_alert_show($('#registType').val()+'에 가입되었습니다.');
location.replace('/sopmal/mbr/selectPosJoinCompleteR'
+'?storeCode='+'<c:out value='${resultMap.posStoreInfo.posCdDvVal}${resultMap.posStoreInfo.posCdPassivInputVal}'/>'
+(marketingAgree=='Y'?'&stplatDvCdAts=Y':''));
}
}
});
}
/* ********************************************************
* 회원 가입 실패
******************************************************** */
const fn_regist_fail = function() {
enableButton('#registBtn');
}
/* ********************************************************
* 아이디 중복 확인
******************************************************** */
dupList = [];
isChkd_Dup = false;
const fn_check_mbrid = function() {
var regular = /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z\d_]{6,20}$/;
let mbrid = $('#mbrId').val().trim();
$('#mbrId').val(mbrid);
if(!regular.test(mbrid)) {
fn_alert_show('아이디는 공백없는 영문, 숫자, 밑줄 포함 6~20자 조합만 사용 가능합니다.');
return
}
if(!isChkd_Dup) {
let params = {
'mbrId' : mbrid
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectIdDplctCnfirm"/>',
data : params,
success : function(data) {
if (JSON.parse(data.resBody.result).message === 'impossible'){
fn_alert_show('\"' + mbrid + '\" 은 이용중인 아이디 입니다.');
dupList.push(mbrid);
$("#mbrIdAlert").html('이미 사용중인 아이디입니다.');
$("#mbrIdAlert").show();
}
if (JSON.parse(data.resBody.result).message === 'possible'){
isChkd_Dup = true;
fn_alert_show('\"' + mbrid + '\" 은 사용 가능합니다.');
$("#mbrId").attr("readonly", true);
}
}
});
}
}
/* ********************************************************
* 휴대폰 인증 버튼 클릭시, 휴대폰 인증 박스 노출
******************************************************** */
const fn_show_phoneAuth = function() {
let phoneAuthBtn = $('#phoneAuthBtn');
let phoneAuthContent = $('#phoneAuthContent');
phoneAuthContent.hide();
phoneAuthBtn.click(function () {
if(!$('#mbrNm').val()){
$('#mbrNm').focus();
fn_alert_show('이름을 입력해 주세요.');
return;
}else if(!$('#mbtlnb').val()){
$('#mbtlnb').focus();
fn_alert_show('휴대폰 번호를 입력해 주세요.');
return;
}
// $('#phoneAuthContent').show();
// $('#mbtlCert').focus();
// fn_sending_number();
fn_check_mbrwithdrawal()
});
}
/* ********************************************************
* 메인화면 이동(뒤로 가기))
******************************************************** */
const fn_move_mainPage = function() {
history.back();
if(history.length <= 1){
window.close();
}
}
/* ********************************************************
* 사용자 입력값이 입력될 때 alertText 숨기기
******************************************************** */
const fn_alert_hide = (inputId, alertId, type) => {
inputId.on('input', function () {
switch(type){
case 'id':
var regular = /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z\d_]{6,20}$/;
if (!$(this).val()) {
alertId.html('아이디를 입력해 주세요.');
}else if(dupList.includes(inputId.val())){
alertId.html('이미 사용중인 아이디입니다.');
alertId.show();
return;
}else if(!regular.test(inputId.val())){
alertId.html('아이디는 공백없는 영문, 숫자, 밑줄 포함 6~20자 조합만 사용 가능합니다.');
alertId.show();
return;
}
break;
case 'pw':
var regular = /^((?=.*[a-zA-Z])(?=.*\d|.*\W)|(?=.*\d)(?=.*\W))[a-zA-Z\d\W]{10,20}$/;
if (!$(this).val()) {
alertId.html('비밀번호를 입력해 주세요.');
}else if(!regular.test(inputId.val())){
alertId.html('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
alertId.show();
return;
}
break;
default:
break;
}
alertId.hide();
if (!$(this).val()) {
alertId.show();
}
})
};
/* ********************************************************
* 사용자 입력값이 입력될 때 alertText 숨기기
******************************************************** */
const fn_alert_hide_selected = () => {
let birthSelected = false;
$("#birthYear").on('change', function() {
if(birthSelected){
$("#brthDeAlert").hide();
}
birthSelected = true;
})
$("#birthMonth").on('change', function() {
if(birthSelected){
$("#brthDeAlert").hide();
}
birthSelected = true;
})
}
/* ********************************************************
* alert모달 세팅
******************************************************** */
const fn_alert_show = function(content, redirectUri) {
$('#modal-alert-content').text(content);
openModal('modal-alert');
if(redirectUri){
$(".microModal__btn").on("click", function() {
if (typeof redirectUri == 'function') {
redirectUri();
} else if (typeof redirectUri == 'string') {
window.location.href = redirectUri;
}
});
}
}
</script>
<style>
.content-wrap {
padding-top: 0px;
}
</style>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<%-- <header class="header header--sub">--%>
<%-- <jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>--%>
<%-- </header>--%>
<!-- 헤더 영역(POS 간편가입 전용) -->
<header>
<div class="header__wrapper">
<div class="header__controls-wrapper">
<div class="header__controls">
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<img src="${ cdnurl }${ topBarInfo.topbar.topFilCours }/${ topBarInfo.topbar.topSysFilNm }" alt="<c:out value="${sopmallInfo.shopInfo.sopmalNm}"/>">
<b>${resultMap.posStoreInfo.tentcpnNm}</b>
</div>
</div>
</div>
</header>
<!-- 하단 탭바 -->
<%-- <jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>--%>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<c:set var="sopmalInfo" value="${resultMap.sopmalInfo}" />
<c:set var="integrated" value="${sopmalInfo.sopmalTyCd == '01'}" />
<c:set var="posMbrInfo" value="${resultMap.posMbrInfo}" />
<div class="sub-page">
<div class="signUp">
<div class="userForm">
<form id="regForm">
<div class="userForm__inputBox">
<h3 class="section-title section-title--border section-title--sm">회원정보 입력
<span class="userForm__required"><span class="required-asterisk">*</span>필수입력사항</span>
</h3>
<input type="hidden" name="sopmalStplatInnb" value="<c:out value='${resultMap.sopmalStplatInnb}'/>"/>
<input type="hidden" name="stplatDvCds" value="<c:out value='${resultMap.stplatDvCds}'/>"/>
<input type="hidden" name="stplatDvCdAts" value="<c:out value='${resultMap.stplatDvCdAts}'/>"/>
<input type="hidden" name="joinMthCd" value='pos'>
<input type="hidden" name="strInnb" value="<c:out value='${resultMap.posStoreInfo.strInnb}'/>"/>
<c:choose>
<c:when test="${integrated}">
<input type="hidden" id="registType" value='GC ONE(통합회원)'>
</c:when>
<c:otherwise>
<input type="hidden" id="registType" value='<c:out value="${sopmalInfo.sopmalNm}"/>'>
</c:otherwise>
</c:choose>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">이름<span class="required-asterisk">*</span></div>
<input type="text" class="input-text full" name="mbrNm" id="mbrNm" title="이름" placeholder="이름을 입력해 주세요." value="<c:out value='${posMbrInfo.nm}'/>">
<p class="userForm__inputBox__alertText" id="mbrNmAlert">이름을 입력해 주세요.</p>
</div>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">휴대전화<span class="required-asterisk">*</span></div>
<div class="inputWithBtn">
<input type="text" class="input-text full number" id="mbtlnb" title="휴대폰" placeholder="휴대폰번호 입력 (’-’ 없이)" oninput="fn_set_event(this, 'keyup', fn_fmt_telno)" maxlength="13" value="<c:out value='${posMbrInfo.mbtlnb}'/>" ${empty posMbrInfo.mbtlnb ? '' : 'readonly'}>
<input type="hidden" name="mbtlnb">
<button type="button" class="btn md theme outline" id="phoneAuthBtn"><spring:message code="button.certification"/></button>
<!-- 인증완료시 버튼 -->
<button type="button" class="btn md outline" id="phoneAuthOkBtn" style="display:none;"><spring:message code="button.certificationDone"/></button>
</div>
<p class="userForm__inputBox__alertText" id="mbtlnbAlert">휴대폰 번호를 입력해 주세요.</p>
<div class="phoneAuth" id="phoneAuthContent">
<input type="hidden" id="sndngInnb">
<div>
<div class="inputWithBtn">
<div class="inputTimer">
<input type="text" class="input-text full number" id="mbtlCert" title="인증번호" placeholder="인증번호 입력" maxlength="6">
<span class="inputTimer__time" id="timer">03:00</span>
</div>
<button type="button" class="btn md gray" onclick="fn_confim_own();"><spring:message code="button.ok"/></button>
</div>
<p class="userForm__inputBox__alertText" id="mbtlCertAlert">인증번호를 입력해 주세요.</p>
</div>
</div>
</div>
<div class="userForm__inputBox__item" id="rejoinContainer" style="display: none;">
<div class="userForm__inputBox__itemTitle">가입 계정 정보<span
class="required-asterisk">*</span>
</div>
<p class="textInfo"><i class="icon icon_textInfo--sm"></i> 인증하신 정보로 가입된 계정 정보입니다. 해당
정보로 연동되어 간편 가입이 진행됩니다.
</p>
<table class="table vertical tight">
<caption>해당 테이블에 대한 설명</caption>
<!-- 각 열 width 설정 -->
<colgroup>
<col style="width: 30%;">
<col style="width: auto;">
</colgroup>
<thead>
<tr>
<th style="display:none;">회원 고유번호</th>
<th>가입사이트</th>
<th>가입방식</th>
<th>이메일</th>
</tr>
</thead>
<tbody id="rejoinSelect"></tbody>
</table>
</div>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">생년월<span class="required-asterisk">*</span>
<!--<span class="misc">(등록하시면 생일 쿠폰을 드립니다)</span> -->
</div>
<div class="inputHalf">
<input type="hidden" name="brthDe">
<div class="select-box" id="birthYear"></div>
<div class="select-box" id="birthMonth"></div>
</div>
<p class="userForm__inputBox__alertText" id="brthDeAlert">생년월을 선택해 주세요.</p>
</div>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">성별<span class="required-asterisk">*</span></div>
<div class="custom-radio-container">
<div class="custom-radio is-medium">
<input type="radio" id="men" name="sex" value="M" <c:if test="${resultMap.posMbrInfo.sex eq 'M'}"> checked </c:if> >
<label for="men">남자</label>
</div>
<div class="custom-radio is-medium">
<input type="radio" id="women" name="sex" value="F" <c:if test="${resultMap.posMbrInfo.sex eq 'F'}"> checked </c:if> >
<label for="women">여자</label>
</div>
</div>
<p class="userForm__inputBox__alertText" id="sexAlert">성별을 선택해 주세요.</p>
</div>
</div>
<div class="bottomBtnControls">
<button id="registBtn" class="btn lg full theme" onclick="fn_regist_member();">회원가입</button>
</div>
</form>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 이메일 선택 바텀시트 -->
<div class="microModal microBottomSheet" id="emailSelectPop" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<button class="microModal__close" aria-label="창 닫기" data-micromodal-close></button>
</div>
<div class="microModal__content">
<div class="modalSelect">
<p class="modalSelect__title">이메일 선택</p>
<div class="modalSelect__list">
<c:forEach var="cgn001" items="${resultMap.cgn001}" varStatus="status">
<label class="modalSelect__item">
<input type="radio" name="emailSelect" value="${cgn001.cd != '99' ? '@' : ''}${cgn001.cdNm}" onchange="fn_set_domain(this.value);" ${f:setChecked(cgn001.cd,'99')}>
<span>${cgn001.cdNm}</span>
</label>
</c:forEach>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<%--alert 팝업--%>
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title" id="modal-alert-content">Alert 메시지</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button type="button" class="microModal__btn" onclick="closeModal('modal-alert')">
<spring:message code="button.close"/>
</button>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,134 @@
<%@ 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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : JoinAgreeTermsR.jsp
Description : 회원가입(모바일)
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-09-12 이대환 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script type="text/javascript">
$(document).ready(function() {
fn_set_header_title("회원가입");
var urlParams = new URLSearchParams(window.location.search);
urlParams.has('joinMthCd') && $('#joinMthCd').val(urlParams.get('joinMthCd'));
});
/* ********************************************************
* alert모달 세팅
******************************************************** */
const fn_alert_show = function(content) {
$('#modal-alert-content').text(content);
openModal('modal-alert');
}
</script>
<style>
.content-wrap {
padding-top: 0px;
}
</style>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<%-- <header class="header header--sub">--%>
<%-- <jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>--%>
<%-- </header>--%>
<!-- 헤더 영역(POS 간편가입 전용) -->
<header>
<div class="header__wrapper">
<div class="header__controls-wrapper">
<div class="header__controls">
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<img src="${ cdnurl }${ topBarInfo.topbar.topFilCours }/${ topBarInfo.topbar.topSysFilNm }" alt="<c:out value="${sopmallInfo.shopInfo.sopmalNm}"/>">
<b>${resultMap.posStoreInfo.tentcpnNm}</b>
</div>
</div>
</div>
</header>
<!-- 하단 탭바 -->
<%-- <jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>--%>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<c:set var="sopmalInfo" value="${resultMap.sopmalInfo}" />
<c:set var="integrated" value="${sopmalInfo.sopmalTyCd == '01'}" />
<div class="sub-page">
<div class="signUp">
<div class="signUpComplete">
<div class="signUpComplete__inner">
<img src="/mobile/images/image_signUpComplete.png" alt="">
<div class="signUpComplete__box">
<c:out value='${sopmalInfo.joinComptWords}' escapeXml='false'/>
</div>
<div class="infoBox" style="text-align: center;">
<c:choose>
<c:when test="${StplatDvCdAt == 'Y'}">
<p class="textInfo">회원님은 <fmt:formatDate value="<%= new java.util.Date()%>" pattern="yyyy-MM-dd"/>에 <c:out value='${sopmalInfo.sopmalNm}'/>의 마케팅 정보 수신을 동의하셨습니다.</p>
</c:when>
<c:otherwise>
<p class="textInfo">회원님은 <fmt:formatDate value="<%= new java.util.Date()%>" pattern="yyyy-MM-dd"/>에 <c:out value='${sopmalInfo.sopmalNm}'/>의 마케팅 정보 수신을 거부하셨습니다.</p>
<p class="textInfo"><!--<i class="icon icon_textInfo--sm"></i>-->다양한 혜택 및 서비스를 받으시려면 마케팅 수신 활용에 동의해주시기 바랍니다.</p>
</c:otherwise>
</c:choose>
<input type="hidden" id="joinMthCd" value="general">
</div>
</div>
<%-- <div class="bottomBtnControls bottomBtnControls--vertical">--%>
<%-- <a href="<c:url value='/index'/>" class="btn xl full outline">쇼핑하러 가기</a>--%>
<%-- <c:if test="${!isAuthenticated}">--%>
<%-- <a href="<c:url value='/login'/>" class="btn xl full theme">로그인</a>--%>
<%-- </c:if>--%>
<%-- </div>--%>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<%--alert 팝업--%>
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title" id="modal-alert-content">Alert 메시지</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button type = "button" class="microModal__btn" onclick="closeModal('modal-alert')">
<spring:message code="button.close"/>
</button>
</div>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,21 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="ko">
<script>
var fullUrl = '${accessUrl}';
var currentUrl = '${currentUrl}';
// fullUrl이 없으면 currentUrl로 설정
if (!fullUrl || fullUrl.trim() === "") {
fullUrl = currentUrl;
}
var hashIndex = fullUrl.indexOf('#');
// # 기호가 있는 경우 URL에서 # 기호와 그 이후를 제거
var cleanUrl = hashIndex !== -1 ? fullUrl.substring(0, hashIndex) : fullUrl;
var encodedRedirectUri = encodeURIComponent(cleanUrl);
location.href = "/login?redirect_uri=" + encodedRedirectUri;
</script>
</html>
<%--권한 접근이 안되어 튕겨냄--%>

View File

@@ -0,0 +1,281 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : passwordChngR.jsp
Description : 비밀번호 변경 안내 조회
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-10-21 유재현 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<title>비밀번호 변경 캠페인</title>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function () {
fn_set_header_title('비밀번호 변경 캠페인');
$(".userForm__inputBox__alertText").hide();
fn_alert_hide($("#mbrPassword"), $("#mbrPasswordAlert"), 'pw');
fn_alert_hide($("#newPassword"), $("#newPasswordAlert"), 'pw');
fn_alert_hide($("#newPassword"), $("#passwordChngPlaceHolder"));
fn_alert_hide($("#checkPassword"), $("#checkPasswordAlert"), 'pw');
});
/* ********************************************************
* 나중에 변경하기
******************************************************** */
const fn_change_later = function() {
$.ajax({
type: 'post',
url : '<c:url value="/sopmal/mbr/updatePasswordChngLater"/>',
success: function (data) {
const result = JSON.parse(data.resBody.result).message;
if(result === "success"){
fn_alert_show('<spring:message code="success.common.update"/>')
var urlParams = new URLSearchParams(window.location.search);
if (urlParams.has('originalUrl')) {
window.location.href = decodeURIComponent(urlParams.get('originalUrl'));
return false;
}
window.location.href = '/index';
return false;
}
}
});
};
/* ********************************************************
* 비밀번호 변경
******************************************************** */
const fn_change_now = function() {
if(!fn_check_password()) {
return;
}
if (confirm('비밀번호를 <spring:message code="confirm.common.update"/>')) {
$.ajax({
type: 'post',
url: '<c:url value="/sopmal/mbr/updatePasswordChng"/>',
data : {
'mbrPassword' : $("#mbrPassword").val(),
'newPassword' : $("#newPassword").val(),
'checkPassword' : $("#checkPassword").val()
},
success: function (data) {
const result = JSON.parse(data.resBody.result).message;
if(result === "success"){
fn_alert_show('<spring:message code="success.common.update"/>');
var urlParams = new URLSearchParams(window.location.search);
if (urlParams.has('originalUrl')) {
window.location.href = decodeURIComponent(urlParams.get('originalUrl'));
return false;
}
window.location.href = '/index';
return false;
}
}
});
}
}
/* ********************************************************
* password check
******************************************************** */
const fn_check_password = function() {
var regular = /^(?=.*[a-zA-Z])(?=.*\d|.*\W)|(?=.*[a-zA-Z])(?=.*\W)|(?=.*\d)(?=.*\W)[a-zA-Z\d\W]{6,20}$/;
let mbrPassword = $('#mbrPassword');
let newPassword = $('#newPassword');
let newPasswordChk = $('#checkPassword');
if(!regular.test(mbrPassword.val())){
fn_alert_show('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
mbrPassword.focus();
return;
}
if(!regular.test(newPassword.val())){
fn_alert_show('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
newPassword.focus();
return;
}
if(!regular.test(newPasswordChk.val())){
fn_alert_show('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
newPasswordChk.focus();
return;
}
if (newPassword.val() !== newPasswordChk.val()) {
fn_alert_show('비밀번호가 일치하지 않습니다.');
newPassword.focus();
return;
}
return true;
}
/* ********************************************************
* 사용자 입력값이 입력될 때 alertText 숨기기
******************************************************** */
const fn_alert_hide = (inputId, alertId, type) => {
inputId.on('input', function () {
switch(type){
case 'id':
var regular = /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z\d_]{6,20}$/;
if (!$(this).val()) {
alertId.html('아이디를 입력해 주세요.');
}else if(dupList.includes(inputId.val())){
alertId.html('이미 사용중인 아이디입니다.');
alertId.show();
return;
}else if(!regular.test(inputId.val())){
alertId.html('아이디는 공백없는 영문, 숫자, 밑줄 포함 6~20자 조합만 사용 가능합니다.');
alertId.show();
return;
}
break;
case 'pw':
var regular = /^(?=.*[a-zA-Z])(?=.*\d|.*\W)|(?=.*[a-zA-Z])(?=.*\W)|(?=.*\d)(?=.*\W)[a-zA-Z\d\W]{6,20}$/;
if (!$(this).val()) {
alertId.html('비밀번호를 입력해 주세요.');
}else if(!regular.test(inputId.val())){
alertId.html('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
alertId.show();
return;
}
break;
default:
break;
}
alertId.hide();
if (!$(this).val()) {
alertId.show();
}
})
};
/* ********************************************************
* alert모달 세팅
******************************************************** */
const fn_alert_show = function(content) {
$('#modal-alert-content').text(content);
openModal('modal-alert');
}
</script>
<body>
<%@include file ="/WEB-INF/views/comm/mobile/Header.jsp" %>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="pwChange__wrapper">
<div class="pwChange">
<div class="pwChange__tit">
<div class="pwChange__img">
<img src="/mobile/images/icon_pw-change.png" alt="">
</div>
<div class="pwChange__txt">
<p class="pwChange__txt__top">비밀번호 변경 캠페인</p>
<p class="pwChange__txt__title">회원님의 소중한<br>개인정보를 지켜주세요.</p>
<p class="pwChange__txt__text">
회원님의 아이디 <em>${passwordResultMap.mbrId}</em>은(는) 비밀번호 변경 대상입니다.
${passwordResultMap.sopmalNm}에서는 회원님의 개인정보보호를 위해 ${passwordResultMap.passwordChngDe}개월 이상
비밀번호를 변경하지 않은 경우 비밀번호 변경을 안내하고 있습니다.
</p>
</div>
</div>
<div class="pwChange__btn">
<a href="javascript:void(0);" class="btn xl outline" onclick="fn_change_later();">
<span>
나중에 변경하기
<br>
<em>${passwordResultMap.passwordCnfirmDe}개월 후에 변경</em>
</span>
</a>
<button class="btn xl dark" data-micromodal-trigger="passwordChngPopup">지금 변경하기</button>
</div>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
<div class="microModal microBottomSheet" id="passwordChngPopup" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<button class="microModal__close" aria-label="창 닫기" data-micromodal-close="passwordChngPopup"></button>
</div>
<div class="microModal__content">
<div class="editContent" style="">
<div class="editContent__innerBox">
<input type="password" class="input-text full" name="mbrPassword" id="mbrPassword" title="기존 비밀번호" placeholder="기존 비밀번호를 입력해주세요." maxlength="20">
<p class="userForm__inputBox__alertText" id="mbrPasswordAlert">비밀번호를 입력해 주세요.</p>
<input type="password" class="input-text full" name="newPassword" id="newPassword" title="변경할 비밀번호" placeholder="변경하실 비밀번호를 입력해주세요." maxlength="20">
<p class="userForm__inputBox__alertText" id="newPasswordAlert">비밀번호를 입력해 주세요.</p>
<p class="editUserPwCheck__subTitle" id="passwordChngPlaceHolder">영문 대소문자/숫자/특수문자 중 2가지 이상 포함 6~20자 </p>
<input type="password" class="input-text full" name="checkPassword" id="checkPassword" title="변경할 비밀번호 확인" placeholder="비밀번호를 한번 더 입력해주세요." maxlength="20">
<p class="userForm__inputBox__alertText" id="checkPasswordAlert">비밀번호를 입력해 주세요.</p>
<div class="pwChange__btn">
<button type="button" class="btn xl dark" onclick="fn_change_now(); return false;" style="margin-top:8px;">변경하기</button>
<button type="button" class="btn xl outline" id="modal-error-confirm-noButton" data-micromodal-close="passwordChngPopup">취소</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<%--alert 팝업--%>
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title" id="modal-alert-content">Alert 메시지</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button type="button" class="microModal__btn" onclick="closeModal('modal-alert')">
<spring:message code="button.close"/>
</button>
</div>
</div>
</div>
</div>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/comm/mobile/Footer.jsp" />
</body>
</html>

View File

@@ -0,0 +1,363 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : NoticeListR.jsp
Description :모바일 샘플.jsp
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-02 최남식 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<script>
$(document).ready(function (){
/*헤더에 타이틀 set*/
fn_set_header_title("상품Q&A내역");
/*마이크로모달 초기화 id 매핑*/
MicroModal.init(
{
disableScroll: true,
awaitCloseAnimation: true,
});
/*인피니트 스크롤 함수 호출*/
fn_infinite_scroll(fn_add_list,'','footer');
//아코디언 클릭 시 폼 제출 방지
$(".myQnaList__item").click(function (event) {
$target = $(this);
$details = $(this).closest('details');
if(!$details.attr("open")){ //open상태임
const bbscttInnb = $target.attr("bbsctt-innb");
const idx = $target.index(".myQnaList__item");
fn_select_fileInfo(bbscttInnb, idx);
}
});
//수정 폼 이동 버튼
$(document).on('click', '.updateBtn', function () {
const bbscttInnb = $(this).closest('div').find("[name='bbscttInnb']").val();
const bbsId = $("#bbsId").val();
fn_move_qaUpdt(bbscttInnb, bbsId);
});
//삭제 모달 버튼
$(document).on('click', '.deleteBtn', function () {
const bbscttInnb = $(this).closest('div').find("[name='bbscttInnb']").val();
const goodsInnb = $(this).closest('div').find("[name='goodsInnb']").val();
openModal("confirm_del_alert");
$('#delCfrmBtn').attr('bbsctt-innb', bbscttInnb);
$('#delCfrmBtn').attr('goods-innb', goodsInnb);
});
//삭제 버튼
$(document).on('click', '#delCfrmBtn', function () {
const bbscttInnb = $(this).attr("bbsctt-innb");
const goodsInnb = $(this).attr("goods-innb");
const bbsId = $("#bbsId").val();
const bbsTyCd = $("#bbsTyCd").val();
fn_delete_bbsctt(bbscttInnb, bbsId, bbsTyCd, goodsInnb);
});
//삭제 성공 모달 확인 버튼
$(document).on('click','#delSuccessBtn', function(){
closeModal("success_del_alert");
location.reload();
});
});
//게시글 수정
const fn_move_qaUpdt = (bbscttInnb, bbsId) => {
const form = $('<form>', {
'action': '/sopmal/mpage/act/selectGoodsQnaDtlUpdtForm',
'method': 'get'
}).append(
$('<input>', {
'type': 'hidden',
'name': 'bbscttInnb',
'value': bbscttInnb
})
).append(
$('<input>', {
'type': 'hidden',
'name': 'bbsId',
'value': bbsId
})
)
$('body').append(form);
form.submit();
}
//게시글 삭제
const fn_delete_bbsctt =(bbscttInnb,bbsId,bbsTyCd,goodsInnb)=>{
closeModal("confirm_del_alert");
$.ajax({
type: "post",
url: "/sopmal/csc/deleteBbscttDel",
data: {
"delBbscttInnbArr": bbscttInnb,
"bbsId": bbsId,
"bbsTyCd": bbsTyCd,
"goodsInnbArr": goodsInnb
},
success: function () {
openModal("success_del_alert");
$("#delCfrmBtn").removeAttr("bbscttInnb");
$("#delCfrmBtn").removeAttr("goodsInnb");
}
});
}
//해당 게시물 파일정보 get
const fn_select_fileInfo = (bbscttInnb, idx) => {
$.ajax({
type: "post",
url: "/sopmal/mpage/act/selectFileInfo",
data: {"bbscttInnb": bbscttInnb},
success: function (data) {
const resultData = JSON.parse(data.resBody.result);
const fileInfo = resultData.fileInfo;
let img = '';
const cdnurl = '<c:out value="${cdnurl}"/>';
fileInfo.forEach(function (file) {
img += `<img src="\${cdnurl}\${file.filCours}\/\${file.sysFilNm}\" onerror="this.src='/mobile/images/image_placeholder.png'" alt="\${file.orginlFilNm}\"/>`;
});
$(".myQnaList__item").eq(idx).find(".file").html(img);
}
});
}
//인피니티 스크롤 이벤트 콜백 함수
const fn_add_list = () => {
if($("#evtOccrrncAt").val() === 'continue'){
/*다음 페이지로 이동*/
let pageIndex = parseInt($("#pageIndex").val(), 10);
$("#pageIndex").val(pageIndex+1);
$.ajax({
type: "post",
data: {
bbsId: $("#bbsId").val(),
pageIndex: $("#pageIndex").val()
},
url: "/sopmal/mpage/act/selectGoodsQnaInqireAjax",
success: function (data) {
fn_append_List(data);//DATA append 함수
},
});
}
}
// data append 함수
const fn_append_List = (data) => {
data = JSON.parse(data.resBody.result);
let resultData = data.resultList.resultList;
let list = ``;
if(resultData.length > 0){
$("#evtOccrrncAt").val("continue");
resultData.forEach(function (item) {
Object.keys(item).forEach(function (key) {
if (item[key] === null) {
item[key] = "";
}
});
});
// 리스트를 지정된 요소에 추가
resultData.forEach(function(item) {
//분류
let answCn = ``;
if (item.answCn !== null) {
answCn = `[\${item.answCn}]`
}
//답변여부
let answSttus = ``;
let answBbscttCn = ``;
let updtAt= `` ;
if (item.answBbscttInnb !== null) {
answSttus = `<span class="text-complete">답변완료</span>`;
answBbscttCn = `<div class="ck-content">\${item.answBbscttCn}</div>`;
updtAt = ``;
} else {
answSttus = `<span class="text-waiting">답변대기</span>`;
answBbscttCn = `답변 등록 중 입니다.`;
updtAt = `<button type="button" class="textBtns__btn updateBtn"><spring:message code="button.update"/></button>`;
}
list += `<details class="myQnaList__item" bbsctt-innb = "\${item.bbscttInnb}">
<summary class="myQnaList__top">
<div class="myQnaList__image">
<a href="" onclick = "fn_move_goods_dtl(\${item.goodsInnb}); return false;">
<img src="\${item.img}"
onerror="this.src='/mobile/images/image_placeholder.png'" alt="해당 이미지에 대한 설명">
</a>
</div>
<div class="myQnaList__right">
<div class="myQnaList__info">
<p class="myQnaList__info__name">\${item.goodsNm}</p>
<p class="myQnaList__info__question">
<span class="category">\${answCn}</span>
\${item.sj}
</p>
<p class="myQnaList__info__status">
<span>
\${answSttus}
</span>
<span class="myQnaList__info__date">\${item.sumRegistDt}</span>
</p>
<span class="myQnaList__top__chevron"></span>
</div>
</div>
</summary>
<div class="myQnaList__answer">
<p class="myQnaList__answer__question">
\${item.cn}
</p>
<br>
<div class="file"></div>
<br>
<div class="myQnaList__answer__reply">
<p class="myQnaList__answer__reply__text">
<span class="myQnaList__answer__badge">답변</span>
\${answBbscttCn}
</p>
</div>
<div class="textBtns">
<input type = "hidden" name = "bbscttInnb" value = "\${item.bbscttInnb}">
<input type = "hidden" name = "goodsInnb" value = "\${item.goodsInnb}">
<button type="button" class="textBtns__btn deleteBtn"><spring:message code="button.delete"/></button>
\${updtAt}
</div>
</div>
</details>`;
});
$(".myQnaList__item").last().after(list);
} else {
/*데이터 조회 null일시 그 전 페이지 인덱스로 변경*/
$("#evtOccrrncAt").val("stop");
let pageIndex = parseInt($("#pageIndex").val(), 10);
$("#pageIndex").val(pageIndex - 1);
}
};
</script>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="myQnaList">
<div class="sub-box">
<c:set value="${resultMap.bbsInfo}" var = "bbsInfo"/>
<input type = "hidden" value = "<c:out value="${bbsInfo.bbsId}"/>" id = "bbsId">
<input type = "hidden" value = "<c:out value="${bbsInfo.bbsTyCd}"/>" id = "bbsTyCd">
<input type = "hidden" name="slangFlterUseAt" id = "slangFlterUseAt" value = "<c:out value="${bbsInfo.slangFlterUseAt}"/>">
<input type = "hidden" value = "<c:out value="${resultMap.bbsctt.pageIndex}"/>" name = "pageIndx" id = "pageIndex">
<input type="hidden" id="evtOccrrncAt" value="continue"/><%--인피니티스크롤 이벤트 발생 여부--%>
<c:choose>
<c:when test = "${ not empty resultMap.resultList.resultList }">
<c:forEach var="resultList" items="${ resultMap.resultList.resultList}">
<details class="myQnaList__item" bbsctt-innb = "<c:out value = '${resultList.bbscttInnb}'/>">
<summary class="myQnaList__top">
<div class="myQnaList__image">
<a href="" onclick = "fn_move_goods_dtl(<c:out value = '${resultList.goodsInnb}'/>); return false;">
<img src="<c:out value = '${cdnurl}${resultList.img}'/>"
onerror="this.src='/mobile/images/image_placeholder.png'" alt="해당 이미지에 대한 설명">
</a>
</div>
<div class="myQnaList__right">
<div class="myQnaList__info">
<p class="myQnaList__info__name"><c:out value="${resultList.goodsNm}"/></p>
<p class="myQnaList__info__question">
<span class="category"><c:if test = "${not empty resultList.answCn}">[<c:out value="${resultList.answCn}"/>]</c:if></span>
<c:out value="${resultList.sj}"/>
</p>
<p class="myQnaList__info__status">
<span>
<c:choose>
<c:when test = "${not empty resultList.answBbscttInnb}">
<span class="text-complete">답변완료</span>
</c:when>
<c:otherwise>
<span class="text-waiting">답변대기</span>
</c:otherwise>
</c:choose>
</span>
<span class="myQnaList__info__date"><c:out value="${resultList.sumRegistDt}"/></span>
</p>
<span class="myQnaList__top__chevron"></span>
</div>
</div>
</summary>
<div class="myQnaList__answer">
<p class="myQnaList__answer__question">
<c:out value="${resultList.cn}"/>
</p>
<br>
<div class="file"></div>
<br>
<div class="myQnaList__answer__reply">
<p class="myQnaList__answer__reply__text">
<span class="myQnaList__answer__badge">답변</span>
<c:choose>
<c:when test = "${not empty resultList.answBbscttInnb}">
<div class = "ck-content"><c:out value="${resultList.answBbscttCn}" escapeXml="false"/></div>
</c:when>
<c:otherwise>
답변 등록 중 입니다.
</c:otherwise>
</c:choose>
</p>
</div>
<div class="textBtns">
<input type = "hidden" name = "bbscttInnb" value = "<c:out value="${resultList.bbscttInnb}"/>">
<input type = "hidden" name = "goodsInnb" value = "<c:out value="${resultList.goodsInnb}"/>">
<button type="button" class="textBtns__btn deleteBtn"><spring:message code="button.delete"/></button>
<c:if test="${empty resultList.answBbscttInnb}">
<button type="button" class="textBtns__btn updateBtn"><spring:message code="button.update"/>
</button>
</c:if>
</div>
</div>
</details>
</c:forEach>
</c:when>
<c:otherwise>
<div class="noResult">
<div class="noResult__image">
<img src="/mobile/images/icon__no-result.png" alt="상품 이미지">
</div>
<p class="noResult__text">등록된 상품 문의가 없습니다.</p>
</div>
</c:otherwise>
</c:choose>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/comm/mobile/Footer.jsp"/>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,990 @@
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
<%--
Class Name : BbscttUpdtU.jsp
Description :게시글 수정(모바일).jsp
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-07-24 김혜인 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function () {
//hidden value set
fn_update_hidden_value();
/*헤더에 타이틀 set*/
const title = '<c:out value="${resultMap.bbsInfo.bbsNm}" escapeXml="false"/>';
fn_set_header_title(title);
fn_collect_event();
});
/*************************************************************
이벤트 함수
*************************************************************/
const fn_collect_event = () => {
//내용 set
fn_select_cn();
MicroModal.init(
{
disableScroll: true,
awaitCloseAnimation: true,
});
/*휴대전화 포매팅 함수*/
fn_set_event("#answMbtlnb","input",fn_fmt_telno);
/*값 set*/
if($("#answMbtlnb").val()){
const fmtMbtlnb = fn_format_mbtlnb($("#answMbtlnb").val());
$("#answMbtlnb").val(fmtMbtlnb);
}
//내용 텍스트 <br>태그 엔터값으로 replace
const cn = $("#cnBbsUpdt");
let str = cn.text();
str = str.replaceAll(/<br>/ig, '\n');
str = str.replaceAll(/<\/br>/ig, '\n');
str = str.replaceAll(/<br \/>/ig, '\n');
//내용 내 태그 없애기
str = str.replace(/<\/?[^>]+(>|$)/g, "");
//내용 앞에 첫 문자열 앞 공백 지우기
str = str.trimStart();
cn.text(str);
//분류 change시 hidden value값 set
$('#qesitmNmC').on('change', function () {
$("#qesitmInnb").val("");
$("#qesitmNm").val("");
$("#answCn").val("");
const option = $('option:selected', this);
const qesitmInnb = $(option).attr('qesitm-innb');
const answCn = $(option).attr('answ-Cn');
const qesitmNm = $(option).attr('qesitm-nm');
if ($(this).val() !== "") {
$("#qesitmInnb").val(qesitmInnb);
$("#answCn").val(answCn);
$("#qesitmNm").val(qesitmNm);
$("#qesitmAt").val("Y");
} else {
$("#qesitmInnb").val("");
$("#answCn").val("");
$("#qesitmNm").val("");
$("#qesitmAt").val("N");
}
});
//추가입력 항목 라디오 'click' 이벤트
$('.answRadioC').on('click', function () {
const radio = $(this);
//추가입력 항목 내용 요소 get
const answ = radio.closest("div").find('[name="answCnArr[]"]');
//추가입력 항목 내용 요소 get
const qesitmInnb = radio.closest("div").find('[name="qesitmInnbArr[]"]');
//라디오 클릭으로 인한 제어 요소 get
const contrlTarget = radio.closest("div").find('.answRadio');
//항목 고유번호 내용 요소 get
const itmInnb = radio.closest("div").find('[name="itmInnbArr[]"]');
//라디오 클릭 시 disabled 비활성
if (radio.is(":checked")) {
//답변 내용 초기화
answ.val("");
const radioVal = $(radio).attr('itm-cn');
answ.val(radioVal);
//항목 내용 set
qesitmInnb.val("");
const qesitmInnbVal = $(radio).attr('qesitm-innb');
qesitmInnb.val(qesitmInnbVal);
//항목고유번호 내용 set
itmInnb.val("");
const itmInnbVal = $(radio).val();
itmInnb.val(itmInnbVal);
//라디오 주위 input값 disable false처리
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
radio.closest("div").find(".answRadioAt").val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
radio.closest("div").find(".answRadioAt").val("N");
});
}
});
//추가입력 항목 셀렉트 'change'이벤트
$(document).on('change', '.answSelectC', function () {
const select = $(this);
const answ = select.closest("div").find('[name="answCnArr[]"]');
const qesitmInnb = select.closest("div").find('[name="qesitmInnbArr[]"]');
const contrlTarget = select.closest("div").find('.answSelect');
const option = $('option:selected', this);
if (select.val() != "") {
//답변 내용 초기화
answ.val("");
const selectVal = $(option).attr('itm-cn');
answ.val(selectVal);
//항목 내용 set
qesitmInnb.val("");
const qesitmInnbVal = $(option).attr('qesitm-innb');
qesitmInnb.val(qesitmInnbVal);
//셀렉트 주위 input값 disable false처리
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
select.closest("div").find(".answSelectAt").val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
select.closest("div").find(".answSelectAt").val("N");
});
}
});
//추가입력 항목 체크박스 'click'이벤트
$(document).on('click', '.answChkC', function () {
const check = $(this);
const contrlTarget = check.closest("div").find('.answChk');
var isChecked = $(this).is(":checked");
//클릭한 체크박스 주위 input값 disable false처리
contrlTarget.each(function () {
if (isChecked) {
$(this).prop("disabled", false);
} else {
$(this).prop("disabled", true);
}
});
// 체크된 체크박스가 하나라도 있는지 확인
let anyChecked = $('.answChkC:checked').length > 0;
contrlTarget.each(function () {
if (anyChecked) {
check.closest("td").find(".answChkAt").val("Y");
} else {
check.closest("td").find(".answChkAt").val("N");
}
});
});
//추가입력 항목 텍스트 'input'이벤트
$(document).on('input', '.answTxtC', function () {
const txt = $(this);
const contrlTarget = txt.closest("div").find('.answTxt');
const contrlAt = txt.closest("div").find('.answTxtAt');
//클릭한 체크박스 주위 input값 disable false처리
if (txt.val() != "") {
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
contrlAt.val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
contrlAt.val("N");
});
}
});
//파일 업로드
$(document).on("change", "#fileUpload", function () {
addFiles(event, 0);
});
//수정 버튼 이벤트 (수정 컨펌 모달 호출)
$(document).on("click", "#updtBtn", function () {
$("#confirmBtn").click();
});
//수정 컨펌 이벤트(수정 함수 호출)
$("#confirmPopBtn").on("click",function(){
$("#clsConfirmPopBtn").click();//모달닫기
fn_update_bbsctt();//수정 함수 호출
});
//수정 완료 모달 > 확인 버튼 이벤트 (새로고침)
$(document).on("click", "#alertBtn", function () {
$('html').scrollTop(0);
location.reload();
});
/*sms알림요청 체크 시에만 휴대전화 입력폼 활성화*/
$("#answSmsRecptn").on('click', function() {
const target = $(this).closest(".userForm__inputBox__item").find("#answMbtlnb");
if(this.checked) {
target.prop("disabled", false);
} else {
target.prop("disabled", true);
}
});
}
/*********************************************************
* 게시글 내용 조회
*********************************************************/
const fn_select_cn = function () {
let bbscttInnb = $("#bbscttInnb").val();
let bbsId = $("#bbsId").val();
let sopmalCd = $("#sopmalCd").val();
$.ajax({
type: "post",
url: "<c:url value ='/ajax/bbscttAjax/selectBOBbscttCnAjax'/>",
contentType: 'application/json',
data: JSON.stringify({
bbsId: bbsId,
bbscttInnb: bbscttInnb,
sopmalCd: sopmalCd
}),
success: function (data) {
let cn = data.result.cn;
$("#cnBbsUpdt").val(cn);
}
});
}
//input 생성 함수
const fn_create_input = (name, value, tgtForm) => {
const input = document.createElement('input');
input.setAttribute("type", "hidden");
input.setAttribute("name", name);
input.setAttribute("value", value);
tgtForm.appendChild(input);
}
/*********************************************************
* 게시글 수정
*********************************************************/
const fn_update_bbsctt = function () {
let url = '<c:url value="/sopmal/csc/updateBbscttupdt"/>';
let saveForm = $('#bbsUpdtForm');
let formData = new FormData();
//파일 업로드
if ($("#image-dropzone").length > 0) {
let myDropzone = Dropzone.forElement("#image-dropzone");
myDropzone.files.forEach(function (file) {
formData.append("files", file);
});
}
//사용자 등록 시 노출 여부 Y
formData.append("expsrAt", "Y");
//비밀번호 set
const password = "<c:out value = "${ resultMap.bbscttInfo.bbscttInfo.password }"/>";
if (password.length){
formData.append("password", password);
}
//입력항목 체크박스 disabled처리
$('.checkbox input[type="checkbox"]').each(function () {
if (!$(this).prop('checked')) {
fn_ctrl_disable([".checkbox"],);
}
});
let cn = $("#cnBbsUpdt").val();
cn = $.trim(cn);
$("#cnBbsUpdt").val(cn);
//폼 내 input값 append
saveForm.serializeArray().forEach(function (item) {
formData.append(item.name, item.value);
});
$.ajax({
type: 'post',
url: url,
enctype:"multipart/form-data",
data: formData,
processData: false,
contentType: false,
success: function (result) {
$("#successBtn").click();
}
});
fn_ctrl_disable("", [".checkbox"]);
}
function fn_update_hidden_value() {
//분류 항목
const option = $('option:selected', $("#qesitmNmC"));
const qesitmInnb = $(option).attr('qesitm-innb');
const answCn = $(option).attr('answ-Cn');
const qesitmNm = $(option).attr('qesitm-nm');
if ($("#qesitmNmC").val() != "") {
$("#qesitmInnb").val(qesitmInnb);
$("#answCn").val(answCn);
$("#qesitmAt").val("Y");
} else {
$("#qesitmInnb").val("");
$("#answCn").val("");
$("#qesitmAt").val("N");
}
// 추가평가항목 라디오
const radio = $(".answRadioC:checked");
radio.each(function (idx) {
if (radio.eq(idx).val()) {
let radioAnsw = radio.eq(idx).closest("reviewRadio__item").find('[name="answCnArr[]"]');
let radioQesitmInnb = radio.eq(idx).closest("reviewRadio__item").find('[name="qesitmInnbArr[]"]');
let radioItmInnb = radio.eq(idx).closest("reviewRadio__item").find('[name="itmInnbArr[]"]');
let radioQesitmAt = radio.eq(idx).closest("reviewRadio__item").find('[name="qesitmAtArr[]"]');
let radioContrlTarget = radio.eq(idx).closest("reviewRadio__item").find('.answRadio');
// 답변 내용 set
radioAnsw.val(radio.eq(idx).attr('itm-cn'));
// 항목 내용 set
radioQesitmInnb.val(radio.eq(idx).attr('qesitm-innb'));
// 항목고유번호 내용 set
radioItmInnb.val(radio.eq(idx).val());
// 답변 여부
radioQesitmAt.val("Y");
// 라디오 주위 input값 disable false처리
radioContrlTarget.each(function (idx) {
radioContrlTarget.eq(idx).prop("disabled", false);
});
} else {
let radioAnsw = radio.eq(idx).closest("reviewRadio__item").find('[name="answCnArr[]"]');
let radioQesitmInnb = radio.eq(idx).closest("reviewRadio__item").find('[name="qesitmInnbArr[]"]');
let radioItmInnb = radio.eq(idx).closest("reviewRadio__item").find('[name="itmInnbArr[]"]');
let radioQesitmAt = radio.eq(idx).closest("reviewRadio__item").find('[name="qesitmAtArr[]"]');
let radioContrlTarget = radio.eq(idx).closest("div").find('.answRadio');
// 답변 내용 set
radioAnsw.val("");
// 항목 내용 set
radioQesitmInnb.val("");
// 항목고유번호 내용 set
radioItmInnb.val("");
// 답변 여부
radioQesitmAt.val("N");
// 라디오 주위 input값 disable false처리
radioContrlTarget.each(function (idx) {
radioContrlTarget.eq(idx).prop("disabled", true);
});
}
});
//추가입력 항목 셀렉트 'change'이벤트
const select = $('select.answSelectC[name="itmInnbArr[]"]');
select.each(function (idx) {
let selectIndex = select.eq(idx).find('option:selected').index();
if (selectIndex > 0) {
let selectQesitmAt = select.eq(idx).closest("reviewRadio__item").find('[name="qesitmAtArr[]"]');
let selectQesitmInnb = select.eq(idx).closest("reviewRadio__item").find('[name="qesitmInnbArr[]"]');
let selectAnsw = select.eq(idx).closest("reviewRadio__item").find('[name="answCnArr[]"]');
let selectOption = $('option:selected', select.eq(idx));
let selectContrlTarget = select.eq(idx).closest("reviewRadio__item").find('.answSelect');
// 답변 여부
selectQesitmAt.val("Y");
// 항목 내용 set
selectQesitmInnb.val(selectOption.attr('qesitm-innb'));
// 답변 내용 set
selectAnsw.val(selectOption.attr('itm-cn'));
// 라디오 주위 input값 disable false처리
selectContrlTarget.each(function (idx) {
selectContrlTarget.eq(idx).prop("disabled", false);
});
} else {
let selectQesitmAt = select.eq(idx).closest("reviewRadio__item").find('[name="qesitmAtArr[]"]');
let selectQesitmInnb = select.eq(idx).closest("reviewRadio__item").find('[name="qesitmInnbArr[]"]');
let selectAnsw = select.eq(idx).closest("reviewRadio__item").find('[name="answCnArr[]"]');
let selectContrlTarget = select.eq(idx).closest("reviewRadio__item").find('.answSelect');
// 답변 여부
selectQesitmAt.val("N");
// 항목 내용 set
selectQesitmInnb.val("");
// 답변 내용 set
selectAnsw.val("");
// 라디오 주위 input값 disable false처리
selectContrlTarget.each(function (idx) {
selectContrlTarget.eq(idx).prop("disabled", true);
});
}
});
const check = $(".answChkC");
//클릭한 체크박스 주위 input값 disable false처리
check.each(function (idx) {
let checkContrlTarget = check.eq(idx).closest(".checkbox").find('.answChk');
let isChecked = check.eq(idx).is(":checked");
checkContrlTarget.each(function (index) {
if (isChecked) {
checkContrlTarget.eq(index).prop("disabled", false);
} else {
checkContrlTarget.eq(index).prop("disabled", true);
}
});
// 체크된 체크박스가 하나라도 있는지 확인
let anyChecked = check.eq(idx).closest("reviewRadio__inputRow").find(".answChkC:checked").length > 0;
if (anyChecked) {
check.eq(idx).closest("reviewRadio__inputRow").find(".answChkAt").val("Y");
} else {
check.eq(idx).closest("reviewRadio__inputRow").find(".answChkAt").val("N");
}
});
//추가입력 항목 텍스트 'input'이벤트
const txt = $('.answTxtC');
txt.each(function (idx) {
let contrlTarget = txt.eq(idx).closest("div").find('.answTxt');
let contrlAt = txt.eq(idx).closest("div").find('.answTxtAt');
//클릭한 체크박스 주위 input값 disable false처리
if (txt.val() != "") {
contrlTarget.each(function () {
contrlTarget.prop("disabled", false);
contrlAt.val("Y");
});
} else {
contrlTarget.each(function () {
contrlTarget.prop("disabled", true);
contrlAt.val("N");
});
}
});
}
/*상품qna 버튼 클릭 제어*/
function fn_prevent_click(event) {
event.preventDefault(); // 체크박스 상태 변경 방지
}
</script>
<body>
<c:set value="${resultMap.bbscttInfo.bbscttInfo}" var="bbscttInfo"/>
<c:set value="${resultMap.bbscttVO}" var="bbscttVO"/>
<c:set value="${resultMap.bbscttInfo.qesitmAnswList}" var="qesitmAnswList"/>
<c:set value="${resultMap.bbscttInfo.fileInfo}" var="fileInfo"/>
<c:set value="${resultMap.bbscttInfo.fileInfoGson}" var="fileInfoGson"/>
<c:set value="${resultMap.bbscttInfo.goods}" var="goods"/>
<c:set value="${resultMap.bbscttInfo.wrter}" var="wrter"/>
<c:set value="${resultMap.bbsInfo}" var="bbsInfo"/>
<c:set value="${resultMap.qesitmList.qesitmList}" var="qesitmList"/>
<c:set value="${resultMap.qesitmList.itmCnList}" var="itmCnList"/>
<c:set value="${resultMap.itmList}" var="itmList"/>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<!-- 메인 컨텐츠 영역 -->
<div class="screen-wrap">
<!-- 헤더 영역 -->
<header class="header header--sub">
<jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>
</header>
<!-- 하단 탭바 -->
<jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<div class="sub-page">
<div class="myQnaEdit">
<div class="sub-box">
<form id="bbsUpdtForm">
<%--게시판 설정--%>
<input type="hidden" name="filAtch" value="${bbsInfo.filAtch }"/>
<input type="hidden" name="slangFlterUseAt" value="${bbsInfo.slangFlterUseAt}"/>
<input type="hidden" id = "bbsId" name="bbsId" value="${bbsInfo.bbsId }"/>
<input type="hidden" id = "bbsTyCd" name="bbsTyCd" value="${bbsInfo.bbsTyCd }"/>
<input type="hidden" id="pgeVtcCnt" name="pgeVtcCnt" value="${ bbsInfo.pgeVtcCnt }"/>
<input type="hidden" id="pgeWthCnt" name="pgeWthCnt" value="${ bbsInfo.pgeWthCnt }"/>
<input type="hidden" id="prevNext" name="prevNext" value="${ bbsInfo.prevNext }"/>
<input type="hidden" id="sknTyCd" name="sknTyCd" value="${ bbsInfo.sknTyCd }"/>
<input type="hidden" id="sopmalCd" name="sopmalCd" value="${ bbsInfo.sopmalCd }"/>
<%--vo 관련(요청 구분 등)--%>
<input type="hidden" id="reqDv" value="<c:out value = '${bbscttVO.reqDv}'/>" name="reqDv"/>
<input type="hidden" id="reqUrl" value="<c:out value = '${bbscttVO.reqUrl}'/>" name="reqUrl"/>
<input type="hidden" id="listAt" name="listAt" value="${ bbscttVO.listAt }"/>
<%--게시글 관련--%>
<input type="hidden" id="bbscttInnb" name="bbscttInnb" value="${ bbscttInfo.bbscttInnb }"/>
<%--파일 관련--%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.extensions.images')" var="acceptFileExtensions"/>
<input type="hidden" id="acceptFileExtensions" name="acceptFileExtensions" value="${ acceptFileExtensions}"/>
<%--존재 파일 여부 체크--%>
<c:choose>
<c:when test = "${not empty fileInfo}"><c:set var="filExtAt" value="Y"/></c:when>
<c:otherwise><c:set var="filExtAt" value="N"/></c:otherwise>
</c:choose>
<input type="hidden" id="filExtAt" name="filExtAt" value="${filExtAt}"/>
<input type="hidden" id="extFiles" name="extFiles" value=""/>
<input type="hidden" id="filesInfo" name="filesInfo"/>
<input type="hidden" id="extFilChangeAt" name="extFilChangeAt" value="N"/>
<%--입력 폼 영역--%>
<div class="userForm">
<div class="userForm__inputBox">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">이름
<span class="required-asterisk">*</span>
</div>
<c:choose>
<c:when test = "${bbscttInfo.regusrDvCd eq '99'}">
<input type="text" class="input-text full" name="regusrNm"
placeholder="이름" title="이름" value = "<c:out value="${bbscttInfo.regusrNm}"/>">
</c:when>
<c:otherwise>
<input type="text" class="input-text full" name="regusrNm"
placeholder="이름" title="이름" value = "<c:out value="${bbscttInfo.regusrNm}"/>" readonly>
</c:otherwise>
</c:choose>
</div>
<c:if test="${bbsInfo.answRegist eq 'Y' && bbsInfo.bbscttSndngMthCd ne '03'}"><%--답변사용여부와 게시글 문자사용여부 체크--%>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">답변받기</div>
<div class="b-checkbox-container">
<label class="b-checkbox is-medium checkbox">
<input class="termCheck" type="checkbox" name="answSmsRecptn"
value="Y" id="answSmsRecptn"
<c:if test="${bbscttInfo.answSmsRecptn eq 'Y'}">checked</c:if>>
<span class="check"></span>
<span class="control-label">SMS 알림요청</span>
</label>
</div>
</div>
</c:if>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">상품</div>
<c:forEach var="goods" items="${goods}">
<div class="userForm__inputBox__itemTitle">
<img src="${cdnurl}${goods.img}" width="64" alt="상품이미지" onerror="this.src='/pc/images/image_placeholder.png'">
<c:out value="${goods.goodsNm}"/>
<input type="hidden" name="goodsInnbArr[]" value="${goods.goodsInnb}"/>
</div>
</c:forEach>
</div>
<c:if test="${not empty itmList}">
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">문의 유형<span
class="required-asterisk">*</span></div>
<div class="select-box">
<%--문항답변필수여부 --%>
<input type="hidden" name="qesitmEssntlAtArr[]" value="Y">
<%--문항명 --%>
<input type="hidden" name="qesitmNmArr[]" id="qesitmNm" value="분류"/>
<%--문항고유번호 --%>
<input type="hidden" name="qesitmInnbArr[]" id="qesitmInnb"
<c:forEach var="itmAnswList" items="${qesitmAnswList}">
<c:if test="${itmAnswList.aditItmDvCd eq '03'}">
value = <c:out value="${itmAnswList.qesitmInnb}"/>
</c:if>
</c:forEach>/>
<%--답변내용 --%>
<input type="hidden" name="answCnArr[]" id="answCn"<c:forEach
var="itmAnswList" items="${qesitmAnswList}">
<c:if test="${itmAnswList.aditItmDvCd eq '03'}">
value = <c:out value="${itmAnswList.answCn}"/>
</c:if>
</c:forEach>/>
<%--답변여부 --%>
<input type="hidden" name="qesitmAtArr[]" id="qesitmAt"
<c:forEach var="itmAnswList" items="${qesitmAnswList}">
<c:if test="${itmAnswList.aditItmDvCd eq '03'}">
<c:choose>
<c:when test="${empty itmAnswList.answCn}">value="N"</c:when>
<c:otherwise>value="Y"</c:otherwise>
</c:choose>
</c:if>
</c:forEach>>
<select class="md" id="qesitmNmC" name="itmInnbArr[]">
<option value="">분류 선택</option>
<c:forEach var="itm" items="${itmList}" varStatus="status">
<option value="<c:out value="${itm.itmInnb}"/>"
qesitm-innb="${itm.qesitmInnb}" answ-Cn="${itm.itmCn}"
qesitm-nm="${itm.qesitmNm}"
<%--분류 답변 값 유지--%>
<c:forEach var="itmAnswList" items="${qesitmAnswList}">
<c:if test="${itmAnswList.aditItmDvCd eq '03'}">
<c:if test="${itm.itmInnb eq itmAnswList.itmInnb }">selected</c:if>
</c:if>
</c:forEach>>
<c:out value="${itm.itmCn}"/>
</option>
</c:forEach>
</select>
</div>
</div>
</c:if>
<c:if test="${not empty qesitmList}">
<div class="reviewRadio">
<c:forEach var="qesitmList" items="${qesitmList}">
<c:if test="${ qesitmList.itmTyCd eq '01'}">
<%--라디오 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<div class="custom-radio-container">
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt}"
class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm}">
<input type="hidden" name="qesitmAtArr[]"
class="answRadioAt qesitmAtChk" value="N">
<input type="hidden" name="qesitmInnbArr[]"
class="answRadio"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" name="answCnArr[]" class="answRadio"
disabled>
<input type="hidden" name="itmInnbArr[]" class="answRadio"
disabled>
<c:forEach items="${itmCnList}" var="itmCnList1" varStatus="status">
<c:if test="${itmCnList1.qesitmInnb eq qesitmList.qesitmInnb}">
<div class="custom-radio is-medium">
<input type="radio" id="answCn${ status.index }"
class="answRadioC"
qesitm-innb='${itmCnList1.qesitmInnb}'
name="itmInnbArr${ qesitmList.qesitmInnb}[]"
value="${ itmCnList1.itmInnb}"
itm-cn="${ itmCnList1.itmCn }"
<c:forEach var="qesitmAnswList1"
items="${qesitmAnswList}">
<c:if test="${qesitmAnswList1.itmTyCd eq '01'}">
<c:if test="${qesitmAnswList1.itmInnb eq itmCnList1.itmInnb}">checked</c:if>
</c:if>
</c:forEach>>
<label for="answCn${ status.index }">${ itmCnList1.itmCn }</label>
</div>
</c:if>
</c:forEach>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '02'}">
<%--셀렉트 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }" class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answSelectAt qesitmAtChk" value="N">
<input type="hidden" name="qesitmInnbArr[]" class="answSelect"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" name="answCnArr[]" class="answSelect" disabled>
<div class="select-box">
<select class="md answSelectC" name="itmInnbArr[]">
<option value="">전체</option>
<c:forEach items="${itmCnList}" var="itmCnList2">
<c:if test="${itmCnList2.qesitmInnb eq qesitmList.qesitmInnb}">
<c:set var="selected" value=""/>
<c:forEach var="qesitmAnswList2" items="${qesitmAnswList}">
<c:if test="${qesitmAnswList2.itmInnb eq itmCnList2.itmInnb}">
<c:set var="selected" value="selected"/>
</c:if>
</c:forEach>
<option value="${itmCnList2.itmInnb}"
itm-cn="${itmCnList2.itmCn}"
qesitm-innb="${itmCnList2.qesitmInnb}" ${selected}>
${itmCnList2.itmCn}
</option>
</c:if>
</c:forEach>
</select>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '03'}">
<%--체크박스 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }" class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answChkAt qesitmAtChk"
value="N">
<div class="b-checkbox-container">
<c:forEach items="${itmCnList}" var="itmCnList3">
<c:if test="${itmCnList3.qesitmInnb eq qesitmList.qesitmInnb}">
<label class="b-checkbox checkbox">
<input type="hidden" class="answChk"
name="qesitmInnbArr[]"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" class="answChk"
name="answCnArr[]"
value="${ itmCnList3.itmCn }" disabled>
<input type="checkbox" class="answChkC"
name="itmInnbArr[]"
value="${ itmCnList3.itmInnb }"
<c:forEach var="qesitmAnswList3" items="${qesitmAnswList}">
<c:if test="${qesitmAnswList3.itmInnb eq itmCnList3.itmInnb}">checked</c:if>
</c:forEach>>
<span class="check"></span>
<span class="control-label">${ itmCnList3.itmCn }</span>
</label>
</c:if>
</c:forEach>
</div>
</div>
</c:if>
<c:if test="${ qesitmList.itmTyCd eq '04'}">
<%--텍스트 유형--%>
<div class="reviewRadio__item">
<div class="reviewRadio__title">
<c:out value="${ qesitmList.qesitmNm }"/>
<c:if test="${qesitmList.qesitmEssntlAt eq 'Y'}">
<span class="required-asterisk">*</span>
</c:if>
</div>
<div class="reviewRadio__inputRow">
<c:forEach items="${itmCnList}" var="itmCnList4">
<c:if test="${itmCnList4.qesitmInnb eq qesitmList.qesitmInnb}">
<input type="hidden" name="qesitmEssntlAtArr[]"
value="${ qesitmList.qesitmEssntlAt }"
class="essntlChk">
<input type="hidden" name="qesitmNmArr[]"
value="${ qesitmList.qesitmNm }">
<input type="hidden" name="qesitmAtArr[]"
class="answTxtAt qesitmAtChk" value="N">
<input type="hidden" class="answTxt"
name="qesitmInnbArr[]"
value="${ qesitmList.qesitmInnb }" disabled>
<input type="hidden" class="answTxt"
name="itmInnbArr[]"
value="${ itmCnList4.itmInnb }" disabled>
<input class="input-text full answTxtC" type="text"
name="answCnArr[]" title="추가문항답변"
placeholder="${ itmCnList4.itmCn }"
maxlength="666"
itm-cn="${ itmCnList4.itmCn }"
qesitm-innb="${itmCnList4.qesitmInnb}"
itm-innb="${itmCnList4.itmInnb}"
<c:forEach var="qesitmAnswList4"
items="${qesitmAnswList}">
<c:if test="${qesitmAnswList4.itmInnb eq itmCnList4.itmInnb}">
value="<c:out value = '${qesitmAnswList4.answCn}'/>"
</c:if>
</c:forEach>>
</c:if>
</c:forEach>
</div>
</div>
</c:if>
</c:forEach>
</div>
</c:if>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">제목<span
class="required-asterisk">*</span></div>
<input class="input-text full" type="text" title="해당 인풋에 대한 설명" name="sj"
maxlength='100'
placeholder="제목을 입력하세요."
value="<c:out value = "${bbscttInfo.sj}"/>">
<c:if test="${bbsInfo.secretBbsctt eq 'Y'}">
<div class="b-checkbox-container">
<label class="b-checkbox is-medium checkbox">
<input type="checkbox" value="Y" name="secretBbscttAt"
<c:if test="${bbscttInfo.secretBbscttAt eq 'Y'}">checked</c:if>
onclick="fn_prevent_click(event);">
<span class="check"></span>
<span class="control-label">비밀글</span>
</label>
</div>
</c:if>
</div>
<div class="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">내용</div>
<textarea class="textarea" rows="12" title="내용 입력란" id="cnBbsUpdt" name = "cn">
<c:out value="${bbscttInfo.cn}"/>
</textarea>
</div>
<%--게시판설정(파일첨부사용여부)--%>
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.extensions.images')" var="acceptFileExtensions"/>
<c:if test="${bbsInfo.filAtch eq 'Y'}">
<div class="fileUplaod">
<div class="fileUplaod__title">이미지 등록</div>
<div class="dropzone-wrapper">
<div class="dropzone" id="image-dropzone"></div>
</div>
<ul class="infoList">
<li>사진첨부는 최대 10MB 이하이며 3개까지 등록할 수 있습니다.</li>
<li>등록 가능 파일은 ${acceptFileExtensions} 파일만 가능합니다.</li>
<li>상품과 무관한 내용이거나 음란 불법적인 내용은 통보없이 삭제할 수 있습니다.</li>
</ul>
</div>
<input type = "hidden" name = "acceptFileExtensions" id = "acceptFileExtensions" value = "${acceptFileExtensions}"/>
</c:if>
<div class="bottomBtnControls">
<button type="button" class="btn xl theme" id = "updtBtn"><spring:message code="button.update"/>하기</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</main>
</div>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/comm/mobile/Footer.jsp"/>
</div>
</body>
<%--수정 성공 모달--%>
<button type="button" style="display:none;" data-micromodal-trigger="successUpdtModal" id = "successBtn"></button>
<div class="microModal microAlert" id="successUpdtModal" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
<spring:message code="success.common.update"/>
</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn microModal__btn-primary" id = "alertBtn"><spring:message code="button.ok"/></button>
</div>
</div>
</div>
</div>
<%--수정 컨펌 모달--%>
<button type="button" style="display:none;" data-micromodal-trigger="confirmUpdtModal" id = "confirmBtn"></button>
<div class="microModal microAlert" id="confirmUpdtModal" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title">
<spring:message code="confirm.common.update"/>
</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button class="microModal__btn" data-micromodal-close aria-label="창 닫기" id = "clsConfirmPopBtn"><spring:message code="button.cancel"/></button>
<button class="microModal__btn microModal__btn-primary" id = "confirmPopBtn"><spring:message code="button.ok"/></button>
</div>
</div>
</div>
</div>
<script>
// Dropzone 파일업로드
if ($("#image-dropzone").length > 0) {
const maxFiles = 3;
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("#image-dropzone", {
url: "/file-upload",
maxFilesize: 10,
maxFiles: maxFiles,
acceptedFiles: "${acceptFileExtensions}",
autoProcessQueue: false,
addRemoveLinks: true,
dictDefaultMessage: "",
dictRemoveFile: "삭제",
dictCancelUpload: "취소",
dictCancelUploadConfirmation: "업로드를 취소하시겠습니까?",
dictInvalidFileType: "이 파일은 업로드할 수 없습니다.",
dictFileTooBig: "파일이 너무 큽니다. ({{filesize}}MB). 최대 파일 크기: {{maxFilesize}}MB.",
dictMaxFilesExceeded: "파일을 더 이상 추가할 수 없습니다.",
dictResponseError: "서버에서 응답을 받지 못했습니다.",
init: function () {
let dropzoneInstance = this;
let imageData = ${fileInfoGson};
// 각 이미지를 Dropzone에 추가
$.each(imageData, function (index, image) {
// Dropzone 파일 객체 생성
let mockFile = {name: image.orginlFilNm, size: image.filMg};
dropzoneInstance.emit("addedfile", mockFile);
const cdnurl = '<c:out value="${cdnurl}"/>';
const imagePath = cdnurl + image.filCours + image.sysFilNm;
dropzoneInstance.emit("thumbnail", mockFile, imagePath);
// 이미지 오류 처리
$(mockFile.previewElement).find("img").on("error", function () {
this.src = '/mobile/images/image_placeholder.png'; // 대체 이미지 경로로 설정
});
// Dropzone에 파일 추가
mockFile.customId = image.bbscttAtchmnfilInnb;
dropzoneInstance.files.push(mockFile);
});
// 파일이 삭제될 때마다 호출되는 이벤트 핸들러
this.on("removedfile", function (file) {
const result = dropzoneDeleteFiles("" + file.customId + "", '<c:out value="${bbscttVO.sopmalCd}"/>', "BDFL", 1);
if (result === "N") {//파일 삭제 안할 시 복원
file.customData = {restored: true, customId: file.customId}; //삭제 취소에 의한 구분자 부여
myDropzone.emit("addedfile", file); // 파일을 다시 추가하여 삭제 취소
myDropzone.emit("thumbnail", file, file.dataURL); // 파일의 썸네일을 복원
}
if (myDropzone.files.length < maxFiles) {
$(".dz-message").show();
}
});
//파일 추가
this.on("addedfile", function (file) {
let restoreAt = '';
if (file.customData) { //파일 삭제 복구시
restoreAt = true;
} else {//새파일 추가시
restoreAt = false;
}
if (restoreAt) {// 파일 삭제 복구시 해당 id 재부여
file.customId = file.customData.customId;
} else {//새파일 추가시 임시 id 부여
let fileLength = myDropzone.files.length;
file.customId = "temp" + fileLength;
if (fileLength > maxFiles) {
const dictMaxFilesExceeded = myDropzone.options.dictMaxFilesExceeded;
alert(dictMaxFilesExceeded);
this.removeFile(file);
$(file.previewElement).find(".dz-remove").attr("disabled", true);
}
}
});
// maxFiles 제한 관련 이벤트 핸들러
this.on("maxfilesexceeded", function (file) {
const dictMaxFilesExceeded = myDropzone.options.dictMaxFilesExceeded;
alert(dictMaxFilesExceeded);
this.removeFile(file);
});
}
});
var inputElement = $('input[type="file"].dz-hidden-input');
// name 부여
inputElement.attr('name', 'file');
// id 부여
inputElement.attr('id', 'fileUpload');
if (myDropzone.files.length < maxFiles) {
$(".dz-message").show();
} else {
$(".dz-message").hide();
}
}
//뒤로가기 이벤트 삭제 후 상품문의 페이지로 이동 (수정 후 바로 목록으로 이동)
$(".header__toBack__btn").off("click")
.on("click",function(){
window.location.href="/sopmal/mpage/act/selectGoodsQnaInqire?bbsId=goods_qna";
});
</script>
</html>

Some files were not shown because too many files have changed in this diff Show More