KH_ONTRIP Project

👥 팀명: 시나브로

시나브로란 천천히 조금씩 부족한 부분을 서로 채워나가서 성장해나간다는 의미로, 저희 팀원들이 서로 부족한 부분을 채워주며,점점 성장해나가서 퀄리티 좋은 프로젝트를 해내자는 의미로 팀명을 정하였습니다.

[OnTrip] 여행코스 추천 & 예약 웹사이트

👏 프로젝트소개

업무분담

이름	김채영	송지호	이범석	황종수	조성우
GitHub	@KCY9392	@SongJiho1998	@qjatjr0513	@prodaniel93	@jay11234511

💻 개발환경

📝 Front-End

📝 Back-End

💻 Tool

📖 프로젝트 작업 기간

• 2022.10.24-2022.10.27 : 프로젝트 기획 및 요구사항 분석
• 2022.10.28-2022.11.02 : 화면설계
• 2022.11.03-2022.11.08 : DB설계
• 2022.11.09-2022.11.28 : 기능 구현

😀 ER-DIAGRAM , USECASE-DIAGRAM

ER-DIAGRAM	USECASE-DIAGRAM

😆 UI

시작페이지	메인페이지
지역정보	해당지역의 시설정보
시설이용후기	시설이용후기 상세
시설선택창	예약창
예약확인창	마이페이지

🌟 주요기능

1) 해시태그를 적용한 검색 기능

/* 해시태그 검색창 Form */

<form action="<%=request.getContextPath() %>/searchHashPlace.se" id="enroll-form" method="post">
   <div style="box-sizing:border-box; width:500px; margin:auto;">
       <div class="input-group mb-3" style="width:700px; height:50px;">
	  <input style="border:none !important;" type="text" id="search12" class="form-control" aria-label="Recipient's username" aria-describedby="button-addon2" name='hash' placeholder="해시태그를 입력해주세요">
	  <input type="hidden" name='hidden_hash'>
	  <button style="border:none; color:white; background-color:lightgrey;" class="btn btn-outline-secondary btn-search" type="submit" id="button-addon2">검색</button>
	</div>
	<div>
        	<span style=" width:450px; margin-left:35px; color:lightgrey;"><%= hashTag %></span>
        </div>
   </div> 
</form>

/* 태그 추가 시, 이벤트 발생 script */

<script>
        const input = document.querySelector('input[name=hash]');
   
        let tagify = new Tagify(input); // initialize Tagify
   
        let hidden_hash = document.querySelector('input[name=hidden_hash]');
        
        // 태그가 추가되면 이벤트 발생
        tagify.on('add', function() {
	    console.log(tagify.value); // 입력된 태그 정보 객체
	    let tag = "";
	    let arr = tagify.value;
	    for(let i =0; i<arr.length; i++){ //{value: 태그명, tagid : ? , asda:?}
		tag += arr[i]["value"]+  ( i != arr.length-1 ?  "," : "")
		hidden_hash.value = tag;
	    }
         })
</script>

/* 검색버튼 눌렀을 경우, 넘어가는 Controller */

@WebServlet("/searchHashPlace.se")
public class SearchHashPlaceController extends HttpServlet {
private static final long serialVersionUID = 1L;
   
public SearchHashPlaceController() {
	super();
}

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	
    // 해시태그 생성
    String hash = (String) request.getParameter("hidden_hash");
    String[] split_hash;
    if(hash != null) {
	split_hash = hash.split(",");
		
	// 검색한 시설 사진 해시태그로 불러오기
	ArrayList<Image> placeHashPath = new PlaceService().searchHashPlacePath(split_hash);
	request.setAttribute("placeHashPath", placeHashPath);
		
	// 검색한 시설 정보 해시태그로 불러오기
	ArrayList<Place> placeHashInfo = new PlaceService().searchHashPlaceInfo(split_hash);
	request.setAttribute("placeHashInfo", placeHashInfo);
     }
     request.getRequestDispatcher("views/location/searchHashPlace.jsp").forward(request, response);
}


protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	doGet(request, response);
}

/* 입력값을 통한 DB데이터 select */

<!-- 해시태그를 사용한 검색 -->
<entry key="searchHashPlacePath">
	SELECT FILE_NO, FILE_PATH, CHANGE_NAME
	FROM "Image"
	WHERE STATUS = 'Y' AND ORIGIN_NAME LIKE '%1%' AND PLC_CODE IN(SELECT s.PLC_CODE
                                                            FROM "HashStorage" s
                                                            JOIN "Hash" h USING(HAS_NO)
                                                            WHERE h.HAS_NAME IN(@))
	ORDER BY PLC_CODE
</entry>

/* 메인창에서 해시태그키워드키워드로 시설 정보 찾기 */

public ArrayList<Place> searchHashPlaceInfo(String[] split_hash, Connection conn){
    	ArrayList<Place> placeHashInfo = new ArrayList<>();
    	String hash = "";
	for(int i=0; i<split_hash.length; i++) {
		hash += "?";
		if(i<split_hash.length-1) {
			hash += ",";
		}	
	}
  		PreparedStatement psmt = null;
  		ResultSet rset = null;
  
  		String sql = prop.getProperty("searchHashPlaceInfo");
  		sql = sql.replace("@",  hash);
  		
	try {
	   psmt = conn.prepareStatement(sql);
	   for(int i=0; i<split_hash.length; i++) {
				psmt.setString(i+1, split_hash[i]);
	   }
     	   rset = psmt.executeQuery();
     
    	   while(rset.next()) {
    	     placeHashInfo.add(new Place(
                   rset.getString("CATEGORY_CODE"),
                   rset.getString("PLC_NAME"),
                   rset.getString("PLC_ADDRESS"),
                   rset.getString("PLC_PNUMBER"),
                   rset.getString("DAREA_NAME")));
     	   }
  		} catch (SQLException e) {
     	e.printStackTrace();
  		} finally {
	 close(rset);
	 close(psmt);
      }
      return placeHashInfo;
   }