mirror of
http://git.mhez-qa.uplus.co.kr/hubez/hubez-admin.git
synced 2025-12-07 05:39:35 +09:00
283 lines
8.3 KiB
Vue
283 lines
8.3 KiB
Vue
<template>
|
|
|
|
<!-- 버튼 -->
|
|
<div>
|
|
|
|
<!-- s: 팝업 -->
|
|
<div class="dimmed" @click="ModalClose();"></div>
|
|
<div class="popup-wrap">
|
|
|
|
|
|
<!-- 로그인실패: 확인 -->
|
|
<div class="popup modal01">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">로그인 실패</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>아이디,비밀번호를 확인해주세요.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- 로그인실패: 5회 -->
|
|
<div class="popup modal02">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">로그인 실패</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>로그인 5회 실패하였습니다.</p>
|
|
<p>비밀번호 초기화 후 비밀번호를 변경해 주세요.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 로그인실패: 상태 -->
|
|
<div class="popup modal03">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">로그인 실패</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>아이디 상태를 확인해 주세요.</p>
|
|
<p>(사용중인 상태만 로그인 가능합니다.)</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 보안 알림 -->
|
|
<div class="popup modal04">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">보안 알림</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>비밀번호를 변경하지 않은지 90일이</p>
|
|
<p>지났습니다. 비밀번호를 변경하여</p>
|
|
<p>이용 부탁드립니다.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="$router.push({ path: '/view/login/updatePassword' })">비밀번호 변경하기</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 중복 로그인 -->
|
|
<div class="popup modal05">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">중복 로그인</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>동일한 아이디로 로그인 되어 있습니다.</p>
|
|
<p>이전 로그인 세션 종료 후 로그인하시겠습니까?</p>
|
|
<p>확인 시 이전 로그인한 상태는 로그아웃됩니다.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 휴대폰번호 확인 -->
|
|
<div class="popup modal06">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">휴대폰번호 확인</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>휴대폰번호를 확인해주세요.</p>
|
|
<p>아이디에 등록된 휴대폰번호로만 인증이 가능합니다.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 인증번호: 발송 -->
|
|
<div class="popup modal07">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">인증번호 발송</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>인증번호를 발송하였습니다.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 인증번호: 입력 -->
|
|
<div class="popup modal08">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">인증번호 입력</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>인증번호를 입력하세요.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 인증실패: 인증번호 -->
|
|
<div class="popup modal09">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">인증실패</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>잘못된 인증번호입니다.</p>
|
|
<p>5회 실패 시 로그아웃됩니다.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 인증실패: 시간초과 -->
|
|
<div class="popup modal10">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">인증실패</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>인증시간 초과되었습니다.</p>
|
|
<p>다시 휴대폰번호를 입력해주세요.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 인증실패: 5회 -->
|
|
<div class="popup modal11">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">인증실패</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>인증번호 5회 실패하였습니다.</p>
|
|
<p>로그아웃되어 다시 로그인해주세요.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="$router.go(-1)">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 비밀번호 초기화 발송 -->
|
|
<div class="popup modal12">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">비밀번호 초기화</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>해당 아이디에 저장되어 있는 핸드폰번호로</p>
|
|
<p>비밀번호 초기화 문자가 발송되었습니다.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 아이디 오류 -->
|
|
<div class="popup modal13">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">아이디 오류</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>등록되지 않은 아이디입니다.</p>
|
|
<p>아이디를 다시 확인하세요</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 비밀번호 오류 -->
|
|
<div class="popup modal14">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">비밀번호 오류</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>비밀번호를 확인해주세요.</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 비밀번호 패턴 오류 -->
|
|
<div class="popup modal15">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">비밀번호 오류</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>비밀번호를 사용할 수 없습니다.</p>
|
|
<p>비밀번호는 영문/숫자/특수기호를 혼합하여</p>
|
|
<p>8~16자리로 설정해주세요</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="ModalClose();">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 비밀번호 정상 변경 -->
|
|
<div class="popup modal16">
|
|
<div class="pop-head">
|
|
<h3 class="pop-tit">비밀번호 오류</h3>
|
|
</div>
|
|
<div class="pop-cont">
|
|
<p>비밀번호가 정상적으로 변경되었습니다.</p>
|
|
<p>변경된 비밀번호로 다시 로그인 해주세요</p>
|
|
</div>
|
|
<div class="pop-btn1">
|
|
<button class="btn-pcolor" @click="$router.go(-1)">확인</button>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
<!-- e: 팝업 -->
|
|
</div>
|
|
|
|
|
|
</template>
|
|
|
|
<script>
|
|
|
|
|
|
export default {
|
|
data(){
|
|
return{
|
|
|
|
}
|
|
},
|
|
methods: {
|
|
//모달 켜기
|
|
ModalOpen(target){
|
|
var dimmed = document.getElementsByClassName('dimmed');
|
|
var wrap = document.getElementsByClassName('popup-wrap');
|
|
var obj = document.getElementsByClassName(target);
|
|
dimmed[0].style.display = 'block';
|
|
wrap[0].style.display = 'block';
|
|
obj[0].style.display = 'block';
|
|
},
|
|
// 모달 끄기
|
|
ModalClose(){
|
|
var dimmed = document.getElementsByClassName('dimmed');
|
|
var wrap = document.getElementsByClassName('popup-wrap');
|
|
var obj = wrap[0].childElementCount
|
|
dimmed[0].style.display = 'none';
|
|
wrap[0].style.display = 'none';
|
|
for(var i = 0; i < obj; i++) {
|
|
var target = document.getElementsByClassName('popup');
|
|
target[i].style.display = 'none';
|
|
}
|
|
},
|
|
}
|
|
|
|
}
|
|
</script>
|
|
|
|
<!--<style>-->
|
|
<!--.popup-btn-wrap {width: 500px; margin: auto; padding: 100px 0;}-->
|
|
<!--.popup-btn-wrap button {width: 100%; margin-bottom: 10px; height: 50px; border-radius: 5px; box-shadow: none; border: 1px solid #000; }-->
|
|
<!--.popup-btn-wrap button:hover {background: #000; color: #fff;}-->
|
|
<!--</style>--> |