@dev-tcloud/tcloud-ui 0.1.19 → 0.1.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/_directives/el-copy/el-copy.directive.mjs +21 -3
- package/esm2020/lib/_modules/tcloud-ui-accordion/tcloud-ui-accordion.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-choice-issues/tcloud-ui-choice-issues.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-data-list/tcloud-ui-data-list.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-datepicker/tcloud-ui-datepicker.module.mjs +5 -4
- package/esm2020/lib/_modules/tcloud-ui-datepicker-time/tcloud-ui-datepicker-time.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-filters/components/range-date/range-date.component.mjs +3 -3
- package/esm2020/lib/_modules/tcloud-ui-filters/tcloud-ui-filters.component.mjs +3 -3
- package/esm2020/lib/_modules/tcloud-ui-filters/tcloud-ui-filters.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-input-password/tcloud-ui-input-password.component.mjs +13 -4
- package/esm2020/lib/_modules/tcloud-ui-input-password/tcloud-ui-input-password.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-input-search/tcloud-ui-input-search.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-line-step-circle/tcloud-ui-line-step-circle.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-linha-logo/tcloud-ui-linha-logo.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-modal/components/tcloud-ui-modal-footer/tcloud-ui-modal-footer.component.mjs +3 -3
- package/esm2020/lib/_modules/tcloud-ui-modal/tcloud-ui-modal.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-multi-input/tcloud-ui-multi-input.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-multi-select/tcloud-ui-multi-select.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-multiples-values/tcloud-ui-multiples-values.component.mjs +3 -3
- package/esm2020/lib/_modules/tcloud-ui-multiples-values/tcloud-ui-multiples-values.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-not-found/tcloud-ui-not-found.module.mjs +3 -2
- package/esm2020/lib/_modules/tcloud-ui-number-step/tcloud-ui-number-step.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-progress-bar/tcloud-ui-progress-bar.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-scroll-box/tcloud-ui-scroll-box.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-tab-menu/tcloud-ui-tab-menu.module.mjs +3 -2
- package/esm2020/lib/_modules/tcloud-ui-table/tcloud-ui-table.module.mjs +4 -3
- package/esm2020/lib/_modules/tcloud-ui-welcome/tcloud-ui-welcome.module.mjs +4 -3
- package/esm2020/lib/_pipes/bytes.mjs +10 -2
- package/fesm2015/dev-tcloud-tcloud-ui.mjs +91 -34
- package/fesm2015/dev-tcloud-tcloud-ui.mjs.map +1 -1
- package/fesm2020/dev-tcloud-tcloud-ui.mjs +90 -34
- package/fesm2020/dev-tcloud-tcloud-ui.mjs.map +1 -1
- package/lib/_modules/tcloud-ui-input-password/tcloud-ui-input-password.component.d.ts +4 -1
- package/lib/_pipes/bytes.d.ts +1 -1
- package/package.json +1 -1
- package/scss/components/custom/el-copy.scss +12 -0
- package/scss/tcloud/custom/alerts.scss +29 -30
- package/scss/tcloud/custom/buttons.scss +544 -532
- package/scss/tcloud/custom/card.scss +4 -2
- package/scss/tcloud/custom/colors.scss +1 -0
- package/scss/tcloud/custom/forms.scss +14 -6
- package/scss/tcloud/custom/left-navigation.scss +48 -0
- package/scss/tcloud/custom/mixins.scss +143 -143
- package/scss/tcloud/custom/tcloud-prime.scss +9 -11
- package/scss/tcloud/custom/tcloud-standard.scss +3 -0
- package/scss/tcloud/custom/top-navigation.scss +52 -0
- package/scss/tcloud/iaas/forms.scss +18 -0
- package/scss/tcloud/styles.scss +5 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, Input, NgModule, Injectable, EventEmitter, Output, ViewChild, forwardRef, Pipe, ViewEncapsulation, Directive, HostListener } from '@angular/core';
|
|
2
|
+
import { Component, Input, NgModule, CUSTOM_ELEMENTS_SCHEMA, Injectable, EventEmitter, Output, ViewChild, forwardRef, Pipe, ViewEncapsulation, Directive, HostListener } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule, DatePipe } from '@angular/common';
|
|
5
5
|
import { Subject } from 'rxjs';
|
|
@@ -86,7 +86,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
86
86
|
],
|
|
87
87
|
exports: [
|
|
88
88
|
TCloudUiLinhaLogoComponent
|
|
89
|
-
]
|
|
89
|
+
],
|
|
90
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
90
91
|
}]
|
|
91
92
|
}] });
|
|
92
93
|
|
|
@@ -497,6 +498,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
497
498
|
TCloudUiTabSubtitleComponent,
|
|
498
499
|
TCloudUiTabHeadComponent
|
|
499
500
|
],
|
|
501
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
500
502
|
}]
|
|
501
503
|
}] });
|
|
502
504
|
|
|
@@ -814,10 +816,10 @@ class TCloudUiModalFooterComponent {
|
|
|
814
816
|
}
|
|
815
817
|
}
|
|
816
818
|
TCloudUiModalFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiModalFooterComponent, deps: [{ token: TcloudModalService }], target: i0.ɵɵFactoryTarget.Component });
|
|
817
|
-
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=\"tcloud-ui-modal-footer tc-modal-footer\">\r\n\r\n <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n <p>Digite a palavra <strong>"{{ param_confirm.confirmText }}"</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=\"
|
|
819
|
+
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=\"tcloud-ui-modal-footer tc-modal-footer\">\r\n\r\n <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n <p>Digite a palavra <strong>"{{ param_confirm.confirmText }}"</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=\"tc-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=\"tc-btn margin-l-5\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"tc-btn margin-l-5\" (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=\"tc-btn tc-btn-primary margin-l-5\" (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}.margin-l-5{margin-left:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
|
|
818
820
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiModalFooterComponent, decorators: [{
|
|
819
821
|
type: Component,
|
|
820
|
-
args: [{ selector: 'tcloud-ui-modal-footer', template: "<div class=\"tcloud-ui-modal-footer tc-modal-footer\">\r\n\r\n <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n <p>Digite a palavra <strong>"{{ param_confirm.confirmText }}"</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=\"
|
|
822
|
+
args: [{ selector: 'tcloud-ui-modal-footer', template: "<div class=\"tcloud-ui-modal-footer tc-modal-footer\">\r\n\r\n <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n <p>Digite a palavra <strong>"{{ param_confirm.confirmText }}"</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=\"tc-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=\"tc-btn margin-l-5\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"tc-btn margin-l-5\" (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=\"tc-btn tc-btn-primary margin-l-5\" (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}.margin-l-5{margin-left:5px}\n"] }]
|
|
821
823
|
}], ctorParameters: function () { return [{ type: TcloudModalService }]; }, propDecorators: { btnCloseText: [{
|
|
822
824
|
type: Input
|
|
823
825
|
}], btnCancelText: [{
|
|
@@ -863,7 +865,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
863
865
|
TCloudUiModalHeaderComponent,
|
|
864
866
|
TCloudUiModalBodyComponent,
|
|
865
867
|
TCloudUiModalFooterComponent
|
|
866
|
-
]
|
|
868
|
+
],
|
|
869
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
867
870
|
}]
|
|
868
871
|
}] });
|
|
869
872
|
|
|
@@ -973,7 +976,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
973
976
|
],
|
|
974
977
|
exports: [
|
|
975
978
|
TCloudUiLineStepCircleComponent
|
|
976
|
-
]
|
|
979
|
+
],
|
|
980
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
977
981
|
}]
|
|
978
982
|
}] });
|
|
979
983
|
|
|
@@ -1152,7 +1156,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
1152
1156
|
CommonModule,
|
|
1153
1157
|
FormsModule,
|
|
1154
1158
|
ReactiveFormsModule
|
|
1155
|
-
]
|
|
1159
|
+
],
|
|
1160
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
1156
1161
|
}]
|
|
1157
1162
|
}] });
|
|
1158
1163
|
|
|
@@ -1590,7 +1595,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
1590
1595
|
CommonModule,
|
|
1591
1596
|
FormsModule,
|
|
1592
1597
|
ReactiveFormsModule
|
|
1593
|
-
]
|
|
1598
|
+
],
|
|
1599
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
1594
1600
|
}]
|
|
1595
1601
|
}] });
|
|
1596
1602
|
|
|
@@ -1698,7 +1704,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
1698
1704
|
CommonModule,
|
|
1699
1705
|
FormsModule,
|
|
1700
1706
|
ReactiveFormsModule
|
|
1701
|
-
]
|
|
1707
|
+
],
|
|
1708
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
1702
1709
|
}]
|
|
1703
1710
|
}] });
|
|
1704
1711
|
|
|
@@ -1865,7 +1872,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
1865
1872
|
FormsModule,
|
|
1866
1873
|
ReactiveFormsModule,
|
|
1867
1874
|
CommonModule
|
|
1868
|
-
]
|
|
1875
|
+
],
|
|
1876
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
1869
1877
|
}]
|
|
1870
1878
|
}] });
|
|
1871
1879
|
|
|
@@ -2118,7 +2126,15 @@ class BytesPipe {
|
|
|
2118
2126
|
const c = 0 > b ? 0 : b, d = Math.floor(Math.log(a) / Math.log(1024));
|
|
2119
2127
|
return parseFloat((a / Math.pow(1024, d)).toFixed(c)) + ' ' + ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"][d];
|
|
2120
2128
|
}
|
|
2121
|
-
transform(value) {
|
|
2129
|
+
transform(value, typeValue) {
|
|
2130
|
+
if (typeValue !== undefined && typeValue !== null && typeValue !== '') {
|
|
2131
|
+
if ((typeValue).toLowerCase() === 'kb') {
|
|
2132
|
+
value = value * 1024;
|
|
2133
|
+
}
|
|
2134
|
+
if ((typeValue).toLowerCase() === 'mb') {
|
|
2135
|
+
value = (value * 1024) * 1024;
|
|
2136
|
+
}
|
|
2137
|
+
}
|
|
2122
2138
|
const b = +value;
|
|
2123
2139
|
return this.formatBytes(b);
|
|
2124
2140
|
}
|
|
@@ -2435,7 +2451,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
2435
2451
|
CommonModule,
|
|
2436
2452
|
FormsModule,
|
|
2437
2453
|
ReactiveFormsModule
|
|
2438
|
-
]
|
|
2454
|
+
],
|
|
2455
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
2439
2456
|
}]
|
|
2440
2457
|
}] });
|
|
2441
2458
|
|
|
@@ -2473,6 +2490,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
2473
2490
|
exports: [
|
|
2474
2491
|
TCloudUiNotFoundComponent
|
|
2475
2492
|
],
|
|
2493
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
2476
2494
|
}]
|
|
2477
2495
|
}] });
|
|
2478
2496
|
|
|
@@ -2511,7 +2529,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
2511
2529
|
],
|
|
2512
2530
|
imports: [
|
|
2513
2531
|
CommonModule
|
|
2514
|
-
]
|
|
2532
|
+
],
|
|
2533
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
2515
2534
|
}]
|
|
2516
2535
|
}] });
|
|
2517
2536
|
|
|
@@ -2627,7 +2646,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
2627
2646
|
],
|
|
2628
2647
|
imports: [
|
|
2629
2648
|
CommonModule
|
|
2630
|
-
]
|
|
2649
|
+
],
|
|
2650
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
2631
2651
|
}]
|
|
2632
2652
|
}] });
|
|
2633
2653
|
|
|
@@ -2666,7 +2686,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
2666
2686
|
],
|
|
2667
2687
|
imports: [
|
|
2668
2688
|
CommonModule
|
|
2669
|
-
]
|
|
2689
|
+
],
|
|
2690
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
2670
2691
|
}]
|
|
2671
2692
|
}] });
|
|
2672
2693
|
|
|
@@ -3501,10 +3522,10 @@ class TCloudUiRangeDateComponent {
|
|
|
3501
3522
|
}
|
|
3502
3523
|
}
|
|
3503
3524
|
TCloudUiRangeDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiRangeDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3504
|
-
TCloudUiRangeDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiRangeDateComponent, selector: "range-date", inputs: { defaultValuePeriodStartStop: "defaultValuePeriodStartStop", required: "required", descriptionStart: "descriptionStart", descriptionStop: "descriptionStop" }, outputs: { onChange: "onChange" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2, CUSTOM_INPUT_VALIDATORS$1], ngImport: i0, template: "<table class=\"tcloud-ui-filters-range-date area-range-date\">\r\n <tr>\r\n\r\n <td>\r\n <div *ngIf=\"mode === 'select'\">\r\n <div class=\"description-period\">Per\u00EDodo</div>\r\n <select name=\"periodo\" class=\"
|
|
3525
|
+
TCloudUiRangeDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiRangeDateComponent, selector: "range-date", inputs: { defaultValuePeriodStartStop: "defaultValuePeriodStartStop", required: "required", descriptionStart: "descriptionStart", descriptionStop: "descriptionStop" }, outputs: { onChange: "onChange" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2, CUSTOM_INPUT_VALIDATORS$1], ngImport: i0, template: "<table class=\"tcloud-ui-filters-range-date area-range-date\">\r\n <tr>\r\n\r\n <td>\r\n <div *ngIf=\"mode === 'select'\">\r\n <div class=\"description-period\">Per\u00EDodo</div>\r\n <select name=\"periodo\" class=\"tc-form-control\" (change)=\"onChangeOptionsDateTime($event.target)\" [(ngModel)]=\"defaultValuePeriodStartStop\" >\r\n <option value=\"\"></option> \r\n <ng-container *ngFor=\"let item of options_date_time\">\r\n <option [value]=\"item.value\">{{ item.description }}</option>\r\n </ng-container>\r\n </select>\r\n </div>\r\n <div *ngIf=\"mode === 'datepickers'\">\r\n\r\n <table class=\"area-range-datepickers\">\r\n <tr>\r\n <td>\r\n <div class=\"description-start\">{{ descriptionStart }}</div>\r\n <tcloud-ui-datepicker-time \r\n #_input_start \r\n [(ngModel)]=\"result.start\" \r\n name=\"input_start\" \r\n (eventChange)=\"onChangeStartDateTime(_input_start)\">\r\n </tcloud-ui-datepicker-time>\r\n </td>\r\n <td>\r\n <div class=\"description-stop\">{{ descriptionStop }}</div>\r\n <tcloud-ui-datepicker-time \r\n #_input_stop\r\n [(ngModel)]=\"result.stop\" \r\n name=\"input_stop\" \r\n (eventChange)=\"onChangeStopDateTime(_input_stop)\">\r\n </tcloud-ui-datepicker-time>\r\n </td>\r\n </tr>\r\n </table>\r\n\r\n </div>\r\n </td>\r\n\r\n <td>\r\n <button class=\"btn-mode-range-date\" [class.active]=\"mode === 'select'\" (click)=\"toggle()\" type=\"button\">\r\n\r\n <i *ngIf=\"mode === 'select'\" class=\"far fa-calendar-alt\" title=\"Alterar para calend\u00E1rio\"></i>\r\n <i *ngIf=\"mode !== 'select'\" class=\"fas fa-calendar-week\" title=\"Selecionar per\u00EDodo\"></i>\r\n\r\n <!-- <div *ngIf=\"mode === 'select'\">Exibir<br>Calend\u00E1rio</div> -->\r\n <!-- <div *ngIf=\"mode !== 'select'\">Exibir<br>Per\u00EDodo</div> -->\r\n </button>\r\n </td>\r\n\r\n </tr>\r\n</table>", styles: [".area-range-date{height:40px;width:100%}.area-range-date tr td:first-child{width:calc(100% - 35px)}.area-range-date tr td:first-child select{color:#535353;border-radius:3px 0 0 3px!important}.area-range-date tr td:first-child .area-range-datepickers{width:100%}.area-range-date tr td:first-child .area-range-datepickers td{width:50%!important}.area-range-date tr td:last-child{width:35px}.area-range-date tr td:last-child .btn-mode-range-date{width:100%;text-align:center;border:1px solid #ccc;background-color:#fff;font-size:17px;line-height:1;cursor:pointer;color:#6c6c6c;height:40px;border-radius:0 3px 3px 0}.area-range-date tr td:last-child .btn-mode-range-date:focus{color:#403d3d}.active{background-color:#eee!important}.description-period,.description-start{position:relative;left:17px;top:-15px;line-height:0}.description-stop{position:relative;top:-15px;line-height:0}\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"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TCloudUiDatepickerTimeComponent, selector: "tcloud-ui-datepicker-time", inputs: ["ngModel", "useOptionsDateTime"], outputs: ["ngModelChange", "onChange", "eventChange"] }] });
|
|
3505
3526
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiRangeDateComponent, decorators: [{
|
|
3506
3527
|
type: Component,
|
|
3507
|
-
args: [{ selector: 'range-date', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2, CUSTOM_INPUT_VALIDATORS$1], template: "<table class=\"tcloud-ui-filters-range-date area-range-date\">\r\n <tr>\r\n\r\n <td>\r\n <div *ngIf=\"mode === 'select'\">\r\n <div class=\"description-period\">Per\u00EDodo</div>\r\n <select name=\"periodo\" class=\"
|
|
3528
|
+
args: [{ selector: 'range-date', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2, CUSTOM_INPUT_VALIDATORS$1], template: "<table class=\"tcloud-ui-filters-range-date area-range-date\">\r\n <tr>\r\n\r\n <td>\r\n <div *ngIf=\"mode === 'select'\">\r\n <div class=\"description-period\">Per\u00EDodo</div>\r\n <select name=\"periodo\" class=\"tc-form-control\" (change)=\"onChangeOptionsDateTime($event.target)\" [(ngModel)]=\"defaultValuePeriodStartStop\" >\r\n <option value=\"\"></option> \r\n <ng-container *ngFor=\"let item of options_date_time\">\r\n <option [value]=\"item.value\">{{ item.description }}</option>\r\n </ng-container>\r\n </select>\r\n </div>\r\n <div *ngIf=\"mode === 'datepickers'\">\r\n\r\n <table class=\"area-range-datepickers\">\r\n <tr>\r\n <td>\r\n <div class=\"description-start\">{{ descriptionStart }}</div>\r\n <tcloud-ui-datepicker-time \r\n #_input_start \r\n [(ngModel)]=\"result.start\" \r\n name=\"input_start\" \r\n (eventChange)=\"onChangeStartDateTime(_input_start)\">\r\n </tcloud-ui-datepicker-time>\r\n </td>\r\n <td>\r\n <div class=\"description-stop\">{{ descriptionStop }}</div>\r\n <tcloud-ui-datepicker-time \r\n #_input_stop\r\n [(ngModel)]=\"result.stop\" \r\n name=\"input_stop\" \r\n (eventChange)=\"onChangeStopDateTime(_input_stop)\">\r\n </tcloud-ui-datepicker-time>\r\n </td>\r\n </tr>\r\n </table>\r\n\r\n </div>\r\n </td>\r\n\r\n <td>\r\n <button class=\"btn-mode-range-date\" [class.active]=\"mode === 'select'\" (click)=\"toggle()\" type=\"button\">\r\n\r\n <i *ngIf=\"mode === 'select'\" class=\"far fa-calendar-alt\" title=\"Alterar para calend\u00E1rio\"></i>\r\n <i *ngIf=\"mode !== 'select'\" class=\"fas fa-calendar-week\" title=\"Selecionar per\u00EDodo\"></i>\r\n\r\n <!-- <div *ngIf=\"mode === 'select'\">Exibir<br>Calend\u00E1rio</div> -->\r\n <!-- <div *ngIf=\"mode !== 'select'\">Exibir<br>Per\u00EDodo</div> -->\r\n </button>\r\n </td>\r\n\r\n </tr>\r\n</table>", styles: [".area-range-date{height:40px;width:100%}.area-range-date tr td:first-child{width:calc(100% - 35px)}.area-range-date tr td:first-child select{color:#535353;border-radius:3px 0 0 3px!important}.area-range-date tr td:first-child .area-range-datepickers{width:100%}.area-range-date tr td:first-child .area-range-datepickers td{width:50%!important}.area-range-date tr td:last-child{width:35px}.area-range-date tr td:last-child .btn-mode-range-date{width:100%;text-align:center;border:1px solid #ccc;background-color:#fff;font-size:17px;line-height:1;cursor:pointer;color:#6c6c6c;height:40px;border-radius:0 3px 3px 0}.area-range-date tr td:last-child .btn-mode-range-date:focus{color:#403d3d}.active{background-color:#eee!important}.description-period,.description-start{position:relative;left:17px;top:-15px;line-height:0}.description-stop{position:relative;top:-15px;line-height:0}\n"] }]
|
|
3508
3529
|
}], ctorParameters: function () { return []; }, propDecorators: { onChange: [{
|
|
3509
3530
|
type: Output
|
|
3510
3531
|
}], defaultValuePeriodStartStop: [{
|
|
@@ -3967,10 +3988,10 @@ class TCloudUiFiltersComponent {
|
|
|
3967
3988
|
}
|
|
3968
3989
|
}
|
|
3969
3990
|
TCloudUiFiltersComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiFiltersComponent, deps: [{ token: i1.DatePipe }], target: i0.ɵɵFactoryTarget.Component });
|
|
3970
|
-
TCloudUiFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiFiltersComponent, selector: "tcloud-ui-filters", inputs: { data: "data", filters: "filters", submitText: "submitText", btnSubmitClass: "btnSubmitClass", useOnChangeSubmit: "useOnChangeSubmit", useButtonSubmit: "useButtonSubmit", useNormalizeCaseSensitive: "useNormalizeCaseSensitive", useRangeDate: "useRangeDate", useFilterAccept: "useFilterAccept" }, outputs: { result: "result", onFilter: "onFilter", onChange: "onChange", onSubmit: "onSubmit" }, viewQueries: [{ propertyName: "_formulario", first: true, predicate: ["_formulario"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"show_filters\" class=\"tcloud-ui-filters area-filter\">\r\n <ng-container *ngFor=\"let item of filters; let i = index\">\r\n\r\n <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\r\n\r\n <ng-container *ngIf=\"item.type === 'date-local'\">\r\n\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <tcloud-ui-datepicker \r\n #_input\r\n name=\"input_{{i+1}}\"\r\n [modeInput]=\"true\"\r\n [(ngModel)]=\"item.value\"\r\n (ngModelChange)=\"searchIn(item, _input)\">\r\n </tcloud-ui-datepicker>\r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n \r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"item.type !== 'date-local'\">\r\n <ng-container *ngIf=\"item.type === 'datetime-local'\">\r\n\r\n <ng-container *ngIf=\"(item.id === 'start' || item.id === 'stop') && useRangeDate\">\r\n <!-- PERIOD RANGE DATE -->\r\n <ng-container *ngIf=\"item.id === 'start'\">\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+start_stop_width+''+start_stop_und : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(_range_date && _range_date.result && _range_date.result.start && _range_date.result.stop )\" class=\"fas fa-filter icon-filter\"></i> </div>\r\n <range-date \r\n #_range_date ngModel name=\"input_{{i+1}}\" \r\n [defaultValuePeriodStartStop]=\"item.defaultValuePeriodStartStop\"\r\n [descriptionStart]=\"descriptionStart\"\r\n [descriptionStop]=\"descriptionStop\"\r\n required \r\n (onChange)=\"searchInRange(_range_date); searchIn(item, _range_date)\">\r\n </range-date>\r\n </div>\r\n </ng-container> \r\n <input *ngIf=\"item.id === 'start'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"start_value\"> \r\n <input *ngIf=\"item.id === 'stop'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"stop_value\"> \r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!item.id || !useRangeDate\">\r\n\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <tcloud-ui-datepicker-time \r\n #_input \r\n [(ngModel)]=\"item.value\" \r\n name=\"input_{{i+1}}\" \r\n [useOptionsDateTime]=\"(item && item.useOptionsDateTime) ? true : false\"\r\n (eventChange)=\"searchIn(item, _input)\" >\r\n </tcloud-ui-datepicker-time>\r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n </ng-container>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local' && item.type !== 'date-local'\">\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <input \r\n #_input\r\n [(ngModel)]=\"item.value\"\r\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n name=\"input_{{i+1}}\" \r\n type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \r\n class=\"form-control tc-form-control\" \r\n (keyup)=\"searchIn(item, $event)\"> \r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <select \r\n #_input\r\n [(ngModel)]=\"item.value\"\r\n name=\"input_{{i+1}}\" \r\n class=\"form-control tc-form-control\" \r\n (change)=\"searchIn(item, $event)\">\r\n <option [ngValue]=\"\"></option>\r\n <ng-container *ngFor=\"let v of item.data\">\r\n <option [value]=\"v.value\">{{ v.description }}</option>\r\n </ng-container>\r\n </select>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </ng-container>\r\n\r\n\r\n <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\r\n \r\n <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis\" title=\"{{ item.description }}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"area-input-checkbox\">\r\n <div class=\"form-control tc-form-control\">\r\n <label>\r\n {{ item.placeholder }}\r\n <input \r\n #_input\r\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n name=\"input_{{i+1}}\" \r\n type=\"checkbox\" \r\n (change)=\"searchIn(item, _input.checked)\"> \r\n </label>\r\n </div> \r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\r\n <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\r\n </div>\r\n\r\n</div>\r\n\r\n<!-- <pre>{{ inputs | json }}</pre> -->\r\n<!-- <pre> {{ data | json }} </pre> -->\r\n\r\n<!-- <p>FILTERS</p><pre> {{ filters | json }}</pre> -->\r\n\r\n<!--\r\n <pre>start_stop: {{ start_stop }}</pre>\r\n <pre>start_stop_width: {{ start_stop_width }}</pre>\r\n <pre>start_stop_und: {{ start_stop_und }}</pre>\r\n-->", styles: [".box-filter-input{display:inline-grid;padding:10px 5px;position:relative}.area-filter{border:1px solid #eeeeee;border-radius:5px;margin-bottom:5px}.btn-clear-filter-text{position:absolute;right:8px;top:38px;background-color:#fff;border:none;cursor:pointer;color:#aaa}.to-hide{display:none}.icon-filter{color:#ccc}.to-active{color:var(--tc-primary)}.area-input-checkbox label{cursor:pointer;margin-bottom:0;color:#9f9f9f}.area-input-checkbox div.tc-form-control{height:40px}.m-description{margin-bottom:3px}input{color:#535353}input[type=text],input[type=number],select{height:40px!important}.type-hidden{display:none;width:0px!important}.box-type-global_vars{display:none!important;width:0px!important}.tc-title-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\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"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.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: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TCloudUiDatepickerTimeComponent, selector: "tcloud-ui-datepicker-time", inputs: ["ngModel", "useOptionsDateTime"], outputs: ["ngModelChange", "onChange", "eventChange"] }, { kind: "component", type: TCloudUiDatepickerComponent, selector: "tcloud-ui-datepicker", inputs: ["multiple", "maxNumberOfDates", "daysOfWeekDisabled", "minDate", "maxDate", "datesDisabled", "modeInput", "useBorder", "childInputDateTime", "ngModel", "code"], outputs: ["onChange", "ngModelChange"] }, { kind: "component", type: TCloudUiRangeDateComponent, selector: "range-date", inputs: ["defaultValuePeriodStartStop", "required", "descriptionStart", "descriptionStop"], outputs: ["onChange"] }] });
|
|
3991
|
+
TCloudUiFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiFiltersComponent, selector: "tcloud-ui-filters", inputs: { data: "data", filters: "filters", submitText: "submitText", btnSubmitClass: "btnSubmitClass", useOnChangeSubmit: "useOnChangeSubmit", useButtonSubmit: "useButtonSubmit", useNormalizeCaseSensitive: "useNormalizeCaseSensitive", useRangeDate: "useRangeDate", useFilterAccept: "useFilterAccept" }, outputs: { result: "result", onFilter: "onFilter", onChange: "onChange", onSubmit: "onSubmit" }, viewQueries: [{ propertyName: "_formulario", first: true, predicate: ["_formulario"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"show_filters\" class=\"tcloud-ui-filters area-filter\">\r\n <ng-container *ngFor=\"let item of filters; let i = index\">\r\n\r\n <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\r\n\r\n <ng-container *ngIf=\"item.type === 'date-local'\">\r\n\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <tcloud-ui-datepicker \r\n #_input\r\n name=\"input_{{i+1}}\"\r\n [modeInput]=\"true\"\r\n [(ngModel)]=\"item.value\"\r\n (ngModelChange)=\"searchIn(item, _input)\">\r\n </tcloud-ui-datepicker>\r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n \r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"item.type !== 'date-local'\">\r\n <ng-container *ngIf=\"item.type === 'datetime-local'\">\r\n\r\n <ng-container *ngIf=\"(item.id === 'start' || item.id === 'stop') && useRangeDate\">\r\n <!-- PERIOD RANGE DATE -->\r\n <ng-container *ngIf=\"item.id === 'start'\">\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+start_stop_width+''+start_stop_und : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(_range_date && _range_date.result && _range_date.result.start && _range_date.result.stop )\" class=\"fas fa-filter icon-filter\"></i> </div>\r\n <range-date \r\n #_range_date ngModel name=\"input_{{i+1}}\" \r\n [defaultValuePeriodStartStop]=\"item.defaultValuePeriodStartStop\"\r\n [descriptionStart]=\"descriptionStart\"\r\n [descriptionStop]=\"descriptionStop\"\r\n required \r\n (onChange)=\"searchInRange(_range_date); searchIn(item, _range_date)\">\r\n </range-date>\r\n </div>\r\n </ng-container> \r\n <input *ngIf=\"item.id === 'start'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"start_value\"> \r\n <input *ngIf=\"item.id === 'stop'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"stop_value\"> \r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!item.id || !useRangeDate\">\r\n\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <tcloud-ui-datepicker-time \r\n #_input \r\n [(ngModel)]=\"item.value\" \r\n name=\"input_{{i+1}}\" \r\n [useOptionsDateTime]=\"(item && item.useOptionsDateTime) ? true : false\"\r\n (eventChange)=\"searchIn(item, _input)\" >\r\n </tcloud-ui-datepicker-time>\r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n </ng-container>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local' && item.type !== 'date-local'\">\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <input \r\n #_input\r\n [(ngModel)]=\"item.value\"\r\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n name=\"input_{{i+1}}\" \r\n type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \r\n class=\"tc-form-control\" \r\n (keyup)=\"searchIn(item, $event)\"> \r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <select \r\n #_input\r\n [(ngModel)]=\"item.value\"\r\n name=\"input_{{i+1}}\" \r\n class=\"tc-form-control\" \r\n (change)=\"searchIn(item, $event)\">\r\n <option [ngValue]=\"\"></option>\r\n <ng-container *ngFor=\"let v of item.data\">\r\n <option [value]=\"v.value\">{{ v.description }}</option>\r\n </ng-container>\r\n </select>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </ng-container>\r\n\r\n\r\n <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\r\n \r\n <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis\" title=\"{{ item.description }}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"area-input-checkbox\">\r\n <div class=\"tc-form-control\">\r\n <label>\r\n {{ item.placeholder }}\r\n <input \r\n #_input\r\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n name=\"input_{{i+1}}\" \r\n type=\"checkbox\" \r\n (change)=\"searchIn(item, _input.checked)\"> \r\n </label>\r\n </div> \r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\r\n <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\r\n </div>\r\n\r\n</div>\r\n\r\n<!-- <pre>{{ inputs | json }}</pre> -->\r\n<!-- <pre> {{ data | json }} </pre> -->\r\n\r\n<!-- <p>FILTERS</p><pre> {{ filters | json }}</pre> -->\r\n\r\n<!--\r\n <pre>start_stop: {{ start_stop }}</pre>\r\n <pre>start_stop_width: {{ start_stop_width }}</pre>\r\n <pre>start_stop_und: {{ start_stop_und }}</pre>\r\n-->", styles: [".box-filter-input{display:inline-grid;padding:10px 5px;position:relative}.area-filter{border:1px solid #eeeeee;border-radius:5px;margin-bottom:5px}.btn-clear-filter-text{position:absolute;right:8px;top:38px;background-color:#fff;border:none;cursor:pointer;color:#aaa}.to-hide{display:none}.icon-filter{color:#ccc}.to-active{color:var(--tc-primary)}.area-input-checkbox label{cursor:pointer;margin-bottom:0;color:#9f9f9f}.area-input-checkbox div.tc-form-control{height:40px}.m-description{margin-bottom:3px}input{color:#535353}input[type=text],input[type=number],select{height:40px!important}.type-hidden{display:none;width:0px!important}.box-type-global_vars{display:none!important;width:0px!important}.tc-title-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\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"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.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: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TCloudUiDatepickerTimeComponent, selector: "tcloud-ui-datepicker-time", inputs: ["ngModel", "useOptionsDateTime"], outputs: ["ngModelChange", "onChange", "eventChange"] }, { kind: "component", type: TCloudUiDatepickerComponent, selector: "tcloud-ui-datepicker", inputs: ["multiple", "maxNumberOfDates", "daysOfWeekDisabled", "minDate", "maxDate", "datesDisabled", "modeInput", "useBorder", "childInputDateTime", "ngModel", "code"], outputs: ["onChange", "ngModelChange"] }, { kind: "component", type: TCloudUiRangeDateComponent, selector: "range-date", inputs: ["defaultValuePeriodStartStop", "required", "descriptionStart", "descriptionStop"], outputs: ["onChange"] }] });
|
|
3971
3992
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiFiltersComponent, decorators: [{
|
|
3972
3993
|
type: Component,
|
|
3973
|
-
args: [{ selector: 'tcloud-ui-filters', template: "<div *ngIf=\"show_filters\" class=\"tcloud-ui-filters area-filter\">\r\n <ng-container *ngFor=\"let item of filters; let i = index\">\r\n\r\n <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\r\n\r\n <ng-container *ngIf=\"item.type === 'date-local'\">\r\n\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <tcloud-ui-datepicker \r\n #_input\r\n name=\"input_{{i+1}}\"\r\n [modeInput]=\"true\"\r\n [(ngModel)]=\"item.value\"\r\n (ngModelChange)=\"searchIn(item, _input)\">\r\n </tcloud-ui-datepicker>\r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n \r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"item.type !== 'date-local'\">\r\n <ng-container *ngIf=\"item.type === 'datetime-local'\">\r\n\r\n <ng-container *ngIf=\"(item.id === 'start' || item.id === 'stop') && useRangeDate\">\r\n <!-- PERIOD RANGE DATE -->\r\n <ng-container *ngIf=\"item.id === 'start'\">\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+start_stop_width+''+start_stop_und : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(_range_date && _range_date.result && _range_date.result.start && _range_date.result.stop )\" class=\"fas fa-filter icon-filter\"></i> </div>\r\n <range-date \r\n #_range_date ngModel name=\"input_{{i+1}}\" \r\n [defaultValuePeriodStartStop]=\"item.defaultValuePeriodStartStop\"\r\n [descriptionStart]=\"descriptionStart\"\r\n [descriptionStop]=\"descriptionStop\"\r\n required \r\n (onChange)=\"searchInRange(_range_date); searchIn(item, _range_date)\">\r\n </range-date>\r\n </div>\r\n </ng-container> \r\n <input *ngIf=\"item.id === 'start'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"start_value\"> \r\n <input *ngIf=\"item.id === 'stop'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"stop_value\"> \r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!item.id || !useRangeDate\">\r\n\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <tcloud-ui-datepicker-time \r\n #_input \r\n [(ngModel)]=\"item.value\" \r\n name=\"input_{{i+1}}\" \r\n [useOptionsDateTime]=\"(item && item.useOptionsDateTime) ? true : false\"\r\n (eventChange)=\"searchIn(item, _input)\" >\r\n </tcloud-ui-datepicker-time>\r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n </ng-container>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local' && item.type !== 'date-local'\">\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <input \r\n #_input\r\n [(ngModel)]=\"item.value\"\r\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n name=\"input_{{i+1}}\" \r\n type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \r\n class=\"form-control tc-form-control\" \r\n (keyup)=\"searchIn(item, $event)\"> \r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <select \r\n #_input\r\n [(ngModel)]=\"item.value\"\r\n name=\"input_{{i+1}}\" \r\n class=\"form-control tc-form-control\" \r\n (change)=\"searchIn(item, $event)\">\r\n <option [ngValue]=\"\"></option>\r\n <ng-container *ngFor=\"let v of item.data\">\r\n <option [value]=\"v.value\">{{ v.description }}</option>\r\n </ng-container>\r\n </select>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </ng-container>\r\n\r\n\r\n <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\r\n \r\n <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis\" title=\"{{ item.description }}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"area-input-checkbox\">\r\n <div class=\"form-control tc-form-control\">\r\n <label>\r\n {{ item.placeholder }}\r\n <input \r\n #_input\r\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n name=\"input_{{i+1}}\" \r\n type=\"checkbox\" \r\n (change)=\"searchIn(item, _input.checked)\"> \r\n </label>\r\n </div> \r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\r\n <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\r\n </div>\r\n\r\n</div>\r\n\r\n<!-- <pre>{{ inputs | json }}</pre> -->\r\n<!-- <pre> {{ data | json }} </pre> -->\r\n\r\n<!-- <p>FILTERS</p><pre> {{ filters | json }}</pre> -->\r\n\r\n<!--\r\n <pre>start_stop: {{ start_stop }}</pre>\r\n <pre>start_stop_width: {{ start_stop_width }}</pre>\r\n <pre>start_stop_und: {{ start_stop_und }}</pre>\r\n-->", styles: [".box-filter-input{display:inline-grid;padding:10px 5px;position:relative}.area-filter{border:1px solid #eeeeee;border-radius:5px;margin-bottom:5px}.btn-clear-filter-text{position:absolute;right:8px;top:38px;background-color:#fff;border:none;cursor:pointer;color:#aaa}.to-hide{display:none}.icon-filter{color:#ccc}.to-active{color:var(--tc-primary)}.area-input-checkbox label{cursor:pointer;margin-bottom:0;color:#9f9f9f}.area-input-checkbox div.tc-form-control{height:40px}.m-description{margin-bottom:3px}input{color:#535353}input[type=text],input[type=number],select{height:40px!important}.type-hidden{display:none;width:0px!important}.box-type-global_vars{display:none!important;width:0px!important}.tc-title-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"] }]
|
|
3994
|
+
args: [{ selector: 'tcloud-ui-filters', template: "<div *ngIf=\"show_filters\" class=\"tcloud-ui-filters area-filter\">\r\n <ng-container *ngFor=\"let item of filters; let i = index\">\r\n\r\n <ng-container *ngIf=\"!item.type || (item.type && item.type !== 'boolean')\">\r\n\r\n <ng-container *ngIf=\"item.type === 'date-local'\">\r\n\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <tcloud-ui-datepicker \r\n #_input\r\n name=\"input_{{i+1}}\"\r\n [modeInput]=\"true\"\r\n [(ngModel)]=\"item.value\"\r\n (ngModelChange)=\"searchIn(item, _input)\">\r\n </tcloud-ui-datepicker>\r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n \r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"item.type !== 'date-local'\">\r\n <ng-container *ngIf=\"item.type === 'datetime-local'\">\r\n\r\n <ng-container *ngIf=\"(item.id === 'start' || item.id === 'stop') && useRangeDate\">\r\n <!-- PERIOD RANGE DATE -->\r\n <ng-container *ngIf=\"item.id === 'start'\">\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+start_stop_width+''+start_stop_und : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(_range_date && _range_date.result && _range_date.result.start && _range_date.result.stop )\" class=\"fas fa-filter icon-filter\"></i> </div>\r\n <range-date \r\n #_range_date ngModel name=\"input_{{i+1}}\" \r\n [defaultValuePeriodStartStop]=\"item.defaultValuePeriodStartStop\"\r\n [descriptionStart]=\"descriptionStart\"\r\n [descriptionStop]=\"descriptionStop\"\r\n required \r\n (onChange)=\"searchInRange(_range_date); searchIn(item, _range_date)\">\r\n </range-date>\r\n </div>\r\n </ng-container> \r\n <input *ngIf=\"item.id === 'start'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"start_value\"> \r\n <input *ngIf=\"item.id === 'stop'\" #_input name=\"input_{{i+1}}\" type=\"hidden\" [(ngModel)]=\"stop_value\"> \r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!item.id || !useRangeDate\">\r\n\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"(item.value !== undefined && item.value !== null && item.value !== '')\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <tcloud-ui-datepicker-time \r\n #_input \r\n [(ngModel)]=\"item.value\" \r\n name=\"input_{{i+1}}\" \r\n [useOptionsDateTime]=\"(item && item.useOptionsDateTime) ? true : false\"\r\n (eventChange)=\"searchIn(item, _input)\" >\r\n </tcloud-ui-datepicker-time>\r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"!(item.value !== undefined && item.value !== null && item.value !== '')\" (click)=\"searchIn(item, null); item.searchText = undefined; item.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n </ng-container>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"item.type !== 'select' && item.type !== 'datetime-local' && item.type !== 'date-local'\">\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <input \r\n #_input\r\n [(ngModel)]=\"item.value\"\r\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n name=\"input_{{i+1}}\" \r\n type=\"{{ (item.type === 'number') ? 'text' : item.type }}\" \r\n class=\"tc-form-control\" \r\n (keyup)=\"searchIn(item, $event)\"> \r\n <button class=\"btn-clear-filter-text\" [class.to-hide]=\"_input.value === ''\" (click)=\"searchIn(item, null); _input.value = ''\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"item.type === 'select' && item.data && (item.data).length > 0\" >\r\n <div class=\"box-filter-input type-{{item.type}} box-type-{{item.type}}\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n\r\n <div class=\"m-description tc-title-ellipsis box-type-{{item.type}}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.value !== ''\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"box-type-{{item.type}}\">\r\n <select \r\n #_input\r\n [(ngModel)]=\"item.value\"\r\n name=\"input_{{i+1}}\" \r\n class=\"tc-form-control\" \r\n (change)=\"searchIn(item, $event)\">\r\n <option [ngValue]=\"\"></option>\r\n <ng-container *ngFor=\"let v of item.data\">\r\n <option [value]=\"v.value\">{{ v.description }}</option>\r\n </ng-container>\r\n </select>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </ng-container>\r\n\r\n\r\n <ng-container *ngIf=\"item.type && item.type === 'boolean'\">\r\n \r\n <div class=\"box-filter-input\" [style]=\"(item.width !== '') ? 'width:'+item.width : ''\">\r\n <div class=\"m-description tc-title-ellipsis\" title=\"{{ item.description }}\" title=\"{{ item.description }}\"><i [class.to-active]=\"_input.checked === true\" class=\"fas fa-filter icon-filter\"></i> {{ item.description }}</div>\r\n <div class=\"area-input-checkbox\">\r\n <div class=\"tc-form-control\">\r\n <label>\r\n {{ item.placeholder }}\r\n <input \r\n #_input\r\n placeholder=\"{{ (item.placeholder !== '') ? item.placeholder : '' }}\"\r\n name=\"input_{{i+1}}\" \r\n type=\"checkbox\" \r\n (change)=\"searchIn(item, _input.checked)\"> \r\n </label>\r\n </div> \r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <div class=\"text-right mb-1 mr-1\" *ngIf=\"useButtonSubmit\">\r\n <button type=\"button\" class=\"tc-btn {{ btnSubmitClass }}\" (click)=\"toSubmit()\" >{{ submitText }}</button>\r\n </div>\r\n\r\n</div>\r\n\r\n<!-- <pre>{{ inputs | json }}</pre> -->\r\n<!-- <pre> {{ data | json }} </pre> -->\r\n\r\n<!-- <p>FILTERS</p><pre> {{ filters | json }}</pre> -->\r\n\r\n<!--\r\n <pre>start_stop: {{ start_stop }}</pre>\r\n <pre>start_stop_width: {{ start_stop_width }}</pre>\r\n <pre>start_stop_und: {{ start_stop_und }}</pre>\r\n-->", styles: [".box-filter-input{display:inline-grid;padding:10px 5px;position:relative}.area-filter{border:1px solid #eeeeee;border-radius:5px;margin-bottom:5px}.btn-clear-filter-text{position:absolute;right:8px;top:38px;background-color:#fff;border:none;cursor:pointer;color:#aaa}.to-hide{display:none}.icon-filter{color:#ccc}.to-active{color:var(--tc-primary)}.area-input-checkbox label{cursor:pointer;margin-bottom:0;color:#9f9f9f}.area-input-checkbox div.tc-form-control{height:40px}.m-description{margin-bottom:3px}input{color:#535353}input[type=text],input[type=number],select{height:40px!important}.type-hidden{display:none;width:0px!important}.box-type-global_vars{display:none!important;width:0px!important}.tc-title-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"] }]
|
|
3974
3995
|
}], ctorParameters: function () { return [{ type: i1.DatePipe }]; }, propDecorators: { _formulario: [{
|
|
3975
3996
|
type: ViewChild,
|
|
3976
3997
|
args: ['_formulario']
|
|
@@ -4024,7 +4045,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
4024
4045
|
CommonModule,
|
|
4025
4046
|
FormsModule,
|
|
4026
4047
|
ReactiveFormsModule
|
|
4027
|
-
]
|
|
4048
|
+
],
|
|
4049
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
4028
4050
|
}]
|
|
4029
4051
|
}] });
|
|
4030
4052
|
|
|
@@ -4056,7 +4078,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
4056
4078
|
FormsModule,
|
|
4057
4079
|
ReactiveFormsModule,
|
|
4058
4080
|
TCloudUiDataListModule
|
|
4059
|
-
]
|
|
4081
|
+
],
|
|
4082
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
4060
4083
|
}]
|
|
4061
4084
|
}] });
|
|
4062
4085
|
|
|
@@ -4092,7 +4115,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
4092
4115
|
ReactiveFormsModule,
|
|
4093
4116
|
TCloudUiDatepickerTimeModule,
|
|
4094
4117
|
TCloudUiDatepickerModule
|
|
4095
|
-
]
|
|
4118
|
+
],
|
|
4119
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
4096
4120
|
}]
|
|
4097
4121
|
}] });
|
|
4098
4122
|
|
|
@@ -4307,7 +4331,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
4307
4331
|
],
|
|
4308
4332
|
imports: [
|
|
4309
4333
|
CommonModule
|
|
4310
|
-
]
|
|
4334
|
+
],
|
|
4335
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
4311
4336
|
}]
|
|
4312
4337
|
}] });
|
|
4313
4338
|
|
|
@@ -4559,10 +4584,17 @@ class TCloudUiElCopyDirective {
|
|
|
4559
4584
|
this.setItemFuncCopy();
|
|
4560
4585
|
}
|
|
4561
4586
|
setItemFuncCopy() {
|
|
4587
|
+
var _a;
|
|
4562
4588
|
const btn_copy = this.renderer.createElement('i');
|
|
4563
4589
|
var copyText = () => {
|
|
4564
4590
|
const elementWithCopyAttribute = document.querySelector(`[data-el-copy="${id}"]`);
|
|
4565
|
-
|
|
4591
|
+
let copyText = '';
|
|
4592
|
+
if (elementWithCopyAttribute && elementWithCopyAttribute.tagName && (elementWithCopyAttribute.tagName).toUpperCase() === 'INPUT') {
|
|
4593
|
+
copyText = elementWithCopyAttribute === null || elementWithCopyAttribute === void 0 ? void 0 : elementWithCopyAttribute.value;
|
|
4594
|
+
}
|
|
4595
|
+
else {
|
|
4596
|
+
copyText = elementWithCopyAttribute === null || elementWithCopyAttribute === void 0 ? void 0 : elementWithCopyAttribute.textContent;
|
|
4597
|
+
}
|
|
4566
4598
|
navigator.clipboard.writeText(copyText);
|
|
4567
4599
|
this.renderer.removeClass(btn_copy, 'fa-copy');
|
|
4568
4600
|
this.renderer.addClass(btn_copy, 'fa-check');
|
|
@@ -4581,7 +4613,19 @@ class TCloudUiElCopyDirective {
|
|
|
4581
4613
|
this.renderer.setAttribute(btn_copy, 'id', id);
|
|
4582
4614
|
this.renderer.setAttribute(btn_copy, 'title', 'Copy');
|
|
4583
4615
|
this.renderer.listen(btn_copy, 'click', () => { copyText(); });
|
|
4584
|
-
|
|
4616
|
+
if (((this.el.nativeElement).tagName).toUpperCase() === 'INPUT') {
|
|
4617
|
+
let classList = (_a = this.el.nativeElement) === null || _a === void 0 ? void 0 : _a.classList;
|
|
4618
|
+
if (classList && (classList).length > 0 && ('tc-form-control').indexOf(classList) > -1) {
|
|
4619
|
+
this.renderer.addClass(btn_copy, 'tcloud-ui-el-input-copy-tc-form-control');
|
|
4620
|
+
}
|
|
4621
|
+
else {
|
|
4622
|
+
this.renderer.addClass(btn_copy, 'tcloud-ui-el-input-copy');
|
|
4623
|
+
}
|
|
4624
|
+
this.renderer.appendChild(this.el.nativeElement.parentNode, btn_copy);
|
|
4625
|
+
}
|
|
4626
|
+
else {
|
|
4627
|
+
this.renderer.appendChild(this.el.nativeElement, btn_copy);
|
|
4628
|
+
}
|
|
4585
4629
|
}
|
|
4586
4630
|
generateID(target) {
|
|
4587
4631
|
const ref = (target) ? `-${target}` : '';
|
|
@@ -5023,10 +5067,10 @@ class TCloudUiMultiplesValuesComponent {
|
|
|
5023
5067
|
}
|
|
5024
5068
|
}
|
|
5025
5069
|
TCloudUiMultiplesValuesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiMultiplesValuesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5026
|
-
TCloudUiMultiplesValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiMultiplesValuesComponent, selector: "tcloud-ui-multiples-values", inputs: { listItems: "listItems", pattern: "pattern", delimiter: "delimiter", placeholder: "placeholder", disabled: "disabled", loading: "loading", required: "required", search: "search", uppercase: "uppercase", lowercase: "lowercase" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$1, CUSTOM_INPUT_VALIDATORS], ngImport: i0, template: "<div class=\"tcloud-ui-multiples-values tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\r\n\r\n\r\n <form #_formulario=\"ngForm\">\r\n\r\n <!-- {{ input_items }} -->\r\n\r\n <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\r\n\r\n <table style=\"width: 100%;\">\r\n <tr>\r\n <td>\r\n <table class=\"group-input-action\">\r\n <tr>\r\n <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <div class=\"input\" (click)=\"show_itens = false\">\r\n <tcloud-ui-data-list [placeholder]=\"placeholder_list\" [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\" (onChange)=\"toEnterKey(input_items)\"></tcloud-ui-data-list>\r\n </div>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <div class=\"input\">\r\n <input \r\n required\r\n [pattern]=\"pattern\"\r\n (keydown.enter)=\"toEnterKey(input_items)\"\r\n [disabled]=\"disabled\"\r\n [class.text-lowercase]=\"lowercase\"\r\n [class.text-uppercase]=\"uppercase\"\r\n type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n \r\n </div>\r\n </ng-container>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n <div class=\"input\">\r\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly> \r\n </div>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n <div class=\"input\"><input type=\"text\" class=\"info-no-value\" value=\"Vazio\" disabled readonly></div> \r\n </td>\r\n <td class=\"action-input-arrow bc-r\">\r\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n </button>\r\n </td>\r\n \r\n </tr>\r\n </table> \r\n </td>\r\n <td style=\"width: 45px;\">\r\n <table>\r\n <tr>\r\n <td class=\"action-input\" *ngIf=\"!disabled\">\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n </table>\r\n </td>\r\n </tr>\r\n </table>\r\n\r\n <!-- <table class=\"group-input-action\">\r\n <tr>\r\n <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <div class=\"input\" (click)=\"show_itens = false\">\r\n <tcloud-ui-data-list [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\"></tcloud-ui-data-list>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <div class=\"input\">\r\n <input \r\n (keydown.enter)=\"add_items();toOpen()\"\r\n [disabled]=\"disabled\"\r\n [class.text-lowercase]=\"lowercase\"\r\n [class.text-uppercase]=\"uppercase\"\r\n type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n \r\n </div>\r\n </ng-container>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n <div class=\"input\">\r\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly> \r\n </div>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n <div class=\"input\"><input type=\"text\" value=\"Vazio\" disabled readonly></div> \r\n </td>\r\n <td class=\"action-input-arrow bc-r\">\r\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n </button>\r\n </td>\r\n <td class=\"action-input\" *ngIf=\"!disabled\">\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n </table> -->\r\n </div>\r\n \r\n <!-- <pre>\r\n {{ items | json }}\r\n </pre> -->\r\n\r\n </form> \r\n\r\n <!-- box-itens-selected -->\r\n <div class=\"tc-dropdown-menu box-itens-selected {{ menu_on_top }}\" id=\"box-{{ id }}\" [attr.aria-labelledby]=\"id\" [class.to-hide]=\"!show_itens\" [style]=\"box_style\">\r\n \r\n\r\n <div class=\"line-search\" *ngIf=\"search\">\r\n <table class=\"box-search\" *ngIf=\"items && (items).length > 5\">\r\n <tr>\r\n \r\n <td class=\"area-input\">\r\n <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" > \r\n </td>\r\n \r\n <td class=\"area-icon\">\r\n <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\r\n <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\r\n </td>\r\n \r\n </tr>\r\n </table>\r\n </div>\r\n\r\n <div class=\"area-options\" id=\"{{ id }}-options\">\r\n <ng-container *ngFor=\"let item of items; let i = index\">\r\n \r\n <label class=\"box-label\">\r\n <div class=\"box-value\" [title]=\"item\" >\r\n {{ item }} \r\n </div>\r\n <div class=\"box-action\">\r\n <button\r\n class=\"box-action\"\r\n [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\r\n title=\"Remover\"\r\n type=\"button\"\r\n (click)=\"removeItem(item, i)\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </label>\r\n\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\r\n <div class=\"btn-remove-all\">\r\n <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\r\n Limpar toda a lista\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>", styles: ["table{border-collapse:collapse}td,th{padding:0;margin:0}::placeholder{font-style:italic;color:#999;text-transform:none!important}.box-input{border-radius:5px 0 0 5px}.box-input .input{background-color:#fff;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:transparent!important}.bc-l{background-color:#fff;border-left:1px solid var(--tc-gray-300)}.bc-r{background-color:#fff;border-right:1px solid var(--tc-gray-300)}.box-input-data-list{background-color:#fff;border-left:1px solid var(--tc-gray-300);border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);border-radius:5px 0 0 5px;height:42px;padding-left:5px}.group-input-action{width:100%;background-color:#fff}.group-input-action input{height:40px;border:none}.group-input-action td{height:40px;border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);background-color:transparent!important}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:transparent}.count-list .input input{height:40px;border:none;text-align:center;width:100px;background-color:transparent}.action-input-arrow{width:30px;background:transparent;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;border-top:none;border-right:none;border-bottom:none;border-left:none;width:30px;border-radius:0 3px 3px 0;position:relative;bottom:1px;color:#666}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:3px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:4px 16px 16px 3px;display:block;margin:0;height:40px;border:1px solid var(--tc-primary)!important}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important;font-size:18px;position:relative;top:1px}.box-itens-selected{display:block;padding:9px;background-color:#ededed;border-radius:4px;width:100%}.box-itens-selected .box-label{position:relative;display:inline-block;height:35px;min-width:60px;background-color:var(--white);color:var(--tc-gray-500);padding:8px 24px 10px 15px;border:1px solid var(--tc-primary);border-radius:5px;margin:2px;width:auto;max-width:100%}.box-itens-selected .box-label .box-value{width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.box-itens-selected .box-label div.box-action{position:absolute;right:4px;top:7px}.box-itens-selected .box-label div.box-action button{color:var(--tc-primary);background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.box-itens-selected .box-label div.box-action button:hover{color:var(--red)}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid var(--tc-gray-300);position:absolute;z-index:1;background-color:#f9f9f9}.tc-dropdown .area-options{padding-right:8px;max-height:200px;overflow-y:scroll;overflow-x:hidden}.tc-dropdown .menu-on-top{position:absolute}.line-search{padding:3px}.line-search .box-search{width:100%;border-collapse:collapse}.line-search .box-search td.area-icon{padding:4px 0 2px 8px;width:35px}.line-search .box-search td.area-icon .icon-search{color:#666}.line-search .box-search td.area-icon button{border:none;background-color:transparent;color:#999;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.line-search .box-search td.area-input{border:none}.line-search .box-search td.area-input input{width:100%}.line-search .box-search input{width:100%;font-size:13px;height:33px;border:1px solid var(--tc-gray-300);padding:10px}.btn-remove-all{text-align:right}.btn-remove-all button{background-color:transparent;border:none;color:#dd5353;cursor:pointer}.btn-remove-all button:hover{color:red!important}.info-no-value{color:#dd5353}\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"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: TCloudUiDataListComponent, selector: "tcloud-ui-data-list", inputs: ["placeholder", "disabled", "loading", "showInput", "search", "listItems", "open", "border", "ngModel"], outputs: ["onInputChange", "onChange", "onOpened", "onClosed", "ngModelChange"] }] });
|
|
5070
|
+
TCloudUiMultiplesValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiMultiplesValuesComponent, selector: "tcloud-ui-multiples-values", inputs: { listItems: "listItems", pattern: "pattern", delimiter: "delimiter", placeholder: "placeholder", disabled: "disabled", loading: "loading", required: "required", search: "search", uppercase: "uppercase", lowercase: "lowercase" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$1, CUSTOM_INPUT_VALIDATORS], ngImport: i0, template: "<div class=\"tcloud-ui-multiples-values tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\r\n\r\n\r\n <form #_formulario=\"ngForm\">\r\n\r\n <!-- {{ input_items }} -->\r\n\r\n <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\r\n\r\n <table style=\"width: 100%;\">\r\n <tr>\r\n <td>\r\n <table class=\"group-input-action\">\r\n <tr>\r\n <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <div class=\"input\" (click)=\"show_itens = false\">\r\n <tcloud-ui-data-list [placeholder]=\"placeholder_list\" [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\" (onChange)=\"toEnterKey(input_items)\"></tcloud-ui-data-list>\r\n </div>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <div class=\"input\">\r\n <input \r\n required\r\n [pattern]=\"pattern\"\r\n (keydown.enter)=\"toEnterKey(input_items)\"\r\n [disabled]=\"disabled\"\r\n [class.text-lowercase]=\"lowercase\"\r\n [class.text-uppercase]=\"uppercase\"\r\n type=\"text\" name=\"items\" class=\"tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n \r\n </div>\r\n </ng-container>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n <div class=\"input\">\r\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly> \r\n </div>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n <div class=\"input\"><input type=\"text\" class=\"info-no-value\" value=\"Vazio\" disabled readonly></div> \r\n </td>\r\n <td class=\"action-input-arrow bc-r\">\r\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n </button>\r\n </td>\r\n \r\n </tr>\r\n </table> \r\n </td>\r\n <td style=\"width: 45px;\">\r\n <table>\r\n <tr>\r\n <td class=\"action-input\" *ngIf=\"!disabled\">\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n </table>\r\n </td>\r\n </tr>\r\n </table>\r\n\r\n <!-- <table class=\"group-input-action\">\r\n <tr>\r\n <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <div class=\"input\" (click)=\"show_itens = false\">\r\n <tcloud-ui-data-list [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\"></tcloud-ui-data-list>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <div class=\"input\">\r\n <input \r\n (keydown.enter)=\"add_items();toOpen()\"\r\n [disabled]=\"disabled\"\r\n [class.text-lowercase]=\"lowercase\"\r\n [class.text-uppercase]=\"uppercase\"\r\n type=\"text\" name=\"items\" class=\"tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n \r\n </div>\r\n </ng-container>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n <div class=\"input\">\r\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly> \r\n </div>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n <div class=\"input\"><input type=\"text\" value=\"Vazio\" disabled readonly></div> \r\n </td>\r\n <td class=\"action-input-arrow bc-r\">\r\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n </button>\r\n </td>\r\n <td class=\"action-input\" *ngIf=\"!disabled\">\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n </table> -->\r\n </div>\r\n \r\n <!-- <pre>\r\n {{ items | json }}\r\n </pre> -->\r\n\r\n </form> \r\n\r\n <!-- box-itens-selected -->\r\n <div class=\"tc-dropdown-menu box-itens-selected {{ menu_on_top }}\" id=\"box-{{ id }}\" [attr.aria-labelledby]=\"id\" [class.to-hide]=\"!show_itens\" [style]=\"box_style\">\r\n \r\n\r\n <div class=\"line-search\" *ngIf=\"search\">\r\n <table class=\"box-search\" *ngIf=\"items && (items).length > 5\">\r\n <tr>\r\n \r\n <td class=\"area-input\">\r\n <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" > \r\n </td>\r\n \r\n <td class=\"area-icon\">\r\n <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\r\n <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\r\n </td>\r\n \r\n </tr>\r\n </table>\r\n </div>\r\n\r\n <div class=\"area-options\" id=\"{{ id }}-options\">\r\n <ng-container *ngFor=\"let item of items; let i = index\">\r\n \r\n <label class=\"box-label\">\r\n <div class=\"box-value\" [title]=\"item\" >\r\n {{ item }} \r\n </div>\r\n <div class=\"box-action\">\r\n <button\r\n class=\"box-action\"\r\n [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\r\n title=\"Remover\"\r\n type=\"button\"\r\n (click)=\"removeItem(item, i)\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </label>\r\n\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\r\n <div class=\"btn-remove-all\">\r\n <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\r\n Limpar toda a lista\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>", styles: ["table{border-collapse:collapse}td,th{padding:0;margin:0}::placeholder{font-style:italic;color:#999;text-transform:none!important}.box-input{border-radius:5px 0 0 5px}.box-input .input{background-color:#fff;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:transparent!important}.bc-l{background-color:#fff;border-left:1px solid var(--tc-gray-300)}.bc-r{background-color:#fff;border-right:1px solid var(--tc-gray-300)}.box-input-data-list{background-color:#fff;border-left:1px solid var(--tc-gray-300);border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);border-radius:5px 0 0 5px;height:42px;padding-left:5px}.group-input-action{width:100%;background-color:#fff}.group-input-action input{height:40px;border:none}.group-input-action td{height:40px;border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);background-color:transparent!important}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:transparent}.count-list .input input{height:40px;border:none;text-align:center;width:100px;background-color:transparent}.action-input-arrow{width:30px;background:transparent;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;border-top:none;border-right:none;border-bottom:none;border-left:none;width:30px;border-radius:0 3px 3px 0;position:relative;bottom:1px;color:#666}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:3px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:4px 16px 16px 3px;display:block;margin:0;height:40px;border:1px solid var(--tc-primary)!important}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important;font-size:18px;position:relative;top:1px}.box-itens-selected{display:block;padding:9px;background-color:#ededed;border-radius:4px;width:100%}.box-itens-selected .box-label{position:relative;display:inline-block;height:35px;min-width:60px;background-color:var(--white);color:var(--tc-gray-500);padding:8px 24px 10px 15px;border:1px solid var(--tc-primary);border-radius:5px;margin:2px;width:auto;max-width:100%}.box-itens-selected .box-label .box-value{width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.box-itens-selected .box-label div.box-action{position:absolute;right:4px;top:7px}.box-itens-selected .box-label div.box-action button{color:var(--tc-primary);background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.box-itens-selected .box-label div.box-action button:hover{color:var(--red)}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid var(--tc-gray-300);position:absolute;z-index:1;background-color:#f9f9f9}.tc-dropdown .area-options{padding-right:8px;max-height:200px;overflow-y:scroll;overflow-x:hidden}.tc-dropdown .menu-on-top{position:absolute}.line-search{padding:3px}.line-search .box-search{width:100%;border-collapse:collapse}.line-search .box-search td.area-icon{padding:4px 0 2px 8px;width:35px}.line-search .box-search td.area-icon .icon-search{color:#666}.line-search .box-search td.area-icon button{border:none;background-color:transparent;color:#999;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.line-search .box-search td.area-input{border:none}.line-search .box-search td.area-input input{width:100%}.line-search .box-search input{width:100%;font-size:13px;height:33px;border:1px solid var(--tc-gray-300);padding:10px}.btn-remove-all{text-align:right}.btn-remove-all button{background-color:transparent;border:none;color:#dd5353;cursor:pointer}.btn-remove-all button:hover{color:red!important}.info-no-value{color:#dd5353}\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"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: TCloudUiDataListComponent, selector: "tcloud-ui-data-list", inputs: ["placeholder", "disabled", "loading", "showInput", "search", "listItems", "open", "border", "ngModel"], outputs: ["onInputChange", "onChange", "onOpened", "onClosed", "ngModelChange"] }] });
|
|
5027
5071
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiMultiplesValuesComponent, decorators: [{
|
|
5028
5072
|
type: Component,
|
|
5029
|
-
args: [{ selector: 'tcloud-ui-multiples-values', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$1, CUSTOM_INPUT_VALIDATORS], template: "<div class=\"tcloud-ui-multiples-values tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\r\n\r\n\r\n <form #_formulario=\"ngForm\">\r\n\r\n <!-- {{ input_items }} -->\r\n\r\n <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\r\n\r\n <table style=\"width: 100%;\">\r\n <tr>\r\n <td>\r\n <table class=\"group-input-action\">\r\n <tr>\r\n <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <div class=\"input\" (click)=\"show_itens = false\">\r\n <tcloud-ui-data-list [placeholder]=\"placeholder_list\" [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\" (onChange)=\"toEnterKey(input_items)\"></tcloud-ui-data-list>\r\n </div>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <div class=\"input\">\r\n <input \r\n required\r\n [pattern]=\"pattern\"\r\n (keydown.enter)=\"toEnterKey(input_items)\"\r\n [disabled]=\"disabled\"\r\n [class.text-lowercase]=\"lowercase\"\r\n [class.text-uppercase]=\"uppercase\"\r\n type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n \r\n </div>\r\n </ng-container>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n <div class=\"input\">\r\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly> \r\n </div>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n <div class=\"input\"><input type=\"text\" class=\"info-no-value\" value=\"Vazio\" disabled readonly></div> \r\n </td>\r\n <td class=\"action-input-arrow bc-r\">\r\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n </button>\r\n </td>\r\n \r\n </tr>\r\n </table> \r\n </td>\r\n <td style=\"width: 45px;\">\r\n <table>\r\n <tr>\r\n <td class=\"action-input\" *ngIf=\"!disabled\">\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n </table>\r\n </td>\r\n </tr>\r\n </table>\r\n\r\n <!-- <table class=\"group-input-action\">\r\n <tr>\r\n <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <div class=\"input\" (click)=\"show_itens = false\">\r\n <tcloud-ui-data-list [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\"></tcloud-ui-data-list>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <div class=\"input\">\r\n <input \r\n (keydown.enter)=\"add_items();toOpen()\"\r\n [disabled]=\"disabled\"\r\n [class.text-lowercase]=\"lowercase\"\r\n [class.text-uppercase]=\"uppercase\"\r\n type=\"text\" name=\"items\" class=\"form-control tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n \r\n </div>\r\n </ng-container>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n <div class=\"input\">\r\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly> \r\n </div>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n <div class=\"input\"><input type=\"text\" value=\"Vazio\" disabled readonly></div> \r\n </td>\r\n <td class=\"action-input-arrow bc-r\">\r\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n </button>\r\n </td>\r\n <td class=\"action-input\" *ngIf=\"!disabled\">\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n </table> -->\r\n </div>\r\n \r\n <!-- <pre>\r\n {{ items | json }}\r\n </pre> -->\r\n\r\n </form> \r\n\r\n <!-- box-itens-selected -->\r\n <div class=\"tc-dropdown-menu box-itens-selected {{ menu_on_top }}\" id=\"box-{{ id }}\" [attr.aria-labelledby]=\"id\" [class.to-hide]=\"!show_itens\" [style]=\"box_style\">\r\n \r\n\r\n <div class=\"line-search\" *ngIf=\"search\">\r\n <table class=\"box-search\" *ngIf=\"items && (items).length > 5\">\r\n <tr>\r\n \r\n <td class=\"area-input\">\r\n <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" > \r\n </td>\r\n \r\n <td class=\"area-icon\">\r\n <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\r\n <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\r\n </td>\r\n \r\n </tr>\r\n </table>\r\n </div>\r\n\r\n <div class=\"area-options\" id=\"{{ id }}-options\">\r\n <ng-container *ngFor=\"let item of items; let i = index\">\r\n \r\n <label class=\"box-label\">\r\n <div class=\"box-value\" [title]=\"item\" >\r\n {{ item }} \r\n </div>\r\n <div class=\"box-action\">\r\n <button\r\n class=\"box-action\"\r\n [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\r\n title=\"Remover\"\r\n type=\"button\"\r\n (click)=\"removeItem(item, i)\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </label>\r\n\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\r\n <div class=\"btn-remove-all\">\r\n <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\r\n Limpar toda a lista\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>", styles: ["table{border-collapse:collapse}td,th{padding:0;margin:0}::placeholder{font-style:italic;color:#999;text-transform:none!important}.box-input{border-radius:5px 0 0 5px}.box-input .input{background-color:#fff;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:transparent!important}.bc-l{background-color:#fff;border-left:1px solid var(--tc-gray-300)}.bc-r{background-color:#fff;border-right:1px solid var(--tc-gray-300)}.box-input-data-list{background-color:#fff;border-left:1px solid var(--tc-gray-300);border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);border-radius:5px 0 0 5px;height:42px;padding-left:5px}.group-input-action{width:100%;background-color:#fff}.group-input-action input{height:40px;border:none}.group-input-action td{height:40px;border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);background-color:transparent!important}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:transparent}.count-list .input input{height:40px;border:none;text-align:center;width:100px;background-color:transparent}.action-input-arrow{width:30px;background:transparent;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;border-top:none;border-right:none;border-bottom:none;border-left:none;width:30px;border-radius:0 3px 3px 0;position:relative;bottom:1px;color:#666}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:3px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:4px 16px 16px 3px;display:block;margin:0;height:40px;border:1px solid var(--tc-primary)!important}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important;font-size:18px;position:relative;top:1px}.box-itens-selected{display:block;padding:9px;background-color:#ededed;border-radius:4px;width:100%}.box-itens-selected .box-label{position:relative;display:inline-block;height:35px;min-width:60px;background-color:var(--white);color:var(--tc-gray-500);padding:8px 24px 10px 15px;border:1px solid var(--tc-primary);border-radius:5px;margin:2px;width:auto;max-width:100%}.box-itens-selected .box-label .box-value{width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.box-itens-selected .box-label div.box-action{position:absolute;right:4px;top:7px}.box-itens-selected .box-label div.box-action button{color:var(--tc-primary);background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.box-itens-selected .box-label div.box-action button:hover{color:var(--red)}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid var(--tc-gray-300);position:absolute;z-index:1;background-color:#f9f9f9}.tc-dropdown .area-options{padding-right:8px;max-height:200px;overflow-y:scroll;overflow-x:hidden}.tc-dropdown .menu-on-top{position:absolute}.line-search{padding:3px}.line-search .box-search{width:100%;border-collapse:collapse}.line-search .box-search td.area-icon{padding:4px 0 2px 8px;width:35px}.line-search .box-search td.area-icon .icon-search{color:#666}.line-search .box-search td.area-icon button{border:none;background-color:transparent;color:#999;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.line-search .box-search td.area-input{border:none}.line-search .box-search td.area-input input{width:100%}.line-search .box-search input{width:100%;font-size:13px;height:33px;border:1px solid var(--tc-gray-300);padding:10px}.btn-remove-all{text-align:right}.btn-remove-all button{background-color:transparent;border:none;color:#dd5353;cursor:pointer}.btn-remove-all button:hover{color:red!important}.info-no-value{color:#dd5353}\n"] }]
|
|
5073
|
+
args: [{ selector: 'tcloud-ui-multiples-values', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$1, CUSTOM_INPUT_VALIDATORS], template: "<div class=\"tcloud-ui-multiples-values tc-dropdown\" id=\"area-{{ id }}\" [class.tc-parent-validation]=\"use_validation_required\">\r\n\r\n\r\n <form #_formulario=\"ngForm\">\r\n\r\n <!-- {{ input_items }} -->\r\n\r\n <div class=\"dropdown-toggle\" id=\"{{id}}\" [attr.aria-haspopup]=\"'true'\" [attr.aria-expanded]=\"'false'\">\r\n\r\n <table style=\"width: 100%;\">\r\n <tr>\r\n <td>\r\n <table class=\"group-input-action\">\r\n <tr>\r\n <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <div class=\"input\" (click)=\"show_itens = false\">\r\n <tcloud-ui-data-list [placeholder]=\"placeholder_list\" [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\" (onChange)=\"toEnterKey(input_items)\"></tcloud-ui-data-list>\r\n </div>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <div class=\"input\">\r\n <input \r\n required\r\n [pattern]=\"pattern\"\r\n (keydown.enter)=\"toEnterKey(input_items)\"\r\n [disabled]=\"disabled\"\r\n [class.text-lowercase]=\"lowercase\"\r\n [class.text-uppercase]=\"uppercase\"\r\n type=\"text\" name=\"items\" class=\"tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n \r\n </div>\r\n </ng-container>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n <div class=\"input\">\r\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly> \r\n </div>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n <div class=\"input\"><input type=\"text\" class=\"info-no-value\" value=\"Vazio\" disabled readonly></div> \r\n </td>\r\n <td class=\"action-input-arrow bc-r\">\r\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n </button>\r\n </td>\r\n \r\n </tr>\r\n </table> \r\n </td>\r\n <td style=\"width: 45px;\">\r\n <table>\r\n <tr>\r\n <td class=\"action-input\" *ngIf=\"!disabled\">\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n </table>\r\n </td>\r\n </tr>\r\n </table>\r\n\r\n <!-- <table class=\"group-input-action\">\r\n <tr>\r\n <td class=\"box-input{{ (listItems && (listItems).length > 0) ? '-data-list' : '' }} bc-l\">\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <div class=\"input\" (click)=\"show_itens = false\">\r\n <tcloud-ui-data-list [border]=\"false\" [loading]=\"loading\" [disabled]=\"disabled\" name=\"items\" [listItems]=\"listItems\" [(ngModel)]=\"input_items\"></tcloud-ui-data-list>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <div class=\"input\">\r\n <input \r\n (keydown.enter)=\"add_items();toOpen()\"\r\n [disabled]=\"disabled\"\r\n [class.text-lowercase]=\"lowercase\"\r\n [class.text-uppercase]=\"uppercase\"\r\n type=\"text\" name=\"items\" class=\"tc-form-control\" [(ngModel)]=\"input_items\" [placeholder]=\"placeholder_list\" required [title]=\"placeholder_list\">\r\n \r\n </div>\r\n </ng-container>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"(items && items.length > 0)\">\r\n <div class=\"input\">\r\n <input type=\"text\" value=\"{{ items.length }} {{ (items.length > 1) ? 'registros' : 'registro' }}\" disabled readonly> \r\n </div>\r\n </td>\r\n <td class=\"count-list\" *ngIf=\"!items || (items && items.length === 0)\">\r\n <div class=\"input\"><input type=\"text\" value=\"Vazio\" disabled readonly></div> \r\n </td>\r\n <td class=\"action-input-arrow bc-r\">\r\n <button (click)=\"toOpen()\" title=\"Lista de valores\" [disabled]=\"disabled\">\r\n <i class=\"fas fa-angle-up\" *ngIf=\"show_itens\"></i>\r\n <i class=\"fas fa-angle-down\" *ngIf=\"!show_itens\"></i>\r\n </button>\r\n </td>\r\n <td class=\"action-input\" *ngIf=\"!disabled\">\r\n <ng-container *ngIf=\"!listItems || !(listItems && (listItems).length > 0)\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items()\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n <ng-container *ngIf=\"listItems && (listItems).length > 0\">\r\n <button [disabled]=\"!_formulario.valid\" class=\"tc-btn tc-btn-primary btn-new-green\" (click)=\"add_items_by_data_list(input_items)\" title=\"Adicionar item\">\r\n <i class=\"fas fa-plus\"></i>\r\n </button>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n </table> -->\r\n </div>\r\n \r\n <!-- <pre>\r\n {{ items | json }}\r\n </pre> -->\r\n\r\n </form> \r\n\r\n <!-- box-itens-selected -->\r\n <div class=\"tc-dropdown-menu box-itens-selected {{ menu_on_top }}\" id=\"box-{{ id }}\" [attr.aria-labelledby]=\"id\" [class.to-hide]=\"!show_itens\" [style]=\"box_style\">\r\n \r\n\r\n <div class=\"line-search\" *ngIf=\"search\">\r\n <table class=\"box-search\" *ngIf=\"items && (items).length > 5\">\r\n <tr>\r\n \r\n <td class=\"area-input\">\r\n <input type=\"text\" class=\"tc-form-control\" [(ngModel)]=\"search_text\" (input)=\"toSearch($event)\" placeholder=\"Buscar...\" > \r\n </td>\r\n \r\n <td class=\"area-icon\">\r\n <i *ngIf=\"search_text === ''\" class=\"fas fa-search icon-search\"></i>\r\n <button class=\"box-action\" type=\"button\" *ngIf=\"search_text !== ''\" (click)=\"clearTextSearch()\"><i class=\"fas fa-times\"></i></button>\r\n </td>\r\n \r\n </tr>\r\n </table>\r\n </div>\r\n\r\n <div class=\"area-options\" id=\"{{ id }}-options\">\r\n <ng-container *ngFor=\"let item of items; let i = index\">\r\n \r\n <label class=\"box-label\">\r\n <div class=\"box-value\" [title]=\"item\" >\r\n {{ item }} \r\n </div>\r\n <div class=\"box-action\">\r\n <button\r\n class=\"box-action\"\r\n [disabled]=\"items === undefined || (items && items.length === 0) || disabled || loading\"\r\n title=\"Remover\"\r\n type=\"button\"\r\n (click)=\"removeItem(item, i)\">\r\n <i class=\"fas fa-times\"></i>\r\n </button>\r\n </div>\r\n </label>\r\n\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mt-5\" *ngIf=\"items && (items).length > 5\">\r\n <div class=\"btn-remove-all\">\r\n <button class=\"box-action\" type=\"button\" (click)=\"remove_all()\">\r\n Limpar toda a lista\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>", styles: ["table{border-collapse:collapse}td,th{padding:0;margin:0}::placeholder{font-style:italic;color:#999;text-transform:none!important}.box-input{border-radius:5px 0 0 5px}.box-input .input{background-color:#fff;border-radius:5px 0 0 5px}.box-input .ng-invalid{border-color:transparent!important}.bc-l{background-color:#fff;border-left:1px solid var(--tc-gray-300)}.bc-r{background-color:#fff;border-right:1px solid var(--tc-gray-300)}.box-input-data-list{background-color:#fff;border-left:1px solid var(--tc-gray-300);border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);border-radius:5px 0 0 5px;height:42px;padding-left:5px}.group-input-action{width:100%;background-color:#fff}.group-input-action input{height:40px;border:none}.group-input-action td{height:40px;border-top:1px solid var(--tc-gray-300);border-bottom:1px solid var(--tc-gray-300);background-color:transparent!important}.count-list{width:90px;text-align:center;background:#fff}.count-list .input{background-color:transparent}.count-list .input input{height:40px;border:none;text-align:center;width:100px;background-color:transparent}.action-input-arrow{width:30px;background:transparent;position:relative;z-index:0}.action-input-arrow button{cursor:pointer;background-color:transparent;text-align:center;font-size:15px;border-top:none;border-right:none;border-bottom:none;border-left:none;width:30px;border-radius:0 3px 3px 0;position:relative;bottom:1px;color:#666}.action-input-arrow button i{position:relative;z-index:-1}.action-input{width:50px;padding-left:3px}.action-input .tc-btn{width:100%!important;padding:0;text-align:center;border-radius:4px 16px 16px 3px;display:block;margin:0;height:40px;border:1px solid var(--tc-primary)!important}.action-input .tc-btn i{width:100%;text-align:center;padding:0!important;margin:0!important;font-size:18px;position:relative;top:1px}.box-itens-selected{display:block;padding:9px;background-color:#ededed;border-radius:4px;width:100%}.box-itens-selected .box-label{position:relative;display:inline-block;height:35px;min-width:60px;background-color:var(--white);color:var(--tc-gray-500);padding:8px 24px 10px 15px;border:1px solid var(--tc-primary);border-radius:5px;margin:2px;width:auto;max-width:100%}.box-itens-selected .box-label .box-value{width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.box-itens-selected .box-label div.box-action{position:absolute;right:4px;top:7px}.box-itens-selected .box-label div.box-action button{color:var(--tc-primary);background-color:transparent;border:none;font-weight:700;cursor:pointer}.box-itens-selected .box-label div.box-action button i{font-size:12px}.box-itens-selected .box-label div.box-action button:hover{color:var(--red)}.to-hide{display:none}.dropdown-toggle:after{display:none!important}.tc-dropdown{position:relative}.tc-dropdown .tc-dropdown-menu{width:100%;border:1px solid var(--tc-gray-300);position:absolute;z-index:1;background-color:#f9f9f9}.tc-dropdown .area-options{padding-right:8px;max-height:200px;overflow-y:scroll;overflow-x:hidden}.tc-dropdown .menu-on-top{position:absolute}.line-search{padding:3px}.line-search .box-search{width:100%;border-collapse:collapse}.line-search .box-search td.area-icon{padding:4px 0 2px 8px;width:35px}.line-search .box-search td.area-icon .icon-search{color:#666}.line-search .box-search td.area-icon button{border:none;background-color:transparent;color:#999;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.line-search .box-search td.area-input{border:none}.line-search .box-search td.area-input input{width:100%}.line-search .box-search input{width:100%;font-size:13px;height:33px;border:1px solid var(--tc-gray-300);padding:10px}.btn-remove-all{text-align:right}.btn-remove-all button{background-color:transparent;border:none;color:#dd5353;cursor:pointer}.btn-remove-all button:hover{color:red!important}.info-no-value{color:#dd5353}\n"] }]
|
|
5030
5074
|
}], ctorParameters: function () { return []; }, propDecorators: { listItems: [{
|
|
5031
5075
|
type: Input
|
|
5032
5076
|
}], pattern: [{
|
|
@@ -5074,7 +5118,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
5074
5118
|
FormsModule,
|
|
5075
5119
|
ReactiveFormsModule,
|
|
5076
5120
|
TCloudUiDataListModule
|
|
5077
|
-
]
|
|
5121
|
+
],
|
|
5122
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
5078
5123
|
}]
|
|
5079
5124
|
}] });
|
|
5080
5125
|
|
|
@@ -5128,7 +5173,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
5128
5173
|
],
|
|
5129
5174
|
imports: [
|
|
5130
5175
|
CommonModule
|
|
5131
|
-
]
|
|
5176
|
+
],
|
|
5177
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
5132
5178
|
}]
|
|
5133
5179
|
}] });
|
|
5134
5180
|
|
|
@@ -5141,6 +5187,9 @@ const noop = () => {
|
|
|
5141
5187
|
};
|
|
5142
5188
|
class TCloudUiInputPasswordComponent {
|
|
5143
5189
|
constructor() {
|
|
5190
|
+
this.actionView = true;
|
|
5191
|
+
this.actionCopy = true;
|
|
5192
|
+
this.actionGeneratePassword = true;
|
|
5144
5193
|
this.numberOfCharacter = 14;
|
|
5145
5194
|
this.atLeastOneUppercaseLetter = true;
|
|
5146
5195
|
this.atLeastOneLowercaseLetter = true;
|
|
@@ -5242,11 +5291,17 @@ class TCloudUiInputPasswordComponent {
|
|
|
5242
5291
|
}
|
|
5243
5292
|
}
|
|
5244
5293
|
TCloudUiInputPasswordComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiInputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5245
|
-
TCloudUiInputPasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiInputPasswordComponent, selector: "tcloud-ui-input-password", inputs: { numberOfCharacter: "numberOfCharacter", atLeastOneUppercaseLetter: "atLeastOneUppercaseLetter", atLeastOneLowercaseLetter: "atLeastOneLowercaseLetter", atLeastOneSpecialCharacter: "atLeastOneSpecialCharacter", ngModel: "ngModel" }, outputs: { ngModelChange: "ngModelChange" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR], ngImport: i0, template: "<div class=\"tcloud-ui-input-password\">\r\n <table>\r\n <tr>\r\n <!-- input password -->\r\n <td>\r\n <form #_form=\"ngForm\">\r\n <ng-container *ngIf=\"passwordRegex\">\r\n <input class=\"tc-form-control\" *ngIf=\"mode == 'password'\" type=\"password\" name=\"tc_password\" [pattern]=\"passwordRegex\" autoComplete=\"new-password\" [(ngModel)]=\"innerValue\" required>\r\n <input class=\"tc-form-control\" *ngIf=\"mode == 'text'\" type=\"text\" name=\"tc_text\" [pattern]=\"passwordRegex\" [(ngModel)]=\"innerValue\" required>\r\n </ng-container>\r\n </form>\r\n </td>\r\n\r\n <!-- action show hide -->\r\n <td>\r\n <button type=\"button\" (click)=\"toggleMode()\" [title]=\"(mode == 'password') ? 'Visualizar Senha' : 'Esconder Senha'\">\r\n <i *ngIf=\"mode == 'password'\" class=\"far fa-eye-slash\"></i>\r\n <i *ngIf=\"mode == 'text'\" class=\"far fa-eye\"></i> \r\n </button>\r\n </td>\r\n\r\n <!-- action generate pass -->\r\n <td>\r\n <button type=\"button\" [title]=\"'Gerar Senha'\" (click)=\"generatePassword()\">\r\n <i class=\"fa-solid fa-key\"></i>\r\n </button>\r\n </td>\r\n\r\n <!-- action copy pass -->\r\n <td>\r\n <button type=\"button\" [title]=\"'Copiar Senha'\" (click)=\"copyText()\">\r\n <i *ngIf=\"!isCopy\" class=\"fa-regular fa-copy\"></i>\r\n <i *ngIf=\"isCopy\" class=\"fa-solid fa-check\"></i>\r\n </button>\r\n </td>\r\n </tr>\r\n </table>\r\n</div>", styles: [".tcloud-ui-input-password{border:1px solid var(--tc-gray-300);border-radius:3px}.tcloud-ui-input-password table{width:100%}.tcloud-ui-input-password table td:first-child{width:100%!important}.tcloud-ui-input-password table td:first-child input{width:100%;border:none;height:38px;padding-left:8px}.tcloud-ui-input-password table td{width:50px;height:40px;background-color:#fff}.tcloud-ui-input-password table td button{background:transparent;border:none;margin-right:3px;cursor:pointer;color:var(--tc-gray-500)}.tcloud-ui-input-password table td button:hover{color:var(--tc-primary2)}.tcloud-ui-input-password .ng-invalid.ng-touched{border:1px solid var(--red)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
|
|
5294
|
+
TCloudUiInputPasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiInputPasswordComponent, selector: "tcloud-ui-input-password", inputs: { actionView: "actionView", actionCopy: "actionCopy", actionGeneratePassword: "actionGeneratePassword", numberOfCharacter: "numberOfCharacter", atLeastOneUppercaseLetter: "atLeastOneUppercaseLetter", atLeastOneLowercaseLetter: "atLeastOneLowercaseLetter", atLeastOneSpecialCharacter: "atLeastOneSpecialCharacter", ngModel: "ngModel" }, outputs: { ngModelChange: "ngModelChange" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR], ngImport: i0, template: "<div class=\"tcloud-ui-input-password\">\r\n <table>\r\n <tr>\r\n <!-- input password -->\r\n <td>\r\n <form #_form=\"ngForm\">\r\n <ng-container *ngIf=\"passwordRegex\">\r\n <input class=\"tc-form-control\" *ngIf=\"mode == 'password'\" type=\"password\" name=\"tc_password\" [pattern]=\"passwordRegex\" autoComplete=\"new-password\" [(ngModel)]=\"innerValue\" required>\r\n <input class=\"tc-form-control\" *ngIf=\"mode == 'text'\" type=\"text\" name=\"tc_text\" [pattern]=\"passwordRegex\" [(ngModel)]=\"innerValue\" required>\r\n </ng-container>\r\n </form>\r\n </td>\r\n\r\n <!-- action show hide -->\r\n <td *ngIf=\"actionView\">\r\n <button type=\"button\" (click)=\"toggleMode()\" [title]=\"(mode == 'password') ? 'Visualizar Senha' : 'Esconder Senha'\">\r\n <i *ngIf=\"mode == 'password'\" class=\"far fa-eye-slash\"></i>\r\n <i *ngIf=\"mode == 'text'\" class=\"far fa-eye\"></i> \r\n </button>\r\n </td>\r\n\r\n <!-- action generate pass -->\r\n <td *ngIf=\"actionGeneratePassword\">\r\n <button type=\"button\" [title]=\"'Gerar Senha'\" (click)=\"generatePassword()\">\r\n <i class=\"fa-solid fa-key\"></i>\r\n </button>\r\n </td>\r\n\r\n <!-- action copy pass -->\r\n <td *ngIf=\"actionCopy\">\r\n <button type=\"button\" [title]=\"'Copiar Senha'\" (click)=\"copyText()\">\r\n <i *ngIf=\"!isCopy\" class=\"fa-regular fa-copy\"></i>\r\n <i *ngIf=\"isCopy\" class=\"fa-solid fa-check\"></i>\r\n </button>\r\n </td>\r\n </tr>\r\n </table>\r\n</div>", styles: [".tcloud-ui-input-password{border:1px solid var(--tc-gray-300);border-radius:3px}.tcloud-ui-input-password table{width:100%}.tcloud-ui-input-password table td:first-child{width:100%!important}.tcloud-ui-input-password table td:first-child input{width:100%;border:none;height:38px;padding-left:8px}.tcloud-ui-input-password table td{width:50px;height:40px;background-color:#fff}.tcloud-ui-input-password table td button{background:transparent;border:none;margin-right:3px;cursor:pointer;color:var(--tc-gray-500)}.tcloud-ui-input-password table td button:hover{color:var(--tc-primary2)}.tcloud-ui-input-password .ng-invalid.ng-touched{border:1px solid var(--red)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
|
|
5246
5295
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiInputPasswordComponent, decorators: [{
|
|
5247
5296
|
type: Component,
|
|
5248
|
-
args: [{ selector: 'tcloud-ui-input-password', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR], template: "<div class=\"tcloud-ui-input-password\">\r\n <table>\r\n <tr>\r\n <!-- input password -->\r\n <td>\r\n <form #_form=\"ngForm\">\r\n <ng-container *ngIf=\"passwordRegex\">\r\n <input class=\"tc-form-control\" *ngIf=\"mode == 'password'\" type=\"password\" name=\"tc_password\" [pattern]=\"passwordRegex\" autoComplete=\"new-password\" [(ngModel)]=\"innerValue\" required>\r\n <input class=\"tc-form-control\" *ngIf=\"mode == 'text'\" type=\"text\" name=\"tc_text\" [pattern]=\"passwordRegex\" [(ngModel)]=\"innerValue\" required>\r\n </ng-container>\r\n </form>\r\n </td>\r\n\r\n <!-- action show hide -->\r\n <td>\r\n <button type=\"button\" (click)=\"toggleMode()\" [title]=\"(mode == 'password') ? 'Visualizar Senha' : 'Esconder Senha'\">\r\n <i *ngIf=\"mode == 'password'\" class=\"far fa-eye-slash\"></i>\r\n <i *ngIf=\"mode == 'text'\" class=\"far fa-eye\"></i> \r\n </button>\r\n </td>\r\n\r\n <!-- action generate pass -->\r\n <td>\r\n <button type=\"button\" [title]=\"'Gerar Senha'\" (click)=\"generatePassword()\">\r\n <i class=\"fa-solid fa-key\"></i>\r\n </button>\r\n </td>\r\n\r\n <!-- action copy pass -->\r\n <td>\r\n <button type=\"button\" [title]=\"'Copiar Senha'\" (click)=\"copyText()\">\r\n <i *ngIf=\"!isCopy\" class=\"fa-regular fa-copy\"></i>\r\n <i *ngIf=\"isCopy\" class=\"fa-solid fa-check\"></i>\r\n </button>\r\n </td>\r\n </tr>\r\n </table>\r\n</div>", styles: [".tcloud-ui-input-password{border:1px solid var(--tc-gray-300);border-radius:3px}.tcloud-ui-input-password table{width:100%}.tcloud-ui-input-password table td:first-child{width:100%!important}.tcloud-ui-input-password table td:first-child input{width:100%;border:none;height:38px;padding-left:8px}.tcloud-ui-input-password table td{width:50px;height:40px;background-color:#fff}.tcloud-ui-input-password table td button{background:transparent;border:none;margin-right:3px;cursor:pointer;color:var(--tc-gray-500)}.tcloud-ui-input-password table td button:hover{color:var(--tc-primary2)}.tcloud-ui-input-password .ng-invalid.ng-touched{border:1px solid var(--red)!important}\n"] }]
|
|
5249
|
-
}], ctorParameters: function () { return []; }, propDecorators: {
|
|
5297
|
+
args: [{ selector: 'tcloud-ui-input-password', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR], template: "<div class=\"tcloud-ui-input-password\">\r\n <table>\r\n <tr>\r\n <!-- input password -->\r\n <td>\r\n <form #_form=\"ngForm\">\r\n <ng-container *ngIf=\"passwordRegex\">\r\n <input class=\"tc-form-control\" *ngIf=\"mode == 'password'\" type=\"password\" name=\"tc_password\" [pattern]=\"passwordRegex\" autoComplete=\"new-password\" [(ngModel)]=\"innerValue\" required>\r\n <input class=\"tc-form-control\" *ngIf=\"mode == 'text'\" type=\"text\" name=\"tc_text\" [pattern]=\"passwordRegex\" [(ngModel)]=\"innerValue\" required>\r\n </ng-container>\r\n </form>\r\n </td>\r\n\r\n <!-- action show hide -->\r\n <td *ngIf=\"actionView\">\r\n <button type=\"button\" (click)=\"toggleMode()\" [title]=\"(mode == 'password') ? 'Visualizar Senha' : 'Esconder Senha'\">\r\n <i *ngIf=\"mode == 'password'\" class=\"far fa-eye-slash\"></i>\r\n <i *ngIf=\"mode == 'text'\" class=\"far fa-eye\"></i> \r\n </button>\r\n </td>\r\n\r\n <!-- action generate pass -->\r\n <td *ngIf=\"actionGeneratePassword\">\r\n <button type=\"button\" [title]=\"'Gerar Senha'\" (click)=\"generatePassword()\">\r\n <i class=\"fa-solid fa-key\"></i>\r\n </button>\r\n </td>\r\n\r\n <!-- action copy pass -->\r\n <td *ngIf=\"actionCopy\">\r\n <button type=\"button\" [title]=\"'Copiar Senha'\" (click)=\"copyText()\">\r\n <i *ngIf=\"!isCopy\" class=\"fa-regular fa-copy\"></i>\r\n <i *ngIf=\"isCopy\" class=\"fa-solid fa-check\"></i>\r\n </button>\r\n </td>\r\n </tr>\r\n </table>\r\n</div>", styles: [".tcloud-ui-input-password{border:1px solid var(--tc-gray-300);border-radius:3px}.tcloud-ui-input-password table{width:100%}.tcloud-ui-input-password table td:first-child{width:100%!important}.tcloud-ui-input-password table td:first-child input{width:100%;border:none;height:38px;padding-left:8px}.tcloud-ui-input-password table td{width:50px;height:40px;background-color:#fff}.tcloud-ui-input-password table td button{background:transparent;border:none;margin-right:3px;cursor:pointer;color:var(--tc-gray-500)}.tcloud-ui-input-password table td button:hover{color:var(--tc-primary2)}.tcloud-ui-input-password .ng-invalid.ng-touched{border:1px solid var(--red)!important}\n"] }]
|
|
5298
|
+
}], ctorParameters: function () { return []; }, propDecorators: { actionView: [{
|
|
5299
|
+
type: Input
|
|
5300
|
+
}], actionCopy: [{
|
|
5301
|
+
type: Input
|
|
5302
|
+
}], actionGeneratePassword: [{
|
|
5303
|
+
type: Input
|
|
5304
|
+
}], numberOfCharacter: [{
|
|
5250
5305
|
type: Input
|
|
5251
5306
|
}], atLeastOneUppercaseLetter: [{
|
|
5252
5307
|
type: Input
|
|
@@ -5282,7 +5337,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
5282
5337
|
],
|
|
5283
5338
|
exports: [
|
|
5284
5339
|
TCloudUiInputPasswordComponent
|
|
5285
|
-
]
|
|
5340
|
+
],
|
|
5341
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
5286
5342
|
}]
|
|
5287
5343
|
}] });
|
|
5288
5344
|
|
|
@@ -5391,7 +5447,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
5391
5447
|
exports: [TCloudUiProgressBarComponent],
|
|
5392
5448
|
imports: [
|
|
5393
5449
|
CommonModule
|
|
5394
|
-
]
|
|
5450
|
+
],
|
|
5451
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
5395
5452
|
}]
|
|
5396
5453
|
}] });
|
|
5397
5454
|
|