From 5ff98216002da5c9fc23a9d9c8bd4d3b68495d51 Mon Sep 17 00:00:00 2001 From: WwwHhhYran <62340860+WwwHhhYran@users.noreply.github.com> Date: Thu, 14 Nov 2024 15:49:53 +0800 Subject: [PATCH] fix(module:transfer): cancel selecting all should emit `nzSelectChange` event (#8872) --- components/transfer/interface.ts | 1 + components/transfer/transfer-list.component.ts | 12 ++++++++++-- components/transfer/transfer.component.ts | 7 ++----- components/transfer/transfer.spec.ts | 7 +++++++ 4 files changed, 20 insertions(+), 7 deletions(-) diff --git a/components/transfer/interface.ts b/components/transfer/interface.ts index b3f271828c4..e8d168b689b 100644 --- a/components/transfer/interface.ts +++ b/components/transfer/interface.ts @@ -44,6 +44,7 @@ export interface TransferStat { checkHalf: boolean; checkCount: number; shownCount: number; + availableCount: number; } export interface RenderListContext { diff --git a/components/transfer/transfer-list.component.ts b/components/transfer/transfer-list.component.ts index 023a8728dc3..e67e4bb8773 100644 --- a/components/transfer/transfer-list.component.ts +++ b/components/transfer/transfer-list.component.ts @@ -44,7 +44,7 @@ import { NzTransferSearchComponent } from './transfer-search.component'; [nzChecked]="stat.checkAll" (nzCheckedChange)="onItemSelectAll($event)" [nzIndeterminate]="stat.checkHalf" - [nzDisabled]="stat.shownCount === 0 || disabled" + [nzDisabled]="stat.availableCount === 0 || disabled" > } @@ -175,13 +175,19 @@ export class NzTransferListComponent implements AfterViewInit { checkAll: false, checkHalf: false, checkCount: 0, - shownCount: 0 + shownCount: 0, + availableCount: 0 }; get validData(): TransferItem[] { return this.dataSource.filter(w => !w.hide); } + get availableData(): TransferItem[] { + // filter disabled data + return this.validData.filter(w => !w.disabled); + } + onItemSelect = (item: TransferItem): void => { if (this.disabled || item.disabled) { return; @@ -206,6 +212,7 @@ export class NzTransferListComponent implements AfterViewInit { const validCount = this.dataSource.filter(w => !w.disabled).length; this.stat.checkCount = this.dataSource.filter(w => w.checked && !w.disabled).length; this.stat.shownCount = this.validData.length; + this.stat.availableCount = this.availableData.length; this.stat.checkAll = validCount > 0 && validCount === this.stat.checkCount; this.stat.checkHalf = this.stat.checkCount > 0 && !this.stat.checkAll; // Note: this is done explicitly since the internal `nzChecked` value may not be updated in edge cases. @@ -233,6 +240,7 @@ export class NzTransferListComponent implements AfterViewInit { item.hide = value.length > 0 && !this.matchFilter(value, item); }); this.stat.shownCount = this.validData.length; + this.stat.availableCount = this.availableData.length; this.filterChange.emit({ direction: this.direction, value }); } diff --git a/components/transfer/transfer.component.ts b/components/transfer/transfer.component.ts index 84f98422e5e..79d0e15e30e 100644 --- a/components/transfer/transfer.component.ts +++ b/components/transfer/transfer.component.ts @@ -245,11 +245,8 @@ export class NzTransferComponent implements OnInit, OnChanges, OnDestroy { handleSelect(direction: TransferDirection, checked: boolean, item?: TransferItem): void { const list = this.getCheckedData(direction); - if (list.every(i => i.disabled)) { - this.updateOperationStatus(direction, 0); - return; - } - this.updateOperationStatus(direction, list.length); + const count = list.filter(i => !i.disabled).length; + this.updateOperationStatus(direction, count); this.nzSelectChange.emit({ direction, checked, list, item }); } diff --git a/components/transfer/transfer.spec.ts b/components/transfer/transfer.spec.ts index f6f9d3ed46e..d9a334c2e0d 100644 --- a/components/transfer/transfer.spec.ts +++ b/components/transfer/transfer.spec.ts @@ -247,6 +247,13 @@ describe('transfer', () => { const selectorPath = '[data-direction="left"] .ant-transfer-list-header .ant-checkbox-disabled'; expect(pageObject.leftList.querySelectorAll(selectorPath).length).toBe(1); }); + + it('should be disabled check all when all options are disabled', () => { + instance.nzDataSource = [{ title: `content`, disabled: true }]; + fixture.detectChanges(); + const cls = '[data-direction="left"] .ant-transfer-list-header .ant-checkbox-disabled'; + expect(debugElement.queryAll(By.css(cls)).length).toBe(1); + }); }); it('#nzShowSelectAll', () => {