imhven
/
abp
mirror of https://github.com/abpframework/abp
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add readonly support to CommentingViewComponent

Browse Source
pull/17925/head
Enis Necipoglu 2 years ago
parent 1c5789dd6a
commit 0289e15a8f
No known key found for this signature in database
GPG Key ID: 1EC55E13241E1680
3 changed files with 103 additions and 87 deletions
Show Stats Download Patch File Download Diff File

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

@ -65,7 +65,13 @@
<abp-column size-md="_12"> <abp-column size-md="_12">
@if (GlobalFeatureManager.Instance.IsEnabled<CommentsFeature>()) @if (GlobalFeatureManager.Instance.IsEnabled<CommentsFeature>())
{ {
@await Component.InvokeAsync(typeof(CommentingViewComponent), new {entityType = "quote", entityId = "1", referralLinks = new [] {"nofollow"}}) @await Component.InvokeAsync(typeof(CommentingViewComponent), new
{
entityType = "quote",
entityId = "1",
isReadOnly = false,
referralLinks = new [] {"nofollow"}
})
} }
</abp-column> </abp-column>
</abp-row> </abp-row>

6
modules/cms-kit/src/Volo.CmsKit.Public.Web/Pages/CmsKit/Shared/Components/Commenting/CommentingViewComponent.cs
Unescape View File

@ -60,6 +60,7 @@ public class CommentingViewComponent : AbpViewComponent
public virtual async Task<IViewComponentResult> InvokeAsync( public virtual async Task<IViewComponentResult> InvokeAsync(
string entityType, string entityType,
string entityId, string entityId,
bool isReadOnly,
IEnumerable<string> referralLinks = null) IEnumerable<string> referralLinks = null)
{ {
referralLinks ??= Enumerable.Empty<string>(); referralLinks ??= Enumerable.Empty<string>();
@ -74,7 +75,8 @@ public class CommentingViewComponent : AbpViewComponent
EntityType = entityType, EntityType = entityType,
ReferralLinks = referralLinks, ReferralLinks = referralLinks,
LoginUrl = loginUrl, LoginUrl = loginUrl,
Comments = comments.OrderByDescending(i => i.CreationTime).ToList() IsReadOnly = isReadOnly,
Comments = comments.OrderByDescending(i => i.CreationTime).ToList(),
}; };
await ConvertMarkdownTextsToHtml(viewModel); await ConvertMarkdownTextsToHtml(viewModel);
@ -144,6 +146,8 @@ public class CommentingViewComponent : AbpViewComponent
public string Captcha { get; set; } public string Captcha { get; set; }
public string CaptchaImageBase64 { get; set; } public string CaptchaImageBase64 { get; set; }
public bool IsReadOnly { get; set; }
} }
} }

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

