d9ae709b-3c27-4b69-b125-b8b80b54f90b

import { Directive, Input, OnChanges, Optional, Host, AfterViewInit, OnDestroy, OnInit } from '@angular/core';
import { useHostRenderer } from '@tethys/cdk/dom';
import { ThyRowDirective } from './thy-row.directive';
import { takeUntil } from 'rxjs/operators';
import { mixinUnsubscribe, MixinBase, Constructor, ThyUnsubscribe, InputNumber } from 'ngx-tethys/core';

export interface ThyColEmbeddedProperty {
    span?: number;
    pull?: number;
    push?: number;
    offset?: number;
    order?: number;
}

const _MixinBase: Constructor<ThyUnsubscribe> & typeof MixinBase = mixinUnsubscribe(MixinBase);

/**
 * 栅格列指令
 * @name thyCol
 */
@Directive({
    selector: '[thyCol]',
    host: {
        class: 'thy-col'
    },
    standalone: true
})
export class ThyColDirective extends _MixinBase implements OnInit, OnChanges, AfterViewInit, OnDestroy {
    /**
     * 栅格项的占位列数
     */
    @Input() @InputNumber() thySpan: number | null = 24;

    private hostRenderer = useHostRenderer();

    constructor(@Optional() @Host() public thyRowDirective: ThyRowDirective) {
        super();
    }

    ngOnInit() {
        this._setHostClassMap();
    }

    ngOnChanges(changes: import('@angular/core').SimpleChanges): void {
        this._setHostClassMap();
    }

    ngAfterViewInit(): void {
        if (this.thyRowDirective) {
            this.thyRowDirective.actualGutter$.pipe(takeUntil(this.ngUnsubscribe$)).subscribe(([horizontalGutter, verticalGutter]) => {
                const renderGutter = (name: string, gutter: number) => {
                    this.hostRenderer.setStyle(name, `${gutter / 2}px`);
                };
                if (horizontalGutter > 0) {
                    renderGutter('padding-left', horizontalGutter);
                    renderGutter('padding-right', horizontalGutter);
                }
                if (verticalGutter > 0) {
                    renderGutter('padding-top', verticalGutter);
                    renderGutter('padding-bottom', verticalGutter);
                }
            });
        }
    }

    private _setHostClassMap() {
        this.hostRenderer.updateClassByMap({
            [`thy-col-${this.thySpan}`]: true
        });
    }

    ngOnDestroy() {
        super.ngOnDestroy();
    }
}

1	import { Directive, Input, OnChanges, Optional, Host, AfterViewInit, OnDestroy, OnInit } from '@angular/core';
2	import { useHostRenderer } from '@tethys/cdk/dom';
3	import { ThyRowDirective } from './thy-row.directive';
4	import { takeUntil } from 'rxjs/operators';
5	import { mixinUnsubscribe, MixinBase, Constructor, ThyUnsubscribe, InputNumber } from 'ngx-tethys/core';
6
7	export interface ThyColEmbeddedProperty {	1✔
8	span?: number;
9	pull?: number;
10	push?: number;
11	offset?: number;
12	order?: number;	1✔
13	}
14		×
15	const _MixinBase: Constructor<ThyUnsubscribe> & typeof MixinBase = mixinUnsubscribe(MixinBase);	×
16		×
17	/**	×
18	* 栅格列指令
19	* @name thyCol
20	*/	×
21	@Directive({
22	selector: '[thyCol]',
23	host: {	×
24	class: 'thy-col'
25	},
26	standalone: true	×
27	})	×
28	export class ThyColDirective extends _MixinBase implements OnInit, OnChanges, AfterViewInit, OnDestroy {	×
29	/**	×
30	* 栅格项的占位列数
31	*/	×
32	@Input() @InputNumber() thySpan: number \| null = 24;	×
33		×
34	private hostRenderer = useHostRenderer();
35		×
36	constructor(@Optional() @Host() public thyRowDirective: ThyRowDirective) {	×
37	super();	×
38	}
39
40	ngOnInit() {
41	this._setHostClassMap();
42	}
43		×
44	ngOnChanges(changes: import('@angular/core').SimpleChanges): void {
45	this._setHostClassMap();
46	}
47
48	ngAfterViewInit(): void {	×
49	if (this.thyRowDirective) {
50	this.thyRowDirective.actualGutter$.pipe(takeUntil(this.ngUnsubscribe$)).subscribe(([horizontalGutter, verticalGutter]) => {	1✔
51	const renderGutter = (name: string, gutter: number) => {
52	this.hostRenderer.setStyle(name, `${gutter / 2}px`);
53	};	1✔
54	if (horizontalGutter > 0) {
55	renderGutter('padding-left', horizontalGutter);
56	renderGutter('padding-right', horizontalGutter);
57	}	1✔
58	if (verticalGutter > 0) {
59	renderGutter('padding-top', verticalGutter);
60	renderGutter('padding-bottom', verticalGutter);
61	}	1✔
62	});
63	}
64	}
65
66	private _setHostClassMap() {
67	this.hostRenderer.updateClassByMap({
68	[`thy-col-${this.thySpan}`]: true
69	});
70	}
71
72	ngOnDestroy() {
73	super.ngOnDestroy();
74	}
75	}

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