Showing
9 changed files
with
195 additions
and
59 deletions
1 | <template> | 1 | <template> |
2 | <div class="comment-item"> | 2 | <div class="comment-item"> |
3 | - <ImageFormat :lazy="false" :src="parentComment.headIco" :width="80" :height="80" class="comment-user-avatar" @click.native="toUserPage"></ImageFormat> | 3 | + <ImageFormat :lazy="false" :src="parentComment.headIco" :width="80" :height="80" class="comment-user-avatar" |
4 | + @click.native="toUserPage"></ImageFormat> | ||
4 | <div class="comment"> | 5 | <div class="comment"> |
5 | <div class="comment-nav"> | 6 | <div class="comment-nav"> |
6 | <div class="comment-nav-left"> | 7 | <div class="comment-nav-left"> |
@@ -29,7 +30,11 @@ | @@ -29,7 +30,11 @@ | ||
29 | :user="parentComment.userName" | 30 | :user="parentComment.userName" |
30 | :column-type="columnType" | 31 | :column-type="columnType" |
31 | :share="share" | 32 | :share="share" |
32 | - @on-comment="onReply"> | 33 | + :authorUid="authorUid" |
34 | + :commentUid="parentComment.uid" | ||
35 | + @on-comment="onReply" | ||
36 | + @remove-comment="onRemoveComment" | ||
37 | + > | ||
33 | {{parentComment.content}} | 38 | {{parentComment.content}} |
34 | </CommentPlaceholderActionSheet> | 39 | </CommentPlaceholderActionSheet> |
35 | <div class="reply-main" v-if="replayShowList.length"> | 40 | <div class="reply-main" v-if="replayShowList.length"> |
@@ -44,7 +49,11 @@ | @@ -44,7 +49,11 @@ | ||
44 | :user="reply.userName" | 49 | :user="reply.userName" |
45 | :column-type="columnType" | 50 | :column-type="columnType" |
46 | :share="share" | 51 | :share="share" |
47 | - @on-comment="onReplyChildren"> | 52 | + :authorUid="authorUid" |
53 | + :commentUid="reply.uid" | ||
54 | + @on-comment="onReplyChildren" | ||
55 | + @remove-comment="onRemoveComment" | ||
56 | + > | ||
48 | <span class="reply-user">{{reply.userName}}</span> | 57 | <span class="reply-user">{{reply.userName}}</span> |
49 | <template v-if="reply.parentUserName"> | 58 | <template v-if="reply.parentUserName"> |
50 | <span>回复</span><em class="reply-to-user">@{{reply.parentUserName}}</em> | 59 | <span>回复</span><em class="reply-to-user">@{{reply.parentUserName}}</em> |
@@ -61,9 +70,10 @@ | @@ -61,9 +70,10 @@ | ||
61 | </template> | 70 | </template> |
62 | 71 | ||
63 | <script> | 72 | <script> |
64 | -import {createNamespacedHelpers} from 'vuex'; | 73 | +import { createNamespacedHelpers } from 'vuex'; |
65 | import CommentPlaceholderActionSheet from './comment-placeholder-actionsheet'; | 74 | import CommentPlaceholderActionSheet from './comment-placeholder-actionsheet'; |
66 | -const {mapActions} = createNamespacedHelpers('comment'); | 75 | + |
76 | +const { mapActions } = createNamespacedHelpers('comment'); | ||
67 | 77 | ||
68 | export default { | 78 | export default { |
69 | name: 'CommentItem', | 79 | name: 'CommentItem', |
@@ -77,7 +87,8 @@ export default { | @@ -77,7 +87,8 @@ export default { | ||
77 | }, | 87 | }, |
78 | share: Boolean, | 88 | share: Boolean, |
79 | posId: Number, | 89 | posId: Number, |
80 | - articleId: Number | 90 | + articleId: Number, |
91 | + authorUid: Number | ||
81 | }, | 92 | }, |
82 | data() { | 93 | data() { |
83 | return { | 94 | return { |
@@ -140,6 +151,9 @@ export default { | @@ -140,6 +151,9 @@ export default { | ||
140 | }); | 151 | }); |
141 | }, 300); | 152 | }, 300); |
142 | }, | 153 | }, |
154 | + onRemoveComment({ commentId }) { | ||
155 | + this.$emit('remove-comment', { commentId }); | ||
156 | + } | ||
143 | } | 157 | } |
144 | }; | 158 | }; |
145 | </script> | 159 | </script> |
@@ -5,14 +5,16 @@ | @@ -5,14 +5,16 @@ | ||
5 | <div class="loading" v-if="firstLoading"> | 5 | <div class="loading" v-if="firstLoading"> |
6 | <Loading></Loading> | 6 | <Loading></Loading> |
7 | </div> | 7 | </div> |
8 | - <Scroll v-else ref="scroll" :data="commentList" :scroll-events="['scroll', 'scroll-end']" :options="scrollOption" @scroll="onScrollHandle" @scroll-end="onScrollEndHandle" @pulling-up="onPullingUp"> | 8 | + <Scroll v-else ref="scroll" :data="commentList" :scroll-events="['scroll', 'scroll-end']" |
9 | + :options="scrollOption" @scroll="onScrollHandle" @scroll-end="onScrollEndHandle" | ||
10 | + @pulling-up="onPullingUp"> | ||
9 | <CommentEmpty v-if="empty"></CommentEmpty> | 11 | <CommentEmpty v-if="empty"></CommentEmpty> |
10 | <div v-else ref="commentList" class="comment-list"> | 12 | <div v-else ref="commentList" class="comment-list"> |
11 | <div ref="commentListTop" class="comment-list-top"> | 13 | <div ref="commentListTop" class="comment-list-top"> |
12 | <div ref="commentPre" class="comment-pre-list"> | 14 | <div ref="commentPre" class="comment-pre-list"> |
13 | <div | 15 | <div |
14 | - v-for="(comments, index) in commentPreList" | ||
15 | - :key="commentPreList.length - index"> | 16 | + v-for="(comments, index) in commentPreList" |
17 | + :key="commentPreList.length - index"> | ||
16 | <CommentItem | 18 | <CommentItem |
17 | v-for="comment in comments" | 19 | v-for="comment in comments" |
18 | :key="comment.parentComment.id" | 20 | :key="comment.parentComment.id" |
@@ -21,8 +23,12 @@ | @@ -21,8 +23,12 @@ | ||
21 | :column-type="columnType" | 23 | :column-type="columnType" |
22 | :pos-id="posId" | 24 | :pos-id="posId" |
23 | :article-id="articleId" | 25 | :article-id="articleId" |
26 | + :authorUid="authorUid" | ||
27 | + :commentUid="comment.parentComment.uid" | ||
24 | @on-reply="onReply" | 28 | @on-reply="onReply" |
25 | - @on-close="onClose"> | 29 | + @on-close="onClose" |
30 | + @remove-comment="onRemoveComment" | ||
31 | + > | ||
26 | </CommentItem> | 32 | </CommentItem> |
27 | </div> | 33 | </div> |
28 | </div> | 34 | </div> |
@@ -36,34 +42,41 @@ | @@ -36,34 +42,41 @@ | ||
36 | :column-type="columnType" | 42 | :column-type="columnType" |
37 | :pos-id="posId" | 43 | :pos-id="posId" |
38 | :article-id="articleId" | 44 | :article-id="articleId" |
45 | + :authorUid="authorUid" | ||
46 | + :commentUid="comment.parentComment.uid" | ||
39 | @on-reply="onReply" | 47 | @on-reply="onReply" |
40 | - @on-close="onClose"> | 48 | + @on-close="onClose" |
49 | + @remove-comment="onRemoveComment" | ||
50 | + > | ||
41 | </CommentItem> | 51 | </CommentItem> |
42 | </div> | 52 | </div> |
43 | </Scroll> | 53 | </Scroll> |
44 | </div> | 54 | </div> |
45 | </div> | 55 | </div> |
46 | <div class="comment-footer" v-if="!firstLoading"> | 56 | <div class="comment-footer" v-if="!firstLoading"> |
47 | - <CommentPlaceholder | 57 | + <CommentPlaceholderActionSheet |
48 | class="comment-input" | 58 | class="comment-input" |
49 | :dest-id="destId" | 59 | :dest-id="destId" |
50 | :pos-id="posId" | 60 | :pos-id="posId" |
51 | :article-id="articleId" | 61 | :article-id="articleId" |
52 | :add-type="0" | 62 | :add-type="0" |
53 | :column-type="columnType" | 63 | :column-type="columnType" |
64 | + :authorUid="authorUid" | ||
54 | @on-comment="onComment"> | 65 | @on-comment="onComment"> |
55 | 参与评论 | 66 | 参与评论 |
56 | - </CommentPlaceholder> | 67 | + </CommentPlaceholderActionSheet> |
57 | </div> | 68 | </div> |
58 | </div> | 69 | </div> |
59 | </template> | 70 | </template> |
60 | 71 | ||
61 | <script> | 72 | <script> |
62 | import CommentItem from './comment-item.vue'; | 73 | import CommentItem from './comment-item.vue'; |
63 | -import {Scroll, Loading} from 'cube-ui'; | ||
64 | -import {get, throttle} from 'lodash'; | ||
65 | -import {createNamespacedHelpers} from 'vuex'; | ||
66 | -const {mapActions} = createNamespacedHelpers('comment'); | 74 | +import { Scroll, Loading } from 'cube-ui'; |
75 | +import { get, throttle, findIndex } from 'lodash'; | ||
76 | +import { createNamespacedHelpers } from 'vuex'; | ||
77 | +import CommentPlaceholderActionSheet from './comment-placeholder-actionsheet'; | ||
78 | + | ||
79 | +const { mapActions } = createNamespacedHelpers('comment'); | ||
67 | 80 | ||
68 | export default { | 81 | export default { |
69 | name: 'CommentList', | 82 | name: 'CommentList', |
@@ -75,7 +88,7 @@ export default { | @@ -75,7 +88,7 @@ export default { | ||
75 | }, | 88 | }, |
76 | posId: Number, | 89 | posId: Number, |
77 | articleId: Number, | 90 | articleId: Number, |
78 | - commentId: Number | 91 | + authorUid: Number |
79 | }, | 92 | }, |
80 | data() { | 93 | data() { |
81 | return { | 94 | return { |
@@ -113,7 +126,7 @@ export default { | @@ -113,7 +126,7 @@ export default { | ||
113 | }; | 126 | }; |
114 | 127 | ||
115 | if (params.page < 1 || params.page > this.totalPage) { | 128 | if (params.page < 1 || params.page > this.totalPage) { |
116 | - return {code: 200}; | 129 | + return { code: 200 }; |
117 | } | 130 | } |
118 | 131 | ||
119 | if (this.commentId && (this.prePage === this.page)) { | 132 | if (this.commentId && (this.prePage === this.page)) { |
@@ -208,7 +221,7 @@ export default { | @@ -208,7 +221,7 @@ export default { | ||
208 | type: 'warn', | 221 | type: 'warn', |
209 | time: 1000 | 222 | time: 1000 |
210 | }).show(); | 223 | }).show(); |
211 | - this.$emit('on-page-ready', {success: false}); | 224 | + this.$emit('on-page-ready', { success: false }); |
212 | } | 225 | } |
213 | return result; | 226 | return result; |
214 | }, | 227 | }, |
@@ -249,7 +262,7 @@ export default { | @@ -249,7 +262,7 @@ export default { | ||
249 | this.totalPage = 1; | 262 | this.totalPage = 1; |
250 | this.$refs.scroll.scrollTo(0, 0, 200); | 263 | this.$refs.scroll.scrollTo(0, 0, 200); |
251 | this.fetchComments(); | 264 | this.fetchComments(); |
252 | - this.$emit('on-comment', {destId: this.destId}); | 265 | + this.$emit('on-comment', { destId: this.destId }); |
253 | }, | 266 | }, |
254 | async init() { | 267 | async init() { |
255 | this.page = 1; | 268 | this.page = 1; |
@@ -259,7 +272,7 @@ export default { | @@ -259,7 +272,7 @@ export default { | ||
259 | this.firstLoading = true; | 272 | this.firstLoading = true; |
260 | this.fetchComments(); | 273 | this.fetchComments(); |
261 | }, | 274 | }, |
262 | - async onReply({destId, parentId}) { | 275 | + async onReply({ destId, parentId }) { |
263 | const commentId = parentId || destId; | 276 | const commentId = parentId || destId; |
264 | 277 | ||
265 | if (!commentId) { | 278 | if (!commentId) { |
@@ -286,9 +299,40 @@ export default { | @@ -286,9 +299,40 @@ export default { | ||
286 | }, | 299 | }, |
287 | onClose() { | 300 | onClose() { |
288 | this.$emit('on-close'); | 301 | this.$emit('on-close'); |
289 | - } | 302 | + }, |
303 | + onRemoveComment({ commentId }) { | ||
304 | + for (let comments of this.commentPreList) { | ||
305 | + for (let [index, comment] of Object.entries(comments)) { | ||
306 | + if (comment.parentComment && +comment.parentComment.id === +commentId) { | ||
307 | + comments.splice(index, 1); | ||
308 | + break; | ||
309 | + } | ||
310 | + | ||
311 | + const childrenIndex = findIndex(comment.childrenComments, { id: +commentId }); | ||
312 | + | ||
313 | + if ((+index !== -1) && (childrenIndex !== -1)) { | ||
314 | + comments[index].childrenComments.splice(childrenIndex, 1); | ||
315 | + break; | ||
316 | + } | ||
317 | + } | ||
318 | + } | ||
319 | + | ||
320 | + for (let [index, comment] of Object.entries(this.commentList)) { | ||
321 | + if (comment.parentComment && +comment.parentComment.id === +commentId) { | ||
322 | + this.commentList.splice(index, 1); | ||
323 | + break; | ||
324 | + } | ||
325 | + | ||
326 | + const childrenIndex = findIndex(comment.childrenComments, { id: +commentId }); | ||
327 | + | ||
328 | + if ((+index !== -1) && childrenIndex !== -1) { | ||
329 | + this.commentList[index].childrenComments.splice(childrenIndex, 1); | ||
330 | + break; | ||
331 | + } | ||
332 | + } | ||
333 | + }, | ||
290 | }, | 334 | }, |
291 | - components: {Scroll, CommentItem, Loading} | 335 | + components: { CommentPlaceholderActionSheet, Scroll, CommentItem, Loading } |
292 | }; | 336 | }; |
293 | </script> | 337 | </script> |
294 | 338 |
@@ -11,9 +11,16 @@ | @@ -11,9 +11,16 @@ | ||
11 | 11 | ||
12 | import { createNamespacedHelpers } from 'vuex'; | 12 | import { createNamespacedHelpers } from 'vuex'; |
13 | import CommentPlaceholder from './comment-placeholder'; | 13 | import CommentPlaceholder from './comment-placeholder'; |
14 | +import { get } from 'lodash'; | ||
14 | 15 | ||
15 | const { mapActions } = createNamespacedHelpers('comment'); | 16 | const { mapActions } = createNamespacedHelpers('comment'); |
16 | 17 | ||
18 | +const ITEM = { | ||
19 | + comment: '回复', | ||
20 | + remove: '删除', | ||
21 | + report: '举报' | ||
22 | +}; | ||
23 | + | ||
17 | export default { | 24 | export default { |
18 | name: 'CommentPlaceholderActionSheet', | 25 | name: 'CommentPlaceholderActionSheet', |
19 | components: { CommentPlaceholder }, | 26 | components: { CommentPlaceholder }, |
@@ -22,33 +29,80 @@ export default { | @@ -22,33 +29,80 @@ export default { | ||
22 | }, | 29 | }, |
23 | methods: { | 30 | methods: { |
24 | ...mapActions(['setCommentStatus']), | 31 | ...mapActions(['setCommentStatus']), |
25 | - onClick() { | ||
26 | - this.$createActionSheet({ | ||
27 | - data: [ | 32 | + async onClick() { |
33 | + const authorUid = this.$attrs.authorUid; | ||
34 | + const commentUid = this.$attrs.commentUid; | ||
35 | + const uid = get(await this.$sdk.getUser(), 'uid', 0); | ||
36 | + const commentId = this.$attrs['dest-id']; | ||
37 | + let menu = []; | ||
38 | + | ||
39 | + if (authorUid === uid || commentUid === uid) { | ||
40 | + menu = [ | ||
41 | + { | ||
42 | + content: ITEM.comment | ||
43 | + }, | ||
28 | { | 44 | { |
29 | - content: '回复' | 45 | + content: ITEM.remove |
30 | }, | 46 | }, |
31 | { | 47 | { |
32 | - content: '删除' | 48 | + content: ITEM.report |
49 | + } | ||
50 | + ]; | ||
51 | + } else { | ||
52 | + menu = [ | ||
53 | + { | ||
54 | + content: ITEM.comment | ||
33 | }, | 55 | }, |
34 | { | 56 | { |
35 | - content: '举报' | 57 | + content: ITEM.report |
36 | } | 58 | } |
37 | - ], | ||
38 | - cancelTxt: '', | ||
39 | - onSelect: (item, index) => { | ||
40 | - console.log(this.$attrs); | ||
41 | - switch (index) { | ||
42 | - case 0: { | 59 | + ]; |
60 | + } | ||
61 | + | ||
62 | + this.$createActionSheet({ | ||
63 | + data: menu, | ||
64 | + zIndex: 200, | ||
65 | + onSelect: (item) => { | ||
66 | + switch (item.content) { | ||
67 | + case ITEM.comment: { | ||
43 | this.$refs.placeholder.openComentInput(); | 68 | this.$refs.placeholder.openComentInput(); |
44 | break; | 69 | break; |
45 | } | 70 | } |
46 | - case 1: { | ||
47 | - this.setCommentStatus({ type: 1, commentId: this.$attrs['dest-id'] }); | 71 | + case ITEM.remove: { |
72 | + this.setCommentStatus({ type: 1, commentId }).then(result => { | ||
73 | + if (result.code === 200) { | ||
74 | + this.$createToast({ | ||
75 | + txt: '已删除', | ||
76 | + type: 'correct', | ||
77 | + time: 2000, | ||
78 | + }).show(); | ||
79 | + this.$emit('remove-comment', { commentId }); | ||
80 | + } else { | ||
81 | + this.$createToast({ | ||
82 | + txt: '删除失败,请重试', | ||
83 | + type: 'warn', | ||
84 | + time: 2000, | ||
85 | + }).show(); | ||
86 | + } | ||
87 | + }); | ||
48 | break; | 88 | break; |
49 | } | 89 | } |
50 | - case 2: { | ||
51 | - this.setCommentStatus({ type: 2, commentId: this.$attrs['dest-id'] }); | 90 | + case ITEM.report: { |
91 | + this.setCommentStatus({ type: 2, commentId }).then(result => { | ||
92 | + if (result.code === 200) { | ||
93 | + this.$createToast({ | ||
94 | + txt: '已举报', | ||
95 | + type: 'correct', | ||
96 | + time: 2000, | ||
97 | + }).show(); | ||
98 | + } else { | ||
99 | + this.$createToast({ | ||
100 | + txt: '举报失败,请重试', | ||
101 | + type: 'warn', | ||
102 | + time: 2000, | ||
103 | + }).show(); | ||
104 | + } | ||
105 | + }); | ||
52 | break; | 106 | break; |
53 | } | 107 | } |
54 | } | 108 | } |
@@ -6,7 +6,7 @@ | @@ -6,7 +6,7 @@ | ||
6 | <i class="iconfont icon-close icon" @touchend.prevent="onClose"></i> | 6 | <i class="iconfont icon-close icon" @touchend.prevent="onClose"></i> |
7 | </template> | 7 | </template> |
8 | </LayoutHeader> | 8 | </LayoutHeader> |
9 | - <CommentList ref="commentList" :dest-id="destId" :pos-id="posId" :article-id="articleId" :comment-id="commentId" :column-type="1001" @on-page-change="onPageChange" @on-comment="onComment" @on-page-ready="onPageReady" @on-close="onClose"></CommentList> | 9 | + <CommentList ref="commentList" :dest-id="destId" :pos-id="posId" :article-id="articleId" :comment-id="commentId" :column-type="1001" @on-page-change="onPageChange" @on-comment="onComment" @on-page-ready="onPageReady" @on-close="onClose" :authorUid="authorUid"></CommentList> |
10 | </Layout> | 10 | </Layout> |
11 | </template> | 11 | </template> |
12 | 12 | ||
@@ -24,7 +24,8 @@ export default { | @@ -24,7 +24,8 @@ export default { | ||
24 | posId: Number, | 24 | posId: Number, |
25 | articleId: Number, | 25 | articleId: Number, |
26 | commentId: Number, | 26 | commentId: Number, |
27 | - commentCount: Number | 27 | + commentCount: Number, |
28 | + authorUid: Number | ||
28 | }, | 29 | }, |
29 | data() { | 30 | data() { |
30 | return { | 31 | return { |
@@ -31,6 +31,7 @@ | @@ -31,6 +31,7 @@ | ||
31 | :commentCount="articleState.commentCount" | 31 | :commentCount="articleState.commentCount" |
32 | :share="share" | 32 | :share="share" |
33 | :pos-id="posId" | 33 | :pos-id="posId" |
34 | + :authorUid="data.authorUid" | ||
34 | @on-close="onCloseComment" | 35 | @on-close="onCloseComment" |
35 | @on-comment="onActionComment"></Comment> | 36 | @on-comment="onActionComment"></Comment> |
36 | </YohoActionSheet> | 37 | </YohoActionSheet> |
@@ -22,7 +22,7 @@ | @@ -22,7 +22,7 @@ | ||
22 | <i class="iconfont icon-more1" @click="onMore"></i> | 22 | <i class="iconfont icon-more1" @click="onMore"></i> |
23 | </div> | 23 | </div> |
24 | </div> | 24 | </div> |
25 | - <ArticleDetailCommentList ref="commentList" v-if="data.articleId" :article-id="data.articleId" :share="share" :comment-count="articleState.commentCount" :has-comment="data.hasComment"></ArticleDetailCommentList> | 25 | + <ArticleDetailCommentList ref="commentList" v-if="data.articleId" :article-id="data.articleId" :share="share" :comment-count="articleState.commentCount" :has-comment="data.hasComment" :authorUid="data.authorUid"></ArticleDetailCommentList> |
26 | </div> | 26 | </div> |
27 | 27 | ||
28 | <div v-if="listTitle" class="rec-article-title"> | 28 | <div v-if="listTitle" class="rec-article-title"> |
@@ -14,6 +14,9 @@ | @@ -14,6 +14,9 @@ | ||
14 | :share="share" | 14 | :share="share" |
15 | :pos-id="0" | 15 | :pos-id="0" |
16 | :article-id="articleId" | 16 | :article-id="articleId" |
17 | + :authorUid="authorUid" | ||
18 | + :commentUid="comment.parentComment.uid" | ||
19 | + @remove-comment="onRemoveComment" | ||
17 | @on-reply="onReply"> | 20 | @on-reply="onReply"> |
18 | </CommentItem> | 21 | </CommentItem> |
19 | </div> | 22 | </div> |
@@ -30,11 +33,11 @@ | @@ -30,11 +33,11 @@ | ||
30 | </template> | 33 | </template> |
31 | 34 | ||
32 | <script> | 35 | <script> |
33 | -import {get, forEach, find} from 'lodash'; | ||
34 | -import {Loading} from 'cube-ui'; | ||
35 | -import {mapState as mapYohoState, mapActions as mapYohoActions, createNamespacedHelpers} from 'vuex'; | 36 | +import { get, forEach, find, findIndex } from 'lodash'; |
37 | +import { Loading } from 'cube-ui'; | ||
38 | +import { mapState as mapYohoState, mapActions as mapYohoActions, createNamespacedHelpers } from 'vuex'; | ||
36 | 39 | ||
37 | -const {mapActions} = createNamespacedHelpers('comment'); | 40 | +const { mapActions } = createNamespacedHelpers('comment'); |
38 | 41 | ||
39 | export default { | 42 | export default { |
40 | name: 'ArticleDetailCommentList', | 43 | name: 'ArticleDetailCommentList', |
@@ -46,7 +49,8 @@ export default { | @@ -46,7 +49,8 @@ export default { | ||
46 | default: 1001 | 49 | default: 1001 |
47 | }, | 50 | }, |
48 | share: Boolean, | 51 | share: Boolean, |
49 | - hasComment: Boolean | 52 | + hasComment: Boolean, |
53 | + authorUid: Number | ||
50 | }, | 54 | }, |
51 | data() { | 55 | data() { |
52 | return { | 56 | return { |
@@ -128,7 +132,7 @@ export default { | @@ -128,7 +132,7 @@ export default { | ||
128 | this.onFetching = false; | 132 | this.onFetching = false; |
129 | }, this.page > 1 ? 800 : 0); | 133 | }, this.page > 1 ? 800 : 0); |
130 | }, | 134 | }, |
131 | - onReply({comment}) { | 135 | + onReply({ comment }) { |
132 | forEach(this.commentList, (val) => { | 136 | forEach(this.commentList, (val) => { |
133 | if (val.parentComment && +val.parentComment.id === +comment.parentId) { | 137 | if (val.parentComment && +val.parentComment.id === +comment.parentId) { |
134 | val.childrenComments.unshift(Object.assign(comment, { | 138 | val.childrenComments.unshift(Object.assign(comment, { |
@@ -136,21 +140,37 @@ export default { | @@ -136,21 +140,37 @@ export default { | ||
136 | destId: this.articleId, | 140 | destId: this.articleId, |
137 | headIco: this.yoho.context.userHeadIco, | 141 | headIco: this.yoho.context.userHeadIco, |
138 | userName: this.yoho.context.userName, | 142 | userName: this.yoho.context.userName, |
139 | - parentUserName: get(find(val.childrenComments, {id: comment.parentId}), 'userName', '') | 143 | + parentUserName: get(find(val.childrenComments, { id: comment.parentId }), 'userName', '') |
140 | })); | 144 | })); |
141 | } | 145 | } |
142 | }); | 146 | }); |
143 | }, | 147 | }, |
144 | - addComment(comment) { | 148 | + async addComment(comment) { |
145 | this.commentList.unshift({ | 149 | this.commentList.unshift({ |
146 | childrenComments: [], | 150 | childrenComments: [], |
147 | parentComment: Object.assign(comment, { | 151 | parentComment: Object.assign(comment, { |
148 | id: comment.destId, | 152 | id: comment.destId, |
149 | destId: this.articleId, | 153 | destId: this.articleId, |
150 | headIco: this.yoho.context.userHeadIco, | 154 | headIco: this.yoho.context.userHeadIco, |
151 | - userName: this.yoho.context.userName | 155 | + userName: this.yoho.context.userName, |
156 | + uid: (await this.$sdk.getUser()).uid | ||
152 | }) | 157 | }) |
153 | }); | 158 | }); |
159 | + }, | ||
160 | + onRemoveComment({ commentId }) { | ||
161 | + for (let [index, val] of Object.entries(this.commentList)) { | ||
162 | + if (val.parentComment && +val.parentComment.id === +commentId) { | ||
163 | + this.commentList.splice(index, 1); | ||
164 | + break; | ||
165 | + } | ||
166 | + | ||
167 | + const childrenIndex = findIndex(val.childrenComments, {id: +commentId}); | ||
168 | + | ||
169 | + if ((+index !== -1) && (childrenIndex !== -1)) { | ||
170 | + this.commentList[index].childrenComments.splice(childrenIndex, 1); | ||
171 | + break; | ||
172 | + } | ||
173 | + } | ||
154 | } | 174 | } |
155 | }, | 175 | }, |
156 | components: { | 176 | components: { |
@@ -186,11 +206,12 @@ export default { | @@ -186,11 +206,12 @@ export default { | ||
186 | align-items: center; | 206 | align-items: center; |
187 | justify-content: center; | 207 | justify-content: center; |
188 | 208 | ||
189 | - .loading-wrap { | ||
190 | - display: flex; | ||
191 | - align-items: center; | ||
192 | - justify-content: center; | ||
193 | - color: #999; | ||
194 | - } | 209 | +.loading-wrap { |
210 | + display: flex; | ||
211 | + align-items: center; | ||
212 | + justify-content: center; | ||
213 | + color: #999; | ||
214 | +} | ||
215 | + | ||
195 | } | 216 | } |
196 | </style> | 217 | </style> |
@@ -290,6 +290,7 @@ module.exports = { | @@ -290,6 +290,7 @@ module.exports = { | ||
290 | }, | 290 | }, |
291 | '/api/grass/deleteComment': { | 291 | '/api/grass/deleteComment': { |
292 | api: 'app.grass.delArticleComment', | 292 | api: 'app.grass.delArticleComment', |
293 | + auth: true, | ||
293 | params: { | 294 | params: { |
294 | commentId: {type: Number} | 295 | commentId: {type: Number} |
295 | } | 296 | } |
1 | { | 1 | { |
2 | "name": "yoho-community-web", | 2 | "name": "yoho-community-web", |
3 | - "version": "6.9.10-beta9", | 3 | + "version": "6.9.10-beta10", |
4 | "private": true, | 4 | "private": true, |
5 | "description": "A New Yohobuy Project With Express", | 5 | "description": "A New Yohobuy Project With Express", |
6 | "repository": { | 6 | "repository": { |
-
Please register or login to post a comment