@litigiovirtual/ius-design-components 1.0.171 → 1.0.173
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/alert/alert.component.mjs +76 -0
- package/esm2022/lib/alert/index.mjs +2 -0
- package/esm2022/lib/simple-card-contador/simple-card-contador.component.mjs +30 -16
- package/esm2022/lib/toolbar-user-menu/toolbar-user-menu.component.mjs +3 -3
- package/esm2022/public-api.mjs +2 -1
- package/fesm2022/litigiovirtual-ius-design-components.mjs +100 -19
- package/fesm2022/litigiovirtual-ius-design-components.mjs.map +1 -1
- package/lib/alert/alert.component.d.ts +22 -0
- package/lib/alert/index.d.ts +1 -0
- package/lib/simple-card-contador/simple-card-contador.component.d.ts +5 -3
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
|
@@ -10,7 +10,7 @@ import * as i1$2 from '@angular/forms';
|
|
|
10
10
|
import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
11
11
|
import * as i1$3 from '@angular/router';
|
|
12
12
|
import { RouterLink, RouterLinkActive } from '@angular/router';
|
|
13
|
-
import { ComponentPortal, PortalModule } from '@angular/cdk/portal';
|
|
13
|
+
import { ComponentPortal, PortalModule, TemplatePortal } from '@angular/cdk/portal';
|
|
14
14
|
import localeEs from '@angular/common/locales/es';
|
|
15
15
|
|
|
16
16
|
const ICONS = {
|
|
@@ -3626,11 +3626,11 @@ class ToolbarUserMenuComponent {
|
|
|
3626
3626
|
this.clickAgregarAccount.emit();
|
|
3627
3627
|
}
|
|
3628
3628
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToolbarUserMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3629
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ToolbarUserMenuComponent, isStandalone: true, selector: "ius-toolbar-user-menu", inputs: { object: "object", detailSubscripcion: "detailSubscripcion", detailsConsumo: "detailsConsumo", accountsList: "accountsList" }, outputs: { clickPerfilPreferencias: "clickPerfilPreferencias", clickUsuariosRoles: "clickUsuariosRoles", clickConfiguracion: "clickConfiguracion", clickPagos: "clickPagos", clickSubsServicios: "clickSubsServicios", clickCambiarCuenta: "clickCambiarCuenta", clickCerrarSesion: "clickCerrarSesion", clickReferir: "clickReferir", clickAccountSelected: "clickAccountSelected", clickAccountPredeterminada: "clickAccountPredeterminada", clickEditAccount: "clickEditAccount", clickDesvincularAccount: "clickDesvincularAccount", clickAgregarAccount: "clickAgregarAccount" }, ngImport: i0, template: "<div class=\"tbl-menu\">\r\n <div class=\"body-menu scrollable\">\r\n <div class=\"colum-mn-1 text-head-mn\">\r\n <span>Estas navegando en</span>\r\n <div class=\"tx-row-1\">\r\n <ius-icon-sm iconName=\"icon-account-circle\" class=\"icon-acc-circle\"></ius-icon-sm>\r\n <span class=\"h4 tx-abog\">{{object.nombreCompany}}</span>\r\n </div>\r\n <div class=\"tx-row-1 id-ct\">\r\n <span>ID Cuenta</span>\r\n <span class=\"tx-id-ct\">{{object.cuentaID}}</span>\r\n </div>\r\n <div class=\"tx-row-1 tx-rol\">\r\n <span>Tu rol</span>\r\n <span class=\"tx-name-rl\">{{object.rol}}</span>\r\n </div>\r\n </div>\r\n @if(!showFormSwitchAccount){\r\n <div class=\"colum-mn-1\">\r\n <div class=\"email-inf\">\r\n <ius-icon-xs iconName=\"icon-alternate-email\" class=\"icon-alt-email\"></ius-icon-xs>\r\n <span>{{object.correo}}</span>\r\n </div>\r\n <ius-dropdown-option-item (click)=\"onClickPerfilPreferencias()\">Perfil, preferencias y\r\n seguridad</ius-dropdown-option-item>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n <div class=\"container-plan\" [ngClass]=\"{ 'show-more': showMore }\">\r\n <div class=\"inf-plan\">\r\n <div class=\"row-plan-1\">\r\n <div class=\"col-plan-1\">\r\n <span class=\"tx-small tx-tipo-plan\">{{detailSubscripcion?.tipoServicio}}</span>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-base tx-name-plan\">{{detailSubscripcion?.namePlan}}</span>\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-help\"></ius-icon-md>\r\n </div>\r\n <div class=\"tx-row-2 tx-small\">\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Total global</span>\r\n <span class=\"tx-contador-2\">{{detailSubscripcion?.cantTotal}}</span>\r\n </div>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Disponible global</span>\r\n <span class=\"tx-contador-2\">{{detailSubscripcion?.cantDisponible}}</span>\r\n </div>\r\n </div>\r\n <span class=\"tx-base tx-estado-plan\">{{detailSubscripcion?.estado}}</span>\r\n </div>\r\n <ius-button-circle-tertiary iconName=\"icon-discover-tune\"></ius-button-circle-tertiary>\r\n </div>\r\n <div style=\"width: 100%;\">\r\n <ius-progress-bar [total]=\"detailSubscripcion?.cantTotal!\" [titleV1]=\"'Insolvencia'\"\r\n [v1]=\"detailSubscripcion?.cantInsolvencia!\" [titleV2]=\"'Judicial'\"\r\n [v2]=\"detailSubscripcion?.cantJudicial!\" [v3]=\"detailSubscripcion?.cantProcesos3!\"\r\n [v4]=\"detailSubscripcion?.cantProcesos4!\"></ius-progress-bar>\r\n </div>\r\n <div class=\"legend\">\r\n <div class=\"item-counter tx-small\">\r\n <ius-icon-xs iconName=\"icon-storage-set\" class=\"icon-storage-set\"></ius-icon-xs>\r\n <span>{{detailSubscripcion?.asignados}}</span>\r\n </div>\r\n <div class=\"item-counter tx-small\">\r\n <ius-icon-xs iconName=\"icon-storage-plus\" class=\"icon-storage-plus\"></ius-icon-xs>\r\n <span>{{detailSubscripcion?.cantAsignadaDisponible}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n @if (detailsConsumo) {\r\n @for (detail of detailsConsumo; track $index) {\r\n <div class=\"inf-plan\">\r\n <div class=\"row-plan-1\">\r\n <div class=\"col-plan-1\">\r\n <span class=\"tx-small tx-tipo-plan\">{{detail.tipoServicio}}</span>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-base tx-name-plan\">Por consumo</span>\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-help\"></ius-icon-md>\r\n </div>\r\n <div class=\"tx-row-2 tx-small\">\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Consumo este mes</span>\r\n <span class=\"tx-contador-2\">{{detail.cantConsumida}}</span>\r\n </div>\r\n </div>\r\n <span class=\"tx-base tx-estado-plan\">{{detail.estado}}</span>\r\n </div>\r\n <ius-button-circle-tertiary iconName=\"icon-discover-tune\"></ius-button-circle-tertiary>\r\n </div>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n }\r\n }\r\n </div>\r\n <ius-button-standard-tertiary class=\"btn-list\"\r\n [iconName]=\"showMore ? 'icon-keyboard-arrow-up' : 'icon-keyboard-arrow-down'\"\r\n (buttonClicked)=\"clickShowMore()\">\r\n {{ showMore ? 'Mostrar menos' : 'Mostrar m\u00E1s' }}\r\n </ius-button-standard-tertiary>\r\n <ius-simple-divider></ius-simple-divider>\r\n <div class=\"ctn-items\">\r\n <ius-menu-item iconName=\"icon-groups\" (buttonClicked)=\"onClickUsuariosRoles()\">Usuarios y\r\n roles</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-build\" (buttonClicked)=\"onClickConfiguracion()\">Configuraci\u00F3n de la\r\n cuenta</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-finance-chip\" (buttonClicked)=\"onClickPagos()\">Pagos y\r\n facturaci\u00F3n</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-enterprise\" (buttonClicked)=\"onClickSubsServicios()\">Suscripciones y\r\n servicios</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-stream\" (buttonClicked)=\"onClickReferir()\">Referir servicio</ius-menu-item>\r\n </div>\r\n\r\n <ius-simple-divider></ius-simple-divider>\r\n } @else {\r\n <div class=\"container-bottom\">\r\n <span class=\"tx-row-1 tx-rol\">Cambiar a</span>\r\n <div class=\"container-list\">\r\n @for (account of accountsList; track account; let i = $index) {\r\n <ius-button-accounts (accountSelected)=\"onClickAccount(account)\"\r\n (onPressedPredeterminado)=\"clickAccountPredeterminada.emit(account)\" ,\r\n (onPressedEditar)=\"clickEditAccount.emit(account)\" ,\r\n (onPressedDesvincular)=\"clickDesvincularAccount.emit(account)\"\r\n [account]=\"account\"></ius-button-accounts>\r\n }\r\n </div>\r\n <ius-button-standard-tertiary [iconName]=\"'icon-add'\" (buttonClicked)=\"addAccount()\">Agregar\r\n nueva cuenta</ius-button-standard-tertiary>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"ctn-items mgt-8\">\r\n <ius-menu-item iconName=\"{{!showFormSwitchAccount ? 'icon-cases' : 'icon-arrow-left-alt'}}\"\r\n (buttonClicked)=\"onClickCambiarCuenta()\">{{!showFormSwitchAccount ? 'Cambiar de cuenta' : 'Volver al menu de\r\n usuario'}}</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-exit-to-app\" (buttonClicked)=\"onClickCerrarSesion()\">Cerrar sesi\u00F3n</ius-menu-item>\r\n </div>\r\n</div>", 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}.tbl-menu{display:flex;width:390px;height:85vh;padding:16px;flex-direction:column}.body-menu{display:flex;flex:1 0 0;flex-direction:column;padding-right:6px;gap:8px;font-family:Rubik,sans-serif;overflow-y:auto;min-height:0}.colum-mn-1{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.text-head-mn{color:#8c8c8c;font-size:.75rem;line-height:16px;letter-spacing:.24px}.icon-acc-circle{color:#595959}.tx-row-1{display:flex;align-items:center;gap:4px}.tx-abog{color:#333;letter-spacing:.2px}.id-ct{padding:4px;border-radius:4px;border:1px solid #d9d9d9}.tx-id-ct{font-weight:500}.tx-rol{font-size:.875rem;color:#595959;line-height:20px}.tx-name-rl{color:#333;letter-spacing:.28px;font-weight:500}.email-inf{display:flex;padding:8px;align-items:center;gap:4px;color:#595959;font-size:.875rem;line-height:20px;letter-spacing:.28px}.icon-alt-email{color:#7caf25}ius-dropdown-option-item{width:100%}.container-plan{overflow:hidden;max-height:200px;transition:max-height .5s cubic-bezier(.4,0,.2,1);flex-shrink:0}.inf-plan{display:flex;padding:8px;flex-direction:column;align-items:flex-start;gap:8px}.show-more{max-height:10000px;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.tx-small{font-size:.75rem;line-height:16px;letter-spacing:.24px}.tx-base{font-size:.875rem;line-height:20px;letter-spacing:.28px}.row-plan-1{display:flex;gap:12px;width:100%}.col-plan-1{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;flex:1 0 0}.icon-help{color:#8c8c8c}.tx-tipo-plan{color:#595959;font-weight:500}.tx-name-plan{color:#333;font-weight:500}.tx-row-2{display:flex;align-items:center;gap:8px}.tx-contador-1{color:#8c8c8c;font-weight:500}.tx-contador-2{color:#333}.tx-estado-plan{color:#7caf25}.mgt-8{margin-top:8px}.progress-container{width:100%;border-radius:100px;height:23px;overflow:hidden;background:#f0f0f0}.progress-bar{display:flex;height:100%}.segment{height:100%}.tipo-1-color-bar{background:#5892ff}.tipo-1-color{color:#5892ff}.tipo-2-color-bar{background:#103ab7}.tipo-2-color{color:#103ab7}.legend{display:flex;width:100%;align-items:center;gap:8px;flex-wrap:wrap}.legend .icon-storage-set{color:#103ab7}.legend .icon-storage-plus{color:#629219}.item-counter{display:flex;align-items:center;gap:4px;color:#333}.tx-name-serv{color:#595959;font-weight:500}.btn-list{margin-bottom:8px}.ctn-items{display:flex;flex-direction:column;gap:4px}.scrollable{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}.container-bottom{padding:0 16px;display:flex;flex-direction:column;gap:8px}.container-list{display:flex;flex-direction:column;gap:4px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "component", type: IconXsComponent, selector: "ius-icon-xs", inputs: ["iconName", "color"] }, { kind: "component", type: DropdownOptionItemComponent, selector: "ius-dropdown-option-item", inputs: ["iconName", "route"], outputs: ["click"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonStandardTertiaryComponent, selector: "ius-button-standard-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: MenuItemComponent, selector: "ius-menu-item", inputs: ["isActive", "iconName", "numberAlerts"], outputs: ["buttonClicked"] }, { kind: "component", type: ProgressBarComponent, selector: "ius-progress-bar", inputs: ["total", "v1", "v2", "v3", "v4", "titleV1", "titleV2", "titleV3", "titleV4"] }, { kind: "component", type: ButtonAccountsComponent, selector: "ius-button-accounts", inputs: ["account"], outputs: ["accountSelected", "onPressedPredeterminado", "onPressedDesvincular", "onPressedEditar"] }] }); }
|
|
3629
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ToolbarUserMenuComponent, isStandalone: true, selector: "ius-toolbar-user-menu", inputs: { object: "object", detailSubscripcion: "detailSubscripcion", detailsConsumo: "detailsConsumo", accountsList: "accountsList" }, outputs: { clickPerfilPreferencias: "clickPerfilPreferencias", clickUsuariosRoles: "clickUsuariosRoles", clickConfiguracion: "clickConfiguracion", clickPagos: "clickPagos", clickSubsServicios: "clickSubsServicios", clickCambiarCuenta: "clickCambiarCuenta", clickCerrarSesion: "clickCerrarSesion", clickReferir: "clickReferir", clickAccountSelected: "clickAccountSelected", clickAccountPredeterminada: "clickAccountPredeterminada", clickEditAccount: "clickEditAccount", clickDesvincularAccount: "clickDesvincularAccount", clickAgregarAccount: "clickAgregarAccount" }, ngImport: i0, template: "<div class=\"tbl-menu\">\r\n <div class=\"body-menu scrollable\">\r\n <div class=\"colum-mn-1 text-head-mn\">\r\n <span>Estas navegando en</span>\r\n <div class=\"tx-row-1\">\r\n <ius-icon-sm iconName=\"icon-account-circle\" class=\"icon-acc-circle\"></ius-icon-sm>\r\n <span class=\"h4 tx-abog\">{{object.nombreCompany}}</span>\r\n </div>\r\n <div class=\"tx-row-1 id-ct\">\r\n <span>ID Cuenta</span>\r\n <span class=\"tx-id-ct\">{{object.cuentaID}}</span>\r\n </div>\r\n <div class=\"tx-row-1 tx-rol\">\r\n <span>Tu rol</span>\r\n <span class=\"tx-name-rl\">{{object.rol}}</span>\r\n </div>\r\n </div>\r\n @if(!showFormSwitchAccount){\r\n <div class=\"colum-mn-1\">\r\n <div class=\"email-inf\">\r\n <ius-icon-xs iconName=\"icon-alternate-email\" class=\"icon-alt-email\"></ius-icon-xs>\r\n <span>{{object.correo}}</span>\r\n </div>\r\n <ius-dropdown-option-item (click)=\"onClickPerfilPreferencias()\">Perfil, preferencias y\r\n seguridad</ius-dropdown-option-item>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n <div class=\"container-plan\" [ngClass]=\"{ 'show-more': showMore }\">\r\n <div class=\"inf-plan\">\r\n <div class=\"row-plan-1\">\r\n <div class=\"col-plan-1\">\r\n <span class=\"tx-small tx-tipo-plan\">{{detailSubscripcion?.tipoServicio}}</span>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-base tx-name-plan\">{{detailSubscripcion?.namePlan}}</span>\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-help\"></ius-icon-md>\r\n </div>\r\n <div class=\"tx-row-2 tx-small\">\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Total global</span>\r\n <span class=\"tx-contador-2\">{{detailSubscripcion?.cantTotal}}</span>\r\n </div>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Disponible global</span>\r\n <span class=\"tx-contador-2\">{{detailSubscripcion?.cantDisponible}}</span>\r\n </div>\r\n </div>\r\n <span class=\"tx-base tx-estado-plan\">{{detailSubscripcion?.estado}}</span>\r\n </div>\r\n <ius-button-circle-tertiary iconName=\"icon-discover-tune\"></ius-button-circle-tertiary>\r\n </div>\r\n <div style=\"width: 100%;\">\r\n <ius-progress-bar [total]=\"detailSubscripcion?.cantTotal!\" [titleV1]=\"'Insolvencia'\"\r\n [v1]=\"detailSubscripcion?.cantInsolvencia!\" [titleV2]=\"'Judicial'\"\r\n [v2]=\"detailSubscripcion?.cantJudicial!\" [v3]=\"detailSubscripcion?.cantProcesos3!\"\r\n [v4]=\"detailSubscripcion?.cantProcesos4!\"></ius-progress-bar>\r\n </div>\r\n <div class=\"legend\">\r\n <div class=\"item-counter tx-small\">\r\n <ius-icon-xs iconName=\"icon-storage-set\" class=\"icon-storage-set\"></ius-icon-xs>\r\n <span>{{detailSubscripcion?.asignados}}</span>\r\n </div>\r\n <div class=\"item-counter tx-small\">\r\n <ius-icon-xs iconName=\"icon-storage-plus\" class=\"icon-storage-plus\"></ius-icon-xs>\r\n <span>{{detailSubscripcion?.cantAsignadaDisponible}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n @if (detailsConsumo) {\r\n @for (detail of detailsConsumo; track $index) {\r\n <div class=\"inf-plan\">\r\n <div class=\"row-plan-1\">\r\n <div class=\"col-plan-1\">\r\n <span class=\"tx-small tx-tipo-plan\">{{detail.tipoServicio}}</span>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-base tx-name-plan\">Por consumo</span>\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-help\"></ius-icon-md>\r\n </div>\r\n <div class=\"tx-row-2 tx-small\">\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Consumo este mes</span>\r\n <span class=\"tx-contador-2\">{{detail.cantConsumida}}</span>\r\n </div>\r\n </div>\r\n <span class=\"tx-base tx-estado-plan\">{{detail.estado}}</span>\r\n </div>\r\n <ius-button-circle-tertiary iconName=\"icon-discover-tune\"></ius-button-circle-tertiary>\r\n </div>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n }\r\n }\r\n </div>\r\n <ius-button-standard-tertiary class=\"btn-list\"\r\n [iconName]=\"showMore ? 'icon-keyboard-arrow-up' : 'icon-keyboard-arrow-down'\"\r\n (buttonClicked)=\"clickShowMore()\">\r\n {{ showMore ? 'Mostrar menos' : 'Mostrar m\u00E1s' }}\r\n </ius-button-standard-tertiary>\r\n <ius-simple-divider></ius-simple-divider>\r\n <div class=\"ctn-items\">\r\n <ius-menu-item iconName=\"icon-groups\" (buttonClicked)=\"onClickUsuariosRoles()\">Usuarios y\r\n roles</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-build\" (buttonClicked)=\"onClickConfiguracion()\">Configuraci\u00F3n de la\r\n cuenta</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-finance-chip\" (buttonClicked)=\"onClickPagos()\">Pagos y\r\n facturaci\u00F3n</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-enterprise\" (buttonClicked)=\"onClickSubsServicios()\">Suscripciones y\r\n servicios</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-stream\" (buttonClicked)=\"onClickReferir()\">Referir servicio</ius-menu-item>\r\n </div>\r\n\r\n <ius-simple-divider></ius-simple-divider>\r\n } @else {\r\n <div class=\"container-bottom\">\r\n <span class=\"tx-row-1 tx-rol\">Cambiar a</span>\r\n <div class=\"container-list\">\r\n @for (account of accountsList; track account; let i = $index) {\r\n <ius-button-accounts (accountSelected)=\"onClickAccount(account)\"\r\n (onPressedPredeterminado)=\"clickAccountPredeterminada.emit(account)\" ,\r\n (onPressedEditar)=\"clickEditAccount.emit(account)\" ,\r\n (onPressedDesvincular)=\"clickDesvincularAccount.emit(account)\"\r\n [account]=\"account\"></ius-button-accounts>\r\n }\r\n </div>\r\n <!-- <ius-button-standard-tertiary [iconName]=\"'icon-add'\" (buttonClicked)=\"addAccount()\">Agregar\r\n nueva cuenta</ius-button-standard-tertiary> -->\r\n </div>\r\n }\r\n </div>\r\n <div class=\"ctn-items mgt-8\">\r\n <ius-menu-item iconName=\"{{!showFormSwitchAccount ? 'icon-cases' : 'icon-arrow-left-alt'}}\"\r\n (buttonClicked)=\"onClickCambiarCuenta()\">{{!showFormSwitchAccount ? 'Cambiar de cuenta' : 'Volver al menu de\r\n usuario'}}</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-exit-to-app\" (buttonClicked)=\"onClickCerrarSesion()\">Cerrar sesi\u00F3n</ius-menu-item>\r\n </div>\r\n</div>", 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}.tbl-menu{display:flex;width:390px;height:85vh;padding:16px;flex-direction:column}.body-menu{display:flex;flex:1 0 0;flex-direction:column;padding-right:6px;gap:8px;font-family:Rubik,sans-serif;overflow-y:auto;min-height:0}.colum-mn-1{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.text-head-mn{color:#8c8c8c;font-size:.75rem;line-height:16px;letter-spacing:.24px}.icon-acc-circle{color:#595959}.tx-row-1{display:flex;align-items:center;gap:4px}.tx-abog{color:#333;letter-spacing:.2px}.id-ct{padding:4px;border-radius:4px;border:1px solid #d9d9d9}.tx-id-ct{font-weight:500}.tx-rol{font-size:.875rem;color:#595959;line-height:20px}.tx-name-rl{color:#333;letter-spacing:.28px;font-weight:500}.email-inf{display:flex;padding:8px;align-items:center;gap:4px;color:#595959;font-size:.875rem;line-height:20px;letter-spacing:.28px}.icon-alt-email{color:#7caf25}ius-dropdown-option-item{width:100%}.container-plan{overflow:hidden;max-height:200px;transition:max-height .5s cubic-bezier(.4,0,.2,1);flex-shrink:0}.inf-plan{display:flex;padding:8px;flex-direction:column;align-items:flex-start;gap:8px}.show-more{max-height:10000px;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.tx-small{font-size:.75rem;line-height:16px;letter-spacing:.24px}.tx-base{font-size:.875rem;line-height:20px;letter-spacing:.28px}.row-plan-1{display:flex;gap:12px;width:100%}.col-plan-1{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;flex:1 0 0}.icon-help{color:#8c8c8c}.tx-tipo-plan{color:#595959;font-weight:500}.tx-name-plan{color:#333;font-weight:500}.tx-row-2{display:flex;align-items:center;gap:8px}.tx-contador-1{color:#8c8c8c;font-weight:500}.tx-contador-2{color:#333}.tx-estado-plan{color:#7caf25}.mgt-8{margin-top:8px}.progress-container{width:100%;border-radius:100px;height:23px;overflow:hidden;background:#f0f0f0}.progress-bar{display:flex;height:100%}.segment{height:100%}.tipo-1-color-bar{background:#5892ff}.tipo-1-color{color:#5892ff}.tipo-2-color-bar{background:#103ab7}.tipo-2-color{color:#103ab7}.legend{display:flex;width:100%;align-items:center;gap:8px;flex-wrap:wrap}.legend .icon-storage-set{color:#103ab7}.legend .icon-storage-plus{color:#629219}.item-counter{display:flex;align-items:center;gap:4px;color:#333}.tx-name-serv{color:#595959;font-weight:500}.btn-list{margin-bottom:8px}.ctn-items{display:flex;flex-direction:column;gap:4px}.scrollable{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}.container-bottom{padding:0 16px;display:flex;flex-direction:column;gap:8px}.container-list{display:flex;flex-direction:column;gap:4px;width:90%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "component", type: IconXsComponent, selector: "ius-icon-xs", inputs: ["iconName", "color"] }, { kind: "component", type: DropdownOptionItemComponent, selector: "ius-dropdown-option-item", inputs: ["iconName", "route"], outputs: ["click"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonStandardTertiaryComponent, selector: "ius-button-standard-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: MenuItemComponent, selector: "ius-menu-item", inputs: ["isActive", "iconName", "numberAlerts"], outputs: ["buttonClicked"] }, { kind: "component", type: ProgressBarComponent, selector: "ius-progress-bar", inputs: ["total", "v1", "v2", "v3", "v4", "titleV1", "titleV2", "titleV3", "titleV4"] }, { kind: "component", type: ButtonAccountsComponent, selector: "ius-button-accounts", inputs: ["account"], outputs: ["accountSelected", "onPressedPredeterminado", "onPressedDesvincular", "onPressedEditar"] }] }); }
|
|
3630
3630
|
}
|
|
3631
3631
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToolbarUserMenuComponent, decorators: [{
|
|
3632
3632
|
type: Component,
|
|
3633
|
-
args: [{ selector: 'ius-toolbar-user-menu', standalone: true, imports: [CommonModule, IconSmComponent, IconXsComponent, DropdownOptionItemComponent, SimpleDividerComponent, IconMdComponent, ButtonCircleTertiaryComponent, ButtonStandardTertiaryComponent, MenuItemComponent, ProgressBarComponent, ButtonAccountsComponent], template: "<div class=\"tbl-menu\">\r\n <div class=\"body-menu scrollable\">\r\n <div class=\"colum-mn-1 text-head-mn\">\r\n <span>Estas navegando en</span>\r\n <div class=\"tx-row-1\">\r\n <ius-icon-sm iconName=\"icon-account-circle\" class=\"icon-acc-circle\"></ius-icon-sm>\r\n <span class=\"h4 tx-abog\">{{object.nombreCompany}}</span>\r\n </div>\r\n <div class=\"tx-row-1 id-ct\">\r\n <span>ID Cuenta</span>\r\n <span class=\"tx-id-ct\">{{object.cuentaID}}</span>\r\n </div>\r\n <div class=\"tx-row-1 tx-rol\">\r\n <span>Tu rol</span>\r\n <span class=\"tx-name-rl\">{{object.rol}}</span>\r\n </div>\r\n </div>\r\n @if(!showFormSwitchAccount){\r\n <div class=\"colum-mn-1\">\r\n <div class=\"email-inf\">\r\n <ius-icon-xs iconName=\"icon-alternate-email\" class=\"icon-alt-email\"></ius-icon-xs>\r\n <span>{{object.correo}}</span>\r\n </div>\r\n <ius-dropdown-option-item (click)=\"onClickPerfilPreferencias()\">Perfil, preferencias y\r\n seguridad</ius-dropdown-option-item>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n <div class=\"container-plan\" [ngClass]=\"{ 'show-more': showMore }\">\r\n <div class=\"inf-plan\">\r\n <div class=\"row-plan-1\">\r\n <div class=\"col-plan-1\">\r\n <span class=\"tx-small tx-tipo-plan\">{{detailSubscripcion?.tipoServicio}}</span>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-base tx-name-plan\">{{detailSubscripcion?.namePlan}}</span>\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-help\"></ius-icon-md>\r\n </div>\r\n <div class=\"tx-row-2 tx-small\">\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Total global</span>\r\n <span class=\"tx-contador-2\">{{detailSubscripcion?.cantTotal}}</span>\r\n </div>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Disponible global</span>\r\n <span class=\"tx-contador-2\">{{detailSubscripcion?.cantDisponible}}</span>\r\n </div>\r\n </div>\r\n <span class=\"tx-base tx-estado-plan\">{{detailSubscripcion?.estado}}</span>\r\n </div>\r\n <ius-button-circle-tertiary iconName=\"icon-discover-tune\"></ius-button-circle-tertiary>\r\n </div>\r\n <div style=\"width: 100%;\">\r\n <ius-progress-bar [total]=\"detailSubscripcion?.cantTotal!\" [titleV1]=\"'Insolvencia'\"\r\n [v1]=\"detailSubscripcion?.cantInsolvencia!\" [titleV2]=\"'Judicial'\"\r\n [v2]=\"detailSubscripcion?.cantJudicial!\" [v3]=\"detailSubscripcion?.cantProcesos3!\"\r\n [v4]=\"detailSubscripcion?.cantProcesos4!\"></ius-progress-bar>\r\n </div>\r\n <div class=\"legend\">\r\n <div class=\"item-counter tx-small\">\r\n <ius-icon-xs iconName=\"icon-storage-set\" class=\"icon-storage-set\"></ius-icon-xs>\r\n <span>{{detailSubscripcion?.asignados}}</span>\r\n </div>\r\n <div class=\"item-counter tx-small\">\r\n <ius-icon-xs iconName=\"icon-storage-plus\" class=\"icon-storage-plus\"></ius-icon-xs>\r\n <span>{{detailSubscripcion?.cantAsignadaDisponible}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n @if (detailsConsumo) {\r\n @for (detail of detailsConsumo; track $index) {\r\n <div class=\"inf-plan\">\r\n <div class=\"row-plan-1\">\r\n <div class=\"col-plan-1\">\r\n <span class=\"tx-small tx-tipo-plan\">{{detail.tipoServicio}}</span>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-base tx-name-plan\">Por consumo</span>\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-help\"></ius-icon-md>\r\n </div>\r\n <div class=\"tx-row-2 tx-small\">\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Consumo este mes</span>\r\n <span class=\"tx-contador-2\">{{detail.cantConsumida}}</span>\r\n </div>\r\n </div>\r\n <span class=\"tx-base tx-estado-plan\">{{detail.estado}}</span>\r\n </div>\r\n <ius-button-circle-tertiary iconName=\"icon-discover-tune\"></ius-button-circle-tertiary>\r\n </div>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n }\r\n }\r\n </div>\r\n <ius-button-standard-tertiary class=\"btn-list\"\r\n [iconName]=\"showMore ? 'icon-keyboard-arrow-up' : 'icon-keyboard-arrow-down'\"\r\n (buttonClicked)=\"clickShowMore()\">\r\n {{ showMore ? 'Mostrar menos' : 'Mostrar m\u00E1s' }}\r\n </ius-button-standard-tertiary>\r\n <ius-simple-divider></ius-simple-divider>\r\n <div class=\"ctn-items\">\r\n <ius-menu-item iconName=\"icon-groups\" (buttonClicked)=\"onClickUsuariosRoles()\">Usuarios y\r\n roles</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-build\" (buttonClicked)=\"onClickConfiguracion()\">Configuraci\u00F3n de la\r\n cuenta</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-finance-chip\" (buttonClicked)=\"onClickPagos()\">Pagos y\r\n facturaci\u00F3n</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-enterprise\" (buttonClicked)=\"onClickSubsServicios()\">Suscripciones y\r\n servicios</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-stream\" (buttonClicked)=\"onClickReferir()\">Referir servicio</ius-menu-item>\r\n </div>\r\n\r\n <ius-simple-divider></ius-simple-divider>\r\n } @else {\r\n <div class=\"container-bottom\">\r\n <span class=\"tx-row-1 tx-rol\">Cambiar a</span>\r\n <div class=\"container-list\">\r\n @for (account of accountsList; track account; let i = $index) {\r\n <ius-button-accounts (accountSelected)=\"onClickAccount(account)\"\r\n (onPressedPredeterminado)=\"clickAccountPredeterminada.emit(account)\" ,\r\n (onPressedEditar)=\"clickEditAccount.emit(account)\" ,\r\n (onPressedDesvincular)=\"clickDesvincularAccount.emit(account)\"\r\n [account]=\"account\"></ius-button-accounts>\r\n }\r\n </div>\r\n <ius-button-standard-tertiary [iconName]=\"'icon-add'\" (buttonClicked)=\"addAccount()\">Agregar\r\n nueva cuenta</ius-button-standard-tertiary>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"ctn-items mgt-8\">\r\n <ius-menu-item iconName=\"{{!showFormSwitchAccount ? 'icon-cases' : 'icon-arrow-left-alt'}}\"\r\n (buttonClicked)=\"onClickCambiarCuenta()\">{{!showFormSwitchAccount ? 'Cambiar de cuenta' : 'Volver al menu de\r\n usuario'}}</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-exit-to-app\" (buttonClicked)=\"onClickCerrarSesion()\">Cerrar sesi\u00F3n</ius-menu-item>\r\n </div>\r\n</div>", 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}.tbl-menu{display:flex;width:390px;height:85vh;padding:16px;flex-direction:column}.body-menu{display:flex;flex:1 0 0;flex-direction:column;padding-right:6px;gap:8px;font-family:Rubik,sans-serif;overflow-y:auto;min-height:0}.colum-mn-1{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.text-head-mn{color:#8c8c8c;font-size:.75rem;line-height:16px;letter-spacing:.24px}.icon-acc-circle{color:#595959}.tx-row-1{display:flex;align-items:center;gap:4px}.tx-abog{color:#333;letter-spacing:.2px}.id-ct{padding:4px;border-radius:4px;border:1px solid #d9d9d9}.tx-id-ct{font-weight:500}.tx-rol{font-size:.875rem;color:#595959;line-height:20px}.tx-name-rl{color:#333;letter-spacing:.28px;font-weight:500}.email-inf{display:flex;padding:8px;align-items:center;gap:4px;color:#595959;font-size:.875rem;line-height:20px;letter-spacing:.28px}.icon-alt-email{color:#7caf25}ius-dropdown-option-item{width:100%}.container-plan{overflow:hidden;max-height:200px;transition:max-height .5s cubic-bezier(.4,0,.2,1);flex-shrink:0}.inf-plan{display:flex;padding:8px;flex-direction:column;align-items:flex-start;gap:8px}.show-more{max-height:10000px;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.tx-small{font-size:.75rem;line-height:16px;letter-spacing:.24px}.tx-base{font-size:.875rem;line-height:20px;letter-spacing:.28px}.row-plan-1{display:flex;gap:12px;width:100%}.col-plan-1{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;flex:1 0 0}.icon-help{color:#8c8c8c}.tx-tipo-plan{color:#595959;font-weight:500}.tx-name-plan{color:#333;font-weight:500}.tx-row-2{display:flex;align-items:center;gap:8px}.tx-contador-1{color:#8c8c8c;font-weight:500}.tx-contador-2{color:#333}.tx-estado-plan{color:#7caf25}.mgt-8{margin-top:8px}.progress-container{width:100%;border-radius:100px;height:23px;overflow:hidden;background:#f0f0f0}.progress-bar{display:flex;height:100%}.segment{height:100%}.tipo-1-color-bar{background:#5892ff}.tipo-1-color{color:#5892ff}.tipo-2-color-bar{background:#103ab7}.tipo-2-color{color:#103ab7}.legend{display:flex;width:100%;align-items:center;gap:8px;flex-wrap:wrap}.legend .icon-storage-set{color:#103ab7}.legend .icon-storage-plus{color:#629219}.item-counter{display:flex;align-items:center;gap:4px;color:#333}.tx-name-serv{color:#595959;font-weight:500}.btn-list{margin-bottom:8px}.ctn-items{display:flex;flex-direction:column;gap:4px}.scrollable{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}.container-bottom{padding:0 16px;display:flex;flex-direction:column;gap:8px}.container-list{display:flex;flex-direction:column;gap:4px}\n"] }]
|
|
3633
|
+
args: [{ selector: 'ius-toolbar-user-menu', standalone: true, imports: [CommonModule, IconSmComponent, IconXsComponent, DropdownOptionItemComponent, SimpleDividerComponent, IconMdComponent, ButtonCircleTertiaryComponent, ButtonStandardTertiaryComponent, MenuItemComponent, ProgressBarComponent, ButtonAccountsComponent], template: "<div class=\"tbl-menu\">\r\n <div class=\"body-menu scrollable\">\r\n <div class=\"colum-mn-1 text-head-mn\">\r\n <span>Estas navegando en</span>\r\n <div class=\"tx-row-1\">\r\n <ius-icon-sm iconName=\"icon-account-circle\" class=\"icon-acc-circle\"></ius-icon-sm>\r\n <span class=\"h4 tx-abog\">{{object.nombreCompany}}</span>\r\n </div>\r\n <div class=\"tx-row-1 id-ct\">\r\n <span>ID Cuenta</span>\r\n <span class=\"tx-id-ct\">{{object.cuentaID}}</span>\r\n </div>\r\n <div class=\"tx-row-1 tx-rol\">\r\n <span>Tu rol</span>\r\n <span class=\"tx-name-rl\">{{object.rol}}</span>\r\n </div>\r\n </div>\r\n @if(!showFormSwitchAccount){\r\n <div class=\"colum-mn-1\">\r\n <div class=\"email-inf\">\r\n <ius-icon-xs iconName=\"icon-alternate-email\" class=\"icon-alt-email\"></ius-icon-xs>\r\n <span>{{object.correo}}</span>\r\n </div>\r\n <ius-dropdown-option-item (click)=\"onClickPerfilPreferencias()\">Perfil, preferencias y\r\n seguridad</ius-dropdown-option-item>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n <div class=\"container-plan\" [ngClass]=\"{ 'show-more': showMore }\">\r\n <div class=\"inf-plan\">\r\n <div class=\"row-plan-1\">\r\n <div class=\"col-plan-1\">\r\n <span class=\"tx-small tx-tipo-plan\">{{detailSubscripcion?.tipoServicio}}</span>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-base tx-name-plan\">{{detailSubscripcion?.namePlan}}</span>\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-help\"></ius-icon-md>\r\n </div>\r\n <div class=\"tx-row-2 tx-small\">\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Total global</span>\r\n <span class=\"tx-contador-2\">{{detailSubscripcion?.cantTotal}}</span>\r\n </div>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Disponible global</span>\r\n <span class=\"tx-contador-2\">{{detailSubscripcion?.cantDisponible}}</span>\r\n </div>\r\n </div>\r\n <span class=\"tx-base tx-estado-plan\">{{detailSubscripcion?.estado}}</span>\r\n </div>\r\n <ius-button-circle-tertiary iconName=\"icon-discover-tune\"></ius-button-circle-tertiary>\r\n </div>\r\n <div style=\"width: 100%;\">\r\n <ius-progress-bar [total]=\"detailSubscripcion?.cantTotal!\" [titleV1]=\"'Insolvencia'\"\r\n [v1]=\"detailSubscripcion?.cantInsolvencia!\" [titleV2]=\"'Judicial'\"\r\n [v2]=\"detailSubscripcion?.cantJudicial!\" [v3]=\"detailSubscripcion?.cantProcesos3!\"\r\n [v4]=\"detailSubscripcion?.cantProcesos4!\"></ius-progress-bar>\r\n </div>\r\n <div class=\"legend\">\r\n <div class=\"item-counter tx-small\">\r\n <ius-icon-xs iconName=\"icon-storage-set\" class=\"icon-storage-set\"></ius-icon-xs>\r\n <span>{{detailSubscripcion?.asignados}}</span>\r\n </div>\r\n <div class=\"item-counter tx-small\">\r\n <ius-icon-xs iconName=\"icon-storage-plus\" class=\"icon-storage-plus\"></ius-icon-xs>\r\n <span>{{detailSubscripcion?.cantAsignadaDisponible}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n @if (detailsConsumo) {\r\n @for (detail of detailsConsumo; track $index) {\r\n <div class=\"inf-plan\">\r\n <div class=\"row-plan-1\">\r\n <div class=\"col-plan-1\">\r\n <span class=\"tx-small tx-tipo-plan\">{{detail.tipoServicio}}</span>\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-base tx-name-plan\">Por consumo</span>\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-help\"></ius-icon-md>\r\n </div>\r\n <div class=\"tx-row-2 tx-small\">\r\n <div class=\"tx-row-1\">\r\n <span class=\"tx-contador-1\">Consumo este mes</span>\r\n <span class=\"tx-contador-2\">{{detail.cantConsumida}}</span>\r\n </div>\r\n </div>\r\n <span class=\"tx-base tx-estado-plan\">{{detail.estado}}</span>\r\n </div>\r\n <ius-button-circle-tertiary iconName=\"icon-discover-tune\"></ius-button-circle-tertiary>\r\n </div>\r\n </div>\r\n <ius-simple-divider></ius-simple-divider>\r\n }\r\n }\r\n </div>\r\n <ius-button-standard-tertiary class=\"btn-list\"\r\n [iconName]=\"showMore ? 'icon-keyboard-arrow-up' : 'icon-keyboard-arrow-down'\"\r\n (buttonClicked)=\"clickShowMore()\">\r\n {{ showMore ? 'Mostrar menos' : 'Mostrar m\u00E1s' }}\r\n </ius-button-standard-tertiary>\r\n <ius-simple-divider></ius-simple-divider>\r\n <div class=\"ctn-items\">\r\n <ius-menu-item iconName=\"icon-groups\" (buttonClicked)=\"onClickUsuariosRoles()\">Usuarios y\r\n roles</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-build\" (buttonClicked)=\"onClickConfiguracion()\">Configuraci\u00F3n de la\r\n cuenta</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-finance-chip\" (buttonClicked)=\"onClickPagos()\">Pagos y\r\n facturaci\u00F3n</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-enterprise\" (buttonClicked)=\"onClickSubsServicios()\">Suscripciones y\r\n servicios</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-stream\" (buttonClicked)=\"onClickReferir()\">Referir servicio</ius-menu-item>\r\n </div>\r\n\r\n <ius-simple-divider></ius-simple-divider>\r\n } @else {\r\n <div class=\"container-bottom\">\r\n <span class=\"tx-row-1 tx-rol\">Cambiar a</span>\r\n <div class=\"container-list\">\r\n @for (account of accountsList; track account; let i = $index) {\r\n <ius-button-accounts (accountSelected)=\"onClickAccount(account)\"\r\n (onPressedPredeterminado)=\"clickAccountPredeterminada.emit(account)\" ,\r\n (onPressedEditar)=\"clickEditAccount.emit(account)\" ,\r\n (onPressedDesvincular)=\"clickDesvincularAccount.emit(account)\"\r\n [account]=\"account\"></ius-button-accounts>\r\n }\r\n </div>\r\n <!-- <ius-button-standard-tertiary [iconName]=\"'icon-add'\" (buttonClicked)=\"addAccount()\">Agregar\r\n nueva cuenta</ius-button-standard-tertiary> -->\r\n </div>\r\n }\r\n </div>\r\n <div class=\"ctn-items mgt-8\">\r\n <ius-menu-item iconName=\"{{!showFormSwitchAccount ? 'icon-cases' : 'icon-arrow-left-alt'}}\"\r\n (buttonClicked)=\"onClickCambiarCuenta()\">{{!showFormSwitchAccount ? 'Cambiar de cuenta' : 'Volver al menu de\r\n usuario'}}</ius-menu-item>\r\n <ius-menu-item iconName=\"icon-exit-to-app\" (buttonClicked)=\"onClickCerrarSesion()\">Cerrar sesi\u00F3n</ius-menu-item>\r\n </div>\r\n</div>", 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}.tbl-menu{display:flex;width:390px;height:85vh;padding:16px;flex-direction:column}.body-menu{display:flex;flex:1 0 0;flex-direction:column;padding-right:6px;gap:8px;font-family:Rubik,sans-serif;overflow-y:auto;min-height:0}.colum-mn-1{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.text-head-mn{color:#8c8c8c;font-size:.75rem;line-height:16px;letter-spacing:.24px}.icon-acc-circle{color:#595959}.tx-row-1{display:flex;align-items:center;gap:4px}.tx-abog{color:#333;letter-spacing:.2px}.id-ct{padding:4px;border-radius:4px;border:1px solid #d9d9d9}.tx-id-ct{font-weight:500}.tx-rol{font-size:.875rem;color:#595959;line-height:20px}.tx-name-rl{color:#333;letter-spacing:.28px;font-weight:500}.email-inf{display:flex;padding:8px;align-items:center;gap:4px;color:#595959;font-size:.875rem;line-height:20px;letter-spacing:.28px}.icon-alt-email{color:#7caf25}ius-dropdown-option-item{width:100%}.container-plan{overflow:hidden;max-height:200px;transition:max-height .5s cubic-bezier(.4,0,.2,1);flex-shrink:0}.inf-plan{display:flex;padding:8px;flex-direction:column;align-items:flex-start;gap:8px}.show-more{max-height:10000px;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.tx-small{font-size:.75rem;line-height:16px;letter-spacing:.24px}.tx-base{font-size:.875rem;line-height:20px;letter-spacing:.28px}.row-plan-1{display:flex;gap:12px;width:100%}.col-plan-1{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;flex:1 0 0}.icon-help{color:#8c8c8c}.tx-tipo-plan{color:#595959;font-weight:500}.tx-name-plan{color:#333;font-weight:500}.tx-row-2{display:flex;align-items:center;gap:8px}.tx-contador-1{color:#8c8c8c;font-weight:500}.tx-contador-2{color:#333}.tx-estado-plan{color:#7caf25}.mgt-8{margin-top:8px}.progress-container{width:100%;border-radius:100px;height:23px;overflow:hidden;background:#f0f0f0}.progress-bar{display:flex;height:100%}.segment{height:100%}.tipo-1-color-bar{background:#5892ff}.tipo-1-color{color:#5892ff}.tipo-2-color-bar{background:#103ab7}.tipo-2-color{color:#103ab7}.legend{display:flex;width:100%;align-items:center;gap:8px;flex-wrap:wrap}.legend .icon-storage-set{color:#103ab7}.legend .icon-storage-plus{color:#629219}.item-counter{display:flex;align-items:center;gap:4px;color:#333}.tx-name-serv{color:#595959;font-weight:500}.btn-list{margin-bottom:8px}.ctn-items{display:flex;flex-direction:column;gap:4px}.scrollable{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}.container-bottom{padding:0 16px;display:flex;flex-direction:column;gap:8px}.container-list{display:flex;flex-direction:column;gap:4px;width:90%}\n"] }]
|
|
3634
3634
|
}], propDecorators: { object: [{
|
|
3635
3635
|
type: Input,
|
|
3636
3636
|
args: [{ required: true }]
|
|
@@ -5041,37 +5041,51 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
5041
5041
|
class SimpleCardContadorComponent {
|
|
5042
5042
|
constructor() {
|
|
5043
5043
|
this.title = '';
|
|
5044
|
-
this.value =
|
|
5044
|
+
this.value = 1;
|
|
5045
|
+
this.maxValue = 0;
|
|
5045
5046
|
this.valueChange = new EventEmitter();
|
|
5047
|
+
this.errorMaxValue = new EventEmitter();
|
|
5046
5048
|
}
|
|
5047
5049
|
step(el, dir) {
|
|
5048
|
-
|
|
5049
|
-
|
|
5050
|
-
|
|
5051
|
-
el.stepDown();
|
|
5052
|
-
this.syncAndEmit(el.value);
|
|
5050
|
+
const current = Number(el.value) || 1;
|
|
5051
|
+
const next = current + dir;
|
|
5052
|
+
this.applyLimitsAndEmit(next, el);
|
|
5053
5053
|
}
|
|
5054
|
-
onTyped(
|
|
5055
|
-
|
|
5054
|
+
onTyped(el) {
|
|
5055
|
+
const n = Number(el.value);
|
|
5056
|
+
this.applyLimitsAndEmit(n, el);
|
|
5056
5057
|
}
|
|
5057
|
-
|
|
5058
|
-
|
|
5059
|
-
|
|
5060
|
-
|
|
5061
|
-
|
|
5058
|
+
applyLimitsAndEmit(n, el) {
|
|
5059
|
+
let value = Number.isNaN(n) ? 1 : n;
|
|
5060
|
+
if (value < 1) {
|
|
5061
|
+
value = 1;
|
|
5062
|
+
}
|
|
5063
|
+
if (this.maxValue > 0 && value > this.maxValue) {
|
|
5064
|
+
value = this.maxValue;
|
|
5065
|
+
this.errorMaxValue.emit('El valor sobrepasa el limite que puedes asignar');
|
|
5066
|
+
}
|
|
5067
|
+
this.value = value;
|
|
5068
|
+
if (el) {
|
|
5069
|
+
el.value = String(value);
|
|
5070
|
+
}
|
|
5071
|
+
this.valueChange.emit(value);
|
|
5062
5072
|
}
|
|
5063
5073
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SimpleCardContadorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5064
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SimpleCardContadorComponent, isStandalone: true, selector: "ius-simple-card-contador", inputs: { title: "title", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num
|
|
5074
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SimpleCardContadorComponent, isStandalone: true, selector: "ius-simple-card-contador", inputs: { title: "title", value: "value", maxValue: "maxValue" }, outputs: { valueChange: "valueChange", errorMaxValue: "errorMaxValue" }, ngImport: i0, template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [min]=\"1\"\r\n [max]=\"maxValue > 0 ? maxValue : null\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num)\"\r\n (blur)=\"onTyped(num)\"\r\n />\r\n <button\r\n class=\"spin up\"\r\n (click)=\"step(num, +1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-up'\"\r\n ></ius-icon-xl>\r\n </button>\r\n\r\n <button\r\n class=\"spin down\"\r\n (click)=\"step(num, -1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-down'\"\r\n ></ius-icon-xl>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\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}.general-container{position:relative}.container{display:flex;padding:4px 4px 4px 12px;align-items:center;gap:0;align-self:stretch;border-radius:8px;border:1px solid #eaeaea;background:#fff;justify-content:space-between}.container .left{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;flex:1 1 auto;min-width:0;width:55%}.container .left p{display:flex;align-items:center;gap:10px;margin:0;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Rubik;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right{padding:var(--Spacing-Spacing-xs, 8px);display:flex;align-items:center;width:45%}.container .right .num-wrapper{position:relative;display:inline-flex;align-items:center;height:40px;border-radius:14px;background:#f5f5f5;padding:6px 44px 6px 12px}.container .right .num-wrapper input[type=number]{appearance:textfield;-moz-appearance:textfield;-webkit-appearance:none;border:0;outline:0;width:100%;background:transparent;color:#8c8c8c;font-family:Rubik;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right .num-wrapper input::-webkit-outer-spin-button,.container .right .num-wrapper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.container .right .num-wrapper .spin{position:absolute;right:8px;width:28px;height:18px;border:0;background:transparent;cursor:pointer;border-radius:6px;display:flex;align-items:center;justify-content:center}.container .right .num-wrapper .up{top:15px}.container .right .num-wrapper .down{bottom:-1px}\n"], dependencies: [{ kind: "component", type: IconXlComponent, selector: "ius-icon-xl", inputs: ["iconName", "color"] }] }); }
|
|
5065
5075
|
}
|
|
5066
5076
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SimpleCardContadorComponent, decorators: [{
|
|
5067
5077
|
type: Component,
|
|
5068
|
-
args: [{ selector: 'ius-simple-card-contador', standalone: true, imports: [IconXlComponent], template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num
|
|
5078
|
+
args: [{ selector: 'ius-simple-card-contador', standalone: true, imports: [IconXlComponent], template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [min]=\"1\"\r\n [max]=\"maxValue > 0 ? maxValue : null\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num)\"\r\n (blur)=\"onTyped(num)\"\r\n />\r\n <button\r\n class=\"spin up\"\r\n (click)=\"step(num, +1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-up'\"\r\n ></ius-icon-xl>\r\n </button>\r\n\r\n <button\r\n class=\"spin down\"\r\n (click)=\"step(num, -1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-down'\"\r\n ></ius-icon-xl>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\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}.general-container{position:relative}.container{display:flex;padding:4px 4px 4px 12px;align-items:center;gap:0;align-self:stretch;border-radius:8px;border:1px solid #eaeaea;background:#fff;justify-content:space-between}.container .left{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;flex:1 1 auto;min-width:0;width:55%}.container .left p{display:flex;align-items:center;gap:10px;margin:0;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Rubik;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right{padding:var(--Spacing-Spacing-xs, 8px);display:flex;align-items:center;width:45%}.container .right .num-wrapper{position:relative;display:inline-flex;align-items:center;height:40px;border-radius:14px;background:#f5f5f5;padding:6px 44px 6px 12px}.container .right .num-wrapper input[type=number]{appearance:textfield;-moz-appearance:textfield;-webkit-appearance:none;border:0;outline:0;width:100%;background:transparent;color:#8c8c8c;font-family:Rubik;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right .num-wrapper input::-webkit-outer-spin-button,.container .right .num-wrapper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.container .right .num-wrapper .spin{position:absolute;right:8px;width:28px;height:18px;border:0;background:transparent;cursor:pointer;border-radius:6px;display:flex;align-items:center;justify-content:center}.container .right .num-wrapper .up{top:15px}.container .right .num-wrapper .down{bottom:-1px}\n"] }]
|
|
5069
5079
|
}], propDecorators: { title: [{
|
|
5070
5080
|
type: Input
|
|
5071
5081
|
}], value: [{
|
|
5072
5082
|
type: Input
|
|
5083
|
+
}], maxValue: [{
|
|
5084
|
+
type: Input
|
|
5073
5085
|
}], valueChange: [{
|
|
5074
5086
|
type: Output
|
|
5087
|
+
}], errorMaxValue: [{
|
|
5088
|
+
type: Output
|
|
5075
5089
|
}] } });
|
|
5076
5090
|
|
|
5077
5091
|
class SegmentComponent {
|
|
@@ -6633,6 +6647,73 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
6633
6647
|
type: Input
|
|
6634
6648
|
}] } });
|
|
6635
6649
|
|
|
6650
|
+
class AlertComponent {
|
|
6651
|
+
constructor(overlay, vcr) {
|
|
6652
|
+
this.overlay = overlay;
|
|
6653
|
+
this.vcr = vcr;
|
|
6654
|
+
this.title = 'Título del Popup';
|
|
6655
|
+
this.text = 'Texto';
|
|
6656
|
+
this.leftButtonName = 'Cancelar';
|
|
6657
|
+
this.rightButtonName = 'Confirmar';
|
|
6658
|
+
this.onRightButtonClick = new EventEmitter();
|
|
6659
|
+
this.onLeftButtonClick = new EventEmitter();
|
|
6660
|
+
}
|
|
6661
|
+
ngAfterViewInit() {
|
|
6662
|
+
const positionStrategy = this.overlay.position()
|
|
6663
|
+
.global()
|
|
6664
|
+
.centerHorizontally()
|
|
6665
|
+
.centerVertically();
|
|
6666
|
+
this.overlayRef = this.overlay.create({
|
|
6667
|
+
positionStrategy,
|
|
6668
|
+
hasBackdrop: true,
|
|
6669
|
+
backdropClass: 'cdk-overlay-dark-backdrop',
|
|
6670
|
+
scrollStrategy: this.overlay.scrollStrategies.block(),
|
|
6671
|
+
panelClass: 'modal-alerta',
|
|
6672
|
+
disposeOnNavigation: true,
|
|
6673
|
+
});
|
|
6674
|
+
const portal = new TemplatePortal(this.modalTpl, this.vcr);
|
|
6675
|
+
this.overlayRef.attach(portal);
|
|
6676
|
+
this.overlayRef.keydownEvents().subscribe((ev) => {
|
|
6677
|
+
if (ev.key === 'Escape')
|
|
6678
|
+
this.onClickLeftButton();
|
|
6679
|
+
});
|
|
6680
|
+
}
|
|
6681
|
+
onClickLeftButton() {
|
|
6682
|
+
this.overlayRef?.dispose();
|
|
6683
|
+
this.overlayRef = undefined;
|
|
6684
|
+
this.onLeftButtonClick.emit();
|
|
6685
|
+
}
|
|
6686
|
+
onClickRightButton() {
|
|
6687
|
+
this.overlayRef?.dispose();
|
|
6688
|
+
this.overlayRef = undefined;
|
|
6689
|
+
this.onRightButtonClick.emit();
|
|
6690
|
+
}
|
|
6691
|
+
ngOnDestroy() {
|
|
6692
|
+
this.onClickLeftButton();
|
|
6693
|
+
}
|
|
6694
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AlertComponent, deps: [{ token: i2.Overlay }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6695
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: AlertComponent, isStandalone: true, selector: "ius-alert", inputs: { title: "title", text: "text", leftButtonName: "leftButtonName", rightButtonName: "rightButtonName" }, outputs: { onRightButtonClick: "onRightButtonClick", onLeftButtonClick: "onLeftButtonClick" }, viewQueries: [{ propertyName: "modalTpl", first: true, predicate: ["modalTpl"], descendants: true, static: true }], ngImport: i0, template: "<ng-template #modalTpl>\r\n <div class=\"modal\">\r\n <h3 class=\"title\">{{ title }}</h3>\r\n\r\n <ius-simple-divider></ius-simple-divider>\r\n\r\n <p class=\"msg\">{{ text }}</p>\r\n\r\n <div class=\"actions\">\r\n <ius-button-standard-secondary (buttonClicked)=\"onClickLeftButton()\">{{\r\n leftButtonName\r\n }}</ius-button-standard-secondary>\r\n <ius-button-dynamic\r\n [labelDefault]=\"rightButtonName\"\r\n (buttonClicked)=\"onClickRightButton()\"\r\n ></ius-button-dynamic>\r\n </div>\r\n </div>\r\n</ng-template>\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}.modal{background:#fff;border-radius:16px;padding:18px;box-shadow:0 18px 45px #00000040;display:flex;flex-direction:column;max-width:450px}.title{color:#333;font-family:Roboto,sans-serif;font-size:1.25rem;font-style:normal;font-weight:700;line-height:26px;letter-spacing:.2px;overflow-wrap:anywhere;word-break:break-word;white-space:normal}.msg{color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px;overflow-wrap:anywhere;word-break:break-word;white-space:normal}.actions{display:flex;padding:8px 16px;justify-content:space-evenly;gap:4px}\n"], dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: PortalModule }, { kind: "component", type: ButtonStandardSecondaryComponent, selector: "ius-button-standard-secondary", inputs: ["disabled"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonDynamicComponent, selector: "ius-button-dynamic", inputs: ["labelDefault", "labelSuccess", "labelError", "disabled", "loading", "result", "autoReset", "autoResetDelay"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }] }); }
|
|
6696
|
+
}
|
|
6697
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AlertComponent, decorators: [{
|
|
6698
|
+
type: Component,
|
|
6699
|
+
args: [{ selector: 'ius-alert', standalone: true, imports: [OverlayModule, CommonModule, PortalModule, ButtonStandardSecondaryComponent, ButtonDynamicComponent, SimpleDividerComponent], template: "<ng-template #modalTpl>\r\n <div class=\"modal\">\r\n <h3 class=\"title\">{{ title }}</h3>\r\n\r\n <ius-simple-divider></ius-simple-divider>\r\n\r\n <p class=\"msg\">{{ text }}</p>\r\n\r\n <div class=\"actions\">\r\n <ius-button-standard-secondary (buttonClicked)=\"onClickLeftButton()\">{{\r\n leftButtonName\r\n }}</ius-button-standard-secondary>\r\n <ius-button-dynamic\r\n [labelDefault]=\"rightButtonName\"\r\n (buttonClicked)=\"onClickRightButton()\"\r\n ></ius-button-dynamic>\r\n </div>\r\n </div>\r\n</ng-template>\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}.modal{background:#fff;border-radius:16px;padding:18px;box-shadow:0 18px 45px #00000040;display:flex;flex-direction:column;max-width:450px}.title{color:#333;font-family:Roboto,sans-serif;font-size:1.25rem;font-style:normal;font-weight:700;line-height:26px;letter-spacing:.2px;overflow-wrap:anywhere;word-break:break-word;white-space:normal}.msg{color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px;overflow-wrap:anywhere;word-break:break-word;white-space:normal}.actions{display:flex;padding:8px 16px;justify-content:space-evenly;gap:4px}\n"] }]
|
|
6700
|
+
}], ctorParameters: () => [{ type: i2.Overlay }, { type: i0.ViewContainerRef }], propDecorators: { modalTpl: [{
|
|
6701
|
+
type: ViewChild,
|
|
6702
|
+
args: ['modalTpl', { static: true }]
|
|
6703
|
+
}], title: [{
|
|
6704
|
+
type: Input
|
|
6705
|
+
}], text: [{
|
|
6706
|
+
type: Input
|
|
6707
|
+
}], leftButtonName: [{
|
|
6708
|
+
type: Input
|
|
6709
|
+
}], rightButtonName: [{
|
|
6710
|
+
type: Input
|
|
6711
|
+
}], onRightButtonClick: [{
|
|
6712
|
+
type: Output
|
|
6713
|
+
}], onLeftButtonClick: [{
|
|
6714
|
+
type: Output
|
|
6715
|
+
}] } });
|
|
6716
|
+
|
|
6636
6717
|
class InputCardComponent {
|
|
6637
6718
|
constructor() {
|
|
6638
6719
|
this.textInputCvv = '';
|
|
@@ -6788,5 +6869,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
6788
6869
|
* Generated bundle index. Do not edit.
|
|
6789
6870
|
*/
|
|
6790
6871
|
|
|
6791
|
-
export { AvatarIconComponent, BadgeComponent, BreadcrumbComponent, ButtonAccountsComponent, ButtonAuthComponent, ButtonCircleSecondaryComponent, ButtonCircleTertiaryComponent, ButtonDynamicComponent, ButtonFilterComponent, ButtonMenuLinkComponent, ButtonOrderComponent, ButtonSquaredSecondaryComponent, ButtonSquaredTertiaryComponent, ButtonStandardPrimaryComponent, ButtonStandardSecondaryComponent, ButtonStandardTertiaryComponent, ButtonStandardTertiarySmallComponent, CalificationComponent, CardActividadEventoComponent, CardAgendaJudicialComponent, CardBlockComponent, CardButtonCheckboxComponent, CardCollapseDetalleProcesoComponent, CardDynamicContentComponent, CardEtapaSubetapaComponent, CardGestionCupoComponent, CardImpulsoProcesalComponent, CardInfoFacturacionComponent, CardListConsumoComponent, CardListDragOnComponent, CardListMovimientosComponent, CardListProcesoComponent, CardLogComponent, CardPlanSmallComponent, CardPlanSubscriptionComponent, CardTicketComponent, CardTipoProcesoComponent, CardUsoPlanComponent, CardVigilanciaJudicialComponent, CategoriesComponent, ChartsDonutComponent, CheckboxComponent, CheckboxRadioComponent, ChipUserComponent, CustomDropdownComponent, DateHourPickerComponent, DatePickerComponent, DoubleDatePickerComponent, DrawerContainerRightComponent, DropdownComponent, DropdownContextualMenuComponent, DropdownOptionItemComponent, DropdownUserMenuComponent, FilterItemComponent, IconLgComponent, IconMdComponent, IconSmComponent, IconXlComponent, IconXsComponent, IconXxlComponent, InputCardComponent, InputLargeComponent, InputOtpComponent, InputPasswordComponent, InputSelectComponent, InputSelectFilterComponent, InputSelectNumberComponent, InputTextfieldComponent, IusChartsBarGroupedComponent, LinearProgressBarComponent, LoadingCircleComponent, MenuItemComponent, NavRailComponent, NotificationCardComponent, OptionComponent, OptionItemComponent, PopoverDirective, SearchBarComponent, SectionCollapseDrawerChildComponent, SectionCollapseDrawerParentComponent, SegmentComponent, SimpleCardContadorComponent, SimpleChipComponent, SimpleDividerComponent, SimpleUserCardComponent, SlideToggleComponent, SnackbarComponent, ToolbarComponent, ToolbarUserMenuComponent, UserCardComponent };
|
|
6872
|
+
export { AlertComponent, AvatarIconComponent, BadgeComponent, BreadcrumbComponent, ButtonAccountsComponent, ButtonAuthComponent, ButtonCircleSecondaryComponent, ButtonCircleTertiaryComponent, ButtonDynamicComponent, ButtonFilterComponent, ButtonMenuLinkComponent, ButtonOrderComponent, ButtonSquaredSecondaryComponent, ButtonSquaredTertiaryComponent, ButtonStandardPrimaryComponent, ButtonStandardSecondaryComponent, ButtonStandardTertiaryComponent, ButtonStandardTertiarySmallComponent, CalificationComponent, CardActividadEventoComponent, CardAgendaJudicialComponent, CardBlockComponent, CardButtonCheckboxComponent, CardCollapseDetalleProcesoComponent, CardDynamicContentComponent, CardEtapaSubetapaComponent, CardGestionCupoComponent, CardImpulsoProcesalComponent, CardInfoFacturacionComponent, CardListConsumoComponent, CardListDragOnComponent, CardListMovimientosComponent, CardListProcesoComponent, CardLogComponent, CardPlanSmallComponent, CardPlanSubscriptionComponent, CardTicketComponent, CardTipoProcesoComponent, CardUsoPlanComponent, CardVigilanciaJudicialComponent, CategoriesComponent, ChartsDonutComponent, CheckboxComponent, CheckboxRadioComponent, ChipUserComponent, CustomDropdownComponent, DateHourPickerComponent, DatePickerComponent, DoubleDatePickerComponent, DrawerContainerRightComponent, DropdownComponent, DropdownContextualMenuComponent, DropdownOptionItemComponent, DropdownUserMenuComponent, FilterItemComponent, IconLgComponent, IconMdComponent, IconSmComponent, IconXlComponent, IconXsComponent, IconXxlComponent, InputCardComponent, InputLargeComponent, InputOtpComponent, InputPasswordComponent, InputSelectComponent, InputSelectFilterComponent, InputSelectNumberComponent, InputTextfieldComponent, IusChartsBarGroupedComponent, LinearProgressBarComponent, LoadingCircleComponent, MenuItemComponent, NavRailComponent, NotificationCardComponent, OptionComponent, OptionItemComponent, PopoverDirective, SearchBarComponent, SectionCollapseDrawerChildComponent, SectionCollapseDrawerParentComponent, SegmentComponent, SimpleCardContadorComponent, SimpleChipComponent, SimpleDividerComponent, SimpleUserCardComponent, SlideToggleComponent, SnackbarComponent, ToolbarComponent, ToolbarUserMenuComponent, UserCardComponent };
|
|
6792
6873
|
//# sourceMappingURL=litigiovirtual-ius-design-components.mjs.map
|