From 5129f7398db336eb6ccb78af3c0c076261782171 Mon Sep 17 00:00:00 2001
From: simplejason <tangjie@yinspect.com>
Date: Mon, 15 Apr 2019 17:05:49 +0800
Subject: [PATCH] feat(module: tree): support nzBlockNode (#3270)

---
 components/tree/demo/draggable-confirm.ts |  2 +-
 components/tree/demo/draggable.ts         | 11 ++---------
 components/tree/doc/index.en-US.md        |  1 +
 components/tree/doc/index.zh-CN.md        |  1 +
 components/tree/nz-tree.component.ts      |  2 ++
 components/tree/nz-tree.spec.ts           |  7 +++++++
 6 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/components/tree/demo/draggable-confirm.ts b/components/tree/demo/draggable-confirm.ts
index 6db476001f9..a41f69127d5 100644
--- a/components/tree/demo/draggable-confirm.ts
+++ b/components/tree/demo/draggable-confirm.ts
@@ -6,7 +6,7 @@ import { delay } from 'rxjs/operators';
 @Component({
   selector: 'nz-demo-tree-draggable-confirm',
   template: `
-    <nz-tree [nzData]="nodes" nzDraggable [nzBeforeDrop]="beforeDrop"> </nz-tree>
+    <nz-tree [nzData]="nodes" nzDraggable nzBlockNode [nzBeforeDrop]="beforeDrop"> </nz-tree>
   `
 })
 export class NzDemoTreeDraggableConfirmComponent implements OnInit {
diff --git a/components/tree/demo/draggable.ts b/components/tree/demo/draggable.ts
index ee059974ec5..42269bcec50 100644
--- a/components/tree/demo/draggable.ts
+++ b/components/tree/demo/draggable.ts
@@ -4,15 +4,8 @@ import { NzFormatEmitEvent } from 'ng-zorro-antd';
 @Component({
   selector: 'nz-demo-tree-draggable',
   template: `
-    <nz-tree [nzData]="nodes" nzDraggable (nzOnDrop)="nzEvent($event)"> </nz-tree>
-  `,
-  styles: [
-    `
-      :host ::ng-deep .draggable-tree .ant-tree-node-content-wrapper {
-        width: calc(100% - 42px);
-      }
-    `
-  ]
+    <nz-tree [nzData]="nodes" nzDraggable nzBlockNode (nzOnDrop)="nzEvent($event)"> </nz-tree>
+  `
 })
 export class NzDemoTreeDraggableComponent implements OnInit {
   nodes = [
diff --git a/components/tree/doc/index.en-US.md b/components/tree/doc/index.en-US.md
index 7d937e41336..ed83f42fc57 100644
--- a/components/tree/doc/index.en-US.md
+++ b/components/tree/doc/index.en-US.md
@@ -15,6 +15,7 @@ Almost anything can be represented in a tree structure. Examples include directo
 | Property | Description | Type | Default |
 | -------- | ----------- | ---- | ------- |
 | `[nzData]` | Tree data (Reference NzTreeNode) | `NzTreeNodeOptions[]｜NzTreeNode[]` | `[]` |
+| `[nzBlockNode]` | Whether treeNode fill remaining horizontal space | `boolean` | `false` |
 | `[nzCheckable]` | Adds a Checkbox before the treeNodes| `boolean` | `false` |
 | `[nzShowExpand]` | Show a Expand Icon before the treeNodes | `boolean` | `true` |
 | `[nzShowLine]` | Shows a connecting line | `boolean` | `false` |
diff --git a/components/tree/doc/index.zh-CN.md b/components/tree/doc/index.zh-CN.md
index 4e6a834af4e..d99d3d8ade8 100644
--- a/components/tree/doc/index.zh-CN.md
+++ b/components/tree/doc/index.zh-CN.md
@@ -16,6 +16,7 @@ subtitle: 树形控件
 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
 | `[nzData]` | 元数据 | `NzTreeNodeOptions[]｜NzTreeNode[]` | `[]` |
+| `[nzBlockNode]` | 是否节点占据一行 | `boolean` | `false` |
 | `[nzCheckable]` | 节点前添加 Checkbox 复选框 | `boolean` | `false` |
 | `[nzShowExpand]` | 节点前添加展开图标 | `boolean` | `true` |
 | `[nzShowLine]` | 是否展示连接线 | `boolean` | `false` |
diff --git a/components/tree/nz-tree.component.ts b/components/tree/nz-tree.component.ts
index 23bce915337..351dd79f49d 100644
--- a/components/tree/nz-tree.component.ts
+++ b/components/tree/nz-tree.component.ts
@@ -65,6 +65,7 @@ export class NzTreeComponent implements OnInit, OnDestroy, ControlValueAccessor,
   @Input() @InputBoolean() nzHideUnMatched = false;
   @Input() @InputBoolean() nzSelectMode = false;
   @Input() @InputBoolean() nzCheckStrictly = false;
+  @Input() @InputBoolean() nzBlockNode = false;
   /**
    * @deprecated use
    * nzExpandAll instead
@@ -229,6 +230,7 @@ export class NzTreeComponent implements OnInit, OnDestroy, ControlValueAccessor,
       [this.prefixCls]: true,
       [this.prefixCls + '-show-line']: this.nzShowLine,
       [`${this.prefixCls}-icon-hide`]: !this.nzShowIcon,
+      [`${this.prefixCls}-block-node`]: this.nzBlockNode,
       ['draggable-tree']: this.nzDraggable,
       ['ant-select-tree']: this.nzSelectMode
     };
diff --git a/components/tree/nz-tree.spec.ts b/components/tree/nz-tree.spec.ts
index 52ed7a50dd6..c9d856d3548 100644
--- a/components/tree/nz-tree.spec.ts
+++ b/components/tree/nz-tree.spec.ts
@@ -398,6 +398,12 @@ describe('nz-tree', () => {
       expect(treeInstance).toBeTruthy();
     });
 
+    it('test nzBlockNode property', () => {
+      fixture.detectChanges();
+      const tree = treeElement.querySelector('.ant-tree') as HTMLElement;
+      expect(tree!.classList).toContain('ant-tree-block-node');
+    });
+
     it('test drag event', fakeAsync(() => {
       fixture.detectChanges();
       const dragStartSpy = spyOn(treeInstance, 'onDragStart');
@@ -729,6 +735,7 @@ export class NzTestTreeBasicControlledComponent {
   selector: 'nz-demo-tree-draggable',
   template: `
     <nz-tree
+      nzBlockNode
       [nzData]="nodes"
       nzDraggable="true"
       [nzBeforeDrop]="beforeDrop"