添加Ng-Zorro树形TagHelper

Author: UtilCore

sample/Util.Samples.Angular.AntDesign/Apis/Demo/TableController.cs

@@ -1,6 +1,5 @@
 using System.Collections.Generic;
 using System.Linq;
-using System.Threading;
 using System.Threading.Tasks;
 using Microsoft.AspNetCore.Mvc;
 using Util.Biz.Enums;
@@ -23,6 +22,7 @@ public async Task<IActionResult> GetEmptyPageList( QueryParameter parameter ) {
             var result = new PagerList<UserModel>( parameter.Page, parameter.PageSize, CreateList().Count );
             return Success( result );
         }
+
         /// <summary>
         /// 获取分页列表
         /// </summary>

sample/Util.Samples.Angular.AntDesign/Apis/Demo/TreeController.cs

@@ -0,0 +1,81 @@
+using System.Collections.Generic;
+using Microsoft.AspNetCore.Mvc;
+using Util.Datas.Queries;
+using Util.Ui.Data;
+using Util.Ui.Zorro.Enums;
+using Util.Webs.Controllers;
+
+namespace Util.Samples.Apis.Demo {
+    /// <summary>
+    /// 树形控制器
+    /// </summary>
+    public class TreeController : WebApiControllerBase {
+        /// <summary>
+        /// 获取树形列表
+        /// </summary>
+        [HttpGet( "tree-list" )]
+        public IActionResult GetTreeNodes( QueryParameter parameter ) {
+            var list = new List<TreeDto> { GetNode1(), GetNode2(), GetNode3(), GetNode4(), GetNode5() };
+            var result = new TreeResult( list ).GetResult();
+            return Success( result );
+        }
+
+        /// <summary>
+        /// 获取节点1
+        /// </summary>
+        private TreeDto GetNode1() {
+            return new TreeDto {
+                Id = "1",
+                Text = "测试节点1",
+                Icon = AntDesignIcon.Alibaba.Description()
+            };
+        }
+
+        /// <summary>
+        /// 获取节点2
+        /// </summary>
+        private TreeDto GetNode2() {
+            return new TreeDto {
+                Id = "2",
+                ParentId = "1",
+                Text = "测试节点2",
+                Enabled = false
+            };
+        }
+
+        /// <summary>
+        /// 获取节点3
+        /// </summary>
+        private TreeDto GetNode3() {
+            return new TreeDto {
+                Id = "3",
+                Text = "测试节点3",
+                Selected = true,
+                DisableCheckbox = true
+            };
+        }
+
+        /// <summary>
+        /// 获取节点4
+        /// </summary>
+        private TreeDto GetNode4() {
+            return new TreeDto {
+                Id = "4",
+                ParentId = "1",
+                Text = "测试节点4",
+            };
+        }
+
+        /// <summary>
+        /// 获取节点5
+        /// </summary>
+        private TreeDto GetNode5() {
+            return new TreeDto {
+                Id = "5",
+                ParentId = "4",
+                Text = "测试节点5",
+                Selected = true
+            };
+        }
+    }
+}

sample/Util.Samples.Angular.AntDesign/Apis/Home/MenuController.cs

@@ -76,6 +76,16 @@ private MenuInfo GetDemoMenu() {
                                 Link = "/demo/list/table-list"
                             }
                         }
+                    },
+                    new MenuInfo {
+                        Text = "树形",
+                        Icon = "anticon anticon-edit",
+                        Children = {
+                            new MenuInfo {
+                                Text = "树形",
+                                Link = "/demo/trees/tree"
+                            }
+                        }
                     }
                 }
             };

sample/Util.Samples.Angular.AntDesign/Apis/Systems/RoleController.cs

@@ -0,0 +1,46 @@
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Mvc;
+using Util.Samples.Service.Abstractions.Systems;
+using Util.Samples.Service.Dtos.Systems;
+using Util.Samples.Service.Queries.Systems;
+using Util.Ui.Controllers;
+
+namespace Util.Samples.Apis.Systems {
+    /// <summary>
+    /// 角色控制器
+    /// </summary>
+    public class RoleController : ZorroTreeControllerBase<RoleDto, RoleQuery> {
+        /// <summary>
+        /// 初始化角色控制器
+        /// </summary>
+        /// <param name="service">角色服务</param>
+        public RoleController( IRoleService service ) : base( service ) {
+            RoleService = service;
+        }
+
+        /// <summary>
+        /// 角色服务
+        /// </summary>
+        public IRoleService RoleService { get; }
+
+        /// <summary>
+        /// 创建角色
+        /// </summary>
+        /// <param name="request">创建角色请求参数</param>
+        [HttpPost]
+        public async Task<IActionResult> CreateAsync( [FromBody]CreateRoleRequest request ) {
+            var id = await RoleService.CreateAsync( request );
+            return Success( id );
+        }
+
+        /// <summary>
+        /// 修改角色
+        /// </summary>
+        /// <param name="request">修改角色请求参数</param>
+        [HttpPut]
+        public async Task<IActionResult> UpdateAsync( [FromBody] UpdateRoleRequest request ) {
+            await RoleService.UpdateAsync( request );
+            return Success();
+        }
+    }
+}

