@dev-tcloud/tcloud-ui 0.0.0 → 0.0.1

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.
@@ -1,160 +1,196 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Injectable, EventEmitter, Component, Input, Output, ViewChild, NgModule } from '@angular/core';
3
- import * as i2 from '@angular/common';
2
+ import { Component, Input, NgModule, Injectable, EventEmitter, Output, ViewChild } from '@angular/core';
3
+ import * as i1 from '@angular/common';
4
4
  import { CommonModule } from '@angular/common';
5
+ import { Subject } from 'rxjs';
6
+ import * as i1$1 from '@angular/router';
7
+ import { RouterModule } from '@angular/router';
5
8
  import * as i3 from '@angular/forms';
6
9
  import { FormsModule, ReactiveFormsModule } from '@angular/forms';
7
- import { Subject } from 'rxjs';
8
10
  import { trigger, state, style, transition, animate } from '@angular/animations';
9
- import * as i1 from '@angular/router';
10
- import { RouterModule } from '@angular/router';
11
11
 
12
- class TcloudModalService {
12
+ class TCloudUiLinhaLogoComponent {
13
13
  constructor() {
14
- this.param_confirm = {};
15
- this._stateClose = new Subject();
16
- this.stateClose$ = this._stateClose.asObservable();
17
- this._stateConfirm = new Subject();
18
- this.stateConfirm$ = this._stateConfirm.asObservable();
19
- this._stateRespConfirm = new Subject();
20
- this.stateRespConfirm$ = this._stateRespConfirm.asObservable();
21
- this._stateLoading = new Subject();
22
- this.stateLoading$ = this._stateLoading.asObservable();
23
- }
24
- toModal(action) {
25
- this._stateClose.next((action === 'open'));
26
- }
27
- toRespConfirm(resp) {
28
- this._stateRespConfirm.next(resp);
14
+ this.product = '';
15
+ this.logo_name = '';
16
+ this.product_name = '';
17
+ this.alt_product_name = '';
18
+ this.font_size = '';
29
19
  }
30
- getParamConfirm() {
31
- return this.param_confirm;
20
+ ngOnInit() {
21
+ this.logo_name = this.getLogoName();
22
+ this.product_name = this.getProductName();
23
+ this.alt_product_name = (this.product_name).toUpperCase();
24
+ this.font_size = this.getWidthFontSize();
32
25
  }
33
- toConfirm(confirm) {
34
- this.param_confirm = confirm;
35
- this._stateConfirm.next(confirm);
26
+ getProductName() {
27
+ if (this.product !== '') {
28
+ let name = this.product;
29
+ name = (name).replace('_', ' ');
30
+ name = (name).toLowerCase();
31
+ return name;
32
+ }
33
+ return '';
36
34
  }
37
- getLoading() {
38
- return this.loading;
35
+ getLogoName() {
36
+ if (this.product !== '') {
37
+ let name = this.product;
38
+ name = (name).replace('_', '-');
39
+ name = (name).toLowerCase();
40
+ return 'logo-linha-' + name;
41
+ }
42
+ return '';
39
43
  }
40
- setLoading(loading) {
41
- this.loading = loading;
42
- this._stateLoading.next(loading);
44
+ getWidthFontSize() {
45
+ let size = 28;
46
+ let new_size = size;
47
+ const count = (this.product_name).length;
48
+ if (count > 8) {
49
+ new_size = 28;
50
+ }
51
+ if (count > 12) {
52
+ const p = (size * (5 + (count * 2))) / 100;
53
+ new_size = (size - p);
54
+ }
55
+ if (count > 15) {
56
+ const p = (size * (10 + (count * 2))) / 100;
57
+ new_size = (size - p);
58
+ }
59
+ return `${new_size}px`;
43
60
  }
44
61
  }
45
- TcloudModalService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
46
- TcloudModalServiceprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudModalService });
47
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudModalService, decorators: [{
48
- type: Injectable
62
+ TCloudUiLinhaLogoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
63
+ TCloudUiLinhaLogoComponentcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiLinhaLogoComponent, selector: "tcloud-ui-linha-logo", inputs: { product: "product" }, ngImport: i0, template: "<!-- <div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n <img class=\"img-logo\" src=\"/assets/img/logo-totvs.svg\" alt=\"{{ alt_product_name }}\">\r\n <p class=\"text-small\">Linha</p>\r\n <p class=\"text-product\" [style]=\"'font-size:'+font_size+';'\" >{{ product_name }}</p>\r\n</div> -->\r\n\r\n<div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n <img class=\"img-logo\" [attr.data-name-image]=\"logo_name\" [attr.src]=\"'/assets/img/'+logo_name+'.svg'\" alt=\"{{ alt_product_name }}\">\r\n</div>", styles: [".logo-product{display:flex;color:var(--cinza);flex-flow:column;width:150px}.logo-product .img-logo{width:100%;margin-bottom:13px}.logo-product .text-small{font-size:13px;margin:0;padding:0;text-align:left}.logo-product .text-product{text-align:left;font-size:22px;font-weight:700;line-height:1;margin:0;padding:0;text-transform:uppercase;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
64
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoComponent, decorators: [{
65
+ type: Component,
66
+ args: [{ selector: 'tcloud-ui-linha-logo', template: "<!-- <div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n <img class=\"img-logo\" src=\"/assets/img/logo-totvs.svg\" alt=\"{{ alt_product_name }}\">\r\n <p class=\"text-small\">Linha</p>\r\n <p class=\"text-product\" [style]=\"'font-size:'+font_size+';'\" >{{ product_name }}</p>\r\n</div> -->\r\n\r\n<div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n <img class=\"img-logo\" [attr.data-name-image]=\"logo_name\" [attr.src]=\"'/assets/img/'+logo_name+'.svg'\" alt=\"{{ alt_product_name }}\">\r\n</div>", styles: [".logo-product{display:flex;color:var(--cinza);flex-flow:column;width:150px}.logo-product .img-logo{width:100%;margin-bottom:13px}.logo-product .text-small{font-size:13px;margin:0;padding:0;text-align:left}.logo-product .text-product{text-align:left;font-size:22px;font-weight:700;line-height:1;margin:0;padding:0;text-transform:uppercase;white-space:nowrap}\n"] }]
67
+ }], ctorParameters: function () { return []; }, propDecorators: { product: [{
68
+ type: Input
69
+ }] } });
70
+
71
+ class TCloudUiLinhaLogoModule {
72
+ }
73
+ TCloudUiLinhaLogoModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
74
+ TCloudUiLinhaLogoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, declarations: [TCloudUiLinhaLogoComponent], imports: [CommonModule], exports: [TCloudUiLinhaLogoComponent] });
75
+ TCloudUiLinhaLogoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, imports: [CommonModule] });
76
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, decorators: [{
77
+ type: NgModule,
78
+ args: [{
79
+ declarations: [
80
+ TCloudUiLinhaLogoComponent
81
+ ],
82
+ imports: [
83
+ CommonModule
84
+ ],
85
+ exports: [
86
+ TCloudUiLinhaLogoComponent
87
+ ]
88
+ }]
49
89
  }] });
50
90
 
