Index: arms/html/armsDetailExceptTemplate/assets/css/detail.css =================================================================== diff -u -r6625dc335eb751d8c9f8bc04bc66ab96f9be40a2 -r3fe37ee679b318328536953aff6de30f59639f95 --- arms/html/armsDetailExceptTemplate/assets/css/detail.css (.../detail.css) (revision 6625dc335eb751d8c9f8bc04bc66ab96f9be40a2) +++ arms/html/armsDetailExceptTemplate/assets/css/detail.css (.../detail.css) (revision 3fe37ee679b318328536953aff6de30f59639f95) @@ -51,33 +51,32 @@ /* QnA 게시판 관련 CSS */ .chat-btn { - margin-right: 10px; display: inline-block; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; text-shadow: none; font-weight: normal; - font-size: 11.05px; - background-color: #56bc76; + font-size: 14px; + /*background-color: #56bc76;*/ color: #fff; - text-align: center; + text-align: right; white-space: nowrap; vertical-align: baseline; border: none; border-color: rgba(0,0,0,0.15) rgba(0,0,0,0.15) rgba(0,0,0,0.25); padding: 2px 6px; line-height: 1.5; border-radius: 0; + align-items: center; } .edit-chat-btn { - background-color: #56bc76; - transition: background-color 0.2s; + background-color: rgba(255,255,255,0); } .delete-chat-btn { - background-color: #e5603b; + background-color: rgba(255,255,255,0); } .send-btn { @@ -288,9 +287,16 @@ border-right: none; border-left: 5px solid #666; } -.chat-message-body.on-left .sender, .chat-message-body.on-left .text { +.chat-message-body.on-left .sender { text-align: right; + display: inline-block; + float: right; } + +.chat-message-body.on-left .text { + text-align: right; +} + .chat-message-body .arrow { display: block; position: absolute; @@ -515,4 +521,53 @@ .fa-spinner:before { content: ""; +} + +.dropdown-button { + background-color: rgba(255, 255, 255, 0); + padding: 8px; + font-size: 15px; + border: none; +} +.dropdown { + position: relative; + display: inline-block; +} +.dropdown-content { + display: none; + position: absolute; + background-color: #fff; + min-width: 100%; + padding: 5px; + box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.2); + border-radius: 5%; +} +.dropdown-content button { + color: black; + padding: 8px; + text-decoration: none; + display: block; +} +.dropdown-content button:hover { background-color: #adabab; } +.dropdown:hover .dropdown-content { + display: inline-block; + z-index: 9999; +} +/*.dropdown:hover .dropdown-button { background-color: #8c8c8c;}*/ + +.fa-ellipsis-v:before { + content: ""; +} + +.fa-trash-o:before { + content: "\f014"; +} + +.fa-edit:before { + content: "\f044"; +} + +.edit-text { + width: 100%; + margin-top: 10px; } \ No newline at end of file Index: arms/js/detail.js =================================================================== diff -u -r2dbc36bca54bb058b802f129e767a7edd04ca322 -r3fe37ee679b318328536953aff6de30f59639f95 --- arms/js/detail.js (.../detail.js) (revision 2dbc36bca54bb058b802f129e767a7edd04ca322) +++ arms/js/detail.js (.../detail.js) (revision 3fe37ee679b318328536953aff6de30f59639f95) @@ -902,9 +902,9 @@ var c_id = comment.c_id; var sender = comment.c_req_comment_sender; - var date = comment.c_req_comment_date; + var date = dateFormat(comment.c_req_comment_date); var title = comment.c_title; - var contents = comment.c_req_comment_contents; + var contents = `

` + comment.c_req_comment_contents+`

`; var $newHtml; /* 로그인한 사용자 일 경우 우측으로 아닐 경우 좌측으로 보이게 하기 */ @@ -914,10 +914,19 @@ var buttonsHtml = ''; if (sender === userName) { - buttonsHtml = `
- - -
`; + buttonsHtml = `
+ +
+ + +
+
`; } $newHtml = $(`
@@ -927,6 +936,7 @@
+ ${buttonsHtml}
${(position === "on-left") ? `${date}   \t` : ''} @@ -935,24 +945,54 @@
${contents} - ${buttonsHtml}
+
+ `); $chatMessages.append($newHtml); } $('.edit-chat-btn').on('click', function(e){ - var c_id = $(this).val(); - req_comment_edit_btn_click(c_id); + var parentDiv = $(this).closest('.chat-message-body'); + var commentText = parentDiv.find('#contents').text(); + + parentDiv.find('.edit-text').val(commentText); + parentDiv.find('#contents').hide(); + parentDiv.find('.dropdown-button').hide(); + parentDiv.find('.edit-comment').show(); + + console.log(commentText); + // req_comment_edit_btn_click(c_id); }); $('.delete-chat-btn').on('click', function(e){ var c_id = $(this).val(); req_comment_delete_btn_click(c_id); }); + $('.cancel-button').on('click', function(e){ + var commentDiv = $(this).closest('.chat-message-body'); + commentDiv.find('#contents').show(); + commentDiv.find('.dropdown-button').show(); + commentDiv.find('.edit-comment').hide(); + }); + + $('.save-button').on('click', function(e){ + var c_id = $(this).val(); + console.log(c_id); + var editText = $(this).closest('.edit-comment'); + var commentText = editText.find('.edit-text').val(); + console.log(commentText); + req_comment_edit_btn_click(c_id, commentText); + }); } }, beforeSend: function () { @@ -1061,40 +1101,45 @@ }); } -function req_comment_edit_btn_click(c_id) { - var urlParams = new URL(location.href).searchParams; - var selectedPdService = urlParams.get('pdService'); - var selectedPdServiceVersion = urlParams.get('pdServiceVersion'); - selectedJsTreeId = urlParams.get('reqAdd'); - console.log("edit : " + c_id); - const cTitle = ""; - /*$.ajax({ - url: "/auth-user/api/arms/reqComment/addNode.do", - type: "POST", - data: { - ref: 2, - c_pdservice_link: selectedPdService, - c_version_link: selectedPdServiceVersion, - c_req_link: selectedJsTreeId, - c_type: "default", - c_title: cTitle - }, - statusCode: { - 200: function () { - //모달 팝업 끝내고 - alert("success"); - $("#close_pdservice").trigger("click"); - //데이터 테이블 데이터 재 로드 - } - }, - beforeSend: function () { - }, - complete: function () { - }, - error: function (e) { - jError("신규 게시물 등록 중 에러가 발생했습니다."); +function req_comment_edit_btn_click(c_id, commentText) { + if (confirm("해당 글을 수정하시겠습니까?")) { + console.log("edit : " + c_id + "\ncontents : " + commentText); + var urlParams = new URL(location.href).searchParams; + var selectedPdService = urlParams.get('pdService'); + selectedJsTreeId = urlParams.get('reqAdd'); + console.log("edit : " + c_id); + + var content = commentText; + if (content === null || content === '') { + alert("질문을 작성 후 수정해주세요."); + return; } - });*/ + + $(".spinner").html(" 데이터를 로드 중입니다..."); + $.ajax({ + url: "/auth-user/api/arms/reqComment/updateNode.do", + type: "PUT", + data: { + c_id: c_id, + c_req_comment_contents: commentText + }, + statusCode: { + 200: function () { + //모달 팝업 끝내고 + jSuccess("수정 되었습니다."); + getTotalCount(); + getReqCommentList(1); + } + }, + beforeSend: function () { + }, + complete: function () { + }, + error: function (e) { + jError("신규 게시물 등록 중 에러가 발생했습니다."); + } + }); + } } function req_comment_delete_btn_click(c_id) {