ngx-vector-components 2.2.1 → 2.2.2
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/CHANGELOG.md +7 -0
- package/assets/styles/_variables.scss +3 -0
- package/esm2020/lib/components/breadcrumb/breadcrumb.component.mjs +2 -2
- package/esm2020/lib/components/fields/button/button.component.mjs +2 -2
- package/esm2020/lib/components/fields/calendar-field/calendar-field.component.mjs +2 -2
- package/esm2020/lib/components/fields/currency-field/currency-field.component.mjs +2 -2
- package/esm2020/lib/components/fields/data-table/data-table.component.mjs +2 -2
- package/esm2020/lib/components/fields/dropdown-field/dropdown-field.component.mjs +2 -2
- package/esm2020/lib/components/fields/multiselect-field/multiselect-field.component.mjs +2 -2
- package/esm2020/lib/components/fields/percentage-field/percentage-field.component.mjs +2 -2
- package/esm2020/lib/components/fields/range-value/range-value.component.mjs +2 -2
- package/esm2020/lib/components/fields/text-field/text-field.component.mjs +2 -2
- package/esm2020/lib/components/fields/textarea-field/textarea-field.component.mjs +2 -2
- package/esm2020/lib/components/generic-error-modal/generic-error-modal.component.mjs +2 -2
- package/esm2020/lib/components/generic-modal/generic-modal.component.mjs +2 -2
- package/esm2020/lib/components/menu/menu.component.mjs +3 -3
- package/esm2020/lib/components/menu/sub-menus-list/sub-menus-list.component.mjs +3 -3
- package/esm2020/lib/components/top-bar/top-bar.component.mjs +2 -2
- package/fesm2015/ngx-vector-components.mjs +32 -32
- package/fesm2015/ngx-vector-components.mjs.map +1 -1
- package/fesm2020/ngx-vector-components.mjs +32 -32
- package/fesm2020/ngx-vector-components.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -24,10 +24,10 @@ export class SubMenusListComponent {
|
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
26
|
SubMenusListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: SubMenusListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
27
|
-
SubMenusListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: SubMenusListComponent, selector: "vector-sub-menus-list", inputs: { showList: "showList", options: "options", childLevel: "childLevel", submenuSelected: "submenuSelected" }, outputs: { submenuSelectedChange: "submenuSelectedChange" }, ngImport: i0, template: "<div class=\"sub-menu-container\">\r\n <ul *ngIf=\"showList\" class=\"sub-menu\">\r\n <div *ngFor=\"let submenuItem of options\">\r\n <li class=\"sub-menu-item\" [ngStyle]=\"{ 'padding-left': paddingLeft }\" (click)=\"submenuClick(submenuItem)\">\r\n <div\r\n class=\"current-item\"\r\n [ngClass]=\"{\r\n 'active-menu': submenuSelected?.id === submenuItem.id,\r\n 'always-open': !!submenuItem.alwaysOpen,\r\n 'last-child': !submenuItem.children?.length\r\n }\"\r\n [pTooltip]=\"submenuItem.label\"\r\n tooltipPosition=\"right\"\r\n >\r\n <div *ngIf=\"submenuItem.icon\" class=\"icon-container\">\r\n <i [class]=\"submenuItem.icon\"></i>\r\n </div>\r\n <span class=\"menu-label\">{{ submenuItem.label }}</span>\r\n <i\r\n *ngIf=\"submenuItem.children?.length && !submenuItem.alwaysOpen\"\r\n class=\"fas angle-icon\"\r\n [ngClass]=\"{\r\n 'fa-angle-down': submenuSelected?.id !== submenuItem.id,\r\n 'fa-angle-up': submenuSelected?.id === submenuItem.id\r\n }\"\r\n ></i>\r\n </div>\r\n </li>\r\n <vector-sub-menus-list\r\n *ngIf=\"submenuItem?.children\"\r\n [options]=\"submenuItem?.children\"\r\n [showList]=\"submenuItem?.id === submenuSelected?.id || !!submenuItem?.alwaysOpen\"\r\n [childLevel]=\"childLevel + 1\"\r\n (submenuSelectedChange)=\"submenuClick($event)\"\r\n ></vector-sub-menus-list>\r\n </div>\r\n </ul>\r\n</div>\r\n", styles: [":root{--theme-primary: #0046e8;--theme-dark: #3a2b68;--background: #f2f2f7;--font-color: #151515;--disabled-background: #bcbcbc;--placeholder-color: #aaaaaa80;--border-radius: 5px;--theme-primary-transparent: rgba(1, 70, 108, .8);--grey-light: #e5e5ea;--grey-lighter: #eff0f6;--grey-dark: #6e7f88;--error-color: #fd6a6a;--error-color-dark: #ff4136;--error-color-transparent: #fd6a6a1a;--success-color: #11b797;--success-color-dark: #0e8a71;--theme-light: #0145e8;--warning-color: #e9c429;--cancel-color: #ca024f;--form-labels-color: #4e4b66}.angle-icon{position:absolute;right:10px}.menu-icon{filter:brightness(0) saturate(100%) invert(14%) sepia(87%) saturate(1218%) hue-rotate(233deg) brightness(88%) contrast(90%);width:20px;height:20px}.icon-container{width:20px;height:20px}.icon-container .menu-icon{display:flex;justify-content:center;align-items:center;font-size:1.4em}.menu-label{color:var(--theme-dark);font-weight:600;text-decoration:none;padding-bottom:1px;margin-left:20px;min-width:170px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--grey-light)}.sub-menu-container .sub-menu{list-style:none;display:contents}.sub-menu-container .sub-menu .sub-menu-item{animation:showSubMenu ease-in-out .1s;animation-fill-mode:both}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(1n){animation-delay:50ms}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(2n){animation-delay:.1s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(3n){animation-delay:.15s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(4n){animation-delay:.2s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(5n){animation-delay:.25s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(6n){animation-delay:.3s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(7n){animation-delay:.35s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(8n){animation-delay:.4s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(9n){animation-delay:.45s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(10n){animation-delay:.5s}.sub-menu-container .sub-menu .sub-menu-item .current-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}.sub-menu-container .sub-menu .sub-menu-item .current-item:not(.always-open){cursor:pointer}.sub-menu-container .sub-menu .sub-menu-item .current-item:hover,.sub-menu-container .sub-menu .sub-menu-item .current-item.active{background-color:var(--grey-light)}.sub-menu-container .sub-menu .sub-menu-item .current-item.active span,.sub-menu-container .sub-menu .sub-menu-item .current-item.active i{color:#fff}@keyframes showSubMenu{0%{transform:translate(-100%)}to{transform:translate(0)}}.sub-menu-container .sub-menu .sub-menu-item .last-child .menu-label{font-weight:400}\n"], components: [{ type: SubMenusListComponent, selector: "vector-sub-menus-list", inputs: ["showList", "options", "childLevel", "submenuSelected"], outputs: ["submenuSelectedChange"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "pTooltip", "tooltipDisabled", "tooltipOptions"] }] });
|
|
27
|
+
SubMenusListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: SubMenusListComponent, selector: "vector-sub-menus-list", inputs: { showList: "showList", options: "options", childLevel: "childLevel", submenuSelected: "submenuSelected" }, outputs: { submenuSelectedChange: "submenuSelectedChange" }, ngImport: i0, template: "<div class=\"sub-menu-container\">\r\n <ul *ngIf=\"showList\" class=\"sub-menu\">\r\n <div *ngFor=\"let submenuItem of options\">\r\n <li class=\"sub-menu-item\" [ngStyle]=\"{ 'padding-left': paddingLeft }\" (click)=\"submenuClick(submenuItem)\">\r\n <div\r\n class=\"current-item\"\r\n [ngClass]=\"{\r\n 'active-menu': submenuSelected?.id === submenuItem.id,\r\n 'always-open': !!submenuItem.alwaysOpen,\r\n 'last-child': !submenuItem.children?.length\r\n }\"\r\n [pTooltip]=\"submenuItem.label\"\r\n tooltipPosition=\"right\"\r\n >\r\n <div *ngIf=\"submenuItem.icon\" class=\"icon-container\">\r\n <i [class]=\"submenuItem.icon\"></i>\r\n </div>\r\n <span class=\"menu-label\">{{ submenuItem.label }}</span>\r\n <i\r\n *ngIf=\"submenuItem.children?.length && !submenuItem.alwaysOpen\"\r\n class=\"fas angle-icon\"\r\n [ngClass]=\"{\r\n 'fa-angle-down': submenuSelected?.id !== submenuItem.id,\r\n 'fa-angle-up': submenuSelected?.id === submenuItem.id\r\n }\"\r\n ></i>\r\n </div>\r\n </li>\r\n <vector-sub-menus-list\r\n *ngIf=\"submenuItem?.children\"\r\n [options]=\"submenuItem?.children\"\r\n [showList]=\"submenuItem?.id === submenuSelected?.id || !!submenuItem?.alwaysOpen\"\r\n [childLevel]=\"childLevel + 1\"\r\n (submenuSelectedChange)=\"submenuClick($event)\"\r\n ></vector-sub-menus-list>\r\n </div>\r\n </ul>\r\n</div>\r\n", styles: [":root{--theme-primary: #0046e8;--theme-dark: #3a2b68;--background: #f2f2f7;--font-color: #151515;--disabled-background: #bcbcbc;--placeholder-color: #aaaaaa80;--border-radius: 5px;--theme-primary-transparent: rgba(1, 70, 108, .8);--grey-light: #e5e5ea;--grey-lighter: #eff0f6;--grey-dark: #6e7f88;--error-color: #fd6a6a;--error-color-dark: #ff4136;--error-color-transparent: #fd6a6a1a;--success-color: #11b797;--success-color-dark: #0e8a71;--theme-light: #0145e8;--warning-color: #e9c429;--cancel-color: #ca024f;--form-labels-color: #4e4b66;--font-color-primary: #3a2b68;--font-color-secondary: rgb(87, 87, 87)}.angle-icon{position:absolute;right:10px}.menu-icon{filter:brightness(0) saturate(100%) invert(14%) sepia(87%) saturate(1218%) hue-rotate(233deg) brightness(88%) contrast(90%);width:20px;height:20px}.icon-container{width:20px;height:20px}.icon-container .menu-icon{display:flex;justify-content:center;align-items:center;font-size:1.4em}.menu-label{color:var(--theme-dark);font-weight:600;text-decoration:none;padding-bottom:1px;margin-left:20px;min-width:170px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--grey-light)}.sub-menu-container .sub-menu{list-style:none;display:contents}.sub-menu-container .sub-menu .sub-menu-item{animation:showSubMenu ease-in-out .1s;animation-fill-mode:both}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(1n){animation-delay:50ms}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(2n){animation-delay:.1s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(3n){animation-delay:.15s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(4n){animation-delay:.2s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(5n){animation-delay:.25s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(6n){animation-delay:.3s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(7n){animation-delay:.35s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(8n){animation-delay:.4s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(9n){animation-delay:.45s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(10n){animation-delay:.5s}.sub-menu-container .sub-menu .sub-menu-item .current-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}.sub-menu-container .sub-menu .sub-menu-item .current-item:not(.always-open){cursor:pointer}.sub-menu-container .sub-menu .sub-menu-item .current-item:hover,.sub-menu-container .sub-menu .sub-menu-item .current-item.active{background-color:var(--grey-light)}.sub-menu-container .sub-menu .sub-menu-item .current-item.active span,.sub-menu-container .sub-menu .sub-menu-item .current-item.active i{color:#fff}@keyframes showSubMenu{0%{transform:translate(-100%)}to{transform:translate(0)}}.sub-menu-container .sub-menu .sub-menu-item .last-child .menu-label{font-weight:400}\n"], components: [{ type: SubMenusListComponent, selector: "vector-sub-menus-list", inputs: ["showList", "options", "childLevel", "submenuSelected"], outputs: ["submenuSelectedChange"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "pTooltip", "tooltipDisabled", "tooltipOptions"] }] });
|
|
28
28
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: SubMenusListComponent, decorators: [{
|
|
29
29
|
type: Component,
|
|
30
|
-
args: [{ selector: 'vector-sub-menus-list', template: "<div class=\"sub-menu-container\">\r\n <ul *ngIf=\"showList\" class=\"sub-menu\">\r\n <div *ngFor=\"let submenuItem of options\">\r\n <li class=\"sub-menu-item\" [ngStyle]=\"{ 'padding-left': paddingLeft }\" (click)=\"submenuClick(submenuItem)\">\r\n <div\r\n class=\"current-item\"\r\n [ngClass]=\"{\r\n 'active-menu': submenuSelected?.id === submenuItem.id,\r\n 'always-open': !!submenuItem.alwaysOpen,\r\n 'last-child': !submenuItem.children?.length\r\n }\"\r\n [pTooltip]=\"submenuItem.label\"\r\n tooltipPosition=\"right\"\r\n >\r\n <div *ngIf=\"submenuItem.icon\" class=\"icon-container\">\r\n <i [class]=\"submenuItem.icon\"></i>\r\n </div>\r\n <span class=\"menu-label\">{{ submenuItem.label }}</span>\r\n <i\r\n *ngIf=\"submenuItem.children?.length && !submenuItem.alwaysOpen\"\r\n class=\"fas angle-icon\"\r\n [ngClass]=\"{\r\n 'fa-angle-down': submenuSelected?.id !== submenuItem.id,\r\n 'fa-angle-up': submenuSelected?.id === submenuItem.id\r\n }\"\r\n ></i>\r\n </div>\r\n </li>\r\n <vector-sub-menus-list\r\n *ngIf=\"submenuItem?.children\"\r\n [options]=\"submenuItem?.children\"\r\n [showList]=\"submenuItem?.id === submenuSelected?.id || !!submenuItem?.alwaysOpen\"\r\n [childLevel]=\"childLevel + 1\"\r\n (submenuSelectedChange)=\"submenuClick($event)\"\r\n ></vector-sub-menus-list>\r\n </div>\r\n </ul>\r\n</div>\r\n", styles: [":root{--theme-primary: #0046e8;--theme-dark: #3a2b68;--background: #f2f2f7;--font-color: #151515;--disabled-background: #bcbcbc;--placeholder-color: #aaaaaa80;--border-radius: 5px;--theme-primary-transparent: rgba(1, 70, 108, .8);--grey-light: #e5e5ea;--grey-lighter: #eff0f6;--grey-dark: #6e7f88;--error-color: #fd6a6a;--error-color-dark: #ff4136;--error-color-transparent: #fd6a6a1a;--success-color: #11b797;--success-color-dark: #0e8a71;--theme-light: #0145e8;--warning-color: #e9c429;--cancel-color: #ca024f;--form-labels-color: #4e4b66}.angle-icon{position:absolute;right:10px}.menu-icon{filter:brightness(0) saturate(100%) invert(14%) sepia(87%) saturate(1218%) hue-rotate(233deg) brightness(88%) contrast(90%);width:20px;height:20px}.icon-container{width:20px;height:20px}.icon-container .menu-icon{display:flex;justify-content:center;align-items:center;font-size:1.4em}.menu-label{color:var(--theme-dark);font-weight:600;text-decoration:none;padding-bottom:1px;margin-left:20px;min-width:170px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--grey-light)}.sub-menu-container .sub-menu{list-style:none;display:contents}.sub-menu-container .sub-menu .sub-menu-item{animation:showSubMenu ease-in-out .1s;animation-fill-mode:both}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(1n){animation-delay:50ms}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(2n){animation-delay:.1s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(3n){animation-delay:.15s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(4n){animation-delay:.2s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(5n){animation-delay:.25s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(6n){animation-delay:.3s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(7n){animation-delay:.35s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(8n){animation-delay:.4s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(9n){animation-delay:.45s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(10n){animation-delay:.5s}.sub-menu-container .sub-menu .sub-menu-item .current-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}.sub-menu-container .sub-menu .sub-menu-item .current-item:not(.always-open){cursor:pointer}.sub-menu-container .sub-menu .sub-menu-item .current-item:hover,.sub-menu-container .sub-menu .sub-menu-item .current-item.active{background-color:var(--grey-light)}.sub-menu-container .sub-menu .sub-menu-item .current-item.active span,.sub-menu-container .sub-menu .sub-menu-item .current-item.active i{color:#fff}@keyframes showSubMenu{0%{transform:translate(-100%)}to{transform:translate(0)}}.sub-menu-container .sub-menu .sub-menu-item .last-child .menu-label{font-weight:400}\n"] }]
|
|
30
|
+
args: [{ selector: 'vector-sub-menus-list', template: "<div class=\"sub-menu-container\">\r\n <ul *ngIf=\"showList\" class=\"sub-menu\">\r\n <div *ngFor=\"let submenuItem of options\">\r\n <li class=\"sub-menu-item\" [ngStyle]=\"{ 'padding-left': paddingLeft }\" (click)=\"submenuClick(submenuItem)\">\r\n <div\r\n class=\"current-item\"\r\n [ngClass]=\"{\r\n 'active-menu': submenuSelected?.id === submenuItem.id,\r\n 'always-open': !!submenuItem.alwaysOpen,\r\n 'last-child': !submenuItem.children?.length\r\n }\"\r\n [pTooltip]=\"submenuItem.label\"\r\n tooltipPosition=\"right\"\r\n >\r\n <div *ngIf=\"submenuItem.icon\" class=\"icon-container\">\r\n <i [class]=\"submenuItem.icon\"></i>\r\n </div>\r\n <span class=\"menu-label\">{{ submenuItem.label }}</span>\r\n <i\r\n *ngIf=\"submenuItem.children?.length && !submenuItem.alwaysOpen\"\r\n class=\"fas angle-icon\"\r\n [ngClass]=\"{\r\n 'fa-angle-down': submenuSelected?.id !== submenuItem.id,\r\n 'fa-angle-up': submenuSelected?.id === submenuItem.id\r\n }\"\r\n ></i>\r\n </div>\r\n </li>\r\n <vector-sub-menus-list\r\n *ngIf=\"submenuItem?.children\"\r\n [options]=\"submenuItem?.children\"\r\n [showList]=\"submenuItem?.id === submenuSelected?.id || !!submenuItem?.alwaysOpen\"\r\n [childLevel]=\"childLevel + 1\"\r\n (submenuSelectedChange)=\"submenuClick($event)\"\r\n ></vector-sub-menus-list>\r\n </div>\r\n </ul>\r\n</div>\r\n", styles: [":root{--theme-primary: #0046e8;--theme-dark: #3a2b68;--background: #f2f2f7;--font-color: #151515;--disabled-background: #bcbcbc;--placeholder-color: #aaaaaa80;--border-radius: 5px;--theme-primary-transparent: rgba(1, 70, 108, .8);--grey-light: #e5e5ea;--grey-lighter: #eff0f6;--grey-dark: #6e7f88;--error-color: #fd6a6a;--error-color-dark: #ff4136;--error-color-transparent: #fd6a6a1a;--success-color: #11b797;--success-color-dark: #0e8a71;--theme-light: #0145e8;--warning-color: #e9c429;--cancel-color: #ca024f;--form-labels-color: #4e4b66;--font-color-primary: #3a2b68;--font-color-secondary: rgb(87, 87, 87)}.angle-icon{position:absolute;right:10px}.menu-icon{filter:brightness(0) saturate(100%) invert(14%) sepia(87%) saturate(1218%) hue-rotate(233deg) brightness(88%) contrast(90%);width:20px;height:20px}.icon-container{width:20px;height:20px}.icon-container .menu-icon{display:flex;justify-content:center;align-items:center;font-size:1.4em}.menu-label{color:var(--theme-dark);font-weight:600;text-decoration:none;padding-bottom:1px;margin-left:20px;min-width:170px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--grey-light)}.sub-menu-container .sub-menu{list-style:none;display:contents}.sub-menu-container .sub-menu .sub-menu-item{animation:showSubMenu ease-in-out .1s;animation-fill-mode:both}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(1n){animation-delay:50ms}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(2n){animation-delay:.1s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(3n){animation-delay:.15s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(4n){animation-delay:.2s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(5n){animation-delay:.25s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(6n){animation-delay:.3s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(7n){animation-delay:.35s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(8n){animation-delay:.4s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(9n){animation-delay:.45s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(10n){animation-delay:.5s}.sub-menu-container .sub-menu .sub-menu-item .current-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}.sub-menu-container .sub-menu .sub-menu-item .current-item:not(.always-open){cursor:pointer}.sub-menu-container .sub-menu .sub-menu-item .current-item:hover,.sub-menu-container .sub-menu .sub-menu-item .current-item.active{background-color:var(--grey-light)}.sub-menu-container .sub-menu .sub-menu-item .current-item.active span,.sub-menu-container .sub-menu .sub-menu-item .current-item.active i{color:#fff}@keyframes showSubMenu{0%{transform:translate(-100%)}to{transform:translate(0)}}.sub-menu-container .sub-menu .sub-menu-item .last-child .menu-label{font-weight:400}\n"] }]
|
|
31
31
|
}], propDecorators: { showList: [{
|
|
32
32
|
type: Input
|
|
33
33
|
}], options: [{
|
|
@@ -39,4 +39,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImpor
|
|
|
39
39
|
}], submenuSelectedChange: [{
|
|
40
40
|
type: Output
|
|
41
41
|
}] } });
|
|
42
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
42
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3ViLW1lbnVzLWxpc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXZlY3Rvci1jb21wb25lbnRzL3NyYy9saWIvY29tcG9uZW50cy9tZW51L3N1Yi1tZW51cy1saXN0L3N1Yi1tZW51cy1saXN0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC12ZWN0b3ItY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvbWVudS9zdWItbWVudXMtbGlzdC9zdWItbWVudXMtbGlzdC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7O0FBUXZFLE1BQU0sT0FBTyxxQkFBcUI7SUFMbEM7UUFPUyxhQUFRLEdBQUcsS0FBSyxDQUFDO1FBSWpCLGVBQVUsR0FBRyxDQUFDLENBQUM7UUFJZiwwQkFBcUIsR0FBRyxJQUFJLFlBQVksRUFBWSxDQUFDO0tBZ0I3RDtJQWRRLFlBQVksQ0FBQyxNQUFnQjtRQUNsQyxJQUFJLENBQUMsTUFBTSxDQUFDLFVBQVUsRUFBRTtZQUN0QixJQUFJLElBQUksQ0FBQyxlQUFlLEVBQUUsRUFBRSxLQUFLLE1BQU0sQ0FBQyxFQUFFLEVBQUU7Z0JBQzFDLElBQUksQ0FBQyxlQUFlLEdBQUcsU0FBUyxDQUFDO2FBQ2xDO2lCQUFNO2dCQUNMLElBQUksQ0FBQyxlQUFlLEdBQUcsTUFBTSxDQUFDLFFBQVEsRUFBRSxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDO2FBQ3JFO1lBQ0QsSUFBSSxDQUFDLHFCQUFxQixDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQztTQUN6QztJQUNILENBQUM7SUFFRCxJQUFXLFdBQVc7UUFDcEIsT0FBTyxJQUFJLENBQUMsVUFBVSxHQUFHLEVBQUUsR0FBRyxJQUFJLENBQUM7SUFDckMsQ0FBQzs7a0hBekJVLHFCQUFxQjtzR0FBckIscUJBQXFCLDhPQ1JsQywwbERBc0NBLDBuR0Q5QmEscUJBQXFCOzJGQUFyQixxQkFBcUI7a0JBTGpDLFNBQVM7K0JBQ0UsdUJBQXVCOzhCQU0xQixRQUFRO3NCQURkLEtBQUs7Z0JBR0MsT0FBTztzQkFEYixLQUFLO2dCQUdDLFVBQVU7c0JBRGhCLEtBQUs7Z0JBR0MsZUFBZTtzQkFEckIsS0FBSztnQkFHQyxxQkFBcUI7c0JBRDNCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBNZW51SXRlbSB9IGZyb20gJy4uLy4uLy4uL21vZGVscyc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ3ZlY3Rvci1zdWItbWVudXMtbGlzdCcsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3N1Yi1tZW51cy1saXN0LmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9zdWItbWVudXMtbGlzdC5jb21wb25lbnQuc2NzcyddLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgU3ViTWVudXNMaXN0Q29tcG9uZW50IHtcclxuICBASW5wdXQoKVxyXG4gIHB1YmxpYyBzaG93TGlzdCA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpXHJcbiAgcHVibGljIG9wdGlvbnM6IE1lbnVJdGVtW10gfCB1bmRlZmluZWQ7XHJcbiAgQElucHV0KClcclxuICBwdWJsaWMgY2hpbGRMZXZlbCA9IDE7XHJcbiAgQElucHV0KClcclxuICBwdWJsaWMgc3VibWVudVNlbGVjdGVkOiBNZW51SXRlbSB8IHVuZGVmaW5lZDtcclxuICBAT3V0cHV0KClcclxuICBwdWJsaWMgc3VibWVudVNlbGVjdGVkQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxNZW51SXRlbT4oKTtcclxuXHJcbiAgcHVibGljIHN1Ym1lbnVDbGljayhvcHRpb246IE1lbnVJdGVtKSB7XHJcbiAgICBpZiAoIW9wdGlvbi5hbHdheXNPcGVuKSB7XHJcbiAgICAgIGlmICh0aGlzLnN1Ym1lbnVTZWxlY3RlZD8uaWQgPT09IG9wdGlvbi5pZCkge1xyXG4gICAgICAgIHRoaXMuc3VibWVudVNlbGVjdGVkID0gdW5kZWZpbmVkO1xyXG4gICAgICB9IGVsc2Uge1xyXG4gICAgICAgIHRoaXMuc3VibWVudVNlbGVjdGVkID0gb3B0aW9uLmNoaWxkcmVuPy5sZW5ndGggPyBvcHRpb24gOiB1bmRlZmluZWQ7XHJcbiAgICAgIH1cclxuICAgICAgdGhpcy5zdWJtZW51U2VsZWN0ZWRDaGFuZ2UuZW1pdChvcHRpb24pO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgcHVibGljIGdldCBwYWRkaW5nTGVmdCgpIHtcclxuICAgIHJldHVybiB0aGlzLmNoaWxkTGV2ZWwgKiAxMCArICdweCc7XHJcbiAgfVxyXG59XHJcbiIsIjxkaXYgY2xhc3M9XCJzdWItbWVudS1jb250YWluZXJcIj5cclxuICA8dWwgKm5nSWY9XCJzaG93TGlzdFwiIGNsYXNzPVwic3ViLW1lbnVcIj5cclxuICAgIDxkaXYgKm5nRm9yPVwibGV0IHN1Ym1lbnVJdGVtIG9mIG9wdGlvbnNcIj5cclxuICAgICAgPGxpIGNsYXNzPVwic3ViLW1lbnUtaXRlbVwiIFtuZ1N0eWxlXT1cInsgJ3BhZGRpbmctbGVmdCc6IHBhZGRpbmdMZWZ0IH1cIiAoY2xpY2spPVwic3VibWVudUNsaWNrKHN1Ym1lbnVJdGVtKVwiPlxyXG4gICAgICAgIDxkaXZcclxuICAgICAgICAgIGNsYXNzPVwiY3VycmVudC1pdGVtXCJcclxuICAgICAgICAgIFtuZ0NsYXNzXT1cIntcclxuICAgICAgICAgICAgJ2FjdGl2ZS1tZW51Jzogc3VibWVudVNlbGVjdGVkPy5pZCA9PT0gc3VibWVudUl0ZW0uaWQsXHJcbiAgICAgICAgICAgICdhbHdheXMtb3Blbic6ICEhc3VibWVudUl0ZW0uYWx3YXlzT3BlbixcclxuICAgICAgICAgICAgJ2xhc3QtY2hpbGQnOiAhc3VibWVudUl0ZW0uY2hpbGRyZW4/Lmxlbmd0aFxyXG4gICAgICAgICAgfVwiXHJcbiAgICAgICAgICBbcFRvb2x0aXBdPVwic3VibWVudUl0ZW0ubGFiZWxcIlxyXG4gICAgICAgICAgdG9vbHRpcFBvc2l0aW9uPVwicmlnaHRcIlxyXG4gICAgICAgID5cclxuICAgICAgICAgIDxkaXYgKm5nSWY9XCJzdWJtZW51SXRlbS5pY29uXCIgY2xhc3M9XCJpY29uLWNvbnRhaW5lclwiPlxyXG4gICAgICAgICAgICA8aSBbY2xhc3NdPVwic3VibWVudUl0ZW0uaWNvblwiPjwvaT5cclxuICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgPHNwYW4gY2xhc3M9XCJtZW51LWxhYmVsXCI+e3sgc3VibWVudUl0ZW0ubGFiZWwgfX08L3NwYW4+XHJcbiAgICAgICAgICA8aVxyXG4gICAgICAgICAgICAqbmdJZj1cInN1Ym1lbnVJdGVtLmNoaWxkcmVuPy5sZW5ndGggJiYgIXN1Ym1lbnVJdGVtLmFsd2F5c09wZW5cIlxyXG4gICAgICAgICAgICBjbGFzcz1cImZhcyBhbmdsZS1pY29uXCJcclxuICAgICAgICAgICAgW25nQ2xhc3NdPVwie1xyXG4gICAgICAgICAgICAgICdmYS1hbmdsZS1kb3duJzogc3VibWVudVNlbGVjdGVkPy5pZCAhPT0gc3VibWVudUl0ZW0uaWQsXHJcbiAgICAgICAgICAgICAgJ2ZhLWFuZ2xlLXVwJzogc3VibWVudVNlbGVjdGVkPy5pZCA9PT0gc3VibWVudUl0ZW0uaWRcclxuICAgICAgICAgICAgfVwiXHJcbiAgICAgICAgICA+PC9pPlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgICA8L2xpPlxyXG4gICAgICA8dmVjdG9yLXN1Yi1tZW51cy1saXN0XHJcbiAgICAgICAgKm5nSWY9XCJzdWJtZW51SXRlbT8uY2hpbGRyZW5cIlxyXG4gICAgICAgIFtvcHRpb25zXT1cInN1Ym1lbnVJdGVtPy5jaGlsZHJlblwiXHJcbiAgICAgICAgW3Nob3dMaXN0XT1cInN1Ym1lbnVJdGVtPy5pZCA9PT0gc3VibWVudVNlbGVjdGVkPy5pZCB8fCAhIXN1Ym1lbnVJdGVtPy5hbHdheXNPcGVuXCJcclxuICAgICAgICBbY2hpbGRMZXZlbF09XCJjaGlsZExldmVsICsgMVwiXHJcbiAgICAgICAgKHN1Ym1lbnVTZWxlY3RlZENoYW5nZSk9XCJzdWJtZW51Q2xpY2soJGV2ZW50KVwiXHJcbiAgICAgID48L3ZlY3Rvci1zdWItbWVudXMtbGlzdD5cclxuICAgIDwvZGl2PlxyXG4gIDwvdWw+XHJcbjwvZGl2PlxyXG4iXX0=
|
|
@@ -72,10 +72,10 @@ export class TopBarComponent {
|
|
|
72
72
|
}
|
|
73
73
|
}
|
|
74
74
|
TopBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: TopBarComponent, deps: [{ token: i1.MenuService }, { token: i2.AuthService }, { token: i3.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
75
|
-
TopBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: TopBarComponent, selector: "vector-top-bar", inputs: { fintech: "fintech", accountService: "accountService" }, ngImport: i0, template: "<div class=\"top-bar-container\">\r\n <div id=\"menu-toggle\" class=\"menu-toggle\" (click)=\"toggleMenu()\">\r\n <div class=\"menu-icon\"></div>\r\n </div>\r\n\r\n <div class=\"left-items-container\" *ngIf=\"fintech && isDesktop()\">\r\n <span>Banco {{ currentAccount?.bankCode }}</span>\r\n <span class=\"separator\"></span>\r\n <span>AG {{ currentAccount?.agency }}</span>\r\n <span class=\"separator\"></span>\r\n <span>CC {{ currentAccount?.accountNumber }}</span>\r\n <span class=\"separator\"></span>\r\n <span\r\n >{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}\r\n {{ currentAccount?.documentFormatted }}</span\r\n >\r\n <ng-container *ngIf=\"otherAccounts?.length\">\r\n <span class=\"separator\"></span>\r\n <div class=\"change-account-button\" (click)=\"changeAccountMenu.toggle($event)\">\r\n <span>Alternar conta</span>\r\n <span\r\n class=\"fas\"\r\n [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n ></span>\r\n </div>\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"right-items-container\" [ngClass]=\"{ 'hidden-items': hideElements }\">\r\n <span class=\"fas fa-bell\"></span>\r\n <span class=\"separator\"></span>\r\n <div\r\n #menuContainer\r\n class=\"menu-container\"\r\n (click)=\"menu.toggle($event)\"\r\n pTooltip=\"Enter your username\"\r\n tooltipPosition=\"bottom\"\r\n tooltipEvent=\"click\"\r\n >\r\n <span class=\"user-name\">{{ currentAccount?.name || '' }}</span>\r\n <span class=\"fas\" [ngClass]=\"{ 'fa-angle-down': !openedMenu, 'fa-angle-up': openedMenu }\"></span>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- <p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\r\n <ng-template pTemplate>\r\n <ul class=\"user-menu\">\r\n <li (click)=\"logout()\">\r\n <span class=\"logout user-menu-icon\"></span>\r\n <span>Sair</span>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n</p-overlayPanel> -->\r\n\r\n<p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\r\n <ng-template pTemplate>\r\n <div class=\"account-info\" *ngIf=\"!isDesktop()\">\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>Banco: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.bank }}</span>\r\n </div>\r\n\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>AG: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.agency }}</span>\r\n </div>\r\n </div>\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>CC: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.accountNumber }}</span>\r\n </div>\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n <span class=\"account-info-value\"> {{ currentAccount?.documentFormatted }}</span>\r\n </div>\r\n </div>\r\n <div class=\"change-account-mobile\" (click)=\"changeAccountMenu.toggle($event)\" *ngIf=\"otherAccounts?.length\">\r\n <span class=\"change-account-mobile-label\">Alternar conta</span>\r\n <span\r\n class=\"fas\"\r\n [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n ></span>\r\n </div>\r\n </div>\r\n <ul class=\"user-menu\">\r\n <li (click)=\"goToTermsOfUse(); menu.hide()\">\r\n <span class=\"terms-of-use user-menu-icon\"></span>\r\n <span>Termos de Uso</span>\r\n </li>\r\n <li (click)=\"goToPasswordChange(); menu.hide()\">\r\n <span class=\"fintech-password user-menu-icon\"></span>\r\n <span>Senha Fintech</span>\r\n </li>\r\n <li (click)=\"goToTariff()\">\r\n <span class=\"tariffs user-menu-icon\"></span>\r\n <span>Tarifas</span>\r\n </li>\r\n <li (click)=\"logout()\">\r\n <span class=\"logout user-menu-icon\"></span>\r\n <span>Sair</span>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n</p-overlayPanel>\r\n\r\n<p-overlayPanel #changeAccountMenu (onHide)=\"openedChangeAccountMenu = false\" (onShow)=\"openedChangeAccountMenu = true\">\r\n <ng-template pTemplate>\r\n <div\r\n *ngFor=\"let account of otherAccounts\"\r\n class=\"account-info change-account-info\"\r\n (click)=\"changeAccount(account)\"\r\n >\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>Banco: </span>\r\n <span class=\"account-info-value\">{{ account?.bank }}</span>\r\n </div>\r\n\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>AG: </span>\r\n <span class=\"account-info-value\">{{ account?.agency }}</span>\r\n </div>\r\n </div>\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>CC: </span>\r\n <span class=\"account-info-value\">{{ account?.accountNumber }}</span>\r\n </div>\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>{{ account?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n <span class=\"account-info-value\"> {{ account?.documentFormatted }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</p-overlayPanel>\r\n", styles: [":root{--theme-primary: #0046e8;--theme-dark: #3a2b68;--background: #f2f2f7;--font-color: #151515;--disabled-background: #bcbcbc;--placeholder-color: #aaaaaa80;--border-radius: 5px;--theme-primary-transparent: rgba(1, 70, 108, .8);--grey-light: #e5e5ea;--grey-lighter: #eff0f6;--grey-dark: #6e7f88;--error-color: #fd6a6a;--error-color-dark: #ff4136;--error-color-transparent: #fd6a6a1a;--success-color: #11b797;--success-color-dark: #0e8a71;--theme-light: #0145e8;--warning-color: #e9c429;--cancel-color: #ca024f;--form-labels-color: #4e4b66}.fas{color:#fff}.top-bar-container{height:81px;background-color:var(--theme-light);display:flex;flex:1;align-items:center;padding:15px;color:#fff;font-size:1em;font-weight:600;box-shadow:2px 2px 4px #00000029}.top-bar-container .menu-toggle{cursor:pointer;margin-right:10px;padding:8px}.top-bar-container .menu-toggle .menu-icon{background:url(\"data:image/svg+xml,%3Csvg width%3D%2221%22 height%3D%2214%22 viewBox%3D%220 0 21 14%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0D%3Cpath d%3D%22M0 13.846H15V11.538H0V13.846ZM0 8.077H11.538V5.769H0V8.077ZM0 0V2.308H15V0H0ZM20.769 11.065L16.638 6.923L20.769 2.781L19.142 1.154L13.373 6.923L19.142 12.692L20.769 11.065Z%22 fill%3D%22white%22%2F%3E%0D%3C%2Fsvg%3E%0D\");background-repeat:no-repeat;background-size:cover;width:20.77px;height:13.85px}.top-bar-container .menu-toggle span{font-size:1.3em}.top-bar-container .left-items-container{display:flex;align-items:center;flex-direction:row}.top-bar-container .right-items-container{flex:1;display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.top-bar-container .right-items-container .menu-container{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;cursor:pointer}.top-bar-container .right-items-container .menu-container .user-name{margin-right:15px}.separator{height:100%;margin-left:15px;margin-right:15px}.separator:after{content:\"\";height:100%;border-right:2px solid #ffffff}.account-info{display:flex;flex-direction:column;background-color:var(--theme-primary);border-radius:var(--border-radius);color:#fff;padding:5px;width:300px}.account-info .account-info-row{display:flex;flex-direction:row;align-items:center}.account-info .account-info-row .account-info-item{flex:1}.account-info .account-info-row .account-info-item:first-child{flex:.6}.account-info .account-info-row .account-info-item .account-info-value{font-weight:200}.account-info .change-account-mobile{font-size:.8em;align-items:center;display:flex}.account-info .change-account-mobile .change-account-mobile-label{margin-right:5px}.change-account-info{background-color:unset;cursor:pointer}.change-account-info:hover{background-color:var(--theme-primary)}.user-menu{padding:0;margin:0;list-style:none;color:#fff}.user-menu li{display:flex;flex-direction:row;align-items:center;padding:4px;font-weight:200;cursor:pointer;border-radius:var(--border-radius)}.user-menu li:hover{background-color:var(--theme-primary)}.user-menu li .user-menu-icon{width:28px;height:25px;background-repeat:no-repeat}.user-menu li .logout{background-image:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2217.687%22 height%3D%2217.686%22 viewBox%3D%220 0 17.687 17.686%22%3E%0D %3Cg id%3D%22Grupo_8513%22 data-name%3D%22Grupo 8513%22 transform%3D%22translate(12.157)%22%3E%0D %3Cg id%3D%22Grupo_1649%22 data-name%3D%22Grupo 1649%22%3E%0D %3Cg id%3D%22exit-to-app%22%3E%0D %3Cpath id%3D%22Caminho_706%22 data-name%3D%22Caminho 706%22 d%3D%22M1628.279%2C320.831l1.375%2C1.375%2C4.914-4.912-4.914-4.913-1.375%2C1.375%2C2.554%2C2.555H1621.3v1.965h9.531Zm8.745-12.381h-13.757a1.971%2C1.971%2C0%2C0%2C0-1.965%2C1.965v3.93h1.965v-3.93h13.757v13.756h-13.757v-3.93H1621.3v3.93a1.971%2C1.971%2C0%2C0%2C0%2C1.965%2C1.965h13.757a1.971%2C1.971%2C0%2C0%2C0%2C1.965-1.965V310.415A1.971%2C1.971%2C0%2C0%2C0%2C1637.024%2C308.45Z%22 transform%3D%22translate(-1633.459 -308.45)%22 fill%3D%22%23fff%22%2F%3E%0D %3C%2Fg%3E%0D %3C%2Fg%3E%0D %3C%2Fg%3E%0D%3C%2Fsvg%3E%0D\");background-position-y:3px}@media screen and (max-width: 441px){.hidden-items{display:none!important}}\n"], components: [{ type: i4.OverlayPanel, selector: "p-overlayPanel", inputs: ["dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { type: i7.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
75
|
+
TopBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: TopBarComponent, selector: "vector-top-bar", inputs: { fintech: "fintech", accountService: "accountService" }, ngImport: i0, template: "<div class=\"top-bar-container\">\r\n <div id=\"menu-toggle\" class=\"menu-toggle\" (click)=\"toggleMenu()\">\r\n <div class=\"menu-icon\"></div>\r\n </div>\r\n\r\n <div class=\"left-items-container\" *ngIf=\"fintech && isDesktop()\">\r\n <span>Banco {{ currentAccount?.bankCode }}</span>\r\n <span class=\"separator\"></span>\r\n <span>AG {{ currentAccount?.agency }}</span>\r\n <span class=\"separator\"></span>\r\n <span>CC {{ currentAccount?.accountNumber }}</span>\r\n <span class=\"separator\"></span>\r\n <span\r\n >{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}\r\n {{ currentAccount?.documentFormatted }}</span\r\n >\r\n <ng-container *ngIf=\"otherAccounts?.length\">\r\n <span class=\"separator\"></span>\r\n <div class=\"change-account-button\" (click)=\"changeAccountMenu.toggle($event)\">\r\n <span>Alternar conta</span>\r\n <span\r\n class=\"fas\"\r\n [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n ></span>\r\n </div>\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"right-items-container\" [ngClass]=\"{ 'hidden-items': hideElements }\">\r\n <span class=\"fas fa-bell\"></span>\r\n <span class=\"separator\"></span>\r\n <div\r\n #menuContainer\r\n class=\"menu-container\"\r\n (click)=\"menu.toggle($event)\"\r\n pTooltip=\"Enter your username\"\r\n tooltipPosition=\"bottom\"\r\n tooltipEvent=\"click\"\r\n >\r\n <span class=\"user-name\">{{ currentAccount?.name || '' }}</span>\r\n <span class=\"fas\" [ngClass]=\"{ 'fa-angle-down': !openedMenu, 'fa-angle-up': openedMenu }\"></span>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- <p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\r\n <ng-template pTemplate>\r\n <ul class=\"user-menu\">\r\n <li (click)=\"logout()\">\r\n <span class=\"logout user-menu-icon\"></span>\r\n <span>Sair</span>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n</p-overlayPanel> -->\r\n\r\n<p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\r\n <ng-template pTemplate>\r\n <div class=\"account-info\" *ngIf=\"!isDesktop()\">\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>Banco: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.bank }}</span>\r\n </div>\r\n\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>AG: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.agency }}</span>\r\n </div>\r\n </div>\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>CC: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.accountNumber }}</span>\r\n </div>\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n <span class=\"account-info-value\"> {{ currentAccount?.documentFormatted }}</span>\r\n </div>\r\n </div>\r\n <div class=\"change-account-mobile\" (click)=\"changeAccountMenu.toggle($event)\" *ngIf=\"otherAccounts?.length\">\r\n <span class=\"change-account-mobile-label\">Alternar conta</span>\r\n <span\r\n class=\"fas\"\r\n [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n ></span>\r\n </div>\r\n </div>\r\n <ul class=\"user-menu\">\r\n <li (click)=\"goToTermsOfUse(); menu.hide()\">\r\n <span class=\"terms-of-use user-menu-icon\"></span>\r\n <span>Termos de Uso</span>\r\n </li>\r\n <li (click)=\"goToPasswordChange(); menu.hide()\">\r\n <span class=\"fintech-password user-menu-icon\"></span>\r\n <span>Senha Fintech</span>\r\n </li>\r\n <li (click)=\"goToTariff()\">\r\n <span class=\"tariffs user-menu-icon\"></span>\r\n <span>Tarifas</span>\r\n </li>\r\n <li (click)=\"logout()\">\r\n <span class=\"logout user-menu-icon\"></span>\r\n <span>Sair</span>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n</p-overlayPanel>\r\n\r\n<p-overlayPanel #changeAccountMenu (onHide)=\"openedChangeAccountMenu = false\" (onShow)=\"openedChangeAccountMenu = true\">\r\n <ng-template pTemplate>\r\n <div\r\n *ngFor=\"let account of otherAccounts\"\r\n class=\"account-info change-account-info\"\r\n (click)=\"changeAccount(account)\"\r\n >\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>Banco: </span>\r\n <span class=\"account-info-value\">{{ account?.bank }}</span>\r\n </div>\r\n\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>AG: </span>\r\n <span class=\"account-info-value\">{{ account?.agency }}</span>\r\n </div>\r\n </div>\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>CC: </span>\r\n <span class=\"account-info-value\">{{ account?.accountNumber }}</span>\r\n </div>\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>{{ account?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n <span class=\"account-info-value\"> {{ account?.documentFormatted }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</p-overlayPanel>\r\n", styles: [":root{--theme-primary: #0046e8;--theme-dark: #3a2b68;--background: #f2f2f7;--font-color: #151515;--disabled-background: #bcbcbc;--placeholder-color: #aaaaaa80;--border-radius: 5px;--theme-primary-transparent: rgba(1, 70, 108, .8);--grey-light: #e5e5ea;--grey-lighter: #eff0f6;--grey-dark: #6e7f88;--error-color: #fd6a6a;--error-color-dark: #ff4136;--error-color-transparent: #fd6a6a1a;--success-color: #11b797;--success-color-dark: #0e8a71;--theme-light: #0145e8;--warning-color: #e9c429;--cancel-color: #ca024f;--form-labels-color: #4e4b66;--font-color-primary: #3a2b68;--font-color-secondary: rgb(87, 87, 87)}.fas{color:#fff}.top-bar-container{height:81px;background-color:var(--theme-light);display:flex;flex:1;align-items:center;padding:15px;color:#fff;font-size:1em;font-weight:600;box-shadow:2px 2px 4px #00000029}.top-bar-container .menu-toggle{cursor:pointer;margin-right:10px;padding:8px}.top-bar-container .menu-toggle .menu-icon{background:url(\"data:image/svg+xml,%3Csvg width%3D%2221%22 height%3D%2214%22 viewBox%3D%220 0 21 14%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0D%3Cpath d%3D%22M0 13.846H15V11.538H0V13.846ZM0 8.077H11.538V5.769H0V8.077ZM0 0V2.308H15V0H0ZM20.769 11.065L16.638 6.923L20.769 2.781L19.142 1.154L13.373 6.923L19.142 12.692L20.769 11.065Z%22 fill%3D%22white%22%2F%3E%0D%3C%2Fsvg%3E%0D\");background-repeat:no-repeat;background-size:cover;width:20.77px;height:13.85px}.top-bar-container .menu-toggle span{font-size:1.3em}.top-bar-container .left-items-container{display:flex;align-items:center;flex-direction:row}.top-bar-container .right-items-container{flex:1;display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.top-bar-container .right-items-container .menu-container{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;cursor:pointer}.top-bar-container .right-items-container .menu-container .user-name{margin-right:15px}.separator{height:100%;margin-left:15px;margin-right:15px}.separator:after{content:\"\";height:100%;border-right:2px solid #ffffff}.account-info{display:flex;flex-direction:column;background-color:var(--theme-primary);border-radius:var(--border-radius);color:#fff;padding:5px;width:300px}.account-info .account-info-row{display:flex;flex-direction:row;align-items:center}.account-info .account-info-row .account-info-item{flex:1}.account-info .account-info-row .account-info-item:first-child{flex:.6}.account-info .account-info-row .account-info-item .account-info-value{font-weight:200}.account-info .change-account-mobile{font-size:.8em;align-items:center;display:flex}.account-info .change-account-mobile .change-account-mobile-label{margin-right:5px}.change-account-info{background-color:unset;cursor:pointer}.change-account-info:hover{background-color:var(--theme-primary)}.user-menu{padding:0;margin:0;list-style:none;color:#fff}.user-menu li{display:flex;flex-direction:row;align-items:center;padding:4px;font-weight:200;cursor:pointer;border-radius:var(--border-radius)}.user-menu li:hover{background-color:var(--theme-primary)}.user-menu li .user-menu-icon{width:28px;height:25px;background-repeat:no-repeat}.user-menu li .logout{background-image:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2217.687%22 height%3D%2217.686%22 viewBox%3D%220 0 17.687 17.686%22%3E%0D %3Cg id%3D%22Grupo_8513%22 data-name%3D%22Grupo 8513%22 transform%3D%22translate(12.157)%22%3E%0D %3Cg id%3D%22Grupo_1649%22 data-name%3D%22Grupo 1649%22%3E%0D %3Cg id%3D%22exit-to-app%22%3E%0D %3Cpath id%3D%22Caminho_706%22 data-name%3D%22Caminho 706%22 d%3D%22M1628.279%2C320.831l1.375%2C1.375%2C4.914-4.912-4.914-4.913-1.375%2C1.375%2C2.554%2C2.555H1621.3v1.965h9.531Zm8.745-12.381h-13.757a1.971%2C1.971%2C0%2C0%2C0-1.965%2C1.965v3.93h1.965v-3.93h13.757v13.756h-13.757v-3.93H1621.3v3.93a1.971%2C1.971%2C0%2C0%2C0%2C1.965%2C1.965h13.757a1.971%2C1.971%2C0%2C0%2C0%2C1.965-1.965V310.415A1.971%2C1.971%2C0%2C0%2C0%2C1637.024%2C308.45Z%22 transform%3D%22translate(-1633.459 -308.45)%22 fill%3D%22%23fff%22%2F%3E%0D %3C%2Fg%3E%0D %3C%2Fg%3E%0D %3C%2Fg%3E%0D%3C%2Fsvg%3E%0D\");background-position-y:3px}@media screen and (max-width: 441px){.hidden-items{display:none!important}}\n"], components: [{ type: i4.OverlayPanel, selector: "p-overlayPanel", inputs: ["dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { type: i7.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
76
76
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: TopBarComponent, decorators: [{
|
|
77
77
|
type: Component,
|
|
78
|
-
args: [{ selector: 'vector-top-bar', template: "<div class=\"top-bar-container\">\r\n <div id=\"menu-toggle\" class=\"menu-toggle\" (click)=\"toggleMenu()\">\r\n <div class=\"menu-icon\"></div>\r\n </div>\r\n\r\n <div class=\"left-items-container\" *ngIf=\"fintech && isDesktop()\">\r\n <span>Banco {{ currentAccount?.bankCode }}</span>\r\n <span class=\"separator\"></span>\r\n <span>AG {{ currentAccount?.agency }}</span>\r\n <span class=\"separator\"></span>\r\n <span>CC {{ currentAccount?.accountNumber }}</span>\r\n <span class=\"separator\"></span>\r\n <span\r\n >{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}\r\n {{ currentAccount?.documentFormatted }}</span\r\n >\r\n <ng-container *ngIf=\"otherAccounts?.length\">\r\n <span class=\"separator\"></span>\r\n <div class=\"change-account-button\" (click)=\"changeAccountMenu.toggle($event)\">\r\n <span>Alternar conta</span>\r\n <span\r\n class=\"fas\"\r\n [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n ></span>\r\n </div>\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"right-items-container\" [ngClass]=\"{ 'hidden-items': hideElements }\">\r\n <span class=\"fas fa-bell\"></span>\r\n <span class=\"separator\"></span>\r\n <div\r\n #menuContainer\r\n class=\"menu-container\"\r\n (click)=\"menu.toggle($event)\"\r\n pTooltip=\"Enter your username\"\r\n tooltipPosition=\"bottom\"\r\n tooltipEvent=\"click\"\r\n >\r\n <span class=\"user-name\">{{ currentAccount?.name || '' }}</span>\r\n <span class=\"fas\" [ngClass]=\"{ 'fa-angle-down': !openedMenu, 'fa-angle-up': openedMenu }\"></span>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- <p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\r\n <ng-template pTemplate>\r\n <ul class=\"user-menu\">\r\n <li (click)=\"logout()\">\r\n <span class=\"logout user-menu-icon\"></span>\r\n <span>Sair</span>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n</p-overlayPanel> -->\r\n\r\n<p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\r\n <ng-template pTemplate>\r\n <div class=\"account-info\" *ngIf=\"!isDesktop()\">\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>Banco: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.bank }}</span>\r\n </div>\r\n\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>AG: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.agency }}</span>\r\n </div>\r\n </div>\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>CC: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.accountNumber }}</span>\r\n </div>\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n <span class=\"account-info-value\"> {{ currentAccount?.documentFormatted }}</span>\r\n </div>\r\n </div>\r\n <div class=\"change-account-mobile\" (click)=\"changeAccountMenu.toggle($event)\" *ngIf=\"otherAccounts?.length\">\r\n <span class=\"change-account-mobile-label\">Alternar conta</span>\r\n <span\r\n class=\"fas\"\r\n [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n ></span>\r\n </div>\r\n </div>\r\n <ul class=\"user-menu\">\r\n <li (click)=\"goToTermsOfUse(); menu.hide()\">\r\n <span class=\"terms-of-use user-menu-icon\"></span>\r\n <span>Termos de Uso</span>\r\n </li>\r\n <li (click)=\"goToPasswordChange(); menu.hide()\">\r\n <span class=\"fintech-password user-menu-icon\"></span>\r\n <span>Senha Fintech</span>\r\n </li>\r\n <li (click)=\"goToTariff()\">\r\n <span class=\"tariffs user-menu-icon\"></span>\r\n <span>Tarifas</span>\r\n </li>\r\n <li (click)=\"logout()\">\r\n <span class=\"logout user-menu-icon\"></span>\r\n <span>Sair</span>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n</p-overlayPanel>\r\n\r\n<p-overlayPanel #changeAccountMenu (onHide)=\"openedChangeAccountMenu = false\" (onShow)=\"openedChangeAccountMenu = true\">\r\n <ng-template pTemplate>\r\n <div\r\n *ngFor=\"let account of otherAccounts\"\r\n class=\"account-info change-account-info\"\r\n (click)=\"changeAccount(account)\"\r\n >\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>Banco: </span>\r\n <span class=\"account-info-value\">{{ account?.bank }}</span>\r\n </div>\r\n\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>AG: </span>\r\n <span class=\"account-info-value\">{{ account?.agency }}</span>\r\n </div>\r\n </div>\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>CC: </span>\r\n <span class=\"account-info-value\">{{ account?.accountNumber }}</span>\r\n </div>\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>{{ account?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n <span class=\"account-info-value\"> {{ account?.documentFormatted }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</p-overlayPanel>\r\n", styles: [":root{--theme-primary: #0046e8;--theme-dark: #3a2b68;--background: #f2f2f7;--font-color: #151515;--disabled-background: #bcbcbc;--placeholder-color: #aaaaaa80;--border-radius: 5px;--theme-primary-transparent: rgba(1, 70, 108, .8);--grey-light: #e5e5ea;--grey-lighter: #eff0f6;--grey-dark: #6e7f88;--error-color: #fd6a6a;--error-color-dark: #ff4136;--error-color-transparent: #fd6a6a1a;--success-color: #11b797;--success-color-dark: #0e8a71;--theme-light: #0145e8;--warning-color: #e9c429;--cancel-color: #ca024f;--form-labels-color: #4e4b66}.fas{color:#fff}.top-bar-container{height:81px;background-color:var(--theme-light);display:flex;flex:1;align-items:center;padding:15px;color:#fff;font-size:1em;font-weight:600;box-shadow:2px 2px 4px #00000029}.top-bar-container .menu-toggle{cursor:pointer;margin-right:10px;padding:8px}.top-bar-container .menu-toggle .menu-icon{background:url(\"data:image/svg+xml,%3Csvg width%3D%2221%22 height%3D%2214%22 viewBox%3D%220 0 21 14%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0D%3Cpath d%3D%22M0 13.846H15V11.538H0V13.846ZM0 8.077H11.538V5.769H0V8.077ZM0 0V2.308H15V0H0ZM20.769 11.065L16.638 6.923L20.769 2.781L19.142 1.154L13.373 6.923L19.142 12.692L20.769 11.065Z%22 fill%3D%22white%22%2F%3E%0D%3C%2Fsvg%3E%0D\");background-repeat:no-repeat;background-size:cover;width:20.77px;height:13.85px}.top-bar-container .menu-toggle span{font-size:1.3em}.top-bar-container .left-items-container{display:flex;align-items:center;flex-direction:row}.top-bar-container .right-items-container{flex:1;display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.top-bar-container .right-items-container .menu-container{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;cursor:pointer}.top-bar-container .right-items-container .menu-container .user-name{margin-right:15px}.separator{height:100%;margin-left:15px;margin-right:15px}.separator:after{content:\"\";height:100%;border-right:2px solid #ffffff}.account-info{display:flex;flex-direction:column;background-color:var(--theme-primary);border-radius:var(--border-radius);color:#fff;padding:5px;width:300px}.account-info .account-info-row{display:flex;flex-direction:row;align-items:center}.account-info .account-info-row .account-info-item{flex:1}.account-info .account-info-row .account-info-item:first-child{flex:.6}.account-info .account-info-row .account-info-item .account-info-value{font-weight:200}.account-info .change-account-mobile{font-size:.8em;align-items:center;display:flex}.account-info .change-account-mobile .change-account-mobile-label{margin-right:5px}.change-account-info{background-color:unset;cursor:pointer}.change-account-info:hover{background-color:var(--theme-primary)}.user-menu{padding:0;margin:0;list-style:none;color:#fff}.user-menu li{display:flex;flex-direction:row;align-items:center;padding:4px;font-weight:200;cursor:pointer;border-radius:var(--border-radius)}.user-menu li:hover{background-color:var(--theme-primary)}.user-menu li .user-menu-icon{width:28px;height:25px;background-repeat:no-repeat}.user-menu li .logout{background-image:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2217.687%22 height%3D%2217.686%22 viewBox%3D%220 0 17.687 17.686%22%3E%0D %3Cg id%3D%22Grupo_8513%22 data-name%3D%22Grupo 8513%22 transform%3D%22translate(12.157)%22%3E%0D %3Cg id%3D%22Grupo_1649%22 data-name%3D%22Grupo 1649%22%3E%0D %3Cg id%3D%22exit-to-app%22%3E%0D %3Cpath id%3D%22Caminho_706%22 data-name%3D%22Caminho 706%22 d%3D%22M1628.279%2C320.831l1.375%2C1.375%2C4.914-4.912-4.914-4.913-1.375%2C1.375%2C2.554%2C2.555H1621.3v1.965h9.531Zm8.745-12.381h-13.757a1.971%2C1.971%2C0%2C0%2C0-1.965%2C1.965v3.93h1.965v-3.93h13.757v13.756h-13.757v-3.93H1621.3v3.93a1.971%2C1.971%2C0%2C0%2C0%2C1.965%2C1.965h13.757a1.971%2C1.971%2C0%2C0%2C0%2C1.965-1.965V310.415A1.971%2C1.971%2C0%2C0%2C0%2C1637.024%2C308.45Z%22 transform%3D%22translate(-1633.459 -308.45)%22 fill%3D%22%23fff%22%2F%3E%0D %3C%2Fg%3E%0D %3C%2Fg%3E%0D %3C%2Fg%3E%0D%3C%2Fsvg%3E%0D\");background-position-y:3px}@media screen and (max-width: 441px){.hidden-items{display:none!important}}\n"] }]
|
|
78
|
+
args: [{ selector: 'vector-top-bar', template: "<div class=\"top-bar-container\">\r\n <div id=\"menu-toggle\" class=\"menu-toggle\" (click)=\"toggleMenu()\">\r\n <div class=\"menu-icon\"></div>\r\n </div>\r\n\r\n <div class=\"left-items-container\" *ngIf=\"fintech && isDesktop()\">\r\n <span>Banco {{ currentAccount?.bankCode }}</span>\r\n <span class=\"separator\"></span>\r\n <span>AG {{ currentAccount?.agency }}</span>\r\n <span class=\"separator\"></span>\r\n <span>CC {{ currentAccount?.accountNumber }}</span>\r\n <span class=\"separator\"></span>\r\n <span\r\n >{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}\r\n {{ currentAccount?.documentFormatted }}</span\r\n >\r\n <ng-container *ngIf=\"otherAccounts?.length\">\r\n <span class=\"separator\"></span>\r\n <div class=\"change-account-button\" (click)=\"changeAccountMenu.toggle($event)\">\r\n <span>Alternar conta</span>\r\n <span\r\n class=\"fas\"\r\n [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n ></span>\r\n </div>\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"right-items-container\" [ngClass]=\"{ 'hidden-items': hideElements }\">\r\n <span class=\"fas fa-bell\"></span>\r\n <span class=\"separator\"></span>\r\n <div\r\n #menuContainer\r\n class=\"menu-container\"\r\n (click)=\"menu.toggle($event)\"\r\n pTooltip=\"Enter your username\"\r\n tooltipPosition=\"bottom\"\r\n tooltipEvent=\"click\"\r\n >\r\n <span class=\"user-name\">{{ currentAccount?.name || '' }}</span>\r\n <span class=\"fas\" [ngClass]=\"{ 'fa-angle-down': !openedMenu, 'fa-angle-up': openedMenu }\"></span>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- <p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\r\n <ng-template pTemplate>\r\n <ul class=\"user-menu\">\r\n <li (click)=\"logout()\">\r\n <span class=\"logout user-menu-icon\"></span>\r\n <span>Sair</span>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n</p-overlayPanel> -->\r\n\r\n<p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\r\n <ng-template pTemplate>\r\n <div class=\"account-info\" *ngIf=\"!isDesktop()\">\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>Banco: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.bank }}</span>\r\n </div>\r\n\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>AG: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.agency }}</span>\r\n </div>\r\n </div>\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>CC: </span>\r\n <span class=\"account-info-value\">{{ currentAccount?.accountNumber }}</span>\r\n </div>\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n <span class=\"account-info-value\"> {{ currentAccount?.documentFormatted }}</span>\r\n </div>\r\n </div>\r\n <div class=\"change-account-mobile\" (click)=\"changeAccountMenu.toggle($event)\" *ngIf=\"otherAccounts?.length\">\r\n <span class=\"change-account-mobile-label\">Alternar conta</span>\r\n <span\r\n class=\"fas\"\r\n [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n ></span>\r\n </div>\r\n </div>\r\n <ul class=\"user-menu\">\r\n <li (click)=\"goToTermsOfUse(); menu.hide()\">\r\n <span class=\"terms-of-use user-menu-icon\"></span>\r\n <span>Termos de Uso</span>\r\n </li>\r\n <li (click)=\"goToPasswordChange(); menu.hide()\">\r\n <span class=\"fintech-password user-menu-icon\"></span>\r\n <span>Senha Fintech</span>\r\n </li>\r\n <li (click)=\"goToTariff()\">\r\n <span class=\"tariffs user-menu-icon\"></span>\r\n <span>Tarifas</span>\r\n </li>\r\n <li (click)=\"logout()\">\r\n <span class=\"logout user-menu-icon\"></span>\r\n <span>Sair</span>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n</p-overlayPanel>\r\n\r\n<p-overlayPanel #changeAccountMenu (onHide)=\"openedChangeAccountMenu = false\" (onShow)=\"openedChangeAccountMenu = true\">\r\n <ng-template pTemplate>\r\n <div\r\n *ngFor=\"let account of otherAccounts\"\r\n class=\"account-info change-account-info\"\r\n (click)=\"changeAccount(account)\"\r\n >\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>Banco: </span>\r\n <span class=\"account-info-value\">{{ account?.bank }}</span>\r\n </div>\r\n\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>AG: </span>\r\n <span class=\"account-info-value\">{{ account?.agency }}</span>\r\n </div>\r\n </div>\r\n <div class=\"account-info-row\">\r\n <div class=\"account-info-item\">\r\n <span>CC: </span>\r\n <span class=\"account-info-value\">{{ account?.accountNumber }}</span>\r\n </div>\r\n <span class=\"separator\"></span>\r\n <div class=\"account-info-item\">\r\n <span>{{ account?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n <span class=\"account-info-value\"> {{ account?.documentFormatted }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</p-overlayPanel>\r\n", styles: [":root{--theme-primary: #0046e8;--theme-dark: #3a2b68;--background: #f2f2f7;--font-color: #151515;--disabled-background: #bcbcbc;--placeholder-color: #aaaaaa80;--border-radius: 5px;--theme-primary-transparent: rgba(1, 70, 108, .8);--grey-light: #e5e5ea;--grey-lighter: #eff0f6;--grey-dark: #6e7f88;--error-color: #fd6a6a;--error-color-dark: #ff4136;--error-color-transparent: #fd6a6a1a;--success-color: #11b797;--success-color-dark: #0e8a71;--theme-light: #0145e8;--warning-color: #e9c429;--cancel-color: #ca024f;--form-labels-color: #4e4b66;--font-color-primary: #3a2b68;--font-color-secondary: rgb(87, 87, 87)}.fas{color:#fff}.top-bar-container{height:81px;background-color:var(--theme-light);display:flex;flex:1;align-items:center;padding:15px;color:#fff;font-size:1em;font-weight:600;box-shadow:2px 2px 4px #00000029}.top-bar-container .menu-toggle{cursor:pointer;margin-right:10px;padding:8px}.top-bar-container .menu-toggle .menu-icon{background:url(\"data:image/svg+xml,%3Csvg width%3D%2221%22 height%3D%2214%22 viewBox%3D%220 0 21 14%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0D%3Cpath d%3D%22M0 13.846H15V11.538H0V13.846ZM0 8.077H11.538V5.769H0V8.077ZM0 0V2.308H15V0H0ZM20.769 11.065L16.638 6.923L20.769 2.781L19.142 1.154L13.373 6.923L19.142 12.692L20.769 11.065Z%22 fill%3D%22white%22%2F%3E%0D%3C%2Fsvg%3E%0D\");background-repeat:no-repeat;background-size:cover;width:20.77px;height:13.85px}.top-bar-container .menu-toggle span{font-size:1.3em}.top-bar-container .left-items-container{display:flex;align-items:center;flex-direction:row}.top-bar-container .right-items-container{flex:1;display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.top-bar-container .right-items-container .menu-container{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;cursor:pointer}.top-bar-container .right-items-container .menu-container .user-name{margin-right:15px}.separator{height:100%;margin-left:15px;margin-right:15px}.separator:after{content:\"\";height:100%;border-right:2px solid #ffffff}.account-info{display:flex;flex-direction:column;background-color:var(--theme-primary);border-radius:var(--border-radius);color:#fff;padding:5px;width:300px}.account-info .account-info-row{display:flex;flex-direction:row;align-items:center}.account-info .account-info-row .account-info-item{flex:1}.account-info .account-info-row .account-info-item:first-child{flex:.6}.account-info .account-info-row .account-info-item .account-info-value{font-weight:200}.account-info .change-account-mobile{font-size:.8em;align-items:center;display:flex}.account-info .change-account-mobile .change-account-mobile-label{margin-right:5px}.change-account-info{background-color:unset;cursor:pointer}.change-account-info:hover{background-color:var(--theme-primary)}.user-menu{padding:0;margin:0;list-style:none;color:#fff}.user-menu li{display:flex;flex-direction:row;align-items:center;padding:4px;font-weight:200;cursor:pointer;border-radius:var(--border-radius)}.user-menu li:hover{background-color:var(--theme-primary)}.user-menu li .user-menu-icon{width:28px;height:25px;background-repeat:no-repeat}.user-menu li .logout{background-image:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2217.687%22 height%3D%2217.686%22 viewBox%3D%220 0 17.687 17.686%22%3E%0D %3Cg id%3D%22Grupo_8513%22 data-name%3D%22Grupo 8513%22 transform%3D%22translate(12.157)%22%3E%0D %3Cg id%3D%22Grupo_1649%22 data-name%3D%22Grupo 1649%22%3E%0D %3Cg id%3D%22exit-to-app%22%3E%0D %3Cpath id%3D%22Caminho_706%22 data-name%3D%22Caminho 706%22 d%3D%22M1628.279%2C320.831l1.375%2C1.375%2C4.914-4.912-4.914-4.913-1.375%2C1.375%2C2.554%2C2.555H1621.3v1.965h9.531Zm8.745-12.381h-13.757a1.971%2C1.971%2C0%2C0%2C0-1.965%2C1.965v3.93h1.965v-3.93h13.757v13.756h-13.757v-3.93H1621.3v3.93a1.971%2C1.971%2C0%2C0%2C0%2C1.965%2C1.965h13.757a1.971%2C1.971%2C0%2C0%2C0%2C1.965-1.965V310.415A1.971%2C1.971%2C0%2C0%2C0%2C1637.024%2C308.45Z%22 transform%3D%22translate(-1633.459 -308.45)%22 fill%3D%22%23fff%22%2F%3E%0D %3C%2Fg%3E%0D %3C%2Fg%3E%0D %3C%2Fg%3E%0D%3C%2Fsvg%3E%0D\");background-position-y:3px}@media screen and (max-width: 441px){.hidden-items{display:none!important}}\n"] }]
|
|
79
79
|
}], ctorParameters: function () { return [{ type: i1.MenuService }, { type: i2.AuthService }, { type: i3.Router }]; }, propDecorators: { fintech: [{
|
|
80
80
|
type: Input
|
|
81
81
|
}], accountService: [{
|