itfirst/sake
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix : 쇼핑몰 구독서비스 관련(모바일)

Browse Source
This commit is contained in:
이대환
2026-01-29 12:08:55 +09:00
parent c0d7079e37
commit 77060045ca
3 changed files with 240 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

182
src/main/webapp/WEB-INF/views/sopmal_m/main/SubscribeR.jsp Normal file
View File

@@ -0,0 +1,182 @@
<%@ 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"/>
<spring:eval expression="@environment.getProperty('currency-unit.default')" var="curUnit"/>
</head>
<script>
$(document).ready(function() {
$(".header__title").text("구독 서비스");
var subsvcInnb = $('[name="subsvcInnb"]:checked').val();
fn_select_subsvcDetail(subsvcInnb);
});
/******************************************************
* 구독서비스 상세 조회
* ****************************************************/
const fn_select_subsvcDetail = function(subsvcInnb) {
var curUnit = '${curUnit}';
$.ajax({
type: "post",
url : '<c:url value="/sopmal/main/selectSubscribeDetail"/>',
data : {
subsvcInnb : subsvcInnb
},
success: function (data) {
data = JSON.parse(data.resBody.result);
data = data.resultMap;
$('#subsvcNm').text(data.subsvcConcatNm);
$('#subPd').text(data.subPd);
$('#dlvyCnt').text(data.dlvyCnt);
$('#dlvyCycle').text(data.dlvyCycle);
$('#cnsmrpric').text(fn_format_number(data.cnsmrpric) + curUnit);
$('#selpric').text(fn_format_number(data.selpric) + curUnit);
$('#dscntRaito').text(data.dscntRaito + '%');
$('#subsvcDc').html(data.subsvcDc);
switch (data.subsvcSttusCd) {
case '01':
$('#subscribeBtn').text('구독하기');
$('#subscribeBtn').prop('disabled', false);
break;
case '02':
case '03':
$('#subscribeBtn').text(data.subsvcSttus);
$('#subscribeBtn').prop('disabled', true);
break;
default:
break;
}
}
});
}
const fn_format_number = function(number) {
return Number(number).toLocaleString();
}
</script>
<style>
.sub-box {
padding: 16px;
}
#subsvcDc {
padding: clamp(12px, 3%, 18px);
border-radius: 8px;
border: 1px solid #dee2e6;
margin-bottom: 20px;
}
</style>
<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="ck-content">
<c:out value="${ resultMap.sopmalInfo[0].subsvcGuidanceWords }" escapeXml="false"/>
</div>
</div>
<div class="sub-box">
<div class="productDetailInfo">
<div class="productDetailInfo__titleWrap">
<span id="subsvcNm" class="productDetailInfo__title">
구독서비스명
</span>
</div>
<div class="productDetailInfo__price">
<div class="productDetailInfo__price__price">
<span id="cnsmrpric" class="productDetailInfo__price__original"></span>
<span id="selpric" class="productDetailInfo__price__current"></span>
</div>
<div class="productDetailInfo__price__sale">
<span id="dscntRaito" class="percent" style="color: red">%</span>
</div>
</div>
<div id="subsvcDc" class="ck-content">
구독 서비스 상품 설명
</div>
<div class="productDetailInfo__info">
<dl>
<dt>구독기간</dt>
<dd>
<span id="subPd"></span>개월
</dd>
</dl>
<dl>
<dt>배송횟수</dt>
<dd>
<span id="dlvyCnt"></span>회
</dd>
</dl>
<dl>
<dt>배송주기</dt>
<dd>
<span id="dlvyCycle"></span>
</dd>
</dl>
</div>
</div>
<div class="productDetailInfo">
<div class="productDetailInfo__body">
<button type="button" class="btn full md gray" onclick="openModal('product-option-sheet')">
옵션선택
</button>
</div>
</div>
<div class="productDetailInfo">
<div class="productDetailInfo__body">
<button type="button" class="btn full theme">구매하기</button>
</div>
</div>
</div>
</div>
</main>
<!-- 푸터 -->
<jsp:include page="/WEB-INF/views/comm/mobile/Footer.jsp"/>
</div>
</div>
<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 class="microModal__close" aria-label="창 닫기" data-micromodal-close></button>
</div>
<div class="microModal__content">
<div class="modalSelect">
<div class="modalSelect__list">
<c:forEach var="subsvcList" items="${resultMap.subsvcList}" varStatus="status">
<label class="modalSelect__item">
<input type="radio" name="subsvcInnb" value="${subsvcList.subsvcInnb}" onchange="fn_select_subsvcDetail(this.value); MicroModal.close('product-option-sheet');" <c:if test="${status.first}">checked</c:if>>
<span>${subsvcList.subsvcConcatNm}</span>
</label>
</c:forEach>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>