sf-crud 13.0.9 → 13.0.11
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/fesm2022/sf-crud.mjs +240 -560
- package/fesm2022/sf-crud.mjs.map +1 -1
- package/lib/components/control/control.component.d.ts +4 -1
- package/lib/components/file-upload/file-upload.component.d.ts +1 -1
- package/lib/components/form/form.component.d.ts +3 -5
- package/lib/components/registro/registro.component.d.ts +1 -1
- package/lib/components/step/step.component.d.ts +1 -1
- package/lib/components/tablero/tablero.component.d.ts +2 -1
- package/lib/shared/models/crud-config.model.d.ts +4 -0
- package/lib/shared/models/shema.model.d.ts +4 -0
- package/package.json +4 -2
- package/public-api.d.ts +0 -1
- package/lib/directives/format-address.pipe.d.ts +0 -7
- package/lib/sf-crud.module.d.ts +0 -95
- package/lib/sf-crud.routing.module.d.ts +0 -7
package/fesm2022/sf-crud.mjs
CHANGED
|
@@ -1,124 +1,72 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, InjectionToken, Optional, Inject, EventEmitter, HostBinding, Output, Input, Component, ViewChild,
|
|
2
|
+
import { Injectable, InjectionToken, Optional, Inject, EventEmitter, HostBinding, Output, Input, Component, ViewChild, ViewChildren, ChangeDetectionStrategy } from '@angular/core';
|
|
3
3
|
import * as _ from 'lodash';
|
|
4
4
|
import * as jsonpath from 'jsonpath';
|
|
5
|
-
import * as
|
|
6
|
-
import {
|
|
7
|
-
import * as
|
|
8
|
-
import {
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
import * as
|
|
12
|
-
import * as i1$2 from 'primeng/api';
|
|
13
|
-
import { MessageService } from 'primeng/api';
|
|
14
|
-
import * as i8 from 'primeng/button';
|
|
5
|
+
import * as i5 from '@angular/common';
|
|
6
|
+
import { CommonModule } from '@angular/common';
|
|
7
|
+
import * as i5$1 from '@angular/forms';
|
|
8
|
+
import { FormsModule } from '@angular/forms';
|
|
9
|
+
import * as i8 from 'primeng/table';
|
|
10
|
+
import { TableModule } from 'primeng/table';
|
|
11
|
+
import * as i10 from 'primeng/button';
|
|
15
12
|
import { ButtonModule } from 'primeng/button';
|
|
16
|
-
import
|
|
13
|
+
import { DropdownModule } from 'primeng/dropdown';
|
|
14
|
+
import * as i11 from 'primeng/inputtext';
|
|
15
|
+
import { InputTextModule } from 'primeng/inputtext';
|
|
16
|
+
import * as i12 from 'primeng/toolbar';
|
|
17
|
+
import { ToolbarModule } from 'primeng/toolbar';
|
|
18
|
+
import * as i18$1 from 'primeng/tooltip';
|
|
19
|
+
import { TooltipModule, Tooltip } from 'primeng/tooltip';
|
|
20
|
+
import * as i11$2 from 'primeng/dialog';
|
|
21
|
+
import { DialogModule } from 'primeng/dialog';
|
|
22
|
+
import * as i13 from 'primeng/card';
|
|
17
23
|
import { CardModule } from 'primeng/card';
|
|
18
|
-
import * as
|
|
19
|
-
import { FormsModule } from '@angular/forms';
|
|
20
|
-
import * as i10 from '@angular/common';
|
|
21
|
-
import * as i11 from 'primeng/iconfield';
|
|
24
|
+
import * as i14 from 'primeng/iconfield';
|
|
22
25
|
import { IconFieldModule } from 'primeng/iconfield';
|
|
23
|
-
import * as
|
|
26
|
+
import * as i15 from 'primeng/inputicon';
|
|
24
27
|
import { InputIconModule } from 'primeng/inputicon';
|
|
25
|
-
import * as
|
|
26
|
-
import {
|
|
27
|
-
import * as
|
|
28
|
+
import * as i16 from 'primeng/select';
|
|
29
|
+
import { SelectModule } from 'primeng/select';
|
|
30
|
+
import * as i17 from 'primeng/multiselect';
|
|
28
31
|
import { MultiSelectModule } from 'primeng/multiselect';
|
|
29
|
-
import * as
|
|
30
|
-
import { RippleModule } from 'primeng/ripple';
|
|
31
|
-
import * as i16 from 'primeng/splitbutton';
|
|
32
|
+
import * as i18 from 'primeng/splitbutton';
|
|
32
33
|
import { SplitButtonModule } from 'primeng/splitbutton';
|
|
33
|
-
import * as i17 from 'primeng/select';
|
|
34
|
-
import { SelectModule } from 'primeng/select';
|
|
35
|
-
import * as i18 from 'primeng/table';
|
|
36
|
-
import { TableModule } from 'primeng/table';
|
|
37
34
|
import * as i19 from 'primeng/tag';
|
|
38
35
|
import { TagModule } from 'primeng/tag';
|
|
39
|
-
import * as
|
|
40
|
-
import
|
|
36
|
+
import * as i1 from '@angular/common/http';
|
|
37
|
+
import * as i2 from '@angular/router';
|
|
38
|
+
import { RouterOutlet } from '@angular/router';
|
|
39
|
+
import { BehaviorSubject, Subject } from 'rxjs';
|
|
40
|
+
import moment from 'moment';
|
|
41
|
+
import * as i1$1 from 'primeng/dynamicdialog';
|
|
42
|
+
import * as i3 from 'primeng/api';
|
|
41
43
|
import Swal from 'sweetalert2';
|
|
42
|
-
import * as
|
|
43
|
-
import {
|
|
44
|
+
import * as i3$1 from 'primeng/steps';
|
|
45
|
+
import { StepsModule } from 'primeng/steps';
|
|
44
46
|
import * as i7$1 from 'sf-simulador';
|
|
45
47
|
import { SfSimuladorModule } from 'sf-simulador';
|
|
46
|
-
import * as
|
|
47
|
-
import { DialogModule } from 'primeng/dialog';
|
|
48
|
-
import * as i13$2 from 'primeng/toast';
|
|
49
|
-
import { ToastModule } from 'primeng/toast';
|
|
50
|
-
import * as i5 from 'primeng/steps';
|
|
51
|
-
import { StepsModule } from 'primeng/steps';
|
|
52
|
-
import * as i17$1 from 'primeng/tooltip';
|
|
53
|
-
import { Tooltip, TooltipModule } from 'primeng/tooltip';
|
|
54
|
-
import * as i3 from '@angular/platform-browser';
|
|
55
|
-
import * as i5$2 from 'sf-ado';
|
|
56
|
-
import { SfAdoModule } from 'sf-ado';
|
|
57
|
-
import * as i9$1 from 'primeng/fluid';
|
|
48
|
+
import * as i6 from 'primeng/fluid';
|
|
58
49
|
import { FluidModule } from 'primeng/fluid';
|
|
59
|
-
import
|
|
50
|
+
import { TextareaModule } from 'primeng/textarea';
|
|
51
|
+
import * as i7 from 'primeng/inputmask';
|
|
52
|
+
import { InputMaskModule } from 'primeng/inputmask';
|
|
53
|
+
import * as i11$1 from 'primeng/autocomplete';
|
|
60
54
|
import { AutoCompleteModule } from 'primeng/autocomplete';
|
|
61
|
-
import * as
|
|
62
|
-
import { CheckboxModule } from 'primeng/checkbox';
|
|
63
|
-
import * as i8$2 from 'primeng/datepicker';
|
|
55
|
+
import * as i13$1 from 'primeng/datepicker';
|
|
64
56
|
import { DatePickerModule } from 'primeng/datepicker';
|
|
65
|
-
import * as
|
|
66
|
-
import { InputMaskModule } from 'primeng/inputmask';
|
|
67
|
-
import * as i12$1 from 'primeng/inputnumber';
|
|
57
|
+
import * as i14$1 from 'primeng/inputnumber';
|
|
68
58
|
import { InputNumberModule } from 'primeng/inputnumber';
|
|
69
|
-
import * as
|
|
59
|
+
import * as i15$1 from 'primeng/inputswitch';
|
|
70
60
|
import { InputSwitchModule } from 'primeng/inputswitch';
|
|
71
|
-
import
|
|
72
|
-
import {
|
|
73
|
-
import
|
|
74
|
-
import { BadgeModule } from 'primeng/badge';
|
|
75
|
-
import { BlockUIModule } from 'primeng/blockui';
|
|
76
|
-
import { BreadcrumbModule } from 'primeng/breadcrumb';
|
|
77
|
-
import { CalendarModule } from 'primeng/calendar';
|
|
78
|
-
import { CarouselModule } from 'primeng/carousel';
|
|
79
|
-
import { CascadeSelectModule } from 'primeng/cascadeselect';
|
|
80
|
-
import { ChipModule } from 'primeng/chip';
|
|
81
|
-
import { ColorPickerModule } from 'primeng/colorpicker';
|
|
82
|
-
import { ConfirmDialogModule } from 'primeng/confirmdialog';
|
|
83
|
-
import { ConfirmPopupModule } from 'primeng/confirmpopup';
|
|
84
|
-
import { ContextMenuModule } from 'primeng/contextmenu';
|
|
85
|
-
import { DividerModule } from 'primeng/divider';
|
|
86
|
-
import { DropdownModule } from 'primeng/dropdown';
|
|
87
|
-
import { FieldsetModule } from 'primeng/fieldset';
|
|
88
|
-
import { FileUploadModule } from 'primeng/fileupload';
|
|
89
|
-
import { GalleriaModule } from 'primeng/galleria';
|
|
90
|
-
import { InplaceModule } from 'primeng/inplace';
|
|
91
|
-
import { TextareaModule } from 'primeng/textarea';
|
|
92
|
-
import { KnobModule } from 'primeng/knob';
|
|
93
|
-
import { ListboxModule } from 'primeng/listbox';
|
|
94
|
-
import { MegaMenuModule } from 'primeng/megamenu';
|
|
95
|
-
import { MenubarModule } from 'primeng/menubar';
|
|
96
|
-
import { MenuModule } from 'primeng/menu';
|
|
97
|
-
import { MessageModule } from 'primeng/message';
|
|
98
|
-
import { OrganizationChartModule } from 'primeng/organizationchart';
|
|
99
|
-
import { OverlayPanelModule } from 'primeng/overlaypanel';
|
|
100
|
-
import { PanelMenuModule } from 'primeng/panelmenu';
|
|
101
|
-
import { PanelModule } from 'primeng/panel';
|
|
102
|
-
import { PasswordModule } from 'primeng/password';
|
|
103
|
-
import { ProgressBarModule } from 'primeng/progressbar';
|
|
104
|
-
import { RadioButtonModule } from 'primeng/radiobutton';
|
|
105
|
-
import { RatingModule } from 'primeng/rating';
|
|
106
|
-
import { ScrollPanelModule } from 'primeng/scrollpanel';
|
|
107
|
-
import { ScrollTopModule } from 'primeng/scrolltop';
|
|
108
|
-
import { SelectButtonModule } from 'primeng/selectbutton';
|
|
109
|
-
import { SidebarModule } from 'primeng/sidebar';
|
|
110
|
-
import { SkeletonModule } from 'primeng/skeleton';
|
|
111
|
-
import { SliderModule } from 'primeng/slider';
|
|
112
|
-
import { SplitterModule } from 'primeng/splitter';
|
|
113
|
-
import { TabMenuModule } from 'primeng/tabmenu';
|
|
114
|
-
import { TabViewModule } from 'primeng/tabview';
|
|
115
|
-
import { TerminalModule } from 'primeng/terminal';
|
|
116
|
-
import { TieredMenuModule } from 'primeng/tieredmenu';
|
|
117
|
-
import { TimelineModule } from 'primeng/timeline';
|
|
118
|
-
import { ToggleButtonModule } from 'primeng/togglebutton';
|
|
119
|
-
import { TreeModule } from 'primeng/tree';
|
|
61
|
+
import * as i16$1 from 'primeng/checkbox';
|
|
62
|
+
import { CheckboxModule } from 'primeng/checkbox';
|
|
63
|
+
import * as i17$1 from 'primeng/inputgroup';
|
|
120
64
|
import { InputGroupModule } from 'primeng/inputgroup';
|
|
121
65
|
import { InputGroupAddonModule } from 'primeng/inputgroupaddon';
|
|
66
|
+
import * as i6$1 from 'sf-pdfsign';
|
|
67
|
+
import { SfPdfsignModule } from 'sf-pdfsign';
|
|
68
|
+
import * as i2$1 from '@angular/platform-browser';
|
|
69
|
+
import * as i4 from 'sf-ado';
|
|
122
70
|
|
|
123
71
|
class CrudConfig {
|
|
124
72
|
idEntidad = '';
|
|
@@ -136,6 +84,9 @@ class ConfigTablero {
|
|
|
136
84
|
keys = [];
|
|
137
85
|
createButton;
|
|
138
86
|
dialog;
|
|
87
|
+
dataKey;
|
|
88
|
+
selectionMode;
|
|
89
|
+
redirect;
|
|
139
90
|
}
|
|
140
91
|
class ConfigRegistro {
|
|
141
92
|
operations = [];
|
|
@@ -145,6 +96,7 @@ class ConfigRegistro {
|
|
|
145
96
|
constructionId;
|
|
146
97
|
keys;
|
|
147
98
|
conditions = [];
|
|
99
|
+
backWhenSubmit = false;
|
|
148
100
|
}
|
|
149
101
|
class Operation {
|
|
150
102
|
type;
|
|
@@ -1201,6 +1153,9 @@ class TableroComponent {
|
|
|
1201
1153
|
this.crudConfig.tablero.columns.forEach(col => {
|
|
1202
1154
|
newItem[col.col] = this.getValue(col.col, item);
|
|
1203
1155
|
});
|
|
1156
|
+
if (this.crudConfig.tablero?.dataKey && !newItem[this.crudConfig.tablero.dataKey]) {
|
|
1157
|
+
newItem[this.crudConfig.tablero.dataKey] = item[this.crudConfig.tablero.dataKey];
|
|
1158
|
+
}
|
|
1204
1159
|
this.data.push(newItem);
|
|
1205
1160
|
});
|
|
1206
1161
|
}
|
|
@@ -1306,12 +1261,18 @@ class TableroComponent {
|
|
|
1306
1261
|
this.redirect('create');
|
|
1307
1262
|
}
|
|
1308
1263
|
}
|
|
1264
|
+
goToDetail(row) {
|
|
1265
|
+
if (this.crudConfig.tablero?.redirect) {
|
|
1266
|
+
this.router.navigateByUrl(this.aplyKeys(this.crudConfig.tablero.keys, this.crudConfig.tablero.redirect, row.data));
|
|
1267
|
+
}
|
|
1268
|
+
}
|
|
1309
1269
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TableroComponent, deps: [{ token: GeneralService }, { token: i2.Router }, { token: SfCrudService }, { token: StepService }, { token: CrudDialogService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1310
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TableroComponent, isStandalone: false, selector: "sf-crudtablero", inputs: { opciones: "opciones", idEntidad: "idEntidad", idKatios: "idKatios", environment: "environment", user: "user", dataExt: "dataExt", showCreateButton: "showCreateButton" }, outputs: { onSelectAction: "onSelectAction" }, host: { properties: { "style.--secondary-color": "this.color2", "style.--button-color": "this.colorButtons" } }, usesOnChanges: true, ngImport: i0, template: "<p-card>\r\n <p-toolbar styleClass=\"mb-4 gap-2\" *ngIf=\"btn.create\">\r\n <ng-template #start>\r\n <button pButton pRipple [label]=\"btn.create.label\" [icon]=\"btn.create.icon\"\r\n class=\"p-button-success mr-2\" (click)=\"showAddDialog()\"></button>\r\n </ng-template>\r\n </p-toolbar>\r\n <p-table *ngIf=\"crudConfig?.tablero?.columns\" #dt [columns]=\"crudConfig.tablero.columns\" [value]=\"data\" [rowHover]=\"true\" [rows]=\"10\" [paginator]=\"true\"\r\n [totalRecords]=\"data.length\" [globalFilterFields]=\"crudConfig.tablero?.filters || []\" [tableStyle]=\"{'min-width': '75rem'}\"\r\n currentPageReportTemplate=\"Registro {first} al {last} de {totalRecords}\" [showCurrentPageReport]=\"true\">\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n <h5 class=\"m-0\">{{crudConfig.tablero?.label || idEntidad}}</h5>\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-search\" />\r\n <input pInputText type=\"text\" (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\r\n placeholder=\"Buscar...\" />\r\n </p-iconfield>\r\n <!-- <span class=\"p-input-icon-left\">\r\n <i class=\"pi pi-search\"></i>\r\n <input pInputText type=\"text\" (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\r\n placeholder=\"Buscar...\" />\r\n </span> -->\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr>\r\n <th *ngFor=\"let col of columns\">\r\n <div class=\"flex align-items-center justify-between\">\r\n {{col.label}}\r\n <ng-container *ngIf=\"col.filter\" [ngSwitch] = \"col.filter.type\">\r\n <p-columnFilter *ngSwitchCase=\"'text'\" type=\"text\" [field]=\"col.filter.field\" [display]=\"col.filter.display\" [showMatchModes]=\"col.filter.showMatchModes || false\" [showOperator]=\"col.filter.showOperator || false\" [showAddButton]=\"col.filter.showAddButton || false\"/>\r\n <p-columnFilter *ngSwitchCase=\"'list'\" [field]=\"col.filter.field\" [display]=\"col.filter.display\" [matchMode]=\"col.filter.matchMode || 'equals'\"\r\n [showMatchModes]=\"col.filter.showMatchModes || false\" [showOperator]=\"col.filter.showOperator || false\" [showAddButton]=\"col.filter.showAddButton || false\">\r\n <ng-template #filter let-value let-filter=\"filterCallback\">\r\n <p-select [(ngModel)]=\"value\" [options]=\"optionsMap.get(col.col) ?? []\" (onChange)=\"filter($event.value)\" placeholder=\"Seleccione\" class=\"w-full\" \r\n [optionLabel]=\"col.filter?.config?.optionLabel\" [optionValue]=\"col.filter?.config?.optionValue\"/>\r\n </ng-template>\r\n </p-columnFilter>\r\n <p-columnFilter *ngSwitchCase=\"'multiselect'\" [field]=\"col.filter.field\" [display]=\"col.filter.display\" [matchMode]=\"col.filter.matchMode || 'equals'\"\r\n [showMatchModes]=\"col.filter.showMatchModes || false\" [showOperator]=\"col.filter.showOperator || false\" [showAddButton]=\"col.filter.showAddButton || false\">\r\n <ng-template #filter let-value let-filter=\"filterCallback\">\r\n <p-multiselect [(ngModel)]=\"value\" [options]=\"optionsMap.get(col.col) ?? []\" (onChange)=\"filter($event.value)\" placeholder=\"Seleccione\" class=\"w-full\" \r\n [optionLabel]=\"col.filter?.config?.optionLabel\" [optionValue]=\"col.filter?.config?.optionValue\" [panelStyle]=\"{ minWidth: '16rem' }\">\r\n </p-multiselect>\r\n </ng-template>\r\n </p-columnFilter>\r\n </ng-container>\r\n </div>\r\n </th>\r\n <th>Acci\u00F3n</th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-index=\"rowIndex\">\r\n <tr>\r\n <ng-container *ngFor=\"let col of columns\" [ngSwitch]=\"col.type\">\r\n <td *ngSwitchCase=\"'text'\">{{rowData[col.col]}}</td>\r\n <td *ngSwitchCase=\"'date:yyyy-mm-dd'\">{{rowData[col.col] | date: 'yyyy-MM-dd'}}</td>\r\n <td *ngSwitchCase=\"'currency:USD'\">{{rowData[col.col] | currency: 'USD'}}</td>\r\n <td *ngSwitchCase=\"'tag'\">\r\n <p-tag [value]=\"rowData[col.col]\" [ngClass]=\"rowData[col.col] ? (col.class || '') : 'hidden'\" />\r\n </td>\r\n </ng-container>\r\n <td>\r\n <p-splitButton *ngIf=\"items.length > 1\" icon=\"pi pi-align-justify\" [model]=\"items\" appendTo=\"body\"\r\n (onDropdownClick)=\"itemSelected = rowData\"></p-splitButton>\r\n <div *ngIf=\"items.length <= 1\">\r\n <button *ngFor=\"let item of items\" pButton pRipple [icon]=\"item.icon\" class=\"mr-2\"\r\n (click)=\"itemSelected = initialData[index]; item.command()\"></button>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n</p-card>\r\n", styles: ["::ng-deep .p-datatable table{min-width:100%}button:not(.p-button-success){background:var(--secondary-color)!important;border:var(--secondary-color)!important;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i8.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i8$1.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i10.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i10.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i11.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["iconPosition", "styleClass"] }, { kind: "component", type: i12.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["styleClass"] }, { kind: "directive", type: i13.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "component", type: i14.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i15.Ripple, selector: "[pRipple]" }, { kind: "component", type: i16.SplitButton, selector: "p-splitbutton, p-splitButton, p-split-button", inputs: ["model", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "icon", "iconPos", "label", "tooltip", "tooltipOptions", "style", "styleClass", "menuStyle", "menuStyleClass", "dropdownIcon", "appendTo", "dir", "expandAriaLabel", "showTransitionOptions", "hideTransitionOptions", "buttonProps", "menuButtonProps", "autofocus", "disabled", "tabindex", "menuButtonDisabled", "buttonDisabled"], outputs: ["onClick", "onMenuHide", "onMenuShow", "onDropdownClick"] }, { kind: "component", type: i17.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i18.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i18.ColumnFilter, selector: "p-columnFilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping", "showButtons", "ariaLabel", "filterButtonProps"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i19.Tag, selector: "p-tag", inputs: ["style", "styleClass", "severity", "value", "icon", "rounded"] }, { kind: "component", type: i20.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }, { kind: "pipe", type: i10.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i10.DatePipe, name: "date" }] });
|
|
1270
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TableroComponent, isStandalone: true, selector: "sf-crudtablero", inputs: { opciones: "opciones", idEntidad: "idEntidad", idKatios: "idKatios", environment: "environment", user: "user", dataExt: "dataExt", showCreateButton: "showCreateButton" }, outputs: { onSelectAction: "onSelectAction" }, host: { properties: { "style.--secondary-color": "this.color2", "style.--button-color": "this.colorButtons" } }, usesOnChanges: true, ngImport: i0, template: "<p-card>\r\n <p-toolbar styleClass=\"mb-4 gap-2\" *ngIf=\"btn.create\">\r\n <ng-template #start>\r\n <button pButton pRipple [label]=\"btn.create.label\" [icon]=\"btn.create.icon\"\r\n class=\"p-button-success mr-2\" (click)=\"showAddDialog()\"></button>\r\n </ng-template>\r\n </p-toolbar>\r\n <p-table *ngIf=\"crudConfig?.tablero?.columns\" #dt [columns]=\"crudConfig.tablero.columns\" [value]=\"data\" [rowHover]=\"true\" [rows]=\"10\" [paginator]=\"true\"\r\n [totalRecords]=\"data.length\" [globalFilterFields]=\"crudConfig.tablero?.filters || []\" [tableStyle]=\"{'min-width': '75rem'}\"\r\n currentPageReportTemplate=\"Registro {first} al {last} de {totalRecords}\" [showCurrentPageReport]=\"true\" [selectionMode]=\"crudConfig.tablero?.selectionMode || null\"\r\n [(selection)]=\"itemSelected\" [dataKey]=\"crudConfig.tablero?.dataKey\" (onRowSelect)=\"goToDetail($event)\">\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n <h5 class=\"m-0\">{{crudConfig.tablero?.label || idEntidad}}</h5>\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-search\" />\r\n <input pInputText type=\"text\" (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\r\n placeholder=\"Buscar...\" />\r\n </p-iconfield>\r\n <!-- <span class=\"p-input-icon-left\">\r\n <i class=\"pi pi-search\"></i>\r\n <input pInputText type=\"text\" (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\r\n placeholder=\"Buscar...\" />\r\n </span> -->\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr>\r\n <th *ngFor=\"let col of columns\">\r\n <div class=\"flex align-items-center justify-between\">\r\n {{col.label}}\r\n <ng-container *ngIf=\"col.filter\" [ngSwitch] = \"col.filter.type\">\r\n <p-columnFilter *ngSwitchCase=\"'text'\" type=\"text\" [field]=\"col.filter.field\" [display]=\"col.filter.display\" [showMatchModes]=\"col.filter.showMatchModes || false\" [showOperator]=\"col.filter.showOperator || false\" [showAddButton]=\"col.filter.showAddButton || false\"/>\r\n <p-columnFilter *ngSwitchCase=\"'list'\" [field]=\"col.filter.field\" [display]=\"col.filter.display\" [matchMode]=\"col.filter.matchMode || 'equals'\"\r\n [showMatchModes]=\"col.filter.showMatchModes || false\" [showOperator]=\"col.filter.showOperator || false\" [showAddButton]=\"col.filter.showAddButton || false\">\r\n <ng-template #filter let-value let-filter=\"filterCallback\">\r\n <p-select [(ngModel)]=\"value\" [options]=\"optionsMap.get(col.col) ?? []\" (onChange)=\"filter($event.value)\" placeholder=\"Seleccione\" class=\"w-full\" \r\n [optionLabel]=\"col.filter?.config?.optionLabel\" [optionValue]=\"col.filter?.config?.optionValue\"/>\r\n </ng-template>\r\n </p-columnFilter>\r\n <p-columnFilter *ngSwitchCase=\"'multiselect'\" [field]=\"col.filter.field\" [display]=\"col.filter.display\" [matchMode]=\"col.filter.matchMode || 'equals'\"\r\n [showMatchModes]=\"col.filter.showMatchModes || false\" [showOperator]=\"col.filter.showOperator || false\" [showAddButton]=\"col.filter.showAddButton || false\">\r\n <ng-template #filter let-value let-filter=\"filterCallback\">\r\n <p-multiselect [(ngModel)]=\"value\" [options]=\"optionsMap.get(col.col) ?? []\" (onChange)=\"filter($event.value)\" placeholder=\"Seleccione\" class=\"w-full\" \r\n [optionLabel]=\"col.filter?.config?.optionLabel\" [optionValue]=\"col.filter?.config?.optionValue\" [panelStyle]=\"{ minWidth: '16rem' }\">\r\n </p-multiselect>\r\n </ng-template>\r\n </p-columnFilter>\r\n </ng-container>\r\n </div>\r\n </th>\r\n <th>Acci\u00F3n</th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-index=\"rowIndex\">\r\n <tr [pSelectableRow]=\"rowData\">\r\n <ng-container *ngFor=\"let col of columns\" [ngSwitch]=\"col.type\">\r\n <td *ngSwitchCase=\"'text'\">{{rowData[col.col]}}</td>\r\n <td *ngSwitchCase=\"'date:yyyy-mm-dd'\">{{rowData[col.col] | date: 'yyyy-MM-dd'}}</td>\r\n <td *ngSwitchCase=\"'currency:USD'\">{{rowData[col.col] | currency: 'USD'}}</td>\r\n <td *ngSwitchCase=\"'tag'\">\r\n <p-tag [value]=\"rowData[col.col]\" [ngClass]=\"rowData[col.col] ? (col.class || '') : 'hidden'\" />\r\n </td>\r\n </ng-container>\r\n <td>\r\n <p-splitButton *ngIf=\"items.length > 1\" icon=\"pi pi-align-justify\" [model]=\"items\" appendTo=\"body\"\r\n (onDropdownClick)=\"itemSelected = rowData\"></p-splitButton>\r\n <div *ngIf=\"items.length <= 1\">\r\n <button *ngFor=\"let item of items\" pButton pRipple [icon]=\"item.icon\" class=\"mr-2\"\r\n (click)=\"itemSelected = initialData[index]; item.command()\"></button>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n</p-card>\r\n", styles: ["::ng-deep .p-datatable table{min-width:100%}button:not(.p-button-success){background:var(--secondary-color)!important;border:var(--secondary-color)!important;color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: i5.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i5.DatePipe, name: "date" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i8.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i8.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "component", type: i8.ColumnFilter, selector: "p-columnFilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping", "showButtons", "ariaLabel", "filterButtonProps"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i10.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i11.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i12.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i13.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i14.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i15.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["styleClass"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i16.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i17.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "ngmodule", type: SplitButtonModule }, { kind: "component", type: i18.SplitButton, selector: "p-splitbutton, p-splitButton, p-split-button", inputs: ["model", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "icon", "iconPos", "label", "tooltip", "tooltipOptions", "style", "styleClass", "menuStyle", "menuStyleClass", "dropdownIcon", "appendTo", "dir", "expandAriaLabel", "showTransitionOptions", "hideTransitionOptions", "buttonProps", "menuButtonProps", "autofocus", "disabled", "tabindex", "menuButtonDisabled", "buttonDisabled"], outputs: ["onClick", "onMenuHide", "onMenuShow", "onDropdownClick"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i19.Tag, selector: "p-tag", inputs: ["style", "styleClass", "severity", "value", "icon", "rounded"] }] });
|
|
1311
1271
|
}
|
|
1312
1272
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TableroComponent, decorators: [{
|
|
1313
1273
|
type: Component,
|
|
1314
|
-
args: [{ selector: 'sf-crudtablero',
|
|
1274
|
+
args: [{ selector: 'sf-crudtablero', imports: [CommonModule, FormsModule, TableModule, ButtonModule, DropdownModule, InputTextModule, ToolbarModule, TooltipModule, DialogModule, CardModule, IconFieldModule, InputIconModule,
|
|
1275
|
+
SelectModule, MultiSelectModule, SplitButtonModule, TagModule], standalone: true, template: "<p-card>\r\n <p-toolbar styleClass=\"mb-4 gap-2\" *ngIf=\"btn.create\">\r\n <ng-template #start>\r\n <button pButton pRipple [label]=\"btn.create.label\" [icon]=\"btn.create.icon\"\r\n class=\"p-button-success mr-2\" (click)=\"showAddDialog()\"></button>\r\n </ng-template>\r\n </p-toolbar>\r\n <p-table *ngIf=\"crudConfig?.tablero?.columns\" #dt [columns]=\"crudConfig.tablero.columns\" [value]=\"data\" [rowHover]=\"true\" [rows]=\"10\" [paginator]=\"true\"\r\n [totalRecords]=\"data.length\" [globalFilterFields]=\"crudConfig.tablero?.filters || []\" [tableStyle]=\"{'min-width': '75rem'}\"\r\n currentPageReportTemplate=\"Registro {first} al {last} de {totalRecords}\" [showCurrentPageReport]=\"true\" [selectionMode]=\"crudConfig.tablero?.selectionMode || null\"\r\n [(selection)]=\"itemSelected\" [dataKey]=\"crudConfig.tablero?.dataKey\" (onRowSelect)=\"goToDetail($event)\">\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n <h5 class=\"m-0\">{{crudConfig.tablero?.label || idEntidad}}</h5>\r\n <p-iconfield>\r\n <p-inputicon class=\"pi pi-search\" />\r\n <input pInputText type=\"text\" (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\r\n placeholder=\"Buscar...\" />\r\n </p-iconfield>\r\n <!-- <span class=\"p-input-icon-left\">\r\n <i class=\"pi pi-search\"></i>\r\n <input pInputText type=\"text\" (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\r\n placeholder=\"Buscar...\" />\r\n </span> -->\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr>\r\n <th *ngFor=\"let col of columns\">\r\n <div class=\"flex align-items-center justify-between\">\r\n {{col.label}}\r\n <ng-container *ngIf=\"col.filter\" [ngSwitch] = \"col.filter.type\">\r\n <p-columnFilter *ngSwitchCase=\"'text'\" type=\"text\" [field]=\"col.filter.field\" [display]=\"col.filter.display\" [showMatchModes]=\"col.filter.showMatchModes || false\" [showOperator]=\"col.filter.showOperator || false\" [showAddButton]=\"col.filter.showAddButton || false\"/>\r\n <p-columnFilter *ngSwitchCase=\"'list'\" [field]=\"col.filter.field\" [display]=\"col.filter.display\" [matchMode]=\"col.filter.matchMode || 'equals'\"\r\n [showMatchModes]=\"col.filter.showMatchModes || false\" [showOperator]=\"col.filter.showOperator || false\" [showAddButton]=\"col.filter.showAddButton || false\">\r\n <ng-template #filter let-value let-filter=\"filterCallback\">\r\n <p-select [(ngModel)]=\"value\" [options]=\"optionsMap.get(col.col) ?? []\" (onChange)=\"filter($event.value)\" placeholder=\"Seleccione\" class=\"w-full\" \r\n [optionLabel]=\"col.filter?.config?.optionLabel\" [optionValue]=\"col.filter?.config?.optionValue\"/>\r\n </ng-template>\r\n </p-columnFilter>\r\n <p-columnFilter *ngSwitchCase=\"'multiselect'\" [field]=\"col.filter.field\" [display]=\"col.filter.display\" [matchMode]=\"col.filter.matchMode || 'equals'\"\r\n [showMatchModes]=\"col.filter.showMatchModes || false\" [showOperator]=\"col.filter.showOperator || false\" [showAddButton]=\"col.filter.showAddButton || false\">\r\n <ng-template #filter let-value let-filter=\"filterCallback\">\r\n <p-multiselect [(ngModel)]=\"value\" [options]=\"optionsMap.get(col.col) ?? []\" (onChange)=\"filter($event.value)\" placeholder=\"Seleccione\" class=\"w-full\" \r\n [optionLabel]=\"col.filter?.config?.optionLabel\" [optionValue]=\"col.filter?.config?.optionValue\" [panelStyle]=\"{ minWidth: '16rem' }\">\r\n </p-multiselect>\r\n </ng-template>\r\n </p-columnFilter>\r\n </ng-container>\r\n </div>\r\n </th>\r\n <th>Acci\u00F3n</th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-index=\"rowIndex\">\r\n <tr [pSelectableRow]=\"rowData\">\r\n <ng-container *ngFor=\"let col of columns\" [ngSwitch]=\"col.type\">\r\n <td *ngSwitchCase=\"'text'\">{{rowData[col.col]}}</td>\r\n <td *ngSwitchCase=\"'date:yyyy-mm-dd'\">{{rowData[col.col] | date: 'yyyy-MM-dd'}}</td>\r\n <td *ngSwitchCase=\"'currency:USD'\">{{rowData[col.col] | currency: 'USD'}}</td>\r\n <td *ngSwitchCase=\"'tag'\">\r\n <p-tag [value]=\"rowData[col.col]\" [ngClass]=\"rowData[col.col] ? (col.class || '') : 'hidden'\" />\r\n </td>\r\n </ng-container>\r\n <td>\r\n <p-splitButton *ngIf=\"items.length > 1\" icon=\"pi pi-align-justify\" [model]=\"items\" appendTo=\"body\"\r\n (onDropdownClick)=\"itemSelected = rowData\"></p-splitButton>\r\n <div *ngIf=\"items.length <= 1\">\r\n <button *ngFor=\"let item of items\" pButton pRipple [icon]=\"item.icon\" class=\"mr-2\"\r\n (click)=\"itemSelected = initialData[index]; item.command()\"></button>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n</p-card>\r\n", styles: ["::ng-deep .p-datatable table{min-width:100%}button:not(.p-button-success){background:var(--secondary-color)!important;border:var(--secondary-color)!important;color:#fff}\n"] }]
|
|
1315
1276
|
}], ctorParameters: () => [{ type: GeneralService }, { type: i2.Router }, { type: SfCrudService }, { type: StepService }, { type: CrudDialogService }], propDecorators: { opciones: [{
|
|
1316
1277
|
type: Input
|
|
1317
1278
|
}], idEntidad: [{
|
|
@@ -1336,119 +1297,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
1336
1297
|
args: ["style.--button-color"]
|
|
1337
1298
|
}] } });
|
|
1338
1299
|
|
|
1339
|
-
class NotificationService {
|
|
1340
|
-
sfCrudService;
|
|
1341
|
-
_notificationAdded = new BehaviorSubject(undefined);
|
|
1342
|
-
constructor(sfCrudService) {
|
|
1343
|
-
this.sfCrudService = sfCrudService;
|
|
1344
|
-
}
|
|
1345
|
-
addNotification(msg, requestChecking) {
|
|
1346
|
-
this._notificationAdded.next({ msg, requestChecking });
|
|
1347
|
-
}
|
|
1348
|
-
notificationAdded$() {
|
|
1349
|
-
return this._notificationAdded.asObservable();
|
|
1350
|
-
}
|
|
1351
|
-
/**
|
|
1352
|
-
* Generates message using answerchecking
|
|
1353
|
-
* @param currentMsg Default message: Message | SweetAlertOptions
|
|
1354
|
-
* @param rta Resquest's response
|
|
1355
|
-
* @param answerChecking
|
|
1356
|
-
*/
|
|
1357
|
-
generateMessage(currentMsg, rta, requestChecking) {
|
|
1358
|
-
if (requestChecking) {
|
|
1359
|
-
if (requestChecking.statics)
|
|
1360
|
-
Object.assign(currentMsg, requestChecking.statics);
|
|
1361
|
-
//mapear los dinamicos
|
|
1362
|
-
if (requestChecking.dynamics) {
|
|
1363
|
-
const dynamics = requestChecking.dynamics;
|
|
1364
|
-
try {
|
|
1365
|
-
if (dynamics && typeof (rta) == "string")
|
|
1366
|
-
rta = JSON.parse(rta);
|
|
1367
|
-
if (requestChecking.parse) {
|
|
1368
|
-
let valueParsed = JSON.parse(jsonpath.query(rta, requestChecking.parse)[0]);
|
|
1369
|
-
jsonpath.value(rta, requestChecking.parse, valueParsed);
|
|
1370
|
-
}
|
|
1371
|
-
if (dynamics) {
|
|
1372
|
-
for (const property in dynamics) {
|
|
1373
|
-
let errors = jsonpath.query(rta, dynamics[property])[0];
|
|
1374
|
-
if (typeof (errors) === "object" && errors != null)
|
|
1375
|
-
errors = this.concatenateErrors(errors);
|
|
1376
|
-
currentMsg[property] = errors;
|
|
1377
|
-
}
|
|
1378
|
-
}
|
|
1379
|
-
}
|
|
1380
|
-
catch (error) { //es una respuesta sin JSON
|
|
1381
|
-
if (dynamics)
|
|
1382
|
-
currentMsg.detail = rta;
|
|
1383
|
-
}
|
|
1384
|
-
}
|
|
1385
|
-
}
|
|
1386
|
-
return currentMsg;
|
|
1387
|
-
}
|
|
1388
|
-
/**
|
|
1389
|
-
* Concatena todos los errores de un objeto de errores del backend
|
|
1390
|
-
* @param errors Objeto de errores recibido del backend
|
|
1391
|
-
* @param separator Separador entre errores (por defecto '\n')
|
|
1392
|
-
* @returns String con todos los errores concatenados
|
|
1393
|
-
*/
|
|
1394
|
-
concatenateErrors(errors, separator = '\n') {
|
|
1395
|
-
if (!errors || typeof errors !== 'object') {
|
|
1396
|
-
return '';
|
|
1397
|
-
}
|
|
1398
|
-
const errorMessages = [];
|
|
1399
|
-
Object.keys(errors).forEach(field => {
|
|
1400
|
-
const fieldErrors = errors[field];
|
|
1401
|
-
if (Array.isArray(fieldErrors)) {
|
|
1402
|
-
fieldErrors.forEach(errorMsg => {
|
|
1403
|
-
errorMessages.push(errorMsg);
|
|
1404
|
-
});
|
|
1405
|
-
}
|
|
1406
|
-
else if (typeof fieldErrors === 'string') {
|
|
1407
|
-
errorMessages.push(fieldErrors);
|
|
1408
|
-
}
|
|
1409
|
-
else if (typeof fieldErrors === 'object') {
|
|
1410
|
-
const nestedErrors = this.concatenateErrors(fieldErrors, separator);
|
|
1411
|
-
if (nestedErrors) {
|
|
1412
|
-
errorMessages.push(nestedErrors);
|
|
1413
|
-
}
|
|
1414
|
-
}
|
|
1415
|
-
});
|
|
1416
|
-
return errorMessages.join(separator);
|
|
1417
|
-
}
|
|
1418
|
-
genDefaultMessage(severity, title, detail, requestChecking) {
|
|
1419
|
-
let obj = { title, text: detail, icon: severity,
|
|
1420
|
-
confirmButtonColor: this.sfCrudService.configEmpresa?.colors ? this.sfCrudService.configEmpresa?.colors?.button : "#3085d6",
|
|
1421
|
-
cancelButtonColor: this.sfCrudService.configEmpresa?.colors ? this.sfCrudService.configEmpresa?.colors?.button : "#d33" };
|
|
1422
|
-
if (requestChecking && requestChecking.useSwal && severity == "error") {
|
|
1423
|
-
obj.showCancelButton = true;
|
|
1424
|
-
obj.confirmButtonText = '<i class="pi pi-check"></i> Continuar';
|
|
1425
|
-
obj.cancelButtonText = '<i class="pi pi-times"></i> Terminar';
|
|
1426
|
-
}
|
|
1427
|
-
if (!requestChecking || !requestChecking.useSwal) {
|
|
1428
|
-
obj.severity = severity;
|
|
1429
|
-
obj.summary = title;
|
|
1430
|
-
obj.detail = detail;
|
|
1431
|
-
}
|
|
1432
|
-
return obj;
|
|
1433
|
-
}
|
|
1434
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NotificationService, deps: [{ token: SfCrudService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1435
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NotificationService, providedIn: 'root' });
|
|
1436
|
-
}
|
|
1437
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NotificationService, decorators: [{
|
|
1438
|
-
type: Injectable,
|
|
1439
|
-
args: [{
|
|
1440
|
-
providedIn: 'root'
|
|
1441
|
-
}]
|
|
1442
|
-
}], ctorParameters: () => [{ type: SfCrudService }] });
|
|
1443
|
-
class Notification {
|
|
1444
|
-
msg;
|
|
1445
|
-
requestChecking;
|
|
1446
|
-
constructor(msg, requestChecking) {
|
|
1447
|
-
this.msg = msg;
|
|
1448
|
-
this.requestChecking = requestChecking;
|
|
1449
|
-
}
|
|
1450
|
-
}
|
|
1451
|
-
|
|
1452
1300
|
class StepComponent {
|
|
1453
1301
|
router;
|
|
1454
1302
|
stepService;
|
|
@@ -1512,11 +1360,11 @@ class StepComponent {
|
|
|
1512
1360
|
}
|
|
1513
1361
|
}
|
|
1514
1362
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: StepComponent, deps: [{ token: i2.Router }, { token: StepService }, { token: i2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
|
|
1515
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: StepComponent, isStandalone:
|
|
1363
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: StepComponent, isStandalone: true, selector: "app-step", inputs: { items: "items" }, ngImport: i0, template: "<div>\r\n <div id=\"step-container\">\r\n <p-steps #stepsComponent [model]=\"items\" [readonly]=\"false\" [activeIndex]=\"activeIndex\" (activeIndexChange)=\"onactiveIndexChange($event)\"></p-steps>\r\n </div>\r\n\r\n <div class=\"content\">\r\n <router-outlet></router-outlet>\r\n </div>\r\n <div class=\"buttons-step\">\r\n <div >\r\n <button pButton *ngIf=\"activeIndex != 0\" icon=\"pi pi-arrow-left\" [disabled]=\"loading\"\r\n (click)=\"requestNaviagtion(-1)\"></button>\r\n </div>\r\n <span >\r\n <button pButton *ngIf=\"!(activeIndex + 1 >= items.length)\" icon=\"pi pi-arrow-right\" [disabled]=\"loading\"\r\n (click)=\"requestNaviagtion(1)\"></button>\r\n </span>\r\n <button pButton *ngIf=\"activeIndex >= items.length - 1\" label=\"Finalizar\" [disabled]=\"loading\" (click)=\"requestNaviagtion(0)\"\r\n [style]=\"{'margin-left': '10px'}\"></button>\r\n </div>\r\n</div>\r\n", styles: ["::ng-deep .p-steps-number{background-color:var(--secondary-color)!important}::ng-deep .p-button{border-radius:6px}::ng-deep .p-steps-item .p-menuitem-link{margin-inline:15vw}::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-number{color:#fff;font-family:sans-serif}::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-title{color:#4b5563;font-family:inherit}::ng-deep{& ul[role=tablist]{padding-bottom:10px}.p-steps-number{color:#fff!important}}.buttons-step{margin-bottom:1.5rem}.buttons-step button{height:3.5rem}.buttons-step ::ng-deep .p-button{background-color:var(--button-color);border-color:var(--button-color)}.buttons-step .p-button-icon-only{width:3.5rem}#step-container{overflow-x:scroll;scrollbar-width:20px;padding-bottom:5px}.buttons-step{display:flex;justify-content:space-evenly}.content{margin-block:30px}@media screen and (max-width: 765px){::ng-deep{.p-steps-title{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;width:inherit;text-align:center}}::ng-deep .p-steps-item a.p-menuitem-link{margin-inline:0!important;width:90vw}}\n"], dependencies: [{ kind: "ngmodule", type: StepsModule }, { kind: "component", type: i3$1.Steps, selector: "p-steps", inputs: ["activeIndex", "model", "readonly", "style", "styleClass", "exact"], outputs: ["activeIndexChange"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i10.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
1516
1364
|
}
|
|
1517
1365
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: StepComponent, decorators: [{
|
|
1518
1366
|
type: Component,
|
|
1519
|
-
args: [{ selector: 'app-step', standalone:
|
|
1367
|
+
args: [{ selector: 'app-step', imports: [StepsModule, RouterOutlet, ButtonModule, CommonModule], standalone: true, template: "<div>\r\n <div id=\"step-container\">\r\n <p-steps #stepsComponent [model]=\"items\" [readonly]=\"false\" [activeIndex]=\"activeIndex\" (activeIndexChange)=\"onactiveIndexChange($event)\"></p-steps>\r\n </div>\r\n\r\n <div class=\"content\">\r\n <router-outlet></router-outlet>\r\n </div>\r\n <div class=\"buttons-step\">\r\n <div >\r\n <button pButton *ngIf=\"activeIndex != 0\" icon=\"pi pi-arrow-left\" [disabled]=\"loading\"\r\n (click)=\"requestNaviagtion(-1)\"></button>\r\n </div>\r\n <span >\r\n <button pButton *ngIf=\"!(activeIndex + 1 >= items.length)\" icon=\"pi pi-arrow-right\" [disabled]=\"loading\"\r\n (click)=\"requestNaviagtion(1)\"></button>\r\n </span>\r\n <button pButton *ngIf=\"activeIndex >= items.length - 1\" label=\"Finalizar\" [disabled]=\"loading\" (click)=\"requestNaviagtion(0)\"\r\n [style]=\"{'margin-left': '10px'}\"></button>\r\n </div>\r\n</div>\r\n", styles: ["::ng-deep .p-steps-number{background-color:var(--secondary-color)!important}::ng-deep .p-button{border-radius:6px}::ng-deep .p-steps-item .p-menuitem-link{margin-inline:15vw}::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-number{color:#fff;font-family:sans-serif}::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-title{color:#4b5563;font-family:inherit}::ng-deep{& ul[role=tablist]{padding-bottom:10px}.p-steps-number{color:#fff!important}}.buttons-step{margin-bottom:1.5rem}.buttons-step button{height:3.5rem}.buttons-step ::ng-deep .p-button{background-color:var(--button-color);border-color:var(--button-color)}.buttons-step .p-button-icon-only{width:3.5rem}#step-container{overflow-x:scroll;scrollbar-width:20px;padding-bottom:5px}.buttons-step{display:flex;justify-content:space-evenly}.content{margin-block:30px}@media screen and (max-width: 765px){::ng-deep{.p-steps-title{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;width:inherit;text-align:center}}::ng-deep .p-steps-item a.p-menuitem-link{margin-inline:0!important;width:90vw}}\n"] }]
|
|
1520
1368
|
}], ctorParameters: () => [{ type: i2.Router }, { type: StepService }, { type: i2.ActivatedRoute }], propDecorators: { items: [{
|
|
1521
1369
|
type: Input
|
|
1522
1370
|
}] } });
|
|
@@ -1559,6 +1407,7 @@ class Shema {
|
|
|
1559
1407
|
uiOnly;
|
|
1560
1408
|
defaultValue;
|
|
1561
1409
|
eraseOnDisable;
|
|
1410
|
+
dependency;
|
|
1562
1411
|
}
|
|
1563
1412
|
class ShemaConfig {
|
|
1564
1413
|
calendar;
|
|
@@ -1673,13 +1522,13 @@ class FileUploadComponent {
|
|
|
1673
1522
|
button.classList.remove('animate-pulse');
|
|
1674
1523
|
}
|
|
1675
1524
|
}
|
|
1676
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FileUploadComponent, deps: [{ token:
|
|
1677
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: FileUploadComponent, isStandalone:
|
|
1525
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FileUploadComponent, deps: [{ token: i3.MessageService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1526
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: FileUploadComponent, isStandalone: true, selector: "sf-file-upload", inputs: { limit: "limit", files: "files", loading: "loading", configName: "configName", accept: "accept" }, outputs: { onUpload: "onUpload", onDeleteFile: "onDeleteFile" }, viewQueries: [{ propertyName: "fileUploader", first: true, predicate: ["fileUpload"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div id=\"screen\" #screen>\r\n <div class=\"fileUp\">\r\n <div class=\"botones\">\r\n <input type=\"file\" (change)=\"appendFiles($event)\" class=\"file-input\" #fileUpload multiple>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-plus\" class=\"p-button-info\" (click)=\"fileUpload.click()\"\r\n [disabled]=\"limit == files.length || loading\"></button>\r\n <button *ngIf=\"limit != 1\" pButton pRipple type=\"button\" icon=\"pi pi-upload\" class=\"button-upload p-button-info\"\r\n (click)=\"emitFiles()\" [disabled]=\"files.length == 0 || loading\"></button>\r\n </div>\r\n\r\n <hr>\r\n <div class=\"imgs\">\r\n <ul>\r\n <li *ngFor=\"let file of files; let i = index\" [ngSwitch]=\"file.type\">\r\n <p>{{i+1}}. {{files[i].name}}</p>\r\n <div>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["#screen{container-type:inline-size}iframe{width:100%;padding:10px;text-align:center}.fileUp{border:1.5px solid gray;border-radius:5px;text-align:center}.fileUp .imgs{min-height:40px;margin-block:7px;max-height:135px;overflow-y:scroll}.fileUp hr{color:gray;margin:0}.fileUp .imgs ul li{text-decoration:none;display:flex;margin-block:5px;padding-inline:5px}.fileUp .imgs ul{padding-inline-start:30px}.fileUp .imgs ul li div{text-decoration:none;display:grid;grid-template-columns:50% 50%;margin-block:5px;margin-right:5px}.fileUp .botones *{margin-block:7px;margin-inline:10px}.fileUp .imgs ul li p{text-align:left;white-space:nowrap;width:100%;overflow:hidden;text-overflow:ellipsis}.fileUp .imgs ul li p,.fileUp .imgs ul li button{margin-block:auto;margin-inline:5px;text-align:left}.fileUp .imgs ul li img,.fileUp .imgs ul li iframe{text-align:center;width:80%;padding-inline:10%}.file-input{display:none}::ng-deep .p-button.p-button-info,.p-buttonset.p-button-info>.p-button,.p-splitbutton.p-button-info>.p-button{background:var(--secondary-color)!important;border:var(--secondary-color)!important;color:#fff}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.animate-pulse{animation:pulse 1.5s infinite}@container (width < 768px){.fileUp .imgs ul li{display:grid;grid-template-columns:60% 40%}.fileUp .imgs ul li img,.fileUp .imgs ul li iframe{display:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i10.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }] });
|
|
1678
1527
|
}
|
|
1679
1528
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FileUploadComponent, decorators: [{
|
|
1680
1529
|
type: Component,
|
|
1681
|
-
args: [{ selector: 'sf-file-upload', standalone:
|
|
1682
|
-
}], ctorParameters: () => [{ type:
|
|
1530
|
+
args: [{ selector: 'sf-file-upload', imports: [CommonModule, InputTextModule, ButtonModule], standalone: true, template: "<div id=\"screen\" #screen>\r\n <div class=\"fileUp\">\r\n <div class=\"botones\">\r\n <input type=\"file\" (change)=\"appendFiles($event)\" class=\"file-input\" #fileUpload multiple>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-plus\" class=\"p-button-info\" (click)=\"fileUpload.click()\"\r\n [disabled]=\"limit == files.length || loading\"></button>\r\n <button *ngIf=\"limit != 1\" pButton pRipple type=\"button\" icon=\"pi pi-upload\" class=\"button-upload p-button-info\"\r\n (click)=\"emitFiles()\" [disabled]=\"files.length == 0 || loading\"></button>\r\n </div>\r\n\r\n <hr>\r\n <div class=\"imgs\">\r\n <ul>\r\n <li *ngFor=\"let file of files; let i = index\" [ngSwitch]=\"file.type\">\r\n <p>{{i+1}}. {{files[i].name}}</p>\r\n <div>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-external-link\" class=\"p-button-rounded\"\r\n (click)=\"openFile(file)\"></button>\r\n <button pButton pRipple type=\"button\" icon=\"pi pi-times\" class=\"p-button-rounded p-button-danger\"\r\n (click)=\"dropFile(file)\"></button>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["#screen{container-type:inline-size}iframe{width:100%;padding:10px;text-align:center}.fileUp{border:1.5px solid gray;border-radius:5px;text-align:center}.fileUp .imgs{min-height:40px;margin-block:7px;max-height:135px;overflow-y:scroll}.fileUp hr{color:gray;margin:0}.fileUp .imgs ul li{text-decoration:none;display:flex;margin-block:5px;padding-inline:5px}.fileUp .imgs ul{padding-inline-start:30px}.fileUp .imgs ul li div{text-decoration:none;display:grid;grid-template-columns:50% 50%;margin-block:5px;margin-right:5px}.fileUp .botones *{margin-block:7px;margin-inline:10px}.fileUp .imgs ul li p{text-align:left;white-space:nowrap;width:100%;overflow:hidden;text-overflow:ellipsis}.fileUp .imgs ul li p,.fileUp .imgs ul li button{margin-block:auto;margin-inline:5px;text-align:left}.fileUp .imgs ul li img,.fileUp .imgs ul li iframe{text-align:center;width:80%;padding-inline:10%}.file-input{display:none}::ng-deep .p-button.p-button-info,.p-buttonset.p-button-info>.p-button,.p-splitbutton.p-button-info>.p-button{background:var(--secondary-color)!important;border:var(--secondary-color)!important;color:#fff}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.animate-pulse{animation:pulse 1.5s infinite}@container (width < 768px){.fileUp .imgs ul li{display:grid;grid-template-columns:60% 40%}.fileUp .imgs ul li img,.fileUp .imgs ul li iframe{display:none}}\n"] }]
|
|
1531
|
+
}], ctorParameters: () => [{ type: i3.MessageService }], propDecorators: { limit: [{
|
|
1683
1532
|
type: Input
|
|
1684
1533
|
}], files: [{
|
|
1685
1534
|
type: Input
|
|
@@ -1702,26 +1551,118 @@ class Archivo {
|
|
|
1702
1551
|
name;
|
|
1703
1552
|
}
|
|
1704
1553
|
|
|
1705
|
-
class
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1554
|
+
class NotificationService {
|
|
1555
|
+
sfCrudService;
|
|
1556
|
+
_notificationAdded = new Subject();
|
|
1557
|
+
constructor(sfCrudService) {
|
|
1558
|
+
this.sfCrudService = sfCrudService;
|
|
1559
|
+
}
|
|
1560
|
+
addNotification(msg, requestChecking) {
|
|
1561
|
+
this._notificationAdded.next({ msg, requestChecking });
|
|
1562
|
+
}
|
|
1563
|
+
notificationAdded$() {
|
|
1564
|
+
return this._notificationAdded.asObservable();
|
|
1565
|
+
}
|
|
1566
|
+
/**
|
|
1567
|
+
* Generates message using answerchecking
|
|
1568
|
+
* @param currentMsg Default message: Message | SweetAlertOptions
|
|
1569
|
+
* @param rta Resquest's response
|
|
1570
|
+
* @param answerChecking
|
|
1571
|
+
*/
|
|
1572
|
+
generateMessage(currentMsg, rta, requestChecking) {
|
|
1573
|
+
if (requestChecking) {
|
|
1574
|
+
if (requestChecking.statics)
|
|
1575
|
+
Object.assign(currentMsg, requestChecking.statics);
|
|
1576
|
+
//mapear los dinamicos
|
|
1577
|
+
if (requestChecking.dynamics) {
|
|
1578
|
+
const dynamics = requestChecking.dynamics;
|
|
1579
|
+
try {
|
|
1580
|
+
if (dynamics && typeof (rta) == "string")
|
|
1581
|
+
rta = JSON.parse(rta);
|
|
1582
|
+
if (requestChecking.parse) {
|
|
1583
|
+
let valueParsed = JSON.parse(jsonpath.query(rta, requestChecking.parse)[0]);
|
|
1584
|
+
jsonpath.value(rta, requestChecking.parse, valueParsed);
|
|
1585
|
+
}
|
|
1586
|
+
if (dynamics) {
|
|
1587
|
+
for (const property in dynamics) {
|
|
1588
|
+
let errors = jsonpath.query(rta, dynamics[property])[0];
|
|
1589
|
+
if (typeof (errors) === "object" && errors != null)
|
|
1590
|
+
errors = this.concatenateErrors(errors);
|
|
1591
|
+
currentMsg[property] = errors;
|
|
1592
|
+
}
|
|
1593
|
+
}
|
|
1594
|
+
}
|
|
1595
|
+
catch (error) { //es una respuesta sin JSON
|
|
1596
|
+
if (dynamics)
|
|
1597
|
+
currentMsg.detail = rta;
|
|
1598
|
+
}
|
|
1599
|
+
}
|
|
1709
1600
|
}
|
|
1710
|
-
|
|
1711
|
-
|
|
1601
|
+
return currentMsg;
|
|
1602
|
+
}
|
|
1603
|
+
/**
|
|
1604
|
+
* Concatena todos los errores de un objeto de errores del backend
|
|
1605
|
+
* @param errors Objeto de errores recibido del backend
|
|
1606
|
+
* @param separator Separador entre errores (por defecto '\n')
|
|
1607
|
+
* @returns String con todos los errores concatenados
|
|
1608
|
+
*/
|
|
1609
|
+
concatenateErrors(errors, separator = '\n') {
|
|
1610
|
+
if (!errors || typeof errors !== 'object') {
|
|
1611
|
+
return '';
|
|
1712
1612
|
}
|
|
1713
|
-
|
|
1613
|
+
const errorMessages = [];
|
|
1614
|
+
Object.keys(errors).forEach(field => {
|
|
1615
|
+
const fieldErrors = errors[field];
|
|
1616
|
+
if (Array.isArray(fieldErrors)) {
|
|
1617
|
+
fieldErrors.forEach(errorMsg => {
|
|
1618
|
+
errorMessages.push(errorMsg);
|
|
1619
|
+
});
|
|
1620
|
+
}
|
|
1621
|
+
else if (typeof fieldErrors === 'string') {
|
|
1622
|
+
errorMessages.push(fieldErrors);
|
|
1623
|
+
}
|
|
1624
|
+
else if (typeof fieldErrors === 'object') {
|
|
1625
|
+
const nestedErrors = this.concatenateErrors(fieldErrors, separator);
|
|
1626
|
+
if (nestedErrors) {
|
|
1627
|
+
errorMessages.push(nestedErrors);
|
|
1628
|
+
}
|
|
1629
|
+
}
|
|
1630
|
+
});
|
|
1631
|
+
return errorMessages.join(separator);
|
|
1714
1632
|
}
|
|
1715
|
-
|
|
1716
|
-
|
|
1633
|
+
genDefaultMessage(severity, title, detail, requestChecking) {
|
|
1634
|
+
let obj = { title, text: detail, icon: severity,
|
|
1635
|
+
confirmButtonColor: this.sfCrudService.configEmpresa?.colors ? this.sfCrudService.configEmpresa?.colors?.button : "#3085d6",
|
|
1636
|
+
cancelButtonColor: this.sfCrudService.configEmpresa?.colors ? this.sfCrudService.configEmpresa?.colors?.button : "#d33" };
|
|
1637
|
+
if (requestChecking && requestChecking.useSwal && severity == "error") {
|
|
1638
|
+
obj.showCancelButton = true;
|
|
1639
|
+
obj.confirmButtonText = '<i class="pi pi-check"></i> Continuar';
|
|
1640
|
+
obj.cancelButtonText = '<i class="pi pi-times"></i> Terminar';
|
|
1641
|
+
}
|
|
1642
|
+
if (!requestChecking || !requestChecking.useSwal) {
|
|
1643
|
+
obj.severity = severity;
|
|
1644
|
+
obj.summary = title;
|
|
1645
|
+
obj.detail = detail;
|
|
1646
|
+
}
|
|
1647
|
+
return obj;
|
|
1648
|
+
}
|
|
1649
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NotificationService, deps: [{ token: SfCrudService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1650
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NotificationService, providedIn: 'root' });
|
|
1717
1651
|
}
|
|
1718
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type:
|
|
1719
|
-
type:
|
|
1652
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NotificationService, decorators: [{
|
|
1653
|
+
type: Injectable,
|
|
1720
1654
|
args: [{
|
|
1721
|
-
|
|
1722
|
-
standalone: false
|
|
1655
|
+
providedIn: 'root'
|
|
1723
1656
|
}]
|
|
1724
|
-
}] });
|
|
1657
|
+
}], ctorParameters: () => [{ type: SfCrudService }] });
|
|
1658
|
+
class Notification {
|
|
1659
|
+
msg;
|
|
1660
|
+
requestChecking;
|
|
1661
|
+
constructor(msg, requestChecking) {
|
|
1662
|
+
this.msg = msg;
|
|
1663
|
+
this.requestChecking = requestChecking;
|
|
1664
|
+
}
|
|
1665
|
+
}
|
|
1725
1666
|
|
|
1726
1667
|
class ControlComponent {
|
|
1727
1668
|
generalService;
|
|
@@ -1736,6 +1677,7 @@ class ControlComponent {
|
|
|
1736
1677
|
setValue = new EventEmitter();
|
|
1737
1678
|
sendObject = new EventEmitter();
|
|
1738
1679
|
addressClicked = new EventEmitter();
|
|
1680
|
+
setDependencyValue = new EventEmitter();
|
|
1739
1681
|
tooltips;
|
|
1740
1682
|
lenghtWord;
|
|
1741
1683
|
isLoading = false;
|
|
@@ -1930,10 +1872,15 @@ class ControlComponent {
|
|
|
1930
1872
|
this.setValue.emit(this.control.config.optionValue);
|
|
1931
1873
|
break;
|
|
1932
1874
|
default:
|
|
1933
|
-
if (event.value)
|
|
1875
|
+
if (event.value) {
|
|
1934
1876
|
this.setValue.emit(event.value[this.control.config.optionValue]);
|
|
1935
|
-
|
|
1877
|
+
}
|
|
1878
|
+
else {
|
|
1936
1879
|
this.setValue.emit(event[this.control.config.optionValue]);
|
|
1880
|
+
}
|
|
1881
|
+
if (this.control.dependency && this.setDependencyValue) {
|
|
1882
|
+
this.setDependencyValue.emit({ data: event.value[this.control.dependency.value], scope: this.control.dependency.scope });
|
|
1883
|
+
}
|
|
1937
1884
|
break;
|
|
1938
1885
|
}
|
|
1939
1886
|
}
|
|
@@ -1949,6 +1896,10 @@ class ControlComponent {
|
|
|
1949
1896
|
this.generalService.genericRequest(this.control.config.method, url)
|
|
1950
1897
|
.then((res) => {
|
|
1951
1898
|
this.dataFromService = res.data;
|
|
1899
|
+
if (res.data.length == 1) {
|
|
1900
|
+
this.value = res.data[0][this.control.config.optionValue];
|
|
1901
|
+
this.sendValue();
|
|
1902
|
+
}
|
|
1952
1903
|
}).finally(() => {
|
|
1953
1904
|
this.isLoading = false;
|
|
1954
1905
|
this.cdr.detectChanges();
|
|
@@ -1962,7 +1913,10 @@ class ControlComponent {
|
|
|
1962
1913
|
url = url.replace('@query', event?.query || '');
|
|
1963
1914
|
this.generalService.genericRequest(this.control.config.method, url)
|
|
1964
1915
|
.then((res) => {
|
|
1965
|
-
this.
|
|
1916
|
+
if (this.control.subtype === 'autocomplete')
|
|
1917
|
+
this.dataFromService = res.data;
|
|
1918
|
+
else if (this.control.subtype === 'autocompleteCustom')
|
|
1919
|
+
this.dataFromService = (res.data || []).map((r) => ({ ...r, _display: this.formatWithTemplate(r) }));
|
|
1966
1920
|
if (this.dataFromService?.length == 0 && this.control.allowCustomOption) {
|
|
1967
1921
|
//agregar un campo que el usuario haya digitado
|
|
1968
1922
|
let newItem = {};
|
|
@@ -2115,12 +2069,32 @@ class ControlComponent {
|
|
|
2115
2069
|
onClickedAddres() {
|
|
2116
2070
|
this.addressClicked.emit();
|
|
2117
2071
|
}
|
|
2072
|
+
displayTemplate() {
|
|
2073
|
+
const cfg = this.control?.config ?? {};
|
|
2074
|
+
if (cfg.displayTemplate)
|
|
2075
|
+
return cfg.displayTemplate;
|
|
2076
|
+
// fallback: optionValue - optionLabel
|
|
2077
|
+
if (cfg.optionValue && cfg.optionLabel) {
|
|
2078
|
+
return `{${cfg.optionValue}} - {${cfg.optionLabel}}`;
|
|
2079
|
+
}
|
|
2080
|
+
// último recurso: solo field
|
|
2081
|
+
return `{${this.control?.field ?? 'value'}}`;
|
|
2082
|
+
}
|
|
2083
|
+
formatWithTemplate(item) {
|
|
2084
|
+
let template = this.displayTemplate();
|
|
2085
|
+
return template.replace(/\{([^}]+)\}/g, (_, expr) => {
|
|
2086
|
+
return item[expr] !== undefined ? item[expr] : '';
|
|
2087
|
+
});
|
|
2088
|
+
}
|
|
2118
2089
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ControlComponent, deps: [{ token: GeneralService }, { token: SfCrudService }, { token: i0.ChangeDetectorRef }, { token: NotificationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2119
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ControlComponent, isStandalone: false, selector: "sf-control", inputs: { showTempValue: "showTempValue", control: "control", label: "label", value: "value", appendTo: "appendTo" }, outputs: { setValue: "setValue", sendObject: "sendObject", addressClicked: "addressClicked" }, viewQueries: [{ propertyName: "tooltips", predicate: Tooltip, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"showTempValue\"><p *ngIf=\"tempValue\">{{tempValue[control.field]}}</p></ng-container>\r\n\r\n<div *ngIf=\"!showTempValue\" [ngSwitch]=\"control.type\" #cc class=\"control-container ml-0\" \r\n[ngClass]=\"control.labelPosition === 'horizontal' ? (control.reverse ? 'flex gap-2 flex-row-reverse items-left' : 'flex gap-2 items-left') : (control.reverse ? 'flex flex-column flex-column-reverse' : 'flex flex-column')\">\r\n <div class=\"label-container\">\r\n <label [for]=\"label\">{{label}}</label>\r\n <i #tooltip *ngIf=\"control.tooltip\" class=\"pi pi-question-circle\"\r\n [tooltipPosition]=\"control.tooltipPosition || 'top'\" [pTooltip]=\"control.tooltip\"\r\n (touchstart)=\"onTouchDescription()\" (touchend)=\"onUnTouchDescription()\"></i>\r\n </div>\r\n\r\n <ng-container *ngSwitchCase=\"'string'\" >\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'input'\">\r\n <input pInputText [name]=\"label\" type=\"text\" [(ngModel)]=\"value\" (input)=\"sendValue()\"\r\n [disabled]=\"control.disabled || false\" [autocomplete]=\"control.autocomplete || 'off'\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'textarea'\">\r\n <textarea [rows]=\"control.config?.rows ? control.config.rows : 4\" [(ngModel)]=\"value\"\r\n (input)=\"sendValue()\" pInputTextarea [disabled]=\"control.config?.disabled || false\"\r\n [autoResize]=\"control.config?.autoresize || false\"></textarea>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'password'\">\r\n <input pInputText type=\"password\" [(ngModel)]=\"value\" (input)=\"sendValue()\"\r\n [disabled]=\"control.disabled || false\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'email'\">\r\n <input pInputText type=\"text\" [(ngModel)]=\"value\" placeholder=\"email@example.com\"\r\n [disabled]=\"control.disabled || false\" autocomplete=\"email\" (input)=\"onInputEmail(false)\"\r\n (focusout)=\"onInputEmail(true)\" (keyup.enter)=\"doFocusOut()\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'phone'\">\r\n <p-inputMask mask=\"(999) 999-9999\" [(ngModel)]=\"value\" placeholder=\"(999) 999-9999\"\r\n [disabled]=\"control.disabled || false\" autocomplete=\"tel-national\"\r\n [unmask]=\"control.unmask || false\" (onComplete)=\"sendValue()\"></p-inputMask>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'address'\">\r\n <input pInputText type=\"text\" [value]=\"value | formatAddress: control.separador\" autocomplete=\"off\" [disabled]=\"clicked\" (keydown)=\"onClickedAddres()\" (focus)=\"onClickedAddres()\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'enum'\">\r\n <p-select [options]=\"control.enum\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\" appendTo=\"body\"\r\n placeholder=\"Seleccione una opci\u00F3n\" [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dropdown'\">\r\n <p-select [lazy]=\"isLoading\" [options]=\"dataFromService\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\"\r\n [optionLabel]=\"control.config.optionLabel\" [showClear]=\"control.config.showClear\"\r\n [optionValue]=\"control.field || control.config.optionValue\" appendTo=\"body\"\r\n placeholder=\"Seleccione una opci\u00F3n\" [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dropdown:replace'\">\r\n <p-select [lazy]=\"isLoading\" [options]=\"dataFromService\"\r\n (onChange)=\"sendValueFromObject($event)\" [optionLabel]=\"control.config.optionLabel\"\r\n appendTo=\"body\" placeholder=\"Seleccione una opci\u00F3n\"\r\n [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocomplete'\">\r\n <p-autoComplete [showEmptyMessage]=\"true\" [suggestions]=\"dataFromService\" appendTo=\"body\"\r\n (completeMethod)=\"loadDataFromControlBusquedaService($event)\" [field]=\"control.field\"\r\n [minLength]=\"1\" (onSelect)=\"sendValueFromObject($event)\" [(ngModel)]=\"tempValue\"\r\n [disabled]=\"control.disabled || false\"></p-autoComplete>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocompleteCustom'\">\r\n <p-autoComplete [showEmptyMessage]=\"true\" [suggestions]=\"dataFromService\" appendTo=\"body\"\r\n (completeMethod)=\"loadDataFromControlBusquedaService($event)\" \r\n [minLength]=\"1\" (onSelect)=\"sendValueFromObject($event)\" [(ngModel)]=\"tempValue\"\r\n [disabled]=\"control.disabled || false\"\r\n [field]=\"control.field\">\r\n <ng-template let-item pTemplate=\"item\">\r\n <div class=\"flex align-items-center gap-2\">\r\n <div>{{ item[control.config.optionValue] }} - {{ item[control.config.optionLabel] }}</div>\r\n </div>\r\n </ng-template>\r\n </p-autoComplete>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'input:search'\">\r\n <div class=\"p-inputgroup\">\r\n <input type=\"text\" pInputText [(ngModel)]=\"value\" (focusout)=\"sendValue()\"\r\n (keyup.enter)=\"doFocusOut()\" />\r\n <button type=\"button\" pButton icon=\"pi pi-search\" (click)=\"searchValue(value)\"></button>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'file'\">\r\n <sf-file-upload *ngIf=\"!isLoading\" [accept]=\"control.config?.accept || 'image/*,application/pdf'\"\r\n [loading]=\"uploadingFiles\" [files]=\"uploadedFiles\" [configName]=\"control.config?.configName\"\r\n [limit]=\"control.config?.limit || 1\" (onUpload)=\"onUpload($event)\"\r\n (onDeleteFile)=\"onDeleteFile($event)\"></sf-file-upload>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'calendar'\">\r\n <!-- <div class=\"p-col-12\">\r\n <p-inputgroup>\r\n <p-inputMask [(ngModel)]=\"tempValue\" [mask]=\"maskDate\" [placeholder]=\"control.placeholder\"\r\n (onBlur)=\"onChangeSDate($event)\" [disabled]=\"control.disabled || false\"></p-inputMask>\r\n <p-calendar\r\n [(ngModel)]=\"value\" class=\"only-icon\" [monthNavigator]=\"true\" [yearNavigator]=\"true\" yearRange=\"1900:2035\"\r\n [dateFormat]=\"control.format || 'yy-mm-dd'\" appendTo=\"body\" [disabled]=\"control.disabled || false\"\r\n [showOnFocus]=\"!control.hide\" [placeholder]=\"control.placeholder || 'aaaa-mm-dd'\"\r\n [touchUI]=\"control.touchUI || false\" [showIcon]=\"control.showIcon || false\" (onSelect)=\"onChangeDate()\"\r\n (onBlur)=\"onChangeDate()\"\r\n ></p-calendar>\r\n </p-inputgroup>\r\n \r\n </div> -->\r\n <p-datepicker\r\n [(ngModel)]=\"value\" inputId=\"icondisplay\" [monthNavigator]=\"true\" [yearNavigator]=\"true\" yearRange=\"1900:2035\"\r\n [dateFormat]=\"control.format || 'yy-mm-dd'\" appendTo=\"body\" [disabled]=\"control.disabled || false\"\r\n [showOnFocus]=\"control.hide\" [placeholder]=\"control.placeholder || 'aaaa-mm-dd'\"\r\n [showIcon]=\"control.showIcon || false\" (onSelect)=\"onChangeDate()\"\r\n (onBlur)=\"onChangeDate()\" [iconDisplay]=\"'input'\" class=\"p-0\"\r\n ></p-datepicker>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'numeric'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'currency'\">\r\n <p-inputNumber [ngModel]=\"value\" (ngModelChange)=\"value = $event; sendValue()\" mode=\"decimal\" [minFractionDigits]=\"control.minFractionDigits || 0\"\r\n [min]=\"control.min || null\" [max]=\"control.max || null\" (onInput)=\"sendNumberValue($event)\"\r\n [prefix]=\"control.currency || '$ '\" [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'decimal'\">\r\n <p-inputNumber [ngModel]=\"value\" mode=\"decimal\" (ngModelChange)=\"value = $event; sendValue()\" [min]=\"control.min || null\"\r\n [max]=\"control.max || null\" [minFractionDigits]=\"control.minFractionDigits || 0\"\r\n [locale]=\"control.locale || undefined\" [useGrouping]=\"control.useGrouping || false\"\r\n [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'percentage'\">\r\n <p-inputNumber [ngModel]=\"value\" suffix=\" %\" (ngModelChange)=\"value = $event; sendValue()\" (onInput)=\"sendValue()\" [min]=\"control.min || null\"\r\n [max]=\"control.max || null\" [minFractionDigits]=\"control.minFractionDigits || 2\"\r\n [locale]=\"control.locale || undefined\" [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'decimal:search'\">\r\n <div class=\"p-inputgroup\">\r\n <input type=\"number\" pInputText [(ngModel)]=\"value\" (focusout)=\"sendValue()\"\r\n (keyup.enter)=\"doFocusOut()\" />\r\n <button type=\"button\" pButton icon=\"pi pi-search\" (click)=\"searchValue(value)\"></button>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'array'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'file'\">\r\n <sf-file-upload *ngIf=\"!isLoading\" [loading]=\"uploadingFiles\" [files]=\"uploadedFiles\"\r\n [configName]=\"control.config?.configName\" [limit]=\"control.config?.limit || 1\"\r\n [accept]=\"control.config?.accept || 'image/*,application/pdf'\" (onUpload)=\"onUpload($event)\"\r\n (onDeleteFile)=\"onDeleteFile($event)\"></sf-file-upload>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'multiselect'\">\r\n <p-multiSelect [options]=\"dataFromService\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\"\r\n [optionLabel]=\"control.config?.optionLabel\" [optionValue]=\"control.config?.optionValue\"\r\n [placeholder]=\"control.config?.placeholder\"\r\n [display]=\"control.config?.display || 'chip'\"></p-multiSelect>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'boolean'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'switch'\">\r\n <p-inputSwitch [(ngModel)]=\"tempValue\" (onChange)=\"onChangeSwitch()\" [id]=\"label\"\r\n [trueValue]=\"control?.trueValue !== undefined ? control?.trueValue: null\"\r\n [falseValue]=\"control?.falseValue !== undefined ? control?.falseValue: null\"></p-inputSwitch>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'checkbox'\">\r\n <p-checkbox [(ngModel)]=\"tempCheckVal\" [binary]=\"control?.binary !== undefined ? control?.binary: true\" (onChange)=\"onCheckboxChange()\" />\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: ["::ng-deep .label-container{& label{margin-right:10px;color:#55585b;font-size:17px}& i{font-size:1.1rem}}::ng-deep .p-tooltip{max-width:15rem;font-size:.85rem;text-align:center}.control-container ::ng-deep .p-inputtext,.control-container ::ng-deep .p-inputwrapper,.control-container ::ng-deep .p-select,.control-container ::ng-deep .p-datepicker{width:100%}.control-container ::ng-deep .p-button:hover{background:var(--secondary-color)!important;border-color:var(--secondary-color)!important;filter:brightness(85%)}.control-container ::ng-deep .p-component,.control-container ::ng-deep .p-component *{border-radius:6px}.control-container ::ng-deep .p-inputtext{font-size:17px;border:1px solid #d1d5db;border-radius:6px}.control-container ::ng-deep .p-inputtext:focus,.control-container ::ng-deep .p-inputtext:active,.control-container ::ng-deep .p-inputwrapper:focus,.control-container ::ng-deep .p-inputwrapper:active{border-color:var(--button-color)}.control-container ::ng-deep .p-inputtext:enabled:focus{border-color:var(--secondary-color)!important;box-shadow:inset 0 0 0 1px #fff}.control-container ::ng-deep input.p-inputtext::placeholder{color:#6b7280;font-family:sans-serif;font-size:18px}.control-container ::ng-deep .p-dropdown{background:#fff;border:1px solid #d1d5db;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;border-radius:6px}.control-container ::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:var(--secondary-color)!important}.control-container ::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:var(--secondary-color)!important;box-shadow:inset 0 0 0 1px #fff}.control-container ::ng-deep .p-dropdown .p-inputtext{border:none}.control-container ::ng-deep .p-dropdown .p-dropdown-label.p-placeholder{font-family:sans-serif;color:#6b7280}.control-container ::ng-deep .p-button.p-button-danger,.control-container ::ng-deep .p-buttonset.p-button-danger>.p-button,.control-container ::ng-deep .p-splitbutton.p-button-danger>.p-button{border-color:var(--secondary-color)!important;background:var(--secondary-color)!important}.control-container ::ng-deep .p-inputgroup button:last-child{border-top-right-radius:6px;border-bottom-right-radius:6px}.control-container ::ng-deep .p-inputgroup input:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.control-container ::ng-deep .p-inputgroup input:first-child{border-top-left-radius:6px;border-bottom-left-radius:6px}.control-container ::ng-deep .p-datepicker{padding:0}.control-container ::ng-deep .p-datepicker-touch-ui .p-datepicker-title{padding:0}.control-container ::ng-deep .p-datepicker-month,.control-container ::ng-deep .p-datepicker-month:focus,.control-container ::ng-deep .p-datepicker-year:focus,.control-container ::ng-deep .p-datepicker-year{border:none}::ng-deep .d-none{display:none!important}.p-inputgroup{p-calendar{display:contents;::ng-deep input{display:none!important}::ng-deep .p-button-icon-only{border-top-left-radius:0;border-bottom-left-radius:0;width:100%;height:100%}}p-inputMask{display:contents;::ng-deep input{border-top-right-radius:0;border-bottom-right-radius:0}}}@media (max-width <=768px){:host{font-size:14px}}\n"], dependencies: [{ kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "variant", "fluid"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "directive", type: i8.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i7.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "component", type: i8$2.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "size", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i9.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: i9.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i10.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i10.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i11$1.InputMask, selector: "p-inputmask, p-inputMask, p-input-mask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "variant", "ariaLabel", "ariaLabelledBy", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autofocus", "autoFocus", "autocomplete", "keepBuffer", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "component", type: i12$1.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "variant", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus", "disabled", "fluid"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "component", type: i13$1.InputSwitch, selector: "p-inputSwitch, p-inputswitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "directive", type: i13.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "component", type: i14.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i17.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i17$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: FileUploadComponent, selector: "sf-file-upload", inputs: ["limit", "files", "loading", "configName", "accept"], outputs: ["onUpload", "onDeleteFile"] }, { kind: "pipe", type: FormatAddressPipe, name: "formatAddress" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2090
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ControlComponent, isStandalone: true, selector: "sf-control", inputs: { showTempValue: "showTempValue", control: "control", label: "label", value: "value", appendTo: "appendTo" }, outputs: { setValue: "setValue", sendObject: "sendObject", addressClicked: "addressClicked", setDependencyValue: "setDependencyValue" }, viewQueries: [{ propertyName: "tooltips", predicate: Tooltip, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"showTempValue\"><p *ngIf=\"tempValue\">{{tempValue[control.field]}}</p></ng-container>\r\n\r\n<div *ngIf=\"!showTempValue\" [ngSwitch]=\"control.type\" #cc class=\"control-container ml-0\" \r\n[ngClass]=\"control.labelPosition === 'horizontal' ? (control.reverse ? 'flex gap-2 flex-row-reverse items-left' : 'flex gap-2 items-left') : (control.reverse ? 'flex flex-column flex-column-reverse' : 'flex flex-column')\">\r\n <div class=\"label-container\">\r\n <label [for]=\"label\">{{label}}</label>\r\n <i #tooltip *ngIf=\"control.tooltip\" class=\"pi pi-question-circle\"\r\n [tooltipPosition]=\"control.tooltipPosition || 'top'\" [pTooltip]=\"control.tooltip\"\r\n (touchstart)=\"onTouchDescription()\" (touchend)=\"onUnTouchDescription()\"></i>\r\n </div>\r\n\r\n <ng-container *ngSwitchCase=\"'string'\" >\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'input'\">\r\n <input pInputText [name]=\"label\" type=\"text\" [(ngModel)]=\"value\" (input)=\"sendValue()\"\r\n [disabled]=\"control.disabled || false\" [autocomplete]=\"control.autocomplete || 'off'\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'textarea'\">\r\n <textarea [rows]=\"control.config?.rows ? control.config.rows : 4\" [(ngModel)]=\"value\"\r\n (input)=\"sendValue()\" pInputTextarea [disabled]=\"control.config?.disabled || false\"\r\n [autoResize]=\"control.config?.autoresize || false\"></textarea>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'password'\">\r\n <input pInputText type=\"password\" [(ngModel)]=\"value\" (input)=\"sendValue()\"\r\n [disabled]=\"control.disabled || false\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'email'\">\r\n <input pInputText type=\"text\" [(ngModel)]=\"value\" placeholder=\"email@example.com\"\r\n [disabled]=\"control.disabled || false\" autocomplete=\"email\" (input)=\"onInputEmail(false)\"\r\n (focusout)=\"onInputEmail(true)\" (keyup.enter)=\"doFocusOut()\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'phone'\">\r\n <p-inputMask mask=\"(999) 999-9999\" [(ngModel)]=\"value\" placeholder=\"(999) 999-9999\"\r\n [disabled]=\"control.disabled || false\" autocomplete=\"tel-national\"\r\n [unmask]=\"control.unmask || false\" (onComplete)=\"sendValue()\"></p-inputMask>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'address'\">\r\n <input pInputText type=\"text\" [value]=\"value | formatAddress: control.separador\" autocomplete=\"off\" [disabled]=\"clicked\" (keydown)=\"onClickedAddres()\" (focus)=\"onClickedAddres()\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'enum'\">\r\n <p-select [options]=\"control.enum\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\" appendTo=\"body\"\r\n placeholder=\"Seleccione una opci\u00F3n\" [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dropdown'\">\r\n <p-select [lazy]=\"isLoading\" [options]=\"dataFromService\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\"\r\n [optionLabel]=\"control.config.optionLabel\" [showClear]=\"control.config.showClear\"\r\n [optionValue]=\"control.field || control.config.optionValue\" appendTo=\"body\"\r\n placeholder=\"Seleccione una opci\u00F3n\" [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dropdown:replace'\">\r\n <p-select [lazy]=\"isLoading\" [options]=\"dataFromService\"\r\n (onChange)=\"sendValueFromObject($event)\" [optionLabel]=\"control.config.optionLabel\"\r\n appendTo=\"body\" placeholder=\"Seleccione una opci\u00F3n\"\r\n [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocomplete'\">\r\n <p-autoComplete [showEmptyMessage]=\"true\" [suggestions]=\"dataFromService\" appendTo=\"body\"\r\n (completeMethod)=\"loadDataFromControlBusquedaService($event)\" [field]=\"control.field\"\r\n [minLength]=\"1\" (onSelect)=\"sendValueFromObject($event)\" [(ngModel)]=\"tempValue\"\r\n [disabled]=\"control.disabled || false\" (onClear)=\"setValue.emit(null)\"></p-autoComplete>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocompleteCustom'\">\r\n <p-autoComplete [showEmptyMessage]=\"true\" [suggestions]=\"dataFromService\" appendTo=\"body\"\r\n (completeMethod)=\"loadDataFromControlBusquedaService($event)\" \r\n [minLength]=\"1\" (onSelect)=\"sendValueFromObject($event)\" [(ngModel)]=\"tempValue\"\r\n [disabled]=\"control.disabled || false\"\r\n [field]=\"control.field\" (onClear)=\"setValue.emit(null)\">\r\n <ng-template let-item pTemplate=\"item\">\r\n <div class=\"flex align-items-center gap-2\">\r\n <div>{{ item._display }}</div>\r\n </div>\r\n </ng-template>\r\n </p-autoComplete>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'input:search'\">\r\n <div class=\"p-inputgroup\">\r\n <input type=\"text\" pInputText [(ngModel)]=\"value\" (focusout)=\"sendValue()\"\r\n (keyup.enter)=\"doFocusOut()\" />\r\n <button type=\"button\" pButton icon=\"pi pi-search\" (click)=\"searchValue(value)\"></button>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'file'\">\r\n <sf-file-upload *ngIf=\"!isLoading\" [accept]=\"control.config?.accept || 'image/*,application/pdf'\"\r\n [loading]=\"uploadingFiles\" [files]=\"uploadedFiles\" [configName]=\"control.config?.configName\"\r\n [limit]=\"control.config?.limit || 1\" (onUpload)=\"onUpload($event)\"\r\n (onDeleteFile)=\"onDeleteFile($event)\"></sf-file-upload>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'calendar'\">\r\n <!-- <div class=\"p-col-12\">\r\n <p-inputgroup>\r\n <p-inputMask [(ngModel)]=\"tempValue\" [mask]=\"maskDate\" [placeholder]=\"control.placeholder\"\r\n (onBlur)=\"onChangeSDate($event)\" [disabled]=\"control.disabled || false\"></p-inputMask>\r\n <p-calendar\r\n [(ngModel)]=\"value\" class=\"only-icon\" [monthNavigator]=\"true\" [yearNavigator]=\"true\" yearRange=\"1900:2035\"\r\n [dateFormat]=\"control.format || 'yy-mm-dd'\" appendTo=\"body\" [disabled]=\"control.disabled || false\"\r\n [showOnFocus]=\"!control.hide\" [placeholder]=\"control.placeholder || 'aaaa-mm-dd'\"\r\n [touchUI]=\"control.touchUI || false\" [showIcon]=\"control.showIcon || false\" (onSelect)=\"onChangeDate()\"\r\n (onBlur)=\"onChangeDate()\"\r\n ></p-calendar>\r\n </p-inputgroup>\r\n \r\n </div> -->\r\n <p-datepicker\r\n [(ngModel)]=\"value\" inputId=\"icondisplay\" [monthNavigator]=\"true\" [yearNavigator]=\"true\" yearRange=\"1900:2035\"\r\n [dateFormat]=\"control.format || 'yy-mm-dd'\" appendTo=\"body\" [disabled]=\"control.disabled || false\"\r\n [showOnFocus]=\"control.hide\" [placeholder]=\"control.placeholder || 'aaaa-mm-dd'\"\r\n [showIcon]=\"control.showIcon || false\" (onSelect)=\"onChangeDate()\"\r\n (onBlur)=\"onChangeDate()\" [iconDisplay]=\"'input'\" class=\"p-0\"\r\n ></p-datepicker>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'numeric'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'currency'\">\r\n <p-inputNumber [ngModel]=\"value\" (ngModelChange)=\"value = $event; sendValue()\" mode=\"decimal\" [minFractionDigits]=\"control.minFractionDigits || 0\"\r\n [min]=\"control.min || null\" [max]=\"control.max || null\" (onInput)=\"sendNumberValue($event)\"\r\n [prefix]=\"control.currency || '$ '\" [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'decimal'\">\r\n <p-inputNumber [ngModel]=\"value\" mode=\"decimal\" (ngModelChange)=\"value = $event; sendValue()\" [min]=\"control.min || null\"\r\n [max]=\"control.max || null\" [minFractionDigits]=\"control.minFractionDigits || 0\"\r\n [locale]=\"control.locale || undefined\" [useGrouping]=\"control.useGrouping || false\"\r\n [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'percentage'\">\r\n <p-inputNumber [ngModel]=\"value\" suffix=\" %\" (ngModelChange)=\"value = $event; sendValue()\" (onInput)=\"sendValue()\" [min]=\"control.min || null\"\r\n [max]=\"control.max || null\" [minFractionDigits]=\"control.minFractionDigits || 2\"\r\n [locale]=\"control.locale || undefined\" [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'decimal:search'\">\r\n <p-inputgroup>\r\n <input type=\"number\" pInputText [(ngModel)]=\"value\" (focusout)=\"sendValue()\"\r\n (keyup.enter)=\"doFocusOut()\" />\r\n <button type=\"button\" pButton icon=\"pi pi-search\" (click)=\"searchValue(value)\"></button>\r\n </p-inputgroup>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'array'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'file'\">\r\n <sf-file-upload *ngIf=\"!isLoading\" [loading]=\"uploadingFiles\" [files]=\"uploadedFiles\"\r\n [configName]=\"control.config?.configName\" [limit]=\"control.config?.limit || 1\"\r\n [accept]=\"control.config?.accept || 'image/*,application/pdf'\" (onUpload)=\"onUpload($event)\"\r\n (onDeleteFile)=\"onDeleteFile($event)\"></sf-file-upload>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'multiselect'\">\r\n <p-multiSelect [options]=\"dataFromService\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\"\r\n [optionLabel]=\"control.config?.optionLabel\" [optionValue]=\"control.config?.optionValue\"\r\n [placeholder]=\"control.config?.placeholder\"\r\n [display]=\"control.config?.display || 'chip'\"></p-multiSelect>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'boolean'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'switch'\">\r\n <p-inputSwitch [(ngModel)]=\"tempValue\" (onChange)=\"onChangeSwitch()\" [id]=\"label\"\r\n [trueValue]=\"control?.trueValue !== undefined ? control?.trueValue: null\"\r\n [falseValue]=\"control?.falseValue !== undefined ? control?.falseValue: null\"></p-inputSwitch>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'checkbox'\">\r\n <p-checkbox [(ngModel)]=\"tempCheckVal\" [binary]=\"control?.binary !== undefined ? control?.binary: true\" (onChange)=\"onCheckboxChange()\" />\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: ["::ng-deep .label-container{& label{margin-right:10px;color:#55585b;font-size:17px}& i{font-size:1.1rem}}::ng-deep .p-tooltip{max-width:15rem;font-size:.85rem;text-align:center}.control-container ::ng-deep .p-inputtext,.control-container ::ng-deep .p-inputwrapper,.control-container ::ng-deep .p-select,.control-container ::ng-deep .p-datepicker{width:100%}.control-container ::ng-deep .p-button:hover{background:var(--secondary-color)!important;border-color:var(--secondary-color)!important;filter:brightness(85%)}.control-container ::ng-deep .p-component,.control-container ::ng-deep .p-component *{border-radius:6px}.control-container ::ng-deep .p-inputtext{font-size:17px;border:1px solid #d1d5db;border-radius:6px}.control-container ::ng-deep .p-inputtext:focus,.control-container ::ng-deep .p-inputtext:active,.control-container ::ng-deep .p-inputwrapper:focus,.control-container ::ng-deep .p-inputwrapper:active{border-color:var(--button-color)}.control-container ::ng-deep .p-inputtext:enabled:focus{border-color:var(--secondary-color)!important;box-shadow:inset 0 0 0 1px #fff}.control-container ::ng-deep input.p-inputtext::placeholder{color:#6b7280;font-family:sans-serif;font-size:18px}.control-container ::ng-deep .p-dropdown{background:#fff;border:1px solid #d1d5db;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;border-radius:6px}.control-container ::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:var(--secondary-color)!important}.control-container ::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:var(--secondary-color)!important;box-shadow:inset 0 0 0 1px #fff}.control-container ::ng-deep .p-dropdown .p-inputtext{border:none}.control-container ::ng-deep .p-dropdown .p-dropdown-label.p-placeholder{font-family:sans-serif;color:#6b7280}.control-container ::ng-deep .p-button.p-button-danger,.control-container ::ng-deep .p-buttonset.p-button-danger>.p-button,.control-container ::ng-deep .p-splitbutton.p-button-danger>.p-button{border-color:var(--secondary-color)!important;background:var(--secondary-color)!important}.control-container ::ng-deep .p-inputgroup button:last-child{border-top-right-radius:6px;border-bottom-right-radius:6px}.control-container ::ng-deep .p-inputgroup input:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.control-container ::ng-deep .p-inputgroup input:first-child{border-top-left-radius:6px;border-bottom-left-radius:6px}.control-container ::ng-deep .p-datepicker{padding:0}.control-container ::ng-deep .p-datepicker-touch-ui .p-datepicker-title{padding:0}.control-container ::ng-deep .p-datepicker-month,.control-container ::ng-deep .p-datepicker-month:focus,.control-container ::ng-deep .p-datepicker-year:focus,.control-container ::ng-deep .p-datepicker-year{border:none}::ng-deep .d-none{display:none!important}.p-inputgroup{p-calendar{display:contents;::ng-deep input{display:none!important}::ng-deep .p-button-icon-only{border-top-left-radius:0;border-bottom-left-radius:0;width:100%;height:100%}}p-inputMask{display:contents;::ng-deep input{border-top-right-radius:0;border-bottom-right-radius:0}}}@media (max-width <=768px){:host{font-size:14px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5$1.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: i5$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i11.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "ngmodule", type: InputMaskModule }, { kind: "component", type: i7.InputMask, selector: "p-inputmask, p-inputMask, p-input-mask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "variant", "ariaLabel", "ariaLabelledBy", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autofocus", "autoFocus", "autocomplete", "keepBuffer", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i16.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i17.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "ngmodule", type: AutoCompleteModule }, { kind: "component", type: i11$1.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "variant", "fluid"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i10.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: FileUploadComponent, selector: "sf-file-upload", inputs: ["limit", "files", "loading", "configName", "accept"], outputs: ["onUpload", "onDeleteFile"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i13$1.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "size", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i14$1.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "variant", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus", "disabled", "fluid"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "component", type: i15$1.InputSwitch, selector: "p-inputSwitch, p-inputswitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i16$1.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputGroupModule }, { kind: "component", type: i17$1.InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["style", "styleClass"] }, { kind: "ngmodule", type: InputGroupAddonModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i18$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2120
2091
|
}
|
|
2121
2092
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ControlComponent, decorators: [{
|
|
2122
2093
|
type: Component,
|
|
2123
|
-
args: [{ selector: 'sf-control', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container *ngIf=\"showTempValue\"><p *ngIf=\"tempValue\">{{tempValue[control.field]}}</p></ng-container>\r\n\r\n<div *ngIf=\"!showTempValue\" [ngSwitch]=\"control.type\" #cc class=\"control-container ml-0\" \r\n[ngClass]=\"control.labelPosition === 'horizontal' ? (control.reverse ? 'flex gap-2 flex-row-reverse items-left' : 'flex gap-2 items-left') : (control.reverse ? 'flex flex-column flex-column-reverse' : 'flex flex-column')\">\r\n <div class=\"label-container\">\r\n <label [for]=\"label\">{{label}}</label>\r\n <i #tooltip *ngIf=\"control.tooltip\" class=\"pi pi-question-circle\"\r\n [tooltipPosition]=\"control.tooltipPosition || 'top'\" [pTooltip]=\"control.tooltip\"\r\n (touchstart)=\"onTouchDescription()\" (touchend)=\"onUnTouchDescription()\"></i>\r\n </div>\r\n\r\n <ng-container *ngSwitchCase=\"'string'\" >\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'input'\">\r\n <input pInputText [name]=\"label\" type=\"text\" [(ngModel)]=\"value\" (input)=\"sendValue()\"\r\n [disabled]=\"control.disabled || false\" [autocomplete]=\"control.autocomplete || 'off'\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'textarea'\">\r\n <textarea [rows]=\"control.config?.rows ? control.config.rows : 4\" [(ngModel)]=\"value\"\r\n (input)=\"sendValue()\" pInputTextarea [disabled]=\"control.config?.disabled || false\"\r\n [autoResize]=\"control.config?.autoresize || false\"></textarea>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'password'\">\r\n <input pInputText type=\"password\" [(ngModel)]=\"value\" (input)=\"sendValue()\"\r\n [disabled]=\"control.disabled || false\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'email'\">\r\n <input pInputText type=\"text\" [(ngModel)]=\"value\" placeholder=\"email@example.com\"\r\n [disabled]=\"control.disabled || false\" autocomplete=\"email\" (input)=\"onInputEmail(false)\"\r\n (focusout)=\"onInputEmail(true)\" (keyup.enter)=\"doFocusOut()\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'phone'\">\r\n <p-inputMask mask=\"(999) 999-9999\" [(ngModel)]=\"value\" placeholder=\"(999) 999-9999\"\r\n [disabled]=\"control.disabled || false\" autocomplete=\"tel-national\"\r\n [unmask]=\"control.unmask || false\" (onComplete)=\"sendValue()\"></p-inputMask>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'address'\">\r\n <input pInputText type=\"text\" [value]=\"value | formatAddress: control.separador\" autocomplete=\"off\" [disabled]=\"clicked\" (keydown)=\"onClickedAddres()\" (focus)=\"onClickedAddres()\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'enum'\">\r\n <p-select [options]=\"control.enum\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\" appendTo=\"body\"\r\n placeholder=\"Seleccione una opci\u00F3n\" [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dropdown'\">\r\n <p-select [lazy]=\"isLoading\" [options]=\"dataFromService\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\"\r\n [optionLabel]=\"control.config.optionLabel\" [showClear]=\"control.config.showClear\"\r\n [optionValue]=\"control.field || control.config.optionValue\" appendTo=\"body\"\r\n placeholder=\"Seleccione una opci\u00F3n\" [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dropdown:replace'\">\r\n <p-select [lazy]=\"isLoading\" [options]=\"dataFromService\"\r\n (onChange)=\"sendValueFromObject($event)\" [optionLabel]=\"control.config.optionLabel\"\r\n appendTo=\"body\" placeholder=\"Seleccione una opci\u00F3n\"\r\n [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocomplete'\">\r\n <p-autoComplete [showEmptyMessage]=\"true\" [suggestions]=\"dataFromService\" appendTo=\"body\"\r\n (completeMethod)=\"loadDataFromControlBusquedaService($event)\" [field]=\"control.field\"\r\n [minLength]=\"1\" (onSelect)=\"sendValueFromObject($event)\" [(ngModel)]=\"tempValue\"\r\n [disabled]=\"control.disabled || false\"></p-autoComplete>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocompleteCustom'\">\r\n <p-autoComplete [showEmptyMessage]=\"true\" [suggestions]=\"dataFromService\" appendTo=\"body\"\r\n (completeMethod)=\"loadDataFromControlBusquedaService($event)\" \r\n [minLength]=\"1\" (onSelect)=\"sendValueFromObject($event)\" [(ngModel)]=\"tempValue\"\r\n [disabled]=\"control.disabled || false\"\r\n [field]=\"control.field\">\r\n <ng-template let-item pTemplate=\"item\">\r\n <div class=\"flex align-items-center gap-2\">\r\n <div>{{ item[control.config.optionValue] }} - {{ item[control.config.optionLabel] }}</div>\r\n </div>\r\n </ng-template>\r\n </p-autoComplete>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'input:search'\">\r\n <div class=\"p-inputgroup\">\r\n <input type=\"text\" pInputText [(ngModel)]=\"value\" (focusout)=\"sendValue()\"\r\n (keyup.enter)=\"doFocusOut()\" />\r\n <button type=\"button\" pButton icon=\"pi pi-search\" (click)=\"searchValue(value)\"></button>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'file'\">\r\n <sf-file-upload *ngIf=\"!isLoading\" [accept]=\"control.config?.accept || 'image/*,application/pdf'\"\r\n [loading]=\"uploadingFiles\" [files]=\"uploadedFiles\" [configName]=\"control.config?.configName\"\r\n [limit]=\"control.config?.limit || 1\" (onUpload)=\"onUpload($event)\"\r\n (onDeleteFile)=\"onDeleteFile($event)\"></sf-file-upload>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'calendar'\">\r\n <!-- <div class=\"p-col-12\">\r\n <p-inputgroup>\r\n <p-inputMask [(ngModel)]=\"tempValue\" [mask]=\"maskDate\" [placeholder]=\"control.placeholder\"\r\n (onBlur)=\"onChangeSDate($event)\" [disabled]=\"control.disabled || false\"></p-inputMask>\r\n <p-calendar\r\n [(ngModel)]=\"value\" class=\"only-icon\" [monthNavigator]=\"true\" [yearNavigator]=\"true\" yearRange=\"1900:2035\"\r\n [dateFormat]=\"control.format || 'yy-mm-dd'\" appendTo=\"body\" [disabled]=\"control.disabled || false\"\r\n [showOnFocus]=\"!control.hide\" [placeholder]=\"control.placeholder || 'aaaa-mm-dd'\"\r\n [touchUI]=\"control.touchUI || false\" [showIcon]=\"control.showIcon || false\" (onSelect)=\"onChangeDate()\"\r\n (onBlur)=\"onChangeDate()\"\r\n ></p-calendar>\r\n </p-inputgroup>\r\n \r\n </div> -->\r\n <p-datepicker\r\n [(ngModel)]=\"value\" inputId=\"icondisplay\" [monthNavigator]=\"true\" [yearNavigator]=\"true\" yearRange=\"1900:2035\"\r\n [dateFormat]=\"control.format || 'yy-mm-dd'\" appendTo=\"body\" [disabled]=\"control.disabled || false\"\r\n [showOnFocus]=\"control.hide\" [placeholder]=\"control.placeholder || 'aaaa-mm-dd'\"\r\n [showIcon]=\"control.showIcon || false\" (onSelect)=\"onChangeDate()\"\r\n (onBlur)=\"onChangeDate()\" [iconDisplay]=\"'input'\" class=\"p-0\"\r\n ></p-datepicker>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'numeric'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'currency'\">\r\n <p-inputNumber [ngModel]=\"value\" (ngModelChange)=\"value = $event; sendValue()\" mode=\"decimal\" [minFractionDigits]=\"control.minFractionDigits || 0\"\r\n [min]=\"control.min || null\" [max]=\"control.max || null\" (onInput)=\"sendNumberValue($event)\"\r\n [prefix]=\"control.currency || '$ '\" [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'decimal'\">\r\n <p-inputNumber [ngModel]=\"value\" mode=\"decimal\" (ngModelChange)=\"value = $event; sendValue()\" [min]=\"control.min || null\"\r\n [max]=\"control.max || null\" [minFractionDigits]=\"control.minFractionDigits || 0\"\r\n [locale]=\"control.locale || undefined\" [useGrouping]=\"control.useGrouping || false\"\r\n [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'percentage'\">\r\n <p-inputNumber [ngModel]=\"value\" suffix=\" %\" (ngModelChange)=\"value = $event; sendValue()\" (onInput)=\"sendValue()\" [min]=\"control.min || null\"\r\n [max]=\"control.max || null\" [minFractionDigits]=\"control.minFractionDigits || 2\"\r\n [locale]=\"control.locale || undefined\" [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'decimal:search'\">\r\n <div class=\"p-inputgroup\">\r\n <input type=\"number\" pInputText [(ngModel)]=\"value\" (focusout)=\"sendValue()\"\r\n (keyup.enter)=\"doFocusOut()\" />\r\n <button type=\"button\" pButton icon=\"pi pi-search\" (click)=\"searchValue(value)\"></button>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'array'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'file'\">\r\n <sf-file-upload *ngIf=\"!isLoading\" [loading]=\"uploadingFiles\" [files]=\"uploadedFiles\"\r\n [configName]=\"control.config?.configName\" [limit]=\"control.config?.limit || 1\"\r\n [accept]=\"control.config?.accept || 'image/*,application/pdf'\" (onUpload)=\"onUpload($event)\"\r\n (onDeleteFile)=\"onDeleteFile($event)\"></sf-file-upload>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'multiselect'\">\r\n <p-multiSelect [options]=\"dataFromService\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\"\r\n [optionLabel]=\"control.config?.optionLabel\" [optionValue]=\"control.config?.optionValue\"\r\n [placeholder]=\"control.config?.placeholder\"\r\n [display]=\"control.config?.display || 'chip'\"></p-multiSelect>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'boolean'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'switch'\">\r\n <p-inputSwitch [(ngModel)]=\"tempValue\" (onChange)=\"onChangeSwitch()\" [id]=\"label\"\r\n [trueValue]=\"control?.trueValue !== undefined ? control?.trueValue: null\"\r\n [falseValue]=\"control?.falseValue !== undefined ? control?.falseValue: null\"></p-inputSwitch>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'checkbox'\">\r\n <p-checkbox [(ngModel)]=\"tempCheckVal\" [binary]=\"control?.binary !== undefined ? control?.binary: true\" (onChange)=\"onCheckboxChange()\" />\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: ["::ng-deep .label-container{& label{margin-right:10px;color:#55585b;font-size:17px}& i{font-size:1.1rem}}::ng-deep .p-tooltip{max-width:15rem;font-size:.85rem;text-align:center}.control-container ::ng-deep .p-inputtext,.control-container ::ng-deep .p-inputwrapper,.control-container ::ng-deep .p-select,.control-container ::ng-deep .p-datepicker{width:100%}.control-container ::ng-deep .p-button:hover{background:var(--secondary-color)!important;border-color:var(--secondary-color)!important;filter:brightness(85%)}.control-container ::ng-deep .p-component,.control-container ::ng-deep .p-component *{border-radius:6px}.control-container ::ng-deep .p-inputtext{font-size:17px;border:1px solid #d1d5db;border-radius:6px}.control-container ::ng-deep .p-inputtext:focus,.control-container ::ng-deep .p-inputtext:active,.control-container ::ng-deep .p-inputwrapper:focus,.control-container ::ng-deep .p-inputwrapper:active{border-color:var(--button-color)}.control-container ::ng-deep .p-inputtext:enabled:focus{border-color:var(--secondary-color)!important;box-shadow:inset 0 0 0 1px #fff}.control-container ::ng-deep input.p-inputtext::placeholder{color:#6b7280;font-family:sans-serif;font-size:18px}.control-container ::ng-deep .p-dropdown{background:#fff;border:1px solid #d1d5db;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;border-radius:6px}.control-container ::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:var(--secondary-color)!important}.control-container ::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:var(--secondary-color)!important;box-shadow:inset 0 0 0 1px #fff}.control-container ::ng-deep .p-dropdown .p-inputtext{border:none}.control-container ::ng-deep .p-dropdown .p-dropdown-label.p-placeholder{font-family:sans-serif;color:#6b7280}.control-container ::ng-deep .p-button.p-button-danger,.control-container ::ng-deep .p-buttonset.p-button-danger>.p-button,.control-container ::ng-deep .p-splitbutton.p-button-danger>.p-button{border-color:var(--secondary-color)!important;background:var(--secondary-color)!important}.control-container ::ng-deep .p-inputgroup button:last-child{border-top-right-radius:6px;border-bottom-right-radius:6px}.control-container ::ng-deep .p-inputgroup input:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.control-container ::ng-deep .p-inputgroup input:first-child{border-top-left-radius:6px;border-bottom-left-radius:6px}.control-container ::ng-deep .p-datepicker{padding:0}.control-container ::ng-deep .p-datepicker-touch-ui .p-datepicker-title{padding:0}.control-container ::ng-deep .p-datepicker-month,.control-container ::ng-deep .p-datepicker-month:focus,.control-container ::ng-deep .p-datepicker-year:focus,.control-container ::ng-deep .p-datepicker-year{border:none}::ng-deep .d-none{display:none!important}.p-inputgroup{p-calendar{display:contents;::ng-deep input{display:none!important}::ng-deep .p-button-icon-only{border-top-left-radius:0;border-bottom-left-radius:0;width:100%;height:100%}}p-inputMask{display:contents;::ng-deep input{border-top-right-radius:0;border-bottom-right-radius:0}}}@media (max-width <=768px){:host{font-size:14px}}\n"] }]
|
|
2094
|
+
args: [{ selector: 'sf-control', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, FormsModule,
|
|
2095
|
+
InputTextModule, TextareaModule, InputMaskModule, SelectModule, MultiSelectModule, AutoCompleteModule, ButtonModule, FileUploadComponent,
|
|
2096
|
+
DatePickerModule, InputNumberModule, InputSwitchModule, CheckboxModule, InputGroupModule, InputGroupAddonModule, TooltipModule
|
|
2097
|
+
], standalone: true, template: "<ng-container *ngIf=\"showTempValue\"><p *ngIf=\"tempValue\">{{tempValue[control.field]}}</p></ng-container>\r\n\r\n<div *ngIf=\"!showTempValue\" [ngSwitch]=\"control.type\" #cc class=\"control-container ml-0\" \r\n[ngClass]=\"control.labelPosition === 'horizontal' ? (control.reverse ? 'flex gap-2 flex-row-reverse items-left' : 'flex gap-2 items-left') : (control.reverse ? 'flex flex-column flex-column-reverse' : 'flex flex-column')\">\r\n <div class=\"label-container\">\r\n <label [for]=\"label\">{{label}}</label>\r\n <i #tooltip *ngIf=\"control.tooltip\" class=\"pi pi-question-circle\"\r\n [tooltipPosition]=\"control.tooltipPosition || 'top'\" [pTooltip]=\"control.tooltip\"\r\n (touchstart)=\"onTouchDescription()\" (touchend)=\"onUnTouchDescription()\"></i>\r\n </div>\r\n\r\n <ng-container *ngSwitchCase=\"'string'\" >\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'input'\">\r\n <input pInputText [name]=\"label\" type=\"text\" [(ngModel)]=\"value\" (input)=\"sendValue()\"\r\n [disabled]=\"control.disabled || false\" [autocomplete]=\"control.autocomplete || 'off'\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'textarea'\">\r\n <textarea [rows]=\"control.config?.rows ? control.config.rows : 4\" [(ngModel)]=\"value\"\r\n (input)=\"sendValue()\" pInputTextarea [disabled]=\"control.config?.disabled || false\"\r\n [autoResize]=\"control.config?.autoresize || false\"></textarea>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'password'\">\r\n <input pInputText type=\"password\" [(ngModel)]=\"value\" (input)=\"sendValue()\"\r\n [disabled]=\"control.disabled || false\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'email'\">\r\n <input pInputText type=\"text\" [(ngModel)]=\"value\" placeholder=\"email@example.com\"\r\n [disabled]=\"control.disabled || false\" autocomplete=\"email\" (input)=\"onInputEmail(false)\"\r\n (focusout)=\"onInputEmail(true)\" (keyup.enter)=\"doFocusOut()\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'phone'\">\r\n <p-inputMask mask=\"(999) 999-9999\" [(ngModel)]=\"value\" placeholder=\"(999) 999-9999\"\r\n [disabled]=\"control.disabled || false\" autocomplete=\"tel-national\"\r\n [unmask]=\"control.unmask || false\" (onComplete)=\"sendValue()\"></p-inputMask>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'address'\">\r\n <input pInputText type=\"text\" [value]=\"value | formatAddress: control.separador\" autocomplete=\"off\" [disabled]=\"clicked\" (keydown)=\"onClickedAddres()\" (focus)=\"onClickedAddres()\">\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'enum'\">\r\n <p-select [options]=\"control.enum\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\" appendTo=\"body\"\r\n placeholder=\"Seleccione una opci\u00F3n\" [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dropdown'\">\r\n <p-select [lazy]=\"isLoading\" [options]=\"dataFromService\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\"\r\n [optionLabel]=\"control.config.optionLabel\" [showClear]=\"control.config.showClear\"\r\n [optionValue]=\"control.field || control.config.optionValue\" appendTo=\"body\"\r\n placeholder=\"Seleccione una opci\u00F3n\" [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dropdown:replace'\">\r\n <p-select [lazy]=\"isLoading\" [options]=\"dataFromService\"\r\n (onChange)=\"sendValueFromObject($event)\" [optionLabel]=\"control.config.optionLabel\"\r\n appendTo=\"body\" placeholder=\"Seleccione una opci\u00F3n\"\r\n [disabled]=\"control.disabled || false\"></p-select>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocomplete'\">\r\n <p-autoComplete [showEmptyMessage]=\"true\" [suggestions]=\"dataFromService\" appendTo=\"body\"\r\n (completeMethod)=\"loadDataFromControlBusquedaService($event)\" [field]=\"control.field\"\r\n [minLength]=\"1\" (onSelect)=\"sendValueFromObject($event)\" [(ngModel)]=\"tempValue\"\r\n [disabled]=\"control.disabled || false\" (onClear)=\"setValue.emit(null)\"></p-autoComplete>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'autocompleteCustom'\">\r\n <p-autoComplete [showEmptyMessage]=\"true\" [suggestions]=\"dataFromService\" appendTo=\"body\"\r\n (completeMethod)=\"loadDataFromControlBusquedaService($event)\" \r\n [minLength]=\"1\" (onSelect)=\"sendValueFromObject($event)\" [(ngModel)]=\"tempValue\"\r\n [disabled]=\"control.disabled || false\"\r\n [field]=\"control.field\" (onClear)=\"setValue.emit(null)\">\r\n <ng-template let-item pTemplate=\"item\">\r\n <div class=\"flex align-items-center gap-2\">\r\n <div>{{ item._display }}</div>\r\n </div>\r\n </ng-template>\r\n </p-autoComplete>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'input:search'\">\r\n <div class=\"p-inputgroup\">\r\n <input type=\"text\" pInputText [(ngModel)]=\"value\" (focusout)=\"sendValue()\"\r\n (keyup.enter)=\"doFocusOut()\" />\r\n <button type=\"button\" pButton icon=\"pi pi-search\" (click)=\"searchValue(value)\"></button>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'file'\">\r\n <sf-file-upload *ngIf=\"!isLoading\" [accept]=\"control.config?.accept || 'image/*,application/pdf'\"\r\n [loading]=\"uploadingFiles\" [files]=\"uploadedFiles\" [configName]=\"control.config?.configName\"\r\n [limit]=\"control.config?.limit || 1\" (onUpload)=\"onUpload($event)\"\r\n (onDeleteFile)=\"onDeleteFile($event)\"></sf-file-upload>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'calendar'\">\r\n <!-- <div class=\"p-col-12\">\r\n <p-inputgroup>\r\n <p-inputMask [(ngModel)]=\"tempValue\" [mask]=\"maskDate\" [placeholder]=\"control.placeholder\"\r\n (onBlur)=\"onChangeSDate($event)\" [disabled]=\"control.disabled || false\"></p-inputMask>\r\n <p-calendar\r\n [(ngModel)]=\"value\" class=\"only-icon\" [monthNavigator]=\"true\" [yearNavigator]=\"true\" yearRange=\"1900:2035\"\r\n [dateFormat]=\"control.format || 'yy-mm-dd'\" appendTo=\"body\" [disabled]=\"control.disabled || false\"\r\n [showOnFocus]=\"!control.hide\" [placeholder]=\"control.placeholder || 'aaaa-mm-dd'\"\r\n [touchUI]=\"control.touchUI || false\" [showIcon]=\"control.showIcon || false\" (onSelect)=\"onChangeDate()\"\r\n (onBlur)=\"onChangeDate()\"\r\n ></p-calendar>\r\n </p-inputgroup>\r\n \r\n </div> -->\r\n <p-datepicker\r\n [(ngModel)]=\"value\" inputId=\"icondisplay\" [monthNavigator]=\"true\" [yearNavigator]=\"true\" yearRange=\"1900:2035\"\r\n [dateFormat]=\"control.format || 'yy-mm-dd'\" appendTo=\"body\" [disabled]=\"control.disabled || false\"\r\n [showOnFocus]=\"control.hide\" [placeholder]=\"control.placeholder || 'aaaa-mm-dd'\"\r\n [showIcon]=\"control.showIcon || false\" (onSelect)=\"onChangeDate()\"\r\n (onBlur)=\"onChangeDate()\" [iconDisplay]=\"'input'\" class=\"p-0\"\r\n ></p-datepicker>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'numeric'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'currency'\">\r\n <p-inputNumber [ngModel]=\"value\" (ngModelChange)=\"value = $event; sendValue()\" mode=\"decimal\" [minFractionDigits]=\"control.minFractionDigits || 0\"\r\n [min]=\"control.min || null\" [max]=\"control.max || null\" (onInput)=\"sendNumberValue($event)\"\r\n [prefix]=\"control.currency || '$ '\" [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'decimal'\">\r\n <p-inputNumber [ngModel]=\"value\" mode=\"decimal\" (ngModelChange)=\"value = $event; sendValue()\" [min]=\"control.min || null\"\r\n [max]=\"control.max || null\" [minFractionDigits]=\"control.minFractionDigits || 0\"\r\n [locale]=\"control.locale || undefined\" [useGrouping]=\"control.useGrouping || false\"\r\n [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'percentage'\">\r\n <p-inputNumber [ngModel]=\"value\" suffix=\" %\" (ngModelChange)=\"value = $event; sendValue()\" (onInput)=\"sendValue()\" [min]=\"control.min || null\"\r\n [max]=\"control.max || null\" [minFractionDigits]=\"control.minFractionDigits || 2\"\r\n [locale]=\"control.locale || undefined\" [disabled]=\"control.disabled || false\"></p-inputNumber>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'decimal:search'\">\r\n <p-inputgroup>\r\n <input type=\"number\" pInputText [(ngModel)]=\"value\" (focusout)=\"sendValue()\"\r\n (keyup.enter)=\"doFocusOut()\" />\r\n <button type=\"button\" pButton icon=\"pi pi-search\" (click)=\"searchValue(value)\"></button>\r\n </p-inputgroup>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'array'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'file'\">\r\n <sf-file-upload *ngIf=\"!isLoading\" [loading]=\"uploadingFiles\" [files]=\"uploadedFiles\"\r\n [configName]=\"control.config?.configName\" [limit]=\"control.config?.limit || 1\"\r\n [accept]=\"control.config?.accept || 'image/*,application/pdf'\" (onUpload)=\"onUpload($event)\"\r\n (onDeleteFile)=\"onDeleteFile($event)\"></sf-file-upload>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'multiselect'\">\r\n <p-multiSelect [options]=\"dataFromService\" [(ngModel)]=\"value\" (onChange)=\"sendValue()\"\r\n [optionLabel]=\"control.config?.optionLabel\" [optionValue]=\"control.config?.optionValue\"\r\n [placeholder]=\"control.config?.placeholder\"\r\n [display]=\"control.config?.display || 'chip'\"></p-multiSelect>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'boolean'\">\r\n <ng-container [ngSwitch]=\"control.subtype\">\r\n <ng-container *ngSwitchCase=\"'switch'\">\r\n <p-inputSwitch [(ngModel)]=\"tempValue\" (onChange)=\"onChangeSwitch()\" [id]=\"label\"\r\n [trueValue]=\"control?.trueValue !== undefined ? control?.trueValue: null\"\r\n [falseValue]=\"control?.falseValue !== undefined ? control?.falseValue: null\"></p-inputSwitch>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'checkbox'\">\r\n <p-checkbox [(ngModel)]=\"tempCheckVal\" [binary]=\"control?.binary !== undefined ? control?.binary: true\" (onChange)=\"onCheckboxChange()\" />\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: ["::ng-deep .label-container{& label{margin-right:10px;color:#55585b;font-size:17px}& i{font-size:1.1rem}}::ng-deep .p-tooltip{max-width:15rem;font-size:.85rem;text-align:center}.control-container ::ng-deep .p-inputtext,.control-container ::ng-deep .p-inputwrapper,.control-container ::ng-deep .p-select,.control-container ::ng-deep .p-datepicker{width:100%}.control-container ::ng-deep .p-button:hover{background:var(--secondary-color)!important;border-color:var(--secondary-color)!important;filter:brightness(85%)}.control-container ::ng-deep .p-component,.control-container ::ng-deep .p-component *{border-radius:6px}.control-container ::ng-deep .p-inputtext{font-size:17px;border:1px solid #d1d5db;border-radius:6px}.control-container ::ng-deep .p-inputtext:focus,.control-container ::ng-deep .p-inputtext:active,.control-container ::ng-deep .p-inputwrapper:focus,.control-container ::ng-deep .p-inputwrapper:active{border-color:var(--button-color)}.control-container ::ng-deep .p-inputtext:enabled:focus{border-color:var(--secondary-color)!important;box-shadow:inset 0 0 0 1px #fff}.control-container ::ng-deep input.p-inputtext::placeholder{color:#6b7280;font-family:sans-serif;font-size:18px}.control-container ::ng-deep .p-dropdown{background:#fff;border:1px solid #d1d5db;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;border-radius:6px}.control-container ::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:var(--secondary-color)!important}.control-container ::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:var(--secondary-color)!important;box-shadow:inset 0 0 0 1px #fff}.control-container ::ng-deep .p-dropdown .p-inputtext{border:none}.control-container ::ng-deep .p-dropdown .p-dropdown-label.p-placeholder{font-family:sans-serif;color:#6b7280}.control-container ::ng-deep .p-button.p-button-danger,.control-container ::ng-deep .p-buttonset.p-button-danger>.p-button,.control-container ::ng-deep .p-splitbutton.p-button-danger>.p-button{border-color:var(--secondary-color)!important;background:var(--secondary-color)!important}.control-container ::ng-deep .p-inputgroup button:last-child{border-top-right-radius:6px;border-bottom-right-radius:6px}.control-container ::ng-deep .p-inputgroup input:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.control-container ::ng-deep .p-inputgroup input:first-child{border-top-left-radius:6px;border-bottom-left-radius:6px}.control-container ::ng-deep .p-datepicker{padding:0}.control-container ::ng-deep .p-datepicker-touch-ui .p-datepicker-title{padding:0}.control-container ::ng-deep .p-datepicker-month,.control-container ::ng-deep .p-datepicker-month:focus,.control-container ::ng-deep .p-datepicker-year:focus,.control-container ::ng-deep .p-datepicker-year{border:none}::ng-deep .d-none{display:none!important}.p-inputgroup{p-calendar{display:contents;::ng-deep input{display:none!important}::ng-deep .p-button-icon-only{border-top-left-radius:0;border-bottom-left-radius:0;width:100%;height:100%}}p-inputMask{display:contents;::ng-deep input{border-top-right-radius:0;border-bottom-right-radius:0}}}@media (max-width <=768px){:host{font-size:14px}}\n"] }]
|
|
2124
2098
|
}], ctorParameters: () => [{ type: GeneralService }, { type: SfCrudService }, { type: i0.ChangeDetectorRef }, { type: NotificationService }], propDecorators: { showTempValue: [{
|
|
2125
2099
|
type: Input
|
|
2126
2100
|
}], control: [{
|
|
@@ -2137,13 +2111,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
2137
2111
|
type: Output
|
|
2138
2112
|
}], addressClicked: [{
|
|
2139
2113
|
type: Output
|
|
2114
|
+
}], setDependencyValue: [{
|
|
2115
|
+
type: Output
|
|
2140
2116
|
}], tooltips: [{
|
|
2141
2117
|
type: ViewChildren,
|
|
2142
2118
|
args: [Tooltip]
|
|
2143
2119
|
}] } });
|
|
2144
2120
|
|
|
2145
2121
|
class FormComponent {
|
|
2146
|
-
messageService;
|
|
2147
2122
|
crudService;
|
|
2148
2123
|
domSanitizer;
|
|
2149
2124
|
stepService;
|
|
@@ -2172,8 +2147,7 @@ class FormComponent {
|
|
|
2172
2147
|
loading;
|
|
2173
2148
|
subscription = undefined;
|
|
2174
2149
|
tooltips;
|
|
2175
|
-
constructor(
|
|
2176
|
-
this.messageService = messageService;
|
|
2150
|
+
constructor(crudService, domSanitizer, stepService, adoService, jwtService) {
|
|
2177
2151
|
this.crudService = crudService;
|
|
2178
2152
|
this.domSanitizer = domSanitizer;
|
|
2179
2153
|
this.stepService = stepService;
|
|
@@ -2328,9 +2302,7 @@ class FormComponent {
|
|
|
2328
2302
|
this.buildControls();
|
|
2329
2303
|
}
|
|
2330
2304
|
this.crudService.applyValuesOnEvent('onChange', this.esquema, undefined, this.data);
|
|
2331
|
-
|
|
2332
|
-
sendNotification(message) {
|
|
2333
|
-
this.messageService.add(message);
|
|
2305
|
+
console.log(this.data);
|
|
2334
2306
|
}
|
|
2335
2307
|
applyValuesFromObject(event) {
|
|
2336
2308
|
if (event.optionValue) {
|
|
@@ -2538,13 +2510,18 @@ class FormComponent {
|
|
|
2538
2510
|
const property = subEl.scope.split('.').pop();
|
|
2539
2511
|
return arrayData && arrayData[k] && subEl.default ? arrayData[k][property] : null;
|
|
2540
2512
|
}
|
|
2541
|
-
|
|
2542
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: FormComponent, isStandalone: false, selector: "app-form", inputs: { uiEsquema: "uiEsquema", esquema: "esquema", data: "data", isDialog: "isDialog", isAddressDialog: "isAddressDialog", separador: "separador" }, host: { properties: { "style.--primary-color": "this.color", "style.--secondary-color": "this.color2", "style.--button-color": "this.colorButton" } }, viewQueries: [{ propertyName: "tooltips", predicate: Tooltip, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"controlsLoaded\" class=\"frm-container\">\r\n <ng-container *ngIf=\"isAddressDialog && currentAddress\">\r\n Direcci\u00F3n actual: {{currentAddress | formatAddress: separador}}\r\n <br>\r\n </ng-container>\r\n <br>\r\n <ng-container *ngIf=\"isAddressDialog\">\r\n Direcci\u00F3n nueva: {{newAddress | formatAddress: separador}}\r\n </ng-container>\r\n <p-fluid>\r\n <div *ngFor=\"let element of uiEsquema.elements; let i = index\" [class]=\"element?.class\" #a>\r\n <ng-container [ngSwitch]=\"element.type\" *ngIf=\"visible[i][0]\">\r\n <div class=\"label\" *ngSwitchCase=\"'Label'\" [style]=\"element?.style\">\r\n {{element?.label}}\r\n </div>\r\n <ng-container *ngSwitchCase=\"'HorizontalLayout'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\" *ngIf=\"visible[i][j]\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"controls[i][j]\" [label]=\"el.label\"\r\n [value]=\"values[i][j]\" (setValue)=\"setValue($event, el.scope, i, j)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"></sf-control>\r\n <div *ngSwitchCase=\"'Texto'\" [ngStyle]=\"{'height': '100%', 'margin-block': 'auto'}\">\r\n <p>{{el.label}}</p>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'VerticalLayout'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\" *ngIf=\"visible[i][j]\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"controls[i][j]\" [label]=\"el.label\"\r\n [value]=\"values[i][j]\" (setValue)=\"setValue($event, el.scope, i, j)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"></sf-control>\r\n <div *ngSwitchCase=\"'PDF'\" class=\"pdf\">\r\n <iframe [src]=\"values[i][j]\" frameborder=\"0\" allow=\"geolocation *; camera *;\"></iframe>\r\n </div>\r\n <div *ngSwitchCase=\"'PDF-SIGN'\">\r\n <sf-sign [allowDownload]=\"true\" [idkatios]=\"idKatios\" [tdoc]=\"data.pdf.tdoc\" [ndoc]=\"data.pdf.ndoc\"\r\n [idDocument]=\"data.pdf.id\" [typeDocument]=\"data.pdf.idDoc\"\r\n (stateDocument)=\"onStateDocument($event)\"></sf-sign>\r\n </div>\r\n <ng-container *ngSwitchCase=\"'SIMULADOR'\">\r\n <sf-simulador [simulador]=\"data\" [otherToolTips]=\"data.otherTooltips\"\r\n (simuladorChange)=\"onSimuladorChange($event)\" (enProceso)=\"emitLoadingForm($event)\"></sf-simulador>\r\n </ng-container>\r\n <div *ngSwitchCase=\"'ADO'\" class=\"buttons\">\r\n <p-button *ngIf=\"!data?.ADO?.dataProceso?.idProceso\" [ngStyle]=\"el?.ngStyle\" (click)=\"goToADO()\" label=\"Validar identidad\"></p-button>\r\n </div>\r\n <div *ngSwitchCase=\"'ADO'\">\r\n <div *ngIf=\"data?.ADO?.dataProceso?.idProceso\">\r\n <div class=\"data-ado-container\">\r\n <ng-container *ngIf=\"proceso\">\r\n <i *ngIf=\"proceso?.respuestaProceso?.EsExitoso === true\" pTooltip=\"Validado\" tooltipPosition=\"top\" id=\"Validado\" class=\"pi pi-user\" style=\"color: green\"\r\n (touchstart)=\"onTouchDescription('Validado', false)\" (touchend)=\"onUnTouchDescription('Validado')\"></i>\r\n <i *ngIf=\"proceso?.respuestaProceso?.EsExitoso === false\" pTooltip=\"No validado\" tooltipPosition=\"top\" id=\"No-Validado\" class=\"pi pi-user\" style=\"color: red\"\r\n (touchstart)=\"onTouchDescription('No-Validado', false)\" (touchend)=\"onUnTouchDescription('No-Validado')\"></i>\r\n <i *ngIf=\"!proceso?.respuestaProceso\" pTooltip=\"Sin validar\" tooltipPosition=\"top\" class=\"pi pi-user\" id=\"Sin-Validar\" style=\"color: gray\"\r\n (touchstart)=\"onTouchDescription('Sin-Validar', false)\" (touchend)=\"onUnTouchDescription('Sin-Validar')\"></i>\r\n </ng-container>\r\n <div class=\"buttons\">\r\n <button pButton icon=\"pi pi-external-link\" (click)=\"goToADO()\" pTooltip=\"Abrir\" [disabled]=\"!proceso\"></button>\r\n <button pButton icon=\"pi pi-copy\" (click)=\"copyToClipboard(proceso.id)\" pTooltip=\"Copiar\" [disabled]=\"!proceso\"></button>\r\n <button pButton icon=\"pi pi-refresh\" (click)=\"refreshIntegracion(proceso.id)\" pTooltip=\"Refrescar\" [disabled]=\"!proceso\"></button>\r\n </div>\r\n </div>\r\n <p class=\"result-ado\" *ngIf=\"proceso && !proceso.respuestaProceso && proceso.estado == 'PROCESANDO'\">Procesando</p>\r\n <p class=\"result-ado\" *ngIf=\"proceso && proceso.respuestaProceso && proceso.estado == 'TERMINADO'\">{{proceso.respuestaProceso.Detalle ?? proceso.respuestaProceso.Mensaje}}</p>\r\n </div>\r\n </div>\r\n <ng-container *ngSwitchCase=\"'Table'\">\r\n <p-table [value]=\"values[i][j]\" [columns]=\"controls[i][j].config.columns\">\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n <button pButton pRipple icon=\"pi pi-plus\" (click)=\"addObjectArray(el)\"\r\n class=\"p-button-success\" [disabled]=\"controls[i][j].disabled === true\"></button>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr>\r\n <th *ngFor=\"let col of columns\">\r\n {{col.label}}\r\n </th>\r\n <ng-container>\r\n <th></th>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-rowIndex=\"rowIndex\">\r\n <tr>\r\n <ng-container *ngFor=\"let col of columns\" [ngSwitch]=\"col.type\">\r\n <ng-container *ngSwitchCase=\"'control'\">\r\n <sf-control [control]=\"extracControlFromTableElements(i, j, col)\" [label]=\"\"\r\n [value]=\"extracValueFromTableElements(i, j, rowIndex, col)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (setValue)=\"setValue($event, extracValueFromTableElements(i, j, rowIndex, col).scope, i, j)\"\r\n [showTempValue]=\"true\"\r\n >\r\n </sf-control>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'text'\">\r\n <td>{{rowData[col.col]}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'address'\">\r\n <td>{{rowData[col.col] | formatAddress: extracControlFromTableElements(i, j, col).separador }}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'currency:USD'\">\r\n <td>{{rowData[col.col] | currency: 'USD'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date:yyyy-mm-dd'\">\r\n <td>{{rowData[col.col] | date: 'yyyy-mm-dd'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date:dd/mm/yyyy'\">\r\n <td>{{rowData[col.col] | date: 'dd/MM/yyyy'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'boolean'\">\r\n <td>\r\n <i *ngIf=\"rowData[col.col]\" class=\"pi pi-check\"></i>\r\n <i *ngIf=\"!rowData[col.col]\" class=\"pi pi-times\"></i>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container>\r\n <td>\r\n <button pButton pRipple type=\"button\"\r\n (click)=\"editRow(el, rowData, rowIndex)\" icon=\"pi pi-pencil\"\r\n class=\"p-button-rounded p-button-info mr-1\"></button>\r\n <button pButton pRipple type=\"button\" (click)=\"deleteRow(el, rowIndex)\" [disabled]=\"controls[i][j].disabled === true\"\r\n icon=\"pi pi-trash\" class=\"p-button-rounded p-button-danger\"></button>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'ArrayLayout'\">\r\n <div class=\"col-12\">\r\n <div *ngIf=\"element.addButton\" class=\"flex items-center justify-content-between mb-2\">\r\n <p-button [icon]=\"element.addButton.icon\" [label]=\"element.addButton.label\" (click)=\"addArrayItem(element, i)\" [severity]=\"element.addButton.severity || 'primary'\"/>\r\n </div>\r\n </div>\r\n <div *ngFor=\"let arrayItem of getArrayItems(element.scope); let arrayIndex = index\" [ngClass]=\"element.classElements || 'flex align-items-center w-full'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"getControl(el,arrayIndex)\" [label]=\"el.label\"\r\n [value]=\"values[i][j] || getValueFromData(element,el,arrayIndex)\" (setValue)=\"setValue($event, el.scope, i, j,arrayIndex)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"></sf-control>\r\n </ng-container>\r\n </div>\r\n <p-button *ngIf=\"element.deleteButton && !(element.deleteButton.hide?.index === arrayIndex)\" [icon]=\"element.deleteButton.icon\" [rounded]=\"element.deleteButton.rounded || false\" [text]=\"element.deleteButton.text || true\" [severity]=\"element.deleteButton.severity || 'danger'\" (click)=\"removeArrayItem(element, i, arrayIndex)\" \r\n [label]=\"element.deleteButton.label\" />\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </p-fluid>\r\n</div>\r\n\r\n<p-toast *ngIf=\"isDialog\"></p-toast>\r\n", styles: [":not(.col-12) .label{display:flex;justify-content:center;align-items:center;padding-inline:.5rem;margin-bottom:15px;margin-top:20px;border-radius:13px;font-size:18px;font-size:inherit;background-color:var(--primary-color);text-align:center;color:var(--normal-text-color)}.pdf{display:flex;width:100%;height:80vh;& iframe{width:80%;margin-inline:10%}}.data-ado-container{display:flex;margin-inline:auto;align-items:center;width:fit-content;>*{margin-inline:4px}>div{display:flex;align-items:center;>*{margin-inline:4px}}}i.pi-user{font-size:2rem}.result-ado{min-height:1rem;text-align:center}sf-simulador{display:flow-root;width:80%;margin-inline:auto;margin-bottom:35px}sf-sign{display:block;margin-inline:auto;width:80%;& pdf-viewer{min-height:130vh!important;max-height:130vh!important}}.buttons{display:flex;justify-content:space-evenly}::ng-deep *{box-shadow:none}.frm-container ::ng-deep .p-inputtext:focus,.frm-container ::ng-deep .p-inputtext:active,.frm-container ::ng-deep .p-inputwrapper:focus,.frm-container ::ng-deep .p-inputwrapper:active{border-color:var(--button-color)}.frm-container ::ng-deep :not(:disabled):active,.frm-container ::ng-deep :not(.p-disabled) .p-inputtext:hover,.frm-container ::ng-deep :not(.p-disabled) .p-inputwrapper:hover,.frm-container ::ng-deep :not(.p-disabled) .p-inputwrapper-focus,.frm-container ::ng-deep .p-radiobutton-box .p-highlight,.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled):hover{border-color:var(--button-color)}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{background:var(--button-color);border-color:var(--button-color)!important}@media screen and (max-width:765px){:not(.col-12) .label{height:fit-content}.field{margin-bottom:.5rem}.pdf>iframe{width:100%;margin-inline:0}sf-sign{width:100%;& pdf-viewer{min-height:60vh!important;max-height:120vh!important}}sf-simulador{display:block;width:100%;margin-inline:auto}.data-ado-container{text-align:center;.buttons{max-width:80vw;flex-direction:row}}.buttons{flex-direction:column;align-items:center}}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled):not(.p-highlight):hover{border-color:var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight:not(.p-disabled):hover{color:var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled).p-focus{box-shadow:inset 0 0 0 1px var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box .p-radiobutton-icon{background-color:#fff}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover{background-color:#e5e7eb}.frm-container ::ng-deep .p-slider{background-color:#e5e7eb}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover .p-slider-range{background-color:var(--primary-color)!important}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover .p-slider-handle{border-color:var(--primary-color)!important}\n"], dependencies: [{ kind: "component", type: i6.SignComponent, selector: "sf-sign", inputs: ["idkatios", "tdoc", "ndoc", "idDocument", "typeDocument", "allowDownload"], outputs: ["stateDocument", "loading"] }, { kind: "component", type: i7$1.SfSimuladorComponent, selector: "sf-simulador", inputs: ["simulador", "otherToolTips", "labels"], outputs: ["simuladorChange", "enProceso"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i8.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i8.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i9$1.Fluid, selector: "p-fluid" }, { kind: "directive", type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i10.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i10.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i15.Ripple, selector: "[pRipple]" }, { kind: "component", type: i18.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i13$2.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "life", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "directive", type: i17$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: ControlComponent, selector: "sf-control", inputs: ["showTempValue", "control", "label", "value", "appendTo"], outputs: ["setValue", "sendObject", "addressClicked"] }, { kind: "pipe", type: i10.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i10.DatePipe, name: "date" }, { kind: "pipe", type: FormatAddressPipe, name: "formatAddress" }] });
|
|
2513
|
+
setDependencyValue(value, i, j, k) {
|
|
2514
|
+
if (!value.scope)
|
|
2515
|
+
return;
|
|
2516
|
+
this.setValue(value.data, value.scope, i, j, k);
|
|
2517
|
+
}
|
|
2518
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FormComponent, deps: [{ token: SfCrudService }, { token: i2$1.DomSanitizer }, { token: StepService }, { token: i4.AdoService }, { token: i4.JWTService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2519
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: FormComponent, isStandalone: true, selector: "app-form", inputs: { uiEsquema: "uiEsquema", esquema: "esquema", data: "data", isDialog: "isDialog", isAddressDialog: "isAddressDialog", separador: "separador" }, host: { properties: { "style.--primary-color": "this.color", "style.--secondary-color": "this.color2", "style.--button-color": "this.colorButton" } }, viewQueries: [{ propertyName: "tooltips", predicate: Tooltip, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"controlsLoaded\" class=\"frm-container\">\r\n <ng-container *ngIf=\"isAddressDialog && currentAddress\">\r\n Direcci\u00F3n actual: {{currentAddress | formatAddress: separador}}\r\n <br>\r\n </ng-container>\r\n <br>\r\n <ng-container *ngIf=\"isAddressDialog\">\r\n Direcci\u00F3n nueva: {{newAddress | formatAddress: separador}}\r\n </ng-container>\r\n <p-fluid>\r\n <div *ngFor=\"let element of uiEsquema.elements; let i = index\" [class]=\"element?.class\" #a>\r\n <ng-container [ngSwitch]=\"element.type\" *ngIf=\"visible[i][0]\">\r\n <div class=\"label\" *ngSwitchCase=\"'Label'\" [style]=\"element?.style\">\r\n {{element?.label}}\r\n </div>\r\n <ng-container *ngSwitchCase=\"'HorizontalLayout'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\" *ngIf=\"visible[i][j]\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"controls[i][j]\" [label]=\"el.label\"\r\n [value]=\"values[i][j]\" (setValue)=\"setValue($event, el.scope, i, j)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"></sf-control>\r\n <div *ngSwitchCase=\"'Texto'\" [ngStyle]=\"{'height': '100%', 'margin-block': 'auto'}\">\r\n <p>{{el.label}}</p>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'VerticalLayout'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\" *ngIf=\"visible[i][j]\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"controls[i][j]\" [label]=\"el.label\"\r\n [value]=\"values[i][j]\" (setValue)=\"setValue($event, el.scope, i, j)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"></sf-control>\r\n <div *ngSwitchCase=\"'PDF'\" class=\"pdf\">\r\n <iframe [src]=\"values[i][j]\" frameborder=\"0\" allow=\"geolocation *; camera *;\"></iframe>\r\n </div>\r\n <div *ngSwitchCase=\"'PDF-SIGN'\">\r\n <sf-sign [allowDownload]=\"true\" [idkatios]=\"idKatios\" [tdoc]=\"data.pdf.tdoc\" [ndoc]=\"data.pdf.ndoc\"\r\n [idDocument]=\"data.pdf.id\" [typeDocument]=\"data.pdf.idDoc\"\r\n (stateDocument)=\"onStateDocument($event)\"></sf-sign>\r\n </div>\r\n <ng-container *ngSwitchCase=\"'SIMULADOR'\">\r\n <sf-simulador [simulador]=\"data\" [otherToolTips]=\"data.otherTooltips\"\r\n (simuladorChange)=\"onSimuladorChange($event)\" (enProceso)=\"emitLoadingForm($event)\"></sf-simulador>\r\n </ng-container>\r\n <div *ngSwitchCase=\"'ADO'\" class=\"buttons\">\r\n <p-button *ngIf=\"!data?.ADO?.dataProceso?.idProceso\" [ngStyle]=\"el?.ngStyle\" (click)=\"goToADO()\" label=\"Validar identidad\"></p-button>\r\n </div>\r\n <div *ngSwitchCase=\"'ADO'\">\r\n <div *ngIf=\"data?.ADO?.dataProceso?.idProceso\">\r\n <div class=\"data-ado-container\">\r\n <ng-container *ngIf=\"proceso\">\r\n <i *ngIf=\"proceso?.respuestaProceso?.EsExitoso === true\" pTooltip=\"Validado\" tooltipPosition=\"top\" id=\"Validado\" class=\"pi pi-user\" style=\"color: green\"\r\n (touchstart)=\"onTouchDescription('Validado', false)\" (touchend)=\"onUnTouchDescription('Validado')\"></i>\r\n <i *ngIf=\"proceso?.respuestaProceso?.EsExitoso === false\" pTooltip=\"No validado\" tooltipPosition=\"top\" id=\"No-Validado\" class=\"pi pi-user\" style=\"color: red\"\r\n (touchstart)=\"onTouchDescription('No-Validado', false)\" (touchend)=\"onUnTouchDescription('No-Validado')\"></i>\r\n <i *ngIf=\"!proceso?.respuestaProceso\" pTooltip=\"Sin validar\" tooltipPosition=\"top\" class=\"pi pi-user\" id=\"Sin-Validar\" style=\"color: gray\"\r\n (touchstart)=\"onTouchDescription('Sin-Validar', false)\" (touchend)=\"onUnTouchDescription('Sin-Validar')\"></i>\r\n </ng-container>\r\n <div class=\"buttons\">\r\n <button pButton icon=\"pi pi-external-link\" (click)=\"goToADO()\" pTooltip=\"Abrir\" [disabled]=\"!proceso\"></button>\r\n <button pButton icon=\"pi pi-copy\" (click)=\"copyToClipboard(proceso.id)\" pTooltip=\"Copiar\" [disabled]=\"!proceso\"></button>\r\n <button pButton icon=\"pi pi-refresh\" (click)=\"refreshIntegracion(proceso.id)\" pTooltip=\"Refrescar\" [disabled]=\"!proceso\"></button>\r\n </div>\r\n </div>\r\n <p class=\"result-ado\" *ngIf=\"proceso && !proceso.respuestaProceso && proceso.estado == 'PROCESANDO'\">Procesando</p>\r\n <p class=\"result-ado\" *ngIf=\"proceso && proceso.respuestaProceso && proceso.estado == 'TERMINADO'\">{{proceso.respuestaProceso.Detalle ?? proceso.respuestaProceso.Mensaje}}</p>\r\n </div>\r\n </div>\r\n <ng-container *ngSwitchCase=\"'Table'\">\r\n <p-table [value]=\"values[i][j]\" [columns]=\"controls[i][j].config.columns\">\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n <button pButton pRipple icon=\"pi pi-plus\" (click)=\"addObjectArray(el)\"\r\n class=\"p-button-success\" [disabled]=\"controls[i][j].disabled === true\"></button>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr>\r\n <th *ngFor=\"let col of columns\">\r\n {{col.label}}\r\n </th>\r\n <ng-container>\r\n <th></th>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-rowIndex=\"rowIndex\">\r\n <tr>\r\n <ng-container *ngFor=\"let col of columns\" [ngSwitch]=\"col.type\">\r\n <ng-container *ngSwitchCase=\"'control'\">\r\n <sf-control [control]=\"extracControlFromTableElements(i, j, col)\" [label]=\"\"\r\n [value]=\"extracValueFromTableElements(i, j, rowIndex, col)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (setValue)=\"setValue($event, extracValueFromTableElements(i, j, rowIndex, col).scope, i, j)\"\r\n [showTempValue]=\"true\"\r\n >\r\n </sf-control>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'text'\">\r\n <td>{{rowData[col.col]}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'address'\">\r\n <td>{{rowData[col.col] | formatAddress: extracControlFromTableElements(i, j, col).separador }}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'currency:USD'\">\r\n <td>{{rowData[col.col] | currency: 'USD'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date:yyyy-mm-dd'\">\r\n <td>{{rowData[col.col] | date: 'yyyy-mm-dd'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date:dd/mm/yyyy'\">\r\n <td>{{rowData[col.col] | date: 'dd/MM/yyyy'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'boolean'\">\r\n <td>\r\n <i *ngIf=\"rowData[col.col]\" class=\"pi pi-check\"></i>\r\n <i *ngIf=\"!rowData[col.col]\" class=\"pi pi-times\"></i>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container>\r\n <td>\r\n <button pButton pRipple type=\"button\"\r\n (click)=\"editRow(el, rowData, rowIndex)\" icon=\"pi pi-pencil\"\r\n class=\"p-button-rounded p-button-info mr-1\"></button>\r\n <button pButton pRipple type=\"button\" (click)=\"deleteRow(el, rowIndex)\" [disabled]=\"controls[i][j].disabled === true\"\r\n icon=\"pi pi-trash\" class=\"p-button-rounded p-button-danger\"></button>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'ArrayLayout'\">\r\n <div class=\"col-12\">\r\n <div *ngIf=\"element.addButton\" class=\"flex items-center justify-content-between mb-2\">\r\n <p-button [icon]=\"element.addButton.icon\" [label]=\"element.addButton.label\" (click)=\"addArrayItem(element, i)\" [severity]=\"element.addButton.severity || 'primary'\"/>\r\n </div>\r\n </div>\r\n <div *ngFor=\"let arrayItem of getArrayItems(element.scope); let arrayIndex = index\" [ngClass]=\"element.classElements || 'flex align-items-center w-full'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"getControl(el,arrayIndex)\" [label]=\"el.label\"\r\n [value]=\"values[i][j] || getValueFromData(element,el,arrayIndex)\" (setValue)=\"setValue($event, el.scope, i, j,arrayIndex)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"\r\n (setDependencyValue)=\"setDependencyValue($event, i, j, arrayIndex)\"></sf-control>\r\n </ng-container>\r\n </div>\r\n <p-button *ngIf=\"element.deleteButton && !(element.deleteButton.hide?.index === arrayIndex)\" [icon]=\"element.deleteButton.icon\" [rounded]=\"element.deleteButton.rounded || false\" [text]=\"element.deleteButton.text || true\" [severity]=\"element.deleteButton.severity || 'danger'\" (click)=\"removeArrayItem(element, i, arrayIndex)\" \r\n [label]=\"element.deleteButton.label\" />\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </p-fluid>\r\n</div>\r\n\r\n<!-- <p-toast *ngIf=\"isDialog\"></p-toast> -->\r\n", styles: [":not(.col-12) .label{display:flex;justify-content:center;align-items:center;padding-inline:.5rem;margin-bottom:15px;margin-top:20px;border-radius:13px;font-size:18px;font-size:inherit;background-color:var(--primary-color);text-align:center;color:var(--normal-text-color)}.pdf{display:flex;width:100%;height:80vh;& iframe{width:80%;margin-inline:10%}}.data-ado-container{display:flex;margin-inline:auto;align-items:center;width:fit-content;>*{margin-inline:4px}>div{display:flex;align-items:center;>*{margin-inline:4px}}}i.pi-user{font-size:2rem}.result-ado{min-height:1rem;text-align:center}sf-simulador{display:flow-root;width:80%;margin-inline:auto;margin-bottom:35px}sf-sign{display:block;margin-inline:auto;width:80%;& pdf-viewer{min-height:130vh!important;max-height:130vh!important}}.buttons{display:flex;justify-content:space-evenly}::ng-deep *{box-shadow:none}.frm-container ::ng-deep .p-inputtext:focus,.frm-container ::ng-deep .p-inputtext:active,.frm-container ::ng-deep .p-inputwrapper:focus,.frm-container ::ng-deep .p-inputwrapper:active{border-color:var(--button-color)}.frm-container ::ng-deep :not(:disabled):active,.frm-container ::ng-deep :not(.p-disabled) .p-inputtext:hover,.frm-container ::ng-deep :not(.p-disabled) .p-inputwrapper:hover,.frm-container ::ng-deep :not(.p-disabled) .p-inputwrapper-focus,.frm-container ::ng-deep .p-radiobutton-box .p-highlight,.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled):hover{border-color:var(--button-color)}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{background:var(--button-color);border-color:var(--button-color)!important}@media screen and (max-width:765px){:not(.col-12) .label{height:fit-content}.field{margin-bottom:.5rem}.pdf>iframe{width:100%;margin-inline:0}sf-sign{width:100%;& pdf-viewer{min-height:60vh!important;max-height:120vh!important}}sf-simulador{display:block;width:100%;margin-inline:auto}.data-ado-container{text-align:center;.buttons{max-width:80vw;flex-direction:row}}.buttons{flex-direction:column;align-items:center}}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled):not(.p-highlight):hover{border-color:var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight:not(.p-disabled):hover{color:var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled).p-focus{box-shadow:inset 0 0 0 1px var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box .p-radiobutton-icon{background-color:#fff}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover{background-color:#e5e7eb}.frm-container ::ng-deep .p-slider{background-color:#e5e7eb}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover .p-slider-range{background-color:var(--primary-color)!important}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover .p-slider-handle{border-color:var(--primary-color)!important}\n"], dependencies: [{ kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: i5.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i5.DatePipe, name: "date" }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: FluidModule }, { kind: "component", type: i6.Fluid, selector: "p-fluid" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i10.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i10.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i8.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: ControlComponent, selector: "sf-control", inputs: ["showTempValue", "control", "label", "value", "appendTo"], outputs: ["setValue", "sendObject", "addressClicked", "setDependencyValue"] }, { kind: "ngmodule", type: SfPdfsignModule }, { kind: "component", type: i6$1.SignComponent, selector: "sf-sign", inputs: ["idkatios", "tdoc", "ndoc", "idDocument", "typeDocument", "allowDownload"], outputs: ["stateDocument", "loading"] }, { kind: "ngmodule", type: SfSimuladorModule }, { kind: "component", type: i7$1.SfSimuladorComponent, selector: "sf-simulador", inputs: ["simulador", "otherToolTips", "labels"], outputs: ["simuladorChange", "enProceso"] }] });
|
|
2543
2520
|
}
|
|
2544
2521
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FormComponent, decorators: [{
|
|
2545
2522
|
type: Component,
|
|
2546
|
-
args: [{ selector: 'app-form', standalone: false, template: "<div *ngIf=\"controlsLoaded\" class=\"frm-container\">\r\n <ng-container *ngIf=\"isAddressDialog && currentAddress\">\r\n Direcci\u00F3n actual: {{currentAddress | formatAddress: separador}}\r\n <br>\r\n </ng-container>\r\n <br>\r\n <ng-container *ngIf=\"isAddressDialog\">\r\n Direcci\u00F3n nueva: {{newAddress | formatAddress: separador}}\r\n </ng-container>\r\n <p-fluid>\r\n <div *ngFor=\"let element of uiEsquema.elements; let i = index\" [class]=\"element?.class\" #a>\r\n <ng-container [ngSwitch]=\"element.type\" *ngIf=\"visible[i][0]\">\r\n <div class=\"label\" *ngSwitchCase=\"'Label'\" [style]=\"element?.style\">\r\n {{element?.label}}\r\n </div>\r\n <ng-container *ngSwitchCase=\"'HorizontalLayout'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\" *ngIf=\"visible[i][j]\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"controls[i][j]\" [label]=\"el.label\"\r\n [value]=\"values[i][j]\" (setValue)=\"setValue($event, el.scope, i, j)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"></sf-control>\r\n <div *ngSwitchCase=\"'Texto'\" [ngStyle]=\"{'height': '100%', 'margin-block': 'auto'}\">\r\n <p>{{el.label}}</p>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'VerticalLayout'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\" *ngIf=\"visible[i][j]\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"controls[i][j]\" [label]=\"el.label\"\r\n [value]=\"values[i][j]\" (setValue)=\"setValue($event, el.scope, i, j)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"></sf-control>\r\n <div *ngSwitchCase=\"'PDF'\" class=\"pdf\">\r\n <iframe [src]=\"values[i][j]\" frameborder=\"0\" allow=\"geolocation *; camera *;\"></iframe>\r\n </div>\r\n <div *ngSwitchCase=\"'PDF-SIGN'\">\r\n <sf-sign [allowDownload]=\"true\" [idkatios]=\"idKatios\" [tdoc]=\"data.pdf.tdoc\" [ndoc]=\"data.pdf.ndoc\"\r\n [idDocument]=\"data.pdf.id\" [typeDocument]=\"data.pdf.idDoc\"\r\n (stateDocument)=\"onStateDocument($event)\"></sf-sign>\r\n </div>\r\n <ng-container *ngSwitchCase=\"'SIMULADOR'\">\r\n <sf-simulador [simulador]=\"data\" [otherToolTips]=\"data.otherTooltips\"\r\n (simuladorChange)=\"onSimuladorChange($event)\" (enProceso)=\"emitLoadingForm($event)\"></sf-simulador>\r\n </ng-container>\r\n <div *ngSwitchCase=\"'ADO'\" class=\"buttons\">\r\n <p-button *ngIf=\"!data?.ADO?.dataProceso?.idProceso\" [ngStyle]=\"el?.ngStyle\" (click)=\"goToADO()\" label=\"Validar identidad\"></p-button>\r\n </div>\r\n <div *ngSwitchCase=\"'ADO'\">\r\n <div *ngIf=\"data?.ADO?.dataProceso?.idProceso\">\r\n <div class=\"data-ado-container\">\r\n <ng-container *ngIf=\"proceso\">\r\n <i *ngIf=\"proceso?.respuestaProceso?.EsExitoso === true\" pTooltip=\"Validado\" tooltipPosition=\"top\" id=\"Validado\" class=\"pi pi-user\" style=\"color: green\"\r\n (touchstart)=\"onTouchDescription('Validado', false)\" (touchend)=\"onUnTouchDescription('Validado')\"></i>\r\n <i *ngIf=\"proceso?.respuestaProceso?.EsExitoso === false\" pTooltip=\"No validado\" tooltipPosition=\"top\" id=\"No-Validado\" class=\"pi pi-user\" style=\"color: red\"\r\n (touchstart)=\"onTouchDescription('No-Validado', false)\" (touchend)=\"onUnTouchDescription('No-Validado')\"></i>\r\n <i *ngIf=\"!proceso?.respuestaProceso\" pTooltip=\"Sin validar\" tooltipPosition=\"top\" class=\"pi pi-user\" id=\"Sin-Validar\" style=\"color: gray\"\r\n (touchstart)=\"onTouchDescription('Sin-Validar', false)\" (touchend)=\"onUnTouchDescription('Sin-Validar')\"></i>\r\n </ng-container>\r\n <div class=\"buttons\">\r\n <button pButton icon=\"pi pi-external-link\" (click)=\"goToADO()\" pTooltip=\"Abrir\" [disabled]=\"!proceso\"></button>\r\n <button pButton icon=\"pi pi-copy\" (click)=\"copyToClipboard(proceso.id)\" pTooltip=\"Copiar\" [disabled]=\"!proceso\"></button>\r\n <button pButton icon=\"pi pi-refresh\" (click)=\"refreshIntegracion(proceso.id)\" pTooltip=\"Refrescar\" [disabled]=\"!proceso\"></button>\r\n </div>\r\n </div>\r\n <p class=\"result-ado\" *ngIf=\"proceso && !proceso.respuestaProceso && proceso.estado == 'PROCESANDO'\">Procesando</p>\r\n <p class=\"result-ado\" *ngIf=\"proceso && proceso.respuestaProceso && proceso.estado == 'TERMINADO'\">{{proceso.respuestaProceso.Detalle ?? proceso.respuestaProceso.Mensaje}}</p>\r\n </div>\r\n </div>\r\n <ng-container *ngSwitchCase=\"'Table'\">\r\n <p-table [value]=\"values[i][j]\" [columns]=\"controls[i][j].config.columns\">\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n <button pButton pRipple icon=\"pi pi-plus\" (click)=\"addObjectArray(el)\"\r\n class=\"p-button-success\" [disabled]=\"controls[i][j].disabled === true\"></button>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr>\r\n <th *ngFor=\"let col of columns\">\r\n {{col.label}}\r\n </th>\r\n <ng-container>\r\n <th></th>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-rowIndex=\"rowIndex\">\r\n <tr>\r\n <ng-container *ngFor=\"let col of columns\" [ngSwitch]=\"col.type\">\r\n <ng-container *ngSwitchCase=\"'control'\">\r\n <sf-control [control]=\"extracControlFromTableElements(i, j, col)\" [label]=\"\"\r\n [value]=\"extracValueFromTableElements(i, j, rowIndex, col)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (setValue)=\"setValue($event, extracValueFromTableElements(i, j, rowIndex, col).scope, i, j)\"\r\n [showTempValue]=\"true\"\r\n >\r\n </sf-control>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'text'\">\r\n <td>{{rowData[col.col]}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'address'\">\r\n <td>{{rowData[col.col] | formatAddress: extracControlFromTableElements(i, j, col).separador }}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'currency:USD'\">\r\n <td>{{rowData[col.col] | currency: 'USD'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date:yyyy-mm-dd'\">\r\n <td>{{rowData[col.col] | date: 'yyyy-mm-dd'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date:dd/mm/yyyy'\">\r\n <td>{{rowData[col.col] | date: 'dd/MM/yyyy'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'boolean'\">\r\n <td>\r\n <i *ngIf=\"rowData[col.col]\" class=\"pi pi-check\"></i>\r\n <i *ngIf=\"!rowData[col.col]\" class=\"pi pi-times\"></i>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container>\r\n <td>\r\n <button pButton pRipple type=\"button\"\r\n (click)=\"editRow(el, rowData, rowIndex)\" icon=\"pi pi-pencil\"\r\n class=\"p-button-rounded p-button-info mr-1\"></button>\r\n <button pButton pRipple type=\"button\" (click)=\"deleteRow(el, rowIndex)\" [disabled]=\"controls[i][j].disabled === true\"\r\n icon=\"pi pi-trash\" class=\"p-button-rounded p-button-danger\"></button>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'ArrayLayout'\">\r\n <div class=\"col-12\">\r\n <div *ngIf=\"element.addButton\" class=\"flex items-center justify-content-between mb-2\">\r\n <p-button [icon]=\"element.addButton.icon\" [label]=\"element.addButton.label\" (click)=\"addArrayItem(element, i)\" [severity]=\"element.addButton.severity || 'primary'\"/>\r\n </div>\r\n </div>\r\n <div *ngFor=\"let arrayItem of getArrayItems(element.scope); let arrayIndex = index\" [ngClass]=\"element.classElements || 'flex align-items-center w-full'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"getControl(el,arrayIndex)\" [label]=\"el.label\"\r\n [value]=\"values[i][j] || getValueFromData(element,el,arrayIndex)\" (setValue)=\"setValue($event, el.scope, i, j,arrayIndex)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"></sf-control>\r\n </ng-container>\r\n </div>\r\n <p-button *ngIf=\"element.deleteButton && !(element.deleteButton.hide?.index === arrayIndex)\" [icon]=\"element.deleteButton.icon\" [rounded]=\"element.deleteButton.rounded || false\" [text]=\"element.deleteButton.text || true\" [severity]=\"element.deleteButton.severity || 'danger'\" (click)=\"removeArrayItem(element, i, arrayIndex)\" \r\n [label]=\"element.deleteButton.label\" />\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </p-fluid>\r\n</div>\r\n\r\n<p-toast *ngIf=\"isDialog\"></p-toast>\r\n", styles: [":not(.col-12) .label{display:flex;justify-content:center;align-items:center;padding-inline:.5rem;margin-bottom:15px;margin-top:20px;border-radius:13px;font-size:18px;font-size:inherit;background-color:var(--primary-color);text-align:center;color:var(--normal-text-color)}.pdf{display:flex;width:100%;height:80vh;& iframe{width:80%;margin-inline:10%}}.data-ado-container{display:flex;margin-inline:auto;align-items:center;width:fit-content;>*{margin-inline:4px}>div{display:flex;align-items:center;>*{margin-inline:4px}}}i.pi-user{font-size:2rem}.result-ado{min-height:1rem;text-align:center}sf-simulador{display:flow-root;width:80%;margin-inline:auto;margin-bottom:35px}sf-sign{display:block;margin-inline:auto;width:80%;& pdf-viewer{min-height:130vh!important;max-height:130vh!important}}.buttons{display:flex;justify-content:space-evenly}::ng-deep *{box-shadow:none}.frm-container ::ng-deep .p-inputtext:focus,.frm-container ::ng-deep .p-inputtext:active,.frm-container ::ng-deep .p-inputwrapper:focus,.frm-container ::ng-deep .p-inputwrapper:active{border-color:var(--button-color)}.frm-container ::ng-deep :not(:disabled):active,.frm-container ::ng-deep :not(.p-disabled) .p-inputtext:hover,.frm-container ::ng-deep :not(.p-disabled) .p-inputwrapper:hover,.frm-container ::ng-deep :not(.p-disabled) .p-inputwrapper-focus,.frm-container ::ng-deep .p-radiobutton-box .p-highlight,.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled):hover{border-color:var(--button-color)}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{background:var(--button-color);border-color:var(--button-color)!important}@media screen and (max-width:765px){:not(.col-12) .label{height:fit-content}.field{margin-bottom:.5rem}.pdf>iframe{width:100%;margin-inline:0}sf-sign{width:100%;& pdf-viewer{min-height:60vh!important;max-height:120vh!important}}sf-simulador{display:block;width:100%;margin-inline:auto}.data-ado-container{text-align:center;.buttons{max-width:80vw;flex-direction:row}}.buttons{flex-direction:column;align-items:center}}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled):not(.p-highlight):hover{border-color:var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight:not(.p-disabled):hover{color:var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled).p-focus{box-shadow:inset 0 0 0 1px var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box .p-radiobutton-icon{background-color:#fff}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover{background-color:#e5e7eb}.frm-container ::ng-deep .p-slider{background-color:#e5e7eb}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover .p-slider-range{background-color:var(--primary-color)!important}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover .p-slider-handle{border-color:var(--primary-color)!important}\n"] }]
|
|
2547
|
-
}], ctorParameters: () => [{ type:
|
|
2523
|
+
args: [{ selector: 'app-form', imports: [Tooltip, CommonModule, FormsModule, FluidModule, ButtonModule, TableModule, ControlComponent, SfPdfsignModule, SfSimuladorModule], standalone: true, template: "<div *ngIf=\"controlsLoaded\" class=\"frm-container\">\r\n <ng-container *ngIf=\"isAddressDialog && currentAddress\">\r\n Direcci\u00F3n actual: {{currentAddress | formatAddress: separador}}\r\n <br>\r\n </ng-container>\r\n <br>\r\n <ng-container *ngIf=\"isAddressDialog\">\r\n Direcci\u00F3n nueva: {{newAddress | formatAddress: separador}}\r\n </ng-container>\r\n <p-fluid>\r\n <div *ngFor=\"let element of uiEsquema.elements; let i = index\" [class]=\"element?.class\" #a>\r\n <ng-container [ngSwitch]=\"element.type\" *ngIf=\"visible[i][0]\">\r\n <div class=\"label\" *ngSwitchCase=\"'Label'\" [style]=\"element?.style\">\r\n {{element?.label}}\r\n </div>\r\n <ng-container *ngSwitchCase=\"'HorizontalLayout'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\" *ngIf=\"visible[i][j]\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"controls[i][j]\" [label]=\"el.label\"\r\n [value]=\"values[i][j]\" (setValue)=\"setValue($event, el.scope, i, j)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"></sf-control>\r\n <div *ngSwitchCase=\"'Texto'\" [ngStyle]=\"{'height': '100%', 'margin-block': 'auto'}\">\r\n <p>{{el.label}}</p>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'VerticalLayout'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\" *ngIf=\"visible[i][j]\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"controls[i][j]\" [label]=\"el.label\"\r\n [value]=\"values[i][j]\" (setValue)=\"setValue($event, el.scope, i, j)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"></sf-control>\r\n <div *ngSwitchCase=\"'PDF'\" class=\"pdf\">\r\n <iframe [src]=\"values[i][j]\" frameborder=\"0\" allow=\"geolocation *; camera *;\"></iframe>\r\n </div>\r\n <div *ngSwitchCase=\"'PDF-SIGN'\">\r\n <sf-sign [allowDownload]=\"true\" [idkatios]=\"idKatios\" [tdoc]=\"data.pdf.tdoc\" [ndoc]=\"data.pdf.ndoc\"\r\n [idDocument]=\"data.pdf.id\" [typeDocument]=\"data.pdf.idDoc\"\r\n (stateDocument)=\"onStateDocument($event)\"></sf-sign>\r\n </div>\r\n <ng-container *ngSwitchCase=\"'SIMULADOR'\">\r\n <sf-simulador [simulador]=\"data\" [otherToolTips]=\"data.otherTooltips\"\r\n (simuladorChange)=\"onSimuladorChange($event)\" (enProceso)=\"emitLoadingForm($event)\"></sf-simulador>\r\n </ng-container>\r\n <div *ngSwitchCase=\"'ADO'\" class=\"buttons\">\r\n <p-button *ngIf=\"!data?.ADO?.dataProceso?.idProceso\" [ngStyle]=\"el?.ngStyle\" (click)=\"goToADO()\" label=\"Validar identidad\"></p-button>\r\n </div>\r\n <div *ngSwitchCase=\"'ADO'\">\r\n <div *ngIf=\"data?.ADO?.dataProceso?.idProceso\">\r\n <div class=\"data-ado-container\">\r\n <ng-container *ngIf=\"proceso\">\r\n <i *ngIf=\"proceso?.respuestaProceso?.EsExitoso === true\" pTooltip=\"Validado\" tooltipPosition=\"top\" id=\"Validado\" class=\"pi pi-user\" style=\"color: green\"\r\n (touchstart)=\"onTouchDescription('Validado', false)\" (touchend)=\"onUnTouchDescription('Validado')\"></i>\r\n <i *ngIf=\"proceso?.respuestaProceso?.EsExitoso === false\" pTooltip=\"No validado\" tooltipPosition=\"top\" id=\"No-Validado\" class=\"pi pi-user\" style=\"color: red\"\r\n (touchstart)=\"onTouchDescription('No-Validado', false)\" (touchend)=\"onUnTouchDescription('No-Validado')\"></i>\r\n <i *ngIf=\"!proceso?.respuestaProceso\" pTooltip=\"Sin validar\" tooltipPosition=\"top\" class=\"pi pi-user\" id=\"Sin-Validar\" style=\"color: gray\"\r\n (touchstart)=\"onTouchDescription('Sin-Validar', false)\" (touchend)=\"onUnTouchDescription('Sin-Validar')\"></i>\r\n </ng-container>\r\n <div class=\"buttons\">\r\n <button pButton icon=\"pi pi-external-link\" (click)=\"goToADO()\" pTooltip=\"Abrir\" [disabled]=\"!proceso\"></button>\r\n <button pButton icon=\"pi pi-copy\" (click)=\"copyToClipboard(proceso.id)\" pTooltip=\"Copiar\" [disabled]=\"!proceso\"></button>\r\n <button pButton icon=\"pi pi-refresh\" (click)=\"refreshIntegracion(proceso.id)\" pTooltip=\"Refrescar\" [disabled]=\"!proceso\"></button>\r\n </div>\r\n </div>\r\n <p class=\"result-ado\" *ngIf=\"proceso && !proceso.respuestaProceso && proceso.estado == 'PROCESANDO'\">Procesando</p>\r\n <p class=\"result-ado\" *ngIf=\"proceso && proceso.respuestaProceso && proceso.estado == 'TERMINADO'\">{{proceso.respuestaProceso.Detalle ?? proceso.respuestaProceso.Mensaje}}</p>\r\n </div>\r\n </div>\r\n <ng-container *ngSwitchCase=\"'Table'\">\r\n <p-table [value]=\"values[i][j]\" [columns]=\"controls[i][j].config.columns\">\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n <button pButton pRipple icon=\"pi pi-plus\" (click)=\"addObjectArray(el)\"\r\n class=\"p-button-success\" [disabled]=\"controls[i][j].disabled === true\"></button>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr>\r\n <th *ngFor=\"let col of columns\">\r\n {{col.label}}\r\n </th>\r\n <ng-container>\r\n <th></th>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-rowIndex=\"rowIndex\">\r\n <tr>\r\n <ng-container *ngFor=\"let col of columns\" [ngSwitch]=\"col.type\">\r\n <ng-container *ngSwitchCase=\"'control'\">\r\n <sf-control [control]=\"extracControlFromTableElements(i, j, col)\" [label]=\"\"\r\n [value]=\"extracValueFromTableElements(i, j, rowIndex, col)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (setValue)=\"setValue($event, extracValueFromTableElements(i, j, rowIndex, col).scope, i, j)\"\r\n [showTempValue]=\"true\"\r\n >\r\n </sf-control>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'text'\">\r\n <td>{{rowData[col.col]}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'address'\">\r\n <td>{{rowData[col.col] | formatAddress: extracControlFromTableElements(i, j, col).separador }}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'currency:USD'\">\r\n <td>{{rowData[col.col] | currency: 'USD'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date:yyyy-mm-dd'\">\r\n <td>{{rowData[col.col] | date: 'yyyy-mm-dd'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'date:dd/mm/yyyy'\">\r\n <td>{{rowData[col.col] | date: 'dd/MM/yyyy'}}</td>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'boolean'\">\r\n <td>\r\n <i *ngIf=\"rowData[col.col]\" class=\"pi pi-check\"></i>\r\n <i *ngIf=\"!rowData[col.col]\" class=\"pi pi-times\"></i>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container>\r\n <td>\r\n <button pButton pRipple type=\"button\"\r\n (click)=\"editRow(el, rowData, rowIndex)\" icon=\"pi pi-pencil\"\r\n class=\"p-button-rounded p-button-info mr-1\"></button>\r\n <button pButton pRipple type=\"button\" (click)=\"deleteRow(el, rowIndex)\" [disabled]=\"controls[i][j].disabled === true\"\r\n icon=\"pi pi-trash\" class=\"p-button-rounded p-button-danger\"></button>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'ArrayLayout'\">\r\n <div class=\"col-12\">\r\n <div *ngIf=\"element.addButton\" class=\"flex items-center justify-content-between mb-2\">\r\n <p-button [icon]=\"element.addButton.icon\" [label]=\"element.addButton.label\" (click)=\"addArrayItem(element, i)\" [severity]=\"element.addButton.severity || 'primary'\"/>\r\n </div>\r\n </div>\r\n <div *ngFor=\"let arrayItem of getArrayItems(element.scope); let arrayIndex = index\" [ngClass]=\"element.classElements || 'flex align-items-center w-full'\">\r\n <div *ngFor=\"let el of element.elements; let j =index\" [class]=\"el?.class\">\r\n <ng-container [ngSwitch]=\"el.type\">\r\n <sf-control *ngSwitchCase=\"'Control'\" [control]=\"getControl(el,arrayIndex)\" [label]=\"el.label\"\r\n [value]=\"values[i][j] || getValueFromData(element,el,arrayIndex)\" (setValue)=\"setValue($event, el.scope, i, j,arrayIndex)\"\r\n (sendNotification)=\"sendNotification($event)\"\r\n (sendObject)=\"applyValuesFromObject($event)\"\r\n (addressClicked)=\"openPopUpDireccion(el.scope)\"\r\n (setDependencyValue)=\"setDependencyValue($event, i, j, arrayIndex)\"></sf-control>\r\n </ng-container>\r\n </div>\r\n <p-button *ngIf=\"element.deleteButton && !(element.deleteButton.hide?.index === arrayIndex)\" [icon]=\"element.deleteButton.icon\" [rounded]=\"element.deleteButton.rounded || false\" [text]=\"element.deleteButton.text || true\" [severity]=\"element.deleteButton.severity || 'danger'\" (click)=\"removeArrayItem(element, i, arrayIndex)\" \r\n [label]=\"element.deleteButton.label\" />\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </p-fluid>\r\n</div>\r\n\r\n<!-- <p-toast *ngIf=\"isDialog\"></p-toast> -->\r\n", styles: [":not(.col-12) .label{display:flex;justify-content:center;align-items:center;padding-inline:.5rem;margin-bottom:15px;margin-top:20px;border-radius:13px;font-size:18px;font-size:inherit;background-color:var(--primary-color);text-align:center;color:var(--normal-text-color)}.pdf{display:flex;width:100%;height:80vh;& iframe{width:80%;margin-inline:10%}}.data-ado-container{display:flex;margin-inline:auto;align-items:center;width:fit-content;>*{margin-inline:4px}>div{display:flex;align-items:center;>*{margin-inline:4px}}}i.pi-user{font-size:2rem}.result-ado{min-height:1rem;text-align:center}sf-simulador{display:flow-root;width:80%;margin-inline:auto;margin-bottom:35px}sf-sign{display:block;margin-inline:auto;width:80%;& pdf-viewer{min-height:130vh!important;max-height:130vh!important}}.buttons{display:flex;justify-content:space-evenly}::ng-deep *{box-shadow:none}.frm-container ::ng-deep .p-inputtext:focus,.frm-container ::ng-deep .p-inputtext:active,.frm-container ::ng-deep .p-inputwrapper:focus,.frm-container ::ng-deep .p-inputwrapper:active{border-color:var(--button-color)}.frm-container ::ng-deep :not(:disabled):active,.frm-container ::ng-deep :not(.p-disabled) .p-inputtext:hover,.frm-container ::ng-deep :not(.p-disabled) .p-inputwrapper:hover,.frm-container ::ng-deep :not(.p-disabled) .p-inputwrapper-focus,.frm-container ::ng-deep .p-radiobutton-box .p-highlight,.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled):hover{border-color:var(--button-color)}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{background:var(--button-color);border-color:var(--button-color)!important}@media screen and (max-width:765px){:not(.col-12) .label{height:fit-content}.field{margin-bottom:.5rem}.pdf>iframe{width:100%;margin-inline:0}sf-sign{width:100%;& pdf-viewer{min-height:60vh!important;max-height:120vh!important}}sf-simulador{display:block;width:100%;margin-inline:auto}.data-ado-container{text-align:center;.buttons{max-width:80vw;flex-direction:row}}.buttons{flex-direction:column;align-items:center}}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled):not(.p-highlight):hover{border-color:var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight:not(.p-disabled):hover{color:var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box:not(.p-disabled).p-focus{box-shadow:inset 0 0 0 1px var(--secondary-color)!important}.frm-container ::ng-deep .p-radiobutton .p-radiobutton-box .p-radiobutton-icon{background-color:#fff}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover{background-color:#e5e7eb}.frm-container ::ng-deep .p-slider{background-color:#e5e7eb}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover .p-slider-range{background-color:var(--primary-color)!important}.frm-container ::ng-deep .p-slider:not(.p-disabled):hover .p-slider-handle{border-color:var(--primary-color)!important}\n"] }]
|
|
2524
|
+
}], ctorParameters: () => [{ type: SfCrudService }, { type: i2$1.DomSanitizer }, { type: StepService }, { type: i4.AdoService }, { type: i4.JWTService }], propDecorators: { color: [{
|
|
2548
2525
|
type: HostBinding,
|
|
2549
2526
|
args: ["style.--primary-color"]
|
|
2550
2527
|
}], color2: [{
|
|
@@ -2643,6 +2620,8 @@ class RegistroComponent {
|
|
|
2643
2620
|
this.cargarMascarasDirecciones();
|
|
2644
2621
|
this.instanceSubsStepService();
|
|
2645
2622
|
this.notificationSubscription = this.notificationService.notificationAdded$().subscribe(notification => {
|
|
2623
|
+
if (!notification)
|
|
2624
|
+
return;
|
|
2646
2625
|
if (notification?.requestChecking?.useSwal) {
|
|
2647
2626
|
Swal.fire(notification.msg).then((res) => {
|
|
2648
2627
|
if (notification.msg.showCancelButton && res.isDismissed && notification.requestChecking?.cancelRedirect) {
|
|
@@ -2663,6 +2642,8 @@ class RegistroComponent {
|
|
|
2663
2642
|
this.messageService.add(notification.msg);
|
|
2664
2643
|
if (notification.requestChecking.redirect.toUpperCase() == "INICIO")
|
|
2665
2644
|
this.sfCrudService.redirectToInicio();
|
|
2645
|
+
else if (notification.requestChecking.redirect.toUpperCase() === "ATRAS")
|
|
2646
|
+
this.back();
|
|
2666
2647
|
else {
|
|
2667
2648
|
let newURL = this.sfCrudService.getURLRedirect(notification.requestChecking.redirect);
|
|
2668
2649
|
window.location.href = newURL;
|
|
@@ -2671,6 +2652,7 @@ class RegistroComponent {
|
|
|
2671
2652
|
}
|
|
2672
2653
|
else if (notification?.msg) {
|
|
2673
2654
|
this.messageService.add(notification.msg);
|
|
2655
|
+
console.log(notification.msg);
|
|
2674
2656
|
}
|
|
2675
2657
|
});
|
|
2676
2658
|
this.subsToKillOnDestroy.push(this.sfCrudService.operation$.subscribe((op) => {
|
|
@@ -2724,7 +2706,7 @@ class RegistroComponent {
|
|
|
2724
2706
|
this.stepService.requestApproved = true;
|
|
2725
2707
|
this.loading.inProgress = false;
|
|
2726
2708
|
this.sfCrudService.formLoading = this.loading;
|
|
2727
|
-
this.notificationService.addNotification(this.notificationService.generateMessage(this.notificationService.genDefaultMessage("success",
|
|
2709
|
+
this.notificationService.addNotification(this.notificationService.generateMessage(this.notificationService.genDefaultMessage("success", "Exitoso", "Información subida correctamente", operation.answerChecking), {}, operation.answerChecking), operation.answerChecking);
|
|
2728
2710
|
this.sfCrudService.index = this.stepService.currentIndex;
|
|
2729
2711
|
this.scrollTop();
|
|
2730
2712
|
}
|
|
@@ -2973,7 +2955,7 @@ class RegistroComponent {
|
|
|
2973
2955
|
this.sfCrudService.setAnswers(res, this.indexCrud);
|
|
2974
2956
|
if (operation.changeTrx && Array.isArray(operation.changeTrx))
|
|
2975
2957
|
operation.changeTrx.forEach(x => this.sfCrudService.setTrx(x.trx, x.index));
|
|
2976
|
-
this.notificationService.addNotification(this.notificationService.generateMessage(this.notificationService.genDefaultMessage("success",
|
|
2958
|
+
this.notificationService.addNotification(this.notificationService.generateMessage(this.notificationService.genDefaultMessage("success", "Exitoso", "Información subida correctamente", operation.answerChecking), res, operation.answerChecking), operation.answerChecking);
|
|
2977
2959
|
return res;
|
|
2978
2960
|
})
|
|
2979
2961
|
.catch(err => {
|
|
@@ -3030,7 +3012,7 @@ class RegistroComponent {
|
|
|
3030
3012
|
if (operation?.validations?.type == 'local') {
|
|
3031
3013
|
let err = this.sfCrudService.validateDataLocal(operation, data, conditions);
|
|
3032
3014
|
if (err.length != 0 && printErrors)
|
|
3033
|
-
this.notificationService.addNotification({ severity: 'warn', detail: err.slice(0, 5).join('. ') }, this.primeChecking());
|
|
3015
|
+
this.notificationService.addNotification({ severity: 'warn', summary: 'Advertencia', detail: err.slice(0, 5).join('. ') }, this.primeChecking());
|
|
3034
3016
|
return err.length == 0;
|
|
3035
3017
|
}
|
|
3036
3018
|
return true;
|
|
@@ -3268,7 +3250,6 @@ class RegistroComponent {
|
|
|
3268
3250
|
else {
|
|
3269
3251
|
back = this.sfCrudService.registros[0].btnBack;
|
|
3270
3252
|
}
|
|
3271
|
-
console.log("Back to: ", back);
|
|
3272
3253
|
this.router.navigateByUrl(back);
|
|
3273
3254
|
}
|
|
3274
3255
|
cargarMascarasDirecciones() {
|
|
@@ -3279,13 +3260,13 @@ class RegistroComponent {
|
|
|
3279
3260
|
}
|
|
3280
3261
|
return Promise.resolve(this.sfCrudService.mascaras);
|
|
3281
3262
|
}
|
|
3282
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: RegistroComponent, deps: [{ token: GeneralService }, { token: i2.ActivatedRoute }, { token:
|
|
3283
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: RegistroComponent, isStandalone:
|
|
3263
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: RegistroComponent, deps: [{ token: GeneralService }, { token: i2.ActivatedRoute }, { token: i3.MessageService }, { token: SfCrudService }, { token: StepService }, { token: i6$1.SfPdfsignService }, { token: i7$1.SfSimuladorService }, { token: NotificationService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
3264
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: RegistroComponent, isStandalone: true, selector: "sf-registro", inputs: { idKatios: "idKatios", trx: "trx", id: "id", user: "user", dataExt: "dataExt", ids: "ids", environment: "environment", buttonsFooterTemplate: "buttonsFooterTemplate", back_route: "back_route", idEntidad: "idEntidad" }, outputs: { sendData: "sendData", onSubmit: "onSubmit", onLoaded: "onLoaded" }, host: { properties: { "style.--primary-color": "this.color", "style.--secondary-color": "this.color2", "style.--button-color": "this.colorButton" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"card\">\r\n <!--TODO convertir en template y editarla en -->\r\n <h5 *ngIf=\"sfCrudService.registros.length >= 1\" class=\"card-header mb-2\" style=\"display: flex; justify-content: space-between;align-items: center;\">\r\n <span>{{sfCrudService.registros[0]?.label || idForm.replaceAll('_', ' ')}} {{ids.length > 0 ? '-' + ids[0] : ''}}</span>\r\n <button *ngIf=\"sfCrudService.registros[0]?.canBack\" pButton pRipple type=\"button\" icon=\"pi pi-arrow-left\" (click)=\"back()\"></button>\r\n </h5>\r\n <div *ngIf=\"items.length > 1\">\r\n <app-step [items]=\"items\"></app-step>\r\n </div>\r\n <div *ngIf=\"items.length == 1\">\r\n <app-form [data]=\"sfCrudService.dataset[0]\" [esquema]=\"sfCrudService.esquemas[0]\"\r\n [uiEsquema]=\"sfCrudService.uiEsquemas[0]\" [isDialog]=\"false\"></app-form>\r\n\r\n <!--renderizar un codigo personalizado desde el componente padre o renderizar el que se tiene por defecto-->\r\n <ng-container *ngTemplateOutlet=\"buttonsFooterTemplate || defaultButtonsFooterTemplate\"></ng-container>\r\n <ng-template #defaultButtonsFooterTemplate>\r\n <div class=\"card-footer mt-2\" *ngIf=\"btnSubmit\">\r\n <button pButton pRipple type=\"button\" [icon]=\"btnSubmit.icon\" [label]=\"btnSubmit.label\" (click)=\"onClickBtnSubmit()\"></button>\r\n </div>\r\n </ng-template>\r\n </div>\r\n</div>\r\n\r\n<span *ngFor=\"let item of dialogElements; let $index=index\">\r\n <p-dialog [(visible)]=\"displays[$index]\" [modal]=\"true\" [header]=\"'Detalle'\" [closable]=\"false\">\r\n <!-- TODO header = currentElement.element.label ? currentElement.element.label: -->\r\n <app-form [data]=\"item.data\" [esquema]=\"item.esquema\" [uiEsquema]=\"item.uiEsquema\" [isDialog]=\"true\"\r\n [id]=\"ids[indexCrud]\" [isAddressDialog]=\"item.isAddressDialog === true\" [separador]=\"item.separador\"></app-form>\r\n <ng-template pTemplate=\"footer\">\r\n <p-button icon=\"pi pi-times\" (onClick)=\"removeDialogItem()\" label=\"Cancelar\" ></p-button>\r\n <p-button icon=\"pi pi-check\" [disabled]=\"item.esquema.disabled === true\" (onClick)=\"onCloseDialog($index)\" label=\"Ok\" pAutoFocus\r\n [autofocus]=\"true\"></p-button>\r\n </ng-template>\r\n </p-dialog>\r\n</span>", styles: ["@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CardModule }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i10.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i10.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: StepComponent, selector: "app-step", inputs: ["items"] }, { kind: "component", type: FormComponent, selector: "app-form", inputs: ["uiEsquema", "esquema", "data", "isDialog", "isAddressDialog", "separador"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i11$2.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: FormsModule }] });
|
|
3284
3265
|
}
|
|
3285
3266
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: RegistroComponent, decorators: [{
|
|
3286
3267
|
type: Component,
|
|
3287
|
-
args: [{ selector: 'sf-registro',
|
|
3288
|
-
}], ctorParameters: () => [{ type: GeneralService }, { type: i2.ActivatedRoute }, { type:
|
|
3268
|
+
args: [{ selector: 'sf-registro', imports: [CommonModule, CardModule, ButtonModule, StepComponent, FormComponent, DialogModule, FormsModule], standalone: true, template: "<div class=\"card\">\r\n <!--TODO convertir en template y editarla en -->\r\n <h5 *ngIf=\"sfCrudService.registros.length >= 1\" class=\"card-header mb-2\" style=\"display: flex; justify-content: space-between;align-items: center;\">\r\n <span>{{sfCrudService.registros[0]?.label || idForm.replaceAll('_', ' ')}} {{ids.length > 0 ? '-' + ids[0] : ''}}</span>\r\n <button *ngIf=\"sfCrudService.registros[0]?.canBack\" pButton pRipple type=\"button\" icon=\"pi pi-arrow-left\" (click)=\"back()\"></button>\r\n </h5>\r\n <div *ngIf=\"items.length > 1\">\r\n <app-step [items]=\"items\"></app-step>\r\n </div>\r\n <div *ngIf=\"items.length == 1\">\r\n <app-form [data]=\"sfCrudService.dataset[0]\" [esquema]=\"sfCrudService.esquemas[0]\"\r\n [uiEsquema]=\"sfCrudService.uiEsquemas[0]\" [isDialog]=\"false\"></app-form>\r\n\r\n <!--renderizar un codigo personalizado desde el componente padre o renderizar el que se tiene por defecto-->\r\n <ng-container *ngTemplateOutlet=\"buttonsFooterTemplate || defaultButtonsFooterTemplate\"></ng-container>\r\n <ng-template #defaultButtonsFooterTemplate>\r\n <div class=\"card-footer mt-2\" *ngIf=\"btnSubmit\">\r\n <button pButton pRipple type=\"button\" [icon]=\"btnSubmit.icon\" [label]=\"btnSubmit.label\" (click)=\"onClickBtnSubmit()\"></button>\r\n </div>\r\n </ng-template>\r\n </div>\r\n</div>\r\n\r\n<span *ngFor=\"let item of dialogElements; let $index=index\">\r\n <p-dialog [(visible)]=\"displays[$index]\" [modal]=\"true\" [header]=\"'Detalle'\" [closable]=\"false\">\r\n <!-- TODO header = currentElement.element.label ? currentElement.element.label: -->\r\n <app-form [data]=\"item.data\" [esquema]=\"item.esquema\" [uiEsquema]=\"item.uiEsquema\" [isDialog]=\"true\"\r\n [id]=\"ids[indexCrud]\" [isAddressDialog]=\"item.isAddressDialog === true\" [separador]=\"item.separador\"></app-form>\r\n <ng-template pTemplate=\"footer\">\r\n <p-button icon=\"pi pi-times\" (onClick)=\"removeDialogItem()\" label=\"Cancelar\" ></p-button>\r\n <p-button icon=\"pi pi-check\" [disabled]=\"item.esquema.disabled === true\" (onClick)=\"onCloseDialog($index)\" label=\"Ok\" pAutoFocus\r\n [autofocus]=\"true\"></p-button>\r\n </ng-template>\r\n </p-dialog>\r\n</span>", styles: ["@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
|
|
3269
|
+
}], ctorParameters: () => [{ type: GeneralService }, { type: i2.ActivatedRoute }, { type: i3.MessageService }, { type: SfCrudService }, { type: StepService }, { type: i6$1.SfPdfsignService }, { type: i7$1.SfSimuladorService }, { type: NotificationService }, { type: i2.Router }], propDecorators: { color: [{
|
|
3289
3270
|
type: HostBinding,
|
|
3290
3271
|
args: ["style.--primary-color"]
|
|
3291
3272
|
}], color2: [{
|
|
@@ -3342,307 +3323,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
3342
3323
|
`, standalone: false }]
|
|
3343
3324
|
}], ctorParameters: () => [] });
|
|
3344
3325
|
|
|
3345
|
-
const routes = [
|
|
3346
|
-
{ path: ':idStep',
|
|
3347
|
-
component: FormComponent
|
|
3348
|
-
}
|
|
3349
|
-
];
|
|
3350
|
-
class SfCrudRoutingModule {
|
|
3351
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SfCrudRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
3352
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.15", ngImport: i0, type: SfCrudRoutingModule, imports: [i2.RouterModule], exports: [RouterModule] });
|
|
3353
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SfCrudRoutingModule, imports: [RouterModule.forChild(routes), RouterModule] });
|
|
3354
|
-
}
|
|
3355
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SfCrudRoutingModule, decorators: [{
|
|
3356
|
-
type: NgModule,
|
|
3357
|
-
args: [{
|
|
3358
|
-
imports: [RouterModule.forChild(routes)],
|
|
3359
|
-
exports: [RouterModule]
|
|
3360
|
-
}]
|
|
3361
|
-
}] });
|
|
3362
|
-
|
|
3363
|
-
class SfCrudModule {
|
|
3364
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SfCrudModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
3365
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.15", ngImport: i0, type: SfCrudModule, declarations: [SfCrudComponent,
|
|
3366
|
-
TableroComponent,
|
|
3367
|
-
RegistroComponent,
|
|
3368
|
-
ControlComponent,
|
|
3369
|
-
StepComponent,
|
|
3370
|
-
FormComponent,
|
|
3371
|
-
FileUploadComponent,
|
|
3372
|
-
FormatAddressPipe], imports: [SfCrudRoutingModule,
|
|
3373
|
-
SfPdfsignModule,
|
|
3374
|
-
SfSimuladorModule,
|
|
3375
|
-
AccordionModule,
|
|
3376
|
-
AutoCompleteModule,
|
|
3377
|
-
AvatarGroupModule,
|
|
3378
|
-
AvatarModule,
|
|
3379
|
-
BadgeModule,
|
|
3380
|
-
BlockUIModule,
|
|
3381
|
-
BreadcrumbModule,
|
|
3382
|
-
ButtonModule,
|
|
3383
|
-
CalendarModule,
|
|
3384
|
-
CardModule,
|
|
3385
|
-
CarouselModule,
|
|
3386
|
-
CascadeSelectModule,
|
|
3387
|
-
CheckboxModule,
|
|
3388
|
-
ChipModule,
|
|
3389
|
-
ChipModule,
|
|
3390
|
-
ColorPickerModule,
|
|
3391
|
-
ConfirmDialogModule,
|
|
3392
|
-
ConfirmPopupModule,
|
|
3393
|
-
ContextMenuModule,
|
|
3394
|
-
DialogModule,
|
|
3395
|
-
DividerModule,
|
|
3396
|
-
DropdownModule,
|
|
3397
|
-
DatePickerModule,
|
|
3398
|
-
FieldsetModule,
|
|
3399
|
-
FileUploadModule,
|
|
3400
|
-
FluidModule,
|
|
3401
|
-
FormsModule,
|
|
3402
|
-
GalleriaModule,
|
|
3403
|
-
HttpClientModule,
|
|
3404
|
-
RouterModule,
|
|
3405
|
-
InplaceModule,
|
|
3406
|
-
InputMaskModule,
|
|
3407
|
-
InputNumberModule,
|
|
3408
|
-
InputSwitchModule,
|
|
3409
|
-
InputGroupModule,
|
|
3410
|
-
InputGroupAddonModule,
|
|
3411
|
-
IconFieldModule,
|
|
3412
|
-
InputIconModule,
|
|
3413
|
-
TextareaModule,
|
|
3414
|
-
InputTextModule,
|
|
3415
|
-
KnobModule,
|
|
3416
|
-
ListboxModule,
|
|
3417
|
-
MegaMenuModule,
|
|
3418
|
-
MenubarModule,
|
|
3419
|
-
MenuModule,
|
|
3420
|
-
MessageModule,
|
|
3421
|
-
MultiSelectModule,
|
|
3422
|
-
OrganizationChartModule,
|
|
3423
|
-
OverlayPanelModule,
|
|
3424
|
-
PanelMenuModule,
|
|
3425
|
-
PanelModule,
|
|
3426
|
-
PasswordModule,
|
|
3427
|
-
ProgressBarModule,
|
|
3428
|
-
RadioButtonModule,
|
|
3429
|
-
RatingModule,
|
|
3430
|
-
RippleModule,
|
|
3431
|
-
ScrollPanelModule,
|
|
3432
|
-
ScrollTopModule,
|
|
3433
|
-
SelectButtonModule,
|
|
3434
|
-
SidebarModule,
|
|
3435
|
-
SkeletonModule,
|
|
3436
|
-
SliderModule,
|
|
3437
|
-
SplitButtonModule,
|
|
3438
|
-
SplitterModule,
|
|
3439
|
-
StepsModule,
|
|
3440
|
-
SelectModule,
|
|
3441
|
-
TableModule,
|
|
3442
|
-
TabMenuModule,
|
|
3443
|
-
TabViewModule,
|
|
3444
|
-
TagModule,
|
|
3445
|
-
TerminalModule,
|
|
3446
|
-
TieredMenuModule,
|
|
3447
|
-
TimelineModule,
|
|
3448
|
-
ToastModule,
|
|
3449
|
-
ToggleButtonModule,
|
|
3450
|
-
ToolbarModule,
|
|
3451
|
-
TooltipModule,
|
|
3452
|
-
TreeModule,
|
|
3453
|
-
SfAdoModule], exports: [SfCrudComponent,
|
|
3454
|
-
TableroComponent,
|
|
3455
|
-
RegistroComponent,
|
|
3456
|
-
ControlComponent] });
|
|
3457
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SfCrudModule, imports: [SfCrudRoutingModule,
|
|
3458
|
-
SfPdfsignModule,
|
|
3459
|
-
SfSimuladorModule,
|
|
3460
|
-
AccordionModule,
|
|
3461
|
-
AutoCompleteModule,
|
|
3462
|
-
AvatarGroupModule,
|
|
3463
|
-
AvatarModule,
|
|
3464
|
-
BadgeModule,
|
|
3465
|
-
BlockUIModule,
|
|
3466
|
-
BreadcrumbModule,
|
|
3467
|
-
ButtonModule,
|
|
3468
|
-
CalendarModule,
|
|
3469
|
-
CardModule,
|
|
3470
|
-
CarouselModule,
|
|
3471
|
-
CascadeSelectModule,
|
|
3472
|
-
CheckboxModule,
|
|
3473
|
-
ChipModule,
|
|
3474
|
-
ChipModule,
|
|
3475
|
-
ColorPickerModule,
|
|
3476
|
-
ConfirmDialogModule,
|
|
3477
|
-
ConfirmPopupModule,
|
|
3478
|
-
ContextMenuModule,
|
|
3479
|
-
DialogModule,
|
|
3480
|
-
DividerModule,
|
|
3481
|
-
DropdownModule,
|
|
3482
|
-
DatePickerModule,
|
|
3483
|
-
FieldsetModule,
|
|
3484
|
-
FileUploadModule,
|
|
3485
|
-
FluidModule,
|
|
3486
|
-
FormsModule,
|
|
3487
|
-
GalleriaModule,
|
|
3488
|
-
HttpClientModule,
|
|
3489
|
-
RouterModule,
|
|
3490
|
-
InplaceModule,
|
|
3491
|
-
InputMaskModule,
|
|
3492
|
-
InputNumberModule,
|
|
3493
|
-
InputSwitchModule,
|
|
3494
|
-
InputGroupModule,
|
|
3495
|
-
InputGroupAddonModule,
|
|
3496
|
-
IconFieldModule,
|
|
3497
|
-
InputIconModule,
|
|
3498
|
-
TextareaModule,
|
|
3499
|
-
InputTextModule,
|
|
3500
|
-
KnobModule,
|
|
3501
|
-
ListboxModule,
|
|
3502
|
-
MegaMenuModule,
|
|
3503
|
-
MenubarModule,
|
|
3504
|
-
MenuModule,
|
|
3505
|
-
MessageModule,
|
|
3506
|
-
MultiSelectModule,
|
|
3507
|
-
OrganizationChartModule,
|
|
3508
|
-
OverlayPanelModule,
|
|
3509
|
-
PanelMenuModule,
|
|
3510
|
-
PanelModule,
|
|
3511
|
-
PasswordModule,
|
|
3512
|
-
ProgressBarModule,
|
|
3513
|
-
RadioButtonModule,
|
|
3514
|
-
RatingModule,
|
|
3515
|
-
RippleModule,
|
|
3516
|
-
ScrollPanelModule,
|
|
3517
|
-
ScrollTopModule,
|
|
3518
|
-
SelectButtonModule,
|
|
3519
|
-
SidebarModule,
|
|
3520
|
-
SkeletonModule,
|
|
3521
|
-
SliderModule,
|
|
3522
|
-
SplitButtonModule,
|
|
3523
|
-
SplitterModule,
|
|
3524
|
-
StepsModule,
|
|
3525
|
-
SelectModule,
|
|
3526
|
-
TableModule,
|
|
3527
|
-
TabMenuModule,
|
|
3528
|
-
TabViewModule,
|
|
3529
|
-
TagModule,
|
|
3530
|
-
TerminalModule,
|
|
3531
|
-
TieredMenuModule,
|
|
3532
|
-
TimelineModule,
|
|
3533
|
-
ToastModule,
|
|
3534
|
-
ToggleButtonModule,
|
|
3535
|
-
ToolbarModule,
|
|
3536
|
-
TooltipModule,
|
|
3537
|
-
TreeModule,
|
|
3538
|
-
SfAdoModule] });
|
|
3539
|
-
}
|
|
3540
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SfCrudModule, decorators: [{
|
|
3541
|
-
type: NgModule,
|
|
3542
|
-
args: [{
|
|
3543
|
-
declarations: [
|
|
3544
|
-
SfCrudComponent,
|
|
3545
|
-
TableroComponent,
|
|
3546
|
-
RegistroComponent,
|
|
3547
|
-
ControlComponent,
|
|
3548
|
-
StepComponent,
|
|
3549
|
-
FormComponent,
|
|
3550
|
-
FileUploadComponent,
|
|
3551
|
-
FormatAddressPipe
|
|
3552
|
-
],
|
|
3553
|
-
imports: [
|
|
3554
|
-
SfCrudRoutingModule,
|
|
3555
|
-
SfPdfsignModule,
|
|
3556
|
-
SfSimuladorModule,
|
|
3557
|
-
AccordionModule,
|
|
3558
|
-
AutoCompleteModule,
|
|
3559
|
-
AvatarGroupModule,
|
|
3560
|
-
AvatarModule,
|
|
3561
|
-
BadgeModule,
|
|
3562
|
-
BlockUIModule,
|
|
3563
|
-
BreadcrumbModule,
|
|
3564
|
-
ButtonModule,
|
|
3565
|
-
CalendarModule,
|
|
3566
|
-
CardModule,
|
|
3567
|
-
CarouselModule,
|
|
3568
|
-
CascadeSelectModule,
|
|
3569
|
-
CheckboxModule,
|
|
3570
|
-
ChipModule,
|
|
3571
|
-
ChipModule,
|
|
3572
|
-
ColorPickerModule,
|
|
3573
|
-
ConfirmDialogModule,
|
|
3574
|
-
ConfirmPopupModule,
|
|
3575
|
-
ContextMenuModule,
|
|
3576
|
-
DialogModule,
|
|
3577
|
-
DividerModule,
|
|
3578
|
-
DropdownModule,
|
|
3579
|
-
DatePickerModule,
|
|
3580
|
-
FieldsetModule,
|
|
3581
|
-
FileUploadModule,
|
|
3582
|
-
FluidModule,
|
|
3583
|
-
FormsModule,
|
|
3584
|
-
GalleriaModule,
|
|
3585
|
-
HttpClientModule,
|
|
3586
|
-
RouterModule,
|
|
3587
|
-
InplaceModule,
|
|
3588
|
-
InputMaskModule,
|
|
3589
|
-
InputNumberModule,
|
|
3590
|
-
InputSwitchModule,
|
|
3591
|
-
InputGroupModule,
|
|
3592
|
-
InputGroupAddonModule,
|
|
3593
|
-
IconFieldModule,
|
|
3594
|
-
InputIconModule,
|
|
3595
|
-
TextareaModule,
|
|
3596
|
-
InputTextModule,
|
|
3597
|
-
KnobModule,
|
|
3598
|
-
ListboxModule,
|
|
3599
|
-
MegaMenuModule,
|
|
3600
|
-
MenubarModule,
|
|
3601
|
-
MenuModule,
|
|
3602
|
-
MessageModule,
|
|
3603
|
-
MultiSelectModule,
|
|
3604
|
-
OrganizationChartModule,
|
|
3605
|
-
OverlayPanelModule,
|
|
3606
|
-
PanelMenuModule,
|
|
3607
|
-
PanelModule,
|
|
3608
|
-
PasswordModule,
|
|
3609
|
-
ProgressBarModule,
|
|
3610
|
-
RadioButtonModule,
|
|
3611
|
-
RatingModule,
|
|
3612
|
-
RippleModule,
|
|
3613
|
-
ScrollPanelModule,
|
|
3614
|
-
ScrollTopModule,
|
|
3615
|
-
SelectButtonModule,
|
|
3616
|
-
SidebarModule,
|
|
3617
|
-
SkeletonModule,
|
|
3618
|
-
SliderModule,
|
|
3619
|
-
SplitButtonModule,
|
|
3620
|
-
SplitterModule,
|
|
3621
|
-
StepsModule,
|
|
3622
|
-
SelectModule,
|
|
3623
|
-
TableModule,
|
|
3624
|
-
TabMenuModule,
|
|
3625
|
-
TabViewModule,
|
|
3626
|
-
TagModule,
|
|
3627
|
-
TerminalModule,
|
|
3628
|
-
TieredMenuModule,
|
|
3629
|
-
TimelineModule,
|
|
3630
|
-
ToastModule,
|
|
3631
|
-
ToggleButtonModule,
|
|
3632
|
-
ToolbarModule,
|
|
3633
|
-
TooltipModule,
|
|
3634
|
-
TreeModule,
|
|
3635
|
-
SfAdoModule
|
|
3636
|
-
],
|
|
3637
|
-
exports: [
|
|
3638
|
-
SfCrudComponent,
|
|
3639
|
-
TableroComponent,
|
|
3640
|
-
RegistroComponent,
|
|
3641
|
-
ControlComponent
|
|
3642
|
-
]
|
|
3643
|
-
}]
|
|
3644
|
-
}] });
|
|
3645
|
-
|
|
3646
3326
|
/*
|
|
3647
3327
|
* Public API Surface of sf-crud
|
|
3648
3328
|
*/
|
|
@@ -3651,5 +3331,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
3651
3331
|
* Generated bundle index. Do not edit.
|
|
3652
3332
|
*/
|
|
3653
3333
|
|
|
3654
|
-
export { APP_DIALOG_COMPONENT, ChangeData, ConfigRegistro, ConfigTablero, ConstructionId, ControlComponent, CrudConfig, FormComponent, Key, Notification, NotificationService, Operation, OverrideConfig, RegistroComponent, RequestChecking, SfCrudComponent,
|
|
3334
|
+
export { APP_DIALOG_COMPONENT, ChangeData, ConfigRegistro, ConfigTablero, ConstructionId, ControlComponent, CrudConfig, FormComponent, Key, Notification, NotificationService, Operation, OverrideConfig, RegistroComponent, RequestChecking, SfCrudComponent, SfCrudService, Shema, StepService, TableroComponent, Validations, keyEsquema };
|
|
3655
3335
|
//# sourceMappingURL=sf-crud.mjs.map
|