51
- class TcloudUiModalComponent {
52
- constructor(tcloudModalService) {
53
- this.tcloudModalService = tcloudModalService;
54
- this.param_confirm = {};
55
- /* BEGIN - Parametros para modo confirmacao */
56
- this._confirm = false;
57
- this._confirmText = 'Confirmo';
58
- this.autoClose = true;
59
- this.maxWidth = 500;
60
- // psg
61
- this._open = false;
62
- this._loading = false;
63
- this.openChange = new EventEmitter();
64
- this.toConfirm = new EventEmitter();
65
- this.toCancel = new EventEmitter();
66
- this.toAction = new EventEmitter();
91
+ class TabMenuService {
92
+ constructor(_route, _router) {
93
+ this._route = _route;
94
+ this._router = _router;
95
+ this.info_tab = [];
96
+ this.tabSubject = new Subject();
97
+ this.tabState$ = this.tabSubject.asObservable();
98
+ this.loadingSubject = new Subject();
99
+ this.loadingState$ = this.loadingSubject.asObservable();
67
100
  }
68
- set confirm(v) {
69
- this._confirm = v;
70
- this.param_confirm.confirm = this._confirm;
71
- this.param_confirm.confirmText = this._confirmText;
101
+ setTabLoading(loading) {
102
+ this._loading = loading;
103
+ this.loadingSubject.next(loading);
72
104
  }
73
- set confirmText(v) {
74
- this._confirmText = v;
75
- this.param_confirm.confirmText = this._confirmText;
76
- this.param_confirm.confirm = this._confirm;
105
+ getTabLoading() {
106
+ return this._loading;
77
107
  }
78
- set window(size) {
79
- switch (size) {
80
- case 'small':
81
- this.maxWidth = 300;
82
- break;
83
- case 'medium':
84
- this.maxWidth = 500;
85
- break;
86
- case 'large':
87
- this.maxWidth = 900;
88
- break;
89
- case 'big':
90
- this.maxWidth = 1100;
91
- break;
92
- case 'full':
93
- this.maxWidth = 1400;
94
- break;
108
+ setTabState(tab, registerInUrl) {
109
+ this._tab = tab;
110
+ if (registerInUrl) {
111
+ this.set_to_param_url(tab);
95
112
  }
113
+ this.tabSubject.next(tab);
96
114
  }
97
- set open(open) {
98
- this._open = open;
99
- this.fixed_body((open) ? 'on' : 'off');
100
- }
101
- get open() { return this._open; }
102
- set loading(loading) {
103
- this._loading = loading;
104
- this.tcloudModalService.setLoading(loading);
115
+ getTabState() {
116
+ return this._tab;
105
117
  }
106
- get loading() { return this._loading; }
107
- ngOnInit() {
108
- this.subscription = this.tcloudModalService.stateClose$.subscribe((open) => {
109
- if (open) {
110
- /* OPEN */
111
- }
112
- if (!open) {
113
- /* CLOSE */
114
- this.toClose();
115
- }
116
- });
117
- this.subscriptionI = this.tcloudModalService.stateRespConfirm$.subscribe((resp) => {
118
- if (resp) {
119
- /* CONFIRMADO */
120
- this.toConfirm.emit(resp);
121
- this.toClose('confirmed');
118
+ setTabDisabled(id, disabled) {
119
+ let create = true;
120
+ if (this.info_tab && (this.info_tab).length > 0) {
121
+ for (let i = 0; i < (this.info_tab).length; i++) {
122
+ if (this.info_tab[i].id === id) {
123
+ this.info_tab[i].disabled = disabled;
124
+ create = false;
125
+ break;
126
+ }
122
127
  }
123
- if (!resp) {
124
- /* CANCELADO */
125
- this.toCancel.emit(resp);
126
- this.toClose('cancel');
128
+ }
129
+ if (create) {
130
+ (this.info_tab).push({ id: id, disabled: disabled });
131
+ }
132
+ }
133
+ getIsDisabled(id) {
134
+ if (this.info_tab && (this.info_tab).length > 0) {
135
+ for (let i = 0; i < (this.info_tab).length; i++) {
136
+ if (this.info_tab[i].id === id) {
137
+ return this.info_tab[i].disabled;
138
+ }
127
139
  }
140
+ }
141
+ return false;
142
+ }
143
+ set_to_param_url(tab) {
144
+ // changes the route without moving from the current view or
145
+ // triggering a navigation event,
146
+ this._router.navigate([], {
147
+ relativeTo: this._route,
148
+ queryParams: {
149
+ tab: `${tab}`
150
+ },
151
+ queryParamsHandling: 'merge',
152
+ // preserve the existing query params in the route
153
+ skipLocationChange: false
154
+ // do not trigger navigation
128
155
  });
129
- this.tcloudModalService.toConfirm(this.param_confirm);
130
156
  }
131
- toClose(action) {
132
- if (this.autoClose) {
133
- this.open = false;
134
- this.openChange.emit(false);
135
- }
136
- action = (action) ? action : 'close';
137
- this.toAction.emit(action);
138
- this.fixed_body('off');
157
+ }
158
+ TabMenuService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TabMenuService, deps: [{ token: i1$1.ActivatedRoute }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Injectable });
159
+ TabMenuService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TabMenuService });
160
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TabMenuService, decorators: [{
161
+ type: Injectable
162
+ }], ctorParameters: function () { return [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }]; } });
163
+
164
+ class TCloudUiTabMenuComponent {
165
+ constructor(tabMenuService) {
166
+ this.tabMenuService = tabMenuService;
167
+ this.registerInUrl = false;
168
+ this._loading = false;
169
+ this._active = '';
170
+ this.onChange = new EventEmitter();
139
171
  }
140
- checkIsOpen() {
141
- if (this.open) {
142
- this.fixed_body('on');
143
- }
144
- else {
145
- this.fixed_body('off');
172
+ set loading(loading) {
173
+ this._loading = loading;
174
+ this.tabMenuService.setTabLoading(this.loading);
175
+ }
176
+ get loading() { return this._loading; }
177
+ set active(active) {
178
+ this._active = active;
179
+ if (this.active !== '') {
180
+ setTimeout(() => {
181
+ this.tabMenuService.setTabState(this.active, this.registerInUrl);
182
+ });
146
183
  }
147
184
  }
148
- fixed_body(fixed) {
149
- let body = document.getElementsByTagName("BODY")[0];
150
- if (body && body.style) {
151
- if (fixed === 'on') {
152
- body.style.overflowY = "hidden";
153
- }
154
- if (fixed === 'off') {
155
- body.style.removeProperty('overflow-y');
156
- }
185
+ get active() { return this._active; }
186
+ ngOnInit() {
187
+ const tab = this.tabMenuService.getTabState();
188
+ if (tab === this._active) {
189
+ this.onChange.emit(tab);
157
190
  }
191
+ this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
192
+ this.onChange.emit(tab);
193
+ });
158
194
  }
159
195
  ngOnDestroy() {
160
196
  if (this.subscription) {
@@ -162,372 +198,405 @@ class TcloudUiModalComponent {
162
198
  }
163
199
  }
164
200
  }
165
- TcloudUiModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalComponent, deps: [{ token: TcloudModalService }], target: i0.ɵɵFactoryTarget.Component });
166
- TcloudUiModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalComponent, selector: "tcloud-ui-modal", inputs: { confirm: "confirm", confirmText: "confirmText", autoClose: "autoClose", title: "title", maxWidth: "maxWidth", window: "window", open: "open", loading: "loading" }, outputs: { openChange: "openChange", toConfirm: "toConfirm", toCancel: "toCancel", toAction: "toAction" }, providers: [
167
- TcloudModalService
168
- ], ngImport: i0, template: "<div class=\"tc-background-modal\" *ngIf=\"open\" >{{ checkIsOpen() }}</div>\r\n\r\n<div class=\"base-modal\" *ngIf=\"open\">\r\n <div class=\"sub-modal\" [@fade]=\"'visible'\">\r\n <div class=\"tc-modal tc-modal-shadow\" [attr.style]=\"'max-width: ' + maxWidth + 'px;'\">\r\n <div class=\"area-top-actions\">\r\n <button type=\"button\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\r\n <i *ngIf=\"!loading\" class=\"fas fa-times\"></i>\r\n <i *ngIf=\"loading\" class=\"fas fa-spinner fa-spin\"></i>\r\n </button>\r\n </div>\r\n\r\n <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n\r\n <ng-content></ng-content>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Ex: Modal -->\r\n<!-- \r\n <tcloud-ui-modal [(open)]=\"open\">\r\n\r\n <tcloud-ui-modal-header title=\"T\u00EDtulo do Modal\" ></tcloud-ui-modal-header>\r\n\r\n <tcloud-ui-modal-body>\r\n Conte\u00FAdo do modal aqui\r\n </tcloud-ui-modal-body>\r\n\r\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n </tcloud-ui-modal>\r\n\r\n <button type=\"button\" (click)=\"open = !open\">open modal {{ open }}</button>\r\n-->\r\n\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n\r\n<!-- Ex: Confirm Modal -->\r\n<!-- \r\n <tcloud-ui-modal [(open)]=\"open_confirm\" [title]=\"'Aten\u00E7\u00E3o'\" [confirmText]=\"'Aceito'\" [confirm]=\"true\" (toAction)=\"$event\" >\r\n\r\n <tcloud-ui-modal-body>Deseja realmente executar esta a\u00E7\u00E3o?</tcloud-ui-modal-body>\r\n\r\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n </tcloud-ui-modal>\r\n\r\n <button type=\"button\" (click)=\"open_confirm = !open_confirm\">open_confirm modal {{ open_confirm }}</button>\r\n-->", styles: [".tc-background-modal{border:1px solid #ccc;position:fixed;width:100%;left:0;top:0;background-color:#000;z-index:4005;height:100%;opacity:.3}.base-modal{height:100%;overflow:scroll;position:fixed;width:100%;z-index:4005;left:0;top:0}.sub-modal{padding:30px;position:absolute;width:100%}.tc-modal{position:relative;background-color:#fff;padding:12px;border-radius:8px;margin:auto;width:100%}.tc-modal-shadow{box-shadow:2px 2px 10px #0000005e}.area-top-actions{position:absolute;top:2px;right:5px;z-index:1}.area-top-actions button{cursor:pointer;background-color:transparent;border:none;font-size:15px;padding:5px 7px}.area-top-actions button i{font-size:17px;color:#fff;transition:all .25s;opacity:.7}.area-top-actions button i:hover{opacity:1!important}h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.no-use-header i{color:#999!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [
169
- trigger('fade', [
170
- state('visible', style({ opacity: 1 })),
171
- state('hide', style({ opacity: 0, top: '-38%' })),
172
- transition('void => visible', [
173
- style({ opacity: 0, top: '-38%' }),
174
- animate('0.3s ease-out')
175
- ]),
176
- transition('visible => hide', animate('0.3s ease-out'))
177
- ])
178
- ] });
179
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalComponent, decorators: [{
201
+ TCloudUiTabMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
202
+ TCloudUiTabMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabMenuComponent, selector: "tcloud-ui-tab-menu", inputs: { registerInUrl: "registerInUrl", loading: "loading", active: "active" }, outputs: { onChange: "onChange" }, providers: [TabMenuService], ngImport: i0, template: "<div class=\"tc-tab-menu\" [class.loading]=\"loading\" >\r\n <ng-content></ng-content>\r\n</div>", styles: [".tc-tab-menu{width:100%;overflow-x:hidden}.loading{opacity:.7;cursor:progress!important}\n"] });
203
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuComponent, decorators: [{
180
204
  type: Component,
181
- args: [{ selector: 'tcloud-ui-modal', providers: [
182
- TcloudModalService
183
- ], animations: [
184
- trigger('fade', [
185
- state('visible', style({ opacity: 1 })),
186
- state('hide', style({ opacity: 0, top: '-38%' })),
187
- transition('void => visible', [
188
- style({ opacity: 0, top: '-38%' }),
189
- animate('0.3s ease-out')
190
- ]),
191
- transition('visible => hide', animate('0.3s ease-out'))
192
- ])
193
- ], template: "<div class=\"tc-background-modal\" *ngIf=\"open\" >{{ checkIsOpen() }}</div>\r\n\r\n<div class=\"base-modal\" *ngIf=\"open\">\r\n <div class=\"sub-modal\" [@fade]=\"'visible'\">\r\n <div class=\"tc-modal tc-modal-shadow\" [attr.style]=\"'max-width: ' + maxWidth + 'px;'\">\r\n <div class=\"area-top-actions\">\r\n <button type=\"button\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\r\n <i *ngIf=\"!loading\" class=\"fas fa-times\"></i>\r\n <i *ngIf=\"loading\" class=\"fas fa-spinner fa-spin\"></i>\r\n </button>\r\n </div>\r\n\r\n <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n\r\n <ng-content></ng-content>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Ex: Modal -->\r\n<!-- \r\n <tcloud-ui-modal [(open)]=\"open\">\r\n\r\n <tcloud-ui-modal-header title=\"T\u00EDtulo do Modal\" ></tcloud-ui-modal-header>\r\n\r\n <tcloud-ui-modal-body>\r\n Conte\u00FAdo do modal aqui\r\n </tcloud-ui-modal-body>\r\n\r\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n </tcloud-ui-modal>\r\n\r\n <button type=\"button\" (click)=\"open = !open\">open modal {{ open }}</button>\r\n-->\r\n\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n\r\n<!-- Ex: Confirm Modal -->\r\n<!-- \r\n <tcloud-ui-modal [(open)]=\"open_confirm\" [title]=\"'Aten\u00E7\u00E3o'\" [confirmText]=\"'Aceito'\" [confirm]=\"true\" (toAction)=\"$event\" >\r\n\r\n <tcloud-ui-modal-body>Deseja realmente executar esta a\u00E7\u00E3o?</tcloud-ui-modal-body>\r\n\r\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n </tcloud-ui-modal>\r\n\r\n <button type=\"button\" (click)=\"open_confirm = !open_confirm\">open_confirm modal {{ open_confirm }}</button>\r\n-->", styles: [".tc-background-modal{border:1px solid #ccc;position:fixed;width:100%;left:0;top:0;background-color:#000;z-index:4005;height:100%;opacity:.3}.base-modal{height:100%;overflow:scroll;position:fixed;width:100%;z-index:4005;left:0;top:0}.sub-modal{padding:30px;position:absolute;width:100%}.tc-modal{position:relative;background-color:#fff;padding:12px;border-radius:8px;margin:auto;width:100%}.tc-modal-shadow{box-shadow:2px 2px 10px #0000005e}.area-top-actions{position:absolute;top:2px;right:5px;z-index:1}.area-top-actions button{cursor:pointer;background-color:transparent;border:none;font-size:15px;padding:5px 7px}.area-top-actions button i{font-size:17px;color:#fff;transition:all .25s;opacity:.7}.area-top-actions button i:hover{opacity:1!important}h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.no-use-header i{color:#999!important}\n"] }]
194
- }], ctorParameters: function () { return [{ type: TcloudModalService }]; }, propDecorators: { confirm: [{
195
- type: Input
196
- }], confirmText: [{
197
- type: Input
198
- }], autoClose: [{
199
- type: Input
200
- }], title: [{
201
- type: Input
202
- }], maxWidth: [{
203
- type: Input
204
- }], window: [{
205
- type: Input
206
- }], open: [{
205
+ args: [{ selector: 'tcloud-ui-tab-menu', providers: [TabMenuService], template: "<div class=\"tc-tab-menu\" [class.loading]=\"loading\" >\r\n <ng-content></ng-content>\r\n</div>", styles: [".tc-tab-menu{width:100%;overflow-x:hidden}.loading{opacity:.7;cursor:progress!important}\n"] }]
206
+ }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { registerInUrl: [{
207
207
  type: Input
208
208
  }], loading: [{
209
209
  type: Input
210
- }], openChange: [{
211
- type: Output
212
- }], toConfirm: [{
213
- type: Output
214
- }], toCancel: [{
215
- type: Output
216
- }], toAction: [{
210
+ }], active: [{
211
+ type: Input
212
+ }], onChange: [{
217
213
  type: Output
218
214
  }] } });
219
215
 
220
- class TcloudUiModalHeaderComponent {
221
- constructor() {
222
- this.mode = 'info';
216
+ class TCloudUiTabContentComponent {
217
+ constructor(tabMenuService) {
218
+ this.tabMenuService = tabMenuService;
219
+ this.tab = '';
220
+ this.active = false;
223
221
  }
224
222
  ngOnInit() {
223
+ const disabled = this.tabMenuService.getIsDisabled(this.tab);
224
+ const tab = this.tabMenuService.getTabState();
225
+ this.active = (tab === this.tab && !disabled);
226
+ this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
227
+ this.active = (tab === this.tab);
228
+ });
229
+ }
230
+ ngOnDestroy() {
231
+ if (this.subscription) {
232
+ this.subscription.unsubscribe();
233
+ }
225
234
  }
226
235
  }
227
- TcloudUiModalHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
228
- TcloudUiModalHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalHeaderComponent, selector: "tcloud-ui-modal-header", inputs: { mode: "mode", title: "title" }, ngImport: i0, template: "<div class=\"tc-modal-header tc-mode-{{ mode }}\" >\r\n <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n <ng-content></ng-content>\r\n\r\n <hr>\r\n</div>\r\n", styles: ["h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.tc-modal-header{padding:12px;color:#fff;margin:-12px -12px 15px;border-radius:7px 7px 0 0}hr{display:none}.tc-mode-success{background:#62c46d}.tc-mode-info{background:var(--verde)}.tc-mode-danger{background:#f06868}.tc-mode-warning{background:#e8b02e}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
229
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalHeaderComponent, decorators: [{
236
+ TCloudUiTabContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabContentComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
237
+ TCloudUiTabContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabContentComponent, selector: "tcloud-ui-tab-content", inputs: { tab: "tab" }, ngImport: i0, template: "<div class=\"tc-tabmenu-content\" *ngIf=\"active\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".tc-tabmenu-content{margin:20px 0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
238
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabContentComponent, decorators: [{
230
239
  type: Component,
231
- args: [{ selector: 'tcloud-ui-modal-header', template: "<div class=\"tc-modal-header tc-mode-{{ mode }}\" >\r\n <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n <ng-content></ng-content>\r\n\r\n <hr>\r\n</div>\r\n", styles: ["h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.tc-modal-header{padding:12px;color:#fff;margin:-12px -12px 15px;border-radius:7px 7px 0 0}hr{display:none}.tc-mode-success{background:#62c46d}.tc-mode-info{background:var(--verde)}.tc-mode-danger{background:#f06868}.tc-mode-warning{background:#e8b02e}\n"] }]
232
- }], ctorParameters: function () { return []; }, propDecorators: { mode: [{
233
- type: Input
234
- }], title: [{
240
+ args: [{ selector: 'tcloud-ui-tab-content', template: "<div class=\"tc-tabmenu-content\" *ngIf=\"active\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".tc-tabmenu-content{margin:20px 0}\n"] }]
241
+ }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { tab: [{
235
242
  type: Input
236
243
  }] } });
237
244
 
238
- class TcloudUiModalBodyComponent {
239
- constructor() { }
245
+ class TCloudUiTabTitleComponent {
246
+ constructor(tabMenuService) {
247
+ this.tabMenuService = tabMenuService;
248
+ this.tab = '';
249
+ this.active = false;
250
+ this.loading = false;
251
+ this._disabled = false;
252
+ }
253
+ set disabled(disabled) {
254
+ this._disabled = disabled;
255
+ this.tabMenuService.setTabDisabled(this.tab, this._disabled);
256
+ }
257
+ get disabled() { return this._disabled; }
240
258
  ngOnInit() {
259
+ if (!this.disabled) {
260
+ const tab = this.tabMenuService.getTabState();
261
+ if (this.tab !== '') {
262
+ this.active = (tab === this.tab);
263
+ }
264
+ }
265
+ this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
266
+ if (this.tab !== '') {
267
+ this.active = (tab === this.tab);
268
+ }
269
+ });
270
+ this.loading = this.tabMenuService.getTabLoading();
271
+ this.subscription2 = this.tabMenuService.loadingState$.subscribe((loading) => {
272
+ this.loading = loading;
273
+ });
274
+ }
275
+ toTab() {
276
+ if (!this.disabled) {
277
+ if (this.tab && this.tab !== '') {
278
+ this.tabMenuService.setTabState(this.tab);
279
+ }
280
+ }
281
+ }
282
+ ngOnDestroy() {
283
+ if (this.subscription) {
284
+ this.subscription.unsubscribe();
285
+ }
286
+ if (this.subscription2) {
287
+ this.subscription2.unsubscribe();
288
+ }
241
289
  }
242
290
  }
243
- TcloudUiModalBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
244
- TcloudUiModalBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalBodyComponent, selector: "tcloud-ui-modal-body", ngImport: i0, template: "<div class=\"tc-modal-body\">\r\n <ng-content></ng-content>\r\n</div>", styles: [".tc-modal-body{padding:13px}\n"] });
245
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalBodyComponent, decorators: [{
291
+ TCloudUiTabTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabTitleComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
292
+ TCloudUiTabTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabTitleComponent, selector: "tcloud-ui-tab-title", inputs: { tab: "tab", title: "title", active: "active", disabled: "disabled" }, ngImport: i0, template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-title-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-title\" >\r\n <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-title{color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:20px;cursor:pointer;min-width:60px;max-width:200px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;transition:all .25s}.tab-title:hover,.tab-title-active{background:var(--verde);color:#fff}@media (max-width: 1580px){.tab-title{font-size:11px;padding:20px 14px}}@media (max-width: 1440px){.tab-title{font-size:10px;padding:20px 13px}}.loading{cursor:progress!important}button:disabled{opacity:.7;cursor:not-allowed!important}\n"] });
293
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabTitleComponent, decorators: [{
246
294
  type: Component,
247
- args: [{ selector: 'tcloud-ui-modal-body', template: "<div class=\"tc-modal-body\">\r\n <ng-content></ng-content>\r\n</div>", styles: [".tc-modal-body{padding:13px}\n"] }]
248
- }], ctorParameters: function () { return []; } });
295
+ args: [{ selector: 'tcloud-ui-tab-title', template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-title-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-title\" >\r\n <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-title{color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:20px;cursor:pointer;min-width:60px;max-width:200px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;transition:all .25s}.tab-title:hover,.tab-title-active{background:var(--verde);color:#fff}@media (max-width: 1580px){.tab-title{font-size:11px;padding:20px 14px}}@media (max-width: 1440px){.tab-title{font-size:10px;padding:20px 13px}}.loading{cursor:progress!important}button:disabled{opacity:.7;cursor:not-allowed!important}\n"] }]
296
+ }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { tab: [{
297
+ type: Input
298
+ }], title: [{
299
+ type: Input
300
+ }], active: [{
301
+ type: Input
302
+ }], disabled: [{
303
+ type: Input
304
+ }] } });
249
305
 
250
- class TcloudUiModalFooterComponent {
251
- constructor(tcloudModalService) {
252
- this.tcloudModalService = tcloudModalService;
253
- this.btnCloseText = 'Fechar';
254
- this.btnCancelText = 'Cancelar';
255
- this.btnConfirmText = 'Confirmar';
256
- this.txt_value = '';
257
- this.param_confirm = {};
306
+ class TCloudUiTabSubtitleComponent {
307
+ constructor(tabMenuService) {
308
+ this.tabMenuService = tabMenuService;
309
+ this.tab = '';
310
+ this.active = false;
311
+ this._disabled = false;
258
312
  this.loading = false;
259
313
  }
260
- ngOnInit() {
261
- this.txt_value = '';
262
- this.param_confirm = this.tcloudModalService.getParamConfirm();
263
- this.toStateLoading();
264
- }
265
- toClose() {
266
- this.tcloudModalService.toModal('close');
314
+ set disabled(disabled) {
315
+ this._disabled = disabled;
316
+ this.tabMenuService.setTabDisabled(this.tab, this._disabled);
267
317
  }
268
- toConfirm(valid) {
269
- if (typeof valid === 'boolean') {
270
- if (valid && (this.txt_value).toLowerCase() === (this.param_confirm.confirmText).toLowerCase()) {
271
- this.tcloudModalService.toRespConfirm(true);
272
- this.txt_value = '';
318
+ get disabled() { return this._disabled; }
319
+ ngOnInit() {
320
+ if (!this.disabled) {
321
+ const tab = this.tabMenuService.getTabState();
322
+ if (this.tab !== '') {
323
+ this.active = (tab === this.tab);
273
324
  }
274
325
  }
326
+ this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
327
+ if (this.tab !== '') {
328
+ this.active = (tab === this.tab);
329
+ }
330
+ });
331
+ this.loading = this.tabMenuService.getTabLoading();
332
+ this.subscription2 = this.tabMenuService.loadingState$.subscribe((loading) => {
333
+ this.loading = loading;
334
+ });
275
335
  }
276
- toCancel() {
277
- this.tcloudModalService.toRespConfirm(false);
278
- }
279
- toStateLoading() {
280
- this.loading = this.tcloudModalService.getLoading();
281
- this.subscription = this.tcloudModalService.stateLoading$.subscribe((loading) => { this.loading = loading; });
336
+ toTab() {
337
+ if (!this.disabled) {
338
+ if (this.tab && this.tab !== '') {
339
+ this.tabMenuService.setTabState(this.tab);
340
+ }
341
+ }
282
342
  }
283
343
  ngOnDestroy() {
284
344
  if (this.subscription) {
285
345
  this.subscription.unsubscribe();
286
346
  }
347
+ if (this.subscription2) {
348
+ this.subscription2.unsubscribe();
349
+ }
287
350
  }
288
351
  }
289
- TcloudUiModalFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalFooterComponent, deps: [{ token: TcloudModalService }], target: i0.ɵɵFactoryTarget.Component });
290
- TcloudUiModalFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalFooterComponent, selector: "tcloud-ui-modal-footer", inputs: { btnCloseText: "btnCloseText", btnCancelText: "btnCancelText", btnConfirmText: "btnConfirmText" }, viewQueries: [{ propertyName: "_formulario", first: true, predicate: ["_formulario"], descendants: true }], ngImport: i0, template: "<div class=\"tc-modal-footer\">\r\n\r\n <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n <p>Digite a palavra <strong>&quot;{{ param_confirm.confirmText }}&quot;</strong> para confirmar.</p>\r\n \r\n <form #_formulario=\"ngForm\" (ngSubmit)=\"toConfirm(_formulario.valid)\">\r\n <input \r\n [disabled]=\"loading\"\r\n placeholder=\"{{ param_confirm.confirmText }}\"\r\n name=\"txt_value\" \r\n [(ngModel)]=\"txt_value\" \r\n type=\"text\" \r\n class=\"form-control form-confirm\" \r\n required \r\n [class.different-text]=\"(txt_value).length >= (param_confirm.confirmText).length && (txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase()\" >\r\n </form>\r\n\r\n </div>\r\n\r\n <hr>\r\n\r\n <div class=\"actions-footer {{ (loading) ? 'state-loading' : '' }}\">\r\n <!-- {{ param_confirm | json }} -->\r\n <button [disabled]=\"loading\" *ngIf=\"param_confirm && !param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toCancel()\">{{ btnCancelText }}</button>\r\n <button [disabled]=\"(txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase() || loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"ml-3 btn-new-green\" (click)=\"toConfirm(_formulario?.valid)\">{{ btnConfirmText }}</button>\r\n\r\n </div>\r\n</div>\r\n", styles: [".actions-footer{text-align:right}.ng-valid.ng-touched.different-text{border-color:#fb9c23}.form-confirm{max-width:200px}button:disabled{opacity:.7!important;cursor:not-allowed}.input-confirm{padding:5px 14px}.state-loading button{cursor:progress!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
291
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalFooterComponent, decorators: [{
352
+ TCloudUiTabSubtitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabSubtitleComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
353
+ TCloudUiTabSubtitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabSubtitleComponent, selector: "tcloud-ui-tab-subtitle", inputs: { tab: "tab", active: "active", disabled: "disabled" }, ngImport: i0, template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-subtitle-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-subtitle\" >\r\n <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-subtitle{cursor:pointer;color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:0;margin:20px 10px}.tab-subtitle-active{color:var(--verde)}.loading{cursor:progress!important}button:disabled{opacity:.7;cursor:not-allowed!important}\n"] });
354
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabSubtitleComponent, decorators: [{
292
355
  type: Component,
293
- args: [{ selector: 'tcloud-ui-modal-footer', template: "<div class=\"tc-modal-footer\">\r\n\r\n <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n <p>Digite a palavra <strong>&quot;{{ param_confirm.confirmText }}&quot;</strong> para confirmar.</p>\r\n \r\n <form #_formulario=\"ngForm\" (ngSubmit)=\"toConfirm(_formulario.valid)\">\r\n <input \r\n [disabled]=\"loading\"\r\n placeholder=\"{{ param_confirm.confirmText }}\"\r\n name=\"txt_value\" \r\n [(ngModel)]=\"txt_value\" \r\n type=\"text\" \r\n class=\"form-control form-confirm\" \r\n required \r\n [class.different-text]=\"(txt_value).length >= (param_confirm.confirmText).length && (txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase()\" >\r\n </form>\r\n\r\n </div>\r\n\r\n <hr>\r\n\r\n <div class=\"actions-footer {{ (loading) ? 'state-loading' : '' }}\">\r\n <!-- {{ param_confirm | json }} -->\r\n <button [disabled]=\"loading\" *ngIf=\"param_confirm && !param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toCancel()\">{{ btnCancelText }}</button>\r\n <button [disabled]=\"(txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase() || loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"ml-3 btn-new-green\" (click)=\"toConfirm(_formulario?.valid)\">{{ btnConfirmText }}</button>\r\n\r\n </div>\r\n</div>\r\n", styles: [".actions-footer{text-align:right}.ng-valid.ng-touched.different-text{border-color:#fb9c23}.form-confirm{max-width:200px}button:disabled{opacity:.7!important;cursor:not-allowed}.input-confirm{padding:5px 14px}.state-loading button{cursor:progress!important}\n"] }]
294
- }], ctorParameters: function () { return [{ type: TcloudModalService }]; }, propDecorators: { btnCloseText: [{
356
+ args: [{ selector: 'tcloud-ui-tab-subtitle', template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-subtitle-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-subtitle\" >\r\n <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-subtitle{cursor:pointer;color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:0;margin:20px 10px}.tab-subtitle-active{color:var(--verde)}.loading{cursor:progress!important}button:disabled{opacity:.7;cursor:not-allowed!important}\n"] }]
357
+ }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { tab: [{
295
358
  type: Input
296
- }], btnCancelText: [{
359
+ }], active: [{
297
360
  type: Input
298
- }], btnConfirmText: [{
361
+ }], disabled: [{
299
362
  type: Input
300
- }], _formulario: [{
301
- type: ViewChild,
302
- args: ['_formulario']
303
363
  }] } });
304
364
 
305
- class TcloudUiModalModule {
365
+ class TCloudUiTabHeadComponent {
366
+ constructor() {
367
+ this.ID = '';
368
+ this.background = true;
369
+ this.background_color = 'transparent'; // var(--cinza4)
370
+ }
371
+ ngOnInit() {
372
+ if (this.background) {
373
+ this.background_color = 'var(--cinza4)';
374
+ }
375
+ this.ID = this.generateID();
376
+ }
377
+ generateID() {
378
+ return `tc-head-scroll-box-${Math.floor(Math.random() * Math.floor(Math.random() * Date.now()))}`;
379
+ }
380
+ to_scroll(action) {
381
+ this.moveScroll(action, this.width_scroll());
382
+ }
383
+ width_scroll() {
384
+ var ele = document.querySelectorAll(`.${this.ID}`);
385
+ return ele[0].querySelector("button").offsetWidth;
386
+ }
387
+ scrollSuave(old, des, atu, ele) {
388
+ const _this = this;
389
+ var easeOutCubic = (t) => { return (--t) * t * t + 1; };
390
+ atu += 5; // move de 5 em 5 pixel. Aumentando o valor da velocidade
391
+ var ease = easeOutCubic(atu / 100);
392
+ var del = des - old;
393
+ del *= ease;
394
+ del += old;
395
+ ele.scrollTo(del, 0);
396
+ if (atu < 100) {
397
+ window.requestAnimationFrame(() => {
398
+ _this.scrollSuave(old, des, atu, ele);
399
+ });
400
+ }
401
+ }
402
+ moveScroll(action, wid) {
403
+ var ele = document.querySelectorAll(`.${this.ID}`);
404
+ var ccs = ele[0];
405
+ var ccs_s = ccs.scrollLeft;
406
+ this.scrollSuave(ccs_s, action == 'next' ? wid + ccs_s : ccs_s - wid, 0, ccs);
407
+ }
306
408
  }
307
- TcloudUiModalModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
308
- TcloudUiModalModulemod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, declarations: [TcloudUiModalComponent,
309
- TcloudUiModalHeaderComponent,
310
- TcloudUiModalBodyComponent,
311
- TcloudUiModalFooterComponent], imports: [CommonModule,
312
- FormsModule,
313
- ReactiveFormsModule], exports: [TcloudUiModalComponent,
314
- TcloudUiModalHeaderComponent,
315
- TcloudUiModalBodyComponent,
316
- TcloudUiModalFooterComponent] });
317
- TcloudUiModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, imports: [CommonModule,
318
- FormsModule,
319
- ReactiveFormsModule] });
320
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, decorators: [{
409
+ TCloudUiTabHeadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabHeadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
410
+ TCloudUiTabHeadComponentcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabHeadComponent, selector: "tcloud-ui-tab-head", inputs: { background: "background" }, ngImport: i0, template: "\r\n\r\n<table class=\"area-navigation\">\r\n <tr>\r\n <td>\r\n <button (click)=\"to_scroll('prev')\"> <i class=\"fas fa-chevron-left\"></i> </button>\r\n </td>\r\n\r\n <td>\r\n \r\n </td>\r\n\r\n <td>\r\n <button (click)=\"to_scroll('next')\"> <i class=\"fas fa-chevron-right\"></i> </button>\r\n </td>\r\n </tr>\r\n</table>\r\n\r\n<div class=\"tc-menu {{ ID }}\" [attr.style]=\"'background: ' + background_color + ';'\" >\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".area-navigation{display:none;width:100%;line-height:0}.area-navigation td{width:100%;height:0;line-height:0}.area-navigation td:first-child{width:10px!important;text-align:left}.area-navigation td:first-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;right:6px;border:none;background-color:transparent;font-size:15px;height:30px}.area-navigation td:last-child{width:10px!important;text-align:right}.area-navigation td:last-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;left:6px;border:none;background-color:transparent;font-size:15px;height:30px}.tc-menu{display:flex;align-items:center;border-radius:10px;overflow:hidden;margin-bottom:5px;z-index:1;position:relative}@media (max-width: 1440px){.area-navigation{display:block!important;position:relative;top:0;height:2px}.tc-menu{margin-left:15px;margin-right:15px}}\n"] });
411
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabHeadComponent, decorators: [{
412
+ type: Component,
413
+ args: [{ selector: 'tcloud-ui-tab-head', template: "\r\n\r\n<table class=\"area-navigation\">\r\n <tr>\r\n <td>\r\n <button (click)=\"to_scroll('prev')\"> <i class=\"fas fa-chevron-left\"></i> </button>\r\n </td>\r\n\r\n <td>\r\n \r\n </td>\r\n\r\n <td>\r\n <button (click)=\"to_scroll('next')\"> <i class=\"fas fa-chevron-right\"></i> </button>\r\n </td>\r\n </tr>\r\n</table>\r\n\r\n<div class=\"tc-menu {{ ID }}\" [attr.style]=\"'background: ' + background_color + ';'\" >\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".area-navigation{display:none;width:100%;line-height:0}.area-navigation td{width:100%;height:0;line-height:0}.area-navigation td:first-child{width:10px!important;text-align:left}.area-navigation td:first-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;right:6px;border:none;background-color:transparent;font-size:15px;height:30px}.area-navigation td:last-child{width:10px!important;text-align:right}.area-navigation td:last-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;left:6px;border:none;background-color:transparent;font-size:15px;height:30px}.tc-menu{display:flex;align-items:center;border-radius:10px;overflow:hidden;margin-bottom:5px;z-index:1;position:relative}@media (max-width: 1440px){.area-navigation{display:block!important;position:relative;top:0;height:2px}.tc-menu{margin-left:15px;margin-right:15px}}\n"] }]
414
+ }], ctorParameters: function () { return []; }, propDecorators: { background: [{
415
+ type: Input
416
+ }] } });
417
+
418
+ class TCloudUiTabMenuModule {
419
+ }
420
+ TCloudUiTabMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
421
+ TCloudUiTabMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, declarations: [TCloudUiTabMenuComponent,
422
+ TCloudUiTabContentComponent,
423
+ TCloudUiTabTitleComponent,
424
+ TCloudUiTabSubtitleComponent,
425
+ TCloudUiTabHeadComponent], imports: [CommonModule, i1$1.RouterModule], exports: [TCloudUiTabMenuComponent,
426
+ TCloudUiTabContentComponent,
427
+ TCloudUiTabTitleComponent,
428
+ TCloudUiTabSubtitleComponent,
429
+ TCloudUiTabHeadComponent] });
430
+ TCloudUiTabMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, imports: [CommonModule,
431
+ RouterModule.forRoot([])] });
432
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, decorators: [{
321
433
  type: NgModule,
322
434
  args: [{
323
435
  declarations: [
324
- TcloudUiModalComponent,
325
- TcloudUiModalHeaderComponent,
326
- TcloudUiModalBodyComponent,
327
- TcloudUiModalFooterComponent
436
+ TCloudUiTabMenuComponent,
437
+ TCloudUiTabContentComponent,
438
+ TCloudUiTabTitleComponent,
439
+ TCloudUiTabSubtitleComponent,
440
+ TCloudUiTabHeadComponent
328
441
  ],
329
442
  imports: [
330
443
  CommonModule,
331
- FormsModule,
332
- ReactiveFormsModule
444
+ RouterModule.forRoot([]),
333
445
  ],
334
446
  exports: [
335
- TcloudUiModalComponent,
336
- TcloudUiModalHeaderComponent,
337
- TcloudUiModalBodyComponent,
338
- TcloudUiModalFooterComponent
339
- ]
447
+ TCloudUiTabMenuComponent,
448
+ TCloudUiTabContentComponent,
449
+ TCloudUiTabTitleComponent,
450
+ TCloudUiTabSubtitleComponent,
451
+ TCloudUiTabHeadComponent
452
+ ],
340
453
  }]
341
454
  }] });
