keevo-components 2.0.130 → 2.0.132
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/kv-filter-cards/kv-filter-cards.component.mjs +3 -3
- package/esm2022/lib/components/kv-inputs/kv-editor/kv-editor.component.mjs +1 -1
- package/esm2022/lib/components/kv-table-viewer/kv-table-viewer.component.mjs +6 -6
- package/esm2022/lib/components/kv-tags/kv-tags.component.mjs +4 -3
- package/fesm2022/keevo-components.mjs +11 -10
- package/fesm2022/keevo-components.mjs.map +1 -1
- package/lib/components/kv-icon/kv-icon.component.d.ts +1 -1
- package/lib/components/kv-tag/kv-tag.component.d.ts +1 -1
- package/lib/components/kv-tags/kv-tags.component.d.ts +3 -1
- package/lib/components/kv-widget-card/kv-widget-card.component.d.ts +2 -2
- package/package.json +1 -1
|
@@ -8,6 +8,7 @@ export class KvTagsComponent {
|
|
|
8
8
|
this.color = computed(() => (tag) => {
|
|
9
9
|
return mapaSeverityColors[tag.severity || 'info'];
|
|
10
10
|
});
|
|
11
|
+
this.clickable = input(false);
|
|
11
12
|
this.background = computed(() => (tag) => {
|
|
12
13
|
return this.getTransparentMix(this.color()(tag), 0.15);
|
|
13
14
|
});
|
|
@@ -26,10 +27,10 @@ export class KvTagsComponent {
|
|
|
26
27
|
return `rgba(${r}, ${g}, ${b}, ${opacity})`;
|
|
27
28
|
}
|
|
28
29
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTagsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
29
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTagsComponent, selector: "kv-tags", inputs: { tags: { classPropertyName: "tags", publicName: "tags", isSignal: true, isRequired: false, transformFunction: null }, hover: { classPropertyName: "hover", publicName: "hover", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClickTag: "onClickTag" }, ngImport: i0, template: "@for (tag of tags(); track $index) {\r\n<div
|
|
30
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTagsComponent, selector: "kv-tags", inputs: { tags: { classPropertyName: "tags", publicName: "tags", isSignal: true, isRequired: false, transformFunction: null }, hover: { classPropertyName: "hover", publicName: "hover", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClickTag: "onClickTag" }, ngImport: i0, template: "@for (tag of tags(); track $index) {\r\n<div\r\n [class.hover-tag]=\"hover()\"\r\n class=\"kv-tag {{clickable() && 'kv-tag-clickable'}}\"\r\n [style.color]=\"color()(tag)\"\r\n (click)=\"clickTag(tag)\"\r\n [style.background]=\"background()(tag)\"\r\n style=\"user-select: none\"\r\n>\r\n @if(tag.icon) {\r\n <span class=\"material-symbols-outlined\" style=\"font-size: 0.75rem\">\r\n {{ tag.icon }}\r\n </span>\r\n }\r\n <span>\r\n {{ tag.label }}\r\n </span>\r\n\r\n @if(tag.value) {\r\n <span\r\n class=\"bg-white border-circle h-1rem w-1rem flex align-items-center justify-content-center\"\r\n >{{ tag.value }}</span\r\n >\r\n }\r\n</div>\r\n}\r\n", styles: [":host{display:block;display:flex;flex-direction:row;gap:10px}.kv-tag{padding:.2rem .5rem;border-radius:2rem;font-size:.7rem;font-weight:400;width:max-content;flex-wrap:nowrap;display:flex;flex-direction:row;align-items:center;gap:.25rem}.kv-tag-clickable:hover{cursor:pointer;transition:all ease-in-out .2s;opacity:.9}.hover-tag{cursor:pointer;transition:all ease-in-out .2s}.hover-tag:hover{font-size:.8rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
30
31
|
}
|
|
31
32
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTagsComponent, decorators: [{
|
|
32
33
|
type: Component,
|
|
33
|
-
args: [{ selector: 'kv-tags', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (tag of tags(); track $index) {\r\n<div
|
|
34
|
+
args: [{ selector: 'kv-tags', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (tag of tags(); track $index) {\r\n<div\r\n [class.hover-tag]=\"hover()\"\r\n class=\"kv-tag {{clickable() && 'kv-tag-clickable'}}\"\r\n [style.color]=\"color()(tag)\"\r\n (click)=\"clickTag(tag)\"\r\n [style.background]=\"background()(tag)\"\r\n style=\"user-select: none\"\r\n>\r\n @if(tag.icon) {\r\n <span class=\"material-symbols-outlined\" style=\"font-size: 0.75rem\">\r\n {{ tag.icon }}\r\n </span>\r\n }\r\n <span>\r\n {{ tag.label }}\r\n </span>\r\n\r\n @if(tag.value) {\r\n <span\r\n class=\"bg-white border-circle h-1rem w-1rem flex align-items-center justify-content-center\"\r\n >{{ tag.value }}</span\r\n >\r\n }\r\n</div>\r\n}\r\n", styles: [":host{display:block;display:flex;flex-direction:row;gap:10px}.kv-tag{padding:.2rem .5rem;border-radius:2rem;font-size:.7rem;font-weight:400;width:max-content;flex-wrap:nowrap;display:flex;flex-direction:row;align-items:center;gap:.25rem}.kv-tag-clickable:hover{cursor:pointer;transition:all ease-in-out .2s;opacity:.9}.hover-tag{cursor:pointer;transition:all ease-in-out .2s}.hover-tag:hover{font-size:.8rem}\n"] }]
|
|
34
35
|
}] });
|
|
35
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
36
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoia3YtdGFncy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9rZWV2by1jb21wb25lbnRzL3NyYy9saWIvY29tcG9uZW50cy9rdi10YWdzL2t2LXRhZ3MuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2Vldm8tY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMva3YtdGFncy9rdi10YWdzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDNUYsT0FBTyxFQUFjLGtCQUFrQixFQUFFLE1BQU0sOENBQThDLENBQUM7O0FBUzlGLE1BQU0sT0FBTyxlQUFlO0lBUDVCO1FBU0UsU0FBSSxHQUFHLEtBQUssRUFBaUIsQ0FBQTtRQUU3QixVQUFLLEdBQUcsS0FBSyxDQUFVLEtBQUssQ0FBQyxDQUFBO1FBRzdCLFVBQUssR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsQ0FBQyxHQUl2QixFQUFFLEVBQUU7WUFDSCxPQUFPLGtCQUFrQixDQUFDLEdBQUcsQ0FBQyxRQUFRLElBQUksTUFBTSxDQUFDLENBQUE7UUFDbkQsQ0FBQyxDQUFDLENBQUE7UUFFRixjQUFTLEdBQUcsS0FBSyxDQUFVLEtBQUssQ0FBQyxDQUFDO1FBRWxDLGVBQVUsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsQ0FBQyxHQUk1QixFQUFFLEVBQUU7WUFDSCxPQUFPLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUMsR0FBRyxDQUFDLEVBQUUsSUFBSSxDQUFDLENBQUM7UUFDekQsQ0FBQyxDQUFDLENBQUM7UUFFSCxnQkFBVyxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxDQUFDLEdBSTdCLEVBQUUsRUFBRTtZQUNILE9BQU8sSUFBSSxDQUFDLGlCQUFpQixDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQyxHQUFHLENBQUMsRUFBRSxHQUFHLENBQUMsQ0FBQztRQUN4RCxDQUFDLENBQUMsQ0FBQztRQUlILGVBQVUsR0FBRyxNQUFNLEVBQWUsQ0FBQztLQWFwQztJQVhDLFFBQVEsQ0FBQyxLQUFrQjtRQUN6QixJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUM5QixDQUFDO0lBRU8saUJBQWlCLENBQUMsT0FBZSxFQUFFLFVBQWtCLEdBQUc7UUFDOUQsTUFBTSxDQUFDLEdBQUcsUUFBUSxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFDO1FBQzVDLE1BQU0sQ0FBQyxHQUFHLFFBQVEsQ0FBQyxPQUFPLENBQUMsS0FBSyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQztRQUM1QyxNQUFNLENBQUMsR0FBRyxRQUFRLENBQUMsT0FBTyxDQUFDLEtBQUssQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUM7UUFDNUMsT0FBTyxRQUFRLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxLQUFLLE9BQU8sR0FBRyxDQUFDO0lBQzlDLENBQUM7OEdBOUNVLGVBQWU7a0dBQWYsZUFBZSxtZENWNUIseXFCQTBCQTs7MkZEaEJhLGVBQWU7a0JBUDNCLFNBQVM7K0JBQ0UsU0FBUyxjQUNQLEtBQUssbUJBR0EsdUJBQXVCLENBQUMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGNvbXB1dGVkLCBpbnB1dCwgb3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IEt2U2V2ZXJpdHksIG1hcGFTZXZlcml0eUNvbG9ycyB9IGZyb20gJy4uL2t2LWZpbHRlci1jYXJkcy9rdi1maWx0ZXItY2FyZHMuY29tcG9uZW50JztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAna3YtdGFncycsXHJcbiAgc3RhbmRhbG9uZTogZmFsc2UsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2t2LXRhZ3MuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsOiAnLi9rdi10YWdzLmNvbXBvbmVudC5zY3NzJyxcclxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcclxufSlcclxuZXhwb3J0IGNsYXNzIEt2VGFnc0NvbXBvbmVudCB7XHJcblxyXG4gIHRhZ3MgPSBpbnB1dDxLdlRhZ0NvbmZpZ1tdPigpXHJcblxyXG4gIGhvdmVyID0gaW5wdXQ8Ym9vbGVhbj4oZmFsc2UpXHJcblxyXG5cclxuICBjb2xvciA9IGNvbXB1dGVkKCgpID0+ICh0YWc6e1xyXG4gICAgbGFiZWw6IHN0cmluZztcclxuICAgIHNldmVyaXR5PzogS3ZTZXZlcml0eTtcclxuICAgIGljb24/OiBzdHJpbmc7XHJcbiAgfSkgPT4ge1xyXG4gICAgcmV0dXJuIG1hcGFTZXZlcml0eUNvbG9yc1t0YWcuc2V2ZXJpdHkgfHwgJ2luZm8nXVxyXG4gIH0pXHJcblxyXG4gIGNsaWNrYWJsZSA9IGlucHV0PGJvb2xlYW4+KGZhbHNlKTtcclxuXHJcbiAgYmFja2dyb3VuZCA9IGNvbXB1dGVkKCgpID0+ICh0YWc6IHtcclxuICAgIGxhYmVsOiBzdHJpbmc7XHJcbiAgICBzZXZlcml0eT86IEt2U2V2ZXJpdHk7XHJcbiAgICBpY29uPzogc3RyaW5nO1xyXG4gIH0pID0+IHtcclxuICAgIHJldHVybiB0aGlzLmdldFRyYW5zcGFyZW50TWl4KHRoaXMuY29sb3IoKSh0YWcpLCAwLjE1KTtcclxuICB9KTtcclxuXHJcbiAgYm9yZGVyQ29sb3IgPSBjb21wdXRlZCgoKSA9PiAodGFnOiB7XHJcbiAgICBsYWJlbDogc3RyaW5nO1xyXG4gICAgc2V2ZXJpdHk/OiBLdlNldmVyaXR5O1xyXG4gICAgaWNvbj86IHN0cmluZztcclxuICB9KSA9PiB7XHJcbiAgICByZXR1cm4gdGhpcy5nZXRUcmFuc3BhcmVudE1peCh0aGlzLmNvbG9yKCkodGFnKSwgMC4yKTtcclxuICB9KTtcclxuXHJcblxyXG5cclxuICBvbkNsaWNrVGFnID0gb3V0cHV0PEt2VGFnQ29uZmlnPigpO1xyXG5cclxuICBjbGlja1RhZyhldmVudDogS3ZUYWdDb25maWcgKXtcclxuICAgIHRoaXMub25DbGlja1RhZy5lbWl0KGV2ZW50KTtcclxuICB9XHJcblxyXG4gIHByaXZhdGUgZ2V0VHJhbnNwYXJlbnRNaXgoYmFzZUhleDogc3RyaW5nLCBvcGFjaXR5OiBudW1iZXIgPSAwLjMpOiBzdHJpbmcge1xyXG4gICAgY29uc3QgciA9IHBhcnNlSW50KGJhc2VIZXguc2xpY2UoMSwgMyksIDE2KTtcclxuICAgIGNvbnN0IGcgPSBwYXJzZUludChiYXNlSGV4LnNsaWNlKDMsIDUpLCAxNik7XHJcbiAgICBjb25zdCBiID0gcGFyc2VJbnQoYmFzZUhleC5zbGljZSg1LCA3KSwgMTYpO1xyXG4gICAgcmV0dXJuIGByZ2JhKCR7cn0sICR7Z30sICR7Yn0sICR7b3BhY2l0eX0pYDtcclxuICB9XHJcblxyXG59XHJcblxyXG5cclxuZXhwb3J0IHR5cGUgS3ZUYWdDb25maWcgPSB7XHJcbiAgICBsYWJlbDogc3RyaW5nO1xyXG4gICAgc2V2ZXJpdHk/OiBLdlNldmVyaXR5O1xyXG4gICAgaWNvbj86IHN0cmluZztcclxuICAgIHZhbHVlPzpudW1iZXI7XHJcbn0iLCJAZm9yICh0YWcgb2YgdGFncygpOyB0cmFjayAkaW5kZXgpIHtcclxuPGRpdlxyXG4gIFtjbGFzcy5ob3Zlci10YWddPVwiaG92ZXIoKVwiXHJcbiAgY2xhc3M9XCJrdi10YWcge3tjbGlja2FibGUoKSAmJiAna3YtdGFnLWNsaWNrYWJsZSd9fVwiXHJcbiAgW3N0eWxlLmNvbG9yXT1cImNvbG9yKCkodGFnKVwiXHJcbiAgKGNsaWNrKT1cImNsaWNrVGFnKHRhZylcIlxyXG4gIFtzdHlsZS5iYWNrZ3JvdW5kXT1cImJhY2tncm91bmQoKSh0YWcpXCJcclxuICBzdHlsZT1cInVzZXItc2VsZWN0OiBub25lXCJcclxuPlxyXG4gIEBpZih0YWcuaWNvbikge1xyXG4gIDxzcGFuIGNsYXNzPVwibWF0ZXJpYWwtc3ltYm9scy1vdXRsaW5lZFwiIHN0eWxlPVwiZm9udC1zaXplOiAwLjc1cmVtXCI+XHJcbiAgICB7eyB0YWcuaWNvbiB9fVxyXG4gIDwvc3Bhbj5cclxuICB9XHJcbiAgPHNwYW4+XHJcbiAgICB7eyB0YWcubGFiZWwgfX1cclxuICA8L3NwYW4+XHJcblxyXG4gIEBpZih0YWcudmFsdWUpIHtcclxuICA8c3BhblxyXG4gICAgY2xhc3M9XCJiZy13aGl0ZSBib3JkZXItY2lyY2xlIGgtMXJlbSB3LTFyZW0gZmxleCBhbGlnbi1pdGVtcy1jZW50ZXIganVzdGlmeS1jb250ZW50LWNlbnRlclwiXHJcbiAgICA+e3sgdGFnLnZhbHVlIH19PC9zcGFuXHJcbiAgPlxyXG4gIH1cclxuPC9kaXY+XHJcbn1cclxuIl19
|
|
@@ -5693,11 +5693,11 @@ class KvFilterCardsComponent {
|
|
|
5693
5693
|
}
|
|
5694
5694
|
}
|
|
5695
5695
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvFilterCardsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5696
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvFilterCardsComponent, selector: "kv-filter-cards", inputs: { cards: { classPropertyName: "cards", publicName: "cards", isSignal: true, isRequired: false, transformFunction: null }, staticCards: { classPropertyName: "staticCards", publicName: "staticCards", isSignal: true, isRequired: false, transformFunction: null }, cursorPointer: { classPropertyName: "cursorPointer", publicName: "cursorPointer", isSignal: true, isRequired: false, transformFunction: null }, selectedCards: { classPropertyName: "selectedCards", publicName: "selectedCards", isSignal: true, isRequired: false, transformFunction: null }, loadingCards: { classPropertyName: "loadingCards", publicName: "loadingCards", isSignal: true, isRequired: false, transformFunction: null }, wrapCards: { classPropertyName: "wrapCards", publicName: "wrapCards", isSignal: true, isRequired: false, transformFunction: null }, alignCardsCenter: { classPropertyName: "alignCardsCenter", publicName: "alignCardsCenter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedCards: "selectedCardsChange", onCardClick: "onCardClick" }, ngImport: i0, template: "<div \r\n id=\"filter-card-container\" \r\n class=\"flex flex-row w-full justify-content-between\"\r\n>\r\n <div \r\n class=\"flex p-fluid formgrid w-full gap-
|
|
5696
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvFilterCardsComponent, selector: "kv-filter-cards", inputs: { cards: { classPropertyName: "cards", publicName: "cards", isSignal: true, isRequired: false, transformFunction: null }, staticCards: { classPropertyName: "staticCards", publicName: "staticCards", isSignal: true, isRequired: false, transformFunction: null }, cursorPointer: { classPropertyName: "cursorPointer", publicName: "cursorPointer", isSignal: true, isRequired: false, transformFunction: null }, selectedCards: { classPropertyName: "selectedCards", publicName: "selectedCards", isSignal: true, isRequired: false, transformFunction: null }, loadingCards: { classPropertyName: "loadingCards", publicName: "loadingCards", isSignal: true, isRequired: false, transformFunction: null }, wrapCards: { classPropertyName: "wrapCards", publicName: "wrapCards", isSignal: true, isRequired: false, transformFunction: null }, alignCardsCenter: { classPropertyName: "alignCardsCenter", publicName: "alignCardsCenter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedCards: "selectedCardsChange", onCardClick: "onCardClick" }, ngImport: i0, template: "<div \r\n id=\"filter-card-container\" \r\n class=\"flex flex-row w-full justify-content-between\"\r\n>\r\n <div \r\n class=\"flex p-fluid formgrid w-full gap-2 overflow-y-hidden\" \r\n [ngClass]=\"[\r\n wrapCards() ? 'flex-wrap' : 'flex-nowrap overflow-x-auto',\r\n alignCardsCenter() ? 'justify-content-center' : 'justify-content-start' \r\n ]\" \r\n #filterCardsContainer\r\n >\r\n\r\n @for (card of cards(); track card.id) {\r\n \r\n <div \r\n (click)=\"handleCardClick(card)\" \r\n [style.--main-color]=\"color()(card)\" \r\n [style.--mixed-color]=\"mixedColor()(card)\"\r\n class=\"filter-card\" \r\n\r\n [ngClass]=\"[\r\n 'filter-card-size',\r\n verificarSeCardEstaSelecionado(card) ? 'filter-card-active' : 'clickable',\r\n staticCards() ? 'filter-card-active' : '',\r\n !staticCards() && !verificarSeCardEstaSelecionado(card) ? 'filter-card-hover' : '',\r\n cursorPointer() ? 'cursor-pointer' : '',\r\n\r\n ]\"\r\n >\r\n\r\n <div class=\"filter-card-content\">\r\n\r\n <div class=\"filter-card-title\">\r\n\r\n @if (card.icon) {\r\n\r\n <div class=\"hex-icon-svg\">\r\n <svg style=\"overflow: visible;\" viewBox=\"0 0 100 100\" class=\"hex-bg\">\r\n <polygon\r\n [attr.fill]=\"getColorFillPolygon(card)\"\r\n points=\"93.3 75,50 100,6.7 75,6.7 25,50 0,93.3 25\" \r\n stroke=\"var(--main-color)\" \r\n stroke-width=\"3\"\r\n stroke-linejoin=\"round\" \r\n stroke-linecap=\"round\" \r\n opacity=\"0.8\" \r\n />\r\n </svg>\r\n\r\n <span [style.color]=\"getColorIconPolygon(card)\"\r\n class=\"material-symbols-outlined icon\">\r\n {{ card?.icon }}\r\n </span>\r\n\r\n </div>\r\n\r\n }\r\n\r\n <div style=\"font-weight: bold; font-size: .825em;\" [style.color]=\"color()(card)\">{{ card?.titulo }}</div>\r\n\r\n </div>\r\n\r\n @if(loadingCards()){\r\n\r\n <span class=\"loading-spinner\"></span>\r\n\r\n }@else {\r\n\r\n <span class=\"flex align-items-center\" [style.color]=\"color()(card)\"\r\n style=\"font-size: 1em; font-weight: 500; min-height: 1.75rem\">\r\n {{ card.valor | kvFilterCardsFormatter:card.formato}}\r\n </span>\r\n\r\n }\r\n\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: ["@charset \"UTF-8\";.card,.card-disabled,.filter-card-active{transition:border .3s ease,background-color .3s ease;border:1px solid #CBD5E1}.filter-card{transition:all ease-in-out .2s;border:1px solid #CBD5E1;border-radius:.5rem;-webkit-user-select:none;user-select:none}.filter-card-hover:hover,.filter-card-hover:active{background:#f8fafc;border:var(--main-color) .5px solid}.filter-card-active{border:var(--main-color) .5px solid;background-color:color-mix(in srgb,var(--mixed-color) 20%,white 80%)}p{font-size:.75rem}.select-none{-webkit-user-select:none;user-select:none}.filter-card-content{display:flex;flex-direction:row;align-items:center;padding:.5rem;gap:.5rem}.filter-card-title{flex:1 1 0%;display:flex;flex-direction:row;align-items:center;gap:.4rem}.hex-icon-svg{position:relative;width:1.75rem;height:1.75rem;font-size:1.75rem}.hex-icon-svg .hex-bg{width:100%;height:100%}.hex-icon-svg .icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--main-color);font-size:24px;pointer-events:none}.icon{font-weight:500!important;font-size:.65em!important}div.filter-card-hover:hover .hex-icon-svg>svg>polygon{fill:var(--mixed-color)}polygon{transition:all ease-in-out .25s}#filter-card-container{container:filter-card-container/inline-size}.filter-card-size{flex:1 1 auto;padding:0 .25rem;min-width:170px;box-sizing:border-box}@container filter-card-container (min-width: 360px){.filter-card-size{width:50%}}@container filter-card-container (min-width: 600px){.filter-card-size{width:33.3333%}}@container filter-card-container (min-width: 900px){.filter-card-size{width:25%}}@container filter-card-container (min-width: 1200px){.filter-card-size{width:16.6667%}}@container filter-card-container (min-width: 1500px){.filter-card-size{width:14.2857%}}@media (min-width: 360px){.filter-card-size{width:50%}}@media (min-width: 600px){.filter-card-size{width:33.3333%}}@media (min-width: 900px){.filter-card-size{width:25%}}@media (min-width: 1200px){.filter-card-size{width:16.6667%}}@media (min-width: 1500px){.filter-card-size{width:14.2857%}}.flex-nowrap.overflow-x-auto{overflow-x:auto;scrollbar-width:thin}.flex-wrap .filter-card-size{flex:1 1 auto}.loading-spinner{width:1rem;height:1rem;border:2px solid var(--main-color);border-bottom-color:transparent;border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation .8s linear infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: KvFilterCardsFormatterPipe, name: "kvFilterCardsFormatter" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5697
5697
|
}
|
|
5698
5698
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvFilterCardsComponent, decorators: [{
|
|
5699
5699
|
type: Component,
|
|
5700
|
-
args: [{ selector: 'kv-filter-cards', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n id=\"filter-card-container\" \r\n class=\"flex flex-row w-full justify-content-between\"\r\n>\r\n <div \r\n class=\"flex p-fluid formgrid w-full gap-
|
|
5700
|
+
args: [{ selector: 'kv-filter-cards', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n id=\"filter-card-container\" \r\n class=\"flex flex-row w-full justify-content-between\"\r\n>\r\n <div \r\n class=\"flex p-fluid formgrid w-full gap-2 overflow-y-hidden\" \r\n [ngClass]=\"[\r\n wrapCards() ? 'flex-wrap' : 'flex-nowrap overflow-x-auto',\r\n alignCardsCenter() ? 'justify-content-center' : 'justify-content-start' \r\n ]\" \r\n #filterCardsContainer\r\n >\r\n\r\n @for (card of cards(); track card.id) {\r\n \r\n <div \r\n (click)=\"handleCardClick(card)\" \r\n [style.--main-color]=\"color()(card)\" \r\n [style.--mixed-color]=\"mixedColor()(card)\"\r\n class=\"filter-card\" \r\n\r\n [ngClass]=\"[\r\n 'filter-card-size',\r\n verificarSeCardEstaSelecionado(card) ? 'filter-card-active' : 'clickable',\r\n staticCards() ? 'filter-card-active' : '',\r\n !staticCards() && !verificarSeCardEstaSelecionado(card) ? 'filter-card-hover' : '',\r\n cursorPointer() ? 'cursor-pointer' : '',\r\n\r\n ]\"\r\n >\r\n\r\n <div class=\"filter-card-content\">\r\n\r\n <div class=\"filter-card-title\">\r\n\r\n @if (card.icon) {\r\n\r\n <div class=\"hex-icon-svg\">\r\n <svg style=\"overflow: visible;\" viewBox=\"0 0 100 100\" class=\"hex-bg\">\r\n <polygon\r\n [attr.fill]=\"getColorFillPolygon(card)\"\r\n points=\"93.3 75,50 100,6.7 75,6.7 25,50 0,93.3 25\" \r\n stroke=\"var(--main-color)\" \r\n stroke-width=\"3\"\r\n stroke-linejoin=\"round\" \r\n stroke-linecap=\"round\" \r\n opacity=\"0.8\" \r\n />\r\n </svg>\r\n\r\n <span [style.color]=\"getColorIconPolygon(card)\"\r\n class=\"material-symbols-outlined icon\">\r\n {{ card?.icon }}\r\n </span>\r\n\r\n </div>\r\n\r\n }\r\n\r\n <div style=\"font-weight: bold; font-size: .825em;\" [style.color]=\"color()(card)\">{{ card?.titulo }}</div>\r\n\r\n </div>\r\n\r\n @if(loadingCards()){\r\n\r\n <span class=\"loading-spinner\"></span>\r\n\r\n }@else {\r\n\r\n <span class=\"flex align-items-center\" [style.color]=\"color()(card)\"\r\n style=\"font-size: 1em; font-weight: 500; min-height: 1.75rem\">\r\n {{ card.valor | kvFilterCardsFormatter:card.formato}}\r\n </span>\r\n\r\n }\r\n\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: ["@charset \"UTF-8\";.card,.card-disabled,.filter-card-active{transition:border .3s ease,background-color .3s ease;border:1px solid #CBD5E1}.filter-card{transition:all ease-in-out .2s;border:1px solid #CBD5E1;border-radius:.5rem;-webkit-user-select:none;user-select:none}.filter-card-hover:hover,.filter-card-hover:active{background:#f8fafc;border:var(--main-color) .5px solid}.filter-card-active{border:var(--main-color) .5px solid;background-color:color-mix(in srgb,var(--mixed-color) 20%,white 80%)}p{font-size:.75rem}.select-none{-webkit-user-select:none;user-select:none}.filter-card-content{display:flex;flex-direction:row;align-items:center;padding:.5rem;gap:.5rem}.filter-card-title{flex:1 1 0%;display:flex;flex-direction:row;align-items:center;gap:.4rem}.hex-icon-svg{position:relative;width:1.75rem;height:1.75rem;font-size:1.75rem}.hex-icon-svg .hex-bg{width:100%;height:100%}.hex-icon-svg .icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--main-color);font-size:24px;pointer-events:none}.icon{font-weight:500!important;font-size:.65em!important}div.filter-card-hover:hover .hex-icon-svg>svg>polygon{fill:var(--mixed-color)}polygon{transition:all ease-in-out .25s}#filter-card-container{container:filter-card-container/inline-size}.filter-card-size{flex:1 1 auto;padding:0 .25rem;min-width:170px;box-sizing:border-box}@container filter-card-container (min-width: 360px){.filter-card-size{width:50%}}@container filter-card-container (min-width: 600px){.filter-card-size{width:33.3333%}}@container filter-card-container (min-width: 900px){.filter-card-size{width:25%}}@container filter-card-container (min-width: 1200px){.filter-card-size{width:16.6667%}}@container filter-card-container (min-width: 1500px){.filter-card-size{width:14.2857%}}@media (min-width: 360px){.filter-card-size{width:50%}}@media (min-width: 600px){.filter-card-size{width:33.3333%}}@media (min-width: 900px){.filter-card-size{width:25%}}@media (min-width: 1200px){.filter-card-size{width:16.6667%}}@media (min-width: 1500px){.filter-card-size{width:14.2857%}}.flex-nowrap.overflow-x-auto{overflow-x:auto;scrollbar-width:thin}.flex-wrap .filter-card-size{flex:1 1 auto}.loading-spinner{width:1rem;height:1rem;border:2px solid var(--main-color);border-bottom-color:transparent;border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation .8s linear infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
|
|
5701
5701
|
}] });
|
|
5702
5702
|
const mapaSeverityColors = {
|
|
5703
5703
|
primary: '#0A8765', // Verde
|
|
@@ -5715,6 +5715,7 @@ class KvTagsComponent {
|
|
|
5715
5715
|
this.color = computed(() => (tag) => {
|
|
5716
5716
|
return mapaSeverityColors[tag.severity || 'info'];
|
|
5717
5717
|
});
|
|
5718
|
+
this.clickable = input(false);
|
|
5718
5719
|
this.background = computed(() => (tag) => {
|
|
5719
5720
|
return this.getTransparentMix(this.color()(tag), 0.15);
|
|
5720
5721
|
});
|
|
@@ -5733,11 +5734,11 @@ class KvTagsComponent {
|
|
|
5733
5734
|
return `rgba(${r}, ${g}, ${b}, ${opacity})`;
|
|
5734
5735
|
}
|
|
5735
5736
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTagsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5736
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTagsComponent, selector: "kv-tags", inputs: { tags: { classPropertyName: "tags", publicName: "tags", isSignal: true, isRequired: false, transformFunction: null }, hover: { classPropertyName: "hover", publicName: "hover", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClickTag: "onClickTag" }, ngImport: i0, template: "@for (tag of tags(); track $index) {\r\n<div
|
|
5737
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTagsComponent, selector: "kv-tags", inputs: { tags: { classPropertyName: "tags", publicName: "tags", isSignal: true, isRequired: false, transformFunction: null }, hover: { classPropertyName: "hover", publicName: "hover", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClickTag: "onClickTag" }, ngImport: i0, template: "@for (tag of tags(); track $index) {\r\n<div\r\n [class.hover-tag]=\"hover()\"\r\n class=\"kv-tag {{clickable() && 'kv-tag-clickable'}}\"\r\n [style.color]=\"color()(tag)\"\r\n (click)=\"clickTag(tag)\"\r\n [style.background]=\"background()(tag)\"\r\n style=\"user-select: none\"\r\n>\r\n @if(tag.icon) {\r\n <span class=\"material-symbols-outlined\" style=\"font-size: 0.75rem\">\r\n {{ tag.icon }}\r\n </span>\r\n }\r\n <span>\r\n {{ tag.label }}\r\n </span>\r\n\r\n @if(tag.value) {\r\n <span\r\n class=\"bg-white border-circle h-1rem w-1rem flex align-items-center justify-content-center\"\r\n >{{ tag.value }}</span\r\n >\r\n }\r\n</div>\r\n}\r\n", styles: [":host{display:block;display:flex;flex-direction:row;gap:10px}.kv-tag{padding:.2rem .5rem;border-radius:2rem;font-size:.7rem;font-weight:400;width:max-content;flex-wrap:nowrap;display:flex;flex-direction:row;align-items:center;gap:.25rem}.kv-tag-clickable:hover{cursor:pointer;transition:all ease-in-out .2s;opacity:.9}.hover-tag{cursor:pointer;transition:all ease-in-out .2s}.hover-tag:hover{font-size:.8rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5737
5738
|
}
|
|
5738
5739
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTagsComponent, decorators: [{
|
|
5739
5740
|
type: Component,
|
|
5740
|
-
args: [{ selector: 'kv-tags', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (tag of tags(); track $index) {\r\n<div
|
|
5741
|
+
args: [{ selector: 'kv-tags', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (tag of tags(); track $index) {\r\n<div\r\n [class.hover-tag]=\"hover()\"\r\n class=\"kv-tag {{clickable() && 'kv-tag-clickable'}}\"\r\n [style.color]=\"color()(tag)\"\r\n (click)=\"clickTag(tag)\"\r\n [style.background]=\"background()(tag)\"\r\n style=\"user-select: none\"\r\n>\r\n @if(tag.icon) {\r\n <span class=\"material-symbols-outlined\" style=\"font-size: 0.75rem\">\r\n {{ tag.icon }}\r\n </span>\r\n }\r\n <span>\r\n {{ tag.label }}\r\n </span>\r\n\r\n @if(tag.value) {\r\n <span\r\n class=\"bg-white border-circle h-1rem w-1rem flex align-items-center justify-content-center\"\r\n >{{ tag.value }}</span\r\n >\r\n }\r\n</div>\r\n}\r\n", styles: [":host{display:block;display:flex;flex-direction:row;gap:10px}.kv-tag{padding:.2rem .5rem;border-radius:2rem;font-size:.7rem;font-weight:400;width:max-content;flex-wrap:nowrap;display:flex;flex-direction:row;align-items:center;gap:.25rem}.kv-tag-clickable:hover{cursor:pointer;transition:all ease-in-out .2s;opacity:.9}.hover-tag{cursor:pointer;transition:all ease-in-out .2s}.hover-tag:hover{font-size:.8rem}\n"] }]
|
|
5741
5742
|
}] });
|
|
5742
5743
|
|
|
5743
5744
|
class KvEditorComponent extends BaseComponentInput {
|
|
@@ -5967,7 +5968,7 @@ class KvEditorComponent extends BaseComponentInput {
|
|
|
5967
5968
|
this.writeValue('');
|
|
5968
5969
|
}
|
|
5969
5970
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvEditorComponent, deps: [{ token: ComponentService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5970
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvEditorComponent, selector: "kv-editor", inputs: { canvaHeigth: { classPropertyName: "canvaHeigth", publicName: "canvaHeigth", isSignal: false, isRequired: false, transformFunction: null }, contentType: { classPropertyName: "contentType", publicName: "contentType", isSignal: false, isRequired: false, transformFunction: null }, debug: { classPropertyName: "debug", publicName: "debug", isSignal: false, isRequired: false, transformFunction: null }, relatorios: { classPropertyName: "relatorios", publicName: "relatorios", isSignal: true, isRequired: false, transformFunction: null }, idRelatorioInitial: { classPropertyName: "idRelatorioInitial", publicName: "idRelatorioInitial", isSignal: true, isRequired: false, transformFunction: null }, printButton: { classPropertyName: "printButton", publicName: "printButton", isSignal: true, isRequired: false, transformFunction: null }, labelEmptyDropdown: { classPropertyName: "labelEmptyDropdown", publicName: "labelEmptyDropdown", isSignal: true, isRequired: false, transformFunction: null }, instrucoesTemplate: { classPropertyName: "instrucoesTemplate", publicName: "instrucoesTemplate", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onTextChange: "onTextChange", onSelectionChange: "onSelectionChange", outputRaw: "outputRaw", outputHtml: "outputHtml", idRelatorioInitial: "idRelatorioInitialChange" }, providers: ComponentProviders(KvEditorComponent), viewQueries: [{ propertyName: "opVariables", first: true, predicate: ["opVariables"], descendants: true }, { propertyName: "mentionAnchor", first: true, predicate: ["mentionAnchor"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"kv-editor-container h-full w-full max-h-full flex flex-column overflow-hidden\"\r\n>\r\n <div\r\n #editor\r\n id=\"kv-editor-toolbar\"\r\n [ngClass]=\"{ 'error-border-toolbar': hasControlError() }\"\r\n class=\"{{ showHeader() ? 'flex' : 'hidden' }} flex-column flex-initial\"\r\n >\r\n @if(relatorios().length > 0) {\r\n <div class=\"flex flex-row justify-content-between\">\r\n <div class=\"flex flex-row gap-2\">\r\n <div\r\n class=\"flex flex-row align-items-center gap-2 p-2 border-round-lg border-1 border-gray-200 hover:shadow-1 hover:bg-gray-100 cursor-pointer transition-all transition-duration-300\"\r\n (click)=\"op.toggle($event)\"\r\n >\r\n <span\r\n class=\"material-symbols-outlined text-lg text-green-600 font-medium\"\r\n >\r\n contract\r\n </span>\r\n <span class=\"font-semibold text-xs text-gray-600\">{{\r\n !clearedTemplate()\r\n ? relatorio()?.label || labelEmptyDropdown()\r\n : labelEmptyDropdown()\r\n }}</span>\r\n <span class=\"material-symbols-outlined text-lg\">\r\n keyboard_arrow_down\r\n </span>\r\n </div>\r\n\r\n @if(!clearedTemplate()) {\r\n <div\r\n class=\"flex flex-row align-items-center gap-2 p-2 border-round-lg border-1 border-gray-200 hover:shadow-1 hover:bg-gray-100 cursor-pointer transition-all transition-duration-300\"\r\n (click)=\"clearTemplate()\"\r\n >\r\n <span\r\n class=\"material-symbols-outlined text-lg text-orange-600 font-medium\"\r\n [pTooltip]=\"'Limpar Template'\"\r\n >\r\n layers_clear\r\n </span>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"flex flex-row align-items-center gap-2 p-2 border-round-lg border-1 border-gray-200 hover:shadow-1 hover:bg-gray-100 cursor-pointer transition-all transition-duration-300\"\r\n (click)=\"showInstrucoes()\"\r\n >\r\n <span\r\n class=\"material-symbols-outlined text-lg text-blue-600 font-medium\"\r\n >\r\n info\r\n </span>\r\n <span class=\"font-semibold text-xs text-gray-600\">Instru\u00E7\u00F5es</span>\r\n </div>\r\n </div>\r\n\r\n @if(printButton()) {\r\n <div\r\n class=\"flex flex-row align-items-center gap-2 p-2 border-round-lg border-1 border-gray-200 hover:shadow-1 hover:bg-gray-100 cursor-pointer transition-all transition-duration-300\"\r\n (click)=\"openRelatorio()\"\r\n >\r\n <span class=\"material-symbols-outlined text-lg font-medium\">\r\n print\r\n </span>\r\n <span class=\"font-semibold text-xs text-gray-600\">Imprimir</span>\r\n </div>\r\n }\r\n </div>\r\n\r\n <p-divider class=\"w-full\"></p-divider>\r\n\r\n }\r\n\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-between w-full flex-initial\"\r\n >\r\n @if(isLoading()) {\r\n\r\n <div class=\"flex flex-row align-items-center gap-3 w-full\">\r\n <p-skeleton\r\n styleClass=\"w-6rem\"\r\n [style]=\"{ height: '2rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-6rem\"\r\n [style]=\"{ height: '2rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-6rem\"\r\n [style]=\"{ height: '2rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-6rem\"\r\n [style]=\"{ height: '2rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-6rem\"\r\n [style]=\"{ height: '2rem' }\"\r\n ></p-skeleton>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"flex-row align-items-center flex-wrap gap-2 {{\r\n isLoading() ? 'hidden' : 'flex'\r\n }} w-full\"\r\n >\r\n <span class=\"ql-formats border-round-md\">\r\n <select class=\"ql-font\">\r\n <option value=\"roboto\">Roboto</option>\r\n <option value=\"arial\">Arial</option>\r\n <option value=\"times-new-roman\">Times New Roman</option>\r\n <option value=\"monospace\">Monospace</option>\r\n <option value=\"inter\">Inter</option>\r\n <option selected>Sans Serif</option>\r\n <option value=\"serif\">Serif</option>\r\n </select>\r\n\r\n <select class=\"ql-header\">\r\n <option value=\"1\">Titulo</option>\r\n <option value=\"2\">Subtitulo</option>\r\n <option selected>Normal</option>\r\n </select>\r\n\r\n <span class=\"ql-format-group\">\r\n <select title=\"Size\" class=\"ql-size\">\r\n <option value=\"15px\">15px</option>\r\n <option value=\"20px\">20px</option>\r\n <option value=\"30px\">30px</option>\r\n <option value=\"40px\">40px</option>\r\n <option value=\"50px\">50px</option>\r\n <option value=\"70px\">70px</option>\r\n <option value=\"90px\">90px</option>\r\n </select>\r\n </span>\r\n </span>\r\n\r\n <p-divider layout=\"vertical\"></p-divider>\r\n\r\n <span class=\"ql-formats border-round-md\">\r\n <button class=\"ql-bold\"></button>\r\n <button class=\"ql-italic\"></button>\r\n <button class=\"ql-underline\"></button>\r\n <button class=\"ql-strike\"></button>\r\n </span>\r\n\r\n <p-divider layout=\"vertical\"></p-divider>\r\n\r\n <span class=\"ql-formats border-round-md\">\r\n <select class=\"ql-color\"></select>\r\n <select class=\"ql-background\"></select>\r\n </span>\r\n\r\n @if(true) {\r\n <!-- <p-divider layout=\"vertical\"></p-divider>\r\n\r\n <span class=\"ql-formats border-round-md\">\r\n <button class=\"ql-header\" value=\"1\"></button>\r\n <button class=\"ql-header\" value=\"2\"></button>\r\n </span> -->\r\n\r\n <p-divider layout=\"vertical\"></p-divider>\r\n\r\n <span class=\"ql-formats border-round-md\">\r\n <button class=\"ql-link\"></button>\r\n <button class=\"ql-image\"></button>\r\n <button class=\"ql-video\"></button>\r\n </span>\r\n\r\n <p-divider layout=\"vertical\"></p-divider>\r\n\r\n <span class=\"ql-formats border-round-md\">\r\n <button class=\"ql-list\" value=\"ordered\"></button>\r\n <button class=\"ql-list\" value=\"bullet\"></button>\r\n <select class=\"ql-align\"></select>\r\n </span>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n style=\"height: 3px; border-top: none; border-bottom: none\"\r\n [style.borderRight]=\"showHeader() ? '1px solid #e5e7eb' : 'none'\"\r\n [style.borderLeft]=\"showHeader() ? '1px solid #e5e7eb' : 'none'\"\r\n >\r\n @if(isLoadingPdf()) {\r\n <p-progressBar mode=\"indeterminate\" [style]=\"{ height: '3px' }\" />\r\n }\r\n </div>\r\n\r\n <div\r\n id=\"kv-editor\"\r\n class=\"overflow-auto w-full flex-1 scrollstyle w-full\"\r\n [ngClass]=\"{\r\n 'error-border': hasControlError(),\r\n 'pointer-events-none opacity-60': isLoadingPdf()\r\n }\"\r\n [style.borderTop]=\"showHeader() ? 'none' : '1px solid #e5e7eb'\"\r\n ></div>\r\n</div>\r\n<kv-error [hasError]=\"hasControlError()\">{{ erroMessage() }}</kv-error>\r\n\r\n<!-- <link href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css\" rel=\"stylesheet\" /> -->\r\n<link href=\"https://fonts.googleapis.com/css?family=Roboto\" rel=\"stylesheet\" />\r\n<script src=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.js\"></script>\r\n<script src=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js\"></script>\r\n\r\n<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.bubble.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css\"\r\n/>\r\n\r\n<p-overlayPanel #op styleClass=\"overflow-hidden\">\r\n <div\r\n class=\"grid m-0 gap-2 p-2 max-w-20rem overflow-y-auto scrollstyle\"\r\n style=\"max-height: 16rem\"\r\n >\r\n @for(item of relatorios(); track $index) {\r\n <div\r\n class=\"col-12 cursor-pointer hover:bg-gray-100 transition-colors transition-duration-200 border-round-lg shadow-2 flex flex-column gap-2\"\r\n (click)=\"setRelatorio(item)\"\r\n >\r\n <div\r\n class=\"flex flex-row align-items-center gap-2 justify-content-between\"\r\n >\r\n <span class=\"text-sm font-medium w-full\">{{ item.label }}</span>\r\n\r\n <kv-tags\r\n class=\"transition-opacity transition-duration-300 {{\r\n item?.id == idRelatorioSelected() ? 'opacity-100' : 'opacity-0'\r\n }}\"\r\n [tags]=\"[{ label: 'Selecionado', severity: 'primary' }]\"\r\n ></kv-tags>\r\n </div>\r\n <span class=\"text-xs text-gray-500\">{{ item.descricao }}</span>\r\n </div>\r\n }\r\n </div>\r\n</p-overlayPanel>\r\n\r\n<div class=\"kv-editor-container flex flex-column overflow-hidden relative\">\r\n <div\r\n #mentionAnchor\r\n style=\"position: fixed; width: 1px; height: 1px; opacity: 0\"\r\n ></div>\r\n</div>\r\n\r\n<p-overlayPanel\r\n #opVariables\r\n [appendTo]=\"'body'\"\r\n (onHide)=\"closeVariablesPanel()\"\r\n>\r\n <div\r\n class=\"flex flex-column gap-1 p-1 overflow-y-auto scroll-virtual border-round-lg\"\r\n style=\"max-height: 250px; min-width: 250px; background-color: #333333\"\r\n >\r\n @for(variable of filteredVariables(); track variable.id) {\r\n <div\r\n class=\"p-2 cursor-pointer transition-colors transition-duration-200 border-round-lg text-sm text-white option-dropdown\"\r\n (click)=\"selectVariableFromPanel(variable)\"\r\n >\r\n {{ variable.descricao }} (\r\n <span class=\"text-gray-400\">{{ variable.value }}</span> )\r\n </div>\r\n } @empty {\r\n <div class=\"p-2 text-sm text-gray-500\">Nenhuma vari\u00E1vel encontrada.</div>\r\n }\r\n </div>\r\n</p-overlayPanel>\r\n", styles: [":host ::ng-deep .ql-font-roboto{font-family:Roboto,sans-serif}:host ::ng-deep .ql-font-inter{font-family:Inter var,sans-serif}:host ::ng-deep .ql-font-arial{font-family:Arial,Arial,sans-serif}:host ::ng-deep .ql-font-times-new-roman{font-family:Times New Roman,Times,serif}:host ::ng-deep .ql-tooltip.ql-editing[data-mode=video]{transform:translate(40%)}:host ::ng-deep #kv-editor-toolbar{border-radius:6px 6px 0 0;border:1px solid #e5e7eb}:host ::ng-deep #kv-editor{border-radius:0 0 6px 6px;border:1px solid #e5e7eb}.error-border-toolbar{transition:all ease-in .2s;border-top-color:#e24c4c!important;border-bottom-color:#e24c4c!important;border-left-color:#e24c4c!important;border-right-color:#e24c4c!important}.error-border{border-color:#e24c4c!important;transition:all ease-in .2s}:host ::ng-deep .blot-formatter__resize-handle{background:#eaeaea!important}:ng-deep p{text-align:justify!important}::ng-deep .scrollstyle,::ng-deep .ql-editor{overflow-x:hidden}::ng-deep .scrollstyle::-webkit-scrollbar,::ng-deep .ql-editor::-webkit-scrollbar{width:6px}::ng-deep .scrollstyle::-webkit-scrollbar:hover,::ng-deep .ql-editor::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .scrollstyle::-webkit-scrollbar-thumb,::ng-deep .ql-editor::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .scrollstyle:hover::-webkit-scrollbar-thumb,::ng-deep .ql-editor:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .scrollstyle::-webkit-scrollbar-track,::ng-deep .ql-editor::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}:host ::ng-deep .editor-spinner-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#ffffff80;display:flex;justify-content:center;align-items:center;z-index:100000;border-radius:inherit}::ng-deep .p-progressbar-indeterminate .p-progressbar-value:after{background:#002542}::ng-deep .p-progressbar-indeterminate .p-progressbar-value:before{background:#002542}::ng-deep .scroll-virtual{overflow-x:hidden}::ng-deep .scroll-virtual::-webkit-scrollbar{width:8px}::ng-deep .scroll-virtual::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .scroll-virtual::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .scroll-virtual:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .scroll-virtual::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.option-dropdown{background-color:#333;transition:all ease-in .2s}.option-dropdown:hover{background-color:#444}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: KvErrorComponent, selector: "kv-error", inputs: ["formControl", "hasError"] }, { kind: "directive", type: i5$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i10.Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }, { kind: "component", type: i7$1.ProgressBar, selector: "p-progressBar", inputs: ["value", "showValue", "styleClass", "style", "unit", "mode", "color"] }, { kind: "component", type: i11.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i12.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: KvTagsComponent, selector: "kv-tags", inputs: ["tags", "hover"], outputs: ["onClickTag"] }] }); }
|
|
5971
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvEditorComponent, selector: "kv-editor", inputs: { canvaHeigth: { classPropertyName: "canvaHeigth", publicName: "canvaHeigth", isSignal: false, isRequired: false, transformFunction: null }, contentType: { classPropertyName: "contentType", publicName: "contentType", isSignal: false, isRequired: false, transformFunction: null }, debug: { classPropertyName: "debug", publicName: "debug", isSignal: false, isRequired: false, transformFunction: null }, relatorios: { classPropertyName: "relatorios", publicName: "relatorios", isSignal: true, isRequired: false, transformFunction: null }, idRelatorioInitial: { classPropertyName: "idRelatorioInitial", publicName: "idRelatorioInitial", isSignal: true, isRequired: false, transformFunction: null }, printButton: { classPropertyName: "printButton", publicName: "printButton", isSignal: true, isRequired: false, transformFunction: null }, labelEmptyDropdown: { classPropertyName: "labelEmptyDropdown", publicName: "labelEmptyDropdown", isSignal: true, isRequired: false, transformFunction: null }, instrucoesTemplate: { classPropertyName: "instrucoesTemplate", publicName: "instrucoesTemplate", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onTextChange: "onTextChange", onSelectionChange: "onSelectionChange", outputRaw: "outputRaw", outputHtml: "outputHtml", idRelatorioInitial: "idRelatorioInitialChange" }, providers: ComponentProviders(KvEditorComponent), viewQueries: [{ propertyName: "opVariables", first: true, predicate: ["opVariables"], descendants: true }, { propertyName: "mentionAnchor", first: true, predicate: ["mentionAnchor"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"kv-editor-container h-full w-full max-h-full flex flex-column overflow-hidden\"\r\n>\r\n <div\r\n #editor\r\n id=\"kv-editor-toolbar\"\r\n [ngClass]=\"{ 'error-border-toolbar': hasControlError() }\"\r\n class=\"{{ showHeader() ? 'flex' : 'hidden' }} flex-column flex-initial\"\r\n >\r\n @if(relatorios().length > 0) {\r\n <div class=\"flex flex-row justify-content-between\">\r\n <div class=\"flex flex-row gap-2\">\r\n <div\r\n class=\"flex flex-row align-items-center gap-2 p-2 border-round-lg border-1 border-gray-200 hover:shadow-1 hover:bg-gray-100 cursor-pointer transition-all transition-duration-300\"\r\n (click)=\"op.toggle($event)\"\r\n >\r\n <span\r\n class=\"material-symbols-outlined text-lg text-green-600 font-medium\"\r\n >\r\n contract\r\n </span>\r\n <span class=\"font-semibold text-xs text-gray-600\">{{\r\n !clearedTemplate()\r\n ? relatorio()?.label || labelEmptyDropdown()\r\n : labelEmptyDropdown()\r\n }}</span>\r\n <span class=\"material-symbols-outlined text-lg\">\r\n keyboard_arrow_down\r\n </span>\r\n </div>\r\n\r\n @if(!clearedTemplate()) {\r\n <div\r\n class=\"flex flex-row align-items-center gap-2 p-2 border-round-lg border-1 border-gray-200 hover:shadow-1 hover:bg-gray-100 cursor-pointer transition-all transition-duration-300\"\r\n (click)=\"clearTemplate()\"\r\n >\r\n <span\r\n class=\"material-symbols-outlined text-lg text-orange-600 font-medium\"\r\n [pTooltip]=\"'Limpar Template'\"\r\n >\r\n layers_clear\r\n </span>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"flex flex-row align-items-center gap-2 p-2 border-round-lg border-1 border-gray-200 hover:shadow-1 hover:bg-gray-100 cursor-pointer transition-all transition-duration-300\"\r\n (click)=\"showInstrucoes()\"\r\n >\r\n <span\r\n class=\"material-symbols-outlined text-lg text-blue-600 font-medium\"\r\n >\r\n info\r\n </span>\r\n <span class=\"font-semibold text-xs text-gray-600\">Instru\u00E7\u00F5es</span>\r\n </div>\r\n </div>\r\n\r\n @if(printButton()) {\r\n <div\r\n class=\"flex flex-row align-items-center gap-2 p-2 border-round-lg border-1 border-gray-200 hover:shadow-1 hover:bg-gray-100 cursor-pointer transition-all transition-duration-300\"\r\n (click)=\"openRelatorio()\"\r\n >\r\n <span class=\"material-symbols-outlined text-lg font-medium\">\r\n print\r\n </span>\r\n <span class=\"font-semibold text-xs text-gray-600\">Imprimir</span>\r\n </div>\r\n }\r\n </div>\r\n\r\n <p-divider class=\"w-full\"></p-divider>\r\n\r\n }\r\n\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-between w-full flex-initial\"\r\n >\r\n @if(isLoading()) {\r\n\r\n <div class=\"flex flex-row align-items-center gap-3 w-full\">\r\n <p-skeleton\r\n styleClass=\"w-6rem\"\r\n [style]=\"{ height: '2rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-6rem\"\r\n [style]=\"{ height: '2rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-6rem\"\r\n [style]=\"{ height: '2rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-6rem\"\r\n [style]=\"{ height: '2rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-6rem\"\r\n [style]=\"{ height: '2rem' }\"\r\n ></p-skeleton>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"flex-row align-items-center flex-wrap gap-2 {{\r\n isLoading() ? 'hidden' : 'flex'\r\n }} w-full\"\r\n >\r\n <span class=\"ql-formats border-round-md\">\r\n <select class=\"ql-font\">\r\n <option value=\"roboto\">Roboto</option>\r\n <option value=\"arial\">Arial</option>\r\n <option value=\"times-new-roman\">Times New Roman</option>\r\n <option value=\"monospace\">Monospace</option>\r\n <option value=\"inter\">Inter</option>\r\n <option selected>Sans Serif</option>\r\n <option value=\"serif\">Serif</option>\r\n </select>\r\n\r\n <select class=\"ql-header\">\r\n <option value=\"1\">Titulo</option>\r\n <option value=\"2\">Subtitulo</option>\r\n <option selected>Normal</option>\r\n </select>\r\n\r\n <span class=\"ql-format-group\">\r\n <select title=\"Size\" class=\"ql-size\">\r\n <option value=\"15px\">15px</option>\r\n <option value=\"20px\">20px</option>\r\n <option value=\"30px\">30px</option>\r\n <option value=\"40px\">40px</option>\r\n <option value=\"50px\">50px</option>\r\n <option value=\"70px\">70px</option>\r\n <option value=\"90px\">90px</option>\r\n </select>\r\n </span>\r\n </span>\r\n\r\n <p-divider layout=\"vertical\"></p-divider>\r\n\r\n <span class=\"ql-formats border-round-md\">\r\n <button class=\"ql-bold\"></button>\r\n <button class=\"ql-italic\"></button>\r\n <button class=\"ql-underline\"></button>\r\n <button class=\"ql-strike\"></button>\r\n </span>\r\n\r\n <p-divider layout=\"vertical\"></p-divider>\r\n\r\n <span class=\"ql-formats border-round-md\">\r\n <select class=\"ql-color\"></select>\r\n <select class=\"ql-background\"></select>\r\n </span>\r\n\r\n @if(true) {\r\n <!-- <p-divider layout=\"vertical\"></p-divider>\r\n\r\n <span class=\"ql-formats border-round-md\">\r\n <button class=\"ql-header\" value=\"1\"></button>\r\n <button class=\"ql-header\" value=\"2\"></button>\r\n </span> -->\r\n\r\n <p-divider layout=\"vertical\"></p-divider>\r\n\r\n <span class=\"ql-formats border-round-md\">\r\n <button class=\"ql-link\"></button>\r\n <button class=\"ql-image\"></button>\r\n <button class=\"ql-video\"></button>\r\n </span>\r\n\r\n <p-divider layout=\"vertical\"></p-divider>\r\n\r\n <span class=\"ql-formats border-round-md\">\r\n <button class=\"ql-list\" value=\"ordered\"></button>\r\n <button class=\"ql-list\" value=\"bullet\"></button>\r\n <select class=\"ql-align\"></select>\r\n </span>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n style=\"height: 3px; border-top: none; border-bottom: none\"\r\n [style.borderRight]=\"showHeader() ? '1px solid #e5e7eb' : 'none'\"\r\n [style.borderLeft]=\"showHeader() ? '1px solid #e5e7eb' : 'none'\"\r\n >\r\n @if(isLoadingPdf()) {\r\n <p-progressBar mode=\"indeterminate\" [style]=\"{ height: '3px' }\" />\r\n }\r\n </div>\r\n\r\n <div\r\n id=\"kv-editor\"\r\n class=\"overflow-auto w-full flex-1 scrollstyle w-full\"\r\n [ngClass]=\"{\r\n 'error-border': hasControlError(),\r\n 'pointer-events-none opacity-60': isLoadingPdf()\r\n }\"\r\n [style.borderTop]=\"showHeader() ? 'none' : '1px solid #e5e7eb'\"\r\n ></div>\r\n</div>\r\n<kv-error [hasError]=\"hasControlError()\">{{ erroMessage() }}</kv-error>\r\n\r\n<!-- <link href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css\" rel=\"stylesheet\" /> -->\r\n<link href=\"https://fonts.googleapis.com/css?family=Roboto\" rel=\"stylesheet\" />\r\n<script src=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.js\"></script>\r\n<script src=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js\"></script>\r\n\r\n<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.bubble.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css\"\r\n/>\r\n\r\n<p-overlayPanel #op styleClass=\"overflow-hidden\">\r\n <div\r\n class=\"grid m-0 gap-2 p-2 max-w-20rem overflow-y-auto scrollstyle\"\r\n style=\"max-height: 16rem\"\r\n >\r\n @for(item of relatorios(); track $index) {\r\n <div\r\n class=\"col-12 cursor-pointer hover:bg-gray-100 transition-colors transition-duration-200 border-round-lg shadow-2 flex flex-column gap-2\"\r\n (click)=\"setRelatorio(item)\"\r\n >\r\n <div\r\n class=\"flex flex-row align-items-center gap-2 justify-content-between\"\r\n >\r\n <span class=\"text-sm font-medium w-full\">{{ item.label }}</span>\r\n\r\n <kv-tags\r\n class=\"transition-opacity transition-duration-300 {{\r\n item?.id == idRelatorioSelected() ? 'opacity-100' : 'opacity-0'\r\n }}\"\r\n [tags]=\"[{ label: 'Selecionado', severity: 'primary' }]\"\r\n ></kv-tags>\r\n </div>\r\n <span class=\"text-xs text-gray-500\">{{ item.descricao }}</span>\r\n </div>\r\n }\r\n </div>\r\n</p-overlayPanel>\r\n\r\n<div class=\"kv-editor-container flex flex-column overflow-hidden relative\">\r\n <div\r\n #mentionAnchor\r\n style=\"position: fixed; width: 1px; height: 1px; opacity: 0\"\r\n ></div>\r\n</div>\r\n\r\n<p-overlayPanel\r\n #opVariables\r\n [appendTo]=\"'body'\"\r\n (onHide)=\"closeVariablesPanel()\"\r\n>\r\n <div\r\n class=\"flex flex-column gap-1 p-1 overflow-y-auto scroll-virtual border-round-lg\"\r\n style=\"max-height: 250px; min-width: 250px; background-color: #333333\"\r\n >\r\n @for(variable of filteredVariables(); track variable.id) {\r\n <div\r\n class=\"p-2 cursor-pointer transition-colors transition-duration-200 border-round-lg text-sm text-white option-dropdown\"\r\n (click)=\"selectVariableFromPanel(variable)\"\r\n >\r\n {{ variable.descricao }} (\r\n <span class=\"text-gray-400\">{{ variable.value }}</span> )\r\n </div>\r\n } @empty {\r\n <div class=\"p-2 text-sm text-gray-500\">Nenhuma vari\u00E1vel encontrada.</div>\r\n }\r\n </div>\r\n</p-overlayPanel>\r\n", styles: [":host ::ng-deep .ql-font-roboto{font-family:Roboto,sans-serif}:host ::ng-deep .ql-font-inter{font-family:Inter var,sans-serif}:host ::ng-deep .ql-font-arial{font-family:Arial,Arial,sans-serif}:host ::ng-deep .ql-font-times-new-roman{font-family:Times New Roman,Times,serif}:host ::ng-deep .ql-tooltip.ql-editing[data-mode=video]{transform:translate(40%)}:host ::ng-deep #kv-editor-toolbar{border-radius:6px 6px 0 0;border:1px solid #e5e7eb}:host ::ng-deep #kv-editor{border-radius:0 0 6px 6px;border:1px solid #e5e7eb}.error-border-toolbar{transition:all ease-in .2s;border-top-color:#e24c4c!important;border-bottom-color:#e24c4c!important;border-left-color:#e24c4c!important;border-right-color:#e24c4c!important}.error-border{border-color:#e24c4c!important;transition:all ease-in .2s}:host ::ng-deep .blot-formatter__resize-handle{background:#eaeaea!important}:ng-deep p{text-align:justify!important}::ng-deep .scrollstyle,::ng-deep .ql-editor{overflow-x:hidden}::ng-deep .scrollstyle::-webkit-scrollbar,::ng-deep .ql-editor::-webkit-scrollbar{width:6px}::ng-deep .scrollstyle::-webkit-scrollbar:hover,::ng-deep .ql-editor::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .scrollstyle::-webkit-scrollbar-thumb,::ng-deep .ql-editor::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .scrollstyle:hover::-webkit-scrollbar-thumb,::ng-deep .ql-editor:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .scrollstyle::-webkit-scrollbar-track,::ng-deep .ql-editor::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}:host ::ng-deep .editor-spinner-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#ffffff80;display:flex;justify-content:center;align-items:center;z-index:100000;border-radius:inherit}::ng-deep .p-progressbar-indeterminate .p-progressbar-value:after{background:#002542}::ng-deep .p-progressbar-indeterminate .p-progressbar-value:before{background:#002542}::ng-deep .scroll-virtual{overflow-x:hidden}::ng-deep .scroll-virtual::-webkit-scrollbar{width:8px}::ng-deep .scroll-virtual::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .scroll-virtual::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .scroll-virtual:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .scroll-virtual::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.option-dropdown{background-color:#333;transition:all ease-in .2s}.option-dropdown:hover{background-color:#444}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: KvErrorComponent, selector: "kv-error", inputs: ["formControl", "hasError"] }, { kind: "directive", type: i5$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i10.Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }, { kind: "component", type: i7$1.ProgressBar, selector: "p-progressBar", inputs: ["value", "showValue", "styleClass", "style", "unit", "mode", "color"] }, { kind: "component", type: i11.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i12.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: KvTagsComponent, selector: "kv-tags", inputs: ["tags", "hover", "clickable"], outputs: ["onClickTag"] }] }); }
|
|
5971
5972
|
}
|
|
5972
5973
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvEditorComponent, decorators: [{
|
|
5973
5974
|
type: Component,
|
|
@@ -10861,7 +10862,7 @@ class KvTableViewerComponent {
|
|
|
10861
10862
|
return templates[templatename];
|
|
10862
10863
|
});
|
|
10863
10864
|
this.hasSelectedItems = computed(() => {
|
|
10864
|
-
return this.selectedItems()
|
|
10865
|
+
return this.selectedItems()?.length > 0 || this.selectedItem();
|
|
10865
10866
|
});
|
|
10866
10867
|
this.verifyItemSelecionado = computed(() => (rowData) => {
|
|
10867
10868
|
let isSelected;
|
|
@@ -10891,7 +10892,7 @@ class KvTableViewerComponent {
|
|
|
10891
10892
|
this.handleTableSize = computed(() => {
|
|
10892
10893
|
const selectedItems = this.selectedItems();
|
|
10893
10894
|
const selectedItem = this.selectedItem();
|
|
10894
|
-
if (selectedItems
|
|
10895
|
+
if (selectedItems?.length == 0 && !selectedItem)
|
|
10895
10896
|
return 'col-12';
|
|
10896
10897
|
else
|
|
10897
10898
|
return this.tableViewerSize();
|
|
@@ -10911,7 +10912,7 @@ class KvTableViewerComponent {
|
|
|
10911
10912
|
this.selectedItems.update((items) => items.filter(item => item !== rowData));
|
|
10912
10913
|
else
|
|
10913
10914
|
this.selectedItems.update((items) => [...items, rowData]);
|
|
10914
|
-
if (this.selectedItems()
|
|
10915
|
+
if (this.selectedItems()?.length === 1)
|
|
10915
10916
|
this.onClickRowItem.emit(this.selectedItems()[0]);
|
|
10916
10917
|
else
|
|
10917
10918
|
this.onClickRowItem.emit(rowData);
|
|
@@ -10929,7 +10930,7 @@ class KvTableViewerComponent {
|
|
|
10929
10930
|
return formatter.format(valor);
|
|
10930
10931
|
}
|
|
10931
10932
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTableViewerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10932
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTableViewerComponent, isStandalone: true, selector: "kv-table-viewer", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, actionsRow: { classPropertyName: "actionsRow", publicName: "actionsRow", isSignal: true, isRequired: false, transformFunction: null }, actionsHeader: { classPropertyName: "actionsHeader", publicName: "actionsHeader", isSignal: true, isRequired: false, transformFunction: null }, actionsLote: { classPropertyName: "actionsLote", publicName: "actionsLote", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, pageLinks: { classPropertyName: "pageLinks", publicName: "pageLinks", isSignal: true, isRequired: false, transformFunction: null }, currentPageReportTemplate: { classPropertyName: "currentPageReportTemplate", publicName: "currentPageReportTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectionPageOnly: { classPropertyName: "selectionPageOnly", publicName: "selectionPageOnly", isSignal: true, isRequired: false, transformFunction: null }, selectableTable: { classPropertyName: "selectableTable", publicName: "selectableTable", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, showHeaderTemplate: { classPropertyName: "showHeaderTemplate", publicName: "showHeaderTemplate", isSignal: true, isRequired: false, transformFunction: null }, tableViewerSize: { classPropertyName: "tableViewerSize", publicName: "tableViewerSize", isSignal: true, isRequired: false, transformFunction: null }, searchInput: { classPropertyName: "searchInput", publicName: "searchInput", isSignal: true, isRequired: false, transformFunction: null }, filterButton: { classPropertyName: "filterButton", publicName: "filterButton", isSignal: true, isRequired: false, transformFunction: null }, idName: { classPropertyName: "idName", publicName: "idName", isSignal: true, isRequired: false, transformFunction: null }, emptyTableImg: { classPropertyName: "emptyTableImg", publicName: "emptyTableImg", isSignal: true, isRequired: false, transformFunction: null }, _templates: { classPropertyName: "_templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onPageChange: "onPageChange", onClickRowItem: "onClickRowItem", onSelectItems: "onSelectItems", onSearch: "onSearch" }, queries: [{ propertyName: "templates", predicate: TemplateDirective, isSignal: true }], ngImport: i0, template: "<div\r\n class=\"h-full flex flex-row p-2 kv-table-viewer overflow-hidden {{\r\n data().length == 0 ? 'empty-table' : ''\r\n }}\"\r\n>\r\n <div\r\n class=\"h-full {{ handleTableSize() }} m-0 p-0 flex flex-column gap-2\"\r\n [style.transition]=\"'all 0.3s ease-in-out'\"\r\n >\r\n @if(showHeaderTemplate()) {\r\n <div>\r\n <ng-content select=\"[tableHeaderTemplate]\"> </ng-content>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-between flex-initial\"\r\n >\r\n <div class=\"flex flex-row align-items-center gap-2\">\r\n @if(searchInput()) {\r\n <input\r\n style=\"height: 1.875rem\"\r\n placeholder=\"Pesquisar...\"\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"searchValue\"\r\n class=\"text-xs\"\r\n />\r\n\r\n } @if(filterButton()) {\r\n <kv-button\r\n label=\"Filtrar\"\r\n icon=\"filter_alt\"\r\n severity=\"tertiary\"\r\n (onClick)=\"op.toggle($event)\"\r\n ></kv-button>\r\n }\r\n\r\n <p-overlayPanel #op>\r\n <ng-content select=\"[filtro]\"> </ng-content>\r\n </p-overlayPanel>\r\n </div>\r\n <div class=\"flex flex-row gap-2\">\r\n @if(actionsHeader()) { @for(action of actionsHeader(); track $index) {\r\n <kv-button\r\n [icon]=\"action?.icon || ''\"\r\n [label]=\"action?.label || ''\"\r\n [severity]=\"action['severity'] || 'tertiary'\"\r\n (onClick)=\"action?.command($event)\"\r\n [popupIcon]=\"false\"\r\n [items]=\"action.items || []\"\r\n [popup]=\"(action.items && action.items.length > 0) || false\"\r\n ></kv-button>\r\n } } @if(selectedItem()) {\r\n <kv-button\r\n [pTooltip]=\"'Recolher'\"\r\n icon=\"reorder\"\r\n severity=\"tertiary\"\r\n (onClick)=\"selectedItem.set(null)\"\r\n ></kv-button>\r\n }\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex-1 h-full overflow-hidden\">\r\n <p-table\r\n [value]=\"data()\"\r\n [lazy]=\"lazy()\"\r\n [selectionPageOnly]=\"selectionPageOnly()\"\r\n [columns]=\"columns()\"\r\n [paginator]=\"paginator()\"\r\n [rows]=\"rows()\"\r\n [totalRecords]=\"totalRecords()\"\r\n [loading]=\"loading()\"\r\n [pageLinks]=\"pageLinks()\"\r\n [first]=\"first()\"\r\n [scrollable]=\"scrollable()\"\r\n scrollHeight=\"flex\"\r\n [showCurrentPageReport]=\"true\"\r\n [currentPageReportTemplate]=\"currentPageReportTemplate()\"\r\n (onPage)=\"handlePageChange($event)\"\r\n [rowsPerPageOptions]=\"rowsPerPageOptions()\"\r\n [(selection)]=\"selectedItems\"\r\n styleClass=\"p-datatable-sm text-xs overflow-y-auto h-full flex flex-column h-full\"\r\n >\r\n @if(showHeader()) {\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr>\r\n @if(selectableTable()) {\r\n <th style=\"width: 4rem\"><p-tableHeaderCheckbox /></th>\r\n } @for (col of columns; track col.field) {\r\n <th [style]=\"{ width: col.width || 'auto' }\">{{ col.header }}</th>\r\n }\r\n </tr>\r\n </ng-template>\r\n }\r\n\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\r\n <tr\r\n class=\"cursor-pointer {{\r\n verifyItemSelecionado()(rowData) && 'bg-gray-100'\r\n }} hover:bg-gray-200\"\r\n >\r\n @if(selectableTable()) {\r\n <td><p-tableCheckbox [value]=\"rowData\" /></td>\r\n } @for (col of columns; track col.field) {\r\n <td (click)=\"rowSelect(rowData)\">\r\n @if(col?.template) {\r\n <div class=\"flex flex-row gap-2 align-items-center\">\r\n @if (getCustomTemplate()(col.template.name)) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"getCustomTemplate()(col.template.name)\"\r\n [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n />\r\n }\r\n </div>\r\n } @else if(col?.icon) {\r\n <span class=\"material-symbols-outlined text-lg\">\r\n {{ col.icon(rowData) }}\r\n </span>\r\n } @else if(col?.tag) {\r\n <kv-tags [tags]=\"[col.tag(rowData)]\" />\r\n } @else {\r\n {{ transformData()(col.pipe, rowData[col.field]) }}\r\n }\r\n </td>\r\n }\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template pTemplate=\"emptymessage\">\r\n <tr>\r\n <td [attr.colspan]=\"columns().length + 1\">\r\n <div\r\n class=\"w-full h-full flex align-items-center justify-content-center\"\r\n >\r\n <img [src]=\"emptyTableImg()\" class=\"h-10rem w-auto\" />\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"shadow-2 p-0 m-0 col selected-item-field ml-2 flex flex-column\"\r\n [@slideInOut]=\"hasSelectedItems() ? 'i.n' : 'out'\"\r\n [style.overflow]=\"'hidden'\"\r\n >\r\n @if(selectedItems().length > 1) {\r\n <actions-lote-field\r\n class=\"h-full\"\r\n [selectedItems]=\"selectedItems()\"\r\n [actionsLote]=\"actionsLote()\"\r\n />\r\n } @else if(selectedItems().length == 1 || selectedItem()) {\r\n <div class=\"bg-gray-100 w-full h-auto p-2 relative\">\r\n @if(actionsRow().length > 0) {\r\n <actions-row-menu [actionsRow]=\"actionsRow()\" />\r\n }\r\n <ng-content select=\"[selectedItemHeader]\"></ng-content>\r\n </div>\r\n <div class=\"p-2 overflow-y-auto h-full\">\r\n <ng-content select=\"[selectedItem]\"></ng-content>\r\n </div>\r\n }\r\n\r\n <!-- @else { Nenhum item selecionado } -->\r\n </div>\r\n</div>\r\n", styles: ["::ng-deep .kv-table-viewer .p-paginator .p-paginator-pages .p-paginator-page{font-size:.75rem;min-width:2rem;height:2rem}::ng-deep .kv-table-viewer .p-paginator .p-paginator-current{font-size:.75rem}::ng-deep .kv-table-viewer .p-inputwrapper .p-dropdown{margin:0;height:auto}::ng-deep .p-paginator-rpp-options .p-dropdown-panel .p-dropdown-items{padding:.25rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item{border-radius:.25rem;height:1.5rem;display:flex;align-items:center;justify-content:center}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-label{padding:.5rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-trigger{width:1.5rem}::ng-deep .p-paginator-bottom .p-link{min-width:2rem;height:2rem}::ng-deep .p-paginator{padding:0rem}::ng-deep .p-dropdown-label{font-size:.75rem}::ng-deep .p-datatable-wrapper::-webkit-scrollbar{width:6px}::ng-deep .p-datatable-wrapper::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-datatable-wrapper::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-datatable-wrapper:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-datatable-wrapper::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .empty-table .p-datatable-table{height:100%}::ng-deep .p-menu{padding:.25rem}::ng-deep .p-menu-list .p-menuitem .p-menuitem-content .p-menuitem-link{font-size:.75rem;padding:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i5$3.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i5$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i14.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i14.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i14.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: KvInputsModule }, { kind: "ngmodule", type: KvButtonModule }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["fullWidth", "type", "loading", "severity", "size", "icon", "iconPosition", "label", "disabled", "items", "popup", "popupIcon"], outputs: ["iconChange", "onClick"] }, { kind: "ngmodule", type: OverlayPanelModule }, { kind: "component", type: i11.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: ActionsLoteFieldComponent, selector: "actions-lote-field", inputs: ["selectedItems", "actionsLote"] }, { kind: "ngmodule", type: KvTagsModule }, { kind: "component", type: KvTagsComponent, selector: "kv-tags", inputs: ["tags", "hover"], outputs: ["onClickTag"] }, { kind: "ngmodule", type: TieredMenuModule }, { kind: "component", type: ActionsRowMenuComponent, selector: "actions-row-menu", inputs: ["actionsRow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
|
|
10933
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTableViewerComponent, isStandalone: true, selector: "kv-table-viewer", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, actionsRow: { classPropertyName: "actionsRow", publicName: "actionsRow", isSignal: true, isRequired: false, transformFunction: null }, actionsHeader: { classPropertyName: "actionsHeader", publicName: "actionsHeader", isSignal: true, isRequired: false, transformFunction: null }, actionsLote: { classPropertyName: "actionsLote", publicName: "actionsLote", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, pageLinks: { classPropertyName: "pageLinks", publicName: "pageLinks", isSignal: true, isRequired: false, transformFunction: null }, currentPageReportTemplate: { classPropertyName: "currentPageReportTemplate", publicName: "currentPageReportTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectionPageOnly: { classPropertyName: "selectionPageOnly", publicName: "selectionPageOnly", isSignal: true, isRequired: false, transformFunction: null }, selectableTable: { classPropertyName: "selectableTable", publicName: "selectableTable", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, showHeaderTemplate: { classPropertyName: "showHeaderTemplate", publicName: "showHeaderTemplate", isSignal: true, isRequired: false, transformFunction: null }, tableViewerSize: { classPropertyName: "tableViewerSize", publicName: "tableViewerSize", isSignal: true, isRequired: false, transformFunction: null }, searchInput: { classPropertyName: "searchInput", publicName: "searchInput", isSignal: true, isRequired: false, transformFunction: null }, filterButton: { classPropertyName: "filterButton", publicName: "filterButton", isSignal: true, isRequired: false, transformFunction: null }, idName: { classPropertyName: "idName", publicName: "idName", isSignal: true, isRequired: false, transformFunction: null }, emptyTableImg: { classPropertyName: "emptyTableImg", publicName: "emptyTableImg", isSignal: true, isRequired: false, transformFunction: null }, _templates: { classPropertyName: "_templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onPageChange: "onPageChange", onClickRowItem: "onClickRowItem", onSelectItems: "onSelectItems", onSearch: "onSearch" }, queries: [{ propertyName: "templates", predicate: TemplateDirective, isSignal: true }], ngImport: i0, template: "<div\r\n class=\"h-full flex flex-row p-2 kv-table-viewer overflow-hidden {{\r\n data().length == 0 ? 'empty-table' : ''\r\n }}\"\r\n>\r\n <div\r\n class=\"h-full {{ handleTableSize() }} m-0 p-0 flex flex-column gap-2\"\r\n [style.transition]=\"'all 0.3s ease-in-out'\"\r\n >\r\n @if(showHeaderTemplate()) {\r\n <div>\r\n <ng-content select=\"[tableHeaderTemplate]\"> </ng-content>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-between flex-initial\"\r\n >\r\n <div class=\"flex flex-row align-items-center gap-2\">\r\n @if(searchInput()) {\r\n <input\r\n style=\"height: 1.875rem\"\r\n placeholder=\"Pesquisar...\"\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"searchValue\"\r\n class=\"text-xs\"\r\n />\r\n\r\n } @if(filterButton()) {\r\n <kv-button\r\n label=\"Filtrar\"\r\n icon=\"filter_alt\"\r\n severity=\"tertiary\"\r\n (onClick)=\"op.toggle($event)\"\r\n ></kv-button>\r\n }\r\n\r\n <p-overlayPanel #op [dismissable]=\"false\" >\r\n <ng-content select=\"[filtro]\"> </ng-content>\r\n </p-overlayPanel>\r\n </div>\r\n <div class=\"flex flex-row gap-2\">\r\n @if(actionsHeader()) { @for(action of actionsHeader(); track $index) {\r\n <kv-button\r\n [icon]=\"action?.icon || ''\"\r\n [label]=\"action?.label || ''\"\r\n [severity]=\"action['severity'] || 'tertiary'\"\r\n (onClick)=\"action?.command($event)\"\r\n [popupIcon]=\"false\"\r\n [items]=\"action.items || []\"\r\n [popup]=\"(action.items && action.items.length > 0) || false\"\r\n ></kv-button>\r\n } } @if(selectedItem()) {\r\n <kv-button\r\n [pTooltip]=\"'Recolher'\"\r\n icon=\"reorder\"\r\n severity=\"tertiary\"\r\n (onClick)=\"selectedItem.set(null)\"\r\n ></kv-button>\r\n }\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex-1 h-full overflow-hidden\">\r\n <p-table\r\n [value]=\"data()\"\r\n [lazy]=\"lazy()\"\r\n [selectionPageOnly]=\"selectionPageOnly()\"\r\n [columns]=\"columns()\"\r\n [paginator]=\"paginator()\"\r\n [rows]=\"rows()\"\r\n [totalRecords]=\"totalRecords()\"\r\n [loading]=\"loading()\"\r\n [pageLinks]=\"pageLinks()\"\r\n [first]=\"first()\"\r\n [scrollable]=\"scrollable()\"\r\n scrollHeight=\"flex\"\r\n [showCurrentPageReport]=\"true\"\r\n [currentPageReportTemplate]=\"currentPageReportTemplate()\"\r\n (onPage)=\"handlePageChange($event)\"\r\n [rowsPerPageOptions]=\"rowsPerPageOptions()\"\r\n [(selection)]=\"selectedItems\"\r\n styleClass=\"p-datatable-sm text-xs overflow-y-auto h-full flex flex-column h-full\"\r\n >\r\n @if(showHeader()) {\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr>\r\n @if(selectableTable()) {\r\n <th style=\"width: 4rem\"><p-tableHeaderCheckbox /></th>\r\n } @for (col of columns; track col.field) {\r\n <th [style]=\"{ width: col.width || 'auto' }\">{{ col.header }}</th>\r\n }\r\n </tr>\r\n </ng-template>\r\n }\r\n\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\r\n <tr\r\n class=\"cursor-pointer {{\r\n verifyItemSelecionado()(rowData) && 'bg-gray-100'\r\n }} hover:bg-gray-200\"\r\n >\r\n @if(selectableTable()) {\r\n <td><p-tableCheckbox [value]=\"rowData\" /></td>\r\n } @for (col of columns; track col.field) {\r\n <td (click)=\"rowSelect(rowData)\">\r\n @if(col?.template) {\r\n <div class=\"flex flex-row gap-2 align-items-center\">\r\n @if (getCustomTemplate()(col.template.name)) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"getCustomTemplate()(col.template.name)\"\r\n [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n />\r\n }\r\n </div>\r\n } @else if(col?.icon) {\r\n <span class=\"material-symbols-outlined text-lg\">\r\n {{ col.icon(rowData) }}\r\n </span>\r\n } @else if(col?.tag) {\r\n <kv-tags [tags]=\"[col.tag(rowData)]\" />\r\n } @else {\r\n {{ transformData()(col.pipe, rowData[col.field]) }}\r\n }\r\n </td>\r\n }\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template pTemplate=\"emptymessage\">\r\n <tr>\r\n <td [attr.colspan]=\"columns().length + 1\">\r\n <div\r\n class=\"w-full h-full flex align-items-center justify-content-center\"\r\n >\r\n <img [src]=\"emptyTableImg()\" class=\"h-10rem w-auto\" />\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"shadow-2 p-0 m-0 col selected-item-field ml-2 flex flex-column\"\r\n [@slideInOut]=\"hasSelectedItems() ? 'i.n' : 'out'\"\r\n [style.overflow]=\"'hidden'\"\r\n >\r\n @if(selectedItems().length > 1) {\r\n <actions-lote-field\r\n class=\"h-full\"\r\n [selectedItems]=\"selectedItems()\"\r\n [actionsLote]=\"actionsLote()\"\r\n />\r\n } @else if(selectedItems().length == 1 || selectedItem()) {\r\n <div class=\"bg-gray-100 w-full h-auto p-2 relative\">\r\n @if(actionsRow().length > 0) {\r\n <actions-row-menu [actionsRow]=\"actionsRow()\" />\r\n }\r\n <ng-content select=\"[selectedItemHeader]\"></ng-content>\r\n </div>\r\n <div class=\"p-2 overflow-y-auto h-full\">\r\n <ng-content select=\"[selectedItem]\"></ng-content>\r\n </div>\r\n }\r\n\r\n <!-- @else { Nenhum item selecionado } -->\r\n </div>\r\n</div>\r\n", styles: ["::ng-deep .kv-table-viewer .p-paginator .p-paginator-pages .p-paginator-page{font-size:.75rem;min-width:2rem;height:2rem}::ng-deep .kv-table-viewer .p-paginator .p-paginator-current{font-size:.75rem}::ng-deep .kv-table-viewer .p-inputwrapper .p-dropdown{margin:0;height:auto}::ng-deep .p-paginator-rpp-options .p-dropdown-panel .p-dropdown-items{padding:.25rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item{border-radius:.25rem;height:1.5rem;display:flex;align-items:center;justify-content:center}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-label{padding:.5rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-trigger{width:1.5rem}::ng-deep .p-paginator-bottom .p-link{min-width:2rem;height:2rem}::ng-deep .p-paginator{padding:0rem}::ng-deep .p-dropdown-label{font-size:.75rem}::ng-deep .p-datatable-wrapper::-webkit-scrollbar{width:6px}::ng-deep .p-datatable-wrapper::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-datatable-wrapper::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-datatable-wrapper:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-datatable-wrapper::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .empty-table .p-datatable-table{height:100%}::ng-deep .p-menu{padding:.25rem}::ng-deep .p-menu-list .p-menuitem .p-menuitem-content .p-menuitem-link{font-size:.75rem;padding:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i5$3.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i5$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i14.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i14.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i14.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: KvInputsModule }, { kind: "ngmodule", type: KvButtonModule }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["fullWidth", "type", "loading", "severity", "size", "icon", "iconPosition", "label", "disabled", "items", "popup", "popupIcon"], outputs: ["iconChange", "onClick"] }, { kind: "ngmodule", type: OverlayPanelModule }, { kind: "component", type: i11.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: ActionsLoteFieldComponent, selector: "actions-lote-field", inputs: ["selectedItems", "actionsLote"] }, { kind: "ngmodule", type: KvTagsModule }, { kind: "component", type: KvTagsComponent, selector: "kv-tags", inputs: ["tags", "hover", "clickable"], outputs: ["onClickTag"] }, { kind: "ngmodule", type: TieredMenuModule }, { kind: "component", type: ActionsRowMenuComponent, selector: "actions-row-menu", inputs: ["actionsRow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
|
|
10933
10934
|
trigger('slideInOut', [
|
|
10934
10935
|
state('in', style({
|
|
10935
10936
|
width: '*',
|
|
@@ -10971,7 +10972,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
|
|
|
10971
10972
|
animate('200ms ease-in-out')
|
|
10972
10973
|
])
|
|
10973
10974
|
])
|
|
10974
|
-
], template: "<div\r\n class=\"h-full flex flex-row p-2 kv-table-viewer overflow-hidden {{\r\n data().length == 0 ? 'empty-table' : ''\r\n }}\"\r\n>\r\n <div\r\n class=\"h-full {{ handleTableSize() }} m-0 p-0 flex flex-column gap-2\"\r\n [style.transition]=\"'all 0.3s ease-in-out'\"\r\n >\r\n @if(showHeaderTemplate()) {\r\n <div>\r\n <ng-content select=\"[tableHeaderTemplate]\"> </ng-content>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-between flex-initial\"\r\n >\r\n <div class=\"flex flex-row align-items-center gap-2\">\r\n @if(searchInput()) {\r\n <input\r\n style=\"height: 1.875rem\"\r\n placeholder=\"Pesquisar...\"\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"searchValue\"\r\n class=\"text-xs\"\r\n />\r\n\r\n } @if(filterButton()) {\r\n <kv-button\r\n label=\"Filtrar\"\r\n icon=\"filter_alt\"\r\n severity=\"tertiary\"\r\n (onClick)=\"op.toggle($event)\"\r\n ></kv-button>\r\n }\r\n\r\n <p-overlayPanel #op>\r\n <ng-content select=\"[filtro]\"> </ng-content>\r\n </p-overlayPanel>\r\n </div>\r\n <div class=\"flex flex-row gap-2\">\r\n @if(actionsHeader()) { @for(action of actionsHeader(); track $index) {\r\n <kv-button\r\n [icon]=\"action?.icon || ''\"\r\n [label]=\"action?.label || ''\"\r\n [severity]=\"action['severity'] || 'tertiary'\"\r\n (onClick)=\"action?.command($event)\"\r\n [popupIcon]=\"false\"\r\n [items]=\"action.items || []\"\r\n [popup]=\"(action.items && action.items.length > 0) || false\"\r\n ></kv-button>\r\n } } @if(selectedItem()) {\r\n <kv-button\r\n [pTooltip]=\"'Recolher'\"\r\n icon=\"reorder\"\r\n severity=\"tertiary\"\r\n (onClick)=\"selectedItem.set(null)\"\r\n ></kv-button>\r\n }\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex-1 h-full overflow-hidden\">\r\n <p-table\r\n [value]=\"data()\"\r\n [lazy]=\"lazy()\"\r\n [selectionPageOnly]=\"selectionPageOnly()\"\r\n [columns]=\"columns()\"\r\n [paginator]=\"paginator()\"\r\n [rows]=\"rows()\"\r\n [totalRecords]=\"totalRecords()\"\r\n [loading]=\"loading()\"\r\n [pageLinks]=\"pageLinks()\"\r\n [first]=\"first()\"\r\n [scrollable]=\"scrollable()\"\r\n scrollHeight=\"flex\"\r\n [showCurrentPageReport]=\"true\"\r\n [currentPageReportTemplate]=\"currentPageReportTemplate()\"\r\n (onPage)=\"handlePageChange($event)\"\r\n [rowsPerPageOptions]=\"rowsPerPageOptions()\"\r\n [(selection)]=\"selectedItems\"\r\n styleClass=\"p-datatable-sm text-xs overflow-y-auto h-full flex flex-column h-full\"\r\n >\r\n @if(showHeader()) {\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr>\r\n @if(selectableTable()) {\r\n <th style=\"width: 4rem\"><p-tableHeaderCheckbox /></th>\r\n } @for (col of columns; track col.field) {\r\n <th [style]=\"{ width: col.width || 'auto' }\">{{ col.header }}</th>\r\n }\r\n </tr>\r\n </ng-template>\r\n }\r\n\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\r\n <tr\r\n class=\"cursor-pointer {{\r\n verifyItemSelecionado()(rowData) && 'bg-gray-100'\r\n }} hover:bg-gray-200\"\r\n >\r\n @if(selectableTable()) {\r\n <td><p-tableCheckbox [value]=\"rowData\" /></td>\r\n } @for (col of columns; track col.field) {\r\n <td (click)=\"rowSelect(rowData)\">\r\n @if(col?.template) {\r\n <div class=\"flex flex-row gap-2 align-items-center\">\r\n @if (getCustomTemplate()(col.template.name)) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"getCustomTemplate()(col.template.name)\"\r\n [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n />\r\n }\r\n </div>\r\n } @else if(col?.icon) {\r\n <span class=\"material-symbols-outlined text-lg\">\r\n {{ col.icon(rowData) }}\r\n </span>\r\n } @else if(col?.tag) {\r\n <kv-tags [tags]=\"[col.tag(rowData)]\" />\r\n } @else {\r\n {{ transformData()(col.pipe, rowData[col.field]) }}\r\n }\r\n </td>\r\n }\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template pTemplate=\"emptymessage\">\r\n <tr>\r\n <td [attr.colspan]=\"columns().length + 1\">\r\n <div\r\n class=\"w-full h-full flex align-items-center justify-content-center\"\r\n >\r\n <img [src]=\"emptyTableImg()\" class=\"h-10rem w-auto\" />\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"shadow-2 p-0 m-0 col selected-item-field ml-2 flex flex-column\"\r\n [@slideInOut]=\"hasSelectedItems() ? 'i.n' : 'out'\"\r\n [style.overflow]=\"'hidden'\"\r\n >\r\n @if(selectedItems().length > 1) {\r\n <actions-lote-field\r\n class=\"h-full\"\r\n [selectedItems]=\"selectedItems()\"\r\n [actionsLote]=\"actionsLote()\"\r\n />\r\n } @else if(selectedItems().length == 1 || selectedItem()) {\r\n <div class=\"bg-gray-100 w-full h-auto p-2 relative\">\r\n @if(actionsRow().length > 0) {\r\n <actions-row-menu [actionsRow]=\"actionsRow()\" />\r\n }\r\n <ng-content select=\"[selectedItemHeader]\"></ng-content>\r\n </div>\r\n <div class=\"p-2 overflow-y-auto h-full\">\r\n <ng-content select=\"[selectedItem]\"></ng-content>\r\n </div>\r\n }\r\n\r\n <!-- @else { Nenhum item selecionado } -->\r\n </div>\r\n</div>\r\n", styles: ["::ng-deep .kv-table-viewer .p-paginator .p-paginator-pages .p-paginator-page{font-size:.75rem;min-width:2rem;height:2rem}::ng-deep .kv-table-viewer .p-paginator .p-paginator-current{font-size:.75rem}::ng-deep .kv-table-viewer .p-inputwrapper .p-dropdown{margin:0;height:auto}::ng-deep .p-paginator-rpp-options .p-dropdown-panel .p-dropdown-items{padding:.25rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item{border-radius:.25rem;height:1.5rem;display:flex;align-items:center;justify-content:center}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-label{padding:.5rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-trigger{width:1.5rem}::ng-deep .p-paginator-bottom .p-link{min-width:2rem;height:2rem}::ng-deep .p-paginator{padding:0rem}::ng-deep .p-dropdown-label{font-size:.75rem}::ng-deep .p-datatable-wrapper::-webkit-scrollbar{width:6px}::ng-deep .p-datatable-wrapper::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-datatable-wrapper::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-datatable-wrapper:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-datatable-wrapper::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .empty-table .p-datatable-table{height:100%}::ng-deep .p-menu{padding:.25rem}::ng-deep .p-menu-list .p-menuitem .p-menuitem-content .p-menuitem-link{font-size:.75rem;padding:.5rem}\n"] }]
|
|
10975
|
+
], template: "<div\r\n class=\"h-full flex flex-row p-2 kv-table-viewer overflow-hidden {{\r\n data().length == 0 ? 'empty-table' : ''\r\n }}\"\r\n>\r\n <div\r\n class=\"h-full {{ handleTableSize() }} m-0 p-0 flex flex-column gap-2\"\r\n [style.transition]=\"'all 0.3s ease-in-out'\"\r\n >\r\n @if(showHeaderTemplate()) {\r\n <div>\r\n <ng-content select=\"[tableHeaderTemplate]\"> </ng-content>\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-between flex-initial\"\r\n >\r\n <div class=\"flex flex-row align-items-center gap-2\">\r\n @if(searchInput()) {\r\n <input\r\n style=\"height: 1.875rem\"\r\n placeholder=\"Pesquisar...\"\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"searchValue\"\r\n class=\"text-xs\"\r\n />\r\n\r\n } @if(filterButton()) {\r\n <kv-button\r\n label=\"Filtrar\"\r\n icon=\"filter_alt\"\r\n severity=\"tertiary\"\r\n (onClick)=\"op.toggle($event)\"\r\n ></kv-button>\r\n }\r\n\r\n <p-overlayPanel #op [dismissable]=\"false\" >\r\n <ng-content select=\"[filtro]\"> </ng-content>\r\n </p-overlayPanel>\r\n </div>\r\n <div class=\"flex flex-row gap-2\">\r\n @if(actionsHeader()) { @for(action of actionsHeader(); track $index) {\r\n <kv-button\r\n [icon]=\"action?.icon || ''\"\r\n [label]=\"action?.label || ''\"\r\n [severity]=\"action['severity'] || 'tertiary'\"\r\n (onClick)=\"action?.command($event)\"\r\n [popupIcon]=\"false\"\r\n [items]=\"action.items || []\"\r\n [popup]=\"(action.items && action.items.length > 0) || false\"\r\n ></kv-button>\r\n } } @if(selectedItem()) {\r\n <kv-button\r\n [pTooltip]=\"'Recolher'\"\r\n icon=\"reorder\"\r\n severity=\"tertiary\"\r\n (onClick)=\"selectedItem.set(null)\"\r\n ></kv-button>\r\n }\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex-1 h-full overflow-hidden\">\r\n <p-table\r\n [value]=\"data()\"\r\n [lazy]=\"lazy()\"\r\n [selectionPageOnly]=\"selectionPageOnly()\"\r\n [columns]=\"columns()\"\r\n [paginator]=\"paginator()\"\r\n [rows]=\"rows()\"\r\n [totalRecords]=\"totalRecords()\"\r\n [loading]=\"loading()\"\r\n [pageLinks]=\"pageLinks()\"\r\n [first]=\"first()\"\r\n [scrollable]=\"scrollable()\"\r\n scrollHeight=\"flex\"\r\n [showCurrentPageReport]=\"true\"\r\n [currentPageReportTemplate]=\"currentPageReportTemplate()\"\r\n (onPage)=\"handlePageChange($event)\"\r\n [rowsPerPageOptions]=\"rowsPerPageOptions()\"\r\n [(selection)]=\"selectedItems\"\r\n styleClass=\"p-datatable-sm text-xs overflow-y-auto h-full flex flex-column h-full\"\r\n >\r\n @if(showHeader()) {\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr>\r\n @if(selectableTable()) {\r\n <th style=\"width: 4rem\"><p-tableHeaderCheckbox /></th>\r\n } @for (col of columns; track col.field) {\r\n <th [style]=\"{ width: col.width || 'auto' }\">{{ col.header }}</th>\r\n }\r\n </tr>\r\n </ng-template>\r\n }\r\n\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\r\n <tr\r\n class=\"cursor-pointer {{\r\n verifyItemSelecionado()(rowData) && 'bg-gray-100'\r\n }} hover:bg-gray-200\"\r\n >\r\n @if(selectableTable()) {\r\n <td><p-tableCheckbox [value]=\"rowData\" /></td>\r\n } @for (col of columns; track col.field) {\r\n <td (click)=\"rowSelect(rowData)\">\r\n @if(col?.template) {\r\n <div class=\"flex flex-row gap-2 align-items-center\">\r\n @if (getCustomTemplate()(col.template.name)) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"getCustomTemplate()(col.template.name)\"\r\n [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n />\r\n }\r\n </div>\r\n } @else if(col?.icon) {\r\n <span class=\"material-symbols-outlined text-lg\">\r\n {{ col.icon(rowData) }}\r\n </span>\r\n } @else if(col?.tag) {\r\n <kv-tags [tags]=\"[col.tag(rowData)]\" />\r\n } @else {\r\n {{ transformData()(col.pipe, rowData[col.field]) }}\r\n }\r\n </td>\r\n }\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template pTemplate=\"emptymessage\">\r\n <tr>\r\n <td [attr.colspan]=\"columns().length + 1\">\r\n <div\r\n class=\"w-full h-full flex align-items-center justify-content-center\"\r\n >\r\n <img [src]=\"emptyTableImg()\" class=\"h-10rem w-auto\" />\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"shadow-2 p-0 m-0 col selected-item-field ml-2 flex flex-column\"\r\n [@slideInOut]=\"hasSelectedItems() ? 'i.n' : 'out'\"\r\n [style.overflow]=\"'hidden'\"\r\n >\r\n @if(selectedItems().length > 1) {\r\n <actions-lote-field\r\n class=\"h-full\"\r\n [selectedItems]=\"selectedItems()\"\r\n [actionsLote]=\"actionsLote()\"\r\n />\r\n } @else if(selectedItems().length == 1 || selectedItem()) {\r\n <div class=\"bg-gray-100 w-full h-auto p-2 relative\">\r\n @if(actionsRow().length > 0) {\r\n <actions-row-menu [actionsRow]=\"actionsRow()\" />\r\n }\r\n <ng-content select=\"[selectedItemHeader]\"></ng-content>\r\n </div>\r\n <div class=\"p-2 overflow-y-auto h-full\">\r\n <ng-content select=\"[selectedItem]\"></ng-content>\r\n </div>\r\n }\r\n\r\n <!-- @else { Nenhum item selecionado } -->\r\n </div>\r\n</div>\r\n", styles: ["::ng-deep .kv-table-viewer .p-paginator .p-paginator-pages .p-paginator-page{font-size:.75rem;min-width:2rem;height:2rem}::ng-deep .kv-table-viewer .p-paginator .p-paginator-current{font-size:.75rem}::ng-deep .kv-table-viewer .p-inputwrapper .p-dropdown{margin:0;height:auto}::ng-deep .p-paginator-rpp-options .p-dropdown-panel .p-dropdown-items{padding:.25rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item{border-radius:.25rem;height:1.5rem;display:flex;align-items:center;justify-content:center}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-label{padding:.5rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-trigger{width:1.5rem}::ng-deep .p-paginator-bottom .p-link{min-width:2rem;height:2rem}::ng-deep .p-paginator{padding:0rem}::ng-deep .p-dropdown-label{font-size:.75rem}::ng-deep .p-datatable-wrapper::-webkit-scrollbar{width:6px}::ng-deep .p-datatable-wrapper::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-datatable-wrapper::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-datatable-wrapper:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-datatable-wrapper::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .empty-table .p-datatable-table{height:100%}::ng-deep .p-menu{padding:.25rem}::ng-deep .p-menu-list .p-menuitem .p-menuitem-content .p-menuitem-link{font-size:.75rem;padding:.5rem}\n"] }]
|
|
10975
10976
|
}], ctorParameters: () => [] });
|
|
10976
10977
|
|
|
10977
10978
|
class KvPageStepperComponent {
|