a94de615-1a97-46e8-b07e-aa98619b3649

Committed 13 Nov 2024 12:34PM UTC coverage: 90.366% (-0.03%) from 90.398%

Build # a94de615-1a97-46e8-b07e-aa98619b3649

Build Type

push

circleci

Committed by

minlovehua

Commit Message

feat: support i18n

Run Details

5517 of 6751 branches covered (81.72%)

Branch coverage included in aggregate %.

67 of 76 new or added lines in 19 files covered. (88.16%)

55 existing lines in 10 files now uncovered.

13225 of 13989 relevant lines covered (94.54%)

1000.62 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

91.46

/src/transfer/transfer-list.component.ts

import { CdkDrag, CdkDragDrop, CdkDropList, CdkDropListGroup, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
import {
    Component,
    DoCheck,
    EventEmitter,
    HostBinding,
    Input,
    IterableChanges,
    IterableDiffer,
    IterableDiffers,
    OnInit,
    Output,
    TemplateRef,
    ViewEncapsulation,
    inject
} from '@angular/core';

import { NgClass, NgTemplateOutlet } from '@angular/common';
import { ThyList, ThyListItem } from 'ngx-tethys/list';
import { ThyDragDropDirective } from 'ngx-tethys/shared';
import { InnerTransferDragEvent, ThyTransferDragEvent, ThyTransferItem, ThyTransferSelectEvent } from './transfer.interface';
import { ThyI18nTranslate } from 'ngx-tethys/i18n';

/**
 * @private
 */
@Component({
    selector: 'thy-transfer-list',
    templateUrl: './transfer-list.component.html',
    encapsulation: ViewEncapsulation.None,
    standalone: true,
    imports: [
        CdkDropListGroup,
        ThyList,
        CdkDropList,
        ThyDragDropDirective,
        ThyListItem,
        CdkDrag,
        NgClass,
        NgTemplateOutlet,
        ThyI18nTranslate
    ]
})
export class ThyTransferList implements OnInit, DoCheck {
    private differs = inject(IterableDiffers);

    public lockItems: ThyTransferItem[] = [];

    public unlockItems: ThyTransferItem[] = [];

    private _diff: IterableDiffer<ThyTransferItem>;

    private _lockDiff: IterableDiffer<ThyTransferItem>;

    private _unlockDiff: IterableDiffer<ThyTransferItem>;

    @Input() title: string;

    @Input() items: ThyTransferItem[];

    @Input() draggable: boolean;

    @Input() canLock: boolean;

    @Input() maxLock: number;

    @Input() max: number;

    @Input() disabled: boolean;

    @Input() template: TemplateRef<any>;

    @Input('renderContentRef') contentRef: TemplateRef<any>;

    @Output() draggableUpdate: EventEmitter<InnerTransferDragEvent> = new EventEmitter<InnerTransferDragEvent>();

    @Output() selectItem: EventEmitter<ThyTransferSelectEvent> = new EventEmitter<ThyTransferSelectEvent>();

    @Output() unselectItem: EventEmitter<ThyTransferSelectEvent> = new EventEmitter<ThyTransferSelectEvent>();

    @HostBinding('class') hostClass = 'thy-transfer-list';

    ngOnInit() {
        this._combineTransferData();
        if (this.canLock) {
            this._lockDiff = this.differs.find(this.lockItems).create();
            this._unlockDiff = this.differs.find(this.unlockItems).create();
        } else {
            this._unlockDiff = this.differs.find(this.unlockItems).create();
        }
        this._diff = this.differs.find(this.items).create();
    }

    private _combineTransferData() {
        this.lockItems = [];
        this.unlockItems = [];
        if (this.canLock) {
            (this.items || []).forEach(item => {
                if (item.isLock) {
                    this.lockItems.push(item);
                } else {
                    this.unlockItems.push(item);
                }
            });
        } else {
            this.unlockItems = this.items;
        }
    }

    private _afterChangeItems(changes: IterableChanges<ThyTransferItem>, items: ThyTransferItem[]) {
        // 数据发生变化时，更改order值
        changes.forEachAddedItem(record => {
            record.item.order = record.currentIndex;
        });
        changes.forEachRemovedItem(() => {
            items.forEach((item, index) => {
                item.order = index;
            });
        });
        changes.forEachMovedItem(() => {
            items.forEach((item, index) => {
                item.order = index;
            });
        });
    }

    ngDoCheck() {
        const changes = this._diff.diff(this.items);
        if (changes) {
            this._afterChangeItems(changes, this.items);
            this._combineTransferData();
        }
        if (this._lockDiff) {
            const lockChanges = this._lockDiff.diff(this.lockItems);
            if (lockChanges) {
                this._afterChangeItems(lockChanges, this.lockItems);
            }
        }
        const unlockChanges = this._unlockDiff.diff(this.unlockItems);
        if (unlockChanges) {
            this._afterChangeItems(unlockChanges, this.unlockItems);
        }
    }

    lockListEnterPredicate = () => {
        return this.lockItems.length < this.maxLock;
    };

    unlockListEnterPredicate = (event: CdkDrag<ThyTransferItem>) => {
        return !event.data.isFixed;
    };

    onSelectItem = (item: ThyTransferItem) => {
        this.selectItem.emit({ item });
    };

    onUnselectItem = (item: ThyTransferItem) => {
        this.unselectItem.emit({ item });
    };

    drop(event: CdkDragDrop<ThyTransferItem[]>) {
        if (event.previousContainer === event.container) {
            moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
        } else {
            transferArrayItem(event.previousContainer.data, event.container.data, event.previousIndex, event.currentIndex);
            (event.previousContainer.data || []).forEach(item => {
                item.isLock = event.previousContainer.id === 'lock';
            });

            (event.container.data || []).forEach(item => {
                item.isLock = event.container.id === 'lock';
            });
        }
        const dragEvent: ThyTransferDragEvent = {
            model: event.item.data,
            models: event.container.data,
            oldIndex: event.previousIndex,
            newIndex: event.currentIndex
        };
        this.draggableUpdate.emit({
            dragEvent: dragEvent,
            listData: { lock: this.lockItems, unlock: this.unlockItems }
        });
    }
}

1	import { CdkDrag, CdkDragDrop, CdkDropList, CdkDropListGroup, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
2	import {
3	Component,
4	DoCheck,
5	EventEmitter,
6	HostBinding,
7	Input,
8	IterableChanges,
9	IterableDiffer,
10	IterableDiffers,
11	OnInit,
12	Output,	1✔
13	TemplateRef,
14	ViewEncapsulation,	38✔
15	inject	38✔
16	} from '@angular/core';	38✔
17		38✔
18	import { NgClass, NgTemplateOutlet } from '@angular/common';	38✔
19	import { ThyList, ThyListItem } from 'ngx-tethys/list';	38✔
20	import { ThyDragDropDirective } from 'ngx-tethys/shared';	38✔
21	import { InnerTransferDragEvent, ThyTransferDragEvent, ThyTransferItem, ThyTransferSelectEvent } from './transfer.interface';	38✔
NEW 22	import { ThyI18nTranslate } from 'ngx-tethys/i18n';	×
23
24	/**	38✔
25	* @private	×
26	*/
27	@Component({	38✔
28	selector: 'thy-transfer-list',	1✔
29	templateUrl: './transfer-list.component.html',
30	encapsulation: ViewEncapsulation.None,	38✔
31	standalone: true,	2✔
32	imports: [
33	CdkDropListGroup,
34	ThyList,
35	CdkDropList,	38✔
36	ThyDragDropDirective,	38✔
37	ThyListItem,	15✔
38	CdkDrag,	15✔
39	NgClass,
40	NgTemplateOutlet,
41	ThyI18nTranslate	23✔
42	]
43	})	38✔
44	export class ThyTransferList implements OnInit, DoCheck {
45	private differs = inject(IterableDiffers);
46		91✔
47	public lockItems: ThyTransferItem[] = [];	91✔
48		91✔
49	public unlockItems: ThyTransferItem[] = [];	42!
50		211✔
51	private _diff: IterableDiffer<ThyTransferItem>;	40✔
52
53	private _lockDiff: IterableDiffer<ThyTransferItem>;
54		171✔
55	private _unlockDiff: IterableDiffer<ThyTransferItem>;
56
57	@Input() title: string;
58
59	@Input() items: ThyTransferItem[];	49✔
60
61	@Input() draggable: boolean;
62
63	@Input() canLock: boolean;
64		125✔
65	@Input() maxLock: number;	582✔
66
67	@Input() max: number;	125✔
68		52✔
69	@Input() disabled: boolean;	208✔
70
71	@Input() template: TemplateRef<any>;
72		125✔
73	@Input('renderContentRef') contentRef: TemplateRef<any>;	18✔
74		70✔
75	@Output() draggableUpdate: EventEmitter<InnerTransferDragEvent> = new EventEmitter<InnerTransferDragEvent>();
76
77	@Output() selectItem: EventEmitter<ThyTransferSelectEvent> = new EventEmitter<ThyTransferSelectEvent>();
78
79	@Output() unselectItem: EventEmitter<ThyTransferSelectEvent> = new EventEmitter<ThyTransferSelectEvent>();	108✔
80		108✔
81	@HostBinding('class') hostClass = 'thy-transfer-list';	53✔
82		53✔
83	ngOnInit() {
84	this._combineTransferData();	108✔
85	if (this.canLock) {	47✔
86	this._lockDiff = this.differs.find(this.lockItems).create();	47✔
87	this._unlockDiff = this.differs.find(this.unlockItems).create();	21✔
88	} else {
89	this._unlockDiff = this.differs.find(this.unlockItems).create();
90	}	108✔
91	this._diff = this.differs.find(this.items).create();	108✔
92	}	51✔
93
94	private _combineTransferData() {
95	this.lockItems = [];
96	this.unlockItems = [];	4!
UNCOV 97	if (this.canLock) {	×
98	(this.items \|\| []).forEach(item => {
99	if (item.isLock) {
100	this.lockItems.push(item);	4✔
101	} else {	4!
102	this.unlockItems.push(item);	16✔
103	}
104	});	4!
105	} else {	16✔
106	this.unlockItems = this.items;
107	}
108	}	4✔
109
110	private _afterChangeItems(changes: IterableChanges<ThyTransferItem>, items: ThyTransferItem[]) {
111	// 数据发生变化时，更改order值
112	changes.forEachAddedItem(record => {
113	record.item.order = record.currentIndex;
114	});	4✔
115	changes.forEachRemovedItem(() => {
116	items.forEach((item, index) => {
117	item.order = index;
118	});
119	});	1✔
120	changes.forEachMovedItem(() => {
121	items.forEach((item, index) => {
122	item.order = index;
123	});
124	});
125	}
126
127	ngDoCheck() {
128	const changes = this._diff.diff(this.items);
129	if (changes) {
130	this._afterChangeItems(changes, this.items);
131	this._combineTransferData();
132	}
133	if (this._lockDiff) {
134	const lockChanges = this._lockDiff.diff(this.lockItems);
135	if (lockChanges) {	1✔
136	this._afterChangeItems(lockChanges, this.lockItems);
137	}
138	}
139	const unlockChanges = this._unlockDiff.diff(this.unlockItems);
140	if (unlockChanges) {
141	this._afterChangeItems(unlockChanges, this.unlockItems);
142	}
143	}
144
145	lockListEnterPredicate = () => {
146	return this.lockItems.length < this.maxLock;
147	};
148
149	unlockListEnterPredicate = (event: CdkDrag<ThyTransferItem>) => {
150	return !event.data.isFixed;
151	};
152
153	onSelectItem = (item: ThyTransferItem) => {
154	this.selectItem.emit({ item });
155	};
156
157	onUnselectItem = (item: ThyTransferItem) => {
158	this.unselectItem.emit({ item });
159	};
160
161	drop(event: CdkDragDrop<ThyTransferItem[]>) {
162	if (event.previousContainer === event.container) {
163	moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
164	} else {
165	transferArrayItem(event.previousContainer.data, event.container.data, event.previousIndex, event.currentIndex);
166	(event.previousContainer.data \|\| []).forEach(item => {
167	item.isLock = event.previousContainer.id === 'lock';
168	});
169
170	(event.container.data \|\| []).forEach(item => {
171	item.isLock = event.container.id === 'lock';
172	});
173	}
174	const dragEvent: ThyTransferDragEvent = {
175	model: event.item.data,
176	models: event.container.data,
177	oldIndex: event.previousIndex,
178	newIndex: event.currentIndex
179	};
180	this.draggableUpdate.emit({
181	dragEvent: dragEvent,
182	listData: { lock: this.lockItems, unlock: this.unlockItems }
183	});
184	}
185	}

atinc / ngx-tethys / a94de615-1a97-46e8-b07e-aa98619b3649

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous