diff options
author | dartcafe <github@dartcafe.de> | 2022-03-25 16:20:48 +0300 |
---|---|---|
committer | dartcafe <github@dartcafe.de> | 2022-03-27 13:09:39 +0300 |
commit | 66c307d797defe30c0d7196b67abb53563d619cd (patch) | |
tree | 2679af20acb01c473563c9e6b344c85523e45e93 /src | |
parent | 5d8a71fb77431fcc49385a2aeaa33bdc7885ec3d (diff) |
move delete action to subcomments
Signed-off-by: dartcafe <github@dartcafe.de>
Diffstat (limited to 'src')
-rw-r--r-- | src/js/components/Comments/CommentItem.vue | 47 | ||||
-rw-r--r-- | src/js/store/modules/comments.js | 5 |
2 files changed, 36 insertions, 16 deletions
diff --git a/src/js/components/Comments/CommentItem.vue b/src/js/components/Comments/CommentItem.vue index 5e0107f2..732fd8ce 100644 --- a/src/js/components/Comments/CommentItem.vue +++ b/src/js/components/Comments/CommentItem.vue @@ -26,16 +26,18 @@ <div class="comment-item__content"> <span class="comment-item__user">{{ comment.user.displayName }}</span> <span class="comment-item__date">{{ dateCommentedRelative }}</span> - <p v-for="(subComment) in comment.subComments" + <div v-for="(subComment) in comment.subComments" :key="subComment.id" - class="comment-item__comment"> - {{ subComment.comment }} - </p> + class="comment-item__subcomment"> + <span class="comment-item__comment"> + {{ subComment.comment }} + </span> + <ActionDelete v-if="comment.user.userId === acl.userId || acl.isOwner" + icon-mode + :title="t('polls', 'Delete comment')" + @delete="deleteComment(subComment)" /> + </div> </div> - <ActionDelete v-if="comment.user.userId === acl.userId || acl.isOwner" - icon-mode - :title="t('polls', 'Delete comment')" - @delete="deleteComment()" /> </div> </template> @@ -68,9 +70,9 @@ export default { }, methods: { - async deleteComment() { + async deleteComment(comment) { try { - await this.$store.dispatch({ type: 'comments/delete', comment: this.comment }) + await this.$store.dispatch({ type: 'comments/delete', comment }) } catch { showError(t('polls', 'Error while deleting the comment')) } @@ -100,13 +102,30 @@ export default { } } - .comment-item__comment { - hyphens: auto; - } - .comment-item__content { margin-left: 8px; flex: 1 1; padding-top: 2px; + + .material-design-icon.delete-icon { + // display: none; + visibility: hidden; + } + + .comment-item__subcomment { + display: flex; + &:hover { + .material-design-icon.delete-icon { + visibility: visible; + // display: flex; + } + } + } + + .comment-item__comment { + hyphens: auto; + flex: 1; + } } + </style> diff --git a/src/js/store/modules/comments.js b/src/js/store/modules/comments.js index c18618f7..946cf300 100644 --- a/src/js/store/modules/comments.js +++ b/src/js/store/modules/comments.js @@ -93,8 +93,9 @@ const actions = { } try { - const response = await axios.post(generateUrl(`${endPoint}/comment`), { message: payload.message }) - context.commit('add', { comment: response.data.comment }) + await axios.post(generateUrl(`${endPoint}/comment`), { message: payload.message }) + context.dispatch('list') + // context.commit('add', { comment: response.data.comment }) } catch (e) { console.error('Error writing comment', { error: e.response }, { payload }) throw e |