add EditCommentForm spec.js

This commit is contained in:
ALau2088 2019-06-27 10:59:53 -07:00
parent 5e9f46405e
commit 912b94d43c
5 changed files with 36 additions and 40 deletions

View File

@ -74,9 +74,6 @@ export default {
session.close()
return commentReturnedWithAuthor
},
UpdateComment: async (object, params, context, resolveInfo) => {
await neo4jgraphql(object, params, context, resolveInfo, false)
},
DeleteComment: async (object, params, context, resolveInfo) => {
const comment = await neo4jgraphql(object, params, context, resolveInfo, false)

View File

@ -1,13 +1,13 @@
<template>
<div v-if="(comment.deleted || comment.disabled) && !isModerator">
<ds-text style="padding-left: 40px; font-weight: bold;" color="soft">
<ds-icon name="ban"/>
<ds-icon name="ban" />
{{ this.$t('comment.content.unavailable-placeholder') }}
</ds-text>
</div>
<div v-else :class="{ comment: true, 'disabled-content': comment.deleted || comment.disabled }">
<ds-space margin-bottom="x-small">
<hc-user :user="author" :date-time="comment.createdAt"/>
<hc-user :user="author" :date-time="comment.createdAt" />
</ds-space>
<!-- Content Menu (can open Modals) -->
<no-ssr>
@ -23,7 +23,7 @@
</no-ssr>
<!-- eslint-disable vue/no-v-html -->
<!-- TODO: replace editor content with tiptap render view -->
<ds-space margin-bottom="small"/>
<ds-space margin-bottom="small" />
<div v-if="openEditCommentMenu">
<hc-edit-comment-form
v-bind:comment="comment"
@ -31,7 +31,7 @@
v-on:showEditCommentMenu="editCommentMenu"
/>
</div>
<div v-else style="padding-left: 40px;" v-html="comment.contentExcerpt"/>
<div v-else style="padding-left: 40px;" v-html="comment.contentExcerpt" />
<!-- eslint-enable vue/no-v-html -->
</div>
</template>

View File

@ -3,7 +3,7 @@
<template slot="default" slot-scope="{ toggleMenu }">
<slot name="button" :toggleMenu="toggleMenu">
<ds-button class="content-menu-trigger" size="small" ghost @click.prevent="toggleMenu">
<ds-icon name="ellipsis-v"/>
<ds-icon name="ellipsis-v" />
</ds-button>
</slot>
</template>
@ -16,7 +16,7 @@
:parents="item.parents"
@click.stop.prevent="openItem(item.route, toggleMenu)"
>
<ds-icon :name="item.route.icon"/>
<ds-icon :name="item.route.icon" />
{{ item.route.name }}
</ds-menu-item>
</ds-menu>

View File

@ -2,17 +2,20 @@
<div id="comments">
<h3 style="margin-top: -10px;">
<span>
<ds-icon name="comments"/>
<ds-icon name="comments" />
<ds-tag
v-if="comments"
style="margin-top: -4px; margin-left: -12px; position: absolute;"
color="primary"
size="small"
round
>{{ comments.length }}</ds-tag>&nbsp; Comments
>
{{ comments.length }}
</ds-tag>
&nbsp; Comments
</span>
</h3>
<ds-space margin-bottom="large"/>
<ds-space margin-bottom="large" />
<div v-if="comments && comments.length" id="comments" class="comments">
<comment
v-for="(comment, index) in comments"
@ -22,7 +25,7 @@
@deleteComment="comments.splice(index, 1)"
/>
</div>
<hc-empty v-else name="empty" icon="messages"/>
<hc-empty v-else name="empty" icon="messages" />
</div>
</template>
<script>

View File

@ -3,26 +3,25 @@
<template slot-scope="{ errors }">
<ds-card>
<!-- <no-ssr> -->
<hc-editor ref="editor" :users="users" :value="form.content" @input="updateEditorContent"/>
<hc-editor ref="editor" :users="users" :value="form.content" @input="updateEditorContent" />
<!-- </no-ssr> -->
<ds-space/>
<ds-space />
<ds-flex :gutter="{ base: 'small', md: 'small', sm: 'x-large', xs: 'x-large' }">
<ds-flex-item :width="{ base: '0%', md: '50%', sm: '0%', xs: '0%' }"/>
<ds-flex-item :width="{ base: '0%', md: '50%', sm: '0%', xs: '0%' }" />
<ds-flex-item :width="{ base: '40%', md: '20%', sm: '30%', xs: '30%' }">
<ds-button
:disabled="disabled"
ghost
class="cancelBtn"
@click.prevent="closeEditWindow"
>{{ $t('actions.cancel') }}</ds-button>
>
{{ $t('actions.cancel') }}
</ds-button>
</ds-flex-item>
<ds-flex-item :width="{ base: '40%', md: '20%', sm: '40%', xs: '40%' }">
<ds-button
type="submit"
:loading="loading"
:disabled="disabled || errors"
primary
>{{ $t('post.comment.submit') }}</ds-button>
<ds-button type="submit" :loading="loading" :disabled="disabled || errors" primary>
{{ $t('post.comment.submit') }}
</ds-button>
</ds-flex-item>
</ds-flex>
</ds-card>
@ -36,26 +35,24 @@ import HcEditor from '~/components/Editor'
export default {
components: {
HcEditor
HcEditor,
},
props: {
post: { type: Object, default: () => {} },
comments: { type: Array, default: () => [] },
comment: {
type: Object,
default() {
return {}
}
}
},
},
},
data() {
return {
disabled: false,
loading: false,
form: {
content: this.comment.contentExcerpt
content: this.comment.contentExcerpt,
},
users: []
users: [],
}
},
methods: {
@ -77,22 +74,21 @@ export default {
this.$apollo
.mutate({
mutation: gql`
mutation($postId: ID, $content: String!, $id: ID!) {
UpdateComment(postId: $postId, content: $content, id: $id) {
mutation($content: String!, $id: ID!) {
UpdateComment(content: $content, id: $id) {
id
content
}
}
`,
variables: {
postId: this.post.id,
content: this.form.content,
id: this.comment.id
}
id: this.comment.id,
},
})
.then(res => {
this.loading = false
this.$root.$emit('refetchPostComments')
this.$toast.success(this.$t('post.comment.updated'))
this.disabled = false
this.$emit('showEditCommentMenu', false)
@ -100,7 +96,7 @@ export default {
.catch(err => {
this.$toast.error(err.message)
})
}
},
},
apollo: {
User: {
@ -114,8 +110,8 @@ export default {
},
result(result) {
this.users = result.data.User
}
}
}
},
},
},
}
</script>