d9ae709b-3c27-4b69-b125-b8b80b54f90b

import { ChangeDetectionStrategy, Component, OnChanges } from '@angular/core';
import { TinyDate } from 'ngx-tethys/util';
import { CalendarTable } from '../calendar/calendar-table.component';
import { DateCell, DecadeCell, DateBodyRow } from '../date/types';
import { NgFor, NgClass } from '@angular/common';

/**
 * @private
 */
@Component({
    changeDetection: ChangeDetectionStrategy.OnPush,
    // eslint-disable-next-line @angular-eslint/component-selector
    selector: 'decade-table',
    exportAs: 'decadeTable',
    templateUrl: 'decade-table.component.html',
    standalone: true,
    imports: [NgFor, NgClass]
})
export class DecadeTableComponent extends CalendarTable implements OnChanges {
    MAX_ROW = 4;
    MAX_COL = 3;

    get startYear(): number {
        return parseInt(`${this.activeDate.getYear() / 100}`, 10) * 100;
    }
    get endYear(): number {
        return this.startYear + 99;
    }

    constructor() {
        super();
    }

    private chooseDecade(startYear: number): void {
        this.value = (this.value || new TinyDate()).setYear(startYear);
        this.valueChange.emit(this.value);
    }

    makeHeadRow(): DateCell[] {
        return [];
    }

    makeBodyRows(): DateBodyRow[] {
        const decades: DateBodyRow[] = [];
        const currentYear = this.value && this.value.getYear();
        const startYear = this.startYear;
        const endYear = this.endYear;
        const previousYear = startYear - 10;

        let index = 0;
        for (let rowIndex = 0; rowIndex < this.MAX_ROW; rowIndex++) {
            const row: DateBodyRow = {
                dateCells: [],
                trackByIndex: rowIndex
            };
            for (let colIndex = 0; colIndex < this.MAX_COL; colIndex++) {
                const start = previousYear + index * 10;
                const end = previousYear + index * 10 + 9;
                const content = `${start}-${end}`;

                const cell: DecadeCell = {
                    content,
                    title: content,
                    isSelected: currentYear >= start && currentYear <= end,
                    isLowerThanStart: end < startYear,
                    isBiggerThanEnd: start > endYear,
                    classMap: null,
                    onClick: () => this.chooseDecade(start),
                    onMouseEnter(): void {}
                };
                cell.classMap = this.getClassMap(cell);

                index++;
                row.dateCells.push(cell);
            }
            decades.push(row);
        }
        return decades;
    }

    getClassMap(cell: DecadeCell): { [key: string]: boolean } {
        return {
            [`${this.prefixCls}-decade-panel-cell`]: true,
            [`${this.prefixCls}-decade-panel-selected-cell`]: cell.isSelected,
            [`${this.prefixCls}-decade-panel-last-century-cell`]: cell.isLowerThanStart,
            [`${this.prefixCls}-decade-panel-next-century-cell`]: cell.isBiggerThanEnd
        };
    }

    cellClick(event: Event, cell: DecadeCell) {
        event.stopPropagation();
        cell.onClick();
    }
}

1	import { ChangeDetectionStrategy, Component, OnChanges } from '@angular/core';
2	import { TinyDate } from 'ngx-tethys/util';
3	import { CalendarTable } from '../calendar/calendar-table.component';
4	import { DateCell, DecadeCell, DateBodyRow } from '../date/types';
5	import { NgFor, NgClass } from '@angular/common';
6
7	/**
8	* @private
9	*/
10	@Component({	1✔
11	changeDetection: ChangeDetectionStrategy.OnPush,
12	// eslint-disable-next-line @angular-eslint/component-selector	×
13	selector: 'decade-table',
14	exportAs: 'decadeTable',
15	templateUrl: 'decade-table.component.html',	×
16	standalone: true,
17	imports: [NgFor, NgClass]
18	})	×
19	export class DecadeTableComponent extends CalendarTable implements OnChanges {	×
20	MAX_ROW = 4;	×
21	MAX_COL = 3;
22
23	get startYear(): number {	×
24	return parseInt(`${this.activeDate.getYear() / 100}`, 10) * 100;	×
25	}
26	get endYear(): number {
27	return this.startYear + 99;	×
28	}
29
30	constructor() {	×
31	super();	×
32	}	×
33		×
34	private chooseDecade(startYear: number): void {	×
35	this.value = (this.value \|\| new TinyDate()).setYear(startYear);	×
36	this.valueChange.emit(this.value);	×
37	}	×
38
39	makeHeadRow(): DateCell[] {
40	return [];
41	}	×
42		×
43	makeBodyRows(): DateBodyRow[] {	×
44	const decades: DateBodyRow[] = [];	×
45	const currentYear = this.value && this.value.getYear();	×
46	const startYear = this.startYear;
47	const endYear = this.endYear;
48	const previousYear = startYear - 10;	×
49
50	let index = 0;
51	for (let rowIndex = 0; rowIndex < this.MAX_ROW; rowIndex++) {
52	const row: DateBodyRow = {	×
53	dateCells: [],
54	trackByIndex: rowIndex
55	};	×
56	for (let colIndex = 0; colIndex < this.MAX_COL; colIndex++) {	×
57	const start = previousYear + index * 10;	×
58	const end = previousYear + index * 10 + 9;
59	const content = `${start}-${end}`;	×
60
61	const cell: DecadeCell = {	×
62	content,
63	title: content,
64	isSelected: currentYear >= start && currentYear <= end,	×
65	isLowerThanStart: end < startYear,
66	isBiggerThanEnd: start > endYear,
67	classMap: null,
68	onClick: () => this.chooseDecade(start),
69	onMouseEnter(): void {}
70	};
71	cell.classMap = this.getClassMap(cell);
72		×
73	index++;	×
74	row.dateCells.push(cell);
75	}	1✔
76	decades.push(row);
77	}	1✔
78	return decades;
79	}
80
81	getClassMap(cell: DecadeCell): { [key: string]: boolean } {
82	return {
83	[`${this.prefixCls}-decade-panel-cell`]: true,
84	[`${this.prefixCls}-decade-panel-selected-cell`]: cell.isSelected,
85	[`${this.prefixCls}-decade-panel-last-century-cell`]: cell.isLowerThanStart,
86	[`${this.prefixCls}-decade-panel-next-century-cell`]: cell.isBiggerThanEnd
87	};
88	}
89
90	cellClick(event: Event, cell: DecadeCell) {
91	event.stopPropagation();
92	cell.onClick();
93	}
94	}

atinc / ngx-tethys / d9ae709b-3c27-4b69-b125-b8b80b54f90b

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