docs: fix model and drawer documentation errors (#355)

* docs: fix model and drawer documentation errors * feat: add expand button Co-authored-by: ElderJames <shunjiey@hotmail.com>
2024-12-03 12:37:40 +08:00 · 2020-07-14 13:46:53 +08:00 · 2020-07-14 13:46:53 +08:00 · c1f3371f9c
commit c1f3371f9c
parent 04d0066d75
10 changed files with 54 additions and 31 deletions
--- a/components/icon/Icon.razor.cs
+++ b/components/icon/Icon.razor.cs
@ -70,7 +70,7 @@ namespace AntDesign
                Button?.Icons.Add(icon);
            }

-            ClassMapper.Add("anticon anticon-sync");
+            ClassMapper.Add($"anticon anticon-{Type}");

            await base.OnInitializedAsync();
        }
--- a/components/wwwroot/icons/outline/compress.svg
+++ b/components/wwwroot/icons/outline/compress.svg
@ -0,0 +1,7 @@
+<?xml version="1.0" standalone="no"?>
+<svg t="1569683667781" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13424" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <style type="text/css"></style>
+  </defs>
+  <path d="M326 664H104c-8.8 0-16 7.2-16 16v48c0 8.8 7.2 16 16 16h174v176c0 8.8 7.2 16 16 16h48c8.8 0 16-7.2 16-16V696c0-17.7-14.3-32-32-32zM342 88h-48c-8.8 0-16 7.2-16 16v176H104c-8.8 0-16 7.2-16 16v48c0 8.8 7.2 16 16 16h222c17.7 0 32-14.3 32-32V104c0-8.8-7.2-16-16-16zM920 664H698c-17.7 0-32 14.3-32 32v224c0 8.8 7.2 16 16 16h48c8.8 0 16-7.2 16-16V744h174c8.8 0 16-7.2 16-16v-48c0-8.8-7.2-16-16-16zM920 280H746V104c0-8.8-7.2-16-16-16h-48c-8.8 0-16 7.2-16 16v224c0 17.7 14.3 32 32 32h222c8.8 0 16-7.2 16-16v-48c0-8.8-7.2-16-16-16z" p-id="13425"></path>
+</svg>
--- a/components/wwwroot/icons/outline/expand.svg
+++ b/components/wwwroot/icons/outline/expand.svg
@ -0,0 +1,7 @@
+<?xml version="1.0" standalone="no"?>
+<svg t="1569683683230" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13542" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <style type="text/css"></style>
+  </defs>
+  <path d="M342 88H120c-17.7 0-32 14.3-32 32v224c0 8.8 7.2 16 16 16h48c8.8 0 16-7.2 16-16V168h174c8.8 0 16-7.2 16-16v-48c0-8.8-7.2-16-16-16zM920 664h-48c-8.8 0-16 7.2-16 16v176H682c-8.8 0-16 7.2-16 16v48c0 8.8 7.2 16 16 16h222c17.7 0 32-14.3 32-32V680c0-8.8-7.2-16-16-16zM342 856H168V680c0-8.8-7.2-16-16-16h-48c-8.8 0-16 7.2-16 16v224c0 17.7 14.3 32 32 32h222c8.8 0 16-7.2 16-16v-48c0-8.8-7.2-16-16-16zM904 88H682c-8.8 0-16 7.2-16 16v48c0 8.8 7.2 16 16 16h174v176c0 8.8 7.2 16 16 16h48c8.8 0 16-7.2 16-16V120c0-17.7-14.3-32-32-32z" p-id="13543"></path>
+</svg>
--- a/site/AntBlazor.Docs/Demos/Drawer/demo/drawer_service.md
+++ b/site/AntBlazor.Docs/Demos/Drawer/demo/drawer_service.md
@ -9,9 +9,9 @@ title:

 Drawer 的 service 用法，示例中演示了用户自定义模板、自定义component。

-模板代码：
-Drawer_service.razor
+模板代码：Drawer_service.razor

+``` csharp
@namespace AntDesign
@inherits DrawerTemplate<string, string>

@ -39,6 +39,8 @@ Drawer_service.razor
    }
 }

+```
+
 ## en-US

 Usage of Drawer's service, examples demonstrate user-defined templates, custom components.
--- a/site/AntBlazor.Docs/Demos/Drawer/doc/index.zh-CN.md
+++ b/site/AntBlazor.Docs/Demos/Drawer/doc/index.zh-CN.md
@ -45,7 +45,7 @@ subtitle: 抽屉
 | CreateAsync | 创建并打开一个 Drawer | `DrawerConfig`  | `DrawerRef` |
 | CreateAsync | 创建并打开一个 Drawer | `DrawerConfig` , TContentParams  | `DrawerRef<R>` |

