데일리로그C:
article thumbnail
Published 2023. 6. 3. 02:14
Today is 기분선택 프로젝트 로직 모음집/spring

MemberVO

 ㄴ> mysql에도 추가

private String mood;

 

MemberDAO

public void updateMood(MemberVO m) throws Exception; // 기분 업데이트

 

MemberDAOImpl

//mood
@Override
public void updateMood(MemberVO m) throws Exception {
    sqlSession.update(namespace+".updateMood", m);
}

 

MemberService

public void updateMood(MemberVO m) throws Exception; // 기분 업데이트

 

MemberServiceImpl

@Override
public void updateMood(MemberVO m) throws Exception {
    dao.updateMood(m);
}

 

MemberMapper

<!-- mood -->
<update id="updateMood">
    update member set mood=#{mood} where id=#{id}
</update>

 

MemberController

//mood
@ResponseBody
@RequestMapping(value="/updateMood", produces="text/plain;charset=UTF-8")
public String updateMood(String id, RedirectAttributes rttr, String mood_ck, MemberVO m ) throws Exception{
    log.info("기분 post==");
    log.info(mood_ck);
    log.info(id);
    log.info(m);

    m.setMood(mood_ck);
    service.updateMood(m);

    if(mood_ck.equals("m01")) {
        return "<img src='/img/mood/m01.jpg' style='width:20px;'><span style='font-size:10px;'>답답</span>";
    } else if(mood_ck.equals("m02")) {
        return "<img src='/img/mood/m02.jpg' style='width:20px;'><span style='font-size:10px;'>사랑해</span>";
    } else if(mood_ck.equals("m03")) {
        return "<img src='/img/mood/m03.jpg' style='width:20px;'><span style='font-size:10px;'>우울</span>";
    } else if(mood_ck.equals("m04")) {
        return "<img src='/img/mood/m04.jpg' style='width:20px;'><span style='font-size:10px;'>개운</span>";
    } else if(mood_ck.equals("m05")) {
        return "<img src='/img/mood/m05.jpg' style='width:20px;'><span style='font-size:10px;'>기쁨</span>";
    } else if(mood_ck.equals("m06")) {
        return "<img src='/img/mood/m06.jpg' style='width:20px;'><span style='font-size:10px;'>슬픔</span>";
    } else if(mood_ck.equals("m07")) {
        return "<img src='/img/mood/m07.jpg' style='width:20px;'><span style='font-size:10px;'>앗싸</span>";
    } else if(mood_ck.equals("m08")) {
        return "<img src='/img/mood/m08.jpg' style='width:20px;'><span style='font-size:10px;'>힘듦</span>";
    } else if(mood_ck.equals("m09")) {
        return "<img src='/img/mood/m09.jpg' style='width:20px;'><span style='font-size:10px;'>행복</span>";
    } else if(mood_ck.equals("m10")) {
        return "<img src='/img/mood/m10.jpg' style='width:20px;'><span style='font-size:10px;'>기대</span>";
    } else if(mood_ck.equals("m11")) {
        return "<img src='/img/mood/m11.jpg' style='width:20px;'><span style='font-size:10px;'>파이팅</span>";
    } else if(mood_ck.equals("m12")) {
        return "<img src='/img/mood/m12.jpg' style='width:20px;'><span style='font-size:10px;'>즐거움</span>";
    } else if(mood_ck.equals("m13")) {
        return "<img src='/img/mood/m13.jpg' style='width:20px;'><span style='font-size:10px;'>배고픔</span>";
    } else if(mood_ck.equals("m14")) {
        return "<img src='/img/mood/m14.jpg' style='width:20px;'><span style='font-size:10px;'>설렘</span>";
    } else if(mood_ck.equals("m15")) {
        return "<img src='/img/mood/m15.jpg' style='width:20px;'><span style='font-size:10px;'>피곤</span>";
    } else if(mood_ck.equals("m16")) {
        return "<img src='/img/mood/m16.jpg' style='width:20px;'><span style='font-size:10px;'>아픔</span>";
    } else if(mood_ck.equals("m17")) {
        return "<img src='/img/mood/m17.jpg' style='width:20px;'><span style='font-size:10px;'>귀여움</span>";
    } else if(mood_ck.equals("m18")) {
        return "<img src='/img/mood/m18.jpg' style='width:20px;'><span style='font-size:10px;'>그리움</span>";
    } else if(mood_ck.equals("m19")) {
        return "<img src='/img/mood/m19.jpg' style='width:20px;'><span style='font-size:10px;'>위험</span>";
    } else if(mood_ck.equals("m20")){
        return "<img src='/img/mood/m20.jpg' style='width:20px;'><span style='font-size:10px;'>귀찮음</span>";
    } else {
        return "";
    }

 

left_profile.jsp

  ㄴ> input value 필수!!!!!

  ㄴ> Today is 누르면 레이어팝업창 띄움

  ㄴ> 레이어팝업창 외 다른 곳 클릭하면 팝업창 닫음 : $(document).click ~~~ .hide()

<%@ 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="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 

<!-- jQuery 사용추가 --> 
<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.4.1.min.js"></script>

<style>
	.mood { /* 기분 */
		border:2px solid #999;
		border-radius:5px;
		width:150px;
		margin-top:10px;
		padding-bottom:3px;
		padding-top:3px;
		text-align: center;
		display: flex;
	}

	.content2{
		position: absolute;
		z-index:10;
		width: 250px;
		height:350px;
		left:150px;
		top:180px;
		display:none;
		background-color: #fff;
		border:1px solid #666;
		border-radius:10px;
		font-size: 12px;
		text-align: center;
		
	}
	
	.table2{
		display: table;
		width: 100%;
		height:300px;
		font-size: 12px;
		text-align: center;
	}
	
	.row2 {
		display: table-row;
		border-radius:10px;
	}
    
	.cell3 {
		/* border: 1px solid #999999; */
		/* border-radius:10px; */
		display: table-cell;
		padding: 0px 15px;
		font-size: 10px;
		font-weight: bolder;
		text-align: center;
		vertical-align: middle;
		
	}
    
	.divTableBody2 {
		display: table-row-group;
	}
	
	.mood_pop_title {
		font-size:15px;
		font-weight: bolder;
		color:#54B3D3;
		width:100%;
		padding:10px 0px;
		border-bottom: 1px dashed #ccc;
	}
</style>

<script>
$(document).ready(function() {
    $(".mood_btn").click(function(e) {
    	e.stopPropagation();
    	$('.content2').toggle(); 
    })
    
    $(document).click(function() {
   		$('.content2').hide();
    })
 });
 
 
function mood_result(id){
	var mood_ck = $("input[type=radio][name=mood]:checked").val();
	//alert(mood_ck);
	//alert(id);
	
	$.ajax({
		url:"/member/updateMood", //전송받을 페이지 경로
		type: "post", //데이터 읽어오는 방식
		dataType: "text", //데이터 방식
		data: "id="+id+"&mood_ck="+mood_ck, //데이터 전달
		error:function(){ //실패일 경우
			alert("실패");
		},
		success:function(text){ //성공일 경우
			$("#mood_result").html(text);
		}
	});
}
</script>

<!-- mood 기분 팝업 -->
<div class="content2" id="content2">
	<div class="mood_pop_title">Today is ...</div>
	<div class="table2">
	<div class="divTableBody2">
	<div class="row2">
		<div class="cell3" >
			<input type="radio" name="mood" id="m1" value="m01" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm01'}">checked</c:if>><br>
			<label for="m1"><img src="/img/mood/m01.jpg" style="width:25px;"> <br>답답</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m2" value="m02" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm02'}">checked</c:if>><br>
			<label for="m2"><img src="/img/mood/m02.jpg" style="width:25px;"> <br>사랑해</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m3" value="m03" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm03'}">checked</c:if>><br>
			<label for="m3"><img src="/img/mood/m03.jpg" style="width:25px;"> <br>우울</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m4" value="m04" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm04'}">checked</c:if>><br>
			<label for="m4"><img src="/img/mood/m04.jpg" style="width:25px;"> <br>개운</label>
		</div>
	</div>
	<div class="row2">
		<div class="cell3" >
			<input type="radio" name="mood" id="m5" value="m05" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm05'}">checked</c:if>><br>
		<label for="m5"><img src="/img/mood/m05.jpg" style="width:25px;"> <br>기쁨</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m6" value="m06" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm06'}">checked</c:if>><br>
			<label for="m6"><img src="/img/mood/m06.jpg" style="width:25px;"> <br>슬픔</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m7" value="m07" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm07'}">checked</c:if>><br>
			<label for="m7"><img src="/img/mood/m07.jpg" style="width:25px;"> <br>앗싸</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m8" value="m08" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm08'}">checked</c:if>><br>
			<label for="m8"><img src="/img/mood/m08.jpg" style="width:25px;"> <br>힘듦</label>
		</div>
	</div>
	<div class="row2">
		<div class="cell3" >
			<input type="radio" name="mood" id="m9" value="m09" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm09'}">checked</c:if>><br>
			<label for="m9"><img src="/img/mood/m09.jpg" style="width:25px;"> <br>행복</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m10" value="m10" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm10'}">checked</c:if>><br>
			<label for="m10"><img src="/img/mood/m10.jpg" style="width:25px;"> <br>기대</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m11" value="m11" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm11'}">checked</c:if>><br>
			<label for="m11"><img src="/img/mood/m11.jpg" style="width:25px;"> <br>파이팅</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m12" value="m12" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm12'}">checked</c:if>><br>
			<label for="m12"><img src="/img/mood/m12.jpg" style="width:25px;"> <br>즐거움</label>
		</div>
	</div>
	<div class="row2">
		<div class="cell3" >
			<input type="radio" name="mood" id="m13" value="m13" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm13'}">checked</c:if>><br>
			<label for="m13"><img src="/img/mood/m13.jpg" style="width:25px;"> <br>배고픔</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m14" value="m14" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm14'}">checked</c:if>><br>
			<label for="m14"><img src="/img/mood/m14.jpg" style="width:25px;"> <br>설렘</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m15" value="m15" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm15'}">checked</c:if>><br>
			<label for="m15"><img src="/img/mood/m15.jpg" style="width:25px;"> <br>피곤</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m16" value="m16" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm16'}">checked</c:if>><br>
			<label for="m16"><img src="/img/mood/m16.jpg" style="width:25px;"> <br>아픔</label>
		</div>
	</div>
	<div class="row2">
		<div class="cell3" >
			<input type="radio" name="mood" id="m17" value="m17" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm17'}">checked</c:if>><br>
			<label for="m17"><img src="/img/mood/m17.jpg" style="width:25px;"> <br>귀여움</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m18" value="m18" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm18'}">checked</c:if>><br>
			<label for="m18"><img src="/img/mood/m18.jpg" style="width:25px;"> <br>그리움</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m19" value="m19" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm19'}">checked</c:if>><br>
			<label for="m19"><img src="/img/mood/m19.jpg" style="width:25px;"> <br>위험</label>
		</div>
		<div class="cell3" >
			<input type="radio" name="mood" id="m20" value="m20" style="opacity:0;font-size:2px;" onclick="mood_result('${id}')" <c:if test="${mood == 'm20'}">checked</c:if>><br>
			<label for="m20"><img src="/img/mood/m20.jpg" style="width:25px;"> <br>귀찮음</label>
		</div>
	</div>
	</div>
	</div>
</div>

<form name="mood_form" method="post">
<input type="hidden" name="id" id="id" value="${user.id}">
<div class="mood">
    <div style="width:150px;text-align:center;">
        <a style="font-size:15px;font-weight:bolder;" class="mood_btn">Today is...</a>
        <span style="font-size:15px;font-weight:bolder;" id="mood_result">
            <c:choose>
                <c:when test="${user.mood == 'm01'}">
                    <img src="/img/mood/m01.jpg" style="width:20px;"><span style="font-size:10px;">답답</span>
                </c:when>
                <c:when test="${user.mood == 'm02'}">
                    <img src="/img/mood/m02.jpg" style="width:20px;"><span style="font-size:10px;">사랑해</span>
                </c:when>
                <c:when test="${user.mood == 'm03'}">
                    <img src="/img/mood/m03.jpg" style="width:20px;"><span style="font-size:10px;">우울</span>
                </c:when>
                <c:when test="${user.mood == 'm04'}">
                    <img src="/img/mood/m04.jpg" style="width:20px;"><span style="font-size:10px;">개운</span>
                </c:when>
                <c:when test="${user.mood == 'm05'}">
                    <img src="/img/mood/m05.jpg" style="width:20px;"><span style="font-size:10px;">기쁨</span>
                </c:when>
                <c:when test="${user.mood == 'm06'}">
                    <img src="/img/mood/m06.jpg" style="width:20px;"><span style="font-size:10px;">슬픔</span>
                </c:when>
                <c:when test="${user.mood == 'm07'}">
                    <img src="/img/mood/m07.jpg" style="width:20px;"><span style="font-size:10px;">앗싸</span>
                </c:when>
                <c:when test="${user.mood == 'm08'}">
                    <img src="/img/mood/m08.jpg" style="width:20px;"><span style="font-size:10px;">힘듦</span>
                </c:when>
                <c:when test="${user.mood == 'm09'}">
                    <img src="/img/mood/m09.jpg" style="width:20px;"><span style="font-size:10px;">행복</span>
                </c:when>
                <c:when test="${user.mood == 'm10'}">
                    <img src="/img/mood/m10.jpg" style="width:20px;"><span style="font-size:10px;">기대</span>
                </c:when>
                <c:when test="${user.mood == 'm11'}">
                    <img src="/img/mood/m11.jpg" style="width:20px;"><span style="font-size:10px;">파이팅</span>
                </c:when>
                <c:when test="${user.mood == 'm12'}">
                    <img src="/img/mood/m12.jpg" style="width:20px;"><span style="font-size:10px;">즐거움</span>
                </c:when>
                <c:when test="${user.mood == 'm13'}">
                    <img src="/img/mood/m13.jpg" style="width:20px;"><span style="font-size:10px;">배고픔</span>
                </c:when>
                <c:when test="${user.mood == 'm14'}">
                    <img src="/img/mood/m14.jpg" style="width:20px;"><span style="font-size:10px;">설렘</span>
                </c:when>
                <c:when test="${user.mood == 'm15'}">
                    <img src="/img/mood/m15.jpg" style="width:20px;"><span style="font-size:10px;">피곤</span>
                </c:when>
                <c:when test="${user.mood == 'm16'}">
                    <img src="/img/mood/m16.jpg" style="width:20px;"><span style="font-size:10px;">아픔</span>
                </c:when>
                <c:when test="${user.mood == 'm17'}">
                    <img src="/img/mood/m17.jpg" style="width:20px;"><span style="font-size:10px;">귀여움</span>
                </c:when>
                <c:when test="${user.mood == 'm18'}">
                    <img src="/img/mood/m18.jpg" style="width:20px;"><span style="font-size:10px;">그리움</span>
                </c:when>
                <c:when test="${user.mood == 'm19'}">
                    <img src="/img/mood/m19.jpg" style="width:20px;"><span style="font-size:10px;">위험</span>
                </c:when>
                <c:when test="${user.mood == 'm20'}">
                    <img src="/img/mood/m20.jpg" style="width:20px;"><span style="font-size:10px;">귀찮음</span>
                </c:when>
                <c:otherwise>

                </c:otherwise>
            </c:choose>

        </span>
    </div>
</div>
</form>

저작자표시

'프로젝트 로직 모음집 > spring' 카테고리의 다른 글

게시판별 new수/총수  (0) 2023.06.03
최신글4개list  (0) 2023.06.03
선택삭제  (0) 2023.06.02
profile

데일리로그C:

@망밍

포스팅이 도움됐다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!

profile on loading

Loading...

검색 태그

그림
PROJECT
서버
3주차
나홀로메모장
앱개발
5주차
적응중..
데이터베이스
CSS
코딩
모두의책리뷰
개발일지
HTML
자바스크립트
파이썬
포뇨
스파르타
AWS
.value
짱구인형
코딩오류
웹개발
Robo3T
on속성
MongoDB
메디방
몽고DB
좋아연
4주차

티스토리툴바