680f7a28-9ac6-472a-8247-d3892246c266

pending completion

Build # 680f7a28-9ac6-472a-8247-d3892246c266

Build Type

push

circleci

Committed by

minlovehua

Commit Message

textarea 调用草稿

Run Details

5104 of 6321 branches covered (80.75%)

Branch coverage included in aggregate %.

12917 of 13697 relevant lines covered (94.31%)

971.88 hits per line

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

34.78

/src/input/textarea/textarea.component.ts

import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnInit, ViewChild, forwardRef } from '@angular/core';
import { ThyInputDirective, ThyInputSize } from '../input.directive';
import { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
import {
    AbstractControlValueAccessor,
    Constructor,
    InputBoolean,
    InputNumber,
    ThyCanDisable,
    ThyHasTabIndex,
    ThyInitialized,
    ThyUnsubscribe,
    mixinDisabled,
    mixinInitialized,
    mixinTabIndex,
    mixinUnsubscribe
} from 'ngx-tethys/core';
import { Subject } from 'rxjs';
import { filter, switchMap, takeUntil, tap } from 'rxjs/operators';
import { NgIf } from '@angular/common';
import { CdkTextareaAutosize, TextFieldModule } from '@angular/cdk/text-field';

const _MixinBase: Constructor<ThyHasTabIndex> &
    Constructor<ThyInitialized> &
    Constructor<ThyCanDisable> &
    Constructor<ThyUnsubscribe> &
    typeof AbstractControlValueAccessor = mixinInitialized(mixinTabIndex(mixinDisabled(mixinUnsubscribe(AbstractControlValueAccessor))));

/**
 * 文本域组件
 * @name thy-textarea
 * @order 50
 */
@Component({
    selector: 'thy-textarea',
    templateUrl: './textarea.component.html',
    host: {
        class: 'thy-textarea'
    },
    changeDetection: ChangeDetectionStrategy.OnPush,
    providers: [
        {
            provide: NG_VALUE_ACCESSOR,
            useExisting: forwardRef(() => ThyTextareaComponent),
            multi: true
        }
    ],
    standalone: true,
    imports: [NgIf, FormsModule, TextFieldModule, ThyInputDirective]
})
export class ThyTextareaComponent extends _MixinBase implements ControlValueAccessor, OnInit {
    @ViewChild(ThyInputDirective, { static: true }) inputDirective: ThyInputDirective;

    @ViewChild('autoSize', { static: true }) autoSize: CdkTextareaAutosize;

    // 待定：参数的命名是加thy前缀？还是和textarea保持完全一致的拼写？

    /**
     * 文本域的 name 属性
     */
    @Input() name = '';

    /**
     * 文本域的 placeholder
     */
    @Input() placeholder = '';

    /**
     * 最大字符长度
     */
    @Input() @InputNumber() maxlength: number;

    /**
     * 最小字符长度
     */
    @Input() @InputNumber() minlength: number;

    /**
     * 文本域的最大长度
     */
    @Input() @InputNumber() rows: number = 3;

    /**
     * 文本域的可视宽度
     */
    @Input() @InputNumber() cols: number;

    /**
     * 文本域最小支持行数
     */
    @Input() @InputNumber() minRows: number;

    /**
     * 文本域最大支持行数
     */
    @Input() @InputNumber() maxRows: number;

    /**
     * 是否只读
     */
    @Input() @InputBoolean() readonly = false;

    /**
     * 是否自动聚焦
     */
    @Input() @InputBoolean() thyAutofocus = false;

    /**
     * 是否自动调整高度
     */
    @Input() @InputBoolean() thyAutosize = false;

    /**
     * 自动调整高度的最小行数
     */
    @Input() @InputNumber() thyAutosizeMinRows = 1;

    /**
     * 自动调整高度的最大行数
     */
    @Input() @InputNumber() thyAutosizeMaxRows = 10;

    /**
     * 输入框大小
     * @type 'xs' | 'sm' | 'md' | 'lg' | ''
     */
    @Input() thySize: ThyInputSize;

    inputLength = 0;

    thyInput$ = new Subject<ThyInputDirective>();

    textareaValue: string;

    disabled: boolean;

    constructor(private changeDetectorRef: ChangeDetectorRef) {
        super();
    }

    writeValue(value: any): void {
        this.textareaValue = value;
        this.changeDetectorRef.markForCheck();
    }

    setDisabledState?(isDisabled: boolean): void {
        this.disabled = isDisabled;
    }

    ngOnInit(): void {
        if (this.maxlength) {
            this.setupTextareaCount();
        }

        setTimeout(() => {
            this.autoSize.resizeToFitContent(true);
        }, 0);
    }

    textareaModelChange(value: string) {}

    setupTextareaCount() {
        this.thyInput$
            .pipe(
                filter(input => {
                    return !!input;
                }),
                takeUntil(this.ngUnsubscribe$),
                switchMap(input => {
                    return input.ngControl?.valueChanges;
                }),
                tap(value => {
                    this.inputLength = value?.length || 0;
                    this.changeDetectorRef.markForCheck();
                }),
                takeUntil(this.ngUnsubscribe$)
            )
            .subscribe();

        this.thyInput$.next(this.inputDirective);
    }
}

1	import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnInit, ViewChild, forwardRef } from '@angular/core';
2	import { ThyInputDirective, ThyInputSize } from '../input.directive';
3	import { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
4	import {
5	AbstractControlValueAccessor,
6	Constructor,
7	InputBoolean,
8	InputNumber,
9	ThyCanDisable,
10	ThyHasTabIndex,
11	ThyInitialized,
12	ThyUnsubscribe,	1✔
13	mixinDisabled,
14	mixinInitialized,
15	mixinTabIndex,
16	mixinUnsubscribe
17	} from 'ngx-tethys/core';
18	import { Subject } from 'rxjs';	1✔
19	import { filter, switchMap, takeUntil, tap } from 'rxjs/operators';
20	import { NgIf } from '@angular/common';	×
21	import { CdkTextareaAutosize, TextFieldModule } from '@angular/cdk/text-field';	×
22		×
23	const _MixinBase: Constructor<ThyHasTabIndex> &	×
24	Constructor<ThyInitialized> &	×
25	Constructor<ThyCanDisable> &	×
26	Constructor<ThyUnsubscribe> &	×
27	typeof AbstractControlValueAccessor = mixinInitialized(mixinTabIndex(mixinDisabled(mixinUnsubscribe(AbstractControlValueAccessor))));	×
28		×
29	/**	×
30	* 文本域组件	×
31	* @name thy-textarea	×
32	* @order 50
33	*/
34	@Component({	×
35	selector: 'thy-textarea',	×
36	templateUrl: './textarea.component.html',
37	host: {
38	class: 'thy-textarea'	×
39	},
40	changeDetection: ChangeDetectionStrategy.OnPush,
41	providers: [	×
42	{	×
43	provide: NG_VALUE_ACCESSOR,
44	useExisting: forwardRef(() => ThyTextareaComponent),	×
45	multi: true	×
46	}
47	],
48	standalone: true,
49	imports: [NgIf, FormsModule, TextFieldModule, ThyInputDirective]
50	})	×
51	export class ThyTextareaComponent extends _MixinBase implements ControlValueAccessor, OnInit {
52	@ViewChild(ThyInputDirective, { static: true }) inputDirective: ThyInputDirective;	×
53
54	@ViewChild('autoSize', { static: true }) autoSize: CdkTextareaAutosize;	×
55
56	// 待定：参数的命名是加thy前缀？还是和textarea保持完全一致的拼写？	×
57		×
58	/**
59	* 文本域的 name 属性
60	*/	×
61	@Input() name = '';
62		1✔
63	/**
64	* 文本域的 placeholder
65	*/	1✔
66	@Input() placeholder = '';
67
68	/**
69	* 最大字符长度
70	*/
71	@Input() @InputNumber() maxlength: number;
72
73	/**
74	* 最小字符长度
75	*/
76	@Input() @InputNumber() minlength: number;
77
78	/**
79	* 文本域的最大长度
80	*/
81	@Input() @InputNumber() rows: number = 3;
82
83	/**
84	* 文本域的可视宽度	1✔
85	*/
86	@Input() @InputNumber() cols: number;
87
88	/**	1✔
89	* 文本域最小支持行数
90	*/
91	@Input() @InputNumber() minRows: number;
92		1✔
93	/**
94	* 文本域最大支持行数
95	*/
96	@Input() @InputNumber() maxRows: number;	1✔
97
98	/**
99	* 是否只读
100	*/	1✔
101	@Input() @InputBoolean() readonly = false;
102
103	/**
104	* 是否自动聚焦	1✔
105	*/
106	@Input() @InputBoolean() thyAutofocus = false;
107
108	/**	1✔
109	* 是否自动调整高度
110	*/
111	@Input() @InputBoolean() thyAutosize = false;
112		1✔
113	/**
114	* 自动调整高度的最小行数
115	*/
116	@Input() @InputNumber() thyAutosizeMinRows = 1;	1✔
117
118	/**
119	* 自动调整高度的最大行数
120	*/	1✔
121	@Input() @InputNumber() thyAutosizeMaxRows = 10;
122
123	/**
124	* 输入框大小	1✔
125	* @type 'xs' \| 'sm' \| 'md' \| 'lg' \| ''
126	*/
127	@Input() thySize: ThyInputSize;
128		1✔
129	inputLength = 0;
130
131	thyInput$ = new Subject<ThyInputDirective>();
132
133	textareaValue: string;
134
135	disabled: boolean;
136
137	constructor(private changeDetectorRef: ChangeDetectorRef) {
138	super();
139	}	×
140
141	writeValue(value: any): void {
142	this.textareaValue = value;
143	this.changeDetectorRef.markForCheck();
144	}
145
146	setDisabledState?(isDisabled: boolean): void {
147	this.disabled = isDisabled;
148	}
149
150	ngOnInit(): void {
151	if (this.maxlength) {
152	this.setupTextareaCount();
153	}
154
155	setTimeout(() => {
156	this.autoSize.resizeToFitContent(true);
157	}, 0);
158	}
159
160	textareaModelChange(value: string) {}
161
162	setupTextareaCount() {
163	this.thyInput$
164	.pipe(
165	filter(input => {
166	return !!input;
167	}),
168	takeUntil(this.ngUnsubscribe$),
169	switchMap(input => {
170	return input.ngControl?.valueChanges;
171	}),
172	tap(value => {
173	this.inputLength = value?.length \|\| 0;
174	this.changeDetectorRef.markForCheck();
175	}),
176	takeUntil(this.ngUnsubscribe$)
177	)
178	.subscribe();
179
180	this.thyInput$.next(this.inputDirective);
181	}
182	}

atinc / ngx-tethys / 680f7a28-9ac6-472a-8247-d3892246c266

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