-### DrawerConfig
+### DrawerOptions

 | 参数                | 说明                                                                                                                 | 类型                                                                | 默认值    |
 | ------------------- | -------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------- | --------- |
--- a/site/AntBlazor.Docs/Demos/Modal/demo/modal_service.md
+++ b/site/AntBlazor.Docs/Demos/Modal/demo/modal_service.md
@ -9,10 +9,9 @@ title:

 Modal 的 service 用法，示例中演示了用户自定义模板、自定义component。

-模板代码：
-ModalTemplateDemo.razor
+模板代码：ModalTemplateDemo.razor

-```
+``` c#
@inherits ModalTemplate<string, string>

 <div>
--- a/site/AntBlazor.Docs/Demos/Modal/doc/index.en-US.md
+++ b/site/AntBlazor.Docs/Demos/Modal/doc/index.en-US.md
@ -55,10 +55,11 @@ There are five ways to display the information based on the content's nature:
 - `ModalService.Error`
 - `ModalService.Warning`
 - `ModalService.Confirm`
+- `ModalService.CreateAsync`

 > Please confirm that the `<AntContainer />` component has been added to `App.Razor`.

-The items listed above are all functions, expecting a settings object as parameter. The properties of the object are follows:
+#### ConfirmOptions

 | CancelText        | Text  of the Cancel button with Modal.confirm                | string                         | Cancel  |
 | ----------------- | ------------------------------------------------------------ | ------------------------------ | ------- |
@ -81,13 +82,13 @@ The items listed above are all functions, expecting a settings object as paramet

 All the `ModalService.Method`s will return a reference, and then we can update and close the modal dialog by the reference.

-```jsx
+``` c#
 ConfirmOptions config = new ConfirmOptions();
-ModalService.Info(config);
+var modelRef = await ModalService.Info(config);

-ModalService.Update(config);
+modelRef.UpdateConfig();

-ModalService.Destroy(config);
+ModalService.Destroy(modelRef);
 ```

 - `ModalService.DestroyAll`
--- a/site/AntBlazor.Docs/Demos/Modal/doc/index.zh-CN.md
+++ b/site/AntBlazor.Docs/Demos/Modal/doc/index.zh-CN.md
@ -58,10 +58,11 @@ title: Modal
 - `ModalService.Error`
 - `ModalService.Warning`
 - `ModalService.Confirm`
+- `ModalService.CreateAsync`

 > 请确认已经在 `App.Razor` 中添加了 `<AntContainer />` 组件。

-以上均为一个函数，参数为 ConfirmOptions，具体属性如下：
+#### ConfirmOptions

 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
@ -84,15 +85,17 @@ title: Modal

 以上函数调用后，会返回一个引用，可以通过该引用更新和关闭弹窗。

-```c#
+``` c#
 ConfirmOptions config = new ConfirmOptions();
-ModalService.Info(config);
+var modelRef = await ModalService.Info(config);

-ModalService.Update(config);
+modelRef.UpdateConfig();

-ModalService.Destroy(config);
+ModalService.Destroy(modelRef);
 ```

 - `ModalService.DestroyAll`

 使用 `ModalService.DestroyAll()` 可以销毁弹出的确认窗（即上述的 ModalService.Info、ModalService.Success、ModalService.Error、ModalService.Warning、ModalService.Confirm）。通常用于路由监听当中，处理路由前进、后退不能销毁确认对话框的问题，而不用各处去使用实例的返回值进行关闭（ModalService.Destroy(config) 适用于主动关闭，而不是路由这样被动关闭）
+
+
--- a/site/AntBlazor.Docs/Pages/Components.razor
+++ b/site/AntBlazor.Docs/Pages/Components.razor
@ -23,17 +23,19 @@
                <h2 data-scrollama-index="1">
                    @LanguageService.Resources["Examples"]
                    <span class="all-code-box-controls">
