sake/src/main/webapp/WEB-INF/views/sopmal/mpage/mbr/MbrSecsnU.jsp

<%@ 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 : MbrSecsnU.jsp
	Description : 회원 탈퇴.jsp
	Modification Information

	수정일 수정자 수정내용
	------- -------- ---------------------------
	2024-02-27 추지훈 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">

<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/Include.jsp"/>
</head>


<script>
    $(document).ready(function() {


        fn_display_ctrl();

    });



/* ********************************************************
 *   회원 탈퇴 함수
 ******************************************************** */
const fn_display_ctrl = function() {

    $('.termCheck').on('change', function() {
        const isChecked = $('.termCheck').is(':checked');
    });

    $("select[name='secsnResn']").niceSelect();
};
/* ********************************************************
 *   회원 탈퇴 함수
 ******************************************************** */
const fn_regist_mbr_secsn = function () {
    let secsnResn = $("select[name='secsnResn']").val();
    const isChecked = $('.termCheck').is(':checked');
    if (isChecked) {
        if (confirm('회원 탈퇴하시겠습니까?')) {
            $.ajax({
                type: "post",
                url: '<c:url value="/sopmal/mpage/mbr/updateMbrSecsn"/>',
                data: {secsnResn: secsnResn},
                success: function (data) {
                    alert('정상적으로 탈퇴 되었습니다.');
                    location.href ="/logout";
                }
            });
        }
    }else{
        alert("정보 삭제 동의에 체크해야합니다.");
        $('.termCheck').focus();
    }
};
</script>


<body>

    <%-- 공통 Header --%>
    <jsp:include page="/WEB-INF/views/comm/Header.jsp"/>

    <!-- 메인 컨텐츠 영역 -->
    <main>
        <div class="sub-wrapper">
            <div class="sub-content">
                <div class="sub-rl">
                    <%-- 마이페이지 Left 영역 --%>
                    <jsp:include page="/WEB-INF/views/comm/mpage/MypageLeft.jsp"/>
                    <div class="sub-right-content">
                        <form id="registForm">
                            <div class="sub-right-content__section">
                                <h3 class="sub-right-content__title">회원탈퇴</h3>
								<h3 class="sub-right-content__title" style="text-align: center;">탈퇴하시면 혜택이 모두 사라져요</h3>
                                <div class="deleteAccount__image signUp-promotion__col-3 ck-content">
									<c:out value='${resultMap.sopmalInfo.joinBnef}' escapeXml='false'/>
								</div>
                                <p class="deleteAccount__title">탈퇴 신청</p>
                                <div class="deleteAccount">
                                    <div class="deleteAccount__item">
                                        <div class="deleteAccount__itemTitle">탈퇴 사유</div>
                                        <div class="select-box">
                                            <select class="lg" title="해당 셀렉트에 대한 설명" name="secsnResn">
                                                <option value="" disabled selected>탈퇴 사유를 선택해 주세요.</option>
                                                <option value="배송 주문 불만족">배송 주문 불만족</option>
                                                <option value="사이트 이용 불편">사이트 이용 불편</option>
                                                <option value="상품품질 불만족">상품품질 불만족</option>
                                                <option value="서비스 불만족">서비스 불만족</option>
                                                <option value="기타">기타</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="deleteAccount__item">
                                        <div class="deleteAccount__itemTitle">내용</div>
                                        <textarea class="textarea" rows="9" title="해당 텍스트 에어리어에 대한 설명" placeholder="" id="memo" name="memo"></textarea>
                                    </div>
                                    <div class="infoBox">
                                        <p class="textInfo"><i class="icon icon_textInfo--sm"></i>회원탈퇴 시 회원님의 개인정보, 주문내역,
                                            마일리지, 쿠폰 등 모든 정보가 바로 삭제됩니다. 회원님의 모든 SNS계정 정보가 쇼핑몰에서 삭제 됩니다.
                                        </p>
                                    </div>
                                    <div class="b-checkbox-container">
                                        <label class="b-checkbox is-medium checkbox">
                                            <input class="termCheck" type="checkbox" value="">
                                            <span class="check"></span>
                                            <span class="control-label">예, 정보 삭제에 동의합니다.</span>
                                        </label>
                                    </div>
                                </div>
                                <div class="sub-bottom-btn-container">
                                    <button class="btn xl outline">취소</button>
                                    <button type="button" class="btn xl theme" onclick="fn_regist_mbr_secsn();">탈퇴하기</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </main>
    <%-- 공통 Footer --%>
    <jsp:include page="/WEB-INF/views/comm/Footer.jsp"/>

    <script>
        //변경 버튼 클릭시, 변경할 내용 노출
        var editBtn = $('.editAccount__editBtn');
        var editContent = $('.editAccount__editContent');

        editContent.hide();

        editBtn.on('click', function () {
            var $this = $(this);
            var $thisContent = $this.closest('td').find('.editAccount__editContent');

            if ($thisContent.is(':visible')) {
                $thisContent.hide();
            } else {
                editContent.hide();
                $thisContent.show();
            }
        });


        //휴대폰 인증 버튼 클릭시, 휴대폰 인증 박스 노출
        var phoneAuthBtn = $('#phoneAuthBtn');
        var phoneAuthContent = $('#phoneAuthContent');

        phoneAuthContent.hide();

        phoneAuthBtn.click(function () {
            phoneAuthContent.show();
        });





    </script>


    <!-- 모달  -->


</body>

</html>