添加ng-alain文本省略组件TagHelper

This commit is contained in:
root
2023-09-26 12:41:21 +08:00
parent 37a1073cb3
commit 2fffead763
12 changed files with 446 additions and 4 deletions
+1 -1
View File
@@ -2,7 +2,7 @@
<PropertyGroup>
<VersionMajor>7</VersionMajor>
<VersionMinor>1</VersionMinor>
<VersionPatch>35</VersionPatch>
<VersionPatch>36</VersionPatch>
<VersionPrefix>$(VersionMajor).$(VersionMinor).$(VersionPatch)</VersionPrefix>
<VersionSuffix></VersionSuffix>
</PropertyGroup>
@@ -640,6 +640,7 @@ public abstract class UnitOfWorkBase : DbContext, IUnitOfWork, IFilterSwitch {
if ( value != null )
result.Add( value );
} );
continue;
}
var changeValue = GetPropertyChangeValue( property, propertyEntry );
if ( changeValue == null )
@@ -77,6 +77,22 @@ public static class AngularConst {
/// </summary>
public const string BindFixed = "bind-fixed";
/// <summary>
/// 行数
/// </summary>
public const string BindLines = "bind-lines";
/// <summary>
/// 长度
/// </summary>
public const string BindLength = "bind-length";
/// <summary>
/// 全宽识别
/// </summary>
public const string BindFullWidthRecognition = "bind-full-width-recognition";
/// <summary>
/// 尾巴
/// </summary>
public const string BindTail = "bind-tail";
/// <summary>
/// 名称
/// </summary>
public const string BindName = "bind-name";
@@ -101,6 +117,10 @@ public static class AngularConst {
/// </summary>
public const string BindValue = "bind-value";
/// <summary>
/// 工具提示
/// </summary>
public const string BindTooltip = "bind-tooltip";
/// <summary>
/// 提示
/// </summary>
public const string BindPlaceholder = "bind-placeholder";
@@ -0,0 +1,79 @@
using Util.Ui.Angular.Builders;
using Util.Ui.Angular.Configs;
using Util.Ui.Configs;
namespace Util.Ui.NgAlain.Components.Ellipsis.Builders;
/// <summary>
/// 文本省略标签生成器
/// </summary>
public class EllipsisBuilder : AngularTagBuilder {
/// <summary>
/// 配置
/// </summary>
private readonly Config _config;
/// <summary>
/// 初始化文本省略标签生成器
/// </summary>
/// <param name="config">配置</param>
public EllipsisBuilder( Config config ) : base( config, "ellipsis" ) {
_config = config;
}
/// <summary>
/// 配置工具提示
/// </summary>
public EllipsisBuilder Tooltip() {
AttributeIfNotEmpty( "[tooltip]", _config.GetBoolValue( UiConst.Tooltip ) );
AttributeIfNotEmpty( "[tooltip]", _config.GetValue( AngularConst.BindTooltip ) );
return this;
}
/// <summary>
/// 配置文本最大长度
/// </summary>
public EllipsisBuilder Length() {
AttributeIfNotEmpty( "length", _config.GetValue( UiConst.Length ) );
AttributeIfNotEmpty( "[length]", _config.GetValue( AngularConst.BindLength ) );
return this;
}
/// <summary>
/// 配置文本最大行数
/// </summary>
public EllipsisBuilder Lines() {
AttributeIfNotEmpty( "lines", _config.GetValue( UiConst.Lines ) );
AttributeIfNotEmpty( "[lines]", _config.GetValue( AngularConst.BindLines ) );
return this;
}
/// <summary>
/// 配置是否将全角字符的长度视为2来计算字符串长度
/// </summary>
public EllipsisBuilder FullWidthRecognition() {
AttributeIfNotEmpty( "[fullWidthRecognition]", _config.GetBoolValue( UiConst.FullWidthRecognition ) );
AttributeIfNotEmpty( "[fullWidthRecognition]", _config.GetValue( AngularConst.BindFullWidthRecognition ) );
return this;
}
/// <summary>
/// 配置溢出尾巴
/// </summary>
public EllipsisBuilder Tail() {
AttributeIfNotEmpty( "tail", _config.GetValue( UiConst.Tail ) );
AttributeIfNotEmpty( "[tail]", _config.GetValue( AngularConst.BindTail ) );
return this;
}
/// <summary>
/// 配置
/// </summary>
public override void Config() {
base.Config();
Tooltip().Length().Lines().FullWidthRecognition().Tail();
var value = _config.GetValue( UiConst.Value );
if ( value.IsEmpty() )
return;
AppendContent( "{{" + value + "}}" );
}
}
@@ -0,0 +1,77 @@
using Microsoft.AspNetCore.Mvc.ViewFeatures;
using Microsoft.AspNetCore.Razor.TagHelpers;
using Util.Ui.Angular.TagHelpers;
using Util.Ui.Configs;
using Util.Ui.NgAlain.Components.Ellipsis.Helpers;
using Util.Ui.NgAlain.Components.Ellipsis.Renders;
using Util.Ui.Renders;
namespace Util.Ui.NgAlain.Components.Ellipsis;
/// <summary>
/// 文本省略组件,生成的标签为&lt;ellipsis&gt;&lt;/ellipsis&gt;
/// </summary>
[HtmlTargetElement( "util-ellipsis" )]
public class EllipsisTagHelper : AngularTagHelperBase {
/// <summary>
/// 配置
/// </summary>
private Config _config;
/// <summary>
/// 属性表达式
/// </summary>
public ModelExpression For { get; set; }
/// <summary>
/// [tooltip],移动到文本展示完整内容的提示,默认值: false
/// </summary>
public bool Tooltip { get; set; }
/// <summary>
/// [tooltip],移动到文本展示完整内容的提示,默认值: false
/// </summary>
public string BindTooltip { get; set; }
/// <summary>
/// length,在按照长度截取下的文本最大字符数,超过则截取省略
/// </summary>
public int Length { get; set; }
/// <summary>
/// [length],在按照长度截取下的文本最大字符数,超过则截取省略
/// </summary>
public string BindLength { get; set; }
/// <summary>
/// lines,在按照行数截取下最大的行数,超过则截取省略
/// </summary>
public int Lines { get; set; }
/// <summary>
/// [lines],在按照行数截取下最大的行数,超过则截取省略
/// </summary>
public string BindLines { get; set; }
/// <summary>
/// [fullWidthRecognition],是否将全角字符的长度视为2来计算字符串长度,默认值: false
/// </summary>
public bool FullWidthRecognition { get; set; }
/// <summary>
/// [fullWidthRecognition],是否将全角字符的长度视为2来计算字符串长度,默认值: false
/// </summary>
public string BindFullWidthRecognition { get; set; }
/// <summary>
/// tail,指定溢出尾巴,默认值: ...
/// </summary>
public string Tail { get; set; }
/// <summary>
/// [tail],指定溢出尾巴,默认值: ...
/// </summary>
public string BindTail { get; set; }
/// <inheritdoc />
protected override void ProcessBefore( TagHelperContext context, TagHelperOutput output ) {
_config = new Config( context, output );
var loader = new EllipsisExpressionLoader();
loader.Load( _config );
}
/// <inheritdoc />
protected override IRender GetRender( TagHelperContext context, TagHelperOutput output, TagHelperContent content ) {
_config.Content = content;
return new EllipsisRender( _config );
}
}
@@ -0,0 +1,19 @@
using Util.Ui.Configs;
using Util.Ui.Expressions;
using Util.Ui.NgZorro.Expressions;
namespace Util.Ui.NgAlain.Components.Ellipsis.Helpers;
/// <summary>
/// 文本省略表达式加载器
/// </summary>
public class EllipsisExpressionLoader : NgZorroExpressionLoaderBase {
/// <summary>
/// 加载模型信息
/// </summary>
/// <param name="config">配置</param>
/// <param name="info">模型表达式信息</param>
protected override void Load( Config config, ModelExpressionInfo info ) {
config.SetAttribute( UiConst.Value, info.SafePropertyName, false );
}
}
@@ -0,0 +1,38 @@
using Util.Ui.Builders;
using Util.Ui.Configs;
using Util.Ui.NgAlain.Components.Ellipsis.Builders;
using Util.Ui.Renders;
namespace Util.Ui.NgAlain.Components.Ellipsis.Renders;
/// <summary>
/// 文本省略渲染器
/// </summary>
public class EllipsisRender : RenderBase {
/// <summary>
/// 配置
/// </summary>
private readonly Config _config;
/// <summary>
/// 初始化文本省略渲染器
/// </summary>
/// <param name="config">配置</param>
public EllipsisRender( Config config ) {
_config = config;
}
/// <summary>
/// 获取标签生成器
/// </summary>
protected override TagBuilder GetTagBuilder() {
var builder = new EllipsisBuilder( _config );
builder.Config();
return builder;
}
/// <inheritdoc />
public override IHtmlContent Clone() {
return new EllipsisBuilder( _config.Copy() );
}
}
@@ -213,8 +213,7 @@ public class PageHeaderBuilder : AngularTagBuilder {
/// </summary>
public override void Config() {
base.Config();
Title()
.AutoTitle().SyncTitle()
Title().AutoTitle().SyncTitle()
.Home().HomeLink().HomeI18n()
.AutoBreadcrumb().RecursiveBreadcrumb()
.Loading().Wide().Fixed().FixedOffsetTop()
@@ -39,7 +39,6 @@ public class DisplayExpressionLoader : NgZorroExpressionLoaderBase {
return true;
return false;
}
/// <summary>
/// 加载值
+16
View File
@@ -45,6 +45,10 @@ public static class UiConst {
/// </summary>
public const string DropdownRender = "dropdown-render";
/// <summary>
/// 行数
/// </summary>
public const string Lines = "lines";
/// <summary>
/// 访问控制
/// </summary>
public const string Acl = "acl";
@@ -57,6 +61,10 @@ public static class UiConst {
/// </summary>
public const string AclElseTemplateId = "acl-else-template-id";
/// <summary>
/// 尾巴
/// </summary>
public const string Tail = "tail";
/// <summary>
/// 类型
/// </summary>
public const string Type = "type";
@@ -429,6 +437,10 @@ public static class UiConst {
/// </summary>
public const string MinLengthMessage = "min-length-message";
/// <summary>
/// 长度
/// </summary>
public const string Length = "length";
/// <summary>
/// 最大长度
/// </summary>
public const string MaxLength = "max-length";
@@ -461,6 +473,10 @@ public static class UiConst {
/// </summary>
public const string Tooltip = "tooltip";
/// <summary>
/// 全宽识别
/// </summary>
public const string FullWidthRecognition = "full-width-recognition";
/// <summary>
/// 链接
/// </summary>
public const string Link = "link";
@@ -0,0 +1,22 @@
using System.Text;
using Xunit;
namespace Util.Ui.NgAlain.Tests.Ellipsis {
/// <summary>
/// 文本省略组件测试
/// </summary>
public partial class EllipsisTagHelperTest {
/// <summary>
/// 测试解析表达式属性for
/// </summary>
[Fact]
public void TestFor_1() {
_wrapper.SetExpression( t => t.Code );
var result = new StringBuilder();
result.Append( "<ellipsis>" );
result.Append( "{{model.code}}" );
result.Append( "</ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
}
}
@@ -0,0 +1,172 @@
using System.Text;
using Util.Ui.Angular.Configs;
using Util.Ui.Configs;
using Util.Ui.NgAlain.Components.Ellipsis;
using Util.Ui.NgAlain.Tests.Samples;
using Util.Ui.TagHelpers;
using Xunit;
using Xunit.Abstractions;
namespace Util.Ui.NgAlain.Tests.Ellipsis {
/// <summary>
/// 文本省略组件测试
/// </summary>
public partial class EllipsisTagHelperTest {
/// <summary>
/// 输出工具
/// </summary>
private readonly ITestOutputHelper _output;
/// <summary>
/// TagHelper包装器
/// </summary>
private readonly TagHelperWrapper<Customer> _wrapper;
/// <summary>
/// 测试初始化
/// </summary>
public EllipsisTagHelperTest( ITestOutputHelper output ) {
_output = output;
_wrapper = new EllipsisTagHelper().ToWrapper<Customer>();
}
/// <summary>
/// 获取结果
/// </summary>
private string GetResult() {
var result = _wrapper.GetResult();
_output.WriteLine( result );
return result;
}
/// <summary>
/// 测试默认输出
/// </summary>
[Fact]
public void TestDefault() {
var result = new StringBuilder();
result.Append( "<ellipsis></ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
/// <summary>
/// 测试工具提示
/// </summary>
[Fact]
public void TestTooltip() {
_wrapper.SetContextAttribute( UiConst.Tooltip, true );
var result = new StringBuilder();
result.Append( "<ellipsis [tooltip]=\"true\"></ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
/// <summary>
/// 测试工具提示
/// </summary>
[Fact]
public void TestBindTooltip() {
_wrapper.SetContextAttribute( AngularConst.BindTooltip, "true" );
var result = new StringBuilder();
result.Append( "<ellipsis [tooltip]=\"true\"></ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
/// <summary>
/// 测试文本最大长度
/// </summary>
[Fact]
public void TestLength() {
_wrapper.SetContextAttribute( UiConst.Length, 2 );
var result = new StringBuilder();
result.Append( "<ellipsis length=\"2\"></ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
/// <summary>
/// 测试文本最大长度
/// </summary>
[Fact]
public void TestBindLength() {
_wrapper.SetContextAttribute( AngularConst.BindLength, "2" );
var result = new StringBuilder();
result.Append( "<ellipsis [length]=\"2\"></ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
/// <summary>
/// 测试文本最大行数
/// </summary>
[Fact]
public void TestLines() {
_wrapper.SetContextAttribute( UiConst.Lines, 2 );
var result = new StringBuilder();
result.Append( "<ellipsis lines=\"2\"></ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
/// <summary>
/// 测试文本最大行数
/// </summary>
[Fact]
public void TestBindLines() {
_wrapper.SetContextAttribute( AngularConst.BindLines, "2" );
var result = new StringBuilder();
result.Append( "<ellipsis [lines]=\"2\"></ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
/// <summary>
/// 测试是否将全角字符的长度视为2来计算字符串长度
/// </summary>
[Fact]
public void TestFullWidthRecognition() {
_wrapper.SetContextAttribute( UiConst.FullWidthRecognition, true );
var result = new StringBuilder();
result.Append( "<ellipsis [fullWidthRecognition]=\"true\"></ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
/// <summary>
/// 测试是否将全角字符的长度视为2来计算字符串长度
/// </summary>
[Fact]
public void TestBindFullWidthRecognition() {
_wrapper.SetContextAttribute( AngularConst.BindFullWidthRecognition, "true" );
var result = new StringBuilder();
result.Append( "<ellipsis [fullWidthRecognition]=\"true\"></ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
/// <summary>
/// 测试溢出尾巴
/// </summary>
[Fact]
public void TestTail() {
_wrapper.SetContextAttribute( UiConst.Tail, "a" );
var result = new StringBuilder();
result.Append( "<ellipsis tail=\"a\"></ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
/// <summary>
/// 测试溢出尾巴
/// </summary>
[Fact]
public void TestBindTail() {
_wrapper.SetContextAttribute( AngularConst.BindTail, "a" );
var result = new StringBuilder();
result.Append( "<ellipsis [tail]=\"a\"></ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
/// <summary>
/// 测试内容
/// </summary>
[Fact]
public void TestAppendContent() {
_wrapper.AppendContent( "a" );
var result = new StringBuilder();
result.Append( "<ellipsis>a</ellipsis>" );
Assert.Equal( result.ToString(), GetResult() );
}
}
}