[J2P] 특정 이벤트에 챙겨야 할 물품 리스트 저장 기능

Create table Jim(
	ID varchar(20) NOT NULL,
	name varchar(20) NOT NULL UNIQUE,
	item varchar(10000),
	FOREIGN KEY (ID) REFERENCES USER(ID),
	PRIMARY KEY (ID,name)
);

특정 이벤트에 필요한 물품 리스트(이하 Jim)를 저장하는 테이블이다. ID는 사용자 테이블의 ID를 외래키로 사용하였고, Jim의 name과 String 형태의 배열로 이루어진 Item List를 저장한다. ID와 name을 기본키로 하여 유일하게 식별할 수 있도록 하였다.

package com.Jim2Pack.main.Mappers;

import java.util.List;

import org.apache.ibatis.annotations.Mapper;
import org.springframework.stereotype.Repository;

import com.Jim2Pack.main.VO.Jim;

@Repository
@Mapper
public interface JimMapper {
	public void AddJim(Jim jim);
	public int DeleteJim(String ID,String name);
	public Jim GetUserJimSet(String ID, String name);
	public List<Jim> getJimList(String ID);
}

Mapper에서는 insert, delete를 비롯해 특정 jim을 가져오는 메소드, 특정 id의 모든 jim을 가져오는 메소드를 구현하였다.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.Jim2Pack.main.Mappers.JimMapper">
    <insert id = "AddJim" parameterType = "Jim">
    	INSERT INTO Jim(ID, name, item) 
    	VALUES(#{ID},#{name}, #{item})
    </insert>
    <select id = "GetUserJimSet" parameterType = "String" resultType = "Jim">
    	SELECT * FROM Jim WHERE ID = #{ID} AND name = #{name}
    </select>
    <select id="getJimList"  parameterType = "String" resultType = "Jim">
    	SELECT * FROM Jim WHERE ID = #{ID}
    </select>
</mapper>

mapper xml에서는 아직 미구현된 delete 기능 이외의 sql이 저장되어 있다. 

package com.Jim2Pack.main.Service;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.Jim2Pack.main.Mappers.JimMapper;
import com.Jim2Pack.main.VO.Jim;

@Service
public class AddJimService {
	@Autowired
	JimMapper jMapper;
	
	public void Addjim(Jim jim) {
		jMapper.AddJim(jim);
	}
}

AddJim service 클래스에서는 mapper 클래스의 addjim 메소드를 실행하도록 구현하였다.

package com.Jim2Pack.main.Service;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.Jim2Pack.main.Mappers.JimMapper;
import com.Jim2Pack.main.VO.Jim;

@Service
public class GetUserJimSetService {
	@Autowired
	JimMapper jm;
	
	public int checkUserJimSet(String ID, String name) {
		Jim jim = jm.GetUserJimSet(ID, name);
		if(jim==null) {
			return 1;
		}
		else return 0;
	}
}

GetUserJimSetService에서는 Jim name 중복을 피하기 위해 특정 ID에서 등록한 Jim 중 입력한 Jim name과 중복된 값이 검색되는지 확인한 후 그 결과에 따라 다른 숫자를 return하는 함수를 구현하였다.

package com.Jim2Pack.main;


import java.util.Arrays;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;

import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

import com.Jim2Pack.main.Service.AddJimService;
import com.Jim2Pack.main.Service.GetUserJimSetService;
import com.Jim2Pack.main.VO.Jim;
import com.Jim2Pack.main.config.Message;

@Controller
public class AddJimController {
	@Autowired
	AddJimService ajs;
	@Autowired
	GetUserJimSetService guj;
	
	@RequestMapping(value = "/AddJim" , method = {RequestMethod.GET})
	public String view(Model model) {
		String result = "AddJim";
			return result;
	}
	@RequestMapping(value = "/AddJim" , method = {RequestMethod.POST})
	public String SignUp(Jim jim, Model model, String[] items) {
		String url = "Alert";
		String str = Arrays.toString(items);
		jim.setItem(str);
		int OK = guj.checkUserJimSet(jim.getID(),jim.getName());
		System.out.println(OK);
		if(OK==1) {
			ajs.Addjim(jim);
			Message msg = Message.builder().message("JimSet 등록이 완료되었습니다.").url("/").build();
			model.addAttribute("mess", msg);
		}
		else if(OK==0){
			Message msg = Message.builder().message("JimSet 이름이 중복되었습니다.").url("/AddJim").build();
			model.addAttribute("mess", msg);
		}
		
		return url;
	}
	
}

컨트롤러에서는 Post형식으로 넘어온 jim(ID, name, null)과 챙겨야 할 물품 리스트(items)를 받아 items 배열을 String으로 바꿔 jim 객체의 Setter를 이용해 삽입하고, 완성된 Jim의 ID와 Name값을 이용해 중복체크를 수행하고, 정상적인 경우 DB에 삽입하는 과정을 수행한 후 결과를 message로 띄워준다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page trimDirectiveWhitespaces="true" %>
<%@ include file="header.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>AddJim</title>
</head>
<body>
<%
 String UserID = (String)session.getAttribute("loggedID");
if(UserID.equals("null")){
	out.println("<script>");
	out.println("alert('로그인 후 이용 가능합니다.')");
	out.println("location.href = '/'");
	out.println("</script>");
}
%>
 <script>
        const add_textbox = () => {
            const box = document.getElementById("box");
            const newP = document.createElement('p');
            newP.innerHTML = "<div class='input-group mb-3'><input type='text' class='form-control' style='width:300px;'name = 'items' placeholder='item'><div class='input-group-append'><input type='button' class='btn btn-outline-secondary' value='삭제' onclick='remove(this)'></div></div>";
            box.appendChild(newP);
        }
        const remove = (obj) => {
            document.getElementById('box').removeChild(obj.parentNode.parentNode.parentNode);
        }
 </script>
<div class = "container-lg" >
<br>
<br>
<br>
	<form method = "post" id = 'box' >
		<label for="basic-url" class="form-label">Jim Registration</label>
		<div class="col-xs-3">
		<input type="hidden" class="form-control" value = <%=UserID %> name = "ID">
  		<input type="text" class="form-control" name = "name" placeholder="name" aria-label="Username" aria-describedby="basic-addon1">
		</div>
		<br>
		<div class="input-group mb-3">
  			<input type="text" class="form-control" name = 'items' style='width:300px;'placeholder='item'>
  			<div class="input-group-append">
    		<input type="button" class="btn btn-outline-secondary"value="추가" onclick="add_textbox()">
  			</div>
		</div>
		</form>
		<input type = 'submit' form = 'box'>
</div>
	
<%@ include file="footer.jsp"%>
</html>

먼저 로그인이 되었는지 확인한 후 로그인이 안되어 있을 경우 진입을 제한하고 메인으로 이동시킨다. 

중단에 있는 스크립트는 Jim item을 추가할 때, 원하는 만큼 동적으로 입력창을 생성할 수 있는 스크립트이다.

로그인을 수행한 후 상단 네비게이션 바에서 Jim을 클릭하면 나오는 Drop Down List에서 Add Jim을 선택한 후 나오는 화면이다.

List item 입력창 왼쪽에 있는 추가 버튼을 누르게 되면 위와 같이 item 입력창이 하나씩 추가된다.

등록이 완료되면 위와 같인 alert를 볼 수 있다.