145 lines
6.2 KiB
Plaintext
145 lines
6.2 KiB
Plaintext
<%@ 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> |