342
455
 
343
- class TabMenuService {
344
- constructor(_route, _router) {
345
- this._route = _route;
346
- this._router = _router;
347
- this.info_tab = [];
348
- this.tabSubject = new Subject();
349
- this.tabState$ = this.tabSubject.asObservable();
350
- this.loadingSubject = new Subject();
351
- this.loadingState$ = this.loadingSubject.asObservable();
352
- }
353
- setTabLoading(loading) {
354
- this._loading = loading;
355
- this.loadingSubject.next(loading);
356
- }
357
- getTabLoading() {
358
- return this._loading;
359
- }
360
- setTabState(tab, registerInUrl) {
361
- this._tab = tab;
362
- if (registerInUrl) {
363
- this.set_to_param_url(tab);
364
- }
365
- this.tabSubject.next(tab);
366
- }
367
- getTabState() {
368
- return this._tab;
369
- }
370
- setTabDisabled(id, disabled) {
371
- let create = true;
372
- if (this.info_tab && (this.info_tab).length > 0) {
373
- for (let i = 0; i < (this.info_tab).length; i++) {
374
- if (this.info_tab[i].id === id) {
375
- this.info_tab[i].disabled = disabled;
376
- create = false;
377
- break;
378
- }
379
- }
380
- }
381
- if (create) {
382
- (this.info_tab).push({ id: id, disabled: disabled });
383
- }
384
- }
385
- getIsDisabled(id) {
386
- if (this.info_tab && (this.info_tab).length > 0) {
387
- for (let i = 0; i < (this.info_tab).length; i++) {
388
- if (this.info_tab[i].id === id) {
389
- return this.info_tab[i].disabled;
390
- }
391
- }
392
- }
393
- return false;
394
- }
395
- set_to_param_url(tab) {
396
- // changes the route without moving from the current view or
397
- // triggering a navigation event,
398
- this._router.navigate([], {
399
- relativeTo: this._route,
400
- queryParams: {
401
- tab: `${tab}`
402
- },
403
- queryParamsHandling: 'merge',
404
- // preserve the existing query params in the route
405
- skipLocationChange: false
406
- // do not trigger navigation
407
- });
408
- }
409
- }
410
- TabMenuService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TabMenuService, deps: [{ token: i1.ActivatedRoute }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Injectable });
411
- TabMenuService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TabMenuService });
412
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TabMenuService, decorators: [{
413
- type: Injectable
414
- }], ctorParameters: function () { return [{ type: i1.ActivatedRoute }, { type: i1.Router }]; } });
415
-
416
- class TCloudUiTabMenuComponent {
417
- constructor(tabMenuService) {
418
- this.tabMenuService = tabMenuService;
419
- this.registerInUrl = false;
420
- this._loading = false;
421
- this._active = '';
422
- this.onChange = new EventEmitter();
456
+ class TcloudModalService {
457
+ constructor() {
458
+ this.param_confirm = {};
459
+ this._stateClose = new Subject();
460
+ this.stateClose$ = this._stateClose.asObservable();
461
+ this._stateConfirm = new Subject();
462
+ this.stateConfirm$ = this._stateConfirm.asObservable();
463
+ this._stateRespConfirm = new Subject();
464
+ this.stateRespConfirm$ = this._stateRespConfirm.asObservable();
465
+ this._stateLoading = new Subject();
466
+ this.stateLoading$ = this._stateLoading.asObservable();
423
467
  }
424
- set loading(loading) {
425
- this._loading = loading;
426
- this.tabMenuService.setTabLoading(this.loading);
468
+ toModal(action) {
469
+ this._stateClose.next((action === 'open'));
427
470
  }
428
- get loading() { return this._loading; }
429
- set active(active) {
430
- this._active = active;
431
- if (this.active !== '') {
432
- setTimeout(() => {
433
- this.tabMenuService.setTabState(this.active, this.registerInUrl);
434
- });
435
- }
471
+ toRespConfirm(resp) {
472
+ this._stateRespConfirm.next(resp);
436
473
  }
437
- get active() { return this._active; }
438
- ngOnInit() {
439
- const tab = this.tabMenuService.getTabState();
440
- if (tab === this._active) {
441
- this.onChange.emit(tab);
442
- }
443
- this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
444
- this.onChange.emit(tab);
445
- });
474
+ getParamConfirm() {
475
+ return this.param_confirm;
446
476
  }
447
- ngOnDestroy() {
448
- if (this.subscription) {
449
- this.subscription.unsubscribe();
450
- }
477
+ toConfirm(confirm) {
478
+ this.param_confirm = confirm;
479
+ this._stateConfirm.next(confirm);
480
+ }
481
+ getLoading() {
482
+ return this.loading;
483
+ }
484
+ setLoading(loading) {
485
+ this.loading = loading;
486
+ this._stateLoading.next(loading);
451
487
  }
452
488
  }
453
- TCloudUiTabMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
454
- TCloudUiTabMenuComponentcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabMenuComponent, selector: "tcloud-ui-tab-menu", inputs: { registerInUrl: "registerInUrl", loading: "loading", active: "active" }, outputs: { onChange: "onChange" }, providers: [TabMenuService], ngImport: i0, template: "<div class=\"tc-tab-menu\" [class.loading]=\"loading\" >\r\n <ng-content></ng-content>\r\n</div>", styles: [".tc-tab-menu{width:100%;overflow-x:hidden}.loading{opacity:.7;cursor:progress!important}\n"] });
455
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuComponent, decorators: [{
456
- type: Component,
457
- args: [{ selector: 'tcloud-ui-tab-menu', providers: [TabMenuService], template: "<div class=\"tc-tab-menu\" [class.loading]=\"loading\" >\r\n <ng-content></ng-content>\r\n</div>", styles: [".tc-tab-menu{width:100%;overflow-x:hidden}.loading{opacity:.7;cursor:progress!important}\n"] }]
458
- }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { registerInUrl: [{
459
- type: Input
460
- }], loading: [{
461
- type: Input
462
- }], active: [{
463
- type: Input
464
- }], onChange: [{
465
- type: Output
466
- }] } });
489
+ TcloudModalService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
490
+ TcloudModalServiceprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudModalService });
491
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudModalService, decorators: [{
492
+ type: Injectable
493
+ }] });
467
494
 
