eastargh
333 lines
9.9 KiB
Plaintext
333 lines
9.9 KiB
Plaintext
<%@ page language="java" contentType="text/html; charset=utf-8"%>
|
|
<%@ page import="java.io.*"%>
|
|
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
|
|
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
|
|
<%@ include file="/jsp/common/include/localemessage.jsp" %>
|
|
<%
|
|
response.setHeader("Pragma", "No-cache");
|
|
response.setHeader("Cache-Control", "no-cache");
|
|
response.setHeader("Expires", "0");
|
|
%>
|
|
<html>
|
|
<head>
|
|
<title>Q&A 문의</title>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
<jsp:include page="/jsp/common/include/css.jsp"/>
|
|
<jsp:include page="/jsp/common/include/script.jsp"/>
|
|
<style>
|
|
.inquiry-section {
|
|
margin-bottom: 15px;
|
|
border: 1px solid #e0e0e0;
|
|
padding: 20px;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.response-section {
|
|
margin-bottom: 30px;
|
|
border: 1px solid #e0e0e0; /* 동일한 박스 스타일 */
|
|
padding: 20px;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.section-title {
|
|
font-size: 18px;
|
|
font-weight: bold;
|
|
margin-bottom: 15px;
|
|
padding-bottom: 10px;
|
|
border-bottom: 2px solid #e0e0e0; /* 제목 아래 줄 긋기 */
|
|
}
|
|
|
|
.comment-section {
|
|
margin-bottom: 30px;
|
|
border: 1px solid #e0e0e0; /* 동일한 박스 스타일 */
|
|
padding: 20px;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.info-row {
|
|
margin-bottom: 10px;
|
|
display: flex;
|
|
}
|
|
|
|
.info-label {
|
|
font-weight: bold;
|
|
width: 80px;
|
|
}
|
|
|
|
.info-content {
|
|
flex: 1;
|
|
padding-left: 5px;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
#responseDetail {
|
|
width: 100%;
|
|
min-height: 200px;
|
|
}
|
|
|
|
#commentDetail {
|
|
min-height: 100px;
|
|
border: 1px solid #00000032;
|
|
border-radius: 4px;
|
|
padding: 10px;
|
|
flex: 1;
|
|
font-family: '맑은고딕'
|
|
}
|
|
|
|
.required-mark {
|
|
color: red;
|
|
margin-left: 2px;
|
|
font-weight: bold;
|
|
}
|
|
</style>
|
|
<script language="javascript">
|
|
var url = '<c:url value="/onl/apim/portalinquiry/portalInquiryMan.json" />';
|
|
var url_view = '<c:url value="/onl/apim/portalinquiry/portalInquiryMan.view" />';
|
|
var file_download = '<c:url value="/file/download.do" />';
|
|
|
|
function decodeHTMLEntities(text) {
|
|
var textArea = document.createElement('textarea');
|
|
textArea.innerHTML = text;
|
|
return textArea.value;
|
|
}
|
|
|
|
function detail(key) {
|
|
$.ajax({
|
|
type: "POST",
|
|
url: url,
|
|
dataType: "json",
|
|
data: {cmd: 'DETAIL', id: key},
|
|
success: function (data) {
|
|
$("#id").val(key);
|
|
$("#inquirySubject").text(data.inquirySubject);
|
|
$("#inquiryDetail").html(data.inquiryDetail);
|
|
$("#inquiryStatus").text(data.inquiryStatus === 'PENDING' ? '문의중' : '답변완료');
|
|
$("#inquirer").text(data.inquirer.userName);
|
|
$("#createdDate").text(timeStampFormat(data.createdDate));
|
|
$("#responder").text(data.responderName || '');
|
|
$("#responseDate").text(timeStampFormat(data.responseDate));
|
|
|
|
var decodedContent = decodeHTMLEntities(data.responseDetail);
|
|
$("#responseDetail").summernote('code', decodedContent || '');
|
|
|
|
// 댓글 표시
|
|
listComment(key);
|
|
|
|
// 첨부 파일 표시
|
|
displayAttachFiles(data.fileInfo);
|
|
|
|
},
|
|
error: function (e) {
|
|
alert(e.responseText);
|
|
}
|
|
});
|
|
}
|
|
|
|
function listComment(inquiryId) {
|
|
$.ajax({
|
|
type: "POST",
|
|
url: url,
|
|
dataType: "json",
|
|
data: {cmd: 'LIST_COMMENT', id: inquiryId},
|
|
success: function (data) {
|
|
var $commentList = $('#commentList');
|
|
$commentList.empty();
|
|
if (!data || data.length === 0) return;
|
|
$.each(data, function (i, comment) {
|
|
var date = comment.createdDate ? timeStampFormat(comment.createdDate) : '';
|
|
var row = $('<div>').addClass('info-row');
|
|
$('<div>').addClass('info-label').css('color', '#555').text(comment.writerName || '').appendTo(row);
|
|
var content = $('<div>').addClass('info-content');
|
|
$('<div>').css('white-space', 'pre-wrap').text(comment.commentDetail).appendTo(content);
|
|
var meta = $('<div>').css({'font-size': '0.9em', 'color': '#999', 'margin-top': '2px'});
|
|
$('<span>').text(date).appendTo(meta);
|
|
$('<button>').attr('type', 'button').addClass('cssbtn smallBtn2').css({'margin-left': '8px', 'font-size': '0.85em', 'padding': '1px 6px'})
|
|
.text('delete').on('click', (function(id, inquiryId) {
|
|
return function() { deleteComment(id, inquiryId); };
|
|
})(comment.id, comment.inquiryId))
|
|
.appendTo(meta);
|
|
meta.appendTo(content);
|
|
content.appendTo(row);
|
|
row.appendTo($commentList);
|
|
});
|
|
},
|
|
error: function (e) {
|
|
alert(e.responseText);
|
|
}
|
|
});
|
|
}
|
|
|
|
function deleteComment(commentId, inquiryId) {
|
|
if (!confirm("댓글을 삭제하시겠습니까?")) return;
|
|
$.ajax({
|
|
type: "POST",
|
|
url: url,
|
|
data: {cmd: 'DELETE_COMMENT', id: commentId},
|
|
success: function () {
|
|
listComment(inquiryId);
|
|
},
|
|
error: function (e) {
|
|
alert(e.responseText);
|
|
}
|
|
});
|
|
}
|
|
|
|
$(document).ready(function () {
|
|
var returnUrl = getReturnUrlForReturn();
|
|
var key = "${param.id}";
|
|
|
|
// Summernote 에디터 초기화 (이미지 붙여넣기 data-uri 방식, 리사이징 지원)
|
|
initSummernote('#responseDetail', {
|
|
placeholder: '여기에 답변을 입력하세요.',
|
|
height: 200
|
|
});
|
|
|
|
|
|
if (key) {
|
|
detail(key);
|
|
}
|
|
|
|
$("#btn_modify").click(function () {
|
|
if (!checkRequired("ajaxForm")) return;
|
|
if (!confirm("<%= localeMessage.getString("common.checkSave")%>")) return;
|
|
|
|
var postData = $('#ajaxForm').serializeArray();
|
|
postData.push({name: "cmd", value: "INSERT"});
|
|
|
|
$.ajax({
|
|
type: "POST",
|
|
url: url,
|
|
data: postData,
|
|
success: function (json) {
|
|
alert("<%= localeMessage.getString("common.saveMsg") %>");
|
|
goNav(returnUrl);
|
|
},
|
|
error: function (e) {
|
|
alert(e.responseText);
|
|
}
|
|
});
|
|
});
|
|
|
|
$("#btn_comment").click(function () {
|
|
|
|
if (!confirm("<%= localeMessage.getString("common.checkSave")%>")) return;
|
|
|
|
$.ajax({
|
|
type: "POST",
|
|
url: url,
|
|
data: {
|
|
cmd: "INSERT_COMMENT",
|
|
inquiryId: $('#id').val(),
|
|
commentDetail: $('#commentDetail').val(),
|
|
},
|
|
success: function (json) {
|
|
alert("<%= localeMessage.getString("common.saveMsg") %>");
|
|
$('#commentDetail').val('');
|
|
listComment(key);
|
|
},
|
|
error: function (e) {
|
|
alert(e.responseText);
|
|
}
|
|
});
|
|
});
|
|
|
|
$("#btn_previous").click(function () {
|
|
goNav(returnUrl);
|
|
});
|
|
});
|
|
|
|
function displayAttachFiles(fileInfo) {
|
|
var $attachFileRow = $('#attachFileRow');
|
|
var $attachFiles = $('#attachFiles');
|
|
|
|
if (fileInfo && fileInfo.fileDetails && fileInfo.fileDetails.length > 0) {
|
|
var attachFilesHtml = '';
|
|
fileInfo.fileDetails.forEach(function(file) {
|
|
attachFilesHtml += '<span style="cursor: pointer;" onclick="downloadFile(\'' + file.fileId + '\', \'' + file.fileSn + '\')">';
|
|
attachFilesHtml += file.originalFileName + '.' + file.fileExtension;
|
|
var iconPath = '${pageContext.request.contextPath}/images/icon_file.png';
|
|
attachFilesHtml += '<img src="' + iconPath + '" style="vertical-align: middle; margin-left: 5px; height: 1.2em">';
|
|
attachFilesHtml += '</span><br>';
|
|
});
|
|
$attachFiles.html(attachFilesHtml);
|
|
$attachFileRow.show().css("cursor", "pointer");
|
|
} else {
|
|
$attachFileRow.hide();
|
|
}
|
|
}
|
|
|
|
function downloadFile(fileId, fileSn) {
|
|
window.location.href = file_download + '?fileId=' + fileId + '&fileSn=' + fileSn;
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="right_box">
|
|
<div class="content_top">
|
|
<ul class="path">
|
|
<li><a href="#">${rmsMenuPath}</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="content_middle">
|
|
<div class="search_wrap">
|
|
<button type="button" class="cssbtn" id="btn_modify" level="W" status="DETAIL,NEW"><i class="material-icons">save</i> <%= localeMessage.getString("button.modify") %></button>
|
|
<button type="button" class="cssbtn" id="btn_previous" level="R" status="DETAIL,NEW"><i class="material-icons">arrow_back</i> <%= localeMessage.getString("button.previous") %></button>
|
|
</div>
|
|
<div class="title">Q&A 상세</div>
|
|
<form id="ajaxForm">
|
|
<div class="inquiry-section">
|
|
<div class="section-title" id="inquirySubject"></div>
|
|
<div class="info-row">
|
|
<div class="info-label">작성자</div>
|
|
<div id="inquirer" class="info-content"></div>
|
|
</div>
|
|
<div class="info-row">
|
|
<div class="info-label">작성일</div>
|
|
<div id="createdDate" class="info-content"></div>
|
|
</div>
|
|
<div class="info-row" id="attachFileRow" style="display: none;">
|
|
<div class="info-label">첨부파일</div>
|
|
<div id="attachFiles" class="info-content"></div>
|
|
</div>
|
|
<div class="info-row">
|
|
<div class="info-label">문의 내용</div>
|
|
<div id="inquiryDetail" class="info-content" style="white-space: pre-line;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 답변 작성 부분 -->
|
|
<div class="response-section">
|
|
<div class="info-row">
|
|
<div class="info-label">답변자</div>
|
|
<div id="responder" class="info-content"></div>
|
|
</div>
|
|
<div class="info-row">
|
|
<div class="info-label">답변일</div>
|
|
<div id="responseDate" class="info-content"></div>
|
|
</div>
|
|
<div class="info-row">
|
|
<div class="info-label">답변 내용<span class="required-mark">*</span></div>
|
|
<div style="flex: 1; padding-top: 5px;">
|
|
<textarea id="responseDetail" name="responseDetail" data-required data-warning="답변 내용을 입력하여 주십시오."></textarea>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 댓글 작성 부분 -->
|
|
<div class="comment-section">
|
|
<div id="commentList"></div>
|
|
<div class="info-row">
|
|
<div class="info-label">${sessionScope.login.userName}</div>
|
|
<div style="flex:1; display: flex; gap: 8px; align-items: stretch;">
|
|
<textarea id="commentDetail" name="commentDetail" data-required data-warning="댓글 내용을 입력하여 주십시오."></textarea>
|
|
<button type="button" class="cssbtn" id="btn_comment" level="W" style="width:100px; height: 100px; text-align:center; ">댓글등록</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<input type="hidden" name="id" id="id">
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html> |