@abp/ng.components 8.1.0-rc.1 → 8.1.0-rc.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/extensible/lib/components/extensible-form/extensible-form-prop.component.mjs +5 -3
- package/esm2022/extensible/lib/components/extensible-table/extensible-table.component.mjs +3 -3
- package/esm2022/extensible/lib/models/entity-props.mjs +1 -1
- package/esm2022/extensible/lib/models/form-props.mjs +5 -3
- package/esm2022/extensible/lib/models/props.mjs +3 -2
- package/extensible/lib/models/entity-props.d.ts +2 -1
- package/extensible/lib/models/form-props.d.ts +7 -1
- package/extensible/lib/models/props.d.ts +3 -1
- package/fesm2022/abp-ng.components-extensible.mjs +12 -8
- package/fesm2022/abp-ng.components-extensible.mjs.map +1 -1
- package/package.json +3 -3
|
@@ -11,7 +11,7 @@ export class PropData {
|
|
|
11
11
|
}
|
|
12
12
|
}
|
|
13
13
|
export class Prop {
|
|
14
|
-
constructor(type, name, displayName, permission, visible = _ => true, isExtra = false, template, className, formText, displayTextResolver) {
|
|
14
|
+
constructor(type, name, displayName, permission, visible = _ => true, isExtra = false, template, className, formText, tooltip, displayTextResolver) {
|
|
15
15
|
this.type = type;
|
|
16
16
|
this.name = name;
|
|
17
17
|
this.displayName = displayName;
|
|
@@ -21,6 +21,7 @@ export class Prop {
|
|
|
21
21
|
this.template = template;
|
|
22
22
|
this.className = className;
|
|
23
23
|
this.formText = formText;
|
|
24
|
+
this.tooltip = tooltip;
|
|
24
25
|
this.displayTextResolver = displayTextResolver;
|
|
25
26
|
this.displayName = this.displayName || this.name;
|
|
26
27
|
}
|
|
@@ -51,4 +52,4 @@ export class Props {
|
|
|
51
52
|
this.callbackList.pop();
|
|
52
53
|
}
|
|
53
54
|
}
|
|
54
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
55
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvcHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wYWNrYWdlcy9jb21wb25lbnRzL2V4dGVuc2libGUvc3JjL2xpYi9tb2RlbHMvcHJvcHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLFlBQVksQ0FBQztBQU14QyxNQUFNLE9BQWdCLFFBQStCLFNBQVEsVUFBYTtDQUFHO0FBRTdFLE1BQU0sT0FBZ0IsUUFBUTtJQVM1QixJQUFJLElBQUk7UUFDTixPQUFPO1lBQ0wsV0FBVyxFQUFFLElBQUksQ0FBQyxXQUFXO1lBQzdCLEtBQUssRUFBRSxJQUFJLENBQUMsS0FBSztZQUNqQixNQUFNLEVBQUUsSUFBSSxDQUFDLE1BQU07U0FDcEIsQ0FBQztJQUNKLENBQUM7Q0FDRjtBQUlELE1BQU0sT0FBZ0IsSUFBSTtJQUN4QixZQUNrQixJQUFlLEVBQ2YsSUFBWSxFQUNaLFdBQW1CLEVBQ25CLFVBQWtCLEVBQ2xCLFVBQTRCLENBQUMsQ0FBQyxFQUFFLENBQUMsSUFBSSxFQUNyQyxVQUFVLEtBQUssRUFDZixRQUFvQixFQUNwQixTQUFrQixFQUNsQixRQUFpQixFQUNqQixPQUF5QixFQUN6QixtQkFBZ0Q7UUFWaEQsU0FBSSxHQUFKLElBQUksQ0FBVztRQUNmLFNBQUksR0FBSixJQUFJLENBQVE7UUFDWixnQkFBVyxHQUFYLFdBQVcsQ0FBUTtRQUNuQixlQUFVLEdBQVYsVUFBVSxDQUFRO1FBQ2xCLFlBQU8sR0FBUCxPQUFPLENBQThCO1FBQ3JDLFlBQU8sR0FBUCxPQUFPLENBQVE7UUFDZixhQUFRLEdBQVIsUUFBUSxDQUFZO1FBQ3BCLGNBQVMsR0FBVCxTQUFTLENBQVM7UUFDbEIsYUFBUSxHQUFSLFFBQVEsQ0FBUztRQUNqQixZQUFPLEdBQVAsT0FBTyxDQUFrQjtRQUN6Qix3QkFBbUIsR0FBbkIsbUJBQW1CLENBQTZCO1FBRWhFLElBQUksQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDLFdBQVcsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDO0lBQ25ELENBQUM7Q0FDRjtBQU1ELE1BQU0sT0FBZ0IsWUFBWTtJQUFsQztRQUVVLHlCQUFvQixHQUFrRCxFQUFFLENBQUM7SUFPbkYsQ0FBQztJQUxDLEdBQUcsQ0FBQyxJQUFZO1FBQ2QsSUFBSSxDQUFDLG9CQUFvQixDQUFDLElBQUksQ0FBQyxHQUFHLElBQUksQ0FBQyxvQkFBb0IsQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUM7UUFFeEUsT0FBTyxJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLG9CQUFvQixDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7SUFDekQsQ0FBQztDQUNGO0FBRUQsTUFBTSxPQUFnQixLQUFLO0lBR3pCLElBQUksS0FBSztRQUNQLE1BQU0sUUFBUSxHQUFHLElBQUksSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDO1FBRWxDLElBQUksQ0FBQyxZQUFZLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQyxFQUFFLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUM7UUFFMUQsT0FBTyxRQUFRLENBQUM7SUFDbEIsQ0FBQztJQUVELFlBQTZCLFlBQTBDO1FBQTFDLGlCQUFZLEdBQVosWUFBWSxDQUE4QjtJQUFHLENBQUM7SUFFM0UsY0FBYyxDQUFDLGtCQUE4QztRQUMzRCxJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxDQUFDO0lBQzdDLENBQUM7SUFFRCxpQkFBaUI7UUFDZixPQUFPLElBQUksQ0FBQyxZQUFZLENBQUMsTUFBTTtZQUFFLElBQUksQ0FBQyxZQUFZLENBQUMsR0FBRyxFQUFFLENBQUM7SUFDM0QsQ0FBQztDQUNGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTGlua2VkTGlzdCB9IGZyb20gJ0BhYnAvdXRpbHMnO1xyXG5pbXBvcnQgeyBJbmplY3RGbGFncywgSW5qZWN0aW9uVG9rZW4sIEluamVjdE9wdGlvbnMsIFR5cGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgTyB9IGZyb20gJ3RzLXRvb2xiZWx0JztcclxuaW1wb3J0IHsgZVByb3BUeXBlIH0gZnJvbSAnLi4vZW51bXMvcHJvcHMuZW51bSc7XHJcbmltcG9ydCB7IEZvcm1Qcm9wVG9vbHRpcCB9IGZyb20gJy4vZm9ybS1wcm9wcyc7XHJcblxyXG5leHBvcnQgYWJzdHJhY3QgY2xhc3MgUHJvcExpc3Q8UiA9IGFueSwgQSA9IFByb3A8Uj4+IGV4dGVuZHMgTGlua2VkTGlzdDxBPiB7fVxyXG5cclxuZXhwb3J0IGFic3RyYWN0IGNsYXNzIFByb3BEYXRhPFIgPSBhbnk+IHtcclxuICBhYnN0cmFjdCBnZXRJbmplY3RlZDogPFQ+KFxyXG4gICAgdG9rZW46IFR5cGU8VD4gfCBJbmplY3Rpb25Ub2tlbjxUPixcclxuICAgIG5vdEZvdW5kVmFsdWU/OiBULFxyXG4gICAgb3B0aW9ucz86IEluamVjdE9wdGlvbnMgfCBJbmplY3RGbGFncyxcclxuICApID0+IFQ7XHJcbiAgaW5kZXg/OiBudW1iZXI7XHJcbiAgYWJzdHJhY3QgcmVjb3JkOiBSO1xyXG5cclxuICBnZXQgZGF0YSgpOiBSZWFkb25seVByb3BEYXRhPFI+IHtcclxuICAgIHJldHVybiB7XHJcbiAgICAgIGdldEluamVjdGVkOiB0aGlzLmdldEluamVjdGVkLFxyXG4gICAgICBpbmRleDogdGhpcy5pbmRleCxcclxuICAgICAgcmVjb3JkOiB0aGlzLnJlY29yZCxcclxuICAgIH07XHJcbiAgfVxyXG59XHJcblxyXG5leHBvcnQgdHlwZSBSZWFkb25seVByb3BEYXRhPFIgPSBhbnk+ID0gTy5SZWFkb25seTxPbWl0PFByb3BEYXRhPFI+LCAnZGF0YSc+PjtcclxuXHJcbmV4cG9ydCBhYnN0cmFjdCBjbGFzcyBQcm9wPFIgPSBhbnk+IHtcclxuICBjb25zdHJ1Y3RvcihcclxuICAgIHB1YmxpYyByZWFkb25seSB0eXBlOiBlUHJvcFR5cGUsXHJcbiAgICBwdWJsaWMgcmVhZG9ubHkgbmFtZTogc3RyaW5nLFxyXG4gICAgcHVibGljIHJlYWRvbmx5IGRpc3BsYXlOYW1lOiBzdHJpbmcsXHJcbiAgICBwdWJsaWMgcmVhZG9ubHkgcGVybWlzc2lvbjogc3RyaW5nLFxyXG4gICAgcHVibGljIHJlYWRvbmx5IHZpc2libGU6IFByb3BQcmVkaWNhdGU8Uj4gPSBfID0+IHRydWUsXHJcbiAgICBwdWJsaWMgcmVhZG9ubHkgaXNFeHRyYSA9IGZhbHNlLFxyXG4gICAgcHVibGljIHJlYWRvbmx5IHRlbXBsYXRlPzogVHlwZTxhbnk+LFxyXG4gICAgcHVibGljIHJlYWRvbmx5IGNsYXNzTmFtZT86IHN0cmluZyxcclxuICAgIHB1YmxpYyByZWFkb25seSBmb3JtVGV4dD86IHN0cmluZyxcclxuICAgIHB1YmxpYyByZWFkb25seSB0b29sdGlwPzogRm9ybVByb3BUb29sdGlwLFxyXG4gICAgcHVibGljIHJlYWRvbmx5IGRpc3BsYXlUZXh0UmVzb2x2ZXI/OiBQcm9wRGlzcGxheVRleHRSZXNvbHZlcjxSPixcclxuICApIHtcclxuICAgIHRoaXMuZGlzcGxheU5hbWUgPSB0aGlzLmRpc3BsYXlOYW1lIHx8IHRoaXMubmFtZTtcclxuICB9XHJcbn1cclxuXHJcbmV4cG9ydCB0eXBlIFByb3BDYWxsYmFjazxULCBSID0gYW55PiA9IChkYXRhOiBPbWl0PFByb3BEYXRhPFQ+LCAnZGF0YSc+LCBhdXhEYXRhPzogYW55KSA9PiBSO1xyXG5leHBvcnQgdHlwZSBQcm9wUHJlZGljYXRlPFQ+ID0gKGRhdGE/OiBPbWl0PFByb3BEYXRhPFQ+LCAnZGF0YSc+LCBhdXhEYXRhPzogYW55KSA9PiBib29sZWFuO1xyXG5leHBvcnQgdHlwZSBQcm9wRGlzcGxheVRleHRSZXNvbHZlcjxUPiA9IChkYXRhPzogT21pdDxQcm9wRGF0YTxUPiwgJ2RhdGEnPikgPT4gc3RyaW5nO1xyXG5cclxuZXhwb3J0IGFic3RyYWN0IGNsYXNzIFByb3BzRmFjdG9yeTxDIGV4dGVuZHMgUHJvcHM8YW55Pj4ge1xyXG4gIHByb3RlY3RlZCBhYnN0cmFjdCBfY3RvcjogVHlwZTxDPjtcclxuICBwcml2YXRlIGNvbnRyaWJ1dG9yQ2FsbGJhY2tzOiBQcm9wQ29udHJpYnV0b3JDYWxsYmFja3M8SW5mZXJyZWRQcm9wTGlzdDxDPj4gPSB7fTtcclxuXHJcbiAgZ2V0KG5hbWU6IHN0cmluZyk6IEMge1xyXG4gICAgdGhpcy5jb250cmlidXRvckNhbGxiYWNrc1tuYW1lXSA9IHRoaXMuY29udHJpYnV0b3JDYWxsYmFja3NbbmFtZV0gfHwgW107XHJcblxyXG4gICAgcmV0dXJuIG5ldyB0aGlzLl9jdG9yKHRoaXMuY29udHJpYnV0b3JDYWxsYmFja3NbbmFtZV0pO1xyXG4gIH1cclxufVxyXG5cclxuZXhwb3J0IGFic3RyYWN0IGNsYXNzIFByb3BzPEwgZXh0ZW5kcyBQcm9wTGlzdDxhbnksIEluZmVycmVkUHJvcDxMPj4+IHtcclxuICBwcm90ZWN0ZWQgYWJzdHJhY3QgX2N0b3I6IFR5cGU8TD47XHJcblxyXG4gIGdldCBwcm9wcygpOiBMIHtcclxuICAgIGNvbnN0IHByb3BMaXN0ID0gbmV3IHRoaXMuX2N0b3IoKTtcclxuXHJcbiAgICB0aGlzLmNhbGxiYWNrTGlzdC5mb3JFYWNoKGNhbGxiYWNrID0+IGNhbGxiYWNrKHByb3BMaXN0KSk7XHJcblxyXG4gICAgcmV0dXJuIHByb3BMaXN0O1xyXG4gIH1cclxuXHJcbiAgY29uc3RydWN0b3IocHJpdmF0ZSByZWFkb25seSBjYWxsYmFja0xpc3Q6IFByb3BDb250cmlidXRvckNhbGxiYWNrPEw+W10pIHt9XHJcblxyXG4gIGFkZENvbnRyaWJ1dG9yKGNvbnRyaWJ1dGVDYWxsYmFjazogUHJvcENvbnRyaWJ1dG9yQ2FsbGJhY2s8TD4pIHtcclxuICAgIHRoaXMuY2FsbGJhY2tMaXN0LnB1c2goY29udHJpYnV0ZUNhbGxiYWNrKTtcclxuICB9XHJcblxyXG4gIGNsZWFyQ29udHJpYnV0b3JzKCkge1xyXG4gICAgd2hpbGUgKHRoaXMuY2FsbGJhY2tMaXN0Lmxlbmd0aCkgdGhpcy5jYWxsYmFja0xpc3QucG9wKCk7XHJcbiAgfVxyXG59XHJcblxyXG5leHBvcnQgdHlwZSBQcm9wQ29udHJpYnV0b3JDYWxsYmFja3M8TCBleHRlbmRzIFByb3BMaXN0PGFueSwgSW5mZXJyZWRQcm9wPEw+Pj4gPSBSZWNvcmQ8XHJcbiAgc3RyaW5nLFxyXG4gIFByb3BDb250cmlidXRvckNhbGxiYWNrPEw+W11cclxuPjtcclxuXHJcbmV4cG9ydCB0eXBlIFByb3BDb250cmlidXRvckNhbGxiYWNrPEwgZXh0ZW5kcyBQcm9wTGlzdDxhbnksIEluZmVycmVkUHJvcDxMPj4+ID0gKFxyXG4gIHByb3BMaXN0OiBMLFxyXG4pID0+IGFueTtcclxuXHJcbnR5cGUgSW5mZXJyZWRQcm9wTGlzdDxDPiA9IEMgZXh0ZW5kcyBQcm9wczxpbmZlciBMPiA/IEwgOiBuZXZlcjtcclxuZXhwb3J0IHR5cGUgSW5mZXJyZWRQcm9wPFQ+ID0gVCBleHRlbmRzIFByb3BMaXN0PGFueSwgaW5mZXIgVT4gPyBVIDogVDtcclxuIl19
|
|
@@ -4,6 +4,7 @@ import { Observable } from 'rxjs';
|
|
|
4
4
|
import { O } from 'ts-toolbelt';
|
|
5
5
|
import { ActionCallback } from './actions';
|
|
6
6
|
import { Prop, PropCallback, PropContributorCallback, PropContributorCallbacks, PropList, Props, PropsFactory } from './props';
|
|
7
|
+
import { FormPropTooltip } from './form-props';
|
|
7
8
|
export declare class EntityPropList<R = any> extends PropList<R, EntityProp<R>> {
|
|
8
9
|
}
|
|
9
10
|
export declare class EntityProps<R = any> extends Props<EntityPropList<R>> {
|
|
@@ -19,7 +20,7 @@ export declare class EntityProp<R = any> extends Prop<R> {
|
|
|
19
20
|
readonly action?: ActionCallback<R>;
|
|
20
21
|
readonly component?: Type<any>;
|
|
21
22
|
readonly enumList?: Array<ABP.Option<any>>;
|
|
22
|
-
readonly tooltip?:
|
|
23
|
+
readonly tooltip?: FormPropTooltip;
|
|
23
24
|
readonly columnVisible: ColumnPredicate;
|
|
24
25
|
constructor(options: EntityPropOptions<R>);
|
|
25
26
|
static create<R = any>(options: EntityPropOptions<R>): EntityProp<R>;
|
|
@@ -13,8 +13,13 @@ export interface FormPropGroup {
|
|
|
13
13
|
name: string;
|
|
14
14
|
className?: string;
|
|
15
15
|
}
|
|
16
|
+
export interface FormPropTooltip {
|
|
17
|
+
text: string;
|
|
18
|
+
placement?: 'top' | 'end' | 'bottom' | 'start';
|
|
19
|
+
}
|
|
16
20
|
export declare class GroupedFormPropList<R = any> {
|
|
17
21
|
readonly items: GroupedFormPropItem[];
|
|
22
|
+
count: number;
|
|
18
23
|
addItem(item: FormProp<R>): void;
|
|
19
24
|
}
|
|
20
25
|
export interface GroupedFormPropItem {
|
|
@@ -41,6 +46,7 @@ export declare class FormProp<R = any> extends Prop<R> {
|
|
|
41
46
|
readonly group?: FormPropGroup | undefined;
|
|
42
47
|
readonly displayTextResolver?: PropDisplayTextResolver<R>;
|
|
43
48
|
readonly formText?: string;
|
|
49
|
+
readonly tooltip?: FormPropTooltip;
|
|
44
50
|
constructor(options: FormPropOptions<R>);
|
|
45
51
|
static create<R = any>(options: FormPropOptions<R>): FormProp<R>;
|
|
46
52
|
static createMany<R = any>(arrayOfOptions: FormPropOptions<R>[]): FormProp<R>[];
|
|
@@ -50,7 +56,7 @@ export declare class FormPropData<R = any> extends PropData<R> {
|
|
|
50
56
|
getInjected: PropData<R>['getInjected'];
|
|
51
57
|
constructor(injector: Injector, record: R);
|
|
52
58
|
}
|
|
53
|
-
export type FormPropOptions<R = any> = O.Optional<O.Writable<FormProp<R>>, 'permission' | 'visible' | 'displayName' | 'isExtra' | 'validators' | 'asyncValidators' | 'disabled' | 'readonly' | 'autocomplete' | 'defaultValue' | 'options' | 'id' | 'displayTextResolver' | 'formText'>;
|
|
59
|
+
export type FormPropOptions<R = any> = O.Optional<O.Writable<FormProp<R>>, 'permission' | 'visible' | 'displayName' | 'isExtra' | 'validators' | 'asyncValidators' | 'disabled' | 'readonly' | 'autocomplete' | 'defaultValue' | 'options' | 'id' | 'displayTextResolver' | 'formText' | 'tooltip'>;
|
|
54
60
|
export type CreateFormPropDefaults<R = any> = Record<string, FormProp<R>[]>;
|
|
55
61
|
export type CreateFormPropContributorCallback<R = any> = PropContributorCallback<FormPropList<R>>;
|
|
56
62
|
export type CreateFormPropContributorCallbacks<R = any> = PropContributorCallbacks<FormPropList<R>>;
|
|
@@ -2,6 +2,7 @@ import { LinkedList } from '@abp/utils';
|
|
|
2
2
|
import { InjectFlags, InjectionToken, InjectOptions, Type } from '@angular/core';
|
|
3
3
|
import { O } from 'ts-toolbelt';
|
|
4
4
|
import { ePropType } from '../enums/props.enum';
|
|
5
|
+
import { FormPropTooltip } from './form-props';
|
|
5
6
|
export declare abstract class PropList<R = any, A = Prop<R>> extends LinkedList<A> {
|
|
6
7
|
}
|
|
7
8
|
export declare abstract class PropData<R = any> {
|
|
@@ -21,8 +22,9 @@ export declare abstract class Prop<R = any> {
|
|
|
21
22
|
readonly template?: Type<any>;
|
|
22
23
|
readonly className?: string;
|
|
23
24
|
readonly formText?: string;
|
|
25
|
+
readonly tooltip?: FormPropTooltip;
|
|
24
26
|
readonly displayTextResolver?: PropDisplayTextResolver<R>;
|
|
25
|
-
constructor(type: ePropType, name: string, displayName: string, permission: string, visible?: PropPredicate<R>, isExtra?: boolean, template?: Type<any>, className?: string, formText?: string, displayTextResolver?: PropDisplayTextResolver<R>);
|
|
27
|
+
constructor(type: ePropType, name: string, displayName: string, permission: string, visible?: PropPredicate<R>, isExtra?: boolean, template?: Type<any>, className?: string, formText?: string, tooltip?: FormPropTooltip, displayTextResolver?: PropDisplayTextResolver<R>);
|
|
26
28
|
}
|
|
27
29
|
export type PropCallback<T, R = any> = (data: Omit<PropData<T>, 'data'>, auxData?: any) => R;
|
|
28
30
|
export type PropPredicate<T> = (data?: Omit<PropData<T>, 'data'>, auxData?: any) => boolean;
|
|
@@ -3,7 +3,7 @@ import { Optional, SkipSelf, Component, ChangeDetectionStrategy, Input, ViewChil
|
|
|
3
3
|
import * as i2 from '@angular/forms';
|
|
4
4
|
import { ReactiveFormsModule, ControlContainer, Validators, FormGroupDirective, FormsModule, UntypedFormGroup, UntypedFormControl } from '@angular/forms';
|
|
5
5
|
import * as i1 from '@ng-bootstrap/ng-bootstrap';
|
|
6
|
-
import { NgbInputDatepicker, NgbTimepicker, NgbDatepickerModule, NgbTimepickerModule, NgbDateAdapter, NgbTimeAdapter, NgbTypeaheadModule, NgbDropdownModule,
|
|
6
|
+
import { NgbInputDatepicker, NgbTimepicker, NgbDatepickerModule, NgbTimepickerModule, NgbDateAdapter, NgbTimeAdapter, NgbTooltip, NgbTypeaheadModule, NgbDropdownModule, NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
|
|
7
7
|
import { LinkedList } from '@abp/utils';
|
|
8
8
|
import { DateTimeAdapter, DisabledDirective, DateAdapter, TimeAdapter, EllipsisDirective, AbpVisibleDirective, NgxDatatableDefaultDirective, NgxDatatableListDirective, ThemeSharedModule } from '@abp/ng.theme.shared';
|
|
9
9
|
import * as i5 from '@angular/common';
|
|
@@ -29,7 +29,7 @@ class PropData {
|
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
class Prop {
|
|
32
|
-
constructor(type, name, displayName, permission, visible = _ => true, isExtra = false, template, className, formText, displayTextResolver) {
|
|
32
|
+
constructor(type, name, displayName, permission, visible = _ => true, isExtra = false, template, className, formText, tooltip, displayTextResolver) {
|
|
33
33
|
this.type = type;
|
|
34
34
|
this.name = name;
|
|
35
35
|
this.displayName = displayName;
|
|
@@ -39,6 +39,7 @@ class Prop {
|
|
|
39
39
|
this.template = template;
|
|
40
40
|
this.className = className;
|
|
41
41
|
this.formText = formText;
|
|
42
|
+
this.tooltip = tooltip;
|
|
42
43
|
this.displayTextResolver = displayTextResolver;
|
|
43
44
|
this.displayName = this.displayName || this.name;
|
|
44
45
|
}
|
|
@@ -81,6 +82,7 @@ class FormProps extends Props {
|
|
|
81
82
|
class GroupedFormPropList {
|
|
82
83
|
constructor() {
|
|
83
84
|
this.items = [];
|
|
85
|
+
this.count = 1;
|
|
84
86
|
}
|
|
85
87
|
addItem(item) {
|
|
86
88
|
const groupName = item.group?.name;
|
|
@@ -91,7 +93,7 @@ class GroupedFormPropList {
|
|
|
91
93
|
else {
|
|
92
94
|
group = {
|
|
93
95
|
formPropList: new FormPropList(),
|
|
94
|
-
group: item.group,
|
|
96
|
+
group: item.group || { name: `default${this.count++}`, className: item.group?.className },
|
|
95
97
|
};
|
|
96
98
|
group.formPropList.addHead(item);
|
|
97
99
|
this.items.push(group);
|
|
@@ -112,10 +114,11 @@ class EditFormPropsFactory extends PropsFactory {
|
|
|
112
114
|
}
|
|
113
115
|
class FormProp extends Prop {
|
|
114
116
|
constructor(options) {
|
|
115
|
-
super(options.type, options.name, options.displayName || '', options.permission || '', options.visible, options.isExtra, options.template, options.className, options.formText);
|
|
117
|
+
super(options.type, options.name, options.displayName || '', options.permission || '', options.visible, options.isExtra, options.template, options.className, options.formText, options.tooltip);
|
|
116
118
|
this.group = options.group;
|
|
117
119
|
this.className = options.className;
|
|
118
120
|
this.formText = options.formText;
|
|
121
|
+
this.tooltip = options.tooltip;
|
|
119
122
|
this.asyncValidators = options.asyncValidators || (_ => []);
|
|
120
123
|
this.validators = options.validators || (_ => []);
|
|
121
124
|
this.disabled = options.disabled || (_ => false);
|
|
@@ -518,7 +521,7 @@ class ExtensibleFormPropComponent {
|
|
|
518
521
|
this.typeaheadModel = { key: keyControl.value, value: valueControl.value };
|
|
519
522
|
}
|
|
520
523
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: ExtensibleFormPropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
521
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.3", type: ExtensibleFormPropComponent, isStandalone: true, selector: "abp-extensible-form-prop", inputs: { data: "data", prop: "prop", first: "first" }, providers: [ExtensibleFormPropService], viewQueries: [{ propertyName: "fieldRef", first: true, predicate: ["field"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container\r\n [ngSwitch]=\"getComponent(prop)\"\r\n *abpPermission=\"prop.permission; runChangeDetection: false\"\r\n>\r\n <ng-template ngSwitchCase=\"template\">\r\n <ng-container *ngComponentOutlet=\"prop.template; injector: injectorForCustomComponent\">\r\n </ng-container>\r\n </ng-template>\r\n\r\n <div [ngClass]=\"containerClassName\" class=\"mb-2\">\r\n <ng-template ngSwitchCase=\"input\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <input\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [autocomplete]=\"prop.autocomplete\"\r\n [type]=\"getType(prop)\"\r\n [abpDisabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n class=\"form-control\"\r\n />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"hidden\">\r\n <input [formControlName]=\"prop.name\" type=\"hidden\" />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"checkbox\">\r\n <div class=\"form-check\" validationTarget>\r\n <input\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n type=\"checkbox\"\r\n class=\"form-check-input\"\r\n />\r\n <ng-template\r\n [ngTemplateOutlet]=\"label\"\r\n [ngTemplateOutletContext]=\"{ $implicit: 'form-check-label' }\"\r\n ></ng-template>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"select\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <select\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n class=\"form-select form-control\"\r\n >\r\n @for (option of options$ | async; track option.value) {\r\n <option\r\n [ngValue]=\"option.value\"\r\n >\r\n {{ option.key }}\r\n </option>\r\n }\r\n </select>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"multiselect\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <select\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n multiple=\"multiple\"\r\n class=\"form-select form-control\"\r\n >\r\n <option\r\n *ngFor=\"let option of options$ | async; trackBy: track.by('value')\"\r\n [ngValue]=\"option.value\"\r\n >\r\n {{ option.key }}\r\n </option>\r\n </select>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"typeahead\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <div #typeahead class=\"position-relative\" validationStyle validationTarget>\r\n <input\r\n #field\r\n [id]=\"prop.id\"\r\n [autocomplete]=\"prop.autocomplete\"\r\n [abpDisabled]=\"disabled\"\r\n [ngbTypeahead]=\"search\"\r\n [editable]=\"false\"\r\n [inputFormatter]=\"typeaheadFormatter\"\r\n [resultFormatter]=\"typeaheadFormatter\"\r\n [ngModelOptions]=\"{ standalone: true }\"\r\n [(ngModel)]=\"typeaheadModel\"\r\n (selectItem)=\"setTypeaheadValue($event.item)\"\r\n (blur)=\"setTypeaheadValue(typeaheadModel)\"\r\n [class.is-invalid]=\"typeahead.classList.contains('is-invalid')\"\r\n class=\"form-control\"\r\n />\r\n <input [formControlName]=\"prop.name\" type=\"hidden\" />\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"date\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <input\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n (click)=\"datepicker.open()\"\r\n (keyup.space)=\"datepicker.open()\"\r\n ngbDatepicker\r\n #datepicker=\"ngbDatepicker\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"time\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <ngb-timepicker [formControlName]=\"prop.name\"></ngb-timepicker>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"dateTime\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <abp-extensible-date-time-picker [prop]=\"prop\" [meridian]=\"meridian$ | async\" />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"textarea\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <textarea\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n class=\"form-control\"\r\n ></textarea>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"passwordinputgroup\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <div class=\"input-group form-group\" validationTarget>\r\n <input\r\n class=\"form-control\"\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpShowPassword]=\"showPassword\"\r\n />\r\n <button class=\"btn btn-secondary\" type=\"button\" (click)=\"showPassword = !showPassword\">\r\n <i\r\n class=\"fa\"\r\n aria-hidden=\"true\"\r\n [ngClass]=\"{\r\n 'fa-eye-slash': !showPassword,\r\n 'fa-eye': showPassword\r\n }\"\r\n ></i>\r\n </button>\r\n </div>\r\n </ng-template>\r\n\r\n @if (prop.formText) {\r\n <small class=\"text-muted d-block\">{{\r\n prop.formText | abpLocalization\r\n }}</small>\r\n }\r\n </div>\r\n</ng-container>\r\n\r\n<ng-template #label let-classes>\r\n <label [htmlFor]=\"prop.id\" [ngClass]=\"classes || 'form-label'\">\r\n @if (prop.displayTextResolver) {\r\n {{ prop.displayTextResolver(data) | abpLocalization }}\r\n }@else{\r\n {{ prop.displayName | abpLocalization }}\r\n }\r\n {{ asterisk }}\r\n </label>\r\n</ng-template>\r\n", dependencies: [{ kind: "component", type: ExtensibleDateTimePickerComponent, selector: "abp-extensible-date-time-picker", inputs: ["prop", "meridian"], exportAs: ["abpExtensibleDateTimePicker"] }, { kind: "ngmodule", type: NgbDatepickerModule }, { kind: "directive", type: i1.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "ngmodule", type: NgbTimepickerModule }, { kind: "component", type: i1.NgbTimepicker, selector: "ngb-timepicker", inputs: ["meridian", "spinners", "seconds", "hourStep", "minuteStep", "secondStep", "readonlyInputs", "size"], exportAs: ["ngbTimepicker"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.SelectMultipleControlValueAccessor, selector: "select[multiple][formControlName],select[multiple][formControl],select[multiple][ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: DisabledDirective, selector: "[abpDisabled]", inputs: ["abpDisabled"] }, { kind: "ngmodule", type: NgxValidateCoreModule }, { kind: "directive", type: i3.ValidationStyleDirective, selector: "[validationStyle]", exportAs: ["validationStyle"] }, { kind: "directive", type: i3.ValidationTargetDirective, selector: "[validationTarget]", exportAs: ["validationTarget"] }, { kind: "directive", type: i3.ValidationDirective, selector: "[formControl],[formControlName]", exportAs: ["validationDirective"] }, { kind: "ngmodule", type: NgbTypeaheadModule }, { kind: "directive", type: i1.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "container", "editable", "focusFirst", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate", "selectOnExact", "showHint", "placement", "popperOptions", "popupClass"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { kind: "directive", type: ShowPasswordDirective, selector: "[abpShowPassword]", inputs: ["abpShowPassword"] }, { kind: "directive", type: PermissionDirective, selector: "[abpPermission]", inputs: ["abpPermission", "abpPermissionRunChangeDetection"] }, { kind: "ngmodule", type: LocalizationModule }, { kind: "pipe", type: i2$1.LocalizationPipe, name: "abpLocalization" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], viewProviders: [
|
|
524
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.3", type: ExtensibleFormPropComponent, isStandalone: true, selector: "abp-extensible-form-prop", inputs: { data: "data", prop: "prop", first: "first" }, providers: [ExtensibleFormPropService], viewQueries: [{ propertyName: "fieldRef", first: true, predicate: ["field"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"getComponent(prop)\" *abpPermission=\"prop.permission; runChangeDetection: false\">\r\n <ng-template ngSwitchCase=\"template\">\r\n <ng-container *ngComponentOutlet=\"prop.template; injector: injectorForCustomComponent\">\r\n </ng-container>\r\n </ng-template>\r\n\r\n <div [ngClass]=\"containerClassName\" class=\"mb-2\">\r\n <ng-template ngSwitchCase=\"input\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <input\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [autocomplete]=\"prop.autocomplete\"\r\n [type]=\"getType(prop)\"\r\n [abpDisabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n class=\"form-control\"\r\n />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"hidden\">\r\n <input [formControlName]=\"prop.name\" type=\"hidden\" />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"checkbox\">\r\n <div class=\"form-check\" validationTarget>\r\n <input\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n type=\"checkbox\"\r\n class=\"form-check-input\"\r\n />\r\n <ng-template\r\n [ngTemplateOutlet]=\"label\"\r\n [ngTemplateOutletContext]=\"{ $implicit: 'form-check-label' }\"\r\n ></ng-template>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"select\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <select\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n class=\"form-select form-control\"\r\n >\r\n @for (option of options$ | async; track option.value) {\r\n <option\r\n [ngValue]=\"option.value\"\r\n >\r\n {{ option.key }}\r\n </option>\r\n }\r\n </select>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"multiselect\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <select\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n multiple=\"multiple\"\r\n class=\"form-select form-control\"\r\n >\r\n <option\r\n *ngFor=\"let option of options$ | async; trackBy: track.by('value')\"\r\n [ngValue]=\"option.value\"\r\n >\r\n {{ option.key }}\r\n </option>\r\n </select>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"typeahead\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <div #typeahead class=\"position-relative\" validationStyle validationTarget>\r\n <input\r\n #field\r\n [id]=\"prop.id\"\r\n [autocomplete]=\"prop.autocomplete\"\r\n [abpDisabled]=\"disabled\"\r\n [ngbTypeahead]=\"search\"\r\n [editable]=\"false\"\r\n [inputFormatter]=\"typeaheadFormatter\"\r\n [resultFormatter]=\"typeaheadFormatter\"\r\n [ngModelOptions]=\"{ standalone: true }\"\r\n [(ngModel)]=\"typeaheadModel\"\r\n (selectItem)=\"setTypeaheadValue($event.item)\"\r\n (blur)=\"setTypeaheadValue(typeaheadModel)\"\r\n [class.is-invalid]=\"typeahead.classList.contains('is-invalid')\"\r\n class=\"form-control\"\r\n />\r\n <input [formControlName]=\"prop.name\" type=\"hidden\" />\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"date\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <input\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n (click)=\"datepicker.open()\"\r\n (keyup.space)=\"datepicker.open()\"\r\n ngbDatepicker\r\n #datepicker=\"ngbDatepicker\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"time\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <ngb-timepicker [formControlName]=\"prop.name\"></ngb-timepicker>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"dateTime\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <abp-extensible-date-time-picker [prop]=\"prop\" [meridian]=\"meridian$ | async\" />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"textarea\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <textarea\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n class=\"form-control\"\r\n ></textarea>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"passwordinputgroup\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <div class=\"input-group form-group\" validationTarget>\r\n <input\r\n class=\"form-control\"\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpShowPassword]=\"showPassword\"\r\n />\r\n <button class=\"btn btn-secondary\" type=\"button\" (click)=\"showPassword = !showPassword\">\r\n <i\r\n class=\"fa\"\r\n aria-hidden=\"true\"\r\n [ngClass]=\"{\r\n 'fa-eye-slash': !showPassword,\r\n 'fa-eye': showPassword\r\n }\"\r\n ></i>\r\n </button>\r\n </div>\r\n </ng-template>\r\n\r\n @if (prop.formText) {\r\n <small class=\"text-muted d-block\">{{\r\n prop.formText | abpLocalization\r\n }}</small>\r\n }\r\n </div>\r\n</ng-container>\r\n\r\n<ng-template #label let-classes>\r\n <label [htmlFor]=\"prop.id\" [ngClass]=\"classes || 'form-label'\">\r\n @if (prop.displayTextResolver) {\r\n {{ prop.displayTextResolver(data) | abpLocalization }}\r\n }@else{\r\n {{ prop.displayName | abpLocalization }}\r\n }\r\n {{ asterisk }}\r\n @if (prop.tooltip) {\r\n <i [ngbTooltip]=\"prop.tooltip.text | abpLocalization\" [placement]=\"prop.tooltip.placement || 'auto'\" container=\"body\" class=\"bi bi-info-circle\"></i>\r\n }\r\n </label>\r\n</ng-template>\r\n", dependencies: [{ kind: "component", type: ExtensibleDateTimePickerComponent, selector: "abp-extensible-date-time-picker", inputs: ["prop", "meridian"], exportAs: ["abpExtensibleDateTimePicker"] }, { kind: "ngmodule", type: NgbDatepickerModule }, { kind: "directive", type: i1.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "ngmodule", type: NgbTimepickerModule }, { kind: "component", type: i1.NgbTimepicker, selector: "ngb-timepicker", inputs: ["meridian", "spinners", "seconds", "hourStep", "minuteStep", "secondStep", "readonlyInputs", "size"], exportAs: ["ngbTimepicker"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.SelectMultipleControlValueAccessor, selector: "select[multiple][formControlName],select[multiple][formControl],select[multiple][ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: DisabledDirective, selector: "[abpDisabled]", inputs: ["abpDisabled"] }, { kind: "ngmodule", type: NgxValidateCoreModule }, { kind: "directive", type: i3.ValidationStyleDirective, selector: "[validationStyle]", exportAs: ["validationStyle"] }, { kind: "directive", type: i3.ValidationTargetDirective, selector: "[validationTarget]", exportAs: ["validationTarget"] }, { kind: "directive", type: i3.ValidationDirective, selector: "[formControl],[formControlName]", exportAs: ["validationDirective"] }, { kind: "directive", type: NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "ngmodule", type: NgbTypeaheadModule }, { kind: "directive", type: i1.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "container", "editable", "focusFirst", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate", "selectOnExact", "showHint", "placement", "popperOptions", "popupClass"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { kind: "directive", type: ShowPasswordDirective, selector: "[abpShowPassword]", inputs: ["abpShowPassword"] }, { kind: "directive", type: PermissionDirective, selector: "[abpPermission]", inputs: ["abpPermission", "abpPermissionRunChangeDetection"] }, { kind: "ngmodule", type: LocalizationModule }, { kind: "pipe", type: i2$1.LocalizationPipe, name: "abpLocalization" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], viewProviders: [
|
|
522
525
|
{
|
|
523
526
|
provide: ControlContainer,
|
|
524
527
|
useFactory: selfFactory,
|
|
@@ -537,6 +540,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImpor
|
|
|
537
540
|
ReactiveFormsModule,
|
|
538
541
|
DisabledDirective,
|
|
539
542
|
NgxValidateCoreModule,
|
|
543
|
+
NgbTooltip,
|
|
540
544
|
NgbTypeaheadModule,
|
|
541
545
|
CreateInjectorPipe,
|
|
542
546
|
ShowPasswordDirective,
|
|
@@ -552,7 +556,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImpor
|
|
|
552
556
|
},
|
|
553
557
|
{ provide: NgbDateAdapter, useClass: DateAdapter },
|
|
554
558
|
{ provide: NgbTimeAdapter, useClass: TimeAdapter },
|
|
555
|
-
], template: "<ng-container
|
|
559
|
+
], template: "<ng-container [ngSwitch]=\"getComponent(prop)\" *abpPermission=\"prop.permission; runChangeDetection: false\">\r\n <ng-template ngSwitchCase=\"template\">\r\n <ng-container *ngComponentOutlet=\"prop.template; injector: injectorForCustomComponent\">\r\n </ng-container>\r\n </ng-template>\r\n\r\n <div [ngClass]=\"containerClassName\" class=\"mb-2\">\r\n <ng-template ngSwitchCase=\"input\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <input\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [autocomplete]=\"prop.autocomplete\"\r\n [type]=\"getType(prop)\"\r\n [abpDisabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n class=\"form-control\"\r\n />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"hidden\">\r\n <input [formControlName]=\"prop.name\" type=\"hidden\" />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"checkbox\">\r\n <div class=\"form-check\" validationTarget>\r\n <input\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n type=\"checkbox\"\r\n class=\"form-check-input\"\r\n />\r\n <ng-template\r\n [ngTemplateOutlet]=\"label\"\r\n [ngTemplateOutletContext]=\"{ $implicit: 'form-check-label' }\"\r\n ></ng-template>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"select\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <select\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n class=\"form-select form-control\"\r\n >\r\n @for (option of options$ | async; track option.value) {\r\n <option\r\n [ngValue]=\"option.value\"\r\n >\r\n {{ option.key }}\r\n </option>\r\n }\r\n </select>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"multiselect\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <select\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n multiple=\"multiple\"\r\n class=\"form-select form-control\"\r\n >\r\n <option\r\n *ngFor=\"let option of options$ | async; trackBy: track.by('value')\"\r\n [ngValue]=\"option.value\"\r\n >\r\n {{ option.key }}\r\n </option>\r\n </select>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"typeahead\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <div #typeahead class=\"position-relative\" validationStyle validationTarget>\r\n <input\r\n #field\r\n [id]=\"prop.id\"\r\n [autocomplete]=\"prop.autocomplete\"\r\n [abpDisabled]=\"disabled\"\r\n [ngbTypeahead]=\"search\"\r\n [editable]=\"false\"\r\n [inputFormatter]=\"typeaheadFormatter\"\r\n [resultFormatter]=\"typeaheadFormatter\"\r\n [ngModelOptions]=\"{ standalone: true }\"\r\n [(ngModel)]=\"typeaheadModel\"\r\n (selectItem)=\"setTypeaheadValue($event.item)\"\r\n (blur)=\"setTypeaheadValue(typeaheadModel)\"\r\n [class.is-invalid]=\"typeahead.classList.contains('is-invalid')\"\r\n class=\"form-control\"\r\n />\r\n <input [formControlName]=\"prop.name\" type=\"hidden\" />\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"date\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <input\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n (click)=\"datepicker.open()\"\r\n (keyup.space)=\"datepicker.open()\"\r\n ngbDatepicker\r\n #datepicker=\"ngbDatepicker\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"time\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <ngb-timepicker [formControlName]=\"prop.name\"></ngb-timepicker>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"dateTime\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <abp-extensible-date-time-picker [prop]=\"prop\" [meridian]=\"meridian$ | async\" />\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"textarea\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <textarea\r\n #field\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpDisabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n class=\"form-control\"\r\n ></textarea>\r\n </ng-template>\r\n\r\n <ng-template ngSwitchCase=\"passwordinputgroup\">\r\n <ng-template [ngTemplateOutlet]=\"label\"></ng-template>\r\n <div class=\"input-group form-group\" validationTarget>\r\n <input\r\n class=\"form-control\"\r\n [id]=\"prop.id\"\r\n [formControlName]=\"prop.name\"\r\n [abpShowPassword]=\"showPassword\"\r\n />\r\n <button class=\"btn btn-secondary\" type=\"button\" (click)=\"showPassword = !showPassword\">\r\n <i\r\n class=\"fa\"\r\n aria-hidden=\"true\"\r\n [ngClass]=\"{\r\n 'fa-eye-slash': !showPassword,\r\n 'fa-eye': showPassword\r\n }\"\r\n ></i>\r\n </button>\r\n </div>\r\n </ng-template>\r\n\r\n @if (prop.formText) {\r\n <small class=\"text-muted d-block\">{{\r\n prop.formText | abpLocalization\r\n }}</small>\r\n }\r\n </div>\r\n</ng-container>\r\n\r\n<ng-template #label let-classes>\r\n <label [htmlFor]=\"prop.id\" [ngClass]=\"classes || 'form-label'\">\r\n @if (prop.displayTextResolver) {\r\n {{ prop.displayTextResolver(data) | abpLocalization }}\r\n }@else{\r\n {{ prop.displayName | abpLocalization }}\r\n }\r\n {{ asterisk }}\r\n @if (prop.tooltip) {\r\n <i [ngbTooltip]=\"prop.tooltip.text | abpLocalization\" [placement]=\"prop.tooltip.placement || 'auto'\" container=\"body\" class=\"bi bi-info-circle\"></i>\r\n }\r\n </label>\r\n</ng-template>\r\n" }]
|
|
556
560
|
}], propDecorators: { data: [{
|
|
557
561
|
type: Input
|
|
558
562
|
}], prop: [{
|
|
@@ -996,7 +1000,7 @@ class ExtensibleTableComponent {
|
|
|
996
1000
|
});
|
|
997
1001
|
}
|
|
998
1002
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: ExtensibleTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
999
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.3", type: ExtensibleTableComponent, isStandalone: true, selector: "abp-extensible-table", inputs: { actionsText: "actionsText", data: "data", list: "list", recordsTotal: "recordsTotal", actionsColumnWidth: "actionsColumnWidth", actionsTemplate: "actionsTemplate" }, outputs: { tableActivate: "tableActivate" }, exportAs: ["abpExtensibleTable"], usesOnChanges: true, ngImport: i0, template: "<ngx-datatable\r\n default\r\n [rows]=\"data\"\r\n [count]=\"recordsTotal\"\r\n [list]=\"list\"\r\n (activate)=\"tableActivate.emit($event)\"\r\n>\r\n @if (actionsTemplate || (actionList.length && hasAtLeastOnePermittedAction)) {\r\n <ngx-datatable-column\r\n [name]=\"actionsText | abpLocalization\"\r\n [maxWidth]=\"columnWidths[0]\"\r\n [width]=\"columnWidths[0]\"\r\n [sortable]=\"false\"\r\n >\r\n <ng-template let-row=\"row\" let-i=\"rowIndex\" ngx-datatable-cell-template>\r\n <ng-container\r\n *ngTemplateOutlet=\"actionsTemplate || gridActions; context: { $implicit: row, index: i }\"\r\n ></ng-container>\r\n <ng-template #gridActions>\r\n <abp-grid-actions [index]=\"i\" [record]=\"row\" text=\"AbpUi::Actions\"></abp-grid-actions>\r\n </ng-template>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n } @for (prop of propList; track prop.name; let i = $index) {\r\n <ngx-datatable-column\r\n *abpVisible=\"prop.columnVisible(getInjected)\"\r\n [width]=\"columnWidths[i + 1] || 200\"\r\n [name]=\"prop.displayName | abpLocalization\"\r\n [prop]=\"prop.name\"\r\n [sortable]=\"prop.sortable\"\r\n >\r\n <ng-template ngx-datatable-header-template let-column=\"column\">\r\n @if (prop.tooltip) {\r\n <span [ngbTooltip]=\"prop.tooltip | abpLocalization\" container=\"body\">\r\n
|
|
1003
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.3", type: ExtensibleTableComponent, isStandalone: true, selector: "abp-extensible-table", inputs: { actionsText: "actionsText", data: "data", list: "list", recordsTotal: "recordsTotal", actionsColumnWidth: "actionsColumnWidth", actionsTemplate: "actionsTemplate" }, outputs: { tableActivate: "tableActivate" }, exportAs: ["abpExtensibleTable"], usesOnChanges: true, ngImport: i0, template: "<ngx-datatable\r\n default\r\n [rows]=\"data\"\r\n [count]=\"recordsTotal\"\r\n [list]=\"list\"\r\n (activate)=\"tableActivate.emit($event)\"\r\n>\r\n @if (actionsTemplate || (actionList.length && hasAtLeastOnePermittedAction)) {\r\n <ngx-datatable-column\r\n [name]=\"actionsText | abpLocalization\"\r\n [maxWidth]=\"columnWidths[0]\"\r\n [width]=\"columnWidths[0]\"\r\n [sortable]=\"false\"\r\n >\r\n <ng-template let-row=\"row\" let-i=\"rowIndex\" ngx-datatable-cell-template>\r\n <ng-container\r\n *ngTemplateOutlet=\"actionsTemplate || gridActions; context: { $implicit: row, index: i }\"\r\n ></ng-container>\r\n <ng-template #gridActions>\r\n <abp-grid-actions [index]=\"i\" [record]=\"row\" text=\"AbpUi::Actions\"></abp-grid-actions>\r\n </ng-template>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n } @for (prop of propList; track prop.name; let i = $index) {\r\n <ngx-datatable-column\r\n *abpVisible=\"prop.columnVisible(getInjected)\"\r\n [width]=\"columnWidths[i + 1] || 200\"\r\n [name]=\"prop.displayName | abpLocalization\"\r\n [prop]=\"prop.name\"\r\n [sortable]=\"prop.sortable\"\r\n >\r\n <ng-template ngx-datatable-header-template let-column=\"column\">\r\n @if (prop.tooltip) {\r\n <span [ngbTooltip]=\"prop.tooltip.text | abpLocalization\" [placement]=\"prop.tooltip.placement || 'auto'\"\r\n container=\"body\">\r\n {{ column.name }} <i class=\"fa fa-info-circle\" aria-hidden=\"true\"></i>\r\n </span>\r\n }@else{\r\n {{ column.name }}\r\n }\r\n </ng-template>\r\n <ng-template let-row=\"row\" let-i=\"index\" ngx-datatable-cell-template>\r\n <ng-container *abpPermission=\"prop.permission; runChangeDetection: false\">\r\n <ng-container *abpVisible=\"row['_' + prop.name]?.visible\">\r\n @if (!row['_' + prop.name].component) {\r\n <div\r\n [innerHTML]=\"row['_' + prop.name]?.value | async\"\r\n (click)=\"\r\n prop.action && prop.action({ getInjected: getInjected, record: row, index: i })\r\n \"\r\n [ngClass]=\"entityPropTypeClasses[prop.type]\"\r\n [class.pointer]=\"prop.action\"\r\n ></div>\r\n }@else{\r\n <ng-container\r\n *ngComponentOutlet=\"\r\n row['_' + prop.name].component;\r\n injector: row['_' + prop.name].injector\r\n \"\r\n ></ng-container>\r\n }\r\n </ng-container>\r\n </ng-container>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n }\r\n</ngx-datatable>\r\n", dependencies: [{ kind: "directive", type: AbpVisibleDirective, selector: "[abpVisible]", inputs: ["abpVisible"] }, { kind: "ngmodule", type: NgxDatatableModule }, { kind: "component", type: i1$1.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction"] }, { kind: "directive", type: i1$1.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate"] }, { kind: "directive", type: i1$1.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i1$1.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "component", type: GridActionsComponent, selector: "abp-grid-actions", inputs: ["icon", "index", "text"], exportAs: ["abpGridActions"] }, { kind: "directive", type: NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: NgxDatatableDefaultDirective, selector: "ngx-datatable[default]", inputs: ["class"], exportAs: ["ngxDatatableDefault"] }, { kind: "directive", type: NgxDatatableListDirective, selector: "ngx-datatable[list]", inputs: ["list"], exportAs: ["ngxDatatableList"] }, { kind: "directive", type: PermissionDirective, selector: "[abpPermission]", inputs: ["abpPermission", "abpPermissionRunChangeDetection"] }, { kind: "ngmodule", type: LocalizationModule }, { kind: "pipe", type: i2$1.LocalizationPipe, name: "abpLocalization" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1000
1004
|
}
|
|
1001
1005
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: ExtensibleTableComponent, decorators: [{
|
|
1002
1006
|
type: Component,
|
|
@@ -1012,7 +1016,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImpor
|
|
|
1012
1016
|
AsyncPipe,
|
|
1013
1017
|
NgTemplateOutlet,
|
|
1014
1018
|
NgComponentOutlet,
|
|
1015
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ngx-datatable\r\n default\r\n [rows]=\"data\"\r\n [count]=\"recordsTotal\"\r\n [list]=\"list\"\r\n (activate)=\"tableActivate.emit($event)\"\r\n>\r\n @if (actionsTemplate || (actionList.length && hasAtLeastOnePermittedAction)) {\r\n <ngx-datatable-column\r\n [name]=\"actionsText | abpLocalization\"\r\n [maxWidth]=\"columnWidths[0]\"\r\n [width]=\"columnWidths[0]\"\r\n [sortable]=\"false\"\r\n >\r\n <ng-template let-row=\"row\" let-i=\"rowIndex\" ngx-datatable-cell-template>\r\n <ng-container\r\n *ngTemplateOutlet=\"actionsTemplate || gridActions; context: { $implicit: row, index: i }\"\r\n ></ng-container>\r\n <ng-template #gridActions>\r\n <abp-grid-actions [index]=\"i\" [record]=\"row\" text=\"AbpUi::Actions\"></abp-grid-actions>\r\n </ng-template>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n } @for (prop of propList; track prop.name; let i = $index) {\r\n <ngx-datatable-column\r\n *abpVisible=\"prop.columnVisible(getInjected)\"\r\n [width]=\"columnWidths[i + 1] || 200\"\r\n [name]=\"prop.displayName | abpLocalization\"\r\n [prop]=\"prop.name\"\r\n [sortable]=\"prop.sortable\"\r\n >\r\n <ng-template ngx-datatable-header-template let-column=\"column\">\r\n @if (prop.tooltip) {\r\n <span [ngbTooltip]=\"prop.tooltip | abpLocalization\" container=\"body\">\r\n
|
|
1019
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ngx-datatable\r\n default\r\n [rows]=\"data\"\r\n [count]=\"recordsTotal\"\r\n [list]=\"list\"\r\n (activate)=\"tableActivate.emit($event)\"\r\n>\r\n @if (actionsTemplate || (actionList.length && hasAtLeastOnePermittedAction)) {\r\n <ngx-datatable-column\r\n [name]=\"actionsText | abpLocalization\"\r\n [maxWidth]=\"columnWidths[0]\"\r\n [width]=\"columnWidths[0]\"\r\n [sortable]=\"false\"\r\n >\r\n <ng-template let-row=\"row\" let-i=\"rowIndex\" ngx-datatable-cell-template>\r\n <ng-container\r\n *ngTemplateOutlet=\"actionsTemplate || gridActions; context: { $implicit: row, index: i }\"\r\n ></ng-container>\r\n <ng-template #gridActions>\r\n <abp-grid-actions [index]=\"i\" [record]=\"row\" text=\"AbpUi::Actions\"></abp-grid-actions>\r\n </ng-template>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n } @for (prop of propList; track prop.name; let i = $index) {\r\n <ngx-datatable-column\r\n *abpVisible=\"prop.columnVisible(getInjected)\"\r\n [width]=\"columnWidths[i + 1] || 200\"\r\n [name]=\"prop.displayName | abpLocalization\"\r\n [prop]=\"prop.name\"\r\n [sortable]=\"prop.sortable\"\r\n >\r\n <ng-template ngx-datatable-header-template let-column=\"column\">\r\n @if (prop.tooltip) {\r\n <span [ngbTooltip]=\"prop.tooltip.text | abpLocalization\" [placement]=\"prop.tooltip.placement || 'auto'\"\r\n container=\"body\">\r\n {{ column.name }} <i class=\"fa fa-info-circle\" aria-hidden=\"true\"></i>\r\n </span>\r\n }@else{\r\n {{ column.name }}\r\n }\r\n </ng-template>\r\n <ng-template let-row=\"row\" let-i=\"index\" ngx-datatable-cell-template>\r\n <ng-container *abpPermission=\"prop.permission; runChangeDetection: false\">\r\n <ng-container *abpVisible=\"row['_' + prop.name]?.visible\">\r\n @if (!row['_' + prop.name].component) {\r\n <div\r\n [innerHTML]=\"row['_' + prop.name]?.value | async\"\r\n (click)=\"\r\n prop.action && prop.action({ getInjected: getInjected, record: row, index: i })\r\n \"\r\n [ngClass]=\"entityPropTypeClasses[prop.type]\"\r\n [class.pointer]=\"prop.action\"\r\n ></div>\r\n }@else{\r\n <ng-container\r\n *ngComponentOutlet=\"\r\n row['_' + prop.name].component;\r\n injector: row['_' + prop.name].injector\r\n \"\r\n ></ng-container>\r\n }\r\n </ng-container>\r\n </ng-container>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n }\r\n</ngx-datatable>\r\n" }]
|
|
1016
1020
|
}], ctorParameters: () => [], propDecorators: { actionsText: [{
|
|
1017
1021
|
type: Input
|
|
1018
1022
|
}], data: [{
|