468
- class TCloudUiTabContentComponent {
469
- constructor(tabMenuService) {
470
- this.tabMenuService = tabMenuService;
471
- this.tab = '';
472
- this.active = false;
495
+ class TcloudUiModalComponent {
496
+ constructor(tcloudModalService) {
497
+ this.tcloudModalService = tcloudModalService;
498
+ this.param_confirm = {};
499
+ /* BEGIN - Parametros para modo confirmacao */
500
+ this._confirm = false;
501
+ this._confirmText = 'Confirmo';
502
+ this.autoClose = true;
503
+ this.maxWidth = 500;
504
+ // psg
505
+ this._open = false;
506
+ this._loading = false;
507
+ this.openChange = new EventEmitter();
508
+ this.toConfirm = new EventEmitter();
509
+ this.toCancel = new EventEmitter();
510
+ this.toAction = new EventEmitter();
473
511
  }
474
- ngOnInit() {
475
- const disabled = this.tabMenuService.getIsDisabled(this.tab);
476
- const tab = this.tabMenuService.getTabState();
477
- this.active = (tab === this.tab && !disabled);
478
- this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
479
- this.active = (tab === this.tab);
480
- });
512
+ set confirm(v) {
513
+ this._confirm = v;
514
+ this.param_confirm.confirm = this._confirm;
515
+ this.param_confirm.confirmText = this._confirmText;
481
516
  }
482
- ngOnDestroy() {
483
- if (this.subscription) {
484
- this.subscription.unsubscribe();
517
+ set confirmText(v) {
518
+ this._confirmText = v;
519
+ this.param_confirm.confirmText = this._confirmText;
520
+ this.param_confirm.confirm = this._confirm;
521
+ }
522
+ set window(size) {
523
+ switch (size) {
524
+ case 'small':
525
+ this.maxWidth = 300;
526
+ break;
527
+ case 'medium':
528
+ this.maxWidth = 500;
529
+ break;
530
+ case 'large':
531
+ this.maxWidth = 900;
532
+ break;
533
+ case 'big':
534
+ this.maxWidth = 1100;
535
+ break;
536
+ case 'full':
537
+ this.maxWidth = 1400;
538
+ break;
485
539
  }
486
540
  }
487
- }
488
- TCloudUiTabContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabContentComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
489
- TCloudUiTabContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabContentComponent, selector: "tcloud-ui-tab-content", inputs: { tab: "tab" }, ngImport: i0, template: "<div class=\"tc-tabmenu-content\" *ngIf=\"active\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".tc-tabmenu-content{margin:20px 0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
490
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabContentComponent, decorators: [{
491
- type: Component,
492
- args: [{ selector: 'tcloud-ui-tab-content', template: "<div class=\"tc-tabmenu-content\" *ngIf=\"active\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".tc-tabmenu-content{margin:20px 0}\n"] }]
493
- }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { tab: [{
494
- type: Input
495
- }] } });
496
-
497
- class TCloudUiTabTitleComponent {
498
- constructor(tabMenuService) {
499
- this.tabMenuService = tabMenuService;
500
- this.tab = '';
501
- this.active = false;
502
- this.loading = false;
503
- this._disabled = false;
541
+ set open(open) {
542
+ this._open = open;
543
+ this.fixed_body((open) ? 'on' : 'off');
504
544
  }
505
- set disabled(disabled) {
506
- this._disabled = disabled;
507
- this.tabMenuService.setTabDisabled(this.tab, this._disabled);
545
+ get open() { return this._open; }
546
+ set loading(loading) {
547
+ this._loading = loading;
548
+ this.tcloudModalService.setLoading(loading);
508
549
  }
509
- get disabled() { return this._disabled; }
550
+ get loading() { return this._loading; }
510
551
  ngOnInit() {
511
- if (!this.disabled) {
512
- const tab = this.tabMenuService.getTabState();
513
- if (this.tab !== '') {
514
- this.active = (tab === this.tab);
552
+ this.subscription = this.tcloudModalService.stateClose$.subscribe((open) => {
553
+ if (open) {
554
+ /* OPEN */
515
555
  }
516
- }
517
- this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
518
- if (this.tab !== '') {
519
- this.active = (tab === this.tab);
556
+ if (!open) {
557
+ /* CLOSE */
558
+ this.toClose();
520
559
  }
521
560
  });
522
- this.loading = this.tabMenuService.getTabLoading();
523
- this.subscription2 = this.tabMenuService.loadingState$.subscribe((loading) => {
524
- this.loading = loading;
561
+ this.subscriptionI = this.tcloudModalService.stateRespConfirm$.subscribe((resp) => {
562
+ if (resp) {
563
+ /* CONFIRMADO */
564
+ this.toConfirm.emit(resp);
565
+ this.toClose('confirmed');
566
+ }
567
+ if (!resp) {
568
+ /* CANCELADO */
569
+ this.toCancel.emit(resp);
570
+ this.toClose('cancel');
571
+ }
525
572
  });
573
+ this.tcloudModalService.toConfirm(this.param_confirm);
526
574
  }
527
- toTab() {
528
- if (!this.disabled) {
529
- if (this.tab && this.tab !== '') {
530
- this.tabMenuService.setTabState(this.tab);
575
+ toClose(action) {
576
+ if (this.autoClose) {
577
+ this.open = false;
578
+ this.openChange.emit(false);
579
+ }
580
+ action = (action) ? action : 'close';
581
+ this.toAction.emit(action);
582
+ this.fixed_body('off');
583
+ }
584
+ checkIsOpen() {
585
+ if (this.open) {
586
+ this.fixed_body('on');
587
+ }
588
+ else {
589
+ this.fixed_body('off');
590
+ }
591
+ }
592
+ fixed_body(fixed) {
593
+ let body = document.getElementsByTagName("BODY")[0];
594
+ if (body && body.style) {
595
+ if (fixed === 'on') {
596
+ body.style.overflowY = "hidden";
597
+ }
598
+ if (fixed === 'off') {
599
+ body.style.removeProperty('overflow-y');
531
600
  }
532
601
  }
533
602
  }
@@ -535,251 +604,294 @@ class TCloudUiTabTitleComponent {
535
604
  if (this.subscription) {
536
605
  this.subscription.unsubscribe();
537
606
  }
538
- if (this.subscription2) {
539
- this.subscription2.unsubscribe();
540
- }
541
607
  }
542
608
  }
543
- TCloudUiTabTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabTitleComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
544
- TCloudUiTabTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabTitleComponent, selector: "tcloud-ui-tab-title", inputs: { tab: "tab", title: "title", active: "active", disabled: "disabled" }, ngImport: i0, template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-title-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-title\" >\r\n <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-title{color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:20px;cursor:pointer;min-width:60px;max-width:200px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;transition:all .25s}.tab-title:hover,.tab-title-active{background:var(--verde);color:#fff}@media (max-width: 1580px){.tab-title{font-size:11px;padding:20px 14px}}@media (max-width: 1440px){.tab-title{font-size:10px;padding:20px 13px}}.loading{cursor:progress!important}\n"] });
545
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabTitleComponent, decorators: [{
609
+ TcloudUiModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalComponent, deps: [{ token: TcloudModalService }], target: i0.ɵɵFactoryTarget.Component });
610
+ TcloudUiModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalComponent, selector: "tcloud-ui-modal", inputs: { confirm: "confirm", confirmText: "confirmText", autoClose: "autoClose", title: "title", maxWidth: "maxWidth", window: "window", open: "open", loading: "loading" }, outputs: { openChange: "openChange", toConfirm: "toConfirm", toCancel: "toCancel", toAction: "toAction" }, providers: [
611
+ TcloudModalService
612
+ ], ngImport: i0, template: "<div class=\"tc-background-modal\" *ngIf=\"open\" >{{ checkIsOpen() }}</div>\r\n\r\n<div class=\"base-modal\" *ngIf=\"open\">\r\n <div class=\"sub-modal\" [@fade]=\"'visible'\">\r\n <div class=\"tc-modal tc-modal-shadow\" [attr.style]=\"'max-width: ' + maxWidth + 'px;'\">\r\n <div class=\"area-top-actions\">\r\n <button type=\"button\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\r\n <i *ngIf=\"!loading\" class=\"fas fa-times\"></i>\r\n <i *ngIf=\"loading\" class=\"fas fa-spinner fa-spin\"></i>\r\n </button>\r\n </div>\r\n\r\n <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n\r\n <ng-content></ng-content>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Ex: Modal -->\r\n<!-- \r\n <tcloud-ui-modal [(open)]=\"open\">\r\n\r\n <tcloud-ui-modal-header title=\"T\u00EDtulo do Modal\" ></tcloud-ui-modal-header>\r\n\r\n <tcloud-ui-modal-body>\r\n Conte\u00FAdo do modal aqui\r\n </tcloud-ui-modal-body>\r\n\r\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n </tcloud-ui-modal>\r\n\r\n <button type=\"button\" (click)=\"open = !open\">open modal {{ open }}</button>\r\n-->\r\n\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n\r\n<!-- Ex: Confirm Modal -->\r\n<!-- \r\n <tcloud-ui-modal [(open)]=\"open_confirm\" [title]=\"'Aten\u00E7\u00E3o'\" [confirmText]=\"'Aceito'\" [confirm]=\"true\" (toAction)=\"$event\" >\r\n\r\n <tcloud-ui-modal-body>Deseja realmente executar esta a\u00E7\u00E3o?</tcloud-ui-modal-body>\r\n\r\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n </tcloud-ui-modal>\r\n\r\n <button type=\"button\" (click)=\"open_confirm = !open_confirm\">open_confirm modal {{ open_confirm }}</button>\r\n-->", styles: [".tc-background-modal{border:1px solid #ccc;position:fixed;width:100%;left:0;top:0;background-color:#000;z-index:4005;height:100%;opacity:.3}.base-modal{height:100%;overflow:scroll;position:fixed;width:100%;z-index:4005;left:0;top:0}.sub-modal{padding:30px;position:absolute;width:100%}.tc-modal{position:relative;background-color:#fff;padding:12px;border-radius:8px;margin:auto;width:100%}.tc-modal-shadow{box-shadow:2px 2px 10px #0000005e}.area-top-actions{position:absolute;top:2px;right:5px;z-index:1}.area-top-actions button{cursor:pointer;background-color:transparent;border:none;font-size:15px;padding:5px 7px}.area-top-actions button i{font-size:17px;color:#fff;transition:all .25s;opacity:.7}.area-top-actions button i:hover{opacity:1!important}h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.no-use-header i{color:#999!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [
613
+ trigger('fade', [
614
+ state('visible', style({ opacity: 1 })),
615
+ state('hide', style({ opacity: 0, top: '-38%' })),
616
+ transition('void => visible', [
617
+ style({ opacity: 0, top: '-38%' }),
618
+ animate('0.3s ease-out')
619
+ ]),
620
+ transition('visible => hide', animate('0.3s ease-out'))
621
+ ])
622
+ ] });
623
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalComponent, decorators: [{
546
624
  type: Component,
547
- args: [{ selector: 'tcloud-ui-tab-title', template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-title-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-title\" >\r\n <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-title{color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:20px;cursor:pointer;min-width:60px;max-width:200px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;transition:all .25s}.tab-title:hover,.tab-title-active{background:var(--verde);color:#fff}@media (max-width: 1580px){.tab-title{font-size:11px;padding:20px 14px}}@media (max-width: 1440px){.tab-title{font-size:10px;padding:20px 13px}}.loading{cursor:progress!important}\n"] }]
548
- }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { tab: [{
625
+ args: [{ selector: 'tcloud-ui-modal', providers: [
626
+ TcloudModalService
627
+ ], animations: [
628
+ trigger('fade', [
629
+ state('visible', style({ opacity: 1 })),
630
+ state('hide', style({ opacity: 0, top: '-38%' })),
631
+ transition('void => visible', [
632
+ style({ opacity: 0, top: '-38%' }),
633
+ animate('0.3s ease-out')
634
+ ]),
635
+ transition('visible => hide', animate('0.3s ease-out'))
636
+ ])
637
+ ], template: "<div class=\"tc-background-modal\" *ngIf=\"open\" >{{ checkIsOpen() }}</div>\r\n\r\n<div class=\"base-modal\" *ngIf=\"open\">\r\n <div class=\"sub-modal\" [@fade]=\"'visible'\">\r\n <div class=\"tc-modal tc-modal-shadow\" [attr.style]=\"'max-width: ' + maxWidth + 'px;'\">\r\n <div class=\"area-top-actions\">\r\n <button type=\"button\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\r\n <i *ngIf=\"!loading\" class=\"fas fa-times\"></i>\r\n <i *ngIf=\"loading\" class=\"fas fa-spinner fa-spin\"></i>\r\n </button>\r\n </div>\r\n\r\n <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n\r\n <ng-content></ng-content>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Ex: Modal -->\r\n<!-- \r\n <tcloud-ui-modal [(open)]=\"open\">\r\n\r\n <tcloud-ui-modal-header title=\"T\u00EDtulo do Modal\" ></tcloud-ui-modal-header>\r\n\r\n <tcloud-ui-modal-body>\r\n Conte\u00FAdo do modal aqui\r\n </tcloud-ui-modal-body>\r\n\r\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n </tcloud-ui-modal>\r\n\r\n <button type=\"button\" (click)=\"open = !open\">open modal {{ open }}</button>\r\n-->\r\n\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n\r\n<!-- Ex: Confirm Modal -->\r\n<!-- \r\n <tcloud-ui-modal [(open)]=\"open_confirm\" [title]=\"'Aten\u00E7\u00E3o'\" [confirmText]=\"'Aceito'\" [confirm]=\"true\" (toAction)=\"$event\" >\r\n\r\n <tcloud-ui-modal-body>Deseja realmente executar esta a\u00E7\u00E3o?</tcloud-ui-modal-body>\r\n\r\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n </tcloud-ui-modal>\r\n\r\n <button type=\"button\" (click)=\"open_confirm = !open_confirm\">open_confirm modal {{ open_confirm }}</button>\r\n-->", styles: [".tc-background-modal{border:1px solid #ccc;position:fixed;width:100%;left:0;top:0;background-color:#000;z-index:4005;height:100%;opacity:.3}.base-modal{height:100%;overflow:scroll;position:fixed;width:100%;z-index:4005;left:0;top:0}.sub-modal{padding:30px;position:absolute;width:100%}.tc-modal{position:relative;background-color:#fff;padding:12px;border-radius:8px;margin:auto;width:100%}.tc-modal-shadow{box-shadow:2px 2px 10px #0000005e}.area-top-actions{position:absolute;top:2px;right:5px;z-index:1}.area-top-actions button{cursor:pointer;background-color:transparent;border:none;font-size:15px;padding:5px 7px}.area-top-actions button i{font-size:17px;color:#fff;transition:all .25s;opacity:.7}.area-top-actions button i:hover{opacity:1!important}h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.no-use-header i{color:#999!important}\n"] }]
638
+ }], ctorParameters: function () { return [{ type: TcloudModalService }]; }, propDecorators: { confirm: [{
549
639
  type: Input
550
- }], title: [{
640
+ }], confirmText: [{
551
641
  type: Input
552
- }], active: [{
642
+ }], autoClose: [{
553
643
  type: Input
554
- }], disabled: [{
644
+ }], title: [{
555
645
  type: Input
556
- }] } });
557
-
558
- class TCloudUiTabSubtitleComponent {
559
- constructor(tabMenuService) {
560
- this.tabMenuService = tabMenuService;
561
- this.tab = '';
562
- this.active = false;
563
- this._disabled = false;
564
- this.loading = false;
565
- }
566
- set disabled(disabled) {
567
- this._disabled = disabled;
568
- this.tabMenuService.setTabDisabled(this.tab, this._disabled);
569
- }
570
- get disabled() { return this._disabled; }
571
- ngOnInit() {
572
- if (!this.disabled) {
573
- const tab = this.tabMenuService.getTabState();
574
- if (this.tab !== '') {
575
- this.active = (tab === this.tab);
576
- }
577
- }
578
- this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
579
- if (this.tab !== '') {
580
- this.active = (tab === this.tab);
581
- }
582
- });
583
- this.loading = this.tabMenuService.getTabLoading();
584
- this.subscription2 = this.tabMenuService.loadingState$.subscribe((loading) => {
585
- this.loading = loading;
586
- });
587
- }
588
- toTab() {
589
- if (!this.disabled) {
590
- if (this.tab && this.tab !== '') {
591
- this.tabMenuService.setTabState(this.tab);
592
- }
593
- }
646
+ }], maxWidth: [{
647
+ type: Input
648
+ }], window: [{
649
+ type: Input
650
+ }], open: [{
651
+ type: Input
652
+ }], loading: [{
653
+ type: Input
654
+ }], openChange: [{
655
+ type: Output
656
+ }], toConfirm: [{
657
+ type: Output
658
+ }], toCancel: [{
659
+ type: Output
660
+ }], toAction: [{
661
+ type: Output
662
+ }] } });
663
+
664
+ class TcloudUiModalHeaderComponent {
665
+ constructor() {
666
+ this.mode = 'info';
594
667
  }
595
- ngOnDestroy() {
596
- if (this.subscription) {
597
- this.subscription.unsubscribe();
598
- }
599
- if (this.subscription2) {
600
- this.subscription2.unsubscribe();
601
- }
668
+ ngOnInit() {
602
669
  }
603
670
  }
604
- TCloudUiTabSubtitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabSubtitleComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
605
- TCloudUiTabSubtitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabSubtitleComponent, selector: "tcloud-ui-tab-subtitle", inputs: { tab: "tab", active: "active", disabled: "disabled" }, ngImport: i0, template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-subtitle-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-subtitle\" >\r\n <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-subtitle{cursor:pointer;color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:0;margin:20px 10px}.tab-subtitle-active{color:var(--verde)}.loading{cursor:progress!important}\n"] });
606
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabSubtitleComponent, decorators: [{
671
+ TcloudUiModalHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
672
+ TcloudUiModalHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalHeaderComponent, selector: "tcloud-ui-modal-header", inputs: { mode: "mode", title: "title" }, ngImport: i0, template: "<div class=\"tc-modal-header tc-mode-{{ mode }}\" >\r\n <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n <ng-content></ng-content>\r\n\r\n <hr>\r\n</div>\r\n", styles: ["h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.tc-modal-header{padding:12px;color:#fff;margin:-12px -12px 15px;border-radius:7px 7px 0 0}hr{display:none}.tc-mode-success{background:#62c46d}.tc-mode-info{background:var(--verde)}.tc-mode-danger{background:#f06868}.tc-mode-warning{background:#e8b02e}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
673
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalHeaderComponent, decorators: [{
607
674
  type: Component,
608
- args: [{ selector: 'tcloud-ui-tab-subtitle', template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-subtitle-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-subtitle\" >\r\n <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-subtitle{cursor:pointer;color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:0;margin:20px 10px}.tab-subtitle-active{color:var(--verde)}.loading{cursor:progress!important}\n"] }]
609
- }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { tab: [{
610
- type: Input
611
- }], active: [{
675
+ args: [{ selector: 'tcloud-ui-modal-header', template: "<div class=\"tc-modal-header tc-mode-{{ mode }}\" >\r\n <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n <ng-content></ng-content>\r\n\r\n <hr>\r\n</div>\r\n", styles: ["h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.tc-modal-header{padding:12px;color:#fff;margin:-12px -12px 15px;border-radius:7px 7px 0 0}hr{display:none}.tc-mode-success{background:#62c46d}.tc-mode-info{background:var(--verde)}.tc-mode-danger{background:#f06868}.tc-mode-warning{background:#e8b02e}\n"] }]
676
+ }], ctorParameters: function () { return []; }, propDecorators: { mode: [{
612
677
  type: Input
613
- }], disabled: [{
678
+ }], title: [{
614
679
  type: Input
615
680
  }] } });
616
681
 
617
- class TCloudUiTabHeadComponent {
618
- constructor() {
619
- this.ID = '';
620
- this.background = true;
621
- this.background_color = 'transparent'; // var(--cinza4)
622
- }
682
+ class TcloudUiModalBodyComponent {
683
+ constructor() { }
623
684
  ngOnInit() {
624
- if (this.background) {
625
- this.background_color = 'var(--cinza4)';
626
- }
627
- this.ID = this.generateID();
628
685
  }
629
- generateID() {
630
- return `tc-head-scroll-box-${Math.floor(Math.random() * Math.floor(Math.random() * Date.now()))}`;
686
+ }
687
+ TcloudUiModalBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
688
+ TcloudUiModalBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalBodyComponent, selector: "tcloud-ui-modal-body", ngImport: i0, template: "<div class=\"tc-modal-body\">\r\n <ng-content></ng-content>\r\n</div>", styles: [".tc-modal-body{padding:13px}\n"] });
689
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalBodyComponent, decorators: [{
690
+ type: Component,
691
+ args: [{ selector: 'tcloud-ui-modal-body', template: "<div class=\"tc-modal-body\">\r\n <ng-content></ng-content>\r\n</div>", styles: [".tc-modal-body{padding:13px}\n"] }]
692
+ }], ctorParameters: function () { return []; } });
693
+
694
+ class TcloudUiModalFooterComponent {
695
+ constructor(tcloudModalService) {
696
+ this.tcloudModalService = tcloudModalService;
697
+ this.btnCloseText = 'Fechar';
698
+ this.btnCancelText = 'Cancelar';
699
+ this.btnConfirmText = 'Confirmar';
700
+ this.txt_value = '';
701
+ this.param_confirm = {};
702
+ this.loading = false;
631
703
  }
632
- to_scroll(action) {
633
- this.moveScroll(action, this.width_scroll());
704
+ ngOnInit() {
705
+ this.txt_value = '';
706
+ this.param_confirm = this.tcloudModalService.getParamConfirm();
707
+ this.toStateLoading();
634
708
  }
635
- width_scroll() {
636
- var ele = document.querySelectorAll(`.${this.ID}`);
637
- return ele[0].querySelector("button").offsetWidth;
709
+ toClose() {
710
+ this.tcloudModalService.toModal('close');
638
711
  }
639
- scrollSuave(old, des, atu, ele) {
640
- const _this = this;
641
- var easeOutCubic = (t) => { return (--t) * t * t + 1; };
642
- atu += 5; // move de 5 em 5 pixel. Aumentando o valor da velocidade
643
- var ease = easeOutCubic(atu / 100);
644
- var del = des - old;
645
- del *= ease;
646
- del += old;
647
- ele.scrollTo(del, 0);
648
- if (atu < 100) {
649
- window.requestAnimationFrame(() => {
650
- _this.scrollSuave(old, des, atu, ele);
651
- });
712
+ toConfirm(valid) {
713
+ if (typeof valid === 'boolean') {
714
+ if (valid && (this.txt_value).toLowerCase() === (this.param_confirm.confirmText).toLowerCase()) {
715
+ this.tcloudModalService.toRespConfirm(true);
716
+ this.txt_value = '';
717
+ }
652
718
  }
653
719
  }
654
- moveScroll(action, wid) {
655
- var ele = document.querySelectorAll(`.${this.ID}`);
656
- var ccs = ele[0];
657
- var ccs_s = ccs.scrollLeft;
658
- this.scrollSuave(ccs_s, action == 'next' ? wid + ccs_s : ccs_s - wid, 0, ccs);
720
+ toCancel() {
721
+ this.tcloudModalService.toRespConfirm(false);
722
+ }
723
+ toStateLoading() {
724
+ this.loading = this.tcloudModalService.getLoading();
725
+ this.subscription = this.tcloudModalService.stateLoading$.subscribe((loading) => { this.loading = loading; });
726
+ }
727
+ ngOnDestroy() {
728
+ if (this.subscription) {
729
+ this.subscription.unsubscribe();
730
+ }
659
731
  }
660
732
  }
661
- TCloudUiTabHeadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabHeadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
662
- TCloudUiTabHeadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabHeadComponent, selector: "tcloud-ui-tab-head", inputs: { background: "background" }, ngImport: i0, template: "\r\n\r\n<table class=\"area-navigation\">\r\n <tr>\r\n <td>\r\n <button (click)=\"to_scroll('prev')\"> <i class=\"fas fa-chevron-left\"></i> </button>\r\n </td>\r\n\r\n <td>\r\n \r\n </td>\r\n\r\n <td>\r\n <button (click)=\"to_scroll('next')\"> <i class=\"fas fa-chevron-right\"></i> </button>\r\n </td>\r\n </tr>\r\n</table>\r\n\r\n<div class=\"tc-menu {{ ID }}\" [attr.style]=\"'background: ' + background_color + ';'\" >\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".area-navigation{display:none;width:100%;line-height:0}.area-navigation td{width:100%;height:0;line-height:0}.area-navigation td:first-child{width:10px!important;text-align:left}.area-navigation td:first-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;right:6px;border:none;background-color:transparent;font-size:15px;height:30px}.area-navigation td:last-child{width:10px!important;text-align:right}.area-navigation td:last-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;left:6px;border:none;background-color:transparent;font-size:15px;height:30px}.tc-menu{display:flex;align-items:center;border-radius:10px;overflow:hidden;margin-bottom:5px;z-index:1;position:relative}@media (max-width: 1440px){.area-navigation{display:block!important;position:relative;top:0;height:2px}.tc-menu{margin-left:15px;margin-right:15px}}\n"] });
663
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabHeadComponent, decorators: [{
733
+ TcloudUiModalFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalFooterComponent, deps: [{ token: TcloudModalService }], target: i0.ɵɵFactoryTarget.Component });
734
+ TcloudUiModalFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalFooterComponent, selector: "tcloud-ui-modal-footer", inputs: { btnCloseText: "btnCloseText", btnCancelText: "btnCancelText", btnConfirmText: "btnConfirmText" }, viewQueries: [{ propertyName: "_formulario", first: true, predicate: ["_formulario"], descendants: true }], ngImport: i0, template: "<div class=\"tc-modal-footer\">\r\n\r\n <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n <p>Digite a palavra <strong>&quot;{{ param_confirm.confirmText }}&quot;</strong> para confirmar.</p>\r\n \r\n <form #_formulario=\"ngForm\" (ngSubmit)=\"toConfirm(_formulario.valid)\">\r\n <input \r\n [disabled]=\"loading\"\r\n placeholder=\"{{ param_confirm.confirmText }}\"\r\n name=\"txt_value\" \r\n [(ngModel)]=\"txt_value\" \r\n type=\"text\" \r\n class=\"form-control form-confirm\" \r\n required \r\n [class.different-text]=\"(txt_value).length >= (param_confirm.confirmText).length && (txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase()\" >\r\n </form>\r\n\r\n </div>\r\n\r\n <hr>\r\n\r\n <div class=\"actions-footer {{ (loading) ? 'state-loading' : '' }}\">\r\n <!-- {{ param_confirm | json }} -->\r\n <button [disabled]=\"loading\" *ngIf=\"param_confirm && !param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toCancel()\">{{ btnCancelText }}</button>\r\n <button [disabled]=\"(txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase() || loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"ml-3 btn-new-green\" (click)=\"toConfirm(_formulario?.valid)\">{{ btnConfirmText }}</button>\r\n\r\n </div>\r\n</div>\r\n", styles: [".actions-footer{text-align:right}.ng-valid.ng-touched.different-text{border-color:#fb9c23}.form-confirm{max-width:200px}button:disabled{opacity:.7!important;cursor:not-allowed}.input-confirm{padding:5px 14px}.state-loading button{cursor:progress!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
735
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalFooterComponent, decorators: [{
664
736
  type: Component,
665
- args: [{ selector: 'tcloud-ui-tab-head', template: "\r\n\r\n<table class=\"area-navigation\">\r\n <tr>\r\n <td>\r\n <button (click)=\"to_scroll('prev')\"> <i class=\"fas fa-chevron-left\"></i> </button>\r\n </td>\r\n\r\n <td>\r\n \r\n </td>\r\n\r\n <td>\r\n <button (click)=\"to_scroll('next')\"> <i class=\"fas fa-chevron-right\"></i> </button>\r\n </td>\r\n </tr>\r\n</table>\r\n\r\n<div class=\"tc-menu {{ ID }}\" [attr.style]=\"'background: ' + background_color + ';'\" >\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".area-navigation{display:none;width:100%;line-height:0}.area-navigation td{width:100%;height:0;line-height:0}.area-navigation td:first-child{width:10px!important;text-align:left}.area-navigation td:first-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;right:6px;border:none;background-color:transparent;font-size:15px;height:30px}.area-navigation td:last-child{width:10px!important;text-align:right}.area-navigation td:last-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;left:6px;border:none;background-color:transparent;font-size:15px;height:30px}.tc-menu{display:flex;align-items:center;border-radius:10px;overflow:hidden;margin-bottom:5px;z-index:1;position:relative}@media (max-width: 1440px){.area-navigation{display:block!important;position:relative;top:0;height:2px}.tc-menu{margin-left:15px;margin-right:15px}}\n"] }]
666
- }], ctorParameters: function () { return []; }, propDecorators: { background: [{
737
+ args: [{ selector: 'tcloud-ui-modal-footer', template: "<div class=\"tc-modal-footer\">\r\n\r\n <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n <p>Digite a palavra <strong>&quot;{{ param_confirm.confirmText }}&quot;</strong> para confirmar.</p>\r\n \r\n <form #_formulario=\"ngForm\" (ngSubmit)=\"toConfirm(_formulario.valid)\">\r\n <input \r\n [disabled]=\"loading\"\r\n placeholder=\"{{ param_confirm.confirmText }}\"\r\n name=\"txt_value\" \r\n [(ngModel)]=\"txt_value\" \r\n type=\"text\" \r\n class=\"form-control form-confirm\" \r\n required \r\n [class.different-text]=\"(txt_value).length >= (param_confirm.confirmText).length && (txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase()\" >\r\n </form>\r\n\r\n </div>\r\n\r\n <hr>\r\n\r\n <div class=\"actions-footer {{ (loading) ? 'state-loading' : '' }}\">\r\n <!-- {{ param_confirm | json }} -->\r\n <button [disabled]=\"loading\" *ngIf=\"param_confirm && !param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toCancel()\">{{ btnCancelText }}</button>\r\n <button [disabled]=\"(txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase() || loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"ml-3 btn-new-green\" (click)=\"toConfirm(_formulario?.valid)\">{{ btnConfirmText }}</button>\r\n\r\n </div>\r\n</div>\r\n", styles: [".actions-footer{text-align:right}.ng-valid.ng-touched.different-text{border-color:#fb9c23}.form-confirm{max-width:200px}button:disabled{opacity:.7!important;cursor:not-allowed}.input-confirm{padding:5px 14px}.state-loading button{cursor:progress!important}\n"] }]
738
+ }], ctorParameters: function () { return [{ type: TcloudModalService }]; }, propDecorators: { btnCloseText: [{
739
+ type: Input
740
+ }], btnCancelText: [{
667
741
  type: Input
742
+ }], btnConfirmText: [{
743
+ type: Input
744
+ }], _formulario: [{
745
+ type: ViewChild,
746
+ args: ['_formulario']
668
747
  }] } });
669
748
 
670
- class TCloudUiTabMenuModule {
749
+ class TcloudUiModalModule {
671
750
  }
672
- TCloudUiTabMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
673
- TCloudUiTabMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, declarations: [TCloudUiTabMenuComponent,
674
- TCloudUiTabContentComponent,
675
- TCloudUiTabTitleComponent,
676
- TCloudUiTabSubtitleComponent,
677
- TCloudUiTabHeadComponent], imports: [CommonModule, i1.RouterModule], exports: [TCloudUiTabMenuComponent,
678
- TCloudUiTabContentComponent,
679
- TCloudUiTabTitleComponent,
680
- TCloudUiTabSubtitleComponent,
681
- TCloudUiTabHeadComponent] });
682
- TCloudUiTabMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, imports: [CommonModule,
683
- RouterModule.forRoot([])] });
684
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, decorators: [{
751
+ TcloudUiModalModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
752
+ TcloudUiModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, declarations: [TcloudUiModalComponent,
753
+ TcloudUiModalHeaderComponent,
754
+ TcloudUiModalBodyComponent,
755
+ TcloudUiModalFooterComponent], imports: [CommonModule,
756
+ FormsModule,
757
+ ReactiveFormsModule], exports: [TcloudUiModalComponent,
758
+ TcloudUiModalHeaderComponent,
759
+ TcloudUiModalBodyComponent,
760
+ TcloudUiModalFooterComponent] });
761
+ TcloudUiModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, imports: [CommonModule,
762
+ FormsModule,
763
+ ReactiveFormsModule] });
764
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, decorators: [{
685
765
  type: NgModule,
686
766
  args: [{
687
767
  declarations: [
688
- TCloudUiTabMenuComponent,
689
- TCloudUiTabContentComponent,
690
- TCloudUiTabTitleComponent,
691
- TCloudUiTabSubtitleComponent,
692
- TCloudUiTabHeadComponent
768
+ TcloudUiModalComponent,
769
+ TcloudUiModalHeaderComponent,
770
+ TcloudUiModalBodyComponent,
771
+ TcloudUiModalFooterComponent
693
772
  ],
694
773
  imports: [
695
774
  CommonModule,
696
- RouterModule.forRoot([]),
775
+ FormsModule,
776
+ ReactiveFormsModule
697
777
  ],
698
778
  exports: [
699
- TCloudUiTabMenuComponent,
700
- TCloudUiTabContentComponent,
701
- TCloudUiTabTitleComponent,
702
- TCloudUiTabSubtitleComponent,
703
- TCloudUiTabHeadComponent
704
- ],
779
+ TcloudUiModalComponent,
780
+ TcloudUiModalHeaderComponent,
781
+ TcloudUiModalBodyComponent,
782
+ TcloudUiModalFooterComponent
783
+ ]
705
784
  }]
706
785
  }] });
