cd64db52-e563-41a3-85f3-a0adb87ce135

Committed 30 Oct 2024 08:03AM UTC coverage: 90.402% (-0.04%) from 90.438%

Build # cd64db52-e563-41a3-85f3-a0adb87ce135

Build Type

push

circleci

Committed by

web-flow

Commit Message

refactor: refactor constructor to the inject function (#3222)

Run Details

5503 of 6730 branches covered (81.77%)

Branch coverage included in aggregate %.

422 of 429 new or added lines in 170 files covered. (98.37%)

344 existing lines in 81 files now uncovered.

13184 of 13941 relevant lines covered (94.57%)

997.19 hits per line

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

95.83

/src/breadcrumb/breadcrumb.component.ts

import {
    Component,
    ChangeDetectionStrategy,
    Input,
    ContentChild,
    TemplateRef,
    numberAttribute,
    OnChanges,
    SimpleChanges,
    OnInit,
    ChangeDetectorRef,
    inject
} from '@angular/core';
import { ThyIcon } from 'ngx-tethys/icon';
import { NgClass, NgTemplateOutlet } from '@angular/common';
import { ThyBreadcrumbItem } from './breadcrumb-item.component';
import { SafeAny } from 'ngx-tethys/types';
import {
    ThyDropdownDirective,
    ThyDropdownMenuComponent,
    ThyDropdownMenuItemDirective,
    ThyDropdownMenuItemNameDirective
} from 'ngx-tethys/dropdown';
import { ThyAction } from 'ngx-tethys/action';
import { coerceBooleanProperty } from 'ngx-tethys/util';

const THY_BREADCRUMB_ITEM_ELLIPSIS_ID = 'THY_BREADCRUMB_ITEM_ELLIPSIS_ID';

const ELLIPSIS_ITEM = { _id: THY_BREADCRUMB_ITEM_ELLIPSIS_ID };

/**
 * 面包屑组件
 * @name thy-breadcrumb
 * @order 10
 */
@Component({
    selector: 'thy-breadcrumb',
    templateUrl: './breadcrumb.component.html',
    exportAs: 'ThyBreadcrumb',
    changeDetection: ChangeDetectionStrategy.OnPush,
    host: {
        class: 'thy-breadcrumb',
        '[class.thy-breadcrumb-separator]': '!!thySeparator',
        '[class.thy-breadcrumb-separator-slash]': 'thySeparator === "slash"',
        '[class.thy-breadcrumb-separator-backslash]': 'thySeparator === "backslash"',
        '[class.thy-breadcrumb-separator-vertical-line]': 'thySeparator === "vertical-line"'
    },
    standalone: true,
    imports: [
        ThyIcon,
        NgClass,
        ThyBreadcrumbItem,
        NgTemplateOutlet,
        ThyAction,
        ThyDropdownDirective,
        ThyDropdownMenuItemDirective,
        ThyDropdownMenuItemNameDirective,
        ThyDropdownMenuComponent,
        ThyIcon
    ]
})
export class ThyBreadcrumb implements OnInit, OnChanges {
    private cdr = inject(ChangeDetectorRef);

    iconClasses: string[];
    svgIconName: string;

    /**
     * 面包屑的前缀 展示图标，如 folder-fill
     */
    @Input()
    set thyIcon(icon: string) {
        this.setIcon(icon);
    }

    /**
     * 面包屑的分隔符，不传值默认为 ">"
     * @type slash | backslash | vertical-line
     */
    @Input() thySeparator: 'slash' | 'backslash' | 'vertical-line';

    /**
     * 面包屑的每一项数据
     */
    @Input({ alias: 'thyItems' }) items: SafeAny[];

    /**
     * 最大显示数量，超出此数量后，面包屑会被省略, 0 表示不省略（仅当传入 thyItems 时有效）
     */
    @Input({ transform: numberAttribute }) thyMaxCount = 4;

    /**
     * 是否可点击弹出已被省略的面包屑项（仅当传入 thyItems 时有效）
     */
    @Input({ transform: coerceBooleanProperty }) thyExpandable = true;

    /**
     * 面包屑的每一项模板（仅当传入 thyItems 时有效）
     */
    @ContentChild('item') itemTemplate: TemplateRef<SafeAny>;

    public ellipsisItemId = THY_BREADCRUMB_ITEM_ELLIPSIS_ID;

    public ellipsisItems: SafeAny[];

    public showItems: SafeAny[];

    ngOnInit() {
        this.resetItems();
    }

    ngOnChanges(changes: SimpleChanges) {
        if ((changes.items && !changes.items.firstChange) || (changes.thyMaxCount && !changes.thyMaxCount.firstChange)) {
            this.resetItems();
        }
    }

    private setIcon(icon: string) {
        if (icon) {
            if (icon.includes('wtf')) {
                const classes = icon.split(' ');
                if (classes.length === 1) {
                    classes.unshift('wtf');
                }
                this.iconClasses = classes;
            } else {
                this.svgIconName = icon;
            }
        } else {
            this.iconClasses = null;
            this.svgIconName = null;
        }
    }

    private resetItems() {
        if (!this.items?.length) {
            return;
        }
        if (this.thyMaxCount && this.items.length > this.thyMaxCount) {
            const ellipsisIndex = this.items.length - this.thyMaxCount + 2;
            this.ellipsisItems = this.items.slice(1, ellipsisIndex);
            this.showItems = [this.items[0], ELLIPSIS_ITEM, ...this.items.slice(ellipsisIndex)];
        } else {
            this.showItems = [...this.items];
            this.ellipsisItems = [];
        }
    }
}

1	import {
2	Component,
3	ChangeDetectionStrategy,
4	Input,
5	ContentChild,
6	TemplateRef,
7	numberAttribute,
8	OnChanges,
9	SimpleChanges,
10	OnInit,	1✔
11	ChangeDetectorRef,	1✔
12	inject
13	} from '@angular/core';
14	import { ThyIcon } from 'ngx-tethys/icon';
15	import { NgClass, NgTemplateOutlet } from '@angular/common';
16	import { ThyBreadcrumbItem } from './breadcrumb-item.component';
17	import { SafeAny } from 'ngx-tethys/types';	1✔
18	import {
19	ThyDropdownDirective,	15✔
20	ThyDropdownMenuComponent,	15✔
21	ThyDropdownMenuItemDirective,	15✔
22	ThyDropdownMenuItemNameDirective	15✔
23	} from 'ngx-tethys/dropdown';
24	import { ThyAction } from 'ngx-tethys/action';
25	import { coerceBooleanProperty } from 'ngx-tethys/util';	6✔
26
27	const THY_BREADCRUMB_ITEM_ELLIPSIS_ID = 'THY_BREADCRUMB_ITEM_ELLIPSIS_ID';
28		15✔
29	const ELLIPSIS_ITEM = { _id: THY_BREADCRUMB_ITEM_ELLIPSIS_ID };
30
31	/**	19✔
32	* 面包屑组件	2✔
33	* @name thy-breadcrumb
34	* @order 10
35	*/
36	@Component({	6✔
37	selector: 'thy-breadcrumb',	5✔
38	templateUrl: './breadcrumb.component.html',	1✔
39	exportAs: 'ThyBreadcrumb',	1!
UNCOV 40	changeDetection: ChangeDetectionStrategy.OnPush,	×
41	host: {
42	class: 'thy-breadcrumb',	1✔
43	'[class.thy-breadcrumb-separator]': '!!thySeparator',
44	'[class.thy-breadcrumb-separator-slash]': 'thySeparator === "slash"',
45	'[class.thy-breadcrumb-separator-backslash]': 'thySeparator === "backslash"',	4✔
46	'[class.thy-breadcrumb-separator-vertical-line]': 'thySeparator === "vertical-line"'
47	},
48	standalone: true,
49	imports: [	1✔
50	ThyIcon,	1✔
51	NgClass,
52	ThyBreadcrumbItem,
53	NgTemplateOutlet,
54	ThyAction,	17✔
55	ThyDropdownDirective,	11✔
56	ThyDropdownMenuItemDirective,
57	ThyDropdownMenuItemNameDirective,	6✔
58	ThyDropdownMenuComponent,	4✔
59	ThyIcon	4✔
60	]	4✔
61	})
62	export class ThyBreadcrumb implements OnInit, OnChanges {
63	private cdr = inject(ChangeDetectorRef);	2✔
64		2✔
65	iconClasses: string[];
66	svgIconName: string;
67		1✔
68	/**
69	* 面包屑的前缀展示图标，如 folder-fill
70	*/
71	@Input()
72	set thyIcon(icon: string) {
73	this.setIcon(icon);
74	}
75
76	/**	1✔
77	* 面包屑的分隔符，不传值默认为 ">"
78	* @type slash \| backslash \| vertical-line
79	*/
80	@Input() thySeparator: 'slash' \| 'backslash' \| 'vertical-line';
81
82	/**
83	* 面包屑的每一项数据
84	*/
85	@Input({ alias: 'thyItems' }) items: SafeAny[];
86
87	/**
88	* 最大显示数量，超出此数量后，面包屑会被省略, 0 表示不省略（仅当传入 thyItems 时有效）
89	*/
90	@Input({ transform: numberAttribute }) thyMaxCount = 4;
91
92	/**
93	* 是否可点击弹出已被省略的面包屑项（仅当传入 thyItems 时有效）
94	*/
95	@Input({ transform: coerceBooleanProperty }) thyExpandable = true;
96
97	/**
98	* 面包屑的每一项模板（仅当传入 thyItems 时有效）
99	*/
100	@ContentChild('item') itemTemplate: TemplateRef<SafeAny>;
101
102	public ellipsisItemId = THY_BREADCRUMB_ITEM_ELLIPSIS_ID;
103
104	public ellipsisItems: SafeAny[];
105
106	public showItems: SafeAny[];
107
108	ngOnInit() {
109	this.resetItems();
110	}
111
112	ngOnChanges(changes: SimpleChanges) {
113	if ((changes.items && !changes.items.firstChange) \|\| (changes.thyMaxCount && !changes.thyMaxCount.firstChange)) {
114	this.resetItems();
115	}
116	}
117
118	private setIcon(icon: string) {
119	if (icon) {
120	if (icon.includes('wtf')) {
121	const classes = icon.split(' ');
122	if (classes.length === 1) {
123	classes.unshift('wtf');
124	}
125	this.iconClasses = classes;
126	} else {
127	this.svgIconName = icon;
128	}
129	} else {
130	this.iconClasses = null;
131	this.svgIconName = null;
132	}
133	}
134
135	private resetItems() {
136	if (!this.items?.length) {
137	return;
138	}
139	if (this.thyMaxCount && this.items.length > this.thyMaxCount) {
140	const ellipsisIndex = this.items.length - this.thyMaxCount + 2;
141	this.ellipsisItems = this.items.slice(1, ellipsisIndex);
142	this.showItems = [this.items[0], ELLIPSIS_ITEM, ...this.items.slice(ellipsisIndex)];
143	} else {
144	this.showItems = [...this.items];
145	this.ellipsisItems = [];
146	}
147	}
148	}

atinc / ngx-tethys / cd64db52-e563-41a3-85f3-a0adb87ce135

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