2021-02-18 15:40:54 +00:00
|
|
|
|
2021-03-09 12:27:26 +00:00
|
|
|
import {makeObservable, observable, action, computed} from 'mobx';
|
2021-02-18 15:40:54 +00:00
|
|
|
|
|
|
|
export class storeComments {
|
2021-03-09 12:27:26 +00:00
|
|
|
constructor() {
|
|
|
|
makeObservable(this, {
|
|
|
|
collectionComments: observable,
|
|
|
|
groupCollectionComments: observable,
|
|
|
|
filter: observable,
|
|
|
|
groupCollectionFilter: observable,
|
|
|
|
|
2021-03-10 18:08:59 +00:00
|
|
|
showComments: observable,
|
|
|
|
changeShowComment: action,
|
|
|
|
|
2021-03-09 12:27:26 +00:00
|
|
|
addComment: action,
|
|
|
|
removeComment: action,
|
2021-03-10 18:08:59 +00:00
|
|
|
changeComment: action,
|
2021-03-09 12:27:26 +00:00
|
|
|
changeFilter: action,
|
|
|
|
|
|
|
|
sortComments: computed,
|
|
|
|
|
|
|
|
isOpenEditComment: observable,
|
|
|
|
openEditComment: action,
|
|
|
|
isOpenAddReply: observable,
|
|
|
|
openAddReply: action,
|
|
|
|
isOpenEditReply: observable,
|
|
|
|
openEditReply: action
|
|
|
|
})
|
|
|
|
}
|
|
|
|
collectionComments = [];
|
|
|
|
groupCollectionComments = [];
|
|
|
|
|
|
|
|
filter = undefined;
|
|
|
|
groupCollectionFilter = []; // for sse
|
2021-02-25 16:26:42 +00:00
|
|
|
|
2021-03-10 18:08:59 +00:00
|
|
|
showComments = [];
|
|
|
|
changeShowComment (uid) {
|
|
|
|
this.showComments.length = 0;
|
|
|
|
uid.forEach((item) => {
|
|
|
|
this.showComments.push(this.findComment(item));
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2021-03-09 12:27:26 +00:00
|
|
|
addComment (comment) {
|
2021-02-25 16:26:42 +00:00
|
|
|
comment.groupName ? this.addCommentToGroupCollection(comment) : this.addCommentToCollection(comment);
|
|
|
|
}
|
|
|
|
|
|
|
|
addCommentToCollection (comment) {
|
|
|
|
this.collectionComments.push(comment);
|
|
|
|
}
|
|
|
|
|
|
|
|
addCommentToGroupCollection (comment) {
|
|
|
|
const groupName = comment.groupName;
|
|
|
|
if (!this.groupCollectionComments[groupName]) {
|
|
|
|
this.groupCollectionComments[groupName] = [];
|
|
|
|
}
|
|
|
|
this.groupCollectionComments[groupname].push(comment);
|
|
|
|
if (this.filter.indexOf(groupname) !== -1) {
|
|
|
|
this.groupCollectionFilter.push(comment);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-03-09 12:27:26 +00:00
|
|
|
removeComment (id) {
|
2021-02-25 16:26:42 +00:00
|
|
|
if (this.collectionComments.length > 0) {
|
|
|
|
this.removeCommentFromCollection(id);
|
|
|
|
} else {
|
|
|
|
this.removeCommentFromGroups(id);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
removeCommentFromCollection (id) {
|
|
|
|
const index = this.collectionComments.findIndex((comment) => {
|
|
|
|
return comment.uid === id;
|
|
|
|
});
|
|
|
|
if (index !== -1) {
|
|
|
|
this.collectionComments.splice(index, 1);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
removeCommentFromGroups (id) {
|
|
|
|
for (let name in this.groupCollectionComments) {
|
|
|
|
const store = this.groupCollectionComments[name];
|
|
|
|
const comment = store.find((item) => {
|
|
|
|
return item.uid === id;
|
|
|
|
});
|
|
|
|
const index = store.indexOf(comment);
|
|
|
|
if (index !== -1) {
|
|
|
|
this.groupCollectionComments[name].splice(index, 1);
|
|
|
|
if (this.filter.indexOf(name) !== -1) {
|
|
|
|
this.groupCollectionFilter.splice(this.groupCollectionFilter.indexOf(comment), 1);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-03-10 18:08:59 +00:00
|
|
|
changeComment (id, changeComment) {
|
|
|
|
const comment = this.findComment(id);
|
|
|
|
if (comment) {
|
|
|
|
comment.comment = changeComment.comment;
|
|
|
|
comment.userId = changeComment.userId;
|
|
|
|
comment.userName = changeComment.userName;
|
|
|
|
comment.userColor = changeComment.userColor;
|
|
|
|
comment.resolved = changeComment.resolved;
|
|
|
|
comment.quote = changeComment.quote;
|
|
|
|
comment.time = changeComment.time;
|
|
|
|
comment.date = changeComment.date;
|
|
|
|
comment.editable = changeComment.editable;
|
|
|
|
comment.removable = changeComment.removable;
|
|
|
|
comment.replies = changeComment.replies;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-03-09 12:27:26 +00:00
|
|
|
changeFilter (filter) {
|
2021-02-25 16:26:42 +00:00
|
|
|
let comments = [];
|
|
|
|
this.filter = filter;
|
|
|
|
filter.forEach((item) => {
|
|
|
|
if (!this.groupCollectionComments[item])
|
|
|
|
this.groupCollectionComments[item] = [];
|
|
|
|
comments = comments.concat(this.groupCollectionComments[item]);
|
|
|
|
});
|
|
|
|
this.groupCollectionFilter = comments;
|
|
|
|
}
|
|
|
|
|
|
|
|
findComment (id) {
|
|
|
|
let comment = this.collectionComments.find((item) => {
|
|
|
|
return item.uid === id;
|
|
|
|
});
|
|
|
|
if (!comment) {
|
|
|
|
comment = this.findCommentInGroup(id);
|
|
|
|
}
|
|
|
|
return comment;
|
|
|
|
}
|
|
|
|
|
|
|
|
findCommentInGroup (id) {
|
|
|
|
let model;
|
|
|
|
for (let name in this.groupCollectionComments) {
|
|
|
|
const store = this.groupCollectionComments[name];
|
|
|
|
const id = id.isArray() ? id[0] : id;
|
|
|
|
model = store.find((item) => {
|
|
|
|
return item.uid === id;
|
|
|
|
});
|
|
|
|
if (model) return model;
|
|
|
|
}
|
|
|
|
return model;
|
|
|
|
}
|
|
|
|
|
2021-03-09 12:27:26 +00:00
|
|
|
get sortComments () {
|
2021-02-25 16:26:42 +00:00
|
|
|
const comments = (this.groupCollectionFilter.length !== 0) ? this.groupCollectionFilter : (this.collectionComments.length !== 0 ? this.collectionComments : false);
|
|
|
|
if (comments.length > 0) {
|
|
|
|
return [...comments].sort((a, b) => a.time > b.time ? 1 : -1);
|
|
|
|
}
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
2021-03-03 16:49:36 +00:00
|
|
|
// Edit comment
|
|
|
|
currentComment = null;
|
2021-03-09 12:27:26 +00:00
|
|
|
isOpenEditComment = false;
|
|
|
|
openEditComment (open, comment) {
|
2021-03-03 16:49:36 +00:00
|
|
|
if (open !== this.isOpenEditComment) {
|
|
|
|
this.currentComment = open ? comment : null;
|
|
|
|
this.isOpenEditComment = open;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-03-03 18:21:03 +00:00
|
|
|
currentReply = null;
|
2021-03-09 12:27:26 +00:00
|
|
|
isOpenAddReply = false;
|
|
|
|
openAddReply (open, comment) {
|
2021-03-03 16:49:36 +00:00
|
|
|
if (open !== this.isOpenAddReply) {
|
|
|
|
this.currentComment = open ? comment : null;
|
|
|
|
this.isOpenAddReply = open;
|
|
|
|
}
|
|
|
|
}
|
2021-03-03 18:21:03 +00:00
|
|
|
|
2021-03-09 12:27:26 +00:00
|
|
|
isOpenEditReply = false;
|
|
|
|
openEditReply (open, comment, reply) {
|
2021-03-03 18:21:03 +00:00
|
|
|
if (open !== this.isOpenEditReply) {
|
|
|
|
this.currentComment = open ? comment : null;
|
|
|
|
this.currentReply = open ? reply : null;
|
|
|
|
this.isOpenEditReply = open;
|
|
|
|
}
|
|
|
|
}
|
2021-02-18 15:40:54 +00:00
|
|
|
}
|