@sapphire-ion/framework 1.2.36 → 1.2.38
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/lib/components/default/default-table/default-table.component.mjs +4 -4
- package/esm2022/lib/components/inputs/input-date/input-date.component.mjs +14 -3
- package/fesm2022/sapphire-ion-framework.mjs +16 -5
- package/fesm2022/sapphire-ion-framework.mjs.map +1 -1
- package/lib/components/inputs/input-date/input-date.component.d.ts +1 -0
- package/package.json +1 -1
|
@@ -3191,6 +3191,17 @@ class InputDateComponent extends CustomInput {
|
|
|
3191
3191
|
});
|
|
3192
3192
|
}
|
|
3193
3193
|
}
|
|
3194
|
+
ClearValue(event) {
|
|
3195
|
+
if (event) {
|
|
3196
|
+
event.stopPropagation(); // impede de abrir o calendário ao clicar no clear
|
|
3197
|
+
}
|
|
3198
|
+
this.value.set(null);
|
|
3199
|
+
this.momentValue = undefined;
|
|
3200
|
+
this.readableValue = '';
|
|
3201
|
+
this.hour = '00';
|
|
3202
|
+
this.minute = '00';
|
|
3203
|
+
this.propagateChange(null);
|
|
3204
|
+
}
|
|
3194
3205
|
SetValueFromReadable(value) {
|
|
3195
3206
|
const m = moment(value, this.momentFormat, true).format(InputDateComponent.FormatISO);
|
|
3196
3207
|
this.SetValue(m);
|
|
@@ -3279,14 +3290,14 @@ class InputDateComponent extends CustomInput {
|
|
|
3279
3290
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: InputDateComponent, selector: "input-date, input-date-time, input-time", inputs: { configuration: { classPropertyName: "configuration", publicName: "configuration", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onResize($event)" } }, providers: [
|
|
3280
3291
|
...InputProviderFactory.GetProviders(InputDateComponent),
|
|
3281
3292
|
{ provide: CustomInput, useExisting: forwardRef(() => InputDateComponent) },
|
|
3282
|
-
], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "inputContainer", first: true, predicate: ["inputContainer"], descendants: true }, { propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true }, { propertyName: "datetime", first: true, predicate: IonDatetime, descendants: true }, { propertyName: "popover", first: true, predicate: SIonPopoverComponent, descendants: true }, { propertyName: "modal", first: true, predicate: IonModal, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div \r\n #inputContainer\r\n class=\"input-container\" \r\n (click)=\"setFocus($event)\"\r\n [class.required]=\"required()\" \r\n [class.submitted]=\"submitted()\" \r\n [class.invalid]=\"invalid\" \r\n [class.disabled]=\"disabled() || loading()\"\r\n [class.loading]=\"loading()\"\r\n>\r\n <div class=\"input-label\"> \r\n <span class=\"truncate\">\r\n {{label()}} \r\n </span>\r\n </div>\r\n \r\n <input #input\r\n [ngModel]=\"readableValue\" \r\n (ngModelChange)=\"SetValueFromReadable($event);\"\r\n [maskito]=\"options\"\r\n [disabled]=\"disabled() || loading()\"\r\n (blur)=\"blur.emit($event)\"\r\n />\r\n \r\n <ion-button tabindex=\"-1\" class=\"absolute right-1 bottom-1\" (click)=\"Present($event)\" color=\"medium\" size=\"small\" fill=\"clear\" style=\"--border-radius: .5rem\">\r\n <ion-icon [name]=\"presentation == DatePresentation.Time ? 'time' : 'calendar'\" slot=\"icon-only\"></ion-icon>\r\n </ion-button>\r\n\r\n <div class=\"loading-container\" [class.loading]=\"loading()\">\r\n <ion-spinner></ion-spinner>\r\n </div>\r\n</div>\r\n\r\n@if (interface() == DateInterfaces.Popover) {\r\n <sion-popover\r\n #popover \r\n [anchor]=\"inputContainer\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"datetimeTemplate;\"></ng-container>\r\n </sion-popover>\r\n}\r\n@else {\r\n <ion-modal \r\n #modal\r\n [class.time]=\"presentation == DatePresentation.Time\" \r\n [class.date]=\"presentation == DatePresentation.Date\" \r\n [class.datetime]=\"presentation == DatePresentation.DateTime\"\r\n >\r\n <ng-template>\r\n <ng-container *ngTemplateOutlet=\"datetimeTemplate;\"></ng-container>\r\n </ng-template>\r\n </ion-modal>\r\n}\r\n\r\n\r\n<ng-template #datetimeTemplate>\r\n <div class=\"flex items-center justify-center bg-[--ion-color-light] rounded-xl\" tabindex=\"-1\">\r\n \r\n @if ([DatePresentation.DateTime, DatePresentation.Date].includes(presentation)) {\r\n <mat-calendar #calendar class=\"w-72 text-dark\" \r\n [(selected)]=\"momentValue\" \r\n (selectedChange)=\"SetValueFromMoment($event)\"\r\n ></mat-calendar>\r\n }\r\n @if ([DatePresentation.DateTime, DatePresentation.Time].includes(presentation)) {\r\n <div class=\"flex h-full mask-y/30 items-center justify-center\">\r\n <ion-picker>\r\n <ion-picker-column (ionChange)=\"OnChangeHour($event.target.value.toString())\" [value]=\"hour\">\r\n @for (item of lstHours; track $index) {\r\n <ion-picker-column-option [value]=\"item\">{{item}}</ion-picker-column-option>\r\n }\r\n </ion-picker-column>\r\n <ion-picker-column (ionChange)=\"OnChangeMinute($event.target.value.toString())\" [value]=\"minute\">\r\n @for (item of lstMinutes; track $index) {\r\n <ion-picker-column-option [value]=\"item\">{{item}}</ion-picker-column-option>\r\n }\r\n </ion-picker-column>\r\n </ion-picker>\r\n </div>\r\n }\r\n\r\n </div>\r\n</ng-template>\r\n", styles: [".input-container{position:relative!important}.input-container input{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}ion-picker{height:100%;--fade-background-rgb: transparent}ion-modal{--width: fit-content;--height: fit-content}\n", "@property --input-color{syntax: \"<color>\"; initial-value: transparent; inherits: false;}.input-container{position:relative;--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));cursor:text;border-radius:.75rem;padding:.25rem .75rem;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition:--input-color .2s ease-in-out,box-shadow .2s ease-in-out,opacity .2s ease-in-out,filter .2s ease-in-out;--color: var(--ion-color-dark);--input-color: var(--input-background, var(--ion-color-step-250));--shadow: 0 3px 4px -1px rgb(0 0 0 / .1);--inset-shadow: var(--input-color) 0px 1.75px 2px 0px inset;--focused-shadow: 0 0 1px 2px color-mix(in srgb, var(--ion-color-medium) 35%, transparent);box-shadow:var(--inset-shadow),var(--shadow);will-change:box-shadow,filter opacity;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;background:radial-gradient(ellipse at 0px top,hsl(from var(--input-color) h s l/.5),hsl(from var(--input-color) h s l/.4)),hsl(from var(--ion-color-light) h s l/.8)}.input-container:hover{--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container:focus-within,.input-container:focus,.input-container.manual-focus{box-shadow:var(--inset-shadow),var(--shadow),var(--focused-shadow);--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container .input-label{pointer-events:none;display:flex;height:1rem;width:100%;min-width:0px;max-width:100%;align-items:center;justify-content:flex-start;gap:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;color:var(--color)}.input-container input,.input-container textarea{height:1.5rem;width:100%;border-radius:.375rem;background-color:transparent;font-size:.875rem;line-height:1.25rem;color:var(--ion-color-dark);outline:2px solid transparent;outline-offset:2px}.input-container.loading{cursor:wait!important}.input-container.required .input-label:after{content:\"*\";color:var(--ion-color-danger);vertical-align:bottom}.input-container.submitted.invalid{--input-color: color-mix(in srgb, var(--ion-color-danger) 50%, transparent)}.input-container.disabled{cursor:not-allowed;opacity:.5;--tw-brightness: brightness(1);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container.disabled *{pointer-events:none}.loading-container{position:absolute;pointer-events:none;width:100%;height:100%;top:0;left:0;display:flex;justify-content:end;align-items:center;padding-right:.5rem;will-change:opacity;transition:opacity .2s ease-in-out;overflow:hidden;opacity:0;z-index:10}.loading-container ion-spinner{will-change:auto;transition:transform .2s ease-in-out;transform:translateY(-100%)}.loading-container.loading{opacity:1}.loading-container.loading ion-spinner{transform:translateY(0)}ion-modal::part(content){border-radius:.75rem;border:1px solid var(--ion-color-step-250)}\n"], dependencies: [{ kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonPicker, selector: "ion-picker", inputs: ["mode"] }, { kind: "component", type: i1.IonPickerColumn, selector: "ion-picker-column", inputs: ["color", "disabled", "mode", "value"] }, { kind: "component", type: i1.IonPickerColumnOption, selector: "ion-picker-column-option", inputs: ["color", "disabled", "value"] }, { kind: "component", type: i1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: i1.IonModal, selector: "ion-modal" }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: SIonPopoverComponent, selector: "sion-popover", inputs: ["fill", "arrow", "flip", "placement", "height", "width", "anchor"], outputs: ["onWillPresent", "onDidPresent", "onWillDismiss", "onDidDismiss"] }, { kind: "component", type: i6.MatCalendar, selector: "mat-calendar", inputs: ["headerComponent", "startAt", "startView", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedChange", "yearSelected", "monthSelected", "viewChanged", "_userSelection", "_userDragDrop"], exportAs: ["matCalendar"] }] }); }
|
|
3293
|
+
], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "inputContainer", first: true, predicate: ["inputContainer"], descendants: true }, { propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true }, { propertyName: "datetime", first: true, predicate: IonDatetime, descendants: true }, { propertyName: "popover", first: true, predicate: SIonPopoverComponent, descendants: true }, { propertyName: "modal", first: true, predicate: IonModal, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div \r\n #inputContainer\r\n class=\"input-container\" \r\n (click)=\"setFocus($event)\"\r\n [class.required]=\"required()\" \r\n [class.submitted]=\"submitted()\" \r\n [class.invalid]=\"invalid\" \r\n [class.disabled]=\"disabled() || loading()\"\r\n [class.loading]=\"loading()\"\r\n>\r\n <div class=\"input-label\"> \r\n <span class=\"truncate\">\r\n {{label()}} \r\n </span>\r\n </div>\r\n \r\n <input #input\r\n [ngModel]=\"readableValue\" \r\n (ngModelChange)=\"SetValueFromReadable($event);\"\r\n [maskito]=\"options\"\r\n [disabled]=\"disabled() || loading()\"\r\n (blur)=\"blur.emit($event)\"\r\n />\r\n <ion-button *ngIf=\"configuration().clearable && readableValue\" tabindex=\"-1\" class=\"absolute right-8 bottom-1\" \r\n (click)=\"ClearValue($event)\" color=\"medium\" size=\"small\" fill=\"clear\" style=\"--border-radius: .5rem\"\r\n >\r\n <ion-icon name=\"close\" slot=\"icon-only\"></ion-icon>\r\n </ion-button>\r\n \r\n <ion-button tabindex=\"-1\" class=\"absolute right-2 bottom-1\" (click)=\"Present($event)\" color=\"medium\" size=\"small\" fill=\"clear\" style=\"--border-radius: .5rem\">\r\n <ion-icon [name]=\"presentation == DatePresentation.Time ? 'time' : 'calendar'\" slot=\"icon-only\"></ion-icon>\r\n </ion-button>\r\n\r\n <div class=\"loading-container\" [class.loading]=\"loading()\">\r\n <ion-spinner></ion-spinner>\r\n </div>\r\n</div>\r\n\r\n@if (interface() == DateInterfaces.Popover) {\r\n <sion-popover\r\n #popover \r\n [anchor]=\"inputContainer\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"datetimeTemplate;\"></ng-container>\r\n </sion-popover>\r\n}\r\n@else {\r\n <ion-modal \r\n #modal\r\n [class.time]=\"presentation == DatePresentation.Time\" \r\n [class.date]=\"presentation == DatePresentation.Date\" \r\n [class.datetime]=\"presentation == DatePresentation.DateTime\"\r\n >\r\n <ng-template>\r\n <ng-container *ngTemplateOutlet=\"datetimeTemplate;\"></ng-container>\r\n </ng-template>\r\n </ion-modal>\r\n}\r\n\r\n\r\n<ng-template #datetimeTemplate>\r\n <div class=\"flex items-center justify-center bg-[--ion-color-light] rounded-xl\" tabindex=\"-1\">\r\n \r\n @if ([DatePresentation.DateTime, DatePresentation.Date].includes(presentation)) {\r\n <mat-calendar #calendar class=\"w-72 text-dark\" \r\n [(selected)]=\"momentValue\" \r\n (selectedChange)=\"SetValueFromMoment($event)\"\r\n ></mat-calendar>\r\n }\r\n @if ([DatePresentation.DateTime, DatePresentation.Time].includes(presentation)) {\r\n <div class=\"flex h-full mask-y/30 items-center justify-center\">\r\n <ion-picker>\r\n <ion-picker-column (ionChange)=\"OnChangeHour($event.target.value.toString())\" [value]=\"hour\">\r\n @for (item of lstHours; track $index) {\r\n <ion-picker-column-option [value]=\"item\">{{item}}</ion-picker-column-option>\r\n }\r\n </ion-picker-column>\r\n <ion-picker-column (ionChange)=\"OnChangeMinute($event.target.value.toString())\" [value]=\"minute\">\r\n @for (item of lstMinutes; track $index) {\r\n <ion-picker-column-option [value]=\"item\">{{item}}</ion-picker-column-option>\r\n }\r\n </ion-picker-column>\r\n </ion-picker>\r\n </div>\r\n }\r\n\r\n </div>\r\n</ng-template>\r\n", styles: [".input-container{position:relative!important}.input-container input{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}ion-picker{height:100%;--fade-background-rgb: transparent}ion-modal{--width: fit-content;--height: fit-content}\n", "@property --input-color{syntax: \"<color>\"; initial-value: transparent; inherits: false;}.input-container{position:relative;--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));cursor:text;border-radius:.75rem;padding:.25rem .75rem;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition:--input-color .2s ease-in-out,box-shadow .2s ease-in-out,opacity .2s ease-in-out,filter .2s ease-in-out;--color: var(--ion-color-dark);--input-color: var(--input-background, var(--ion-color-step-250));--shadow: 0 3px 4px -1px rgb(0 0 0 / .1);--inset-shadow: var(--input-color) 0px 1.75px 2px 0px inset;--focused-shadow: 0 0 1px 2px color-mix(in srgb, var(--ion-color-medium) 35%, transparent);box-shadow:var(--inset-shadow),var(--shadow);will-change:box-shadow,filter opacity;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;background:radial-gradient(ellipse at 0px top,hsl(from var(--input-color) h s l/.5),hsl(from var(--input-color) h s l/.4)),hsl(from var(--ion-color-light) h s l/.8)}.input-container:hover{--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container:focus-within,.input-container:focus,.input-container.manual-focus{box-shadow:var(--inset-shadow),var(--shadow),var(--focused-shadow);--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container .input-label{pointer-events:none;display:flex;height:1rem;width:100%;min-width:0px;max-width:100%;align-items:center;justify-content:flex-start;gap:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;color:var(--color)}.input-container input,.input-container textarea{height:1.5rem;width:100%;border-radius:.375rem;background-color:transparent;font-size:.875rem;line-height:1.25rem;color:var(--ion-color-dark);outline:2px solid transparent;outline-offset:2px}.input-container.loading{cursor:wait!important}.input-container.required .input-label:after{content:\"*\";color:var(--ion-color-danger);vertical-align:bottom}.input-container.submitted.invalid{--input-color: color-mix(in srgb, var(--ion-color-danger) 50%, transparent)}.input-container.disabled{cursor:not-allowed;opacity:.5;--tw-brightness: brightness(1);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container.disabled *{pointer-events:none}.loading-container{position:absolute;pointer-events:none;width:100%;height:100%;top:0;left:0;display:flex;justify-content:end;align-items:center;padding-right:.5rem;will-change:opacity;transition:opacity .2s ease-in-out;overflow:hidden;opacity:0;z-index:10}.loading-container ion-spinner{will-change:auto;transition:transform .2s ease-in-out;transform:translateY(-100%)}.loading-container.loading{opacity:1}.loading-container.loading ion-spinner{transform:translateY(0)}ion-modal::part(content){border-radius:.75rem;border:1px solid var(--ion-color-step-250)}\n"], dependencies: [{ kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonPicker, selector: "ion-picker", inputs: ["mode"] }, { kind: "component", type: i1.IonPickerColumn, selector: "ion-picker-column", inputs: ["color", "disabled", "mode", "value"] }, { kind: "component", type: i1.IonPickerColumnOption, selector: "ion-picker-column-option", inputs: ["color", "disabled", "value"] }, { kind: "component", type: i1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: i1.IonModal, selector: "ion-modal" }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: SIonPopoverComponent, selector: "sion-popover", inputs: ["fill", "arrow", "flip", "placement", "height", "width", "anchor"], outputs: ["onWillPresent", "onDidPresent", "onWillDismiss", "onDidDismiss"] }, { kind: "component", type: i6.MatCalendar, selector: "mat-calendar", inputs: ["headerComponent", "startAt", "startView", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedChange", "yearSelected", "monthSelected", "viewChanged", "_userSelection", "_userDragDrop"], exportAs: ["matCalendar"] }] }); }
|
|
3283
3294
|
}
|
|
3284
3295
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputDateComponent, decorators: [{
|
|
3285
3296
|
type: Component,
|
|
3286
3297
|
args: [{ selector: 'input-date, input-date-time, input-time', providers: [
|
|
3287
3298
|
...InputProviderFactory.GetProviders(InputDateComponent),
|
|
3288
3299
|
{ provide: CustomInput, useExisting: forwardRef(() => InputDateComponent) },
|
|
3289
|
-
], template: "<div \r\n #inputContainer\r\n class=\"input-container\" \r\n (click)=\"setFocus($event)\"\r\n [class.required]=\"required()\" \r\n [class.submitted]=\"submitted()\" \r\n [class.invalid]=\"invalid\" \r\n [class.disabled]=\"disabled() || loading()\"\r\n [class.loading]=\"loading()\"\r\n>\r\n <div class=\"input-label\"> \r\n <span class=\"truncate\">\r\n {{label()}} \r\n </span>\r\n </div>\r\n \r\n <input #input\r\n [ngModel]=\"readableValue\" \r\n (ngModelChange)=\"SetValueFromReadable($event);\"\r\n [maskito]=\"options\"\r\n [disabled]=\"disabled() || loading()\"\r\n (blur)=\"blur.emit($event)\"\r\n />\r\n \r\n <ion-button tabindex=\"-1\" class=\"absolute right-
|
|
3300
|
+
], template: "<div \r\n #inputContainer\r\n class=\"input-container\" \r\n (click)=\"setFocus($event)\"\r\n [class.required]=\"required()\" \r\n [class.submitted]=\"submitted()\" \r\n [class.invalid]=\"invalid\" \r\n [class.disabled]=\"disabled() || loading()\"\r\n [class.loading]=\"loading()\"\r\n>\r\n <div class=\"input-label\"> \r\n <span class=\"truncate\">\r\n {{label()}} \r\n </span>\r\n </div>\r\n \r\n <input #input\r\n [ngModel]=\"readableValue\" \r\n (ngModelChange)=\"SetValueFromReadable($event);\"\r\n [maskito]=\"options\"\r\n [disabled]=\"disabled() || loading()\"\r\n (blur)=\"blur.emit($event)\"\r\n />\r\n <ion-button *ngIf=\"configuration().clearable && readableValue\" tabindex=\"-1\" class=\"absolute right-8 bottom-1\" \r\n (click)=\"ClearValue($event)\" color=\"medium\" size=\"small\" fill=\"clear\" style=\"--border-radius: .5rem\"\r\n >\r\n <ion-icon name=\"close\" slot=\"icon-only\"></ion-icon>\r\n </ion-button>\r\n \r\n <ion-button tabindex=\"-1\" class=\"absolute right-2 bottom-1\" (click)=\"Present($event)\" color=\"medium\" size=\"small\" fill=\"clear\" style=\"--border-radius: .5rem\">\r\n <ion-icon [name]=\"presentation == DatePresentation.Time ? 'time' : 'calendar'\" slot=\"icon-only\"></ion-icon>\r\n </ion-button>\r\n\r\n <div class=\"loading-container\" [class.loading]=\"loading()\">\r\n <ion-spinner></ion-spinner>\r\n </div>\r\n</div>\r\n\r\n@if (interface() == DateInterfaces.Popover) {\r\n <sion-popover\r\n #popover \r\n [anchor]=\"inputContainer\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"datetimeTemplate;\"></ng-container>\r\n </sion-popover>\r\n}\r\n@else {\r\n <ion-modal \r\n #modal\r\n [class.time]=\"presentation == DatePresentation.Time\" \r\n [class.date]=\"presentation == DatePresentation.Date\" \r\n [class.datetime]=\"presentation == DatePresentation.DateTime\"\r\n >\r\n <ng-template>\r\n <ng-container *ngTemplateOutlet=\"datetimeTemplate;\"></ng-container>\r\n </ng-template>\r\n </ion-modal>\r\n}\r\n\r\n\r\n<ng-template #datetimeTemplate>\r\n <div class=\"flex items-center justify-center bg-[--ion-color-light] rounded-xl\" tabindex=\"-1\">\r\n \r\n @if ([DatePresentation.DateTime, DatePresentation.Date].includes(presentation)) {\r\n <mat-calendar #calendar class=\"w-72 text-dark\" \r\n [(selected)]=\"momentValue\" \r\n (selectedChange)=\"SetValueFromMoment($event)\"\r\n ></mat-calendar>\r\n }\r\n @if ([DatePresentation.DateTime, DatePresentation.Time].includes(presentation)) {\r\n <div class=\"flex h-full mask-y/30 items-center justify-center\">\r\n <ion-picker>\r\n <ion-picker-column (ionChange)=\"OnChangeHour($event.target.value.toString())\" [value]=\"hour\">\r\n @for (item of lstHours; track $index) {\r\n <ion-picker-column-option [value]=\"item\">{{item}}</ion-picker-column-option>\r\n }\r\n </ion-picker-column>\r\n <ion-picker-column (ionChange)=\"OnChangeMinute($event.target.value.toString())\" [value]=\"minute\">\r\n @for (item of lstMinutes; track $index) {\r\n <ion-picker-column-option [value]=\"item\">{{item}}</ion-picker-column-option>\r\n }\r\n </ion-picker-column>\r\n </ion-picker>\r\n </div>\r\n }\r\n\r\n </div>\r\n</ng-template>\r\n", styles: [".input-container{position:relative!important}.input-container input{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}ion-picker{height:100%;--fade-background-rgb: transparent}ion-modal{--width: fit-content;--height: fit-content}\n", "@property --input-color{syntax: \"<color>\"; initial-value: transparent; inherits: false;}.input-container{position:relative;--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));cursor:text;border-radius:.75rem;padding:.25rem .75rem;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition:--input-color .2s ease-in-out,box-shadow .2s ease-in-out,opacity .2s ease-in-out,filter .2s ease-in-out;--color: var(--ion-color-dark);--input-color: var(--input-background, var(--ion-color-step-250));--shadow: 0 3px 4px -1px rgb(0 0 0 / .1);--inset-shadow: var(--input-color) 0px 1.75px 2px 0px inset;--focused-shadow: 0 0 1px 2px color-mix(in srgb, var(--ion-color-medium) 35%, transparent);box-shadow:var(--inset-shadow),var(--shadow);will-change:box-shadow,filter opacity;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;background:radial-gradient(ellipse at 0px top,hsl(from var(--input-color) h s l/.5),hsl(from var(--input-color) h s l/.4)),hsl(from var(--ion-color-light) h s l/.8)}.input-container:hover{--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container:focus-within,.input-container:focus,.input-container.manual-focus{box-shadow:var(--inset-shadow),var(--shadow),var(--focused-shadow);--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container .input-label{pointer-events:none;display:flex;height:1rem;width:100%;min-width:0px;max-width:100%;align-items:center;justify-content:flex-start;gap:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;color:var(--color)}.input-container input,.input-container textarea{height:1.5rem;width:100%;border-radius:.375rem;background-color:transparent;font-size:.875rem;line-height:1.25rem;color:var(--ion-color-dark);outline:2px solid transparent;outline-offset:2px}.input-container.loading{cursor:wait!important}.input-container.required .input-label:after{content:\"*\";color:var(--ion-color-danger);vertical-align:bottom}.input-container.submitted.invalid{--input-color: color-mix(in srgb, var(--ion-color-danger) 50%, transparent)}.input-container.disabled{cursor:not-allowed;opacity:.5;--tw-brightness: brightness(1);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container.disabled *{pointer-events:none}.loading-container{position:absolute;pointer-events:none;width:100%;height:100%;top:0;left:0;display:flex;justify-content:end;align-items:center;padding-right:.5rem;will-change:opacity;transition:opacity .2s ease-in-out;overflow:hidden;opacity:0;z-index:10}.loading-container ion-spinner{will-change:auto;transition:transform .2s ease-in-out;transform:translateY(-100%)}.loading-container.loading{opacity:1}.loading-container.loading ion-spinner{transform:translateY(0)}ion-modal::part(content){border-radius:.75rem;border:1px solid var(--ion-color-step-250)}\n"] }]
|
|
3290
3301
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { input: [{
|
|
3291
3302
|
type: ViewChild,
|
|
3292
3303
|
args: ['input']
|
|
@@ -4229,7 +4240,7 @@ class DefaultTableComponent {
|
|
|
4229
4240
|
}
|
|
4230
4241
|
SetLstRows() {
|
|
4231
4242
|
this.lstRows = this.items().map(item => {
|
|
4232
|
-
return new DefaultTableRow(item, item['id'], this.GetColumns(item), this.columnClass() ? this.columnClass()('acoes', item) : '', this.columnStyle() ? this.
|
|
4243
|
+
return new DefaultTableRow(item, item['id'], this.GetColumns(item), this.columnClass() ? this.columnClass()('acoes', item) : '', this.columnStyle() ? this.columnStyle()('acoes', item) : '');
|
|
4233
4244
|
});
|
|
4234
4245
|
}
|
|
4235
4246
|
GetColumns(item) {
|
|
@@ -4316,11 +4327,11 @@ class DefaultTableComponent {
|
|
|
4316
4327
|
this.ativar.emit(id);
|
|
4317
4328
|
}
|
|
4318
4329
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultTableComponent, deps: [{ token: StorageService }, { token: i2$2.ActivatedRoute }, { token: i2$2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4319
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: DefaultTableComponent, selector: "default-table", inputs: { acoesTemplate: { classPropertyName: "acoesTemplate", publicName: "acoesTemplate", isSignal: false, isRequired: false, transformFunction: null }, service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, limit: { classPropertyName: "limit", publicName: "limit", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, orderByProperty: { classPropertyName: "orderByProperty", publicName: "orderByProperty", isSignal: true, isRequired: false, transformFunction: null }, ascending: { classPropertyName: "ascending", publicName: "ascending", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, lstTableFields: { classPropertyName: "lstTableFields", publicName: "lstTableFields", isSignal: true, isRequired: false, transformFunction: null }, noFilters: { classPropertyName: "noFilters", publicName: "noFilters", isSignal: true, isRequired: false, transformFunction: null }, columnClass: { classPropertyName: "columnClass", publicName: "columnClass", isSignal: true, isRequired: false, transformFunction: null }, columnStyle: { classPropertyName: "columnStyle", publicName: "columnStyle", isSignal: true, isRequired: false, transformFunction: null }, noPagination: { classPropertyName: "noPagination", publicName: "noPagination", isSignal: true, isRequired: false, transformFunction: null }, itemPath: { classPropertyName: "itemPath", publicName: "itemPath", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { total: "totalChange", limit: "limitChange", page: "pageChange", orderByProperty: "orderByPropertyChange", ascending: "ascendingChange", filter: "filterChange", ativar: "ativar", refresh: "refresh", loading: "loadingChange", items: "itemsChange", lstTableFields: "lstTableFieldsChange", itemClick: "itemClick" }, ngImport: i0, template: "<div class=\"size-full rounded-xl flex flex-col overflow-hidden relative\">\r\n <loading [type]=\"3\" [loading]=\"loading()\"></loading>\r\n <content-block text=\"Sem Dados\" [value]=\"!(items.length != 0 || loading)\"></content-block>\r\n\r\n <div class=\"size-full shrink relative overflow-y-auto\">\r\n <table>\r\n <thead>\r\n <tr>\r\n @if(acoesTemplate){\r\n <th scope=\"col\" class=\"p-2\"> \r\n A\u00E7\u00F5es \r\n </th>\r\n }\r\n\r\n @for (tfa of lstTableFieldsAvailable(); track tfa.tf.index) {\r\n <th scope=\"col\" class=\"p-2\"> \r\n <div class=\"flex gap-2 items-center justify-start th\">\r\n @if(!noFilters()){\r\n <th-filter class=\"!text-base\" style=\"text-transform: none !important\" \r\n *ngIf=\"((tfa.tf.type != InputType.File || (tfa.tf.filter && tfa.tf.disabledChange())) && !noFilters())\"\r\n [field]=\"tfa.tf\"\r\n (change)=\"ChangeFilter()\"\r\n ></th-filter>\r\n }\r\n\r\n {{tfa.tf.header}} \r\n\r\n @if((tfa.tf.type != InputType.File || (tfa.tf.filter && tfa.tf.disabledChange())) && !noFilters()){\r\n <a [ngClass]=\"{ 'bg-light/10 !opacity-100': tfa.ascending || tfa.descending }\"\r\n class=\"order h-4 w-5 relative cursor-pointer rounded-lg opacity-0 default-transition\" \r\n (click)=\"SwitchOrder(tfa.tf)\"\r\n >\r\n <ion-icon \r\n [class.text-primary]=\"tfa.ascending\"\r\n class=\"absolute left-0 top-0\" \r\n name=\"arrow-up\"\r\n ></ion-icon> \r\n <ion-icon \r\n [class.text-primary]=\"tfa.descending\"\r\n class=\"absolute right-0 bottom-0\" \r\n name=\"arrow-down\"\r\n ></ion-icon> \r\n </a>\r\n }\r\n </div>\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n <tbody>\r\n @for (row of lstRows; track row.id || $index) {\r\n <tr [hidden]=\"loading()\">\r\n @if(acoesTemplate){\r\n <td (click)=\"Redirect(undefined, row.item)\" class=\"whitespace-nowrap py-1 px-3 {{row.acoesClass}}\" [style]=\"row.acoesStyle\" >\r\n <ng-container *ngTemplateOutlet=\"acoesTemplate; context: { $implicit: row.item }\"></ng-container>\r\n </td>\r\n }\r\n\r\n @for (col of row.lstColumns; track col.tf.index) {\r\n <td class=\"{{col.class}} p-2 cursor-pointer\" (click)=\"Redirect(col.tf, row.item)\" [style]=\"'white-space: var(--ion-table-row-wrap);' + col.style\">\r\n @if(col.tf.index == 'ativo') {\r\n <div class=\"size-full flex items-center justify-start\" [routerLink]=\"null\">\r\n <ion-toggle [checked]=\"col.value\" [disabled]=\"loading()\" (ionChange)=\"Ativar(row.id)\" ></ion-toggle>\r\n </div>\r\n }\r\n @else if (col.tf.type == InputType.Bool){\r\n <div class=\"h-full flex items-center justify-start\">\r\n @if(col.tf.configuration.type == 'toggle') {\r\n <ion-toggle [checked]=\"col.value\" [disabled]=\"true\"></ion-toggle>\r\n }\r\n @else {\r\n <ion-checkbox [checked]=\"col.value\" [disabled]=\"true\"></ion-checkbox>\r\n }\r\n </div>\r\n }\r\n @else if (col.tf.type == InputType.File) {\r\n <download-button [(ngModel)]=\"col.value\" [configuration]=\"col.tf.configuration\"></download-button>\r\n }\r\n @else if (col.loading){\r\n <ion-spinner name=\"dots\"></ion-spinner>\r\n } @else {\r\n {{col.label}}\r\n }\r\n </td>\r\n }\r\n </tr>\r\n <ng-content select=\"[slot=item-end]\"></ng-content>\r\n }\r\n </tbody>\r\n </table>\r\n </div>\r\n @if(!noPagination()){\r\n <div class=\"shrink-0 z-[100]\">\r\n <default-pagination\r\n [page]=\"page()\"\r\n (pageChange)=\"page.set($event); refresh.emit()\"\r\n [total]=\"total()\"\r\n [limit]=\"limit()\"\r\n [length]=\"items().length\"\r\n [loading]=\"loading()\"\r\n ></default-pagination>\r\n </div>\r\n }\r\n</div>", styles: [".th:hover>.order{opacity:1;background-color:color-mix(in srgb,var(--ion-color-light) 10%,transparent)}\n"], dependencies: [{ kind: "component", type: i1.IonCheckbox, selector: "ion-checkbox", inputs: ["alignment", "checked", "color", "disabled", "errorText", "helperText", "indeterminate", "justify", "labelPlacement", "mode", "name", "required", "value"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: i1.IonToggle, selector: "ion-toggle", inputs: ["alignment", "checked", "color", "disabled", "enableOnOffLabels", "errorText", "helperText", "justify", "labelPlacement", "mode", "name", "required", "value"] }, { kind: "directive", type: i1.BooleanValueAccessor, selector: "ion-checkbox,ion-toggle" }, { kind: "directive", type: i1.RouterLinkDelegate, selector: ":not(a):not(area)[routerLink]" }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DownloadButtonComponent, selector: "download-button", inputs: ["expand", "value", "size", "color", "params", "disabled", "post", "configuration"], outputs: ["valueChange"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoadingComponent, selector: "loading", inputs: ["text", "type", "loading"] }, { kind: "component", type: ContentBlockComponent, selector: "content-block", inputs: ["text", "value"] }, { kind: "component", type: DefaultPaginationComponent, selector: "default-pagination", inputs: ["total", "limit", "length", "loading", "page"], outputs: ["pageChange", "change"] }, { kind: "component", type: ThFilterComponent, selector: "th-filter", inputs: ["field"], outputs: ["change"] }] }); }
|
|
4330
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: DefaultTableComponent, selector: "default-table", inputs: { acoesTemplate: { classPropertyName: "acoesTemplate", publicName: "acoesTemplate", isSignal: false, isRequired: false, transformFunction: null }, service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, limit: { classPropertyName: "limit", publicName: "limit", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, orderByProperty: { classPropertyName: "orderByProperty", publicName: "orderByProperty", isSignal: true, isRequired: false, transformFunction: null }, ascending: { classPropertyName: "ascending", publicName: "ascending", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, lstTableFields: { classPropertyName: "lstTableFields", publicName: "lstTableFields", isSignal: true, isRequired: false, transformFunction: null }, noFilters: { classPropertyName: "noFilters", publicName: "noFilters", isSignal: true, isRequired: false, transformFunction: null }, columnClass: { classPropertyName: "columnClass", publicName: "columnClass", isSignal: true, isRequired: false, transformFunction: null }, columnStyle: { classPropertyName: "columnStyle", publicName: "columnStyle", isSignal: true, isRequired: false, transformFunction: null }, noPagination: { classPropertyName: "noPagination", publicName: "noPagination", isSignal: true, isRequired: false, transformFunction: null }, itemPath: { classPropertyName: "itemPath", publicName: "itemPath", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { total: "totalChange", limit: "limitChange", page: "pageChange", orderByProperty: "orderByPropertyChange", ascending: "ascendingChange", filter: "filterChange", ativar: "ativar", refresh: "refresh", loading: "loadingChange", items: "itemsChange", lstTableFields: "lstTableFieldsChange", itemClick: "itemClick" }, ngImport: i0, template: "<div class=\"size-full rounded-xl flex flex-col overflow-hidden relative\">\r\n <loading [type]=\"3\" [loading]=\"loading()\"></loading>\r\n <content-block text=\"Sem Dados\" [value]=\"!(items.length != 0 || loading)\"></content-block>\r\n\r\n <div class=\"size-full shrink relative overflow-y-auto\">\r\n <table>\r\n <thead>\r\n <tr>\r\n @if(acoesTemplate){\r\n <th scope=\"col\" class=\"p-2\"> \r\n A\u00E7\u00F5es \r\n </th>\r\n }\r\n\r\n @for (tfa of lstTableFieldsAvailable(); track tfa.tf.index) {\r\n <th scope=\"col\" class=\"p-2\"> \r\n <div class=\"flex gap-2 items-center justify-start th\">\r\n @if(!noFilters()){\r\n <th-filter class=\"!text-base\" style=\"text-transform: none !important\" \r\n *ngIf=\"((tfa.tf.type != InputType.File || (tfa.tf.filter && tfa.tf.disabledChange())) && !noFilters())\"\r\n [field]=\"tfa.tf\"\r\n (change)=\"ChangeFilter()\"\r\n ></th-filter>\r\n }\r\n\r\n {{tfa.tf.header}} \r\n\r\n @if((tfa.tf.type != InputType.File || (tfa.tf.filter && tfa.tf.disabledChange())) && !noFilters()){\r\n <a [ngClass]=\"{ 'bg-light/10 !opacity-100': tfa.ascending || tfa.descending }\"\r\n class=\"order h-4 w-5 relative cursor-pointer rounded-lg opacity-0 default-transition\" \r\n (click)=\"SwitchOrder(tfa.tf)\"\r\n >\r\n <ion-icon \r\n [class.text-primary]=\"tfa.ascending\"\r\n class=\"absolute left-0 top-0\" \r\n name=\"arrow-up\"\r\n ></ion-icon> \r\n <ion-icon \r\n [class.text-primary]=\"tfa.descending\"\r\n class=\"absolute right-0 bottom-0\" \r\n name=\"arrow-down\"\r\n ></ion-icon> \r\n </a>\r\n }\r\n </div>\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n <tbody>\r\n @for (row of lstRows; track row.id || $index) {\r\n <tr [hidden]=\"loading()\">\r\n @if(acoesTemplate){\r\n <td (click)=\"Redirect(undefined, row.item)\" class=\"whitespace-nowrap py-1 px-3 {{row.acoesClass}}\" [style]=\"row.acoesStyle\" >\r\n <ng-container *ngTemplateOutlet=\"acoesTemplate; context: { $implicit: row.item }\"></ng-container>\r\n </td>\r\n }\r\n\r\n @for (col of row.lstColumns; track col.tf.index) {\r\n <td class=\"{{col.class}} p-2 cursor-pointer\" (click)=\"Redirect(col.tf, row.item)\" [style]=\"'white-space: var(--ion-table-row-wrap);' + col.style\">\r\n @if(col.tf.index == 'ativo') {\r\n <div class=\"size-full flex items-center justify-start\" [routerLink]=\"null\">\r\n <ion-toggle [checked]=\"col.value\" [disabled]=\"loading()\" (ionChange)=\"Ativar(row.id)\" ></ion-toggle>\r\n </div>\r\n }\r\n @else if (col.tf.type == InputType.Bool){\r\n <div class=\"h-full flex items-center justify-start\">\r\n @if(col.tf.configuration.type == 'toggle') {\r\n <ion-toggle [checked]=\"col.value\" [disabled]=\"true\"></ion-toggle>\r\n }\r\n @else {\r\n <ion-checkbox [checked]=\"col.value\" [disabled]=\"true\"></ion-checkbox>\r\n }\r\n </div>\r\n }\r\n @else if (col.tf.type == InputType.File) {\r\n <download-button [(ngModel)]=\"col.value\" [configuration]=\"col.tf.configuration\"></download-button>\r\n }\r\n @else if (col.loading){\r\n <ion-spinner name=\"dots\"></ion-spinner>\r\n } @else {\r\n <span [ngClass]=\"col.class\">{{ col.label }}</span>\r\n }\r\n </td>\r\n }\r\n </tr>\r\n <ng-content select=\"[slot=item-end]\"></ng-content>\r\n }\r\n </tbody>\r\n </table>\r\n </div>\r\n @if(!noPagination()){\r\n <div class=\"shrink-0 z-[100]\">\r\n <default-pagination\r\n [page]=\"page()\"\r\n (pageChange)=\"page.set($event); refresh.emit()\"\r\n [total]=\"total()\"\r\n [limit]=\"limit()\"\r\n [length]=\"items().length\"\r\n [loading]=\"loading()\"\r\n ></default-pagination>\r\n </div>\r\n }\r\n</div>", styles: [".th:hover>.order{opacity:1;background-color:color-mix(in srgb,var(--ion-color-light) 10%,transparent)}\n"], dependencies: [{ kind: "component", type: i1.IonCheckbox, selector: "ion-checkbox", inputs: ["alignment", "checked", "color", "disabled", "errorText", "helperText", "indeterminate", "justify", "labelPlacement", "mode", "name", "required", "value"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: i1.IonToggle, selector: "ion-toggle", inputs: ["alignment", "checked", "color", "disabled", "enableOnOffLabels", "errorText", "helperText", "justify", "labelPlacement", "mode", "name", "required", "value"] }, { kind: "directive", type: i1.BooleanValueAccessor, selector: "ion-checkbox,ion-toggle" }, { kind: "directive", type: i1.RouterLinkDelegate, selector: ":not(a):not(area)[routerLink]" }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DownloadButtonComponent, selector: "download-button", inputs: ["expand", "value", "size", "color", "params", "disabled", "post", "configuration"], outputs: ["valueChange"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoadingComponent, selector: "loading", inputs: ["text", "type", "loading"] }, { kind: "component", type: ContentBlockComponent, selector: "content-block", inputs: ["text", "value"] }, { kind: "component", type: DefaultPaginationComponent, selector: "default-pagination", inputs: ["total", "limit", "length", "loading", "page"], outputs: ["pageChange", "change"] }, { kind: "component", type: ThFilterComponent, selector: "th-filter", inputs: ["field"], outputs: ["change"] }] }); }
|
|
4320
4331
|
}
|
|
4321
4332
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultTableComponent, decorators: [{
|
|
4322
4333
|
type: Component,
|
|
4323
|
-
args: [{ selector: 'default-table', template: "<div class=\"size-full rounded-xl flex flex-col overflow-hidden relative\">\r\n <loading [type]=\"3\" [loading]=\"loading()\"></loading>\r\n <content-block text=\"Sem Dados\" [value]=\"!(items.length != 0 || loading)\"></content-block>\r\n\r\n <div class=\"size-full shrink relative overflow-y-auto\">\r\n <table>\r\n <thead>\r\n <tr>\r\n @if(acoesTemplate){\r\n <th scope=\"col\" class=\"p-2\"> \r\n A\u00E7\u00F5es \r\n </th>\r\n }\r\n\r\n @for (tfa of lstTableFieldsAvailable(); track tfa.tf.index) {\r\n <th scope=\"col\" class=\"p-2\"> \r\n <div class=\"flex gap-2 items-center justify-start th\">\r\n @if(!noFilters()){\r\n <th-filter class=\"!text-base\" style=\"text-transform: none !important\" \r\n *ngIf=\"((tfa.tf.type != InputType.File || (tfa.tf.filter && tfa.tf.disabledChange())) && !noFilters())\"\r\n [field]=\"tfa.tf\"\r\n (change)=\"ChangeFilter()\"\r\n ></th-filter>\r\n }\r\n\r\n {{tfa.tf.header}} \r\n\r\n @if((tfa.tf.type != InputType.File || (tfa.tf.filter && tfa.tf.disabledChange())) && !noFilters()){\r\n <a [ngClass]=\"{ 'bg-light/10 !opacity-100': tfa.ascending || tfa.descending }\"\r\n class=\"order h-4 w-5 relative cursor-pointer rounded-lg opacity-0 default-transition\" \r\n (click)=\"SwitchOrder(tfa.tf)\"\r\n >\r\n <ion-icon \r\n [class.text-primary]=\"tfa.ascending\"\r\n class=\"absolute left-0 top-0\" \r\n name=\"arrow-up\"\r\n ></ion-icon> \r\n <ion-icon \r\n [class.text-primary]=\"tfa.descending\"\r\n class=\"absolute right-0 bottom-0\" \r\n name=\"arrow-down\"\r\n ></ion-icon> \r\n </a>\r\n }\r\n </div>\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n <tbody>\r\n @for (row of lstRows; track row.id || $index) {\r\n <tr [hidden]=\"loading()\">\r\n @if(acoesTemplate){\r\n <td (click)=\"Redirect(undefined, row.item)\" class=\"whitespace-nowrap py-1 px-3 {{row.acoesClass}}\" [style]=\"row.acoesStyle\" >\r\n <ng-container *ngTemplateOutlet=\"acoesTemplate; context: { $implicit: row.item }\"></ng-container>\r\n </td>\r\n }\r\n\r\n @for (col of row.lstColumns; track col.tf.index) {\r\n <td class=\"{{col.class}} p-2 cursor-pointer\" (click)=\"Redirect(col.tf, row.item)\" [style]=\"'white-space: var(--ion-table-row-wrap);' + col.style\">\r\n @if(col.tf.index == 'ativo') {\r\n <div class=\"size-full flex items-center justify-start\" [routerLink]=\"null\">\r\n <ion-toggle [checked]=\"col.value\" [disabled]=\"loading()\" (ionChange)=\"Ativar(row.id)\" ></ion-toggle>\r\n </div>\r\n }\r\n @else if (col.tf.type == InputType.Bool){\r\n <div class=\"h-full flex items-center justify-start\">\r\n @if(col.tf.configuration.type == 'toggle') {\r\n <ion-toggle [checked]=\"col.value\" [disabled]=\"true\"></ion-toggle>\r\n }\r\n @else {\r\n <ion-checkbox [checked]=\"col.value\" [disabled]=\"true\"></ion-checkbox>\r\n }\r\n </div>\r\n }\r\n @else if (col.tf.type == InputType.File) {\r\n <download-button [(ngModel)]=\"col.value\" [configuration]=\"col.tf.configuration\"></download-button>\r\n }\r\n @else if (col.loading){\r\n <ion-spinner name=\"dots\"></ion-spinner>\r\n } @else {\r\n {{col.label}}
|
|
4334
|
+
args: [{ selector: 'default-table', template: "<div class=\"size-full rounded-xl flex flex-col overflow-hidden relative\">\r\n <loading [type]=\"3\" [loading]=\"loading()\"></loading>\r\n <content-block text=\"Sem Dados\" [value]=\"!(items.length != 0 || loading)\"></content-block>\r\n\r\n <div class=\"size-full shrink relative overflow-y-auto\">\r\n <table>\r\n <thead>\r\n <tr>\r\n @if(acoesTemplate){\r\n <th scope=\"col\" class=\"p-2\"> \r\n A\u00E7\u00F5es \r\n </th>\r\n }\r\n\r\n @for (tfa of lstTableFieldsAvailable(); track tfa.tf.index) {\r\n <th scope=\"col\" class=\"p-2\"> \r\n <div class=\"flex gap-2 items-center justify-start th\">\r\n @if(!noFilters()){\r\n <th-filter class=\"!text-base\" style=\"text-transform: none !important\" \r\n *ngIf=\"((tfa.tf.type != InputType.File || (tfa.tf.filter && tfa.tf.disabledChange())) && !noFilters())\"\r\n [field]=\"tfa.tf\"\r\n (change)=\"ChangeFilter()\"\r\n ></th-filter>\r\n }\r\n\r\n {{tfa.tf.header}} \r\n\r\n @if((tfa.tf.type != InputType.File || (tfa.tf.filter && tfa.tf.disabledChange())) && !noFilters()){\r\n <a [ngClass]=\"{ 'bg-light/10 !opacity-100': tfa.ascending || tfa.descending }\"\r\n class=\"order h-4 w-5 relative cursor-pointer rounded-lg opacity-0 default-transition\" \r\n (click)=\"SwitchOrder(tfa.tf)\"\r\n >\r\n <ion-icon \r\n [class.text-primary]=\"tfa.ascending\"\r\n class=\"absolute left-0 top-0\" \r\n name=\"arrow-up\"\r\n ></ion-icon> \r\n <ion-icon \r\n [class.text-primary]=\"tfa.descending\"\r\n class=\"absolute right-0 bottom-0\" \r\n name=\"arrow-down\"\r\n ></ion-icon> \r\n </a>\r\n }\r\n </div>\r\n </th>\r\n }\r\n </tr>\r\n </thead>\r\n <tbody>\r\n @for (row of lstRows; track row.id || $index) {\r\n <tr [hidden]=\"loading()\">\r\n @if(acoesTemplate){\r\n <td (click)=\"Redirect(undefined, row.item)\" class=\"whitespace-nowrap py-1 px-3 {{row.acoesClass}}\" [style]=\"row.acoesStyle\" >\r\n <ng-container *ngTemplateOutlet=\"acoesTemplate; context: { $implicit: row.item }\"></ng-container>\r\n </td>\r\n }\r\n\r\n @for (col of row.lstColumns; track col.tf.index) {\r\n <td class=\"{{col.class}} p-2 cursor-pointer\" (click)=\"Redirect(col.tf, row.item)\" [style]=\"'white-space: var(--ion-table-row-wrap);' + col.style\">\r\n @if(col.tf.index == 'ativo') {\r\n <div class=\"size-full flex items-center justify-start\" [routerLink]=\"null\">\r\n <ion-toggle [checked]=\"col.value\" [disabled]=\"loading()\" (ionChange)=\"Ativar(row.id)\" ></ion-toggle>\r\n </div>\r\n }\r\n @else if (col.tf.type == InputType.Bool){\r\n <div class=\"h-full flex items-center justify-start\">\r\n @if(col.tf.configuration.type == 'toggle') {\r\n <ion-toggle [checked]=\"col.value\" [disabled]=\"true\"></ion-toggle>\r\n }\r\n @else {\r\n <ion-checkbox [checked]=\"col.value\" [disabled]=\"true\"></ion-checkbox>\r\n }\r\n </div>\r\n }\r\n @else if (col.tf.type == InputType.File) {\r\n <download-button [(ngModel)]=\"col.value\" [configuration]=\"col.tf.configuration\"></download-button>\r\n }\r\n @else if (col.loading){\r\n <ion-spinner name=\"dots\"></ion-spinner>\r\n } @else {\r\n <span [ngClass]=\"col.class\">{{ col.label }}</span>\r\n }\r\n </td>\r\n }\r\n </tr>\r\n <ng-content select=\"[slot=item-end]\"></ng-content>\r\n }\r\n </tbody>\r\n </table>\r\n </div>\r\n @if(!noPagination()){\r\n <div class=\"shrink-0 z-[100]\">\r\n <default-pagination\r\n [page]=\"page()\"\r\n (pageChange)=\"page.set($event); refresh.emit()\"\r\n [total]=\"total()\"\r\n [limit]=\"limit()\"\r\n [length]=\"items().length\"\r\n [loading]=\"loading()\"\r\n ></default-pagination>\r\n </div>\r\n }\r\n</div>", styles: [".th:hover>.order{opacity:1;background-color:color-mix(in srgb,var(--ion-color-light) 10%,transparent)}\n"] }]
|
|
4324
4335
|
}], ctorParameters: () => [{ type: StorageService }, { type: i2$2.ActivatedRoute }, { type: i2$2.Router }], propDecorators: { acoesTemplate: [{
|
|
4325
4336
|
type: Input
|
|
4326
4337
|
}] } });
|