707
786
 
708
- class TCloudUiLinhaLogoComponent {
787
+ class Step {
709
788
  constructor() {
710
- this.product = '';
711
- this.logo_name = '';
712
- this.product_name = '';
713
- this.alt_product_name = '';
714
- this.font_size = '';
715
- }
716
- ngOnInit() {
717
- this.logo_name = this.getLogoName();
718
- this.product_name = this.getProductName();
719
- this.alt_product_name = (this.product_name).toUpperCase();
720
- this.font_size = this.getWidthFontSize();
789
+ this.status = '';
790
+ this.index = 0;
791
+ this.class = '';
792
+ this.second_class = '';
721
793
  }
722
- getProductName() {
723
- if (this.product !== '') {
724
- let name = this.product;
725
- name = (name).replace('_', ' ');
726
- name = (name).toLowerCase();
727
- return name;
728
- }
729
- return '';
794
+ }
795
+ class TCloudUiLineStepCircleComponent {
796
+ constructor() {
797
+ this.step = 7;
798
+ this.active = 6;
799
+ this.inactives = [];
800
+ this.complete = false;
801
+ this.trilha = new Array();
730
802
  }
731
- getLogoName() {
732
- if (this.product !== '') {
733
- let name = this.product;
734
- name = (name).replace('_', '-');
735
- name = (name).toLowerCase();
736
- return 'logo-linha-' + name;
803
+ ngOnInit() {
804
+ setTimeout(() => { this.build_steps(); });
805
+ }
806
+ build_steps() {
807
+ let trilha = new Array();
808
+ if (this.step && this.step > 0) {
809
+ for (let i = 0; i < this.step; i++) {
810
+ (trilha).push({
811
+ status: '',
812
+ index: i + 1,
813
+ class: 'step-default',
814
+ second_class: '',
815
+ });
816
+ }
737
817
  }
738
- return '';
739
- }
740
- getWidthFontSize() {
741
- let size = 28;
742
- let new_size = size;
743
- const count = (this.product_name).length;
744
- if (count > 8) {
745
- new_size = 28;
818
+ if (this.active > this.step) {
819
+ this.active = this.step;
820
+ this.complete = true;
746
821
  }
747
- if (count > 12) {
748
- const p = (size * (5 + (count * 2))) / 100;
749
- new_size = (size - p);
822
+ if (this.active && this.active > 0) {
823
+ for (let i = 0; i < this.active; i++) {
824
+ trilha[i].class = "step-progress";
825
+ if ((i + 1) === this.active && !this.complete) {
826
+ trilha[i].class = "step-active";
827
+ }
828
+ }
750
829
  }
751
- if (count > 15) {
752
- const p = (size * (10 + (count * 2))) / 100;
753
- new_size = (size - p);
830
+ if (this.inactives && (this.inactives).length > 0) {
831
+ for (let i = 0; i < (this.inactives).length; i++) {
832
+ const icon = this.inactives[i];
833
+ if (icon && icon > 0) {
834
+ trilha[(icon - 1)].second_class = "step-inactive";
835
+ }
836
+ }
754
837
  }
755
- return `${new_size}px`;
838
+ this.trilha = trilha;
756
839
  }
757
840
  }
758
- TCloudUiLinhaLogoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
759
- TCloudUiLinhaLogoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiLinhaLogoComponent, selector: "tcloud-ui-linha-logo", inputs: { product: "product" }, ngImport: i0, template: "<!-- <div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n <img class=\"img-logo\" src=\"/assets/img/logo-totvs.svg\" alt=\"{{ alt_product_name }}\">\r\n <p class=\"text-small\">Linha</p>\r\n <p class=\"text-product\" [style]=\"'font-size:'+font_size+';'\" >{{ product_name }}</p>\r\n</div> -->\r\n\r\n<div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n <img class=\"img-logo\" [attr.data-name-image]=\"logo_name\" [attr.src]=\"'/assets/img/'+logo_name+'.svg'\" alt=\"{{ alt_product_name }}\">\r\n</div>", styles: [".logo-product{display:flex;color:var(--cinza);flex-flow:column;width:150px}.logo-product .img-logo{width:100%;margin-bottom:13px}.logo-product .text-small{font-size:13px;margin:0;padding:0;text-align:left}.logo-product .text-product{text-align:left;font-size:22px;font-weight:700;line-height:1;margin:0;padding:0;text-transform:uppercase;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
760
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoComponent, decorators: [{
841
+ TCloudUiLineStepCircleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLineStepCircleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
842
+ TCloudUiLineStepCircleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiLineStepCircleComponent, selector: "tcloud-ui-line-step-circle", inputs: { step: "step", active: "active", inactives: "inactives", complete: "complete" }, ngImport: i0, template: "<table class=\"table-trilha\" cellspacing=\"0\" cellpadding=\"0\">\r\n <tr>\r\n <ng-container *ngFor=\"let fase of trilha; let i = index\" >\r\n <td class=\"area-circle\"><i class=\"fas fa-circle icon-{{ fase.class }} {{ fase.second_class }} \"></i></td>\r\n <td class=\"area-line\" *ngIf=\"(i+1) < (trilha).length\">\r\n <div class=\"step-line {{ fase.class }}\"></div>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n</table>", styles: [".table-trilha{width:100%;border-collapse:collapse;margin-top:3px;margin-bottom:2px}.table-trilha td{border:none}.table-trilha .area-circle{width:0px}.table-trilha .step-line{width:100%;height:2px;background-color:#ccc;padding:0;margin-left:-1px;width:110%}table tr{background-color:transparent!important}.step-default{background-color:#d9d9d9}.step-progress{background-color:#039be5!important}.icon-step-default{color:#d9d9d9}.icon-step-progress{color:#039be5}.icon-step-active{color:#ea9b3e}.step-inactive{color:#d9d9d9!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
843
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLineStepCircleComponent, decorators: [{
761
844
  type: Component,
762
- args: [{ selector: 'tcloud-ui-linha-logo', template: "<!-- <div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n <img class=\"img-logo\" src=\"/assets/img/logo-totvs.svg\" alt=\"{{ alt_product_name }}\">\r\n <p class=\"text-small\">Linha</p>\r\n <p class=\"text-product\" [style]=\"'font-size:'+font_size+';'\" >{{ product_name }}</p>\r\n</div> -->\r\n\r\n<div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n <img class=\"img-logo\" [attr.data-name-image]=\"logo_name\" [attr.src]=\"'/assets/img/'+logo_name+'.svg'\" alt=\"{{ alt_product_name }}\">\r\n</div>", styles: [".logo-product{display:flex;color:var(--cinza);flex-flow:column;width:150px}.logo-product .img-logo{width:100%;margin-bottom:13px}.logo-product .text-small{font-size:13px;margin:0;padding:0;text-align:left}.logo-product .text-product{text-align:left;font-size:22px;font-weight:700;line-height:1;margin:0;padding:0;text-transform:uppercase;white-space:nowrap}\n"] }]
763
- }], ctorParameters: function () { return []; }, propDecorators: { product: [{
845
+ args: [{ selector: 'tcloud-ui-line-step-circle', template: "<table class=\"table-trilha\" cellspacing=\"0\" cellpadding=\"0\">\r\n <tr>\r\n <ng-container *ngFor=\"let fase of trilha; let i = index\" >\r\n <td class=\"area-circle\"><i class=\"fas fa-circle icon-{{ fase.class }} {{ fase.second_class }} \"></i></td>\r\n <td class=\"area-line\" *ngIf=\"(i+1) < (trilha).length\">\r\n <div class=\"step-line {{ fase.class }}\"></div>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n</table>", styles: [".table-trilha{width:100%;border-collapse:collapse;margin-top:3px;margin-bottom:2px}.table-trilha td{border:none}.table-trilha .area-circle{width:0px}.table-trilha .step-line{width:100%;height:2px;background-color:#ccc;padding:0;margin-left:-1px;width:110%}table tr{background-color:transparent!important}.step-default{background-color:#d9d9d9}.step-progress{background-color:#039be5!important}.icon-step-default{color:#d9d9d9}.icon-step-progress{color:#039be5}.icon-step-active{color:#ea9b3e}.step-inactive{color:#d9d9d9!important}\n"] }]
846
+ }], ctorParameters: function () { return []; }, propDecorators: { step: [{
847
+ type: Input
848
+ }], active: [{
849
+ type: Input
850
+ }], inactives: [{
851
+ type: Input
852
+ }], complete: [{
764
853
  type: Input
765
854
  }] } });
766
855
 
767
- class TCloudUiLinhaLogoModule {
856
+ class TCloudUiLineStepCircleModule {
768
857
  }
769
- TCloudUiLinhaLogoModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
770
- TCloudUiLinhaLogoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, declarations: [TCloudUiLinhaLogoComponent], imports: [CommonModule], exports: [TCloudUiLinhaLogoComponent] });
771
- TCloudUiLinhaLogoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, imports: [CommonModule] });
772
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, decorators: [{
858
+ TCloudUiLineStepCircleModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLineStepCircleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
859
+ TCloudUiLineStepCircleModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLineStepCircleModule, declarations: [TCloudUiLineStepCircleComponent], imports: [CommonModule], exports: [TCloudUiLineStepCircleComponent] });
860
+ TCloudUiLineStepCircleModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLineStepCircleModule, imports: [CommonModule] });
861
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLineStepCircleModule, decorators: [{
773
862
  type: NgModule,
774
863
  args: [{
775
864
  declarations: [
776
- TCloudUiLinhaLogoComponent
865
+ TCloudUiLineStepCircleComponent
777
866
  ],
778
867
  imports: [
779
868
  CommonModule
780
869
  ],
781
870
  exports: [
782
- TCloudUiLinhaLogoComponent
871
+ TCloudUiLineStepCircleComponent
872
+ ]
873
+ }]
874
+ }] });
875
+
876
+ class TCloudUiModule {
877
+ }
878
+ TCloudUiModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
879
+ TCloudUiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiModule, exports: [TcloudUiModalModule,
880
+ TCloudUiTabMenuModule,
881
+ TCloudUiLinhaLogoModule,
882
+ TCloudUiLineStepCircleModule] });
883
+ TCloudUiModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiModule, imports: [TcloudUiModalModule,
884
+ TCloudUiTabMenuModule,
885
+ TCloudUiLinhaLogoModule,
886
+ TCloudUiLineStepCircleModule] });
887
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiModule, decorators: [{
888
+ type: NgModule,
889
+ args: [{
890
+ exports: [
891
+ TcloudUiModalModule,
892
+ TCloudUiTabMenuModule,
893
+ TCloudUiLinhaLogoModule,
894
+ TCloudUiLineStepCircleModule
783
895
  ]
784
896
  }]
785
897
  }] });
