@litigiovirtual/ius-design-components 1.0.297 → 1.0.299
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/avatar-v2/avatar-v2.component.mjs +17 -4
- package/esm2022/lib/notifications/notifications.component.mjs +11 -3
- package/esm2022/lib/toolbar/toolbar.component.mjs +7 -3
- package/fesm2022/litigiovirtual-ius-design-components.mjs +32 -7
- package/fesm2022/litigiovirtual-ius-design-components.mjs.map +1 -1
- package/lib/avatar-v2/avatar-v2.component.d.ts +3 -0
- package/lib/toolbar/toolbar.component.d.ts +2 -1
- package/package.json +1 -1
|
@@ -1743,9 +1743,15 @@ class AvatarV2Component {
|
|
|
1743
1743
|
this.fallbackIconName = 'icon-account-circle';
|
|
1744
1744
|
this.editClicked = new EventEmitter();
|
|
1745
1745
|
this.initials = '';
|
|
1746
|
+
// Indica que la carga de imageUrl falló (404, formato inválido, enlace caído) //
|
|
1747
|
+
this.imageLoadError = false;
|
|
1748
|
+
}
|
|
1749
|
+
// Solo debe renderizarse la <img> si hay URL válida y no ha fallado su carga. //
|
|
1750
|
+
get showImage() {
|
|
1751
|
+
return !!this.imageUrl && this.imageUrl !== '' && !this.imageLoadError;
|
|
1746
1752
|
}
|
|
1747
1753
|
get containerStyle() {
|
|
1748
|
-
if (!this.
|
|
1754
|
+
if (!this.showImage && this.backgroundColor) {
|
|
1749
1755
|
return { 'background-color': this.backgroundColor };
|
|
1750
1756
|
}
|
|
1751
1757
|
return {};
|
|
@@ -1754,6 +1760,13 @@ class AvatarV2Component {
|
|
|
1754
1760
|
if (changes['name']) {
|
|
1755
1761
|
this.initials = this.extractInitials(this.name);
|
|
1756
1762
|
}
|
|
1763
|
+
// Al cambiar la URL, reintentamos la carga limpiando el estado de error previo.
|
|
1764
|
+
if (changes['imageUrl']) {
|
|
1765
|
+
this.imageLoadError = false;
|
|
1766
|
+
}
|
|
1767
|
+
}
|
|
1768
|
+
onImageError() {
|
|
1769
|
+
this.imageLoadError = true;
|
|
1757
1770
|
}
|
|
1758
1771
|
onEditClick(event) {
|
|
1759
1772
|
event.stopPropagation();
|
|
@@ -1768,7 +1781,7 @@ class AvatarV2Component {
|
|
|
1768
1781
|
return (parts[0].charAt(0) + parts[parts.length - 1].charAt(0)).toUpperCase();
|
|
1769
1782
|
}
|
|
1770
1783
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1771
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AvatarV2Component, isStandalone: true, selector: "ius-avatar-v2", inputs: { imageUrl: "imageUrl", name: "name", size: "size", shape: "shape", showEditButton: "showEditButton", backgroundColor: "backgroundColor", fallbackIconName: "fallbackIconName" }, outputs: { editClicked: "editClicked" }, usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"avatar\"\r\n [ngClass]=\"[size, shape]\"\r\n [class.has-image]=\"
|
|
1784
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AvatarV2Component, isStandalone: true, selector: "ius-avatar-v2", inputs: { imageUrl: "imageUrl", name: "name", size: "size", shape: "shape", showEditButton: "showEditButton", backgroundColor: "backgroundColor", fallbackIconName: "fallbackIconName" }, outputs: { editClicked: "editClicked" }, usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"avatar\"\r\n [ngClass]=\"[size, shape]\"\r\n [class.has-image]=\"showImage\"\r\n [ngStyle]=\"containerStyle\"\r\n>\r\n @if (showImage) {\r\n <img\r\n [src]=\"imageUrl\"\r\n [alt]=\"name || 'avatar'\"\r\n class=\"avatar__image\"\r\n (error)=\"onImageError()\"\r\n />\r\n } @else if (initials) {\r\n <span class=\"body-large\" style=\"color: var(--ColorText-colorTextPrimary, #333);\">{{ initials }}</span>\r\n } @else {\r\n @switch (size) {\r\n @case ('xs') {\r\n <ius-icon-xs class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xs>\r\n }\r\n @case ('sm') {\r\n <ius-icon-sm class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-sm>\r\n }\r\n @case ('md') {\r\n <ius-icon-md class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-md>\r\n }\r\n @case ('lg') {\r\n <ius-icon-lg class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-lg>\r\n }\r\n @case ('xl') {\r\n <ius-icon-xl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xl>\r\n }\r\n @case ('xxl') {\r\n <ius-icon-xxl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xxl>\r\n }\r\n }\r\n }\r\n\r\n @if (showEditButton) {\r\n <div class=\"avatar__edit-overlay\" (click)=\"onEditClick($event)\">\r\n <div class=\"avatar__edit-btn\">\r\n <ius-icon-sm iconName=\"icon-edit\"></ius-icon-sm>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}:host{display:inline-block}.avatar{position:relative;display:flex;justify-content:center;align-items:center;background-color:#edf6ff;overflow:hidden;flex-shrink:0}.avatar.circle{border-radius:50%}.avatar.square{border-radius:8px}.avatar.xs{width:14px;height:14px}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}.avatar.xl{width:64px;height:64px}.avatar.xxl{width:96px;height:96px}.avatar__image{width:100%;height:100%;object-fit:cover;display:block}.avatar__edit-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background-color:var(--Info-Color-Info-200, #C4DFFF);opacity:0;transition:opacity .2s ease,background-color .2s ease;cursor:pointer}.avatar.has-image .avatar__edit-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#fff3}.avatar__edit-btn{display:flex;justify-content:center;align-items:center;width:28px;height:28px;border-radius:50%;background-color:#fff;color:#333;pointer-events:none}.avatar:hover .avatar__edit-overlay{opacity:1}.icon{color:#c4dfff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: IconXsComponent, selector: "ius-icon-xs", inputs: ["iconName", "color"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "component", type: IconXlComponent, selector: "ius-icon-xl", inputs: ["iconName", "color"] }, { kind: "component", type: IconXxlComponent, selector: "ius-icon-xxl", inputs: ["iconName", "color"] }, { kind: "component", type: IconLgComponent, selector: "ius-icon-lg", inputs: ["iconName", "color"] }] }); }
|
|
1772
1785
|
}
|
|
1773
1786
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarV2Component, decorators: [{
|
|
1774
1787
|
type: Component,
|
|
@@ -1780,7 +1793,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
1780
1793
|
IconXlComponent,
|
|
1781
1794
|
IconXxlComponent,
|
|
1782
1795
|
IconLgComponent
|
|
1783
|
-
], template: "<div\r\n class=\"avatar\"\r\n [ngClass]=\"[size, shape]\"\r\n [class.has-image]=\"
|
|
1796
|
+
], template: "<div\r\n class=\"avatar\"\r\n [ngClass]=\"[size, shape]\"\r\n [class.has-image]=\"showImage\"\r\n [ngStyle]=\"containerStyle\"\r\n>\r\n @if (showImage) {\r\n <img\r\n [src]=\"imageUrl\"\r\n [alt]=\"name || 'avatar'\"\r\n class=\"avatar__image\"\r\n (error)=\"onImageError()\"\r\n />\r\n } @else if (initials) {\r\n <span class=\"body-large\" style=\"color: var(--ColorText-colorTextPrimary, #333);\">{{ initials }}</span>\r\n } @else {\r\n @switch (size) {\r\n @case ('xs') {\r\n <ius-icon-xs class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xs>\r\n }\r\n @case ('sm') {\r\n <ius-icon-sm class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-sm>\r\n }\r\n @case ('md') {\r\n <ius-icon-md class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-md>\r\n }\r\n @case ('lg') {\r\n <ius-icon-lg class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-lg>\r\n }\r\n @case ('xl') {\r\n <ius-icon-xl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xl>\r\n }\r\n @case ('xxl') {\r\n <ius-icon-xxl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xxl>\r\n }\r\n }\r\n }\r\n\r\n @if (showEditButton) {\r\n <div class=\"avatar__edit-overlay\" (click)=\"onEditClick($event)\">\r\n <div class=\"avatar__edit-btn\">\r\n <ius-icon-sm iconName=\"icon-edit\"></ius-icon-sm>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}:host{display:inline-block}.avatar{position:relative;display:flex;justify-content:center;align-items:center;background-color:#edf6ff;overflow:hidden;flex-shrink:0}.avatar.circle{border-radius:50%}.avatar.square{border-radius:8px}.avatar.xs{width:14px;height:14px}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}.avatar.xl{width:64px;height:64px}.avatar.xxl{width:96px;height:96px}.avatar__image{width:100%;height:100%;object-fit:cover;display:block}.avatar__edit-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background-color:var(--Info-Color-Info-200, #C4DFFF);opacity:0;transition:opacity .2s ease,background-color .2s ease;cursor:pointer}.avatar.has-image .avatar__edit-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#fff3}.avatar__edit-btn{display:flex;justify-content:center;align-items:center;width:28px;height:28px;border-radius:50%;background-color:#fff;color:#333;pointer-events:none}.avatar:hover .avatar__edit-overlay{opacity:1}.icon{color:#c4dfff}\n"] }]
|
|
1784
1797
|
}], propDecorators: { imageUrl: [{
|
|
1785
1798
|
type: Input
|
|
1786
1799
|
}], name: [{
|
|
@@ -4683,7 +4696,7 @@ class NotificationsComponent {
|
|
|
4683
4696
|
this.onDeleteAllAlerts.emit();
|
|
4684
4697
|
}
|
|
4685
4698
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NotificationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4686
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: NotificationsComponent, isStandalone: true, selector: "ius-notifications", inputs: { alerts: "alerts", titleDrawer: "titleDrawer", percentProgressBar: "percentProgressBar" }, outputs: { onDoneAlert: "onDoneAlert", onPostponeAlert: "onPostponeAlert", onPressedBackEvent: "onPressedBackEvent", onDrawerClosed: "onDrawerClosed", onEditAlert: "onEditAlert", onClickAlertEvent: "onClickAlertEvent", onDeleteAllAlerts: "onDeleteAllAlerts" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"background-drawer\">\r\n
|
|
4699
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: NotificationsComponent, isStandalone: true, selector: "ius-notifications", inputs: { alerts: "alerts", titleDrawer: "titleDrawer", percentProgressBar: "percentProgressBar" }, outputs: { onDoneAlert: "onDoneAlert", onPostponeAlert: "onPostponeAlert", onPressedBackEvent: "onPressedBackEvent", onDrawerClosed: "onDrawerClosed", onEditAlert: "onEditAlert", onClickAlertEvent: "onClickAlertEvent", onDeleteAllAlerts: "onDeleteAllAlerts" }, usesOnChanges: true, ngImport: i0, template: "@if (isVisible) {\r\n <div class=\"background-drawer\" @fade>\r\n <div\r\n class=\"create-container\"\r\n @slideInOut\r\n (@slideInOut.done)=\"onAnimDone($event)\"\r\n >\r\n <div class=\"header-drawer\">\r\n <div class=\"title-header-drawer\">Panel de notificaciones</div>\r\n @if (alerts.length > 0) {\r\n <ius-button-circle-tertiary\r\n class=\"button-header-drawer\"\r\n [iconName]=\"'icon-delete'\"\r\n iusPopoverContent=\"Borrar\"\r\n (buttonClicked)=\"deleteAllAlerts()\"\r\n ></ius-button-circle-tertiary>\r\n }\r\n <ius-button-circle-tertiary\r\n [iconName]=\"'icon-cancel'\"\r\n iusPopoverContent=\"Cerrar\"\r\n (buttonClicked)=\"close()\"\r\n ></ius-button-circle-tertiary>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n <div class=\"scrollable\">\r\n <div [@listContainer]=\"alerts.length\" (@listContainer.done)=\"onListDone()\">\r\n @for (alert of alerts; track trackByAlert($index, alert)) {\r\n <div class=\"notification\" @itemAnim>\r\n <ius-notification-card\r\n [date]=\"(alert?.fechaRegistro | date:'d \\'de\\' MMMM \\'de\\' y, h:mm a')!\"\r\n [title]=\"alert?.titulo\"\r\n [simple]=\"(alert?.tipoAlerta! === 'Simple' ? true : false)! || (alert?.tipoAlerta! === 'Hexti' ? true : false)!\"\r\n [activity]=\"alert?.tipoAlerta! === 'Actividad' ? true : false\"\r\n [confirmable]=\"alert?.tipoAlerta! === 'Confirmacion' ? true : false\"\r\n [body]=\"alert?.descripcion!\"\r\n [fechaActividad]=\"alert?.fechaActividad\"\r\n [mostrarPosponer]=\"alert?.mostrarPosponer\"\r\n (onDone)=\"onClickDone(alert.alertaID!)\"\r\n (onPostpone)=\"onPostpone(alert, $event)\"\r\n [esNavegable]=\"!!alert?.referenciaOrigenId\"\r\n (onEditActivity)=\"onEdit(alert)\"\r\n (onClickAlert)=\"onClickCard(alert)\"\r\n ></ius-notification-card>\r\n </div>\r\n }\r\n </div>\r\n @if (mostrarVacio) {\r\n <div class=\"no-notifications\">\r\n <ius-icon-lg [iconName]=\"'icon-done-outline'\"></ius-icon-lg>\r\n <ius-simple-divider></ius-simple-divider>\r\n <p>No tienes ninguna nueva notificaci\u00F3n o alerta</p>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n}\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.background-drawer{position:absolute;top:0;left:0;display:flex;height:100%;width:100%;justify-content:center;background-color:#0003;transition:.2s ease-in-out;align-items:center;z-index:900}.create-container{height:calc(100vh - 60px);position:absolute;z-index:1000;width:390px;top:60px;right:0;background-color:#fff;border-radius:8px 0 0 8px;box-shadow:0 2px 6px 3px #00000026,0 1px 3px #0000004d;display:flex;flex-direction:column}.header-drawer{display:flex;padding:12px 16px;align-items:center}.title-header-drawer{width:100%;font-family:Roboto,sans-serif;font-size:1.25rem;color:#333;line-height:26px;letter-spacing:.2px;font-weight:500;display:flex;justify-content:start;overflow:hidden;white-space:normal;text-overflow:ellipsis}.notification{padding:2px 5px}.no-notifications{display:flex;width:70%;padding:8px;flex-direction:column;align-items:center;align-self:center;justify-self:center;gap:12px;margin-top:24px}.no-notifications p{flex:1 0 0;margin:0;display:flex;justify-content:center;align-items:center;gap:10px;align-self:stretch;color:#333;text-align:center;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.button-header-drawer{margin-left:3px;margin-top:1px}.scrollable{flex:1 1 auto;min-height:0;padding:5px;overflow-y:auto;overflow-x:hidden}.scrollable::-webkit-scrollbar{-webkit-appearance:none}.scrollable::-webkit-scrollbar:vertical{width:7px}.scrollable::-webkit-scrollbar-thumb{background-color:#d8d6d6;border-radius:20px}\n"], dependencies: [{ kind: "component", type: NotificationCardComponent, selector: "ius-notification-card", inputs: ["date", "title", "body", "simple", "activity", "confirmable", "fechaActividad", "mostrarPosponer", "mostrarEditar", "esNavegable", "mostrarAyuda"], outputs: ["onAccept", "onDone", "onPostpone", "onEditActivity", "onClickAlert"] }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "component", type: IconLgComponent, selector: "ius-icon-lg", inputs: ["iconName", "color"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }], animations: [
|
|
4687
4700
|
trigger('slideInOut', [
|
|
4688
4701
|
state('void', style({
|
|
4689
4702
|
transform: 'translateX(100%)',
|
|
@@ -4696,6 +4709,10 @@ class NotificationsComponent {
|
|
|
4696
4709
|
transition('void => *', [animate('300ms ease-in')]),
|
|
4697
4710
|
transition('* => void', [animate('300ms ease-out')]),
|
|
4698
4711
|
]),
|
|
4712
|
+
trigger('fade', [
|
|
4713
|
+
transition(':enter', [style({ opacity: 0 }), animate('200ms ease', style({ opacity: 1 }))]),
|
|
4714
|
+
transition(':leave', [animate('220ms ease', style({ opacity: 0 }))]),
|
|
4715
|
+
]),
|
|
4699
4716
|
trigger('itemAnim', [
|
|
4700
4717
|
transition(':enter', [
|
|
4701
4718
|
style({ opacity: 0, transform: 'translateY(-8px)' }),
|
|
@@ -4734,6 +4751,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
4734
4751
|
transition('void => *', [animate('300ms ease-in')]),
|
|
4735
4752
|
transition('* => void', [animate('300ms ease-out')]),
|
|
4736
4753
|
]),
|
|
4754
|
+
trigger('fade', [
|
|
4755
|
+
transition(':enter', [style({ opacity: 0 }), animate('200ms ease', style({ opacity: 1 }))]),
|
|
4756
|
+
transition(':leave', [animate('220ms ease', style({ opacity: 0 }))]),
|
|
4757
|
+
]),
|
|
4737
4758
|
trigger('itemAnim', [
|
|
4738
4759
|
transition(':enter', [
|
|
4739
4760
|
style({ opacity: 0, transform: 'translateY(-8px)' }),
|
|
@@ -4748,7 +4769,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
4748
4769
|
query(':leave', stagger('45ms', animateChild()), { optional: true }),
|
|
4749
4770
|
]),
|
|
4750
4771
|
]),
|
|
4751
|
-
], template: "<div class=\"background-drawer\">\r\n
|
|
4772
|
+
], template: "@if (isVisible) {\r\n <div class=\"background-drawer\" @fade>\r\n <div\r\n class=\"create-container\"\r\n @slideInOut\r\n (@slideInOut.done)=\"onAnimDone($event)\"\r\n >\r\n <div class=\"header-drawer\">\r\n <div class=\"title-header-drawer\">Panel de notificaciones</div>\r\n @if (alerts.length > 0) {\r\n <ius-button-circle-tertiary\r\n class=\"button-header-drawer\"\r\n [iconName]=\"'icon-delete'\"\r\n iusPopoverContent=\"Borrar\"\r\n (buttonClicked)=\"deleteAllAlerts()\"\r\n ></ius-button-circle-tertiary>\r\n }\r\n <ius-button-circle-tertiary\r\n [iconName]=\"'icon-cancel'\"\r\n iusPopoverContent=\"Cerrar\"\r\n (buttonClicked)=\"close()\"\r\n ></ius-button-circle-tertiary>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n <div class=\"scrollable\">\r\n <div [@listContainer]=\"alerts.length\" (@listContainer.done)=\"onListDone()\">\r\n @for (alert of alerts; track trackByAlert($index, alert)) {\r\n <div class=\"notification\" @itemAnim>\r\n <ius-notification-card\r\n [date]=\"(alert?.fechaRegistro | date:'d \\'de\\' MMMM \\'de\\' y, h:mm a')!\"\r\n [title]=\"alert?.titulo\"\r\n [simple]=\"(alert?.tipoAlerta! === 'Simple' ? true : false)! || (alert?.tipoAlerta! === 'Hexti' ? true : false)!\"\r\n [activity]=\"alert?.tipoAlerta! === 'Actividad' ? true : false\"\r\n [confirmable]=\"alert?.tipoAlerta! === 'Confirmacion' ? true : false\"\r\n [body]=\"alert?.descripcion!\"\r\n [fechaActividad]=\"alert?.fechaActividad\"\r\n [mostrarPosponer]=\"alert?.mostrarPosponer\"\r\n (onDone)=\"onClickDone(alert.alertaID!)\"\r\n (onPostpone)=\"onPostpone(alert, $event)\"\r\n [esNavegable]=\"!!alert?.referenciaOrigenId\"\r\n (onEditActivity)=\"onEdit(alert)\"\r\n (onClickAlert)=\"onClickCard(alert)\"\r\n ></ius-notification-card>\r\n </div>\r\n }\r\n </div>\r\n @if (mostrarVacio) {\r\n <div class=\"no-notifications\">\r\n <ius-icon-lg [iconName]=\"'icon-done-outline'\"></ius-icon-lg>\r\n <ius-simple-divider></ius-simple-divider>\r\n <p>No tienes ninguna nueva notificaci\u00F3n o alerta</p>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n}\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.background-drawer{position:absolute;top:0;left:0;display:flex;height:100%;width:100%;justify-content:center;background-color:#0003;transition:.2s ease-in-out;align-items:center;z-index:900}.create-container{height:calc(100vh - 60px);position:absolute;z-index:1000;width:390px;top:60px;right:0;background-color:#fff;border-radius:8px 0 0 8px;box-shadow:0 2px 6px 3px #00000026,0 1px 3px #0000004d;display:flex;flex-direction:column}.header-drawer{display:flex;padding:12px 16px;align-items:center}.title-header-drawer{width:100%;font-family:Roboto,sans-serif;font-size:1.25rem;color:#333;line-height:26px;letter-spacing:.2px;font-weight:500;display:flex;justify-content:start;overflow:hidden;white-space:normal;text-overflow:ellipsis}.notification{padding:2px 5px}.no-notifications{display:flex;width:70%;padding:8px;flex-direction:column;align-items:center;align-self:center;justify-self:center;gap:12px;margin-top:24px}.no-notifications p{flex:1 0 0;margin:0;display:flex;justify-content:center;align-items:center;gap:10px;align-self:stretch;color:#333;text-align:center;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.button-header-drawer{margin-left:3px;margin-top:1px}.scrollable{flex:1 1 auto;min-height:0;padding:5px;overflow-y:auto;overflow-x:hidden}.scrollable::-webkit-scrollbar{-webkit-appearance:none}.scrollable::-webkit-scrollbar:vertical{width:7px}.scrollable::-webkit-scrollbar-thumb{background-color:#d8d6d6;border-radius:20px}\n"] }]
|
|
4752
4773
|
}], propDecorators: { alerts: [{
|
|
4753
4774
|
type: Input,
|
|
4754
4775
|
args: [{ required: true }]
|
|
@@ -4833,6 +4854,7 @@ class ToolbarComponent {
|
|
|
4833
4854
|
this.clickPerfilPreferencias = new EventEmitter();
|
|
4834
4855
|
this.clickReferir = new EventEmitter();
|
|
4835
4856
|
this.clickNotificaciones = new EventEmitter();
|
|
4857
|
+
this.notificacionesAbierto = new EventEmitter();
|
|
4836
4858
|
this.clickServicioVigilancia = new EventEmitter();
|
|
4837
4859
|
this.clickServicioCorreo = new EventEmitter();
|
|
4838
4860
|
this.clickServicioLocalizador = new EventEmitter();
|
|
@@ -5017,6 +5039,7 @@ class ToolbarComponent {
|
|
|
5017
5039
|
onClickNotifications() {
|
|
5018
5040
|
this.notificationsOpen = !this.notificationsOpen;
|
|
5019
5041
|
this.clickNotificaciones.emit();
|
|
5042
|
+
this.notificacionesAbierto.emit(this.notificationsOpen);
|
|
5020
5043
|
}
|
|
5021
5044
|
handleDoneAlert(event) {
|
|
5022
5045
|
this.onDoneAlert.emit(event);
|
|
@@ -5082,11 +5105,11 @@ class ToolbarComponent {
|
|
|
5082
5105
|
this.clickAgregarAccount.emit($event);
|
|
5083
5106
|
}
|
|
5084
5107
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5085
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ToolbarComponent, isStandalone: true, selector: "ius-toolbar", inputs: { object: "object", pagina: "pagina", notificationsCount: "notificationsCount", subscripcionDetalle: "subscripcionDetalle", detallesConsumo: "detallesConsumo", accountList: "accountList", alerts: "alerts", showUsuariosGrupos: "showUsuariosGrupos", showConfiguracionCuenta: "showConfiguracionCuenta", showPagosFacturacion: "showPagosFacturacion", showSubscripcionesServicios: "showSubscripcionesServicios", showReferir: "showReferir", closeForm: "closeForm" }, outputs: { clickOpenToolbarUserMenu: "clickOpenToolbarUserMenu", clickUsuariosRoles: "clickUsuariosRoles", clickConfiguracion: "clickConfiguracion", clickPagos: "clickPagos", clickSubsServicios: "clickSubsServicios", clickCambiarCuenta: "clickCambiarCuenta", clickCerrarSesion: "clickCerrarSesion", clickPerfilPreferencias: "clickPerfilPreferencias", clickReferir: "clickReferir", clickNotificaciones: "clickNotificaciones", clickServicioVigilancia: "clickServicioVigilancia", clickServicioCorreo: "clickServicioCorreo", clickServicioLocalizador: "clickServicioLocalizador", clickServicioFirma: "clickServicioFirma", clickServicioCRM: "clickServicioCRM", clickAccountSelected: "clickAccountSelected", clickAccountPredeterminada: "clickAccountPredeterminada", clickEditAccount: "clickEditAccount", clickUnlinkAccount: "clickUnlinkAccount", clickAgregarAccount: "clickAgregarAccount", onDoneAlert: "onDoneAlert", onPostponeAlert: "onPostponeAlert", onEditAlert: "onEditAlert", onClickAlertEvent: "onClickAlertEvent", onDeleteAllAlerts: "onDeleteAllAlerts", onClickShowTickets: "onClickShowTickets", onClickAddTicket: "onClickAddTicket" }, host: { listeners: { "document:click": "onClickOutside($event)" } }, viewQueries: [{ propertyName: "buttonsAccion", first: true, predicate: ["buttonsAccion"], descendants: true }], ngImport: i0, template: "<div class=\"tlb\">\r\n <div class=\"logo-page\">\r\n <div class=\"logo-lt\">\r\n <img [src]=\"object.logoLt\" alt=\"logo\" />\r\n </div>\r\n <div class=\"page\">{{ pagina }}</div>\r\n </div>\r\n <div class=\"btns\">\r\n <div class=\"tools\">\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-support-agent\"\r\n (buttonClicked)=\"onClickSupport()\"\r\n ></ius-button-circle-tertiary>\r\n <div class=\"notification-wrapper\">\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-notifications\"\r\n (buttonClicked)=\"onClickNotifications()\"\r\n ></ius-button-circle-tertiary>\r\n @if (notificationsCount > 0) {\r\n <span class=\"notification-badge\">{{ notificationsCount }}</span>\r\n }\r\n </div>\r\n <div class=\"relative\" #buttonsAccion>\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-apps\"\r\n (buttonClicked)=\"toggleShowMore()\"\r\n >\r\n </ius-button-circle-tertiary>\r\n\r\n <div class=\"more-box\" [class.active]=\"showButtonsAccion\">\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgLitigio\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioVigilancia()\"\r\n ></span\r\n >Vigilancia\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgCorreo\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioCorreo()\"\r\n ></span\r\n >Correo\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgLocalizador\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioLocalizador()\"\r\n ></span\r\n >Localizador\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgFirma\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioFirma()\"\r\n ></span\r\n >Firma\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgCrm\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioCRM()\"\r\n ></span\r\n >CRM\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <ius-dropdown-user-menu\r\n #userDropdown\r\n [nameUser]=\"object.nombreUsuario\"\r\n class=\"dropdown\"\r\n [avatar]=\"object.avatarUsuario!\"\r\n [logo]=\"object.logoCompany!\"\r\n (buttonClicked)=\"onClickOpenToolbarUserMenu()\"\r\n [closeForm]=\"closeForm\"\r\n >\r\n <ius-toolbar-user-menu\r\n [object]=\"object\"\r\n [accountList]=\"accountList\"\r\n [detallesConsumo]=\"detallesConsumo\"\r\n [subscripcionDetalle]=\"subscripcionDetalle\"\r\n [showUsuariosGrupos]=\"showUsuariosGrupos\"\r\n [showConfiguracionCuenta]=\"showConfiguracionCuenta\"\r\n [showPagosFacturacion]=\"showPagosFacturacion\"\r\n [showSubscripcionesServicios]=\"showSubscripcionesServicios\"\r\n [showReferir]=\"showReferir\"\r\n (clickUsuariosRoles)=\"onClickUsuariosRoles()\"\r\n (clickConfiguracion)=\"onClickConfiguracion()\"\r\n (clickPagos)=\"onClickPagos()\"\r\n (clickSubsServicios)=\"onClickSubsServicios()\"\r\n (clickCambiarCuenta)=\"onClickCambiarCuenta()\"\r\n (clickCerrarSesion)=\"onClickCerrarSesion()\"\r\n (clickPerfilPreferencias)=\"onClickPerfilPreferencias()\"\r\n (clickReferir)=\"onClickReferir()\"\r\n (clickAgregarAccount)=\"onClickAgregarAccount($event)\"\r\n (clickAccountSelected)=\"onClickAccountSelected($event)\"\r\n (clickAccountPredeterminada)=\"onClickAccountPredeterminada($event)\"\r\n (clickEditAccount)=\"onClickEditAccount($event)\"\r\n (clickDesvincularAccount)=\"onClickUnlinkAccount($event)\"\r\n (requestClose)=\"userDropdown.close()\"\r\n ></ius-toolbar-user-menu>\r\n </ius-dropdown-user-menu>\r\n </div>\r\n</div>\r\n\r\n@if (notificationsOpen) {\r\n <ius-notifications\r\n [alerts]=\"alerts ?? []\"\r\n (onPressedBackEvent)=\"onClickNotifications()\"\r\n (onDrawerClosed)=\"notificationsOpen = false\"\r\n (onDoneAlert)=\"handleDoneAlert($event)\"\r\n (onPostponeAlert)=\"handlePostponeAlert($event)\"\r\n (onEditAlert)=\"onEditAlert.emit($event)\"\r\n (onClickAlertEvent)=\"onClickAlertEvent.emit($event)\"\r\n (onDeleteAllAlerts)=\"onDeleteAllAlerts.emit()\"\r\n ></ius-notifications>\r\n}\r\n\r\n@if (supportPanel) {\r\n <ius-support-panel\r\n (onCloseForm)=\"supportPanel = false\"\r\n (onClickAddTicket)=\"onAddTicket()\"\r\n (onClickShowTickets)=\"onShowTickets()\"\r\n ></ius-support-panel>\r\n}\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.tlb{position:relative;height:48px;display:flex;padding:8px 12px 8px 24px;align-items:center;border-bottom:1px solid #eaeaea;background:#fff}.logo-page{display:flex;align-items:center;gap:12px;flex:1 0 0;align-self:stretch}.logo-lt{width:212.876px;height:38px;aspect-ratio:212.88/38}.page{color:#595959;font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:400;line-height:22px}.btns{display:flex;align-items:center;gap:24px}.tools{display:flex;align-items:center;gap:4px}.relative{position:relative}.notification-wrapper{position:relative;display:inline-flex}.notification-badge{position:absolute;top:-2px;right:-2px;min-width:16px;height:16px;padding:0 4px;border-radius:100px;background:#db2e2a;border:1px solid #ffffff;color:#fff;font-family:Roboto,sans-serif;font-size:10px;font-weight:500;line-height:14px;display:flex;align-items:center;justify-content:center;z-index:1}.more-box{position:absolute;top:48px;right:0;padding:12px;gap:8px;display:grid;grid-template-columns:1fr 1fr 1fr;z-index:100;opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity .25s ease,transform .25s ease;border-radius:8px;background:#fff;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}.more-box .item-btn{display:flex;width:90px;height:100px;box-sizing:border-box;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px;text-align:center;cursor:pointer;transition:transform .2s ease;border-radius:8px;border:none;background:#fff;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.more-box .item-btn:hover{transform:translateY(-2px);background:#f6f8fa}.icon-btn{width:64px;height:64px}\n"], dependencies: [{ kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: DropdownUserMenuComponent, selector: "ius-dropdown-user-menu", inputs: ["isActive", "nameUser", "logo", "avatar", "disabled", "iconColor", "closeForm"], outputs: ["buttonClicked"] }, { kind: "component", type: ToolbarUserMenuComponent, selector: "ius-toolbar-user-menu", inputs: ["object", "subscripcionDetalle", "detallesConsumo", "accountList", "showUsuariosGrupos", "showConfiguracionCuenta", "showPagosFacturacion", "showSubscripcionesServicios", "showReferir"], outputs: ["clickPerfilPreferencias", "clickUsuariosRoles", "clickConfiguracion", "clickPagos", "clickSubsServicios", "clickCambiarCuenta", "clickCerrarSesion", "clickReferir", "requestClose", "clickAccountSelected", "clickAccountPredeterminada", "clickEditAccount", "clickDesvincularAccount", "clickAgregarAccount"] }, { kind: "component", type: NotificationsComponent, selector: "ius-notifications", inputs: ["alerts", "titleDrawer", "percentProgressBar"], outputs: ["onDoneAlert", "onPostponeAlert", "onPressedBackEvent", "onDrawerClosed", "onEditAlert", "onClickAlertEvent", "onDeleteAllAlerts"] }, { kind: "component", type: SupportPanelComponent, selector: "ius-support-panel", outputs: ["onCloseForm", "onClickAddTicket", "onClickShowTickets"] }] }); }
|
|
5108
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ToolbarComponent, isStandalone: true, selector: "ius-toolbar", inputs: { object: "object", pagina: "pagina", notificationsCount: "notificationsCount", subscripcionDetalle: "subscripcionDetalle", detallesConsumo: "detallesConsumo", accountList: "accountList", alerts: "alerts", showUsuariosGrupos: "showUsuariosGrupos", showConfiguracionCuenta: "showConfiguracionCuenta", showPagosFacturacion: "showPagosFacturacion", showSubscripcionesServicios: "showSubscripcionesServicios", showReferir: "showReferir", closeForm: "closeForm" }, outputs: { clickOpenToolbarUserMenu: "clickOpenToolbarUserMenu", clickUsuariosRoles: "clickUsuariosRoles", clickConfiguracion: "clickConfiguracion", clickPagos: "clickPagos", clickSubsServicios: "clickSubsServicios", clickCambiarCuenta: "clickCambiarCuenta", clickCerrarSesion: "clickCerrarSesion", clickPerfilPreferencias: "clickPerfilPreferencias", clickReferir: "clickReferir", clickNotificaciones: "clickNotificaciones", notificacionesAbierto: "notificacionesAbierto", clickServicioVigilancia: "clickServicioVigilancia", clickServicioCorreo: "clickServicioCorreo", clickServicioLocalizador: "clickServicioLocalizador", clickServicioFirma: "clickServicioFirma", clickServicioCRM: "clickServicioCRM", clickAccountSelected: "clickAccountSelected", clickAccountPredeterminada: "clickAccountPredeterminada", clickEditAccount: "clickEditAccount", clickUnlinkAccount: "clickUnlinkAccount", clickAgregarAccount: "clickAgregarAccount", onDoneAlert: "onDoneAlert", onPostponeAlert: "onPostponeAlert", onEditAlert: "onEditAlert", onClickAlertEvent: "onClickAlertEvent", onDeleteAllAlerts: "onDeleteAllAlerts", onClickShowTickets: "onClickShowTickets", onClickAddTicket: "onClickAddTicket" }, host: { listeners: { "document:click": "onClickOutside($event)" } }, viewQueries: [{ propertyName: "buttonsAccion", first: true, predicate: ["buttonsAccion"], descendants: true }], ngImport: i0, template: "<div class=\"tlb\">\r\n <div class=\"logo-page\">\r\n <div class=\"logo-lt\">\r\n <img [src]=\"object.logoLt\" alt=\"logo\" />\r\n </div>\r\n <div class=\"page\">{{ pagina }}</div>\r\n </div>\r\n <div class=\"btns\">\r\n <div class=\"tools\">\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-support-agent\"\r\n (buttonClicked)=\"onClickSupport()\"\r\n ></ius-button-circle-tertiary>\r\n <div class=\"notification-wrapper\">\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-notifications\"\r\n (buttonClicked)=\"onClickNotifications()\"\r\n ></ius-button-circle-tertiary>\r\n @if (notificationsCount > 0) {\r\n <span class=\"notification-badge\">{{ notificationsCount }}</span>\r\n }\r\n </div>\r\n <div class=\"relative\" #buttonsAccion>\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-apps\"\r\n (buttonClicked)=\"toggleShowMore()\"\r\n >\r\n </ius-button-circle-tertiary>\r\n\r\n <div class=\"more-box\" [class.active]=\"showButtonsAccion\">\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgLitigio\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioVigilancia()\"\r\n ></span\r\n >Vigilancia\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgCorreo\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioCorreo()\"\r\n ></span\r\n >Correo\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgLocalizador\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioLocalizador()\"\r\n ></span\r\n >Localizador\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgFirma\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioFirma()\"\r\n ></span\r\n >Firma\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgCrm\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioCRM()\"\r\n ></span\r\n >CRM\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <ius-dropdown-user-menu\r\n #userDropdown\r\n [nameUser]=\"object.nombreUsuario\"\r\n class=\"dropdown\"\r\n [avatar]=\"object.avatarUsuario!\"\r\n [logo]=\"object.logoCompany!\"\r\n (buttonClicked)=\"onClickOpenToolbarUserMenu()\"\r\n [closeForm]=\"closeForm\"\r\n >\r\n <ius-toolbar-user-menu\r\n [object]=\"object\"\r\n [accountList]=\"accountList\"\r\n [detallesConsumo]=\"detallesConsumo\"\r\n [subscripcionDetalle]=\"subscripcionDetalle\"\r\n [showUsuariosGrupos]=\"showUsuariosGrupos\"\r\n [showConfiguracionCuenta]=\"showConfiguracionCuenta\"\r\n [showPagosFacturacion]=\"showPagosFacturacion\"\r\n [showSubscripcionesServicios]=\"showSubscripcionesServicios\"\r\n [showReferir]=\"showReferir\"\r\n (clickUsuariosRoles)=\"onClickUsuariosRoles()\"\r\n (clickConfiguracion)=\"onClickConfiguracion()\"\r\n (clickPagos)=\"onClickPagos()\"\r\n (clickSubsServicios)=\"onClickSubsServicios()\"\r\n (clickCambiarCuenta)=\"onClickCambiarCuenta()\"\r\n (clickCerrarSesion)=\"onClickCerrarSesion()\"\r\n (clickPerfilPreferencias)=\"onClickPerfilPreferencias()\"\r\n (clickReferir)=\"onClickReferir()\"\r\n (clickAgregarAccount)=\"onClickAgregarAccount($event)\"\r\n (clickAccountSelected)=\"onClickAccountSelected($event)\"\r\n (clickAccountPredeterminada)=\"onClickAccountPredeterminada($event)\"\r\n (clickEditAccount)=\"onClickEditAccount($event)\"\r\n (clickDesvincularAccount)=\"onClickUnlinkAccount($event)\"\r\n (requestClose)=\"userDropdown.close()\"\r\n ></ius-toolbar-user-menu>\r\n </ius-dropdown-user-menu>\r\n </div>\r\n</div>\r\n\r\n@if (notificationsOpen) {\r\n <ius-notifications\r\n [alerts]=\"alerts ?? []\"\r\n (onPressedBackEvent)=\"onClickNotifications()\"\r\n (onDrawerClosed)=\"notificationsOpen = false; notificacionesAbierto.emit(false)\"\r\n (onDoneAlert)=\"handleDoneAlert($event)\"\r\n (onPostponeAlert)=\"handlePostponeAlert($event)\"\r\n (onEditAlert)=\"onEditAlert.emit($event)\"\r\n (onClickAlertEvent)=\"onClickAlertEvent.emit($event)\"\r\n (onDeleteAllAlerts)=\"onDeleteAllAlerts.emit()\"\r\n ></ius-notifications>\r\n}\r\n\r\n@if (supportPanel) {\r\n <ius-support-panel\r\n (onCloseForm)=\"supportPanel = false\"\r\n (onClickAddTicket)=\"onAddTicket()\"\r\n (onClickShowTickets)=\"onShowTickets()\"\r\n ></ius-support-panel>\r\n}\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.tlb{position:relative;height:48px;display:flex;padding:8px 12px 8px 24px;align-items:center;border-bottom:1px solid #eaeaea;background:#fff}.logo-page{display:flex;align-items:center;gap:12px;flex:1 0 0;align-self:stretch}.logo-lt{width:212.876px;height:38px;aspect-ratio:212.88/38}.page{color:#595959;font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:400;line-height:22px}.btns{display:flex;align-items:center;gap:24px}.tools{display:flex;align-items:center;gap:4px}.relative{position:relative}.notification-wrapper{position:relative;display:inline-flex}.notification-badge{position:absolute;top:-2px;right:-2px;min-width:16px;height:16px;padding:0 4px;border-radius:100px;background:#db2e2a;border:1px solid #ffffff;color:#fff;font-family:Roboto,sans-serif;font-size:10px;font-weight:500;line-height:14px;display:flex;align-items:center;justify-content:center;z-index:1}.more-box{position:absolute;top:48px;right:0;padding:12px;gap:8px;display:grid;grid-template-columns:1fr 1fr 1fr;z-index:100;opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity .25s ease,transform .25s ease;border-radius:8px;background:#fff;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}.more-box .item-btn{display:flex;width:90px;height:100px;box-sizing:border-box;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px;text-align:center;cursor:pointer;transition:transform .2s ease;border-radius:8px;border:none;background:#fff;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.more-box .item-btn:hover{transform:translateY(-2px);background:#f6f8fa}.icon-btn{width:64px;height:64px}\n"], dependencies: [{ kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: DropdownUserMenuComponent, selector: "ius-dropdown-user-menu", inputs: ["isActive", "nameUser", "logo", "avatar", "disabled", "iconColor", "closeForm"], outputs: ["buttonClicked"] }, { kind: "component", type: ToolbarUserMenuComponent, selector: "ius-toolbar-user-menu", inputs: ["object", "subscripcionDetalle", "detallesConsumo", "accountList", "showUsuariosGrupos", "showConfiguracionCuenta", "showPagosFacturacion", "showSubscripcionesServicios", "showReferir"], outputs: ["clickPerfilPreferencias", "clickUsuariosRoles", "clickConfiguracion", "clickPagos", "clickSubsServicios", "clickCambiarCuenta", "clickCerrarSesion", "clickReferir", "requestClose", "clickAccountSelected", "clickAccountPredeterminada", "clickEditAccount", "clickDesvincularAccount", "clickAgregarAccount"] }, { kind: "component", type: NotificationsComponent, selector: "ius-notifications", inputs: ["alerts", "titleDrawer", "percentProgressBar"], outputs: ["onDoneAlert", "onPostponeAlert", "onPressedBackEvent", "onDrawerClosed", "onEditAlert", "onClickAlertEvent", "onDeleteAllAlerts"] }, { kind: "component", type: SupportPanelComponent, selector: "ius-support-panel", outputs: ["onCloseForm", "onClickAddTicket", "onClickShowTickets"] }] }); }
|
|
5086
5109
|
}
|
|
5087
5110
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToolbarComponent, decorators: [{
|
|
5088
5111
|
type: Component,
|
|
5089
|
-
args: [{ selector: 'ius-toolbar', standalone: true, imports: [ButtonCircleTertiaryComponent, DropdownUserMenuComponent, ToolbarUserMenuComponent, NotificationsComponent, SupportPanelComponent], template: "<div class=\"tlb\">\r\n <div class=\"logo-page\">\r\n <div class=\"logo-lt\">\r\n <img [src]=\"object.logoLt\" alt=\"logo\" />\r\n </div>\r\n <div class=\"page\">{{ pagina }}</div>\r\n </div>\r\n <div class=\"btns\">\r\n <div class=\"tools\">\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-support-agent\"\r\n (buttonClicked)=\"onClickSupport()\"\r\n ></ius-button-circle-tertiary>\r\n <div class=\"notification-wrapper\">\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-notifications\"\r\n (buttonClicked)=\"onClickNotifications()\"\r\n ></ius-button-circle-tertiary>\r\n @if (notificationsCount > 0) {\r\n <span class=\"notification-badge\">{{ notificationsCount }}</span>\r\n }\r\n </div>\r\n <div class=\"relative\" #buttonsAccion>\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-apps\"\r\n (buttonClicked)=\"toggleShowMore()\"\r\n >\r\n </ius-button-circle-tertiary>\r\n\r\n <div class=\"more-box\" [class.active]=\"showButtonsAccion\">\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgLitigio\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioVigilancia()\"\r\n ></span\r\n >Vigilancia\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgCorreo\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioCorreo()\"\r\n ></span\r\n >Correo\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgLocalizador\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioLocalizador()\"\r\n ></span\r\n >Localizador\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgFirma\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioFirma()\"\r\n ></span\r\n >Firma\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgCrm\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioCRM()\"\r\n ></span\r\n >CRM\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <ius-dropdown-user-menu\r\n #userDropdown\r\n [nameUser]=\"object.nombreUsuario\"\r\n class=\"dropdown\"\r\n [avatar]=\"object.avatarUsuario!\"\r\n [logo]=\"object.logoCompany!\"\r\n (buttonClicked)=\"onClickOpenToolbarUserMenu()\"\r\n [closeForm]=\"closeForm\"\r\n >\r\n <ius-toolbar-user-menu\r\n [object]=\"object\"\r\n [accountList]=\"accountList\"\r\n [detallesConsumo]=\"detallesConsumo\"\r\n [subscripcionDetalle]=\"subscripcionDetalle\"\r\n [showUsuariosGrupos]=\"showUsuariosGrupos\"\r\n [showConfiguracionCuenta]=\"showConfiguracionCuenta\"\r\n [showPagosFacturacion]=\"showPagosFacturacion\"\r\n [showSubscripcionesServicios]=\"showSubscripcionesServicios\"\r\n [showReferir]=\"showReferir\"\r\n (clickUsuariosRoles)=\"onClickUsuariosRoles()\"\r\n (clickConfiguracion)=\"onClickConfiguracion()\"\r\n (clickPagos)=\"onClickPagos()\"\r\n (clickSubsServicios)=\"onClickSubsServicios()\"\r\n (clickCambiarCuenta)=\"onClickCambiarCuenta()\"\r\n (clickCerrarSesion)=\"onClickCerrarSesion()\"\r\n (clickPerfilPreferencias)=\"onClickPerfilPreferencias()\"\r\n (clickReferir)=\"onClickReferir()\"\r\n (clickAgregarAccount)=\"onClickAgregarAccount($event)\"\r\n (clickAccountSelected)=\"onClickAccountSelected($event)\"\r\n (clickAccountPredeterminada)=\"onClickAccountPredeterminada($event)\"\r\n (clickEditAccount)=\"onClickEditAccount($event)\"\r\n (clickDesvincularAccount)=\"onClickUnlinkAccount($event)\"\r\n (requestClose)=\"userDropdown.close()\"\r\n ></ius-toolbar-user-menu>\r\n </ius-dropdown-user-menu>\r\n </div>\r\n</div>\r\n\r\n@if (notificationsOpen) {\r\n <ius-notifications\r\n [alerts]=\"alerts ?? []\"\r\n (onPressedBackEvent)=\"onClickNotifications()\"\r\n (onDrawerClosed)=\"notificationsOpen = false\"\r\n (onDoneAlert)=\"handleDoneAlert($event)\"\r\n (onPostponeAlert)=\"handlePostponeAlert($event)\"\r\n (onEditAlert)=\"onEditAlert.emit($event)\"\r\n (onClickAlertEvent)=\"onClickAlertEvent.emit($event)\"\r\n (onDeleteAllAlerts)=\"onDeleteAllAlerts.emit()\"\r\n ></ius-notifications>\r\n}\r\n\r\n@if (supportPanel) {\r\n <ius-support-panel\r\n (onCloseForm)=\"supportPanel = false\"\r\n (onClickAddTicket)=\"onAddTicket()\"\r\n (onClickShowTickets)=\"onShowTickets()\"\r\n ></ius-support-panel>\r\n}\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.tlb{position:relative;height:48px;display:flex;padding:8px 12px 8px 24px;align-items:center;border-bottom:1px solid #eaeaea;background:#fff}.logo-page{display:flex;align-items:center;gap:12px;flex:1 0 0;align-self:stretch}.logo-lt{width:212.876px;height:38px;aspect-ratio:212.88/38}.page{color:#595959;font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:400;line-height:22px}.btns{display:flex;align-items:center;gap:24px}.tools{display:flex;align-items:center;gap:4px}.relative{position:relative}.notification-wrapper{position:relative;display:inline-flex}.notification-badge{position:absolute;top:-2px;right:-2px;min-width:16px;height:16px;padding:0 4px;border-radius:100px;background:#db2e2a;border:1px solid #ffffff;color:#fff;font-family:Roboto,sans-serif;font-size:10px;font-weight:500;line-height:14px;display:flex;align-items:center;justify-content:center;z-index:1}.more-box{position:absolute;top:48px;right:0;padding:12px;gap:8px;display:grid;grid-template-columns:1fr 1fr 1fr;z-index:100;opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity .25s ease,transform .25s ease;border-radius:8px;background:#fff;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}.more-box .item-btn{display:flex;width:90px;height:100px;box-sizing:border-box;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px;text-align:center;cursor:pointer;transition:transform .2s ease;border-radius:8px;border:none;background:#fff;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.more-box .item-btn:hover{transform:translateY(-2px);background:#f6f8fa}.icon-btn{width:64px;height:64px}\n"] }]
|
|
5112
|
+
args: [{ selector: 'ius-toolbar', standalone: true, imports: [ButtonCircleTertiaryComponent, DropdownUserMenuComponent, ToolbarUserMenuComponent, NotificationsComponent, SupportPanelComponent], template: "<div class=\"tlb\">\r\n <div class=\"logo-page\">\r\n <div class=\"logo-lt\">\r\n <img [src]=\"object.logoLt\" alt=\"logo\" />\r\n </div>\r\n <div class=\"page\">{{ pagina }}</div>\r\n </div>\r\n <div class=\"btns\">\r\n <div class=\"tools\">\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-support-agent\"\r\n (buttonClicked)=\"onClickSupport()\"\r\n ></ius-button-circle-tertiary>\r\n <div class=\"notification-wrapper\">\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-notifications\"\r\n (buttonClicked)=\"onClickNotifications()\"\r\n ></ius-button-circle-tertiary>\r\n @if (notificationsCount > 0) {\r\n <span class=\"notification-badge\">{{ notificationsCount }}</span>\r\n }\r\n </div>\r\n <div class=\"relative\" #buttonsAccion>\r\n <ius-button-circle-tertiary\r\n iconName=\"icon-apps\"\r\n (buttonClicked)=\"toggleShowMore()\"\r\n >\r\n </ius-button-circle-tertiary>\r\n\r\n <div class=\"more-box\" [class.active]=\"showButtonsAccion\">\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgLitigio\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioVigilancia()\"\r\n ></span\r\n >Vigilancia\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgCorreo\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioCorreo()\"\r\n ></span\r\n >Correo\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgLocalizador\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioLocalizador()\"\r\n ></span\r\n >Localizador\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgFirma\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioFirma()\"\r\n ></span\r\n >Firma\r\n </button>\r\n <button class=\"item-btn\">\r\n <span\r\n [innerHTML]=\"svgCrm\"\r\n class=\"icon-btn\"\r\n (click)=\"onClickServicioCRM()\"\r\n ></span\r\n >CRM\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <ius-dropdown-user-menu\r\n #userDropdown\r\n [nameUser]=\"object.nombreUsuario\"\r\n class=\"dropdown\"\r\n [avatar]=\"object.avatarUsuario!\"\r\n [logo]=\"object.logoCompany!\"\r\n (buttonClicked)=\"onClickOpenToolbarUserMenu()\"\r\n [closeForm]=\"closeForm\"\r\n >\r\n <ius-toolbar-user-menu\r\n [object]=\"object\"\r\n [accountList]=\"accountList\"\r\n [detallesConsumo]=\"detallesConsumo\"\r\n [subscripcionDetalle]=\"subscripcionDetalle\"\r\n [showUsuariosGrupos]=\"showUsuariosGrupos\"\r\n [showConfiguracionCuenta]=\"showConfiguracionCuenta\"\r\n [showPagosFacturacion]=\"showPagosFacturacion\"\r\n [showSubscripcionesServicios]=\"showSubscripcionesServicios\"\r\n [showReferir]=\"showReferir\"\r\n (clickUsuariosRoles)=\"onClickUsuariosRoles()\"\r\n (clickConfiguracion)=\"onClickConfiguracion()\"\r\n (clickPagos)=\"onClickPagos()\"\r\n (clickSubsServicios)=\"onClickSubsServicios()\"\r\n (clickCambiarCuenta)=\"onClickCambiarCuenta()\"\r\n (clickCerrarSesion)=\"onClickCerrarSesion()\"\r\n (clickPerfilPreferencias)=\"onClickPerfilPreferencias()\"\r\n (clickReferir)=\"onClickReferir()\"\r\n (clickAgregarAccount)=\"onClickAgregarAccount($event)\"\r\n (clickAccountSelected)=\"onClickAccountSelected($event)\"\r\n (clickAccountPredeterminada)=\"onClickAccountPredeterminada($event)\"\r\n (clickEditAccount)=\"onClickEditAccount($event)\"\r\n (clickDesvincularAccount)=\"onClickUnlinkAccount($event)\"\r\n (requestClose)=\"userDropdown.close()\"\r\n ></ius-toolbar-user-menu>\r\n </ius-dropdown-user-menu>\r\n </div>\r\n</div>\r\n\r\n@if (notificationsOpen) {\r\n <ius-notifications\r\n [alerts]=\"alerts ?? []\"\r\n (onPressedBackEvent)=\"onClickNotifications()\"\r\n (onDrawerClosed)=\"notificationsOpen = false; notificacionesAbierto.emit(false)\"\r\n (onDoneAlert)=\"handleDoneAlert($event)\"\r\n (onPostponeAlert)=\"handlePostponeAlert($event)\"\r\n (onEditAlert)=\"onEditAlert.emit($event)\"\r\n (onClickAlertEvent)=\"onClickAlertEvent.emit($event)\"\r\n (onDeleteAllAlerts)=\"onDeleteAllAlerts.emit()\"\r\n ></ius-notifications>\r\n}\r\n\r\n@if (supportPanel) {\r\n <ius-support-panel\r\n (onCloseForm)=\"supportPanel = false\"\r\n (onClickAddTicket)=\"onAddTicket()\"\r\n (onClickShowTickets)=\"onShowTickets()\"\r\n ></ius-support-panel>\r\n}\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.tlb{position:relative;height:48px;display:flex;padding:8px 12px 8px 24px;align-items:center;border-bottom:1px solid #eaeaea;background:#fff}.logo-page{display:flex;align-items:center;gap:12px;flex:1 0 0;align-self:stretch}.logo-lt{width:212.876px;height:38px;aspect-ratio:212.88/38}.page{color:#595959;font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:400;line-height:22px}.btns{display:flex;align-items:center;gap:24px}.tools{display:flex;align-items:center;gap:4px}.relative{position:relative}.notification-wrapper{position:relative;display:inline-flex}.notification-badge{position:absolute;top:-2px;right:-2px;min-width:16px;height:16px;padding:0 4px;border-radius:100px;background:#db2e2a;border:1px solid #ffffff;color:#fff;font-family:Roboto,sans-serif;font-size:10px;font-weight:500;line-height:14px;display:flex;align-items:center;justify-content:center;z-index:1}.more-box{position:absolute;top:48px;right:0;padding:12px;gap:8px;display:grid;grid-template-columns:1fr 1fr 1fr;z-index:100;opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity .25s ease,transform .25s ease;border-radius:8px;background:#fff;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}.more-box .item-btn{display:flex;width:90px;height:100px;box-sizing:border-box;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px;text-align:center;cursor:pointer;transition:transform .2s ease;border-radius:8px;border:none;background:#fff;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.more-box .item-btn:hover{transform:translateY(-2px);background:#f6f8fa}.icon-btn{width:64px;height:64px}\n"] }]
|
|
5090
5113
|
}], ctorParameters: () => [{ type: i1.DomSanitizer }], propDecorators: { object: [{
|
|
5091
5114
|
type: Input,
|
|
5092
5115
|
args: [{ required: true }]
|
|
@@ -5134,6 +5157,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
5134
5157
|
type: Output
|
|
5135
5158
|
}], clickNotificaciones: [{
|
|
5136
5159
|
type: Output
|
|
5160
|
+
}], notificacionesAbierto: [{
|
|
5161
|
+
type: Output
|
|
5137
5162
|
}], clickServicioVigilancia: [{
|
|
5138
5163
|
type: Output
|
|
5139
5164
|
}], clickServicioCorreo: [{
|