@dev-tcloud/tcloud-ui 0.1.20 → 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/_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.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/fesm2015/dev-tcloud-tcloud-ui.mjs +49 -28
- package/fesm2015/dev-tcloud-tcloud-ui.mjs.map +1 -1
- package/fesm2020/dev-tcloud-tcloud-ui.mjs +49 -28
- package/fesm2020/dev-tcloud-tcloud-ui.mjs.map +1 -1
- package/package.json +1 -1
- 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
|
|
|
@@ -2443,7 +2451,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
2443
2451
|
CommonModule,
|
|
2444
2452
|
FormsModule,
|
|
2445
2453
|
ReactiveFormsModule
|
|
2446
|
-
]
|
|
2454
|
+
],
|
|
2455
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
2447
2456
|
}]
|
|
2448
2457
|
}] });
|
|
2449
2458
|
|
|
@@ -2481,6 +2490,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
2481
2490
|
exports: [
|
|
2482
2491
|
TCloudUiNotFoundComponent
|
|
2483
2492
|
],
|
|
2493
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
2484
2494
|
}]
|
|
2485
2495
|
}] });
|
|
2486
2496
|
|
|
@@ -2519,7 +2529,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
2519
2529
|
],
|
|
2520
2530
|
imports: [
|
|
2521
2531
|
CommonModule
|
|
2522
|
-
]
|
|
2532
|
+
],
|
|
2533
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
2523
2534
|
}]
|
|
2524
2535
|
}] });
|
|
2525
2536
|
|
|
@@ -2635,7 +2646,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
2635
2646
|
],
|
|
2636
2647
|
imports: [
|
|
2637
2648
|
CommonModule
|
|
2638
|
-
]
|
|
2649
|
+
],
|
|
2650
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
2639
2651
|
}]
|
|
2640
2652
|
}] });
|
|
2641
2653
|
|
|
@@ -2674,7 +2686,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
2674
2686
|
],
|
|
2675
2687
|
imports: [
|
|
2676
2688
|
CommonModule
|
|
2677
|
-
]
|
|
2689
|
+
],
|
|
2690
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
2678
2691
|
}]
|
|
2679
2692
|
}] });
|
|
2680
2693
|
|
|
@@ -3509,10 +3522,10 @@ class TCloudUiRangeDateComponent {
|
|
|
3509
3522
|
}
|
|
3510
3523
|
}
|
|
3511
3524
|
TCloudUiRangeDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiRangeDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3512
|
-
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"] }] });
|
|
3513
3526
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiRangeDateComponent, decorators: [{
|
|
3514
3527
|
type: Component,
|
|
3515
|
-
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"] }]
|
|
3516
3529
|
}], ctorParameters: function () { return []; }, propDecorators: { onChange: [{
|
|
3517
3530
|
type: Output
|
|
3518
3531
|
}], defaultValuePeriodStartStop: [{
|
|
@@ -3975,10 +3988,10 @@ class TCloudUiFiltersComponent {
|
|
|
3975
3988
|
}
|
|
3976
3989
|
}
|
|
3977
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 });
|
|
3978
|
-
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"] }] });
|
|
3979
3992
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiFiltersComponent, decorators: [{
|
|
3980
3993
|
type: Component,
|
|
3981
|
-
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"] }]
|
|
3982
3995
|
}], ctorParameters: function () { return [{ type: i1.DatePipe }]; }, propDecorators: { _formulario: [{
|
|
3983
3996
|
type: ViewChild,
|
|
3984
3997
|
args: ['_formulario']
|
|
@@ -4032,7 +4045,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
4032
4045
|
CommonModule,
|
|
4033
4046
|
FormsModule,
|
|
4034
4047
|
ReactiveFormsModule
|
|
4035
|
-
]
|
|
4048
|
+
],
|
|
4049
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
4036
4050
|
}]
|
|
4037
4051
|
}] });
|
|
4038
4052
|
|
|
@@ -4064,7 +4078,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
4064
4078
|
FormsModule,
|
|
4065
4079
|
ReactiveFormsModule,
|
|
4066
4080
|
TCloudUiDataListModule
|
|
4067
|
-
]
|
|
4081
|
+
],
|
|
4082
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
4068
4083
|
}]
|
|
4069
4084
|
}] });
|
|
4070
4085
|
|
|
@@ -4100,7 +4115,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
4100
4115
|
ReactiveFormsModule,
|
|
4101
4116
|
TCloudUiDatepickerTimeModule,
|
|
4102
4117
|
TCloudUiDatepickerModule
|
|
4103
|
-
]
|
|
4118
|
+
],
|
|
4119
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
4104
4120
|
}]
|
|
4105
4121
|
}] });
|
|
4106
4122
|
|
|
@@ -4315,7 +4331,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
4315
4331
|
],
|
|
4316
4332
|
imports: [
|
|
4317
4333
|
CommonModule
|
|
4318
|
-
]
|
|
4334
|
+
],
|
|
4335
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
4319
4336
|
}]
|
|
4320
4337
|
}] });
|
|
4321
4338
|
|
|
@@ -5050,10 +5067,10 @@ class TCloudUiMultiplesValuesComponent {
|
|
|
5050
5067
|
}
|
|
5051
5068
|
}
|
|
5052
5069
|
TCloudUiMultiplesValuesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiMultiplesValuesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5053
|
-
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"] }] });
|
|
5054
5071
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiMultiplesValuesComponent, decorators: [{
|
|
5055
5072
|
type: Component,
|
|
5056
|
-
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"] }]
|
|
5057
5074
|
}], ctorParameters: function () { return []; }, propDecorators: { listItems: [{
|
|
5058
5075
|
type: Input
|
|
5059
5076
|
}], pattern: [{
|
|
@@ -5101,7 +5118,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
5101
5118
|
FormsModule,
|
|
5102
5119
|
ReactiveFormsModule,
|
|
5103
5120
|
TCloudUiDataListModule
|
|
5104
|
-
]
|
|
5121
|
+
],
|
|
5122
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
5105
5123
|
}]
|
|
5106
5124
|
}] });
|
|
5107
5125
|
|
|
@@ -5155,7 +5173,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
5155
5173
|
],
|
|
5156
5174
|
imports: [
|
|
5157
5175
|
CommonModule
|
|
5158
|
-
]
|
|
5176
|
+
],
|
|
5177
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
5159
5178
|
}]
|
|
5160
5179
|
}] });
|
|
5161
5180
|
|
|
@@ -5318,7 +5337,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
5318
5337
|
],
|
|
5319
5338
|
exports: [
|
|
5320
5339
|
TCloudUiInputPasswordComponent
|
|
5321
|
-
]
|
|
5340
|
+
],
|
|
5341
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
5322
5342
|
}]
|
|
5323
5343
|
}] });
|
|
5324
5344
|
|
|
@@ -5427,7 +5447,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
5427
5447
|
exports: [TCloudUiProgressBarComponent],
|
|
5428
5448
|
imports: [
|
|
5429
5449
|
CommonModule
|
|
5430
|
-
]
|
|
5450
|
+
],
|
|
5451
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
5431
5452
|
}]
|
|
5432
5453
|
}] });
|
|
5433
5454
|
|