tsai
/
abp
mirror of https://github.com/abpframework/abp.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

cmskit comment: ui improvements

pull/4961/head
Yunus Emre Kalkan 6 years ago
parent
f7b3f1eb1c
commit
326d6810b7
5 changed files with 141 additions and 42 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      modules/cms-kit/host/Volo.CmsKit.Web.Unified/Pages/Index.cshtml
  2. 6
      modules/cms-kit/src/Volo.CmsKit.Domain.Shared/Volo/CmsKit/Localization/Resources/en.json
  3. 5
      modules/cms-kit/src/Volo.CmsKit.Public.Application/Volo/CmsKit/Comments/CommentPublicAppService.cs
  4. 91
      modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/Default.cshtml
  5. 80
      modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/default.js

1
modules/cms-kit/host/Volo.CmsKit.Web.Unified/Pages/Index.cshtml
View File

@ -41,4 +41,5 @@
<abp-card-footer>
@await Component.InvokeAsync(typeof(ReactionSelectionViewComponent), new { entityType = "quote", entityId = "2" })
</abp-card-footer>
@await Component.InvokeAsync(typeof(CommentingViewComponent), new { entityType = "quote", entityId = "2" })
</abp-card>

6
modules/cms-kit/src/Volo.CmsKit.Domain.Shared/Volo/CmsKit/Localization/Resources/en.json
View File

@ -5,8 +5,10 @@
"YourComment": "Your comment",
"YourReply": "Your reply",
"Send": "Send",
"Delete": "delete",
"Reply": "reply",
"Delete": "Delete",
"Reply": "Reply",
"Update": "Update",
"Edit": "Edit",
"MessageDeletionConfirmationMessage": "This comment will be deleted completely."
}
}

5
modules/cms-kit/src/Volo.CmsKit.Public.Application/Volo/CmsKit/Comments/CommentPublicAppService.cs
View File

@ -56,6 +56,11 @@ namespace Volo.CmsKit.Comments
{
var comment = await CommentRepository.GetAsync(id);
if (comment.CreatorId != CurrentUser.Id)
{
throw new BusinessException();
}
comment.SetText(input.Text);
var updatedComment = await CommentRepository.UpdateAsync(comment);

91
modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/Default.cshtml
View File

@ -33,52 +33,83 @@
</form>
</div>;
}
@{
Func<dynamic, IHtmlContent> GetCommentContentArea(Guid id, Guid authorId, bool isReply, string text) =>
@<div>
<div class="cms-comment-content-area" data-id="@id.ToString()">
<p>
@text
</p>
</div>
@if (!isReply)
{
<a href="#" class="comment-reply-link" data-reply-id="@id.ToString()">
<i class="fa fa-reply"></i> @L["Reply"]
</a>
}
@if (authorId == CurrentUser.Id)
{
@if (!isReply)
{
<span> | </span>
}
<a href="#" class="comment-delete-link" data-id="@id.ToString()">
<i class="fa fa-trash"></i> @L["Delete"]
</a>
<span> | </span>
<a href="#" class="comment-edit-link" data-id="@id.ToString()">
<i class="fa fa-pencil"></i> @L["Edit"]
</a>
}
<div class="cms-comment-edit-area" data-id="@id.ToString()" style="display:none">
<form class="cms-comment-update-form">
<input hidden value="@id.ToString()" name="id"/>
<div class="form-group">
<textarea class="form-control" name="commentText" rows="3">@text</textarea>
</div>
<abp-button type="button" button-type="Secondary" class="comment-edit-cancel-button" data-id="@id.ToString()"> @L["Cancel"] </abp-button>
<abp-button type="submit" button-type="Primary"> @L["Update"] </abp-button>
</form>
</div>
</div>;
}
<div class="cms-comment-area" data-entity-type="@Model.EntityType" data-entity-id="@Model.EntityId">
@foreach (var comment in Model.Comments)
{
<div class="comment border p-3 pl-5">
<h4>
<h5>
<i class="fa fa-comment-o"></i>
@GetCommentAuthorName(comment.Author).Invoke(null)
</h4>
<p>
@comment.Text
</p>
</h5>
@if (comment.Author.Id == CurrentUser.Id)
{
<a href="#" class="comment-delete-link" data-comment-id="@comment.Id">
@L["Delete"]
</a>
}
@GetCommentContentArea(comment.Id, comment.Author.Id, false, comment.Text).Invoke(null)
<a href="#" class="comment-reply-link" data-reply-id="@comment.Id">
@L["Reply"]
</a>
@GetCommentArea(comment.Id.ToString(), true).Invoke(null)
@foreach (var reply in comment.Replies)
@if (comment.Replies.Any())
{
<div class="comment border p-3 pl-5">
<h6>
<i class="fa fa-comment-o"></i>
@GetCommentAuthorName(reply.Author).Invoke(null)
</h6>
<p>
@reply.Text
</p>
<div class="p-2">
@foreach (var reply in comment.Replies)
{
<div class="comment border p-3 ml-5">
<h6>
<i class="fa fa-comment-o"></i>
@GetCommentAuthorName(reply.Author).Invoke(null)
</h6>
@if (reply.Author.Id == CurrentUser.Id)
{
<a href="#" class="comment-delete-link" data-comment-id="@reply.Id">
@L["Delete"]
</a>
}
@GetCommentContentArea(reply.Id, reply.Author.Id, true, reply.Text).Invoke(null)
</div>
}
</div>
}
@GetCommentArea(comment.Id.ToString(), true).Invoke(null)
</div>
}
<div class="p-3 pl-5">

