atinc / ngx-tethys / #55

Committed 30 Jul 2025 07:08AM UTC coverage: 9.866% (-80.4%) from 90.297%

Build # #55

Build Type

push

Committed by

Commit Message

feat(empty): add setMessage for update display text #TINFR-2616

Run Details

92 of 6794 branches covered (1.35%)

Branch coverage included in aggregate %.

2014 of 14552 relevant lines covered (13.84%)

6.15 hits per line

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

12.5

/src/collapse/collapse.component.ts

import { ChangeDetectionStrategy, Component, input } from '@angular/core';
import { IThyCollapseItemComponent, IThyCollapseComponent, THY_COLLAPSE_COMPONENT } from './collapse.token';
import { coerceBooleanProperty } from 'ngx-tethys/util';

export type ThyCollapseTheme = 'divided' | 'bordered' | 'ghost';

export type ThyCollapsedIconPosition = 'left' | 'right';

/**
 * 折叠面板组件
 * @name thy-collapse
 * @order 10
 */
@Component({
    selector: 'thy-collapse',
    template: `
        <ng-container>
            <ng-content></ng-content>
        </ng-container>
    `,
    host: {
        class: 'thy-collapse',
        '[class.thy-collapse-divided]': `thyTheme() === 'divided'`,
        '[class.thy-collapse-bordered]': `thyTheme() === 'bordered'`,
        '[class.thy-collapse-ghost]': `thyTheme() === 'ghost'`,
        '[class.thy-collapse-icon-position-right]': `thyArrowIconPosition() === 'right'`,
        '[class.thy-collapse-icon-position-left]': `thyArrowIconPosition() === 'left'`
    },
    changeDetection: ChangeDetectionStrategy.OnPush,
    providers: [
        {
            provide: THY_COLLAPSE_COMPONENT,
            useExisting: ThyCollapse
        }
    ]
})
export class ThyCollapse implements IThyCollapseComponent {
    /**
     * 折叠面板主题，支持 `divided` | `bordered` | `ghost`
     */
    readonly thyTheme = input<ThyCollapseTheme>('divided');

    /**
     * 是否为手风琴模式，手风琴模式下，只能展开一个面板
     */
    readonly thyAccordion = input(false, { transform: coerceBooleanProperty });

    /**
     * 展开收起图标的位置，支持 `left` | `right`
     */
    readonly thyArrowIconPosition = input<ThyCollapsedIconPosition>('left');

    private listOfCollapsePanelComponent: IThyCollapseItemComponent[] = [];

    addPanel(value: IThyCollapseItemComponent): void {
        this.listOfCollapsePanelComponent.push(value);
    }

    removePanel(value: IThyCollapseItemComponent): void {
        this.listOfCollapsePanelComponent.splice(this.listOfCollapsePanelComponent.indexOf(value), 1);
    }

    click(collapseItem: IThyCollapseItemComponent, event: Event): void {
        if (this.thyAccordion() && !collapseItem.thyActive()) {
            this.listOfCollapsePanelComponent
                .filter(item => item !== collapseItem)
                .forEach(item => {
                    if (item.thyActive()) {
                        item.thyActive.set(false);
                        item.thyActiveChange.emit({ active: collapseItem.thyActive(), event });
                        item.markForCheck();
                    }
                });
        }
        collapseItem.thyActive.set(!collapseItem.thyActive());
        collapseItem.thyActiveChange.emit({ active: collapseItem.thyActive(), event });
    }
}

1	import { ChangeDetectionStrategy, Component, input } from '@angular/core';
2	import { IThyCollapseItemComponent, IThyCollapseComponent, THY_COLLAPSE_COMPONENT } from './collapse.token';
3	import { coerceBooleanProperty } from 'ngx-tethys/util';
4
5	export type ThyCollapseTheme = 'divided' \| 'bordered' \| 'ghost';
6
7	export type ThyCollapsedIconPosition = 'left' \| 'right';
8
9	/**
10	* 折叠面板组件
11	* @name thy-collapse	1✔
12	* @order 10
13	*/	×
14	@Component({	×
15	selector: 'thy-collapse',	×
16	template: `	×
17	<ng-container>
18	<ng-content></ng-content>
19	</ng-container>	×
20	`,
21	host: {
22	class: 'thy-collapse',	×
23	'[class.thy-collapse-divided]': `thyTheme() === 'divided'`,
24	'[class.thy-collapse-bordered]': `thyTheme() === 'bordered'`,
25	'[class.thy-collapse-ghost]': `thyTheme() === 'ghost'`,	×
26	'[class.thy-collapse-icon-position-right]': `thyArrowIconPosition() === 'right'`,	×
27	'[class.thy-collapse-icon-position-left]': `thyArrowIconPosition() === 'left'`	×
28	},
29	changeDetection: ChangeDetectionStrategy.OnPush,	×
30	providers: [	×
31	{	×
32	provide: THY_COLLAPSE_COMPONENT,	×
33	useExisting: ThyCollapse
34	}
35	]
36	})	×
37	export class ThyCollapse implements IThyCollapseComponent {	×
38	/**
39	* 折叠面板主题，支持 `divided` \| `bordered` \| `ghost`	1✔
40	*/
41	readonly thyTheme = input<ThyCollapseTheme>('divided');
42
43	/**
44	* 是否为手风琴模式，手风琴模式下，只能展开一个面板
45	*/	1✔
46	readonly thyAccordion = input(false, { transform: coerceBooleanProperty });
47
48	/**
49	* 展开收起图标的位置，支持 `left` \| `right`
50	*/
51	readonly thyArrowIconPosition = input<ThyCollapsedIconPosition>('left');
52
53	private listOfCollapsePanelComponent: IThyCollapseItemComponent[] = [];
54
55	addPanel(value: IThyCollapseItemComponent): void {
56	this.listOfCollapsePanelComponent.push(value);
57	}
58
59	removePanel(value: IThyCollapseItemComponent): void {
60	this.listOfCollapsePanelComponent.splice(this.listOfCollapsePanelComponent.indexOf(value), 1);
61	}
62
63	click(collapseItem: IThyCollapseItemComponent, event: Event): void {
64	if (this.thyAccordion() && !collapseItem.thyActive()) {
65	this.listOfCollapsePanelComponent
66	.filter(item => item !== collapseItem)
67	.forEach(item => {
68	if (item.thyActive()) {
69	item.thyActive.set(false);
70	item.thyActiveChange.emit({ active: collapseItem.thyActive(), event });
71	item.markForCheck();
72	}
73	});
74	}
75	collapseItem.thyActive.set(!collapseItem.thyActive());
76	collapseItem.thyActiveChange.emit({ active: collapseItem.thyActive(), event });
77	}
78	}

atinc / ngx-tethys / #55

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