comment in accompanying course: add loader + fix when resetting to empty string

This commit is contained in:
nobohan 2022-03-10 18:12:42 +01:00
parent ded2ac7d48
commit a8b6609dbf

View File

@ -21,12 +21,17 @@
tag-name="textarea">
</ckeditor>
<div v-if="pinnedComment" class="metadata">
{{ $t('comment.created_by', [
pinnedComment.creator.text,
$d(pinnedComment.updatedAt.datetime, 'long')
])
}}
<div class="sub-comment">
<div v-if="pinnedComment" class="metadata">
{{ $t('comment.created_by', [
pinnedComment.creator.text,
$d(pinnedComment.updatedAt.datetime, 'long')
])
}}
</div>
<div class="loading">
<i v-if="loading" class="fa fa-circle-o-notch fa-spin" :title="$t('loading')"></i>
</div>
</div>
<div>
@ -62,7 +67,8 @@ export default {
formData: {
type: "accompanying_period_comment",
content: ''
}
},
loading: false
}
},
computed: {
@ -83,33 +89,37 @@ export default {
},
methods: {
onContentChange() {
this.loading = true;
let lastRecordedContent = this.formData.content;
setTimeout(() => {
if (lastRecordedContent === this.formData.content) {
if (this.pinnedComment) {
let body = this.formData;
Object.assign(body, {id: this.pinnedComment.id});
if (this.formData.content !== '') {
if (lastRecordedContent === this.formData.content) {
if (this.pinnedComment) {
let body = this.formData;
Object.assign(body, {id: this.pinnedComment.id});
this.$store.dispatch('updatePinnedComment', body)
.catch(({name, violations}) => {
if (name === 'ValidationException' || name === 'AccessException') {
violations.forEach((violation) => this.$toast.open({message: violation}));
} else {
this.$toast.open({message: 'An error occurred'})
}
});
} else {
this.$store.dispatch('addPinnedComment', this.formData)
.catch(({name, violations}) => {
if (name === 'ValidationException' || name === 'AccessException') {
violations.forEach((violation) => this.$toast.open({message: violation}));
} else {
this.$toast.open({message: 'An error occurred'})
}
});
this.$store.dispatch('updatePinnedComment', body)
.catch(({name, violations}) => {
if (name === 'ValidationException' || name === 'AccessException') {
violations.forEach((violation) => this.$toast.open({message: violation}));
} else {
this.$toast.open({message: 'An error occurred'})
}
});
} else {
this.$store.dispatch('addPinnedComment', this.formData)
.catch(({name, violations}) => {
if (name === 'ValidationException' || name === 'AccessException') {
violations.forEach((violation) => this.$toast.open({message: violation}));
} else {
this.$toast.open({message: 'An error occurred'})
}
});
}
lastRecordedContent = null;
}
lastRecordedContent = null;
}
this.loading = false;
}, 3000);
},
removeComment() {
@ -130,4 +140,12 @@ export default {
div.ck-editor.ck-reset {
margin: 0.6em 0;
}
div.sub-comment {
display: flex;
justify-content: space-between;
div.loading {
margin-right: 6px;
margin-left: 6px;
}
}
</style>