열심히 끝까지
[팀 프로젝트] - 펫 상점(펫키지) 5일차 회의기록 및 완성본 본문
제작 기간 : 24일
개발 환경 : 이클립스(JDK 11), 톰캣(Tomcat v9.0), MySQL
--------------------------------------------------------
22/08/16(수) 1차 회의 - MVO 결정, 요구사항 분석(기능, API), 테이블, USERFLOW(페이지 개수)
22/08/17(목) 2차 회의 - table 칼럼 설정 + VO 설정
22/08/22(수) 개발 진행
22/08/23(화) 3차 회의 - 관리자 기능, 리뷰페이지, 더보기&페이징처리 사용할 페이지, 상품 구매 목록 STYLE
22/08/25(목) 4차 회의 - 더보기는 버튼 지정, BUYLIST VO 추가(TABLE이 아님), 아코디언식으로 내용
22/08/30(화) 5차 회의 - API현황(로그인 API, 아코디언, 데이트피커, 날짜API, 모달창, 이메일 API, 주소API, 별점API),
리뷰 파일 첨부 및 사진 추가(상세페이지), 네이버 및 카카오 로그인 관련, 분류 추가
완성 코드
https://github.com/Rhoyoorim/-JSP.git
과거의 프로젝트에서 오늘날 올린 프로젝트의 변경 사항
- signup.jsp (js 부분)
<script type="text/javascript">
var nowUtc = Date.now(); // 오늘 날짜
var timeoff = new Date().getTimezoneOffset() * 60000; // 초 단위로 끊음
var today = new Date(nowUtc - timeoff).toISOString().split("T")[0];
document.getElementById('mbirth').setAttribute("max", today);
// 오늘 이후의 날짜 선택 불가능하게 만드는 작업
//document.getElementById('mbirth').value = new Date().toISOString()
//.substring(0, 10);
// 오늘 날짜가 기본 세팅
//
document.getElementById('submit').disabled=true;
function idcheck(){ // 아이디 유효성 검사
document.getElementById('submit').disabled=true;
var id = $("#mid").val();
var idpattern=/[a-z0-9_-]{5,20}$/;
if(id.length <=4){
document.getElementById('idcheck').innerHTML = "5자 이상의 아이디를 입력하세요.";
document.getElementById('idcheck').style.color = 'red';
}else if(!idpattern.test(id)){
document.getElementById('idcheck').innerHTML = "5~20자의 영문 소문자, 숫자, 특수기호(_),(-)만 사용 가능";
document.getElementById('idcheck').style.color = 'red';
}
else{
$.ajax({ // 중복 아이디 체크
url:"CheckServlet?mid="+id,
success:function(data){
if(data==1){
document.getElementById('idcheck').innerHTML = "중복된 아이디입니다.";
document.getElementById('idcheck').style.color = 'red';
}else if(data==2){
document.getElementById('idcheck').innerHTML = "사용 가능한 아이디입니다.";
document.getElementById('idcheck').style.color = 'blue';
document.getElementById('submit').disabled=false;
}
}
});
/* document.getElementById('idcheck').innerHTML = "완료";
document.getElementById('idcheck').style.color = 'blue';
console.log(document.getElementById('idcheck').style.color);
document.getElementById('submit').disabled=false; */
}
}
function pwcheck() { // 비밀번호 유효성 검사
document.getElementById('submit').disabled=true;
var p1 = $("#mpw").val();
var p2 = $("#pwch").val();
var ppattern = /^[a-z0-9_-]{5,20}$/;
if (p1.length <= 7) {
document.getElementById('pwcheck').innerHTML = "8자 이상의 비밀번호를 입력하세요";
document.getElementById('pwcheck').style.color = 'red';
}else if(!ppattern.test(p1)){
document.getElementById('pwcheck').innerHTML = "8~20자의 영문 소문자, 숫자, 특수기호(_),(-),(*)만 사용 가능합니다.";
document.getElementById('pwcheck').style.color = 'red';
}
else if (p2.length == 0) {
document.getElementById('pwcheck').innerHTML = "사용가능한 비밀번호입니다. 비밀번호 확인을 진행하세요.";
document.getElementById('pwcheck').style.color = 'blue';
} else if (p1 != p2) {
document.getElementById('pw2check').innerHTML = "비밀번호가 일치하지 않습니다.";
document.getElementById('pw2check').style.color = 'red';
} else {
document.getElementById('pwcheck').innerHTML = "비밀번호 확인 완료";
document.getElementById('pwcheck').style.color = 'blue';
document.getElementById('pw2check').innerHTML = "비밀번호가 일치합니다.";
document.getElementById('pw2check').style.color = 'blue';
document.getElementById('submit').disabled=false;
}
}
function namecheck(){ // 이름 유효성 검사
document.getElementById('submit').disabled=true;
var name = $("#mname").val();
var namePattern=/^[가-힣]{2,5}$/;
if(name.length <= 1){
document.getElementById('namecheck').innerHTML = "이름을 입력해주세요.";
document.getElementById('namecheck').style.color = 'red';
}else if(!namePattern.test(name)){
document.getElementById('namecheck').innerHTML = "한글형식의 이름을 입력해주세요";
document.getElementById('namecheck').style.color = 'red';
}else{
document.getElementById('namecheck').innerHTML = "사용 가능한 이름입니다."
document.getElementById('namecheck').style.color = 'blue';
document.getElementById('submit').disabled=false;
}
}
function nickcheck(){ // 닉네임 유효성 검사
document.getElementById('submit').disabled=true;
var nick = $("#mnick").val();
var nickPattern=/^[가-힣]{2,5}$/;
if(nick.length <= 1){
document.getElementById('nickcheck').innerHTML = "닉네임을 입력해주세요.";
document.getElementById('nickcheck').style.color = 'red';
}else if(!nickPattern.test(nick)){
document.getElementById('nickcheck').innerHTML = "한글형식의 닉네임을 입력해주세요";
document.getElementById('nickcheck').style.color = 'red';
}else{
$.ajax({ // 중복 체크 - 후기를 쓸 닉네임이 겹치면 안되기 때문에
url:"CheckServlet?mnick="+nick,
success:function(data){
if(data==1){
document.getElementById('nickcheck').innerHTML = "중복된 닉네임 입니다.";
document.getElementById('nickcheck').style.color = 'red';
}else if(data==2){
document.getElementById('nickcheck').innerHTML = "사용 가능합니다.";
document.getElementById('nickcheck').style.color = 'blue';
document.getElementById('submit').disabled=false;
}
}
});
/* document.getElementById('nickcheck').innerHTML = "사용가능합니다";
document.getElementById('nickcheck').style.color = 'blue';
document.getElementById('submit').disabled=false; */
}
}
function phonecheck(){ // 핸드폰번호 유효성 검사
document.getElementById('submit').disabled=true;
var phone = $("#phone").val();
var phonepattern=/^01([0|1|6|7|8|9])([0-9]{4})([0-9]{4})$/;
if(phone.length <=10){
document.getElementById('phonecheck').innerHTML = "핸드폰 번호를 제대로 입력하세요.";
document.getElementById('phonecheck').style.color = 'red';
}else if(!phonepattern.test(phone)){
document.getElementById('phonecheck').innerHTML = "01######### 형식으로 입력해주세요.";
document.getElementById('phonecheck').style.color = 'red';
}else{
document.getElementById('phonecheck').innerHTML = "입력 완료";
document.getElementById('phonecheck').style.color = 'blue';
document.getElementById('submit').disabled=false;
}
}
function emailidcheck(){ // 이메일 유효성 검사
var id = $("#memailid").val();
var idpattern=/[a-z0-9_-]{5,20}$/;
document.getElementById('submit').disabled=true;
if(id.length <=4){
document.getElementById('emailidcheck').innerHTML = "5자 이상 이메일아이디 입력하세요.";
document.getElementById('emailidcheck').style.color = 'red';
}else if(!idpattern.test(id)){
document.getElementById('emailidcheck').innerHTML = "영소문자,숫자,특수기호(_),(-) 20자까지 사용 가능";
document.getElementById('emailidcheck').style.color = 'red';
}else{
document.getElementById('emailidcheck').innerHTML = "입력 완료";
document.getElementById('emailidcheck').style.color = 'blue';
document.getElementById('submit').disabled=false; // 잘 입력되면 회원가입버튼 활성화
}
}
/*submit.addEventListener('click', signup);
function activeEvent(){
switch(!(id=='blue')){
case true : submit.disabled=true; break;
case false : submit.disabled=false; break;
}
} */
/* document.getElementById('idcheck').style.color('blue',function(event){
document.getElementById('submit').disabled=!this.value;
},false;); */
/* function signup(){
alert('회원가입 성공');
window.location.href="login.jsp";
} */
</script>
- inputpet.jsp
<script type="text/javascript">
$(document).ready(function(){ // 강아지 혹은 고양이 선택 시, 선택한 종류의 종만 뜨도록 설정
$("input[name='gender']:radio").change(function(){
var gender=this.value;
if(gender=="dog"){ // 개를 선택하면?
$('#pdog').show();
$('#pcat').hide();
}else if(gender=="cat"){ // 고양이를 선택하면?
$('#pdog').hide();
$('#pcat').show();
}
});
});
</script>
- pwfind.jsp
<script type="text/javascript">
function check(){
var phoneNumber=$('#phone').val();
document.getElementById('phonecheckbtn').innerHTML='인증번호가 발송되었습니다.';
$.ajax({
type:"GET",
url:'${pageContext.request.contextPath}/check.do?phoneNumber='+phoneNumber,
data:{
"phoneNumber" : phoneNumber
},
success:function(res){
<!--console.log("로그 : [" + res+"]");-->
$('#numcheckbtn').click(function(){
if(res==$('#numcheck').val()){
$("#numcheckres").text("휴대폰 인증이 정상적으로 완료되었습니다.");// 사용가능
}
else{
$("#nickcheck").text("잘못된 인증입니다. 다시 시도하세요.");
}
})
}
})
}
</script>
'0607 팀 프로젝트 - 2Quals' 카테고리의 다른 글
[API 사용] - 앱카드 결제 API(PAYAPP / PAYPLE) (0) | 2022.09.30 |
---|---|
[팀 프로젝트] - Spring을 이용한 팀 프로젝트(펫키지) 1일차 회의기록 (0) | 2022.09.20 |
[팀 프로젝트] - 펫 상점(펫키지) 4일차 회의 기록(더보기 버튼, 고객센터, itemSetVO 추가, 이메일 API & 문자 API) (0) | 2022.08.26 |
[팀 프로젝트] - 펫 상점(펫키지) 3일차 회의 기록(관리자 계정 추가, 더보기&페이징, 제품 칼럼 추가) (0) | 2022.08.26 |
[팀 프로젝트] - 펫 상점(펫키지) 2일차 회의 기록(테이블 칼럼 명, 및 VO 명 결정) (0) | 2022.08.17 |