@@ -788,5 +900,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
788
900
  * Generated bundle index. Do not edit.
789
901
  */
790
902
 
791
- export { TCloudUiLinhaLogoComponent, TCloudUiLinhaLogoModule, TCloudUiTabContentComponent, TCloudUiTabHeadComponent, TCloudUiTabMenuComponent, TCloudUiTabMenuModule, TCloudUiTabSubtitleComponent, TCloudUiTabTitleComponent, TcloudUiModalBodyComponent, TcloudUiModalComponent, TcloudUiModalFooterComponent, TcloudUiModalHeaderComponent, TcloudUiModalModule };
903
+ export { TCloudUiLineStepCircleComponent, TCloudUiLineStepCircleModule, TCloudUiLinhaLogoComponent, TCloudUiLinhaLogoModule, TCloudUiModule, TCloudUiTabContentComponent, TCloudUiTabHeadComponent, TCloudUiTabMenuComponent, TCloudUiTabMenuModule, TCloudUiTabSubtitleComponent, TCloudUiTabTitleComponent, TcloudUiModalBodyComponent, TcloudUiModalComponent, TcloudUiModalFooterComponent, TcloudUiModalHeaderComponent, TcloudUiModalModule };
792
904
  //# sourceMappingURL=dev-tcloud-tcloud-ui.mjs.map