Files
chocomae/src/web/module/maestro_section_register.html
T
2018-07-18 20:50:14 +09:00

305 lines
8.2 KiB
HTML

<style>
.login {
background-color: #ff0000;
padding: 20px;
}
.register {
background-color: #0000ff;
padding: 20px;
}
#page-tabs ul li {
/*width: 341px;*/
list-style: none;
color: #dddddd;
float: left;
font-size: 1.3em;
line-height: 60px;
vertical-align: middle;
text-align: center;
}
</style>
<script type="text/javascript">
let maestro_name = "";
let isAvailableID = false;
let password = "";
let email = "";
let accountType = 0;
let selectedAccountTypeValue = -1;
let selectedAccountTypeText = "";
let tab1, tab2, tab3;
let accountValidator = new AccountValidator();
$(document).ready(function() {
tab1 = $("#page-tabs li").filter(":eq(0)");
tab2 = $("#page-tabs li").filter(":eq(1)");
tab3 = $("#page-tabs li").filter(":eq(2)");
});
function checkMaestroID() {
maestro_name = $("#maestro_name").val();
if(!accountValidator.isValidMaestroID(maestro_name)) {
onErrorMaestroID(accountValidator.messageForInvalidMaestroID(maestro_name));
return;
}
sendRequestServer( //url, sendParams, onSuccess, onFail, isDebugMode);
"./../server/maestro/check_id.php",
"maestro_name=" + maestro_name,
(jsonData) => {
isAvailableID = true;
$("#error_message").text(maestro_name + " : 생성 가능한 마에스트로 계정 이름입니다.");
},
(errorMessage, errorCode) => {
isAvailableID = false;
onErrorMaestroID(errorMessage);
}
);
}
function onErrorMaestroID(message) {
if($("#error_message").length) {
$("#error_message").text(message);
}
$("#maestro_name").val("");
$("#maestro_name").focus();
}
function onErrorMaestroPW(message) {
if($("#error_message").length) {
$("#error_message").text(message);
}
$("#password").val("");
$("#password").focus();
}
function checkData() {
if(!isAvailableID) {
$("#error_message").text("아이디 중복 확인을 해 주세요.");
$("#check_id").focus();
return;
}
password = $("#password").val();
if(!accountValidator.isValidMaestroPW(password)) {
onErrorMaestroPW(accountValidator.messageForInvalidMaestroPW(password));
return;
}
// if(password.length === 0) {
// $("#error_message").text("패스워드를 입력해 주세요.");
// $("#password").focus();
// return;
// }
email = $("#email").val();
if(email.length === 0) {
$("#error_message").text("이메일을 입력해 주세요.");
$("#email").focus();
return;
}
selectedAccountTypeValue = $("#account_type option:selected").val();
selectedAccountTypeText = $("#account_type option:selected").text();
console.log(selectedAccountTypeValue);
console.log(selectedAccountTypeText);
let isCheckAcceptClauses = $("#check_accept_clauses").is(":checked");
if(!isCheckAcceptClauses) {
$("#error_message").text("약관을 읽고, 동의 체크 버튼을 눌러 주세요.");
$("#check_accept_clauses").focus();
return;
}
$(".maestro_name").append(maestro_name);
$(".password").append(password);
$(".email").append(email);
$(".account_type").append(selectedAccountTypeText);
$(".price_account").append(selectedAccountTypeText);
$("#error_message").text("");
$("#input_data").css("display", "none");
$("#register_account").css("display", "block");
tab1.removeClass("activated");
tab2.addClass("activated");
}
function register_account() {
$("#register_account").css("display", "none");
$("#banking_guide").css("display", "block");
tab2.removeClass("activated");
tab3.addClass("activated");
sendRequestServer( //url, sendParams, onSuccess, onFail, isDebugMode);
"./../server/maestro/add_maestro.php",
"maestro_name=" + maestro_name + "&password=" + password + "&email=" + email + "&account_type=" + selectedAccountTypeValue,
(jsonData) => {
isAvailableID = true;
},
(errorMessage, errorCode) => {
isAvailableID = false;
if($("#error_message").length) {
$("#error_message").text(errorMessage);
}
$("#maestro_name").val("");
$("#maestro_name").focus();
}
);
}
</script>
<div class="container">
<div id="page-tabs">
<ul>
<li class="widthOneThird activated">마에스트로 계정 신청</li>
<li class="widthOneThird">신청 정보 확인</li>
<li class="widthOneThird">신청 완료</li>
</ul>
</div>
<div>
<span id="error_message">
</span>
</div>
<div id="input_data">
(필수) 마에스트로 아이디 : <input type="text" id="maestro_name" value="test" >
<button id="check_id" onClick="checkMaestroID()">중복 확인</button><br/>
(필수) 암호 : <input id="password" value="test" type="password" name="password"><br/>
(필수) 이메일 : <input id="email" value="test@test.com" name="email"><br/>
(필수) 학생 수 :
<select id="account_type">
<option name="account_type" value="1">20명 (1만원 / 1년)</option>
<option name="account_type" value="2">50명 (2만원 / 1년)</option>
<option name="account_type" value="3">100명 (3만원 / 1년)</option>
</select>
<br/>
<br/>
<span>
<input type="checkbox" id="check_accept_clauses" />
<label for="check_accept_clauses">아래 약관을 읽었으며, 모든 내용에 동의합니다.</label>
</span>
<input id="check_accept_clauses" type="checkbox" name="accept_clauses"><br/>
<br/>
<br/>
<div class="col alignCenter">
<a id="agreement_clauses" class="btn btn-orange">전체 약관 읽기</a>
</div>
<h1>약관 주요 내용 요약</h1>
<p style="text-align: right;">마지막 갱신 : 2018년 6월 26일</p>
<ul>
<li>결제는 계좌 이체(송금)으로만 가능합니다. 신용카드 결제는 준비되지 않았습니다.</li>
<li>서버가 불안정할 수 있습니다. 문제 발생시 메일로 알려주시면 최대한 빨리 정상화 하겠습니다.</li>
<li>결제후 1년이 지나면 마에스트로 계정과 학생들의 계정이 비활성화 됩니다.</li>
<li>비활성화 되기 전에 연장 결제 해주시면, 남은 기간도 함께 연장됩니다.</li>
<li>비활성화된 계정은, 6개월후에 삭제됩니다. 마에스트로 계정 및 학생들의 계정 정보 모두가 사라집니다.</li>
<li>서비스 업그레이드는 가능합니다. 업그레이드한 날부터 1년간 업그레이드 서비스가 시작됩니다.</li>
</ul>
<div class="col alignCenter">
<a id="maestro_register" class="btn btn-sea width400" onClick="checkData()">등록 신청</a>
</div>
</div>
<div id="register_account" style="display: none;">
<h2>신청 정보 확인</h2>
마에스트로 아이디 : <span class="maestro_name"></span><br/>
암호 : <span class="password"></span><br/>
이메일 : <span class="email"></span><br/>
학생 수 : <span class="account_type"></span><br/>
<!--
<h3>입금 계좌</h3>
<div>
카카오뱅크 : 9999-999999<br/>
계좌 이름 : 박지상<br/>
금액 : <span class="price_account"></span>원
<div>보내는 사람 이름 : 요청하신 마에스트로 아이디 <span class="maestro_name"></span>로 입력해주세요.</div>
<div class="tip">보내는 사람 이름을 마에스트로 아이디로 해주실 경우, 가장 빠르게 계정을 활성화 해드릴 수 있습니다.</div>
</div>
-->
<div>
신청 내용이 모두 맞는지 확인해주세요.
아래의 등록 신청 버튼을 누르면, 입력하신 이메일 주소로도 입금 내용을 보내드립니다.
신청후에 <span class="price_account"></span>원을 송금해주세요.
</div>
<br/>
<div class="col alignCenter">
<a href="#" id="send_register" class="btn btn-sea width400" onClick="register_account()">마에스트로 계정 등록</a>
</div>
</div>
<div id="banking_guide" style="display: none;">
<h2>신청 완료</h2>
<div>마에스트로 아이디</div>
<div class="maestro_name"></div>
<div>가 신청되었습니다.</div>
<h3>입금 계좌</h3>
<div>
카카오뱅크 : 9999-999999<br/>
계좌 이름 : 박지상<br/>
금액 : <span class="price_account"></span>
<div>보내는 사람 이름 : 요청하신 마에스트로 아이디 <span class="maestro_name"></span>로 입력해주세요.</div>
<div class="tip">보내는 사람 이름을 마에스트로 아이디로 해주실 경우, 가장 빠르게 계정을 활성화 해드릴 수 있습니다.</div>
</div>
<br/>
<div>
방금 <span class="email"></span> 이메일로 입금 안내 내용을 보내드렸습니다.
</div>
</div>
</div>