초기소스
This commit is contained in:
jazz
296
src/main/webapp/WEB-INF/views/comm/mobile/Footer.jsp
Normal file
296
src/main/webapp/WEB-INF/views/comm/mobile/Footer.jsp
Normal file
@@ -0,0 +1,296 @@
|
||||
<%@ 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" %>
|
||||
<footer class="footer">
|
||||
<ul class="footer__first">
|
||||
<c:if test="${!empty sopmallInfo}">
|
||||
<c:forEach var="topMenuList" items="${sopmallInfo.menuList}" varStatus="status">
|
||||
<c:if test="${ topBarInfo.topbar.gnbTyCd eq '04'}">
|
||||
<li>
|
||||
<a href='<c:out value="${topMenuList.url}"/>' onclick="setTopMenuCode()">
|
||||
<c:choose>
|
||||
<c:when test = "${fn:contains(topMenuList.url,'/sopmal/main/selectClause?stplatDvCd=02')}">
|
||||
<strong><c:out value="${topMenuList.ctgryNm}"/></strong>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<c:out value="${topMenuList.ctgryNm}"/>
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</c:if>
|
||||
</ul>
|
||||
<div class="footer__second">
|
||||
<button type="button" class="footer__second__detailBtn">사업자 정보 확인</button>
|
||||
<c:if test = "${not empty footerInfo.footerInfo.familySite}">
|
||||
<select class="family-site-link" title="해당 셀렉트에 대한 설명">
|
||||
<option value="" disabled selected>FAMILY SITE</option>
|
||||
<c:forEach var = "familySite" items = "${footerInfo.footerInfo.familySite}">
|
||||
<option value="<c:out value="${familySite.familySiteUrl}"/>"><c:out value="${familySite.familySiteNm}"/></option>
|
||||
</c:forEach>
|
||||
</select>
|
||||
</c:if>
|
||||
</div>
|
||||
<div class="footerHide">
|
||||
<c:set var="operBsnmInfo" value="${footerInfo.footerInfo.operBsnmInfo}"/>
|
||||
<c:set var="sleBsnmInfo" value="${footerInfo.footerInfo.sleBsnmInfo}"/>
|
||||
<c:set var="sopmalInfo" value="${footerInfo.footerInfo.sopmalInfo}"/>
|
||||
<c:set var="scriptSetup" value="${footerInfo.footerInfo.scriptSetup}"/>
|
||||
|
||||
<ul class="footer__third">
|
||||
<c:choose>
|
||||
<c:when test="${operBsnmInfo.bsnmInnb ne sleBsnmInfo.bsnmInnb}">
|
||||
<li>
|
||||
<span class="footer__third__th">판매사업자</span>
|
||||
<span class="footer__third__td">
|
||||
<c:out value="${sleBsnmInfo.bsnmNm}"/>
|
||||
</span>
|
||||
</li>
|
||||
<li><span class="footer__third__th">대표자</span><span class="footer__third__td"><c:out value="${sleBsnmInfo.reprsntvnm}"/></span></li>
|
||||
<li><span class="footer__third__th">주소</span><span class="footer__third__td">
|
||||
<c:choose>
|
||||
<c:when test = "${not empty sleBsnmInfo.rnmAdres && not empty sleBsnmInfo.lnbAdres}">
|
||||
<c:out value="${sleBsnmInfo.lnbAdres}"/>
|
||||
</c:when>
|
||||
<c:when test = "${empty operBsnmInfo.rnmAdres && not empty sleBsnmInfo.lnbAdres}">
|
||||
<c:out value="${sleBsnmInfo.lnbAdres}"/>
|
||||
</c:when>
|
||||
<c:when test = "${not empty sleBsnmInfo.rnmAdres && empty sleBsnmInfo.lnbAdres}">
|
||||
<c:out value="${sleBsnmInfo.rnmAdres}"/>
|
||||
</c:when>
|
||||
</c:choose> <c:out value="${sleBsnmInfo.dtlAdres}"/></span></li>
|
||||
<li><span class="footer__third__th">대표전화</span><span class="footer__third__td"><c:out value="${sopmalInfo.reprsntTelnb}"/></span>
|
||||
</li>
|
||||
<li><span class="footer__third__th">대표이메일</span>
|
||||
<a href="mailto:<c:out value='${sopmalInfo.reprsntEmail}'/>" class="footer__third__td"><strong><c:out value="${sopmalInfo.reprsntEmail}"/></strong></a>
|
||||
</li>
|
||||
<li><span class="footer__third__th">사업자 등록번호</span><span
|
||||
class="footer__third__td"><c:out value="${sleBsnmInfo.bizrnb}"/></span>
|
||||
[ <a href="javascript:;" onclick="window.open('https://www.ftc.go.kr/bizCommPop.do?wrkr_no=<c:out value="${sleBsnmInfo.replaceBizrnb}"/>','communicationViewPopup','width=750,height=700,scrollbars=yes')" class="footer__underLine">사업자정보확인</a> ]
|
||||
</li>
|
||||
<li><span class="footer__third__th">개인정보관리책임자</span><span class="footer__third__td"><c:out value="${sleBsnmInfo.indvdlinfoPrtcRspnberNm}"/></span>
|
||||
</li>
|
||||
<li><span class="footer__third__th">통신판매업 신고번호</span><span class="footer__third__td"><c:out value="${sleBsnmInfo.mobDclNb}"/></span></li>
|
||||
<li>[ <a onclick="openModal('selerInfo');" class="footer__underLine">판매자 정보</a> ]
|
||||
[ <a onclick="fn_get_indvdlInfoPorcsCn();" class="footer__underLine">판매자 개인정보 처리방침</a> ]</li>
|
||||
</ul>
|
||||
<div class="footer__logo">
|
||||
</div>
|
||||
<ul class="footer__third" style="font-size:12px; color:#888888;">
|
||||
<li>
|
||||
통신판매중개사업자 | <c:out value="${operBsnmInfo.bsnmNm}"/>
|
||||
</li>
|
||||
<li>대표자 | <c:out value="${operBsnmInfo.reprsntvnm}"/></li>
|
||||
<li>주소 |
|
||||
<c:choose>
|
||||
<c:when test = "${not empty operBsnmInfo.rnmAdres && not empty operBsnmInfo.lnbAdres}">
|
||||
<c:out value="${operBsnmInfo.lnbAdres}"/>
|
||||
</c:when>
|
||||
<c:when test = "${empty operBsnmInfo.rnmAdres && not empty operBsnmInfo.lnbAdres}">
|
||||
<c:out value="${operBsnmInfo.lnbAdres}"/>
|
||||
</c:when>
|
||||
<c:when test = "${not empty operBsnmInfo.rnmAdres && empty operBsnmInfo.lnbAdres}">
|
||||
<c:out value="${operBsnmInfo.rnmAdres}"/>
|
||||
</c:when>
|
||||
</c:choose> <c:out value="${operBsnmInfo.dtlAdres}"/></span></li>
|
||||
<li>대표전화 | <c:out value="${operBsnmInfo.telnb}"/>
|
||||
</li>
|
||||
<li>대표이메일 |
|
||||
<a href="mailto:<c:out value='${operBsnmInfo.email}'/>"><c:out value="${operBsnmInfo.email}"/></a>
|
||||
</li>
|
||||
<li>사업자 등록번호 | <c:out value="${operBsnmInfo.bizrnb}"/>
|
||||
[ <a href="javascript:;" onclick="window.open('https://www.ftc.go.kr/bizCommPop.do?wrkr_no=<c:out value="${operBsnmInfo.replaceBizrnb}"/>','communicationViewPopup','width=750,height=700,scrollbars=yes')">사업자정보확인</a> ]
|
||||
</li>
|
||||
<li>개인정보관리책임자 | <c:out value="${operBsnmInfo.indvdlinfoPrtcRspnberNm}"/>
|
||||
</li>
|
||||
<li>통신판매업 신고번호 | <c:out value="${operBsnmInfo.mobDclNb}"/></li>
|
||||
</ul>
|
||||
<br/>
|
||||
<p class="footer__description">
|
||||
<c:out value="${operBsnmInfo.bsnmNm}"/>는 통신판매중계자이며, 통신판매의 당사자가
|
||||
아닙니다. 상품 및 거래와 관련한 의무와 책임은 판매자에게 있습니다.</p>
|
||||
<p class="footer__copyright">ⓒ<c:out value="${operBsnmInfo.bsnmNm}"/> All rights reserved.</p>
|
||||
<%--로딩이미지--%>
|
||||
<img src="/mobile/images/loading.svg" style = "display:none" class = "loadingImg">
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<li>
|
||||
<span class="footer__third__th">사업자명</span>
|
||||
<span class="footer__third__td">
|
||||
<c:out value="${operBsnmInfo.bsnmNm}"/>
|
||||
</span>
|
||||
</li>
|
||||
<li><span class="footer__third__th">대표자</span><span class="footer__third__td"><c:out value="${operBsnmInfo.reprsntvnm}"/></span></li>
|
||||
<li><span class="footer__third__th">주소</span><span class="footer__third__td">
|
||||
<c:choose>
|
||||
<c:when test = "${not empty operBsnmInfo.rnmAdres && not empty operBsnmInfo.lnbAdres}">
|
||||
<c:out value="${operBsnmInfo.lnbAdres}"/>
|
||||
</c:when>
|
||||
<c:when test = "${empty operBsnmInfo.rnmAdres && not empty operBsnmInfo.lnbAdres}">
|
||||
<c:out value="${operBsnmInfo.lnbAdres}"/>
|
||||
</c:when>
|
||||
<c:when test = "${not empty operBsnmInfo.rnmAdres && empty operBsnmInfo.lnbAdres}">
|
||||
<c:out value="${operBsnmInfo.rnmAdres}"/>
|
||||
</c:when>
|
||||
</c:choose> <c:out value="${operBsnmInfo.dtlAdres}"/></span></li>
|
||||
<li><span class="footer__third__th">대표전화</span><span class="footer__third__td"><c:out value="${sopmalInfo.reprsntTelnb}"/></span>
|
||||
</li>
|
||||
<li><span class="footer__third__th">대표이메일</span>
|
||||
<a href="mailto:<c:out value='${sopmalInfo.reprsntEmail}'/>" class="footer__third__td"><strong><c:out value="${sopmalInfo.reprsntEmail}"/></strong></a>
|
||||
</li>
|
||||
<li><span class="footer__third__th">사업자 등록번호</span><span
|
||||
class="footer__third__td"><c:out value="${operBsnmInfo.bizrnb}"/></span>
|
||||
<a href="javascript:;" onclick="window.open('https://www.ftc.go.kr/bizCommPop.do?wrkr_no=<c:out value="${operBsnmInfo.replaceBizrnb}"/>','communicationViewPopup','width=750,height=700,scrollbars=yes')" class="footer__underLine">사업자정보확인</a>
|
||||
</li>
|
||||
<li><span class="footer__third__th">개인정보관리책임자</span><span class="footer__third__td"><c:out value="${operBsnmInfo.indvdlinfoPrtcRspnberNm}"/></span>
|
||||
</li>
|
||||
<li><span class="footer__third__th">통신판매업 신고번호</span><span class="footer__third__td"><c:out value="${sleBsnmInfo.mobDclNb}"/></span></li>
|
||||
</ul>
|
||||
<div class="footer__logo">
|
||||
</div>
|
||||
<p class="footer__copyright">ⓒ<c:out value="${sleBsnmInfo.bsnmNm}"/> All rights reserved.</p>
|
||||
<%--로딩이미지--%>
|
||||
<img src="/mobile/images/loading.svg" style = "display:none" class = "loadingImg">
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
</footer>
|
||||
<div class="microModal microBottomSheet" id="selerInfo" 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="deliveryFeeInfo">
|
||||
<div class="deliveryFeeInfo__item">
|
||||
<div class="deliveryFeeInfo__controls">
|
||||
<em>판매자 정보</em>
|
||||
</div>
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width: 40%;">
|
||||
<col style="width: 60%;">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>상호명</th>
|
||||
<td><c:out value="${sleBsnmInfo.bsnmNm}"/></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>대표자</th>
|
||||
<td><c:out value="${sleBsnmInfo.reprsntvnm}"/></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>사업자등록번호</th>
|
||||
<td><c:out value="${sleBsnmInfo.bizrnb}"/></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>통신판매업번호</th>
|
||||
<td><c:out value="${sleBsnmInfo.mobDclNb}"/></td>
|
||||
</tr>
|
||||
<c:if test="${not empty sleBsnmInfo.bsnDclNb}">
|
||||
<tr>
|
||||
<th>영업신고번호</th>
|
||||
<td><c:out value="${sleBsnmInfo.bsnDclNb}"/></td>
|
||||
</tr>
|
||||
</c:if>
|
||||
<tr>
|
||||
<th>사업장 소재지</th>
|
||||
<td><c:choose>
|
||||
<c:when test = "${not empty sleBsnmInfo.rnmAdres && not empty sleBsnmInfo.lnbAdres}">
|
||||
<c:out value="${sleBsnmInfo.lnbAdres}"/>
|
||||
</c:when>
|
||||
<c:when test = "${empty sleBsnmInfo.rnmAdres && not empty sleBsnmInfo.lnbAdres}">
|
||||
<c:out value="${sleBsnmInfo.lnbAdres}"/>
|
||||
</c:when>
|
||||
<c:when test = "${not empty sleBsnmInfo.rnmAdres && empty sleBsnmInfo.lnbAdres}">
|
||||
<c:out value="${sleBsnmInfo.rnmAdres}"/>
|
||||
</c:when>
|
||||
</c:choose><c:out value="${sleBsnmInfo.dtlAdres}"/></td>
|
||||
</tr>
|
||||
<c:if test="${footerInfo.footerInfo.sopmalInfo.cscTelnbOrdrPosblAt eq 'Y' && not empty footerInfo.footerInfo.sopmalInfo.cscTelnb}">
|
||||
<tr>
|
||||
<th>고객센터</th>
|
||||
<td><c:out value="${footerInfo.footerInfo.sopmalInfo.cscTelnb}"/></td>
|
||||
</tr>
|
||||
</c:if>
|
||||
<tr>
|
||||
<th>email</th>
|
||||
<td><c:out value="${sleBsnmInfo.email}"/></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<c:if test="${scriptSetup.scriptCnUseAt eq 'Y'}">
|
||||
${scriptSetup.scriptCn}
|
||||
</c:if>
|
||||
|
||||
<div class="microModal microFullScreen" id="indvdlInfoProcsModal" 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">
|
||||
<h4 class="microModal__title" style="width:105%;">
|
||||
판매자 개인정보 처리방침
|
||||
</h4>
|
||||
<button class="microModal__close" aria-label="창 닫기" data-micromodal-close></button>
|
||||
</div>
|
||||
<div class="microModal__content ck-content" id = "indvdlInfoProcsContent">
|
||||
<input type = "hidden" value = "N" id = "indvdlInfoProcsAjaxAt"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
/*판매자 개인정보 처리방침 조회*/
|
||||
const fn_get_indvdlInfoPorcsCn = () => {
|
||||
const indvdlInfoProcsAjaxAt = $("#indvdlInfoProcsAjaxAt").val();
|
||||
if (indvdlInfoProcsAjaxAt === 'N') {
|
||||
$.ajax({
|
||||
type: 'post',
|
||||
url: "/sopmal/main/selectIndvdlInfoProcsCn",
|
||||
data : {stplatDvCd : '08'},
|
||||
success: function (data) {
|
||||
data = data.resBody.result;
|
||||
data = JSON.parse(data);
|
||||
let clauseList = data.clauseList;
|
||||
if (clauseList) {
|
||||
let i = 0;
|
||||
clauseList.forEach(function (item) {
|
||||
if (i === 0) {
|
||||
$("#indvdlInfoProcsAjaxAt").after(item.stplatCn);
|
||||
return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
$("#indvdlInfoProcsAjaxAt").val("Y");
|
||||
}
|
||||
});
|
||||
}
|
||||
openModal('indvdlInfoProcsModal');
|
||||
};
|
||||
</script>
|
||||
|
||||
<c:if test="${sopmallInfo.shopInfo.sopmalCd eq 'DL'}">
|
||||
<script>
|
||||
(function(){var w=window;if(w.ChannelIO){return w.console.error("ChannelIO script included twice.");}var ch=function(){ch.c(arguments);};ch.q=[];ch.c=function(args){ch.q.push(args);};w.ChannelIO=ch;function l(){if(w.ChannelIOInitialized){return;}w.ChannelIOInitialized=true;var s=document.createElement("script");s.type="text/javascript";s.async=true;s.src="https://cdn.channel.io/plugin/ch-plugin-web.js";var x=document.getElementsByTagName("script")[0];if(x.parentNode){x.parentNode.insertBefore(s,x);}}if(document.readyState==="complete"){l();}else{w.addEventListener("DOMContentLoaded",l);w.addEventListener("load",l);}})();
|
||||
|
||||
|
||||
ChannelIO('boot', {
|
||||
"pluginKey": "f73ed102-2f9c-44ff-ab17-dc18045401a2" // fill your plugin key
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</c:if>
|
||||
44
src/main/webapp/WEB-INF/views/comm/mobile/Header.jsp
Normal file
44
src/main/webapp/WEB-INF/views/comm/mobile/Header.jsp
Normal 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"%>
|
||||
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
|
||||
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
||||
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
|
||||
<div class="header__wrapper">
|
||||
<div class="header__controls-wrapper">
|
||||
<div class="header__controls">
|
||||
<div class="header__toBack">
|
||||
<c:if test = "${!(fn:contains('/sopmal/ordr/selectOrdrCompt',accessUri)||fn:contains('/sopmal/ordr/selectOrdrFailr',accessUri))}"><%--주문완료와 주문실패는 뒤로가기 버튼 미노출--%>
|
||||
<button type="button" class="header__toBack__btn" >
|
||||
<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" id="headerTitle"></h1><%--각자 페이지에 맞게 set해야함--%>
|
||||
<div class="header__btn-container">
|
||||
<button class="header__btn" onclick="fn_search_open();" type="button"><i class="icon icon_nav-search"></i><span
|
||||
class="visually-hidden">검색</span></button>
|
||||
<button type="button" class="header__btn" onclick="location.href='/sopmal/ordr/selectSpbk';">
|
||||
<span class="number-badge headerCartCnt"><c:out value="${topBarInfo.cartCnt}"/></span>
|
||||
<i class="icon icon_nav-cart"></i>
|
||||
<span class="visually-hidden">장바구니</span>
|
||||
</button>
|
||||
<button type="button" class="header__btn" onclick="fn_select_mbrInfo('<c:out value="${cdnurl}"/>',${isAuthenticated}); openModal('hamburger-menu');">
|
||||
<i class="icon icon_nav-menu"></i>
|
||||
<span class="visually-hidden">메뉴</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
//뒤로가기 이벤트 부여, 각 페이지 마다 이벤트 삭제 후 다른 이벤트 사용 가능
|
||||
$(".header__toBack__btn").on("click",function (){
|
||||
fn_go_back();
|
||||
});
|
||||
</script>
|
||||
1163
src/main/webapp/WEB-INF/views/comm/mobile/Include.jsp
Normal file
1163
src/main/webapp/WEB-INF/views/comm/mobile/Include.jsp
Normal file
File diff suppressed because it is too large
Load Diff
93
src/main/webapp/WEB-INF/views/comm/mobile/MainHeader.jsp
Normal file
93
src/main/webapp/WEB-INF/views/comm/mobile/MainHeader.jsp
Normal file
@@ -0,0 +1,93 @@
|
||||
<%@ 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"%>
|
||||
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
|
||||
<!-- 헤더 영역 -->
|
||||
<header class="header">
|
||||
<c:choose>
|
||||
<c:when test = "${not empty topBarInfo.case15}">
|
||||
<!-- 최상단 띠배너 -->
|
||||
<div class="top-banner">
|
||||
<div class="swiper top-banner-swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<c:forEach items="${ topBarInfo.case15 }" var="case15" varStatus="status">
|
||||
<div class="swiper-slide top-banner__image">
|
||||
<a href="${ case15.itmeCnncUrl }">
|
||||
<img src="${cdnurl}${ case15.filCours }/${ case15.sysFilNm }"
|
||||
alt="해당 이미지에 대한 설명">
|
||||
</a>
|
||||
</div>
|
||||
</c:forEach>
|
||||
</div>
|
||||
</div>
|
||||
<div class=" top-banner__btn-container">
|
||||
<button class="top-banner__close">
|
||||
<span class="visually-hidden">닫기</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<!-- 최상단 띠배너 -->
|
||||
<div class="top-banner" style="display: none;">
|
||||
</div>
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
|
||||
<div class="header__wrapper">
|
||||
<div class="header__controls-wrapper">
|
||||
<div class="header__controls">
|
||||
<a class="header__home-link" href="">
|
||||
<img src="${ cdnurl }${ topBarInfo.topbar.topFilCours }/${ topBarInfo.topbar.topSysFilNm }" alt="<c:out value="${sopmallInfo.shopInfo.sopmalNm}"/>">
|
||||
</a>
|
||||
<div class="header__btn-container">
|
||||
<button class="header__btn" onclick="fn_search_open();" type="button">
|
||||
<i class="icon icon_nav-search"></i>
|
||||
<span class="visually-hidden">검색</span>
|
||||
</button>
|
||||
|
||||
<!-- <button class="header__btn" onclick="setTopMenuCode(); location.href='/sopmal/ordr/selectSpbk';"> -->
|
||||
<button class="header__btn" onclick="location.href='/sopmal/ordr/selectSpbk';">
|
||||
<span class="number-badge headerCartCnt">${ topBarInfo.cartCnt }</span>
|
||||
<i class="icon icon_nav-cart"></i><span class="visually-hidden">장바구니</span></button>
|
||||
<button class="header__btn" onclick="fn_select_mbrInfo('<c:out value="${cdnurl}"/>',${isAuthenticated}); openModal('hamburger-menu');">
|
||||
<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">
|
||||
<c:if test="${!empty sopmallInfo}">
|
||||
<c:forEach var="topMenuList" items="${sopmallInfo.menuList}" varStatus="status">
|
||||
<c:if test="${topMenuList.ctgryDvCd eq '01' && topMenuList.menuExpsrAt eq 'Y'}">
|
||||
<c:if test="${topMenuList.rnum eq '2'}">
|
||||
<li class="home-category__item">
|
||||
<a href="<c:out value="${topMenuList.url}"/>" onclick="setTopMenuCode()" <c:if test="${not empty topMenuList.menuChrColor}"> style="color:${topMenuList.menuChrColor};"</c:if>><c:out value ="${topMenuList.ctgryNm}"/></a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</c:if>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
<script>
|
||||
// 상단 띠 배너 스크립트
|
||||
const topBannerSwiper = new Swiper(".top-banner-swiper", {
|
||||
loop: true,
|
||||
autoplay: {
|
||||
delay: 4000,
|
||||
},
|
||||
});
|
||||
|
||||
// 상단 띠 배너 닫기 버튼
|
||||
$(".top-banner__close").click(function () {
|
||||
$(".top-banner").remove();
|
||||
});
|
||||
</script>
|
||||
273
src/main/webapp/WEB-INF/views/comm/mobile/TabBar.jsp
Normal file
273
src/main/webapp/WEB-INF/views/comm/mobile/TabBar.jsp
Normal file
@@ -0,0 +1,273 @@
|
||||
<%@ 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="spring" uri="http://www.springframework.org/tags" %>
|
||||
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
|
||||
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
|
||||
<aside class="tab-bar">
|
||||
<nav class="tab-bar__nav">
|
||||
<a class="tab-bar__link" onclick="fn_select_mbrInfo('<c:out value="${cdnurl}"/>',${isAuthenticated}); openModal('hamburger-menu');">
|
||||
<i class="icon icon_tab-bar-category"></i>
|
||||
카테고리</a>
|
||||
|
||||
<a class="tab-bar__link" href="/sopmal/mpage/ordr/selectWslistInqireForm" id="tabBarWishOrBnft" data-sopmalcd="${sopmallInfo.shopInfo.sopmalCd}">
|
||||
<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="/sopmal/ordr/selectSpbk">
|
||||
<i class="icon icon_tab-bar-cart"></i>
|
||||
장바구니</a>
|
||||
<a class="tab-bar__link active" href="/sopmal/mpage/mbr/selectMpageMainInqire">
|
||||
<i class="icon icon_tab-bar-mypage"></i>
|
||||
마이페이지
|
||||
</a>
|
||||
</nav>
|
||||
<div class="tab-bar__bg">
|
||||
<div class="tab-bar__bg-fraction"></div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<!-- 햄버거 메뉴 모달 -->
|
||||
<div class="microModal microFullMenu" id="hamburger-menu" aria-hidden="true">
|
||||
<div class="microModal__overlay" tabindex="-1">
|
||||
<div class="microModal__container" role="dialog" aria-modal="true">
|
||||
<div class="microModal__body" id = "hambergerModal">
|
||||
<div class="microModal__top">
|
||||
<h2 class="microModal__title">
|
||||
전체메뉴
|
||||
</h2>
|
||||
<button type="button" class="microModal__close" onclick="closeModal('hamburger-menu');"></button>
|
||||
</div>
|
||||
<div class="microModal__content">
|
||||
<div class="fullMenu">
|
||||
<c:if test="${not isAuthenticated}">
|
||||
<div class="sub-box">
|
||||
<div class="fullMenu__top">
|
||||
<button type="button" class="btn md outline" onclick="fn_move_login();">로그인</button>
|
||||
<button type="button" class="btn md theme" onclick="location.href='/sopmal/mbr/selectJoinGuidance'; setTopMenuCode(); ">회원가입</button>
|
||||
</div>
|
||||
</div>
|
||||
</c:if>
|
||||
<div class="sub-box">
|
||||
<div class="fullMenu__top">
|
||||
<div class="member-rank-summary">
|
||||
<div class="textBtns">
|
||||
<a href="/sopmal/ordr/selectSpbk" class="textBtns__btn">장바구니</a>
|
||||
<c:choose>
|
||||
<c:when test="${isAuthenticated}"><%--회원일시--%>
|
||||
<a href="/sopmal/mpage/mbr/selectMpageMainInqire" class="textBtns__btn">마이페이지</a>
|
||||
<a href="/logout" class="textBtns__btn">로그아웃</a>
|
||||
</c:when>
|
||||
<c:otherwise><%--비회원일시--%>
|
||||
<a href="/sopmal/mpage/ordr/selectMbrOrdrListInqire" class="textBtns__btn">주문조회</a>
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
</div>
|
||||
<c:if test = "${isAuthenticated}">
|
||||
<div class="member-rank-summary__top">
|
||||
<div class="member-rank-summary__icon" id = "hambergerGradImg"></div>
|
||||
<a href="/sopmal/mpage/mbr/selectMpageMainInqire" class="member-rank-summary__user">
|
||||
<span class="member-rank-summary__rank" id = "hambergerGradNm"></span>
|
||||
<span class="member-rank-summary__name" id = "hambergermbrNm"></span>
|
||||
</a>
|
||||
<a class="member-rank-summary__benefit-link" href="/sopmal/mpage/bnef/selectMbrGradInqire">등급별 혜택</a>
|
||||
</div>
|
||||
<div class="member-rank-summary__bottom">
|
||||
<div class="member-rank-summary__summary">
|
||||
<a href="/sopmal/mpage/bnef/selectMlgDtlsInqireForm" class="member-rank-summary__summary-item">
|
||||
<img src="/mobile/images/icon_member-rank-mileage.png"
|
||||
alt="">
|
||||
<div class="member-rank-summary__summary-description">
|
||||
<span class="member-rank-summary__summary-name">마일리지</span>
|
||||
<p class="member-rank-summary__summary-numberContainer">
|
||||
<span
|
||||
class="member-rank-summary__summary-number comma"
|
||||
id = "hambergerMbrMlgAmt"></span>
|
||||
<span
|
||||
class="member-rank-summary__summary-numberUnit">원</span>
|
||||
</p>
|
||||
</div>
|
||||
</a>
|
||||
<a href="/sopmal/mpage/bnef/selectCouponDtlsForm" class="member-rank-summary__summary-item">
|
||||
<img src="/mobile/images/icon_member-rank-coupon.png" alt="">
|
||||
<div class="member-rank-summary__summary-description">
|
||||
<span class="member-rank-summary__summary-name">쿠폰</span>
|
||||
<p class="member-rank-summary__summary-numberContainer">
|
||||
<span class="member-rank-summary__summary-number comma" id = "hambergerCoupnCnt"></span>
|
||||
<span
|
||||
class="member-rank-summary__summary-numberUnit">장</span>
|
||||
</p>
|
||||
</div>
|
||||
</a>
|
||||
<a href="/sopmal/mpage/ordr/selectWslistInqireForm" class="member-rank-summary__summary-item">
|
||||
<img src="/mobile/images/icon_member-rank-wishlist.png" alt="">
|
||||
<div class="member-rank-summary__summary-description">
|
||||
<span class="member-rank-summary__summary-name">위시리스트</span>
|
||||
<p class="member-rank-summary__summary-numberContainer">
|
||||
<span class="member-rank-summary__summary-number comma"
|
||||
id = "hambergerWslistCnt"></span>
|
||||
<span
|
||||
class="member-rank-summary__summary-numberUnit">개</span>
|
||||
</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</c:if>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sub-box">
|
||||
<div class="menu_navigation_wrap">
|
||||
<!-- 카테고리 -->
|
||||
<ul class="side_menu accordion">
|
||||
<c:if test="${!empty sopmallInfo}">
|
||||
<c:forEach var="topMenuList" items="${sopmallInfo.menuList}" varStatus="status">
|
||||
<c:if test="${topMenuList.ctgryDvCd eq '01' && topMenuList.gnbExpsrAt eq 'Y'}">
|
||||
<c:if test="${topMenuList.rnum eq '2'}">
|
||||
<li class="isSub list">
|
||||
<div class="isSubDv">
|
||||
<a href="<c:out value="${topMenuList.url}"/>" class="depth"><c:out value ="${topMenuList.ctgryNm}"/><em class="visually-hidden">상세내용닫기</em></a>
|
||||
<a href="<c:out value="${topMenuList.url}"/>" class="moer"></a>
|
||||
</div>
|
||||
</c:if>
|
||||
<c:if test="${'3' eq topMenuList.rnum}">
|
||||
<!-- 메뉴 하위가 메뉴인 경우-->
|
||||
<c:if test="${chkUpperMenuCd ne topMenuList.upperCtgryId}">
|
||||
<ul class="view">
|
||||
</c:if>
|
||||
<li><a href='<c:out value="${topMenuList.url}"/>'><c:out value ="${topMenuList.ctgryNm}"/></a></li>
|
||||
<c:if test="${'0' eq topMenuList.nextDepth3 && '0' eq topMenuList.nextDepth2}">
|
||||
</ul>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:if>
|
||||
<c:if test="${topMenuList.rnum < 4}">
|
||||
<c:set var="chkUpperMenuCd" value="${ topMenuList.upperCtgryId }"/>
|
||||
</c:if>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</c:if>
|
||||
</ul>
|
||||
|
||||
<!-- 최근 본 상품(SIDE) -->
|
||||
<div class="recently_side" id="recentlySite">
|
||||
<!-- <div class="swiper recentlySide-swiper"> -->
|
||||
<!-- <div class="swiper-wrapper" id="recentlySite"> -->
|
||||
|
||||
<!-- <div class="swiper-slide recentlySide__image"> -->
|
||||
<!-- <a href=""> -->
|
||||
<!-- <img src="/mobile/images/상품이미지01.png" alt="해당 이미지에 대한 설명"> -->
|
||||
<!-- </a> -->
|
||||
<!-- </div> -->
|
||||
<!-- <div class="swiper-slide recentlySide__image"> -->
|
||||
<!-- <a href=""> -->
|
||||
<!-- <img src="/mobile/images/상품이미지01.png" alt="해당 이미지에 대한 설명"> -->
|
||||
<!-- </a> -->
|
||||
<!-- </div> -->
|
||||
<!-- <div class="swiper-slide recentlySide__image"> -->
|
||||
<!-- <a href=""> -->
|
||||
<!-- <img src="/mobile/images/상품이미지01.png" alt="해당 이미지에 대한 설명"> -->
|
||||
<!-- </a> -->
|
||||
<!-- </div> -->
|
||||
|
||||
<!-- <div class="swiper-slide recentlySide__image"> -->
|
||||
<!-- <a href=""> -->
|
||||
<!-- <img src="/mobile/images/상품이미지01.png" alt="해당 이미지에 대한 설명"> -->
|
||||
<!-- </a> -->
|
||||
<!-- </div> -->
|
||||
<!-- <div class="swiper-slide recentlySide__image"> -->
|
||||
<!-- <a href=""> -->
|
||||
<!-- <img src="/mobile/images/상품이미지01.png" alt="해당 이미지에 대한 설명"> -->
|
||||
<!-- </a> -->
|
||||
<!-- </div> -->
|
||||
|
||||
<!-- </div> -->
|
||||
<!-- <div class="swiper-pagination theme-pagination"></div> -->
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="sub-box">
|
||||
<div class="fullMenu__miscLinks">
|
||||
<h5 class="fullMenu__miscLinks__title">서비스</h5>
|
||||
<ul class="fullMenu__miscLinks__list">
|
||||
<li>
|
||||
<a href="/sopmal/csc/selectCscMainForm" class="fullMenu__miscLinks__link">고객센터</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<c:if test = "${sopmallInfo.shopInfo.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>
|
||||
<span class="notice__number"><c:out value="${sopmallInfo.shopInfo.cscTelnb}"/></span>
|
||||
<p class="notice__paragraph">
|
||||
<span class="notice__text01"><c:out value="${sopmallInfo.shopInfo.cscWkdayWorkTme}"/></span>
|
||||
<span class="notice__text02">(<c:out value="${sopmallInfo.shopInfo.cscLunchTme}"/>)</span>
|
||||
<br>
|
||||
<span class="notice__text03"><c:out value="${sopmallInfo.shopInfo.cscRstde}"/></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</c:if>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
////햄버거 메뉴 관련 스크립트
|
||||
// 좌측 메뉴 클릭시 해당 메뉴 보여주기
|
||||
$('.fullMenu__menu__btn').on('click', function () {
|
||||
$(this).addClass('current');
|
||||
$(this).closest('li').siblings().find('.fullMenu__menu__btn').removeClass('current');
|
||||
var index = $(this).closest('li').index() - 1; // 전체 메뉴 버튼을 뺀 나머지 버튼의 인덱스
|
||||
$(this).closest('.fullMenu__content').find('.fullMenu__itemSection').eq(index).siblings().hide();
|
||||
$(this).closest('.fullMenu__content').find('.fullMenu__itemSection').eq(index).show();
|
||||
});
|
||||
|
||||
// 전체 메뉴 클릭시 전체 메뉴 보여주기
|
||||
$('.fullMenuAll').on('click', function () {
|
||||
$(this).addClass('current');
|
||||
$(this).closest('li').siblings().find('.fullMenu__menu__btn').removeClass('current');
|
||||
$(this).closest('.fullMenu__content').find('.fullMenu__itemSection').show();
|
||||
});
|
||||
|
||||
//
|
||||
$('.hamburgerTabBtn').on('click', function () {
|
||||
$('.hamburgerTabBtn').removeClass('active');
|
||||
$(this).addClass('active');
|
||||
var index = $(this).closest('li').index();
|
||||
$('.fullMenu__content').removeClass('active');
|
||||
$('.fullMenu__content').eq(index).addClass('active');
|
||||
});
|
||||
|
||||
$(document).ready(function(){
|
||||
MicroModal.init({
|
||||
disableScroll: true,
|
||||
awaitCloseAnimation: true,
|
||||
});
|
||||
|
||||
$(".menu_navigation_wrap .depth").on('click', function () {
|
||||
/*하위레벨 없을 시 페이지 이동*/
|
||||
if ($(this).closest(".isSub").find(".view").length === 0) {
|
||||
const href = $(this).attr("href");
|
||||
location.href = href;
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user