sample/Util.Samples.Angular.AntDesign/Pages/Components/Forms/Form.cshtml

@@ -30,7 +30,10 @@
             <util-switch for="Enabled"></util-switch>
         </nz-form-item>
         <nz-form-item>
-            <util-radio for="Enabled" ></util-radio>
+            <util-radio for="Enabled"></util-radio>
+        </nz-form-item>
+        <nz-form-item>
+            <util-tree url="/api/tree/tree-list" show-checkbox="true"></util-tree>
         </nz-form-item>
         <nz-form-item>
             <nz-form-control>

sample/Util.Samples.Angular.AntDesign/Pages/Demo/Trees/Tree.cshtml

@@ -0,0 +1,6 @@
+@page
+<page-header [title]="'树形'"></page-header>
+<nz-card [nzBordered]="false">
+    <util-tree url="/api/role" query-param="queryParam" show-checkbox="true"></util-tree>
+</nz-card>
+

sample/Util.Samples.Angular.AntDesign/Typings/app/demo/demo-routing.module.ts

@@ -7,6 +7,9 @@ import { BasicFormComponent } from "./forms/basic-form.component";
 //列表组件
 import { TableListComponent } from "./list/table-list.component";
 
+//树组件
+import { TreeComponent } from "./trees/tree.component";
+
 //路由配置
 const routes: Routes = [
     {
@@ -20,6 +23,12 @@ const routes: Routes = [
             children: [
                 { path: 'table-list', component: TableListComponent }
         ]
+    },
+    {
+        path: 'trees',
+        children: [
+            { path: 'tree', component: TreeComponent }
+        ]
     }
 ];
 

sample/Util.Samples.Angular.AntDesign/Typings/app/demo/demo.module.ts

@@ -12,14 +12,18 @@ import { BasicFormComponent } from "./forms/basic-form.component";
 //列表组件
 import { TableListComponent } from "./list/table-list.component";
 
+//树组件
+import { TreeComponent } from "./trees/tree.component";
+
 /**
  * Demo模块
  */
 @NgModule( {
     imports: [FrameworkModule, DemoRoutingModule],
     declarations: [
         BasicFormComponent,
-        TableListComponent
+        TableListComponent,
+        TreeComponent
     ]
 } )
 export class DemoModule { }

sample/Util.Samples.Angular.AntDesign/Typings/app/demo/trees/model/role-query.ts

@@ -0,0 +1,55 @@
+import { TreeQueryParameter } from '../../../../util';
+
+/**
+ * 角色查询参数
+ */
+export class RoleQuery extends TreeQueryParameter {
+    /**
+     * 角色编号
+     */
+    roleId;
+    /**
+     * 角色编码
+     */
+    code;
+    /**
+     * 角色名称
+     */
+    name;
+    /**
+     * 角色类型
+     */
+    type;
+    /**
+     * 管理员
+     */
+    isAdmin;
+    /**
+     * 级数
+     */
+    level;
+    /**
+     * 启用
+     */
+    enabled;
+    /**
+     * 备注
+     */
+    comment;
+    /**
+     * 拼音简码
+     */
+    pinYin;
+    /**
+     * 起始创建时间
+     */
+    beginCreationTime;
+    /**
+     * 结束创建时间
+     */
+    endCreationTime;
+    /**
+     * 创建人编号
+     */
+    creatorId;
+}

sample/Util.Samples.Angular.AntDesign/Typings/app/demo/trees/model/role-view-model.ts

@@ -0,0 +1,31 @@
+import { TreeViewModel } from '../../../../util';
+
+/**
+ * 角色视图模型
+ */
+export class RoleViewModel extends TreeViewModel {
+    /**
+     * 角色编码
+     */
+    code;
+    /**
+     * 角色名称
+     */
+    name;
+    /**
+     * 角色类型
+     */
+    type;
+    /**
+     * 管理员
+     */
+    isAdmin;
+    /**
+     * 备注
+     */
+    comment;
+    /**
+     * 版本号
+     */
+    version;
+}

sample/Util.Samples.Angular.AntDesign/Typings/app/demo/trees/tree.component.ts

@@ -0,0 +1,31 @@
+import { Component, Injector } from '@angular/core';
+import { ComponentBase } from '../../../util';
+import { env } from '../../env';
+import { RoleQuery } from './model/role-query';
+
+@Component({
+    selector: 'app-table-list',
+    templateUrl: !env.dev() ? './html/tree.component.html' : '/View/Demo/Trees/Tree',
+})
+export class TreeComponent extends ComponentBase {
+    /**
+     * 查询参数
+     */
+    queryParam: RoleQuery;
+
+    /**
+     * 初始化
+     * @param injector 注入器
+     */
+    constructor( injector: Injector ) {
+        super( injector );
+        this.queryParam = this.createQuery();
+    }
+
+    /**
+     * 创建查询参数
+     */
+    protected createQuery() {
+        return new RoleQuery();
+    }
+}

sample/Util.Samples.Angular.AntDesign/Typings/util/core/file-info.ts

@@ -1,5 +1,5 @@
 //============== 模型=========================
-//Copyright 2018 何镇汐
+//Copyright 2019 何镇汐
 //Licensed under the MIT license
 //================================================