@ -20,16 +20,16 @@
@<span> @<span>
<i class="far fa-comment-alt me-2"></i> <i class="far fa-comment-alt me-2"></i>
@((string.IsNullOrWhiteSpace(author.Name) @((string.IsNullOrWhiteSpace(author.Name)
? author.UserName ? author.UserName
: author.Name + " " + author.Surname).Trim()) : author.Name + " " + author.Surname).Trim())
<small class="text-muted float-end" style="opacity: .5; font-size: 14px">@creationTime.ToString()</small> <small class="text-muted float-end" style="opacity: .5; font-size: 14px">@creationTime.ToString()</small>
</span>; </span>;
} }
@{ @{
Func<dynamic, IHtmlContent> GetCommentArea(Guid? repliedCommentId, bool cancelButton = false) => Func<dynamic, IHtmlContent> GetCommentArea(Guid? repliedCommentId, bool cancelButton = false) =>
@<div class="cms-comment-form-area bg-light card p-3 mx-0 @(repliedCommentId.HasValue ? "my-3" : "mt-3")" @<div class="cms-comment-form-area bg-light card p-3 mx-0 @(repliedCommentId.HasValue ? "my-3" : "mt-3")"
data-reply-id="@(repliedCommentId?.ToString() ?? "")" data-reply-id="@(repliedCommentId?.ToString() ?? "")"
style="@(string.IsNullOrEmpty(repliedCommentId?.ToString() ?? "") ? "" : "display:none")"> style="@(string.IsNullOrEmpty(repliedCommentId?.ToString() ?? "") ? "" : "display:none")">
<form class="cms-comment-form"> <form class="cms-comment-form">
<input hidden value="@(repliedCommentId?.ToString() ?? "")" name="repliedCommentId" /> <input hidden value="@(repliedCommentId?.ToString() ?? "")" name="repliedCommentId" />
<div class="row"> <div class="row">
@ -43,31 +43,31 @@
</div> </div>
@if (CmsKitCommentOptions.Value.IsRecaptchaEnabled) @if (CmsKitCommentOptions.Value.IsRecaptchaEnabled)
{ {
<div class="volo-captcha"> <div class="volo-captcha">
<label class="form-label" for="Input_Captcha">@L["CaptchaCode"]</label> <label class="form-label" for="Input_Captcha">@L["CaptchaCode"]</label>
<div class="d-flex"> <div class="d-flex">
<div class="bd-highlight"> <div class="bd-highlight">
<img src="@Model.Input.CaptchaImageBase64" /> <img src="@Model.Input.CaptchaImageBase64" />
</div> </div>
<div class="flex-grow-1 bd-highlight"> <div class="flex-grow-1 bd-highlight">
<abp-input type="number" asp-for="@Model.Input.Captcha" suppress-label="true" class="d-inline-block" autocomplete="off" /> <abp-input type="number" asp-for="@Model.Input.Captcha" suppress-label="true" class="d-inline-block" autocomplete="off" />
</div>
<abp-input asp-for="@Model.CaptchaId" value="@Model.CaptchaOutput.Id" />
</div> </div>
<abp-input asp-for="@Model.CaptchaId" value="@Model.CaptchaOutput.Id" />
</div> </div>
} </div>
}
<div class="col-auto"> <div class="col-auto">
<div class="text-end"> <div class="text-end">
<abp-button id="submit-button" type="submit" button-type="Primary"> <abp-button id="submit-button" type="submit" button-type="Primary">
<i class="fa fa-comment-alt me-1"></i> @L["Send"] <i class="fa fa-comment-alt me-1"></i> @L["Send"]
</abp-button> </abp-button>
@if (cancelButton) @if (cancelButton)
{ {
<abp-button type="button" button-type="Light" class="reply-cancel-button" data-reply-id="@(repliedCommentId?.ToString() ?? "")"> <abp-button type="button" button-type="Light" class="reply-cancel-button" data-reply-id="@(repliedCommentId?.ToString() ?? "")">
<i class="fa fa-times me-1"></i> @L["Cancel"] <i class="fa fa-times me-1"></i> @L["Cancel"]
</abp-button> </abp-button>
} }
</div> </div>
</div> </div>
</div> </div>
@ -86,32 +86,32 @@
Func<dynamic, IHtmlContent> GetCommentActionArea(Guid id, Guid authorId, bool isReply) => Func<dynamic, IHtmlContent> GetCommentActionArea(Guid id, Guid authorId, bool isReply) =>
@<div class="inner-comment-buttons text-start"> @<div class="inner-comment-buttons text-start">
@if (!isReply) @if (!isReply)
{ {
@if (CurrentUser.IsAuthenticated) @if (CurrentUser.IsAuthenticated)
{ {
<a href="#" class="comment-links comment-reply-link btn btn-sm shadow-sm btn-primary" data-reply-id="@id.ToString()" id="@($"cms-comment_{Model.Input.EntityType}_{Model.Input.EntityId}_{id}_link")"> <a href="#" class="comment-links comment-reply-link btn btn-sm shadow-sm btn-primary" data-reply-id="@id.ToString()" id="@($"cms-comment_{Model.Input.EntityType}_{Model.Input.EntityId}_{id}_link")">
<i class="fa fa-reply mr -1"></i> @L["Reply"] <i class="fa fa-reply mr -1"></i> @L["Reply"]
</a> </a>
<a href="#" class="comment-links comment-delete-link btn btn-sm shadow-sm btn-link text-muted bg-white " data-author-id="@authorId.ToString()" data-id="@id.ToString()">
<i class="fa fa-trash mr -1"></i> @L["Delete"]
</a>
}
else
{
<a href="@(Model.Input.LoginUrl + "_" + id)" class="btn btn-sm btn-light shadow-sm">
@L["LoginToReply"]
</a>
}
}
<a href="#" class="comment-links comment-delete-link btn btn-sm shadow-sm btn-link text-muted bg-white " data-author-id="@authorId.ToString()" data-id="@id.ToString()">
<i class="fa fa-trash mr -1"></i> @L["Delete"]
</a>
}
else
{
<a href="@(Model.Input.LoginUrl + "_" + id)" class="btn btn-sm btn-light shadow-sm">
@L["LoginToReply"]
</a>
}
}
@if (authorId == CurrentUser.Id) @if (authorId == CurrentUser.Id)
{ {
<a href="#" class="comment-links comment-edit-link btn btn-sm shadow-sm btn-link text-muted bg-white" data-id="@id.ToString()"> <a href="#" class="comment-links comment-edit-link btn btn-sm shadow-sm btn-link text-muted bg-white" data-id="@id.ToString()">
<i class="fa fa-pencil mr -1 "></i> @L["Edit"] <i class="fa fa-pencil mr -1 "></i> @L["Edit"]
</a> </a>
} }
</div>; </div>;
} }
@{ @{
@ -128,26 +128,26 @@
</div> </div>
</div> </div>
<div class="mt-0"> <div class="mt-0">
<small class="text-muted float-end" >@L["MarkdownSupported"]</small> <small class="text-muted float-end">@L["MarkdownSupported"]</small>
</div> </div>
@if (CmsKitCommentOptions.Value.IsRecaptchaEnabled) @if (CmsKitCommentOptions.Value.IsRecaptchaEnabled)
{ {
var output = await Model.GenerateCaptchaAsync(); var output = await Model.GenerateCaptchaAsync();
<div class="volo-captcha"> <div class="volo-captcha">
<label class="form-label" for="Input_Captcha_@output.Id">@L["CaptchaCode"]</label> <label class="form-label" for="Input_Captcha_@output.Id">@L["CaptchaCode"]</label>
<div class="d-flex"> <div class="d-flex">
<div class="bd-highlight"> <div class="bd-highlight">
<img src="@Model.GetCaptchaImageBase64(output.ImageBytes)"/> <img src="@Model.GetCaptchaImageBase64(output.ImageBytes)" />
</div> </div>
<div class="flex-grow-1 bd-highlight"> <div class="flex-grow-1 bd-highlight">
<abp-input id="Input_Captcha_@output.Id" type="number" asp-for="@Model.Input.Captcha" suppress-label="true" class="d-inline-block" autocomplete="off"/> <abp-input id="Input_Captcha_@output.Id" type="number" asp-for="@Model.Input.Captcha" suppress-label="true" class="d-inline-block" autocomplete="off" />
</div>
<abp-input asp-for="@Model.CaptchaId" value="@output.Id"/>
</div> </div>
<abp-input asp-for="@Model.CaptchaId" value="@output.Id" />
</div> </div>
} </div>
}
<div class="col-auto"> <div class="col-auto">
<div class="text-end"> <div class="text-end">
<abp-button type="submit" button-type="Primary" size="Block"> @L["Update"] </abp-button> <abp-button type="submit" button-type="Primary" size="Block"> @L["Update"] </abp-button>
@ -183,22 +183,25 @@
@GetCommentContentArea(comment.Id, comment.Text).Invoke(null) @GetCommentContentArea(comment.Id, comment.Text).Invoke(null)
<div class="row mt-2"> @if (!Model.Input.IsReadOnly)
<div class="col"> {
<div class="my-2 "> <div class="row mt-2">
@GetCommentActionArea(comment.Id, comment.Author.Id, false).Invoke(null) <div class="col">
<div class="my-2 ">
@GetCommentActionArea(comment.Id, comment.Author.Id, false).Invoke(null)
</div>
</div> </div>
</div> <div class="col-auto">
<div class="col-auto"> <div class="reaction-in-comment">
<div class="reaction-in-comment"> @if (cmsKitUiOptions.Value.CommentsOptions.IsReactionsEnabled && GlobalFeatureManager.Instance.IsEnabled<ReactionsFeature>())
@if (cmsKitUiOptions.Value.CommentsOptions.IsReactionsEnabled && GlobalFeatureManager.Instance.IsEnabled<ReactionsFeature>()) {
{ @await Component.InvokeAsync(typeof(ReactionSelectionViewComponent), new { entityType = "comment", entityId = comment.Id.ToString() })
@await Component.InvokeAsync(typeof(ReactionSelectionViewComponent), new { entityType = "comment", entityId = comment.Id.ToString() }) }
} </div>
</div> </div>
</div> </div>
</div> @GetEditArea(comment.Id, Model.Input.RawCommentTexts[comment.Id], comment.ConcurrencyStamp).Invoke(null)
@GetEditArea(comment.Id, Model.Input.RawCommentTexts[comment.Id], comment.ConcurrencyStamp).Invoke(null) }
@if (comment.Replies.Any()) @if (comment.Replies.Any())
{ {
@ -212,23 +215,26 @@
@GetCommentContentArea(reply.Id, reply.Text).Invoke(null) @GetCommentContentArea(reply.Id, reply.Text).Invoke(null)
<div class="row mt-2"> @if (!Model.Input.IsReadOnly)
<div class="col"> {
<div class="my-2 "> <div class="row mt-2">
@GetCommentActionArea(reply.Id, reply.Author.Id, true).Invoke(null) <div class="col">
<div class="my-2 ">
@GetCommentActionArea(reply.Id, reply.Author.Id, true).Invoke(null)
</div>
</div> </div>
</div> <div class="col-auto">
<div class="col-auto"> <div class="reaction-in-comment">
<div class="reaction-in-comment"> @if (cmsKitUiOptions.Value.CommentsOptions.IsReactionsEnabled && GlobalFeatureManager.Instance.IsEnabled<ReactionsFeature>())
@if (cmsKitUiOptions.Value.CommentsOptions.IsReactionsEnabled && GlobalFeatureManager.Instance.IsEnabled<ReactionsFeature>()) {
{ @await Component.InvokeAsync(typeof(ReactionSelectionViewComponent), new { entityType = "comment", entityId = reply.Id.ToString() })
@await Component.InvokeAsync(typeof(ReactionSelectionViewComponent), new { entityType = "comment", entityId = reply.Id.ToString() }) }
} </div>
</div> </div>
</div> </div>
</div>
@GetEditArea(reply.Id, Model.Input.RawCommentTexts[reply.Id], reply.ConcurrencyStamp).Invoke(null) @GetEditArea(reply.Id, Model.Input.RawCommentTexts[reply.Id], reply.ConcurrencyStamp).Invoke(null)
}
</div> </div>
</div> </div>
} }

Write Preview
Loading…
Cancel
Save