sapenlinea-components 0.0.36 → 0.0.38
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -862,6 +862,9 @@ class DateTimeFilter {
|
|
|
862
862
|
onEnter(event) {
|
|
863
863
|
if (event.key !== 'Enter')
|
|
864
864
|
return;
|
|
865
|
+
if (this.isOpen()) {
|
|
866
|
+
this.close();
|
|
867
|
+
}
|
|
865
868
|
event.preventDefault();
|
|
866
869
|
this.enterPressed.emit();
|
|
867
870
|
}
|
|
@@ -2742,11 +2745,11 @@ class SideCardDetail {
|
|
|
2742
2745
|
height <= 460;
|
|
2743
2746
|
}
|
|
2744
2747
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SideCardDetail, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2745
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: SideCardDetail, isStandalone: true, selector: "lib-side-card-detail", inputs: { isFloating: "isFloating", title: "title", subtitle: "subtitle", statusValue: "statusValue", sections: "sections" }, outputs: { btnClickIcon: "btnClickIcon", statusChange: "statusChange", tabChange: "tabChange" }, viewQueries: [{ propertyName: "wrapper", first: true, predicate: ["SideCard"], descendants: true, static: true }], ngImport: i0, template: "<div #SideCard class=\"side-card-wrapper\">\r\n <div class=\"side-card\" [class.floating]=\"isFloating\" [class.compact]=\"isCompact\">\r\n <div class=\"element-header\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"28\" height=\"28\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-arrow-left\" (click)=\"buttonClickIcon('back')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M5 12l12 0\" />\r\n <path d=\"M5 12l4 5\" />\r\n <path d=\"M5 12l4 -5\" />\r\n </svg>\r\n\r\n <div class=\"text-container\">\r\n <span class=\"title\"> {{ title }} </span>\r\n <span class=\"subtitle\"> {{ subtitle }} </span>\r\n <div class=\"container-chip\">\r\n <span #statusChip class=\"status-chip\" [ngClass]=\"statusClass\">\r\n {{ statusLabel }}\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"right-icons\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\r\n class=\"icon icon-tabler icons-tabler-filled icon-tabler-current-location\"\r\n (click)=\"buttonClickIcon('location')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path\r\n d=\"M12 1a1 1 0 0 1 1 1v1.055a9.004 9.004 0 0 1 7.946 7.945h1.054a1 1 0 0 1 0 2h-1.055a9.004 9.004 0 0 1 -7.944 7.945l-.001 1.055a1 1 0 0 1 -2 0v-1.055a9.004 9.004 0 0 1 -7.945 -7.944l-1.055 -.001a1 1 0 0 1 0 -2h1.055a9.004 9.004 0 0 1 7.945 -7.945v-1.055a1 1 0 0 1 1 -1m0 4a7 7 0 1 0 0 14a7 7 0 0 0 0 -14m0 3a4 4 0 1 1 -4 4l.005 -.2a4 4 0 0 1 3.995 -3.8\" />\r\n </svg>\r\n\r\n <!-- message + modal -->\r\n <div class=\"message-icon-wrapper\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-message-circle\"\r\n (click)=\"buttonClickIcon('message')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path\r\n d=\"M3 20l1.3 -3.9c-2.324 -3.437 -1.426 -7.872 2.1 -10.374c3.526 -2.501 8.59 -2.296 11.845 .48c3.255 2.777 3.695 7.266 1.029 10.501c-2.666 3.235 -7.615 4.215 -11.574 2.293l-4.7 1\" />\r\n </svg>\r\n\r\n <!-- @if (showMessageModal) {\r\n <div class=\"message-modal-anchor\">\r\n <lib-notification-modal />\r\n </div>\r\n } -->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"side-tabs\">\r\n <div class=\"tab\" [class.active]=\"activeTab === 'principal'\" (click)=\"setTab('principal')\">\r\n Principal\r\n </div>\r\n\r\n <div class=\"tab\" [class.active]=\"activeTab === 'historial'\" (click)=\"setTab('historial')\">\r\n Historial\r\n </div>\r\n\r\n <div class=\"tab-indicator\" [style.left]=\"getIndicatorLeft()\"></div>\r\n </div>\r\n\r\n @for (section of sections; track section.title) {\r\n <div class=\"element-section\">\r\n <h3>{{ section.title }}</h3>\r\n\r\n <div class=\"element-content\">\r\n @if (section.items?.length) { @for (item of section.items; track\r\n item.
|
|
2748
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: SideCardDetail, isStandalone: true, selector: "lib-side-card-detail", inputs: { isFloating: "isFloating", title: "title", subtitle: "subtitle", statusValue: "statusValue", sections: "sections" }, outputs: { btnClickIcon: "btnClickIcon", statusChange: "statusChange", tabChange: "tabChange" }, viewQueries: [{ propertyName: "wrapper", first: true, predicate: ["SideCard"], descendants: true, static: true }], ngImport: i0, template: "<div #SideCard class=\"side-card-wrapper\">\r\n <div class=\"side-card\" [class.floating]=\"isFloating\" [class.compact]=\"isCompact\">\r\n <div class=\"element-header\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"28\" height=\"28\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-arrow-left\" (click)=\"buttonClickIcon('back')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M5 12l12 0\" />\r\n <path d=\"M5 12l4 5\" />\r\n <path d=\"M5 12l4 -5\" />\r\n </svg>\r\n\r\n <div class=\"text-container\">\r\n <span class=\"title\"> {{ title }} </span>\r\n <span class=\"subtitle\"> {{ subtitle }} </span>\r\n <div class=\"container-chip\">\r\n <span #statusChip class=\"status-chip\" [ngClass]=\"statusClass\">\r\n {{ statusLabel }}\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"right-icons\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\r\n class=\"icon icon-tabler icons-tabler-filled icon-tabler-current-location\"\r\n (click)=\"buttonClickIcon('location')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path\r\n d=\"M12 1a1 1 0 0 1 1 1v1.055a9.004 9.004 0 0 1 7.946 7.945h1.054a1 1 0 0 1 0 2h-1.055a9.004 9.004 0 0 1 -7.944 7.945l-.001 1.055a1 1 0 0 1 -2 0v-1.055a9.004 9.004 0 0 1 -7.945 -7.944l-1.055 -.001a1 1 0 0 1 0 -2h1.055a9.004 9.004 0 0 1 7.945 -7.945v-1.055a1 1 0 0 1 1 -1m0 4a7 7 0 1 0 0 14a7 7 0 0 0 0 -14m0 3a4 4 0 1 1 -4 4l.005 -.2a4 4 0 0 1 3.995 -3.8\" />\r\n </svg>\r\n\r\n <!-- message + modal -->\r\n <div class=\"message-icon-wrapper\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-message-circle\"\r\n (click)=\"buttonClickIcon('message')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path\r\n d=\"M3 20l1.3 -3.9c-2.324 -3.437 -1.426 -7.872 2.1 -10.374c3.526 -2.501 8.59 -2.296 11.845 .48c3.255 2.777 3.695 7.266 1.029 10.501c-2.666 3.235 -7.615 4.215 -11.574 2.293l-4.7 1\" />\r\n </svg>\r\n\r\n <!-- @if (showMessageModal) {\r\n <div class=\"message-modal-anchor\">\r\n <lib-notification-modal />\r\n </div>\r\n } -->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"side-tabs\">\r\n <div class=\"tab\" [class.active]=\"activeTab === 'principal'\" (click)=\"setTab('principal')\">\r\n Principal\r\n </div>\r\n\r\n <div class=\"tab\" [class.active]=\"activeTab === 'historial'\" (click)=\"setTab('historial')\">\r\n Historial\r\n </div>\r\n\r\n <div class=\"tab-indicator\" [style.left]=\"getIndicatorLeft()\"></div>\r\n </div>\r\n\r\n @for (section of sections; track section.title) {\r\n <div class=\"element-section\">\r\n <h3>{{ section.title }}</h3>\r\n\r\n <div class=\"element-content\">\r\n @if (section.items?.length) { @for (item of section.items; track\r\n item.key) {\r\n <div class=\"element-item\">\r\n <span class=\"label\">{{ item.label }}</span>\r\n <span class=\"value\">{{ isDateValue(item.value) ? getRelativeTime(item.value) : item.value }}</span>\r\n </div>\r\n } }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: [".side-card-wrapper{position:relative;width:100%;height:100%}.side-card{width:354px;max-width:368px;min-width:240px;height:auto;max-height:90vh;background:#ebe8d6b0;border-radius:8px;padding:16px;font-size:16px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 4px 12px #00000026;z-index:10;overflow-y:auto;display:flex;flex-direction:column;gap:16px;box-sizing:border-box}.side-card.floating{position:absolute;top:16px;right:16px}.button-group{display:flex;gap:8px;justify-content:center;margin-bottom:12px}.btn-type{flex:1;padding:10px 12px;background-color:transparent;color:#61661f;border:2px solid #61661f;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer}.btn-type:hover{background-color:#dee58f;color:#61661f;border:none}.btn-type:active{background-color:#61661f;color:#fff;border-color:none}.active{background-color:#596300;color:#fff;border-color:none}.element-header{width:100%;display:flex;gap:12px}.text-container{flex:1;display:flex;flex-direction:column;gap:8px}.title{font-size:2rem;font-weight:700;text-transform:capitalize;max-lines:2}.subtitle{font-size:1.5rem;font-weight:300;color:#454733;text-transform:capitalize}.right-icons{display:flex;flex-direction:column;gap:8px}.icon{color:#1c1c1c;cursor:pointer}.icon.icon-tabler-current-location{color:#d3d936}.icon.icon-tabler-current-location:hover{color:#d3d93666}.status-chip{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.375rem .75rem;border-radius:6px;font-size:1.2rem;font-weight:600;white-space:nowrap;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;margin-bottom:12px}.status-chip-active{background-color:#78db5c;color:#0f5e00}.status-chip-inactive{background-color:#a60321;color:#fafae8}.icon:hover{color:#1c1c1c66}.side-tabs{position:relative;display:flex;width:100%;border-bottom:2px solid #C7C7AD;margin-bottom:8px}.tab{flex:1;text-align:center;padding:12px 0;font-size:1.4rem;font-weight:500;cursor:pointer;color:#454733;transition:color .3s ease;text-transform:uppercase}.tab.active{background-color:transparent;color:#596300;font-weight:600}.tab:hover{color:#6a7500}.tab-indicator{position:absolute;bottom:-2px;left:0;width:50%;height:4px;background-color:#596300;border-radius:4px 4px 0 0;transition:left .3s ease}.element-section{display:flex;flex-direction:column;gap:8px}.element-section h3{margin:0;font-size:1.6rem;font-weight:500;color:#1c1c12;text-transform:uppercase}.element-content{display:flex;flex-direction:column;gap:10px;padding:10px 0;background-color:transparent}.element-item{display:flex;justify-content:space-between}.element-item .label,.element-item .value{font-size:1.5rem;color:#454733;font-weight:300;text-transform:uppercase}.side-card.compact{font-size:13px;padding:12px;gap:10px}.side-card.compact *{margin-bottom:0}.side-card.compact{gap:10px}.side-card.compact .element-section,.side-card.compact .element-content{gap:6px}.side-card.compact .title{font-size:1.6rem;line-height:1.2}.side-card.compact .subtitle{font-size:1.3rem}.side-card.compact .icon{width:22px;height:22px}.side-card.compact svg.icon{width:22px;height:22px}.side-card.compact h3{font-size:1.2rem}.side-card.compact .label,.side-card.compact .value{font-size:1.1rem}.side-card.compact .status-chip{font-size:.9rem;padding:.5rem .8rem;margin-bottom:6px}.side-card.compact .tab{padding:8px 0;font-size:1.1rem}.side-card.compact .tab-indicator{height:3px}.side-card.compact .element-header{gap:8px}.side-card.compact .right-icons{gap:4px}.side-card.compact{max-width:312px;max-height:460px;overflow-y:auto}.side-card.floating.compact{top:9px;right:9px}.message-icon-wrapper{position:relative;display:inline-flex}.message-modal-anchor{position:absolute;top:36px;right:0;z-index:20}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
2746
2749
|
}
|
|
2747
2750
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SideCardDetail, decorators: [{
|
|
2748
2751
|
type: Component,
|
|
2749
|
-
args: [{ selector: 'lib-side-card-detail', imports: [CommonModule], template: "<div #SideCard class=\"side-card-wrapper\">\r\n <div class=\"side-card\" [class.floating]=\"isFloating\" [class.compact]=\"isCompact\">\r\n <div class=\"element-header\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"28\" height=\"28\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-arrow-left\" (click)=\"buttonClickIcon('back')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M5 12l12 0\" />\r\n <path d=\"M5 12l4 5\" />\r\n <path d=\"M5 12l4 -5\" />\r\n </svg>\r\n\r\n <div class=\"text-container\">\r\n <span class=\"title\"> {{ title }} </span>\r\n <span class=\"subtitle\"> {{ subtitle }} </span>\r\n <div class=\"container-chip\">\r\n <span #statusChip class=\"status-chip\" [ngClass]=\"statusClass\">\r\n {{ statusLabel }}\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"right-icons\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\r\n class=\"icon icon-tabler icons-tabler-filled icon-tabler-current-location\"\r\n (click)=\"buttonClickIcon('location')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path\r\n d=\"M12 1a1 1 0 0 1 1 1v1.055a9.004 9.004 0 0 1 7.946 7.945h1.054a1 1 0 0 1 0 2h-1.055a9.004 9.004 0 0 1 -7.944 7.945l-.001 1.055a1 1 0 0 1 -2 0v-1.055a9.004 9.004 0 0 1 -7.945 -7.944l-1.055 -.001a1 1 0 0 1 0 -2h1.055a9.004 9.004 0 0 1 7.945 -7.945v-1.055a1 1 0 0 1 1 -1m0 4a7 7 0 1 0 0 14a7 7 0 0 0 0 -14m0 3a4 4 0 1 1 -4 4l.005 -.2a4 4 0 0 1 3.995 -3.8\" />\r\n </svg>\r\n\r\n <!-- message + modal -->\r\n <div class=\"message-icon-wrapper\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-message-circle\"\r\n (click)=\"buttonClickIcon('message')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path\r\n d=\"M3 20l1.3 -3.9c-2.324 -3.437 -1.426 -7.872 2.1 -10.374c3.526 -2.501 8.59 -2.296 11.845 .48c3.255 2.777 3.695 7.266 1.029 10.501c-2.666 3.235 -7.615 4.215 -11.574 2.293l-4.7 1\" />\r\n </svg>\r\n\r\n <!-- @if (showMessageModal) {\r\n <div class=\"message-modal-anchor\">\r\n <lib-notification-modal />\r\n </div>\r\n } -->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"side-tabs\">\r\n <div class=\"tab\" [class.active]=\"activeTab === 'principal'\" (click)=\"setTab('principal')\">\r\n Principal\r\n </div>\r\n\r\n <div class=\"tab\" [class.active]=\"activeTab === 'historial'\" (click)=\"setTab('historial')\">\r\n Historial\r\n </div>\r\n\r\n <div class=\"tab-indicator\" [style.left]=\"getIndicatorLeft()\"></div>\r\n </div>\r\n\r\n @for (section of sections; track section.title) {\r\n <div class=\"element-section\">\r\n <h3>{{ section.title }}</h3>\r\n\r\n <div class=\"element-content\">\r\n @if (section.items?.length) { @for (item of section.items; track\r\n item.
|
|
2752
|
+
args: [{ selector: 'lib-side-card-detail', imports: [CommonModule], template: "<div #SideCard class=\"side-card-wrapper\">\r\n <div class=\"side-card\" [class.floating]=\"isFloating\" [class.compact]=\"isCompact\">\r\n <div class=\"element-header\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"28\" height=\"28\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-arrow-left\" (click)=\"buttonClickIcon('back')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M5 12l12 0\" />\r\n <path d=\"M5 12l4 5\" />\r\n <path d=\"M5 12l4 -5\" />\r\n </svg>\r\n\r\n <div class=\"text-container\">\r\n <span class=\"title\"> {{ title }} </span>\r\n <span class=\"subtitle\"> {{ subtitle }} </span>\r\n <div class=\"container-chip\">\r\n <span #statusChip class=\"status-chip\" [ngClass]=\"statusClass\">\r\n {{ statusLabel }}\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"right-icons\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"currentColor\"\r\n class=\"icon icon-tabler icons-tabler-filled icon-tabler-current-location\"\r\n (click)=\"buttonClickIcon('location')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path\r\n d=\"M12 1a1 1 0 0 1 1 1v1.055a9.004 9.004 0 0 1 7.946 7.945h1.054a1 1 0 0 1 0 2h-1.055a9.004 9.004 0 0 1 -7.944 7.945l-.001 1.055a1 1 0 0 1 -2 0v-1.055a9.004 9.004 0 0 1 -7.945 -7.944l-1.055 -.001a1 1 0 0 1 0 -2h1.055a9.004 9.004 0 0 1 7.945 -7.945v-1.055a1 1 0 0 1 1 -1m0 4a7 7 0 1 0 0 14a7 7 0 0 0 0 -14m0 3a4 4 0 1 1 -4 4l.005 -.2a4 4 0 0 1 3.995 -3.8\" />\r\n </svg>\r\n\r\n <!-- message + modal -->\r\n <div class=\"message-icon-wrapper\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-message-circle\"\r\n (click)=\"buttonClickIcon('message')\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path\r\n d=\"M3 20l1.3 -3.9c-2.324 -3.437 -1.426 -7.872 2.1 -10.374c3.526 -2.501 8.59 -2.296 11.845 .48c3.255 2.777 3.695 7.266 1.029 10.501c-2.666 3.235 -7.615 4.215 -11.574 2.293l-4.7 1\" />\r\n </svg>\r\n\r\n <!-- @if (showMessageModal) {\r\n <div class=\"message-modal-anchor\">\r\n <lib-notification-modal />\r\n </div>\r\n } -->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"side-tabs\">\r\n <div class=\"tab\" [class.active]=\"activeTab === 'principal'\" (click)=\"setTab('principal')\">\r\n Principal\r\n </div>\r\n\r\n <div class=\"tab\" [class.active]=\"activeTab === 'historial'\" (click)=\"setTab('historial')\">\r\n Historial\r\n </div>\r\n\r\n <div class=\"tab-indicator\" [style.left]=\"getIndicatorLeft()\"></div>\r\n </div>\r\n\r\n @for (section of sections; track section.title) {\r\n <div class=\"element-section\">\r\n <h3>{{ section.title }}</h3>\r\n\r\n <div class=\"element-content\">\r\n @if (section.items?.length) { @for (item of section.items; track\r\n item.key) {\r\n <div class=\"element-item\">\r\n <span class=\"label\">{{ item.label }}</span>\r\n <span class=\"value\">{{ isDateValue(item.value) ? getRelativeTime(item.value) : item.value }}</span>\r\n </div>\r\n } }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: [".side-card-wrapper{position:relative;width:100%;height:100%}.side-card{width:354px;max-width:368px;min-width:240px;height:auto;max-height:90vh;background:#ebe8d6b0;border-radius:8px;padding:16px;font-size:16px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 4px 12px #00000026;z-index:10;overflow-y:auto;display:flex;flex-direction:column;gap:16px;box-sizing:border-box}.side-card.floating{position:absolute;top:16px;right:16px}.button-group{display:flex;gap:8px;justify-content:center;margin-bottom:12px}.btn-type{flex:1;padding:10px 12px;background-color:transparent;color:#61661f;border:2px solid #61661f;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer}.btn-type:hover{background-color:#dee58f;color:#61661f;border:none}.btn-type:active{background-color:#61661f;color:#fff;border-color:none}.active{background-color:#596300;color:#fff;border-color:none}.element-header{width:100%;display:flex;gap:12px}.text-container{flex:1;display:flex;flex-direction:column;gap:8px}.title{font-size:2rem;font-weight:700;text-transform:capitalize;max-lines:2}.subtitle{font-size:1.5rem;font-weight:300;color:#454733;text-transform:capitalize}.right-icons{display:flex;flex-direction:column;gap:8px}.icon{color:#1c1c1c;cursor:pointer}.icon.icon-tabler-current-location{color:#d3d936}.icon.icon-tabler-current-location:hover{color:#d3d93666}.status-chip{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.375rem .75rem;border-radius:6px;font-size:1.2rem;font-weight:600;white-space:nowrap;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;margin-bottom:12px}.status-chip-active{background-color:#78db5c;color:#0f5e00}.status-chip-inactive{background-color:#a60321;color:#fafae8}.icon:hover{color:#1c1c1c66}.side-tabs{position:relative;display:flex;width:100%;border-bottom:2px solid #C7C7AD;margin-bottom:8px}.tab{flex:1;text-align:center;padding:12px 0;font-size:1.4rem;font-weight:500;cursor:pointer;color:#454733;transition:color .3s ease;text-transform:uppercase}.tab.active{background-color:transparent;color:#596300;font-weight:600}.tab:hover{color:#6a7500}.tab-indicator{position:absolute;bottom:-2px;left:0;width:50%;height:4px;background-color:#596300;border-radius:4px 4px 0 0;transition:left .3s ease}.element-section{display:flex;flex-direction:column;gap:8px}.element-section h3{margin:0;font-size:1.6rem;font-weight:500;color:#1c1c12;text-transform:uppercase}.element-content{display:flex;flex-direction:column;gap:10px;padding:10px 0;background-color:transparent}.element-item{display:flex;justify-content:space-between}.element-item .label,.element-item .value{font-size:1.5rem;color:#454733;font-weight:300;text-transform:uppercase}.side-card.compact{font-size:13px;padding:12px;gap:10px}.side-card.compact *{margin-bottom:0}.side-card.compact{gap:10px}.side-card.compact .element-section,.side-card.compact .element-content{gap:6px}.side-card.compact .title{font-size:1.6rem;line-height:1.2}.side-card.compact .subtitle{font-size:1.3rem}.side-card.compact .icon{width:22px;height:22px}.side-card.compact svg.icon{width:22px;height:22px}.side-card.compact h3{font-size:1.2rem}.side-card.compact .label,.side-card.compact .value{font-size:1.1rem}.side-card.compact .status-chip{font-size:.9rem;padding:.5rem .8rem;margin-bottom:6px}.side-card.compact .tab{padding:8px 0;font-size:1.1rem}.side-card.compact .tab-indicator{height:3px}.side-card.compact .element-header{gap:8px}.side-card.compact .right-icons{gap:4px}.side-card.compact{max-width:312px;max-height:460px;overflow-y:auto}.side-card.floating.compact{top:9px;right:9px}.message-icon-wrapper{position:relative;display:inline-flex}.message-modal-anchor{position:absolute;top:36px;right:0;z-index:20}\n"] }]
|
|
2750
2753
|
}], propDecorators: { wrapper: [{
|
|
2751
2754
|
type: ViewChild,
|
|
2752
2755
|
args: ['SideCard', { static: true }]
|
|
@@ -2880,6 +2883,7 @@ class TitleFilters {
|
|
|
2880
2883
|
filtersConfig = input([], ...(ngDevMode ? [{ debugName: "filtersConfig" }] : []));
|
|
2881
2884
|
filtersChange = output();
|
|
2882
2885
|
applyFilters = output();
|
|
2886
|
+
clearFilters = output();
|
|
2883
2887
|
clearFilterTrigger = signal(0, ...(ngDevMode ? [{ debugName: "clearFilterTrigger" }] : []));
|
|
2884
2888
|
selectedDates = signal({}, ...(ngDevMode ? [{ debugName: "selectedDates" }] : []));
|
|
2885
2889
|
selectedTextFilters = signal({}, ...(ngDevMode ? [{ debugName: "selectedTextFilters" }] : []));
|
|
@@ -2929,7 +2933,7 @@ class TitleFilters {
|
|
|
2929
2933
|
this.selectedTextFilters.set({});
|
|
2930
2934
|
this.clearFilterTrigger.update(v => v + 1);
|
|
2931
2935
|
this.filtersChange.emit({});
|
|
2932
|
-
this.
|
|
2936
|
+
this.clearFilters.emit();
|
|
2933
2937
|
}
|
|
2934
2938
|
onApplyFilters() {
|
|
2935
2939
|
this.applyFilters.emit();
|
|
@@ -2970,7 +2974,7 @@ class TitleFilters {
|
|
|
2970
2974
|
this.onApplyFilters();
|
|
2971
2975
|
}
|
|
2972
2976
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: TitleFilters, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2973
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: TitleFilters, isStandalone: true, selector: "lib-title-filters", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, filtersConfig: { classPropertyName: "filtersConfig", publicName: "filtersConfig", isSignal: true, isRequired: false, transformFunction: null }, buttonMode: { classPropertyName: "buttonMode", publicName: "buttonMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filtersChange: "filtersChange", applyFilters: "applyFilters", filterButtonClicked: "filterButtonClicked" }, viewQueries: [{ propertyName: "filtersContainer", first: true, predicate: ["filtersContainer"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"header-container-table\">\r\n <div class=\"filters-dashboard-table\">\r\n <div class=\"title-table\">{{ title() }}</div>\r\n\r\n @if (buttonMode() === 'toggle') {\r\n <div class=\"button-small-primary\" (click)=\"toggleFilters()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-filter\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path\r\n d=\"M4 4h16v2.172a2 2 0 0 1 -.586 1.414l-4.414 4.414v7l-6 2v-8.5l-4.48 -4.928a2 2 0 0 1 -.52 -1.345v-2.227z\" />\r\n </svg>\r\n <div class=\"label\">Filtros</div>\r\n </div>\r\n }\r\n @if (buttonMode() === 'action') {\r\n <div class=\"button-small-primary\" (click)=\"onFilterButtonClick()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" fill=\"none\" viewBox=\"0 0 20 20\">\r\n <path fill=\"#fff\"\r\n d=\"M10.85 16.608v1.684a8.3 8.3 0 0 0 4.433-1.842L14.1 15.258a6.6 6.6 0 0 1-3.25 1.35M3.358 10c0-3.375 2.525-6.175 5.792-6.608V1.708C4.958 2.15 1.692 5.7 1.692 10s3.266 7.85 7.458 8.292v-1.684C5.883 16.175 3.358 13.375 3.358 10m13.267-.833h1.683a8.3 8.3 0 0 0-1.841-4.434l-1.192 1.192a6.56 6.56 0 0 1 1.35 3.242M15.283 3.55a8.3 8.3 0 0 0-4.433-1.842v1.684a6.6 6.6 0 0 1 3.25 1.35zm-.008 10.533 1.192 1.184a8.3 8.3 0 0 0 1.841-4.434h-1.683a6.6 6.6 0 0 1-1.35 3.25\" />\r\n <path fill=\"#fff\"\r\n d=\"M13.333 9.25c0-2.075-1.583-3.417-3.333-3.417S6.667 7.175 6.667 9.25c0 1.383 1.108 3.025 3.333 4.917 2.225-1.892 3.333-3.534 3.333-4.917M10 10a.893.893 0 0 1 0-1.783A.893.893 0 0 1 10 10\" />\r\n </svg>\r\n <div class=\"label\">Ir al Mapa</div>\r\n </div>\r\n }\r\n </div>\r\n\r\n @if (showFilters()) {\r\n <div class=\"filters-container\" #filtersContainer>\r\n <div class=\"filters-wrapper\">\r\n\r\n @for (config of normalizedFiltersConfig(); track $index) {\r\n @switch (config.type) {\r\n @case ('text') {\r\n <lib-input-text-filter [filters]=\"config.filters\" [clearTrigger]=\"clearFilterTrigger()\"\r\n (filterSelected)=\"onFilterSelected($event)\" (enterPressed)=\"focusNextFilter()\" />\r\n }\r\n @case ('number') {\r\n <lib-input-number-filter [filters]=\"config.filters\" [clearTrigger]=\"clearFilterTrigger()\"\r\n (filterSelected)=\"onFilterSelected($event)\" (enterPressed)=\"focusNextFilter()\" />\r\n }\r\n @case ('select') {\r\n <lib-input-select-filter [filters]=\"config.filters\" [clearTrigger]=\"clearFilterTrigger()\"\r\n (filterSelected)=\"onFilterSelected($event)\" (enterPressed)=\"focusNextFilter()\" />\r\n }\r\n @case ('date') {\r\n <lib-date-time-filter [filters]=\"config.filters\" [clearTrigger]=\"clearFilterTrigger()\"\r\n (dateSelected)=\"onDateSelected($event)\" (enterPressed)=\"focusNextFilter()\" />\r\n }\r\n }\r\n }\r\n\r\n <div class=\"actions\">\r\n <div class=\"button-small-primary\" (click)=\"onApplyFilters()\">\r\n <div class=\"label\">Aplicar Filtros</div>\r\n </div>\r\n\r\n <div class=\"button-text\" (click)=\"clearAllFilters()\">\r\n Borrar Filtros\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n }\r\n</div>", styles: [".header-container-table{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;flex:1;width:100%;position:relative}.filters-dashboard-table{display:flex;flex-direction:row;gap:24px;align-items:center;justify-content:flex-start;flex-shrink:0;width:100%;position:relative}.title-table{color:var(--schemes-on-surface, #171c1f);font-family:var(--headline-large-font, \"Roboto-SemiBold\", sans-serif);font-size:32px;line-height:40px;font-weight:600;position:relative}.filters-container{display:flex;flex-direction:row;gap:24px;margin-top:12px;position:relative;flex-wrap:wrap}.filters-wrapper{display:flex;position:relative;align-items:center;margin-top:4px;z-index:1000;flex-wrap:wrap;gap:10px}.actions{display:flex;gap:10px}.button-text{display:flex;background-color:transparent;color:#61661f;padding:0 12px;font-size:1.3rem;font-weight:500;border:1px solid #61661F;border-radius:20px;cursor:pointer;justify-content:center;align-items:center;position:relative;flex-shrink:0}.button-text:hover{background-color:#d8eb2ca7;border:1px solid #d8eb2ca7}.button-small-primary{background-color:var(--primary, #596300);padding:10px 16px;display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:center;flex-shrink:0;position:relative;border:none;border-radius:99px;cursor:pointer}.button-small-primary:hover{background-color:var(--on-secondary-container, #61661F)}.button-small-primary:active{background-color:#737928}.icon{color:var(--surface, #fafae8);flex-shrink:0;width:20px;height:20px;position:relative;overflow:visible}.button-small-primary .label{color:var(--schemes-on-primary, #ffffff);text-align:left;font-family:var( --theme-label-large-font-family, \"Roboto-Medium\", sans-serif );font-size:var(--theme-label-large-font-size, 1.4rem);line-height:var(--theme-label-large-line-height, 20px);letter-spacing:var(--theme-label-large-letter-spacing, .1px);font-weight:var(--theme-label-large-font-weight, 500);position:relative;display:flex;align-items:center;justify-content:flex-start}\n"], dependencies: [{ kind: "component", type: InputNumberFilter, selector: "lib-input-number-filter", inputs: ["filters", "clearTrigger"], outputs: ["filterSelected", "valueChange", "enterPressed"] }, { kind: "component", type: InputTextFilter, selector: "lib-input-text-filter", inputs: ["filters", "clearTrigger"], outputs: ["filterSelected", "valueChange", "enterPressed"] }, { kind: "component", type: InputSelectFilter, selector: "lib-input-select-filter", inputs: ["filters", "clearTrigger"], outputs: ["filterSelected", "valueChange", "enterPressed"] }, { kind: "component", type: DateTimeFilter, selector: "lib-date-time-filter", inputs: ["filters", "clearTrigger"], outputs: ["dateSelected", "dateChange", "enterPressed"] }] });
|
|
2977
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: TitleFilters, isStandalone: true, selector: "lib-title-filters", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, filtersConfig: { classPropertyName: "filtersConfig", publicName: "filtersConfig", isSignal: true, isRequired: false, transformFunction: null }, buttonMode: { classPropertyName: "buttonMode", publicName: "buttonMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filtersChange: "filtersChange", applyFilters: "applyFilters", clearFilters: "clearFilters", filterButtonClicked: "filterButtonClicked" }, viewQueries: [{ propertyName: "filtersContainer", first: true, predicate: ["filtersContainer"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"header-container-table\">\r\n <div class=\"filters-dashboard-table\">\r\n <div class=\"title-table\">{{ title() }}</div>\r\n\r\n @if (buttonMode() === 'toggle') {\r\n <div class=\"button-small-primary\" (click)=\"toggleFilters()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-filter\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path\r\n d=\"M4 4h16v2.172a2 2 0 0 1 -.586 1.414l-4.414 4.414v7l-6 2v-8.5l-4.48 -4.928a2 2 0 0 1 -.52 -1.345v-2.227z\" />\r\n </svg>\r\n <div class=\"label\">Filtros</div>\r\n </div>\r\n }\r\n @if (buttonMode() === 'action') {\r\n <div class=\"button-small-primary\" (click)=\"onFilterButtonClick()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" fill=\"none\" viewBox=\"0 0 20 20\">\r\n <path fill=\"#fff\"\r\n d=\"M10.85 16.608v1.684a8.3 8.3 0 0 0 4.433-1.842L14.1 15.258a6.6 6.6 0 0 1-3.25 1.35M3.358 10c0-3.375 2.525-6.175 5.792-6.608V1.708C4.958 2.15 1.692 5.7 1.692 10s3.266 7.85 7.458 8.292v-1.684C5.883 16.175 3.358 13.375 3.358 10m13.267-.833h1.683a8.3 8.3 0 0 0-1.841-4.434l-1.192 1.192a6.56 6.56 0 0 1 1.35 3.242M15.283 3.55a8.3 8.3 0 0 0-4.433-1.842v1.684a6.6 6.6 0 0 1 3.25 1.35zm-.008 10.533 1.192 1.184a8.3 8.3 0 0 0 1.841-4.434h-1.683a6.6 6.6 0 0 1-1.35 3.25\" />\r\n <path fill=\"#fff\"\r\n d=\"M13.333 9.25c0-2.075-1.583-3.417-3.333-3.417S6.667 7.175 6.667 9.25c0 1.383 1.108 3.025 3.333 4.917 2.225-1.892 3.333-3.534 3.333-4.917M10 10a.893.893 0 0 1 0-1.783A.893.893 0 0 1 10 10\" />\r\n </svg>\r\n <div class=\"label\">Ir al Mapa</div>\r\n </div>\r\n }\r\n </div>\r\n\r\n @if (showFilters()) {\r\n <div class=\"filters-container\" #filtersContainer>\r\n <div class=\"filters-wrapper\">\r\n\r\n @for (config of normalizedFiltersConfig(); track $index) {\r\n @switch (config.type) {\r\n @case ('text') {\r\n <lib-input-text-filter [filters]=\"config.filters\" [clearTrigger]=\"clearFilterTrigger()\"\r\n (filterSelected)=\"onFilterSelected($event)\" (enterPressed)=\"focusNextFilter()\" />\r\n }\r\n @case ('number') {\r\n <lib-input-number-filter [filters]=\"config.filters\" [clearTrigger]=\"clearFilterTrigger()\"\r\n (filterSelected)=\"onFilterSelected($event)\" (enterPressed)=\"focusNextFilter()\" />\r\n }\r\n @case ('select') {\r\n <lib-input-select-filter [filters]=\"config.filters\" [clearTrigger]=\"clearFilterTrigger()\"\r\n (filterSelected)=\"onFilterSelected($event)\" (enterPressed)=\"focusNextFilter()\" />\r\n }\r\n @case ('date') {\r\n <lib-date-time-filter [filters]=\"config.filters\" [clearTrigger]=\"clearFilterTrigger()\"\r\n (dateSelected)=\"onDateSelected($event)\" (enterPressed)=\"focusNextFilter()\" />\r\n }\r\n }\r\n }\r\n\r\n <div class=\"actions\">\r\n <div class=\"button-small-primary\" (click)=\"onApplyFilters()\">\r\n <div class=\"label\">Aplicar Filtros</div>\r\n </div>\r\n\r\n <div class=\"button-text\" (click)=\"clearAllFilters()\">\r\n Borrar Filtros\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n }\r\n</div>", styles: [".header-container-table{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;flex:1;width:100%;position:relative}.filters-dashboard-table{display:flex;flex-direction:row;gap:24px;align-items:center;justify-content:flex-start;flex-shrink:0;width:100%;position:relative}.title-table{color:var(--schemes-on-surface, #171c1f);font-family:var(--headline-large-font, \"Roboto-SemiBold\", sans-serif);font-size:32px;line-height:40px;font-weight:600;position:relative}.filters-container{display:flex;flex-direction:row;gap:24px;margin-top:12px;position:relative;flex-wrap:wrap}.filters-wrapper{display:flex;position:relative;align-items:center;margin-top:4px;z-index:1000;flex-wrap:wrap;gap:10px}.actions{display:flex;gap:10px}.button-text{display:flex;background-color:transparent;color:#61661f;padding:0 12px;font-size:1.3rem;font-weight:500;border:1px solid #61661F;border-radius:20px;cursor:pointer;justify-content:center;align-items:center;position:relative;flex-shrink:0}.button-text:hover{background-color:#d8eb2ca7;border:1px solid #d8eb2ca7}.button-small-primary{background-color:var(--primary, #596300);padding:10px 16px;display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:center;flex-shrink:0;position:relative;border:none;border-radius:99px;cursor:pointer}.button-small-primary:hover{background-color:var(--on-secondary-container, #61661F)}.button-small-primary:active{background-color:#737928}.icon{color:var(--surface, #fafae8);flex-shrink:0;width:20px;height:20px;position:relative;overflow:visible}.button-small-primary .label{color:var(--schemes-on-primary, #ffffff);text-align:left;font-family:var( --theme-label-large-font-family, \"Roboto-Medium\", sans-serif );font-size:var(--theme-label-large-font-size, 1.4rem);line-height:var(--theme-label-large-line-height, 20px);letter-spacing:var(--theme-label-large-letter-spacing, .1px);font-weight:var(--theme-label-large-font-weight, 500);position:relative;display:flex;align-items:center;justify-content:flex-start}\n"], dependencies: [{ kind: "component", type: InputNumberFilter, selector: "lib-input-number-filter", inputs: ["filters", "clearTrigger"], outputs: ["filterSelected", "valueChange", "enterPressed"] }, { kind: "component", type: InputTextFilter, selector: "lib-input-text-filter", inputs: ["filters", "clearTrigger"], outputs: ["filterSelected", "valueChange", "enterPressed"] }, { kind: "component", type: InputSelectFilter, selector: "lib-input-select-filter", inputs: ["filters", "clearTrigger"], outputs: ["filterSelected", "valueChange", "enterPressed"] }, { kind: "component", type: DateTimeFilter, selector: "lib-date-time-filter", inputs: ["filters", "clearTrigger"], outputs: ["dateSelected", "dateChange", "enterPressed"] }] });
|
|
2974
2978
|
}
|
|
2975
2979
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: TitleFilters, decorators: [{
|
|
2976
2980
|
type: Component,
|
|
@@ -2978,7 +2982,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
2978
2982
|
}], propDecorators: { filtersContainer: [{
|
|
2979
2983
|
type: ViewChild,
|
|
2980
2984
|
args: ['filtersContainer', { read: ElementRef }]
|
|
2981
|
-
}], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], filtersConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "filtersConfig", required: false }] }], filtersChange: [{ type: i0.Output, args: ["filtersChange"] }], applyFilters: [{ type: i0.Output, args: ["applyFilters"] }], buttonMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonMode", required: false }] }], filterButtonClicked: [{ type: i0.Output, args: ["filterButtonClicked"] }] } });
|
|
2985
|
+
}], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], filtersConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "filtersConfig", required: false }] }], filtersChange: [{ type: i0.Output, args: ["filtersChange"] }], applyFilters: [{ type: i0.Output, args: ["applyFilters"] }], clearFilters: [{ type: i0.Output, args: ["clearFilters"] }], buttonMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonMode", required: false }] }], filterButtonClicked: [{ type: i0.Output, args: ["filterButtonClicked"] }] } });
|
|
2982
2986
|
|
|
2983
2987
|
class NotificationModal {
|
|
2984
2988
|
messageInput;
|
|
@@ -3016,11 +3020,11 @@ class NotificationModal {
|
|
|
3016
3020
|
this.messageValue = '';
|
|
3017
3021
|
}
|
|
3018
3022
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NotificationModal, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3019
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: NotificationModal, isStandalone: true, selector: "lib-notification-modal", inputs: { titulo: "titulo" }, outputs: { buttonClick: "buttonClick" }, viewQueries: [{ propertyName: "messageInput", first: true, predicate: ["messageInput"], descendants: true }], ngImport: i0, template: "<div class=\"notification-modal-container\">\r\n <div class=\"notification-modal-header\">\r\n <h3>{{ titulo }}</h3>\r\n </div>\r\n <div class=\"notification-modal-body\">\r\n <!-- LISTA DE MENSAJES -->\r\n @if (mode === 'list') {\r\n <div class=\"default-message-list\">\r\n @for (msg of defaultMessages; track msg) {\r\n <div class=\"default-message-item\" (click)=\"selectDefaultMessage(msg)\">\r\n <span>{{ msg }}</span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"
|
|
3023
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: NotificationModal, isStandalone: true, selector: "lib-notification-modal", inputs: { titulo: "titulo" }, outputs: { buttonClick: "buttonClick" }, viewQueries: [{ propertyName: "messageInput", first: true, predicate: ["messageInput"], descendants: true }], ngImport: i0, template: "<div class=\"notification-modal-container\">\r\n <div class=\"notification-modal-header\">\r\n <h3>{{ titulo }}</h3>\r\n </div>\r\n <div class=\"notification-modal-body\">\r\n <!-- LISTA DE MENSAJES -->\r\n @if (mode === 'list') {\r\n <div class=\"default-message-list\">\r\n @for (msg of defaultMessages; track msg) {\r\n <div class=\"default-message-item\" (click)=\"selectDefaultMessage(msg)\">\r\n <span>{{ msg }}</span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" fill=\"none\" stroke=\"currentColor\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-send-2\" viewBox=\"0 0 24 24\">\r\n <path fill=\"none\" stroke=\"none\" d=\"M0 0h24v24H0z\" />\r\n <path\r\n d=\"M4.698 4.034 21 12 4.698 19.966a.5.5 0 0 1-.546-.124.56.56 0 0 1-.12-.568L6.5 12 4.032 4.726a.56.56 0 0 1 .12-.568.5.5 0 0 1 .546-.124M6.5 12H21\" />\r\n </svg>\r\n </div>\r\n }\r\n </div>\r\n }\r\n\r\n <!-- EDICI\u00D3N -->\r\n @if (mode === 'edit') {\r\n <div class=\"text-area-wrapper\">\r\n <textarea #messageInput class=\"message-textarea\" rows=\"5\" placeholder=\"Mensaje...\">{{messageValue}}</textarea>\r\n </div>\r\n }\r\n\r\n </div>\r\n\r\n <div class=\"notification-modal-actions\">\r\n @if (mode === 'edit') {\r\n <button class=\"btn-back\" (click)=\"backToList()\">\r\n Volver\r\n </button>\r\n <button class=\"btn-custom\" (click)=\"btnClick()\">\r\n Notificar\r\n </button>\r\n } @else {\r\n <button class=\"btn-custom\" (click)=\"customMessage()\">\r\n Personalizado\r\n </button>\r\n }\r\n </div>\r\n</div>", styles: [".notification-modal-container{width:100%;min-width:300px;max-width:320px;display:flex;flex-direction:column;border-radius:12px;background-color:#f0f0db}.notification-modal-header{padding:16px}.notification-modal-header h3{font-size:1.6rem;font-weight:700;color:#454733;text-transform:uppercase}.notification-modal-body{display:flex;flex-direction:column;gap:12px;overflow:hidden;padding:0 6px}.icon{color:#596300}.notification-modal-actions{width:100%;display:flex;justify-content:flex-end;align-items:center;gap:16px;padding:16px}.default-message-item{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;cursor:pointer;border-radius:6px}.default-message-item:hover{background:#dee58f}.default-message-item .span{font-size:1.4rem;color:#454733}.text-area-wrapper{position:relative;width:100%;padding:0 10px}.message-textarea{width:100%;resize:none;border-radius:6px;border:1px solid #787861;background:transparent;padding:6px 12px}button{border:none;background-color:transparent}.btn-custom,.btn-back{color:#596300;font-weight:500;font-size:1.4rem;padding:6px 12px;cursor:pointer;border-radius:50px}.btn-custom:hover{background-color:#596300;color:#f0f0db}.btn-back:hover{background-color:#dee58f;color:#596300}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
3020
3024
|
}
|
|
3021
3025
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NotificationModal, decorators: [{
|
|
3022
3026
|
type: Component,
|
|
3023
|
-
args: [{ selector: 'lib-notification-modal', imports: [CommonModule], template: "<div class=\"notification-modal-container\">\r\n <div class=\"notification-modal-header\">\r\n <h3>{{ titulo }}</h3>\r\n </div>\r\n <div class=\"notification-modal-body\">\r\n <!-- LISTA DE MENSAJES -->\r\n @if (mode === 'list') {\r\n <div class=\"default-message-list\">\r\n @for (msg of defaultMessages; track msg) {\r\n <div class=\"default-message-item\" (click)=\"selectDefaultMessage(msg)\">\r\n <span>{{ msg }}</span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"
|
|
3027
|
+
args: [{ selector: 'lib-notification-modal', imports: [CommonModule], template: "<div class=\"notification-modal-container\">\r\n <div class=\"notification-modal-header\">\r\n <h3>{{ titulo }}</h3>\r\n </div>\r\n <div class=\"notification-modal-body\">\r\n <!-- LISTA DE MENSAJES -->\r\n @if (mode === 'list') {\r\n <div class=\"default-message-list\">\r\n @for (msg of defaultMessages; track msg) {\r\n <div class=\"default-message-item\" (click)=\"selectDefaultMessage(msg)\">\r\n <span>{{ msg }}</span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" fill=\"none\" stroke=\"currentColor\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-send-2\" viewBox=\"0 0 24 24\">\r\n <path fill=\"none\" stroke=\"none\" d=\"M0 0h24v24H0z\" />\r\n <path\r\n d=\"M4.698 4.034 21 12 4.698 19.966a.5.5 0 0 1-.546-.124.56.56 0 0 1-.12-.568L6.5 12 4.032 4.726a.56.56 0 0 1 .12-.568.5.5 0 0 1 .546-.124M6.5 12H21\" />\r\n </svg>\r\n </div>\r\n }\r\n </div>\r\n }\r\n\r\n <!-- EDICI\u00D3N -->\r\n @if (mode === 'edit') {\r\n <div class=\"text-area-wrapper\">\r\n <textarea #messageInput class=\"message-textarea\" rows=\"5\" placeholder=\"Mensaje...\">{{messageValue}}</textarea>\r\n </div>\r\n }\r\n\r\n </div>\r\n\r\n <div class=\"notification-modal-actions\">\r\n @if (mode === 'edit') {\r\n <button class=\"btn-back\" (click)=\"backToList()\">\r\n Volver\r\n </button>\r\n <button class=\"btn-custom\" (click)=\"btnClick()\">\r\n Notificar\r\n </button>\r\n } @else {\r\n <button class=\"btn-custom\" (click)=\"customMessage()\">\r\n Personalizado\r\n </button>\r\n }\r\n </div>\r\n</div>", styles: [".notification-modal-container{width:100%;min-width:300px;max-width:320px;display:flex;flex-direction:column;border-radius:12px;background-color:#f0f0db}.notification-modal-header{padding:16px}.notification-modal-header h3{font-size:1.6rem;font-weight:700;color:#454733;text-transform:uppercase}.notification-modal-body{display:flex;flex-direction:column;gap:12px;overflow:hidden;padding:0 6px}.icon{color:#596300}.notification-modal-actions{width:100%;display:flex;justify-content:flex-end;align-items:center;gap:16px;padding:16px}.default-message-item{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;cursor:pointer;border-radius:6px}.default-message-item:hover{background:#dee58f}.default-message-item .span{font-size:1.4rem;color:#454733}.text-area-wrapper{position:relative;width:100%;padding:0 10px}.message-textarea{width:100%;resize:none;border-radius:6px;border:1px solid #787861;background:transparent;padding:6px 12px}button{border:none;background-color:transparent}.btn-custom,.btn-back{color:#596300;font-weight:500;font-size:1.4rem;padding:6px 12px;cursor:pointer;border-radius:50px}.btn-custom:hover{background-color:#596300;color:#f0f0db}.btn-back:hover{background-color:#dee58f;color:#596300}\n"] }]
|
|
3024
3028
|
}], propDecorators: { messageInput: [{
|
|
3025
3029
|
type: ViewChild,
|
|
3026
3030
|
args: ['messageInput']
|
|
@@ -3032,11 +3036,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
3032
3036
|
|
|
3033
3037
|
class Footer {
|
|
3034
3038
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: Footer, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3035
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: Footer, isStandalone: true, selector: "app-footer", ngImport: i0, template: "<footer class=\"footer\">\r\n \u00A9 2026 <span>PAICO \u00B7 Sistemas y Aplicaciones en L\u00EDnea.</span> Todos los derechos reservados.\r\n</footer>\r\n", styles: ["footer{background-color:#f0f0db;color:#787861;padding:20px 30px;border-radius:16px;display:flex;gap:6px;justify-content:center;align-items:center;position:fixed;bottom:16px;left:32px;right:32px;font-size:1.
|
|
3039
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: Footer, isStandalone: true, selector: "app-footer", ngImport: i0, template: "<footer class=\"footer\">\r\n \u00A9 2026 <span>PAICO \u00B7 Sistemas y Aplicaciones en L\u00EDnea.</span> Todos los derechos reservados.\r\n</footer>\r\n", styles: ["footer{background-color:#f0f0db;color:#787861;padding:20px 30px;border-radius:16px;display:flex;gap:6px;justify-content:center;align-items:center;position:fixed;bottom:16px;left:32px;right:32px;font-size:1.2rem}span{font-weight:700}\n"] });
|
|
3036
3040
|
}
|
|
3037
3041
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: Footer, decorators: [{
|
|
3038
3042
|
type: Component,
|
|
3039
|
-
args: [{ selector: 'app-footer', standalone: true, imports: [], template: "<footer class=\"footer\">\r\n \u00A9 2026 <span>PAICO \u00B7 Sistemas y Aplicaciones en L\u00EDnea.</span> Todos los derechos reservados.\r\n</footer>\r\n", styles: ["footer{background-color:#f0f0db;color:#787861;padding:20px 30px;border-radius:16px;display:flex;gap:6px;justify-content:center;align-items:center;position:fixed;bottom:16px;left:32px;right:32px;font-size:1.
|
|
3043
|
+
args: [{ selector: 'app-footer', standalone: true, imports: [], template: "<footer class=\"footer\">\r\n \u00A9 2026 <span>PAICO \u00B7 Sistemas y Aplicaciones en L\u00EDnea.</span> Todos los derechos reservados.\r\n</footer>\r\n", styles: ["footer{background-color:#f0f0db;color:#787861;padding:20px 30px;border-radius:16px;display:flex;gap:6px;justify-content:center;align-items:center;position:fixed;bottom:16px;left:32px;right:32px;font-size:1.2rem}span{font-weight:700}\n"] }]
|
|
3040
3044
|
}] });
|
|
3041
3045
|
|
|
3042
3046
|
// src/app/components/public-api.ts
|