-                        <span role="img" aria-label="code" tabindex="-1" class="anticon anticon-code code-box-expand-trigger">
-                            <svg viewBox="64 64 896 896" focusable="false" class="" data-icon="code" width="1em" height="1em" fill="currentColor" aria-hidden="true">
-                                <path d="M516 673c0 4.4 3.4 8 7.5 8h185c4.1 0 7.5-3.6 7.5-8v-48c0-4.4-3.4-8-7.5-8h-185c-4.1 0-7.5 3.6-7.5 8v48zm-194.9 6.1l192-161c3.8-3.2 3.8-9.1 0-12.3l-192-160.9A7.95 7.95 0 00308 351v62.7c0 2.4 1 4.6 2.9 6.1L420.7 512l-109.8 92.2a8.1 8.1 0 00-2.9 6.1V673c0 6.8 7.9 10.5 13.1 6.1zM880 112H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32zm-40 728H184V184h656v656z"></path>
-                            </svg>
-                        </span>
-                        <span role="img" aria-label="bug" tabindex="-1" class="anticon anticon-bug code-box-expand-trigger">
-                            <svg viewBox="64 64 896 896" focusable="false" class="" data-icon="bug" width="1em" height="1em" fill="currentColor" aria-hidden="true">
-                                <path d="M304 280h56c4.4 0 8-3.6 8-8 0-28.3 5.9-53.2 17.1-73.5 10.6-19.4 26-34.8 45.4-45.4C450.9 142 475.7 136 504 136h16c28.3 0 53.2 5.9 73.5 17.1 19.4 10.6 34.8 26 45.4 45.4C650 218.9 656 243.7 656 272c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8 0-40-8.8-76.7-25.9-108.1a184.31 184.31 0 00-74-74C596.7 72.8 560 64 520 64h-16c-40 0-76.7 8.8-108.1 25.9a184.31 184.31 0 00-74 74C304.8 195.3 296 232 296 272c0 4.4 3.6 8 8 8z"></path>
-                                <path d="M940 512H792V412c76.8 0 139-62.2 139-139 0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8a63 63 0 01-63 63H232a63 63 0 01-63-63c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8 0 76.8 62.2 139 139 139v100H84c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h148v96c0 6.5.2 13 .7 19.3C164.1 728.6 116 796.7 116 876c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8 0-44.2 23.9-82.9 59.6-103.7a273 273 0 0022.7 49c24.3 41.5 59 76.2 100.5 100.5S460.5 960 512 960s99.8-13.9 141.3-38.2a281.38 281.38 0 00123.2-149.5A120 120 0 01836 876c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8 0-79.3-48.1-147.4-116.7-176.7.4-6.4.7-12.8.7-19.3v-96h148c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM716 680c0 36.8-9.7 72-27.8 102.9-17.7 30.3-43 55.6-73.3 73.3C584 874.3 548.8 884 512 884s-72-9.7-102.9-27.8c-30.3-17.7-55.6-43-73.3-73.3A202.75 202.75 0 01308 680V412h408v268z"></path>
-                            </svg>
-                        </span>
+                        @if (_demoComponent.Cols != 1)
+                        {
+                            @if (_expanded)
+                            {
+                                <Icon Type="compress" Class="code-box-expand-trigger" OnClick="() => _expanded = false "/>
+                            }
+                            else
+                            {
+                                <Icon Type="expand" Class="code-box-expand-trigger"  OnClick="() => _expanded = true "/>
+                            }
+                        }
+                        <Icon Type="code" Class="code-box-expand-trigger" />
+                        <Icon Type="bug" Class="code-box-expand-trigger" />
                    </span>
                </h2>
            </section>
@ -41,7 +43,7 @@
                @{
                    var demos = _demoComponent.DemoList.Where(x => !x.Debug).OrderBy(x => x.Order);
                }
-                @if (_demoComponent.Cols.HasValue && _demoComponent.Cols == 1)
+                @if ( _demoComponent.Cols == 1 || _expanded)
                {
                    foreach (var demo in demos)
                    {
@ -62,11 +64,11 @@
                        }
                    </AntDesign.Col>
                    <AntDesign.Col Span="12" Class="code-boxes-col-2-1" Style="padding-left: 8px; padding-right: 8px;">
-                                                                              @foreach (var demo in rightList)
+                        @foreach (var demo in rightList)
                        {
                            <CodeBox Demo="demo" @key="@($"{_demoComponent.Title}-{demo.Title}")" ComponentName="@_demoComponent.Title"></CodeBox>
                        }
-                </AntDesign.Col>
+                    </AntDesign.Col>
                }

            </Row>
--- a/site/AntBlazor.Docs/Pages/Components.razor.cs
+++ b/site/AntBlazor.Docs/Pages/Components.razor.cs
@ -23,6 +23,8 @@ namespace AntDesign.Docs.Pages

        private DemoComponent _demoComponent;

+        private bool _expanded;
+
        private string CurrentLanguage => LanguageService.CurrentCulture.Name;

        protected override async Task OnInitializedAsync()