80
modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/default.js
View File

@ -15,6 +15,40 @@
};
}
function registerEditLinks($container) {
$container.find('.comment-edit-link').each(function () {
var $link = $(this);
$link.on('click', function (e) {
e.preventDefault();
var commentId = $link.data('id');
var $relatedCommentContentArea = $container.find('.cms-comment-content-area[data-id='+ commentId +']');
var $relatedCommentEditFormArea = $container.find('.cms-comment-edit-area[data-id='+ commentId +']');
$relatedCommentContentArea.hide();
$relatedCommentEditFormArea.show();
$link.removeAttr('href');
});
});
$container.find('.comment-edit-cancel-button').each(function () {
var $button = $(this);
$button.on('click', function (e) {
e.preventDefault();
var commentId = $button.data('id');
var $relatedCommentContentArea = $container.find('.cms-comment-content-area[data-id='+ commentId +']');
var $relatedCommentEditFormArea = $container.find('.cms-comment-edit-area[data-id='+ commentId +']');
var $link = $container.find('.comment-edit-link[data-id='+ commentId +']');
$relatedCommentContentArea.show();
$relatedCommentEditFormArea.hide();
$link.attr('href','#');
});
});
}
function registerReplyLinks($container) {
$container.find('.comment-reply-link').each(function () {
var $link = $(this);
@ -23,9 +57,10 @@
var replyCommentId = $link.data('reply-id');
var relatedCommentArea = $container.find('.cms-comment-form-area[data-reply-id='+ replyCommentId +']');
var $relatedCommentArea = $container.find('.cms-comment-form-area[data-reply-id='+ replyCommentId +']');
relatedCommentArea.show();
$relatedCommentArea.show();
$link.removeAttr('href');
});
});
$container.find('.reply-cancel-button').each(function () {
@ -35,9 +70,11 @@
var replyCommentId = $button.data('reply-id');
var relatedCommentArea = $container.find('.cms-comment-form-area[data-reply-id='+ replyCommentId +']');
var $relatedCommentArea = $container.find('.cms-comment-form-area[data-reply-id='+ replyCommentId +']');
var $replyLink = $container.find('.comment-reply-link[data-reply-id='+ replyCommentId +']');
relatedCommentArea.hide();
$relatedCommentArea.hide();
$replyLink.attr('href','#');
});
});
}
@ -48,11 +85,31 @@
$link.on('click', '', function (e) {
e.preventDefault();
abp.message.confirm(l("MessageDeletionConfirmationMessage"), function () {
volo.cmsKit.comments.commentPublic.delete($link.data('comment-id')
).then(function () {
widgetManager.refresh($widget);
});
abp.message.confirm(l("MessageDeletionConfirmationMessage"), function (ok) {
if (ok){
volo.cmsKit.comments.commentPublic.delete($link.data('id')
).then(function () {
widgetManager.refresh($widget);
});
}
});
});
});
}
function registerUpdateOfNewComment($container) {
$container.find('.cms-comment-update-form').each(function () {
var $form = $(this);
$form.submit(function (e) {
e.preventDefault();
var formAsObject = $form.serializeFormToObject();
volo.cmsKit.comments.commentPublic.update(
formAsObject.id,
{
text: formAsObject.commentText
}
).then(function () {
widgetManager.refresh($widget);
});
});
});
@ -64,13 +121,13 @@
$form.submit(function (e) {
e.preventDefault();
var formAsObject = $form.serializeFormToObject();
console.log(formAsObject);
volo.cmsKit.comments.commentPublic.create(
$.extend(getFilters(), {
repliedCommentId: formAsObject.repliedCommentId,
text: formAsObject.commentText
})
).then(function () {
$form.find('textarea').val('');
widgetManager.refresh($widget);
});
});
@ -79,7 +136,10 @@
function init() {
registerReplyLinks($widget);
registerEditLinks($widget);
registerDeleteLinks($widget);
registerUpdateOfNewComment($widget);
registerSubmissionOfNewComment($widget);
}

Write Preview
Loading…
Cancel
Save