diff --git a/doc/TDesign.Docs.ServerSide/TDesign.xml b/doc/TDesign.Docs.ServerSide/TDesign.xml index 841fe47b..d1ff71cc 100644 --- a/doc/TDesign.Docs.ServerSide/TDesign.xml +++ b/doc/TDesign.Docs.ServerSide/TDesign.xml @@ -57,6 +57,54 @@ 表示实现该接口的组件会被自动作为容器加入。该接口用于动态服务调用时组件所需要的容器组件。 + + + 应用于参数,用于自动生成 API 文档。 + + + + + + + 描述。 + + + + 参数的数据类型。 + + + + + 注释。 + + + + + 必填项。 + + + + + 默认值。 + + + + + 方法可被 api 文档识别。 + + + + + For document only. + + + + + 获取指定组件的 api 文档。 + + 组件。 + + 锚点 @@ -173,7 +221,7 @@ - 点击事件 + 点击锚点的回调方法 @@ -235,11 +283,6 @@ 头像的尺寸。 - - - 头像显示的自定义内容。 - - 表示头像组的容器。 @@ -305,17 +348,12 @@ 表示具备折叠面板的组容器,并使用 展现折叠面板的项。 - - - - - 仅点击图标才可以触发展开或折叠的响应。 - + 设置 true 图标处于标题的右边,null 不用图标,false 图标处于标题左边。 @@ -335,27 +373,17 @@ 表示作为折叠面板的内容。必须放在 组件中。 - - - 初始化 类的新实例。 - - 级联 组件。 - - - - - 设置标题部分的内容。 - + 设置标题字符串。若设置了 属性的值,则该属性无效。 @@ -365,7 +393,7 @@ 右侧操作的内容。 - + true 表示面板是展开状态,否则为折叠状态。 @@ -974,9 +1002,6 @@ 对齐方式。 - - - @@ -1270,6 +1295,11 @@ 表示提示的对齐方式。 + + + 占位字符串。 + + 重写以构建组件的内容。 @@ -1518,7 +1548,7 @@ - 设置大小。 + 尺寸。 @@ -1747,46 +1777,6 @@ - - - 上传组件显示的风格样式。 - - - - - 默认的文件上传风格。 - - - - - 输入框形式的文件上传风格。 - - - - - 上传状态。 - - - - - 未开始。 - - - - - 等待上传。 - - - - - 正在上传。 - - - - - 上传结束。 - - 上传组件允许用户传输文件或提交自己的内容。 @@ -1821,7 +1811,7 @@ - 设置服务端上传的 API 地址。要求 API 可以通过 POST 方式接收请求,并支持 FORM DATA 数据传输方式。 + 设置服务端上传的 API 地址。要求 API 支持 FORM DATA 数据传输方式。 @@ -1899,7 +1889,7 @@ - 附带的 Header + 附带的 Header 字典 @@ -1972,7 +1962,7 @@ - 当已经选择了上传的文件。 + 选择上传的文件。 选择的文件列表。 @@ -2011,6 +2001,46 @@ 文件id。 + + + 上传组件显示的风格样式。 + + + + + 默认的文件上传风格。 + + + + + 输入框形式的文件上传风格。 + + + + + 上传状态。 + + + + + 未开始。 + + + + + 等待上传。 + + + + + 正在上传。 + + + + + 上传结束。 + + 要上传的文件信息。 @@ -2219,11 +2249,6 @@ 表示一个列表容器。配合 组件使用。 - - - - - 列表的尺寸。默认是 。 @@ -2479,7 +2504,7 @@ 显示下级菜单的当前菜单标题。 - + 图标名称。 @@ -3066,7 +3091,7 @@ - 设置弹出层是否具备箭头指向。 + 设置是否具备箭头指向。 @@ -3181,7 +3206,7 @@ - 设置为垂直排列。 + 是否为垂直排列。 @@ -3244,7 +3269,7 @@ - + 设置图标名称。默认自动计算当前步骤所在的数字。 @@ -3431,7 +3456,7 @@ - + 表格的内容。 @@ -3709,9 +3734,6 @@ 设置字段输出的格式。要符合 的定义。 - - - @@ -3744,11 +3766,6 @@ 选项卡 - - - - - 选项卡标题呈现的位置。 @@ -3766,7 +3783,7 @@ - + 当选项卡切换时触发的回调。 @@ -3813,14 +3830,9 @@ 选项卡标题。 - - - - - - 选项卡内容的内边距,默认时 25px。 + 选项卡内容的内边距,默认 25px。 @@ -3828,7 +3840,7 @@ 禁用选项卡。 - + 选项卡标题的图标。 @@ -3972,11 +3984,6 @@ 徽章组件,出现在图标或文字右上角的徽标标识。 - - - - - 徽章显示的文本。 @@ -4335,11 +4342,6 @@ 卡片组件。 - - - - - 设置不显示边框。 @@ -4416,11 +4418,6 @@ 设置显示的日期时间字符串。 - - - 设置评论的任意内容。 - - 设置评论的操作内容。每一个操作需要用 li 标记进行渲染。 @@ -4450,14 +4447,6 @@ - - - 用于动态渲染组件的容器。 - - - - - 分割线。 @@ -4470,7 +4459,7 @@ - 垂直分割线。 + 是否垂直分割线。 @@ -4521,27 +4510,27 @@ - 图片描述 + 图片描述。 - 禁用状态 + 禁用状态。 - 错误内容 + 自定义图片加载失败状态下的显示内容。 - 填充模式 + 图片填充模式。 - 是否展示为图集样式 + 是否展示为图集样式。 @@ -4566,17 +4555,17 @@ - 占位元素 + 占位元素。 - 定位 + 定位。 - 图片圆角类型 + 图片圆角类型。 @@ -4584,16 +4573,6 @@ 图片链接 - - - 加载失败 - - - - - 加载完成 - - 填充模式 @@ -4664,9 +4643,6 @@ 时间轴组件的容器,用于时间轴展示。配合 组件使用。 - - - 设置水平显示。 @@ -4766,9 +4742,6 @@ 自定义图标的名称。 - - - @@ -4817,12 +4790,12 @@ - 尺寸。 + 文字尺寸。 - 颜色。 + 文字颜色。 @@ -4927,12 +4900,12 @@ - 设置当页码数量超出时,前后省略模式。 + 设置当页码数量超出时,页码条前后省略模式。 - 设置是否显示跳转到文本框。 + 设置是否显示【跳转到】文本框。 @@ -5028,7 +5001,6 @@ 构建 跳转到 文本框。 - @@ -5414,11 +5386,6 @@ 标签。 - - - - - 主题颜色。 @@ -5439,7 +5406,7 @@ 形状。 - + 图标的名称。 @@ -5451,7 +5418,7 @@ - 设置组件处于禁用状态。 + 禁用状态。 @@ -6054,6 +6021,14 @@ The info. The context. + + + 用于动态渲染组件的容器。 + + + + + TDesign 的扩展。 diff --git a/doc/TDesign.Docs.Shared/Components/ApiDocument.razor b/doc/TDesign.Docs.Shared/Components/ApiDocument.razor new file mode 100644 index 00000000..b461f7f3 --- /dev/null +++ b/doc/TDesign.Docs.Shared/Components/ApiDocument.razor @@ -0,0 +1,84 @@ +@{ + var parameters = ApiDoc.GetParameterApiDoc(ComponentType); + if ( parameters.Any() ) + { +

@(Name) 的参数

+ + + + + + + + + + + + @foreach ( var param in parameters ) + { + + + + + + + + } + +
名称数据类型默认值说明必填
@param.name + @if ( string.IsNullOrEmpty(param.type) ) + { + Unkonw + } + else + { + @param.type + } + + @param.defaultValue + @param.comment + @if ( param.requried ) + { + Y + } + else + { + N + } +
+ } + + var methods = ApiDoc.GetMethodApiDoc(ComponentType); + if ( methods.Any() ) + { +

@(Name) 的方法

+ + + + + + + + + @foreach ( var item in methods ) + { + + + + + } + +
方法说明
+ @($"{item.returnType} {item.name}({item.parameters})") + @item.comment
+ } +} + + +@code { + [EditorRequired][Parameter] public Type ComponentType { get; set; } + + [Parameter]public string? Title{ get; set; } + + string Name => Title ?? ComponentType.Name; +} \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Components/ComponentAPI.razor b/doc/TDesign.Docs.Shared/Components/ComponentAPI.razor deleted file mode 100644 index 0f4c7641..00000000 --- a/doc/TDesign.Docs.Shared/Components/ComponentAPI.razor +++ /dev/null @@ -1,231 +0,0 @@ -@using Microsoft.AspNetCore.Components; -@using System.Xml; -@using System.Reflection; -
- @if (Parameters.Any()) - { -

@Title 的参数

- - - - @context?.Type - - - - - - @if (context.Required) - { - Y - } - else - { - N - } - - - - } - @if (Methods.Any()) - { - -

@Title 的方法

- - - - - - } -
-@code { - /// - /// 标题 - /// - [Parameter] public string? Title { get; set; } - /// - /// 参数 - /// - List? Parameters { get; set; } - /// - /// 方法 - /// - List? Methods { get; set; } - /// - /// 组件类型 - /// - [Parameter] public Type? Component { get; set; } - [Parameter] public string? Id { get; set; } - - [Inject] HttpClient? _client { get; set; } - [Inject] IJSRuntime JS { get; set; } - bool IsWasm => JS is IJSInProcessRuntime; - protected override async Task OnParametersSetAsync() - { - Title ??= TypeToCSharp(Component); - await InitApiAsync(); - } - private async Task InitApiAsync() - { - var bindingFlags = BindingFlags.DeclaredOnly | BindingFlags.Public | BindingFlags.Instance; - var propertys = Component?.GetProperties(bindingFlags); - var methods = Component?.GetMethods(bindingFlags).Where(x => !x.IsVirtual && !x.IsSpecialName); - Parameters = new List(); - Methods = new List(); - - foreach (var itme in propertys) - { - var editorRequiredAttributes = itme.GetCustomAttributes(typeof(EditorRequiredAttribute), true); - var type = TypeToCSharp(itme.PropertyType); - var @default = itme.PropertyType.IsGenericType || !itme.PropertyType.IsValueType ? "null" : Activator.CreateInstance(itme?.PropertyType)?.ToString(); - Parameter parameter = new() - { - Name = itme.Name, - Default = @default, - Description = $"{await GetXmlDescription($"P:{itme?.DeclaringType?.FullName}.{itme?.Name}")}{await GetEnumFildJoin(itme?.PropertyType)}", - Required = editorRequiredAttributes.Any(), - Type = type - }; - Parameters.Add(parameter); - - } - - foreach (var itme in methods) - { - var key = $"M:{itme?.DeclaringType?.FullName}.{itme?.Name}({String.Join(",", itme.GetParameters().Select(x => x.ParameterType.FullName))})"; - Method method = new() - { - Name = $"{itme.Name}", - Description = await GetXmlDescription(key), - Parameter = String.Join(", ", itme.GetParameters().Select(x => $"{x.ParameterType.Name} {x.Name}")) - }; - Methods.Add(method); - } - } - - /// - /// 获取xml文件代码注释 - /// - /// - /// - private async Task GetXmlDescription(string key) - { - - XmlDocument xml = new XmlDocument(); - - if (IsWasm) - { - // WebAssembly - var xmlStream = await _client.GetStreamAsync("TDesign.xml"); - xml.Load(xmlStream); - } - else - { - // Server - var xmlPath = System.IO.Path.Combine(".", "TDesign.xml"); - xml.Load(xmlPath); - } - - var members = xml.SelectNodes("/doc/members/member"); - - foreach (XmlNode item in members) - { - if (item?.Attributes["name"]?.Value == key) - { - return item?.ChildNodes[0]?.InnerText?.Replace(" ", "").Replace("\n", "").Replace("\r", ""); - } - } - return ""; - } - - /// - /// TypeIL转C#代码风格 - /// - /// - /// - private string? TypeToCSharp(params Type[] types) - { - var reuslt = ""; - for (int i = 0; i < types.Length; i++) - { - var item = types[i]; - var comma = i == types.Length - 1 ? "" : ","; - if (item.IsGenericType) - { - reuslt += $"{item.Name.Split("`")[0]}<{TypeToCSharp(item.GenericTypeArguments)}{comma}>"; - } - else - { - var enumLable = ""; - if (item.IsEnum) { enumLable = "enum:"; } - reuslt += $"{enumLable}{item.Name}{comma}"; - } - } - return reuslt; - } - - /// - /// 枚举字段注释 - /// - /// - /// - private async Task GetEnumFildJoin(Type type) - { - var reuslt = ""; - if (type.IsEnum) - { - var fieldInfos = type.GetFields(BindingFlags.Public | BindingFlags.Static); - foreach (var item in fieldInfos) - { - reuslt += await GetXmlDescription($"F:{item?.DeclaringType?.FullName}.{item?.Name}") + "\n"; - } - } - return reuslt; - } - - /// - /// 参数列表模型 - /// - public class Parameter - { - /// - /// 名称 - /// - public string? Name { get; set; } - /// - /// 类型 - /// - public string? Type { get; set; } - /// - /// 默认值 - /// - public string? Default { get; set; } - /// - /// 描述 - /// - public string? Description { get; set; } - /// - /// 必填 - /// - public bool Required { get; set; } - } - - /// - /// 方法列表模型 - /// - public class Method - { - - /// - /// 名称 - /// - public string? Name { get; set; } - /// - /// 参数 - /// - public string? Parameter { get; set; } - /// - /// 描述 - /// - public string? Description { get; set; } - } -} diff --git a/doc/TDesign.Docs.Shared/Components/PageLayout.razor b/doc/TDesign.Docs.Shared/Components/PageLayout.razor new file mode 100644 index 00000000..97d28261 --- /dev/null +++ b/doc/TDesign.Docs.Shared/Components/PageLayout.razor @@ -0,0 +1,48 @@ + +
+

@Title

+

+ @Description +

+ + + + + @if ( Anchors is not null ) + { +
+ + @foreach ( var item in Anchors ) + { + + } + +
+ } +
+ + @ChildContent + +
+
+ +
+ @if(ComponentType is not null) + { + + }else{ + @ApiContent + } +
+
+
+
+ +@code { + [Parameter] public string? Title { get; set; } + [Parameter] public string? Description { get; set; } + [Parameter] public RenderFragment? ChildContent { get; set; } + [Parameter] public RenderFragment? ApiContent { get; set; } + [Parameter] public string[]? Anchors { get; set; } + [Parameter]public Type? ComponentType{ get; set; } +} \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Basic/ButtonPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Basic/ButtonPage.razor index e8102b3b..c0f759ac 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Basic/ButtonPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Basic/ButtonPage.razor @@ -1,9 +1,9 @@ @page "/components/button" - - - 按钮用于开启一个闭环的操作任务,如“删除”对象、“购买”商品等。 - + + 普通按钮 @@ -420,7 +420,5 @@ ") -
- -
+ @inject IJSRuntime JS \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Basic/IconPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Basic/IconPage.razor index 65c66181..96b001a5 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Basic/IconPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Basic/IconPage.razor @@ -1,8 +1,6 @@ @page "/components/icon" - - - Icon 作为UI构成中重要的元素,一定程度上影响UI界面整体呈现出的风格。 - + + 使用枚举 IconName 可以获取目前已有的图标名称,或使用字符串自定义图标名称。图标预览看这里 https://tdesign.tencent.com/vue/components/icon @@ -31,6 +29,29 @@ ") -
- -
\ No newline at end of file + + +

图标枚举

+ +
    + @foreach ( var item in typeof(IconName).GetFields().Skip(1) ) + { +
  • + +
    +
    + + @item.Name + +
  • + } +
+ +@using System.Reflection + +@code{ + string GetIcon(FieldInfo item) + { + return $"t-icon-{item.GetCustomAttribute()?.CSS ?? item.Name.ToLower()}"; + } +} \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Basic/LinkPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Basic/LinkPage.razor index 4e1396b5..c881a258 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Basic/LinkPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Basic/LinkPage.razor @@ -1,8 +1,7 @@ @page "/components/link" - - - 文字超链接用于跳转一个新页面,如当前项目跳转,友情链接等。 - + + 最简单的文字链接形式,点击后直接跳转到对应链接。 @@ -182,6 +181,5 @@ ``` ") -
- -
\ No newline at end of file + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/AvatarPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/AvatarPage.razor index ee10c746..d8e283fa 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/AvatarPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/AvatarPage.razor @@ -1,15 +1,12 @@ @page "/components/avatar" - - - 用图标、图片、字符的形式展示用户或事物信息 - - + 头像提供了 3 种不同类型的头像:图标头像、图片头像、字符头像 - + @@ -22,7 +19,7 @@ @Code.Create(@" ```cshtml-razor - + @@ -75,14 +72,14 @@ 使用 TAvatarGroup 来组合内部的 TAvatar 组件。 - + W
- + W @@ -91,13 +88,13 @@ @Code.Create(@" ```cshtml-razor - + W - + W @@ -109,13 +106,13 @@ 设置 Left 则改变头像组的偏移方向 - + W
- + W @@ -124,19 +121,18 @@ @Code.Create(@" ```cshtml-razor - + W - + W ``` ")
-
- -
\ No newline at end of file + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/BadgePage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/BadgePage.razor index 469fb708..f102f829 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/BadgePage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/BadgePage.razor @@ -1,9 +1,5 @@ @page "/components/badge" - - - 出现在图标或文字右上角的徽标标识。 - - + @@ -164,6 +160,5 @@ ") -
- -
\ No newline at end of file + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/CardPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/CardPage.razor index 592d3105..58504269 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/CardPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/CardPage.razor @@ -1,6 +1,6 @@ @page "/components/card" - -最基础的卡片容器,可承载文字、列表、图片、段落,常用于后台概览页面。 + 仅有内容的卡片形式。 @@ -181,4 +181,4 @@
-
\ No newline at end of file + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/CollapsePage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/CollapsePage.razor index 96d935b0..a1555ec3 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/CollapsePage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/CollapsePage.razor @@ -1,18 +1,19 @@ @page "/components/collapse" - -可以将较多或较复杂的内容进行分组,分组内容区可以折叠展开或隐藏。 + + - + 基础折叠面板,可自定义面板内容。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -23,13 +24,13 @@ @Code.Create(@" ```cshtml-razor - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -43,13 +44,13 @@ 手风琴模式折叠面板,一次只能打开一个面板。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -60,13 +61,13 @@ @Code.Create(@" ```cshtml-razor - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -81,13 +82,13 @@ @Code.Create("设置 `RightIcon=\"true\"` 使图标显示在右边,设置 `RightIcon=\"default\"` 隐藏图标") - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -97,13 +98,13 @@

- + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -114,13 +115,13 @@ @Code.Create(@" ```cshtml-razor - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -129,13 +130,13 @@ - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -150,13 +151,13 @@ @Code.Create("设置 `IconToggle` 则只能点击图标才会响应折叠或展开") - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -167,13 +168,13 @@ @Code.Create(@" ```cshtml-razor - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -188,13 +189,13 @@ @Code.Create("设置 `Disabled` 禁用某个折叠面板") - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -205,13 +206,13 @@ @Code.Create(@" ```cshtml-razor - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -227,13 +228,13 @@ @Code.Create("设置 `Borderless` 清除边框") - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -244,13 +245,13 @@ @Code.Create(@" ```cshtml-razor - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 - + 这里是一个错误的内容! @@ -266,7 +267,7 @@ @Code.Create("设置 `OperationContent` 自定义右侧的操作内容,但是要显示地设置 `ChildContent` 设置显示的面板内容") - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 @@ -274,7 +275,7 @@ 操作 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 @@ -283,7 +284,7 @@ 操作 - + 这里是一个错误的内容! @@ -299,7 +300,7 @@ @Code.Create(@" ```cshtml-razor - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 @@ -307,7 +308,7 @@ 操作 - + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 @@ -315,7 +316,7 @@ 操作 - + 这里是一个错误的内容! @@ -377,13 +378,12 @@ - - - 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 -

请注意这个折叠面板

+ + 这部分是每个折叠面板折叠或展开的内容,可根据不同业务或用户的使用诉求,进行自定义填充。可以是纯文本、图文、子列表等内容形式。 +
@@ -399,8 +399,10 @@ ``` ") -
-
- - -
\ No newline at end of file + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/CommentPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/CommentPage.razor index ba878d96..2427b381 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/CommentPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/CommentPage.razor @@ -1,20 +1,18 @@ @page "/components/comment" - - - 评论用于对页面内容的反馈、评价、讨论等,如对文章的评价,对话题的讨论等。 - + 评论最基本的组件,包括头像、作者、时间、评论内容,适用于各种需要进行评论展示的场景。 - + 这里是评论者写的评论内容。 @Code.Create(@" ```cshtml-razor - + 这里是评论者写的评论内容。 ``` @@ -25,7 +23,7 @@ 可对评论内容进行相关操作的组件,适用于需要自定义操作列的场景。 - + 这里是评论者写的评论内容。 @@ -44,7 +42,7 @@ @Code.Create(@" ```cshtml-razor - + 这里是评论者写的评论内容。 @@ -69,7 +67,7 @@ - + 这里是评论者写的评论内容。 @@ -87,7 +85,7 @@ - + 这里是评论者写的评论内容。 @@ -105,7 +103,7 @@ - + 这里是评论者写的评论内容。 @@ -128,7 +126,7 @@ ```cshtml-razor - + 这里是评论者写的评论内容。 @@ -145,7 +143,7 @@ - + 这里是评论者写的评论内容。 @@ -162,7 +160,7 @@ - + 这里是评论者写的评论内容。 @@ -187,7 +185,7 @@ 展示一条评论的回复内容的组件,适用于对评论进行回复的场景,作者名称后可标明回复对象的名称。 - + 这里是评论者写的评论内容。 @@ -211,7 +209,7 @@ @Code.Create(@" ```cshtml-razor - + 这里是评论者写的评论内容。 @@ -239,7 +237,7 @@ 评论可以引用其他内容,表示评论和其他内容的引用关系。 - + 这里是评论者写的评论内容。 @@ -263,7 +261,7 @@ @Code.Create(@" ```cshtml-razor - + 这里是评论者写的评论内容。 @@ -287,6 +285,4 @@ ") -
- -
\ No newline at end of file + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/ImagePage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/ImagePage.razor index 44bf0622..abb628f1 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/ImagePage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/ImagePage.razor @@ -1,9 +1,6 @@ @page "/components/image" - - - 用于展示图片素材。 - - + @@ -367,7 +364,6 @@ ``` ") -
- -
+ + @inject IJSRuntime JS diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/ListPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/ListPage.razor index 57d19a39..e816b872 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/ListPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/ListPage.razor @@ -1,8 +1,8 @@ @page "/components/list" - - - 列表用一个连续的列来显示多行元素,常用于具有相同构成及内容的模块批量展示,可承载多样化的信息内容,从纯文字到复杂的图文组合。 - + + + @@ -188,21 +188,21 @@ - + 这里是标题 这里是文字描述 - + 这里是标题 这里是文字描述 - + 这里是标题 这里是文字描述 @@ -214,17 +214,17 @@ ```cshtml-razor - + 这里是标题 这里是文字描述 - + 这里是标题 这里是文字描述 - + 这里是标题 这里是文字描述 @@ -242,21 +242,21 @@ - + 这里是标题 这里是文字描述 - + 这里是标题 这里是文字描述 - + 这里是标题 这里是文字描述 @@ -272,17 +272,17 @@ 这里是底部内容 - + 这里是标题 这里是文字描述 - + 这里是标题 这里是文字描述 - + 这里是标题 这里是文字描述 @@ -364,6 +364,10 @@ ``` ") -
- -
\ No newline at end of file + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/LoadingPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/LoadingPage.razor index 9b91da80..5068d937 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/LoadingPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/LoadingPage.razor @@ -1,6 +1,7 @@ @page "/components/loading" - -在网络较慢或数据较多时,表示数据正在加载的状态。 + + 支持双向绑定 加载过程中只有图标显示。适用于打开页面或操作完成后模块内等待刷新的加载场景。 @@ -133,9 +134,8 @@ ``` ") -
- -
+ + @code{ bool IsLoading{ get; set; } diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/ProgressPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/ProgressPage.razor index 63b34d82..de82abb1 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/ProgressPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/ProgressPage.razor @@ -1,7 +1,5 @@ @page "/components/progress" - -展示操作的当前进度。 - + 以线形表示进度的组件,可以选择性地配有文字或图标补充显示进度和状态。多用于信息量较为丰富的情况。 @@ -151,6 +149,6 @@ ``` ") -
- -
\ No newline at end of file + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/SkeletonPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/SkeletonPage.razor index fca45ac1..0b851f82 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/SkeletonPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/SkeletonPage.razor @@ -1,9 +1,8 @@ @page "/components/skeleton" - - - 当网络较慢时,在页面真实数据加载之前,给用户展示出页面的大致结构。 - - + + 最简单的骨架屏效果。 @@ -148,8 +147,11 @@ ``` ") -
- - - -
\ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/TablePage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/TablePage.razor index 4c884153..10fc17a7 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/TablePage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/TablePage.razor @@ -1,9 +1,9 @@ @page "/components/table" - - - 表格常用于展示同类结构下的多种数据,易于组织、对比和分析等,并可对数据进行搜索、筛选、排序等操作。一般包括表头、数据行和表尾三部分。 - + + 简单表格,使用边框线、斑马纹等清晰呈现各数据单元格边界线,辅助信息区隔。 @@ -780,11 +780,13 @@ async Task RowSelected(TTableRowItemEventArgs e) -
- - - - - -
+ + + + + + + + + diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/TagPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/TagPage.razor index 3de0b066..3b5c530f 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/TagPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/TagPage.razor @@ -1,5 +1,8 @@ @page "/components/tag" - + 标签常用于标记、分类和选择。 @@ -63,12 +66,12 @@ 设置 TIcon 图标名称会在前面加图标。 - 默认标签 + 默认标签 @Code.Create(@" ```cshtml-razor -默认标签 +默认标签 ``` ") @@ -166,9 +169,8 @@ ``` ") -
- -
+ + @inject IJSRuntime JS @code{ bool Checked1; diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/TimelinePage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/TimelinePage.razor index b7475e80..362e6a3f 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/TimelinePage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/TimelinePage.razor @@ -1,8 +1,9 @@ @page "/components/timeline" - - - 用于时间轴展示 - + + + @@ -142,7 +143,10 @@ ``` ") -
- - -
\ No newline at end of file + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Data/TooltipPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Data/TooltipPage.razor index f97238f6..244c71dd 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Data/TooltipPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Data/TooltipPage.razor @@ -1,6 +1,9 @@ @page "/components/tooltip" - + 用于文字提示的气泡框。 @@ -298,7 +301,4 @@ @code{ string Text{ get; set; } } -
- - -
\ No newline at end of file + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/FormPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/FormPage.razor index 22ef5ebd..18d74d9f 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/FormPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/FormPage.razor @@ -1,9 +1,7 @@ @page "/components/form" - - - 用以收集、校验和提交数据,一般由输入框、单选框、复选框、选择器等控件组成。 - - + + @@ -258,11 +256,13 @@ ``` ") - -
- - -
+ + + + + + + @using System.ComponentModel.DataAnnotations @using Microsoft.AspNetCore.Components.Forms @code{ diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputAdornmentPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputAdornmentPage.razor index 299a493e..263701ca 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputAdornmentPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputAdornmentPage.razor @@ -1,9 +1,6 @@ @page "/components/inputadornment" - - - 用于装饰输入类组件的装饰器 - - + 在输入框前后加入一些特定的纯展示标签,通常在需要提高辨识效率时使用。 @@ -121,9 +118,8 @@ ``` ") -
- + @code{ string Text{ get; set; } } -
\ No newline at end of file + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputCheckboxPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputCheckboxPage.razor index 4cf3ec77..be11cf66 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputCheckboxPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputCheckboxPage.razor @@ -1,5 +1,5 @@ @page "/components/checkbox" - + 多选框是一个选择控件,允许用户通过单击在选中和未选中之间切换。 @@ -24,9 +24,8 @@ ``` ") -
- -
+ + @code{ bool? DemoChecked{ get; set; } bool? IndeterminateCheck{ get; set; } diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputNumberPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputNumberPage.razor index dcf7dda1..549c71f9 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputNumberPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputNumberPage.razor @@ -1,5 +1,7 @@ @page "/components/inputnumber" - + 数字输入框由增加、减少按钮、数值输入组成。每次点击增加按钮(或减少按钮),数字增长(或减少)的量是恒定的。 @@ -223,5 +225,5 @@ ``` ") -
-
\ No newline at end of file + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputRadioPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputRadioPage.razor index 2c689443..4161a404 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputRadioPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputRadioPage.razor @@ -1,8 +1,8 @@ @page "/components/radio" - - - 单选框代表从一组互斥的选项中仅选择一个选项。 - + + + @@ -258,7 +258,10 @@ ``` ") -
- - -
\ No newline at end of file + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputRangePage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputRangePage.razor index 86b179b1..9e180171 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputRangePage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputRangePage.razor @@ -1,8 +1,6 @@ @page "/components/inputrange" - - - 用于输入范围文本。 - + 为了使组件命名标准化,输入组件以 Input 开头,因此该组件的命名规范将与官方不同。 @@ -61,6 +59,5 @@ string End{ get;set; } ``` ") -
- -
\ No newline at end of file + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTagPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTagPage.razor index 4fdbd4a9..3cb32a0e 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTagPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTagPage.razor @@ -1,6 +1,7 @@ @page "/components/inputtag" - + 用于输入文本标签。 @@ -105,9 +106,7 @@ IEnumerable LimitTags { get; set; } = Enumerable.Empty(); ") -
- -
+ @code{ IEnumerable BasicTags { get; set; } = Enumerable.Empty(); IEnumerable LimitTags { get; set; } = Enumerable.Empty(); diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTextAreaPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTextAreaPage.razor index d81c8001..f16ee4cf 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTextAreaPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTextAreaPage.razor @@ -1,9 +1,7 @@ @page "/components/textarea" - - - 用于承载用户多行信息录入的组件,常用于描述信息、反馈表单中意见等需要一段相当长文本的场景。可以设置最大文案长度。 - - + @@ -49,7 +47,7 @@
-
+ @code{ string ReadonlyText{ get; set; } string DisabledText{ get; set; } diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTextPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTextPage.razor index 2519ab9a..5db4d973 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTextPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/InputTextPage.razor @@ -1,8 +1,7 @@ @page "/components/input" - - - 用于承载用户信息录入的文本框,常用于表单、对话框等场景,对不同内容的信息录入,可拓展形成多种信息录入形式。 - + @@ -250,6 +249,5 @@ string PrefixText{ get; set; } ``` ") -
- -
\ No newline at end of file + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/SelectPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/SelectPage.razor index 0b42e842..256fdedb 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/SelectPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/SelectPage.razor @@ -2,7 +2,9 @@ 用于收纳大量选项的信息录入类组件。 - + + @@ -168,9 +170,11 @@ ``` ") - -
- - - -
\ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/SwitchPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/SwitchPage.razor index c04f1fe8..ec6d4176 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/SwitchPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/SwitchPage.razor @@ -1,8 +1,6 @@ @page "/components/switch" - - - 用于两个互斥选项,用来打开或关闭选项的选择控件。 - + 不带描述,最基础的开关。 @@ -124,7 +122,7 @@ bool sizeValue3 { get; set; }
-
+ @code { bool sizeValue1 { get; set; } = true; bool sizeValue2 { get; set; } diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Input/UploadPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Input/UploadPage.razor index 802758a6..3a0a643b 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Input/UploadPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Input/UploadPage.razor @@ -1,10 +1,9 @@ @page "/components/upload" - - - 上传组件允许用户传输文件或提交自己的内容。 - + + 文件上传需要服务端的配合,文档仅提供了 WEB API 的部分代码示例。 @@ -125,9 +124,7 @@ public class UploadController : ControllerBase ") -
- -
+ @code{ void HandleSuccess(UploadFileInfo file) { diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Layout/DividerPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Layout/DividerPage.razor index 42332715..742d53a8 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Layout/DividerPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Layout/DividerPage.razor @@ -1,8 +1,6 @@ @page "/components/divider" - - - 分割线是一个呈线状的轻量化组件,起到分割、组织、细化的作用,用于有逻辑的组织元素内容和页面结构。 - + 水平分割线常用来对不同元素内容进行分割。 @@ -95,6 +93,5 @@ ``` ") -
- -
\ No newline at end of file + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Layout/GridPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Layout/GridPage.razor index faf4b8ee..d1071726 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Layout/GridPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Layout/GridPage.razor @@ -1,8 +1,7 @@ @page "/components/grid" - - - 栅格是以规则的网格阵列来指导和规范网页中的版面布局以及信息分布,提高界面内布局的一致性,节约成本。 - + + @@ -423,7 +422,11 @@ ``` ") -
- - -
\ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Layout/LayoutPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Layout/LayoutPage.razor index a418c5df..5a25d5b5 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Layout/LayoutPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Layout/LayoutPage.razor @@ -1,6 +1,6 @@ @page "/components/layout" - -用于组织网页的框架结构。 + @@ -59,6 +59,4 @@ ") -
- -
\ No newline at end of file + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Layout/SpacePage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Layout/SpacePage.razor index 05836449..b9015cc2 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Layout/SpacePage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Layout/SpacePage.razor @@ -1,8 +1,7 @@ @page "/components/space" - - - 控制组件之间的间距。 - + + 默认为横向排列,控制相邻组件水平间距 @@ -182,7 +181,10 @@ ``` ") -
- - -
\ No newline at end of file + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/AffixPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/AffixPage.razor index 498fea7e..ae4635d7 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/AffixPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/AffixPage.razor @@ -1,10 +1,6 @@ @page "/components/affix" - + - - - 在指定的范围内,将元素固定不动。 - @@ -105,6 +101,4 @@ } bool Affixed { get; set; } } -
- -
\ No newline at end of file + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/AnchorPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/AnchorPage.razor index 02bb3c75..b82d81a1 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/AnchorPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/AnchorPage.razor @@ -2,10 +2,9 @@ @inject NavigationManager navigationManager - - - 页面内的超级链接,用于跳转到页面内指定位置。 - + + @@ -88,8 +87,10 @@ ``` ") - -
- - -
\ No newline at end of file + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/BreadcrumbPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/BreadcrumbPage.razor index 2cfb3285..f0abafbf 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/BreadcrumbPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/BreadcrumbPage.razor @@ -1,8 +1,9 @@ @page "/components/breadcrumb" - - - 显示当前页面在系统层级结构的位置,并能返回之前任意层级的页面。 - + + + 适用于广泛的基础用法,系统拥有超过两级以上的层级结构,用于切换向上任意层级的内容。 @@ -119,8 +120,12 @@ ``` ") -
- - -
+ + + + + + + + @inject IJSRuntime JS \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/DropdownPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/DropdownPage.razor index c8e51ddd..40ecc387 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/DropdownPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/DropdownPage.razor @@ -1,11 +1,10 @@ @page "/components/dropdown" - - 用于承载过多的操作集合,通过下拉拓展的形式,收纳更多的操作。 - + + - 使用 DropdownOption 定义菜单的项。 @@ -290,10 +289,7 @@ ") - -
- -
+
@code { IEnumerable DemoOptions = new List { diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/MenuPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/MenuPage.razor index 7cc4fd57..864ab24d 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/MenuPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/MenuPage.razor @@ -1,5 +1,8 @@ @page "/components/menu" - + + + 用于承载网站的架构,并提供跳转的菜单列表。 @@ -380,7 +383,12 @@ ``` ") -
- - -
\ No newline at end of file + + + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/PaginationPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/PaginationPage.razor index 7744fcb4..d033a0c8 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/PaginationPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/PaginationPage.razor @@ -1,8 +1,6 @@ @page "/components/pagination" - - - 用于模块内切换内容的控件。 - +

基础分页

@@ -143,6 +141,5 @@ ``` ") -
- -
\ No newline at end of file + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/StepPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/StepPage.razor index fe236fe9..787a8504 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/StepPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/StepPage.razor @@ -1,8 +1,7 @@ @page "/components/step" - - - 提示用户进度以及当前的步骤,用于引导用户按照步骤完成任务的导航条。 - + + 适用于步骤数较多时,让用户更明确的了解步骤数量。 @@ -96,23 +95,23 @@ - 设置 TIcon 图标名称即可。 + 设置 Icon 图标名称即可。 - 登录 - 购物车 - 支付订单 - 完成 + 登录 + 购物车 + 支付订单 + 完成 @Code.Create(@" ```cshtml-razor - 登录 - 购物车 - 支付订单 - 完成 + 登录 + 购物车 + 支付订单 + 完成 ``` ") @@ -123,10 +122,10 @@ 状态是 Error 会呈现错误的图标 - 登录 - 购物车 - 支付订单 - 完成 + 登录 + 购物车 + 支付订单 + 完成
@@ -140,10 +139,10 @@ @Code.Create(@" ```cshtml-razor - 登录 - 购物车 - 支付订单 - 完成 + 登录 + 购物车 + 支付订单 + 完成 ``` ") @@ -205,7 +204,10 @@ ``` ")
-
- - -
\ No newline at end of file + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/TabPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/TabPage.razor index fa6ebbda..fa669d5e 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Navigation/TabPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Navigation/TabPage.razor @@ -1,8 +1,8 @@ @page "/components/tab" - - - 用于承载同一层级下不同页面或类别的组件,方便用户在同一个页面框架下进行快速切换。 - + + + 使用选项卡切换内容模块,操作后不会进行页面跳转。 @@ -29,9 +29,9 @@ 在基础选项卡基础上,在每个标签前添加图标,方便用户快速理解。 - 首页的内容 - 日程的内容 - 事项的内容 + 首页的内容 + 日程的内容 + 事项的内容 @@ -135,7 +135,10 @@ ``` ") -
- - -
\ No newline at end of file + + + + + + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Notification/AlertPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Notification/AlertPage.razor index c7b303a7..92e3d593 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Notification/AlertPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Notification/AlertPage.razor @@ -1,10 +1,6 @@ @page "/components/alert" - - - - - 警告条用于承载需要用户注意的信息。 - + 使用简洁文字提示的最基础警告条,包含 4 种情况的提示:普通消息,成功,警示,失败。 @@ -136,6 +132,4 @@ ") -
- -
\ No newline at end of file + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Notification/DialogPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Notification/DialogPage.razor index 943f80bb..22b76c2c 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Notification/DialogPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Notification/DialogPage.razor @@ -1,10 +1,10 @@ @page "/components/dialog" - - - 对话框是一种临时窗口,通常在不想中断整体任务流程,但又需要为用户展示信息或获得用户响应时,在页面中打开一个对话框承载相应的信息及操作。 - + + - IDialogService 唤醒出对话框,并支持自定义对话框模板 + 注入 IDialogService 唤醒出对话框,并支持自定义对话框模板 @@ -192,9 +192,7 @@ async Task GetResult() ") -
- -
+ @inject IDialogService DialogService diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Notification/MessagePage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Notification/MessagePage.razor index 30bc3851..7f7ecda9 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Notification/MessagePage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Notification/MessagePage.razor @@ -1,8 +1,6 @@ @page "/components/message" - - - 对用户的操作作出轻量的全局反馈。 - + 使用简洁文字描述操作反馈。常规全局提示包含:普通信息、成功信息、警示信息、错误信息、帮助信息和加载中。 @@ -83,7 +81,6 @@ MessageService.Question(...) ``` ") -
- -
+ + @inject IMessageService MessageService \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Notification/NotificationPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Notification/NotificationPage.razor index 2448b13d..b61a24e5 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Notification/NotificationPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Notification/NotificationPage.razor @@ -1,8 +1,6 @@ @page "/components/notification" - - - 轻量级的全局消息提示和确认机制,出现和消失时需要有缓动动画。 - + @@ -144,7 +142,6 @@ NotificationService.Warning(...) ``` ") -
- -
+ + @inject INotificationService NotificationService \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Notification/PopConfirmPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Notification/PopConfirmPage.razor index e567d05d..9c8c43ad 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Notification/PopConfirmPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Notification/PopConfirmPage.razor @@ -1,6 +1,7 @@ @page "/components/popconfirm" - + 气泡确认框通常用于不会造成严重后果的二次确认场景,其会在点击元素上弹出浮层进行提示确认。气泡确认框没有蒙层,点击确认框以外的区域即可关闭。 @@ -197,10 +198,7 @@ code{ ") -
- - -
+ @inject IJSRuntime JS diff --git a/doc/TDesign.Docs.Shared/Pages/Components/Notification/PopupPage.razor b/doc/TDesign.Docs.Shared/Pages/Components/Notification/PopupPage.razor index 15d686bd..e340e538 100644 --- a/doc/TDesign.Docs.Shared/Pages/Components/Notification/PopupPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Components/Notification/PopupPage.razor @@ -1,5 +1,7 @@ @page "/components/popup" - + 弹出层组件是其他弹窗类组件如气泡确认框实现的基础,当这些组件提供的能力不能满足定制需求时,可以在弹出层组件基础上封装。 @@ -272,5 +274,5 @@ ``` ") -
-
\ No newline at end of file + + \ No newline at end of file diff --git a/doc/TDesign.Docs.Shared/Pages/Startup/DesignPage.razor b/doc/TDesign.Docs.Shared/Pages/Startup/DesignPage.razor index a3acd684..abdeaefb 100644 --- a/doc/TDesign.Docs.Shared/Pages/Startup/DesignPage.razor +++ b/doc/TDesign.Docs.Shared/Pages/Startup/DesignPage.razor @@ -4,6 +4,11 @@ 定义组件通用的命名规范 +

组件规范

+@Code.Create(@" +为了防止用户在项目中与其他组件库重名(虽然可能性很小),我们的所有组件都会有一个“T”前缀,例如按钮是 `
+ + + 应用于参数,用于自动生成 API 文档。 + + + + + + + 描述。 + + + + 参数的数据类型。 + + + + + 注释。 + + + + + 必填项。 + + + + + 默认值。 + + + + + 方法可被 api 文档识别。 + + + + + For document only. + + + + + 获取指定组件的 api 文档。 + + 组件。 + + 锚点 @@ -173,7 +221,7 @@ - 点击事件 + 点击锚点的回调方法 @@ -235,11 +283,6 @@ 头像的尺寸。 - - - 头像显示的自定义内容。 - - 表示头像组的容器。 @@ -305,17 +348,12 @@ 表示具备折叠面板的组容器,并使用 展现折叠面板的项。 - - - - - 仅点击图标才可以触发展开或折叠的响应。 - + 设置 true 图标处于标题的右边,null 不用图标,false 图标处于标题左边。 @@ -335,27 +373,17 @@ 表示作为折叠面板的内容。必须放在 组件中。 - - - 初始化 类的新实例。 - - 级联 组件。 - - - - - 设置标题部分的内容。 - + 设置标题字符串。若设置了 属性的值,则该属性无效。 @@ -365,7 +393,7 @@ 右侧操作的内容。 - + true 表示面板是展开状态,否则为折叠状态。 @@ -974,9 +1002,6 @@ 对齐方式。 - - - @@ -1270,6 +1295,11 @@ 表示提示的对齐方式。 + + + 占位字符串。 + + 重写以构建组件的内容。 @@ -1518,7 +1548,7 @@ - 设置大小。 + 尺寸。 @@ -1747,46 +1777,6 @@ - - - 上传组件显示的风格样式。 - - - - - 默认的文件上传风格。 - - - - - 输入框形式的文件上传风格。 - - - - - 上传状态。 - - - - - 未开始。 - - - - - 等待上传。 - - - - - 正在上传。 - - - - - 上传结束。 - - 上传组件允许用户传输文件或提交自己的内容。 @@ -1821,7 +1811,7 @@ - 设置服务端上传的 API 地址。要求 API 可以通过 POST 方式接收请求,并支持 FORM DATA 数据传输方式。 + 设置服务端上传的 API 地址。要求 API 支持 FORM DATA 数据传输方式。 @@ -1899,7 +1889,7 @@ - 附带的 Header + 附带的 Header 字典 @@ -1972,7 +1962,7 @@ - 当已经选择了上传的文件。 + 选择上传的文件。 选择的文件列表。 @@ -2011,6 +2001,46 @@ 文件id。 + + + 上传组件显示的风格样式。 + + + + + 默认的文件上传风格。 + + + + + 输入框形式的文件上传风格。 + + + + + 上传状态。 + + + + + 未开始。 + + + + + 等待上传。 + + + + + 正在上传。 + + + + + 上传结束。 + + 要上传的文件信息。 @@ -2219,11 +2249,6 @@ 表示一个列表容器。配合 组件使用。 - - - - - 列表的尺寸。默认是 。 @@ -2479,7 +2504,7 @@ 显示下级菜单的当前菜单标题。 - + 图标名称。 @@ -3066,7 +3091,7 @@ - 设置弹出层是否具备箭头指向。 + 设置是否具备箭头指向。 @@ -3181,7 +3206,7 @@ - 设置为垂直排列。 + 是否为垂直排列。 @@ -3244,7 +3269,7 @@ - + 设置图标名称。默认自动计算当前步骤所在的数字。 @@ -3431,7 +3456,7 @@ - + 表格的内容。 @@ -3709,9 +3734,6 @@ 设置字段输出的格式。要符合 的定义。 - - - @@ -3744,11 +3766,6 @@ 选项卡 - - - - - 选项卡标题呈现的位置。 @@ -3766,7 +3783,7 @@ - + 当选项卡切换时触发的回调。 @@ -3813,14 +3830,9 @@ 选项卡标题。 - - - - - - 选项卡内容的内边距,默认时 25px。 + 选项卡内容的内边距,默认 25px。 @@ -3828,7 +3840,7 @@ 禁用选项卡。 - + 选项卡标题的图标。 @@ -3972,11 +3984,6 @@ 徽章组件,出现在图标或文字右上角的徽标标识。 - - - - - 徽章显示的文本。 @@ -4335,11 +4342,6 @@ 卡片组件。 - - - - - 设置不显示边框。 @@ -4416,11 +4418,6 @@ 设置显示的日期时间字符串。 - - - 设置评论的任意内容。 - - 设置评论的操作内容。每一个操作需要用 li 标记进行渲染。 @@ -4450,14 +4447,6 @@ - - - 用于动态渲染组件的容器。 - - - - - 分割线。 @@ -4470,7 +4459,7 @@ - 垂直分割线。 + 是否垂直分割线。 @@ -4521,27 +4510,27 @@ - 图片描述 + 图片描述。 - 禁用状态 + 禁用状态。 - 错误内容 + 自定义图片加载失败状态下的显示内容。 - 填充模式 + 图片填充模式。 - 是否展示为图集样式 + 是否展示为图集样式。 @@ -4566,17 +4555,17 @@ - 占位元素 + 占位元素。 - 定位 + 定位。 - 图片圆角类型 + 图片圆角类型。 @@ -4584,16 +4573,6 @@ 图片链接 - - - 加载失败 - - - - - 加载完成 - - 填充模式 @@ -4664,9 +4643,6 @@ 时间轴组件的容器,用于时间轴展示。配合 组件使用。 - - - 设置水平显示。 @@ -4766,9 +4742,6 @@ 自定义图标的名称。 - - - @@ -4817,12 +4790,12 @@ - 尺寸。 + 文字尺寸。 - 颜色。 + 文字颜色。 @@ -4927,12 +4900,12 @@ - 设置当页码数量超出时,前后省略模式。 + 设置当页码数量超出时,页码条前后省略模式。 - 设置是否显示跳转到文本框。 + 设置是否显示【跳转到】文本框。 @@ -5028,7 +5001,6 @@ 构建 跳转到 文本框。 - @@ -5414,11 +5386,6 @@ 标签。 - - - - - 主题颜色。 @@ -5439,7 +5406,7 @@ 形状。 - + 图标的名称。 @@ -5451,7 +5418,7 @@ - 设置组件处于禁用状态。 + 禁用状态。 @@ -6054,6 +6021,14 @@ The info. The context. + + + 用于动态渲染组件的容器。 + + + + + TDesign 的扩展。 diff --git a/src/TDesign/ApiDoc.cs b/src/TDesign/ApiDoc.cs new file mode 100644 index 00000000..8d819d99 --- /dev/null +++ b/src/TDesign/ApiDoc.cs @@ -0,0 +1,123 @@ +using System.Reflection; +using System.Text; + +namespace TDesign; + +/// +/// 应用于参数,用于自动生成 API 文档。 +/// +[AttributeUsage(AttributeTargets.Property)] +internal class ParameterApiDocAttribute : Attribute +{ + /// + /// + /// + /// 描述。 + public ParameterApiDocAttribute(string? comment) + { + Comment = comment; + } + /// + /// 参数的数据类型。 + /// + public string? Type { get; set; } + /// + /// 注释。 + /// + public string? Comment { get; } + /// + /// 必填项。 + /// + public bool Required { get; set; } + /// + /// 默认值。 + /// + public object? Value { get; set; } +} + +/// +/// 方法可被 api 文档识别。 +/// +[AttributeUsage(AttributeTargets.Method)] +internal class MethodApiDocAttribute : Attribute +{ + public MethodApiDocAttribute(string comment) + { + Comment = comment; + } + + public string Comment { get; } + + public string? ReturnType { get; set; } + public string? Parameters { get; set; } +} + +/// +/// For document only. +/// +public class ApiDoc +{ + /// + /// 获取指定组件的 api 文档。 + /// + /// 组件。 + /// + public static List<(string name, string type, bool requried, object? defaultValue, string? comment)> GetParameterApiDoc(Type componentType) + { + var list = new List<(string name, string type, bool requried, object? defaultValue, string? comment)>(); + + foreach ( var parameter in componentType.GetProperties().Where(m => m.IsDefined(typeof(ParameterApiDocAttribute), false)).OrderBy(m => m.Name) ) + { + var name = parameter.Name; + var attr = parameter.GetCustomAttribute()!; + + var type = attr.Type ?? parameter.PropertyType.Name; + var required = parameter.GetCustomAttribute() is not null || attr.Required; + var value = attr.Value; + if ( attr.Value is null ) + { + if ( type == typeof(Boolean).Name ) + { + value = value is null ? "false" : (bool?)value; + } + } + + if ( Nullable.GetUnderlyingType(parameter.PropertyType) is not null ) + { + type = $"Nullable<{Nullable.GetUnderlyingType(parameter.PropertyType).Name}>"; + } + + var comment = attr.Comment; + list.Add((name, type, required, value, comment)); + } + + return list; + } + + public static List<(string name,string? comment, string returnType, string parameters)> GetMethodApiDoc(Type componentType) + { + List<(string name, string? comment, string returnType, string parameters)> list = new(); + + foreach(var method in componentType.GetMethods(BindingFlags.Public|BindingFlags.Instance).Where(m=>m.IsDefined(typeof(MethodApiDocAttribute),false)).OrderBy(m=>m.Name)) + { + var attr= method.GetCustomAttribute(); + + var name = method.Name; + var returnType= attr.ReturnType?? method.ReturnType.Name; + var parameterList = new List(); + foreach ( var item in method.GetParameters() ) + { + parameterList.Add($"{item.ParameterType.Name} {item.Name}"); + if ( item.HasDefaultValue ) + { + parameterList.Add($" = {item.DefaultValue}"); + } + } + + var parameterString = string.Join(", ", parameterList); + + list.Add((name, attr.Comment, returnType, parameterString)); + } + return list; + } +} diff --git a/src/TDesign/Components/Anchor/TAnchor.cs b/src/TDesign/Components/Anchor/TAnchor.cs index 4299c66c..3c11eb3a 100644 --- a/src/TDesign/Components/Anchor/TAnchor.cs +++ b/src/TDesign/Components/Anchor/TAnchor.cs @@ -19,6 +19,7 @@ public class TAnchor : TDesignAdditionParameterWithChildContentComponentBase, IH /// /// 获取或设置锚点关联滚动容器 /// + [ParameterApiDoc("锚点关联滚动容器 id")] [Parameter][HtmlAttribute] public string? Container { get; set; } /// diff --git a/src/TDesign/Components/Anchor/TAnchorItem.cs b/src/TDesign/Components/Anchor/TAnchorItem.cs index b82f033f..ec35c4ab 100644 --- a/src/TDesign/Components/Anchor/TAnchorItem.cs +++ b/src/TDesign/Components/Anchor/TAnchorItem.cs @@ -46,6 +46,7 @@ public class TAnchorItem :TDesignAdditionParameterWithChildContentComponentBase, /// /// 获取或设置选中状态 /// + [ParameterApiDoc("选中状态")] [Parameter] public bool Active { get; set; } /// @@ -57,6 +58,7 @@ public class TAnchorItem :TDesignAdditionParameterWithChildContentComponentBase, /// 锚点 /// [Parameter] + [ParameterApiDoc("锚点")] public string? Href { get @@ -80,26 +82,31 @@ public string? Href /// /// 获取或设置偏移的高度 /// - public int OffsetHeight { get; set; } + [ParameterApiDoc("偏移的高度")] + [Parameter]public int OffsetHeight { get; set; } /// /// 获取或设置顶部偏移 /// - public int OffsetTop { get; set; } + [ParameterApiDoc("距离顶部的偏移像素")] + [Parameter] public int OffsetTop { get; set; } /// - /// 点击事件 + /// 点击锚点的回调方法 /// - [Parameter][HtmlAttribute("onclick")] public EventCallback OnClick { get; set; } + [ParameterApiDoc("点击锚点的回调方法")] + [Parameter][HtmlAttribute("onclick")] public EventCallback OnClick { get; set; } /// /// 锚点文字 /// + [ParameterApiDoc("锚点文字")] [Parameter] public AnchorItemTarget? Target { get; set; } = AnchorItemTarget.Self; /// /// 标题 /// + [ParameterApiDoc("标题")] [Parameter] public string? Title { get; set; } internal int Index { get; private set; } diff --git a/src/TDesign/Components/Avatar/TAvatar.cs b/src/TDesign/Components/Avatar/TAvatar.cs index f89dea94..869990c3 100644 --- a/src/TDesign/Components/Avatar/TAvatar.cs +++ b/src/TDesign/Components/Avatar/TAvatar.cs @@ -6,29 +6,29 @@ namespace TDesign; /// [CssClass("t-avatar")] [ChildComponent(typeof(TAvatarGroup), Optional = true)] -public class TAvatar : TDesignComponentBase, IHasChildContent +public class TAvatar : TDesignAdditionParameterWithChildContentComponentBase { [CascadingParameter] public TAvatarGroup? CascadingAvatarGroup { get; set; } /// /// 头像形状。 /// + [ParameterApiDoc("头像形状", Value =$"{nameof(Shape.Circle)}")] [Parameter][CssClass("t-avatar--")] public Shape? Shape { get; set; } = Shape.Circle; /// /// 设置头像的图片地址。 /// + [ParameterApiDoc("头像的图片地址")] [Parameter] public string? Url { get; set; } /// /// 设置头像的字体名称。 /// + [ParameterApiDoc("头像的字体名称")] [Parameter] public object? Icon { get; set; } /// /// 头像的尺寸。 /// + [ParameterApiDoc("头像的尺寸")] [Parameter][CssClass] public Size? Size { get; set; } - /// - /// 头像显示的自定义内容。 - /// - [Parameter] public RenderFragment? ChildContent { get; set; } protected override void AddContent(RenderTreeBuilder builder, int sequence) { diff --git a/src/TDesign/Components/Breadcrumb/TBreadcrumb.cs b/src/TDesign/Components/Breadcrumb/TBreadcrumb.cs index 1f6e5dd0..d10f268f 100644 --- a/src/TDesign/Components/Breadcrumb/TBreadcrumb.cs +++ b/src/TDesign/Components/Breadcrumb/TBreadcrumb.cs @@ -5,10 +5,11 @@ /// [ParentComponent] [CssClass("t-breadcrumb")] -public class TBreadcrumb : TDesignComponentBase, IHasChildContent +public class TBreadcrumb : TDesignAdditionParameterWithChildContentComponentBase { /// /// /// - [Parameter] public RenderFragment? ChildContent { get; set; } + [ParameterApiDoc("装载 TBreadcrumbItem 组件")] + [Parameter] public override RenderFragment? ChildContent { get; set; } } diff --git a/src/TDesign/Components/Breadcrumb/TBreadcrumbItem.cs b/src/TDesign/Components/Breadcrumb/TBreadcrumbItem.cs index 35818b56..a2fe54c7 100644 --- a/src/TDesign/Components/Breadcrumb/TBreadcrumbItem.cs +++ b/src/TDesign/Components/Breadcrumb/TBreadcrumbItem.cs @@ -8,23 +8,27 @@ namespace TDesign; /// [CssClass("t-breadcrumb__item")] [ChildComponent(typeof(TBreadcrumb))] -public class TBreadcrumbItem : TDesignComponentBase, IHasChildContent +public class TBreadcrumbItem : TDesignAdditionParameterWithChildContentComponentBase { /// /// 分隔符内容。 /// + [ParameterApiDoc("分隔符内容")] [Parameter] public RenderFragment? SeperatorContent { get; set; } /// /// 导航的超链接。 /// + [ParameterApiDoc("导航的超链接")] [Parameter][HtmlAttribute("href")] public string? Link { get; set; } /// /// /// - [Parameter] public RenderFragment? ChildContent { get; set; } + [ParameterApiDoc("导航的任意内容")] + [Parameter] public override RenderFragment? ChildContent { get; set; } /// /// 禁用导航。 /// + [ParameterApiDoc("禁用导航")] [Parameter] public bool Disabled { get; set; } /// diff --git a/src/TDesign/Components/Collapse/TCollapse.cs b/src/TDesign/Components/Collapse/TCollapse.cs index cddc0510..dd5779eb 100644 --- a/src/TDesign/Components/Collapse/TCollapse.cs +++ b/src/TDesign/Components/Collapse/TCollapse.cs @@ -5,27 +5,27 @@ /// [CssClass("t-collapse")] [ParentComponent] -public class TCollapse : TDesignComponentBase, IHasChildContent +public class TCollapse : TDesignAdditionParameterWithChildContentComponentBase { - /// - /// - /// - [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 仅点击图标才可以触发展开或折叠的响应。 /// + [ParameterApiDoc("仅点击图标才可以触发展开或折叠的响应")] [Parameter] public bool IconToggle { get; set; } /// /// 设置 true 图标处于标题的右边,null 不用图标,false 图标处于标题左边。 /// - [Parameter] public bool? RightTIcon { get; set; } = false; + [ParameterApiDoc("设置 true 图标处于标题的右边,null 不用图标,false 图标处于标题左边。")] + [Parameter] public bool? RightIcon { get; set; } = false; /// /// 设置为无边框。 /// + [ParameterApiDoc("无边框")] [Parameter][CssClass("t--border-less")] public bool Borderless { get; set; } /// /// 设置为手风琴模式,即只能同时展开1个面板。 /// + [ParameterApiDoc("是否为手风琴模式,即只能同时展开1个面板")] [Parameter] public bool Mutex { get; set; } } diff --git a/src/TDesign/Components/Collapse/TCollapsePanel.cs b/src/TDesign/Components/Collapse/TCollapsePanel.cs index bcb13b3e..244bcd51 100644 --- a/src/TDesign/Components/Collapse/TCollapsePanel.cs +++ b/src/TDesign/Components/Collapse/TCollapsePanel.cs @@ -1,4 +1,5 @@ using Microsoft.AspNetCore.Components.Rendering; +using TDesign.Specifications; namespace TDesign; /// @@ -6,42 +7,36 @@ namespace TDesign; /// [CssClass("t-collapse-panel")] [ChildComponent(typeof(TCollapse))] -public class TCollapsePanel : TDesignComponentBase, IHasChildContent, IHasActive, IHasDisabled +public class TCollapsePanel : TDesignAdditionParameterWithChildContentComponentBase, IHasDisabled,IHasTitleFragment,IHasTitleText { - /// - /// 初始化 类的新实例。 - /// - public TCollapsePanel() - { - TitleContent ??= new(builder => builder.AddContent(0, Title)); - } /// /// 级联 组件。 /// [CascadingParameter] public TCollapse CascadingCollaspe { get; set; } /// - /// - /// - [Parameter] public RenderFragment? ChildContent { get; set; } - /// /// 设置标题部分的内容。 /// + [ParameterApiDoc("标题部分的内容")] [Parameter] public RenderFragment? TitleContent { get; set; } /// /// 设置标题字符串。若设置了 属性的值,则该属性无效。 /// - [Parameter] public string? Title { get; set; } + [ParameterApiDoc("标题字符串,若设置 TitleContent,则该值无效")] + [Parameter] public string? TitleText { get; set; } /// /// 右侧操作的内容。 /// + [ParameterApiDoc("右侧操作的内容")] [Parameter] public RenderFragment? OperationContent { get; set; } /// /// true 表示面板是展开状态,否则为折叠状态。 /// - [Parameter] public bool Active { get; set; } + [ParameterApiDoc("是否为展开状态")] + [Parameter] public bool Expaned { get; set; } /// /// true 表示禁用面板,否则为 false。 /// + [ParameterApiDoc("禁用状态")] [Parameter][CssClass("t-is-disabled")] public bool Disabled { get; set; } protected override void AddContent(RenderTreeBuilder builder, int sequence) @@ -51,7 +46,7 @@ protected override void AddContent(RenderTreeBuilder builder, int sequence) #region Header builder.CreateElement(0, "div", title => { - if (CascadingCollaspe.RightTIcon.HasValue && CascadingCollaspe.RightTIcon == false) + if (CascadingCollaspe.RightIcon.HasValue && CascadingCollaspe.RightIcon == false) { BuildTIcon(title, 0); } @@ -60,7 +55,7 @@ protected override void AddContent(RenderTreeBuilder builder, int sequence) builder.CreateElement(2, "div", attributes: new { @class = "t-collapse-panel__header--blank" }); - if (CascadingCollaspe.RightTIcon.HasValue && CascadingCollaspe.RightTIcon.Value) + if (CascadingCollaspe.RightIcon.HasValue && CascadingCollaspe.RightIcon.Value) { BuildTIcon(title, 3); } @@ -93,11 +88,11 @@ private void BuildTIcon(RenderTreeBuilder builder, int sequence) { builder.CreateComponent(sequence, attributes: new { - Name = !Active ? (CascadingCollaspe.RightTIcon.HasValue && CascadingCollaspe.RightTIcon.Value ? IconName.ChevronLeft : IconName.ChevronRight) : IconName.ChevronDown, + Name = !Expaned ? (CascadingCollaspe.RightIcon.HasValue && CascadingCollaspe.RightIcon.Value ? IconName.ChevronLeft : IconName.ChevronRight) : IconName.ChevronDown, AdditionalClass = HtmlHelper.Instance.Class() .Append("t-collapse-panel__icon") - .Append("t-collapse-panel__icon--left", CascadingCollaspe.RightTIcon.HasValue && !CascadingCollaspe.RightTIcon.Value) - .Append("t-collapse-panel__icon--right", CascadingCollaspe.RightTIcon.HasValue && CascadingCollaspe.RightTIcon.Value).ToString(), + .Append("t-collapse-panel__icon--left", CascadingCollaspe.RightIcon.HasValue && !CascadingCollaspe.RightIcon.Value) + .Append("t-collapse-panel__icon--right", CascadingCollaspe.RightIcon.HasValue && CascadingCollaspe.RightIcon.Value).ToString(), onclick = HtmlHelper.Instance.Callback().Create(this, () => { if (CascadingCollaspe.IconToggle) @@ -119,7 +114,7 @@ void BuildContent(RenderTreeBuilder builder, int sequence) @class = HtmlHelper.Instance.Class() .Append("t-collapse-panel__body"), style = HtmlHelper.Instance.Style() - .Append("display:none", !Active) + .Append("display:none", !Expaned) .Append("") }); } @@ -127,6 +122,7 @@ void BuildContent(RenderTreeBuilder builder, int sequence) /// /// 执行展开或折叠的操作。 /// + [MethodApiDoc("执行展开或折叠的操作")] public async Task Toggle() { if (Disabled) @@ -141,12 +137,12 @@ public async Task Toggle() var child = CascadingCollaspe.ChildComponents[i]; if (child is TCollapsePanel panel) { - panel.Active = false; + panel.Expaned = false; await panel.Refresh(); } } } - Active = !Active; + Expaned = !Expaned; await this.Refresh(); } } diff --git a/src/TDesign/Components/Dialog/TDialog.cs b/src/TDesign/Components/Dialog/TDialog.cs index dafc46ab..1a2e20ce 100644 --- a/src/TDesign/Components/Dialog/TDialog.cs +++ b/src/TDesign/Components/Dialog/TDialog.cs @@ -11,35 +11,43 @@ public class TDialog : ComponentBase /// /// 对话框消息的任意内容。 /// + [ParameterApiDoc("对话框消息的任意内容")] [Parameter]public RenderFragment? ChildContent { get; set; } /// /// 对话框标题的任意内容。 /// + [ParameterApiDoc("对话框标题的任意内容")] [Parameter]public RenderFragment? HeaderContent { get; set; } /// /// 对话框用于操作的任意内容。 /// + [ParameterApiDoc("对话框用于操作的任意内容")] [Parameter]public RenderFragment? FooterContent { get; set; } /// /// 设置标题的图标。 /// + [ParameterApiDoc("标题的图标")] [Parameter] public object? Icon { get; set; } /// /// 设置图标的主题。 /// + [ParameterApiDoc("图标的主题")] [Parameter] public Theme? IconTheme { get; set; } /// /// 是否显示 x 关闭图标。 /// + [ParameterApiDoc("是否显示 x 关闭图标", Value ="true")] [Parameter] public bool Closable { get; set; } = true; /// /// 设置非模态对话框。 /// + [ParameterApiDoc("非模态对话框")] [Parameter] public bool Modeless { get; set; } /// /// 设置屏幕居中显示。 /// + [ParameterApiDoc("屏幕居中显示")] [Parameter] public bool Center { get; set; } /// /// 阻止点击遮罩层关闭对话框功能。 diff --git a/src/TDesign/Components/Dropdown/TDropdown.cs b/src/TDesign/Components/Dropdown/TDropdown.cs index 50819690..ba29ee97 100644 --- a/src/TDesign/Components/Dropdown/TDropdown.cs +++ b/src/TDesign/Components/Dropdown/TDropdown.cs @@ -8,31 +8,37 @@ public class TDropdown : TDesignChildContentComponentBase /// /// 设置下拉菜单的选项集合。 /// + [ParameterApiDoc("下拉菜单的选项集合")] [Parameter][EditorRequired] public IEnumerable Options { get; set; } = Enumerable.Empty(); /// /// 触发下拉菜单的模式。默认是 模式。 /// + [ParameterApiDoc("触发下拉菜单的模式", Value ="Click")] [Parameter] public PopupTrigger Trigger { get; set; } = PopupTrigger.Click; /// /// 下拉菜单选项中文字的对齐方向。 /// + [ParameterApiDoc("下拉菜单选项中文字的对齐方向", Value = "Right")] [Parameter] public DropdownDirection Direction { get; set; } = DropdownDirection.Right; /// /// 下拉菜单层展开的方向。默认是 。 /// + [ParameterApiDoc("下拉菜单层展开的方向", Value = "Bottom")] [Parameter] public PopupPlacement Placement { get; set; } = PopupPlacement.Bottom; /// /// 下拉菜单项的最大高度。单位 px,默认 300。 /// + [ParameterApiDoc("下拉菜单项的最大高度。单位 px,默认 300", Value = "300")] [Parameter] public int Height { get; set; } = 300; /// /// 设置当菜单选项被点击选中后的回调方法。 /// + [ParameterApiDoc("当菜单选项被点击选中后的回调方法")] [Parameter]public EventCallback OnOptionSelected { get; set; } protected override void AddContent(RenderTreeBuilder builder, int sequence) @@ -104,6 +110,7 @@ void BuildOptions(RenderTreeBuilder builder,IEnumerable options) /// /// 要选中的选项。 /// 是 null。 + [MethodApiDoc("选中指定的菜单选项")] public Task SelectOption(DropdownOption option) { if ( option is null ) diff --git a/src/TDesign/Components/Forms/TDesignInputComonentBase.cs b/src/TDesign/Components/Forms/TDesignInputComonentBase.cs index 435607f3..c8efc879 100644 --- a/src/TDesign/Components/Forms/TDesignInputComonentBase.cs +++ b/src/TDesign/Components/Forms/TDesignInputComonentBase.cs @@ -7,48 +7,57 @@ namespace TDesign; /// 输入控件的基类。 /// /// 双向绑定值的类型。 -public abstract class TDesignInputComonentBase : TDesignComponentBase,IHasInputValue, IHasAdditionalClass +public abstract class TDesignInputComonentBase : TDesignAdditionParameterComponentBase,IHasInputValue { /// /// 设置只读模式。 /// + [ParameterApiDoc("只读模式")] [Parameter][HtmlAttribute] public bool Readonly { get; set; } /// /// 设置禁用状态。 /// + [ParameterApiDoc("禁用状态")] [Parameter][HtmlAttribute] public bool Disabled { get; set; } /// /// 自适应宽度。 /// + [ParameterApiDoc("自适应宽度")] [Parameter] public bool AutoWidth { get; set; } /// /// 尺寸。 /// + [ParameterApiDoc("尺寸",Value= "Medium")] [Parameter][CssClass] public Size Size { get; set; } = Size.Medium; /// /// 自动聚焦。 /// + [ParameterApiDoc("自动聚焦")] [Parameter][HtmlAttribute] public bool AutoFocus { get; set; } /// /// 状态。 /// + [ParameterApiDoc("状态", Value ="Default")] [Parameter][CssClass("t-is-")] public Status Status { get; set; } = Status.Default; /// /// 输入框提示的内容。 /// + [ParameterApiDoc("提示的内容")] [Parameter] public RenderFragment? TipContent { get; set; } /// /// 对齐方式。 /// + [ParameterApiDoc("对齐方式")] [Parameter] public HorizontalAlignment Alignment { get; set; } = HorizontalAlignment.Left; - /// - [Parameter] public string? AdditionalClass { get; set; } /// + [ParameterApiDoc("要绑定的值", Type="TValue?")] [Parameter]public TValue? Value { get; set; } /// + [ParameterApiDoc("更新绑定值的回调方法", Type = "EventCallback")] [Parameter]public EventCallback ValueChanged { get; set; } /// + [ParameterApiDoc("识别绑定值的表达式", Type = "Expression>?")] [Parameter] public Expression>? ValueExpression { get; set; } /// [CascadingParameter] public EditContext? CascadedEditContext { get; set; } diff --git a/src/TDesign/Components/Forms/TForm.cs b/src/TDesign/Components/Forms/TForm.cs index 1cd87b99..7b9739a1 100644 --- a/src/TDesign/Components/Forms/TForm.cs +++ b/src/TDesign/Components/Forms/TForm.cs @@ -7,30 +7,38 @@ namespace TDesign; /// [CssClass("t-form")] [ParentComponent] -public class TForm : TDesignComponentBase,IFormComponent +public class TForm : TDesignAdditionParameterComponentBase,IFormComponent { /// /// 设置作为行内布局。 /// + [ParameterApiDoc("整个表单都是行内布局")] [Parameter][CssClass("t-form-inline")] public bool Inline { get; set; } /// /// 表单的对齐方式。默认时 。 /// + [ParameterApiDoc("表单的对齐方式",Value = "Right")] [Parameter] public FormAlignment Alignment { get; set; } = FormAlignment.Right; /// + [ParameterApiDoc("指定表单的顶级模型对象。将为模型构造一个编辑上下文")] [Parameter]public object? Model { get; set; } /// + [ParameterApiDoc("提交表单时将调用的回调。如果使用此参数,则由您手动触发任何验证",Type= "EventCallback")] [Parameter] public EventCallback OnSubmit { get; set; } /// + [ParameterApiDoc("当表单验证成功时将调用回调函数", Type = "EventCallback")] [Parameter] public EventCallback OnValidSubmit { get; set; } /// + [ParameterApiDoc("当表单验证失败时将调用回调函数", Type = "EventCallback")] [Parameter] public EventCallback OnInvalidSubmit { get; set; } /// public EditContext? FixedEditContext { get; set; } /// + [ParameterApiDoc("用于验证表单的上下文")] [Parameter] public EditContext? EditContext { get; set; } /// + [ParameterApiDoc("表单的内容")] [Parameter] public RenderFragment? ChildContent { get; set; } } diff --git a/src/TDesign/Components/Forms/TFormItem.cs b/src/TDesign/Components/Forms/TFormItem.cs index 55216836..21f80280 100644 --- a/src/TDesign/Components/Forms/TFormItem.cs +++ b/src/TDesign/Components/Forms/TFormItem.cs @@ -11,7 +11,7 @@ namespace TDesign; /// [CssClass("t-form__item")] [ChildComponent(typeof(TForm))] -public class TFormItem : TDesignComponentBase, IHasChildContent +public class TFormItem : TDesignAdditionParameterComponentBase, IHasChildContent { /// /// 级联 组件的实例。 @@ -24,31 +24,38 @@ public class TFormItem : TDesignComponentBase, IHasChildContent /// /// /// + [ParameterApiDoc("表单行的内容")] [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 设置表单项显示的标签文本。 /// + [ParameterApiDoc("表单项显示的标签文本")] [Parameter] public string? Label { get; set; } /// /// 设置表单项文本的宽度,默认是 60px 。 /// + [ParameterApiDoc("表单项文本的宽度,默认是 60px", Value ="60px")] [Parameter] public string? LabelWidth { get; set; } = "60px"; /// /// 设置文本自动加上冒号。 /// + [ParameterApiDoc("标签文本自动加上冒号")] [Parameter] public bool LabelColon { get; set; } /// /// 设置必填时自动加上红色的 “*” 符号。 /// + [ParameterApiDoc("必填时自动加上红色的 “*” 符号,如果设置了 For 字段,则会自动检测该字段是否标记了 RequiredAttribute 并设置为 true")] [Parameter] public bool Required { get; set; } /// /// 帮助的提示文字。 /// + [ParameterApiDoc("帮助的提示文字")] [Parameter] public string? HelpText { get; set; } /// /// 设置一个委托,表示具备表单验证的字段。 /// + [ParameterApiDoc("具备表单验证的字段")] [Parameter] public Expression>? For { get; set; } /// diff --git a/src/TDesign/Components/Forms/TInputAdornment.cs b/src/TDesign/Components/Forms/TInputAdornment.cs index abe2527e..db6d7ba1 100644 --- a/src/TDesign/Components/Forms/TInputAdornment.cs +++ b/src/TDesign/Components/Forms/TInputAdornment.cs @@ -10,25 +10,30 @@ namespace TDesign; /// 用于装饰输入类组件的装饰器 /// [CssClass("t-input-adornment")] -public class TInputAdornment : BlazorComponentBase, IHasChildContent +public class TInputAdornment : TDesignAdditionParameterComponentBase, IHasChildContent { /// + [ParameterApiDoc("装饰器任意内容")] [Parameter]public RenderFragment? ChildContent { get; set; } /// /// 设置前面追加的文本。若设置了 参数,则该参数将被忽略。 /// + [ParameterApiDoc("前面追加的文本,若 PrependContent 则该参数将忽略")] [Parameter]public string? Prepend { get; set; } /// /// 设置前面追加的任意 UI 内容。 /// + [ParameterApiDoc("前面追加的任意 UI 内容")] [Parameter]public RenderFragment? PrependContent { get; set; } /// /// 设置后面追加的文本。若设置了 参数,则该参数将被忽略。 /// + [ParameterApiDoc("后面追加的文本,若 AppendContent 则该参数将忽略")] [Parameter]public string? Append { get; set; } /// /// 设置后面追加的任意 UI 内容。 /// + [ParameterApiDoc("后面追加的任意 UI 内容")] [Parameter]public RenderFragment? AppendContent { get; set; } /// diff --git a/src/TDesign/Components/Forms/TInputCheckBox.cs b/src/TDesign/Components/Forms/TInputCheckBox.cs index bcb24773..5a6e9bd2 100644 --- a/src/TDesign/Components/Forms/TInputCheckBox.cs +++ b/src/TDesign/Components/Forms/TInputCheckBox.cs @@ -12,10 +12,12 @@ public class TInputCheckBox : TDesignInputComonentBase, IHasChildContent /// /// /// + [ParameterApiDoc("复选框之后的任意内容")] [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 支持未确定状态。 /// + [ParameterApiDoc("是否支持未确定状态")] [Parameter] public bool Indeterminate { get; set; } diff --git a/src/TDesign/Components/Forms/TInputNumber.cs b/src/TDesign/Components/Forms/TInputNumber.cs index 2f2b3846..372f6093 100644 --- a/src/TDesign/Components/Forms/TInputNumber.cs +++ b/src/TDesign/Components/Forms/TInputNumber.cs @@ -1,9 +1,4 @@ -using ComponentBuilder; -using Microsoft.AspNetCore.Components.Rendering; -using System.Linq.Expressions; -using System.Runtime.Serialization; - -namespace TDesign; +namespace TDesign; /// /// 数字输入框由增加、减少按钮、数值输入组成。每次点击增加按钮(或减少按钮),数字增长(或减少)的量是恒定的。 /// @@ -37,41 +32,54 @@ public TInputNumber() /// /// 设置输入框的文本对齐方式。 /// + [ParameterApiDoc("输入框的文本对齐方式",Value="Center")] [Parameter] public HorizontalAlignment Align { get; set; } = HorizontalAlignment.Center; /// /// 设置每一次增减的跨度值。 /// + [ParameterApiDoc("每一次增减的跨度值",Value=1)] [Parameter] public TValue? Step { get; set; } = (TValue)Convert.ChangeType(1, typeof(TValue)); /// /// 设置输入的最大值限制。 /// + [ParameterApiDoc("输入的最大值限制", Value = int.MaxValue)] [Parameter] public TValue? Max { get; set; } = (TValue)Convert.ChangeType(int.MaxValue, typeof(TValue)); /// /// 设置输入的最小值限制。 /// + [ParameterApiDoc("输入的最小值限制", Value = int.MinValue)] [Parameter] public TValue? Min { get; set; } = (TValue)Convert.ChangeType(int.MinValue, typeof(TValue)); /// /// 设置排列形式和模式。 /// + [ParameterApiDoc("排列形式和模式", Value = "Row")] [Parameter][CssClass("t-input-number--")] public InputNumberTheme Theme { get; set; } = InputNumberTheme.Row; /// /// 设置输入框后缀显示的文本。 /// + [ParameterApiDoc("输入框后缀显示的文本")] [Parameter] public string? SuffixText { get; set; } /// /// 设置输入框前面显示的文本。 /// + [ParameterApiDoc("输入框前面显示的文本")] [Parameter] public string? PrefixText { get; set; } /// /// 设置输入框出现的提示的文本。 /// + [ParameterApiDoc("输入框出现的提示的文本")] [Parameter] public string? Tip { get; set; } /// /// 表示提示的对齐方式。 /// + [ParameterApiDoc("提示的对齐方式",Value= "Input")] [Parameter] public TipAlign? TipAlign { get; set; } = TDesign.TipAlign.Input; + /// + /// 占位字符串。 + /// + [ParameterApiDoc("占位字符串")] [Parameter] public string? Placeholder { get; set; } /// diff --git a/src/TDesign/Components/Forms/TInputRadio.cs b/src/TDesign/Components/Forms/TInputRadio.cs index 490d7518..6e69f277 100644 --- a/src/TDesign/Components/Forms/TInputRadio.cs +++ b/src/TDesign/Components/Forms/TInputRadio.cs @@ -22,14 +22,17 @@ public class TInputRadio : TDesignComponentBase /// /// 获取或设置单选按钮的值。 /// + [ParameterApiDoc("单选按钮的值")] [Parameter] public TValue? Value { get; set; } /// /// /// + [ParameterApiDoc("单选按钮的任意内容")] [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 禁用状态。 /// + [ParameterApiDoc("禁用状态")] [Parameter][HtmlAttribute] public bool Disabled { get; set; } /// diff --git a/src/TDesign/Components/Forms/TInputRadioContainer.cs b/src/TDesign/Components/Forms/TInputRadioContainer.cs index c5677de0..a2906ff2 100644 --- a/src/TDesign/Components/Forms/TInputRadioContainer.cs +++ b/src/TDesign/Components/Forms/TInputRadioContainer.cs @@ -19,6 +19,7 @@ public class TInputRadioContainer : BlazorComponentBase, IHasChildConten /// /// 执行当 触发的事件。 /// + [ParameterApiDoc("当单选按钮的值变化后触发的回调", Value = "EventCallback")] [Parameter] public EventCallback OnValueSelected { get; set; } /// @@ -35,10 +36,13 @@ public class TInputRadioContainer : BlazorComponentBase, IHasChildConten [CascadingParameter]public EditContext? CascadedEditContext { get; set; } /// + [ParameterApiDoc("绑定的值")] [Parameter]public TValue? Value { get; set; } /// + [ParameterApiDoc("绑定值的表达式", Value = "Expression>?")] [Parameter] public Expression>? ValueExpression { get; set; } /// + [ParameterApiDoc("更新值的回调")] [Parameter] public EventCallback ValueChanged { get; set; } /// diff --git a/src/TDesign/Components/Forms/TInputRadioGroup.cs b/src/TDesign/Components/Forms/TInputRadioGroup.cs index e00f4249..1e6ab363 100644 --- a/src/TDesign/Components/Forms/TInputRadioGroup.cs +++ b/src/TDesign/Components/Forms/TInputRadioGroup.cs @@ -11,14 +11,17 @@ public class TInputRadioGroup : TInputRadioContainer,IHasDisable /// /// 设置单选框的按钮风格。 /// + [ParameterApiDoc("单选框的按钮风格")] [Parameter][CssClass] public RadioButtonStyle? ButtonStyle { get; set; } /// /// 设置禁用状态。 /// + [ParameterApiDoc("禁用状态")] [Parameter] public bool Disabled { get; set; } /// /// 设置按钮的同一尺寸。 /// + [ParameterApiDoc("按钮的同一尺寸", Value = "Medium")] [Parameter][CssClass] public Size Size { get; set; } = Size.Medium; } diff --git a/src/TDesign/Components/Forms/TInputRange.cs b/src/TDesign/Components/Forms/TInputRange.cs index 116ec87a..9fc21a34 100644 --- a/src/TDesign/Components/Forms/TInputRange.cs +++ b/src/TDesign/Components/Forms/TInputRange.cs @@ -9,47 +9,54 @@ namespace TDesign; [CssClass("t-range-input")] public class TInputRange : BlazorComponentBase { - /// /// 设置开始值。 /// + [ParameterApiDoc("开始值")] [Parameter] public TValue? StartValue { get; set; } /// /// 设置开始值的表达式。 /// + [ParameterApiDoc("开始值的表达式")] [Parameter] public Expression>? StartValueExpression { get; set; } /// /// 设置开始值变化触发的回调。 /// + [ParameterApiDoc("开始值变化触发的回调")] [Parameter] public EventCallback StartValueChanged { get; set; } /// /// 设置结束值。 /// + [ParameterApiDoc("结束值")] [Parameter] public TValue? EndValue { get; set; } /// /// 设置结束值的表达式。 /// + [ParameterApiDoc("结束值的表达式")] [Parameter] public Expression>? EndValueExpression { get; set; } /// /// 设置结束值变化触发的回调。 /// + [ParameterApiDoc("结束值变化触发的回调")] [Parameter] public EventCallback EndValueChanged { get; set; } /// - /// 设置大小。 + /// 尺寸。 /// + [ParameterApiDoc("尺寸", Value = "Medium")] [Parameter][CssClass] public Size Size { get; set; } = Size.Medium; /// /// 设置分隔符文本。 /// + [ParameterApiDoc("分隔符文本", Value = "-")] [Parameter] public string Seperator { get; set; } = "-"; diff --git a/src/TDesign/Components/Forms/TInputTag.cs b/src/TDesign/Components/Forms/TInputTag.cs index b85deddd..49c66dde 100644 --- a/src/TDesign/Components/Forms/TInputTag.cs +++ b/src/TDesign/Components/Forms/TInputTag.cs @@ -14,27 +14,33 @@ public class TInputTag : TDesignInputComonentBase> /// /// 设置标签的前缀文本。 /// + [ParameterApiDoc("标签的前缀文本")] [Parameter] public string? Prefix { get; set; } /// /// 设置标签的前缀任意内容。 /// + [ParameterApiDoc("标签的前缀任意内容")] [Parameter] public RenderFragment? PrefixContent { get; set; } /// /// 最多容纳的标签数量。 /// + [ParameterApiDoc("最多容纳的标签数量")] [Parameter] public int? Max { get; set; } /// /// 设置一个当按下回车键后的回调方法。 /// + [ParameterApiDoc("当按下回车键后的回调方法", Type = "EventCallback")] [Parameter] public EventCallback OnEnterPressed { get; set; } /// /// 设置文本框的水印占位字符串。 /// + [ParameterApiDoc("文本框的水印占位字符串")] [Parameter] public string? Placeholder { get; set; } /// /// 设置标签的主题颜色。 /// + [ParameterApiDoc("标签的主题颜色")] [Parameter] public Theme? Theme { get; set; } diff --git a/src/TDesign/Components/Forms/TInputText.cs b/src/TDesign/Components/Forms/TInputText.cs index 74380592..e1703d8b 100644 --- a/src/TDesign/Components/Forms/TInputText.cs +++ b/src/TDesign/Components/Forms/TInputText.cs @@ -14,22 +14,27 @@ public class TInputText : TDesignInputComonentBase /// /// 输入框的类型。 /// + [ParameterApiDoc("输入框的类型", Value= "Text")] [Parameter][HtmlAttribute] public InputType Type { get; set; } = InputType.Text; /// /// 输入框前缀显示的文本。 /// + [ParameterApiDoc("输入框前缀显示的文本")] [Parameter] public string? PrefixText { get; set; } /// /// 输入框前缀显示的图标名称。 /// + [ParameterApiDoc("输入框前缀显示的图标名称")] [Parameter] public object? PrefixIcon { get; set; } /// /// 输入框后缀显示的文本。 /// + [ParameterApiDoc("输入框后缀显示的文本")] [Parameter] public string? SuffixText { get; set; } /// /// 输入框后缀显示的图标名称。 /// + [ParameterApiDoc("输入框后缀显示的图标名称")] [Parameter] public object? SuffixIcon { get; set; } bool HasPrefix => !string.IsNullOrEmpty(PrefixText) || PrefixIcon is not null; diff --git a/src/TDesign/Components/Forms/TInputTextArea.cs b/src/TDesign/Components/Forms/TInputTextArea.cs index 006e8594..41f9e5ba 100644 --- a/src/TDesign/Components/Forms/TInputTextArea.cs +++ b/src/TDesign/Components/Forms/TInputTextArea.cs @@ -11,10 +11,12 @@ public class TInputTextArea : TDesignInputComonentBase /// /// 文本域的最大行数。 /// + [ParameterApiDoc("文本域的最大行数")] [Parameter] public int? Rows { get; set; } /// /// 禁用重新绘制尺寸的功能。 /// + [ParameterApiDoc("禁用重新绘制尺寸的功能")] [Parameter][CssClass("t-resize-none")] public bool DisableResize { get; set; } protected override void BuildRenderTree(RenderTreeBuilder builder) diff --git a/src/TDesign/Components/Forms/TSelect.razor.cs b/src/TDesign/Components/Forms/TSelect.razor.cs index 3ccb784c..f03f770e 100644 --- a/src/TDesign/Components/Forms/TSelect.razor.cs +++ b/src/TDesign/Components/Forms/TSelect.razor.cs @@ -10,16 +10,20 @@ public partial class TSelect /// /// 自定义选项内容。 /// + [ParameterApiDoc("自定义选项内容")] [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 设置当选项被选中后的回调。 /// + [ParameterApiDoc("当选项被选中后的回调", Type= "EventCallback")] [Parameter] public EventCallback OnValueSelected { get; set; } /// /// 无边框样式。 /// + [ParameterApiDoc("无边框样式")] [Parameter][CssClass("t-select-input--borderless")] public bool Borderless { get; set; } + [ParameterApiDoc("占位符")] [Parameter] public string? Placeholder { get; set; } /// /// Popup 组件的引用。 @@ -87,19 +91,23 @@ public class TSelectOption : TDesignComponentBase, IHasChildContent /// /// 选项的值。 /// + [ParameterApiDoc("选项的值")] [Parameter] public TValue? Value { get; set; } /// /// 选项的文本。 /// + [ParameterApiDoc("选项的文本")] [Parameter] public string? Label { get; set; } /// /// 禁用选项。 /// + [ParameterApiDoc("禁用选项")] [Parameter][CssClass("t-is-disabled")] public bool Disabled { get; set; } /// /// 自定义选项的内容。 /// + [ParameterApiDoc("自定义选项的内容")] [Parameter] public RenderFragment? ChildContent { get; set; } /// diff --git a/src/TDesign/Components/Forms/TSwitch.cs b/src/TDesign/Components/Forms/TSwitch.cs index 4752396f..b67e8987 100644 --- a/src/TDesign/Components/Forms/TSwitch.cs +++ b/src/TDesign/Components/Forms/TSwitch.cs @@ -13,21 +13,25 @@ public class TSwitch : TDesignInputComonentBase /// /// 是否加载中 /// + [ParameterApiDoc("是否加载中")] [Parameter] public bool Loading { get; set; } /// /// 执行当 的值发生改变时的事件。 /// + [ParameterApiDoc("值发生改变时触发的回调", Type= "EventCallback")] [Parameter] public EventCallback OnChange { get; set; } /// /// 开关打开时,需要显示的自定义内容。 /// + [ParameterApiDoc("开关打开时,需要显示的自定义内容")] [Parameter] public RenderFragment? TrueContent { get; set; } /// /// 开关关闭时,显示的自定义内容。 /// + [ParameterApiDoc("开关关闭时,显示的自定义内容")] [Parameter] public RenderFragment? FalseContent { get; set; } /// diff --git a/src/TDesign/Components/Forms/Upload/TUpload.cs b/src/TDesign/Components/Forms/Upload/TUpload.cs index b6475de9..bbbc9001 100644 --- a/src/TDesign/Components/Forms/Upload/TUpload.cs +++ b/src/TDesign/Components/Forms/Upload/TUpload.cs @@ -12,37 +12,45 @@ namespace TDesign; public partial class TUpload : TDesignComponentBase,IHasDisabled { /// - /// 设置服务端上传的 API 地址。要求 API 可以通过 POST 方式接收请求,并支持 FORM DATA 数据传输方式。 + /// 设置服务端上传的 API 地址。要求 API 支持 FORM DATA 数据传输方式。 /// + [ParameterApiDoc("服务端上传的 API 地址。要求 API 支持 FORM DATA 数据传输方式")] [Parameter][EditorRequired] public string Action { get; set; } /// /// 向服务端发送请求的 HTTP 方式,默认是 POST。 /// + [ParameterApiDoc("向服务端发送请求的 HTTP 方式",Value ="POST")] [Parameter] public string? Method { get; set; } = "POST"; /// /// 上传文件在表单中的名称。该名称用于服务端进行文件对象的接收。 /// + [ParameterApiDoc("上传文件在表单中的名称。该名称用于服务端进行文件对象的接收", Value = "file")] [Parameter] public string Name { get; set; } = "file"; /// /// 允许批量上传。 /// + [ParameterApiDoc("是否允许批量上传")] [Parameter] public bool Multiple { get; set; } /// /// 是否在选择文件后自动发起请求上传文件。否则手动调用 方法。 /// + [ParameterApiDoc("是否在选择文件后自动发起请求上传文件,否则需要手动调用 Upload 方法")] [Parameter] public bool AutoUpload { get; set; } = true; /// /// 上传的风格样式。 /// + [ParameterApiDoc("上传的风格样式")] [Parameter] public UploadTheme Theme { get; set; } = UploadTheme.File; /// /// 上传的显示文本。 /// + [ParameterApiDoc("上传的显示文本", Value ="选择文件")] [Parameter] public string Text { get; set; } = "选择文件"; /// /// 当前最大上传文件数量。默认 100。 /// + [ParameterApiDoc("当前最大上传文件数量", Value = "100")] [Parameter] public int Max { get; set; } = 100; /// /// 接受上传的文件类型。例如 .png,.jpg,.xslx 等。 @@ -50,71 +58,87 @@ public partial class TUpload : TDesignComponentBase,IHasDisabled /// 参考:https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/file#accept /// /// + [ParameterApiDoc("接受上传的文件类型。例如 .png,.jpg,.xslx 等")] [Parameter] public string? Accept { get; set; } /// /// 单个上传的文件限制大小,单位 B。默认 512KB。 /// + [ParameterApiDoc("单个上传的文件限制大小,单位 B", Value =512000)] [Parameter] public long Size { get; set; } = 512000; /// /// 禁用上传组件。 /// + [ParameterApiDoc("禁用上传组件")] [Parameter]public bool Disabled { get; set; } /// /// 组件下方的提示文字。 /// + [ParameterApiDoc("下方的提示文字")] [Parameter] public string? Tip { get; set; } /// /// 按钮的主题。 /// + [ParameterApiDoc("按钮的主题", Value = "Primary")] [Parameter] public Theme ButtonTheme { get; set; } = TDesign.Theme.Primary; /// /// 按钮图标,默认 IconName.Upload /// + [ParameterApiDoc("按钮图标", Value = "Upload")] [Parameter] public object? ButtonIcon { get; set; } = IconName.Upload; /// /// 上传文件列表的内容 /// - [Parameter]public RenderFragment>? FileListContent { get; set; } + [ParameterApiDoc("上传文件列表的内容", Type = "RenderFragment>?")] + [Parameter]public RenderFragment>? FileListContent { get; set; } /// - /// 附带的 Header + /// 附带的 Header 字典 /// + [ParameterApiDoc("附带的 Header 字典", Type = "Dictionary")] [Parameter]public Dictionary Headers { get; set; } = new(); /// /// 附带的 form/data 字段。 /// + [ParameterApiDoc("附带的 form/data 字段", Type = "Dictionary")] [Parameter]public Dictionary Data { get; set; } = new(); /// /// 当上传前进行验证的处理委托。 /// + [ParameterApiDoc("当上传前进行验证的处理委托", Type = "Func, Task>")] [Parameter] public Func, Task> ValidationHandler { get; set; } = (_) => Task.FromResult(true); /// /// 在文件选择之后,上传请求发起之前触发。 /// + [ParameterApiDoc("在文件选择之后,上传请求发起之前触发", Type = "EventCallback>")] [Parameter]public EventCallback> OnSelected { get; set; } /// /// 当上传前触发的回调。 /// + [ParameterApiDoc("当上传前触发的回调", Type = "EventCallback>")] [Parameter]public EventCallback> OnBeforeUpload { get; set; } /// /// 当上传成功后触发的回调。 /// + [ParameterApiDoc("当上传成功后触发的回调", Type = "EventCallback")] [Parameter]public EventCallback OnSuccess { get; set; } /// /// 当上传失败后触发的回调。 /// + [ParameterApiDoc("当上传失败后触发的回调", Type = "EventCallback")] [Parameter]public EventCallback OnFailure { get; set; } /// /// 当移除文件后触发的回调。 /// + [ParameterApiDoc("当移除文件后触发的回调", Type = "EventCallback")] [Parameter]public EventCallback OnRemoved { get; set; } /// /// 当所有文件上传完成触发的回调。 /// + [ParameterApiDoc("当所有文件上传完成触发的回调", Type = "EventCallback>")] [Parameter] public EventCallback> OnFinished { get; set; } private List _fileList = new(); diff --git a/src/TDesign/Components/Forms/Upload/TUpload.method.cs b/src/TDesign/Components/Forms/Upload/TUpload.method.cs index 14caed0e..77909820 100644 --- a/src/TDesign/Components/Forms/Upload/TUpload.method.cs +++ b/src/TDesign/Components/Forms/Upload/TUpload.method.cs @@ -4,11 +4,11 @@ namespace TDesign; partial class TUpload { /// - /// 当已经选择了上传的文件。 + /// 选择上传的文件。 /// /// 选择的文件列表。 /// - public async Task SelectFiles(IReadOnlyList files) + async Task SelectFiles(IReadOnlyList files) { _fileList.Clear(); await this.Refresh(); @@ -51,6 +51,7 @@ public async Task SelectFiles(IReadOnlyList files) /// /// 执行上传操作。 /// + [MethodApiDoc("执行上传操作")] public async Task Upload() { var valid = await ValidationHandler!.Invoke(_fileList); diff --git a/src/TDesign/Components/Grid/TColumn.cs b/src/TDesign/Components/Grid/TColumn.cs index 065b1123..8b61a4b1 100644 --- a/src/TDesign/Components/Grid/TColumn.cs +++ b/src/TDesign/Components/Grid/TColumn.cs @@ -7,7 +7,7 @@ namespace TDesign; /// [ChildComponent(typeof(TRow))] [CssClass("t-col")] -public class TColumn : TDesignComponentBase, IHasChildContent +public class TColumn : TDesignAdditionParameterComponentBase, IHasChildContent { /// /// 获取或设置父组件 的级联参数的值。 @@ -16,26 +16,32 @@ public class TColumn : TDesignComponentBase, IHasChildContent /// /// 获取或设置栅格的宽度。 /// + [ParameterApiDoc("栅格的宽度", Value ="Is1")] [Parameter][CssClass("t-col-")] public ColumnSpan Span { get; set; } = ColumnSpan.Is1; /// /// 获取或设置栅格的偏移量。 /// + [ParameterApiDoc("栅格的偏移量")] [Parameter][CssClass("t-col-offset-")] public ColumnSpan? Offset { get; set; } /// /// 获取或设置向左边拉动的单元格宽度。 /// + [ParameterApiDoc("向左边拉动的单元格宽度")] [Parameter][CssClass("t-col-pull-")] public ColumnSpan? Pull { get; set; } /// /// 获取或设置向右边推动的单元格宽度。 /// + [ParameterApiDoc("向右边推动的单元格宽度")] [Parameter][CssClass("t-col-push-")] public ColumnSpan? Push { get; set; } /// /// 获取或设置单元格的排序。 /// + [ParameterApiDoc("单元格的排序")] [Parameter][CssClass("t-col-order-")] public ColumnSpan? Order { get; set; } /// /// /// + [ParameterApiDoc("任意的内容")] [Parameter] public RenderFragment? ChildContent { get; set; } diff --git a/src/TDesign/Components/Grid/TRow.cs b/src/TDesign/Components/Grid/TRow.cs index f2d9fadb..61e909ae 100644 --- a/src/TDesign/Components/Grid/TRow.cs +++ b/src/TDesign/Components/Grid/TRow.cs @@ -5,23 +5,27 @@ /// [CssClass("t-row")] [ParentComponent] -public class TRow : TDesignComponentBase, IHasChildContent +public class TRow : TDesignAdditionParameterComponentBase, IHasChildContent { /// /// 间隔,单位 px。 /// + [ParameterApiDoc("行间隔,单位 px")] [Parameter] public int? Gutter { get; set; } /// /// 水平对齐方式。 /// + [ParameterApiDoc("水平对齐方式", Value = "Start")] [Parameter][CssClass("t-row--")] public JustifyContent HorizontalAlignment { get; set; } = JustifyContent.Start; /// /// 垂直对齐方式。 /// + [ParameterApiDoc("垂直对齐方式", Value = "Top")] [Parameter][CssClass("t-row--")] public VerticalAlignment VerticalAlignment { get; set; } = VerticalAlignment.Top; /// /// /// + [ParameterApiDoc($"装载 {nameof(TColumn)} 组件的内容")] [Parameter] public RenderFragment? ChildContent { get; set; } protected override void BuildStyle(IStyleBuilder builder) diff --git a/src/TDesign/Components/List/TList.cs b/src/TDesign/Components/List/TList.cs index f54425f0..c18bbd6a 100644 --- a/src/TDesign/Components/List/TList.cs +++ b/src/TDesign/Components/List/TList.cs @@ -6,39 +6,42 @@ namespace TDesign; /// [ParentComponent] [CssClass("t-list")] -public class TList : TDesignComponentBase, IHasChildContent +public class TList : TDesignAdditionParameterWithChildContentComponentBase { - /// - /// - /// - [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 列表的尺寸。默认是 。 /// + [ParameterApiDoc("列表的尺寸", Value =$"{nameof(Size.Medium)}")] [Parameter] public Size Size { get; set; } = Size.Medium; /// /// 设置一个布尔值,表示列表项之间是否有分割线。 /// + [ParameterApiDoc("列表项之间是否有分割线")] [Parameter][CssClass("t-list--split")] public bool Split { get; set; } /// /// 设置一个布尔值,表示列表项之间是否有渐变色。 /// + [ParameterApiDoc("列表项之间是否有渐变色")] [Parameter][CssClass("t-list--stripe")] public bool Stripe { get; set; } /// /// 设置在列表中顶部的内容。 /// + [ParameterApiDoc("列表中顶部的内容")] [Parameter] public RenderFragment? HeaderContent { get; set; } /// /// 设置在列表中底部的内容。 /// + [ParameterApiDoc("列表中底部的内容")] [Parameter] public RenderFragment? FooterContent { get; set; } /// /// 设置列表加载状态时的自定义内容。 /// + [ParameterApiDoc("列表加载状态时的自定义内容")] [Parameter] public RenderFragment? LoadingContent { get; set; } /// /// 列表的最大高度。单位 px,超过高度则自动出现滚动条。 /// + [ParameterApiDoc("列表的最大高度,单位px,超过高度则自动出现滚动条")] [Parameter] public int? Height { get; set; } protected override void AddContent(RenderTreeBuilder builder, int sequence) diff --git a/src/TDesign/Components/List/TListItem.cs b/src/TDesign/Components/List/TListItem.cs index 5545893b..f2b9cad5 100644 --- a/src/TDesign/Components/List/TListItem.cs +++ b/src/TDesign/Components/List/TListItem.cs @@ -6,23 +6,27 @@ namespace TDesign; /// [ChildComponent(typeof(TList))] [CssClass("t-list-item")] -public class TListItem : TDesignComponentBase, IHasChildContent +public class TListItem : TDesignAdditionParameterWithChildContentComponentBase { /// /// 列表项正文部分的内容。 /// - [Parameter] public RenderFragment? ChildContent { get; set; } + [ParameterApiDoc("列表项正文部分的内容")] + [Parameter] public override RenderFragment? ChildContent { get; set; } /// /// 列表项标题部分的内容。 /// + [ParameterApiDoc("列表项标题部分的内容")] [Parameter] public RenderFragment? TitleContent { get; set; } /// /// 列表项头像部分的内容。 /// + [ParameterApiDoc("列表项头像部分的内容")] [Parameter] public RenderFragment? AvatarContent { get; set; } /// /// 列表项操作部分的内容。 /// + [ParameterApiDoc("列表项操作部分的内容")] [Parameter] public RenderFragment? OperationContent { get; set; } protected override void AddContent(RenderTreeBuilder builder, int sequence) diff --git a/src/TDesign/Components/Loading/TLoading.cs b/src/TDesign/Components/Loading/TLoading.cs index c56c6fbb..08f117ae 100644 --- a/src/TDesign/Components/Loading/TLoading.cs +++ b/src/TDesign/Components/Loading/TLoading.cs @@ -1,7 +1,4 @@ -using Microsoft.AspNetCore.Components.Rendering; -using System.Linq.Expressions; - -namespace TDesign; +namespace TDesign; /// /// 显示程序正在处理的加载提示。 @@ -12,29 +9,35 @@ public class TLoading : TDesignAdditionParameterWithChildContentComponentBase /// /// 位置是否处于容器的正中间。 /// + [ParameterApiDoc("位置是否处于容器的正中间",Value ="true")] [Parameter][CssClass("t-loading--center")] public bool Center { get; set; } = true; /// /// 尺寸。 /// + [ParameterApiDoc("尺寸", Value = "Medium")] [Parameter][CssClass] public Size Size { get; set; } = Size.Medium; /// /// 设置是否显示遮罩层。 /// + [ParameterApiDoc("是否显示遮罩层")] [Parameter][CssClass("t-loading__overlay")] public bool Overlay { get; set; } /// /// 是否全屏显示。 /// + [ParameterApiDoc("是否全屏显示")] [Parameter][CssClass("t-loading__fullscreen")] public bool FullScreen { get; set; } /// /// 表示只显示文字,不显示加载图标。 /// + [ParameterApiDoc("只显示文字,不显示加载图标")] [Parameter] public bool TextOnly { get; set; } /// /// 获取或设置是否可见。 /// + [ParameterApiDoc("可见性设置")] [Parameter] public bool Visible { get; set; } = true; protected override void BuildRenderTree(RenderTreeBuilder builder) diff --git a/src/TDesign/Components/Menu/TMenu.cs b/src/TDesign/Components/Menu/TMenu.cs index e0641283..edb66cc8 100644 --- a/src/TDesign/Components/Menu/TMenu.cs +++ b/src/TDesign/Components/Menu/TMenu.cs @@ -5,40 +5,48 @@ namespace TDesign; /// 导航菜单。 /// [ParentComponent] -public class TMenu : TDesignComponentBase, IHasChildContent +public class TMenu : TDesignAdditionParameterComponentBase, IHasChildContent { /// /// 设置 true 表示侧边菜单栏。 /// + [ParameterApiDoc("是否为侧边菜单栏")] [Parameter] public bool Aside { get; set; } /// /// 是否暗色主题。 /// + [ParameterApiDoc("是否暗色主题")] [Parameter][BooleanCssClass("t-menu--dark", "t-menu--light")] public bool Dark { get; set; } /// /// 设置 true 表示下级菜单的展开模式为【弹出】方式,即鼠标悬停后展开下级菜单。否则是【鼠标点击】后展开下级菜单。 /// + [ParameterApiDoc("是否设置下级菜单的展开模式为【弹出】方式,即鼠标悬停后展开下级菜单。否则是【鼠标点击】后展开下级菜单")] [Parameter][BooleanCssClass("popup", "sub")] public bool Popup { get; set; } /// /// Logo 部分的内容。 /// + [ParameterApiDoc("Logo 部分的内容")] [Parameter] public RenderFragment? LogoContent { get; set; } /// /// 主体部分的内容。 /// + [ParameterApiDoc("菜单主体部分的内容")] [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 右侧操作部分的内容。 /// + [ParameterApiDoc("右侧操作部分的内容")] [Parameter] public RenderFragment? OperationContent { get; set; } /// /// 折叠菜单,侧边菜单有效。 /// + [ParameterApiDoc("折叠菜单,侧边菜单有效")] [Parameter][CssClass("t-is-collapsed")] public bool Collapse { get; set; } /// /// 侧边菜单的宽度。 /// + [ParameterApiDoc("侧边菜单的宽度")] [Parameter] public int? Width { get; set; } protected override void OnParametersSet() diff --git a/src/TDesign/Components/Menu/TMenuItem.cs b/src/TDesign/Components/Menu/TMenuItem.cs index 83b6df30..c63e32dc 100644 --- a/src/TDesign/Components/Menu/TMenuItem.cs +++ b/src/TDesign/Components/Menu/TMenuItem.cs @@ -20,26 +20,32 @@ public class TMenuItem : TDesignAdditionParameterWithChildContentComponentBase, /// /// 菜单高亮的匹配方式。 /// + [ParameterApiDoc("菜单高亮的匹配方式")] [Parameter] public NavLinkMatch Match { get; set; } = NavLinkMatch.All; /// /// 禁用状态。 /// + [ParameterApiDoc("禁用状态")] [Parameter][CssClass("t-is-disabled")] public bool Disabled { get; set; } /// /// 导航的超链接。 /// + [ParameterApiDoc("导航的超链接")] [Parameter] public string? Link { get; set; } /// /// 前缀图标的名称。 /// + [ParameterApiDoc("前缀图标的名称")] [Parameter] public object? IconPrefix { get; set; } /// /// 后缀图标的名称。 /// + [ParameterApiDoc("后缀图标的名称")] [Parameter] public object? IconSuffix { get; set; } /// /// 选中状态。若为 false 则根据导航自动判断。 /// + [ParameterApiDoc("选中状态,若为 false 则根据导航自动判断。")] [Parameter] public bool Active { get; set; } public override string? GetTagName() => CascadingSubMenu is not null ? "div" : "li"; diff --git a/src/TDesign/Components/Menu/TMenuItemGroup.cs b/src/TDesign/Components/Menu/TMenuItemGroup.cs index eef05668..a74145c9 100644 --- a/src/TDesign/Components/Menu/TMenuItemGroup.cs +++ b/src/TDesign/Components/Menu/TMenuItemGroup.cs @@ -1,6 +1,5 @@ -using System.Diagnostics.CodeAnalysis; - -using Microsoft.AspNetCore.Components.Rendering; +using Microsoft.AspNetCore.Components.Rendering; +using System.Diagnostics.CodeAnalysis; namespace TDesign; @@ -9,15 +8,17 @@ namespace TDesign; /// [ChildComponent(typeof(TMenu))] [CssClass("t-menu-group")] -public class TMenuItemGroup : TDesignComponentBase, IHasChildContent +public class TMenuItemGroup : TDesignAdditionParameterComponentBase, IHasChildContent { /// /// /// + [ParameterApiDoc("当前分组的菜单项容器")] [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 分组标题。 /// + [ParameterApiDoc("分组标题")] [EditorRequired][Parameter][NotNull] public string Title { get; set; } protected override void AddContent(RenderTreeBuilder builder, int sequence) diff --git a/src/TDesign/Components/Menu/TSubMenu.cs b/src/TDesign/Components/Menu/TSubMenu.cs index b5a2ee41..f811b3db 100644 --- a/src/TDesign/Components/Menu/TSubMenu.cs +++ b/src/TDesign/Components/Menu/TSubMenu.cs @@ -9,21 +9,24 @@ namespace TDesign; [HtmlTag("li")] [ParentComponent] [ChildComponent(typeof(TMenu))] -public class TSubMenu : TDesignComponentBase, IHasChildContent +public class TSubMenu : TDesignAdditionParameterComponentBase, IHasChildContent { [CascadingParameter] public TMenu CascadingMenu { get; set; } /// /// 菜单内容。 /// + [ParameterApiDoc("二级菜单的内容")] [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 显示下级菜单的当前菜单标题。 /// + [ParameterApiDoc("显示下级菜单的当前菜单标题")] [Parameter] public string? Title { get; set; } /// /// 图标名称。 /// - [Parameter] public object? TIcon { get; set; } + [ParameterApiDoc("图标名称")] + [Parameter] public object? Icon { get; set; } internal bool IsOpened { get; set; } @@ -70,7 +73,7 @@ protected override void AddContent(RenderTreeBuilder builder, int sequence) { content.CreateComponent(0, Title, new { - TIconPrefix = TIcon, + TIconPrefix = Icon, TIconSuffix = IsOpened ? IconName.ChevronUp : IconName.ChevronDown, }); diff --git a/src/TDesign/Components/Notify/Messages/TMessage.cs b/src/TDesign/Components/Notify/Messages/TMessage.cs index 9da3d2af..345a9b06 100644 --- a/src/TDesign/Components/Notify/Messages/TMessage.cs +++ b/src/TDesign/Components/Notify/Messages/TMessage.cs @@ -13,10 +13,12 @@ public class TMessage : NotifyComponentBase /// /// 加载中的状态。 /// + [ParameterApiDoc("加载中的状态")] [Parameter][CssClass("t-is-loading")] public bool Loading { get; set; } /// /// 可关闭的功能。 /// + [ParameterApiDoc("可关闭的功能")] [Parameter][CssClass("t-is-closable")] public bool Closable { get; set; } /// diff --git a/src/TDesign/Components/Notify/Notification/TNotification.cs b/src/TDesign/Components/Notify/Notification/TNotification.cs index c02be7c0..3b5d24c1 100644 --- a/src/TDesign/Components/Notify/Notification/TNotification.cs +++ b/src/TDesign/Components/Notify/Notification/TNotification.cs @@ -1,5 +1,4 @@ using Microsoft.AspNetCore.Components.Rendering; - using TDesign.Notification; namespace TDesign; @@ -14,14 +13,17 @@ public class TNotification : NotifyComponentBase /// /// 显示的标题。 /// + [ParameterApiDoc("显示的标题")] [Parameter][EditorRequired] public string? Title { get; set; } /// /// 显示的副标题。 /// + [ParameterApiDoc("显示的副标题")] [Parameter] public string? SubTitle { get; set; } /// /// 具备操作部分的 UI 内容。 /// + [ParameterApiDoc("操作部分的 UI 内容")] [Parameter] public RenderFragment? OperationContent { get; set; } protected override void AddContent(RenderTreeBuilder builder, int sequence) diff --git a/src/TDesign/Components/Popup/TPopup.cs b/src/TDesign/Components/Popup/TPopup.cs index fad94989..fd093cc8 100644 --- a/src/TDesign/Components/Popup/TPopup.cs +++ b/src/TDesign/Components/Popup/TPopup.cs @@ -26,30 +26,36 @@ public class TPopup : TDesignAdditionParameterWithChildContentComponentBase /// /// 设置弹出层的显示位置。 /// + [ParameterApiDoc("弹出层的显示位置", Value = "Top")] [Parameter] public PopupPlacement Placement { get; set; } = PopupPlacement.Top; /// /// 设置弹出层的内容。 /// + [ParameterApiDoc("弹出层的内容")] [Parameter] public string? Content { get; set; } /// /// 设置弹出层内容的模板。 /// + [ParameterApiDoc("弹出层内容的模板")] [Parameter] public RenderFragment? PopupContent { get; set; } /// - /// 设置弹出层是否具备箭头指向。 + /// 设置是否具备箭头指向。 /// + [ParameterApiDoc("是否具备箭头指向")] [Parameter] public bool Arrow { get; set; } /// /// 触发弹出的方式。 /// + [ParameterApiDoc("触发弹出的方式", Value = "Hover")] [Parameter] public PopupTrigger Trigger { get; set; } = PopupTrigger.Hover; /// /// 设置弹出层内部的 CSS 类名称。 /// + [ParameterApiDoc("弹出层内部的 CSS 类名称")] [Parameter]public string? PopupContentCssClass { get; set; } /// diff --git a/src/TDesign/Components/Space/TSpace.cs b/src/TDesign/Components/Space/TSpace.cs index bf07d494..710245a5 100644 --- a/src/TDesign/Components/Space/TSpace.cs +++ b/src/TDesign/Components/Space/TSpace.cs @@ -5,23 +5,27 @@ /// [ParentComponent] [CssClass("t-space")] -public class TSpace : TDesignComponentBase, IHasChildContent +public class TSpace : TDesignAdditionParameterComponentBase, IHasChildContent { /// /// /// + [ParameterApiDoc($"装载 {nameof(TSpaceItem)} 组件的内容")] [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 是否为竖向排列。 /// + [ParameterApiDoc($"是否为竖向排列")] [Parameter][BooleanCssClass("t-space-vertical", "t-space-horizontal")] public bool Vertical { get; set; } /// /// 之间的间距。 /// + [ParameterApiDoc($"每一个 {nameof(TSpaceItem)} 的间距", Value ="16px")] [Parameter] public string? Gap { get; set; } = "16px"; /// /// 水平排列时是否可以被自动换行。 /// + [ParameterApiDoc($"水平排列时是否可以被自动换行")] [Parameter] public bool BreakLine { get; set; } protected override void BuildStyle(IStyleBuilder builder) diff --git a/src/TDesign/Components/Space/TSpaceItem.cs b/src/TDesign/Components/Space/TSpaceItem.cs index 0c13f8fe..89a7d5c0 100644 --- a/src/TDesign/Components/Space/TSpaceItem.cs +++ b/src/TDesign/Components/Space/TSpaceItem.cs @@ -5,10 +5,11 @@ /// [ChildComponent(typeof(TSpace))] [CssClass("t-space-item")] -public class TSpaceItem : TDesignComponentBase, IHasChildContent +public class TSpaceItem : TDesignAdditionParameterComponentBase, IHasChildContent { /// /// /// + [ParameterApiDoc("间距内的任意内容")] [Parameter] public RenderFragment? ChildContent { get; set; } } diff --git a/src/TDesign/Components/Step/TStepGroup.cs b/src/TDesign/Components/Step/TStepGroup.cs index 01d3e9ae..5ee0edbb 100644 --- a/src/TDesign/Components/Step/TStepGroup.cs +++ b/src/TDesign/Components/Step/TStepGroup.cs @@ -5,27 +5,32 @@ /// [CssClass("t-steps")] [ParentComponent] -public class TStepGroup : TDesignComponentBase, IHasChildContent +public class TStepGroup : TDesignAdditionParameterWithChildContentComponentBase { /// /// /// - [Parameter] public RenderFragment? ChildContent { get; set; } + [ParameterApiDoc($"装载 {nameof(TStepItem)} 组件的内容")] + [Parameter] public override RenderFragment? ChildContent { get; set; } /// - /// 设置为垂直排列。 + /// 是否为垂直排列。 /// + [ParameterApiDoc("是否为垂直排列")] [Parameter][BooleanCssClass("t-steps--vertical", "t-steps--horizontal")] public bool Vertical { get; set; } /// /// 设置一个布尔值,表示步骤的顺序是否为倒序。 /// + [ParameterApiDoc("步骤的顺序是否为倒序")] [Parameter][BooleanCssClass("t-steps--reserve", "t-steps--positive")] public bool Reserve { get; set; } /// /// 设置 true 使用 “.” 作为步骤项的连接标识。否则使用序号。 /// + [ParameterApiDoc("使用 “.” 作为步骤项的连接标识。否则使用序号")] [Parameter][BooleanCssClass("t-steps--dot-anchor", "t-steps--default-anchor")] public bool Dot { get; set; } /// /// 步骤项分割线风格,默认是 。 /// + [ParameterApiDoc("步骤项分割线风格", Value = "Line")] [Parameter] public StepSeperator Seperator { get; set; } = StepSeperator.Line; protected override void BuildCssClass(ICssClassBuilder builder) diff --git a/src/TDesign/Components/Step/TStepItem.cs b/src/TDesign/Components/Step/TStepItem.cs index 0041362a..c8a7eee1 100644 --- a/src/TDesign/Components/Step/TStepItem.cs +++ b/src/TDesign/Components/Step/TStepItem.cs @@ -1,6 +1,5 @@ -using System.Diagnostics.CodeAnalysis; - -using Microsoft.AspNetCore.Components.Rendering; +using Microsoft.AspNetCore.Components.Rendering; +using System.Diagnostics.CodeAnalysis; namespace TDesign; @@ -9,7 +8,7 @@ namespace TDesign; /// [CssClass("t-steps-item")] [ChildComponent(typeof(TStepGroup))] -public class TStepItem : TDesignComponentBase, IHasChildContent +public class TStepItem : TDesignAdditionParameterComponentBase, IHasChildContent { /// /// 级联参数。 @@ -18,15 +17,18 @@ public class TStepItem : TDesignComponentBase, IHasChildContent /// /// 步骤的状态。 /// + [ParameterApiDoc("步骤的状态", Value = "NotStart")] [Parameter][CssClass("t-steps-item--")] public StepStatus Status { get; set; } = StepStatus.NotStart; /// /// 设置可点击的样式。 /// + [ParameterApiDoc("是否使用可点击的样式")] [Parameter][CssClass("t-steps-item--clickable")] public bool Clickable { get; set; } /// /// /// + [ParameterApiDoc("步骤条的任意内容")] [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 设置图标名称。默认自动计算当前步骤所在的数字。 @@ -34,14 +36,17 @@ public class TStepItem : TDesignComponentBase, IHasChildContent /// 当 true 时无效。 /// /// - [Parameter] public object? TIcon { get; set; } + [ParameterApiDoc("图标名称。默认自动计算当前步骤所在的数字,当 TStepGroup.Dot 为 true 时无效")] + [Parameter] public object? Icon { get; set; } /// /// 设置描述内容。 /// + [ParameterApiDoc("描述部分的内容")] [Parameter] public RenderFragment? DescriptionContent { get; set; } /// /// 设置附加内容。 /// + [ParameterApiDoc("其余附加部分的内容")] [Parameter] public RenderFragment? ExtraContent { get; set; } protected override void AddContent(RenderTreeBuilder builder, int sequence) @@ -84,9 +89,9 @@ private void BuildTIcon(RenderTreeBuilder builder, int sequence) return; } - if (TIcon is not null) + if (Icon is not null) { - icon.CreateComponent(0, attributes: new { Name = TIcon }); + icon.CreateComponent(0, attributes: new { Name = Icon }); return; } diff --git a/src/TDesign/Components/TAffix.cs b/src/TDesign/Components/TAffix.cs index 1a3d1dfb..1306e4ec 100644 --- a/src/TDesign/Components/TAffix.cs +++ b/src/TDesign/Components/TAffix.cs @@ -11,20 +11,24 @@ public class TAffix : TDesignAdditionParameterWithChildContentComponentBase /// /// 设置指定滚动的容器的元素 id。null 时,则使用 body 元素。 /// + [ParameterApiDoc("指定滚动的容器的元素 id,默认使用 body 元素")] [Parameter]public string? ContainerId { get; set; } /// /// 距离容器顶部达到指定距离后触发固定,默认值0 。 /// + [ParameterApiDoc("距离容器顶部达到指定距离后触发固定", Value =0)] [Parameter] public int OffsetBottom { get; set; } /// /// 距离容器底部达到指定距离后触发固定,默认值0 。 /// + [ParameterApiDoc("距离容器底部达到指定距离后触发固定", Value = 0)] [Parameter] public int OffsetTop { get; set; } /// /// 设置一个回调方法,当固定状态发生变化时触发。 /// + [ParameterApiDoc("一个回调方法,当固定状态发生变化时触发", Type = "EventCallback")] [Parameter] public EventCallback OnFixedChange { get; set; } #endregion END Parameters diff --git a/src/TDesign/Components/TAlert.cs b/src/TDesign/Components/TAlert.cs index f4dfb63d..b039a807 100644 --- a/src/TDesign/Components/TAlert.cs +++ b/src/TDesign/Components/TAlert.cs @@ -11,32 +11,39 @@ namespace TDesign; public class TAlert : NotifyComponentBase,IHasTitleFragment,IHasTitleText { /// + [ParameterApiDoc("标题文本")] [Parameter]public string? TitleText { get; set; } /// /// 具备标题的 UI 内容。 /// + [ParameterApiDoc("标题的 UI 内容")] [Parameter] public RenderFragment? TitleContent { get; set; } /// /// 具备操作部分的 UI 内容。 /// + [ParameterApiDoc("操作部分的 UI 内容")] [Parameter] public RenderFragment? OperationContent { get; set; } /// /// 主题颜色,默认是 。 /// + [ParameterApiDoc("主题颜色", Value ="Primary")] [Parameter]public override Theme? Theme { get; set; } = Theme.Primary; /// /// 显示的警告图标。 /// + [ParameterApiDoc("显示的警告图标", Value = "InfoCircleFilled")] [Parameter]public override object? Icon { get; set; } = IconName.InfoCircleFilled; /// /// 是否可以关闭。 /// + [ParameterApiDoc("是否可以关闭")] [Parameter] public bool Closable { get; set; } /// /// 当警告消息被关闭后触发的回调方法。 /// + [ParameterApiDoc("当警告消息被关闭后触发的回调方法", Type = "EventCallback")] [Parameter]public EventCallback OnClosed { get; set; } bool Closed { get; set; } diff --git a/src/TDesign/Components/TBadge.cs b/src/TDesign/Components/TBadge.cs index 61c33003..4a2a46dd 100644 --- a/src/TDesign/Components/TBadge.cs +++ b/src/TDesign/Components/TBadge.cs @@ -5,36 +5,38 @@ namespace TDesign; /// 徽章组件,出现在图标或文字右上角的徽标标识。 /// [CssClass("t-badge")] -public class TBadge : TDesignComponentBase, IHasChildContent +public class TBadge : TDesignAdditionParameterWithChildContentComponentBase { - /// - /// - /// - [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 徽章显示的文本。 /// + [ParameterApiDoc("徽章显示的文本")] [Parameter] public string? Text { get; set; } /// /// 小尺寸。 /// + [ParameterApiDoc("使用小尺寸")] [Parameter] public bool Small { get; set; } /// /// 徽章形状,默认是 。 /// + [ParameterApiDoc("徽章形状", Value =$"{nameof(BadgeShape.Circle)}")] [Parameter] public BadgeShape Shape { get; set; } = BadgeShape.Circle; /// /// 徽章的颜色,支持十六进制的字符串。 /// + [ParameterApiDoc("徽章的颜色,支持十六进制的字符串。")] [Parameter] public string? Color { get; set; } /// /// 距离上面的偏移量,单位 px。 /// + [ParameterApiDoc("距离上面的偏移量,单位 px。")] [Parameter] public int? Top { get; set; } /// /// 距离右侧的偏移量,单位 px。 /// + [ParameterApiDoc("距离右侧的偏移量,单位 px")] [Parameter] public int? Right { get; set; } /// diff --git a/src/TDesign/Components/TButton.cs b/src/TDesign/Components/TButton.cs index 50e71a2a..c1b23ac3 100644 --- a/src/TDesign/Components/TButton.cs +++ b/src/TDesign/Components/TButton.cs @@ -11,55 +11,67 @@ public class TButton : TDesignAdditionParameterWithChildContentComponentBase /// /// /// - [Parameter][HtmlAttribute("onclick")] public EventCallback OnClick { get; set; } + [ParameterApiDoc("当按钮被点击时触发的回调方法",Type = "EventCallback")] + [Parameter][HtmlAttribute("onclick")] public EventCallback OnClick { get; set; } /// /// 设置按钮的 HTML 类型。默认时 类型。 /// + [ParameterApiDoc("按钮的 HTML 类型",Value =$"{nameof(ButtonHtmlType.Button)}")] [Parameter][HtmlAttribute("type")] public ButtonHtmlType HtmlType { get; set; } = ButtonHtmlType.Button; /// /// 按钮类型的风格。 /// + [ParameterApiDoc("按钮的 HTML 类型", Value = $"{nameof(ButtonVarient.Base)}")] [Parameter][CssClass("t-button--variant-")] public ButtonVarient Varient { get; set; } = ButtonVarient.Base; /// /// 主题颜色。 /// + [ParameterApiDoc("按钮的主题颜色", Value = $"{nameof(Theme.Default)}")] [Parameter][CssClass("t-button--theme-")] public Theme Theme { get; set; } = Theme.Default; /// /// 幽灵按钮。内容反色,背景变为透明,一般是底色透明 /// + [ParameterApiDoc("幽灵按钮。内容反色,背景变为透明,一般是底色透明")] [Parameter][CssClass("t-button--ghost")] public bool Ghost { get; set; } /// /// 提供大、中(默认)、小三种尺寸。 /// + [ParameterApiDoc("提供大、中(默认)、小三种尺寸",Value =$"{nameof(Size.Medium)}")] [Parameter][CssClass] public Size Size { get; set; } = Size.Medium; /// /// 宽度上充满其所在的父容器。 /// + [ParameterApiDoc("宽度上充满其所在的父容器")] [Parameter][CssClass("t-size-full-width")] public bool Block { get; set; } /// /// 按钮形状。 /// + [ParameterApiDoc("按钮形状", Value = $"{nameof(ButtonShape.Rectangle)}")] [Parameter][CssClass("t-button--shape-")] public ButtonShape Shape { get; set; } = ButtonShape.Rectangle; /// /// 禁用状态。 /// + [ParameterApiDoc("禁用状态")] [Parameter][CssClass("t-is-disabled")][HtmlAttribute] public bool Disabled { get; set; } /// /// 加载状态。 /// + [ParameterApiDoc("加载状态")] [Parameter][CssClass("t-is-loading")] public bool Loading { get; set; } /// /// 设置按钮风格的 HTML 元素名称。默认是 button。 /// - [Parameter] public string? TagName { get; set; } = "button"; + [ParameterApiDoc("按钮风格的 HTML 元素名称", Value ="button")] + [Parameter] public string TagName { get; set; } = "button"; /// /// 图标的名称。 /// + [ParameterApiDoc("在按钮前缀的图标的名称")] [Parameter]public object? Icon { get; set; } /// diff --git a/src/TDesign/Components/TCard.cs b/src/TDesign/Components/TCard.cs index 43a811f3..eb43a603 100644 --- a/src/TDesign/Components/TCard.cs +++ b/src/TDesign/Components/TCard.cs @@ -6,49 +6,54 @@ namespace TDesign; /// 卡片组件。 /// [CssClass("t-card")] -public class TCard : TDesignComponentBase, IHasChildContent +public class TCard : TDesignAdditionParameterWithChildContentComponentBase { - /// - /// - /// - [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 设置不显示边框。 /// + [ParameterApiDoc("不显示边框")] [Parameter][BooleanCssClass("", "t-card--bordered")] public bool Borderless { get; set; } /// /// 鼠标悬停显示阴影。 /// + [ParameterApiDoc("鼠标悬停显示阴影")] [Parameter][CssClass("t-card--shadow-hover")] public bool HoverShadow { get; set; } /// /// 设置是否显示头部内容分割线。 /// + [ParameterApiDoc("显示头部内容分割线")] [Parameter] public bool HeaderDivider { get; set; } /// /// 设置头部内容的标题部分的内容。 /// + [ParameterApiDoc("头部内容的标题部分的内容")] [Parameter] public RenderFragment? HeaderTitleContent { get; set; } /// /// 设置头部内容的副标题部分的内容。 /// + [ParameterApiDoc("头部内容的副标题部分的内容")] [Parameter] public RenderFragment? HeaderSubTitleContent { get; set; } /// /// 设置头部内容的描述部分的内容。 /// + [ParameterApiDoc("头部内容的描述部分的内容")] [Parameter] public RenderFragment? HeaderDescriptionContent { get; set; } /// /// 设置头部内容的操作部分的内容。 /// + [ParameterApiDoc("头部内容的操作部分的内容")] [Parameter] public RenderFragment? HeaderActionContent { get; set; } /// /// 设置卡片的底部内容。 /// + [ParameterApiDoc("卡片的底部内容")] [Parameter] public RenderFragment? FooterContent { get; set; } /// /// 宽度,默认400px. /// + [ParameterApiDoc("宽度,单位px", Value ="400")] [Parameter] public int Width { get; set; } = 400; /// diff --git a/src/TDesign/Components/TComment.cs b/src/TDesign/Components/TComment.cs index 573c1d9e..0fd6fa2d 100644 --- a/src/TDesign/Components/TComment.cs +++ b/src/TDesign/Components/TComment.cs @@ -1,41 +1,40 @@ -using Microsoft.AspNetCore.Components.Rendering; - -namespace TDesign; +namespace TDesign; /// /// 评论用于对页面内容的反馈、评价、讨论等,如对文章的评价,对话题的讨论。 /// [CssClass("t-comment")] -public class TComment : TDesignComponentBase, IHasChildContent +public class TComment : TDesignAdditionParameterWithChildContentComponentBase { /// /// 设置头像的 uri 地址。 /// + [ParameterApiDoc("头像的 uri 地址")] [Parameter] public string? Avatar { get; set; } /// /// 设置作者的名称。 /// + [ParameterApiDoc("作者的名称")] [Parameter] public string? Author { get; set; } /// /// 设置显示的日期时间字符串。 /// + [ParameterApiDoc("显示的日期时间字符串")] [Parameter] public string? DateTime { get; set; } - - /// - /// 设置评论的任意内容。 - /// - [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 设置评论的操作内容。每一个操作需要用 li 标记进行渲染。 /// + [ParameterApiDoc("评论的操作内容。每一个操作需要用 li 标记进行渲染")] [Parameter] public RenderFragment? OperationContent { get; set; } /// /// 设置当前评论的回复内容。 /// + [ParameterApiDoc("当前评论的回复内容")] [Parameter] public RenderFragment? ReplyContent { get; set; } /// /// 设置评论内容的引用内容。 /// + [ParameterApiDoc("评论内容的引用内容")] [Parameter] public RenderFragment? QuateContent { get; set; } protected override void AddContent(RenderTreeBuilder builder, int sequence) diff --git a/src/TDesign/Components/TDivider.cs b/src/TDesign/Components/TDivider.cs index 83717fc9..539cd927 100644 --- a/src/TDesign/Components/TDivider.cs +++ b/src/TDesign/Components/TDivider.cs @@ -7,26 +7,30 @@ namespace TDesign; /// 分割线。 /// [CssClass("t-divider")] -public class TDivider : TDesignComponentBase, IHasChildContent +public class TDivider : TDesignAdditionParameterComponentBase, IHasChildContent { /// /// 分割线的文本。 /// + [ParameterApiDoc("分割线的任意内容")] [Parameter] public RenderFragment? ChildContent { get; set; } /// - /// 垂直分割线。 + /// 是否垂直分割线。 /// + [ParameterApiDoc("是否为垂直分割线")] [Parameter][CssClass("t-divider--vertical")] public bool Vertical { get; set; } /// /// 是否为虚线。 /// + [ParameterApiDoc("是否为虚线")] [Parameter][CssClass("t-divider--dashed")] public bool Dashed { get; set; } /// /// 文字对齐方式。 /// + [ParameterApiDoc("文字对齐方式", Value = "Center")] [Parameter][CssClass("t-divider--with-text-")] public HorizontalAlignment Alignment { get; set; } = HorizontalAlignment.Center; protected override void AddContent(RenderTreeBuilder builder, int sequence) diff --git a/src/TDesign/Components/TIcon.cs b/src/TDesign/Components/TIcon.cs index 5efa0d29..5dbd7f14 100644 --- a/src/TDesign/Components/TIcon.cs +++ b/src/TDesign/Components/TIcon.cs @@ -28,14 +28,17 @@ protected override void OnParametersSet() /// 图标名称。参见 https://tdesign.tencent.com/vue/components/icon 。 /// 可使用 枚举。 /// + [ParameterApiDoc("图标名称。参见 https://tdesign.tencent.com/vue/components/icon。或者使用 IconName 枚举")] [Parameter] public object? Name { get; set; } /// /// 图标的颜色。自由填写支持 color 的字符串,例如颜色名称或16进制表达式(#xxxxxx)。 /// + [ParameterApiDoc("图标的颜色。自由填写支持 color 的字符串,例如颜色名称或16进制表达式(#xxxxxx)。")] [Parameter] public string? Color { get; set; } /// /// 图标的大小。自由填写支持 font-size 的字符串,例如 32px 或 2rem 等。 /// + [ParameterApiDoc("图标的大小。自由填写支持 font-size 的字符串,例如 32px 或 2rem 等。")] [Parameter] public string? Size { get; set; } protected override void BuildCssClass(ICssClassBuilder builder) diff --git a/src/TDesign/Components/TImage.cs b/src/TDesign/Components/TImage.cs index 8ff43fe8..608ed008 100644 --- a/src/TDesign/Components/TImage.cs +++ b/src/TDesign/Components/TImage.cs @@ -6,82 +6,85 @@ namespace TDesign; /// [HtmlTag("div")] [CssClass("t-image__wrapper")] -public class TImage : TDesignComponentBase +public class TImage : TDesignAdditionParameterWithChildContentComponentBase { /// - /// 图片描述 + /// 图片描述。 /// - [Parameter] public string Alt { get; set; } + [ParameterApiDoc("图片描述")] + [Parameter] public string? Alt { get; set; } /// - /// 禁用状态 + /// 禁用状态。 /// - [Parameter] public bool Disabled { get; set; } = false; + [ParameterApiDoc("禁用状态")] + [Parameter] public bool Disabled { get; set; } /// - /// 错误内容 + /// 自定义图片加载失败状态下的显示内容。 /// + [ParameterApiDoc("自定义图片加载失败状态下的显示内容")] [Parameter] public RenderFragment? Error { get; set; } /// - /// 填充模式 + /// 图片填充模式。 /// + [ParameterApiDoc("图片填充模式。", Value =$"{nameof(ImageFitType.Fill)}")] [Parameter] public ImageFitType? Fit { get; set; } = ImageFitType.Fill; /// - /// 是否展示为图集样式 + /// 是否展示为图集样式。 /// + [ParameterApiDoc("是否展示为图集样式")] [Parameter] public bool Gallery { get; set; } /// /// 是否开启图片懒加载 /// - [Parameter] public bool Lazy { get; set; } = false; + [ParameterApiDoc("是否开启图片懒加载")] + [Parameter] public bool Lazy { get; set; } /// /// 加载中状态的图片内容 /// + [ParameterApiDoc("加载中状态的图片内容")] [Parameter] public string? Loading { get; set; } /// /// 图片上方的浮层内容 /// + [ParameterApiDoc("图片上方的浮层内容")] [Parameter] public string? OverlayContent { get; set; } /// /// 浮层 overlayContent 出现的时机 /// + [ParameterApiDoc("浮层 OverlayContent 出现的时机")] [Parameter] public OverlayTriggerType? OverlayTrigger { get; set; } /// - /// 占位元素 + /// 占位元素。 /// + [ParameterApiDoc("占位元素")] [Parameter] public string? Placeholder { get; set; } /// - /// 定位 + /// 定位。 /// - [Parameter] public Position Position { get; set; } = TDesign.Position.Center; + [ParameterApiDoc("定位", Value =$"{nameof(Position.Center)}")] + [Parameter] public Position Position { get; set; } = Position.Center; /// - /// 图片圆角类型 + /// 图片圆角类型。 /// + [ParameterApiDoc("图片圆角类型", Value = $"{nameof(ShapeType.Square)}")] [Parameter][CssClass("t-image__wrapper--shape-")] public ShapeType Shape { get; set; } = ShapeType.Square; /// /// 图片链接 /// - [Parameter] public string? Src { get; set; } - - /// - /// 加载失败 - /// - [Parameter] public Action? OnError { get; set; } - - /// - /// 加载完成 - /// - [Parameter] public Action? OnLoad { get; set; } + [ParameterApiDoc("图片链接")] + [Parameter][EditorRequired] public string? Src { get; set; } protected override void AddContent(RenderTreeBuilder builder, int sequence) { diff --git a/src/TDesign/Components/TLayout.cs b/src/TDesign/Components/TLayout.cs index 2c03b726..b801205f 100644 --- a/src/TDesign/Components/TLayout.cs +++ b/src/TDesign/Components/TLayout.cs @@ -8,27 +8,32 @@ namespace TDesign; [CssClass("t-layout")] [HtmlTag("section")] [ParentComponent] -public class TLayout : TDesignComponentBase, IHasChildContent +public class TLayout : TDesignAdditionParameterComponentBase, IHasChildContent { /// /// 布局的顶部内容。 /// + [ParameterApiDoc("布局的顶部内容")] [Parameter] public RenderFragment? HeaderContent { get; set; } /// /// 布局的右侧内容。 /// + [ParameterApiDoc("布局的右侧内容")] [Parameter] public RenderFragment? LeftSideContent { get; set; } /// /// 布局的左侧部分。 /// + [ParameterApiDoc("布局的左侧部分")] [Parameter] public RenderFragment? RightSideContent { get; set; } /// /// 布局的底部部分。 /// + [ParameterApiDoc("布局的底部部分")] [Parameter] public RenderFragment? FooterContent { get; set; } /// /// 布局的主体部分。 /// + [ParameterApiDoc("布局的主体部分")] [Parameter] public RenderFragment? ChildContent { get; set; } protected override void AddContent(RenderTreeBuilder builder, int sequence) diff --git a/src/TDesign/Components/TLink.cs b/src/TDesign/Components/TLink.cs index 04fc4b55..d3e7ef06 100644 --- a/src/TDesign/Components/TLink.cs +++ b/src/TDesign/Components/TLink.cs @@ -7,28 +7,34 @@ public class TLink : TDesignAdditionParameterWithChildContentComponentBase, IHasDisabled { /// - /// 尺寸。 + /// 文字尺寸。 /// + [ParameterApiDoc("文字的尺寸",Value =$"{nameof(Size.Medium)}")] [Parameter][CssClass] public Size Size { get; set; } = Size.Medium; /// - /// 颜色。 + /// 文字颜色。 /// + [ParameterApiDoc("文字的颜色")] [Parameter][CssClass("t-link--theme-")] public Theme? Theme { get; set; } /// /// 显示超链接的下划线。 /// + [ParameterApiDoc("显示下划线")] [Parameter][CssClass("t-is-underline")] public bool Underline { get; set; } /// /// 设置鼠标悬停时的效果。 /// + [ParameterApiDoc("鼠标悬停时的效果")] [Parameter][CssClass("t-link--hover-")] public LinkHover? Hover { get; set; } /// /// 禁用超链接。 /// + [ParameterApiDoc("禁用超链接")] [Parameter][CssClass("t-is-disabled")] public bool Disabled { get; set; } /// /// 超链接的地址。同 href 属性。 /// + [ParameterApiDoc("超链接的地址")] [Parameter][HtmlAttribute] public string? Href { get; set; } diff --git a/src/TDesign/Components/TPagination.cs b/src/TDesign/Components/TPagination.cs index f34d8972..b6080c97 100644 --- a/src/TDesign/Components/TPagination.cs +++ b/src/TDesign/Components/TPagination.cs @@ -11,16 +11,19 @@ public partial class TPagination : TDesignComponentBase /// /// 设置分页组件的大小。 /// + [ParameterApiDoc("分页组件的大小", Value = "Medium")] [Parameter][CssClass] public Size Size { get; set; } = Size.Medium; #region Current /// /// 设置当前页码。 /// + [ParameterApiDoc("当前页码", Value = "1")] [Parameter] public int PageIndex { get; set; } = 1; /// /// 设置当页码改变时的回调,通常这是双向绑定语法。 /// + [ParameterApiDoc("当页码改变时的回调,通常这是双向绑定语法")] [Parameter] public EventCallback PageIndexChanged { get; set; } #endregion @@ -28,10 +31,12 @@ public partial class TPagination : TDesignComponentBase /// /// 设置每一页的数据量。默认是 10。 /// + [ParameterApiDoc("每一页的数据量。默认是 10", Value = "10")] [Parameter]public int PageSize { get; set; } = 10; /// /// 设置一个当每页数据量变更时的回调方法。 /// + [ParameterApiDoc("当每页数据量变更时的回调方法,通常这是双向绑定语法")] [Parameter] public EventCallback PageSizeChanged { get; set; } #endregion @@ -39,18 +44,22 @@ public partial class TPagination : TDesignComponentBase /// /// 设置分页的总数据量。必须要大于 0。 /// - [Parameter] public int Total { get; set; } + [ParameterApiDoc("分页的总数据量。必须要大于 0")] + [Parameter][EditorRequired] public int Total { get; set; } /// /// 设置一个当总数据量变化时的回调方法。 /// + [ParameterApiDoc("当总数据量变化时的回调方法。通常这是双向绑定语法", Type = "EventCallback")] [Parameter] public EventCallback TotalChanged { get; set; } /// /// 设置显示总数据量的任意内容。 /// + [ParameterApiDoc("显示总数据量的任意内容", Type = "RenderFragment")] [Parameter] public RenderFragment? TotalContent { get; set; } /// /// 设置一个布尔值,表示是否显示总数据量的内容。 /// + [ParameterApiDoc("是否显示总数据量的内容", Value ="true")] [Parameter] public bool ShowTotal { get; set; } = true; #endregion @@ -58,31 +67,37 @@ public partial class TPagination : TDesignComponentBase /// /// 设置分页页码条的显示数量。建议范围在 5-21 之间,默认是 7。 /// + [ParameterApiDoc("分页页码条的显示数量。建议范围在 5-21 之间,建议单数", Value = "7")] [Parameter] public int PageNumber { get; set; } = 7; /// /// 设置是否显示页码条。 /// + [ParameterApiDoc("是否显示页码条", Value = "true")] [Parameter] public bool ShowPageNumber { get; set; } = true; #endregion /// /// 是否显示首页和末页按钮。 /// + [ParameterApiDoc("显示首页和末页按钮")] [Parameter] public bool ShowFirstLastBtn { get; set; } /// - /// 设置当页码数量超出时,前后省略模式。 + /// 设置当页码数量超出时,页码条前后省略模式。 /// + [ParameterApiDoc("当页码数量超出时,页码条前后省略模式", Value = "Middle")] [Parameter] public PageEllipsisMode EllipsisMode { get; set; } = PageEllipsisMode.Middle; #region JumpPage /// - /// 设置是否显示跳转到文本框。 + /// 设置是否显示【跳转到】文本框。 /// + [ParameterApiDoc("是否显示【跳转到】文本框")] [Parameter] public bool ShowJumpPage { get; set; } /// /// 设置为极简版的分页。 /// + [ParameterApiDoc("是否使用极简版的分页")] [Parameter] public bool Simple { get; set; } #endregion #endregion @@ -124,6 +139,7 @@ int TotalPages /// 跳转到指定页。 /// /// 要跳转的页码。 + [MethodApiDoc("跳转到指定页")] public async Task NavigateToPage(int page) { page = page < 1 ? 1 : page; @@ -137,18 +153,22 @@ public async Task NavigateToPage(int page) /// /// 跳转到首页。 /// + [MethodApiDoc("跳转到首页")] public Task NavigateToFirst() => NavigateToPage(1); /// /// 跳转到末页。 /// + [MethodApiDoc("跳转到末页")] public Task NavigateToLast() => NavigateToPage(TotalPages); /// /// 跳转到上一页。 /// + [MethodApiDoc("跳转到上一页")] public Task NavigateToPrevious() => NavigateToPage(--PageIndex); /// /// 跳转到下一页。 /// + [MethodApiDoc("跳转到下一页")] public Task NavigateToNext() => NavigateToPage(++PageIndex); #endregion @@ -381,7 +401,6 @@ void BuildPageNumbers(RenderTreeBuilder builder) /// 构建 跳转到 文本框。 /// /// - /// void BuildJumper(RenderTreeBuilder builder) => builder.Div("t-pagination__jump", ShowJumpPage) .Content(content => diff --git a/src/TDesign/Components/TPopConfirm.cs b/src/TDesign/Components/TPopConfirm.cs index e2fa488c..177d2867 100644 --- a/src/TDesign/Components/TPopConfirm.cs +++ b/src/TDesign/Components/TPopConfirm.cs @@ -20,52 +20,64 @@ public TPopConfirm() /// /// 设置主题颜色。 /// + [ParameterApiDoc("主题颜色", Value ="Default")] [Parameter][CssClass("t-popconfirm__popup--")] public Theme Theme { get; set; } = Theme.Default; /// /// 设置当点击【确认】按钮时的回调。 /// + [ParameterApiDoc("当点击【确认】按钮时的回调", Type = "EventCallback")] [Parameter]public EventCallback OnConfirm { get; set; } /// /// 设置确认按钮的文本。 /// + [ParameterApiDoc("确认按钮的文本", Value = "确定")] [Parameter] public string? ConfirmBtnText { get; set; } = "确定"; /// /// 设置确认按钮的变体样式。 /// + [ParameterApiDoc("确认按钮的变体样式", Value = "Base")] [Parameter] public ButtonVarient ConfirmBtnVarient { get; set; } = ButtonVarient.Base; /// /// 设置确认按钮的主题。 /// + [ParameterApiDoc("确认按钮的主题", Value = "Primary")] [Parameter] public Theme ConfirmBtnTheme { get; set; } = Theme.Primary; /// /// 设置取消按钮的文本。 /// + [ParameterApiDoc("取消按钮的文本", Value = "取消")] [Parameter] public string? CancelBtnText { get; set; } = "取消"; /// /// 设置点击【取消】按钮时的回调。 /// + [ParameterApiDoc("当点击【取消】按钮时的回调", Type = "EventCallback")] [Parameter] public EventCallback OnCancel { get; set; } /// /// 设置取消按钮的变体样式。 /// + [ParameterApiDoc("取消按钮的变体样式", Value = "Outline")] [Parameter] public ButtonVarient CancelBtnVarient { get; set; } = ButtonVarient.Outline; /// /// 设置取消按钮的主题。 /// + [ParameterApiDoc("取消按钮的主题", Value = "Default")] [Parameter] public Theme CancelBtnTheme { get; set; } = Theme.Default; /// /// 设置确认和取消按钮的尺寸。 /// + [ParameterApiDoc("确认和取消按钮的尺寸", Value = "Small")] [Parameter] public Size BtnSize { get; set; } = Size.Small; /// /// 设置确认框的内容。 /// + [ParameterApiDoc("确认框的内容")] [Parameter]public RenderFragment? ConfirmContent { get; set; } /// /// 设置自定义图标。 /// + [ParameterApiDoc("自定义图标", Value = "InfoCircleFilled")] [Parameter] public object? Icon { get; set; } = IconName.InfoCircleFilled; /// diff --git a/src/TDesign/Components/TProgress.cs b/src/TDesign/Components/TProgress.cs index b8e48fbe..7250438f 100644 --- a/src/TDesign/Components/TProgress.cs +++ b/src/TDesign/Components/TProgress.cs @@ -6,43 +6,51 @@ namespace TDesign; /// 展示操作的当前进度的进度条。 /// [CssClass("t-progress")] -public class TProgress : TDesignComponentBase, IHasActive +public class TProgress : TDesignAdditionParameterWithChildContentComponentBase { /// /// 设置是否显示进度条的百分比。true 则显示 的百分比,否则,根据状态显示对应的图标。 /// + [ParameterApiDoc("是否显示进度条的百分比。true 则显示 Value 的百分比,否则,根据状态显示对应的图标。")] [Parameter] public bool ShowLabel { get; set; } /// /// 设置是否隐藏进度条的百分比。 /// true 则不显示百分比和状态图标,即使 已设置。 /// + [ParameterApiDoc("是否隐藏进度条的百分比。true 则不显示百分比和状态图标,即使 ShowLabel 已设置。")] [Parameter] public bool HideLabel { get; set; } /// /// 设置进度条的风格。 /// + [ParameterApiDoc("进度条的风格",Value=$"{nameof(ProgressTheme.Line)}")] [Parameter] public ProgressTheme Theme { get; set; } = ProgressTheme.Line; /// /// 设置进度条的状态。 /// + [ParameterApiDoc("进度条的状态")] [Parameter] public Status? Status { get; set; } /// /// 设置进度条长度的百分比。 /// + [ParameterApiDoc("进度条长度的百分比")] [Parameter] public double Value { get; set; } /// /// 自定义显示标签的内容。否则显示 的百分比。 /// + [ParameterApiDoc("自定义显示标签的内容,否则显示 Value 的百分比")] [Parameter] public string? Label { get; set; } /// /// 设置进度条具备渐变效果。 /// + [ParameterApiDoc("进度条具备渐变效果")] [Parameter] public bool Active { get; set; } /// /// 进度条的大小。 /// + [ParameterApiDoc("进度条的大小", Value = $"{nameof(Size.Medium)}")] [Parameter] public Size Size { get; set; } = Size.Medium; /// diff --git a/src/TDesign/Components/TSkeleton.cs b/src/TDesign/Components/TSkeleton.cs index f88a5f00..4fb41b38 100644 --- a/src/TDesign/Components/TSkeleton.cs +++ b/src/TDesign/Components/TSkeleton.cs @@ -6,30 +6,35 @@ namespace TDesign; /// [ParentComponent] [CssClass("t-skeleton")] -public class TSkeleton : TDesignComponentBase, IHasChildContent +public class TSkeleton : TDesignAdditionParameterWithChildContentComponentBase { /// /// 设置是否显示骨架屏。 /// + [ParameterApiDoc("是否显示骨架屏")] [Parameter][EditorRequired] public bool Loading { get; set; } /// /// 当 false 时显示的内容。 /// - [Parameter] public RenderFragment? ChildContent { get; set; } + [ParameterApiDoc("当 Loading 是 false 时显示的内容。")] + [Parameter] public override RenderFragment? ChildContent { get; set; } /// /// 当 true 时显示的内容。 /// + [ParameterApiDoc("当 Loading 是 true 时显示的内容。")] [Parameter] public RenderFragment? LoadingContent { get; set; } /// /// 设置动画效果。 /// + [ParameterApiDoc("动画效果。")] [Parameter] public SkeletonAnimation? Animation { get; set; } /// /// 设置骨架屏的模式。可以快速设置骨架屏显示的模式。 /// + [ParameterApiDoc("骨架屏的模式。可以快速设置骨架屏显示的模式。", Value =$"{nameof(SkeletonTheme.Paragraph)}")] [Parameter] public SkeletonTheme? Theme { get; set; } = SkeletonTheme.Paragraph; /// @@ -124,8 +129,8 @@ RenderFragment GetThemeContent() [CssClass("t-skeleton__row")] public class TSkeletonRow : TDesignComponentBase, IHasChildContent { - /// + [ParameterApiDoc("需要 TSkeletonColumn 组件的内容")] [Parameter] public RenderFragment? ChildContent { get; set; } } @@ -147,6 +152,7 @@ public class TSkeletonColumn : TDesignComponentBase /// /// 设置列的类型。 /// + [ParameterApiDoc("列的类型", Value =$"{nameof(SkeletonColumnType.Text)}")] [Parameter][CssClass("t-skeleton--type-")] public SkeletonColumnType Type { get; set; } = SkeletonColumnType.Text; /// diff --git a/src/TDesign/Components/TTag.cs b/src/TDesign/Components/TTag.cs index fba6a902..b9b7c391 100644 --- a/src/TDesign/Components/TTag.cs +++ b/src/TDesign/Components/TTag.cs @@ -8,69 +8,79 @@ namespace TDesign; /// [CssClass("t-tag")] [HtmlTag("span")] -public class TTag : TDesignComponentBase, IHasChildContent +public class TTag : TDesignAdditionParameterWithChildContentComponentBase { - /// - /// - /// - [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 主题颜色。 /// + [ParameterApiDoc("主题颜色")] [Parameter] public Theme? Theme { get; set; } /// /// 标签的类型。 /// + [ParameterApiDoc("标签的类型", Value = "Dark")] [Parameter][CssClass("t-tag--")] public TagType Type { get; set; } = TagType.Dark; /// /// 尺寸。 /// + [ParameterApiDoc("尺寸", Value = "Medium")] [Parameter][CssClass] public Size Size { get; set; } = Size.Medium; /// /// 形状。 /// + [ParameterApiDoc("形状")] [Parameter][CssClass("t-tag--")] public TagShape? Shape { get; set; } /// /// 图标的名称。 /// - [Parameter] public object? TIcon { get; set; } + [ParameterApiDoc("图标的名称")] + [Parameter] public object? Icon { get; set; } /// /// 是否可以被关闭。 /// + [ParameterApiDoc("是否可以被关闭")] [Parameter][CssClass("t-tag--close")] public bool Closable { get; set; } /// - /// 设置组件处于禁用状态。 + /// 禁用状态。 /// + [ParameterApiDoc("禁用状态")] [Parameter][CssClass("t-is-disabled t-tag--disabled")] public bool Disabled { get; set; } /// /// 设置一个函数,当关闭发生时触发。 /// + [ParameterApiDoc("设置一个函数,当关闭发生时触发", Type= "EventCallback")] [Parameter] public EventCallback OnClosing { get; set; } /// /// 设置标签作为复选框形式呈现。 /// + [ParameterApiDoc("标签作为复选框形式呈现")] [Parameter][CssClass("t-tag--check")] public bool Checkbox { get; set; } /// /// 获取或设置一个布尔值,表示是否被选中。true 时有效。 /// + [ParameterApiDoc("是否被选中,Checkbox 为 true 时有效")] [Parameter] public bool Checked { get; set; } /// /// 获取或设置一个选择变更时的函数。 /// + [ParameterApiDoc("设置一个选择变更时的函数", Type = "EventCallback")] [Parameter] public EventCallback CheckedChanged { get; set; } /// /// 获取或设置一个选择变更的表达式。 /// + [ParameterApiDoc("一个选择变更的表达式", Type = "Expression>")] [Parameter] public Expression>? CheckedExpression { get; set; } /// /// 设置 true 时显示的内容。 /// + [ParameterApiDoc("Checked 是 true 时显示的内容")] [Parameter] public RenderFragment? CheckedContent { get; set; } /// /// 标签固定的宽度,超长省略,单位px。 /// + [ParameterApiDoc("签固定的宽度,超长省略,单位px")] [Parameter] public int? Width { get; set; } bool IsClosed { get; set; } @@ -91,7 +101,7 @@ protected override void AddContent(RenderTreeBuilder builder, int sequence) } else { - builder.CreateComponent(sequence, attributes: new { Name = TIcon }, condition: TIcon is not null); + builder.CreateComponent(sequence, attributes: new { Name = Icon }, condition: Icon is not null); if (Width.HasValue) { diff --git a/src/TDesign/Components/TTooltip.cs b/src/TDesign/Components/TTooltip.cs index a02abd1c..1e68799f 100644 --- a/src/TDesign/Components/TTooltip.cs +++ b/src/TDesign/Components/TTooltip.cs @@ -8,5 +8,6 @@ public class TTooltip : TPopup /// /// 设置主题颜色。 /// + [ParameterApiDoc("主题颜色",Value ="Default")] [Parameter][CssClass("t-tooltip--")] public Theme Theme { get; set; } = Theme.Default; } diff --git a/src/TDesign/Components/Tab/TTab.cs b/src/TDesign/Components/Tab/TTab.cs index 1de734fb..d767477f 100644 --- a/src/TDesign/Components/Tab/TTab.cs +++ b/src/TDesign/Components/Tab/TTab.cs @@ -7,31 +7,31 @@ namespace TDesign; /// [ParentComponent] [CssClass("t-tabs")] -public class TTab : TDesignComponentBase, IHasChildContent, IHasOnSwitch +public class TTab : TDesignAdditionParameterWithChildContentComponentBase, IHasOnSwitch { public TTab() { SwitchIndex = 0; } /// - /// - /// - [Parameter] public RenderFragment? ChildContent { get; set; } - /// /// 选项卡标题呈现的位置。 /// + [ParameterApiDoc("选项卡标题呈现的位置", Value ="Top")] [Parameter] public Position Position { get; set; } = Position.Top; /// /// 卡片模式。 /// + [ParameterApiDoc("卡片模式")] [Parameter] public bool Card { get; set; } /// /// 选项卡的尺寸。 /// + [ParameterApiDoc("选项卡的尺寸", Value = "Medium")] [Parameter] public TabSize Size { get; set; } = TabSize.Medium; /// - /// + /// 当选项卡切换时触发的回调。 /// + [ParameterApiDoc("当选项卡切换时触发的回调", Type= "EventCallback")] [Parameter] public EventCallback OnSwitch { get; set; } public int? SwitchIndex { get; set; } @@ -125,7 +125,7 @@ void BuildTabHeaderItem(RenderTreeBuilder builder, int sequence) { wrapper.CreateElement(0, "span", title => { - title.CreateComponent(0, attributes: new { Name = tabItem.TIcon, style = "margin-right:4px" }, condition: tabItem!.TIcon is not null); + title.CreateComponent(0, attributes: new { Name = tabItem.Icon, style = "margin-right:4px" }, condition: tabItem!.Icon is not null); title.AddContent(0, tabItem!.Title); }, new { @class = "t-tabs__nav-item-text-wrapper" }); }, new diff --git a/src/TDesign/Components/Tab/TTabItem.cs b/src/TDesign/Components/Tab/TTabItem.cs index 6a19360b..6721ea6a 100644 --- a/src/TDesign/Components/Tab/TTabItem.cs +++ b/src/TDesign/Components/Tab/TTabItem.cs @@ -1,12 +1,10 @@ -using Microsoft.AspNetCore.Components.Rendering; - -namespace TDesign; +namespace TDesign; /// /// 选项卡的项。 /// [ChildComponent(typeof(TTab))] [CssClass("t-tab-panel")] -public class TTabItem : TDesignComponentBase, IHasChildContent +public class TTabItem : TDesignAdditionParameterWithChildContentComponentBase { /// /// 用于自动化获取父组件。 @@ -15,27 +13,27 @@ public class TTabItem : TDesignComponentBase, IHasChildContent /// /// 选项卡标题。 /// + [ParameterApiDoc("选项卡标题")] [EditorRequired][Parameter] public string Title { get; set; } - /// - /// - /// - [Parameter] public RenderFragment? ChildContent { get; set; } ///// ///// 选项卡宽度,单位时 px。 ///// //[Parameter] public int? Width { get; set; } = 82; /// - /// 选项卡内容的内边距,默认时 25px。 + /// 选项卡内容的内边距,默认 25px。 /// + [ParameterApiDoc("选项卡内容的内边距,默认 25px",Value =25)] [Parameter] public int Padding { get; set; } = 25; /// /// 禁用选项卡。 /// + [ParameterApiDoc("禁用选项卡")] [Parameter] public bool Disabled { get; set; } /// /// 选项卡标题的图标。 /// - [Parameter] public object? TIcon { get; set; } + [ParameterApiDoc("选项卡标题的图标")] + [Parameter] public object? Icon { get; set; } internal int Index { get; private set; } diff --git a/src/TDesign/Components/Table/TTable.cs b/src/TDesign/Components/Table/TTable.cs index c95ecb5f..1dcf9821 100644 --- a/src/TDesign/Components/Table/TTable.cs +++ b/src/TDesign/Components/Table/TTable.cs @@ -11,88 +11,107 @@ public partial class TTable : TDesignComponentBase /// /// 设置行索引的键。默认是当前行。 /// + [ParameterApiDoc("行索引的键。默认是当前行", Type = "Func")] [Parameter] public Func ItemKey { get; set; } = x => x!; /// /// 设置表格的数据源。 /// + [ParameterApiDoc("表格的数据源", Type = "DataSource")] [Parameter,EditorRequired] public DataSource Data { get; set; } /// /// 设置是否为自动列宽,默认是固定的。 /// + [ParameterApiDoc("是否为自动列宽,默认是固定的")] [Parameter] public bool AutoWidth { get; set; } /// /// 设置行具备条纹间隔的样式。 /// + [ParameterApiDoc("行具备条纹间隔的样式")] [Parameter][CssClass("t-table--striped")] public bool Striped { get; set; } /// /// 设置列具备边框的样式。 /// + [ParameterApiDoc("列具备边框的样式")] [Parameter][CssClass("t-table--bordered")] public bool Bordered { get; set; } /// /// 设置行具备鼠标悬浮时高亮样式。 /// + [ParameterApiDoc("行具备鼠标悬浮时高亮样式")] [Parameter][CssClass("t-table--hoverable")] public bool Hoverable { get; set; } /// /// 设置表格的尺寸。 /// + [ParameterApiDoc("表格的尺寸", Value =$"{nameof(Size.Medium)}")] [Parameter][CssClass("t-is-")] public Size Size { get; set; } = Size.Medium; /// /// 设置固定列头。 /// + [ParameterApiDoc("固定列头")] [Parameter] public bool FixedHeader { get; set; } /// /// 设置固定底部。 /// + [ParameterApiDoc("固定底部")] [Parameter] public bool FixedFooter { get; set; } /// /// 当固定头部或底部时,表格内容部分的固定高度,单位是 px。 /// + [ParameterApiDoc("当固定头部或底部时,表格内容部分的固定高度,单位是 px")] [Parameter] public int? FixedHeight { get; set; } /// - /// + /// 表格的内容。 /// + [ParameterApiDoc("表格要用到的列组件")] [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 加载中状态。值为 true 会显示默认加载中样式。 /// + [ParameterApiDoc("加载中状态")] [Parameter] public bool Loading { get; set; } /// /// 设置当表格数据是空时显示的自定义内容。 /// + [ParameterApiDoc("当表格数据是空时显示的自定义内容")] [Parameter] public RenderFragment? EmptyContent { get; set; } /// /// 开启分页模式。 /// + [ParameterApiDoc("开启分页模式")] [Parameter] public bool Pagination { get; set; } /// /// 表示当前的页码。 /// + [ParameterApiDoc("当前的页码",Value =1)] [Parameter] public int PageIndex { get; set; } = 1; /// /// 当页码变更时执行的方法。 /// + [ParameterApiDoc("当页码变更时执行的方法", Type = "EventCallback")] [Parameter] public EventCallback PageIndexChanged { get; set; } /// /// 设置每页呈现的数据量。 /// + [ParameterApiDoc("每页呈现的数据量", Value =10)] [Parameter] public int PageSize { get; set; } = 10; /// /// 当数据量变更时执行的方法。 /// + [ParameterApiDoc("当数据量变更时执行的方法", Type = "EventCallback")] [Parameter] public EventCallback PageSizeChanged { get; set; } /// /// 设置表尾的自定义内容。 /// + [ParameterApiDoc("表尾的自定义内容")] [Parameter] public RenderFragment? FooterContent { get; set; } - #region 选中行 /// /// 设置当行被点击选择后的回调方法。 /// + [ParameterApiDoc("当行被点击选择后的回调方法", Type = "EventCallback>")] [Parameter] public EventCallback> OnRowSelected { get; set; } - #endregion + #endregion #region Internal diff --git a/src/TDesign/Components/Table/TTable.method.cs b/src/TDesign/Components/Table/TTable.method.cs index 3e72a6b1..8157e53d 100644 --- a/src/TDesign/Components/Table/TTable.method.cs +++ b/src/TDesign/Components/Table/TTable.method.cs @@ -33,6 +33,7 @@ protected override async Task OnAfterRenderAsync(bool firstRender) /// /// 页码。 /// 数据量。 + [MethodApiDoc("查询数据")] public async Task QueryData(int page = 1, int size = 10) { if (page < 1) @@ -71,6 +72,7 @@ public async Task QueryData(int page = 1, int size = 10) /// /// 总记录数。 /// 小于0。 + [MethodApiDoc("变更总记录数")] public Task ChangeTotalCount(int count) { if (count < 0) @@ -88,6 +90,7 @@ public Task ChangeTotalCount(int count) /// /// 要选择的行索引。 /// 无法找到指定行索引的数据。 + [MethodApiDoc("选中指定索引的行,如果该行被选中,则会取消选中。")] public Task SelectRow(int rowIndex) { if (rowIndex < 0) @@ -129,6 +132,7 @@ public Task SelectRow(int rowIndex) /// 展开/收缩指定索引的行。 /// /// 行索引。 + [MethodApiDoc("展开/收缩指定索引的行。")] public Task ExpandRow(int rowIndex) { var expandColumn = GetColumns>().FirstOrDefault(); diff --git a/src/TDesign/Components/Table/TTableColumnBase.cs b/src/TDesign/Components/Table/TTableColumnBase.cs index 032bbd98..45840f28 100644 --- a/src/TDesign/Components/Table/TTableColumnBase.cs +++ b/src/TDesign/Components/Table/TTableColumnBase.cs @@ -14,24 +14,29 @@ public abstract class TTableColumnBase : BlazorComponentBase /// /// 设置列标题。若设置了 参数,则该参数无效。 /// + [ParameterApiDoc("列标题")] [Parameter] public string? Header { get; set; } /// /// 设置列标题部分的任意 UI 片段。 /// + [ParameterApiDoc("列标题部分的任意 UI 片段")] [Parameter] public RenderFragment? HeaderContent { get; set; } /// /// 设置标题部分的额外 CSS 类字符串。 /// + [ParameterApiDoc("标题部分的额外 CSS 类字符串")] [Parameter]public string? HeaderClass { get; set; } /// /// 设置每一列的额外 CSS 类的字符串。 /// + [ParameterApiDoc("每一列的额外 CSS 类的字符串")] [Parameter] public string? ColumnClass { get; set; } /// /// 设置底部的任意 UI 片段。 /// + [ParameterApiDoc("底部的任意 UI 片段")] [Parameter] public RenderFragment? FooterContent { get; set; } /// diff --git a/src/TDesign/Components/Table/TTableExpandColumn.cs b/src/TDesign/Components/Table/TTableExpandColumn.cs index 51fac887..a47b8437 100644 --- a/src/TDesign/Components/Table/TTableExpandColumn.cs +++ b/src/TDesign/Components/Table/TTableExpandColumn.cs @@ -10,10 +10,12 @@ public class TTableExpandColumn : TTableColumnBase, IHasChildConte /// /// 设置要展开的图标。 /// + [ParameterApiDoc("展开的图标")] [Parameter] public object? Icon { get; set; } = IconName.ChevronRightCircle; /// /// 设置展开的 UI 内容。 /// + [ParameterApiDoc("自定义显示模板", Type = "RenderFragment")] [Parameter] public RenderFragment? ChildContent { get; set; } diff --git a/src/TDesign/Components/Table/TTableFieldColumn.cs b/src/TDesign/Components/Table/TTableFieldColumn.cs index b03f3259..9542d4ce 100644 --- a/src/TDesign/Components/Table/TTableFieldColumn.cs +++ b/src/TDesign/Components/Table/TTableFieldColumn.cs @@ -14,13 +14,15 @@ public class TTableFieldColumn : TTableColumnBase,IHasChild /// /// 设置数据源的字段名称。 /// + [ParameterApiDoc("数据源的字段名称", Type = "Expression>")] [Parameter, EditorRequired] public Expression> Field { get; set; } = default; /// /// 设置字段输出的格式。要符合 的定义。 /// + [ParameterApiDoc("字段输出的格式")] [Parameter] public string? Format { get; set; } - /// + [ParameterApiDoc("自定义显示模板", Type = "RenderFragment")] [Parameter]public RenderFragment? ChildContent { get; set; } protected Func? CellTextFunc { get; private set; } diff --git a/src/TDesign/Components/Timeline/TTimeline.cs b/src/TDesign/Components/Timeline/TTimeline.cs index c23c9fe5..20b09ffd 100644 --- a/src/TDesign/Components/Timeline/TTimeline.cs +++ b/src/TDesign/Components/Timeline/TTimeline.cs @@ -6,29 +6,30 @@ [ParentComponent] [CssClass("t-timeline")] [HtmlTag("ul")] -public class TTimeline : TDesignComponentBase, IHasChildContent +public class TTimeline : TDesignAdditionParameterWithChildContentComponentBase { - /// - [Parameter] public RenderFragment? ChildContent { get; set; } /// /// 设置水平显示。 /// + [ParameterApiDoc("true 为水平显示")] [Parameter][BooleanCssClass("t-timeline-horizontal", "t-timeline-vertical")] public bool Horizontal { get; set; } /// /// 设置标签展示在轴两侧。 /// + [ParameterApiDoc("标签展示在轴两侧")] [Parameter][BooleanCssClass("t-timeline-label--alternate", "t-timeline-label--same")] public bool Alternate { get; set; } - /// /// 设置时间轴的主题,默认是 。 /// + [ParameterApiDoc("时间轴的主题", Value ="Default")] [Parameter] public TimelineTheme Theme { get; set; } = TimelineTheme.Default; /// /// 设置标签信息放在时间轴的位置,当 true 时有效。 /// + [ParameterApiDoc("标签信息放在时间轴的位置,当 Alternate 是 true 有效", Value = "Left")] [Parameter][CssClass("t-timeline-")] public TimelineLabelAlignment LabelAlignment { get; set; } = TimelineLabelAlignment.Left; /// diff --git a/src/TDesign/Components/Timeline/TTimelineItem.cs b/src/TDesign/Components/Timeline/TTimelineItem.cs index 2b79166a..2ed9f05c 100644 --- a/src/TDesign/Components/Timeline/TTimelineItem.cs +++ b/src/TDesign/Components/Timeline/TTimelineItem.cs @@ -8,7 +8,7 @@ namespace TDesign; [ChildComponent(typeof(TTimeline))] [CssClass("t-timeline-item")] [HtmlTag("li")] -public class TTimelineItem : TDesignComponentBase, IHasChildContent,IHasAdditionalClass +public class TTimelineItem : TDesignAdditionParameterWithChildContentComponentBase { /// /// 父组件。 @@ -18,25 +18,26 @@ public class TTimelineItem : TDesignComponentBase, IHasChildContent,IHasAddition #pragma warning restore CS8618 // 在退出构造函数时,不可为 null 的字段必须包含非 null 值。请考虑声明为可以为 null。 /// - [Parameter] public RenderFragment? ChildContent { get; set; } + [ParameterApiDoc("时间轴上的任意内容")] + [Parameter] public override RenderFragment? ChildContent { get; set; } /// /// 标签文本内容。 /// + [ParameterApiDoc("标签文本内容")] [Parameter] public string? Label { get; set; } /// /// 设置节点的颜色。 /// + [ParameterApiDoc("节点的颜色", Value = "Primary")] [Parameter] public Color Color { get; set; } = TDesign.Color.Primary; /// /// 自定义图标的名称。 /// + [ParameterApiDoc("自定义图标的名称")] [Parameter] public object? IconName { get; set; } - /// - [Parameter]public string? AdditionalClass { get; set; } - /// protected override void BuildCssClass(ICssClassBuilder builder) diff --git a/src/TDesign/TDesign.csproj b/src/TDesign/TDesign.csproj index 15704997..516e8240 100644 --- a/src/TDesign/TDesign.csproj +++ b/src/TDesign/TDesign.csproj @@ -6,7 +6,7 @@ TDesign 基于腾讯 TDesign 的 Blazor 企业级组件库。腾讯 TDesign 官方地址:https://tdesign.tencent.com/ William Zhou and Contributors - 0.6 + 0.8 beta-0529 $(Version) $(Version) @@ -126,9 +126,4 @@ - - - - - diff --git a/src/TDesign/TDesignComponentBase.cs b/src/TDesign/TDesignComponentBase.cs index d20ecd8a..bf9fad06 100644 --- a/src/TDesign/TDesignComponentBase.cs +++ b/src/TDesign/TDesignComponentBase.cs @@ -129,7 +129,7 @@ protected virtual async Task TogglePopup() public abstract class TDesignChildContentComponentBase : TDesignComponentBase, IHasChildContent { /// - [Parameter]public RenderFragment? ChildContent { get; set; } + [Parameter]public virtual RenderFragment? ChildContent { get; set; } } /// diff --git a/src/TDesign/Components/TDesignContainer.cs b/src/TDesign/TDesignContainer.cs similarity index 100% rename from src/TDesign/Components/TDesignContainer.cs rename to src/TDesign/TDesignContainer.cs diff --git a/src/TDesign/wwwroot/libs/tdesign-blazor-util.js b/src/TDesign/wwwroot/libs/tdesign-blazor-util.js index 42763c95..5789322a 100644 --- a/src/TDesign/wwwroot/libs/tdesign-blazor-util.js +++ b/src/TDesign/wwwroot/libs/tdesign-blazor-util.js @@ -7,6 +7,9 @@ * @param {Boolean} replace 是否覆盖原有事件,默认为false,需要覆盖时传入true */ setEvent: function (element, name, handler, replace = false) { + if (!element) { + return; + } let functionStored = element[name]; element[name] = function (e) { if (!replace && functionStored) {