@RequestMapping(value = "/myHomeMod.do", method = RequestMethod.POST)
@ResponseBody
public String modArticle(@RequestParam("boardMyhomeArticleNo") int articleNo,
@RequestParam("boardMyhomeTitle") String title,
@RequestParam("boardMyhomeContents") String content,
@RequestParam("boardMyhomeHosingType") String housingType,
@RequestParam("boardMyhomeHomeSize") String homeSize) throws Exception {
MyhomeDomain myhomeDomain = new MyhomeDomain();
myhomeDomain.setBoardMyhomeArticleNo(articleNo);
myhomeDomain.setBoardMyhomeTitle(title);
myhomeDomain.setBoardMyhomeContents(content);
myhomeDomain.setBoardMyhomeHousingType(housingType);
myhomeDomain.setBoardMyhomeHomeSize(homeSize);
try {
myhomeService.modArticle(myhomeDomain);
// 폴더에 존재하지 않은 파일 삭제
int boardMyhomeArticleNo = myhomeDomain.getBoardMyhomeArticleNo();
String fileRoot = "C:\\\\gami\\\\board\\\\board_myhome\\\\" + boardMyhomeArticleNo + "\\\\"; // 외부 경로
String coFileRoot = "C:\\\\gami\\\\board\\\\board_myhome\\\\coverImage\\\\" + boardMyhomeArticleNo + "\\\\";
// 위 경로로 파일 객체 생성
File saveFileDir = new File(fileRoot);
File saveFileDir2 = new File(coFileRoot);
// 파일 목록들을 배열에 담음.
String[] saveFileList;
// 파일 목록들을 배열에 담음.
if(saveFileDir.exists()) {
saveFileList = saveFileDir.list();
// for문을 돌려서 작성된 글 내용에 파일이 포함되었나 확인
for(String saveFileName: saveFileList) {
System.out.println(saveFileName);
boolean Check = myhomeDomain.getBoardMyhomeContents().contains(saveFileName);
System.out.println("사진 포함 여부 : " + Check);
// 만약 글내용에 포함되어 있지 않다면 해당 파일 삭제.
if(myhomeDomain.getBoardMyhomeContents().contains(saveFileName)==false) {
fileRoot = "C:\\\\gami\\\\board\\\\board_myhome\\\\" + boardMyhomeArticleNo + "\\\\" + saveFileName;
saveFileDir = new File(fileRoot);
FileUtils.deleteQuietly(saveFileDir);
}
}
}
//커버이미지 삭제
String coverImage = myhomeService.getCoverImageName(boardMyhomeArticleNo); // 파일이름 가져오기
System.out.println("커버이미지넴 ???"+coverImage);
if (coverImage != null && !coverImage.isEmpty()) {
// 폴더가 존재하는지 확인
if (saveFileDir2.exists() && saveFileDir2.isDirectory()) {
// 폴더 내 모든 파일 리스트 가져오기
File[] fileList = saveFileDir2.listFiles();
if (fileList != null) {
for (File file : fileList) {
// 커버 이미지가 아닌 파일이면 삭제
if (!file.getName().equals(coverImage)) {
boolean deleted = file.delete();
System.out.println("파일 삭제됨: " + file.getName() + ":" + deleted);
}
}
}
}
}
return "success";
}catch (Exception e) {
return "fail";
}
}
<MyhomeService.java>
public void modArticle(MyhomeDomain myhomeDomain) throws Exception;
<MyhomeServiceImpl.java>
@Override
public void modArticle(MyhomeDomain myhomeDomain) throws Exception {
myhomeDAO.updateArticle(myhomeDomain);
}
<MyhomeDAO.java>
public void updateArticle(MyhomeDomain myhomeDomain) throws DataAccessException;
<MyhomeDAOImpl.java>
@Override
public void updateArticle(MyhomeDomain myhomeDomain) throws DataAccessException {
sqlSession.update("mapper.board.updateArticle", myhomeDomain);
}
<script>
// 썸머노트 이미지 업로드 함수
function uploadSummernoteImageFile(file, el) {
var boardMyhomeArticleNo = ${selectMyHome.boardMyhomeArticleNo};
let data = new FormData();
data.append("file", file);
data.append("boardMyhomeArticleNo", boardMyhomeArticleNo);
$.ajax({
data: data,
type: "POST",
url: "/gami/board/board_myhome/uploadSummernoteImageFile.do",
contentType: false,
enctype: 'multipart/form-data',
processData: false,
success: function(data) {
if(data.responseCode == "success") {
setTimeout(function () {
$(el).summernote('insertImage', "/board_myhome" + data.fileName, function ($image) {
$image.css('width', "20%");
});
}, 0);
} else if(data.responseCode == "extension") {
alert("gif, jpg, png만 가능합니다.");
} else {
alert("파일 업로드에 실패 하였습니다.");
}
}
});
}
// 썸머노트 이미지 삭제 함수
function deleteFile(fileName) {
$.ajax({
url: "/gami/board/board_myhome/deleteSummernoteImageFile.do", // 서버에 요청을 보낼 URL
type: "POST",
data: { file: fileName,
boardMyhomeArticleNo:${selectMyHome.boardMyhomeArticleNo}
},
success: function(response) {
let data = JSON.parse(response); // 서버에서 받은 JSON 응답 처리
if (data.responseCode === "success") {
alert("이미지가 삭제되었습니다.");
// 본문에서 이미지 삭제
$("img[src$='" + fileName + "']").remove();
} else {
alert("이미지 삭제에 실패하였습니다.");
}
}
});
}
// 글 저장 함수
function boardWrite() {
if ($("#title").val() == "") {
alert("제목을 입력하세요");
return false;
}
if ($('#summernote').summernote('isEmpty')) {
alert("내용을 입력하세요");
return false;
}
var formData = new FormData($("#articleForm")[0]);
$.ajax({
type: "POST",
enctype: 'multipart/form-data',
processData: false,
contentType: false,
url: "/gami/board/board_myhome/insertBoard.do",
data: formData,
dataType: "text",
success: function(response) {
if (response === "success") {
alert("게시글이 성공적으로 수정되었습니다.");
window.location.href = "/gami/board/board_myhome/myHomeList.do";
} else {
alert("게시글 작성 중 오류가 발생하였습니다.");
}
}
});
}
$(document).ready(function() {
$("#summernote").summernote({
height: 600,
placeholder: "여기에 내용을 입력하세요.",
lang: "ko-KR",
focus: true,
toolbar: [
// 스타일 설정
['style', ['style']],
// 글꼴 설정
['fontname', ['fontname']],
// 글자 크기 설정
['fontsize', ['fontsize']],
// 굵기, 기울임꼴, 밑줄,취소 선, 서식지우기
['style', ['bold', 'italic', 'underline','strikethrough', 'clear']],
// 글자색
['color', ['forecolor','color']],
// 표만들기
['table', ['table']],
// 글머리 기호, 번호매기기, 문단정렬
['para', ['ul', 'ol', 'paragraph']],
// 줄간격
['height', ['height']],
// 그림첨부, 링크만들기, 동영상첨부
['insert',['picture','link','video']],
// 코드보기, 확대해서보기, 도움말
['view', ['codeview','fullscreen', 'help']]
],
fontNames: ['Arial', 'Arial Black', 'Comic Sans MS', 'Courier New','맑은 고딕','궁서','굴림체','굴림','돋음체','바탕체'],
fontSizes: ['8','9','10','11','12','14','16','18','20','22','24','28','30','36','50','72'],
callbacks: {
onImageUpload: function(files, editor, welEditable) {
for (var i = files.length - 1; i >= 0; i--) {
uploadSummernoteImageFile(files[i], this);
}
},
onMediaDelete: function($target) {
if (confirm("이미지를 삭제하시겠습니까?")) {
let fileName = $target.attr('src').split('/').pop();
deleteFile(fileName);
}
}
}
});
});
</script>
</head>
<body>
<!-- 커버사진 및 썸네일 이미지 -->
<div class="drag-drop-area" id="dropZone">
수정할 커버 사진을 이곳에 드래그하세요.
</div>
<div class="preview-container" id="previewContainer"></div>
<!-- 수정 폼 -->
<div class="form-container">
<form action="${contextPath}/board/board_myhome/myHomeMod.do" method="post" enctype="multipart/form-data">
<input type="hidden" name="boardMyhomeArticleNo" value="${selectMyHome.boardMyhomeArticleNo}">
<label for="boardMyhomeTitle">제목</label>
<input type="text" id="boardMyhomeTitle" name="boardMyhomeTitle" value="${selectMyHome.boardMyhomeTitle}">
<label for="boardMyhomeContents">내용</label>
<textarea id="summernote" name="boardMyhomeContents">${selectMyHome.boardMyhomeContents}</textarea>
<!-- 수정 완료 버튼 -->
<div class="button-group">
<input type="submit" value="수정 완료">
</div>
</form>
</div>
</body>
커버이미지 수정 (3.14 이민주)
document.addEventListener("DOMContentLoaded", function () {
var dropZone = document.getElementById("dropZone");
var previewContainer = document.getElementById("previewContainer");
dropZone.addEventListener("dragover", function (event) { // 드래그 중일때 이벤트
event.preventDefault(); // 기본동작 방지
dropZone.classList.add("dragover");
});
dropZone.addEventListener("dragleave", function () { // dragzone 벗어났을 때 이벤트
dropZone.classList.remove("dragover");
});
dropZone.addEventListener("drop", function (event) { // drop이벤트
event.preventDefault();
dropZone.classList.remove("dragover");
var files = event.dataTransfer.files;
handleFile(files[0]); // 파일 하나만 업로드 가능하도록 제한
// 파일을 FormData에 추가하여 서버로 전송
var boardMyhomeArticleNo = ${selectMyHome.boardMyhomeArticleNo};
var formData = new FormData();
formData.append("coverImage", files[0]);
formData.append("boardMyhomeArticleNo", boardMyhomeArticleNo); // 기존 아티클넘버
$.ajax({
type: "POST",
enctype: 'multipart/form-data',
processData: false,
contentType: false,
url: "/gami/board/board_myhome/coverImageUpload.do",
data: formData,
success: function(response) {
console.log(response);
if (response === "success") {
alert("파일이 성공적으로 업로드되었습니다.");
} else {
alert("파일 업로드 중 오류가 발생했습니다.");
}
}
});
});
function handleFile(file) {
if (!file.type.startsWith("image/")) {
alert("이미지 파일만 업로드 가능합니다!");
return;
}
previewContainer.innerHTML = ""; // 기존 미리보기 삭제
var reader = new FileReader(); //FileReader:파일 읽는 API
reader.onload = function (e) {
var img = document.createElement("img");
img.src = e.target.result; // 읽어온 파일의 url
previewContainer.appendChild(img); // 미리보기에 이미지 삽입
};
reader.readAsDataURL(file);
}
});
document.addEventListener("DOMContentLoaded", function () {
var dropZone = document.getElementById("dropZone");
// 커버 이미지가 있으면 배경 이미지로 설정
<c:if test="${not empty selectMyHome.imageFileName}">
var coverImageUrl = "${contextPath}/board/board_myhome/myHomeCoverImages.do?articleNo=${selectMyHome.boardMyhomeArticleNo}&image=${selectMyHome.imageFileName}";
dropZone.style.backgroundImage = "url('" + coverImageUrl + "')";
</c:if>
});
필터링 수정 추가 (3.21 이민주)
<div class="filtering">
주거형태 <select name="boardMyhomeHosingType" id="housingType">
<option value="" disabled selected hidden>--- 주거형태를 선택하세요 ---</option>
<option value="원룸" <c:if test="${selectMyHome.boardMyhomeHousingType == '원룸'}">selected</c:if>>원룸</option>
<option value="아파트" <c:if test="${selectMyHome.boardMyhomeHousingType == '아파트'}">selected</c:if>>아파트</option>
<option value="단독주택" <c:if test="${selectMyHome.boardMyhomeHousingType == '단독주택'}">selected</c:if>>단독주택</option>
<option value="사무공간" <c:if test="${selectMyHome.boardMyhomeHousingType == '사무공간'}">selected</c:if>>사무공간</option>
<option value="상업공간" <c:if test="${selectMyHome.boardMyhomeHousingType == '상업공간'}">selected</c:if>>상업공간</option>
</select>
평수 <select name="boardMyhomeHomeSize" id="homeSize">
<option value="" disabled selected hidden>--- 평수를 선택하세요 ---</option>
<option value="9평 미만" <c:if test="${selectMyHome.boardMyhomeHomeSize == '9평 미만'}">selected</c:if>>9평 미만</option>
<option value="10평대" <c:if test="${selectMyHome.boardMyhomeHomeSize == '10평대'}">selected</c:if>>10평대</option>
<option value="20평대" <c:if test="${selectMyHome.boardMyhomeHomeSize == '20평대'}">selected</c:if>>20평대</option>
<option value="30평대" <c:if test="${selectMyHome.boardMyhomeHomeSize == '30평대'}">selected</c:if>>30평대</option>
<option value="40평 이상" <c:if test="${selectMyHome.boardMyhomeHomeSize == '40평 이상'}">selected</c:if>>40평 이상</option>
</select>
</div>