Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

fix autosave of comment

Browse Source
This commit is contained in:
Julien Fastré 2022-03-14 13:04:29 +01:00
parent fc1fe7c277
commit bd79391efc
3 changed files with 131 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/Bundle/ChillMainBundle/Resources/public/lib/api/apiMethods.js
View File

@ -1,17 +1,22 @@
/**
* Generic api method that can be adapted to any fetch request
*/
const makeFetch = (method, url, body) => {
return fetch(url, {
const makeFetch = (method, url, body, options) => {
let opts = {
method: method,
headers: {
'Content-Type': 'application/json;charset=utf-8'
},
body: (body !== null) ? JSON.stringify(body) : null
})
};
if (typeof options !== 'undefined') {
opts = Object.assign(opts, options);
}
return fetch(url, opts)
.then(response => {
if (response.ok) {
console.log('200 error')
return response.json();
}

85
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Comment.vue
View File

@ -17,12 +17,11 @@
:placeholder="$t('comment.content')"
:editor="editor"
v-model="content"
@input="onContentChange"
tag-name="textarea">
</ckeditor>
<div class="sub-comment">
<div v-if="pinnedComment" class="metadata">
<div v-if="pinnedComment !== null && typeof pinnedComment.creator !== 'undefined'" class="metadata">
{{ $t('comment.created_by', [
pinnedComment.creator.text,
$d(pinnedComment.updatedAt.datetime, 'long')
@ -64,11 +63,8 @@ export default {
data() {
return {
editor: ClassicEditor,
formData: {
type: "accompanying_period_comment",
content: ''
},
loading: false
loading: false,
lastRecordedContent: null,
}
},
computed: {
@ -77,10 +73,48 @@ export default {
}),
content: {
set(value) {
this.formData.content = value;
console.log('new comment value', value);
console.log('previous value', this.lastRecordedContent);
this.lastRecordedContent = value;
setTimeout(() => {
console.log('performing test on ', value);
if (this.lastRecordedContent === value) {
this.loading = true;
if (value !== '') {
this.$store.dispatch('updatePinnedComment', value)
.then(() => {
this.loading = false;
})
.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 {
if (this.$store.state.accompanyingCourse.pinnedComment !== null) {
this.$store.dispatch('removePinnedComment', {id: this.pinnedComment.id})
.then(() => {
this.loading = false;
this.lastRecoredContent = null;
})
.catch(({name, violations}) => {
if (name === 'ValidationException' || name === 'AccessException') {
violations.forEach((violation) => this.$toast.open({message: violation}));
} else {
this.$toast.open({message: 'An error occurred'})
}
});
}
}
}
}, 3000);
},
get() {
return this.pinnedComment ? this.pinnedComment.content : '';
get() {
return this.pinnedComment ? this.pinnedComment.content : '';
}
},
errors() {
@ -89,38 +123,7 @@ export default {
},
methods: {
onContentChange() {
this.loading = true;
let lastRecordedContent = this.formData.content;
setTimeout(() => {
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'})
}
});
}
lastRecordedContent = null;
}
}
this.loading = false;
}, 3000);
},
removeComment() {
this.$store.dispatch('removePinnedComment', {id: this.pinnedComment.id})

91
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/store/index.js
View File

@ -42,7 +42,11 @@ let initPromise = (root) => Promise.all([getScopesPromise(root), accompanyingCou
referrersSuggested: [],
// all the users available
users: [],
permissions: {}
permissions: {},
// controller for updating comment
updateCommentAbortController: null,
// waiting response for inserting first comment
postFirstPinnedCommentResponse: null,
},
getters: {
isParticipationValid(state) {
@ -203,12 +207,36 @@ let initPromise = (root) => Promise.all([getScopesPromise(root), accompanyingCou
//console.log('### mutation: toggleConfidential');
state.accompanyingCourse.confidential = value;
},
addPinnedComment(state, value) {
state.accompanyingCourse.pinnedComment = value;
setPinnedComment(state, content) {
if (null === state.accompanyingCourse.pinnedComment) {
state.accompanyingCourse.pinnedComment = {
id: -1,
content,
type: "accompanying_period_comment",
};
} else {
state.accompanyingCourse.pinnedComment.content = content;
}
},
setPinnedCommentDetails(state, value) {
state.accompanyingCourse.pinnedComment.id = value.id;
if (typeof value.creator !== 'undefined') {
state.accompanyingCourse.pinnedComment.creator = value.creator;
state.accompanyingCourse.pinnedComment.updatedBy = value.updatedBy;
state.accompanyingCourse.pinnedComment.updatedAt = value.updatedAt;
state.accompanyingCourse.pinnedComment.createdAt = value.createdAt;
}
},
removePinnedComment(state, value) {
state.accompanyingCourse.pinnedComment = null;
},
setPinCommentAbortController(state, value) {
state.updateCommentAbortController = value;
},
setPostFirstPinnedCommentResponse(state, value) {
state.postFirstPinnedCommentResponse = value;
},
updateSocialIssues(state, value) {
console.log('updateSocialIssues', value);
state.accompanyingCourse.socialIssues = value;
@ -355,28 +383,68 @@ let initPromise = (root) => Promise.all([getScopesPromise(root), accompanyingCou
throw error;
})
},
addPinnedComment({ commit, dispatch }, payload) {
const body = payload ? { type: payload.type, content: payload.content } : {};
/**
* internal method to insert a new comment
*
* @param commit
* @param dispatch
* @param content
* @returns {*}
*/
addPinnedComment({ commit, dispatch }, content) {
const url = `/api/1.0/person/accompanying-course/${id}/comment.json`;
return makeFetch('POST', url, body)
return makeFetch('POST', url, {type: "accompanying_period_comment", content})
.then((response) => {
dispatch('patchFirstComment', response);
commit('setPinnedCommentDetails', response);
return dispatch('patchFirstComment', response);
})
.catch((error) => {
commit('catchError', error);
throw error;
})
},
updatePinnedComment({ commit }, payload) {
updatePinnedComment({ commit, state, dispatch }, content) {
commit('setPinnedComment', content);
if (state.accompanyingCourse.pinnedComment.id === -1 && state.postFirstPinnedCommentResponse === null) {
let r = dispatch('addPinnedComment', content).then(() => {
commit('setPostFirstPinnedCommentResponse', null);
});
commit('setPostFirstPinnedCommentResponse', r);
} else {
(state.postFirstPinnedCommentResponse === null ? Promise.resolve() : state.postFirstPinnedCommentResponse).then(() => {
dispatch('updateExistingPinnedComment', content);
});
}
},
/**
* internal method to patch an existing comment
*
* @param commit
* @param state
* @param comment
* @returns {*}
*/
updateExistingPinnedComment({ commit, state }, content) {
const payload = {type: "accompanying_period_comment", content, id: state.accompanyingCourse.pinnedComment.id};
const url = `/api/1.0/person/accompanying-period/comment/${payload.id}.json`;
return makeFetch('PATCH', url, payload)
if (state.updateCommentAbortController !== null) {
state.updateCommentAbortController.abort();
commit('setPinCommentAbortController', null);
}
let controller = new AbortController();
commit('setPinCommentAbortController', controller);
return makeFetch('PATCH', url, payload, { signal: controller.signal })
.then((response) => {
commit('addPinnedComment', response);
commit('setPinCommentAbortController', null);
commit('setPinnedCommentDetails', response);
})
.catch((error) => {
commit('catchError', error);
commit('setPinCommentAbortController', null);
throw error;
})
},
@ -659,9 +727,6 @@ let initPromise = (root) => Promise.all([getScopesPromise(root), accompanyingCou
}
};
return makeFetch('PATCH', url, body)
.then((response) => {
commit('addPinnedComment', response.pinnedComment);
})
.catch((error) => {
commit('catchError', error);
throw error;