| | |
| | | <template> |
| | | <div> |
| | | <replyBox ref="commentBoxId" v-bind="$attrs" @sendMsg="sendMsg()"></replyBox> |
| | | <a-collapse v-if="foldReply"> |
| | | <a-collapse-panel key="replyPanel" header="回复"> |
| | | <replyBox ref="commentBoxId" v-bind="$attrs" @sendMsg="sendMsg()"></replyBox> |
| | | </a-collapse-panel> |
| | | </a-collapse> |
| | | <div v-else> |
| | | <replyBox ref="commentBoxId" v-bind="$attrs" @sendMsg="sendMsg()"></replyBox> |
| | | </div> |
| | | |
| | | <a-modal v-model="visible" :title="replyTaget" :footer="null" |
| | | :bodyStyle="{'overflow':'overlay','maxHeight': '550px','scrollbarWidth': 'none'}"> |
| | | <replyBox ref="replyBoxId" v-bind="$attrs" @sendMsg="sendMsg()"></replyBox> |
| | | </a-modal> |
| | | |
| | | <div class="mySecret" style="max-height:350px ;" v-if="commentListData.length==0"> |
| | | <div class="mySecret" style="max-height:250px ;" v-if="commentListData.length==0"> |
| | | <p>空空如也..</p> |
| | | </div> |
| | | <div v-for="temp in commentListData" class="commentList"> |
| | |
| | | <div class="samllPadding">:</div> |
| | | </div> |
| | | |
| | | <p slot="content">{{temp.commentContent}}</p> |
| | | <p :id="temp.id" slot="content" v-html="temp.commentContent" class="myContent"></p> |
| | | |
| | | <a-comment v-for="tempData in temp.replyList"> |
| | | <div slot="actions" key="comment-nested-reply-to" class="actionList"> |
| | |
| | | </a-tooltip> |
| | | </div> |
| | | </div> |
| | | <p slot="content">{{tempData.commentContent}}</p> |
| | | <p :id="tempData.id" slot="content">{{tempData.commentContent}}</p> |
| | | </a-comment> |
| | | </a-comment> |
| | | |
| | |
| | | export default { |
| | | components: { |
| | | replyBox |
| | | }, |
| | | props: { |
| | | "foldReply": { |
| | | default: false, |
| | | }, |
| | | }, |
| | | methods: { |
| | | updateCommentList(articleId) { |
| | |
| | | </script> |
| | | |
| | | <style lang="less"> |
| | | .myContent img { |
| | | margin-bottom: -0.125rem; |
| | | img min-height: 3.5rem; |
| | | height: 3em; |
| | | } |
| | | |
| | | .samllPadding { |
| | | padding: 0px 3px 5px; |
| | | } |
| | |
| | | user-select: none; |
| | | } |
| | | |
| | | .ant-comment-nested { |
| | | margin-left: 20px; |
| | | } |
| | | |
| | | .ant-comment-avatar { |
| | | cursor: default; |
| | | } |