From 38472502e9eaf8c9ff81b22ed91b3e8f34429556 Mon Sep 17 00:00:00 2001
From: Hsuan Lee <HsuanGM@gmail.com>
Date: Mon, 15 Jul 2019 15:46:49 +0800
Subject: [PATCH] fix(module:modal): buttons cannot disable when confirm mode
 (#3707)

* fix(module:modal): buttons cannot disable when confirm mode

close #3679

* fix: fix build
---
 components/modal/nz-modal.component.html | 14 ++++++++++++--
 components/modal/nz-modal.component.ts   |  2 +-
 components/modal/nz-modal.spec.ts        | 18 ++++++++++++++++++
 3 files changed, 31 insertions(+), 3 deletions(-)

diff --git a/components/modal/nz-modal.component.html b/components/modal/nz-modal.component.html
index e58510f9398..4a6873790b8 100644
--- a/components/modal/nz-modal.component.html
+++ b/components/modal/nz-modal.component.html
@@ -112,10 +112,20 @@
         </div>
       </div>
       <div class="ant-modal-confirm-btns">
-        <button nz-button *ngIf="nzCancelText!==null" (click)="onClickOkCancel('cancel')" [nzLoading]="nzCancelLoading">
+        <button *ngIf="nzCancelText!==null"
+          nz-button
+          (click)="onClickOkCancel('cancel')"
+          [nzLoading]="nzCancelLoading"
+          [disabled]="nzCancelDisabled">
           {{ cancelText }}
         </button>
-        <button *ngIf="nzOkText!==null" #autoFocusButtonOk nz-button [nzType]="nzOkType" (click)="onClickOkCancel('ok')" [nzLoading]="nzOkLoading">
+        <button #autoFocusButtonOk
+          *ngIf="nzOkText!==null"
+          nz-button
+          (click)="onClickOkCancel('ok')"
+          [nzType]="nzOkType"
+          [nzLoading]="nzOkLoading"
+          [disabled]="nzOkDisabled">
           {{ okText }}
         </button>
       </div>
diff --git a/components/modal/nz-modal.component.ts b/components/modal/nz-modal.component.ts
index 894a169933c..92eea72bb5d 100644
--- a/components/modal/nz-modal.component.ts
+++ b/components/modal/nz-modal.component.ts
@@ -86,7 +86,7 @@ export class NzModalComponent<T = any, R = any> extends NzModalRef<T, R>
   @Input() nzBodyStyle: object;
   @Input() nzOkText: string | null;
   @Input() nzCancelText: string | null;
-  @Input() nzOkType = 'primary';
+  @Input() nzOkType: string = 'primary';
   @Input() nzIconType: string = 'question-circle'; // Confirm Modal ONLY
   @Input() nzModalType: ModalType = 'default';
 
diff --git a/components/modal/nz-modal.spec.ts b/components/modal/nz-modal.spec.ts
index 99cadbc8115..509b3e0d8f7 100644
--- a/components/modal/nz-modal.spec.ts
+++ b/components/modal/nz-modal.spec.ts
@@ -317,6 +317,17 @@ describe('modal testing (legacy)', () => {
       ids.forEach(id => expectModalDestroyed(id, false));
     }));
 
+    it('should disable buttons', fakeAsync(() => {
+      const modalRef = instance.createDisabledModal();
+      fixture.detectChanges();
+      flush();
+      fixture.detectChanges();
+      const buttons = modalRef.getElement().querySelectorAll('.ant-modal-confirm-btns button') as NodeListOf<
+        HTMLButtonElement
+      >;
+      buttons.forEach(button => expect(button.disabled).toBe(true));
+    }));
+
     it('should render content with component', fakeAsync(() => {
       const modalRef = instance.createCustomContentWithComponent();
       const modalElement = modalRef.getElement();
@@ -931,6 +942,13 @@ export class TestConfirmModalComponent {
       nzContent: TestConfirmCustomComponent
     });
   }
+
+  createDisabledModal(): NzModalRef {
+    return this.modalService.confirm({
+      nzCancelDisabled: true,
+      nzOkDisabled: true
+    });
+  }
 }
 
 @Component({