@elasticias/ui 0.0.13 → 0.0.14
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.
|
@@ -2,7 +2,7 @@ import * as i0 from '@angular/core';
|
|
|
2
2
|
import { Pipe, input, Component, output, computed, booleanAttribute, Input, EventEmitter, inject, Injector, forwardRef, Output, ContentChild, HostBinding, ViewChild, model, signal, effect, ChangeDetectionStrategy, LOCALE_ID, contentChild, ViewEncapsulation, ElementRef, PLATFORM_ID } from '@angular/core';
|
|
3
3
|
import * as i1 from 'primeng/button';
|
|
4
4
|
import { ButtonModule } from 'primeng/button';
|
|
5
|
-
import * as
|
|
5
|
+
import * as i1$3 from '@angular/common';
|
|
6
6
|
import { CommonModule, CurrencyPipe, DatePipe, DecimalPipe } from '@angular/common';
|
|
7
7
|
import * as i2 from '@angular/forms';
|
|
8
8
|
import { NgControl, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
@@ -15,48 +15,48 @@ import * as i2$3 from 'primeng/table';
|
|
|
15
15
|
import { TableModule } from 'primeng/table';
|
|
16
16
|
import * as i1$1 from 'primeng/fieldset';
|
|
17
17
|
import { FieldsetModule } from 'primeng/fieldset';
|
|
18
|
-
import * as
|
|
18
|
+
import * as i5 from 'primeng/divider';
|
|
19
19
|
import { DividerModule } from 'primeng/divider';
|
|
20
20
|
import * as i2$1 from 'primeng/tooltip';
|
|
21
21
|
import { TooltipModule } from 'primeng/tooltip';
|
|
22
22
|
import * as i1$2 from 'primeng/select';
|
|
23
23
|
import { SelectModule } from 'primeng/select';
|
|
24
|
-
import * as i1$
|
|
24
|
+
import * as i1$4 from 'primeng/datepicker';
|
|
25
25
|
import { DatePickerModule } from 'primeng/datepicker';
|
|
26
|
-
import * as i1$
|
|
26
|
+
import * as i1$5 from 'primeng/inputnumber';
|
|
27
27
|
import { InputNumberModule } from 'primeng/inputnumber';
|
|
28
28
|
import * as i2$4 from 'primeng/accordion';
|
|
29
29
|
import { AccordionModule } from 'primeng/accordion';
|
|
30
30
|
import * as i3$1 from 'primeng/badge';
|
|
31
31
|
import { BadgeModule } from 'primeng/badge';
|
|
32
|
-
import * as i5 from 'primeng/checkbox';
|
|
32
|
+
import * as i5$1 from 'primeng/checkbox';
|
|
33
33
|
import { CheckboxModule } from 'primeng/checkbox';
|
|
34
|
-
import * as i6
|
|
34
|
+
import * as i6 from 'primeng/chip';
|
|
35
35
|
import { ChipModule } from 'primeng/chip';
|
|
36
36
|
import * as i7 from 'primeng/iconfield';
|
|
37
37
|
import { IconFieldModule } from 'primeng/iconfield';
|
|
38
|
-
import * as i8
|
|
38
|
+
import * as i8 from 'primeng/inputicon';
|
|
39
39
|
import { InputIconModule } from 'primeng/inputicon';
|
|
40
40
|
import * as i9 from 'primeng/inputtext';
|
|
41
41
|
import { InputTextModule } from 'primeng/inputtext';
|
|
42
|
-
import * as i5$
|
|
42
|
+
import * as i5$2 from 'primeng/card';
|
|
43
43
|
import { CardModule } from 'primeng/card';
|
|
44
44
|
import { MenuModule } from 'primeng/menu';
|
|
45
45
|
import * as i2$5 from 'primeng/api';
|
|
46
|
-
import * as i1$
|
|
46
|
+
import * as i1$6 from 'primeng/dialog';
|
|
47
47
|
import { DialogModule } from 'primeng/dialog';
|
|
48
|
-
import * as i1$
|
|
48
|
+
import * as i1$7 from 'primeng/toolbar';
|
|
49
49
|
import { ToolbarModule } from 'primeng/toolbar';
|
|
50
50
|
import { ScreenStateEnum } from '@elasticias/screens';
|
|
51
51
|
import { Router } from '@angular/router';
|
|
52
52
|
import { PermissionsEnum } from '@elasticias/types';
|
|
53
|
-
import * as i1$
|
|
53
|
+
import * as i1$8 from 'primeng/blockui';
|
|
54
54
|
import { BlockUIModule } from 'primeng/blockui';
|
|
55
|
-
import * as i1$
|
|
55
|
+
import * as i1$9 from 'primeng/password';
|
|
56
56
|
import { PasswordModule } from 'primeng/password';
|
|
57
57
|
import * as i2$6 from 'primeng/multiselect';
|
|
58
58
|
import { MultiSelectModule } from 'primeng/multiselect';
|
|
59
|
-
import * as i1$
|
|
59
|
+
import * as i1$a from 'primeng/selectbutton';
|
|
60
60
|
import { SelectButtonModule, SelectButton } from 'primeng/selectbutton';
|
|
61
61
|
import { updatePreset, updateSurfacePalette, $t } from '@primeng/themes';
|
|
62
62
|
import Aura from '@primeng/themes/aura';
|
|
@@ -67,7 +67,7 @@ import { PrimeNG } from 'primeng/config';
|
|
|
67
67
|
import * as i3$2 from 'primeng/toggleswitch';
|
|
68
68
|
import { ToggleSwitchModule } from 'primeng/toggleswitch';
|
|
69
69
|
import { EfThemeConfigService } from '@elasticias/core';
|
|
70
|
-
import * as i5$
|
|
70
|
+
import * as i5$3 from 'primeng/tag';
|
|
71
71
|
import { TagModule } from 'primeng/tag';
|
|
72
72
|
|
|
73
73
|
/**
|
|
@@ -686,7 +686,7 @@ class EfSelectComponent {
|
|
|
686
686
|
provide: NG_VALUE_ACCESSOR,
|
|
687
687
|
useExisting: forwardRef(() => EfSelectComponent),
|
|
688
688
|
multi: true,
|
|
689
|
-
}], queries: [{ propertyName: "itemTemplate", first: true, predicate: ["item"], descendants: true }, { propertyName: "selectedItemTemplate", first: true, predicate: ["selectedItem"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" [for]=\"effectiveId\" [required]=\"required\" />\n}\n<div class=\"ef-field-control\">\n <p-select\n [inputId]=\"effectiveId\"\n [name]=\"name\"\n [ngModel]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n (onChange)=\"handleSelectionChange($event)\"\n (onClear)=\"handleClear()\"\n [options]=\"filteredOptions\"\n [optionLabel]=\"optionLabel\"\n [optionValue]=\"optionValue\"\n [placeholder]=\"effectivePlaceholder\"\n [size]=\"size\"\n [filter]=\"filter\"\n [showClear]=\"showClear\"\n [disabled]=\"disabled\"\n [appendTo]=\"appendTo\"\n [class.ng-invalid]=\"isInvalid\"\n [class.ng-touched]=\"ngControl?.touched\"\n fluid\n >\n @if (itemTemplate) {\n <ng-template #item let-item>\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n </ng-template>\n }\n @if (selectedItemTemplate) {\n <ng-template #selectedItem let-item>\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: item }\"></ng-container>\n </ng-template>\n }\n </p-select>\n @if (showRequired) {\n <small class=\"text-danger\">{{ 'validation.required' | translate }}</small>\n }\n @if (serverErrors; as errors) {\n @for (error of errors; track error) {\n <small class=\"text-danger block\">{{ error }}</small>\n }\n }\n</div>\n", styles: [":host{display:block}:host(.ef-inline){display:flex;align-items:baseline;gap:.5rem}:host(.ef-inline)>label{white-space:nowrap;flex-shrink:0}:host(.ef-inline)>.ef-field-control{flex:1;min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: SelectModule }, { kind: "component", type: i1$2.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EfLabelComponent, selector: "ef-label", inputs: ["label", "labelKey", "for", "styleClass", "required"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
689
|
+
}], queries: [{ propertyName: "itemTemplate", first: true, predicate: ["item"], descendants: true }, { propertyName: "selectedItemTemplate", first: true, predicate: ["selectedItem"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" [for]=\"effectiveId\" [required]=\"required\" />\n}\n<div class=\"ef-field-control\">\n <p-select\n [inputId]=\"effectiveId\"\n [name]=\"name\"\n [ngModel]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n (onChange)=\"handleSelectionChange($event)\"\n (onClear)=\"handleClear()\"\n [options]=\"filteredOptions\"\n [optionLabel]=\"optionLabel\"\n [optionValue]=\"optionValue\"\n [placeholder]=\"effectivePlaceholder\"\n [size]=\"size\"\n [filter]=\"filter\"\n [showClear]=\"showClear\"\n [disabled]=\"disabled\"\n [appendTo]=\"appendTo\"\n [class.ng-invalid]=\"isInvalid\"\n [class.ng-touched]=\"ngControl?.touched\"\n fluid\n >\n @if (itemTemplate) {\n <ng-template #item let-item>\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n </ng-template>\n }\n @if (selectedItemTemplate) {\n <ng-template #selectedItem let-item>\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: item }\"></ng-container>\n </ng-template>\n }\n </p-select>\n @if (showRequired) {\n <small class=\"text-danger\">{{ 'validation.required' | translate }}</small>\n }\n @if (serverErrors; as errors) {\n @for (error of errors; track error) {\n <small class=\"text-danger block\">{{ error }}</small>\n }\n }\n</div>\n", styles: [":host{display:block}:host(.ef-inline){display:flex;align-items:baseline;gap:.5rem}:host(.ef-inline)>label{white-space:nowrap;flex-shrink:0}:host(.ef-inline)>.ef-field-control{flex:1;min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: SelectModule }, { kind: "component", type: i1$2.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EfLabelComponent, selector: "ef-label", inputs: ["label", "labelKey", "for", "styleClass", "required"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
690
690
|
}
|
|
691
691
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfSelectComponent, decorators: [{
|
|
692
692
|
type: Component,
|
|
@@ -821,7 +821,7 @@ class EfDatepickerComponent {
|
|
|
821
821
|
this.onTouched();
|
|
822
822
|
}
|
|
823
823
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfDatepickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
824
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfDatepickerComponent, isStandalone: true, selector: "ef-datepicker", inputs: { label: "label", labelKey: "labelKey", inputId: "inputId", name: "name", placeholder: "placeholder", placeholderKey: "placeholderKey", size: "size", required: ["required", "required", booleanAttribute], fluid: ["fluid", "fluid", booleanAttribute], inline: ["inline", "inline", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], showIcon: ["showIcon", "showIcon", booleanAttribute], iconDisplay: "iconDisplay", selectionMode: "selectionMode", dateFormat: "dateFormat", appendTo: "appendTo", showTime: ["showTime", "showTime", booleanAttribute], showButtonBar: ["showButtonBar", "showButtonBar", booleanAttribute], minDate: "minDate", maxDate: "maxDate" }, outputs: { dateSelectEvent: "dateSelectEvent" }, host: { properties: { "class.ef-inline": "this.isInline" } }, ngImport: i0, template: "@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" [for]=\"effectiveId\" [required]=\"required\" />\n}\n<div class=\"ef-field-control\">\n <p-datepicker\n [inputId]=\"effectiveId\"\n [name]=\"name\"\n [ngModel]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n (ngModelChange)=\"handleChange($event)\"\n (onBlur)=\"handleBlur()\"\n [placeholder]=\"effectivePlaceholder\"\n [size]=\"size\"\n [disabled]=\"disabled\"\n [showIcon]=\"showIcon\"\n [iconDisplay]=\"iconDisplay\"\n [selectionMode]=\"selectionMode\"\n [dateFormat]=\"dateFormat\"\n [appendTo]=\"appendTo\"\n [showTime]=\"showTime\"\n [showButtonBar]=\"showButtonBar\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [fluid]=\"fluid\"\n [class.ng-invalid]=\"isInvalid\"\n [class.ng-touched]=\"ngControl?.touched\"\n />\n @if (showRequired) {\n <small class=\"text-danger\">{{ 'validation.required' | translate }}</small>\n }\n @if (serverErrors; as errors) {\n @for (error of errors; track error) {\n <small class=\"text-danger block\">{{ error }}</small>\n }\n }\n</div>\n", styles: [":host{display:block}:host(.ef-inline){display:flex;align-items:baseline;gap:.5rem}:host(.ef-inline)>label{white-space:nowrap;flex-shrink:0}:host(.ef-inline)>.ef-field-control{flex:1;min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i1$
|
|
824
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfDatepickerComponent, isStandalone: true, selector: "ef-datepicker", inputs: { label: "label", labelKey: "labelKey", inputId: "inputId", name: "name", placeholder: "placeholder", placeholderKey: "placeholderKey", size: "size", required: ["required", "required", booleanAttribute], fluid: ["fluid", "fluid", booleanAttribute], inline: ["inline", "inline", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], showIcon: ["showIcon", "showIcon", booleanAttribute], iconDisplay: "iconDisplay", selectionMode: "selectionMode", dateFormat: "dateFormat", appendTo: "appendTo", showTime: ["showTime", "showTime", booleanAttribute], showButtonBar: ["showButtonBar", "showButtonBar", booleanAttribute], minDate: "minDate", maxDate: "maxDate" }, outputs: { dateSelectEvent: "dateSelectEvent" }, host: { properties: { "class.ef-inline": "this.isInline" } }, ngImport: i0, template: "@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" [for]=\"effectiveId\" [required]=\"required\" />\n}\n<div class=\"ef-field-control\">\n <p-datepicker\n [inputId]=\"effectiveId\"\n [name]=\"name\"\n [ngModel]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n (ngModelChange)=\"handleChange($event)\"\n (onBlur)=\"handleBlur()\"\n [placeholder]=\"effectivePlaceholder\"\n [size]=\"size\"\n [disabled]=\"disabled\"\n [showIcon]=\"showIcon\"\n [iconDisplay]=\"iconDisplay\"\n [selectionMode]=\"selectionMode\"\n [dateFormat]=\"dateFormat\"\n [appendTo]=\"appendTo\"\n [showTime]=\"showTime\"\n [showButtonBar]=\"showButtonBar\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [fluid]=\"fluid\"\n [class.ng-invalid]=\"isInvalid\"\n [class.ng-touched]=\"ngControl?.touched\"\n />\n @if (showRequired) {\n <small class=\"text-danger\">{{ 'validation.required' | translate }}</small>\n }\n @if (serverErrors; as errors) {\n @for (error of errors; track error) {\n <small class=\"text-danger block\">{{ error }}</small>\n }\n }\n</div>\n", styles: [":host{display:block}:host(.ef-inline){display:flex;align-items:baseline;gap:.5rem}:host(.ef-inline)>label{white-space:nowrap;flex-shrink:0}:host(.ef-inline)>.ef-field-control{flex:1;min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i1$4.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo", "motionOptions"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EfLabelComponent, selector: "ef-label", inputs: ["label", "labelKey", "for", "styleClass", "required"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
825
825
|
}
|
|
826
826
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfDatepickerComponent, decorators: [{
|
|
827
827
|
type: Component,
|
|
@@ -1043,7 +1043,7 @@ class EfInputNumberComponent {
|
|
|
1043
1043
|
}
|
|
1044
1044
|
}
|
|
1045
1045
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfInputNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1046
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfInputNumberComponent, isStandalone: true, selector: "ef-inputnumber", inputs: { label: "label", labelKey: "labelKey", required: ["required", "required", booleanAttribute], value: "value", invalid: "invalid", disabled: "disabled", readonly: "readonly", format: "format", showButtons: "showButtons", buttonLayout: "buttonLayout", incrementButtonClass: "incrementButtonClass", decrementButtonClass: "decrementButtonClass", incrementButtonIcon: "incrementButtonIcon", decrementButtonIcon: "decrementButtonIcon", prefix: "prefix", suffix: "suffix", currency: "currency", currencyDisplay: "currencyDisplay", locale: "locale", localeMatcher: "localeMatcher", mode: "mode", useGrouping: "useGrouping", minFractionDigits: "minFractionDigits", maxFractionDigits: "maxFractionDigits", min: "min", max: "max", step: "step", allowEmpty: "allowEmpty", inputId: "inputId", name: "name", placeholder: "placeholder", placeholderKey: "placeholderKey", inputSize: "inputSize", size: "size", maxlength: "maxlength", minlength: "minlength", pattern: "pattern", tabindex: "tabindex", title: "title", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", ariaDescribedBy: "ariaDescribedBy", ariaRequired: "ariaRequired", inputStyle: "inputStyle", inputStyleClass: "inputStyleClass", style: "style", styleClass: "styleClass", showClear: "showClear", variant: "variant", autofocus: "autofocus", autocomplete: "autocomplete", fluid: "fluid", inline: ["inline", "inline", booleanAttribute], pt: "pt", ptOptions: "ptOptions", dt: "dt", unstyled: "unstyled" }, outputs: { inputEvent: "inputEvent", focusEvent: "focusEvent", blurEvent: "blurEvent", keyDownEvent: "keyDownEvent", clearEvent: "clearEvent" }, host: { properties: { "class.ef-inline": "this.isInline" } }, viewQueries: [{ propertyName: "inputNumber", first: true, predicate: ["inputNumber"], descendants: true }], ngImport: i0, template: "@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" [for]=\"effectiveId\" [required]=\"required\" />\n}\n<div class=\"ef-field-control\">\n <p-inputnumber\n #inputNumber\n [(ngModel)]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n [invalid]=\"isInvalid\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [format]=\"format\"\n [showButtons]=\"showButtons\"\n [buttonLayout]=\"buttonLayout\"\n [incrementButtonClass]=\"incrementButtonClass\"\n [decrementButtonClass]=\"decrementButtonClass\"\n [incrementButtonIcon]=\"incrementButtonIcon\"\n [decrementButtonIcon]=\"decrementButtonIcon\"\n [prefix]=\"prefix\"\n [suffix]=\"suffix\"\n [currency]=\"currency\"\n [currencyDisplay]=\"currencyDisplay\"\n [locale]=\"locale\"\n [localeMatcher]=\"localeMatcher\"\n [mode]=\"mode\"\n [useGrouping]=\"useGrouping\"\n [minFractionDigits]=\"minFractionDigits\"\n [maxFractionDigits]=\"maxFractionDigits\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [allowEmpty]=\"allowEmpty\"\n [inputId]=\"effectiveId\"\n [name]=\"name\"\n [placeholder]=\"effectivePlaceholder\"\n [inputSize]=\"inputSize\"\n [size]=\"size\"\n [maxlength]=\"maxlength\"\n [minlength]=\"minlength\"\n [pattern]=\"pattern\"\n [tabindex]=\"tabindex\"\n [title]=\"title\"\n [ariaLabel]=\"ariaLabel\"\n [ariaLabelledBy]=\"ariaLabelledBy\"\n [ariaDescribedBy]=\"ariaDescribedBy\"\n [ariaRequired]=\"ariaRequired\"\n [inputStyle]=\"inputStyle\"\n [inputStyleClass]=\"inputStyleClass\"\n [style]=\"style\"\n [styleClass]=\"styleClass\"\n [showClear]=\"showClear\"\n [variant]=\"variant\"\n [autofocus]=\"autofocus\"\n [autocomplete]=\"autocomplete\"\n [fluid]=\"fluid\"\n [pt]=\"pt\"\n [ptOptions]=\"ptOptions\"\n [dt]=\"dt\"\n [unstyled]=\"unstyled\"\n (onInput)=\"handleInput($event)\"\n (onFocus)=\"handleFocus($event)\"\n (onBlur)=\"handleBlur($event)\"\n (onKeyDown)=\"handleKeyDown($event)\"\n (onClear)=\"handleClear()\"\n />\n @if (showRequired) {\n <small class=\"text-danger\">{{ 'validation.required' | translate }}</small>\n }\n @if (serverErrors; as errors) {\n @for (error of errors; track error) {\n <small class=\"text-danger block\">{{ error }}</small>\n }\n }\n</div>\n", styles: [":host{display:block;width:100%}:host(.ef-inline){display:flex;align-items:baseline;gap:.5rem}:host(.ef-inline)>label{white-space:nowrap;flex-shrink:0}:host(.ef-inline)>.ef-field-control{flex:1;min-width:0}:host(.ef-inputnumber-small) ::ng-deep .p-inputnumber-input{font-size:.875rem;padding:.375rem .5rem}:host(.ef-inputnumber-large) ::ng-deep .p-inputnumber-input{font-size:1.125rem;padding:.75rem 1rem}:host(.ng-invalid.ng-touched) ::ng-deep .p-inputnumber-input,:host(.ng-invalid.ng-dirty) ::ng-deep .p-inputnumber-input{border-color:var(--red-500, #ef4444)}:host(.ng-invalid.ng-touched) ::ng-deep .p-inputnumber-input:focus,:host(.ng-invalid.ng-dirty) ::ng-deep .p-inputnumber-input:focus{box-shadow:0 0 0 .2rem #ef444440}\n"], dependencies: [{ kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i1$
|
|
1046
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfInputNumberComponent, isStandalone: true, selector: "ef-inputnumber", inputs: { label: "label", labelKey: "labelKey", required: ["required", "required", booleanAttribute], value: "value", invalid: "invalid", disabled: "disabled", readonly: "readonly", format: "format", showButtons: "showButtons", buttonLayout: "buttonLayout", incrementButtonClass: "incrementButtonClass", decrementButtonClass: "decrementButtonClass", incrementButtonIcon: "incrementButtonIcon", decrementButtonIcon: "decrementButtonIcon", prefix: "prefix", suffix: "suffix", currency: "currency", currencyDisplay: "currencyDisplay", locale: "locale", localeMatcher: "localeMatcher", mode: "mode", useGrouping: "useGrouping", minFractionDigits: "minFractionDigits", maxFractionDigits: "maxFractionDigits", min: "min", max: "max", step: "step", allowEmpty: "allowEmpty", inputId: "inputId", name: "name", placeholder: "placeholder", placeholderKey: "placeholderKey", inputSize: "inputSize", size: "size", maxlength: "maxlength", minlength: "minlength", pattern: "pattern", tabindex: "tabindex", title: "title", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", ariaDescribedBy: "ariaDescribedBy", ariaRequired: "ariaRequired", inputStyle: "inputStyle", inputStyleClass: "inputStyleClass", style: "style", styleClass: "styleClass", showClear: "showClear", variant: "variant", autofocus: "autofocus", autocomplete: "autocomplete", fluid: "fluid", inline: ["inline", "inline", booleanAttribute], pt: "pt", ptOptions: "ptOptions", dt: "dt", unstyled: "unstyled" }, outputs: { inputEvent: "inputEvent", focusEvent: "focusEvent", blurEvent: "blurEvent", keyDownEvent: "keyDownEvent", clearEvent: "clearEvent" }, host: { properties: { "class.ef-inline": "this.isInline" } }, viewQueries: [{ propertyName: "inputNumber", first: true, predicate: ["inputNumber"], descendants: true }], ngImport: i0, template: "@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" [for]=\"effectiveId\" [required]=\"required\" />\n}\n<div class=\"ef-field-control\">\n <p-inputnumber\n #inputNumber\n [(ngModel)]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n [invalid]=\"isInvalid\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [format]=\"format\"\n [showButtons]=\"showButtons\"\n [buttonLayout]=\"buttonLayout\"\n [incrementButtonClass]=\"incrementButtonClass\"\n [decrementButtonClass]=\"decrementButtonClass\"\n [incrementButtonIcon]=\"incrementButtonIcon\"\n [decrementButtonIcon]=\"decrementButtonIcon\"\n [prefix]=\"prefix\"\n [suffix]=\"suffix\"\n [currency]=\"currency\"\n [currencyDisplay]=\"currencyDisplay\"\n [locale]=\"locale\"\n [localeMatcher]=\"localeMatcher\"\n [mode]=\"mode\"\n [useGrouping]=\"useGrouping\"\n [minFractionDigits]=\"minFractionDigits\"\n [maxFractionDigits]=\"maxFractionDigits\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [allowEmpty]=\"allowEmpty\"\n [inputId]=\"effectiveId\"\n [name]=\"name\"\n [placeholder]=\"effectivePlaceholder\"\n [inputSize]=\"inputSize\"\n [size]=\"size\"\n [maxlength]=\"maxlength\"\n [minlength]=\"minlength\"\n [pattern]=\"pattern\"\n [tabindex]=\"tabindex\"\n [title]=\"title\"\n [ariaLabel]=\"ariaLabel\"\n [ariaLabelledBy]=\"ariaLabelledBy\"\n [ariaDescribedBy]=\"ariaDescribedBy\"\n [ariaRequired]=\"ariaRequired\"\n [inputStyle]=\"inputStyle\"\n [inputStyleClass]=\"inputStyleClass\"\n [style]=\"style\"\n [styleClass]=\"styleClass\"\n [showClear]=\"showClear\"\n [variant]=\"variant\"\n [autofocus]=\"autofocus\"\n [autocomplete]=\"autocomplete\"\n [fluid]=\"fluid\"\n [pt]=\"pt\"\n [ptOptions]=\"ptOptions\"\n [dt]=\"dt\"\n [unstyled]=\"unstyled\"\n (onInput)=\"handleInput($event)\"\n (onFocus)=\"handleFocus($event)\"\n (onBlur)=\"handleBlur($event)\"\n (onKeyDown)=\"handleKeyDown($event)\"\n (onClear)=\"handleClear()\"\n />\n @if (showRequired) {\n <small class=\"text-danger\">{{ 'validation.required' | translate }}</small>\n }\n @if (serverErrors; as errors) {\n @for (error of errors; track error) {\n <small class=\"text-danger block\">{{ error }}</small>\n }\n }\n</div>\n", styles: [":host{display:block;width:100%}:host(.ef-inline){display:flex;align-items:baseline;gap:.5rem}:host(.ef-inline)>label{white-space:nowrap;flex-shrink:0}:host(.ef-inline)>.ef-field-control{flex:1;min-width:0}:host(.ef-inputnumber-small) ::ng-deep .p-inputnumber-input{font-size:.875rem;padding:.375rem .5rem}:host(.ef-inputnumber-large) ::ng-deep .p-inputnumber-input{font-size:1.125rem;padding:.75rem 1rem}:host(.ng-invalid.ng-touched) ::ng-deep .p-inputnumber-input,:host(.ng-invalid.ng-dirty) ::ng-deep .p-inputnumber-input{border-color:var(--red-500, #ef4444)}:host(.ng-invalid.ng-touched) ::ng-deep .p-inputnumber-input:focus,:host(.ng-invalid.ng-dirty) ::ng-deep .p-inputnumber-input:focus{box-shadow:0 0 0 .2rem #ef444440}\n"], dependencies: [{ kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i1$5.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EfLabelComponent, selector: "ef-label", inputs: ["label", "labelKey", "for", "styleClass", "required"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
1047
1047
|
}
|
|
1048
1048
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfInputNumberComponent, decorators: [{
|
|
1049
1049
|
type: Component,
|
|
@@ -1764,7 +1764,7 @@ class EfOrderBuilderComponent {
|
|
|
1764
1764
|
return OrderEntityHelper.calculateTotals(this.order());
|
|
1765
1765
|
}
|
|
1766
1766
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfOrderBuilderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1767
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfOrderBuilderComponent, isStandalone: true, selector: "ef-order-builder", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, order: { classPropertyName: "order", publicName: "order", isSignal: true, isRequired: true, transformFunction: null }, products: { classPropertyName: "products", publicName: "products", isSignal: true, isRequired: true, transformFunction: null }, customers: { classPropertyName: "customers", publicName: "customers", isSignal: true, isRequired: true, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, countGroupLabels: { classPropertyName: "countGroupLabels", publicName: "countGroupLabels", isSignal: true, isRequired: false, transformFunction: null }, productKeyField: { classPropertyName: "productKeyField", publicName: "productKeyField", isSignal: true, isRequired: false, transformFunction: null }, backendErrors: { classPropertyName: "backendErrors", publicName: "backendErrors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { order: "orderChange", openCatalogue: "openCatalogue", orderChanged: "orderChanged", orderValidated: "orderValidated", productsAdded: "productsAdded" }, ngImport: i0, template: "<!-- Order Header -->\n<p-fieldset [legend]=\"config().headerLabel\">\n <div class=\"grid grid-cols-12 items-baseline gap-2 mb-2\">\n <ef-label [label]=\"config().customerLabel\" for=\"order.customerId\" styleClass=\"col-span-12 md:col-span-6 form-label-left\" required />\n <ef-label [label]=\"config().dateLabel\" for=\"order.orderDate\" styleClass=\"col-span-3 form-label-left\" required />\n </div>\n <div class=\"grid grid-cols-12 items-baseline gap-2 mb-2 mt-4\">\n <div class=\"col-span-12 md:col-span-6\">\n <ef-select\n [ngModel]=\"order().customerId\"\n (ngModelChange)=\"updateCustomer($event)\"\n name=\"order.customerId\"\n inputId=\"order.customerId\"\n [options]=\"customers()\"\n optionValue=\"customerId\"\n optionLabel=\"companyName\"\n [placeholder]=\"config().customerLabel\"\n filter\n showClear\n [disabled]=\"readonly()\"\n required\n />\n </div>\n <div class=\"col-span-3\">\n <ef-datepicker\n [ngModel]=\"order().orderDate\"\n (ngModelChange)=\"updateOrderDate($event)\"\n name=\"order.orderDate\"\n inputId=\"order.orderDate\"\n [disabled]=\"readonly()\"\n required\n />\n </div>\n </div>\n\n @if (config().enableQuickAdd && !readonly()) {\n <div class=\"grid grid-cols-12 items-baseline gap-2 mt-4 mb-2\">\n <ef-label labelKey=\"label.article\" for=\"quickAdd.product\" styleClass=\"col-span-12 md:col-span-6 form-label-left\" />\n <ef-label labelKey=\"label.sale_price\" for=\"quickAdd.price\" styleClass=\"col-span-2 form-label-left\" />\n <ef-label labelKey=\"label.quantity\" for=\"quickAdd.quantity\" styleClass=\"col-span-2 form-label-left\" />\n </div>\n <div class=\"grid grid-cols-12 items-center gap-2\">\n <div class=\"col-span-12 md:col-span-6\">\n <ef-select\n [ngModel]=\"quickAddProduct()\"\n (ngModelChange)=\"onQuickAddProductSelect($event)\"\n name=\"quickAdd.product\"\n inputId=\"quickAdd.product\"\n [options]=\"flattenedProductOptions()\"\n optionLabel=\"_displayLabel\"\n placeholderKey=\"placeholder.select_article\"\n filter\n showClear\n [disabled]=\"readonly()\"\n />\n </div>\n <div class=\"col-span-2\">\n <ef-inputnumber\n id=\"quickAdd.price\"\n name=\"quickAdd.price\"\n [ngModel]=\"quickAddPrice()\"\n (ngModelChange)=\"quickAddPrice.set($event)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n [min]=\"0\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </div>\n <div class=\"col-span-2\">\n <ef-inputnumber\n id=\"quickAdd.quantity\"\n name=\"quickAdd.quantity\"\n [ngModel]=\"quickAddQuantity()\"\n (ngModelChange)=\"quickAddQuantity.set($event)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </div>\n <div class=\"col-span-2 flex justify-start gap-2\">\n <ef-button\n icon=\"pi pi-plus\"\n [rounded]=\"true\"\n severity=\"primary\"\n tooltipKey=\"tooltip.add_article\"\n [disabled]=\"quickAddDisabled()\"\n (clickEvent)=\"addQuickProduct()\"\n />\n @if (config().showCatalogue) {\n <ef-button\n icon=\"pi pi-search\"\n [rounded]=\"true\"\n severity=\"primary\"\n tooltipKey=\"tooltip.open_catalogue\"\n [disabled]=\"readonly()\"\n (clickEvent)=\"handleOpenCatalogue()\"\n />\n }\n </div>\n </div>\n }\n</p-fieldset>\n\n<div class=\"my-4\"></div>\n\n<!-- Order Line Items -->\n<p-fieldset legend=\"D\u00E9tails\">\n <p-table\n #pTable\n class=\"text-sm\"\n size=\"small\"\n [value]=\"orderLines()\"\n [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\n [resizableColumns]=\"true\"\n [tableStyle]=\"{ 'min-width': '50rem' }\"\n columnResizeMode=\"expand\"\n [showCurrentPageReport]=\"true\"\n stateStorage=\"local\"\n dataKey=\"id\"\n [rowTrackBy]=\"rowTrackBy\"\n >\n <ng-template #header>\n <tr>\n <th>{{ 'label.article' | translate }}</th>\n <th class=\"w-[120px] !text-end\">{{ 'label.sale_price' | translate }}</th>\n <th class=\"w-[120px] !text-end\">{{ 'label.quantity' | translate }}</th>\n @if (config().enableTax) {\n <th class=\"w-[120px] !text-end\">TVA (%)</th>\n }\n @if (config().enableDiscount) {\n <th class=\"w-[120px] !text-end\">\n Remise (%)\n </th>\n }\n <th class=\"w-[120px] !text-end\">Sous-Total</th>\n @if (!readonly()) {\n <th class=\"w-10 !text-end\"></th>\n }\n </tr>\n </ng-template>\n\n <ng-template #body let-item let-rowIndex=\"rowIndex\">\n <!-- Editing mode for new row -->\n @if (item.isEditing) {\n <tr>\n <td>\n <div class=\"align-items-center flex gap-2\">\n <ef-select\n [(ngModel)]=\"item.product\"\n (ngModelChange)=\"onProductSelect(item)\"\n [name]=\"'item.product.' + rowIndex\"\n [inputId]=\"'item.product.' + rowIndex\"\n [options]=\"flattenedProductOptions()\"\n optionLabel=\"_displayLabel\"\n placeholderKey=\"placeholder.select_article\"\n filter\n showClear\n [disabled]=\"readonly()\"\n appendTo=\"body\"\n />\n </div>\n </td>\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.productUnitPrice.' + rowIndex\"\n [name]=\"'item.productUnitPrice.' + rowIndex\"\n [(ngModel)]=\"item.productUnitPrice\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.quantity.' + rowIndex\"\n [name]=\"'item.quantity.' + rowIndex\"\n [(ngModel)]=\"item.quantity\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"saveEditingRow(item)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n @if (config().enableTax) {\n <td class=\"w-[120px] !text-end\">\n {{ item.taxRate || 0 }} %\n </td>\n }\n @if (config().enableDiscount) {\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.discount.' + rowIndex\"\n [name]=\"'item.discount.' + rowIndex\"\n [(ngModel)]=\"item.discount\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"saveEditingRow(item)\"\n [min]=\"0\"\n [max]=\"100\"\n suffix=\"%\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n }\n <td class=\"w-[120px] !text-end\">\n {{ calculateSubtotal(item) | currency: currency() }}\n </td>\n @if (!readonly()) {\n <td class=\"w-10 !text-end\">\n <p-button\n icon=\"pi pi-trash\"\n size=\"small\"\n [outlined]=\"true\"\n pTooltip=\"Supprimer\"\n tooltipPosition=\"top\"\n (click)=\"removeOrderLine(item.id)\"\n />\n </td>\n }\n </tr>\n }\n\n <!-- Display mode for saved row -->\n @if (!item.isEditing) {\n <tr>\n <td>\n <div\n [innerHTML]=\"AppUtils.truncate(item.productDescription)\"\n [pTooltip]=\"item.productDescription\"\n tooltipPosition=\"top\"\n ></div>\n </td>\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'productUnitPrice')\"\n >\n @if (\n item.editingField === 'productUnitPrice' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.productUnitPrice.edit.' + rowIndex\"\n [name]=\"'item.productUnitPrice.edit.' + rowIndex\"\n [(ngModel)]=\"item.productUnitPrice\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.productUnitPrice | currency: currency() }}\n </span>\n }\n </td>\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'quantity')\"\n >\n @if (\n item.editingField === 'quantity' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.quantity.edit.' + rowIndex\"\n [name]=\"'item.quantity.edit.' + rowIndex\"\n [(ngModel)]=\"item.quantity\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.quantity | number: '1.4-4' : locale() }}\n </span>\n }\n </td>\n @if (config().enableTax) {\n <td class=\"w-[120px] !text-end\">\n {{ item.taxRate || 0 }} %\n </td>\n }\n @if (config().enableDiscount) {\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'discount')\"\n >\n @if (\n item.editingField === 'discount' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.discount.edit.' + rowIndex\"\n [name]=\"'item.discount.edit.' + rowIndex\"\n [(ngModel)]=\"item.discount\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n [min]=\"0\"\n [max]=\"100\"\n suffix=\"%\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.discount || 0 }}%\n </span>\n }\n </td>\n }\n <td class=\"w-[120px] !text-end\">\n {{ item.grossAmount | currency: currency() }}\n </td>\n @if (!readonly()) {\n <td class=\"w-10 !text-end\">\n <p-button\n icon=\"pi pi-trash\"\n size=\"small\"\n [outlined]=\"true\"\n tooltipPosition=\"top\"\n pTooltip=\"Supprimer\"\n (click)=\"removeOrderLine(item.id)\"\n />\n </td>\n }\n </tr>\n }\n </ng-template>\n\n <ng-template #footer>\n @if (!readonly()) {\n <tr>\n <td\n [attr.colspan]=\"\n config().enableTax && config().enableDiscount\n ? 7\n : config().enableTax || config().enableDiscount\n ? 6\n : 5\n \"\n >\n <a\n href=\"javascript:void(0)\"\n class=\"inline-flex items-center gap-2 text-sm font-medium text-primary-500 hover:text-primary-700\"\n [class.opacity-50]=\"hasEditingRow()\"\n [class.pointer-events-none]=\"hasEditingRow()\"\n (click)=\"addNewProductRow()\"\n >\n <i class=\"pi pi-plus text-xs\"></i>\n Ajouter un article\n </a>\n @if (config().showCatalogue) {\n <ng-container>\n | \n <a\n href=\"javascript:void(0)\"\n class=\"inline-flex items-center gap-2 text-sm font-medium text-primary-500 hover:text-primary-700\"\n (click)=\"handleOpenCatalogue()\"\n >\n <i class=\"pi pi-search text-xs\"></i>\n Ouvrir le catalogue des articles\n </a>\n </ng-container>\n }\n </td>\n </tr>\n }\n\n <!-- Totals Section -->\n <tr class=\"border-t\">\n <td\n [attr.colspan]=\"\n config().enableTax && config().enableDiscount\n ? 5\n : config().enableTax || config().enableDiscount\n ? 4\n : 3\n \"\n >\n @if (config().showProductsSummary) {\n <div class=\"w-[500px]\">\n <div class=\"my-4\"></div>\n <ef-order-summary\n [orderLines]=\"orderLines()\"\n [countGroupLabels]=\"countGroupLabels()\"\n legend=\"R\u00E9capitulatif\"\n />\n </div>\n }\n </td>\n <td [attr.colspan]=\"readonly() ? 2 : 3\" class=\"!text-end\">\n <p-fieldset [legend]=\"'Totaux'\">\n <div class=\"flex flex-col gap-2\">\n <div class=\"flex items-end justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n Montant brut :\n </span>\n <span class=\"font-semibold\">\n {{ grossTotal() | currency: currency() }}\n </span>\n </div>\n @if (config().enableDiscount) {\n <div class=\"flex justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n Remise :\n </span>\n <span class=\"font-semibold\">\n {{ discountTotal() | currency: currency() }}\n </span>\n </div>\n }\n @if (config().enableTax) {\n <div class=\"flex justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n TVA :\n </span>\n <span class=\"font-semibold\">\n {{ tvaTotal() | currency: currency() }}\n </span>\n </div>\n }\n <p-divider class=\"!my-1\" />\n <div class=\"flex justify-between gap-4\">\n <span class=\"text-lg font-bold text-primary\">\n Montant Total :\n </span>\n <span class=\"text-lg font-bold text-primary\">\n {{ finalTotal() | currency: currency() }}\n </span>\n </div>\n </div>\n </p-fieldset>\n </td>\n </tr>\n </ng-template>\n </p-table>\n</p-fieldset>\n\n<!-- Optional Notes Section -->\n@if (config().showNotes) {\n <p-fieldset legend=\"Notes\">\n <textarea\n pTextarea\n id=\"order.notes\"\n name=\"order.notes\"\n [ngModel]=\"order().notes\"\n (ngModelChange)=\"updateNotes($event)\"\n [disabled]=\"readonly()\"\n [placeholder]=\"'common.notes_placeholder' | translate\"\n rows=\"5\"\n class=\"w-full\"\n ></textarea>\n </p-fieldset>\n}\n\n<!-- Validation Messages -->\n@if (hasErrors()) {\n <div\n class=\"my-4 rounded border border-red-200 bg-red-50 p-4 dark:bg-red-900/20\"\n >\n <div class=\"flex items-start gap-2\">\n <i\n class=\"pi pi-exclamation-triangle mt-1 text-red-600 dark:text-red-400\"\n ></i>\n <div class=\"flex-1\">\n <h4 class=\"mb-2 font-semibold text-red-800 dark:text-red-200\">\n Erreurs de validation\n </h4>\n <ul class=\"list-inside list-disc text-sm text-red-700 dark:text-red-300\">\n @for (error of combinedErrors() | keyvalue; track error.key) {\n <li>\n {{ error.value[0] }}\n </li>\n }\n </ul>\n </div>\n </div>\n </div>\n}\n\n<!-- Change Indicator -->\n@if (hasChanges()) {\n <div\n class=\"my-4 flex items-center gap-2 rounded border border-orange-200 bg-orange-50 p-3 dark:bg-orange-900/20\"\n >\n <i class=\"pi pi-info-circle text-orange-600 dark:text-orange-400\"></i>\n <span class=\"text-sm text-orange-800 dark:text-orange-200\">\n Modifications non sauvegard\u00E9es d\u00E9tect\u00E9es\n </span>\n </div>\n}\n", styles: [".inline-edit-cell{position:relative}.inline-edit-cell .edit-indicator{position:absolute;top:2px;right:2px;font-size:.65rem;opacity:0;transition:opacity .2s ease}.inline-edit-cell:hover .edit-indicator{opacity:.5}.cursor-pointer{cursor:pointer;transition:background-color .2s ease}.cursor-pointer:hover{background-color:#0000000d}:host-context(.dark-mode) .cursor-pointer:hover{background-color:#ffffff0d}.cursor-pointer:active{transform:scale(.98)}::ng-deep .p-datatable .p-datatable-thead>tr>th{font-weight:600;text-transform:uppercase;font-size:.75rem;letter-spacing:.05em}::ng-deep .p-datatable .editing-row{background-color:rgba(var(--primary-500),.05);border-left:3px solid var(--primary-500)}::ng-deep .p-datatable .w-\\[120px\\]{width:120px;min-width:120px;max-width:120px}::ng-deep .p-datatable .w-20{width:5rem;min-width:5rem;max-width:5rem}::ng-deep .p-datatable .\\!text-end{text-align:right!important;justify-content:flex-end}.totals-section{background-color:rgba(var(--surface-0),.5);border-top:2px solid var(--surface-border);padding:1rem}.totals-section .totals-row{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;gap:1rem}.totals-section .totals-row.total-final{border-top:2px solid var(--primary-500);padding-top:.75rem;margin-top:.5rem;font-size:1.125rem;font-weight:700;color:var(--primary-500)}.totals-section .totals-label{color:var(--text-color-secondary);font-weight:600}.totals-section .totals-value{font-weight:600;font-variant-numeric:tabular-nums}.add-product-link{display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;color:var(--primary-500);text-decoration:none;transition:color .2s ease}.add-product-link:hover{color:var(--primary-700)}.add-product-link.disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.add-product-link i{font-size:.75rem}.validation-message{padding:1rem;margin-bottom:1rem;border-radius:4px}.validation-message.error{background-color:rgba(var(--red-50),1);border:1px solid rgba(var(--red-200),1);color:var(--red-800)}:host-context(.dark-mode) .validation-message.error{background-color:rgba(var(--red-900),.2);color:var(--red-200)}.validation-message.error .icon{color:var(--red-600)}:host-context(.dark-mode) .validation-message.error .icon{color:var(--red-400)}.validation-message.warning{background-color:rgba(var(--orange-50),1);border:1px solid rgba(var(--orange-200),1);color:var(--orange-800)}:host-context(.dark-mode) .validation-message.warning{background-color:rgba(var(--orange-900),.2);color:var(--orange-200)}.validation-message.warning .icon{color:var(--orange-600)}:host-context(.dark-mode) .validation-message.warning .icon{color:var(--orange-400)}.validation-message.info{background-color:rgba(var(--blue-50),1);border:1px solid rgba(var(--blue-200),1);color:var(--blue-800)}:host-context(.dark-mode) .validation-message.info{background-color:rgba(var(--blue-900),.2);color:var(--blue-200)}.validation-message.info .icon{color:var(--blue-600)}:host-context(.dark-mode) .validation-message.info .icon{color:var(--blue-400)}::ng-deep .p-inputnumber-input.currency-input{text-align:right}::ng-deep .p-inputnumber.discount-input .p-inputnumber-input{text-align:right}@media(max-width:768px){::ng-deep .p-datatable{font-size:.875rem}::ng-deep .p-datatable .w-\\[120px\\]{width:100px;min-width:100px;max-width:100px}.totals-section{font-size:.875rem}.totals-section .totals-row.total-final{font-size:1rem}}@media(max-width:576px){::ng-deep .p-datatable .p-datatable-thead>tr>th{font-size:.7rem;padding:.5rem .25rem}::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:.5rem .25rem}}:focus-visible{outline:2px solid var(--primary-500);outline-offset:2px;border-radius:4px}@media(prefers-contrast:high){.cursor-pointer:hover{background-color:#0000001a}.validation-message{border-width:2px}}@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}@media print{.add-product-link,.p-button,.inline-edit-cell:hover,.cursor-pointer{display:none!important}.validation-message{display:none}::ng-deep .p-datatable .p-datatable-thead>tr>th,::ng-deep .p-datatable .p-datatable-tbody>tr>td{border:1px solid #000}}.loading-overlay{position:absolute;inset:0;background-color:#fffc;display:flex;align-items:center;justify-content:center;z-index:1000}:host-context(.dark-mode) .loading-overlay{background-color:#000c}.loading-overlay .spinner{width:3rem;height:3rem;border:3px solid var(--surface-border);border-top-color:var(--primary-500);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:3rem 1rem;color:var(--text-color-secondary)}.empty-state .empty-icon{font-size:3rem;margin-bottom:1rem;opacity:.3}.empty-state .empty-title{font-size:1.125rem;font-weight:600;margin-bottom:.5rem}.empty-state .empty-message{font-size:.875rem;margin-bottom:1.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i2$2.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "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", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "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: "ngmodule", type: FieldsetModule }, { kind: "component", type: i1$1.Fieldset, selector: "p-fieldset", inputs: ["legend", "toggleable", "style", "styleClass", "transitionOptions", "motionOptions", "collapsed"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i6.Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i2$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: EfOrderSummaryComponent, selector: "ef-order-summary", inputs: ["orderLines", "countGroupLabels", "legend"] }, { kind: "component", type: EfSelectComponent, selector: "ef-select", inputs: ["label", "labelKey", "inputId", "name", "options", "optionLabel", "optionValue", "placeholder", "placeholderKey", "size", "required", "fluid", "inline", "filter", "showClear", "disabled", "appendTo", "filterByKeys"], outputs: ["selectionChangeEvent"] }, { kind: "component", type: EfDatepickerComponent, selector: "ef-datepicker", inputs: ["label", "labelKey", "inputId", "name", "placeholder", "placeholderKey", "size", "required", "fluid", "inline", "disabled", "showIcon", "iconDisplay", "selectionMode", "dateFormat", "appendTo", "showTime", "showButtonBar", "minDate", "maxDate"], outputs: ["dateSelectEvent"] }, { kind: "component", type: EfInputNumberComponent, selector: "ef-inputnumber", inputs: ["label", "labelKey", "required", "value", "invalid", "disabled", "readonly", "format", "showButtons", "buttonLayout", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "prefix", "suffix", "currency", "currencyDisplay", "locale", "localeMatcher", "mode", "useGrouping", "minFractionDigits", "maxFractionDigits", "min", "max", "step", "allowEmpty", "inputId", "name", "placeholder", "placeholderKey", "inputSize", "size", "maxlength", "minlength", "pattern", "tabindex", "title", "ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "ariaRequired", "inputStyle", "inputStyleClass", "style", "styleClass", "showClear", "variant", "autofocus", "autocomplete", "fluid", "inline", "pt", "ptOptions", "dt", "unstyled"], outputs: ["inputEvent", "focusEvent", "blurEvent", "keyDownEvent", "clearEvent"] }, { kind: "component", type: EfLabelComponent, selector: "ef-label", inputs: ["label", "labelKey", "for", "styleClass", "required"] }, { kind: "component", type: EfButtonComponent, selector: "ef-button", inputs: ["label", "labelKey", "icon", "severity", "size", "disabled", "rounded", "outlined", "raised", "text", "loading", "styleClass", "type", "badge", "badgeSeverity", "tooltip", "tooltipKey", "tooltipPosition"], outputs: ["clickEvent"] }, { kind: "pipe", type: i8.DecimalPipe, name: "number" }, { kind: "pipe", type: i8.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i8.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
1767
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfOrderBuilderComponent, isStandalone: true, selector: "ef-order-builder", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, order: { classPropertyName: "order", publicName: "order", isSignal: true, isRequired: true, transformFunction: null }, products: { classPropertyName: "products", publicName: "products", isSignal: true, isRequired: true, transformFunction: null }, customers: { classPropertyName: "customers", publicName: "customers", isSignal: true, isRequired: true, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, countGroupLabels: { classPropertyName: "countGroupLabels", publicName: "countGroupLabels", isSignal: true, isRequired: false, transformFunction: null }, productKeyField: { classPropertyName: "productKeyField", publicName: "productKeyField", isSignal: true, isRequired: false, transformFunction: null }, backendErrors: { classPropertyName: "backendErrors", publicName: "backendErrors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { order: "orderChange", openCatalogue: "openCatalogue", orderChanged: "orderChanged", orderValidated: "orderValidated", productsAdded: "productsAdded" }, ngImport: i0, template: "<!-- Order Header -->\n<p-fieldset [legend]=\"config().headerLabel\">\n <div class=\"grid grid-cols-12 items-baseline gap-2 mb-2\">\n <ef-label [label]=\"config().customerLabel\" for=\"order.customerId\" styleClass=\"col-span-12 md:col-span-6 form-label-left\" required />\n <ef-label [label]=\"config().dateLabel\" for=\"order.orderDate\" styleClass=\"col-span-3 form-label-left\" required />\n </div>\n <div class=\"grid grid-cols-12 items-baseline gap-2 mb-2 mt-4\">\n <div class=\"col-span-12 md:col-span-6\">\n <ef-select\n [ngModel]=\"order().customerId\"\n (ngModelChange)=\"updateCustomer($event)\"\n name=\"order.customerId\"\n inputId=\"order.customerId\"\n [options]=\"customers()\"\n optionValue=\"customerId\"\n optionLabel=\"companyName\"\n [placeholder]=\"config().customerLabel\"\n filter\n showClear\n [disabled]=\"readonly()\"\n required\n />\n </div>\n <div class=\"col-span-3\">\n <ef-datepicker\n [ngModel]=\"order().orderDate\"\n (ngModelChange)=\"updateOrderDate($event)\"\n name=\"order.orderDate\"\n inputId=\"order.orderDate\"\n [disabled]=\"readonly()\"\n required\n />\n </div>\n </div>\n\n @if (config().enableQuickAdd && !readonly()) {\n <div class=\"grid grid-cols-12 items-baseline gap-2 mt-4 mb-2\">\n <ef-label labelKey=\"label.article\" for=\"quickAdd.product\" styleClass=\"col-span-12 md:col-span-6 form-label-left\" />\n <ef-label labelKey=\"label.sale_price\" for=\"quickAdd.price\" styleClass=\"col-span-2 form-label-left\" />\n <ef-label labelKey=\"label.quantity\" for=\"quickAdd.quantity\" styleClass=\"col-span-2 form-label-left\" />\n </div>\n <div class=\"grid grid-cols-12 items-center gap-2\">\n <div class=\"col-span-12 md:col-span-6\">\n <ef-select\n [ngModel]=\"quickAddProduct()\"\n (ngModelChange)=\"onQuickAddProductSelect($event)\"\n name=\"quickAdd.product\"\n inputId=\"quickAdd.product\"\n [options]=\"flattenedProductOptions()\"\n optionLabel=\"_displayLabel\"\n placeholderKey=\"placeholder.select_article\"\n filter\n showClear\n [disabled]=\"readonly()\"\n />\n </div>\n <div class=\"col-span-2\">\n <ef-inputnumber\n id=\"quickAdd.price\"\n name=\"quickAdd.price\"\n [ngModel]=\"quickAddPrice()\"\n (ngModelChange)=\"quickAddPrice.set($event)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n [min]=\"0\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </div>\n <div class=\"col-span-2\">\n <ef-inputnumber\n id=\"quickAdd.quantity\"\n name=\"quickAdd.quantity\"\n [ngModel]=\"quickAddQuantity()\"\n (ngModelChange)=\"quickAddQuantity.set($event)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </div>\n <div class=\"col-span-2 flex justify-start gap-2\">\n <ef-button\n icon=\"pi pi-plus\"\n [rounded]=\"true\"\n severity=\"primary\"\n tooltipKey=\"tooltip.add_article\"\n [disabled]=\"quickAddDisabled()\"\n (clickEvent)=\"addQuickProduct()\"\n />\n @if (config().showCatalogue) {\n <ef-button\n icon=\"pi pi-search\"\n [rounded]=\"true\"\n severity=\"primary\"\n tooltipKey=\"tooltip.open_catalogue\"\n [disabled]=\"readonly()\"\n (clickEvent)=\"handleOpenCatalogue()\"\n />\n }\n </div>\n </div>\n }\n</p-fieldset>\n\n<div class=\"my-4\"></div>\n\n<!-- Order Line Items -->\n<p-fieldset legend=\"D\u00E9tails\">\n <p-table\n #pTable\n class=\"text-sm\"\n size=\"small\"\n [value]=\"orderLines()\"\n [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\n [resizableColumns]=\"true\"\n [tableStyle]=\"{ 'min-width': '50rem' }\"\n columnResizeMode=\"expand\"\n [showCurrentPageReport]=\"true\"\n stateStorage=\"local\"\n dataKey=\"id\"\n [rowTrackBy]=\"rowTrackBy\"\n >\n <ng-template #header>\n <tr>\n <th>{{ 'label.article' | translate }}</th>\n <th class=\"w-[120px] !text-end\">{{ 'label.sale_price' | translate }}</th>\n <th class=\"w-[120px] !text-end\">{{ 'label.quantity' | translate }}</th>\n @if (config().enableTax) {\n <th class=\"w-[120px] !text-end\">TVA (%)</th>\n }\n @if (config().enableDiscount) {\n <th class=\"w-[120px] !text-end\">\n Remise (%)\n </th>\n }\n <th class=\"w-[120px] !text-end\">Sous-Total</th>\n @if (!readonly()) {\n <th class=\"w-10 !text-end\"></th>\n }\n </tr>\n </ng-template>\n\n <ng-template #body let-item let-rowIndex=\"rowIndex\">\n <!-- Editing mode for new row -->\n @if (item.isEditing) {\n <tr>\n <td>\n <div class=\"align-items-center flex gap-2\">\n <ef-select\n [(ngModel)]=\"item.product\"\n (ngModelChange)=\"onProductSelect(item)\"\n [name]=\"'item.product.' + rowIndex\"\n [inputId]=\"'item.product.' + rowIndex\"\n [options]=\"flattenedProductOptions()\"\n optionLabel=\"_displayLabel\"\n placeholderKey=\"placeholder.select_article\"\n filter\n showClear\n [disabled]=\"readonly()\"\n appendTo=\"body\"\n />\n </div>\n </td>\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.productUnitPrice.' + rowIndex\"\n [name]=\"'item.productUnitPrice.' + rowIndex\"\n [(ngModel)]=\"item.productUnitPrice\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.quantity.' + rowIndex\"\n [name]=\"'item.quantity.' + rowIndex\"\n [(ngModel)]=\"item.quantity\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"saveEditingRow(item)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n @if (config().enableTax) {\n <td class=\"w-[120px] !text-end\">\n {{ item.taxRate || 0 }} %\n </td>\n }\n @if (config().enableDiscount) {\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.discount.' + rowIndex\"\n [name]=\"'item.discount.' + rowIndex\"\n [(ngModel)]=\"item.discount\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"saveEditingRow(item)\"\n [min]=\"0\"\n [max]=\"100\"\n suffix=\"%\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n }\n <td class=\"w-[120px] !text-end\">\n {{ calculateSubtotal(item) | currency: currency() }}\n </td>\n @if (!readonly()) {\n <td class=\"w-10 !text-end\">\n <ef-button\n icon=\"pi pi-trash\"\n size=\"small\"\n [outlined]=\"true\"\n tooltip=\"Supprimer\"\n tooltipPosition=\"top\"\n (clickEvent)=\"removeOrderLine(item.id)\"\n />\n </td>\n }\n </tr>\n }\n\n <!-- Display mode for saved row -->\n @if (!item.isEditing) {\n <tr>\n <td>\n <div\n [innerHTML]=\"AppUtils.truncate(item.productDescription)\"\n [pTooltip]=\"item.productDescription\"\n tooltipPosition=\"top\"\n ></div>\n </td>\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'productUnitPrice')\"\n >\n @if (\n item.editingField === 'productUnitPrice' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.productUnitPrice.edit.' + rowIndex\"\n [name]=\"'item.productUnitPrice.edit.' + rowIndex\"\n [(ngModel)]=\"item.productUnitPrice\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.productUnitPrice | currency: currency() }}\n </span>\n }\n </td>\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'quantity')\"\n >\n @if (\n item.editingField === 'quantity' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.quantity.edit.' + rowIndex\"\n [name]=\"'item.quantity.edit.' + rowIndex\"\n [(ngModel)]=\"item.quantity\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.quantity | number: '1.4-4' : locale() }}\n </span>\n }\n </td>\n @if (config().enableTax) {\n <td class=\"w-[120px] !text-end\">\n {{ item.taxRate || 0 }} %\n </td>\n }\n @if (config().enableDiscount) {\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'discount')\"\n >\n @if (\n item.editingField === 'discount' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.discount.edit.' + rowIndex\"\n [name]=\"'item.discount.edit.' + rowIndex\"\n [(ngModel)]=\"item.discount\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n [min]=\"0\"\n [max]=\"100\"\n suffix=\"%\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.discount || 0 }}%\n </span>\n }\n </td>\n }\n <td class=\"w-[120px] !text-end\">\n {{ item.grossAmount | currency: currency() }}\n </td>\n @if (!readonly()) {\n <td class=\"w-10 !text-end\">\n <ef-button\n icon=\"pi pi-trash\"\n size=\"small\"\n [outlined]=\"true\"\n tooltip=\"Supprimer\"\n tooltipPosition=\"top\"\n (clickEvent)=\"removeOrderLine(item.id)\"\n />\n </td>\n }\n </tr>\n }\n </ng-template>\n\n <ng-template #footer>\n @if (!readonly()) {\n <tr>\n <td\n [attr.colspan]=\"\n config().enableTax && config().enableDiscount\n ? 7\n : config().enableTax || config().enableDiscount\n ? 6\n : 5\n \"\n >\n <a\n href=\"javascript:void(0)\"\n class=\"inline-flex items-center gap-2 text-sm font-medium text-primary-500 hover:text-primary-700\"\n [class.opacity-50]=\"hasEditingRow()\"\n [class.pointer-events-none]=\"hasEditingRow()\"\n (click)=\"addNewProductRow()\"\n >\n <i class=\"pi pi-plus text-xs\"></i>\n Ajouter un article\n </a>\n @if (config().showCatalogue) {\n <ng-container>\n | \n <a\n href=\"javascript:void(0)\"\n class=\"inline-flex items-center gap-2 text-sm font-medium text-primary-500 hover:text-primary-700\"\n (click)=\"handleOpenCatalogue()\"\n >\n <i class=\"pi pi-search text-xs\"></i>\n Ouvrir le catalogue des articles\n </a>\n </ng-container>\n }\n </td>\n </tr>\n }\n\n <!-- Totals Section -->\n <tr class=\"border-t\">\n <td\n [attr.colspan]=\"\n config().enableTax && config().enableDiscount\n ? 5\n : config().enableTax || config().enableDiscount\n ? 4\n : 3\n \"\n >\n @if (config().showProductsSummary) {\n <div class=\"w-[500px]\">\n <div class=\"my-4\"></div>\n <ef-order-summary\n [orderLines]=\"orderLines()\"\n [countGroupLabels]=\"countGroupLabels()\"\n legend=\"R\u00E9capitulatif\"\n />\n </div>\n }\n </td>\n <td [attr.colspan]=\"readonly() ? 2 : 3\" class=\"!text-end\">\n <p-fieldset [legend]=\"'Totaux'\">\n <div class=\"flex flex-col gap-2\">\n <div class=\"flex items-end justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n Montant brut :\n </span>\n <span class=\"font-semibold\">\n {{ grossTotal() | currency: currency() }}\n </span>\n </div>\n @if (config().enableDiscount) {\n <div class=\"flex justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n Remise :\n </span>\n <span class=\"font-semibold\">\n {{ discountTotal() | currency: currency() }}\n </span>\n </div>\n }\n @if (config().enableTax) {\n <div class=\"flex justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n TVA :\n </span>\n <span class=\"font-semibold\">\n {{ tvaTotal() | currency: currency() }}\n </span>\n </div>\n }\n <p-divider class=\"!my-1\" />\n <div class=\"flex justify-between gap-4\">\n <span class=\"text-lg font-bold text-primary\">\n Montant Total :\n </span>\n <span class=\"text-lg font-bold text-primary\">\n {{ finalTotal() | currency: currency() }}\n </span>\n </div>\n </div>\n </p-fieldset>\n </td>\n </tr>\n </ng-template>\n </p-table>\n</p-fieldset>\n\n<!-- Optional Notes Section -->\n@if (config().showNotes) {\n <p-fieldset legend=\"Notes\">\n <textarea\n pTextarea\n id=\"order.notes\"\n name=\"order.notes\"\n [ngModel]=\"order().notes\"\n (ngModelChange)=\"updateNotes($event)\"\n [disabled]=\"readonly()\"\n [placeholder]=\"'common.notes_placeholder' | translate\"\n rows=\"5\"\n class=\"w-full\"\n ></textarea>\n </p-fieldset>\n}\n\n<!-- Validation Messages -->\n@if (hasErrors()) {\n <div\n class=\"my-4 rounded border border-red-200 bg-red-50 p-4 dark:bg-red-900/20\"\n >\n <div class=\"flex items-start gap-2\">\n <i\n class=\"pi pi-exclamation-triangle mt-1 text-red-600 dark:text-red-400\"\n ></i>\n <div class=\"flex-1\">\n <h4 class=\"mb-2 font-semibold text-red-800 dark:text-red-200\">\n Erreurs de validation\n </h4>\n <ul class=\"list-inside list-disc text-sm text-red-700 dark:text-red-300\">\n @for (error of combinedErrors() | keyvalue; track error.key) {\n <li>\n {{ error.value[0] }}\n </li>\n }\n </ul>\n </div>\n </div>\n </div>\n}\n\n<!-- Change Indicator -->\n@if (hasChanges()) {\n <div\n class=\"my-4 flex items-center gap-2 rounded border border-orange-200 bg-orange-50 p-3 dark:bg-orange-900/20\"\n >\n <i class=\"pi pi-info-circle text-orange-600 dark:text-orange-400\"></i>\n <span class=\"text-sm text-orange-800 dark:text-orange-200\">\n Modifications non sauvegard\u00E9es d\u00E9tect\u00E9es\n </span>\n </div>\n}\n", styles: [".inline-edit-cell{position:relative}.inline-edit-cell .edit-indicator{position:absolute;top:2px;right:2px;font-size:.65rem;opacity:0;transition:opacity .2s ease}.inline-edit-cell:hover .edit-indicator{opacity:.5}.cursor-pointer{cursor:pointer;transition:background-color .2s ease}.cursor-pointer:hover{background-color:#0000000d}:host-context(.dark-mode) .cursor-pointer:hover{background-color:#ffffff0d}.cursor-pointer:active{transform:scale(.98)}::ng-deep .p-datatable .p-datatable-thead>tr>th{font-weight:600;text-transform:uppercase;font-size:.75rem;letter-spacing:.05em}::ng-deep .p-datatable .editing-row{background-color:rgba(var(--primary-500),.05);border-left:3px solid var(--primary-500)}::ng-deep .p-datatable .w-\\[120px\\]{width:120px;min-width:120px;max-width:120px}::ng-deep .p-datatable .w-20{width:5rem;min-width:5rem;max-width:5rem}::ng-deep .p-datatable .\\!text-end{text-align:right!important;justify-content:flex-end}.totals-section{background-color:rgba(var(--surface-0),.5);border-top:2px solid var(--surface-border);padding:1rem}.totals-section .totals-row{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;gap:1rem}.totals-section .totals-row.total-final{border-top:2px solid var(--primary-500);padding-top:.75rem;margin-top:.5rem;font-size:1.125rem;font-weight:700;color:var(--primary-500)}.totals-section .totals-label{color:var(--text-color-secondary);font-weight:600}.totals-section .totals-value{font-weight:600;font-variant-numeric:tabular-nums}.add-product-link{display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;color:var(--primary-500);text-decoration:none;transition:color .2s ease}.add-product-link:hover{color:var(--primary-700)}.add-product-link.disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.add-product-link i{font-size:.75rem}.validation-message{padding:1rem;margin-bottom:1rem;border-radius:4px}.validation-message.error{background-color:rgba(var(--red-50),1);border:1px solid rgba(var(--red-200),1);color:var(--red-800)}:host-context(.dark-mode) .validation-message.error{background-color:rgba(var(--red-900),.2);color:var(--red-200)}.validation-message.error .icon{color:var(--red-600)}:host-context(.dark-mode) .validation-message.error .icon{color:var(--red-400)}.validation-message.warning{background-color:rgba(var(--orange-50),1);border:1px solid rgba(var(--orange-200),1);color:var(--orange-800)}:host-context(.dark-mode) .validation-message.warning{background-color:rgba(var(--orange-900),.2);color:var(--orange-200)}.validation-message.warning .icon{color:var(--orange-600)}:host-context(.dark-mode) .validation-message.warning .icon{color:var(--orange-400)}.validation-message.info{background-color:rgba(var(--blue-50),1);border:1px solid rgba(var(--blue-200),1);color:var(--blue-800)}:host-context(.dark-mode) .validation-message.info{background-color:rgba(var(--blue-900),.2);color:var(--blue-200)}.validation-message.info .icon{color:var(--blue-600)}:host-context(.dark-mode) .validation-message.info .icon{color:var(--blue-400)}::ng-deep .p-inputnumber-input.currency-input{text-align:right}::ng-deep .p-inputnumber.discount-input .p-inputnumber-input{text-align:right}@media(max-width:768px){::ng-deep .p-datatable{font-size:.875rem}::ng-deep .p-datatable .w-\\[120px\\]{width:100px;min-width:100px;max-width:100px}.totals-section{font-size:.875rem}.totals-section .totals-row.total-final{font-size:1rem}}@media(max-width:576px){::ng-deep .p-datatable .p-datatable-thead>tr>th{font-size:.7rem;padding:.5rem .25rem}::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:.5rem .25rem}}:focus-visible{outline:2px solid var(--primary-500);outline-offset:2px;border-radius:4px}@media(prefers-contrast:high){.cursor-pointer:hover{background-color:#0000001a}.validation-message{border-width:2px}}@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}@media print{.add-product-link,.p-button,.inline-edit-cell:hover,.cursor-pointer{display:none!important}.validation-message{display:none}::ng-deep .p-datatable .p-datatable-thead>tr>th,::ng-deep .p-datatable .p-datatable-tbody>tr>td{border:1px solid #000}}.loading-overlay{position:absolute;inset:0;background-color:#fffc;display:flex;align-items:center;justify-content:center;z-index:1000}:host-context(.dark-mode) .loading-overlay{background-color:#000c}.loading-overlay .spinner{width:3rem;height:3rem;border:3px solid var(--surface-border);border-top-color:var(--primary-500);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:3rem 1rem;color:var(--text-color-secondary)}.empty-state .empty-icon{font-size:3rem;margin-bottom:1rem;opacity:.3}.empty-state .empty-title{font-size:1.125rem;font-weight:600;margin-bottom:.5rem}.empty-state .empty-message{font-size:.875rem;margin-bottom:1.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i2$2.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "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", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "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: "ngmodule", type: FieldsetModule }, { kind: "component", type: i1$1.Fieldset, selector: "p-fieldset", inputs: ["legend", "toggleable", "style", "styleClass", "transitionOptions", "motionOptions", "collapsed"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i5.Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i2$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: EfOrderSummaryComponent, selector: "ef-order-summary", inputs: ["orderLines", "countGroupLabels", "legend"] }, { kind: "component", type: EfSelectComponent, selector: "ef-select", inputs: ["label", "labelKey", "inputId", "name", "options", "optionLabel", "optionValue", "placeholder", "placeholderKey", "size", "required", "fluid", "inline", "filter", "showClear", "disabled", "appendTo", "filterByKeys"], outputs: ["selectionChangeEvent"] }, { kind: "component", type: EfDatepickerComponent, selector: "ef-datepicker", inputs: ["label", "labelKey", "inputId", "name", "placeholder", "placeholderKey", "size", "required", "fluid", "inline", "disabled", "showIcon", "iconDisplay", "selectionMode", "dateFormat", "appendTo", "showTime", "showButtonBar", "minDate", "maxDate"], outputs: ["dateSelectEvent"] }, { kind: "component", type: EfInputNumberComponent, selector: "ef-inputnumber", inputs: ["label", "labelKey", "required", "value", "invalid", "disabled", "readonly", "format", "showButtons", "buttonLayout", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "prefix", "suffix", "currency", "currencyDisplay", "locale", "localeMatcher", "mode", "useGrouping", "minFractionDigits", "maxFractionDigits", "min", "max", "step", "allowEmpty", "inputId", "name", "placeholder", "placeholderKey", "inputSize", "size", "maxlength", "minlength", "pattern", "tabindex", "title", "ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "ariaRequired", "inputStyle", "inputStyleClass", "style", "styleClass", "showClear", "variant", "autofocus", "autocomplete", "fluid", "inline", "pt", "ptOptions", "dt", "unstyled"], outputs: ["inputEvent", "focusEvent", "blurEvent", "keyDownEvent", "clearEvent"] }, { kind: "component", type: EfLabelComponent, selector: "ef-label", inputs: ["label", "labelKey", "for", "styleClass", "required"] }, { kind: "component", type: EfButtonComponent, selector: "ef-button", inputs: ["label", "labelKey", "icon", "severity", "size", "disabled", "rounded", "outlined", "raised", "text", "loading", "styleClass", "type", "badge", "badgeSeverity", "tooltip", "tooltipKey", "tooltipPosition"], outputs: ["clickEvent"] }, { kind: "pipe", type: i1$3.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i1$3.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
1768
1768
|
}
|
|
1769
1769
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfOrderBuilderComponent, decorators: [{
|
|
1770
1770
|
type: Component,
|
|
@@ -1773,7 +1773,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
|
|
|
1773
1773
|
FormsModule,
|
|
1774
1774
|
TranslateModule,
|
|
1775
1775
|
TextareaModule,
|
|
1776
|
-
ButtonModule,
|
|
1777
1776
|
TableModule,
|
|
1778
1777
|
FieldsetModule,
|
|
1779
1778
|
DividerModule,
|
|
@@ -1785,7 +1784,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
|
|
|
1785
1784
|
EfLabelComponent,
|
|
1786
1785
|
EfFieldsetComponent,
|
|
1787
1786
|
EfButtonComponent,
|
|
1788
|
-
], template: "<!-- Order Header -->\n<p-fieldset [legend]=\"config().headerLabel\">\n <div class=\"grid grid-cols-12 items-baseline gap-2 mb-2\">\n <ef-label [label]=\"config().customerLabel\" for=\"order.customerId\" styleClass=\"col-span-12 md:col-span-6 form-label-left\" required />\n <ef-label [label]=\"config().dateLabel\" for=\"order.orderDate\" styleClass=\"col-span-3 form-label-left\" required />\n </div>\n <div class=\"grid grid-cols-12 items-baseline gap-2 mb-2 mt-4\">\n <div class=\"col-span-12 md:col-span-6\">\n <ef-select\n [ngModel]=\"order().customerId\"\n (ngModelChange)=\"updateCustomer($event)\"\n name=\"order.customerId\"\n inputId=\"order.customerId\"\n [options]=\"customers()\"\n optionValue=\"customerId\"\n optionLabel=\"companyName\"\n [placeholder]=\"config().customerLabel\"\n filter\n showClear\n [disabled]=\"readonly()\"\n required\n />\n </div>\n <div class=\"col-span-3\">\n <ef-datepicker\n [ngModel]=\"order().orderDate\"\n (ngModelChange)=\"updateOrderDate($event)\"\n name=\"order.orderDate\"\n inputId=\"order.orderDate\"\n [disabled]=\"readonly()\"\n required\n />\n </div>\n </div>\n\n @if (config().enableQuickAdd && !readonly()) {\n <div class=\"grid grid-cols-12 items-baseline gap-2 mt-4 mb-2\">\n <ef-label labelKey=\"label.article\" for=\"quickAdd.product\" styleClass=\"col-span-12 md:col-span-6 form-label-left\" />\n <ef-label labelKey=\"label.sale_price\" for=\"quickAdd.price\" styleClass=\"col-span-2 form-label-left\" />\n <ef-label labelKey=\"label.quantity\" for=\"quickAdd.quantity\" styleClass=\"col-span-2 form-label-left\" />\n </div>\n <div class=\"grid grid-cols-12 items-center gap-2\">\n <div class=\"col-span-12 md:col-span-6\">\n <ef-select\n [ngModel]=\"quickAddProduct()\"\n (ngModelChange)=\"onQuickAddProductSelect($event)\"\n name=\"quickAdd.product\"\n inputId=\"quickAdd.product\"\n [options]=\"flattenedProductOptions()\"\n optionLabel=\"_displayLabel\"\n placeholderKey=\"placeholder.select_article\"\n filter\n showClear\n [disabled]=\"readonly()\"\n />\n </div>\n <div class=\"col-span-2\">\n <ef-inputnumber\n id=\"quickAdd.price\"\n name=\"quickAdd.price\"\n [ngModel]=\"quickAddPrice()\"\n (ngModelChange)=\"quickAddPrice.set($event)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n [min]=\"0\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </div>\n <div class=\"col-span-2\">\n <ef-inputnumber\n id=\"quickAdd.quantity\"\n name=\"quickAdd.quantity\"\n [ngModel]=\"quickAddQuantity()\"\n (ngModelChange)=\"quickAddQuantity.set($event)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </div>\n <div class=\"col-span-2 flex justify-start gap-2\">\n <ef-button\n icon=\"pi pi-plus\"\n [rounded]=\"true\"\n severity=\"primary\"\n tooltipKey=\"tooltip.add_article\"\n [disabled]=\"quickAddDisabled()\"\n (clickEvent)=\"addQuickProduct()\"\n />\n @if (config().showCatalogue) {\n <ef-button\n icon=\"pi pi-search\"\n [rounded]=\"true\"\n severity=\"primary\"\n tooltipKey=\"tooltip.open_catalogue\"\n [disabled]=\"readonly()\"\n (clickEvent)=\"handleOpenCatalogue()\"\n />\n }\n </div>\n </div>\n }\n</p-fieldset>\n\n<div class=\"my-4\"></div>\n\n<!-- Order Line Items -->\n<p-fieldset legend=\"D\u00E9tails\">\n <p-table\n #pTable\n class=\"text-sm\"\n size=\"small\"\n [value]=\"orderLines()\"\n [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\n [resizableColumns]=\"true\"\n [tableStyle]=\"{ 'min-width': '50rem' }\"\n columnResizeMode=\"expand\"\n [showCurrentPageReport]=\"true\"\n stateStorage=\"local\"\n dataKey=\"id\"\n [rowTrackBy]=\"rowTrackBy\"\n >\n <ng-template #header>\n <tr>\n <th>{{ 'label.article' | translate }}</th>\n <th class=\"w-[120px] !text-end\">{{ 'label.sale_price' | translate }}</th>\n <th class=\"w-[120px] !text-end\">{{ 'label.quantity' | translate }}</th>\n @if (config().enableTax) {\n <th class=\"w-[120px] !text-end\">TVA (%)</th>\n }\n @if (config().enableDiscount) {\n <th class=\"w-[120px] !text-end\">\n Remise (%)\n </th>\n }\n <th class=\"w-[120px] !text-end\">Sous-Total</th>\n @if (!readonly()) {\n <th class=\"w-10 !text-end\"></th>\n }\n </tr>\n </ng-template>\n\n <ng-template #body let-item let-rowIndex=\"rowIndex\">\n <!-- Editing mode for new row -->\n @if (item.isEditing) {\n <tr>\n <td>\n <div class=\"align-items-center flex gap-2\">\n <ef-select\n [(ngModel)]=\"item.product\"\n (ngModelChange)=\"onProductSelect(item)\"\n [name]=\"'item.product.' + rowIndex\"\n [inputId]=\"'item.product.' + rowIndex\"\n [options]=\"flattenedProductOptions()\"\n optionLabel=\"_displayLabel\"\n placeholderKey=\"placeholder.select_article\"\n filter\n showClear\n [disabled]=\"readonly()\"\n appendTo=\"body\"\n />\n </div>\n </td>\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.productUnitPrice.' + rowIndex\"\n [name]=\"'item.productUnitPrice.' + rowIndex\"\n [(ngModel)]=\"item.productUnitPrice\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.quantity.' + rowIndex\"\n [name]=\"'item.quantity.' + rowIndex\"\n [(ngModel)]=\"item.quantity\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"saveEditingRow(item)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n @if (config().enableTax) {\n <td class=\"w-[120px] !text-end\">\n {{ item.taxRate || 0 }} %\n </td>\n }\n @if (config().enableDiscount) {\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.discount.' + rowIndex\"\n [name]=\"'item.discount.' + rowIndex\"\n [(ngModel)]=\"item.discount\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"saveEditingRow(item)\"\n [min]=\"0\"\n [max]=\"100\"\n suffix=\"%\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n }\n <td class=\"w-[120px] !text-end\">\n {{ calculateSubtotal(item) | currency: currency() }}\n </td>\n @if (!readonly()) {\n <td class=\"w-10 !text-end\">\n <p-button\n icon=\"pi pi-trash\"\n size=\"small\"\n [outlined]=\"true\"\n pTooltip=\"Supprimer\"\n tooltipPosition=\"top\"\n (click)=\"removeOrderLine(item.id)\"\n />\n </td>\n }\n </tr>\n }\n\n <!-- Display mode for saved row -->\n @if (!item.isEditing) {\n <tr>\n <td>\n <div\n [innerHTML]=\"AppUtils.truncate(item.productDescription)\"\n [pTooltip]=\"item.productDescription\"\n tooltipPosition=\"top\"\n ></div>\n </td>\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'productUnitPrice')\"\n >\n @if (\n item.editingField === 'productUnitPrice' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.productUnitPrice.edit.' + rowIndex\"\n [name]=\"'item.productUnitPrice.edit.' + rowIndex\"\n [(ngModel)]=\"item.productUnitPrice\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.productUnitPrice | currency: currency() }}\n </span>\n }\n </td>\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'quantity')\"\n >\n @if (\n item.editingField === 'quantity' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.quantity.edit.' + rowIndex\"\n [name]=\"'item.quantity.edit.' + rowIndex\"\n [(ngModel)]=\"item.quantity\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.quantity | number: '1.4-4' : locale() }}\n </span>\n }\n </td>\n @if (config().enableTax) {\n <td class=\"w-[120px] !text-end\">\n {{ item.taxRate || 0 }} %\n </td>\n }\n @if (config().enableDiscount) {\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'discount')\"\n >\n @if (\n item.editingField === 'discount' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.discount.edit.' + rowIndex\"\n [name]=\"'item.discount.edit.' + rowIndex\"\n [(ngModel)]=\"item.discount\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n [min]=\"0\"\n [max]=\"100\"\n suffix=\"%\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.discount || 0 }}%\n </span>\n }\n </td>\n }\n <td class=\"w-[120px] !text-end\">\n {{ item.grossAmount | currency: currency() }}\n </td>\n @if (!readonly()) {\n <td class=\"w-10 !text-end\">\n <p-button\n icon=\"pi pi-trash\"\n size=\"small\"\n [outlined]=\"true\"\n tooltipPosition=\"top\"\n pTooltip=\"Supprimer\"\n (click)=\"removeOrderLine(item.id)\"\n />\n </td>\n }\n </tr>\n }\n </ng-template>\n\n <ng-template #footer>\n @if (!readonly()) {\n <tr>\n <td\n [attr.colspan]=\"\n config().enableTax && config().enableDiscount\n ? 7\n : config().enableTax || config().enableDiscount\n ? 6\n : 5\n \"\n >\n <a\n href=\"javascript:void(0)\"\n class=\"inline-flex items-center gap-2 text-sm font-medium text-primary-500 hover:text-primary-700\"\n [class.opacity-50]=\"hasEditingRow()\"\n [class.pointer-events-none]=\"hasEditingRow()\"\n (click)=\"addNewProductRow()\"\n >\n <i class=\"pi pi-plus text-xs\"></i>\n Ajouter un article\n </a>\n @if (config().showCatalogue) {\n <ng-container>\n | \n <a\n href=\"javascript:void(0)\"\n class=\"inline-flex items-center gap-2 text-sm font-medium text-primary-500 hover:text-primary-700\"\n (click)=\"handleOpenCatalogue()\"\n >\n <i class=\"pi pi-search text-xs\"></i>\n Ouvrir le catalogue des articles\n </a>\n </ng-container>\n }\n </td>\n </tr>\n }\n\n <!-- Totals Section -->\n <tr class=\"border-t\">\n <td\n [attr.colspan]=\"\n config().enableTax && config().enableDiscount\n ? 5\n : config().enableTax || config().enableDiscount\n ? 4\n : 3\n \"\n >\n @if (config().showProductsSummary) {\n <div class=\"w-[500px]\">\n <div class=\"my-4\"></div>\n <ef-order-summary\n [orderLines]=\"orderLines()\"\n [countGroupLabels]=\"countGroupLabels()\"\n legend=\"R\u00E9capitulatif\"\n />\n </div>\n }\n </td>\n <td [attr.colspan]=\"readonly() ? 2 : 3\" class=\"!text-end\">\n <p-fieldset [legend]=\"'Totaux'\">\n <div class=\"flex flex-col gap-2\">\n <div class=\"flex items-end justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n Montant brut :\n </span>\n <span class=\"font-semibold\">\n {{ grossTotal() | currency: currency() }}\n </span>\n </div>\n @if (config().enableDiscount) {\n <div class=\"flex justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n Remise :\n </span>\n <span class=\"font-semibold\">\n {{ discountTotal() | currency: currency() }}\n </span>\n </div>\n }\n @if (config().enableTax) {\n <div class=\"flex justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n TVA :\n </span>\n <span class=\"font-semibold\">\n {{ tvaTotal() | currency: currency() }}\n </span>\n </div>\n }\n <p-divider class=\"!my-1\" />\n <div class=\"flex justify-between gap-4\">\n <span class=\"text-lg font-bold text-primary\">\n Montant Total :\n </span>\n <span class=\"text-lg font-bold text-primary\">\n {{ finalTotal() | currency: currency() }}\n </span>\n </div>\n </div>\n </p-fieldset>\n </td>\n </tr>\n </ng-template>\n </p-table>\n</p-fieldset>\n\n<!-- Optional Notes Section -->\n@if (config().showNotes) {\n <p-fieldset legend=\"Notes\">\n <textarea\n pTextarea\n id=\"order.notes\"\n name=\"order.notes\"\n [ngModel]=\"order().notes\"\n (ngModelChange)=\"updateNotes($event)\"\n [disabled]=\"readonly()\"\n [placeholder]=\"'common.notes_placeholder' | translate\"\n rows=\"5\"\n class=\"w-full\"\n ></textarea>\n </p-fieldset>\n}\n\n<!-- Validation Messages -->\n@if (hasErrors()) {\n <div\n class=\"my-4 rounded border border-red-200 bg-red-50 p-4 dark:bg-red-900/20\"\n >\n <div class=\"flex items-start gap-2\">\n <i\n class=\"pi pi-exclamation-triangle mt-1 text-red-600 dark:text-red-400\"\n ></i>\n <div class=\"flex-1\">\n <h4 class=\"mb-2 font-semibold text-red-800 dark:text-red-200\">\n Erreurs de validation\n </h4>\n <ul class=\"list-inside list-disc text-sm text-red-700 dark:text-red-300\">\n @for (error of combinedErrors() | keyvalue; track error.key) {\n <li>\n {{ error.value[0] }}\n </li>\n }\n </ul>\n </div>\n </div>\n </div>\n}\n\n<!-- Change Indicator -->\n@if (hasChanges()) {\n <div\n class=\"my-4 flex items-center gap-2 rounded border border-orange-200 bg-orange-50 p-3 dark:bg-orange-900/20\"\n >\n <i class=\"pi pi-info-circle text-orange-600 dark:text-orange-400\"></i>\n <span class=\"text-sm text-orange-800 dark:text-orange-200\">\n Modifications non sauvegard\u00E9es d\u00E9tect\u00E9es\n </span>\n </div>\n}\n", styles: [".inline-edit-cell{position:relative}.inline-edit-cell .edit-indicator{position:absolute;top:2px;right:2px;font-size:.65rem;opacity:0;transition:opacity .2s ease}.inline-edit-cell:hover .edit-indicator{opacity:.5}.cursor-pointer{cursor:pointer;transition:background-color .2s ease}.cursor-pointer:hover{background-color:#0000000d}:host-context(.dark-mode) .cursor-pointer:hover{background-color:#ffffff0d}.cursor-pointer:active{transform:scale(.98)}::ng-deep .p-datatable .p-datatable-thead>tr>th{font-weight:600;text-transform:uppercase;font-size:.75rem;letter-spacing:.05em}::ng-deep .p-datatable .editing-row{background-color:rgba(var(--primary-500),.05);border-left:3px solid var(--primary-500)}::ng-deep .p-datatable .w-\\[120px\\]{width:120px;min-width:120px;max-width:120px}::ng-deep .p-datatable .w-20{width:5rem;min-width:5rem;max-width:5rem}::ng-deep .p-datatable .\\!text-end{text-align:right!important;justify-content:flex-end}.totals-section{background-color:rgba(var(--surface-0),.5);border-top:2px solid var(--surface-border);padding:1rem}.totals-section .totals-row{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;gap:1rem}.totals-section .totals-row.total-final{border-top:2px solid var(--primary-500);padding-top:.75rem;margin-top:.5rem;font-size:1.125rem;font-weight:700;color:var(--primary-500)}.totals-section .totals-label{color:var(--text-color-secondary);font-weight:600}.totals-section .totals-value{font-weight:600;font-variant-numeric:tabular-nums}.add-product-link{display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;color:var(--primary-500);text-decoration:none;transition:color .2s ease}.add-product-link:hover{color:var(--primary-700)}.add-product-link.disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.add-product-link i{font-size:.75rem}.validation-message{padding:1rem;margin-bottom:1rem;border-radius:4px}.validation-message.error{background-color:rgba(var(--red-50),1);border:1px solid rgba(var(--red-200),1);color:var(--red-800)}:host-context(.dark-mode) .validation-message.error{background-color:rgba(var(--red-900),.2);color:var(--red-200)}.validation-message.error .icon{color:var(--red-600)}:host-context(.dark-mode) .validation-message.error .icon{color:var(--red-400)}.validation-message.warning{background-color:rgba(var(--orange-50),1);border:1px solid rgba(var(--orange-200),1);color:var(--orange-800)}:host-context(.dark-mode) .validation-message.warning{background-color:rgba(var(--orange-900),.2);color:var(--orange-200)}.validation-message.warning .icon{color:var(--orange-600)}:host-context(.dark-mode) .validation-message.warning .icon{color:var(--orange-400)}.validation-message.info{background-color:rgba(var(--blue-50),1);border:1px solid rgba(var(--blue-200),1);color:var(--blue-800)}:host-context(.dark-mode) .validation-message.info{background-color:rgba(var(--blue-900),.2);color:var(--blue-200)}.validation-message.info .icon{color:var(--blue-600)}:host-context(.dark-mode) .validation-message.info .icon{color:var(--blue-400)}::ng-deep .p-inputnumber-input.currency-input{text-align:right}::ng-deep .p-inputnumber.discount-input .p-inputnumber-input{text-align:right}@media(max-width:768px){::ng-deep .p-datatable{font-size:.875rem}::ng-deep .p-datatable .w-\\[120px\\]{width:100px;min-width:100px;max-width:100px}.totals-section{font-size:.875rem}.totals-section .totals-row.total-final{font-size:1rem}}@media(max-width:576px){::ng-deep .p-datatable .p-datatable-thead>tr>th{font-size:.7rem;padding:.5rem .25rem}::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:.5rem .25rem}}:focus-visible{outline:2px solid var(--primary-500);outline-offset:2px;border-radius:4px}@media(prefers-contrast:high){.cursor-pointer:hover{background-color:#0000001a}.validation-message{border-width:2px}}@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}@media print{.add-product-link,.p-button,.inline-edit-cell:hover,.cursor-pointer{display:none!important}.validation-message{display:none}::ng-deep .p-datatable .p-datatable-thead>tr>th,::ng-deep .p-datatable .p-datatable-tbody>tr>td{border:1px solid #000}}.loading-overlay{position:absolute;inset:0;background-color:#fffc;display:flex;align-items:center;justify-content:center;z-index:1000}:host-context(.dark-mode) .loading-overlay{background-color:#000c}.loading-overlay .spinner{width:3rem;height:3rem;border:3px solid var(--surface-border);border-top-color:var(--primary-500);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:3rem 1rem;color:var(--text-color-secondary)}.empty-state .empty-icon{font-size:3rem;margin-bottom:1rem;opacity:.3}.empty-state .empty-title{font-size:1.125rem;font-weight:600;margin-bottom:.5rem}.empty-state .empty-message{font-size:.875rem;margin-bottom:1.5rem}\n"] }]
|
|
1787
|
+
], template: "<!-- Order Header -->\n<p-fieldset [legend]=\"config().headerLabel\">\n <div class=\"grid grid-cols-12 items-baseline gap-2 mb-2\">\n <ef-label [label]=\"config().customerLabel\" for=\"order.customerId\" styleClass=\"col-span-12 md:col-span-6 form-label-left\" required />\n <ef-label [label]=\"config().dateLabel\" for=\"order.orderDate\" styleClass=\"col-span-3 form-label-left\" required />\n </div>\n <div class=\"grid grid-cols-12 items-baseline gap-2 mb-2 mt-4\">\n <div class=\"col-span-12 md:col-span-6\">\n <ef-select\n [ngModel]=\"order().customerId\"\n (ngModelChange)=\"updateCustomer($event)\"\n name=\"order.customerId\"\n inputId=\"order.customerId\"\n [options]=\"customers()\"\n optionValue=\"customerId\"\n optionLabel=\"companyName\"\n [placeholder]=\"config().customerLabel\"\n filter\n showClear\n [disabled]=\"readonly()\"\n required\n />\n </div>\n <div class=\"col-span-3\">\n <ef-datepicker\n [ngModel]=\"order().orderDate\"\n (ngModelChange)=\"updateOrderDate($event)\"\n name=\"order.orderDate\"\n inputId=\"order.orderDate\"\n [disabled]=\"readonly()\"\n required\n />\n </div>\n </div>\n\n @if (config().enableQuickAdd && !readonly()) {\n <div class=\"grid grid-cols-12 items-baseline gap-2 mt-4 mb-2\">\n <ef-label labelKey=\"label.article\" for=\"quickAdd.product\" styleClass=\"col-span-12 md:col-span-6 form-label-left\" />\n <ef-label labelKey=\"label.sale_price\" for=\"quickAdd.price\" styleClass=\"col-span-2 form-label-left\" />\n <ef-label labelKey=\"label.quantity\" for=\"quickAdd.quantity\" styleClass=\"col-span-2 form-label-left\" />\n </div>\n <div class=\"grid grid-cols-12 items-center gap-2\">\n <div class=\"col-span-12 md:col-span-6\">\n <ef-select\n [ngModel]=\"quickAddProduct()\"\n (ngModelChange)=\"onQuickAddProductSelect($event)\"\n name=\"quickAdd.product\"\n inputId=\"quickAdd.product\"\n [options]=\"flattenedProductOptions()\"\n optionLabel=\"_displayLabel\"\n placeholderKey=\"placeholder.select_article\"\n filter\n showClear\n [disabled]=\"readonly()\"\n />\n </div>\n <div class=\"col-span-2\">\n <ef-inputnumber\n id=\"quickAdd.price\"\n name=\"quickAdd.price\"\n [ngModel]=\"quickAddPrice()\"\n (ngModelChange)=\"quickAddPrice.set($event)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n [min]=\"0\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </div>\n <div class=\"col-span-2\">\n <ef-inputnumber\n id=\"quickAdd.quantity\"\n name=\"quickAdd.quantity\"\n [ngModel]=\"quickAddQuantity()\"\n (ngModelChange)=\"quickAddQuantity.set($event)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </div>\n <div class=\"col-span-2 flex justify-start gap-2\">\n <ef-button\n icon=\"pi pi-plus\"\n [rounded]=\"true\"\n severity=\"primary\"\n tooltipKey=\"tooltip.add_article\"\n [disabled]=\"quickAddDisabled()\"\n (clickEvent)=\"addQuickProduct()\"\n />\n @if (config().showCatalogue) {\n <ef-button\n icon=\"pi pi-search\"\n [rounded]=\"true\"\n severity=\"primary\"\n tooltipKey=\"tooltip.open_catalogue\"\n [disabled]=\"readonly()\"\n (clickEvent)=\"handleOpenCatalogue()\"\n />\n }\n </div>\n </div>\n }\n</p-fieldset>\n\n<div class=\"my-4\"></div>\n\n<!-- Order Line Items -->\n<p-fieldset legend=\"D\u00E9tails\">\n <p-table\n #pTable\n class=\"text-sm\"\n size=\"small\"\n [value]=\"orderLines()\"\n [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\n [resizableColumns]=\"true\"\n [tableStyle]=\"{ 'min-width': '50rem' }\"\n columnResizeMode=\"expand\"\n [showCurrentPageReport]=\"true\"\n stateStorage=\"local\"\n dataKey=\"id\"\n [rowTrackBy]=\"rowTrackBy\"\n >\n <ng-template #header>\n <tr>\n <th>{{ 'label.article' | translate }}</th>\n <th class=\"w-[120px] !text-end\">{{ 'label.sale_price' | translate }}</th>\n <th class=\"w-[120px] !text-end\">{{ 'label.quantity' | translate }}</th>\n @if (config().enableTax) {\n <th class=\"w-[120px] !text-end\">TVA (%)</th>\n }\n @if (config().enableDiscount) {\n <th class=\"w-[120px] !text-end\">\n Remise (%)\n </th>\n }\n <th class=\"w-[120px] !text-end\">Sous-Total</th>\n @if (!readonly()) {\n <th class=\"w-10 !text-end\"></th>\n }\n </tr>\n </ng-template>\n\n <ng-template #body let-item let-rowIndex=\"rowIndex\">\n <!-- Editing mode for new row -->\n @if (item.isEditing) {\n <tr>\n <td>\n <div class=\"align-items-center flex gap-2\">\n <ef-select\n [(ngModel)]=\"item.product\"\n (ngModelChange)=\"onProductSelect(item)\"\n [name]=\"'item.product.' + rowIndex\"\n [inputId]=\"'item.product.' + rowIndex\"\n [options]=\"flattenedProductOptions()\"\n optionLabel=\"_displayLabel\"\n placeholderKey=\"placeholder.select_article\"\n filter\n showClear\n [disabled]=\"readonly()\"\n appendTo=\"body\"\n />\n </div>\n </td>\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.productUnitPrice.' + rowIndex\"\n [name]=\"'item.productUnitPrice.' + rowIndex\"\n [(ngModel)]=\"item.productUnitPrice\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.quantity.' + rowIndex\"\n [name]=\"'item.quantity.' + rowIndex\"\n [(ngModel)]=\"item.quantity\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"saveEditingRow(item)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n @if (config().enableTax) {\n <td class=\"w-[120px] !text-end\">\n {{ item.taxRate || 0 }} %\n </td>\n }\n @if (config().enableDiscount) {\n <td class=\"w-[120px]\">\n <ef-inputnumber\n [id]=\"'item.discount.' + rowIndex\"\n [name]=\"'item.discount.' + rowIndex\"\n [(ngModel)]=\"item.discount\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"saveEditingRow(item)\"\n [min]=\"0\"\n [max]=\"100\"\n suffix=\"%\"\n [disabled]=\"readonly()\"\n size=\"small\"\n />\n </td>\n }\n <td class=\"w-[120px] !text-end\">\n {{ calculateSubtotal(item) | currency: currency() }}\n </td>\n @if (!readonly()) {\n <td class=\"w-10 !text-end\">\n <ef-button\n icon=\"pi pi-trash\"\n size=\"small\"\n [outlined]=\"true\"\n tooltip=\"Supprimer\"\n tooltipPosition=\"top\"\n (clickEvent)=\"removeOrderLine(item.id)\"\n />\n </td>\n }\n </tr>\n }\n\n <!-- Display mode for saved row -->\n @if (!item.isEditing) {\n <tr>\n <td>\n <div\n [innerHTML]=\"AppUtils.truncate(item.productDescription)\"\n [pTooltip]=\"item.productDescription\"\n tooltipPosition=\"top\"\n ></div>\n </td>\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'productUnitPrice')\"\n >\n @if (\n item.editingField === 'productUnitPrice' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.productUnitPrice.edit.' + rowIndex\"\n [name]=\"'item.productUnitPrice.edit.' + rowIndex\"\n [(ngModel)]=\"item.productUnitPrice\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n mode=\"currency\"\n [currency]=\"currency()\"\n [locale]=\"locale()\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.productUnitPrice | currency: currency() }}\n </span>\n }\n </td>\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'quantity')\"\n >\n @if (\n item.editingField === 'quantity' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.quantity.edit.' + rowIndex\"\n [name]=\"'item.quantity.edit.' + rowIndex\"\n [(ngModel)]=\"item.quantity\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n [min]=\"0\"\n [maxFractionDigits]=\"4\"\n [locale]=\"locale()\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.quantity | number: '1.4-4' : locale() }}\n </span>\n }\n </td>\n @if (config().enableTax) {\n <td class=\"w-[120px] !text-end\">\n {{ item.taxRate || 0 }} %\n </td>\n }\n @if (config().enableDiscount) {\n <td\n class=\"w-[120px]\"\n [class.cursor-pointer]=\"config().allowInlineEdit && !readonly()\"\n (click)=\"startEditField(item, 'discount')\"\n >\n @if (\n item.editingField === 'discount' &&\n config().allowInlineEdit &&\n !readonly()\n ) {\n <ef-inputnumber\n [id]=\"'item.discount.edit.' + rowIndex\"\n [name]=\"'item.discount.edit.' + rowIndex\"\n [(ngModel)]=\"item.discount\"\n (ngModelChange)=\"onFieldChange(item)\"\n (onBlur)=\"stopEditField(item)\"\n [min]=\"0\"\n [max]=\"100\"\n suffix=\"%\"\n size=\"small\"\n class=\"!text-end\"\n />\n } @else {\n <span\n [class]=\"\n config().allowInlineEdit && !readonly()\n ? 'block cursor-pointer rounded px-2 py-1 text-end hover:bg-surface-100 dark:hover:bg-surface-700'\n : 'block px-2 py-1 text-end'\n \"\n >\n {{ item.discount || 0 }}%\n </span>\n }\n </td>\n }\n <td class=\"w-[120px] !text-end\">\n {{ item.grossAmount | currency: currency() }}\n </td>\n @if (!readonly()) {\n <td class=\"w-10 !text-end\">\n <ef-button\n icon=\"pi pi-trash\"\n size=\"small\"\n [outlined]=\"true\"\n tooltip=\"Supprimer\"\n tooltipPosition=\"top\"\n (clickEvent)=\"removeOrderLine(item.id)\"\n />\n </td>\n }\n </tr>\n }\n </ng-template>\n\n <ng-template #footer>\n @if (!readonly()) {\n <tr>\n <td\n [attr.colspan]=\"\n config().enableTax && config().enableDiscount\n ? 7\n : config().enableTax || config().enableDiscount\n ? 6\n : 5\n \"\n >\n <a\n href=\"javascript:void(0)\"\n class=\"inline-flex items-center gap-2 text-sm font-medium text-primary-500 hover:text-primary-700\"\n [class.opacity-50]=\"hasEditingRow()\"\n [class.pointer-events-none]=\"hasEditingRow()\"\n (click)=\"addNewProductRow()\"\n >\n <i class=\"pi pi-plus text-xs\"></i>\n Ajouter un article\n </a>\n @if (config().showCatalogue) {\n <ng-container>\n | \n <a\n href=\"javascript:void(0)\"\n class=\"inline-flex items-center gap-2 text-sm font-medium text-primary-500 hover:text-primary-700\"\n (click)=\"handleOpenCatalogue()\"\n >\n <i class=\"pi pi-search text-xs\"></i>\n Ouvrir le catalogue des articles\n </a>\n </ng-container>\n }\n </td>\n </tr>\n }\n\n <!-- Totals Section -->\n <tr class=\"border-t\">\n <td\n [attr.colspan]=\"\n config().enableTax && config().enableDiscount\n ? 5\n : config().enableTax || config().enableDiscount\n ? 4\n : 3\n \"\n >\n @if (config().showProductsSummary) {\n <div class=\"w-[500px]\">\n <div class=\"my-4\"></div>\n <ef-order-summary\n [orderLines]=\"orderLines()\"\n [countGroupLabels]=\"countGroupLabels()\"\n legend=\"R\u00E9capitulatif\"\n />\n </div>\n }\n </td>\n <td [attr.colspan]=\"readonly() ? 2 : 3\" class=\"!text-end\">\n <p-fieldset [legend]=\"'Totaux'\">\n <div class=\"flex flex-col gap-2\">\n <div class=\"flex items-end justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n Montant brut :\n </span>\n <span class=\"font-semibold\">\n {{ grossTotal() | currency: currency() }}\n </span>\n </div>\n @if (config().enableDiscount) {\n <div class=\"flex justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n Remise :\n </span>\n <span class=\"font-semibold\">\n {{ discountTotal() | currency: currency() }}\n </span>\n </div>\n }\n @if (config().enableTax) {\n <div class=\"flex justify-between gap-4\">\n <span\n class=\"font-semibold text-surface-700 dark:text-surface-300\"\n >\n TVA :\n </span>\n <span class=\"font-semibold\">\n {{ tvaTotal() | currency: currency() }}\n </span>\n </div>\n }\n <p-divider class=\"!my-1\" />\n <div class=\"flex justify-between gap-4\">\n <span class=\"text-lg font-bold text-primary\">\n Montant Total :\n </span>\n <span class=\"text-lg font-bold text-primary\">\n {{ finalTotal() | currency: currency() }}\n </span>\n </div>\n </div>\n </p-fieldset>\n </td>\n </tr>\n </ng-template>\n </p-table>\n</p-fieldset>\n\n<!-- Optional Notes Section -->\n@if (config().showNotes) {\n <p-fieldset legend=\"Notes\">\n <textarea\n pTextarea\n id=\"order.notes\"\n name=\"order.notes\"\n [ngModel]=\"order().notes\"\n (ngModelChange)=\"updateNotes($event)\"\n [disabled]=\"readonly()\"\n [placeholder]=\"'common.notes_placeholder' | translate\"\n rows=\"5\"\n class=\"w-full\"\n ></textarea>\n </p-fieldset>\n}\n\n<!-- Validation Messages -->\n@if (hasErrors()) {\n <div\n class=\"my-4 rounded border border-red-200 bg-red-50 p-4 dark:bg-red-900/20\"\n >\n <div class=\"flex items-start gap-2\">\n <i\n class=\"pi pi-exclamation-triangle mt-1 text-red-600 dark:text-red-400\"\n ></i>\n <div class=\"flex-1\">\n <h4 class=\"mb-2 font-semibold text-red-800 dark:text-red-200\">\n Erreurs de validation\n </h4>\n <ul class=\"list-inside list-disc text-sm text-red-700 dark:text-red-300\">\n @for (error of combinedErrors() | keyvalue; track error.key) {\n <li>\n {{ error.value[0] }}\n </li>\n }\n </ul>\n </div>\n </div>\n </div>\n}\n\n<!-- Change Indicator -->\n@if (hasChanges()) {\n <div\n class=\"my-4 flex items-center gap-2 rounded border border-orange-200 bg-orange-50 p-3 dark:bg-orange-900/20\"\n >\n <i class=\"pi pi-info-circle text-orange-600 dark:text-orange-400\"></i>\n <span class=\"text-sm text-orange-800 dark:text-orange-200\">\n Modifications non sauvegard\u00E9es d\u00E9tect\u00E9es\n </span>\n </div>\n}\n", styles: [".inline-edit-cell{position:relative}.inline-edit-cell .edit-indicator{position:absolute;top:2px;right:2px;font-size:.65rem;opacity:0;transition:opacity .2s ease}.inline-edit-cell:hover .edit-indicator{opacity:.5}.cursor-pointer{cursor:pointer;transition:background-color .2s ease}.cursor-pointer:hover{background-color:#0000000d}:host-context(.dark-mode) .cursor-pointer:hover{background-color:#ffffff0d}.cursor-pointer:active{transform:scale(.98)}::ng-deep .p-datatable .p-datatable-thead>tr>th{font-weight:600;text-transform:uppercase;font-size:.75rem;letter-spacing:.05em}::ng-deep .p-datatable .editing-row{background-color:rgba(var(--primary-500),.05);border-left:3px solid var(--primary-500)}::ng-deep .p-datatable .w-\\[120px\\]{width:120px;min-width:120px;max-width:120px}::ng-deep .p-datatable .w-20{width:5rem;min-width:5rem;max-width:5rem}::ng-deep .p-datatable .\\!text-end{text-align:right!important;justify-content:flex-end}.totals-section{background-color:rgba(var(--surface-0),.5);border-top:2px solid var(--surface-border);padding:1rem}.totals-section .totals-row{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;gap:1rem}.totals-section .totals-row.total-final{border-top:2px solid var(--primary-500);padding-top:.75rem;margin-top:.5rem;font-size:1.125rem;font-weight:700;color:var(--primary-500)}.totals-section .totals-label{color:var(--text-color-secondary);font-weight:600}.totals-section .totals-value{font-weight:600;font-variant-numeric:tabular-nums}.add-product-link{display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;color:var(--primary-500);text-decoration:none;transition:color .2s ease}.add-product-link:hover{color:var(--primary-700)}.add-product-link.disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.add-product-link i{font-size:.75rem}.validation-message{padding:1rem;margin-bottom:1rem;border-radius:4px}.validation-message.error{background-color:rgba(var(--red-50),1);border:1px solid rgba(var(--red-200),1);color:var(--red-800)}:host-context(.dark-mode) .validation-message.error{background-color:rgba(var(--red-900),.2);color:var(--red-200)}.validation-message.error .icon{color:var(--red-600)}:host-context(.dark-mode) .validation-message.error .icon{color:var(--red-400)}.validation-message.warning{background-color:rgba(var(--orange-50),1);border:1px solid rgba(var(--orange-200),1);color:var(--orange-800)}:host-context(.dark-mode) .validation-message.warning{background-color:rgba(var(--orange-900),.2);color:var(--orange-200)}.validation-message.warning .icon{color:var(--orange-600)}:host-context(.dark-mode) .validation-message.warning .icon{color:var(--orange-400)}.validation-message.info{background-color:rgba(var(--blue-50),1);border:1px solid rgba(var(--blue-200),1);color:var(--blue-800)}:host-context(.dark-mode) .validation-message.info{background-color:rgba(var(--blue-900),.2);color:var(--blue-200)}.validation-message.info .icon{color:var(--blue-600)}:host-context(.dark-mode) .validation-message.info .icon{color:var(--blue-400)}::ng-deep .p-inputnumber-input.currency-input{text-align:right}::ng-deep .p-inputnumber.discount-input .p-inputnumber-input{text-align:right}@media(max-width:768px){::ng-deep .p-datatable{font-size:.875rem}::ng-deep .p-datatable .w-\\[120px\\]{width:100px;min-width:100px;max-width:100px}.totals-section{font-size:.875rem}.totals-section .totals-row.total-final{font-size:1rem}}@media(max-width:576px){::ng-deep .p-datatable .p-datatable-thead>tr>th{font-size:.7rem;padding:.5rem .25rem}::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:.5rem .25rem}}:focus-visible{outline:2px solid var(--primary-500);outline-offset:2px;border-radius:4px}@media(prefers-contrast:high){.cursor-pointer:hover{background-color:#0000001a}.validation-message{border-width:2px}}@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}@media print{.add-product-link,.p-button,.inline-edit-cell:hover,.cursor-pointer{display:none!important}.validation-message{display:none}::ng-deep .p-datatable .p-datatable-thead>tr>th,::ng-deep .p-datatable .p-datatable-tbody>tr>td{border:1px solid #000}}.loading-overlay{position:absolute;inset:0;background-color:#fffc;display:flex;align-items:center;justify-content:center;z-index:1000}:host-context(.dark-mode) .loading-overlay{background-color:#000c}.loading-overlay .spinner{width:3rem;height:3rem;border:3px solid var(--surface-border);border-top-color:var(--primary-500);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:3rem 1rem;color:var(--text-color-secondary)}.empty-state .empty-icon{font-size:3rem;margin-bottom:1rem;opacity:.3}.empty-state .empty-title{font-size:1.125rem;font-weight:600;margin-bottom:.5rem}.empty-state .empty-message{font-size:.875rem;margin-bottom:1.5rem}\n"] }]
|
|
1789
1788
|
}], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }], order: [{ type: i0.Input, args: [{ isSignal: true, alias: "order", required: true }] }, { type: i0.Output, args: ["orderChange"] }], products: [{ type: i0.Input, args: [{ isSignal: true, alias: "products", required: true }] }], customers: [{ type: i0.Input, args: [{ isSignal: true, alias: "customers", required: true }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], countGroupLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "countGroupLabels", required: false }] }], productKeyField: [{ type: i0.Input, args: [{ isSignal: true, alias: "productKeyField", required: false }] }], backendErrors: [{ type: i0.Input, args: [{ isSignal: true, alias: "backendErrors", required: false }] }], openCatalogue: [{ type: i0.Output, args: ["openCatalogue"] }], orderChanged: [{ type: i0.Output, args: ["orderChanged"] }], orderValidated: [{ type: i0.Output, args: ["orderValidated"] }], productsAdded: [{ type: i0.Output, args: ["productsAdded"] }] } });
|
|
1790
1789
|
|
|
1791
1790
|
class EfProductCatalogueFilterComponent {
|
|
@@ -1865,7 +1864,7 @@ class EfProductCatalogueFilterComponent {
|
|
|
1865
1864
|
return (group.children?.length || 0) > 5;
|
|
1866
1865
|
}
|
|
1867
1866
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfProductCatalogueFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1868
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfProductCatalogueFilterComponent, isStandalone: true, selector: "ef-product-catalogue-filter", inputs: { categoryGroups: { classPropertyName: "categoryGroups", publicName: "categoryGroups", isSignal: true, isRequired: true, transformFunction: null }, products: { classPropertyName: "products", publicName: "products", isSignal: true, isRequired: true, transformFunction: null }, selectedFilters: { classPropertyName: "selectedFilters", publicName: "selectedFilters", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedFilters: "selectedFiltersChange", filtersChanged: "filtersChanged" }, ngImport: i0, template: "<div class=\"flex w-80 shrink-0 flex-col items-start justify-start sticky top-4 max-h-[calc(100vh-2rem)] overflow-y-auto\">\n <div\n class=\"mb-4 flex flex-col items-start justify-center gap-2 self-stretch border-b border-surface-200 px-2 pb-4 dark:border-surface-700\"\n >\n <div class=\"flex items-center justify-between gap-2 self-stretch\">\n <div\n class=\"text-base font-semibold leading-tight text-surface-900 dark:text-surface-0\"\n >\n Filters\n </div>\n <p-button\n size=\"small\"\n severity=\"secondary\"\n [text]=\"true\"\n class=\"py-1! px-2! text-base! font-normal!\"\n (clickEvent)=\"clearAllFilters()\"\n >\n <span pButtonLabel>\n <i class=\"pi pi-eraser\"></i>\n Clear\n </span>\n </p-button>\n </div>\n @if (selectedFilters().length > 0) {\n <div\n class=\"flex flex-wrap items-start justify-start gap-2 self-stretch\"\n >\n @for (filter of selectedFilters(); track filter.type + filter.code) {\n <p-chip\n [label]=\"filter.label\"\n [removable]=\"true\"\n size=\"small\"\n class=\"h-auto rounded-full px-6\"\n removeIcon=\"pi pi-times\"\n (onRemove)=\"removeFilter(filter)\"\n ></p-chip>\n }\n </div>\n }\n </div>\n\n <p-accordion\n [multiple]=\"true\"\n [value]=\"expandedPanels()\"\n class=\"w-full\"\n >\n @for (group of categoryGroups(); track group.code) {\n @if (group.children && group.children.length > 0) {\n <p-accordion-panel [value]=\"group.code\">\n <p-accordion-header>\n <span\n class=\"text-base font-semibold leading-tight text-surface-900 dark:text-surface-0\"\n >{{ group.label }}</span>\n </p-accordion-header>\n <p-accordion-content>\n <div class=\"flex flex-col gap-4\">\n @if (shouldShowSearch(group)) {\n <p-iconfield iconPosition=\"left\" class=\"w-full\">\n <p-inputicon class=\"pi pi-search\"></p-inputicon>\n <input\n pInputText\n size=\"small\"\n [ngModel]=\"searchTerms()[group.code] || ''\"\n (ngModelChange)=\"updateSearchTerm(group.code, $event)\"\n [placeholder]=\"'Rechercher ' + group.label.toLowerCase()\"\n class=\"w-full\"\n />\n </p-iconfield>\n }\n\n @for (item of getFilteredChildren(group); track item.code) {\n <div class=\"flex items-center justify-between gap-2\">\n <div class=\"flex flex-1 items-center gap-2\">\n <p-checkbox\n size=\"small\"\n [inputId]=\"group.code + '_' + item.code\"\n [binary]=\"true\"\n [ngModel]=\"isFilterSelected(group.code, item.code)\"\n (ngModelChange)=\"toggleFilter(group, item)\"\n ></p-checkbox>\n @if (getColorClass(item)) {\n <div\n class=\"h-5 w-5 rounded-full\"\n [class]=\"getColorClass(item)\"\n ></div>\n }\n <ef-label\n [label]=\"item.label\"\n [for]=\"group.code + '_' + item.code\"\n styleClass=\"cursor-pointer text-base font-normal leading-tight text-surface-700 dark:text-surface-300\"\n />\n </div>\n @if (getItemCount(group.code, item.code) > 0) {\n <p-badge\n [value]=\"getItemCount(group.code, item.code)\"\n size=\"small\"\n class=\"rounded-xl! h-6! min-w-6!\"\n severity=\"secondary\"\n ></p-badge>\n }\n </div>\n }\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n }\n }\n </p-accordion>\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i2$4.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "motionOptions"], outputs: ["valueChange", "onClose", "onOpen"] }, { kind: "component", type: i2$4.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i2$4.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i2$4.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "ngmodule", type: BadgeModule }, { kind: "component", type: i3$1.Badge, selector: "p-badge", inputs: ["styleClass", "badgeSize", "size", "severity", "value", "badgeDisabled"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i1.ButtonLabel, selector: "[pButtonLabel]", inputs: ["ptButtonLabel", "pButtonLabelPT", "pButtonLabelUnstyled"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i5.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ChipModule }, { kind: "component", type: i6
|
|
1867
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfProductCatalogueFilterComponent, isStandalone: true, selector: "ef-product-catalogue-filter", inputs: { categoryGroups: { classPropertyName: "categoryGroups", publicName: "categoryGroups", isSignal: true, isRequired: true, transformFunction: null }, products: { classPropertyName: "products", publicName: "products", isSignal: true, isRequired: true, transformFunction: null }, selectedFilters: { classPropertyName: "selectedFilters", publicName: "selectedFilters", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedFilters: "selectedFiltersChange", filtersChanged: "filtersChanged" }, ngImport: i0, template: "<div class=\"flex w-80 shrink-0 flex-col items-start justify-start sticky top-4 max-h-[calc(100vh-2rem)] overflow-y-auto\">\n <div\n class=\"mb-4 flex flex-col items-start justify-center gap-2 self-stretch border-b border-surface-200 px-2 pb-4 dark:border-surface-700\"\n >\n <div class=\"flex items-center justify-between gap-2 self-stretch\">\n <div\n class=\"text-base font-semibold leading-tight text-surface-900 dark:text-surface-0\"\n >\n Filters\n </div>\n <p-button\n size=\"small\"\n severity=\"secondary\"\n [text]=\"true\"\n class=\"py-1! px-2! text-base! font-normal!\"\n (clickEvent)=\"clearAllFilters()\"\n >\n <span pButtonLabel>\n <i class=\"pi pi-eraser\"></i>\n Clear\n </span>\n </p-button>\n </div>\n @if (selectedFilters().length > 0) {\n <div\n class=\"flex flex-wrap items-start justify-start gap-2 self-stretch\"\n >\n @for (filter of selectedFilters(); track filter.type + filter.code) {\n <p-chip\n [label]=\"filter.label\"\n [removable]=\"true\"\n size=\"small\"\n class=\"h-auto rounded-full px-6\"\n removeIcon=\"pi pi-times\"\n (onRemove)=\"removeFilter(filter)\"\n ></p-chip>\n }\n </div>\n }\n </div>\n\n <p-accordion\n [multiple]=\"true\"\n [value]=\"expandedPanels()\"\n class=\"w-full\"\n >\n @for (group of categoryGroups(); track group.code) {\n @if (group.children && group.children.length > 0) {\n <p-accordion-panel [value]=\"group.code\">\n <p-accordion-header>\n <span\n class=\"text-base font-semibold leading-tight text-surface-900 dark:text-surface-0\"\n >{{ group.label }}</span>\n </p-accordion-header>\n <p-accordion-content>\n <div class=\"flex flex-col gap-4\">\n @if (shouldShowSearch(group)) {\n <p-iconfield iconPosition=\"left\" class=\"w-full\">\n <p-inputicon class=\"pi pi-search\"></p-inputicon>\n <input\n pInputText\n size=\"small\"\n [ngModel]=\"searchTerms()[group.code] || ''\"\n (ngModelChange)=\"updateSearchTerm(group.code, $event)\"\n [placeholder]=\"'Rechercher ' + group.label.toLowerCase()\"\n class=\"w-full\"\n />\n </p-iconfield>\n }\n\n @for (item of getFilteredChildren(group); track item.code) {\n <div class=\"flex items-center justify-between gap-2\">\n <div class=\"flex flex-1 items-center gap-2\">\n <p-checkbox\n size=\"small\"\n [inputId]=\"group.code + '_' + item.code\"\n [binary]=\"true\"\n [ngModel]=\"isFilterSelected(group.code, item.code)\"\n (ngModelChange)=\"toggleFilter(group, item)\"\n ></p-checkbox>\n @if (getColorClass(item)) {\n <div\n class=\"h-5 w-5 rounded-full\"\n [class]=\"getColorClass(item)\"\n ></div>\n }\n <ef-label\n [label]=\"item.label\"\n [for]=\"group.code + '_' + item.code\"\n styleClass=\"cursor-pointer text-base font-normal leading-tight text-surface-700 dark:text-surface-300\"\n />\n </div>\n @if (getItemCount(group.code, item.code) > 0) {\n <p-badge\n [value]=\"getItemCount(group.code, item.code)\"\n size=\"small\"\n class=\"rounded-xl! h-6! min-w-6!\"\n severity=\"secondary\"\n ></p-badge>\n }\n </div>\n }\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n }\n }\n </p-accordion>\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i2$4.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "motionOptions"], outputs: ["valueChange", "onClose", "onOpen"] }, { kind: "component", type: i2$4.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i2$4.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i2$4.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "ngmodule", type: BadgeModule }, { kind: "component", type: i3$1.Badge, selector: "p-badge", inputs: ["styleClass", "badgeSize", "size", "severity", "value", "badgeDisabled"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i1.ButtonLabel, selector: "[pButtonLabel]", inputs: ["ptButtonLabel", "pButtonLabelPT", "pButtonLabelUnstyled"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i5$1.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ChipModule }, { kind: "component", type: i6.Chip, selector: "p-chip", inputs: ["label", "icon", "image", "alt", "styleClass", "disabled", "removable", "removeIcon", "chipProps"], outputs: ["onRemove", "onImageError"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i7.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i8.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i9.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: EfLabelComponent, selector: "ef-label", inputs: ["label", "labelKey", "for", "styleClass", "required"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1869
1868
|
}
|
|
1870
1869
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfProductCatalogueFilterComponent, decorators: [{
|
|
1871
1870
|
type: Component,
|
|
@@ -2330,7 +2329,7 @@ class EfProductCatalogueComponent {
|
|
|
2330
2329
|
return (this.currencyPipe.transform(value, this.currencyCode(), 'symbol-narrow', '1.2-2') || '');
|
|
2331
2330
|
}
|
|
2332
2331
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfProductCatalogueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2333
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfProductCatalogueComponent, isStandalone: true, selector: "ef-product-catalogue", inputs: { products: { classPropertyName: "products", publicName: "products", isSignal: true, isRequired: false, transformFunction: null }, categoryGroups: { classPropertyName: "categoryGroups", publicName: "categoryGroups", isSignal: true, isRequired: false, transformFunction: null }, initialSelectedItems: { classPropertyName: "initialSelectedItems", publicName: "initialSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, defaultFilters: { classPropertyName: "defaultFilters", publicName: "defaultFilters", isSignal: true, isRequired: false, transformFunction: null }, trackByField: { classPropertyName: "trackByField", publicName: "trackByField", isSignal: true, isRequired: false, transformFunction: null }, currencyCode: { classPropertyName: "currencyCode", publicName: "currencyCode", isSignal: true, isRequired: false, transformFunction: null }, localeCode: { classPropertyName: "localeCode", publicName: "localeCode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { productsValidated: "productsValidated" }, queries: [{ propertyName: "productThumbnailTpl", first: true, predicate: ["productThumbnail"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "sortMenu", first: true, predicate: ["sortMenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"bg-surface-0 dark:bg-surface-950\">\n <div class=\"flex flex-row gap-4\">\n <!-- Filter Sidebar -->\n <ef-product-catalogue-filter\n [categoryGroups]=\"categoryGroups()\"\n [products]=\"products()\"\n [(selectedFilters)]=\"selectedFilters\"\n (filtersChanged)=\"onFiltersChanged($event)\"\n />\n\n <!-- Product Grid -->\n <div\n class=\"min-h-96 flex-1 rounded-md border-2 border-dotted border-surface-200 bg-surface-50 p-4 dark:border-surface-700 dark:bg-surface-800\"\n >\n <div class=\"sticky top-0 z-10 w-full mb-4 bg-surface-50 dark:bg-surface-800 pb-2 -mt-4 pt-4 -mx-4 px-4\">\n <p-iconfield iconPosition=\"left\" class=\"w-full\">\n <p-inputicon class=\"pi pi-search\"></p-inputicon>\n <input\n pInputText\n size=\"small\"\n [(ngModel)]=\"productSearch\"\n [placeholder]=\"'placeholder.search_products' | translate\"\n class=\"w-full\"\n />\n </p-iconfield>\n </div>\n <div class=\"grid grid-cols-2 gap-4 lg:grid-cols-3 xl:grid-cols-4\">\n @for (product of filteredProducts(); track trackKey(product)) {\n <p-card\n [header]=\"''\"\n [class.border-2]=\"true\"\n [class.border-blue-100]=\"getProductQuantity(product) > 0\"\n [class.!bg-blue-100]=\"getProductQuantity(product) > 0\"\n [class.dark:!border-blue-900]=\"getProductQuantity(product) > 0\"\n [class.dark:!bg-blue-900]=\"getProductQuantity(product) > 0\"\n [class.border-transparent]=\"getProductQuantity(product) === 0\"\n class=\"cursor-pointer hover:shadow-md dark:hover:shadow-md dark:hover:shadow-gray-300/50\"\n >\n <ng-template pTemplate=\"header\">\n <div class=\"w-full\">\n @if (productThumbnailTpl()) {\n <ng-container *ngTemplateOutlet=\"productThumbnailTpl(); context: { $implicit: product }\"></ng-container>\n } @else {\n <!-- Default fallback thumbnail -->\n <div class=\"flex h-[13rem] items-center justify-center bg-surface-100 text-3xl text-surface-400 dark:bg-surface-800\">\n <i class=\"pi pi-box\"></i>\n </div>\n }\n </div>\n </ng-template>\n <ng-template pTemplate=\"content\">\n <div [innerHTML]=\"product.displayName\" class=\"h-14 font-semibold\"></div>\n </ng-template>\n <ng-template pTemplate=\"footer\">\n @if (isVariableProduct(product)) {\n <!-- Variable product: variant selector + per-variant quantities -->\n <div class=\"flex items-center justify-between mb-2\">\n <p-badge\n severity=\"secondary\"\n [value]=\"getActiveVariants(product).length + ' ' + ('catalogue.variants' | translate)\"\n badgeSize=\"small\"\n />\n <div class=\"text-lg font-bold\">\n {{ formatPrice(product) }}\n </div>\n </div>\n\n <!-- Variant selector -->\n <p-select\n [options]=\"getActiveVariants(product)\"\n optionLabel=\"title\"\n optionValue=\"variantId\"\n [ngModel]=\"getSelectedVariantId(product)\"\n (ngModelChange)=\"setSelectedVariant(product, $event)\"\n size=\"small\"\n styleClass=\"w-full mb-3\"\n [placeholder]=\"'placeholder.select_variant' | translate\"\n />\n\n <!-- Add button or quantity stepper for selected variant -->\n <div class=\"mt-2\">\n @if (getProductQuantity(product) > 0) {\n <!-- Show per-variant breakdown -->\n @for (entry of selectedProducts(); track $index) {\n @if (productKey(entry.product) === productKey(product) && entry.variantId) {\n <div class=\"flex items-center justify-center gap-2 mb-2\">\n <span class=\"text-xs font-medium text-surface-600 dark:text-surface-400 min-w-12 text-center\">\n {{ getVariantTitle(product, entry.variantId) }}\n </span>\n <ef-quantity-stepper\n [ngModel]=\"entry.quantity\"\n (ngModelChange)=\"updateVariantQuantity(product, entry.variantId!, $event)\"\n [min]=\"0\"\n [max]=\"1000\"\n [maxFractionDigits]=\"4\"\n [locale]=\"localeCode()\"\n />\n <ef-button\n icon=\"pi pi-times\"\n severity=\"danger\"\n styleClass=\"!rounded-full !w-7 !h-7 !p-0\"\n size=\"small\"\n (clickEvent)=\"removeVariantSelection(product, entry.variantId!)\"\n />\n </div>\n }\n }\n <!-- Add another variant button -->\n <ef-button\n icon=\"pi pi-plus\"\n [label]=\"'button.add_variant' | translate\"\n severity=\"primary\"\n styleClass=\"w-full !rounded-full !h-10 mt-1\"\n size=\"small\"\n (clickEvent)=\"addProduct(product)\"\n />\n } @else {\n <ef-button\n [label]=\"'button.add' | translate\"\n icon=\"pi pi-shopping-cart\"\n severity=\"primary\"\n styleClass=\"w-full !rounded-full !h-12\"\n (clickEvent)=\"addProduct(product)\"\n />\n }\n </div>\n } @else {\n <!-- Simple product: original behavior -->\n <div class=\"flex items-center justify-between\">\n <p-badge\n severity=\"secondary\"\n [value]=\"getPackagingLabel(product)\"\n badgeSize=\"small\"\n />\n <div class=\"text-lg font-bold\">\n {{ formatPrice(product) }}\n </div>\n </div>\n <div class=\"mt-4\">\n @if (getProductQuantity(product) > 0) {\n <div class=\"flex items-center justify-between\">\n <ef-button\n icon=\"pi pi-trash\"\n severity=\"primary\"\n styleClass=\"!rounded-full\"\n (clickEvent)=\"removeProduct(product)\"\n />\n <ef-quantity-stepper\n [ngModel]=\"getProductQuantity(product)\"\n (ngModelChange)=\"updateProductQuantity(product, $event)\"\n [min]=\"0\"\n [max]=\"1000\"\n [maxFractionDigits]=\"4\"\n [locale]=\"localeCode()\"\n />\n </div>\n } @else {\n <ef-button\n [label]=\"'button.add' | translate\"\n icon=\"pi pi-shopping-cart\"\n severity=\"primary\"\n styleClass=\"w-full !rounded-full !h-12\"\n (clickEvent)=\"addProduct(product)\"\n />\n }\n </div>\n }\n </ng-template>\n </p-card>\n } @empty {\n <div class=\"p-2\">{{ 'message.no_products_found' | translate }}</div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: [".p-accordion-header-link{border:0!important;padding:.25rem 0!important;box-shadow:none!important}.p-accordion-panel{border:0!important;border-bottom:1px solid var(--surface-200)!important}:host-context(.dark) .p-accordion-panel{border-bottom-color:var(--surface-700)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i8.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: BadgeModule }, { kind: "component", type: i3$1.Badge, selector: "p-badge", inputs: ["styleClass", "badgeSize", "size", "severity", "value", "badgeDisabled"] }, { kind: "directive", type: i2$5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: EfButtonComponent, selector: "ef-button", inputs: ["label", "labelKey", "icon", "severity", "size", "disabled", "rounded", "outlined", "raised", "text", "loading", "styleClass", "type", "badge", "badgeSeverity", "tooltip", "tooltipKey", "tooltipPosition"], outputs: ["clickEvent"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i5$1.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i7.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i8$1.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i9.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: MenuModule }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i1$2.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: EfQuantityStepperComponent, selector: "ef-quantity-stepper", inputs: ["value", "min", "max", "step", "minFractionDigits", "maxFractionDigits", "locale", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: EfProductCatalogueFilterComponent, selector: "ef-product-catalogue-filter", inputs: ["categoryGroups", "products", "selectedFilters"], outputs: ["selectedFiltersChange", "filtersChanged"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2332
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfProductCatalogueComponent, isStandalone: true, selector: "ef-product-catalogue", inputs: { products: { classPropertyName: "products", publicName: "products", isSignal: true, isRequired: false, transformFunction: null }, categoryGroups: { classPropertyName: "categoryGroups", publicName: "categoryGroups", isSignal: true, isRequired: false, transformFunction: null }, initialSelectedItems: { classPropertyName: "initialSelectedItems", publicName: "initialSelectedItems", isSignal: true, isRequired: false, transformFunction: null }, defaultFilters: { classPropertyName: "defaultFilters", publicName: "defaultFilters", isSignal: true, isRequired: false, transformFunction: null }, trackByField: { classPropertyName: "trackByField", publicName: "trackByField", isSignal: true, isRequired: false, transformFunction: null }, currencyCode: { classPropertyName: "currencyCode", publicName: "currencyCode", isSignal: true, isRequired: false, transformFunction: null }, localeCode: { classPropertyName: "localeCode", publicName: "localeCode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { productsValidated: "productsValidated" }, queries: [{ propertyName: "productThumbnailTpl", first: true, predicate: ["productThumbnail"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "sortMenu", first: true, predicate: ["sortMenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"bg-surface-0 dark:bg-surface-950\">\n <div class=\"flex flex-row gap-4\">\n <!-- Filter Sidebar -->\n <ef-product-catalogue-filter\n [categoryGroups]=\"categoryGroups()\"\n [products]=\"products()\"\n [(selectedFilters)]=\"selectedFilters\"\n (filtersChanged)=\"onFiltersChanged($event)\"\n />\n\n <!-- Product Grid -->\n <div\n class=\"min-h-96 flex-1 rounded-md border-2 border-dotted border-surface-200 bg-surface-50 p-4 dark:border-surface-700 dark:bg-surface-800\"\n >\n <div class=\"sticky top-0 z-10 w-full mb-4 bg-surface-50 dark:bg-surface-800 pb-2 -mt-4 pt-4 -mx-4 px-4\">\n <p-iconfield iconPosition=\"left\" class=\"w-full\">\n <p-inputicon class=\"pi pi-search\"></p-inputicon>\n <input\n pInputText\n size=\"small\"\n [(ngModel)]=\"productSearch\"\n [placeholder]=\"'placeholder.search_products' | translate\"\n class=\"w-full\"\n />\n </p-iconfield>\n </div>\n <div class=\"grid grid-cols-2 gap-4 lg:grid-cols-3 xl:grid-cols-4\">\n @for (product of filteredProducts(); track trackKey(product)) {\n <p-card\n [header]=\"''\"\n [class.border-2]=\"true\"\n [class.border-blue-100]=\"getProductQuantity(product) > 0\"\n [class.!bg-blue-100]=\"getProductQuantity(product) > 0\"\n [class.dark:!border-blue-900]=\"getProductQuantity(product) > 0\"\n [class.dark:!bg-blue-900]=\"getProductQuantity(product) > 0\"\n [class.border-transparent]=\"getProductQuantity(product) === 0\"\n class=\"cursor-pointer hover:shadow-md dark:hover:shadow-md dark:hover:shadow-gray-300/50\"\n >\n <ng-template pTemplate=\"header\">\n <div class=\"w-full\">\n @if (productThumbnailTpl()) {\n <ng-container *ngTemplateOutlet=\"productThumbnailTpl(); context: { $implicit: product }\"></ng-container>\n } @else {\n <!-- Default fallback thumbnail -->\n <div class=\"flex h-[13rem] items-center justify-center bg-surface-100 text-3xl text-surface-400 dark:bg-surface-800\">\n <i class=\"pi pi-box\"></i>\n </div>\n }\n </div>\n </ng-template>\n <ng-template pTemplate=\"content\">\n <div [innerHTML]=\"product.displayName\" class=\"h-14 font-semibold\"></div>\n </ng-template>\n <ng-template pTemplate=\"footer\">\n @if (isVariableProduct(product)) {\n <!-- Variable product: variant selector + per-variant quantities -->\n <div class=\"flex items-center justify-between mb-2\">\n <p-badge\n severity=\"secondary\"\n [value]=\"getActiveVariants(product).length + ' ' + ('catalogue.variants' | translate)\"\n badgeSize=\"small\"\n />\n <div class=\"text-lg font-bold\">\n {{ formatPrice(product) }}\n </div>\n </div>\n\n <!-- Variant selector -->\n <p-select\n [options]=\"getActiveVariants(product)\"\n optionLabel=\"title\"\n optionValue=\"variantId\"\n [ngModel]=\"getSelectedVariantId(product)\"\n (ngModelChange)=\"setSelectedVariant(product, $event)\"\n size=\"small\"\n styleClass=\"w-full mb-3\"\n [placeholder]=\"'placeholder.select_variant' | translate\"\n />\n\n <!-- Add button or quantity stepper for selected variant -->\n <div class=\"mt-2\">\n @if (getProductQuantity(product) > 0) {\n <!-- Show per-variant breakdown -->\n @for (entry of selectedProducts(); track $index) {\n @if (productKey(entry.product) === productKey(product) && entry.variantId) {\n <div class=\"flex items-center justify-center gap-2 mb-2\">\n <span class=\"text-xs font-medium text-surface-600 dark:text-surface-400 min-w-12 text-center\">\n {{ getVariantTitle(product, entry.variantId) }}\n </span>\n <ef-quantity-stepper\n [ngModel]=\"entry.quantity\"\n (ngModelChange)=\"updateVariantQuantity(product, entry.variantId!, $event)\"\n [min]=\"0\"\n [max]=\"1000\"\n [maxFractionDigits]=\"4\"\n [locale]=\"localeCode()\"\n />\n <ef-button\n icon=\"pi pi-times\"\n severity=\"danger\"\n styleClass=\"!rounded-full !w-7 !h-7 !p-0\"\n size=\"small\"\n (clickEvent)=\"removeVariantSelection(product, entry.variantId!)\"\n />\n </div>\n }\n }\n <!-- Add another variant button -->\n <ef-button\n icon=\"pi pi-plus\"\n [label]=\"'button.add_variant' | translate\"\n severity=\"primary\"\n styleClass=\"w-full !rounded-full !h-10 mt-1\"\n size=\"small\"\n (clickEvent)=\"addProduct(product)\"\n />\n } @else {\n <ef-button\n [label]=\"'button.add' | translate\"\n icon=\"pi pi-shopping-cart\"\n severity=\"primary\"\n styleClass=\"w-full !rounded-full !h-12\"\n (clickEvent)=\"addProduct(product)\"\n />\n }\n </div>\n } @else {\n <!-- Simple product: original behavior -->\n <div class=\"flex items-center justify-between\">\n <p-badge\n severity=\"secondary\"\n [value]=\"getPackagingLabel(product)\"\n badgeSize=\"small\"\n />\n <div class=\"text-lg font-bold\">\n {{ formatPrice(product) }}\n </div>\n </div>\n <div class=\"mt-4\">\n @if (getProductQuantity(product) > 0) {\n <div class=\"flex items-center justify-between\">\n <ef-button\n icon=\"pi pi-trash\"\n severity=\"primary\"\n styleClass=\"!rounded-full\"\n (clickEvent)=\"removeProduct(product)\"\n />\n <ef-quantity-stepper\n [ngModel]=\"getProductQuantity(product)\"\n (ngModelChange)=\"updateProductQuantity(product, $event)\"\n [min]=\"0\"\n [max]=\"1000\"\n [maxFractionDigits]=\"4\"\n [locale]=\"localeCode()\"\n />\n </div>\n } @else {\n <ef-button\n [label]=\"'button.add' | translate\"\n icon=\"pi pi-shopping-cart\"\n severity=\"primary\"\n styleClass=\"w-full !rounded-full !h-12\"\n (clickEvent)=\"addProduct(product)\"\n />\n }\n </div>\n }\n </ng-template>\n </p-card>\n } @empty {\n <div class=\"p-2\">{{ 'message.no_products_found' | translate }}</div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: [".p-accordion-header-link{border:0!important;padding:.25rem 0!important;box-shadow:none!important}.p-accordion-panel{border:0!important;border-bottom:1px solid var(--surface-200)!important}:host-context(.dark) .p-accordion-panel{border-bottom-color:var(--surface-700)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: BadgeModule }, { kind: "component", type: i3$1.Badge, selector: "p-badge", inputs: ["styleClass", "badgeSize", "size", "severity", "value", "badgeDisabled"] }, { kind: "directive", type: i2$5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: EfButtonComponent, selector: "ef-button", inputs: ["label", "labelKey", "icon", "severity", "size", "disabled", "rounded", "outlined", "raised", "text", "loading", "styleClass", "type", "badge", "badgeSeverity", "tooltip", "tooltipKey", "tooltipPosition"], outputs: ["clickEvent"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i5$2.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i7.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i8.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i9.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: MenuModule }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i1$2.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: EfQuantityStepperComponent, selector: "ef-quantity-stepper", inputs: ["value", "min", "max", "step", "minFractionDigits", "maxFractionDigits", "locale", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: EfProductCatalogueFilterComponent, selector: "ef-product-catalogue-filter", inputs: ["categoryGroups", "products", "selectedFilters"], outputs: ["selectedFiltersChange", "filtersChanged"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2334
2333
|
}
|
|
2335
2334
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfProductCatalogueComponent, decorators: [{
|
|
2336
2335
|
type: Component,
|
|
@@ -2417,7 +2416,7 @@ class EfDialogComponent {
|
|
|
2417
2416
|
this.saveAction.emit();
|
|
2418
2417
|
}
|
|
2419
2418
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2420
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.11", type: EfDialogComponent, isStandalone: true, selector: "ef-dialog", inputs: { header: "header", headerKey: "headerKey", visible: ["visible", "visible", booleanAttribute], modal: ["modal", "modal", booleanAttribute], closable: ["closable", "closable", booleanAttribute], draggable: ["draggable", "draggable", booleanAttribute], resizable: ["resizable", "resizable", booleanAttribute], style: "style", styleClass: "styleClass", position: "position", appendTo: "appendTo", defaultActions: ["defaultActions", "defaultActions", booleanAttribute], saveLabelKey: "saveLabelKey", cancelLabelKey: "cancelLabelKey", saveLabel: "saveLabel", cancelLabel: "cancelLabel", saveIcon: "saveIcon", saveDisabled: ["saveDisabled", "saveDisabled", booleanAttribute], saveStyleClass: "saveStyleClass", cancelStyleClass: "cancelStyleClass" }, outputs: { visibleChange: "visibleChange", showEvent: "showEvent", hideEvent: "hideEvent", saveAction: "saveAction", cancelAction: "cancelAction" }, viewQueries: [{ propertyName: "defaultFooterTpl", first: true, predicate: ["defaultFooter"], descendants: true, static: true }], ngImport: i0, template: "<p-dialog\n [header]=\"headerKey ? (headerKey | translate) : header\"\n [visible]=\"visible\"\n (visibleChange)=\"handleVisibleChange($event)\"\n [modal]=\"modal\"\n [closable]=\"closable\"\n [draggable]=\"draggable\"\n [resizable]=\"resizable\"\n [style]=\"style\"\n [styleClass]=\"styleClass\"\n [position]=\"position\"\n [appendTo]=\"appendTo\"\n [footerTemplate]=\"defaultActions ? defaultFooterTpl : null\"\n (onShow)=\"handleShow()\"\n (onHide)=\"handleHide()\"\n>\n <ng-content />\n</p-dialog>\n\n<!-- Default action footer. Declared outside <p-dialog> because its <ng-template>\n is a view child of ef-dialog, not a content child of <p-dialog>; we hand it\n to <p-dialog> via the [footerTemplate] input above. -->\n<ng-template #defaultFooter>\n <div class=\"flex justify-end gap-2\">\n <ef-button\n [labelKey]=\"cancelLabelKey\"\n [label]=\"cancelLabel\"\n [styleClass]=\"cancelStyleClass\"\n (clickEvent)=\"onDefaultCancel()\"\n />\n <ef-button\n [labelKey]=\"saveLabelKey\"\n [label]=\"saveLabel\"\n [icon]=\"saveIcon\"\n [styleClass]=\"saveStyleClass\"\n [disabled]=\"saveDisabled\"\n (clickEvent)=\"onDefaultSave()\"\n />\n </div>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1$
|
|
2419
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.11", type: EfDialogComponent, isStandalone: true, selector: "ef-dialog", inputs: { header: "header", headerKey: "headerKey", visible: ["visible", "visible", booleanAttribute], modal: ["modal", "modal", booleanAttribute], closable: ["closable", "closable", booleanAttribute], draggable: ["draggable", "draggable", booleanAttribute], resizable: ["resizable", "resizable", booleanAttribute], style: "style", styleClass: "styleClass", position: "position", appendTo: "appendTo", defaultActions: ["defaultActions", "defaultActions", booleanAttribute], saveLabelKey: "saveLabelKey", cancelLabelKey: "cancelLabelKey", saveLabel: "saveLabel", cancelLabel: "cancelLabel", saveIcon: "saveIcon", saveDisabled: ["saveDisabled", "saveDisabled", booleanAttribute], saveStyleClass: "saveStyleClass", cancelStyleClass: "cancelStyleClass" }, outputs: { visibleChange: "visibleChange", showEvent: "showEvent", hideEvent: "hideEvent", saveAction: "saveAction", cancelAction: "cancelAction" }, viewQueries: [{ propertyName: "defaultFooterTpl", first: true, predicate: ["defaultFooter"], descendants: true, static: true }], ngImport: i0, template: "<p-dialog\n [header]=\"headerKey ? (headerKey | translate) : header\"\n [visible]=\"visible\"\n (visibleChange)=\"handleVisibleChange($event)\"\n [modal]=\"modal\"\n [closable]=\"closable\"\n [draggable]=\"draggable\"\n [resizable]=\"resizable\"\n [style]=\"style\"\n [styleClass]=\"styleClass\"\n [position]=\"position\"\n [appendTo]=\"appendTo\"\n [footerTemplate]=\"defaultActions ? defaultFooterTpl : null\"\n (onShow)=\"handleShow()\"\n (onHide)=\"handleHide()\"\n>\n <ng-content />\n</p-dialog>\n\n<!-- Default action footer. Declared outside <p-dialog> because its <ng-template>\n is a view child of ef-dialog, not a content child of <p-dialog>; we hand it\n to <p-dialog> via the [footerTemplate] input above. -->\n<ng-template #defaultFooter>\n <div class=\"flex justify-end gap-2\">\n <ef-button\n [labelKey]=\"cancelLabelKey\"\n [label]=\"cancelLabel\"\n [styleClass]=\"cancelStyleClass\"\n (clickEvent)=\"onDefaultCancel()\"\n />\n <ef-button\n [labelKey]=\"saveLabelKey\"\n [label]=\"saveLabel\"\n [icon]=\"saveIcon\"\n [styleClass]=\"saveStyleClass\"\n [disabled]=\"saveDisabled\"\n (clickEvent)=\"onDefaultSave()\"\n />\n </div>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1$6.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "maskMotionOptions", "motionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EfButtonComponent, selector: "ef-button", inputs: ["label", "labelKey", "icon", "severity", "size", "disabled", "rounded", "outlined", "raised", "text", "loading", "styleClass", "type", "badge", "badgeSeverity", "tooltip", "tooltipKey", "tooltipPosition"], outputs: ["clickEvent"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
2421
2420
|
}
|
|
2422
2421
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfDialogComponent, decorators: [{
|
|
2423
2422
|
type: Component,
|
|
@@ -2867,7 +2866,7 @@ class EfToolbarComponent {
|
|
|
2867
2866
|
this.router.navigate([baseUrl]);
|
|
2868
2867
|
}
|
|
2869
2868
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2870
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfToolbarComponent, isStandalone: true, selector: "ef-toolbar", inputs: { context: "context", state: "state", disabled: "disabled", backButton: "backButton", deleteButton: "deleteButton", duplicateButton: "duplicateButton", saveButton: "saveButton", exportButton: "exportButton", printButton: "printButton", addButton: "addButton", clearButton: "clearButton", searchButton: "searchButton", showFreeSearchInput: "showFreeSearchInput" }, outputs: { back: "back", save: "save", delete: "delete", duplicate: "duplicate", print: "print", triggerCustoAction: "triggerCustoAction", add: "add", search: "search", clear: "clear" }, ngImport: i0, template: "<p-toolbar>\n <ng-template #start>\n <div class=\"flex items-center gap-3\">\n @if (isDetailState || backButton) {\n <ef-button\n icon=\"pi pi-angle-left\"\n severity=\"primary\"\n styleClass=\"action-btn-text\"\n tooltipKey=\"common.back\"\n labelKey=\"common.back\"\n size=\"small\"\n (clickEvent)=\"backAction()\"\n />\n }\n <!-- Custom content slot for start section (e.g., status badge) -->\n <ng-content select=\"[toolbarStart]\" />\n </div>\n </ng-template>\n <ng-template #center>\n @if (showFreeSearchInput) {\n <p-iconfield iconPosition=\"left\">\n <p-inputicon styleClass=\"pi pi-search\" />\n <input\n id=\"freeTextSearch\"\n type=\"text\"\n pInputText\n [placeholder]=\"'common.search' | translate\"\n />\n </p-iconfield>\n }\n </ng-template>\n <ng-template #end>\n <!-- DETAIL state -->\n <!-- Custom content slot for start section (e.g., status badge) -->\n <ng-content select=\"[toolbarEnd]\" />\n @if (isDetailState && isDuplicateMode) {\n <span\n class=\"duplicate-badge flex items-center gap-1 rounded bg-blue-100 px-2 py-1 text-sm text-blue-700\"\n >\n <i class=\"pi pi-copy\"></i> {{ 'common.duplicate' | translate }}\n </span>\n }\n @if (isDetailState && deleteButton && hasDeletePermission) {\n <ef-button\n icon=\"pi pi-trash\"\n severity=\"danger\"\n styleClass=\"action-btn\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.delete\"\n size=\"small\"\n [disabled]=\"disabled\"\n (clickEvent)=\"deleteAction()\"\n />\n }\n @if (isDetailState && printButton) {\n <ef-button\n icon=\"pi pi-print\"\n severity=\"primary\"\n styleClass=\"action-btn\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.print\"\n size=\"small\"\n [disabled]=\"disabled\"\n (clickEvent)=\"printAction()\"\n />\n }\n @if (\n isDetailState &&\n duplicateButton &&\n hasDuplicatePermission &&\n !isDuplicateMode\n ) {\n <ef-button\n icon=\"pi pi-copy\"\n severity=\"primary\"\n styleClass=\"action-btn\"\n tooltipPosition=\"left\"\n tooltipKey=\"common.duplicate\"\n size=\"small\"\n [disabled]=\"disabled\"\n (clickEvent)=\"duplicateAction()\"\n />\n }\n @if (isDetailState && saveButton && hasWritePermission) {\n <ef-button\n icon=\"pi pi-save\"\n severity=\"primary\"\n styleClass=\"action-btn\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.save\"\n size=\"small\"\n [disabled]=\"disabled\"\n (clickEvent)=\"saveAction()\"\n />\n }\n <!-- SEARCH state -->\n @if (isSearchState && exportButton && hasExportPermission) {\n <ef-button\n icon=\"pi pi-upload\"\n severity=\"primary\"\n styleClass=\"action-btn\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.export\"\n size=\"small\"\n (clickEvent)=\"exportAction()\"\n />\n }\n @if (isSearchState && addButton && hasWritePermission) {\n <ef-button\n icon=\"pi pi-plus\"\n severity=\"primary\"\n styleClass=\"action-btn-text\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.add\"\n labelKey=\"common.add\"\n size=\"small\"\n (clickEvent)=\"addAction()\"\n />\n }\n @if (isSearchState && clearButton) {\n <ef-button\n icon=\"pi pi-filter-slash\"\n severity=\"primary\"\n styleClass=\"action-btn-text\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.clear_search_criteria\"\n labelKey=\"common.clear\"\n size=\"small\"\n (clickEvent)=\"clearAction()\"\n />\n }\n @if (isSearchState && searchButton && hasReadPermission) {\n <ef-button\n icon=\"pi pi-search\"\n severity=\"primary\"\n styleClass=\"action-btn-text\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.search\"\n labelKey=\"common.search\"\n size=\"small\"\n [disabled]=\"disabled\"\n (clickEvent)=\"searchAction()\"\n />\n }\n </ng-template>\n</p-toolbar>\n", styles: [":host ::ng-deep .p-toolbar{padding:4px!important;border-radius:0;border-left:none;border-right:none;overflow:visible}:host ::ng-deep .p-toolbar-end{flex-wrap:wrap;gap:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i1$
|
|
2869
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfToolbarComponent, isStandalone: true, selector: "ef-toolbar", inputs: { context: "context", state: "state", disabled: "disabled", backButton: "backButton", deleteButton: "deleteButton", duplicateButton: "duplicateButton", saveButton: "saveButton", exportButton: "exportButton", printButton: "printButton", addButton: "addButton", clearButton: "clearButton", searchButton: "searchButton", showFreeSearchInput: "showFreeSearchInput" }, outputs: { back: "back", save: "save", delete: "delete", duplicate: "duplicate", print: "print", triggerCustoAction: "triggerCustoAction", add: "add", search: "search", clear: "clear" }, ngImport: i0, template: "<p-toolbar>\n <ng-template #start>\n <div class=\"flex items-center gap-3\">\n @if (isDetailState || backButton) {\n <ef-button\n icon=\"pi pi-angle-left\"\n severity=\"primary\"\n styleClass=\"action-btn-text\"\n tooltipKey=\"common.back\"\n labelKey=\"common.back\"\n size=\"small\"\n (clickEvent)=\"backAction()\"\n />\n }\n <!-- Custom content slot for start section (e.g., status badge) -->\n <ng-content select=\"[toolbarStart]\" />\n </div>\n </ng-template>\n <ng-template #center>\n @if (showFreeSearchInput) {\n <p-iconfield iconPosition=\"left\">\n <p-inputicon styleClass=\"pi pi-search\" />\n <input\n id=\"freeTextSearch\"\n type=\"text\"\n pInputText\n [placeholder]=\"'common.search' | translate\"\n />\n </p-iconfield>\n }\n </ng-template>\n <ng-template #end>\n <!-- DETAIL state -->\n <!-- Custom content slot for start section (e.g., status badge) -->\n <ng-content select=\"[toolbarEnd]\" />\n @if (isDetailState && isDuplicateMode) {\n <span\n class=\"duplicate-badge flex items-center gap-1 rounded bg-blue-100 px-2 py-1 text-sm text-blue-700\"\n >\n <i class=\"pi pi-copy\"></i> {{ 'common.duplicate' | translate }}\n </span>\n }\n @if (isDetailState && deleteButton && hasDeletePermission) {\n <ef-button\n icon=\"pi pi-trash\"\n severity=\"danger\"\n styleClass=\"action-btn\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.delete\"\n size=\"small\"\n [disabled]=\"disabled\"\n (clickEvent)=\"deleteAction()\"\n />\n }\n @if (isDetailState && printButton) {\n <ef-button\n icon=\"pi pi-print\"\n severity=\"primary\"\n styleClass=\"action-btn\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.print\"\n size=\"small\"\n [disabled]=\"disabled\"\n (clickEvent)=\"printAction()\"\n />\n }\n @if (\n isDetailState &&\n duplicateButton &&\n hasDuplicatePermission &&\n !isDuplicateMode\n ) {\n <ef-button\n icon=\"pi pi-copy\"\n severity=\"primary\"\n styleClass=\"action-btn\"\n tooltipPosition=\"left\"\n tooltipKey=\"common.duplicate\"\n size=\"small\"\n [disabled]=\"disabled\"\n (clickEvent)=\"duplicateAction()\"\n />\n }\n @if (isDetailState && saveButton && hasWritePermission) {\n <ef-button\n icon=\"pi pi-save\"\n severity=\"primary\"\n styleClass=\"action-btn\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.save\"\n size=\"small\"\n [disabled]=\"disabled\"\n (clickEvent)=\"saveAction()\"\n />\n }\n <!-- SEARCH state -->\n @if (isSearchState && exportButton && hasExportPermission) {\n <ef-button\n icon=\"pi pi-upload\"\n severity=\"primary\"\n styleClass=\"action-btn\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.export\"\n size=\"small\"\n (clickEvent)=\"exportAction()\"\n />\n }\n @if (isSearchState && addButton && hasWritePermission) {\n <ef-button\n icon=\"pi pi-plus\"\n severity=\"primary\"\n styleClass=\"action-btn-text\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.add\"\n labelKey=\"common.add\"\n size=\"small\"\n (clickEvent)=\"addAction()\"\n />\n }\n @if (isSearchState && clearButton) {\n <ef-button\n icon=\"pi pi-filter-slash\"\n severity=\"primary\"\n styleClass=\"action-btn-text\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.clear_search_criteria\"\n labelKey=\"common.clear\"\n size=\"small\"\n (clickEvent)=\"clearAction()\"\n />\n }\n @if (isSearchState && searchButton && hasReadPermission) {\n <ef-button\n icon=\"pi pi-search\"\n severity=\"primary\"\n styleClass=\"action-btn-text\"\n tooltipPosition=\"top\"\n tooltipKey=\"common.search\"\n labelKey=\"common.search\"\n size=\"small\"\n [disabled]=\"disabled\"\n (clickEvent)=\"searchAction()\"\n />\n }\n </ng-template>\n</p-toolbar>\n", styles: [":host ::ng-deep .p-toolbar{padding:4px!important;border-radius:0;border-left:none;border-right:none;overflow:visible}:host ::ng-deep .p-toolbar-end{flex-wrap:wrap;gap:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i1$7.Toolbar, selector: "p-toolbar", inputs: ["styleClass", "ariaLabelledBy"] }, { kind: "component", type: EfButtonComponent, selector: "ef-button", inputs: ["label", "labelKey", "icon", "severity", "size", "disabled", "rounded", "outlined", "raised", "text", "loading", "styleClass", "type", "badge", "badgeSeverity", "tooltip", "tooltipKey", "tooltipPosition"], outputs: ["clickEvent"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i7.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i8.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i9.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
2871
2870
|
}
|
|
2872
2871
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfToolbarComponent, decorators: [{
|
|
2873
2872
|
type: Component,
|
|
@@ -2931,7 +2930,7 @@ class EfBlockUiComponent {
|
|
|
2931
2930
|
isLoading = false;
|
|
2932
2931
|
contentPanel;
|
|
2933
2932
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfBlockUiComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2934
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfBlockUiComponent, isStandalone: true, selector: "ef-block-ui", inputs: { isLoading: "isLoading", contentPanel: "contentPanel" }, ngImport: i0, template: "@if (isLoading) {\n <p-blockUI\n [target]=\"contentPanel\"\n [blocked]=\"isLoading\"\n styleClass=\"appBlockUI w-full h-full fixed top-0 left-0 right-0 flex items-start justify-center bg-black/30 z-20\">\n\n <ng-template pTemplate=\"loader\">\n <!-- Loader Container -->\n <div class=\"mt-2 flex flex-row items-center space-x-4 rounded-lg bg-white px-4 py-2 shadow\">\n <!-- Spinning Loader -->\n <div class=\"h-6 w-6 animate-spin rounded-full border-2 border-primary border-t-transparent dark:border-primary-contrast dark:border-t-transparent\"></div>\n\n <!-- Loading Text -->\n <div id=\"loading-text\" class=\"font-normal text-primary dark:text-primary-contrast\">\n Chargement en cours... !\n </div>\n </div>\n </ng-template>\n </p-blockUI>\n}\n", styles: [":host ::ng-deep .p-overlay-mask{background:#13111126!important}:host ::ng-deep .p-blockui-mask{border-radius:none!important}\n"], dependencies: [{ kind: "ngmodule", type: BlockUIModule }, { kind: "component", type: i1$
|
|
2933
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfBlockUiComponent, isStandalone: true, selector: "ef-block-ui", inputs: { isLoading: "isLoading", contentPanel: "contentPanel" }, ngImport: i0, template: "@if (isLoading) {\n <p-blockUI\n [target]=\"contentPanel\"\n [blocked]=\"isLoading\"\n styleClass=\"appBlockUI w-full h-full fixed top-0 left-0 right-0 flex items-start justify-center bg-black/30 z-20\">\n\n <ng-template pTemplate=\"loader\">\n <!-- Loader Container -->\n <div class=\"mt-2 flex flex-row items-center space-x-4 rounded-lg bg-white px-4 py-2 shadow\">\n <!-- Spinning Loader -->\n <div class=\"h-6 w-6 animate-spin rounded-full border-2 border-primary border-t-transparent dark:border-primary-contrast dark:border-t-transparent\"></div>\n\n <!-- Loading Text -->\n <div id=\"loading-text\" class=\"font-normal text-primary dark:text-primary-contrast\">\n Chargement en cours... !\n </div>\n </div>\n </ng-template>\n </p-blockUI>\n}\n", styles: [":host ::ng-deep .p-overlay-mask{background:#13111126!important}:host ::ng-deep .p-blockui-mask{border-radius:none!important}\n"], dependencies: [{ kind: "ngmodule", type: BlockUIModule }, { kind: "component", type: i1$8.BlockUI, selector: "p-blockUI, p-blockui, p-block-ui", inputs: ["target", "autoZIndex", "baseZIndex", "styleClass", "blocked"] }, { kind: "directive", type: i2$5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }] });
|
|
2935
2934
|
}
|
|
2936
2935
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfBlockUiComponent, decorators: [{
|
|
2937
2936
|
type: Component,
|
|
@@ -3138,7 +3137,7 @@ class EfCheckboxComponent {
|
|
|
3138
3137
|
this.onTouched();
|
|
3139
3138
|
}
|
|
3140
3139
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3141
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfCheckboxComponent, isStandalone: true, selector: "ef-checkbox", inputs: { label: "label", labelKey: "labelKey", inputId: "inputId", name: "name", value: "value", binary: ["binary", "binary", booleanAttribute], required: ["required", "required", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute] }, ngImport: i0, template: "<p-checkbox\n [inputId]=\"effectiveId\"\n [name]=\"name\"\n [ngModel]=\"checked\"\n [ngModelOptions]=\"{standalone: true}\"\n (onChange)=\"handleChange($event)\"\n [value]=\"value\"\n [binary]=\"binary\"\n [disabled]=\"disabled\"\n/>\n@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" [for]=\"effectiveId\" styleClass=\"form-label-left\" />\n}\n@if (showRequired) {\n <small class=\"text-danger\">{{ 'validation.required' | translate }}</small>\n}\n@if (serverErrors; as errors) {\n @for (error of errors; track error) {\n <small class=\"text-danger block\">{{ error }}</small>\n }\n}\n", styles: [":host{display:inline-flex;align-items:center;gap:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i5.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EfLabelComponent, selector: "ef-label", inputs: ["label", "labelKey", "for", "styleClass", "required"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
3140
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfCheckboxComponent, isStandalone: true, selector: "ef-checkbox", inputs: { label: "label", labelKey: "labelKey", inputId: "inputId", name: "name", value: "value", binary: ["binary", "binary", booleanAttribute], required: ["required", "required", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute] }, ngImport: i0, template: "<p-checkbox\n [inputId]=\"effectiveId\"\n [name]=\"name\"\n [ngModel]=\"checked\"\n [ngModelOptions]=\"{standalone: true}\"\n (onChange)=\"handleChange($event)\"\n [value]=\"value\"\n [binary]=\"binary\"\n [disabled]=\"disabled\"\n/>\n@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" [for]=\"effectiveId\" styleClass=\"form-label-left\" />\n}\n@if (showRequired) {\n <small class=\"text-danger\">{{ 'validation.required' | translate }}</small>\n}\n@if (serverErrors; as errors) {\n @for (error of errors; track error) {\n <small class=\"text-danger block\">{{ error }}</small>\n }\n}\n", styles: [":host{display:inline-flex;align-items:center;gap:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i5$1.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EfLabelComponent, selector: "ef-label", inputs: ["label", "labelKey", "for", "styleClass", "required"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
3142
3141
|
}
|
|
3143
3142
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfCheckboxComponent, decorators: [{
|
|
3144
3143
|
type: Component,
|
|
@@ -3229,7 +3228,7 @@ class EfPasswordComponent {
|
|
|
3229
3228
|
this.onTouched();
|
|
3230
3229
|
}
|
|
3231
3230
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3232
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfPasswordComponent, isStandalone: true, selector: "ef-password", inputs: { label: "label", labelKey: "labelKey", inputId: "inputId", name: "name", placeholder: "placeholder", placeholderKey: "placeholderKey", size: "size", required: ["required", "required", booleanAttribute], fluid: ["fluid", "fluid", booleanAttribute], inline: ["inline", "inline", booleanAttribute], toggleMask: ["toggleMask", "toggleMask", booleanAttribute], feedback: ["feedback", "feedback", booleanAttribute], autocomplete: "autocomplete" }, outputs: { valueChangeEvent: "valueChangeEvent" }, host: { properties: { "class.ef-inline": "this.isInline" } }, ngImport: i0, template: "@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" [for]=\"effectiveId\" [required]=\"required\" />\n}\n<div class=\"ef-field-control\">\n <p-password\n [inputId]=\"effectiveId\"\n [name]=\"name\"\n [ngModel]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n (ngModelChange)=\"handleChange($event)\"\n (onBlur)=\"handleBlur()\"\n [toggleMask]=\"toggleMask\"\n [feedback]=\"feedback\"\n [placeholder]=\"effectivePlaceholder\"\n [size]=\"size\"\n [disabled]=\"disabled\"\n [attr.autocomplete]=\"autocomplete\"\n [class.ng-invalid]=\"isInvalid\"\n [class.ng-touched]=\"ngControl?.touched\"\n fluid\n />\n @if (showRequired) {\n <small class=\"text-danger\">{{ 'validation.required' | translate }}</small>\n }\n @if (serverErrors; as errors) {\n @for (error of errors; track error) {\n <small class=\"text-danger block\">{{ error }}</small>\n }\n }\n</div>\n", styles: [":host{display:block}:host(.ef-inline){display:flex;align-items:baseline;gap:.5rem}:host(.ef-inline)>label{white-space:nowrap;flex-shrink:0}:host(.ef-inline)>.ef-field-control{flex:1;min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: PasswordModule }, { kind: "component", type: i1$
|
|
3231
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfPasswordComponent, isStandalone: true, selector: "ef-password", inputs: { label: "label", labelKey: "labelKey", inputId: "inputId", name: "name", placeholder: "placeholder", placeholderKey: "placeholderKey", size: "size", required: ["required", "required", booleanAttribute], fluid: ["fluid", "fluid", booleanAttribute], inline: ["inline", "inline", booleanAttribute], toggleMask: ["toggleMask", "toggleMask", booleanAttribute], feedback: ["feedback", "feedback", booleanAttribute], autocomplete: "autocomplete" }, outputs: { valueChangeEvent: "valueChangeEvent" }, host: { properties: { "class.ef-inline": "this.isInline" } }, ngImport: i0, template: "@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" [for]=\"effectiveId\" [required]=\"required\" />\n}\n<div class=\"ef-field-control\">\n <p-password\n [inputId]=\"effectiveId\"\n [name]=\"name\"\n [ngModel]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n (ngModelChange)=\"handleChange($event)\"\n (onBlur)=\"handleBlur()\"\n [toggleMask]=\"toggleMask\"\n [feedback]=\"feedback\"\n [placeholder]=\"effectivePlaceholder\"\n [size]=\"size\"\n [disabled]=\"disabled\"\n [attr.autocomplete]=\"autocomplete\"\n [class.ng-invalid]=\"isInvalid\"\n [class.ng-touched]=\"ngControl?.touched\"\n fluid\n />\n @if (showRequired) {\n <small class=\"text-danger\">{{ 'validation.required' | translate }}</small>\n }\n @if (serverErrors; as errors) {\n @for (error of errors; track error) {\n <small class=\"text-danger block\">{{ error }}</small>\n }\n }\n</div>\n", styles: [":host{display:block}:host(.ef-inline){display:flex;align-items:baseline;gap:.5rem}:host(.ef-inline)>label{white-space:nowrap;flex-shrink:0}:host(.ef-inline)>.ef-field-control{flex:1;min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: PasswordModule }, { kind: "component", type: i1$9.Password, selector: "p-password", inputs: ["ariaLabel", "ariaLabelledBy", "label", "promptLabel", "mediumRegex", "strongRegex", "weakLabel", "mediumLabel", "maxLength", "strongLabel", "inputId", "feedback", "toggleMask", "inputStyleClass", "styleClass", "inputStyle", "showTransitionOptions", "hideTransitionOptions", "autocomplete", "placeholder", "showClear", "autofocus", "tabindex", "appendTo", "motionOptions", "overlayOptions"], outputs: ["onFocus", "onBlur", "onClear"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EfLabelComponent, selector: "ef-label", inputs: ["label", "labelKey", "for", "styleClass", "required"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
3233
3232
|
}
|
|
3234
3233
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfPasswordComponent, decorators: [{
|
|
3235
3234
|
type: Component,
|
|
@@ -3456,7 +3455,7 @@ class EfSelectButtonComponent {
|
|
|
3456
3455
|
this.onTouched();
|
|
3457
3456
|
}
|
|
3458
3457
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfSelectButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3459
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfSelectButtonComponent, isStandalone: true, selector: "ef-selectbutton", inputs: { label: "label", labelKey: "labelKey", options: "options", optionLabel: "optionLabel", optionValue: "optionValue", multiple: ["multiple", "multiple", booleanAttribute], allowEmpty: ["allowEmpty", "allowEmpty", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], size: "size", styleClass: "styleClass" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: ["item"], descendants: true }], ngImport: i0, template: "@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" />\n}\n<p-selectbutton\n [ngModel]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n (onChange)=\"handleChange($event)\"\n [options]=\"options\"\n [optionLabel]=\"optionLabel\"\n [optionValue]=\"optionValue\"\n [multiple]=\"multiple\"\n [allowEmpty]=\"allowEmpty\"\n [disabled]=\"disabled\"\n [size]=\"size\"\n [styleClass]=\"styleClass\"\n>\n @if (itemTemplate) {\n <ng-template let-item pTemplate=\"item\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\" />\n </ng-template>\n }\n</p-selectbutton>\n", dependencies: [{ kind: "ngmodule", type: SelectButtonModule }, { kind: "component", type: i1$
|
|
3458
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfSelectButtonComponent, isStandalone: true, selector: "ef-selectbutton", inputs: { label: "label", labelKey: "labelKey", options: "options", optionLabel: "optionLabel", optionValue: "optionValue", multiple: ["multiple", "multiple", booleanAttribute], allowEmpty: ["allowEmpty", "allowEmpty", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], size: "size", styleClass: "styleClass" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: ["item"], descendants: true }], ngImport: i0, template: "@if (labelKey || label) {\n <ef-label [labelKey]=\"labelKey\" [label]=\"label\" />\n}\n<p-selectbutton\n [ngModel]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n (onChange)=\"handleChange($event)\"\n [options]=\"options\"\n [optionLabel]=\"optionLabel\"\n [optionValue]=\"optionValue\"\n [multiple]=\"multiple\"\n [allowEmpty]=\"allowEmpty\"\n [disabled]=\"disabled\"\n [size]=\"size\"\n [styleClass]=\"styleClass\"\n>\n @if (itemTemplate) {\n <ng-template let-item pTemplate=\"item\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\" />\n </ng-template>\n }\n</p-selectbutton>\n", dependencies: [{ kind: "ngmodule", type: SelectButtonModule }, { kind: "component", type: i1$a.SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "styleClass", "ariaLabelledBy", "dataKey", "autofocus", "size", "fluid"], outputs: ["onOptionClick", "onChange"] }, { kind: "directive", type: i2$5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: EfLabelComponent, selector: "ef-label", inputs: ["label", "labelKey", "for", "styleClass", "required"] }] });
|
|
3460
3459
|
}
|
|
3461
3460
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfSelectButtonComponent, decorators: [{
|
|
3462
3461
|
type: Component,
|
|
@@ -3920,7 +3919,7 @@ class EfDatatableComponent {
|
|
|
3920
3919
|
return this.pTable?.filters;
|
|
3921
3920
|
}
|
|
3922
3921
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfDatatableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3923
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfDatatableComponent, isStandalone: true, selector: "ef-datatable", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, searchEntity: { classPropertyName: "searchEntity", publicName: "searchEntity", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null }, pt: { classPropertyName: "pt", publicName: "pt", isSignal: true, isRequired: false, transformFunction: null }, screenStateKey: { classPropertyName: "screenStateKey", publicName: "screenStateKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { editRow: "editRow", deleteRow: "deleteRow", duplicateRow: "duplicateRow", lazyLoad: "lazyLoad", rowSelect: "rowSelect" }, viewQueries: [{ propertyName: "pTable", first: true, predicate: ["pTable"], descendants: true }], ngImport: i0, template: "<p-table #pTable\n [value]=\"searchEntity()?.items || []\"\n [columns]=\"processedColumns()\"\n [dataKey]=\"mergedConfig.dataKey\"\n\n [lazy]=\"mergedConfig.lazy\"\n (onLazyLoad)=\"handleLazyLoad($event)\"\n\n [paginator]=\"mergedConfig.paginator\"\n [rows]=\"searchEntity()?.pagination?.pageSize || mergedConfig.rows\"\n [rowsPerPageOptions]=\"mergedConfig.rowsPerPageOptions\"\n [totalRecords]=\"searchEntity()?.totalCount || 0\"\n [first]=\"searchEntity()?.pagination ? (searchEntity()!.pagination!.pageNumber - 1) * searchEntity()!.pagination!.pageSize : 0\"\n\n [scrollable]=\"mergedConfig.scrollable\"\n [scrollHeight]=\"mergedConfig.scrollHeight\"\n\n [resizableColumns]=\"mergedConfig.resizableColumns\"\n [columnResizeMode]=\"mergedConfig.columnResizeMode\"\n\n [stateStorage]=\"mergedConfig.stateStorage\"\n [stateKey]=\"mergedConfig.stateKey\"\n\n [size]=\"mergedConfig.size\"\n [class]=\"mergedConfig.styleClass\"\n [tableStyle]=\"mergedConfig.tableStyle\"\n\n [currentPageReportTemplate]=\"searchEntity()?.totalCount ? 'Affichage de {first} a {last} sur {totalRecords} entrees' : mergedConfig.emptyMessage\"\n [showCurrentPageReport]=\"true\"\n [sortField]=\"sortField()\"\n [sortOrder]=\"sortOrder()\"\n [loading]=\"loading()\"\n\n [pt]=\"pt()\"\n\n selectionMode=\"single\" [(selection)]=\"selectedItem\">\n\n <!-- Header Template -->\n <ng-template #header>\n <tr>\n <!-- Action column at start if configured -->\n @if (mergedActions.show && mergedActions.position === 'start') {\n <th [class]=\"mergedActions.width\"></th>\n }\n\n <!-- Data columns -->\n @for (column of processedColumns(); track column.field) {\n @if (column.sortable && column.resizable) {\n <th\n [pSortableColumn]=\"column.field\"\n pResizableColumn\n [class]=\"column.width || ''\"\n [ngClass]=\"column.styleClass\">\n\n @if (column.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"column.headerTemplate; context: { $implicit: column }\"></ng-container>\n } @else {\n {{ column.header | translate }}\n <p-sortIcon [field]=\"column.field\" />\n }\n </th>\n } @else if (column.sortable) {\n <th\n [pSortableColumn]=\"column.field\"\n [class]=\"column.width || ''\"\n [ngClass]=\"column.styleClass\">\n\n @if (column.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"column.headerTemplate; context: { $implicit: column }\"></ng-container>\n } @else {\n {{ column.header | translate }}\n <p-sortIcon [field]=\"column.field\" />\n }\n </th>\n } @else if (column.resizable) {\n <th\n pResizableColumn\n [class]=\"column.width || ''\"\n [ngClass]=\"column.styleClass\">\n\n @if (column.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"column.headerTemplate; context: { $implicit: column }\"></ng-container>\n } @else {\n {{ column.header | translate }}\n }\n </th>\n } @else {\n <th\n [class]=\"column.width || ''\"\n [ngClass]=\"column.styleClass\">\n\n @if (column.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"column.headerTemplate; context: { $implicit: column }\"></ng-container>\n } @else {\n {{ column.header | translate }}\n }\n </th>\n }\n }\n\n <!-- Action column at end if configured -->\n @if (mergedActions.show && mergedActions.position === 'end') {\n <th [class]=\"mergedActions.width\"></th>\n }\n </tr>\n </ng-template>\n\n <!-- Body Template -->\n <ng-template #body let-rowData let-rowIndex=\"rowIndex\">\n <tr (dblclick)=\"handleEdit(rowData)\" style=\"cursor: pointer\"\n [pSelectableRow]=\"rowData\" [pSelectableRowIndex]=\"rowIndex\">\n <!-- Action column at start if configured -->\n @if (mergedActions.show && mergedActions.position === 'start') {\n <td>\n <ef-datatable-actionbar\n [context]=\"context()\"\n (edit)=\"handleEdit(rowData)\"\n (delete)=\"handleDelete(rowData)\"\n (duplicate)=\"handleDuplicate(rowData)\">\n </ef-datatable-actionbar>\n </td>\n }\n\n <!-- Data columns -->\n @for (column of processedColumns(); track column.field) {\n <td [ngClass]=\"getAlignmentClass(column.align)\">\n @if (column.template) {\n <ng-container *ngTemplateOutlet=\"column.template; context: { $implicit: rowData, column: column }\"></ng-container>\n } @else {\n {{ formatCellValue(rowData, column) }}\n }\n </td>\n }\n\n <!-- Action column at end if configured -->\n @if (mergedActions.show && mergedActions.position === 'end') {\n <td>\n <ef-datatable-actionbar\n [context]=\"context()\"\n (edit)=\"handleEdit(rowData)\"\n (delete)=\"handleDelete(rowData)\"\n (duplicate)=\"handleDuplicate(rowData)\">\n </ef-datatable-actionbar>\n </td>\n }\n </tr>\n </ng-template>\n</p-table>\n", styles: [":host{display:block}:host ::ng-deep .text-end{text-align:right!important}:host ::ng-deep .text-center{text-align:center!important}:host ::ng-deep .text-start{text-align:left!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i8.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i8.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "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", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "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: i2$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i2$3.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "directive", type: i2$3.ResizableColumn, selector: "[pResizableColumn]", inputs: ["pResizableColumnDisabled"] }, { kind: "component", type: i2$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EfDatatableActionBarComponent, selector: "ef-datatable-actionbar", inputs: ["context", "state", "duplicateButton", "editButton", "deleteButton"], outputs: ["duplicate", "edit", "delete"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3922
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfDatatableComponent, isStandalone: true, selector: "ef-datatable", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, searchEntity: { classPropertyName: "searchEntity", publicName: "searchEntity", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null }, pt: { classPropertyName: "pt", publicName: "pt", isSignal: true, isRequired: false, transformFunction: null }, screenStateKey: { classPropertyName: "screenStateKey", publicName: "screenStateKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { editRow: "editRow", deleteRow: "deleteRow", duplicateRow: "duplicateRow", lazyLoad: "lazyLoad", rowSelect: "rowSelect" }, viewQueries: [{ propertyName: "pTable", first: true, predicate: ["pTable"], descendants: true }], ngImport: i0, template: "<p-table #pTable\n [value]=\"searchEntity()?.items || []\"\n [columns]=\"processedColumns()\"\n [dataKey]=\"mergedConfig.dataKey\"\n\n [lazy]=\"mergedConfig.lazy\"\n (onLazyLoad)=\"handleLazyLoad($event)\"\n\n [paginator]=\"mergedConfig.paginator\"\n [rows]=\"searchEntity()?.pagination?.pageSize || mergedConfig.rows\"\n [rowsPerPageOptions]=\"mergedConfig.rowsPerPageOptions\"\n [totalRecords]=\"searchEntity()?.totalCount || 0\"\n [first]=\"searchEntity()?.pagination ? (searchEntity()!.pagination!.pageNumber - 1) * searchEntity()!.pagination!.pageSize : 0\"\n\n [scrollable]=\"mergedConfig.scrollable\"\n [scrollHeight]=\"mergedConfig.scrollHeight\"\n\n [resizableColumns]=\"mergedConfig.resizableColumns\"\n [columnResizeMode]=\"mergedConfig.columnResizeMode\"\n\n [stateStorage]=\"mergedConfig.stateStorage\"\n [stateKey]=\"mergedConfig.stateKey\"\n\n [size]=\"mergedConfig.size\"\n [class]=\"mergedConfig.styleClass\"\n [tableStyle]=\"mergedConfig.tableStyle\"\n\n [currentPageReportTemplate]=\"searchEntity()?.totalCount ? 'Affichage de {first} a {last} sur {totalRecords} entrees' : mergedConfig.emptyMessage\"\n [showCurrentPageReport]=\"true\"\n [sortField]=\"sortField()\"\n [sortOrder]=\"sortOrder()\"\n [loading]=\"loading()\"\n\n [pt]=\"pt()\"\n\n selectionMode=\"single\" [(selection)]=\"selectedItem\">\n\n <!-- Header Template -->\n <ng-template #header>\n <tr>\n <!-- Action column at start if configured -->\n @if (mergedActions.show && mergedActions.position === 'start') {\n <th [class]=\"mergedActions.width\"></th>\n }\n\n <!-- Data columns -->\n @for (column of processedColumns(); track column.field) {\n @if (column.sortable && column.resizable) {\n <th\n [pSortableColumn]=\"column.field\"\n pResizableColumn\n [class]=\"column.width || ''\"\n [ngClass]=\"column.styleClass\">\n\n @if (column.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"column.headerTemplate; context: { $implicit: column }\"></ng-container>\n } @else {\n {{ column.header | translate }}\n <p-sortIcon [field]=\"column.field\" />\n }\n </th>\n } @else if (column.sortable) {\n <th\n [pSortableColumn]=\"column.field\"\n [class]=\"column.width || ''\"\n [ngClass]=\"column.styleClass\">\n\n @if (column.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"column.headerTemplate; context: { $implicit: column }\"></ng-container>\n } @else {\n {{ column.header | translate }}\n <p-sortIcon [field]=\"column.field\" />\n }\n </th>\n } @else if (column.resizable) {\n <th\n pResizableColumn\n [class]=\"column.width || ''\"\n [ngClass]=\"column.styleClass\">\n\n @if (column.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"column.headerTemplate; context: { $implicit: column }\"></ng-container>\n } @else {\n {{ column.header | translate }}\n }\n </th>\n } @else {\n <th\n [class]=\"column.width || ''\"\n [ngClass]=\"column.styleClass\">\n\n @if (column.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"column.headerTemplate; context: { $implicit: column }\"></ng-container>\n } @else {\n {{ column.header | translate }}\n }\n </th>\n }\n }\n\n <!-- Action column at end if configured -->\n @if (mergedActions.show && mergedActions.position === 'end') {\n <th [class]=\"mergedActions.width\"></th>\n }\n </tr>\n </ng-template>\n\n <!-- Body Template -->\n <ng-template #body let-rowData let-rowIndex=\"rowIndex\">\n <tr (dblclick)=\"handleEdit(rowData)\" style=\"cursor: pointer\"\n [pSelectableRow]=\"rowData\" [pSelectableRowIndex]=\"rowIndex\">\n <!-- Action column at start if configured -->\n @if (mergedActions.show && mergedActions.position === 'start') {\n <td>\n <ef-datatable-actionbar\n [context]=\"context()\"\n (edit)=\"handleEdit(rowData)\"\n (delete)=\"handleDelete(rowData)\"\n (duplicate)=\"handleDuplicate(rowData)\">\n </ef-datatable-actionbar>\n </td>\n }\n\n <!-- Data columns -->\n @for (column of processedColumns(); track column.field) {\n <td [ngClass]=\"getAlignmentClass(column.align)\">\n @if (column.template) {\n <ng-container *ngTemplateOutlet=\"column.template; context: { $implicit: rowData, column: column }\"></ng-container>\n } @else {\n {{ formatCellValue(rowData, column) }}\n }\n </td>\n }\n\n <!-- Action column at end if configured -->\n @if (mergedActions.show && mergedActions.position === 'end') {\n <td>\n <ef-datatable-actionbar\n [context]=\"context()\"\n (edit)=\"handleEdit(rowData)\"\n (delete)=\"handleDelete(rowData)\"\n (duplicate)=\"handleDuplicate(rowData)\">\n </ef-datatable-actionbar>\n </td>\n }\n </tr>\n </ng-template>\n</p-table>\n", styles: [":host{display:block}:host ::ng-deep .text-end{text-align:right!important}:host ::ng-deep .text-center{text-align:center!important}:host ::ng-deep .text-start{text-align:left!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "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", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "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: i2$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i2$3.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "directive", type: i2$3.ResizableColumn, selector: "[pResizableColumn]", inputs: ["pResizableColumnDisabled"] }, { kind: "component", type: i2$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EfDatatableActionBarComponent, selector: "ef-datatable-actionbar", inputs: ["context", "state", "duplicateButton", "editButton", "deleteButton"], outputs: ["duplicate", "edit", "delete"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3924
3923
|
}
|
|
3925
3924
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfDatatableComponent, decorators: [{
|
|
3926
3925
|
type: Component,
|
|
@@ -4199,7 +4198,7 @@ class EfThemeConfiguratorComponent {
|
|
|
4199
4198
|
</div>
|
|
4200
4199
|
</div>
|
|
4201
4200
|
</div>
|
|
4202
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
4201
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "styleClass", "ariaLabelledBy", "dataKey", "autofocus", "size", "fluid"], outputs: ["onOptionClick", "onChange"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i3$2.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
4203
4202
|
}
|
|
4204
4203
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfThemeConfiguratorComponent, decorators: [{
|
|
4205
4204
|
type: Component,
|
|
@@ -4361,7 +4360,7 @@ class EfEmailMetricsCardComponent {
|
|
|
4361
4360
|
return 'warn';
|
|
4362
4361
|
}
|
|
4363
4362
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfEmailMetricsCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4364
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfEmailMetricsCardComponent, isStandalone: true, selector: "ef-email-metrics-card", inputs: { metrics: { classPropertyName: "metrics", publicName: "metrics", isSignal: true, isRequired: false, transformFunction: null }, recentEvents: { classPropertyName: "recentEvents", publicName: "recentEvents", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rangeChange: "rangeChange" }, ngImport: i0, template: "<p-card styleClass=\"ef-email-metrics-card\">\n <ng-template pTemplate=\"header\">\n <div class=\"ef-email-metrics-card__header\">\n <div>\n <h3 class=\"ef-email-metrics-card__title\">{{ title() }}</h3>\n @if (metrics(); as m) {\n <p class=\"ef-email-metrics-card__subtitle\">\n {{ m.from | date: 'dd MMM' }} \u2013 {{ m.to | date: 'dd MMM yyyy' }}\n </p>\n }\n </div>\n <p-selectButton\n [options]=\"rangeOptions\"\n [(ngModel)]=\"selectedRange\"\n optionLabel=\"label\"\n optionValue=\"value\"\n styleClass=\"ef-email-metrics-card__range\"\n (onChange)=\"onRangeChange($event.value)\"\n />\n </div>\n </ng-template>\n\n @if (metrics(); as m) {\n <div class=\"ef-email-metrics-card__kpis\">\n @for (kpi of kpis(); track kpi.label) {\n <div class=\"ef-email-metrics-card__kpi\" [attr.data-tone]=\"kpi.tone\">\n <span class=\"ef-email-metrics-card__kpi-label\">{{ kpi.label }}</span>\n <span class=\"ef-email-metrics-card__kpi-value\">\n @if (kpi.rate) {\n {{ kpi.value | number: '1.1-1' : 'fr' }}\n <span class=\"ef-email-metrics-card__kpi-unit\">%</span>\n } @else {\n {{ kpi.value | number: '1.0-0' : 'fr' }}\n }\n </span>\n </div>\n }\n </div>\n\n @if (m.categories.length > 0) {\n <div class=\"ef-email-metrics-card__section\">\n <h4 class=\"ef-email-metrics-card__section-title\">Par cat\u00E9gorie</h4>\n <p-table [value]=\"m.categories\" styleClass=\"ef-email-metrics-card__table\" [scrollable]=\"true\" scrollHeight=\"180px\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th>Cat\u00E9gorie</th>\n <th class=\"ef-email-metrics-card__num\">Envoy\u00E9s</th>\n <th class=\"ef-email-metrics-card__num\">Ouverts</th>\n <th class=\"ef-email-metrics-card__num\">Cliqu\u00E9s</th>\n <th class=\"ef-email-metrics-card__num\">Rebonds</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-row>\n <tr>\n <td class=\"ef-email-metrics-card__category\">{{ row.category }}</td>\n <td class=\"ef-email-metrics-card__num\">{{ row.sent }}</td>\n <td class=\"ef-email-metrics-card__num\">{{ row.opened }}</td>\n <td class=\"ef-email-metrics-card__num\">{{ row.clicked }}</td>\n <td class=\"ef-email-metrics-card__num\" [class.ef-email-metrics-card__num--danger]=\"row.bounced > 0\">{{ row.bounced }}</td>\n </tr>\n </ng-template>\n </p-table>\n </div>\n }\n\n @if (recentEvents().length > 0) {\n <div class=\"ef-email-metrics-card__section\">\n <h4 class=\"ef-email-metrics-card__section-title\">\u00C9v\u00E9nements r\u00E9cents</h4>\n <p-table [value]=\"recentEvents()\" styleClass=\"ef-email-metrics-card__table\" [scrollable]=\"true\" scrollHeight=\"240px\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th>Quand</th>\n <th>Destinataire</th>\n <th>Cat\u00E9gorie</th>\n <th>Type</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-row>\n <tr>\n <td class=\"ef-email-metrics-card__when\">{{ row.occurredAt | date: 'dd/MM HH:mm' }}</td>\n <td class=\"ef-email-metrics-card__recipient\">{{ row.recipient }}</td>\n <td>{{ row.category || '\u2014' }}</td>\n <td>\n <p-tag [severity]=\"kindSeverity(row.kind)\" [value]=\"row.kind\" styleClass=\"ef-email-metrics-card__kind\" />\n </td>\n </tr>\n </ng-template>\n </p-table>\n </div>\n }\n } @else {\n <div class=\"ef-email-metrics-card__empty\">\n <p-button label=\"Aucune donn\u00E9e encore\" [text]=\"true\" icon=\"pi pi-envelope\" [disabled]=\"true\" />\n </div>\n }\n</p-card>\n", styles: [":host{display:block}.ef-email-metrics-card__header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1rem 1.25rem 0;flex-wrap:wrap}.ef-email-metrics-card__title{margin:0;font-size:1rem;font-weight:600;letter-spacing:-.01em;color:var(--p-text-color)}.ef-email-metrics-card__subtitle{margin:.15rem 0 0;font-size:.8125rem;color:var(--p-text-muted-color)}.ef-email-metrics-card__range :global(.p-selectbutton){border-radius:999px}.ef-email-metrics-card__range :global(.p-selectbutton .p-button){border-radius:999px;padding:.25rem .75rem;font-size:.75rem}.ef-email-metrics-card__kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.75rem;padding:1rem 0}.ef-email-metrics-card__kpi{display:flex;flex-direction:column;gap:.25rem;padding:.85rem 1rem;border-radius:12px;background:var(--p-surface-50, #f8fafc);border:1px solid var(--p-surface-200, #e2e8f0)}.ef-email-metrics-card__kpi[data-tone=good]{background:color-mix(in srgb,var(--p-green-500, #10b981) 8%,transparent);border-color:color-mix(in srgb,var(--p-green-500, #10b981) 25%,transparent)}.ef-email-metrics-card__kpi[data-tone=warn]{background:color-mix(in srgb,var(--p-orange-500, #f97316) 8%,transparent);border-color:color-mix(in srgb,var(--p-orange-500, #f97316) 25%,transparent)}.ef-email-metrics-card__kpi-label{font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--p-text-muted-color)}.ef-email-metrics-card__kpi-value{font-size:1.5rem;font-weight:700;letter-spacing:-.02em;color:var(--p-text-color)}.ef-email-metrics-card__kpi-unit{font-size:.875rem;font-weight:500;margin-left:.125rem;color:var(--p-text-muted-color)}.ef-email-metrics-card__section{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--p-surface-200, #e2e8f0)}.ef-email-metrics-card__section-title{margin:0 0 .5rem;font-size:.8125rem;font-weight:600;color:var(--p-text-color)}.ef-email-metrics-card__table{font-size:.8125rem}.ef-email-metrics-card__num{text-align:right;font-variant-numeric:tabular-nums}.ef-email-metrics-card__num--danger{color:var(--p-red-600, #dc2626);font-weight:600}.ef-email-metrics-card__category{text-transform:capitalize;font-weight:500}.ef-email-metrics-card__recipient{font-family:JetBrains Mono,ui-monospace,monospace;font-size:.75rem;color:var(--p-text-muted-color)}.ef-email-metrics-card__when{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.75rem}.ef-email-metrics-card__kind{border-radius:999px;padding:.1rem .6rem;font-size:.7rem;letter-spacing:.02em}.ef-email-metrics-card__empty{padding:2rem 1.25rem;text-align:center;color:var(--p-text-muted-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i5$1.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "directive", type: i2$5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "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", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "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: "ngmodule", type: TagModule }, { kind: "component", type: i5$2.Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SelectButtonModule }, { kind: "component", type: i1$9.SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "styleClass", "ariaLabelledBy", "dataKey", "autofocus", "size", "fluid"], outputs: ["onOptionClick", "onChange"] }, { kind: "pipe", type: i8.DecimalPipe, name: "number" }, { kind: "pipe", type: i8.DatePipe, name: "date" }] });
|
|
4363
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EfEmailMetricsCardComponent, isStandalone: true, selector: "ef-email-metrics-card", inputs: { metrics: { classPropertyName: "metrics", publicName: "metrics", isSignal: true, isRequired: false, transformFunction: null }, recentEvents: { classPropertyName: "recentEvents", publicName: "recentEvents", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rangeChange: "rangeChange" }, ngImport: i0, template: "<p-card styleClass=\"ef-email-metrics-card\">\n <ng-template pTemplate=\"header\">\n <div class=\"ef-email-metrics-card__header\">\n <div>\n <h3 class=\"ef-email-metrics-card__title\">{{ title() }}</h3>\n @if (metrics(); as m) {\n <p class=\"ef-email-metrics-card__subtitle\">\n {{ m.from | date: 'dd MMM' }} \u2013 {{ m.to | date: 'dd MMM yyyy' }}\n </p>\n }\n </div>\n <p-selectButton\n [options]=\"rangeOptions\"\n [(ngModel)]=\"selectedRange\"\n optionLabel=\"label\"\n optionValue=\"value\"\n styleClass=\"ef-email-metrics-card__range\"\n (onChange)=\"onRangeChange($event.value)\"\n />\n </div>\n </ng-template>\n\n @if (metrics(); as m) {\n <div class=\"ef-email-metrics-card__kpis\">\n @for (kpi of kpis(); track kpi.label) {\n <div class=\"ef-email-metrics-card__kpi\" [attr.data-tone]=\"kpi.tone\">\n <span class=\"ef-email-metrics-card__kpi-label\">{{ kpi.label }}</span>\n <span class=\"ef-email-metrics-card__kpi-value\">\n @if (kpi.rate) {\n {{ kpi.value | number: '1.1-1' : 'fr' }}\n <span class=\"ef-email-metrics-card__kpi-unit\">%</span>\n } @else {\n {{ kpi.value | number: '1.0-0' : 'fr' }}\n }\n </span>\n </div>\n }\n </div>\n\n @if (m.categories.length > 0) {\n <div class=\"ef-email-metrics-card__section\">\n <h4 class=\"ef-email-metrics-card__section-title\">Par cat\u00E9gorie</h4>\n <p-table [value]=\"m.categories\" styleClass=\"ef-email-metrics-card__table\" [scrollable]=\"true\" scrollHeight=\"180px\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th>Cat\u00E9gorie</th>\n <th class=\"ef-email-metrics-card__num\">Envoy\u00E9s</th>\n <th class=\"ef-email-metrics-card__num\">Ouverts</th>\n <th class=\"ef-email-metrics-card__num\">Cliqu\u00E9s</th>\n <th class=\"ef-email-metrics-card__num\">Rebonds</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-row>\n <tr>\n <td class=\"ef-email-metrics-card__category\">{{ row.category }}</td>\n <td class=\"ef-email-metrics-card__num\">{{ row.sent }}</td>\n <td class=\"ef-email-metrics-card__num\">{{ row.opened }}</td>\n <td class=\"ef-email-metrics-card__num\">{{ row.clicked }}</td>\n <td class=\"ef-email-metrics-card__num\" [class.ef-email-metrics-card__num--danger]=\"row.bounced > 0\">{{ row.bounced }}</td>\n </tr>\n </ng-template>\n </p-table>\n </div>\n }\n\n @if (recentEvents().length > 0) {\n <div class=\"ef-email-metrics-card__section\">\n <h4 class=\"ef-email-metrics-card__section-title\">\u00C9v\u00E9nements r\u00E9cents</h4>\n <p-table [value]=\"recentEvents()\" styleClass=\"ef-email-metrics-card__table\" [scrollable]=\"true\" scrollHeight=\"240px\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th>Quand</th>\n <th>Destinataire</th>\n <th>Cat\u00E9gorie</th>\n <th>Type</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-row>\n <tr>\n <td class=\"ef-email-metrics-card__when\">{{ row.occurredAt | date: 'dd/MM HH:mm' }}</td>\n <td class=\"ef-email-metrics-card__recipient\">{{ row.recipient }}</td>\n <td>{{ row.category || '\u2014' }}</td>\n <td>\n <p-tag [severity]=\"kindSeverity(row.kind)\" [value]=\"row.kind\" styleClass=\"ef-email-metrics-card__kind\" />\n </td>\n </tr>\n </ng-template>\n </p-table>\n </div>\n }\n } @else {\n <div class=\"ef-email-metrics-card__empty\">\n <p-button label=\"Aucune donn\u00E9e encore\" [text]=\"true\" icon=\"pi pi-envelope\" [disabled]=\"true\" />\n </div>\n }\n</p-card>\n", styles: [":host{display:block}.ef-email-metrics-card__header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1rem 1.25rem 0;flex-wrap:wrap}.ef-email-metrics-card__title{margin:0;font-size:1rem;font-weight:600;letter-spacing:-.01em;color:var(--p-text-color)}.ef-email-metrics-card__subtitle{margin:.15rem 0 0;font-size:.8125rem;color:var(--p-text-muted-color)}.ef-email-metrics-card__range :global(.p-selectbutton){border-radius:999px}.ef-email-metrics-card__range :global(.p-selectbutton .p-button){border-radius:999px;padding:.25rem .75rem;font-size:.75rem}.ef-email-metrics-card__kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.75rem;padding:1rem 0}.ef-email-metrics-card__kpi{display:flex;flex-direction:column;gap:.25rem;padding:.85rem 1rem;border-radius:12px;background:var(--p-surface-50, #f8fafc);border:1px solid var(--p-surface-200, #e2e8f0)}.ef-email-metrics-card__kpi[data-tone=good]{background:color-mix(in srgb,var(--p-green-500, #10b981) 8%,transparent);border-color:color-mix(in srgb,var(--p-green-500, #10b981) 25%,transparent)}.ef-email-metrics-card__kpi[data-tone=warn]{background:color-mix(in srgb,var(--p-orange-500, #f97316) 8%,transparent);border-color:color-mix(in srgb,var(--p-orange-500, #f97316) 25%,transparent)}.ef-email-metrics-card__kpi-label{font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--p-text-muted-color)}.ef-email-metrics-card__kpi-value{font-size:1.5rem;font-weight:700;letter-spacing:-.02em;color:var(--p-text-color)}.ef-email-metrics-card__kpi-unit{font-size:.875rem;font-weight:500;margin-left:.125rem;color:var(--p-text-muted-color)}.ef-email-metrics-card__section{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--p-surface-200, #e2e8f0)}.ef-email-metrics-card__section-title{margin:0 0 .5rem;font-size:.8125rem;font-weight:600;color:var(--p-text-color)}.ef-email-metrics-card__table{font-size:.8125rem}.ef-email-metrics-card__num{text-align:right;font-variant-numeric:tabular-nums}.ef-email-metrics-card__num--danger{color:var(--p-red-600, #dc2626);font-weight:600}.ef-email-metrics-card__category{text-transform:capitalize;font-weight:500}.ef-email-metrics-card__recipient{font-family:JetBrains Mono,ui-monospace,monospace;font-size:.75rem;color:var(--p-text-muted-color)}.ef-email-metrics-card__when{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.75rem}.ef-email-metrics-card__kind{border-radius:999px;padding:.1rem .6rem;font-size:.7rem;letter-spacing:.02em}.ef-email-metrics-card__empty{padding:2rem 1.25rem;text-align:center;color:var(--p-text-muted-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i5$2.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "directive", type: i2$5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "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", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "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: "ngmodule", type: TagModule }, { kind: "component", type: i5$3.Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SelectButtonModule }, { kind: "component", type: i1$a.SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "styleClass", "ariaLabelledBy", "dataKey", "autofocus", "size", "fluid"], outputs: ["onOptionClick", "onChange"] }, { kind: "pipe", type: i1$3.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$3.DatePipe, name: "date" }] });
|
|
4365
4364
|
}
|
|
4366
4365
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EfEmailMetricsCardComponent, decorators: [{
|
|
4367
4366
|
type: Component,
|